header {
  margin: 0 auto;
  background-color: #fff;
}

.navbar {
  flex-wrap: wrap;
}

.navbar hr {
  width: 100%;
  border-color: #9b9b9b;
}

.navbar .nav-item:hover .dropdown-menu {
  display: block;
  border-radius: 0;
}

div.gnb ul li a.dropdown-item {
  font-size: 17px;
  font-weight: normal;
}

div.top-nav div.logo-box img.cetify {
  margin-right: 15px;
  width: 75px;
}

div.top-nav div.logo-box .logo img {
  width: 220px;
}

div.top-nav div.number p {
  font-weight: bold;
  font-size: 27px;
}

div.top-nav div.number a {
  text-decoration: none;
  color: #1f447a;
}

div.top-nav div.number span {
  color: #f57c00;
  font-size: 17px;
}

div.gnb ul {
  width: 100%;
  justify-content: space-around;
}

div.gnb ul li a {
  font-size: 20px;
  font-weight: bold;
}

div.gnb ul li a.on {
  color: #1f447a;
  /* font-weight: bold; */
}

#menuToggle {
  z-index: 1;
  -webkit-user-select: none;
  user-select: none;
  display: none;
  position: absolute;
  z-index: 99999;
  right: 20px;
}

#menuToggle input {
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  cursor: pointer;
  opacity: 0; /* hide this */
  z-index: 2; /* and place it over the hamburger */
  -webkit-touch-callout: none;
}

#menuToggle span {
  display: block;
  width: 33px;
  height: 4px;
  margin-bottom: 5px;
  position: relative;
  background: #333;
  border-radius: 3px;
  z-index: 1;
  transform-origin: 4px 0px;
  transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1),
    background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.55s ease;
}

#menuToggle span:first-child {
  transform-origin: 0% 0%;
}

#menuToggle span:nth-last-child(2) {
  transform-origin: 0% 100%;
}

#menuToggle input:checked ~ span {
  opacity: 1;
  transform: rotate(45deg) translate(-2px, -1px);
  /* background: #fff; */
}

#menuToggle input:checked ~ span:nth-last-child(3) {
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

#menuToggle input:checked ~ span:nth-last-child(2) {
  transform: rotate(-45deg) translate(0, -1px);
}

#menuToggle input:checked ~ ul {
  transform: none;
}

#menuToggle input:checked ~ div.toggle-background {
  display: block;
}

div.toggle-background {
  width: 100%;
  height: 100%;
  position: fixed;
  background-color: #0003;
  left: 0;
  top: 0;
  display: none;
}

#menu {
  position: fixed;
  right: 0;
  top: 0;
  width: 300px;
  padding: 50px 0;
  padding-top: 80px;
  height: 100vh;
  background-color: #fff;
  list-style-type: none;
  -webkit-font-smoothing: antialiased;
  transform-origin: 0% 0%;
  transform: translate(100%, 0);
  transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1);
}

/*----- accordion ----*/

.accordion-item:first-of-type {
  border-radius: 0;
}

.accordion-item:first-of-type .accordion-button {
  border-radius: 0;
}

.accordion-item:last-of-type .accordion-button.collapsed {
  border-radius: 0;
}

.accordion-header .accordion-button {
  font-weight: bold;
  font-size: 17px;
}

.accordion-button:hover {
  background-color: #e7f1ff;
}

.accordion-body {
  background-color: #f4f4f4;
}

.accordion-body ul li {
  margin-bottom: 15px;
}

.accordion-body ul li:last-child {
  margin-bottom: 0;
}

.accordion-body ul li a {
  background-color: #f4f4f4;
  color: #666666;
  font-size: 16px;
  text-decoration: none;
}

.accordion-button.no-toggle::after {
  display: none;
}

div.number-box {
  margin-top: 25px;
}

div.number-box a {
  text-decoration: none;
  color: #1f447a;
  font-size: 25px;
  font-weight: bold;
  padding: 15px 20px;
  width: 100%;
}

div.number-box a i {
  margin-right: 15px;
}

@media (max-width: 992px) {
  header {
    position: sticky;
    top: 0;
    z-index: 999;
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.1);
  }

  #menuToggle {
    display: block;
  }

  .navbar hr {
    display: none;
  }

  .navbar > .container {
    max-width: 650px;
  }
}

@media (max-width: 768px) {
  .navbar > .container {
    justify-content: start;
  }

  div.top-nav div.logo-box img.cetify {
    width: 50px;
  }

  div.top-nav div.logo-box .logo img {
    width: 150px;
    margin-right: 15px;
  }

  div.top-nav div.number span {
    display: none;
  }
}

@media (max-width: 576px) {
  div.number {
    display: none;
  }
}