/* ====================================================================
   THEME / ADDITIONS
   base.css の上に読み込む。ブランドカラーを変えるときは
   base.css の :root だけを書き換えれば全ページに反映されます。

   変数の意味（base.css の :root）
     --ink    : メインの濃色（ヘッダー文字・見出し・フッター背景）
     --tiff   : アクセント色（ボタン・線・強調）※名称は旧来の互換
     --tiff-2 : アクセント明
     --tiff-3 : アクセント暗（文字に使える濃さ）
     --pale   : 淡い背景
     --line   : 罫線
   ==================================================================== */

:root {
  --accent: var(--tiff);
  --accent-lt: var(--tiff-2);
  --accent-dk: var(--tiff-3);
}

body { font-family: "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Hiragino Kaku Gothic ProN", "Meiryo", Arial, sans-serif; }

/* ---- 汎用テキストブロック（会社概要・特商法・プライバシー） ---- */
.prose { max-width: 860px; margin: 0 auto; }
.prose h2 {
  font-family: "Noto Serif JP", serif; font-size: 20px; font-weight: 700;
  color: var(--ink); letter-spacing: .05em;
  margin: 48px 0 14px; padding-left: 14px; border-left: 3px solid var(--accent);
}
.prose h2:first-child { margin-top: 0; }
.prose h3 { font-family:"Noto Serif JP",serif; font-size:16px; color:var(--ink); margin:28px 0 8px; }
.prose p { font-size: 14.5px; line-height: 2.0; color: var(--text-dim); margin-bottom: 16px; }
.prose ul, .prose ol { margin: 0 0 18px 22px; }
.prose li { font-size: 14.5px; line-height: 1.95; color: var(--text-dim); margin-bottom: 6px; }
.prose a { color: var(--accent-dk); text-decoration: underline; }

/* ---- 定義テーブル（会社概要・特商法） ---- */
.spec-table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--line); }
.spec-table th, .spec-table td { padding: 16px 20px; font-size: 14px; text-align: left; vertical-align: top; border-top: 1px solid var(--line); line-height: 1.9; }
.spec-table tr:first-child th, .spec-table tr:first-child td { border-top: none; }
.spec-table th { width: 230px; background: var(--bg-2); color: var(--ink); font-weight: 700; letter-spacing: .04em; }
.spec-table td { color: var(--text-dim); }
@media (max-width: 680px) {
  .spec-table th, .spec-table td { display: block; width: 100%; padding: 12px 16px; }
  .spec-table td { border-top: none; }
}

/* ---- ステップ（ご利用方法） ---- */
.step-list { display: grid; gap: 18px; counter-reset: step; }
.step {
  display: grid; grid-template-columns: 84px 1fr; gap: 24px; align-items: start;
  background: #fff; border: 1px solid var(--line); padding: 26px 28px; transition: all .3s;
}
.step:hover { border-color: var(--accent); box-shadow: 0 14px 34px rgba(20,38,63,.08); }
.step::before {
  counter-increment: step; content: "STEP " counter(step);
  font-family: "Cormorant Garamond", serif; font-size: 15px; font-weight: 600;
  color: var(--accent); letter-spacing: .12em; padding-top: 4px;
}
.step h3 { font-family:"Noto Serif JP",serif; font-size:17px; color:var(--ink); margin-bottom:8px; }
.step p { font-size: 13.5px; color: var(--text-dim); line-height: 1.9; }
@media (max-width: 640px) { .step { grid-template-columns: 1fr; gap: 8px; } }

