/* ==========================================================
   沖縄ナビ 運転代行一覧
   テーマの CSS 変数（--mainColor など）を使い、サイト全体の見た目に合わせる。
   テーマは html { font-size: 62.5% } なので 1rem = 10px。
   ========================================================== */
.okd {
  --okd-main: var(--mainColor, #00a1e9);
  /* 文字の青は濃い方（テーマの --onv-blue-text）。#00a1e9 の文字は白地でコントラストが足りなかった（アクセシビリティ 97。2026-10-28） */
  --okd-main-text: var(--onv-blue-text, #007eb6);
  --okd-dark: var(--d_blue, #006899);
  --okd-pale: var(--w_blue, #e9f7fd);
  --okd-line: var(--l_gray2, #e5e5e5);
  --okd-text: var(--black, #333);
  --okd-sub: #6b6b6b;
  --okd-pr: #e8761b;
  --okd-pr-pale: #fff6ec;
  --okd-call: #0a9f5a;
  --okd-radius: 12px;
  color: var(--okd-text);
  font-size: 1.5rem;
  line-height: 1.6;
  margin: 0 auto;
  max-width: 1200px;
  padding-bottom: 60px;
}
.okd *, .okd *::before, .okd *::after { box-sizing: border-box; }
.okd [hidden] { display: none !important; }
.okd ul { list-style: none; margin: 0; padding: 0; }
.okd li, .okd li + li { margin: 0; } /* テーマの li + li の余白を打ち消す。テーマの指定（style.css の ul:not(...) > li + li）の方が強いので、ul には not_set も付ける（2026-10-28。付いていなかったため、カードの市町村のタグの 1 つ目だけ 6px 高く見えていた） */
.okd dl, .okd dd, .okd p { margin: 0; }
.okd-i { width: 1.1em; height: 1.1em; flex: none; vertical-align: -0.15em; }
.okd .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* PR ラベル（ステマ規制対応: 必ず「PR」を明示する） */
.okd-pr {
  background: var(--okd-pr);
  border-radius: 4px;
  color: #fff;
  display: inline-block;
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1;
  margin-right: 0.6em;
  padding: 0.35em 0.6em;
  vertical-align: 0.15em;
}

/* ---------- 見出し ---------- */
.okd-head { margin-bottom: 16px; }
.okd-head__title { font-size: 2.2rem; font-weight: 700; line-height: 1.4; margin: 0 0 8px; }
.okd-head__area { color: var(--okd-main-text); }
.okd-head__count { font-size: 1.4rem; font-weight: 500; margin-left: 0.5em; color: var(--okd-sub); }
.okd-head__count b { color: var(--okd-text); font-size: 2rem; margin-right: 0.1em; }
.okd-head__lead { font-size: 1.45rem; }
.okd-head__note { color: var(--okd-sub); font-size: 1.2rem; margin-top: 6px; }
.okd-head__note a { color: inherit; }

/* ---------- 検索パネル ---------- */
.okd-panel {
  background: #fff;
  border: 2px solid var(--okd-pale);
  border-radius: var(--okd-radius);
  box-shadow: 0 4px 16px rgba(0, 104, 153, 0.06);
  margin-bottom: 20px;
  padding: 16px;
  scroll-margin-top: 90px;
}
.okd-panel__row + .okd-panel__row { border-top: 1px dashed var(--okd-line); margin-top: 14px; padding-top: 14px; }
.okd-panel__label { align-items: center; color: var(--okd-dark); display: flex; font-size: 1.4rem; font-weight: 700; gap: 6px; margin-bottom: 8px; }
.okd-panel__hint { color: var(--okd-sub); font-size: 1.15rem; margin-top: 6px; }

.okd-areas__current {
  align-items: center;
  background: var(--okd-pale);
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  font-size: 1.6rem;
  font-weight: 700;
  justify-content: space-between;
  list-style: none;
  padding: 10px 14px;
}
.okd-areas__current::-webkit-details-marker { display: none; }
.okd-areas__change { align-items: center; color: #006b9b; /* 薄い青の地の上なので、さらに濃く（2026-10-28） */ display: flex; font-size: 1.25rem; gap: 2px; }
.okd-areas[open] .okd-areas__change .okd-i { transform: rotate(180deg); }
.okd-areas__body { padding-top: 12px; }
.okd-areas__group { margin-top: 10px; }
.okd-areas__group:first-child { margin-top: 0; }
.okd-areas__region { color: var(--okd-sub); font-size: 1.2rem; font-weight: 700; margin-bottom: 4px; }
.okd-areas__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.okd-chip {
  align-items: baseline;
  background: #fff;
  border: 1px solid var(--okd-line);
  border-radius: 999px;
  color: inherit;
  display: inline-flex;
  font-size: 1.35rem;
  gap: 4px;
  min-height: 36px;
  padding: 6px 12px;
  text-decoration: none;
}
.okd-chip small { color: var(--okd-sub); font-size: 1.05rem; }
.okd-chip.is-current { background: var(--okd-main); border-color: var(--okd-main); color: #fff; }
.okd-chip.is-current small { color: rgba(255, 255, 255, 0.85); }
@media (hover: hover) { .okd-chip:hover { border-color: var(--okd-main); color: var(--okd-main-text); } .okd-chip.is-current:hover { color: #fff; } }

.okd-km { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; }
.okd-km__presets { display: flex; flex-wrap: wrap; gap: 6px; }
.okd-km__btn {
  background: #fff;
  border: 1px solid var(--okd-line);
  border-radius: 8px;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-size: 1.4rem;
  font-weight: 700;
  min-height: 40px;
  min-width: 56px;
  padding: 6px 10px;
}
.okd-km__btn.is-current { background: var(--okd-dark); border-color: var(--okd-dark); color: #fff; }
.okd-km__input { align-items: center; display: inline-flex; font-size: 1.4rem; gap: 4px; }
.okd-km__input input {
  border: 1px solid var(--okd-line);
  border-radius: 8px;
  font: inherit;
  font-size: 1.6rem; /* iOS のズームを防ぐため 16px 以上 */
  min-height: 40px;
  padding: 4px 8px;
  width: 80px;
}

.okd-opts { display: flex; flex-wrap: wrap; gap: 6px; }
.okd-opt {
  align-items: center;
  border: 1px solid var(--okd-line);
  border-radius: 999px;
  cursor: pointer;
  display: inline-flex;
  font-size: 1.3rem;
  gap: 4px;
  min-height: 36px;
  padding: 4px 12px;
  user-select: none;
}
.okd-opt input { position: absolute; opacity: 0; pointer-events: none; }
.okd-opt:has(input:checked) { background: var(--okd-pale); border-color: var(--okd-main); color: var(--okd-dark); font-weight: 700; }
.okd-opt:has(input:focus-visible) { outline: 2px solid var(--okd-main); outline-offset: 2px; }
.okd-opt--fav .okd-i { color: #e0457b; }

/* 件数と並び替え（一覧の真上。2026-10-28 に検索の箱の中から出した） */
.okd-bar { align-items: center; display: flex; flex-wrap: wrap; gap: 8px 14px; margin: 24px 0 14px; }
/* 箱の外では、入力欄のように目立たないように（白の丸い枠・普通の太さ） */
.okd-bar .okd-sort select { border: 1px solid var(--okd-line); border-radius: 999px; color: #333; font-size: 1.4rem; font-weight: 400; min-height: 36px; padding: 0 32px 0 14px; }
.okd-bar .okd-sort { margin-left: auto; }
.okd-panel__result { font-size: 1.4rem; }
.okd-panel__result b { color: var(--okd-main-text); font-size: 2rem; margin-right: 0.15em; }
.okd-sort select {
  appearance: none;
  background: #fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="m6 9 6 6 6-6" fill="none" stroke="%23006899" stroke-width="2"/></svg>') no-repeat right 10px center / 16px;
  border: 1px solid var(--okd-main);
  border-radius: 8px;
  color: var(--okd-dark);
  font: inherit;
  font-size: 1.6rem;
  font-weight: 700;
  min-height: 42px;
  padding: 6px 36px 6px 12px;
}
.okd-reset { background: none; border: 0; color: var(--okd-sub); cursor: pointer; font: inherit; font-size: 1.3rem; text-decoration: underline; }

/* スクロール時の要約バー（スマホのみ） */
.okd-mini {
  bottom: 0;
  left: 0;
  padding: 8px 12px calc(8px + env(safe-area-inset-bottom));
  position: fixed;
  right: 0;
  z-index: 50;
}
.okd-mini__btn {
  align-items: center;
  background: rgba(255, 255, 255, 0.97);
  border: 1px solid var(--okd-main);
  border-radius: 999px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
  color: var(--okd-text);
  cursor: pointer;
  display: flex;
  font: inherit;
  font-size: 1.3rem;
  gap: 8px;
  justify-content: space-between;
  margin: 0 auto;
  max-width: 560px;
  padding: 8px 8px 8px 16px;
  width: 100%;
}
.okd-mini__edit { background: var(--okd-main); border-radius: 999px; color: #fff; flex: none; font-weight: 700; padding: 4px 12px; }
@media (min-width: 960px) { .okd-mini { display: none !important; } }

/* ---------- 最近電話した ---------- */
.okd-recent { margin-bottom: 18px; }
.okd-recent__title { color: var(--okd-sub); font-size: 1.25rem; font-weight: 700; margin-bottom: 6px; }
.okd-recent__list { display: flex; flex-wrap: wrap; gap: 6px; }
.okd-recent__call {
  align-items: center;
  background: #fff;
  border: 1px solid var(--okd-call);
  border-radius: 999px;
  color: var(--okd-call);
  display: inline-flex;
  font-size: 1.35rem;
  font-weight: 700;
  min-height: 36px;
  padding: 4px 14px;
  text-decoration: none;
}
.okd-recent__call::before { content: "☎"; margin-right: 4px; }

/* ---------- PR枠 ---------- */
.okd-prslot {
  background: var(--okd-pr-pale);
  border: 1px solid #e3b7cd;
  border-radius: var(--okd-radius);
  margin-bottom: 24px;
  padding: 14px;
}
.okd-prslot__title { font-size: 1.5rem; font-weight: 700; margin: 0 0 10px; }
.okd-prslot__list { display: grid; gap: 12px; }
.okd-prslot__note { color: var(--okd-sub); font-size: 1.1rem; margin-top: 8px; }
@media (min-width: 769px) { .okd-prslot__list { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); } }

/* ---------- 一覧 ---------- */
.okd-list__grid { display: grid; gap: 14px; }
@media (min-width: 769px) { .okd-list__grid { grid-template-columns: 1fr 1fr; gap: 18px; } }
@media (min-width: 1200px) { .okd-list__grid { grid-template-columns: 1fr 1fr 1fr; } }
.okd-empty { background: #fff; border-radius: var(--okd-radius); padding: 40px 16px; text-align: center; }

/* ---------- カード ---------- */
.okd-card {
  background: #fff;
  border: 1px solid var(--okd-line);
  border-radius: var(--okd-radius);
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px;
  scroll-margin-top: 80px;
}
.okd-card--pr { border-color: #f1c79f; box-shadow: 0 2px 10px rgba(232, 118, 27, 0.08); }
.okd-card__prhead { align-items: center; display: flex; gap: 0; }
.okd-card__catch { color: var(--okd-pr); font-size: 1.35rem; font-weight: 700; }
.okd-card__photo img { aspect-ratio: 3 / 2; border-radius: 8px; display: block; height: auto; object-fit: cover; width: 100%; }

.okd-card__head { align-items: flex-start; display: flex; gap: 8px; justify-content: space-between; }
.okd-card__name { font-size: 1.8rem; font-weight: 700; line-height: 1.4; margin: 0; }
.okd-card__name a { color: inherit; text-decoration: none; }
@media (hover: hover) { .okd-card__name a:hover { color: var(--okd-main-text); text-decoration: underline; } }
.okd-fav {
  align-items: center;
  background: none;
  border: 1px solid var(--okd-line);
  border-radius: 50%;
  color: #b9b9b9;
  cursor: pointer;
  display: flex;
  flex: none;
  height: 40px;
  justify-content: center;
  padding: 0;
  width: 40px;
}
.okd-fav .okd-i { height: 20px; width: 20px; }
.okd-fav.is-on { border-color: #f3bfd1; color: #e0457b; }
.okd-fav .okd-i--heartf, .okd-fav.is-on .okd-i--heart { display: none; }
.okd-fav.is-on .okd-i--heartf { display: block; }

.okd-card__areas { align-items: center; display: flex; flex-wrap: wrap; gap: 4px; }
.okd-card__areas li { background: #f4f6f7; line-height: 1.6; border-radius: 4px; color: var(--okd-sub); font-size: 1.15rem; padding: 1px 8px; }
.okd-card__areas li.is-current { background: var(--okd-pale); color: var(--okd-dark); font-weight: 700; }

.okd-card__fare {
  align-items: center;
  background: #f8fbfd;
  border-radius: 10px;
  display: grid;
  gap: 4px 14px;
  grid-template-columns: auto 1fr;
  padding: 10px 12px;
}
.okd-est { border-right: 1px solid var(--okd-line); padding-right: 14px; text-align: center; }
.okd-est__label { color: var(--okd-sub); display: block; font-size: 1.15rem; }
.okd-est__val { color: var(--okd-dark); display: block; font-family: var(--f_en, sans-serif); font-size: 2.8rem; font-weight: 700; line-height: 1.1; white-space: nowrap; }
.okd-est__val small { font-family: var(--font_family, sans-serif); font-size: 1.3rem; margin-left: 2px; }
.okd-fare { display: grid; font-size: 1.3rem; gap: 2px; }
.okd-fare div { display: flex; gap: 6px; }
.okd-fare dt { color: var(--okd-sub); flex: none; font-size: 1.15rem; padding-top: 0.15em; width: 3.2em; }
.okd-fare dd { font-weight: 700; }
.okd-fare--none { align-items: center; color: var(--okd-sub); display: flex; font-size: 1.3rem; gap: 6px; grid-column: 1 / -1; }

.okd-facts { display: grid; font-size: 1.3rem; gap: 8px; }
.okd-facts li { align-items: flex-start; display: flex; gap: 8px; }
.okd-facts__k { align-items: center; color: var(--okd-sub); display: inline-flex; flex: none; font-size: 1.15rem; gap: 2px; padding-top: 0.1em; width: 5.4em; }

.okd-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.okd-tag { border: 1px solid var(--okd-main); border-radius: 4px; color: var(--okd-dark); font-size: 1.15rem; font-weight: 700; padding: 0 8px; }
.okd-tag--female { border-color: #e0457b; color: #c22e64; }

.okd-detail summary {
  align-items: center;
  color: var(--okd-main-text);
  cursor: pointer;
  display: inline-flex;
  font-size: 1.3rem;
  gap: 2px;
  list-style: none;
  min-height: 32px;
}
.okd-detail summary::-webkit-details-marker { display: none; }
.okd-detail[open] summary .okd-i { transform: rotate(180deg); }
.okd-raw { background: #fafafa; border-radius: 8px; display: grid; font-size: 1.3rem; gap: 8px; margin-top: 6px; padding: 10px 12px; }
.okd-raw dt { color: var(--okd-sub); font-size: 1.15rem; font-weight: 700; }
.okd-raw dd { overflow-wrap: anywhere; }
.okd-raw__note { color: var(--okd-sub); font-size: 1.1rem; margin-top: 6px; }

.okd-card__foot { display: grid; gap: 8px; margin-top: auto; }
.okd-call {
  align-items: center;
  background: var(--okd-call);
  border-radius: 999px;
  box-shadow: 0 3px 0 #06804a;
  color: #fff !important;
  display: flex;
  gap: 8px;
  justify-content: center;
  min-height: 52px;
  padding: 8px 16px;
  text-decoration: none !important;
  transition: transform 0.1s;
}
.okd-call:active { box-shadow: 0 1px 0 #06804a; transform: translateY(2px); }
.okd-call .okd-i { height: 20px; width: 20px; }
.okd-call__label { font-size: 1.6rem; font-weight: 700; }
.okd-call__num { font-family: var(--f_en, sans-serif); font-size: 1.6rem; letter-spacing: 0.03em; opacity: 0.95; }
.okd-links { display: flex; flex-wrap: wrap; gap: 6px; }
.okd-link { align-items: center; border: 1px solid var(--okd-line); border-radius: 999px; color: var(--okd-dark); display: inline-flex; font-size: 1.2rem; gap: 4px; padding: 3px 12px; text-decoration: none; }
.okd-link--line { border-color: #06c755; color: #047a34; }   /* 文字は読める濃さの緑（以前の #059c43 はコントラスト 3.6。2026-10-28） */
.okd-card__updated { color: var(--okd-sub); font-size: 1.1rem; text-align: right; }
.okd-card__updated.is-old { color: #9a5c00; text-align: left; }   /* 白地で読める濃さ（以前の #b26a00 は 4.2。2026-10-28） */

.okd-card.is-nofare .okd-card__fare { background: #fafafa; }

/* ---------- 広告 ---------- */
.okd-adslot { margin: 0 0 24px; }
.okd-adslot--bottom { margin: 28px 0 0; }
.okd-ad { margin: 0; }
.okd-ad__link { display: block; }
.okd-ad__img { border-radius: 10px; display: block; height: auto; width: 100%; }
.okd-ad--top .okd-ad__img, .okd-ad--bottom .okd-ad__img { aspect-ratio: 4 / 1; object-fit: cover; }
.okd-ad__label { color: var(--okd-sub); font-size: 1.1rem; margin-top: 4px; text-align: right; }
.okd-ad__label .okd-pr { font-size: 1rem; }
.okd-ad--infeed { align-self: start; background: #fff; border: 1px dashed #f1c79f; border-radius: var(--okd-radius); padding: 10px; }
.okd-ad--infeed .okd-ad__img { aspect-ratio: 3 / 2; object-fit: cover; }

/* ---------- 掲載について・事業者向け ---------- */
.okd-about { display: grid; gap: 8px; margin-top: 36px; }
.okd-about details { background: #fff; border: 1px solid var(--okd-line); border-radius: 10px; padding: 12px 16px; }
.okd-about summary { cursor: pointer; font-size: 1.4rem; font-weight: 700; }
.okd-about ul, .okd-about p { color: var(--okd-sub); font-size: 1.3rem; margin-top: 8px; }
.okd-about li { padding-left: 1em; text-indent: -1em; }
.okd-about li::before { content: "・"; }

.okd-biz { background: var(--okd-pale); border-radius: var(--okd-radius); margin-top: 24px; padding: 20px 16px; text-align: center; }
.okd-biz__title { font-size: 1.6rem; font-weight: 700; }
.okd-biz__text { font-size: 1.3rem; margin: 6px 0 12px; }
.okd-biz__btn { background: #fff; border: 2px solid var(--okd-main); border-radius: 999px; color: var(--okd-main-text); display: inline-block; font-weight: 700; padding: 8px 24px; text-decoration: none; }
.okd-updated { color: var(--okd-sub); font-size: 1.15rem; margin-top: 16px; text-align: right; }

/* ---------- 個別ページ ---------- */
.okd--single { max-width: 720px; padding-top: 24px; }
.okd-crumb { color: var(--okd-sub); font-size: 1.2rem; margin-bottom: 12px; }
.okd-crumb a { color: inherit; }
.okd-single__title { font-size: 2.4rem; font-weight: 700; margin: 0 0 14px; }
.okd--single .okd-card__name { display: none; }
.okd-related { margin-top: 32px; }
.okd-related__title { border-left: 4px solid var(--okd-main); font-size: 1.8rem; margin: 0 0 10px; padding-left: 10px; }
.okd-related__list li { border-bottom: 1px solid var(--okd-line); display: flex; font-size: 1.4rem; justify-content: space-between; padding: 10px 2px; }
.okd-related__list span { color: var(--okd-sub); font-size: 1.25rem; }
.okd-related__more { display: block; font-weight: 700; margin-top: 12px; text-align: right; }
.okd-single__note { color: var(--okd-sub); font-size: 1.2rem; margin-top: 28px; }

/* ---------- スマホ ---------- */
@media (max-width: 768px) {
  .okd-chip { font-size: 1.3rem; min-height: 34px; padding: 5px 10px; }
  .okd-areas__group { display: grid; gap: 4px 8px; grid-template-columns: 3em 1fr; margin-top: 8px; }
  .okd-areas__region { margin: 8px 0 0; }
}

/* ---------- PC ---------- */
@media (min-width: 769px) {
  /* PC でもスマホと同じ 22px。すぐ上の表題（h1「運転代行」30px）と大きさが近く、見出しが 2 段に見えていた（2026-10-27） */
  .okd-panel { padding: 20px 24px; }
  .okd-panel__row--km, .okd-panel__row--opts { align-items: center; display: grid; gap: 4px 16px; grid-template-columns: 11em 1fr; }
  .okd-panel__row--km .okd-panel__label, .okd-panel__row--opts .okd-panel__label { margin: 0; }
  .okd-panel__row--km .okd-panel__hint { grid-column: 2; margin: 0; }
  /* エリアの選択肢を詰める（2026-10-28 洋介さんの指摘「チップのスペースを取りすぎ」）。地域名は行の高さの中央に */
  .okd-areas__body { padding-top: 10px; }
  .okd-areas__group { align-items: center; display: grid; gap: 6px 8px; grid-template-columns: 4em 1fr; margin-top: 6px; }
  .okd-areas__region { margin: 0; }
  .okd-areas__chips { gap: 6px; }
  .okd-chip { align-items: center; font-size: 1.3rem; min-height: 30px; padding: 3px 11px; }
  /* 箱の中の部品の高さを 2 段にそろえる：チップ 30〜32px、距離のボタンと入力欄 36px（以前は 30／36／40／48px とばらばら） */
  .okd-opt { min-height: 32px; }
  .okd-km__btn { border-radius: 999px; min-height: 36px; padding: 0 14px; }
  .okd-km__input input { height: 36px; min-height: 36px; padding: 0 10px; width: 5em; }
}

@media (prefers-reduced-motion: reduce) { .okd * { scroll-behavior: auto !important; transition: none !important; } }

/* ==========================================================
   作り直し版：サイトのトンマナに合わせる（2026-10-27）
   地 #f2f8f7 の上に白い角丸カード（10px・枠線なし）、黒の丸ボタン、選択中は黒（エリア）・ピンク（距離・条件）。
   「PR」はサイトの赤（ローズ #d23e69）。数字は英字の書体 Fredoka（var(--f_en)）。イベント検索の部品に合わせた
   ========================================================== */
.okd {
  --okd-pr: #d23e69;
  --okd-pr-pale: #fbeef2;
  --okd-call: #333;
  --okd-radius: 10px;
}
.okd-panel { border: 0; }
.okd-card { border: 0; }
.okd-card--pr { border: 1px solid #e3b7cd; box-shadow: none; }
.okd-chip.is-current { background: #333; border-color: #333; }
.okd-chip { border-color: #9a9a9a; }
@media (hover: hover) { .okd-chip:hover { border-color: #333; color: #333; } }
.okd-km__btn.is-current { background: #f7e3ec; border-color: #e3b7cd; color: #333; font-weight: 700; }
.okd-opt:has(input:checked) { background: #f7e3ec; border-color: #e3b7cd; color: #333; }
.okd-mini__edit { background: #333; }
.okd-call { box-shadow: none; }
.okd-call:active { box-shadow: none; transform: translateY(1px); }
.okd-call:hover { opacity: 0.85; }
.okd-fav.is-on { border-color: #e3b7cd; color: #d23e69; }
.okd-tag--female { border-color: #d23e69; color: #d23e69; }
.okd-est__num,
.okd-head__count b,
.okd-panel__result b,
.okd-chip small { font-family: var(--f_en); }
/* スマホ：エリアの選択肢は 3 列のマス目（イベント検索と同じ。行の途中で変な所で折り返さない） */
@media (max-width: 599.8px) {
  .okd-areas__chips { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .okd-areas__chips .okd-chip { justify-content: center; padding: 6px 4px; white-space: nowrap; }
  .okd-areas__chips .okd-chip.is-long { grid-column: span 2; }
  /* 地域名（那覇・南部…）は、マス目の上に置く（横に置くと、マス目が狭くなって名前が折り返す） */
  .okd-areas__group { display: block; }
  .okd-areas__region { margin-bottom: 6px; }
  .okd-km__presets { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .okd-km__btn { padding-left: 0; padding-right: 0; }
}
/* 事業者向けの案内：ボタン 2 つ */
.okd-biz__btns { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 14px; }
.okd-biz__btns .okd-biz__btn { margin-top: 0; }
.okd-biz__btn--sub { background: #fff !important; border: 1px solid #333; color: #333 !important; }

/* 作り直し版：「さらに表示」と、画面の外のカードの描画を後回しにする指定（194 社を並べても重くならないように） */
.okd-card.is-more { display: none; }
.okd-list__grid > .okd-card { content-visibility: auto; contain-intrinsic-size: auto 600px; }
.okd-more { margin-top: 20px; text-align: center; }
.okd-more__btn {
  background: #fff;
  border: 1px solid #333;
  border-radius: 3em;
  color: #333;
  cursor: pointer;
  font: inherit;
  font-size: 1.5rem;
  font-weight: 700;
  min-height: 48px;
  padding: 0 28px;
}
.okd-more__btn small { font-size: 1.2rem; font-weight: 400; margin-left: 4px; }
.okd-more__btn:hover { background: #f7e3ec; }