@charset "UTF-8";
/* ---------------------------------------------------------------------------------
 = Reset default browser CSS. 
--------------------------------------------------------------------------------- */
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,font,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;font-family:inherit;font-size:100%;font-style:inherit;font-weight:inherit;margin:0;outline:0;padding:0;vertical-align:baseline;box-sizing:border-box;}:focus{outline:0}body{background:#fff;line-height:1}ol,ul,li{list-style:none}table{border-collapse:separate;border-spacing:0}caption,th,td{font-weight:300;text-align:left}blockquote:before,blockquote:after,q:before,q:after{content:""}blockquote,q{quotes:"" ""}a img{border:0}article,aside,details,figcaption,figure,footer,main,header,hgroup,menu,nav,section{display:block}

/* -----------------------------------------------
 = Global 
----------------------------------------------- */
*,
*:before,
*:after {-webkit-box-sizing:border-box; box-sizing:border-box; background-repeat:no-repeat; flex-wrap:wrap; -webkit-tap-highlight-color:transparent;}
*:focus {outline:none;}
html {}
body {position:relative;}
body,
input,
textarea {
font-family:hiragino-kaku-gothic-pron, sans-serif;
-webkit-font-smoothing:subpixel-antialiased;
color:#225333; font-size:62.5%; font-weight:600; line-height:1.7; letter-spacing:1px;
text-shadow:.3px .3px 0 #225333;
}

/* Headings */
h1, h2, h3, h4, h5, h6 {}
hr {}
/* Text elements */
p {}
ul, ol {list-style-type:none;}
dl {}
dt {}
dd {}
strong, b {}
cite, em, i {}
blockquote {}
pre {}
code, kbd, samp, var {}
abbr, acronym, dfn {}
address {}
ins {}
sup {vertical-align:super;}
sub {}
small {}
/* Table */
table {border-collapse:collapse;}
img {width:auto; max-width:100%; height:auto;
/*-webkit-touch-callout:none;*/
/*-webkit-user-select:none;*/
/*-moz-touch-callout:none;*/
/*-moz-user-select:none;*/
/*touch-callout:none;*/
/*user-select:none;*/
}
/* Before After */
a,
span,
strong,
:before,
:after {position:relative; background-repeat:no-repeat; transition:all .3s ease-out;}
/* Links */
a {color:#225333; text-decoration:none;}
a,
a:before,
a:after {position:relative; transition:all .3s ease-in; will-change:transform;}
/* select area */
::selection {background-color:#ccc; color:#000; -webkit-text-stroke:none; text-shadow:none;}
::-moz-selection {background-color:#ccc; color:#000; -webkit-text-stroke:none; text-shadow:none;}

/* -----------------------------------------------
 = Font
----------------------------------------------- */
h1, h2, h3, h4, h5, h6,
strong, b {font-weight:600; font-style:normal;}
[class*="gastromond"] {font-family:gastromond, sans-serif; font-weight:400; font-style:normal; text-shadow:none;}
[class*="-italic"] {font-family:gastromond, sans-serif; font-weight:400; font-style:italic;}
.hiragino {font-family:hiragino-kaku-gothic-pron, sans-serif; font-weight:600;}



/* ------------------------------------------------
 = Loading
------------------------------------------------ */
.body.hide {overflow:hidden;}
.loading {z-index:100; position:fixed; display:flex; justify-content:center; align-items:center; width:100%; height:100%; background-color:#225333;}
.loading__image {width:170px;}

/* ------------------------------------------------
 = Logo
------------------------------------------------ */
.start {z-index:90; position:fixed; display:flex; justify-content:center; align-items:center; width:100%; height:100%; background-color:#faf9f6;}
.start::before,
.start::after {z-index:-1; content:""; position:absolute; top:0; width:11px; height:100%; background-image:url("/img/body_bg.png"); background-size:11px 1px; background-position:center; background-repeat:repeat-y;}
.start::before {left:13px; transform:scaleX(-1);}
.start::after {right:13px;}
.start__image {width:40%; max-width:550px; filter:blur(0); transition:all 1.2s ease-in;}
.start__image.hide {filter:blur(2px);}

/* -----------------------------------------------
 = Structure
----------------------------------------------- */
.body {position:relative; background-color:#faf9f6;}
.body::before,
.body::after {z-index:-1; content:""; position:absolute; top:0; width:11px; height:100%; background-image:url("/img/body_bg.png"); background-size:11px 1px; background-position:center; background-repeat:repeat-y;}
.body::before {left:13px; transform:scaleX(-1);}
.body::after {right:13px;}

/* -----------------------------------------------
 = Header 
----------------------------------------------- */
.header {width:100%;}
/* = firstview
------------------------------------------------ */
.firstview {display:flex; justify-content:center; align-items:center; background-image:url("/img/main_image.jpg"); background-position:center; background-size:cover; background-repeat:no-repeat;}
.firstview__caption {width:80%;}
[class*='firstview__text'] {text-align:right; opacity:1; filter:blur(0); transition:opacity .9s ease-in, filter .9s ease-in;}
[class*='firstview__text'].hide {opacity:0; filter:blur(1px);}
.firstview__text--01 {line-height:1.3; font-size:1000%;}
.firstview__text--01 .-italic {padding-right:9px;}
.firstview__text--02 {padding:60px 0 45px;}
.firstview__text--03 {}
[class*='firstview__image'] {}
.firstview__image--01 {width:315px;}
.firstview__image--02 {width:360px;}

/* = slider
------------------------------------------------ */
.slider {overflow:hidden; position:relative; padding-top:70px;}
.slider__wrap {position:relative; width:100%; height:590px;}
.slider__box {position:absolute; top:0; left:0; display:flex; flex-wrap:nowrap;}
[class*="slider__photobox"] {position:relative; width:450px; height:500px;}
[class*="slider__image"] {position:absolute; max-width:none;}
.slider__image--01 {z-index:1; top:23%; left:0%; width:109.11%;}
.slider__image--02 {z-index:5; top:10%; left:0.667%; width:101.178%}
.slider__image--03 {z-index:1; top:25%; left:-3.33%; width:111.11%}
.slider__image--04 {z-index:5; top:0%; left:-2.22%; width:114.22%;}
/*logo*/
.slider__foot {z-index:10; position:relative; text-align:center;}
.slider__logo {width:160px; height:138px;}

/* -----------------------------------------------
 = Product 
----------------------------------------------- */
.product {text-align:center; padding:60px 0 90px;}
.product__title {position:relative; width:80%; line-height:1; margin:0 auto 30px; text-align:center; font-size:800%;}
.product__title span {z-index:10; position:relative; display:inline-block; padding:0 20px; background-color:#faf9f6;}
.product__title::before,
.product__title::after {content:""; position:absolute; left:0; width:100%; background-color:#225333;}
.product__title::before {top:calc(50% + 6px); height:3px;}
.product__title::after {top:calc(50% + 15px); height:1px;}
/*item*/
.item {display:inline-flex; justify-content:space-between; width:80%; max-width:1100px; margin:auto;}
[class*="product__item"] {position:relative; max-width:1080px;}
.product__item--01 {left:-50px; padding-top:40px;}
.product__item--02 {flex-direction:row-reverse;}
.product__item--03 {left:-20px; padding-top:20px;}
/*flex*/
[class*="item__image"] {position:relative;}
[class*="item__summary"] {text-align:center;}
/*summary*/
.item__no {position:relative; width:70px; margin:auto; padding-bottom:15px;}
[class*="item__no-sp"] {display:none; position:absolute; width:16%;}
.item__caption {width:250px; margin:auto; padding-bottom:20px;}
.item__title {width:410px; max-width:100%; margin:auto; padding-bottom:25px;}
/*section*/
.item__image--01 {width:64%; padding-top:10px;}
.item__summary--01 {width:calc(36% - 30px);}
.item__image--02 {width:55%; margin-top:-45px;}
.item__summary--02 {width:calc(45% - 50px); padding:70px 0 0 50px;}
.item__image--03 {width:55%; padding-top:50px;}
.item__summary--03 {width:calc(45% - 50px); padding:30px 0 0 0;}
/*text*/
[class*="item__text"] {margin:auto; max-width:100%; padding-bottom:20px;}
.item__text--01 {width:62.5%; max-width:250px;}
.item__text--02 {width:97.5%; max-width:390px;}
.item__text--03 {width:100%; max-width:400px;}
/*price*/
[class*="item__price"] {display:none!important;}
[class*="item__price"] {max-width:100%; margin:auto; padding-bottom:20px;}
.item__price--01 {width:300px;}
.item__price--02 {width:300px;}
.item__price--03 {width:300px;}
/*color*/
[class*="item__color"] {width:300px; max-width:100%; margin:auto; padding-top:5px;}

/* -----------------------------------------------
 = Feature
----------------------------------------------- */
.feature {position:relative; width:100%; margin-top:75px; padding:110px 0 40px; background-image:url("/img/feature_bg_pc.jpg"); background-size:cover; background-position:center; background-repeat:no-repeat;}
.feature__title {position:absolute; top:-75px; left:0; width:100%; height:180px; background-image:url("/img/feature_title.png"); background-size:auto 180px; background-repeat:repeat-x; background-position:calc(50% + 360px) top; text-indent:-9999px;}
.feature__box {position:relative; width:950px; margin:auto; padding:0 0 0 440px;}
.feature__box::before {content:""; position:absolute; top:-200px; left:0; width:400px; height:460px; background-image:url("/img/feature_photo.png"); background-size:contain;}
.feature__caption,
.feature__text,
.feature__lead {width:440px;}
.feature__caption {line-height:1.6; padding:20px 0; font-size:360%;}
.feature__text {padding-bottom:10px; font-size:160%;}
.feature__lead {padding-top:10px; font-size:220%;}


/* -----------------------------------------------
 = Online Store 
----------------------------------------------- */
.store {padding:100px 0; text-align:center;}
.store__link {position:relative; display:block; width:980px; margin:auto; border:3px solid #225333; background-color:#dee5e0;}
.store__link::before {content:""; position:absolute; top:5px; left:5px; width:calc(100% - 10px); height:calc(100% - 10px); border:1px solid #225333;}
.store__link:hover {background-color:#b4c4ba;}
.store__title {line-height:1; padding-top:60px; font-size:760%;}
.store__text {width:260px; margin:auto; padding:18px 0 55px; font-size:200%;}

/* -----------------------------------------------
 = Instagram 
----------------------------------------------- */
.instagram {width:80%; margin:0 auto 60px; padding:40px 0 50px; text-align:center; border-top:3px solid #225333; border-bottom:3px solid #225333;}
.instagram__title {line-height:1; padding-bottom:40px; font-size:760%;}
[class*="instagram__box"] {display:inline-flex; line-height:1; margin:auto; padding-bottom:6px;}
.instagram__box--01 {padding-right:70px;}
.instagram__box--02 {padding-left:70px;}
.instagram__photo {width:260px; padding:0 3px;}

/* -----------------------------------------------
 = Footer 
----------------------------------------------- */
.footer {width:100%; text-align:center;}
/*contact*/
.contact {width:100%; text-align:center; background-color:#225333;}
.contact__link {display:block; padding:60px 0 130px;}
.contact__title {font-size:1100%; color:#faf9f6; letter-spacing:10px;}
.contact__text {width:390px; margin:auto; font-size:200%; color:#faf9f6;}
/*logo*/
.footer__logo {width:220px; height:250px; margin:auto; padding-top:60px;}
.footer__text {padding-top:40px; font-size:180%; padding-bottom:20px;}


/* -----------------------------------------------
 = MediaQueries PC 
----------------------------------------------- */
@media only screen and (max-width:1500px) {
/*frstview*/
.firstview__caption {width:88%;}
}
@media only screen and (max-width:1280px) {
/*frstview*/
.firstview__caption {width:90%;}
/*product*/
.product__item--01 {padding-bottom:30px;}
.item__image--01 {width:57%;}
.item__summary--01 {width:41%;}
.item__summary--02 {padding-left:0;}
.item__summary--03 {padding-left:0;}
}
@media only screen and (max-width:1200px) {
/*frstview*/
.firstview__text--01 {font-size:900%;}
.firstview__text--02 {padding:40px 0 30px;}
.firstview__image--01 {width:284px;} /*315px*/
.firstview__image--02 {width:324px;} /*360px*/
/*product*/
.product__title {width:90%;}
.product__item--01 {left:0;}
.item__image--02 {margin-top:-15px;}
}
@media only screen and (max-width:1100px) {
/*product*/
.item__image--02 {margin-top:0px;}
/*store*/
.store__link {width:80%;}
}
@media only screen and (max-width:1100px) {
/*feature*/
.feature__box {width:85%; max-width:870px;}
.feature__caption,
.feature__text,
.feature__lead {width:100%;}
}
@media only screen and (max-width:960px) {
/*contact*/
.contact__title {font-size:760%;}
.contact__link {padding-bottom:80px}
}

/* -----------------------------------------------
 = MediaQueries Tablet 
----------------------------------------------- */
@media only screen and (max-width:880px) {
/*firstview*/
.firstview {background-image:url("/img/main_image_sp.jpg");}
.firstview__text--01 {font-size:800%;}
/*slider*/
.slider {padding-top:30px;}
.slider__wrap {height:500px;}
[class*="slider__photobox"] {width:350px;} /*450px;*/
/*product*/
.item {display:block;}
.product {padding-top:40px;}
[class*="product__item"] {left:0; right:0; padding:0;}
.product__item--01 {}
.product__item--02 {}
.product__item--03 {}
.item__no {display:none;}
[class*="item__no-sp"] {display:block;}
.item__no-sp--01 {top:63%; right:5%;}
.item__no-sp--02 {top:32%; left:3%;}
.item__no-sp--03 {top:54%; left:17%;}
[class*="item__image"] {width:100%; max-width:580px; margin:auto; padding:40px 0;}
.item__image--01 {padding-top:20px;}
.item__image--02 {}
.item__image--03 {}
[class*="item__summary"] {width:100%; max-width:580px; margin:auto; padding:10px 0;}
.item__summary--01 {}
.item__summary--02 {}
.item__summary--03 {}
/*feature*/
.feature {margin-top:100px; padding-bottom:50px; background-image:url("/img/feature_bg_sp.jpg");}
.feature__box {}
.feature__box::before {top:-270px; width:40%;}
.feature__title {top:-7%; background-size:60% auto; background-position:-42% top;}
.feature__box {padding:100px 0 0}
.feature__caption,
.feature__text,
.feature__lead {width:100%; max-width:440px; margin:auto;}
/*store*/
.store__title {font-size:600%;}
.store__text {width:210px;}
/*contact*/
.contact__title {font-size:600%;}
.contact__text {width:327px;}
}
@media only screen and (max-width:800px) {
/*firstview*/
.firstview__text--01 {font-size:9.8vw;}
/*feature*/
.feature__box {padding-top:60px;}
}
@media only screen and (max-width:768px) {
/*product*/
.product__title {width:85%;}
/*feature*/
.feature__box {padding-top:40px;}
}

/* -----------------------------------------------
 = MediaQueries Mobile 
----------------------------------------------- */
@media only screen and (max-width:680px) {
/*firstview*/
.firstview {display:block;}
.firstview__caption {margin:auto;}
[class*='firstview__text'] {text-align:left;}
.firstview__text--01 .-italic {padding-right:0;}
[class*='firstview__image'] {padding-left:7.5%; padding-right:7.5%;}
.firstview__image--01 {width:100%; max-width:540px;}
.firstview__image--02 {width:66%; max-width:360px;}
/*slider*/
.slider {margin-top:280px;}
.slider__wrap {height:59vw;}
[class*="slider__photobox"] {width:45vw;}
.slider__image--01 {top:13%;}
.slider__image--02 {top:3%; left:1.5%}
.slider__image--03 {top:15%;}
.slider__image--04 {top:0%;}
.slider__logo {width:18vw; height:auto;}
/*product*/
.product__title {font-size:540%;}
/*feature*/
.feature__box {padding-top:20px;}
/*store*/
.store__title {font-size:540%;}
/*contact*/
.contact__title {letter-spacing:5px;}
/*footer*/
.footer__logo {width:27vw; height:auto;}
}
@media only screen and (max-width:640px) {
/*loading*/
.loading__image {width:25%;}
.start__image {width:64%;}
/*product*/
.product__title {width:80%;}
}
@media only screen and (max-width:600px) {
/*firstview*/
.firstview__image--02 {width:70%;}
/*feature*/
.feature__box {padding-top:40px;}
.feature__box::before {width:50%;}
}

@media only screen and (max-width:564px) {
/*slider*/
.slider__image--01 {top:8%;}
.slider__image--02 {top:3%;}
.slider__image--03 {top:10%;}
.slider__image--04 {top:0%;}
/*feature*/
.feature__box {padding-top:30px;}
.feature__caption,
.feature__text,
.feature__lead {width:85%;}
/*store*/
.store__title {font-size:480%; padding-top:40px;}
.store__text {padding-bottom:30px;}
}

@media only screen and (max-width:540px) {
/*feature*/
.feature__box {padding-top:10px;}
}

@media only screen and (max-width:520px) {
/*feature*/
.feature {padding-bottom:40px;}
.feature__box {padding-top:0px;}
/*store*/
.store__title {font-size:360%;}
.store__text {width:44%; padding-top:8px;}
/*contact*/
.contact__link {padding:40px 0 45px;}
.contact__title {font-size:490%; line-height:1.3}
.contact__text {width:52%;}
}

@media only screen and (max-width:480px) {
.body::before,
.body::after {background-image:url("/img/body_bg_sp.png");}
.body::before {left:5px;}
.body::after {right:5px;}
.start::before,
.start::after {background-image:url("/img/body_bg_sp.png");}
.start::before {left:5px;}
.start::after {right:5px;}
/*firstview*/
.firstview__image--02 {width:75%;}
/*slider*/
.slider {margin-top:230px;}
/*product*/
.product {padding-top:20px; padding-bottom:30px;}
.product__title {font-size:260%; margin-bottom:20px;}
.product__title::after {top:calc(50% + 11px);}
.product__title span {top:5px;}
[class*="item__image"] {width:95%; padding-bottom:20px;}
[class*="item__summary"] {width:95%; padding-bottom:0;}
.item__no-sp--02 {top:35%;}
.item__color {width:270px;}
/*feature*/
.feature__title {top:-5%;}
.feature__box {padding-top:20px;}
.feature__box::before {top:-220px;}
.feature__caption img {width:80%;}
/*store*/
.store {padding:60px 0;}
.store__link::hover {background-color:#dee5e0;}
/*footer*/
.footer__logo {padding-top:40px;}
.footer__text {padding-top:10px; font-size:110%;}
}
@media only screen and (max-width:430px) {
/*firstview*/
.firstview__text--02 {padding:20px 0 15px}
/*slider*/
.slider {margin-top:170px;}
/*product*/
.item__caption {width:200px; padding-bottom:8px;}
[class*="item__image"] {padding-bottom:10px;}
.item__title {padding-bottom:15px;}
[class*="item__text"] {padding-bottom:10px;}
.item__color {width:240px;}
/*feature*/
.feature__box {padding-top:0px;}
.feature__caption {padding-bottom:10px;}
.feature__text {padding-bottom:5px;}
.feature__text:nth-of-type(3) {padding-bottom:0;}
/*.feature__lead {padding-top:5px;}*/
}
@media only screen and (max-width:420px) {
.feature {padding-bottom:30px;}
.feature__caption {padding-top:10px;}
.store__text {padding-top:0;}
.contact__title {line-height:1.1;}
}

@media only screen and (max-width:390px) {
.feature__caption {padding-top:0px;}
}

@media only screen and (max-width:375px) {
/*feature*/
.feature {padding-top:80px;}
.feature__box::before {top:-205px;}
.feature__caption {padding-bottom:5px;}
}