/*
Theme Name:   MD Studio
Theme URI:    https://media-design.work/
Description:  Media Design Office Matsumoto の Genesis Framework 子テーマ。スモールメディア制作会社向け・モバイルファースト設計。
Author:       Media Design Office Matsumoto
Author URI:   https://media-design.work/
Template:     genesis
Version:      1.0.0
Tags:         mobile-first, responsive, media, creative
*/

/* ==========================================================================
   カスタムプロパティ（CSS変数）
   ========================================================================== */

:root {
	/* ─── ベース 3色 ─── */
	--color-warm-beige:  #a2997f;   /* ウォームベージュ   ─ メインブランド */
	--color-dark-taupe:  #6e6457;   /* ダークトープ       ─ テキスト・ヘッダー */
	--color-mist-blue:   #cfdedf;   /* ミストブルー       ─ アクセント */

	/* ─── 明るい方向への拡張 ─── */
	--color-ivory:       #f7f4f0;   /* アイボリー         ─ ページ背景 */
	--color-off-white:   #fdfcfa;   /* オフホワイト       ─ カード・パネル */
	--color-pale-beige:  #d4cfc5;   /* ペールベージュ     ─ ボーダー・仕切り */
	--color-pale-mist:   #e4eef0;   /* ペールミスト       ─ セクション背景 */

	/* ─── 中間トーン ─── */
	--color-mid-beige:   #8a8070;   /* ミッドベージュ     ─ ホバー・補助テキスト */
	--color-steel-blue:  #9bbfc1;   /* スチールブルー     ─ フォーカス・強調 */

	/* ─── 暗い方向への拡張 ─── */
	--color-espresso:    #4c4139;   /* エスプレッソ       ─ フッター・強調 */
	--color-body-text:   #2d2520;   /* ボディテキスト     ─ 本文 */

	/* ─── ユーティリティ ─── */
	--color-white:       #ffffff;

	/* ─── タイポグラフィ ─── */
	--font-sans: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN",
	             "Hiragino Sans", "Meiryo", sans-serif;
	--line-height-base: 1.8;

	/* ─── スペーシング ─── */
	--space-xs:  0.5rem;
	--space-sm:  1rem;
	--space-md:  1.5rem;
	--space-lg:  2.5rem;
	--space-xl:  4rem;

	/* ─── レイアウト ─── */
	--container-max: 1100px;
	--container-pad: 1.25rem;

	/* ─── シャドウ ─── */
	--shadow-sm: 0 1px 4px rgba(44, 35, 28, 0.07);
	--shadow-md: 0 4px 16px rgba(44, 35, 28, 0.11);
	--shadow-lg: 0 8px 32px rgba(44, 35, 28, 0.15);

	/* ─── 角丸 ─── */
	--radius-sm: 4px;
	--radius-md: 8px;
	--radius-lg: 16px;

	/* ─── トランジション ─── */
	--transition: 0.22s ease;
}


/* ==========================================================================
   Box-sizing
   ========================================================================== */

html {
	box-sizing: border-box;
}
*, *::before, *::after {
	box-sizing: inherit;
}


/* ==========================================================================
   Float Clearing（Genesis 必須）
   ========================================================================== */

.author-box::before,
.clearfix::before,
.entry::before,
.entry-content::before,
.footer-widgets::before,
.nav-primary::before,
.nav-secondary::before,
.pagination::before,
.site-container::before,
.site-footer::before,
.site-header::before,
.site-inner::before,
.widget::before,
.wrap::before {
	content: " ";
	display: table;
}

.author-box::after,
.clearfix::after,
.entry::after,
.entry-content::after,
.footer-widgets::after,
.nav-primary::after,
.nav-secondary::after,
.pagination::after,
.site-container::after,
.site-footer::after,
.site-header::after,
.site-inner::after,
.widget::after,
.wrap::after {
	clear: both;
	content: " ";
	display: table;
}


/* ==========================================================================
   ベース
   ========================================================================== */

html {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-size: 16px;
	scroll-behavior: smooth;
}

body {
	background-color: var(--color-ivory);
	color: var(--color-body-text);
	font-family: var(--font-sans);
	font-size: 1rem;
	font-weight: 400;
	line-height: var(--line-height-base);
	margin: 0;
	overflow-x: hidden;
}

