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

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

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

.wave_anime { animation: wave 2s infinite; }
@-webkit-keyframes wave {
  0% { -webkit-transform: translate(0px, 0px) rotateZ(0deg); transform: translate(0px, 0px) rotateZ(0deg); }
  50% { -webkit-transform: translate(0px, 15px) rotateZ(0deg); transform: translate(0px, 15px) rotateZ(0deg); }
  100% { -webkit-transform: translate(0px, 0px) rotateZ(0deg); transform: translate(0px, 0px) rotateZ(0deg); }
}
@keyframes wave {
  0% { -webkit-transform: translate(0px, 0px) rotateZ(0deg); transform: translate(0px, 0px) rotateZ(0deg); }
  50% { -webkit-transform: translate(0px, 15px) rotateZ(0deg); transform: translate(0px, 15px) rotateZ(0deg); }
  100% { -webkit-transform: translate(0px, 0px) rotateZ(0deg); transform: translate(0px, 0px) rotateZ(0deg); }
}

/* mv ----------*/
#mv { width: 100%; overflow: hidden; padding-bottom: 10rem; color: #FFF; }
#mv .inner { display: flex; max-width: 160rem; padding: 0 4rem; align-items: center; }
#mv .tw { width: 37%; padding-top: 6vw; }
#mv h1 { margin-bottom: 7rem; line-height: 1.6; font-size: 6.5rem; font-weight: 900; letter-spacing: 0.2em; }
#mv p { line-height: 2; font-size: 2rem; font-weight: 500; }
#mv .pw { width: 63%; padding-top: 2vw; }
#mv .pw img { position: relative; width: calc(100% + 6rem); max-width: none; }
@media screen and (max-width:1440px) {
	#mv h1 { margin-bottom: 5vw; font-size: 4.5vw; white-space: nowrap; }
	#mv p br { display: none; }
}
@media screen and (max-width:1024px) { /* iPad 横 l */
	#mv { padding-bottom: 6rem; }
	#mv .inner { display: block; }
	#mv .tw { width: 100%; padding-top: 4vw; }
	#mv h1 { margin-bottom: 4vw; line-height: 1.4; font-size: 8vw; }
	#mv p { line-height: 1.6; }
	#mv .pw { width: 100%; padding-top: 2vw; }
	#mv .pw img { width: calc(100% + 8rem); margin-left: -4rem; }
}

/* service ----------*/
#service { width: 100%; overflow: hidden; padding-bottom: 10rem; }
#service h2 { margin-bottom: 7rem; }
#service .division { position: relative; display: flex; margin-bottom: 20rem; align-items: center; }
#service .division:last-child { margin-bottom: 0; }
#service .division::before { position: absolute; z-index: 1; top: 0; left: -4rem; content: ""; width: calc(100% + 8rem); height: 100%; background-repeat: no-repeat; background-position: center; background-size: cover; }
#service .division::after { position: absolute; z-index: 1; content: ""; width: 100%; height: 11rem; background-repeat: no-repeat; background-size: contain; }
#service .division:nth-child(odd) { flex-direction: row-reverse; }
#service .division:nth-child(odd)::before { padding-top: 40.8%; background-image: url(../images/index/sv_bg2.svg); }
#service .division:nth-child(even) {}
#service .division:nth-child(even)::before { padding-top: 37.9%; background-image: url(../images/index/sv_bg1.svg); }
#service .division .pw { position: relative; z-index: 2; width: 50%; }
#service .division .tw { position: relative; z-index: 2; width: 50%; padding-top: 6rem; }
#service .division:nth-child(odd) .tw { padding-left: 6rem; }
#service .division:nth-child(even) .tw { padding-right: 3rem; }
#service .division .tw h3 { margin-bottom: 2rem; color: #003B80; line-height: 1.4; font-weight: bold; font-size: 4rem; }
#service .division .tw .cw {}
#service .division .tw .cw .c { display: inline-block; background-color: #EF4E16; color: #FFF; line-height: 1; padding: 1rem 2rem; }
#service .division .tw p { font-size: 1.8rem; font-weight: 400; }
#service .division .tw .btw {}
#service .division .tw .btw .bt-more { text-shadow: 1px 1px 0 #FFF, -1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px -1px 0 #FFF, 0px 1px 0 #FFF, 0-1px 0 #FFF, -1px 0 0 #FFF, 1px 0 0 #FFF; }
#service .division .wave { position: absolute; top: -16rem; }
#service .division .bridge { position: absolute; top: calc(100% - 12rem); width: 100%; text-align: center; }
#service-div01.division::after { top: -6.5rem; right: 7rem; background-image: url(../images/index/dv_01.svg); background-position: right; }
#service-div02.division::after { top: -10rem; left: 7rem; background-image: url(../images/index/dv_02.svg); background-position: left; }
#service-div03.division::after { top: -6.5rem; right: 7rem; background-image: url(../images/index/dv_03.svg); background-position: right; }
#service-div04.division::after { top: -10rem; left: 7rem; background-image: url(../images/index/dv_04.svg); background-position: left; }
#service-div05.division::after { top: -6.5rem; right: 7rem; background-image: url(../images/index/dv_05.svg); background-position: right; }
#service-div01 .pw { padding-right: 4rem; }
#service-div01 .pw img { position: relative; top: -3rem; left: 1rem; }
#service-div02 .pw { padding-left: 4rem; }
#service-div02 .pw img { position: relative; top: 2rem; }
#service-div03 .pw { margin-top: -8rem; padding-left: 2rem; }
#service-div04 .pw { padding-left: 3rem; }
#service-div04 .pw img { width: 108%; max-width: none; }
#service-div05 .pw { padding-left: 3rem; padding-right: 4rem; }
#service-div01 .wave { top: -18rem; }
#service-div04 .wave { top: -10rem !important; }
#service-div01 .wave, #service-div04 .wave { right: -16rem; }
#service-div02 .wave, #service-div05 .wave { left: -18rem; }
@media screen and (max-width:1024px) { /* iPad 横 l */
	#service { padding-bottom: 6rem; }
	#service h2 img { width: 50%; }
	#service .division { display: block; margin-bottom: 4em; }
	#service .division:last-child { margin-bottom: 0; }
	#service .division::after { top: -9vw; height: 10vw; }
	#service-div01.division::after { right: 0; }
	#service-div02.division::after { left: 0; }
	#service-div03.division::after { right: 0; }
	#service-div04.division::after { left: 0; }
	#service-div05.division::after { right: 0; }
	#service .division .pw { width: 100%; margin: 0 0 4rem 0 !important; padding: 0 !important; text-align: center; }
	#service .division .pw img { top: 0 !important; bottom: 0 !important; left: 0 !important; right: 0 !important; width: 100%; max-width: 50rem; margin: 0 !important; padding: 0 !important; }
	#service .division .tw { top: 0 !important; bottom: 0 !important; left: 0 !important; right: 0 !important; width: 100%; max-width: 50rem; margin: auto !important; padding: 0 2rem 6rem 2rem !important; }
	#service .division .tw h3 { font-size: 3rem; }
	#service .division .bridge img { width: 6rem; }
	#service .division .wave { display: none; }
}

