@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ — 水道ラボ
    Version: 2.0.0
    Author: 水道ラボ
    Author URI: https://suido-lab.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* ==========================================================================
   1. CSS変数 — カラーパレット & タイポグラフィ
   ========================================================================== */

:root {
	/* --- カラーパレット（水道ラボ v2） --- */
	--color_main: #1B4965;
	--color_main_thin: rgba(27, 73, 101, 0.07);
	--color_main_dark: #143a52;
	--color_text: #2D3748;
	--color_link: #1B4965;
	--color_htag: #1B4965;
	--color_bg: #F8F9FA;

	/* アクセントカラー */
	--sl-accent: #A2D2FF;
	--sl-accent-mid: #5BA4CF;
	--sl-accent-light: #D0E8FF;
	--sl-accent-pale: #EBF4FF;
	--sl-cta: #2D6A8F;
	--sl-cta-hover: #1B4965;

	/* ニュートラル */
	--sl-white: #FFFFFF;
	--sl-off-white: #F8F9FA;
	--sl-gray-50: #F7F8F9;
	--sl-gray-100: #EDF0F2;
	--sl-gray-200: #DEE2E6;
	--sl-gray-300: #CED4DA;
	--sl-gray-400: #ADB5BD;
	--sl-gray-500: #6C757D;
	--sl-gray-600: #495057;
	--sl-gray-700: #343A40;
	--sl-gray-800: #212529;
	--sl-dark-navy: #0F2940;

	/* カラーテーマ（紺色ベース + 水色アクセント） */
	--color_gradient1: #A2D2FF;
	--color_gradient2: #1B4965;
	--sl-primary: #1B4965;
	--sl-primary-dark: #143a52;
	--sl-primary-light: #2D6A8F;
	--sl-accent-bright: #00d4ff;
	--sl-gradient-main: #1B4965;
	--sl-gradient-hero: #1B4965;
	--sl-gradient-accent: #1B4965;
	--sl-gradient-subtle: rgba(27, 73, 101, 0.06);
	--sl-gradient-border: #1B4965;

	/* ヘッダー */
	--color_header_bg: rgba(255, 255, 255, 0.92);
	--color_header_text: #2D3748;

	/* フッター */
	--color_footer_bg: #0F2940;
	--color_footer_text: #DEE2E6;

	/* モバイルメニュー */
	--color_spmenu_bg: #FFFFFF;
	--color_spmenu_text: #2D3748;

	/* --- タイポグラフィ --- */
	--swl-font_family: "Noto Sans JP", "Inter", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
	--swl-font_weight: 400;
	--sl-font-heading: "Noto Sans JP", sans-serif;
	--sl-font-en: "Inter", sans-serif;
	--swl-fz--root: 16px;

	/* ボタン角丸 */
	--the-btn-radius: 6px;

	/* トランジション */
	--sl-transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
	--sl-transition-fast: all 0.15s ease;

	/* シャドウ */
	--sl-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06);
	--sl-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
	--sl-shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.1);
	--sl-shadow-btn: 0 2px 8px rgba(27, 73, 101, 0.15);
	--sl-shadow-btn-hover: 0 4px 16px rgba(27, 73, 101, 0.25);

	/* ボーダー半径 */
	--sl-radius-sm: 6px;
	--sl-radius-md: 8px;
	--sl-radius-lg: 12px;
	--sl-radius-full: 50px;
}


/* ==========================================================================
   2. ベーススタイル
   ========================================================================== */

body {
	color: var(--color_text);
	background-color: var(--sl-off-white);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	letter-spacing: 0.02em;
	line-height: 1.85;
}


/* ==========================================================================
   3. ヘッダー
   ========================================================================== */

.l-header {
	background: var(--color_header_bg) !important;
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border-bottom: 1px solid rgba(27, 73, 101, 0.06);
	transition: var(--sl-transition);
}

.l-header.-scrolled,
.l-header[data-scrolled="true"] {
	box-shadow: var(--sl-shadow-sm);
}

.c-headLogo img {
	transition: var(--sl-transition);
}

.c-gnav a {
	font-weight: 500;
	letter-spacing: 0.03em;
	position: relative;
	transition: var(--sl-transition-fast);
}

.c-gnav > li > a::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 0;
	height: 2px;
	background: var(--color_main);
	transition: var(--sl-transition);
	transform: translateX(-50%);
}

.c-gnav > li > a:hover::after,
.c-gnav > li.current-menu-item > a::after {
	width: 60%;
}

.l-header .c-headerBtn,
.l-header .header-cta {
	background: var(--color_main);
	color: var(--sl-white);
	border-radius: var(--sl-radius-sm);
	padding: 8px 20px;
	font-weight: 600;
	font-size: 0.85rem;
	transition: var(--sl-transition);
	border: none;
}

.l-header .c-headerBtn:hover,
.l-header .header-cta:hover {
	background: var(--sl-cta);
	transform: translateY(-1px);
}


/* ==========================================================================
   4. メインビジュアル / ヒーロー
   ========================================================================== */

.p-mainVisual {
	position: relative;
	overflow: hidden;
}

.p-mainVisual::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: var(--sl-gradient-hero);
	pointer-events: none;
	z-index: 1;
}

.p-mainVisual__inner,
.p-mainVisual__body,
.p-mainVisual__slide .p-mainVisual__textLayer {
	position: relative;
	z-index: 2;
}

.p-mainVisual__title,
.p-mainVisual .c-mvTitle {
	font-family: var(--sl-font-heading);
	font-weight: 700;
	font-size: clamp(1.6rem, 3.5vw, 3rem);
	line-height: 1.4;
	color: var(--sl-white);
	letter-spacing: 0.03em;
}

.p-mainVisual__text,
.p-mainVisual .c-mvText {
	font-family: var(--sl-font-heading);
	font-weight: 400;
	font-size: clamp(0.9rem, 1.6vw, 1.15rem);
	color: rgba(255, 255, 255, 0.88);
	line-height: 1.8;
	margin-top: 1rem;
}

.p-mainVisual__btn a,
.p-mainVisual .swell-block-button a {
	background: var(--sl-white);
	color: var(--color_main);
	border-radius: var(--sl-radius-sm);
	padding: 12px 36px;
	font-weight: 600;
	font-size: 0.95rem;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
	transition: var(--sl-transition);
	border: none;
}

.p-mainVisual__btn a:hover,
.p-mainVisual .swell-block-button a:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 25px rgba(0, 0, 0, 0.18);
}


/* ==========================================================================
   5. 見出し（h2〜h4）
   ========================================================================== */

.post_content h2,
.c-postTitle,
.swell-block-fullWide__title {
	font-family: var(--sl-font-heading);
	font-weight: 700;
	color: var(--color_main);
	letter-spacing: 0.02em;
	line-height: 1.5;
}

.post_content h2 {
	position: relative;
	padding: 0.7em 0 0.5em;
	border: none;
	background: none;
}

.post_content h2::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 48px;
	height: 2px;
	background: var(--color_main);
	border-radius: 1px;
}

.post_content h3 {
	font-family: var(--sl-font-heading);
	font-weight: 700;
	color: var(--sl-gray-800);
	letter-spacing: 0.02em;
}

.post_content h4 {
	font-family: var(--sl-font-heading);
	font-weight: 600;
	color: var(--sl-gray-700);
}


/* ==========================================================================
   6. ボタンスタイル
   ========================================================================== */

.swell-block-button a,
.wp-block-button__link {
	border-radius: var(--sl-radius-sm) !important;
	font-weight: 600;
	letter-spacing: 0.03em;
	transition: var(--sl-transition);
}

.swell-block-button a:hover,
.wp-block-button__link:hover {
	transform: translateY(-1px);
	opacity: 0.92;
}

.swell-block-button .is-style-btn_normal a,
.-btn-n a {
	background: var(--color_main);
	border: none;
	color: var(--sl-white);
}

.swell-block-button .is-style-btn_line a {
	background: transparent;
	border: 1.5px solid var(--color_main);
	color: var(--color_main);
}

.swell-block-button .is-style-btn_line a:hover {
	background: var(--color_main);
	color: var(--sl-white);
}


/* ==========================================================================
   7. カード & コンテンツブロック
   ========================================================================== */

.p-postList__item {
	border-radius: var(--sl-radius-md);
	overflow: hidden;
	transition: var(--sl-transition);
	background: var(--sl-white);
	box-shadow: var(--sl-shadow-sm);
	border: 1px solid var(--sl-gray-100);
}

