.content-area:has(> * > .p-super-early-discount) {
  margin-bottom: 0;
}
.site-main:has(> .p-super-early-discount) {
  margin-bottom: 0;
}

.p-super-early-discount {
  color: #231815;
  :where(&) picture {
    display: block;
  }
  :where(&) h2,
  :where(&) p {
    margin-bottom: 0;
  }
}

.p-mv {
  background-color: #9fd9f6;
  @media (min-width: 768px) {
    padding-bottom: calc(29 / 1920 * 100 * var(--vw));
  }
}
.p-mv__main {
  & img {
    width: 100%;
  }
}
.p-mv__btn {
  display: block;
  width: fit-content;
  margin-inline: auto;
  @media (min-width: 768px) {
    display: none;
  }
  &:hover {
    opacity: 0.8;
  }
  & picture {
    & img {
      width: calc(305 / 340 * 100 * var(--vw));
    }
  }
}
.p-mv__bottom {
  margin-top: calc(8 / 340 * 100 * var(--vw));
  @media (min-width: 768px) {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, auto) minmax(0, 1fr);
    width: calc(1644 / 1920 * 100 * var(--vw));
    margin-top: 0;
    margin-inline: auto;
  }
}
.p-mv__message {
  display: block;
  align-content: center;
  padding-block: calc(3.7 / 340 * 100 * var(--vw));
  background-color: #fff100;
  position: relative;
  z-index: 1;
  @media (min-width: 768px) {
    padding-block: calc(18 / 1920 * 100 * var(--vw));
    padding-inline: calc(17 / 1920 * 100 * var(--vw)) calc(3 / 1920 * 100 * var(--vw));
  }
  &::after {
    @media (min-width: 768px) {
      content: "";
      display: block;
      height: 100%;
      aspect-ratio: 46 / 62;
      background-color: inherit;
      background-image: linear-gradient(to right bottom, #fff100 calc(50% - 0.5px), #fff calc(50% + 0.5px));
      position: absolute;
      inset-block: 0;
      left: 100%;
    }
  }
  & img {
    width: calc(213.45 / 340 * 100 * var(--vw));
    margin-inline: auto;
    @media (min-width: 768px) {
      width: calc(380 / 1920 * 100 * var(--vw));
    }
  }
}
.p-mv__logos-wrap {
  border-right: calc(18 / 340 * 100 * var(--vw)) solid transparent;
  border-left: calc(18 / 340 * 100 * var(--vw)) solid transparent;
  background-color: #fff;
  position: relative;
  overflow: hidden;
  @media (min-width: 768px) {
    border: none;
  }
}
.p-mv__logos {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: max-content;
  align-items: center;
  width: fit-content;
  column-gap: calc(16 / 340 * 100 * var(--vw));
  padding-block: calc(4 / 340 * 100 * var(--vw));
  padding-right: calc(16 / 340 * 100 * var(--vw));
  animation: logos-slider 18s infinite 0s linear;
  @media (min-width: 768px) {
    column-gap: calc(50 / 1920 * 100 * var(--vw));
    padding-block: calc(9 / 1920 * 100 * var(--vw));
    padding-right: calc(50 / 1920 * 100 * var(--vw));
    animation-duration: 19s;
  }
  &:nth-child(2) {
    position: absolute;
    inset: 0;
    animation-delay: -9s;
    @media (min-width: 768px) {
      animation-delay: -9.5s;
    }
  }
}
@keyframes logos-slider {
  0% {
    translate: 100% 0;
  }
  100% {
    translate: -100% 0;
  }
}
.p-mv__logo {
  & img {
    width: calc(var(--width) / 340 * 100 * var(--vw));
    @media (min-width: 768px) {
      width: calc(var(--width) / 60 * 202 / 1920 * 100 * var(--vw));
    }
  }
}
.p-mv__links {
  display: none;
  @media (min-width: 768px) {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    column-gap: calc(10.6 / 1920 * 100 * var(--vw));
    width: calc(1644 / 1920 * 100 * var(--vw));
    margin-top: calc(12 / 1920 * 100 * var(--vw));
    margin-inline: auto;
  }
}
.p-mv__links-item {
}
.p-mv__links-link {
  @media (min-width: 768px) {
    display: block;
    padding-top: calc(11 / 1920 * 100 * var(--vw));
    padding-bottom: calc(18 / 1920 * 100 * var(--vw));
    background-color: #fff;
    font-weight: 500;
    font-size: calc(30 / 1920 * 100 * var(--vw));
    letter-spacing: 0.075em;
    text-align: center;
  }
  &::after {
    @media (min-width: 768px) {
      content: "";
      display: block;
      width: calc(27.4189 / 30 * 1em);
      aspect-ratio: 27.4189 / 18.4189;
      margin-top: 0.22em;
      margin-inline: auto;
      background-color: currentColor;
      clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
    }
  }
  &:hover {
    opacity: 0.8;
  }
}

.p-bg-blue {
  padding-top: calc(19 / 340 * 100 * var(--vw));
  padding-bottom: calc(24 / 340 * 100 * var(--vw));
  background-color: #d2ecfa;
}
.p-bg-blue__inner {
  width: calc(310 / 340 * 100%);
  max-width: 1140px;
  margin-inline: auto;
  container-type: inline-size;
}

.p-compare {
}
.p-compare__figure {
  & img {
    width: 100%;
  }
}

.p-dondon {
  padding-top: calc(8 / 310 * 100cqw);
}
.p-dondon__title {
  width: stretch;
  margin-inline: calc(-8 / 310 * 100cqw) 0;
  filter: drop-shadow(calc(1.7 / 310 * 100cqw) calc(1.7 / 310 * 100cqw) calc(1.7 / 310 * 100cqw) color-mix(in srgb, #000 75%, transparent));
  @media (min-width: 768px) {
    margin-inline: calc(-31 / 1140 * 100cqw) calc(-2 / 1140 * 100cqw);
  }
  & img {
    width: 100%;
  }
}
.p-dondon__text {
  margin-top: calc(-16 / 310 * 100cqw);
  & img {
    width: 100%;
  }
}

.p-banners {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  column-gap: calc(3 / 310 * 100cqw);
  margin-top: calc(10 / 310 * 100cqw);
  filter: drop-shadow(calc(1.7 / 310 * 100cqw) calc(1.7 / 310 * 100cqw) calc(1.7 / 310 * 100cqw) color-mix(in srgb, #000 75%, transparent));
}
.p-banners__item {
}
.p-banners__item-link {
  &:hover {
    opacity: 0.8;
  }
}
.p-banners__item-media {
  & img {
    width: 100%;
  }
}

.p-discounts {
  margin-top: calc(16 / 310 * 100cqw);
  &:nth-child(n + 2 of &) {
    margin-top: calc(32 / 320 * 100cqw);
  }
}
.p-discounts--super-early {
  --bg-color: #e7264d;
}
.p-discounts--early {
  --bg-color: #ef7c10;
}
.p-discounts--value {
  --bg-color: #6fba2c;
}
.p-discounts--consider {
  --bg-color: #0058aa;
}
.p-discounts__title {
  padding-block: calc(6 / 310 * 100cqw);
  background-color: var(--bg-color);
}
.p-discounts__title-media {
  width: fit-content;
  margin-inline: auto;
  margin-bottom: 0;
  & img {
    width: calc(var(--width) / 310 * 100cqw);
  }
}
.p-discounts__body {
  border: calc(1.5 / 310 * 100cqw) solid var(--bg-color);
  border-top: none;
  padding-top: calc(6 / 310 * 100cqw);
  padding-inline: calc(9 / 310 * 100cqw);
  padding-bottom: calc(13 / 310 * 100cqw);
  background-color: #fff;
}
.p-discounts__meta {
  padding-inline: calc(16 / 310 * 100cqw);
  padding-bottom: calc(11 / 310 * 100cqw);
  background-color: #fffcdb;
}
.p-discounts__meta-title {
  font-weight: 700;
  font-size: calc(11.71 / 310 * 100cqw);
  text-align: center;
}
.p-discounts__period {
  padding-block: calc(6 / 310 * 100cqw) calc(1 / 310 * 100cqw);
  background-color: #fff;
}
.p-discounts__period-title {
  width: fit-content;
  margin-inline: auto;
  border-radius: 5em;
  padding-inline: 1.4em;
  background-color: var(--bg-color);
  color: #fff;
  font-weight: 700;
  line-height: 1.2;
  font-size: calc(11.71 / 310 * 100cqw);
  text-align: center;
}
.p-discounts__period-range {
  margin-top: 0.25em;
  font-weight: 700;
  font-size: calc(10.64 / 310 * 100cqw);
  text-align: center;
}
.p-discounts__period-range-lg {
  margin-top: 0.3em;
  font-size: calc(14.63 / 10.64 * 1em);
}
.p-discounts__period-note {
  font-weight: 700;
  font-size: calc(9.05 / 310 * 100cqw);
  text-align: center;
}
.p-discounts__examples-title {
  margin-top: calc(12 / 310 * 100cqw);
  & picture {
    & img {
      width: 100%;
    }
  }
}
.p-discounts__examples {
  display: grid;
  row-gap: calc(8.5 / 310 * 100cqw);
  margin-top: calc(7 / 310 * 100cqw);
}
.p-discounts__example {
}
.p-discounts__example-media {
  margin-left: calc(-3 / 310 * 100cqw);
  & img {
  }
}
.p-discounts__footnote {
  margin-top: calc(7 / 310 * 100cqw);
  & picture {
    width: fit-content;
    margin-inline: auto;
    & img {
      width: calc(268.4282 / 310 * 100cqw);
    }
  }
}
.p-discounts__search {
  display: block;
  width: fit-content;
  margin-top: calc(11 / 310 * 100cqw);
  margin-inline: auto;
  &:hover {
    opacity: 0.8;
  }
  & picture {
    & img {
      width: calc(272 / 310 * 100cqw);
    }
  }
}

.p-estimate {
  margin-top: calc(7.5 / 310 * 100cqw);
}
.p-estimate__title {
  padding-block: calc(14 / 310 * 100cqw) calc(9 / 310 * 100cqw);
  background-color: #3156a5;
  & picture {
    width: fit-content;
    margin-inline: auto;
    & img {
      width: calc(282.62 / 310 * 100cqw);
    }
  }
}
.p-estimate__body {
  border: calc(2.5 / 310 * 100cqw) solid #3156a5;
  border-top: none;
  padding-top: calc(17 / 310 * 100cqw);
  padding-bottom: calc(39 / 310 * 100cqw);
  background-color: #fff;
}
.p-estimate__text {
  width: fit-content;
  margin-inline: auto;
  & img {
    width: calc(271.643 / 310 * 100cqw);
  }
}
.p-estimate__btn {
  display: block;
  width: fit-content;
  margin-top: calc(39 / 310 * 100cqw);
  margin-inline: auto;
  & img {
    width: calc(285 / 310 * 100cqw);
  }
  &:hover {
    opacity: 0.8;
  }
}

.p-fixed-btn {
  display: grid;
  place-items: center;
  place-content: center;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, auto);
  justify-content: center;
  margin-inline: calc(10 / 340 * 100 * var(--vw));
  border-radius: calc(10 / 340 * 100 * var(--vw));
  padding: calc(10 / 340 * 100 * var(--vw));
  position: fixed;
  left: 0;
  right: calc(42px + 20px);
  bottom: calc(20px + 42px / 2);
  background-color: #3156a4;
  translate: 0 50%;
  filter: drop-shadow(2px 2px 2px color-mix(in srgb, #000 75%, transparent));
  transition:
    opacity 0.4s ease,
    visibility 0.4s ease;
  z-index: 10;
  @media (min-width: 768px) {
    grid-auto-flow: row;
    row-gap: calc(13 / 1920 * 100 * var(--vw));
    width: calc(372 / 1920 * 100 * var(--vw));
    aspect-ratio: 1;
    margin-inline: 0;
    border-radius: 50%;
    padding: 0;
    bottom: calc(80 / 1920 * 100 * var(--vw));
    right: calc(20 / 1920 * 100 * var(--vw));
    left: auto;
    translate: none;
  }
  &:hover {
    opacity: 0.8;
    transition: opacity 0.2s;
  }
  &.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
}
.p-fixed-btn__media {
  filter: drop-shadow(calc(4.2815 / 1920 * 100 * var(--vw)) calc(4.2815 / 1920 * 100 * var(--vw)) calc(4.2815 / 1920 * 100 * var(--vw)) color-mix(in srgb, #231815 75%, transparent));
  & img {
    width: calc(var(--width) * 0.3 / 340 * 100 * var(--vw));
    @media (min-width: 768px) {
      width: calc(var(--width) / 1920 * 100 * var(--vw));
    }
  }
}