@charset "utf-8";
/* CSS Document */

.main_top{width:100%; margin:0 auto; text-align:center; display:block; background:url(/resource/images/eng/main/main_visual_01.jpg) no-repeat center top }

.inner{position:relative; width:1200px; margin:0 auto;}
.headcopy{position:relative; width:100%; height:345px; text-align:center; }
.headcopy li:nth-child(1){display:block; width:100%; height:100%; background:url(/resource/images/eng/main/headcopy.png?v=2025100101) center no-repeat; text-indent:-9999px  }
.headcopy li:nth-child(2){position: absolute;right:0; bottom: 30px; display:block; width:300px; height:200px; background:url(/resource/images/eng/main/commissioner_01.png) no-repeat right 30px}
.headcopy li:nth-child(2) a{display:block; width:100%; height:100%; background:url(/resource/images/eng/main/commissioner_02.png?v=2024072301) no-repeat 10px 37px; background-size:150px; box-sizing:border-box; padding:80px 45px 0 0; text-align:right; color:#000}


.main_search {position:relative; display:block; width:100%; height:65px; background:#566472; color:#fff; margin-bottom:10px; padding:15px 230px 0 310px; box-sizing:border-box}

.main_search li{display:block; float:left; height:100%; padding-left:10px; box-sizing:border-box}
.main_search li.tit {position:absolute; top:0; left:0; display:block; width:310px; color:#fff; font-size:15px; line-height:65px; font-weight:400; }

.main_search li.srch {width:80%}
.main_search .pt1 {width:49%;float:left;margin-right:1%}

.MSC_select3 {float:left;width:100%;height:34px;margin:0px;padding:0px;position:relative}
.MSC_select3 div {float:left;width:100%;height:34px;line-height:32px;background: url("/resource/images/eng/common/btn_select1.gif") 100% 0px no-repeat #fff;cursor:pointer;font-size:14px;border:1px solid #ddd;box-sizing:border-box;padding:0 10px;vertical-align:middle;}
.MSC_select3 div p {text-align:left}
.MSC_select3 div.st { background: url("/resource/images/eng/common/btn_select1.gif") 100% -18px no-repeat #fff}
.MSC_select3 ul {border:1px solid #ddd;top:33px;left: 0px; right: 0; position: absolute; z-index: 30;}
.MSC_select3 ul li {display:block;width:100%;height:35px;background:#fff;padding:0;float:inherit;text-align:left}
.MSC_select3 ul li a {display:block;text-decoration: none; width: 100%; font-size: 14px; padding:0 10px;line-height:35px}
.MSC_select3 ul li._st a { background-color:#718599;color: rgb(255, 255, 255); }
.MSC_select3 ul li a:hover { background-color:#718599;color: rgb(255, 255, 255); text-decoration: none; }

.main_search .pt2 {width:50%;float:left;position:relative}
.main_search .pt2 a.btn{position:absolute; display:block; top:0; right:-130px; width:115px; height:34px; line-height:34px; background:url(/resource/images/eng/main/search_icon_02.png) no-repeat left center;padding:0 10px 0 30px; color:#fff; text-align:left; box-sizing:border-box}
/* 25.05.20 버튼 스타일 추가 */
.main_search .pt2 button.btn{position:absolute;display:block;top:0;right:-130px;width:115px;height:34px;line-height:34px;background:url(/resource/images/eng/main/search_icon_02.png) no-repeat left center;padding:0 10px 0 30px;color:#fff;text-align:left;box-sizing:border-box;}
.main_search .pt2 a:hover{cursor:pointer}

.main_search li.go {position:absolute; top:0; right:0; display:block; width:230px; height:100%;background:#718599; padding:0}
.main_search li.go a{position:relative; display:block; width:100%; height:100%; line-height:16px; font-size:12px; padding:15px 50px 0 26px; box-sizing:border-box; text-align:left; color:#fff}
.main_search li.go span{position:absolute; top:20px; right:20px; width:26px; height:26px; line-height:26px; display:block; text-align:center; color:#718599; background:#fff; border-radius:100px}

.main_search [type="text"],
.main_search select{height:34px; line-height:34px; font-size:14px}
.main_search:nth-child(1) br{display:none}
.main_search label{display:none}

/*셀렉트*/
.sel_box{position:relative;margin-right:10px;display:inline-block; background:#FFFFFF; height:34px; width:100%}
.sel_box:before{content:'';display:block;position:absolute;top:calc(50% - 5px);right:16px;width:6px;height:6px;border:2px solid #181B32;border-top-width:0;border-left-width:0;transform:rotate(45deg);z-index:5;}
.sel_box:after{content:'';display:block;position:absolute;top:7px;right:7px;width:26px;height:26px; background:#fff;} /* z-index:0 */
.sel_box select{outline:none;position: relative;width:calc(100% - 0px); background:transparent; -webkit-appearance:none;-moz-appearance:none;appearance:none; padding-right:30px!important}
.sel_box select::-ms-expand{ display:none;}


/* 공지사항 */
.news{display:block; width:1200px; margin:0 auto; min-height:250px; background:#fff; color:#fff; padding:35px; box-sizing:border-box; text-align:left; border-bottom:1px solid #e0e6e9;}

.notice{position:relative; display:block; float:left; width:50%; box-sizing:border-box}
.notice p.title{position:relative; display:block; width:100%; font-size:18px; color:#000; font-weight:500; padding:0 40px 5px 0; box-sizing:border-box; border-bottom:1px solid #000}
.notice p.title a.more{position:absolute; bottom:5px; right:0; display:block; width:19px; height:19px; background:url(/resource/images/eng/main/icon_more.png) no-repeat center; text-indent:-9999px}
.notice li a{display:block; overflow:hidden;text-overflow:ellipsis;white-space:nowrap; margin-right:120px; text-decoration:none; }
.notice li span{position: absolute; font-size:12px; right:0; bottom:0; color:#666}
.notice li a:hover{color:#3c77c8; text-decoration:underline;}

.notice ul.headline{position:relative; width:100%; margin:20px 0 10px 0;}
.notice ul.headline li{position:relative; display:block; width:100%;}
.notice ul.headline li:nth-child(1){color:#000; margin-bottom:5px; font-size:15px; font-weight:400}
.notice ul.headline li:nth-child(2){font-size:13px; color:#666; font-weight:300}
.notice ul.headline li:nth-child(3){position:absolute; display:block; width:100%; height:100%; top:0; left:0}
.notice ul.headline li:nth-child(3) a{display:block; width:100%; height:100%; text-indent:-9999px}
.notice ul.headline li:nth-child(3) a:hover{cursor:pointer}
.notice ul.headline:hover li{text-decoration: underline; color:#0045b7}

.notice ul.list{width:100% }
.notice ul.list li{position:relative; display:block; width:100%;  height:26px; line-height:26px; }
.notice ul.list li a{font-size:14px; color:#333}
.notice ul.list li a:hover{ color:#0045b7}


/* 포토뉴스 */
.photo_news{position:relative; display:block; float:right; width:46%;}
.photo_news p.title{position:relative; display:block; width:100%; font-size:18px; color:#000; font-weight:500; padding:0 40px 15px 0; box-sizing:border-box }
.photo_news p.title a.more{position:absolute; bottom:15px; right:0; display:block; width:19px; height:19px; background:url(/resource/images/eng/main/icon_more.png) no-repeat center; text-indent:-9999px}


.photo_news ul{position:relative; display:block; width:100%; padding:0 0 0 225px; box-sizing:border-box }
.photo_news li:nth-child(1){position:absolute; top:0; left:0; display:block; width:200px; height:100%; overflow:hidden;}
.photo_news li:nth-child(2){color:#000; font-size:14px; height:45px; margin-bottom:5px; overflow:hidden; font-weight:400}
.photo_news li:nth-child(3){font-size:13px; height:60px; margin-bottom:5px;overflow:hidden; }
.photo_news li:nth-child(4){font-size:12px; color:#666}
.photo_news li:nth-child(5){position:absolute; display:block; width:100%; height:100%; top:0; left:0}
.photo_news li:nth-child(5) a{display:block; width:100%; height:100%; text-indent:-9999px}
.photo_news li:nth-child(5) a:hover{cursor:pointer}

.photo_news li:nth-child(1) img{width:100%; transition:all .3s; }
.photo_news ul:hover li:nth-child(1) img{transform: scale(1.3)}
.photo_news ul:hover li{color:#0045b7}


/* 메인센터배너 */
.center_banner{display:table;  width:1200px; margin:0 auto; margin:20px auto 30px auto; background:#fff; padding:0 35px; box-sizing:border-box; height:70px; text-align:center;}

.center_banner li{position:relative; display:inline-block; height:100%}
.center_banner li a{display:block; width:100%; height:100%; color:#444; font-size:15px; font-weight:400; background-repeat: no-repeat;background-position: left center; padding-left:110px; box-sizing:border-box; line-height:70px; text-align:left}

/* .center_banner li:nth-child(1){width:40%}
.center_banner li:nth-child(2){width:32%}
.center_banner li:nth-child(3){width:24%} */

/* 코로나19삭제로 비율조정함 20230420 SR000043482 송정섭요청 */
.center_banner li:nth-child(1){width:52%}
.center_banner li:nth-child(2){width:19%}

/* .center_banner li:nth-child(1) a{background-image: url(/resource/images/eng/main/center_banner_01.png)}
.center_banner li:nth-child(2) a{background-image: url(/resource/images/eng/main/center_banner_02.png)}
.center_banner li:nth-child(3) a{background-image: url(/resource/images/eng/main/center_banner_03.png)} */

.center_banner li:nth-child(1) a{background-image: url(/resource/images/eng/main/center_banner_02.png)}
.center_banner li:nth-child(2) a{background-image: url(/resource/images/eng/main/center_banner_03.png)}

.center_banner li a:hover{cursor:pointer; color:#0045b7}
.center_banner li a br{display:none}

/* 센터 메뉴그룹 */
.c_menu_box{display:block; width:1200px; height:410px; margin:20px auto 45px auto; box-sizing:border-box;}
.c_menu_box ul{display:block; float:left; width:25%; height:100%; padding:45px 20px 20px 20px; box-sizing:border-box }
.c_menu_box li{position:relative; width:100%; display:block; text-align:center}
.c_menu_box li:nth-child(1){height:80px;}
.c_menu_box li:nth-child(2){height:50px; font-size:20px; color: #fff; background: url(/resource/images/eng/main/white_bar.png) no-repeat center bottom; margin-bottom:20px; font-weight:400}
.c_menu_box li:nth-child(3) a{display:block; color:#fff; line-height:18px; font-size:14px; margin-bottom:5px}
.c_menu_box li:nth-child(3) a:hover{text-decoration:underline; color:#00fff6}

.c_menu_box li:nth-child(1) img{transition:all .6s}
.c_menu_box ul:hover img{transform:rotateY(180deg)}

.c_menu_box ul:nth-child(1){background:#536cb4}
.c_menu_box ul:nth-child(2){background:#718599 url(/resource/images/eng/main/center_bg01.png) no-repeat}
.c_menu_box ul:nth-child(3){background:#23a6d1}
.c_menu_box ul:nth-child(4){background:#3b86d1 url(/resource/images/eng/main/center_bg02.png) no-repeat}


/* koreanet */
.koreanet{position:relative; width:100%;  display:inline-block; background:#f5f6fa; padding:50px 0}
.koreanet p.title{display:block; width:100%; text-align:center; padding-bottom:30px }

.koreanet ul{width:22%; margin:0 4% 0 0; display:block; float:left; overflow:hidden; position:relative; border-bottom:1px solid #c1c6da; box-sizing:border-box;background:#fff}
.koreanet ul:nth-child(4){margin:0;}

.koreanet li{width:100%; height:100%; display:block;}
.koreanet li:nth-child(1){overflow:hidden; text-align:center; position:relative; display:block}
.koreanet li:nth-child(2){width:100%;height:60px;text-align:center;background:#fff; font-size:14px; color:#333;  box-sizing:border-box; padding:15px 20px 0 20px; line-height:20px;display:block;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;margin-bottom:10px}
.koreanet li:nth-child(3) a{
	width: 100%;
	height: 100%;
	text-indent: -9999px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	background-image: url(/resource/images/eng/common/icon_play.png);
	background-repeat: no-repeat;
	background-position: center 30%;
}

.koreanet ul:hover{cursor:pointer}
.koreanet li:nth-child(1) img{max-width:100%; transition: all .3s;}  
.koreanet ul:hover li:nth-child(1) img{  transform: scale(1.3);}


/* 하단배너모음 */

.footer_banner{position:relative; width:1200px;  display:table; padding:50px 0 40px 0; margin:0 auto}
.footer_banner li{width:22%; margin:0 3% 10px 0; display:block; float:left; border:1px solid #ddd; box-sizing:border-box; overflow:hidden}
.footer_banner li a{display:block; width:100%}
.footer_banner li a img{width:100%}
.footer_banner li:nth-child(4n){margin:0 0 10px 0}


/* footer */
.footer {position:relative; width:100%; background:#424957}
.footer ul{position:relative; width:1200px; margin:0 auto; padding:30px 10px 50px 260px; box-sizing:border-box; background:url(/resource/images/eng/main/logo_02.png?v=2025100101) no-repeat left 30px}
.footer li{font-size:13px; text-align:left; color:#fff}
.footer li:nth-child(3){margin-top:15px}
.footer li:nth-child(3) a{display:inline-block; color:#fff; border:1px solid #808080; padding:3px 15px; margin-right:5px}
.footer li:nth-child(3) a:hover{background:#2f3749}


.footer li.top{position:absolute; right:0; top: -8px;	padding: 0;	width: 50px;	height: 50px;	display: block;
	text-indent: -9999px;	transition: all .3s;	background:#586276 url(/resource/images/eng/main/top_arrow.png) no-repeat center}
.footer li.top:hover{background:#283849 url(/resource/images/eng/main/top_arrow.png) no-repeat center 4px; cursor:pointer}


/*.btn-top{position:fixed;right:30px;bottom:100px;display:none;z-index:1000;}
.btn-top a{display:block;width:70px;height:70px;border-radius:50%;line-height:70px;text-align:center;color:#fff;background-color:#db0a81}*/




@media all and (max-width:1300px) {
.layout,	
.inner,
.news,
.center_banner,
.c_menu_box,
.footer_banner,
.footer ul{width:95%}

.main_top{background-size:1600px}
.headcopy{height:280px}
.headcopy li:nth-child(1){background-size:300px}
.headcopy li:nth-child(2){bottom:20px}

.c_menu_box{height:350px}
.c_menu_box ul{padding:30px 10px 10px 10px}
.c_menu_box li:nth-child(1){height:60px}
.c_menu_box li:nth-child(1) img{width:60px}
.c_menu_box li:nth-child(2){height:auto; padding-bottom:10px}

.koreanet ul{width:24%; margin:0 1% 0 0}
.koreanet li:nth-child(2){font-size:13px}

.footer_banner li{width:24%; margin:0 1% 0 0}
	
.footer ul{padding:30px 10px 50px 120px; background:url(/resource/images/eng/main/logo_03.png?v=2025100101) no-repeat left 30px}
	
}


@media all and (max-width:1200px) {
	
.main_search {padding:13px 210px 0 200px}
.main_search li{padding-left:5px}
.main_search li.tit {line-height:20px; width:170px; padding:10px 0 0 20px; text-align:left}
.main_search li.srch a.btn{font-size:13px; background-size:20px; padding:0 10px 0 25px}
.main_search li.srch button.btn{font-size:13px; background-size:20px; padding:0 10px 0 25px}
.main_search li.go {width:210px}
.main_search li.go a{padding:15px 40px 0 15px}
.main_search li.go span{right:15px}

}


@media all and (max-width:1000px) {

.center_banner li{height:70px}
.center_banner li a{line-height:20px; background-size:90px; padding:10px 0 0 100px}
.center_banner li a br{display:block}


	
	
}

@media all and (max-width:900px) {
	
.main_search {height:85px; padding:35px 210px 0 20px}
.main_search li{padding:0 5px 0 0}
.main_search li.tit {width:100%}
.main_search li.go a{padding:25px 40px 0 15px}
.main_search li.go a span{top:30px}

.c_menu_box li:nth-child(2){font-size:16px}	
.c_menu_box li:nth-child(3) a{font-size:13px}



}

@media all and (max-width:800px) {

.c_menu_box{height:330px}	
.c_menu_box ul{width:50%}

.main_top {background:#d8deea; padding-bottom:20px}
.main_top div.inner{display:inline-block; padding:20px 0 10px 0; height:145px}
.main_top div.inner:after{content:""; clear:both}
.headcopy{width:33%; float:right; height:100%}



.main_search {width:65%; float:left; height:100%; background:#718599; padding:20px 20px 20px 170px}
.main_search li{padding:0}
.main_search li.tit {width:150px; padding:0; top:20px; left:20px; font-size:14px}
.main_search li.srch {float:none; width:100%; height:auto; display:block; margin-bottom:5px}
.main_search li.srch a.btn{width:70px; height:28px; line-height:28px; padding:0; background:#464f61; font-size:13px; text-align:center; right:-1px}
.main_search li.srch button.btn{width:70px; height:28px; line-height:28px; padding:0; background:#464f61; font-size:13px; text-align:center; right:-1px}


.main_search li.go {background:none; width:auto; height:auto; top:auto; bottom:10px; right:20px }
.main_search li.go a{padding:0; height:auto}
.main_search li.go a br,
.main_search li.go a span{display:none}

.main_search [type='text'], .main_search select{height:28px; line-height:28px}
.sel_box{height:28px}
.sel_box::after{top:4px; right:4px; width:20px; height:20px }
.sel_box::before{right:12px}

.main_search .pt1 {width:100%;float:left;margin-right:0;margin-bottom:3px}
.main_search .pt2 {width:100%;float:left;position:relative}


.headcopy li:nth-child(1){display:none}
.headcopy li:nth-child(2){position:static; width:100%; height:100%; background:url(/resource/images/eng/main/commissioner_01.png) no-repeat right top; border-bottom:1px solid #bbc5d8}
.headcopy li:nth-child(2) a{background-size:100px; background-position: 9px 5px; padding:15px 20px 0 0}

.news{background:none; padding:0; border-bottom:none; min-height:auto; height:260px; overflow:hidden}
.notice{background:#fff;width:65%; padding:20px; height:100%; overflow:hidden; ; border-bottom:1px solid #bbc5d8}

.photo_news{background:#fff;width:33%; padding:20px; height:100%; overflow:hidden; border-bottom:1px solid #bbc5d8}
.photo_news ul{padding:0}
.photo_news li:nth-child(1){position:static; width:100%}
.photo_news li:nth-child(2){font-size:13px; padding-top:10px}
.photo_news li:nth-child(3),
.photo_news li:nth-child(4){display:none}

.photo_news p.title{padding:0 40px 5px 0}
.photo_news p.title a.more{bottom:10px}


.center_banner{margin:15px auto 0 auto; padding:0; background:none; height:auto}
.center_banner li{background:#fff; height:100%; float:left; border-right:1px solid #d8deea; box-sizing:border-box; border-bottom:1px solid #bbc5d8}
.center_banner li a{font-size:13px; background-size:60px; padding:10px; background-repeat: no-repeat;background-position:55% 15px; padding:55px 0 15px 0; text-align:center; background-size:60px; line-height:18px }
/* .center_banner li:nth-child(1){width:33.3%}
.center_banner li:nth-child(2){width:33.3%}
.center_banner li:nth-child(3){width:33.3%} */

.center_banner li:nth-child(1){width:50%}
.center_banner li:nth-child(2){width:50%}


.koreanet{margin-top:30px; padding:30px 0;}

.footer_banner li{width:32%; margin:0 2% 10px 0}
.footer_banner li:nth-child(3n){margin:0 0 10px 0}
.footer_banner li:nth-child(4n){margin:0 2% 10px 0}



}


@media all and (max-width:700px) {

.koreanet{margin-top:20px; padding:20px 0;}

.koreanet ul{width:48%; margin:0 4% 20px 0}
.koreanet ul:nth-child(even){margin:0 0 20px 0}
/*.koreanet li:nth-child(2){line-height:16px}*/

.footer_banner{padding:20px 0}
.headcopy li:nth-child(2) a {background-size:97px;}
}

@media all and (max-width:640px) {
	
	
.main_search li.srch a.btn{font-size:12px}
	

.news{height:auto; overflow:visible}
.notice{width:100%; float:none; margin-bottom:15px; height:auto}

/* 포토뉴스 */
.photo_news{width:100%; float:none; margin-bottom:10px; height:auto }
.photo_news ul{padding:0 0 0 225px;}
.photo_news li:nth-child(1){position:absolute; width:200px}
.photo_news li:nth-child(2){padding-top:0; height:43px}
.photo_news li:nth-child(3),
.photo_news li:nth-child(4){display:block}

.photo_news p.title{padding:0 40px 5px 0}
.photo_news p.title a.more{bottom:15px}

.koreanet{margin-top:30px; padding:30px 0 10px 0; }
.koreanet li:nth-child(2){padding:10px;height:50px}
.headcopy li:nth-child(2) a{background-size:78px; background-position: -1px bottom; padding:15px 20px 0 0}
	
}

@media all and (max-width:600px) {
.headcopy{width:38%}
.main_top div.inner{height:160px}
.main_top div.inner{height:160px}
.main_search {width:60%; padding:10px 20px 10px 20px; margin-bottom:0}
.main_search li.tit {position:static; width:100%;height:auto; margin-bottom:5px  }
.main_search li.srch a.btn{width:60px}

.main_search li.go {position:static; width:100%}

.c_menu_box ul{padding:20px 10px 10px 10px}
.c_menu_box li:nth-child(1){height:50px}
.c_menu_box li:nth-child(1) img{width:50px}

.c_menu_box ul:nth-child(2){background-size:cover}
.c_menu_box ul:nth-child(4){background-size:cover}



.footer_banner li{width:49%; margin:0 2% 10px 0}
.footer_banner li:nth-child(even){margin:0 0 10px 0}
.footer_banner li:nth-child(3){margin:0 2% 10px 0}


.footer ul{padding:20px; background:none;}
.footer li{font-size:12px}

.headcopy li:nth-child(2) a {background-size: 90px; background-position: -1px bottom;}
}

@media all and (max-width:540px) {
	
.layout, 
.inner, 
.news, 
.center_banner, 
.c_menu_box, 
.footer_banner,
.footer ul{width:90%}
	
	
.main_top div.inner{height:190px}	
.headcopy li:nth-child(2) a{ background-size:95px;background-position: -2px bottom;}	
.headcopy li:nth-child(2) a img{position:absolute; right:20px; bottom:75px}

.photo_news ul{padding:0 0 0 180px}
.photo_news li:nth-child(1){width:160px}
.photo_news li:nth-child(4){display:none}

.c_menu_box ul{width:100%; height:auto}

	
}

@media all and (max-width:450px) {
.notice li a{margin-right:0}	
.notice li span{display:none}	
.headcopy li:nth-child(2) a{ background-size:80px;background-position: 0px bottom;padding-left: 17px;}		
}

@media all and (max-width:400px) {
.headcopy li:nth-child(2) a{ background-size:70px;background-position: 0px bottom;padding-left: 10px}		
}

@media all and (max-width:380px) {
.main_top div.inner{height:auto}	
.headcopy,	
.main_search{width:100%}

.headcopy{margin-bottom:15px}
.headcopy li:nth-child(2) a{ background-size:90px;background-position: 22px 3px; padding:15px 20px 15px 0}
.headcopy li:nth-child(2) a br,
.headcopy li:nth-child(2) a img{display:none}	
}
@media all and (max-width:359px) {
.center_banner li a{font-size:12px}
}