@charset "utf-8";
/*--------------------------------------
	copyright : yuyu design.
--------------------------------------*/

@import url(normalize.css);
@import url(../../../_vendor/fontawesome/css/all.min.css);
@import url(../../../_vendor/aos/aos.css);
/*@import url(../../../_vendor/OwlCarousel/assets/owl.carousel.min.css); @import url(../../../_vendor/OwlCarousel/assets/owl.theme.default.css);*/
/*@import url(../../../_vendor/lightGallery/css/lightgallery.min.css);*/
@import url(common_parts.css);
@import url(common.css);


/*
 index
==============================*/

.vertical_text { line-height: 2.5; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; }

/* mv ----------*/
#mv { position: relative; padding: 10rem 0 5rem; background-color: #E8E8E8; }
#mv::before { position: absolute; z-index: 1; top: 0; right: 0; content: ""; width: 36%; height: 113%; background-image: url(../_img/index/mv_bg.jpg); background-repeat: no-repeat; background-position: 65% top 10%; background-size: cover; }
#mv .inner { position: relative; z-index: 10; }
#mv h1 { margin-bottom: 4rem; font-size: 4.4rem; font-family: YuGothic, "游ゴシック", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif; letter-spacing: 0.65em; }
#mv h1 mark { color: #FFF; background-color: #000; }
#mv h1 mark span { display: inline-block; width: 2rem; }
@media screen and (max-width:1300px) {
	#mv { padding: 16rem 0 5rem; }
}
@media screen and (max-width:896px) { /* iPhone 横 m */
	#mv { padding: calc(100vh - 27vw) 0 45vw; background-color: #E8E8E8; }
	#mv::before { width: 100%; height: 100vh; background-image: url(../_img/index/mv_bg_sp.jpg);  background-position: left 10% top; }
	#mv h1 { margin-bottom: 8vw; letter-spacing: 0.4em; font-size: 6vw; margin-left: -4vw; margin-right: -4vw; }
	#mv p { font-size: 3.2vw; margin: 0 !important; height: 24em; }
}

/* secA ----------*/
#secA { background-image: url(../_img/index/bg_01_pc.png); background-repeat: no-repeat; background-position: center; background-size: cover; }

/* history ----------*/
#history { padding: 18rem 0 8rem; }
#history p { position: relative; max-width: 26rem; padding-top: 2rem; color: #FFF; }
#history p::before { position: absolute; top: 0; left: 0; content: ""; width: 11rem; height: 2px; background-color: #FFF; }
#history .pw1 {}
#history .pw2 { margin-top: -9rem; }
#history .pw2 .tw { position: relative; }
#history .pw2 .tw p { position: absolute; bottom: 0; right: 0; text-align: right; }
#history .pw2 .tw p::before { left: auto; right: 0; }
@media screen and (max-width:896px) { /* iPhone 横 m */
	#history { position: relative; z-index: 1; padding: 0; }
	#history p { max-width: 75vw; margin-bottom: 6vw; padding-top: 6vw; font-size: 3.6vw; }
	#history p::before { display: none; }
	#history .pw1 { margin-top: -30vw; margin-bottom: 0; }
	#history .pw1 .pw { margin-left: -4vw; padding-right: 3rem; }
	#history .pw1 .tw p { padding-left: 4vw; border-left: solid 2px #FFF; }
	#history .pw2 { margin-top: 0; margin-bottom: 0; }
	#history .pw2 .pw { margin-right: -4vw; padding-left: 3rem; }
	#history .pw2 .tw { text-align: right; }
	#history .pw2 .tw p { position: relative; display: inline-block; padding-right: 4vw; border-right: solid 2px #FFF; }
}

