@charset "utf-8"; 
a, abbr, acronym, address, applet, article, aside, audio,b, big, blockquote, body, caption, canvas, center, cite, code, dd, del, details, dfn, dialog, div, dl, dt, em, embed, fieldset, figcaption, figure, form, footer, header, hgroup, h1, h2, h3, h4, h5, h6, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, main, small, span, strike, strong, sub, summary, sup, tt, table, tbody, textarea, tfoot, thead, time, tr, th, td, u, ul, var, video{font-size:100%; vertical-align:baseline; white-space:normal; margin:0; padding:0; border:0; outline:0; background:transparent;}article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main{display:block;} ol, ul{list-style:none;} blockquote, q{quotes:none;}table{border-collapse:collapse; border-spacing:0;} *{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; -webkit-text-size-adjust:100%;} img{vertical-align:top; width: 100%;height: auto;} h1, h2, h3, h4, h5, h6{font-weight:normal;}



/*---------------------------
Link
---------------------------*/
a{outline:none; text-decoration: none; color: #fff;word-break: break-all;}
a:hover{ opacity: 0.8;}
a img:hover{ opacity: 0.8;}
a:hover{-webkit-transition:all .3s ease; transition:all .3s ease;}


/*---------------------------
Body
---------------------------*/
body{font-family:"noto-sans-cjk-jp", sans-serif, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic"; font-style: normal; font-weight: 400; color: #333333; background: #f2f0ed; word-wrap:break-word; font-kerning:normal;font-size:15px;letter-spacing: 0.05em; }


/*---------------------------
共通
---------------------------*/
.cf:before,
.cf:after {content: " ";display: table;}
.cf:after {clear: both;}
.cf{*zoom: 1;}

.pc{display:block;}
.sp{display:none;}

h2{font-family: "futura-pt", sans-serif; font-size:140px;  font-weight: 300; color: #bababa;}

@media only screen and (max-width:1190px){
h2{font-size:calc(140/1190 * 100vw);}
}

@media only screen and (max-width:750px){
.pc{display:none;}
.sp{display:block;}
}

.hero{padding: 70px;position:relative; z-index: 0;}

@media only screen and (max-width:1190px){
.hero{padding: calc(70/1190 * 100vw);}
}

@media only screen and (max-width:750px){
.hero{padding: 0;}
}

.profile{ margin-top: 150px;}
.profile .inner{width: 1000px; margin: 0 auto;display: flex; align-items: center; position: relative;}
.profile h2{position: absolute; left: 0; right:0; top: -100px; margin: auto; width:700px;text-align: center; display: block;}
.profile .pict{width:480px; margin-right: 80px;}
.profile .txt-box{width:440px; padding-bottom: 30px;}
.profile p{font-size:18px; line-height: 2.2;}
.profile .sns-box{ margin-top: 30px; display: flex; align-items: center;}
.profile li{margin-right: 20px;}
.profile li:first-child{width:21px;}
.profile li:nth-child(2){width:29px;}
.profile li:nth-child(3){width:24px;}
.profile li:last-child{width:20px; margin-right: 0;}
.profile h3{margin-top: 20px; font-size: 24px;font-family: "futura-pt", sans-serif; font-weight: 300;}
.profile .store{width:170px; margin-top: 5px;}

@media only screen and (max-width:1190px){
.profile{ margin-top: calc(150/1190 * 100vw);}
.profile .inner{width: calc(1000/1190 * 100vw);}
.profile h2{top:calc(-100/1190 * 100vw); width:calc(700/1190 * 100vw);}
.profile .pict{width:calc(480/1190 * 100vw); margin-right: calc(70/1190 * 100vw);}
.profile .txt-box{width:calc(450/1190 * 100vw); padding-bottom: calc(30/1190 * 100vw);}
.profile p{font-size:calc(18/1190 * 100vw);}
}

@media only screen and (max-width:750px){
.profile .inner{width:100%; padding: 0 25px; margin: 0 auto;display: block; }
.profile h2{position: relative; top:auto;left: auto; width: 100%; right:auto; margin:0 0 10px 0; text-align: center;}
.profile .pict{width:100%; margin-right: 0;}
.profile .txt-box{width:100%; padding-bottom: 0; margin-top: 20px;}
.profile p{font-size:13px;}
.profile .sns-box{ margin-top: 30px; display: flex; justify-content: center; align-items: center;}
.profile h3{text-align: center;}
.profile .store{width:170px; margin: 5px auto 0;}
}




.contact{ margin-top: 150px;}
.contact .inner{max-width: 1000px; margin: 0 auto;display: flex; justify-content:flex-end; position: relative;}
.contact .pict-box{}
.contact .pict{width:762px;}
.contact h2{position: absolute; left: -10%; right:0; top:30%;margin: auto;display: block;}
.contact .btn-box{ margin: 80px auto 0;}
.contact .btn-box a{display: block; border: 1px solid #000; color: #fff; text-align: center; font-size:22px;width:500px; margin: 0 auto; letter-spacing: 0.05em;}
.contact .btn-box .bg{margin: 3px; background: #000; padding: 20px;}

@media only screen and (max-width:1190px){
.contact{margin-top: calc(150/1190 * 100vw);}
.contact .inner{width: calc(1000/1190 * 100vw);}
.contact .pict{width:calc(762/1190 * 100vw);}
.contact .btn-box a{font-size:calc(22/1190 * 100vw); margin: 0 auto; letter-spacing: 0.05em;}
.contact .btn-box .bg{margin: calc(3/1190 * 100vw);}
}

@media only screen and (max-width:750px){
.contact .inner{width:100%; padding: 0 25px; margin: 0 auto;display: block; }
.contact .pict-box{display: block;}
.contact .pict{width:100%;}
.contact h2{position: relative; left:auto; right:auto; top:auto;margin:0 0 10px 0;display: block;width: 100%; text-align: center;}
.contact .btn-box{ margin: 30px auto 0; padding: 0 25px;}
.contact .btn-box a{font-size:15px; margin: 0 auto; width: 100%;}
.contact .btn-box .bg{margin:3px;padding: 15px;}
}

footer{background: #000; padding: 40px 20px 20px 20px; margin-top: 150px;}
footer .sns-box{ margin-top: 30px; display: flex; align-items: center; justify-content: center;}
footer li{margin-right: 40px;}
footer li:first-child{width:32px;}
footer li:nth-child(2){width:48px;}
footer li:nth-child(3){width:40px;}
footer li:last-child{width:32px; margin-right: 0;}
footer .copy{font-size: 10px; color: #fff; text-align: center; margin-top: 50px;}
footer .copy span{font-size: 14px;font-family: "futura-pt", sans-serif; font-weight: 300;}

@media only screen and (max-width:1190px){
footer{margin-top: calc(150/1190 * 100vw);}
}

@media only screen and (max-width:750px){
footer{margin-top:80px;}
footer li{margin-right: 20px;}
footer li:first-child{width:21px;}
footer li:nth-child(2){width:29px;}
footer li:nth-child(3){width:24px;}
footer li:last-child{width:20px; margin-right: 0;}
}