@charset "utf-8";

/* =Reset default browser CSS.
Based on work by Eric Meyer:http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */
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;}
:focus{outline:0;}
html{scroll-behavior: smooth;}
ol,ul{list-style:none;}
table{border-collapse:separate;border-spacing:0;}
caption,th,td{font-weight:normal;text-align:left;}
blockquote:before,blockquote:after,q:before,q:after{content:"";}
blockquote,q{quotes:"";}
img{max-width:100%;height:auto;vertical-align:bottom;-webkit-backface-visibility: hidden;}
a img{max-width:100%;height:auto;border:0;}
a:hover img{opacity: 0.8; filter: alpha(opacity=80); -moz-opacity: 0.8; -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; /*animation:fadeIn 1s ease 0s 1 normal;*/}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
body{font:18px/1.75 "source-han-sans-japanese","游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic","ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;color:#000;animation:fadeIn 2s ease 0s 1 normal; font-feature-settings : "palt"; letter-spacing: 0.1rem;font-weight: 400;font-style: normal;background-color: #fff !important;}
/*"adobe-garamond-pro","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","游明朝",YuMincho,"HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;*/
/*::after{ display: block; clear: both; content: '';}*/

/* リンク設定
------------------------------------------------------------*/
a{text-decoration:none;outline:0;vertical-align:baseline;color:#000;}
a:hover,a:active{color:#000;}

/**** Clearfix ****/
.inner:after{content:""; display:table;clear:both;}
.inner{zoom:1;}
.clearfix:before,.clearfix:after{content:" ";display:table;}
.clearfix:after{clear:both;}
.clearfix{*zoom:1;}

/* 汎用クラス
*****************************************************/
.pcDisp{display:block;}
.spDisp{display:none;}
div.drawer,div.fixedMenu{display:none;}

@media only screen and (max-width:644px){
.pcDisp{display:none;}
.spDisp{display:block;}
div.drawer{display:block;}
}

/* ヘッダー
------------------------------------------------------------*/
header{background:#687263;position: fixed; top: 0; width: 100%; z-index: 100;}
header .inner{max-width:1400px;width:96%;margin:0 auto;padding:0;box-sizing:border-box;}
header h1{ margin:45px 0 20px; width:185px; float:left;}
header nav{ float:right;  margin-top: 45px;}
header nav ul::after{ display: block; clear: both; content: '';}
header nav ul li{ text-align: center; padding: 0 15px; float: left;}
header nav ul li a{ color: #fff; font-size: 12px; transition: 0.2s;}
header nav ul li a:hover{ opacity: 0.5;}
@media only screen and (max-width:644px){
header h1{ width: 40%;margin:10px 0;}
header nav{ display: none;}
}

/* メイン画像
*****************************************************/
#kv{width: 100%; height: 100vh; position: relative;}
#kv::before {content:"";display:block;position:fixed;top:0;left:0;z-index:-1;width:100%;height:100vh;background-repeat:no-repeat;background-image:url(https://basefile.akamaized.net/seasonseason-theshop-jp/66f2783c2db20/kv.jpg);background-size:cover;}
#kv .copy{ position: absolute; top: 560px; left: 60px; color: #fff; font-size: 36px; font-weight: 100;}
@media only screen and (max-width:644px){
#kv::before {content:"";display:block;position:fixed;top:0;left:0;z-index:-1;width:100%;height:100vh;background-repeat:no-repeat;background-image:url(https://basefile.akamaized.net/seasonbshop-base-shop/66f51bbe9eebf/season_kv_sp.jpg);background-size:100% auto;}
#kv .copy { bottom: 90px; left: 20px; top: auto;}
}

/* コンテンツ
*****************************************************/
#iconcept{ padding: 160px 0 90px;}
#iconcept .inner{ position: relative;}
#iconcept h2{ font-size: 36px; color: #666; margin-bottom: 30px; font-family: "adobe-garamond-pro","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","游明朝",YuMincho,"HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;padding-left: 65px; }
#iconcept .concepttxt{ line-height: 2.5; padding-left: 65px; margin-bottom: 50px;}
#iconcept .bgbox{ background: #c9c0b5; padding: 45px 45% 70px 65px; box-sizing: border-box;}
#iconcept .bgbox::after{ display: block; clear: both; content: '';}
#iconcept .bgbox .tit{font-size: 30px; color: #fff; margin-bottom: 30px; font-weight: 300;}
#iconcept .bgbox .tit span{font-size: 36px;font-family: "adobe-garamond-pro","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","游明朝",YuMincho,"HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif; }
#iconcept .bgbox p{line-height: 2.5; color: #fff;}
#iconcept .btn{ width: 280px; margin-top: 50px; float: right;}
#iconcept .btn a{ width: 280px; padding: 20px 0; text-align: center; font-size: 18px; color: #7c7c7c; transition: 0.2s; background: #fff; border-radius: 10px; display: block; font-weight: 300;}
#iconcept .btn a:hover{background: #687263; color: #fff;}
#iconcept .img{ position: absolute; top: 20px; right: 60px; border-radius: 70px 0 70px 0; overflow: hidden;box-shadow: 0px 0px 20px -10px #777777;}
@media only screen and (max-width:644px){
#iconcept{ padding: 50px 0;}
#iconcept h2 { margin-bottom: 10px; padding-left: 20px;}
#iconcept .concepttxt {padding-left: 20px;}
#iconcept .bgbox { padding: 30px 20px;}
#iconcept .bgbox .tit { margin-bottom: 10px;}
#iconcept .btn { width: 80%; margin: 30px auto 0;}
#iconcept .btn a { width: 100%; padding: 15px 0;}
#iconcept .img {position: static; width: 80%; margin: 30px auto 0;}
}

#ilineup h2{ font-size: 36px; color: #666; text-align: center; margin-bottom: 100px; position: relative;font-family: "adobe-garamond-pro","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","游明朝",YuMincho,"HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;}
#ilineup h2:after{ content: ''; width: 66px; height: 2px; background: #e1d9c7; position: absolute; bottom: 0; left: 0; right: 0; margin: auto;}
#ilineup li{ margin-bottom: 100px;}
#ilineup li::after{ display: block; clear: both; content: '';}
#ilineup .img{ width: 50%; float: left;border-radius: 0 70px 0 0; overflow: hidden;box-shadow: 0px 0px 20px -10px #777777;}
#ilineup .img img{ width: 100%;}
#ilineup .txt{width: 50%; float: right; padding-left: 50px; box-sizing: border-box;}
#ilineup h3{ font-size: 28px; color: #687263; margin-top: 30px; border-bottom:#e1d9c7 1px solid; margin-bottom: 10px; font-family: "adobe-garamond-pro","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","游明朝",YuMincho,"HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;}
#ilineup .jp{ text-align: right; margin-bottom: 30px; color: #687263;}
#ilineup li p{ line-height: 3;}
#ilineup .btn{ width: 280px; margin-top: 50px; float: right;}
#ilineup .btn a{ width: 280px; padding: 20px 0; text-align: center; font-size: 18px; color: #fff; transition: 0.2s; background: #687263; border-radius: 10px; display: block; font-weight: 300;}
#ilineup .btn a:hover{background: #fbfafa; color: #687263;}
#ilineup li:nth-child(even) .img{ float: right;}
#ilineup li:nth-child(even) .txt{ float: left;padding-left: 0; padding-right: 50px;}
@media only screen and (max-width:644px){
#ilineup h2 { margin-bottom: 30px;}
#ilineup .img{ width: 100%; float: none;}
#ilineup .txt{width: 100%; float: none;padding-left: 0; padding-right: 0;}
#ilineup li:nth-child(even) .img{ float: none;}
#ilineup li:nth-child(even) .txt{ float: none;padding-left: 0; padding-right: 0;}
#ilineup .btn{ width: 80%; margin: 50px auto 0; float: none;}
#ilineup .btn a{ width: 100%;padding: 15px 0;}
}

#ivoice { padding: 100px 0 50px; background: url(https://basefile.akamaized.net/seasonseason-theshop-jp/66f277c41b68e/bg_voice.jpg) no-repeat; background-size: 100% 100%;}
#ivoice h2{ font-size: 36px; text-align: center; position: relative;font-family: "adobe-garamond-pro","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","游明朝",YuMincho,"HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;color: #687263;}
#ivoice .h2copy{ text-align: center;color: #687263; font-size: 20px;}
#ivoice ul li{box-shadow: 0px 0px 20px -10px #777777; margin: 50px 20px; padding: 50px 40px; box-sizing: border-box; height: 660px; background: rgba(255,255,255,0.5);}
#ivoice ul li .tit{  margin-bottom: 40px;}
#ivoice ul li .tit::after{ display: block; clear: both; content: '';}
#ivoice ul li img{ float: left; margin-right: 20px;}
#ivoice ul li .name{ line-height: 78px;}
#ivoice ul li p{font-family: "source-han-serif-jp-subset",sans-serif; line-height: 1.75; letter-spacing: 0.3rem;font-size: 20px;}

@media only screen and (max-width:644px){
#ivoice{ padding: 50px 0 0;}
#ivoice h2{ margin-bottom: 20px;}
#ivoice ul li { margin: 30px 40px; padding: 20px 20px; height: 600px;}
#ivoice ul li p { font-size: 16px;}
#ivoice ul li .tit { padding-bottom: 10px; margin-bottom: 10px;}
}

#ishop{ padding: 100px 0;}
#ishop h2{ font-size: 36px; text-align: center;  position: relative;font-family: "adobe-garamond-pro","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","游明朝",YuMincho,"HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;color: #687263;}
#ishop .h2copy{ text-align: center;color: #687263; font-size: 24px; margin-bottom: 50px;}
#ishop p{ text-align: center; margin-bottom: 50px;}
#ishop .insta{ width: 81px; margin: 0 auto 50px;}
#ishop .line{ width: 81px; margin: 0 auto;}

#privacy,#law,.main #about,.main .inquirySection{ padding: 150px 0;}
h2.categoryTitle01a{ padding: 150px 0 0;}
#privacy h2,#law h2,.main #about h2,.main .inquirySection h1,h2.categoryTitle01a{ font-size: 36px; color: #879082; text-align: center; margin-bottom: 50px; position: relative;font-family: "adobe-garamond-pro","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","游明朝",YuMincho,"HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;}
#privacy h2:after,#law h2:after,.main #about h2:after,.main .inquirySection h1:after,h2.categoryTitle01a:after{ content: ''; width: 66px; height: 2px; background: #e1d9c7; position: absolute; bottom: 0; left: 0; right: 0; margin: auto;}
.main .inquirySection p{ text-align: center;}
.main #about table{max-width:800px;width:96%;margin:0 auto;padding:0;box-sizing:border-box;}
.main #about th,.main #about td{ padding: 20px; border-bottom: dashed 1px #333; box-sizing: border-box;}
.main #about th{ font-weight: 700;}
@media only screen and (max-width:644px){
#privacy,#law,.main #about,.main .inquirySection{ padding: 50px 0;}
.main #about th,.main #about td{ display: block; width: 100%;}
.main #about th{ border-bottom: none; padding-bottom: 0;}
}



/* トップお客様の声スライダー
------------------------------------------------------------*/
.slider { width:94%;margin:0 auto;}
.slider .slick-slide { margin:0 25px;}
.slick-prev,.slick-next { position: absolute; top: 42%; cursor: pointer; outline: none; height: 30px; width: 16px; z-index: 10;}
.slick-prev {left: -1.5%; background: url(https://basefile.akamaized.net/seasonseason-theshop-jp/66f278620f64e/prev.png) no-repeat;}
.slick-next {right: -1.5%; background: url(https://basefile.akamaized.net/seasonseason-theshop-jp/66f2785757f43/next.png) no-repeat;}
.slider .slick-dots {display: none!important;}

/* 共通エリア
*****************************************************/
section::after{ display: block; clear: both; content: '';}
main{ background: #fff;}
main .inner{max-width:1400px;width:96%;margin:0 auto;padding:0;box-sizing:border-box;}

/* フッター
*****************************************************/
footer{padding:100px 0;box-sizing:border-box; background: #687263;}
footer::after{ display: block; clear: both; content: '';}
footer .inner{max-width:1400px;width:96%;margin:0 auto;padding:0;box-sizing:border-box;}
footer .rgt{ width: 20%; float: left;}
footer .logo{ margin-bottom: 20px;}
address{font-size:14px; color: #fff;}
footer nav{ width: 70%; float: right;}
footer nav .mainnav{ border-bottom: 1px solid #fff; padding-bottom: 30px; margin-bottom: 30px;}
footer nav .mainnav::after{ display: block; clear: both; content: '';}
footer nav .mainnav li{ font-size:20px; float: left; margin: 0 70px 0 0;}
footer nav .sub li{  float: left; margin: 0 50px 0 0;}
footer nav a{ transition: 0.2s; color: #fff;}
footer nav a:hover{ opacity: 0.5;}

@media only screen and (max-width:644px){
footer{padding:50px 0;}
footer .rgt{ width: 100%; float: none; margin-bottom: 50px;}
footer .logo{ width: 50%;}
address{font-size:12px;}
footer nav{ width: 100%; float: none;}
footer nav .mainnav li{ font-size:16px; width: 50%; margin-right: 0;}
footer nav .sub li{ font-size:14px;}
}


