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


/*
 about
==============================*/


/* about ----------*/
#about {}
#about .h3 { color: #FED93F; }
#about .w .pw { margin-left: -40%; }
#about .w .tw {}
#about .w .tw .btw { margin-top: 6rem; }
@media screen and (max-width:1260px) { /* x */
	#about .w .pw { margin-left: -20%; }
}
@media screen and (max-width:896px) { /* m */
	#about .w .pw { margin-left: 0; text-align: center; }
}
@media screen and (max-width:480px) { /* s */
	#about .w .tw .btw { margin-top: 3rem; }
}


/* repeatBlock ----------*/
#repeatBlock .sec:nth-child(3n+1) {
	background-image: url(../img/about/philosophy_bg_01.png), url(../img/about/philosophy_bg_02.png), url(../img/about/philosophy_bg_03.png), url(../img/about/philosophy_bg_04.png);
	background-position: left top, right top, left bottom, right bottom;
	background-size: 48rem auto;
	background-repeat: no-repeat;
}
#repeatBlock .sec:nth-child(3n+1) .h3 { color: #E60012; }
#repeatBlock .btw { margin-top: 6rem; }
@media screen and (max-width:1300px) {
	#repeatBlock .sec:nth-child(3n+1) { background-size: 33% auto; }
}
@media screen and (max-width:480px) { /* s */
	#repeatBlock .sec:nth-child(3n+1).-space { padding-left: 10% !important; padding-right: 10% !important; }
	#repeatBlock .btw { margin-top: 3rem; }
}

#repeatBlock .sec:nth-child(3n+2) {
	background-color: #5BB531;
	background-image: url(../img/about/act_guideline_bg_01.png), url(../img/about/act_guideline_bg_02.png);
	background-position: right top, left bottom;
	background-size: 48rem auto;
	background-repeat: no-repeat;
}
#repeatBlock .sec:nth-child(3n+2) .h3 { color: #FED93F; }
#repeatBlock .sec:nth-child(3n+2) p { color: #FFF; }
@media screen and (max-width:1300px) {
	#repeatBlock .sec:nth-child(3n+2) { background-size: 33% auto; }
}
@media screen and (max-width:480px) { /* s */
	#repeatBlock .sec:nth-child(3n+2).-space { padding-left: 10% !important; padding-right: 10% !important; }
}

#repeatBlock .sec:nth-child(3n+3) {
	background-color: #007BC7;
	background-image: url(../img/about/name_origin_bg_01.png), url(../img/about/name_origin_bg_02.png);
	background-position: left top, right bottom;
	background-size: 48rem auto;
	background-repeat: no-repeat;
}
#repeatBlock .sec:nth-child(3n+3) .h3 { color: #FED93F; }
#repeatBlock .sec:nth-child(3n+3) p { color: #FFF; }
@media screen and (max-width:1300px) {
	#repeatBlock .sec:nth-child(3n+3) { background-size: 33% auto; }
}
@media screen and (max-width:480px) { /* s */
	#repeatBlock .sec:nth-child(3n+3).-space { padding-left: 10% !important; padding-right: 10% !important; }
}


/* seeInNumber ----------*/
#seeInNumber {
	background-image: url(../img/about/philosophy_bg_01.png), url(../img/about/philosophy_bg_02.png), url(../img/about/philosophy_bg_03.png), url(../img/about/philosophy_bg_04.png);
	background-position: left top, right top, left bottom 30%, right -5rem top 65%;
	background-size: 48rem auto;
	background-repeat: no-repeat;
}
#seeInNumber .h2 { margin-bottom: 13rem; }
#seeInNumber .number_list { /*display: grid; grid-template-columns: 1fr 1fr 1fr; column-gap: 6rem;*/ row-gap: 2rem; }
#seeInNumber .number_list li { position: relative; padding: 3rem; background-color: #E7FBFB; border: solid 2px #000; /*display: grid; grid-template-rows: subgrid; grid-template-rows: 1fr auto auto; grid-row: span 3; gap: 2rem; align-items: start;*/ }
#seeInNumber .number_list div li::before { content: ""; display: block; position: absolute; width: 9rem; background-repeat: no-repeat; background-position: center; background-size: contain; }
#seeInNumber .number_list div:nth-child(9n+1) li::before { height: 10.8rem; background-image: url(../img/about/see_in_number_ill_01.png); left: 0; bottom: calc(100% - 1rem); }
#seeInNumber .number_list div:nth-child(9n+6) li::before { height: 10.8rem; background-image: url(../img/about/see_in_number_ill_02.png); right: -1.7rem; bottom: calc(100% - 1.1rem); }
#seeInNumber .number_list div:nth-child(9n+7) li::before { height: 14.6rem; background-image: url(../img/about/see_in_number_ill_03.png); right: calc(100% - 0.7rem); top: 20%; }
#seeInNumber .number_list li h3 { font-size: 2.2rem; color: #007BC7; text-align: center; font-weight: 900; margin-bottom: 1rem; }
#seeInNumber .number_list li .per { text-align: center; color: #E60012; line-height: 1.2; font-weight: 900; vertical-align: baseline; }
#seeInNumber .number_list li .per span { font-size: 7rem; line-height: 1; vertical-align: baseline; word-break: break-all; }
#seeInNumber .number_list li .per small { display: inline-block; font-size: 3rem; vertical-align: baseline; line-height: 1.4; }
#seeInNumber .number_list li p { margin: 0; font-size: 1.4rem; line-height: 2; font-weight: 500; }
@media screen and (max-width:1300px) {
	#seeInNumber { background-size: 33% auto; }
}
@media screen and (max-width:480px) { /* s */
	#seeInNumber { background-position: left top, right top, left bottom, right -5rem top 65%; }
	#seeInNumber .h2 { margin-bottom: 6rem; }
	#seeInNumber .number_list { row-gap: 0; }
	#seeInNumber .number_list div li::before { width: 5.4rem; }
	#seeInNumber .number_list div:nth-child(9n+1) li::before { height: 6.48rem; bottom: calc(100% - 0.6rem); }
	#seeInNumber .number_list div:nth-child(9n+6) li::before { height: 6.48rem; bottom: calc(100% - 0.66rem); }
	#seeInNumber .number_list div:nth-child(9n+7) li::before { height: 8.76rem; right: calc(100% - 0.40rem); }
}