.p-postList__item:hover {
	transform: translateY(-3px);
	box-shadow: var(--sl-shadow-md);
	border-color: var(--sl-accent);
}

.p-postList__thumb {
	overflow: hidden;
}

.p-postList__thumb img {
	transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.p-postList__item:hover .p-postList__thumb img {
	transform: scale(1.03);
}

.p-postList__title {
	font-family: var(--sl-font-heading);
	font-weight: 600;
	color: var(--sl-gray-800);
	line-height: 1.55;
}

.p-postList__cat,
.c-postThumb__cat {
	background: var(--color_main);
	color: var(--sl-white);
	border-radius: 3px;
	font-weight: 600;
	font-size: 0.68rem;
	letter-spacing: 0.04em;
	padding: 2px 10px;
}

.p-blogCard {
	border-radius: var(--sl-radius-md);
	border: 1px solid var(--sl-gray-200);
	overflow: hidden;
	transition: var(--sl-transition);
}

.p-blogCard:hover {
	box-shadow: var(--sl-shadow-md);
	border-color: var(--sl-accent);
}


/* ==========================================================================
   8. フルワイドセクション
   ========================================================================== */

.swell-block-fullWide {
	padding: 80px 0;
}

.swell-block-fullWide__title {
	font-size: clamp(1.5rem, 3vw, 2.2rem);
	font-weight: 700;
	text-align: center;
	margin-bottom: 2rem;
}


/* ==========================================================================
   9. フッター
   ========================================================================== */

.l-footer {
	background: var(--sl-dark-navy) !important;
	color: var(--sl-gray-200);
}

.l-footer a {
	color: var(--sl-gray-300);
	transition: var(--sl-transition-fast);
}

.l-footer a:hover {
	color: var(--sl-accent);
}

.l-footer .copyright {
	color: var(--sl-gray-500);
	font-size: 0.8rem;
}

.l-footer .widget-title {
	color: var(--sl-white);
	font-family: var(--sl-font-heading);
	font-weight: 600;
	font-size: 0.95rem;
	letter-spacing: 0.03em;
	border-bottom: 1px solid rgba(162, 210, 255, 0.2);
	padding-bottom: 0.6em;
	margin-bottom: 1.2em;
}

.w-beforeFooter {
	background: var(--sl-dark-navy);
	color: var(--sl-gray-200);
	padding: 60px 0 40px;
}


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

.l-sidebar {
	font-size: 0.9rem;
}

.l-sidebar .widget-title {
	font-family: var(--sl-font-heading);
	font-weight: 600;
	font-size: 0.95rem;
	color: var(--color_main);
	border-bottom: 1px solid var(--sl-gray-200);
	padding-bottom: 0.5em;
}

.l-sidebar .widget {
	background: var(--sl-white);
	border-radius: var(--sl-radius-md);
	padding: 1.5em;
	border: 1px solid var(--sl-gray-100);
}


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

.p-breadcrumb {
	font-size: 0.8rem;
	color: var(--sl-gray-500);
}

.p-breadcrumb a {
	color: var(--color_main);
	transition: var(--sl-transition-fast);
}

.p-breadcrumb a:hover {
	color: var(--sl-accent-mid);
}


/* ==========================================================================
   12. セクション余白 & レイアウト
   ========================================================================== */

.l-content {
	padding-top: 40px;
	padding-bottom: 60px;
}

.post_content {
	line-height: 1.9;
}

.post_content p {
	margin-bottom: 1.5em;
}

.post_content ul,
.post_content ol {
	margin-bottom: 1.5em;
}


/* ==========================================================================
   13. テーブルスタイル
   ========================================================================== */

.post_content table {
	border-radius: var(--sl-radius-sm);
	overflow: hidden;
}

.post_content table th {
	background: var(--color_main);
	color: var(--sl-white);
	font-weight: 600;
}

.post_content table td {
	border-color: var(--sl-gray-200);
}

.post_content table tr:nth-child(even) td {
	background-color: var(--sl-gray-50);
}


/* ==========================================================================
   14. ピックアップバナー / 記事スライダー
   ========================================================================== */

.p-pickupBanners__item {
	border-radius: var(--sl-radius-md);
	overflow: hidden;
	transition: var(--sl-transition);
}

.p-pickupBanners__item:hover {
	transform: translateY(-3px);
	box-shadow: var(--sl-shadow-md);
}

.p-pickupBanners__item img {
	transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.p-pickupBanners__item:hover img {
	transform: scale(1.03);
}

.p-postSlider .p-postList__item {
	border-radius: var(--sl-radius-md);
}


/* ==========================================================================
   15. スクロールアニメーション
   ========================================================================== */

.sl-fade-in {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1),
	            transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.sl-fade-in.is-visible {
	opacity: 1;
	transform: translateY(0);
}


/* ==========================================================================
   16. フロントページ — セクション共通
   ========================================================================== */

.sl-section {
	padding: 72px 0;
	position: relative;
}

.sl-section:nth-child(even) {
	background: var(--sl-gray-50);
}

.sl-section__inner {
	max-width: 1100px;
	margin: 0 auto;
	padding: 0 20px;
}

/* セクションヘッダー */
.sl-section__header {
	text-align: center;
	margin-bottom: 40px;
}

.sl-section__label {
	font-family: var(--sl-font-en);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--sl-accent-mid);
	display: block;
	margin-bottom: 6px;
}

.sl-section__title {
	font-family: var(--sl-font-heading);
	font-size: clamp(1.35rem, 2.5vw, 1.75rem);
	font-weight: 700;
	color: var(--color_main);
	line-height: 1.4;
	margin: 0;
}

.sl-section__title::after {
	content: "";
	display: block;
	width: 40px;
	height: 2px;
	background: var(--sl-accent-mid);
	margin: 14px auto 0;
}

.sl-section__more {
	text-align: center;
	margin-top: 36px;
}

.sl-section__more a {
	display: inline-block;
	font-family: var(--sl-font-heading);
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--color_main);
	border: 1.5px solid var(--color_main);
	border-radius: var(--sl-radius-sm);
	padding: 10px 32px;
	transition: var(--sl-transition);
	text-decoration: none;
}

.sl-section__more a:hover {
	background: var(--color_main);
	color: var(--sl-white);
	transform: translateY(-1px);
}


/* ==========================================================================
   17. フロントページ — Hero セクション
   ========================================================================== */

.sl-hero {
	background: var(--sl-primary);
	color: var(--sl-white);
	padding: 80px 0 72px;
	text-align: center;
}

.sl-hero__title {
	font-family: var(--sl-font-heading);
	font-size: clamp(1.6rem, 3.5vw, 2.6rem);
	font-weight: 700;
	line-height: 1.4;
	margin: 0 0 16px;
	letter-spacing: 0.03em;
}

.sl-hero__desc {
	font-size: clamp(0.9rem, 1.4vw, 1.05rem);
	line-height: 1.9;
	color: rgba(255, 255, 255, 0.85);
	max-width: 640px;
	margin: 0 auto;
}


/* ==========================================================================
   18. フロントページ — Column セクション
   ========================================================================== */

.sl-column-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

.sl-column-card {
	background: var(--sl-white);
	border-radius: var(--sl-radius-md);
	overflow: hidden;
	border: 1px solid var(--sl-gray-100);
	transition: var(--sl-transition);
	text-decoration: none;
	color: inherit;
	display: block;
}

.sl-column-card:hover {
	transform: translateY(-3px);
	box-shadow: var(--sl-shadow-md);
	border-color: var(--sl-accent);
}

.sl-column-card__thumb {
	aspect-ratio: 16 / 9;
	overflow: hidden;
	position: relative;
}

.sl-column-card__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.sl-column-card:hover .sl-column-card__thumb img {
	transform: scale(1.03);
}

.sl-column-card__cat {
	position: absolute;
	top: 10px;
	left: 10px;
	background: var(--color_main);
	color: var(--sl-white);
	font-size: 0.68rem;
	font-weight: 600;
	padding: 2px 10px;
	border-radius: 3px;
	letter-spacing: 0.03em;
}

.sl-column-card__body {
	padding: 16px 18px 20px;
}

.sl-column-card__date {
	font-family: var(--sl-font-en);
	font-size: 0.75rem;
	color: var(--sl-gray-400);
	margin-bottom: 6px;
}

.sl-column-card__title {
	font-family: var(--sl-font-heading);
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--sl-gray-800);
	line-height: 1.55;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}


/* ==========================================================================
   19. フロントページ — News セクション
   ========================================================================== */

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

