@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); */


/*
 environment_culture
==============================*/


/* common ----------*/
#contentsWrap .sec_inner { margin: auto; padding: 0 4rem; }


/* mvp ----------*/
#mvp {}
#mvp .sec_inner { max-width: 118.5rem; padding-bottom: 5rem; }
#mvp .pw { margin-top: -5%; }
#mvp .ov_01 { z-index: -1; bottom: 0; left: calc(100% - 15%); width: 24%; }
#mvp .ov_02 { z-index: -1; bottom: 0; left: 0; width: 12.5%; }
#mvp .ov_03 { z-index: -1; bottom: 0; right: 0; width: 12.5%; }


/* culture ----------*/
#culture { background-color: #FBFAF0; }
#culture .sec_inner { position: relative; z-index: 2; max-width: 100rem; padding-top: 10rem; padding-bottom: 13rem; }
#culture .box_01 { display: flex; flex-direction: row-reverse; align-items: end; gap: 3rem; }
#culture .box_01 .tw { width: 54%; }
#culture .box_01 .pw { width: calc(100% - 54% - 3rem); }
#culture .box_01 h2 { color: #5AC3A0; font-size: 2.4rem; font-weight: bold; margin-bottom: 2rem; }
#culture .box_01 p {}
#culture .cb1 { position: relative; margin-top: 6rem; max-width: 72rem; }
#culture .cb1 .h { display: grid; grid-template-columns: 8rem 1fr; gap: 2rem; }
#culture .cb1 .tw {}
#culture .cb1 .tw h3 { font-size: 2rem; }
#culture .cb1 .tww { margin-top: 4rem; padding: 2rem 3rem; border-radius: 2rem; border: dashed 2px #F9A49C; background-color: #FFF; }
#culture .cb1 .tww h4 { font-size: 1.8rem; color: #F9A49C; }
#culture .cb1 .abs_img { position: absolute; }
#culture .box_03 { margin-left: auto; }
#culture .box_03 .tww { border-color: #9FD4EF; }
#culture .box_04 .tww { border-color: #86C58A; }
#culture .box_03 .tww h4 { color: #63B3D0; }
#culture .box_04 .tww h4 { color: #80C183; }
#culture .box_02 .abs_img { width: 58%; left: calc(100% - 2rem); bottom: -2rem; }
#culture .box_03 .abs_img { width: 44.8%; right: calc(100% - 12rem); bottom: -2rem; }
#culture .box_04 .abs_img { width: 48.3%; left: calc(100% - 2rem); bottom: -4rem; }
#culture .ov_01 { top: 0; right: calc(100% - 25%); width: 41.5%; }
#culture .ov_02 { top: 16%; left: calc(100% - 25%); width: 41.5%; }
#culture .ov_03 { bottom: 0; right: calc(100% - 25%); width: 41.5%; }
#culture .ov_04 { bottom: 0; left: calc(100% - 25%); width: 41.5%; }
@media screen and (max-width:1200px) {
	#culture .ov_01 { right: calc(100% - 18%); }
}
@media screen and (max-width:1024px) { /* l */
	#culture .cb1 .tww { width: 70%; }
	#culture .box_02 .abs_img { width: 40.6%; left: calc(75% - 2rem); }
	#culture .box_03 .tww { margin-left: auto; }
	#culture .box_03 .abs_img { width: 31.4%; right: calc(75% - 12rem); }
	#culture .box_04 .abs_img { width: 33.8%; left: calc(75% - 2rem); }
}
@media screen and (max-width:480px) { /* s */
	#culture .box_01 { flex-direction: column; }
	#culture .box_01 .tw,
	#culture .box_01 .pw { width: 100%; }
	#culture .cb1 .h { grid-template-columns: 5rem 1fr; }
	#culture .cb1 .tww { width: 100%; margin-bottom: 20%; margin-top: 2rem; }
	#culture .box_03 .abs_img { right: calc(100% - 12rem); bottom: 0; }
	#culture .box_04 .abs_img {  bottom: 0; }
}