@charset "UTF-8";
.material-layers[data-v-d8a58022] {
  position: relative;
  width: 80%;
  margin: 0 auto;
}
.material-layers .layer[data-v-d8a58022] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}

/* PCレイアウト: 961px以上 ( >960 ) */
@media (min-width: 961px) {
.material-layers[data-v-d8a58022] {
    max-width: 70vh;
}
}
.acc-splide-wrapper[data-v-22bdbb5b] {
  width: 100%;
  padding: 0 10px;
}
.acc-item[data-v-22bdbb5b] {
  width: 100%;
  padding: 0;
  border: none;
  background: #fff;
  cursor: pointer;
}
.acc-item img[data-v-22bdbb5b] {
  width: 100%;
  /* aspect-ratio: 1/1; */
  object-fit: contain;
  border-radius: 8px;
}
.acc-item .label[data-v-22bdbb5b] {
  display: block;
  width: 100%;
  font-size: 1.3rem;
  text-align: left;
  font-weight: 500;
  margin-top: 5px;
}

/* No-image プレースホルダ（高さ固定でレイアウト揺れ防止） */
.no-image-holder[data-v-22bdbb5b] {
  width: 100%;
  height: 18px;
  display: flex;
  align-items: flex-end; /* 上寄せ */
  justify-content: center;
}
.no-image-inline[data-v-22bdbb5b] {
  height: 100%;
  display: flex;
  justify-content: center;
  pointer-events: none;
  will-change: opacity;
  pointer-events: none;
  position: relative;
  z-index: 100;
  transform: translateY(2px);
}
.no-image-inline img[data-v-22bdbb5b] {
  width: 100%;
  height: auto;
}

/* サムネイル領域と選択オーバーレイ */
.acc-item .thumb[data-v-22bdbb5b] {
  position: relative;
  width: 100%;
}
.acc-item .thumb img[data-v-22bdbb5b] {
  /* position: absolute; */
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  /* padding: 4px; */
}
.acc-item .thumb[data-v-22bdbb5b]::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  /* transition: background 0.25s; */
}
.acc-item.on .thumb[data-v-22bdbb5b]::after {
  background: rgba(0, 0, 0, 0.45) url("data:image/svg+xml,%3csvg%20width='50'%20height='50'%20viewBox='0%200%2050%2050'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3ccircle%20cx='25'%20cy='25'%20r='24.5'%20fill='%23003399'%20stroke='white'/%3e%3cpath%20d='M35.8662%2017.7271L21.9229%2034.8882L13.4668%2022.0132L16.8105%2019.8169L22.2656%2028.1226L32.7617%2015.2056L35.8662%2017.7271Z'%20fill='white'/%3e%3c/svg%3e") center center/32% no-repeat;
}
.acc-modal[data-v-22bdbb5b] {
  border: none;
  cursor: pointer;
  padding: 4px;
  margin-top: 4px;
  width: 26px;
  background-color: transparent;
}

/* Accessory Package ボタン */
/* SplideSlide が生成する実DOM（.splide__slide）へ scoped が当たりにくいので :deep() */
[data-v-22bdbb5b] .splide__slide.acc-slide-package {
  display: flex;
  flex-direction: column;
  padding-right: 30px;
}

/* packageスライドと通常スライドの間だけ gap を 2倍にする（次スライド側に追加余白） */
[data-v-22bdbb5b] .splide__slide.acc-slide-package + .splide__slide {
  position: relative;
  overflow: visible;
  contain: none;
}

/* 2倍になった隙間の中央（= 元の gap 位置）に縦線 */
[data-v-22bdbb5b] .splide__slide.acc-slide-package + .splide__slide::before {
  content: "";
  position: absolute;
  top: var(--pkg-border-top, 0px);
  height: var(--pkg-border-height, 100%);
  left: -12px;
  width: 1px;
  background: #ccc;
  z-index: 10;
  pointer-events: none;
}
.acc-package-btn[data-v-22bdbb5b] {
  position: relative;
  width: 100%;
  padding: 0;
  border: none;
  border-radius: 8px;
  background: url(./assets/thumbnail/btn-packages.png) center center/cover no-repeat;
  cursor: pointer;
  font-size: 1rem;
  font-weight: bold;
  text-align: center;
  color: #fff;
}

/* 正方形の比率を確実に固定 */
.acc-package-btn[data-v-22bdbb5b]::before {
  content: "";
  display: block;
  padding-top: 100%;
}
.acc-package-btn__inner[data-v-22bdbb5b] {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 12px 8px;
  box-sizing: border-box;
}
.acc-package-btn span[data-v-22bdbb5b] {
  display: block;
  max-width: 100%;
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
  text-align: center;
  line-height: 1.15;
  font-size: 1.3rem;
  font-weight: 500;
  color: #fff;
}

/* Splide の内部生成要素は scoped ではそのまま当たらないので :deep() を使用 */
/* ラッパを相対化 */
.acc-splide-wrapper[data-v-22bdbb5b] {
  position: relative;
  margin-top: -12px;
}

/* スライダー左右に矢印用パディングを確保 */
/* 矢印コンテナ */
[data-v-22bdbb5b] .acc-splide > .splide__arrows {
  position: absolute !important;
  inset: 0;
  pointer-events: none;
}
[data-v-22bdbb5b] .acc-splide {
  padding: 0 30px;
}

/* 矢印 */
[data-v-22bdbb5b] .splide__arrow {
  width: 24px;
  height: 24px;
  position: absolute !important;
  top: 22%;
  transform: translateX(0);
  pointer-events: auto;
  cursor: pointer;
  background: #fff center center/contain no-repeat;
  opacity: 1;
}
[data-v-22bdbb5b] .splide__arrow svg {
  display: none;
}
[data-v-22bdbb5b] .splide__arrow--prev {
  left: 0;
  background-image: url("data:image/svg+xml,%3csvg%20width='44'%20height='44'%20viewBox='0%200%2044%2044'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M22.01%200C34.1603%200%2044.01%209.84974%2044.01%2022C44.01%2034.1503%2034.1603%2044%2022.01%2044C9.85975%2044%200.0100098%2034.1503%200.0100098%2022C0.0100098%209.84974%209.85975%200%2022.01%200ZM11.7395%2022.5068L24.6506%2035.418L28.1858%2031.8818L18.8098%2022.5059L28.1858%2013.1309L24.6506%209.5957L11.7395%2022.5068Z'%20fill='%23191919'/%3e%3c/svg%3e");
}
[data-v-22bdbb5b] .splide__arrow--next {
  right: 0;
  background-image: url("data:image/svg+xml,%3csvg%20width='44'%20height='44'%20viewBox='0%200%2044%2044'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M22.01%200C9.85975%200%200.0100098%209.84974%200.0100098%2022C0.0100098%2034.1503%209.85975%2044%2022.01%2044C34.1603%2044%2044.01%2034.1503%2044.01%2022C44.01%209.84974%2034.1603%200%2022.01%200ZM32.2805%2022.5068L19.3694%2035.418L15.8342%2031.8818L25.2102%2022.5059L15.8342%2013.1309L19.3694%209.5957L32.2805%2022.5068Z'%20fill='%23191919'/%3e%3c/svg%3e");
}

/* disabled 時 */
[data-v-22bdbb5b] .splide__arrow:disabled {
  display: none;
}

/* トラック余白微調整 */
[data-v-22bdbb5b] .splide__track {
  overflow: hidden; /* iOS Safari で隣接スライドが一瞬見えるのを防止 */
  contain: layout paint; /* 再レイアウト波及を抑制 */
}

