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


/*
 story
==============================*/

/* cwbg1 ----------*/
.cwbg1 { top: 3rem; left: 0; }
.cwbg2 { top: 0; right: 0; }
.cwbg3 { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; }
@media screen and (max-width:1200px) {
	.cwbg1 { left: -12rem; }
	.cwbg2 { right: -7rem; }
}
@media screen and (max-width:896px) { /* m */
	.cwbg1 { top: 20rem; }
	.cwbg2 { top: -20rem; right: -35rem; }
}

.obi_bg1::before { background-color: #FCFF6C; }
.obi_bg2::after { background-color: #FEFFB7; }

/* main ----------*/
#main .wbox { background-color: #FFFFF2; }
#main h2 { margin-bottom: 4rem; text-align: center; font-size: 3.2rem; font-weight: var(--bold); }
#main h2 span { position: relative; display: inline-block; min-width: 29.5rem; padding: 1.5rem 4rem; border: solid 2px #000; border-top: none; background-color: #FFF; box-shadow: 0.8rem 0.8rem 0 #F4D106; }
#main h2 span::before { position: absolute; top: 0; right: 0; content: ""; width: calc(100% - 40px); border-top: solid 2px #000; }
#main h2 span::after { position: absolute; bottom: 0.6rem; right: 0.6rem; content: ""; width: 4rem; height: 4rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40' fill='none'%3E%3Cpath d='M0 40H40V0L0 40Z' fill='%23F4D106'/%3E%3C/svg%3E"); }
#main h2 span i { position: absolute; top: 0; left: 0; display: block; width: 40px; height: 4px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='4' viewBox='0 0 40 4' fill='none'%3E%3Ccircle cx='10' cy='2' r='2' fill='black'/%3E%3Ccircle cx='19' cy='2' r='2' fill='black'/%3E%3Ccircle cx='28' cy='2' r='2' fill='black'/%3E%3C/svg%3E"); }
#main h3 { margin-bottom: 2rem; color: #ED9D00; font-size: 2.5rem; font-weight: var(--bold); }
#main .catch { margin-bottom: 4rem; text-align: center; }
#main p { line-height: 2; font-size: 1.4rem; font-weight: var(--medium); }

/* depthAnalysis ----------*/
#depthAnalysis { padding: 6.5rem 0 20rem; background-color: #FFFFD5; }
#depthAnalysis .analysis_list {}
#depthAnalysis .analysis_list li { position: relative; padding: 3rem; border-radius: 0.5rem; background-color: #FFF; box-shadow: 4px 6px 15px 0px rgba(0, 0, 0, 0.25); }
#depthAnalysis .analysis_list h3 { position: absolute; top: 3rem; left: 3rem; width: calc(100% - 6rem); margin-bottom: 0; color: #FBC917; font-size: 3.4rem; letter-spacing: 0; }
#depthAnalysis .analysis_list .ill { text-align: center; }
#depthAnalysis .analysis_list p { line-height: 2; font-size: 1.4rem; }
@media screen and (max-width:1340px) {
	#depthAnalysis .analysis_list li { padding: 2.2vw; }
	#depthAnalysis .analysis_list h3 { top: 2.2vw; left: 2.2vw; width: calc(100% - 4.4rem); font-size: 2.4vw; white-space: nowrap; }
}
@media screen and (max-width:896px) { /* m */
	#depthAnalysis { padding: 4rem 0 10rem; }
	#depthAnalysis .analysis_list h3 { font-size: 3.8vw; }
	#depthAnalysis .analysis_list p { line-height: 1.4; }
}

/* companyMotto ----------*/
#companyMotto {}
#companyMotto p { letter-spacing: 0; }
#companyMotto .tx1 { font-size: 1.6rem; }
#companyMotto .arrow { margin-top: 3rem; }
#companyMotto .sbox { position: relative; background-color: #FFF; padding: 6rem 3.6rem 3.6rem; box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.12); margin-top: 6rem; }
#companyMotto .sbox h2 { position: absolute; left: 0; right: 0; margin: auto; top: -3.3rem; }
#companyMotto .sbox h2 img { box-shadow: 3px 4px 6px 0px rgba(0, 0, 0, 0.16); }
#companyMotto .value_list { margin-top: 4rem; }
#companyMotto .value_list li { background-color: #FEF7E4; padding: 2rem; box-shadow: 3px 4px 6px 0px rgba(0, 0, 0, 0.12); }
#companyMotto .value_list li h4 { color: #ED9D00; font-size: 2.2rem; letter-spacing: 0; }
@media screen and (max-width:480px) { /* s */
	#companyMotto .sbox { padding: 10rem 2rem 2rem; }
}