.p-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;

  --top-left-width: calc(239.285 / 1920 * 100 * var(--vw));
  --top-left-height: calc(691.137 / 1920 * 100 * var(--vw));
  --top-left-offset-x: calc(121.1 / 1920 * 100 * var(--vw));
  --top-left-offset-y: calc(18.2 / 1920 * 100 * var(--vw));

  --top-right-width: calc(285.911 / 1920 * 100 * var(--vw));
  --top-right-height: calc(709.949 / 1920 * 100 * var(--vw));
  --top-right-offset-x: calc(73.8 / 1920 * 100 * var(--vw));
  --top-right-offset-y: calc(44.7 / 1920 * 100 * var(--vw));

  --repeat-left-width: calc(276.969 / 1920 * 100 * var(--vw));
  --repeat-left-height: calc(2563.294 / 1920 * 100 * var(--vw));
  --repeat-left-offset-x: calc(-18.7 / 1920 * 100 * var(--vw));
  --repeat-left-offset-y: calc(316.6 / 1920 * 100 * var(--vw));
  --repeat-left-gap: calc(481 / 1920 * 100 * var(--vw));

  --repeat-right-width: calc(279.943 / 1920 * 100 * var(--vw));
  --repeat-right-height: calc(2665.633 / 1920 * 100 * var(--vw));
  --repeat-right-offset-x: calc(-17.7 / 1920 * 100 * var(--vw));
  --repeat-right-offset-y: calc(259.2 / 1920 * 100 * var(--vw));
  --repeat-right-gap: calc(378.7 / 1920 * 100 * var(--vw));
}
.p-bg__top-left {
  width: var(--top-left-width);
  height: var(--top-left-height);
  background: url(../img/secret/bg-top-left.svg) no-repeat left top / contain;
  position: absolute;
  top: var(--top-left-offset-y);
  left: var(--top-left-offset-x);
}
.p-bg__top-right {
  width: var(--top-right-width);
  height: var(--top-right-height);
  background: url(../img/secret/bg-top-right.svg) no-repeat right top / contain;
  position: absolute;
  top: var(--top-right-offset-y);
  right: var(--top-right-offset-x);
}
.p-bg__repeat-left {
  width: var(--repeat-left-width);
  background: url(../img/secret/bg-repeat-left.svg) repeat-y left top / 100% calc(var(--repeat-left-height) + var(--repeat-left-gap));
  position: absolute;
  top: calc(var(--top-left-offset-y) + var(--top-left-height) + var(--repeat-left-offset-y));
  left: var(--repeat-left-offset-x);
  bottom: 0;
}
.p-bg__repeat-right {
  width: var(--repeat-right-width);
  background: url(../img/secret/bg-repeat-right.svg) repeat-y right top / 100% calc(var(--repeat-right-height) + var(--repeat-right-gap));
  position: absolute;
  top: calc(var(--top-right-offset-y) + var(--top-right-height) + var(--repeat-right-offset-y));
  right: var(--repeat-right-offset-x);
  bottom: 0;
}

