@charset "utf-8";
/* /b/ 出張買取サイト。
   配色は2026-08-15にユーザー指定の5色へ変更。
     ブルー #08A8D5 ／ グリーン #57B957 ／ イエロー #FFD43B
     オレンジ #FF7133 ／ 白 #FFFFFF
   構成はトレジャーファクトリーの店舗ページ寄り（白基調・情報を整理して並べる）。
   /a/ の緑基調とは別物にしてA/Bで比べられるようにする。
   スマホ優先。1ファイルだけ、外部フォント無し（表示速度のため）。

   ★色の配分（2026-08-15 修正・トレファクの実物に合わせた）
     主役はブルー。ナビ帯・主ボタン・見出しの線・現在地はすべてブルー。
     グリーンは電話ボタン（掛けてよいと分かる色）。
     **オレンジは販促の帯とバッジだけ**にする。前は電話ボタン・固定バー・
     見出しの線まで全部オレンジで、画面がオレンジに埋まっていた。
     トレファクもオレンジはキャンペーンバナーにしか使っていない。
   ★オレンジと黄色は白背景だと文字が読みにくい。面で使うときだけ地色にする。 */

:root{
  /* 2026-08-15 ユーザー指定の配色（見本の画像に合わせて差し替え）
       メインブルー #0878C2 … 電話・ナビ・見出し・リンク
       濃いブルー   #0271B9 … ナビ帯・強調
       イエロー     #FCE44F … 0円アイコンの背景・安心材料
       オレンジ     #F05206 … 「すべて0円」など1ページに1〜2か所だけ
       白           #FFFFFF … メイン背景
       薄いグレー   #F7F8F9 … カード・区切り
       黒           #111111 … メイン文字
       グレー       #D9DEE2 … 補助文字・線

     ★面積の目安：白70% / 青22% / 黄5% / オレンジ3%
       オレンジを増やすと安心感が消えるので、販促帯以外には使わない。
     ★イエローは白地の文字に使わない（読めない）。アイコンの丸い背景だけ。 */
  --blue:#0878C2;
  --blue-d:#0271B9;
  --yellow:#FCE44F;
  --orange:#F05206;
  --white:#FFFFFF;
  --gray:#F7F8F9;
  --ink:#111111;
  --ink2:#5b666c;
  --line:#D9DEE2;
  --green:#57B957;

  --bg:var(--white);
  --link:var(--blue);
  --w:1000px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,system-ui,sans-serif;
  line-height:1.8;font-size:16px;padding-bottom:72px;
}
img{max-width:100%;height:auto}
a{color:var(--link)}
.wrap{max-width:var(--w);margin:0 auto;padding:0 16px}

