/*
 * CSS Reset (シンプルなリセットCSS)
 * ブラウザのデフォルトスタイルを打ち消し、一貫した表示を実現します。
 */

/* すべての要素のmarginとpaddingをリセット */
*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box; /* box-sizingをborder-boxに設定 */
}

/* HTML5のセマンティック要素をブロックレベル要素として扱う */
article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
    display: block;
}

/* body要素のデフォルトスタイルを設定 */
body {
    line-height: 1.5; /* 行の高さを設定し、読みやすくする */
    -webkit-font-smoothing: antialiased; /* フォントのアンチエイリアスを適用 (WebKit系ブラウザ) */
    text-rendering: optimizeLegibility; /* テキストのレンダリングを最適化 */
}

/* 画像が親要素からはみ出さないように設定 */
img, picture, video, canvas, svg {
    display: block; /* インライン要素からブロック要素に変更 */
    max-width: 100%; /* 親要素の幅を超えないようにする */
}

/* 見出し要素と段落要素のデフォルトのmarginをリセット */
h1, h2, h3, h4, h5, h6, p {
    font-size: inherit; /* 親要素からフォントサイズを継承 */
    font-weight: inherit; /* 親要素からフォントウェイトを継承 */
}

/* input, textarea, select, button のフォントを継承 */
input, button, textarea, select {
    font: inherit;
}

/* ul, ol のリストスタイルをリセット */
ul, ol {
    list-style: none;
}

/* a要素のテキスト装飾をリセット */
a {
    text-decoration: none;
    color: inherit; /* 親要素から色を継承 */
}

/* button要素のデフォルトスタイルをリセット */
button {
    background: none;
    color: inherit;
    border: none;
    padding: 0;
    font: inherit;
    cursor: pointer;
    outline: inherit;
}

/*
 * その他の考慮事項:
 * - 特定のプロジェクトやフレームワークによっては、より詳細なリセットやノーマライズCSS (例: Normalize.css, Reset.css by Eric Meyer) が推奨される場合があります。
 * - box-sizing: border-box; は、パディングやボーダーが要素の幅や高さに含まれるようにするため、レイアウト計算を容易にします。
 */