@charset "UTF-8";

.tab-nav {
  display: flex;
  gap: 4px;
  border-bottom: 1.5px solid #e5e5e5;
  margin-bottom: 1.5rem;
  flex-wrap: wrap;
}

.tab-btn {
  padding: 8px 18px;
  font-size: 14px;
  border: none;
  background: none;
  color: #888;
  cursor: pointer;
  border-bottom: 2.5px solid transparent;
  margin-bottom: -1.5px;
  transition: color 0.15s, border-color 0.15s;
}
.tab-btn:hover  { color: #333; }
.tab-btn.active { color: #333; font-weight: 500; border-bottom-color: #534AB7; }


.tab-panel       { display: none; }
.tab-panel.active {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px;
}

/* お知らせ（TOP）タブパネルの表示制御 ※is-activeのみ表示 */
.sec-news__panel { display: none; }
.sec-news__panel.is-active { display: block; }