@charset "UTF-8";
/* CSS Document */

body{ font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; margin: 0; padding: 0; height:100%;}

body { overflow-x: hidden; } 

ｐ{display:inline;}
.w{width:100%}
.w80{width:80%}
.w10{width:80%}
.mm100{padding-bottom:1%}
#drtlinkin li{ list-style-type: none; background-size: auto auto; background-position: left center; }
#example li{ list-style-type: none; background-size: auto auto; background-position: left center; }
#content li{ list-style-type: none; background-size: auto auto; background-position: left center; }
.clr{clear:both}
.fl{float:left;}

img{padding:0; margin:0}

/* --------------------------------
.MAIN IMAGE
-------------------------------- */

#section01{position: relative;}
#section01 .image img {margin: -67px 0 0 -67px;}
.section{ background-image: url(../../img/top/rollimg.html)!important; background-position: center top; background-repeat: no-repeat; background-size: cover; -moz-background-size:cover; width: 100%; position: relative;}
.section img {position: absolute; left: 50%;}

#main{position: relative;}

#shizuru{ z-index: 1000; top: -100px;}

#r_sns{ width: 100%; text-align: left; margin-top: -3px; background-color: #6E330D; padding-top: 5px; padding-bottom: 5px }

#contents{padding-bottom:140px;   /*フッターの高さと同じ*/}


/* --------------------------------
.TOP BANNER and narrow
-------------------------------- */

#top_logo{ position: absolute; top: 10%; left: 5%;  z-index: 1003}
#top_logo img {max-width: 100%; height: auto;}
#y_logo{ position: absolute; top: 20px; left: 20px;  z-index: 1002}


#section01 .narrow{ position: absolute;  bottom:10%;  left:50%}


#logo_roll_in{ position: absolute; left: 50%; margin-left:-180px; margin-top:20px; z-index:1003; }
#logo_roll_in img{ width:60%; height:auto;}

/* --------------------------------
.NAVI
-------------------------------- */

