@charset "UTF-8";
/*===============================
news.css
トップ / アーカイブ / シングルのニュース専用CSS
===============================*/

/* ============================================================
  ③ NEWS
============================================================ */
.home-news {
 padding: 60px 0 0;
}

@media screen and (min-width: 768px) {
 .home-news {
  padding: 72px 0 0;
 }
}

.home-news__head {
 display: flex;
 justify-content: space-between;
 align-items: flex-end;
 gap: 24px;
 margin-bottom: 20px;
 padding-bottom: 20px;
 border-bottom: 0.5px solid var(--border);
}

.home-news__grid {
 display: grid;
 grid-template-columns: 1fr;
 gap: 2px;
 padding: 2px;
 background: var(--border);
}

@media screen and (min-width: 768px) {
 .home-news__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
 }
}

.home-news__empty {
 padding: 32px 0;
 font-size: 13px;
 letter-spacing: 0.1em;
 color: var(--muted);
}

/*===============================
NEWS 共通 / アーカイブ / シングル
================================*/

/* ニュースカード */
.news-card {
 min-width: 0;
 background: var(--cream2);
}

.news-card__link {
 display: flex;
 flex-direction: column;
 height: 100%;
 color: var(--dark);
 text-decoration: none;
}

.news-card__img {
 position: relative;
 overflow: hidden;
 aspect-ratio: 16 / 10;
 background: #d8cfb8;
}

.news-card__img img {
 display: block;
 width: 100%;
 height: 100%;
 object-fit: cover;
 transition: transform 0.45s ease;
}

.news-card__link:hover .news-card__img img {
 transform: scale(1.03);
}

.news-card__placeholder {
 display: grid;
 place-items: center;
 width: 100%;
 height: 100%;
 background:
  linear-gradient(135deg, rgba(138, 110, 58, 0.08), transparent 55%), #ddd5bc;
}

.news-card__placeholder span {
 font-family: "Cormorant Garamond", serif;
 font-size: 14px;
 letter-spacing: 0.45em;
 color: rgba(28, 24, 16, 0.28);
 font-style: italic;
}

.news-card__body {
 display: flex;
 flex-direction: column;
 flex: 1;
 padding: 20px 20px 22px;
}

.news-card__date {
 display: block;
 margin-bottom: 10px;
 font-family: "Cormorant Garamond", serif;
 font-size: 12px;
 letter-spacing: 0.22em;
 color: var(--gold);
 font-style: italic;
}

.news-card__title {
 margin: 0;
 font-family: "Shippori Mincho B1", serif;
 font-size: 15px;
 font-weight: 400;
 line-height: 1.8;
 letter-spacing: 0.08em;
 color: var(--dark);
}

.news-card__excerpt {
 margin-top: 12px;
 font-size: 12px;
 line-height: 2;
 letter-spacing: 0.08em;
 color: var(--muted);
 font-weight: 300;
}

.news-card__more {
 display: inline-flex;
 align-items: center;
 gap: 10px;
 margin-top: auto;
 padding-top: 18px;
 font-family: "Cormorant Garamond", serif;
 font-size: 11px;
 letter-spacing: 0.3em;
 color: var(--gold);
 font-style: italic;
}

.news-card__more::after {
 content: "";
 width: 24px;
 height: 0.5px;
 background: var(--gold);
 transition: width 0.2s ease;
}

.news-card__link:hover .news-card__more::after {
 width: 36px;
}

@media screen and (min-width: 768px) {
 .news-card__body {
  padding: 22px 22px 24px;
 }

 .news-card__title {
  font-size: 16px;
 }

 .news-card__excerpt {
  font-size: 13px;
 }
}

/* ニュースページ共通 */
.news-page {
 padding-top: var(--nav-h);
}

.news-page__header,
.news-single__header {
 padding: 64px 0 44px;
 border-bottom: 0.5px solid var(--border);
 background: var(--cream2);
}

.news-page__title,
.news-single__title {
 font-family: "Shippori Mincho B1", serif;
 font-size: 28px;
 font-weight: 400;
 line-height: 1.6;
 letter-spacing: 0.08em;
 color: var(--dark);
}

.news-page__lead {
 margin-top: 18px;
 font-size: 13px;
 line-height: 2;
 letter-spacing: 0.1em;
 color: var(--muted);
}

@media screen and (min-width: 768px) {
 .news-page__header,
 .news-single__header {
  padding: 88px 0 60px;
 }

 .news-page__title,
 .news-single__title {
  font-size: 36px;
 }
}

/* ニュースアーカイブ */
.news-archive__section {
 padding: 48px 0 80px;
}

.news-archive__grid {
 display: grid;
 grid-template-columns: 1fr;
 gap: 2px;
 padding: 2px;
 background: var(--border);
}

.news-archive__empty {
 padding: 40px 0;
 font-size: 13px;
 letter-spacing: 0.1em;
 color: var(--muted);
}

@media screen and (min-width: 640px) {
 .news-archive__grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
 }
}