.site-container {
	animation: md-fadein 0.5s ease;
	overflow-wrap: break-word;
}

@keyframes md-fadein {
	from { opacity: 0; transform: translateY(5px); }
	to   { opacity: 1; transform: translateY(0); }
}


/* ==========================================================================
   タイポグラフィ
   ========================================================================== */

h1, h2, h3, h4, h5, h6 {
	color: var(--color-espresso);
	font-family: var(--font-sans);
	font-weight: 700;
	line-height: 1.3;
	margin: 0 0 var(--space-sm);
}

h1 { font-size: 1.75rem; }
h2 { font-size: 1.5rem; }
h3 { font-size: 1.25rem; }
h4 { font-size: 1.125rem; }
h5 { font-size: 1rem; }
h6 { font-size: 0.9rem; }

p {
	margin: 0 0 var(--space-sm);
}
p:last-child {
	margin-bottom: 0;
}

b, strong { font-weight: 700; }
em, i, cite { font-style: italic; }

blockquote {
	border-left: 3px solid var(--color-warm-beige);
	color: var(--color-mid-beige);
	font-style: italic;
	margin: var(--space-md) 0;
	padding: var(--space-sm) var(--space-md);
}

hr {
	border: none;
	border-bottom: 1px solid var(--color-pale-beige);
	clear: both;
	margin: var(--space-lg) 0;
}

mark {
	background-color: var(--color-pale-mist);
	color: var(--color-espresso);
	padding: 0.1em 0.3em;
}

small { font-size: 0.875em; }


/* ==========================================================================
   リンク
   ========================================================================== */

a {
	color: var(--color-dark-taupe);
	text-decoration: none;
	transition: color var(--transition);
}
a:hover, a:focus {
	color: var(--color-warm-beige);
	text-decoration: underline;
}


/* ==========================================================================
   リスト
   ========================================================================== */

ol, ul {
	margin: 0;
	padding: 0;
}
li {
	list-style-type: none;
}

.entry-content ol,
.entry-content ul {
	margin-bottom: var(--space-md);
	padding-left: var(--space-lg);
}
.entry-content ol > li  { list-style-type: decimal; }
.entry-content ul > li  { list-style-type: disc; }
.entry-content ol ul > li,
.entry-content ul ul > li { list-style-type: circle; }
.entry-content ol ol,
.entry-content ul ul { margin-bottom: 0; }


/* ==========================================================================
   画像・メディア
   ========================================================================== */

embed, iframe, img, object, video, .wp-caption {
	max-width: 100%;
}
img {
	height: auto;
	vertical-align: top;
}
figure { margin: 0; }


/* ==========================================================================
   テーブル
   ========================================================================== */

table {
	border-collapse: collapse;
	margin-bottom: var(--space-lg);
	width: 100%;
	word-break: break-all;
}
th {
	background-color: var(--color-pale-mist);
	font-weight: 600;
	padding: 0.75rem 1rem;
	text-align: left;
	vertical-align: top;
}
td {
	border-bottom: 1px solid var(--color-pale-beige);
	padding: 0.75rem 1rem;
	vertical-align: top;
}
tr:last-child td { border-bottom: none; }


/* ==========================================================================
   フォーム・入力
   ========================================================================== */

