@charset "UTF-8";
/*****************************************************************

Copyright C 그누위즈 테마 All rights reserved.
gnuwiz@naver.com & master@gnuwiz.com
본 페이지는 유료콘텐츠 그누위즈 테마 CSS입니다. 불법복제시 법적인 제제를 받으실 수 있습니다.
라이센스를 삭제하지 마세요. 라이센스 삭제시 불법 사용으로 간주될 수 있습니다.

******************************************************************/

#hd{width:100vw;transition: all 0.3s ease;position: fixed;left: 0;top: 0;background:rgba(255,255,255,.8);border-bottom: 1px solid #e8e8e8;z-index: 300;  -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);}
#hd_wrapper {position:relative;margin:0 auto;width: calc(100vw - 80px);zoom:1}
#hd_wrapper .gnb-container{height:100px;}
#mob-gnb,#menu-btn{display: none;}
.logo{z-index: 100;width:300px;height:40px;transition: all .3s;}
#logo > a {position: relative;width: 100%;height: 100%;display: block;}
#logo > a > img {position: absolute;top: 50%;left: 0;transform:translateY(-50%);}
.hd_login{position:absolute;top:50%;right:80px;transform:translateY(-50%);text-transform: uppercase;font-size: 14px;transition: all .3s;}
.hd_login li {float:left;margin:0 5px;line-height:13px}
.hd_login li:first-child {border-left:0}
.hd_login li> a {display: block;padding: 10px;border-radius: 5px;}
.hd_login li.login > a{color: #000;background: #fff;border: 1px solid #000;}
.hd_login li:last-child > a {color: #fff;background: #000;border: 1px solid #000;}
.hd_login a{color: #222;}
.hd_login a.btn-exchange {border-radius: 5px; padding:12px; background: #E1EDFF; color:#0E6EFF;}

/*1차메뉴*/
#gnb{position:relative;display:flex;align-items:center;place-content:center;height: 100%;box-shadow: 0 15px 10px rgba(34, 34, 34, .02);}
#gnb .gnb_wrap > ul{display: flex;height: 100%;}
.gnb_1da{padding: 0;}
#gnb .gnb_1dli{padding: 22px 20px;display: flex;place-content: center;align-items: center;flex: 1;text-align: center;}
.gnb_1dli.gnb_al_li_plus .gnb_1da{padding:0;transition: all .3s;}
.gnb_1dli.active .gnb_1da{color:var(--main-color);}
#gnb .gnb_1dli:hover > a {color:var(--main-color);}
#gnb .hassub:after {font-family:xeicon;content: "\e942";display: block;color:#666;margin-left: 10px;font-weight: 600;transition: all 1s cubic-bezier(0.19, 1, 0.22, 1);}
.gw-side-menu-container01 > [class*="gw-side-menu-depth"] > button{border-radius: 50px;}


/*2차메뉴*/
#gnb .gnb_wrap {margin:0 auto;position:relative;width: 60%;height: 100%;}
.gnb_2dul {display:none;position:absolute;top:100px;min-width:100%;background: #fff;text-align: left;font-size:14px;opacity: 0;visibility: hidden;transition: all .3s cubic-bezier(0.19, 1, 0.22, 1);}
.gnb_2dul .gnb_2dul_box {border:1px solid #eee;padding:14px 0;}
.gnb_2dli{padding: 0 14px;}
.gnb_2da {display:block;padding:0 14px;line-height:40px;border-radius:5px;color:#666;font-family:"NotoKr_M", sans-serif;transition: all .3s;}
a.gnb_2da:hover {color:#000;background:#f8f8f8;}

/*gnb_1dli 마우스를 올렸을 때*/
#gnb .hassub.on:after{transform: rotate(180deg);transform-origin: center;color: var(--main-color);}

/*2차 메뉴 활성화*/
.gnb_2dul.show{display:block;opacity: 1;visibility: visible;}


.dropdown-container {width: 50px; float:right; top:20px; position: absolute; right:10px; }
.dropdown-btn {width: 100%; cursor: pointer; padding: 0.8em 0 1em 0; border: 0 none; display: flex}
.dropdown-btn i {font-size:25px; padding-right:10px;}
.dropdown-menu {display: none; background: #fff; width: 100px; overflow: hidden; position: absolute;}
.dropdown-menu ul {list-style-type: none; margin: 0; padding: 0; }
.dropdown-menu ul li {border-bottom: 1px solid aliceblue;}
.dropdown-menu ul li > * {padding: 0.5em 1em;}
.dropdown-menu ul li h2 {margin: 0;font-size: 1.1em;}
.dropdown-menu ul li a {width: 100%; display: block;}
.dropdown-menu ul li a:hover {background: #ededed;}




/*다크모드*/
body.dark-mode #hd{background: #111;border-bottom:1px solid #222;}
body.dark-mode #gnb{background: #111;}
body.dark-mode #gnb_all:before{background: #111;}
body.dark-mode .gnb_1da{color:rgba(255, 255, 255, 0.6);}
body.dark-mode  #gnb .gnb_1dli:hover > a {color:rgba(255, 255, 255, 1);}
body.dark-mode .gnb_1dli.active .gnb_1da{color:rgba(255, 255, 255, 1);}
body.dark-mode #gnb_all .gnb_al_li li a:hover{color:#fff;}
body.dark-mode .hd_login li.login > a{color:#fff;border:1px solid rgba(255,255,255,0.5);background:#111;}
body.dark-mode .hd_login li:last-child a{color:rgba(255, 255, 255, 0.6);background:#333;border: 1px solid #333;}
body.dark-mode  #gnb .hassub.on:after{color: #fff;}
body.dark-mode .gnb_2dul{background: #111;}
body.dark-mode .gnb_2dul .gnb_2dul_box{border:1px solid #222;}
body.dark-mode a.gnb_2da:hover{color:#fff;background: #333;}