/* ---- 注意ボックス ---- */
.note-box {
  background: var(--bg-2); border: 1px dashed var(--line-2);
  padding: 22px 24px; font-size: 13.5px; line-height: 1.9; color: var(--text-dim);
}
.note-box strong { color: var(--ink); }
.note-box.warn { border-color: var(--danger); background: #fdf5f5; }

/* ---- ブログ／お知らせ一覧 ---- */
.post-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.post-card { background:#fff; border:1px solid var(--line); display:flex; flex-direction:column; transition: all .3s; }
.post-card:hover { border-color: var(--accent); transform: translateY(-4px); box-shadow: 0 18px 40px rgba(20,38,63,.10); }
.post-thumb { aspect-ratio: 16/9; background: radial-gradient(circle at 50% 45%, var(--pale), #fff 75%); border-bottom:1px solid var(--line); display:grid; place-items:center; color: var(--accent); font-family:"Cormorant Garamond",serif; letter-spacing:.2em; font-size:13px; }
.post-body { padding: 20px 22px 24px; display:flex; flex-direction:column; gap:10px; flex:1; }
.post-meta { font-size: 11px; letter-spacing: .15em; color: var(--muted); font-family:"Cormorant Garamond",serif; }
.post-card h3 { font-family:"Noto Serif JP",serif; font-size:16px; color:var(--ink); line-height:1.6; }
.post-card p { font-size:13px; color: var(--text-dim); line-height:1.85; }
.post-more { margin-top:auto; font-size:12px; letter-spacing:.12em; color: var(--accent-dk); }
@media (max-width: 980px) { .post-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 620px) { .post-grid { grid-template-columns: 1fr; } }

/* ---- フォーム ---- */
.form-wrap { max-width: 780px; margin: 0 auto; background:#fff; border:1px solid var(--line); padding: 44px 44px 40px; }
.form-row { margin-bottom: 24px; }
.form-row label { display:block; font-size:13px; font-weight:700; color: var(--ink); letter-spacing:.06em; margin-bottom:8px; }
.form-row .req { display:inline-block; margin-left:8px; padding:2px 8px; background: var(--danger); color:#fff; font-size:10px; letter-spacing:.1em; vertical-align:middle; }
.form-row .any { display:inline-block; margin-left:8px; padding:2px 8px; background: var(--bg-3); color: var(--text-dim); font-size:10px; letter-spacing:.1em; vertical-align:middle; }
.form-row input[type=text], .form-row input[type=email], .form-row input[type=tel], .form-row select, .form-row textarea {
  width:100%; padding:13px 15px; border:1px solid var(--line-2); background:#fff;
  font-family:inherit; font-size:14px; color: var(--text); border-radius:2px;
}
.form-row textarea { min-height: 160px; resize: vertical; }
.form-row input:focus, .form-row select:focus, .form-row textarea:focus { outline:none; border-color: var(--accent); box-shadow:0 0 0 3px rgba(176,135,59,.12); }
.form-row .hint { font-size:12px; color: var(--muted); margin-top:6px; line-height:1.7; }
.form-check { display:flex; align-items:flex-start; gap:10px; font-size:13.5px; color: var(--text-dim); line-height:1.8; }
.form-submit { text-align:center; margin-top: 34px; }
@media (max-width: 640px) { .form-wrap { padding: 28px 20px 26px; } }

/* ---- 商材別ページの見出し帯 ---- */
.lead-band { background: var(--bg-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding: 46px 0; }
.lead-band p { max-width: 860px; margin: 0 auto; font-size: 15px; line-height: 2.0; color: var(--text-dim); text-align:center; }

/* ---- 買取強化リスト ---- */
.chip-list { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.chip { display:inline-block; padding:9px 18px; border:1px solid var(--line-2); background:#fff; font-size:13px; color: var(--ink); letter-spacing:.04em; transition: all .25s; }
.chip:hover { border-color: var(--accent); color: var(--accent-dk); }

/* ---- 2カラム比較 ---- */
.compare { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.compare > div { padding:28px 26px; border:1px solid var(--line); background:#fff; }
.compare .ttl { font-family:"Noto Serif JP",serif; font-size:16px; color:var(--ink); margin-bottom:12px; padding-bottom:10px; border-bottom:1px solid var(--line); }
.compare ul { list-style:none; }
.compare li { font-size:13.5px; color:var(--text-dim); line-height:1.9; padding-left:20px; position:relative; }
.compare li::before { content:"—"; position:absolute; left:0; color:var(--accent); }
@media (max-width: 720px) { .compare { grid-template-columns:1fr; } }

/* ---- 買取実績カード（写真＋ランク表示） ---- */
/* 商品名の行数が違ってもカード下端で買取価格の行が揃うようにする */
.result-card { display: flex; flex-direction: column; }
.result-card .result-body { display: flex; flex-direction: column; flex: 1; }
.result-card .result-body .price-row { margin-top: auto; }
.result-vis.has-photo { aspect-ratio: 1/1; background: #f6f4ef; padding: 0; }
.result-vis.has-photo img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; display: block;
}
.result-card .badge.rank {
  display: inline-flex; align-items: center; gap: 6px;
  background: linear-gradient(135deg, var(--accent-lt), var(--accent-dk));
  font-weight: 700; letter-spacing: .14em; padding: 5px 11px;
  box-shadow: 0 2px 6px rgba(20,38,63,.22); z-index: 2;
}
.result-card .badge.rank em { font-style: normal; font-size: 8.5px; letter-spacing: .2em; opacity: .9; }
.result-body .rank-mark {
  font-family: "Cormorant Garamond", serif; font-size: 26px; font-weight: 600;
  color: var(--accent-dk); letter-spacing: .05em; line-height: 1;
}
.rank-note { text-align: center; margin-top: 26px; font-size: 12.5px; color: var(--muted); letter-spacing: .04em; line-height: 1.9; }

/* ---- 差し込み待ちプレースホルダーの視認用（納品前に削除可） ---- */
.ph { background: rgba(213,75,72,.08); border-bottom: 1px dotted rgba(213,75,72,.5); }

/* ---- パンくず ---- */
.breadcrumb { font-size: 11.5px; color: var(--muted); letter-spacing:.08em; padding: 14px 0; }
.breadcrumb a { color: var(--accent-dk); }
.breadcrumb span { margin: 0 8px; opacity:.6; }

/* ---- 印刷 ---- */
@media print {
  .topbar, .float-cta, .menu-btn, .mobile-menu, .cta-band { display: none !important; }
  header.site { position: static; }
}

/* ---- Googleマップ埋め込み時の枠 ---- */
.map-frame.has-map { position: relative; background: #eee; display: block; padding: 0; overflow: hidden; }
.map-frame.has-map iframe { display: block; }
@media (max-width: 900px) { .map-frame.has-map { min-height: 320px; } }