.sl-news-item {
	display: flex;
	align-items: baseline;
	gap: 16px;
	padding: 14px 0;
	border-bottom: 1px solid var(--sl-gray-100);
	transition: var(--sl-transition-fast);
}

.sl-news-item:first-child {
	border-top: 1px solid var(--sl-gray-100);
}

.sl-news-item:hover {
	background: var(--sl-gray-50);
	padding-left: 8px;
	padding-right: 8px;
}

.sl-news-date {
	font-family: var(--sl-font-en);
	font-size: 0.8rem;
	color: var(--sl-gray-400);
	white-space: nowrap;
	min-width: 90px;
}

.sl-news-source {
	font-size: 0.7rem;
	font-weight: 600;
	color: var(--sl-accent-mid);
	background: var(--sl-accent-pale);
	padding: 1px 8px;
	border-radius: 3px;
	white-space: nowrap;
}

.sl-news-title {
	font-size: 0.92rem;
	font-weight: 500;
	color: var(--sl-gray-700);
	flex: 1;
}

.sl-news-title a {
	color: inherit;
	text-decoration: none;
	transition: var(--sl-transition-fast);
}

.sl-news-title a:hover {
	color: var(--color_main);
}

/* プレースホルダー */
.sl-news-placeholder {
	text-align: center;
	padding: 40px 20px;
	background: var(--sl-gray-50);
	border-radius: var(--sl-radius-md);
	border: 1px dashed var(--sl-gray-300);
	color: var(--sl-gray-500);
	font-size: 0.9rem;
}


/* ==========================================================================
   20. フロントページ — Statistics セクション
   ========================================================================== */

.sl-stats-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

.sl-stat-card {
	background: var(--sl-white);
	border-radius: var(--sl-radius-md);
	padding: 28px 20px;
	text-align: center;
	border: 1px solid var(--sl-gray-100);
	transition: var(--sl-transition);
}

.sl-stat-card:hover {
	border-color: var(--sl-accent);
	box-shadow: var(--sl-shadow-md);
}

.sl-stat-value {
	font-family: var(--sl-font-en);
	font-size: 2.2rem;
	font-weight: 700;
	color: var(--color_main);
	line-height: 1.2;
}

.sl-stat-unit {
	font-size: 0.85rem;
	font-weight: 500;
	color: var(--sl-gray-600);
	margin-left: 2px;
}

.sl-stat-label {
	font-size: 0.85rem;
	font-weight: 500;
	color: var(--sl-gray-600);
	margin-top: 8px;
	line-height: 1.4;
}

.sl-stat-source {
	font-size: 0.7rem;
	color: var(--sl-gray-400);
	margin-top: 6px;
}

/* プレースホルダー */
.sl-stats-placeholder {
	text-align: center;
	padding: 48px 20px;
	color: var(--sl-gray-500);
	font-size: 0.9rem;
}


/* ==========================================================================
   21. フロントページ — Resources セクション
   ========================================================================== */

.sl-resources-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px;
}

.sl-resource-item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 18px;
	background: var(--sl-white);
	border-radius: var(--sl-radius-sm);
	border: 1px solid var(--sl-gray-100);
	transition: var(--sl-transition);
	text-decoration: none;
	color: var(--sl-gray-700);
	font-size: 0.9rem;
	font-weight: 500;
}

.sl-resource-item:hover {
	border-color: var(--sl-accent);
	color: var(--color_main);
	background: var(--sl-accent-pale);
}

.sl-resource-icon {
	flex-shrink: 0;
	width: 20px;
	height: 20px;
	color: var(--sl-accent-mid);
}

.sl-resource-external {
	margin-left: auto;
	flex-shrink: 0;
	width: 14px;
	height: 14px;
	color: var(--sl-gray-400);
}


/* ==========================================================================
   22. フロントページ — Glossary セクション
   ========================================================================== */

.sl-glossary-nav {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: center;
	margin-bottom: 32px;
	padding: 16px;
	background: var(--sl-white);
	border-radius: var(--sl-radius-md);
	border: 1px solid var(--sl-gray-100);
}

.sl-glossary-nav__item {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	font-family: var(--sl-font-heading);
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--sl-gray-600);
	border-radius: var(--sl-radius-sm);
	text-decoration: none;
	transition: var(--sl-transition-fast);
}

.sl-glossary-nav__item:hover,
.sl-glossary-nav__item.is-active {
	background: var(--color_main);
	color: var(--sl-white);
}

.sl-glossary-nav__item.is-disabled {
	color: var(--sl-gray-300);
	pointer-events: none;
}

.sl-glossary-group {
	margin-bottom: 24px;
}

.sl-glossary-group__title {
	font-family: var(--sl-font-heading);
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--color_main);
	padding-bottom: 8px;
	border-bottom: 2px solid var(--sl-accent);
	margin-bottom: 12px;
}

.sl-glossary-list {
	margin: 0;
}

.sl-glossary-list dt {
	font-weight: 600;
	color: var(--sl-gray-800);
	font-size: 0.95rem;
	padding: 10px 0 2px;
}

.sl-glossary-list dd {
	margin: 0 0 0 0;
	padding: 0 0 10px;
	font-size: 0.88rem;
	color: var(--sl-gray-600);
	line-height: 1.7;
	border-bottom: 1px solid var(--sl-gray-100);
}

.sl-glossary-list dd a {
	color: var(--color_main);
	font-size: 0.8rem;
	margin-left: 8px;
}


/* ==========================================================================
   23. フロントページ — CTA セクション
   ========================================================================== */

.sl-cta-section {
	background: var(--color_main);
	color: var(--sl-white);
	text-align: center;
	padding: 64px 20px;
}

.sl-cta-section__title {
	font-family: var(--sl-font-heading);
	font-size: clamp(1.2rem, 2.5vw, 1.6rem);
	font-weight: 700;
	margin: 0 0 12px;
}

.sl-cta-section__desc {
	font-size: 0.95rem;
	color: rgba(255, 255, 255, 0.8);
	margin-bottom: 24px;
}

.sl-cta-section__btn {
	display: inline-block;
	background: var(--sl-white);
	color: var(--color_main);
	font-weight: 600;
	font-size: 0.95rem;
	padding: 12px 36px;
	border-radius: var(--sl-radius-sm);
	text-decoration: none;
	transition: var(--sl-transition);
}

.sl-cta-section__btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}


/* ==========================================================================
   24. SPメニュー
   ========================================================================== */

.c-spMenu {
	background: var(--sl-white);
}

.c-spMenu__inner a {
	font-weight: 500;
	color: var(--sl-gray-700);
	padding: 0.8em 1em;
	border-bottom: 1px solid var(--sl-gray-100);
	transition: var(--sl-transition-fast);
}

.c-spMenu__inner a:hover {
	color: var(--color_main);
	background: var(--sl-gray-50);
}

.c-menuBtn span {
	background: var(--color_main);
}


/* ==========================================================================
   25. ウィジェット共通
   ========================================================================== */

.c-widget__title {
	font-family: var(--sl-font-heading);
	font-weight: 600;
	position: relative;
	padding-bottom: 0.5em;
	border-bottom: 1px solid var(--sl-gray-200);
}


/* ==========================================================================
   26. SWELLカスタムブロック
   ========================================================================== */

.swell-block-accordion__title {
	border-radius: var(--sl-radius-sm);
	font-weight: 600;
}

.swell-block-faq .faq_q {
	font-weight: 700;
}

.swell-block-step__title {
	font-family: var(--sl-font-heading);
	font-weight: 700;
}

.swell-block-tab__btn {
	font-weight: 600;
	transition: var(--sl-transition-fast);
}

.swell-block-tab__btn.is-active {
	background: var(--color_main);
	color: var(--sl-white);
}


/* ==========================================================================
   27. レスポンシブ
   ========================================================================== */

@media (max-width: 959px) {

	.l-header {
		background: rgba(255, 255, 255, 0.95) !important;
	}

	.sl-section {
		padding: 52px 0;
	}

	.sl-hero {
		padding: 56px 0 48px;
	}

	.sl-column-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
	}

	.sl-stats-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.sl-resources-grid {
		grid-template-columns: 1fr;
	}

	.sl-news-item {
		flex-wrap: wrap;
		gap: 6px 12px;
	}

	.p-postList__item:hover {
		transform: none;
	}

	.swell-block-fullWide {
		padding: 50px 0;
	}
}