/* aboutus ----------*/
#aboutus { position: relative; width: 100%; overflow: hidden; padding-top: 15vw; padding-bottom: 20rem; }
#aboutus::before { position: absolute; z-index: 1; top: 0; content: ""; width: 100%; height: 100%; background-image: url(../images/index/ab_bg.svg); background-repeat: no-repeat; background-position: center top; background-size: auto 100%; }
#aboutus h2 { position: relative; z-index: 2; margin-bottom: 4rem; text-align: center; }
#aboutus h2 img { width: 43%; margin-bottom: 4rem; }
#aboutus h2 span { display: block; color: #003B80; text-align: center; font-size: 2.8rem; font-weight: 400; }
#aboutus .aboutus_list { position: relative; z-index: 2; text-align: center; }
#aboutus .aboutus_list li {}
#aboutus .aboutus_list li .pw { overflow: hidden; margin-bottom: 2rem; border-radius: 3rem; }
#aboutus .aboutus_list li h3 { position: relative; margin-bottom: 1rem; text-align: left; font-size: 2.8rem; }
#aboutus .aboutus_list li h3::after { position: absolute; bottom: -2rem; left: 0; content: ""; width: 8.6rem; height: 4px; background-color: #EF4E16; }
#aboutus .aboutus_list li .btw {}
#aboutus_img { position: relative; z-index: 10; margin-top: -18rem; }
#aboutus_img .inner { text-align: right; }
#aboutus_img .inner img { max-width: 26rem; }
@media screen and (max-width:1500px) {
	#aboutus { padding-top: 20vw; }
}
@media screen and (max-width:1024px) { /* iPad 横 l */
	#aboutus { padding-top: 26vw; }
	#aboutus_img { margin-top: -18rem; }
	#aboutus_img .inner img { max-width: 20rem; }
}
@media screen and (max-width:480px) { /* iPhone 縦 s */
	#aboutus { padding-top: 40vw; padding-bottom: 10rem; }
	#aboutus::before { background-image: url(../images/index/ab_bg_sp.svg); }
	#aboutus h2 img { width: 55%; margin-bottom: 2rem; }
	#aboutus_img { margin-top: -10rem; }
	#aboutus_img .inner img { max-width: 16rem; }
}

