/* 街カルテ エリアマッチング
   OMOKAGE R&C の規定カラーに準拠
     文字・デザイン背景（茶・キーカラー）: #561212
     ゴールド Web: #baa020 ／ 印刷: #efdc6f ／ 白黒: #c9c9c9
     白: #ffffff
   淡いトーンはすべて上記からの派生（アルファ）で作り、規定外の色は使わない。 */

.machi-wrap{
  --macc:#561212;        /* 茶（キーカラー：文字・デザイン背景） */
  --macc-2:#6e1b1b;      /* 茶ホバー */
  --macc-bg:#f6eeee;     /* 茶の淡い面 */
  --mgold:#baa020;       /* ゴールド（Web） */
  --mgold-soft:rgba(186,160,32,.45);
  --mgold-pale:rgba(186,160,32,.16);
  --mgold-d:#7d6b15;     /* 淡面上のゴールド文字 */
  --mgold-bg:#faf6e4;    /* ゴールドの淡い面 */
  --mtx:#561212;         /* 本文（規定：文字は茶） */
  --mmut:#8f6b6b;        /* 副次テキスト（茶の淡色） */
  --mbd:#e9dede;         /* 境界（茶の淡色） */
  --msf:#ffffff;         /* 白 */
  --msf1:#faf7f6;        /* 薄い面 */
  --mdg:#a3282f;
  --mdgbg:#fdeceb;
  --mrad:14px;

  max-width:720px;margin:0 auto;background:var(--msf);color:var(--mtx);
  border:1px solid var(--mbd);border-radius:var(--mrad);overflow:hidden;
  font-family:"Quicksand","Hiragino Kaku Gothic ProN","Noto Sans JP",-apple-system,BlinkMacSystemFont,sans-serif;
  line-height:1.7;
}
.machi-wrap *{box-sizing:border-box;}