@media (max-width: 599px) {

	.sl-column-grid {
		grid-template-columns: 1fr;
	}

	.sl-stats-grid {
		grid-template-columns: 1fr 1fr;
		gap: 12px;
	}

	.sl-stat-value {
		font-size: 1.8rem;
	}

	.sl-glossary-nav__item {
		width: 34px;
		height: 34px;
		font-size: 0.8rem;
	}

	.sl-section__header {
		margin-bottom: 28px;
	}

	.p-mainVisual__btn a,
	.p-mainVisual .swell-block-button a {
		padding: 10px 28px;
		font-size: 0.88rem;
	}

	.l-sidebar .widget {
		padding: 1.2em;
	}
}


/* ==========================================================================
   28. 統計ダッシュボード カード
   ========================================================================== */

/* グリッドレイアウト */
.sl-stats-grid[data-columns="2"] {
	grid-template-columns: repeat(2, 1fr);
}

.sl-stats-grid[data-columns="3"] {
	grid-template-columns: repeat(3, 1fr);
}

.sl-stats-grid[data-columns="4"] {
	grid-template-columns: repeat(4, 1fr);
}

/* カード本体 */
.sl-stat-card {
	background: var(--sl-white);
	border-radius: var(--sl-radius-lg);
	padding: 24px;
	text-align: left;
	border: 1px solid var(--sl-gray-100);
	transition: var(--sl-transition);
	display: flex;
	flex-direction: column;
	position: relative;
	overflow: hidden;
}

.sl-stat-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 4px;
	height: 100%;
	background: var(--sl-gray-200);
	transition: var(--sl-transition);
}

.sl-stat-card[data-status="good"]::before {
	background: #10b981;
}

.sl-stat-card[data-status="warning"]::before {
	background: #f59e0b;
}

.sl-stat-card[data-status="danger"]::before {
	background: #ef4444;
}

.sl-stat-card:hover {
	border-color: var(--sl-accent);
	box-shadow: var(--sl-shadow-md);
	transform: translateY(-2px);
}

/* カードヘッダー */
.sl-stat-card__header {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--sl-gray-100);
}

.sl-stat-card__icon {
	width: 24px;
	height: 24px;
	color: var(--sl-gray-400);
}

.sl-stat-card__icon svg {
	width: 100%;
	height: 100%;
}

.sl-stat-card__category {
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

/* カードタイトル */
.sl-stat-card__title {
	font-family: var(--sl-font-heading);
	font-size: 1rem;
	font-weight: 700;
	color: var(--sl-gray-800);
	margin: 0 0 12px;
	line-height: 1.4;
}

/* 数値表示 */
.sl-stat-card__value {
	margin-bottom: 16px;
}

.sl-stat-card__number {
	font-family: var(--sl-font-en);
	font-size: 2.4rem;
	font-weight: 700;
	color: var(--color_main);
	line-height: 1;
}

.sl-stat-card__unit {
	font-size: 0.9rem;
	font-weight: 500;
	color: var(--sl-gray-500);
	margin-left: 4px;
}

.sl-stat-card__placeholder {
	font-size: 1.8rem;
	color: var(--sl-gray-300);
}

/* 説明文 */
.sl-stat-card__description {
	font-size: 0.85rem;
	color: var(--sl-gray-600);
	line-height: 1.7;
	margin: 0 0 12px;
	flex-grow: 1;
}

/* 補足解説 */
.sl-stat-card__supplement {
	background: var(--sl-accent-pale);
	border-radius: var(--sl-radius-sm);
	padding: 12px 14px;
	font-size: 0.8rem;
	color: var(--sl-gray-700);
	line-height: 1.65;
	margin-bottom: 12px;
}

.sl-stat-card__supplement strong {
	display: block;
	color: var(--color_main);
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.03em;
	margin-bottom: 4px;
}

/* 詳細リンク */
.sl-stat-card__link {
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--color_main);
	text-decoration: none;
	transition: var(--sl-transition-fast);
	margin-top: auto;
}

.sl-stat-card__link:hover {
	color: var(--sl-cta);
}


/* ==========================================================================
   29. 統計ダッシュボード 出典リンク
   ========================================================================== */

.sl-stats-source {
	margin-top: 40px;
}

.sl-stats-source__inner {
	display: flex;
	align-items: flex-start;
	gap: 20px;
	background: linear-gradient(135deg, #1B4965 0%, #2D6A8F 100%);
	border-radius: var(--sl-radius-lg);
	padding: 28px 32px;
	color: var(--sl-white);
}

.sl-stats-source__logo {
	flex-shrink: 0;
	width: 48px;
	height: 48px;
	background: rgba(255, 255, 255, 0.15);
	border-radius: var(--sl-radius-md);
	display: flex;
	align-items: center;
	justify-content: center;
}

.sl-stats-source__logo svg {
	width: 28px;
	height: 28px;
	color: var(--sl-white);
}

.sl-stats-source__content {
	flex: 1;
}

.sl-stats-source__title {
	font-family: var(--sl-font-heading);
	font-size: 0.9rem;
	font-weight: 700;
	margin: 0 0 8px;
	letter-spacing: 0.03em;
}

.sl-stats-source__text {
	font-size: 0.85rem;
	line-height: 1.7;
	color: rgba(255, 255, 255, 0.85);
	margin: 0 0 16px;
}

.sl-stats-source__button {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: var(--sl-white);
	color: var(--color_main);
	font-size: 0.85rem;
	font-weight: 600;
	padding: 10px 20px;
	border-radius: var(--sl-radius-sm);
	text-decoration: none;
	transition: var(--sl-transition);
}

.sl-stats-source__button svg {
	width: 16px;
	height: 16px;
}

.sl-stats-source__button:hover {
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}


/* ==========================================================================
   30. 統計ダッシュボード レスポンシブ
   ========================================================================== */

@media (max-width: 959px) {
	.sl-stats-grid[data-columns="3"],
	.sl-stats-grid[data-columns="4"] {
		grid-template-columns: repeat(2, 1fr);
	}

	.sl-stat-card__number {
		font-size: 2rem;
	}

	.sl-stats-source__inner {
		flex-direction: column;
		align-items: center;
		text-align: center;
		padding: 24px;
	}
}

@media (max-width: 599px) {
	.sl-stats-grid[data-columns="2"],
	.sl-stats-grid[data-columns="3"],
	.sl-stats-grid[data-columns="4"] {
		grid-template-columns: 1fr;
	}

	.sl-stat-card {
		padding: 20px;
	}

	.sl-stat-card__number {
		font-size: 1.8rem;
	}

	.sl-stats-source__inner {
		padding: 20px;
	}

	.sl-stats-source__logo {
		width: 40px;
		height: 40px;
	}

	.sl-stats-source__logo svg {
		width: 24px;
		height: 24px;
	}
}


/* ==========================================================================
   31. デジタル庁ダッシュボード 埋め込み
   ========================================================================== */

.sl-gov-dashboard {
	margin: 32px 0;
}

.sl-gov-dashboard__title {
	font-family: var(--sl-font-heading);
	font-size: 1.3rem;
	font-weight: 700;
	color: var(--color_main);
	margin: 0 0 16px;
	text-align: center;
}

/* タブ切り替え */
.sl-gov-dashboard__tabs {
	display: flex;
	gap: 4px;
	margin-bottom: 0;
	background: var(--sl-gray-100);
	padding: 4px;
	border-radius: var(--sl-radius-md) var(--sl-radius-md) 0 0;
}

.sl-gov-dashboard__tab {
	flex: 1;
	padding: 12px 16px;
	font-family: var(--sl-font-heading);
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--sl-gray-600);
	background: transparent;
	border: none;
	border-radius: var(--sl-radius-sm);
	cursor: pointer;
	transition: var(--sl-transition-fast);
}

.sl-gov-dashboard__tab:hover {
	color: var(--color_main);
	background: var(--sl-white);
}

.sl-gov-dashboard__tab.is-active {
	color: var(--sl-white);
	background: var(--color_main);
}

/* iframe フレーム */
.sl-gov-dashboard__frame {
	background: var(--sl-white);
	border: 1px solid var(--sl-gray-200);
	border-top: none;
	border-radius: 0 0 var(--sl-radius-md) var(--sl-radius-md);
	overflow: hidden;
}

.sl-gov-dashboard__frame iframe {
	display: block;
	border: none;
}

/* フッター */
.sl-gov-dashboard__footer {
	margin-top: 16px;
	padding: 16px 20px;
	background: var(--sl-gray-50);
	border-radius: var(--sl-radius-md);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
}

