/* とらちゃん 改修CSS v1 / 2026-08-31
 * 管理画面「共通CSS編集 (style.css)」の末尾に追加。
 * 既存CSSは残す。custom.css は自動生成のため直接編集しない。
 * 既存の !important に対抗する箇所のみ !important を使用。
 * 写真URLはここへ記入しない。画像は各ブロックの管理画面で指定。
 */
:root {
  --tc-cream:#fffaf0; --tc-paper:#f7eddc; --tc-brown:#472d20;
  --tc-muted:#705442; --tc-yellow:#f4c542; --tc-line:#dfcdb5;
  --tc-hero-height:300px;
  --bg-base:var(--tc-cream); --bg-paper:#fffdf7; --bg-warm:var(--tc-paper);
  --ink:var(--tc-brown); --text-main:var(--tc-brown); --text-sub:var(--tc-muted);
  --text-muted:var(--tc-muted); --gold:#916619; --gold-light:#68421e;
  --line:var(--tc-line); --line-dark:var(--tc-line);
  --text-on-dark:#fffaf0; --text-on-dark-muted:#f5e5ca;
  --font-sans:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
}
html {font-size:16px; scroll-padding-top:110px; overflow-x:clip;}
body {background:var(--tc-cream); color:var(--tc-brown); font-size:16px; overflow-x:clip;}
body :is(h1,h2,h3,h4,h5,h6) {line-break:strict; word-break:normal; word-break:auto-phrase; text-wrap:balance; overflow-wrap:anywhere;}
body :is(p,td,.course-desc,.mi-text) {line-break:strict; word-break:normal; word-break:auto-phrase; text-wrap:pretty; overflow-wrap:anywhere;}
body :is(a,button,input,select,textarea,small,time) {font-size: max(14px, 1em);}
body a:focus-visible,body button:focus-visible {outline:3px solid #9b5b0b;outline-offset:4px;}
/* 読み込み失敗時も本文を隠さない。既存の表示アニメーションのみ無効化。 */
body .fade-up {opacity:1;transform:none;}
body .global-header {
  position:sticky; top:0; min-height:88px; padding:10px 4%;
  background:rgba(255,250,240,.98); border-bottom:1px solid var(--tc-line);
  grid-template-columns:auto 1fr auto; gap:24px; box-shadow:0 3px 15px #472d2008;
}
body .header-logo {letter-spacing:0; color:var(--tc-brown);}
body .header-logo img {max-height:66px;max-width:180px;}
body .desktop-nav {gap:clamp(14px,1.7vw,28px);}
body .desktop-nav a {font-size:14px;color:var(--tc-brown);letter-spacing:0;font-weight:700;}
body .desktop-nav a::after {height:3px;background:var(--tc-yellow);}
body .btn-header-tel {font-size:15px;color:var(--tc-brown);white-space:nowrap;}
body .menu-trigger {color:var(--tc-brown);border-color:var(--tc-line);width:46px;height:46px;border-radius:50%;background:var(--tc-yellow);font-size:18px;}
body .mobile-nav-overlay {background:var(--tc-cream);overflow-y:auto;padding:86px 24px 100px;gap:20px;}
body .mobile-nav-overlay a {color:var(--tc-brown);font-size:18px;line-height:1.5;}
body :is(.fc-block-btn,.btn-header-reserve,.btn-menu-more,.course-list-reserve,.btn-course-reserve,.btn-nab-back) {
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:48px;max-width:100%;padding:13px 24px;border-radius:999px;
  border:1px solid var(--tc-yellow);background:var(--tc-yellow);color:var(--tc-brown);
  font-family:var(--font-sans);font-size:16px;font-weight:800;line-height:1.5;
  text-align:center;text-decoration:none;white-space:normal;word-break:normal;text-wrap:balance;
}
body :is(.fc-block-btn,.btn-header-reserve,.btn-menu-more,.course-list-reserve,.btn-course-reserve):hover {background:#ffda69;border-color:#ffda69;color:var(--tc-brown);}
/* TOP：写真を活かし、短いコピーを左側へ。スライドは管理画面で1枚指定。 */
body .hero-wrapper {height:560px;min-height:0;background:var(--tc-paper);}
body .hero-wrapper::after {background:none;}
body .hero-slider,body .hero-slide {height:100%;}
body .hero-slide-img {left:50%;width:50%;background-position:center;}
body .hero-slide::after {content:"";position:absolute;inset:0;background:none;pointer-events:none;}
body .hero-slider .hero-slide-caption {top:50%;bottom:auto;left:0;right:0;transform:translateY(-50%);max-width:1160px;margin:auto;padding:0 40px;text-align:left;z-index:3;}
body .hero-slide-catch {font-family:var(--font-sans);font-size:clamp(34px,4.5vw,58px) !important;line-height:1.45;letter-spacing:.015em;font-weight:900;color:var(--tc-brown) !important;text-shadow:none;}
body .hero-slide-sub {font-size:20px !important;line-height:1.8;color:var(--tc-brown) !important;margin-top:20px;}
/* 最小限のカスタムHTML：TOPの3つの案内リンク */
body .tc-quicklinks {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-width:1120px;margin:0 auto;padding:24px 28px;gap:16px;}
body .tc-quicklinks a {display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:56px;padding:12px 20px;border-bottom:2px solid var(--tc-yellow);font-size:16px;font-weight:800;color:var(--tc-brown);}
body .tc-quicklinks a:hover {background:var(--tc-paper);}
body .tc-quicklinks .tc-keep {white-space:nowrap;}
/* ブロックの余白・見出し */
body :is(.concept-section,.free-text-section,.image-grid-section,.image-banner-section,.menu-grid-section,.course-list-section,.news-list-grid-section,.news-article-body-section,.gmap-section,.store-info-section) {padding:80px 28px !important;color:var(--tc-brown);background-color:var(--tc-cream);}
body :is(.concept-container,.store-info-container,.image-grid-container,.image-banner-container,.menu-cat-container,.course-list-grid,.nlg-grid,.gmap-container) {max-width:1080px;margin-inline:auto;}
body :is(.free-text-title,.store-info-title,.image-grid-title,.image-banner-title,.menu-main-title,.course-list-title,.news-main-title,.gmap-title) {font-family:var(--font-sans);color:var(--tc-brown);font-size:clamp(26px,3vw,36px);letter-spacing:.025em;font-weight:800;}
body :is(.free-text-desc,.store-info-desc,.image-grid-desc,.image-banner-desc,.menu-sub-text,.course-list-desc,.news-sub-text,.gmap-desc) {font-size:16px;line-height:1.9;color:var(--tc-muted);}
body :is(.section-header,.menu-section-header,.course-list-header,.news-section-header,.image-grid-header,.image-banner-header) {margin-bottom:36px;}
/* 管理画面から編集する写真＋文章ブロック */
body .concept-section {background:var(--tc-cream) !important;}
body .concept-section:has(.concept-reverse) {background:var(--tc-paper) !important;}
body .concept-container,body .concept-container.concept-reverse {display:grid !important;grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;gap:64px !important;align-items:center !important;max-width:1080px !important;}
body .concept-content {text-align:left !important;min-width:0;}
body .concept-content .concept-title {font-family:var(--font-sans) !important;font-size:clamp(26px,2.8vw,36px) !important;line-height:1.65 !important;letter-spacing:0 !important;color:var(--tc-brown) !important;text-align:left !important;margin-bottom:20px !important;}
body .concept-content .concept-text {font-size:16px !important;line-height:2 !important;letter-spacing:0 !important;color:var(--tc-muted) !important;text-align:left !important;}
body .concept-section .concept-content p.concept-eyebrow {display:inline-block;font-family:var(--font-sans) !important;font-size:14px !important;line-height:1.5 !important;font-weight:800;letter-spacing:.08em !important;text-align:left !important;color:#80551b !important;border-bottom:3px solid var(--tc-yellow);padding-bottom:6px;margin-bottom:16px;}
body .concept-content .fc-block-btn-wrap {text-align:left;margin-top:24px;}
body .concept-img-wrapper {min-width:0;border-radius:22px 22px 70px 22px !important;background:#f2e4cf !important;box-shadow:12px 12px 0 #eddbbc !important;}
body .concept-img-wrapper::before {display:none !important;}
body .concept-img-wrapper img,body .concept-img-wrapper video {aspect-ratio:1 !important;filter:none !important;}
body .free-text-container {max-width:760px;margin:auto;text-align:center;}
body .image-grid {gap:20px;}
body .image-grid-item {border-radius:16px;}
body .image-banner-container .custom-banner-img {width:100%;border-radius:18px;}
/* 店舗概要：settings.bg_image と render.php の出力をそのまま利用 */
body .store-info-section {--fc-bg-overlay:rgba(255,248,232,.84);background-color:var(--tc-paper);}
body .store-info-header {max-width:760px;margin:0 auto 32px;}
body .store-info-layout {padding:32px;background:rgba(255,253,247,.96);border:1px solid var(--tc-line);border-radius:20px;}
body .store-info-layout.has-image {grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:32px;align-items:center;}
body .store-info-table {table-layout:fixed;width:100%;}
body .store-info-table :is(th,td) {font-size:16px;line-height:1.85;padding:13px 6px;color:var(--tc-brown);border-color:var(--tc-line);}
body .store-info-table td {word-break:normal;text-wrap:balance;}
body .store-info-table th {width:100px;white-space:nowrap;}
body .store-info-image img {width:100%;max-height:none;aspect-ratio:1;object-fit:cover;border:0;border-radius:14px;}
/* 下層ヒーロー：画像未共有の間も既存の画像表示を維持 */
body :is(.page-hero-wrapper,.course-hero) {position:relative;display:flex;align-items:center;justify-content:center;min-height:var(--tc-hero-height);height:auto;padding:48px 24px;text-align:center;background-size:cover;background-position:center;background-color:var(--tc-brown);}
body :is(.page-hero-wrapper,.course-hero)::after {display:none;}
body :is(.ph-overlay,.course-hero .hero-overlay) {position:absolute;inset:0;background:rgba(47,28,16,.64);pointer-events:none;}
body :is(.ph-container,.course-hero .hero-content) {position:relative;z-index:1;width:min(100%,920px);margin:auto;}
body :is(.ph-title,.course-page-title) {font-family:var(--font-sans);font-size:clamp(28px,4vw,46px);letter-spacing:.03em;color:#fffaf0;line-height:1.5;}
body :is(.ph-desc,.course-page-desc) {font-size:16px;color:#fffaf0;line-height:1.8;margin-top:16px;}
/* メニューはDB連動の一覧を保持。料金と料理名の幅を分ける */
body .menu-items-grid {grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px;row-gap:16px;}
body .menu-cat-block {margin-bottom:48px;}
body .menu-cat-header {border-bottom:2px solid var(--tc-yellow);margin-bottom:14px;padding-bottom:12px;}
body .menu-cat-name {font-family:var(--font-sans);font-size:24px;color:var(--tc-brown);letter-spacing:0;}
body .menu-cat-desc {font-size:14px;color:var(--tc-muted);}
body .menu-item-card {min-width:0;background:#fffdf7;color:var(--tc-brown);border-color:var(--tc-line);box-shadow:none;padding:18px;gap:16px;}
body .menu-item-card.no-image {border-color:var(--tc-line);padding:16px 0;}
body .menu-item-card.no-image .mi-info {grid-template-columns:minmax(0,1fr);gap:8px;}
body .menu-item-card.no-image .mi-meta {grid-column:1;grid-row:auto;justify-self:end;}
body .menu-item-card .mi-info {min-width:0;}
body .menu-item-card .mi-title {font-family:var(--font-sans);font-size:16px;line-height:1.8;color:var(--tc-brown);white-space:pre-line;}
body .menu-item-card.no-image .mi-text,body :is(.mi-text,.mi-duration) {font-size:14px;color:var(--tc-muted);}
body .mi-img-box {width:110px;aspect-ratio:1;}
body .price-in,body .menu-item-card.no-image .price-in {font-size:18px;color:var(--tc-brown);font-weight:800;white-space:nowrap;}
body :is(.price-in small,.price-tax,.mi-price small,.mi-tax) {font-size:14px;}
/* コース：現在の既定一覧と、後日追加するcourse_listブロックの両方に対応 */
body .courses-container {max-width:1136px;margin:auto;padding:64px 28px;}
body .course-card {display:grid;grid-template-columns:minmax(0,1fr);margin-bottom:24px;background:#fffdf7;border:1px solid var(--tc-line);border-radius:18px;overflow:hidden;}
body .course-card:has(.course-img-box img) {grid-template-columns:220px minmax(0,1fr);}
body .course-img-box {background:var(--tc-paper);}
body .course-img-box:not(:has(img)) {display:none;}
body .course-img-box img {width:100%;height:100%;object-fit:cover;}
body .course-title {word-break:keep-all;overflow-wrap:anywhere;}
body .course-info {padding:28px;min-width:0;}
body :is(.course-title,.course-list-body h3) {font-family:var(--font-sans);font-size:22px;line-height:1.65;color:var(--tc-brown);white-space:pre-line;}
body :is(.course-desc,.course-list-text,.course-list-desc) {font-size:16px;color:var(--tc-muted);line-height:1.9;margin-top:12px;}
body .price-wrap {margin-top:12px;}
body .course-list-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;}
body .course-list-card {background:#fffdf7;border-color:var(--tc-line);box-shadow:none;border-radius:18px;}
body :is(.course-list-price,.course-list-kicker) {color:var(--tc-brown);}
body .course-list-kicker,body .course-list-price small {font-size:14px;}
body .nlg-grid {grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;}
body .nlg-card {background:#fffdf7;border-color:var(--tc-line);border-radius:16px;color:var(--tc-brown);box-shadow:none;}
body .nlg-title {font-family:var(--font-sans);font-size:18px;line-height:1.8;color:var(--tc-brown);}
body .nlg-date {font-size:14px;color:var(--tc-muted);}
body .gmap-frame-wrap {border-color:var(--tc-line);border-radius:18px;}
body .global-footer {background:#472d20;color:#fffaf0;padding:48px 28px 24px;border-top:5px solid var(--tc-yellow);}
body .global-footer :is(a,h2,p,th,td) {color:#fffaf0;}
body .global-footer nav {display:flex;flex-wrap:wrap;justify-content:center;gap:16px 28px;}
body .global-footer .footer-nav a {color:#fffaf0;font-size:14px;white-space:nowrap;}
/* 既存のシンプルフッター設定（.info-grid非表示）を保持する。 */
body .global-footer .footer-nav-brand h2 {color:#fffaf0;font-family:var(--font-sans);font-size:24px;text-wrap:balance;}
body .footer-copy-text {font-size:14px;color:#f5e5ca;background:#472d20;padding:12px 24px 96px;text-align:center;}
body .fc-floating-action {min-height:48px;font-size:16px;background:var(--tc-yellow);border:1px solid var(--tc-yellow);color:var(--tc-brown);box-shadow:0 4px 18px #472d2020;}
body .fc-floating-action span {font-size:16px;}
/* スマートフォン・タブレット */
@media(max-width:1100px) {
  body .global-header {display:flex;gap:16px;min-height:76px;padding:8px 20px;}
  body .desktop-nav,body .header-btns {display:none;}
  body .menu-trigger {display:inline-flex;margin-left:auto;}
  body .header-logo img {max-height:58px;max-width:155px;}
}
@media(max-width:767px) {
  :root {--tc-hero-height:240px;}
  html {scroll-padding-top:92px;}
  body .hero-wrapper {height:500px;}
  body .hero-slide-img {left:0;width:100%;background-position:62% center;}
  body .hero-slide::after {background:linear-gradient(0deg,rgba(42,25,15,.82),rgba(42,25,15,.12) 90%);}
  body .hero-slider .hero-slide-caption {top:auto;bottom:36px;transform:none;padding:0 24px;}
  body .hero-slide-catch {font-size:clamp(30px,8vw,42px) !important;letter-spacing:0;color:#fffaf0 !important;}
  body .hero-slide-sub {font-size:16px !important;margin-top:14px;color:#fffaf0 !important;}
  body .tc-quicklinks {grid-template-columns:1fr;padding:16px 24px;gap:0;}
  body .tc-quicklinks a {min-height:52px;padding:12px 4px;}
  body :is(.concept-section,.free-text-section,.image-grid-section,.image-banner-section,.menu-grid-section,.course-list-section,.news-list-grid-section,.news-article-body-section,.gmap-section,.store-info-section) {padding:52px 24px !important;}
  body .concept-container,body .concept-container.concept-reverse {grid-template-columns:minmax(0,1fr) !important;gap:28px !important;}
  body .concept-container .concept-content,body .concept-container.concept-reverse .concept-content {order:1 !important;}
  body .concept-container .concept-img-wrapper,body .concept-container.concept-reverse .concept-img-wrapper {order:2 !important;}
  body .concept-content .concept-title {font-size:26px !important;line-height:1.65 !important;}
  body .concept-img-wrapper {box-shadow:7px 7px 0 #eddbbc !important;}
  body .store-info-layout {padding:20px 16px;border-radius:16px;}
  body .store-info-layout.has-image {grid-template-columns:minmax(0,1fr);gap:24px;}
  body .store-info-table :is(th,td) {font-size:14px;padding:12px 2px;}
  body .store-info-table th {width:76px;}
  body .store-info-image {order:-1;}
  body .store-info-image img {max-width:400px;margin:auto;}
  body :is(.page-hero-wrapper,.course-hero) {padding:36px 24px;}
  body :is(.ph-title,.course-page-title) {font-size:28px;letter-spacing:0;}
  body .menu-items-grid,body .course-list-grid,body .nlg-grid {grid-template-columns:minmax(0,1fr);}
  body .menu-cat-name {font-size:22px;}
  body .menu-item-card {flex-direction:column;}
  body .mi-img-box {width:100%;height:auto;aspect-ratio:4/3;}
  body .courses-container {padding:40px 24px;}
  body .course-card:has(.course-img-box img) {grid-template-columns:minmax(0,1fr);}
  body .course-info {padding:22px;}
  body .course-title {font-size:20px;}
  body .global-footer {padding:40px 24px 20px;}
  body .footer-copy-text {padding-bottom:110px;line-height:1.8;text-wrap:balance;}
  body .fc-floating-actions {bottom:max(12px,env(safe-area-inset-bottom));left:16px;right:16px;gap:8px;padding:0;background:transparent;border:0;backdrop-filter:none;}
  body .fc-floating-action {border-radius:999px;font-size:16px;min-height:50px;flex-direction:row;gap:8px;}
}
@media(prefers-reduced-motion:reduce) {html {scroll-behavior:auto;} body *,body *::before,body *::after {transition:none !important;animation:none !important;}}

@media(max-width:1024px) {
  body .store-info-layout.has-image {grid-template-columns:minmax(0,1fr);}
  body .store-info-image {order:-1;}
  body .store-info-image img {max-width:420px;margin:auto;}
}
@media(max-width:767px) {
  body .global-footer .footer-nav-brand h2 {font-size:20px;letter-spacing:.035em;white-space:nowrap;}
}
@media(max-width:480px) {
  body .store-info-table tr {display:grid;grid-template-columns:minmax(0,1fr);border-bottom:1px solid var(--tc-line);padding:12px 0;}
  body .store-info-table :is(th,td) {display:block;width:100%;padding:0;border:0;}
  body .store-info-table th {color:var(--tc-muted);margin-bottom:4px;}
}
/* とらちゃん 改修CSS ここまで */
/* =========================================================
   とらちゃん 下層ページCSS v2 / 2026-08-31
   貼り付け先：管理画面 → エディタ上部メニュー →「共通CSS編集 (style.css)」の【末尾に追加】
   ※ custom.css は公開のたびに自動生成されるので直接編集しないこと。
   ※ 既存の「とらちゃん 改修CSS v1」は消さずにその下へ足す。
   ========================================================= */

/* ---------------------------------------------------------
   [0] 基準スタイルの復旧（重要）
   いま公開されている style.css には FluxCore 標準の
   * { box-sizing: border-box } / a { text-decoration:none } が
   入っておらず、スマホでヘッダー右端のメニューボタンがはみ出し、
   ナビのリンクに下線が出ています。ここで戻します。
   ※ 余白リセット（margin:0/padding:0）は、いまの見た目を基準に
     調整済みのため、あえて入れていません。
--------------------------------------------------------- */
body *, body *::before, body *::after { box-sizing: border-box; }
body a { color: inherit; text-decoration: none; }
body img, body video { max-width: 100%; height: auto; }
body button { font: inherit; }

/* ---------------------------------------------------------
   [1] 共通ヒーロー（下層ページ共通の見出し帯）
   背景画像はこの --tc-hero-bg の1行だけを変更すれば
   共通ヒーローを使っている全ページに反映される。
   画像パスは管理画面「画像管理」の［パス］ボタンでコピーしたものを貼る。
--------------------------------------------------------- */
:root {
  --tc-hero-bg: url("/image/assets/asset_20261005175026_6ac364d2a8f06.webp");
  --tc-hero-height: 360px;
  --tc-hero-veil-top: rgba(58,35,20,.42);
  --tc-hero-veil-bottom: rgba(58,35,20,.72);
}

body :is(.page-hero-wrapper, .course-hero) {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  min-height: var(--tc-hero-height);
  height: auto;
  padding: 96px 24px 56px;
  overflow: hidden;
  text-align: left;
  background-image: var(--tc-hero-bg) !important;
  background-size: cover !important;
  background-position: center 55% !important;
  background-repeat: no-repeat !important;
  background-color: #472d20;
  border-bottom: 6px solid var(--tc-yellow);
}
body :is(.page-hero-wrapper, .course-hero)::after { display: none; }

/* 覆いは上を薄く・下を濃く。写真が見えたまま文字が読める明るさにする。 */
body :is(.ph-overlay, .course-hero .hero-overlay) {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, var(--tc-hero-veil-top) 0%, var(--tc-hero-veil-bottom) 100%);
  pointer-events: none;
}

body :is(.ph-container, .course-hero .hero-content) {
  position: relative;
  z-index: 1;
  width: min(100%, 1080px);
  margin: 0 auto;
}

/* 英字ラベル。ページごとに1行だけ差し替える（[2]参照）。未指定でも崩れない。 */
body :is(.ph-container, .course-hero .hero-content)::before {
  content: var(--tc-hero-eyebrow, "TORACHAN");
  display: block;
  margin-bottom: 14px;
  padding-bottom: 7px;
  border-bottom: 3px solid var(--tc-yellow);
  width: fit-content;
  max-width: 100%;
  color: #ffe9a8;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: .14em;
}

body :is(.ph-title, .course-page-title) {
  margin: 0;
  font-family: var(--font-sans);
  font-size: clamp(30px, 3.6vw, 46px);
  font-weight: 900;
  line-height: 1.5;
  letter-spacing: .02em;
  color: #fffaf0;
  text-shadow: 0 2px 14px rgba(35,20,10,.5);
  /* 単語の途中で折り返さない。短い見出し前提。 */
  word-break: keep-all;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
body :is(.ph-desc, .course-page-desc) {
  margin: 14px 0 0;
  max-width: 34em;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.9;
  color: #fdf3df;
  text-shadow: 0 2px 12px rgba(35,20,10,.55);
  word-break: normal;
  word-break: auto-phrase;
  text-wrap: pretty;
}
/* 改行させたくないかたまりを守るための共通クラス（カスタムHTML内で使用） */
body .tc-kp { display: inline-block; white-space: nowrap; }


/* ---------------------------------------------------------
   [2] ページごとの英字ラベル（共通ヒーローの小見出し）
   背景画像は全ページ共通のまま、ラベルだけページごとに変える。
   sec_〇〇 は、エディタで各ページのヒーローブロックを選んだときに
   表示されるセクションIDに合わせること（下は現在のサイトの値）。
--------------------------------------------------------- */
#sec_1785932055215 { --tc-hero-eyebrow: "ABOUT TORACHAN"; } /* とらちゃんについて */
#sec_1785931894365 { --tc-hero-eyebrow: "MENU"; }           /* メニュー */
#sec_1785932170350 { --tc-hero-eyebrow: "GALLERY"; }        /* ギャラリー（seats） */
#sec_1785932329448 { --tc-hero-eyebrow: "ACCESS"; }         /* アクセス */
/* コースページのヒーローを新しく作ったら、そのIDで1行足す
   例）#sec_0000000000000 { --tc-hero-eyebrow: "COURSE"; } */


/* ---------------------------------------------------------
   [3] 共通「次に見るページ」ナビ（下層ページの最後に置くカスタムHTML）
--------------------------------------------------------- */
body #tc-next, body #tc-next * { box-sizing: border-box; }
body #tc-next {
  padding: 72px 24px 80px;
  background: var(--tc-paper);
  border-top: 1px solid var(--tc-line);
}
body #tc-next .tc-next-inner { max-width: 1080px; margin: 0 auto; }
body #tc-next .tc-next-eyebrow {
  margin: 0 0 10px;
  color: #86561e;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: .14em;
}
body #tc-next .tc-next-title {
  margin: 0 0 32px;
  color: var(--tc-brown);
  font-size: clamp(26px, 3vw, 36px);
  font-weight: 900;
  line-height: 1.55;
  letter-spacing: 0;
  text-wrap: initial;
}
body #tc-next .tc-next-title > span { display: inline-block; white-space: nowrap; }
body #tc-next .tc-next-list {
  display: grid;
  /* カードを3枚にしても4枚にしても崩れないよう auto-fit を使う */
  grid-template-columns: repeat(auto-fit, minmax(228px, 1fr));
  gap: 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}
body #tc-next .tc-next-list > li { min-width: 0; }
body #tc-next .tc-next-list a {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  background: #fffdf7;
  border: 1px solid var(--tc-line);
  border-radius: 18px;
  color: var(--tc-brown);
  text-decoration: none;
}
body #tc-next .tc-next-photo {
  position: relative;
  display: block;
  flex: 0 0 auto;
  overflow: hidden;
  aspect-ratio: 16 / 10;
  background: #ecdfc7;
}
body #tc-next .tc-next-photo img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .25s ease;
}
body #tc-next .tc-next-body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 6px;
  padding: 18px 20px 20px;
}
body #tc-next .tc-next-label {
  color: #96682a;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: .1em;
}
body #tc-next .tc-next-name {
  color: var(--tc-brown);
  font-size: 20px;
  font-weight: 900;
  line-height: 1.6;
  word-break: keep-all;
}
body #tc-next .tc-next-text {
  color: var(--tc-muted);
  font-size: 14px;
  line-height: 1.85;
}
body #tc-next .tc-next-go {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
  padding-top: 14px;
  color: #7b5533;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
}
body #tc-next .tc-next-go svg {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  padding: 8px;
  border: 1px solid #ccae6c;
  border-radius: 50%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}
body #tc-next .tc-next-list a:hover { border-color: var(--tc-yellow); }
body #tc-next .tc-next-list a:hover img { transform: scale(1.04); }
body #tc-next .tc-next-list a:hover .tc-next-go svg { background: var(--tc-yellow); border-color: var(--tc-yellow); }
body #tc-next .tc-next-list a:focus-visible { outline: 3px solid #9b5b0b; outline-offset: 4px; }


/* ---------------------------------------------------------
   [4] とらちゃんについて：3つの強みカード（カスタムHTML）
--------------------------------------------------------- */
body #tc-about, body #tc-about * { box-sizing: border-box; }
body #tc-about {
  padding: 76px 24px 64px;
  background: var(--tc-cream);
}
body #tc-about .tc-about-inner { max-width: 1080px; margin: 0 auto; }
body #tc-about .tc-about-head { max-width: 760px; margin: 0 auto 44px; text-align: center; }
body #tc-about .tc-about-eyebrow {
  margin: 0 0 12px;
  color: #86561e;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: .14em;
}
body #tc-about h2 {
  margin: 0 0 18px;
  color: var(--tc-brown);
  font-size: clamp(26px, 3.2vw, 40px);
  font-weight: 900;
  line-height: 1.55;
  letter-spacing: 0;
  text-wrap: initial;
}
body #tc-about h2 > span { display: inline-block; white-space: nowrap; }
body #tc-about .tc-about-lead {
  margin: 0;
  color: #614531;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.95;
}
body #tc-about .tc-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}
body #tc-about .tc-cards > li {
  display: flex;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  background: #fffdf7;
  border: 1px solid var(--tc-line);
  border-radius: 20px;
}
body #tc-about .tc-card-photo { position: relative; display: block; flex: 0 0 auto; overflow: hidden; aspect-ratio: 4 / 3; background: #ecdfc7; }
body #tc-about .tc-card-photo img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
body #tc-about .tc-card-body { padding: 20px 22px 24px; }
body #tc-about .tc-card-no {
  display: inline-block;
  margin-bottom: 10px;
  padding: 4px 12px;
  background: var(--tc-yellow);
  border-radius: 999px;
  color: var(--tc-brown);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
}
body #tc-about .tc-card-title {
  margin: 0 0 8px;
  color: var(--tc-brown);
  font-size: 20px;
  font-weight: 900;
  line-height: 1.6;
  word-break: keep-all;
}
body #tc-about .tc-card-text {
  margin: 0;
  color: var(--tc-muted);
  font-size: 15px;
  line-height: 1.9;
  word-break: normal;
  word-break: auto-phrase;
}


