*{box-sizing:border-box}html{color-scheme:light}body{margin:0;background:#fff;color:#171717;font-family:Arial,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;font-size:16px;line-height:1.6}main{max-width:880px;margin:0 auto;padding:32px 28px 48px}header{display:flex;align-items:center;gap:22px;border-bottom:2px solid #171717;padding-bottom:24px;font-size:16px}.wordmark{font-size:48px;font-weight:900;letter-spacing:-4px;color:#171717;text-decoration:none;line-height:1}.wordmark span{color:#e32323;margin-left:5px}.english{font-size:12px;letter-spacing:.04em}h1{font-size:18px;font-weight:400;margin:36px 0 28px}.project{border-bottom:1px solid #aaa;padding-bottom:24px;margin-bottom:36px}.project-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.number{font-size:14px;color:#595959;margin:0 0 6px}h2{font-size:clamp(25px,5.5vw,34px);line-height:1.35;margin:0 0 12px;letter-spacing:-1px}a{color:#1638d0;text-underline-offset:5px}a:hover{color:#b51313}a:focus-visible{outline:3px solid #e32323;outline-offset:5px}.project-heading p:last-child{margin:0}.project-image{display:block;flex:0 0 144px}.project-image img{display:block;width:100%;height:auto;object-fit:contain}.works{list-style:none;margin:28px 0 0;padding:0}.works li{border-top:1px solid #e1e1e1}.works a{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:16px 0;font-size:20px;font-weight:700;text-decoration:none}.works a>span:first-child{text-decoration:underline}.action{font-size:16px;font-weight:400;color:#555;text-align:right}footer{display:flex;justify-content:space-between;gap:16px;font-size:14px;color:#595959}@media(max-width:540px){main{padding:24px 20px calc(32px + env(safe-area-inset-bottom))}header{gap:16px}.english{display:block;font-size:12px;max-width:230px;line-height:1.4;margin-top:4px}h1{margin:28px 0 24px}.project-heading{align-items:flex-start}.project-image{flex-basis:86px;padding-top:16px}.project-heading p:last-child{max-width:220px}.works a{flex-direction:column;gap:2px;padding:14px 0}.action{text-align:left;font-size:14px}}@media(max-width:350px){.project-heading{flex-wrap:wrap}.project-image{padding-top:0}header{flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
