/* =============================================================
   Site chrome
   サイト全体（ヘッダー・メニュー・フッター・背景）をトップページと同じ世界観にそろえる。
   設定「サイト全体のデザイン」が有効なとき、body（SWELL は #body_wrap）に .ec-site が付く。
   SWELL 以外のテーマでは該当クラスが無いため、背景以外は効かない。
   ============================================================= */
:root {
	--ec-ink:     #1e2443;
	--ec-ink-2:   #3a4064;
	--ec-mute:    #646a85;
	--ec-cream:   #fff8ec;
	--ec-line:    #ece4d6;
	--ec-sun:     #ffc53d;
	--ec-coral:   #ff6748;
	--ec-sea:     #1c8ad1;
	--ec-sea-dk:  #0f6fae;
	--ec-leaf:    #1f9e6c;
	--ec-ease:    cubic-bezier(.22, 1, .36, 1);
	--ec-font-display: "Zen Maru Gothic", "Hiragino Maru Gothic ProN", "Hiragino Sans", "BIZ UDPGothic", "Yu Gothic UI", "Yu Gothic", Meiryo, sans-serif;
}

/* SWELL のカラー設定をサイトのパレットへ寄せる（見出し・リスト・ボタンなど全体に効く） */
#body_wrap.ec-site {
	--color_main: #1e2443;
	--color_main_dark: #141a33;
	--color_main_thin: rgba(28, 138, 209, .07);
	--color_htag: #1e2443;
	--color_link: #0f6fae;
	--color_list_check: #1c8ad1;
	--color_header_bg: rgba(255, 255, 255, .86);
	--color_header_text: #1e2443;
	--color_footer_bg: #1e2443;
	--color_footer_text: #fff;
	--color_gnav_bg: #1e2443;
}

/* ----- 背景：生成り色の地に、空・太陽・夕焼け・緑のにじみとドット柄 ----- */
:is(body, #body_wrap).ec-site {
	position: relative;
	isolation: isolate;
	background-color: #fff8ee;
}

:is(body, #body_wrap).ec-site::before {
	content: "";
	position: fixed;
	inset: -10vmax;
	z-index: -2;
	background:
		radial-gradient(42vmax 32vmax at 10% 8%, rgba(43, 155, 224, .17), transparent 70%),
		radial-gradient(36vmax 28vmax at 94% 12%, rgba(255, 197, 61, .24), transparent 70%),
		radial-gradient(38vmax 30vmax at 86% 90%, rgba(255, 103, 72, .12), transparent 70%),
		radial-gradient(32vmax 28vmax at 8% 86%, rgba(31, 158, 108, .12), transparent 70%);
	pointer-events: none;
	animation: ec-site-aurora 26s ease-in-out infinite alternate;
}

:is(body, #body_wrap).ec-site::after {
	content: "";
	position: fixed;
	inset: 0;
	z-index: -1;
	background: radial-gradient(rgba(30, 36, 67, .07) 1px, transparent 1.6px) 0 0 / 22px 22px;
	-webkit-mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, .35) 60%, transparent 100%);
	mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, .35) 60%, transparent 100%);
	pointer-events: none;
}

@keyframes ec-site-aurora {
	0%   { transform: translate3d(0, 0, 0) scale(1); }
	50%  { transform: translate3d(2vmax, -1.5vmax, 0) scale(1.05); }
	100% { transform: translate3d(-2vmax, 1.5vmax, 0) scale(1.02); }
}

.ec-site #content,
.ec-site .l-content {
	background: transparent;
}