/* ---------------------------------------------------------
   [5] メニュー：名物ピックアップ（カスタムHTML）
--------------------------------------------------------- */
body #tc-pick, body #tc-pick * { box-sizing: border-box; }
body #tc-pick {
  padding: 68px 24px 56px;
  background: var(--tc-paper);
}
body #tc-pick .tc-pick-inner { max-width: 1080px; margin: 0 auto; }
body #tc-pick .tc-pick-head { margin: 0 0 32px; }
body #tc-pick .tc-pick-eyebrow {
  margin: 0 0 10px;
  color: #86561e;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: .14em;
}
body #tc-pick h2 {
  margin: 0 0 12px;
  color: var(--tc-brown);
  font-size: clamp(26px, 3vw, 36px);
  font-weight: 900;
  line-height: 1.55;
  text-wrap: initial;
}
body #tc-pick h2 > span { display: inline-block; white-space: nowrap; }
body #tc-pick .tc-pick-lead { margin: 0; color: #614531; font-size: 16px; line-height: 1.9; }
body #tc-pick .tc-pick-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}
body #tc-pick .tc-pick-list > li { min-width: 0; }
body #tc-pick .tc-pick-photo {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  margin-bottom: 14px;
  background: #ecdfc7;
  border-radius: 20px 20px 60px 20px;
  box-shadow: 9px 9px 0 #eddbbc;
}
body #tc-pick .tc-pick-photo img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
body #tc-pick .tc-pick-name {
  margin: 0 0 4px;
  color: var(--tc-brown);
  font-size: 18px;
  font-weight: 900;
  line-height: 1.65;
  word-break: keep-all;
}
body #tc-pick .tc-pick-text { margin: 0; color: var(--tc-muted); font-size: 14px; line-height: 1.85; }
body #tc-pick .tc-pick-note {
  margin: 28px 0 0;
  color: #785b43;
  font-size: 14px;
  line-height: 1.8;
  text-wrap: balance;
}


