/* ────────── 月ナビ ────────── */
.month-nav {
  display: flex;
  flex-wrap: wrap;       /* 項目が多くても折り返し対応 */
  gap: 10px;              /* リンク間の余白 初期値は8px */
  margin-bottom: 2em;
}

.month-nav__item,
.month-nav__item:link,
.month-nav__item:visited {
  padding: 0.5em 1.5em;          /* 初期値は0.5em 1em */
  text-decoration: none;
  color: #3D5A00;           /* 未選択の文字色 */
  border: 1px solid #ccc;
  border-radius: 4px;
  background-color: #f9f9f9;
  font-size: 0.9rem;           /* 初期値は1rem */
  transition: all 0.2s ease;
}

.month-nav__item:hover {
    background-color: #C3DA93;
    border-color: #ccc;
    color: #fff;
}

.month-nav__item.is-active,
.month-nav__item.is-active:link,
.month-nav__item.is-active:visited {
  background-color: #3D5A00;
  color: #fff;           /* 選択中文字色 */
  border-color: #ccc;
}

/* ────────── モバイル対応 ────────── */
@media screen and (max-width: 600px) {
  .month-nav {
    flex-direction: column;
  }
  .month-nav__item {
    flex: 1 1 100%;
    text-align: center;
    font-size: 1.1rem;
  }
}