input, select, textarea {
	background-color: var(--color-white);
	border: 1px solid var(--color-pale-beige);
	border-radius: var(--radius-sm);
	color: var(--color-body-text);
	font-family: var(--font-sans);
	font-size: 1rem;
	line-height: 1.5;
	padding: 0.75rem 1rem;
	transition: border-color var(--transition), box-shadow var(--transition);
	width: 100%;
}
input:focus, textarea:focus {
	border-color: var(--color-warm-beige);
	box-shadow: 0 0 0 3px rgba(162, 153, 127, 0.2);
	outline: none;
}
input[type="checkbox"],
input[type="image"],
input[type="radio"] {
	width: auto;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button {
	display: none;
}

:-ms-input-placeholder { color: var(--color-mid-beige); opacity: 1; }
::placeholder          { color: var(--color-mid-beige); opacity: 1; }


/* ==========================================================================
   ボタン
   ========================================================================== */

button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.button {
	background-color: var(--color-dark-taupe);
	border: 2px solid var(--color-dark-taupe);
	border-radius: var(--radius-sm);
	color: var(--color-white);
	cursor: pointer;
	display: inline-block;
	font-family: var(--font-sans);
	font-size: 0.9375rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1;
	padding: 0.875rem 1.75rem;
	text-align: center;
	text-decoration: none;
	transition: background-color var(--transition), border-color var(--transition), color var(--transition);
	white-space: normal;
	width: auto;
}
button:hover, button:focus,
input[type="button"]:hover, input[type="button"]:focus,
input[type="reset"]:hover,  input[type="reset"]:focus,
input[type="submit"]:hover, input[type="submit"]:focus,
.button:hover, .button:focus {
	background-color: var(--color-warm-beige);
	border-color: var(--color-warm-beige);
	color: var(--color-white);
	text-decoration: none;
}

.button-outline {
	background-color: transparent;
	border: 2px solid var(--color-dark-taupe);
	color: var(--color-dark-taupe);
}
.button-outline:hover, .button-outline:focus {
	background-color: var(--color-dark-taupe);
	color: var(--color-white);
}

.site-container button:disabled,
.site-container input:disabled,
.site-container input:disabled:hover,
.site-container input[type="button"]:disabled,
.site-container input[type="submit"]:disabled {
	background-color: var(--color-pale-beige);
	border-color: var(--color-pale-beige);
	color: var(--color-mid-beige);
	cursor: not-allowed;
}

.more-link {
	display: inline-block;
	margin-top: var(--space-sm);
}


/* ==========================================================================
   アクセシビリティ
   ========================================================================== */

.screen-reader-shortcut,
.screen-reader-text,
.screen-reader-text span {
	border: 0;
	clip: rect(0, 0, 0, 0);
	height: 1px;
	overflow: hidden;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}
.screen-reader-text:focus,
.screen-reader-shortcut:focus,
.widget_search input[type="submit"]:focus {
	background: var(--color-white);
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: var(--color-body-text);
	display: block;
	font-size: 1rem;
	font-weight: 700;
	height: auto;
	padding: 1rem 1.5rem;
	text-decoration: none;
	width: auto;
	z-index: 100000;
}

.genesis-skip-link { margin: 0; }
.genesis-skip-link .skip-link-hidden { display: none; visibility: hidden; }
.genesis-skip-link li { height: 0; list-style: none; width: 0; }


/* ==========================================================================
   レイアウト基盤
   ========================================================================== */

.site-header, .site-inner, .site-footer {
	width: 100%;
}

/* 中央寄せ・最大幅コンテナ */
.site-header .wrap,
.site-footer .wrap,
.footer-widgets .wrap,
.content-sidebar-wrap {
	margin: 0 auto;
	max-width: var(--container-max);
	padding-left: var(--container-pad);
	padding-right: var(--container-pad);
}


/* ==========================================================================
   サイトヘッダー
   ========================================================================== */

.site-header {
	background-color: var(--color-mid-beige);
	box-shadow: var(--shadow-sm);
	position: sticky;
	top: 0;
	z-index: 200;
}

.site-header .wrap {
	align-items: center;
	display: flex;
	gap: var(--space-sm);
	justify-content: space-between;
	padding-bottom: 0.875rem;
	padding-top: 0.875rem;
}

/* ロゴ */
.site-branding {
	flex-shrink: 0;
}
.site-branding img,
.custom-logo {
	display: block;
	height: auto;
	max-height: 56px;
	max-width: 260px;
	width: auto;
}
.site-title {
	font-size: 1.25rem;
	font-weight: 700;
	margin: 0;
}
.site-title a {
	color: var(--color-off-white);
}
.site-description {
	color: var(--color-ivory);
	font-size: 0.75rem;
	margin: 0;
}


/* ==========================================================================
   ハンバーガーメニュートグルボタン
   ========================================================================== */

.nav-toggle {
	background: none;
	border: none;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	flex-shrink: 0;
	gap: 5px;
	height: 44px;
	justify-content: center;
	padding: 0.625rem;
	width: 44px;
}
.nav-toggle:hover,
.nav-toggle:focus {
	background-color: transparent;
	border: none;
	color: inherit;
}
.nav-toggle span {
	background-color: var(--color-ivory);
	border-radius: 2px;
	display: block;
	height: 2px;
	transition: transform var(--transition), opacity var(--transition), background-color var(--transition);
	width: 22px;
}
.nav-toggle.is-active span:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}
.nav-toggle.is-active span:nth-child(2) {
	opacity: 0;
	transform: scaleX(0);
}
.nav-toggle.is-active span:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}