/* ---------------------------------------------------------
   [6] メニュー一覧（DB連動ブロック）の読みやすさ
--------------------------------------------------------- */
body .menu-grid-section { padding-top: 64px !important; }
body .menu-section-header { margin-bottom: 28px; }

/* カテゴリー切り替えチップ（カスタムJSで自動生成される） */
body .tc-menunav {
  position: sticky;
  top: 96px;
  z-index: 20;
  margin: 0 auto 32px;
  padding: 12px 14px;
  max-width: 1080px;
  background: rgba(255, 250, 240, .97);
  border: 1px solid var(--tc-line);
  border-radius: 18px;
  box-shadow: 0 6px 18px rgba(71, 45, 32, .08);
}
body .tc-menunav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
body .tc-menunav a {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 6px 15px;
  background: #fffdf7;
  border: 1px solid var(--tc-line);
  border-radius: 999px;
  color: var(--tc-brown);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  text-decoration: none;
  white-space: nowrap;
}
body .tc-menunav a:hover,
body .tc-menunav a:focus-visible { background: var(--tc-yellow); border-color: var(--tc-yellow); }

body .menu-cat-block {
  margin-bottom: 40px;
  padding: 26px 28px 8px;
  background: #fffdf7;
  border: 1px solid var(--tc-line);
  border-radius: 20px;
  scroll-margin-top: 150px;
}
body .menu-cat-header {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin-bottom: 18px;
  padding-bottom: 12px;
  border-bottom: 3px solid var(--tc-yellow);
}
body .menu-cat-name { margin: 0; font-size: 22px; font-weight: 900; line-height: 1.5; color: var(--tc-brown); word-break: keep-all; }
body .menu-cat-desc { margin: 0; font-size: 14px; line-height: 1.7; color: var(--tc-muted); }

