@charset "UTF-8";
:root {
  --color-grand: #c7e8fa;
  --color-graphic01: #f2f6f8;
  --color-graphic02: #8fd1f4;
  --color-graphic03: #00a7ee;
  --color-graphic04: #05408f;
  --color-tdr01: #0077cc;
  --color-accent01: #ff7e00;
  --color-accent02: #c70c27;
  --color-accent03: #d4a900;
  --color-tdl01: #d02c72;
  --color-tdl02: #fef6fa;
  --color-tdl03: #ef5697;
  --color-tds01: #007788;
  --color-tds02: #f3fbfb;
  --color-tds03: #12a0a0;
  --color-white: #fff;
  --color-black: #000;
  --color-gray01: #5f6e76;
  --color-gray02: #c4cccf;
  --color-gray03: #e4f0f5;
  --color-gray04: #f5fcff;
  --color-gray05: #103c53;
  --color-gray06: #0b2a3b;
  --color-text-base: var(--color-black);
  --color-text-base-inverse: var(--color-white);
  --color-text-inverse: var(--color-white);
  --color-text-inverse-inverse: var(--color-black);
  --color-text-sub: var(--color-gray01);
  --color-text-sub-inverse: var(--color-gray02);
  --color-text-accent: var(--color-graphic03);
  --color-text-tds: var(--color-tds01);
  --color-text-logo: var(--color-graphic04);
  --color-text-logo-inverse: var(--color-graphic01);
  --color-text-error: var(--color-accent02);
  --color-text-tdl: var(--color-tdl01);
  --color-text-gold: var(--color-accent03);
  --color-bg-base: var(--color-graphic01);
  --color-bg-base-inverse: var(--color-gray05);
  --color-bg-inverse: var(--color-gray05);
  --color-bg-inverse-inverse: var(--color-graphic01);
  --color-bg-sub: var(--color-white);
  --color-bg-sub-inverse: var(--color-gray06);
  --color-bg-grand: var(--color-grand);
  --color-bg-tdl: var(--color-tdl02);
  --color-bg-tds: var(--color-tds02);
  --color-bg-story: var(--color-grand);
  --color-bg-story-inverse: var(--color-gray05);
  --color-bg-gold: var(--color-accent03);
  --color-line-base: var(--color-gray02);
  --color-line-base-inverse: var(--color-white);
  --color-line-soft: var(--color-gray03);
  --color-line-soft-inverse: var(--color-gray02);
  --color-line-inverse: var(--color-white);
  --color-line-inverse-inverse: var(--color-gray01);
  --color-line-button: var(--color-gray02);
  --color-line-button-inverse: var(--color-white);
  --color-line-button-accent: var(--color-graphic03);
  --color-line-tdl: var(--color-gray01);
  --color-line-filter: var(--color-gray01);
  --color-line-gold: var(--color-accent03);
  --color-line-story-hint: var(--color-accent03);
  --color-line-story-hint-inverse: var(--color-white);
  --color-line-story-speech-bubble: var(--color-white);
  --color-line-story-speech-bubble-inverse: var(--color-gray06);
  --color-parts-base: var(--color-white);
  --color-parts-base-inverse: var(--color-gray05);
  --color-parts-inverse: var(--color-gray05);
  --color-parts-inverse-inverse: var(--color-white);
  --color-parts-sub: var(--color-gray04);
  --color-parts-sub2: var(--color-graphic04);
  --color-parts-accent: var(--color-graphic03);
  --color-parts-conversion: var(--color-accent01);
  --color-parts-error: var(--color-accent02);
  --color-parts-tdl: var(--color-tdl01);
  --color-parts-tds: var(--color-tds01);
  --color-parts-accent-sub: var(--color-graphic02);
  --color-parts-gold: var(--color-accent03);
  --color-icon-base: var(--color-gray01);
  --color-icon-base-inverse: var(--color-white);
  --color-icon-inverse: var(--color-white);
  --color-icon-logo: var(--color-graphic04);
  --color-icon-tdl: var(--color-tdl03);
  --color-icon-tds: var(--color-tds03);
  --color-icon-tdh: var(--color-tdr01);
  --color-icon-gold: var(--color-accent03);
  --color-attraction: #eea301;
  --color-show: #dd1b7d;
  --color-restaurant: #15a452;
  --color-greeting: #1844c4;
  --color-hotel: #0077cc;
  --font-family-ja: 'Hiragino Kaku Gothic Pro';
  --font-family-en: 'Lexend';
  --base-line-height: 1.5;
  --container-max-width-pc: 1280px;
  --content-width-medium: 1080px;
  --content-width-narrow: 728px;
  --button-max-width: 480px;
  --space-96: 96px;
  --space-80: 80px;
  --space-64: 64px;
  --space-48: 48px;
  --space-32: 32px;
  --space-20: 20px;
  --space-16: 16px;
  --space-12: 12px;
  --space-8: 8px;
  --space-4: 4px;
  --font-size-heading-latin: 56px;
  --font-size-heading-lv1: 32px;
  --font-size-heading-lv2: 28px;
  --font-size-heading-lv3: 24px;
  --font-size-heading-lv4: 20px;
  --font-size-card-title: 16px;
  --font-size-body: 16px;
  --font-size-caption: 12px;
  --font-size-story-body: 20px;
  --font-size-story-speech-bubble: 24px;
  --font-size-voice: 20px;
  --font-size-tag-label: 14px;
  --font-size-story-card-title: 20px;
  --font-size-story-day: 90px;
  --font-weight-regular: 300;
  --font-weight-bold: 600;
  --space-y-lv0: var(--space-96);
  --space-y-lv1: var(--space-64);
  --space-y-lv2: var(--space-48);
  --space-y-lv3: var(--space-16);
  --space-y-lv4: var(--space-8);
  --space-y-lv5: var(--space-4);
  --space-y-story-section: var(--space-48);
  --space-x-side: var(--space-20);
  --space-x-column: var(--space-20);
  --space-x-story-section: var(--space-64);
  --round-big: 24px;
  --round-small: 12px;
  --round-story-picture: 12px;
}

@media (max-width: 767px) {
  :root {
    --font-size-heading-latin: 40px;
    --font-size-heading-lv1: 24px;
    --font-size-heading-lv2: 20px;
    --font-size-heading-lv3: 16px;
    --font-size-heading-lv4: 14px;
    --font-size-card-title: 16px;
    --font-size-body: 14px;
    --font-size-caption: 12px;
    --font-size-story-body: 16px;
    --font-size-story-speech-bubble: 14px;
    --font-size-voice: 16px;
    --font-size-tag-label: 12px;
    --font-size-story-card-title: 16px;
    --font-size-story-day: 72px;
    --button-max-width: 300px;
    --space-y-lv0: var(--space-80);
    --space-y-lv1: var(--space-48);
    --space-y-lv2: var(--space-32);
    --space-y-lv3: var(--space-16);
    --space-y-lv4: var(--space-8);
    --space-y-lv5: var(--space-4);
    --space-y-story-section: var(--space-20);
    --space-x-side: var(--space-20);
    --space-x-column: var(--space-20);
    --space-x-story-section: var(--space-32);
    --round-big: 20px;
    --round-small: 8px;
    --round-story-picture: 8px;
  }
}
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section main {
  display: block;
}

button {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none; /* OSネイティブの見た目を消す（Safariなど） */
  border: none;
  background: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
}

.vp-main {
  position: relative;
  line-height: var(--base-line-height);
  margin-top: var(--space-8);
}
@media (min-width: 768px) {
  .vp-main {
    margin-top: 0;
  }
}
.vp-main a,
.vp-main button {
  transition: opacity 0.3s ease;
}
@media (hover: hover) and (pointer: fine) {
  .vp-main a:not(.vp-no-hoverfade)[href]:not([href=""]):hover, .vp-main a:not(.vp-no-hoverfade):not(a):not([disabled]):hover,
  .vp-main button:not(.vp-no-hoverfade)[href]:not([href=""]):hover,
  .vp-main button:not(.vp-no-hoverfade):not(a):not([disabled]):hover {
    opacity: 0.7;
  }
  .vp-main a:is(a:not([href]), a[href=""], button:disabled),
  .vp-main button:is(a:not([href]), a[href=""], button:disabled) {
    cursor: default;
    pointer-events: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .vp-main a,
  .vp-main button {
    transition: none;
  }
}
@media (hover: hover) and (pointer: fine) {
  .vp-main .vp-no-hoverfade:hover {
    opacity: 1;
  }
}

.vp-is-pc {
  display: none !important;
}

.vp-is-pc-standard {
  display: none !important;
}

.vp-is-pc-wide {
  display: none !important;
}

.vp-is-sp {
  display: block !important;
}

@media (min-width: 768px) {
  .vp-is-pc {
    display: block !important;
  }
  .vp-is-pc-standard {
    display: block !important;
  }
  .vp-is-sp {
    display: none !important;
  }
}
@media (min-width: 1441px) {
  .vp-is-pc-standard {
    display: none !important;
  }
  .vp-is-pc-wide {
    display: block !important;
  }
}
.vp-button-wrapper {
  display: flex;
  justify-content: center;
}

.vp-button, .vp-plan-detail-section .vp-plan-detail-section__hint-button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  padding: var(--space-16) 46px var(--space-16) var(--space-32);
  min-width: 240px;
  max-width: var(--button-max-width);
  box-sizing: border-box;
  font-size: var(--font-size-body);
  font-weight: var(--font-weight-bold);
  text-align: center;
  border-radius: 60px;
}
.vp-button::after, .vp-plan-detail-section .vp-plan-detail-section__hint-button::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
}
.vp-button.vp-button--primary, .vp-plan-detail-section .vp-button--primary.vp-plan-detail-section__hint-button {
  color: var(--color-text-base-inverse);
  background: var(--color-parts-accent);
}
.vp-button.vp-button--primary::after, .vp-plan-detail-section .vp-button--primary.vp-plan-detail-section__hint-button::after {
  background-image: url("../../images/vp/common/icon-arrow-right-white.svg");
}
.vp-button.vp-button--primary.is-disabled, .vp-plan-detail-section .vp-button--primary.is-disabled.vp-plan-detail-section__hint-button {
  background: var(--color-gray02);
  color: var(--color-gray01);
  cursor: not-allowed;
  pointer-events: none;
}
.vp-button.vp-button--primary.is-disabled::after, .vp-plan-detail-section .vp-button--primary.is-disabled.vp-plan-detail-section__hint-button::after {
  background-image: url("../../images/vp/common/icon-arrow-right-gray.svg");
}
.vp-button.vp-button--secondary, .vp-plan-detail-section .vp-plan-detail-section__hint-button {
  color: var(--color-text-sub);
  border: 1px solid var(--color-line-button);
  background: var(--color-bg-sub);
}
.vp-button.vp-button--secondary::after, .vp-plan-detail-section .vp-plan-detail-section__hint-button::after {
  background-image: url("../../images/vp/common/icon-arrow-right-gray.svg");
}
.vp-button.vp-button--secondary-inverse, .vp-plan-detail-section .vp-button--secondary-inverse.vp-plan-detail-section__hint-button {
  color: var(--color-text-sub-inverse);
  border: 1px solid var(--color-line-button-inverse);
  background: var(--color-bg-sub-inverse);
}
.vp-button.vp-button--secondary-inverse::after, .vp-plan-detail-section .vp-button--secondary-inverse.vp-plan-detail-section__hint-button::after {
  background-image: url("../../images/vp/common/icon-arrow-right-white.svg");
}
.vp-button.vp-button--conversion-sticky, .vp-plan-detail-section .vp-button--conversion-sticky.vp-plan-detail-section__hint-button {
  padding: 11px 10px;
  min-width: auto;
  color: var(--color-text-base-inverse);
  font-size: var(--font-size-caption);
  background: var(--color-parts-conversion);
  box-shadow: 0px 1px 2px 0px rgba(95, 110, 118, 0.5019607843);
  border-radius: 30px;
  letter-spacing: calc(var(--font-size-caption) * -1.1 / 100);
}
.vp-button.vp-button--conversion-sticky::after, .vp-plan-detail-section .vp-button--conversion-sticky.vp-plan-detail-section__hint-button::after {
  content: none;
}
@media (min-width: 768px) {
  .vp-button.vp-button--conversion-sticky, .vp-plan-detail-section .vp-button--conversion-sticky.vp-plan-detail-section__hint-button {
    padding: 16px 23.5px;
    font-size: var(--font-size-card-title);
  }
}
.vp-button.vp-button--block, .vp-plan-detail-section .vp-button--block.vp-plan-detail-section__hint-button {
  width: 100%;
  display: flex;
}

.vp-content-table-wrapper .vp-content-table-wrapper__scroll-hint {
  display: none;
}
.vp-content-table-wrapper .vp-content-table-wrapper__scroller {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.vp-content-table-wrapper:has(+ .vp-note-list) {
  margin-bottom: var(--space-12);
}
@media (min-width: 768px) {
  .vp-content-table-wrapper {
    position: relative;
  }
  .vp-content-table-wrapper .vp-content-table-wrapper__scroller {
    overflow: hidden;
  }
  .vp-content-table-wrapper .vp-content-table-wrapper__scroll-hint {
    position: absolute;
    display: block;
    z-index: 2;
    top: 50%;
    transform: translateY(-50%);
    right: 24px;
    display: block;
    content: "";
    width: 53px;
    height: 53px;
    background-image: url("../../images/vp/common/icon-arrow-right-circle.svg");
    animation: scroll-hint-blink 3s ease-in-out infinite;
    opacity: 1;
    transition: opacity 0.4s ease;
  }
  .vp-content-table-wrapper .vp-content-table-wrapper__scroll-hint.vp-is-hidden {
    animation: none;
    opacity: 0;
    pointer-events: none;
  }
  @keyframes scroll-hint-blink {
    0%, 100% {
      opacity: 0.3;
    }
    50% {
      opacity: 1;
    }
  }
}

.vp-content-table {
  border-collapse: collapse;
  table-layout: fixed;
  width: 1188px;
  min-width: 100%; /* 親幅に応じて広げる */
  font-size: var(--font-size-caption);
  color: var(--color-text-inverse);
  border-bottom: 1px solid var(--color-line-base-inverse);
  background: var(--color-bg-inverse);
}
@media (min-width: 768px) {
  .vp-content-table {
    width: 1380px;
  }
  .vp-content-table tbody {
    cursor: grab;
  }
  .vp-content-table.vp-is-grabbing tbody {
    cursor: grabbing;
  }
}
.vp-content-table th:first-child,
.vp-content-table td:first-child {
  box-sizing: border-box;
  width: 156px;
}
.vp-content-table th:not(:first-child),
.vp-content-table td:not(:first-child) {
  box-sizing: border-box;
  width: 129px;
}
@media (min-width: 768px) {
  .vp-content-table th:not(:first-child),
  .vp-content-table td:not(:first-child) {
    width: 153px;
  }
}
.vp-content-table thead {
  border-bottom: 2px solid var(--color-line-base-inverse);
}
.vp-content-table thead th {
  position: relative;
  padding: var(--space-8) var(--space-8) var(--space-12);
  height: 102px;
  vertical-align: middle;
}
.vp-content-table thead th .vp-content-table__link {
  color: var(--color-text-base-inverse);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 6px;
  height: 100%;
}
.vp-content-table thead th .vp-content-table__th-text {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
  margin: auto 0;
}
.vp-content-table thead th .vp-content-table__link-cta {
  display: block;
  padding: 2px 9px;
  color: var(--color-gray05);
  border-radius: 4px;
  background: var(--color-parts-base);
  flex-shrink: 0;
}
.vp-content-table thead th:first-child {
  position: sticky;
  left: 0;
  z-index: 4;
  background: var(--color-bg-inverse);
}
.vp-content-table tbody tr.vp-content-table__row.vp-content-table__row--accent {
  background: rgba(255, 255, 255, 0.05);
}
.vp-content-table tbody th.vp-content-table__th {
  position: sticky;
  left: 0;
  z-index: 3;
  background: var(--color-bg-inverse);
  padding: var(--space-8);
  border-right: 1px solid var(--color-line-soft-inverse);
  vertical-align: middle;
}
.vp-content-table tbody th.vp-content-table__th .vp-content-table__th-content {
  display: flex;
  align-items: center;
  gap: var(--space-8);
}
.vp-content-table tbody th.vp-content-table__th .vp-content-table__th-content img {
  width: 40px;
  height: 40px;
}
.vp-content-table tbody th.vp-content-table__th .vp-content-table__th-content span {
  text-align: left;
}
.vp-content-table tbody tr.vp-content-table__row--accent > th.vp-content-table__th {
  background: #1c465c;
}
.vp-content-table tbody td.vp-content-table__td {
  vertical-align: middle;
  position: relative;
  padding: var(--space-8);
  text-align: center;
  border-right: 1px solid var(--color-line-soft-inverse);
}
.vp-content-table tbody td.vp-content-table__td::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  content: "";
  width: 8px;
  height: 8px;
  clip-path: polygon(0 0, 100% 0, 0 100%);
}
.vp-content-table tbody td.vp-content-table__td.vp-content-table__td--tdl::before {
  background: var(--color-icon-tdl);
}
.vp-content-table tbody td.vp-content-table__td.vp-content-table__td--tds::before {
  background: var(--color-icon-tds);
}
.vp-content-table tbody td.vp-content-table__td.vp-content-table__td--note::after {
  content: "※";
  font-size: 8px;
}
.vp-content-table .vp-content-table__legend {
  display: flex;
  position: absolute;
  bottom: 12px;
  left: var(--space-10);
  padding: 10px;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-8);
  font-size: 10px;
  border-radius: var(--round-small);
  background: var(--color-bg-sub-inverse);
}
.vp-content-table .vp-content-table__legend .vp-content-table__legend-item {
  display: flex;
  align-items: center;
  gap: 10px;
}
.vp-content-table .vp-content-table__legend .vp-content-table__legend-item::before {
  display: block;
  content: "";
  width: 8px;
  height: 8px;
  clip-path: polygon(0 0, 100% 0, 0 100%);
}
.vp-content-table .vp-content-table__legend .vp-content-table__legend-item.vp-content-table__legend-item--tdl::before {
  background: var(--color-icon-tdl);
}
.vp-content-table .vp-content-table__legend .vp-content-table__legend-item.vp-content-table__legend-item--tds::before {
  background: var(--color-icon-tds);
}

ul.vp-note-list {
  padding: 0 var(--space-x-side);
}
ul.vp-note-list .vp-note-list__item {
  position: relative;
  font-size: var(--font-size-caption);
  color: var(--color-text-sub-inverse);
  padding-left: 16px;
}
ul.vp-note-list .vp-note-list__item::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "※";
}

.vp-link-planfinder {
  display: block;
  margin-inline: auto;
  width: calc(350 / 390 * 100vw);
  aspect-ratio: 350/244;
  background-image: url("../../images/vp/common/planfinder-link-sp.png");
  background-size: 100%;
  background-repeat: no-repeat;
}
@media (min-width: 768px) {
  .vp-link-planfinder {
    width: 728px;
    height: 191px;
    background-image: url("../../images/vp/common/planfinder-link-pc.png");
  }
}

.vp-modal {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: opacity 0.3s ease;
}
.vp-modal.vp-is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.vp-modal .vp-modal-overlay {
  position: fixed;
  z-index: 101;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.2);
}

.vp-page-heading {
  color: var(--color-text-accent);
  margin-bottom: var(--space-16);
}
.vp-page-heading .vp-page-heading__title {
  font-family: var(--font-family-en);
  font-size: var(--font-size-heading-latin);
  font-weight: var(--font-weight-regular);
}
.vp-page-heading .vp-page-heading__desc {
  display: block;
  font-size: var(--font-size-heading-lv3);
  font-weight: var(--font-weight-bold);
}

.vp-heading-lv1 {
  color: var(--color-graphic03);
  font-size: 24px;
  font-weight: var(--font-weight-bold);
  margin-bottom: var(--space-32);
}
@media (min-width: 768px) {
  .vp-heading-lv1 {
    font-size: 32px;
    margin-bottom: var(--space-48);
  }
}

.vp-heading-lv2 {
  color: var(--color-black);
  font-size: 20px;
  font-weight: var(--font-weight-bold);
  margin-top: var(--space-32);
}
@media (min-width: 768px) {
  .vp-heading-lv2 {
    font-size: 28px;
    margin-top: var(--space-48);
  }
}

.vp-heading-lv3 {
  color: var(--color-black);
  font-size: 16px;
  font-weight: var(--font-weight-bold);
  margin-top: var(--space-16);
}
@media (min-width: 768px) {
  .vp-heading-lv3 {
    font-size: 24px;
  }
}

.vp-plan-card {
  display: block;
  border-radius: var(--round-big);
  overflow: hidden;
  background: #fff;
  height: 100%;
}
.vp-plan-card .vp-plan-card__body {
  padding: var(--space-20) var(--space-20) var(--space-20);
}
.vp-plan-card .vp-plan-card__catch {
  position: relative;
  padding-left: 19px;
  font-size: var(--font-size-caption);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-accent);
}
.vp-plan-card .vp-plan-card__catch::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  display: block;
  margin-right: var(--space-4);
  width: 14.87px;
  height: 17.04px;
  background-image: url("../../images/vp/common/icon-sparkle-01.svg");
}
.vp-plan-card .vp-plan-card__title {
  margin-top: var(--space-8);
  font-size: var(--font-size-card-title);
  font-weight: var(--font-weight-bold);
}
.vp-plan-card .vp-plan-card__note {
  margin-top: var(--space-8);
  font-size: var(--font-size-caption);
  color: var(--color-text-sub);
}
.vp-plan-card .vp-plan-card__tags {
  display: flex;
  gap: var(--space-4) var(--space-y-lv4);
  flex-wrap: wrap;
  margin-top: var(--space-12);
  font-size: var(--font-size-caption);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-sub);
}
.vp-plan-card .vp-plan-card__tags .vp-plan-card__tag {
  display: flex;
}
.vp-plan-card .vp-plan-card__tags .vp-plan-card__tag::before {
  content: "";
  display: block;
  margin-right: 1px;
  width: 7px;
  height: 16px;
  background-image: url("../../images/vp/common/icon-hash-tag.svg");
  flex-shrink: 0;
}

:root {
  --vp-sticky-actions-offset: 20px;
}

.vp-sticky-actions-sentinel {
  position: absolute;
  z-index: 3;
  top: var(--vp-sticky-actions-offset);
}

.vp-sticky-actions {
  display: flex;
  gap: 6px;
  position: absolute;
  z-index: 3;
  top: var(--vp-sticky-actions-offset);
  right: 4px;
}
@media (min-width: 768px) {
  .vp-sticky-actions {
    right: 20px;
  }
}
.vp-sticky-actions.vp-is-fixed {
  position: fixed;
  top: 20px;
}
.vp-sticky-actions .vp-sticky-actions__cta {
  opacity: 1;
  transition: opacity 0.3s ease-in-out;
  min-width: 75px;
  display: block;
}
@media (min-width: 768px) {
  .vp-sticky-actions .vp-sticky-actions__cta {
    min-width: 120px;
  }
}
.vp-sticky-actions .vp-sticky-actions__cta.vp-is-hidden {
  opacity: 0;
  pointer-events: none;
}
.vp-sticky-actions .vp-sticky-actions__menu-button {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 3px;
  padding: 14px 12.5px;
  width: 40px;
  height: 40px;
  background: var(--color-parts-base);
  box-shadow: 0px 1px 2px 0px rgba(95, 110, 118, 0.5019607843);
  border-radius: 30px;
}
@media (min-width: 768px) {
  .vp-sticky-actions .vp-sticky-actions__menu-button {
    width: 56px;
    height: 56px;
    gap: 4.2px;
  }
}
.vp-sticky-actions .vp-sticky-actions__decor-lines {
  display: block;
  height: 2px;
  width: 100%;
  border-radius: 20px;
  background: #152e3b;
}
@media (min-width: 768px) {
  .vp-sticky-actions .vp-sticky-actions__decor-lines {
    height: 2.8px;
  }
}

.vp-drawer-overlay {
  position: fixed;
  inset: 0;
  z-index: 900;
  display: none;
}
@media (min-width: 768px) {
  .vp-drawer-overlay {
    display: block;
    background: rgba(0, 0, 0, 0.5);
    opacity: 1;
    transition: opacity 0.25s ease;
  }
  .vp-drawer-overlay[hidden] {
    display: block;
    opacity: 0;
    pointer-events: none;
  }
}

.vp-drawer-menu {
  box-sizing: border-box;
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100dvh;
  background: var(--color-grand);
  z-index: 910;
  padding: var(--space-y-lv1) 20px;
  /* フェード */
  opacity: 1;
  transition: opacity 0.25s ease;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.vp-drawer-menu[hidden] {
  /* hiddenでもフェードさせたいので display は維持 */
  display: block;
  opacity: 0;
  pointer-events: none;
}
@media (min-width: 768px) {
  .vp-drawer-menu {
    /* PCでは右側のドロワーサイズに戻す（ただし動きはフェード） */
    inset: auto;
    top: 0;
    right: 0;
    width: 88%;
    max-width: 446px;
    height: 100vh;
    padding: 48px 32px;
  }
}

/* ---------- inner ---------- */
.vp-drawer-menu__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--space-32);
}

.vp-drawer-menu__title {
  font-family: var(--font-family-en);
  color: var(--color-graphic04);
  font-size: 40px;
  letter-spacing: 1.2px;
  font-weight: 300;
}

.vp-drawer-menu__close {
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  background-image: url("../../images/vp/common/icon-close-navy.svg");
  background-repeat: no-repeat;
  cursor: pointer;
}

.vp-drawer-menu__list {
  background-color: var(--color-white);
  border-radius: 8px;
  padding: 0 16px;
}
.vp-drawer-menu__list li {
  border-bottom: 1px solid var(--color-gray03);
  min-height: 64px;
  display: flex;
  align-items: center;
}
.vp-drawer-menu__list a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 12px 20px;
  padding-right: 44px;
  position: relative;
  color: var(--color-graphic04);
  font-size: 16px;
  font-weight: var(--font-weight-bold);
  text-decoration: none;
}
.vp-drawer-menu__list a::after {
  content: "";
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  background: url("../../images/vp/common/icon-arrow-right-navy.svg") no-repeat center/contain;
}

/* ===== drawer menu: below list area ===== */
.vp-drawer-menu__card {
  display: block;
  position: relative;
  margin-top: 32px;
  border-radius: 8px;
  border: 1px solid var(--color-gray03);
  background: linear-gradient(180deg, #ebf9fe 0%, #e3f7fe 100%);
  padding: 12px 12px 16px 20px;
  text-decoration: none;
  color: var(--color-graphic04);
  overflow: visible;
}

.vp-drawer-menu__card-body {
  flex: 1;
  min-width: 0;
}

.vp-drawer-menu__card-title {
  font-family: var(--font-family-en);
  font-size: 24px;
  font-weight: 300;
}

.vp-drawer-menu__card-text {
  font-size: 12px;
}

.vp-drawer-menu__card-media {
  position: absolute;
  right: 44px;
  bottom: 0;
  width: 82px;
  pointer-events: none;
}
.vp-drawer-menu__card-media img {
  display: block;
  width: 100%;
  height: auto;
}

.vp-drawer-menu__card-arrow {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 18px;
  height: 18px;
  background: url("../../images/vp/common/icon-arrow-right-navy.svg") no-repeat center/contain;
  pointer-events: none;
}

/* ===== CTA box ===== */
.vp-drawer-menu__cta {
  margin-top: 12px;
  background: var(--color-white);
  border-radius: 8px;
  padding: 20px;
}

.vp-drawer-menu__cta-title {
  margin: 0 0 16px;
  text-align: center;
  font-size: 16px;
  font-weight: var(--font-weight-bold);
  color: var(--color-graphic04);
  display: flex;
  gap: 5px;
  justify-content: center;
}
.vp-drawer-menu__cta-title-slash {
  font-family: "Cascadia Mono", "Consolas", "Menlo", "SFMono-Regular", "Courier New", monospace;
}

.vp-button.vp-button--drawer-menu, .vp-plan-detail-section .vp-button--drawer-menu.vp-plan-detail-section__hint-button {
  background: var(--color-accent01);
  font-size: 14px;
}

/* ===== footer links ===== */
.vp-drawer-menu__footer-links {
  margin-top: 32px;
  color: var(--color-gray01);
}

.vp-drawer-menu__footer-about {
  margin-top: 32px;
}

.vp-drawer-menu__footer-heading {
  color: var(--color-black);
  font-size: 14px;
  font-weight: var(--font-weight-bold);
  margin-bottom: 4px;
}

.vp-drawer-menu__footer-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 32px;
}
.vp-drawer-menu__footer-row:first-child {
  margin-top: 0;
}

.vp-drawer-menu__footer-link {
  font-size: 12px;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.vp-story-card {
  display: block;
  border-radius: var(--round-big);
  text-decoration: none;
  position: relative;
  padding-left: 20px;
}
@media (min-width: 768px) {
  .vp-story-card {
    min-height: 387px;
  }
}
.vp-story-card__image {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 16/9;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: var(--round-big);
}
.vp-story-card__body {
  padding: var(--space-16) var(--space-16) var(--space-20);
  border-radius: 0 var(--round-big) var(--round-big) var(--round-big);
  background: var(--color-white);
  box-sizing: border-box;
  position: relative;
  z-index: 1;
  margin-top: -10px;
  margin-left: -20px;
  margin-right: 20px;
}
@media (min-width: 768px) {
  .vp-story-card__body {
    min-height: 176px;
  }
}
.vp-story-card__number {
  background: var(--color-white);
  position: absolute;
  left: 0;
  top: -44px;
  border-radius: 12px 12px 0 0;
  padding: 12px 12px 0;
  width: 58px;
  height: 45px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-weight: var(--font-weight-bold);
  color: var(--color-text-accent);
  font-family: var(--font-family-en);
}
.vp-story-card__number-label {
  font-size: 10px;
}
.vp-story-card__number-value {
  font-size: 20px;
  margin-top: -2px;
}
.vp-story-card__lead {
  font-size: var(--font-size-tag-label);
  color: var(--color-text-primary);
  font-weight: var(--font-weight-bold);
  margin-bottom: 2px;
}
.vp-story-card__title {
  font-size: var(--font-size-story-card-title);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-primary);
  margin-bottom: var(--space-8);
}
.vp-story-card__description {
  font-size: 12px;
  color: var(--color-text-sub);
  overflow: hidden;
}
@media (min-width: 768px) {
  .vp-story-card__description {
    font-size: 14px;
  }
}
.vp-story-card.vp-story-card--inverse .vp-story-card__body,
.vp-story-card.vp-story-card--inverse .vp-story-card__number {
  background: var(--color-bg-sub-inverse);
}
.vp-story-card.vp-story-card--inverse .vp-story-card__lead,
.vp-story-card.vp-story-card--inverse .vp-story-card__title {
  color: var(--color-text-base-inverse);
}
.vp-story-card.vp-story-card--inverse .vp-story-card__description {
  color: var(--color-text-sub-inverse);
}

.vp-text-lead {
  color: var(--color-black);
  font-size: 16px;
  font-weight: var(--font-weight-bold);
  text-align: center;
}

.vp-text-m {
  color: var(--color-black);
  margin-top: var(--space-16);
  font-size: 14px;
}
@media (min-width: 768px) {
  .vp-text-m {
    font-size: 16px;
  }
}

.vp-main--type-subpage .vp-list-number {
  color: var(--color-black);
  list-style: decimal;
  padding-left: 1.4em;
  font-size: 14px;
  margin-top: var(--space-16);
}
@media (min-width: 768px) {
  .vp-main--type-subpage .vp-list-number {
    font-size: 16px;
  }
}
.vp-main--type-subpage .vp-list-number li + li {
  margin-top: 4px;
}
.vp-main--type-subpage .vp-list {
  color: var(--color-black);
  font-size: 14px;
  margin-top: var(--space-16);
}
@media (min-width: 768px) {
  .vp-main--type-subpage .vp-list {
    font-size: 16px;
  }
}
.vp-main--type-subpage .vp-list li {
  padding-left: 16px;
  position: relative;
}
.vp-main--type-subpage .vp-list li::before {
  content: "・";
  position: absolute;
  left: 0;
}
.vp-main--type-subpage .vp-list li + li {
  margin-top: 4px;
}
.vp-main--type-subpage .vp-list-note {
  color: var(--color-gray01);
  font-size: 12px;
  margin-top: var(--space-16);
}
.vp-main--type-subpage .vp-list-note li {
  margin-left: 1em;
  text-indent: -1em;
}
.vp-main--type-subpage .vp-list-note li::before {
  margin-right: 4px;
  content: "※";
}
.vp-main--type-subpage .vp-list-note li + li {
  margin-top: 4px;
}
.vp-main--type-subpage .vp-list-link {
  margin-top: var(--space-16);
}
.vp-main--type-subpage .vp-list-link li + li {
  margin-top: 8px;
}
.vp-main--type-subpage .vp-list-link a {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  text-decoration: underline;
  text-underline-offset: 3.5px;
  color: var(--color-graphic04);
  font-size: 14px;
}
.vp-main--type-subpage .vp-list-link a::before {
  content: "";
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  margin-top: 2px;
  background: url("../../images/vp/common/icon-arrow-right-circle-navy-link.svg") no-repeat center/22px 22px;
}
@media (min-width: 768px) {
  .vp-main--type-subpage .vp-list-link a {
    font-size: 16px;
  }
}