/* ==========================================================================
   プライマリナビゲーション（モバイル：ドロップダウン）
   ========================================================================== */

.nav-primary {
	background-color: var(--color-ivory);
	border-top: 1px solid var(--color-pale-beige);
	box-shadow: var(--shadow-md);
	display: none;
	left: 0;
	position: absolute;
	top: 100%;
	width: 100%;
	z-index: 199;
}
.nav-primary.is-open {
	display: block;
}

.nav-primary .wrap {
	padding-bottom: var(--space-xs);
	padding-top: var(--space-xs);
}

.nav-primary .menu {
	display: flex;
	flex-direction: column;
	list-style: none;
	margin: 0;
	padding: 0;
}
.nav-primary .menu a {
	border-bottom: 1px solid var(--color-pale-beige);
	color: var(--color-dark-taupe);
	display: block;
	font-size: 0.9375rem;
	font-weight: 500;
	padding: 0.875rem var(--container-pad);
	text-decoration: none;
	transition: background-color var(--transition), color var(--transition);
}
.nav-primary .menu a:hover,
.nav-primary .menu a:focus {
	background-color: var(--color-pale-mist);
	color: var(--color-warm-beige);
	text-decoration: none;
}
.nav-primary .menu li:last-child > a {
	border-bottom: none;
}
.nav-primary .menu .current-menu-item > a,
.nav-primary .menu .current-page-ancestor > a {
	color: var(--color-warm-beige);
	font-weight: 700;
}

/* サブメニュー（モバイル） */
.nav-primary .sub-menu {
	display: none;
	padding-left: var(--space-md);
}
.nav-primary .menu li:hover > .sub-menu,
.nav-primary .menu li:focus-within > .sub-menu {
	display: block;
}
.nav-primary .sub-menu a {
	font-size: 0.875rem;
}


/* ==========================================================================
   サイトインナー
   ========================================================================== */

.site-inner {
	background-color: var(--color-ivory);
	padding: var(--space-lg) 0;
}
.genesis-title-hidden .site-inner {
	padding-top: 0;
}


/* ==========================================================================
   コンテンツ + サイドバー（モバイルファースト：縦積み）
   ========================================================================== */

.content-sidebar-wrap {
	display: flex;
	flex-direction: column;
	gap: var(--space-lg);
}
.content {
	min-width: 0;
	width: 100%;
}
.sidebar {
	width: 100%;
}


/* ==========================================================================
   エントリー（記事・固定ページ）
   ========================================================================== */

.entry {
	background-color: var(--color-ivory);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-sm);
	margin-bottom: var(--space-lg);
	padding: var(--space-md);
}
.entry:last-of-type {
	margin-bottom: 0;
}

/* タイトル */
h1.entry-title {
	color: var(--color-espresso);
	font-size: 1.625rem;
	font-weight: 800;
	line-height: 1.25;
	margin-bottom: var(--space-xs);
}
h2.entry-title {
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.35;
	margin-bottom: var(--space-xs);
}
h2.entry-title a {
	color: var(--color-espresso);
}
h2.entry-title a:hover,
h2.entry-title a:focus {
	color: var(--color-warm-beige);
}

.entry-title a,
.sidebar .widget-title a {
	text-decoration: none;
}

/* エントリーヘッダー */
.entry-header {
	margin-bottom: var(--space-md);
}

/* メタ情報 */
p.entry-meta {
	color: var(--color-mid-beige);
	font-size: 0.8125rem;
	margin-bottom: 0;
}
.entry-header .entry-meta {
	margin-bottom: var(--space-xs);
}
.entry-footer .entry-meta {
	border-top: 1px solid var(--color-pale-beige);
	margin-top: var(--space-md);
	padding-top: var(--space-sm);
}
.entry-categories,
.entry-tags {
	display: block;
}
.entry-comments-link::before {
	content: "\2014";
	margin: 0 6px 0 2px;
}

