/* GNB */
#gnb {display: block;position: relative;z-index: 9;width: 100%; min-width: 1450px; height: 100px; margin: 0 auto; top:0;} 
.gnb_container { position: fixed; top: 0; left: 0; width: 100%; height: 100px; z-index: 30; opacity: 1; transition: all 0.5s ease; background: transparent; /* ±âº» ¹è°æ ¾øÀ½ */}
.gnb_container.fixed { position: fixed; top: 0; height: 80px; background: #fff; box-shadow: 0 0 1px rgba(0, 0, 0, 0.8);}
.gnb_container .temp_gnb {width: 100%;height: 100%;position:relative}
.gnb_container .temp_gnb .logo {top: 20px;left: 50px;position: absolute;z-index: 2}
.gnb_container .temp_gnb .mb { margin-top: 28px;right: 100px;position: absolute;z-index: 2;line-height:40px;}
.gnb_container .temp_gnb .mb svg {margin-left: 0px;}
.gnb_container .temp_gnb .mb a { color:#000;margin-left: 10px; text-decoration: none}
.gnb_container .temp_gnb .mb > .adm { display: inline-block; position: relative; top: 8px;margin:0 -5px;}
.gnb_container .temp_gnb .navBtn {margin-top: 31px;right: 50px;position: absolute;z-index: 3;cursor: pointer}

nav { width: 100%; text-align: center;}
nav > ul { width: 100%; padding: 0; display: flex; justify-content: center; list-style: none;}
nav > ul > li { position: relative; width: 115px; margin: 0 2px; text-align: center; transition: width 0.5s ease; overflow: visible;}

/* ±âº» ¸µÅ© ½ºÅ¸ÀÏ */
nav > ul > li > a { display: block; padding: 35px 0 15px; font-family: 'Noto Sans KR'; font-size: 19px; color: #000; font-weight: 400; text-decoration: none; position: relative; z-index: 2; transition: color 0.3s ease;}

/* hover ½Ã ±ÛÀÚ »ö */
nav > ul > li:hover > a { color: #fff; text-decoration: none;}

/* hover ½Ã width È®Àå */
nav > ul > li:hover { width: 180px;text-align: center; }

/* submenu */
.submenu { position: absolute; top: 100%; left: 0; width: 100%; margin-top:5px; overflow: hidden; max-height: 0; opacity: 0; z-index: 2;background: transparent;}
nav > ul > li:hover .submenu { max-height: 400px; opacity: 1;transition: all 0.7s ease; }
.submenu > li a { display: inline-block; font-size: 16px; color: #fff; font-weight: 400; line-height: 30px; text-decoration: none; position: relative; transition: color 0.6s ease;}

/* hover ½Ã ¹ØÁÙ ¸¸µé±â */
.submenu > li a::after { content: ''; position: absolute; bottom: 1px; left: 0; right:0; width: 100%; margin:0 auto; height: 1px; background: #fff; transform: scaleX(0); transform-origin: center top; transition: transform 0.4s cubic-bezier(0, 0, 0, 1);}
.submenu > li a:hover::after { transform: scaleX(1); transform-origin: center top;}

/* hover ½Ã ¾Æ·¡·Î È®Àå + ±×¶óµ¥ÀÌ¼Ç */
nav > ul > li::after { content: ""; position: absolute; top: 0; left: 0; right:0; width: 100%; height: 0; background: linear-gradient(
    to bottom,
    rgba(0, 169, 193, 1) 0%,
    rgba(0, 169, 193, 0.9) 60%,
    rgba(0, 169, 193, 0.9) 100%
  );
  border-radius: 0 0 15px 15px; transition: all 0.5s ease; z-index: 1;}

/* hover ½Ã ±×·ìº° heught°ª */
nav > ul > li:nth-child(1):hover::after { height: 260px; }
nav > ul > li:nth-child(2):hover::after { height: 290px; }
nav > ul > li:nth-child(3):hover::after { height: 200px; }
nav > ul > li:nth-child(4):hover::after { height: 200px; }
nav > ul > li:nth-child(5):hover::after { height: 260px; }
nav > ul > li:nth-child(6):hover::after { height: 140px; }
nav > ul > li:nth-child(7):hover::after { height: 260px; }

/* active »óÅÂ */
nav > ul > li.active > a { color: #fff;}
nav > ul > li.active::after { height: 100px; background: linear-gradient(
    to bottom,
    rgba(0, 169, 193, 1) 0%,
    rgba(0, 169, 193, 0.9) 60%,
    rgba(0, 169, 193, 0.9) 100%
  );
}

/* active + hover »óÅ height È®Àå
nav > ul > li.active:hover::after { height: 245px;}
*/

/* ÇÏÀ§ ¸Þ´º on ½Ã È°¼ºÈ­ */
.submenu > li.on > a { font-weight:600;color: #fff;text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px;  /* ±ÛÀÚ¿Í ¼± »çÀÌ °£°Ý */}