@media screen and (min-width: 1024px) {
 .news-archive__section {
  padding: 64px 0 104px;
 }

 .news-archive__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
 }
}

/* ページネーション */
.news-pager {
 display: flex;
 justify-content: center;
 align-items: center;
 gap: 24px;
 padding: 48px 0 0;
}

.news-pager__btn {
 display: flex;
 align-items: center;
 gap: 8px;
 font-family: "Cormorant Garamond", serif;
 font-size: 12px;
 font-style: italic;
 letter-spacing: 0.2em;
 color: var(--gold);
 text-decoration: none;
 transition:
  gap 0.2s ease,
  opacity 0.2s ease;
}

.news-pager__btn:hover {
 gap: 12px;
}

.news-pager__btn--disabled {
 color: var(--muted);
 opacity: 0.35;
 pointer-events: none;
}

.news-pager__count {
 font-family: "Cormorant Garamond", serif;
 font-size: 11px;
 letter-spacing: 0.2em;
 color: rgb(28 24 16);
}

@media screen and (max-width: 599px) {
 .news-pager {
  gap: 14px;
 }

 .news-pager__btn {
  font-size: 11px;
  letter-spacing: 0.12em;
 }
}

/* ニュースシングル */
.news-single__date {
 display: block;
 margin-bottom: 12px;
 font-family: "Cormorant Garamond", serif;
 font-size: 13px;
 letter-spacing: 0.22em;
 color: var(--gold);
 font-style: italic;
}

.news-single__article {
 padding: 48px 0 80px;
}

.news-single__eyecatch {
 margin: 0 0 40px;
 overflow: hidden;
 background: #d8cfb8;
}

.news-single__eyecatch img {
 display: block;
 width: 100%;
 height: auto;
}

.news-single__content {
 font-size: 14px;
 line-height: 2.2;
 letter-spacing: 0.06em;
 color: var(--dark);
}

.news-single__content > * + * {
 margin-top: 1.6em;
}

.news-single__content h2,
.news-single__content h3,
.news-single__content h4 {
 font-family: "Shippori Mincho B1", serif;
 font-weight: 400;
 line-height: 1.7;
 letter-spacing: 0.08em;
}

.news-single__content h2 {
 margin-top: 2.6em;
 padding-bottom: 12px;
 border-bottom: 0.5px solid var(--border);
 font-size: 22px;
}

.news-single__content h3 {
 margin-top: 2.2em;
 font-size: 18px;
}

.news-single__content h4 {
 margin-top: 2em;
 font-size: 16px;
}

.news-single__content ul,
.news-single__content ol {
 padding-left: 1.5em;
}

.news-single__content ul {
 list-style: disc;
}

.news-single__content ol {
 list-style: decimal;
}

.news-single__content li + li {
 margin-top: 0.5em;
}

.news-single__content a {
 color: var(--gold);
 text-decoration: underline;
 text-underline-offset: 0.2em;
}

.news-single__content blockquote {
 padding: 20px 24px;
 border-left: 2px solid var(--gold2);
 background: var(--cream2);
}

.news-single__content img {
 height: auto;
}

.news-single__page-links {
 display: flex;
 gap: 8px;
 margin-top: 32px;
}

.news-single__nav {
 display: grid;
 grid-template-columns: 1fr;
 gap: 10px;
 margin-top: 56px;
 padding-top: 28px;
 border-top: 0.5px solid var(--border);
}

.news-single__nav-item a,
.news-single__back {
 display: flex;
 min-height: 64px;
 align-items: center;
 border: 0.5px solid var(--border);
 background: transparent;
 color: var(--dark);
 transition:
  border-color 0.2s ease,
  color 0.2s ease;
}

.news-single__nav-item a {
 flex-direction: column;
 align-items: flex-start;
 justify-content: center;
 gap: 5px;
 padding: 12px 16px;
}

.news-single__nav-item--next a {
 align-items: flex-end;
 text-align: right;
}

.news-single__nav-label {
 font-family: "Cormorant Garamond", serif;
 font-size: 10px;
 letter-spacing: 0.3em;
 color: var(--gold);
 font-style: italic;
}

.news-single__nav-title {
 max-width: 100%;
 overflow: hidden;
 font-size: 12px;
 line-height: 1.6;
 letter-spacing: 0.08em;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.news-single__back {
 justify-content: center;
 padding: 0 16px;
 font-size: 12px;
 letter-spacing: 0.16em;
}

.news-single__nav-item a:hover,
.news-single__back:hover {
 border-color: var(--gold);
 color: var(--gold);
}

@media screen and (min-width: 768px) {
 .news-single__article {
  padding: 64px 0 104px;
 }

 .news-single__eyecatch {
  margin-bottom: 48px;
 }

 .news-single__content {
  font-size: 15px;
 }

 .news-single__content h2 {
  font-size: 24px;
 }

 .news-single__content h3 {
  font-size: 20px;
 }

 .news-single__nav {
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: stretch;
 }

 .news-single__back {
  min-width: 120px;
 }
}
