@charset "UTF-8";
/*header-top*/
.skip-navi a{position:absolute; width:100%; top:-200px; background:#7e0dcc; line-height:55px; text-align:center; color:#fff;}
.skip-navi a:focus{top:0; z-index:200;}


#pc_header{position:absolute; top:0; left:0; width:100%; z-index:2;}
.hd-top {width:100%; background:#233a6c;}
.hd-top .con{display:flex; align-items:center; justify-content:space-between;}
.hd-top .hd-top-slogan{line-height:55px; color:#fff; font-family:'Gmarket'; font-size:14px; font-weight:300;}
.hd-top .hd-top-right{display:flex; gap:20px; align-items:center;}
.hd-top .popup-open-btn{display:block; height:100%; padding-left:20px; padding-right:40px; position:relative; color:#fff; line-height:55px; border:none; font-size:16px;}
.hd-top .popup-open-btn:after{content:""; display:block; width:15px; height:15px; background:url(/resources/custom/images/main/common/ico-plus.png);
position:absolute; right:20px; top:50%; transform:translateY(-50%);}
.hd-top .popup-open-btn{background:#2159b9;}
.hd-top-right .hd-top-menu {display:flex;gap:20px;margin:0;padding:0;list-style:none;align-items:center;}
.hd-top-right .hd-top-menu li a {color:#fff;font-size:16px;display:flex;align-items:center; gap:6px;text-decoration:none;}
.hd-top-right .hd-top-menu li a:hover {text-decoration:underline;}
.hd-top-right .hd-top-menu li i { color:#fff;}

/*헤더 유틸 - 교내주요사이트 바로가기*/
.hd-top .fsitelink {z-index:101; display:inline-block; position:relative; box-sizing:border-box; text-align: left; ;}
.hd-top .fsitelink:first-child{margin-right:10px;}
.hd-top .fsitelink:last-child {margin:0}
.hd-top .fsitelink .tit a {display:block;position:relative; color:#fff; padding-right:30px; padding-left:10px; font-size:16px;font-weight:300;white-space:nowrap;letter-spacing:-.05em; line-height:55px;}
.hd-top .fsitelink .tit a:hover, #footer-wr .fsitelink-wr .fsitelink .tit a:active, #footer-wr .fsitelink-wr .fsitelink .tit a:focus { text-decoration: none; }
.hd-top .fsitelink .tit a .gogo {/* display:block;*/ display:none; position:absolute;box-sizing:border-box;right:0;top:0;height:100%;color:#4b403a;background:#fff;font-weight:500;line-height:1;padding-right:50px;}
.hd-top .fsitelink .tit a:after {content:"";display:block;position:absolute;/* right:50px;*/ right:0;top:50%;transform:translateY(-50%); background:url(/resources/custom/images/main/common/ico-plus.png) no-repeat 0px 0;width:15px;height:15px;transition:all .3s ease}
.hd-top .fsitelink .tit{background:none; padding-left:0; margin-bottom:0;}
.hd-top .fsitelink.is-open .tit a:after {transform:rotate(180deg);margin-top:-7px}
.hd-top .fsitelink .fsitelink-cate-box {position:absolute;top:100%;right:0;/*background:#000;*/background: linear-gradient(180deg, #18589b 0%, #081f59 100%);width:240px;height:0;overflow:hidden;box-sizing:border-box;transition:all .3s ease; display:none;}
.hd-top .fsitelink.is-open .fsitelink-cate-box {display:block;height:261px;overflow-y:auto;border:1px solid #fff;border-bottom:0}
.hd-top .fsitelink .fsitelink-cate-box .inwr {height:240px;margin:10px;box-sizing:border-box}
.hd-top .fsitelink .fsitelink-cate-box ul {margin:0px 10px}
.hd-top .fsitelink .fsitelink-cate-box li {margin:1px 0}
.hd-top .fsitelink .fsitelink-cate-box li a {display:block;padding:2px 0; color:#fff;}
.hd-top .fsitelink .fsitelink-cate-box li a span {font-size:14px;color:#bfa89c;transition:all .3s ease}
.hd-top .fsitelink .fsitelink-cate-box li a:hover span,
.hd-top .fsitelink .fsitelink-cate-box li a:focus span,
.hd-top .fsitelink .fsitelink-cate-box li a:active span {text-decoration:underline;color:#fff} 

.hd-bottom{border-bottom:1px solid rgba(255,255,255,.3);}
.hd-bottom .ico-on{display:none;}
.hd-bottom .fix-layout{display:flex; align-items:center;}
.hd-bottom nav{flex:1; margin-left:300px; margin-right:30px;}

/*header-on 됐을때*/
#pc_header.lnb-on .hd-bottom{background:#fff;}
#pc_header.lnb-on #gnb > ul > li > a span{color:#222}
#pc_header.lnb-on .hd-bottom .ico-on{display:block;}
#pc_header.lnb-on .hd-bottom .ico-default{display:none;} 
#pc_header.lnb-on .hd-bottom-util .open-search-btn{width:20px; height:20px; background:url(/resources/custom/images/main/common/ico-search-on.png);}
#pc_header.lnb-on .hd-login-info a{color:#000;}

/*header fixed 됐을때*/
#pc_header.fixed {position:fixed; left:0; top:0; width:100%; box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);}
#pc_header.fixed .hd-top{display:none;}
#pc_header.fixed .hd-bottom{background:#fff;}
#pc_header.fixed #gnb > ul > li > a span{color:#222}
#pc_header.fixed .hd-bottom .ico-on{display:block;}
#pc_header.fixed .hd-bottom .ico-default{display:none;} 
#pc_header.fixed .hd-bottom-util .open-search-btn{width:20px; height:20px; background:url(/resources/custom/images/main/common/ico-search-on.png);}
#pc_header.fixed .hd-login-info a{color:#000;}
#pc_header.fixed #gnb .gnb-sub-box{top:91px;}

/*GNB Menu Style*/
#gnb {float: none;  margin-left: auto; margin-right: 0; z-index:1; text-align:center;}
#gnb > ul {padding: 0; margin: 0; display:flex;}
#gnb > ul > li {width: calc(100% / 6); text-align: center; display:inline-block; vertical-align:middle;}
#gnb > ul > li > a {width:100%; z-index:10; position: relative; font-size: 18px; text-align: center;  display: inline-block; color: #666; font-weight: 500; letter-spacing: -1px; text-decoration:none;}
#gnb > ul > li > a span {color:#fff; word-break:keep-all; font-weight:500; font-size:20px; line-height:90px;}
#gnb > ul > li > a:after {position:absolute; left:50%; content:""; display:block; bottom:0; right:0; width:0;  opacity:0.2;}
#gnb > ul > li.on > a:after {bottom: 0;left: 0; width:100%; height: 4px; background: #2159b9; content: ""; opacity: 1; display: block; transition: all .3s ease;}
#gnb > ul > li.on > a:before {content:""; display:block; background-color:#121212; left:0; bottom:0; position:absolute;}
#gnb > ul > li.on > a, #gnb li a:hover {color: #fc9b5c;}
#gnb .open.has-sub-menu:after {content: "";}

/*gnb-sub-box*/
#gnb .gnb-sub-box {min-height:200px; text-align:left;  position: absolute; top: 145px; left: 0; width: 100%; background:rgba(255,255,255,1); background-repeat: repeat; background-size: contain; z-index: 5; border-top:1px solid #ccc; display:none;}
#gnb .gnb-sub-box > .fix-layout {padding:50px 12px; align-items: stretch; gap:40px;}
#gnb .gnb-left-box{width:280px; background:url(/resources/custom/images/main/common/gnb-left-box-bg.png)#18589b no-repeat right 105%; padding:30px 40px; height: 300px; /* 원하는 고정 높이 */flex-shrink: 0; /* 줄어들지 않게 */}
#gnb .gnb-left-box .gnb-since-title{font-family:'Gmarket'; font-size:20px; color:#fff; }
#gnb .gnb-left-box .gnb-sub-title{font-size:17px; font-weight:600; margin-top:16px; margin-bottom:24px; color:#fff; word-break:keep-all;}
#gnb .gnb-left-box .gnb-title{font-size:32px; font-weight:600; color:#fff; padding-top:15px; position:relative;}
#gnb .gnb-left-box .gnb-title:after{content:""; display:block; width:30px; height:1px; background:#fff; position:absolute; left:0; top:0;}
#gnb .gnb-sub-wrap{flex:1;}
#gnb .gnb-sub-wrap .gnb-sub{display:flex; gap:25px; flex-wrap:wrap;}
#gnb .gnb-sub-wrap .gnb-sub > li {width:calc((100% - 100px) / 5);text-align: left;}
#gnb .gnb-sub-wrap .gnb-sub > li:hover > a {background:#2159b9; color:#fff;}
#gnb .gnb-sub-wrap .gnb-sub > li > a {font-size:18px; color:#000; margin-right: 2px; display:flex; align-items: center; height:45px; padding: 0px 12px 0px 22px; width:100%; background:#f3f3f3; border:1px solid #e9e9e9 ; font-weight: 500;}
/* 2025-07-31 추가 */
#gnb .gnb-sub-wrap .gnb-sub > li > a[target="_blank"]::after{ content: ""; flex-shrink: 0; /* flex로 줄어들지 않게 */width: 14px; height: 14px;margin-left: 6px; background: url('/resources/custom/images/main/common/ico_nw.png') no-repeat center;background-size: contain; display: inline-block;}
#gnb .gnb-sub-wrap .gnb-sub > li:hover > a[target="_blank"]::after { background: url('/resources/custom/images/main/common/ico_nw_on.png') no-repeat center; background-size: contain;}
/* 2025-07-31 추가 끝 */
#gnb .gnb-sub-wrap .gnb-sub > li ul{padding-left:24px;margin-top:10px;}
#gnb .gnb-sub-wrap .gnb-sub > li ul li{margin-top:12px}
#gnb .gnb-sub-wrap .gnb-sub > li ul li a {color:#4c4c4c; padding-left:22px; position:relative; font-weight: 500; display: block; word-break: keep-all;}
#gnb .gnb-sub-wrap .gnb-sub > li ul li a:after {content:""; display:block; width:6px; height:1px; border-radius:12px; background-color:#4c4c4c; top:50%; left:0; position:absolute; transform:translateY(-50%);}
#gnb .gnb-sub-wrap .gnb-sub > li ul li a:hover {color: #2159b9; text-decoration: underline;}
#gnb .gnb-sub-wrap .gnb-sub > li ul li a:hover:after {background-color: #2159b9; /* 아이콘 색상도 맞춤 */}
/*3뎁스 이후로 숨기기*/
#gnb .gnb-sub-wrap .gnb-sub .gnb-sub-depth ul{display:none;}


/*util-menu Style*/
.hd-bottom .hd-bottom-util{display:flex; gap:16px;}
.hd-bottom .hd-bottom-util .m-open{display:none; }
.hd-bottom .hd-bottom-util .open-search-btn{width:24px; height:24px; background:url(/resources/custom/images/main/common/ico-search.png) no-repeat center; cursor:pointer; text-indent:-9999px;}
.hd-bottom .hd-bottom-util .open-search-btn button:focus{outline:-webkit-focus-ring-color auto 1px;}
.hd-bottom .hd-bottom-util .open-search-btn button{text-indent:-9999px; border:none; outline:none; width:100%; height:100%; background:none;}
.hd-bottom .hd-bottom-util .hd-login-info{display:flex; gap:12px;}
.hd-bottom .hd-bottom-util .hd-login-info a{color:#fff;}

/*Mobile-memnu Style*/
#m_gnb {display: none;}
#m_header {display: none; transition: all .5s;}

/*구글 번역기 커스텀 css*/
#google_translate_element{border-radius:30px; overflow:hidden;}
/*접근성할때 풀어야함*/
#google_translate_element .goog-te-gadget-simple > span{display:none;}


/*E : 웹 끝*/

/***********
반응형시작
***********/
@media all and (max-width: 1600px) {
		#gnb .gnb-sub-wrap .gnb-sub > li ul{padding-left:0;}
}
@media all and (max-width: 1500px) {
		.hd-bottom nav{margin:0 50px;}
}
@media all and (max-width: 1400px) {
		#gnb .gnb-left-box{display:none;}
}
@media all and (max-width: 1200px) {
	.hd-bottom{padding:20px 0;}
	.hd-bottom .hd-bottom-util .m-open{display:block; }
	.hd-bottom .hd-bottom-util .siteMap{display:none; }
	.hd-bottom .fix-layout{justify-content: space-between;}
	 #gnb , .hd-bottom nav{display: none;}
	 .hd-top-right .hd-top-menu { display:none;}
		
	#m_header{position:absolute; top: 0; right: 0;  background: rgba(0,0,0,.3); z-index: 9999;width:100%; height:100%; display:none;}
    #m_header .side{display:block; width:95%; max-width:500px;  position:fixed; background:#fff; height:100vh; z-index: 1; right:0; overflow-y:scroll; }
    #m_header .side h1{padding:30px 12px;         background: #fff;}
    #m_header .side h1 img{max-width:200px}
    #m_header .side-close{position:absolute; top:16px; right:16px;}
    #m_header .mh-util{display:flex; flex-wrap:wrap;}
    #m_header .mh-util a{width:50%; line-height:50px; color:#fff; font-family:'Gmarket'; font-weight:300; text-align: center;}
    #m_header .mh-util .m-login-btn{background:#24529f}
    #m_header .mh-util .m-search-btn{background:#1868cb;}
	#m_header .mh-util .m-copy-btn{background:#007c3c}
    #m_header .mh-util .m-office-btn{background:#c40d18;}
	#m_header .mh-util a:nth-child(3):last-child {width: 100%;}
	
    
    /*모바일 메뉴 스타일*/
    #m_header .gnb-left-box{display:none;}
    #m-gnb{position:relative; z-index:1; display:flex; min-height: 100vh;}
    #m-gnb  > ul {background:#1e3152;}
    #m-gnb .gnb-title{display:none;}
    
    /*모바일 메뉴 > 원뎁스*/
    #m-gnb  > ul > li{width:130px; }
     #m-gnb  > ul > li.no-submenu > a{background:url(/resources/custom/images/main/common/ico-link.png)no-repeat calc(100% - 12px) center;}
    #m-gnb  > ul > li > a{font-family:'Gmarket'; padding:20px 12px; display:block; position:relative; border-bottom: 1px solid rgba(255,255,255,.5);}
    #m-gnb  > ul > li > a > span{font-family:'Gmarket'; font-weight:300; color:rgba(255,255,255,.5);}
    #m-gnb  > ul > li.on > a > span{color:rgba(255,255,255,1);}
    /*모바일 메뉴 > 서브 뎁스*/
    #m-gnb .gnb-sub-wrapper{flex:1;}
    #m-gnb .gnb-sub-box{display:none}
    #m-gnb .gnb-sub-box.show{display:block !important; position:absolute; left:130px; top:0; width:calc(100% - 140px); background:#fff;}
    #m-gnb .gnb-sub-box .gnb-sub > li > a{font-family:'Gmarket'; display:block; padding:20px 4px 20px 22px; font-weight:300; 
     border-bottom:1px solid #ddd; background:url(/resources/custom/images/main/common/ico-more.png)no-repeat calc(100% - 12px) center;}
     #m-gnb .gnb-sub-box .gnb-sub > li.no-submenu > a{background:none;}
    #m-gnb .gnb-sub-box .gnb-sub-depth{padding-left:20px; margin-top: 10px; margin-bottom: 10px; display: none;}
    #m-gnb .gnb-sub-box .gnb-sub-depth.show{display:block;}
    #m-gnb .gnb-sub-box .gnb-sub-depth li {margin-bottom:2px; margin-bottom:4px;}
    #m-gnb .gnb-sub-box .gnb-sub-depth li a{font-family:'Gmarket'; font-size:15px; font-weight:300; color:#929292;}
    #m-gnb .gnb-sub-box .gnb-sub-depth li ul{display:none;}
 }

@media all and (max-width:767px){
		.hd-top .hd-top-slogan{display:none;}
		.hd-top .con{justify-content:end;}
}
@media all and (max-width:500px){
		.hd-bottom h1 img{max-width:180px;}
}

.hd-search-box{position:absolute; top:100%; left:50%; transform:translateX(-50%); z-index:5; width:100%; background-color:#f4f7fa; height:190px; display:none;}
.hd-search-box.open{display:block;}
.hd-search-box form{    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;}
    .hd-search-box fieldset{
        display: block;
    height: 80px;
    max-width: 800px;
    width: 100%;
    position: relative; border:none;}
    .hd-search-box #searchHeaderText{
        display: block;
    width: 100%;
    height: 100%;
    padding: 0 45px 0 34px;
    margin: 0;
    float: none;
    line-height: 1.3;
    font-size: 20px;
    color: #101010;
    background-color: #fff;
    border-radius: 8px;
    border: 1px solid #ededed;
    }
.hd-search-box input[type="submit"]{    
    position: absolute;
    right: 35px;
    top: 50%;
    transform: translateY(-50%);
        background-image:url(/resources/custom/images/main/common/ico-search-on.png);
    width: 25px;
    height: 25px;
    background-repeat: no-repeat;
    background-position: center;
    font-size: 0;
    background-color: rgba(0, 0, 0, 0);
    margin: 0;
    padding: 0;
    transition: all .3s;
    background-size: cover;
}
.hd-search-box .search-close{position: absolute;
    left: calc(50% + 494px);
    top: 50%;
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    background-position: center;
    background-size:40px 40px;
    background-image:url(/resources/custom/images/main/common/close.png);
    background-color: rgba(0, 0, 0, 0);
    border: none;
    padding: 0;
    font-size: 0;
    margin-top: -20px;
    transition: all .3s;
    background-size: 24px auto;
    }
    
    @media all and (max-width:1200px){
     .hd-search-box form{justify-content: left; padding-left:12px;}
    .hd-search-box fieldset{    width: calc(100% - 95px); max-width:unset;}
    .hd-search-box .search-close{right:30px; left:auto;}
    }
    @media all and (max-width:500px){
    .hd-search-box form{padding: 0 12px;}
    .hd-search-box #searchHeaderText{padding: 0 10px 0 10px;}
    .hd-search-box fieldset{width: 100%;}
    .hd-search-box .search-close{right:10px; top:30px;}
    .hd-search-box input[type="submit"]{right:10px;}
    }