/* ----- 上部のバー：ヒーローと同じ空色のグラデーション ----- */
.ec-site .l-header__bar {
	background: linear-gradient(90deg, #2b9be0, #1677c4 60%, #1e5fae);
	color: #fff;
}

.ec-site .l-header__bar .c-catchphrase,
.ec-site .l-header__bar a {
	color: #fff;
	font-family: var(--ec-font-display);
	letter-spacing: .06em;
}

.ec-site .l-header__bar .c-iconList__link {
	opacity: .9;
	transition: opacity .2s var(--ec-ease), transform .2s var(--ec-ease);
}

.ec-site .l-header__bar .c-iconList__link:hover {
	opacity: 1;
	transform: translateY(-1px);
}

/* ----- ヘッダー：半透明の白＋ぼかしで背景の色をうっすら透かす ----- */
.ec-site .l-header,
.ec-site .l-fixHeader {
	background: rgba(255, 255, 255, .82);
	-webkit-backdrop-filter: saturate(1.4) blur(14px);
	backdrop-filter: saturate(1.4) blur(14px);
	box-shadow: 0 1px 0 rgba(236, 228, 214, .9), 0 8px 24px rgba(28, 92, 160, .06);
}

.ec-site .l-header::before,
.ec-site .l-fixHeader::before {
	display: none;
}

.ec-site .c-headLogo__link {
	color: var(--ec-ink);
	font-family: var(--ec-font-display);
	font-weight: 700;
}

/* グローバルナビ：丸い面のホバーと、表示中ページの太陽色の点 */
.ec-site .c-gnav > .menu-item > a {
	position: relative;
	color: var(--ec-ink);
	font-family: var(--ec-font-display);
	font-weight: 700;
	letter-spacing: .04em;
}

.ec-site .c-gnav > .menu-item > a::after {
	display: none;
}

.ec-site .c-gnav > .menu-item > a .ttl {
	position: relative;
	padding: 7px 14px;
	border-radius: 999px;
	transition: background .25s var(--ec-ease), color .25s var(--ec-ease);
}

.ec-site .c-gnav > .menu-item > a:hover .ttl,
.ec-site .c-gnav > .menu-item.-current > a .ttl,
.ec-site .c-gnav > .current-menu-item > a .ttl {
	background: rgba(28, 138, 209, .1);
	color: var(--ec-sea-dk);
}

.ec-site .c-gnav > .menu-item.-current > a .ttl::after,
.ec-site .c-gnav > .current-menu-item > a .ttl::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -6px;
	width: 6px;
	height: 6px;
	margin-left: -3px;
	border-radius: 50%;
	background: var(--ec-sun);
}

.ec-site .c-gnav .sub-menu {
	overflow: hidden;
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 16px 36px rgba(28, 92, 160, .16);
}

.ec-site .c-gnav .sub-menu a {
	color: var(--ec-ink);
}

.ec-site .c-gnav .sub-menu a:hover {
	background: var(--ec-cream);
}

.ec-site .l-header .c-iconBtn,
.ec-site .l-fixHeader .c-iconBtn {
	color: var(--ec-ink);
}

/* ----- パンくず ----- */
.ec-site .p-breadcrumb {
	background: transparent;
}

.ec-site .p-breadcrumb__text,
.ec-site .p-breadcrumb__item a {
	color: var(--ec-mute);
}

/* ----- SPメニュー（ドロワー） ----- */
.ec-site .p-spMenu__inner {
	background: linear-gradient(180deg, #fff 0%, var(--ec-cream) 100%);
}

.ec-site .p-spMenu__overlay {
	background: rgba(20, 26, 52, .45);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}

.ec-site .c-widget__title.-spmenu {
	position: relative;
	overflow: hidden;
	margin-bottom: 12px;
	padding: 14px 18px;
	border: 0;
	border-radius: 16px;
	background:
		radial-gradient(circle at 100% -40%, var(--ec-sun) 0 38px, rgba(255, 255, 255, .16) 39px 52px, transparent 53px),
		linear-gradient(135deg, #2b9be0, #1677c4);
	color: #fff;
	font-family: var(--ec-font-display);
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: .12em;
}

.ec-site .c-widget__title.-spmenu::before,
.ec-site .c-widget__title.-spmenu::after {
	display: none;
}

.ec-site .c-spnav .menu-item {
	margin: 0 0 6px;
	border: 0;
}

.ec-site .c-spnav .menu-item > a {
	position: relative;
	display: block;
	padding: 13px 40px 13px 16px;
	border: 0;
	border-radius: 14px;
	background: #fff;
	box-shadow: inset 0 0 0 1px var(--ec-line);
	color: var(--ec-ink);
	font-family: var(--ec-font-display);
	font-weight: 700;
	transition: background .2s var(--ec-ease), transform .2s var(--ec-ease);
}

.ec-site .c-spnav .menu-item > a::before {
	display: none;
}

.ec-site .c-spnav .menu-item > a::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 14px;
	width: 22px;
	height: 22px;
	margin-top: -11px;
	border-radius: 50%;
	background: var(--ec-cream) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231e2443' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") center / 11px no-repeat;
}

.ec-site .c-spnav .menu-item > a:active {
	transform: scale(.98);
	background: var(--ec-cream);
}

.ec-site .p-spMenu__closeBtn .c-iconBtn {
	color: var(--ec-ink);
}

/* ----- SP下部の固定メニュー ----- */
.ec-site #fix_bottom_menu {
	box-shadow: 0 -6px 24px rgba(28, 92, 160, .12);
}

