/* 基本的なリセット */
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box; /* 全ての要素のボックスサイズを統一 */
}

/* フォントサイズと行間のリセット */
html {
  font-size: 100%; /* 基本のフォントサイズを100%に設定 */
}

/* aタグのスタイル */
a {
  text-decoration: none; /* 下線を削除 */
  color: inherit; /* 親要素の色を引き継ぐ */
}

/* リストのスタイル */
ul,
ol {
  list-style: none; /* リストアイテムのデフォルトのマーカーを削除 */
}

/* インプットフィールドのスタイル */
input,
textarea,
button,
select {
  background: none; /* 背景をリセット */
  border: none; /* ボーダーを削除 */
  outline: none; /* フォーカス時のアウトラインを削除 */
  font: inherit; /* フォントを親要素から引き継ぐ */
}

/* テーブルのスタイル */
table {
  border-collapse: collapse; /* ボーダーを重ねずに表示 */
  width: 100%; /* 幅を100%に設定 */
}

th,
td {
  text-align: left; /* テキストの位置揃え */
  padding: 0.5rem; /* セル内の余白 */
}

/* フォーム要素 */
input[type="checkbox"],
input[type="radio"] {
  -webkit-appearance: none; /* Safariのチェックボックスのスタイルを削除 */
  -moz-appearance: none; /* Firefoxのチェックボックスのスタイルを削除 */
  appearance: none; /* チェックボックスのスタイルをリセット */
  margin: 0;
}

/* デフォルトのフォントサイズを設定 */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
  margin: 0;
}

/* 画像のスタイル */
img {
  max-width: 100%; /* 画像が親要素を超えないように設定 */
  display: block; /* 画像の下に隙間ができないように設定 */
}

/* 詳細なリセットが必要ない場合もありますが、基本的な要素に対するスタイルはこれで十分です */
