@charset "UTF-8";

/* responsive helpers（デフォは非表示） */
br.sp-only,
br.tab-only,
br.pc-only,
br.md-up { display: none; }

/* --- mini reset --- */
*,*::before,*::after{ box-sizing:border-box; }
body{ margin:0; line-height:1.5; }
h1,h2,h3,h4,p,figure,blockquote,dl,dd{ margin:0; }
img,svg,video,canvas{ display:block; max-width:100%; height:auto; }
button,input,select,textarea{ font:inherit; }
:where([hidden]){ display:none; }
hr{ height:0; color:inherit; }
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}

/* --- tokens（必要最低限） --- */
:root{
  --navy:#0b1a2a;
  --gold:#c8a96a;
  --ink:#1e2937;
  --t2-header-h:72px; /* アンカー停止位置用のヘッダー高さ推定値 */
  --t2-label-w: 8em;
}

/* ===== Base helpers ===== */
/* html の宣言はここに一本化（テキストズーム対策 + スムーススクロール + アンカー補正） */
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top: var(--t2-header-h, 72px);
}

/* ===== Header ===== */
.t2-header{
  background: rgba(11,26,42,.92);
  color:#fff;
  border-bottom:1px solid rgba(200,169,106,.25);
}
.t2-header .inner{
  width:min(92vw,1100px);
  margin-inline:auto;
  padding:12px 16px;
  display:flex; align-items:center; gap:16px;
  justify-content:space-between;
}
.t2-brand{
  font-weight:700; letter-spacing:.02em; text-decoration:none; color:#fff;
  font-size: clamp(18px, 2.4vw, 22px);
}
.t2-nav{ display:flex; align-items:center; gap: clamp(12px, 2.4vw, 24px); }
.t2-nav a{ color:#fff; text-decoration:none; }
.t2-nav a:hover{ color: var(--gold); }

/* --- Hero --- */
.t2-hero{
  position:relative;
  min-height:62vh;
  display:grid;
  place-items:end start;           /* 左下配置 */
  color:#fff;
  background:
    linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.68)),
    url("../img/hero02.jpg") center 40%/cover no-repeat;
}
.t2-hero .inner{
  width:min(92vw,1100px);
  max-width:720px;
  margin-left:clamp(16px,6vw,80px);
  padding-bottom:clamp(24px,5vw,80px);
  text-align:left;
}
.btn-gold{
  display:inline-block;
  margin-top:12px;
  padding:.8em 1.4em;
  background:var(--gold);
  color:var(--navy);
  border-radius:10px;
  text-decoration:none;
  font-weight:600;
}

/* --- Services --- */

.t2-service{ display:flex; flex-direction:column; gap:10px; }
.t2-service h3{
  color:var(--navy);
  font-size:clamp(18px,2.2vw,22px);
  letter-spacing:.02em;
  margin-top:6px;
}
.t2-service p{
  color:var(--ink);
  font-size:clamp(14px,1.6vw,16px);
  line-height:1.7;
}

/* 画像カード */
.t2-media{
  aspect-ratio:4 / 3;           /* 控えめな比率 */
  overflow:hidden;
  border-radius:12px;
  box-shadow:0 6px 24px rgba(0,0,0,.12);
}
.t2-media img{ width:100%; height:100%; object-fit:cover; }