body .menu-items-grid { column-gap: 44px; row-gap: 4px; }
body .menu-item-card.no-image {
  padding: 14px 0;
  border: 0;
  border-bottom: 1px dashed #e3d3b7;
  background: transparent;
}
body .menu-item-card.no-image .mi-info {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
  column-gap: 14px;
  row-gap: 4px;
}
body .menu-item-card .mi-title {
  /* 見出し既定の text-wrap:balance だと最終行が短く残りやすいので pretty にする */
  word-break: normal;
  word-break: auto-phrase;
  text-wrap: pretty;
}
body .menu-item-card.no-image .mi-title {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.75;
  color: var(--tc-brown);
}
body .menu-item-card.no-image .mi-title::after {
  content: "";
  flex: 1 1 20px;
  min-width: 20px;
  border-bottom: 1px dotted #cdb89a;
}
body .menu-item-card.no-image .mi-meta { grid-column: 2; grid-row: 1; justify-self: end; }
body .menu-item-card.no-image .mi-text {
  grid-column: 1 / -1;
  grid-row: 2;
  margin: 0;
  font-size: 14px;
  line-height: 1.8;
  color: var(--tc-muted);
}
body .menu-item-card.no-image .price-in { font-size: 17px; font-weight: 800; white-space: nowrap; }
body .menu-item-card.no-image .mi-tax { font-size: 14px; color: var(--tc-muted); margin-left: 4px; }


/* ---------------------------------------------------------
   [7] コース一覧ブロック（course_list）
--------------------------------------------------------- */
body .course-list-section { padding: 76px 24px 80px !important; background: var(--tc-cream); }
body .course-list-header { max-width: 1080px; margin: 0 auto 40px; text-align: center; }
body .course-list-grid { max-width: 1080px; margin: 0 auto; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
body .course-list-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  background: #fffdf7;
  border: 1px solid var(--tc-line);
  border-radius: 20px;
  box-shadow: none;
}
body .course-list-img { position: relative; flex: 0 0 auto; overflow: hidden; aspect-ratio: 16 / 10; background: #ecdfc7; }
body .course-list-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
body .course-list-body { display: flex; flex: 1 1 auto; flex-direction: column; gap: 8px; padding: 24px 26px 26px; }
body .course-list-kicker {
  align-self: flex-start;
  margin: 0;
  padding: 4px 12px;
  background: var(--tc-yellow);
  border-radius: 999px;
  color: var(--tc-brown);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
}
body .course-list-body h3 { margin: 0; font-size: 22px; font-weight: 900; line-height: 1.6; color: var(--tc-brown); word-break: keep-all; }
body .course-list-text { margin: 0; font-size: 15px; line-height: 1.9; color: var(--tc-muted); }
body .course-list-price { margin: 4px 0 0; font-size: 22px; font-weight: 900; color: var(--tc-brown); }
body .course-list-price small { margin-left: 6px; font-size: 14px; font-weight: 700; color: var(--tc-muted); }
body .course-list-reserve { margin-top: auto; width: 100%; }
body .drink-option-list {
  max-width: 1080px;
  margin: 40px auto 0;
  padding: 26px 28px;
  background: var(--tc-paper);
  border: 1px solid var(--tc-line);
  border-radius: 20px;
}
body .drink-option-list h3 { margin: 0 0 14px; font-size: 20px; font-weight: 900; color: var(--tc-brown); }
body .drink-option-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px dashed #e3d3b7;
  font-size: 16px;
  color: var(--tc-brown);
}
body .drink-option-row strong { font-size: 18px; white-space: nowrap; }


/* ---------------------------------------------------------
   [8] アクセス：来店案内カード（カスタムHTML）
--------------------------------------------------------- */
body #tc-access, body #tc-access * { box-sizing: border-box; }
body #tc-access { padding: 68px 24px 60px; background: var(--tc-cream); }
body #tc-access .tc-access-inner { max-width: 1080px; margin: 0 auto; }
body #tc-access .tc-access-head { margin: 0 0 32px; text-align: center; }
body #tc-access .tc-access-eyebrow {
  margin: 0 0 10px;
  color: #86561e;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: .14em;
}
body #tc-access h2 { margin: 0; color: var(--tc-brown); font-size: clamp(26px, 3vw, 36px); font-weight: 900; line-height: 1.55; text-wrap: initial; }
body #tc-access h2 > span { display: inline-block; white-space: nowrap; }
body #tc-access .tc-access-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  margin: 0 0 32px;
  padding: 0;
  list-style: none;
}
body #tc-access .tc-access-list > li {
  min-width: 0;
  padding: 24px 24px 26px;
  background: #fffdf7;
  border: 1px solid var(--tc-line);
  border-radius: 18px;
}
body #tc-access .tc-access-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  margin-bottom: 14px;
  background: var(--tc-yellow);
  border-radius: 50%;
  font-size: 20px;
}
body #tc-access .tc-access-name { margin: 0 0 6px; color: var(--tc-brown); font-size: 18px; font-weight: 900; line-height: 1.6; word-break: keep-all; }
body #tc-access .tc-access-text { margin: 0; color: var(--tc-muted); font-size: 15px; line-height: 1.9; word-break: normal; word-break: auto-phrase; }
body #tc-access .tc-access-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
body #tc-access .tc-access-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 52px;
  padding: 13px 28px;
  border-radius: 999px;
  border: 1px solid var(--tc-yellow);
  background: var(--tc-yellow);
  color: var(--tc-brown);
  font-size: 16px;
  font-weight: 800;
  line-height: 1.5;
  text-decoration: none;
  white-space: nowrap;
}
body #tc-access .tc-access-btn.is-outline { background: transparent; border-color: #c9ab6b; }
body #tc-access .tc-access-btn:hover { background: #ffda69; border-color: #ffda69; }
body #tc-access .tc-access-btn:focus-visible { outline: 3px solid #9b5b0b; outline-offset: 4px; }


