/* ------------------------------------------------------------------
   大井川鐵道 時刻表
   現行ページの配色をそのまま引き継いでいます。
   色・字送り・縦書きの調整はこのファイルだけで完結します。
   入力する人がHTMLやstyleを書く必要はありません。
------------------------------------------------------------------ */

.ott {
  /* 現行ページの配色 */
  --ott-head-bg:    #2b3a60;   /* 見出し・列車名の濃紺 */
  --ott-head-fg:    #ffffff;
  --ott-reserve-bg: #dcf3fc;   /* ご予約行 */
  --ott-opday-bg:   #fcfcd2;   /* 運転日行 */
  --ott-opday-fg:   #d40000;
  --ott-station-bg: #e6e5ea;   /* 駅名列 */
  --ott-body-bg:    #ffffff;
  --ott-text:       #222222;
  --ott-muted:      #5a6069;
  --ott-border:     #ffffff;   /* 見出し部の罫線（現行は白） */
  --ott-rule:       #cfd4da;   /* 本文部の罫線 */

  /* 運転日が限られる列車（臨時列車）の見分け */
  --ott-extra-bg:   #fffdf2;   /* その列にうっすら敷く色 */
  --ott-extra-fg:   #2b3a60;   /* 「運転日限定」の文字 */
  --ott-extra-tag:  #ffd966;   /* 「運転日限定」の下地 */

  /* 種別（現行の traintype-* を踏襲） */
  --ott-express:       #ff0000;  /* 急行 */
  --ott-rapid-express: #ff5100;  /* 快速急行 */
  --ott-sect-express:  #4f9086;  /* 区間急行 */
  --ott-ltd:           #0096d9;  /* 特急 */
  --ott-bus:           #6b21a8;

  --ott-time-w: 50px;
  --ott-station-w: 152px;
  --ott-name-min: 6em;   /* 列車名（縦書き）の最低の高さ。ふだんは名前の長さに合わせて自動で伸びます */
  --ott-name-max: 13em;  /* 列車名の高さの上限。これを超える長い名前は、2列に折り返します */
  --ott-cell-y: 4px;     /* 表の行の詰め具合。ここを増やすと全体がゆったりします */

  margin: 1.5em 0;
  color: var(--ott-text);
  font-size: 13px;
  line-height: 1.35;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .ott {
    --ott-reserve-bg: #16323d;
    --ott-opday-bg:   #33301a;
    --ott-opday-fg:   #ff9b8f;
    --ott-station-bg: #262a31;
    --ott-body-bg:    #1b1f23;
    --ott-text:       #e9e6e0;
    --ott-muted:      #9aa3ac;
    --ott-border:     #46506b;
    --ott-rule:       #3a4048;
    --ott-extra-bg:   #232014;
    --ott-extra-fg:   #1b1f23;
    --ott-extra-tag:  #d6b64a;
    --ott-express:       #ff6b5e;
    --ott-rapid-express: #ff8f4d;
    --ott-sect-express:  #79b7ac;
    --ott-ltd:           #55bdf0;
  }
}
:root[data-theme="dark"] .ott {
  --ott-reserve-bg: #16323d;
  --ott-opday-bg:   #33301a;
  --ott-opday-fg:   #ff9b8f;
  --ott-station-bg: #262a31;
  --ott-body-bg:    #1b1f23;
  --ott-text:       #e9e6e0;
  --ott-muted:      #9aa3ac;
  --ott-border:     #46506b;
  --ott-rule:       #3a4048;
  --ott-extra-bg:   #232014;
  --ott-extra-fg:   #1b1f23;
  --ott-extra-tag:  #d6b64a;
  --ott-express:       #ff6b5e;
  --ott-rapid-express: #ff8f4d;
  --ott-sect-express:  #79b7ac;
  --ott-ltd:           #55bdf0;
}

/* ---- スクロール枠 ---- */
.ott-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--ott-rule);
  position: relative;
}
.ott-scroll:focus-visible { outline: 2px solid var(--ott-ltd); outline-offset: 2px; }


/* ---- 表本体 ---- */
.ott .ott-table {
  border-collapse: separate;
  border-spacing: 0;
  table-layout: auto;
  width: auto;      /* 列数に応じた自然な幅。画面が広くても間延びしません */
  max-width: none;
  margin: 0;
  font-size: inherit;
}
/*
 * 表の見出し（caption）
 * 画面には出しません。読み上げソフトや検索エンジンには残ります。
 * 出したいときは、この1か所を消してください。
 */
