/* サイト改善3（2026-10-20） */
/* トップ「対応エリア」：前のセクション（運賃, z-index:1）より手前に置き、すぎたっくんの頭が隠れないようにする。
   すぎたっくん自体は .top-area__items（z-index:2）の中で z-index:-1 のまま＝カードの後ろ。 */
html .top-area .top-area__body { z-index: 2; }

/* 下層ページのヒーロー下端の斜めを走る車。位置・傾き・大きさは site-refine3-20261020.js が決める */
html .st-page-head { overflow-x: clip; }  /* 車が画面の外にいる間も横にはみ出さない */
html .st-page-head .st-page-head__car.st-hero-run { display: block !important; position: absolute !important; left: 0 !important; top: 0 !important;
  right: auto !important; bottom: auto !important; width: clamp(220px, 30vw, 520px) !important; margin: 0 !important; z-index: 12;
  pointer-events: none; transform-origin: 54% 100% !important; will-change: transform; opacity: 0; transition: opacity .3s; }
html .st-page-head .st-page-head__car.st-hero-run.is-ready { opacity: 1; }
html .st-page-head .st-hero-run img { display: block; width: 100%; height: auto; opacity: 1 !important; visibility: visible !important;
  transform: none !important; animation: none !important; filter: drop-shadow(0 1.2rem 1.4rem rgba(4,34,92,.28)); }
@media (max-width: 1023px) { html .st-page-head .st-page-head__car.st-hero-run { width: clamp(150px, 46vw, 300px) !important; } }
/* SPで以前から置いていた止まった車は、走る車が出たら隠す（2台にしない） */
html .st-page-head:has(.st-hero-run.is-ready) .st-sp-hero-car { display: none !important; }

/* 会社案内の沿革（PC）：見出しは普通に流し、年表（.st-road__stage）だけを page-sub.js が画面中央で固定する */
@media (min-width: 1024px) {
  html .st-road { height: auto !important; padding-bottom: 4rem; }
  html .st-road__pin { position: relative !important; top: auto !important; height: auto !important; overflow: visible !important; display: block !important; }
  html .st-road__stage { display: flex; align-items: flex-end; width: 100%; margin-top: 2rem; overflow-x: clip; background-color: var(--sub-navy2); }
}

/* 運賃：タクシーチケットのカードに取り扱いの一覧 */
.st-ticket-mini { list-style: none; margin: 18px 0 0 !important; padding: 0; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px !important; }
.st-ticket-mini li { margin: 0; padding: 7px 10px !important; border: 1px solid rgba(16,39,90,.2) !important; border-radius: 8px !important;
  font-size: 13px !important; font-weight: 700; line-height: 1.4; color: #10275a; background: #f7f9fc; }
.st-ticket-mini__note { margin-top: 10px; font-size: 12px; line-height: 1.6; color: #5f6673; }
.st-ticket-mini__note a { color: inherit; text-decoration: underline; text-underline-offset: .2em; }

/* 地域活動：ヒーローの斜めの楔とご相談セクションを黄色に。次の区切りも黄色から */
.page-voice .st-page-head { --head-next: var(--sub-yellow); }
html .page-voice .st-voice-questions { background-color: var(--sub-yellow) !important; }
html .page-voice .st-voice-transition { --wave-from: var(--sub-yellow); }
html .page-voice .st-voice-questions .st-bigen span { -webkit-text-stroke-color: rgba(16,39,90,.16); }
/* 吹き出しは文字の長さに合わせ、すぎたっくんの口元のそばに置く */
html .page-voice .st-guide__bubble { justify-self: end; align-self: center; width: max-content !important; max-width: 100% !important; margin-right: 1.6rem !important; }
