.detail-page .header{position:relative;background:#fff}.detail-main{padding:40px var(--gutter) 0;max-width:1560px;margin:auto}.detail-back{font-size:13px;margin:8px 0 60px}.case-hero .eyebrow{margin-bottom:20px}.case-hero h1{font-size:clamp(56px,8vw,116px);line-height:1.1;letter-spacing:-.065em;font-weight:500}.case-subtitle{font-size:clamp(22px,2.5vw,36px);line-height:1.6;margin-top:25px;letter-spacing:-.04em}.case-summary{display:grid;grid-template-columns:1fr 170px;gap:80px;max-width:1050px;margin-top:35px;align-items:start}.case-summary>p:first-child{font-size:17px;color:#5e625f;line-height:2}.case-period{font-size:16px}.case-period .eyebrow{color:#747974;font-size:11px}.detail-photo{margin:55px 0 0;position:relative;overflow:hidden;max-height:640px}.detail-photo img{width:100%;height:100%;object-fit:cover}.detail-photo figcaption{position:absolute;bottom:24px;left:28px;color:white;font-size:12px;letter-spacing:.15em;text-shadow:0 2px 5px #000}.case-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:55px;background:var(--light);padding:38px 0}.case-stats>div{padding:0 35px;border-right:1px solid #d4dfe4}.case-stats>div:last-child{border:0}.case-stats strong{display:block;font-size:clamp(26px,3.4vw,46px);line-height:1.4;font-weight:500;letter-spacing:-.05em}.case-stats span{display:block;font-size:13px;color:#626a6c;margin-top:8px}.case-section{display:grid;grid-template-columns:1fr 1fr;gap:65px;padding:80px 0;border-bottom:1px solid var(--line)}.case-section h2{font-size:clamp(25px,2.7vw,38px);margin-top:20px;max-width:520px}.case-section>p,.lessons p{font-size:16px;color:#606963;line-height:2.1}.case-flow{padding:70px 0;border-bottom:1px solid var(--line)}.flow-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:32px}.flow-heading h2{font-size:34px;margin-top:15px}.flow-heading>p{font-size:13px;color:var(--muted)}.flow-track{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;position:relative}.flow-step{cursor:pointer;text-align:left;padding:25px;background:var(--light);border:1px solid #dbe3e8;display:grid;grid-template-columns:1fr auto;gap:20px;font-size:19px;transition:background .25s,color .25s,transform .25s}.flow-index{grid-column:1/-1;font-size:12px;letter-spacing:.12em;color:#727c7e}.flow-step[aria-pressed=true]{background:var(--ink);color:white;border-color:var(--ink);transform:translateY(-5px)}.flow-step[aria-pressed=true] .flow-index{color:#ffb476}.flow-arrow{color:var(--orange)}.flow-detail{display:grid;grid-template-columns:70px 1fr;gap:25px;align-items:start;margin-top:25px;padding:28px;background:var(--light);min-height:120px}.flow-detail p{font-size:16px;max-width:800px}.lessons article+article{margin-top:30px}.lessons h3{font-size:21px;font-weight:500;line-height:1.6;margin-bottom:12px}.technical{border-bottom:1px solid var(--line);padding:30px 0}.technical summary{display:flex;justify-content:space-between;gap:20px;cursor:pointer;list-style:none;font-size:17px;font-weight:500}.technical summary::-webkit-details-marker{display:none}.technical[open] summary>span:last-child{transform:rotate(45deg)}.technical-note{font-size:13px;color:var(--muted);margin-top:25px}.technical .work-detail__section{padding:25px 0 20px;max-width:900px;margin:auto}.technical .arch{overflow:auto;padding:28px;background:var(--light);margin-bottom:25px}.technical .arch svg{display:block;width:100%;min-width:600px;height:auto}.arch-box{fill:#fff;stroke:#c4d1d7;stroke-width:1}.arch-box--fill{fill:#e2edf3}.arch-arrow{stroke:#d17b37;stroke-width:1}.arch-title,.arch-body{fill:var(--ink);font-family:inherit;font-size:13px}.arch-mono-muted{fill:#64747a;font-size:10px;letter-spacing:.03em}.stack-row{display:grid;grid-template-columns:130px 1fr;gap:20px;padding:16px 0;border-bottom:1px solid var(--line)}.stack-role{font-size:13px;color:var(--muted)}.chip{display:inline-block;padding:3px 9px;border:1px solid #d4dce1;font-size:12px;margin:2px;color:#495459}.work-detail__p{font-size:15px;color:#5c665f;margin-top:25px;line-height:2}.work-detail__p em{font-style:normal;color:var(--ink)}.case-cta{display:flex;align-items:center;justify-content:space-between;gap:40px;padding:70px 0}.case-cta h2{font-size:28px;margin-top:18px}.case-cta .button{flex-shrink:0}.case-next{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:35px 0 70px;border-top:1px solid var(--line)}.case-next>a:first-child{font-size:14px}.case-next>a:last-child{display:flex;flex-direction:column;gap:10px;text-align:right}.case-next strong{font-size:28px;font-weight:500;letter-spacing:-.035em}.case-next .eyebrow{font-size:11px;color:var(--muted)}.detail-page footer{background:var(--light)}.lang-ja .i18n-en,.lang-en .i18n-ja{display:none!important}
@media(max-width:700px){.detail-main{padding-top:25px}.detail-back{margin-bottom:35px}.case-hero h1{font-size:clamp(43px,12vw,75px);overflow-wrap:anywhere;letter-spacing:-.06em}.case-hero .eyebrow{font-size:10px}.case-subtitle{font-size:23px}.case-summary{grid-template-columns:1fr;gap:20px;margin-top:25px}.case-summary>p:first-child{font-size:15px}.case-period{font-size:14px}.detail-photo{margin-top:30px;aspect-ratio:1.2}.detail-photo figcaption{font-size:10px;bottom:15px;left:16px}.case-stats{margin-top:32px;padding:22px 0;grid-template-columns:1fr}.case-stats>div{padding:15px 24px;border-right:0;display:grid;grid-template-columns:1fr 1.2fr;align-items:center;gap:20px}.case-stats strong{font-size:29px}.case-stats span{font-size:12px;margin:0}.case-section{grid-template-columns:1fr;gap:25px;padding:45px 0}.case-section h2{font-size:27px;margin-top:14px}.case-section>p,.lessons p{font-size:15px}.case-flow{padding:45px 0}.flow-heading{display:block;margin-bottom:25px}.flow-heading h2{font-size:28px}.flow-heading>p{font-size:12px;margin-top:12px}.flow-track{grid-template-columns:repeat(2,1fr);gap:12px}.flow-step{padding:18px;font-size:16px;gap:12px}.flow-step[aria-pressed=true]{transform:translateY(-3px)}.flow-detail{grid-template-columns:1fr;gap:12px;padding:20px;min-height:170px}.flow-detail p{font-size:15px}.lessons h3{font-size:19px}.technical summary{font-size:15px}.technical .arch{padding:15px}.stack-row{grid-template-columns:80px 1fr;gap:15px}.stack-role{font-size:12px}.case-cta{display:block;padding:45px 0}.case-cta h2{font-size:25px}.case-cta .button{margin-top:25px}.case-next{padding-bottom:45px}.case-next>a:first-child{font-size:12px}.case-next strong{font-size:20px}.case-next .eyebrow{font-size:10px}}