:root{
 --bg:#ffffff;--bg2:#f7f7f5;--ink:#141414;--ink2:#4a4a4a;--ink3:#8a8a8a;--line:#e3e3e3;
 --acc:#1c4fd6;--acc-soft:#e9effb;--navy:#1d3e6e;--w:1080px;
 --sans:"LINK2 Sans","Noto Sans JP","Hiragino Sans","Hiragino Kaku Gothic ProN","Microsoft YaHei",system-ui,sans-serif;
 --mono:var(--sans);
 /* サービス別の色 */
 --c1:#1d3e6e;--c1s:#e6ecf5;
 --c2:#2f7d6b;--c2s:#e4f2ee;
 --c3:#c2702a;--c3s:#fbeee2;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.8;-webkit-font-smoothing:antialiased}
.wrap{max-width:var(--w);margin:0 auto;padding:0 32px}

header{border-bottom:1px solid var(--line)}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;gap:16px}
header img{height:40px;width:auto}
header .hdt{font-size:13px;color:var(--ink2);letter-spacing:.06em;font-weight:700}

.cover{padding:88px 0 56px}
.cover .k{font-family:var(--mono);font-size:12px;letter-spacing:.2em;color:var(--acc);margin-bottom:18px}
.cover h1{font-size:clamp(44px,7vw,84px);font-weight:800;letter-spacing:-.03em;line-height:1.15;margin-bottom:24px}
.cover p{font-size:16px;color:var(--ink2);line-height:2;max-width:640px}

.sec{padding:64px 0}
.sec.alt{background:var(--bg2)}
.sec .k{font-family:var(--mono);font-size:12px;letter-spacing:.2em;color:var(--acc);margin-bottom:12px}
h2{font-size:clamp(26px,3.2vw,36px);font-weight:800;letter-spacing:-.02em;line-height:1.4;margin-bottom:14px}
.lead{font-size:15px;color:var(--ink2);line-height:1.95;margin-bottom:36px;max-width:720px}