/* --- plaque（控えめトーン） --- */
.t2-plaque-soft{
  background:#0f1e2f;           /* 濃紺を少し明るく */
  border-radius:14px;
  padding:clamp(20px,4vw,32px);
}
.t2-plaque-soft .t2-service{
  background:#fff;
  border:1px solid rgba(200,169,106,.25);
  border-radius:12px;
  padding:12px;
  box-shadow:0 3px 14px rgba(0,0,0,.08);
}
.t2-plaque-soft .t2-service h3{ color:var(--navy); }
.t2-plaque-soft .t2-service p { color:#334155; }

/* 共通の見た目（既存でもOK） */
/* === Services: 小アイコン（本・盾・秤）— 安全な1行データURI === */
/* ========== Services: 小アイコン（本・盾・秤）: 警告が出にくい実装 ========== */

/* 1) まずはフォールバック（絵文字）— どの環境でも確実に表示 */
.t2-service h3{ display:flex; align-items:center; gap:.5em; }
.t2-service h3::before{
  content:"📘";            /* 1枚目=本 */
  display:inline-block;
  width:1.1em; height:1.1em; line-height:1;
}
.t2-services > .t2-service:nth-of-type(2) h3::before{ content:"🛡️"; }  /* 2枚目=盾 */
.t2-services > .t2-service:nth-of-type(3) h3::before{ content:"⚖️"; }  /* 3枚目=秤 */

/* 2) マスク対応の環境では “本物のピクト” に上書き（-webkit- と標準を分けて記述） */
@supports (-webkit-mask: url("")) {
  .t2-service h3::before{
    content:"";
    width:1.1em; height:1.1em;
    background: var(--gold);
    -webkit-mask: url("data:image/svg+xml;utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Crect%20x='3'%20y='4'%20width='8'%20height='16'%20rx='2'/%3E%3Crect%20x='13'%20y='4'%20width='8'%20height='16'%20rx='2'/%3E%3Crect%20x='11.5'%20y='4'%20width='1'%20height='16'/%3E%3C/svg%3E") no-repeat center / contain;
  }
  .t2-services > .t2-service:nth-of-type(2) h3::before{
    -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20d='M12%202%20L20%206%20V12%20C20%2016%2016%2020%2012%2022%208%2020%204%2016%204%2012%20V6%20Z'/%3E%3C/svg%3E");
  }
  .t2-services > .t2-service:nth-of-type(3) h3::before{
    -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Crect%20x='11'%20y='5'%20width='2'%20height='13'/%3E%3Crect%20x='7'%20y='5'%20width='10'%20height='2'/%3E%3Crect%20x='8'%20y='7'%20width='1'%20height='4'/%3E%3Crect%20x='15'%20y='7'%20width='1'%20height='4'/%3E%3Cellipse%20cx='8.5'%20cy='13'%20rx='2.5'%20ry='1.5'/%3E%3Cellipse%20cx='15.5'%20cy='13'%20rx='2.5'%20ry='1.5'/%3E%3Crect%20x='9'%20y='18'%20width='6'%20height='2'/%3E%3C/svg%3E");
  }
}

@supports (mask: url("")) {
  .t2-service h3::before{
    content:"";
    width:1.1em; height:1.1em;
    background: var(--gold);
    mask: url("data:image/svg+xml;utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Crect%20x='3'%20y='4'%20width='8'%20height='16'%20rx='2'/%3E%3Crect%20x='13'%20y='4'%20width='8'%20height='16'%20rx='2'/%3E%3Crect%20x='11.5'%20y='4'%20width='1'%20height='16'/%3E%3C/svg%3E") no-repeat center / contain;
  }
  .t2-services > .t2-service:nth-of-type(2) h3::before{
    mask-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20d='M12%202%20L20%206%20V12%20C20%2016%2016%2020%2012%2022%208%2020%204%2016%204%2012%20V6%20Z'/%3E%3C/svg%3E");
  }
  .t2-services > .t2-service:nth-of-type(3) h3::before{
    mask-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Crect%20x='11'%20y='5'%20width='2'%20height='13'/%3E%3Crect%20x='7'%20y='5'%20width='10'%20height='2'/%3E%3Crect%20x='8'%20y='7'%20width='1'%20height='4'/%3E%3Crect%20x='15'%20y='7'%20width='1'%20height='4'/%3E%3Cellipse%20cx='8.5'%20cy='13'%20rx='2.5'%20ry='1.5'/%3E%3Cellipse%20cx='15.5'%20cy='13'%20rx='2.5'%20ry='1.5'/%3E%3Crect%20x='9'%20y='18'%20width='6'%20height='2'/%3E%3C/svg%3E");
  }
}


/* === About ========================= */
.t2-about{
  padding-block: clamp(48px, 6vw, 96px);
}
.t2-about .inner{
  width:min(92vw,1100px);
  margin-inline:auto;
  padding-inline:16px;
}
.t2-about-grid{
  display:grid;
  gap:24px;
  align-items:center;
}
.t2-about-media img{
  width:100%;
  height:auto;
  display:block;
  border-radius:12px;
  object-fit:cover;
}
.t2-about-body{
  display:grid;
  gap:16px;
}
.t2-about-lead{
  line-height:1.9;
  opacity:.9;
}
@supports (text-wrap: balance){
  @media (min-width: 1025px){
    .t2-about-lead{ text-wrap: balance; }
  }
}

.t2-about-facts{
  display:grid;
  gap:10px;
}
.t2-about-facts dt{
  font-weight:600;
  letter-spacing:.02em;
}
.t2-about-facts dd{
  margin:0;
  opacity:.9;
}

/* ===== Footer ===== */
.t2-footer{
  background: var(--navy);
  color:#fff;
  padding: 32px 0 40px;
}
.t2-footer .inner{
  width:min(92vw,1100px);
  margin-inline:auto;
  padding-inline:16px;
  display:flex; flex-direction:column; gap:10px;
}
.t2-foot-brand{ font-weight:700; letter-spacing:.02em; }
.t2-address{ font-style:normal; opacity:.95; line-height:1.8; }
.t2-copy{ opacity:.7; }
.t2-footer a{ color: var(--gold); text-decoration:none; }
.t2-footer a:hover{ text-decoration:underline; }

/* ===== Nav active & a11y ===== */
.t2-nav a.is-active{
  color: var(--gold);
}
.t2-nav a.is-active::after{
  content:"";
  display:block;
  height:2px;
  border-radius:1px;
  background: var(--gold);
  margin-top:2px;
}

/* クリック/Tab移動の見え方を統一 */
a, button, [tabindex]:not([tabindex="-1"]){
  outline: none;
}
a:focus-visible, .btn-gold:focus-visible{
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--gold) 30%, white);
  border-radius: 10px;
}

/* ===== Section Title ===== */
.t2-section-title{
  font-size: clamp(20px, 2.8vw, 28px);
  line-height: 1.25;
  letter-spacing: .02em;
  color: var(--navy);
  margin-bottom: 8px;
}
.lead{
  font-size: clamp(14px, 1.6vw, 16px);
  line-height: 1.9;
  opacity: .9;
}

/* アンカー到達時の少しだけの視覚フィードバック（任意） */
:target{
  scroll-margin-top: var(--t2-header-h, 72px);
}

/* === Services heading on plaque ================= */
.t2-services-title{
  color:#fff;                /* 濃紺プレート上なので白文字に */
  text-align:center;
  margin-bottom: 6px;
}
.t2-section-desc{
  color: rgba(255,255,255,.85);
  text-align:center;
  font-size: clamp(13px, 1.5vw, 15px);
  line-height: 1.7;
  margin-bottom: 12px;
}

/* スクリーンリーダー用の不可視テキスト */
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,1px,1px); white-space:nowrap; border:0;
}

/* 「詳しく見る →」 */
.t2-more{
  align-self:flex-start;
  display:inline-flex; align-items:center; gap:.4em;
  color: var(--navy); font-weight:600; text-decoration:none;
  padding:4px 2px; border-bottom:1px solid transparent;
  margin-top:auto;                /* カード下寄せ（.t2-service は縦Flex） */
}
.t2-more::after{
  content:"\2192";               /* → */
  transition: transform .2s ease;
}
.t2-more:hover{
  color: var(--gold);
  border-bottom-color: currentColor;
}
.t2-service:hover .t2-more::after{ transform: translateX(2px); }

/* キーボード操作時の見やすいフォーカス */
.t2-more:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--gold) 30%, white);
  border-radius: 8px;
}

/* === Page commons (details pages) ================== */
.t2-page-hero{
  position: relative;
  min-height: 32vh;
  display: grid;
  place-items: end start;
  color:#fff;
  background:
    linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.68)),
    var(--t2-hero-img, none) center 40%/cover no-repeat;
}
.t2-page-hero .inner{
  width:min(92vw,1100px);
  margin-inline:auto;
  padding: clamp(20px, 6vw, 64px) 16px;
}
.t2-page-title{
  font-size: clamp(22px, 3vw, 32px);
  line-height:1.2;
  letter-spacing:.02em;
}

