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


/* tap 스킵 영역 */
.skipToContent a { position:absolute; top:0; left:0; z-index:9999; width:100%; height:1px; margin-top:-1px; display:block; background-color:#3875c1; font-size:1rem; font-weight:400; color:#fff; line-height:1; overflow:hidden; text-align:center;}
.skipToContent a:focus,.skipToContent a:active,.skipToContent a:hover {margin-top:0; height:auto; padding:10px 0px;}

.wrapper {position:absolute; width:100%; margin:0; padding-top:110px; text-align:left; font-size:1rem; background:url(/images/kofac/sub_bg.jpg) top no-repeat;} /* 서브 전체 배경 */


/* 상단메뉴 start */
.gnbWrap {position:absolute; top:0px; left:0; width:100%; height:80px; border-bottom:0; z-index: 100; background:#fff;  background: #fff; min-width: 1240px; padding: 0 40px;}
.gnbWrap .gnbArea {position:relative; height: 0; margin:0 auto; text-align:left;}
.gnbWrap .gnbArea:after {content:""; clear:both; display:block;}
.gnbWrap .gnbArea h1 {float:left;margin-top:25px;margin-right: 80px;z-index: 999;position: relative;}
.gnbWrap .gnbArea h1 a {display:block; width: 170px; height: 35px;}
.gnbWrap.bg_bl {background: var(--main_blue);}
.gnbWrap.bg_pur {background: #3B3A6E;}
/*.gnbWrap.bg_bl .gnbArea h1 a {display:block; background: url(/images/kofac/main_logo_white.svg) no-repeat; width: 170px; height: 35px;}*/
/* .gnbWrap .gnbArea h1 a img {max-width:100%;} */


/* 상단 로그인 영역 */

.loginArea {display: flex; align-items: center; height: 80px; position: relative;}
.loginArea .login {padding:3px 13px; cursor: pointer; float:left; position: relative; background-color: #fff; border-radius: 20px;}
.loginArea .login a span {font-size:15px; font-weight: 500; color:#333; padding:0px 3px 0px 0px;}
/* .loginArea .login a span:hover {color:#484848;} */
.loginArea.main .login,
.loginArea.main .change_user_box p a,
.loginArea.main .loginjoin a{border: 1px solid #cecece;}
.loginArea.main .loginjoin a{margin-left: 15px; padding:3px 13px; background-color: #fff; border-radius: 20px;}
.alarm_bell {float:right; margin-left:4px; background: url(/images/kofac/bell_icon.jpg) left no-repeat; padding:0px 0px 0px 17px;}
.alarm_bell p a {background: #ff4a2d; border-radius: 100%; display: block; width:25px; height: 25px; }
.alarm_bell p a span {color:#fff !important; font-weight: 600 !important; font-size:0.8rem !important; width:15px !important; display: block; text-align: center; padding-top:3px !important; padding-left:4px !important;} 
.alarm_bell p a:hover {background: #ce1c00;}

/*권한변경 영역 20200811 추가 start */
.change_user {position: relative; float:left; margin-left:2px;}
.change_user_box p a {padding: 3px 13px;background: #fff;border-radius: 20px;margin: 0 16px; font-size: 16px;}
.change_user_box p a:hover {}
.change_user_text {position: absolute; top:32px; left:-15px; background: #fff; padding:0px 0px; border-radius: 5px; border:1px solid #cecece; }
.change_user_text ul li {padding:3px 15px 3px 25px;}
.change_user_text ul li a {padding:5px 10px 5px 5px; width:114px; display: block; text-align: left; font-size:0.95rem; /*background:#fff url(/images/kofac/icon/icon_arrow_off.png) right no-repeat;*/}
.change_user_text ul li a:hover {color:#457ae4; /*background: url(/images/kofac/icon/icon_arrow_on.png) right no-repeat;*/}

.change_user_text .icon_a {background: url(/images/kofac/icon/icon_gn_off_a.png) 8px 10px no-repeat;}
.change_user_text .icon_a.on {background: url(/images/kofac/icon/icon_gn_on_a.png) 8px 10px no-repeat;}
.change_user_text .icon_a.on a {color:#457ae4; font-weight: 600; background: url(/images/kofac/icon/icon_arrow_on.png) right no-repeat;}

.change_user_text .icon_a:hover {background: url(/images/kofac/icon/icon_gn_on_a.png) 8px 10px no-repeat;}
/*권한변경 영역 20200811 추가 end */


.loginout_wrap { float:left; margin-left:3px;}
/* .loginjoin {padding:3px 15px 5px 15px; border:1px solid #bfcdcd; border-radius: 100px; background: #fff; background: #fff url(/images/kofac/icon/icon_sign_up.png) 10% 50% no-repeat;} */
.loginjoin a{color:#333; font-size:15px; display: inline-block; padding-left: 18px;}

.moreLogin {position: absolute; top:62px; left:-15px; background: #fff; padding:0px 0px; border-radius: 5px; border:1px solid #cecece; }
.moreLogin ul li {padding:3px 15px 3px 25px;}
.moreLogin ul li a {padding:5px 10px 5px 5px; width:114px; display: block; text-align: left; font-size:0.95rem; /*background:#fff url(/images/kofac/icon/icon_arrow_off.png) right no-repeat;*/}
.moreLogin ul li a:hover {color:#457ae4; /*background: url(/images/kofac/icon/icon_arrow_on.png) right no-repeat;*/}

.moreLogin .icon_a {background: url(/images/kofac/icon/icon_gn_off_a.png) 8px 10px no-repeat;}
.moreLogin .icon_a.on {background: url(/images/kofac/icon/icon_gn_on_a.png) 8px 10px no-repeat;}
.moreLogin .icon_a.on a {color:#457ae4; font-weight: 600; background: url(/images/kofac/icon/icon_arrow_on.png) right no-repeat;}

.moreLogin .icon_a:hover {background: url(/images/kofac/icon/icon_gn_on_a.png) 8px 10px no-repeat;}
.moreLogin ul li
.loginout_wrap { float:left; margin-left:3px;}
.loginout p {margin-top:5px;}
.loginout p a {border:1px solid #727a95;border-radius: 100px;padding: 5px 15px 7px 30px;color:#fff;font-weight: 500;font-size:0.9rem;background: #727a95 url(/images/kofac/loginout_icon.png) 10% 50% no-repeat;}
.loginout p a:hover {background:#374368 url(/images/kofac/loginout_icon.png) 10% 50% no-repeat;}

.gnbWrap #gnb{position: relative; width: 100%; text-align: left;  max-width:100%; margin: 0px auto 0; -webkit-transition: all 0.5s ease; transition: all 0.5s ease;} /* 20200811 수정 */
.gnbWrap #gnb .nav { height: auto; position: relative; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; /* text-align: center;*/ font-size:0px;} /* 20200811 수정 */

.gnbWrap #gnb .menuDepth1 { /* position: relative; */  display: inline-block; height: 80px; vertical-align:top;} /* 20200811 수정 */
.gnbWrap #gnb .menuDepth1 > a {font-weight:600;display: flex;align-items: center;font-size: 19px;height:80px;width: 170px;text-align: center;box-sizing: border-box;justify-content: center;color:#2E2E2E; padding-left: 15px;}
.gnbWrap.bg_bl #gnb .menuDepth1 > a {color:#fff;}
.gnbWrap.bg_pur #gnb .menuDepth1 > a {color:#fff;}
/* .gnbWrap #gnb .menuDepth1 > a:hover{color:#457ae4; text-decoration: underline;} */
.gnbWrap #gnb .menuDepth1 .menuDepth2 {overflow: hidden;position: relative;left: 26%;height: auto;opacity: 0;padding: 5px 15px 0 15px;-webkit-transition: all 0.3s ease;transition: all 0.3s ease;}
.gnbWrap #gnb .menuDepth2 li a{letter-spacing:-1px; font-size:15px; display:inline-block; font-weight:normal;color:#333;margin:12px 0 0 0; /*background:url(/images/kofac/icon_whitedot2x2.gif) no-repeat left 24px; padding-left:8px;*/}
.gnbWrap #gnb .menuDepth2 li p{letter-spacing:-1px; font-size:15px; display:inline-block; font-weight:normal;color:#333;margin:12px 0 0 0;} /* 심의 메뉴 분류 */
.gnbWrap #gnb .menuDepth2 li a:hover{color:#8cff79; text-decoration:none;/*box-size:border-box;background:url(/images/kofac/icon_yellowdot2x2.gif) no-repeat left 24px;*/}
.gnbWrap #gnb .menuDepth1 .menuDepth2 .depth3 { display: none; }
/*.gnbWrap #gnb:before { position: absolute; left: 50%; top: 75px; z-index: -1; width: 1000%; height:100%;  margin-left: -500%; background: url("/images/kofac/gnb_bg.gif") no-repeat center bottom #fff;  background: #FFBDBF; content: '';}*/
.gnbWrap:before {display: block; position: absolute;left: 0; top: 80px; width: 100%; height:0; background: #fff; content: '';  transition: all .2s;}
.gnbWrap.open:before {height: 270px;}

.gnbWrap #gnb.active .nav {height: auto;}
.gnbWrap #gnb.active .gnbArea { height: 300px; }
.gnbWrap #gnb.active .menuDepth2 {height: auto; min-height: 250px; opacity: 1; display: block; border-top: 15px solid #fff;}
.gnbWrap #gnb.active .full_menu .menuDepth2 {display: flex;}
.gnbWrap #gnb.active .on .menuDepth2 { background-color:var(--main_blue); }
.gnbWrap #gnb.active .on .menuDepth2 a { color: #fff; position: relative;}
.gnbWrap #gnb.active .on .menuDepth2 a:hover::after {position: absolute; width: 100%; height: 1px; bottom: 0; left: 0; background: #fff; content: '';}
.gnbWrap #gnb.active:before { border-top: 0px solid #eee; border-bottom: 0px solid #eee; }

.gnbWrap .mask {display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #000; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; /* IE-8 */ filter:alpha(opacity=80); /* IE-7 */ opacity:0.8; /* all-browser */ z-index:50; }


/* 검정담당자 */

.gnbWrap #gnb .pub_menu .menuDepth1{position: relative;}
.gnbWrap #gnb .pub_menu .menuDepth1:first-child .menuDepth2{margin-left: 30px !important;}
.gnbWrap #gnb .pub_menu .menuDepth2{display: flex; position: absolute; left: 50%; opacity: 0; z-index: -9; height: 0; overflow: hidden; transform: translate(-50%, 0);}
.gnbWrap #gnb .pub_menu .menuDepth2 > ul li{width: 154px;}
.gnbWrap #gnb .pub_menu .menuDepth2 li{width: 154px; transition: all .2s;}
.gnbWrap #gnb .pub_menu .menuDepth2 > li{margin: 0 15px; padding: 0 15px;}
.gnbWrap #gnb .pub_menu .menuDepth3{display: block;}
.gnbWrap #gnb .pub_menu .menuDepth1 .menuDepth2 > li > a, 
.gnbWrap #gnb .pub_menu .menuDepth1 .menuDepth2 > li > p  {color: #333333; font-weight: bold; font-size: 15px;}
.gnbWrap #gnb.active .pub_menu .on .menuDepth2{background: #fff;}
.gnbWrap #gnb.active .pub_menu .menuDepth2 .bg_gnb{background: var(--main_blue); }
.gnbWrap.bg_pur #gnb.active .pub_menu .menuDepth2 .bg_gnb{background:#3B3A6E; }
.gnbWrap #gnb.active .pub_menu .on .menuDepth2 .bg_gnb a,
.gnbWrap #gnb.active .pub_menu .menuDepth2 .bg_gnb p{color: #fff;}
.gnbWrap #gnb.active .pub_menu .on .menuDepth2 a{color: #333333;}
.gnbWrap #gnb.active .pub_menu .on .menuDepth3 {margin-right: 10px;}
.gnbWrap #gnb .pub_menu .menuDepth2 > li.on{background: var(--main_blue)}
.gnbWrap.bg_pur #gnb .pub_menu .menuDepth2 > li.on{background: #3B3A6E;}
.gnbWrap #gnb .pub_menu .menuDepth1 .menuDepth2 > li.on a{color: #fff}


.footer {/*border-top: 1px solid #cecece;*/ width:100%; margin: 0 auto;}
.footerArea {background: #333333; color:#fff; font-size:0.8rem;  padding:20px 0px;}
.footer_SubWrap_all {position: relative; width:1240px; margin:0 auto; background: #333333; overflow: hidden;} 
.footerSubWrap h4 {float:left; padding:14px 0; padding-right:35px;}
.footerSubWrap h4 img {width: 100%; max-width: 154px;}
.footerSubMenu {position: absolute; right:0px; top:10px;}
.footerSubMenu ul li {float:left; margin-top: 10px;}
.footerSubMenu ul li a {padding:2px 0; color: #fff; padding-top: 9px; font-weight: bold; border-bottom: 1px solid #fff;}
.footerInfo.colorWhite p, .footerInfo.colorWhite span, .footerInfo.colorWhite address{color:#fff}




/* 2023-04-06 수정 */
.selectBox {position: relative;display:inline-block;min-width:130px;min-height:28px;vertical-align:middle; background:transparent url(/images/kofac/bg_selectbox_arrow.png) no-repeat right 5px center; /* background-size: 27px 26px;*/ background-color: #fff; border:1px solid #dadada; padding-left:10px; padding-right:30px;}
/* 2023-03-16 추가 */
.enlargement_wrap { display: flex; margin-left: 3px;}
.enlargement p a {background: url(/images/kofac/icon/enlargement.png) no-repeat center; display: inline-block; width: 20px; height: 20px; font-size: 0; vertical-align: bottom; padding: 0 40px;}
/* .enlargement p a:hover {background: url(/images/kofac/sub/btn_enlargement_on.png) 0 0 no-repeat;} */

.enlargement_wrap.sub_blue p a {background: #fff url(/images/kofac/icon/enlargement_blue.png) no-repeat center; border-radius: 50%; width: 30px; height: 30px; margin-right: 16px; padding: 0;}
.enlargement_wrap.sub_pur p a {background: #fff url(/images/kofac/icon/enlargement_pur.png) no-repeat center; border-radius: 50%; width: 30px; height: 30px; margin-right: 16px; padding: 0;}

/* 헤더 추가 */

.hd_search{width: 20px; height: 20px; background: url(/images/kofac/icon/search.png) no-repeat center; padding: 0 20px;}
.enlargement_wrap.sub_blue .hd_search{background: #fff url(/images/kofac/icon/search_blue.png) no-repeat center; border-radius: 50%; width: 30px; height: 30px; padding: 0;}
.enlargement_wrap.sub_pur .hd_search{background: #fff url(/images/kofac/icon/search_pur.png) no-repeat center; border-radius: 50%; width: 30px; height: 30px; padding: 0;}

@media (max-width: 1680px){
    .gnbWrap{padding: 0 10px;}
    .loginArea{right: 0 !important;}
    .gnbWrap .gnbArea h1{margin-right: 0;}
    .gnbWrap #gnb .menuDepth1 > a{width: 160px;}
    .enlargement p a{padding: 0 30px;}
}