nav#gnb { position: relative; }
nav#gnb ul { display: flex; justify-content: space-between;}
nav#gnb > ul > li { float: left; width: 12.5%; height: 61px; }
nav#gnb > ul > li > a { display: block; height: 100%; padding-top: 10px; font-size: 1rem; text-align: center; font-weight: 600}
nav#gnb > ul > li > a:hover { color: #262262;}
nav#gnb > ul > li:hover { color: #262262; background: none; border-bottom: 2px solid #262262;}
nav#gnb > ul > li:hover > a { color: #262262; background: none; }
nav#gnb > ul::after { content: ''; display: block; clear: both; }
nav#gnb > ul > li:hover > ul { display: flex; justify-content: center; width: 100%;}
nav#gnb > ul > li:hover > ul > li { margin: 0 -20px;}
nav#gnb > ul > li > ul { position: absolute; left: 0; top: 61px; width: 100%;display: none; margin: 0 auto; }
nav#gnb > ul > li > ul > li {  text-align: center; padding-top: 10px; display: inline-block;}
nav#gnb > ul > li > ul > li > a {
  font-size: 0.95rem;
  color: #777;
}
nav#gnb > ul > li > ul > li > a:hover {
  color: #262262;
  font-weight: 600;
  transition: 0.1s;
}

#gnb #gnb_1dul {
  width: 100%;
  height: 60px;
  margin: 0 auto;
}

#gnb #gnb_1dul li {
  width: 20%;
  text-align: center;
  line-height: 2.5rem;
}
#gnb #gnb_1dul li a {
  text-align: center;
}
nav.gnb { display: none; }

@media (max-width:1023px) {
  nav#gnb { display: none; }
}

@media (max-width:1023px) {
  nav#gnb { display: none; }
  nav.gnb { display: block; }
}