/* ---------------------------------------------------------
   [9] ギャラリー（image_grid）
--------------------------------------------------------- */
body .image-grid-section { background: var(--tc-cream); }
body .image-grid { gap: 18px; }
body .image-grid-item { overflow: hidden; border-radius: 18px; background: #ecdfc7; }
body .image-grid-item img { display: block; width: 100%; height: 100%; object-fit: cover; }


/* =========================================================
   [10-A] タブレット（900px以下）
   メニューを2列のままにすると品名が1文字だけ次の行に落ちるため、
   ここで1列に切り替える。
   ========================================================= */
@media (max-width: 900px) {
  body .menu-items-grid { grid-template-columns: minmax(0, 1fr); column-gap: 0; }
  body .course-list-grid { gap: 20px; }
}

/* =========================================================
   [10] スマートフォン（767px以下）
   ここから下は、上の指定をスマホ用に上書きする。
   ========================================================= */
@media (max-width: 767px) {
  :root { --tc-hero-height: 260px; }

  body :is(.page-hero-wrapper, .course-hero) {
    padding: 72px 22px 34px;
    background-position: center 55% !important;
  }
  body :is(.ph-container, .course-hero .hero-content)::before {
    margin-bottom: 10px;
    font-size: 14px;
    letter-spacing: .1em;
  }
  body :is(.ph-title, .course-page-title) { font-size: 28px; letter-spacing: 0; line-height: 1.5; }
  body :is(.ph-desc, .course-page-desc) { margin-top: 10px; font-size: 15px; line-height: 1.85; }

  body #tc-next { padding: 52px 22px 56px; }
  body #tc-next .tc-next-title { margin-bottom: 24px; font-size: 26px; }
  body #tc-next .tc-next-list { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  body #tc-next .tc-next-list a { flex-direction: row; align-items: stretch; border-radius: 16px; }
  body #tc-next .tc-next-photo { flex: 0 0 116px; width: 116px; aspect-ratio: auto; }
  body #tc-next .tc-next-body { gap: 4px; padding: 14px 16px; }
  body #tc-next .tc-next-name { font-size: 18px; }
  body #tc-next .tc-next-text { display: none; }
  body #tc-next .tc-next-go { padding-top: 8px; }
  body #tc-next .tc-next-go svg { width: 30px; height: 30px; flex-basis: 30px; padding: 7px; }

  body #tc-about { padding: 52px 22px 48px; }
  body #tc-about .tc-about-head { margin-bottom: 28px; text-align: left; }
  body #tc-about h2 { font-size: 26px; }
  body #tc-about .tc-cards { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  body #tc-about .tc-card-photo { aspect-ratio: 16 / 9; }
  body #tc-about .tc-card-body { padding: 18px 20px 22px; }
  body #tc-about .tc-card-title { font-size: 19px; }

  body #tc-pick { padding: 48px 22px 44px; }
  body #tc-pick h2 { font-size: 26px; }
  body #tc-pick .tc-pick-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 14px; }
  body #tc-pick .tc-pick-list > li:first-child { grid-column: 1 / -1; }
  body #tc-pick .tc-pick-photo { margin-bottom: 10px; border-radius: 16px 16px 40px 16px; box-shadow: 6px 6px 0 #eddbbc; }
  body #tc-pick .tc-pick-list > li:first-child .tc-pick-photo { aspect-ratio: 16 / 10; }
  body #tc-pick .tc-pick-name { font-size: 16px; }
  body #tc-pick .tc-pick-text { font-size: 14px; }

  body .menu-grid-section { padding-top: 44px !important; }
  body .tc-menunav { top: 84px; padding: 10px 12px; margin-bottom: 24px; border-radius: 14px; }
  body .tc-menunav ul {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 4px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  body .tc-menunav ul::-webkit-scrollbar { display: none; }
  body .tc-menunav a { min-height: 36px; padding: 6px 14px; }
  body .menu-cat-block { margin-bottom: 26px; padding: 20px 18px 6px; border-radius: 16px; scroll-margin-top: 128px; }
  body .menu-cat-name { font-size: 20px; }
  body .menu-items-grid { row-gap: 0; }
  body .menu-item-card.no-image { padding: 12px 0; }
  body .menu-item-card.no-image .mi-title { font-size: 15px; gap: 0; }
  body .menu-item-card.no-image .mi-title::after { display: none; }
  body .menu-item-card.no-image .price-in { font-size: 16px; }

  body .course-list-section { padding: 48px 22px 52px !important; }
  body .course-list-header { margin-bottom: 26px; }
  body .course-list-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  body .course-list-body { padding: 20px 20px 22px; }
  body .course-list-body h3 { font-size: 20px; }
  body .course-list-price { font-size: 20px; }
  body .drink-option-list { margin-top: 26px; padding: 20px 18px; border-radius: 16px; }
  body .drink-option-row { font-size: 15px; }

  body #tc-access { padding: 48px 22px 44px; }
  body #tc-access .tc-access-head { margin-bottom: 24px; text-align: left; }
  body #tc-access h2 { font-size: 26px; }
  body #tc-access .tc-access-list { grid-template-columns: minmax(0, 1fr); gap: 14px; margin-bottom: 26px; }
  body #tc-access .tc-access-list > li { padding: 20px 20px 22px; }
  body #tc-access .tc-access-icon { width: 42px; height: 42px; margin-bottom: 12px; }
  body #tc-access .tc-access-actions { flex-direction: column; }
  body #tc-access .tc-access-btn { width: 100%; }

  body .image-grid { gap: 12px; }
  body .image-grid-item { border-radius: 14px; }
}

/* 画面がとても狭いとき（iPhone SE など） */
@media (max-width: 380px) {
  body :is(.ph-title, .course-page-title) { font-size: 25px; }
  body #tc-next .tc-next-photo { flex-basis: 100px; width: 100px; }
  body #tc-next .tc-next-name { font-size: 17px; }
}

@media (prefers-reduced-motion: reduce) {
  body #tc-next .tc-next-photo img { transition: none; }
  body #tc-next .tc-next-list a:hover img { transform: none; }
}
/* とらちゃん 下層ページCSS v2 ここまで */
/* =========================================================
   とらちゃん 下層ページCSS v2 / 2026-08-31
   貼り付け先：管理画面 → エディタ上部メニュー →「共通CSS編集 (style.css)」の【末尾に追加】
   ※ custom.css は公開のたびに自動生成されるので直接編集しないこと。
   ※ 既存の「とらちゃん 改修CSS v1」は消さずにその下へ足す。
   ========================================================= */

/* ---------------------------------------------------------
   [0] 基準スタイルの復旧（重要）
   いま公開されている style.css には FluxCore 標準の
   * { box-sizing: border-box } / a { text-decoration:none } が
   入っておらず、スマホでヘッダー右端のメニューボタンがはみ出し、
   ナビのリンクに下線が出ています。ここで戻します。
   ※ 余白リセット（margin:0/padding:0）は、いまの見た目を基準に
     調整済みのため、あえて入れていません。
--------------------------------------------------------- */
body *, body *::before, body *::after { box-sizing: border-box; }
body a { color: inherit; text-decoration: none; }
body img, body video { max-width: 100%; height: auto; }
body button { font: inherit; }

/* ---------------------------------------------------------
   [1] 共通ヒーロー（下層ページ共通の見出し帯）
   背景画像はこの --tc-hero-bg の1行だけを変更すれば
   共通ヒーローを使っている全ページに反映される。
   画像パスは管理画面「画像管理」の［パス］ボタンでコピーしたものを貼る。
--------------------------------------------------------- */
:root {
  --tc-hero-bg: url("image/assets/asset_20261005175026_6ac364d2a8f06.webp");
  --tc-hero-height: 360px;
  --tc-hero-veil-top: rgba(58,35,20,.42);
  --tc-hero-veil-bottom: rgba(58,35,20,.72);
}

body :is(.page-hero-wrapper, .course-hero) {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  min-height: var(--tc-hero-height);
  height: auto;
  padding: 96px 24px 56px;
  overflow: hidden;
  text-align: left;
  background-image: var(--tc-hero-bg) !important;
  background-size: cover !important;
  background-position: center 55% !important;
  background-repeat: no-repeat !important;
  background-color: #472d20;
  border-bottom: 6px solid var(--tc-yellow);
}
body :is(.page-hero-wrapper, .course-hero)::after { display: none; }

/* 覆いは上を薄く・下を濃く。写真が見えたまま文字が読める明るさにする。 */
body :is(.ph-overlay, .course-hero .hero-overlay) {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, var(--tc-hero-veil-top) 0%, var(--tc-hero-veil-bottom) 100%);
  pointer-events: none;
}

body :is(.ph-container, .course-hero .hero-content) {
  position: relative;
  z-index: 1;
  width: min(100%, 1080px);
  margin: 0 auto;
}

/* 英字ラベル。ページごとに1行だけ差し替える（[2]参照）。未指定でも崩れない。 */
body :is(.ph-container, .course-hero .hero-content)::before {
  content: var(--tc-hero-eyebrow, "TORACHAN");
  display: block;
  margin-bottom: 14px;
  padding-bottom: 7px;
  border-bottom: 3px solid var(--tc-yellow);
  width: fit-content;
  max-width: 100%;
  color: #ffe9a8;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: .14em;
}

body :is(.ph-title, .course-page-title) {
  margin: 0;
  font-family: var(--font-sans);
  font-size: clamp(30px, 3.6vw, 46px);
  font-weight: 900;
  line-height: 1.5;
  letter-spacing: .02em;
  color: #fffaf0;
  text-shadow: 0 2px 14px rgba(35,20,10,.5);
  /* 単語の途中で折り返さない。短い見出し前提。 */
  word-break: keep-all;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
body :is(.ph-desc, .course-page-desc) {
  margin: 14px 0 0;
  max-width: 34em;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.9;
  color: #fdf3df;
  text-shadow: 0 2px 12px rgba(35,20,10,.55);
  word-break: normal;
  word-break: auto-phrase;
  text-wrap: pretty;
}
/* 改行させたくないかたまりを守るための共通クラス（カスタムHTML内で使用） */
body .tc-kp { display: inline-block; white-space: nowrap; }


/* ---------------------------------------------------------
   [2] ページごとの英字ラベル（共通ヒーローの小見出し）
   背景画像は全ページ共通のまま、ラベルだけページごとに変える。
   sec_〇〇 は、エディタで各ページのヒーローブロックを選んだときに
   表示されるセクションIDに合わせること（下は現在のサイトの値）。
--------------------------------------------------------- */
#sec_1785932055215 { --tc-hero-eyebrow: "ABOUT TORACHAN"; } /* とらちゃんについて */
#sec_1785931894365 { --tc-hero-eyebrow: "MENU"; }           /* メニュー */
#sec_1785932170350 { --tc-hero-eyebrow: "GALLERY"; }        /* ギャラリー（seats） */
#sec_1785932329448 { --tc-hero-eyebrow: "ACCESS"; }         /* アクセス */
/* コースページのヒーローを新しく作ったら、そのIDで1行足す
   例）#sec_0000000000000 { --tc-hero-eyebrow: "COURSE"; } */


/* ---------------------------------------------------------
   [3] 共通「次に見るページ」ナビ（下層ページの最後に置くカスタムHTML）
--------------------------------------------------------- */
body #tc-next, body #tc-next * { box-sizing: border-box; }
body #tc-next {
  padding: 72px 24px 80px;
  background: var(--tc-paper);
  border-top: 1px solid var(--tc-line);
}
body #tc-next .tc-next-inner { max-width: 1080px; margin: 0 auto; }
body #tc-next .tc-next-eyebrow {
  margin: 0 0 10px;
  color: #86561e;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: .14em;
}
body #tc-next .tc-next-title {
  margin: 0 0 32px;
  color: var(--tc-brown);
  font-size: clamp(26px, 3vw, 36px);
  font-weight: 900;
  line-height: 1.55;
  letter-spacing: 0;
  text-wrap: initial;
}
body #tc-next .tc-next-title > span { display: inline-block; white-space: nowrap; }
body #tc-next .tc-next-list {
  display: grid;
  /* カードを3枚にしても4枚にしても崩れないよう auto-fit を使う */
  grid-template-columns: repeat(auto-fit, minmax(228px, 1fr));
  gap: 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}
body #tc-next .tc-next-list > li { min-width: 0; }
body #tc-next .tc-next-list a {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  background: #fffdf7;
  border: 1px solid var(--tc-line);
  border-radius: 18px;
  color: var(--tc-brown);
  text-decoration: none;
}
body #tc-next .tc-next-photo {
  position: relative;
  display: block;
  flex: 0 0 auto;
  overflow: hidden;
  aspect-ratio: 16 / 10;
  background: #ecdfc7;
}
body #tc-next .tc-next-photo img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .25s ease;
}
body #tc-next .tc-next-body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 6px;
  padding: 18px 20px 20px;
}
body #tc-next .tc-next-label {
  color: #96682a;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: .1em;
}
body #tc-next .tc-next-name {
  color: var(--tc-brown);
  font-size: 20px;
  font-weight: 900;
  line-height: 1.6;
  word-break: keep-all;
}
body #tc-next .tc-next-text {
  color: var(--tc-muted);
  font-size: 14px;
  line-height: 1.85;
}
body #tc-next .tc-next-go {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
  padding-top: 14px;
  color: #7b5533;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
}
body #tc-next .tc-next-go svg {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  padding: 8px;
  border: 1px solid #ccae6c;
  border-radius: 50%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}
body #tc-next .tc-next-list a:hover { border-color: var(--tc-yellow); }
body #tc-next .tc-next-list a:hover img { transform: scale(1.04); }
body #tc-next .tc-next-list a:hover .tc-next-go svg { background: var(--tc-yellow); border-color: var(--tc-yellow); }
body #tc-next .tc-next-list a:focus-visible { outline: 3px solid #9b5b0b; outline-offset: 4px; }


/* ---------------------------------------------------------
   [4] とらちゃんについて：3つの強みカード（カスタムHTML）
--------------------------------------------------------- */
body #tc-about, body #tc-about * { box-sizing: border-box; }
body #tc-about {
  padding: 76px 24px 64px;
  background: var(--tc-cream);
}
body #tc-about .tc-about-inner { max-width: 1080px; margin: 0 auto; }
body #tc-about .tc-about-head { max-width: 760px; margin: 0 auto 44px; text-align: center; }
body #tc-about .tc-about-eyebrow {
  margin: 0 0 12px;
  color: #86561e;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: .14em;
}
body #tc-about h2 {
  margin: 0 0 18px;
  color: var(--tc-brown);
  font-size: clamp(26px, 3.2vw, 40px);
  font-weight: 900;
  line-height: 1.55;
  letter-spacing: 0;
  text-wrap: initial;
}
body #tc-about h2 > span { display: inline-block; white-space: nowrap; }
body #tc-about .tc-about-lead {
  margin: 0;
  color: #614531;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.95;
}
body #tc-about .tc-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}
body #tc-about .tc-cards > li {
  display: flex;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  background: #fffdf7;
  border: 1px solid var(--tc-line);
  border-radius: 20px;
}
body #tc-about .tc-card-photo { position: relative; display: block; flex: 0 0 auto; overflow: hidden; aspect-ratio: 4 / 3; background: #ecdfc7; }
body #tc-about .tc-card-photo img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
body #tc-about .tc-card-body { padding: 20px 22px 24px; }
body #tc-about .tc-card-no {
  display: inline-block;
  margin-bottom: 10px;
  padding: 4px 12px;
  background: var(--tc-yellow);
  border-radius: 999px;
  color: var(--tc-brown);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
}
body #tc-about .tc-card-title {
  margin: 0 0 8px;
  color: var(--tc-brown);
  font-size: 20px;
  font-weight: 900;
  line-height: 1.6;
  word-break: keep-all;
}
body #tc-about .tc-card-text {
  margin: 0;
  color: var(--tc-muted);
  font-size: 15px;
  line-height: 1.9;
  word-break: normal;
  word-break: auto-phrase;
}


/* ---------------------------------------------------------
   [5] メニュー：名物ピックアップ（カスタムHTML）
--------------------------------------------------------- */
body #tc-pick, body #tc-pick * { box-sizing: border-box; }
body #tc-pick {
  padding: 68px 24px 56px;
  background: var(--tc-paper);
}
body #tc-pick .tc-pick-inner { max-width: 1080px; margin: 0 auto; }
body #tc-pick .tc-pick-head { margin: 0 0 32px; }
body #tc-pick .tc-pick-eyebrow {
  margin: 0 0 10px;
  color: #86561e;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: .14em;
}
/* 「マスターの気まぐれで大満足」用の日本語ラベル。
   TOPの ABOUT ブロックと同じ作り（英字の下に和文ラベル）。 */
