@charset "utf-8";

@import url(normalize.css);
@import url(all.css);
@import url(common_parts.css);
@import url(common.css);




/* color */
.d_brn { color:#432d22; }
.brn { color:#955125; }
.cam { color:#c58949; }
.d_bl { color:#143640; }
.blk { color:#0e161f; }
.crm { color:#fcf0d1; }
.whi { color:#fff; }
.lbr { color:#fdeecf; }

/* back color */
.back_bk{ background:#000; }
.back_pi{ background:#eb738f; }
.back_lpi{ background:#f7baa5; }
.back_bl{ background:#0e6eb8; }
.back_org{ background:#ea591d; }
.back_cme{ background:#c99e2a; }
.back_brn{ background:#7f4e20; }
.back_nev{ background:#161b61; }
.back_blk { background:#221814; }
.back_gry { background:#c9c9ca; }
.back_grn { background:#006834; }
.back_wine { background:#a11251; }
.back_lgrn { background:#9dbb87; }
.back_pp { background:#920681; }
.back_red { background:#ea000e; }

/* common parts */
div.fs-l-page { margin-top:0!important; }
main.fs-l-main { max-width:100%!important; margin:0!important; }
body { background:#303030; font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", "Times New Roman", Meiryo, serif;}

.inner { max-width: 128rem; padding:0 2rem; margin:0 auto; }
h2 { font-size: 4rem; text-align:center; font-weight: bold; letter-spacing:5px; line-height:1.5; }
h2 span { display:block; font-size: 2.6rem; font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", "Times New Roman", Meiryo, serif; letter-spacing:0; }
#point,#service,#pickup,#pop,#voice { margin-top:20rem; }
div:after,ul:after { display:none; }
p { margin:0; }
.mid { display:none; }
@media screen and (max-width:1024px){
	.pc-m { display:none; }
	.mid { display:block; }
}
@media screen and (max-width:414px){
	#concept,#service,#feature,#pop,#voice,#category { margin-top: 5rem; }
}
@media screen and (max-width: 375px){
	h2 { font-size: 3.4rem; }
	h2 span { font-size: 2rem; }
}

/* main_inner */
.main_inner { max-width:100%; margin:0; }

/* header */
#header { background: #303030;  }
#header .inner { padding:2rem; display:flex; align-items:center; }
#header p { color:#fff; font-weight: bold; }
#header-logo { margin-right:auto; }
@media screen and (max-width: 768px){
	#header-logo { margin-top: 0; }
}
@media screen and (max-width: 414px){
	#header-logo { width:40%; }
	#header-logo img { width:100%; }
}

/* mv */
#mv {}
#mv .inner { max-width:100%; padding:0; margin:0; }
#mv .copy { -ms-writing-mode: tb-rl; writing-mode: vertical-rl; font-size:2.4rem; color:#fff; margin:0 auto; padding:10rem 0; }
@media screen and (max-width:414px){
	section { margin-bottom: 0; }
	#mv .copy { font-size:1.8rem; }
}

/* gallery */
#gallery {  }
#gallery ul { display:flex; }
@media screen and (max-width:414px){
	#gallery ul { display:block; }
}


/* point */
#point { color:#fff; }
#point .cont , #point .cont-odd { margin-top: 15rem; position:relative; }
#point .cont h3.p-h3 { position:absolute; bottom:-5rem; right:3rem; font-size: 5rem; z-index:10; }
#point .cont h3.p-h3 .num , #point .cont-odd h3.p-h3 .num { font-size:11rem; line-height:0.6; color:#9f9f9f; margin-right:-3rem; }
#point .cont h3.p-h3 .big , #point .cont-odd h3.p-h3 .big { font-size: 7rem; line-height:1.2; }
#point .cont .cover { position:absolute; top:0; bottom:0; left:0; right:0; padding:3rem; background:linear-gradient(to right, #231815 35%, transparent); }
#point .cont .cover h4 , #point .cont-odd .cover h4 { border-left:solid 5px #fff;padding-left:1em; font-size: 2.6rem; line-height:1.5; }
#point .cont .cover p { width:25%; margin-top: 3rem; line-height:2;}
#point .cont-odd h3.p-h3 { position:absolute; bottom:-5rem; left:3rem; font-size: 5rem; z-index:10; }
#point .cont-odd .cover { position:absolute; top:0; bottom:0; left:0; right:0; padding:3rem; background:linear-gradient(to left, #231815 35%, transparent); }
#point .cont-odd .cover div { width:25%; margin-left:auto;}
#point .cont-odd .cover div p { margin-top: 3rem; line-height:2; }
@media screen and (max-width:1024px){
	#point .cont , #point .cont-odd , #point .cont h3.p-h3 , #point .cont-odd h3.p-h3,#point .cont .cover,#point .cont-odd .cover { position:initial; }
	#point .cont , #point .cont-odd { margin-top: 10rem; }
	#point .cont .cover,#point .cont-odd .cover { padding:3rem 0 0; background:none; }
	#point .cont .cover p { width:auto; }
	#point .cont-odd .cover div { width:auto; }
}
@media screen and (max-width:375px){
	#point .cont h3.p-h3,#point .cont-odd h3.p-h3 { font-size: 4rem; }
	#point .cont h3.p-h3 .num , #point .cont-odd h3.p-h3 .num { font-size:8rem; margin-right:-2rem; }
	#point .cont h3.p-h3 .big , #point .cont-odd h3.p-h3 .big { font-size:6rem; line-height:1; }
}

/* service */
#service { color:#fff; }
#service ul { margin-top: 3rem; display:flex; justify-content:space-between; }
#service ul li { width:48%; }
#service ul li .number { text-align:center; margin-bottom: 2rem; }
#service ul li .number span { padding:1rem; font-size: 3rem; border:solid 1px #ddd; color:#808080; }
#service ul li .tt { font-size:2.6rem; text-align:center; font-weight: bold; letter-spacing:5px; border-bottom:solid 2px #333; margin-bottom: 2rem; }
#service ul li .text { margin-top: 3rem; font-weight: bold; }
#service ul li .text span { display:block; font-size: 2.6rem; margin:1rem 0; }
@media screen and (max-width:768px){
	#service ul { display:block; }
	#service ul li { width:100%; }
	#service ul li:nth-child(1) { margin-bottom: 3rem; }
}

/* pickup */
#pickup { color:#fff; }
#pickup .inner {  }
#pickup .inner .catch { margin-top: 2rem; text-align:center; }
#pickup .item { width:85%; margin:0 auto; }
#pickup p.text-area { color:#fff; width:40%; margin:0 auto; font-size: 1.8rem; }
#pickup p.text-area a { color:#fff; }
#pickup .btn { max-width:25rem; text-align:center; margin:2rem auto 0; }
#pickup .btn a { border:solid 3px #fff; display:block; color:#fff; font-weight: bold; padding:1rem 2rem; }
@media screen and (max-width:414px){
	#pickup p.text-area { width:85%; }
	#pickup .item ul li.text-area { font-size: 1.8rem; }
	#pickup .item ul li.text-area span { font-size: 2.2rem; }
}

/* #pickup owl-carousel */
#pickup .owl-carousel { margin-top: 3rem; position:relative; }

/* slide nav */
#pickup .owl-nav { display: flex; }
#pickup .owl-nav button { position:absolute; top:45%; transform:translate(0,-35%); color:#ddd; font-weight: normal; font-size:8rem; z-index:10; }
#pickup .owl-nav .owl-prev { left:10px; }
#pickup .owl-nav .owl-next { right:10px; }
.owl-nav button span { padding:5rem 2rem; }
@media screen and (max-width:768px){
	#pickup .owl-nav button { font-size: 6rem; }
}
@media screen and (max-width:414px){
	#pickup .owl-nav button { font-size: 4rem; }
	#pickup .owl-nav .owl-prev { left:0; }
	#pickup .owl-nav .owl-next { right:0; }
}

/* slide dot */
#pickup .owl-dots { margin: 2rem 0 0; display:block; text-align:center; }
#pickup .owl-dots button { margin:0 0.5rem; }
#pickup .owl-dots button span { width:1.5rem; height:1.5rem; display:block; }
#pickup .owl-dots button.owl-dot { background:#ddd; }
#pickup .owl-dots button.owl-dot.active { background:#808080; }
@media screen and (max-width:768px){
	#pickup .owl-dots { margin:3rem 0; }
}
@media screen and (max-width:414px){
	#pickup .owl-dots { margin:2rem 0 0; }
}

/* pop */
#pop { color:#fff; }
/* modal */
#pop .modal { display:flex; max-width:128rem; padding:0 2rem; margin:5rem auto; }
#pop .modal li a { display:block; position:relative; overflow:hidden; }
#pop .modal-box { background:rgba(0,0,0,0.7); display:none; width:100%; height:100vh; position:fixed; top:0; left:0; bottom:0; right:0; z-index:10000; }
#pop .modal-box ul { display:flex; justify-content:space-between; background:#fff; width:70%; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); padding:5rem; }
#pop .modal-box ul li.tx-box { width:65%; color:#333; }
#pop .modal-box ul li.img { order:2; text-align:center; width:30%; padding-bottom: 3rem; }
#pop .modal-box ul li .tt { font-weight: bold; font-size: 2.4rem; }
#pop .modal-box ul li .copy { font-size: 2rem; margin:3rem 0; }
#pop .modal-box ul li .min { line-height:1; font-size: 1.6rem; margin-bottom:3rem; text-align:right; font-weight:bold; }
#pop .modal-box ul li .btn { margin-bottom: 3rem; text-align:right;  }
#pop .modal-box ul li .btn a { background:#808080; color:#fff; padding:1rem 2rem; border-radius:5px; }
#pop .modal-box ul li.close { position:absolute; bottom:0; left:0; right:0; text-align:center; }
#pop .modal-box ul li.close a { display:block; font-size: 2rem; letter-spacing:2px; padding:1rem 2rem; background:#303030; color:#fff; font-weight: bold; }

/* hover mask */
#pop .mask { width:100%; height:100%; position:absolute; top:0; left:0; opacity:0; background:rgba(255,255,255,0.6); transition:all 0.3s ease; }
#pop .mask .caption { color:#333; padding-left:3rem; padding-right: 3rem; font-weight: bold; text-align:center; }
#pop .modal li a:hover .mask { opacity:1; padding-top:40%; text-align:center; }

@media screen and (max-width:768px){
	#pop .modal-box ul { display:block; padding:5rem 3rem; }
	#pop .modal-box ul li.tx-box { width:100%; }
	#pop .modal-box ul li.img { width:100%; }
	#pop .modal-box ul li .tt { font-size: 2.4rem; }
	#pop .modal-box ul li .copy { font-size: 2rem; margin:2rem 0; }
	#pop .modal-box ul li .btn { text-align:center; }
	#pop .modal li a:hover .mask { opacity:0; }
}
@media screen and (max-width:414px){
	#pop .modal { flex-wrap:wrap; }
	#pop .modal li { width:50%; }
	#pop .modal-box ul { display:block; padding:3rem; padding-bottom: 5rem; width:90%; }
	#pop .modal-box ul li .tt { font-size: 2rem; }
	#pop .modal-box ul li .copy { font-size:1.6rem; line-height:1.5; margin:1rem 0; }
	#pop .modal-box ul li .min {font-size: 1.4rem;}
}
@media screen and (max-width:375px){
	#pop .modal-box ul li .tt { font-size:1.8rem; }
	#pop .modal-box ul li .copy { font-size:1.4rem; }
	#pop .modal-box ul li .min {font-size: 1.2rem;}
}

#pop .bnr { max-width:128rem; padding:0 2rem; margin:2rem auto 0; }

/* voice */
#voice { color:#fff; }
#voice .bnr { margin-top: 3rem; }


/* shop */
#shop { margin-top: 5rem; }
#shop .online { text-align:center;width:30%; margin:0 auto 10rem; }
#shop .online a { display:block; padding:1rem 2rem; font-size: 2rem; font-weight: bold; color:#fff; border:solid 3px #fff; }
#shop .online a span { font-size: 2.6rem; }
@media screen and (max-width:768px){
	#shop .online { width:60%; }
}
@media screen and (max-width:375px){
	#shop .online { width:70%; }
	#shop .online a { font-size: 1.8rem; }
	#shop .online a span { font-size: 2.4rem; }
}

/* footer */
#footer { background: #222; padding: 5rem 0 4rem; }
#footer .inner { position: relative; width: 100%; max-width: 1100px; margin: 0 auto; padding: 2rem; }
#footer .footer_logo { position: static; margin:0 auto 3rem; text-align: center; }
#footer .footer_logo img { width:60%; }
#footer .insta { text-align:center; font-size: 2rem; margin-bottom: 2rem; }
#footer .insta i {font-size: 6rem; }
#footer-copy { position:static; width: 100%; text-align: center; }

/* page up */
#pageup a { color:#fff; }