/* ============================================================
   news.css — お知らせ 一覧・詳細(.news-archive / .news-category / .news-single)
   ※ タブレット/流体/1440超えなどの横断調整は overrides.css（最後に読込）にある
   ============================================================ */

@media (max-width: 767px) {
	.news-archive .news-link__date { width: auto; }

	.news-archive .news-link__title { width: 100%; max-width: none; }

}

/* ============================================================
   お知らせ一覧（Figma 467:34775）
   ============================================================ */
.news-archive { background: var(--color-bg-gray); padding: 140px 0 100px; }

.news-archive__contents {
display: flex;
align-items: flex-start;
justify-content: space-between;
padding-left: 140px;
}

.news-category { display: flex; flex-direction: column; gap: 24px; width: 272px; flex-shrink: 0; }

.news-category__title {
display: flex;
align-items: center;
gap: 12px;
font-size: 28px;
line-height: 1.6;
font-weight: 500;
letter-spacing: 2px;
color: var(--color-navy);
}

.news-category__dot { width: 17px; height: 17px; border-radius: 50%; background: var(--color-yellow-dusty); }

.news-category__list { display: flex; flex-wrap: wrap; gap: 20px; }

.news-category__item {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 120px;
padding: 12px 20px;
border-radius: 10px;
background: var(--color-bg-white);
color: var(--color-navy);
font-size: 18px;
line-height: 1.6;
font-weight: 500;
letter-spacing: 2px;
}

.news-category__item.is-current { background: var(--color-navy); color: #fff; }

@media (hover: hover) and (pointer: fine) {
	.news-category__item { transition: opacity 0.3s ease; }

	.news-category__item:hover { opacity: 0.6; }

}

.news-category__item:focus-visible { outline: 2px solid var(--color-navy); outline-offset: 2px; }

.news-archive__wrap {
width: 960px;
background: var(--color-bg-white);
border-radius: 45px 0 0 45px;
padding: 80px 140px 80px 80px;
}

.news-archive__list { display: flex; flex-direction: column; width: 100%; max-width: 740px; }

.news-archive__empty { font-size: 16px; color: var(--color-gray-600); padding: 24px 0; }

.news-archive__notice-wrap { padding: 64px 140px 0; }

@media (max-width: 767px) {
	.news-archive { padding: 64px 0 80px; }

	.news-archive__contents { flex-direction: column; gap: 32px; padding: 0 0 0 16px; }

	.news-category { width: 100%; padding-right: 16px; }

	.news-category__title { font-size: 20px; }

	.news-category__list { gap: 12px; }

	.news-category__item { min-width: 0; padding: 8px 16px; font-size: 14px; letter-spacing: 1px; }

	.news-archive__wrap { width: auto; align-self: stretch; margin-right: 16px; border-radius: 16px; padding: 8px 16px 32px; }

	.news-archive__notice-wrap { padding: 32px 16px 0; }

	/* SPカンプ515:25059: 上段=日付+タグ、下段=タイトル全幅の2段組。タイトルは2行で省略 */
	.news-archive .news-link__content { flex-wrap: wrap; row-gap: 8px; }
	.news-archive .news-link__title { width: 100%; flex: none; min-width: 0; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

}

.news-single { background: var(--color-bg-gray); padding: 80px 140px 100px; }

.news-single__contents { display: flex; flex-direction: column; gap: 40px; }

.news-single__header { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }

.news-single__title {
font-size: 28px;
line-height: 1.6;
font-weight: 500;
letter-spacing: 2px;
color: var(--color-navy);
}

.news-single__date {
display: flex;
align-items: center;
gap: 6px;
font-family: var(--font-en);
font-weight: 600;
font-size: 14px;
line-height: 1;
color: var(--color-gray-600);
}

.news-single__tag {
display: inline-flex;
align-items: center;
padding: 7px 12px;
border-radius: 10px;
background: var(--color-navy);
color: #fff;
font-size: 14px;
line-height: 1;
}

.news-single__body { display: flex; flex-direction: column; gap: 40px; }

.news-single__body p { font-size: 16px; line-height: 1.6; }

.news-single__body img { border-radius: 20px; }

.news-single__back { display: flex; justify-content: flex-end; margin-top: 80px; }

@media (max-width: 767px) {
	.news-single { padding: 40px 16px 64px; }

	.news-single__title { font-size: 20px; letter-spacing: 1px; }

	.news-single__back { margin-top: 40px; justify-content: center; }

}