.sl-gov-dashboard__note {
	font-size: 0.8rem;
	color: var(--sl-gray-500);
	margin: 0;
	flex: 1;
	min-width: 200px;
}

.sl-gov-dashboard__link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--color_main);
	text-decoration: none;
	white-space: nowrap;
	transition: var(--sl-transition-fast);
}

.sl-gov-dashboard__link svg {
	width: 16px;
	height: 16px;
}

.sl-gov-dashboard__link:hover {
	color: var(--sl-cta);
}


/* ==========================================================================
   32. ダッシュボード イントロセクション
   ========================================================================== */

.sl-dashboard-intro {
	margin-bottom: 40px;
}

.sl-dashboard-intro__header {
	text-align: center;
	margin-bottom: 32px;
}

.sl-dashboard-intro__title {
	font-family: var(--sl-font-heading);
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--color_main);
	margin: 0 0 12px;
}

.sl-dashboard-intro__desc {
	font-size: 0.95rem;
	color: var(--sl-gray-600);
	line-height: 1.8;
	max-width: 700px;
	margin: 0 auto;
}

.sl-dashboard-intro__guide {
	background: var(--sl-white);
	border: 1px solid var(--sl-gray-100);
	border-radius: var(--sl-radius-md);
	padding: 24px 28px;
	margin-bottom: 24px;
}

.sl-dashboard-intro__guide h3 {
	font-family: var(--sl-font-heading);
	font-size: 1rem;
	font-weight: 700;
	color: var(--sl-gray-800);
	margin: 0 0 16px;
}

.sl-dashboard-intro__guide ol {
	margin: 0;
	padding-left: 20px;
}

.sl-dashboard-intro__guide li {
	font-size: 0.9rem;
	color: var(--sl-gray-600);
	line-height: 1.7;
	margin-bottom: 8px;
}

.sl-dashboard-intro__guide li strong {
	color: var(--color_main);
}

.sl-dashboard-intro__tips {
	background: var(--sl-accent-pale);
	border-radius: var(--sl-radius-md);
	padding: 24px 28px;
}

.sl-dashboard-intro__tips h3 {
	font-family: var(--sl-font-heading);
	font-size: 1rem;
	font-weight: 700;
	color: var(--color_main);
	margin: 0 0 16px;
}

.sl-dashboard-intro__tip-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}

.sl-dashboard-intro__tip {
	display: flex;
	gap: 12px;
	align-items: flex-start;
}

.sl-dashboard-intro__tip-icon {
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	background: var(--sl-white);
	border-radius: var(--sl-radius-sm);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color_main);
}

.sl-dashboard-intro__tip-icon svg {
	width: 18px;
	height: 18px;
}

.sl-dashboard-intro__tip strong {
	display: block;
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--sl-gray-800);
	margin-bottom: 4px;
}

.sl-dashboard-intro__tip p {
	font-size: 0.8rem;
	color: var(--sl-gray-600);
	line-height: 1.6;
	margin: 0;
}


/* ==========================================================================
   33. ダッシュボード レスポンシブ
   ========================================================================== */

@media (max-width: 959px) {
	.sl-dashboard-intro__tip-grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.sl-gov-dashboard__footer {
		flex-direction: column;
		text-align: center;
	}
}

@media (max-width: 599px) {
	.sl-gov-dashboard__tabs {
		flex-direction: column;
	}

	.sl-gov-dashboard__tab {
		text-align: center;
	}

	.sl-gov-dashboard__frame iframe {
		height: 500px !important;
	}

	.sl-dashboard-intro__guide,
	.sl-dashboard-intro__tips {
		padding: 20px;
	}
}


/* ==========================================================================
   34. トップページ ダッシュボードバナー
   ========================================================================== */

.sl-top-dashboard-banner {
	margin: 40px 0;
}

.sl-top-dashboard-banner__inner {
	display: flex;
	align-items: center;
	gap: 24px;
	background: linear-gradient(135deg, var(--sl-accent-pale) 0%, var(--sl-white) 100%);
	border: 1px solid var(--sl-accent);
	border-radius: var(--sl-radius-lg);
	padding: 28px 32px;
}

.sl-top-dashboard-banner__icon {
	flex-shrink: 0;
	width: 72px;
	height: 72px;
	background: var(--color_main);
	border-radius: var(--sl-radius-md);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--sl-white);
}

.sl-top-dashboard-banner__icon svg {
	width: 36px;
	height: 36px;
}

.sl-top-dashboard-banner__content {
	flex: 1;
}

.sl-top-dashboard-banner__title {
	font-family: var(--sl-font-heading);
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--color_main);
	margin: 0 0 8px;
}

.sl-top-dashboard-banner__desc {
	font-size: 0.9rem;
	color: var(--sl-gray-600);
	line-height: 1.7;
	margin: 0;
}

.sl-top-dashboard-banner__btn {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: var(--color_main);
	color: var(--sl-white);
	font-size: 0.9rem;
	font-weight: 600;
	padding: 14px 24px;
	border-radius: var(--sl-radius-sm);
	text-decoration: none;
	transition: var(--sl-transition);
}

.sl-top-dashboard-banner__btn:hover {
	background: var(--sl-cta);
	transform: translateY(-2px);
	box-shadow: var(--sl-shadow-btn-hover);
}

.sl-top-dashboard-banner__btn svg {
	width: 18px;
	height: 18px;
}

@media (max-width: 768px) {
	.sl-top-dashboard-banner__inner {
		flex-direction: column;
		text-align: center;
		padding: 24px;
	}

	.sl-top-dashboard-banner__icon {
		width: 60px;
		height: 60px;
	}

	.sl-top-dashboard-banner__btn {
		width: 100%;
		justify-content: center;
	}
}


/* ==========================================================================
   35. 新フロントページ — ヒーロー + 検索セクション
   ========================================================================== */

.sl-hero-search {
	position: relative;
	background: var(--color_main);
	padding: 80px 0 64px;
	overflow: hidden;
}

.sl-hero-search__bg {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background:
		radial-gradient(circle at 20% 80%, rgba(162, 210, 255, 0.15) 0%, transparent 50%),
		radial-gradient(circle at 80% 20%, rgba(162, 210, 255, 0.1) 0%, transparent 40%),
		linear-gradient(135deg, var(--color_main) 0%, var(--sl-cta) 100%);
	z-index: 0;
}

.sl-hero-search__inner {
	position: relative;
	z-index: 1;
	max-width: 900px;
	margin: 0 auto;
	padding: 0 24px;
	text-align: center;
}

.sl-hero-search__title {
	font-family: var(--sl-font-heading);
	font-size: clamp(1.75rem, 4vw, 2.8rem);
	font-weight: 700;
	color: var(--sl-white);
	line-height: 1.4;
	letter-spacing: 0.02em;
	margin: 0 0 16px;
}

.sl-hero-search__desc {
	font-size: clamp(0.95rem, 1.5vw, 1.1rem);
	color: rgba(255, 255, 255, 0.85);
	margin: 0 0 40px;
}

.u-pc {
	display: inline;
}

/* 検索ボックス */
.sl-hero-search__box {
	max-width: 680px;
	margin: 0 auto;
}

.sl-hero-search__box-inner {
	display: flex;
	align-items: center;
	gap: 20px;
	background: var(--sl-white);
	border-radius: var(--sl-radius-lg);
	padding: 20px 24px;
	box-shadow: 0 8px 40px rgba(0, 0, 0, 0.15);
	transition: var(--sl-transition);
}

.sl-hero-search__box-inner:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 50px rgba(0, 0, 0, 0.2);
}

.sl-hero-search__box-icon {
	flex-shrink: 0;
	width: 52px;
	height: 52px;
	background: var(--sl-accent-pale);
	border-radius: var(--sl-radius-md);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color_main);
}

.sl-hero-search__box-content {
	flex: 1;
	text-align: left;
}

.sl-hero-search__box-label {
	display: block;
	font-family: var(--sl-font-heading);
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--sl-gray-800);
	margin-bottom: 2px;
}

.sl-hero-search__box-sub {
	display: block;
	font-size: 0.82rem;
	color: var(--sl-gray-500);
}

.sl-hero-search__box-btn {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: var(--color_main);
	color: var(--sl-white);
	font-size: 0.9rem;
	font-weight: 600;
	padding: 14px 24px;
	border-radius: var(--sl-radius-sm);
	text-decoration: none;
	transition: var(--sl-transition);
}

.sl-hero-search__box-btn:hover {
	background: var(--sl-cta);
	transform: translateY(-1px);
}