/* エントリーコンテンツ内 */
.entry-content {
	line-height: 1.85;
}
.entry-content h2,
.entry-content h3,
.entry-content h4 {
	margin-top: var(--space-lg);
}
.entry-content h3,
.entry-content h4 {
	font-weight: 600;
}
.entry-content h4 { margin-top: var(--space-lg); }
.entry-content img {
	border-radius: var(--radius-sm);
}
.entry-content code {
	background-color: var(--color-pale-mist);
	border-radius: var(--radius-sm);
	font-size: 0.875em;
	padding: 0.125em 0.375em;
}
.entry-content .search-form {
	margin-bottom: var(--space-md);
}

.content .sticky {
	background-color: var(--color-pale-mist);
	border-radius: var(--radius-md);
	padding: var(--space-md);
}


/* ==========================================================================
   アーカイブ・著者ボックス
   ========================================================================== */

.after-entry,
.archive-description,
.author-box {
	background-color: var(--color-pale-mist);
	border-radius: var(--radius-md);
	margin-bottom: var(--space-lg);
	padding: var(--space-md);
}
.after-entry .widget:last-of-type {
	margin-bottom: 0;
}
.archive-description p:last-child,
.author-box p:last-child {
	margin-bottom: 0;
}
.archive-description .entry-title,
.archive-title,
.author-box-title {
	font-size: 1.125rem;
	font-weight: 700;
	margin-bottom: var(--space-xs);
}


/* ==========================================================================
   パンくずリスト
   ========================================================================== */

.breadcrumb {
	border-bottom: 1px solid var(--color-pale-beige);
	color: var(--color-mid-beige);
	font-size: 0.8125rem;
	margin-bottom: var(--space-md);
	padding-bottom: var(--space-xs);
}
.genesis-title-hidden .breadcrumb {
	margin-top: var(--space-md);
}


/* ==========================================================================
   検索フォーム
   ========================================================================== */

.search-form {
	display: flex;
	gap: 0.5rem;
	overflow: hidden;
}
.search-form input[type="search"] {
	flex: 1;
}
.search-form input[type="submit"] {
	flex-shrink: 0;
	width: auto;
}
.widget_search input[type="submit"] {
	border: 0;
	clip: rect(0, 0, 0, 0);
	height: 1px;
	margin: -1px;
	padding: 0;
	position: absolute;
	width: 1px;
}


/* ==========================================================================
   タイトルエリア（ロゴ）
   ========================================================================== */

.title-area { display: contents; }

.custom-logo {
	display: block;
	height: auto;
	width: auto;
}


/* ==========================================================================
   ページネーション
   ========================================================================== */

.pagination {
	clear: both;
	margin: var(--space-xl) 0;
}
.adjacent-entry-pagination {
	margin-bottom: 0;
}
.archive-pagination li {
	display: inline;
}
.archive-pagination li a {
	background-color: var(--color-white);
	border: 1px solid var(--color-pale-beige);
	border-radius: var(--radius-sm);
	color: var(--color-dark-taupe);
	cursor: pointer;
	display: inline-block;
	font-size: 0.875rem;
	font-weight: 600;
	margin-bottom: 4px;
	padding: 0.5rem 0.875rem;
	text-decoration: none;
	transition: background-color var(--transition), border-color var(--transition), color var(--transition);
}
.archive-pagination li a:hover,
.archive-pagination li a:focus,
.archive-pagination li.active a {
	background-color: var(--color-dark-taupe);
	border-color: var(--color-dark-taupe);
	color: var(--color-white);
}


/* ==========================================================================
   コメント
   ========================================================================== */

