:root{
  --red:#FF0000; --navy:#1B4965; --charcoal:#2B2B2B; --ink:#1A1A1A;
  --gray:#F3F3F3; --line:#e3e3e3; --muted:#6b6b6b;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  color:var(--ink); background:#fff;
  font-family:"Yu Gothic","游ゴシック Medium","游ゴシック",YuGothic,-apple-system,"Segoe UI",
    "Hiragino Kaku Gothic ProN","Microsoft JhengHei","PingFang TC","Noto Sans TC","Noto Sans JP",sans-serif;
  line-height:1.85; -webkit-font-smoothing:antialiased;
}
.wrap{max-width:980px;margin:0 auto;padding:0 22px}
a{color:var(--navy)}
.serif{font-family:"Yu Mincho","游明朝",YuMincho,"Noto Serif TC","Noto Serif JP",serif}

/* language bar */
.langbar{background:#1f1f1f}
.langbar .wrap{display:flex;justify-content:flex-end;gap:16px;padding:9px 22px}
.langbar a{color:#9aa0a4;font-size:12px;letter-spacing:.08em;text-decoration:none}
.langbar a:hover{color:#fff}
.langbar a.on{color:#fff;font-weight:600}

/* hero */
.hero{background:var(--charcoal);color:#fff;border-bottom:3px solid var(--navy)}
.hero .wrap{padding:60px 22px 52px}
.hero img{height:40px;display:block;margin-bottom:26px}
.hero h1{font-weight:500;font-size:30px;letter-spacing:.04em;margin:0 0 10px;line-height:1.5}
.hero .en{color:#cfd6db;font-size:14px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:22px}
.hero .biz{display:flex;gap:10px;flex-wrap:wrap}
.hero .biz span{border:1px solid #54707f;border-radius:999px;padding:6px 14px;font-size:13px;color:#e8edf0}

section.block{padding:54px 0;border-bottom:1px solid var(--line)}
.lbl{color:var(--navy);font-size:12px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:8px}
h2{font-weight:500;font-size:22px;margin:0 0 18px;letter-spacing:.03em}
.philosophy p{font-size:17px;line-height:2.1;max-width:42em}

.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-top:6px}
.card{border:1px solid var(--line);border-radius:12px;padding:24px}
.card h3{margin:0 0 6px;font-size:17px}
.card .role{color:var(--navy);font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:10px}
.card p{margin:0;color:#3c3c3c;font-size:14px}
.card .loc{margin-top:14px;color:var(--muted);font-size:13px}

.info{display:grid;grid-template-columns:200px 1fr;gap:10px 20px;font-size:14px;max-width:680px}
.info dt{color:var(--muted)}
.info dd{margin:0}
.todo{display:inline-block;border:1px dashed #c9a23a;background:#fbf6e7;color:#8a6d16;border-radius:6px;padding:1px 8px;font-size:12px}

footer{padding:30px 0 50px;color:var(--muted);font-size:12px}
footer .wrap{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
@media(max-width:520px){.hero h1{font-size:23px}.info{grid-template-columns:1fr}}