/* スライド数が少なくカルーセルにならないときは中央寄せ */
[data-v-22bdbb5b] .acc-splide.is-centered .splide__list {
  justify-content: center !important;
}

/* ページネーション（ドット） */
/* カスタムドット (スライド数分) */
.custom-dots[data-v-22bdbb5b] {
  margin-top: 4px;
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  justify-content: space-evenly;
}
.custom-dots .dot[data-v-22bdbb5b] {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #cfd2d5;
  border: none;
  padding: 0;
  cursor: pointer;
}
.custom-dots .dot.active[data-v-22bdbb5b] {
  background: #191919;
}

/* No Image per-slide overlay */
.acc-slide[data-v-22bdbb5b] {
  position: relative;
  overflow: visible; /* track 側で隠すのでスライド自体は可視 */
  contain: content; /* iOS の再描画最適化 */
  will-change: opacity; /* 最低限の最適化 */
}
.fade-enter-active[data-v-22bdbb5b],
.fade-leave-active[data-v-22bdbb5b] {
  transition: opacity 0.4s;
}
.fade-enter-from[data-v-22bdbb5b],
.fade-leave-to[data-v-22bdbb5b] {
  opacity: 0;
}

/* 注意書き */
.simulator-note[data-v-22bdbb5b] {
  margin-top: 28px;
  font-size: 1.3rem;
  line-height: 1.2;
  padding: 0 10px;
}

/* PCレイアウト: 961px以上 ( >960 ) */
@media (min-width: 961px) {
.acc-splide-wrapper[data-v-22bdbb5b] {
    padding: 0 25px;
    margin-top: -20px;
}
[data-v-22bdbb5b] .acc-splide {
    padding: 0 70px;
    max-width: 1280px;
    margin: 0 auto;
}
.acc-item .label[data-v-22bdbb5b] {
    font-size: 2rem;
}
[data-v-22bdbb5b] .splide__arrow {
    width: 44px;
    height: 44px;
    top: 64px;
}
[data-v-22bdbb5b] .splide__arrow:hover:not(:disabled) {
    opacity: 0.8;
}
.no-image-holder[data-v-22bdbb5b] {
    height: 34px;
}
.no-image-inline[data-v-22bdbb5b] {
    transform: translateY(2px);
}
.acc-modal[data-v-22bdbb5b] {
    width: 36px;
    padding: 6px;
}
.acc-package-btn[data-v-22bdbb5b] {
    padding: 0;
}
.acc-package-btn__inner[data-v-22bdbb5b] {
    padding: 0;
}
.acc-package-btn span[data-v-22bdbb5b] {
    font-size: 2.4rem;
    line-height: 1.1;
}
  /* PC時の gap(60px) に +60px して、この区間だけ 2倍(120px) */
[data-v-22bdbb5b] .splide__slide.acc-slide-package + .splide__slide {
    overflow: visible;
    contain: none;
}
[data-v-22bdbb5b] .splide__slide.acc-slide-package + .splide__slide::before {
    left: -35px;
    z-index: 10;
}
.custom-dots[data-v-22bdbb5b] {
    gap: 16px;
    justify-content: center;
    margin-top: 40px;
}
.custom-dots .dot[data-v-22bdbb5b] {
    width: 15px;
    height: 15px;
}
.simulator-note[data-v-22bdbb5b] {
    font-size: 1.4rem;
    margin-top: 44px;
    padding: 0 25px;
}
}
@media (min-width: 961px) and (max-width: 1280px) {
.acc-package-btn span[data-v-22bdbb5b] {
    font-size: 1.8rem;
}
}
.style-splide-wrapper[data-v-1b5e012e] {
  width: 100%;
  padding: 0 10px;
  position: relative;
  margin-top: 6px;
}
.style-item[data-v-1b5e012e] {
  width: 100%;
  padding: 0;
  border: none;
  background: #fff;
  cursor: pointer;
  text-align: left;
}
.style-item .thumb img[data-v-1b5e012e] {
  width: 100%;
  height: auto;
  object-fit: contain;
  border-radius: 8px;
}
.style-item .label[data-v-1b5e012e] {
  display: block;
  width: 100%;
  font-size: 1.3rem;
  text-align: left;
  font-weight: 500;
  margin-top: 5px;
}

/* arrows */
[data-v-1b5e012e] .style-splide {
  padding: 0 30px;
}
[data-v-1b5e012e] .style-splide > .splide__arrows {
  position: absolute !important;
  inset: 0;
  pointer-events: none;
}
[data-v-1b5e012e] .style-splide .splide__arrow {
  width: 24px;
  height: 24px;
  position: absolute !important;
  top: 18%;
  pointer-events: auto;
  cursor: pointer;
  background: #fff center center/contain no-repeat;
  opacity: 1;
  transform: translateY(0);
}
[data-v-1b5e012e] .style-splide .splide__arrow svg {
  display: none;
}
[data-v-1b5e012e] .style-splide .splide__arrow--prev {
  left: 0;
  background-image: url("data:image/svg+xml,%3csvg%20width='44'%20height='44'%20viewBox='0%200%2044%2044'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M22.01%200C34.1603%200%2044.01%209.84974%2044.01%2022C44.01%2034.1503%2034.1603%2044%2022.01%2044C9.85975%2044%200.0100098%2034.1503%200.0100098%2022C0.0100098%209.84974%209.85975%200%2022.01%200ZM11.7395%2022.5068L24.6506%2035.418L28.1858%2031.8818L18.8098%2022.5059L28.1858%2013.1309L24.6506%209.5957L11.7395%2022.5068Z'%20fill='%23191919'/%3e%3c/svg%3e");
}
[data-v-1b5e012e] .style-splide .splide__arrow--next {
  right: 0;
  background-image: url("data:image/svg+xml,%3csvg%20width='44'%20height='44'%20viewBox='0%200%2044%2044'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M22.01%200C9.85975%200%200.0100098%209.84974%200.0100098%2022C0.0100098%2034.1503%209.85975%2044%2022.01%2044C34.1603%2044%2044.01%2034.1503%2044.01%2022C44.01%209.84974%2034.1603%200%2022.01%200ZM32.2805%2022.5068L19.3694%2035.418L15.8342%2031.8818L25.2102%2022.5059L15.8342%2013.1309L19.3694%209.5957L32.2805%2022.5068Z'%20fill='%23191919'/%3e%3c/svg%3e");
}
[data-v-1b5e012e] .style-splide .splide__arrow:disabled {
  display: none;
}
[data-v-1b5e012e] .style-splide .splide__track {
  overflow: hidden;
  contain: layout paint;
}

