/* MIEKATA スマホの画面下の固定ボタン（1100px 以下。2026-10-23 吉田さんの改修指示書 A5・A9）
   - ヘッダーの「無料診断」はスマホで隠し、ここに出す。ボタンは「無料で診断する」1つだけ（LINE は置かない）
   - フッター・最後の申し込みの区画・最初の画面の主ボタン（data-msb-hide）が見えている間は隠す（shell.js が html に msb-off を付ける。header160.js の hd160-off でも隠す）
   - ボタンは主ボタンの決まりどおり：高さ 48px・角丸 999px・朱の塗り */

:root {
  --msb-cta: var(--ds-cta, #bf5139);
  --msb-cta-hover: var(--ds-cta-dk, #a8452f);
  --msb-bg: rgb(255 255 255 / .96);
  --msb-white: #fff;
  --msb-blue: var(--ds-blue, #2448d8);
}

html body nav.msb { display: none; }
@media (max-width: 1100px) {
  html body:is(#msb#msb#msb#msb, *) nav.msb {
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 900;
    margin: 0;
    padding: 8px 16px calc(8px + env(safe-area-inset-bottom, 0px));
    background: var(--msb-bg);
    box-shadow: 0 -4px 16px rgba(27, 30, 43, .1);
    transition: transform .3s cubic-bezier(.43, .05, .17, 1), opacity .3s cubic-bezier(.43, .05, .17, 1);
  }
  html body:is(#msb#msb#msb#msb, *) nav.msb a.msb-go {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 480px !important;
    height: 48px !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 0 24px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: var(--msb-cta) !important;
    color: var(--msb-white) !important;
    font: 700 16px/1 'Noto Sans JP', sans-serif !important;
    letter-spacing: .04em !important;
    text-decoration: none !important;
    text-shadow: none !important;
    white-space: nowrap !important;
  }
  html body:is(#msb#msb#msb#msb, *) nav.msb a.msb-go:hover { background: var(--msb-cta-hover) !important; }
  html body:is(#msb#msb#msb#msb, *) nav.msb a.msb-go:focus-visible { outline: 2px solid var(--msb-blue) !important; outline-offset: 3px !important; }
  html body:is(#msb#msb#msb#msb, *) nav.msb a.msb-go svg { flex: none; width: 18px; height: 18px; }
  html:is(.msb-off, .hd160-off) body:is(#msb#msb#msb#msb, *) nav.msb { transform: translateY(110%); opacity: 0; pointer-events: none; }
  html:has(.mmn[open]) body:is(#msb#msb#msb#msb, *) nav.msb { opacity: 0; pointer-events: none; }
}
@media (prefers-reduced-motion: reduce) {
  html body nav.msb { transition: none !important; }
}