/* 메인메뉴 공통 */
#category-wrap{width:100%;clear:both;background-attachment:scroll;position:relative;z-index:3}
#gnb h2{display:none}
#gnb *{padding:0;list-style:none}
#gnb{position:relative;margin:0;z-index:5;background-repeat:no-repeat;background-position:center top;width:100%;box-sizing:border-box;background-color:transparent}
#gnb .logo{height:80px;line-height:80px}
#gnb img{border:0;width:100%}
#gnb a{display:inline-block}
#gnb .main-wrapper{display:flex;margin:0 auto;overflow:hidden;height:80px;max-width:1640px;padding:0 20px;justify-content:space-between}
#gnb .main{height:400px;background-repeat:no-repeat;background-position:center top;box-sizing:border-box;display:block;max-width:1200px}
#gnb .main>li{float:left;line-height:80px;display:inline-block;text-align:center}
#gnb .main>li>a{display:block;width:100%;font-size:18px;font-weight:400;margin:0;padding:0;letter-spacing:-.5px;color:#fff}
#gnb .main>li>ul{height:300px; padding: 20px 0;}
.gnb_bg{width:100%;position:absolute;top:88px;left:0}
#gnb .main-wrapper:hover .gnb_bg{border-top:1px solid #ddd;display:flex}
#gnb .main-wrapper .navi_bg{background-image:url(../img/menubar_bg.png);background-repeat:no-repeat;background-position:bottom left;width:288px;height:224px;float:left;margin-top:178px}
#gnb .main-wrapper .gnb_bg{border-top:1px solid #ddd}
#gnb .main>li>ul>li{line-height:45px}
#gnb .main>li>ul>li a{font-size:16px;color:#fff;font-weight:400;opacity: 0;}
#gnb .main li a img{margin-top:15px}
#gnb .main li.main_select{}
#gnb .mask{position:absolute;width:100%;height:400px;overflow:hidden;background-color:#fff;z-index:5}
#gnb .mask .sub-set-wrapper{max-width:1200px;min-height:400px;margin:0 auto;position:relative;background-image:url(../img/menubar_bg.png);background-repeat:no-repeat;background-position:110px bottom}
#gnb .sub-set{float:right;box-sizing:border-box;margin:10px auto 0}
#gnb .sub-set ul{float:left}
#gnb .sub-set ul li{height:26px;display:block;text-align:center}
#gnb .sub-set ul li a{display:block;font-size:13px;color:#555;line-height:30px;padding-top:2px;padding-bottom:2px;padding-left:0;letter-spacing:0}
#gnb .sub-set ul li a:hover{color:#9b8265;letter-spacing:0}
#gnb .mask .sub-set ul{display:inline-block;text-align:center;height:400px}
#gnb .mask .sub-set ul:hover{background-color:#09f}
#gnb .mask .sub-set .set1{float:left;width:150px}
#gnb .mask .sub-set .set2{float:left;width:150px}
#gnb .mask .sub-set .set3{float:left;width:150px}
#gnb .mask .sub-set .set4{float:left;width:150px}
#gnb .mask .sub-set .set5{float:left;width:150px}
#gnb .main .menu1{width:150px}
#gnb .main .menu2{width:150px}
#gnb .main .menu3{width:150px}
#gnb .main .menu4{width:150px}
#gnb .main .menu5{width:150px}

#category-wrap:after {content: ""; position: absolute; width: 100%; height: 1px; background: #ccc; top: 80px; opacity: 0;}
.nav-on #category-wrap:after {opacity: 1;transition: all 0.5s;}

/* 헤더 기본 상태 (메인/서브 공통) */
#header_wrap{background:unset;transition:background .5s,transform .35s ease}
#header_wrap.sub{background:unset;transition:background .5s,transform .35s ease}
#gnb .main>li>a{color:#fff}
.hd_login a{color:#fff}
#open-button .navicon-line{background-color:#fff}

/* 메뉴 호버(nav-on) 시 효과 */
#header_wrap.nav-on{background:#fff;backdrop-filter:blur(5px)}
#header_wrap.nav-on #gnb .main>li>a{color:#000;position:relative}
#header_wrap.nav-on #gnb .main>li>a:after{content: ""; position: absolute; left: 50%; bottom: -5px; width: 9px; height: 9px; background: #0a488a; transform: translateX(-50%) rotate(45deg); opacity: 0; transition: opacity .3s;}
#header_wrap.nav-on #gnb .main>li:hover>a:after{opacity:1}
#header_wrap.nav-on #gnb .main>li>ul>li a{color:#333; opacity: 1;}

/* 스크롤 시 : 흰 배경 + 검정 글씨 (hover 상관없이 유지) */
.scrolled #header_wrap{background:#fff;backdrop-filter:blur(5px)}
.scrolled #header_wrap.sub{background:#fff;backdrop-filter:blur(5px)}
.scrolled #gnb .main>li>a{color:#000}
.scrolled #gnb .main>li>ul>li a{color:#333; opacity: 1;}
.scrolled .hd_login a{color:#000}
.scrolled #open-button .navicon-line{background-color:#000}
.scrolled #open-button.on .navicon-line {background-color: #fff;}
.scrolled #header_wrap:hover{background:#fff;backdrop-filter:blur(5px)}
.scrolled #header_wrap.sub:hover{background:#fff;backdrop-filter:blur(5px)}

/* 스크롤 시 : 흰 배경 + 검정 글씨 (hover도 유지) */
.scrolled #header_wrap{background:#fff;backdrop-filter:blur(5px)}
.scrolled #header_wrap.sub{background:#fff;backdrop-filter:blur(5px)}
.scrolled #gnb .main>li>a{color:#000}
.scrolled #gnb .main>li>ul>li a{color:#333; opacity: 1;}
.scrolled .hd_login a{color:#000}
.scrolled #open-button .navicon-line{background-color:#000}
.scrolled #open-button.on .navicon-line {background-color: #fff;}
.scrolled #header_wrap:hover{background:#fff;backdrop-filter:blur(5px)}
.scrolled #header_wrap.sub:hover{background:#fff;backdrop-filter:blur(5px)}

/* 반응형 */
@media screen and (max-width:1200px){
#gnb .main{padding-right:2%}
#gnb .sub-set{padding-right:2%}
}
@media screen and (max-width:1100px){
#gnb .main-wrapper{height:80px}
#gnb .logo{height:80px;line-height:80px}
#gnb .main li{display:none}
#gnb .mask{display:none}
#gnb img{width:70%}
}