/* 4枚未満（非カルーセル）は中央揃え */
.style-static[data-v-1b5e012e] {
  display: flex;
  justify-content: center;
  gap: 16px;
  padding: 0 30px; /* 矢印相当の左右余白 */
}
.style-static-cell[data-v-1b5e012e] {
  flex: 0 0 calc((100% - 48px) / 4);
}
@media (max-width: 750px) {
.style-static[data-v-1b5e012e] {
    padding: 0 30px;
}
.style-static-cell[data-v-1b5e012e] {
    flex-basis: calc((100% - 32px) / 3);
}
}
.custom-dots[data-v-1b5e012e] {
  margin-top: 4px;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: center;
}
.custom-dots .dot[data-v-1b5e012e] {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #cfd2d5;
  border: none;
  padding: 0;
  cursor: pointer;
}
.custom-dots .dot.active[data-v-1b5e012e] {
  background: #191919;
}
.wrap-title[data-v-bcb682cf] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #191919;
  padding: 0;
}
.wrap-title h2[data-v-bcb682cf] {
  font-size: 2rem;
  font-weight: 700;
  color: #fff;
}
.wrap-title .acc-toggle[data-v-bcb682cf] {
  background: transparent;
  color: #fff;
  border: none;
  font-size: 1.4rem;
  font-weight: 600;
  cursor: pointer;
  padding: 6px 10px 6px 30px;
  position: relative;
  flex: 1;
  text-align: left;
}
.wrap-title .acc-toggle[data-v-bcb682cf]::before {
  content: "";
  position: absolute;
  left: 14px;
  top: 50%;
  width: 6px;
  height: 6px;
  transform: translateY(calc(-50% - 2px)) rotate(-45deg);
  border-left: 3px solid #fff;
  border-bottom: 3px solid #fff;
}
.wrap-title .acc-toggle.accordionActive[data-v-bcb682cf]::before {
  transform: translateY(calc(-50% + 2px)) rotate(135deg);
}
.wrap-title .clear-icon-btn[data-v-bcb682cf] {
  padding: 6px 10px;
  line-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: transparent;
  border: none;
  cursor: pointer;
}
.wrap-title .clear-icon-btn img[data-v-bcb682cf] {
  width: 100%;
  height: 20px;
  display: block;
  object-fit: contain;
}
.selected-accessories-block[data-v-bcb682cf] {
  display: flex;
  flex-direction: column;
  background: #f2f2f2;
  height: 100%;
  min-height: 0; /* 親に合わせて縮む/伸びる */
}
.wrap-list[data-v-bcb682cf] {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
}
.wrap-list .selected-list[data-v-bcb682cf] {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 122px;
  overflow-y: auto; /* CSSのみでスクロール制御 */
}
.wrap-list .selected-list li[data-v-bcb682cf] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  background: #f2f2f2;
  padding: 4px 16px;
}
.wrap-list .selected-list li[data-v-bcb682cf]:not(:first-child) {
  border-top: 1px solid #ccc;
}
.wrap-list .selected-list li > span[data-v-bcb682cf] {
  font-size: 1.8rem;
  font-weight: 500;
}
.wrap-list .actions button[data-v-bcb682cf] {
  color: #fff;
  padding: 8px 40px 8px 16px;
  background: #191919;
  border: none;
  cursor: pointer;
  font-size: 1.6rem;
  font-weight: 500;
  width: 100%;
  position: relative;
}
.wrap-list .actions button.has-icon[data-v-bcb682cf] {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.wrap-list .actions button[data-v-bcb682cf]::after {
  content: "";
  position: absolute;
  right: 16px;
  top: 50%;
  width: 10px;
  height: 10px;
  border-right: 1.6px solid #fff;
  border-top: 1.6px solid #fff;
  transform: translateY(-50%) rotate(45deg);
  pointer-events: none;
}
.wrap-list .actions button .btn-icon[data-v-bcb682cf] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}
.wrap-list .actions button .btn-icon img[data-v-bcb682cf] {
  width: 22px;
  height: 22px;
  display: block;
  object-fit: contain;
}
.wrap-list .actions button .btn-label[data-v-bcb682cf] {
  display: inline-block;
  font-weight: 500;
}
.remove-btn[data-v-bcb682cf] {
  background: transparent;
  color: #000;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 3.2rem;
  line-height: 1;
}
[data-cmnjs-accordion-area][data-v-bcb682cf]:not(.accordionActive) {
  display: none;
}
@media (min-width: 961px) {
.wrap-title[data-v-bcb682cf] {
    padding: 8px 16px;
}
.wrap-title .acc-toggle[data-v-bcb682cf] {
    font-size: 1.8rem;
}
.wrap-title .clear-icon-btn[data-v-bcb682cf] {
    padding: 0;
}
.wrap-title .clear-icon-btn img[data-v-bcb682cf] {
    height: 23px;
}
.wrap-list .actions button[data-v-bcb682cf]::after {
    right: 20px;
}
}
dialog.basicmodal[data-v-60308272] {
  border: none;
  padding: 0;
  background: transparent;
  overflow-x: visible;
  overflow-y: auto;
  max-width: 800px;
  width: calc(100% - 20px);
}
/* is-ready になるまでは backdrop と中身を不可視にして一括表示 */
dialog.basicmodal[data-v-60308272]:not(.is-ready) {
  visibility: hidden;
}
dialog.basicmodal[data-v-60308272]:not(.is-ready)::backdrop {
  background: transparent;
}
/* 初回フォーカス時などにブラウザ既定のフォーカスリングを表示しない */
dialog.basicmodal[data-v-60308272]:focus {
  outline: none;
}
/* フェードイン: 画像が準備できるまで中身を透明化 */
.basicmodal__content.is-loading[data-v-60308272] {
  opacity: 0;
}
.basicmodal__content.is-loaded[data-v-60308272] {
  opacity: 1;
}
/* キーボード操作開始後のみフォーカスリング表示 */
dialog.basicmodal[data-v-60308272]:not(.kbd-focus-visible) *:focus {
  outline: none !important;
  box-shadow: none !important;
}
dialog.basicmodal.kbd-focus-visible[data-v-60308272] *:focus-visible {
  outline: 2px solid #333;
  outline-offset: 2px;
}
dialog.basicmodal.is-ready[data-v-60308272]::backdrop {
  background: rgba(0, 0, 0, 0.5);
}
.basicmodal__inner[data-v-60308272] {
  margin: auto;
  background: #fff;
  overflow-y: auto;
  overflow: hidden;
  font-family: inherit;
}
.basicmodal__content[data-v-60308272] {
  padding: 24px 16px;
  position: relative;
}

/* Alert variant base spacing */
.variant-alert.basicmodal__content[data-v-60308272] {
  padding: 32px 24px;
}
.variant-alert[data-v-60308272] .modal-alert-icon {
  /* text-align: center; */
  margin: 0 auto;
  /* padding: 32px; */
  width: 52px;
  height: 52px;
}
.variant-alert[data-v-60308272] .modal-alert-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  /* display: inline-block; */
}
.variant-alert[data-v-60308272] .modal-title,
.variant-alert[data-v-60308272] .modal-subtitle {
  font-size: 1.7rem;
  font-weight: 700;
  margin-top: 12px;
  margin-bottom: 0;
}
.variant-alert[data-v-60308272] .modal-list > li {
  font-size: 1.7rem;
  font-weight: 700;
  /* margin: 4px 0 0; */
  list-style: square;
}
.variant-alert[data-v-60308272] .modal-list > li {
&:first-child {
    margin-top: 4px;
}
}
.variant-alert[data-v-60308272] .modal-actions {
  display: flex;
  gap: 16px;
  justify-content: center;
  margin-top: 32px;
}

