*,*::before,*::after{box-sizing:border-box;}
/* overflow-x:hidden: 100vwがスクロールバー分溢れるのを止める。clipはルートだと不確実 */
html{scroll-behavior:smooth; background:var(--c-base); overflow-x:hidden;}
body{
  margin:0; max-width:var(--site-max); margin-inline:auto; position:relative;
  color:var(--c-ink); /* 背景色は html 側。bodyに置くとテクスチャ(body::before)を覆う */
  font-family:var(--f-jp); font-size:var(--fs-body); line-height:var(--lh-body);
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:url("../img/bg/paper-tile.webp") repeat;
  opacity:.5;
}
img{max-width:100%; height:auto; display:block;}
a{color:inherit;}
[hidden]{display:none !important;}
.container{max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter);}
.en{font-family:var(--f-en); letter-spacing:.04em;}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
:focus-visible{outline:3px solid var(--c-sky-deep);outline-offset:2px;border-radius:2px;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:.001ms !important; transition-duration:.001ms !important;}
}