.header{position: fixed;left: 0;top: 0;padding:1.25rem 0;z-index: 999999;width: 100%;}
.header .header_wrap{display: flex;justify-content: space-between;align-items: center;width: calc(100% - 40px);margin: auto;max-width:1700px;position: relative;z-index: 99999999;}
.header .logo a{display: block;}
.header .logo img{filter: brightness(0) invert(1);}
.header .navbar > ul{display: flex;}
.header .navbar > ul > li{position: relative;}
.header .navbar > ul > li > a{color: #fff;font-size: 1.1875rem;font-weight: 700;line-height: 16px;letter-spacing: -.34px;padding: 1.25rem 2.5rem;position: relative;text-align: center;display: block;transition: all 0.3s;text-transform:capitalize }
html[lang="en"] .header .navbar > ul > li > a{text-transform:capitalize !important}
html[lang="en"] .header .navbar > ul > li div li a{text-transform:capitalize !important}
.header .navbar a{position: relative;z-index: 9;text-transform: uppercase;}
.header .navbar > ul > li div{position: absolute;left: 50%;top: 100%;transform: translateX(-50%);width: 100%;overflow: hidden;display: none;z-index: 99;padding:40px 20px 20px 20px;min-width: 180px;}
.header .navbar > ul > li div li a{display: block;padding: 5px 2px;color: #000; text-align: center;font-size: 1rem;font-weight: 400;line-height: 140%;;transition: all 0.3s;letter-spacing: -0.0313rem;}
.header .navbar > ul > li div li a:hover{color: var(--primary);}
.header .header_controls{display: flex;gap: 24px;align-items: center;}
.header .header_controls .lang_area{position: relative;}
.header .header_controls .lang_btn{color: #FFF;font-family: "Noto Sans KR";font-size: 0.875rem;position: relative;padding-right: 25px;}
.header .header_controls .lang_btn:after{content: '';display: block;width: 12px;height: 8px;background: url(../../images/common/ico_arrow.svg) no-repeat center;position: absolute;right: 0;top: 50%;transform: translateY(-50%);}
.header .header_controls .lang_btn.active:after{transform: rotate(180deg) translateY(50%);}
.header .header_controls .lang_list{position: absolute;left: 50%;transform: translateX(-50%);top: calc(100% + 5px);background: #fff;width: calc(100% + 20px);border-radius: 5px;display: flex;flex-direction: column;overflow: hidden;display: none;border: 1px solid #000;}
.header .header_controls .lang_list li{font-size: .8125rem;color: #000;}
.header .header_controls .lang_list li a {display: block;padding: .3125rem .625rem;}
.header .header_controls .lang_list li:hover{background: var(--primary);color: #fff;}
.header .header_controls .m_menu{width: 35px;height: 35px;display: flex;align-items: center;justify-content: center;background: var(--primary);gap: 4px;border-radius: 50%;flex-direction: column;position: relative;}
.header .header_controls .m_menu span{width: 18px;background: #fff;height: 2px;transition: all 0.3s;}
.header .header_controls .m_menu.active span{width: 21px;}
.header .header_controls .m_menu.active span:nth-child(2){display: none;}
.header .header_controls .m_menu.active span:nth-child(1){transform: rotate(45deg);position: absolute;}
.header .header_controls .m_menu.active span:nth-child(3){transform: rotate(-45deg);position: absolute;}
.header.all_menu .logo img{filter: none;}
.header.open{background: #fff;}
.header.open .logo img{filter: invert(1);}
.header.open .header_controls .lang_btn,
.header.on .header_controls .lang_btn{color: #000;}
.header.on .header_controls .lang_btn:after,
.header.open .header_controls .lang_btn:after,
.header.sub_menu .header_controls .lang_btn:after{background: url(../../images/common/ico_arrow_on.svg) no-repeat center;}
.header.on{background: #fff;}
.header.on .navbar > ul > li > a{color: #000;}
.header .nav_bg {position: absolute; left: 0; top: 100%; width: 100%; height: 0;  z-index: 1; overflow: hidden; opacity: 0; pointer-events: none;background: url(../../images/common/gnb_bg.svg) no-repeat left 3% bottom #fff;border-bottom: 1px solid #DEDCDF;border-top: 1px solid #DEDCDF;}
.header.open:after{content: '';width: 100%;height: 1px;background: #dedcdf;left: 0;top: 96px;position: absolute;}
.header.open .nav_bg{ opacity: 1; transition: height 0s ease-in-out, opacity 0.2s ease-in-out;}
.header.on .logo img,
.header.open .logo img,
.header.sub_menu .logo img{filter: none}
.header.open .navbar > ul > li:hover > a,
.header.open .navbar > ul > li:active > a{color: var(--primary);}
.header.open .navbar > ul > li:hover div{display: block;}
.header.open .navbar > ul .dapth_menu{display: block !important;}
.header.open .navbar > ul > li > a{color: #000;}
.header.open .header_controls .lang_btn{color: #000;}

.header .navbar > ul > li.is-active > a{color: var(--primary) !important;}
/* 서브메뉴 */
.header.sub_menu{background: #fff;position: relative;border-bottom: 1px solid #dedcdf;}
.header.sub_menu .navbar > ul > li > a{color: #000;}
.header.sub_menu .header_controls .lang_btn{color: #000;}

.header.all_menu .navbar{display: none;}
.site_map{position: fixed;width: 100%;height: 100vh;top: 0;right: 0;z-index: 9999;background:#fff;transition: all 0.3s;display: none;}
.site_map > ul{display: flex;justify-content: space-between;max-width: 1420px;width: calc(100% - 40px);margin: 9.375rem auto 0 auto;}
.site_map > ul > li{position: relative;}
.site_map > ul > li > * {text-align: center;}
.site_map > ul > li > *:not(div){text-align: center;}
.site_map > ul > li > *:not(div):after{content: '';display: block;width: 30px;height: 3px;background: var(--primary);margin: 20px auto;transition: all 0.3s;}
.site_map > ul > li:hover > *:not(div):after{width:100%}
.site_map > ul > li > *:first-child{text-align: center;font-size: 1.625rem;font-weight: 600;margin-bottom: 20px;display: block;}
.site_map > ul > li .dapth_menu li a{display: block;padding: 10px;font-size: 1.125rem;color: var(--gray-500);}
.site_map > ul > li .dapth_menu li a:hover{color: #000;}




@media screen and (max-width:1620px){
  .header .navbar > ul > li > a{padding: 0 2rem;}
  
}

@media screen and (max-width:1420px){
  .header .navbar > ul > li > a{padding: 0 1.5rem;}
}

@media screen and (max-width:1260px){
  .header .navbar > ul > li > a{font-size: 1.05rem;padding: 0 1.2rem;}
}

@media screen and (max-width:1100px){
  .header .navbar > ul > li > a{font-size: 1rem;padding: 0 1rem;}
}

@media screen and (max-width:1024px){
 .header{padding: 1.25rem;}
 .header .header_wrap{width: 100%;}
 .header .navbar{display: none;}
 .site_map > ul{gap: 40px 20px;flex-wrap: wrap;}
 .site_map > ul li div{display: none;}
 .site_map > ul > li{width: 100%;}
 .site_map > ul > li > *:first-child{text-align: left;margin-bottom: 10px;cursor: pointer;position: relative;padding-bottom: 10px;}
 .site_map > ul > li > *:first-child:before{content: '+';display: block;position: absolute;right: 0;top: 50%;transform: translateY(-50%);font-weight: 300;}
 .site_map > ul > li.active > *:first-child:before{content: '-';margin-top: -2px;}
 .site_map > ul > li > *:first-child:before
 .site_map > ul > li > *:first-child:before:only-child{display: none;}
 .site_map > ul > li > *:not(div):after{display: none;}
 .site_map > ul > li.active > *:not(div){border-bottom: 2px solid var(--primary);}
 .site_map > ul > li div {text-align: left;}
 .site_map > ul > li .dapth_menu li a{padding: 10px 0;}
}

/* 영문 헤더 전용: 사이트맵에는 적용하지 않음 */
@media screen and (min-width: 1025px) and (max-width: 1600px) {
  html[lang="en"] .header {
    padding: 1.25rem;
  }

  html[lang="en"] .header .header_wrap {
    width: 100%;
  }

  html[lang="en"] .header .navbar {
    display: none;
  }
}

@media screen and (max-width:768px){
.header .logo img{width: 11.25rem;}
.header .header_controls{gap: 14px;}
.site_map .menu_close{top: 30px;right: 20px;}
.site_map{overflow-y: auto;}
.site_map > ul{flex-direction: column;justify-content:flex-start;padding: 100px 0px 60px 0px;margin-top: 0;gap: 20px;}
.site_map > ul > li > *:first-child{font-size: 1.25rem}

}

@media screen and (max-width:400px){
 .header{padding: 1rem .875rem;}
 .header .header_controls .lang_btn{padding-right: 18px;font-size: .8125rem;}
 .header .header_controls .m_menu{width: 32px;height: 32px;}
 .site_map > ul{width: calc(100% - 28px);}
}