/* Button styles (previously misplaced in script) */
[data-v-60308272] .btn {
  cursor: pointer;
  padding: 6px;
  font-size: 1.6rem;
  font-weight: 500;
  border: 1px solid $color-text;
  font-family: inherit;
  background: $color-white;
  transition: background 0.2s, color 0.2s;
  width: 120px;
}
[data-v-60308272] .btn-primary {
  background: $color-text;
  color: $color-white;
}
.basicmodal__close[data-v-60308272] {
  position: absolute;
  top: 8px;
  right: 8px;
  background: none;
  border: none;
  cursor: pointer;
}
.basicmodal__title[data-v-60308272] {
  font-size: 1.25rem;
  margin: 0 0 0.75rem;
}
.basicmodal__text[data-v-60308272] {
  margin: 0 0 1rem;
  line-height: 1.5;
}
.detail-options[data-v-60308272] {
  display: flex;
  gap: 0.75rem;
}
.detail-option[data-v-60308272] {
  background: #f5f5f5;
  border: 1px solid #ddd;
  border-radius: 6px;
  padding: 0.75rem;
  cursor: pointer;
}
.detail-option[data-selected][data-v-60308272] {
  outline: 2px solid #007aff;
}
.detail-option__icon img[data-v-60308272] {
  display: block;
  width: 40px;
  height: 40px;
  object-fit: contain;
}
.acc-parts--plain[data-v-60308272] {
  white-space: pre-line;
}
.acc-relations[data-v-60308272] {
  margin-top: 16px;
}
.acc-relations .rel-block[data-v-60308272] {
  background-color: #f2f2f2;
  padding: 8px 16px;
}
.acc-relations .rel-block + .rel-block[data-v-60308272] {
  margin-top: 12px;
}
.acc-relations .rel-title[data-v-60308272] {
  /* font-weight: 600; */
  font-size: 1.7rem;
  margin: 0 0 4px;
}
.acc-relations .rel-list[data-v-60308272] {
  list-style: disc;
  padding-left: 20px;
  margin: 0;
}
.acc-relations .rel-list li[data-v-60308272] {
  line-height: 1.2;
  margin: 2px 0;
  font-size: 1.7rem;
  list-style: square;
}
.acc-label[data-v-60308272] {
  font-size: 2rem;
  font-weight: 700;
  margin-top: 8px;
}
/* relation blocks two-column (icon + body) */
.acc-relations .rel-block[data-v-60308272] {
  display: flex;
  align-items: center;
  gap: 16px;
}
.acc-relations .rel-block.rel-vertical[data-v-60308272] {
  /* flex-direction: column; */
  align-items: center;
}
.acc-relations .rel-block.rel-vertical .rel-icon[data-v-60308272] {
  flex: 0 0 auto;
}
.acc-relations .rel-block.rel-vertical .rel-body[data-v-60308272] {
  width: 100%;
}
.acc-relations .rel-block .rel-icon[data-v-60308272] {
  flex: 0 0 24px;
  line-height: 0;
  padding-top: 2px;
}
.acc-relations .rel-block .rel-icon img[data-v-60308272] {
  width: 24px;
  height: 24px;
  display: block;
}
.acc-relations .rel-block .rel-body[data-v-60308272] {
  flex: 1 1 auto;
  min-width: 0;
}
.basicmodal__footer[data-v-60308272] {
  text-align: center;
  margin-top: 32px;
}
.acc-parts[data-v-60308272] {
  font-size: 1.7rem;
  line-height: 1.2;
  margin-top: 24px;
  /* font-weight: 300; */
}

/* PC レイアウト (幅基準で 961px~ を想定) */
@media (min-width: 961px) {
dialog.basicmodal[data-v-60308272] {
    max-width: 980px;
    width: calc(100% - 20px);
}
  /* .basicmodal__inner {
  } */
.basicmodal__content[data-v-60308272] {
    padding: 32px;
}
.basicmodal__accessory.two-col[data-v-60308272] {
    display: flex;
    gap: 26px;
    align-items: flex-start;
}
.basicmodal__accessory.two-col .acc-thumb[data-v-60308272] {
    flex: 0 0 416px;
}
.basicmodal__accessory.two-col .acc-thumb img[data-v-60308272] {
    width: 100%;
    height: auto;
    display: block;
}
.basicmodal__accessory.two-col .acc-desc[data-v-60308272] {
    flex: 1 1 auto;
}
  /* 画像 + 情報 + 依存関係 を横並びの右側縦積みにまとめるため wrapper 化 */
.basicmodal__layout[data-v-60308272] {
    display: flex;
    gap: 32px;
    align-items: flex-start;
}
.basicmodal__layoutCol[data-v-60308272] {
    flex: 1 1 auto;
    min-width: 0;
}
.acc-relations[data-v-60308272] {
    margin-top: 20px; /* gap 調整のみ (grid は共通定義で適用済) */
}
.acc-relations .rel-block .rel-icon[data-v-60308272] {
    flex-basis: 36px;
}
.acc-relations .rel-block .rel-icon img[data-v-60308272] {
    width: 36px;
    height: 36px;
}
.acc-relations[data-v-60308272] {
    column-gap: 28px;
    row-gap: 24px;
}
.acc-relations .rel-list li[data-v-60308272] {
    line-height: 1.35;
    font-size: 1.8rem;
    /* margin-left: 8px; */
}
.acc-label[data-v-60308272] {
    margin-top: 0;
    font-size: 2.6rem;
}
.acc-parts[data-v-60308272] {
    font-size: 1.8rem;
    line-height: 1.35;
}
.variant-alert.basicmodal__content[data-v-60308272] {
    padding: 32px 192px;
}
.variant-alert[data-v-60308272] .modal-alert-icon {
    margin: 0;
}
.variant-alert[data-v-60308272] .modal-title,
  .variant-alert[data-v-60308272] .modal-subtitle {
    font-size: 2rem;
}
.variant-alert[data-v-60308272] .modal-list > li {
    font-size: 2rem;
}
[data-v-60308272] .btn {
    font-size: 1.8rem;
}
}
@media (max-width: 960px) and (orientation: landscape) {
.basicmodal__accessory.two-col[data-v-60308272] {
    display: flex;
    gap: 26px;
    align-items: flex-start;
}
.basicmodal__accessory.two-col .acc-thumb[data-v-60308272] {
    flex: 0 0 45%;
}
}

.style-selection-list-modal[data-v-d77fe1c3] {
  position: fixed;
  inset: 0;
  max-height: 90vh;
  margin: auto;
  border: none;
  padding: 0;
  background: #fff;
}
.style-selection-list-modal[data-v-d77fe1c3]::backdrop {
  background-color: rgba(0, 0, 0, 0.5);
}
.style-selection-list-modal[data-v-d77fe1c3]:not(.is-ready) {
  visibility: hidden;
}
.style-selection-list-modal[data-v-d77fe1c3]:not(.is-ready)::backdrop {
  background: transparent;
}

/* キーボード操作開始後のみフォーカスリング表示 */
.style-selection-list-modal[data-v-d77fe1c3]:not(.kbd-focus-visible) *:focus {
  outline: none !important;
  box-shadow: none !important;
}
.style-selection-list-modal.kbd-focus-visible[data-v-d77fe1c3] *:focus-visible {
  outline: 2px solid #333;
  outline-offset: 2px;
}
.style-selection-list-modal[data-v-d77fe1c3]:focus {
  outline: none;
}
.modal-content[data-v-d77fe1c3] {
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 32px;
}
.modal-header[data-v-d77fe1c3] {
  text-align: center;
}
.modal-title[data-v-d77fe1c3] {
  margin: 0;
  font-size: 2.6rem;
  font-weight: bold;
}
.modal-body[data-v-d77fe1c3] {
  flex: 1 1 auto;
  -webkit-overflow-scrolling: touch;
  margin-top: 24px;
}
.no-packages[data-v-d77fe1c3] {
  text-align: center;
  padding: 40px 20px;
  color: #999;
  font-size: 1.4rem;
}
.packages-grid[data-v-d77fe1c3] {
  display: flex;
  justify-content: center;
}
.package-card[data-v-d77fe1c3] {
  display: flex;
}
.package-btn[data-v-d77fe1c3] {
  width: 100%;
  padding: 16px;
  border: 3px solid transparent;
  background: #f2f2f2;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 12px;
  text-align: left;
  position: relative;
  overflow: visible;
  padding-bottom: 48px;
}

