/********** 메인 비주얼 **********/

#mainvisual {
	position:relative;
	width:100%;
	height:790px;
	overflow:hidden;
	background:url('/images/mainbg.jpg') center no-repeat;
	background-size:cover !important;
	margin-top:100px;
}



#mtxt { padding-top:125px; }

#mtxt #m_copy p { font-size:90px; color:#b5bde1; font-family:Barlow; font-weight:700; font-style:italic; margin-top:10px; }
#mtxt #m_detail { font-size:22px; color:#fff; font-weight:500; line-height:170%; animation-name:mdetail; animation-duration: 3s; }

#m_img { padding-top:85px; text-align:center; }
#m_img img { animation-name:main_img; animation-duration: 1.2s; }

@keyframes main_img { from {opacity:0; margin-left:-40px; } to {opacity:1; margin-left:0;} }

#mtxt #m_copy p:nth-child(1) { animation-name:mcopy1; animation-duration: 1s; }
#mtxt #m_copy p:nth-child(2) { animation-name:mcopy2; animation-duration: 1.5s; }
#mtxt #m_copy p:nth-child(3) { animation-name:mcopy3; animation-duration: 2s; }

@keyframes mcopy1 { from {opacity:0; margin-left:30px; } to {opacity:1; margin-left:0;} }
@keyframes mcopy2 { from {opacity:0; margin-left:30px; } 33% {opacity:0;margin-left:30px;} to {opacity:1; margin-left:0;} }
@keyframes mcopy3 { from {opacity:0; margin-left:30px; } 50% {opacity:0;margin-left:30px;} to {opacity:1; margin-left:0;} }

@keyframes mdetail { from {opacity:0; } 50% {opacity:0;padding-top:20px;} to {opacity:1; padding-top:0;} }


@media (max-width:1500px) {
	#mainvisual { height:720px; }
	#mtxt { padding-top:120px; }
	#mtxt #m_copy p { font-size:78px; margin-top:7px; }
	#mtxt #m_detail { font-size:20px; }
	#m_img img { width:540px; }
}


@media (max-width:1200px) {
	#mainvisual { height:530px; }
	#mtxt { padding-top:80px; }
	#mtxt #m_copy p { font-size:60px; margin-top:5px; }
	#mtxt #m_detail { font-size:17px; }
	#m_img { padding-top:50px; }
	#m_img img { width:400px; }

}

@media (max-width:1100px) {
	#mainvisual { margin-top:60px; }
}

@media (max-width:900px) {
	#mainvisual { height:470px; }
	#mtxt { padding-top:70px; }
	#mtxt #m_copy p { font-size:50px; }
	#mtxt #m_detail { font-size:15px; }
	#m_img img { width:340px; }

}
@media (max-width:768px) {
	#mainvisual { height:400px; }
	#mtxt #m_copy p { font-size:45px; margin-top:4px; }
	#mtxt #m_detail { font-size:14px; }
	#m_img { padding-top:40px; }
	#m_img img { width:320px; }
}

@media (max-width:680px) {
	#mainvisual { height:590px; }
	#mainvisual ul li { width:100%; }
	#mtxt { padding-top:30px; }
	#m_img { padding-top:20px; }
}
@media (max-width:420px) {
	#mainvisual { height:540px; }
	#mtxt #m_copy p { font-size:36px; margin-top:3px; }
	#mtxt #m_detail { font-size:13px; }
	#m_img img { width:300px; }
}




/********** 주요사업 **********/

#major { background:#f3f9fe; }
#major_box { position:relative; margin-top:-120px; background:#fff; -webkit-box-shadow:0 2px 5px 2px rgba(0, 0, 0, 0.15); -moz-box-shadow:0 2px 5px 2px rgba(0, 0, 0, 0.15); box-shadow:0 2px 5px 2px rgba(0, 0, 0, 0.15); }
#major_box ul:after { clear:both; visibility:hidden; display:block; content:''; }
#major_box ul { padding:40px 0; }
#major_box ul li { float:left; width:20%; border-left:1px solid #ddd; }

#major_box ul li div { height:110px; background-position:center; background-repeat:no-repeat; }
#major_box ul li:nth-child(1) { border:0 !important; }
#major_box ul li:nth-child(1) div { background-image:url('/images/mark_kor.gif'); }
#major_box ul li:nth-child(2) div { background-image:url('/images/mark_kor.gif'); }
#major_box ul li:nth-child(3) div { background-image:url('/images/mark_epc.gif'); }
#major_box ul li:nth-child(4) div { background-image:url('/images/mark_jodal.gif'); }
#major_box ul li:nth-child(5) div { background-image:url('/images/mark_environ.gif'); }