body #tc-pick .tc-pick-label {
  display: inline-block;
  margin: 0 0 14px;
  padding: 3px 0 6px;
  border-bottom: 3px solid var(--tc-yellow);
  color: #6f4930;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.5;
  white-space: nowrap;
}
body #tc-pick h2 {
  margin: 0 0 12px;
  color: var(--tc-brown);
  font-size: clamp(26px, 3vw, 36px);
  font-weight: 900;
  line-height: 1.55;
  text-wrap: initial;
}
body #tc-pick h2 > span { display: inline-block; white-space: nowrap; }
body #tc-pick .tc-pick-lead { margin: 0; color: #614531; font-size: 16px; line-height: 1.9; }
body #tc-pick .tc-pick-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}
body #tc-pick .tc-pick-list > li { min-width: 0; }
body #tc-pick .tc-pick-photo {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  margin-bottom: 14px;
  background: #ecdfc7;
  border-radius: 20px 20px 60px 20px;
  box-shadow: 9px 9px 0 #eddbbc;
}
body #tc-pick .tc-pick-photo img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
body #tc-pick .tc-pick-name {
  margin: 0 0 4px;
  color: var(--tc-brown);
  font-size: 18px;
  font-weight: 900;
  line-height: 1.65;
  word-break: keep-all;
}
body #tc-pick .tc-pick-text { margin: 0; color: var(--tc-muted); font-size: 14px; line-height: 1.85; }
body #tc-pick .tc-pick-note {
  margin: 28px 0 0;
  color: #785b43;
  font-size: 14px;
  line-height: 1.8;
  text-wrap: balance;
}


/* ---------------------------------------------------------
   [6] メニュー一覧（DB連動ブロック）の読みやすさ
--------------------------------------------------------- */
body .menu-grid-section { padding-top: 64px !important; }
body .menu-section-header { margin-bottom: 28px; }

/* カテゴリー切り替えチップ（カスタムJSで自動生成される） */
body .tc-menunav {
  position: sticky;
  top: 96px;
  z-index: 20;
  margin: 0 auto 32px;
  padding: 12px 14px;
  max-width: 1080px;
  background: rgba(255, 250, 240, .97);
  border: 1px solid var(--tc-line);
  border-radius: 18px;
  box-shadow: 0 6px 18px rgba(71, 45, 32, .08);
}
body .tc-menunav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
body .tc-menunav a {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 6px 15px;
  background: #fffdf7;
  border: 1px solid var(--tc-line);
  border-radius: 999px;
  color: var(--tc-brown);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  text-decoration: none;
  white-space: nowrap;
}
body .tc-menunav a:hover,
body .tc-menunav a:focus-visible { background: var(--tc-yellow); border-color: var(--tc-yellow); }

body .menu-cat-block {
  margin-bottom: 40px;
  padding: 26px 28px 8px;
  background: #fffdf7;
  border: 1px solid var(--tc-line);
  border-radius: 20px;
  scroll-margin-top: 150px;
}
body .menu-cat-header {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin-bottom: 18px;
  padding-bottom: 12px;
  border-bottom: 3px solid var(--tc-yellow);
}
body .menu-cat-name { margin: 0; font-size: 22px; font-weight: 900; line-height: 1.5; color: var(--tc-brown); word-break: keep-all; }
body .menu-cat-desc { margin: 0; font-size: 14px; line-height: 1.7; color: var(--tc-muted); }

body .menu-items-grid { column-gap: 44px; row-gap: 4px; }
body .menu-item-card.no-image {
  padding: 14px 0;
  border: 0;
  border-bottom: 1px dashed #e3d3b7;
  background: transparent;
}
body .menu-item-card.no-image .mi-info {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
  column-gap: 14px;
  row-gap: 4px;
}
body .menu-item-card .mi-title {
  /* 見出し既定の text-wrap:balance だと最終行が短く残りやすいので pretty にする */
  word-break: normal;
  word-break: auto-phrase;
  text-wrap: pretty;
}
body .menu-item-card.no-image .mi-title {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.75;
  color: var(--tc-brown);
}
body .menu-item-card.no-image .mi-title::after {
  content: "";
  flex: 1 1 20px;
  min-width: 20px;
  border-bottom: 1px dotted #cdb89a;
}
body .menu-item-card.no-image .mi-meta { grid-column: 2; grid-row: 1; justify-self: end; }
body .menu-item-card.no-image .mi-text {
  grid-column: 1 / -1;
  grid-row: 2;
  margin: 0;
  font-size: 14px;
  line-height: 1.8;
  color: var(--tc-muted);
}
body .menu-item-card.no-image .price-in { font-size: 17px; font-weight: 800; white-space: nowrap; }
body .menu-item-card.no-image .mi-tax { font-size: 14px; color: var(--tc-muted); margin-left: 4px; }


/* ---------------------------------------------------------
   [7] コース一覧ブロック（course_list）
--------------------------------------------------------- */
body .course-list-section { padding: 76px 24px 80px !important; background: var(--tc-cream); }
body .course-list-header { max-width: 1080px; margin: 0 auto 40px; text-align: center; }
/* 1コース＝1行。上から順に読ませる。 */
body .course-list-grid { max-width: 1080px; margin: 0 auto; grid-template-columns: minmax(0, 1fr); gap: 18px; }
body .course-list-card {
  display: block;
  min-width: 0;
  overflow: hidden;
  background: #fffdf7;
  border: 1px solid var(--tc-line);
  border-radius: 18px;
  box-shadow: none;
}
/* 写真は使わない。コース写真が未登録のときに出る魚アイコンの枠ごと消す。
   ※ あとから写真を載せたくなったら、この1行を消せば元に戻る。 */
body .course-list-card .course-list-img { display: none !important; }

/* 左＝コース名と説明、右＝金額と予約ボタン。
   説明文や金額が未入力のコースがあっても崩れないよう、行と列を明示している。 */
body .course-list-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: 36px;
  row-gap: 8px;
  align-items: start;
  padding: 26px 32px 28px;
}
body .course-list-kicker {
  grid-column: 1;
  grid-row: 1;
  justify-self: start;
  margin: 0;
  padding: 4px 12px;
  background: var(--tc-yellow);
  border-radius: 999px;
  color: var(--tc-brown);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
}
body .course-list-body h3 {
  grid-column: 1;
  grid-row: 2;
  margin: 0;
  font-size: 23px;
  font-weight: 900;
  line-height: 1.6;
  color: var(--tc-brown);
  word-break: keep-all;
  text-wrap: pretty;
}
body .course-list-text {
  grid-column: 1;
  grid-row: 3;
  margin: 0;
  max-width: 46em;
  font-size: 15px;
  line-height: 1.9;
  color: var(--tc-muted);
  word-break: normal;
  word-break: auto-phrase;
  text-wrap: pretty;
}
body .course-list-price {
  grid-column: 2;
  grid-row: 1;
  justify-self: end;
  margin: 0;
  font-size: 26px;
  font-weight: 900;
  line-height: 1.4;
  color: var(--tc-brown);
  white-space: nowrap;
}
body .course-list-price small { margin-left: 6px; font-size: 14px; font-weight: 700; color: var(--tc-muted); }
body .course-list-reserve {
  grid-column: 2;
  grid-row: 2;
  justify-self: end;
  width: auto;
  min-width: 230px;
  margin: 6px 0 0;
}
/* ビルダー未使用のときに出る旧レイアウト（.course-card）も、同じく写真なし・1列にそろえる。
   コースページをブロック化すればこちらは描画されないが、念のため。 */
body .course-card .course-img-box { display: none !important; }
body .course-card:has(.course-img-box img) { grid-template-columns: minmax(0, 1fr) !important; }

body .drink-option-list {
  max-width: 1080px;
  margin: 40px auto 0;
  padding: 26px 28px;
  background: var(--tc-paper);
  border: 1px solid var(--tc-line);
  border-radius: 20px;
}
body .drink-option-list h3 { margin: 0 0 14px; font-size: 20px; font-weight: 900; color: var(--tc-brown); }
body .drink-option-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px dashed #e3d3b7;
  font-size: 16px;
  color: var(--tc-brown);
}
body .drink-option-row strong { font-size: 18px; white-space: nowrap; }


/* ---------------------------------------------------------
   [8] アクセス：来店案内カード（カスタムHTML）
--------------------------------------------------------- */
body #tc-access, body #tc-access * { box-sizing: border-box; }
body #tc-access { padding: 68px 24px 60px; background: var(--tc-cream); }
body #tc-access .tc-access-inner { max-width: 1080px; margin: 0 auto; }
body #tc-access .tc-access-head { margin: 0 0 32px; text-align: center; }
body #tc-access .tc-access-eyebrow {
  margin: 0 0 10px;
  color: #86561e;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: .14em;
}
body #tc-access h2 { margin: 0; color: var(--tc-brown); font-size: clamp(26px, 3vw, 36px); font-weight: 900; line-height: 1.55; text-wrap: initial; }
body #tc-access h2 > span { display: inline-block; white-space: nowrap; }
body #tc-access .tc-access-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  margin: 0 0 32px;
  padding: 0;
  list-style: none;
}
body #tc-access .tc-access-list > li {
  min-width: 0;
  padding: 24px 24px 26px;
  background: #fffdf7;
  border: 1px solid var(--tc-line);
  border-radius: 18px;
}
body #tc-access .tc-access-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  margin-bottom: 14px;
  background: var(--tc-yellow);
  border-radius: 50%;
  font-size: 20px;
}
body #tc-access .tc-access-name { margin: 0 0 6px; color: var(--tc-brown); font-size: 18px; font-weight: 900; line-height: 1.6; word-break: keep-all; }
body #tc-access .tc-access-text { margin: 0; color: var(--tc-muted); font-size: 15px; line-height: 1.9; word-break: normal; word-break: auto-phrase; }
body #tc-access .tc-access-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
body #tc-access .tc-access-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 52px;
  padding: 13px 28px;
  border-radius: 999px;
  border: 1px solid var(--tc-yellow);
  background: var(--tc-yellow);
  color: var(--tc-brown);
  font-size: 16px;
  font-weight: 800;
  line-height: 1.5;
  text-decoration: none;
  white-space: nowrap;
}
body #tc-access .tc-access-btn.is-outline { background: transparent; border-color: #c9ab6b; }
body #tc-access .tc-access-btn:hover { background: #ffda69; border-color: #ffda69; }
body #tc-access .tc-access-btn:focus-visible { outline: 3px solid #9b5b0b; outline-offset: 4px; }


