@charset "UTF-8";

/* ============================================================
   news.css
   お知らせ・キャンペーン一覧（index / 各店舗ページ 共通）
   ・デザインは index.html のお知らせ一覧に準拠
   ・共通パーツは common.css を参照
   （.section-padding / .sp-only / .sp-br / .container は common.css 定義）
============================================================ */

/* セクション見出し（index.css と同一定義。店舗ページ用に持たせる） */
.section-title {
  text-align: center;
  font-size: 2.0rem;
  font-weight: 300;
  color: var(--text-heading);
  margin-bottom: 50px;
  letter-spacing: 0.1em;
  font-family: var(--font-mincho);
  display: block;
}
@media screen and (max-width: 768px) {
  .section-title { font-size: 1.4rem; }
}

.news-section { background-color: #ffffff; }
.news-section-wrap {
  max-width: 900px;
  margin: 0 auto;
  padding: 50px 40px;
  background-color: #ffffff;
  border-radius: 0;
}
.news-list-wrap {
  max-width: 800px;
  margin: 0 auto;
  padding: 0;
  background-color: transparent;
}
.news-list { list-style: none; padding: 0; margin: 0; }
.news-list li { border-bottom: 1px solid var(--border-color); }
.news-list a {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 20px 0;
  transition: opacity 0.3s;
}
.news-list a:hover { opacity: 0.7; }
.news-thumb {
  width: 140px;
  aspect-ratio: 16 / 9;
  flex-shrink: 0;
  border-radius: 4px;
  overflow: hidden;
}
.news-thumb img { width: 100%; height: 100%; object-fit: cover; }
.news-body { flex-grow: 1; font-family: var(--font-gothic); }
.news-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 10px;
  margin-bottom: 5px;
}
.news-date { color: var(--text-light); font-size: 0.95rem; }
.news-cat {
  border: 1px solid var(--text-light);
  border-radius: 20px;
  padding: 2px 12px;
  font-size: 0.87rem;
  color: var(--text-main);
  white-space: nowrap;
}
.news-title {
  font-family: var(--font-mincho);
  font-size: 0.95rem;
  color: var(--text-heading);
  margin: 0;
  line-height: 1.4;
  font-weight: normal;
}

/* 読み込み中／該当なし／エラー時の文言 */
.news-empty {
  text-align: center;
  font-family: var(--font-gothic);
  font-size: 0.95rem;
  color: var(--text-light);
  padding: 24px 0;
  margin: 0;
}

/* 「お知らせ一覧を見る」リンク（任意） */
.news-more { text-align: center; margin: 28px 0 0; }
.news-more a {
  font-family: var(--font-gothic);
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--color-blue-ink);
}
.news-more a::after { content: ' ›'; }

@media screen and (max-width: 768px) {
  .news-section-wrap { padding: 40px 20px; }
  .news-list a { padding: 15px 0; gap: 12px; }
  .news-thumb { width: 90px; }
  .news-meta { margin-bottom: 3px; gap: 8px; }
  .news-date { font-size: 0.9rem; }
  .news-cat { font-size: 0.84rem; padding: 1px 8px; }
  .news-title { font-size: 0.97rem; }
}