:root, body {
  --pc-content-width: min(100vw, 1920px);
  --sp-content-width: 100vw;
}

@media screen and (min-width: 1280px) {
  .spp__container {
    --pc-content-width: min(calc(100vw - 144px), 1776px);
  }
}
@media screen and (min-width: 1024px) and (max-width: 1279px) {
  .spp__container {
    --pc-content-width: calc(100vw - 128px);
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .spp__container {
    --sp-content-width: calc(100vw - 88px);
  }
}
@media screen and (min-width: 540px) and (max-width: 767px) {
  .spp__container {
    --sp-content-width: calc(100vw - 72px);
  }
}
@media screen and (min-width: 480px) and (max-width: 539px) {
  .spp__container {
    --sp-content-width: calc(100vw - 56px);
  }
}
@media screen and (max-width: 479px) {
  .spp__container {
    --sp-content-width: calc(100vw - 40px);
  }
}

.lp-hob {
  /* ----------------------------------------
  	anchor
  ---------------------------------------- */
}
@media screen and (min-width: 1024px) {
  .lp-hob .anchor {
    margin-top: calc(0.05 * var(--pc-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .lp-hob .anchor {
    margin-top: calc(0.16 * var(--sp-content-width));
    padding-inline: calc(0.0533333333 * var(--sp-content-width));
  }
}
.lp-hob .anchor .anchor__list {
  display: flex;
}
@media screen and (min-width: 1024px) {
  .lp-hob .anchor .anchor__list {
    justify-content: center;
    gap: calc(0.0125 * var(--pc-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .lp-hob .anchor .anchor__list {
    flex-flow: row wrap;
    gap: calc(0.032 * var(--sp-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .lp-hob .anchor .anchor__item {
    text-align: center;
    width: calc(0.4306666667 * var(--sp-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .lp-hob .anchor .anchor__item--01 {
    width: 100%;
  }
}
.lp-hob .anchor .anchor__link {
  display: flex;
  align-items: center;
  background-color: #F7F8F9;
  position: relative;
  line-height: 150%;
}
@media screen and (min-width: 1024px) {
  .lp-hob .anchor .anchor__link {
    justify-content: center;
    width: calc(0.175 * var(--pc-content-width));
    height: calc(0.0520833333 * var(--pc-content-width));
    font-size: calc(0.0109375 * var(--pc-content-width));
    text-align: center;
    padding-right: calc(0.0052083333 * var(--pc-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .lp-hob .anchor .anchor__link {
    padding-right: 1em;
    justify-content: center;
    height: calc(0.1333333333 * var(--sp-content-width));
    font-size: calc(0.0346666667 * var(--sp-content-width));
  }
}
.lp-hob .anchor .anchor__link:after {
  content: "";
  position: absolute;
  top: 50%;
  display: block;
  border-bottom: solid #1A1A1A;
  border-left: solid #1A1A1A;
  transform: rotate(-45deg);
}
@media screen and (min-width: 1024px) {
  .lp-hob .anchor .anchor__link:after {
    margin-top: calc(-0.0041666667 * var(--pc-content-width));
    border-width: calc(0.0010416667 * var(--pc-content-width));
    right: calc(0.0177083333 * var(--pc-content-width));
    width: calc(0.0046875 * var(--pc-content-width));
    height: calc(0.0046875 * var(--pc-content-width));
  }
}
@media screen and (max-width: 1023px) {
  .lp-hob .anchor .anchor__link:after {
    margin-top: calc(-0.0213333333 * var(--sp-content-width));
    border-width: calc(0.0026666667 * var(--sp-content-width));
    right: calc(0.0373333333 * var(--sp-content-width));
    width: calc(0.0213333333 * var(--sp-content-width));
    height: calc(0.0213333333 * var(--sp-content-width));
  }
}