/* ---- ヘッダー ---- */
.machi-hd{background:var(--macc);border-bottom:3px solid var(--mgold);padding:16px 20px;}
.machi-t{font-size:17px;font-weight:700;color:#fff;letter-spacing:.02em;}
.machi-s{font-size:11px;color:rgba(255,255,255,.72);letter-spacing:.04em;}

.machi-body{padding:20px;}
.machi-label{display:block;font-size:12px;font-weight:700;color:var(--mmut);letter-spacing:.06em;margin-bottom:6px;}
.machi-note{font-size:11px;color:var(--mmut);}

/* ---- 入力・ボタン ---- */
.machi-row{display:flex;gap:8px;}
.machi-wrap input[type=text]{flex:1;height:46px;padding:0 14px;font-size:16px;color:var(--mtx);
  background:var(--msf);border:1px solid var(--mbd);border-radius:10px;transition:border-color .15s,box-shadow .15s;}
.machi-wrap input[type=text]:focus{outline:none;border-color:var(--macc);box-shadow:0 0 0 3px var(--macc-bg);}
.machi-wrap select{background:var(--msf);color:var(--mtx);border:1px solid var(--mbd);border-radius:8px;height:34px;padding:0 8px;font-size:13px;}
.machi-wrap select:focus{outline:none;border-color:var(--macc);}
.machi-go{height:46px;padding:0 22px;font-size:15px;font-weight:700;letter-spacing:.04em;
  border:none;background:var(--macc);color:#fff;border-radius:10px;cursor:pointer;white-space:nowrap;
  transition:background .15s,transform .05s;}
.machi-go:hover{background:var(--macc-2);}
.machi-go:active{transform:translateY(1px);}
.machi-mini{height:34px;padding:0 14px;font-size:12px;font-weight:700;border:1px solid var(--macc);
  background:transparent;color:var(--macc);border-radius:8px;cursor:pointer;margin-left:6px;transition:background .15s,color .15s;}
.machi-mini:hover{background:var(--macc);color:#fff;}

/* ---- 認証（ゲート） ---- */
.machi-gate-lead{text-align:center;color:var(--mmut);font-size:13px;margin:0 0 16px;}
#machi-r-code{text-align:center;letter-spacing:.14em;font-family:"Quicksand",monospace;}

/* ---- 種別・残回数チップ ---- */
.machi-chip{display:inline-block;font-size:11px;font-weight:700;padding:4px 10px;border-radius:999px;
  background:var(--macc-bg);color:var(--macc);white-space:nowrap;}
.machi-chip-gold{background:var(--mgold-bg);color:var(--mgold-d);}

/* ---- 8軸フォーム ---- */
.machi-formbar{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:14px;}
.machi-pricebar{display:flex;align-items:center;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid var(--mbd);}
.machi-pricebar .machi-label{margin:0;white-space:nowrap;}
.machi-pricebar select{flex:1;height:40px;}
.machi-cta{text-align:center;margin-top:16px;}
.machi-resbar{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:14px;}
.machi-resbar strong{font-size:14px;}
.machi-resbtns{white-space:nowrap;}
.machi-axes{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.machi-axis{background:var(--msf);border:1px solid var(--mbd);border-radius:10px;padding:10px 12px;}
.machi-axis-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:2px;}
.machi-axis-n{font-size:13px;font-weight:700;}
.machi-axis-v{font-size:17px;font-weight:700;color:var(--macc);line-height:1;}
.machi-wrap input[type=range]{width:100%;height:26px;accent-color:var(--macc);cursor:pointer;}
.machi-imp{display:flex;align-items:center;gap:6px;margin-top:2px;}
.machi-imp span{font-size:10px;color:var(--mmut);white-space:nowrap;letter-spacing:.04em;}
.machi-imp select{flex:1;}

/* ---- ランキング ---- */
.machi-rrow{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--mbd);
  background:var(--msf);border-radius:12px;margin-bottom:8px;transition:border-color .15s,box-shadow .15s;}
.machi-rrow:hover{border-color:var(--macc);box-shadow:0 2px 10px rgba(86,18,18,.10);}
.machi-rrow .rk{flex:0 0 auto;width:52px;height:52px;border-radius:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;
  background:var(--msf1);color:var(--mmut);border:1px solid var(--mbd);}
.machi-rrow .rk b{font-size:20px;font-weight:700;}
.machi-rrow .rk i{font-size:9px;font-style:normal;margin-top:1px;}
/* 上位3位はゴールドの濃淡で階層をつける（規定色の派生のみ） */
.machi-rrow .rk-1{background:var(--mgold);border-color:var(--mgold);color:#fff;}
.machi-rrow .rk-2{background:var(--mgold-soft);border-color:rgba(186,160,32,.55);color:var(--macc);}
.machi-rrow .rk-3{background:var(--mgold-pale);border-color:rgba(186,160,32,.35);color:var(--macc);}
.machi-rname{font-size:14px;font-weight:700;}
.machi-rmeta{font-size:11px;color:var(--mmut);font-family:"Quicksand",monospace;white-space:nowrap;}
.machi-bar{height:6px;background:var(--msf1);border-radius:999px;margin-top:5px;overflow:hidden;}
.machi-bar>div{height:100%;background:var(--macc);border-radius:999px;}
.machi-rrow .rk-1 ~ div .machi-bar>div{background:var(--mgold);}
.machi-rlink{display:inline-block;margin-top:6px;font-size:11px;font-weight:700;color:var(--macc);text-decoration:none;}
.machi-rlink:hover{text-decoration:underline;}
.machi-rqr{flex:0 0 auto;width:56px;height:56px;line-height:0;padding:3px;background:#fff;border:1px solid var(--mbd);border-radius:8px;}
.machi-rqr img,.machi-rqr canvas{width:100%;height:100%;display:block;}
.machi-badge{display:inline-block;font-size:10px;font-weight:700;color:var(--mgold-d);background:var(--mgold-bg);
  border-radius:999px;padding:1px 7px;margin-right:5px;}

/* ---- 住所検索 ---- */
.machi-chead{font-size:12px;color:var(--mmut);margin:18px 0 8px;font-weight:700;}
.machi-clist{display:flex;flex-direction:column;gap:8px;}
.machi-citem{text-align:left;display:flex;align-items:center;gap:12px;padding:12px 14px;width:100%;
  border:1px solid var(--mbd);background:var(--msf);border-radius:12px;cursor:pointer;
  font-family:inherit;color:var(--mtx);transition:border-color .15s,box-shadow .15s,transform .05s;}
.machi-citem:hover{border-color:var(--macc);box-shadow:0 2px 10px rgba(86,18,18,.10);}
.machi-citem:active{transform:translateY(1px);}
.machi-citem.hit{border-color:var(--mgold);background:var(--mgold-bg);}
.machi-citem .nm{font-size:14px;font-weight:700;}
.machi-citem .ad{font-size:11px;color:var(--mmut);}
.machi-citem .cd{font-size:11px;color:var(--mmut);font-family:"Quicksand",monospace;margin-left:auto;white-space:nowrap;}
.machi-detail{margin-top:16px;}
.machi-card{border:1px solid var(--mbd);border-radius:12px;overflow:hidden;background:var(--msf);}
.machi-card .top{background:var(--macc);padding:12px 16px;display:flex;justify-content:space-between;
  align-items:center;color:#fff;font-size:14px;font-weight:700;border-bottom:2px solid var(--mgold);}
.machi-card .top span:last-child{font-family:"Quicksand",monospace;font-size:11px;color:var(--mgold);}
.machi-card .in{padding:16px;}
.machi-meta{font-size:12px;color:var(--mmut);margin-bottom:12px;}
.machi-flex{display:flex;gap:18px;align-items:center;flex-wrap:wrap;}
.machi-link{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--macc);text-decoration:none;margin-bottom:6px;}
.machi-link:hover{text-decoration:underline;}
.machi-url{font-size:10px;color:var(--mmut);word-break:break-all;}
.machi-qr{display:inline-block;padding:6px;background:#fff;border:1px solid var(--mbd);border-radius:8px;line-height:0;}
.machi-msg{padding:14px;border-radius:12px;font-size:13px;border:1px solid var(--mdg);background:var(--mdgbg);color:var(--mdg);}

/* ---- スマホ ---- */
@media screen and (max-width:600px){
  .machi-wrap{border-radius:0;border-left:none;border-right:none;}
  .machi-body{padding:16px 14px;}
  .machi-axes{grid-template-columns:1fr;gap:10px;}
  .machi-row{flex-wrap:wrap;}
  .machi-wrap input[type=text]{flex:1 1 100%;}
  .machi-go{width:100%;}
  .machi-rrow{gap:10px;padding:10px;}
  .machi-rrow .rk{width:44px;height:44px;}
  .machi-rrow .rk b{font-size:17px;}
  .machi-rqr{width:48px;height:48px;}
  .machi-rname{font-size:13px;}
  .machi-citem{padding:10px;gap:8px;}
  .machi-citem .cd{margin-left:0;}
  .machi-flex{gap:12px;}
}

/* ---- 印刷用ドキュメント ---- */
#machi-print-doc{background:#fff;color:#111;margin-top:10px;}
.machi-page{background:#fff;border:1px solid var(--mbd);border-radius:8px;padding:12px;}
.machi-page + .machi-page{margin-top:16px;}
.machi-print-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;
  border-bottom:2px solid #efdc6f;padding-bottom:4px;margin-bottom:8px;}
.machi-print-title{font-size:13px;font-weight:700;white-space:nowrap;color:#561212;}
.machi-print-sub{font-size:9px;color:#666;white-space:nowrap;}
.machi-print-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.machi-pcard{border:1px solid #ddd;border-radius:6px;padding:6px;}
.machi-pcard-h{line-height:1.25;}
.machi-pcard-rk{font-size:19px;font-weight:700;color:#561212;margin-right:4px;}
.machi-pcard-rk em{font-size:10px;font-style:normal;margin-left:1px;}
.machi-pcard-nm{font-size:11px;font-weight:700;}
.machi-pcard-cd{display:block;font-size:9px;color:#888;font-family:monospace;font-weight:400;}
.machi-pcard-b{display:flex;gap:6px;align-items:center;margin-top:2px;}
.machi-pcard-r{flex:1;min-width:0;text-align:center;}
.machi-pqr{display:inline-block;line-height:0;}
.machi-pcard-url{font-size:7px;color:#666;word-break:break-all;margin-top:2px;line-height:1.25;}
.machi-print-foot{text-align:right;font-size:9px;color:#555;margin-top:8px;padding-top:4px;border-top:1px solid #eee;}

@media print{
  /* margin:0 にすることでブラウザ既定の印刷ヘッダー/フッター（ページタイトル・日付・URL）を出さない。
     余白は .machi-page 側の padding で確保する。 */
  @page{size:A4;margin:0;}
  /* 印刷時は body 直下に移動した印刷ドキュメントだけを残す（通常フローなので複数ページに分割される） */
  body.machi-printing > *{display:none !important;}
  body.machi-printing > #machi-print-doc{display:block !important;}
  #machi-print-doc{margin:0;background:#fff;}
  .machi-noprint{display:none !important;}
  /* 1ページ＝10件。ページごとに表題と権利表記が入る */
  .machi-page{border:none;border-radius:0;padding:10mm 10mm 7mm;margin:0;page-break-after:always;break-after:page;}
  .machi-page:last-child{page-break-after:auto;break-after:auto;}
  .machi-page + .machi-page{margin-top:0;}
  .machi-pcard{break-inside:avoid;page-break-inside:avoid;border:1px solid #bbb;}
  a{color:#111 !important;text-decoration:none;}
  body{background:#fff !important;}
}