.con_title { font-size:19px; font-weight:500; }
.con_detail { font-size:15px; }



@media (max-width:1200px) {
	#major_box { margin-top:-90px; }
	#major_box ul { padding:30px 0; }
	#major_box ul li div { height:80px; background-size:56px 56px; }
	.con_title { font-size:17px; }
	.con_detail { font-size:13px; }
}

@media (max-width:900px) {
	#major_box ul { padding:24px 0; }
	#major_box ul li { width:25%; }
	#major_box ul li:nth-child(5) { display:none; }
	#add_slide { display:block; }
}
@media (max-width:768px) {
	#major_box { margin-top:-60px; }
	#major_box ul li div { height:66px; background-size:47px 47px; }
	.con_title { font-size:15px; }
	.con_detail { font-size:12px; }
}

@media (max-width:680px) {
	#major_box { margin-top:-50px; }
	#major_box ul li { width:50%; }
	#major_box ul li:nth-child(1), #major_box ul li:nth-child(2) { padding-bottom:20px; }
	#major_box ul li:nth-child(3), #major_box ul li:nth-child(4) { border-top:1px solid #ddd; padding-top:10px; }
	#major_box ul li:nth-child(3) { border-left:0; }
}
@media (max-width:420px) {
	.con_title { font-size:14px; }
}






/********** 슬라이드 **********/

#etc_box { padding:60px 0 100px; }
#etc_box a { display:block; background:#fff; border:1px solid #ccc; margin:0 10px; padding:0 30px; }

#etc_box table { height:150px; }
#etc_box table tr td:last-child { padding-left:20px; }
#etc_box .con_detail { line-height:130%; }
#add_slide { display:none; }

@media (max-width:1200px) {
	#etc_box { padding:50px 0 70px; }
	#etc_box table { height:120px; }
	#etc_box img { width:56px; }
	#etc_box table tr td:last-child { padding-left:15px; }
}

@media (max-width:900px) {
	#etc_box a { margin:0 5px; padding:0 20px; }
}

@media (max-width:768px) {
	#etc_box { padding:40px 0 50px; }
	#etc_box img { width:47px; }
}
@media (max-width:420px) {
	#etc_box { padding:30px 0 40px; }
	#etc_box a { margin:0 4px; padding:0 18px; }
	#etc_box table { height:100px; }
}









/********** 배너 **********/

#main_banner .banimg { background-size:cover; background-position:center; background-repeat:no-repeat; }
#main_banner ul:first-child .banimg { background-image:url('/images/mban1.jpg'); }
#main_banner ul:last-child .banimg { background-image:url('/images/mban2.jpg'); }

#main_banner > ul > li { height:380px; }
#main_banner .bancont { background:#4862c1; }
#main_banner .bancont > div { width:570px; margin:70px 0 0 70px; }
#main_banner .bancont .ban_title { position:relative; font-size:32px; color:#fff; font-weight:500; }
#main_banner .bancont .ban_title a { display:block; position:absolute; right:0; top:0; }

#record_slide li:after { clear:both; visibility:hidden; display:block; content:''; }
#record_slide li { height:50px; overflow:hidden; }
#record_slide a { color:#fff; }
#record_slide span { display:block; float:left; width:70px; font-size:13px; padding:4px 0 6px; text-align:center; border-radius:50px; font-weight:400; }

#record_slide span.record_ing { background:#fff; color:#4862c1; }
#record_slide span.record_wan { color:#fff; border:1px solid #fff; }

#record_slide p { float:left; width:calc(100% - 70px); font-size:16.5px; color:#fff; line-height:50px; margin-top:-11px; padding-left:16px; }
#record_slide p:hover { text-decoration:underline; }



#main_banner > ul:last-child > li { float:right; }
#main_banner > ul:last-child .bancont > div { float:right; margin:70px 60px 0 0; }
#main_banner > ul:last-child .bancont { background:#00a1dd; }
#main_banner .bancont .ban_detail { font-size:16px; color:#fff; font-weight:400; line-height:140%;  }

