@charset "UTF-8";
/*---------------------
import
---------------------*/
/* Media Query @include mediaquery(**){   } default sm
*/
/*------- reset  --------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main { display: block; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

img, video { max-width: 100%; height: auto; vertical-align: bottom; }
header { position:fixed; z-index:1; }
main { padding-top:100px; }

*, *:before, *:after {
	box-sizing: border-box;
}
.sbmenu3c {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}
.sbmenu3c > * {
	width: 33.33333%;
}
.sbmenu3c > * :nth-child(3n){
	margin-right:auto;
}
.sbmenu3c > * > * {
	position: relative;
	overflow: hidden;
}
.sbmenu2c {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}
.sbmenu2c > * {
	width: 50%;
}
.sbmenu2c > * :nth-child(2n){
	margin-right:auto;
}
.sbmenu2c > * > * {
	position: relative;
	overflow: hidden;
}
.slidein {
    position: relative;
}
.cartbtn {
	position: absolute;
	right:0;
	bottom:0;
	cursor: pointer;
}
.cartbtn2 {
	position: absolute;
	right:0;
	bottom:0;
	cursor: default;
}
/*------- 左右に揺らす ctabtn + animation_a -------*/

.animation_a {
	animation: skew 2.3s linear infinite;
	scale: 1;
}
@keyframes skew {
	0%{transform:skew(0deg,0deg);}
	5%{transform:skew(2deg,2.2deg);}
	10%{transform:skew(-1deg,-1deg);}
	15%{transform:skew(0.5deg,1.2deg);}
	20%{transform:skew(-2deg,-1.5deg);}
	25%{transform:skew(0.9deg,0.9deg);}
	30%{transform:skew(-0.6deg,-0.6deg);}
	35%{transform:skew(0.3deg,0.3deg);}
	40%{transform:skew(-0.2deg,-0.2deg);}
	45%{transform:skew(0.1deg,0.1deg);}
	50%{transform:skew(0deg,0deg);}

}
/*------- 鼓動 ctabtn + animation_c -------*/

.animation_c {
	animation: zoom1 1300ms ease infinite;
	scale: 1;
}
@keyframes zoom1 {
	0%{transform: scale(1);}
	15%{transform: scale(1.05);}
	30%{transform: scale(1);}
	45%{transform: scale(1.05);}
	70%{transform: scale(1);}
}
/*------- 揺れる animation_g -------*/

.animation_g {
	animation: swing 2s linear infinite;
}
@keyframes swing {
    0% {
        transform: rotate(5deg) translateX(25px);
    }
    50% {
        transform: rotate(-5deg) translateX(-25px);
    }
    100% {
        transform: rotate(5deg) translateX(25px);
    }
}
/*------- animation ----------------*/
@keyframes fadein { 0% { opacity: 0; }
  100% { opacity: 1; } }
@keyframes fadeout { 0% { opacity: 1; }
  100% { opacity: 0; } }