/* favorite ----------*/
#favorite { position: relative; padding-top: 30rem; padding-bottom: 28rem; }
#favorite h2 { position: absolute; top: 0; right: 0; line-height: 2; font-size: 3rem; letter-spacing: 0.2em; }
#favorite h2 mark { padding: 0.5rem; background-color: #FFF; }
#favorite .pw1 { padding-left: 44rem; }
#favorite .pw1 img { width: 42rem; }
#favorite .pw2 { position: relative; padding-top: 2rem; }
#favorite .pw2 img { position: absolute; bottom: 100%; width: 34.5rem; }
#favorite .pw2 p { padding-left: 2rem; padding-top: 5rem; border-left: solid 2px #FFF; color: #FFF; }
#favorite .pw3 { padding-top: 8rem; }
#favorite .pw3 .tw1 { margin-top: -2rem; text-align: right; }
#favorite .pw3 p { display: inline-block; color: #FFF; }
@media screen and (max-width:896px) { /* iPhone 横 m */
	#favorite { padding-top: 0; padding-bottom: 35vw; }
	#favorite p { font-size: 3.6vw; }
	#favorite h2 { font-size: 6vw; }
	#favorite .pw1 { margin-left: -4vw; padding-left: 0; padding-top: 30vw; }
	#favorite .pw1 img { width: 65vw; }
	#favorite .pw2 { padding-top: 20vw; text-align: right; }
	#favorite .pw2 img { position: relative; bottom: auto; width: 65vw; }
	#favorite .pw3 .tw1 { text-align: left; }
}

/* secB ----------*/
#secB { background-image: url(../_img/index/bg_02_pc.png); background-repeat: no-repeat; background-position: center; background-size: cover; }
@media screen and (max-width:896px) { /* iPhone 横 m */
	#secB { background-image: url(../_img/index/bg_02_sp.png); }
}

/* design ----------*/
#design {}
#design .pw1 { margin-bottom: 4rem; text-align: center; }
#design .pw1 img { max-width: 50rem; margin-top: -14rem; }
#design h2 { margin-bottom: 3rem; color: #FFF; text-align: center; line-height: 1.6; font-size: 4rem; letter-spacing: 0.2em; }
#design .tw1 { margin-bottom: 9rem; color: #FFF; text-align: center; }
#design .tw2 {}
#design .tw2 p { margin-top: 3rem; padding-left: 3rem; border-left: solid 2px #FFF; color: #FFF; }
#design .tw2 .t1 { padding-top: 3em; }
@media screen and (max-width:896px) { /* iPhone 横 m */
	#design .pw1 img { max-width: auto; width: 90%; margin-top: -20vw; }
	#design h2 { margin-bottom: 4vw; font-size: 6vw; letter-spacing: 0; }
	#design .tw2 p { font-size: 3.6vw; }
	#design .tw1 { margin-bottom: 20vw; font-size: 3.6vw; }
	#design .tw2 img { width: 60vw; }
	#design .tw2 .r { text-align: right; }
	#design .tw2 .t2 { text-align: right; padding-right: 3rem; border-right: solid 2px #FFF; border-left: none; padding-left: 0; }
	#design .tw2 .t1, #design .tw2 .t2 { padding-top: 20vw; margin-top: -10vw; }
}

/* facility ----------*/
#facility { padding-top: 11rem; padding-bottom: 18rem; }
#facility .tw1 { display: flex; flex-direction: row-reverse; }
#facility .tw1 .vertical_text {}
#facility .tw1 p { color: #FFF; }
#facility .tw1 h2 { line-height: 2; font-size: 3.8rem; letter-spacing: 0.2em; margin-left: 3rem; }
#facility h2 mark { padding: 0.5rem; color: #FFF; background-color: #000; }
#facility .tw2 { margin-top: 16rem; }
#facility .tw2 .tw { position: relative; color: #FFF; }
#facility .tw2 .tw .w { position: absolute; bottom: 0; padding-top: 3.7rem; }
#facility .tw2 .tw .w::before { position: absolute; top: 0; left: 0; content: ""; width: 11rem; height: 2px; background-color: #FFF; }
#facility .tw2 .tw .w h3 { font-size: 1.8rem; letter-spacing: 0.2em; margin-bottom: 1rem; }
#facility .tw2 .tw .w h4 { letter-spacing: 0.2em;}
#facility .tw2 .tw .w p { font-size: 1.5rem; line-height: 1.6; }
#facility .tw3 { margin-top: 6rem; display: flex; flex-direction: row-reverse; justify-content: left;  }
#facility .tw3 h2 { line-height: 1.8; font-size: 3.8rem; letter-spacing: 0.2em; margin-left: 3rem; color: #FFF; }
#facility .tw3 p { color: #FFF; line-height: 1.95; }
#facility .tw3 .t1 { margin-left: 2rem; text-indent: -2em; padding-top: 2em; }
#facility .tw3 .t2 {}
@media screen and (max-width:896px) { /* iPhone 横 m */
	#facility { padding-top: 20vw; padding-bottom: 18vw; }
	#facility .tw1 { flex-flow: wrap; justify-content: right; }
	#facility .tw1 h2 { width: 100%; font-size: 6vw; margin-bottom: 8vw; }
	#facility .tw1 p { font-size: 3.4vw; }
	#facility .tw2 { margin-top: 20vw; }
	#facility .tw2 .pw img { width: 60vw; }
	#facility .tw2 .tw .w { position: relative; padding-top: 0; border-left: solid 2px #FFF; padding-left: 4vw; }
	#facility .tw2 .tw .w::before { display: none; }
	#facility .tw2 .tw .w h3 { font-size: 4vw; margin-bottom: 3vw; }
	#facility .tw2 .tw .w h4 { font-size: 3.4vw; }
	#facility .tw2 .tw .w p { font-size: 3.2vw; }
	#facility .tw3 { margin-top: 14vw; flex-flow: wrap; justify-content: right; flex-direction: row-reverse; }
	#facility .tw3 h2 { font-size: 6vw; width: 100%; margin-bottom: 4vw; }
	#facility .tw3 .t1 { font-size: 3.2vw; }
	#facility .tw3 .t2 { width: 60%; font-size: 3.2vw;  }
}

