/* エリア別の市場動向（T-246）。配色・角丸・影は towers.css のトークンを使う。 */
.market-drops{margin:0 0 clamp(40px,6vw,64px)}
.market-drops__intro{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:10px 24px;margin:-2px 0 18px}
.market-drops__intro p{max-width:760px;margin:0}
.market-drops__intro a{white-space:nowrap;font-size:.86rem}
.market-drops .home-drops__card{min-height:300px}
.market-drops .home-drops__card h3{margin:0 0 5px;color:#fff;font-size:.95rem;font-weight:700;line-height:1.65;text-shadow:0 2px 8px #0008}
.market-drops .home-drops__card h3 a{color:inherit;text-decoration:none}
.market-drops .home-drops__card h3 a:hover{color:#f5deab;text-decoration:underline}
@media(max-width:760px){.market-drops__intro{display:block}.market-drops__intro a{display:inline-block;margin-top:12px}.market-drops .home-drops__card{min-height:260px}}
.market-kind{margin-top:clamp(56px,7vw,88px)}
.market-kind__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px 24px}
.market-kind__meta{color:var(--text-3);font-size:.8rem;line-height:1.7}
/* 主要数値カード。値と単位が 1 行に収まる幅を確保し、標本数は注記の大きさに戻す
   （.figures dd は既定で明朝 2rem なので、そのままだと標本数まで見出し級になる）。 */
.market-kind .figures{grid-template-columns:repeat(auto-fit,minmax(224px,1fr))}
.market-kind .figures dd{font-size:1.6rem}
.market-kind .figures dd small{margin-left:.2em;font-family:var(--gothic);font-size:.82rem;color:var(--text-2)}
.market-kind .figures dd.note{margin-top:7px;font-family:var(--gothic);font-size:.76rem;line-height:1.6}
.market-periods{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0 0;padding:0;list-style:none}
.market-periods a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:9px 16px;border:1px solid var(--rule-2);border-radius:0;color:var(--text-2);font-size:.86rem;text-decoration:none}
.market-periods a:hover{background:var(--ground-2);color:var(--text)}
.market-periods__state{color:var(--text-3);font-size:.74rem;letter-spacing:.06em}
.market-periods a[data-unlocked="yes"]{border-color:var(--gold);color:var(--text)}
.market-periods a[data-unlocked="yes"] .market-periods__state{color:var(--gold-text)}
.market-period{margin-top:44px;padding-top:22px;border-top:1px solid var(--rule-2)}
.market-period__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 18px}
.market-period h4{margin:0}
.market-period__tolerance{color:var(--text-3);font-size:.76rem}
.market-state{display:inline-block;padding:2px 9px;border-radius:0;font-size:.74rem;letter-spacing:.06em;white-space:nowrap}
.market-state--accumulating{background:var(--ground-2);color:var(--text-3)}
.market-state--low_sample{background:var(--ground-2);color:var(--text-3)}
.market-state--ok{background:#eef1f7;color:var(--gold-text)}
.market-flow{margin:24px 0 0;padding:18px 22px;border:1px solid var(--rule-2);border-radius:0;background:var(--ground-2)}
.market-flow dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px 24px;margin:12px 0 0}
.market-flow dt{color:var(--text-3);font-size:.76rem;letter-spacing:.1em}
.market-flow dd{margin:4px 0 0;font-size:1.15rem}
/* 地域カード（T-393）：都市の画像と白地の数値欄を分ける。 */
.market-areas{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;margin:0 0 18px;padding:0;list-style:none}
.market-area-card{position:relative;display:flex;flex-direction:column;min-width:0;overflow:hidden;border:1px solid var(--rule-2);background:#fff;color:#202733;transition:border-color 180ms ease,box-shadow 180ms ease}
.market-area-card__visual{overflow:hidden;aspect-ratio:3/2;background:#e8eff2}
.market-area-card__bg{display:block;width:100%;height:100%;object-fit:cover;transition:transform 400ms ease}
.market-area-card__body{display:flex;flex:1;flex-direction:column;padding:22px}
.market-area-card h3{margin:0 0 20px;font-size:1.65rem;line-height:1.4}
.market-area-card__link{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 .35em;color:#18222f;text-decoration:none}
.market-area-card__link::after{content:"";position:absolute;inset:0;z-index:1}
.market-area-card__link:focus-visible{outline:none}
.market-area-card__link:focus-visible::after{outline:3px solid #876b29;outline-offset:-4px}
.market-area-card__more{font-family:var(--gothic);font-size:.78rem;font-weight:400;letter-spacing:.03em;color:#505b68}
.market-area-card__arrow{margin-left:auto;color:#876b29;font-family:var(--gothic);font-size:1.1rem}
.market-area-card__label{margin:0 0 12px;color:#505b68;font-size:.8rem}
.market-area-card__stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0 0 20px}
.market-area-card__stat+ .market-area-card__stat{border-left:1px solid #e1e4e7;padding-left:16px}
.market-area-card dt{margin:0 0 4px;color:#505b68;font-size:.85rem;font-weight:600}
.market-area-card dd{margin:0;font-size:.85rem;line-height:1.7}
.market-area-card__count{display:flex;align-items:baseline;gap:5px;white-space:nowrap;color:#18222f;font-size:clamp(1.6rem,2.5vw,2.1rem);font-weight:600;line-height:1.3}
.market-area-card__unit{font-size:.8rem;font-weight:400}
.market-area-card__meta{display:block;margin-top:8px;color:#505b68;font-size:.75rem;line-height:1.7}
.market-area-card__period{display:block;margin-top:8px;color:#364653;font-size:.75rem}
.market-area-card__pending{display:block;margin:6px 0;color:#505b68;font-size:.86rem}
.market-area-card__footer{position:relative;z-index:2;margin-top:auto;padding-top:12px;border-top:1px solid #e1e4e7}
.market-area-card__footer p{margin:0;font-size:.8rem}
.market-area-card__footer a{display:flex;align-items:center;gap:6px;min-height:44px;color:#364653;text-decoration-color:#97a1a9}
.market-area-card__footer a:hover{color:#71551b}
.market-area-card:hover{border-color:#9c8859;box-shadow:0 6px 20px rgba(24,34,47,.08)}
.market-area-card:hover .market-area-card__bg{transform:scale(1.025)}
@media (prefers-reduced-motion:reduce){.market-area-card,.market-area-card__bg{transition:none}.market-area-card:hover .market-area-card__bg{transform:none}}
@media (min-width:700px){.market-areas{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.market-areas{grid-template-columns:repeat(3,minmax(0,1fr))}}
.market-history{margin-top:clamp(44px,6vw,72px)}
.market-history h2{margin-bottom:10px}
.market-history__table{width:100%;min-width:0}
.market-history__table th,.market-history__table td{padding-inline:clamp(6px,2vw,14px)}
.trend-chart--comparison svg{min-width:0}
.trend-chart__legend{display:flex;flex-wrap:wrap;gap:8px 22px;margin:0 0 12px;padding:0;list-style:none;color:var(--text-2);font-size:.82rem}
.trend-chart__legend li{display:flex;align-items:center;gap:8px}
.trend-chart__legend svg{width:36px;min-width:0;max-width:none;height:8px;flex:none}
/* 地域の系列（T-392。T-512 で9地域）。色は地域に固定し、線種も変えて色だけに頼らない。
   色の組は色覚多様性の検査（隣接でない組も含む全組）を通したもの。 */
.trend-chart--comparison .trend-chart__line{stroke-width:2.5}
.trend-chart__line--tokyo{stroke:#2a78d6}
.trend-chart__point--tokyo{fill:#2a78d6}
.trend-chart__line--yokohama{stroke:#c98500;stroke-dasharray:9 4}
.trend-chart__point--yokohama{fill:#c98500}
.trend-chart__line--osaka{stroke:#008300;stroke-dasharray:2 4;stroke-linecap:round}
.trend-chart__point--osaka{fill:#008300}
.trend-chart__line--nagoya{stroke:#4a3aa7;stroke-dasharray:12 4 2 4}
.trend-chart__point--nagoya{fill:#4a3aa7}
.trend-chart__line--fukuoka{stroke:#d55181;stroke-dasharray:16 5}
.trend-chart__point--fukuoka{fill:#d55181}
/* T-512 で足した4市。既存5系列と色相・明るさ・線種のどれかが必ず違う組にしている。 */
/* 川崎・神戸・仙台・札幌: 取引事例の年次比較にだけ出る系列（T-512） */
.trend-chart__line--kawasaki{stroke:#00838f;stroke-dasharray:5 3}
.trend-chart__point--kawasaki{fill:#00838f}
.trend-chart__line--kobe{stroke:#b3401c;stroke-dasharray:14 3 2 3 2 3}
.trend-chart__point--kobe{fill:#b3401c}
.trend-chart__line--sendai{stroke:#6b7a00;stroke-dasharray:1 5;stroke-linecap:round}
.trend-chart__point--sendai{fill:#6b7a00}
.trend-chart__line--sapporo{stroke:#5f6b7a;stroke-dasharray:20 4 6 4}
.trend-chart__point--sapporo{fill:#5f6b7a}
.market-history__table td{white-space:nowrap}
/* 6列あるので tables.js がスマホ幅で縦積み（.t-stack）にする。block の表の中では
   caption が1文字幅に潰れるので、block に戻す。 */
@media (max-width:760px){
  .market-history__table.t-stack caption{display:block;padding:0 0 12px;text-align:left}
  /* 1年ぶんを「年」＋地域3列に収める。既定の縦積みは <br> のあるセルを全幅にするので、
     5地域だと1年が5段になり、10年で画面10枚ぶんを超える。 */
  table.market-history__table.t-stack tr{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 12px}
  table.market-history__table.t-stack tr>td[data-wide]{grid-column:auto}
  table.market-history__table.t-stack td .note{font-size:.72rem;line-height:1.5}
}
@media (max-width:640px){
  .market-kind__head{display:block}
}