.navi{position: absolute; top: 0; right: 18px; display: none; width: 140px; }
.navi .navi_cont{position: relative; padding-top:30px; right:0;}
.navi ul li{display: inline-block; margin-right: 9px;}
.navi ul li a,
.navi .close
{color: #ffffff; text-decoration: none; display: block;}
.navi ul li {margin-top:-3px;}
.navi .close{position: absolute; top: 0; right:0; color: #ffffff; text-decoration: none; display: block; text-align:center; z-index: 1001; background-color: #561c20; width: 140px; padding:10px 0;}
a.open{ position: fixed; position: absolute; top: 0; right: 20px; color: #ffffff; text-decoration: none; display: block; text-align: center; z-index: 1010; background-color: #561c20; width: 140px; padding: 10px 0; }
#sub{ position: relative; z-index: 1015; }

/* --------------------------------
.NEWS枠
------------------------------ */


#example_ww{width:100%; background-color:#F4F9B6;}
#example_w{ margin-left: 2%; width: 80%; z-index: 1005; background-color: #F4F9B6; font-size: 1em; color: #561c20; background-image: url(../../img/top/mayuge.html); background-position: top left; background-repeat: no-repeat; padding-left: 100px; }


#example{padding-left:10px; min-height:110px; height:auto !important; height:110px;}
#example a:link{ color: #561c20; }
#example .day{ color: #f00; padding-right: 10px; background-size: 100% auto;}


/* --------------------------------
キャンペーン枠
------------------------------ */
#cam{width:100%}

.bo_d{
    border-bottom: 2px dashed #FFFFFF;
    background-color: #F9CF00;
}


/* --------------------------------
コンテンツ枠
------------------------------ */
#content{width:100%; margin: 0 auto; text-align:center; background-color: #F4F9B6; }
.btn_0 img{ width: 23%; height: auto; padding: 1%; float: left;}
.btn_1 img{ width: 23%; height: auto; padding: 1%; float:left;}
.btn_2 img{ width: 23%; height: auto; padding: 1%; float:left;}
.btn_3 img{ width: 23%; height: auto; padding: 1%; float:left;}

#drtlinkin li{display:inline;}


#comi{ width: 100%; background-color: #FFF6C9; color: #5A2520; font-size: 1.2em; padding-top: 20px; padding-bottom: 20px; position: relative; margin-top: -3px; }

/* #comi_title{ width: 661px; height: 105px; position: absolute; left: 20%; top:1%; }
 #comi_title{ width: 512px; height: 45px; position: absolute; left: 28%; top:1%; } 20150928 old nakajima*/

.textarea{width:60%; float:left; text-align:left;}

#comi_title{width: 507px; margin-top:30px; height:100px; text-align:center; position:absolute; left:50%; margin-left:-261px; display:block;}
/* #comi_title{margin-top:50px; height:100px; text-align:center; position:absolute; left:50%; margin-left:-261px; display:block;}  20150928 old nakajima*/

#textarea{width:85%; margin-left:auto; margin-right:auto; margin-top:150px;}
/* #textarea{width:85%; margin-left:auto; margin-right:auto; margin-top:150px;}  20150928 old nakajima*/


/* --------------------------------
セカンドページ　コンテンツ枠
------------------------------ */
#m_continer{ margin-top: 20px;  width: 100%; background-attachment: scroll; background-position: center 20px; }
#m_continer img{ display: block; background-origin: padding-box; }
#contents{width:890px; margin-left:auto; margin-right:auto; position:relative}

#drt{width:100%; background-color:#58251a;}
#drtlinkin{width: 890px;padding-top:10px;  padding-bottom:15px; height:8px;}
#drt li{ font-size:0.9em;  float: left; list-style-type: none; padding-right:10px; color:#ffffff  }
#drt li a{ font-size:0.9em; color:#ffffff; text-decoration:none}
#drt li a:hover{ color:#fff000;}
/* --------------------------------
フッター枠
------------------------------ */
#footer{ width: 100%; padding-top:15px;  padding-bottom:15px; text-align: center; background-color: #663300; color:#ffffff;}


#footer_top{ width: 100%; padding-top:15px;  padding-bottom:15px; text-align: center; background-color: #663300; color:#ffffff;}

/* --------------------------------
おみやげ枠
------------------------------ */

#omiyage{ width: 100%; background-color: #FBCB37; padding-bottom:5%;}
#omiyage .tle{width:42%; height:auto; margin-left:auto; margin-right:auto; padding-top:2%; margin-bottom:1%;}

#omiyage #omi_wrap{ width:80%; margin-left:auto; margin-right:auto; atuo; background-color: #E43C3F; }
#omiyage .btn{width:19%; height:auto; float:left}
#omiyage .mm10{margin-left:9%;}
#omiyage .mm8{margin-left:2%;}



/* --------------------------------
コメント枠
------------------------------ */

#btn_l_p{visibility:visible;}


p{margin:0; padding:0;}

img{
     display:block;
}

/* --------------------------------
コメント枠
------------------------------ */

#back_s{display:block; padding:2%; background-color:#FFF6C9}
#back_s a{color:#ffffff;}
#back_s a:visited{color:#ffffff;}

#btn_l_s{display:none}
#btn_l_p{visibility:visible}

.back{display:block; padding:2%; background-color:##FFF6C9}
.back a{color:#ffffff; font-size:3em}
.back a:visited{color:#ffffff;}

/* --------------------------------
block 解除
------------------------------ */
.img_non{ display: inline !important; }

/* --------------------------------
SPコメントフォーム
------------------------------ */
    #msg p {
        margin: 8px 0;
    }
#msg .seibetu{
    font-size: 22px;
    margin: 20px 0 30px;
}
    #msg .selectWrap{
        width: 50%;
        position: relative;
        display: inline-block;
    }
    #msg select {
        display: block;
        width: 100%;
        height: 60px;
        font-size: 18px;
        display: block;
        margin: 10px 0 8px;
        background: #fff;
        -webkit-appearance: none;
        appearance: none;
        padding: 0 10px;
        position:relative;
    }
    .selectWrap::after {
        content: '';
        width: 6px;
        height: 6px;
        border: 0px;
        border-bottom: solid 2px #555;
        border-right: solid 2px #555;
        -ms-transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        position: absolute;
        top: 50%;
        right: 10px;
        margin-top: -4px;
    }
    .select {
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      width: 100%;
      height: 40px;
      background: transparent;
      position: relative;
      z-index: 1;
      padding: 0 40px 0 10px;
      border: 1px solid #555;
      border-radius: 2px;
    }
    select::-ms-expand {
        display: none;
    }
    #msg a{
        word-break: break-all;
    }
    #msg #come input[type="button"] {
        width: 80%;
        height: 70px;
        font-size: 20px;
        line-height: 70px;
        text-align: center;
        display: inline-block;
        -webkit-border-radius: 5px;
        border-radius: 5px;
        text-decoration: none;
        margin: 30px auto 40px;
        background: #fff;
        -webkit-appearance: none;
        appearance: none;
    }