/*
 * 福祉車両レンタカー（/service/rentacar/）だけで読む。inc/rentacar.php が読み込む。
 * 正本は Claude Design「福祉車両レンタカーページ」（PC版1280px）。色・書体は base.css の :root と同じ値。
 * 900px 以下は1カラム。料金表は横スクロールさせず、600px 以下は車両ごとの縦並びにする。
 */

/* ---------------------------------------------------------------- 共通 */
.rc .rc-ico{width:44px;height:44px;stroke:var(--navy);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.rc .rc-ico .f{fill:var(--navy-tint);stroke:var(--navy)}
.rc .rc-ico .r{stroke:var(--red)}
.rc .rc-note{font-size:13.5px;color:var(--muted);line-height:1.6}
.rc h3{font-size:18px;font-weight:700;line-height:1.5}
.rc h4{font-size:17px;font-weight:700;line-height:1.5}
.rc h3,.rc h4{margin:0}
.rc-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rc-card{border:2px solid var(--navy-line);border-radius:20px;background:#fff;box-shadow:0 4px 0 var(--navy-line);padding:22px;display:flex;flex-direction:column;gap:8px}
.rc-card p{font-size:15px;color:var(--text);line-height:1.75}
.rc-row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:9px 0;border-bottom:1px solid var(--line);font-size:15.5px;line-height:1.6}
.rc-row dt{min-width:0}
.rc-row dt small{display:block;font-size:13.5px;color:var(--muted);line-height:1.6}
.rc-row dd{margin:0;font-weight:700;white-space:nowrap}
.rc dl{margin:0}

/* ---------------------------------------------------------------- 見出し */
.rc-hero{padding-top:8px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:44px;align-items:center}
.rc-hero-t{display:flex;flex-direction:column;gap:14px}
.rc-hero .phead{padding-block:0}
.rc-hero .eyebrow{white-space:nowrap;font-size:clamp(48px,7.4vw,96px)}
.rc-start{align-self:flex-start;display:inline-flex;align-items:center;padding:6px 16px;border-radius:20px;background:var(--red);color:#fff;font-size:15px;font-weight:700;line-height:1.6}
.rc-reg{display:flex;align-items:center;gap:14px;padding:12px 18px;border:2px solid var(--navy-line);border-radius:18px;font-size:14.5px;line-height:1.6}
.rc .rc-reg .rc-ico{width:40px;height:40px}
.rc-reg b{font-size:15.5px}
.rc-btns{display:flex;gap:12px;flex-wrap:wrap}
.rc-fig{margin:0}
.rc-fig img{width:100%;height:auto;border-radius:18px;display:block}

/* ---------------------------------------------------------------- 切替 */
.rc-tabs{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:22px}
.rc-tabs[hidden]{display:none}
.rc-tab{min-height:56px;padding:10px 26px;border-radius:30px;font-family:inherit;font-size:17px;font-weight:700;line-height:1.5;cursor:pointer;background:#fff;color:var(--navy);border:2px solid var(--navy-line)}
.rc-tab:hover{border-color:var(--navy)}
.rc-tab[aria-pressed="true"]{background:var(--navy);color:#fff;border-color:var(--navy)}
.rc-tab:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.rc-panel{display:flex;flex-direction:column;gap:16px}
.rc-panel[hidden]{display:none}
/* JS が動かないとき（切替ボタンなし）だけ、どちら向けかの見出しを出す */
.rc .rc-ptitle{font-size:20px;color:var(--navy)}
.rc-js .rc-ptitle{display:none}
#rc-b{margin-top:36px}
.rc-js #rc-b{margin-top:0}

/* 個人・ご家族の方 */
.rc-points{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.rc-points3{grid-template-columns:repeat(3,minmax(0,1fr))}
.rc-pmain{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:stretch}
.rc-fee{gap:0}
.rc-fee h4{margin-bottom:4px}
.rc-fee h4 + dl{margin-bottom:14px}
.rc-fee .rc-note{margin-top:8px}
.rc-accident{border-color:var(--red);box-shadow:0 4px 0 #f3c5c8;flex-direction:row;align-items:center;gap:20px}
.rc-accident > div{display:flex;flex-direction:column;gap:4px}

.rc-car{border:2px solid var(--navy-line);border-radius:20px;background:#fff;box-shadow:0 4px 0 var(--navy-line);overflow:hidden;display:flex;flex-direction:column}
.rc-car > picture{display:block}
.rc-car img{width:100%;height:auto;display:block;background:var(--soft)}
.rc-car .b{padding:16px 20px 20px;display:flex;flex-direction:column;gap:4px}
.rc-car .k{font-size:13px;font-weight:700;color:var(--navy)}
.rc-car b{font-size:18px;line-height:1.5}
.rc-car .b > span:last-child{font-size:14.5px;color:var(--text);line-height:1.7}

/* 事業者の方 */
.rc-cars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.rc .rc-sub{font-size:20px;margin-top:8px}
.rc-scenes{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:16px;align-items:stretch}
.rc-scene{gap:0}
.rc-k{font-size:13px;font-weight:700;color:var(--navy)}
.rc-k-red{color:var(--red-text)}
.rc-scene h4{font-size:18px;margin:2px 0 6px}
.rc-scene .rc-strong{font-size:16px;color:var(--ink);line-height:1.8;font-weight:700}
.rc-scene .rc-note{margin-top:8px}
.rc-tbl{width:100%;border-collapse:collapse;font-size:15px;line-height:1.6;border-top:2px solid var(--navy)}
.rc-tbl th,.rc-tbl td{padding:9px 12px;border-bottom:1px solid var(--line);text-align:right;font-weight:500}
.rc-tbl thead th{background:var(--navy-tint);font-weight:700}
.rc-tbl th:first-child{text-align:left}
.rc-tbl tbody th{font-weight:700}

/* ---------------------------------------------------------------- 流れ */
.rc-flowbox{background:var(--navy-tint);border-radius:24px;padding:28px;display:flex;flex-direction:column;gap:14px}
.rc-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.rc-steps li{display:flex;flex-direction:column;gap:6px;padding:20px 18px;background:#fff;border-radius:18px;box-shadow:0 4px 0 var(--navy-line)}
.rc-steps .n{font-family:var(--en);font-weight:800;font-size:28px;color:var(--navy);line-height:1}
.rc-steps b{font-size:16.5px;line-height:1.5}
.rc-steps li > span:last-child{font-size:14px;color:var(--text);line-height:1.7}

/* ---------------------------------------------------------------- 詳しく（開閉） */
.rc-accs{display:flex;flex-direction:column;gap:12px}
.rc-acc{border:2px solid var(--navy-line);border-radius:18px;background:#fff;overflow:hidden}
.rc-acc summary{min-height:64px;display:flex;align-items:center;gap:16px;padding:12px 24px;cursor:pointer;list-style:none;color:var(--ink)}
.rc-acc summary::-webkit-details-marker{display:none}
.rc-acc summary:focus-visible{outline:3px solid var(--navy);outline-offset:-3px}
.rc-acc summary > b{flex-grow:1;font-size:17.5px;line-height:1.5}
.rc-acc .rc-open{font-size:15px;font-weight:700;color:var(--navy);white-space:nowrap}
.rc-acc[open] .rc-open{font-size:0}
.rc-acc[open] .rc-open::after{content:"閉じる";font-size:15px}
.rc-accb{padding:4px 24px 24px;display:flex;flex-direction:column;gap:10px;margin:0}
.rc-li{list-style:none}
.rc-li li{display:flex;gap:10px;font-size:15.5px;color:var(--text);line-height:1.7}
.rc-li li::before{content:"・";color:var(--navy);font-weight:700}
.rc-qa{padding-bottom:10px;border-bottom:1px solid var(--line)}
.rc-qa:last-child{padding-bottom:0;border-bottom:0}
.rc .rc-qa h3{font-size:15.5px;color:var(--navy);line-height:1.7}
.rc-qa p{font-size:15.5px;color:var(--text);line-height:1.7}

/* ---------------------------------------------------------------- 空き状況・ご予約 */
.rc-cbox{background:var(--navy-tint);border-radius:24px;padding:36px 40px;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:28px;align-items:center}
.rc-ctext{display:flex;flex-direction:column;gap:10px}
.rc .rc-ctext h2{margin-bottom:0}
.rc-ctext > p:not(.rc-note){font-size:16px;color:var(--text)}
.rc-ctext .btn{align-self:flex-start}
.rc-tel{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:14px;align-items:center;padding:18px 22px;background:var(--navy);color:#fff;border-radius:18px;text-decoration:none;box-shadow:0 4px 0 var(--navy-deep)}
.rc-tel:hover{color:#fff;background:var(--navy-deep)}
.rc .rc-tel .rc-ico{width:40px;height:40px;stroke:#fff;grid-row:1 / span 3}
.rc-tel b{font-size:15px;color:#dde4f1}
.rc-tel .rc-num{font-family:var(--en);font-weight:800;font-size:32px;line-height:1.2;white-space:nowrap}
.rc-tel small{font-size:13.5px;color:#dde4f1}

/* ---------------------------------------------------------------- 事業者の表示 */
.rc-op{margin:28px 0 8px !important;border:1px solid var(--line);border-radius:16px;padding:18px 24px;font-size:14px;color:var(--text);line-height:1.8;display:grid;grid-template-columns:180px minmax(0,1fr);column-gap:20px}
.rc-op dt{font-weight:700;color:var(--ink)}
.rc-op dd{margin:0}

/* ---------------------------------------------------------------- スマホ・タブレット */
@media (max-width:900px){
  .rc-hero,.rc-pmain,.rc-scenes,.rc-cbox{grid-template-columns:minmax(0,1fr)}
  .rc-hero{gap:24px}
  .rc-points,.rc-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rc-cbox{padding:28px 20px}
}
@media (max-width:600px){
  .rc-points,.rc-points3,.rc-cars,.rc-steps{grid-template-columns:minmax(0,1fr)}
  .rc-btns .btn,.rc-ctext .btn{flex:1 1 100%;align-self:stretch}
  .rc-tab{flex:1 1 100%;font-size:16px;padding-inline:18px}
  .rc-ctext .btn{padding-inline:16px;font-size:16px}
  .rc-tel small span{display:block}
  .rc-card{padding:18px}
  .rc-accident{flex-direction:column;align-items:flex-start;gap:10px}
  .rc-row{font-size:15px}
  .rc-acc summary{padding:12px 16px;gap:12px}
  .rc-acc summary > b{font-size:16.5px}
  .rc-accb{padding:4px 16px 20px}
  .rc-tel .rc-num{font-size:26px}
  .rc-op{grid-template-columns:minmax(0,1fr);padding:16px 18px}
  .rc-op dd + dt{margin-top:8px}

  /* 料金表：横スクロールさせず、車両ごとに「列名 … 金額」を縦に並べる */
  .rc-tbl,.rc-tbl tbody,.rc-tbl tr,.rc-tbl th,.rc-tbl td{display:block}
  .rc-tbl thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .rc-tbl{border-top:0}
  .rc-tbl tr{border-top:2px solid var(--navy);margin-top:12px}
  .rc-tbl tbody th{background:var(--navy-tint);text-align:left;padding:8px 12px}
  .rc-tbl td{display:flex;justify-content:space-between;gap:16px;padding:8px 12px}
  .rc-tbl td::before{content:attr(data-label);color:var(--text);font-weight:500;text-align:left}
  .rc-tbl td.rc-none{display:none}
}