/* 261104 ミッション「chu ごみ捨てのおもしろ知識／ごみ処理の他市比較ページ」／ 発信者: mask（亀山）。横棒グラフ・要点カード・流れ図の共通部品。 */
.bc{margin:0 0 6px;}
.bcr{display:grid;grid-template-columns:11em 1fr 7.4em;gap:8px;align-items:center;padding:3px 0;font-size:13px;}
.bcl{font-weight:700;line-height:1.25;}
.bcl small{display:block;font-weight:500;color:var(--ink-3);font-size:11px;}
.bct{display:block;height:20px;background:var(--rule-2);position:relative;}
.bct i{display:block;height:100%;background:#0072B2;}
.bct i.sec{background:repeating-linear-gradient(135deg,#9aa3a6 0 5px,#b9c0c2 5px 10px);}
.bct i.ng{background:var(--rule);}
.bcv{font-family:var(--n);font-size:12.5px;font-weight:700;text-align:right;white-space:nowrap;}
.bcr.hl{background:var(--ylw-wash);outline:2px solid var(--ylw);outline-offset:1px;}
.bcr.hl .bct i{background:#c25a00;}
.bcr.ref .bct i{background:var(--ink);}
.bcr.ref .bcl,.bcr.ref .bcv{color:var(--ink-2);}
.bcl em{font-style:normal;font-size:11px;font-weight:700;color:#fff;background:var(--ink);padding:0 5px;margin-left:5px;}
.bckey{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12px;color:var(--ink-2);margin:0 0 10px;}
.bckey i{display:inline-block;width:14px;height:10px;margin-right:5px;vertical-align:-1px;}
.chart-t{font-size:15px;font-weight:900;margin:22px 0 4px;}
.chart-t small{font-weight:500;color:var(--ink-3);font-size:12px;margin-left:6px;}
.pts{display:grid;gap:10px;margin:0 0 22px;grid-template-columns:1fr;}
@media(min-width:760px){.pts{grid-template-columns:repeat(3,1fr);}}
.pt{background:var(--paper);border:1px solid var(--rule);border-top:4px solid var(--ylw);padding:14px 16px;}
.pt .ic{font-size:26px;line-height:1;margin-bottom:6px;}
.pt b{display:block;font-size:22px;font-weight:900;line-height:1.2;}
.pt p{font-size:13px;color:var(--ink-2);margin:6px 0 0;line-height:1.55;}
.bdg{display:inline-block;font-size:11px;font-weight:800;padding:1px 7px;border:1px solid var(--rule);background:#fff;white-space:nowrap;}
.bdg.ok{background:#e4efeb;border-color:#9bc3b6;color:var(--grn);}
.bdg.nd{background:#fdf4d9;border-color:#e6c76a;color:var(--ylw-dk);}
.pf{display:grid;gap:8px;margin:0 0 22px;}
.pf .pf-st{display:grid;grid-template-columns:1fr;gap:6px;}
.pf .pf-bx{background:#fff;border:2px solid var(--ink);padding:10px 12px;font-size:13px;line-height:1.5;}
.pf .pf-bx b{display:block;font-size:14px;}
.pf .pf-bx.c-b{border-color:#0072B2;}
.pf .pf-bx.c-o{border-color:#e8730c;}
.pf .pf-bx.c-g{border-color:#1e8a4c;}
.pf .pf-bx.c-r{border-color:#a32a1e;}
.pf .pf-ar{text-align:center;font-size:20px;line-height:1;color:var(--ink-3);}
@media(min-width:760px){.pf .pf-st{grid-template-columns:1fr 36px 1fr 36px 1fr;align-items:stretch;}.pf .pf-ar{align-self:center;}}
.trv{counter-reset:fun;display:grid;gap:12px;margin:0 0 22px;}
.trv li{list-style:none;background:var(--paper);border:1px solid var(--rule);padding:14px 16px 14px 56px;position:relative;font-size:14px;line-height:1.75;}
.trv li::before{counter-increment:fun;content:counter(fun);position:absolute;left:14px;top:12px;width:30px;height:30px;line-height:30px;text-align:center;background:var(--ylw);font-weight:900;font-family:var(--n);}
.trv li b{display:block;font-size:15px;margin-bottom:2px;}
.trv li small{display:block;color:var(--ink-3);font-size:12px;margin-top:4px;}
.sim{background:var(--paper);border:1px solid var(--rule);padding:14px 16px;margin:0 0 22px;}
.sim label{font-size:13px;font-weight:700;}
.sim input{font:inherit;font-size:16px;width:6em;padding:6px 8px;border:2px solid var(--ink);margin:0 6px;}
@media(max-width:560px){.bcr{grid-template-columns:7.6em 1fr 5.6em;font-size:12px;}}