/* ==========================================================================
   トップブロック（格子）— どのテーマでも同じ大きさ・見た目になるよう、ここですべて決める
   ・ブロックの大きさは、パソコン表示の px（--w・--h）× 縮める割合（--xtb-k）
   ・--xtb-k は、画面がせまいとき JS が決める（一番大きいブロックが収まるように。初期値 1）
   ・1マス＝メニューブロック（69×109）＋外側の余白 6px
   ========================================================================== */

.xtb-grid {
	--xtb-k: 1;
	--xtb-accent: #12864a;
	--xtb-ink: #1f2a37;
	--xtb-sub: #6b7280;
	--xtb-line: #e3e6ea;
	--xtb-soft: #f4f6f8;
	position: relative;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	text-align: left;
}
.xtb-grid::after { content: ""; display: block; clear: both; }
.xtb-grid *, .xtb-grid *::before, .xtb-grid *::after { box-sizing: border-box; }

/* 1マスの大きさの見本（Packery がこれを測る） */
.xtb-grid .xtb-sizer {
	position: absolute; top: 0; left: 0;
	width: calc(69px * var(--xtb-k)); height: calc(109px * var(--xtb-k)); margin: calc(6px * var(--xtb-k));
	visibility: hidden; pointer-events: none;
}

/* ブロックの入れ物。JSが動かないときは、左から順に並ぶ */
.xtb-grid .xtb-item { float: left; margin: 0; padding: 0; list-style: none; }
.xtb-grid.is-ready .xtb-item { float: none; }

/* ブロックの箱 */
.xtb-grid .xtb-b {
	position: relative;
	display: flow-root;
	float: none;
	width: calc(var(--w) * var(--xtb-k) * 1px);
	height: calc(var(--h) * var(--xtb-k) * 1px);
	margin: calc(6px * var(--xtb-k));
	padding: 0;
	overflow: hidden;
	font-size: calc(13px * max(var(--xtb-k), 0.82));
	line-height: 1.6;
	color: var(--xtb-ink);
}
.xtb-grid .xtb-b.xtb-s-auto { width: auto; height: auto; max-width: calc(100vw - 24px); overflow: visible; }
.xtb-grid .xtb-b img { max-width: 100%; height: auto; }
.xtb-grid .xtb-b a { text-decoration: none; }

