/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: May 04 2026 | 12:19:17 */
/* ==========================================================================
   Snow Monkey UI component overrides
   ========================================================================== */

/* is-style-snow-monkey-143795: text + circular arrow icon
   (Snow Monkey provides ::before/::after structure; we just override variables) */
:root :where(.wp-block-button.is-style-snow-monkey-143795),
:root :where(.smb-btn-wrapper.is-style-snow-monkey-143795) {
	--circle-size: 38px;
	--circle-color: #E5EEF6;
	--icon-color: #02498B;
	--inline-svg: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27currentColor%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cline%20x1%3D%275%27%20y1%3D%2712%27%20x2%3D%2719%27%20y2%3D%2712%27%2F%3E%3Cpolyline%20points%3D%2712%205%2019%2012%2012%2019%27%2F%3E%3C%2Fsvg%3E");
}

/* WordPress standard button block: fixed gradient (navy → bright blue) + inline arrow.
   Text color is NOT set here — the editor's chosen text color is preserved.
   Arrow color follows currentColor via mask-image, so the arrow always matches text. */
.wp-block-button .wp-block-button__link {
	display: inline-block !important;
	position: relative !important;
	text-align: center !important;
	padding-right: 3em !important;
	background: linear-gradient(90deg, #02498B 0%, #1B77E7 100%) !important;
	background-color: transparent !important;
	text-decoration: none !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	letter-spacing: 0.18em !important;
	border: 0 !important;
	border-radius: 0 !important;
	transition: filter 0.2s ease, transform 0.2s ease !important;
}

/* btn-bg-gray: light-grey variant of the gradient */
.wp-block-button.btn-bg-gray .wp-block-button__link,
.wp-block-button__link.btn-bg-gray {
	background: linear-gradient(90deg, #D8D8D8 0%, #F3F4F6 100%) !important;
}

.wp-block-button .wp-block-button__link::after {
	content: "" !important;
	position: absolute !important;
	right: 1em !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	display: inline-block !important;
	flex-shrink: 0 !important;
	width: 18px !important;
	height: 18px !important;
	background-color: currentColor !important;
	background-image: none !important;
	-webkit-mask-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cline%20x1%3D%275%27%20y1%3D%2712%27%20x2%3D%2719%27%20y2%3D%2712%27%2F%3E%3Cpolyline%20points%3D%2712%205%2019%2012%2012%2019%27%2F%3E%3C%2Fsvg%3E") !important;
	mask-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cline%20x1%3D%275%27%20y1%3D%2712%27%20x2%3D%2719%27%20y2%3D%2712%27%2F%3E%3Cpolyline%20points%3D%2712%205%2019%2012%2012%2019%27%2F%3E%3C%2Fsvg%3E") !important;
	-webkit-mask-repeat: no-repeat !important;
	mask-repeat: no-repeat !important;
	-webkit-mask-position: center !important;
	mask-position: center !important;
	-webkit-mask-size: contain !important;
	mask-size: contain !important;
}

.wp-block-button .wp-block-button__link:hover {
	transform: translate3d(0, -2px, 0) !important;
}

/* sme-badge: square corners + remove the default -2px upward shift */
.sme-badge {
	border-radius: 0;
	transform: none;
}

/* Prefix horizontal line before text
   Usage: <p class="has-prefix-line">テキスト</p>
   <br> や複数行のテキストにも対応 */
.has-prefix-line {
	position: relative;
	padding-left: 30px;
}

.has-prefix-line::before {
	content: "";
	position: absolute;
	left: 0;
	top: 1em;
	width: 20px;
	height: 2px;
	background-color: #02498B;
}

/* Recent Posts (smb-recent-posts) — date | title | arrow row layout */
:is(.smb-recent-posts, .p-archive) .c-entries--text .c-entries__item {
	border-bottom: 1px solid #E5EEF6;
}

:is(.smb-recent-posts, .p-archive) .c-entries--text .c-entries__item > a {
	position: relative;
	display: block;
	padding: 22px 60px 22px 24px;
	text-decoration: none;
	color: inherit;
	transition: background-color 0.25s ease, box-shadow 0.25s ease;
}

:is(.smb-recent-posts, .p-archive) .c-entries--text .c-entries__item > a:hover {
	background-color: #fff;
	box-shadow: 0 4px 16px rgba(2, 73, 139, 0.12);
}

:is(.smb-recent-posts, .p-archive) .c-entries--text .c-entries__item > a::after {
	content: "";
	position: absolute;
	right: 24px;
	top: 50%;
	width: 20px;
	height: 20px;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2302498B%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cline%20x1%3D%275%27%20y1%3D%2712%27%20x2%3D%2719%27%20y2%3D%2712%27%2F%3E%3Cpolyline%20points%3D%2712%205%2019%2012%2012%2019%27%2F%3E%3C%2Fsvg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	transform: translateY(-50%);
	transition: transform 0.25s ease;
}

:is(.smb-recent-posts, .p-archive) .c-entries--text .c-entries__item > a:hover::after {
	transform: translateY(-50%) translateX(4px);
}

/* Hide unused parts (figure thumbnail/category, content excerpt, author, categories meta) */
:is(.smb-recent-posts, .p-archive) .c-entry-summary__figure,
:is(.smb-recent-posts, .p-archive) .c-entry-summary__content,
:is(.smb-recent-posts, .p-archive) .c-meta__item--author,
:is(.smb-recent-posts, .p-archive) .c-meta__item--categories {
	display: none;
}

/* Body: flex row with [date] [title] (override Snow Monkey's row-reverse + width:8em on meta) */
:is(.smb-recent-posts, .p-archive) .c-entries--text .c-entry-summary__body {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	gap: 32px !important;
	width: 100% !important;
}

:is(.smb-recent-posts, .p-archive) .c-entries--text .c-entry-summary__body > .c-entry-summary__meta {
	order: 1 !important;
	flex: 0 0 auto !important;
	width: auto !important;
	margin: 0 !important;
}

:is(.smb-recent-posts, .p-archive) .c-entries--text .c-entry-summary__body > .c-entry-summary__header {
	order: 2 !important;
	flex: 1 1 auto !important;
	min-width: 0;
	margin: 0 !important;
}

:is(.smb-recent-posts, .p-archive) .c-entries--text .c-entry-summary__body > .c-entry-summary__content {
	display: none !important;
}

/* Section wraps body */
:is(.smb-recent-posts, .p-archive) .c-entry-summary {
	display: block;
	width: 100%;
}

/* Title color: default dark, hover navy (accent) */
:is(.smb-recent-posts, .p-archive) .c-entries__item > a,
:is(.smb-recent-posts, .p-archive) .c-entry-summary__title {
	color: #1a1a1a !important;
	transition: color 0.2s ease;
}

:is(.smb-recent-posts, .p-archive) .c-entries__item > a:hover .c-entry-summary__title,
:is(.smb-recent-posts, .p-archive) .c-entries__item > a:focus .c-entry-summary__title {
	color: #02498B !important;
}

:is(.smb-recent-posts, .p-archive) .c-entry-summary__title {
	margin: 0;
	font-size: 15px;
	font-weight: 600;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Disable Snow Monkey's hover opacity on body */
:is(.smb-recent-posts, .p-archive) .c-entries__item > a:hover .c-entry-summary__body {
	opacity: 1;
}

/* Date */
:is(.smb-recent-posts, .p-archive) .c-meta {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
}

:is(.smb-recent-posts, .p-archive) .c-meta__item--published {
	font-size: 13px;
	color: #888;
}

/* Section title with square decorations on both sides.
   Snow Monkey uses ::after as the 60px underline and hides it via
   is-style-smb-section-undecorated-title with high specificity, so
   we use !important to repurpose it as a right-side square. */

/* iframes inside columns: fill the column completely
   (override is-vertically-aligned-center so the column stretches) */
.wp-block-column.is-vertically-aligned-center:has(iframe) {
	align-self: stretch;
}

.wp-block-column.is-vertically-aligned-center:has(iframe) > div {
	height: 100%;
}

.wp-block-column iframe {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 280px;
}

/* Page header title: maximum white-text-on-image legibility
   - 4-direction sharp shadows form an outline that survives any bg color
   - Stacked blurs add a halo for additional contrast
   - Drop shadow gives depth */
/* Entry title (post/page header in content area — no bg image) */
.c-entry__title {
	color: #02498B;
}

/* Squares on h2 itself (only one ::before and one ::after total)
   display: table + margin auto centers the box across contexts.
   Pseudo color uses currentColor; h2 color follows the span's color class. */
.smb-section__title {
	display: table !important;
	margin-left: auto !important;
	margin-right: auto !important;
	position: relative !important;
}

.smb-section__title:has(.has-sm-accent-color) {
	color: var(--wp--preset--color--sm-accent);
}

.smb-section__title:has(.has-sm-sub-accent-color) {
	color: var(--wp--preset--color--sm-sub-accent);
}

.smb-section__title:has(.has-sm-text-color) {
	color: var(--wp--preset--color--sm-text);
}

.smb-section__title:has(.has-sm-text-alt-color) {
	color: var(--wp--preset--color--sm-text-alt);
}

.smb-section__title::before,
.smb-section__title::after {
	content: "" !important;
	display: block !important;
	position: absolute !important;
	top: 50% !important;
	width: 0.3em !important;
	height: 0.3em !important;
	background-color: currentColor !important;
	transform: translateY(-50%) !important;
	margin: 0 !important;
}

.smb-section__title::before {
	right: 100% !important;
	margin-right: 0.8em !important;
	left: auto !important;
}

.smb-section__title::after {
	left: 100% !important;
	margin-left: 0.8em !important;
	right: auto !important;
}

.smb-section__title > span::before,
.smb-section__title > span::after,
.smb-section__title > span > span::before,
.smb-section__title > span > span::after {
	content: none !important;
}

/* Mobile: shrink the squares + their margin so absolute-positioned pseudos fit on-screen */
@media (max-width: 768px) {
	.smb-section__title {
		max-width: calc(100% - 1.6em) !important;
	}
	.smb-section__title::before,
	.smb-section__title::after {
		width: 0.25em !important;
		height: 0.25em !important;
	}
	.smb-section__title::before {
		margin-right: 0.4em !important;
	}
	.smb-section__title::after {
		margin-left: 0.4em !important;
	}
}

/* Page header (with image): narrower height than Snow Monkey default. */
.c-page-header[data-has-image="true"] {
	height: clamp(180px, 28vw, 280px);
}

/* Page header title:
   - Strong global white overlay on the bg image so the navy title contrasts.
   - Title has no own background; readability comes from overlay + crisp drop-shadow. */
.c-page-header[data-has-image="true"] .c-page-header__bgimage::after {
	content: "";
	position: absolute;
	inset: 0;
	background-color: rgba(255, 255, 255, 0.7);
	pointer-events: none;
}

.c-page-header__title {
	color: #02498B;
	font-weight: 900;
	filter:
		drop-shadow(0 0 1px #fff)
		drop-shadow(0 0 1px #fff)
		drop-shadow(0 0 1px #fff)
		drop-shadow(0 0 3px rgba(255, 255, 255, 0.85))
		drop-shadow(0 4px 8px rgba(0, 0, 0, 0.55));
}

/* ==========================================================================
   wp-block-heading H1–H6 — brand-aligned styling
   ========================================================================== */
/* Unified heading color across all levels */
h1.wp-block-heading,
h2.wp-block-heading,
h3.wp-block-heading,
h4.wp-block-heading,
h5.wp-block-heading,
h6.wp-block-heading {
	color: #02498B;
}

/* Decorative styling only for H2 / H3 without is-style-plain */
h2.wp-block-heading:not(.is-style-plain),
h3.wp-block-heading:not(.is-style-plain) {
	font-weight: 700;
	line-height: 1.45;
	letter-spacing: 0.02em;
}

/* H2: tinted background block with left accent bar */
h2.wp-block-heading:not(.is-style-plain) {
	background: #E5EEF6;
	border-left: 4px solid #02498B;
	padding: 0.7em 1em;
	margin: 2.4em 0 1em;
	font-size: clamp(18px, 1.9vw, 24px);
}

/* H3: bottom border with short accent line */
h3.wp-block-heading:not(.is-style-plain) {
	position: relative;
	margin: 2em 0 0.8em;
	padding-bottom: 0.55em;
	font-size: clamp(18px, 1.9vw, 22px);
	border-bottom: 1px solid #E5EEF6;
}

h3.wp-block-heading:not(.is-style-plain)::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 56px;
	height: 2px;
	background-color: #02498B;
}

/* ==========================================================================
   Prev/Next post navigation (.c-prev-next-nav) — image-free card style
   ========================================================================== */
.c-prev-next-nav {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	margin: 3em 0;
}

.c-prev-next-nav__item {
	min-height: 92px;
}

.c-prev-next-nav__item > a {
	display: block;
	height: 100%;
	padding: 18px 22px;
	border: 1px solid #E5EEF6;
	background: #fff;
	text-decoration: none;
	color: inherit;
	transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.c-prev-next-nav__item > a:hover {
	border-color: #02498B;
	box-shadow: 0 6px 18px rgba(2, 73, 139, 0.12);
}

/* Hide thumbnail (no images) */
.c-prev-next-nav__item-figure {
	display: none;
}

/* Label (新しい投稿 / 古い投稿) */
.c-prev-next-nav__item-label {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 6px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.12em;
	color: #888;
}

.c-prev-next-nav__item-label i {
	color: #02498B;
	font-size: 13px;
}

/* "prev" item visually targets the right card → align right */
.c-prev-next-nav__item--prev .c-prev-next-nav__item-label {
	justify-content: flex-end;
}

.c-prev-next-nav__item--prev .c-prev-next-nav__item-title {
	text-align: right;
}

/* Title */
.c-prev-next-nav__item-title {
	color: #02498B;
	font-weight: 600;
	font-size: 14px;
	line-height: 1.55;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Hide empty side (no prev or no next) */
.c-prev-next-nav__item:not(:has(a)) {
	visibility: hidden;
	pointer-events: none;
}

@media (max-width: 600px) {
	.c-prev-next-nav {
		grid-template-columns: 1fr;
	}
	.c-prev-next-nav__item--prev .c-prev-next-nav__item-label {
		justify-content: flex-start;
	}
	.c-prev-next-nav__item--prev .c-prev-next-nav__item-title {
		text-align: left;
	}
}

/* ==========================================================================
   Footer widget area — split layout (white left / navy right)
   Kill ALL outer paddings/margins so the navy fills edge-to-edge
   ========================================================================== */
.l-footer.l-footer--footer-1,
.l-footer .l-footer__body,
.l-footer__widget-area,
.l-footer-widget-area,
.l-footer-widget-area > .c-container,
.l-footer-widget-area .c-row,
.l-footer-widget-area__item,
.l-footer-widget-area__item > .c-widget {
	padding: 0 !important;
	margin: 0 !important;
	max-width: none !important;
	width: 100% !important;
}

.l-footer__widget-area .wp-block-column {
	margin: 0 !important;
}

.l-footer__widget-area .wp-block-columns {
	display: flex !important;
	align-items: stretch !important;
	flex-wrap: nowrap !important;
	gap: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	width: 100%;
}

.l-footer__widget-area .wp-block-columns > .wp-block-column {
	flex: 1 1 0 !important;
	margin: 0 !important;
	padding: 60px clamp(24px, 5vw, 80px) !important;
	align-self: stretch !important;
}

/* Left column: white bg with company info */
.l-footer__widget-area .wp-block-columns > .wp-block-column:first-child {
	background: #fff;
}

.l-footer__widget-area .wp-block-columns > .wp-block-column:first-child p {
	color: #1a1a1a;
}

/* Right column: navy bg with menu */
.l-footer__widget-area .wp-block-columns > .wp-block-column:last-child {
	background: #025EB1;
	color: #fff;
	display: flex !important;
	align-items: center;
}

.l-footer__widget-area .wp-block-columns > .wp-block-column:last-child .widget {
	width: 100%;
}

/* Right column menu: 2-column grid with circular arrows */
.l-footer__widget-area .wp-block-column:last-child ul.menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 32px;
}

.l-footer__widget-area .wp-block-column:last-child ul.menu li {
	position: relative;
	border-bottom: 1px solid rgba(255, 255, 255, 0.25);
	margin: 0;
	padding: 0;
}

.l-footer__widget-area .wp-block-column:last-child ul.menu li a {
	display: block;
	padding: 18px 48px 18px 0;
	color: #fff;
	text-decoration: none;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.04em;
	transition: opacity 0.2s ease;
}

.l-footer__widget-area .wp-block-column:last-child ul.menu li a:hover {
	color: #fff;
	opacity: 0.7;
}

.l-footer__widget-area .wp-block-column:last-child ul.menu li::after {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background-color: #fff;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2302498B%27%20stroke-width%3D%272.5%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cline%20x1%3D%275%27%20y1%3D%2712%27%20x2%3D%2719%27%20y2%3D%2712%27%2F%3E%3Cpolyline%20points%3D%2712%205%2019%2012%2012%2019%27%2F%3E%3C%2Fsvg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 14px;
	pointer-events: none;
	transition: transform 0.2s ease;
}

.l-footer__widget-area .wp-block-column:last-child ul.menu li:hover::after {
	transform: translateY(-50%) translateX(3px);
}

/* Mobile: stack columns, reverse so menu comes first → copyright stays last */
@media (max-width: 768px) {
	.l-footer__widget-area .wp-block-columns {
		flex-direction: column-reverse !important;
	}
	.l-footer__widget-area .wp-block-columns > .wp-block-column {
		padding: 40px 24px !important;
		flex-basis: auto !important;
	}
	.l-footer__widget-area .wp-block-column:last-child ul.menu {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   Contact banner — phone icon + number + reception hours on grey background
   ========================================================================== */
.contact-banner {
	display: inline-flex;
	align-items: center;
	gap: 18px;
	background: #F2F2F2;
	padding: 14px 24px;
	flex-wrap: wrap;
}

.contact-banner__icon {
	display: inline-flex;
	width: 28px;
	height: 28px;
	color: #02498B;
	flex-shrink: 0;
}

.contact-banner__icon svg {
	width: 100%;
	height: 100%;
}

.contact-banner__number {
	color: #02498B;
	font-size: clamp(20px, 2.4vw, 28px);
	font-weight: 700;
	letter-spacing: 0.05em;
}

.contact-banner__hours {
	color: #1a1a1a;
	font-size: 14px;
}

/* Header-positioned variant: keep grey bg, single line, smaller icon, fit parent */
.contact-banner--header {
	background: #F2F2F2;
	padding: 8px 16px;
	gap: 10px;
	flex-wrap: nowrap;
	white-space: nowrap;
	max-width: 100%;
	box-sizing: border-box;
	overflow: hidden;
}

.contact-banner--header .contact-banner__icon {
	width: 18px;
	height: 18px;
}

.contact-banner--header .contact-banner__number {
	font-size: 16px;
	white-space: nowrap;
}

.contact-banner--header .contact-banner__hours {
	font-size: 11px;
	white-space: nowrap;
}

/* ==========================================================================
   Header layout (desktop): Logo on left full-height, top-right=contact banner,
   bottom-right=global nav.  Re-arranges existing flex columns via CSS Grid.
   ========================================================================== */
@media (min-width: 64em) {
	.l-1row-header .c-row.c-row--nowrap {
		display: grid !important;
		grid-template-columns: auto 1fr;
		grid-template-rows: auto auto;
		grid-template-areas:
			"logo banner"
			"logo nav";
		align-items: center;
		column-gap: 24px;
		row-gap: 0;
	}

	.l-1row-header .c-row.c-row--nowrap > .c-row__col:has(.l-1row-header__branding) {
		grid-area: logo;
		align-self: center;
	}

	.l-1row-header .c-row.c-row--nowrap > .c-row__col:has(.p-global-nav) {
		grid-area: nav;
		justify-self: end;
	}

	.l-1row-header .c-row.c-row--nowrap > .c-row__col:has(.l-1row-header__content) {
		grid-area: banner;
		justify-self: end;
		min-width: 0;
		max-width: 100%;
	}
}

/* Mobile: force-show the contact banner column (Snow Monkey hides via .u-invisible-md-down) */
@media (max-width: 63.99em) {
	.l-1row-header .c-row.c-row--nowrap {
		flex-wrap: wrap !important;
	}
	.l-1row-header .c-row.c-row--nowrap > .c-row__col:has(.l-1row-header__content) {
		display: block !important;
		flex-basis: 100% !important;
		width: 100%;
		order: -1;
		min-width: 0;
		max-width: 100%;
	}
	.l-1row-header .l-1row-header__content {
		display: flex;
		justify-content: center;
		max-width: 100%;
	}
	.l-1row-header__content .contact-banner--header {
		max-width: 100%;
		box-sizing: border-box;
	}
}

@media (max-width: 480px) {
	.contact-banner--header {
		flex-wrap: nowrap;
		white-space: nowrap;
		justify-content: center;
		gap: 5px;
		padding: 5px 8px;
		max-width: 100%;
		box-sizing: border-box;
	}
	.contact-banner--header .contact-banner__icon {
		width: 12px;
		height: 12px;
	}
	.contact-banner--header .contact-banner__number {
		font-size: 11px;
	}
	.contact-banner--header .contact-banner__hours {
		font-size: 8px;
		white-space: nowrap;
	}
}

/* Header global-nav highlight button: gradient blue */
.p-global-nav .c-navbar {
	align-items: center !important;
	margin: 0 !important;
	padding: 0 !important;
}

.p-global-nav .c-navbar__item.sm-nav-menu-item-highlight {
	background: linear-gradient(90deg, #02498B 0%, #1B77E7 100%) !important;
	align-self: center !important;
	display: flex !important;
	margin: 0 0 0 24px !important;
	padding: 0 !important;
}

.p-global-nav .c-navbar__item.sm-nav-menu-item-highlight > a {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 8px 16px !important;
	margin: 0 !important;
	box-sizing: border-box !important;
}

.p-global-nav .c-navbar__item.sm-nav-menu-item-highlight:hover > a,
.p-global-nav .c-navbar__item.sm-nav-menu-item-highlight:focus-visible > a {
	background-color: rgba(255, 255, 255, 0.1);
}

/* Compact spacing between non-highlight nav items so they don't wrap */
.p-global-nav .c-navbar__item:not(.sm-nav-menu-item-highlight) > a {
	padding-left: 10px !important;
	padding-right: 10px !important;
}

/* ==========================================================================
   Drawer (mobile menu) — light background, logo at top, footer-style items
   ========================================================================== */
.c-drawer {
	background-color: #fff !important;
	color: #02498B !important;
}

.c-drawer .c-drawer__inner {
	background-color: #fff !important;
}

.drawer-logo {
	padding: 20px;
	margin-bottom: 12px;
	border-bottom: 1px solid #E5EEF6;
	background-color: #fff;
}

.drawer-logo a {
	display: block;
}

.drawer-logo img {
	display: block;
	max-width: 100%;
	height: auto;
}

/* Drawer menu items: same look as footer menu */
.c-drawer .c-drawer__menu .c-drawer__item {
	position: relative;
	border-bottom: 1px solid #E5EEF6;
	margin: 0;
	padding: 0;
}

.c-drawer .c-drawer__menu .c-drawer__item > a {
	display: block;
	padding: 16px 56px 16px 20px;
	color: #02498B;
	text-decoration: none;
	font-weight: 500;
	font-size: 14px;
	letter-spacing: 0.04em;
}

.c-drawer .c-drawer__menu .c-drawer__item:not(.sm-nav-menu-item-highlight)::after {
	content: "";
	position: absolute;
	right: 18px;
	top: 50%;
	transform: translateY(-50%);
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background-color: #E5EEF6;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%2302498B%27%20stroke-width%3D%272.5%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cline%20x1%3D%275%27%20y1%3D%2712%27%20x2%3D%2719%27%20y2%3D%2712%27%2F%3E%3Cpolyline%20points%3D%2712%205%2019%2012%2012%2019%27%2F%3E%3C%2Fsvg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 12px;
	pointer-events: none;
}

/* Highlight item (お問い合わせ) — gradient button */
.c-drawer .c-drawer__menu .c-drawer__item.sm-nav-menu-item-highlight {
	background: linear-gradient(90deg, #02498B 0%, #1B77E7 100%);
	border-bottom: none;
	margin: 16px 16px 0;
	border-radius: 4px;
}

.c-drawer .c-drawer__menu .c-drawer__item.sm-nav-menu-item-highlight > a {
	color: #fff;
	text-align: center;
	padding: 14px 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}

.c-drawer .c-drawer__menu .c-drawer__item.sm-nav-menu-item-highlight > a i {
	margin: 0 !important;
}

/* ==========================================================================
   Digital Marketing page — First View (.dm-fv)
   ========================================================================== */
.dm-fv {
	position: relative !important;
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	background: linear-gradient(180deg, #C7E3FF 0%, #FFFFFF 100%);
	overflow: hidden;
	padding: 80px 0;
	min-height: clamp(360px, calc(50vw * 0.5625 + 80px), 700px);
}

.dm-fv__decorations {
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 0;
	overflow: hidden;
	list-style: none;
	margin: 0;
	padding: 0;
}

.dm-fv__square {
	position: absolute;
	display: block;
	list-style: none;
	width: 20px;
	height: 20px;
	background: #CDE6FF;
	bottom: -150px;
	border-radius: 15%;
	animation: dm-fv-rise 18s linear infinite;
	will-change: transform, opacity;
}

.dm-fv__square:nth-child(2n) {
	background: #E9F4FF;
}

.dm-fv__square:nth-child(1)  { left: 25%; width: 80px;  height: 80px;  animation-delay: -3s; }
.dm-fv__square:nth-child(2)  { left: 10%; width: 20px;  height: 20px;  animation-delay: -7s;  animation-duration: 9s; }
.dm-fv__square:nth-child(3)  { left: 70%; width: 20px;  height: 20px;  animation-delay: -11s; }
.dm-fv__square:nth-child(4)  { left: 40%; width: 60px;  height: 60px;  animation-delay: -5s;  animation-duration: 13s; }
.dm-fv__square:nth-child(5)  { left: 65%; width: 20px;  height: 20px;  animation-delay: -14s; }
.dm-fv__square:nth-child(6)  { left: 75%; width: 110px; height: 110px; animation-delay: -8s; }
.dm-fv__square:nth-child(7)  { left: 35%; width: 150px; height: 150px; animation-delay: -16s; }
.dm-fv__square:nth-child(8)  { left: 50%; width: 25px;  height: 25px;  animation-delay: -22s; animation-duration: 30s; }
.dm-fv__square:nth-child(9)  { left: 20%; width: 15px;  height: 15px;  animation-delay: -18s; animation-duration: 25s; }
.dm-fv__square:nth-child(10) { left: 85%; width: 150px; height: 150px; animation-delay: -3s;  animation-duration: 8s; }

@keyframes dm-fv-rise {
	0%   { transform: translateY(0) rotate(0deg);       opacity: 0; }
	15%  { opacity: 1; }
	85%  { opacity: 1; }
	100% { transform: translateY(-700px) rotate(360deg); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.dm-fv__square {
		animation: none !important;
	}
}

.dm-fv__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 clamp(24px, 5vw, 48px);
}

.dm-fv__content {
	position: relative;
	z-index: 2;
	max-width: 45%;
}

.dm-fv__title {
	font-size: clamp(22px, 3vw, 38px);
	font-weight: 700;
	line-height: 1.45;
	letter-spacing: 0.02em;
	margin: 0 0 32px;
	width: fit-content;
	background: linear-gradient(
		90deg,
		#02498B 0%,
		#B7C3DD 11%,
		#02498B 18%,
		#006DD2 53%,
		#02498B 99%
	);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

.dm-fv__description {
	line-height: 2.1;
	color: #2a2a2a;
	margin: 0;
}

.dm-fv__image {
	position: absolute;
	right: 0;
	bottom: 0;
	width: clamp(360px, min(54vw, calc(50vw + 52px)), 1100px);
	z-index: 1;
	overflow: hidden;
	border-top-left-radius: 28% 50%;
	border-bottom-left-radius: 28% 50%;
}

.dm-fv__image img,
.dm-fv__image video {
	width: 100%;
	height: auto;
	display: block;
	border-top-left-radius: 28% 50%;
	border-bottom-left-radius: 28% 50%;
	/* Force a compositing layer so mobile Chrome / Safari clip the video
	   correctly along the rounded edges. */
	transform: translateZ(0);
	-webkit-mask-image: -webkit-radial-gradient(white, black);
}

/* dm-fv entrance animations
   - title uses opacity only (transforms on background-clip:text gradients
     trigger expensive repaints, so we avoid them on the title)
   - description and image fade-up */
@keyframes dm-fv-fade {
	from { opacity: 0; }
	to   { opacity: 1; }
}

@keyframes dm-fv-fade-up {
	from {
		opacity: 0;
		transform: translateY(16px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.dm-fv__title {
	opacity: 0;
	animation: dm-fv-fade 0.7s ease-out 0.2s forwards;
}

.dm-fv__description {
	opacity: 0;
	animation: dm-fv-fade-up 0.7s ease-out 0.5s forwards;
}

.dm-fv__image {
	opacity: 0;
	animation: dm-fv-fade-up 0.8s ease-out 0.4s forwards;
}

@media (prefers-reduced-motion: reduce) {
	.dm-fv__title,
	.dm-fv__description,
	.dm-fv__image {
		animation: none;
		opacity: 1;
		transform: none;
	}
}

@media (max-width: 768px) {
	.dm-fv {
		padding: 48px 0 0;
	}
	.dm-fv__title {
		margin: 0 0 20px;
	}
	.dm-fv__content {
		max-width: 100%;
		padding-bottom: calc(45vw + 32px);
	}
	.dm-fv__image {
		width: 80% !important;
		max-width: 100vw !important;
	}
	.dm-fv__square--2,
	.dm-fv__square--5 {
		display: none;
	}
}
/* ==========================================================================
   FAQ items (smb-faq) — Q/A label boxes + horizontal text layout
   ========================================================================== */
.smb-faq__item {
	margin-bottom: 16px !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: 0 4px 12px rgba(2, 73, 139, 0.08) !important;
}

.smb-faq__item__question,
.smb-faq__item__answer {
	display: flex !important;
	gap: 18px !important;
	padding: 14px 18px !important;
	align-items: center !important;
	border: 0 !important;
	margin: 0 !important;
}

.smb-faq__item__question {
	background: #F2F4F7 !important;
}

.smb-faq__item__answer {
	background: #fff !important;
}

.smb-faq__item__question__label,
.smb-faq__item__answer__label {
	width: 48px !important;
	height: 48px !important;
	min-width: 48px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-weight: 700 !important;
	font-size: 18px !important;
	line-height: 1 !important;
	flex: 0 0 48px !important;
	border-radius: 0 !important;
	margin: 0 !important;
}

.smb-faq__item__question__body,
.smb-faq__item__answer__body {
	margin: 0 !important;
	flex: 1 1 auto !important;
	min-width: 0 !important;
	padding: 0 !important;
}

.smb-faq__item__question__label {
	background: #02498B !important;
	color: #fff !important;
}

.smb-faq__item__answer__label {
	background: #E5EEF6 !important;
	color: #02498B !important;
}

.smb-faq__item__answer__body p {
	margin: 0 !important;
}

/* Apply only the gradient text color from .dm-fv__title to .st-fv__title */
.st-fv__title {
	background: linear-gradient(
		90deg,
		#02498B 0%,
		#B7C3DD 11%,
		#02498B 18%,
		#006DD2 53%,
		#02498B 99%
	);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

/* st-fv: stretch the image column to match the text column's height
   so no gap appears below the image when the screen narrows.
   Only applies while columns are still side-by-side (≥782px is the WP
   stack threshold); below that the image keeps its natural ratio. */
@media (min-width: 782px) {
	.st-fv .wp-block-column {
		align-self: stretch;
	}
	.st-fv .wp-block-column figure.wp-block-image,
	.st-fv .wp-block-column figure.wp-block-video {
		height: 100%;
		margin: 0;
	}
	.st-fv .wp-block-column figure.wp-block-image img,
	.st-fv .wp-block-column figure.wp-block-video video {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
	}
}

/* Grid (vertical+horizontal faint lines) background for .bg-stripe sections */
.bg-stripe {
	background-image:
		linear-gradient(to right, rgba(0, 0, 0, 0.05) 1px, transparent 1px),
		linear-gradient(to bottom, rgba(0, 0, 0, 0.05) 1px, transparent 1px);
	background-size: 40px 40px;
	background-position: -20px -20px;
	background-color: #fff;
}

/* ==========================================================================
   #case-studies — corner triangle decorations on each column
   Top-left and bottom-right of every column-like child receive a filled
   right-triangle in the theme accent color.
   ========================================================================== */
#case-studies :is(
	.wp-block-column,
	.smb-section__column,
	.wp-block-snow-monkey-blocks-section-with-bgimage__column,
	.wp-block-snow-monkey-blocks-items__item,
	.smb-items__item
) {
	position: relative;
}

#case-studies :is(
	.wp-block-column,
	.smb-section__column,
	.wp-block-snow-monkey-blocks-section-with-bgimage__column,
	.wp-block-snow-monkey-blocks-items__item,
	.smb-items__item
)::before,
#case-studies :is(
	.wp-block-column,
	.smb-section__column,
	.wp-block-snow-monkey-blocks-section-with-bgimage__column,
	.wp-block-snow-monkey-blocks-items__item,
	.smb-items__item
)::after {
	content: "";
	position: absolute;
	width: 16px;
	height: 16px;
	background-color: var(--wp--preset--color--sm-accent);
	pointer-events: none;
}

#case-studies :is(
	.wp-block-column,
	.smb-section__column,
	.wp-block-snow-monkey-blocks-section-with-bgimage__column,
	.wp-block-snow-monkey-blocks-items__item,
	.smb-items__item
)::before {
	top: 0;
	left: 0;
	clip-path: polygon(0 0, 100% 0, 0 100%);
}

#case-studies :is(
	.wp-block-column,
	.smb-section__column,
	.wp-block-snow-monkey-blocks-section-with-bgimage__column,
	.wp-block-snow-monkey-blocks-items__item,
	.smb-items__item
)::after {
	bottom: 0;
	right: 0;
	clip-path: polygon(100% 100%, 100% 0, 0 100%);
}

/* ==========================================================================
   .case-study — corner triangle decorations on each .wp-block-group child
   Same visual treatment as #case-studies columns above; scoped to
   .wp-block-group for inline case-study card markup.
   ========================================================================== */
.case-study .wp-block-group {
	position: relative;
}

.case-study .wp-block-group::before,
.case-study .wp-block-group::after {
	content: "";
	position: absolute;
	width: 16px;
	height: 16px;
	background-color: var(--wp--preset--color--sm-accent);
	pointer-events: none;
}

.case-study .wp-block-group::before {
	top: 0;
	left: 0;
	clip-path: polygon(0 0, 100% 0, 0 100%);
}

.case-study .wp-block-group::after {
	bottom: 0;
	right: 0;
	clip-path: polygon(100% 100%, 100% 0, 0 100%);
}

/* ==========================================================================
   #flow — between-column arrow image (right-pointing triangle.png)
   Each column gets a triangle on its right edge, except the last column.
   ========================================================================== */
#flow :is(
	.wp-block-column,
	.smb-section__column,
	.wp-block-snow-monkey-blocks-items__item,
	.smb-items__item
) {
	position: relative;
}

#flow :is(
	.wp-block-column,
	.smb-section__column,
	.wp-block-snow-monkey-blocks-items__item,
	.smb-items__item
):not(:last-child)::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 100%;
	transform: translateY(-50%);
	width: 36px;
	height: 36px;
	background-image: url("https://lifepd.zenith-web-creations.com/wp-content/uploads/2026/04/triangle.png");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: contain;
	pointer-events: none;
	z-index: 2;
}

/* When WP core columns stack vertically (≤781px is the WP default stacking BP),
   move the arrow to the bottom edge and rotate it 90° to point downward.
   Inherited background-position: left center → after 90° rotation that point
   maps to the TOP of the rotated visual, so the triangle base stays flush
   against the column's bottom edge. */
@media (max-width: 781px) {
	#flow :is(
		.wp-block-column,
		.smb-section__column,
		.wp-block-snow-monkey-blocks-items__item,
		.smb-items__item
	):not(:last-child)::after {
		top: 100%;
		left: 50%;
		transform: translateX(-50%) rotate(90deg);
		transform-origin: center center;
	}
}


/* Prefix horizontal line that extends to the viewport's left edge.
   Same vertical alignment as .has-prefix-line; the line runs from the screen
   left edge to 20px inside the element (just before the text). */
.has-prefix-line-full {
	position: relative;
}

.has-prefix-line-full::before {
	content: "";
	position: absolute;
	right: calc(100% - 10px);
	top: 50%;
	transform: translateY(-50%);
	width: 100vw;
	height: 2px;
	background-color: #02498B;
}

/* l-2row-header: show contact banner on mobile.
   Snow Monkey hides the banner column via .u-invisible-md-down (PC-only).
   Re-show it at md-down so the phone number stays visible on mobile. */
@media (max-width: 63.99em) {
	.l-2row-header .c-row.c-row--nowrap {
		flex-wrap: wrap !important;
	}
	.l-2row-header .c-row__col.u-invisible-md-down:has(.contact-banner--header) {
		display: block !important;
		flex-basis: 100% !important;
		width: 100%;
		order: -1;
		min-width: 0;
		max-width: 100%;
	}
	.l-2row-header .p-header-content--lg {
		margin-bottom: 12px;
	}
	.l-2row-header .p-header-content--lg .contact-banner--header {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-wrap: wrap;
		gap: 4px 10px;
	}
}