/* 全体設定 */
body {
  margin: 0;
  font-family: "ヒラギノ明朝 ProN W6";
  background-color: white;
}

.container {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
}


/* ヘッダー */
header {
  background-color: #00bfff;
  text-align: center;
  padding: 20px 0;
}

header h1 {
  color: white;
  font-size: 3em;
  margin: 0;
  font-weight: bold;
}

header ul {
  list-style: none;
  padding: 0;
  margin: 10px 0 0;
  display: flex;
  justify-content: center;
  gap: 30px;
}

header ul li a {
  text-decoration: none;
  font-weight: bold;
  font-size: 1.2em;
  color: blue;
}

header .container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px; /* タイトルとナビゲーションの間隔 */
}

.site-title {
    font-size: 3em; /* "portfolio"の大きなフォント */
    font-weight: bold;
    color: #ffffff; /* 白い文字色 */
    margin: 0;
    letter-spacing: 2px;
}

/* メイン画像部分 */
main {
  text-align: center;
  padding: 0px 0;
}

.image-section img {
  width: 100vw;  /* 画面の横幅ぴったり */
  height: auto;
  display: block;
  margin: 0;
}
 

/* フッター */
footer {
  background-color: #00bfff;
  text-align: center;
  padding: 20px;
}

footer p {
  margin: 0;
  color: yellow;
  font-weight: bold;
}