/* secC ----------*/
#secC { background-image: url(../_img/index/bg_03_pc.png); background-repeat: no-repeat; background-position: center; background-size: cover; }
#secC .inner_w { padding-top: 45%; background-image: url(../_img/index/16_19.png); background-repeat: no-repeat; background-position: center top; background-size: contain; }
@media screen and (max-width:896px) { /* iPhone 横 m */
	#secC { background-image: url(../_img/index/bg_03_sp.png); }
	#secC .inner_w { padding-top: 43.5%; }
}

/* color_scheme ----------*/
#color_scheme { position: relative; }
#color_scheme .tw { margin-left: 29%; display: flex; flex-direction: row-reverse; justify-content: left; }
#color_scheme .tw .vertical_text {}
#color_scheme .tw h2 { margin-left: 3rem; color: #FFF; line-height: 1.6; font-size: 3.8rem; letter-spacing: 0.2em; }
#color_scheme .tw p { color: #FFF; line-height: 1.9; }
#color_scheme .tw .t1 { margin-left: 2rem; padding-top: 2em; text-indent: -2em; }
#color_scheme .tw1 {}
#color_scheme .tw1 .t2 {}
#color_scheme .tw2 { position: absolute; top: 0; left: 0; width: 4.33%; overflow: hidden; }
#color_scheme .tw2 .t2 { color: #333; }
@media screen and (max-width:1124px) {
	#color_scheme .tw { margin-left: 20%; }
	#color_scheme .tw2 { width: 13.33%; }
}
@media screen and (max-width:896px) { /* iPhone 横 m */
	#color_scheme .tw { margin-left: 0; padding: 0 4vw; flex-flow: wrap; flex-direction: row-reverse; justify-content: right; }
	#color_scheme .tw2 { display: none; }
	#color_scheme .tw h2 { width: 100%; font-size: 6vw; }
	#color_scheme .tw h2 span { color: #333; }
	#color_scheme .tw .t1 { margin-left: 3vw; }
	#color_scheme .tw .t1, #color_scheme .tw .t2 { font-size: 3.2vw; line-height: 1.8; }
}

/* notice ----------*/
#notice { overflow: hidden; padding-top: 30rem; }
#notice .inner { max-width: 118rem; }
#notice .pw {}
#notice .tw { width: 200%; margin-top: -14rem; margin-left: 35%; padding: 17rem 0 3rem 5rem; background-color: #FFF; }
#notice .tw p { line-height: 1.8; font-weight: bold; }
@media screen and (max-width:896px) { /* iPhone 横 m */
	#notice { padding-top: 10vw; }
	#notice .tw { margin-left: 15%; margin-top: -6rem; padding: 8rem 0 3rem 5rem;  }
	#notice .tw p { font-size: 3.6vw; }
}

/* footer ----------*/
#footer { padding: 12rem 0 25rem; }
#footer p { font-size: 1.8rem; font-weight: bold; color: #FFF; letter-spacing: 0.4em; line-height: 2; text-justify: inter-word; text-align: left; text-justify: auto; }
#footer .production { padding-top: 9rem; }
#footer a { color: #FFF; }
@media screen and (max-width:896px) { /* iPhone 横 m */
	#footer { padding: 15vw 0 24vw; }
	#footer p { font-size: 3vw; justify-content: left; }
	#footer .production { padding-top: 10vw; font-size: 2.8vw; }
}