@charset "UTF-8";
/* ============================================================
   index.html 改善パッチ 2026-09-27
   1) ヒーロー見出しのコントラスト確保（PC）
   2) 追従ボタンと本文の重なり解消
   3) 極小文字の底上げ（最小11px）
   4) スマホ固定バー分の下部余白
   ※ 既存CSSは変更せず、このファイルで上書きしています。
   ============================================================ */

/* ---- 1) ヒーロー1枚目：左側を暗くして白文字を読めるように ---- */
@media (min-width: 981px) {
  .hero-slider .slide:first-child .slide-scrim {
    display: block !important;
    opacity: 1 !important;
    background:
      linear-gradient(90deg,
        rgba(5,28,56,.38) 0%,
        rgba(5,28,56,.30) 22%,
        rgba(5,28,56,.18) 40%,
        rgba(5,28,56,.07) 56%,
        rgba(5,28,56,0)   70%),
      linear-gradient(180deg, transparent 58%, rgba(5,28,56,.18) 100%) !important;
  }
  /* 見出し上のラベルを判読可能な明度に */
  .hero-slider .slide:first-child .slide-tag {
    color: #cfeaff !important;
    font-size: 11px !important;
    text-shadow: 0 1px 5px rgba(0,0,0,.72) !important;
  }
  .hero-slider .slide:first-child .slide-body h1 {
    text-shadow: 0 2px 9px rgba(0,0,0,.68), 0 1px 2px rgba(0,0,0,.82) !important;
  }
  /* スクリムが効くのでリード文の帯（背景板）は不要 */
  .hero-slider .slide:first-child .slide-body > p .hero-band {
    background: transparent !important;
    padding: 0 !important;
  }
  .hero-slider .slide:first-child .slide-body > p {
    color: #fff !important;
    text-shadow: 0 1px 5px rgba(0,0,0,.72) !important;
  }
}

