/* 分析: 各都道府県警察の公開データで比べる・当サイトに載った記録の内訳。色と文字は parts.css の変数。色だけで分けず、数字と文字も並べる */
:root { --ap-c0: #2F5D8A; --ap-c1: #B9631E; --ap-c2: #3F7F5C; --ap-c3: #7A4F94; --ap-c4: #A5424A; --ap-c5: #4F6470; --ap-cx: #C7CED6; --ap-cp: #B9C1CB; }
.ap-card { margin-bottom: 8px; }
.ap-sample { margin: 0 0 12px; padding: 8px 12px; background: var(--cmt-surface); border-left: 4px solid var(--cmt-searching); font-size: 14px; font-weight: 700; color: var(--cmt-text); }
.ap-divider { margin: 28px 0 12px; font-size: var(--cmt-fs-xl); color: var(--cmt-navy); line-height: 1.4; padding-top: 16px; border-top: 2px solid var(--cmt-line); }

/* 条件（スマホでは縦に 1 列・押す所は 44px 以上） */
.ap-ctl { display: grid; gap: 12px; margin: 4px 0 12px; }
.ap-f { display: grid; gap: 4px; min-width: 0; }
.ap-f label, .ap-l { font-size: 12px; font-weight: 700; color: var(--cmt-text-sub); letter-spacing: .06em; }
.ap-f select { width: 100%; min-height: var(--cmt-touch); padding: 8px 10px; border: 1px solid var(--cmt-text-sub); background: var(--cmt-white); font: inherit; font-size: 16px; color: var(--cmt-text); border-radius: 0; }
.ap-f select:focus-visible { outline: 3px solid var(--cmt-car); outline-offset: 1px; }
.ap-f .an-seg { width: 100%; }
.ap-f .an-seg button { flex: 1 1 0; min-height: var(--cmt-touch); }
.ap-msg { margin: 8px 0; padding: 10px 12px; border-left: 4px solid var(--cmt-text-sub); background: var(--cmt-surface); font-size: 14px; line-height: 1.7; }
.ap-title { margin: 8px 0 4px; font-size: 15px; line-height: 1.6; }
.ap-title b { margin-right: 4px; }
.ap-title span { color: var(--cmt-text-sub); font-size: 13px; }
.ap-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 6px 0 10px; font-size: 13px; }
.ap-lg { display: inline-flex; align-items: center; gap: 6px; }
.ap-sw { display: inline-block; width: 12px; height: 12px; flex: none; }

