@charset "UTF-8";

/* =========================================================
   教材照合メモ
   照合元：『よくわかる はじめてのHTML＆CSSコーディング
   HTML Living Standard準拠』（全288ページ）

   reset.cssは、ブラウザーごとに異なる初期表示をそろえるファイルです。
   「セレクター { プロパティ: 値; }」の順で読みます。

   【教材に掲載されている記述】
   ・@charset、margin、padding、max-width、height、display、color、
     text-decoration、border-collapse。

   【教材に掲載されていない記述：使用位置と目的】
   ・*::before / *::after：全要素の疑似要素まで同じ余白計算にします。
   ・box-sizing: border-box：paddingとborderをwidth・heightの内側に含めます。
   ・scroll-behavior: smooth：TOPリンクのページ内移動をなめらかにします。
   ・font: inherit：inputとtextareaへbodyのフォント設定を引き継ぎます。
   ・list-style-type: none：ulとolの行頭記号を消します。
   ・border-spacing: 0：物件概要表のセル間に標準の隙間を作りません。
   ・inherit値：親要素の設定を子要素へ明示的に引き継ぎます。
========================================================= */

/* universal selector：すべての要素と疑似要素の余白計算をborder-boxに統一します。 */
*,
*::before,
*::after {
  box-sizing: border-box; /* paddingとborderをwidth/heightの内側に含め、レイアウトの計算を簡単にします。 */
}

/* html：ページ全体のスクロール動作を管理します。 */
html {
  scroll-behavior: smooth; /* ページトップへ戻るリンクをクリックしたとき、移動をなめらかにします。 */
}

/* body・見出し・段落・リストなど：ブラウザー標準の余白を消します。 */
body,
h1,
h2,
h3,
h4,
p,
ul,
ol,
li,
figure,
table,
th,
td {
  margin: 0; /* 外側余白を0にし、CSS側で余白を管理しやすくします。 */
  padding: 0; /* 内側余白を0にし、要素ごとのズレを防ぎます。 */
}

/* ul・ol：ナビゲーションやカードで使いやすいように行頭記号を消します。 */
ul,
ol {
  list-style-type: none; /* 黒丸や番号を非表示にします。教材外の個別プロパティなので先頭一覧にも記録しています。 */
}

/* img：画像が親要素からはみ出さないようにします。 */
img {
  max-width: 100%; /* 親要素より横幅が大きくならないようにします。 */
  height: auto; /* 元画像の縦横比を保ちます。 */
  display: block; /* 画像下に出る余白を防ぎます。 */
}

/* a：リンクの見た目をサイト側のデザインで管理します。 */
a {
  color: inherit; /* 親要素の文字色を引き継ぎます。 */
  text-decoration: none; /* 標準の下線を消します。 */
}

/* input・textarea：フォーム部品のフォントを本文に合わせます。 */
input,
textarea {
  font: inherit; /* bodyで指定したフォントをフォームにも使います。 */
}

/* table：表の枠線を重ねて表示します。 */
table {
  border-collapse: collapse; /* 隣り合うセルの線を重ね、二重線を防ぎます。 */
  border-spacing: 0; /* セル間の標準余白を消します。 */
}
