/*
Theme Name: Arkhe Child
Template: arkhe
Description: 日本伝統文化継承者育成実行委員会 公式サイト — 和風テイストの Arkhe 子テーマ
Author: nihondentou.net
Version: 1.3.0
*/

/* ==========================================================================
   CSS Custom Properties — 和風カラーパレット
   ========================================================================== */

:root {
	--color-primary: #B22222;   /* 紅色 */
	--color-bg: #FDFAF0;        /* 生成り */
	--color-text: #333333;      /* 墨色 */
	--color-accent: #C8A84E;    /* 金色 */
	--color-border: #D4C5A0;    /* 淡い金 — 罫線・区切り */
	--color-white: #FFFFFF;
	--font-serif: 'Noto Serif JP', 'Yu Mincho', '游明朝', 'HiraMinProN-W3', serif;
}

/* ==========================================================================
   Base — 全体の基本スタイル
   ========================================================================== */

body {
	background-color: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-serif);
}

/* ==========================================================================
   Typography — 見出し
   ========================================================================== */

/* メインコンテンツ内の h2 — 和風のアクセントライン */
.post_content h2,
.c-postContent h2,
.entry-content h2 {
	border-left: 4px solid var(--color-primary);
	border-bottom: 1px solid var(--color-border);
	padding: 0.4em 0.6em;
}

/* h3 */
.post_content h3,
.c-postContent h3,
.entry-content h3 {
	border-bottom: 1px solid var(--color-border);
	padding-bottom: 0.3em;
}

/* ==========================================================================
   Links
   ========================================================================== */

a {
	color: var(--color-primary);
	text-decoration: none;
}

a:hover {
	color: var(--color-accent);
	text-decoration: underline;
}

/* ==========================================================================
   Header — ヘッダー
   ========================================================================== */

.l-header {
	border-bottom: 2px solid var(--color-primary);
}

/* ==========================================================================
   Navigation — グローバルナビ
   ========================================================================== */

.c-gnav a {
	font-size: 0.9rem;
}

.c-gnav a:hover {
	color: var(--color-primary);
}

.c-gnav > li > a:hover,
.c-gnav > li.current-menu-item > a {
	border-bottom: 2px solid var(--color-primary);
}

/* ==========================================================================
   Buttons
   ========================================================================== */

.wp-block-button__link,
.c-btn,
input[type="submit"] {
	background-color: var(--color-primary);
	color: var(--color-white);
	border: none;
}

.wp-block-button__link:hover,
.c-btn:hover,
input[type="submit"]:hover {
	background-color: var(--color-accent);
	color: var(--color-white);
}

/* ==========================================================================
   Tables — テーブル和風スタイル
   ========================================================================== */

.post_content table,
.c-postContent table,
.entry-content table {
	border-collapse: collapse;
	width: 100%;
}

.post_content table th,
.c-postContent table th,
.entry-content table th {
	background-color: var(--color-primary);
	color: var(--color-white);
	padding: 0.6em 1em;
	border: 1px solid var(--color-border);
}

.post_content table td,
.c-postContent table td,
.entry-content table td {
	padding: 0.6em 1em;
	border: 1px solid var(--color-border);
}

.post_content table tbody tr:nth-child(even),
.c-postContent table tbody tr:nth-child(even),
.entry-content table tbody tr:nth-child(even) {
	background-color: rgba(253, 250, 240, 0.5);
}

/* ==========================================================================
   Sidebar — サイドバー
   ========================================================================== */

.l-sidebar .widget_text h3,
.l-sidebar .widget h3,
.c-widget__title {
	color: var(--color-primary);
	border-left: 4px solid var(--color-accent);
	padding-left: 0.5em;
}

/* 資料ダウンロードリスト */
.widget_text ul,
.c-widget ul {
	list-style: none;
	padding-left: 0;
}

.widget_text ul li,
.c-widget ul li {
	padding: 0.4em 0;
	border-bottom: 1px dotted var(--color-border);
}

.widget_text ul li::before,
.c-widget ul li::before {
	content: '▸ ';
	color: var(--color-accent);
}

/* ==========================================================================
   Footer — フッター
   ========================================================================== */

.l-footer {
	background-color: var(--color-text);
	color: var(--color-bg);
}

.l-footer a {
	color: var(--color-bg);
	text-decoration: none;
}

.l-footer a:hover {
	color: var(--color-accent);
	text-decoration: underline;
}

/* ==========================================================================
   Front Page — メインビジュアル（CSS スライドショー）
   ========================================================================== */

.ndentou-hero {
	position: relative;
	width: 100%;
	height: 400px;
	overflow: hidden;
}

@media (max-width: 768px) {
	.ndentou-hero {
		height: 250px;
	}
}

.ndentou-hero__slider {
	position: relative;
	width: 100%;
	height: 100%;
}

