/* 図（健康寿命・運動器・腸腰筋）。綾波 2026-11-04。字は HTML、絵は SVG。組み名は kc-。
   色：空の青 #74B9E0・SPES の青 #2A5A96・朝日の橙 #F08C5A・字 #1A2028／#3A424B・線 #D3E2EC。字は 15px 以上（出典だけ 12〜13px）。数字は Spectral（lining・tabular）。 */
.kc-chart{margin:0;container-type:inline-size;color:#1A2028;font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","BIZ UDPGothic",sans-serif;font-feature-settings:"palt"}
.kc-chart[lang=en]{font-family:"Newsreader",serif;font-feature-settings:normal}
.kc-num{font-family:"Newsreader",serif;font-variant-numeric:lining-nums tabular-nums;font-weight:400;letter-spacing:0}
.kc-unit{font-size:15px;margin-left:2px}
.kc-nw{white-space:nowrap}
.kc-chart[lang=en] .kc-unit{margin-left:.12em}
.kc-chart [data-slot]{position:relative}
.kc-src{display:grid;gap:2px;margin-top:20px;font-size:12.5px;line-height:1.6;color:#3A424B}
/* 健康寿命 */
.kc-life__row{display:grid;grid-template-columns:72px 1fr;align-items:end;gap:0 12px;margin-top:28px}
.kc-life__row:first-child{margin-top:0}
.kc-life__sex{margin:0 0 18px;font-weight:600;font-size:22px;letter-spacing:.04em}
.kc-chart[lang=en] .kc-life__sex{font-weight:500;letter-spacing:0}
.kc-life__plot{position:relative;padding-top:84px}
.kc-life__artw{position:relative}
.kc-life__art{display:block;width:100%;height:auto;overflow:visible}
.kc-chara{display:block;width:100%;height:auto;background:transparent}
.kc-life__runner{position:absolute;top:12.5%;width:12.4%}
.kc-life__ticks{list-style:none;margin:0;padding:0;position:absolute;inset:auto 0 3% 0;height:0}
.kc-life__ticks li{position:absolute;left:var(--x);bottom:0;transform:translateX(-50%);font:500 17px/1 "Newsreader",serif;font-variant-numeric:lining-nums;color:#2A4266}
.kc-life__facts{margin:0}
.kc-f{position:absolute}
.kc-f dt{font-weight:600;font-size:15px;line-height:1.45}
.kc-chart[lang=en] .kc-f dt{font-weight:500}
.kc-f dd{margin:2px 0 0}
.kc-f .kc-num{font-size:32px;line-height:1}
.kc-f--healthy{left:6%;top:0;color:#2A5A96}
.kc-f--limit{right:calc(100% - var(--cliff) - 4%);top:0;padding:10px 14px 12px;background:#F08C5A;color:#FFFDF9;border-radius:4px;text-align:center}
.kc-f--limit::after{content:"";position:absolute;left:50%;bottom:-9px;margin-left:-9px;border:9px solid transparent;border-bottom:0;border-top-color:#F08C5A}
.kc-f--avg{left:calc(var(--cliff) + 1.5%);bottom:16%;color:#1A2028}
.kc-f--avg .kc-num{font-size:30px}
@container (max-width:760px){
 .kc-life__row{grid-template-columns:1fr;margin-top:24px}
 .kc-life__sex{margin:0 0 8px;font-size:20px}
 .kc-life__plot{padding-top:0;display:flex;flex-direction:column-reverse}
 .kc-life__facts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
 .kc-f{position:static;padding:10px 10px 12px;border-radius:4px;background:#EAF4FB;text-align:left}
 .kc-f--limit{background:#F08C5A}
 .kc-f--limit::after{display:none}
 .kc-f--limit br{display:none}
 .kc-f .kc-num,.kc-f--avg .kc-num{font-size:26px}
 .kc-life__ticks{bottom:2%}
 .kc-life__ticks li{font-size:15px}
}
@container (max-width:420px){ .kc-life__facts{grid-template-columns:1fr 1fr} .kc-f--avg{grid-column:1 / -1} }
.kc-sway{transform-box:fill-box;transform-origin:50% 100%;animation:kc-sway 5s ease-in-out infinite}
@keyframes kc-sway{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}
/* 運動器 */
.kc-ex__in{display:grid;grid-template-columns:minmax(0,720fr) minmax(0,280fr);gap:24px;align-items:start}
.kc-ex__fig{position:relative;aspect-ratio:720/490}
.kc-ex__art{position:absolute;height:auto}
.kc-ex__lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.kc-ex__nos{display:none}
.kc-ex__lab{position:absolute;top:var(--y);display:flex;gap:10px;align-items:flex-start}
.kc-ex__lab--l{right:calc(100% - var(--x));flex-direction:row-reverse;text-align:right}
.kc-ex__lab--r{left:var(--x)}
.kc-ex__lab--r.kc-ex__lab{flex-direction:column;gap:6px}
.kc-ex__lab--t{left:var(--x);align-items:center}
.kc-ex__lab--tl{right:calc(100% - var(--x));align-items:center}
.kc-chart[lang=en] .kc-ex__lab--t{flex-direction:column;align-items:flex-start;gap:6px}
.kc-ex__lab--tl .kc-ex__desc{position:absolute;left:calc(100% + 10px);top:-14px}
.kc-ex__name{display:inline-block;padding:6px 12px 7px;background:#2A5A96;color:#FFFDF9;font-weight:600;font-size:18px;line-height:1.2;border-radius:3px;white-space:nowrap}
.kc-ex__name i{display:none}
.kc-chart[lang=en] .kc-ex__name{font-weight:500;font-size:16px}
.kc-ex__desc{font-size:15px;line-height:1.4;color:#3A424B;white-space:nowrap}
.kc-ex__lab--l .kc-ex__desc{padding-top:2px}
.kc-ex__side{display:grid;gap:16px}
.kc-ex__lead{position:relative;margin:0;padding:18px 20px;background:#EAF4FB;border-radius:6px;font-size:16px;line-height:1.9;color:#1A2028}
.kc-ex__lead::after{content:"";position:absolute;left:58%;bottom:-12px;border:12px solid transparent;border-bottom:0;border-top-color:#EAF4FB}
.kc-ex__man{max-width:220px;justify-self:center;width:100%}
.kc-pow,.kc-sm__blink{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.kc-pow{animation:kc-pow 4s linear infinite}
@keyframes kc-pow{0%,9%{opacity:1}11%,17%{opacity:0}19%,29%{opacity:1}31%,99%{opacity:0}100%{opacity:1}}
.kc-sm__blink{opacity:0;animation:kc-sm-blink 4s steps(1,end) infinite}
@keyframes kc-sm-blink{0%,84%,89%,100%{opacity:0}85%,88%{opacity:1}}
.kc-ping{animation:kc-ping 4.2s ease-in-out infinite}
@keyframes kc-ping{0%,70%,100%{fill:#2A5A96}10%{fill:#F08C5A}}
@container (max-width:940px){
 .kc-ex__in{grid-template-columns:1fr}
 .kc-ex__fig{aspect-ratio:auto;display:grid;grid-template-columns:1fr 1fr;gap:10px 14px}
 .kc-ex__fig > .kc-ex__art{position:relative;left:auto!important;top:auto!important;width:min(62%,300px)!important;grid-column:1 / -1;justify-self:center;margin-bottom:6px}
 .kc-ex__lines{display:none}
 .kc-ex__nos{display:block;list-style:none;margin:0;padding:0;position:absolute;left:calc((100% - min(62%,300px)) / 2);top:0;width:min(62%,300px);aspect-ratio:260/428;pointer-events:none}
 .kc-ex__name br{display:none}
 .kc-ex__lab,.kc-ex__lab--l,.kc-ex__lab--r.kc-ex__lab,.kc-ex__lab--t,.kc-ex__lab--tl{position:static;flex-direction:column;align-items:flex-start;gap:4px;text-align:left}
 .kc-ex__lab--tl .kc-ex__desc{position:static}
 .kc-ex__name i{display:inline-block;font-style:normal;margin-right:4px;font-family:"Newsreader",serif}
 .kc-ex__desc{white-space:normal}
 .kc-ex__lead::after{left:auto;right:30%}
}
.kc-ex__no{position:absolute;width:26px;height:26px;margin:-13px 0 0 6px;border-radius:50%;background:#2A5A96;color:#FFFDF9;font:500 15px/26px "Newsreader",serif;text-align:center}
/* 腸腰筋 */
.kc-il__in{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:20px 32px;align-items:center}
.kc-il__fig{display:grid;grid-template-columns:var(--kc-il-w,96px) minmax(0,1fr);gap:0 26px;max-width:460px}
.kc-chart[lang=en] .kc-il__fig{--kc-il-w:118px}
.kc-il__names{list-style:none;margin:0;padding:0;position:relative;font-weight:600;font-size:20px;line-height:1.2}
.kc-il__names li{position:absolute;right:0;transform:translateY(-50%);white-space:nowrap;text-align:right}
.kc-chart[lang=en] .kc-il__names{font-weight:500;font-size:19px}
.kc-il__op{color:#2A5A96;font-family:"Newsreader",serif;font-size:22px}
.kc-il__n--sum{color:#2A5A96}
.kc-il__body{position:relative}
.kc-il__body img{display:block;width:100%;height:auto}
.kc-il__lead{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.kc-il__dot{position:absolute;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:#1F2A3A}
.kc-il__mood{display:grid;justify-items:center;gap:8px}
.kc-il__m{width:100%;max-width:240px}
.kc-il__arrow{width:72px;height:auto}
.kc-pulse{transform-box:fill-box;transform-origin:50% 50%;animation:kc-pulse 4s ease-in-out infinite}
@keyframes kc-pulse{0%,100%{transform:translateY(-3px);opacity:.85}50%{transform:translateY(4px);opacity:1}}
@container (max-width:640px){ .kc-il__in{grid-template-columns:1fr} .kc-il__mood{grid-template-columns:1fr auto 1fr;align-items:center} .kc-il__arrow{transform:rotate(-90deg);width:56px} }
/* 経歴の流れ */
.kc-cs__in{position:relative;height:380px}
.kc-cs__rail{position:absolute;left:0;right:0;top:262px;width:100%;height:10px;overflow:visible}
.kc-cs__list{list-style:none;margin:0;padding:0}
.kc-cs__ev{position:absolute;left:var(--x);top:0;bottom:0;width:0}
.kc-cs__dot{position:absolute;left:-6px;top:261px;width:12px;height:12px;border-radius:50%;background:#74B9E0}
.kc-cs__ev--age .kc-cs__dot{left:-11px;top:256px;width:22px;height:22px;background:#FFFDF9;border:2px solid #2A5A96;box-sizing:border-box}
.kc-cs__ev--age .kc-cs__dot::after{content:"";position:absolute;inset:5px;border-radius:50%;background:#74B9E0}
.kc-cs__ev--age::before{content:"";position:absolute;left:-.75px;top:106px;height:150px;border-left:1.5px solid #2A5A96}
.kc-cs__age{position:absolute;left:-52px;top:2px;width:104px;height:104px;border-radius:50%;background:#FFFDF9;border:1.5px solid #2A5A96;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#2A5A96;box-shadow:inset 0 0 0 5px #FFFDF9,inset 0 0 0 6px #9CC8EA}
.kc-cs__age .kc-num{font-size:38px;line-height:1}
.kc-cs__pre{font:500 15px/1 "Newsreader",serif;letter-spacing:.16em;text-transform:uppercase;margin-bottom:4px}
.kc-cs__age{--glow:#9CC8EA}
.kc-cs__age--warm{--glow:#FBE08A;background:#FDEDBC;box-shadow:inset 0 0 0 5px #FFFDF9,inset 0 0 0 6.5px #F6C445}
.kc-cs__age--last{background:#2A5A96;color:#FFFDF9;box-shadow:inset 0 0 0 5px #2A5A96,inset 0 0 0 6px #9CC8EA}
.kc-cs__w{display:block}
.kc-cs__lab{position:absolute;left:0;transform:translateX(-50%);display:grid;gap:8px;text-align:center;white-space:nowrap;font-size:15px;line-height:1.45;color:#1A2028}
.kc-chart[lang=en] .kc-cs__lab{font-size:15px;line-height:1.35}
.kc-cs__ev--d .kc-cs__lab{top:288px}
.kc-cs__ev--u .kc-cs__lab{bottom:calc(380px - 248px)}
.kc-cs__ev:first-child .kc-cs__lab{transform:translateX(-30%)}
.kc-cs__ev:last-child .kc-cs__lab{transform:translateX(-72%)}
.kc-cs.kc-arm .kc-cs__line{stroke-dasharray:100;stroke-dashoffset:100}
.kc-cs.kc-in .kc-cs__line{animation:kc-draw 1.6s cubic-bezier(.33,0,.15,1) forwards}
@keyframes kc-draw{to{stroke-dashoffset:0}}
.kc-cs.kc-arm .kc-cs__age,.kc-cs.kc-arm .kc-cs__lab,.kc-cs.kc-arm .kc-cs__ev--age::before{opacity:0}
.kc-cs.kc-in .kc-cs__age{animation:kc-pop .7s ease-out var(--d) forwards,kc-breath 4.5s ease-in-out calc(var(--d) + 1.4s) infinite}
.kc-cs.kc-in .kc-cs__lab,.kc-cs.kc-in .kc-cs__ev--age::before{animation:kc-fade .7s ease-out var(--d) forwards}
.kc-cs.kc-arm .kc-cs__dot{opacity:.2}
.kc-cs.kc-in .kc-cs__dot{animation:kc-lit .9s ease-out var(--d) forwards}
@keyframes kc-lit{from{opacity:.2;box-shadow:0 0 0 0 #9CC8EA}50%{opacity:1;box-shadow:0 0 0 6px rgba(156,200,234,.45)}to{opacity:1;box-shadow:0 0 0 0 rgba(156,200,234,0)}}
@keyframes kc-pop{from{opacity:0;transform:scale(.86)}to{opacity:1;transform:scale(1)}}
@keyframes kc-fade{from{opacity:0}to{opacity:1}}
@keyframes kc-breath{0%,100%{opacity:1;filter:none}50%{opacity:1;filter:drop-shadow(0 0 8px var(--glow))}}
@container (max-width:880px){
 .kc-cs__in{height:auto;padding-left:6px}
 .kc-cs__rail{display:none}
 .kc-cs__list{position:relative;border-left:3px solid #9CC8EA;margin-left:46px;padding:4px 0}
 .kc-cs__ev,.kc-cs__ev--age{position:relative;left:auto;top:auto;bottom:auto;width:auto;min-height:40px;padding:8px 0 8px 70px}
 .kc-cs__ev--age{min-height:96px;display:flex;align-items:center}
 .kc-cs__ev--age::before{display:none}
 .kc-cs__dot,.kc-cs__ev--age .kc-cs__dot{left:-9px;top:16px}
 .kc-cs__ev--age .kc-cs__dot{display:none}
 .kc-cs__age{left:-46px;top:50%;margin-top:-44px;width:88px;height:88px}
 .kc-cs__age .kc-num{font-size:32px}
 .kc-cs__lab,.kc-cs__ev--d .kc-cs__lab,.kc-cs__ev--u .kc-cs__lab,.kc-cs__ev:first-child .kc-cs__lab,.kc-cs__ev:last-child .kc-cs__lab{position:static;transform:none;text-align:left;white-space:normal;gap:4px;padding-left:0}
 .kc-cs__ev--age .kc-cs__lab{padding-left:6px}
 .kc-cs__w{display:inline-block}
}
@media (prefers-reduced-motion:reduce){.kc-chart *{animation:none!important}}

/* ===== 動きを減らす設定の写し（kit tools/reduce_copy.py が作る。ここは直さない） ===== */
html[data-motion=reduce] .kc-chart *{animation:none!important}
/* ===== 写しここまで ===== */
