:root{
  --primary:#15B5D6;
  --primary-d:#0E94B0;
  --ink:#16202b;
  --sub:#6b7682;
  --line:#e7eaef;
  --soft:#f4f8fa;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-font-smoothing:antialiased}
html{scroll-behavior:smooth}
body{
  color:var(--ink);
  background:#fff;
  font-family:"Noto Sans JP",system-ui,sans-serif;
  line-height:1.9;
}
a{color:inherit}
.wrap{width:min(100% - 48px,960px);margin:0 auto}
header{
  position:sticky;
  top:0;
  z-index:10;
  border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.9);
  backdrop-filter:saturate(180%) blur(12px);
}
.nav{height:64px;display:flex;align-items:center}
.logo{
  color:var(--ink);
  font-size:24px;
  font-weight:900;
  letter-spacing:.14em;
  text-decoration:none;
}
.hero{
  padding:72px 0 64px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(170deg,#EAF8FC 0%,#F6FCFE 58%,#fff 100%);
}
.eyebrow{
  color:var(--primary-d);
  font-size:13px;
  font-weight:800;
  letter-spacing:.14em;
}
h1{
  margin-top:8px;
  font-size:40px;
  font-weight:900;
  letter-spacing:.01em;
  line-height:1.35;
}
.intro{
  max-width:720px;
  margin-top:18px;
  color:#46525e;
  font-size:15px;
}
main{padding:72px 0 96px}
.legal-body{max-width:800px}
.article + .article{
  margin-top:42px;
  padding-top:42px;
  border-top:1px solid var(--line);
}
.article h2{
  margin-bottom:12px;
  font-size:21px;
  font-weight:900;
  line-height:1.5;
}
.article p,.article li{font-size:15px}
.article p + p{margin-top:10px}
.article ol,.article ul{margin-top:10px;padding-left:1.55em}
.article li + li{margin-top:5px}
.article ol.paren{list-style:none;padding-left:0}
.article ol.paren li{padding-left:2.8em;text-indent:-2.8em}
footer{padding:36px 0;background:var(--ink);color:#fff}
.footer-row{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
footer .logo{color:#fff}
.footer-links{display:flex;gap:22px;margin-left:auto;flex-wrap:wrap}
.footer-links a{color:#d3dae1;font-size:13px;text-decoration:none}
.footer-links a:hover{color:#fff}
.copyright{width:100%;padding-top:18px;border-top:1px solid rgba(255,255,255,.1);color:#8c98a4;font-size:12px}
@media(max-width:640px){
  .wrap{width:min(100% - 32px,960px)}
  .hero{padding:48px 0 44px}
  h1{font-size:30px}
  main{padding:50px 0 72px}
  .article + .article{margin-top:34px;padding-top:34px}
  .article h2{font-size:19px}
  .article p,.article li{font-size:14px}
  .footer-links{width:100%;margin-left:0}
}