.ndentou-hero__slide {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	opacity: 0;
	animation: ndentou-fade 24s infinite;
}

/* 4枚のスライド — 各6秒表示、z-index で重なり順を制御 */
.ndentou-hero__slide:nth-child(1) { animation-delay: 0s;  z-index: 4; }
.ndentou-hero__slide:nth-child(2) { animation-delay: 6s;  z-index: 3; }
.ndentou-hero__slide:nth-child(3) { animation-delay: 12s; z-index: 2; }
.ndentou-hero__slide:nth-child(4) { animation-delay: 18s; z-index: 1; }

@keyframes ndentou-fade {
	0%   { opacity: 0; }
	4%   { opacity: 1; }
	25%  { opacity: 1; }
	29%  { opacity: 0; }
	100% { opacity: 0; }
}

.ndentou-hero__overlay {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, 0.35);
	text-align: center;
	padding: 1em;
}

.ndentou-hero__title {
	color: var(--color-white);
	font-size: 2rem;
	font-weight: 700;
	text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.6);
	margin: 0 0 0.3em;
	border: none;
	border-left: none;
	border-bottom: none;
	padding: 0;
}

.ndentou-hero__subtitle {
	color: var(--color-white);
	font-size: 1.1rem;
	text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.6);
	margin: 0;
}

@media (max-width: 768px) {
	.ndentou-hero__title {
		font-size: 1.3rem;
	}
	.ndentou-hero__subtitle {
		font-size: 0.9rem;
	}
}

/* ==========================================================================
   Front Page — セクション共通
   ========================================================================== */

.ndentou-section {
	margin: 2.5em 0;
	padding: 0;
}

.ndentou-section--center {
	text-align: center;
}

.ndentou-section__heading {
	font-size: 1.4rem;
	border-left: 4px solid var(--color-primary);
	border-bottom: 1px solid var(--color-border);
	padding: 0.4em 0.6em;
	margin-bottom: 1em;
}

/* ==========================================================================
   Front Page — お知らせ一覧
   ========================================================================== */

.ndentou-news-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.ndentou-news-list__item {
	padding: 0.6em 0;
	border-bottom: 1px dotted var(--color-border);
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em 1em;
	align-items: baseline;
}

.ndentou-news-list__date {
	color: #888;
	font-size: 0.85rem;
	flex-shrink: 0;
}

.ndentou-news-list__link {
	color: var(--color-text);
}

.ndentou-news-list__link:hover {
	color: var(--color-primary);
}

/* ==========================================================================
   Front Page — イベント告知
   ========================================================================== */

.ndentou-event {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: 4px;
	padding: 1.5em;
}

/* ==========================================================================
   Front Page — 記念動画
   ========================================================================== */

.ndentou-video {
	display: inline-block;
}

.ndentou-video__thumb {
	max-width: 480px;
	width: 100%;
	height: auto;
	border: 2px solid var(--color-border);
	border-radius: 4px;
	transition: opacity 0.2s;
}

.ndentou-video__thumb:hover {
	opacity: 0.85;
}

/* ==========================================================================
   Archive — お知らせ一覧（拡張スタイル）
   ========================================================================== */

.ndentou-news-list--archive .ndentou-news-list__item {
	display: flex;
	flex-wrap: nowrap;
	gap: 1em;
	align-items: flex-start;
	padding: 1em 0;
}

.ndentou-news-list__thumb {
	flex-shrink: 0;
	width: 120px;
}

.ndentou-news-list__thumb img {
	width: 100%;
	height: auto;
	border-radius: 3px;
}

.ndentou-news-list__body {
	flex: 1;
}

.ndentou-news-list__cat {
	display: inline-block;
	padding: 2px 8px;
	border: 1px solid var(--color-border);
	border-radius: 4px;
	font-size: 0.75rem;
	color: #666;
	margin-left: 0.5em;
}

.ndentou-news-list__title {
	font-size: 1.1rem;
	margin: 0.3em 0;
	border: none;
	padding: 0;
}

.ndentou-news-list__title a {
	color: var(--color-text);
}

.ndentou-news-list__title a:hover {
	color: var(--color-primary);
	text-decoration: none;
}

.ndentou-news-list__excerpt {
	font-size: 0.85rem;
	color: #666;
	margin: 0.3em 0 0;
}

@media (max-width: 480px) {
	.ndentou-news-list--archive .ndentou-news-list__item {
		flex-wrap: wrap;
	}
	.ndentou-news-list__thumb {
		width: 100%;
	}
}

/* ==========================================================================
   Archive — 活動報告カードグリッド
   ========================================================================== */

.ndentou-card-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 1.5em;
}

.ndentou-card {
	background: var(--color-white);
	border: 1px solid var(--color-border);
	border-radius: 4px;
	overflow: hidden;
	transition: box-shadow 0.2s;
}