/* パンくず（前回未追加なら） */
.t2-breadcrumb{
  width:min(92vw,1100px);
  margin: clamp(12px, 2vw, 20px) auto 0;
  padding-inline:16px;
  font-size:13px; color:#64748b;
}
.t2-breadcrumb ol{ margin:0; padding:0; list-style:none; display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.t2-breadcrumb li{ display:flex; align-items:center; gap:8px; white-space:nowrap; }
.t2-breadcrumb li:not(:last-child)::after{ content:"›"; opacity:.6; }
.t2-breadcrumb a{ color:#64748b; text-decoration:none; }
.t2-breadcrumb a:hover{ color: var(--gold); text-decoration: underline; }
.t2-breadcrumb [aria-current="page"]{ color:#0b1a2a; font-weight:600; }

/* 本文の読みやすさ */
.t2-article{
  width:min(92vw, 840px);
  margin: clamp(20px,4vw,40px) auto;
  padding-inline:16px;
  color: var(--ink);
}
.t2-article p{ line-height:1.9; margin: .6em 0; }
.t2-article ul{ margin:.6em 0 .6em 1.1em; padding:0; }
.t2-article li{ margin:.3em 0; }
.t2-article h2, .t2-article h3{
  color: var(--navy);
  margin-top: 1.2em;
  margin-bottom:.3em;
  letter-spacing:.02em;
}
.t2-article .note{
  background: #f8fafc; border:1px solid #e2e8f0;
  border-radius:10px; padding:12px 14px; font-size:.95em;
}

/* 下層内の問い合わせCTA（プレート流用） */
.t2-cta{
  margin-top: clamp(20px,4vw,36px);
  padding: clamp(16px,3.5vw,28px);
  border-radius:14px;
  background:#0f1e2f; color:#fff;
}
.t2-cta .btn-gold{ margin-top:8px; }

/* === Clickable card（stretched-link 法） ===================== */
/* 1) カードを基準にする */
.t2-service{
  position: relative;
  cursor: pointer;                         /* ホバーでポインタに */
  transition: transform .15s ease, box-shadow .15s ease;
}
.t2-service:hover{
  transform: translateY(-1px);
  box-shadow: 0 6px 24px rgba(0,0,0,.12); /* ほんのり浮かせる */
}

/* 2) 既存の「詳しく見る」を“見えない巨大リンク”に拡張 */
.t2-service .t2-more{
  position: static; /* 重要：疑似要素の基準を .t2-service にする */
  z-index: 1;       /* フォーカスリングの描画を安定させる */
}
.t2-service .t2-more::after{
  content:"";
  position: absolute;
  inset: 0;         /* カード全体に広げる */
  /* ここで pointer-events は触らない（デフォルトのまま=クリック取る） */
}

/* 3) キーボード操作の見やすさ：フォーカスでカード縁を光らせる（対応ブラウザ） */
.t2-service:has(.t2-more:focus-visible){
  outline: 3px solid color-mix(in oklab, var(--gold) 30%, white);
  outline-offset: 2px;
}

/* ヒーローの下側パディングを少し控えめに（詳細ページだけ） */
.t2-page-hero .inner{
  padding-bottom: clamp(16px, 4vw, 40px);
}

/* パンくずの上マージンも少し短く */
.t2-breadcrumb{
  margin-top: clamp(8px, 1.6vw, 14px);
}

/* ヒーロー下の詰め＆パンくずの上余白を控えめに */
.t2-page-hero .inner{ padding-bottom: clamp(16px, 3.5vw, 36px); }
.t2-breadcrumb{ margin-top: clamp(8px, 1.5vw, 12px); }

/* 狭い幅で長い現在地名が折返しすぎるのを防ぐ（必要に応じて） */
.t2-breadcrumb li[aria-current="page"]{
  max-width: 70%;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* === Services: 軽いホバー演出（画像微ズーム＋影） ================== */

/* 端末がホバー可能な場合のみズーム（タッチ端末は影だけ） */
@media (hover:hover) and (pointer:fine){
  .t2-service{
    transition: transform .18s ease, box-shadow .18s ease;
  }
  .t2-service .t2-media{ overflow: hidden; } /* はみ出し防止 */
  .t2-service .t2-media img{
    transition: transform .35s ease;
    will-change: transform;
  }
  .t2-service:hover{
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(0,0,0,.16);
  }
  .t2-service:hover .t2-media img{
    transform: scale(1.035);
  }
}

/* タッチ端末：影だけ（誤タップ・酔い対策） */
@media (hover:none){
  .t2-service{
    transition: box-shadow .18s ease;
  }
  .t2-service:active{
    box-shadow: 0 6px 22px rgba(0,0,0,.14);
  }
}

/* キーボード操作でも同じ演出（アクセシビリティ） */
.t2-service:focus-within{
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(0,0,0,.16);
}
.t2-service:focus-within .t2-more{ outline: none; } /* 余計な二重枠防止 */

/* 動きが苦手なユーザー向け：遷移を無効化 */
@media (prefers-reduced-motion: reduce){
  .t2-service, .t2-service .t2-media img{ transition: none !important; }
}

/* === Header: 帯の高さは維持して、ボタン位置だけ揃える === */

/* 帯の“最低高さ”を保証（以前と同等の厚み・数値はお好みで） */
.t2-header .inner{
  min-height: var(--t2-header-h, 72px); /* 72pxが高ければ64pxなどに */
}

/* リンク/ボタンの縦センター＆btnの余白だけ無効化（サイズは変えない） */
.t2-nav{ display:flex; align-items:center; gap: clamp(12px, 2.4vw, 24px); }
.t2-nav a{
  display:inline-flex;
  align-items:center;
  line-height:1;
}
.t2-nav .btn-gold{
  margin-top:0;               /* 下がり見えの原因を解消（サイズはそのまま） */
  display:inline-flex;
  align-items:center;
  line-height:1;
  /* まだ気持ち低く見えたら 1px 光学調整をON */
  /* transform: translateY(-1px); */
}

/* スマホは押しやすさを維持（帯の厚みはそのまま） */
@media (max-width: 767px){
  .t2-nav a{ padding-block:.4em; }
  .t2-header .inner{ min-height: 64px; } /* SPだけ少し低めにしてもOK */
}
/* Desktopだけ帯を元の厚みに近づける */
@media (min-width:1025px){
  .t2-header .inner{
    padding-block: 18px;  /* 既定 12px → 18px（上下+6pxで計+12px） */
  }
}
/* ボタンは引き続き margin-top:0 でOK */
.t2-nav .btn-gold{ margin-top:0; }
/* Desktopだけ帯を元の厚みに近づける */
@media (min-width:1025px){
  .t2-header .inner{
    padding-block: 21px;  /* 既定 12px → 18px（上下+6pxで計+12px） */
  }
}
/* ボタンは引き続き margin-top:0 でOK */
.t2-nav .btn-gold{ margin-top:0; }

/* 読みやすい行幅に制限（どの幅でも効く） */
.t2-about-body{ max-width: 60ch; }

/* Footer: TEL / MAIL を縦並び（いつでも崩れない） */
.t2-contact{
  display: grid;
  gap: 4px;
}
.t2-mail{ overflow-wrap: anywhere; } /* 長いメールでもはみ出さない */
.t2-address a{ color: var(--gold); text-decoration: none; }
.t2-address a:hover{ text-decoration: underline; }

/* もしPCでは横並びに戻したい場合（任意・好みで） */

@media (min-width: 960px){
  .t2-contact{
    display: flex;
    gap: 16px;
    align-items: baseline;
  }
  .t2-contact .t2-mail::before{
    content: "／";
    margin-inline: 6px;
    opacity: .7;
  }
}


.t2-about-body{ 
    max-width:60ch; 
    margin-inline:auto; 
    }


/* responsive helpers */
br.sp-only{ display: none; }

/* === FAQ ============================ */
.t2-faq{
  padding-block: clamp(36px, 6vw, 72px);
  background: #f8fafc; /* わずかに面分け */
}
.t2-faq .inner{
  width:min(92vw,960px);
  margin-inline:auto;
  padding-inline:16px;
}
.t2-faq-list{ display:grid; gap:12px; }

.t2-faq-item{
  background:#fff;
  border:1px solid rgba(200,169,106,.25);
  border-radius:12px;
  overflow:hidden;
  transition: box-shadow .18s ease, border-color .18s ease;
}
.t2-faq-item[open]{ box-shadow:0 6px 24px rgba(0,0,0,.08); }

.t2-faq-item summary{
  list-style:none; cursor:pointer;
  padding:14px 16px;
  color:var(--navy); font-weight:600;
  display:flex; align-items:center; gap:10px;
}
.t2-faq-item summary::-webkit-details-marker{ display:none; }

/* Qバッジ */
.t2-faq-item summary::before{
  content:"Q";
  display:inline-grid; place-items:center;
  width:1.6em; height:1.6em;
  font-weight:700;
  background: var(--gold); color: var(--navy);
  border-radius:8px;
}

/* プラス/マイナスのトグル */
.t2-faq-item summary::after{
  content:"+";
  margin-left:auto;
  font-size:1.1em;
  line-height:1;
  transform: translateY(-1px);
  transition: transform .18s ease;
  opacity:.9;
}
.t2-faq-item[open] summary::after{
  content:"–";
  transform:none;
}

.t2-faq-a{
  border-top:1px solid #e2e8f0;
  padding:12px 16px 16px;
  color:var(--ink);
}
.t2-faq-a p{ margin:.5em 0; line-height:1.9; }

.t2-faq-contact{
  text-align:center;
  margin-top: clamp(16px, 4vw, 24px);
}

/* キーボード操作の見やすさ */
.t2-faq-item summary:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--gold) 30%, white) inset;
}

/* FAQ の問い合わせ：縦並び＆ボタンは天然サイズのまま中央 */
/* 縦並び＆中央寄せ。テキスト→装飾→ボタンの順に並べる */
.t2-faq-contact{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;                           /* 文字↔装飾↔ボタンの間隔 */
  text-align: center;
  margin-top: clamp(16px, 4vw, 24px);
}


.t2-faq-contact::after{
  content: "▾▾▾";                        
  order: 1;
  font-size: 18px;
  line-height: 1;
  opacity: .55;
  color: color-mix(in oklab, var(--navy) 35%, white);
}


.t2-faq-contact .btn-gold{
  order: 2;
  margin: 0;
}

/* === Access ===================== */
.t2-access{
  padding-block: clamp(48px, 6vw, 96px);
}
.t2-access .inner{
  width:min(92vw,1100px);
  margin-inline:auto;
  padding-inline:16px;
}
.t2-access-grid{
  display:grid;
  gap:24px;
  align-items:start;
}

/* 地図の見た目 */
.t2-map{
  aspect-ratio: 4 / 3;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 6px 24px rgba(0,0,0,.12);
  background:#e2e8f0;
}
.t2-map iframe,
.t2-map img{
  width:100%; height:100%;
  display:block; border:0;
}

/* 右カラム（本文） */
.t2-access-body{ display:grid; gap:14px; }

/* アクセスの項目 */
.t2-access-facts{ display:grid; gap:10px; }
.t2-access-facts dt{
  font-weight:600; letter-spacing:.02em; color:var(--navy);
}
.t2-access-facts dd{ margin:0; color:var(--ink); }


/* ボタン行 */
.t2-access-links{ margin-top:4px; }


/* Services も同じ器に */
.t2-services{
  width: min(92vw, var(--t2-container));
  margin: clamp(32px, 6vw, 64px) auto;
  padding-inline: 16px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}


/* プレート内側の程よい余白（端までベタっと見えないように） */
.t2-services.t2-plaque-soft{
  padding-inline: clamp(20px, 4vw, 32px);
}


/* theme-trust.css（ベース：非表示） */
.pc-only{ display: none; }

/* A) カードの左右に 1ch だけ余白（視覚的な“逃げ”を作る） */
.t2-service{ padding-inline: 0.5ch; }

/* B) 背景プレートの角をほんの少しだけ丸く（縁取りの存在感を出して“際”を弱める） */
.t2-plaque-soft{ border-radius: 16px; }

/* 紺プレートは疑似要素で一段内側に */
.t2-services.t2-plaque-soft{
  position: relative;
  background: none;                 /* ← 元の背景は消す */
  padding-block: clamp(20px, 4vw, 32px);
}
.t2-services.t2-plaque-soft::before{
  content:"";
  position: absolute;
  inset: 0;
  margin-inline: 16px;              /* ← ガターぶんだけ内側に */
  border-radius: 16px;
  background: #0f1e2f;
  z-index: 0;
}
/* 中身を前面に */
.t2-services > *{ position: relative; z-index: 1; }

/* === Contact ======================== */
.t2-contact-sec{
  padding-block: clamp(48px, 6vw, 96px);
}

/* フォームのグリッド */
.t2-form{
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
.t2-field{ display: grid; gap: 6px; }
.t2-field-full{ grid-column: 1 / -1; }

.t2-field label{
  font-weight: 600;
  color: var(--navy);
  letter-spacing: .02em;
}
.t2-field input,
.t2-field select,
.t2-field textarea{
  width: 100%;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 10px 12px;
  font: inherit;
  color: var(--ink);
  background: #fff;
}
.t2-field input:focus-visible,
.t2-field select:focus-visible,
.t2-field textarea:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--gold) 30%, white);
}

