/* header start */
header {
  height: var(--nav-height);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 2;
  background-color: #fff097;
}

.header-brand {
  width: fit-content;
  z-index: 99;
}

.header-brand .logo_img {
  width: 100%;
  max-width: 135px;
}

.navigation-container {
  width: -webkit-fill-available;
  justify-content: flex-end;
}

.main-nav {
  width: 100%;
  justify-content: center;
}

.main-nav__list {
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
}

.main-nav__link {
  color: #ed81b0;
  position: relative;
  padding-left: 20px;
  display: flex;
  align-items: center;
}

.main-nav__link img {
  width: 100%;
}

.main-nav__link::before {
  content: "";
  background: url(../img/nav_link-icon.png);
  background-size: 100%;
  background-repeat: no-repeat;
  position: absolute;
  left: 0;
  top: 50%;
  width: 15px;
  height: 15px;
  transform: translateY(-50%);
}

#page_1 .header-sm__item {
  width: 40px;
  height: 40px;
}

#page_1 .header-cta__link {
  padding: 0;
}

#page_1 .header-cta__link img {
  width: 150px;
  height: 40px;
  object-fit: contain;
}
/* header end */

@media (max-width: 1375px) {
  .main-nav__list {
    width: initial;
    height: initial;
    justify-content: initial;
    align-items: initial;
    /* gap: 12px; */
  }

  #page_1 .link a {
    background-color: #ed81b0;
    padding: 10px 20px;
  }
}

@media (max-width: 1000px) {
  /* header 1000px start */
  .main-nav {
    padding-top: 90px;
  }

  .main-nav__list {
    background-color: #fff097;
  }

  header .sp-menu.sp span {
    background: #ed81b0;
  }
  /* header 1000px end */
}

@media (max-width: 768px) {
  /* .main-nav__list {
    gap: 0;
    padding: 50px 5% 20px;
  } */
}

@media (max-width: 349px) {
  header .sp-menubox {
    aspect-ratio: initial;
    padding: 0 15px;
  }
}