/* ---- 2) 追従ボタン：PC/タブレットはアイコンのみ。ホバー/フォーカスで展開 ---- */
@media (min-width: 641px) {
  .inquiry-float-button {
    right: 20px !important;
    bottom: 20px !important;
    width: 56px;
    min-width: 56px;
    max-width: 56px;
    min-height: 56px;
    padding: 0 !important;
    gap: 0;
    overflow: hidden;
    justify-content: center;
    transition: max-width .26s ease, padding .26s ease, background .2s ease, box-shadow .2s ease;
  }
  .inquiry-float-button > span {
    max-width: 0;
    opacity: 0;
    white-space: nowrap;
    overflow: hidden;
    transition: max-width .26s ease, opacity .2s ease, margin-left .26s ease;
  }
  .inquiry-float-button:hover,
  .inquiry-float-button:focus-visible {
    max-width: 260px;
    padding: 0 22px 0 18px !important;
    transform: none;
  }
  .inquiry-float-button:hover > span,
  .inquiry-float-button:focus-visible > span {
    max-width: 200px;
    opacity: 1;
    margin-left: 9px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .inquiry-float-button,
  .inquiry-float-button > span { transition: none !important; }
}

/* ---- 3) 極小文字の底上げ（装飾ラベル類を最小11pxに） ---- */
.logo .word span,
.menu-toggle__label,
.qa_link a,
.hero-brand-statement__eyebrow,
.featured-notice__badge,
.home-promo__eyebrow,
.specialist-card__num,
.specialist-card__en,
.specialist-message span,
.pb-feature-card__tag,
.usecase-photo__tag,
.quick-product-card .tag,
.portal-links h2 span {
  font-size: 11px !important;
}
/* 本文にあたる説明文はさらに確保 */
.tech-proof__item p { font-size: 12px !important; }
.home-promo__go span { font-size: 12px !important; }

@media (max-width: 640px) {
  .logo .word span { font-size: 10px !important; letter-spacing: .12em !important; }
  .slide-tag { font-size: 11px !important; }
  .tech-proof__item p { font-size: 12px !important; line-height: 1.7 !important; }
}

/* ---- 4) スマホ：固定バーに隠れる分の余白 ---- */
@media (max-width: 640px) {
  body { padding-bottom: 82px; }
}

/* ---- 3-b) 既存の強い指定を上書きするための追記（同等以上の詳細度） ---- */
.site-header .logo .word span { font-size: 11px !important; letter-spacing: .12em !important; }
.hero-slider .slide:first-child .hero-brand-statement__eyebrow { font-size: 11px !important; }
.hero-slider .slide .slide-tag { font-size: 11px !important; }
#documents.portal-links .portal-links__col h2 span { font-size: 11px !important; }
.environment-promo__metrics span { font-size: 11px !important; }
.home-promo__card .home-promo__content span { font-size: 11.5px !important; }

/* ヘッダーが詰まる幅帯でも9pxまで縮めない */
@media (min-width: 961px) and (max-width: 1100px) {
  .site-header .qa_link a { font-size: 10.5px !important; }
  .site-header .contact_link a { font-size: 10.5px !important; }
}

/* ---- 2-b) 641〜1200pxでも追従ボタンが本文に重ならないよう余白を確保 ---- */
@media (min-width: 641px) and (max-width: 1200px) {
  .featured-notice .container { padding-right: 84px; }
  .home-promo .container { padding-right: 84px; }
}

/* スマホ：ヒーローのラベルも11pxを確保 */
@media (max-width: 640px) {
  .hero-slider .slide:first-child .slide-tag { font-size: 11px !important; }
}

/* ---- 1-c) ヒーロー1枚目：右側コピーを明るいガラス調パネルに ---- */
@media (min-width: 981px) {
  .hero-slider .slide:first-child .hero-brand-statement {
    padding: 22px 24px 20px !important;
    border: 1px solid rgba(255,255,255,.72) !important;
    border-radius: 14px !important;
    background: rgba(255,255,255,.68) !important;
    -webkit-backdrop-filter: blur(7px) saturate(1.05);
    backdrop-filter: blur(7px) saturate(1.05);
    box-shadow: 0 10px 28px rgba(4,32,58,.16) !important;
    color: #073b6b !important;
  }

  /* 既存の暗いぼかしは使わない */
  .hero-slider .slide:first-child .hero-brand-statement::after {
    background: none !important;
    filter: none !important;
  }

  /* 上部のアクセント線は青に */
  .hero-slider .slide:first-child .hero-brand-statement::before {
    background: #00a3e0 !important;
    box-shadow: none !important;
  }

  /* 黒帯は完全に外す */
  .hero-slider .slide:first-child .hero-brand-statement .hero-band {
    background: transparent !important;
    padding: 0 !important;
    box-shadow: none !important;
  }

  .hero-slider .slide:first-child .hero-brand-statement__eyebrow {
    color: #1575a6 !important;
    text-shadow: none !important;
  }

  .hero-slider .slide:first-child .hero-brand-statement__kicker {
    color: #073b6b !important;
    text-shadow: 0 1px 0 rgba(255,255,255,.85) !important;
  }

  .hero-slider .slide:first-child .hero-brand-statement__sub,
  .hero-slider .slide:first-child .hero-brand-statement__sub .hero-band {
    color: #244c67 !important;
    text-shadow: none !important;
  }

  .hero-slider .slide:first-child .hero-brand-statement__link {
    color: #073b6b !important;
    border-bottom-color: rgba(7,59,107,.38) !important;
    text-shadow: none !important;
  }

  .hero-slider .slide:first-child .hero-brand-statement__link:hover,
  .hero-slider .slide:first-child .hero-brand-statement__link:focus-visible {
    border-bottom-color: #073b6b !important;
  }
}

/* ---- 1-d) 工場ヒーロー：写真を残しつつ文字コントラストを確保 ---- */
@media (min-width: 641px) {
  .hero-slider .slide:nth-child(3) .slide-scrim {
    display: block !important;
    opacity: 1 !important;
    background:
      linear-gradient(90deg,
        rgba(27,16,7,.64) 0%,
        rgba(27,16,7,.52) 24%,
        rgba(27,16,7,.34) 44%,
        rgba(27,16,7,.12) 62%,
        rgba(27,16,7,0) 76%),
      linear-gradient(180deg,
        transparent 50%,
        rgba(27,16,7,.30) 100%) !important;
  }

  .hero-slider .slide:nth-child(3) .slide-tag {
    color: #fff !important;
    text-shadow: 0 1px 3px rgba(0,0,0,.88), 0 4px 12px rgba(0,0,0,.50) !important;
  }

  .hero-slider .slide:nth-child(3) .slide-title {
    color: #fff !important;
    text-shadow: 0 2px 3px rgba(0,0,0,.92), 0 7px 20px rgba(0,0,0,.58) !important;
  }

  .hero-slider .slide:nth-child(3) .slide-body > p {
    color: #fff !important;
    font-weight: 600 !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.95), 0 4px 13px rgba(0,0,0,.62) !important;
  }
}
