/* =========================
  印刷設定
========================= */


@media print {
  .gallery,
  .gallery__wrap,
  .gallery__track,
  .gallery__controls {
    display: none !important;
  }
}

@media print {

  @page{
    size: A4 portrait;
    margin: 10mm;
  }

  html,
  body{
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
    color: #000 !important;
    overflow: visible !important;
  }

  body{
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
    overflow-x: visible !important;
  }

  /* 画面用の演出を止める */
  *,
  *::before,
  *::after{
    animation: none !important;
    transition: none !important;
    transform: none !important;
    filter: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }

  /* 真っ黒ページの原因になりやすい背景演出を切る */
  .shade,
  .panel::before,
  .panel::after,
  .trailer__figure::before,
  .kit-card::after,
  .graph__cta::before,
  .graph__cta::after{
    display: none !important;
    content: none !important;
    background: none !important;
  }

  /* 印刷不要 */
  .gallery,
  .gallery__wrap,
  .gallery__track,
  .gallery__controls,
  script,
  .no-print{
    display: none !important;
  }

  /* セクションを印刷向けに通常フローへ戻す */
  .panel,
  .hero,
  .affection,
  .graph,
  .gallery,
  .trailer,
  .powerful,
  .kit,
  .related,
  .internal_sales{
    display: block !important;
    position: static !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 0 10mm 0 !important;
    padding: 0 !important;
    background: #fff !important;
    color: #000 !important;
    overflow: visible !important;
    break-inside: auto !important;
    page-break-inside: auto !important;
  }

  /* 共通内側幅を解除 */
  .graph__text,
  .graph__media,
  .graph2__media,
  .gallery__inner,
  .trailer__inner,
  .powerful__inner,
  .kit__inner,
  .related__inner,
  .internal_sales__text,
  .install__block,
  .install__media,
  .install__divider,
  .powerful__graph,
  .kit__cards,
  .related__grid,
  .site-footer__inner{
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Hero / Affection は画像だけ素直に出す */
  .hero__media,
  .affection__media,
  .trailer__figure,
  .kit__cta,
  .related__item,
  .site-footer__brand{
    margin: 0 !important;
    padding: 0 !important;
  }

  img{
    display: block !important;
    max-width: 100% !important;
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    break-inside: avoid !important;
    page-break-inside: avoid !important;
  }

  /* 円グラフだけ大きくなりすぎるのを防ぐ */
  .internal_sales__media{
    width: 70mm !important;
    max-width: 70mm !important;
    margin: 8mm auto 0 !important;
  }

  .internal_sales__media img{
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }

  /* 2カラムやカードは印刷では1列にする */
  .graph2__media,
  .kit__grid,
  .kit__cards,
  .related__grid{
    display: block !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }

  .kitCard,
  .kit-card,
  .related__item{
    display: block !important;
    width: 100% !important;
    margin: 0 0 6mm 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: #fff !important;
    color: #000 !important;
  }

  /* 文字色を黒に統一 */
  h1, h2, h3, h4, h5, h6,
  p, li, dt, dd, span, small,
  .kicker,
  .graph__title,
  .graph__desc,
  .gallery__title,
  .gallery__lead,
  .trailer__title,
  .trailer__lead,
  .powerful__title,
  .kit__title,
  .kitCard__title,
  .kitCard__desc,
  .kitCard__note,
  .kit-card__kicker,
  .kit-card__title,
  .kit-card__desc,
  .related__title,
  .internal_sales__title,
  .internal_sales__desc,
  .site-footer__copy{
    color: #000 !important;
  }

  /* 背景ベタ系を消す */
  .rakutenBanner,
  .trailer__titleCard,
  .kitCard,
  .kit-card{
    background: #fff !important;
  }

  /* Footer */
  .site-footer{
    background: #fff !important;
    padding: 0 !important;
  }

  .site-footer::before{
    display: none !important;
  }

  /* 改ページしやすい単位 */
  .hero,
  .affection,
  .internal_sales,
  .graph--install,
  .powerful,
  .kit,
  #why-black-1,
  #why-black-2,
  .related,
  .site-footer{
    break-before: auto !important;
    break-after: auto !important;
    break-inside: avoid !important;
    page-break-inside: avoid !important;
  }
}

.reveal{
  opacity:1 !important;
  transform:none !important;
}

@media print {

  @page{
    size: A4 portrait;
    margin: 8mm;
  }

  /* スクロール演出を印刷で確実に表示 */
  .reveal{
    opacity: 1 !important;
    transform: none !important;
  }

  /* 全体の余白を圧縮 */
  .panel,
  .hero,
  .affection,
  .internal_sales,
  .graph--install,
  .powerful,
  .kit,
  .trailer,
  .related,
  .site-footer{
    margin: 0 0 5mm 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    min-height: 0 !important;
    break-inside: avoid !important;
    page-break-inside: avoid !important;
  }

  /* 見出しまわりを圧縮 */
  .graph__text,
  .internal_sales__text,
  .gallery__head,
  .kit__head,
  .trailer__head,
  .powerful__text,
  .related__head{
    margin-bottom: 4mm !important;
    padding-bottom: 0 !important;
  }

  .graph__title,
  .internal_sales__title,
  .gallery__title,
  .kit__title,
  .trailer__title,
  .powerful__title,
  .related__title,
  h1, h2{
    font-size: 20pt !important;
    line-height: 1.3 !important;
    margin: 0 0 3mm 0 !important;
  }

  h3{
    font-size: 13pt !important;
    line-height: 1.4 !important;
    margin: 0 0 2mm 0 !important;
  }

  p,
  li,
  dd,
  .graph__desc,
  .internal_sales__desc,
  .gallery__lead,
  .trailer__lead,
  .kitCard__desc,
  .kitCard__note,
  .kit-card__desc{
    font-size: 10pt !important;
    line-height: 1.6 !important;
    margin: 0 0 2.5mm 0 !important;
  }

  /* 円グラフを適正サイズへ */
  .internal_sales__media{
    width: 120mm !important;
    max-width: 120mm !important;
    margin: 5mm auto 0 !important;
  }

  /* 画像まわりを圧縮 */
  .install__media,
  .powerful__graph,
  .trailer__figure,
  .kit__application,
  .related__grid,
  .kit__cards{
    margin-top: 4mm !important;
    margin-bottom: 4mm !important;
  }

  .install__divider,
  .panel__divider{
    display: none !important;
  }

  /* 印刷では不要な導線を非表示 */
  .fitmentCheck,
  .gallery,
  .kit__cards,
  .trailer__links,
  .trailer__awardWrap,
  .related,
  .site-footer{
    display: none !important;
  }

  /* キットは縦の詰まりを優先 */
  .kit__grid{
    display: block !important;
  }

  .kitCard{
    margin: 0 0 4mm 0 !important;
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: #fff !important;
  }

  .kitCard__media{
    margin-top: 3mm !important;
    padding-top: 0 !important;
    border-top: 0 !important;
  }

  .kitCard__media img{
    max-height: 75mm !important;
    width: auto !important;
    margin: 0 auto !important;
  }

  /* trailer を詰める */
  .trailer__inner{
    gap: 3mm !important;
    padding: 0 !important;
  }

  .trailer__titleCard{
    margin: 3mm auto !important;
    padding: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
  }

  .trailer__logo{
    width: 90mm !important;
    max-width: 90mm !important;
    filter: none !important;
  }

  .trailer__figure{
    width: 100% !important;
    max-width: none !important;
  }

  .trailer__figureImg{
    box-shadow: none !important;
    border: 0 !important;
    filter: none !important;
  }
}