.comment-respond,
.entry-comments,
.entry-pings {
	background-color: var(--color-white);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-sm);
	margin-bottom: var(--space-lg);
	padding: var(--space-md);
}
.comment-list li {
	padding: var(--space-md) 0 0 var(--space-md);
}
.comment-list .depth-1 {
	padding-left: 0;
}
.comment-header {
	margin-bottom: var(--space-sm);
}
.comment-header p {
	margin-bottom: 0;
}
.comment-content {
	clear: both;
}
.comment-content ul > li {
	list-style-type: disc;
}
.comment-respond input[type="email"],
.comment-respond input[type="text"],
.comment-respond input[type="url"] {
	width: 100%;
}
.comment-respond label {
	display: block;
	margin-bottom: 0.25rem;
}
.comment-form-cookies-consent label {
	display: inline;
	padding-left: 0.5rem;
}
.entry-pings .reply {
	display: none;
}


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

.sidebar {
	font-size: 0.9375rem;
	line-height: 1.65;
}
.sidebar p {
	margin-bottom: var(--space-sm);
}


/* ==========================================================================
   ウィジェット
   ========================================================================== */

.widget {
	background-color: var(--color-white);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-sm);
	margin-bottom: var(--space-md);
	padding: var(--space-md);
}
.widget:last-of-type {
	margin-bottom: 0;
}
.widget p:last-child,
.widget ul > li:last-of-type {
	margin-bottom: 0;
}
.widget-title {
	border-bottom: 2px solid var(--color-warm-beige);
	color: var(--color-espresso);
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	margin-bottom: var(--space-sm);
	padding-bottom: var(--space-xs);
	text-transform: uppercase;
}
.widget ul > li {
	border-bottom: 1px solid var(--color-pale-beige);
	padding: 0.5rem 0;
}
.widget ul > li:last-of-type {
	border-bottom: none;
	padding-bottom: 0;
}
.widget ol > li {
	list-style-position: inside;
	list-style-type: decimal;
	padding-left: var(--space-md);
	text-indent: calc(-1 * var(--space-md));
}
.widget li li {
	border: 0;
	margin: 0 0 0 var(--space-md);
	padding: 0;
}
.widget_calendar table { width: 100%; }
.widget_calendar td, .widget_calendar th { text-align: center; }


/* ==========================================================================
   フィーチャードコンテンツ
   ========================================================================== */

.featured-content .entry {
	border-bottom: 1px solid var(--color-pale-beige);
	border-radius: 0;
	box-shadow: none;
	margin-bottom: var(--space-sm);
	padding: var(--space-sm) 0;
}
.featured-content .entry:last-of-type {
	border-bottom: none;
	margin-bottom: 0;
}
.featured-content .entry-title {
	font-size: 0.9375rem;
	margin-bottom: 0.25rem;
	margin-top: var(--space-xs);
}


/* ==========================================================================
   フッターウィジェット
   ========================================================================== */

.footer-widgets {
	background-color: var(--color-espresso);
	clear: both;
	color: var(--color-pale-beige);
	padding: var(--space-xl) 0;
}
.footer-widgets .wrap {
	display: flex;
	flex-direction: column;
	gap: var(--space-lg);
}
.footer-widget-area {
	flex: 1;
}
.footer-widget-area:last-child,
.footer-widgets .widget:last-child {
	margin-bottom: 0;
}
.footer-widgets .widget {
	background-color: transparent;
	box-shadow: none;
	color: var(--color-pale-beige);
	padding: 0;
}
.footer-widgets .widget-title {
	border-bottom-color: var(--color-warm-beige);
	color: var(--color-mist-blue);
}
.footer-widgets .widget ul > li {
	border-bottom-color: rgba(162, 153, 127, 0.25);
}
.footer-widgets a {
	color: var(--color-pale-beige);
}
.footer-widgets a:hover,
.footer-widgets a:focus {
	color: var(--color-mist-blue);
}


/* ==========================================================================
   サイトフッター
   ========================================================================== */

.site-footer {
	background-color: var(--color-espresso);
	border-top: 1px solid rgba(162, 153, 127, 0.25);
	color: var(--color-pale-beige);
	font-size: 0.8125rem;
	padding: var(--space-md) 0;
	text-align: center;
}
.site-footer .wrap {
	margin: 0 auto;
	max-width: var(--container-max);
	padding-left: var(--container-pad);
	padding-right: var(--container-pad);
}
.site-footer a {
	color: var(--color-mist-blue);
}
.site-footer a:hover,
.site-footer a:focus {
	color: var(--color-warm-beige);
}

