@charset "utf-8";


	/* s_txt */
	.s_txt{}
	.s_txt h4{font-size: 15px; font-family: 'Play', serif; color: #0068b7;}
	.s_txt h3{font-size: 50px; font-weight: 300; margin-top: 50px;}
	.s_txt h3 span{font-weight: 800;}
	.s_txt p{}

	@media all and (max-width:1280px){
		.s_txt h4{font-size: 14px;}
		.s_txt h3{font-size: 44px; margin-top: 40px;}
	}
	@media all and (max-width:1024px){
		.s_txt h4{font-size: 14px;}
		.s_txt h3{font-size: 40px; margin-top: 35px;}
		.s_txt h3 br{display: none;}
	}
	@media all and (max-width:768px){
		.s_txt h4{font-size: 13px;}
		.s_txt h3{font-size: 36px; margin-top: 32px;}
	}
	@media all and (max-width:500px){
		.s_txt h3{font-size: 30px; margin-top: 27px;}
	}


/* intro1 */
	.intro1{}
	.intro1 .top{text-align: center;}
	.intro1 .top .inner{}
	.intro1 .top .inner h3{font-size: 50px; font-weight: 300;}
	.intro1 .top .inner h3 span{font-weight: 800; color: #0068b7;}
	.intro1 .top .inner p{font-size: 18px; font-weight: 500; color: #222222; line-height: 1.8em; margin-top: 30px;}
	.intro1 .top .inner h4{font-size: 22px; color: #9a9a9a; font-family: 'Play', serif; margin-top: 55px;}
	.intro1 .top .inner h4 span{color: #33c0e1;}
	.intro1 > .img{text-align: center; margin-top: 80px;}
	.intro1 > .img img{max-width: 100%;}
	.intro1 .bg{padding: 400px 0 180px; background: url(/images/sub/intro1_bg.webp) no-repeat center center / cover; margin-top: -320px;}
	.intro1 .bg .inner{display: flex;}
	.intro1 .bg .inner .l_cont{width: 50%;}
	.intro1 .bg .inner .l_cont .s_txt{}
	.intro1 .bg .inner .r_cont{width: 50%; padding-top: 75px;}
	.intro1 .bg .inner .r_cont p{font-size: 17px; color: #686868; font-weight: 500; line-height: 1.8em; word-break: keep-all; letter-spacing: 0;}

	@media all and (max-width:1280px){
		.intro1 .top .inner h3{font-size: 44px;}
		.intro1 .top .inner p{font-size: 17px; margin-top: 25px;}
		.intro1 .top .inner h4{font-size: 20px; margin-top: 40px;}
		.intro1 > .img{margin-top: 70px;}
		.intro1 .bg{padding-bottom: 140px; padding-top: 380px;}
		.intro1 .bg .inner .l_cont{padding-right: 30px;}
		.intro1 .bg .inner .r_cont{padding-top: 60px;}
		.intro1 .bg .inner .r_cont p{font-size: 16px; line-height: 1.7em;}
	}
	@media all and (max-width:1024px){
		.intro1 .top .inner h3{font-size: 40px;}
		.intro1 > .img{margin-top: 60px;}
		.intro1 .bg{padding-bottom: 120px;}
	}
	@media all and (max-width:768px){
		.intro1 .top{text-align: left;}
		.intro1 .top .inner h3{font-size: 36px;}
		.intro1 .top .inner p{font-size: 16px; margin-top: 20px;}
		.intro1 .top .inner p br{display: none;}
		.intro1 .top .inner h4{font-size: 18px; line-height: 1.4em; margin-top: 30px;}
		.intro1 > .img{margin-top: 50px;}
		.intro1 .bg{padding-bottom: 100px;}
		.intro1 .bg .inner{flex-direction: column;}
		.intro1 .bg .inner .l_cont{width: 100%; margin-bottom: 30px;}
		.intro1 .bg .inner .r_cont{width: 100%; padding-top: 0;}
		.intro1 .bg .inner .r_cont p{font-size: 15px;}
	}
	@media all and (max-width:500px){
		.intro1 .top .inner h3{font-size: 30px;}
		.intro1 > .img{margin-top: 45px;}
		.intro1 .bg{padding-bottom: 80px;}
	}


#intro1-2 {display: flex; justify-content: center; align-items: center; gap:0 100px}
#intro1-2 ul {text-align:Center}
#intro1-2 ul .icon {border-radius:100%; background:#FFF; box-shadow: 0 0 20px rgba(85,85,85,0.1);
					  width:150px; height:150px; margin:0 auto; 
					  display: flex; justify-content: center; align-items: center;}
#intro1-2 ul .t1 {padding-top:30px; font-size:22px; font-weight:700}
@media all and (max-width:1080px){
	#intro1-2 ul .t1 {padding-top:20px; font-size:22px; }
}
@media all and (max-width:976px){
	#intro1-2 {gap:0 10%; } 
	#intro1-2 ul .icon {width:100px; height:100px;}
	#intro1-2 ul .icon img {width:60px}
}
@media all and (max-width:640px){
	#intro1-2 {max-width:390px; margin:0 auto; flex-wrap:wrap; }
	#intro1-2 ul {padding:10px;}
}
@media all and (max-width:480px){
	#intro1-2 ul .t1 {padding:20px 0 10px; font-size:20px; }
	#intro1-2 ul .icon {width:90px; height:90px;}
	#intro1-2 ul .icon img {width:50px}
}




#intro1-3 {background:#f9f9f9}
#intro1-3 .inner {display: flex; justify-content: center; flex-wrap:wrap}
#intro1-3 .inner ul {text-align:center; width:31.333%; margin:1%; background:#FFF; padding:10px;}
#intro1-3 .inner ul .img {}
#intro1-3 .inner ul .img img {width:100%}
#intro1-3 .inner ul .cont {padding:50px 0}
#intro1-3 dl dt {font-size:26px; font-weight:700}
#intro1-3 dl dd {padding:2% 0 7%; font-size:20px; font-family: 'Play', serif; color: #0068b7; font-weight:700}
#intro1-3 .t1 {font-size:1.7rem; line-height:1.8em; color:#777}

@media all and (max-width:1280px){
	#intro1-3 .inner ul .cont {padding:30px 0}
}
@media all and (max-width:768px){
	#intro1-3 dl dt {font-size:22px;}
	#intro1-3 dl dd { font-size:18px;}
}
@media all and (max-width:640px){
	#intro1-3 .inner ul { width:100%; margin:1% 0 }
}





#overview {width:90%; max-width:1400px; margin:0 auto; display: flex; align-items: center; flex-wrap: wrap; }
#overview .img { width: 580px; text-align:right }
#overview .img img { max-width: 100%; }
#overview .cont { width: calc(100% - 580px); padding: 1% 0 1% 8%; }
#overview .cont dl { display: flex; flex-wrap: wrap; font-size: 1.7rem; }
#overview .cont dl dt, #overview .cont dl dd { padding: 0.8em 0; line-height: 1.7em; border-bottom: 1px solid #e5e5e5; }
#overview .cont dl dt { width: 150px;  font-weight: 800; }
#overview .cont dl dd { width: calc(100% - 150px); color:#777 }
#overview .cont dl dd ul { font-size: 0.94em; line-height: 1.5em; display:flex; flex-wrap:wrap; gap:5px 20px }

@media all and (max-width:1280px) {
	#overview .cont dl { font-size: 1.6rem; }
	#overview .img { width: 45%; }
	#overview .cont { width: 55%; padding: 1% 0 1% 5%; }
	#overview .cont dl dt { width: 120px;  }
	#overview .cont dl dd { width: calc(100% - 120px); }
}
@media all and (max-width:1024px) {
	#overview { align-items: start;}
	#overview .cont { width: 55%; padding: 0 0 0 5%; }
}
@media all and (max-width:976px) {
	#overview .img { width: 100%; text-align:center }
	#overview .cont { width: 100%; padding: 5% 5% 0;  }
	#overview .cont dl dt { width: 130px; }
	#overview .cont dl dd { width: calc(100% - 130px); }
}
@media all and (max-width:480px) {
	#overview .cont dl dt { width: 20vw; }
	#overview .cont dl dd { width: calc(100% - 20vw); }
}




#historyTop {width:100%; height:430px;  background:#555 url('/images/sub/intro2-bg.png')no-repeat center bottom; 
				display:flex;  align-items: center; background-size:cover;  position:relative; overflow:hidden}
#historyTop .eng {display:none; font-size:5.2vw; font-weight:900; letter-spacing:-0.05em; opacity:.2; position:absolute; left:-15px; bottom:-10px; 
						font-family: 'Montserrat'; line-height:0.8em; color:#FFF; text-transform:uppercase}
#historyTop .in-box {padding-left:5%; color:#FFF;}
#historyTop h4 { font-size:28px;  font-weight:300; margin-bottom:0.3em;  }
#historyTop h3 {width:100%; max-width: 710px;  font-size:45px;  font-weight:300;  line-height:1.2em;}
#historyTop h3 br {display:none}
#historyTop .t1 {font-size:1.8rem; margin-top:1.5em}

@media all and (max-width:1599px) {
	#historyTop .eng {font-size:5.85vw; left:-15px; bottom:-10px; }
}
@media all and (max-width:1280px) {
	#historyTop { height:380px; }
}
@media all and (max-width:1024px) {	
	#historyTop {justify-content:center; background-attachment: unset; background-size:auto 100%}
	#historyTop .in-box {max-width:500px; text-align:center; padding-left:0;  }
	#historyTop .eng {font-size:5.85vw; left:-0.9vw; bottom:-0.5vw; }
	#historyTop h4 { font-size:22px;  margin-bottom:0.8em;  }
	#historyTop h3 br {display:block}
	#historyTop h3 { font-size:40px; }  
}
@media all and (max-width:767px) {	
}
@media all and (max-width:580px) {	
	#historyTop h4 { font-size:20px;}
	#historyTop h3 { font-size:38px}
}
@media all and (max-width:480px) {	
	#historyTop {  height:66vw;}
	#historyTop h4 {  font-size:18px; margin-bottom:1em}
	#historyTop h3 { font-size:30px}
}

.his_wrap {overflow:hidden; box-sizing:border-box; position:relative; }
.his_wrap:before{content:""; position:absolute; top:0; left:50%; margin-left:-0.5px; width:1px; height:100%; background:#ddd; z-index:1;}

.his_wrap .his_bx{box-sizing:border-box; padding-top:5em; position:relative; overflow:hidden;}
.his_wrap .his_bx .in{clip: rect(auto, auto, auto, auto); top:0; left:0; width:100%; height:100%; position:absolute; z-index:0; overflow:hidden;}
.his_wrap .his_bx .in .bg{position: fixed; display: block; top: 0; left: 0; width: 100%; height: 100%; background-repeat:no-repeat; background-position:center center; transform: translateZ(0); will-change: transform; }
.his_wrap .his_bt{padding-bottom:8em}

.his_wrap li {position:relative; z-index:2;  width:50%; float:right; text-align:left; padding:0 0 3em 50px; box-sizing:Border-box;}
.his_wrap li+li{clear:both;}

.his_wrap li .t { position:relative; font-size:5.0rem; margin-bottom:0.5em; color:#00b5ea; font-weight:800;  font-family:'Montserrat'}
.his_wrap li .t:before {content:""; position:absolute; top:0.45em; left:-60px; width:20px; height:20px; border-radius:100%; 
					background:#0068b7 ; border:6px solid #d0e8fa;}
.his_wrap li .c dt{ width:40px; display:none; vertical-align:top; margin-bottom:10px; color:#212121; font-weight: 700; line-height: 1.5em;  font-size:2.0rem; font-family:'Roboto'}
.his_wrap li .c dd{width:calc(100% - 40px); display:inline-block; vertical-align:top; margin-bottom:10px; line-height: 1.5em;
					font-size:1.7rem; color:#777; position:relative }
.his_wrap li .c dd:before {content:''; width:3px; height:3px; background:#222; position:absolute; left:0; top:0.7em;}
.his_wrap li .c p {padding-left:13px; }

.his_wrap li:nth-of-type(2n) {float:left; text-align:right;  padding:0 50px 3em 0;}
.his_wrap li:nth-of-type(2n) .t:before{left:unset; right:-60px;}
.his_wrap li:nth-of-type(2n) dt{float:right; }
.his_wrap li:nth-of-type(2n) dd:before { left:unset;  right:0; }
.his_wrap li:nth-of-type(2n) .c p {padding-left:0; padding-right:13px;}

@media all and (max-width:767px) {
	.his_wrap .his_bx{ padding-left:10px;}
	.his_wrap:before{ margin-left:0; left:10px;  }
	.his_wrap li{ width:100%; padding:0 0 3em 20px;}
	.his_wrap li .t { font-size: 4.0rem; }
	.his_wrap li .t:before { top:0.35em;   left:-30px; }
	.his_wrap li .c dt{ width:50px; }
	.his_wrap li .c dd{width:calc(100% - 50px); }

	.his_wrap li:nth-of-type(2n){float:right; text-align:left; padding:0 0 3em 20px;}
	.his_wrap li:nth-of-type(2n) .t:before{left:-30px; right:inherit;}
	.his_wrap li:nth-of-type(2n) dt{float:left; }
	.his_wrap li:nth-of-type(2n) dd:before { left:0;  right:unset; }
.his_wrap li:nth-of-type(2n) .c p {padding-left:13px; padding-right:0;}
}
@media all and (max-width:568px) {
	.history-top { padding: 12% 0; }
	.history-top h4 { font-size: 3.5rem; }
}







#certList { overflow: hidden; text-align: left; display: flex;  flex-wrap: wrap;  gap: 40px; }
#certList li { width: calc((100% - 120px) / 4); }
#certList li .img { border: 1px solid #dedede; padding: 10px; }
#certList li img { max-width: 100%; border: 1px solid #f2f2f2; }
#certList li p { margin-top: 1em; font-size: 1.8rem; font-weight: 600; color:#212121; text-align: center; }


@media all and (max-width:1480px) {
  #certList { gap: 30px; }
  #certList li { width: calc((100% - 90px) / 4); }
}

@media all and (max-width:1280px) {
  #certList { gap: 25px; }
  #certList li { width: calc((100% - 50px) / 3); }
}

@media all and (max-width:640px) {
  #certList { gap: 20px; }
  #certList li { width: calc((100% - 20px) / 2); }
}







#halfWrap-intro5 {display:flex; flex-wrap:wrap; }
#halfWrap-intro5 .titWrap {width:30% ;border-top:1px solid #222; padding:80px 0}
#halfWrap-intro5 .titWrap h3 {padding-bottom:1em;font-size:40px; font-weight:800;}
#halfWrap-intro5 .titWrap h3 .st1 {font-size:30px; font-weight:300}
#halfWrap-intro5 .titWrap dl {display:flex;  padding:2em 0}
#halfWrap-intro5 .titWrap dl + dl {border-top:1px dashed #DDD;}
#halfWrap-intro5 .titWrap dl dt {width:100px; font-weight:700; font-size:17px;}
#halfWrap-intro5 .titWrap dl dt i {padding-right:5px; font-size:13px}
#halfWrap-intro5 .titWrap dl dd {width:calc(100% - 100px); font-size:17px; color:#777 }

#halfWrap-intro5 .contWrap {width:70%; border-top:1px solid #DDD; padding:80px 0; padding-left:5%;}
.root_daum_roughmap .wrap_controllers {display:none}
.root_daum_roughmap .wrap_map { height: 400px !important }

@media all and (max-width:1024px) {
	#halfWrap-intro5 .titWrap dl dt {width:80px;}
	#halfWrap-intro5 .titWrap dl dd {width:calc(100% - 80px);}
	.root_daum_roughmap .wrap_map { height: 380px !important }
}
@media all and (max-width:976px) {
	#halfWrap-intro5 .titWrap {width:100%; display:flex; flex-wrap:wrap; justify-content:space-between; padding:50px 0 0}
	#halfWrap-intro5 .titWrap h3 {width:100%; padding-bottom:0.3em;}
	#halfWrap-intro5 .titWrap dl {width:49%; border-bottom:1px dashed #DDD; }
	#halfWrap-intro5 .titWrap dl + dl {border-top:0 }
	#halfWrap-intro5 .contWrap {width:100%; padding-left:0; border-top:0; padding:50px 0 }
}
@media all and (max-width:640px) {
	#halfWrap-intro5 .titWrap dl {width:100%;}
	#halfWrap-intro5 .titWrap h3 {font-size:30px;}
	#halfWrap-intro5 .titWrap h3 .st1 {font-size:20px;}
}









.p-Part {padding:100px 0}
.m-Part {margin:100px 0}

@media all and (max-width:480px){
	.p-Part {padding:70px 0}
	.m-Part {padding:70px 0}
}


#sTitle {text-align:center; padding-bottom:80px}
#sTitle h3 {font-size:32px; font-weight:300; line-height:1.6em;  }
#sTitle h3 span.point {color:#106eb9; font-weight:700}

@media all and (max-width:1399px){
	#sTitle h3 {font-size:30px; }
}
@media all and (max-width:768px){
	#sTitle h3 {font-size:28px; line-height:1.4em;}
}
@media all and (max-width:480px){
	#sTitle  {padding-bottom:50px}
	#sTitle h3 {font-size:22px;  }
	#sTitle h3 br {display:none}
}





#esg1Wrap {display:flex; justify-content:center; gap:0 80px}
#esg1Wrap li {text-align:center;}
#esg1Wrap li .icon {width:250px; height:250px; border-radius:100%; color:#FFF;  background:#00b5ea; margin:0 auto;
						display:flex; flex-wrap:wrap;justify-content:center; align-content: center;}
#esg1Wrap li .icon .eng {margin-top:15px; font-size: 18px; font-family: 'Play', serif; opacity:.5; width:100%; font-weight:700}
#esg1Wrap li .icon h4 {font-size:34px; }
#esg1Wrap li h3 {padding:50px 0 20px; font-size:26px; font-weight:700}
#esg1Wrap li .t1 {font-size:17px; color:#777; line-height:2.0em}

@media all and (max-width:1180px){
	.esg1 #sTitle h3 br {display:none}
	#esg1Wrap {padding:0 5%}
	#esg1Wrap {justify-content:space-between; gap:0}
}
@media all and (max-width:1024px){
	#esg1Wrap li .icon {width:210px; height:210px; }
	#esg1Wrap li .icon img {width:70px}
	#esg1Wrap li .icon .eng { font-size: 16px}
	#esg1Wrap li .icon h4 {font-size:28px; }
	#esg1Wrap li h3 {padding:30px 0 10px; font-size:22px; }
	#esg1Wrap li .t1 {line-height:1.8em}
}
@media all and (max-width:840px){
	#esg1Wrap {flex-wrap:wrap}
	#esg1Wrap li {width:100%}
	#esg1Wrap li:nth-child(2) {margin:50px 0}
}
@media all and (max-width:480px){
	#esg1Wrap {gap:0 50px}
	#esg1Wrap li .icon {width:170px; height:170px; }
	#esg1Wrap li .icon img {width:50px}
	#esg1Wrap li .icon .eng {margin-top:10px; font-size: 15px; }
	#esg1Wrap li .icon h4 {font-size:26px; }
	#esg1Wrap li h3 {padding:25px 0 10px; font-size:20px;}
	#esg1Wrap li .t1 {font-size:16px;  line-height:1.6em}
}




#esg2Top {height:460px; background:url('/images/sub/esg2-bg1.png') no-repeat center center}

@media all and (max-width:1024px){
	#esg2Top {height:380px; background-size:auto 100% }
}
@media all and (max-width:768px){
	#esg2Top {height:42vw }
}



#esg2Wrap {padding-top:80px; text-align:center}
#esg2Wrap .eng {margin-bottom:45px; font-size: 20px; font-family: 'Montserrat', serif; font-weight:800;
						text-transform:uppercase; color:#222;}
#esg2Wrap h3 {width:90%; max-width:1024px; padding:20px 30px; font-size:32px; margin:0 auto; 
					border-radius:50px; box-shadow:0 3px 15px rgba(85,85,85,0.1); font-weight:300 }
#esg2Wrap h3 br {display:none}
#esg2Wrap h3 span.point {color:#00b5ea; font-weight:700}

#esg2Wrap .esg2-2 {padding:95px 0; margin:80px 0 20px; background:url('/images/sub/esg2-bg2.png') no-repeat center center}
#esg2Wrap .esg2-2 dl dt {font-size:32px; font-weight:300}
#esg2Wrap .esg2-2 dl dt span.point {color:#00b5ea; font-weight:700}
#esg2Wrap .esg2-2 dl dd {padding-top:1em; font-size:15px; font-weight:600; line-height:1.2em; opacity:.5; color:#777; 
								letter-spacing:0.01em}

#esg2Wrap .esg2-4 {margin-top:80px; display:flex; flex-wrap:wrap; justify-content:center; gap:0 100px} 
#esg2Wrap .esg2-4 .eng {width:100%}
#esg2Wrap .esg2-4 li .icon {border-radius:100%; background:#FFF; box-shadow: 0 0 20px rgba(85,85,85,0.1);
									width:150px; height:150px; margin:0 auto;
								display: flex; justify-content: center; align-items: center;}
#esg2Wrap .esg2-4 li h4 {padding:30px 0 20px; font-size:26px; font-weight:700}
#esg2Wrap .esg2-4 li .t1 {font-size:17px; color:#777; line-height:2.0em}
#esg2Wrap .esg2-4 li:nth-child(3) {padding:0 100px; border-left:1px dotted #e9e9e9; border-right:1px dotted #e9e9e9}

@media all and (max-width:1080px){
	#esg2Wrap .esg2-2 {padding:3% 0 0; margin:80px 0  ;background-size:auto 100%}
	#esg2Wrap .esg2-4 {gap:0 50px} 
	#esg2Wrap .esg2-4 li:nth-child(3) {padding:0 50px;}

	#esg2Wrap h3 {font-size:28px;}
	#esg2Wrap .esg2-2 dl dt {font-size:28px;}
	#esg2Wrap .esg2-4 li h4 {padding:20px 0 10px; font-size:22px; }
	#esg2Wrap .esg2-4 li .t1 {line-height:1.6em}
}
@media all and (max-width:768px){
	#esg2Wrap .eng {margin-bottom:20px;}	
	#esg2Wrap h3 br.br768 {display:block}
	#esg2Wrap h3 {font-size:26px;}
	
	#esg2Wrap .esg2-2 dl dt {font-size:26px;}
	#esg2Wrap .esg2-2 dl dd {display:none}

	#esg2Wrap .esg2-4 {gap:0; justify-content:space-between; padding:0 5%} 
	#esg2Wrap .esg2-4 li .icon {width:100px; height:100px;}
	#esg2Wrap .esg2-4 li .icon img {width:60px}

	#esg2Wrap .esg2-4 li:nth-child(3) {padding:0; border:0}
}
@media all and (max-width:530px){
	#esg2Wrap .esg2-4 li {width:100%; display:flex; flex-wrap:wrap;  justify-content:center;  }
	#esg2Wrap .esg2-4 li h4 {width:100%}
	#esg2Wrap .esg2-4 li .t1 {padding:0 0.5em}
	#esg2Wrap .esg2-4 li:nth-child(3) {margin:30px 0}
}
@media all and (max-width:480px){
	#esg2Wrap {padding-top:50px;}
	#esg2Wrap .eng {font-size: 17px; font-weight:800}
	#esg2Wrap h3 {font-size:20px;}
	#esg2Wrap h3 br.br480 {display:block}
	#esg2Wrap .esg2-2 { margin:50px 0}
	#esg2Wrap .esg2-2 dl dt {font-size:20px;}
	#esg2Wrap .esg2-4 {margin-top:50px}
	#esg2Wrap .esg2-4 li h4 {padding:20px 0 10px; font-size:20px; }
	#esg2Wrap .esg2-4 li .icon {width:90px; height:90px;}
	#esg2Wrap .esg2-4 li .icon img {width:50px}
	#esg2Wrap .esg2-4 li .t1 {font-size:16px; }
}




#esg2sTitle {text-align:center; margin:150px 0 50px}
#esg2sTitle h3 {font-size:40px; font-weight:300; line-height:1.6em;  }
#esg2sTitle h3 span.point {color:#106eb9; font-weight:700}
#esg2sTitle .t1 {padding-top:10px; font-size:16px; color:#777; opacity:.7}

@media all and (max-width:1399px){
	#esg2sTitle h3 {font-size:36px; }
}
@media all and (max-width:768px){
	#esg2sTitle h3 {font-size:32px; line-height:1.4em;}
}
@media all and (max-width:480px){
	#esg2sTitle {text-align:center; margin:100px 0 30px}
	#esg2sTitle h3 {font-size:30px;  }
	#esg2sTitle h3 br {display:none}
}



.scroll table{min-width: 940px;} 
.scroll2 table{min-width:710px;} 
.scroll-t {padding-top:20px; font-size:15px; color:#777; display:none}
.tb-style1{width: 100%; font-size: 17px; text-align: center; }
.tb-style1 thead tr th{padding: 20px 10px; background-color: #00b5ea; border-right: 1px solid #eee; font-size:20px; 
						font-weight: 500; border-bottom: 1px solid #eee; color: #FFF; line-height:1.6em }
.tb-style1 thead tr th.bg1{background-color: #9b9b9b;}
.tb-style1 thead tr th.bg3{background-color: #106eb9;}
.tb-style1 thead tr th:last-child{border-right: 0;}
.tb-style1 tbody tr th{ background-color: #f9f9f9;  color: #222; font-weight: 600; 
							border-bottom: 1px solid #eee; border-right: 1px solid #eee;}
.tb-style1 tbody tr td{padding: 20px 10px; border-bottom: 1px solid #eee; border-right: 1px solid #eee; color:#777;
							line-height:1.6em}
.tb-style1 tbody tr td:last-child{border-right: 0;}
.tb-style1 tbody tr td.td-f { border-right: 1px solid #eee;}

.tb-style1.ver2 thead tr th{border-top:2px solid #00b5ea; background:#eaf8fd; color:#222; 
								border-right: 1px solid #dde8ec; border-bottom:1px solid #dde8ec }
.tb-style1.vre2 thead tr th:last-child{border-right: 0;}
@media all and (max-width:999px){
	.scroll{overflow-x: scroll;}
	.scroll-t {display:block}
} 
@media all and (max-width:750px){
	.scroll2 {overflow-x: scroll;}
} 
@media all and (max-width:480px){
	.tb-style1 { font-size: 16px;}
	.tb-style1 thead tr th {padding: 15px 5px; font-size:18px; }
	.tb-style1 tbody tr td{padding: 15px 5px;}
} 




#tabWrap {padding-bottom:80px;}
#tabWrap ul {display: flex; flex-wrap:wrap;  justify-content:center; text-align: center; padding:10px; background:#f9f9f9}
#tabWrap ul  li {width:250px; background:#FFF; border:1px solid #ebedf4;  border-radius:5px; margin:2px;}
#tabWrap ul  li a { display: block; padding: 1.2em 0;  font-size:20px; font-weight: 600; color:#222}
#tabWrap ul  li.active { background:#222; }
#tabWrap ul  li.active a { color:#fff;  font-weight: 600}
.tabCont > .t1 {font-size:20px; color:#777}
@media all and (max-width:1280px){	
	#tabWrap ul.w4 li {width:calc(23% - 4px)}
}
@media all and (max-width:840px){	
	#tabWrap ul  li a { padding: 1.0em 0;  font-size:18px; }
	#tabWrap ul.w4 li {width:calc(50% - 4px)}
	#tabWrap ul.w3 li {width:calc(33.333% - 4px)}
	#tabWrap ul.w2 li {width:calc(33.333% - 4px)}
}
@media all and (max-width:480px){
	#tabWrap ul.w2 li {width:calc(50% - 4px)}
}
@media all and (max-width:380px){
	#tabWrap ul  li a { padding: 0.8em 0;  font-size:16px; }
}


#inTabWrap ul.inTabBtn {margin-bottom:50px; display: flex;  justify-content:center;  flex-wrap:wrap;text-align: center; }
#inTabWrap ul.inTabBtn li { width:150px; line-height:150px; border-radius:100%;  background:rgba(0, 181, 234, 0.05); margin:5px;}
#inTabWrap ul.inTabBtn li a { display: block; font-size:20px; font-weight: 600; color:#00b5ea}
#inTabWrap ul.inTabBtn li.active { background:#00b5ea;  }
#inTabWrap ul.inTabBtn li.active a { color:#fff;  font-weight: 600}

@media all and (max-width:840px){
	#inTabWrap ul.inTabBtn li { width:120px; line-height:120px; }
	#inTabWrap ul.inTabBtn li a { font-size:18px;}
}
@media all and (max-width:580px){
	#inTabWrap ul.inTabBtn {width:80%; margin:0 auto 50px}	
	#inTabWrap ul.inTabBtn li {width:49%; line-height:100%; padding:2.5em 0; margin:0.5%; border-radius:60px;}
	#inTabWrap ul.inTabBtn li a { font-size:16px;}
}






.esg4 #sTitle {padding-bottom:100px; }
@media all and (max-width:1080px) {
	.esg4 #sTitle {padding-bottom:80px; }
	.esg4 #sTitle h3 br {display:none}
}
@media all and (max-width:480px) {
	.esg4 #sTitle {padding-bottom:70px; }
	.esg4 #sTitle h3 br.br480 {display:block}
}



#esg4-1 {width:100%; max-width:1024px; margin:0 auto }
#esg4-1 ul {width:100%; display:flex;justify-content:center; }
#esg4-1 ul li {width:33.333%; height:100%; text-align:center; }
#esg4-1 ul.tit { height:355px;  background:url('/images/sub/esg4-1-bg1.png') no-repeat center center;}
#esg4-1 ul.tit li {display:flex;justify-content:center;align-items: center;  color:#FFF}
#esg4-1 ul.tit li h3 {font-size:50px; font-family:'Montserrat'; font-weight:900}
#esg4-1 ul.tit li dl dt {padding:10px 0 0; font-size:26px; font-family:'Montserrat'; text-transform:uppercase; font-weight:700}
#esg4-1 ul.tit li dl dd {font-size:17px;}
#esg4-1 ul.cont li {padding-top:30px; font-size:20px; line-height:1.8em; color:#777; font-weight:500 }

@media all and (max-width:1090px) {	
	#esg4-1 ul.tit {background-size:100% auto; height:33vw; }
}
@media all and (max-width:830px) {	
	#esg4-1 ul.tit li h3 {font-size:40px}
	#esg4-1 ul.tit li dl dt { font-size:24px;}
	#esg4-1 ul.tit li dl dd {font-size:15px;}
	#esg4-1 ul.cont li {font-size:18px; line-height:1.6em; }
}
@media all and (max-width:640px) {	
	#esg4-1 {display:none}
}


#esg4-1-2 {display:flex; flex-wrap:wrap; justify-content:space-between; }
#esg4-1-2 li {width:31%; background:#f9f9f9}
#esg4-1-2 li img {width:100%}
#esg4-1-2 dl {padding:20px}
#esg4-1-2 h3 {font-size:32px; font-weight:800; }
#esg4-1-2 dl dt {padding:30px 0 20px; font-size:22px; font-weight:600; color:#00b5ea;  }
#esg4-1-2 dl dd {font-size:17px; color:#777; line-height:1.8em}

@media all and (max-width:1280px) {	
	#esg4-1-2 li {width:100%; display:flex; align-items: center; }
	#esg4-1-2 li:nth-child(2) {margin:20px 0}
	#esg4-1-2 li img {width:40%}
	#esg4-1-2 dl {padding:0 30px}
	#esg4-1-2 dl dt {padding:20px 0 10px; }
	#esg4-1-2 dl dd {font-size:17px; color:#777; line-height:1.6em}
}
@media all and (max-width:1024px) {	
	#esg4-1-2 li {padding:20px}
	#esg4-1-2 li:nth-child(2) {margin:10px 0}
	#esg4-1-2 li img {width:35%}
}
@media all and (max-width:768px) {	
	#esg4-1-2 li {width:100%; display:block; }
	#esg4-1-2 li img {width:100%}
	#esg4-1-2 dl {padding:30px 0 0 0}
}
@media all and (max-width:640px) {	
	#esg4-1-2 {padding-top:0}
}
@media all and (max-width:480px) {	
	#esg4-1-2 h3 {font-size:26px; }
	#esg4-1-2 dl dt {font-size:20px;  }
	#esg4-1-2 dl dd {font-size:16px}
}






#esg4-2 {padding:50px 0; background:url('/images/sub/esg4-2-bg.png') no-repeat center center; background-size:auto 100% }
#esg4-2 h3 {width:90%; max-width:600px; padding:20px 30px; font-size:32px; margin:0 auto; text-align:center;
					border-radius:50px; box-shadow:0 3px 15px rgba(85,85,85,0.1); font-weight:500; color:#00b5ea}
#esg4-2 h3.bg {background:#00b5ea; color:#FFF; } 
#esg4-2 ul {padding:0 23px; width:100%; max-width:950px; margin:50px auto; display:flex;justify-content:center; height:350px;  
				background:url('/images/sub/esg4-2-1-bg1.png') no-repeat center center; background-size:100% auto }
#esg4-2 ul li {width:33.333%; height:100%; text-align:center; display:flex; justify-content:center; align-items: center;}
#esg4-2 ul li dt {font-size:32px; font-weight:700; color:#222}
#esg4-2 ul li dd {padding-top:10px; font-size:17px; color:#777; opacity:.7}

@media all and (max-width:999px) {	
	#esg4-2 ul { height:35vw; padding:0 2.4vw}
}
@media all and (max-width:768px) {	
	#esg4-2 h3 { font-size:30px; }
	#esg4-2 ul li dt {font-size:26px;  }
}
@media all and (max-width:480px) {	
	#esg4-2 h3 { font-size:26px; }
	#esg4-2 ul {margin:30px auto;}
	#esg4-2 ul li dt {font-size:24px;  }
	#esg4-2 ul li dd {padding-top:5px; font-size:16px}
}



#esg4-2-2  {max-width:1280px; margin:50px auto 0; display:flex; flex-wrap:wrap;justify-content:space-between; }
#esg4-2-2 li {width:200px; text-align:center}
#esg4-2-2 li .icon {border-radius:100%; background:#FFF; box-shadow: 0 0 20px rgba(85,85,85,0.1);
									width:150px; height:150px; margin:0 auto;
								display: flex; justify-content: center; align-items: center;}
#esg4-2-2 li .icon img {width:60px;}
#esg4-2-2 li dl dt {padding:30px 0 20px; font-size:26px; font-weight:700}
#esg4-2-2 li dl dd {font-size:17px; color:#777; line-height:1.6em}

@media all and (max-width:1080px) {	
	#esg4-2-2 li {width:180px;}
}
@media all and (max-width:976px) {	
	#esg4-2-2  {max-width:660px; justify-content:center; margin:0 auto; gap:20px 0}
	#esg4-2-2 li {margin:0 20px}
}
@media all and (max-width:480px) {	
	#esg4-2-2 li {margin:0; width:50%; padding:0 3%}
	#esg4-2-2 li .icon {width:100px; height:100px}
	#esg4-2-2 li .icon img {width:40px;}
	#esg4-2-2 li dl dt {font-size:24px; padding:20px 0 10px;  }
	#esg4-2-2 li dl dd  { line-height:1.4em;  font-size:16px}
}






#esg3-1-1 {display:flex; flex-wrap:wrap;justify-content:space-between; gap:20px 0}
#esg3-1-1 .in-box {padding:40px; width:49.5%; background:#f9f9f9}
#esg3-1-1 .in-box h3 {padding-bottom:20px; font-size:24px;  font-weight:600}
#esg3-1-1 .in-box .icon {border-radius:100px; width:100px; height:100px; background:#FFF; margin-left: auto;
							 display:flex; justify-content:center; align-items: center; }
#esg3-1-1 .in-box .icon img {width:50%}
#esg3-1-1 .in-box .icon .num {font-size:36px; color:#00b5ea; font-family:'Roboto'; font-weight:700}
#esg3-1-1 .in-box .t1 {font-size:17px; line-height:1.6em; color:#777}

#esg3-1-1.w3 .in-box {width:32.5%}
@media all and (max-width:1024px) {	
	#esg3-1-1 .in-box {padding:30px;}
	#esg3-1-1.w3 .in-box {width:49%}
}
@media all and (max-width:768px) {	
	#esg3-1-1 {gap:10px 0}
	#esg3-1-1 .in-box {width:100%}
	#esg3-1-1 .in-box .icon {width:80px; height:80px;}
	#esg3-1-1 .in-box .icon .num {font-size:30px;}
		#esg3-1-1.w3 .in-box {width:100%}
}
@media all and (max-width:480px) {	
	#esg3-1-1 .in-box {padding:20px;}
	#esg3-1-1 .in-box .icon {width:60px; height:60px; margin-bottom:10px}
	#esg3-1-1 .in-box h3 {padding-bottom:15px; font-size:20px;}
	#esg3-1-1 .in-box .icon .num {font-size:26px;}
}



#dotList li {position:relative}
#dotList li:before {content:''; width:3px; height:3px; background:#00b5ea; border-radius:100%;
						position:absolute; left:0; top:1.2em}
#dotList li p {padding-left:10px; font-size:17px; color:#777; line-height:1.5em;}
#dotList li + li {margin-top:10px}

@media all and (max-width:480px) {	
	#dotList li p {font-size:15px;  line-height:1.4em;}
}




#p-Info {padding-bottom:80px;}
#p-Info > h3 {margin-bottom:20px; display:inline-block; font-size:35px; font-weight:800; position:relative }
#p-Info > h3:before {content:''; width:110%; height:15px; border-radius:10px; background:rgba(0,181,234,0.1);
						position:absolute; left:0; bottom:0}
#p-Info > .t1 {padding-top:10px; font-size:17px; color:#777; line-height:1.8em;}
#p-Info > .t2 {padding-top:10px; font-size:18px; color:#777; line-height:1.8em;}
#p-Info > h4 {margin:2em 0 0.7em;  font-size:22px; font-weight:700}
#p-Info > .in-box {border:7px solid #f9f9f9; padding:30px;}
#p-Info > .st1 {font-size:1.6rem; color:#0068b7; padding-bottom:1em; font-weight:600 }
#p-Info #esg3-board {margin-top:50px}
@media all and (max-width:768px) {	
	#p-Info > h3 { font-size:30px;}
	#p-Info > h4 { font-size:20px;}
	#p-Info > .in-box {border:5px solid #f9f9f9; padding:20px;}
}
@media all and (max-width:480px) {	
	#p-Info {padding-bottom:50px;}
	#p-Info > h3 { font-size:28px; margin-bottom:10px; }
	#p-Info > .t1 { font-size:16px; line-height:1.6em;}
	#p-Info > h4 {margin:1.3em 0 0.7em; }
	#p-Info > .in-box { padding:10px;}
}



#esg3-1-2 { display:flex; flex-wrap:wrap; justify-content:space-between;} 
#esg3-1-2 li {padding-bottom:25px; width:310px; text-align:center; border:1px solid #e9e9e9;}
#esg3-1-2 li img {width:100%}
#esg3-1-2 li h4 {padding:30px 0 20px; font-size:26px; font-weight:700}
#esg3-1-2 li .t1 {font-size:17px; color:#777; line-height:1.8em}
@media all and (max-width:1599px){
	#esg3-1-2 li {width:19%;}
}
@media all and (max-width:1024px){
	#esg3-1-2 li h4 {padding:20px 0 10px; font-size:22px; }
	#esg3-1-2 li .t1 {line-height:1.6em}
}
@media all and (max-width:976px){
	#esg3-1-2 {justify-content:center;}
	#esg3-1-2 li {width:31%; margin:1%}
}
@media all and (max-width:530px){
	#esg3-1-2 li {width:48%; padding-bottom:20px; }
	#esg3-1-2 li .t1 {padding:0 0.5em}
}
@media all and (max-width:480px){
	#esg3-1-2 {margin-top:50px}
	#esg3-1-2 li h4 {padding:20px 0 10px; font-size:20px; }
	#esg3-1-2 li .icon {width:90px; height:90px;}
	#esg3-1-2 li .icon img {width:50px}
	#esg3-1-2 li .t1 {font-size:16px; }
}




#accWrap {border-top:2px solid #222}
#accWrap .accBtn {width:100%; padding: 30px;  font-size: 20px; text-align:left; font-family:'SUIT'; font-weight:500;
			border: none; cursor: pointer; border-bottom:1px solid #e9e9e9; transition: background-color 0.3s;
			display:flex; justify-content:space-between; align-items: center; color:#222}
#accWrap .accBtn:hover { background: #00b5ea; color:#FFF}
#accWrap .accBtn.active { background: #00b5ea; color:#FFF; }
#accWrap .accBtn.active i {transform: rotate(180deg);}
#accWrap .accCont { display: none; padding:30px; cursor: pointer;  border-bottom:1px solid #e9e9e9}
#accWrap .accCont dl {padding-bottom:30px;}
#accWrap .accCont dl dt {font-size:20px; padding-bottom:10px; font-weight:700}
#accWrap .accCont dl dd {font-size:17px; color:#777; line-height:1.6em }
#accWrap .accCont dl dd + dd {margin-top:5px}

#accWrap .accCont dl > li { 	position: relative;	padding-left: 2.5rem; font-size:17px; color:#777;  counter-increment: num2;
									line-height:1.6em}
#accWrap .accCont dl > li::before{	position: absolute;	top:0;	left:0;	content: "("counter(num2)")";}
#accWrap .accCont dl > li + li {margin-top:10px}

@media all and (max-width:768px){
	#accWrap .accBtn {padding: 20px; } 
	#accWrap .accCont { padding:20px; }
	#accWrap .accCont dl {padding-bottom:20px;}
}
@media all and (max-width:480px){
	#accWrap .accBtn {font-size: 18px; padding:20px 10px}
	#accWrap .accCont { padding:20px 10px; }
	#accWrap .accCont dl dt {font-size:17px; } 
	#accWrap .accCont dl dd {font-size:15px;  line-height:1.4em }
}





#esg3-1-3 { display:flex; flex-wrap:wrap; justify-content:space-between;} 
#esg3-1-3 li {padding:4% 0; width:19.5%; background-size:cover; background-position:center center; background-repeat:no-repeat;
				color:#FFF; text-align:center}
#esg3-1-3 li i {width:100%; font-size:50px;}
#esg3-1-3 li h3 {font-size:24px; font-weight:800; line-height:1.8em}
#esg3-1-3 li.bg1 {background-image:url('/images/sub/esg3-1-3-bg1.png')}
#esg3-1-3 li.bg2 {background-image:url('/images/sub/esg3-1-3-bg2.png')}
#esg3-1-3 li.bg3 {background-image:url('/images/sub/esg3-1-3-bg3.png')}
#esg3-1-3 li.bg4 {background-image:url('/images/sub/esg3-1-3-bg4.png')}
#esg3-1-3 li.bg5 {background-image:url('/images/sub/esg3-1-3-bg5.png')}

@media all and (max-width:1024px){
	#esg3-1-3 li i {font-size:40px;}
	#esg3-1-3 li h3 {font-size:22px;}
}
@media all and (max-width:768px){
	#esg3-1-3 li i {font-size:30px;}
	#esg3-1-3 li h3 {font-size:20px;}
}
@media all and (max-width:680px){
	#esg3-1-3 { justify-content:center;} 
	#esg3-1-3 li {width:32.333%; margin:0.5%}
}
@media all and (max-width:480px){
	#esg3-1-3 li h3 {font-size:18px;}
}





#Num3List > li { margin-top:5px; position: relative; padding-left: 2.0rem; font-size:16px; color:#777;  counter-increment: num3; 
					line-height:1.6em}
#Num3List > li:before {position: absolute;	top:0;	left:0;    content: counter(num3) ")";}



#checkList {padding-top:10px}
#checkList li {border-radius:50px; padding:2em 1.5em; background:#f9f9f9; position:relative} 
#checkList li:before {content:''; width:22px; height:22px; background:url('/images/sub/checklist-icon.png') no-repeat left center;
						background-size:cover; position:absolute; left:1.5em; top:2em; }
#checkList li p {font-size:17px; padding-left:2em; color:#777}

#checkList.w5 {display:flex; flex-wrap:wrap; gap:10px}
#checkList.w5 li {width:calc(20% - 10px);}
#checkList.w4 {display:flex; flex-wrap:wrap; gap:10px}
#checkList.w4 li {width:calc(25% - 10px);}
#checkList.w3 {display:flex; flex-wrap:wrap; gap:10px}
#checkList.w3 li {width:calc(33.3333% - 10px);}
#checkList.w2 {display:flex; flex-wrap:wrap; gap:10px}
#checkList.w2 li {width:calc(50% - 10px);}
@media all and (max-width:1439px) {	
	#checkList.w5 li {width:calc(25% - 10px);}
}
@media all and (max-width:1280px) {	
	#checkList.w4 li {width:calc(50% - 10px);}
}
@media all and (max-width:1024px) {	
	#checkList.w5 li {width:calc(33.3333% - 10px);}
	#checkList.w2 {gap:5px 0}
	#checkList.w2 li {width:100%}
}
@media all and (max-width:976px) {	
	#checkList.w5 li {width:calc(50% - 10px);}
	#checkList.w3 li {width:calc(50% - 10px);}
}
@media all and (max-width:680px) {	
	#checkList.w4 {gap:5px 0}
	#checkList.w4 li {width:100%; }
	#checkList.w3 {gap:5px 0}
	#checkList.w3 li {width:100%; }
}
@media all and (max-width:580px) {	
	#checkList.w5 {gap:5px 0}
	#checkList.w5 li {width:100%; }
}


#esg3-3-3  {max-width:1280px; margin:50px auto 0; display:flex; flex-wrap:wrap;justify-content:center; }
#esg3-3-3 li {padding:0 50px;; text-align:center; position:relative}
#esg3-3-3 li:before {content:''; width:18px; height:26px; background:url('/images/sub/esg3-3-3-arrow.png') no-repeat left center;
						background-size:100% auto; 	position:absolute; left:-9px; top:30%}
#esg3-3-3 li:first-child::before {display:none}
#esg3-3-3 li .icon {border-radius:100%; background:#FFF; box-shadow: 0 0 20px rgba(85,85,85,0.1);
									width:150px; height:150px; margin:0 auto;
								display: flex; justify-content: center; align-items: center;}
#esg3-3-3 li .icon img {width:60%; max-width:85px;}
#esg3-3-3 li dl dt {padding-top:20px; font-size:22px; font-weight:700}
#esg3-3-3 li dl dd {font-size:17px; line-height:1.8em; color:#777}
@media all and (max-width:1280px) {	
	#esg3-3-3 li {padding:0 30px;}
}
@media all and (max-width:976px) {	
	#esg3-3-3 li .icon {width:100px; height:100px}
	#esg3-3-3 li dl dt {padding-top:10px; font-size:20px;}
	#esg3-3-3 li:before {width:10px; left:-5px}
}
@media all and (max-width:690px) {	
	#esg3-3-3 {gap:20px 0}
	#esg3-3-3 li {padding:0 20px;}
	#esg3-3-3 li .icon {width:80px; height:80px}
	#esg3-3-3 li dl dt {padding-top:10px; font-size:18px;}
	#esg3-3-3 li dl dd {font-size:16px; line-height:1.4em; }
}





#esg4-1-1 { padding-top:10px; display:flex; flex-wrap:wrap; justify-content:space-between;} 
#esg4-1-1 li {padding-bottom:25px; width:32%; text-align:center; border:10px solid #f9f9f9;}
#esg4-1-1 li img {width:100%}
#esg4-1-1 li h4 {padding:30px 0 15px; font-size:26px; font-weight:800}
#esg4-1-1 li .t1 {font-size:17px; color:#777; line-height:1.8em}

@media all and (max-width:1024px){
	#esg4-1-1 li h4 {padding:20px 0 10px; font-size:22px; }
	#esg4-1-1 li .t1 {line-height:1.6em}
}
@media all and (max-width:976px){
	#esg4-1-1 {justify-content:center;}
	#esg4-1-1 li {width:31%; margin:1%;  border:5px solid #f9f9f9;}
	#esg4-1-1 li .t1 {line-height:1.6em}
}
@media all and (max-width:580px){
	#esg4-1-1 li {width:48%; padding-bottom:20px; }
}
@media all and (max-width:480px){
	#esg4-1-1 {padding-top:30px}
	#esg4-1-1 li h4 {padding:20px 0 10px; font-size:20px; }
	#esg4-1-1 li .t1 {font-size:16px; }
}





#halfWrap-esg5 {  padding-bottom: 80px; display:flex; flex-wrap:wrap;}
#halfWrap-esg5 #titWrap {width:25%; border-bottom:1px dashed #e9e9e9; padding-top:50px }
#halfWrap-esg5 #titWrap > .t1 {font-size:15px; font-weight:700; color:#777; opacity:.5}
#halfWrap-esg5 #titWrap > h3 {padding:0.3em 0 1em; font-size:26px; font-weight:700}
#halfWrap-esg5 #contWrap {width:75%;  padding:50px 0; border-bottom:1px dashed #e9e9e9 }
#halfWrap-esg5 #contWrap > h4 {font-size:20px; font-weight:700; color:#222} 

#halfWrap-esg5.ver2 {padding-top:50px}
#halfWrap-esg5.ver2 #titWrap {border-bottom:0; border-top:1px dashed #e9e9e9;}
#halfWrap-esg5.ver2 #titWrap > h3 {padding-top:0}
#halfWrap-esg5.ver2 #contWrap {border-bottom:0; border-top:1px dashed #e9e9e9;}
@media all and (max-width:1280px){
	#halfWrap-esg5 #titWrap {width:30%; padding-right:5%}
	#halfWrap-esg5 #contWrap {width:70%;}
}
@media all and (max-width:976px){
	#halfWrap-esg5 #titWrap {width:100%; padding-right:0; border-bottom:0;  }
	#halfWrap-esg5 #titWrap > h3 {padding:0.3em 0 0.7em}
	#halfWrap-esg5 #contWrap {width:100%;  padding:0 0 50px;  }

	#halfWrap-esg5.ver2 #contWrap {border-top:0}
}
@media all and (max-width:480px){
	#halfWrap-esg5 #titWrap {padding-top:30px }
	#halfWrap-esg5 #titWrap > .t1 {font-size:14px; }
	#halfWrap-esg5 #titWrap > h3 {padding:0.3em 0 1em; font-size:24px}
	#halfWrap-esg5 #contWrap {width:100%;  padding:0 0 30px;  }
}





#numList {display:flex; flex-wrap:wrap; flex-wrap:wrap; justify-content:space-between;}
#numList > li {padding:30px;  background:#f9f9f9; counter-increment: number;
					display:flex;  align-items: start; flex-wrap:wrap;  align-content: start;}
#numList > li dl dt {font-size:22px; color:#222; font-weight:700; padding-left:40px; position:relative}
#numList > li dl dt:before { content: counter(number, decimal-leading-zero);    font-family: 'Montserrat'; font-size: 1.4rem; 
								font-weight: 500; width: 30px; line-height: 30px;  color: #FFF;  text-align: center; background: #00b5ea ; 
								border-radius: 100%; position:absolute; left:0; top:50%; transform:translateY(-50%) }
#numList > li dl dd {padding-top:1em; font-size:17px; line-height:1.6em; color:#777}
#numList.w2 > li {width:49.5%; margin:0.5% 0} 
#numList.w3 > li {width:32.333%; margin:1% 0} 
@media all and (max-width:1280px) {
	#numList > li {padding:4% 3%; }
}
@media all and (max-width:976px) {
	#numList.w3 > li {width:100%;} 
}
@media all and (max-width:768px) {
	#numList.w2 > li {padding:5%; width:100%; margin:5px 0}
}
@media all and (max-width:680px) {
	#numList > li {padding:5%; width:100%; margin:5px 0}
	#numList > li dl dd { line-height:1.4em}
}
@media all and (max-width:480px) {
	#numList > li dl dt {font-size:20px; padding-left:9vw;}
	#numList > li dl dt:before { width: 7vw; line-height: 7vw; }
}





#esg5-1-2 ul {display:flex; flex-wrap:wrap; align-items: center; border:10px solid #f9f9f9; padding:30px;}
#esg5-1-2 ul + ul {margin-top:30px}
#esg5-1-2 ul .img {width:30%; }
#esg5-1-2 ul .img img {width:100%}
#esg5-1-2 ul .cont {width:70%; padding:0 3%}
#esg5-1-2 ul .cont .st1 {font-size:16px; font-weight:700; color:#00b5ea}
#esg5-1-2 ul .cont h3 {padding:0.5em 0 1em; font-size:28px; font-weight:700; color:#222}
#esg5-1-2 ul .cont .t1 {font-size:17px; color:#777; line-height:1.6em}

#esg5-1-2 ul:nth-child(even) .img {order:2; text-align:right}
#esg5-1-2 ul:nth-child(even) .cont {order:1}

@media all and (max-width:1024px) {
	#esg5-1-2 ul {border:7px solid #f9f9f9; padding:20px;}
	#esg5-1-2 ul + ul {margin-top:30px}
}
@media all and (max-width:976px) {
	#esg5-1-2 ul .img {width:100%; margin-bottom:20px}
	#esg5-1-2 ul .img img {width:100%}
	#esg5-1-2 ul .cont {width:100%}

	#esg5-1-2 ul:nth-child(even) .img {order:1; text-align:center}
	#esg5-1-2 ul:nth-child(even) .cont {order:2}
}
@media all and (max-width:480px) {
	#esg5-1-2 ul {border:5px solid #f9f9f9; padding:10px;}
	#esg5-1-2 ul .img {width:100%; }
	#esg5-1-2 ul .cont .st1 {font-size:14px;}
	#esg5-1-2 ul .cont h3 {padding:0.5em 0 1em; font-size:24px;}
}




.esg5-1-3 {display:flex; flex-wrap:wrap; justify-content:space-between}
.esg5-1-3 .in-box {width:49.5%; border:10px solid #f9f9f9; padding:30px; text-align:center}
.esg5-1-3 .in-box .num {font-size:30px; color:#00b5ea; font-weight:800}
.esg5-1-3 .in-box h4 {padding:0.3em 0 1em; font-size:24px; font-weight:700; color:#222}
.esg5-1-3 .in-box ul li p {font-size:17px; color:#777; line-height:1.8em}

@media all and (max-width:730px) {
	.esg5-1-3 .in-box {width:100%; margin:0.5% 0; border:5px solid #f9f9f9; padding:20px; }
}
@media all and (max-width:480px) {
	.esg5-1-3 .in-box .num {font-size:26px;}
	.esg5-1-3 .in-box h4 {font-size:20px; }
}




#esg7-3-2  {max-width:1280px; margin:50px auto 0; display:flex; flex-wrap:wrap;justify-content:space-between;  }
#esg7-3-2 li { text-align:center;}
#esg7-3-2 li .icon {border-radius:100%; background:#FFF; box-shadow: 0 0 20px rgba(85,85,85,0.1);
									width:150px; height:150px; margin:0 auto;
								display: flex; justify-content: center; align-items: center;}
#esg7-3-2 li .icon img {width:60%; max-width:85px;}
#esg7-3-2 li dl dt {padding-top:20px; font-size:20px; font-weight:700}
@media all and (max-width:1280px) {	
	#esg7-3-2  {justify-content:center;  }
	#esg7-3-2 li {padding:0 10px;}
}
@media all and (max-width:976px) {	
	#esg7-3-2 {max-width:400px;}
	#esg7-3-2 li {margin:10px 15px; padding:0}
	#esg7-3-2 li .icon {width:100px; height:100px}
	#esg7-3-2 li dl dt {padding-top:10px; font-size:20px;}
}
@media all and (max-width:690px) {	
	#esg7-3-2 li dl dt { font-size:18px;}
}





.esg9 ul {display:flex; flex-wrap:wrap; align-items: center;}
.esg9 ul .img {width:40%; background:#DDD}
.esg9 ul .img img {width:100%}
.esg9 ul .cont {width:60%; padding:0 5%}
.esg9 ul .cont dl dt {font-size:28px; font-weight:800;}
.esg9 ul .cont dl dd {margin-top:1em; font-size:17px; line-height:1.8em; color:#777}

.esg9 ul:nth-child(even) {margin:5% 0}
.esg9 ul:nth-child(even) .img {order:2;}
.esg9 ul:nth-child(even) .cont {order:1}

@media all and (max-width:910px) {	
	.esg9 ul .img {width:100%;}
	.esg9 ul .cont {width:100%; padding:0; padding-top:5%}
	.esg9 ul:nth-child(even) {margin:8% 0}
	.esg9 ul:nth-child(even) .img {order:1}
	.esg9 ul:nth-child(even) .cont {order:2}
}




#product-Top {margin-bottom:5%; height:680px; background:url('/images/sub/product1-bg.png') no-repeat center center; 
				  position:relative; background-size:100% auto}
#product-Top #pro-icon {position:absolute; border:7px solid #DDD; border-radius:100%; z-index:3}
#product-Top #pro-icon:before {display:none; content:''; width:50px; height:1px; background:#00b5ea; position:absolute;z-index:1; 
									left:-50px; top:50%}
#product-Top #pro-icon:hover {border-color:#00b5ea}
#product-Top #pro-icon.on {border-color:#00b5ea}
#product-Top #pro-icon.on:before {display:block;}
#product-Top #pro-icon img {width:100%}
#product-Top #pro-icon.icon1 {left:47%; bottom:18%}
#product-Top #pro-icon.icon1:before {left:unset; right:-50px}
#product-Top #pro-icon.icon2 {left:35%; bottom:42%}
#product-Top #pro-icon.icon3 {left:28%; bottom:18%}
#product-Top #pro-icon.icon4 {right:12%; top:36%}

#product-Top #pro-img {width:300px;border:1px solid #00b5ea; position:absolute; z-index:5 }
#product-Top #pro-img img {width:100%;}
#product-Top #pro-img dl {background:#00b5ea; padding:20px 0; color:#FFF; text-align:center}
#product-Top #pro-img dl dt {font-size:25px; font-weight:700;}
#product-Top #pro-img dl dd {font-size:12px; font-weight:600; font-family:"Montserrat"; opacity:.5}
#product-Top #pro-img.proimg1 { left:56%; bottom:15%}
#product-Top #pro-img.proimg2 { left:14%; top:23% }
#product-Top #pro-img.proimg3 { left:7%; bottom:15% }
#product-Top #pro-img.proimg4 { right:21%; top:19% }

@media all and (max-width:1599px) {	
	#product-Top #pro-icon {width:7.5vw}
	#product-Top {height:40vw;}
	#product-Top #pro-img {width:20vw;}

	#product-Top #pro-img.proimg2 { left:12%; top:17% }
	#product-Top #pro-img.proimg3 { left:6%; bottom:15% }
}
@media all and (max-width:1280px) {	
	#product-Top #pro-img.proimg1 { left:57%; bottom:15%}
	#product-Top #pro-img.proimg2 { left:12%; top:12% }
	#product-Top #pro-img.proimg3 { left:5%; bottom:15% }
	#product-Top #pro-img.proimg4 { right:22%; top:19% }
}
@media all and (max-width:1024px) {	
	#product-Top #pro-icon { border:5px solid #DDD; }
	#product-Top #pro-img dl { padding:10px 0;}
	#product-Top #pro-img dl dt {font-size:20px; }
}




#product-imgWrap {display:flex; flex-wrap:wrap;gap:20px}
#product-imgWrap li {width:calc((100% - 20px*3)/4); padding-bottom:50px;}
#product-imgWrap li img {width:100%; margin-bottom: 30px; background: #8f8f8f;}
#product-imgWrap li dl {display:flex; font-size:18px;}
#product-imgWrap li dl + dl {margin-top:10px}
#product-imgWrap li dl dt {width:90px; position:relative; padding-left:10px; font-weight:600}
#product-imgWrap li dl dt:before {content:''; width:3px; height:3px; background:#00b5ea; position:absolute; left:0; top:50%;
											transform:translateY(-50%)}
#product-imgWrap li dl dd {width:calc(100% - 90px); color:#777}
@media all and (max-width:1280px) {
	#product-imgWrap li {width:calc((100% - 20px*2)/3);  padding-bottom:30px;}
}
@media all and (max-width:976px) {
	#product-imgWrap li {width:calc((100% - 20px*1)/2); }
	#product-imgWrap li img {margin-bottom: 20px;}
	#product-imgWrap li dl + dl {margin-top:5px}
}
@media all and (max-width:480px) {
	#product-imgWrap li dl + dl {margin-top:5px}
	#product-imgWrap li {width:100%; padding-bottom:15px;}
}




#esgH3 {font-size:22px; }
#esgCont {margin:20px 0; padding:2%; border:10px solid #f9f9f9; }
#esgCont h4 {padding:15px 0 10px; font-size:18px; color:#333}
#esgCont p {padding-left:0.7em; font-size:16px; color:#777; line-height:1.6em}
.checkbox-container { display: flex;    align-items: center;  gap: 5px; margin-bottom:3%}
.checkboxEsg {width: 20px;   height: 20px;}
#agreeT1 { font-weight:500; font-size:17px; color:#333;}

@media all and (max-width:768px) {
	#esgCont { border:5px solid #f9f9f9 }
}





#processWrap {display:flex; flex-wrap:wrap; align-items: center;}
#processWrap  #imgWrap {padding:15px; width:45%; position:relative}
#processWrap  #imgWrap:after {content:''; width:70%; height:50%; background:#00b5ea; position:absolute; left:0; top:0; z-index:-1 }
#processWrap  #imgWrap:before {content:''; width:30%; height:60%; background:#0068b7; position:absolute; right:0; bottom:0; z-index:-1 }
#processWrap  #imgWrap img {width:100%}
#processWrap  #contWrap {width:55%; padding-left:8%}
#processWrap  #contWrap #p-Info {padding-bottom:0}
#processWrap  #contWrap #p-Info h3 {font-size:45px;}
#processWrap  #contWrap #p-Info h3 .st1 {font-size:23px; letter-spacing:-0.02em}
#processWrap  #contWrap .lt1 {padding:1.2em 0 1em; font-size:22px; line-height:1.6em; font-weight:500}

#processWrap  #imgWrap .s-vod {position: relative; width: 100%; height: 388px; overflow: hidden;}
#processWrap  #imgWrap .s-vod iframe { position: absolute; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; top: 50%; pointer-events: none;}

.processSlick {background:#FFF}
.processSlick li img {width:100%}

@media all and (max-width:1599px) {
	#processWrap  #imgWrap {width:690px}
	#processWrap  #imgWrap .s-vod { height:373px;}
	#processWrap  #contWrap {width:calc(100% - 690px); padding-left:5%}
}
@media all and (max-width:1280px) {
	#processWrap  #imgWrap {width:600px}
	#processWrap  #imgWrap .s-vod { height:373px;}
	#processWrap  #contWrap {width:calc(100% - 600px);}
}
@media all and (max-width:1024px) {
	#processWrap  #imgWrap { width:100%; max-width:1024px; margin:0 auto } 
	#processWrap  #imgWrap .s-vod { height:51.5vw;}
	#processWrap  #contWrap {width:100%; padding-left:0; padding-top:5%}
}
@media all and (max-width:768px) {	
	#processWrap  #imgWrap {padding:10px;}
	#processWrap  #contWrap #p-Info h3 { font-size:30px;}
	#processWrap  #contWrap #p-Info h3 .st1 {font-size:19px;}
}
@media all and (max-width:480px) {	
	#processWrap  #contWrap #p-Info h3 { font-size:28px; }
	#processWrap  #contWrap #p-Info h3 .st1 {font-size:17px;}
	#processWrap  #contWrap .lt1 {font-size:20px; line-height:1.4em; }
}