/* リセットCSS */
*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 100%; /* ベースフォントサイズ */
}

body {
    font-family: sans-serif; /* 基本フォント */
    line-height: 1.5; /* 行間 */
    background-color: #fff; /* 背景色 */
    color: #333; /* 文字色 */
    -webkit-text-size-adjust: 100%; /* スマホでのフォントサイズ自動調整を無効化 */
}

a {
    text-decoration: none; /* リンクの下線を消す */
    color: inherit; /* リンクの色は親要素の色を引き継ぐ */
}

ul, ol {
    list-style: none; /* リストのデフォルトの丸や数字を消す */
}

table {
    border-collapse: collapse; /* テーブルのボーダーを1つにまとめる */
    width: 100%; /* テーブルの幅を100%にする */
}

img, video {
    max-width: 100%; /* 画像や動画が親要素の幅を超えないようにする */
    height: auto; /* 高さを自動で調整 */
}

input, button, textarea, select {
    font: inherit; /* フォントサイズとフォントファミリを親要素から継承 */
    background: none; /* 背景をリセット */
    border: none; /* ボーダーをリセット */
    outline: none; /* フォーカス時のアウトラインをリセット */
}

button, select {
    cursor: pointer; /* ボタンやセレクトボックスにカーソルを表示 */
}

fieldset {
    border: none; /* fieldsetのボーダーをリセット */
    padding: 0;
    margin: 0;
}

form {
    display: block; /* formタグのデフォルトのスタイルをリセット */
}

hr {
    border: none; /* hrのボーダーをリセット */
    border-top: 1px solid #ccc; /* 1pxの薄いグレーの線を表示 */
    margin: 1em 0; /* 上下に余白 */
}

code {
    font-family: 'Courier New', Courier, monospace; /* コード表示用フォント */
    font-size: 1em; /* コードのフォントサイズ */
}

small {
    font-size: 0.875em; /* 小さな文字サイズ */
}

textarea {
    resize: vertical; /* テキストエリアのサイズ変更を縦方向に制限 */
}

/* フォーム入力のプレースホルダーテキスト */
input::placeholder,
textarea::placeholder {
    color: #888; /* プレースホルダーテキストの色 */
}

/* 一部ブラウザの不具合を解消 */
audio,
canvas,
iframe,
img,
svg,
video {
    display: block; /* インライン要素の問題を解消 */
}

/* flexboxなどの要素に適用 */
[hidden] {
    display: none !important; /* 非表示の要素を強制的に非表示 */
}