/* フッターナビゲーション */
.nav-secondary {
	margin-bottom: var(--space-sm);
}
.nav-secondary .menu {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-sm);
	justify-content: center;
	list-style: none;
	margin: 0 0 var(--space-sm);
	padding: 0;
}
.nav-secondary .menu a {
	color: var(--color-pale-beige);
	font-size: 0.8125rem;
}
.nav-secondary .menu a:hover {
	color: var(--color-mist-blue);
}


/* ==========================================================================
   WordPress 標準クラス（アライメント等）
   ========================================================================== */

a.aligncenter img { display: block; margin: 0 auto; }
a.alignnone { display: inline-block; }
.alignleft  { float: left;  text-align: left; }
.alignright { float: right; text-align: right; }
a.alignleft, a.alignnone, a.alignright { max-width: 100%; }

img.centered, .aligncenter, .singular-image {
	display: block;
	margin: 0 auto var(--space-md);
}
img.alignnone, .alignnone {
	margin-bottom: var(--space-sm);
}
a.alignleft,  img.alignleft,  .wp-caption.alignleft  { margin: 0 var(--space-md) var(--space-md) 0; }
a.alignright, img.alignright, .wp-caption.alignright { margin: 0 0 var(--space-md) var(--space-md); }

figcaption, .gallery-caption, .wp-caption-text {
	color: var(--color-mid-beige);
	font-size: 0.8125rem;
	margin-top: 0.5rem;
	margin-bottom: 1rem;
	padding: 0 var(--space-sm);
	text-align: center;
}
.entry-content p.wp-caption-text { margin-bottom: 0; }
.entry-content .wp-audio-shortcode,
.entry-content .wp-playlist,
.entry-content .wp-video {
	margin: 0 0 var(--space-md);
}


/* ==========================================================================
   ギャラリー
   ========================================================================== */

.gallery { overflow: hidden; }
.gallery-item {
	float: left;
	margin: 0 0 var(--space-md);
	text-align: center;
}
.gallery img {
	border: 1px solid var(--color-pale-beige);
	border-radius: var(--radius-sm);
	height: auto;
	padding: 3px;
	transition: border-color var(--transition);
}
.gallery img:hover, .gallery img:focus {
	border-color: var(--color-warm-beige);
	outline: none;
}
.gallery-columns-1 .gallery-item { width: 100%; }
.gallery-columns-2 .gallery-item { width: 50%; }
.gallery-columns-3 .gallery-item { width: 33.3333%; }
.gallery-columns-4 .gallery-item { width: 25%; }
.gallery-columns-5 .gallery-item { width: 20%; }
.gallery-columns-6 .gallery-item { width: 16.6666%; }
.gallery-columns-7 .gallery-item { width: 14.2857%; }
.gallery-columns-8 .gallery-item { width: 12.5%; }
.gallery-columns-9 .gallery-item { width: 11.1111%; }
.gallery-columns-2 .gallery-item:nth-child(2n+1),
.gallery-columns-3 .gallery-item:nth-child(3n+1),
.gallery-columns-4 .gallery-item:nth-child(4n+1),
.gallery-columns-5 .gallery-item:nth-child(5n+1),
.gallery-columns-6 .gallery-item:nth-child(6n+1),
.gallery-columns-7 .gallery-item:nth-child(7n+1),
.gallery-columns-8 .gallery-item:nth-child(8n+1),
.gallery-columns-9 .gallery-item:nth-child(9n+1) { clear: left; }


/* ==========================================================================
   印刷スタイル
   ========================================================================== */

