/* =========================================
   アーカイブ共通レイアウト
========================================= */
.archive-wrapper{
  max-width:960px;
  margin:0 auto;
  padding:32px 16px;
  font-family:'Noto Sans JP',sans-serif;
}
.archive-header{
  margin-bottom:32px;
  text-align:center;
}
.archive-title{
  font-size:32px;
  font-weight:700;
}
.archive-desc{
  margin-top:12px;
  color:#555;
}

/* ---------- フィルタバー ---------- */
.archive-filter-wrap{ margin-bottom:24px; }
.archive-filter-wrap summary{
  display:none;                           /* PC では非表示 */
  cursor:pointer;
  align-items:center;
  justify-content:space-between;
  background:#f5f5f5;
  padding:10px 14px;
  border:1px solid #ccc;
  border-radius:6px;
  font-size:1rem;
}
.archive-filter{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:flex-end;
  background:#fafafa;
  padding:14px 18px;
  border:1px solid #ccc;
  border-radius:6px;
}
.archive-filter label{ font-size:.85rem; }
.archive-filter input[type="date"],
.archive-filter select{
  padding:6px 8px;
  border:1px solid #ccc;
  border-radius:4px;
  font-size:.875rem;
}
.filter-btn{
  padding:6px 20px;
  background:#0A1238;
  color:#fff;
  border:none;
  border-radius:4px;
  cursor:pointer;
}

/* ---------- カード ---------- */
.cards-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:24px;
}
.card{
  background:#fff;
  border:1px solid #e0e0e0;
  border-radius:6px;
  overflow:hidden;
}
.card a{
  display:block;
  height:100%;
  color:inherit;
  text-decoration:none;                  /* 下線削除 */
}
.card-thumb{
  overflow:hidden;
  position:relative;
}
.card-thumb img{
  width:100%; height:auto; display:block;
  transition:transform .5s ease;
}
.card:hover .card-thumb img{ transform:scale(1.08); }  /* 画像ズームのみ */
.card-body{ padding:12px 16px 20px; }
.card-date{
  display:block;
  font-size:.75rem;
  color:#777;
  margin:2px 0 4px;
}
.card-title{
  font-size:1rem;
  font-weight:600;
  line-height:1.4;
  margin:0 0 8px;
  color:#222;
}
.card-excerpt{
  font-size:.85rem;
  color:#444;
  margin:0;
}

/* ---------- 投稿タイプバッジ ---------- */
.type-badge{
  display:inline-block;
  font-size:.7rem;
  font-weight:700;
  color:#fff;
  padding:2px 6px;
  border-radius:3px;
  margin-right:6px;
}
.type-badge.post   { background:#0A1238; } /* ブログ＝濃紺 */
.type-badge.column { background:#2da35c; } /* コラム＝緑   */
.type-badge.feature{ background:#ff9100; } /* 使い方＝橙   */

/* ---------- ページネーション ---------- */
.archive-pagination{ margin:40px 0; text-align:center; }
.archive-pagination ul{ list-style:none; margin:0; padding:0; display:inline-block; }
.archive-pagination li{ display:inline; }
.archive-pagination .page-numbers{
  display:inline-block;
  margin:0 6px;
  padding:8px 12px;
  border:1px solid #ccc;
  border-radius:4px;
  text-decoration:none;
  font-size:.85rem;
}
.archive-pagination .current{
  background:#0A1238;
  color:#fff;
  border-color:#0A1238;
}

/* ---------- レスポンシブ (≦768px) ---------- */
@media(max-width:768px){
  .archive-title{ font-size:24px; }
  .cards-grid{ grid-template-columns:1fr 1fr; gap:16px; }

  /* フィルタをアコーディオン化 */
  .archive-filter-wrap summary{ display:flex; }
  .archive-filter-wrap:not([open]) .archive-filter{ display:none; }

  .archive-filter{
    flex-direction:column;
    align-items:stretch;
    gap:8px;
    border-radius:0 0 6px 6px;
    border-top:none;
  }
  .archive-filter label,
  .archive-filter input[type="date"],
  .archive-filter select{ width:100%; }

  .filter-btn{ width:100%; }

  /* ページネーション：Prev/Next のみ */
  .archive-pagination .page-numbers{ display:none; }
  .archive-pagination .prev,
  .archive-pagination .next{
    display:inline-block;
    padding:10px 24px;
    border:1px solid #ccc;
    border-radius:4px;
    background:#f5f5f5;
    font-size:.9rem;
  }
}