/* ヘッダー */
.hd{border-bottom:1px solid var(--line);background:#fff;position:sticky;top:0;z-index:20}
.hd__in{display:flex;align-items:center;justify-content:space-between;min-height:56px;gap:12px}
.hd__logo{font-weight:700;color:var(--ink);text-decoration:none;font-size:17px;line-height:1.2}
.hd__logo span{display:block;font-size:11px;color:var(--ink2);font-weight:500}
.hd__nav{display:flex;align-items:center;gap:14px}
.hd__nav a{font-size:13px;text-decoration:none}
.hd__tel{color:var(--blue);font-weight:700;font-size:16px;white-space:nowrap;text-decoration:none;letter-spacing:.02em}

/* ヒーロー */
.hero{background:var(--gray);padding:28px 0 24px;border-bottom:1px solid var(--line)}
.hero--sub{padding:20px 0 18px}
.hero__eyebrow{margin:0 0 6px;font-size:13px;color:var(--ink2)}
.hero__h1{margin:0 0 10px;font-size:24px;line-height:1.45;font-weight:700}
.hero__sub{margin:0 0 12px;font-size:15px;color:var(--ink2)}
.hero__pts{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0 0 16px;padding:0}
.hero__pts li{background:#fff;border:1px solid var(--line);border-radius:3px;padding:4px 10px;font-size:13px;font-weight:700}

/* CTA */
.cta2{display:grid;gap:10px}
.btn{display:block;text-align:center;text-decoration:none;border-radius:4px;padding:13px 14px;font-weight:700;font-size:16px;line-height:1.4}
.btn b{display:block;font-size:20px;letter-spacing:.02em}
.btn small{display:block;font-size:11px;font-weight:500;opacity:.9}
.btn--tel{background:var(--blue);color:#fff}
.btn--form,.btn--send{background:var(--blue);color:#fff;border:0;width:100%;cursor:pointer;font-family:inherit}
.btn--line{background:var(--white);color:var(--blue);border:2px solid var(--blue)}

/* 節 */
.sec{padding:26px 0;border-bottom:1px solid var(--line)}
.sec--gray{background:var(--gray)}
.h2{margin:0 0 12px;font-size:19px;font-weight:700;padding-left:10px;border-left:4px solid var(--blue);line-height:1.4;color:var(--blue-d)}
.h3{margin:18px 0 6px;font-size:16px;font-weight:700;color:var(--blue-d)}
.lead{margin:0 0 12px;color:var(--ink2);font-size:14px}
.p{margin:0 0 12px;font-size:15px}
.note{margin:8px 0 0;font-size:12px;color:var(--ink2);line-height:1.7}

/* サービス一覧 */
.svc{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.svc li{border:1px solid var(--line);border-radius:4px;padding:10px 12px;background:#fff}
.svc b{display:block;font-size:15px}
.svc span{display:block;font-size:12px;color:var(--ink2);line-height:1.6}

/* 流れ */
.flow{margin:0;padding-left:1.3em}
.flow li{margin:0 0 10px;font-size:14px;color:var(--ink2)}
.flow b{display:block;color:var(--ink);font-size:15px}

/* 事実の箇条書き */
.facts{margin:0 0 12px;padding-left:1.2em}
.facts li{font-size:14px;margin:3px 0}

/* エリア */
.areablk{margin:0 0 16px}
.areablk .cnt{font-size:12px;color:var(--ink2);font-weight:500;margin-left:8px}
.arealist{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.arealist a{display:block;border:1px solid var(--line);background:#fff;border-radius:3px;padding:6px 10px;font-size:13px;text-decoration:none}
.arealist a.is-current{background:var(--blue);color:#fff;border-color:var(--blue)}
.nearby{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.nearby a{display:block;border:1px solid var(--line);background:#fff;border-radius:3px;padding:8px 12px;font-size:14px;text-decoration:none}

/* パンくず */
.crumbs{font-size:12px;color:var(--ink2);padding:8px 0;border-bottom:1px solid var(--line)}
.crumbs a{text-decoration:none}

/* 会社情報 */
.info{display:grid;grid-template-columns:auto 1fr;gap:0;margin:0;border-top:1px solid var(--line)}
.info dt{padding:9px 10px 9px 0;font-size:13px;font-weight:700;border-bottom:1px solid var(--line);white-space:nowrap}
.info dd{padding:9px 0;margin:0;font-size:13px;border-bottom:1px solid var(--line)}

/* フォーム */
.form{margin-top:16px}
.form label{display:block;margin:0 0 12px;font-size:14px;font-weight:700}
.form input,.form textarea{
  width:100%;margin-top:5px;padding:11px 12px;border:1px solid #bbb;border-radius:4px;
  font-size:16px;font-family:inherit;background:#fff;
}
.form .req{background:var(--orange);color:#fff;font-size:10px;border-radius:2px;padding:1px 6px;margin-left:6px;vertical-align:middle}
.hp{position:absolute;left:-9999px}

/* フッター */
.ft{padding:18px 0 22px;font-size:13px;background:var(--gray)}
.ft a{text-decoration:none}
.ft__c{color:var(--ink2);font-size:11px;margin:8px 0 0}

/* 固定バー */
.fixbar{position:fixed;left:0;right:0;bottom:0;display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:6px;background:rgba(255,255,255,.96);border-top:1px solid var(--line);z-index:30}
.fixbar a{display:block;text-align:center;text-decoration:none;border-radius:4px;padding:9px 6px;font-weight:700;font-size:13px;line-height:1.25}
.fixbar__tel{background:var(--blue);color:#fff}
.fixbar__tel b{display:block;font-size:15px}
.fixbar__form{background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center}

@media(min-width:700px){
  .hero__h1{font-size:30px}
  .cta2{grid-template-columns:1fr 1fr}
  .svc{grid-template-columns:repeat(3,1fr)}
  .info{grid-template-columns:180px 1fr}
  .fixbar{display:none}
  body{padding-bottom:0}
}

/* ------------------------------------------------------------------
   画像を入れる枠（2026-08-15）
   トレジャーファクトリーの店舗ページと同じく、写真の場所を先に確保しておく。
   ★写真はまだ用意していないので、枠だけを置いて中は空にしてある。
     用意できたら .ph の中に <img> を入れるだけ。
   ★高さを比率で固定してあるので、あとから画像を入れてもレイアウトがずれない
     （画像が入った瞬間に下の文章が飛ぶ、いわゆるCLSを防ぐ）。
   ------------------------------------------------------------------ */
.ph{
  background:var(--gray);
  border:1px dashed var(--line);
  border-radius:4px;
  display:flex;align-items:center;justify-content:center;
  color:#9aa5ab;font-size:12px;
}
.ph--hero{aspect-ratio:16/9;margin:0 0 14px}
.ph--gal{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;background:none;border:0;padding:0}
.ph--gal .ph{aspect-ratio:4/3;margin:0}
.ph--band{aspect-ratio:16/6;margin:14px 0 0}
.svc__ic{
  width:44px;height:44px;margin:0 auto 6px;border-radius:50%;
  background:var(--gray);border:1px dashed var(--line);
}
.svc--ic li{text-align:center}


/* ------------------------------------------------------------------
   ナビ帯・タイトル帯・販促帯（2026-08-15）
   トレファクの実物に合わせた。ブルーの帯を主役にして、
   オレンジは販促の帯だけに使う。
   ------------------------------------------------------------------ */
.nav{background:var(--blue-d)}
.nav__in{display:flex;gap:0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.nav__in::-webkit-scrollbar{display:none}
.nav a{
  color:#fff;text-decoration:none;font-size:14px;font-weight:700;
  padding:12px 14px;white-space:nowrap;display:block;
  border-right:1px solid rgba(255,255,255,.25);
}
.nav a:first-child{border-left:1px solid rgba(255,255,255,.25)}
.nav a.is-current{background:rgba(0,0,0,.14)}

.ttlbar{background:var(--gray);border-bottom:1px solid var(--line)}
.ttlbar h1,.ttlbar .t{margin:0;padding:12px 0;font-size:17px;font-weight:700}

/* 販促帯。オレンジはここだけ。 */
.promo{background:var(--orange);color:#fff;text-align:center}
.promo a,.promo p{color:#fff;text-decoration:none;display:block;margin:0;padding:7px 12px;font-size:12.5px;font-weight:700;line-height:1.45}
.promo b{font-size:14px}

/* タブ（トレファクの店舗TOP/店内紹介…と同じ見せ方） */
.tabs{display:flex;gap:6px;overflow-x:auto;padding:12px 0 0}
.tabs a{
  display:block;padding:8px 14px;border-radius:4px 4px 0 0;font-size:13px;
  text-decoration:none;background:var(--gray);color:var(--ink2);white-space:nowrap;
  border:1px solid var(--line);border-bottom:0;
}
.tabs a.is-current{background:var(--blue);color:#fff;border-color:var(--blue)}

/* ヘッダーのアイコン3つ（2026-08-15）
   トレファクと同じ「ロゴ＋小さいアイコン＋短いラベル」。
   説明を書かずに何ができるかが分かるようにする。 */
.hdic{list-style:none;display:flex;gap:14px;margin:0;padding:0}
.hdic a{display:block;text-align:center;text-decoration:none;color:var(--ink);font-size:10px;line-height:1.3}
.hdic svg{width:22px;height:22px;display:block;margin:0 auto 2px;fill:none;stroke:var(--blue-d);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.hdic span{display:block;white-space:nowrap}

/* 折りたたみ（町名一覧など。全部並べると読む気が失せるので隠す） */
.more{margin:6px 0 0;border-top:1px solid var(--line);padding-top:8px}
.more summary{cursor:pointer;font-size:13px;color:var(--link);font-weight:700}

/* 対応エリアの地図（2026-08-15）
   高さを先に決めておく。あとから地図が乗っても下の文章が飛ばない（CLS対策）。 */
.map{height:380px;border:1px solid var(--line);border-radius:4px;background:var(--gray)}
.pin span{
  display:block;width:14px;height:14px;border-radius:50%;
  background:var(--orange);border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.25);
}
.leaflet-container{font:inherit}
@media(min-width:700px){ .map{height:460px} }


/* 0円カード（見本の画像と同じ形。安心材料をアイコンで見せる）
   ★イエローは丸い背景だけに使う。白地の文字色には使わない（読めないため）。 */
.zero{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.zero li{background:var(--white);border:1px solid var(--line);border-radius:8px;padding:12px 6px;text-align:center}
.zero__ic{width:46px;height:46px;margin:0 auto 6px;border-radius:50%;background:var(--yellow);display:flex;align-items:center;justify-content:center}
.zero__ic svg{width:24px;height:24px;fill:none;stroke:var(--blue);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.zero__t{display:block;font-size:12px;font-weight:700;line-height:1.35}
.zero__v{display:block;font-size:22px;font-weight:800;color:var(--blue);line-height:1.2}
.zero__v small{font-size:12px;font-weight:700}

/* 販促帯：見本と同じく「すべて0円」を白い箱で抜く */
.promo__b{background:var(--white);color:var(--orange);border-radius:4px;padding:2px 10px;margin-right:8px;font-weight:800;display:inline-block}

/* 2列の見出しブロック（買取できるもの／対応エリア） */
.cols{display:grid;gap:18px}
@media(min-width:700px){ .cols{grid-template-columns:1fr 1fr} }
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 0;padding:0}
.chips a{display:block;border:1px solid var(--line);border-radius:4px;padding:8px 14px;font-size:14px;text-decoration:none;background:var(--white)}
.more__link{display:inline-block;margin-top:10px;font-size:14px;font-weight:700;text-decoration:none}

/* 一番下のSNS（2026-08-15）
   ★丸の色は各サービスの公式ブランドカラー。ここだけサイトの配色を当てない。
     見慣れた色でないと何のアイコンか分からなくなるため。 */
.sec--sns{background:var(--gray);text-align:center;border-bottom:0}
.sns__lead{margin:0 0 12px;font-size:13px;color:var(--ink2)}
.sns{list-style:none;display:flex;justify-content:center;flex-wrap:wrap;gap:18px;margin:0;padding:0}
.sns a{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.sns svg{width:26px;height:26px}
.sns span{display:block;margin-top:5px;font-size:11px;color:var(--ink2)}

/* 出張サービス情報の表（2026-08-15）
   見本の店舗情報表を出張型に置き換えたもの。住所は載せない。 */
.info--svc dt{background:var(--gray);padding-left:10px;font-size:12.5px}
.info--svc dd{padding-left:10px;font-size:13.5px}
.info--svc .tel{font-size:18px;font-weight:800;color:var(--blue);text-decoration:none;letter-spacing:.02em}
.info--svc small{display:block;font-size:11px;color:var(--ink2);margin-top:2px}
.info--svc .more__link{margin:4px 0 0}
.zeroy{color:var(--blue);font-size:17px;font-weight:800;background:var(--yellow);border-radius:3px;padding:1px 8px}

/* ロゴ（2026-08-15・見本に合わせてスマイルマーク＋社名＋サブ） */
.hd__logo{display:flex;align-items:center;gap:9px}
.hd__logo img{width:auto;height:40px;flex:none;display:block}
.hd__name{display:block;font-size:17px;font-weight:800;line-height:1.15;color:var(--ink)}
.hd__name small{display:block;font-size:9.5px;font-weight:500;color:var(--ink2);margin-top:1px;letter-spacing:.01em}

/* 買取できるもの／対応エリアの2列（見本の下部と同じ） */
.kaitori{list-style:none;display:grid;grid-template-columns:repeat(6,1fr);gap:4px;margin:8px 0 0;padding:0}
.kaitori li{text-align:center;font-size:10px;color:var(--ink2)}
.kaitori svg{width:30px;height:30px;display:block;margin:0 auto 3px;fill:none;stroke:var(--blue);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* サービスカード（見本2枚目「こんなご相談に対応しています」） */
.sec--cards{background:var(--gray)}
.cards__h{text-align:center;font-size:20px;font-weight:800;margin:0 0 4px}
.cards__h::after{content:"";display:block;width:64px;height:3px;background:var(--yellow);margin:8px auto 16px;border-radius:2px}
.cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cards a{display:block;background:var(--white);border:1px solid var(--line);border-radius:10px;padding:16px 10px;text-align:center;text-decoration:none;color:var(--ink);height:100%}
.cards__ic{display:block;width:74px;height:66px;margin:0 auto 8px;background:#eaf4fc;border-radius:50%;display:flex;align-items:center;justify-content:center}
.cards__ic svg{width:52px;height:46px}
.cards b{display:block;font-size:15px;color:var(--blue);font-weight:800}
.cards b::after{content:"";display:block;width:34px;height:2px;background:var(--yellow);margin:6px auto 7px}
.cards__d{display:block;font-size:12px;color:var(--ink2);line-height:1.65}
.cards__note{margin:14px 0 0;text-align:center;font-size:12.5px;background:#eaf4fc;border-radius:6px;padding:9px 12px;color:var(--ink)}
@media(min-width:700px){ .cards{grid-template-columns:repeat(3,1fr)} }

/* 下部ブロック（お知らせ／事例／お客様の声／FAQ／締め）2026-08-15 */
.secttl{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.secttl .h2{margin-bottom:12px}
.news{margin:0;border-top:1px solid var(--line)}
.news dt{font-size:12px;color:var(--blue);font-weight:700;padding:10px 0 0}
.news dd{margin:0;padding:0 0 10px;border-bottom:1px solid var(--line)}
.news dd b{display:block;font-size:14px}
.news dd span{display:block;font-size:12.5px;color:var(--ink2);line-height:1.7}

.cases{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:8px;overflow:hidden}
.cases li{background:var(--white)}
.cases a{display:block;padding:10px;text-decoration:none;color:var(--ink)}
.cases__ph{display:block;aspect-ratio:1/1;background:var(--gray);border-radius:4px;margin-bottom:7px}
.cases__meta{display:flex;align-items:center;gap:5px;margin-bottom:4px}
.cases__tag{background:var(--blue);color:#fff;font-size:10px;font-weight:700;border-radius:3px;padding:1px 6px}
.cases__area{font-size:11px;color:var(--ink2)}
.cases b{display:block;font-size:13px;line-height:1.5;font-weight:700;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media(min-width:700px){ .cases{grid-template-columns:repeat(4,1fr)} }

.voices{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:8px;overflow:hidden}
.voices li{background:var(--white)}
.voices a{display:block;padding:11px 10px;text-decoration:none;color:var(--ink)}
.voices__st{display:block;color:#f5b301;font-size:13px;letter-spacing:.06em;margin-bottom:5px}
.voices__t{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  font-size:12.5px;line-height:1.7;margin-bottom:6px}
.voices__m{display:block;font-size:10.5px;color:var(--ink2)}
@media(min-width:700px){ .voices{grid-template-columns:repeat(4,1fr)} }

.faq{border-bottom:1px solid var(--line);padding:10px 0}
.faq summary{cursor:pointer;font-weight:700;font-size:14.5px;list-style:none;position:relative;padding-right:24px}
.faq summary::after{content:"＋";position:absolute;right:0;color:var(--blue);font-weight:700}
.faq[open] summary::after{content:"−"}
.faq p{margin:8px 0 0;font-size:13.5px;color:var(--ink2);line-height:1.85}

.sec--close{background:#fffdf0;border-top:2px solid var(--yellow)}
.close{display:grid;gap:16px;text-align:center}
.close__lb{margin:0 0 4px;font-size:13px;font-weight:700}
.close__lb small{font-weight:500;color:var(--ink2)}
.close__num{display:block;font-size:30px;font-weight:800;color:var(--blue);text-decoration:none;letter-spacing:.01em}
.close__sub{margin:2px 0 0;font-size:11.5px;color:var(--ink2)}
.btn--orange{background:var(--orange);color:#fff}
@media(min-width:700px){ .close{grid-template-columns:1fr 1fr;align-items:center} }

/* ハンバーガーメニュー */
.nav__burger{background:none;border:0;padding:12px 14px;cursor:pointer;display:flex;flex-direction:column;gap:4px;flex:none}
.nav__burger span{display:block;width:20px;height:2px;background:#fff;border-radius:2px}
.drawer{position:fixed;inset:0;z-index:60}
.drawer__bg{position:absolute;inset:0;background:rgba(0,0,0,.45)}
.drawer__in{position:absolute;top:0;left:0;bottom:0;width:84%;max-width:330px;background:#fff;overflow-y:auto;padding:14px 16px 40px}
.drawer__x{position:absolute;top:6px;right:10px;background:none;border:0;font-size:26px;line-height:1;color:var(--ink2);cursor:pointer}
.drawer__h{margin:14px 0 6px;font-size:12px;font-weight:700;color:var(--blue);border-bottom:2px solid var(--line);padding-bottom:5px}
.drawer__ul{list-style:none;margin:0;padding:0}
.drawer__ul a{display:block;padding:11px 4px;border-bottom:1px solid var(--line);font-size:14.5px;text-decoration:none;color:var(--ink)}
.drawer__tel{display:block;margin:12px 0 4px;background:var(--blue);color:#fff;text-align:center;text-decoration:none;border-radius:5px;padding:10px;font-size:13px;font-weight:700}
.drawer__tel b{display:block;font-size:19px}

/* 対応しているサービス（出張＝1都3県／宅配＝全国／回収・遺品整理＝提携事業者） */
.scope{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.scope li{display:grid;grid-template-columns:34px 1fr auto;grid-template-areas:"i n b" ". d d";gap:2px 8px;align-items:center;background:var(--white);border:1px solid var(--line);border-radius:8px;padding:11px 12px}
.scope__i{grid-area:i;font-size:20px;line-height:1}
.scope b{grid-area:n;font-size:15px}
.scope__b{grid-area:b;font-size:11px;font-weight:700;border-radius:3px;padding:2px 9px;background:var(--gray);color:var(--ink2);border:1px solid var(--line);white-space:nowrap}
.scope__b.is-own{background:var(--blue);color:#fff;border-color:var(--blue)}
.scope__d{grid-area:d;font-size:12.5px;color:var(--ink2);line-height:1.65}


/* ------------------------------------------------------------------
   申し込みCTA（2026-08-15・見本の画像に合わせる）
     電話ボタン … 青ベタ＋受話器アイコン、番号を大きく
     申込ボタン … 白地に青枠＋バインダーのアイコン＋右向きの矢印
   ★見本では申込ボタンがオレンジではなく「白地＋青枠」。
     オレンジは販促帯だけに残す（面積3%の配分を守る）。
   ------------------------------------------------------------------ */
.cta2{gap:12px}
.btn{display:flex;align-items:center;justify-content:center;gap:10px;position:relative;border-radius:8px;padding:15px 16px;text-align:center}
.btn__ic{width:30px;height:30px;flex:none}
.btn__ic svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.btn__tx{display:block}
.btn--tel{background:var(--blue);color:#fff;box-shadow:0 2px 0 rgba(0,0,0,.06)}
.btn--tel .btn__tx small{display:block;font-size:12px;font-weight:600;opacity:.95;margin-top:1px}
.btn--tel b{display:block;font-size:26px;font-weight:800;letter-spacing:.01em;line-height:1.15}
.btn--form{background:var(--white);color:var(--blue);border:2px solid var(--blue);box-shadow:0 2px 0 rgba(0,0,0,.04)}
.btn--form b{display:block;font-size:19px;font-weight:800}
.btn--form small{display:block;font-size:12px;font-weight:700;color:var(--blue);margin-top:1px}
.btn--form::after{content:"›";position:absolute;right:14px;font-size:26px;line-height:1;color:var(--blue);font-weight:400}
.btn--send{background:var(--blue);color:#fff;border:0;width:100%;font-size:17px;font-weight:800;padding:16px}

/* 下の固定バーも見本と同じ形に */
.fixbar{gap:8px;padding:7px 8px}
.fixbar a{border-radius:7px;padding:10px 6px}
.fixbar__tel{background:var(--blue);color:#fff}
.fixbar__tel b{display:block;font-size:16px;font-weight:800}
.fixbar__form{background:var(--white);color:var(--blue);border:2px solid var(--blue);flex-direction:column}
.fixbar__form small{display:block;font-size:10px;font-weight:700}


/* ナビ帯をスクロールに追従させる（2026-08-15）
   トレファクも青い帯が上に残る。どのページからでも他のサービスへ移れるようにする。
   ★ヘッダー(56px)の下に貼り付ける。販促帯は一緒に固定しない（画面が狭くなるため）。 */
.nav{position:sticky;top:56px;z-index:19}

/* カードのアイコン画像（用意していただいた3D風アイコン） */
.cards__im{display:block;width:74px;height:74px;margin:0 auto 8px;border-radius:50%;object-fit:cover;background:#eaf4fc}

/* 飛び先ページの一覧（アイコン無し・文字だけで簡潔に） */
.svc li{display:block}

/* 売りたいものの検索（2026-08-15）
   ★飛び先は /a/ の検索。/b/ は静的サイトなので自前の検索機能を持てない。
     品目ページは /a/ 側に揃っているので、そちらへ渡すのが確実。 */
.srch{background:var(--white);border-bottom:1px solid var(--line);padding:8px 0}
.srch__f{display:flex;border:2px solid var(--ink);border-radius:2px;overflow:hidden}
.srch__f input{flex:1;min-width:0;border:0;padding:9px 10px;font-size:14px;font-family:inherit;background:var(--white)}
.srch__f input:focus{outline:2px solid var(--blue);outline-offset:-2px}
.srch__f button{border:0;background:var(--ink);color:#fff;font-weight:700;font-size:14px;padding:0 16px;cursor:pointer;font-family:inherit;white-space:nowrap}

/* よくいただくご相談の例（2026-08-15）
   ★口コミではないので★や年代は出さない。4件だけ見せて残りは折りたたむ。 */
.soudan{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.soudan li{background:var(--white);border:1px solid var(--line);border-radius:6px;padding:11px 12px}
.soudan b{display:block;font-size:13.5px;color:var(--blue-d);margin-bottom:4px}
.soudan span{display:block;font-size:12.5px;color:var(--ink2);line-height:1.75}
@media(min-width:700px){ .soudan{grid-template-columns:1fr 1fr} }

/* ---- 買取品目の一覧と検索（2026-08-15） ---- */
.hin__ttl{margin:0 0 6px;font-size:14px;font-weight:700;color:var(--blue-d)}
.hin__txt{margin:0 0 16px;font-size:14px;line-height:1.8;color:var(--ink2)}
.h2--mt{margin-top:32px}
.find{background:var(--gray);border:1px solid var(--line);border-radius:4px;padding:14px}
.find__lb{display:block;margin:0 0 7px;font-size:14px;font-weight:700}
.find__f{display:flex;gap:0}
.find__f input{flex:1;min-width:0;height:44px;padding:0 12px;font-size:16px;
  border:1px solid var(--line);border-right:0;border-radius:3px 0 0 3px;background:#fff;color:var(--ink)}
.find__f input::placeholder{color:#9AA3AA}
.find__f button{flex:none;height:44px;padding:0 18px;font-size:14px;font-weight:700;
  color:#fff;background:var(--ink);border:0;border-radius:0 3px 3px 0;cursor:pointer}
.find__r{margin-top:12px}
.find__r:empty{margin:0}
.find__n{margin:0 0 7px;font-size:13px;color:var(--ink2)}
.find__l{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.find__l a{display:flex;align-items:center;justify-content:space-between;gap:10px;
  background:#fff;border:1px solid var(--line);border-radius:3px;padding:10px 12px;
  font-size:14px;text-decoration:none;color:var(--ink)}
.find__l b{font-weight:700}
.find__l span{flex:none;font-size:12px;color:var(--ink2)}
.find__no{margin:0;font-size:13px;line-height:1.8;color:var(--ink2)}
.find__no a{color:var(--blue-d);font-weight:700}
@media(min-width:700px){
  .find__l{grid-template-columns:1fr 1fr}
}

/* ---- 無料相談・予約（押したときだけ開く／2026-08-15） ----
   ページ末尾に並べるのをやめた。開く口は固定バー・FVボタン・
   サービス情報表・ドロワーの4か所。
   ★JSが動かない場合でも :target で開く。申し込みを行き止まりにしない。 */
.fmw{position:fixed;inset:0;z-index:60;display:none}
.fmw:target,.fmw.is-open{display:block}
.fmw__bg{position:absolute;inset:0;background:rgba(17,17,17,.55)}
.fmw__in{position:absolute;left:0;right:0;bottom:0;max-height:92vh;overflow-y:auto;
  -webkit-overflow-scrolling:touch;background:#fff;border-radius:10px 10px 0 0;padding:20px 16px 28px}
.fmw__x{position:absolute;top:8px;right:10px;width:36px;height:36px;line-height:1;
  font-size:24px;color:var(--ink2);background:none;border:0;cursor:pointer}
.fmw .h2{padding-right:40px}
@media(min-width:700px){
  .fmw__in{left:50%;right:auto;bottom:auto;top:50%;transform:translate(-50%,-50%);
    width:min(560px,92vw);border-radius:8px;max-height:88vh}
}
body.fmw-open{overflow:hidden}

/* ---- よくあるご依頼の例（2026-08-15） ---- */
.jirei{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.jirei li{background:#fff;border:1px solid var(--line);border-radius:4px;padding:12px 13px}
.jirei__tag{display:inline-block;margin-bottom:6px;padding:2px 8px;border-radius:2px;
  font-size:11px;font-weight:700;color:#fff;background:var(--blue)}
.jirei b{display:block;margin:0 0 6px;font-size:14px;line-height:1.6;font-weight:700}
.jirei__b{display:block;font-size:13px;line-height:1.85;color:var(--ink2)}
.jirei__m{display:block;margin-top:7px;padding-top:7px;border-top:1px dashed var(--line);
  font-size:12px;color:var(--ink2)}
.more summary{cursor:pointer;margin-top:12px;padding:11px 12px;background:#fff;
  border:1px solid var(--line);border-radius:4px;font-size:14px;font-weight:700;text-align:center}
.more[open] summary{margin-bottom:10px}
@media(min-width:700px){
  .jirei{grid-template-columns:1fr 1fr}
}

/* ---- 生成した写真（2026-08-15） ----
   これまで .ph は「写真が入る予定の枠」（点線のプレースホルダ）だった。
   実際の写真が入ったので、img には点線も背景も出さない。 */
img.ph,img.cases__ph,.ph--gal img{background:none;border:0;display:block;
  width:100%;height:auto;object-fit:cover;border-radius:4px}
img.ph--hero{aspect-ratio:16/9;margin:0 0 14px}
.ph--gal{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;background:none;border:0;padding:0}
.ph--gal img{aspect-ratio:4/3}
img.cases__ph{aspect-ratio:1/1;margin-bottom:7px}

/* ---- ◯◯市の特徴（見本＝トレファクの「越谷店の特徴」／2026-08-15） ---- */
.toku{display:grid;gap:14px}
.toku__i{background:#fff;border:1px solid var(--line);border-radius:4px;padding:14px}
.toku__l{margin:0 0 6px;font-size:12px;font-weight:700;color:var(--blue-d);letter-spacing:.02em}
.toku__t{margin:0 0 8px;font-size:15px;line-height:1.6;font-weight:700;color:var(--ink)}
.toku__b{margin:0;font-size:13px;line-height:1.9;color:var(--ink2)}
.toku__b--l{margin-top:8px;padding-top:8px;border-top:1px dashed var(--line)}
@media(min-width:700px){
  .toku{grid-template-columns:repeat(3,1fr)}
}

/* ---- 各種サービス（サービスガイド）／2026-08-15 ----
   ページ下部。上の絵入りカード6枚と重ならないよう、文字だけの一覧にする。 */
.guide{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.guide li{border-bottom:1px solid var(--line)}
.guide a{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:4px 12px;
  padding:13px 2px;text-decoration:none;color:var(--ink)}
.guide__ic{grid-column:1;grid-row:1/3;width:44px;height:44px;object-fit:contain;border-radius:6px}
.guide b{grid-column:2;font-size:14px;font-weight:700}
.guide span{grid-column:2;grid-row:2;font-size:12px;color:var(--ink2)}
.guide em{grid-column:3;grid-row:1/3;font-style:normal;font-size:12px;font-weight:700;
  color:var(--blue-d);white-space:nowrap}
/* PCはトレファクと同じ2列（2026-08-16） */
@media(min-width:700px){
  .guide{display:grid;grid-template-columns:1fr 1fr;border-top:none;column-gap:14px}
  .guide li{border-top:1px solid var(--line)}
}

/* ---- 下層ページ（2026-08-15） ---- */
.pg__h1{font-size:20px}
.pg__note{margin:0 0 12px;font-size:13px;line-height:1.9;color:var(--ink2)}
.hin__ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.hin__ul li{background:var(--gray);border:1px solid var(--line);border-radius:3px;
  padding:9px 12px;font-size:13px}
.hin__ft{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.hin__ft li{background:#fff;border:1px solid var(--line);border-radius:4px;padding:12px 13px}
.hin__ft b{display:block;margin-bottom:5px;font-size:14px}
.hin__ft span{font-size:13px;line-height:1.85;color:var(--ink2)}
.cases--pg,.voices--pg{grid-template-rows:none}
.cases--pg li{margin-bottom:4px}
.cases__t{display:block;margin-top:5px;font-size:12px;line-height:1.8;color:var(--ink2)}
.voices--pg{display:grid;gap:10px}
.voices--pg li{background:#fff;border:1px solid var(--line);border-radius:4px;padding:13px}
.voices--pg p{margin:6px 0 0;font-size:13px;line-height:1.9;color:var(--ink)}
@media(min-width:700px){
  .hin__ul{grid-template-columns:1fr 1fr}
  .hin__ft{grid-template-columns:1fr 1fr}
  .voices--pg{grid-template-columns:1fr 1fr}
}

/* 読み上げ専用（画面には出さない・スクリーンリーダーと検索エンジンには読める） */
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---- 安心してご利用いただくために（2026-08-15） ---- */
.anshin{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.anshin li{background:var(--gray);border:1px solid var(--line);border-radius:4px;padding:13px 14px}
.anshin b{display:block;margin-bottom:5px;font-size:14px}
.anshin span{font-size:13px;line-height:1.9;color:var(--ink2)}
@media(min-width:700px){.anshin{grid-template-columns:1fr 1fr}}

/* 0円カードとボタンの間隔（2026-08-15「詰めすぎ」指摘で追加） */
.zero{margin-bottom:18px}
.cta2{margin-top:4px}

/* ---- WEB予約（訪問希望日時）／2026-08-15 ----
   /a/ の予約表と同じ〇×形式。〇=ボタン・×=受付不可。 */
.book{background:var(--gray);border:1px solid var(--line);border-radius:4px;padding:13px;margin:0 0 16px}
.book__t{margin:0 0 4px;font-size:14px;font-weight:700}
.book__t small{font-weight:400;color:var(--ink2)}
.book__s{margin:0 0 10px;font-size:12px;line-height:1.7;color:var(--ink2)}
.book__g{overflow-x:auto}
.book__tb{border-collapse:collapse;width:100%;min-width:430px;background:#fff;border:1px solid var(--line)}
.book__tb th,.book__tb td{border:1px solid var(--line);text-align:center;padding:4px 2px;font-size:11px}
.book__tb th b{display:block;font-size:12px}
.book__tb th i{font-style:normal;font-size:10px;color:var(--ink2)}
.book__tb th.is-sun b,.book__tb th.is-sun i{color:#D64545}
.book__tb th.is-sat b,.book__tb th.is-sat i{color:var(--blue-d)}
.book__tb tr th:first-child{background:var(--gray);font-size:11px;padding:6px 6px;white-space:nowrap}
.book__tb tr th:first-child i{display:block;font-size:10px}
.book__c{width:100%;min-height:34px;border:0;background:none;color:var(--blue-d);
  font-size:15px;font-weight:700;cursor:pointer;border-radius:3px}
.book__c:hover{background:#EAF4FB}
.book__c.is-sel{background:var(--blue);color:#fff}
.book__x{color:#B9C0C6}
.book__sel{margin:10px 0 0;padding:9px 11px;background:#EAF4FB;border:1px solid var(--blue);
  border-radius:3px;font-size:12px;line-height:1.7}

/* ---- PCの2カラム（トレファクPC版と同じ 本文+右250px／2026-08-15） ---- */
.pgside{display:none}
@media(min-width:960px){
  :root{--w:1100px}
  .pgcols{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:24px;
    max-width:var(--w);margin:0 auto;padding:0 16px;align-items:start}
  .pgcols .wrap{max-width:none;padding-left:0;padding-right:0}
  .pgmain{min-width:0}
  .pgside{display:block;padding-top:24px}
  .pgmain #svcinfo{display:none}  /* 情報表は右サイドに出すので本文側は消す */
  .pgside .sec{padding:0 0 18px}
  .pgside .h2{font-size:15px}
  .pgside .info--svc dt{font-size:11px}
  .pgside .info--svc dd{font-size:12px}
}
.side__b{border:1px solid var(--line);border-radius:4px;margin-bottom:16px;overflow:hidden}
.side__h{margin:0;padding:9px 12px;background:var(--blue);color:#fff;font-size:13px;font-weight:700}
.side__ul{list-style:none;margin:0;padding:0}
.side__ul li{border-top:1px solid var(--line)}
.side__ul li:first-child{border-top:0}
.side__ul a{display:block;padding:9px 12px;font-size:13px;text-decoration:none;color:var(--ink)}
.side__ul a:hover{background:var(--gray)}

/* ---- はじめての方へ（トレファク/first/風・2026-08-15） ---- */
.fst{background:linear-gradient(180deg,#EAF6FD,#fff);padding:34px 0 26px;text-align:center}
.fst__hi{margin:0 0 4px;font-size:14px;font-weight:700;color:var(--blue-d);letter-spacing:.1em}
.fst__catch{margin:0 0 14px;font-size:24px;font-weight:700;line-height:1.5}
.fst__intro{margin:0 auto;max-width:620px;font-size:14px;line-height:2;color:var(--ink2);text-align:left}
.fst__h2{text-align:center}
.fst__r{position:relative;background:#fff;border:2px solid #DCEBF5;border-radius:10px;
  padding:22px 18px 20px;margin:0 0 18px;text-align:center}
.fst__num{position:absolute;top:-14px;left:14px;width:34px;height:34px;line-height:34px;
  background:var(--yellow);color:var(--ink);font-size:16px;font-weight:700;border-radius:50%}
.fst__r img{display:block;width:min(240px,60%);height:auto;margin:0 auto 12px;border-radius:8px}
.fst__r h3{margin:0 0 8px;font-size:17px;font-weight:700;color:var(--blue-d)}
.fst__r p{margin:0 0 14px;font-size:13px;line-height:1.95;color:var(--ink2);text-align:left}
.fst__btn{display:inline-block;padding:11px 26px;background:var(--blue);color:#fff;
  font-size:14px;font-weight:700;text-decoration:none;border-radius:999px}
.fst__btn:hover{background:var(--blue-d)}
@media(min-width:700px){
  .fst__catch{font-size:30px}
  .fst__r{text-align:left;display:grid;grid-template-columns:220px 1fr;gap:6px 22px;align-items:center}
  .fst__r img{grid-row:1/4;margin:0;width:220px}
  .fst__r h3,.fst__r p{grid-column:2}
  .fst__btn{grid-column:2;justify-self:start}
}

/* 0円カードと電話ボタンの間隔をさらに空ける（2026-08-15「まだ詰めすぎ」） */
.zero{margin-bottom:28px}

/* スクロールしたら白いヘッダーは流れて消え、青いナビだけ上に残る
   （2026-08-15 ユーザー指示。見本＝トレファクのスマホ版）。
   top:56px だとヘッダーの下に貼り付いたままヘッダーも残って見えるため 0 にする。 */
.nav{top:0}

/* 白いヘッダーは固定しない（スクロールで消す）。青いナビだけが残る。 */
.hd{position:static}

/* ---- PC：トレファクPC版の配置に合わせる（2026-08-15） ----
   写真は左に小さく、その右に情報表。ほかの節は本文幅いっぱい。
   右端の250pxはピックアップと近くのエリア。 */
@media(min-width:960px){
  .pgmain{display:grid;grid-template-columns:minmax(0,46%) minmax(0,1fr);gap:0 20px;align-items:start}
  .pgmain>*{grid-column:1/-1;min-width:0}
  .pgmain>.hero{grid-column:1;grid-row:1;background:none;border:0;padding:12px 0 0}
  .pgmain>#svcinfo{display:block;grid-column:2;grid-row:1;padding:12px 0 0}
  .pgmain>.hero .wrap{padding:0}
  .pgmain>#svcinfo .h2{font-size:15px;margin-bottom:8px}
  .pgmain>#svcinfo .info--svc dt{font-size:11px;padding:8px 8px}
  .pgmain>#svcinfo .info--svc dd{font-size:12px;padding:8px 10px}
  .pgmain .hero .cta2{grid-template-columns:1fr}
  .pgside{padding-top:12px}
}

/* ナビ4本＋ハンバーガーをスマホ幅に収める（2026-08-15「横スクロールしないで」）。
   均等割りにして文字を少し絞る。420px以上なら従来の大きさで収まる。 */
.nav__in{overflow-x:visible}
.nav__in a{flex:1 1 0;min-width:0;text-align:center;padding:12px 2px}
@media(max-width:419px){
  .nav__in a{font-size:11.5px;letter-spacing:-.02em}
}

/* ---- 今月のお得なキャンペーン帯（トレファクのラリー帯の位置／2026-08-15） ---- */
.camp{margin:12px 0 4px}
.camp__d{border:2px solid var(--orange);border-radius:6px;background:#FFF7EC;overflow:hidden}
.camp__sum{display:flex;align-items:center;gap:8px;padding:11px 13px;cursor:pointer;list-style:none}
.camp__sum::-webkit-details-marker{display:none}
.camp__gift{font-size:18px}
.camp__sum b{flex:1;font-size:14.5px;color:#B34A00}
.camp__open{font-size:11px;font-weight:700;color:var(--orange);white-space:nowrap}
.camp__body{padding:4px 13px 13px;text-align:center}
.camp__badge{display:inline-block;padding:2px 10px;border-radius:2px;background:var(--orange);
  color:#fff;font-size:10px;font-weight:700;letter-spacing:.14em}
.camp__main{display:block;margin:6px 0 2px;font-size:20px;font-weight:700;color:#B34A00}
.camp__main span{font-size:30px;color:var(--orange);padding:0 2px}
.camp__sub{display:block;font-size:12px;font-weight:700;color:var(--ink)}
.camp__note{margin:8px 0 0;font-size:11px;line-height:1.7;color:var(--ink2);text-align:left}
.camp--s{margin:0 0 16px}
.camp--s .camp__sum b{font-size:12.5px}

/* ---- ご感想の例（2026-08-15） ---- */
.koe{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.koe li{background:#fff;border:1px solid var(--line);border-radius:4px;padding:12px 13px}
.koe b{display:block;margin-bottom:6px;font-size:13.5px;line-height:1.6}
.koe span{display:block;font-size:13px;line-height:1.9;color:var(--ink2)}
@media(min-width:700px){.koe{grid-template-columns:1fr 1fr}}

/* ご依頼例カードの画像（2026-08-15） */
.jirei__ph{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;
  border-radius:3px;margin-bottom:9px;background:var(--gray)}

/* はじめての方へ：あいさつ絵と流れ5段（2026-08-15 作り込み） */
.fst__hero{display:block;width:min(520px,88%);height:auto;margin:0 auto 14px;border-radius:10px}
.fsteps{list-style:none;margin:0;padding:0;display:grid;gap:12px;counter-reset:fs}
.fsteps li{position:relative;background:#fff;border:2px solid #DCEBF5;border-radius:10px;
  padding:16px 14px;text-align:center}
.fsteps img{display:block;width:min(160px,55%);height:auto;margin:0 auto 8px;border-radius:8px}
.fsteps__n{position:absolute;top:-12px;left:12px;width:28px;height:28px;line-height:28px;
  background:var(--yellow);border-radius:50%;font-size:14px;font-weight:700}
.fsteps b{display:block;margin-bottom:6px;font-size:15px;color:var(--blue-d)}
.fsteps p{margin:0;font-size:12.5px;line-height:1.9;color:var(--ink2);text-align:left}
@media(min-width:700px){
  .fsteps{grid-template-columns:repeat(5,1fr)}
}

/* ---- トップ：エリアから探す・はじめての方へバナー（2026-08-15） ---- */
.asearch{display:grid;gap:14px}
.asearch__p h3{margin:0 0 7px;font-size:14px;color:var(--blue-d)}
.chips__more{font-weight:700;color:var(--blue-d)}
@media(min-width:700px){.asearch{grid-template-columns:1fr 1fr}}
.fbn{display:grid;grid-template-columns:96px 1fr auto;align-items:center;gap:14px;
  border:2px solid #DCEBF5;border-radius:10px;padding:12px 14px;text-decoration:none;color:var(--ink)}
.fbn img{width:96px;height:64px;object-fit:cover;border-radius:8px}
.fbn__tx b{display:block;font-size:16px;color:var(--blue-d);margin-bottom:3px}
.fbn__tx span{font-size:12px;color:var(--ink2);line-height:1.6}
.fbn__go{font-size:13px;font-weight:700;color:var(--orange);white-space:nowrap}

/* ---- キャンペーン（2026-08-15） ---- */
.cpbn{display:block;margin:12px 0 4px;border:2px solid var(--orange);border-radius:8px;overflow:hidden}
.cpbn img{display:block;width:100%;height:auto}
.cpbn--s{margin:0 0 14px}
.cp__hero{display:block;width:100%;height:auto;border-radius:8px;margin-bottom:14px;border:1px solid var(--line)}
.cp__box{background:#FFF7EC;border:2px solid var(--orange);border-radius:8px;padding:16px;text-align:center;margin:0 0 12px}
.cp__main{margin:0 0 8px;font-size:16px;line-height:1.8}
.cp__pct{font-size:26px;color:var(--orange)}
.cp__term{margin:0;font-size:13px;font-weight:700}
.cp__ex{background:var(--gray);border:1px solid var(--line);border-radius:6px;padding:12px;text-align:center}
.cp__ex-t{margin:0 0 4px;font-size:12px;color:var(--ink2)}
.cp__ex-v{margin:0;font-size:18px;font-weight:700}
.cp__ex-v b{font-size:24px;color:var(--orange)}
.cp__ex-v span{font-size:13px;color:var(--ink2)}
.cp__note{list-style:none;margin:0;padding:0}
.cp__note li{position:relative;padding:8px 0 8px 18px;font-size:13px;line-height:1.8;color:var(--ink2);border-bottom:1px dashed var(--line)}
.cp__note li::before{content:"※";position:absolute;left:0;color:var(--orange)}

/* キャンペーン：写真2枚と説明（2026-08-15） */
.cp__ph2{display:grid;gap:14px}
.cp__ph2 figure{margin:0}
.cp__ph2 img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:6px}
.cp__ph2 figcaption{margin-top:8px;font-size:13px;line-height:1.9;color:var(--ink2)}
@media(min-width:700px){.cp__ph2{grid-template-columns:1fr 1fr}}

/* ---- トップのスライダー（斜めワイプ切替）とキャンペーン/ピックアップ帯（2026-08-15） ---- */
.slider{position:relative;aspect-ratio:16/9;border-radius:6px;overflow:hidden;margin-bottom:14px;background:var(--gray)}
.slider img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  clip-path:polygon(120% -20%,120% -20%,120% 120%,120% 120%);transition:clip-path .9s ease}
.slider img.is-on{clip-path:polygon(-20% -20%,120% -20%,120% 120%,-20% 120%);z-index:1}
.slider img.is-prev{clip-path:polygon(-20% -20%,120% -20%,120% 120%,-20% 120%)}
.slider__dots{position:absolute;left:0;right:0;bottom:8px;display:flex;justify-content:center;gap:7px;z-index:2}
.slider__dots i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.55)}
.slider__dots i.is-on{background:#fff}
.secbar{margin:0 0 12px;padding:10px 14px;background:var(--blue);color:#fff;
  font-size:15px;font-weight:700;border-radius:3px}
.pkrow{display:grid;gap:12px}
.pkrow .cpbn--s{margin:0}
@media(min-width:700px){.pkrow{grid-template-columns:1fr 1fr 1fr}}

/* ---- トップの3ボタン（トレファクSPトップの3カード／2026-08-15） ---- */
.sec--q3{padding:14px 0 4px}
.q3{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.q3 a{display:block;text-align:center;background:#fff;border:2px solid var(--blue);
  border-radius:6px;padding:14px 6px 11px;text-decoration:none;color:var(--blue-d)}
.q3 svg{width:34px;height:34px;fill:none;stroke:var(--blue);stroke-width:1.7;margin-bottom:6px}
.q3 b{display:block;font-size:12.5px}
/* ---- 現在地から近い順（2026-08-15） ---- */
.geo__row{margin:0 0 12px}
.geo__btn{display:flex;align-items:center;gap:8px;width:100%;justify-content:center;
  padding:13px;background:var(--blue);color:#fff;border:0;border-radius:4px;
  font-size:14px;font-weight:700;cursor:pointer}
.geo__btn svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:1.8}
.geo__out{margin:0 0 14px}
.geo__list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.geo__list a{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);
  border-radius:4px;padding:11px 13px;text-decoration:none;color:var(--ink)}
.geo__list b{flex:1;font-size:14px}
.geo__list i{font-style:normal;font-size:12px;color:var(--ink2);white-space:nowrap}
.geo__list .geo__km{font-size:12.5px;font-weight:700;color:var(--blue-d);white-space:nowrap}

/* ---- 画面幅いっぱいの帯スライダー（トレファクPCトップ／2026-08-15） ---- */
.heroband .slider{border-radius:0;margin-bottom:0}
.heroband__tx{position:absolute;left:5%;bottom:12%;z-index:2;margin:0;color:#fff;
  text-shadow:0 1px 10px rgba(0,0,0,.55)}
.heroband__tx b{display:block;font-size:20px;margin-bottom:3px}
.heroband__tx span{font-size:12.5px;font-weight:700}
@media(min-width:960px){
  .heroband .slider{aspect-ratio:16/5.4}
  .heroband__tx b{font-size:30px}
  .heroband__tx span{font-size:15px}
}

/* ---- トップの流れの出し分け（トレファクのPC/SPの違いに合わせる／2026-08-15） ----
   SP：スライダー → 3ボタン → 0円/CTA → キャンペーン → ピックアップ
   PC：帯スライダー → 0円/CTA（3ボタンは出さない。ヘッダーのナビにあるため）
       ピックアップも右サイドにあるので本文側は出さない */
.slider img.pos-t{object-position:center top}
@media(min-width:960px){
  .sec--q3{display:none}
  .pgmain .sec--pk{display:none}
}

/* ---- スライダーのSP/PC出し分けとピックアップ横スライド（2026-08-15） ---- */
.slider--sp{aspect-ratio:1/1}
.slider--pc{display:none}
@media(min-width:960px){
  .slider--sp{display:none}
  .slider--pc{display:block;aspect-ratio:16/5.4}
}
/* ピックアップ＝横スライド（スマホ）。指で払って次のバナーへ */
.pkrow{display:grid;grid-auto-flow:column;grid-auto-columns:80%;gap:12px;
  overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;padding-bottom:4px}
.pkrow::-webkit-scrollbar{display:none}
.pkrow .cpbn--s{scroll-snap-align:start}
@media(min-width:700px){
  .pkrow{grid-auto-flow:row;grid-template-columns:1fr 1fr 1fr;overflow:visible}
}

/* トップは1カラム（トレファク本体トップと同じ／2026-08-15） */
@media(min-width:960px){
  .pgcols--solo{grid-template-columns:minmax(0,1fr)}
  .pgcols--solo .pgmain #svcinfo{display:block}
  .pgcols--solo .pgmain>.hero{grid-column:1}
  .pgcols--solo .pgmain>#svcinfo{grid-column:2;grid-row:1}
  .pgcols--solo .pkrow{grid-auto-flow:row;grid-template-columns:1fr 1fr 1fr;overflow:visible}
}

/* ---- ご依頼例・ご感想を2×2の4枚カードに（トレファクの新入荷と同じ並び／2026-08-15） ---- */
.jirei,.koe{grid-template-columns:1fr 1fr}
.jirei li,.koe li{padding:10px 11px}
.jirei b,.koe b{font-size:12.5px;line-height:1.55;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.jirei__b,.koe span{font-size:11.5px;line-height:1.75;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.jirei__m{display:none}
.jirei__ph{aspect-ratio:4/3;margin-bottom:7px}
@media(min-width:700px){
  .jirei b,.koe b{font-size:14px}
  .jirei__b,.koe span{font-size:13px;-webkit-line-clamp:4}
}

/* ピックアップ4枚（PC 2×2）／2026-08-15 */
@media(min-width:700px){.pkrow{grid-template-columns:1fr 1fr}}
@media(min-width:960px){.pgcols--solo .pkrow{grid-template-columns:repeat(4,1fr)}}

/* 地区ページ：バナーとタブがpgmain内に来たときの余白（2026-08-15） */
.pgmain>.cpbn{margin:12px 0 12px}
.pgmain>.tabs{margin:0 0 4px}
@media(min-width:960px){
  .pgmain>.cpbn{grid-column:1/-1}
  .pgmain>.tabs{grid-column:1/-1}
  .pgmain>.hero{grid-row:auto}
  .pgmain>#svcinfo{grid-row:auto}
}

/* 郵便番号→住所の自動入力（2026-08-15） */
.form__hint{display:block;margin-top:4px;font-size:11px;color:var(--ink2)}
.form__addr{display:grid;grid-template-columns:110px 1fr;gap:8px}
.form label small{font-weight:400;color:var(--ink2);font-size:11px}

/* 住所の開閉と依頼内容チップ（2026-08-15） */
.form__addrwrap.is-closed{display:none}
.form__req{border:0;margin:0 0 14px;padding:0}
.form__req legend{font-size:13px;font-weight:700;margin-bottom:7px}
.form__req legend small{font-weight:400;color:var(--ink2);font-size:11px}
.form__chips{display:flex;flex-wrap:wrap;gap:7px}
.form__chips .chip input{position:absolute;opacity:0;width:1px;height:1px}
.form__chips .chip span{display:inline-block;padding:8px 13px;border:1px solid var(--line);
  border-radius:999px;font-size:13px;background:#fff;cursor:pointer;user-select:none}
.form__chips .chip input:checked+span{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:700}

/* ---- 品目の写真カード（2026-08-15「文字だけだと見にくい」） ---- */
.icards{list-style:none;margin:0 0 14px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.icards a{display:block;text-decoration:none;color:var(--ink);background:#fff;
  border:1px solid var(--line);border-radius:6px;overflow:hidden}
.icards img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
.icards b{display:block;padding:7px 6px;font-size:11.5px;text-align:center;line-height:1.4}
@media(min-width:700px){
  .icards{grid-template-columns:repeat(6,1fr)}
  .icards b{font-size:12.5px}
}

/* ---- 条件から探す（トレファクの店舗検索型／2026-08-15） ---- */
.asrch__t{margin:0 0 10px;font-size:14px;font-weight:700;color:var(--blue-d)}
.asrch__f{display:block;margin-bottom:10px}
.asrch__f span{display:block;margin-bottom:5px;font-size:12px;color:var(--ink2)}
.asrch__f select{width:100%;height:48px;padding:0 12px;font-size:15px;background:#fff;
  border:1px solid var(--line);border-radius:4px;color:var(--ink)}
.asrch__go{display:flex;align-items:center;justify-content:center;gap:8px;width:min(320px,100%);
  margin:14px auto 0;padding:13px;background:var(--blue);color:#fff;border:0;border-radius:4px;
  font-size:15px;font-weight:700;cursor:pointer}
.asrch__go svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:2}

/* ナビは2行に折り返してよい（2026-08-15「回収・片付け・引越し」が切れるため） */
.nav__in a{white-space:normal;line-height:1.3;display:flex;align-items:center;
  justify-content:center;min-height:46px;padding:5px 3px}

/* タブも2行に折り返してよい（2026-08-15） */
.tabs a{white-space:normal;line-height:1.3}

/* ピックアップ見出しとバナーの間隔（2026-08-15「詰めすぎ」） */
.side__h--pk{margin:0 0 14px}
.pgside .cpbn--s{margin:0 0 18px}
.secbar{margin-bottom:16px}

/* タブ4つを同じ幅に（2026-08-15「スマホで崩れている」） */
.tabs{overflow-x:visible}
.tabs a{flex:1 1 0;min-width:0;padding:8px 4px;display:flex;align-items:center;
  justify-content:center;text-align:center;min-height:46px}

/* ---- 送信完了（静的・2026-08-15） ---- */
.thx{background:#fff;border:1px solid var(--line);border-radius:8px;padding:26px 18px;text-align:center}
.thx__ok{display:block;width:54px;height:54px;line-height:54px;margin:0 auto 12px;
  background:var(--blue);color:#fff;border-radius:50%;font-size:26px}
.thx__t{font-size:21px;color:var(--blue-d);margin:0 0 12px}
.thx__svc{margin:0 0 10px;padding:9px;background:#EAF6EF;border-radius:4px;font-size:14px}
.thx__p{font-size:14px;line-height:2;margin:0 0 12px}
.thx__note{margin:0 0 14px;padding:12px;background:var(--gray);border-radius:4px;
  font-size:12.5px;line-height:1.9;text-align:left;color:var(--ink2)}

/* ---- 引越し・遺品整理ページの作り込み（2026-08-15） ---- */
.merit3{display:grid;gap:14px}
.merit3__i{background:#fff;border:2px solid #DCEBF5;border-radius:10px;padding:20px 16px;text-align:center}
.merit3__im{display:block;width:min(180px,55%);height:auto;margin:0 auto 10px;border-radius:8px}
.merit3__im--ph{width:100%;aspect-ratio:4/3;object-fit:cover}
.merit3__i h3{margin:0 0 8px;font-size:16px;color:var(--blue-d)}
.merit3__i p{margin:0;font-size:13px;line-height:1.95;color:var(--ink2);text-align:left}
.fsteps--5{grid-template-columns:1fr}
.plan__sc{overflow-x:auto}
.plan{border-collapse:collapse;width:100%;min-width:480px;background:#fff}
.plan th,.plan td{border:1px solid var(--line);padding:10px 8px;font-size:13px;text-align:center}
.plan tr:first-child th{background:var(--blue);color:#fff}
.plan tr th:first-child{background:var(--gray);text-align:left;font-size:12.5px}
.plan td.is-y{color:var(--blue-d);font-weight:700;background:#EAF4FB}
.item4{display:grid;gap:12px}
.item4__i{background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.item4__im{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.item4__i h3{margin:10px 12px 4px;font-size:15px;color:var(--blue-d)}
.item4__i p{margin:0 12px 12px;font-size:12.5px;line-height:1.9;color:var(--ink2)}
.omoi{text-align:center;padding:8px 0}
.omoi__c{font-size:20px;font-weight:700;line-height:1.7;color:var(--blue-d);margin:14px 0 10px}
.omoi__p{max-width:620px;margin:0 auto;font-size:14px;line-height:2;color:var(--ink2);text-align:left}
@media(min-width:700px){
  .merit3{grid-template-columns:1fr 1fr 1fr}
  .fsteps--5{grid-template-columns:repeat(5,1fr)}
  .item4{grid-template-columns:1fr 1fr}
  .omoi__c{font-size:24px}
}

/* ---- ご依頼例・ご感想カードのタップ展開（2026-08-15 指摘「クリックできない」） ---- */
.jopen{cursor:pointer;-webkit-tap-highlight-color:rgba(8,120,194,.12)}
.jopen:hover{border-color:var(--blue)}
.jopen:active{background:#f2f8fc}
.jirei .jirei__more,.koe .jirei__more{display:block;margin-top:8px;font-size:12px;line-height:1.4;
  font-weight:700;color:var(--blue);overflow:visible;-webkit-line-clamp:none}
.jm{position:fixed;inset:0;z-index:70;display:none}
.jm.is-open{display:block}
.jm__bg{position:absolute;inset:0;background:rgba(20,30,36,.55)}
.jm__box{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(560px,calc(100% - 22px));max-height:86vh;overflow:auto;background:#fff;
  border-radius:8px;-webkit-overflow-scrolling:touch}
.jm__x{position:absolute;top:8px;right:8px;width:36px;height:36px;border:none;border-radius:50%;
  background:rgba(20,30,36,.6);color:#fff;font-size:20px;line-height:1;cursor:pointer;z-index:2}
.jm__ph{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
.jm__in{padding:14px 16px 18px}
.jm__tag{display:inline-block;margin-bottom:8px;padding:2px 8px;border-radius:2px;
  font-size:11px;font-weight:700;color:#fff;background:var(--blue)}
.jm__t{margin:0 0 8px;font-size:16px;line-height:1.6;font-weight:700}
.jm__b{margin:0;font-size:13.5px;line-height:2;color:var(--ink2)}
.jm__m{margin:10px 0 0;padding-top:9px;border-top:1px dashed var(--line);
  font-size:12.5px;color:var(--ink2)}
.jm__cta{display:grid;gap:8px;margin-top:14px}

/* ---- 実際の買取実績（契約書アプリの実データ／2026-08-16） ---- */
.scse{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.scse li{background:#fff;border:1px solid var(--line);border-radius:4px;padding:10px 11px}
.scse__ph{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:contain;background:#fff;
  border:1px solid var(--line);border-radius:4px;margin-bottom:7px}
.scse b{display:block;font-size:13px;line-height:1.55;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.scse__pr{display:block;margin-top:4px;font-size:16px;font-weight:700;color:#c9171e}
.scse__m{display:block;margin-top:3px;font-size:11.5px;color:var(--ink2)}
@media(min-width:700px){.scse{grid-template-columns:repeat(4,1fr)}.scse b{font-size:14px}}

.scse__d{display:block;margin-top:3px;font-size:12px;color:var(--ink2)}

/* 仕入れ実績の個別ページ（2026-08-16） */
.scse__a{display:block;color:inherit;text-decoration:none}
.scse__more{display:inline-block;margin-top:4px;font-size:12px;color:#0a7d46;font-weight:700}
.scse__ph--pg{max-width:420px;margin:0 auto 14px;border:1px solid var(--line);border-radius:6px}
.scse__fig{margin:0 0 14px}
.scse__fig img{display:block;width:100%;max-width:560px;height:auto;margin:0 auto;border:1px solid var(--line);border-radius:6px}
.scse__fig figcaption{max-width:560px;margin:5px auto 0;font-size:12.5px;color:var(--ink2);text-align:center}

/* /sell/型の見た目強化（2026-08-17）：カード型ボタン・○×表・ピックアップ */
.tcards{list-style:none;margin:14px 0;padding:0;display:grid;gap:12px}
@media(min-width:700px){.tcards{grid-template-columns:repeat(3,1fr)}}
.tcards a{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);
 border-radius:14px;padding:16px 14px;text-decoration:none;color:inherit;
 box-shadow:0 2px 10px rgba(16,50,110,.07);transition:transform .15s, box-shadow .15s;position:relative}
.tcards a:active{transform:scale(.98)}
.tcards a::after{content:"›";position:absolute;right:14px;top:50%;transform:translateY(-50%);
 font-size:20px;font-weight:800;color:#0a7d46}
.tcards__ic{font-size:34px;line-height:1;flex:0 0 auto}
.tcards b{display:block;font-size:15.5px}
.tcards span{display:block;font-size:12px;color:var(--ink2);margin-top:2px}
.tcards--blue a{border-top:3px solid #1565c0}
.tcards--green a{border-top:3px solid #0a7d46}
.tcards--orange a{border-top:3px solid #f08300}
.mtx{width:100%;border-collapse:collapse;margin:12px 0;background:#fff;font-size:13px}
.mtx th{background:#8a8f98;color:#fff;font-weight:700;padding:9px 6px;text-align:center}
.mtx td{border-bottom:1px solid var(--line);padding:8px 6px;text-align:center;vertical-align:middle}
.mtx td:first-child{text-align:left}
.mtx__it{display:flex;align-items:center;gap:8px}
.mtx__it img{width:44px;height:44px;border-radius:50%;object-fit:contain;background:#f4f5f7;border:1px solid var(--line)}
.mtx__o{color:#c9171e;font-size:19px;font-weight:800}
.mtx__x{color:#666;font-size:16px;font-weight:800}
.pick{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
@media(min-width:700px){.pick{grid-template-columns:repeat(4,1fr)}}
.pick a{display:flex;align-items:center;gap:10px;background:linear-gradient(135deg,#0a7d46,#0d9a56);color:#fff;border-radius:12px;
 padding:12px;text-decoration:none;font-weight:800;font-size:13.5px;box-shadow:0 2px 10px rgba(10,125,70,.25)}
.pick a img{width:48px;height:48px;border-radius:10px;object-fit:contain;background:#fff;flex:0 0 auto}
.pick a small{display:block;font-weight:600;font-size:11px;opacity:.9;margin-top:3px}
.pick a.pick--or{background:linear-gradient(135deg,#f08300,#f5a623);box-shadow:0 2px 10px rgba(240,131,0,.25)}
.pick a.pick--bl{background:linear-gradient(135deg,#1565c0,#1e88e5);box-shadow:0 2px 10px rgba(21,101,192,.25)}
.guide__hero{display:block;width:100%;height:auto;border-radius:14px;margin:0 0 14px;
 box-shadow:0 4px 18px rgba(16,50,110,.12)}
.pplband{position:relative;margin:14px 0}
.pplband img{display:block;width:100%;height:auto;border-radius:14px}
.pplband figcaption{font-size:11.5px;color:var(--ink2);margin-top:4px;text-align:right}

/* 提携ページの図解（2026-08-17） */
.ck{list-style:none;margin:12px 0;padding:0;display:grid;gap:8px}
.ck li{background:#fff;border:1px solid var(--line);border-left:4px solid #f08300;border-radius:8px;
 padding:10px 12px;font-size:13.5px;font-weight:700}
.ck li::before{content:"✔";color:#f08300;margin-right:8px}
.coopflow{display:grid;gap:6px;margin:14px 0;text-align:center}
@media(min-width:700px){.coopflow{grid-template-columns:1fr auto 1fr auto 1fr;align-items:center}}
.coopflow__b{background:#fff;border:2px solid #0a7d46;border-radius:12px;padding:12px 10px}
.coopflow__b b{display:block;font-size:14.5px;color:#0a7d46}
.coopflow__b span{display:block;font-size:12px;color:var(--ink2);margin-top:3px}
.coopflow__a{font-size:20px;font-weight:800;color:#0a7d46}
@media(max-width:699px){.coopflow__a{transform:rotate(90deg)}}

/* ---- uru磨き込み（2026-08-16）：例カード・もっと見る・○×表 ---- */
.scse li{border-radius:12px;box-shadow:0 1px 4px rgba(15,40,30,.05);transition:transform .16s,box-shadow .16s}
@media(hover:hover){.scse li:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(15,40,30,.13)}}
.scse__ph{border-radius:8px}
.h3__ct{display:inline-block;margin-left:8px;padding:2px 10px;border-radius:999px;background:#eefbf3;color:#0a7d46;font-size:12px;font-weight:700;vertical-align:2px}
.reix .scse__d{display:inline-block;margin-top:6px;padding:2px 9px;border-radius:999px;background:#f1f6f3;color:#0a7d46;font-size:11px;font-weight:700}
.reix .reix__hid{display:none}
.reix.reix--open .reix__hid{display:block}
.morebtn{display:block;width:100%;max-width:420px;margin:16px auto 4px;padding:13px 16px;background:#fff;color:#0a7d46;border:2px solid #0a7d46;border-radius:999px;font-size:14px;font-weight:700;cursor:pointer;box-shadow:0 2px 8px rgba(10,125,70,.12);transition:background .15s,transform .12s}
.morebtn::after{content:" ▼";font-size:11px}
.morebtn:hover{background:#eefbf3}
.morebtn:active{transform:scale(.97)}
.mtx th{background:linear-gradient(135deg,#0a7d46,#0d9a56)}
.mtx th:first-child{border-radius:10px 0 0 0}
.mtx th:last-child{border-radius:0 10px 0 0}
.mtx tr:nth-child(even) td{background:#f7faf8}
.mtx__it img{width:52px;height:52px;border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.12)}

/* ---- 買取例カードのタップ拡大（2026-08-16 ユーザー指摘「ひらかないよ」） ---- */
.scse>li{position:relative}
.scse>li:not(:has(a)){cursor:zoom-in}
.scse>li:not(:has(a))::after{content:"🔍";position:absolute;top:8px;right:8px;font-size:13px;opacity:.5}
.jm__ph--sq{aspect-ratio:1/1;object-fit:contain;background:#fff;max-height:300px;width:auto;max-width:100%;margin:0 auto}

/* ---- 高価買取・人気商品TOP10（2026-08-16） ---- */
.scse--nk .scse__a{position:relative;display:block}
.nk__rank{position:absolute;top:-6px;left:-6px;z-index:1;width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#0a7d46,#0d9a56);color:#fff;font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(10,125,70,.3)}
.scse--nk li:nth-child(1) .nk__rank,.scse--nk li:nth-child(2) .nk__rank,.scse--nk li:nth-child(3) .nk__rank{background:linear-gradient(135deg,#c9971a,#e6b93a)}
.nk__hero{display:block;width:100%;max-width:320px;height:auto;margin:0 auto 12px;border-radius:14px;border:1px solid var(--line);background:#fff}
.nk__meta{text-align:center;font-size:12.5px;margin:-4px 0 8px}
.nk__meta,.h3__ct{color:#0a7d46}
.nk__meta{display:block}

/* ---- 顧客紹介パートナー（BtoB刷新・2026-08-16） ---- */
.pnhero{background:#fff;padding:26px 0 30px;border-bottom:1px solid var(--line)}
.pnhero__g{display:grid;gap:18px}
@media(min-width:900px){.pnhero__g{grid-template-columns:1.02fr .98fr;align-items:center;gap:34px}.pnhero{padding:44px 0 48px}}
.pnhero__eb{display:inline-block;background:#eefbf3;color:#0a7d46;font-weight:700;font-size:12.5px;border-radius:999px;padding:4px 12px;margin:0 0 10px}
.pnhero__h1{font-size:25px;line-height:1.42;margin:0 0 10px}
@media(min-width:900px){.pnhero__h1{font-size:33px}}
.pnhero__lead{font-size:14.5px;color:#333;line-height:1.9;margin:0 0 14px}
.pnhero__img{display:block;width:100%;height:auto;border-radius:16px;box-shadow:0 10px 30px rgba(15,40,30,.12)}
.pnck{list-style:none;margin:0;padding:0;display:grid;gap:10px}
@media(min-width:700px){.pnck{grid-template-columns:1fr 1fr}}
.pnck li{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:12px;align-items:center}
.pnck__ic{grid-row:1/3;font-size:26px}
.pnck b{font-size:14px}
.pnck li>span:last-child{font-size:12px;color:#0a7d46;font-weight:700}
.pnba{display:grid;gap:10px;align-items:stretch}
@media(min-width:700px){.pnba{grid-template-columns:1fr auto 1fr}}
.pnba__b{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.pnba__t{font-weight:800;font-size:14px;margin:0 0 8px}
.pnba__t--x{color:#888}.pnba__t--o{color:#0a7d46}
.pnba__b ul{margin:0;padding-left:18px;font-size:13.5px;line-height:2}
.pnba__a{align-self:center;text-align:center;font-size:26px;font-weight:800;color:#0a7d46}
@media(max-width:699px){.pnba__a{transform:rotate(90deg)}}
.pnitems{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.pnitems li{background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 14px;font-size:13.5px;font-weight:600}
.pncards{display:grid;gap:14px}
@media(min-width:700px){.pncards{grid-template-columns:1fr 1fr}}
.pncards__c{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 1px 5px rgba(15,40,30,.05)}
.pncards__c .pn__img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.pncards__in{padding:12px 15px 15px}
.pncards__who{font-size:12px;color:#0a7d46;font-weight:800;margin:0 0 2px}
.pncards__in .h3{margin:0 0 6px}
.pn__big{display:block;width:100%;height:auto;border-radius:16px;margin:6px 0 14px;box-shadow:0 8px 26px rgba(15,40,30,.1)}
.pn2col{display:grid;gap:16px;align-items:center}
@media(min-width:900px){.pn2col{grid-template-columns:1fr 1fr;gap:30px}}
.pn2col .pn__img{display:block;width:100%;height:auto;border-radius:14px}
.pncase{display:grid;gap:12px}
@media(min-width:700px){.pncase{grid-template-columns:1fr 1fr}}
.pncase__c{background:#f6faf7;border:1px solid #dcebe1;border-radius:14px;padding:14px 16px}
.pncase__t{font-weight:800;margin:0 0 6px}
.pncase__f{font-size:13.5px;line-height:2;margin:0;color:#333}
.pnok{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.pnok li{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;font-size:13.5px}

/* ---- 回収・片付けリデザイン（2026-08-16） ---- */
.kz__yasu{font-size:13px;color:#0a7d46;font-weight:700;background:#eefbf3;border-radius:10px;padding:9px 13px;margin:10px 0 8px}
.kz__zero{list-style:none;display:flex;gap:8px;margin:0 0 6px;padding:0}
.kz__zero li{background:#fff;border:2px solid #0a7d46;color:#0a7d46;border-radius:999px;padding:7px 13px;font-size:13px;font-weight:700}
.kz__zero b{font-size:15px;margin-left:2px}
.kz__stress{text-align:center;font-size:15px;font-weight:800;color:#0a7d46;background:#eefbf3;border-radius:12px;padding:13px 16px;margin:16px auto 0;max-width:640px}
.kz__stress--soft{font-weight:700;font-size:13.5px;margin-bottom:14px}
.kz__law{background:#f2f8f4;border:1px solid #d7e8dc;border-radius:14px;padding:16px 18px;margin-top:16px}
.kz__law-t{font-weight:800;color:#0a7d46;margin:0 0 8px;font-size:14.5px}
.kz__law p{margin:0 0 6px;font-size:13.5px;line-height:1.9}
.kz__area{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 14px;padding:0;max-width:520px;margin-inline:auto}
@media(min-width:700px){.kz__area{grid-template-columns:repeat(4,1fr)}}
.kz__area li{background:#fff;border:1px solid var(--line);border-radius:12px;text-align:center;padding:16px 8px;font-weight:800;font-size:15px}

/* ---- 提携・パートナー総合ハブ（2026-08-17） ---- */
.btn--ghost{background:#fff;border:2px solid #0a7d46}
.btn--ghost .btn__tx b{color:#0a7d46}
.btn--ghost .btn__tx small{color:#0a7d46;opacity:.75}
.ptc{display:grid;gap:14px}
@media(min-width:900px){.ptc{grid-template-columns:repeat(3,1fr)}}
.ptc__c{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 18px;box-shadow:0 1px 5px rgba(15,40,30,.05);display:flex;flex-direction:column}
.ptc__no{font-size:13px;font-weight:800;color:#0a7d46;letter-spacing:.1em;margin:0}
.ptc__ic{font-size:34px;margin:4px 0 6px}
.ptc__c .h3{margin:0 0 8px;line-height:1.5}
.ptc__em{font-size:13px;font-weight:700;color:#0a7d46;background:#eefbf3;border-radius:10px;padding:8px 12px;margin:4px 0 10px}
.ptc__cta{margin-top:auto;display:block;text-align:center;background:#0a7d46;color:#fff;font-weight:700;font-size:14px;border-radius:999px;padding:12px 14px;text-decoration:none}
.ptc__cta:active{transform:scale(.98)}
.ptmap{display:grid;gap:10px;align-items:center}
@media(min-width:800px){.ptmap{grid-template-columns:1fr auto auto auto 1fr}}
.ptmap__side{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.ptmap__t{font-weight:800;font-size:13.5px;color:#0a7d46;margin:0 0 8px}
.ptmap__side ul{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:6px}
.ptmap__side li{background:#f1f6f3;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600}
.ptmap__hub{background:linear-gradient(135deg,#0a7d46,#0d9a56);color:#fff;border-radius:16px;padding:18px 22px;text-align:center;box-shadow:0 6px 18px rgba(10,125,70,.25)}
.ptmap__hub b{display:block;font-size:16px}
.ptmap__hub span{font-size:11.5px;opacity:.9}
.ptmap__ar{text-align:center;font-size:20px;font-weight:800;color:#0a7d46;letter-spacing:-2px}
@media(max-width:799px){.ptmap__ar{transform:rotate(90deg)}}

/* ---- 3カード均等（引越し・宅配の結論カード）2026-08-17 ---- */
@media(min-width:700px){.pnck--3{grid-template-columns:repeat(3,1fr)}}

/* ---- pnckカードのリンク版（kaishuu 8カード→各ページ）2026-08-17 ---- */
.pnck__a{display:contents;color:inherit;text-decoration:none}
.pnck__a b::after{content:" ›";color:#0a7d46;font-weight:800}

/* ---- uru: フォームの査定方法ピッカー（2026-08-17） ---- */
.uru-pick{margin:0 0 14px;padding:12px;background:#f2f8f4;border:1px solid #d7e8dc;border-radius:12px}
.uru-pick__t{margin:0 0 8px;font-weight:800;font-size:13.5px;color:#0a7d46}
.uru-pick__b{display:block;margin:6px 0;padding:11px 14px;background:#fff;border:1.5px solid var(--line);border-radius:10px;font-size:14px;font-weight:700;color:#222;text-decoration:none}
.uru-pick__b--on{border-color:#0a7d46;box-shadow:0 0 0 2px rgba(10,125,70,.12)}

/* ---- 上に戻る（左下の三角・2026-08-17） ---- */
.totop{position:fixed;left:12px;bottom:92px;z-index:60;width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.95);color:#0a7d46;font-size:15px;font-weight:800;box-shadow:0 3px 12px rgba(0,0,0,.18);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .2s,transform .2s,visibility .2s;display:flex;align-items:center;justify-content:center}
.totop--on{opacity:1;visibility:visible;transform:none}
.totop:active{transform:scale(.94)}

/* ---- AIチャット（2026-08-17・サイト配色に統一） ---- */
.btn--ai{background:#fff;border:2px solid #0a7d46}
.btn--ai .btn__tx b, .btn--ai{color:#0a7d46}
.btn--ai small{color:#0a7d46;opacity:.8}
.aic{position:fixed;inset:0;z-index:1200}
.aic[hidden]{display:none}
.aic__bg{position:absolute;inset:0;background:rgba(15,30,22,.55)}
.aic__box{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:100%;max-width:480px;background:#fff;border-radius:18px 18px 0 0;display:flex;flex-direction:column;max-height:82vh;box-shadow:0 -8px 34px rgba(0,0,0,.28)}
@media(min-width:700px){.aic__box{bottom:auto;top:50%;transform:translate(-50%,-50%);border-radius:18px;max-height:600px;height:80vh}}
.aic__hd{background:linear-gradient(135deg,#0a7d46,#0d9a56);color:#fff;font-weight:800;font-size:15px;padding:13px 46px 13px 16px;border-radius:18px 18px 0 0;position:relative}
.aic__sub{font-size:11px;font-weight:600;opacity:.85;margin-left:8px}
.aic__x{position:absolute;top:8px;right:8px;width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.18);color:#fff;font-size:17px;cursor:pointer}
.aic__log{flex:1;overflow-y:auto;padding:14px;background:#f4f7f5;display:flex;flex-direction:column;gap:8px;min-height:200px}
.aic__m{max-width:85%;padding:10px 13px;border-radius:14px;font-size:14px;line-height:1.7;white-space:pre-wrap;word-break:break-word}
.aic__m--bot{background:#fff;border:1px solid var(--line);align-self:flex-start;border-bottom-left-radius:4px}
.aic__m--user{background:#0a7d46;color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.aic__in{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line);background:#fff}
.aic__in input{flex:1;border:1.5px solid var(--line);border-radius:999px;padding:11px 15px;font-size:16px}
.aic__in input:focus{outline:none;border-color:#0a7d46}
.aic__in button{border:0;border-radius:999px;background:#0a7d46;color:#fff;font-weight:800;font-size:14px;padding:0 20px;cursor:pointer}
.aic__note{margin:0;padding:7px 14px 12px;font-size:11px;color:#888;background:#fff;border-radius:0 0 18px 18px}

/* ---- pnckカードの3Dアイコン（2026-08-17） ---- */
.pnck__im{grid-row:1/3;width:46px;height:46px;object-fit:contain}

/* ---- 画面外セクションの描画スキップ（スマホ速度・2026-08-17） ---- */
/* 最初の4セクションは通常描画（推定高さ→実高さの置換がCLSになるため） */
.sec:nth-of-type(n+5){content-visibility:auto;contain-intrinsic-size:auto 700px}

/* ---- 3Dアイコンのサイズ統一（tcards・2026-08-17） ---- */
img.tcards__ic{width:46px;height:46px;object-fit:contain;flex:0 0 auto}

/* ---- 人気商品の記事型ページ（2026-08-17 1万字化） ---- */
.toc{border:1px solid var(--line);border-radius:6px;background:#fff;padding:12px 14px;margin:14px 0 0}
.toc p{margin:0 0 6px;font-weight:700;font-size:13.5px}
.toc ol{margin:0;padding-left:1.4em;font-size:13.5px}
.toc a{text-decoration:none}
@media(min-width:768px){.toc ol{columns:2;column-gap:22px}}
.nksb{width:100%;border-collapse:collapse;margin:12px 0 0;background:#fff}
.nksb th,.nksb td{border:1px solid var(--line);padding:10px 12px;font-size:14px;text-align:left}
.nksb th{background:#f0f7f0;font-weight:700;width:46%}
.nksb td b{color:#c7511f;font-size:15px}
/* 3列の一覧表（市区町村・読み・団体コード）。2列用の th 幅46%を打ち消す */
.nksb--code th,.nksb--code td{width:auto;font-size:13.5px;padding:7px 10px}
.nksb--code td:last-child{font-variant-numeric:tabular-nums;white-space:nowrap}
.nksb--wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:12px 0 0}
.nksb--wrap .nksb{margin:0}
.nkfz{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 0;padding:0}
.nkfz li{border:1px solid var(--line);border-radius:99px;padding:6px 14px;font-size:13.5px;background:#fff}

/* 地区の店舗型タブ（2026-08-17・2行に折り返してよい） */
.tabs--w{flex-wrap:wrap;overflow-x:visible}


/* 全国版の上に出す FC加盟店募集の帯（2026-08-18） */
.fcbar{background:linear-gradient(90deg,#0b5c34,#127a46);color:#fff}
.fcbar__in{display:flex;align-items:center;gap:10px;justify-content:space-between;
  padding:10px 0;flex-wrap:wrap}
.fcbar__tx b{display:block;font-size:14px}
.fcbar__tx span{display:block;font-size:12px;opacity:.92;line-height:1.6}
.fcbar__btn{background:#fff;color:#0b5c34;border-radius:999px;padding:9px 18px;
  font-size:13px;font-weight:700;text-decoration:none;white-space:nowrap}
@media(max-width:719px){.fcbar__in{gap:8px}.fcbar__btn{width:100%;text-align:center}}

/* 加盟店が決まっている市区町村の帯（2026-08-19）。募集中はオレンジ系、
   決まっている地域は緑系にして、ひと目で見分けられるようにする。 */
.fcbar--ok{background:#fff;color:#0b5c34;border-bottom:2px solid #0b5c34}
.fcbar--ok .fcbar__tx span{opacity:.85}
.fcbar--ok .fcbar__btn{background:#0b5c34;color:#fff}

/* 中古の販売価格データ（/a/uriage-rei/・2026-08-21）。
   実データの金額をカードと表で出す。買取価格ではないので、赤（買取実績）とは
   別の色にして、必ず「査定への窓口」を下に置く。 */
.uz__pr{display:block;margin-top:5px;font-size:15px;font-weight:800;color:#0a7d46}
.uz__sub{display:block;margin-top:2px;font-size:11.5px;color:var(--ink2)}
.uz__tw{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:12px 0}
.uz__tw .mtx{min-width:520px;margin:0}
.uz__rt{color:#0a7d46;font-size:15px}
.uz__cta{margin:14px 0 0;padding:14px;border:2px solid #0a7d46;border-radius:12px;background:#f4fbf7}
.uz__ctat{margin:0;font-size:15px;font-weight:800;color:#0b5c34}
.uz__ctat b{color:#c9171e}
.uz__ctad{margin:6px 0 10px;font-size:13px;line-height:1.85;color:var(--ink2)}
.uz__btns{display:grid;gap:8px}
.uz__btn{display:block;text-align:center;text-decoration:none;border-radius:10px;
  padding:12px 10px;font-size:15px;font-weight:800;line-height:1.4}
.uz__btn small{display:block;font-size:11.5px;font-weight:600;opacity:.92;margin-top:2px}
.uz__btn b{display:block;font-size:19px;letter-spacing:.02em}
.uz__btn--tel{background:#f08300;color:#fff}
.uz__btn--form{background:#0a7d46;color:#fff}
@media(min-width:720px){.uz__btns{grid-template-columns:1fr 1fr}}

/* 販売価格の検索窓（2026-08-21）。入力欄の文字は16px以上にする
   （iPhoneは15px以下だと勝手に拡大され、レイアウトが崩れる）。 */
.uzs{margin:12px 0 4px;padding:12px;background:#fff;border:2px solid #0a7d46;border-radius:12px}
.uzs__lb{display:block;font-size:13.5px;font-weight:800;color:#0b5c34;margin:0 0 6px}
.uzs__row{display:flex;gap:8px}
.uzs__in{flex:1;min-width:0;font-size:16px;padding:11px 12px;border:1px solid var(--line);
  border-radius:10px;background:#fff;color:var(--ink)}
.uzs__in:focus{outline:2px solid #0a7d46;outline-offset:1px}
.uzs__btn{flex:0 0 auto;background:#0a7d46;color:#fff;border:0;border-radius:10px;
  padding:11px 16px;font-size:14.5px;font-weight:800;cursor:pointer}
.uzs__hint{margin:7px 0 0;font-size:12px;line-height:1.7;color:var(--ink2)}
.uzs__out{margin-top:10px}
.uzr{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:8px}
.uzr__a{display:flex;gap:10px;align-items:center;background:#f8faf9;border:1px solid var(--line);
  border-radius:10px;padding:8px;text-decoration:none;color:inherit}
.uzr__ph{flex:0 0 auto;width:64px;height:64px;object-fit:contain;background:#fff;
  border:1px solid var(--line);border-radius:8px}
.uzr__tx{min-width:0}
.uzr__tx b{display:block;font-size:13.5px;line-height:1.5}
.uzr__sp{display:block;font-size:12px;color:var(--ink2);margin-top:1px}
.uzr__pr{display:block;font-size:14.5px;font-weight:800;color:#0a7d46;margin-top:3px}
.uzr__sub{display:block;font-size:11.5px;color:var(--ink2)}
.uzr__msg{margin:6px 0;font-size:13px;line-height:1.8}

/* カードを押したときに出す「数字の詳細」（2026-08-21）。
   モーダルの中に入るので、表は横スクロールできるようにする。 */
.uz__more{display:block;margin-top:6px;font-size:12px;font-weight:700;color:#0a7d46}
.uzd{margin:10px 0 2px;text-align:left}
.uzd__load{margin:0;font-size:13px;color:var(--ink2)}
.uzd__hero{background:#f4fbf7;border:1px solid #cfe9dc;border-radius:12px;padding:12px}
.uzd__lb{margin:0;font-size:11.5px;color:var(--ink2);line-height:1.6}
.uzd__pr{margin:3px 0 0;font-size:22px;font-weight:800;color:#0a7d46;line-height:1.3}
.uzd__sub{margin:3px 0 0;font-size:12px;color:var(--ink2);line-height:1.7}
.uzd__h{margin:14px 0 2px;font-size:14px;font-weight:800;color:#0b5c34}
.uzd__tw{overflow-x:auto;-webkit-overflow-scrolling:touch}
.uzd__tw .mtx{min-width:420px;margin:6px 0 0;font-size:12.5px}
.uzd__tw .mtx th,.uzd__tw .mtx td{padding:7px 6px}
.uzd__more{margin:14px 0 0;font-size:14px;font-weight:700}
.uzd__note{margin:8px 0 0;font-size:11.5px;color:var(--ink2);line-height:1.75}

/* 宅配買取のロゴと説明（対応エリア・2026-08-22） */
.tkl{display:grid;grid-template-columns:1fr;gap:14px;align-items:center;margin:0 0 18px}
.tkl__im{display:block;width:180px;max-width:60%;height:auto;margin:0 auto}
.tkl__tx .p{margin:0 0 8px}
.areagrp{margin:14px 0 6px;font-size:15px}
.chips a small{font-size:11px;opacity:.7;margin-left:4px}
@media(min-width:700px){.tkl{grid-template-columns:220px 1fr;gap:20px}
.tkl__im{width:220px;max-width:100%}}
