/*
 * /ranking-basis/（ランキングの根拠）専用。テンプレート page-acm-ranking-basis.php とセット。
 * 色・形は /evidence/・消費者志向自主宣言と同じく TOP カテゴリ欄と /data/ のカードの実際の値（フラット）
 *   区切り 2px #9bdeec／アイコン 線だけ #007e9b／淡い面 #f6fbfd・枠 #dfedf2／カード枠 #d3eaf3・角丸12px
 *   補足 #526b80／筆記体 #00a8d0／黄色 #fff18b。⚠ グラデーション・塗りのタイル・濃い面は使わない
 * ■ 上部のイラストは About の6コマ画像の左下コマ（background-position:0 100%）。⚠ 右下はミナトなので動かさない
 * ■ 見出し・短い文だけ文節で折り返す（本文にはかけない）
 * ⚠ セレクタは `.acmrb` から始め、SWELL の `.post_content h2/h3` 等の装飾に負けないようにする。
 */
@font-face{font-family:'ACM Hand';src:url('../acm-minato/caveat.ttf') format('truetype');font-weight:400 700;font-style:normal;font-display:swap}

.acmrb{
	--rb-ink:#09284b; --rb-sub:#526b80; --rb-icon:#007e9b; --rb-hover:#007c99; --rb-script:#00a8d0;
	--rb-rule:#d3eaf3; --rb-line:#9bdeec; --rb-soft:#f6fbfd; --rb-soft-line:#dfedf2; --rb-yellow:#fff18b;
	--rb-card:0 2px 7px #0a609a05;
	color:var(--rb-ink); line-break:strict;
}
.acmrb :where(h1,h2,h3)::before,.acmrb :where(h1,h2,h3)::after{ content:none !important; display:none !important; }
.acmrb svg{ display:block; flex:0 0 auto; }
.acmrb p{ margin:0; }
.acmrb a{ color:var(--rb-icon); }
.acmrb a:hover{ color:var(--rb-hover); }
.acmrb .acmrb-head__ttl,.acmrb .acmrb-sec__ttl,.acmrb .acmrb-field__ttl,.acmrb .acmrb-card__ttl,.acmrb .acmrb-step__ttl{ word-break:auto-phrase; }
.acmrb :where(h1,h2,h3){ margin:0 !important; padding:0 !important; border:0 !important; background:none !important; box-shadow:none !important; }

/* ── 見出し（日本語 → 右に筆記体） ── */
.acmrb .acmrb-head,.acmrb .acmrb-sec__head{ display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 14px; }
.acmrb .acmrb-head__ttl,.acmrb .acmrb-sec__ttl{
	color:var(--rb-ink) !important; font-weight:700 !important; line-height:1.55 !important;
	text-decoration:underline; text-decoration-color:var(--rb-yellow); text-decoration-thickness:5px;
	text-underline-offset:3px; text-decoration-skip-ink:none;
}
.acmrb .acmrb-head__ttl{ font-size:25px !important; }
.acmrb .acmrb-sec__ttl{ font-size:20px !important; }
.acmrb .acmrb-script{
	display:inline-block; flex:0 0 auto; color:var(--rb-script); font-family:'ACM Hand','Segoe Print',cursive;
	font-size:30px; font-weight:400; line-height:1; transform:rotate(-9deg); white-space:nowrap;
}
.acmrb .acmrb-script.-sm{ font-size:24px; }

/* ══════════ 上部 ══════════ */
.acmrb .acmrb-hero{
	display:grid; grid-template-columns:minmax(0,1fr) 230px; gap:26px; align-items:center;
	margin:4px 0 20px; padding:28px 28px 26px 30px; border:1px solid var(--rb-rule); border-radius:12px; background:#fafdff;
}
.acmrb .acmrb-hero.-noart{ grid-template-columns:1fr; }
.acmrb .acmrb-head{ margin:0 0 14px; }
.acmrb .acmrb-lead{ margin:0 0 14px; font-size:15px; line-height:2; }
.acmrb .acmrb-meta{ display:flex; flex-wrap:wrap; gap:4px 18px; font-size:12px; color:var(--rb-sub); }
.acmrb .acmrb-hero__art{
	aspect-ratio:1/1; border-radius:12px; border:1px solid var(--rb-rule);
	background-repeat:no-repeat; background-size:300% 200%; background-position:0 100%; /* 左下のコマ（⚠ 右下はミナト） */
}