.ott-caption {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.ott .ott-table th,
.ott .ott-table td {
  padding: var(--ott-cell-y) 3px;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
  font-size: inherit;
  line-height: inherit;
  color: var(--ott-text);
  background: var(--ott-body-bg);
  /* 罫線はすべてここで引きます。テーマ側の table 指定に左右されません */
  border: 0;
  border-bottom: 1px solid var(--ott-rule);
  border-right: 1px solid var(--ott-rule);
}
.ott .ott-table tr > *:last-child { border-right: 0; }
.ott-table td { width: var(--ott-time-w); min-width: var(--ott-time-w); }

/* ---- 左端の見出し列を固定 ---- */
.ott .ott-table th[scope="row"] {
  position: sticky;
  left: 0;
  z-index: 2;
  width: var(--ott-station-w);
  min-width: var(--ott-station-w);
  text-align: center;
  font-weight: 700;
  font-size: .84em;
  border-right: 2px solid var(--ott-rule);
}
/* 駅名だけは左そろえ（読みやすさのため） */
.ott .ott-r-stop th[scope="row"] { text-align: left; }

/* ---- 見出し3行（濃紺） ---- */
.ott .ott-r-head th, .ott .ott-r-head td,
.ott .ott-r-name th, .ott .ott-r-name td,
.ott .ott-r-vehicle th, .ott .ott-r-vehicle td {
  background: var(--ott-head-bg);
  color: var(--ott-head-fg);
  border-bottom: 1px solid var(--ott-border);
  border-right: 1px solid var(--ott-border);
}
/* 見出しは3行で1かたまりに見せたいので、途中の横罫線は控えめにします */
.ott-r-head th, .ott-r-head td,
.ott-r-name th, .ott-r-name td { border-bottom-color: rgba(255,255,255,.35); }
.ott-r-name th, .ott-r-name td { border-top: 0; }
.ott-r-head th[scope="row"],
.ott-r-name th[scope="row"],
.ott-r-vehicle th[scope="row"] { border-right: 2px solid var(--ott-border); }

.ott .ott-r-head td { line-height: 1.2; padding: 5px 3px; }
.ott-no { display: block; font-size: .92em; font-variant-numeric: tabular-nums; }
.ott-type {
  display: block;
  margin-top: 3px;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.5;
  background: #fff;
  border: 3px double currentColor;
  color: #333;
}
.ott-type.is-express       { color: var(--ott-express); }
.ott-type.is-rapid-express { color: var(--ott-rapid-express); }
.ott-type.is-sect-express  { color: var(--ott-sect-express); }
.ott-type.is-ltd           { color: var(--ott-ltd); }
.ott-type.is-bus           { color: var(--ott-bus); }
.ott-type.is-local         { border: 0; background: none; color: var(--ott-head-fg); font-weight: 400; }

/* 列車名（縦書き）。<br>を1文字ずつ並べる必要はありません */
.ott .ott-r-name td { height: auto; padding: 4px 2px; }
.ott-r-name .ott-name { min-height: var(--ott-name-min); }
.ott-r-name th[scope="row"] .ott-vert { font-size: 1em; }
.ott-vert {
  writing-mode: vertical-rl;
  text-orientation: upright;   /* 日本語は1文字ずつ立てます */
  display: inline-block;
  line-height: 1.02;
  font-weight: 700;
  font-size: .92em;
  letter-spacing: 0;
  padding: 0;
  /* 長すぎる名前は、上限の高さで折り返して2列にします */
  max-height: var(--ott-name-max);
  white-space: normal;
}

/*
 * 英語などラテン文字の列車名
 * 1文字ずつ立てると細長くなりすぎるので、文字を90度倒して読ませます。
 * 上限の高さを超えたら、単語の切れ目で折り返します。
 */
.ott-vert.is-lat {
  text-orientation: mixed;
  line-height: 1.2;
  word-break: normal;
  overflow-wrap: anywhere;
}

/*
 * 縦中横
 * 「51号」の「51」を、1文字ずつ縦に並べず横に並べて1行分に収めます。
 */
.ott-tcy {
  -webkit-text-combine: horizontal;
  text-combine-upright: all;
}
.ott-name a { text-decoration: none; display: block; color: inherit; }
.ott-name a:hover .ott-vert { text-decoration: underline; }

.ott-ico { vertical-align: middle; margin: 0 1px; width: 24px; height: 24px; object-fit: contain; }
.ott .ott-r-vehicle td { white-space: normal; line-height: 1.2; padding: 3px 2px; }
.ott-ico-text { font-size: .76em; display: inline-block; }
.ott-ico-text + .ott-ico-text::before { content: '\A'; white-space: pre; }

.ott .ott-table a { color: inherit; }

/* ---- ご予約 ---- */
.ott .ott-r-reserve th, .ott .ott-r-reserve td {
  background: var(--ott-reserve-bg);
  color: var(--ott-text);
}
.ott-btn {
  display: inline-block;
  padding: .15em .5em;
  border: 1px solid var(--ott-rule);
  border-radius: 3px;
  background: #f6f6f6;
  color: #222 !important;
  font-size: .75em;
  text-decoration: none;
  white-space: nowrap;
}
.ott-mark { font-weight: 700; }
.ott-tel {
  display: block;
  margin-top: 2px;
  font-size: .8em;
  font-weight: 700;
  white-space: nowrap;
  color: inherit;
  text-decoration: none;
  font-variant-numeric: tabular-nums;
}
.ott-tel:hover { text-decoration: underline; }
.ott-telnote { display: block; font-size: .68em; color: var(--ott-muted); }

/* ---- 運転日 ---- */
.ott .ott-r-opdays th, .ott .ott-r-opdays td {
  background: var(--ott-opday-bg);
  color: var(--ott-text);
  font-size: .78em;
}
.ott-r-opdays th[scope="row"] { color: var(--ott-opday-fg); }
.ott-r-opdays .ott-sub { display: block; font-size: .85em; font-weight: 400; }
.ott-openday {
  font: inherit;
  padding: .15em .45em;
  border: 1px solid #9aa0a6;
  border-radius: 3px;
  background: #fff;
  color: #222;
  cursor: pointer;
  white-space: nowrap;
}
.ott-openday:hover { background: #eef1f5; }
.ott-r-opdays a { color: inherit; }

/* ---- 駅と時刻 ---- */
.ott .ott-station {
  background: var(--ott-station-bg) !important;
  color: var(--ott-text);
  display: flex;
  align-items: center;
  gap: 6px;
  line-height: 1.15;
  padding: 3px 6px;
  border-right: 2px solid var(--ott-rule);
  min-height: 0;
}
.ott-staname { flex: 1 1 auto; min-width: 0; }
.ott-kana { display: block; font-size: .7em; font-weight: 400; line-height: 1.1; color: var(--ott-muted); }
.ott-sta  { display: block; font-size: 1.05em; line-height: 1.15; }
.ott-ad   { flex: none; font-size: .8em; font-weight: 400; color: var(--ott-muted); }

.ott-time { font-variant-numeric: tabular-nums; }
.ott-time.is-pass,
.ott-time.is-none,
.ott-time.is-detour { color: #767d86; }
.ott-cellnote { font-size: .62em; vertical-align: super; margin-left: 1px; color: var(--ott-muted); }

.ott .ott-r-gap th {
  background: var(--ott-station-bg);
  color: var(--ott-muted);
  font-size: .78em;
  font-weight: 400;
  text-align: center;
  padding: .5em;
  position: static;
  width: auto;
  min-width: 0;
  /*
   * 表の幅に収まらない長さのときは、折り返して2行・3行にします。
   *
   * 1行のままにすると、この行の長さに合わせて表全体が横に広がり、
   * 時刻の列まで引き伸ばされてしまいます（英文だと特に目立ちます）。
   * 折り返せば、表の幅は時刻の列だけで決まります。
   * 表の幅に収まる短い文は、これまでどおり1行のままです。
   */
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.45;
}

/* ---- 注記など ---- */
.ott-notes {
  list-style: none;
  margin: .7em 0 0;
  padding: 0;
  font-size: .82em;
  color: var(--ott-muted);
}
.ott-notes li { margin: .2em 0; }
.ott-note-key { font-weight: 700; margin-right: .4em; }
.ott-freenote {
  margin: .6em 0 0;
  font-size: .82em;
  line-height: 1.75;
  color: var(--ott-muted);
}
.ott-updated { margin: .4em 0 0; font-size: .75em; color: var(--ott-muted); text-align: right; }

.ott-empty {
  padding: .8em 1em;
  border: 1px dashed #c0392b;
  color: #c0392b;
  border-radius: 4px;
}

/* ---- 改正予告・切替タブ ---- */
.ott-notice {
  margin: 1em 0;
  padding: .7em 1em;
  border-left: 4px solid #d97706;
  background: #fff8ec;
  color: #4a3411;
  font-weight: 600;
}
.ott-notice-link { margin-left: .5em; }

.ott-tabs { display: flex; gap: .5em; margin: 1em 0; flex-wrap: wrap; }
.ott-tab {
  display: inline-block;
  padding: .5em 1.2em;
  border: 1px solid #cfd4da;
  border-radius: 999px;
  text-decoration: none;
  background: #fff;
  color: #333;
  font-weight: 600;
}
.ott-tab.is-active { background: #2b3a60; border-color: #2b3a60; color: #fff; }

/* ---- 運転日カレンダーのモーダル ---- */
.ott-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(0,0,0,.6);
  overflow-y: auto;
  padding: 20px 10px;
}
.ott-modal[hidden] { display: none !important; }
.ott-modal-box {
  background: #fff;
  color: #222;
  margin: auto;
  padding: 22px 22px 26px;
  width: 95%;
  max-width: 1000px;
  border-radius: 8px;
  max-height: 90vh;
  overflow-y: auto;
  position: relative;
}
.ott-modal-close {
  position: absolute;
  top: 8px; right: 12px;
  border: 0;
  background: none;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  color: #666;
}
.ott-modal-title { font-size: 20px; margin: 0 30px 10px 0; }
.ott-modal-lead { font-size: 14px; margin: 0 0 6px; }
.ott-modal-trains { font-size: 14px; font-weight: 700; margin: 0 0 14px; }
.ott-modal-cals { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 16px; }

.ott-cal h4 {
  margin: 0 0 6px;
  font-size: 15px;
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.ott-cal-cnt { margin-left: auto; font-size: 12px; font-weight: 400; color: #666; }
.ott-cal table { border-collapse: collapse; width: 100%; table-layout: fixed; }
.ott-cal th {
  font-size: 11px;
  font-weight: 500;
  color: #666;
  padding: 2px 0 5px;
}
.ott-cal td {
  border: 1px solid #e4e6ea;
  height: 38px;
  vertical-align: top;
  padding: 2px 3px;
  position: relative;
  text-align: left;
}
.ott-cal .ott-d { font-size: 11px; color: #666; font-variant-numeric: tabular-nums; }
.ott-cal .ott-check {
  position: absolute;
  inset: 8px 0 0 0;
  display: grid;
  place-items: center;
  font-size: 17px;
  font-weight: 700;
  color: #c0392b;
}
.ott-cal td.is-on { background: #fdf1ef; }
.ott-cal .ott-w0, .ott-cal th.ott-w0 { color: #c0392b; }
.ott-cal .ott-w6, .ott-cal th.ott-w6 { color: #1c6ea4; }
.ott-cal td.ott-w0 .ott-d { color: #c0392b; }
.ott-cal td.ott-w6 .ott-d { color: #1c6ea4; }

/* ==================================================================
   表示する列車の絞り込み
   「毎日運転のみ」はCSSだけで効きます（JavaScriptが無くても動きます）。
   「本日運転」はその日に走る列車をJavaScriptが判断し、
   #ott-fstyle に列ごとの規則を書き込みます。
================================================================== */

.ott-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 0 0 .5em;
  font-size: .92em;
}
.ott-filter-lb {
  font-weight: 700;
  color: var(--ott-muted);
  margin-right: .2em;
}
.ott-fbtn {
  font: inherit;
  padding: .3em .8em;
  border: 1px solid var(--ott-rule);
  border-radius: 999px;
  background: var(--ott-body-bg);
  color: var(--ott-text);
  cursor: pointer;
  white-space: nowrap;
  line-height: 1.4;
}
.ott-fbtn:hover { background: #eef1f5; }
.ott-fbtn.is-on {
  background: var(--ott-head-bg);
  border-color: var(--ott-head-bg);
  color: var(--ott-head-fg);
  font-weight: 700;
}
.ott-fbtn:focus-visible { outline: 2px solid var(--ott-ltd); outline-offset: 2px; }

/* 「毎日運転のみ」…運転日の限られた列を隠します */
.ott.is-f-daily .ott-col.is-extra { display: none; }

/* 絞り込みで中身が空になった行（列車名など）はたたみます */
.ott .ott-table tr[hidden] { display: none; }

/* 運転日が限られる列車の目印 */
.ott-limited {
  display: block;
  margin-top: 3px;
  font-size: 9px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: .02em;
  color: var(--ott-extra-fg);
  background: var(--ott-extra-tag);
  border-radius: 2px;
}
/*
 * 限定の列は、出ているあいだ うっすら色を敷いて定期列車と区別します。
 * 色を敷くのは時刻のマスだけです。
 * 見出しの3行（列車番号・列車名・車両・設備）は濃紺のひとかたまりなので、
 * ここに色を入れると帯が途切れて見えます。
 */
.ott:not(.is-f-daily) .ott-col.is-extra.ott-time { background: var(--ott-extra-bg); }

/* 次の運転日（JavaScriptが入れます） */
.ott-nextday {
  display: block;
  margin-top: 2px;
  font-size: .9em;
  color: var(--ott-muted);
  white-space: nowrap;
}

/* 日付で選ぶ欄 */
.ott-fdate {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: 4px;
  padding-left: 10px;
  border-left: 1px solid var(--ott-rule);
}
.ott-fdate-lb { color: var(--ott-muted); }
.ott-fdate-in {
  font: inherit;
  padding: .22em .4em;
  border: 1px solid var(--ott-rule);
  border-radius: 5px;
  background: var(--ott-body-bg);
  color: var(--ott-text);
  min-height: 1.9em;
}
.ott-fdate-in:focus-visible { outline: 2px solid var(--ott-ltd); outline-offset: 1px; }
.ott.is-f-date .ott-fdate-in {
  border-color: var(--ott-head-bg);
  box-shadow: 0 0 0 2px rgba(43, 58, 96, .15);
}
.ott-fclear {
  font: inherit;
  font-size: .9em;
  padding: .2em .6em;
  border: 1px solid var(--ott-rule);
  border-radius: 999px;
  background: var(--ott-body-bg);
  color: var(--ott-muted);
  cursor: pointer;
}
.ott-fclear:hover { background: #eef1f5; }

/* 「まだ決まっていません」の断り書き */
.ott-tbd {
  margin: 0 0 .6em;
  padding: .7em 1em;
  background: #eef4fb;
  border-left: 4px solid #2b3a60;
  color: #24334f;
  font-size: .9em;
  line-height: 1.7;
}

.ott-nohit {
  margin: .6em 0 0;
  padding: .7em 1em;
  background: #fff8ec;
  border-left: 4px solid #d97706;
  color: #4a3411;
  font-size: .9em;
}

/* ---- スマートフォン ---- */
@media (max-width: 600px) {
  .ott {
    font-size: 13px;
    --ott-time-w: 46px;
    --ott-station-w: 104px;
    --ott-name-h: 11.5em;
  }
  .ott-vert { font-size: .85em; }
  .ott-ico { width: 20px; height: 20px; }
  .ott-filter { font-size: .85em; }
  .ott-filter-lb { width: 100%; margin: 0 0 .1em; }
  /* 日付の欄は幅を食うので、スマホでは行を変えます */
  .ott-fdate { margin-left: 0; padding-left: 0; border-left: 0; width: 100%; }
}

@media print {
  .ott-scroll { overflow: visible; border: 0; }
  .ott-table th[scope="row"] { position: static; }
  .ott-modal { display: none !important; }
  /* 紙にはすべての列車を出します */
  .ott-filter, .ott-nohit, .ott-tbd { display: none !important; }
  .ott.is-f-daily .ott-col.is-extra { display: table-cell !important; }
  .ott .ott-table tr[hidden] { display: table-row !important; }
}

/* ==================================================================
   時刻表ページテンプレート（page-timetable.php）
   ページ全体の骨格。既存テーマの見た目と合わない場合は
   この節だけを調整してください。
================================================================== */

.ott-page-inner {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 16px 64px;
  color: #222;
}
:root[data-theme="dark"] .ott-page-inner { color: #e9e6e0; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .ott-page-inner { color: #e9e6e0; }
}

.ott-page-title { font-size: 26px; margin: 24px 0 8px; line-height: 1.4; }
.ott-sec { margin: 40px 0; }
.ott-h2 {
  font-size: 20px;
  margin: 0 0 14px;
  padding: 10px 14px;
  background: #2b3a60;
  color: #fff;
  border-radius: 3px;
}
.ott-h3 { font-size: 17px; margin: 28px 0 10px; }
.ott-h4 { font-size: 15px; margin: 20px 0 8px; }

.ott-routemap img { max-width: 100%; height: auto; }

/* お知らせの帯 */
.ott-notice-box {
  display: flex;
  align-items: stretch;
  border: 1px solid #cfd4da;
  border-radius: 3px;
  overflow: hidden;
  font-size: 14px;
}
.ott-notice-label {
  flex: none;
  width: 100px;
  margin: 0;
  padding: 16px 8px;
  background: #2b3a60;
  color: #fff;
  font-size: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ott-notice-body { padding: 14px 16px; }
.ott-notice-body p { margin: 0 0 .5em; }
.ott-notice-body p:last-child { margin-bottom: 0; }
@media (max-width: 520px) {
  .ott-notice-box { display: block; }
  .ott-notice-label { width: auto; padding: 8px; }
}

.ott-caution-text { color: #c0392b; font-weight: 700; }

.ott-linkbtn { margin: 12px 0; }
.ott-linkbtn a {
  display: inline-block;
  padding: .7em 1.6em;
  background: #2b3a60;
  color: #fff !important;
  text-decoration: none;
  border-radius: 3px;
  font-size: 14px;
  font-weight: 700;
}
.ott-linkbtn a:hover { background: #3b4d7d; }

/* 記号の説明 */
.ott-legend-list {
  display: grid;
  grid-template-columns: 5.5em 1fr;
  gap: 6px 14px;
  margin: 0;
  font-size: 14px;
}
.ott-legend-list dt { font-weight: 700; text-align: center; }
.ott-legend-list dd { margin: 0; }
.ott-legend-note { font-size: 13px; color: #6b7280; margin: 10px 0 0; }

/* 運転日凡例 */
.ott-legend-table { border-collapse: collapse; width: 100%; font-size: 14px; }
.ott-legend-table th, .ott-legend-table td {
  border: 1px solid #cfd4da;
  padding: 8px 10px;
  text-align: left;
}
.ott-legend-table thead th { background: #2b3a60; color: #fff; }

/* 免責事項 */
.ott-disclaimer {
  border: 1px solid #cfd4da;
  background: #f7f8f9;
  padding: 14px 16px;
  font-size: 13px;
  line-height: 1.8;
  margin: 14px 0;
}
:root[data-theme="dark"] .ott-disclaimer { background: #22262b; border-color: #3a4048; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .ott-disclaimer { background: #22262b; border-color: #3a4048; }
}
.ott-disclaimer p { margin: 0 0 .6em; }
.ott-disclaimer p:last-child { margin-bottom: 0; }
.ott-disclaimer-title { font-weight: 700; }

/* 運賃表 */
.ott-fare-table { border-collapse: collapse; font-size: 13px; }
.ott-fare-table th, .ott-fare-table td {
  border: 1px solid #cfd4da;
  padding: 5px 6px;
  text-align: center;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.ott-fare-station { background: #2b3a60; color: #fff; font-size: 12px; }
.ott-fare-child { color: #e07b39; }
.ott-fare-adult { color: #2b3a60; }

.ott-fare-sp { display: none; }
.ott-fare-sp details { border: 1px solid #cfd4da; margin-bottom: 8px; }
.ott-fare-sp summary {
  cursor: pointer;
  padding: 10px 14px;
  background: #eef0f3;
  font-weight: 700;
  font-size: 14px;
}
.ott-fare-list { border-collapse: collapse; width: 100%; font-size: 14px; }
.ott-fare-list th, .ott-fare-list td {
  border: 1px solid #cfd4da;
  padding: 6px 10px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.ott-fare-list thead th { background: #2b3a60; color: #fff; }

@media (max-width: 760px) {
  .ott-fare-pc { display: none; }
  .ott-fare-sp { display: block; }
}

/* 急行料金 */
.ott-surcharge { border-collapse: collapse; font-size: 14px; margin: 10px 0; }
.ott-surcharge th, .ott-surcharge td {
  border: 1px solid #2b3a60;
  padding: 7px 14px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.ott-surcharge thead th { background: #2b3a60; color: #fff; }

.ott-extra img { max-width: 100%; height: auto; }

.ott-fare-note-pc { display: block; }
@media (max-width: 760px) { .ott-fare-note-pc { display: none; } }

/* アイコン（画像が無いときの図） */
.ott-ico-svg { display: inline-block; width: 24px; height: 24px; line-height: 0; }
.ott-ico-svg svg { display: block; width: 24px; height: 24px; }