/* interview ----------*/
#interview { width: 100%; overflow: hidden; }
#interview h2 { margin-bottom: -2rem; }
#interview .interview_list li { margin: 0 2.5rem; }
#interview .btw { margin-top: 8rem; }
@media screen and (max-width:896px) { /* iPhone 横 m */
	#interview .interview_list li { margin: 0 1rem; }
}
@media screen and (max-width:480px) { /* iPhone 縦 s */
	#interview h2 { margin-bottom: -0.5rem; }
	#interview h2 img { width: 70%; }
	#interview .btw { margin-top: 4rem; }
}

/* box_contens ----------*/
.box_contens {}
.box_contens h2 { margin-bottom: -1rem; }
.box_contens .box_w { position: relative; display: flex; width: calc(100% - 2.5rem); padding: 8rem 8rem 5rem; border-radius: 3rem; background-color: #FFF; box-shadow: 2.5rem 2rem 0px #FAF000; }
.box_contens .box_w::before { position: absolute; content: ""; background-repeat: no-repeat; background-position: center; background-size: contain; }
.box_contens .box_w.-r { flex-direction: row-reverse; }
.box_contens .box_w .pw, .box_contens .box_w .tw { width: calc((100% - 6rem) / 2); }
.box_contens .box_w .pw { margin-right: 6rem; }
.box_contens .box_w .pw img { border-radius: 3rem; }
.box_contens .box_w.-r .pw { margin-right: 0; }
.box_contens .box_w.-r .tw { margin-right: 6rem; }
.box_contens .box_w .tw {}
.box_contens .box_w .tw h3 { margin-bottom: 6rem; position: relative; font-size: 4rem; font-weight: 700; color: #003B80; }
.box_contens .box_w .tw h3::after { position: absolute; bottom: -2rem; left: 0; content: ""; width: 8.6rem; height: 4px; background-color: #EF4E16; }
.box_contens .box_w .tw .btw { margin-top: 4rem; }
@media screen and (max-width:1024px) { /* iPad 横 l */
	.box_contens .box_w { display: block; padding: 4rem; }
	.box_contens .box_w .pw, .box_contens .box_w .tw { width: 100%; margin-right: 0; }
	.box_contens .box_w .pw { margin-bottom: 2em; }
}
@media screen and (max-width:480px) { /* iPhone 縦 s */
	.box_contens .box_w { padding: 2rem; }
	.box_contens .box_w .pw { margin-bottom: 1em; }
	.box_contens .box_w .tw h3 { font-size: 3rem; }
}

/* environment ----------*/
#environment { padding-top: 8rem; }
#environment .box_w::before { width: 22.3rem; height: 24.3rem; bottom: -11rem; left: 7rem; background-image: url(../images/index/env_img.png); }
@media screen and (max-width:480px) { /* iPhone 縦 s */
	#environment .box_w::before { width: 15rem; bottom: -11rem; left: 4rem; }
}

/* movie ----------*/
#movie { padding-top: 10rem; }
#movie h2 { text-align: right; }
#movie h3 { padding-top: 6rem; }
#movie .box_w::before { width: 26.7rem; height: 26.9rem; top: -2rem; right: -2rem; background-image: url(../images/index/mov_img.png); }
@media screen and (max-width:1024px) { /* iPad 横 l */
	#movie h3 { padding-top: 0; }
}
@media screen and (max-width:480px) { /* iPhone 縦 s */
	#movie .box_w::before { width: 16rem; height: 16rem; top: -2rem; right: -4rem; }
	#movie h2 img { width: 50%; }
}

/* recruit ----------*/
#recruit { padding-top: 10rem; }
#recruit h2 { position: relative; z-index: 2; margin-bottom: 4rem; text-align: center; }
#recruit h2 img { width: 43%; margin-bottom: 4rem; }
#recruit h2 span { display: block; color: #FFF; text-align: center; font-size: 2.8rem; font-weight: 400; }
#recruit .recruit_bts { margin-bottom: 3rem; }
#recruit .recruit_bts li {}
#recruit .recruit_bts li a { display: block; display: flex; padding: 6rem 2rem; border-radius: 3rem; color: #FFF; background-color: #EF4E16; text-decoration: none; line-height: 1; font-size: 3rem; font-weight: 700; box-shadow: 10px 10px 0px #FFFFFF; align-items: center; }
#recruit .recruit_bts li a::after { content: ""; width: 6rem; height: 6rem; background-image: url(../images/common/arrow_more_border_w.svg); margin-left: auto; background-repeat: no-repeat; background-position: center; background-size: contain; }
@media screen and (max-width:896px) { /* iPhone 横 m */
	#recruit .recruit_bts li a { padding: 2rem 3rem; }
}
@media screen and (max-width:480px) { /* iPhone 縦 s */
	#recruit .recruit_bts li a { padding: 2rem 3rem; font-size: 2.4rem; }
	#recruit .recruit_bts li a::after { width: 4rem; height: 4rem; }
}