#header {position: fixed; left: 0; top: 0; width: 100%; height: 100px; background: #fff; z-index: 10; transition: .3s; min-width: 1300px;}

#header .hd_wrap { position:relative; margin:0 auto; max-width: 1920px; height: 100%; }
#header .bg-area {position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; z-index: -1;}
#header .bg-area .bg {height: 100%;}
#header .bg-area .bg-left {/* width: calc(50% + 750px); *//* background: #fff; */}
#header .bg-area .bg-right {/*width: calc(50% - 750px);*//* background: #15320c url("../img/header_ptn.png"); */}
#header .header-inner {/* max-width: 1700px; */height: 100%;/* margin:0 auto; *//* display: flex; *//* justify-content: space-between; */position: relative; /* z-index: 10; *//* align-items: center; */}

#header .logo {position: absolute; left: 110px; top: 50%; transform: translateY(-50%);}
#header .logo a {display: block;}
#header .logo a::before {content: ''; display: inline-block; width: 151px; height: 56px; background: url("../img/logo.png") no-repeat center; vertical-align: top; transition: .3s;}
#header .group-flex {display: flex; align-items: center; height: 100%; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
#nav {position: relative; display: flex; align-items: center; height: 100%; margin-right: 300px;}
#nav .gnb {display: flex; height: 100%;}
#nav .gnb > li {position: relative; text-align: center;}
#nav .gnb > li + li {margin-left: 75px;}
#nav .gnb > li > a {font-size: 19px; color: #525659; height: 100%; display: flex; align-items: center; transition: color .3s;}
#nav .gnb > li > a::after {content: ''; position: absolute; bottom: -1px; left: 50%; transform: translateX(-50%); width: 0; height: 2px; background-color: #2f4820; transition: .3s;}
#nav .gnb > li > a:hover::after {width: 140%;}
/* #nav .gnb > li > a.active::after {width: 120px; background-color: #e50050;} */

/*child_menu*/
#nav .gnb .lnb {position: absolute; left: 0; top: 100%; width: 100%; display: none; justify-content: center;}
#nav .gnb .lnb li a {display: flex; align-items: center; white-space: nowrap; font-size: 16px; font-weight: 300; line-height: 70px; color: #8a9293; transition: .3s;}
#nav .gnb .lnb li + li a {padding-left: 80px;}
#nav .gnb .lnb li:hover a {color: #2f4820;}
/* #nav .gnb .lnb li a.active {color: #e50050;} */

.lnb-bg {position: absolute; left: 0; top: 100%; width:100%; height: 70px; background: #fff; border-top: 1px solid #ddd; box-shadow: 0 8px 20px rgb(0 0 0 / 5%); z-index: -1; display: none;}

#header .lang-list {display: flex; width: 203px; justify-content: center; background: #15320c url(../img/header_ptn.png); height: 100%; position: absolute; right: 0; top: 0; align-items: center;}
#header .lang-item + .lang-item {margin-left: 25px;}
#header .link-lang {font-size: 15px; font-weight: 300; color: rgba(255, 255, 255, 0.5);letter-spacing: -0.23px; border-bottom: 1px solid transparent; padding-bottom: 5px;}
#header .link-lang:hover {color: #fff;}
#header .link-lang.selected {border-bottom-color: #fff; color: #fff;}
/* hidden-nav */
.toggle-btn {display: block; cursor: pointer; position: relative; margin-left: 95px;}
.toggle-btn::before {content: ''; display: inline-block; width: 23px; height: 18px; background: url("../img/menu_icon.png") no-repeat center; vertical-align: top; transition: .3s;}
/* .toggle-btn span {display: block; background: #000; width: 23px; height: 2px; transition: 250ms;} */
/* .toggle-btn span:nth-child(2) {margin: 5px 0;} */
.close-btn {position: absolute; right: 50px; top: 60px; cursor: pointer;}
.close-btn span {display: block; background: #e50050; width: 32px; height: 2px; border-radius: 3px; transition: 250ms;}
.close-btn span:nth-child(1) {margin-top: 0; margin-bottom: -0; transform: rotate(45deg);}
.close-btn span:nth-child(2) {transform: rotate(45deg); display: none;}
.close-btn span:nth-child(3) {margin-top: -2px; transform: rotate(135deg);}

.hidden-nav-box {position: fixed; left: 0; top: 0; width :100%; height: 100%; background: rgba(0, 0, 0, .7); z-index: 20; display: none;}
.hidden-nav {position: fixed; right: -640px; top: 0; width: 540px; height: 100vh; background: #fbfbfb; text-align: left; padding: 160px 70px 70px 70px; z-index: 30;}
.hidden-nav .hidden_gnb {width: 100%;}
.hidden-gnb > li {position: relative; margin-bottom:50px;}
.hidden-gnb > li > a {position: relative; display: block; max-width:240px; font-family: 'NanumSquareBold'; font-size: 26px; color: rgba(0, 0, 0, .5) !important; transition: .3s;}
.hidden-gnb > li > a:hover, .hidden-gnb > li > a.active {color: rgba(0, 0, 0, 1) !important;}
.h-lnb {position: absolute; left: 230px; top: 4px; z-index: 2; display: none;}
.h-lnb li {margin-bottom: 25px;}
.h-lnb li a {font-family: 'NanumSquare',sans-serif; font-size: 18px; font-weight: 400; color: #707070; border-bottom: 2px solid transparent; padding: 2px 0; white-space: nowrap; transition: .3s;}
.h-lnb li a:hover {padding: 2px 15px; color:#e50050; border-bottom: 2px solid #e50050;}

/* scrolled and hover */