.knl-fig,.knl-fig *{box-sizing:border-box;margin:0;padding:0}
.knl-fig{font-family:'Noto Sans CJK JP','Noto Sans JP',sans-serif;background:#fff;
 -webkit-font-smoothing:antialiased}
.knl-fig{--navy:#1F3864; --navy-2:#33517F; --ink:#14171F; --muted:#5A6070;
 --line:#D7DCE5; --band:#F2F5FA; --band2:#E7ECF5; --paper:#FFFFFF;
 --s1:#2a78d6; --s2:#eb6834; --s3:#1baf7a; --s4:#eda100; --s5:#e87ba4;
 --bad:#C0392B; --good:#1baf7a;}
.knl-fig .fig{width:1200px;background:var(--paper);padding:44px 48px 48px;border-top:6px solid var(--navy)}
.knl-fig .fig-cap{font-size:15px;color:var(--navy);font-weight:700;letter-spacing:.06em;margin-bottom:6px}
.knl-fig .fig-title{font-size:30px;line-height:1.4;font-weight:700;color:var(--ink);margin-bottom:8px}
.knl-fig .fig-sub{font-size:16px;color:var(--muted);line-height:1.7;margin-bottom:30px}
.knl-fig .fig-note{font-size:14px;color:var(--muted);line-height:1.7;margin-top:26px;
 padding-top:16px;border-top:1px solid var(--line)}
.knl-fig .brand{margin-top:24px;font-size:13px;color:#96A0B4;letter-spacing:.14em;text-align:right}
.knl-fig .cmp{display:grid;grid-template-columns:1fr 74px 1fr;align-items:stretch;gap:0}
.knl-fig .cmp-col{border:2px solid var(--line);border-radius:14px;padding:24px 26px;background:var(--paper)}
.knl-fig .cmp-col.on{border-color:var(--navy);background:var(--band)}
.knl-fig .cmp-h{font-size:19px;font-weight:700;color:var(--muted);margin-bottom:16px;
 padding-bottom:12px;border-bottom:2px solid var(--line)}
.knl-fig .cmp-col.on .cmp-h{color:var(--navy);border-color:var(--navy-2)}
.knl-fig .cmp-li{font-size:17px;line-height:1.6;color:var(--ink);padding:9px 0 9px 22px;position:relative}
.knl-fig .cmp-li:before{content:'';position:absolute;left:2px;top:17px;width:9px;height:9px;
 border-radius:50%;background:#B6BFCF}
.knl-fig .cmp-col.on .cmp-li:before{background:var(--navy)}
.knl-fig .cmp-ar{display:flex;align-items:center;justify-content:center;font-size:34px;color:var(--navy)}
.knl-fig table.t{width:100%;border-collapse:separate;border-spacing:0;font-size:16px}
.knl-fig table.t th{background:var(--navy);color:#fff;font-size:15px;font-weight:700;
 padding:15px 18px;text-align:left;line-height:1.5}
.knl-fig table.t th:first-child{border-radius:10px 0 0 0}
.knl-fig table.t th:last-child{border-radius:0 10px 0 0}
.knl-fig table.t td{padding:16px 18px;border-bottom:1px solid var(--line);color:var(--ink);
 line-height:1.65;vertical-align:top}
.knl-fig table.t tr:nth-child(even) td{background:var(--band)}
.knl-fig table.t tr.hl td{background:#FFF6E3;box-shadow:inset 3px 0 0 var(--s4)}
.knl-fig table.t td.k{font-weight:700;color:var(--navy);white-space:nowrap}
.knl-fig table.t td.c{text-align:center}
.knl-fig .cards{display:grid;gap:18px}
.knl-fig .card{border:2px solid var(--line);border-radius:14px;padding:24px;background:var(--paper)}
.knl-fig .card .n{width:40px;height:40px;border-radius:50%;background:var(--navy);color:#fff;
 font-size:19px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.knl-fig .card h4{font-size:20px;color:var(--ink);margin-bottom:10px;line-height:1.4}
.knl-fig .card p{font-size:15px;color:var(--muted);line-height:1.75}
.knl-fig .flow{display:flex;flex-direction:column;gap:0}
.knl-fig .frow{display:grid;grid-template-columns:56px 1fr;gap:20px}
.knl-fig .fnum{width:46px;height:46px;border-radius:12px;background:var(--band2);color:var(--navy);
 font-size:19px;font-weight:700;display:flex;align-items:center;justify-content:center}
.knl-fig .frow.on .fnum{background:var(--navy);color:#fff}
.knl-fig .fbody{border:2px solid var(--line);border-radius:12px;padding:18px 22px;margin-bottom:14px;background:var(--paper)}
.knl-fig .frow.on .fbody{border-color:var(--navy);background:var(--band)}
.knl-fig .fbody h5{font-size:19px;color:var(--ink);margin-bottom:7px;line-height:1.45}
.knl-fig .frow.on .fbody h5{color:var(--navy)}
.knl-fig .fbody p{font-size:15px;color:var(--muted);line-height:1.7}
.knl-fig .fconn{width:2px;height:16px;background:var(--line);margin:0 0 14px 27px}
.knl-fig .hsteps{display:flex;align-items:stretch;gap:0}
.knl-fig .hstep{flex:1;border:2px solid var(--line);border-radius:12px;padding:18px 16px;text-align:center;background:var(--paper)}
.knl-fig .hstep .lb{font-size:12px;color:var(--muted);letter-spacing:.1em;margin-bottom:8px}
.knl-fig .hstep .tx{font-size:18px;font-weight:700;color:var(--ink);line-height:1.45}
.knl-fig .hstep .sb{font-size:14px;color:var(--muted);margin-top:8px;line-height:1.6}
.knl-fig .harrow{display:flex;align-items:center;padding:0 12px;font-size:24px;color:#B6BFCF}
.knl-fig .harrow.cut{color:var(--bad);font-weight:700}
.knl-fig .chk{display:grid;grid-template-columns:1fr 1fr;gap:14px 22px}
.knl-fig .chk div{font-size:17px;color:var(--ink);line-height:1.6;padding:16px 18px 16px 52px;
 border:2px solid var(--line);border-radius:10px;position:relative;background:var(--paper)}
.knl-fig .chk div:before{content:'';position:absolute;left:18px;top:18px;width:20px;height:20px;
 border:2px solid var(--navy);border-radius:4px}
.knl-fig .bars{display:flex;flex-direction:column;gap:22px}
.knl-fig .bar-row{display:grid;grid-template-columns:130px 1fr;align-items:center;gap:18px}
.knl-fig .bar-lb{font-size:17px;font-weight:700;color:var(--ink);text-align:right;line-height:1.4}
.knl-fig .bar-lb small{display:block;font-size:13px;font-weight:400;color:var(--muted);margin-top:3px}
.knl-fig .bar{display:flex;height:46px;align-items:stretch}
.knl-fig .seg{position:relative;display:flex;align-items:center;justify-content:center;
 color:#fff;font-size:13px;font-weight:700;margin-right:2px}
.knl-fig .seg:last-child{margin-right:0;border-radius:0 5px 5px 0}
.knl-fig .seg:first-child{border-radius:5px 0 0 5px}
.knl-fig .legend{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:26px;padding-top:18px;border-top:1px solid var(--line)}
.knl-fig .legend span{font-size:15px;color:var(--ink);display:flex;align-items:center;gap:9px}
.knl-fig .legend i{width:16px;height:16px;border-radius:4px;display:block}
.knl-fig .box{border:2px solid var(--line);border-radius:14px;padding:22px 24px;background:var(--paper)}
.knl-fig .box.on{border-color:var(--navy);background:var(--band)}
.knl-fig .box.warn{border-color:var(--bad);background:#FDF2F1}
.knl-fig .lb{font-size:13px;letter-spacing:.1em;color:var(--muted);margin-bottom:10px;font-weight:700}
.knl-fig .grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px}
.knl-fig .grid2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.knl-fig .x{color:var(--bad);font-weight:700}
.knl-fig .o{color:var(--good);font-weight:700}
.knl-fig .th{width:1200px;height:630px;position:relative;overflow:hidden;
 background:#fff;display:flex;flex-direction:column;justify-content:center;padding:0 76px}
.knl-fig .th:before{content:'';position:absolute;left:0;top:0;width:14px;height:100%;background:var(--navy)}
.knl-fig .th-eyebrow{font-size:19px;color:var(--navy);font-weight:700;letter-spacing:.1em;margin-bottom:26px}
.knl-fig .th-main{font-size:70px;line-height:1.3;font-weight:900;color:var(--ink);letter-spacing:-.01em}
.knl-fig .th-main em{font-style:normal;color:var(--navy)}
.knl-fig .th-main .big{font-size:104px;color:var(--navy);line-height:1}
.knl-fig .th-sub{font-size:25px;color:var(--muted);line-height:1.6;margin-top:30px;font-weight:500}
.knl-fig .th-brand{position:absolute;right:64px;bottom:44px;font-size:19px;letter-spacing:.22em;
 color:var(--navy);font-weight:700}
.knl-fig .th-art{position:absolute;right:70px;top:50%;transform:translateY(-50%);opacity:1}
.knl-fig{max-width:100%;margin:2.4em 0;overflow-x:auto}
.knl-fig .fig{width:100%;max-width:100%;padding:28px 26px 30px}
.knl-fig .fig-title{font-size:clamp(19px,2.4vw,26px)}
.knl-fig .fig-sub{font-size:clamp(14px,1.4vw,16px);margin-bottom:22px}
.knl-fig .fig-note{font-size:clamp(13px,1.2vw,14px)}
.knl-fig .cmp-li,.knl-fig .chk div{font-size:clamp(14px,1.5vw,17px)}
.knl-fig table.t{font-size:clamp(13px,1.4vw,16px)}
.knl-fig table.t th{font-size:clamp(12px,1.3vw,15px);padding:12px 14px}
.knl-fig table.t td{padding:12px 14px}
.knl-fig .card h4,.knl-fig .fbody h5,.knl-fig .hstep .tx{font-size:clamp(16px,1.7vw,19px)}
.knl-fig .card p,.knl-fig .fbody p,.knl-fig .hstep .sb{font-size:clamp(13px,1.3vw,15px)}
@media (max-width:700px){
  .knl-fig .fig{padding:20px 16px 22px}
  .knl-fig .cmp{grid-template-columns:1fr}
  .knl-fig .cmp-ar{padding:10px 0;transform:rotate(90deg)}
  .knl-fig .grid2,.knl-fig .grid3,.knl-fig .chk{grid-template-columns:1fr}
  .knl-fig .hsteps{flex-direction:column}
  .knl-fig .harrow{justify-content:center;padding:6px 0;transform:rotate(90deg)}
  .knl-fig .bar-row{grid-template-columns:1fr;gap:8px}
  .knl-fig .bar-lb{text-align:left}
  .knl-fig .frow{grid-template-columns:40px 1fr;gap:12px}
  /* 図版内でインラインstyleに書かれた多段組みも、狭い画面では1列にする */
  .knl-fig [style*="grid-template-columns"]{grid-template-columns:1fr !important}
  .knl-fig [style*="display:flex"]{flex-wrap:wrap}
}
@media print{.knl-fig{break-inside:avoid}}