/* ===== 入口ボタン ===== */
.entry{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
.entry a{display:flex;flex-direction:column;min-width:220px;padding:16px 22px;border:1.5px solid var(--navy);border-radius:8px;color:var(--navy);text-decoration:none;font-size:19px;font-weight:800;line-height:1.4}
.entry a span{font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--acc);font-weight:700;margin-bottom:4px}
.entry a:after{content:"↓";align-self:flex-end;margin-top:-26px;font-size:18px}
.entry a:hover{background:var(--navy);color:#fff}
.entry a:hover span{color:#a9c0ec}
/* ===== 01 サービス紹介 ===== */
.who{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.svc{border:1px solid var(--line);border-top:4px solid var(--c);border-radius:8px;background:#fff;padding:26px 24px 24px;display:flex;flex-direction:column}
.svc.s1{--c:var(--c1);--cs:var(--c1s)}.svc.s2{--c:var(--c2);--cs:var(--c2s)}.svc.s3{--c:var(--c3);--cs:var(--c3s)}
.svc .q{font-size:13px;color:var(--ink3);font-weight:700;letter-spacing:.04em}
.svc .who-t{font-size:26px;font-weight:800;letter-spacing:-.01em;margin:2px 0 0}
.svc .sub{font-size:13px;color:var(--ink2);font-weight:700;margin-bottom:14px}
.svc .arrow{font-size:18px;color:var(--c);line-height:1;margin-bottom:10px}
.svc .name{display:inline-block;align-self:flex-start;background:var(--c);color:#fff;font-weight:800;font-size:17px;padding:6px 14px;border-radius:6px;margin-bottom:14px}
.svc .what{font-size:15px;font-weight:700;line-height:1.7;margin-bottom:14px}
.svc dl{display:grid;grid-template-columns:52px 1fr;gap:6px 10px;font-size:13px;line-height:1.75;border-top:1px solid var(--line);padding-top:14px;margin-top:auto}
.svc dt{color:var(--ink3);font-weight:700}
.svc dd{color:var(--ink2)}
.axis{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;margin-top:22px;font-size:13px;font-weight:700;color:var(--ink2)}
.axis .bar{height:6px;border-radius:3px;background:linear-gradient(90deg,var(--c1),var(--c2),var(--c3))}
.axis small{display:block;font-weight:400;color:var(--ink3);font-size:12px}
.axis .r{text-align:right}

/* ===== 02 チャート ===== */
.ctrl{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips button{font-family:inherit;font-size:13px;font-weight:700;color:var(--ink2);background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 14px;cursor:pointer}
.chips button:hover{color:var(--ink);border-color:var(--ink3)}
.chips button.on{background:var(--navy);border-color:var(--navy);color:#fff}
.legend{display:flex;gap:18px;font-size:13px;color:var(--ink2);align-items:center}
.legend span{display:inline-flex;align-items:center;gap:6px}

.m{display:inline-block;width:22px;height:22px;border-radius:50%;vertical-align:middle;position:relative}
.m.full{background:var(--c)}
.m.full:after{content:"";position:absolute;inset:5px;border-radius:50%;border:2px solid #fff}
.m.half{border:2.5px solid var(--c);background:#fff}
.m.none{width:8px;height:2px;border-radius:1px;background:var(--line)}
.legend .m{--c:var(--navy);width:18px;height:18px}
.legend .m.full:after{inset:4px}

table.chart{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.chart th,.chart td{border-bottom:1px solid var(--line);vertical-align:middle}
.chart thead th{background:#fff;font-size:13px;font-weight:800;padding:14px 10px;text-align:center;line-height:1.45;border-bottom:2px solid var(--ink)}
.chart thead th.issue{text-align:left;padding-left:22px;width:32%}
.chart thead th.rec{text-align:left;width:33%}
.chart thead th.sv{width:12%;white-space:nowrap;padding-left:4px;padding-right:4px}
.chart thead th.sv span{display:block;font-size:11px;font-weight:700;color:var(--c);letter-spacing:.04em}
.chart thead th.sv:before{content:"";display:block;width:28px;height:4px;border-radius:2px;background:var(--c);margin:0 auto 8px}
.c1{--c:var(--c1)}.c2{--c:var(--c2)}.c3{--c:var(--c3)}
.chart tr.cat td{background:var(--bg2);font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--acc);font-weight:700;padding:10px 22px}
.chart tr.cat td b{font-family:var(--sans);letter-spacing:.02em;color:var(--ink);font-size:13px;margin-left:10px}
.chart td{padding:16px 10px;font-size:14px}
.chart td.issue{padding-left:22px;font-weight:700;line-height:1.65}
.chart td.mk{text-align:center}
.chart td.rec{font-size:13px;color:var(--ink2);line-height:1.8;padding-right:22px}
.chart td.rec b{color:var(--ink)}
.chart tbody tr.row:hover td{background:#fbfcfe}
.chart tbody tr:last-child td{border-bottom:0}
.chart tr[hidden]{display:none}
.note{font-size:12px;color:var(--ink3);margin-top:14px;line-height:1.8}

/* ===== 03 組み合わせ ===== */
.combo{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cb{border:1px solid var(--line);border-radius:8px;background:#fff;padding:26px 24px}
.cb .k{margin-bottom:8px}
.cb b.t{display:block;font-size:19px;line-height:1.45;margin-bottom:18px}
.cb ol{list-style:none;counter-reset:s}
.cb li{counter-increment:s;position:relative;padding:0 0 18px 34px;font-size:14px;line-height:1.7;color:var(--ink2)}
.cb li:before{content:counter(s);position:absolute;left:0;top:0;width:22px;height:22px;border-radius:50%;background:var(--c);color:#fff;font-size:12px;font-weight:800;text-align:center;line-height:22px;font-family:var(--mono)}
.cb li:not(:last-child):after{content:"";position:absolute;left:10px;top:26px;bottom:4px;width:2px;background:var(--line)}
.cb li:last-child{padding-bottom:0}
.cb li .tag{display:inline-block;font-size:11px;font-weight:800;color:var(--c);border:1px solid var(--c);border-radius:4px;padding:0 6px;margin-bottom:3px;line-height:1.7}
.cb li p{color:var(--ink2)}

/* ===== 締め ===== */
.close{padding:88px 0 72px;text-align:center}
.close h2{font-size:clamp(28px,3.6vw,40px);margin-bottom:18px}
.close p{font-size:15px;color:var(--ink2);line-height:2}
footer{border-top:1px solid var(--line);padding:28px 0;font-size:12px;color:var(--ink3);text-align:center;line-height:1.9}
footer .tg{font-family:var(--mono);letter-spacing:.2em;margin-top:6px}

@media (max-width:860px){
 .who,.combo{grid-template-columns:1fr}
 .axis{display:none}
}
@media (max-width:720px){
 .wrap{padding:0 16px}
 header .hdt{display:none}
 .cover{padding:56px 0 40px}
 .sec{padding:48px 0}
 .lead br,.cover p br{display:none}
 table.chart,.chart tbody{display:block;border:0;background:transparent}
 .chart thead{display:none}
 .chart tr.cat{display:block;margin:22px 0 10px}
 .chart tr.cat td{display:block;background:transparent;padding:0;border:0}
 .chart tr.row{display:grid;grid-template-columns:repeat(3,1fr);background:#fff;border:1px solid var(--line);border-radius:8px;margin-bottom:10px;overflow:hidden}
 .chart tr.row[hidden]{display:none}
 .chart tr.row td{border:0;background:#fff}
 .chart td.issue{grid-column:1/-1;padding:14px 16px 8px}
 .chart td.mk{padding:6px 4px;font-size:11px;font-weight:700;color:var(--ink3);display:flex;flex-direction:column;align-items:center;gap:4px}
 .chart td.mk:before{content:attr(data-l)}
 .chart td.rec{grid-column:1/-1;padding:10px 16px 14px;border-top:1px solid var(--line)}
}
@media print{
 @page{size:A4 portrait;margin:12mm}
 body{-webkit-print-color-adjust:exact;print-color-adjust:exact}
 .chips{display:none}
 .chart tr[hidden],.chart tr.row[hidden]{display:table-row}
 .sec{padding:28px 0;break-inside:auto}
 .cover{padding:28px 0 16px}
 .chart tr{break-inside:avoid}
 .cb,.svc{break-inside:avoid}
 .close{padding:40px 0 24px}
}

.svc a.name{text-decoration:none}
.svc a.name:hover{opacity:.85}