:root {
  /* ブランドカラー */
  --navy: #0f2440;
  --brown: #7a3b10;
  --amber: #c47a2a;
  --amber-light: #f5e6cc;
  --green: #2d6a4f;
  --red: #b84600;
  --gray-100: #f7f4f0;
  --gray-200: #ece7df;
  --gray-600: #6b5e4e;
  --white: #fff;
  --text: #1a1208;
  /* font-spec v2準拠 */
  --font-heading: "Plus Jakarta Sans", "Noto Sans JP", sans-serif;
  --font-body:    "Noto Sans JP", sans-serif;
  --fs-base: 18px;
  --fs-sm:   15px;
  --fs-lg:   20px;
  --lh-base:    1.85;
  --lh-heading: 1.3;
  --color-text:   #333333;
  --color-sub:    #666666;
  --color-border: #dddddd;
  --color-bg:     #fafafa;
  --color-cta:    #b84600;
  --color-accent: #d32f2f;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);color:var(--color-text);background:var(--color-bg);line-height:var(--lh-base);font-size:var(--fs-base)}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}

/* PR表記 */
.pr-notice{background:#1a1208;color:#d4b896;font-size:0.72rem;text-align:center;padding:6px 16px;letter-spacing:.04em}

/* ヘッダー */
header{background:var(--navy);padding:14px 20px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100;box-shadow:0 2px 12px rgba(0,0,0,.3)}
.site-title{text-decoration:none;font-family:var(--font-heading);font-size:1rem;color:#d4b896;font-weight:700;line-height:1.3}
.site-title span{display:block;font-size:.7rem;color:#8a9ab5;font-weight:400;margin-top:2px}
header .cta-btn-sm{background:var(--red);color:#fff;font-size:.78rem;font-weight:700;padding:8px 14px;border-radius:6px;white-space:nowrap;flex-shrink:0}

/* ヒーロー */
.hero{background:linear-gradient(160deg,#0f2440 0%,#1a3a5c 50%,#0a1a2e 100%);padding:56px 20px 64px;text-align:center;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")}
.hero-badge{display:inline-block;background:var(--amber);color:var(--navy);font-size:.72rem;font-weight:700;padding:4px 14px;border-radius:20px;margin-bottom:16px;letter-spacing:.06em}
.hero h1{font-family:var(--font-heading);font-size:clamp(1.5rem,5vw,2.2rem);color:#fff;font-weight:700;line-height:1.5;margin-bottom:14px}
.hero h1 em{color:#f0c060;font-style:normal;display:block}
.hero-sub{color:#8fb4d8;font-size:.9rem;margin-bottom:32px;line-height:1.9}
.hero-stats{display:flex;justify-content:center;gap:24px;margin-bottom:36px;flex-wrap:wrap}
.hero-stat{text-align:center}
.hero-stat .num{font-family:var(--font-heading);font-size:1.8rem;font-weight:700;color:#f0c060;line-height:1}
.hero-stat .lbl{font-size:.7rem;color:#8fb4d8;margin-top:4px}
.hero-cta{display:inline-block;background:var(--red);color:#fff;font-size:1.05rem;font-weight:700;padding:18px 36px;border-radius:8px;box-shadow:0 4px 20px rgba(184,70,0,.5);transition:transform .2s,box-shadow .2s;position:relative}
.hero-cta::after{content:'';display:inline-block;width:10px;height:10px;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg);margin-left:10px;vertical-align:middle}
.hero-cta:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(184,70,0,.6)}
.hero-note{font-size:.72rem;color:#5a7090;margin-top:12px}

/* セクション共通 */
section{padding:56px 20px}
.container{max-width:800px;margin:0 auto}
.sec-head{text-align:center;margin-bottom:40px}
.sec-badge{display:inline-block;background:var(--amber-light);color:var(--brown);font-size:.72rem;font-weight:700;padding:3px 12px;border-radius:20px;margin-bottom:10px;letter-spacing:.05em}
.sec-head h2{font-family:var(--font-heading);font-size:clamp(1.3rem,4vw,1.8rem);color:var(--navy);font-weight:700;line-height:1.5}
.sec-head p{color:var(--gray-600);font-size:.9rem;margin-top:8px}

/* 緊急ブロック */
.alert-block{background:#fff8f5;border-left:4px solid var(--red);border-radius:0 8px 8px 0;padding:20px 20px;margin-bottom:28px}
.alert-block h3{color:var(--red);font-size:1rem;font-weight:700;margin-bottom:8px}
.alert-block p{font-size:.88rem;line-height:1.8;color:#4a3020}

/* 相場テーブル */
.price-table{width:100%;border-collapse:collapse;border-radius:10px;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,.08)}
.price-table thead{background:var(--navy);color:#fff}
.price-table th{padding:14px 12px;font-size:.82rem;font-weight:700;text-align:center}
.price-table td{padding:14px 12px;font-size:.88rem;text-align:center;border-bottom:1px solid var(--gray-200);background:#fff}
.price-table tr:nth-child(even) td{background:#fafafa}
.price-table .highlight td{background:#fffbf0;font-weight:700;color:var(--brown)}
.price-note{font-size:.75rem;color:var(--gray-600);margin-top:10px;line-height:1.7}

/* カード */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}
.card{background:#fff;border-radius:10px;padding:24px 20px;box-shadow:0 2px 12px rgba(0,0,0,.06);border-top:3px solid var(--amber)}
.card-icon{font-size:2rem;margin-bottom:12px}
.card h3{font-family:var(--font-heading);font-size:1rem;color:var(--navy);margin-bottom:8px;font-weight:700}
.card p{font-size:.82rem;color:var(--gray-600);line-height:1.8}

/* 町名エリア */
.area-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.area-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px rgba(0,0,0,.12)}
.area-more{display:inline-block;margin-top:10px;font-size:.78rem;font-weight:700;color:#b84600;border-bottom:1px solid #c47a2a;}
.area-card{display:block;text-decoration:none;color:inherit;cursor:pointer;transition:transform .2s,box-shadow .2s;background:#fff;border-radius:8px;padding:16px;box-shadow:0 1px 6px rgba(0,0,0,.06);border-left:3px solid var(--green)}
.area-card h3{font-size:.9rem;font-weight:700;color:var(--navy);margin-bottom:6px}
.area-card p{font-size:.78rem;color:var(--gray-600);line-height:1.7}
.area-risk{display:inline-block;font-size:.65rem;font-weight:700;padding:2px 8px;border-radius:10px;margin-bottom:6px}
.risk-highest{background:#fde8e8;color:#8b0000;border:1px solid #f5c6c6;font-weight:700}
risk-high{background:#fde8e0;color:var(--red)}
.risk-mid{background:#fff3e0;color:#e65100}

/* ステップ */
.steps{display:flex;flex-direction:column;gap:0}
.step{display:flex;gap:20px;align-items:flex-start;padding:24px 0;border-bottom:1px solid var(--gray-200)}
.step:last-child{border-bottom:none}
.step-num{flex-shrink:0;width:48px;height:48px;background:var(--navy);color:#f0c060;font-family:var(--font-heading);font-size:1.3rem;font-weight:700;display:flex;align-items:center;justify-content:center;border-radius:50%}
.step-body h3{font-size:1rem;font-weight:700;color:var(--navy);margin-bottom:6px}
.step-body p{font-size:.85rem;color:var(--gray-600);line-height:1.8}

/* FAQ */
.faq-list{display:flex;flex-direction:column;gap:12px}
.faq-item{background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 1px 6px rgba(0,0,0,.06)}
.faq-q{font-size:.9rem;font-weight:700;color:var(--navy);padding:18px 20px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq-q::after{content:'';display:block;width:8px;height:8px;border-right:2px solid var(--amber);border-bottom:2px solid var(--amber);transform:rotate(45deg);flex-shrink:0;transition:transform .3s}
.faq-item.open .faq-q::after{transform:rotate(-135deg)}
.faq-a{font-size:.85rem;color:var(--gray-600);padding:0 20px;max-height:0;overflow:hidden;transition:max-height .4s ease,padding .3s}
.faq-item.open .faq-a{max-height:300px;padding:0 20px 18px}

/* CTA セクション */
.cta-section{background:linear-gradient(135deg,var(--navy) 0%,#1a3a5c 100%);padding:64px 20px;text-align:center}
.cta-section h2{font-family:var(--font-heading);font-size:clamp(1.3rem,4vw,1.8rem);color:#fff;margin-bottom:12px;line-height:1.5}
.cta-section p{color:#8fb4d8;font-size:.9rem;margin-bottom:32px;line-height:1.9}
.cta-box{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.15);border-radius:12px;padding:32px 24px;max-width:520px;margin:0 auto 32px}
.cta-box-merit{display:flex;flex-direction:column;gap:10px;margin-bottom:28px;text-align:left}
.cta-merit-item{display:flex;align-items:center;gap:10px;color:#d4e8f5;font-size:.88rem}
.cta-merit-item::before{content:'✓';display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;background:var(--green);color:#fff;border-radius:50%;font-size:.7rem;flex-shrink:0;font-weight:700}
.cta-main-btn{display:block;background:var(--red);color:#fff;font-size:1.05rem;font-weight:700;padding:20px 24px;border-radius:8px;box-shadow:0 4px 20px rgba(184,70,0,.5);transition:transform .2s;text-align:center;max-width:400px;margin:0 auto}
.cta-main-btn::after{content:'';display:inline-block;width:10px;height:10px;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg);margin-left:10px;vertical-align:middle}
.cta-main-btn:hover{transform:translateY(-2px)}
.cta-sub{font-size:.72rem;color:#5a7090;margin-top:12px}

/* 追従CTA */
.sticky-cta{position:fixed;bottom:0;left:0;right:0;background:var(--red);padding:12px 16px;text-align:center;z-index:200;transform:translateY(100%);transition:transform .3s;box-shadow:0 -4px 16px rgba(0,0,0,.2)}
.sticky-cta.show{transform:translateY(0)}
.sticky-cta a{display:block;color:#fff;font-weight:700;font-size:.95rem;max-width:500px;margin:0 auto}
.sticky-cta a::after{content:'';display:inline-block;width:8px;height:8px;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg);margin-left:8px;vertical-align:middle}

/* 内部リンク */
.article-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.article-link{background:#fff;border-radius:8px;padding:14px 16px;box-shadow:0 1px 6px rgba(0,0,0,.06);border-bottom:2px solid var(--amber);font-size:.85rem;color:var(--navy);font-weight:700;transition:transform .2s,box-shadow .2s;display:block}
.article-link:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.1)}
.article-link span{display:block;font-size:.72rem;color:var(--gray-600);font-weight:400;margin-top:4px}

/* フッター */
footer{background:#0a1420;color:#8a9ab5;font-size:.75rem;padding:36px 20px;text-align:center;line-height:1.9}
footer .footer-links{display:flex;justify-content:center;gap:20px;margin-bottom:16px;flex-wrap:wrap}
footer a{color:#7a90a8}
.pr-footer{color:#8a7060;font-size:.7rem;margin-top:12px;line-height:1.8;max-width:600px;margin-left:auto;margin-right:auto}

/* 区切り背景 */
.bg-white{background:#fff}
.bg-gray{background:var(--gray-100)}
.bg-amber-light{background:var(--amber-light)}

/* レスポンシブ */
@media(max-width:640px){
  .hero-stats{gap:16px}
  .step{flex-direction:column;gap:12px}
  header .cta-btn-sm{font-size:.7rem;padding:7px 10px}
}

/* ---- hero checklist ---- */
.hero-checklist{display:flex;flex-direction:column;gap:12px;margin:20px 0 24px;text-align:left}
.hero-check{display:flex;align-items:flex-start;gap:12px;background:rgba(255,255,255,.07);border-radius:8px;padding:12px 16px}
.hck{flex-shrink:0;width:24px;height:24px;background:var(--amber);color:var(--navy);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:700;margin-top:2px}
.hero-check > div{color:#c8dff0}
.hero-check strong{color:#fff;font-size:.9rem}
.hero-check small{color:#8fb4d8;font-size:.75rem}
.hero-lead{color:#c8d8e8;font-size:.9rem;margin-bottom:24px;line-height:1.9}
.hero-note{color:#8fb4d8;font-size:.78rem;margin-top:12px;line-height:1.7}
/* ---- cost table ---- */
.cost-tbl{width:100%;border-collapse:collapse;margin:20px 0;border-radius:10px;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,.08)}
.cost-tbl thead{background:var(--navy);color:#fff}
.cost-tbl th{padding:12px 10px;font-size:.8rem;font-weight:700;text-align:center}
.cost-tbl td{padding:12px 10px;font-size:.85rem;border-bottom:1px solid var(--gray-200);background:#fff;vertical-align:top}
.cost-tbl tr:last-child td{border-bottom:none}
.cost-breakdown{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:20px}
@media(max-width:600px){.cost-breakdown{grid-template-columns:1fr}}
.cb-item{background:#f7f4f0;border-radius:8px;padding:16px}
.cb-warn{background:#fff8f5;border:1px solid #f5c6c6}
.cb-label{font-weight:700;font-size:.85rem;margin-bottom:8px;color:var(--navy)}
.cb-item ul{padding-left:1.2em}
.cb-item li{font-size:.82rem;margin-bottom:4px;color:#2a1a08}
/* ---- criteria list ---- */
.criteria-list{display:flex;flex-direction:column;gap:16px;margin-top:24px}
.cr-item{display:flex;align-items:flex-start;gap:16px;background:#fff;border-radius:10px;padding:20px;box-shadow:0 1px 6px rgba(0,0,0,.06)}
.cr-num{flex-shrink:0;font-family:var(--font-heading);font-size:1.4rem;font-weight:700;color:#7a3b10;width:36px;text-align:center;line-height:1.2}
.cr-item strong{font-size:.92rem;color:var(--navy);display:block;margin-bottom:4px}
.cr-item p{font-size:.82rem;color:var(--gray-600);margin:0;line-height:1.7}
/* ---- faq details ---- */
.faq-list{display:flex;flex-direction:column;gap:8px;margin-top:20px}
.faq-item{background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 1px 6px rgba(0,0,0,.06)}
.faq-item summary{padding:16px 20px;font-size:.92rem;font-weight:700;color:var(--navy);cursor:pointer;list-style:none;display:flex;align-items:center;gap:10px}
.faq-item summary::before{content:'Q';flex-shrink:0;width:24px;height:24px;background:var(--amber);color:var(--navy);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item[open] summary{border-bottom:1px solid var(--gray-200)}
.faq-ans{padding:14px 20px 16px 54px;font-size:.85rem;line-height:1.9;color:#2a1a08}
/* ---- operator box ---- */
.operator-box{display:flex;flex-direction:column;gap:24px;margin-top:20px}
.op-section h3{font-size:.95rem;font-weight:700;color:var(--navy);margin-bottom:8px}
.op-section p{font-size:.85rem;line-height:1.9;color:#2a1a08}
.op-section ul{padding-left:1.4em}
.op-section li{font-size:.82rem;color:#2a1a08;margin-bottom:6px;line-height:1.7}

:focus-visible {
  outline: 2px solid #1a73e8;
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

nav a, .footer a, .footer-link {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
.footer a {
  padding: 12px 8px;
}

/* ========================================
   記事系クラス定義（全ガイド・エリアページ共通）
   ======================================== */

/* 記事ヘッダー */
.article-header {
  background: var(--navy);
  color: #fff;
  padding: 40px 20px 36px;
  text-align: center;
}
.article-header h1 {
  font-family: var(--font-heading);
  font-size: clamp(1.3rem, 4vw, 1.8rem);
  font-weight: 700;
  line-height: var(--lh-heading);
  margin-bottom: 12px;
}
.meta {
  font-size: var(--fs-sm);
  color: #8fb4d8;
  margin-top: 8px;
}

/* カテゴリバッジ */
.badge {
  display: inline-block;
  background: var(--amber);
  color: var(--navy);
  font-size: 0.72rem;
  font-weight: 700;
  padding: 4px 14px;
  border-radius: 20px;
  margin-bottom: 12px;
}

/* リスクバッジ（エリアページ） */
.risk-badge {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 20px;
  margin-bottom: 12px;
}
.risk-badge.risk-high   { background: #fde8e0; color: var(--red); border: 1px solid #f5c6a0; }
.risk-badge.risk-highest{ background: #fde8e8; color: #8b0000; border: 1px solid #f5c6c6; }
.risk-badge.risk-mid    { background: #fff3e0; color: #e65100; border: 1px solid #ffe0b2; }

/* パンくずナビ (.bc) */
.bc {
  font-size: var(--fs-sm);
  color: var(--color-sub);
  padding: 10px 0 16px;
  line-height: 1.6;
}
.bc a { color: var(--color-sub); text-decoration: underline; }
.bc a:hover { color: var(--color-cta); }

/* エリアページ旧パンくず */
.breadcrumb {
  font-size: var(--fs-sm);
  color: var(--color-sub);
  padding: 10px 0 16px;
  line-height: 1.6;
}
.breadcrumb a { color: var(--color-sub); text-decoration: underline; }

/* 記事本文ラッパー (.ab) */
.ab {
  max-width: 760px;
  margin: 0 auto;
  padding: 32px 20px 48px;
}
.ab h2 {
  font-family: var(--font-heading);
  font-size: clamp(1.15rem, 3.5vw, 1.4rem);
  font-weight: 700;
  color: var(--navy);
  border-left: 4px solid var(--amber);
  padding-left: 14px;
  margin: 40px 0 14px;
  line-height: var(--lh-heading);
}
.ab h3 {
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 700;
  color: var(--navy);
  margin: 28px 0 10px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--color-border);
}
.ab p { margin-bottom: 1em; line-height: var(--lh-base); }
.ab ul, .ab ol { padding-left: 1.6em; margin-bottom: 1em; }
.ab li { margin-bottom: .4em; line-height: 1.8; font-size: 0.92rem; }

/* テーブル（スクロール対応） */
.table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 20px 0;
  border-radius: 10px;
  box-shadow: 0 2px 12px rgba(0,0,0,.08);
}
.tbl {
  width: 100%;
  border-collapse: collapse;
  min-width: 400px;
  background: #fff;
}
.tbl thead { background: var(--navy); color: #fff; }
.tbl th { padding: 12px 14px; font-size: 0.82rem; font-weight: 700; text-align: left; white-space: nowrap; }
.tbl td { padding: 12px 14px; font-size: 0.85rem; border-bottom: 1px solid var(--color-border); line-height: 1.8; vertical-align: top; }
.tbl tr:last-child td { border-bottom: none; }
.tbl tr:nth-child(even) td { background: #fafafa; }
.tbl tr.hl td { background: #fffbf0; font-weight: 700; color: var(--brown); }

/* 注釈 */
.note {
  font-size: 0.75rem;
  color: var(--color-sub);
  line-height: 1.8;
  margin-top: 8px;
}

/* 情報ボックス（青系） */
.ib {
  background: #f0f6ff;
  border-left: 4px solid #1565c0;
  border-radius: 0 8px 8px 0;
  padding: 18px 20px;
  margin: 24px 0;
  font-size: 0.88rem;
  line-height: 1.9;
  color: #1a2a4a;
}
.ib strong { color: #0d47a1; }

/* 情報ボックス（エリアページ旧クラス） */
.info-box {
  background: #f0f6ff;
  border-left: 4px solid #1565c0;
  border-radius: 0 8px 8px 0;
  padding: 18px 20px;
  margin: 24px 0;
  font-size: 0.88rem;
  line-height: 1.9;
  color: #1a2a4a;
}

/* 警告ボックス（赤・橙系） */
.wb {
  background: #fff8f5;
  border-left: 4px solid var(--red);
  border-radius: 0 8px 8px 0;
  padding: 18px 20px;
  margin: 24px 0;
  font-size: 0.88rem;
  line-height: 1.9;
  color: #3a1a08;
}
.wb strong { color: var(--red); display: block; margin-bottom: 6px; }

/* 警告ボックス（エリアページ旧クラス） */
.warn-box {
  background: #fff8f5;
  border-left: 4px solid var(--red);
  border-radius: 0 8px 8px 0;
  padding: 18px 20px;
  margin: 24px 0;
  font-size: 0.88rem;
  line-height: 1.9;
  color: #3a1a08;
}
.warn-box h4 { color: var(--red); font-size: 0.92rem; margin-bottom: 8px; }

/* 緑ボックス */
.gb {
  background: #f0fbf4;
  border-left: 4px solid var(--green);
  border-radius: 0 8px 8px 0;
  padding: 18px 20px;
  margin: 24px 0;
  font-size: 0.88rem;
  line-height: 1.9;
  color: #1a3a24;
}
.gb strong { color: var(--green); }

/* インラインCTA（記事内CTA） */
.cta-i {
  background: linear-gradient(135deg, #0f2440 0%, #1a3a5c 100%);
  border-radius: 10px;
  padding: 24px 20px;
  margin: 32px 0;
  text-align: center;
}
.cta-i p {
  color: #c8d8e8;
  font-size: 0.88rem;
  margin-bottom: 14px;
  line-height: 1.8;
}
.cta-i a {
  display: inline-block;
  background: var(--color-cta);
  color: #fff;
  font-weight: 700;
  font-size: 0.95rem;
  padding: 14px 28px;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(184,70,0,.45);
  transition: transform .2s, box-shadow .2s;
  position: relative;
}
.cta-i a::after {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg);
  margin-left: 10px;
  vertical-align: middle;
}
.cta-i a:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(184,70,0,.55); }
.cta-i small {
  display: block;
  color: #5a7090;
  font-size: 0.72rem;
  margin-top: 10px;
}

/* インラインCTA（エリアページ旧クラス） */
.cta-inline {
  background: linear-gradient(135deg, #0f2440 0%, #1a3a5c 100%);
  border-radius: 10px;
  padding: 24px 20px;
  margin: 32px 0;
  text-align: center;
}
.cta-inline p { color: #c8d8e8; font-size: .88rem; margin-bottom: 14px; line-height: 1.8; }
.cta-inline a {
  display: inline-block;
  background: var(--color-cta);
  color: #fff;
  font-weight: 700;
  font-size: .95rem;
  padding: 14px 28px;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(184,70,0,.45);
  transition: transform .2s;
  position: relative;
}
.cta-inline a::after {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg);
  margin-left: 10px;
  vertical-align: middle;
}
.cta-inline a:hover { transform: translateY(-2px); }
.cta-inline small { display: block; color: #5a7090; font-size: .72rem; margin-top: 10px; }

/* ミニCTA（エリアページ用） */
.mcta {
  background: #fff8f0;
  border: 1px solid #e8c090;
  border-radius: 10px;
  padding: 18px 20px;
  margin: 24px 0;
  text-align: center;
}
.mcta p { font-size: 0.88rem; color: var(--brown); margin-bottom: 12px; font-weight: 700; }
.mcta a {
  display: inline-block;
  background: var(--color-cta);
  color: #fff;
  font-weight: 700;
  font-size: 0.9rem;
  padding: 12px 24px;
  border-radius: 8px;
  transition: transform .2s;
  position: relative;
}
.mcta a::after {
  content: '';
  display: inline-block;
  width: 7px;
  height: 7px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg);
  margin-left: 8px;
  vertical-align: middle;
}
.mcta a:hover { transform: translateY(-2px); }
.mcta small { display: block; color: var(--color-sub); font-size: 0.72rem; margin-top: 8px; }

/* 戻るリンク (.bl) */
.bl {
  display: inline-block;
  margin-top: 32px;
  font-size: var(--fs-sm);
  color: var(--color-cta);
  font-weight: 700;
  text-decoration: underline;
  padding: 4px 0;
}
.bl:hover { opacity: .8; }

/* 戻るリンク（エリアページ旧クラス） */
.back-link {
  display: inline-block;
  margin-top: 32px;
  font-size: var(--fs-sm);
  color: var(--color-cta);
  font-weight: 700;
  text-decoration: underline;
  padding: 4px 0;
}

/* フッターリンクラッパー (.fl) */
.fl {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-bottom: 16px;
  flex-wrap: wrap;
  font-size: 0.8rem;
}
.fl a { color: #7a90a8; }

/* PR表記フッター (.pf) */
.pf {
  color: #8a7060;
  font-size: 0.7rem;
  margin-top: 12px;
  line-height: 1.8;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

/* 追従CTA (.sc) */
.sc {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: var(--color-cta);
  padding: 12px 16px;
  text-align: center;
  z-index: 200;
  transform: translateY(100%);
  transition: transform .3s;
  box-shadow: 0 -4px 16px rgba(0,0,0,.2);
}
.sc.show { transform: translateY(0); }
.sc a {
  display: block;
  color: #fff;
  font-weight: 700;
  font-size: 0.95rem;
  max-width: 500px;
  margin: 0 auto;
}
.sc a::after {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg);
  margin-left: 8px;
  vertical-align: middle;
}

/* チェックリスト (.cl) */
.cl {
  list-style: none;
  padding: 0;
  margin: 16px 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cl li {
  padding-left: 2em;
  position: relative;
  font-size: 0.88rem;
  line-height: 1.8;
  color: var(--color-text);
}
.cl li::before {
  content: '✓';
  position: absolute;
  left: 0;
  width: 22px;
  height: 22px;
  background: var(--green);
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.7rem;
  font-weight: 700;
  top: 2px;
}

/* 関連記事リンク (.related) */
.related {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
  margin: 16px 0;
}
.related a {
  display: block;
  background: #fff;
  border-radius: 8px;
  padding: 14px 16px;
  box-shadow: 0 1px 6px rgba(0,0,0,.06);
  border-bottom: 2px solid var(--amber);
  font-size: 0.88rem;
  color: var(--navy);
  font-weight: 700;
  transition: transform .2s, box-shadow .2s;
}
.related a:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,.1); }
.related a span {
  display: block;
  font-size: 0.72rem;
  color: var(--color-sub);
  font-weight: 400;
  margin-top: 4px;
}

/* FAQラッパー (.faq-wrap) */
.faq-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 20px;
}

/* FAQ番号・アイコン（faq.html用） */
.faq-num {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  background: var(--amber);
  color: var(--navy);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 700;
  font-family: var(--font-heading);
}
.faq-q-text {
  flex: 1;
  text-align: left;
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.5;
}
.faq-icon {
  flex-shrink: 0;
  width: 10px;
  height: 10px;
  border-right: 2px solid var(--amber);
  border-bottom: 2px solid var(--amber);
  transform: rotate(45deg);
  transition: transform .3s;
  margin-left: 4px;
}
.faq-item.open .faq-icon,
.faq-item[open] .faq-icon {
  transform: rotate(-135deg);
}

/* .faq-qをbuttonとして使う場合のリセット */
button.faq-q {
  width: 100%;
  background: #fff;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
}
/* buttonタイプのfaq-qは::afterを使わず.faq-iconで矢印表示（二重矢印防止） */
button.faq-q::after { content: none; }
/* .faq-item.open 時の.faq-a展開 */
.faq-item.open .faq-a { max-height: 600px; padding: 0 20px 18px; }
.faq-item.open .faq-icon { transform: rotate(-135deg); }

/* レスポンシブ補足 */
@media (max-width: 640px) {
  .ab { padding: 24px 16px 40px; }
  .cta-i, .cta-inline, .mcta { padding: 18px 16px; }
  .cta-i a, .cta-inline a { padding: 12px 20px; font-size: .88rem; }
  .related { grid-template-columns: 1fr 1fr; }
  .tbl th, .tbl td { padding: 10px 10px; font-size: .8rem; }
}