.ndentou-card:hover {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.ndentou-card__link {
	display: block;
	color: inherit;
	text-decoration: none;
}

.ndentou-card__thumb {
	aspect-ratio: 16 / 10;
	overflow: hidden;
}

.ndentou-card__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ndentou-card__thumb--empty {
	background: var(--color-border);
}

.ndentou-card__body {
	padding: 0.8em 1em;
}

.ndentou-card__date {
	display: block;
	font-size: 0.8rem;
	color: #888;
}

.ndentou-card__title {
	font-size: 1rem;
	margin: 0.3em 0 0;
	border: none;
	padding: 0;
}

/* ==========================================================================
   Single — 詳細ページ共通
   ========================================================================== */

.ndentou-single__header {
	margin-bottom: 1.5em;
}

.ndentou-single__date {
	display: inline-block;
	font-size: 0.85rem;
	color: #888;
}

.ndentou-single__title {
	font-size: 1.6rem;
	margin: 0.3em 0 0;
	border-left: 4px solid var(--color-primary);
	border-bottom: none;
	padding: 0.2em 0.5em;
}

.ndentou-single__thumbnail {
	margin: 0 0 1.5em;
}

.ndentou-single__thumbnail img {
	width: 100%;
	height: auto;
	border-radius: 4px;
}

.ndentou-single__content {
	margin-bottom: 2em;
}

/* 前後ナビ */
.ndentou-single__nav {
	display: flex;
	flex-wrap: wrap;
	gap: 1em;
	justify-content: space-between;
	padding: 1.5em 0;
	border-top: 1px solid var(--color-border);
	font-size: 0.9rem;
}

.ndentou-single__nav-back {
	width: 100%;
	text-align: center;
	margin-top: 0.5em;
}

/* ==========================================================================
   Page Title — 一覧ページ見出し
   ========================================================================== */

.c-pageTitle {
	font-size: 1.6rem;
	border-left: 4px solid var(--color-primary);
	border-bottom: 1px solid var(--color-border);
	padding: 0.4em 0.6em;
	margin-bottom: 1.5em;
}

/* ==========================================================================
   Contact Form 7 — 和風スタイリング
   ========================================================================== */

.ndentou-form__group {
	margin-bottom: 1.5em;
}

.ndentou-form__group label {
	display: block;
	font-weight: 500;
	margin-bottom: 0.4em;
	font-size: 0.95rem;
}

.ndentou-form__required {
	color: var(--color-primary);
	font-size: 0.8rem;
}

.ndentou-form__input,
.ndentou-form__select,
.ndentou-form__textarea,
.ndentou-form .wpcf7-form-control:not([type="submit"]) {
	width: 100%;
	max-width: 500px;
	padding: 0.6em 0.8em;
	border: 1px solid var(--color-border);
	border-radius: 3px;
	background: var(--color-white);
	font-family: var(--font-serif);
	font-size: 1rem;
	color: var(--color-text);
	transition: border-color 0.2s;
}

.ndentou-form__input:focus,
.ndentou-form__select:focus,
.ndentou-form__textarea:focus,
.ndentou-form .wpcf7-form-control:not([type="submit"]):focus {
	outline: none;
	border-color: var(--color-primary);
	box-shadow: 0 0 0 2px rgba(178, 34, 34, 0.15);
}

.ndentou-form__textarea,
.ndentou-form textarea.wpcf7-form-control {
	max-width: 100%;
	min-height: 180px;
	resize: vertical;
}

.ndentou-form__select,
.ndentou-form select.wpcf7-form-control {
	max-width: 300px;
}

.ndentou-form__submit {
	margin-top: 2em;
	text-align: center;
}

.ndentou-form__btn,
.ndentou-form input[type="submit"] {
	display: inline-block;
	padding: 0.8em 3em;
	background-color: var(--color-primary);
	color: var(--color-white);
	border: none;
	border-radius: 3px;
	font-family: var(--font-serif);
	font-size: 1rem;
	cursor: pointer;
	transition: background-color 0.2s;
}

.ndentou-form__btn:hover,
.ndentou-form input[type="submit"]:hover {
	background-color: var(--color-accent);
}

/* CF7 バリデーションメッセージ */
.wpcf7-not-valid-tip {
	color: var(--color-primary);
	font-size: 0.85rem;
	margin-top: 0.3em;
}

.wpcf7-response-output {
	border: 1px solid var(--color-border) !important;
	border-radius: 3px;
	padding: 1em;
	margin: 1.5em 0;
	text-align: center;
}

.wpcf7-mail-sent-ok {
	border-color: #46b450 !important;
	color: #46b450;
}

.wpcf7-validation-errors {
	border-color: var(--color-primary) !important;
	color: var(--color-primary);
}
