:root { --ink:#15243a; --navy:#12305a; --blue:#1466b8; --muted:#506278; --line:#cbd5df; --paper:#fff; --wash:#f3f7f9; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; } img { display:block; max-width:100%; } .shell { width:min(1120px,calc(100% - 48px)); margin:0 auto; }
.site-header { border-bottom:1px solid var(--line); } .nav-row { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; gap:11px; font-size:16px; font-weight:700; line-height:1.15; } .brand img { width:44px; height:44px; object-fit:contain; } .brand small { display:block; margin-top:2px; color:var(--muted); font-size:10px; font-weight:600; letter-spacing:.06em; }
nav { display:flex; align-items:center; gap:23px; color:var(--muted); font-size:14px; } nav a:hover { color:var(--blue); } .login-link { color:var(--navy); font-weight:700; }
.intro { padding:102px 0 46px; } .section-index { margin:0 0 22px; color:var(--blue); font-size:12px; font-weight:700; letter-spacing:.06em; } .intro-grid { display:grid; grid-template-columns:1.3fr .7fr; gap:60px; align-items:end; }
h1,h2,h3 { text-wrap:balance; } h1 { margin:0; font-size:clamp(38px,5.3vw,68px); line-height:1.12; letter-spacing:-.035em; font-weight:700; } .intro-copy { max-width:405px; padding-bottom:6px; } .intro-copy p { margin:0; color:var(--muted); font-size:16px; line-height:1.85; }
.intro-actions { display:flex; flex-wrap:wrap; gap:20px; margin-top:27px; }.text-action,.light-action { display:inline-flex; gap:10px; align-items:center; color:var(--blue); font-size:14px; font-weight:700; }.text-action span,.light-action span { font-size:18px; transition:transform .18s ease; }.text-action:hover span,.light-action:hover span { transform:translateX(4px); }.intro-rule { display:flex; gap:0; margin-top:96px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.intro-rule span { flex:1; padding:16px 14px; color:var(--muted); font-size:13px; }.intro-rule span+span { border-left:1px solid var(--line); }
.statement { background:var(--wash); }.statement-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:50px; padding:42px 0; }.statement p { margin:0; font-size:18px; line-height:1.6; }.statement p:first-child { color:var(--ink); font-weight:700; }.statement p:last-child { color:var(--muted); }
.section { padding:104px 0; }.section-title { max-width:720px; }.section-title h2 { margin:0; font-size:clamp(31px,4.1vw,51px); letter-spacing:-.035em; line-height:1.14; }.capability-list { margin-top:52px; border-top:1px solid var(--line); }.capability-list article { display:grid; grid-template-columns:120px 1fr; gap:20px; padding:25px 0 28px; border-bottom:1px solid var(--line); }.capability-list article>span { color:var(--blue); font-size:13px; font-weight:700; }.capability-list h3 { margin:0; font-size:23px; letter-spacing:-.02em; }.capability-list p { max-width:600px; margin:8px 0 0; color:var(--muted); font-size:15px; line-height:1.75; }
.project-band { padding:96px 0 102px; background:var(--navy); color:#fff; }.section-title-light .section-index { color:#9eccec; }.project-grid { display:grid; grid-template-columns:1fr .72fr; gap:65px; align-items:start; margin-top:50px; }.project-list { border-top:1px solid rgba(255,255,255,.35); }.project-list article { padding:21px 0; border-bottom:1px solid rgba(255,255,255,.35); }.project-list p { margin:0 0 9px; color:#9eccec; font-size:12px; font-weight:700; }.project-list h3 { margin:0; font-size:21px; letter-spacing:-.02em; }.project-list span { display:block; margin-top:8px; color:rgba(255,255,255,.65); font-size:13px; } figure { margin:0; } figure img { width:100%; aspect-ratio:1.7; object-fit:cover; } figcaption { margin-top:10px; color:rgba(255,255,255,.55); font-size:11px; }.light-action { margin-top:38px; color:#fff; }
.cooperate-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:80px; }.cooperate-copy { max-width:570px; padding-top:40px; }.cooperate-copy>p { margin:0; color:var(--muted); font-size:16px; line-height:1.85; }.cooperate-copy ul { margin:31px 0; padding:0; list-style:none; border-top:1px solid var(--line); }.cooperate-copy li { padding:13px 0; border-bottom:1px solid var(--line); font-size:14px; }
footer { padding:26px 0 34px; border-top:1px solid var(--line); color:var(--muted); font-size:12px; } footer .shell { display:flex; justify-content:space-between; gap:20px; }
a:focus-visible { outline:3px solid #8bc6ed; outline-offset:4px; } @media (max-width:760px) { .shell{width:min(100% - 32px,600px)} nav a:not(.login-link){display:none}.intro{padding:67px 0 35px}.intro-grid,.statement-grid,.project-grid,.cooperate-grid{grid-template-columns:1fr;gap:29px}.intro-rule{margin-top:55px;display:grid;grid-template-columns:1fr 1fr}.intro-rule span+span{border-left:0}.intro-rule span:nth-child(2n){border-left:1px solid var(--line)}.statement-grid{padding:31px 0}.section{padding:70px 0}.capability-list{margin-top:38px}.capability-list article{grid-template-columns:46px 1fr}.project-band{padding:70px 0}.project-grid{margin-top:37px}.cooperate-copy{padding-top:0} footer .shell{display:block} footer span+span{display:block;margin-top:7px} }
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.text-action span,.light-action span{transition:none}}