.header-about {
  position: relative;
}

.header-about a img {
  width: 10px;
  transform: rotate(90deg);
  margin-left: 10px;
}

.sub-menu-hide {
  max-height: 0;
  transform: scaleY(0);
  transition: .5s ease-in-out;
  animation: hideAnimation 1s ease-in-out;
}
.header-sub-nav {
  position: absolute;
  display: flex;
  flex-direction: column;
  top: 47px;
  left: -11px;
  right: 0;
  background-color: #fffff4;
  width: max-content;
  padding: 30px 10px 10px 0;
  max-height: 0;
  overflow: hidden;
  max-width: 235px;
}
.navigation ul {
    justify-content: start;
}

.sub-menu-show {
  display: block;
  max-height: 9999px;
  transform: scaleY(1);
  transition: .5s ease-in-out;
  animation: showAnimation 1s ease-in-out;
}

.header-sub-nav-item {
  position: relative;
  display: flex;
  flex-direction: column;
  font-weight: 500;
  padding: 5px 0;
}