/*
 * ご支援実績ページ（page-works.php / page-results.php）専用スタイル
 * functions.php で、ご支援実績ページの表示時のみ読み込みます。
 * すべて .tzz-root 配下に限定しているため、他ページには影響しません。
 * 絞り込みタブは CSS のみで動作します（ラジオボタン）。分類を増やす場合は
 * inc/content.php の 'works_filters' と、下の絞り込み用ルールの両方に追記してください。
 */
.tzz-root{--navy:#16233F;--navy2:#1F3159;--ice:#EEF3FB;--ice2:#DCE6F5;--text:#2B303B;--muted:#6B7280;--line:#E4E8F0;
  --mincho:"Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif JP",serif;
  --gothic:"Hiragino Kaku Gothic ProN","Yu Gothic","YuGothic","Noto Sans JP",sans-serif;
  display:block;width:100%;background:#fff;color:var(--text);font-family:var(--gothic);font-size:16px;line-height:1.85;
  -webkit-text-size-adjust:100%;text-align:left;letter-spacing:.02em}
.tzz-root *,.tzz-root *::before,.tzz-root *::after{box-sizing:border-box}
.tzz-root h1,.tzz-root h2,.tzz-root h3,.tzz-root h4,.tzz-root p,.tzz-root ul,.tzz-root ol,.tzz-root li{margin:0;padding:0;list-style:none;border:0;background:none;text-transform:none;letter-spacing:inherit}
.tzz-root a{color:inherit}
.tzz-root .tzz-wrap{max-width:calc(1180px + 2 * var(--pad-x,24px));margin:0 auto;padding:0 var(--pad-x,24px)}

/* hero */
.tzz-root .tzz-hero{padding:clamp(48px,6vw,84px) 0 8px}
.tzz-root .tzz-h1{font-family:var(--mincho);font-weight:600;color:var(--navy);font-size:clamp(2rem,5.2vw,3rem);line-height:1.3;letter-spacing:.06em}
.tzz-root .tzz-lede{margin-top:24px;max-width:38em;font-size:1rem;color:var(--text)}
.tzz-root .tzz-lede p+p{margin-top:.6em}
.tzz-root .tzz-key{margin-top:32px;display:flex;flex-wrap:wrap;align-items:center;gap:10px 24px;padding:16px 20px;background:var(--ice);border-radius:4px;font-size:.875rem;line-height:1.6}
.tzz-root .tzz-key-l{display:flex;flex-wrap:wrap;gap:8px 20px}
.tzz-root .tzz-key-l li{display:flex;align-items:center;gap:8px;color:var(--navy)}