/* ==========================================================================
   36. 新フロントページ — 2カラムレイアウト
   ========================================================================== */

.sl-front-container {
	max-width: 1280px;
	margin: 0 auto;
	padding: 48px 24px 80px;
}

.sl-front-layout {
	display: grid;
	grid-template-columns: 1fr 320px;
	gap: 48px;
	align-items: start;
}

/* メインエリア */
.sl-front-main {
	min-width: 0;
}

/* サイドバー */
.sl-front-sidebar {
	min-width: 0;
	align-self: start; /* 重要: スティッキーを機能させるため */
}

.sl-front-sidebar__sticky {
	position: -webkit-sticky !important;
	position: sticky !important;
	top: 80px !important; /* ヘッダー高さ + 余白 */
	display: flex;
	flex-direction: column;
	gap: 20px;
}

/* サイドバー内のウィジェットが多い場合のスクロール */
@supports (max-height: 1px) {
	.sl-front-sidebar__sticky {
		max-height: calc(100vh - 100px);
		overflow-y: auto;
		scrollbar-width: thin;
		scrollbar-color: var(--sl-gray-300) transparent;
	}
}

.sl-front-sidebar__sticky::-webkit-scrollbar {
	width: 4px;
}

.sl-front-sidebar__sticky::-webkit-scrollbar-track {
	background: transparent;
}

.sl-front-sidebar__sticky::-webkit-scrollbar-thumb {
	background: var(--sl-gray-300);
	border-radius: 2px;
}


/* ==========================================================================
   37. 新フロントページ — セクション共通
   ========================================================================== */

.sl-front-section {
	margin-bottom: 56px;
}

.sl-front-section:last-child {
	margin-bottom: 0;
}

.sl-front-section__header {
	margin-bottom: 28px;
}

.sl-front-section__label {
	font-family: var(--sl-font-en);
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--sl-accent-mid);
	display: block;
	margin-bottom: 4px;
}

.sl-front-section__title {
	font-family: var(--sl-font-heading);
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--color_main);
	line-height: 1.4;
	margin: 0 0 6px;
}

.sl-front-section__desc {
	font-size: 0.88rem;
	color: var(--sl-gray-500);
	margin: 0;
}

.sl-front-section__more {
	margin-top: 24px;
	text-align: right;
}

.sl-front-section__more a {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 0.88rem;
	font-weight: 600;
	color: var(--color_main);
	text-decoration: none;
	transition: var(--sl-transition-fast);
}

.sl-front-section__more a:hover {
	color: var(--sl-cta);
}

.sl-front-section__more a::after {
	content: "→";
}

/* Empty State */
.sl-empty-state {
	text-align: center;
	padding: 48px 24px;
	background: var(--sl-gray-50);
	border-radius: var(--sl-radius-md);
	border: 1px dashed var(--sl-gray-300);
	color: var(--sl-gray-500);
	font-size: 0.9rem;
}


/* ==========================================================================
   38. 新フロントページ — ニュースカード
   ========================================================================== */

.sl-news-cards {
	display: grid;
	gap: 12px;
}

.sl-news-card {
	display: block;
	background: var(--sl-white);
	border: 1px solid var(--sl-gray-100);
	border-radius: var(--sl-radius-md);
	padding: 18px 20px;
	text-decoration: none;
	transition: var(--sl-transition);
}

.sl-news-card:hover {
	border-color: var(--sl-accent);
	box-shadow: var(--sl-shadow-sm);
	transform: translateX(4px);
}

.sl-news-card__meta {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 8px;
}

.sl-news-card__date {
	font-family: var(--sl-font-en);
	font-size: 0.78rem;
	color: var(--sl-gray-400);
}

.sl-news-card__source {
	font-size: 0.68rem;
	font-weight: 600;
	color: var(--sl-accent-mid);
	background: var(--sl-accent-pale);
	padding: 2px 8px;
	border-radius: 3px;
}

.sl-news-card__title {
	font-family: var(--sl-font-heading);
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--sl-gray-800);
	line-height: 1.55;
	margin: 0;
}

/* DXニュースカード */
.sl-news-card--dx {
	border-left: 3px solid var(--sl-accent);
	background: linear-gradient(to right, rgba(162, 210, 255, 0.08), transparent);
}

.sl-news-card--dx:hover {
	border-color: var(--sl-accent-mid);
	background: linear-gradient(to right, rgba(162, 210, 255, 0.15), transparent);
}

.sl-news-card__source--dx {
	background: rgba(162, 210, 255, 0.2);
	color: var(--sl-primary);
}

.sl-news-card__badge-dx {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	color: var(--sl-white);
	background: var(--sl-primary);
	padding: 2px 8px;
	border-radius: 3px;
	margin-left: auto;
}


/* ==========================================================================
   39. 新フロントページ — DXカード（フューチャー感）
   ========================================================================== */

.sl-dx-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
}

.sl-dx-card {
	display: block;
	background: var(--sl-white);
	border-radius: var(--sl-radius-lg);
	overflow: hidden;
	border: 1px solid var(--sl-gray-100);
	text-decoration: none;
	transition: var(--sl-transition);
	position: relative;
}

.sl-dx-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: var(--sl-accent);
	opacity: 0;
	transition: var(--sl-transition);
}

.sl-dx-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 40px rgba(27, 73, 101, 0.12);
	border-color: rgba(27, 73, 101, 0.3);
}

.sl-dx-card:hover::before {
	opacity: 1;
}

.sl-dx-card__visual {
	position: relative;
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.sl-dx-card__visual img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.sl-dx-card:hover .sl-dx-card__visual img {
	transform: scale(1.05);
}

.sl-dx-card__placeholder {
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	color: rgba(0, 212, 255, 0.5);
}

.sl-dx-card__overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.4) 0%, transparent 50%);
	pointer-events: none;
}

.sl-dx-card__badge {
	position: absolute;
	top: 12px;
	right: 12px;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	background: var(--sl-primary);
	color: var(--sl-white);
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	padding: 5px 10px;
	border-radius: 4px;
	box-shadow: 0 2px 8px rgba(27, 73, 101, 0.4);
}

.sl-dx-card__body {
	padding: 18px 20px 20px;
}

.sl-dx-card__cat {
	display: inline-block;
	font-size: 0.68rem;
	font-weight: 600;
	color: var(--sl-gray-500);
	margin-bottom: 6px;
}

.sl-dx-card__title {
	font-family: var(--sl-font-heading);
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--sl-gray-800);
	line-height: 1.5;
	margin: 0 0 10px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.sl-dx-card__date {
	font-family: var(--sl-font-en);
	font-size: 0.75rem;
	color: var(--sl-gray-400);
}


/* ==========================================================================
   40. 新フロントページ — コラムリスト
   ========================================================================== */

.sl-column-list {
	display: grid;
	gap: 16px;
}

.sl-column-item {
	display: flex;
	gap: 16px;
	background: var(--sl-white);
	border: 1px solid var(--sl-gray-100);
	border-radius: var(--sl-radius-md);
	padding: 16px;
	text-decoration: none;
	transition: var(--sl-transition);
}

.sl-column-item:hover {
	border-color: var(--sl-accent);
	box-shadow: var(--sl-shadow-sm);
}

.sl-column-item__thumb {
	flex-shrink: 0;
	width: 100px;
	height: 72px;
	border-radius: var(--sl-radius-sm);
	overflow: hidden;
}

.sl-column-item__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.sl-column-item:hover .sl-column-item__thumb img {
	transform: scale(1.05);
}

.sl-column-item__thumb-placeholder {
	width: 100%;
	height: 100%;
	background: var(--sl-gray-100);
}

.sl-column-item__body {
	flex: 1;
	min-width: 0;
}

.sl-column-item__cat {
	display: inline-block;
	font-size: 0.68rem;
	font-weight: 600;
	color: var(--color_main);
	background: var(--color_main_thin);
	padding: 2px 8px;
	border-radius: 3px;
	margin-bottom: 6px;
}

