/*
Theme Name: Re2017 COLOR POINTE Child
Template: colorpointe_2017
Author: 株式会社Creatal・Works
Author URI: http://www.creatalw.com/
Description: Re2017 COLOR POINTE Theme
Version: 1.0.0.1753508803
Updated: 2025-07-26 14:46:43

*/

.flyer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
  margin: 2rem 0;
}
.flyer-item figure {
  margin: 0;
  overflow: hidden;
  border-radius: 4px;
}
.flyer-item img {
  width: 100%;
  height: auto;
  display: block;
}
.flyer-item figcaption {
  padding: 0.5rem;
  font-size: 0.9rem;
  text-align: center;
}

/* 過去フライヤー一覧のキャプション全体 */
.flyer-item figcaption {
  color: #FFFFFF;      /* 文字色 */
  font-size: 16px;     /* フォントサイズ */
  line-height: 1.4;
}

/* ヘッダー直後のフライヤー一覧を下げる */
header.c-header-back + main.flyer-grid {
  padding-top: 8rem !important; /* ヘッダーの高さに合わせて調整 */
  box-sizing: border-box;
}


/* 過去フライヤー一覧全体を中央に寄せて、左右に余白を確保 */
.flyer-grid {
  max-width: 1200px;      /* ページ幅の上限。必要に応じて調整 */
  margin: 0 auto;         /* 左右の自動マージンで中央寄せ */
  padding: 0 2rem;        /* 左右にそれぞれ2remの内側余白 */
  box-sizing: border-box; /* パディング込みで幅を計算 */
}


.flyer-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;  /* 横方向に中央揃え */
  align-content: center;    /* 行が余ったときにまとめて中央に揃える */
}

.flyer-item {
  flex: 0 0 calc((100% - 2rem) / 3);
  box-sizing: border-box;
  display: flex;            /* 内部をフレックス化 */
  justify-content: center;  /* 横方向に中央揃え */
  align-items: center;      /* 縦方向に中央揃え ← ここを追加 */
}