/* step marker */
.tzz-root .tzz-sn{flex:none;display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--navy2);color:var(--navy2);font-family:var(--mincho);font-weight:700;font-size:.8125rem;line-height:1;background:#fff}
.tzz-root .tzz-sn.is-on{background:var(--navy2);color:#fff}

/* filter */
.tzz-root .tzz-cases{margin-top:48px;padding-bottom:var(--pad-y,64px)}
.tzz-root .tzz-fi{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.tzz-root .tzz-tabs{display:flex;gap:4px 28px;overflow-x:auto;border-bottom:1px solid var(--line);-webkit-overflow-scrolling:touch}
.tzz-root .tzz-tab{flex:none;cursor:pointer;padding:12px 2px;font-size:.9375rem;color:var(--muted);border-bottom:3px solid transparent;margin-bottom:-1px;white-space:nowrap}
.tzz-root .tzz-tab:hover{color:var(--navy)}
.tzz-root #tzz-f-all:checked ~ .tzz-tabs label[for="tzz-f-all"]{color:var(--navy);font-weight:700;border-bottom-color:var(--navy)}
.tzz-root #tzz-f-all:focus-visible ~ .tzz-tabs label[for="tzz-f-all"]{outline:2px solid var(--navy2);outline-offset:2px}
.tzz-root #tzz-f-web:checked ~ .tzz-tabs label[for="tzz-f-web"]{color:var(--navy);font-weight:700;border-bottom-color:var(--navy)}
.tzz-root #tzz-f-web:focus-visible ~ .tzz-tabs label[for="tzz-f-web"]{outline:2px solid var(--navy2);outline-offset:2px}
.tzz-root #tzz-f-web:checked ~ .tzz-list .tzz-case:not([data-cat="web"]){display:none}
.tzz-root #tzz-f-newbiz:checked ~ .tzz-tabs label[for="tzz-f-newbiz"]{color:var(--navy);font-weight:700;border-bottom-color:var(--navy)}
.tzz-root #tzz-f-newbiz:focus-visible ~ .tzz-tabs label[for="tzz-f-newbiz"]{outline:2px solid var(--navy2);outline-offset:2px}
.tzz-root #tzz-f-newbiz:checked ~ .tzz-list .tzz-case:not([data-cat="newbiz"]){display:none}
.tzz-root #tzz-f-recovery:checked ~ .tzz-tabs label[for="tzz-f-recovery"]{color:var(--navy);font-weight:700;border-bottom-color:var(--navy)}
.tzz-root #tzz-f-recovery:focus-visible ~ .tzz-tabs label[for="tzz-f-recovery"]{outline:2px solid var(--navy2);outline-offset:2px}
.tzz-root #tzz-f-recovery:checked ~ .tzz-list .tzz-case:not([data-cat="recovery"]){display:none}

/* list */
.tzz-root .tzz-list{margin:0}
.tzz-root .tzz-case{border-bottom:1px solid var(--line)}
.tzz-root .tzz-d{display:block}
.tzz-root .tzz-sum,.tzz-root .tzz-static{display:grid;grid-template-columns:minmax(180px,27%) minmax(0,1fr) 148px;gap:8px 32px;align-items:start;padding:32px 0}
.tzz-root .tzz-sum{cursor:pointer;list-style:none}
.tzz-root .tzz-sum::-webkit-details-marker{display:none}
.tzz-root .tzz-sum::marker{content:""}
.tzz-root .tzz-sum:hover{background:linear-gradient(90deg,transparent,rgba(238,243,251,.7) 12%,rgba(238,243,251,.7) 88%,transparent)}
.tzz-root .tzz-sum:focus-visible{outline:2px solid var(--navy2);outline-offset:2px}
.tzz-root .tzz-num{display:block;font-family:var(--mincho);font-weight:600;color:var(--navy);font-size:clamp(1.375rem,2.9vw,1.875rem);line-height:1.35;letter-spacing:.02em;word-break:keep-all;overflow-wrap:break-word}
.tzz-root .tzz-main{display:block}
.tzz-root .tzz-cat{display:block;font-size:.8125rem;color:var(--muted);line-height:1.5;margin-bottom:2px}
.tzz-root .tzz-title{display:block;font-family:var(--mincho);font-weight:600;color:var(--navy);font-size:1.25rem;line-height:1.5}
.tzz-root .tzz-leadp{display:block;margin-top:8px;font-size:.9375rem;line-height:1.85;max-width:40em}
.tzz-root .tzz-side{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.tzz-root .tzz-steps{display:flex;gap:6px}
.tzz-root .tzz-more{display:inline-flex;align-items:center;gap:8px;font-size:.8125rem;color:var(--navy2);white-space:nowrap}
.tzz-root .tzz-more::after{content:"";width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.tzz-root .tzz-d[open] .tzz-more::after{transform:rotate(-135deg) translate(-2px,-1px)}
.tzz-root .tzz-d[open] .tzz-more .tzz-t-closed{display:none}
.tzz-root .tzz-d:not([open]) .tzz-more .tzz-t-open{display:none}

/* detail */
.tzz-root .tzz-detail{display:grid;grid-template-columns:minmax(180px,27%) minmax(0,1fr);gap:0 32px;padding:0 0 44px}
.tzz-root .tzz-detail-in{grid-column:2;max-width:42em}
.tzz-root .tzz-h4{font-family:var(--gothic);font-weight:700;color:var(--navy);font-size:.9375rem;line-height:1.6}
.tzz-root .tzz-block+.tzz-block{margin-top:24px}
.tzz-root .tzz-block p{margin-top:4px;font-size:.9375rem}
.tzz-root .tzz-stepl{margin-top:32px;border-top:1px solid var(--line);padding-top:28px}
.tzz-root .tzz-stepi{position:relative;display:grid;grid-template-columns:34px minmax(0,1fr);gap:0 14px;padding-bottom:26px}
.tzz-root .tzz-stepi:last-child{padding-bottom:0}
.tzz-root .tzz-stepi:not(:last-child)::before{content:"";position:absolute;left:12.5px;top:32px;bottom:6px;width:1.5px;background:var(--ice2)}
.tzz-root .tzz-stepi .tzz-sn{width:26px;height:26px}
.tzz-root .tzz-stepi .tzz-h4{display:flex;flex-wrap:wrap;align-items:center;gap:2px 10px}
.tzz-root .tzz-tag{display:inline-block;padding:0 8px;border-radius:3px;background:var(--navy2);color:#fff;font-size:.75rem;line-height:1.7;font-weight:500}
.tzz-root .tzz-stepi p,.tzz-root .tzz-stepi .tzz-pp{margin-top:4px;font-size:.9375rem}
.tzz-root .tzz-ul{margin-top:8px}
.tzz-root .tzz-ul li{position:relative;padding-left:1.1em;font-size:.9375rem}
.tzz-root .tzz-ul li::before{content:"";position:absolute;left:.15em;top:.95em;width:5px;height:5px;border-radius:50%;background:var(--navy2)}
.tzz-root .tzz-result{margin-top:32px;padding:20px 24px;background:var(--ice);border-left:3px solid var(--navy2)}
.tzz-root .tzz-result .tzz-block p{font-size:.9375rem}
.tzz-root .tzz-result .tzz-first p{font-family:var(--mincho);font-weight:600;color:var(--navy);font-size:1.125rem;line-height:1.7}

/* mobile */
@media (max-width:760px){
  .tzz-root .tzz-sum,.tzz-root .tzz-static{grid-template-columns:minmax(0,1fr);gap:10px;padding:26px 0}
  .tzz-root .tzz-side{flex-direction:row;justify-content:space-between;align-items:center;width:100%}
  .tzz-root .tzz-detail{grid-template-columns:minmax(0,1fr)}
  .tzz-root .tzz-detail-in{grid-column:1}
  .tzz-root .tzz-result{padding:16px 18px}
}
@media (prefers-reduced-motion:reduce){.tzz-root .tzz-more::after{transition:none}}