.vp-top-highlights {
  overflow: hidden;
}
@media (min-width: 768px) {
  .vp-top-highlights .vp-top-highlights__inner {
    margin-left: auto;
    margin-right: auto;
    padding-right: 0;
    padding-left: 0;
    max-width: var(--container-max-width-pc);
  }
}
.vp-top-highlights .vp-top-highlights__inner {
  padding: var(--space-32) 0 var(--space-y-lv1);
}
.vp-top-highlights .vp-top-highlights__block {
  position: relative;
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--1 .vp-top-highlights__facility {
  width: calc(200 / 390 * 100vw);
  margin-left: auto;
  margin-right: calc(10 / 390 * 100vw);
  opacity: 0;
  transition: opacity 300ms ease-out;
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--1 .vp-top-highlights__card {
  transform: translateY(calc(30 / 390 * 100vw));
  margin-top: calc(-152 / 390 * 100vw);
  margin-left: calc(20 / 390 * 100vw);
  width: calc(250 / 390 * 100vw);
  opacity: 0;
  transition: opacity 500ms ease-out, transform 500ms ease-out;
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--1 .vp-top-highlights__sparkle {
  position: absolute;
  right: calc(70 / 390 * 100vw);
  bottom: calc(0 / 390 * 100vw);
  width: calc(41 / 390 * 100vw);
  opacity: 0;
  transition: opacity 600ms ease-out, bottom 600ms ease-out;
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--1.vp-is-active .vp-top-highlights__facility {
  opacity: 1;
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--1.vp-is-active .vp-top-highlights__card {
  opacity: 1;
  transform: translateY(0);
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--1.vp-is-active .vp-top-highlights__sparkle {
  opacity: 1;
  bottom: calc(0 / 390 * 100vw);
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--2 {
  margin-top: calc(20 / 390 * 100vw);
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--2 .vp-top-highlights__facility {
  width: calc(150 / 390 * 100vw);
  margin-right: auto;
  opacity: 0;
  transition: opacity 300ms ease-out;
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--2 .vp-top-highlights__card {
  margin-top: calc(-168 / 390 * 100vw);
  margin-left: auto;
  margin-right: calc(20 / 390 * 100vw);
  width: calc(250 / 390 * 100vw);
  opacity: 0;
  transform: translateY(calc(20 / 390 * 100vw));
  transition: opacity 700ms ease-out, transform 700ms ease-out;
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--2 .vp-top-highlights__sparkle {
  position: absolute;
  left: calc(50 / 390 * 100vw);
  bottom: calc(0 / 390 * 100vw);
  width: calc(60 / 390 * 100vw);
  opacity: 0;
  transition: opacity 600ms ease-out, bottom 600ms ease-out;
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--2.vp-is-active .vp-top-highlights__facility {
  opacity: 1;
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--2.vp-is-active .vp-top-highlights__card {
  opacity: 1;
  transform: translateY(0);
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--2.vp-is-active .vp-top-highlights__sparkle {
  opacity: 1;
  bottom: calc(0 / 390 * 100vw);
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--3 {
  margin-top: calc(20 / 390 * 100vw);
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--3 .vp-top-highlights__facility {
  margin-left: auto;
  margin-right: calc(0 / 390 * 100vw);
  width: calc(150 / 390 * 100vw);
  opacity: 0;
  transform: translateY(calc(10 / 390 * 100vw));
  transition: opacity 500ms ease-out, transform 500ms ease-out;
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--3 .vp-top-highlights__card {
  margin-top: calc(-170 / 390 * 100vw);
  margin-left: calc(20 / 390 * 100vw);
  opacity: 0;
  width: calc(250 / 390 * 100vw);
  transform: translateY(calc(30 / 390 * 100vw));
  transition: opacity 500ms ease-out, transform 500ms ease-out;
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--3 .vp-top-highlights__sparkle {
  position: absolute;
  right: calc(47 / 390 * 100vw);
  bottom: calc(0 / 390 * 100vw);
  width: calc(63 / 390 * 100vw);
  opacity: 0;
  transition: opacity 600ms ease-out, bottom 600ms ease-out;
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--3.vp-is-active .vp-top-highlights__facility {
  opacity: 1;
  transform: translateY(0);
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--3.vp-is-active .vp-top-highlights__card {
  opacity: 1;
  transform: translateY(0);
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--3.vp-is-active .vp-top-highlights__sparkle {
  opacity: 1;
  bottom: calc(0 / 390 * 100vw);
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--4 {
  margin-top: calc(-38 / 390 * 100vw);
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--4 .vp-top-highlights__facility {
  width: calc(200 / 390 * 100vw);
  opacity: 0;
  transition: opacity 300ms ease-out;
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--4 .vp-top-highlights__card {
  margin-top: calc(-124 / 390 * 100vw);
  margin-left: auto;
  margin-right: calc(20 / 390 * 100vw);
  width: calc(250 / 390 * 100vw);
  opacity: 0;
  transition: opacity 500ms ease-out, transform 500ms ease-out;
  transform: translateY(calc(30 / 390 * 100vw));
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--4 .vp-top-highlights__sparkle {
  position: absolute;
  left: calc(70 / 390 * 100vw);
  bottom: calc(0 / 390 * 100vw);
  width: calc(41 / 390 * 100vw);
  opacity: 0;
  transition: opacity 500ms ease-out, bottom 500ms ease-out;
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--4.vp-is-active .vp-top-highlights__facility {
  opacity: 1;
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--4.vp-is-active .vp-top-highlights__card {
  opacity: 1;
  transform: translateY(0);
}
.vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--4.vp-is-active .vp-top-highlights__sparkle {
  opacity: 1;
  bottom: calc(0 / 390 * 100vw);
}
.vp-top-highlights .vp-top-highlights__facility {
  display: block;
  border-radius: var(--round-small);
}
.vp-top-highlights .vp-top-highlights__card {
  position: relative;
  z-index: 1;
  padding: var(--space-4);
  box-sizing: border-box;
  box-shadow: 0px 2px 24px 0px rgba(0, 0, 0, 0.1490196078);
  border-radius: 12px;
  background: var(--color-parts-base);
}
.vp-top-highlights .vp-top-highlights__number {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: calc(-10 / 390 * 100vw);
  left: calc(-10 / 390 * 100vw);
  width: 42px;
  height: 42px;
  box-sizing: border-box;
  border: 3px solid var(--color-line-base-inverse);
  border-radius: 40px;
  background: var(--color-parts-accent);
  color: var(--color-text-base-inverse);
  font-family: var(--font-family-en);
  font-size: var(--font-size-heading-lv1);
}
.vp-top-highlights .vp-top-highlights__content-image {
  margin-bottom: var(--space-8);
  border-radius: 8px;
}
.vp-top-highlights .vp-top-highlights__content {
  padding: var(--space-8) var(--space-8) var(--space-12);
  text-align: center;
}
.vp-top-highlights .vp-top-highlights__title {
  margin-bottom: var(--space-4);
  font-size: var(--font-size-heading-lv3);
  font-weight: var(--font-weight-bold);
}
.vp-top-highlights .vp-top-highlights__desc {
  font-size: var(--font-size-body);
  color: var(--color-text-sub);
}
@media (min-width: 768px) {
  .vp-top-highlights .vp-top-highlights__inner {
    display: flex;
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--1 {
    padding-top: min(calc(128 / 1280 * 100vw), 128px);
    width: min(calc(320 / 1280 * 100vw), 320px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--1 .vp-top-highlights__facility {
    position: absolute;
    top: min(calc(294 / 1280 * 100vw), 294px);
    left: min(calc(170 / 1280 * 100vw), 170px);
    margin: 0;
    width: min(calc(210 / 1280 * 100vw), 210px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--1 .vp-top-highlights__card {
    position: absolute;
    top: min(calc(50 / 1280 * 100vw), 50px);
    left: min(calc(51 / 1280 * 100vw), 51px);
    margin: 0;
    width: min(calc(292 / 1280 * 100vw), 292px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--1 .vp-top-highlights__sparkle {
    position: absolute;
    opacity: 0;
    width: min(calc(41 / 1280 * 100vw), 41px);
    left: min(calc(0 / 1280 * 100vw), 0px);
    top: min(calc(50 / 1280 * 100vw), 50px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--1.vp-is-active .vp-top-highlights__sparkle {
    opacity: 1;
    top: min(calc(50 / 1280 * 100vw), 50px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--2 {
    margin-top: 0;
    width: min(calc(320 / 1280 * 100vw), 320px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--2 .vp-top-highlights__facility {
    margin-top: min(calc(-7 / 1280 * 100vw), -7px);
    width: min(calc(210 / 1280 * 100vw), 210px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--2 .vp-top-highlights__card {
    margin-top: max(calc(-4 / 1280 * 100vw), -4px);
    margin-left: min(calc(40 / 1280 * 100vw), 40px);
    margin-right: auto;
    width: min(calc(273 / 1280 * 100vw), 273px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--2 .vp-top-highlights__sparkle {
    position: absolute;
    opacity: 0;
    width: min(calc(60 / 1280 * 100vw), 60px);
    left: min(calc(322 / 1280 * 100vw), 322px);
    bottom: min(calc(30 / 1280 * 100vw), 30px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--2.vp-is-active .vp-top-highlights__sparkle {
    opacity: 1;
    bottom: min(calc(30 / 1280 * 100vw), 30px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--3 {
    margin-top: 0;
    padding-top: min(calc(456 / 1280 * 100vw), 456px);
    width: min(calc(320 / 1280 * 100vw), 320px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--3 .vp-top-highlights__facility {
    margin-left: min(calc(95 / 1280 * 100vw), 95px);
    margin-top: min(calc(-95 / 1280 * 100vw), -95px);
    width: min(calc(210 / 1280 * 100vw), 210px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--3 .vp-top-highlights__card {
    position: absolute;
    top: min(calc(50 / 1280 * 100vw), 50px);
    margin-top: 0;
    margin-left: min(calc(10 / 1280 * 100vw), 10px);
    width: min(calc(270 / 1280 * 100vw), 270px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--3 .vp-top-highlights__sparkle {
    position: absolute;
    opacity: 0;
    width: min(calc(63 / 1280 * 100vw), 63px);
    left: min(calc(-60 / 1280 * 100vw), -60px);
    top: min(calc(46 / 1280 * 100vw), 46px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--3.vp-is-active .vp-top-highlights__sparkle {
    opacity: 1;
    top: min(calc(46 / 1280 * 100vw), 46px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--4 {
    margin-top: 0;
    padding-top: min(calc(26 / 1280 * 100vw), 26px);
    width: min(calc(320 / 1280 * 100vw), 320px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--4 .vp-top-highlights__facility {
    margin-left: min(calc(75 / 1280 * 100vw), 75px);
    width: min(calc(210 / 1280 * 100vw), 210px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--4 .vp-top-highlights__card {
    margin-top: max(calc(-57 / 1280 * 100vw), -57px);
    margin-left: min(calc(-23 / 1280 * 100vw), -23px);
    width: min(calc(292 / 1280 * 100vw), 292px);
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--4 .vp-top-highlights__card {
    margin-left: min(calc(-14 / 1280 * 100vw), -14px);
  }
}
@media (min-width: 768px) {
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--4 .vp-top-highlights__sparkle {
    position: absolute;
    opacity: 0;
    width: min(calc(41 / 1280 * 100vw), 41px);
    left: min(calc(280 / 1280 * 100vw), 280px);
    bottom: min(calc(30 / 1280 * 100vw), 30px);
  }
  .vp-top-highlights .vp-top-highlights__block.vp-top-highlights__block--4.vp-is-active .vp-top-highlights__sparkle {
    opacity: 1;
    bottom: min(calc(30 / 1280 * 100vw), 30px);
  }
  .vp-top-highlights .vp-top-highlights__card {
    padding: var(--space-8);
  }
  .vp-top-highlights .vp-top-highlights__number {
    top: max(calc(-10 / 1280 * 100vw), -10px);
    left: max(calc(-10 / 1280 * 100vw), -10px);
    width: 46px;
    height: 46px;
  }
  .vp-top-highlights .vp-top-highlights__title {
    font-size: 20px;
  }
  .vp-top-highlights .vp-top-highlights__desc {
    font-size: 12px;
  }
}

ul.vp-top-news-list {
  display: flex;
  flex-flow: column;
  gap: 30px;
}
@media (min-width: 768px) {
  ul.vp-top-news-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
  }
}
ul.vp-top-news-list .vp-top-news-list__item {
  box-sizing: border-box;
}
ul.vp-top-news-list .vp-top-news-list__item:nth-child(n+4) {
  display: none;
}
ul.vp-top-news-list .vp-top-news-list__item a {
  display: block;
}
@media (min-width: 768px) {
  ul.vp-top-news-list .vp-top-news-list__item {
    flex: 0 0 212px;
  }
}
ul.vp-top-news-list .vp-top-news-list__media {
  margin-bottom: var(--space-12);
  border-radius: var(--round-small);
  overflow: hidden;
}
ul.vp-top-news-list .vp-top-news-list__meta {
  display: flex;
  align-items: center;
  margin-bottom: var(--space-4);
  color: var(--color-text-sub);
}
ul.vp-top-news-list .vp-top-news-list__category {
  padding: 0 8px;
  border: 1px solid var(--color-line-inverse-inverse);
  border-radius: 30px;
  box-sizing: border-box;
  font-size: var(--font-size-caption);
  font-weight: var(--font-weight-bold);
  line-height: 1.6;
}
ul.vp-top-news-list .vp-top-news-list__date {
  margin-left: auto;
  font-size: var(--font-size-caption);
}
ul.vp-top-news-list .vp-top-news-list__title {
  font-size: var(--font-size-body);
  color: #152e3b;
}

.vp-top-news-list-load-more {
  display: none;
  align-items: center;
  margin: 30px auto 0;
  font-size: var(--font-size-body);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-sub);
}
.vp-top-news-list-load-more::after {
  content: "";
  display: block;
  margin-left: 10px;
  width: 32px;
  height: 32px;
  background-image: url("../../images/vp/common/icon-plus-circle.svg");
}

.vp-top-page-heading {
  color: var(--color-text-accent);
  margin-bottom: var(--space-32);
  text-align: center;
}
.vp-top-page-heading .vp-top-page-heading__title .vp-top-page-heading__title-text {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-12);
  margin-bottom: var(--space-12);
  font-family: var(--font-family-en);
  font-size: var(--font-size-heading-latin);
  font-weight: var(--font-weight-regular);
  letter-spacing: calc(var(--font-size-heading-latin) * 3 / 100);
}
.vp-top-page-heading .vp-top-page-heading__title .vp-top-page-heading__title-text::before {
  content: "";
  display: block;
  width: 47px;
  height: 52px;
  background-image: url("../../images/vp/common/icon-sparkle-03.svg");
}
.vp-top-page-heading .vp-top-page-heading__title .vp-top-page-heading__title-text::after {
  content: "";
  display: block;
  width: 47px;
  height: 52px;
  background-image: url("../../images/vp/common/icon-sparkle-03.svg");
  transform: scale(-1, -1);
}
.vp-top-page-heading .vp-top-page-heading__desc {
  display: block;
  font-size: var(--font-size-heading-lv2);
  font-weight: var(--font-weight-bold);
}
.vp-top-page-heading.vp-top-page-heading--inverse {
  color: var(--color-text-base-inverse);
}
.vp-top-page-heading.vp-top-page-heading--no-margin {
  margin-bottom: 0;
}

.swiper.vp-top-plan-list {
  position: relative;
  margin-bottom: var(--space-y-lv2);
}
.swiper.vp-top-plan-list .swiper-wrapper.vp-top-plan-list__wrapper.vp-is-center {
  justify-content: center;
}
.swiper.vp-top-plan-list .swiper-slide.vp-top-plan-list__item {
  position: relative;
  width: 290px;
  height: auto;
  padding-top: 58px;
}
.swiper.vp-top-plan-list .vp-top-plan-list__lead {
  z-index: 1;
  position: absolute;
  top: 1px;
  left: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  transform: rotate(-4deg);
  transform-origin: top right;
}
.swiper.vp-top-plan-list .vp-top-plan-list__lead::after {
  content: "";
  display: block;
  margin-left: 17px;
  width: 10px;
  height: 9px;
  background-image: url("../../images/vp/top/plan-balloon-tail.svg");
}
@media (min-width: 768px) {
  .swiper.vp-top-plan-list .vp-top-plan-list__lead {
    top: 0;
  }
}
.swiper.vp-top-plan-list .vp-top-plan-list__lead .vp-top-plan-list__lead-line {
  padding: 4px 8px;
  font-size: var(--font-size-body);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-inverse);
  background: var(--color-parts-accent);
}
.swiper.vp-top-plan-list .vp-top-plan-list__lead .vp-top-plan-list__lead-line + .vp-top-plan-list__lead-line {
  margin-top: -6px;
}
@media (min-width: 768px) {
  .swiper.vp-top-plan-list .vp-top-plan-list__lead .vp-top-plan-list__lead-line {
    padding: 2.5px 8px;
  }
}
.swiper.vp-top-plan-list .vp-top-plan-list__link {
  overflow: hidden;
  display: block;
  width: 266px;
  margin: 0 auto;
  height: 100%;
  border-radius: var(--round-big);
  background: var(--color-bg-sub);
}
.swiper.vp-top-plan-list .vp-top-plan-list__content {
  padding: var(--space-12) var(--space-x-side) var(--space-16);
}
.swiper.vp-top-plan-list .vp-top-plan-list__title {
  margin-bottom: var(--space-12);
  font-size: var(--font-size-card-title);
  font-weight: var(--font-weight-bold);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.swiper.vp-top-plan-list .vp-top-plan-list__tags {
  display: flex;
  gap: 2px 9px;
  flex-wrap: wrap;
  font-size: var(--font-size-caption);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-sub);
}
.swiper.vp-top-plan-list .vp-top-plan-list__tags .vp-top-plan-list__tag {
  letter-spacing: calc(var(--font-size-caption) * -1.1 / 100);
  display: flex;
}
.swiper.vp-top-plan-list .vp-top-plan-list__tags .vp-top-plan-list__tag::before {
  content: "";
  display: block;
  margin-right: 1px;
  width: 5px;
  height: 13px;
  background-image: url("../../images/vp/common/icon-hash-tag.svg");
}
.swiper.vp-top-plan-list .vp-top-plan-list__nav {
  position: absolute;
  z-index: 2;
  top: 50%;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  background-image: url("../../images/vp/common/icon-arrow-right-circle-navy.svg");
  color: transparent;
  font-size: 0;
}
.swiper.vp-top-plan-list .vp-top-plan-list__nav.vp-top-plan-list__nav--prev {
  left: 8px;
  transform: translateY(-50%) scaleX(-1);
}
.swiper.vp-top-plan-list .vp-top-plan-list__nav.vp-top-plan-list__nav--next {
  right: 8px;
}

.vp-top-story-list-wrapper {
  padding: var(--space-16) 0;
  width: 100%;
  overflow: hidden;
}

ul.vp-top-story-list {
  display: inline-flex;
  gap: var(--space-20);
  width: auto;
  will-change: transform;
}
ul.vp-top-story-list .vp-top-story-list__item {
  flex: 0 0 194px;
  justify-content: center;
  box-sizing: border-box;
}
ul.vp-top-story-list .vp-top-story-list__item a {
  display: flex;
  flex-direction: column;
  height: 100%;
}
@media (min-width: 768px) {
  ul.vp-top-story-list .vp-top-story-list__item {
    flex: 0 0 250px;
  }
}
ul.vp-top-story-list .vp-top-story-list__frame {
  margin-left: 12px;
  width: 175px;
  box-sizing: border-box;
  border: 2px solid var(--color-line-base-inverse);
  transform: rotate(-4deg);
  transform-origin: 50%;
  border-radius: 4px;
  overflow: hidden;
  box-shadow: 1px 1px 6px 0px rgba(71, 112, 145, 0.5019607843);
}
@media (min-width: 768px) {
  ul.vp-top-story-list .vp-top-story-list__frame {
    width: 212px;
    transform: translateX(7px) rotate(-4deg);
  }
}
ul.vp-top-story-list .vp-top-story-list__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: var(--space-16) var(--space-12) var(--space-8);
  box-sizing: border-box;
  background: var(--color-parts-base);
  border-radius: var(--round-small);
}
ul.vp-top-story-list .vp-top-story-list__lead {
  color: var(--color-text-accent);
  font-size: 10px;
  text-align: center;
}
@media (min-width: 768px) {
  ul.vp-top-story-list .vp-top-story-list__lead {
    font-size: 12px;
  }
}
ul.vp-top-story-list .vp-top-story-list__title {
  flex: 1;
  margin-bottom: var(--space-8);
  font-size: var(--font-size-caption);
  color: var(--color-text-accent);
  font-weight: var(--font-weight-bold);
  text-align: center;
}
@media (min-width: 768px) {
  ul.vp-top-story-list .vp-top-story-list__title {
    font-size: var(--font-size-card-title);
  }
}
ul.vp-top-story-list .vp-top-story-list__meta {
  display: flex;
  font-size: 10px;
  color: var(--color-text-sub);
}
ul.vp-top-story-list .vp-top-story-list__number {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  gap: 2px;
}
ul.vp-top-story-list .vp-top-story-list__number::after {
  display: block;
  content: "";
  width: 8px;
  height: 8px;
  background-image: url("../../images/vp/common/icon-arrow-right-gray.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

:root {
  --voice-list-item-width: 288px;
}

.vp-top-voice-list-wrapper {
  position: relative;
  z-index: 1;
  width: 100%;
  overflow: hidden;
}
.vp-top-voice-list-wrapper:has(+ .vp-top-voice-list-wrapper) {
  margin-bottom: 10px;
}

ul.vp-top-voice-list {
  display: inline-flex;
  gap: 9px;
  width: auto;
  will-change: transform;
}
ul.vp-top-voice-list .vp-top-voice-list__item {
  flex: 0 0 var(--voice-list-item-width);
  justify-content: center;
  box-sizing: border-box;
  padding: 1px;
  border-radius: var(--round-big);
  background: linear-gradient(180deg, rgba(121, 189, 228, 0.4) 0%, rgba(218, 241, 255, 0.1) 50%, rgba(133, 194, 229, 0.96) 99.52%) border-box;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1019607843);
}
@media (min-width: 768px) {
  ul.vp-top-voice-list .vp-top-voice-list__item {
    flex: 0 0 212px;
  }
}
ul.vp-top-voice-list .vp-top-voice-list__content {
  padding: 44px var(--space-20) var(--space-32);
  border-radius: var(--round-big);
  background: var(--color-parts-sub);
}
ul.vp-top-voice-list .vp-top-voice-list__body {
  display: flex;
  gap: 8px;
  margin-bottom: var(--space-12);
  font-weight: var(--font-weight-bold);
}
ul.vp-top-voice-list .vp-top-voice-list__body::before, ul.vp-top-voice-list .vp-top-voice-list__body::after {
  content: "";
  display: block;
  width: 8.93px;
  height: 6.42px;
  background-image: url("../../images/vp/top/voice-list-quotation.svg");
  background-size: contain;
  background-repeat: no-repeat;
  flex: 0 0 8.93px;
}
ul.vp-top-voice-list .vp-top-voice-list__body::after {
  transform: scale(-1, -1);
  align-self: flex-end;
}
ul.vp-top-voice-list .vp-top-voice-list__profile {
  display: block;
  text-align: right;
  font-size: var(--font-size-caption);
  color: var(--color-text-sub);
}

.vp-top-voice-visual {
  margin-top: -50px;
  position: relative;
  overflow: hidden;
  height: 310px;
}
.vp-top-voice-visual .vp-top-voice-visual__layer {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 540px;
}
.vp-top-voice-visual .vp-top-voice-visual__layer:nth-child(n+2) {
  position: absolute;
  opacity: 0;
}

@media (min-width: 541px) {
  .vp-top-voice-visual {
    height: auto;
  }
  .vp-top-voice-visual .vp-top-voice-visual__layer {
    position: initial;
    transform: initial;
    width: 100%;
    left: 0;
  }
}
@media (min-width: 768px) {
  .vp-top-voice-visual {
    margin-top: -200px;
    height: 826px;
  }
  .vp-top-voice-visual .vp-top-voice-visual__layer {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 1440px;
  }
}
/* セクション全体 */
.vp-top-your-story-list-wrapper {
  position: relative;
  padding: 66px 0 43px;
}

/* pinned ボックス */
.vp-top-your-story-list {
  position: sticky;
  top: 72px; /* ★ ボックスが止まる位置 */
  max-width: 370px;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .vp-top-your-story-list {
    max-width: 1260px;
  }
}

/* ------------------------------
  背景（高さ 600px のボックス）
------------------------------ */
.vp-top-your-story-list__bg {
  position: relative;
  width: 100%;
  height: 600px;
  border-radius: 20px;
  overflow: hidden;
  z-index: 1;
}
@media (min-width: 768px) {
  .vp-top-your-story-list__bg {
    height: 647px;
    border-radius: 40px;
  }
}

/* 背景画像は一番下 */
.vp-top-your-story-list__bg-item {
  position: absolute;
  inset: 0;
  opacity: 0;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  transition: opacity 0.45s ease;
  will-change: opacity;
  z-index: 0;
}

.vp-top-your-story-list__bg-item--0 {
  background-image: url("../../images/vp/top/your-story-01-sp.jpg");
}

.vp-top-your-story-list__bg-item--1 {
  background-image: url("../../images/vp/top/your-story-02-sp.jpg");
}

.vp-top-your-story-list__bg-item--2 {
  background-image: url("../../images/vp/top/your-story-03-sp.jpg");
}

.vp-top-your-story-list__bg-item--3 {
  background-image: url("../../images/vp/top/your-story-04-sp.jpg");
}

@media (min-width: 768px) {
  .vp-top-your-story-list__bg-item--0 {
    background-image: url("../../images/vp/top/your-story-01-pc.jpg");
  }
  .vp-top-your-story-list__bg-item--1 {
    background-image: url("../../images/vp/top/your-story-02-pc.jpg");
  }
  .vp-top-your-story-list__bg-item--2 {
    background-image: url("../../images/vp/top/your-story-03-pc.jpg");
  }
  .vp-top-your-story-list__bg-item--3 {
    background-image: url("../../images/vp/top/your-story-04-pc.jpg");
  }
}
.vp-top-your-story-list__bg-item.is-active {
  opacity: 1;
}

/* 黒フィルター */
.vp-top-your-story-list__bg-filter {
  position: absolute;
  inset: 0;
  background: #000;
  opacity: 0;
  pointer-events: none;
  z-index: 1;
}

/* ------------------------------
  li コンテンツ帯（ここを JS で translateY）
------------------------------ */
.vp-top-your-story-list__items {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2;
  will-change: transform;
}

.vp-top-your-story-list__item {
  position: relative;
  min-height: 474px;
  padding: 0 32px 160px;
  opacity: 0.45;
  transition: opacity 0.3s ease;
  box-sizing: border-box;
  color: var(--color-white);
}
@media (min-width: 768px) {
  .vp-top-your-story-list__item {
    padding: 0 68px 160px;
  }
}

.vp-top-your-story-list__item.is-active {
  opacity: 1;
}

/* 中身の見た目位置を制御するラッパー */
.vp-top-your-story-list__body {
  margin-top: 700px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

/* ------------------------------
  li コンテンツ内
------------------------------ */
.vp-top-your-story-list__title {
  font-family: var(--font-family-en);
  font-size: 16px;
  font-weight: 500;
  display: flex;
  gap: 8px;
}

.vp-top-your-story-list__desc {
  font-size: var(--font-size-card-title);
  font-weight: var(--font-weight-bold);
  margin-top: var(--space-32);
  text-shadow: 0px 2px 14px 0px rgba(0, 0, 0, 0.4509803922);
}

.vp-top-your-story-list__lead {
  font-size: var(--font-size-heading-lv2);
  font-weight: var(--font-weight-bold);
  margin-top: var(--space-12);
  text-shadow: 0px 2px 14px 0px rgba(0, 0, 0, 0.4509803922);
  width: 294px;
}
@media (min-width: 768px) {
  .vp-top-your-story-list__lead {
    width: 500px;
  }
}

.vp-top-your-story-list__button {
  display: block;
  position: relative;
  color: var(--color-white);
  font-size: var(--font-size-body);
  font-weight: var(--font-weight-bold);
  padding: 16px 46px 16px 32px;
  border-radius: 60px;
  border: 1px solid var(--color-white);
  background: rgba(0, 0, 0, 0.2);
  margin-top: var(--space-32);
}

.vp-top-your-story-list__arrow {
  display: block;
  position: absolute;
  top: 50%;
  right: var(--space-x-side);
  transform: translateY(-50%);
  margin-left: auto;
  width: 16px;
  height: 16px;
  background-image: url("../../images/vp/common/icon-arrow-right-white.svg");
}

/* ------------------------------
  ナビゲーション（1,2,3）
------------------------------ */
.vp-top-your-story-list__nav {
  position: relative;
  z-index: 3;
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 42px;
}
@media (min-width: 768px) {
  .vp-top-your-story-list__nav {
    margin-top: 30px;
  }
}

.vp-top-your-story-list__nav-btn {
  background-color: var(--color-white);
  color: var(--color-gray01);
  border: 1px solid var(--color-gray02);
  border-radius: 50px;
  padding: 10px 16px;
  font-size: var(--font-size-caption);
  cursor: pointer;
  transition: border-color 0.25s ease, color 0.25s ease;
}

.vp-top-your-story-list__nav-btn.is-active {
  border-color: var(--color-graphic03);
  color: var(--color-graphic03);
}

/* ===========================================
  CMS対応 : [Your Story] がページ内に存在する場合は
  sticky が壊れるため overflow hidden を解除
=========================================== */
.pbPage:has(.vp-top-your-story),
.pbMainArea:has(.vp-top-your-story) {
  overflow: visible !important;
}

.vp-top-main-label {
  padding: var(--space-8) 0;
  text-align: center;
  font-size: var(--font-size-heading-lv4);
  background: var(--color-parts-accent);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-inverse);
}

.vp-top-hero-story {
  background: linear-gradient(0deg, #c7e8fa, #c7e8fa), linear-gradient(360deg, rgba(199, 232, 250, 0) 59.14%, #c7e8fa 80%);
}

.vp-top-hero {
  height: calc(794 / 390 * 100vw);
  background: url("../../images/vp/top/hero-bg-sp.jpg") no-repeat;
  background-size: cover;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: hidden;
}
.vp-top-hero .vp-top-hero__copy {
  margin-top: calc(64 / 390 * 100vw);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-20);
}
.vp-top-hero .vp-top-hero__logo {
  width: calc(198 / 390 * 100vw);
}
.vp-top-hero .vp-top-hero__tagline {
  width: calc(350 / 390 * 100vw);
}
@media (min-width: 768px) {
  .vp-top-hero {
    height: min(calc(579 / 1280 * 100vw), 579px);
    background: url("../../images/vp/top/hero-bg-pc.jpg") no-repeat;
    background-position: center;
    background-size: cover;
  }
  .vp-top-hero .vp-top-hero__inner {
    margin: 0 auto;
    width: min(calc(1280 / 1440 * 100vw), 1280px);
  }
  .vp-top-hero .vp-top-hero__copy {
    display: block;
    margin-top: min(calc(122 / 1440 * 100vw), 122px);
  }
  .vp-top-hero .vp-top-hero__logo {
    width: min(calc(397 / 1440 * 100vw), 397px);
    margin-bottom: 40px;
  }
  .vp-top-hero .vp-top-hero__tagline {
    width: min(calc(397 / 1440 * 100vw), 397px);
  }
}
@media (min-width: 1441px) {
  .vp-top-hero {
    background: url("../../images/vp/top/hero-bg-pc-wide.jpg") no-repeat;
    background-position: center;
    background-size: cover;
  }
}
.vp-top-hero + * {
  margin-top: calc(-259 / 390 * 100vw);
}
@media (min-width: 768px) {
  .vp-top-hero + * {
    margin-top: max(calc(-122 / 1440 * 100vw), -122px);
  }
}

.vp-top-intro-highlights {
  background: linear-gradient(180deg, var(--color-bg-grand) 0%, var(--color-bg-base) 100%);
}
@media (min-width: 768px) {
  .vp-top-intro-highlights {
    background: url("../../images/vp/top/intro-highlights-bg.png") no-repeat center top/1440px, linear-gradient(180deg, var(--color-bg-grand) 0%, var(--color-bg-base) 100%);
  }
}

.vp-top-intro {
  padding: var(--space-y-lv1) 0px 0;
  padding-bottom: var(--space-48);
}
.vp-top-intro .vp-top-intro__body {
  margin-bottom: 34px;
  text-align: center;
  color: var(--color-text-base);
  font-size: var(--font-size-heading-lv3);
  font-weight: var(--font-weight-bold);
  line-height: 2;
  letter-spacing: calc(var(--font-size-heading-lv3) * -1.1 / 100);
}

.vp-top-plan {
  background: var(--color-bg-inverse);
}
.vp-top-plan .vp-top-plan__inner {
  padding: var(--space-y-lv1) 0px var(--space-y-lv1);
}
@media (min-width: 768px) {
  .vp-top-plan .vp-top-plan__table {
    margin-left: auto;
    margin-right: auto;
    padding-right: 0;
    padding-left: 0;
    max-width: var(--container-max-width-pc);
  }
}
.vp-top-plan .vp-top-plan__table {
  margin-bottom: var(--space-32);
}
.vp-top-plan .vp-top-plan__button {
  margin-bottom: var(--space-y-lv2);
}

.vp-top-voice {
  background: var(--color-bg-base);
}
.vp-top-voice .vp-top-voice__inner {
  padding: var(--space-y-lv1) 0px 0;
}

.vp-top-news .vp-top-news__inner {
  padding: var(--space-y-lv1) var(--space-x-side) var(--space-y-lv1);
}
@media (min-width: 768px) {
  .vp-top-news .vp-top-news__inner {
    margin-left: auto;
    margin-right: auto;
    padding-right: 0;
    padding-left: 0;
    max-width: var(--container-max-width-pc);
  }
}

.vp-top-your-story {
  background: var(--color-bg-base);
}
.vp-top-your-story .vp-top-your-story__inner {
  padding: var(--space-y-lv1) 10px var(--space-y-lv1);
}
@media (min-width: 768px) {
  .vp-top-your-story .vp-top-your-story__inner {
    margin-left: auto;
    margin-right: auto;
    padding-right: 0;
    padding-left: 0;
    max-width: var(--container-max-width-pc);
  }
}

.vp-main--top .vp-button--top-about {
  color: var(--color-graphic03);
  border: 1px solid var(--color-graphic03);
  background: var(--color-white);
  padding: var(--space-20) 42px var(--space-20) 60px;
}
.vp-main--top .vp-button--top-about::after {
  background-image: url("../../images/vp/common/icon-arrow-right-blue.svg");
}
.vp-main--top .vp-button--top-about::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 12px;
  transform: translateY(-50%);
  width: 46px;
  height: 46px;
  background-image: url("../../images/vp/common/about_bag.gif");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.vp-plan-filters {
  position: relative;
  border-radius: var(--round-small);
  border: 1px solid var(--color-parts-accent);
  background: var(--color-white);
}
@media (min-width: 768px) {
  .vp-plan-filters.vp-is-open {
    border-radius: var(--round-small) var(--round-small) 0 0;
  }
}
.vp-plan-filters .vp-plan-filters__trigger {
  display: block;
  position: relative;
  padding: var(--space-y-lv3) var(--space-x-side);
  width: 100%;
  font-size: var(--font-size-heading-lv4);
  font-weight: var(--font-weight-bold);
}
.vp-plan-filters .vp-plan-filters__trigger .vp-plan-filters__arrow {
  transform: translateY(-50%) rotate(180deg);
}
.vp-plan-filters .vp-plan-filters__trigger[aria-expanded=true] .vp-plan-filters__arrow {
  transform: translateY(-50%) rotate(0deg);
}
.vp-plan-filters .vp-plan-filters__arrow {
  display: block;
  position: absolute;
  top: 50%;
  right: var(--space-x-side);
  transform: translateY(-50%);
  margin-left: auto;
  width: 16px;
  height: 16px;
  background-image: url("../../images/vp/common/icon-arrow.svg");
}
.vp-plan-filters .vp-plan-filters__panel {
  border-top: 1px solid var(--color-line-soft);
  padding: var(--space-32) var(--space-20);
}
@media (min-width: 768px) {
  .vp-plan-filters .vp-plan-filters__panel {
    position: absolute;
    z-index: 1;
    top: 100%;
    left: -1px;
    width: calc(100% + 2px);
    box-sizing: border-box;
    background: var(--color-white);
    border: 1px solid var(--color-parts-accent);
    border-top: none;
    border-radius: 0 0 var(--round-small) var(--round-small);
  }
}
.vp-plan-filters .vp-plan-filters__legend {
  display: flex;
  align-items: center;
  margin-bottom: var(--space-16);
  font-size: var(--font-size-heading-lv4);
  font-weight: var(--font-weight-bold);
}
.vp-plan-filters .vp-plan-filters__legend::before {
  content: "";
  display: block;
  margin-right: var(--space-4);
  width: 4px;
  height: 16px;
  background: var(--color-parts-accent);
}
.vp-plan-filters .vp-plan-filters__checklist {
  margin-bottom: var(--space-32);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-12) var(--space-8);
}
.vp-plan-filters .vp-plan-filters__check > input[type=checkbox] {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  overflow: hidden;
  white-space: nowrap;
}
.vp-plan-filters .vp-plan-filters__check > input[type=checkbox] + label {
  margin: 0;
  line-height: inherit;
}
.vp-plan-filters .vp-plan-filters__check > input[type=checkbox] + label:hover {
  opacity: inherit;
}
.vp-plan-filters .vp-plan-filters__check > input[type=checkbox] + label::before {
  content: none;
}
.vp-plan-filters .vp-plan-filters__check > input[type=checkbox]:checked + label::after {
  content: none;
}
.vp-plan-filters .vp-plan-filters__check > input[type=checkbox]:checked + .vp-plan-filters__buttonLike {
  background: var(--color-bg-grand);
  border: 1px solid var(--color-line-button-accent);
}
.vp-plan-filters .vp-plan-filters__buttonLike {
  padding: 7px var(--space-8);
  border-radius: 36px;
  border: 1px solid var(--color-line-button);
  font-size: var(--font-size-caption);
}
.vp-plan-filters .vp-plan-filters__actions {
  display: flex;
  gap: var(--space-16);
}
.vp-plan-filters .vp-plan-filters__actions button {
  flex-grow: 1;
  width: 50%;
  padding: var(--space-12) 0 14px 0;
  font-size: var(--font-size-body);
  font-weight: var(--font-weight-bold);
  border-radius: 4px;
}
.vp-plan-filters .vp-plan-filters__actions button.vp-plan-filters__clear {
  border: 1px solid var(--color-line-base);
}
.vp-plan-filters .vp-plan-filters__actions button.vp-plan-filters__submit {
  color: var(--color-text-inverse);
  background: var(--color-bg-inverse);
}
.vp-plan-filters .vp-plan-filters__selected {
  padding: 0 var(--space-20) var(--space-16);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
}
.vp-plan-filters .vp-plan-filters__selected.vp-is-hidden {
  display: none;
}
.vp-plan-filters .vp-plan-filters__selected .vp-plan-filters__selected-item {
  border-radius: 36px;
  padding: 3px var(--space-8) 2px;
  font-size: var(--font-size-caption);
  color: var(--color-text-sub);
  background: var(--color-bg-base);
}

.vp-plan-list {
  display: flex;
  flex-flow: column;
  gap: var(--space-x-column);
}
@media (min-width: 768px) {
  .vp-plan-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-32) var(--space-x-column);
  }
}
.vp-main.vp-main--plan {
  background: var(--color-bg-base);
}

@media (min-width: 768px) {
  .vp-plan-intro {
    padding-top: var(--space-32);
    margin-bottom: var(--space-y-lv1);
  }
  .vp-plan-intro__inner {
    display: flex;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .vp-plan-intro__inner {
    margin-left: auto;
    margin-right: auto;
    padding-right: 0;
    padding-left: 0;
    max-width: var(--container-max-width-pc);
  }
}
@media (min-width: 768px) {
  .vp-plan-intro__inner > * {
    flex: 0 0 50%;
  }
  .vp-plan-kv {
    border-radius: var(--round-big);
  }
}
.vp-plan-overview {
  padding: 0 var(--space-x-side) var(--space-y-lv1);
  padding-top: var(--space-y-lv3);
}
@media (min-width: 768px) {
  .vp-plan-overview {
    padding: var(--space-16) var(--space-y-lv1) var(--space-32);
    box-sizing: border-box;
  }
}

.vp-page-lead {
  margin-bottom: var(--space-y-lv2);
  font-size: var(--font-size-body);
}

.vp-departure-select {
  margin-bottom: var(--space-y-lv3);
  padding: var(--space-12) var(--space-16);
  background: var(--color-bg-grand);
  border-radius: var(--round-small);
}
.vp-departure-select .vp-departure-select__label {
  margin-bottom: var(--space-12);
  font-size: var(--font-size-heading-lv4);
  font-weight: var(--font-weight-bold);
  text-align: center;
}
.vp-departure-select .vp-departure-select__note {
  font-size: var(--font-size-caption);
  color: var(--color-text-sub);
}
.vp-departure-select .vp-departure-select__link {
  font-size: var(--font-size-caption);
  color: var(--color-text-sub);
  text-decoration: underline;
}

ul.vp-departure-nav {
  display: flex;
  margin-bottom: var(--space-12);
  align-items: center;
  gap: 16px;
}
ul.vp-departure-nav .vp-departure-nav__item {
  flex: 1;
}
ul.vp-departure-nav .vp-departure-nav__item a {
  position: relative;
  display: flex;
  padding: 16px 12px 20px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-self: stretch;
  font-size: 12px;
  font-weight: var(--font-weight-bold);
  border-radius: var(--round-small);
  background: #fff;
}
ul.vp-departure-nav .vp-departure-nav__item a span {
  color: var(--color-text-accent);
  font-size: var(--font-size-card-title);
}
ul.vp-departure-nav .vp-departure-nav__item a::after {
  content: "";
  display: block;
  position: absolute;
  right: 5px;
  bottom: 5px;
  width: 20px;
  height: 20px;
  background-image: url("../../images/vp/common/icon-arrow-down-circle.svg");
}

.vp-plan-plans .vp-plan-plans__inner {
  padding: 0 var(--space-x-side) var(--space-y-lv1);
}
@media (min-width: 768px) {
  .vp-plan-plans .vp-plan-plans__inner {
    margin-left: auto;
    margin-right: auto;
    padding-right: 0;
    padding-left: 0;
    max-width: var(--container-max-width-pc);
  }
}
.vp-plan-plans .vp-plan-plans__heading {
  margin-bottom: var(--space-16);
  padding: var(--space-4) 0;
  font-size: var(--font-size-heading-lv2);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-logo);
}
.vp-plan-plans .vp-plan-plans__heading.vp-plan-plans__heading--spaced {
  margin-top: var(--space-y-lv2);
}
.vp-plan-plans .vp-plan-plans__no-result {
  padding: var(--space-y-lv2) var(--space-x-side);
  text-align: center;
  background: var(--color-bg-sub);
  border-radius: var(--round-small);
  color: var(--color-text-sub);
}
.vp-plan-plans .vp-plan-plans__no-result-message {
  margin-bottom: var(--space-12);
  font-size: var(--font-size-heading-lv4);
  font-weight: var(--font-weight-bold);
}
.vp-plan-plans .vp-plan-plans__no-result-note {
  font-size: var(--font-size-caption);
}

.vp-plan-contents {
  background: var(--color-bg-inverse);
}
.vp-plan-contents .vp-plan-contents__inner {
  padding: var(--space-y-lv1) 0;
}
@media (min-width: 768px) {
  .vp-plan-contents .vp-plan-contents__inner {
    margin-left: auto;
    margin-right: auto;
    padding-right: 0;
    padding-left: 0;
    max-width: var(--container-max-width-pc);
  }
}
@media (min-width: 768px) {
  .vp-plan-contents .vp-plan-contents__inner {
    padding-top: var(--space-y-lv2);
  }
}
.vp-plan-contents .vp-plan-contents__inner .vp-note-list {
  margin-top: -36px;
}
.vp-plan-contents .vp-plan-contents__heading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: var(--font-size-heading-lv2);
  font-weight: 400;
  color: var(--color-text-inverse);
  margin-bottom: var(--space-16);
}
.vp-plan-contents .vp-plan-contents__heading::before {
  content: "";
  display: block;
  width: 40px;
  height: 18px;
  background-image: url("../../images/vp/common/icon-sparkle-02.svg");
}
.vp-plan-contents .vp-plan-contents__heading::after {
  content: "";
  display: block;
  width: 40px;
  height: 18px;
  background-image: url("../../images/vp/common/icon-sparkle-02.svg");
  transform: scale(-1, -1);
}
.vp-plan-contents .vp-plan-contents__table {
  margin-bottom: var(--space-y-lv2);
}

.vp-plan-detail-modal {
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
@media (min-width: 768px) {
  .vp-plan-detail-modal {
    align-items: center;
  }
}
.vp-plan-detail-modal.vp-is-open {
  display: flex;
}
.vp-plan-detail-modal .vp-plan-detail-modal__dialog {
  position: relative;
  z-index: 102;
  display: flex;
  flex-direction: column;
  max-height: calc(100svh - 80px);
  border-radius: var(--round-big) var(--round-big) 0 0;
  background: var(--color-bg-sub);
  width: 100%;
}
@media (min-width: 768px) {
  .vp-plan-detail-modal .vp-plan-detail-modal__dialog {
    width: 728px;
    max-height: 640px;
    border-radius: var(--round-big);
  }
}
.vp-plan-detail-modal .vp-plan-detail-modal__header {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-y-lv3) var(--space-x-side);
}
.vp-plan-detail-modal .vp-plan-detail-modal__title {
  flex: 1 1 auto;
  text-align: center;
  font-size: var(--font-size-heading-lv3);
  font-weight: var(--font-weight-bold);
}
.vp-plan-detail-modal .vp-plan-detail-modal__close {
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  margin-left: auto;
  background-image: url("../../images/vp/common/icon-close.svg");
}
.vp-plan-detail-modal .vp-plan-detail-modal__content {
  flex: 1 1 auto;
  overflow-y: scroll;
}
.vp-plan-detail-modal .vp-plan-detail-modal__legend {
  padding: var(--space-12);
  border-top: 1px solid var(--color-line-soft);
  border-bottom: 1px solid var(--color-line-soft);
  background: var(--color-bg-base);
}
.vp-plan-detail-modal .vp-plan-detail-modal__legend-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-4) var(--space-12);
}
.vp-plan-detail-modal .vp-plan-detail-modal__legend-item {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  font-size: var(--font-size-caption);
  color: var(--color-text-sub);
}
.vp-plan-detail-modal .vp-plan-detail-modal__legend-item::before {
  display: block;
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 6px;
}
.vp-plan-detail-modal .vp-plan-detail-modal__legend-item.vp-plan-detail-modal__legend-item--tdl::before {
  background: var(--color-icon-tdl);
}
.vp-plan-detail-modal .vp-plan-detail-modal__legend-item.vp-plan-detail-modal__legend-item--tds::before {
  background: var(--color-icon-tds);
}
.vp-plan-detail-modal .vp-plan-detail-modal__legend-item.vp-plan-detail-modal__legend-item--tdh::before {
  background: var(--color-icon-tdh);
}
.vp-plan-detail-modal .vp-plan-detail-modal__panels {
  display: flex;
  flex-direction: column;
  gap: var(--space-48);
  padding: var(--space-20);
}
@media (min-width: 768px) {
  .vp-plan-detail-modal .vp-plan-detail-modal__panels {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 1fr;
    gap: var(--space-16);
  }
}
.vp-plan-detail-modal .vp-plan-detail-modal__panel {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.vp-plan-detail-modal .vp-plan-detail-modal__image {
  border-radius: var(--round-big);
  margin-bottom: var(--space-16);
}
@media (min-width: 768px) {
  .vp-plan-detail-modal .vp-plan-detail-modal__image {
    margin-bottom: var(--space-12);
  }
}
.vp-plan-detail-modal .vp-plan-detail-modal__text-block {
  flex: 1 1 auto;
}
@media (min-width: 768px) {
  .vp-plan-detail-modal .vp-plan-detail-modal__text-block {
    flex: none;
    min-height: 88px;
  }
}
.vp-plan-detail-modal .vp-plan-detail-modal__lead {
  font-size: var(--font-size-heading-lv4);
  font-weight: var(--font-weight-bold);
}
@media (min-width: 768px) {
  .vp-plan-detail-modal .vp-plan-detail-modal__lead {
    font-size: var(--font-size-card-title);
  }
}
.vp-plan-detail-modal .vp-plan-detail-modal__headline {
  font-size: var(--font-size-heading-lv2);
  font-weight: var(--font-weight-bold);
}
@media (min-width: 768px) {
  .vp-plan-detail-modal .vp-plan-detail-modal__headline {
    font-size: var(--font-size-heading-lv4);
  }
}
.vp-plan-detail-modal .vp-plan-detail-modal__text {
  margin-top: var(--space-8);
  font-size: var(--font-size-body);
}
.vp-plan-detail-modal .vp-plan-detail-modal__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  margin-top: var(--space-16);
}
@media (min-width: 768px) {
  .vp-plan-detail-modal .vp-plan-detail-modal__list {
    margin-top: var(--space-12);
  }
}
.vp-plan-detail-modal .vp-plan-detail-modal__list .vp-plan-detail-modal__list-item {
  position: relative;
  display: grid;
  grid-template-columns: 6px minmax(0, 1fr);
  -moz-column-gap: var(--space-8);
       column-gap: var(--space-8);
  padding: var(--space-8);
  background: var(--color-bg-base);
  border-radius: 8px;
  font-size: 14px;
  color: var(--color-black);
  /* dot */
}
.vp-plan-detail-modal .vp-plan-detail-modal__list .vp-plan-detail-modal__list-item::before {
  content: "";
  position: absolute;
  left: var(--space-8);
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  border-radius: 50%;
}
.vp-plan-detail-modal .vp-plan-detail-modal__list .vp-plan-detail-modal__list-item .vp-plan-detail-modal__list-name,
.vp-plan-detail-modal .vp-plan-detail-modal__list .vp-plan-detail-modal__list-item .vp-plan-detail-modal__list-label {
  grid-column: 2;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
  display: block;
}
.vp-plan-detail-modal .vp-plan-detail-modal__list .vp-plan-detail-modal__list-item .vp-plan-detail-modal__list-label {
  line-height: 1.4;
}
.vp-plan-detail-modal .vp-plan-detail-modal__list .vp-plan-detail-modal__list-item.vp-plan-detail-modal__list-item--tdh .vp-plan-detail-modal__list-name {
  font-size: 12px;
  color: var(--color-gray01, var(--color-black));
  line-height: 1.3;
}
.vp-plan-detail-modal .vp-plan-detail-modal__list .vp-plan-detail-modal__list-item.vp-plan-detail-modal__list-item--tdh .vp-plan-detail-modal__list-label {
  font-size: 14px;
}
.vp-plan-detail-modal .vp-plan-detail-modal__list .vp-plan-detail-modal__list-item {
  /* dot color */
}
.vp-plan-detail-modal .vp-plan-detail-modal__list .vp-plan-detail-modal__list-item.vp-plan-detail-modal__list-item--tdl::before {
  background: var(--color-icon-tdl);
}
.vp-plan-detail-modal .vp-plan-detail-modal__list .vp-plan-detail-modal__list-item.vp-plan-detail-modal__list-item--tds::before {
  background: var(--color-icon-tds);
}
.vp-plan-detail-modal .vp-plan-detail-modal__list .vp-plan-detail-modal__list-item.vp-plan-detail-modal__list-item--tdh::before {
  background: var(--color-icon-tdh);
}
.vp-plan-detail-modal .vp-plan-detail-modal__note {
  color: var(--color-gray01);
  font-size: 12px;
  margin-top: 28px;
  padding: 0 20px 48px;
}

/* ===========================================
  vp-plan-detail-modal-book
=========================================== */
.vp-plan-detail-modal-book__inner {
  padding: 32px 20px 48px;
  border-top: 1px solid var(--color-gray03);
}
@media (min-width: 768px) {
  .vp-plan-detail-modal-book__inner {
    padding: 32px;
  }
}
.vp-plan-detail-modal-book__item:not(:last-child) {
  padding-bottom: var(--space-32);
  border-bottom: 1px solid var(--color-gray03);
}
.vp-plan-detail-modal-book__item:not(:first-child) {
  padding-top: var(--space-32);
}
@media (min-width: 768px) {
  .vp-plan-detail-modal-book__item {
    display: flex;
    gap: 58px;
    align-items: center;
    justify-content: center;
  }
}
.vp-plan-detail-modal-book__schedule {
  margin-bottom: var(--space-16);
  text-align: center;
}
@media (min-width: 768px) {
  .vp-plan-detail-modal-book__schedule {
    margin-bottom: 0;
    flex: 0 0 324px;
  }
}
.vp-plan-detail-modal-book__day {
  font-size: 16px;
  line-height: 2;
  color: var(--color-black);
}
@media (min-width: 768px) {
  .vp-plan-detail-modal-book__day {
    line-height: 1.5;
  }
}

.vp-plan-detail-list-wrapper {
  overflow-x: scroll;
}
.vp-plan-detail-list-wrapper:has(+ *) {
  margin-bottom: var(--space-y-lv2);
}
@media (min-width: 768px) {
  .vp-plan-detail-list-wrapper {
    overflow: hidden;
  }
}

ul.vp-plan-detail-list {
  display: flex;
  gap: var(--space-8);
  margin-left: var(--space-x-side);
  box-sizing: content-box;
}
ul.vp-plan-detail-list::after {
  content: "";
  flex: 0 0 calc(var(--space-x-side) - var(--space-8));
}
@media (min-width: 768px) {
  ul.vp-plan-detail-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-16);
    margin-left: 0;
    padding: 0 var(--space-32);
  }
  ul.vp-plan-detail-list::after {
    content: none;
  }
}
ul.vp-plan-detail-list .vp-plan-detail-list__item {
  flex: 0 0 200px;
}
ul.vp-plan-detail-list .vp-plan-detail-list__item a {
  border-radius: var(--round-big);
  overflow: hidden;
  background: #fff;
  height: 100%;
}
ul.vp-plan-detail-list .vp-plan-detail-list__item.vp-plan-detail-list__item--external {
  position: relative;
}
ul.vp-plan-detail-list .vp-plan-detail-list__item.vp-plan-detail-list__item--external::after {
  display: block;
  position: absolute;
  top: 10px;
  right: 10px;
  content: "";
  width: 32px;
  height: 32px;
  background-image: url("../../images/vp/common/icon-external.svg");
  pointer-events: none;
}

.vp-plan-detail-card {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.vp-plan-detail-card .vp-plan-detail-card__image {
  width: 100%;
}
.vp-plan-detail-card .vp-plan-detail-card__body {
  flex: 1 1 auto;
  padding: var(--space-12) var(--space-12);
}
.vp-plan-detail-card .vp-plan-detail-card__title {
  font-size: var(--font-size-card-title);
  font-weight: var(--font-weight-bold);
}
.vp-plan-detail-card .vp-plan-detail-card__tags {
  margin-top: var(--space-4);
  display: flex;
  gap: var(--space-4) var(--space-y-lv4);
  flex-wrap: wrap;
  font-size: var(--font-size-caption);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-sub);
}
.vp-plan-detail-card .vp-plan-detail-card__tags .vp-plan-detail-card__tag {
  display: flex;
}
.vp-plan-detail-card .vp-plan-detail-card__tags .vp-plan-detail-card__tag::before {
  content: "";
  display: block;
  margin-right: 1px;
  width: 7px;
  height: 16px;
  background-image: url("../../images/vp/common/icon-hash-tag.svg");
}
.vp-plan-detail-card .vp-plan-detail-card__meta {
  flex: 0 0 auto;
  padding: var(--space-12) var(--space-12);
  border-top: 1px solid var(--color-line-base);
  display: flex;
  gap: 4px;
  box-sizing: border-box;
  align-items: center;
}
.vp-plan-detail-card .vp-plan-detail-card__meta.vp-plan-detail-card__meta--reserve-time .vp-plan-detail-card__meta-icon {
  background-image: url("../../images/vp/common/icon-check.svg");
}
.vp-plan-detail-card .vp-plan-detail-card__meta.vp-plan-detail-card__meta--reserve-time .vp-plan-detail-card__meta-text {
  color: var(--color-text-accent);
}
.vp-plan-detail-card .vp-plan-detail-card__meta.vp-plan-detail-card__meta--anytime-ride .vp-plan-detail-card__meta-icon {
  background-image: url("../../images/vp/common/icon-time.svg");
}
.vp-plan-detail-card .vp-plan-detail-card__meta.vp-plan-detail-card__meta--location {
  align-items: start;
}
.vp-plan-detail-card .vp-plan-detail-card__meta.vp-plan-detail-card__meta--location .vp-plan-detail-card__meta-icon {
  background-image: url("../../images/vp/common/icon-pin.svg");
}
.vp-plan-detail-card .vp-plan-detail-card__meta .vp-plan-detail-card__meta-icon {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  background-size: 100%;
}
.vp-plan-detail-card .vp-plan-detail-card__meta .vp-plan-detail-card__meta-text {
  font-size: var(--font-size-caption);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-sub);
}

.vp-plan-detail-recommend-list-wrapper {
  overflow-x: scroll;
}
@media (min-width: 768px) {
  .vp-plan-detail-recommend-list-wrapper {
    overflow: hidden;
  }
}

ul.vp-plan-detail-recommend-list {
  display: flex;
  gap: var(--space-20);
  margin-left: var(--space-x-side);
}
ul.vp-plan-detail-recommend-list::after {
  content: "";
  flex: 0 0 1px;
}
@media (min-width: 768px) {
  ul.vp-plan-detail-recommend-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin-left: 0;
    content: none;
  }
}
ul.vp-plan-detail-recommend-list .vp-plan-detail-recommend-list__item {
  flex: 0 0 300px;
}
ul.vp-plan-detail-recommend-list .vp-plan-detail-recommend-list__item a {
  display: block;
  border-radius: var(--round-big);
  overflow: hidden;
  background: #fff;
  height: 100%;
}
ul.vp-plan-detail-recommend-list .vp-plan-detail-recommend-list__item.vp-plan-detail-recommend-list__item--external {
  position: relative;
}
ul.vp-plan-detail-recommend-list .vp-plan-detail-recommend-list__item.vp-plan-detail-recommend-list__item--external::after {
  display: block;
  position: absolute;
  top: 10px;
  right: 10px;
  content: "";
  width: 32px;
  height: 32px;
  background-image: url("../../images/vp/common/icon-external.svg");
  pointer-events: none;
}

.vp-plan-detail-intro {
  background-color: var(--color-white);
}
@media (min-width: 768px) {
  .vp-plan-detail-intro {
    border-radius: var(--round-small);
  }
}
.vp-plan-detail-intro__content {
  margin-top: var(--space-y-lv2);
  padding: 0 20px var(--space-y-lv1);
}
@media (min-width: 768px) {
  .vp-plan-detail-intro__content {
    margin-top: 32px;
    padding: 0 32px var(--space-y-lv1);
  }
}
.vp-plan-detail-intro__visual {
  width: 100%;
}
.vp-plan-detail-intro__figure {
  position: relative;
  width: 100%;
  aspect-ratio: 440/246;
  margin: 0;
  overflow: hidden;
}
.vp-plan-detail-intro__image {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media (min-width: 768px) {
  .vp-plan-detail-intro__image {
    border-radius: var(--round-small) var(--round-small) 0 0;
  }
}
.vp-plan-detail-intro__badge {
  position: relative;
  padding-left: 21px;
  font-size: var(--font-size-heading-lv4);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-accent);
}
.vp-plan-detail-intro__badge::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  display: block;
  margin-right: var(--space-4);
  width: 16.61px;
  height: 19.03px;
  background-image: url("../../images/vp/common/icon-sparkle-01.svg");
}
.vp-plan-detail-intro__title {
  font-size: var(--font-size-heading-lv2);
  font-weight: var(--font-weight-bold);
  margin-top: var(--space-y-lv3);
}
.vp-plan-detail-intro__date {
  margin-top: var(--space-y-lv3);
  font-size: var(--font-size-caption);
}
.vp-plan-detail-intro__description {
  margin-top: var(--space-y-lv3);
}
.vp-plan-detail-intro__text {
  font-size: var(--font-size-body);
}
.vp-plan-detail-intro__text + .vp-plan-detail-intro__text {
  margin-top: var(--space-y-lv3);
}
.vp-plan-detail-intro__note {
  position: relative;
  padding-left: 1rem;
  font-size: var(--font-size-caption);
  color: var(--color-gray01);
  margin-top: var(--space-y-lv4);
}
.vp-plan-detail-intro__note::before {
  content: "※";
  position: absolute;
  left: 0;
  top: 0;
  font-size: var(--font-size-caption);
}

.vp-plan-detail-book {
  margin-top: var(--space-12);
  margin-bottom: var(--space-12);
  background-color: var(--color-white);
}
@media (min-width: 768px) {
  .vp-plan-detail-book {
    border-radius: var(--round-small);
    margin-bottom: 0;
  }
}
.vp-plan-detail-book__inner {
  padding: 32px 20px 48px;
}
.vp-plan-detail-book__icon {
  width: 56px;
  margin: 0 auto;
}
.vp-plan-detail-book__lead {
  font-size: var(--font-size-heading-lv3);
  font-weight: var(--font-weight-bold);
  color: var(--color-graphic04);
  margin: var(--space-y-lv3) 0;
  display: flex;
  gap: 5px;
  justify-content: center;
}
@media (min-width: 768px) {
  .vp-plan-detail-book__lead {
    font-size: var(--font-size-heading-lv4);
  }
}
.vp-plan-detail-book__slash {
  font-family: "Cascadia Mono", "Consolas", "Menlo", "SFMono-Regular", "Courier New", monospace;
}

.vp-plan-detail-info {
  margin-bottom: var(--space-16);
  background-color: var(--color-white);
}
.vp-plan-detail-info:has(+ .vp-plan-detail-sections) {
  margin-bottom: calc(var(--space-y-lv1) - 10px);
}
@media (min-width: 768px) {
  .vp-plan-detail-info {
    border-radius: var(--round-small);
  }
}
.vp-plan-detail-info__inner {
  padding: 32px 20px;
}
@media (min-width: 768px) {
  .vp-plan-detail-info__inner {
    padding: 32px;
  }
}
.vp-plan-detail-info__card {
  margin-bottom: var(--space-16);
}
@media (min-width: 768px) {
  .vp-plan-detail-info__card {
    display: flex;
    align-items: flex-start;
    gap: var(--space-20);
  }
}
.vp-plan-detail-info__thumb {
  width: 100%;
  margin-bottom: var(--space-16);
  position: relative;
  aspect-ratio: 350/196;
  overflow: hidden;
}
@media (min-width: 768px) {
  .vp-plan-detail-info__thumb {
    width: 300px;
    aspect-ratio: 300/168;
    flex-shrink: 0;
    margin-bottom: 0;
  }
}
.vp-plan-detail-info__thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 8px;
}
.vp-plan-detail-info__label {
  padding: var(--space-4) var(--space-16);
  background-color: var(--color-gray05);
  color: var(--color-white);
  font-family: var(--font-family-en);
  font-size: var(--font-size-caption);
  font-weight: 700;
  border-radius: 4px;
  display: inline-block;
}
.vp-plan-detail-info__title {
  font-size: var(--font-size-heading-lv3);
  font-weight: var(--font-weight-bold);
  margin-top: var(--space-16);
}
.vp-plan-detail-info__text {
  font-size: var(--font-size-body);
  margin-top: 12px;
}
.vp-plan-detail-info__note {
  position: relative;
  padding-left: 1rem;
  font-size: var(--font-size-caption);
  color: var(--color-gray01);
  margin-top: var(--space-4);
}
.vp-plan-detail-info__note::before {
  content: "※";
  position: absolute;
  left: 0;
  top: 0;
  font-size: var(--font-size-caption);
}

.vp-plan-detail-accordion {
  position: relative;
  padding-top: var(--space-32);
  background-color: var(--color-white);
  max-width: 350px;
  width: 100%;
  margin: var(--space-32) auto 0;
  z-index: 1;
}
@media (min-width: 768px) {
  .vp-plan-detail-accordion {
    max-width: 376px;
  }
}
.vp-plan-detail-accordion::before, .vp-plan-detail-accordion::after {
  content: "";
  position: absolute;
  transform: translateY(-50%);
  background-repeat: no-repeat;
  background-size: contain;
  z-index: -1;
}
.vp-plan-detail-accordion::before {
  width: 97px;
  height: 45px;
  top: 10px;
  left: -20px;
  background-image: url("../../images/vp/plan/detail/plan-detail-sparkle-01.svg");
}
.vp-plan-detail-accordion::after {
  width: 118px;
  height: 75px;
  top: 122px;
  right: -35px;
  background-image: url("../../images/vp/plan/detail/plan-detail-sparkle-02.svg");
}
.vp-plan-detail-accordion__item {
  max-width: 350px;
  margin: 0 auto 12px;
}
@media (min-width: 768px) {
  .vp-plan-detail-accordion__item {
    max-width: 376px;
  }
}
.vp-plan-detail-accordion__lid {
  position: relative;
  height: 25px;
  background: url("../../images/vp/common/bg-suitcase-lid.png") top center no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
  z-index: 2;
}
@media (min-width: 768px) {
  .vp-plan-detail-accordion__lid {
    height: 25.8px;
  }
}
.vp-plan-detail-accordion__content {
  background: linear-gradient(0deg, var(--color-grand) 0%, var(--color-graphic01) 100%);
  max-height: 0;
  opacity: 0;
  overflow: hidden;
}
.vp-plan-detail-accordion__inner {
  padding: 24px 16px;
}
.vp-plan-detail-accordion__body {
  position: relative;
  padding: 20px 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1;
}
.vp-plan-detail-accordion__body::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  right: 0;
  left: 0;
  bottom: -10px;
  height: 90px;
  width: 100%;
  background: url("../../images/vp/common/bg-suitcase-body.png") bottom center no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
  z-index: 0;
}
@media (min-width: 768px) {
  .vp-plan-detail-accordion__body::before {
    height: 96.7px;
  }
}
.vp-plan-detail-accordion__button {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  border: none;
  background: transparent;
  cursor: pointer;
  padding: 0;
}
.vp-plan-detail-accordion__button .vp-plan-detail-accordion__text {
  transition: filter 0.3s ease;
}
@media (hover: hover) and (pointer: fine) {
  .vp-plan-detail-accordion__button:hover .vp-plan-detail-accordion__text {
    filter: brightness(0.95);
  }
}
.vp-plan-detail-accordion__text {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 38px 8px 16px;
  border-radius: 9999px;
  background-color: var(--color-white);
  color: var(--color-graphic04);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.03em;
  white-space: nowrap;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
}
@media (min-width: 768px) {
  .vp-plan-detail-accordion__text {
    font-size: 20px;
  }
}
.vp-plan-detail-accordion__toggle {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: 0;
  transform: translate(-8px, -50%);
  width: 20px;
  height: 20px;
  border-radius: 9999px;
  background-color: var(--color-graphic04);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.vp-plan-detail-accordion__toggle::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-image: url("../../images/vp/common/icon-plus.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
}
.vp-plan-detail-accordion {
  /* 開いたときに − アイコンに差し替え */
}
.vp-plan-detail-accordion__item.is-open .vp-plan-detail-accordion__toggle::before {
  background-image: url("../../images/vp/common/icon-minus.svg");
}
.vp-plan-detail-accordion {
  /* 開いたとき（JS で .is-open を付与） */
}
.vp-plan-detail-accordion__item.is-open .vp-plan-detail-accordion__content {
  max-height: 500px;
  opacity: 1;
  margin-top: 0;
}

/* ===========================================
  スーツケースの「閉じているときだけ」ゆらゆらアニメ
=========================================== */
.vp-plan-detail-accordion__body::before {
  transform-origin: center top;
}

.vp-plan-detail-accordion__item:not(.is-open) .vp-plan-detail-accordion__body::before {
  animation: vp-suitcase-body-wiggle 5s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
  .vp-plan-detail-accordion__item:not(.is-open) .vp-plan-detail-accordion__body::before {
    animation: none;
  }
}
@keyframes vp-suitcase-body-wiggle {
  0%, 72% {
    transform: translateY(0);
  }
  80% {
    transform: translateY(-14px);
  }
  85% {
    transform: translateY(2.3px);
  }
  89% {
    transform: translateY(-3px);
  }
  92% {
    transform: translateY(1.8px);
  }
  95% {
    transform: translateY(-1.2px);
  }
  97% {
    transform: translateY(0.6px);
  }
  100% {
    transform: translateY(0);
  }
}
/* ===========================================
  アコーディオンが開く瞬間の「宝箱パカッ」アニメーション
=========================================== */
.vp-plan-detail-accordion__content {
  transition: max-height var(--acc-dur, 0.55s) var(--acc-ease, cubic-bezier(0.4, 0, 0.2, 1)), opacity var(--acc-op-dur, 0.35s) var(--acc-op-ease, ease-in);
}

/* 開く時（is-openになった瞬間）を重く */
.vp-plan-detail-accordion__item.is-open {
  --acc-dur: 1s;
  --acc-ease: cubic-bezier(0.64, 0, 0.78, 0);
  --acc-op-dur: 1.05s;
  --acc-op-ease: ease-out;
}

.vp-plan-detail-accordion__item.is-open .vp-plan-detail-accordion__body {
  animation: vp-suitcase-body-open-boost 0.65s both;
}

@keyframes vp-suitcase-body-open-boost {
  0% {
    transform: translateY(10px);
  }
  70% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(0);
  }
}
/* ===========================================
  アコーディオンが閉じる瞬間の「パタン」アニメーション
=========================================== */
.vp-plan-detail-accordion__item.is-closing .vp-plan-detail-accordion__body {
  animation: vp-suitcase-body-close 0.45s cubic-bezier(0.32, 0.72, 0, 1.2);
}

@keyframes vp-suitcase-body-close {
  0% {
    transform: translateY(0);
  }
  25% {
    transform: translateY(-4px);
  }
  55% {
    transform: translateY(3px);
  }
  80% {
    transform: translateY(-2px);
  }
  100% {
    transform: translateY(0);
  }
}
.vp-plan-detail-ticket {
  border-radius: 8px;
  background-color: var(--color-white);
  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.12);
  overflow: hidden;
  position: relative;
}
.vp-plan-detail-ticket:not(:last-child) {
  margin-bottom: var(--space-12);
}
.vp-plan-detail-ticket__content {
  padding: var(--space-12);
  background-image: url("../../images/vp/plan/detail/plan-detail-ticket-bg.png");
  background-repeat: repeat-y;
  background-position: center top;
  background-size: 100% auto;
}
.vp-plan-detail-ticket__head {
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
}
.vp-plan-detail-ticket__label {
  display: flex;
  align-items: center;
}
.vp-plan-detail-ticket__icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  margin-right: 10px;
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
}
.vp-plan-detail-ticket__icon--park {
  background-color: #a1c515;
  background-image: url("../../images/vp/common/icon-plan-park-ticket.svg");
}
.vp-plan-detail-ticket__icon--attraction {
  background-color: #eea301;
  background-image: url("../../images/vp/common/icon-plan-attraction.svg");
}
.vp-plan-detail-ticket__icon--show {
  background-color: #dd1b7d;
  background-image: url("../../images/vp/common/icon-plan-show.svg");
}
.vp-plan-detail-ticket__icon--restaurant {
  background-color: #15a452;
  background-image: url("../../images/vp/common/icon-plan-restaurant.svg");
}
.vp-plan-detail-ticket__icon--greeting {
  background-color: #1844c4;
  background-image: url("../../images/vp/common/icon-plan-greeting.svg");
}
.vp-plan-detail-ticket__title {
  font-size: 16px;
  font-weight: var(--font-weight-bold);
}
.vp-plan-detail-ticket__range, .vp-plan-detail-ticket__unit {
  display: block;
  text-align: right;
  font-size: var(--font-size-heading-lv3);
  font-weight: var(--font-weight-bold);
  color: var(--color-gray01);
}
@media (min-width: 768px) {
  .vp-plan-detail-ticket__range, .vp-plan-detail-ticket__unit {
    font-size: 20px;
  }
}
.vp-plan-detail-ticket__parks {
  margin-top: 2px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  text-align: right;
  font-size: var(--font-size-heading-lv3);
  font-weight: var(--font-weight-bold);
  color: var(--color-gray01);
}
@media (min-width: 768px) {
  .vp-plan-detail-ticket__parks {
    font-size: 20px;
  }
}
.vp-plan-detail-ticket__park {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 0;
  border-bottom: 1px dashed var(--color-gray03);
}
.vp-plan-detail-ticket__park-label {
  margin-right: 4px;
  font-weight: var(--font-weight-regular);
  font-size: 12px;
  color: var(--color-black);
}
.vp-plan-detail-ticket__note {
  color: var(--color-gray01);
  font-size: var(--font-size-caption);
  margin-top: var(--space-12);
}
.vp-plan-detail-ticket__btn {
  position: relative;
  width: 100%;
  font-size: 12px;
  padding: 12px calc(24px + var(--space-12)) 12px var(--space-12);
  border: none;
  cursor: pointer;
  color: var(--color-black);
  font-weight: var(--font-weight-bold);
  text-align: right;
  border-top: 1px solid var(--color-gray03);
  background-color: var(--color-white);
}
@media (min-width: 768px) {
  .vp-plan-detail-ticket__btn {
    display: none;
  }
}
.vp-plan-detail-ticket__btn span::after {
  content: "";
  position: absolute;
  top: 50%;
  right: var(--space-12);
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  background-image: url("../../images/vp/common/icon-arrow-down-circle-navy.svg");
  background-size: contain;
  background-repeat: no-repeat;
}
.vp-plan-detail-ticket {
  /* 色バリエーション */
}
.vp-plan-detail-ticket--park {
  border-top: 9px solid #a1c515;
}
.vp-plan-detail-ticket--park .vp-plan-detail-ticket__title {
  color: #a1c515;
}
.vp-plan-detail-ticket--attraction {
  border-top: 9px solid #eea301;
}
.vp-plan-detail-ticket--attraction .vp-plan-detail-ticket__title {
  color: #eea301;
}
.vp-plan-detail-ticket--show {
  border-top: 9px solid #dd1b7d;
}
.vp-plan-detail-ticket--show .vp-plan-detail-ticket__title {
  color: #dd1b7d;
}
.vp-plan-detail-ticket--restaurant {
  border-top: 9px solid #15a452;
}
.vp-plan-detail-ticket--restaurant .vp-plan-detail-ticket__title {
  color: #15a452;
}
.vp-plan-detail-ticket--greeting {
  border-top: 9px solid #1844c4;
}
.vp-plan-detail-ticket--greeting .vp-plan-detail-ticket__title {
  color: #1844c4;
}
.vp-plan-detail-ticket--others .vp-plan-detail-ticket__title {
  color: var(--color-graphic04);
}

.vp-main.vp-main--plan-detail {
  background: var(--color-graphic01);
}

@media (min-width: 768px) {
  .vp-plan-detail-container {
    overflow-x: auto;
  }
}

@media (min-width: 768px) {
  .vp-plan-detail-layout > div {
    width: 1280px;
    margin: 0 auto;
    padding-top: var(--space-32);
    display: flex;
    gap: var(--space-32);
  }
  .vp-plan-detail-layout .vp-plan-detail-layout__side {
    width: 440px;
    flex: 0 0 440px;
  }
  .vp-plan-detail-layout .vp-plan-detail-layout__main {
    width: 808px;
    flex: 0 0 808px;
  }
}
.vp-button.vp-button--plan-detail, .vp-plan-detail-section .vp-button--plan-detail.vp-plan-detail-section__hint-button {
  background: var(--color-accent01);
}

.vp-plan-detail-section .vp-plan-detail-section__header {
  position: relative;
  padding-top: 10px;
}
.vp-plan-detail-section .vp-plan-detail-section__header::before {
  position: absolute;
  top: 0;
  left: calc(var(--space-x-side) - 14px);
  display: block;
  content: "";
  width: 64px;
  height: 64px;
  border-radius: 64px;
  border: 14px solid var(--color-bg-grand);
}
@media (min-width: 768px) {
  .vp-plan-detail-section .vp-plan-detail-section__header::before {
    left: calc(var(--space-32) - 14px);
    width: 70px;
    height: 70px;
    border-radius: 70px;
  }
}
.vp-plan-detail-section .vp-plan-detail-section__header .vp-plan-detail-section__header-inner {
  padding: var(--space-4) var(--space-x-side) var(--space-32);
  background: var(--color-bg-grand);
}
@media (min-width: 768px) {
  .vp-plan-detail-section .vp-plan-detail-section__header .vp-plan-detail-section__header-inner {
    border-radius: var(--round-small) var(--round-small) 0 0;
    padding: var(--space-4) var(--space-32) var(--space-32);
  }
}
.vp-plan-detail-section .vp-plan-detail-section__header.vp-plan-detail-section__header--attraction .vp-plan-detail-section__title::before {
  background: url("../../images/vp/common/icon-attraction.svg") center center/32px 32px no-repeat, var(--color-attraction);
}
.vp-plan-detail-section .vp-plan-detail-section__header.vp-plan-detail-section__header--attraction .vp-plan-detail-section__hint-label {
  background: var(--color-attraction);
}
.vp-plan-detail-section .vp-plan-detail-section__header.vp-plan-detail-section__header--show .vp-plan-detail-section__title::before {
  background: url("../../images/vp/common/icon-show.svg") center center/32px 32px no-repeat, var(--color-show);
}
.vp-plan-detail-section .vp-plan-detail-section__header.vp-plan-detail-section__header--show .vp-plan-detail-section__hint-label {
  background: var(--color-show);
}
.vp-plan-detail-section .vp-plan-detail-section__header.vp-plan-detail-section__header--restaurant .vp-plan-detail-section__title::before {
  background: url("../../images/vp/common/icon-restaurant.svg") center center/32px 32px no-repeat, var(--color-restaurant);
}
.vp-plan-detail-section .vp-plan-detail-section__header.vp-plan-detail-section__header--restaurant .vp-plan-detail-section__hint-label {
  background: var(--color-restaurant);
}
.vp-plan-detail-section .vp-plan-detail-section__header.vp-plan-detail-section__header--greeting .vp-plan-detail-section__title::before {
  background: url("../../images/vp/common/icon-greeting.svg") center center/32px 32px no-repeat, var(--color-greeting);
}
.vp-plan-detail-section .vp-plan-detail-section__header.vp-plan-detail-section__header--greeting .vp-plan-detail-section__hint-label {
  background: var(--color-greeting);
}
.vp-plan-detail-section .vp-plan-detail-section__header.vp-plan-detail-section__header--hotel .vp-plan-detail-section__title::before {
  background: url("../../images/vp/common/icon-hotel.svg") center center/32px 32px no-repeat, var(--color-hotel);
}
.vp-plan-detail-section .vp-plan-detail-section__header.vp-plan-detail-section__header--hotel .vp-plan-detail-section__hint-label {
  background: var(--color-hotel);
}
.vp-plan-detail-section .vp-plan-detail-section__title {
  display: flex;
  gap: var(--space-12);
  margin-bottom: var(--space-8);
  min-height: 64px;
  box-sizing: border-box;
  font-size: var(--font-size-heading-lv1);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-logo);
}
.vp-plan-detail-section .vp-plan-detail-section__title::before {
  display: block;
  content: "";
  flex: 0 0 64px;
  width: 64px;
  height: 64px;
  border-radius: 64px;
  box-sizing: border-box;
  border: 2px solid var(--color-line-soft);
  box-shadow: 0px 0px 10px 0px rgba(1, 84, 120, 0.0784313725);
}
.vp-plan-detail-section .vp-plan-detail-section__title .vp-plan-detail-section__title-text {
  padding-top: 14px;
}
@media (min-width: 768px) {
  .vp-plan-detail-section .vp-plan-detail-section__title::before {
    flex: 0 0 70px;
    width: 70px;
    height: 70px;
    border-radius: 70px;
  }
}
.vp-plan-detail-section .vp-plan-detail-section__hint-button {
  position: relative;
  display: flex;
  justify-content: start;
  gap: var(--space-12);
  min-width: 100%;
  padding-left: var(--space-12);
  padding-top: var(--space-12);
  padding-bottom: var(--space-12);
  text-align: left;
}
@media (min-width: 768px) {
  .vp-plan-detail-section .vp-plan-detail-section__hint-button {
    min-width: 350px;
  }
}
.vp-plan-detail-section .vp-plan-detail-section__hint-button::before {
  display: block;
  position: absolute;
  top: -16px;
  left: 26px;
  content: "";
  width: 14px;
  height: 16px;
  background: url("../../images/vp/plan/detail/button-tail.svg");
}
.vp-plan-detail-section .vp-plan-detail-section__hint-button .vp-plan-detail-section__hint-label {
  box-sizing: border-box;
  flex: 0 0 77px;
  padding: 4px 9px 6px;
  font-family: var(--font-family-en);
  font-size: 12px;
  font-weight: 700;
  color: var(--color-text-base-inverse);
  border-radius: 23px;
  text-align: center;
}
.vp-plan-detail-section .vp-plan-detail-section__group {
  background: linear-gradient(180deg, #c7e8fa 0%, #f2f6f8 100%);
  padding-top: var(--space-12);
  padding-bottom: var(--space-64);
}
.vp-plan-detail-section .vp-plan-detail-section__subtitle {
  display: flex;
  align-items: center;
  margin-bottom: var(--space-16);
  margin-left: var(--space-x-side);
  font-size: var(--font-size-heading-lv4);
  font-weight: var(--font-weight-bold);
}
.vp-plan-detail-section .vp-plan-detail-section__subtitle::before {
  content: "";
  margin-right: 4px;
  display: block;
  width: 4px;
  height: 16px;
}
@media (min-width: 768px) {
  .vp-plan-detail-section .vp-plan-detail-section__subtitle {
    margin-left: var(--space-32);
  }
}
.vp-plan-detail-section .vp-plan-detail-section__subtitle.vp-plan-detail-section__subtitle--tdl::before {
  background: var(--color-parts-tdl);
}
.vp-plan-detail-section .vp-plan-detail-section__subtitle.vp-plan-detail-section__subtitle--tds::before {
  background: var(--color-parts-tds);
}
.vp-plan-detail-section .vp-plan-detail-section__subtitle.vp-plan-detail-section__subtitle--hotel::before {
  background: var(--color-parts-accent);
}
.vp-plan-detail-section .vp-plan-detail-section__note {
  padding: 0 var(--space-x-side);
  color: var(--color-text-sub);
  font-size: var(--font-size-caption);
}
@media (min-width: 768px) {
  .vp-plan-detail-section .vp-plan-detail-section__note {
    padding: 0 var(--space-32);
  }
}

.vp-plan-detail-plans .vp-plan-detail-plans__inner {
  padding: 0 0px var(--space-y-lv1);
}
@media (min-width: 768px) {
  .vp-plan-detail-plans .vp-plan-detail-plans__inner {
    margin-left: auto;
    margin-right: auto;
    padding-right: 0;
    padding-left: 0;
    max-width: var(--container-max-width-pc);
  }
}
.vp-plan-detail-plans .vp-plan-detail-plans__inner {
  padding-top: var(--space-48);
}
@media (min-width: 768px) {
  .vp-plan-detail-plans .vp-plan-detail-plans__inner {
    width: 1280px;
    padding-top: var(--space-32);
  }
}
.vp-plan-detail-plans .vp-plan-detail-plans__heading {
  margin-bottom: var(--space-16);
  padding: var(--space-4) var(--space-x-side);
  font-size: var(--font-size-heading-lv2);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-logo);
}
@media (min-width: 768px) {
  .vp-plan-detail-plans .vp-plan-detail-plans__heading {
    padding: var(--space-4) 0;
  }
}

.vp-plan-detail-note {
  padding: 0 20px;
}
@media (min-width: 768px) {
  .vp-plan-detail-note {
    padding: 0 32px;
  }
}
.vp-plan-detail-note__inner {
  display: flex;
  padding: 20px;
  flex-direction: column;
  gap: 4px;
  align-self: stretch;
  border-radius: var(--round-small);
  background: var(--color-white);
}
.vp-plan-detail-note__heading {
  color: var(--color-gray01);
  font-size: 12px;
  font-weight: var(--font-weight-bold);
}
.vp-plan-detail-note__text {
  color: var(--color-gray01);
  font-size: 12px;
  font-weight: var(--font-weight-regular);
}

@media (min-width: 768px) {
  .vp-planfinder-finder-wrapper {
    margin: 0 auto;
    min-height: 100svh;
    width: 768px;
    background: url("../../images/vp/planfinder/finder-wrapper-bg-pc.png") no-repeat center top, #e0f7fe;
    background-size: 100%;
    box-shadow: 0px 4px 24px 0px rgba(0, 0, 0, 0.0784313725);
  }
}

.vp-planfinder-finder {
  position: relative;
}
.vp-planfinder-finder .vp-planfinder-finder__intro {
  padding-top: 118px;
}
@media (min-width: 768px) {
  .vp-planfinder-finder .vp-planfinder-finder__intro {
    padding-top: var(--space-96);
    min-height: 800px;
    box-sizing: border-box;
  }
}
.vp-planfinder-finder .vp-planfinder-finder__intro.vp-is-hidden {
  display: none;
}
.vp-planfinder-finder .vp-planfinder-finder__intro .vp-planfinder-finder__intro-body {
  margin-bottom: var(--space-32);
  text-align: center;
}
.vp-planfinder-finder .vp-planfinder-finder__title {
  font-size: 52px;
  color: var(--color-text-accent);
  font-family: var(--font-family-en);
  font-weight: var(--font-weight-regular);
  margin-bottom: var(--space-y-lv5);
  letter-spacing: calc(52px * 3 / 100);
}
.vp-planfinder-finder .vp-planfinder-finder__lead {
  font-size: var(--font-size-heading-lv4);
  font-weight: var(--font-weight-bold);
}
@media (min-width: 768px) {
  .vp-planfinder-finder .vp-planfinder-finder__lead {
    margin-bottom: var(--space-32);
  }
}
.vp-planfinder-finder .vp-planfinder-finder__visual {
  overflow: hidden;
  margin-bottom: var(--space-32);
}
@media (min-width: 768px) {
  .vp-planfinder-finder .vp-planfinder-finder__visual {
    margin-bottom: var(--space-64);
  }
}
.vp-planfinder-finder .vp-planfinder-finder__visual-image {
  will-change: transform;
  width: calc(1390 / 390 * 100vw);
}
@media (min-width: 768px) {
  .vp-planfinder-finder .vp-planfinder-finder__visual-image {
    width: 2465px;
  }
}
.vp-planfinder-finder .vp-planfinder-finder__start-button {
  width: 300px;
}
.vp-planfinder-finder .vp-planfinder-finder__question-wrapper {
  padding: var(--space-48) var(--space-20) 84px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 573px;
}
.vp-planfinder-finder .vp-planfinder-finder__question-wrapper.vp-is-hidden {
  display: none;
}
@media (min-width: 768px) {
  .vp-planfinder-finder .vp-planfinder-finder__question-wrapper {
    min-height: 706px;
    padding: var(--space-20) var(--space-48) 74px;
  }
}
.vp-planfinder-finder .vp-planfinder-finder__question-text {
  margin-bottom: var(--space-32);
  font-size: var(--font-size-heading-lv3);
  font-weight: var(--font-weight-bold);
  text-align: center;
  color: var(--color-text-accent);
}
@media (min-width: 768px) {
  .vp-planfinder-finder .vp-planfinder-finder__question-text {
    font-size: var(--font-size-heading-lv2);
  }
}
.vp-planfinder-finder .vp-planfinder-finder__question-label {
  display: block;
  margin-bottom: var(--space-8);
  font-size: 22px;
  font-weight: 500;
  font-family: var(--font-family-en);
  line-height: 0.8;
}
@media (min-width: 768px) {
  .vp-planfinder-finder .vp-planfinder-finder__question-label {
    font-size: 32px;
  }
}
.vp-planfinder-finder .vp-planfinder-finder__question {
  padding: var(--space-20);
  border-radius: var(--round-big);
  box-shadow: 0px 4px 18px 0px rgba(115, 183, 201, 0.3019607843);
  background: var(--color-bg-sub);
}
@media (min-width: 768px) {
  .vp-planfinder-finder .vp-planfinder-finder__question {
    padding: var(--space-48);
  }
}
.vp-planfinder-finder .vp-planfinder-finder__options {
  display: flex;
  flex-direction: column;
  gap: var(--space-12);
}
.vp-planfinder-finder .vp-planfinder-finder__option {
  padding: var(--space-12);
  font-weight: var(--font-weight-bold);
  border: 1px solid var(--color-line-base);
  border-radius: var(--round-small);
  background: var(--color-bg-base);
}
.vp-planfinder-finder .vp-planfinder-finder__option.vp-is-active {
  background: var(--color-bg-grand);
  border: 1px solid var(--color-line-button-accent);
}
.vp-planfinder-finder .vp-planfinder-finder__loading {
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 var(--space-20);
}
.vp-planfinder-finder .vp-planfinder-finder__loading.vp-is-hidden {
  display: none;
}
.vp-planfinder-finder .vp-planfinder-finder__loading .vp-planfinder-finder__loading-message {
  margin-bottom: 80px;
  text-align: center;
  padding: var(--space-20);
  font-size: var(--font-size-heading-lv2);
  color: var(--color-text-logo);
  font-weight: var(--font-weight-bold);
}
.vp-planfinder-finder .vp-planfinder-finder__loading .vp-planfinder-finder__loading-visual {
  width: 96px;
  height: 80px;
  margin: 0 auto;
}
.vp-planfinder-finder .vp-planfinder-finder__result {
  padding: var(--space-y-lv2) 0;
}
.vp-planfinder-finder .vp-planfinder-finder__result.vp-is-hidden {
  display: none;
}
.vp-planfinder-finder .vp-planfinder-finder__result .vp-planfinder-finder__result-heading {
  text-align: center;
  font-size: var(--font-size-heading-lv1);
  color: var(--color-text-logo);
  font-weight: var(--font-weight-bold);
  margin-bottom: var(--space-32);
}
@media (min-width: 768px) {
  .vp-planfinder-finder .vp-planfinder-finder__result .vp-planfinder-finder__result-heading {
    margin-bottom: var(--space-20);
  }
}
.vp-planfinder-finder .vp-planfinder-finder__result .vp-planfinder-finder__result-card {
  margin-top: calc(-23 / 390 * 100vw);
  padding-top: calc(86 / 390 * 100vw);
  padding-bottom: var(--space-y-lv2);
  background: url("../../images/vp/planfinder/finder-result-bg.png") no-repeat center top;
  background-size: 100%;
}
@media (min-width: 768px) {
  .vp-planfinder-finder .vp-planfinder-finder__result .vp-planfinder-finder__result-card {
    margin-top: -48px;
    padding-top: 158px;
  }
}
.vp-planfinder-finder .vp-planfinder-finder__result .vp-planfinder-finder__result-text {
  position: relative;
  z-index: 1;
  padding: var(--space-16) var(--space-x-side) var(--space-y-lv3);
  background: var(--color-bg-sub);
}
@media (min-width: 768px) {
  .vp-planfinder-finder .vp-planfinder-finder__result .vp-planfinder-finder__result-text {
    padding: var(--space-20) var(--space-48) var(--space-32);
  }
}
.vp-planfinder-finder .vp-planfinder-finder__result .vp-planfinder-finder__result-label {
  margin-bottom: var(--space-16);
  text-align: center;
  font-size: var(--font-size-heading-lv3);
  font-weight: var(--font-weight-bold);
}
.vp-planfinder-finder .vp-planfinder-finder__result .vp-planfinder-finder__result-description {
  font-size: var(--font-size-body);
}
.vp-planfinder-finder .vp-planfinder-finder__result .vp-planfinder-finder__result-main {
  padding: 0 var(--space-x-side);
  background: linear-gradient(180deg, #ffffff 0%, rgba(255, 255, 255, 0) 100%);
}
@media (min-width: 768px) {
  .vp-planfinder-finder .vp-planfinder-finder__result .vp-planfinder-finder__result-main {
    padding: 0 var(--space-48);
  }
}
.vp-planfinder-finder .vp-planfinder-finder__restart-button {
  margin-top: var(--space-20);
  margin-bottom: var(--space-8);
}

.vp-planfinder-finder__back-button {
  position: absolute;
  left: 50%;
  bottom: 36px;
  transform: translateX(-50%);
  align-items: center;
  justify-content: center;
  display: flex;
  gap: 10px;
  color: var(--color-text-sub);
  font-size: var(--font-size-body);
  font-weight: var(--font-weight-bold);
}
@media (min-width: 768px) {
  .vp-planfinder-finder__back-button {
    bottom: 32px;
  }
}
.vp-planfinder-finder__back-button.vp-is-hidden {
  display: none;
}
.vp-planfinder-finder__back-button::after {
  display: block;
  content: "";
  width: 32px;
  height: 32px;
  border: 1px solid var(--color-line-base);
  border-radius: 32px;
  background-image: url("../../images/vp/common/icon-arrow-right-gray.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 16px 16px;
}

.vp-planfinder-finder__floating-restart-button {
  position: absolute;
  bottom: 36px;
}
.vp-planfinder-finder__floating-restart-button.vp-is-hidden {
  display: none;
}

.vp-main.vp-main--planfinder {
  position: relative;
  min-height: 100svh;
  background: url("../../images/vp/planfinder/finder-bg-sp.png") no-repeat center bottom, linear-gradient(180deg, #0093d0 12.26%, #94d4f4 100%);
  background-size: cover;
  background-attachment: fixed;
}
@media (min-width: 768px) {
  .vp-main.vp-main--planfinder {
    background: url("../../images/vp/planfinder/finder-bg-pc.png") no-repeat center bottom, linear-gradient(180deg, #0093d0 12.26%, #94d4f4 100%);
    background-size: cover, 100% 100%;
    background-position: center bottom, center;
    background-attachment: fixed;
  }
}

.vp-story-detail-day {
  position: relative;
  padding-top: 89px;
  margin-bottom: var(--space-y-lv2);
}
.vp-story-detail-day .vp-story-detail-day__label-wrap {
  position: absolute;
  top: 32px;
  left: 12.5px;
}
.vp-story-detail-day .vp-story-detail-day__label {
  position: relative;
  z-index: 2;
  color: var(--color-text-base-inverse);
  font-size: var(--font-size-story-day);
  font-family: var(--font-family-en);
  text-shadow: 1px 0 0 var(--color-line-gold), -1px 0 0 var(--color-line-gold), 0 1px 0 var(--color-line-gold), 0 -1px 0 var(--color-line-gold);
  letter-spacing: 0.03em;
}
.vp-story-detail-day .vp-story-detail-day__label-shadow {
  position: absolute;
  top: 2px;
  left: 4px;
  font-size: var(--font-size-story-day);
  font-family: var(--font-family-en);
  background-image: url("../../images/vp/story/detail/text-stripe-bg.png");
  /* 文字部分だけに背景を切り抜く */
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  letter-spacing: 0.03em;
}
.vp-story-detail-day .vp-story-detail-day__title-wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: var(--space-8);
  margin-top: -26px;
  margin-bottom: var(--space-16);
}
.vp-story-detail-day .vp-story-detail-day__title {
  padding: var(--space-y-lv5) var(--space-12);
  border-radius: 2px;
  font-size: var(--font-size-heading-lv1);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-base-inverse);
  background: var(--color-parts-accent);
  box-shadow: 2px 2px 0px 0px var(--color-accent03);
  white-space: nowrap;
  width: -moz-max-content;
  width: max-content;
}
.vp-story-detail-day .vp-story-detail-day__location-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
}
.vp-story-detail-day .vp-story-detail-day__location {
  display: inline-block;
  padding: var(--space-y-lv5) var(--space-12);
  font-size: var(--font-size-heading-lv4);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-logo);
  background: var(--color-bg-sub);
}

.vp-story-detail__section + .vp-story-detail-day {
  margin-top: var(--space-y-lv0);
}

.vp-story-detail-epilogue {
  display: flex;
  flex-direction: column;
  gap: var(--space-y-lv2);
  padding: 0 var(--space-20);
  color: var(--color-text-base-inverse);
}
@media (min-width: 768px) {
  .vp-story-detail-epilogue {
    max-width: var(--content-width-narrow);
    margin: 0 auto;
  }
}
.vp-story-detail-epilogue .vp-story-detail-epilogue__lead {
  text-align: center;
  font-size: var(--font-size-heading-lv1);
  font-weight: var(--font-weight-bold);
}
.vp-story-detail-epilogue .vp-story-detail-epilogue__body {
  line-height: 1.7;
  font-size: var(--font-size-story-body);
}
.vp-story-detail-epilogue .vp-story-detail-epilogue__note {
  font-size: var(--font-size-caption);
  color: var(--color-text-sub-inverse);
}

.vp-story-detail-hero {
  padding-top: 7px;
}
@media (min-width: 768px) {
  .vp-story-detail-hero {
    padding-top: 24px;
    padding-bottom: 62px;
    background: url("../../images/vp/story/detail/hero-day-bg.jpg") no-repeat center top;
    background-size: cover;
  }
}
@media (min-width: 768px) {
  .vp-story-detail-hero .vp-story-detail-hero__inner {
    position: relative;
    margin: 0 auto;
    width: min(calc(842 / 1280 * 100vw), 842px);
    height: min(calc(558 / 1280 * 100vw), 558px);
  }
}
.vp-story-detail-hero .vp-story-detail-hero__image-wrap {
  position: relative;
}
.vp-story-detail-hero .vp-story-detail-hero__image-wrap::before {
  position: absolute;
  z-index: 1;
  top: calc(61 / 390 * 100vw);
  left: calc(-7 / 390 * 100vw);
  content: "";
  display: block;
  width: calc(53 / 390 * 100vw);
  height: calc(152 / 390 * 100vw);
  background-image: url("../../images/vp/common/icon-sparkle-05.svg");
  background-size: cover;
}
@media (min-width: 768px) {
  .vp-story-detail-hero .vp-story-detail-hero__image-wrap::before {
    width: min(calc(54 / 1280 * 100vw), 54px);
    height: min(calc(156 / 1280 * 100vw), 156px);
    top: min(calc(56 / 1280 * 100vw), 56px);
    left: 0;
  }
}
.vp-story-detail-hero .vp-story-detail-hero__image-wrap::after {
  position: absolute;
  z-index: 2;
  top: calc(368 / 390 * 100vw);
  right: calc(-9 / 390 * 100vw);
  content: "";
  display: block;
  width: calc(70 / 390 * 100vw);
  height: calc(139 / 390 * 100vw);
  background-image: url("../../images/vp/common/icon-sparkle-06.svg");
  background-size: cover;
}
@media (min-width: 768px) {
  .vp-story-detail-hero .vp-story-detail-hero__image-wrap::after {
    width: min(calc(72 / 1280 * 100vw), 72px);
    height: min(calc(142 / 1280 * 100vw), 142px);
    top: min(calc(371 / 1280 * 100vw), 371px);
    right: 0;
  }
}
@media (min-width: 768px) {
  .vp-story-detail-hero .vp-story-detail-hero__image-wrap {
    position: absolute;
    top: 0;
    right: 0;
  }
}
.vp-story-detail-hero .vp-story-detail-hero__image-inner {
  position: relative;
}
.vp-story-detail-hero .vp-story-detail-hero__image-inner::after {
  content: "";
  display: block;
  position: absolute;
  top: calc(481 / 390 * 100vw);
  left: calc(17 / 390 * 100vw);
  width: calc(360 / 390 * 100vw);
  height: calc(60 / 390 * 100vw);
  background: url("../../images/vp/story/detail/image-shadow.png") no-repeat 0 0;
  background-size: contain;
  opacity: 0.25;
  transform-origin: bottom left;
  transform: rotate(6.83deg);
}
@media (min-width: 768px) {
  .vp-story-detail-hero .vp-story-detail-hero__image-inner::after {
    width: min(calc(373 / 1280 * 100vw), 373px);
    height: min(calc(62 / 1280 * 100vw), 62px);
    top: min(calc(496 / 1280 * 100vw), 496px);
    left: auto;
    right: min(calc(15 / 1280 * 100vw), 15px);
    transform: rotate(6.82deg);
  }
}
.vp-story-detail-hero .vp-story-detail-hero__image {
  position: relative;
  z-index: 1;
  margin-left: calc(14 / 390 * 100vw);
  width: calc(353 / 390 * 100vw);
  transform-origin: bottom left;
  transform: rotate(3deg);
  border: 4px solid var(--color-line-base-inverse);
  box-shadow: 2px 2px 14px 2px rgba(5, 64, 143, 0.1607843137);
  box-sizing: border-box;
}
@media (min-width: 768px) {
  .vp-story-detail-hero .vp-story-detail-hero__image {
    margin-left: min(calc(21 / 1280 * 100vw), 21px);
    margin-right: min(calc(29 / 1280 * 100vw), 29px);
    position: relative;
    right: 0;
    width: min(calc(363 / 1280 * 100vw), 363px);
  }
}
.vp-story-detail-hero .vp-story-detail-hero__heading-block {
  position: relative;
  z-index: 2;
  margin-top: calc(-89 / 390 * 100vw);
}
@media (min-width: 768px) {
  .vp-story-detail-hero .vp-story-detail-hero__heading-block {
    position: absolute;
    bottom: min(calc(96 / 1280 * 100vw), 96px);
    margin-top: 0;
  }
}
.vp-story-detail-hero .vp-story-detail-hero__lead {
  display: inline-block;
  padding: 6px var(--space-8);
  color: var(--color-text-base-inverse);
  font-size: var(--font-size-heading-lv4);
  font-weight: var(--font-weight-bold);
  background: var(--color-parts-gold);
  border-radius: 0 4px 4px 0;
  margin-bottom: 6px;
}
@media (min-width: 768px) {
  .vp-story-detail-hero .vp-story-detail-hero__lead {
    margin-bottom: var(--space-20);
    border-radius: 4px;
  }
}
.vp-story-detail-hero .vp-story-detail-hero__heading {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
}
.vp-story-detail-hero .vp-story-detail-hero__title {
  flex: 0 0 auto;
  padding: 6px var(--space-8);
  border-radius: 0 4px 4px 0;
  font-size: var(--font-size-heading-lv2);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-base-inverse);
  background: var(--color-parts-accent);
  box-shadow: 2px 2px 0px 0px var(--color-accent03);
}
@media (min-width: 768px) {
  .vp-story-detail-hero .vp-story-detail-hero__title {
    border-radius: 4px;
  }
}

ul.vp-story-detail-memories-list {
  position: relative;
  padding-top: calc(6 / 390 * 100vw);
  padding-bottom: calc(19 / 390 * 100vw);
  overflow: hidden;
}
@media (min-width: 768px) {
  ul.vp-story-detail-memories-list {
    padding-top: min(calc(6 / 1440 * 100vw), 6px);
    padding-bottom: min(calc(33 / 1440 * 100vw), 33px);
    width: min(calc(640 / 1440 * 100vw), 640px);
    margin: 0 auto;
    overflow: visible;
  }
}
ul.vp-story-detail-memories-list .vp-story-detail-memories-list__item {
  width: calc(156 / 390 * 100vw);
}
@media (min-width: 768px) {
  ul.vp-story-detail-memories-list .vp-story-detail-memories-list__item {
    width: min(calc(256 / 1440 * 100vw), 256px);
  }
}
ul.vp-story-detail-memories-list .vp-story-detail-memories-list__item:nth-child(2) {
  position: relative;
  z-index: 1;
  margin: 0 auto;
}
ul.vp-story-detail-memories-list .vp-story-detail-memories-list__item:nth-child(1), ul.vp-story-detail-memories-list .vp-story-detail-memories-list__item:nth-child(3) {
  position: absolute;
  top: calc(8 / 390 * 100vw);
}
@media (min-width: 768px) {
  ul.vp-story-detail-memories-list .vp-story-detail-memories-list__item:nth-child(1), ul.vp-story-detail-memories-list .vp-story-detail-memories-list__item:nth-child(3) {
    top: min(calc(8 / 1440 * 100vw), 8px);
  }
}
ul.vp-story-detail-memories-list .vp-story-detail-memories-list__item:nth-child(1) {
  z-index: 2;
  left: calc(-52 / 390 * 100vw);
  transform-origin: top right;
  transform: rotate(-8deg);
}
@media (min-width: 768px) {
  ul.vp-story-detail-memories-list .vp-story-detail-memories-list__item:nth-child(1) {
    left: max(calc(-85 / 1440 * 100vw), -85px);
  }
}
ul.vp-story-detail-memories-list .vp-story-detail-memories-list__item:nth-child(3) {
  right: calc(-52 / 390 * 100vw);
  transform-origin: top left;
  transform: rotate(8deg);
}
@media (min-width: 768px) {
  ul.vp-story-detail-memories-list .vp-story-detail-memories-list__item:nth-child(3) {
    right: max(calc(-85 / 1440 * 100vw), -85px);
  }
}
ul.vp-story-detail-memories-list .vp-story-detail-memories-list__image {
  border-radius: 2px;
  box-shadow: 2px 2px 14px 2px rgba(5, 64, 143, 0.1607843137);
}

.vp-story-detail-other-stories {
  padding-top: 106px;
  margin-top: -40px;
  background: url("../../images/vp/story/detail/other-stories-tds-bg-sp.jpg") no-repeat center top, var(--color-bg-base-inverse);
  background: linear-gradient(180deg, var(--color-gray05) 0%, rgba(16, 60, 83, 0) 25%, rgba(16, 60, 83, 0) 70%, var(--color-gray05) 100%), url("../../images/vp/story/detail/other-stories-tds-bg-sp.jpg") center top/cover no-repeat, var(--color-bg-base-inverse);
  background-size: 100%;
}
@media (min-width: 768px) {
  .vp-story-detail-other-stories {
    background: url("../../images/vp/story/detail/other-stories-tds-bg-pc.jpg") no-repeat center top, var(--color-bg-base-inverse);
    background: linear-gradient(180deg, var(--color-gray05) 0%, rgba(16, 60, 83, 0) 25%, rgba(16, 60, 83, 0) 70%, var(--color-gray05) 100%), url("../../images/vp/story/detail/other-stories-tds-bg-pc.jpg") no-repeat center top/cover, var(--color-bg-base-inverse);
    background-size: 100%;
  }
}
.vp-story-detail-other-stories .vp-story-detail-other-stories__heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  margin-bottom: 17.5px;
  color: var(--color-text-base-inverse);
}
@media (min-width: 768px) {
  .vp-story-detail-other-stories .vp-story-detail-other-stories__heading {
    margin-bottom: 3.5px;
  }
}
.vp-story-detail-other-stories .vp-story-detail-other-stories__heading-en {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-size: 16px;
  font-family: var(--font-family-en);
}
.vp-story-detail-other-stories .vp-story-detail-other-stories__heading-en::before {
  content: "";
  display: block;
  width: 26px;
  height: 12px;
  background-image: url("../../images/vp/common/icon-sparkle-02.svg");
  background-size: cover;
}
.vp-story-detail-other-stories .vp-story-detail-other-stories__heading-en::after {
  content: "";
  display: block;
  width: 26px;
  height: 12px;
  background-image: url("../../images/vp/common/icon-sparkle-02.svg");
  background-size: cover;
  transform: scale(-1, -1);
}
.vp-story-detail-other-stories .vp-story-detail-other-stories__heading-ja {
  font-size: var(--font-size-heading-lv2);
  font-weight: var(--font-weight-bold);
  text-shadow: 0px 2px 14px 0px rgba(0, 0, 0, 0.3490196078);
}
.vp-story-detail-other-stories .swiper.vp-story-detail-other-stories__list {
  width: 100%;
}
.vp-story-detail-other-stories .swiper-wrapper.vp-detail-other-stories__list-wrapper.vp-is-center {
  justify-content: center;
}
@media (min-width: 768px) {
  .vp-story-detail-other-stories .swiper-wrapper.vp-detail-other-stories__list-wrapper {
    gap: var(--space-16);
  }
}
.vp-story-detail-other-stories .vp-story-detail-other-stories__list-item {
  width: calc(300 / 390 * 100vw);
}
@media (min-width: 768px) {
  .vp-story-detail-other-stories .vp-story-detail-other-stories__list-item {
    flex: 0 0 min(calc(416 / 1280 * 100vw), 416px);
  }
}
.vp-story-detail-other-stories .vp-story-detail-other-stories__list-nav {
  position: absolute;
  z-index: 2;
  top: 50%;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  background-image: url("../../images/vp/common/icon-arrow-right-circle-navy.svg");
  color: transparent;
  font-size: 0;
}
.vp-story-detail-other-stories .vp-story-detail-other-stories__list-nav.vp-story-detail-other-stories__list-nav--prev {
  left: 8px;
  transform: translateY(-50%) scaleX(-1);
}
.vp-story-detail-other-stories .vp-story-detail-other-stories__list-nav.vp-story-detail-other-stories__list-nav--next {
  right: 8px;
}
.vp-story-detail-other-stories .vp-story-detail-other-stories__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-y-lv2);
  padding: var(--space-y-lv1) 0;
}

.vp-story-detail-outline .vp-story-detail-outline__heading {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: var(--space-4);
  margin-bottom: var(--space-16);
  color: var(--color-text-base-inverse);
  font-size: 16px;
  font-family: var(--font-family-en);
  font-weight: var(--font-weight-bold);
  letter-spacing: calc(24px * -1.1 / 100);
  max-width: 350px;
  box-sizing: border-box;
  border-radius: 50px;
  background: var(--color-gray05);
  padding: 8px;
  margin: 0 auto 16px;
}
@media (min-width: 768px) {
  .vp-story-detail-outline .vp-story-detail-outline__heading {
    max-width: 728px;
  }
}
.vp-story-detail-outline .vp-story-detail-outline__heading-sub {
  font-weight: 300;
  font-size: var(--font-size-caption);
}

/* ===========================================
  story detail outline list (shiori card)
  =========================================== */
.swiper.vp-story-detail-outline-list {
  position: relative;
  overflow: visible;
}
.swiper.vp-story-detail-outline-list .swiper-wrapper.vp-story-detail-outline-list__wrapper.vp-is-center {
  justify-content: center;
}

.swiper-slide.vp-story-detail-outline-list__slide {
  width: 310px;
  position: relative;
  height: auto;
}
@media (min-width: 768px) {
  .swiper-slide.vp-story-detail-outline-list__slide {
    max-width: 405px;
    width: auto;
    flex-grow: 1;
    margin-right: 32px;
  }
}
.swiper-slide.vp-story-detail-outline-list__slide::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: 16px;
  left: 28px;
  right: -16px;
  bottom: 0px;
  border-radius: 22px;
  background: var(--color-white);
  transform: rotate(-5deg);
  transform-origin: left bottom;
  pointer-events: none;
}
@media (min-width: 768px) {
  .swiper-slide.vp-story-detail-outline-list__slide::before {
    top: 22px;
    left: 28px;
    right: -16px;
    bottom: 0px;
  }
}
.swiper-slide.vp-story-detail-outline-list__slide {
  transition: opacity 0.3s ease;
}
@media (hover: hover) and (pointer: fine) {
  .swiper-slide.vp-story-detail-outline-list__slide:hover {
    opacity: 0.7;
  }
}

.swiper-wrapper.vp-story-detail-outline-list__wrapper .swiper-slide.vp-story-detail-outline-list__slide:last-child {
  margin-right: 0;
}

.vp-story-detail-outline-list__card {
  background: var(--color-white);
  border-radius: 22px;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.12);
  overflow: hidden;
  width: 100%;
  position: relative;
  z-index: 1;
}

/* header */
.vp-story-detail-outline-list__head {
  background-color: var(--color-graphic01);
  padding: 12px 20px;
  box-sizing: border-box;
  min-height: 97px;
}
@media (min-width: 768px) {
  .vp-story-detail-outline-list__head {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 115px;
  }
}

.vp-story-detail-outline-list__bookmark {
  display: flex;
  gap: 4px;
  font-size: 12px;
  font-weight: var(--font-weight-bold);
  color: var(--color-parts-accent);
  margin-bottom: 8px;
}

.vp-story-detail-outline-list__bookmark-icon {
  width: 16px;
  height: 17px;
  flex-shrink: 0;
}

.vp-story-detail-outline-list__title {
  font-size: 14px;
  font-weight: var(--font-weight-bold);
  color: var(--color-graphic04);
  text-align: left;
}
@media (min-width: 768px) {
  .vp-story-detail-outline-list__title {
    font-size: 20px;
  }
}

.vp-story-detail-outline-list__bookmark-text {
  text-align: left;
}

/* body */
.vp-story-detail-outline-list__body {
  padding: 16px 20px 20px;
}

/* ===========================================
カルーセル時は途中まで見せる（切る）
  =========================================== */
.vp-story-detail-outline-list__preview {
  position: relative;
  max-height: none;
  overflow: visible;
}

.vp-story-detail-outline-list__preview {
  max-height: 246px;
  overflow: hidden;
}
@media (min-width: 768px) {
  .vp-story-detail-outline-list__preview {
    max-height: 270px;
  }
}

.vp-story-detail-outline-list__all {
  max-height: none;
  overflow: visible;
}

.vp-story-detail-outline-list__preview::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 44px;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%);
}

/* day block separator（詳細で見た時も綺麗） */
.vp-story-detail-outline-list__day-block + .vp-story-detail-outline-list__day-block {
  margin-top: 20px;
  padding-top: 16px;
}

/* day row */
.vp-story-detail-outline-list__day-row {
  margin: 9px 0 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.vp-story-detail-outline-list__day {
  font-size: 20px;
  color: var(--color-parts-accent);
  font-family: var(--font-family-en);
  letter-spacing: -0.22px;
}
@media (min-width: 768px) {
  .vp-story-detail-outline-list__day {
    font-size: 28px;
  }
}

.vp-story-detail-outline-list__park-logo {
  width: 65px;
  height: 30px;
}

/* timeline */
.vp-story-detail-outline-list__timeline {
  position: relative;
  padding-left: 54px; /* periodをli内に出すのでスペース確保 */
}

.vp-story-detail-outline-list__list {
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
}
.vp-story-detail-outline-list__list::before {
  content: "";
  position: absolute;
  left: -12px;
  top: 16px;
  bottom: 8px;
  border-left: 2px dotted var(--color-gray02);
}
.vp-story-detail-outline-list__list::after {
  content: "";
  position: absolute;
  left: -11px;
  bottom: 0;
  transform: translateX(-50%);
  width: 7px;
  height: 6px;
  background: url("../../images/vp/common/icon-timeline-arrow.svg") no-repeat center/contain;
  pointer-events: none;
}

.vp-story-detail-outline-list__item {
  position: relative;
}

.vp-story-detail-outline-list__item + .vp-story-detail-outline-list__item {
  margin-top: 25px;
}

/* dot */
.vp-story-detail-outline-list__dot {
  position: absolute;
  box-sizing: border-box;
  left: -15px;
  top: 6px;
  width: 8px;
  height: 8px;
  border-radius: 20px;
  background: var(--color-white);
  border: 2px solid var(--color-gray02);
}

/* period（セクション先頭だけに出る） */
.vp-story-detail-outline-list__period {
  position: absolute;
  left: -46px;
  top: -4px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: var(--font-weight-bold);
  color: var(--color-text-sub);
}

.vp-story-detail-outline-list__period-icon {
  width: 26px;
  height: 26px;
}

.vp-story-detail-outline-list__period-text {
  writing-mode: vertical-rl;
  line-height: 1;
  font-family: var(--font-family-en);
  font-size: 12px;
  font-weight: 300;
}

/* item row (thumb + title block) */
.vp-story-detail-outline-list__row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.vp-story-detail-outline-list__thumb {
  width: 90px;
  height: 50px;
  border-radius: 8px;
  flex-shrink: 0;
  display: block;
}

.vp-story-detail-outline-list__title-row {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
}

.vp-story-detail-outline-list__icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  margin-top: 1px;
}

.vp-story-detail-outline-list__item-title {
  min-width: 0;
  font-size: 12px;
  font-weight: var(--font-weight-bold);
  line-height: 1.4;
  margin: 0;
  text-align: left;
}

/* note */
.vp-story-detail-outline-list__note {
  margin-top: 8px;
  padding: 4px 6px;
  border-radius: 8px;
  background: var(--color-graphic01);
  font-size: 12px;
  font-weight: 300;
  text-align: left;
}

/* CTA */
.vp-story-detail-outline-list__cta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 8px 8px 20px;
  border-radius: 999px;
  border: 2px solid var(--color-parts-accent);
  text-decoration: none;
  background-color: var(--color-white);
  max-width: 237px;
  box-sizing: border-box;
  margin: 14px auto 0;
  position: relative;
}
@media (min-width: 768px) {
  .vp-story-detail-outline-list__cta {
    margin: -20px auto 0;
    max-width: 261px;
  }
}

.vp-story-detail-outline-list__cta-text {
  font-size: 14px;
  font-weight: var(--font-weight-bold);
  color: var(--color-parts-accent);
}
@media (min-width: 768px) {
  .vp-story-detail-outline-list__cta-text {
    font-size: 16px;
  }
}

.vp-story-detail-outline-list__cta-icon {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  background: var(--color-parts-accent);
  display: grid;
  place-items: center;
  color: var(--color-white);
  background-image: url("../../images/vp/common/icon-arrow-diagonal.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
}

/* nav */
.vp-story-detail-outline-list__nav {
  position: absolute;
  z-index: 5;
  top: 50%;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  background-image: url("../../images/vp/common/icon-arrow-right-circle-navy.svg");
  background-size: contain;
  background-repeat: no-repeat;
  color: transparent;
  font-size: 0;
}

.vp-story-detail-outline-list__nav.vp-story-detail-outline-list__nav--prev {
  left: 8px;
  transform: translateY(-50%) scaleX(-1);
}

.vp-story-detail-outline-list__nav.vp-story-detail-outline-list__nav--next {
  right: 8px;
}

.vp-story-detail-story {
  position: relative;
  margin: 0 var(--space-x-side);
  margin-bottom: -24px;
  padding: 3px;
  border-radius: 40px;
  background: linear-gradient(180deg, rgba(121, 189, 228, 0.6) 0%, rgba(218, 241, 255, 0.1) 50%, rgba(218, 242, 255, 0.96) 99.52%) border-box;
  box-shadow: 0px 4px 24px 0px rgba(0, 167, 238, 0.2);
}
@media (min-width: 768px) {
  .vp-story-detail-story {
    width: min(calc(560 / 1280 * 100vw), 560px);
    margin: 0 auto;
    margin-bottom: -51px;
  }
}
.vp-story-detail-story::before {
  position: absolute;
  z-index: 2;
  top: -18px;
  left: -19px;
  content: "";
  display: block;
  width: 33px;
  height: 95px;
  background-image: url("../../images/vp/common/icon-sparkle-05.svg");
  background-size: cover;
}
.vp-story-detail-story .vp-story-detail-story__content {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: var(--space-32) calc(32 / 390 * 100vw) var(--space-64) calc(32 / 390 * 100vw);
  color: var(--color-text-logo);
  border-radius: 37px;
  background: linear-gradient(360deg, var(--color-grand) 0%, #e1f5ff 51.44%, #f2fbff 100%);
}
@media (min-width: 768px) {
  .vp-story-detail-story .vp-story-detail-story__content {
    padding: var(--space-32) min(calc(32 / 1280 * 100vw), 32px) var(--space-64) min(calc(32 / 1280 * 100vw), 32px);
  }
}
.vp-story-detail-story .vp-story-detail-story__image-wrap {
  position: relative;
  height: calc(190 / 390 * 100vw);
}
.vp-story-detail-story .vp-story-detail-story__image-wrap::after {
  content: "";
  display: block;
  position: absolute;
  bottom: calc(-3 / 390 * 100vw);
  left: calc(-10 / 390 * 100vw);
  width: calc(334 / 390 * 100vw);
  height: calc(54 / 390 * 100vw);
  background: url("../../images/vp/story/detail/image-shadow.png") no-repeat 0 0;
  background-size: cover;
  opacity: 0.35;
}
@media (min-width: 768px) {
  .vp-story-detail-story .vp-story-detail-story__image-wrap {
    padding: 0 min(calc(8 / 1280 * 100vw), 8px);
    height: min(calc(318 / 1280 * 100vw), 318px);
  }
  .vp-story-detail-story .vp-story-detail-story__image-wrap::after {
    width: min(calc(560 / 1280 * 100vw), 560px);
    height: min(calc(90 / 1280 * 100vw), 90px);
    bottom: max(calc(-6 / 1280 * 100vw), -6px);
    left: max(calc(-17 / 1280 * 100vw), -17px);
  }
}
.vp-story-detail-story .vp-story-detail-story__image {
  position: relative;
  z-index: 2;
  box-sizing: border-box;
  transform-origin: top left;
  transform: rotate(-3deg);
  margin-top: calc(-43 / 390 * 100vw);
  margin-left: calc(-21 / 390 * 100vw);
  width: calc(321 / 390 * 100vw);
  border-radius: 4px;
  border: 4px solid var(--color-line-base-inverse);
}
@media (min-width: 768px) {
  .vp-story-detail-story .vp-story-detail-story__image {
    margin-top: max(calc(-72 / 1280 * 100vw), -72px);
    margin-left: max(calc(-35 / 1280 * 100vw), -35px);
    width: min(calc(539 / 1280 * 100vw), 539px);
  }
}
.vp-story-detail-story .vp-story-detail-story__lead {
  font-size: var(--font-size-heading-lv2);
  font-weight: var(--font-weight-bold);
}
.vp-story-detail-story .vp-story-detail-story__body {
  font-size: var(--font-size-body);
  line-height: 1.7;
}
.vp-story-detail-story.vp-story-detail-story--inverse {
  background: linear-gradient(360deg, rgba(1, 13, 18, 0.6) 0%, rgba(94, 150, 182, 0.1) 50%, #00476a 99.52%) border-box;
  box-shadow: 0px 4px 24px 0px rgba(0, 11, 25, 0.2);
}
.vp-story-detail-story.vp-story-detail-story--inverse .vp-story-detail-story__content {
  background: linear-gradient(360deg, #103c53 0%, #235976 51.44%, #06293a 100%);
  color: var(--color-text-logo-inverse);
}

.vp-story-detail-theme {
  position: relative;
  padding: 3px;
  border-radius: 40px;
  background: linear-gradient(180deg, rgba(121, 189, 228, 0.6) 0%, rgba(218, 241, 255, 0.1) 50%, rgba(218, 242, 255, 0.96) 99.52%), border-box;
  box-shadow: 0px 4px 34px 0px rgba(0, 0, 0, 0.0588235294);
}
@media (min-width: 768px) {
  .vp-story-detail-theme {
    padding: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
  }
  .vp-story-detail-theme::before, .vp-story-detail-theme::after {
    content: "";
    z-index: 0;
    position: absolute;
    inset: 0;
    transition: opacity 0.5s ease;
  }
  .vp-story-detail-theme::before {
    background: linear-gradient(360deg, #f0faff 0%, #d3f0ff 25%, #e1f5ff 51.44%, #f2fbff 100%);
    opacity: 1;
  }
  .vp-story-detail-theme::after {
    background: linear-gradient(360deg, #103c53 0%, #235169 25%, #315263 51.44%, #103c53 100%);
    opacity: 0;
  }
  .vp-story-detail-theme:hover .vp-story-detail-theme__content {
    scrollbar-color: auto;
  }
}
.vp-story-detail-theme .vp-story-detail-theme__content {
  padding: calc(var(--space-20) - 3px) calc(var(--space-20) - 3px) calc(var(--space-32) - 3px) calc(var(--space-20) - 3px);
  border-radius: 37px;
  background: linear-gradient(360deg, #f0faff 0%, #d3f0ff 25%, #e1f5ff 51.44%, #f2fbff 100%);
}
@media (min-width: 768px) {
  .vp-story-detail-theme .vp-story-detail-theme__content {
    position: relative;
    z-index: 1;
    padding: 91.5px min(calc(48 / 1440 * 100vw), 48px) 191.5px min(calc(48 / 1440 * 100vw), 48px);
    border-radius: 0;
    background: none;
    max-height: 100svh;
    box-sizing: border-box;
    overflow-y: scroll;
    scrollbar-color: transparent transparent;
  }
}
@media (min-width: 1441px) {
  .vp-story-detail-theme .vp-story-detail-theme__content {
    padding-left: 91px;
    padding-right: 91px;
  }
}
.vp-story-detail-theme .vp-story-detail-theme__heading {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: var(--space-20);
  padding-bottom: var(--space-8);
  margin-bottom: var(--space-20);
}
.vp-story-detail-theme .vp-story-detail-theme__lead {
  position: relative;
  padding: var(--space-16);
  text-align: center;
  color: var(--color-text-logo);
  font-size: var(--font-size-heading-lv3);
  font-weight: var(--font-weight-bold);
  border-radius: var(--round-big);
  background: var(--color-bg-sub);
  box-shadow: 0px 2px 14px 0px rgba(16, 60, 83, 0.0784313725);
  transition: all 0.5s ease;
}
.vp-story-detail-theme .vp-story-detail-theme__lead::before, .vp-story-detail-theme .vp-story-detail-theme__lead::after {
  position: absolute;
  content: "";
  display: block;
  width: 11px;
  height: 8px;
  background-image: url("../../images/vp/common/icon-quotation-navy.svg");
  background-size: contain;
  background-repeat: no-repeat;
  flex: 0 0 8.93px;
}
.vp-story-detail-theme .vp-story-detail-theme__lead::before {
  top: -4px;
  left: 10px;
}
.vp-story-detail-theme .vp-story-detail-theme__lead::after {
  transform: scale(-1, -1);
  bottom: -4px;
  right: 10px;
}
.vp-story-detail-theme .vp-story-detail-theme__body {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: var(--space-20);
}
.vp-story-detail-theme .vp-story-detail-theme__text {
  font-size: var(--font-size-body);
  transition: all 0.5s ease;
}
.vp-story-detail-theme .vp-story-detail-theme__emphasis {
  font-weight: var(--font-weight-bold);
  font-size: var(--font-size-body);
  text-decoration: underline;
  text-decoration-style: dotted;
  text-decoration-color: var(--color-text-accent);
  text-underline-offset: 22.5%;
  text-decoration-thickness: 15.5%;
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
}
.vp-story-detail-theme .vp-story-detail-theme__wish-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-20);
}
.vp-story-detail-theme .vp-story-detail-theme__wish-row {
  display: flex;
  justify-content: center;
  gap: var(--space-20);
}
.vp-story-detail-theme .vp-story-detail-theme__wish-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-grow: 1;
}
@media (min-width: 768px) {
  .vp-story-detail-theme .vp-story-detail-theme__wish-item {
    flex-grow: 0;
    width: min(calc(180 / 1280 * 100vw), 180px);
  }
}
.vp-story-detail-theme .vp-story-detail-theme__wish-meta {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  width: calc(118 / 390 * 100vw);
  height: calc(94 / 390 * 100vw);
}
@media (min-width: 768px) {
  .vp-story-detail-theme .vp-story-detail-theme__wish-meta {
    width: min(calc(118 / 1280 * 100vw), 118px);
    height: min(calc(94 / 1280 * 100vw), 94px);
  }
}
.vp-story-detail-theme .vp-story-detail-theme__wish-image {
  width: calc(87 / 390 * 100vw);
  height: calc(87 / 390 * 100vw);
  border-radius: calc(87 / 390 * 100vw);
  border: 1px solid var(--color-line-soft);
}
@media (min-width: 768px) {
  .vp-story-detail-theme .vp-story-detail-theme__wish-image {
    width: min(calc(87 / 1280 * 100vw), 87px);
    height: min(calc(87 / 1280 * 100vw), 87px);
    border-radius: min(calc(87 / 1280 * 100vw), 87px);
  }
}
.vp-story-detail-theme .vp-story-detail-theme__wish-label-wrap {
  position: absolute;
  bottom: calc(62 / 390 * 100vw);
  left: calc(4 / 390 * 100vw);
  transform-origin: top left;
  transform: rotate(-25.55deg);
  line-height: 1;
}
@media (min-width: 768px) {
  .vp-story-detail-theme .vp-story-detail-theme__wish-label-wrap {
    bottom: min(calc(59 / 1280 * 100vw), 59px);
    left: min(calc(1 / 1280 * 100vw), 1px);
  }
}
.vp-story-detail-theme .vp-story-detail-theme__wish-label {
  position: relative;
  z-index: 2;
  color: var(--color-text-base-inverse);
  font-size: var(--font-size-body);
  font-family: var(--font-family-en);
  text-shadow: 1px 0 0 var(--color-line-gold), -1px 0 0 var(--color-line-gold), 0 1px 0 var(--color-line-gold), 0 -1px 0 var(--color-line-gold);
  letter-spacing: 0.01em;
  transition: all 0.5s ease;
}
.vp-story-detail-theme .vp-story-detail-theme__wish-label-shadow {
  position: absolute;
  top: 0.1px;
  left: 1px;
  color: var(--color-text-gold);
  font-size: var(--font-size-body);
  font-family: var(--font-family-en);
  text-shadow: 1px 0 0 var(--color-line-gold), -1px 0 0 var(--color-line-gold), 0 1px 0 var(--color-line-gold), 0 -1px 0 var(--color-line-gold);
  letter-spacing: 0.01em;
}
.vp-story-detail-theme .vp-story-detail-theme__wish-text {
  position: relative;
  top: -8px;
  margin-top: var(--space-16);
  padding: var(--space-8);
  border-radius: 8px;
  text-align: center;
  font-size: var(--font-size-caption);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-logo);
  background: var(--color-bg-sub);
  transition: all 0.5s ease;
}
.vp-story-detail-theme .vp-story-detail-theme__wish-text::before, .vp-story-detail-theme .vp-story-detail-theme__wish-text::after {
  display: block;
  position: absolute;
  top: -16px;
  left: 50%;
  transform: translateX(-50%);
  content: "";
  width: 14px;
  height: 16px;
  background-size: cover;
  transition: opacity 0.5s ease;
}
.vp-story-detail-theme .vp-story-detail-theme__wish-text::before {
  background: url("../../images/vp/story/detail/theme-wish-text-tail.svg");
  opacity: 1;
}
.vp-story-detail-theme .vp-story-detail-theme__wish-text::after {
  background: url("../../images/vp/story/detail/theme-wish-text-tail-navy.svg");
  opacity: 0;
}
.vp-story-detail-theme .vp-story-detail-theme__wish-item.vp-story-detail-theme__wish-item--single {
  width: calc(180 / 390 * 100vw);
  flex-grow: 0;
}
@media (min-width: 768px) {
  .vp-story-detail-theme .vp-story-detail-theme__wish-item.vp-story-detail-theme__wish-item--single {
    width: min(calc(180 / 1280 * 100vw), 180px);
  }
}
.vp-story-detail-theme .vp-story-detail-theme__wish-item.vp-story-detail-theme__wish-item--single .vp-story-detail-theme__wish-meta {
  width: calc(180 / 390 * 100vw);
  height: calc(94 / 390 * 100vw);
}
@media (min-width: 768px) {
  .vp-story-detail-theme .vp-story-detail-theme__wish-item.vp-story-detail-theme__wish-item--single .vp-story-detail-theme__wish-meta {
    width: min(calc(180 / 1280 * 100vw), 180px);
    height: min(calc(94 / 1280 * 100vw), 94px);
  }
}
.vp-story-detail-theme .vp-story-detail-theme__wish-item.vp-story-detail-theme__wish-item--single .vp-story-detail-theme__wish-label-wrap {
  left: calc(35 / 390 * 100vw);
}
@media (min-width: 768px) {
  .vp-story-detail-theme .vp-story-detail-theme__wish-item.vp-story-detail-theme__wish-item--single .vp-story-detail-theme__wish-label-wrap {
    left: min(calc(35 / 1280 * 100vw), 35px);
  }
}
.vp-story-detail-theme .vp-story-detail-theme__wish-item.vp-story-detail-theme__wish-item--double-image .vp-story-detail-theme__wish-label-wrap {
  z-index: 2;
  transform-origin: bottom right;
  transform: rotate(24.3deg);
  left: auto;
  right: calc(6 / 390 * 100vw);
  bottom: calc(45 / 390 * 100vw);
}
@media (min-width: 768px) {
  .vp-story-detail-theme .vp-story-detail-theme__wish-item.vp-story-detail-theme__wish-item--double-image .vp-story-detail-theme__wish-label-wrap {
    right: min(calc(6 / 1280 * 100vw), 6px);
    bottom: min(calc(45 / 1280 * 100vw), 45px);
  }
}
.vp-story-detail-theme .vp-story-detail-theme__wish-item.vp-story-detail-theme__wish-item--double-image .vp-story-detail-theme__wish-image {
  position: absolute;
  width: calc(76 / 390 * 100vw);
  height: calc(76 / 390 * 100vw);
  border-radius: calc(76 / 390 * 100vw);
}
.vp-story-detail-theme .vp-story-detail-theme__wish-item.vp-story-detail-theme__wish-item--double-image .vp-story-detail-theme__wish-image:nth-child(2) {
  top: 0;
  left: calc(24 / 390 * 100vw);
}
.vp-story-detail-theme .vp-story-detail-theme__wish-item.vp-story-detail-theme__wish-item--double-image .vp-story-detail-theme__wish-image:nth-child(3) {
  top: calc(18 / 390 * 100vw);
  left: calc(80 / 390 * 100vw);
}
@media (min-width: 768px) {
  .vp-story-detail-theme .vp-story-detail-theme__wish-item.vp-story-detail-theme__wish-item--double-image .vp-story-detail-theme__wish-image {
    width: min(calc(76 / 1280 * 100vw), 76px);
    height: min(calc(76 / 1280 * 100vw), 76px);
    border-radius: min(calc(76 / 1280 * 100vw), 76px);
  }
  .vp-story-detail-theme .vp-story-detail-theme__wish-item.vp-story-detail-theme__wish-item--double-image .vp-story-detail-theme__wish-image:nth-child(2) {
    top: 0;
    left: min(calc(24 / 1280 * 100vw), 24px);
  }
  .vp-story-detail-theme .vp-story-detail-theme__wish-item.vp-story-detail-theme__wish-item--double-image .vp-story-detail-theme__wish-image:nth-child(3) {
    top: min(calc(18 / 1280 * 100vw), 18px);
    left: min(calc(80 / 1280 * 100vw), 80px);
  }
}
.vp-story-detail-theme .vp-story-detail-theme__plan-cta {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-top: 2px dotted var(--color-line-base-inverse);
  padding-top: var(--space-20);
}
.vp-story-detail-theme .vp-story-detail-theme__plan-lead {
  margin-bottom: var(--space-8);
  font-size: var(--font-size-caption);
  color: var(--color-text-logo);
  text-align: center;
}
.vp-story-detail-theme .vp-story-detail-theme__plan-title {
  display: inline-block;
  color: var(--color-text-logo);
  font-size: 14px;
  font-weight: var(--font-weight-bold);
  background: linear-gradient(to top, #ffffff 9px, transparent 9px);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.vp-story-detail-theme .vp-story-detail-theme__plan-title + .vp-story-detail-theme__plan-title {
  margin-top: var(--space-8);
}
.vp-story-detail-theme .vp-story-detail-theme__plan-link {
  margin-top: var(--space-20);
  font-size: var(--font-size-caption);
  color: var(--color-text-sub);
  text-decoration: underline;
}
@media (min-width: 768px) {
  .vp-story-detail-theme.vp-story-detail-theme--night::before {
    opacity: 0;
  }
  .vp-story-detail-theme.vp-story-detail-theme--night::after {
    opacity: 1;
  }
}
@media (min-width: 768px) {
  .vp-story-detail-theme.vp-story-detail-theme--night .vp-story-detail-theme__content {
    min-height: 100svh;
  }
}
.vp-story-detail-theme.vp-story-detail-theme--night .vp-story-detail-theme__lead {
  color: var(--color-text-logo-inverse);
  background: var(--color-bg-sub-inverse);
}
.vp-story-detail-theme.vp-story-detail-theme--night .vp-story-detail-theme__lead::before, .vp-story-detail-theme.vp-story-detail-theme--night .vp-story-detail-theme__lead::after {
  background-image: url("../../images/vp/common/icon-quotation-white.svg");
}
.vp-story-detail-theme.vp-story-detail-theme--night .vp-story-detail-theme__text {
  color: var(--color-text-base-inverse);
}
.vp-story-detail-theme.vp-story-detail-theme--night .vp-story-detail-theme__wish-text {
  color: var(--color-text-logo-inverse);
  background: var(--color-bg-sub-inverse);
}
.vp-story-detail-theme.vp-story-detail-theme--night .vp-story-detail-theme__wish-text::before {
  opacity: 0;
}
.vp-story-detail-theme.vp-story-detail-theme--night .vp-story-detail-theme__wish-text::after {
  opacity: 1;
}
.vp-story-detail-theme.vp-story-detail-theme--night .vp-story-detail-theme__wish-label {
  color: var(--color-text-base);
}
.vp-story-detail-theme.vp-story-detail-theme--night .vp-story-detail-theme__plan-cta {
  border-top: 2px dotted var(--color-line-inverse-inverse);
}
.vp-story-detail-theme.vp-story-detail-theme--night .vp-story-detail-theme__plan-lead {
  color: var(--color-text-logo-inverse);
}
.vp-story-detail-theme.vp-story-detail-theme--night .vp-story-detail-theme__plan-title {
  color: var(--color-text-logo-inverse);
  background: linear-gradient(to top, var(--color-line-inverse-inverse) 9px, transparent 9px);
}
.vp-story-detail-theme.vp-story-detail-theme--night .vp-story-detail-theme__plan-link {
  color: var(--color-text-sub-inverse);
}

.vp-story-detail-parts-4.vp-story-detail-parts-4--inverse .vp-story-detail-parts-4__label, .vp-story-detail-parts-2.vp-story-detail-parts-2--inverse .vp-story-detail-parts-2__label, .vp-story-detail-parts-1.vp-story-detail-parts-1--inverse .vp-story-detail-parts-1__label, .vp-story-detail-parts-4 .vp-story-detail-parts-4__label, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label, .vp-story-detail-parts-1 .vp-story-detail-parts-1__label, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label.vp-story-detail-parts-2__label--two-line {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  font-size: var(--font-size-story-speech-bubble);
  font-weight: var(--font-weight-bold);
}
.vp-story-detail-parts-4.vp-story-detail-parts-4--inverse .vp-story-detail-parts-4__label::before, .vp-story-detail-parts-2.vp-story-detail-parts-2--inverse .vp-story-detail-parts-2__label::before, .vp-story-detail-parts-1.vp-story-detail-parts-1--inverse .vp-story-detail-parts-1__label::before, .vp-story-detail-parts-4 .vp-story-detail-parts-4__label::before, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label::before, .vp-story-detail-parts-1 .vp-story-detail-parts-1__label::before, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label.vp-story-detail-parts-2__label--two-line::before, .vp-story-detail-parts-4.vp-story-detail-parts-4--inverse .vp-story-detail-parts-4__label::after, .vp-story-detail-parts-2.vp-story-detail-parts-2--inverse .vp-story-detail-parts-2__label::after, .vp-story-detail-parts-1.vp-story-detail-parts-1--inverse .vp-story-detail-parts-1__label::after, .vp-story-detail-parts-4 .vp-story-detail-parts-4__label::after, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label::after, .vp-story-detail-parts-1 .vp-story-detail-parts-1__label::after, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label.vp-story-detail-parts-2__label--two-line::after {
  content: "";
  display: block;
  width: 6.8px;
  height: 24px;
  background-size: cover;
}
.vp-story-detail-parts-4.vp-story-detail-parts-4--inverse .vp-story-detail-parts-4__label::after, .vp-story-detail-parts-2.vp-story-detail-parts-2--inverse .vp-story-detail-parts-2__label::after, .vp-story-detail-parts-1.vp-story-detail-parts-1--inverse .vp-story-detail-parts-1__label::after, .vp-story-detail-parts-4 .vp-story-detail-parts-4__label::after, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label::after, .vp-story-detail-parts-1 .vp-story-detail-parts-1__label::after, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label.vp-story-detail-parts-2__label--two-line::after {
  transform: scale(-1, 1);
}
@media (min-width: 768px) {
  .vp-story-detail-parts-4.vp-story-detail-parts-4--inverse .vp-story-detail-parts-4__label::before, .vp-story-detail-parts-2.vp-story-detail-parts-2--inverse .vp-story-detail-parts-2__label::before, .vp-story-detail-parts-1.vp-story-detail-parts-1--inverse .vp-story-detail-parts-1__label::before, .vp-story-detail-parts-4 .vp-story-detail-parts-4__label::before, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label::before, .vp-story-detail-parts-1 .vp-story-detail-parts-1__label::before, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label.vp-story-detail-parts-2__label--two-line::before, .vp-story-detail-parts-4.vp-story-detail-parts-4--inverse .vp-story-detail-parts-4__label::after, .vp-story-detail-parts-2.vp-story-detail-parts-2--inverse .vp-story-detail-parts-2__label::after, .vp-story-detail-parts-1.vp-story-detail-parts-1--inverse .vp-story-detail-parts-1__label::after, .vp-story-detail-parts-4 .vp-story-detail-parts-4__label::after, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label::after, .vp-story-detail-parts-1 .vp-story-detail-parts-1__label::after, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label.vp-story-detail-parts-2__label--two-line::after {
    content: "";
    width: 11px;
    height: 39px;
  }
}

.vp-story-detail-parts-2 .vp-story-detail-parts-2__label.vp-story-detail-parts-2__label--two-line::before, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label.vp-story-detail-parts-2__label--two-line::after {
  width: 12.8px;
  height: 45px;
}
@media (min-width: 768px) {
  .vp-story-detail-parts-2 .vp-story-detail-parts-2__label.vp-story-detail-parts-2__label--two-line::before, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label.vp-story-detail-parts-2__label--two-line::after {
    content: "";
    width: 21.3px;
    height: 75px;
  }
}

.vp-story-detail-parts-4 .vp-story-detail-parts-4__label, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label, .vp-story-detail-parts-1 .vp-story-detail-parts-1__label {
  color: var(--color-text-logo);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__label::before, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label::before, .vp-story-detail-parts-1 .vp-story-detail-parts-1__label::before, .vp-story-detail-parts-4 .vp-story-detail-parts-4__label::after, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label::after, .vp-story-detail-parts-1 .vp-story-detail-parts-1__label::after {
  background-image: url("../../images/vp/common/icon-speech-bubble.svg");
}

.vp-story-detail-parts-2 .vp-story-detail-parts-2__label.vp-story-detail-parts-2__label--two-line {
  color: var(--color-text-logo);
}
.vp-story-detail-parts-2 .vp-story-detail-parts-2__label.vp-story-detail-parts-2__label--two-line::before, .vp-story-detail-parts-2 .vp-story-detail-parts-2__label.vp-story-detail-parts-2__label--two-line::after {
  background-image: url("../../images/vp/common/icon-speech-bubble.svg");
}

.vp-story-detail-parts-4.vp-story-detail-parts-4--inverse .vp-story-detail-parts-4__label, .vp-story-detail-parts-2.vp-story-detail-parts-2--inverse .vp-story-detail-parts-2__label, .vp-story-detail-parts-1.vp-story-detail-parts-1--inverse .vp-story-detail-parts-1__label {
  color: var(--color-text-logo-inverse);
}
.vp-story-detail-parts-4.vp-story-detail-parts-4--inverse .vp-story-detail-parts-4__label::before, .vp-story-detail-parts-2.vp-story-detail-parts-2--inverse .vp-story-detail-parts-2__label::before, .vp-story-detail-parts-1.vp-story-detail-parts-1--inverse .vp-story-detail-parts-1__label::before, .vp-story-detail-parts-4.vp-story-detail-parts-4--inverse .vp-story-detail-parts-4__label::after, .vp-story-detail-parts-2.vp-story-detail-parts-2--inverse .vp-story-detail-parts-2__label::after, .vp-story-detail-parts-1.vp-story-detail-parts-1--inverse .vp-story-detail-parts-1__label::after {
  background-image: url("../../images/vp/common/icon-speech-bubble-inverse.svg");
}

.vp-story-detail-parts-1 {
  padding: 4px 0 16px 0;
}
.vp-story-detail-parts-1 .vp-story-detail-parts-1__media {
  position: relative;
}
.vp-story-detail-parts-1 .vp-story-detail-parts-1__label {
  position: absolute;
  bottom: calc(190 / 390 * 100vw);
  right: calc(16 / 390 * 100vw);
  transform-origin: bottom right;
  transform: rotate(8.78deg);
}
.vp-story-detail-parts-1 .vp-story-detail-parts-1__image-1 {
  position: relative;
  z-index: 1;
  margin-left: calc(17 / 390 * 100vw);
  width: calc(146 / 390 * 100vw);
  border-radius: calc(146 / 390 * 100vw);
  box-shadow: 2px 2px 14px 2px rgba(5, 64, 143, 0.1607843137);
}
.vp-story-detail-parts-1 .vp-story-detail-parts-1__image-2 {
  display: block;
  margin-left: auto;
  margin-top: calc(-62 / 390 * 100vw);
  width: calc(257 / 390 * 100vw);
  border-radius: 2px;
}
.vp-story-detail-parts-1 .vp-story-detail-parts-1__point {
  margin: 0 auto;
  margin-top: calc(-32 / 390 * 100vw);
  width: calc(326 / 390 * 100vw);
}
.vp-story-detail-parts-1 .vp-story-detail-parts-1__text {
  padding: min(calc(24 / 390 * 100vw), 24px) min(calc(64 / 390 * 100vw), 64px) min(calc(16 / 390 * 100vw), 16px) min(calc(32 / 390 * 100vw), 32px);
  font-size: var(--font-size-body);
}
.vp-story-detail-parts-1.vp-story-detail-parts-1--inverse .vp-story-detail-parts-1__label,
.vp-story-detail-parts-1.vp-story-detail-parts-1--inverse .vp-story-detail-parts-1__text {
  color: var(--color-text-base-inverse);
}
.vp-story-detail-parts-1:has(.vp-story-detail-parts-1__text) .vp-story-detail-parts-1__point {
  margin-top: 0;
}
@media (min-width: 768px) {
  .vp-story-detail-parts-1 {
    padding: 9px 0 16px 0;
    margin: 0 min(calc(48 / 1440 * 100vw), 48px);
  }
  .vp-story-detail-parts-1 .vp-story-detail-parts-1__label {
    bottom: min(calc(390 / 1440 * 100vw), 390px);
    right: min(calc(18 / 1440 * 100vw), 18px);
  }
  .vp-story-detail-parts-1 .vp-story-detail-parts-1__image-1 {
    margin-left: min(calc(36 / 1440 * 100vw), 36px);
    width: min(calc(300 / 1440 * 100vw), 300px);
    border-radius: min(calc(300 / 1440 * 100vw), 300px);
  }
  .vp-story-detail-parts-1 .vp-story-detail-parts-1__image-2 {
    margin-top: max(calc(-128 / 1440 * 100vw), -128px);
    width: min(calc(527 / 1440 * 100vw), 527px);
  }
  .vp-story-detail-parts-1 .vp-story-detail-parts-1__point {
    margin-left: min(calc(64 / 1440 * 100vw), 64px);
    margin-top: max(calc(-32 / 1440 * 100vw), -32px);
    width: min(calc(500 / 1440 * 100vw), 500px);
  }
  .vp-story-detail-parts-1 .vp-story-detail-parts-1__text {
    padding: min(calc(24 / 1440 * 100vw), 24px) min(calc(64 / 1440 * 100vw), 64px) min(calc(32 / 1440 * 100vw), 32px);
    width: min(calc(560 / 1440 * 100vw), 560px);
    box-sizing: border-box;
  }
}
@media (min-width: 1441px) {
  .vp-story-detail-parts-1 {
    width: 800px;
    margin: 0 auto;
  }
}

.vp-story-detail-parts-2 {
  position: relative;
  padding-top: calc(6.5 / 390 * 100vw);
}
.vp-story-detail-parts-2 .vp-story-detail-parts-2__label {
  position: absolute;
  z-index: 2;
  bottom: calc(368 / 390 * 100vw);
  right: calc(27.5 / 390 * 100vw);
  transform-origin: bottom right;
  transform: rotate(8.78deg);
  text-align: center;
}
.vp-story-detail-parts-2 .vp-story-detail-parts-2__label.vp-story-detail-parts-2__label--two-line {
  bottom: calc(350 / 390 * 100vw);
  right: calc(31 / 390 * 100vw);
}
.vp-story-detail-parts-2 .vp-story-detail-parts-2__image-1 {
  transform: rotate(-3deg);
  width: calc(245 / 390 * 100vw);
  border-radius: 2px;
  box-shadow: 2px 2px 14px 2px rgba(5, 64, 143, 0.1607843137);
}
.vp-story-detail-parts-2 .vp-story-detail-parts-2__image-2 {
  margin-left: auto;
  width: calc(200 / 390 * 100vw);
  flex: 0 0 calc(200 / 390 * 100vw);
  border-radius: 2px;
}
.vp-story-detail-parts-2 .vp-story-detail-parts-2__text {
  margin-top: calc(141.5 / 390 * 100vw);
  margin-left: calc(16 / 390 * 100vw);
  font-size: var(--font-size-body);
}
.vp-story-detail-parts-2 .vp-story-detail-parts-2__bottom {
  display: flex;
  gap: 10px;
  margin-top: calc(-115 / 390 * 100vw);
}
.vp-story-detail-parts-2.vp-story-detail-parts-2--inverse .vp-story-detail-parts-2__text {
  color: var(--color-text-base-inverse);
}
@media (min-width: 768px) {
  .vp-story-detail-parts-2 {
    margin: 0 min(calc(48 / 1440 * 100vw), 48px);
    padding-top: min(calc(13 / 1440 * 100vw), 13px);
  }
  .vp-story-detail-parts-2 .vp-story-detail-parts-2__image-1 {
    width: min(calc(450 / 1440 * 100vw), 450px);
  }
  .vp-story-detail-parts-2 .vp-story-detail-parts-2__image-2 {
    width: min(calc(366 / 1440 * 100vw), 366px);
    flex: 0 0 min(calc(366 / 1440 * 100vw), 366px);
    margin-right: min(calc(20 / 1440 * 100vw), 20px);
  }
  .vp-story-detail-parts-2 .vp-story-detail-parts-2__bottom {
    margin-top: max(calc(-200 / 1440 * 100vw), -200px);
  }
  .vp-story-detail-parts-2 .vp-story-detail-parts-2__label {
    bottom: min(calc(680 / 1440 * 100vw), 680px);
    right: min(calc(43 / 1440 * 100vw), 43px);
  }
  .vp-story-detail-parts-2 .vp-story-detail-parts-2__label.vp-story-detail-parts-2__label--two-line {
    right: min(calc(49 / 1440 * 100vw), 49px);
    bottom: min(calc(646 / 1440 * 100vw), 646px);
  }
  .vp-story-detail-parts-2 .vp-story-detail-parts-2__text {
    margin-top: min(calc(253 / 1440 * 100vw), 253px);
    margin-left: min(calc(66 / 1440 * 100vw), 66px);
    width: min(calc(320 / 1440 * 100vw), 320px);
  }
}
@media (min-width: 1441px) {
  .vp-story-detail-parts-2 {
    width: 800px;
    margin: 0 auto;
  }
}

.vp-story-detail-parts-3 {
  position: relative;
  padding: calc(10 / 390 * 100vw) 0;
}
.vp-story-detail-parts-3 .vp-story-detail-parts-3__image-wrap {
  position: relative;
}
.vp-story-detail-parts-3 .vp-story-detail-parts-3__image-wrap::after {
  content: "";
  display: block;
  position: absolute;
  top: calc(172 / 390 * 100vw);
  left: calc(23 / 390 * 100vw);
  width: calc(334 / 390 * 100vw);
  height: calc(54 / 390 * 100vw);
  background: url("../../images/vp/story/detail/image-shadow.png") no-repeat 0 0;
  background-size: cover;
  opacity: 0.35;
  transform-origin: bottom left;
  transform: rotate(6.65deg);
}
.vp-story-detail-parts-3 .vp-story-detail-parts-3__image {
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  margin-left: calc(34 / 390 * 100vw);
  width: calc(320 / 390 * 100vw);
  border-radius: 4px;
  border: 4px solid var(--color-line-base-inverse);
  transform: rotate(3.6deg);
}
@media (min-width: 768px) {
  .vp-story-detail-parts-3 {
    padding: min(calc(21 / 1440 * 100vw), 21px) 0;
    margin: 0 min(calc(48 / 1440 * 100vw), 48px);
  }
  .vp-story-detail-parts-3 .vp-story-detail-parts-3__image-wrap::after {
    width: min(calc(683 / 1440 * 100vw), 683px);
    height: min(calc(110 / 1440 * 100vw), 110px);
    top: min(calc(349 / 1440 * 100vw), 349px);
    left: min(calc(51 / 1440 * 100vw), 51px);
  }
  .vp-story-detail-parts-3 .vp-story-detail-parts-3__image {
    margin-left: min(calc(72 / 1440 * 100vw), 72px);
    width: min(calc(658 / 1440 * 100vw), 658px);
  }
}
@media (min-width: 1441px) {
  .vp-story-detail-parts-3 {
    width: 800px;
    margin: 0 auto;
  }
}

.vp-story-detail-parts-4 {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--space-20);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__image {
  border-radius: 2px;
  box-shadow: 2px 2px 14px 2px rgba(5, 64, 143, 0.1607843137);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__label-wrap {
  position: absolute;
  z-index: 2;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(40 / 390 * 100vw);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__list {
  display: flex;
  margin: 0 calc(3 / 390 * 100vw);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__item {
  position: relative;
  flex: 0 0 calc(144.6 / 390 * 100vw);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__item:nth-child(1) {
  padding-top: calc(10 / 390 * 100vw);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__item:nth-child(1) .vp-story-detail-parts-4__image {
  transform-origin: top left;
  transform: rotate(-4deg);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__item:nth-child(2) {
  margin-left: calc(-25 / 390 * 100vw);
  padding-top: calc(42.5 / 390 * 100vw);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__item:nth-child(2) .vp-story-detail-parts-4__label-wrap {
  left: calc(17 / 390 * 100vw);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__item:nth-child(2) .vp-story-detail-parts-4__label {
  transform: rotate(-8.69deg);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__item:nth-child(2) .vp-story-detail-parts-4__image {
  transform: rotate(4deg);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__item:nth-child(3) {
  margin-left: calc(-30 / 390 * 100vw);
  padding-top: calc(70.5 / 390 * 100vw);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__item:nth-child(3) .vp-story-detail-parts-4__label-wrap {
  top: calc(20 / 390 * 100vw);
  right: calc(12 / 390 * 100vw);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__item:nth-child(3) .vp-story-detail-parts-4__label {
  transform: rotate(8.78deg);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__item:nth-child(3) .vp-story-detail-parts-4__image {
  transform: rotate(-4deg);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__body {
  margin: 0 var(--space-64) 0 var(--space-x-side);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__text {
  font-size: var(--font-size-body);
}
.vp-story-detail-parts-4 .vp-story-detail-parts-4__note {
  color: var(--color-text-sub);
  font-size: var(--font-size-caption);
}
.vp-story-detail-parts-4.vp-story-detail-parts-4--inverse .vp-story-detail-parts-4__text {
  color: var(--color-text-base-inverse);
}
@media (min-width: 768px) {
  .vp-story-detail-parts-4 {
    margin: 0 min(calc(48 / 1440 * 100vw), 48px);
  }
  .vp-story-detail-parts-4 .vp-story-detail-parts-4__label-wrap {
    width: min(calc(240 / 1440 * 100vw), 240px);
    height: min(calc(75 / 1440 * 100vw), 75px);
  }
  .vp-story-detail-parts-4 .vp-story-detail-parts-4__list {
    margin: 0;
  }
  .vp-story-detail-parts-4 .vp-story-detail-parts-4__item {
    flex: 0 0 min(calc(281 / 1440 * 100vw), 281px);
  }
  .vp-story-detail-parts-4 .vp-story-detail-parts-4__item:nth-child(1) {
    padding-top: min(calc(24 / 1440 * 100vw), 24px);
  }
  .vp-story-detail-parts-4 .vp-story-detail-parts-4__item:nth-child(2) {
    margin-left: max(calc(-19 / 1440 * 100vw), -19px);
    padding-top: max(calc(45 / 1440 * 100vw), 45px);
  }
  .vp-story-detail-parts-4 .vp-story-detail-parts-4__item:nth-child(2) .vp-story-detail-parts-4__label-wrap {
    left: min(calc(35 / 1440 * 100vw), 35px);
  }
  .vp-story-detail-parts-4 .vp-story-detail-parts-4__item:nth-child(3) {
    margin-left: max(calc(-30 / 1440 * 100vw), -30px);
    padding-top: max(calc(77 / 1440 * 100vw), 77px);
  }
  .vp-story-detail-parts-4 .vp-story-detail-parts-4__item:nth-child(3) .vp-story-detail-parts-4__label-wrap {
    top: max(calc(10 / 1440 * 100vw), 10px);
    right: min(calc(20 / 1440 * 100vw), 20px);
  }
  .vp-story-detail-parts-4 .vp-story-detail-parts-4__body {
    padding-top: max(calc(10 / 1440 * 100vw), 10px);
    margin: 0 auto;
    width: min(calc(560 / 1440 * 100vw), 560px);
  }
}
@media (min-width: 1441px) {
  .vp-story-detail-parts-4 {
    width: 800px;
    margin: 0 auto;
  }
}

.vp-story-detail-parts-5 {
  position: relative;
  padding-bottom: var(--space-16);
}
.vp-story-detail-parts-5 .vp-story-detail-parts-5__image {
  display: block;
  margin-left: auto;
  width: calc(322 / 390 * 100vw);
  border-radius: 2px;
}
.vp-story-detail-parts-5 .vp-story-detail-parts-5__body {
  width: calc(310 / 390 * 100vw);
  margin-top: calc(-35 / 390 * 100vw);
  margin-left: calc(32 / 390 * 100vw);
}
.vp-story-detail-parts-5 .vp-story-detail-parts-5__note {
  padding: 10px var(--space-20) 0 var(--space-20);
  color: var(--color-text-sub);
  font-size: var(--font-size-caption);
}
.vp-story-detail-parts-5 .vp-story-detail-parts-5__text {
  padding-top: calc(50 / 390 * 100vw);
  font-size: var(--font-size-body);
}
.vp-story-detail-parts-5:has(.vp-story-detail-parts-5__text) .vp-story-detail-parts-5__note {
  padding-left: 0;
  padding-right: 0;
}
.vp-story-detail-parts-5.vp-story-detail-parts-5--inverse .vp-story-detail-parts-5__note {
  color: var(--color-text-base-inverse);
}
.vp-story-detail-parts-5.vp-story-detail-parts-5--inverse .vp-story-detail-parts-5__text {
  color: var(--color-text-base-inverse);
}
@media (min-width: 768px) {
  .vp-story-detail-parts-5 {
    margin: 0 min(calc(48 / 1440 * 100vw), 48px);
  }
  .vp-story-detail-parts-5 .vp-story-detail-parts-5__image {
    width: min(calc(661 / 1440 * 100vw), 661px);
  }
  .vp-story-detail-parts-5 .vp-story-detail-parts-5__body {
    width: min(calc(500 / 1440 * 100vw), 500px);
    margin-top: max(calc(-34 / 1440 * 100vw), -34px);
    margin-left: min(calc(64 / 1440 * 100vw), 64px);
  }
  .vp-story-detail-parts-5 .vp-story-detail-parts-5__text {
    padding-top: min(calc(50 / 1440 * 100vw), 50px);
  }
  .vp-story-detail-parts-5:has(.vp-story-detail-parts-5__text) .vp-story-detail-parts-5__body {
    width: min(calc(688 / 1440 * 100vw), 688px);
  }
  .vp-story-detail-parts-5:has(.vp-story-detail-parts-5__text) .vp-story-detail-parts-5__note {
    padding-top: 0;
  }
}
@media (min-width: 1441px) {
  .vp-story-detail-parts-5 {
    width: 800px;
    margin: 0 auto;
  }
}

.vp-story-detail-parts-6 {
  position: relative;
}
.vp-story-detail-parts-6 .vp-story-detail-parts-6__image-1 {
  width: 100%;
  border-radius: 2px;
}
.vp-story-detail-parts-6 .vp-story-detail-parts-6__image-2 {
  width: calc(155 / 390 * 100vw);
  border-radius: 2px;
}
.vp-story-detail-parts-6 .vp-story-detail-parts-6__bottom {
  display: flex;
  gap: var(--space-16);
  margin: calc(-29 / 390 * 100vw) var(--space-x-story-section) 0 var(--space-x-story-section);
}
.vp-story-detail-parts-6 .vp-story-detail-parts-6__text {
  margin-top: calc(48 / 390 * 100vw);
  font-size: var(--font-size-body);
}
.vp-story-detail-parts-6.vp-story-detail-parts-6--inverse .vp-story-detail-parts-6__text {
  color: var(--color-text-base-inverse);
}
@media (min-width: 768px) {
  .vp-story-detail-parts-6 {
    margin: 0 min(calc(48 / 1440 * 100vw), 48px);
  }
  .vp-story-detail-parts-6 .vp-story-detail-parts-6__bottom {
    margin-top: calc(-30 / 1440 * 100vw);
  }
  .vp-story-detail-parts-6 .vp-story-detail-parts-6__text {
    margin-top: calc(48 / 1440 * 100vw);
  }
  .vp-story-detail-parts-6 .vp-story-detail-parts-6__image-2 {
    width: min(calc(328 / 1440 * 100vw), 328px);
  }
}
@media (min-width: 1441px) {
  .vp-story-detail-parts-6 {
    width: 800px;
    margin: 0 auto;
  }
}

.vp-story-detail-parts-7 {
  margin-left: auto;
  padding: 0 var(--space-x-story-section) var(--space-16) var(--space-x-story-section);
}
.vp-story-detail-parts-7 .vp-story-detail-parts-7__note {
  padding: 10px var(--space-20) 0 var(--space-20);
  color: var(--color-text-sub);
  font-size: var(--font-size-caption);
}
.vp-story-detail-parts-7.vp-story-detail-parts-7--inverse .vp-story-detail-parts-7__note {
  color: var(--color-text-sub-inverse);
}
@media (min-width: 768px) {
  .vp-story-detail-parts-7 {
    width: min(calc(500 / 1440 * 100vw), 500px);
    padding: 0 min(calc(64 / 1440 * 100vw), 64px) 0 min(calc(236 / 1440 * 100vw), 236px);
  }
}
@media (min-width: 1441px) {
  .vp-story-detail-parts-7 {
    width: 800px;
    margin: 0 auto;
    box-sizing: border-box;
  }
}

.vp-story-detail-parts-8 .vp-story-detail-parts-8__image {
  position: relative;
  border-radius: 2px;
  box-shadow: 2px 2px 14px 2px rgba(5, 64, 143, 0.1607843137);
}
.vp-story-detail-parts-8 .vp-story-detail-parts-8__text {
  margin: var(--space-20) var(--space-32) 0 var(--space-32);
  font-size: var(--font-size-body);
}
.vp-story-detail-parts-8.vp-story-detail-parts-8--inverse .vp-story-detail-parts-8__text {
  color: var(--color-text-base-inverse);
}
@media (min-width: 768px) {
  .vp-story-detail-parts-8 {
    display: block;
    margin: 0 auto;
    width: min(calc(800 / 1440 * 100vw), 800px);
  }
  .vp-story-detail-parts-8 .vp-story-detail-parts-8__text {
    margin: var(--space-16) var(--space-64) 0 var(--space-64);
  }
}

.vp-story-detail-parts-point {
  position: relative;
  z-index: 1;
  color: var(--color-text-inverse);
}
.vp-story-detail-parts-point::after {
  position: absolute;
  bottom: 6px;
  right: -1px;
  content: "";
  display: block;
  width: 77px;
  height: 27px;
  background-image: url("../../images/vp/common/icon-sparkle-04.svg");
}
.vp-story-detail-parts-point .vp-story-detail-parts-point__label {
  display: inline-block;
  padding: 4px var(--space-16) 2px;
  border-radius: var(--round-small) var(--round-small) 0 0;
  background: var(--color-bg-gold);
  font-family: var(--font-family-en);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 3%;
  text-align: center;
}
.vp-story-detail-parts-point .vp-story-detail-parts-point__body {
  padding: calc(var(--space-20) - 3px) calc(var(--space-20) - 3px) calc(var(--space-32) - 3px) calc(var(--space-20) - 3px);
  border-radius: 0 var(--round-big) var(--round-big) var(--round-big);
  border: 3px solid var(--color-line-gold);
  background: var(--color-parts-sub2);
  box-shadow: 2px 2px 4px 0px rgba(0, 0, 0, 0.1411764706);
}
.vp-story-detail-parts-point .vp-story-detail-parts-point__lead {
  margin-bottom: var(--space-4);
  font-weight: var(--font-weight-bold);
  font-size: var(--font-size-body);
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 22.5%;
  text-decoration-thickness: 15.5%;
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
}
.vp-story-detail-parts-point .vp-story-detail-parts-point__text {
  margin-bottom: var(--space-8);
  font-size: var(--font-size-caption);
}
.vp-story-detail-parts-point .vp-story-detail-parts-point__note {
  font-size: var(--font-size-caption);
}

.vp-story-detail-cv__inner {
  padding: var(--space-48) var(--space-20);
}
.vp-story-detail-cv__icon {
  width: 56px;
  margin: 0 auto;
}
.vp-story-detail-cv__lead {
  font-size: var(--font-size-heading-lv4);
  font-weight: var(--font-weight-bold);
  color: var(--color-white);
  margin: var(--space-y-lv3) 0;
  text-align: center;
  display: flex;
  gap: var(--space-4);
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.vp-story-detail-cv__lead-label {
  font-size: var(--font-size-caption);
  font-weight: var(--font-weight-regular);
}
.vp-story-detail-cv .vp-button.vp-button--detail-cv, .vp-story-detail-cv .vp-plan-detail-section .vp-button--detail-cv.vp-plan-detail-section__hint-button, .vp-plan-detail-section .vp-story-detail-cv .vp-button--detail-cv.vp-plan-detail-section__hint-button {
  background: var(--color-accent01);
  margin-bottom: 16px;
}

.section-others {
  background: linear-gradient(180deg, var(--color-gray06) 0%, rgba(11, 43, 59, 0) 100%);
}

.vp-story-detail-modal {
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.vp-story-detail-modal.vp-is-open {
  display: flex;
}
.vp-story-detail-modal .vp-story-detail-modal__dialog {
  position: relative;
  z-index: 102;
  display: flex;
  flex-direction: column;
  max-height: calc(100svh - 80px);
  border-radius: var(--round-big) var(--round-big) 0 0;
  background: var(--color-bg-sub);
  width: 100%;
}
@media (min-width: 768px) {
  .vp-story-detail-modal .vp-story-detail-modal__dialog {
    width: 728px;
    height: calc(100svh - 96px);
    border-radius: var(--round-big) var(--round-big) 0 0;
  }
}
.vp-story-detail-modal .vp-story-detail-modal__header {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-y-lv3) var(--space-x-side);
}
.vp-story-detail-modal .vp-story-detail-modal__title {
  flex: 1 1 auto;
  font-size: var(--font-size-heading-lv3);
  font-weight: var(--font-weight-bold);
}
.vp-story-detail-modal .vp-story-detail-modal__close {
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  margin-left: auto;
  background-image: url("../../images/vp/common/icon-close.svg");
}
.vp-story-detail-modal .vp-story-detail-modal__content {
  flex: 1 1 auto;
  overflow-y: scroll;
}
.vp-story-detail-modal {
  /* ===========================================
  個別設定
  =========================================== */
}
.vp-story-detail-modal .vp-story-detail-modal__inner {
  padding: 16px 20px 48px;
  border-top: 1px solid var(--color-gray03);
}
@media (min-width: 768px) {
  .vp-story-detail-modal .vp-story-detail-modal__inner {
    padding: 16px 32px 48px;
  }
}
.vp-story-detail-modal .vp-story-detail-modal__legend {
  display: flex;
  gap: 4px;
}
.vp-story-detail-modal .vp-story-detail-modal__legend-icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  margin-top: 1px;
}
.vp-story-detail-modal .vp-story-detail-modal__legend-text {
  color: var(--color-gray01);
  font-size: 12px;
  font-weight: 300;
}
.vp-story-detail-modal .vp-story-detail-modal__box {
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: var(--color-graphic01);
  border-radius: 12px;
  margin-top: 50px;
  margin-bottom: 16px;
}
.vp-story-detail-modal .vp-story-detail-modal__box-desc {
  font-size: 12px;
  margin-bottom: 4px;
}
.vp-story-detail-modal .vp-story-detail-modal__box-text {
  font-size: 20px;
  font-weight: var(--font-weight-bold);
  margin-bottom: 16px;
  text-align: center;
}
.vp-story-detail-modal .vp-story-detail-modal__annotation-link {
  color: var(--color-gray01);
  text-decoration: underline;
}
.vp-story-detail-modal .vp-story-detail-modal__annotation {
  display: flex;
  flex-direction: column;
}
.vp-story-detail-modal .vp-story-detail-modal__annotation-text {
  font-size: 12px;
  color: var(--color-gray01);
}

.vp-main.vp-main--story-detail {
  background: var(--color-bg-grand);
}

@media (min-width: 768px) {
  .vp-story-detail__layout {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    background: #effdff;
  }
}

.vp-story-detail__sidebar {
  padding: var(--space-y-lv2) var(--space-x-side);
}
@media (min-width: 768px) {
  .vp-story-detail__sidebar {
    position: sticky;
    top: 0;
    padding: 0;
    flex: 0 0 calc(544 / 1440 * 100vw);
    align-self: flex-start;
  }
}

@media (min-width: 768px) {
  .vp-story-detail__content {
    position: relative;
    flex: 0 0 calc(896 / 1440 * 100vw);
    border-radius: 40px 0 0 0;
    box-shadow: 0px 6px 24px 0px rgba(5, 64, 143, 0.3215686275);
    overflow: hidden;
    background: var(--color-bg-grand);
  }
}

.vp-story-detail__section {
  display: flex;
  flex-direction: column;
  gap: var(--space-20);
}
@media (min-width: 768px) {
  .vp-story-detail__section {
    gap: var(--space-48);
  }
}
.vp-story-detail__section.vp-story-detail__section--day-to-night {
  background: linear-gradient(180deg, var(--color-bg-grand) 0%, var(--color-bg-base-inverse) 100%);
}
.vp-story-detail__section.vp-story-detail__section--night {
  background: var(--color-bg-base-inverse);
}
.vp-story-detail__section.vp-story-detail__section--night-to-day {
  background: linear-gradient(180deg, var(--color-bg-base-inverse) 0%, var(--color-bg-grand) 100%);
}
.vp-story-detail__section > .vp-story-detail-story + * {
  margin-top: calc(-1 * var(--space-20));
}
.vp-story-detail__section > .vp-story-detail-story:only-child {
  margin-bottom: 0;
}
.vp-story-detail__section + .vp-story-detail__section {
  padding-top: 120px;
}

.vp-story-detail__summary {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--space-y-lv2);
  padding-top: var(--space-y-lv0);
  background: var(--color-bg-base-inverse);
}

/* ===========================================
  CMS対応 : sticky が有効になるように overflow hidden を解除
=========================================== */
@media (min-width: 768px) {
  .pbPage:has(.vp-story-detail__sidebar),
  .pbMainArea:has(.vp-story-detail__sidebar) {
    overflow: visible !important;
  }
}

/* ===========================================
  CMS対応 : ヘッダーが重なりの一番上にくるようにする
=========================================== */
.pbPage:has(.vp-main--story-detail) #header {
  z-index: 3 !important;
}

.vp-story-list {
  display: flex;
  flex-flow: column;
  gap: var(--space-32);
}
@media (min-width: 768px) {
  .vp-story-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-48) 20px;
  }
}
.vp-main.vp-main--story {
  background: var(--color-bg-base);
}
.vp-main.vp-main--story .vp-page-heading {
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .vp-story-intro {
    padding-top: var(--space-32);
    margin-bottom: var(--space-y-lv1);
  }
  .vp-story-intro__inner {
    display: flex;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .vp-story-intro__inner {
    margin-left: auto;
    margin-right: auto;
    padding-right: 0;
    padding-left: 0;
    max-width: var(--container-max-width-pc);
  }
}
@media (min-width: 768px) {
  .vp-story-intro__inner > * {
    flex: 0 0 50%;
  }
  .vp-story-kv {
    border-radius: var(--round-big);
  }
}
.vp-story-overview {
  padding: 0 var(--space-x-side) var(--space-y-lv1);
  padding-top: var(--space-y-lv3);
}
@media (min-width: 768px) {
  .vp-story-overview {
    padding: 160px var(--space-y-lv1) var(--space-32);
    box-sizing: border-box;
  }
}

.vp-story-storys .vp-story-storys__inner {
  padding: 0 var(--space-x-side) var(--space-y-lv1);
}
@media (min-width: 768px) {
  .vp-story-storys .vp-story-storys__inner {
    margin-left: auto;
    margin-right: auto;
    padding-right: 0;
    padding-left: 0;
    max-width: var(--container-max-width-pc);
  }
}

.vp-main.vp-main--type-subpage {
  background: var(--color-bg-base);
}

.vp-subpage-wrapper {
  padding: var(--space-64) var(--space-20) var(--space-48) var(--space-20);
}
@media (min-width: 768px) {
  .vp-subpage-wrapper {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-64) var(--space-20);
  }
}

.vp-subpage-button-container {
  background-color: var(--color-white);
  border-radius: 8px;
  padding: var(--space-16) var(--space-20);
  margin-top: var(--space-16);
  display: flex;
  flex-direction: column;
  gap: 16px;
}
@media (min-width: 768px) {
  .vp-subpage-button-container {
    border-radius: var(--round-small);
  }
}

@media (min-width: 768px) {
  .vp-main.vp-main--type-subpage .vp-button.vp-button--primary, .vp-main.vp-main--type-subpage .vp-plan-detail-section .vp-button--primary.vp-plan-detail-section__hint-button, .vp-plan-detail-section .vp-main.vp-main--type-subpage .vp-button--primary.vp-plan-detail-section__hint-button {
    max-width: 300px;
  }
}

/* ===========================================
  About Step
=========================================== */
.vp-about-step {
  background-color: var(--color-graphic01);
  padding: 48px 20px;
}
.vp-about-step__list {
  margin-top: var(--space-16, 16px);
  padding: 0;
  list-style: none;
}
.vp-about-step__item {
  position: relative;
}
.vp-about-step {
  /* カード本体 */
}
.vp-about-step__card {
  background: var(--color-white);
  border-radius: 20px;
  padding: 12px;
}
.vp-about-step__content {
  display: flex;
  gap: 4px;
  margin-top: 8px;
}
.vp-about-step__content--media {
  flex-direction: column;
  gap: 8px;
}
.vp-about-step__body {
  min-width: 0;
}
.vp-about-step__media {
  flex-shrink: 0;
  max-width: 86px;
  height: 86px;
}
.vp-about-step__media img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 8px;
  -o-object-fit: cover;
     object-fit: cover;
}
.vp-about-step__card--media .vp-about-step__media {
  max-width: 326px;
  height: auto;
}
.vp-about-step {
  /* 見出し（番号 + タイトル） */
}
.vp-about-step__head {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.vp-about-step__num {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  border-radius: 9999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-family-en);
  font-weight: 400;
  font-size: 14px;
  background: var(--color-grand);
  color: var(--color-graphic03);
}
.vp-about-step__title {
  margin: 2px 0 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--color-black);
}
.vp-about-step__text {
  font-size: 12px;
  line-height: 1.7;
  color: var(--color-gray01);
}
.vp-about-step {
  /* 点線矢印（各カードの下に出る） */
}
.vp-about-step__arrow {
  position: relative;
  width: 18px;
  height: 30px;
  margin: 5px 0 5px 26px;
}
.vp-about-step__arrow::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 10px;
  transform: translateX(-50%);
  border-left: 3px dotted var(--color-gray01);
}
.vp-about-step__arrow::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 0;
  height: 0;
  transform: translateX(-50%);
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 8px solid var(--color-gray01);
}
.vp-about-step__arrow--nohead::after {
  display: none;
}
.vp-about-step__arrow--note {
  flex-shrink: 0;
  height: 34px;
}
.vp-about-step__arrow--note2 {
  flex-shrink: 0;
  height: 155px;
}
.vp-about-step__item:last-child .vp-about-step__arrow {
  display: none;
}
.vp-about-step__note-row {
  display: flex;
  align-items: center;
  gap: 20px;
}
.vp-about-step {
  /* 点線途中の注釈行 */
}
.vp-about-step__note {
  position: relative;
  margin: 6px 0 6px;
  color: var(--color-gray01);
  font-size: 16px;
}
.vp-about-step__note-text {
  display: inline-block;
}
.vp-about-step__note {
  /* ★ 追加：カード型のnote */
}
.vp-about-step__note--card .vp-about-step__note-card {
  background: var(--color-white);
  border-radius: 20px;
  padding: 12px;
}
.vp-about-step__note--card .vp-about-step__note-title {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  color: var(--color-black);
}
.vp-about-step__note--card .vp-about-step__note-text {
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.7;
  color: var(--color-gray01);
}
.vp-about-step {
  /* PCで少し広げる */
}
@media (min-width: 768px) {
  .vp-about-step {
    padding: 64px 80px;
  }
  .vp-about-step__inner {
    max-width: 560px;
    margin: 0 0 0 auto;
  }
  .vp-about-step__card {
    border-radius: 24px;
    padding: 20px;
  }
  .vp-about-step__card--media {
    grid-template-columns: 1fr 120px;
  }
  .vp-about-step__media img {
    width: 100%;
    border-radius: 12px;
  }
  .vp-about-step__media {
    width: 140px;
  }
  .vp-about-step__card--media .vp-about-step__media {
    width: 100%;
    max-width: 100%;
  }
  .vp-about-step__num {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
    font-size: 14px;
  }
  .vp-about-step__title {
    font-size: 16px;
  }
  .vp-about-step__text {
    font-size: 16px;
  }
  .vp-about-step__arrow {
    margin-left: 14px;
  }
}

/* ===========================================
  About QA
=========================================== */
.vp-about-qa {
  background: var(--color-white);
  padding: 48px 20px;
}
.vp-about-qa__body {
  margin-top: var(--space-32);
}
.vp-about-qa__list {
  margin: 0;
  padding: 0;
}
.vp-about-qa__item {
  border-top: 1px solid var(--color-gray03);
}
.vp-about-qa__item:first-child {
  border-top: none;
}
.vp-about-qa__item:last-child {
  border-bottom: 1px solid var(--color-gray03);
}
.vp-about-qa__item:not(:last-child) {
  margin-bottom: 8px;
}
.vp-about-qa__q {
  margin: 0;
}
.vp-about-qa__trigger {
  width: 100%;
  display: grid;
  grid-template-columns: 14px 1fr 16px;
  gap: 8px;
  align-items: start;
  padding: 12px 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
}
.vp-about-qa {
  /* Q / A の丸 */
}
.vp-about-qa {
  /* Q/A SVG 本体 */
}
.vp-about-qa__mark-icon-q {
  display: block;
  width: 14px;
  height: 16px;
}
.vp-about-qa__mark-icon-a {
  display: block;
  width: 15px;
  height: 14px;
}
.vp-about-qa__qtext {
  font-size: 14px;
  color: var(--color-black);
  font-weight: var(--font-weight-bold);
}
.vp-about-qa {
  /* 右端の＋／－（丸） */
}
.vp-about-qa__icon {
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: end;
  align-self: center;
  position: relative;
}
.vp-about-qa__icon-open, .vp-about-qa__icon-close {
  position: absolute;
  inset: 0;
  margin: auto;
  display: block;
  width: 16px;
  height: 16px;
}
.vp-about-qa {
  /* デフォルトは「＋」だけ表示 */
}
.vp-about-qa__icon-open {
  opacity: 0;
}
.vp-about-qa__icon-close {
  opacity: 1;
}
.vp-about-qa {
  /* A（回答） */
}
.vp-about-qa__a {
  margin: 0;
  padding: 0 0 14px 0;
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: max-height 0.3s ease, opacity 0.3s ease;
}
.vp-about-qa__a[hidden] {
  display: block;
  padding: 0;
  max-height: 0;
  opacity: 0;
}
.vp-about-qa__a-inner {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 10px;
  align-items: start;
}
.vp-about-qa__a-content {
  min-width: 0;
}
.vp-about-qa__a-heading {
  font-size: 14px;
  font-weight: var(--font-weight-bold);
  color: var(--color-black);
}
.vp-about-qa__a-heading:not(:first-of-type) {
  margin-top: 16px;
}
.vp-about-qa__a-text {
  font-size: 14px;
  color: var(--color-black);
}
.vp-about-qa__a-text:not(:first-of-type) {
  margin-top: 8px;
}
.vp-about-qa__a-note-list {
  margin: 8px 0 0 !important;
  padding: 0;
}
.vp-about-qa__a-note-item {
  position: relative;
  padding-left: 1em;
  font-size: 12px;
  color: var(--color-gray01);
  margin-top: 4px;
}
.vp-about-qa__a-note-item::before {
  content: "※";
  position: absolute;
  left: 0;
  top: 0;
}
.vp-about-qa .vp-about-qa__a-link {
  text-decoration: underline;
  text-underline-offset: 1px;
}
.vp-about-qa {
  /* open状態：回答表示 + ＋→－に切替 */
}
.vp-about-qa__item.is-open .vp-about-qa__a {
  opacity: 1;
}
.vp-about-qa__item.is-open .vp-about-qa__icon-open {
  opacity: 1;
}
.vp-about-qa__item.is-open .vp-about-qa__icon-close {
  opacity: 0;
}
.vp-about-qa {
  /* more */
}
.vp-about-qa__more {
  margin-top: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}
.vp-about-qa__more-btn {
  border: 0;
  background: transparent;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  padding: 6px 10px;
}
.vp-about-qa__more-text {
  font-size: 14px;
  color: var(--color-gray01);
  font-weight: var(--font-weight-bold);
}
.vp-about-qa__more-icon {
  width: 32px;
  height: 32px;
}
.vp-about-qa__more-icon-img {
  display: block;
  width: 32px;
  height: 32px;
}
.vp-about-qa .vp-button--about-qa {
  display: none;
  margin-top: 32px;
}
.vp-about-qa__body.is-qa-expanded .vp-button--about-qa {
  display: block;
}
@media (min-width: 768px) {
  .vp-about-qa {
    padding: 64px 80px;
  }
  .vp-about-qa__inner {
    max-width: 560px;
    margin: 0 auto 0 0;
  }
  .vp-about-qa__trigger {
    grid-template-columns: 16px 1fr 16px;
  }
  .vp-about-qa__qtext {
    font-size: 20px;
  }
  .vp-about-qa__a-heading {
    font-size: 16px;
  }
  .vp-about-qa__a-text {
    font-size: 16px;
  }
  .vp-about-qa__a-note-item {
    font-size: 12px;
  }
  .vp-about-qa__a-inner {
    grid-template-columns: 16px 1fr;
  }
  .vp-about-qa__mark {
    padding-top: 6px;
  }
  .vp-about-qa .vp-button--about-qa {
    display: block;
  }
}

.vp-about-point {
  padding: 150px 0 80px 0;
}
.vp-about-point__box {
  position: relative;
  box-sizing: border-box;
  width: 350px;
  margin: 0 auto;
  border-radius: 20px;
  background-color: var(--color-white);
  padding: 69px 20px 70px;
  background-image: url("../../images/vp/about/point-deco.png");
  background-repeat: no-repeat;
  background-position: center bottom 20px;
  background-size: 310px auto;
}
@media (min-width: 768px) {
  .vp-about-point__box {
    background-image: url("../../images/vp/about/point-deco-pc.png");
    background-size: 664px auto;
    width: auto;
  }
}
.vp-about-point__box::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 36px;
  height: 22px;
  background-image: url("../../images/vp/about/point-deco.png");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 310px auto;
  transform: scaleY(-1);
  transform-origin: top;
  pointer-events: none;
}
@media (min-width: 768px) {
  .vp-about-point__box::before {
    background-image: url("../../images/vp/about/point-deco-pc.png");
    background-size: 664px auto;
    width: auto;
  }
}
.vp-about-point__label {
  position: absolute;
  left: 50%;
  top: 16px;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 3px 6px 0 6px;
  color: #d4a900;
  text-align: center;
  font-family: var(--font-family-en);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.36px;
  background: var(--color-white);
  z-index: 1;
}
.vp-about-point__heading {
  color: var(--color-graphic04);
  text-align: center;
  font-size: 20px;
  font-weight: var(--font-weight-bold);
  line-height: 1.6;
  margin: 0 0 32px;
}
.vp-about-point__text {
  color: var(--color-graphic04);
  font-size: 14px;
  line-height: 1.7;
  margin: 0;
}
@media (min-width: 768px) {
  .vp-about-point {
    padding: 96px 0 0 0;
  }
  .vp-about-point__box {
    max-width: 728px;
    width: auto;
    padding: 69px 32px 74px;
    background-position: center bottom 24px;
  }
  .vp-about-point__heading {
    font-size: 28px;
  }
  .vp-about-point__text {
    font-size: 16px;
    line-height: 1.7;
  }
}

/* ===========================================
  Special Cards
=========================================== */
.vp-about-special {
  padding: 64px 20px 48px;
  position: relative;
}
.vp-about-special__inner {
  margin: 0 auto;
  display: grid;
  gap: 16px;
  position: relative;
  z-index: 1;
}
.vp-about-special__plus--sp {
  width: 56px;
  height: 56px;
  margin: 0 auto;
}
.vp-about-special__plus--sp img {
  width: 56px;
  height: 56px;
  display: block;
}
.vp-about-special__plus--sp::before {
  content: "";
  position: absolute;
  transform: translateY(-50%);
  background-repeat: no-repeat;
  background-size: contain;
  z-index: -1;
  width: 140px;
  height: 80px;
  top: 24px;
  left: -42px;
  background-image: url("../../images/vp/about/about-sparkle.svg");
}
.vp-about-special__plus--sp:nth-child(4)::before {
  transform: translateY(-50%) scaleX(-1);
}
.vp-about-special__card {
  box-sizing: border-box;
  position: relative;
  background: var(--color-white);
  border-radius: 20px;
  padding: 42px 20px 20px 20px;
  min-height: 128px;
}
.vp-about-special__label {
  box-sizing: border-box;
  position: absolute;
  z-index: 2;
  height: 30px;
  top: 0;
  left: 20px;
  display: inline-flex;
  padding: 4px 10px 6px 8px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  font-family: var(--font-family-en);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.36px;
  color: var(--color-white);
  background-color: var(--color-graphic03);
  border-radius: 0 0 8px 8px;
}
.vp-about-special__card--special .vp-about-special__label {
  background-color: #d4a900;
}
.vp-about-special__label-icon {
  width: 16px;
  height: 20px;
  display: block;
}
.vp-about-special__title {
  position: relative;
  z-index: 2;
  display: inline;
  color: var(--color-graphic04);
  font-size: 16px;
  line-height: 1.8;
  font-weight: var(--font-weight-bold);
  background: linear-gradient(transparent 60%, var(--color-grand) 60%, var(--color-grand) 90%, transparent 90%);
}
.vp-about-special__lead {
  position: relative;
  z-index: 2;
  display: inline;
  color: var(--color-graphic04);
  font-size: 20px;
  line-height: 1.8;
  font-weight: var(--font-weight-bold);
  background: linear-gradient(transparent 60%, var(--color-grand) 60%, var(--color-grand) 90%, transparent 90%);
}
.vp-about-special__thumb {
  position: absolute;
  transform: rotate(6deg);
  right: -36px;
  top: -41px;
  width: 150px;
  height: 150px;
  border-radius: 9999px;
  overflow: hidden;
  background: #e9f6ff;
  box-shadow: 0 0 54px 0 var(--color-white);
}
.vp-about-special__thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.vp-about-special__card--special {
  min-height: 210px;
}
.vp-about-special__card--special .vp-about-special__thumb {
  top: -46px;
  right: -70px;
  width: 190px;
  height: 190px;
}
.vp-about-special__card--special .vp-about-special__title {
  display: inline-block;
}
.vp-about-special__list {
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}
.vp-about-special__card--special .vp-about-special__list {
  margin: 25px 0 0;
}
.vp-about-special__item {
  display: flex;
  padding: 12px;
  align-items: center;
  gap: 10px;
  border-radius: 8px;
  background: var(--color-graphic01);
}
.vp-about-special__item-icon {
  width: 24px;
  height: 24px;
}
.vp-about-special__item-text {
  color: var(--color-graphic03);
  font-size: 14px;
  font-weight: var(--font-weight-bold);
  text-align: center;
}
.vp-about-special .vp-button-wrapper {
  margin-top: 16px;
}
@media (min-width: 768px) {
  .vp-about-special {
    padding: 120px 24px 120px;
  }
  .vp-about-special__title {
    font-size: 24px;
  }
  .vp-about-special__lead {
    font-size: 28px;
  }
  .vp-about-special__item-text {
    font-size: 20px;
  }
  .vp-about-special__inner {
    max-width: 1080px;
    grid-template-columns: 1fr 483px;
    gap: 80px 112px;
    grid-template-areas: "ticket special" "hotel  special";
    align-items: stretch;
  }
  .vp-about-special {
    /* PCでは＋アイコン非表示（SP専用） */
  }
  .vp-about-special__plus--sp {
    display: none;
  }
  .vp-about-special__card--hotel::before, .vp-about-special__card--special::before {
    content: "";
    position: absolute;
    width: 56px;
    height: 56px;
    background: url("../../images/vp/about/icon-plus-navy.svg") no-repeat center/contain;
    z-index: 2;
    pointer-events: none;
  }
  .vp-about-special {
    /* 1つ目の＋：hotelの箱の上（ticketとhotelの間） */
  }
  .vp-about-special__card--hotel::before {
    top: -64px;
    left: 50%;
    transform: translateX(-50%);
  }
  .vp-about-special {
    /* 2つ目の＋：specialの箱の上（hotelとspecialの間） */
  }
  .vp-about-special__card--special::before {
    top: 50%;
    left: -80px;
    transform: translateY(-50%);
  }
  .vp-about-special {
    /* どのカードがどこに入るか指定 */
  }
  .vp-about-special__card--ticket {
    grid-area: ticket;
  }
  .vp-about-special__card--hotel {
    grid-area: hotel;
  }
  .vp-about-special__card--hotel::after {
    content: "";
    position: absolute;
    transform: translateY(-50%);
    background-repeat: no-repeat;
    background-size: contain;
    z-index: -1;
    width: 140px;
    height: 80px;
    top: -36px;
    left: 170px;
    background-image: url("../../images/vp/about/about-sparkle.svg");
  }
  .vp-about-special__card--special {
    grid-area: special;
    min-height: 100%;
    padding-right: 240px; /* 丸画像の被り対策 */
  }
  .vp-about-special__card--special::after {
    content: "";
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: -1;
    width: 80px;
    height: 140px;
    top: 180px;
    left: -90px;
    background-image: url("../../images/vp/about/about-sparkle-02.svg");
  }
  .vp-about-special {
    /* PCのカード余白・角丸 */
  }
  .vp-about-special__card {
    padding: 48px 32px 32px;
    border-radius: 24px;
  }
  .vp-about-special {
    /* 左2枚：サムネ調整 */
  }
  .vp-about-special__card--ticket .vp-about-special__thumb, .vp-about-special__card--hotel .vp-about-special__thumb {
    top: -40px;
    right: -18px;
  }
  .vp-about-special {
    /* 右のSPECIAL：サムネ大きめ */
  }
  .vp-about-special__card--special .vp-about-special__thumb {
    top: -54px;
    right: -54px;
  }
  .vp-about-special {
    /* SPECIALの間隔微調整 */
  }
  .vp-about-special__card--special .vp-about-special__list {
    margin-top: 20px;
  }
  .vp-about-special .vp-button--about-hotel {
    max-width: 300px;
    width: 100%;
    min-width: auto;
  }
  .vp-about-special .vp-button--about-activity {
    max-width: 302px;
    width: 100%;
    min-width: auto;
  }
}

/* ===========================================
  Info
=========================================== */
.vp-about-info {
  padding: 120px 40px 160px;
}
@media (min-width: 768px) {
  .vp-about-info {
    padding-bottom: 96px;
  }
}
.vp-about-info__list {
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.vp-about-info__list + .vp-about-info__list {
  margin-top: 48px;
}
.vp-about-info__item {
  position: relative;
  z-index: 0;
  box-sizing: border-box;
}
.vp-about-info__item--q1 {
  margin: 0 auto;
  width: 310px;
}
@media (min-width: 768px) {
  .vp-about-info__item--q1 {
    max-width: 504px;
    width: 100%;
  }
}
.vp-about-info__item--q2 {
  margin: 0 auto 0 0;
  width: 223px;
}
@media (min-width: 768px) {
  .vp-about-info__item--q2 {
    max-width: 417px;
    width: 100%;
  }
}
.vp-about-info__item--q3 {
  margin: 0 0 0 auto;
  width: 223px;
}
.vp-about-info__item--q4 {
  margin: 0 auto;
  width: 310px;
}
@media (min-width: 768px) {
  .vp-about-info__item--q4 {
    max-width: 325px;
    width: 100%;
  }
}
.vp-about-info__item--q5 {
  margin: 0 auto 0 0;
  width: 212px;
}
@media (min-width: 768px) {
  .vp-about-info__item--q5 {
    max-width: 227px;
    width: 100%;
  }
}
.vp-about-info__item--q6 {
  margin: 0 auto;
  width: 310px;
}
@media (min-width: 768px) {
  .vp-about-info__item--q6 {
    max-width: 504px;
    width: 100%;
  }
}
.vp-about-info__item--q7 {
  margin: 0 auto;
  width: 310px;
}
@media (min-width: 768px) {
  .vp-about-info__item--q7 {
    max-width: 504px;
    width: 100%;
  }
}
.vp-about-info__item--q2::before {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: -2;
  width: 186.5px;
  height: 343.58px;
  top: 0px;
  left: 195px;
  background-image: url("../../images/vp/about/about-info-deco-01.png");
}
@media (min-width: 768px) {
  .vp-about-info__item--q2::before {
    top: -50px;
    left: 390px;
  }
}
.vp-about-info__item--q2::after {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: -2;
  width: 137.5px;
  height: 137.5px;
  top: 250px;
  left: 233px;
  background-image: url("../../images/vp/about/about-info-deco-02.png");
}
@media (min-width: 768px) {
  .vp-about-info__item--q2::after {
    left: 422px;
  }
}
.vp-about-info__item--q3::before {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: -2;
  width: 186.5px;
  height: 186.5px;
  top: 47px;
  left: -142px;
  background-image: url("../../images/vp/about/about-info-deco-03.png");
}
.vp-about-info__item--q5::before {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: -2;
  width: 189px;
  height: 251px;
  top: -14px;
  left: 188px;
  background-image: url("../../images/vp/about/about-info-deco-04.png");
}
.vp-about-info__item--q6::before {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: -2;
  width: 186.5px;
  height: 242.5px;
  top: -89px;
  left: -116px;
  background-image: url("../../images/vp/about/about-info-deco-05.png");
}
.vp-about-info__item--q7::before {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: -2;
  width: 198px;
  height: 246px;
  top: -55px;
  left: 239px;
  background-image: url("../../images/vp/about/about-info-deco-06.png");
}
@media (min-width: 768px) {
  .vp-about-info__item--q7::before {
    left: 441px;
  }
}
.vp-about-info__head {
  position: relative;
  z-index: 1;
  padding: 20px 16px 16px;
  background: var(--color-graphic01);
  border-radius: 20px;
}
.vp-about-info__head + .vp-about-info__bottom {
  border-radius: 0 0 20px 20px;
}
.vp-about-info__head:has(+ .vp-about-info__bottom) {
  border-radius: 20px 20px 0 0;
}
.vp-about-info__number {
  position: absolute;
  width: 122px;
  height: 77px;
  left: -40px;
  top: -32px;
}
.vp-about-info__label-icon {
  width: 122px;
}
.vp-about-info__title {
  color: var(--color-accent03);
  text-align: center;
  font-weight: var(--font-weight-bold);
  font-size: 16px;
  margin-bottom: 16px;
}
@media (min-width: 768px) {
  .vp-about-info__title {
    font-size: 24px;
  }
}
.vp-about-info__text {
  color: var(--color-black);
  font-size: 14px;
  margin-top: 8px;
}
@media (min-width: 768px) {
  .vp-about-info__text {
    font-size: 16px;
  }
}
.vp-about-info__strong {
  color: var(--color-black);
  text-decoration-line: underline;
}
.vp-about-info__box {
  margin-top: 8px;
  display: flex;
  flex-direction: column;
  padding: 8px;
  gap: 2px;
  border-radius: 8px;
  background: var(--color-white);
  /* ワクワクシャドウ */
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15);
}
.vp-about-info__box-text-label {
  color: var(--color-graphic03);
  text-align: center;
  font-size: 12px;
  font-weight: var(--font-weight-bold);
}
.vp-about-info__box-content {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 2px;
}
.vp-about-info__box-text {
  color: var(--color-graphic04);
  font-family: var(--font-family-en);
  font-size: 34px;
  font-weight: 300;
  line-height: 1.1;
  letter-spacing: -0.374px;
}
.vp-about-info__box-text-small {
  color: var(--color-graphic04);
  font-size: 16px;
  font-weight: var(--font-weight-bold);
}
.vp-about-info__note {
  color: var(--color-gray01);
  font-size: 12px;
  margin-top: 8px;
}
.vp-about-info__image {
  width: 278px;
  display: block;
  margin: 16px auto 0;
}
@media (min-width: 768px) {
  .vp-about-info__image {
    width: 100%;
  }
}
.vp-about-info__image--pc {
  display: none;
}
.vp-about-info__image--sp {
  display: block;
}
@media (min-width: 768px) {
  .vp-about-info__image--pc {
    display: block;
  }
  .vp-about-info__image--sp {
    display: none;
  }
}
.vp-about-info__bottom {
  position: relative;
  z-index: 1;
  padding: 12px 16px;
  border-top: 2px dashed var(--color-gray02);
  background: var(--color-graphic01);
  border-radius: 0 0 20px 20px;
}
.vp-about-info__bottom-text {
  color: var(--color-gray01);
  font-size: 12px;
}
.vp-about-info {
  /* =========================
    media list
  ========================= */
}
.vp-about-info__media-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.vp-about-info__media-list--round .vp-about-info__media-title {
  font-size: 14px;
}
.vp-about-info__media-item {
  position: relative;
}
.vp-about-info__media-item:first-child .vp-about-info__list-num {
  width: 24px;
  height: 24px;
  background: var(--color-accent03);
}
.vp-about-info {
  /* 丸数字 */
}
.vp-about-info__list-num {
  position: absolute;
  top: -6px;
  left: -6px;
  z-index: 2;
  width: 20px;
  height: 20px;
  border-radius: 9999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-family-en);
  font-size: 12px;
  color: var(--color-white);
  background: var(--color-graphic03);
}
.vp-about-info {
  /* カード本体 */
}
.vp-about-info__media-card {
  display: flex;
  gap: 8px;
  align-items: center;
  background: var(--color-white);
  border-radius: 8px;
  padding: 8px;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15);
}
.vp-about-info {
  /* サムネ */
}
.vp-about-info__media-thumb {
  flex: 0 0 72px;
  width: 72px;
  height: 72px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--color-gray03);
}
.vp-about-info__media-thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.vp-about-info__media-thumb--round {
  flex: 0 0 70px;
  width: 70px;
  height: 70px;
  border-radius: 60px;
  overflow: hidden;
  border: none;
}
.vp-about-info__media-thumb--round img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.vp-about-info {
  /* テキストエリア */
}
.vp-about-info__media-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.vp-about-info__media-title {
  font-size: 12px;
  font-weight: var(--font-weight-bold);
  color: var(--color-graphic04);
}
@media (min-width: 768px) {
  .vp-about-info__media-title {
    font-size: 14px;
  }
}
.vp-about-info {
  /* 詳しく見る */
}
.vp-about-info__media-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--color-gray01);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.vp-about-info__media-link-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  background: url("../../images/vp/common/icon-link.svg") center/contain no-repeat;
}
.vp-about-info__media-area {
  color: var(--color-gray01);
  font-size: 10px;
}
.vp-about-info {
  /* =========================
    box list
  ========================= */
}
.vp-about-info__box-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.vp-about-info__box-list-item {
  position: relative;
}
.vp-about-info__box-list-item:first-child .vp-about-info__list-num {
  width: 24px;
  height: 24px;
  background: var(--color-accent03);
}
.vp-about-info__box-list-item:first-child .vp-about-info__box-list-text {
  font-size: 14px;
}
.vp-about-info__box-list-item {
  background: var(--color-white);
  border-radius: 8px;
  padding: 8px;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15);
}
.vp-about-info__box-list-text {
  font-size: 12px;
  font-weight: var(--font-weight-bold);
  color: var(--color-graphic04);
  text-align: center;
}
@media (min-width: 768px) {
  .vp-about-info__inner {
    max-width: 1040px;
    margin: 0 auto;
  }
  .vp-about-info__list {
    flex-direction: row;
    gap: 32px;
    align-items: center;
    justify-content: center;
  }
  .vp-about-info__item--q1, .vp-about-info__item--q2, .vp-about-info__item--q3, .vp-about-info__item--q4, .vp-about-info__item--q5, .vp-about-info__item--q6, .vp-about-info__item--q7 {
    margin: 0;
  }
}

/* ===========================================
  Youtube
=========================================== */
.vp-about-button-youtube {
  display: flex;
  padding: 12px 16px 12px 12px;
  justify-content: center;
  align-items: center;
  gap: 12px;
  margin: 0 auto;
  border-radius: 50px;
  border: 1px solid var(--color-gray02);
  background: rgba(255, 255, 255, 0.7);
  box-shadow: 2px 2px 12px 0 rgba(5, 64, 143, 0.1);
}
.vp-about-button-youtube__icon {
  width: 24px;
  height: 24px;
}
.vp-about-button-youtube__text {
  color: var(--color-graphic04);
  text-align: center;
  font-family: var(--font-family-en);
  font-size: 16px;
  font-weight: var(--font-weight-regular);
  letter-spacing: 0.48px;
}

/* ===========================================
  Youtube Modal
=========================================== */
@media (min-width: 768px) {
  .vp-about-youtube-modal {
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
.vp-about-youtube-modal.vp-is-open {
  display: flex;
}
.vp-about-youtube-modal__dialog {
  position: relative;
  z-index: 102;
  display: flex;
  flex-direction: column;
  height: 100svh;
  background: rgba(0, 0, 0, 0.5);
  width: 100%;
}
.vp-about-youtube-modal__header {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-y-lv3) var(--space-x-side);
}
@media (min-width: 768px) {
  .vp-about-youtube-modal__header {
    width: 700px;
    margin: 130px auto 0;
  }
}
.vp-about-youtube-modal__close {
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  margin-left: auto;
  background-image: url("../../images/vp/common/icon-close-white.svg");
}
.vp-about-youtube-modal__content {
  flex: 1 1 auto;
  overflow-y: scroll;
}
.vp-about-youtube-modal__inner {
  padding: 212px 0 48px;
}
@media (min-width: 768px) {
  .vp-about-youtube-modal__inner {
    padding: 0 0 48px;
  }
}
.vp-about-youtube-modal__video {
  width: 100%;
  background-color: var(--color-black);
}
@media (min-width: 768px) {
  .vp-about-youtube-modal__video {
    width: 700px;
    margin: 0 auto;
  }
}
.vp-about-youtube-modal__video iframe {
  width: 100%;
  max-width: none;
  height: 220px;
}
@media (min-width: 768px) {
  .vp-about-youtube-modal__video iframe {
    height: 394px;
  }
}

/* ===========================================
  Modal
=========================================== */
@media (min-width: 768px) {
  .vp-about-detail-modal {
    display: flex;
    align-items: flex-end;
    justify-content: center;
  }
}
.vp-about-detail-modal.vp-is-open {
  display: flex;
}
.vp-about-detail-modal__dialog {
  position: relative;
  z-index: 102;
  display: flex;
  flex-direction: column;
  height: 100svh;
  background: var(--color-graphic01);
  width: 100%;
}
@media (min-width: 768px) {
  .vp-about-detail-modal__dialog {
    width: 728px;
    border-radius: var(--round-big) var(--round-big) 0 0;
    height: calc(100svh - 96px);
  }
}
.vp-about-detail-modal__header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-y-lv3) var(--space-x-side);
}
.vp-about-detail-modal__close {
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  margin-left: auto;
  background-image: url("../../images/vp/about/icon-close.svg");
}
.vp-about-detail-modal__content {
  flex: 1 1 auto;
  overflow-y: scroll;
}
@media (min-width: 768px) {
  .vp-about-detail-modal__content {
    border-radius: var(--round-big) var(--round-big) 0 0;
  }
}
.vp-about-detail-modal__intro {
  position: relative;
}
.vp-about-detail-modal__label {
  box-sizing: border-box;
  position: absolute;
  top: 0;
  left: 20px;
  height: 42px;
  display: flex;
  padding: 12px 12px 8px 12px;
  align-items: center;
  gap: 12px;
  border-radius: 0 0 8px 8px;
  background: var(--color-accent03);
}
.vp-about-detail-modal__label-icon {
  width: 22px;
}
.vp-about-detail-modal__label-text {
  color: var(--color-white);
  text-align: center;
  font-family: var(--font-family-en);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.36px;
}
.vp-about-detail-modal__media {
  position: relative;
}
.vp-about-detail-modal__img {
  display: block;
  width: 100%;
  height: auto;
}
.vp-about-detail-modal__img--pc {
  display: none;
}
@media (min-width: 768px) {
  .vp-about-detail-modal__img--sp {
    display: none;
  }
  .vp-about-detail-modal__img--pc {
    display: block;
  }
}
.vp-about-detail-modal__copy {
  display: flex;
  flex-direction: column;
  gap: 6px;
  position: absolute;
  bottom: 64px;
  left: 20px;
}
.vp-about-detail-modal__copy-line {
  width: -moz-fit-content;
  width: fit-content;
  color: var(--color-white);
  font-size: 20px;
  font-weight: var(--font-weight-bold);
  padding: 0 8px;
  border-radius: 2px;
  background: var(--color-graphic03);
  box-shadow: 2px 2px 0 0 var(--color-accent03);
}
@media (min-width: 768px) {
  .vp-about-detail-modal__copy-line {
    font-size: 32px;
  }
}
.vp-about-detail-modal__detail {
  padding: 0 20px 32px;
}
.vp-about-detail-modal .vp-button-wrapper {
  padding-bottom: 64px;
  background: var(--color-graphic01);
}
.vp-about-detail-modal {
  /* ===========================================
  card
  =========================================== */
}
.vp-about-detail-modal__card-list {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: -40px;
}
.vp-about-detail-modal__card {
  display: flex;
  padding: 20px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  border-radius: 20px;
  background: var(--color-white);
}
.vp-about-detail-modal__card-media {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
}
.vp-about-detail-modal__card-media img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 310/173.6;
}
.vp-about-detail-modal__card-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.vp-about-detail-modal__card-title {
  color: var(--color-black);
  font-size: 16px;
  font-weight: var(--font-weight-bold);
}
@media (min-width: 768px) {
  .vp-about-detail-modal__card-title {
    font-size: 24px;
  }
}
.vp-about-detail-modal__card-text {
  color: var(--color-gray01);
  font-size: 14px;
  font-weight: var(--font-weight-regular);
}
@media (min-width: 768px) {
  .vp-about-detail-modal__card-text {
    font-size: 16px;
  }
}
.vp-about-detail-modal {
  /* ===========================================
  benefit
  =========================================== */
}
.vp-about-detail-modal__benefit-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: -40px;
  position: relative;
}
.vp-about-detail-modal__benefit-item {
  background: var(--color-white);
  display: flex;
  flex-direction: column;
  border-radius: 20px;
  padding: 20px;
  gap: 20px;
}
.vp-about-detail-modal__benefit-header {
  display: flex;
  align-items: center;
  gap: 10px;
}
.vp-about-detail-modal__benefit-icon {
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  border-radius: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.vp-about-detail-modal__benefit-icon img {
  width: 20px;
  height: 20px;
  display: block;
  -o-object-fit: contain;
     object-fit: contain;
}
.vp-about-detail-modal__benefit-icon--attraction {
  background: var(--color-attraction);
}
.vp-about-detail-modal__benefit-icon--show {
  background: var(--color-show);
}
.vp-about-detail-modal__benefit-icon--restaurant {
  background: var(--color-restaurant);
}
.vp-about-detail-modal__benefit-label {
  color: var(--color-black);
  font-size: 16px;
  font-weight: var(--font-weight-bold);
}
.vp-about-detail-modal__benefit-media {
  aspect-ratio: 310/188.92;
  border-radius: 8px;
  overflow: hidden;
}
.vp-about-detail-modal__benefit-media img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.vp-about-detail-modal__benefit-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.vp-about-detail-modal__benefit-title {
  color: var(--color-black);
  font-size: 20px;
  font-weight: var(--font-weight-bold);
}
@media (min-width: 768px) {
  .vp-about-detail-modal__benefit-title {
    font-size: 28px;
  }
}
.vp-about-detail-modal__benefit-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--color-gray01);
  font-size: 12px;
  font-weight: var(--font-weight-regular);
  text-underline-offset: 3px;
  color: var(--color-text-link);
  text-decoration: underline;
  font-size: var(--font-size-caption);
}
.vp-about-detail-modal__benefit-link-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  background: url("../../images/vp/common/icon-link.svg") center/contain no-repeat;
}
.vp-about-detail-modal {
  /* ===========================================
  media
  =========================================== */
}
.vp-about-detail-modal__media-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  list-style: none;
  margin-top: 16px;
}
.vp-about-detail-modal__media-item {
  background: var(--color-white);
  border-radius: 8px;
  padding: 16px 20px 20px 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.vp-about-detail-modal__media-header {
  color: var(--color-graphic04);
  font-size: 16px;
  font-weight: var(--font-weight-bold);
}
@media (min-width: 768px) {
  .vp-about-detail-modal__media-header {
    font-size: 24px;
  }
}
.vp-about-detail-modal__media-body {
  display: flex;
  gap: 16px;
}
.vp-about-detail-modal__media-media {
  flex: 0 0 92px;
  width: 92px;
  height: 92px;
  border-radius: 8px;
  overflow: hidden;
}
@media (min-width: 768px) {
  .vp-about-detail-modal__media-media {
    flex: 0 0 205px;
    width: 205px;
    height: 205px;
  }
}
.vp-about-detail-modal__media-media img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.vp-about-detail-modal__media-text {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}
.vp-about-detail-modal__media-title {
  font-size: 16px;
  font-weight: var(--font-weight-bold);
  color: var(--color-black);
}
@media (min-width: 768px) {
  .vp-about-detail-modal__media-title {
    font-size: 24px;
  }
}
.vp-about-detail-modal__media-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--color-text-link);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.vp-about-detail-modal__media-link-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  background: url("../../images/vp/common/icon-link.svg") center/contain no-repeat;
}
.vp-about-detail-modal {
  /* ===========================================
  hotel
  =========================================== */
}
.vp-about-detail-modal__hotel-list {
  display: flex;
  flex-direction: column;
  gap: 32px;
  margin-top: 32px;
}
@media (min-width: 768px) {
  .vp-about-detail-modal__hotel-list {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 48px 20px;
  }
}
.vp-about-detail-modal__hotel-item {
  position: relative;
}
@media (min-width: 768px) {
  .vp-about-detail-modal__hotel-item {
    flex: 0 0 calc(50% - 10px);
    max-width: calc(50% - 10px);
  }
}
.vp-about-detail-modal__hotel-media-list {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 5px;
}
.vp-about-detail-modal__hotel-media {
  display: flex;
  align-items: center;
  justify-content: center;
}
.vp-about-detail-modal__hotel-media img {
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
}
.vp-about-detail-modal__hotel-media:nth-child(1), .vp-about-detail-modal__hotel-media:nth-child(3) {
  border-radius: 150px 150px 2px 2px;
  box-shadow: 0 3px 9px 0 rgba(0, 0, 0, 0.08);
  overflow: hidden;
}
.vp-about-detail-modal__hotel-media:nth-child(1) img, .vp-about-detail-modal__hotel-media:nth-child(3) img {
  width: 94px;
  height: 110px;
}
.vp-about-detail-modal__hotel-media:nth-child(2) {
  border-radius: 150px 150px 2px 2px;
  box-shadow: 0 2px 9px 0 rgba(0, 0, 0, 0.2);
  overflow: hidden;
  z-index: 1;
}
.vp-about-detail-modal__hotel-media:nth-child(2) img {
  width: 128px;
  height: 149px;
}
.vp-about-detail-modal__hotel-body {
  padding: 48px 20px 20px 20px;
  border-radius: var(--round-small);
  background: var(--color-white);
  margin-top: -32px;
}
.vp-about-detail-modal__hotel-logo {
  width: 233px;
  height: 60px;
  aspect-ratio: 233/60;
  margin: 0 auto 8px;
}
.vp-about-detail-modal__hotel-name {
  color: var(--color-gray01);
  text-align: center;
  font-size: 12px;
  margin-bottom: 8px;
}
.vp-about-detail-modal__hotel-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.vp-about-detail-modal__hotel-desc {
  color: var(--color-black);
  font-size: 16px;
  font-weight: var(--font-weight-bold);
  text-align: center;
}
@media (min-width: 768px) {
  .vp-about-detail-modal__hotel-desc {
    font-size: 20px;
  }
}
.vp-about-detail-modal__hotel-link {
  display: inline-flex;
  gap: 4px;
  font-size: 12px;
  color: var(--color-text-link);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.vp-about-detail-modal__hotel-link-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  background: url("../../images/vp/common/icon-link.svg") center/contain no-repeat;
}
.vp-about-detail-modal {
  /* ===========================================
  parts
  =========================================== */
}
.vp-about-detail-modal__hotel-heading {
  color: var(--color-black);
  text-align: center;
  font-size: 20px;
  font-weight: var(--font-weight-bold);
  margin-top: 32px;
}
@media (min-width: 768px) {
  .vp-about-detail-modal__hotel-heading {
    font-size: 28px;
  }
}
.vp-about-detail-modal__media-heading {
  color: var(--color-graphic04);
  font-size: 20px;
  font-weight: var(--font-weight-bold);
  margin-top: 32px;
}
@media (min-width: 768px) {
  .vp-about-detail-modal__media-heading {
    font-size: 28px;
  }
}
.vp-about-detail-modal__divider {
  position: relative;
  box-sizing: border-box;
  max-width: 350px;
  margin: 32px auto 0;
  padding: 16px 0;
}
@media (min-width: 768px) {
  .vp-about-detail-modal__divider {
    max-width: 688px;
    margin: 48px auto 0;
  }
}
.vp-about-detail-modal__divider::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 36px;
  height: 22px;
  background-image: url("../../images/vp/about/point-deco.png");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 310px auto;
  transform: scaleY(-1);
  transform-origin: top;
  pointer-events: none;
}
@media (min-width: 768px) {
  .vp-about-detail-modal__divider::before {
    background-image: url("../../images/vp/about/point-deco-pc.png");
    background-size: 664px auto;
    width: auto;
  }
}
.vp-about-detail-modal__divider--bottom {
  background-image: url("../../images/vp/about/point-deco.png");
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 310px auto;
}
@media (min-width: 768px) {
  .vp-about-detail-modal__divider--bottom {
    background-image: url("../../images/vp/about/point-deco-pc.png");
    background-size: 664px auto;
    width: auto;
  }
}
.vp-about-detail-modal__divider--bottom::before {
  content: none;
}
.vp-about-detail-modal__divider-text {
  position: absolute;
  left: 50%;
  top: 16px;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 3px 6px 0 6px;
  color: var(--color-accent03);
  text-align: center;
  font-family: var(--font-family-en);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.36px;
  background: var(--color-graphic01);
  z-index: 1;
}
.vp-about-detail-modal {
  /* ===========================================
  limited
  =========================================== */
}
.vp-about-detail-modal__limited {
  background: var(--color-white);
  border-radius: 8px;
  margin-top: 32px;
}
.vp-about-detail-modal__limited-label {
  color: var(--color-gray01);
  font-size: 12px;
  font-weight: var(--font-weight-bold);
  display: flex;
  padding: 8px;
  justify-content: center;
  align-items: center;
  border-bottom: 1px solid var(--color-gray03);
}
@media (min-width: 768px) {
  .vp-about-detail-modal__limited-label {
    font-size: 14px;
  }
}
.vp-about-detail-modal__limited-body {
  display: flex;
  flex-direction: column;
  padding: 20px;
  gap: 8px;
}
.vp-about-detail-modal__limited-header {
  display: flex;
  align-items: center;
  gap: 20px;
}
.vp-about-detail-modal__limited-icon {
  flex: 0 0 64px;
  width: 64px;
  height: 64px;
  border-radius: 100px;
  overflow: hidden;
}
.vp-about-detail-modal__limited-icon img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: contain;
     object-fit: contain;
}
.vp-about-detail-modal__limited-title {
  color: var(--color-black);
  font-size: 14px;
  font-weight: var(--font-weight-bold);
}
@media (min-width: 768px) {
  .vp-about-detail-modal__limited-title {
    font-size: 20px;
  }
}
.vp-about-detail-modal__limited-text {
  color: var(--color-gray01);
  font-size: 14px;
  font-weight: var(--font-weight-regular);
}
@media (min-width: 768px) {
  .vp-about-detail-modal__limited-text {
    font-size: 16px;
  }
}
.vp-about-detail-modal__note {
  color: var(--color-gray01);
  font-size: 12px;
  margin-top: 16px;
}

.vp-about-heading-lv1 {
  color: var(--color-text-accent);
  margin-bottom: var(--space-32);
  text-align: center;
}
@media (min-width: 768px) {
  .vp-about-heading-lv1 {
    margin-bottom: 48px;
  }
}
.vp-about-heading-lv1__text {
  margin-bottom: var(--space-12);
  font-family: var(--font-family-en);
  font-size: var(--font-size-heading-latin);
  font-weight: var(--font-weight-regular);
  letter-spacing: calc(var(--font-size-heading-latin) * 3 / 100);
}
.vp-about-heading-lv1__desc {
  display: block;
  font-size: 16px;
  font-weight: var(--font-weight-bold);
}
@media (min-width: 768px) {
  .vp-about-heading-lv1__desc {
    font-size: 24px;
  }
}

.vp-about-heading-lv2 {
  color: var(--color-text-accent);
  margin-bottom: var(--space-32);
}
@media (min-width: 768px) {
  .vp-about-heading-lv2 {
    margin-bottom: 48px;
  }
}
.vp-about-heading-lv2__text {
  margin-bottom: var(--space-12);
  font-family: var(--font-family-en);
  font-size: var(--font-size-heading-latin);
  font-weight: var(--font-weight-regular);
  letter-spacing: calc(var(--font-size-heading-latin) * 3 / 100);
}
.vp-about-heading-lv2__desc {
  display: block;
  font-size: 16px;
  font-weight: var(--font-weight-bold);
}
@media (min-width: 768px) {
  .vp-about-heading-lv2__desc {
    font-size: 24px;
  }
}

.vp-about-intro {
  position: relative;
}
.vp-about-intro .vp-about-heading-lv1 {
  padding-top: 222px;
}

.vp-about-middle {
  position: relative;
}

.vp-about-info .vp-about-heading-lv2 {
  position: relative;
  color: var(--color-black);
  margin-bottom: var(--space-64);
}
@media (min-width: 768px) {
  .vp-about-info .vp-about-heading-lv2 {
    max-width: 440px;
    margin: 0 auto 80px;
  }
}
.vp-about-info .vp-about-heading-lv2::before {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  width: 90px;
  height: 103px;
  top: -22px;
  right: -40px;
  background-image: url("../../images/vp/about/about-sparkle-right.svg");
}
.vp-about-info .vp-about-heading-lv2::after {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain;
  width: 112px;
  height: 125px;
  top: 60px;
  left: -50px;
  background-image: url("../../images/vp/about/about-sparkle-left.svg");
}
.vp-about-info .vp-about-heading-lv2__text {
  display: block;
  text-align: center;
  font-size: 20px;
  font-weight: var(--font-weight-bold);
}
@media (min-width: 768px) {
  .vp-about-info .vp-about-heading-lv2__text {
    font-size: 28px;
  }
}
.vp-about-info .vp-about-heading-lv2__desc {
  display: block;
  text-align: center;
  font-family: var(--font-family-en);
  font-size: 12px;
  letter-spacing: 0.36px;
  text-transform: uppercase;
  font-weight: var(--font-weight-regular);
  margin-bottom: 16px;
  color: var(--color-graphic03);
}
body.is-about-bg03 .vp-about-info .vp-about-heading-lv2 {
  color: var(--color-white);
}
body.is-about-bg03 .vp-about-info .vp-about-heading-lv2__desc {
  color: var(--color-white);
}

.vp-about-bottom {
  position: relative;
}
@media (min-width: 768px) {
  .vp-about-bottom {
    display: flex;
    justify-content: center;
  }
  .vp-about-bottom .vp-about-step,
  .vp-about-bottom .vp-about-qa {
    flex: 1;
  }
}

/* ===========================================
  背景画像
=========================================== */
.vp-bg-about {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}
.vp-bg-about__layer, .vp-bg-about__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.vp-bg-about__layer {
  position: absolute;
  inset: 0;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  opacity: 0;
  transition: opacity 700ms ease;
  will-change: opacity;
}
@media (min-width: 768px) {
  .vp-bg-about__layer {
    background-position: center;
  }
}
.vp-bg-about__layer--a {
  opacity: 1;
}
.vp-bg-about__overlay {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 700ms ease;
  will-change: opacity;
  background-repeat: no-repeat;
}
.vp-bg-about__layer--bg01 {
  background-image: url("../../images/vp/about/bg_about_01_sp.jpg");
}
@media (min-width: 768px) {
  .vp-bg-about__layer--bg01 {
    background-image: url("../../images/vp/about/bg_about_01_pc.jpg");
  }
}
.vp-bg-about__layer--bg02 {
  background-image: url("../../images/vp/about/bg_about_02_sp.jpg");
}
@media (min-width: 768px) {
  .vp-bg-about__layer--bg02 {
    background-image: url("../../images/vp/about/bg_about_02_pc.jpg");
  }
}
.vp-bg-about__layer--bg03 {
  background-image: url("../../images/vp/about/bg_about_03_sp.jpg");
}
@media (min-width: 768px) {
  .vp-bg-about__layer--bg03 {
    background-image: url("../../images/vp/about/bg_about_03_pc.jpg");
  }
}
.vp-bg-about__overlay--bg01 {
  background: linear-gradient(180deg, rgba(199, 232, 250, 0) 0%, rgba(199, 232, 250, 0) 50%, rgba(199, 232, 250, 0.9) 100%);
}
@media (min-width: 768px) {
  .vp-bg-about__overlay--bg01 {
    background: linear-gradient(180deg, rgba(199, 232, 250, 0) 0%, rgba(199, 232, 250, 0) 70%, rgba(199, 232, 250, 0.9) 100%);
  }
}
.vp-bg-about__overlay--bg02 {
  background: rgba(199, 232, 250, 0.9);
}
.vp-bg-about__overlay--bg03 {
  background: rgba(0, 154, 219, 0.8);
}

/* ===========================================
  ふわっと表示
=========================================== */
.vp-main .js-vp-animate-item {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 700ms ease, transform 700ms ease;
  will-change: opacity, transform;
}
.vp-main .js-vp-animate-item.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ===========================================
  CMS対応 : パンくずが背景画像で見えなくなるので調整
=========================================== */
body.vp-body--about #headerArea {
  background: var(--color-white);
  position: fixed;
  z-index: 100;
}
@media (min-width: 768px) {
  body.vp-body--about #headerArea {
    position: relative;
  }
}
body.vp-body--about .breadcrumbs {
  padding-top: 10px;
  padding-bottom: 10px;
  margin-top: 0;
  margin-bottom: 0;
}
body.vp-body--about .pbPage {
  margin-top: 84px;
}
body.vp-body--about #footerArea {
  position: relative;
  background: var(--color-white);
}