.p-mv {
  display: flow-root;
  aspect-ratio: 1920 / 922;
  background:
    url(../img/secret/mv-bg.svg) no-repeat center top / auto calc(535 / 922 * 100%),
    linear-gradient(#e5e5e6) no-repeat center bottom / 100% calc((922 - 535) / 922 * 100%);
  container-type: inline-size;
  @media (max-width: 767.98px) {
    width: calc(1920 / 1440 * 100%);
    margin-inline: calc((1440 - 1920) / 2 / 1440 * 100%);
  }
}
.p-mv__head {
  display: grid;
  grid-template-columns: minmax(0, auto);
  margin-top: calc(485.5 / 1920 * 100cqw);
  position: relative;
  z-index: 2;
}
.p-mv__catch {
  width: fit-content;
  margin-inline: auto;
  margin-bottom: calc(30.25 / 1920 * 100cqw);
  border-radius: calc(16 / 1920 * 100cqw);
  padding: 1.1em 2.75em;
  background-color: #0075c2;
  font-size: calc(32 / 1920 * 100cqw);
  position: relative;
  &::after {
    content: "";
    display: block;
    height: calc(30.25 / 1920 * 100cqw);
    background: url(../img/secret/mv-catch-bg.svg) no-repeat center bottom / 622.899px auto;
    position: absolute;
    top: 100%;
    inset-inline: 0;
  }
  img {
    width: calc(447.808 / 32 * 1em);
  }
}
.p-mv__title {
  width: fit-content;
  margin-top: calc(11.6 / 1920 * 100cqw);
  margin-inline: auto;
  font-size: calc(77 / 1920 * 100cqw);
  text-align: center;
  img {
    width: calc(939.253 / 77 * 1em);
  }
}
.p-mv__subtitle {
  width: fit-content;
  margin-top: calc(33.3 / 1920 * 100cqw);
  margin-inline: auto;
  font-size: calc(38.5 / 1920 * 100cqw);
  text-align: center;
  img {
    width: calc(493.034 / 38.5 * 1em);
  }
}
.p-mv__lead {
  margin-top: calc(45.6 / 1920 * 100cqw);
  margin-right: -0.05em;
  position: relative;
  line-height: calc(29 / 20);
  font-size: calc(20 / 1920 * 100cqw);
  /* font-feature-settings: "palt";
  letter-spacing: 0.05em; */
  text-align: center;
  z-index: 2;
  @media (max-width: 767.98px) {
    width: calc(340 / 420 * 100 * var(--vw));
    margin-inline: auto;
    font-size: 10px;
  }
}

.p-toc {
  position: fixed;
  right: 0;
  bottom: 14.7%;
  overflow: clip;
  z-index: 3;
  @media (max-width: 1500px) {
    padding-top: 50px;
    padding-inline: calc(30 / 420 * 100%);
    background-color: #e5e5e6;
    position: relative;
    inset: auto;
    text-align: center;
    z-index: revert;
  }
}
.p-toc__title {
  border-top-left-radius: calc(30 / 20 * 1em);
  padding-block: calc(20 / 20 * 1em) calc(23 / 20 * 1em);
  padding-inline: calc(34 / 20 * 1em);
  background-color: #0075c2;
  position: relative;
  color: #fff;
  font-weight: 700;
  line-height: calc(29 / 20);
  font-size: clamp(1.6rem, 2 * var(--vw), 2rem);
  z-index: 3;
  @media (max-width: 1500px) {
    border-top-right-radius: calc(30 / 20 * 1em);
  }
}
.p-toc__list {
  border-bottom: clamp(2px, 0.4 * var(--vw), 4px) solid #0075c2;
  border-left: clamp(2px, 0.4 * var(--vw), 4px) solid #0075c2;
  border-bottom-left-radius: clamp(20px, 3 * var(--vw), 30px);
  padding-block: clamp(20px, 2.6 * var(--vw), 26px) clamp(20px, 3.4 * var(--vw), 34px);
  padding-inline: clamp(15px, 3.5 * var(--vw), 35px);
  background-color: #fff;
  position: relative;
  z-index: 3;
  @media (max-width: 1500px) {
    border-right: clamp(2px, 0.4 * var(--vw), 4px) solid #0075c2;
    border-bottom-right-radius: clamp(20px, 3 * var(--vw), 30px);
  }
}
.p-toc__item {
  color: #0075c2;
  font-weight: 700;
  line-height: calc(24 / 16);
  font-size: clamp(1.4rem, 1.6 * var(--vw), 1.6rem);
  &:nth-child(n + 2) {
    margin-top: 1.1em;
    border-top: 1px solid #0075c2;
    padding-top: 1.1em;
  }
}
.p-toc__item-link {
}

.p-secret {
  background-color: #e5e5e6;
  &:nth-child(1 of &) {
    padding-top: clamp(60px, 7.73 * var(--vw), 77.3px);
  }
  &:nth-child(n + 2 of &) {
    padding-top: clamp(80px, 13.8 * var(--vw), 138px);
  }
  &:nth-last-child(1 of &) {
    padding-bottom: clamp(60px, 10.8 * var(--vw), 108px);
  }
}
.p-secret__inner {
  max-width: 1440px;
}
.p-secret__box {
  border-radius: 50cqw / clamp(40px, 10 * var(--vw), 100px);
  background-color: #fff;
  position: relative;
  z-index: 2;
}
.p-secret__box-inner {
  width: 90%;
  max-width: 1200px;
  margin-inline: auto;
  padding-block: clamp(60px, 14 * var(--vw), 140px);
  position: relative;
  &:has(.p-secret__box-title) {
    @media (max-width: 767.98px) {
      padding-top: clamp(75px, 14 * var(--vw), 140px);
    }
  }
}
.p-secret__box-title {
  width: fit-content;
  border-radius: calc(11 / 25 * 1em);
  padding-block: calc(25 / 25 * 1em);
  padding-inline: min(100px, 20px + (100 - 20) * var(--slope-1260-420));
  margin-inline: auto;
  background-color: #0075c2;
  position: absolute;
  top: 0;
  inset-inline: 0;
  color: #fff;
  line-height: calc(36 / 25);
  font-size: clamp(1.8rem, 2.5 * var(--vw), 2.5rem);
  text-align: center;
  translate: 0 -50%;
  &::after {
    content: "";
    display: block;
    height: calc(27 / 25 * 1em);
    background: url(../img/secret/mv-catch-bg.svg) no-repeat center bottom / calc(622.899 / 30.25 * 27 / 25 * 1em) auto;
    position: absolute;
    top: 100%;
    inset-inline: 0;
  }
}
.p-secret__tarks {
  display: grid;
  grid-template-columns: minmax(0, auto);
  row-gap: clamp(25px, 3.1 * var(--vw), 31px);
  max-width: 1096px;
  margin-inline: auto;
}
.p-secret__talk {
  display: grid;
  grid-template-columns: minmax(0, auto) minmax(0, auto);
  column-gap: clamp(20px, 3.88 * var(--vw), 38.8px);
}
.p-secret__talk--blue {
  --balloon-background-color: #cce3f3;
}
.p-secret__talk--yellow {
  --balloon-background-color: #fbf2cc;
}
.p-secret__talk--left {
  justify-content: start;
}
.p-secret__talk--right {
  justify-content: end;
}
.p-secret__talk-icon {
  width: clamp(65px, 10.1 * var(--vw), 101px);
  .p-secret__talk--right & {
    order: 2;
  }
}
.p-secret__talk-balloon {
  align-content: center;
  /* border-radius: 5em; */
  border-radius: clamp(20px, 5.1 * var(--vw), 51px);
  padding-block: clamp(15px, 2.75 * var(--vw), 27.5px);
  padding-inline: clamp(15px, 3.2 * var(--vw), 32px);
  background-color: var(--balloon-background-color);
  position: relative;
  line-height: calc(45 / 20);
  font-size: clamp(1.4rem, 2 * var(--vw), 2rem);
  @media (max-width: 767.98px) {
    line-height: 1.6;
  }
  &::before {
    content: "";
    display: block;
    width: clamp(25px, 4.7 * var(--vw), 47px);
    height: calc(10 / 20 * 1em);
    margin-block: auto;
    border-radius: calc(5 / 20 * 1em);
    background-color: inherit;
    position: absolute;
    top: calc(45 / 20 * 1em);
    translate: 0 -50%;
  }
  .p-secret__talk--left & {
    &::before {
      left: 0;
      translate: -50% 0;
    }
  }
  .p-secret__talk--right & {
    &::before {
      right: 0;
      translate: 50% 0;
    }
  }
}
.p-secret__explain {
  margin-block: clamp(20px, 3 * var(--vw), 30px) clamp(10px, 3 * var(--vw), 30px);
}
.p-secret__explain-head {
  display: grid;
  grid-template: "..... title media" / minmax(5%, 1fr) minmax(0, max-content) minmax(5%, 1fr);
  border-radius: clamp(26px, 5.2 * var(--vw), 52px) clamp(26px, 5.2 * var(--vw), 52px) 0 0;
  background-color: #0075c2;
  color: #fff;
  @media (max-width: 767.98px) {
    grid-template: "media" "title" / minmax(0, auto);
    justify-items: center;
    padding-inline: 5%;
  }
}
.p-secret__explain-title {
  grid-area: title;
  align-self: center;
  padding-block: clamp(15px, 3.4 * var(--vw), 34px) clamp(20px, 3.4 * var(--vw), 34px);
  padding-right: calc(10 / 16 * 1em);
  font-weight: 700;
  line-height: calc(40 / 20);
  font-size: clamp(1.4rem, 2 * var(--vw), 2rem);
  text-align: center;
  /* letter-spacing: .05em;
  font-feature-settings: "palt"; */
  @media (max-width: 767.98px) {
    padding-right: 0;
  }
}
.p-secret__explain-media {
  grid-area: media;
  align-self: end;
  margin-top: calc(-1 * clamp(30px, 5 * var(--vw), 50px));
  img {
    width: calc(var(--width) * 1px);
    @media (max-width: 767.98px) {
      width: calc(var(--width) * 0.5 * 1px);
    }
  }
}
.p-secret__explain-body {
  border: clamp(2px, 0.4 * var(--vw), 4px) solid #0075c2;
  padding-block: clamp(20px, 4 * var(--vw), 40px);
  padding-inline: calc(20 / 1096 * 100%);
}
.p-secret__explain-row {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, auto);
  align-items: center;
  column-gap: calc(50 / 1096 * 100%);
  @media (max-width: 767.98px) {
    grid-auto-flow: row;
    row-gap: 20px;
  }
  &:not(:has(> .p-secret__explain-row-media)) {
    justify-content: center;
  }
}
.p-secret__explain-row-body {
}
.p-secret__explain-text {
  margin-right: -0.02em;
  line-height: calc(45 / 20);
  font-size: clamp(1.5rem, 2 * var(--vw), 2rem);
  letter-spacing: 0.02em;
  @media (max-width: 767.98px) {
    line-height: 2;
  }
}
.p-secret__explain-text-marker {
  background-image: linear-gradient(to bottom, transparent calc(50% - 0.4em), #fbf2cc calc(50% - 0.4em) calc(50% + 0.6em), transparent calc(50% + 0.6em));
  font-weight: 700;
}
.p-secret__explain-list {
  display: grid;
  row-gap: clamp(30px, 4.47 * var(--vw), 44.7px);
  counter-reset: explain-list;
  contain: inline-size;
  contain-intrinsic-inline-size: 100cqw;
  margin-block: 10px;
  text-align: left;
}
.p-secret__explain-item {
  display: grid;
  row-gap: 16.9px;
}
.p-secret__explain-item-title {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, auto);
  align-items: center;
  justify-content: start;
  width: fit-content;
  border-radius: 5em;
  padding-block: calc(15 / 20 * 1em);
  background-color: #0075c2;
  color: #fff;
  padding-right: 1.5em;
  font-weight: 700;
  line-height: calc(29 / 20);
  font-size: clamp(1.6rem, 2 * var(--vw), 2rem);
  &::before {
    content: counter(explain-list);
    counter-increment: explain-list;
    display: block;
    align-content: center;
    margin-right: 1em;
    border-right: 1px solid;
    padding-block: 1px;
    padding-inline: 1.1em 1em;
    font-size: clamp(2rem, 2.5 * var(--vw), 2.5rem);
  }
}
.p-secret__explain-item-body {
  line-height: calc(29 / 20);
  font-size: clamp(1.6rem, 2vw, 2rem);
}
.p-secret__explain-row-media {
}


/* 3/27 追加 */
.p-secret__talks-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  @media (max-width: 1110px) {
    flex-direction: column;
    gap: 30px;
  }
}
.p-secret__talks-wrapper {
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.p-secret__talk-img {
  width: 100%;
  max-width: 315px;
  @media (max-width: 767.98px) {
    max-width: 250px;
  }
}
.p-secret__explain-row-media-container {
  display: flex;
  justify-content: center;
  gap: 10px;
}
.p-secret__explain-row-media-container img {
  width: 100%;
  max-width: 325px;
  @media (max-width: 767.98px) {
    max-width: 270px;
  }
}
.p-secret__explain-row-media figcaption {
  font-size: 16px;
  text-align: center;
  @media (max-width: 767.98px) {
    font-size: 12px;
  }
}