@charset "UTF-8";

/* public ====================*/
p {line-height: 1.8rem;font-size:1.2rem;margin:0;color:#333;}
small {font-size: 0.8em;}
/* Micro Clearfix [ IE9 Hack ] */
@media screen and (min-width: 0\0) and (min-resolution: .001dpcm){.cf--ie9:before, .cf--ie9:after{content:"";display:table;}}/*IE9*/
@media screen and (min-width: 0\0) and (min-resolution: .001dpcm){.cf--ie9:after{clear:both;}}/*IE9*/
@media screen and (min-width: 0\0) and (min-resolution: .001dpcm){.cf--ie9{zoom:1;}}/*IE9*/
body{padding:0; margin:0; color:#333; width:100%; height:100%; font-family:-apple-system, BlinkMacSystemFont, "メイリオ", meiryo , "Hiragino Kaku Gothic ProN" , sans-serif;word-break: break-all; font-size:1em; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;min-width: 1200px;}
.ta-c{text-align: center;}
img {
	width: 100%;
	height: auto;
}
ul{list-style-type: none;margin:0;padding:0;}



.flex {
	display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex;
	-webkit-justify-content:center; -ms-flex-pack:center; justify-content:center;
	align-items: center;
}

div{width:100%;}




/* public ====================*/


.wrap {
     overflow: hidden;
 }
/* FlexBox */
.flex{display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex;}
.flex-wrap{-ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;}
.flex-horizon--end{-webkit-justify-content:flex-end; -ms-flex-pack:end; justify-content:flex-end;}
.flex-horizon--ctr{-webkit-justify-content:center; -ms-flex-pack:center; justify-content:center;}
.flex-horizon--between{-webkit-justify-content:space-between; -ms-flex-pack:space-between; justify-content:space-between;}
.flex-vertical--end{-webkit-align-items:flex-end; -ms-align-items:flex-end; align-items:flex-end;}
.flex-vertical--ctr{-webkit-box-align:center; -ms-flex-align:center; -webkit-align-items:center; align-items:center;}
.flex-direction--reverse{-ms-flex-direction:row-reverse; -webkit-flex-direction:row-reverse; flex-direction:row-reverse;}
/* Plan Header =====================*/
.logo-wrap{position: relative;z-index: 100000;}
.logo{position: absolute;z-index: 1111111;top:0;}
header{
    background-image:url("../img/bg.jpg");
    height: 105px;
    /*box-shadow: 2px 2px 2px #8e6d00;*/
    position: fixed;
    z-index: 1000;
    width:100%;
    box-shadow: 0 0 4px rgb(0 0 0 / 50%);
}
.header__inner{max-width:1200px;margin:0 auto;display: flex;justify-content: space-between;}
h1{max-width: 297px;margin:0;}
.header_nav {
  display: flex;
  padding-top: 1.3rem;
}
.visual{margin-top:-20px;background-image:url("../img/bg.jpg");position: relative;}
.visual__hachi{background-image: url("../img/main_v.png");background-repeat: no-repeat;background-position: top center;height: 940px;position: relative;}
.visual__inner{  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;}
.visual__title{color:#fff;text-align: center;font-size: 3rem;letter-spacing:0.5rem;line-height: 4rem;text-shadow: 4px 4px 5px #723d00;}

.sub_title{margin-top:105px;background-image:url("../img/bg.jpg");}
.sub_titile_bg_pc{background-image:url("../img/sub_title_bg_pc.png");background-repeat: no-repeat;background-position: top center;position: relative;height: 300px;}
.sub_titile_bg_sp{}
.sub_titile_bg_pc .visual__title{padding-top:5rem;}

.about{background-image:url("../img/bg.jpg");padding:3rem 0;}
.about__inner{position: relative;max-width:1200px;margin:0 auto;}
.h3_box{text-align:center;}
.h3_box h3{font-size:2.4rem;color:#333;letter-spacing: 0.3rem;}
.h3_box h3 span{display: block;font-size: 1rem;margin-top: 0.5rem;color: #9a5518;font-weight: normal;}
p.hd{text-align: center;font-size: 1.6rem;line-height: 2.5rem;margin-bottom: 4.5rem;}
.btn_about{max-width: 500px;display: block;margin:0 auto;}
.yohena{max-width: 575px;position: absolute;top:20px;left:-320px;}
.map_pc{max-width: 609px;position: absolute;top:-100px;right:-300px;display:block}
.map_sp{display:none;}

.product{padding:3rem 0;}
.p_list{margin: 5rem auto 4rem;max-width: 1000px;display: flex;justify-content:space-between ;}
.p_list li{width:27%;}
.p_list li dl{margin: 0;}
.p_list li dt{margin-bottom: 0.5rem;}
.p_list li dl dd{margin: 0;}
p.p-title{text-align: center;font-size: 1rem;line-height: 1.5rem;margin-bottom: 0.5rem}
p.p-price{text-align: center;font-weight: bold;color:#9a5518;}
.p_btn{margin: 2rem auto;max-width: 860px;display: flex;justify-content:space-between ;}
.p_btn li{position: relative;}
.p_btn li:hover:before {content: url(../img/hachi.png);position: absolute;top:-26%;left:-10%;}
.hny_btn{position: relative;max-width: 500px;margin: 0 auto;}
.hny_btn:hover:before {content: url(../img/hachi.png);position: absolute;top:-26%;left:-8%;}

.ig{background-image:url("../img/bg.jpg");padding:3rem 0;}
.btn_ig{max-width: 500px;display: block;margin:0 auto;}

.top_inq{background-image:url("../img/inq_bg.png");padding:3rem 0;background-repeat: no-repeat;background-position: top center;}
.top_inq p{text-align: center;margin-bottom: 3rem;}
.btn_inq{max-width: 500px;display: block;margin:0 auto;}

footer{position: relative;padding:2rem 0;}
.footer__inner{width: 1200px;margin: 0 auto;position: relative;}
footer::before{content: url(../img/bg_l.png);position: absolute;top:0;left:0;z-index:-9999;}
footer::after{content: url(../img/bg_r.png);position: absolute;bottom:0;right:0;z-index:-10000;}
h4.h4_footer{text-align: center;font-size: 1.6rem;line-height: 2.5rem;margin-bottom: 3rem;color:#333;font-weight:normal}
.footer_logo{width: 183px;display: block;margin: 0 auto 5rem;}
.footer_nav{margin: 3rem auto 1rem;max-width: 645px;display: flex;justify-content: center;position: relative;}
.footer_nav li a::before{content: url(../img/v-point.png);position: absolute;left:0;}
.footer_nav li a{text-decoration: none;color:#9a5518;text-align: center;display: block;padding: 0 2rem;position: relative;z-index: 10000;background-color: rgba(255,255,255,0.7);}
.footer_nav li:last-child a::after{content: url(../img/v-point.png);position: absolute;right:0;}
.bottle{width: 1200px;margin: 0 auto;position: relative;top:-50px;}
.bottle-img{width: 156px;position: absolute;left: 5%;top:-80px;}
.footer__sns{width: 150px;display: flex;justify-content: space-between; position: absolute;right: 3%;top:0;z-index: 1000;}

small{background-color: #f9f9e0;display: block;height: 50px;line-height: 50px;text-align: center;}


.sub{background-image:url("../img/bg.jpg");padding:3rem 0;}
.sub__inner{position: relative;max-width:1200px;margin:0 auto;}

.pankuzu{display: flex;margin-bottom: 2.4rem;}
.pankuzu li{padding-right: 0.5rem;}
.pankuzu li a{color:#9a5518;}
.pankuzu li i{color:#9a5518;}
.pankuzu li a:visited{color:#9a5518;}

.about__txt{margin-bottom:5rem;display:flex;}
.about__txt li:first-child{width:66%;margin-right: 4rem;}
.about__txt li p{margin-bottom: 2rem;}

img.img_kodawari{width:90%;max-width: 650px;display: block;margin:0 auto 1rem;}
p.caption{text-align: center;}
dl.kodawari{margin:4rem 0;}
dl.kodawari dt{color: #9a5518;font-size: 1.4rem;background-image: url("../img/line.png");background-position: center bottom;background-repeat: no-repeat;letter-spacing: 0.1rem;padding-bottom: 0.75rem;margin-bottom: 1rem;}
dl.kodawari dd{font-size: 1.2rem;margin: 0 0 3rem 0;}
.card{max-width: 755px;width: 90%;margin:3rem auto 2rem;background-color: #fff;text-align: center;padding:2rem 3rem;}
.card img{max-width:174px;}
.adtel{font-weight: bold;margin:0.5rem 0;}
p.caution{background-color: #f8eaea;padding:0.5rem 0;}

dl.shop_list{margin:4rem 0;}
dl.shop_list dt{color: #9a5518;font-size: 1.4rem;background-image: url("../img/line.png");background-position: center bottom;background-repeat: no-repeat;letter-spacing: 0.1rem;padding-bottom: 0.75rem;margin-bottom: 1rem;}
dl.shop_list dd{font-size: 1.2rem;margin: 0 0 3rem 0;}
dl.shop_list dd p span img.icon_spot{width:16px;padding-right:0.5rem;padding-left:0.23rem;}
dl.shop_list dd p a img.map_btn{width:78px;padding-left: 1rem;vertical-align:middle;}
dl.shop_list dd p span img.icon_tel{width:22px;padding-right:0.5rem;}
dl.shop_list dd p span img.icon_hp{width:23px;padding-right:0.5rem;}
dl.shop_list dd p span{vertical-align:middle;}
dl.shop_list dd p a{text-decoration: none;color:#333;}
h3.clr_brwn{color: #9a5518;font-weight: normal;}

input[type=submit]{
 background-image:url("../img/submit.png");
 background-repeat:no-repeat;
 border:none;
 width:284px;
 height:55px;
 cursor: pointer;
text-indent: 1000px;
    background-color: #fff;
    margin:0 auto;
    display: block;
}
.form{max-width: 900px;margin: 0 auto 5rem;background-color: #fff;padding: 3rem;;}
h4.h4_form{letter-spacing: 0.25rem;text-align: center;position: relative;margin-bottom: 4rem;}
h4.h4_form::after{position: absolute;
  bottom: -15px;
  left: calc(50% - 30px);
  width: 60px;
  height: 2px;
  content: '';
  border-radius: 3px;
  background: #a5814c;}
  dl.form_parts{display: flex;flex-wrap: wrap;}
  dl.form_parts dt{width: 25%;margin-bottom: 2rem;}
  dl.form_parts dd{width: 75%;margin-bottom: 2rem;}
  input[type=text]{width:80%!important}
textarea{width:100%!important;height:150px!important;}
dl.form_parts dt span{background-color:#c70a0a ;color:#fff;padding:1px 3px;font-size:80%;vertical-align: middle;margin-left: 0.5rem;}

/* Operation(fixed) =============*/
.operation{position: fixed; bottom:0; left:0; z-index:997; width:100%;}
.operation__arrow{position:absolute; bottom:5px; right:1%; width:78px; height:58px;}
.operation__arrow a{color:#fff; display:block;}

/* onlineshopping(fixed) =============*/
.online-float{position: fixed; bottom:0; left:1%; z-index:800; max-width:223px;}
.online-float a{width: 223px;display: block;}


.nav{display:none}
.footer_nav_sp{display:none;}

.form-check-input:checked {
    background-color: #e2b001!important;
    border-color: #e2b001!important;
}

/* Responsive =====================*/
/* MIN */
@media (min-width:881px){
    .hamburger{
        display: none;
    }
    .black_bg{
        display: none;
    }
}
/* MAX */
@media (max-width:1450px){

  }
@media (max-width:1200px){
  body{min-width:auto;}
  .map_sp{max-width: 398px;position: absolute;top:0px;right:-100px;display: block;}
  .map_pc{display:none;}
  .footer__inner {
    width: 100%;
    margin: 0 auto;
    position: relative;
}
.bottle {
  width: 100%;
}
  }
@media (max-width:1024px){

  }
@media (max-width:880px){
  p {line-height: 1.4rem;font-size:1rem;}
  .nav {
    display: block;
    position: fixed;
    left: 0;
    top: -100%;
    width: 100%; /* スマホに収まるサイズ */
    height: 100vh;
    transition: all .6s;
    z-index: 910;
    overflow-y: auto; /* メニューが多くなったらスクロールできるように */
  }
  .nav_inner{
    padding-top: 120px;
    background-color: #f3f5e8;
  }
  .hamburger {
    position: fixed;
    right: 15px;
    top: 4px;
    width: 40px; /* クリックしやすい幅 */
    height: 40px; /* クリックしやすい高さ */
    cursor: pointer;
    z-index: 3000000;
    display: flex;
    align-items: flex-end;
  }
  .nav_list {
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .nav_item {
    text-align: left;

    border-bottom: 1px solid #9a5518;
  }
  .nav_item a {
    display: block;
    padding: 1rem 2rem;

    text-decoration: none;
    color: #9a5518;
  }
  .nav_item a i{
      margin-right: 5px;
  }
  .nav_item:hover {
    background-color: #eee;
  }
  .hamburger_border {
    position: absolute;
    left: 5px;
    width: 30px;
    height: 4px;
    background-color: #9a5518;
    border-radius: 4px;
    transition: all .6s;
  }
  .hamburger_border_top {
    top: 14px;
  }
  .hamburger_border_center {
    top: 22px;
  }
  .hamburger_border_bottom {
    top: 30px;
  }
  .hamburger_text{
      width: 40px;
      color: #9a5518;
      font-size: 10px;
      font-weight: bold;
      text-align: center;
      margin-bottom: -17px;
  }
  .hamburger_text.is-open{
      display: none;
  }
  .black_bg {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    z-index: 900;
    background-color: #333;
    opacity: 0;
    visibility: hidden;
    transition: all .6s;
    cursor: pointer;
  }

  /* 表示された時用のCSS */
  .nav-open .nav {
    top: 0;
  }
  .nav-open .black_bg {
    opacity: .8;
    visibility: visible;
  }
  .nav-open .hamburger_border_top {
    transform: rotate(45deg);
    top: 20px;
  }
  .nav-open .hamburger_border_center {
    width: 0;
    left: 50%;
  }
  .nav-open .hamburger_border_bottom {
    transform: rotate(-45deg);
    top: 20px;
  }
  .nav-open .hamburger_text.is-close{
    display: none;
  }
  .nav-open .hamburger_text.is-open{
    display: block;
  }

.nav h3{padding: 0 2rem 1rem;border-bottom: 1px solid #9a5518;margin:0;}
  .header_nav{display:none;}
header{height: 65px;}
h1{max-width: 200px;position: relative;z-index: 10;}
.visual__hachi {

  background-size: cover;
  height: 416px;
}
.visual__title {

  font-size: 1.6rem;
  letter-spacing: 0.25rem;
  line-height: 2.3rem;
}
.visual__title br{display: none;}
.visual__title span{display: block;}
p.hd{font-size: 1.4rem;line-height: 2.3rem;margin-bottom: 2.8rem;}
.map_sp{max-width: 398px;position: absolute;top:35%;right:0px;}
.yohena{max-width: 430px;width:60%;position: static ;top:20px;left:-320px;}
.btn_about{margin:40% auto 0;}

  footer::before {
    content: url(../img/bg_l_sp.png);
}
footer::after {
  content: url(../img/bg_r_sp.png);
}
.footer_nav {
  display:none;
}
.footer_nav_sp{display:table;
  width: 100%;
}
.footer_nav_sp li{width: 50%;display: table-cell;border: solid 1px #9a5518;height:30px;vertical-align: middle;background-color:#f3f5e8 ;padding: 0.5rem 1rem;}
.footer_nav_sp li a{text-decoration: none;color: #723d00;}
.footer_nav_sp li a i{margin-right: 0.5rem;}


.bottle {
  top: 0px;
  display: flex;
  margin-bottom: 3rem;
}
.bottle-img {
  width: 156px;
 display: block;
}
.footer__sns {
  width: 150px;
  position: static;
  margin: 0 auto;
}
small {
  height: 150px;
  line-height: 150px;
}
.online-float{ max-width:178px;}
        .online-float a {
    width: 178px;
}
.online-float img {

}

.sub_titile_bg_pc {
  background-image: url("../img/sub_title_bg_pc.png");
  background-size:250%;
  position: relative;
  height: 280px;
  margin-top:-40px;
}
.sub_titile_bg_pc .visual__title {
  padding-top: 4rem;
}
p.hd br{display: none;}
p.hd span{display: block;}
.about__txt {
  margin-bottom: 2rem;
  display: block;
  padding:0 2rem;
}
.about__txt li:first-child{width: 100%;margin: 0;}
.pankuzu {
  padding: 0 1rem;
}
.card {
  max-width: 600px;
  padding: 2rem 1rem;
}
p.caution {
  font-size: 0.75rem;
  line-height: 1rem;
  padding: 0.5rem;
}
dl.kodawari dt {
  font-size: 1.2rem;
}
dl.kodawari dd {
  font-size: 1rem;
  margin: 0 0 3rem 0;
}
dl.shop_list dt {
  font-size: 1.2rem;
}
dl.shop_list dd {
  font-size: 1rem;
  margin: 0 0 3rem 0;
}
dl.shop_list dd p a img.map_btn{width:40px;padding-left:0.5rem;}
dl.shop_list dd p span img.icon_spot{width:10px;padding-right:0.4rem;padding-left:0.23rem;}
dl.shop_list dd p span img.icon_tel{width:16px;padding-right:0.25rem;}
dl.shop_list dd p span img.icon_hp{width:16px;padding-right:0.25rem;}

}
@media (max-width:768px){
.p_btn li{width: 48%;}
  }
@media (max-width:700px){
.product p.ta-c br{display: none;}
.sub {
  padding: 1rem 0;
}
dl.form_parts {
  display: block;
}
dl.form_parts dt{margin-bottom: 0.5rem;width:100%}
dl.form_parts dd {
  width: 100%;
}
input[type="text"] {
  width: 100%!important;
}
  }
@media (max-width:640px){

    p {
        line-height: 1.3rem;
        font-size: 0.8rem;
    }

      dl.kodawari dt {
          font-size: 1rem;
      }
      dl.kodawari dd{font-size: 0.8rem;}
.pankuzu li{font-size: 0.8rem;}
section{padding-left:1rem!important;padding-right:1rem!important;}
.p_list {
  margin: 2rem auto;
  max-width: 1000px;
  display: block;
}
.p_list li {
  width: 100%;
  margin-bottom: 1.5rem;
}
.p_list li dl {
  display: table;
}
.p_list li dt {
  display: table-cell;
  width:40%
}
.p_list li dd {
  display: table-cell;
  width:60%;
  vertical-align: middle;
  padding:2rem 0 2rem 2rem;
}
p.p-title {
  text-align: left;
  font-size: 1.2rem;
}
p.p-price {
  text-align: right;
}

.btn_about {
  width:70%;
}

.btn_ig {
 
}
.btn_inq {
  width:70%;
}
.sub_titile_bg_pc {
  height: 240px;
}
.sub {
  padding: 0 0 1rem;
}
.online-float{ max-width:112px;}
    .online-float a {
    width: 112px;
}
    .online-float img {
  
    }
.about {
    padding: 0.1rem 0 2rem 0;
}
    .h3_box h3 {
    font-size: 1.4rem;
    color: #333;
    letter-spacing: 0.3rem;
}
    h4.h4_footer {

    font-size: 0.85rem;
    line-height: 1.5rem;
    margin-bottom: 2rem;

}
 

    footer::before {
        content: '';
        display: inline-block;
        width: 100px;
        height: 110px;
        background-image: url(../img/bg_l.png);
        background-size: cover;
        vertical-align: middle;
    }
        footer::after {
        content: '';
        display: inline-block;
        width: 100px;
        height: 110px;
        background-image: url(../img/bg_r.png);
        background-size: cover;
        vertical-align: middle;
    }
    .footer_logo {
    width: 90px;
    display: block;
    margin: 0 auto 3rem;
}

    .footer__sns {
        width: 130px;
    }


    .bottle {

        margin-bottom: 0rem;
    }

    .bottle-img {
        width: 110px;
        top:-60px;

    }
    .p_btn li:hover:before {content: " "}
    .hny_btn:hover:before {content: " "}
  }

@media (max-width:550px){
  .sub_titile_bg_pc {
    height: 200px;
  }
    p.hd {
    font-size: 1rem;
    line-height: 1.5rem;
    margin-bottom: 2rem;
}

    .map_sp {
        max-width: 210px;
        top: 42%;
    }


    .bottle-img {
        width: 80px;
        top:-25px;

    }

  }
@media (max-width:450px){
  .sub_titile_bg_pc {
    height: 160px;
  }
  .sub_titile_bg_pc .visual__title {
    padding-top: 3rem;
  }
  .form {

    padding: 3rem 1rem;
}
  }
@media (max-width:360px){
  .sub_titile_bg_pc {
    height: 120px;
  }
  .sub_titile_bg_pc .visual__title {
    padding-top: 2rem;
  }
  .sub {
    padding: 1rem 0;
}
input[type="submit"] {
background-size: contain;
  width: 100%;

}
  }


/* Instagram List
================== */
.instagram-list{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto 6%;
}
.instagram-list__unit{
    width: 23.75%;/*285*/
    margin-bottom: 2%;
}
.instagram-list__link{
    position: relative;
    display: block;
    width: 100%;
    height: auto;
}
.instagram-list__link:before{
    display: block;
    content: "";
    padding-top: 100%;
}
.instagram-list__img{
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    font-family: "object-fit: cover;";
}
/* RWD */
@media (min-width:641px){
    .instagram-list{
        margin-bottom: 2%;
    }
}