/*---------- Wrapper --------------------*/
#nav {
 width: 520px;
 height: 40;
 margin: 0;
 z-index: 1;
 overflow: visible; /* ✅ µå·Ó´Ù¿î °ãħ ¹æÁö */
}


#nav .nav_naviarea {
 margin: 0;
 padding: 0;
 width: 520px;
 height: 40;
}


#nav .nav_naviarea ul {
 text-align: center;
}


#nav ul li {
 font-size: 13px;
 cursor: pointer;
 -webkit-transition: padding .05s linear;
 -moz-transition: padding .05s linear;
 -ms-transition: padding .05s linear;
 -o-transition: padding .05s linear;
 transition: padding .05s linear;


 width: 130px;
 float: left;
 text-decoration: none;
 position: relative; /* ✅ µå·Ó´Ù¿î ±âÁØÀ¸·Î */
}


ul li.drop {
 position: relative;
 width: 130px;
 float: left;
 z-index: 10000000;
 font-weight: bold;
}


ul > li {
 display: inline-block;
}


ul li a {
 line-height: 30px;
 padding: 0px 0px;
 height: 30px;
 color: #666666;
 -webkit-transition: all .1s ease-out;
 -moz-transition: all .1s ease-out;
 -ms-transition: all .1s ease-out;
 -o-transition: all .1s ease-out;
 transition: all .1s ease-out;
}


ul li a:hover {
 color: #000000;
 text-decoration: none;
}


.dropOut .triangle {
 width: 0;
 height: 0;
 position: absolute;
 border-left: 8px solid transparent;
 border-right: 8px solid transparent;
 border-bottom: 8px solid #ffffff;
 top: -8px;
 left: 50%;
}


.dropdownContain {
 width: 130px;
 position: absolute;
 z-index: 9999; /* ✅ ¾ð¾î ¹öÆ°º¸´Ù À§¿¡ */
 left: 50%;
 margin-left: -75px;
 top: 100%;  /* ✅ li ¹Ù·Î ¾Æ·¡ */
 display: none; /* ✅ ±âº» ¼û±è */
}


.dropOut {
 width: 130px;
 float: left;
 position: relative;
 margin-top: 0px;
 opacity: 1;
}


.dropOut ul {
 float: left;
 padding: 0px 0 0px 0;
 background-color: #ffffff;
 margin-left: 10px;
}


.dropOut ul li {
 background-color: #ffffff;
 text-align: center;
 float: left;
 width: 140px;
 padding: 0px 0 0px 0px;
 margin: 0px 0px;
 color: #ffffff;
 -webkit-transition: background .1s ease-out;
 -moz-transition: background .1s ease-out;
 -ms-transition: background .1s ease-out;
 -o-transition: background .1s ease-out;
 transition: background .1s ease-out;
}


.dropOut ul li:hover {
 background-color: #ffffff;
 color: #ffffff;
}


/* ✅ ±âÁ¸ top À̵¿/opacity ¾Ö´Ï¸ÞÀÌ¼Ç Á¦°ÅÇÏ°í ¾ÈÁ¤Àû Ç¥½Ã ¹æ½ÄÀ¸·Î */
ul li:hover .dropdownContain {
 display: block;
}


ul li:hover a {
 color: #333333;
}


ul li:hover .underline {
 border-bottom-color: #777;
}


/* ✅ ¾Æ·¡ ÁÙ ºÒÇÊ¿äÇØÁ³À¸¹Ç·Î Á¦°Å °¡´É (¿øÇϸé À¯Áö) */
/* ul li:hover .dropOut { opacity: 1; margin-top: 8px; } */


li .smlist a:link {
 color: #666666;
 display: block;
 font-size: 12px;
}


li .smlist a:visited {
 color: #666666;
 display: block;
 font-size: 12px;
}


li .smlist a:hover {
 color: #333333;
 display: block;
 background-color: #efefef;
 font-size: 12px;
}