// ヘッダ
.header {
  background: var(--header-bg);
  height: var(--header-height);
  font-size: var(--header-font-size);
  font-weight: var(--header-font-weight);
  line-height: var(--header-height);

  @include media-desktop {
    padding: 0 1rem;
  }

  @include media-mobile {
    text-align: center;
  }
}

.header-icon {
  margin-top: var(--header-icon-vertical-adjustment);
  margin-right: 0.5rem;
  vertical-align: middle;
}

.header-title {
  text-decoration: none;

  &:link,
  &:visited,
  &:hover,
  &:focus,
  &:active {
    color: var(--header-color);
  }
}

.header-menu {
  background: transparent;
  border: none;
  display: block;
  font-size: inherit;
  height: var(--header-height);
  left: 0;
  object-fit: contain;
  position: absolute;
  top: 0;
  width: var(--header-height);

  @include media-desktop {
    display: none;
  }
}