/* 下端中央の "Select" ラベル（半分下にずらして外側に配置） */
.package-btn[data-v-d77fe1c3]::after {
  content: var(--select-label, "SELECT");
  position: absolute;
  left: 50%;
  bottom: -18px;
  transform: translateX(-50%);
  width: 120px;
  box-sizing: border-box;
  padding: 6px;
  text-align: center;
  background: #262626;
  color: #fff;
  font-size: 1.6rem;
  font-weight: 500;
  pointer-events: auto;
}
.package-btn[data-v-d77fe1c3]:hover {
  opacity: 1 !important;
  border: 3px solid #033791;
}
.package-thumb[data-v-d77fe1c3] {
  width: 100%;
  overflow: hidden;
}
.package-thumb img[data-v-d77fe1c3] {
  width: 100%;
  height: auto;
}
.package-name[data-v-d77fe1c3] {
  margin: 0;
  font-size: 1.8rem;
  font-weight: bold;
}
.package-sub-name[data-v-d77fe1c3] {
  margin: 0;
  font-size: 1.8rem;
  color: #666;
}
.package-items[data-v-d77fe1c3] {
  margin: 0;
  font-size: 1.8rem;
  color: #666;
}
.package-items ul[data-v-d77fe1c3] {
  list-style: square;
  margin-top: 12px;
  padding-left: 20px;
  display: flex;
  flex-direction: column;
}
.package-items li[data-v-d77fe1c3] {
  font-size: 1.8rem;
  color: #333;
}
.modal-footer[data-v-d77fe1c3] {
  text-align: center;
  margin-top: 64px;
  margin-bottom: 16px;
}
@media (min-width: 961px) {
.packages-grid[data-v-d77fe1c3] {
    gap: 24px;
}
.package-card[data-v-d77fe1c3] {
    width: 268px;
}
.package-btn[data-v-d77fe1c3] {
    padding: 16px 16px 52px;
}
.package-btn[data-v-d77fe1c3]:hover:after {
    background-color: #033791;
}
}
.style-selection-modal[data-v-86eb94ac] {
  position: fixed;
  inset: 0;
  max-height: 90vh;
  margin: auto;
  border: none;
  padding: 0;
  background: #fff;
  max-width: 800px;
  width: calc(100% - 20px);
}
.style-selection-modal[data-v-86eb94ac]::backdrop {
  background-color: rgba(0, 0, 0, 0.5);
}
.style-selection-modal[data-v-86eb94ac]:not(.is-ready) {
  visibility: hidden;
}
.style-selection-modal[data-v-86eb94ac]:not(.is-ready)::backdrop {
  background: transparent;
}

/* キーボード操作開始後のみフォーカスリング表示 */
.style-selection-modal[data-v-86eb94ac]:not(.kbd-focus-visible) *:focus {
  outline: none !important;
  box-shadow: none !important;
}
.style-selection-modal.kbd-focus-visible[data-v-86eb94ac] *:focus-visible {
  outline: 2px solid #333;
  outline-offset: 2px;
}
.style-selection-modal[data-v-86eb94ac]:focus {
  outline: none;
}
.modal-content[data-v-86eb94ac] {
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 16px;
  background-color: #f2f2f2;
}
.modal-header[data-v-86eb94ac] {
  display: none;
  text-align: center;
}
.modal-title[data-v-86eb94ac] {
  margin: 0;
  font-size: 2.6rem;
  font-weight: bold;
}
.modal-body[data-v-86eb94ac] {
  flex: 1 1 auto;
  min-height: 0;
  -webkit-overflow-scrolling: touch;
  margin-top: 0;
}
.no-packages[data-v-86eb94ac] {
  text-align: center;
  padding: 40px 20px;
  color: #999;
  font-size: 1.4rem;
}
.packages-grid[data-v-86eb94ac] {
  display: flex;
  justify-content: center;
}
.package-card[data-v-86eb94ac] {
  display: flex;
  width: 100%;
}
.package-btn[data-v-86eb94ac] {
  width: 100%;
  padding: 16px 16px 48px;
  border: none;
  background-color: #fff;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 12px;
  text-align: left;
  position: relative;
  overflow: visible;
}

/* 下端中央の "Select" ラベル（半分下にずらして外側に配置） */
.package-btn[data-v-86eb94ac]::after {
  content: var(--select-label, "SELECT");
  position: absolute;
  left: 50%;
  bottom: -18px;
  transform: translateX(-50%);
  width: 120px;
  box-sizing: border-box;
  padding: 6px;
  text-align: center;
  background: #262626;
  color: #fff;
  font-size: 1.6rem;
  font-weight: 500;
  pointer-events: auto;
}
.package-thumb[data-v-86eb94ac] {
  width: 100%;
  overflow: hidden;
}
.package-thumb img[data-v-86eb94ac] {
  width: 100%;
  height: auto;
}
.package-name[data-v-86eb94ac] {
  margin: 0;
  font-size: 1.8rem;
  font-weight: bold;
}
.package-sub-name[data-v-86eb94ac] {
  margin: 0;
  font-size: 1.8rem;
  color: #666;
}
.package-items[data-v-86eb94ac] {
  margin: 0;
  font-size: 1.8rem;
  color: #666;
}
.package-items ul[data-v-86eb94ac] {
  list-style: square;
  margin-top: 8px;
  padding-left: 20px;
  display: flex;
  flex-direction: column;
}
.package-items li[data-v-86eb94ac] {
  font-size: 1.8rem;
  color: #333;
}
.modal-footer[data-v-86eb94ac] {
  text-align: center;
  margin-top: 48px;
  margin-bottom: 16px;
}
@media (min-width: 961px) {
.modal-header[data-v-86eb94ac] {
    display: block;
}
.modal-body[data-v-86eb94ac] {
    margin-top: 20px;
}
.packages-grid[data-v-86eb94ac] {
    gap: 24px;
}
.package-card[data-v-86eb94ac] {
    width: 268px;
}
.package-btn[data-v-86eb94ac] {
    padding: 20px 20px 52px;
}
.package-btn[data-v-86eb94ac]:hover {
    opacity: 1 !important;
    box-shadow: 0 0 0 3px #033791;
}
}
header[data-v-87cd1ba4] {
  border-bottom: 1px solid #ccc;
  padding: 15px 10px;
}
header .header-container[data-v-87cd1ba4] {
  display: flex;
  align-items: center;
}
header .wrap-clear-btn[data-v-87cd1ba4] {
  margin-left: auto;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 4px;
  line-height: 0;
  cursor: pointer;
}
header .wrap-clear-btn img[data-v-87cd1ba4] {
  height: 32px;
  width: auto;
  display: block;
}
.header-title[data-v-87cd1ba4] {
  margin-left: 10px;
  font-weight: 700;
  font-size: 2rem;
  font-size: 1.36rem;
}
.logo-suzuki[data-v-87cd1ba4] {
  width: 96px;
}
.wrap-preview-pdf[data-v-87cd1ba4] {
  display: block;
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
}

/* SP: 表示順を「プレビュー → Accessory Selection → Selected Accessories」にする */
.display_area[data-v-87cd1ba4] {
  display: flex;
  flex-direction: column;
}