/* ---------------------------------------------------------
   [9] ギャラリー（image_grid）
--------------------------------------------------------- */
body .image-grid-section { background: var(--tc-cream); }
body .image-grid { gap: 18px; }
body .image-grid-item { overflow: hidden; border-radius: 18px; background: #ecdfc7; }
body .image-grid-item img { display: block; width: 100%; height: 100%; object-fit: cover; }


/* =========================================================
   [10-A] タブレット（900px以下）
   メニューを2列のままにすると品名が1文字だけ次の行に落ちるため、
   ここで1列に切り替える。
   ========================================================= */
@media (max-width: 900px) {
  body .menu-items-grid { grid-template-columns: minmax(0, 1fr); column-gap: 0; }
  body .course-list-body { column-gap: 24px; padding: 24px 24px 26px; }
}

/* =========================================================
   [10] スマートフォン（767px以下）
   ここから下は、上の指定をスマホ用に上書きする。
   ========================================================= */
@media (max-width: 767px) {
  :root { --tc-hero-height: 260px; }

  body :is(.page-hero-wrapper, .course-hero) {
    padding: 72px 22px 34px;
    background-position: center 55% !important;
  }
  body :is(.ph-container, .course-hero .hero-content)::before {
    margin-bottom: 10px;
    font-size: 14px;
    letter-spacing: .1em;
  }
  body :is(.ph-title, .course-page-title) { font-size: 28px; letter-spacing: 0; line-height: 1.5; }
  body :is(.ph-desc, .course-page-desc) { margin-top: 10px; font-size: 15px; line-height: 1.85; }

  body #tc-next { padding: 52px 22px 56px; }
  body #tc-next .tc-next-title { margin-bottom: 24px; font-size: 26px; }
  body #tc-next .tc-next-list { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  body #tc-next .tc-next-list a { flex-direction: row; align-items: stretch; border-radius: 16px; }
  body #tc-next .tc-next-photo { flex: 0 0 116px; width: 116px; aspect-ratio: auto; }
  body #tc-next .tc-next-body { gap: 4px; padding: 14px 16px; }
  body #tc-next .tc-next-name { font-size: 18px; }
  body #tc-next .tc-next-text { display: none; }
  body #tc-next .tc-next-go { padding-top: 8px; }
  body #tc-next .tc-next-go svg { width: 30px; height: 30px; flex-basis: 30px; padding: 7px; }

  body #tc-about { padding: 52px 22px 48px; }
  body #tc-about .tc-about-head { margin-bottom: 28px; text-align: left; }
  body #tc-about h2 { font-size: 26px; }
  body #tc-about .tc-cards { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  body #tc-about .tc-card-photo { aspect-ratio: 16 / 9; }
  body #tc-about .tc-card-body { padding: 18px 20px 22px; }
  body #tc-about .tc-card-title { font-size: 19px; }

  body #tc-pick { padding: 48px 22px 44px; }
  body #tc-pick .tc-pick-label { margin-bottom: 12px; font-size: 15px; }
  body #tc-pick h2 { font-size: 26px; }
  body #tc-pick .tc-pick-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 14px; }
  body #tc-pick .tc-pick-list > li:first-child { grid-column: 1 / -1; }
  body #tc-pick .tc-pick-photo { margin-bottom: 10px; border-radius: 16px 16px 40px 16px; box-shadow: 6px 6px 0 #eddbbc; }
  body #tc-pick .tc-pick-list > li:first-child .tc-pick-photo { aspect-ratio: 16 / 10; }
  body #tc-pick .tc-pick-name { font-size: 16px; }
  body #tc-pick .tc-pick-text { font-size: 14px; }

  body .menu-grid-section { padding-top: 44px !important; }
  body .tc-menunav { top: 84px; padding: 10px 12px; margin-bottom: 24px; border-radius: 14px; }
  body .tc-menunav ul {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 4px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  body .tc-menunav ul::-webkit-scrollbar { display: none; }
  body .tc-menunav a { min-height: 36px; padding: 6px 14px; }
  body .menu-cat-block { margin-bottom: 26px; padding: 20px 18px 6px; border-radius: 16px; scroll-margin-top: 128px; }
  body .menu-cat-name { font-size: 20px; }
  body .menu-items-grid { row-gap: 0; }
  body .menu-item-card.no-image { padding: 12px 0; }
  body .menu-item-card.no-image .mi-title { font-size: 15px; gap: 0; }
  body .menu-item-card.no-image .mi-title::after { display: none; }
  body .menu-item-card.no-image .price-in { font-size: 16px; }

  body .course-list-section { padding: 48px 22px 52px !important; }
  body .course-list-header { margin-bottom: 26px; }
  body .course-list-grid { gap: 14px; }
  /* スマホは縦に積む。金額とボタンも横幅いっぱいに。 */
  body .course-list-body { grid-template-columns: minmax(0, 1fr); column-gap: 0; row-gap: 10px; padding: 20px 20px 22px; }
  body .course-list-body h3 { grid-column: 1; grid-row: 2; font-size: 20px; }
  body .course-list-text { grid-column: 1; grid-row: 3; }
  body .course-list-price { grid-column: 1; grid-row: 4; justify-self: start; font-size: 22px; }
  body .course-list-reserve { grid-column: 1; grid-row: 5; justify-self: stretch; width: 100%; min-width: 0; margin: 2px 0 0; }
  body .drink-option-list { margin-top: 26px; padding: 20px 18px; border-radius: 16px; }
  body .drink-option-row { font-size: 15px; }

  body #tc-access { padding: 48px 22px 44px; }
  body #tc-access .tc-access-head { margin-bottom: 24px; text-align: left; }
  body #tc-access h2 { font-size: 26px; }
  body #tc-access .tc-access-list { grid-template-columns: minmax(0, 1fr); gap: 14px; margin-bottom: 26px; }
  body #tc-access .tc-access-list > li { padding: 20px 20px 22px; }
  body #tc-access .tc-access-icon { width: 42px; height: 42px; margin-bottom: 12px; }
  body #tc-access .tc-access-actions { flex-direction: column; }
  body #tc-access .tc-access-btn { width: 100%; }

  body .image-grid { gap: 12px; }
  body .image-grid-item { border-radius: 14px; }
}

/* 画面がとても狭いとき（iPhone SE など） */
@media (max-width: 380px) {
  body :is(.ph-title, .course-page-title) { font-size: 25px; }
  /* この幅では料理名と金額を横に並べると、品名の最後が2〜3文字だけ次の行に落ちる。
     金額を1段下ろして、品名に横幅をぜんぶ使わせる。 */
  body .menu-item-card.no-image .mi-info { grid-template-columns: minmax(0, 1fr); }
  body .menu-item-card.no-image .mi-title { grid-column: 1; grid-row: 1; }
  body .menu-item-card.no-image .mi-text { grid-column: 1; grid-row: 2; }
  body .menu-item-card.no-image .mi-meta { grid-column: 1; grid-row: 3; justify-self: end; }
  body #tc-next .tc-next-photo { flex-basis: 100px; width: 100px; }
  body #tc-next .tc-next-name { font-size: 17px; }
}

@media (prefers-reduced-motion: reduce) {
  body #tc-next .tc-next-photo img { transition: none; }
  body #tc-next .tc-next-list a:hover img { transform: none; }
}
/* とらちゃん 下層ページCSS v2 ここまで */

/* 管理画面「共通CSS編集（style.css）」の一番下に追加。
   既存CSSは削除しません。HTML・PHPの変更は不要です。
   指定画像を加工せず使用します（元画像の黒い背景もそのまま表示されます）。
   / から始まる画像パスにして、CSSファイルの保存場所に影響されないようにしています。 */

/* スマホメニュー：開いたときの上部中央。閉じているときは親要素と一緒に非表示。 */
@media (max-width: 1024px) {
  body #mobileNav.mobile-nav-overlay {
    box-sizing: border-box;
    justify-content: flex-start;
    align-items: center;
    gap: 14px;
    padding: calc(76px + env(safe-area-inset-top, 0px)) 20px
      calc(100px + env(safe-area-inset-bottom, 0px));
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  body #mobileNav::before {
    content: "";
    display: block;
    flex: 0 0 112px;
    width: 112px;
    height: 112px;
    margin: 0 auto 10px;
    background: url("/image/assets/asset_20260831114735_6a94eb4739ce0.webp") center / contain no-repeat;
    pointer-events: none;
  }
  body #mobileNav > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    min-height: 44px;
    max-width: 100%;
    text-align: center;
  }
}

/* フッター：既存の店名・SNSリンクのさらに下、中央へ追加（PC・スマホ共通）。 */
#tc3-footer .tc3-footer-bottom::after {
  content: "";
  display: block;
  width: 112px;
  height: 112px;
  margin: 28px auto 0;
  background: url("/image/assets/asset_20260831114735_6a94eb4739ce0.webp") center / contain no-repeat;
  pointer-events: none;
}
/* 共通CSS編集（style.css）の一番下に追加。前回の画像追加CSSは残してください。
   指定画像の外周だけをCSSで切り抜きます。元のWebP・目・鼻・口は変更しません。
   この輪郭は asset_20260831114735_6a94eb4739ce0.webp 専用です。
   別の画像へ差し替える際は、このCSSを削除してください。 */
