:root{
  --washi:#FAF7F0;
  --ink:#26241F;
  --ink-soft:#6B675E;
  --line:#E4DFD3;
  --indigo:#1F3A5F;
  --accent:#C73E2E;
}
*{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic UI","Yu Gothic",Meiryo,system-ui,sans-serif;
  background:var(--washi);
  color:var(--ink);
  min-height:100vh;
}
.hero{
  background:linear-gradient(175deg,#1F3A5F,#162944);
  color:#fff;
  padding:44px 20px 52px;
  text-align:center;
  position:relative;
}
.hero::after{
  content:'';
  position:absolute;left:0;right:0;bottom:-1px;height:12px;
  background:radial-gradient(circle at 12px -4px, transparent 13px, var(--washi) 14px);
  background-size:25px 16px;
  background-position:bottom;
}
.hero h1{font-size:30px;font-weight:700;letter-spacing:.2em}
.hero p{font-size:12px;opacity:.75;margin-top:8px;letter-spacing:.1em}
.list{
  max-width:480px;
  margin:28px auto 0;
  padding:0 18px 60px;
  display:grid;
  gap:14px;
}
a.card{
  display:block;
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:18px 20px;
  text-decoration:none;
  color:var(--ink);
  transition:transform .12s, box-shadow .12s;
}
a.card:active{transform:scale(.98)}
.card .k{font-size:10px;font-weight:700;letter-spacing:.18em;color:var(--accent)}
.card .t{font-size:17px;font-weight:700;margin-top:5px}
.card .d{font-size:12px;color:var(--ink-soft);margin-top:5px;line-height:1.7}
.foot{text-align:center;font-size:11px;color:var(--ink-soft);padding-bottom:24px}
.test-footer{
  border-top:1px solid var(--line);
  padding:16px 20px 28px;
  text-align:center;
  font-size:11px;
  color:var(--ink-soft);
}