:root{
  --paper:#F8F6F1;
  --paper-2:#EDE9E1;
  --ink:#1A1A18;
  --ink-2:#4A4844;
  --gray:#7C7973;
  --line:#BFBCB5;
  --gold:#C9A656;
  --en:"Figtree",system-ui,sans-serif;
  --jp:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN",sans-serif;
}

@font-face{ font-family:"Zen Kaku Gothic New"; font-weight:500; font-style:normal; font-display:swap; src:url(assets/fonts/zenkaku-500.woff2) format("woff2"); }
@font-face{ font-family:"Zen Kaku Gothic New"; font-weight:700; font-style:normal; font-display:swap; src:url(assets/fonts/zenkaku-700.woff2) format("woff2"); }
@font-face{ font-family:"Figtree"; font-weight:600 800; font-style:normal; font-display:swap; src:url(assets/fonts/figtree-600-800.woff2) format("woff2"); }
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ overflow-x:clip; }
body{
  font-family:var(--jp);
  font-weight:500;
  font-size:15px;
  line-height:2;
  letter-spacing:.02em;
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  font-feature-settings:"palt" 1;
  overflow-x:clip;
}
a{ color:inherit; }

.site-head{
  position:sticky; top:0; z-index:80;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  background:var(--ink); color:var(--paper);
  padding:14px 24px;
}
.site-head img{ width:150px; height:auto; display:block; }
.head-back{ font-family:var(--jp); font-weight:700; font-size:12px; letter-spacing:.1em; text-decoration:none; }
.head-back:hover{ text-decoration:underline; text-underline-offset:4px; }

main{ width:min(760px, 100% - 48px); margin:0 auto; padding:72px 0 120px; }
h1{ font-size:clamp(22px,2.6vw,30px); font-weight:700; letter-spacing:.06em; line-height:1.5; margin-bottom:10px; }
.page-date{ font-size:12px; color:var(--ink-2); margin-bottom:40px; }
h2{ font-size:17px; font-weight:700; letter-spacing:.06em; margin:40px 0 10px; padding-top:16px; border-top:1px solid var(--line); }
p{ margin:0 0 1em; }
ul{ padding-left:1.4em; margin:0 0 1em; }
li{ margin-bottom:.3em; }


.frame{ border-top:2px solid var(--ink); }
dl{ display:grid; grid-template-columns:13.5em 1fr; }
dt, dd{ padding:16px 0; border-bottom:1px solid var(--line); }
dt{ font-weight:700; letter-spacing:.06em; padding-right:16px; }
dd{ color:var(--ink); }
dd small{ display:block; font-size:12px; color:var(--ink-2); line-height:1.8; margin-top:4px; }

.tbd{ background:var(--paper-2); padding:0 .3em; color:var(--ink-2); }

.foot{ width:min(760px, 100% - 48px); margin:0 auto; padding:24px 0 48px; border-top:1px solid var(--line); font-size:12px; color:var(--ink-2); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.foot a{ text-decoration:none; }
.foot a:hover{ text-decoration:underline; }

@media (max-width:760px){
  main{ padding:48px 0 96px; }
  dl{ grid-template-columns:1fr; }
  dt{ padding-bottom:4px; border-bottom:0; }
  dd{ padding-top:0; }
}