body {
    font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    margin: 0;
    line-height: 1.8;
    font-size: 17px; 
    color: #333;
}

header {
    background: #6cc4a1;
    color: white;
    text-align: center;
    padding: 5px 10px;
}

footer {
text-align: center;
padding: 20px;
background: #f4f4f4;
}

nav {
background: #eaf7f2;
text-align: center;
padding: 10px;
}

/* =========================================
   インフルエンザ予防接種案内
   ========================================= */

.flu-vaccine {
  max-width: 900px;
  margin: 40px auto;
  padding: 0 20px;
  color: #333;
  font-family:
    "Noto Sans JP",
    "Yu Gothic",
    "Hiragino Kaku Gothic ProN",
    Meiryo,
    sans-serif;
  line-height: 1.8;
  font-size: 17px;
}

/* ヘッダー */
.flu-header {
  background: linear-gradient(135deg, #2b82b8, #55a9d0);
  color: #fff;
  padding: 28px 25px;
  border-radius: 12px;
  text-align: center;
  margin-bottom: 25px;
}

.flu-header h2 {
  margin: 0 0 8px;
  font-size: 30px;
  font-weight: 700;
}

.flu-header p {
  margin: 0;
  font-size: 19px;
  font-weight: 600;
}


/* 接種対象 */
.flu-target {
  display: flex;
  align-items: center;
  gap: 18px;
  background: #eef8fc;
  border: 2px solid #b9deed;
  border-radius: 12px;
  padding: 20px 25px;
  margin-bottom: 30px;
}

.flu-target h3 {
  margin: 0 0 4px;
  color: #176b94;
  font-size: 21px;
}

.flu-target p {
  margin: 0;
  font-size: 22px;
}

.flu-icon {
  font-size: 38px;
}


/* 各セクション */
.flu-section {
  margin-bottom: 32px;
}

.flu-title {
  color: #176b94;
  font-size: 23px;
  border-left: 6px solid #3b9ac3;
  padding: 8px 0 8px 14px;
  margin: 0 0 18px;
}


/* カード */
.flu-card {
  background: #f7fbfd;
  border: 1px solid #d5e7ee;
  border-radius: 10px;
  padding: 20px 22px;
  margin-bottom: 15px;
}

.flu-card h4 {
  margin: 0 0 8px;
  color: #176b94;
  font-size: 21px;
}

.flu-card.senior {
  background: #fffaf0;
  border-color: #ead9ae;
}

.flu-card.senior h4 {
  color: #8a6515;
}


/* 料金 */
.flu-price {
  font-size: 28px;
  font-weight: 700;
  color: #d35b38;
  margin: 5px 0 15px;
}

.flu-price span {
  font-size: 16px;
  font-weight: normal;
}


/* 注意書き */
.flu-note {
  margin: 12px 0 0;
}

.small-note {
  font-size: 14px;
  color: #666;
  margin-top: 12px;
}


/* リスト */
.flu-card ul {
  margin: 10px 0;
  padding-left: 25px;
}

.flu-card li {
  margin-bottom: 5px;
}


/* 予約 */
.flu-important {
  background: #fff4e9;
  border: 2px solid #f0c38b;
  border-radius: 10px;
  padding: 18px 22px;
  margin-bottom: 15px;
}

.flu-important p {
  margin: 3px 0;
}

.flu-important strong {
  color: #c15a20;
  font-size: 20px;
}


/* 接種時間 */
.flu-time {
  text-align: center;
  background: #eef7f1;
  border: 2px solid #b8d9c2;
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 18px;
}

.flu-days {
  margin: 0;
  font-size: 21px;
  font-weight: 600;
  color: #39734a;
}

.flu-hours {
  margin: 5px 0 0;
  font-size: 32px;
  font-weight: 700;
  color: #2d6840;
}


/* 接種時間の注意 */
.flu-caution {
  background: #f8f8f8;
  border-left: 5px solid #999;
  padding: 14px 18px;
  margin-top: 18px;
}

.flu-caution p {
  margin: 3px 0;
}


/* お問い合わせ */
.flu-contact {
  text-align: center;
  background: #eef8fc;
  border-radius: 10px;
  padding: 20px;
  margin-top: 35px;
  color: #176b94;
  font-weight: 600;
}


/* =========================================
   スマートフォン対応
   ========================================= */

@media (max-width: 600px) {

  .flu-vaccine {
    margin: 20px auto;
    padding: 0 12px;
    font-size: 16px;
  }

  .flu-header {
    padding: 22px 15px;
    border-radius: 10px;
  }

  .flu-header h2 {
    font-size: 23px;
  }

  .flu-header p {
    font-size: 17px;
  }

  .flu-target {
    padding: 16px;
    gap: 12px;
  }

  .flu-icon {
    font-size: 30px;
  }

  .flu-target h3 {
    font-size: 18px;
  }

  .flu-target p {
    font-size: 20px;
  }

  .flu-title {
    font-size: 20px;
  }

  .flu-card {
    padding: 17px;
  }

  .flu-card h4 {
    font-size: 19px;
  }

  .flu-price {
    font-size: 25px;
  }

  .flu-hours {
    font-size: 27px;
  }

  .flu-days {
    font-size: 18px;
  }

  .flu-important strong {
    font-size: 18px;
  }

}