/* リセットと基本設定 */

{ margin: 0; padding: 0; box-sizing: border-box; } body { font-family: "Segoe UI", sans-serif; line-height: 1.6; color: #333; background-color: #fdfdfd; }
.container {
width: 90%; max-width: 960px; margin: 0 auto; padding: 1rem; }

/* ヘッダー */ header { background-color: #1a2a6c; color: white; text-align: center; padding: 2rem 1rem; position: relative; } .logo { max-width: 180px; width: 60%; height: auto; margin-bottom: 1rem; } header h1 { font-size: 2.2rem; margin-bottom: 0.5rem; } .catchcopy { font-size: 1.1rem; color: #e0e0e0; }

/* ナビゲーション 共通スタイル */
.nav {
  list-style: none;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 1rem;
  padding: 0;
}

.nav li a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 140px;
  height: 40px;
  text-decoration: none;
  border-radius: 4px;
  color: #ffffff;
  background-image: linear-gradient(45deg, #FFC107 0%, #ff8b5f 100%);
  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
  border-bottom: solid 3px #c58668;
}

/* アクティブ時（クリック時）のスタイル */
.nav li a:active {
  transform: translateY(4px);
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
  border-bottom: none;
}

/* スマホ表示用ナビゲーション修正 */
@media screen and (max-width: 768px) {
  .nav {
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
  }

  .nav li {
    width: 100%;
    max-width: 280px;
  }

  .nav li a {
    width: 100%;
    justify-content: center;
  }
}


/* ハンバーガーメニュー（スマホ用） */ #nav-toggle {
  display: none;
  position: absolute;
  top: 1rem;
  right: 1rem;
  font-size: 2rem;
  color: white;
  background: none;
  border: none;
  cursor: pointer;
  z-index: 1000;
}

/* メインセクション */ main { padding: 2rem 1rem; text-align: center; } .intro {text-align: left;} .intro p { margin-bottom: 1rem; font-size: 1.05rem; }
/* お問い合わせフォーム */
.contact-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-top: 1.5rem;
}

.contact-form label {
  font-weight: bold;
}

.contact-form input,
.contact-form textarea {
  width: 100%;
  padding: 0.7rem;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 1rem;
}

.contact-form button {
  align-self: flex-start;
}

/* ボタン */ .btn { display: inline-block; padding: 0.7rem 1.5rem; background-color: #f4a742; color: white; border-radius: 6px; text-decoration: none; font-weight: bold; margin-top: 1rem; transition: background-color 0.3s; } .btn:hover { background-color: #e38d1d; }

/* フッター */ footer { background-color: #ffcc66; padding: 1rem; text-align: center; font-size: 0.9rem; }