/* wrap-preview-pdf 自体を消し、子を main の flex item として並べ替える */
.display_area .wrap-preview-pdf[data-v-87cd1ba4] {
  display: contents;
}
.display_area .wrap-preview-pdf .wrap-preview[data-v-87cd1ba4] {
  order: 1;
}
.display_area .section-style-slider[data-v-87cd1ba4] {
  order: 2;
}
.display_area .section-slider[data-v-87cd1ba4] {
  order: 3;
}
.display_area .wrap-preview-pdf .wrap-pdf[data-v-87cd1ba4] {
  order: 4;
}
.display_area .simulator-note[data-v-87cd1ba4] {
  order: 5;
}
.simulator-note[data-v-87cd1ba4] {
  margin-top: 28px;
  font-size: 1.3rem;
  line-height: 1.2;
  padding: 0 10px;
}

/* スライダーセクション */
.section-slider[data-v-87cd1ba4] {
  margin-top: 12px;
}

/* SP: Style Selection セクション（Accessory Selection と同じ見た目） */
.section-style-slider[data-v-87cd1ba4] {
  margin-top: 6px;
}
.section-style-slider .section-title[data-v-87cd1ba4] {
  padding: 3px 10px;
  background: #191919;
}
.section-style-slider .section-title .section-title-inner[data-v-87cd1ba4] {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  max-width: 1280px;
  margin: 0 auto;
}
.section-style-slider .section-title .label-accessory-selection[data-v-87cd1ba4] {
  color: #fff;
  display: inline-block;
  font-size: 1.4rem;
  font-weight: 700;
  width: 100%;
}
.section-slider .section-title[data-v-87cd1ba4] {
  padding: 3px 10px;
  background: #191919;
}
.section-slider .section-title .section-title-inner[data-v-87cd1ba4] {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  max-width: 1280px;
  margin: 0 auto;
}
.section-slider .section-title .label-accessory-selection[data-v-87cd1ba4] {
  color: #fff;
  display: inline-block;
  font-size: 1.4rem;
  font-weight: 700;
  width: 100%;
}
.section-slider .section-title .grade-explanation[data-v-87cd1ba4] {
  color: #fff;
  font-size: 1.3rem;
  font-weight: 500;
  line-height: 1.2;
  width: 100%;
  word-break: break-word;
}
.wrap-preview-pdf .wrap-preview[data-v-87cd1ba4] {
  width: 100%;
  position: relative;
  padding: 0 10px;
}
.wrap-preview-pdf .wrap-preview .controls[data-v-87cd1ba4] {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 16px;
}
.wrap-preview-pdf .wrap-preview .controls .model-switch[data-v-87cd1ba4] {
  margin-left: 24px;
}
.wrap-preview-pdf .wrap-pdf[data-v-87cd1ba4] {
  width: 100%;
  /* 親の flex レイアウトに合わせて高さを左のプレビューに揃える */
  display: flex;
  flex-direction: column;
  overflow: hidden;
  /* 内部のみスクロール */
  margin-top: 12px;
}
.side-switch[data-v-87cd1ba4] {
  display: flex;
  gap: 12px;
  align-items: center;
}

/* angle buttons */
.wrap-switch[data-v-87cd1ba4] {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}
.angle-switch[data-v-87cd1ba4] {
  display: flex;
  gap: 12px;
}
.angle-switch .angle-btn[data-v-87cd1ba4] {
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  line-height: 0;
  height: 8vw;
}
.angle-switch .angle-btn img[data-v-87cd1ba4] {
  height: 100%;
  width: auto;
  display: block;
}
.grade-switch[data-v-87cd1ba4] {
  display: flex;
}
.grade-switch label[data-v-87cd1ba4] {
  cursor: pointer;
  overflow: hidden;
  border: 1px solid #191919;
}
.grade-switch label[data-v-87cd1ba4]:first-child {
  border-radius: 8px 0 0 8px;
}
.grade-switch label[data-v-87cd1ba4]:last-child {
  border-radius: 0 8px 8px 0;
}
.grade-switch label[data-v-87cd1ba4]:only-child {
  border-radius: 8px;
}
.grade-pill[data-v-87cd1ba4] {
  padding: 8px 20px;
  background: #fff;
  font-size: 1.2rem;
  font-weight: 500;
  display: inline-block;
}
.grade-pill.active[data-v-87cd1ba4] {
  background: #191919;
  color: #fff;
}
.side-switch .side-option[data-v-87cd1ba4] {
  cursor: pointer;
  display: inline-flex;
  align-items: center;
}
.side-switch .side-option input[data-v-87cd1ba4] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  width: 0;
  height: 0;
}
.side-switch .side-option img[data-v-87cd1ba4] {
  display: block;
  height: 40px;
  width: auto;
}
.model-switch[data-v-87cd1ba4] {
  display: flex;
  gap: 8px;
}
.model-switch .model-option[data-v-87cd1ba4] {
  position: relative;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 16px;
  border: 1px solid #000;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 600;
  color: #000;
  background: #fff;
  user-select: none;
  transition: background 0.2s, color 0.2s;
}
.model-switch .model-option.active[data-v-87cd1ba4] {
  background: #000;
  color: #fff;
}
.model-switch .model-option input[data-v-87cd1ba4] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  width: 0;
  height: 0;
}
.model-switch .model-option[data-v-87cd1ba4]:hover {
  background: #111;
  color: #fff;
}

/* grade-switch: hide native radio circles */
.grade-switch input[type=radio][data-v-87cd1ba4] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  width: 0;
  height: 0;
}

