@charset "utf-8";
/*--------------------------------------
	copyright : yuyu design.
--------------------------------------*/

@import url(reset.css);
@import url(common.css);
@import url(../libs/fontawesome/css/all.min.css);
@import url(../libs/aos/aos.css);
@import url(../libs/OwlCarousel/assets/owl.carousel.min.css); @import url(../libs/OwlCarousel/assets/owl.theme.default.min.css);
/* @import url(../libs/lightGallery/css/lightgallery.min.css); */
/* @import url(../libs/Remodal/remodal.css); @import url(../libs/Remodal/remodal-default-theme.css); */


/*
index
==============================*/

/* common ----------*/
.h2i { display: flex; flex-direction: column; gap: 1rem; }
.h2i.-c { align-items: center; }
.h2i span {}
.h2i .e { font-size: 4.2rem; font-family: "Figtree", sans-serif; font-weight: 500; color: #73B6DA; text-align: center; }
.-bg_blue .h2i .e { color: #FFFF8B; }
.h2i .j { font-size: 2.2rem; font-weight: 500; }
.-bg_blue .h2i .j { color: #08599F; }
.h3i { display: flex; flex-direction: column; gap: 1rem; }
.h3i.-c { align-items: center; }
.h3i span { }
.h3i .j { font-size: 3rem; font-weight: 500; color: #FFF; }
.h3i .e { font-size: 2rem; font-family: "Figtree", sans-serif; font-weight: 500; color: #F0F4F6; }
@media screen and (max-width:480px) { /* s */
	.h2i { gap: 0.8rem; }
	.h2i .e { font-size: 3.36rem; }
	.h2i .j { font-size: 1.76rem; }
}

/* header ----------*/
#header { opacity: 0; }


/* mv ----------*/
#mv { position: relative; }
#mv::before { content: ""; position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; background: rgba(56, 149, 189, 0.30); }
#mv h1 { width: 100%; position: absolute; z-index: 3; color: #FFF; font-size: 3.8rem; font-weight: 500; text-align: center; line-height: 3; vertical-align: baseline; top: 66%; transform: translateY(-50%); }
#mv h1 img { vertical-align: baseline; }
#mv h1 .t1 { aspect-ratio: 310 / 84; width: 8.15em; }
#mv h1 .t2 { aspect-ratio: 423 / 82; width: 11.13em; }
#mv h1 small { font-size: 2.6rem; display: inline-block; margin-top: 3em; }
#mv .kvs { position: relative; z-index: 1; opacity: 0; }
#mv .kvs .kv { width: 100%; height: 98rem; background-repeat: no-repeat; background-position: center top 20%; background-size: cover; }
#mv .owl-carousel .animated { -webkit-animation-duration: 2s; -moz-animation-duration: 2s; -ms-animation-duration: 2s; -o-animation-duration: 2s; animation-duration: 2s; }
#mv .owl-dots { display: none; }
@media screen and (max-width:1440px) {
	#mv .kvs .kv { width: 100%; height: auto; aspect-ratio: 144 / 98; }
}
@media screen and (max-width:1024px) { /* l */
	#mv h1 { top: 60%; }
	#mv h1 small { margin-top: 1em; }
}
@media screen and (max-width:896px) { /* m */
	#mv h1 { font-size: 4.2vw; }
	#mv h1 small { font-size: 2.9vw; }
}
@media screen and (max-width:480px) { /* s */
	#mv .kvs .kv { aspect-ratio: 144 / 130; }
}

/* topics ----------*/
#topics {}
#topics .w { display: flex; align-items: center; gap: 4rem; }
#topics .topics_list { max-width: 72rem; margin-left: auto; }
#topics .btw { margin-top: 4.4rem; text-align: right; }
@media screen and (max-width:896px) { /* m */
	#topics .h2i { align-items: center; }
	#topics .w { flex-direction: column; gap: 4vw; }
	#topics .btw { text-align: center; }
	#topics .btw { margin-top: 4vw; }
}


/* value ----------*/
#value { border-radius: 4rem; }
#value .imgs { position: absolute; width: 100%; height: 100%; top: 0; }
#value .imgs li { position: absolute; width: 24%; }
#value .imgs li:nth-child(1) { left: 3%; top: -4%; }
#value .imgs li:nth-child(2) { left: 0; top: 45%; }
#value .imgs li:nth-child(3) { left: 50%; transform: translateX(-50%); bottom: 0; }
#value .imgs li:nth-child(4) { right: 3%; top: 45%; }
#value .imgs li:nth-child(5) { right: 0; }
#value .imgs img { width: 100%; max-width: 25rem; }
#value .w { position: relative; padding: 8rem 0 28%; margin-bottom: 8rem; }
#value .w .tw { max-width: 36%; margin: auto; }
#value .w .tw p { margin-top: 2.4rem; }
#value .w .tw .btw { text-align: center; margin-top: 12rem; }
#value .w2 { display: flex; gap: 6rem; align-items: center; max-width: 86rem; }
#value .w2.-fs { margin: -5% auto 2rem; }
#value .w2.-sc { margin: 6rem auto 2rem; }
#value .w2.-r { flex-direction: row-reverse; }
#value .w2 .pw img { max-width: 36.5rem; }
#value .w2 .tw p { margin-top: 2.4rem; }
#value .w2 .btw { margin-top: 6rem; }
#value hr { width: 204px; height: 6px; margin: 20px auto; border: none; background-image: radial-gradient(circle, #BADAE9 3px, transparent 3px); background-size: 18px 6px; }
@media screen and (max-width:896px) { /* m */
	#value .imgs { position: relative; display: flex; flex-flow: wrap; justify-content: center; margin-bottom: 4vw; }
	#value .imgs li { position: relative; width: 33%; left: auto !important; right: auto !important; top: auto !important; bottom: auto !important; transform: translateX(0) !important; }
	#value .w { padding: 2vw 0 0; margin-bottom: 8vw; }
	#value .w .tw { max-width: 100%; }
	#value .w .tw p { text-align: center; }
	#value .w .tw .btw { margin-top: 4vw; }
	#value .w2 { gap: 3rem; }
	#value .w2.-fs { margin: 8vw auto 8vw; }
	#value .w2.-sc { margin: 8vw auto 8vw; }
	#value .w2 .pw img { max-width: 24rem; }
}
@media screen and (max-width:480px) { /* s */
	#value .w2 { flex-direction: column !important; gap: 4vw; }
	#value .w2 .h3i { text-align: center; }
	#value .w2 .pw img { max-width: 16rem; }
	#value .w2 .btw { margin-top: 4vw; text-align: center; }
}

/* people ----------*/
#people { overflow: hidden; }
#people .h2i { margin-bottom: 6rem; }
#people .people_list .owl-item:nth-child(even) { margin-top: 7rem; }
#people .btw { margin-top: 8rem; text-align: center; }
@media screen and (max-width:896px) { /* m */
	#people .h2i { margin-bottom: 6vw; }
	#people .btw { margin-top: 6vw; }
}
@media screen and (max-width:480px) { /* s */
	#people .owl-carousel .owl-stage-outer { overflow: visible; }
	#people .people_list .owl-item:nth-child(even) { margin-top: 3vw; }
}


/* growth ----------*/
#growth {}
#growth .growths { display: grid; margin-top: 2rem; grid-template-columns: 1fr 1fr; gap: 12rem; }
#growth .growths .pw {}
#growth .growths .tw { margin-top: 4.5rem; }
#growth .growths .tw h3 { color: #5478AB; font-size: 2.6rem; font-weight: 500; text-align: center; }
#growth .growths .tw h3 strong { font-weight: bold; }
#growth .growths .tw p { margin-top: 2rem; font-size: 1.5rem; font-weight: 500; }
#growth .btw { margin-top: 4.5rem; text-align: center; }
@media screen and (max-width:1024px) { /* l */
	#growth .growths { gap: 6rem; }
}
@media screen and (max-width:896px) { /* m */
	#growth .growths { margin-top: 3vw; }
	#growth .btw { margin-top: 4vw; }
}
@media screen and (max-width:480px) { /* s */
	#growth .growths { grid-template-columns: 1fr; }
	#growth .growths .pw { text-align: center; }
	#growth .growths .pw img { max-width: 24rem; }
}


/* jobBusiness ----------*/
#jobBusiness {}
#jobBusiness .w { display: grid; margin-top: 6rem; align-items: center; grid-template-columns: 1fr 1fr; gap: 6rem; margin-right: 5rem; }
#jobBusiness .w .pw {}
#jobBusiness .jb_list { display: flex; flex-direction: column; gap: 5rem; }
#jobBusiness .jb_list li { position: relative; }
#jobBusiness .jb_list li::after { content: ""; z-index: 1; position: absolute; top: 50%; transform: translateY(-50%); right: 0.8rem; width: 2.5rem; aspect-ratio: 1; background-color: #08689F; border-radius: 100%; transition: all 0.3s ease-out; }
#jobBusiness .jb_list li:hover:after { background-color: #9AD7FA; }
#jobBusiness .jb_list li a { display: block; text-decoration: none; background: rgba(217, 238, 249, 0.40); padding: 1.5rem 10rem 3.5rem 1rem; }
#jobBusiness .jb_list li a::before { content: ""; z-index: 3; left: calc(100% - 2.5rem - 0.4rem); width: 1.7rem; height: 0; border-top: solid 1px #FFF; position: absolute; top: 50%; transform: translateY(-50%); transition: all 0.3s ease-out; }
#jobBusiness .jb_list li a::after { content: ""; z-index: 3; left: calc(100% - 1.6rem); width: 0; height: 0; border-style: solid; border-width: 3px 0 3px 5px; border-color: transparent transparent transparent #FFF; position: absolute; top: 50%; transform: translateY(-50%); transition: all 0.3s ease-out; }
#jobBusiness .jb_list li a:hover { opacity: 1; background: rgba(248, 252, 255, 0.80); }
#jobBusiness .jb_list li a:hover::before { left: calc(100% - 2.5rem); width: 2.2rem; border-color: #08599F; }
#jobBusiness .jb_list li a:hover::after { left: calc(100% - 0.7rem); border-color: transparent transparent transparent #08599F; }
#jobBusiness .jb_list li h3 { font-size: 2.6rem; font-weight: 500; color: #73B6DA; margin-bottom: 1rem; }
#jobBusiness .jb_list li h4 { font-size: 1.7rem; font-weight: bold; color: #506A79; margin-top: 1.4rem; }
#jobBusiness .jb_list li p { color: #000; }
#jobBusiness .jb_list li p.s { color: #398DDB; }
@media screen and (max-width:1024px) { /* l */
	#jobBusiness .w { grid-template-columns: 1fr; margin-left: 5rem; margin-top: 4rem; gap: 4rem; }
	#jobBusiness .jb_list { gap: 3rem; }
}
@media screen and (max-width:480px) { /* s */
	#jobBusiness .w { margin-left: 3rem; margin-right: 3rem; margin-top: 4vw; gap: 4vw; }
	#jobBusiness .jb_list { gap: 4vw; }
	#jobBusiness .jb_list li a { padding: 1.5rem 4.5rem 1.5rem 1rem; }
}


/* recruit ----------*/
#recruit {}
#recruit .recruit_list { margin-top: 6rem; row-gap: 5rem; }
#recruit .recruit_list li {}
#recruit .recruit_list li .w { background-color: #FFF; padding: 3rem 3.5rem; box-shadow: 3px 4px 10px 0 rgba(154, 215, 250, 0.20); }
#recruit .recruit_list li.s1 .w { margin-left: 4rem; }
#recruit .recruit_list li.s2 .w { margin-right: 4rem; }
#recruit .recruit_list li h3 { font-weight: bold; color: #03176A; font-size: 2.6rem; text-align: center; margin-bottom: 2rem; }
#recruit .recruit_list li .pw { text-align: center; }
#recruit .recruit_list li .pw img { max-width: 26rem; }
#recruit .recruit_list li p { color: #000; }
#recruit .recruit_list li p mark { background:linear-gradient(transparent 60%, rgba(255, 255, 139, 0.90) 60%); }
#recruit .recruit_list li .btw { margin-top: 2rem; }
#recruit .recruit_list li .btw .bt { width: 100%; }
#recruit .recruit_list li .btw .bt span { justify-content: center; text-align: center; }
#recruit .recruit_list li .btw .bt.-recruit1 span,
#recruit .recruit_list li .btw .bt.-recruit2 span { font-weight: bold; font-size: 1.8rem; padding-left: 4rem; padding-right: 4rem; line-height: 1.5; }
#recruit .recruit_list li .btw .bt.-recruit1::after { background-color: #56C0ED; }
#recruit .recruit_list li .btw .bt.-recruit1:hover::after { background-color: #D9EEF9; }
#recruit .recruit_list li .btw .bt.-recruit1 span { background-color: #08599F; }
#recruit .recruit_list li .btw .bt.-recruit1:hover span { background-color: #73B6DA; }
#recruit .recruit_list li .btw .bt.-recruit1:hover span::before { border-color: #08689F; }
#recruit .recruit_list li .btw .bt.-recruit1:hover span::after { border-color: transparent transparent transparent #08689F; }
#recruit .recruit_list li .btw .bt.-recruit2 span {}
#recruit .recruit_list li .btw .bt.-recruit2::after { background-color: #D9EEF9; }
#recruit .recruit_list li .btw .bt.-recruit2:hover::after { background-color: #73B6DA; }
#recruit .recruit_list li .btw .bt.-recruit2 span::before { border-color: #013E61; }
#recruit .recruit_list li .btw .bt.-recruit2 span::after { border-color: transparent transparent transparent #013E61; }
#recruit .recruit_list li .btw .bt.-recruit2:hover span { background-color: #08599F; }
#recruit .recruit_list li .btw .bt.-recruit2:hover span::before { border-color: #FFF; }
#recruit .recruit_list li .btw .bt.-recruit2:hover span::after { border-color: transparent transparent transparent #FFF; }
@media screen and (max-width:1024px) { /* l */
	#recruit .recruit_list { margin-top: 4rem; row-gap: 0; }
}
@media screen and (max-width:896px) { /* m */
	#recruit .recruit_list li.s1 .w { margin-right: 4rem; }
	#recruit .recruit_list li.s2 .w { margin-left: 4rem; }
}
@media screen and (max-width:480px) { /* s */
	#recruit .recruit_list li.s1 .w,
	#recruit .recruit_list li.s2 .w { margin: 0 2rem; }
}