body {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: Arial, sans-serif;
  margin: 0;
  padding: 0;
  height: 100vh;
  background-image: url('https://blog.nare.jp/wp-content/uploads/2024/11/backimage.gif');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

h1 {
  color: #ffffff; /* タイトルの文字色を白に設定 */
}

#score {
  font-size: 1.5em;
  margin-bottom: 20px;
  color: #ffffff;
}

/* リセットボタンのスタイル */
#resetButton {
  position: absolute;
  bottom: 20px; /* 下部に配置 */
  left: 50%; /* 水平方向に中央寄せ */
  transform: translateX(-50%); /* 左への移動で完全な中央揃え */
  background-color: gold; /* ボタンの色をゴールドに設定 */
  color: #000;
  border: none;
  padding: 10px 20px;
  font-size: 1em;
  cursor: pointer;
  border-radius: 5px;
}

/* リセットボタンのホバー効果 */
#resetButton:hover {
  background-color: #ffd700; /* ゴールド色を少し明るく */
}

#gameArea {
  position: relative;
  width: 100%;
  height: 80vh;
}

.target {
  position: absolute;
  width: 100px;
  height: 100px;
  cursor: pointer;
}