@charset "utf-8";


nav a {
  margin: 0 10px;
  padding: 8px 15px;
  background-color: #ffffffaa;
  border-radius: 15px;
  text-decoration: none;
  color: #666;
  font-weight: bold;
}

nav a:hover {
  background-color: #bcffdd;
}


body{
	background-color:#019a66;
	margin: 100px 50px;
	}



.main {
  text-align: center;
}


#flower {
  max-width: 1200px;   /* ← 好きな幅に調整OK */
  margin: 0 auto;     /* ← 中央寄せ */
}

#flower img {
  width: 100%;
  height: 250px;
  object-fit: cover;
}



#flower ul {
  display: grid;  /* ← これ追加！！ */
  grid-template-columns: repeat(3, 1fr); /* ← 3枚ずつ */
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}


#sky {
  max-width: 1200px;   /* ← 好きな幅に調整OK */
  margin: 0 auto;     /* ← 中央寄せ */
}

#sky img {
  width: 100%;
  height: 250px;
  object-fit: cover;
}



#sky ul {
  display: grid;  /* ← これ追加！！ */
  grid-template-columns: repeat(3, 1fr); /* ← 3枚ずつ */
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}