.req{
  display:inline-block;
  font-size: .8em;
  font-weight:700;
  margin-left: .4em;
  padding: .12em .5em;
  border-radius: 6px;
  background: var(--gold);
  color: var(--navy);
}

.t2-checkbox{ display:flex; align-items:center; gap:8px; }
.t2-form-actions{ margin-top: 4px; }

/* honeypot（画面外へ） */
.t2-hp{
  position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden;
}

/* === News ======================== */
.t2-news{
  padding-block: clamp(40px, 6vw, 80px);
  background: #f8fafc;              /* ほんのり面分け（任意） */
}

.t2-news-list{
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 10px;
}

.t2-news-item{
  background:#fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}

.t2-news-link{
  display: grid;
  gap: 6px;
  padding: 14px 16px;
  color: inherit;
  text-decoration: none;
}

.t2-news-meta{
  display:flex; align-items:center; gap:10px;
  font-size: 13px;
  color:#64748b;
}
.t2-tag{
  display:inline-block;
  padding: .14em .6em;
  border-radius: 999px;
  background: color-mix(in oklab, var(--gold) 22%, white);
  color: var(--navy);
  font-weight: 600;
}

.t2-news-title{
  font-size: clamp(16px, 2.2vw, 18px);
  color: var(--navy);
  line-height: 1.35;
  letter-spacing: .02em;
}

.t2-news-excerpt{
  color: var(--ink);
  font-size: 14px;
  line-height: 1.8;
}

/* ホバー演出（PC中心） */
@media (hover:hover) and (pointer:fine){
  .t2-news-item:hover{
    border-color: rgba(200,169,106,.35);
    box-shadow: 0 10px 28px rgba(0,0,0,.10);
    transform: translateY(-1px);
  }
}

/* === Works / Case Studies ================== */
.t2-works{
  padding-block: clamp(40px, 6vw, 80px);
}

.t2-works-list{
  display: grid;
  grid-template-columns: 1fr;   /* SP: 1列 */
  gap: 14px;
  margin-top: 10px;
}

.t2-work-item{
  border:1px solid rgba(200,169,106,.25);
  border-radius:12px;
  overflow:hidden;
  background:#fff;
  transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}

.t2-work-link{
  display:grid;
  gap:10px;
  color:inherit; text-decoration:none;
  padding: 12px 12px 14px;
}

.t2-work-media{
  aspect-ratio: 4 / 3;
  border-radius:10px;
  overflow:hidden;
}
.t2-work-media img{ width:100%; height:100%; object-fit:cover; display:block; }

.t2-work-body{ display:grid; gap:8px; }

.t2-work-meta{
  display:flex; align-items:center; gap:10px;
  font-size:13px; color:#64748b;
}
.t2-work-tag{
  display:inline-block;
  padding:.14em .6em;
  border-radius:999px;
  background: color-mix(in oklab, var(--gold) 22%, white);
  color: var(--navy);
  font-weight:600;
}

.t2-work-title{
  color: var(--navy);
  font-size: clamp(16px, 2.2vw, 18px);
  line-height: 1.35;
  letter-spacing: .02em;
}
.t2-work-excerpt{
  color: var(--ink);
  font-size:14px;
  line-height:1.8;
}

/* ホバー演出（PC中心） */
@media (hover:hover) and (pointer:fine){
  .t2-work-item:hover{
    border-color: rgba(200,169,106,.35);
    box-shadow: 0 10px 28px rgba(0,0,0,.10);
    transform: translateY(-1px);
  }
}


/* === Flow ========================= */
.t2-flow{
  padding-block: clamp(40px, 6vw, 80px);
  background: #fff;
}
.t2-flow-list{
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;  /* SP: 1列 */
  gap: 12px;
  counter-reset: step;
}
.t2-flow-step{
  position: relative;
  background: #fff;
  border: 1px solid rgba(200,169,106,.25);
  border-radius: 12px;
  padding: 16px 14px 14px 14px;
  display: grid; gap: 8px;
  transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
.t2-flow-step::before{
  counter-increment: step;
  content: counter(step);
  position: absolute; inset: -10px auto auto -10px;
  width: 36px; height: 36px; border-radius: 999px;
  display: grid; place-items: center;
  font-weight: 700;
  background: var(--gold); color: var(--navy);
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
}
.t2-flow-step h3{
  color: var(--navy);
  font-size: clamp(16px, 2.2vw, 18px);
  line-height: 1.35; letter-spacing: .02em;
}
.t2-flow-step p{
  color: var(--ink);
  font-size: 14px; line-height: 1.8;
}
@media (hover:hover) and (pointer:fine){
  .t2-flow-step:hover{
    border-color: rgba(200,169,106,.35);
    box-shadow: 0 10px 28px rgba(0,0,0,.10);
    transform: translateY(-1px);
  }
}

/* Flow CTA */

.t2-link{
  color: var(--navy); text-decoration: none;
  border-bottom: 1px solid currentColor; padding-bottom: 2px;
}
.t2-link:hover{ color: var(--gold); }

/* Flow：カード左上の丸バッジを廃止して */
.t2-flow-step::before{ content: none !important; }

/* 見出しの先頭にバッジを出す（連番はそのまま） */
.t2-flow-list{ counter-reset: step; } /* 既存でもOK。念のため残す */

.t2-flow-step h3{
  display: flex;
  align-items: center;
  gap: 8px;                 /* 数字丸とタイトルの間 */
}
.t2-flow-step h3::before{
  counter-increment: step;
  content: counter(step);
  display: inline-grid; place-items: center;
  width: 28px; height: 28px;              /* 大きさ：必要なら 26–32pxで調整可 */
  border-radius: 999px;
  background: var(--gold);
  color: var(--navy);
  font-weight: 700;
  line-height: 1;
}

/* 「まずはお問い合わせ」を“テキスト”として落ち着いた見た目に */
.t2-flow-note{
  color: var(--ink);
  font-size: 16px;
  line-height: 1.6;
  opacity: .9;
  margin: 0;                 /* pのデフォ余白を消す */
}

/* Flow CTA：縦並び＋中央。上＝テキスト、中＝装飾、下＝ボタン */
.t2-flow-cta{
  margin-top: clamp(14px, 3.2vw, 24px);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;                  /* テキスト ↔ 装飾 ↔ ボタンの間隔 */
  text-align: center;
}

/* 上のテキスト（クリック不可） */
.t2-flow-cta .t2-flow-note{
  margin: 0;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.6;
  opacity: .9;
  order: 0;
}

/* テキストとボタンの間の“▾▾▾”装飾 */
.t2-flow-cta::after{
  content: "▾▾▾";
  order: 1;                   /* テキストの次に出す */
  display: block;
  font-size: 18px;
  line-height: 1;
  opacity: .55;
  color: color-mix(in oklab, var(--navy) 35%, white);
}

/* 下のボタン（FAQへ） */
.t2-flow-cta .btn-gold{
  order: 2;
  margin: 0;
}

/* === PageTop（右下の丸ボタン） ===================== */
.t2-pagetop{
  position: fixed;
  right: clamp(12px, 2vw, 20px);
  bottom: calc(clamp(12px, 2.5vw, 20px) + env(safe-area-inset-bottom, 0px));
  z-index: 60;
  width: 44px; height: 44px;
  display: grid; place-items: center;
  border-radius: 999px;
  background: var(--gold);
  color: var(--navy);
  text-decoration: none;
  box-shadow: 0 6px 24px rgba(0,0,0,.16);
  border: 1px solid rgba(0,0,0,.06);
  transform: translateY(12px);
  opacity: 0;                    /* 初期は非表示 */
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease, box-shadow .2s ease;
}
.t2-pagetop.is-show{
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.t2-pagetop:hover{ box-shadow: 0 8px 28px rgba(0,0,0,.2); }
.t2-pagetop:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--gold) 30%, white), 0 8px 28px rgba(0,0,0,.2);
}

