/* Box sizing rules
すべての要素とその「疑似要素」に対して
paddingとborderを要素のwidthとheightに含む */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Prevent font size inflation
ウェブページ内の文字サイズが自動で調整されるのを防ぐ */
html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

/* Remove default margin in favour of better control in authored CSS
指定されたHTML要素に対して 「上下の余白を消す」 */
body, h1, h2, h3, h4, p,
figure, blockquote, dl, dd {
  margin-block-end: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed
role="list" という属性が付いたリストだけにリストスタイルなしにする */
ul[role='list'],
ol[role='list'] {
  list-style: none;
}

/* Set core body defaults */
body {
  min-height: 100vh; /* ページ全体が画面いっぱいの高さ */
  line-height: 1.5; /* 行間を調整して、テキストを読みやすくする */
}

/* Set shorter line heights on headings and interactive elements
行間1.1 */
h1, h2, h3, h4,
button, input, label {
  line-height: 1.1;
}

/* Balance text wrapping on headings
テキストをバランス良く改行させる */
h1, h2,
h3, h4 {
  text-wrap: balance;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
  text-decoration-skip-ink: auto; /* リンクの下線が文字に重ならないようにする */
  color: currentColor; /* リンクの文字色を親要素と揃える */
}

/* Make images easier to work with */
img,
picture {
  max-width: 100%; /* 画像が親要素からはみ出さないようにする */
  display: block; /* 余計な余白を消す */
}

/* Inherit fonts for inputs and buttons
親要素のフォント設定に従う（inherit） */
input, button,
textarea, select {
  font-family: inherit;
  font-size: inherit;
}

/* Make sure textareas without a rows attribute are not tiny
rows属性がないtextareaにだけ適用。
min-height: 10em; → 最低高さをフォントサイズの10倍（約160px）に設定 */
textarea:not([rows]) {
  min-height: 10em;
}

/* Anything that has been anchored to should have extra scroll margin
リンクでジャンプしたときのスクロール位置を調整 */
:target {
  scroll-margin-block: 5ex;
}