/* ============= Delux1 ============= */
.delux1-menu {
  --menu-text-size: 15px;
  --menu-width: 1100px;
  --menu-height: 52px;
  --menu-display: flex !important;
  --menu-bg-active: #EF3A43;
  --menu-text-color-active: #fff;
  --menu-bd-top: 1px solid #ddd !important;
}

.delux1-menu .gnb-item > a div span.icon,
.delux2-menu .gnb-item > a div span.icon {
  display: none;
}

/* ============= Delux2 ============= */
.delux2-menu {
  --menu-width: 1100px;
  --menu-height: 63px;
  --menu-bg-active: #fff;
  --menu-text-color-active: #EC3D42 !important;
  --menu-bd-top: 1px solid #ddd !important;
}

.delux2-menu .gnb-item:hover > a,
.delux2-menu .gnb-item.is-active > a {
  text-decoration: underline !important;
  text-decoration-thickness: 3px !important;
  text-underline-offset: 10px !important;
  text-decoration-color: #EC3D42 !important;
}

/* ============= Delux3 ============= */
.delux3-menu {
  --menu-width: 180px;
  --menu-height: 524px !important;
  --menu-bd-bottom: 1px solid #6992E7;
  --menu-bg: #3A70DF;
  --menu-bg-active :#fff;
  --menu-text-color: #fff;
  --menu-text-color-active: #222 !important;
  --menu-bd-top: 1px solid #3A70DF !important;
  --layer-bordercolor: #3A70DF;
}

/* ============= Delux4 ============= */
.delux4-menu {
  --menu-width: 180px;
  --menu-height: 492px !important;
  --menu-bg: #fff;

  --menu-text-size: 15px;
  --menu-text-color: #222;
  --menu-text-color-active: #EE2A21 !important;

  --menu-bd: 1px solid #EC2A23;
  --menu-bd-top: none;
  --menu-bg-active :url('../images/arrow_cate.gif') no-repeat 160px 12px;

  --layer-bordercolor: red;
  --menu-margin : 0 !important;
}

/* ============= Delux5 ============= */
.delux5-menu {
  --menu-width: 1100px;
  --menu-height: 50px !important;
  --menu-text-color: #fff !important;
  --menu-text-color-active: #fff !important;
}

/* ============= Delux6 ============= */
.delux6-menu {
  --menu-width: 1100px;
  --menu-height: 58px !important;
  --menu-text-color: #222 !important;
  --menu-text-color-active: #222 !important;
  --menu-bd-top: 1px solid #ddd !important;
}

/* ============= Delux7 ============= */
.delux7-menu {
  --menu-width: 1100px;
  --menu-height: 58px !important;
  --menu-text-color: #222 !important;
  --menu-text-color-active: #222 !important;
  --menu-bd-top: 1px solid #ddd !important;
}

/* ============= Delux8 ============= */
.delux8-menu {
  --menu-width: 190px;
  --menu-height: 506px !important;
  --menu-bg: #006388;
  --menu-bg-active: #fff;

  --menu-text-size: 15px;
  --menu-text-color: #fff;
  --menu-text-color-active: #222 !important;

  --menu-bd-top: none;
  --menu-bd-bottom: 1px solid #3D88A4;

  --menu-margin : 0 !important;
  --layer-bordercolor: #006388;
}

/* ============= Delux9 ============= */
.delux9-menu {
  --menu-text-size: 14px;
  --menu-width: 1100px;
  --menu-bg-active: #F1473A;
  --menu-text-color: #222;
  --menu-text-color-active: #fff;
  --menu-bd-top: 1px solid #ddd !important;
}
.delux9-menu .gnb-item:hover > a,
.delux9-menu .gnb-item.is-active > a {
  transition: background-color .2s;
}

.delux9-menu .gnb-item  {
  height: 80px;
  position: relative;
}

.delux9-menu .gnb-item > a {
  align-items: center;
  flex-direction: row;
  justify-content: center;
  border-radius: 10px !important;
  background: #F8F8F8;
}

.delux9-menu .gnb-item > a > div {
  padding: 0 !important;
}

.delux9-menu .gnb-menu {
  gap: 6px;
}