/* 色 */
.ap-c0 { background: var(--ap-c0); color: #fff; } .ap-c1 { background: var(--ap-c1); color: #fff; } .ap-c2 { background: var(--ap-c2); color: #fff; }
.ap-c3 { background: var(--ap-c3); color: #fff; } .ap-c4 { background: var(--ap-c4); color: #fff; } .ap-c5 { background: var(--ap-c5); color: #fff; }
.ap-cx { background: var(--ap-cx); color: var(--cmt-text); } .ap-cp { background: var(--ap-cp); }

/* 年ごとの積み上げ（1 年 1 本） */
.ap-stack { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 10px; }
.ap-srow { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "y t" "b b"; gap: 4px 8px; align-items: baseline; }
.ap-sy { grid-area: y; font-weight: 700; font-size: 14px; }
.ap-st { grid-area: t; font-size: 13px; color: var(--cmt-text-sub); font-variant-numeric: tabular-nums; }
.ap-bar { grid-area: b; display: flex; height: 30px; background: var(--cmt-surface); overflow: hidden; }
.ap-seg { display: flex; align-items: center; justify-content: center; min-width: 2px; font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; overflow: hidden; white-space: nowrap; }
.ap-none { padding: 0 10px; line-height: 30px; font-size: 12px; color: var(--cmt-text-sub); }

/* 選んだ年と前の年（時間帯・月・警察署・市区町村・当サイトの内訳） */
.ap-rows { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 10px; }
.ap-r { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "n v" "b b"; gap: 2px 8px; align-items: baseline; }
.ap-rn { grid-area: n; font-size: 14px; font-weight: 700; overflow-wrap: anywhere; }
.ap-rv { grid-area: v; text-align: right; font-variant-numeric: tabular-nums; }
.ap-rv b { font-size: 15px; margin-right: 6px; }
.ap-rv small { font-size: 12px; color: var(--cmt-text-sub); }
.ap-rb { grid-area: b; display: grid; gap: 2px; min-width: 0; }
.ap-rf { display: block; height: 12px; background: var(--ap-c0); min-width: 1px; }
.ap-rf--site { background: var(--cmt-navy); }
.ap-rp { display: block; height: 5px; background: var(--ap-cp); }
.ap-rows--site .ap-rb:empty { display: none; }
.ap-foot { margin: 0 0 8px; font-size: 12px; color: var(--cmt-text-sub); }
.ap-t td.n, .ap-t th + th { text-align: right; font-variant-numeric: tabular-nums; }
.ap-t th, .ap-t td { white-space: nowrap; }
.ap-t td:first-child, .ap-t th:first-child { position: sticky; left: 0; background: var(--cmt-white); }
.ap-notes-ul { margin: 12px 0 0; padding-left: 1.2em; font-size: 12px; line-height: 1.8; color: var(--cmt-text-sub); }
.ap-sbseg { margin: 4px 0 10px; }

@media (min-width: 760px) {
  .ap-ctl { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
  .ap-f .an-seg { width: auto; }
  .ap-f .an-seg button { flex: 0 0 auto; }
  .ap-srow { grid-template-columns: 5em 1fr 8em; grid-template-areas: "y b t"; align-items: center; }
  .ap-st { text-align: right; }
  .ap-r { grid-template-columns: 12em 1fr 11em; grid-template-areas: "n b v"; align-items: center; }
}

/* 時間帯・月は行が多いので、スマホでも 1 行にまとめる（名前・棒・数） */
.ap-rows--ord { gap: 6px; }
.ap-rows--ord .ap-r { grid-template-columns: 3.8em 1fr 4.6em; grid-template-areas: "n b v"; align-items: center; gap: 0 8px; }
.ap-rows--ord .ap-rn { font-weight: 500; font-size: 13px; }
.ap-rows--ord .ap-rv small { display: none; }
.ap-rows--ord .ap-rv b { font-size: 13px; margin-right: 0; }
@media (min-width: 760px) { .ap-rows--ord .ap-r { grid-template-columns: 5em 1fr 8em; } .ap-rows--ord .ap-rv small { display: inline; } }

.ap-sumline { margin: 0 0 6px; font-size: 13px; color: var(--cmt-text-sub); font-variant-numeric: tabular-nums; }

/* 集計のファイルが無いとき（404）は、区切りごと隠す */
.an-card[hidden], .ap-divider[hidden], .ap-card[hidden], .st-index a[hidden] { display: none !important; }

.ap-more { margin: 0 0 12px; border: 1px solid var(--cmt-line); }
.ap-more summary { padding: 12px; min-height: var(--cmt-touch); cursor: pointer; font-size: 14px; font-weight: 700; color: var(--cmt-navy); }
.ap-more .ap-ctl { padding: 4px 12px 14px; }
.ap-more .cmt-btn { min-height: var(--cmt-touch); }
.ap-cond { margin: 0 0 6px; font-size: 13px; color: var(--cmt-text); }
.ap-f select:disabled { background: var(--cmt-surface); color: var(--cmt-text-sub); }

.ap-points { margin: 6px 0 10px; padding: 10px 12px; background: var(--cmt-surface); border-left: 4px solid var(--cmt-navy); }
.ap-points b { font-size: 12px; color: var(--cmt-text-sub); letter-spacing: .06em; }
.ap-points ul { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 4px; }
.ap-points li { font-size: 14px; line-height: 1.7; font-variant-numeric: tabular-nums; }

/* 曜日×時間帯（濃いほど件数が多い。数字は表にある） */
:root { --ap-h1: #E3ECF5; --ap-h2: #BCD0E4; --ap-h3: #8DAFD2; --ap-h4: #5885B7; --ap-h5: #2F5D8A; }
.ap-h0 { background: var(--cmt-surface); } .ap-h1 { background: var(--ap-h1); } .ap-h2 { background: var(--ap-h2); } .ap-h3 { background: var(--ap-h3); } .ap-h4 { background: var(--ap-h4); } .ap-h5 { background: var(--ap-h5); }
.ap-heat { display: grid; grid-template-columns: 2em repeat(24, minmax(0, 1fr)); gap: 1px; margin: 0 0 8px; }
.ap-hl { font-size: 12px; font-weight: 700; align-self: center; }
.ap-hh { font-size: 10px; color: var(--cmt-text-sub); text-align: left; overflow: visible; white-space: nowrap; }
.ap-hc { display: block; height: 26px; }
@media (min-width: 760px) { .ap-hc { height: 34px; } .ap-hh { font-size: 12px; } }

/* 分析ごとの別ページ（案の見本）: 左に分析の一覧・右に 1 つの分析 */
.as-sample { margin: 8px 0 16px; padding: 10px 12px; background: var(--cmt-surface); border-left: 4px solid var(--cmt-text-sub); font-size: 13px; line-height: 1.7; }
.as-split { display: block; }
.as-nav { display: none; }
.as-pick { display: grid; gap: 4px; margin: 0 0 16px; font-size: 13px; font-weight: 700; color: var(--cmt-text-sub); }
.as-pick select { min-height: 48px; padding: 0 12px; font: inherit; font-size: 16px; color: var(--cmt-text); background: #fff; border: 1px solid var(--cmt-text-sub); border-radius: 0; }
.as-head h1 { margin: 4px 0 8px; font-size: 28px; line-height: 1.3; color: var(--cmt-navy); }
.as-head p { margin: 0 0 16px; font-size: 15px; line-height: 1.8; max-width: 46em; word-break: auto-phrase; }
.ap-nb { display: inline-block; } /* 文の途中で折り返さず、次の文は行の頭から */
.as-more { margin: 24px 0 0; font-size: 14px; }
.as-soon { display: block; padding: 8px 0; color: var(--cmt-text-sub); font-size: 14px; }
.as-soon small { margin-left: 6px; font-size: 11px; }
[data-ap-single] .ap-f:has(> #ap-dim), [data-ap-dim] .ap-more { display: none; }
@media (min-width: 1080px) {
  .as-split { display: grid; grid-template-columns: 280px minmax(0, 1fr); column-gap: 48px; align-items: start; }
  .as-pick { display: none; }
  .as-nav { display: block; position: sticky; top: 84px; max-height: calc(100vh - 110px); overflow-y: auto; padding-right: 8px; }
  .as-nav-t { margin: 0 0 8px; font-size: 13px; font-weight: 700; letter-spacing: .08em; color: var(--cmt-text); }
  .as-group { margin-bottom: 16px; }
  .as-group h2 { margin: 0 0 4px; padding-left: 8px; border-left: 3px solid var(--cmt-navy); font-size: 13px; line-height: 1.5; color: var(--cmt-text); }
  .as-group ul { list-style: none; margin: 0; padding: 0; }
  .as-group a { display: block; padding: 8px 8px 8px 11px; font-size: 14px; color: var(--cmt-navy); text-decoration: none; border-bottom: 1px solid var(--cmt-line); }
  .as-group a[aria-current="page"] { background: var(--cmt-navy); color: #fff; font-weight: 700; }
  .as-group a:hover { background: var(--cmt-surface); }
  .as-group a[aria-current="page"]:hover { background: var(--cmt-navy); }
}

.as-wrap .ap-rows--ord .ap-r { grid-template-columns: 4.5em minmax(0, 1fr) 15em; }
.as-wrap .ap-rv { white-space: nowrap; }
@media (max-width: 759px) { .as-wrap .ap-rows--ord .ap-r { grid-template-columns: 4em minmax(0, 1fr) 6em; } }

/* 分析の入口（カードの一覧）と、警察庁の統計のページ（1 つの区画だけ出す） */
.as-hubhead h1 { margin: 4px 0 8px; font-size: 28px; color: var(--cmt-navy); line-height: 1.3; }
.as-hubhead p { margin: 0 0 8px; font-size: 15px; line-height: 1.8; max-width: 46em; }
.as-hubg { margin-top: 28px; }
.as-hubg h2 { margin: 0 0 12px; padding-left: 8px; border-left: 3px solid var(--cmt-navy); font-size: 17px; line-height: 1.5; color: var(--cmt-text); }
.as-hub { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 10px; }
.as-card { display: flex; flex-direction: column; gap: 4px; min-height: 84px; padding: 14px 16px; border: 1px solid var(--cmt-line); border-top: 4px solid var(--cmt-navy); background: var(--cmt-white); text-decoration: none; color: var(--cmt-text); }
.as-card b { font-size: 17px; line-height: 1.5; color: var(--cmt-navy); }
.as-card small { font-size: 13px; line-height: 1.7; color: var(--cmt-text-sub); }
.as-card:hover { border-color: var(--cmt-navy); background: var(--cmt-surface); }
.as-card:focus-visible { outline: 3px solid var(--cmt-car); outline-offset: 2px; }
@media (min-width: 760px) { .as-hub { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1080px) { .as-hub { grid-template-columns: repeat(3, minmax(0, 1fr)); } .as-hubg:nth-of-type(1) .as-hub { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.as-only[data-only="sec-pref"] .an-grid > section:not(#sec-pref),
.as-only[data-only="sec-trend"] .an-grid > section:not(#sec-trend),
.as-only[data-only="sec-model"] .an-grid > section:not(#sec-model) { display: none; }
.as-only .an-grid { display: block; }
.as-only .an-grid > section { max-width: none; }
.ap-sbseg, #sb-kind { display: flex; width: fit-content; max-width: 100%; }

/* 分析の入口: 区分の見出し（紺の帯・白い文字・大きく）と、カードの題（小さめ・黒）で、上下の関係が分かるように */
.as-hubg { margin-top: 36px; }
.as-hubg h2 { margin: 0 0 14px; padding: 10px 14px; border-left: 0; background: var(--cmt-navy); color: #fff; font-size: 20px; font-weight: 800; line-height: 1.4; letter-spacing: .02em; }
.as-card { border-top-width: 1px; background: var(--cmt-white); }
.as-card b { font-size: 16px; font-weight: 700; color: var(--cmt-text); }
.as-card small { font-size: 13px; }

/* 当サイトの記録: 期間（年を選ぶ→その年の月を選ぶ） */
.ap-period { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 10px 0 8px; }
.ap-period-l { font-size: 13px; font-weight: 700; color: var(--cmt-text-sub); }
.ap-period select { min-height: 44px; padding: 0 28px 0 12px; border: 1px solid var(--cmt-text-sub); background: var(--cmt-white); color: var(--cmt-text); font: inherit; font-size: 15px; border-radius: 0; }
.ap-period select:focus-visible { outline: 3px solid var(--cmt-car); outline-offset: 1px; }
.ap-period select[hidden] { display: none; }
.ap-period-h { flex-basis: 100%; font-size: 12px; color: var(--cmt-text-sub); }
/* 県警の公開データ: 10 件未満も含めた全部の表 */
.ap-all { margin-top: 12px; }
.ap-all summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; font-weight: 700; color: var(--cmt-navy); }
.ap-all .cmt-more { display: inline-block; margin-top: 8px; }

/* 都道府県別の認知件数（右の欄が無いページ）: 右の 340px を空けず、本文を広い幅で使う */
@media (min-width: 1080px) { .ld-grid.as-pref47 { grid-template-columns: minmax(0, 1fr); max-width: 880px; } }