.sl-column-item__title {
	font-family: var(--sl-font-heading);
	font-size: 0.92rem;
	font-weight: 600;
	color: var(--sl-gray-800);
	line-height: 1.5;
	margin: 0 0 6px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.sl-column-item__date {
	font-family: var(--sl-font-en);
	font-size: 0.75rem;
	color: var(--sl-gray-400);
}


/* ==========================================================================
   41. 新フロントページ — 資料リンク集ボタン
   ========================================================================== */

.sl-resources-buttons {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 16px;
}

.sl-resource-btn {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 18px 20px;
	background: var(--sl-white);
	border: 1px solid var(--sl-gray-100);
	border-radius: var(--sl-radius-md);
	text-decoration: none;
	transition: var(--sl-transition);
	text-align: left;
}

.sl-resource-btn:hover {
	border-color: transparent;
	background: var(--sl-gradient-subtle);
	transform: translateY(-2px);
	box-shadow: var(--sl-shadow-md);
}

.sl-resource-btn__icon {
	flex-shrink: 0;
	width: 36px;
	height: 36px;
	padding: 8px;
	background: var(--sl-gradient-subtle);
	border-radius: var(--sl-radius-sm);
	color: var(--sl-primary);
}

.sl-resource-btn:hover .sl-resource-btn__icon {
	background: var(--sl-gradient-main);
	color: var(--sl-white);
}

.sl-resource-btn__text {
	flex: 1;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--sl-gray-700);
	line-height: 1.4;
}

.sl-resource-btn:hover .sl-resource-btn__text {
	color: var(--sl-primary);
}

.sl-resource-btn__external {
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	color: var(--sl-gray-400);
	margin-left: auto;
}

.sl-resource-btn:hover .sl-resource-btn__external {
	color: var(--sl-primary);
}


/* ==========================================================================
   42. 新フロントページ — サイドバー統計ウィジェット
   ========================================================================== */

.sl-sidebar-stats {
	background: var(--sl-white);
	border: 1px solid var(--sl-gray-100);
	border-radius: var(--sl-radius-lg);
	padding: 24px;
}

.sl-sidebar-stats__header {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 8px;
}

.sl-sidebar-stats__icon {
	width: 36px;
	height: 36px;
	background: var(--sl-accent-pale);
	border-radius: var(--sl-radius-sm);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color_main);
}

.sl-sidebar-stats__title {
	font-family: var(--sl-font-heading);
	font-size: 1rem;
	font-weight: 700;
	color: var(--color_main);
	margin: 0;
}

.sl-sidebar-stats__desc {
	font-size: 0.8rem;
	color: var(--sl-gray-500);
	margin: 0 0 20px;
}

.sl-sidebar-stats__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	margin-bottom: 20px;
}

.sl-sidebar-stat {
	background: var(--sl-gray-50);
	border-radius: var(--sl-radius-sm);
	padding: 14px 12px;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.sl-sidebar-stat::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 3px;
	background: var(--sl-gray-200);
}

.sl-sidebar-stat[data-status="good"]::before {
	background: #10b981;
}

.sl-sidebar-stat[data-status="warning"]::before {
	background: #f59e0b;
}

.sl-sidebar-stat[data-status="danger"]::before {
	background: #ef4444;
}

.sl-sidebar-stat__value {
	margin-bottom: 4px;
}

.sl-sidebar-stat__number {
	font-family: var(--sl-font-en);
	font-size: 1.4rem;
	font-weight: 700;
	color: var(--color_main);
	line-height: 1;
}

.sl-sidebar-stat__unit {
	font-size: 0.7rem;
	font-weight: 500;
	color: var(--sl-gray-500);
	margin-left: 2px;
}

.sl-sidebar-stat__placeholder {
	font-size: 1.2rem;
	color: var(--sl-gray-300);
}

.sl-sidebar-stat__label {
	font-size: 0.72rem;
	font-weight: 500;
	color: var(--sl-gray-600);
	line-height: 1.3;
}

.sl-sidebar-stats__link {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--color_main);
	text-decoration: none;
	padding: 12px;
	background: var(--color_main_thin);
	border-radius: var(--sl-radius-sm);
	transition: var(--sl-transition-fast);
}

.sl-sidebar-stats__link:hover {
	background: var(--color_main);
	color: var(--sl-white);
}


/* ==========================================================================
   46. サイドバー — コラムカード
   ========================================================================== */

.sl-sidebar-column {
	background: var(--sl-white);
	border: 1px solid var(--sl-gray-100);
	border-radius: var(--sl-radius-lg);
	padding: 20px;
}

.sl-sidebar-column__header {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--sl-gray-100);
}

.sl-sidebar-column__icon {
	width: 32px;
	height: 32px;
	background: var(--color_main_thin);
	border-radius: var(--sl-radius-sm);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color_main);
}

.sl-sidebar-column__title {
	font-family: var(--sl-font-heading);
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--color_main);
	margin: 0;
}

.sl-sidebar-column__list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.sl-sidebar-column__card {
	display: flex;
	gap: 12px;
	padding: 10px;
	background: var(--sl-gray-50);
	border-radius: var(--sl-radius-sm);
	text-decoration: none;
	transition: var(--sl-transition);
}

.sl-sidebar-column__card:hover {
	background: var(--sl-accent-pale);
	transform: translateX(3px);
}

.sl-sidebar-column__thumb {
	flex-shrink: 0;
	width: 64px;
	height: 48px;
	border-radius: 4px;
	overflow: hidden;
}

.sl-sidebar-column__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sl-sidebar-column__thumb-placeholder {
	width: 100%;
	height: 100%;
	background: var(--sl-gray-200);
}

.sl-sidebar-column__body {
	flex: 1;
	min-width: 0;
}

.sl-sidebar-column__card-title {
	font-family: var(--sl-font-heading);
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--sl-gray-800);
	line-height: 1.45;
	margin: 0 0 4px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.sl-sidebar-column__date {
	font-family: var(--sl-font-en);
	font-size: 0.7rem;
	color: var(--sl-gray-400);
}

.sl-sidebar-column__empty {
	font-size: 0.85rem;
	color: var(--sl-gray-500);
	text-align: center;
	padding: 20px 0;
	margin: 0;
}

.sl-sidebar-column__more {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--color_main);
	text-decoration: none;
	padding: 12px;
	margin-top: 12px;
	background: var(--color_main_thin);
	border-radius: var(--sl-radius-sm);
	transition: var(--sl-transition-fast);
}

.sl-sidebar-column__more:hover {
	background: var(--color_main);
	color: var(--sl-white);
}


/* ==========================================================================
   47. ヘッダーカスタマイズ（グラデーション適用）
   ========================================================================== */

/* ヘッダーアクセントライン */
.l-header::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: var(--sl-gradient-main);
	z-index: 100;
}

/* ロゴ説明文 */
.c-headLogo {
	display: flex;
	align-items: center;
	gap: 16px;
}

.c-headLogo a,
.c-headLogo .c-headLogo__link,
.c-headLogo .c-headLogo__txt {
	white-space: nowrap;
}

.sl-logo-tagline {
	font-size: 0.72rem;
	font-weight: 500;
	color: var(--sl-primary);
	white-space: nowrap;
	padding-left: 16px;
	border-left: 1px solid var(--sl-gray-200);
	line-height: 1.4;
}

/* ナビゲーション項目 */
.sl-nav-item a {
	position: relative;
}

.sl-nav-item a::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 0;
	height: 2px;
	background: var(--sl-gradient-main);
	transition: var(--sl-transition);
	transform: translateX(-50%);
}

.sl-nav-item a:hover::after {
	width: 60%;
}

@media (max-width: 959px) {
	.sl-logo-tagline {
		display: none;
	}
}


/* ==========================================================================
   48. 旧ヒーローセクション（削除済み - 参照用に残す）
   ========================================================================== */

/* .sl-hero-minimal は削除されました */


/* ==========================================================================
   49. 地域チェック枠（グラデーション適用・トップ配置）
   ========================================================================== */

.sl-region-check {
	background: var(--sl-primary);
	padding: 0;
}

.sl-region-check__inner {
	display: flex;
	align-items: center;
	gap: 28px;
	max-width: 1280px;
	margin: 0 auto;
	padding: 32px 32px;
	position: relative;
}

.sl-region-check__icon {
	flex-shrink: 0;
	width: 72px;
	height: 72px;
	background: rgba(255, 255, 255, 0.15);
	border-radius: var(--sl-radius-lg);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--sl-white);
	backdrop-filter: blur(10px);
}

.sl-region-check__content {
	flex: 1;
}

.sl-region-check__title {
	font-family: var(--sl-font-heading);
	font-size: 1.35rem;
	font-weight: 700;
	color: var(--sl-white);
	margin: 0 0 8px;
}

.sl-region-check__desc {
	font-size: 0.9rem;
	color: rgba(255, 255, 255, 0.85);
	margin: 0;
	line-height: 1.7;
}