.ban_tel li { font-weight:500; font-size:32px; padding:14px 0; color:#fff; padding-left:40px; }
.ban_tel li:first-child { background:url('/images/icon_mtel.png') left center no-repeat; }
.ban_tel li:last-child { background:url('/images/icon_phone.png') left center no-repeat; }




@media (max-width:1400px) {
	#main_banner .bancont > div { width:calc(100% - 100px); }
}

@media (max-width:1200px) {
	#main_banner > ul > li { height:286px; }
	#main_banner .bancont > div { width:calc(100% - 80px); margin:40px 0 0 40px; }
	#main_banner ul:last-child .bancont > div { margin:40px 40px 0 0; }
	#main_banner .bancont .ban_title { font-size:26px; }
	#record_slide li { height:42px; }
	#record_slide span { width:60px; font-size:11.5px; padding:3px 0 5px; }
	#record_slide p { width:calc(100% - 60px); font-size:15.5px; line-height:42px; margin-top:-8px; padding-left:12px; }

	#main_banner .bancont .ban_detail { font-size:15px; }
	.ban_tel li { font-size:27px; padding:12px 0; padding-left:36px; background-size:26px 26px !important; }
}

@media (max-width:1000px) {
	#main_banner .banimg { width:30%; }
	#main_banner .bancont { width:70%; }
}

@media (max-width:768px) {
	#main_banner > ul > li { height:260px; }
	#main_banner .bancont .ban_title { font-size:24px; }
	#main_banner .bancont .ban_title img { width:19px; }
	#record_slide li { height:38px; }
	#record_slide span { width:50px; font-size:11px; padding:2px 0 4px; }
	#record_slide p { width:calc(100% - 50px); font-size:14px; line-height:38px; margin-top:-9px; padding-left:10px; }
}

@media (max-width:680px) {
	#main_banner .banimg { width:100%; height:200px; }
	#main_banner .bancont { width:100%; height:auto; }
	#main_banner .bancont > div { width:100%; padding:30px 24px 14px 24px; margin:0 !important; }

	#main_banner .bancont .ban_title { font-size:20px; }
	#main_banner .bancont .ban_title img { width:17px; }
}
@media (max-width:420px) {
	#main_banner .banimg { width:100%; height:160px; }
	#record_slide li { height:36px; }
	#record_slide span { width:46px; font-size:10px; padding:2px 0 3px; }
	#record_slide p { width:calc(100% - 46px); font-size:12px; line-height:36px; margin-top:-7px; }

	#main_banner .bancont .ban_detail { font-size:13px; }
	.ban_tel li { font-size:23px; padding:8px 0; padding-left:30px; background-size:23px 23px !important; }

}







/********** 아이콘 4 배너 **********/

#mainban { padding:100px 0; background:#f0f0f0; }

#mainban #icon_ban { margin:0 -20px; }
#mainban .col_box { position:relative; background:#fff; padding:40px 0 60px; margin:0 20px; cursor:pointer; }

#mainban .col_box div { height:140px; }
#mainban #icon_ban li:nth-child(1) .col_box div { background:url('../images/micon1.png') center no-repeat; }
#mainban #icon_ban li:nth-child(2) .col_box div { background:url('../images/micon2.png') center no-repeat; }
#mainban #icon_ban li:nth-child(3) .col_box div { background:url('../images/micon3.png') center no-repeat; }
#mainban #icon_ban li:nth-child(4) .col_box div { background:url('../images/micon4.png') center no-repeat; }

#mainban .col_box p { text-align:center; }
#mainban .col_box .ban_tit { color:#333; font-size:24px; font-weight:500; }
#mainban .col_box .ban_detail { font-size:15px; line-height:140%; }

#mainban .col_box i { position:absolute; top:0; left:0; width:100%; height:100%; border:10px solid #3c55bc; opacity:0; }
#mainban .col_box:hover i { opacity:1; }

@media (max-width:1500px) {
	#mainban #icon_ban { margin:0 -10px; }
	#mainban .col_box { margin:0 10px; }
}

@media (max-width:1000px) {
	#mainban #icon_ban { margin:0 -20px; }
	#mainban .col_box { margin:0 20px; }
	#mainban #icon_ban li { width:50%; }
	#mainban #icon_ban li:nth-child(3), #mainban #icon_ban li:nth-child(4) { padding-top:40px; }
}
@media (max-width:768px) {
	#mainban .col_box i { display:none; }
	#mainban #icon_ban { margin:0 -10px; }
	#mainban .col_box { margin:0 10px; }
	#mainban #icon_ban { padding:0 70px; }
	#mainban .col_box div { height:100px; background-size:60px 60px !important; }
	#mainban #icon_ban li:nth-child(3), #mainban #icon_ban li:nth-child(4) { padding-top:20px; }
}
@media (max-width:700px) {
	#mainban #icon_ban { padding:0 30px; }
}
@media (max-width:560px) {
	#mainban #icon_ban { margin:0 -5px; }
	#mainban .col_box { margin:0 5px; }
	#mainban #icon_ban { padding:0; }
	#mainban #icon_ban li:nth-child(3), #mainban #icon_ban li:nth-child(4) { padding-top:10px; }
}
@media (max-width:420px) {
	#mainban .col_box .ban_detail { display:none; }
	#mainban .col_box div { height:80px; background-size:50px 50px !important; }
}