/*------- font size ----------------*/
/*------- txt color ----------------*/
.txt-caption { font-size: 0.875rem; margin-top: .25rem; color: #777; }

.txt-center { text-align: center; }

/*------- common ---------*/
body { font: 16px "Roboto","Noto Sans JP","游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro",メイリオ,Meiryo,sans-serif; color: #352711; }

/*------- link color ----------------*/
a { text-decoration: none; opacity: 1; }

/*------- icon ----------------*/
.material-icons { vertical-align: middle; }

/*------- bg color ----------------*/
/* background */
/*------- v-align ----------------*/
.v-top { vertical-align: top; }

.v-middle { vertical-align: middle; }

.v-bottom { vertical-align: bottom; }

/*------- border style ----------------*/
.bo-none { border: none !important; }

.bo-t-none { border-top: none !important; }

.bo-r-none { border-right: none !important; }

.bo-b-none { border-bottom: none !important; }

.bo-l-none { border-left: none !important; }

/*------- float ----------------*/
.f-left { float: left !important; }

.f-right { float: right !important; }

.f-none { float: none !important; }

.clear { clear: both; }

/*------- position ----------------*/
.pos-relative { position: relative !important; }

.pos-absolute { position: absolute !important; }

.pos-inherit { position: inherit !important; }

/*------- sp ----------------*/
.sp-show { display: none; }

.sp-hide { display: inherit; }

@media screen and (max-width: 599px) { .sp-show { display: inherit; }
  .sp-hide { display: none; } }
.sp-show-inline { display: none; }inner
.sp-hide-inline { display: inline; }

@media screen and (max-width: 599px) { .sp-show-inline { display: inline; }
  .sp-hide-inline { display: none; } }
.inner { width: 100%; margin: 0 auto; padding-left: 1rem; padding-right: 1rem; padding-bottom: .5rem; box-sizing: border-box; max-width: 1000px; }
@media screen and (max-width: 768px) { .inner { width: 100%; padding-left: 1rem; padding-right: 1rem; padding-bottom: 0; box-sizing: border-box; } }

.inner-block { margin-left: 10%; margin-right: 10%; }

.header { width: 100%; background: white; box-shadow: 0px 3px 7px rgba(53, 39, 17, 0.2); }
@media screen and (max-width: 768px) { .header { position: fixed; } }
.header a { color: #352711; }
.header-upper { display: flex; align-items: center; padding-top: 0; }
@media screen and (max-width: 768px) { .header-upper { padding-bottom: 1rem; } }
.header-upper__logo { width: 245px; }
@media screen and (max-width: 768px) { .header-upper__logo { width: 180px; } }
.header-upper__nav { margin-left: auto; }
.header-upper__nav ul li { display: inline; margin-left: 10px; }
@media screen and (max-width: 768px) { .header-upper__nav ul li .btn-s { min-width: inherit; padding: .75rem; }
  .header-upper__nav ul li span { display: none; }
  .header-upper__nav ul li .btn-s11 { min-width: inherit; }
  .header-upper__nav ul li .btn-s12 { min-width: inherit; }
  .header-upper__nav ul li .btn-s21 { min-width: inherit; }
  .header-upper__nav ul li .btn-s22 { min-width: inherit; }
  .header-upper__nav ul li .btn-s31 { min-width: inherit; }
  .header-upper__nav ul li .btn-s32 { min-width: inherit; }
  .header-upper__nav ul li span.lnk { display: inline; font-size:0.7em; }
   }

/* header-nav-sp */
.header-nav-sp { display: none; padding: 1rem; width: 70px; height: 74px; box-sizing: border-box; position: absolute; top: 0; left: 0; transition: .4s; }
@media screen and (max-width: 768px) { .header-nav-sp { display: block; z-index: 20000; } }
.header-nav-sp.active { left: 84%; position: fixed; }

.btn-trigger { position: relative; width: 100%; height: 100%; cursor: pointer; display: block; box-sizing: border-box; }
.btn-trigger span { position: absolute; left: 0; width: 100%; height: 2px; background-color: #BB9C65; border-radius: 2px; }
.btn-trigger span:nth-of-type(1) { top: 10px; }
.btn-trigger span:nth-of-type(2) { top: 20px; }
.btn-trigger span:nth-of-type(3) { bottom: 10px; }
.btn-trigger.active span:nth-of-type(1) { -webkit-transform: translateY(10px) rotate(-45deg); transform: translateY(10px) rotate(-45deg); }
.btn-trigger.active span:nth-of-type(2) { opacity: 0; }
.btn-trigger.active span:nth-of-type(3) { -webkit-transform: translateY(-10px) rotate(45deg); transform: translateY(-10px) rotate(45deg); }

.btn-trigger, .btn-trigger span { display: inline-block; transition: all .5s; box-sizing: border-box; }

.btn { display: inline-block; font-size: 1.3125rem; background: #EACA76; border: 1px solid #EACA76; color: white; min-width: 413px; max-width: 100%; line-height: 1; text-align: center; padding: 26px; box-sizing: border-box; border-radius: 60px; transition: .4s; }
@media screen and (max-width: 768px) { .btn { min-width: 296px; } }
.btn:hover { background: white; color: #EACA76; }

.btn-white { background: white; color: #EACA76; }
.btn-white:hover { background: #EACA76; color: white; }

.btn-green { background: #B5BA84; border: 1px solid #B5BA84; color: white; }
.btn-green:hover { background: white; color: #B5BA84; }

.btn-s { background: #352711; color: white !important; border: 1px solid #352711; border-radius: 40px; font-size: 1rem; line-height: 1; min-width: 150px; text-align: center; padding: .75rem 1rem; box-sizing: border-box; display: inline-block; transition: .4s; }
.btn-s:hover { background: white; color: #352711 !important; }

.btn-s11 { display: inline-block; transition: .4s; opacity:0.5; }
.btn-s11:hover { opacity:1.0; transition:0.4s; }
.btn-s12 { display: inline-block; transition: .4s;}
.btn-s12:hover { opacity:0.5; transition:0.4s; }

.btn-s21{ display: inline-block; transition: .4s; opacity:0.5;  }
.btn-s21:hover { opacity:1.0; transition:0.4s;; }
.btn-s22 { display: inline-block; transition: .4s; }
.btn-s22:hover { opacity:0.5; transition:0.4s; }

.btn-s31 { display: inline-block; transition: .4s; opacity:0.5; }
.btn-s31:hover { opacity:1.0; transition:0.4s; }
.btn-s32 { display: inline-block; transition: .4s; }
.btn-s32:hover { opacity:0.5; transition:0.4s; }


.btn-outline { background: none; color: #352711 !important; }

.btn-section { text-align: center; }
.btn-section ul li { margin-bottom: 1rem; }
.btn-section ul li:last-child { margin-bottom: 0; }

.esw-lp { max-width: 1000px; margin: 0 auto;  }

.lp-main { position: relative; }

.lp-main__btn { position: absolute; top: 367px; left: 40px; }
@media screen and (max-width: 980px) { .lp-main__btn { top: 36.7vw; left: 4vw; }
  .lp-main__btn img { width: 48vw; } }

.lp-cta { padding-bottom: 40px; }
.lp-cta__head { text-align: center; padding: 45px 0 30px; }
@media screen and (max-width: 768px) { .lp-cta__head { padding-left: 1rem; padding-right: 1rem; } }
.lp-cta__box { background: #F6F0DA; border: 3px solid #352710; border-radius: 11px; width: 912px; margin: 0 auto; padding: 1rem; box-sizing: border-box; display: flex; }
@media screen and (max-width: 768px) { .lp-cta__box { width: 100%; } }
.lp-cta__box--body { width: 684px; }

.lp-faq { padding: 70px 0; }
.lp-faq__title { text-align: center; margin-bottom: 50px; }
.lp-faq__list { color: #333333; width: 905px; margin: 0 auto; }
@media screen and (max-width: 768px) { .lp-faq__list { width: 100%; } }
.lp-faq__list--qa { width: 45px; margin-right: 1rem; }
.lp-faq__list dt, .lp-faq__list dd { margin-bottom: 24px; display: flex; }
.lp-faq__list dt p, .lp-faq__list dd p { padding-top: .5rem; flex: 1; }
@media screen and (max-width: 768px) { .lp-faq__list dt p, .lp-faq__list dd p { padding-top: 0; } }
.lp-faq__list dt { font-size: 1.5rem; width: 100%; border: 1px solid #999; padding: 1rem; box-sizing: border-box; }
@media screen and (max-width: 768px) { .lp-faq__list dt { font-size: 1rem; } }
.lp-faq__list dd.hcr { background: #DDD; font-size: 1.375rem; padding: 1rem; box-sizing: border-box; width: 100%; }
.lp-faq__list dd.esw { background: #FEF; font-size: 1.375rem; padding: 1rem; box-sizing: border-box; width: 100%; }
.lp-faq__list dd.eh2 { background: #EFF; font-size: 1.375rem; padding: 1rem; box-sizing: border-box; width: 100%; }
@media screen and (max-width: 768px) { .lp-faq__list dd { font-size: 1rem; } }

.lp-bnr { padding: 40px 0 30px; text-align: center; }
.lp-bnr a { margin: 1rem 0; display: block; }

.btn-form { background: none; border: none; appearance: none; cursor: pointer; transition: .4s; opacity: 1; filter: brightness(100%); }
.btn-form:hover { filter: brightness(110%); opacity: .9; }

.footer-nav { padding: 4rem 0; }
.footer-nav ul { text-align: center; }
@media screen and (max-width: 768px) { .footer-nav ul { text-align: left; } }
.footer-nav ul li { display: inline; margin: 0 1rem; }
@media screen and (max-width: 768px) { .footer-nav ul li { display: block; padding: .5rem 0; } }
.footer-nav ul li a { color: #352711; }

.footer-copyright { text-align: center; background: #231815; padding: 1.5rem; }
.footer-copyright address { font-style: normal; color: white; font-weight: bold; }

.product-buy { position: fixed; bottom: 1rem; right: 1rem; z-index: 30000; transition: .4s; }
@media screen and (max-width: 768px) { .product-buy { bottom: .25rem; right: 0; }
  .product-buy img { width: 150px; } }
.product-buy__close { position: absolute; right: 0; top: .25rem; display: inline-block; cursor: pointer; z-index: 40000; }
.product-buy__close i { font-size: 1.375rem; }
.product-buy__close:hover i { color: #BF972D; }
.product-buy.is-close { right: -250px; }
.product-buy__alw { position: fixed; bottom: 1rem; right: -200px; z-index: 30000; cursor: pointer; transition: .4s; opacity: 1; }
.product-buy__alw:hover { opacity: .7; }
.product-buy__alw.is-close { right: 0; }

/*# sourceMappingURL=lp.css.map */