/* 見た目：やわらかい影・角丸 */
.xtb-design-soft .xtb-b:not(.xtb-s-auto) {
	background: #fff;
	border-radius: calc(14px * var(--xtb-k));
	box-shadow: 0 1px 2px rgba(16, 28, 38, .07), 0 6px 20px rgba(16, 28, 38, .10);
}
.xtb-design-soft .xtb-b.xtb-s-menu { transition: transform .18s ease, box-shadow .18s ease; }
.xtb-design-soft .xtb-b.xtb-s-menu:hover { transform: translateY(-3px); box-shadow: 0 2px 4px rgba(16, 28, 38, .1), 0 12px 26px rgba(16, 28, 38, .2); }
/* 見た目：くっきりした影（従来の Xidear） */
.xtb-design-classic .xtb-b:not(.xtb-s-auto) { background: #fff; border-radius: 3px; box-shadow: 3px 3px 3px rgba(0, 0, 0, .4); }
/* 見た目：影なし・細い枠線 */
.xtb-design-flat .xtb-b:not(.xtb-s-auto) { background: #fff; border: 1px solid var(--xtb-line); border-radius: calc(8px * var(--xtb-k)); }

/* HTML：中身がはみ出したら、細いスクロール（class「noscroll」で、はみ出しを隠す） */
.xtb-grid .xtb-t-html:not(.xtb-s-auto) { overflow-y: auto; scrollbar-width: thin; scrollbar-color: #c5ccd3 transparent; }
.xtb-grid .xtb-b.noscroll { overflow: hidden; }
.xtb-grid .xtb-t-html .xtb-wtitle { margin: .4em .6em; font-size: 1.15em; }

/* 画像＋リンク */
.xtb-grid .xtb-t-image_link > a, .xtb-grid .xtb-t-image_link > img, .xtb-grid .xtb-t-image_link > a > img { display: block; width: 100%; height: 100%; }
.xtb-grid .xtb-t-image_link img { max-width: none; object-fit: cover; margin: 0; }
.xtb-grid .xtb-s-auto.xtb-t-image_link img, .xtb-grid .xtb-s-auto.xtb-t-image_link a { height: auto; }

/* スライダー */
.xtb-grid .xtb-slider { width: 100%; height: 100%; --swiper-navigation-size: 26px; --swiper-theme-color: #fff; }
.xtb-grid .xtb-slider .swiper-slide img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; margin: 0; }

/* 動画・埋め込み */
.xtb-grid .xtb-t-video video { display: block; width: 100%; height: 100%; object-fit: cover; }
.xtb-grid .xtb-embed, .xtb-grid .xtb-embed > * { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; }
.xtb-grid .xtb-embed iframe { position: absolute; inset: 0; width: 100% !important; height: 100% !important; border: 0; }

/* 埋め込み・動画の上端の、ドラッグ用のつまみ（ドラッグできるときだけ） */
.xtb-grid .xtb-dragbar { display: none; }
.xtb-grid.is-drag .xtb-dragbar {
	display: block; position: absolute; z-index: 5; top: 0; left: 0; right: 0; height: 28px;
	cursor: grab; background: linear-gradient(rgba(0, 0, 0, .35), rgba(0, 0, 0, 0)); opacity: 0; transition: opacity .15s ease;
}
.xtb-grid.is-drag .xtb-dragbar::before { content: ""; position: absolute; top: 8px; left: 50%; width: 36px; height: 4px; margin-left: -18px; border-radius: 4px; background: rgba(255, 255, 255, .9); }
.xtb-grid.is-drag .xtb-item:hover .xtb-dragbar, .xtb-grid.is-touch .xtb-dragbar { opacity: 1; }

/* 見出し（新着リスト・検索フォーム等） */
.xtb-grid .xtb-title {
	display: flex; align-items: center; gap: .4em; flex: 0 0 auto;
	margin: 0 0 .7em; padding: .15em .3em .15em .7em;
	border-left: .3em solid var(--xtb-accent);
	font-size: 1.15em; font-weight: 800; line-height: 1.35; color: var(--xtb-ink);
}
.xtb-grid a.xtb-title::after { content: "›"; margin-left: auto; font-size: 1.4em; line-height: 1; font-weight: 400; color: var(--xtb-accent); transition: transform .15s ease; }
.xtb-grid a.xtb-title:hover::after { transform: translateX(3px); }

/* リスト・検索：見出しは固定、中身だけスクロール */
.xtb-grid .xtb-t-post_list, .xtb-grid .xtb-t-newposts, .xtb-grid .xtb-t-search_form { display: flex; flex-direction: column; padding: calc(12px * var(--xtb-k)); }
.xtb-grid .xtb-s-auto.xtb-t-post_list, .xtb-grid .xtb-s-auto.xtb-t-newposts, .xtb-grid .xtb-s-auto.xtb-t-search_form { width: calc(312px * var(--xtb-k)); }
.xtb-grid .xtb-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #c5ccd3 transparent; }

/* 新着情報リスト（日付＋題名） */
.xtb-grid .xtb-postlist { list-style: none; margin: 0; padding: 0; }
.xtb-grid .xtb-postlist li { margin: 0 0 .5em; padding: 0 0 .45em; border-bottom: 1px dashed #d4d8dd; line-height: 1.45; list-style: none; }
.xtb-grid .xtb-postlist li:last-child { border-bottom: 0; }
.xtb-grid .xtb-date { display: block; font-size: .82em; color: var(--xtb-sub); letter-spacing: .03em; }
.xtb-grid .xtb-postlist a { font-weight: 700; color: var(--xtb-ink); }
.xtb-grid .xtb-postlist a:hover { color: var(--xtb-accent); }
.xtb-grid .xtb-more { display: block; margin-top: .3em; text-align: right; font-size: .9em; font-weight: 700; color: var(--xtb-accent); }
.xtb-grid .xtb-empty { margin: 0; color: var(--xtb-sub); }

/* 新着記事（画像つき） */
.xtb-grid .xtb-news { display: flex; flex-direction: column; gap: .15em; padding-right: .2em; }
.xtb-grid .xtb-news__row { display: flex; align-items: center; gap: .8em; padding: .5em .45em; border-radius: .8em; color: inherit; transition: background .15s ease, transform .15s ease; }
.xtb-grid .xtb-news__row:hover { background: var(--xtb-soft); transform: translateX(2px); }
.xtb-grid .xtb-news__thumb { position: relative; flex: 0 0 auto; width: 3.6em; height: 3.6em; border-radius: .8em; overflow: hidden; background: var(--xtb-accent); background-image: linear-gradient(135deg, rgba(255, 255, 255, .18), rgba(0, 0, 0, .18)); }
.xtb-grid .xtb-news__thumb img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; margin: 0; }
.xtb-grid .xtb-news__ini { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 1.5em; font-weight: 900; color: #fff; }
.xtb-grid .xtb-news__body { min-width: 0; display: flex; flex-direction: column; gap: .1em; }
.xtb-grid .xtb-news__meta { display: flex; flex-wrap: wrap; align-items: center; gap: .2em .7em; font-size: .8em; line-height: 1.3; font-weight: 700; color: var(--xtb-sub); }
.xtb-grid .xtb-news__meta em { font-style: normal; color: var(--xtb-accent); }
.xtb-grid .xtb-news__title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: .96em; line-height: 1.5; font-weight: 800; color: var(--xtb-ink); }
.xtb-grid .xtb-news__row:hover .xtb-news__title { color: var(--xtb-accent); }

/* 検索フォーム（チェックボックス → 選べるタグ）。格子の外（ショートコード等）でも同じ見た目 */
.xtb-sf { margin: 0; padding: 0; }
.xtb-sf__kw { display: block; width: 100%; box-sizing: border-box; margin: 0 0 .7em; padding: .6em 1em; border: 1px solid var(--xtb-line, #e3e6ea); border-radius: 99px; font: inherit; background: #fff; }
.xtb-sf__items { padding: .15em .3em 0 0; }
.xtb-sf__item { position: relative; display: inline-block; margin: 0 .35em .45em 0; padding: 0; cursor: pointer; }
.xtb-sf__item input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.xtb-sf__item span {
	display: inline-block; padding: .4em .85em; border-radius: 99px;
	background: var(--xtb-soft, #f4f6f8); border: 1px solid var(--xtb-line, #e3e6ea);
	font-size: .92em; line-height: 1.25; font-weight: 700; color: var(--xtb-ink, #1f2a37);
	transition: background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}
.xtb-sf__item:hover span { border-color: var(--xtb-accent, #12864a); transform: translateY(-1px); }
.xtb-sf__item input:checked + span { background: var(--xtb-accent, #12864a); border-color: var(--xtb-accent, #12864a); color: #fff; box-shadow: 0 3px 8px rgba(0, 0, 0, .18); }
.xtb-sf__item input:focus-visible + span { outline: 2px solid #1c7ed6; outline-offset: 2px; }
/* テーマの button／button:hover の色に負けないよう、.xtb-sf を付けて強めに指定する */
.xtb-sf .xtb-sf__submit, .xtb-sf .xtb-sf__submit:hover, .xtb-sf .xtb-sf__submit:focus, .xtb-sf .xtb-sf__submit:active {
	display: block; width: auto; min-height: 0; margin: .5em 0 .2em; padding: .7em 2.4em;
	border: 0; border-radius: 99px; cursor: pointer;
	font: inherit; font-size: 1em; font-weight: 900; line-height: 1.3; letter-spacing: .2em; text-transform: none; text-shadow: none; color: #fff;
	background-color: var(--xtb-accent, #12864a); background-image: linear-gradient(135deg, rgba(255, 255, 255, .15), rgba(0, 0, 0, .12));
	box-shadow: 0 5px 14px rgba(0, 0, 0, .2);
	transition: transform .15s ease, box-shadow .15s ease;
}
.xtb-sf .xtb-sf__submit:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(0, 0, 0, .25); }
/* ブロックの中：項目の部分だけスクロールし、「検索」ボタンは、いつも下に見える */
.xtb-grid .xtb-b > .xtb-sf, .xtb-grid .xtb-theme-sf { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }
.xtb-grid .xtb-b > .xtb-sf .xtb-sf__items { flex: 1 1 auto; min-height: 0; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #c5ccd3 transparent; }
.xtb-grid .xtb-b > .xtb-sf .xtb-sf__submit { flex: 0 0 auto; align-self: flex-start; }
.xtb-grid .xtb-theme-sf { overflow-y: auto; }

/* ウィジェット */
.xtb-grid .xtb-t-widget > * { float: none; }
.xtb-grid .xtb-t-widget:not(.xtb-s-auto) { overflow-y: auto; padding: calc(10px * var(--xtb-k)); }

/* 管理者にだけ出るお知らせ */
.xtb-note { margin: .5em; padding: .6em .8em; border: 1px dashed #d63638; background: #fff; color: #b32d2e; font-size: 12px; line-height: 1.6; }

/* ドラッグ */
.xtb-grid .xtb-item.is-draggable { cursor: grab; }
.xtb-grid .xtb-item.is-dragging { cursor: grabbing; opacity: .85; z-index: 20; }
.xtb-grid .xtb-item.is-positioning-post-drag { z-index: 10; }

/* 「ブロックを整頓する」ボタン（メニュー2つ分：幅150×高さ109） */
.xtb-grid .xtb-reset {
	display: flex; align-items: center; justify-content: center;
	width: calc(150px * var(--xtb-k)); height: calc(109px * var(--xtb-k)); margin: calc(6px * var(--xtb-k)); padding: .4em;
	background: #eceff2; border: 2px dashed #a3aab3; border-radius: calc(14px * var(--xtb-k));
	font: inherit; font-size: calc(14px * max(var(--xtb-k), .82)); font-weight: 800; line-height: 1.4; color: #3c4650; text-align: center;
	cursor: pointer; white-space: normal; text-transform: none; text-shadow: none; box-shadow: none; background-image: none;
}
.xtb-grid .xtb-reset:hover, .xtb-grid .xtb-reset:focus { background: #e2e6ea; background-image: none; border-color: var(--xtb-accent); color: var(--xtb-accent); text-shadow: none; }
.xtb-design-classic .xtb-reset { border-radius: 3px; }

/* 「トップページ全体」表示 */
.xtb-page { display: block; padding: 16px 12px 32px; }
.xtb-page__inner { margin: 0 auto; }
.xtb-auto-wrap { margin: 0 0 24px; }

@media (prefers-reduced-motion: reduce) {
	.xtb-grid *, .xtb-sf * { transition: none !important; }
}