body #mobileNav::before,
#tc3-footer .tc3-footer-bottom::after {
  background-image: url("/image/assets/asset_20260831114735_6a94eb4739ce0.webp");
  background-color: transparent;
  background-size: 100% 100%;
  -webkit-clip-path: polygon(82.167% 5.667%,82.917% 5.667%,83.083% 5.833%,84.333% 8.000%,84.750% 9.250%,85.750% 9.333%,86.333% 10.667%,86.917% 12.750%,87.250% 15.250%,87.250% 17.000%,88.417% 17.000%,88.500% 17.333%,88.333% 19.750%,87.750% 22.083%,87.750% 23.417%,88.583% 23.417%,88.583% 24.083%,87.750% 26.917%,86.917% 28.667%,86.417% 29.333%,86.417% 30.417%,87.583% 30.417%,87.583% 30.917%,86.500% 33.250%,85.417% 34.750%,85.417% 35.833%,86.083% 35.833%,86.167% 36.167%,85.000% 37.917%,84.333% 38.500%,84.333% 39.583%,85.333% 39.917%,85.333% 40.250%,84.500% 40.917%,84.500% 42.000%,86.500% 43.750%,87.750% 45.417%,88.167% 46.417%,84.750% 47.000%,84.750% 48.083%,85.167% 48.417%,85.333% 48.917%,83.750% 49.333%,83.750% 50.417%,85.083% 52.000%,86.250% 53.917%,86.917% 55.417%,86.917% 55.833%,86.500% 55.833%,84.583% 55.167%,83.500% 55.167%,83.500% 56.250%,84.250% 57.583%,85.250% 60.000%,84.917% 60.083%,84.417% 59.917%,82.750% 59.083%,81.667% 59.083%,81.667% 60.167%,82.250% 62.250%,82.417% 64.000%,81.500% 63.833%,79.417% 62.750%,78.250% 62.750%,78.167% 66.167%,78.000% 66.583%,77.250% 66.583%,77.250% 67.667%,77.583% 68.083%,79.000% 68.000%,81.417% 70.667%,81.500% 71.000%,81.750% 71.167%,82.583% 72.500%,82.500% 72.833%,81.917% 72.833%,81.917% 73.917%,82.667% 75.250%,82.667% 75.667%,82.417% 75.667%,82.417% 76.750%,83.083% 77.667%,84.667% 79.083%,85.667% 80.333%,86.833% 82.250%,87.500% 84.083%,87.667% 85.000%,87.667% 86.750%,87.417% 87.750%,86.917% 88.667%,86.250% 89.333%,85.583% 89.667%,84.250% 89.667%,83.750% 89.417%,83.750% 89.083%,82.667% 89.083%,82.417% 89.667%,81.833% 90.250%,80.583% 90.833%,79.083% 90.833%,78.250% 90.583%,77.000% 89.583%,77.000% 89.250%,75.917% 89.250%,75.750% 89.667%,75.167% 90.250%,74.167% 90.750%,72.083% 90.833%,71.417% 90.667%,70.417% 90.083%,69.667% 89.167%,69.500% 88.583%,68.417% 88.583%,68.417% 89.000%,66.917% 89.167%,65.417% 88.583%,64.500% 87.667%,63.833% 86.500%,63.417% 84.583%,63.667% 80.917%,61.917% 80.917%,61.500% 81.583%,60.250% 82.750%,58.917% 83.583%,57.000% 84.417%,56.750% 84.417%,56.750% 84.000%,55.583% 84.000%,54.000% 84.667%,52.417% 85.000%,48.333% 85.083%,45.750% 84.583%,44.583% 84.000%,43.333% 84.000%,43.333% 84.333%,42.417% 84.167%,39.917% 82.750%,38.167% 81.083%,38.083% 80.833%,36.333% 80.833%,36.333% 82.000%,36.583% 82.833%,36.500% 85.500%,35.833% 87.250%,34.500% 88.667%,33.250% 89.167%,32.083% 89.167%,31.500% 88.833%,30.417% 88.833%,30.000% 89.667%,29.500% 90.167%,28.583% 90.667%,27.417% 90.917%,25.667% 90.750%,24.750% 90.250%,24.333% 89.833%,24.083% 89.250%,23.000% 89.250%,22.917% 89.667%,22.417% 90.167%,21.000% 90.833%,19.250% 90.833%,18.250% 90.333%,17.583% 89.750%,17.333% 89.250%,16.250% 89.250%,16.083% 89.500%,15.333% 89.750%,14.667% 89.750%,13.917% 89.500%,12.750% 88.250%,12.250% 86.583%,12.417% 84.333%,13.500% 81.583%,15.333% 79.083%,16.250% 78.167%,16.417% 78.167%,17.667% 76.750%,17.667% 75.667%,17.333% 75.667%,17.333% 75.250%,18.083% 73.917%,18.083% 72.833%,17.417% 72.833%,17.417% 72.500%,18.917% 70.250%,21.000% 68.000%,22.500% 68.083%,22.750% 67.750%,22.750% 66.583%,21.917% 66.583%,21.833% 66.250%,21.667% 64.917%,21.750% 62.750%,20.583% 62.750%,18.333% 63.917%,17.583% 64.083%,17.667% 62.667%,18.250% 60.417%,18.250% 59.167%,17.083% 59.167%,15.417% 60.000%,14.750% 60.083%,14.750% 59.667%,14.917% 59.583%,16.417% 56.417%,16.417% 55.250%,15.250% 55.250%,13.333% 55.917%,13.000% 55.833%,13.000% 55.500%,13.833% 53.750%,15.500% 51.167%,16.250% 50.417%,16.250% 49.333%,14.667% 48.917%,14.667% 48.583%,15.250% 48.083%,15.250% 47.000%,11.833% 46.500%,11.833% 46.083%,13.167% 44.167%,14.500% 42.750%,15.500% 42.000%,15.500% 40.917%,14.583% 40.250%,14.583% 39.917%,15.583% 39.583%,15.583% 38.500%,15.167% 38.167%,13.833% 36.167%,13.917% 35.833%,14.583% 35.833%,14.583% 34.750%,13.500% 33.333%,12.417% 31.000%,12.417% 30.417%,13.500% 30.417%,13.500% 29.250%,12.250% 27.000%,11.417% 24.250%,11.417% 23.417%,12.250% 23.417%,12.250% 22.167%,11.917% 21.250%,11.583% 19.083%,11.500% 17.083%,12.750% 17.000%,12.750% 14.917%,13.000% 13.083%,13.333% 11.667%,14.250% 9.333%,15.250% 9.333%,15.333% 8.833%,16.000% 7.417%,17.083% 5.750%,18.250% 5.833%,20.083% 6.333%,22.750% 7.417%,25.083% 8.583%,28.750% 11.000%,30.417% 12.500%,30.583% 12.500%,30.583% 12.667%,30.833% 12.750%,31.417% 13.417%,32.833% 13.500%,36.417% 18.417%,37.417% 20.333%,37.833% 20.833%,38.500% 22.333%,39.583% 22.333%,39.583% 21.417%,43.083% 19.833%,45.500% 19.083%,48.917% 18.583%,51.917% 18.583%,55.500% 19.083%,57.750% 19.750%,60.333% 20.833%,60.583% 21.000%,60.583% 21.750%,61.667% 21.750%,62.667% 19.833%,64.333% 17.250%,67.250% 13.500%,68.583% 13.500%,69.500% 12.500%,69.667% 12.500%,71.000% 11.250%,73.583% 9.417%,74.917% 8.750%,75.417% 8.333%,79.750% 6.333%);
  clip-path: polygon(82.167% 5.667%,82.917% 5.667%,83.083% 5.833%,84.333% 8.000%,84.750% 9.250%,85.750% 9.333%,86.333% 10.667%,86.917% 12.750%,87.250% 15.250%,87.250% 17.000%,88.417% 17.000%,88.500% 17.333%,88.333% 19.750%,87.750% 22.083%,87.750% 23.417%,88.583% 23.417%,88.583% 24.083%,87.750% 26.917%,86.917% 28.667%,86.417% 29.333%,86.417% 30.417%,87.583% 30.417%,87.583% 30.917%,86.500% 33.250%,85.417% 34.750%,85.417% 35.833%,86.083% 35.833%,86.167% 36.167%,85.000% 37.917%,84.333% 38.500%,84.333% 39.583%,85.333% 39.917%,85.333% 40.250%,84.500% 40.917%,84.500% 42.000%,86.500% 43.750%,87.750% 45.417%,88.167% 46.417%,84.750% 47.000%,84.750% 48.083%,85.167% 48.417%,85.333% 48.917%,83.750% 49.333%,83.750% 50.417%,85.083% 52.000%,86.250% 53.917%,86.917% 55.417%,86.917% 55.833%,86.500% 55.833%,84.583% 55.167%,83.500% 55.167%,83.500% 56.250%,84.250% 57.583%,85.250% 60.000%,84.917% 60.083%,84.417% 59.917%,82.750% 59.083%,81.667% 59.083%,81.667% 60.167%,82.250% 62.250%,82.417% 64.000%,81.500% 63.833%,79.417% 62.750%,78.250% 62.750%,78.167% 66.167%,78.000% 66.583%,77.250% 66.583%,77.250% 67.667%,77.583% 68.083%,79.000% 68.000%,81.417% 70.667%,81.500% 71.000%,81.750% 71.167%,82.583% 72.500%,82.500% 72.833%,81.917% 72.833%,81.917% 73.917%,82.667% 75.250%,82.667% 75.667%,82.417% 75.667%,82.417% 76.750%,83.083% 77.667%,84.667% 79.083%,85.667% 80.333%,86.833% 82.250%,87.500% 84.083%,87.667% 85.000%,87.667% 86.750%,87.417% 87.750%,86.917% 88.667%,86.250% 89.333%,85.583% 89.667%,84.250% 89.667%,83.750% 89.417%,83.750% 89.083%,82.667% 89.083%,82.417% 89.667%,81.833% 90.250%,80.583% 90.833%,79.083% 90.833%,78.250% 90.583%,77.000% 89.583%,77.000% 89.250%,75.917% 89.250%,75.750% 89.667%,75.167% 90.250%,74.167% 90.750%,72.083% 90.833%,71.417% 90.667%,70.417% 90.083%,69.667% 89.167%,69.500% 88.583%,68.417% 88.583%,68.417% 89.000%,66.917% 89.167%,65.417% 88.583%,64.500% 87.667%,63.833% 86.500%,63.417% 84.583%,63.667% 80.917%,61.917% 80.917%,61.500% 81.583%,60.250% 82.750%,58.917% 83.583%,57.000% 84.417%,56.750% 84.417%,56.750% 84.000%,55.583% 84.000%,54.000% 84.667%,52.417% 85.000%,48.333% 85.083%,45.750% 84.583%,44.583% 84.000%,43.333% 84.000%,43.333% 84.333%,42.417% 84.167%,39.917% 82.750%,38.167% 81.083%,38.083% 80.833%,36.333% 80.833%,36.333% 82.000%,36.583% 82.833%,36.500% 85.500%,35.833% 87.250%,34.500% 88.667%,33.250% 89.167%,32.083% 89.167%,31.500% 88.833%,30.417% 88.833%,30.000% 89.667%,29.500% 90.167%,28.583% 90.667%,27.417% 90.917%,25.667% 90.750%,24.750% 90.250%,24.333% 89.833%,24.083% 89.250%,23.000% 89.250%,22.917% 89.667%,22.417% 90.167%,21.000% 90.833%,19.250% 90.833%,18.250% 90.333%,17.583% 89.750%,17.333% 89.250%,16.250% 89.250%,16.083% 89.500%,15.333% 89.750%,14.667% 89.750%,13.917% 89.500%,12.750% 88.250%,12.250% 86.583%,12.417% 84.333%,13.500% 81.583%,15.333% 79.083%,16.250% 78.167%,16.417% 78.167%,17.667% 76.750%,17.667% 75.667%,17.333% 75.667%,17.333% 75.250%,18.083% 73.917%,18.083% 72.833%,17.417% 72.833%,17.417% 72.500%,18.917% 70.250%,21.000% 68.000%,22.500% 68.083%,22.750% 67.750%,22.750% 66.583%,21.917% 66.583%,21.833% 66.250%,21.667% 64.917%,21.750% 62.750%,20.583% 62.750%,18.333% 63.917%,17.583% 64.083%,17.667% 62.667%,18.250% 60.417%,18.250% 59.167%,17.083% 59.167%,15.417% 60.000%,14.750% 60.083%,14.750% 59.667%,14.917% 59.583%,16.417% 56.417%,16.417% 55.250%,15.250% 55.250%,13.333% 55.917%,13.000% 55.833%,13.000% 55.500%,13.833% 53.750%,15.500% 51.167%,16.250% 50.417%,16.250% 49.333%,14.667% 48.917%,14.667% 48.583%,15.250% 48.083%,15.250% 47.000%,11.833% 46.500%,11.833% 46.083%,13.167% 44.167%,14.500% 42.750%,15.500% 42.000%,15.500% 40.917%,14.583% 40.250%,14.583% 39.917%,15.583% 39.583%,15.583% 38.500%,15.167% 38.167%,13.833% 36.167%,13.917% 35.833%,14.583% 35.833%,14.583% 34.750%,13.500% 33.333%,12.417% 31.000%,12.417% 30.417%,13.500% 30.417%,13.500% 29.250%,12.250% 27.000%,11.417% 24.250%,11.417% 23.417%,12.250% 23.417%,12.250% 22.167%,11.917% 21.250%,11.583% 19.083%,11.500% 17.083%,12.750% 17.000%,12.750% 14.917%,13.000% 13.083%,13.333% 11.667%,14.250% 9.333%,15.250% 9.333%,15.333% 8.833%,16.000% 7.417%,17.083% 5.750%,18.250% 5.833%,20.083% 6.333%,22.750% 7.417%,25.083% 8.583%,28.750% 11.000%,30.417% 12.500%,30.583% 12.500%,30.583% 12.667%,30.833% 12.750%,31.417% 13.417%,32.833% 13.500%,36.417% 18.417%,37.417% 20.333%,37.833% 20.833%,38.500% 22.333%,39.583% 22.333%,39.583% 21.417%,43.083% 19.833%,45.500% 19.083%,48.917% 18.583%,51.917% 18.583%,55.500% 19.083%,57.750% 19.750%,60.333% 20.833%,60.583% 21.000%,60.583% 21.750%,61.667% 21.750%,62.667% 19.833%,64.333% 17.250%,67.250% 13.500%,68.583% 13.500%,69.500% 12.500%,69.667% 12.500%,71.000% 11.250%,73.583% 9.417%,74.917% 8.750%,75.417% 8.333%,79.750% 6.333%);
}