.sl-region-check__btn {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--sl-white);
	color: var(--sl-primary);
	font-size: 0.95rem;
	font-weight: 700;
	padding: 16px 32px;
	border-radius: var(--sl-radius-sm);
	text-decoration: none;
	transition: var(--sl-transition);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

.sl-region-check__btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2);
}

@media (max-width: 768px) {
	.sl-region-check__inner {
		flex-direction: column;
		text-align: center;
		padding: 28px 20px;
		gap: 20px;
	}

	.sl-region-check__icon {
		width: 56px;
		height: 56px;
	}

	.sl-region-check__title {
		font-size: 1.15rem;
	}

	.sl-region-check__btn {
		width: 100%;
		justify-content: center;
		padding: 14px 24px;
	}
}


/* ==========================================================================
   50. グラデーション統一 — セクション見出し
   ========================================================================== */

.sl-front-section__label {
	background: var(--sl-gradient-main);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.sl-front-section__title::after {
	background: var(--sl-gradient-main);
}


/* ==========================================================================
   51. グラデーション統一 — ボタン
   ========================================================================== */

.sl-front-section__more a {
	border: 2px solid var(--sl-primary);
	background: var(--sl-white);
	color: var(--sl-primary);
}

.sl-front-section__more a:hover {
	background: var(--sl-primary);
	color: var(--sl-white);
	border-color: transparent;
}

.sl-sidebar-stats__link {
	background: rgba(27, 73, 101, 0.06);
	border: 1px solid rgba(27, 73, 101, 0.15);
}

.sl-sidebar-stats__link:hover {
	background: var(--sl-primary);
	color: var(--sl-white);
	border-color: transparent;
}

.sl-sidebar-column__more {
	background: rgba(27, 73, 101, 0.06);
	border: 1px solid rgba(27, 73, 101, 0.15);
}

.sl-sidebar-column__more:hover {
	background: var(--sl-primary);
	color: var(--sl-white);
	border-color: transparent;
}

.sl-sidebar-cta {
	background: var(--sl-primary);
}

.sl-cta-section {
	background: var(--sl-primary);
}

.sl-cta-section__btn {
	background: var(--sl-white);
	color: var(--sl-primary);
}

.sl-cta-section__btn:hover {
	box-shadow: 0 6px 25px rgba(0, 0, 0, 0.2);
}


/* ==========================================================================
   52. グラデーション統一 — サイドバーウィジェット
   ========================================================================== */

.sl-sidebar-stats__header .sl-sidebar-stats__icon {
	background: var(--sl-gradient-main);
	color: var(--sl-white);
}

.sl-sidebar-stats__title {
	background: var(--sl-gradient-main);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.sl-sidebar-column__header .sl-sidebar-column__icon {
	background: var(--sl-gradient-subtle);
	color: var(--sl-primary);
}

.sl-sidebar-column__title {
	background: var(--sl-gradient-main);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}


/* ==========================================================================
   53. グラデーション統一 — 統計ステータスバー
   ========================================================================== */

.sl-sidebar-stat::before {
	background: var(--sl-gradient-main);
}


/* ==========================================================================
   54. 旧ヒーローセクションの非表示/上書き
   ========================================================================== */

.sl-hero-search {
	display: none;
}


/* ==========================================================================
   55. サイドバースティッキー強化
   ========================================================================== */

/* PCでのスティッキー追従を確実に */
@media (min-width: 769px) {
	.sl-front-sidebar {
		position: relative;
		height: 100%;
	}

	.sl-front-sidebar > .sl-front-sidebar__sticky,
	aside.sl-front-sidebar .sl-front-sidebar__sticky {
		position: -webkit-sticky !important;
		position: sticky !important;
		top: 80px !important;
		z-index: 10;
	}

	/* グリッドレイアウトでのスティッキー対応 */
	.sl-front-layout {
		align-items: start !important;
	}
}


/* ==========================================================================
   43. 新フロントページ — サイドバーCTA
   ========================================================================== */

.sl-sidebar-cta {
	background: var(--sl-gradient-main);
	border-radius: var(--sl-radius-lg);
	padding: 28px 24px;
	text-align: center;
	color: var(--sl-white);
}

.sl-sidebar-cta__icon {
	width: 48px;
	height: 48px;
	background: rgba(255, 255, 255, 0.15);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 16px;
}

.sl-sidebar-cta__text {
	font-size: 0.95rem;
	font-weight: 500;
	line-height: 1.6;
	margin: 0 0 16px;
	color: rgba(255, 255, 255, 0.9);
}

.sl-sidebar-cta__btn {
	display: block;
	background: var(--sl-white);
	color: var(--color_main);
	font-size: 0.88rem;
	font-weight: 600;
	padding: 12px 20px;
	border-radius: var(--sl-radius-sm);
	text-decoration: none;
	transition: var(--sl-transition);
}

.sl-sidebar-cta__btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}


/* ==========================================================================
   44. 新フロントページ — レスポンシブ
   ========================================================================== */

@media (max-width: 1024px) {
	.sl-front-layout {
		grid-template-columns: 1fr 280px;
		gap: 36px;
	}

	.sl-dx-grid {
		grid-template-columns: 1fr;
	}

	.sl-resources-buttons {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 768px) {
	.u-pc {
		display: none;
	}

	.sl-hero-search {
		padding: 56px 0 48px;
	}

	.sl-hero-search__box-inner {
		flex-direction: column;
		text-align: center;
		gap: 16px;
		padding: 24px 20px;
	}

	.sl-hero-search__box-content {
		text-align: center;
	}

	.sl-hero-search__box-btn {
		width: 100%;
		justify-content: center;
	}

	.sl-front-container {
		padding: 32px 16px 56px;
	}

	.sl-front-layout {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.sl-front-sidebar__sticky {
		position: static;
	}

	.sl-front-section {
		margin-bottom: 40px;
	}

	.sl-column-item {
		flex-direction: column;
		gap: 12px;
	}

	.sl-column-item__thumb {
		width: 100%;
		height: 160px;
	}

	.sl-resources-buttons {
		grid-template-columns: 1fr;
	}

	.sl-sidebar-stats__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 480px) {
	.sl-hero-search {
		padding: 40px 0;
	}

	.sl-front-section__title {
		font-size: 1.3rem;
	}

	.sl-news-card {
		padding: 14px 16px;
	}

	.sl-sidebar-stat__number {
		font-size: 1.2rem;
	}
}


/* ==========================================================================
   45. フロントページ — サイドバーウィジェット
   ========================================================================== */

.sl-sidebar-widgets {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.sl-sidebar-widgets .widget {
	background: var(--sl-white);
	border: 1px solid var(--sl-gray-100);
	border-radius: var(--sl-radius-lg);
	padding: 20px;
}

.sl-sidebar-widgets .widget-title,
.sl-sidebar-widgets .c-widget__title {
	font-family: var(--sl-font-heading);
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--color_main);
	margin: 0 0 16px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--sl-gray-100);
}

.sl-sidebar-widgets .widget ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.sl-sidebar-widgets .widget li {
	padding: 10px 0;
	border-bottom: 1px solid var(--sl-gray-50);
	font-size: 0.88rem;
	line-height: 1.5;
}

.sl-sidebar-widgets .widget li:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.sl-sidebar-widgets .widget li a {
	color: var(--sl-gray-700);
	text-decoration: none;
	transition: var(--sl-transition-fast);
}

.sl-sidebar-widgets .widget li a:hover {
	color: var(--color_main);
}

/* 最近の投稿ウィジェット */
.sl-sidebar-widgets .widget_recent_entries li {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.sl-sidebar-widgets .widget_recent_entries .post-date {
	font-family: var(--sl-font-en);
	font-size: 0.75rem;
	color: var(--sl-gray-400);
}

/* カテゴリウィジェット */
.sl-sidebar-widgets .widget_categories li a {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.sl-sidebar-widgets .widget_categories li a::after {
	content: attr(data-count);
	font-size: 0.75rem;
	color: var(--sl-gray-400);
}

/* SWELLの投稿リストウィジェット */
.sl-sidebar-widgets .p-postList {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.sl-sidebar-widgets .p-postList__item {
	border: none;
	box-shadow: none;
	background: transparent;
	padding: 0;
}

.sl-sidebar-widgets .p-postList__item:hover {
	transform: none;
	box-shadow: none;
}

.sl-sidebar-widgets .p-postList__thumb {
	border-radius: var(--sl-radius-sm);
	overflow: hidden;
}

.sl-sidebar-widgets .p-postList__title {
	font-size: 0.85rem;
	line-height: 1.5;
}