html, body {
  height: 0;
  margin: 0;
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

main {
  flex: 1;
}

/* リリース日やカテゴリをまとめた部分のレイアウトを微調整 */
.release-date {
    font-size: 0.9rem;
}

  /* カテゴリのバッジ風装飾 */
.category-badge {
    background-color: #6c757d; /* お好みで変更 */
    font-size: 0.75rem;
    color: #fff;
    padding: 0.3em 0.5em;
    border-radius: 0.25rem;
}

  /* リストグループの各アイテムのホバー時 */
.list-group-item-action:hover {
    background-color: #f8f9fa;
}

  /* ニュースタイトルを少し目立たせる */
.news-title {
    font-size: 1rem;
}

  /* 矢印を微調整 */
.arrow-icon {
    font-size: 1.2rem;
}

  /* ページネーションのスタイル調整（Bootstrapのクラスを上書きする場合） */
.pagination .page-item .page-link {
    color: #6c757d;
}
.pagination .page-item.active .page-link {
    background-color: #6c757d;
    border-color: #6c757d;
    color: #fff;
}

.list-group-item {
    padding: 40px 15px;
}