.delux9-menu .gnb-menu li { flex: 1 }

.delux9-menu .gnb-layer-wrap {
  margin-top: 10px;
  border-radius: 10px;
}

.delux9-menu .gnb-item > a .icon {
  background-color: #85919F;
}

/* ¾ÆÀÌÄÜ »ö ¹ÝÀü */
.delux9-menu .gnb-item:hover > a .icon,
.delux9-menu .gnb-item.is-active > a .icon {
  background-color: #fff;
}

.delux9-menu .gnb-item:hover > a .txt,
.delux9-menu .gnb-item.is-active > a .txt {
  color: #fff;
}

.delux9-menu span.icon,
.delux9-menu span.txt {
  display: block !important;
  text-align: center;
  margin: 2px auto;
  width: 100%;
  line-height: 110%;
  font-size: 14px;
}

.delux9-menu .menubr {
  display: block !important; height:0 !important;
}

/* ============= Lux1 ============= */
.lux1-menu {
  --menu-text-size: 14px;
  --menu-width: 1025px !important;
  --menu-height: 38px;
  --menu-display: flex !important;
  --menu-bg-active: #fff;
  --menu-text-color: #fff !important;
  --menu-text-color-active: #FF8600;
  --menu-bd-top: none !important;
}

.lux1-menu .gnb-item > a {
  border: 1px solid var(--menu-text-color-active);
  border-bottom: 0;
}

.lux1-menu .gnb[data-layer-position="bottom"] .gnb-layer-wrap {
  margin-left: -2px;
}