.ec-site #fix_bottom_menu::before {
	background: rgba(255, 255, 255, .9);
	-webkit-backdrop-filter: saturate(1.4) blur(14px);
	backdrop-filter: saturate(1.4) blur(14px);
	opacity: 1;
}

.ec-site #fix_bottom_menu .menu-item a,
.ec-site #fix_bottom_menu .menu-item span {
	color: var(--ec-ink);
	font-family: var(--ec-font-display);
	font-weight: 700;
}

.ec-site #fix_bottom_menu .menu-item i,
.ec-site #fix_bottom_menu .menu-item [class*="icon-"] {
	color: var(--ec-sea);
}

/* ----- ページ上部へ戻るボタン ----- */
.ec-site .c-fixBtn {
	border: 0;
	background: linear-gradient(135deg, #ffd45c, var(--ec-sun) 60%, #ffb400);
	color: var(--ec-ink);
	box-shadow: 0 10px 22px rgba(255, 170, 0, .3);
	transition: transform .25s var(--ec-ease), box-shadow .25s var(--ec-ease);
}

.ec-site .c-fixBtn:hover {
	transform: translateY(-3px);
	box-shadow: 0 14px 28px rgba(255, 170, 0, .38);
}

/* ----- フッター：紺地に波の縁取り ----- */
.ec-site .l-footer {
	position: relative;
	margin-top: 48px;
	background:
		radial-gradient(40vmax 18vmax at 90% 120%, rgba(28, 138, 209, .35), transparent 70%),
		radial-gradient(30vmax 14vmax at 5% 0%, rgba(255, 197, 61, .12), transparent 70%),
		linear-gradient(180deg, #232a4f, #1a1f3c);
	color: #fff;
}

.ec-site .l-footer::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 100%;
	height: 26px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 26' preserveAspectRatio='none'%3E%3Cpath d='M0 14c20 0 20-10 40-10s20 10 40 10 20-10 40-10 20 10 40 10 20-10 40-10 20 10 40 10v12H0z' fill='%23232a4f'/%3E%3C/svg%3E") repeat-x 0 100% / 240px 26px;
	pointer-events: none;
}

.ec-site .l-footer a,
.ec-site .l-footer .copyright {
	color: rgba(255, 255, 255, .86);
}

.ec-site .l-footer__nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
}

.ec-site .l-footer__nav li {
	border: 0;
}

.ec-site .l-footer__nav li::before,
.ec-site .l-footer__nav li::after {
	display: none;
}

.ec-site .l-footer__nav a {
	display: inline-block;
	padding: 7px 16px;
	border: 0;
	border-radius: 999px;
	background: rgba(255, 255, 255, .08);
	font-family: var(--ec-font-display);
	font-weight: 700;
	transition: background .2s var(--ec-ease), color .2s var(--ec-ease);
}

.ec-site .l-footer__nav a:hover {
	background: var(--ec-sun);
	color: var(--ec-ink);
}

.ec-site .l-footer .copyright {
	font-size: .76rem;
	letter-spacing: .06em;
}

.ec-site .ec-footer-meta,
.ec-site .ec-footer-meta a {
	color: var(--ec-mute);
}

/* ----- サイドバー・アーカイブ一覧などテーマ側の白い面 ----- */
.ec-site .l-sidebar .c-widget {
	padding: 16px;
	border-radius: 18px;
	background: #fff;
	box-shadow: inset 0 0 0 1px rgba(236, 228, 214, .9), 0 8px 24px rgba(28, 92, 160, .06);
}

.ec-site .c-widget__title.-side {
	color: var(--ec-ink);
	font-family: var(--ec-font-display);
	font-weight: 700;
}

.ec-site .p-postList__item .p-postList__thumb,
.ec-site .p-postList__item .c-postThumb__figure {
	overflow: hidden;
	border-radius: 14px;
}

.ec-site .c-pageTitle__inner,
.ec-site .c-pageTitle {
	color: var(--ec-ink);
	font-family: var(--ec-font-display);
}

@media (prefers-reduced-motion: reduce) {
	:is(body, #body_wrap).ec-site::before {
		animation: none;
	}
}

.ec-site .l-footer__nav,
.ec-site .l-footer__nav li,
.ec-site .l-footer__nav li:first-child,
.ec-site .l-footer__nav a,
.ec-site .l-footer__nav li:first-child a {
	border: 0 !important;
}

.ec-site .c-widget__title.-spmenu {
	margin-bottom: 14px;
}