@media print {
	*, *::before, *::after {
		background: transparent !important;
		box-shadow: none !important;
		color: #333 !important;
		text-shadow: none !important;
	}
	a, a:visited { text-decoration: underline; }
	a[href]::after { content: " (" attr(href) ")"; }
	abbr[title]::after { content: " (" attr(title) ")"; }
	a[href^="javascript:"]::after,
	a[href^="#"]::after,
	.site-title > a::after { content: ""; }
	thead { display: table-header-group; }
	img, tr { page-break-inside: avoid; }
	img { max-width: 100% !important; }
	@page { margin: 2cm 0.5cm; }
	p, h2, h3 { orphans: 3; widows: 3; }
	blockquote, pre { border: 1px solid #999; page-break-inside: avoid; }
	h1, h2, h3, h4, h5, h6 {
		orphans: 3;
		page-break-after: avoid;
		page-break-inside: avoid;
		widows: 3;
	}
	dl, ol, ul { page-break-before: avoid; }
	.nav-toggle,
	.nav-primary,
	.nav-secondary,
	.sidebar,
	.breadcrumb,
	.comment-form,
	.entry-footer,
	.footer-widgets,
	.site-footer { display: none !important; }
	.content, .content-sidebar { width: 100%; }
}


/* ==========================================================================
   レスポンシブ ── タブレット（min-width: 600px）
   ========================================================================== */

@media screen and (min-width: 600px) {
	:root {
		--container-pad: 1.75rem;
	}
	h1.entry-title { font-size: 1.875rem; }
}


/* ==========================================================================
   レスポンシブ ── 中タブレット（min-width: 768px）
   ========================================================================== */

@media screen and (min-width: 768px) {
	:root {
		--container-pad: 2rem;
	}

	h1 { font-size: 2.25rem; }
	h2 { font-size: 1.75rem; }
	h3 { font-size: 1.375rem; }
	h1.entry-title { font-size: 2rem; }

	.entry {
		padding: var(--space-lg);
	}

	/* フッターウィジェット横並び */
	.footer-widgets .wrap {
		flex-direction: row;
	}

	.comment-respond input[type="email"],
	.comment-respond input[type="text"],
	.comment-respond input[type="url"] {
		width: 60%;
	}
}


/* ==========================================================================
   レスポンシブ ── デスクトップ（min-width: 1000px）
   ========================================================================== */

@media screen and (min-width: 1000px) {

	/* ハンバーガーボタンを非表示 */
	.nav-toggle {
		display: none;
	}

	/* ナビゲーション ── 水平レイアウト */
	.nav-primary {
		background-color: transparent;
		border-top: none;
		box-shadow: none;
		display: block;   /* 常に表示 */
		position: static;
		width: auto;
	}
	.nav-primary .wrap {
		padding: 0;
	}
	.nav-primary .menu {
		flex-direction: row;
		gap: 0.125rem;
	}
	.nav-primary .menu a {
		border-bottom: none;
		border-radius: var(--radius-sm);
		color: var(--color-ivory);
		font-size: 0.9375rem;
		padding: 0.5rem 0.875rem;
	}
	.nav-primary .menu a:hover,
	.nav-primary .menu a:focus {
		background-color: rgba(255, 255, 255, 0.15);
		color: var(--color-white);
	}
	.nav-primary .menu .current-menu-item > a,
	.nav-primary .menu .current-page-ancestor > a {
		background-color: rgba(255, 255, 255, 0.18);
		color: var(--color-white);
	}

	/* サブメニュー（デスクトップ） */
	.nav-primary .menu li {
		position: relative;
	}
	.nav-primary .sub-menu {
		background-color: var(--color-white);
		border-radius: var(--radius-md);
		box-shadow: var(--shadow-md);
		min-width: 180px;
		padding: 0.375rem 0;
		position: absolute;
		top: calc(100% + 4px);
		left: 0;
		z-index: 300;
	}
	.nav-primary .sub-menu a {
		border-bottom: 1px solid var(--color-pale-beige);
		border-radius: 0;
		padding: 0.625rem 1rem;
	}
	.nav-primary .sub-menu li:last-child a {
		border-bottom: none;
	}

	/* コンテンツ ＋ サイドバー 横並び */
	.content-sidebar-wrap {
		align-items: flex-start;
		flex-direction: row;
	}
	.content {
		flex: 1;
	}
	.sidebar {
		flex-shrink: 0;
		width: 280px;
	}

	h1.entry-title { font-size: 2.25rem; }
}


/* ==========================================================================
   レスポンシブ ── ワイドスクリーン（min-width: 1200px）
   ========================================================================== */

@media screen and (min-width: 1200px) {
	:root {
		--container-pad: 2.5rem;
	}
	.sidebar {
		width: 300px;
	}
}