/* ===== 全体のスタイル ===== */
* {
  margin: 0;
  padding: 0;
}

html {
  height: 100%;
}

body {
 background-color: ivory;
}

/* ===== ヘッダーのスタイル ===== */
/* ヘッダー */
header {
  /* 背景の色 */
  background-color: #b3302f;
  /* 背景の画像を枠いっぱいに広げる */
  background-size: cover;
  /* 内がわの余白 */
  padding: 50px;
}

/* h1見出し */
h1 {
  /* 文字の大きさ */
  font-size: 70px;
  /* 文字の種類 */
  font-family: 'Noto Sans JP', sans-serif;
  /* 文字の色 */
  color: ivory;
  /* 文字の整列 */
  text-align: center;
}

/* ===== メニューのスタイル ===== */
/* h2見出し */
h2 {
  /* 文字の色 */
  color: #ff8800;
  /* 文字の大きさ */
  font-size: 20px;
  /* 下がわの余白 */
  margin-bottom: 20px;
}

/* メニューのセクション */
.menu {
  padding: 30px;
}

/* コメント欄 */
table {
  background-color: #fff3b8;
  border-collapse: collapse;
  width: 100%;
  margin-bottom: 20px;
}

/* メニュー表のセル */
td {
  border: 1px solid black;
  padding: 10px;
}

/* メニュー表の見出しセル */
th {
  border: 1px solid black;
  padding: 10px;
  background-color: gold;
}

/* リンク */
a {
  color: blue;
}

/* リンクにさわった時 */
a:hover {
  color: purple;
}

.pla {
  zoom: 50%;
}
/* ===== フッターのスタイル ===== */
/* フッター */
footer {
  /* 文字の色 */
  color: white;
  /* 背景の色 */
  background-color: #b3302f;
  /* 文字の整列 */
  text-align: center;
  /* 内がわの余白 */
  padding: 20px;
}

.homepage {
  /* 文字の色 */
  color: brown;
  /* 背景の色 */
  background-color: gold;
  /* 内がわの余白 */
  padding: 10px;
  /* 文字の装飾 */
  text-decoration: none;
  /* 角丸 */
  border-radius: 20px;
  /* 並べ方 */
  display: block;
  /* 文字の整列 */
  text-align: center;
}

.homepage:hover {
  /* 文字の色 */
  color: gold;
  /* 背景の色 */
  background-color: brown;
  /* 内がわの余白 */
  padding: 10px;
  /* 文字の装飾 */
  text-decoration: none;
  /* 角丸 */
  border-radius: 20px;
  /* 並べ方 */
  display: block;
  /* 文字の整列 */
  text-align: center;
}