/* Footer */
.site-footer[data-v-87cd1ba4] {
  margin-top: 18px;
  padding: 16px 10px;
  background: #d5d5d5;
  color: #262626;
  font-size: 12px;
  line-height: 1.55;
}
.site-footer .footer-inner[data-v-87cd1ba4] {
  max-width: 1280px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.site-footer .footer-note[data-v-87cd1ba4] br {
  content: "";
}
.site-footer .footer-note[data-v-87cd1ba4] {
  font-size: 11px;
  color: #444;
}
.site-footer .footer-copy[data-v-87cd1ba4] {
  font-size: 1.2rem;
  font-weight: 300;
  margin: 0;
  color: #707070;
}

/* グレードロゴ */
.wrap-gradelogo[data-v-87cd1ba4] {
  padding: 0 10px;
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  margin-top: 4px;
}
.wrap-gradelogo .gradelogo[data-v-87cd1ba4] {
  width: 120px;
  margin: 0;
}
.wrap-gradelogo .gradelogo img[data-v-87cd1ba4] {
  width: 100%;
}

/* モーダル共通 */
.modal-title[data-v-87cd1ba4] {
  font-size: 16px;
  font-weight: 600;
  margin-top: 12px;
}
.modal-subtitle[data-v-87cd1ba4] {
  font-size: 16px;
  font-weight: 600;
  margin: 12px 0 8px;
}
.modal-list[data-v-87cd1ba4] {
  padding-left: 20px;
  font-size: 14px;
  line-height: 1.5;
}

/* Alert variant blocks: アイコン→見出し→リストの縦積み。複数ブロックを上下に並べる */
.modal-alert-block[data-v-87cd1ba4] {
  display: flex;
  flex-direction: column;
}
.modal-alert-block + .modal-alert-block[data-v-87cd1ba4] {
  margin-top: 32px;
}
.modal-alert-icon[data-v-87cd1ba4] {
  width: 52x;
  line-height: 0;
}
.modal-alert-icon img[data-v-87cd1ba4] {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
}

/* オフスクリーンのPDFステージ */
.offscreen-stage[data-v-87cd1ba4] {
  position: absolute;
  left: -99999px;
  top: -99999px;
}

/* Initial full-screen loading overlay */
.loading-overlay[data-v-87cd1ba4] {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  z-index: 9999;
  opacity: 1;
  transition: opacity 0.4s ease;
}
.loading-overlay.fade-out[data-v-87cd1ba4] {
  opacity: 0;
}
.loading-inner[data-v-87cd1ba4] {
  text-align: center;
}
.loading-text[data-v-87cd1ba4] {
  margin-top: 28px;
  font-size: 3rem;
  font-weight: 700;
  color: #033791;
}
.is-loading[data-v-87cd1ba4] {
  pointer-events: none;
}

/* ローディング中に背面操作を無効 */
.loading-icon[data-v-87cd1ba4] {
  width: 16vw;
  height: 16vw;
  animation: loading-spin-87cd1ba4 1s linear infinite;
  display: block;
  margin: 0 auto;
}
@keyframes loading-spin-87cd1ba4 {
100% {
    transform: rotate(360deg);
}
}
.visually-hidden[data-v-87cd1ba4] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* Invalidモーダル用のガイダンステキスト */
.modal-instruction[data-v-87cd1ba4] {
  margin-top: 8px;
  font-size: 1.7rem;
  font-weight: 700;
}

/* PCレイアウト: 961px以上 ( >960 ) */
@media (min-width: 961px) {
  /* SP用の並び替え指定をPCでは解除 */
.display_area[data-v-87cd1ba4] {
    display: block;
}
header[data-v-87cd1ba4] {
    padding: 34px 25px;
}
.header-title[data-v-87cd1ba4] {
    margin-left: 24px;
    font-size: 2rem;
}
.logo-suzuki[data-v-87cd1ba4] {
    width: 164px;
}
.wrap-gradelogo[data-v-87cd1ba4] {
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 25px;
}
.wrap-gradelogo .gradelogo[data-v-87cd1ba4] {
    width: 240px;
}
.grade-switch label[data-v-87cd1ba4]:hover {
    opacity: 0.8;
}
.grade-pill[data-v-87cd1ba4] {
    padding: 10px 32px;
    font-size: 1.6rem;
}
  /* SPで display: contents を使うため、PC側は同等以上の詳細度で上書き */
.display_area .wrap-preview-pdf[data-v-87cd1ba4] {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    padding: 0 25px;
}
  /* PCではDOM順のまま（orderをリセット） */
.display_area .wrap-preview-pdf .wrap-preview[data-v-87cd1ba4],
  .display_area .section-style-slider[data-v-87cd1ba4],
  .display_area .section-slider[data-v-87cd1ba4],
  .display_area .wrap-preview-pdf .wrap-pdf[data-v-87cd1ba4],
  .display_area .simulator-note[data-v-87cd1ba4] {
    order: unset;
}
  /* 内部スクロール */
.wrap-preview-pdf .wrap-preview[data-v-87cd1ba4],
  .wrap-preview-pdf .wrap-pdf[data-v-87cd1ba4] {
    min-height: 0;
}
.wrap-preview-pdf .wrap-preview[data-v-87cd1ba4] {
    max-width: calc(100% - 300px);
    margin: 0 auto;
    padding: 0;
}
.wrap-preview-pdf .wrap-pdf[data-v-87cd1ba4] {
    width: 300px;
    margin-top: 0px;
}
.wrap-switch[data-v-87cd1ba4] {
    margin-top: 16px;
}
.angle-switch[data-v-87cd1ba4] {
    gap: 32px;
}
.angle-switch .angle-btn[data-v-87cd1ba4] {
    height: 52px;
}
  /* スライダーセクション */
.section-slider[data-v-87cd1ba4] {
    margin-top: 50px;
}
.section-slider .section-title[data-v-87cd1ba4] {
    font-size: 1.8rem;
    padding: 10px 25px;
}
.section-slider .section-title span[data-v-87cd1ba4] {
    font-size: 2rem;
}
.section-slider .section-title .section-title-inner[data-v-87cd1ba4] {
    gap: 20px;
}
.section-slider .section-title .label-accessory-selection[data-v-87cd1ba4] {
    font-size: 2rem;
    width: unset;
}
.section-slider .section-title .grade-explanation[data-v-87cd1ba4] {
    font-size: 1.8rem;
    width: unset;
}
.site-footer[data-v-87cd1ba4] {
    padding: 35px 25px;
}
.simulator-note[data-v-87cd1ba4] {
    font-size: 1.4rem;
    margin-top: 44px;
    padding: 0 25px;
}
.modal-list[data-v-87cd1ba4] {
    margin-left: 24px;
}
.modal-instruction[data-v-87cd1ba4] {
    font-size: 2rem;
}
}.splide__container{box-sizing:border-box;position:relative}.splide__list{backface-visibility:hidden;display:-ms-flexbox;display:flex;height:100%;margin:0!important;padding:0!important}.splide.is-initialized:not(.is-active) .splide__list{display:block}.splide__pagination{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-pack:center;justify-content:center;margin:0;pointer-events:none}.splide__pagination li{display:inline-block;line-height:1;list-style-type:none;margin:0;pointer-events:auto}.splide:not(.is-overflow) .splide__pagination{display:none}.splide__progress__bar{width:0}.splide{position:relative;visibility:hidden}.splide.is-initialized,.splide.is-rendered{visibility:visible}.splide__slide{backface-visibility:hidden;box-sizing:border-box;-ms-flex-negative:0;flex-shrink:0;list-style-type:none!important;margin:0;position:relative}.splide__slide img{vertical-align:bottom}.splide__spinner{animation:splide-loading 1s linear infinite;border:2px solid #999;border-left-color:transparent;border-radius:50%;bottom:0;contain:strict;display:inline-block;height:20px;left:0;margin:auto;position:absolute;right:0;top:0;width:20px}.splide__sr{clip:rect(0 0 0 0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.splide__toggle.is-active .splide__toggle__play,.splide__toggle__pause{display:none}.splide__toggle.is-active .splide__toggle__pause{display:inline}.splide__track{overflow:hidden;position:relative;z-index:0}@keyframes splide-loading{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.splide__track--draggable{-webkit-touch-callout:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}.splide__track--fade>.splide__list>.splide__slide{margin:0!important;opacity:0;z-index:0}.splide__track--fade>.splide__list>.splide__slide.is-active{opacity:1;z-index:1}.splide--rtl{direction:rtl}.splide__track--ttb>.splide__list{display:block}.splide__arrow{-ms-flex-align:center;align-items:center;background:#ccc;border:0;border-radius:50%;cursor:pointer;display:-ms-flexbox;display:flex;height:2em;-ms-flex-pack:center;justify-content:center;opacity:.7;padding:0;position:absolute;top:50%;transform:translateY(-50%);width:2em;z-index:1}.splide__arrow svg{fill:#000;height:1.2em;width:1.2em}.splide__arrow:hover:not(:disabled){opacity:.9}.splide__arrow:disabled{opacity:.3}.splide__arrow:focus-visible{outline:3px solid #0bf;outline-offset:3px}.splide__arrow--prev{left:1em}.splide__arrow--prev svg{transform:scaleX(-1)}.splide__arrow--next{right:1em}.splide.is-focus-in .splide__arrow:focus{outline:3px solid #0bf;outline-offset:3px}.splide__pagination{bottom:.5em;left:0;padding:0 1em;position:absolute;right:0;z-index:1}.splide__pagination__page{background:#ccc;border:0;border-radius:50%;display:inline-block;height:8px;margin:3px;opacity:.7;padding:0;position:relative;transition:transform .2s linear;width:8px}.splide__pagination__page.is-active{background:#fff;transform:scale(1.4);z-index:1}.splide__pagination__page:hover{cursor:pointer;opacity:.9}.splide__pagination__page:focus-visible{outline:3px solid #0bf;outline-offset:3px}.splide.is-focus-in .splide__pagination__page:focus{outline:3px solid #0bf;outline-offset:3px}.splide__progress__bar{background:#ccc;height:3px}.splide__slide{-webkit-tap-highlight-color:rgba(0,0,0,0)}.splide__slide:focus{outline:0}@supports(outline-offset:-3px){.splide__slide:focus-visible{outline:3px solid #0bf;outline-offset:-3px}}@media screen and (-ms-high-contrast:none){.splide__slide:focus-visible{border:3px solid #0bf}}@supports(outline-offset:-3px){.splide.is-focus-in .splide__slide:focus{outline:3px solid #0bf;outline-offset:-3px}}@media screen and (-ms-high-contrast:none){.splide.is-focus-in .splide__slide:focus{border:3px solid #0bf}.splide.is-focus-in .splide__track>.splide__list>.splide__slide:focus{border-color:#0bf}}.splide__toggle{cursor:pointer}.splide__toggle:focus-visible{outline:3px solid #0bf;outline-offset:3px}.splide.is-focus-in .splide__toggle:focus{outline:3px solid #0bf;outline-offset:3px}.splide__track--nav>.splide__list>.splide__slide{border:3px solid transparent;cursor:pointer}.splide__track--nav>.splide__list>.splide__slide.is-active{border:3px solid #000}.splide__arrows--rtl .splide__arrow--prev{left:auto;right:1em}.splide__arrows--rtl .splide__arrow--prev svg{transform:scaleX(1)}.splide__arrows--rtl .splide__arrow--next{left:1em;right:auto}.splide__arrows--rtl .splide__arrow--next svg{transform:scaleX(-1)}.splide__arrows--ttb .splide__arrow{left:50%;transform:translate(-50%)}.splide__arrows--ttb .splide__arrow--prev{top:1em}.splide__arrows--ttb .splide__arrow--prev svg{transform:rotate(-90deg)}.splide__arrows--ttb .splide__arrow--next{bottom:1em;top:auto}.splide__arrows--ttb .splide__arrow--next svg{transform:rotate(90deg)}.splide__pagination--ttb{bottom:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;left:auto;padding:1em 0;right:.5em;top:0}@font-face {
  font-family: SuzukiPRO;
  font-style: normal;
  font-weight: 300;
  src: url("./assets/font/SuzukiPRORegular.otf");
}
/* Alias: map CSS normal(400) to the same Regular glyphs so Latin text at 400 uses Suzuki 300 weight visually */
@font-face {
  font-family: SuzukiPRO;
  font-style: normal;
  font-weight: 400;
  src: url("./assets/font/SuzukiPRORegular.otf");
}
@font-face {
  font-family: SuzukiPRO;
  font-style: normal;
  font-weight: 500;
  src: url("./assets/font/SuzukiPROHeadline.otf");
}
@font-face {
  font-family: SuzukiPRO;
  font-style: normal;
  font-weight: 700;
  src: url("./assets/font/SuzukiPROBold.otf");
}
/* Global font stack: use SuzukiPRO for Latin, Noto Sans for fallback. */
html, body {
  font-family: "SuzukiPRO", "Noto Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

body {
  font-family: "SuzukiPRO", "Noto Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

/* Utility class for forcing Suzuki headline/bold Latin while allowing Noto Sans fallback */
.font-suzuki-headline {
  font-family: "SuzukiPRO", "Noto Sans", system-ui, sans-serif;
  font-weight: 700;
}/* Basic reset for the app */
html,
body,
h1,
h2,
h3,
h4,
ul,
ol,
dl,
li,
dt,
dd,
p,
div,
span,
img,
a,
table,
tr,
th,
td,
input,
select,
textarea,
section {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: 300;
  font-size: 100%;
  vertical-align: baseline;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

img {
  width: 100%;
  height: auto;
}

input[type=submit],
input[type=buttom],
input[type=reset] {
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
}

article,
header,
footer,
aside,
figure,
figcaption,
nav,
section {
  display: block;
}

body {
  line-height: 1;
}

ol,
ul {
  list-style: none;
  list-style-type: none;
}

a {
  text-decoration: none;
}

html,
body {
  margin: 0;
  width: 100%;
}
:root {
  --text-color: #262626;
  --bg-color: #fff;
}

html {
  font-size: 62.5%;
  overflow-y: hidden;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

@media (max-width: 850px) {
    html {
        overflow-y: scroll;
    }
}

body {
  color: var(--text-color);
  background: var(--bg-color);
  line-height: 1.5;
  font-family: SuzukiPRO, "Noto Sans", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Optional: ensure images and media don't overflow containers */
img,
svg,
video,
canvas {
  max-width: 100%;
  height: auto;
  display: block;
}

/* フォーム要素は UA スタイルで本文色/フォントが外れるため継承させる */
input,
button,
select,
textarea {
  color: inherit;
  font: inherit;
}

/* リンク色を本文に揃える（必要に応じて装飾は維持） */
a {
  color: inherit;
}

/* SVG アイコンを本文色に追従させたい時に使用 */
svg.icon {
  fill: currentColor;
}

/* PCレイアウト: 961px以上 ( >960 ) */
@media (min-width: 961px) {
  input:hover,
  button:hover,
  select:hover,
  textarea:hover {
    opacity: 0.8;
  }
  /* リンク色を本文に揃える（必要に応じて装飾は維持） */
  a:hover {
    opacity: 0.8;
  }
}
/* CJK 文字が含まれる場合に、可読性のため 500→700 に引き上げる対象の上書き */
.cjk-bold {
  /* アクセサリ一覧のラベル */
}
.cjk-bold .acc-item .label {
  font-weight: 700 !important;
}
.cjk-bold {
  /* PC: Accessory Package ボタンのラベル */
}
.cjk-bold .acc-package-btn span {
  font-weight: 700 !important;
}
.cjk-bold {
  /* Style Selection スライダーのラベル */
}
.cjk-bold .style-item .label {
  font-weight: 700 !important;
}
.cjk-bold {
  /* 選択済みアクセサリ一覧の品目名 */
}
.cjk-bold .wrap-list .selected-list li > span {
  font-weight: 700 !important;
}
.cjk-bold {
  /* packageモーダル内の SELECT ラベル（疑似要素） */
}
.cjk-bold .package-btn::after {
  font-weight: 700 !important;
}
.cjk-bold {
  /* モーダル等のボタン */
}
.cjk-bold .btn {
  font-weight: 700 !important;
}

/* 共通ボタン（BasicModal の見た目に合わせる） */
.btn {
  cursor: pointer;
  padding: 6px;
  font-size: 1.6rem;
  font-weight: 500;
  border: none;
  font-family: inherit;
  background: #fff;
  transition: background 0.2s, color 0.2s;
  width: 120px;
}

.btn-primary {
  background: #262626;
  color: #fff;
}

.btn-secondary {
  background: #fff;
  color: #262626;
  border: 1px solid #262626;
}

/* ダブルタップによるズームをボタンでのみ抑止（ピンチズームは維持） */
button,
input[type=button],
input[type=submit],
.btn,
[role=button] {
  touch-action: manipulation;
  -ms-touch-action: manipulation;
}