@charset "utf-8";

/* set */
body {font-size:16px;margin:0;padding:0;font-family: SCDream, NotoSans, Dotum, "돋움", sans-serif;color:#222;font-weight:400;}
input, select, button, pre{font-family: SCDream, NotoSans, Dotum, "돋움", sans-serif;font-size:16px;color:#222}

#skip{top:0;right:0;position:absolute;width:100%;height:15px;text-align:center}
#skip li a{display:block;left:-10000px;position:absolute;top:0;width:100%;text-align:center;z-index:0;height:1px}
#skip li a:hover, #skip li a:focus, #skip li a:active {background:#363636;position:absolute;top:0px;left:0;z-index:5;color:#fff;width:100%;height:25px;padding:5px 0 0 0}

.blind{display:block;overflow:hidden;position:absolute;top:-5000px;left:-5000px;font-size:0;}
.hide{display:none !important;margin:0;padding:0}
.new_win{display:inline-block;width:12px;height:12px;font-size: 0;overflow:hidden;margin:0 0 0 5px;vertical-align:top;background:url("/images/19_global/common/new_win.png");}

*::-webkit-scrollbar {width:5px;height:5px;} /*스크롤바 사이즈*/
*::-webkit-scrollbar-track {border-radius:5px;background:#ededed;} /*스크롤바 배경*/
*::-webkit-scrollbar-thumb {background:#2259c8;border-radius: 10rem} /* 스크롤 제어박스*/

.wrap{margin: 0 20px;}

/* Mobile */
header{position: relative;}
.gnb{margin: 0 10px;}
.gnb:after{display: block;clear: both;content: "";}
.gnb .top_link{float: left;}
.gnb .top_link ul:after{display: block;clear: both;content: "";}
.gnb .top_link li{float: left;margin: 5px 10px 5px 0;}
.gnb .top_link li a{display: block;font-size: 14px;color: #333;}
.gnb .top_link li:first-child a{color: #152c6f;}
.gnb .top_link li.family a:after{display: inline-block;width: 12px;height: 12px;margin-left: 5px;content: "";background: url("/images/19_global/common/cm_ico.png") no-repeat center 0;}
.gnb .top_link li.family .blur_box{display: none;position: fixed;width: 100%;height: 100%;top: 0;left: 0;bottom: 0;z-index: 100;background: rgba(0,0,0,.7);-webkit-backdrop-filter: blur(3px);backdrop-filter: (3px);}
.gnb .top_link li.family .blur_box.on{display: block;}
.gnb .tsns{position: relative;float: right;margin-top: 5px;}
.gnb .tsns button{display: block;padding: 0;font-size: 14px;color: #333;background: none;}
.gnb .tsns button:after{display: inline-block;width: 12px;height: 12px;margin-left: 5px;content: "";background: url("/images/19_global/common/cm_ico.png") no-repeat center 0;}
.gnb .sns{display: none;position: absolute;padding: 0 10px;border: 1px solid #2358c3;border-radius: 10px;background: #fff;z-index: 1;}
.gnb .sns.on{display: block;}
.gnb .sns li{margin: 10px 0;}
.gnb .sns li a{display: block;font-size: 0;width: 30px;height: 30px;background: url("/images/19_global/common/cm_ico.png") no-repeat;}
.gnb .sns li.ins a{background-position: center -233px;}
.gnb .sns li.fb a{background-position: center -263px;}
.gnb .sns li.blog a{background-position: center -293px;}
.gnb .sns li.ytb a{background-position: center -323px;}
.gnb .lang{position: absolute;right: 60px;top: 5px;}
.gnb .lang>button{display: block;padding: 0;font-size: 0;overflow: hidden;background: none;}
.gnb .lang>button:before{display: inline-block;width: 20px;height: 20px;background: url("/images/19_global/common/cm_ico.png") no-repeat center -436px;content: "";vertical-align: middle;}
.gnb .lang>button:after{display: inline-block;width: 12px;height: 12px;margin-left: 5px;content: "";background: url("/images/19_global/common/cm_ico.png") no-repeat center 0;vertical-align: middle;}
.gnb .lang_box{display: none;position: absolute;right: 0;width: 160px;padding: 0 10px;border: 1px solid #2358c3;border-radius: 10px;background: #fff;z-index: 1;box-sizing: border-box;}
.gnb .lang_box.on{display: block;}
.gnb .lang_box li a{display: block;padding: 4px 0;border-top: 1px dashed #ddd;text-align: center;font-size: 14px;}
.gnb .lang_box li:first-child a{border: none;}
.gnb .lang_box li a:hover, .gnb .lang_box li a:focus{color: #2358c3;font-weight: bold;}

.head{padding: 20px 0;border-top: 1px solid #ddd;border-bottom: 1px solid #ddd;}
.head .wrap:after{display: block;clear: both;content: "";}
.head h1{float: left;}
.head h1 a{display: block;padding-left: 38px;font-size: 14px;font-weight: 400;color: #777;background: url("/images/19_global/common/logo.png?test=1") no-repeat center left /contain;}
.head h1 a strong{display: block;font-size: 21px;font-weight: 600;color: #222;}
.head .login{position: absolute;right: 64px;top: 56px;}
.head .login a{display: block;width: 30px;height: 30px;font-size: 0;background: url("/images/19_global/common/cm_ico.png") no-repeat center -42px;}
.head .login.out a{background-position: center -352px;}
.head .wrap>button{position: absolute;right: 20px;top: 56px;width: 30px;height: 30px;padding: 0;margin: 0; font-size: 0;background: url("/images/19_global/common/cm_ico.png") no-repeat center -12px;}
.head .tsitemap{display: none;position: absolute;right: 20px;top: 56px;}
.head .tsitemap a{display: block;width: 30px;height: 30px;font-size: 0;background: url("/images/19_global/common/cm_ico.png") no-repeat center -12px;}

.menu{display: none;position: fixed;top: 0;bottom: 0;left: 0;right: 0;background: #fff;z-index: 9;}
.menu.on{display: block;}
.menu h2{padding: 10px;font-size: 20px;background: #fff;color: #2259c8;}
.menu>ul>li>a{display: block;font-size: 18px;font-weight: 600;color: #2259c8;width: 40%;padding: 15px 0 15px 20px;border-bottom: 1px solid #eff8fe;}
.depth_box{background: #f7fbfe;position: absolute;top: 48px;left: 40%;right: 0;bottom: 0;overflow-y: auto;z-index: 1;border-radius: 20px 0 0 0;padding-top: 20px;}
.menu li li a{display: block;font-size: 16px;padding: 10px 0 10px 20px;}
.menu li li a .new_win{margin-top: 5px;}
.menu li li ul{border-radius: 20px;background: #fff;padding: 10px;}
.menu li li li{padding: 0 10px;}
.menu li li li a{display: block;padding: 8px 0;font-size: 14px;color: #444;border-top: 1px dashed #ddd;}
.menu button{position: absolute;top: 10px;right: 10px;width: 30px;height: 30px;font-size: 0;background: url("/images/19_global/common/cm_ico.png") no-repeat center -382px;}

footer{border-top: 1px solid #ddd;}
.f_ban{padding: 15px 0;background: #fff;border-bottom: 1px solid #fff;}
.f_ban:after{display: block;;clear: both;content: "";}
.f_ban .control{float: left;}
.f_ban .control h2{display: inline-block;font-size: 14px;font-weight: 400;color: #333;}
.f_ban .control .btn{display: inline-block;font-size: 0;}
.f_ban .control .btn button{display: inline-block;width: 20px;height: 20px;padding: 0;margin: 0;background: url("/images/19_global/common/cm_ico.png") no-repeat;font-size: 0;}
.f_ban .control .btn button.prev{background-position: center -89px;}
.f_ban .control .btn button.next{background-position: center -119px;}
.f_ban .control .btn button.stop{background-position: center -149px;}
.f_ban .control .btn button.play{background-position: center -178px;}
.f_ban .list{float: left;width: calc(100% - 120px);}
.f_ban .list ul{font-size: 0;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;overflow:hidden;}
.f_ban .list li{display: inline-block;margin: 2px 0 0 15px;}
.f_ban .list li a{display: block;font-size: 13px;color: #333;}

.foot{padding: 20px 0;background: #d6d6d6;}
.foot .sitelink_list{position: relative;}
.foot .sitelink_list button{display: block;position: relative;width: 100%;padding: 15px 20px;background: #fff;border-radius: 10px;border: 1px solid #ddd;font-size: 15px;text-align: left;color: #666;}
.foot .sitelink_list button strong{font-weight: 400;color: #222;}
.foot .sitelink_list button span{position: absolute;width: 20px;height: 18px;right: 20px;top: 14px;background: url("/images/19_global/common/cm_ico.png") no-repeat center -200px;font-size: 0;}
.foot .sitelink_list div{display: none;position: absolute;bottom: 0;width: 100%;}
.foot .sitelink_list div.on{display: block;}
.foot .sitelink_list div ul{max-height: 200px;padding: 20px;overflow-y: auto;background: #fff;border: 1px solid #2358c3;border-radius: 10px;font-size: 0;}
.foot .sitelink_list div li{display: inline-block;min-width: 48%;margin: 5px 2% 5px 0;}
.foot .sitelink_list div li a{display: block;position: relative;padding-left: 10px;font-size: 14px;}
.foot .sitelink_list div li a:before{position: absolute;width: 4px;height: 4px;content: "";background: #2358c3;border-radius: 100%;left: 0;top: 8px;}
.foot .sitelink_list div button{border-color: #2358c3;}
.foot .sitelink_list div button span{background-position: center -214px;}

.f_link{margin: 40px 0;font-size: 0;}
.f_link li{display: inline-block;margin-right: 20px;}
.f_link li a{display: block;font-size: 13px;color: #666;}
.f_link li a strong{font-weight: 400;color: #000;}
.f_info{text-align: right;font-size: 0;color: #666;}
.f_info address{display: block;font-size: 13px;font-style: normal;vertical-align: middle;}
.f_info span{display: inline-block;font-size: 13px;vertical-align: middle;}
.f_info span:before{display: inline-block;width: 1px;height: 12px;content: "";background: #787878;margin: 0 10px;vertical-align: middle;}
.f_info .copy{margin-top: 20px;font-size: 13px;}
.f_info .copy strong{font-weight: 400;color: #333;}

/* Tablet */
@media all and (min-width:768px) {
.gnb .top_link li{margin-top: 12px;}
.gnb .tsns button{display: none;}
.gnb .sns{display: block;padding: 0;border: none;background: none;position: static;font-size: 0;}
.gnb .sns li{display: inline-block;margin: 3px 0 3px 7px;}
.head .login, .head .wrap>button, .head .tsitemap{top: 66px;}
.gnb .lang{right: 160px;top: 12px;}
.gnb .lang>button{font-size: 14px;}
.gnb .lang>button:before{margin-right: 4px;}
.gnb .lang_box{right: auto;left: 50%;transform: translateX(-50%);}

.foot{position: relative;}
.foot .sitelink_list{position: absolute;width: 240px;right: 20px;top: 40px;}
.f_link{margin-top: 20px;}
.f_info{text-align: left;}
}

/* Desktop */
@media all and (min-width:1023px) {
.head{padding-bottom: 0;}
.head .wrap>button, .menu button{display: none;}
.head .tsitemap{display: block;}
.menu{display: block;position: static;background: none;float: right;margin: 10px 100px 0 0;}
.menu:before{display: none;position: absolute;top:130px;left: 0;right: 0;height: 260px;background: #fff;content: "";z-index: 9;box-shadow: 0 5px 10px rgba(0,0,0,0.1);border-top: 1px solid #ddd;}
.menu.on:before{display: block;}
.menu h2{display: none;}
.menu>ul:after{display: block;clear: both;content: "";}
.menu>ul>li{float: left;position: relative; padding:0 7px;}
.menu>ul>li>a{width: auto;margin: 0;padding: 0 30px;padding-bottom: 33px!important;background: none;border: none;font-weight: 500;color: #222;}
.menu>ul.col5>li>a{padding: 0 15px;}
.menu>ul.col6>li>a{padding: 0 10px;}
.menu>ul.col7>li>a{padding: 0 5px;}
.menu>ul>li>a:hover, .menu>ul>li>a:focus{text-decoration: underline;}
.depth_box{position: static;padding: 0;background: none;}
.depth_boxcon{position: absolute;top: 57px;width: 100%;height: 190px;padding-top: 10px;z-index: 10;text-align: center;box-sizing: border-box;}
.menu li li a{padding: 10px 0;}
.menu li li a:hover, .menu li li a:focus{text-decoration: underline;}
.menu li li ul{padding: 0;background: none;border-radius: 0;}
.menu li li li a{border: none;}
.menu li li li a:hover, .menu li li li a:focus{text-decoration: underline;}


.foot{padding-bottom: 40px;}
.f_ban .control h2{font-size: 16px;font-weight: 500;}
.f_ban .list{width: calc(100% - 150px);}
.f_ban .list li a:hover, .f_ban .list li a:focus{text-decoration: underline;}
.foot .sitelink_list{width: 300px;}
.foot .sitelink_list div li a:hover, .foot .sitelink_list div li a:focus{text-decoration: underline;}
.f_link li{margin-right: 60px;}
.f_link li a{font-size: 15px;}
.f_link li a:hover, .f_link li a:focus{text-decoration: underline;}
.f_link li a strong{font-weight: 500;}
.f_info *{font-size: 15px;}
.f_info address{display: inline-block;}
.f_info .copy{margin: 0;font-size: 15px;}
.f_info .copy strong{font-weight: 500;}
}
@media all and (min-width:1200px) {
.wrap{margin: 0 auto;width: 100%;max-width: 1540px;position: relative;}
.gnb{max-width: 1540px;margin: 0 auto;position: relative;}
.head{padding: 15px 0 0; background: #fff;position: relative;}
.head h1 a{height: 58px;padding-left: 58px;background-size: auto;font-size: 20px;line-height: 58px;vertical-align: middle;}
.head h1 a strong{display: inline-block;font-size: 28px;font-weight: 700;vertical-align: baseline;}
.head .login, .head .wrap>button, .head .tsitemap{top: 10px;}
.menu:before {top: 135px;}
.menu.on:before {width: 100vw; margin: 0 auto; left: 50%; top:120px;transform: translateX(-50%);}
.menu>ul>li>a{font-size: 22px;padding-bottom: 23px!important;}
.menu>ul.col5>li>a{padding: 0 30px;}
.menu>ul.col6>li>a{padding: 0 20px;}
.menu>ul.col7>li>a{padding: 0 10px;}
.depth_boxcon{top: 53px;}

.f_ban .list{width: calc(100% - 220px);margin-left: 40px;}
.f_ban .list li{margin-left: 40px;}

.s_content{max-width: 1540px;}
}                  
@media all and (min-width:1400px) {
.menu:before {top: 78px;}
.menu.on:before { top: 63px;}
} 

/*국제교류 */ 
@media all and (min-width:1200px) {
.gb_mh .menu.on:before { top: 63px;  height: 250px;}      
}     

/* 번역 */ 
/* Mobile */ 
.translated-ltr .gnb {height: 85px;}
.translated-ltr .gnb .lang { right: 60px; top: 60px;}
.translated-ltr header { background: #fff;}
.translated-ltr .head { position: relative;}

/* Tablet */
@media all and (min-width:768px) {
.translated-ltr .gnb {height: auto;}
.translated-ltr .head { position: unset;}
.translated-ltr .gnb .lang {  right: 160px; top: 12px;}
.translated-ltr .foot .sitelink_list {width: 280px;}
.translated-ltr .foot .sitelink_list button {padding: 7px 10px;}
}

/* Desktop */
@media all and (min-width:1023px) {
.translated-ltr .menu:before {top: 195px;height: 700px;}
.translated-ltr .menu {margin: 10px 65px; 0;}
.translated-ltr .menu>ul {display: flex;  justify-content: space-between; text-align: center;}
.translated-ltr .menu>ul>li { padding: 0 7px 30px;}
.translated-ltr .menu>ul.col6>li>a { padding: 0 10px;}
.translated-ltr .depth_boxcon { top: 65px;}
.translated-ltr .foot .sitelink_list {top: 0;}
}

/* Desktop */
@media all and (min-width:1200px) {
.translated-ltr .menu {margin: 10px 90px; 0;}
.translated-ltr .menu.on:before {top: 180px;height: 620px;}
.translated-ltr .menu>ul>li { padding: 0 7px 65px;}
.translated-ltr .depth_boxcon { top: 110px;height:200px;}
.translated-ltr .menu li li a { max-width: 195px;}
}

/* Pc */
@media all and (min-width:1400px) {
.translated-ltr .menu {margin: 10px 375px 0 0;}
.translated-ltr .menu.on:before {top: 185px;height: 650px;}
.translated-ltr .lang_menu {margin: 10px 500px 0 0;}
.translated-ltr .lang_menu.on:before {height: 275px;}
.translated-ltr .depth_boxcon { top: 130px;}
}