#header{width: 100%; height:80px; position: fixed; z-index: 9999; background: #080808;}
#header .inner{height: 100%; display: flex; justify-content: space-between; align-items: center;}
/* 상단 좌측 로고, 메뉴 */
#header .gnb{width: 100%; height: 100%; display: flex; align-items: center; justify-content: space-between;}
#header .gnb .logo{margin-right: 30px; width: 140px;}
#header .gnb .logo img{max-width: 100%;}


/* 상단 메뉴 */
#header .gnb > ul.menu{display: flex; flex-wrap: wrap; height: 100%;}
#header .gnb > ul.menu > li{text-align: center;}
#header .gnb > ul.menu > li > a{display: inline-block; font-size: 17px; font-weight: 500; color:#fff; text-align: center; padding: 0 20px; line-height:60px; position: relative; transition: .25s;}
#header .gnb > ul.menu > li > button{border:0px; font-size: 14px; background:#bababa; font-weight: 500; color:#fff; text-align: center; padding:5px 10px; position: relative; transition: .25s;     margin-top: 14px;}


#header .gnb > ul.menu > li > ul{display: inline-block; font-size: 17px; font-weight: 500; color:#fff; text-align: center; padding: 0px 0px 0px 0px; line-height:60px; position: relative; transition: .25s;}

#header .gnb > ul.menu > li.instagram {margin-top:5px; margin-right:15px}
#header .gnb > ul.menu > li.instagram.blog a {border: 0 !important; }
#header .gnb > ul.menu > li.instagram.kakao a {border: 0 !important; }
#header .gnb > ul.menu > li.instagram a{padding:10px;   border: 0; line-height:100%;   border-radius: 50%;}
#header .gnb > ul.menu > li.instagram img {width:25px}

.dark-mode header .gnb .lang li .langMenu li a span {color:#000}
header .gnb .lang li .langMenu li a span {color:#000}

button.theme-toggle {display:flex; align-items: center; border-radius:50px;}
.toggle-icon {border-radius:50px; background:#fff; width:20px; height:20px; text-align:center; margin-right:5px}
.toggle-icon img {width:13px; margin-top: 4px;}

.dark-mode #header .gnb > ul.menu > li.instagram a {border:0}

.dark-mode #header .gnb > ul.menu > li.instagram.blog a {border: 0; }
.dark-mode #header .gnb > ul.menu > li.instagram.kakao a {border: 0; }

@media screen and (max-width : 1400px) {
    #header .gnb > ul.menu > li > a{font-size: 15px;}
}
@media screen and (max-width : 1200px) {
    #header{height: 70px;}
    #header .gnb .logo{margin-right: 15px;}
    #header .gnb > ul.menu > li > a{padding: 0 10px;}
    #header .gnb .logo{width: 120px;}
}
@media screen and (max-width : 768px) {
    #header{height: 60px;}
    #header .gnb .logo{width: 100px;}
    #header .gnb > ul.menu{display: none;}
    #header .icon_menu{display: none;}
    
    #header .gnb .logo{margin: 0 auto;}
}

/* 마우스오버 효과 */
#header .gnb > ul.menu > li:hover > a{color: #ee3e42;}
#header .gnb > ul.menu > li:hover > a::after{visibility: visible; opacity: 1;}

#header .gnb > ul.menu > li:hover > .sub_menu{height: auto; opacity: 1;}


.skiptranslate {display:none}

header .gnb .lang {
  height: 60px;
}
header .gnb .lang > li {
  position: relative;
  height: 60px;
}
header .gnb .lang > li > a {
  display: flex;
  align-items: center;
  height: 60px;
  color: #fff;
  font-size: 0.9rem;
  letter-spacing: -0.5px;
  gap: 3px;
      padding: 0px 10px;
}
header .gnb .lang .arrow {
  font-size: 0.5rem;
}
header .gnb .lang li .langMenu {
  position: absolute;
  top: 60px;
  display: none; /* 기본적으로 숨김 */
  width: 100px;
  background: #fff;
}
header .gnb .lang li .langMenu li {
  padding: 0px 0;
  text-align: center;
}
header .gnb .lang li .langMenu li a {
  transition: 0.3s;
  color: #5e5e5e;
  font-weight: 500;
}
header .gnb .lang li .langMenu li a:hover {
  color: var(--color-red);
}
/* 화살표 회전 효과 (기본: ▼) */
.lang .arrow {
  display: inline-block;
  transition: transform 0.3s ease;
}

/* 드롭다운 메뉴 열릴 때 화살표 회전 (▲) */
.lang.active .arrow {
  transform: rotate(180deg);
}

header .gnb .menuBtn {
  display: none;
}