/* ============= Lux2 ============= */
.lux2-menu {
  --menu-text-size: 14px;
  --menu-width: 1025px !important;
  --menu-height: 38px;
  --menu-display: flex !important;
  --menu-bg-active: #fff;
  --menu-text-color: #fff !important;
  --menu-text-color-active: #549AFF;
  --menu-bd-top: none !important;
}
.lux2-menu {
  background: linear-gradient(to top, #549AFF, #549AFF);
}

.lux2-menu .gnb-item > a {
  border: 1px solid var(--menu-text-color-active);
  border-bottom: 0;
}

.lux2-menu .gnb[data-layer-position="bottom"] .gnb-layer-wrap {
  margin-left: -2px;
}

/* ============= Lux3 ============= */
.lux3-menu {
  --menu-text-size: 14px;
  --menu-width: 1025px !important;
  --menu-height: 38px;
  --menu-display: flex !important;
  --menu-bg: #428AEB;
  --menu-bg-active: #fff;
  --menu-text-color: #fff !important;
  --menu-text-color-active: #428AEB;
  --menu-bd-top: none !important;
}

.lux3-menu .gnb-item > a {
  border: 1px solid var(--menu-text-color-active);
  border-bottom: 0;
}

.lux3-menu .gnb[data-layer-position="bottom"] .gnb-layer-wrap {
  margin-left: -2px;
}

/* ============= Lux4 ============= */
.lux4-menu {
  --menu-text-size: 14px;
  --menu-width: 1025px !important;
  --menu-height: 38px;
  --menu-display: flex !important;
  --menu-bg: #4DA910;
  --menu-bg-active: #fff;
  --menu-text-color: #fff !important;
  --menu-text-color-active: #4DA910;
  --menu-bd-top: none !important;
}

.lux4-menu .gnb-item > a {
  border: 1px solid var(--menu-text-color-active);
  border-bottom: 0;
}

.lux4-menu .gnb[data-layer-position="bottom"] .gnb-layer-wrap {
  margin-left: -2px;
}

/* ============= Lux5 ============= */
.lux5-menu {
  --menu-text-size: 14px;
  --menu-width: 1025px !important;
  --menu-height: 38px;
  --menu-display: flex !important;
  --menu-bg-active: #fff;
  --menu-text-color: #fff !important;
  --menu-text-color-active: #F81E73;
  --menu-bd-top: none !important;
}
.lux5-menu {
  background: linear-gradient(to top, #EC166C, #FF2377);
}

.lux5-menu .gnb-item > a {
  border: 1px solid var(--menu-text-color-active);
  border-bottom: 0;
}

.lux5-menu .gnb[data-layer-position="bottom"] .gnb-layer-wrap {
  margin-left: -2px;
}

/* ============= Lux6 ============= */
.lux6-menu {
  --menu-text-size: 14px;
  --menu-width: 200px !important;
  --menu-height: 497px !important;
  --menu-bd-bottom: 1px solid #e9e9e9 !important;
  --menu-bg-active: #F31A21;
  --menu-text-color: #222;
  --menu-icon-color: #F31A21;
  --menu-icon-color-active: #fff;
  --menu-text-color-active: #fff !important;
  --menu-bd: 1px solid #F31A21;
  --menu-bd-top: 1px solid #F31A21;
  --layer-bordercolor: #F31A21;
}

.lux6-menu span.icon,
.lux6-menu span.txt {
  display: flex !important;
}

.lux6-menu .gnb-item > a div {
  align-items: left !important;
  justify-content: left !important;
}

/* ============= Lux7 ============= */
.lux7-menu {
  --menu-text-size: 14px;
  --menu-width: 200px !important;
  --menu-height: 459px !important;
  --menu-bg: #fff;
  --menu-bd: 1px solid #d4d4d4 !important;
  --menu-bd-bottom: 1px solid #e9e9e9 !important;
  --menu-bg-active: #F85355 !important;
  --menu-icon-color: #F85355;
  --menu-icon-color-active: #fff;
  --menu-text-color: #222;
  --menu-text-color-active: #fff !important;
}
.lux7-menu span.icon,
.lux7-menu span.txt {
  display: flex !important;
}

.lux7-menu .gnb-item > a div {
  align-items: left !important;
  justify-content: left !important;
}

/* ============= Lux8 ============= */
.lux8-menu {
  --menu-text-size: 14px;
  --menu-width: 200px !important;
  --menu-height: 460px !important;
  --menu-bg: #FEFF97;
  --menu-bd: 1px solid #d4d4d4 !important;
  --menu-bd-bottom: 1px solid #e9e9e9 !important;
  --menu-bg-active: #F7A726 !important;
  --menu-icon-color: #F7A726;
  --menu-icon-color-active: #fff;
  --menu-text-color: #666;
  --menu-text-color-active: #fff !important;
}
.lux8-menu span.icon,
.lux8-menu span.txt {
  display: flex !important;
}

.lux8-menu .gnb-item > a div {
  align-items: left !important;
  justify-content: left !important;
}

/* ============= Lux9 ============= */
.lux9-menu {
  --menu-text-size: 15px;
  --menu-width: 1025px !important;
  --menu-height: 40px;
  --menu-display: flex !important;
  --menu-bd-top: 1px solid #EAEAEA;
}

.lux9-wrap { border: 1px solid #EAEAEA; }

/* ============= Lux10 ============= */
.lux10-menu {
  --menu-text-size: 14px;
  --menu-width: 1025px !important;
  --menu-height: 38px;
  --menu-display: flex !important;
  --menu-bd-top: none !important;
  --menu-text-color: #000;
  --menu-text-color-active: #c20000 !important;
  --menu-bd: 1px solid #000;
}

.lux10-menu .gnb-menu {
  border-top: 1px solid #fff !important;
}

/* ============= Lux11 ============= */
.lux11-menu {
  --menu-text-size: 14px;
  --menu-width: 1025px !important;
  --menu-height: 50px;
  --menu-display: flex !important;
  --menu-text-color: #222;
  --menu-text-color-active: #0427BC !important;
}

/* ============= Lux12 ============= */
.lux12-menu {
  --menu-text-size: 14px;
  --menu-width: 195px !important;
  --menu-height: 496px !important;
  --menu-bg: #3784BD;
  --menu-text-color: #fff;
  --menu-text-color-active: #ccc !important;
  --menu-icon-color: #fff;
  --menu-icon-color-active: #ccc;
}

.lux12-menu {
  margin-left: -1px;
}

.lux12-menu span.icon,
.lux12-menu span.txt {
  display: flex !important;
}

.lux12-menu .gnb-item > a div {
  align-items: left !important;
  justify-content: left !important;
}
