/* ============================================================
   OUTLAWER STRENGTH：使いやすさの改善（2026-10-15）
   既存スキン（skin/reli/）の上に重ねるだけ。消せば元の見た目に戻る。
   ============================================================ */

/* ---- 1. パソコンの上部メニュー：3段に折り返していたのを1段に ----
   補足ページ（os-nav-sub）はパソコンでは隠し、下部の一覧から行けるようにする。
   スマホのメニュー（三本線）では全部を出す。 */
.navbar-default .list1 > li.os-nav-book { display: none; }

@media (min-width: 768px) {
  .navbar-default .list1 > li.os-nav-sub { display: none; }
  .navbar-default .list1 > li > a { padding: 15px 11px; font-size: 14px; }
  .navbar-default .list1 > li.os-nav-book { display: block; margin-left: 6px; }
  .navbar-default .list1 > li.os-nav-book > a {
    margin: 8px 0;
    padding: 7px 16px;
    border-radius: 4px;
    background: #131416;
    color: #fff;
  }
  .navbar-default .list1 > li.os-nav-book > a:hover { background: #3a3c40; color: #fff; }
}

/* ---- 2. トップの写真の上：何の店か・いくらか・いつ開いているかを最初に見せる ---- */
.os-hero-lead {
  margin: 4px 0 0;
  font-size: 15px;
  line-height: 1.9;
  letter-spacing: .06em;
  text-shadow: 0 1px 6px rgba(0, 0, 0, .55);
}
.os-hero-cta { margin: 22px 0 0; }
.os-hero-cta a {
  display: inline-block;
  min-width: 220px;
  padding: 13px 26px;
  border: 1px solid #fff;
  border-radius: 4px;
  background: rgba(19, 20, 22, .72);
  color: #fff;
  font-size: 15px;
  letter-spacing: .08em;
  text-decoration: none;
}
.os-hero-cta a:hover { background: #fff; color: #131416; text-decoration: none; }
@media (min-width: 768px) {
  .os-hero-lead { font-size: 17px; }
}

/* ---- 3. 下部の一覧：全ページへの入口を、まとまりごとに並べる ---- */
.os-footnav { display: flex; flex-wrap: wrap; gap: 18px 36px; margin: 8px 0 0; font-size: 13px; }
.os-footnav > div { min-width: 140px; }
.os-footnav p { margin: 0 0 6px; color: #888; font-size: 11px; letter-spacing: .1em; }
.os-footnav ul { margin: 0; padding: 0; list-style: none; }
.os-footnav li { margin: 0 0 6px; }
.os-footnav a { color: inherit; }

/* ---- 4. 本文の「関連する記事」 ---- */
.os-related { margin: 8px 0 0; padding: 16px 18px; border-left: 3px solid #131416; background: #f6f5f2; }
.os-related p { margin: 0 0 8px; font-weight: bold; }
.os-related ul { margin: 0; padding-left: 1.2em; }
.os-related li { margin: 0 0 6px; }

/* スマホでは料金と営業時間を2行に分け、写真の上のボタンは出さない（画面下の固定ボタンと重なるため） */
.os-hero-lead span { display: inline-block; white-space: nowrap; }
@media (max-width: 767px) {
  .os-hero-sep { display: none !important; }
  .os-hero-lead span:not(.os-hero-sep) { display: block; }
  .os-hero-cta { display: none; }
}

/* タブレット幅（768〜991px）でも1段に収める */
@media (min-width: 768px) and (max-width: 991px) {
  .navbar-default .list1 > li > a { padding: 15px 6px; font-size: 12.5px; }
  .navbar-default .list1 > li.os-nav-book > a { padding: 7px 10px; }
}