@charset "UTF-8";

/*S : 웹 시작*/
#pc_header{position:relative; }
/*팝업*/
.hd-popup-box{padding:20px 0; background:#1d3a8f; }
.hd-popup-box .hd-popup-close{position:absolute; right:50px; top:20px; background:none; z-index:1; border:none;}
.hd-popup-box .hd-popup-itm p{text-align:center; color:#fff; font-size:20px;}
.hd-popup-box .hd-popup-itm a{display:block; padding:12px 30px; background:#1aa2a4; color:#fff; border-radius:32px; position:absolute; right:200px; top:-10px;}

/*search-box*/
.hd-search-box{position:absolute; top:100%; left:0; z-index:100;/*z-index:1;*/ 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/enter/common/ico-search.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/enter/common/search_close.png);
    background-color: rgba(0, 0, 0, 0);
    border: none;
    padding: 0;
    font-size: 0;
    margin-top: -20px;
    transition: all .3s;}

/*헤더 - 사이트 링크 박스*/
.hd-con .fsitelink{background:url(/resources/custom/images/enter/common/ico-sitelink.png)no-repeat right 40%; }
.hd-con .fsitelink .tit a{padding-right:20px; font-size:18px;}
.hd-con .fsitelink .tit a:after{display:none;}
.hd-con .fsitelink .fsitelink-cate-box{top:100%;}

/*header-bottom*/
.hd-con {position: relative; top: 0; z-index: 99; width: 100%;  margin: 0 auto; border-bottom:1px solid #ddd;}
.hd-con .fix-layout{position:unset; padding:0 50px; max-width:unset; display:flex; align-items:center; gap:30px;}
.hd-con .hd-logo {display:flex; align-items:center;}
.hd-con .hd-logo a{display: inline-flex; align-items: center;}
.hd-con .hd-logo span{font-family:'Gmarket'; color:#102e88; font-size:25px; margin-left:15px;}
.hd-con .hd-logo .logo-text span {font-family: 'Gmarket'; color: #102e88;  font-size: 25px; margin-left: 15px;}
.hd-con nav{flex:1;}
.hd-con .hd-right-box{display:flex; align-items:center; gap:4px;}
.hd-con .hd-right-box a{padding:12px; display:block; color:#333;}
.hd-con .hd-right-box > ul{display:flex; align-items:center; gap:8px;}

/*변경부분*/
.hd-con .bg{width:100%; height:400px; background:#fff; position:absolute; left:0; top:99px; border-top:1px solid #e5e5e5; display:none;}

/*GNB Menu Style*/
#gnb {float: none;  margin-left: auto; margin-right: 0; z-index:1; text-align:center;}
#gnb > ul {padding: 0; margin: 0;}
#gnb > ul:after{content:""; display:block; clear:both;}
#gnb > ul > li {float:left; position:relative; width: 20%; text-align: center;}
#gnb > ul > li > a {width:100%; z-index:10; position: relative; font-size: 18px; text-align: center; line-height:70px; display: inline-block; color: #666; font-weight: 500; letter-spacing: -1px;}
#gnb > ul > li > a span {color:#222; word-break:keep-all; font-weight:500; font-size:20px; line-height:100px;}
#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: #1d3a8f; 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: #1d3a8f;}
#gnb .open.has-sub-menu:after {content: "";}

/*gnb-sub-box*/
#gnb .gnb-sub-box {position:absolute; top: 99px; left: 0; width: 100%; min-height:400px;  z-index: 5; text-align:left; padding-top:50px; display:none;}
#gnb .gnb-sub-box .gnb-title{font-size:22px; margin-bottom:50px; font-weight:600; }
#gnb .gnb-sub-box .gnb-sub {position:absolute; width:100%; }
#gnb .gnb-sub-box .gnb-sub > li {display:inline-block; width:100%; vertical-align:top; max-width: 1071px; text-align: left;}
#gnb .gnb-sub-box .gnb-sub > li:hover > a {color:#1d3a8f;}
#gnb .gnb-sub-box .gnb-sub > li > a {font-weight:500; font-size:18px; vertical-align:middle; width:100%; color:#000; padding:4px; display:block;   width:100%; line-height:1.3; margin-bottom:10px;}
#gnb .gnb-sub-box .gnb-sub > li ul li a {font-weight: 300; font-size:15px; padding-left:30px; position:relative; line-height:30px;}
#gnb .gnb-sub-box .gnb-sub > li ul li a:after {content:""; display:block; width:3px; height:3px; border-radius:12px; background-color:#121212; top:10px; left:20px; position:absolute;}

/*util-menu Style*/
.hd-con .util-menu .m-open{display:none; }

/*Mobile-memnu Style*/
#m_gnb {display: none;}
#m_header.is-active {display: block;}
#m_header {display: none; transition: all .5s;}
#m_header .side {left: 0; display: none; z-index: 101; position: relative;}
#m_header .side .top-utill {display: none;}
/*E : 웹 끝*/

/***********
반응형시작
***********/
@media all and (max-width:1800px){
		.hd-con .fix-layout{padding:0 30px;}
}
@media all and (max-width:1600px){
        .hd-con .fix-layout{padding:0 10px; gap:10px;}
       .hd-con .fsitelink .tit a {font-size:16px;}
       #gnb > ul > li > a span{font-size:18px;}
       #gnb .gnb-sub-box .gnb-sub > li > a{font-size:16px;}
       #gnb .gnb-sub-box .gnb-title{font-size:20px; word-break:keep-all; margin-bottom:24px;}
       #gnb .gnb-sub-box, .hd-con .bg{height:350px;}
}
@media all and (max-width:1400px){
		.hd-popup-box{padding:20px 12px;}
		.hd-popup-box .hd-popup-close{right:12px;}
		.hd-popup-box .hd-popup-itm p{padding-right:150px; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;text-align:left;}
		.hd-popup-box .hd-popup-itm a{right:50px;}
		
		.hd-con .fsitelink{display:none;}
		.hd-con .hd-logo span{font-size:20px; margin-left:8px;}
		
}
@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;}
		
        .hd-con .util-menu .m-open{display:block; }
    #pc_header{position: relative; top: 0;}
    .hd-con{padding:20px 0}
    .hd-con .m-open{display:block;}
    .hd-con .siteMap{display:none;}
        
    #m_header{position:absolute; top: 0; left: 0; width: 100%; background-color: #fff; z-index: 9999; overflow:hidden scroll; width:100%; height:100vh; padding-bottom:50px;}
    #m_header .side{display:block; top:50px;}
    #m_header .side .bg{ width: 100%; height: 100%; background-color:#023f8f; position:fixed; top:0; /*right:-9999px;*/ left:0;  position: fixed; z-index: 101;}
    #m_header .side .menu{position:relative;; top:0; width:100%;  width:100%; padding:0 24px; z-index: 200; ;}
    #m_header .side .menu .top-utill {padding: 0 24px;}
    #m_header .side .menu .top-utill ul li { float:left; width:33%;}
    #m_header .side .menu .bottom-utill {border-top: 1px solid #666666; border-bottom: 1px solid #666666; margin-bottom: 16px;}
    #m_header .side .menu .bottom-utill ul li a{display: block; width: 100%; padding: 12px 0 12px 20px; font-size: 16px; color:#ccc;  line-height:30px;}
    #m_header .side .side-close{ position: absolute; top: -50px; right: 0;}
    #m_header .side .side-close a{font-size: 22px; width: 50px; height: 50px; position: absolute; right: 0; top: 0; color: #f5f5f5; line-height: 50px; text-align: center; background: url(/resources/custom/images/hrc/common/close.png) no-repeat center;}
   
    #m_header .utill{margin-top:24px; padding-bottom:50px;}
    #m_header .utill li{display:inline-block;}
    #m_header .utill a{font-size:18px; font-weight:600; text-decoration:underline; color:#333;}
    
    #tnb,
    #gnb {display: none; width: 320px;}
    
    #m-gnb{position:relative; z-index:102; text-align:center;}
    #m-gnb .gnb-sub-title{display: none;}
    #m-gnb .gnb-title-sub{display: none;}
    #m-gnb > ul > ul> li .gnb-sub-box{ display: none; border-bottom: 1px solid  #ddd;}
    #m-gnb > ul > li .gnb-sub-box .gnb-left-box{display:none;}
    #m-gnb .fix-layout{height:auto; padding:0;}
    #m-gnb > ul > li > .gnb-sub-box{display:none;}
    
    #m-gnb > ul > li .th1 {display:block; border-bottom: 1px solid  #ddd;transition:all 0.3s; color:#fff; padding:24px 12px; text-align:left; background: url(/resources/custom/images/hrc/common/mobile_more.png) no-repeat right center;}
    #m-gnb > ul > li .th1 > span {font-size: 22px; color: #fff; font-weight:bold;}
    /*#m-gnb > ul > li.on .th1 > span {color: #ed1c24;}*/
    #m-gnb > ul > li .th2{ color:#313131;/*color: #fff;*/ display: block; height:50px; line-height:50px; width: 100%; background-color:#fff; font-size:16px; padding:0 16px; text-align:left;}
    #m-gnb > ul > li .th2 > span, #m-gnb > ul > li .th2 > a{color: #313131;}
    #m-gnb .gnb-sub-depth{padding:0 12px;}
    #m-gnb > ul > li .th2 > span, #m-gnb > ul > li .th3 > a{color:#fff; text-align:left; padding-left:20px; position:relative; width:100%; display:block;}
    #m-gnb > ul > li .th2 > span, #m-gnb > ul > li .th3 > a:after{content:""; display:block; width:3px; height:3px; border-radius:32px; background:#fff; position:absolute; top:15px; left:0;}
    
    #m-gnb .gnb-sub-box .m1{display: none;}
    .header_con .login-menu{display: none;}
    
    .header_con{padding:12px 20px;}
    .header_con h1{margin-top:0;}
    .header_con h1 a img{width:unset;}
    .header_con .util-menu{margin-top:9px; }
    .header_con .util-menu .m-open{display:inline-block; text-align:center;}
    .header_con .util-menu .siteMap{display: none;}
    #m-gnb .gnb-sub-depth a{width:100%; line-height:40px;}
 }
@media all and (max-width: 767px){
   .hd-popup-box .hd-popup-itm a{padding:10px 14px; }
   .hd-popup-box .hd-popup-itm p{padding-right:200px; font-size:16px;}
		
    .hd-con h1 span{font-size:18px;}
    .hd-con h1 a img{width:150px;}
    .hd-con h1 span{margin-left:4px; font-size:18px;}
    
    .header_top .link-area{display:none;}
    .hd-con > .fix-layout{gap:0;}
    
}
@media all and (max-width: 500px){
		.hd-con .hd-right-box a{padding:4px;}
		.hd-con .hd-logo span{margin-left:4px; font-size:14px;}
		.hd-con .hd-logo .logo-text span { margin-left:4px; font-size:14px;}
}