/* 文字サイズが大きい端末でも潰れないように */
.t2-pagetop span{ font-size: 18px; line-height: 1; }

/* タブレット以上はちょい大きめでもOK */
@media (min-width: 768px){
  .t2-pagetop{ width: 48px; height: 48px; }
  .t2-pagetop span{ font-size: 20px; }
}

.t2-form{ max-width: 900px; margin-inline: auto; }



/* === Skip link（キーボード操作向け） === */
.t2-skip{
  position:absolute; left:8px; top:-40px;
  background:#0b1a2a; color:#fff; text-decoration:none;
  padding:8px 12px; border-radius:8px; z-index:1000;
  transition: transform .2s ease;
}
.t2-skip:focus{ outline:none; transform: translateY(48px); }

/* === フォーム: バリデーション見た目（初回送信後にだけ効く） === */
.t2-form.was-validated input:invalid,
.t2-form.was-validated select:invalid,
.t2-form.was-validated textarea:invalid{
  border-color:#ef4444;
  box-shadow: 0 0 0 3px color-mix(in oklab, #ef4444 24%, white);
}

/* エラーテキスト（必要なら使う） */
.t2-field .t2-error{
  color:#b91c1c; font-size:12px; line-height:1.4;
}

/* 送信完了メッセージ */
.t2-form-done{
  background:#f0fdf4; color:#14532d;
  border:1px solid #bbf7d0;
  border-radius:10px; padding:10px 12px; margin-bottom:10px;
  opacity:0; transform: translateY(-4px);
  transition: opacity .25s ease, transform .25s ease;
}
.t2-form-done.is-show{ opacity:1; transform:none; }

/* 同意未チェック時の送信ボタン（見た目＆操作無効） */
.t2-form .btn-gold[aria-disabled="true"]{
  opacity:.6; pointer-events:none;
}

.t2-hint{ color:#64748b; font-size:12px; line-height:1.4; }


/* 段落の字下げを無効化（必要な箇所にだけ適用） */
.t2-lead { text-indent: 0; }

/* 同意のエラーが黒くなるのを防ぐ：どこにあっても赤字にする */
.t2-error { color:#b91c1c; font-size:12px; line-height:1.4; }

/* === CTA（共通のベース）========================== */
/* セクションの器（上下マージンのみ） */
.t2-cta-split{
  display: block;
  margin: clamp(16px, 4vw, 28px) 0;
}

/* 中身（直下型 / .inner 挟む型の両対応） */
.t2-cta-split > .t2-cta,
.t2-cta-split > .inner > .t2-cta{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto; /* デフォルトは左右に離れるレイアウト */
  align-items: center;
  gap: clamp(10px, 2vw, 14px);
}

.t2-cta-text{ margin: 0; max-width: 42ch; }
.t2-cta .btn-gold{ margin: 0; white-space: nowrap; }

/* 記事幅版：背景箱（最大840px、border-box） */
.t2-cta--article{
  max-width: 840px;
  width: 100%;
  box-sizing: border-box;
  margin-inline: auto;
  padding: clamp(16px, 3.5vw, 28px) 16px;
  border-radius: 14px;
  background: #0f1e2f; color: #fff;
}
/* はみ出し保険 */
.t2-cta--article > *{ min-width: 0; }

/* コンテナ幅の統一（.inner含める） */
:root{ --t2-container: 1100px; }
.t2-header .inner,
.t2-breadcrumb,
.t2-page-hero .inner,
.t2-about .inner,
.t2-access .inner,
.t2-news .inner,
.t2-works .inner,
.t2-flow .inner,
.t2-faq .inner,
.t2-contact-sec .inner,
.t2-cta-split .inner{
  width: min(92vw, var(--t2-container));
  margin-inline: auto;
  padding-inline: 16px;
}

/* CTAを .t2-article で包むとき（余白の二重取り防止） */
.t2-article{ box-sizing: border-box; }
.t2-article--cta{ padding-inline: 0; }
.t2-article--cta .t2-cta--article{
  width: 100%;
  max-width: none;        /* 840px制限は親に任せる */
  box-sizing: border-box;
  padding-inline: 16px;
}

/* privacy の長文/URL 折返し（どの画面でも安全） */
.p-privacy .t2-article,
.p-privacy .t2-cta--article{
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Footer：© を全サイズで中央寄せ */
.t2-copy{
  display: block;        /* インラインのsmallでも独立行にする */
  text-align: center;    /* 文字を中央に */
}

/* === works（実績ページ）— 区切り＆見やすさ ==================== */
.p-works .t2-case{
  padding-block: clamp(20px, 4vw, 32px);
  border-top: 1px solid #e2e8f0;
}
.p-works .t2-case:first-of-type{ border-top: 0; }

/* 画像を少し映えるように */
.p-works .t2-case .t2-work-media{
  margin-bottom: 10px;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 6px 24px rgba(0,0,0,.08);
}

/* タイトル・リードの間隔を少しだけ整える */
.p-works .t2-case .t2-work-title{ margin: 6px 0 4px; }
.p-works .t2-case .t2-work-excerpt{ margin: 0 0 8px; }

/* === works：CTAの並び・距離感を全サイズで最適化 ============== */
/* SP（〜767px）：縦並び・中央寄せ・テキストは読みやすい幅 */
@media (max-width: 767px){
  .p-works .t2-cta--article{
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 12px;
    justify-items: center;
    text-align: center;
    padding-block: 16px;
  }
  .p-works .t2-cta-text{
    max-width: 40ch;      /* 読みやすい行幅 */
    margin: 0 auto;
    line-height: 1.7;
  }
  .p-works .t2-cta--article .btn-gold{
    width: auto;          /* 横いっぱいにしない */
    padding: 10px 20px;
  }
}

/* タブレット（768–1023px）：テキスト左／ボタン右、近め配置 */
@media (min-width: 768px) and (max-width: 1023px){
  .p-works .t2-cta--article{
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto; /* 左は複数行OK／右はボタン実寸 */
    align-items: center;
    justify-content: center;
    column-gap: 16px;                            /* 近づける */
  }
  .p-works .t2-cta-text{ line-height: 1.6; }
}

/* PC（>=1025px）：上質な“横並び1行”＆中央寄せ */
@media (min-width: 1025px){
  .p-works .t2-cta--article{
    display: grid;
    grid-template-columns: max-content auto;  /* テキストは実寸、右にボタン */
    align-items: baseline;
    justify-content: center;                  /* セット全体を中央へ */
    column-gap: 30px;                         /* 余裕のある距離感 */
  }
  .p-works .t2-cta-text{
    white-space: nowrap;                      /* 1行で凛と見せる */
    margin: 0;
  }
}

/* CTAの先頭テキスト(p)の体裁をそろえる */
site-cta .t2-cta .t2-cta__title{
  font-weight:500;
  font-size:clamp(1.05rem,1.8vw,1.25rem);
  line-height:1.45;
  margin:0 0 .25em;
  letter-spacing:normal;
}

/* 孤立1文字対策：本文幅を少し広げる（!importantで旧CSSを上書き） */
site-cta .t2-cta .t2-cta__body{ max-width:48ch !important; }

/* === CTA 最小リセット＆体裁（旧CSSが残っていても効く） === */
site-cta .t2-cta{
  background:#0b1e3a; color:#fff; border-radius:16px;
  letter-spacing:normal !important; text-transform:none !important;
}
site-cta .t2-cta .inner{
  width:min(96vw, var(--t2-container,1100px));
  margin-inline:auto; padding:clamp(16px,3vw,28px);
  display:grid; gap:16px; align-items:center;
  grid-template-columns:1fr; /* SPは1列 */
}

/* 文字まわり：両方16pxに固定して“差”を消す */
site-cta .t2-cta__title,
site-cta .t2-cta__lead{
  margin:0; line-height:1.6;
  font-size:16px !important;  /* ← ここで完全に揃える */
  white-space:normal !important; overflow-wrap:anywhere; word-break:normal;
  letter-spacing:normal !important;
}
site-cta .t2-cta__title{ font-weight:500 !important; margin:0 0 .25em; }
site-cta .t2-cta__lead { font-weight:400 !important; opacity:.94; }

/* 可読幅：<br>不要で自然に折り返し（孤立1文字を出しづらく） */
site-cta .t2-cta__body{ max-width:48ch !important; }
@supports (text-wrap: balance){
  site-cta .t2-cta__title{ text-wrap:balance; }
}

/* ボタン：装飾復活＆中央寄せ（SP） */
site-cta .t2-cta__action{
  display:flex; justify-content:center;
}
site-cta .t2-cta .btn{
  display:inline-block; padding:.8em 1.4em; border-radius:999px;
  background:#fff; color:#0b1e3a; font-weight:700; text-decoration:none;
}

/* 768px以上は2列＋ボタン右寄せ */
@media (min-width:768px){
  site-cta .t2-cta .inner{ grid-template-columns:1fr auto; }
  site-cta .t2-cta__action{ justify-content:flex-end; }
}

/* （任意）ゴールドボタンにしたい時：<site-cta data-variant="gold"> */
site-cta[data-variant="gold"] .t2-cta .btn{ background:#C9A74D; color:#fff; }

/* ========= team.html CTA（768px以上だけ整える）========= */
/* ベース（モバイル想定）は今のまま使う：ここでは上書きしない */

/* タブレット以上：privacy.htmlと同じ2カラムにする */
@media (min-width:768px){
  .cta-local{
    display:grid;
    grid-template-columns:max-content auto; /* 本文(左) + ボタン(右) */
    column-gap:30px;
    align-items:baseline;        /* 行のベースライン揃え */
    justify-content:center;      /* 全体を中央寄せ */
    justify-items:stretch;       /* 各カラムは左寄せ */
    max-width:840px;             /* privacyと同じ幅上限 */
    margin-inline:auto;          /* 中央に配置 */
    padding-block:clamp(16px,3.5vw,28px);
    padding-inline:16px;
    border-radius:14px;
    background:#0f1e2f;
    color:#fff;
    box-sizing:border-box;
  }
  .cta-local__body{
    /* 1行目の“1文字だけ改行”を起こしにくくするため、文の横幅を調整 */
    max-width:44ch;
  }
  .cta-local__title,
  .cta-local__lead{
    font-size:16px; line-height:1.6;
    letter-spacing:normal; white-space:normal;
    overflow-wrap:anywhere; word-break:break-word;
    margin:0;
  }
  .cta-local__title{ font-weight:500; margin:0 0 .2em; }
  .cta-local__lead { font-weight:400; opacity:.94; }

  /* ボタンは右カラムの左寄せ（privacyと同じ“本文の右隣に並ぶ”挙動） */
  .cta-local__action{
    display:flex;
    justify-content:flex-start;
    align-items:center;
    width:100%;
  }
  .cta-local__btn{
    display:inline-block; padding:.8em 1.4em; border-radius:999px;
    font-weight:700; text-decoration:none;
    background:#fff; color:#0f1e2f;  /* 白ボタン */
  }
  .cta-local__btn--gold{
    background:#C9A74D; color:#fff; /* 金ボタンにしたいとき */
  }
}

/* ちょうど1024px幅の時もprivacyの指定に合わせたい場合（任意で有効化） */
/*
@media (width:1024px){
  .cta-local{ column-gap:30px; align-items:baseline; }
}
*/

/* PC＆1024pxでは タイトル＋リードを “1行” にする */
/* モバイル（〜767px）は既存のまま何もしない */

@media (width:1024px), (min-width:1025px){
  /* 左カラムの本文ブロックを横並び＆改行禁止に */
  .cta-local__body{
    display: flex;
    align-items: baseline;   /* 文字のベースラインを揃える */
    gap: .5em;               /* タイトルとリードの間隔 */
    white-space: nowrap;     /* ← ここが肝：1行にする */
    max-width: none;         /* 以前付けた max-width を無効化して折返しを防ぐ */
  }
  /* 2つの<p>を横並び扱いに */
  .cta-local__title,
  .cta-local__lead{
    display: inline;
    margin: 0;               /* 念のため段落の余白をゼロに */
  }
}

/* ===== CTA-LOCAL: Mobile base (全幅共通の土台) ===== */
.cta-local{
  background:#0f1e2f; color:#fff; border-radius:14px;
  width:100%; max-width:840px; margin:clamp(20px,4vw,36px) auto 0;
  padding:clamp(16px,3.5vw,28px) 16px;
  display:grid; grid-template-columns:1fr; row-gap:16px;
  align-items:baseline; justify-items:center;
  gap:clamp(10px,2vw,14px);
  box-sizing:border-box;
}
.cta-local__title,.cta-local__lead{
  margin:0; font-size:16px; line-height:1.6;
  letter-spacing:normal; white-space:normal;
  overflow-wrap:anywhere; word-break:break-word;
}
.cta-local__title{ font-weight:500; margin:0 0 .2em; }
.cta-local__lead { font-weight:400; opacity:.94; }
.cta-local__action{ width:100%; display:flex; justify-content:center; }
.cta-local__btn{
  display:inline-block; padding:.8em 1.4em; border-radius:999px;
  background:#fff; color:#0f1e2f; font-weight:700; text-decoration:none;
}
.cta-local__btn--gold{ background:#C9A74D; color:#fff; }

/* ===== CTA-LOCAL: PC/1024 の1行化＆2カラム配置 ===== */
@media (min-width:768px){
  .cta-local{
    grid-template-columns:max-content auto;
    column-gap:30px; align-items:baseline;
    justify-content:center; justify-items:stretch;
  }
  .cta-local__action{ justify-content:flex-start; }
}

/* タイトル＋リードを横並び＆折返し禁止（1024とPC） */
@media (width:1024px), (min-width:1025px){
  .cta-local__body{
    display:flex; align-items:baseline; gap:.5em;
    white-space:nowrap;      /* ← 1行固定 */
    max-width:none;          /* ← 以前の max-width を無効化 */
  }
  .cta-local__title, .cta-local__lead{
    display:inline; margin:0;
  }
}

/* 1) 全サイズ：CTAの上の余白を少し増やす */
.cta-local{
  margin-top: clamp(28px, 5vw, 56px);
}

/* 2) 768–1023px：内側の高さを下げてコンパクトに（モバイルは触らない） */
@media (min-width:768px) and (max-width:1023px){
  .cta-local{
    padding-block: clamp(10px, 2.2vw, 18px); /* 縦の余白を軽く */
    row-gap: 12px;                            /* 要素間の縦間隔も少し詰める */
    column-gap: 24px;                         /* 左右カラム間を30→24pxに */
  }
  /* ボタンが大きく見える場合だけ、下を有効化
  .cta-local__btn{ padding: .68em 1.1em; }
  */
}
/* ===== 768–1023px：ボタンの縦位置が上に見える問題の修正 ===== */
@media (min-width:768px) and (max-width:1023px){
  /* グリッド行内の配置を baseline → center に */
  .cta-local{
    align-items: center;         /* ← ここが肝 */
  }

  /* 左（本文）も右（ボタン）も行中央に揃える */
  .cta-local__body{ align-self: center; }

  .cta-local__action{
    display: flex;               /* 既にflexならそのままでOK */
    justify-content: flex-start; /* 右カラム内は左寄せのまま */
    align-items: center;         /* ← ボタン行の縦センター */
  }

  /* ボタン内の文字を厳密に中央にする（baseline影響を断つ） */
  .cta-local__btn{
    display: inline-flex;        /* ← inline-block → inline-flex */
    align-items: center;         /* 縦センター */
    line-height: 1;              /* 余計な行高を排除 */
    /* paddingはすでに設定済み。見た目で高すぎ/低すぎなら微調整OK
    padding: .76em 1.3em;
    */
  }

  /* 内側余白と間隔（均等感が出るよう軽めに調整） */
  .cta-local{
    padding-block: clamp(12px, 2.2vw, 18px); /* 先の設定がある場合でも上書きになる */
    row-gap: 12px;
    column-gap: 24px;
  }
}
/* ===== CTA-LOCAL: タブレットの左右を詰めて、上下は少し広げる ===== */
@media (min-width:768px) and (max-width:1023px){
  .cta-local{
    padding-inline: 10px;                      /* ← 左右を細く */
    padding-block: clamp(18px, 2.6vw, 24px);   /* ← 上下は少し増やす */
    column-gap: 20px;                          /* ← 左右カラム間もやや詰め */
  }
}

/* ===== CTA-LOCAL: 1024/PC も左右をやや詰めて、上下は少し増やす ===== */
@media (width:1024px), (min-width:1025px){
  .cta-local{
    padding-inline: 12px;                      /* ← 左右を細く（デフォ16px→12px） */
    padding-block: clamp(18px, 2.2vw, 26px);   /* ← 上下に少しだけ余裕 */
  }
}

/* 表示切替ユーティリティ */
.u-show-768 { display: none; }
.u-hide-768 { display: inline; }

@media (min-width:768px) and (max-width:1023px){
  .u-show-768 { display: inline; }
  .u-hide-768 { display: none; }
}


/* === 電話ブロック（純HTML版CTA向け／最小追記） === */
.t2-cta.t2-cta--article .t2-cta-tel{
  display:flex;
  flex-direction:column;
  align-items:center;   /* モバイル＝中央 */
  gap:2px;
  text-align:center;
  margin-top:4px;       /* ボタンとの間を少しだけ */
}
.t2-cta.t2-cta--article .t2-cta-tel__link{
  color:inherit; text-decoration:none;
  font-weight:700; font-size:15px; line-height:1.5;
}
.t2-cta.t2-cta--article .t2-cta-tel__link:hover,
.t2-cta.t2-cta--article .t2-cta-tel__link:focus{
  text-decoration:underline;
}
.t2-cta.t2-cta--article .t2-cta-tel__hours{
  font-size:13px; opacity:.85;
}

/* 1024px以上：テキスト左／ボタン右のまま、電話も右側に寄せる */
@media (min-width:1024px){
  .t2-cta.t2-cta--article .t2-cta-tel{
    align-items:flex-end;  /* 右寄せ */
    text-align:right;
  }
}

/* （必要なら）PCはCTAテキストを必ず1行に固定するオプション */
@media (min-width:1024px){
  .t2-cta .t2-cta-text{ white-space:nowrap; }
}