/* ── 目次 ── */
.acmrb .acmrb-toc{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:0 0 44px; }
.acmrb .acmrb-toc__item{
	display:flex; align-items:center; gap:9px; min-height:46px; padding:6px 12px;
	border:1px solid var(--rb-soft-line); border-radius:8px; background:var(--rb-soft);
	color:var(--rb-ink); font-size:13px; font-weight:700; line-height:1.45; text-decoration:none;
	transition:background .15s ease, border-color .15s ease;
}
.acmrb .acmrb-toc__item:hover{ background:#e7f7fb; border-color:#7cc9dd; color:var(--rb-ink); }
.acmrb .acmrb-toc__item:focus-visible{ outline:3px solid rgba(0,126,155,.35); outline-offset:2px; }
.acmrb .acmrb-toc__no{ color:var(--rb-script); font-family:'ACM Hand','Segoe Print',cursive; font-size:20px; font-weight:400; line-height:1; }

/* ══════════ 節 ══════════ */
.acmrb .acmrb-sec{ margin:0 0 52px; padding-top:16px; border-top:2px solid var(--rb-line); scroll-margin-top:110px; }
.acmrb .acmrb-sec__head{ margin:0 0 20px; }

/* ── 決め方：流れ図 ── */
.acmrb .acmrb-steps{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; margin:0 !important; padding:0 !important; list-style:none !important; counter-reset:none; }
.acmrb .acmrb-step{
	position:relative; display:flex; flex-direction:column; gap:8px; margin:0 !important; padding:18px 16px 16px !important; list-style:none !important;
	border:1px solid var(--rb-rule); border-radius:12px; background:#fff; box-shadow:var(--rb-card);
}
.acmrb .acmrb-step::marker{ content:none; }
.acmrb .acmrb-step:not(:last-child)::after{
	content:'' !important; display:block !important; position:absolute; right:-19px; top:50%; width:12px; height:12px; margin-top:-6px;
	border-top:2px solid var(--rb-line) !important; border-right:2px solid var(--rb-line) !important; transform:rotate(45deg);
}
.acmrb .acmrb-step__top{ display:flex; align-items:center; justify-content:space-between; }
.acmrb .acmrb-step__ic{ color:var(--rb-icon); }
.acmrb .acmrb-step__ic svg{ width:28px; height:28px; }
.acmrb .acmrb-step__no{ color:var(--rb-script); font-family:'ACM Hand','Segoe Print',cursive; font-size:22px; line-height:1; transform:rotate(-6deg); }
.acmrb .acmrb-step__ttl{ font-size:15.5px; font-weight:700; line-height:1.55; color:var(--rb-ink); }
.acmrb .acmrb-step__txt{ font-size:13px; line-height:1.85; color:var(--rb-sub); }
.acmrb .acmrb-step__txt strong{ color:var(--rb-ink); background:linear-gradient(transparent 62%,var(--rb-yellow) 62%); }

/* ── データ：カード ── */
.acmrb .acmrb-data{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.acmrb .acmrb-card{
	display:flex; flex-direction:column; gap:8px; padding:18px 18px 16px;
	border:1px solid var(--rb-rule); border-radius:12px; background:#fff; box-shadow:var(--rb-card);
}
.acmrb .acmrb-card__head{ display:flex; align-items:center; gap:10px; }
.acmrb .acmrb-card__ic{ color:var(--rb-icon); }
.acmrb .acmrb-card__ic svg{ width:26px; height:26px; }
.acmrb .acmrb-card__ttl{ color:var(--rb-ink) !important; font-size:15.5px !important; font-weight:700 !important; line-height:1.5 !important; }
.acmrb .acmrb-card__txt{ font-size:13.5px; line-height:1.85; color:var(--rb-ink); }
.acmrb .acmrb-card__foot{ margin-top:auto; padding-top:10px; border-top:1px dashed var(--rb-rule); font-size:12px; line-height:1.7; color:var(--rb-sub); }
.acmrb .acmrb-card__foot span{ display:block; margin-bottom:2px; font-weight:700; }
.acmrb .acmrb-note{ margin-top:14px; font-size:13px; line-height:1.8; color:var(--rb-sub); }

/* ── 分野：カード ── */
.acmrb .acmrb-fields{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.acmrb .acmrb-field{
	display:flex; flex-direction:column; gap:14px; padding:20px 20px 18px;
	border:1px solid var(--rb-rule); border-radius:12px; background:#fff; box-shadow:var(--rb-card);
}
.acmrb .acmrb-field__head{ display:flex; align-items:center; gap:10px; padding-bottom:12px; border-bottom:1px solid var(--rb-rule); }
.acmrb .acmrb-field__ic{ color:var(--rb-icon); }
.acmrb .acmrb-field__ic svg{ width:28px; height:28px; }
.acmrb .acmrb-field__ttl{ color:var(--rb-ink) !important; font-size:16px !important; font-weight:700 !important; line-height:1.5 !important; }
.acmrb .acmrb-field__label{ display:flex; align-items:center; gap:6px; margin:0 0 7px; font-size:12px; font-weight:700; color:var(--rb-sub); }
.acmrb .acmrb-field__label svg{ width:14px; height:14px; color:var(--rb-icon); }
.acmrb .acmrb-field__txt,.acmrb .acmrb-field__note{ font-size:13.5px; line-height:1.85; color:var(--rb-ink); }
.acmrb .acmrb-field__note{ color:var(--rb-sub); }
.acmrb .acmrb-tags{ display:flex; flex-wrap:wrap; gap:6px; margin:0 !important; padding:0 !important; list-style:none !important; }
.acmrb .acmrb-tags li{
	margin:0 !important; padding:3px 10px !important; list-style:none !important;
	border:1px solid var(--rb-soft-line); border-radius:999px; background:var(--rb-soft);
	font-size:12.5px; line-height:1.6; color:var(--rb-ink);
}
.acmrb .acmrb-tags li::before,.acmrb .acmrb-tags li::marker{ content:none !important; display:none !important; }
.acmrb .acmrb-field__links{ display:flex; flex-wrap:wrap; gap:8px; margin-top:auto; }

/* ── ボタン ── */
.acmrb .acmrb-btn{
	display:inline-flex; align-items:center; gap:8px; min-height:46px; padding:9px 20px;
	border-radius:8px; background:var(--rb-icon); color:#fff !important; text-decoration:none;
	font-size:14px; font-weight:700; line-height:1.5; transition:background .15s ease;
}
.acmrb .acmrb-btn:hover{ background:#006a82; color:#fff !important; }
.acmrb .acmrb-btn svg{ width:16px; height:16px; }
.acmrb .acmrb-btn.-sub{ min-height:40px; padding:7px 14px; border:1px solid var(--rb-soft-line); background:var(--rb-soft); color:var(--rb-ink) !important; font-size:13px; }
.acmrb .acmrb-btn.-sub:hover{ background:#e7f7fb; border-color:#7cc9dd; color:var(--rb-ink) !important; }
.acmrb .acmrb-btn.-sub svg{ width:14px; height:14px; color:var(--rb-icon); }
.acmrb .acmrb-btn:focus-visible{ outline:3px solid rgba(0,126,155,.35); outline-offset:2px; }

/* ── 中立性：開示＋約束 ── */
.acmrb .acmrb-neutral{ display:grid; gap:14px; }
.acmrb .acmrb-disclose,.acmrb .acmrb-promise{ padding:20px 22px; border-radius:12px; }
.acmrb .acmrb-disclose{ border:1px solid var(--rb-rule); background:#f5fbff; }
.acmrb .acmrb-promise{ border:1px solid var(--rb-rule); background:#fff; box-shadow:var(--rb-card); }
.acmrb .acmrb-disclose__label,.acmrb .acmrb-promise__label{ display:flex; align-items:center; gap:8px; margin:0 0 10px; font-size:14px; font-weight:700; color:var(--rb-ink); }
.acmrb .acmrb-disclose__label svg,.acmrb .acmrb-promise__label svg{ width:20px; height:20px; color:var(--rb-icon); }
.acmrb .acmrb-disclose__txt{ font-size:14px; line-height:1.95; }
.acmrb .acmrb-checks{ margin:0 !important; padding:0 !important; list-style:none !important; }
.acmrb .acmrb-checks > li{
	display:flex; gap:10px; margin:0 0 10px !important; padding:0 !important; list-style:none !important;
	font-size:14.5px; line-height:1.85; color:var(--rb-ink);
}
.acmrb .acmrb-checks > li:last-child{ margin-bottom:0 !important; }
.acmrb .acmrb-checks > li::before,.acmrb .acmrb-checks > li::marker{ content:none !important; display:none !important; }
.acmrb .acmrb-checks__ic{ display:grid; place-items:center; width:21px; height:21px; margin-top:3px; border-radius:50%; background:#e7f7fb; color:var(--rb-icon); flex:0 0 auto; }
.acmrb .acmrb-checks__ic svg{ width:12px; height:12px; }

/* ── 誤りの報告 ── */
.acmrb .acmrb-report{
	display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px 20px;
	padding:20px 22px; border:1px solid var(--rb-rule); border-radius:12px; background:#f5fbff;
}
.acmrb .acmrb-report__txt{ flex:1 1 320px; font-size:14px; line-height:1.9; }

/* ── 改定履歴：タイムライン ── */
.acmrb .acmrb-history{ position:relative; margin:0 !important; padding:0 0 0 22px !important; list-style:none !important; }
.acmrb .acmrb-history::before{ content:'' !important; display:block !important; position:absolute; left:5px; top:8px; bottom:8px; width:2px; background:var(--rb-rule) !important; }
.acmrb .acmrb-history > li{ position:relative; display:grid; grid-template-columns:150px minmax(0,1fr); gap:4px 14px; margin:0 0 14px !important; padding:0 !important; list-style:none !important; }
.acmrb .acmrb-history > li::marker{ content:none; }
.acmrb .acmrb-history > li::before{ content:'' !important; display:block !important; position:absolute; left:-22px; top:6px; width:12px; height:12px; border-radius:50%; border:2px solid var(--rb-script); background:#fff; box-sizing:border-box; }
.acmrb .acmrb-history__date{ font-size:13px; font-weight:700; color:var(--rb-icon); font-variant-numeric:tabular-nums; }
.acmrb .acmrb-history__txt{ font-size:14px; line-height:1.85; }

/* ── 当てはまらない節（本文そのまま） ── */
.acmrb .acmrb-body p{ font-size:15px; line-height:2; margin-bottom:12px; }

/* ══════════ タブレット・スマホ ══════════ */
@media (max-width:760px){
	.acmrb .acmrb-hero{ grid-template-columns:1fr; }
	.acmrb .acmrb-hero__art{ display:none; }
	.acmrb .acmrb-toc{ grid-template-columns:1fr 1fr; }
	.acmrb .acmrb-steps{ grid-template-columns:1fr; gap:22px; }
	.acmrb .acmrb-step:not(:last-child)::after{ right:50%; top:auto; bottom:-17px; margin:0 -6px 0 0; transform:rotate(135deg); }
	.acmrb .acmrb-data,.acmrb .acmrb-fields{ grid-template-columns:1fr; }
}
@media (max-width:600px){
	.acmrb .acmrb-hero{ padding:22px 18px 20px; }
	.acmrb .acmrb-head__ttl{ font-size:22px !important; }
	.acmrb .acmrb-script{ font-size:26px; }
	.acmrb .acmrb-script.-sm{ font-size:21px; }
	.acmrb .acmrb-lead{ font-size:14.5px; }
	.acmrb .acmrb-toc{ margin-bottom:34px; }
	.acmrb .acmrb-toc__item{ min-height:42px; padding:6px 9px; font-size:12px; }
	.acmrb .acmrb-sec{ margin-bottom:40px; }
	.acmrb .acmrb-sec__ttl{ font-size:18px !important; }
	.acmrb .acmrb-field,.acmrb .acmrb-card{ padding:16px 15px 15px; }
	.acmrb .acmrb-disclose,.acmrb .acmrb-promise,.acmrb .acmrb-report{ padding:16px 15px; }
	.acmrb .acmrb-report .acmrb-btn{ width:100%; justify-content:center; }
	.acmrb .acmrb-history > li{ grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce){
	.acmrb .acmrb-toc__item,.acmrb .acmrb-btn{ transition:none; }
}