/* ============================================================
   SITE-WIDE WHITE-BASE ROLLOUT  (nirnor-style)
   Loaded on every page AFTER main.css. Flips the three originally
   DARK theme palettes (theme-dark / theme-mocha / theme-sage) to the
   neutral light base, re-colours the header states that assume a dark
   hero, and restyles the front CONCEPT cards from photos to a moving
   tonal gradient. Self-contained dark accent bands (CTA strips, .story,
   LP dark blocks, tone-design dark strips, footer) are intentionally
   LEFT dark — their white text stays correct there.
   Revert = remove the enqueue lines for this file + webgl-bg + three.
   ============================================================ */

/* ---- 0. English typeface → Poppins on every page (client 2026-07-07).
   Overrides main.css --font-en (was "Jost"). Poppins is loaded in
   inc/enqueue.php (replaced the Jost Google-Fonts request). All English text
   reads var(--font-en), so this one variable flips the whole site. ---- */
:root {
	--font-en: "Poppins", "Helvetica Neue", Arial, sans-serif;
}

/* ---- 1. Flip the theme palettes to the light neutral base ----
   Components read these vars, so most text/bg flips automatically.
   --color-deepest/deeper/deep stay dark so footer + CTA remain dark.
   2026-07-07: theme-warm (About sub) + theme-cool (CASE/EVENT/NEWS/WORKS/
   JOURNAL + Service pages) added so every page matches the white top page —
   they shared the same variable set, so the neutral values apply cleanly. */
body.theme-dark,
body.theme-mocha,
body.theme-sage,
body.theme-warm,
body.theme-cool {
	--section-bg:        #ffffff;
	--section-bg-soft:   #f4f4f4;
	--section-bg-card:   #ffffff;
	--section-fg:        #1a1a1a;
	--section-fg-soft:   #333333;
	--section-fg-mute:   #8a8a8a;
	--section-line:      #e6e6e6;
	--section-line-soft: #f1f1f1;
	--section-accent:    #353535;
	--color-bg:        #ffffff;
	--color-bg-pure:   #ffffff;
	--color-fg:        #1a1a1a;
	--color-fg-soft:   #333333;
	--color-fg-mute:   #8a8a8a;
	--color-line:      #e6e6e6;
	--color-line-soft: #f1f1f1;
	/* Footer + CTA stay dark (white text on dark = readable, kept as anchor). */
	--color-deepest:   #1a1a1a;
	--color-deeper:    #141414;
	--color-deep:      #333333;
}

/* ---- 2. WebGL backdrop canvas + hide the old SVG ripple (site-wide) ---- */
.geo-bg__webgl {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: block;
	z-index: 0;
}
.geo-bg__ripple { display: none !important; }

/* ---- 3. Header — its is-overlay (top) / is-dark (over dark band) states
   assume a dark hero and use white text/logo. Re-colour for the light base. ---- */
/* Header has NO background colour in any state (incl. the scrolled / sticky
   header) — client instruction 2026-06-27. */
.site-header,
.site-header.is-dark,
.site-header.is-overlay,
.site-header.is-solid {
	background: transparent !important;
	backdrop-filter: none !important;
}
.site-header.is-dark .site-header__logo svg .cls-1,
.site-header.is-dark .site-header__logo svg path,
.site-header.is-overlay .site-header__logo svg .cls-1,
.site-header.is-overlay .site-header__logo svg path { fill: #1a1a1a; }
.site-header.is-overlay .site-header__logo svg text { fill: #1a1a1a; }
.site-header.is-dark .site-header__logo-text,
.site-header.is-overlay .site-header__logo-text { color: #1a1a1a; }
.site-header.is-dark .site-nav__link,
.site-header.is-overlay .site-nav__link { color: #1a1a1a; }
.site-header.is-dark .site-nav__link::after,
.site-header.is-overlay .site-nav__link::after { background: #1a1a1a; }
.site-header.is-dark .site-header__cta,
.site-header.is-overlay .site-header__cta { background: transparent; color: #1a1a1a; }
.site-header.is-dark .site-header__cta:hover,
.site-header.is-overlay .site-header__cta:hover { background: #1a1a1a; color: #fff; }
body.has-overlay-header .nav-trigger__btn span { background: #1a1a1a !important; }
body.menu-open.has-overlay-header .nav-trigger__btn span { background: #1a1a1a !important; }

/* ---- 4. FRONT "CONCEPT" cards — photos → moving tonal gradient ----
   The inline background-image is removed in the template; cards now render
   as soft neutral-grey gradient panels with a slow drift, and the text
   flips to dark for legibility on the light field. (.cstack is the
   concept/why scroll-stack; concept cards carry data-num 1–3.) */
#concept .cstack__item {
	background-image: none !important;
	background-color: #ececec;
	background-size: 220% 220%;
	background-position: 0% 50%;
	animation: concept-drift 22s ease-in-out infinite alternate;
}
#concept .cstack__item[data-num="1"] {
	background-image: linear-gradient(125deg, #f6f6f6 0%, #cccccc 48%, #a0a0a0 100%);
}
#concept .cstack__item[data-num="2"] {
	background-image: linear-gradient(125deg, #eeeeee 0%, #c2c2c2 48%, #979797 100%);
	animation-duration: 26s;
}
#concept .cstack__item[data-num="3"] {
	background-image: linear-gradient(125deg, #f2f2f2 0%, #c9c9c9 48%, #a0a0a0 100%);
	animation-duration: 30s;
}
@keyframes concept-drift {
	from { background-position: 0% 50%; }
	to   { background-position: 100% 50%; }
}
@media (prefers-reduced-motion: reduce) {
	#concept .cstack__item { animation: none; }
}
/* Moving WebGL field injected per concept card (covers the gradient, which
   stays as a no-WebGL fallback). Text + shade sit above it. */
#concept .cstack__item-webgl {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
}
#concept .cstack__item-shade { z-index: 1; }
#concept .cstack__item-text  { z-index: 2; }
/* Soften the dark photo-legibility shade into a faint depth wash */
#concept .cstack__item-shade {
	background: linear-gradient(180deg, rgba(255,255,255,0.10) 0%, rgba(26,26,26,0.06) 100%) !important;
}
/* Card text → dark on the light gradient */
#concept .cstack__item-text { color: #1a1a1a; }
#concept .cstack__item-num  { color: rgba(26, 26, 26, 0.55); }
#concept .cstack__item-lead { color: #1a1a1a; }
#concept .cstack__item-body { color: rgba(26, 26, 26, 0.78); }

/* ---- 5. Safety: concept/why catch heading on the light base ---- */
.cstack__title { color: #1a1a1a; }
.cstack__label { color: rgba(26, 26, 26, 0.65); }

/* ---- 6. SERVICE quality block (srv-q) — was fully white text on the
   dark band; now sits on the light base, so flip every element to dark. ---- */
.srv-q__label              { color: rgba(26, 26, 26, 0.55); }
.srv-q__heading            { color: #1a1a1a; }
.srv-q__lead               { color: rgba(26, 26, 26, 0.72); }
.srv-q__item-num           { color: rgba(26, 26, 26, 0.5); }
.srv-q__item-en            { color: rgba(26, 26, 26, 0.5); }
.srv-q__item-headline      { color: rgba(26, 26, 26, 0.85); }
.srv-q__item-headline::after { background: rgba(26, 26, 26, 0.22); }
.srv-q__item-title         { color: #1a1a1a; }
.srv-q__item-desc          { color: rgba(26, 26, 26, 0.78); }
.srv-q__item-list          { border-top-color: rgba(26, 26, 26, 0.14); }
.srv-q__item-list a        { color: rgba(26, 26, 26, 0.82); }
.srv-q__item-list a::before { background: rgba(26, 26, 26, 0.4); }
.srv-q__item-list a:hover  { color: #1a1a1a; }
.srv-q__item-more          { color: #1a1a1a; border-bottom-color: rgba(26, 26, 26, 0.5); }

/* ---- 7. Header: CONTACT button outline → black in the light header
   states (it sits transparent over the now-light hero, so give it a
   visible dark outline). ---- */
.site-header.is-overlay .site-header__cta,
.site-header.is-dark .site-header__cta {
	border: 1px solid #1a1a1a;
}
.site-header.is-overlay .site-header__cta:hover,
.site-header.is-dark .site-header__cta:hover {
	background: #1a1a1a;
	color: #fff;
	border-color: #1a1a1a;
}

/* ---- 8. Hamburger (nav-trigger) lines — were forced white in the
   overlay / dark-band header states; invisible on the light base.
   Force them dark in every light-header state. ---- */
body.has-dark-header .nav-trigger__btn span,
body.has-overlay-header .nav-trigger__btn span {
	background: #1a1a1a !important;
}
/* keep the open-menu "×" behaviour intact (handled by main.css) */
body.menu-open.has-dark-header .nav-trigger__btn span,
body.menu-open.has-overlay-header .nav-trigger__btn span {
	background: #1a1a1a !important;
}

/* ---- 9. Circle-arrow buttons whose disc is filled dark — the "→" glyph
   was inheriting a dark colour and vanished. Force it white on the dark disc. ---- */
.front-dark .btn::after {
	color: #fff;
	border-color: #1a1a1a;
}
.hero--video .btn::after {
	color: #fff;
	border-color: #fff;
}
.hero--video .btn:hover::after {
	color: #1a1a1a;
	border-color: #1a1a1a;
}
/* concept outro keeps its #8a8a8a tinted CTA (handled in front-light.css) */

/* ---- 10. Wider, edge-to-edge dynamic layout (client instruction 2026-06-27).
   Widen the shared container and trim the side gutters so sections use much
   more of the viewport width. (Narrow text containers keep their own caps.) ---- */
:root {
	/* 2026-07-07: widen the shared cap 1880→2560 so header / footer / every
	   .container section fills to the logo axis (2vw+78) on wide screens,
	   matching the full-width heroes ("全体的に横幅はロゴまで広げる"). */
	--container-max: 2560px;
	--container-pad: clamp(20px, 3.4vw, 60px);
}
/* Symmetric side gutters on desktop: match the RIGHT margin to the LEFT (the
   logo axis 2vw+78px), so left and right spacing is equal site-wide and every
   block shares the same left line (client 2026-06-27). Mobile keeps the compact
   gutter above. */
@media (min-width: 769px) {
	:root { --container-pad: calc(2vw + 78px); }
}

/* ---- 11. Subpage hero — left edge aligned to the header logo's HORIZONTAL
   centre axis, with generous top spacing (client instruction 2026-06-27 + ref).
   Logo: viewBox 287.43×70.53 rendered at 38px tall ⇒ ~155px wide, sitting at
   2vw from the left ⇒ its centre axis = calc(2vw + 78px). Desktop only;
   mobile keeps normal padding. ---- */
.page-hero,
.lp-hero { padding-top: 180px; }

@media (min-width: 769px) {
	.page-hero .container {
		max-width: none;
		margin-inline: 0;
		padding-left: calc(2vw + 78px);
		padding-right: var(--container-pad);
	}
	.lp-hero { padding-left: 0; padding-right: 0; }
	.lp-hero .lp-hero__inner {
		max-width: none;
		margin-inline: 0;
		padding-left: calc(2vw + 78px);
		padding-right: var(--container-pad);
	}
	/* Archive / listing pages (journal, news, works, event, portfolio …) have no
	   .page-hero, so their content sat at the plain container gutter and didn't
	   line up with the hero axis. Align their main container to the same logo
	   axis (client: /journal/ etc. didn't match). */
	body.archive .container {
		max-width: none;
		margin-inline: 0;
		padding-left: calc(2vw + 78px);
		padding-right: var(--container-pad);
	}
}

/* ============================================================
   ARTICLE single "Journal 一覧へ" nav button — papamamanhouse homeBtn style
   (client 2026-06-27): bordered rectangle, left label + right line/chevron
   arrow; on hover a dark fill sweeps in from the left, label + arrow turn
   white and the arrow slides right.
   ============================================================ */
.article-single__nav .home-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: clamp(40px, 8vw, 90px);
	min-width: 295px;
	padding: 23px 30px;
	border: 1px solid #1a1a1a;
	color: #1a1a1a;
	background: transparent;
	text-align: left;
	letter-spacing: .075em;
	font-size: 16px;
	line-height: 1;
	overflow: hidden;
	z-index: 0;
	transition: color .4s ease;
}
.article-single__nav .home-btn::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 100%;
	background: #1a1a1a;
	transition: width .45s cubic-bezier(.4, 0, .2, 1);
	z-index: -1;
}
.article-single__nav .home-btn__label { position: relative; }
.article-single__nav .home-btn__arrow {
	display: block;
	width: 42px;
	height: 8px;
	flex: none;
	background: #1a1a1a;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='42' height='8'%3E%3Cpath d='M0 4H39M34 1l5 3-5 3' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E") no-repeat right center / contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='42' height='8'%3E%3Cpath d='M0 4H39M34 1l5 3-5 3' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E") no-repeat right center / contain;
	transition: background-color .4s ease, transform .4s ease;
}
.article-single__nav .home-btn:hover { color: #fff; }
.article-single__nav .home-btn:hover::before { width: 100%; }
.article-single__nav .home-btn:hover .home-btn__arrow { background-color: #fff; transform: translateX(6px); }

/* page-hero: remove the bottom divider (client 2026-06-27) */
.page-hero { border-bottom: 0; }

/* ============================================================
   ALL .btn buttons (incl. .btn--ghost + reservation submit) → papamamanhouse
   homeBtn style (client 2026-06-27). Bordered rectangle, label left + a clean
   SVG line→chevron arrow right; on hover a fill sweeps in from the left, the
   label + arrow invert and the arrow slides right.
   Colours are adaptive: --hb-line (border/arrow/fill) + --hb-on (label/arrow
   once filled). Default = dark button on a light background; the dark bands
   listed at the bottom flip to a white button so it stays visible.
   ============================================================ */
.btn {
	--hb-line: #1a1a1a;
	--hb-on: #ffffff;
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	min-width: min(260px, 100%);
	max-width: 100%;
	padding: 21px 30px;
	border: 1px solid var(--hb-line);
	border-radius: 0;
	background: linear-gradient(var(--hb-line), var(--hb-line)) left center / 0% 100% no-repeat;
	color: var(--hb-line);
	text-align: left;
	letter-spacing: .075em;
	font-size: 16px;
	line-height: 1.4;
	overflow: hidden;
	transition: background-size .45s cubic-bezier(.4, 0, .2, 1), color .4s ease;
}
.btn::after {
	content: "";
	flex: none;
	width: 42px;
	height: 8px;
	border: 0;
	border-radius: 0;
	background: var(--hb-line);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='42' height='8'%3E%3Cpath d='M0 4H39M34 1l5 3-5 3' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E") no-repeat right center / contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='42' height='8'%3E%3Cpath d='M0 4H39M34 1l5 3-5 3' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E") no-repeat right center / contain;
	transition: background-color .4s ease, transform .4s ease;
}
.btn:hover {
	background-size: 100% 100%;
	color: var(--hb-on);
	gap: 28px; /* hold the gap constant — base .btn:hover shrinks it and resizes the button */
}
.btn:hover::after {
	background-color: var(--hb-on);
	transform: translateX(6px);
}
/* These buttons ship a literal "→" in an <em class="btn__arrow"> — hide it
   inside .btn since the ::after SVG arrow replaces it (avoids a double arrow). */
.btn .btn__arrow { display: none; }
.btn:disabled,
.btn[disabled] { opacity: .45; cursor: not-allowed; }
/* Dark bands → white button (stays visible on dark backgrounds). */
.site-footer .btn,
.cta-block .btn,
.section--contact-cta .btn,
.td-finalcta .btn,
.story .btn,
.lp-why .btn,
.lp-midcta .btn,
.lp-finalcta .btn {
	--hb-line: #ffffff;
	--hb-on: #1a1a1a;
}

/* ============================================================
   Nav dropdown → white speech-bubble (client 2026-06-27):
   white background, soft shadow + small upward pointer, gently rounded
   corners, no outline border.
   ============================================================ */
.site-nav__dropdown {
	background: #fff;
	border: 0;
	border-radius: 10px;
	box-shadow: 0 14px 34px rgba(26, 26, 26, 0.13), 0 3px 10px rgba(26, 26, 26, 0.06);
	padding: 12px 0;
	margin-top: 10px;
}
.site-nav__dropdown::before {
	content: "";
	position: absolute;
	top: -6px;
	left: 50%;
	width: 13px;
	height: 13px;
	background: #fff;
	transform: translateX(-50%) rotate(45deg);
	border-radius: 3px 0 0 0;
	box-shadow: -3px -3px 6px -3px rgba(26, 26, 26, 0.08);
}

/* ============================================================
   In-page category / anchor nav under the hero (e.g. .srv-nav__list):
   plain-text links didn't read as clickable. Add a small down-chevron so
   they look like buttons that jump to the section below (client 2026-06-27).
   ============================================================ */
.srv-nav__list a {
	display: inline-flex;
	align-items: center;
	gap: 7px;
}
.srv-nav__list a::before {
	order: 1;
	content: "";
	width: 6px;
	height: 6px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg);
	margin-top: -3px;
	flex: none;
	transition: transform .25s ease;
}
.srv-nav__list a:hover::before { transform: rotate(45deg) translate(1.5px, 1.5px); }


/* ============================================================
 * News — urbanhome-style list + single (added 2026-06-27 / 4.15.123)
 *   colors & fonts inherit existing CSS variables.
 * ============================================================ */

/* --- Archive: total count + vertical feed with thumbnail --- */
.news-archive__total {
	font-family: var(--font-en);
	font-size: 13px;
	letter-spacing: 0.18em;
	color: var(--color-fg-mute);
	margin: 0 0 18px;
}
.news-archive__total span {
	font-size: 16px;
	font-weight: 600;
	color: var(--color-fg);
	margin-right: 5px;
}
.news-feed {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--color-line);
}
.news-feed__item {
	border-bottom: 1px solid var(--color-line);
}
.news-feed__link {
	display: grid;
	grid-template-columns: 200px 1fr;
	gap: 32px;
	align-items: center;
	width: 100%;
	padding: 26px 4px;
	transition: background-color 0.25s var(--ease-out);
}
.news-feed__link:hover {
	background: rgba(0, 0, 0, 0.015);
}
.news-feed__media {
	margin: 0;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	border-radius: 4px;
	background: var(--color-bg-soft, #f1f1f1);
}
.news-feed__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.6s var(--ease-out);
}
.news-feed__link:hover .news-feed__media img {
	transform: scale(1.04);
}
.news-feed__media.is-empty {
	display: flex;
	align-items: center;
	justify-content: center;
}
.news-feed__media-mark {
	font-family: var(--font-en);
	font-size: 14px;
	letter-spacing: 0.3em;
	color: var(--color-fg-mute);
	opacity: 0.6;
}
.news-feed__body {
	min-width: 0;
}
.news-feed__meta {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 12px;
}
.news-feed__date {
	font-family: var(--font-en);
	font-weight: 500;
	font-size: 15px;
	letter-spacing: 0.14em;
	color: var(--color-fg-mute);
}
.news-feed__cat {
	font-size: 12px;
	letter-spacing: 0.16em;
	color: var(--color-fg-mute);
	border: 1px solid var(--color-line);
	border-radius: 999px;
	padding: 3px 12px;
}
.news-feed__title {
	font-size: clamp(16px, 1.3vw, 19px);
	line-height: 1.7;
	letter-spacing: 0.04em;
	color: var(--color-fg);
	transition: opacity 0.25s var(--ease-out);
}
.news-feed__link:hover .news-feed__title {
	opacity: 0.66;
}
@media (max-width: 768px) {
	.news-feed__link {
		grid-template-columns: 96px 1fr;
		gap: 18px;
		padding: 20px 2px;
		align-items: start;
	}
	.news-feed__meta {
		flex-wrap: wrap;
		gap: 8px 12px;
		margin-bottom: 8px;
	}
	.news-feed__date { font-size: 14px; }
	.news-feed__title { font-size: 16px; }
}

/* --- Single: single column (override main.css .single-news base block) --- */
.single-news-wrap .single-news {
	max-width: 860px;
	margin-inline: auto;
	padding-top: 0;
}
.single-news-wrap .article-bread {
	max-width: 860px;
	margin: 0 auto 26px;
}
.single-news__header {
	margin-bottom: 36px;
}
.single-news__meta {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 18px;
}
.single-news__cat {
	font-size: 12px;
	letter-spacing: 0.16em;
	color: var(--color-fg-mute);
	border: 1px solid var(--color-line);
	border-radius: 999px;
	padding: 3px 12px;
}
.single-news-wrap .single-news__thumb {
	margin: 0 0 44px;
}
.single-news-wrap .single-news__thumb img {
	width: 100%;
	height: auto;
	display: block;
}
.single-news__footer {
	margin-top: 72px;
}

/* prev / next (single row) */
.news-pn {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	border-top: 1px solid var(--color-line);
	border-bottom: 1px solid var(--color-line);
	padding: 24px 0;
	margin-bottom: 44px;
}
.news-pn__item {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
}
.news-pn__item--next {
	text-align: right;
	align-items: flex-end;
}
.news-pn__label {
	font-family: var(--font-en);
	font-size: 12px;
	letter-spacing: 0.16em;
	color: var(--color-fg-mute);
}
.news-pn__title {
	font-size: 14px;
	line-height: 1.7;
	color: var(--color-fg);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	transition: opacity 0.25s var(--ease-out);
}
.news-pn__item:hover .news-pn__title {
	opacity: 0.6;
}
.news-pn__item--empty {
	pointer-events: none;
}
.single-news__nav {
	margin-top: 0;
	text-align: center;
}
@media (max-width: 768px) {
	.single-news__footer { margin-top: 48px; }
	.news-pn { gap: 12px; padding: 18px 0; }
	.news-pn__title { font-size: 13px; }
}

/* ============================================================
   Nav dropdown hover-bridge (client 2026-06-27):
   the 10px gap between the nav item and the speech-bubble dropdown was a
   dead zone — moving the cursor down toward an item dropped :hover and the
   menu closed before it could be clicked. This transparent strip fills the
   gap so the hover stays continuous. Only live while the item is hovered,
   so it never blocks clicks on the page underneath.
   ============================================================ */
.site-nav__item.has-dropdown::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	width: 240px;
	height: 18px;
	pointer-events: none;
}
.site-nav__item.has-dropdown:hover::after,
.site-nav__item.has-dropdown:focus-within::after {
	pointer-events: auto;
}

/* ============================================================
   Form field rhythm — unify the vertical gap between items to 40px across
   every form (contact / tone-design / inquiry). The spacing differed per
   form (contact 32px / td-form 24px / inquiry 24px) → client asked for a
   single 40px rhythm (client 2026-06-27). Horizontal gaps in split rows
   are kept as-is; only the vertical item spacing is unified.
   ============================================================ */
.contact-form { gap: 40px; }
.contact-form__row--split { row-gap: 40px; }
.contact-form__row--accept { margin-top: 0; }
.td-form__row { margin-bottom: 40px; }
.reservation--inquiry .reservation__form--inquiry { gap: 40px; }

/* ============================================================
   Event archive (/event/) page-hero container — add 60px bottom padding.
   Scoped to this element only (#main > section:nth-of-type(1) > div on the
   event archive); other pages' page-hero is untouched.
   websupport #59 / #3772, PC+SP (client 2026-06-27).
   ============================================================ */
.post-type-archive-event .page-hero > .container {
	padding-bottom: 60px;
}

/* ============================================================
   Header inner width = footer inner width (client 2026-06-27):
   the header row spanned full viewport width (padding-left:2vw + asymmetric
   right) while the footer is constrained to --container-max, centered, with
   symmetric --container-pad. Align the header to the footer so the logo and
   CTA edges line up with the footer content edges.
   ============================================================ */
.site-header__inner {
	max-width: var(--container-max);
	margin-inline: auto;
	padding-left: var(--container-pad);
	padding-right: var(--container-pad);
}

/* ============================================================
   websupport #3796 #3797 #3800 #3801 / #3772 (2026-06-27)
   タイポ微調整（全ページ＝同一クラス全インスタンス）＋ /event/ 余白
   ============================================================ */
/* #3796 / #3801 — .cstack__item-lead（concept/why の本文リード）weight400→700 / 字間5.2px→2px */
.cstack__item-lead { font-weight: 700; letter-spacing: 2px; }
/* #3797 — .cstack__item-num（番号）字間4.4px→2px */
.cstack__item-num  { letter-spacing: 2px; }
/* #3800 — .srv-q__item-title（SERVICE各項目見出し）weight400→700 / 字間5.2px→2px */
.srv-q__item-title { font-weight: 700; letter-spacing: 2px; }
/* #3772 — /event/ ページヒーローの container 下余白 0→60px（この要素のみ） */
body.post-type-archive-event .page-hero > .container { padding-bottom: 60px; }

/* =================================================================== */
/* Option A: 組織コーチングLP「進み方3ステップ」（corporate=steps のみ）   */
/* .lp-steps 系は corporate LP でしか出力されない（steps キー駆動）。      */
/* 戻すには この追記ブロックを削除するだけ（既存セレクタに影響なし）。      */
/* =================================================================== */
.lp-steps__head { max-width: 1040px; margin: 0 auto clamp(40px, 5vw, 64px); text-align: center; }
.lp-steps__heading {
	font-size: 35px; /* client 2026-07-08 #4683 (was clamp 24-40) */
	line-height: 1.5;
	letter-spacing: 0.06em;
	font-weight: 700;
	color: var(--color-fg);
	margin: 0 0 20px;
}
.lp-steps__lead {
	font-size: clamp(14px, 1.05vw, 16px);
	line-height: 2;
	letter-spacing: 0.04em;
	color: var(--color-fg-mute);
	margin: 0;
}
.lp-steps__list {
	list-style: none;
	margin: 0 auto;
	padding: 0;
	max-width: none;
	display: flex;
	flex-direction: column;
	gap: clamp(20px, 3vw, 32px);
}
.lp-step {
	display: grid;
	grid-template-columns: 96px 1fr;
	gap: clamp(20px, 3vw, 40px);
	align-items: start;
	border: 1px solid var(--color-line);
	border-radius: 14px;
	background: var(--color-bg);
	padding: clamp(24px, 3vw, 40px);
}
.lp-step__mark { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.lp-step__num {
	font-family: var(--font-en);
	font-size: clamp(33px, 4vw, 49px);
	line-height: 1;
	letter-spacing: 0.02em;
	color: var(--color-fg);
	font-weight: 500;
}
.lp-step__note {
	font-size: 12px;
	letter-spacing: 0.14em;
	color: var(--color-fg-mute);
	border: 1px solid var(--color-line);
	border-radius: 999px;
	padding: 3px 12px;
	white-space: nowrap;
}
.lp-step__label {
	font-size: clamp(19px, 1.8vw, 25px);
	letter-spacing: 0.06em;
	font-weight: 700;
	color: var(--color-fg);
	margin: 0 0 14px;
}
.lp-step__text {
	font-size: clamp(14px, 1.05vw, 16px);
	line-height: 2;
	letter-spacing: 0.04em;
	color: var(--color-fg-soft);
	margin: 0 0 20px;
}
/* ③ 続ける：可視化→実践→定着の3段階 */
.lp-step__stages {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px;
	margin: 0 0 16px;
}
.lp-stage {
	border: 1px solid var(--color-line);
	border-radius: 10px;
	padding: 18px 16px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	background: rgba(0, 0, 0, 0.012);
}
.lp-stage__name {
	font-size: 16px;
	letter-spacing: 0.08em;
	font-weight: 700;
	color: var(--color-fg);
}
.lp-stage__price {
	font-family: var(--font-en);
	font-size: 13px;
	letter-spacing: 0.06em;
	color: var(--color-fg-mute);
}
.lp-stage__text {
	font-size: 13.5px;
	line-height: 1.9;
	letter-spacing: 0.02em;
	color: var(--color-fg-soft);
}
.lp-step__pricenote {
	font-size: 13px;
	line-height: 1.9;
	letter-spacing: 0.03em;
	color: var(--color-fg-mute);
	margin: 0 0 4px;
}
.lp-step__links {
	list-style: none;
	margin: 4px 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px 22px;
}
.lp-step__link {
	position: relative;
	font-size: 14px;
	letter-spacing: 0.04em;
	color: var(--color-fg);
	background: none;
	border: 0;
	padding: 4px 0 5px;
	cursor: pointer;
	border-bottom: 1px solid var(--color-line);
	transition: border-color 0.3s var(--ease-out), opacity 0.3s var(--ease-out);
}
.lp-step__link::before { content: "→ "; color: var(--color-fg-mute); }
.lp-step__link:hover { border-bottom-color: var(--color-fg); opacity: 1; }
.lp-steps__cta {
	text-align: center;
	margin-top: clamp(40px, 5vw, 64px);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
}
.lp-steps__cta-lead {
	font-size: clamp(15px, 1.2vw, 17px);
	letter-spacing: 0.06em;
	color: var(--color-fg-soft);
	margin: 0;
}
@media (max-width: 768px) {
	.lp-step { grid-template-columns: 1fr; gap: 16px; }
	.lp-step__mark { flex-direction: row; align-items: center; gap: 14px; }
	.lp-step__stages { grid-template-columns: 1fr; }
}

/* =================================================================== */
/* 1ページ完結（見本）: 組織ブランディングLP（selfcontained のみ出力）   */
/* .lp-oc 系は organization-branding LP でしか出力されない。            */
/* 個別サービスへ遷移させない自己完結ページ。既存変数駆動で白ベース追従。 */
/* 戻すには この追記ブロックを削除するだけ（既存セレクタに影響なし）。    */
/* =================================================================== */
.lp-oc { padding-top: clamp(48px, 6vw, 96px); padding-bottom: clamp(48px, 6vw, 96px); }
.lp-oc .container { max-width: var(--container-max); }
.lp-oc__head { max-width: 1040px; margin: 0 auto clamp(32px, 4vw, 56px); text-align: center; }
.lp-oc__en {
	display: block;
	font-family: var(--font-en);
	font-size: 13px;
	letter-spacing: 0.24em;
	color: var(--color-fg-mute);
	margin: 0 0 14px;
}
.lp-oc__title {
	font-size: 40px; /* client 2026-07-08 #4681/#4682 (was clamp 22-36) */
	line-height: 1.55;
	letter-spacing: 0.06em;
	font-weight: 700;
	color: var(--color-fg);
	margin: 0;
}
.lp-oc__lead {
	font-size: 16px; /* #6309 全ページ 15.1->16 */
	line-height: 2;
	letter-spacing: 0.04em;
	color: var(--color-fg-mute);
	margin: 18px 0 0;
}

/* ③c 研修・ワークショップ一覧（events_grouped）: グループ見出し＋events-grid流用。
   events-grid / event-card 本体は main.css の既存CSSに依存。ここは lp-oc--events
   スコープ内のグループ余白と見出しのみ（他ページ非影響）。 */
.lp-oc--events .lp-oc-events__group {
	margin-top: clamp(56px, 6vw, 88px);
}
.lp-oc--events .lp-oc-events__group:first-of-type {
	margin-top: clamp(40px, 4vw, 64px);
}
.lp-oc--events .lp-oc-events__grouptitle {
	font-size: clamp(19px, 1.6vw, 23px);
	font-weight: 700;
	letter-spacing: 0.06em;
	color: var(--color-fg);
	margin: 0 0 30px; /* client 2026-07-11 #5042: 43.1->30 */
	padding-bottom: 16px;
	border-bottom: 0; /* client 2026-07-11 #5042: 下線を外す */
}

/* ② こんな状態に */
.lp-oc__problems {
	list-style: none;
	margin: 0 auto;
	padding: 0;
	max-width: none;
	display: grid;
	gap: 12px;
}
.lp-oc__problem {
	position: relative;
	border: 1px solid var(--color-line);
	border-radius: 12px;
	background: var(--color-bg);
	padding: 18px 22px 18px 48px;
	font-size: clamp(14px, 1.05vw, 16px);
	line-height: 1.85;
	letter-spacing: 0.03em;
	color: var(--color-fg-soft);
}
.lp-oc__problem::before {
	content: "";
	position: absolute;
	left: 22px;
	top: 50%;
	width: 8px;
	height: 8px;
	margin-top: -4px;
	border-radius: 999px;
	background: var(--color-fg-mute);
}
.lp-oc__closing {
	max-width: 1040px;
	margin: clamp(24px, 3vw, 36px) auto 0;
	font-size: clamp(14px, 1.05vw, 16px);
	line-height: 2;
	letter-spacing: 0.04em;
	color: var(--color-fg-soft);
	text-align: center;
}

/* ③ 提供する内容（内包カード・リンクなし） */
.lp-oc__cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	gap: clamp(16px, 2vw, 24px);
	max-width: none;
	margin: 0 auto;
}
.lp-oc__card {
	border: 1px solid var(--color-line);
	border-radius: 14px;
	background: var(--color-bg);
	padding: clamp(24px, 2.6vw, 34px);
}
.lp-oc__card-num {
	display: block;
	font-family: var(--font-en);
	font-size: 21px;
	letter-spacing: 0.04em;
	color: var(--color-fg-mute);
	margin: 0 0 14px;
}
.lp-oc__card-title {
	font-size: clamp(17px, 1.5vw, 21px);
	letter-spacing: 0.06em;
	font-weight: 700;
	color: var(--color-fg);
	margin: 0 0 12px;
}
.lp-oc__card-text {
	font-size: 14.5px;
	line-height: 1.95;
	letter-spacing: 0.03em;
	color: var(--color-fg-soft);
	margin: 0;
}

/* ④ 進め方 */
.lp-oc__flow {
	list-style: none;
	margin: 0 auto;
	padding: 0;
	max-width: none;
	display: grid;
	gap: 4px;
}
.lp-oc__flow-item {
	display: grid;
	grid-template-columns: 64px 1fr;
	align-items: center;
	gap: 20px;
	padding: 20px 4px;
	border-bottom: 1px solid var(--color-line);
}
.lp-oc__flow-item:last-child { border-bottom: 0; }
.lp-oc__flow-num {
	font-family: var(--font-en);
	font-size: clamp(25px, 3vw, 35px);
	line-height: 1;
	letter-spacing: 0.02em;
	color: var(--color-fg-mute);
	font-weight: 500;
}
.lp-oc__flow-text {
	font-size: clamp(15px, 1.1vw, 17px);
	line-height: 1.8;
	letter-spacing: 0.04em;
	color: var(--color-fg);
}

/* ⑥ 無料相談へ */
.lp-oc--cta .container { max-width: 820px; }
.lp-oc__final { text-align: center; }
.lp-oc__final-title {
	font-size: clamp(23px, 2.6vw, 40px);
	line-height: 1.55;
	letter-spacing: 0.06em;
	font-weight: 700;
	color: var(--color-fg);
	margin: 0 0 15px;
}
.lp-oc__final-text {
	font-size: clamp(14px, 1.05vw, 16px);
	line-height: 2;
	letter-spacing: 0.04em;
	color: var(--color-fg-soft);
	margin: 0 auto 40px;
	max-width: 640px;
}
.lp-oc__final-support {
	font-size: 13.5px;
	line-height: 1.95;
	letter-spacing: 0.03em;
	color: var(--color-fg-mute);
	margin: 0 auto 28px;
	max-width: 640px;
}
.lp-oc__final-cta {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px;
}
@media (max-width: 768px) {
	.lp-oc__cards { grid-template-columns: 1fr; }
	.lp-oc__flow-item { grid-template-columns: 48px 1fr; gap: 14px; }
}

/* =============================================================== */
/* SERVICE トップ: 4本柱＋tone の入口カード（.srv-pillars）          */
/* 1ページ完結LPへの入口。旧カテゴリ別カルーセル羅列を置き換え。      */
/* 既存変数駆動＝白ベーステーマ追従。新規クラスのみ＝他ページ非影響。 */
/* 戻すには page-service.php を旧版へ戻し、この節を削除するだけ。      */
/* =============================================================== */
.srv-pillars {
	padding-top: 40px;
}
.srv-pillars__head {
	margin-bottom: 44px;
}
.srv-pillars__en {
	display: block;
	font-family: var(--font-en);
	font-size: 25px; /* websupport #4643 (12px → 24px, this element only) */
	letter-spacing: 0.16em;
	color: var(--color-fg-mute);
	margin-bottom: 12px;
}
.srv-pillars__title {
	font-size: 43px; /* websupport #4644 (30px → 42px, this element only) */
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.02em;
	color: var(--color-fg);
	margin: 0;
}
.srv-pillars__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
}
/* 5枚目（tone）は横幅いっぱいのワイドカードに */
.srv-pillars__grid > .srv-pillar:nth-child(5) {
	grid-column: 1 / -1;
}
.srv-pillar {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid var(--color-line);
	border-radius: 14px;
	background: var(--color-bg);
	text-decoration: none;
	transition: transform 0.5s var(--ease-out), box-shadow 0.5s var(--ease-out), border-color 0.5s var(--ease-out);
}
.srv-pillar:hover {
	transform: translateY(-4px);
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.08);
	border-color: var(--color-fg);
}
.srv-pillar__media {
	display: block;
	overflow: hidden;
	aspect-ratio: 16 / 9;
}
.srv-pillar__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.8s var(--ease-out);
}
.srv-pillar:hover .srv-pillar__media img {
	transform: scale(1.05);
}
.srv-pillar__body {
	display: flex;
	flex-direction: column;
	padding: 26px 28px 30px;
	flex: 1;
}
.srv-pillar__en {
	font-family: var(--font-en);
	font-size: 12.5px;
	letter-spacing: 0.14em;
	color: var(--color-fg-mute);
	margin-bottom: 10px;
}
.srv-pillar__title {
	font-size: clamp(19px, 2.2vw, 23px);
	font-weight: 700;
	letter-spacing: 0.02em;
	color: var(--color-fg);
	margin-bottom: 12px;
}
.srv-pillar__lead {
	font-size: 14.5px;
	line-height: 1.9;
	letter-spacing: 0.02em;
	color: var(--color-fg-soft);
	margin-bottom: 20px;
	flex: 1;
}
.srv-pillar__more {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var(--font-en);
	font-size: 13px;
	letter-spacing: 0.12em;
	color: var(--color-fg);
}
.srv-pillar__arrow {
	font-style: normal;
	transition: transform 0.4s var(--ease-out);
}
.srv-pillar:hover .srv-pillar__arrow {
	transform: translateX(6px);
}
@media (max-width: 768px) {
	.srv-pillars__grid {
		grid-template-columns: 1fr;
		gap: 18px;
	}
	.srv-pillars__grid > .srv-pillar:nth-child(5) {
		grid-column: auto;
	}
	.srv-pillar__body {
		padding: 22px 22px 26px;
	}
}


/* ============================================================
   全体白ベース統一（2026-07-07）
   ダーク面（フッター / プレフッターCTA / LP CTAバンド）を
   白地 × #1a1a1a 文字へ反転。色はニュートラルな薄グレーのみ。
   var(--color-deepest/deeper/deep) は他所で「濃い前景色」として
   使われるため変数は据え置き、ここで各コンポーネントの背景・文字を
   明示上書きする（source order で main.css に勝つ）。
   戻すにはこの節を丸ごと削除。
   ============================================================ */

/* --- サイトフッター --- */
.site-footer { background: #ffffff; color: #1a1a1a; border-top: 1px solid #e6e6e6; }
.site-footer__top { border-bottom-color: rgba(0, 0, 0, 0.1); }
.site-footer__logo svg text,
.site-footer__logo svg path,
.site-footer__logo svg .cls-1 { fill: #1a1a1a !important; }
.site-footer__tagline { color: rgba(26, 26, 26, 0.68); }
.site-footer__address { color: rgba(26, 26, 26, 0.55); }
.site-footer__address a { color: rgba(26, 26, 26, 0.9); }
.site-footer__sns a { color: rgba(26, 26, 26, 0.72); }
.site-footer__sns a:hover { color: #1a1a1a; }
.site-footer__col-title { color: rgba(26, 26, 26, 0.9); border-bottom-color: rgba(0, 0, 0, 0.12); }
.site-footer__col-list a { color: rgba(26, 26, 26, 0.64); }
.site-footer__col-list a:hover { color: #1a1a1a; }
.site-footer__list a { color: rgba(26, 26, 26, 0.85); }
.site-footer__copy { color: rgba(26, 26, 26, 0.48); }
.site-footer__legal a { color: rgba(26, 26, 26, 0.48); }

/* --- プレフッターCTA（.cta-block・全ページ）＝黒ベース --- */
.cta-block { background: #1a1a1a; color: #fff; }
.cta-block__text { background: #1a1a1a; }
.cta-block__text::after { color: rgba(255, 255, 255, 0.05); }
.cta-block__text-inner { color: #fff; }
.cta-block__text-inner strong { color: #fff; border-bottom-color: rgba(255, 255, 255, 0.5); }
.cta-block__main { background: #262626; color: #fff; }
.cta-block__main:hover { background: #333333; }
.cta-block__main-arrow { border-color: rgba(255, 255, 255, 0.5); color: #fff; }
.cta-block__main:hover .cta-block__main-arrow { background: #ffffff; color: #1a1a1a; }
.cta-block__sub { background: #2f2f2f; color: #fff; }
.cta-block__sub:hover { background: #3a3a3a; }

/* --- LP CTAバンド（.lp-midcta / .lp-finalcta） --- */
.lp-midcta, .lp-finalcta { background: #ffffff; color: #1a1a1a; }
.lp-midcta__text, .lp-finalcta__text { color: rgba(26, 26, 26, 0.85); }
.lp-midcta .lp-cta, .lp-finalcta .lp-cta { border-color: #1a1a1a; color: #1a1a1a; }
.lp-midcta .lp-cta:hover, .lp-finalcta .lp-cta:hover { background: #1a1a1a; color: #ffffff; }
.lp-midcta .lp-cta--primary, .lp-finalcta .lp-cta--primary { background: #1a1a1a; color: #ffffff; }
.lp-midcta .lp-cta--primary:hover, .lp-finalcta .lp-cta--primary:hover { background: #333333; }
.lp-midcta .lp-cta--sub, .lp-finalcta .lp-cta--sub { color: rgba(26, 26, 26, 0.7); }
.lp-midcta .lp-cta--sub:hover, .lp-finalcta .lp-cta--sub:hover { color: #1a1a1a; }

/* --- LP 旧ダーク帯（.lp-why）＋比較表ヘッダ：白ベース徹底 --- */
.lp-why { background: #ffffff; color: #1a1a1a; }
.lp-why .lp-section__title { color: #1a1a1a; }
.lp-why__body { color: rgba(26, 26, 26, 0.85); }
.lp-compare__table th { background: #f4f4f4; color: #1a1a1a; border-right-color: rgba(0, 0, 0, 0.08); }

/* ============================================================
   Card / thumbnail photos → 16:9 by default (client 2026-07-07).
   Only CONTENT cards & list thumbnails (works / journal / service / case /
   news). People portraits (staff / founder / member / about) and hero /
   banner / decorative figures keep their own ratios on purpose — 16:9 would
   crop faces / break wide banners. Most cards were already 16:9; these are
   the stragglers (were 4/3 or 16/10). news-feed is fixed inline above. ---- */
.works-grid__media,
.single-journal__thumb,
.srv-card__media,
.case-card__thumb,
.case-nav__thumb {
	aspect-ratio: 16 / 9;
}

/* ============================================================
   /service/ hero — text left + photo right, the photo split into 3 vertical
   panels by two thick white lines (client 2026-07-07). Scoped to
   .page-hero--split, which only exists on the Service page. ---- */
/* websupport #4642 — SERVICE eyebrow label 11px → 22px (this element only,
   i.e. the /service/ hero via .page-hero--split; PC + SP). */
.page-hero--split .page-hero__label { font-size: 15px; }

.page-hero--split .page-hero__figure {
	position: relative;
	margin: 0;
	overflow: hidden;
	border-radius: 0;
	aspect-ratio: 4 / 3;
	/* Slanted "／": top-left corner in 50px, bottom-right corner in 50px, so the
	   whole photo reads as a right-leaning parallelogram (client 2026-07-07). */
	clip-path: polygon(50px 0, 100% 0, calc(100% - 50px) 100%, 0 100%);
}
.page-hero--split .page-hero__figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
/* two white dividers, slanted parallel to the ／ edges (top +25px, bottom -25px
   = the same 50px-over-height slope) → the photo reads as three slanted panels. */
.page-hero--split .page-hero__figure::before,
.page-hero--split .page-hero__figure::after {
	content: "";
	position: absolute;
	inset: 0;
	background: #ffffff;
	z-index: 2;
}
.page-hero--split .page-hero__figure::before {
	clip-path: polygon(calc(33.333% + 19.5px) 0, calc(33.333% + 30.5px) 0, calc(33.333% - 19.5px) 100%, calc(33.333% - 30.5px) 100%);
}
.page-hero--split .page-hero__figure::after {
	clip-path: polygon(calc(66.666% + 19.5px) 0, calc(66.666% + 30.5px) 0, calc(66.666% - 19.5px) 100%, calc(66.666% - 30.5px) 100%);
}

@media (min-width: 901px) {
	.page-hero--split .page-hero__split {
		display: grid;
		grid-template-columns: minmax(0, 0.86fr) minmax(0, 1.14fr);
		align-items: center;
		gap: clamp(32px, 4vw, 72px);
	}
	.page-hero--split .page-hero__col { min-width: 0; }
}
@media (max-width: 900px) {
	.page-hero--split .page-hero__figure { margin-top: 36px; aspect-ratio: 16 / 10; }
}

/* ============================================================
   /service/ OUR SUPPORT — services shown as alternating text + photo rows
   (client 2026-07-07, ref screenshot). Big EN heading + small JP sub + lead
   + VIEW link on one side, photo on the other; photo alternates right→left.
   Replaces the old .srv-pillars__grid card layout. Neutral palette (kept in
   the site's white × black × light-grey scheme, not the ref's blue). ---- */
.srv-blocks {
	display: flex;
	flex-direction: column;
	gap: clamp(56px, 8vw, 120px);
	margin-top: clamp(48px, 6vw, 80px);
}
.srv-block-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: center;
	gap: clamp(32px, 5vw, 80px);
}
.srv-block-row--rev .srv-block-row__text   { order: 2; }
.srv-block-row--rev .srv-block-row__figure { order: 1; }
.srv-block-row__head {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 10px 18px;
	margin-bottom: clamp(18px, 2.4vw, 30px);
}
.srv-block-row__en {
	font-family: var(--font-en);
	font-size: clamp(27px, 3vw, 47px);
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.005em;
	color: #1a1a1a;
}
.srv-block-row__jp {
	font-size: 17px; /* websupport #4645 (14px → 16px, all instances / all pages) */
	font-weight: 700;
	letter-spacing: 0.1em;
	color: #8a8a8a;
}
.srv-block-row__lead {
	font-size: clamp(15px, 1vw, 16px);
	line-height: 2.1;
	letter-spacing: 0.06em;
	color: rgba(26, 26, 26, 0.78);
	margin: 0 0 clamp(24px, 3vw, 38px);
	max-width: 34em;
}
.srv-block-row__more {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-family: var(--font-en);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.12em;
	color: #1a1a1a;
}
.srv-block-row__more em { font-style: normal; transition: transform 0.3s var(--ease-out, ease); }
.srv-block-row__more:hover em { transform: translateX(6px); }
.srv-block-row__figure {
	display: block;
	margin: 0;
	overflow: hidden;
	border-radius: 0;
	aspect-ratio: 16 / 11;
}
.srv-block-row__figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.7s var(--ease-out, ease);
}
.srv-block-row__figure:hover img { transform: scale(1.03); }
@media (max-width: 900px) {
	.srv-block-row { grid-template-columns: 1fr; gap: 24px; }
	/* On SP always stack text above photo, regardless of the desktop side. */
	.srv-block-row--rev .srv-block-row__text   { order: 1; }
	.srv-block-row--rev .srv-block-row__figure { order: 2; }
	.srv-block-row__figure { aspect-ratio: 16 / 10; }
}

/* websupport #4660 — journal card title: 17px → 15px, weight 700 → 500,
   line-height 28.9px → 28px (all .journal-card__title, every page). */
.journal-card__title {
	font-size: 16px;
	font-weight: 700; /* client #5071 */
	line-height: 28px;
}

/* ============================================================
   Journal archive — KINTO-style: UNIFORM image HEIGHT, VARYING WIDTH, and
   always 2 or 3 cards across — never 1 (client 2026-07-07, revised).
   Deterministic rows: a repeating unit of 5 cards makes a row of 2 (58/42)
   then a row of 3 (38.5/33.5/28). Fixed widths (flex 0 0) so rows break
   exactly there; widths vary within each row; images share one height (--jh).
   Only .journal-grid--archive changes; the front-page preview (.journal-grid)
   keeps its regular grid. Fonts + colours untouched. ---- */
.journal-grid--archive {
	--jh: 420px; /* uniform card image height (taller, ~ref site) */
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 44px 20px;
	margin-top: var(--space-block);
}
.journal-grid--archive .journal-card { margin: 0; }
.journal-grid--archive .journal-card__media {
	height: var(--jh);
	aspect-ratio: auto;
	margin-bottom: 16px;
}
.journal-grid--archive .journal-card__media img { width: 100%; height: 100%; object-fit: cover; }
@media (min-width: 901px) {
	/* desktop: alternate a 2-card row (58/42) and a 3-card row (38.5/33.5/28) */
	.journal-grid--archive .journal-card:nth-child(5n+1) { flex: 0 0 calc(58% - 10px); }
	.journal-grid--archive .journal-card:nth-child(5n+2) { flex: 0 0 calc(42% - 10px); }
	.journal-grid--archive .journal-card:nth-child(5n+3) { flex: 0 0 calc(38.5% - 14px); }
	.journal-grid--archive .journal-card:nth-child(5n+4) { flex: 0 0 calc(33.5% - 14px); }
	.journal-grid--archive .journal-card:nth-child(5n+5) { flex: 0 0 calc(28% - 14px); }
}
@media (max-width: 900px) {
	/* tablet + phone: ALWAYS 2 columns (never 1); widths alternate for variety */
	.journal-grid--archive { --jh: 300px; gap: 32px 16px; }
	.journal-grid--archive .journal-card:nth-child(4n+1) { flex: 0 0 calc(56% - 8px); }
	.journal-grid--archive .journal-card:nth-child(4n+2) { flex: 0 0 calc(44% - 8px); }
	.journal-grid--archive .journal-card:nth-child(4n+3) { flex: 0 0 calc(46% - 8px); }
	.journal-grid--archive .journal-card:nth-child(4n)   { flex: 0 0 calc(54% - 8px); }
}
@media (max-width: 600px) {
	.journal-grid--archive { --jh: 210px; }
}

/* ============================================================
   /service/corporate/ — "よくある組織課題" as a 2-column split: photo on the
   left, a Case-card list on the right (client 2026-07-07, ref screenshot).
   Scoped to .lp-oc--problem-split (corporate LP only). Neutral palette. ---- */
.lp-oc--problem-split .lp-problem-split {
	display: grid;
	grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
	gap: clamp(28px, 4vw, 64px);
	align-items: stretch;
	margin-top: clamp(32px, 4vw, 56px);
}
.lp-oc--problem-split .lp-problem-split__media {
	margin: 0;
	overflow: hidden;
	min-height: 320px;
}
.lp-oc--problem-split .lp-problem-split__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lp-problem-cases {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr)); /* 2列（client 2026-07-07） */
	gap: 12px;
}
.lp-problem-case {
	position: relative;
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: center;
	gap: clamp(15px, 1.7vw, 24px);
	background: #f4f4f4;
	padding: clamp(20px, 2.2vw, 28px) clamp(18px, 2.2vw, 28px);
}
/* left accent line = ~30% of the card height, vertically centred (client 2026-07-07) */
.lp-problem-case::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 2px;
	height: 30%;
	background: #1a1a1a;
}
.lp-problem-case__num {
	writing-mode: vertical-rl;
	font-family: var(--font-en);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.18em;
	color: rgba(26, 26, 26, 0.5);
	white-space: nowrap;
	margin: 0;
}
.lp-problem-case__title {
	font-size: clamp(17px, 1.4vw, 21px);
	font-weight: 500;
	line-height: 1.6;
	letter-spacing: 0.04em;
	color: #1a1a1a;
	margin: 0;
}
.lp-problem-case__sub {
	font-size: 14px;
	letter-spacing: 0.06em;
	color: #8a8a8a;
	margin: 10px 0 0;
}
.lp-problem-case__sub::before { content: "\21B3\00A0"; }
@media (max-width: 900px) {
	.lp-oc--problem-split .lp-problem-split { grid-template-columns: 1fr; gap: 24px; }
	.lp-oc--problem-split .lp-problem-split__media { min-height: 0; aspect-ratio: 16 / 10; }
}

/* ============================================================
   WHAT WE DO (provide) — centred heading with a short divider dash under the
   title + lead (ref screenshot), and a full-width light-grey band whose cards
   are borderless white boxes (client 2026-07-07). Scoped to .lp-oc--provide. ---- */
.lp-oc--provide { background: #f4f4f4; }
.lp-oc--provide .lp-oc__title::after {
	content: "";
	display: block;
	width: 32px;
	height: 1px;
	background: rgba(26, 26, 26, 0.4);
	margin: clamp(18px, 2vw, 26px) auto 0;
}
.lp-oc--provide .lp-oc__card {
	background: #ffffff;
	border: none;
}

/* WHAT WE DO banner — the head (WHAT WE DO + title + lead) sits on a full-width
   photo band with a dark tint and white text; the cards sit below on the grey
   section band (client 2026-07-07, ref screenshot). Scoped .lp-oc--provide-banner. */
.lp-oc--provide-banner { padding-top: 0; }
.lp-oc__banner {
	position: relative;
	padding: clamp(88px, 13vh, 150px) var(--container-pad);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
.lp-oc__banner::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(26, 26, 26, 0.46);
}
.lp-oc__banner .lp-oc__head { position: relative; z-index: 1; margin: 0 auto; }
.lp-oc__banner .lp-oc__en    { color: rgba(255, 255, 255, 0.82); }
.lp-oc__banner .lp-oc__title { color: #ffffff; }
.lp-oc__banner .lp-oc__title::after { background: rgba(255, 255, 255, 0.6); }
.lp-oc__banner .lp-oc__lead  { color: rgba(255, 255, 255, 0.88); }
.lp-oc--provide-banner > .container { padding-top: clamp(48px, 6vw, 72px); }


/* ===================================================================
   Client review 2026-07-07 (websupport #4668-4675) - LP typography &
   spacing tune. All-page / all-same-class per client note. Override
   layer; revert = delete this block. .section target applied to .lp-oc
   (the class that actually sets the section padding). #4676 pending.
   =================================================================== */
.lp-hero__eyebrow { font-size: 17px; line-height: 30px; }
.lp-hero__title   { font-size: 45px; line-height: 64px; }
.lp-hero__lead    { font-size: 17px; line-height: 30px; }
.lp-oc__en        { font-size: 15px; letter-spacing: 2px; }
.lp-problem-case__title { font-size: 19px; }
.lp-oc            { padding-bottom: 120px; }

/* ===================================================================
   Client review 2026-07-08 (websupport #4677/#4678) - page hero label &
   title tune. All-page / all-same-class per client note. Override layer.
   =================================================================== */
.page-hero__label { font-size: 15px; letter-spacing: 1px; } /* #6316 全ページ 2->1px */
.page-hero__title { font-size: 40px; line-height: 60px; letter-spacing: 2px; }

/* ===================================================================
   Hero decorative marquee (client 2026-07-08): large light-grey English
   label scrolling right->left along the hero bottom, tucked UNDER the
   photo (photo on top). Scoped to .page-hero--split (service pages).
   Tuning knob = .page-hero__marquee bottom for the ~10% overlap.
   =================================================================== */
.page-hero--split { position: relative; overflow: hidden; padding-bottom: clamp(85px, 12vh, 125px); }
.page-hero--split .page-hero__split { position: relative; z-index: 1; }
.page-hero--split .page-hero__marquee {
	position: absolute;
	left: 0;
	right: 0;
	bottom: clamp(12px, 2.5vh, 28px);
	z-index: 0;
	overflow: hidden;
	pointer-events: none;
	line-height: 1;
	white-space: nowrap;
}
.page-hero--split .page-hero__marquee span {
	display: inline-block;
	font-family: var(--font-en);
	font-weight: 700;
	font-size: clamp(65px, 10vw, 121px);
	letter-spacing: 0.04em;
	text-transform: capitalize;
	color: rgba(26, 26, 26, 0.07);
	white-space: nowrap;
	will-change: transform;
	animation: heroLabelMarquee 120s linear infinite;
}
@keyframes heroLabelMarquee {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
	.page-hero--split .page-hero__marquee span { animation: none; }
}

/* =============================================================== */
/* WHAT WE DO cards（提供する内容 .lp-oc--provide）— 1行5列。見出しは   */
/* カード右上に縦文字（横倒し回転）で差し込み、本文は上揃えで前面に、   */
/* 番号01-05は大きな極薄ゴースト数字を背面に置く（client 2026-07-08 #4690）。*/
/* 4本のサービスLP（corporate / organization-branding / communicator */
/* / design-branding）で共通の見た目に。design-branding だけ6枚なので */
/* 5+1の孤立を避けて3列（3+3）に落とす。                            */
/* =============================================================== */
.lp-oc--provide .lp-oc__cards { grid-template-columns: repeat(5, 1fr); }
.lp-oc--provide .lp-oc__card {
	position: relative;
	min-height: clamp(210px, 19vw, 290px);
	padding: clamp(24px, 2vw, 32px) clamp(20px, 1.6vw, 26px);
}
.lp-oc--provide .lp-oc__card-title {
	position: absolute;
	z-index: 1;
	/* 見出しは枠内に収める（はみ出し取りやめ・client 2026-07-08） */
	top: clamp(22px, 2.2vw, 30px);
	right: clamp(18px, 1.6vw, 24px);
	margin: 0;
	writing-mode: vertical-rl;
	text-orientation: sideways; /* 各文字を90度右（時計回り）に倒す＝縦文字（client #4690） */
	font-size: 18px;
	line-height: 1.55;
	letter-spacing: 0.14em;
	white-space: nowrap; /* 自動改行はさせず、PHP側の <br> だけで2列に */
}
/* 番号 01-05：大きな極薄ゴースト数字（本文の背面）。本文は上揃えのまま
   前面に重ねる（client 2026-07-08 追記）。 */
.lp-oc--provide .lp-oc__card-num {
	position: absolute;
	z-index: 0;
	top: calc(clamp(16px, 1.6vw, 22px) + 90px); /* client 2026-07-08：番号を下げる（+50→+90） */
	left: clamp(20px, 1.6vw, 26px);
	margin: 0;
	font-family: var(--font-en);
	font-weight: 600;
	font-size: 61px;
	line-height: 1;
	letter-spacing: 0.01em;
	color: #f4f4f4;
}
.lp-oc--provide .lp-oc__card-text {
	position: relative;
	z-index: 1;
	margin: 0;
	/* 本文は番号01-05の下から始める：上に約120pxの余白（client 2026-07-08 追記）。
	   見出しを上へ逃がしたので本文は幅いっぱいに＝右padding無し（client 2026-07-08 追記）。 */
	padding: 160px 0 0; /* client 2026-07-08：本文を +40px（120→160） */
}
/* 本文の水平中央に、上へ100pxの細い線をカード枠から飛び出させて重ねる
   （client 2026-07-08 追記）。card は overflow:visible なので上へはみ出す。 */
.lp-oc--provide .lp-oc__card-text::before {
	content: "";
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	top: -50px; /* 本文ボックス上端の 50px 上＝カード上辺を越えて飛び出す */
	width: 1px;
	height: 50px; /* client 2026-07-08 追記：100px→50px */
	background: var(--color-fg);
}
/* design-branding は6枚 → 3列（3+3） */
.lp-oc--provide-design-branding .lp-oc__cards { grid-template-columns: repeat(3, 1fr); }
.lp-oc--provide-training .lp-oc__cards { grid-template-columns: repeat(4, 1fr); } /* client 2026-07-11: 研修カードを4列で均等（左寄り解消） */
.lp-oc--provide-communicator .lp-oc__cards { grid-template-columns: repeat(3, 1fr); } /* client 2026-07-11 #5051: 5枚を3列2段に */
.lp-oc--provide-broadcast .lp-oc__cards { grid-template-columns: repeat(4, 1fr); } /* client 2026-07-11 #5063: 4枚を4列均等 */
@media (max-width: 1180px) {
	.lp-oc--provide .lp-oc__cards { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
	.lp-oc--provide .lp-oc__cards,
	.lp-oc--provide-design-branding .lp-oc__cards { grid-template-columns: 1fr; }
}

/* =================================================================== */
/* 組織コーチングの進み方＝カプセル型フロー（client 2026-07-08・添付ref）  */
/* 既存 .lp-steps を上書き：縦積み→3列カプセル。上部フローライン（起点ドット*/
/* ＋2/3へ下矢印）、アイコン(nth-child data-URI)、Step.0N、英語見出しは      */
/* head::before で注入。色/フォントは既存トークンのまま（テンプレ非改変）。 */
/* 戻すにはこのブロックを削除するだけ。                                    */
/* =================================================================== */
.lp-steps__head::before {
	content: "FLOW";
	display: block;
	font-family: var(--font-en);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.24em;
	color: var(--color-fg-mute);
	margin: 0 0 14px;
}
.lp-steps__list {
	margin: 0;
	padding: 88px 0 0;
	position: relative;
	display: grid;
	grid-template-columns: repeat(var(--steps-count, 3), 1fr);
	gap: clamp(20px, 2.5vw, 44px);
	align-items: stretch; /* client 2026-07-11: カードを実コンテンツ高さで揃える（下の余白解消） */
}
.lp-step {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 16px;
	justify-content: center; /* client 2026-07-11: 内容を上下中央に */
	padding: clamp(72px, 7vw, 112px) clamp(22px, 2vw, 38px); /* client 2026-07-11: 縦長に＝上下padding増（社長指示・上下対称のまま） */
	border: none;
	border-radius: 999px;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, rgba(26, 26, 26, 0.055) 100%);
	min-height: 300px; /* client 2026-07-11: 縦長に（社長指示） */
}
.lp-step::before {
	content: "";
	position: absolute;
	top: -21px;
	left: 50%;
	transform: translateX(-50%);
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--color-fg);
	z-index: 3;
}
.lp-step__mark {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
}
body.page-id-93 .lp-step__mark::before {
	content: "";
	display: block;
	width: 44px;
	height: 44px;
	margin: 0 0 6px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
body.page-id-93 .lp-step:nth-child(1) .lp-step__mark::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8.4666662 8.4666662' fill='%231a1a1a'%3E%3Cpath d='m1.935799.84926441c-.6381999 0-1.14308259.56948209-1.14308259 1.25625399v2.6070759c0 .6867728.50488279 1.2578043 1.14308259 1.2578043h2.9682942l1.9218464 1.6154052c.025024.021079.053335.030835.081064.031555.078333.00203.1520278-.068043.1339099-.1586791l-.3183268-1.5606281c.5341426-.1105251.9513631-.5773792.9513631-1.1854573v-2.6070759c0-.6867719-.5043659-1.25625399-1.1425659-1.25625399zm0 .26406659h4.5955849c.4799438 0 .876949.4328338.876949.9921874v2.6070759c0 .5446217-.3781462.970356-.839742.9921874-.080884.00381-.139402.078731-.1235066.1581299l.2619995 1.2753743-1.6681152-1.4019815c-.0239422-.0203635-.0543519-.0315382-.0857828-.0315227h-3.0173868c-.479944 0-.876949-.4328327-.876949-.9921874v-2.6070759c0-.5593536.3970052-.9921873.876949-.9921874zm.9901204 1.6500284c-.073467-.0002876-.133096.059341-.1328084.1328084-.0002876.073467.059341.133096.1328084.1328084h2.665987c.0734669.0002877.1330961-.0593415.1328085-.1328084.0002876-.0734669-.0593416-.1330961-.1328085-.1328084zm0 1.05885c-.073467-.0002876-.133096.059341-.1328084.1328084.0008508.072658.060146.1310303.1328084.1307414h2.665987c.072663.000289.1319577-.058083.1328085-.1307414.0002876-.073467-.059342-.1330961-.1328085-.1328084z'/%3E%3C/svg%3E"); }
body.page-id-93 .lp-step:nth-child(2) .lp-step__mark::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='%231a1a1a'%3E%3Cpath d='m473.294 109.847h-124.887v-36.146c0-7.392-3.509-14.481-9.388-18.965-1.453-1.108-9.408-6.919-23.337-12.517-5.891-2.367-12.129-4.394-18.545-6.023-4.02-1.023-8.112 1.41-9.134 5.433-1.021 4.022 1.411 8.111 5.434 9.133 5.77 1.466 11.369 3.284 16.641 5.402 12.601 5.064 19.54 10.303 19.829 10.523 2.174 1.658 3.472 4.279 3.472 7.013v36.147h-17.637v-26.896c0-2.824-1.583-5.41-4.099-6.694-9.109-4.647-28.448-12.444-55.645-12.444s-46.536 7.796-55.645 12.444c-2.516 1.284-4.099 3.869-4.099 6.694v26.897h-17.638v-36.147c0-2.733 1.297-5.355 3.473-7.013.289-.221 7.224-5.458 19.828-10.524 16.262-6.535 34.963-9.989 54.081-9.989 3.193 0 6.429.098 9.618.293 4.144.253 7.706-2.902 7.958-7.044s-2.901-7.705-7.044-7.958c-3.492-.212-7.036-.32-10.532-.32-21.02 0-41.659 3.829-59.686 11.073-13.933 5.6-21.885 11.41-23.338 12.518-5.878 4.482-9.387 11.571-9.387 18.963v36.147h-124.881c-21.343 0-38.706 17.363-38.706 38.705v105.175c0 11.07 4.667 21.461 12.858 28.803v159.618c0 21.342 17.363 38.705 38.705 38.705h296.912c4.151 0 7.515-3.365 7.515-7.515s-3.364-7.515-7.515-7.515h-296.911c-13.055 0-23.676-10.621-23.676-23.676v-148.443c10.891 7.209 25.716 15.47 45.143 23.274 3.848 1.545 8.227-.32 9.775-4.172 1.547-3.851-.322-8.227-4.172-9.774-27.523-11.055-45.03-22.925-54.87-30.937-5.551-4.518-8.734-11.213-8.734-18.367v-105.176c0-13.055 10.621-23.676 23.676-23.676h434.589c13.055 0 23.676 10.621 23.676 23.676v105.175c0 7.154-3.183 13.849-8.734 18.367-11.237 9.148-31.444 22.541-63.9 34.397-37.31 13.628-81.561 21.868-131.609 24.541v-17.159c0-9.877-8.035-17.912-17.911-17.912h-37.64c-9.877 0-17.912 8.035-17.912 17.912v17.17c-40.462-2.165-77.326-8.009-109.677-17.396-3.982-1.153-8.154 1.137-9.311 5.123s1.137 8.154 5.123 9.311c33.665 9.768 71.943 15.815 113.865 18.007v3.534c0 20.254 16.478 36.731 36.732 36.731 20.253 0 36.731-16.477 36.731-36.731v-3.531c101.618-5.293 160.433-31.776 191.384-52.357v148.414c0 13.055-10.621 23.676-23.676 23.676h-81.902c-4.151 0-7.515 3.365-7.515 7.515s3.364 7.515 7.515 7.515h81.902c21.342 0 38.705-17.363 38.705-38.705v-159.619c8.192-7.342 12.858-17.733 12.858-28.802v-105.176c.001-21.342-17.362-38.705-38.705-38.705zm-262.011-22.146c8.961-3.949 24.226-8.859 44.714-8.859s35.753 4.91 44.714 8.859v22.146h-89.429v-22.146zm66.416 261.922c0 11.967-9.735 21.702-21.702 21.702s-21.703-9.735-21.703-21.702v-35.75c0-1.59 1.294-2.883 2.883-2.883h37.64c1.589 0 2.882 1.293 2.882 2.883z'/%3E%3C/svg%3E"); }
body.page-id-93 .lp-step:nth-child(3) .lp-step__mark::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 74 74' fill='%231a1a1a'%3E%3Cpath d='m47.984 72h-26.153a1 1 0 0 1 -.984-.823l-4.708-26.154a1 1 0 0 1 .984-1.177h35.569a1 1 0 0 1 .984 1.177l-4.707 26.154a1 1 0 0 1 -.985.823zm-25.317-2h24.481l4.352-24.154h-33.181z'/%3E%3Cpath d='m55.787 45.846h-41.759a1.569 1.569 0 0 1 -1.567-1.567v-5.557a1.569 1.569 0 0 1 1.567-1.566h41.759a1.569 1.569 0 0 1 1.567 1.566v5.558a1.569 1.569 0 0 1 -1.567 1.566zm-41.326-2h40.893v-4.691h-40.893z'/%3E%3Cpath d='m35.411 39.155h-.076a1 1 0 0 1 -.922-1.072 33.813 33.813 0 0 1 1.066-6.258 34.7 34.7 0 0 1 12.472-18.684 1 1 0 0 1 1.216 1.588 32.7 32.7 0 0 0 -11.755 17.608 31.865 31.865 0 0 0 -1 5.893 1 1 0 0 1 -1.001.925z'/%3E%3Cpath d='m47.743 27.387a18.118 18.118 0 0 1 -8.456-2.473 1 1 0 0 1 -.44-.474c-.132-.3-3.2-7.362.688-13.62 3.365-5.407 10.765-8.375 21.996-8.82a.981.981 0 0 1 .744.29 1 1 0 0 1 .295.742c-.023.727-.676 17.869-9.5 22.956a10.488 10.488 0 0 1 -5.327 1.399zm-7.189-4.065c4.578 2.382 8.45 2.7 11.512.935 6.688-3.857 8.148-16.423 8.434-20.205-9.9.554-16.374 3.179-19.262 7.809-2.913 4.675-1.183 10.124-.685 11.46z'/%3E%3Cpath d='m36.445 33.084a1 1 0 0 1 -.924-.617 22.739 22.739 0 0 0 -12.577-12.416 1 1 0 1 1 .744-1.856 24.74 24.74 0 0 1 13.68 13.505 1 1 0 0 1 -.923 1.384z'/%3E%3Cpath d='m24.359 28.665a7.6 7.6 0 0 1 -1.887-.24c-7.1-1.814-10.841-13.456-11-13.951a1 1 0 0 1 .728-1.274c7.8-1.851 13.464-1.219 16.843 1.878 3.936 3.608 3.173 9.126 3.139 9.36a1 1 0 0 1 -.3.575c-2.524 2.429-5.047 3.652-7.523 3.652zm-10.611-13.765c1.045 2.783 4.3 10.33 9.222 11.585 2.277.58 4.72-.315 7.263-2.665.079-1.117.116-4.844-2.555-7.281-2.715-2.474-7.399-3.025-13.93-1.639z'/%3E%3C/svg%3E"); }
.lp-step__num {
	font-family: var(--font-en);
	font-size: 14px;
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0.1em;
	color: var(--color-fg-mute);
}
.lp-step__num::before { content: "Step."; }
.lp-step__body { width: 100%; }
.lp-step__label {
	font-size: clamp(20px, 1.7vw, 24px);
	letter-spacing: 0.08em;
	font-weight: 700;
	color: var(--color-fg);
	margin: 2px 0 16px;
}
.lp-step__text {
	font-size: 15px;
	line-height: 2;
	letter-spacing: 0.03em;
	color: var(--color-fg-soft);
	margin: 0; /* client 2026-07-11 #5052: 0 0 18 0 -> 0 */
}
.lp-step__stages {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0 0 14px;
	text-align: left;
}
.lp-stage {
	border: 1px solid var(--color-line);
	border-radius: 12px;
	padding: 12px 16px;
	gap: 5px;
	background: rgba(255, 255, 255, 0.5);
}
.lp-step__links {
	flex-direction: column;
	gap: 9px;
	align-items: center;
	margin: 6px 0 0;
}
@media (max-width: 900px) {
	.lp-steps__list { grid-template-columns: 1fr; gap: 26px; padding-top: 0; max-width: 540px; margin-inline: auto; }
	.lp-steps__list::before { display: none; }
	.lp-step::before, .lp-step::after, .lp-step .lp-step__mark::after { display: none; }
	.lp-step { min-height: auto; border-radius: 40px; padding: 40px 26px 44px; }
	.lp-step__mark { flex-direction: column; }
}

/* =================================================================== */
/* corporate 最終CTA「いまの組織に必要なのは…」＝背景写真フルブリード＋   */
/* 白文字＋ボタン横並び（client 2026-07-08）。corporate 限定スコープ＝     */
/* body.page-id-93（テンプレ非改変）。※本番でページIDが変わる場合は要調整。*/
/* 横並びは container を 820→960px に広げることで実現（既存 flex-wrap:wrap  */
/* のまま：desktopは横並び、狭い画面は自然に縦積み）。戻すにはこのブロック削除。*/
/* =================================================================== */
.lp-oc--cta-photo {
	position: relative;
	background-image: var(--cta-bg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	padding-block: clamp(96px, 13vh, 150px);
}
.lp-oc--cta-photo::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(26, 26, 26, 0.5), rgba(26, 26, 26, 0.58));
	z-index: 0;
}
.lp-oc--cta-photo > .container {
	position: relative;
	z-index: 1;
	max-width: 960px;
}
.lp-oc--cta-photo .lp-oc__final-title { color: #fff; }
.lp-oc--cta-photo .lp-oc__final-text { color: rgba(255, 255, 255, 0.92); }
.lp-oc--cta-photo .lp-oc__final-support { color: rgba(255, 255, 255, 0.78); }
.lp-oc--cta-photo .btn { --hb-line: #ffffff; --hb-on: #1a1a1a; }

.lp-steps__flow {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 88px;
	margin: 0;
	padding: 0;
	color: var(--color-fg);
	pointer-events: none;
	list-style: none;
}
.lp-steps__flow svg { display: block; width: 100%; height: 100%; }

.lp-step__cta { margin-top: 12px; }

.lp-step__cta .btn { min-width: 0; padding: 13px 22px; font-size: 14.5px; gap: 16px; }
.lp-step__cta .btn::after { width: 32px; }

/* =================================================================== */
/* SERVICE トップ (/service/) 新IA — メイン物語＋タイムライン＋5取組＋想い  */
/* page-service.php 専用の新規クラス（他ページ非影響）。既存 lp-oc__* /   */
/* .btn / トークンに追従。3年タイムラインだけ新パーツ .srv-timeline。      */
/* 戻すには page-service.php を旧版へ戻し、この節を削除するだけ。          */
/* =================================================================== */

/* メイン本文（narrow・本文16px） */
.srv-story { padding-top: clamp(56px, 7vw, 96px); }
.srv-story .container--narrow { max-width: 760px; }
.srv-story__block { margin-bottom: clamp(40px, 5vw, 64px); }
.srv-story__block:last-child { margin-bottom: 0; }
.srv-story__h {
	font-size: clamp(22px, 2.2vw, 28px);
	font-weight: 700;
	line-height: 1.55;
	letter-spacing: 0.04em;
	color: var(--color-fg);
	margin: 0 0 clamp(18px, 2vw, 26px);
	padding-left: 18px;
	border-left: 3px solid var(--color-accent, #353535);
}
.srv-story__p {
	font-size: 17px;
	line-height: 2.1;
	letter-spacing: 0.03em;
	color: var(--color-fg-soft);
	margin: 0 0 1.4em;
}
.srv-story__p:last-child { margin-bottom: 0; }
.srv-story__diag {
	margin-top: clamp(40px, 5vw, 64px);
	padding: clamp(28px, 3.4vw, 44px);
	border: 1px solid var(--color-line);
	border-radius: 16px;
	background: var(--color-bg-soft, rgba(0,0,0,0.02));
	text-align: center;
}
.srv-story__diag .srv-story__p { margin-bottom: 20px; }
.srv-story__diag-cta { display: flex; justify-content: center; }

/* 3年タイムライン */
.srv-timeline-sec { background: var(--color-bg-soft, #f4f1eb); }
.srv-timeline {
	list-style: none;
	margin: 0 auto;
	padding: 0;
	max-width: 880px;
	position: relative;
}
.srv-timeline::before {
	content: "";
	position: absolute;
	left: 92px;
	top: 12px;
	bottom: 12px;
	width: 1px;
	background: var(--color-line);
}
.srv-timeline__item {
	position: relative;
	display: grid;
	grid-template-columns: 92px 1fr;
	gap: clamp(20px, 3vw, 44px);
	padding: 0 0 clamp(34px, 4vw, 52px);
}
.srv-timeline__item:last-child { padding-bottom: 0; }
.srv-timeline__mark {
	position: relative;
	text-align: right;
	padding-right: 22px;
}
.srv-timeline__mark::after {
	content: "";
	position: absolute;
	right: -4px;
	top: 6px;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: var(--color-fg);
	z-index: 1;
}
.srv-timeline__year {
	font-family: var(--font-en);
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--color-fg);
}
.srv-timeline__tag {
	display: inline-block;
	font-size: 22px; /* client 2026-07-11 #5029: 15->18px / #6195: 19->22px */
	font-weight: 700;
	letter-spacing: 0.05em;
	color: var(--color-fg);
	margin: 0 0 12px;
}
.srv-timeline__text {
	font-size: 16px;
	line-height: 2.05;
	letter-spacing: 0.03em;
	color: var(--color-fg-soft);
	margin: 0;
}
.srv-timeline__closing {
	max-width: 880px;
	margin: clamp(32px, 4vw, 48px) auto 0;
	padding-left: clamp(20px, calc(92px + 3vw), 136px);
	font-size: 16px;
	line-height: 2;
	letter-spacing: 0.03em;
	color: var(--color-fg-mute);
}
@media (max-width: 720px) {
	.srv-timeline::before { left: 5px; }
	.srv-timeline__item { grid-template-columns: 1fr; gap: 8px; padding-left: 26px; }
	.srv-timeline__mark { text-align: left; padding-right: 0; padding-left: 0; }
	.srv-timeline__mark::after { right: auto; left: -26px; top: 8px; }
	.srv-timeline__closing { padding-left: 26px; }
}

/* ご提供のかたち */
.srv-forms {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: clamp(14px, 1.6vw, 22px);
}
.srv-form {
	border: 1px solid var(--color-line);
	border-radius: 14px;
	background: var(--color-bg);
	padding: clamp(24px, 2.6vw, 34px);
}
.srv-form__title {
	font-size: 17px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--color-fg);
	margin: 0 0 12px;
}
.srv-form__text {
	font-size: 15px;
	line-height: 1.95;
	letter-spacing: 0.02em;
	color: var(--color-fg-soft);
	margin: 0;
}
.srv-forms__cta { text-align: center; margin-top: clamp(36px, 4vw, 52px); }
.srv-forms__lead {
	font-size: 16px;
	line-height: 2;
	letter-spacing: 0.03em;
	color: var(--color-fg-soft);
	margin: 0 0 22px;
}
@media (max-width: 900px) { .srv-forms { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .srv-forms { grid-template-columns: 1fr; } }

/* 5つの取り組み */
.srv-works { display: flex; flex-direction: column; gap: clamp(14px, 1.6vw, 20px); }
.srv-work {
	display: grid;
	grid-template-columns: clamp(56px, 7vw, 96px) 1fr;
	gap: clamp(18px, 2.5vw, 40px);
	align-items: start;
	padding: clamp(26px, 3vw, 40px) clamp(24px, 3vw, 44px);
	border: 1px solid var(--color-line);
	border-radius: 16px;
	background: var(--color-bg);
	text-decoration: none;
	color: inherit;
	transition: transform 0.4s var(--ease-out), box-shadow 0.4s var(--ease-out), border-color 0.4s var(--ease-out);
}
.srv-work:hover {
	transform: translateY(-3px);
	box-shadow: 0 16px 38px rgba(0,0,0,0.07);
	border-color: var(--color-fg);
}
.srv-work__num {
	font-family: var(--font-en);
	font-size: clamp(31px, 4vw, 49px);
	font-weight: 600;
	line-height: 1;
	color: var(--color-fg-mute);
}
.srv-work__body { display: block; }
.srv-work__en {
	display: block;
	font-family: var(--font-en);
	font-size: 13px;
	letter-spacing: 0.16em;
	color: var(--color-fg-mute);
	margin: 4px 0 8px;
}
.srv-work__title {
	display: block;
	font-size: clamp(19px, 1.8vw, 23px);
	font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--color-fg);
	margin: 0 0 14px;
}
.srv-work__lead {
	display: block;
	font-size: 16px;
	line-height: 2.05;
	letter-spacing: 0.02em;
	color: var(--color-fg-soft);
	margin: 0 0 16px;
}
.srv-work__more {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var(--font-en);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.12em;
	color: var(--color-fg);
}
.srv-work__more em { font-style: normal; transition: transform 0.3s var(--ease-out, ease); }
.srv-work:hover .srv-work__more em { transform: translateX(6px); }
@media (max-width: 640px) {
	.srv-work { grid-template-columns: 1fr; gap: 6px; }
	.srv-work__num { font-size: 31px; }
}

/* 代表・中村より（想い） */
.srv-message-sec { background: var(--color-bg-soft, #f4f1eb); }
.srv-message-sec .container--narrow { max-width: 760px; }
.srv-message__p {
	font-size: 17px;
	line-height: 2.15;
	letter-spacing: 0.03em;
	color: var(--color-fg-soft);
	margin: 0 0 1.5em;
}
.srv-message__p:last-child { margin-bottom: 0; }

/* coaching 親LP: 組織向け/個人向けへの2枚リンクカード */
.lp-children {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: clamp(18px, 2.5vw, 28px);
	max-width: 960px;
	margin: 0 auto;
}
.lp-child {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid var(--color-line);
	border-radius: 16px;
	background: var(--color-bg);
	text-decoration: none;
	color: inherit;
	transition: transform 0.45s var(--ease-out), box-shadow 0.45s var(--ease-out), border-color 0.45s var(--ease-out);
}
.lp-child:hover {
	transform: translateY(-4px);
	box-shadow: 0 18px 40px rgba(0,0,0,0.08);
	border-color: var(--color-fg);
}
.lp-child__media { display: block; overflow: hidden; aspect-ratio: 16 / 9; }
.lp-child__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s var(--ease-out); }
.lp-child:hover .lp-child__media img { transform: scale(1.05); }
.lp-child__body { display: flex; flex-direction: column; padding: clamp(24px, 2.8vw, 34px); }
.lp-child__en {
	font-family: var(--font-en);
	font-size: 13px;
	letter-spacing: 0.16em;
	color: var(--color-fg-mute);
	margin: 0 0 8px;
}
.lp-child__title {
	font-size: clamp(19px, 1.8vw, 23px);
	font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--color-fg);
	margin: 0 0 12px;
}
.lp-child__text {
	font-size: 16px;
	line-height: 2.05;
	letter-spacing: 0.02em;
	color: var(--color-fg-soft);
	margin: 0 0 18px;
}
.lp-child__more {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var(--font-en);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.12em;
	color: var(--color-fg);
	margin-top: auto;
}
.lp-child__more em { font-style: normal; transition: transform 0.3s var(--ease-out, ease); }
.lp-child:hover .lp-child__more em { transform: translateX(6px); }
@media (max-width: 720px) { .lp-children { grid-template-columns: 1fr; } }

/* ============================================================
   ABOUT PAGE — service-LP 体裁へ統一（2026-07-10 改修）
   /about/（page ID4）はヒーロー以下を service LP（page-service-lp.php）
   と同じ .section / .lp-oc / .container 積みへ再構成。左スティッキー目次
   サイドバー（.concept-sidebar / .concept-wrap 2カラム）は撤去。
   見出しは lp-oc__head（EN + JA・センター）を流用し、本文ブロックは
   既存の自己完結クラス（.concept-text / .concept-img-text / .concept-img-row /
   .company-info）と MEMBER レイアウトを .about-lp スコープ内で最適化。
   すべて .about-lp スコープ。service LP 側（.lp-oc--provide 等）には非干渉。
   ============================================================ */

/* 各セクション：固定ヘッダー分のアンカーオフセット */
.about-lp__oc { scroll-margin-top: calc(var(--header-h) + 24px); }

/* 本文ブロックの読みやすい最大幅（センター寄せ・テキストは左揃え） */
.about-lp__prose {
	max-width: 860px;
	margin-inline: auto;
}
.about-lp__imgtext,
.about-lp__imgrow,
.about-lp .about-member {
	max-width: 1040px;
	margin-inline: auto;
}

/* ---- ステートメント（CONCEPT）---- */
.about-lp__statement .lp-oc__title {
	font-size: clamp(31px, 4vw, 57px);
	line-height: 1.5;
	font-weight: 700;
	letter-spacing: 0.02em;
}
.about-lp__feat {
	max-width: 1040px;
	margin: clamp(32px, 4vw, 48px) auto 0;
	aspect-ratio: 16 / 7;
	overflow: hidden;
}
.about-lp__feat img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* ---- MEMBER ---- */
.about-lp .about-member-lead {
	max-width: 760px;
	margin: 0 auto 56px;
}
.about-lp .about-member-lead p {
	font-size: 16px;
	line-height: 32px; /* #6428 38.4->32 */
	color: var(--color-fg-soft);
}
.about-lp .about-member-lead p + p { margin-top: 1.4em; }

.about-lp .about-member__row {
	display: grid;
	grid-template-columns: 300px 1fr;
	gap: 56px;
	align-items: start;
}
.about-lp .about-member__row + .about-member__row {
	margin-top: 100px; /* client 2026-07-11 #5036: 72->100 */
	padding-top: 100px; /* client 2026-07-11 #5036: 72->100 */
	border-top: 1px solid var(--color-line);
}
.about-lp .about-member__row--reverse {
	grid-template-columns: 1fr 300px;
}
.about-lp .about-member__row--reverse .about-member__fig { order: 2; }
.about-lp .about-member__row--reverse .about-member__body { order: 1; }

.about-lp .about-member__fig {
	position: sticky;
	top: calc(var(--header-h) + 24px);
	aspect-ratio: 3 / 4;
	overflow: hidden;
	background: var(--color-line);
}
.about-lp .about-member__fig img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
	display: block;
	transition: transform 0.9s ease;
}
.about-lp .about-member__fig:hover img { transform: scale(1.04); }

.about-lp .about-member__en {
	font-family: var(--font-en);
	font-size: 13px;
	letter-spacing: 0.12em;
	color: var(--color-fg-mute);
	margin-bottom: 6px;
}
.about-lp .about-member__name {
	font-size: clamp(23px, 2.4vw, 31px);
	font-weight: 500;
	letter-spacing: 0.04em;
	margin: 50px 0 10px;
}
.about-lp .about-member__role {
	font-size: 14px;
	line-height: 1.9;
	color: var(--color-fg-mute);
	padding-bottom: 24px;
	margin-bottom: 28px;
	border-bottom: 1px solid var(--color-line);
}
.about-lp .about-member__bio { margin-bottom: 32px; }
.about-lp .about-member__bio p {
	font-size: 15px;
	line-height: 30px; /* #6429 34.5->30 */
	color: var(--color-fg-soft);
}
.about-lp .about-member__bio p + p { margin-top: 1.4em; }

.about-lp .about-member__meta { margin-bottom: 32px; }
.about-lp .about-member__meta-label {
	display: block;
	font-family: var(--font-en);
	font-size: 13px;
	letter-spacing: 0.2em;
	text-transform: capitalize;
	color: var(--color-fg-mute);
	margin-bottom: 12px;
}
.about-lp .about-member__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	list-style: none;
	padding: 0;
	margin: 0;
}
.about-lp .about-member__tags li {
	font-size: 13px;
	padding: 5px 14px;
	border: 1px solid var(--color-line);
	color: var(--color-fg-soft);
}

.about-lp .about-member__link {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 14px;
	letter-spacing: 0.04em;
	color: var(--color-fg);
	text-decoration: none;
	padding-bottom: 4px;
	border-bottom: 1px solid currentColor;
	transition: gap 0.3s;
}
.about-lp .about-member__link:hover { gap: 20px; }

/* ---- COMPANY ---- */
.about-lp__company-info {
	max-width: 760px;
	margin: 0 auto;
}

/* ---- Responsive ---- */
@media (max-width: 1000px) {
	.about-lp .about-member__row,
	.about-lp .about-member__row--reverse {
		grid-template-columns: 260px 1fr;
		gap: 40px;
	}
	.about-lp .about-member__row--reverse .about-member__fig { order: 0; }
	.about-lp .about-member__row--reverse .about-member__body { order: 0; }
}
@media (max-width: 760px) {
	.about-lp .about-member__row,
	.about-lp .about-member__row--reverse {
		grid-template-columns: 1fr;
		gap: 28px;
	}
	.about-lp .about-member__fig { position: static; max-width: 260px; }
	.about-lp__imgtext { grid-template-columns: 1fr; gap: 32px; }
}

/* event一覧・お問い合わせ：works体裁ヒーロー(.case-archive__head)に固定ヘッダー分の上余白160px（worksは.case-archiveラッパー側で確保済のため除外・二重回避） */
.post-type-archive-event .case-archive__head,
.page-id-12 .case-archive__head { padding-top: 160px; }
@media (max-width: 767px) {
	.post-type-archive-event .case-archive__head,
	.page-id-12 .case-archive__head { padding-top: 120px; }
}

/* ===== websupport Site#59 コメント反映（#4863-4866・各「この要素だけ」指定） ===== */
/* #4863 /event/ フィルタ節(section.container.archive)：上80→0・下160→72・margin-bottom24 */
.post-type-archive-event #main > section.archive { padding-top: 0; padding-bottom: 72px; margin-bottom: 24px; }
/* #4864 /event/ グリッド節(section.section)：上80→0 */
.post-type-archive-event #main > section.section:not(.archive) { padding-top: 0; }
/* #4865 /contact/ 本文節(section.section)：上160→40 */
.page-id-12 #main > section.section { padding-top: 40px; }
/* #4866 /contact/ フォーム見出し(header.contact-form-wrap__head)：中央揃え */
.page-id-12 .contact-form-wrap__head { text-align: center; }

/* /about/ (page-id-4) websupport #59 (#4909-4914) -- this page only */
/* #4909/#4912/#4913/#4914: section top padding -> 0 (keep bottom) */
body.page-id-4 #lead,
body.page-id-4 #philosophy,
body.page-id-4 #background,
body.page-id-4 #member { padding-top: 0; }
/* #4910/#4911: INTRODUCTION heading letter-spacing 10.9px/4.5px -> 3px */
body.page-id-4 .about-intro__en { letter-spacing: 3px; text-indent: 3px; }
body.page-id-4 .about-intro__ja { letter-spacing: 3px; text-indent: 3px; }

/* MEMBER 2-column split (left lead / right members) 2026-07-11 */
.about-lp .about-member-split {
	display: grid;
	grid-template-columns: minmax(0, 0.62fr) minmax(0, 1fr);
	gap: clamp(36px, 5vw, 72px);
	align-items: start;
	max-width: 1040px;
	margin: clamp(32px, 4vw, 56px) auto 0;
}
.about-lp .about-member-split__lead { position: sticky; top: calc(var(--header-h) + 32px); }
.about-lp .about-member-split .about-member-lead { max-width: none; margin: 0; }
.about-lp .about-member-split .about-member { max-width: none; margin: 0; }
.about-lp .about-member-split .about-member__row,
.about-lp .about-member-split .about-member__row--reverse {
	grid-template-columns: 150px 1fr;
	gap: 26px;
}
.about-lp .about-member-split .about-member__row--reverse .about-member__fig { order: 0; }
.about-lp .about-member-split .about-member__row--reverse .about-member__body { order: 0; }
.about-lp .about-member-split .about-member__fig { position: static; }
.about-lp .about-member-split .about-member__row + .about-member__row { margin-top: 48px; padding-top: 48px; }
@media (max-width: 900px) {
	.about-lp .about-member-split { grid-template-columns: 1fr; gap: 32px; }
	.about-lp .about-member-split__lead { position: static; }
}
@media (max-width: 560px) {
	.about-lp .about-member-split .about-member__row,
	.about-lp .about-member-split .about-member__row--reverse { grid-template-columns: 1fr; gap: 14px; }
}

/* about #background = WHAT WE DO 体裁（3 realities）2026-07-11 */
.lp-oc--provide-background .lp-oc__cards { grid-template-columns: repeat(3, 1fr); max-width: 1040px; margin-inline: auto; }
.lp-oc--provide-background .lp-oc__provide-close {
	max-width: 820px;
	margin: clamp(40px, 5vw, 64px) auto 0;
	font-size: 16px;
	line-height: 30px; /* #6427 35.2->30 */
	letter-spacing: 0.04em;
	color: var(--color-fg-soft);
	text-align: center;
}
@media (max-width: 900px) {
	.lp-oc--provide-background .lp-oc__cards { grid-template-columns: 1fr; }
}

/* MEMBER heading inside left column (2026-07-11) */
.about-lp .about-member__head { margin-bottom: clamp(20px, 2.5vw, 32px); }
.about-lp .about-member__head-en { display: block; font-family: var(--font-en); font-size: 17px; letter-spacing: 0.2em; color: var(--color-fg-mute); margin-bottom: 8px; }
.about-lp .about-member__head-ja { font-size: clamp(25px, 2.6vw, 33px); font-weight: 700; letter-spacing: 0.04em; margin: 0; }

/* about #philosophy = concept cstack layout (page-id-4 scoped, 2026-07-11) */
body.page-id-4 #philosophy .cstack__label { color: rgba(26, 26, 26, 0.65); }
body.page-id-4 #philosophy .cstack__title { color: #1a1a1a; }
body.page-id-4 #philosophy .cstack__outro-text { color: #333333; }
body.page-id-4 #philosophy .cstack__outro-text strong { border-bottom-color: rgba(26, 26, 26, 0.4); }

/* Concept physics play (Matter.js falling shapes) — about #concept直下 2026-07-11 */
.cplay { position: relative; width: 100%; margin-top: -500px; padding: 0 0 100px; }
.cplay__stage { position: relative; width: 100%; max-width: none; margin: 0; height: clamp(480px, 90svh, 900px); overflow: hidden; }
.cplay__stage canvas { display: block; }

/* about #concept statement — 余白 約500px (client 2026-07-11) */
body.page-id-4 #concept { padding-top: 0; padding-bottom: 0; }
@media (max-width: 768px) { body.page-id-4 #concept { padding-top: 0; padding-bottom: 0; } }
/* websupport #59 (#4931/#4932) — /about/ this page only 2026-07-11 */
/* #4931: #background 下marginを150px */
body.page-id-4 #background { margin-bottom: 150px; }
/* #4932: メンバー写真を名前の上へ（2カラム右側で縦積み・写真上） */
.about-lp .about-member-split .about-member__row,
.about-lp .about-member-split .about-member__row--reverse { grid-template-columns: 1fr; gap: 22px; }
.about-lp .about-member-split .about-member__fig { width: clamp(150px, 42%, 200px); }

/* member lead 中央寄せ (client 2026-07-11) */
body.page-id-4 #member .about-member-lead { text-align: center; }

/* 保有資格 = POINT風タブ付きカード (client 2026-07-11) */
.about-lp .about-member__meta-block {
	position: relative;
	margin-top: 46px;
	background: #f4f4f4;
	border-radius: 0 16px 16px 16px;
	padding: clamp(28px, 3vw, 40px) clamp(22px, 2.4vw, 30px) clamp(22px, 2.4vw, 30px);
}
.about-lp .about-member__meta-label {
	position: absolute;
	left: 0;
	top: -34px;
	margin: 0;
	background: #f4f4f4;
	color: #1a1a1a;
	font-family: var(--font-en);
	font-size: 14px;
	letter-spacing: 0.12em;
	padding: 11px 24px;
	border-radius: 14px 14px 0 0;
}

/* member 追従写真を200px下げて固定 (client 2026-07-11) */
body.page-id-4 #member .about-member__fig { top: calc(var(--header-h) + 224px); }

/* ============================================================
 * /service/ タイムライン STEP風カード化＋ご提供のかたち リッチカード化（2026-07-11）
 * 旧 .srv-timeline（縦線＋ドット）と旧 .srv-form（フラット枠）を上書き。
 * 追記位置が後＝同一 specificity で後勝ち。写真は既存写真で仮置き。
 * ============================================================ */

/* --- 3年タイムライン＝STEP風カード（枠＋左YEAR/番号＋縦罫＋本文・カード間シェブロン） --- */
.srv-timeline::before { display: none; }
.srv-timeline__mark::after { display: none; }
.srv-timeline {
	display: flex;
	flex-direction: column;
	gap: 0;
	max-width: 860px;
	margin: 0 auto;
	position: static;
}
.srv-timeline__item {
	position: relative;
	display: grid;
	grid-template-columns: clamp(88px, 10vw, 128px) 1fr;
	gap: 0;
	align-items: center;
	border: 1px solid var(--color-line);
	border-radius: 16px;
	background: var(--color-bg);
	padding: clamp(24px, 3vw, 40px) clamp(24px, 3vw, 44px);
}
.srv-timeline__item:not(:last-child) {
	margin-bottom: clamp(44px, 5vw, 68px);
}
.srv-timeline__item:not(:last-child)::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: calc(-1 * (clamp(44px, 5vw, 68px) / 2) - 5px);
	width: 13px;
	height: 13px;
	border-right: 2px solid var(--color-fg-mute);
	border-bottom: 2px solid var(--color-fg-mute);
	transform: translateX(-50%) rotate(45deg);
}
.srv-timeline__mark {
	text-align: center;
	padding: 0 clamp(18px, 2.4vw, 36px) 0 0;
	border-right: 1px solid var(--color-line);
}
.srv-timeline__mark-label {
	display: block;
	font-family: var(--font-en);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.18em;
	color: var(--color-fg-mute);
}
.srv-timeline__mark-num {
	display: block;
	font-family: var(--font-en);
	font-size: clamp(41px, 4.6vw, 61px);
	font-weight: 700;
	line-height: 1;
	color: var(--color-fg);
	margin-top: 6px;
}
.srv-timeline__body {
	padding-left: clamp(24px, 3vw, 44px);
}
.srv-timeline__closing {
	max-width: 860px;
	margin: clamp(32px, 4vw, 48px) auto 0;
	padding: 0 4px;
	text-align: center;
}
@media (max-width: 720px) {
	.srv-timeline__item {
		grid-template-columns: 1fr;
		gap: 16px;
		padding: 24px;
	}
	.srv-timeline__item:not(:last-child)::after {
		bottom: calc(-1 * (clamp(44px, 5vw, 68px) / 2) - 4px);
	}
	.srv-timeline__mark {
		text-align: left;
		padding: 0 0 16px 0;
		border-right: 0;
		border-bottom: 1px solid var(--color-line);
		display: flex;
		align-items: baseline;
		gap: 12px;
	}
	.srv-timeline__mark-num { margin-top: 0; }
	.srv-timeline__body { padding-left: 0; }
}

/* --- ご提供のかたち＝POINTカード風（タブ＋画像＋縦ラベル＋見出し＋本文） --- */
.srv-forms {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: clamp(16px, 1.8vw, 28px);
	align-items: start;
}
.srv-form {
	border: 1px solid var(--color-line);
	border-radius: 18px;
	background: var(--color-bg);
	padding: 0 clamp(18px, 1.6vw, 26px) clamp(28px, 2.6vw, 36px);
	box-shadow: 0 10px 30px rgba(28, 22, 18, 0.04);
	position: relative;
	overflow: visible;
}
.srv-form__tab {
	display: block;
	font-family: var(--font-en);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.14em;
	color: var(--color-fg-mute);
	padding: clamp(18px, 2vw, 24px) 4px clamp(14px, 1.6vw, 18px);
}
.srv-form__head {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 12px;
	align-items: stretch;
}
.srv-form__media {
	margin: 0;
	overflow: hidden;
	border-radius: 8px;
	aspect-ratio: 4 / 3;
	background: var(--color-line-soft);
}
.srv-form__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.srv-form__en {
	writing-mode: vertical-rl;
	font-family: var(--font-en);
	font-size: 14px;
	letter-spacing: 0.16em;
	color: var(--color-fg-soft);
	padding-top: 2px;
	white-space: nowrap;
}
.srv-form__title {
	font-size: clamp(17px, 1.5vw, 20px);
	font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--color-fg);
	text-align: center;
	margin: clamp(20px, 2vw, 28px) 0 12px;
}
.srv-form__text {
	font-size: 15px;
	line-height: 1.95;
	letter-spacing: 0.02em;
	color: var(--color-fg-soft);
	margin: 0;
}
@media (max-width: 900px) { .srv-forms { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .srv-forms { grid-template-columns: 1fr; } }

/* ============================================================
 * /service/ websupport 反映 第2ラウンド（Site#59 #4959-4963 / 2026-07-11）
 * 後勝ち上書き。
 * ============================================================ */
/* #4959 タイムラインカードの外枠を除去（内側の縦罫・シェブロンは残す） */
.srv-timeline__item { border: 0; }
/* #4960 結び文の色を濃く */
.srv-timeline__closing { color: #1a1a1a; }

/* #4961 ご提供カードの外枠を除去（bg＋影の柔らかいカードに）
 * #4962 高さを揃える（gridはstretch・カードはflex縦）
 * #4963 TYPE タブを親ボックス上端から飛び出すフォルダタブ形状に */
.srv-forms {
	align-items: stretch;
}
.srv-form {
	border: 0;
	display: flex;
	flex-direction: column;
	position: relative;
	overflow: visible;
	margin-top: clamp(30px, 3vw, 44px);
	padding: clamp(20px, 2vw, 28px) clamp(18px, 1.6vw, 26px) clamp(28px, 2.6vw, 36px);
}
.srv-form__tab {
	position: absolute;
	left: 0;
	top: 0;
	transform: translateY(-100%);
	margin: 0;
	padding: 11px 24px 10px;
	background: var(--color-bg);
	color: #2f6b53;
	border-radius: 12px 12px 0 0;
	box-shadow: 0 -6px 16px rgba(28, 22, 18, 0.05);
	line-height: 1;
}

/* ============================================================
 * /service/ websupport 反映 第3ラウンド（Site#59 #4974-4976 / 2026-07-11）
 * ============================================================ */
/* #4974 タイムライン最終カードの下paddingを復活（旧 :last-child{padding-bottom:0} を上書き・上下対称） */
.srv-timeline__item:last-child { padding-bottom: clamp(24px, 3vw, 40px); }
/* #4975 診断CTAボックス：枠除去＋背景を白に（旧 --color-bg-soft 未定義→rgba(0,0,0,.02) を解消） */
.srv-story__diag.srv-story2__diag { border: 0; background: #ffffff; }
/* #4976 診断CTA内 p の下marginを 20→40px */
.srv-story__diag.srv-story2__diag .srv-story__p { margin-bottom: 40px; }

/* ============================================================
 * /about/ websupport 反映 第4ラウンド（Site#59 #4977-4980 / 2026-07-11・page-id-4のみ）
 * ============================================================ */
/* #4977 / #4978 メンバー情報の p:nth-of-type(2) に下margin 40px（1人目・2人目とも） */
body.page-id-4 #member > div > div:nth-of-type(3) > div:nth-of-type(1) > div > div:nth-of-type(1) > p:nth-of-type(2),
body.page-id-4 #member > div > div:nth-of-type(3) > div:nth-of-type(2) > div > div:nth-of-type(1) > p:nth-of-type(2) {
	margin-bottom: 40px;
}
/* #4979 #member 下padding 120→150 */
body.page-id-4 #member { padding-bottom: 150px; }
/* #4980 #company 上padding 160→0 */
body.page-id-4 #company { padding-top: 0; }

/* client 2026-07-11 (#5021): about #background カード本文を少し大きく 13.5px->15px */
body.page-id-4 #background .lp-oc__card-text { font-size: 16px; }


/* client 2026-07-11 (#5043): 研修一覧カードが4枚以上 → 1行横スクロール＋下に可視の線でスライド可能を示す */
.events-grid--scroll {
	display: flex;
	grid-template-columns: none;
	flex-wrap: nowrap;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x proximity;
	gap: clamp(24px, 3vw, 40px);
	padding-bottom: 20px;
	scrollbar-width: thin;
	scrollbar-color: rgba(26, 26, 26, 0.55) rgba(26, 26, 26, 0.12);
}
.events-grid--scroll > .event-card {
	flex: 0 0 clamp(260px, 30%, 320px);
	scroll-snap-align: start;
}
.events-grid--scroll::-webkit-scrollbar { height: 3px; -webkit-appearance: none; }
.events-grid--scroll::-webkit-scrollbar-track { background: rgba(26, 26, 26, 0.12); border-radius: 2px; }
.events-grid--scroll::-webkit-scrollbar-thumb { background: rgba(26, 26, 26, 0.55); border-radius: 2px; }

/* client 2026-07-11 #5045: 研修グループ上余白 86.1->60（この要素だけ） */
#prog-type-training { margin-top: 60px; }

/* ============================================================
 * Journal 詳細（1カラム・エディトリアル / tone-village magazine 体裁）2026-07-11
 * 旧 .article-layout--3col / .article-single / .article-side 系は未使用化。
 * ============================================================ */
.jnl-main { padding: calc(var(--header-h) + clamp(40px, 6vw, 88px)) 0 0; }
.jnl { max-width: 760px; margin: 0 auto; padding: 0 clamp(20px, 5vw, 24px); }
.jnl__head { margin-bottom: clamp(10px, 1.2vw, 16px); }
.jnl__meta { display: flex; align-items: center; gap: 1em; font-family: var(--font-en); font-size: 13px; letter-spacing: 0.1em; color: var(--color-fg-mute); margin: 0 0 1.1em; }
.jnl__cat { color: var(--color-fg); font-weight: 600; }
.jnl__date { font-variant-numeric: tabular-nums; }
.jnl__title { font-size: clamp(27px, 3.4vw, 43px); font-weight: 600; line-height: 1.5; letter-spacing: 0.01em; color: var(--color-fg); margin: 0; }
.jnl__credit { margin: 1.4em 0 0; display: flex; align-items: center; gap: .5em; color: var(--color-fg-mute); font-size: 15px; font-family: var(--font-en); letter-spacing: .04em; }
.jnl__credit strong { color: var(--color-fg); font-weight: 600; }
.jnl__hero { aspect-ratio: 16 / 9; overflow: hidden; background: #f2f2f2; border-radius: 6px; margin: clamp(28px, 3.5vw, 48px) 0; }
.jnl__hero img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* 本文タイポ */
.jnl__body { font-size: 17px; line-height: 2.05; color: var(--color-fg-soft); }
.jnl__body > p { margin: 0 0 1.8em; }
.jnl__body h2 { font-size: clamp(21px, 2vw, 27px); font-weight: 600; line-height: 1.5; color: var(--color-fg); margin: 2.4em 0 1em; padding-left: .7em; border-left: 3px solid var(--color-fg); }
.jnl__body h3 { font-size: 19px; font-weight: 600; color: var(--color-fg); margin: 2em 0 .8em; }
.jnl__body img, .jnl__body figure img { max-width: 100%; height: auto; border-radius: 6px; display: block; }
.jnl__body figure { margin: 2.2em 0; }
.jnl__body figcaption { font-size: 13px; color: var(--color-fg-mute); margin-top: .8em; text-align: center; }
.jnl__body blockquote { margin: 2.4em 0; padding: .4em 0 .4em 1.4em; border-left: 3px solid var(--color-line); font-size: 19px; line-height: 1.9; font-weight: 500; color: var(--color-fg); }
.jnl__body ul, .jnl__body ol { margin: 0 0 1.8em 1.4em; line-height: 2; }
.jnl__body li { margin-bottom: .4em; }
.jnl__body a { color: var(--color-fg); text-decoration: underline; text-underline-offset: 3px; }
.jnl__body strong { color: var(--color-fg); font-weight: 600; }
.jnl__body hr { border: 0; border-top: 1px solid var(--color-line); margin: 2.4em 0; }
.jnl__body > *:first-child { margin-top: 0; }

/* 著者カード */
.jnl-author { max-width: 760px; margin: clamp(40px, 5vw, 64px) auto 0; padding: 0 clamp(20px, 5vw, 24px); }
.jnl-author__inner { display: flex; gap: 1.2em; align-items: flex-start; padding: clamp(22px, 3vw, 32px); border: 1px solid var(--color-line); border-radius: 14px; }
.jnl-author__photo { width: 64px; height: 64px; flex: none; border-radius: 50%; overflow: hidden; margin: 0; }
.jnl-author__photo img { width: 100%; height: 100%; object-fit: cover; }
.jnl-author__label { font-family: var(--font-en); font-size: 12px; letter-spacing: .14em; color: var(--color-fg-mute); text-transform: capitalize; }
.jnl-author__name { font-size: 18px; font-weight: 600; margin: .3em 0 0; }
.jnl-author__role { color: var(--color-fg-mute); font-size: 14px; margin: .2em 0 .7em; }
.jnl-author__intro { color: var(--color-fg-soft); font-size: 15px; line-height: 1.9; margin: 0; }
.jnl-author__more { display: inline-block; margin-top: .8em; font-size: 14px; color: var(--color-fg); }

/* 前後記事 */
.jnl-nav { max-width: 760px; margin: clamp(36px, 4vw, 56px) auto 0; padding: clamp(24px, 3vw, 40px) clamp(20px, 5vw, 24px) 0; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: clamp(16px, 2.5vw, 40px); border-top: 1px solid var(--color-line); }
.jnl-nav__side { display: flex; flex-direction: column; gap: .4em; min-width: 0; }
.jnl-nav__prev { text-align: left; }
.jnl-nav__next { text-align: right; }
.jnl-nav__label { font-family: var(--font-en); font-size: 12px; letter-spacing: .12em; color: var(--color-fg-mute); }
.jnl-nav__prev .jnl-nav__label::before { content: "\2190\00a0"; }
.jnl-nav__next .jnl-nav__label::after { content: "\00a0\2192"; }
.jnl-nav__title { font-size: 15px; line-height: 1.5; color: var(--color-fg); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: color .3s var(--ease-out); }
.jnl-nav__side:hover .jnl-nav__title { color: var(--color-fg-mute); }
.jnl-nav__index { justify-self: center; width: 34px; height: 34px; border: 1px solid var(--color-line); border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.jnl-nav__index-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--color-fg); }

.jnl__backrow { display: flex; justify-content: center; margin-top: clamp(40px, 5vw, 72px); }

/* 関連記事 */
.jnl-related { max-width: 1080px; margin: clamp(80px, 9vw, 150px) auto 160px; padding: clamp(48px, 6vw, 88px) clamp(20px, 5vw, 24px) 0; border-top: 1px solid var(--color-line); } /* client #5106: 下margin160 */
.jnl-related__head { text-align: center; margin-bottom: clamp(32px, 4vw, 56px); }
.jnl-related__en { display: block; font-family: var(--font-en); font-size: 13px; letter-spacing: .2em; color: var(--color-fg-mute); margin-bottom: .6em; }
.jnl-related__title { font-size: clamp(21px, 2vw, 27px); font-weight: 600; }
.jnl-related__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3vw, 44px); }
.jnl-related__media { margin: 0 0 16px; aspect-ratio: 3 / 2; overflow: hidden; border-radius: 6px; background: #f2f2f2; }
.jnl-related__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s var(--ease-out); }
.jnl-related__link:hover .jnl-related__media img { transform: scale(1.04); }
.jnl-related__meta { display: flex; gap: 1em; font-family: var(--font-en); font-size: 13px; letter-spacing: .08em; color: var(--color-fg-mute); margin: 0 0 8px; }
.jnl-related__name { font-size: 17px; font-weight: 600; line-height: 1.6; color: var(--color-fg); }

@media (max-width: 768px) {
	.jnl-related__grid { grid-template-columns: 1fr; gap: 32px; }
	.jnl-nav { grid-template-columns: 1fr 1fr; }
	.jnl-nav__index { display: none; }
	.jnl-author__inner { flex-direction: column; }
}


/* client 2026-07-11 追加バッチ（#5066/5081/5087/5088/5089/5092） */
.lp-oc--provide-corporate .lp-oc__cards { grid-template-columns: repeat(3, 1fr); } /* #5066: 5枚を3列2段 */
.post-type-archive-event .journal-filter { margin-bottom: 0; } /* #5081: event一覧フィルタ下余白0 */
body.home #service { padding-bottom: 160px; } /* #5087 */
body.home #events { padding-top: 0; } /* #5088 */
body.home #events .section-heading__label { color: #1d1916; } /* #5089 */
body.home #works > .container { margin-top: 160px; } /* #5092 */

/* client 2026-07-11: Journal 一覧をトップJOURNL体裁（左CATEGORY/右row）に。archive専用の上書き */
.journal-block--archive { padding-top: calc(var(--header-h) + clamp(32px, 5vw, 64px)); }
.journal-block--archive .journal-row:nth-of-type(n+4) { display: block; } /* archiveは全件表示（フロントの3件制限を解除） */
.journal-block__cats li a.is-active { color: var(--color-fg); font-weight: 700; }
.journal-block__cat-count { color: var(--color-fg-mute); font-size: 12px; letter-spacing: .04em; }
.journal-block__pagination { margin-top: clamp(32px, 4vw, 56px); }
.journal-block__pagination .nav-links { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; align-items: center; }
.journal-block__pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 10px; border: 1px solid var(--color-line); border-radius: 8px; font-family: var(--font-en); font-size: 15px; color: var(--color-fg-soft); transition: all .25s var(--ease-out); }
.journal-block__pagination .page-numbers.current { background: var(--color-fg); color: #fff; border-color: var(--color-fg); }
.journal-block__pagination a.page-numbers:hover { border-color: var(--color-fg); color: var(--color-fg); }

/* client #5069: /faq/ 2番目section の上padding 160->40 */
body.page-id-3117 #main > section:nth-of-type(2) { padding-top: 40px; }

/* client #5098: front #concept padding 87.7->160 */
body.home #concept { padding-top: 160px; padding-bottom: 160px; }

/* client #5105: front #youtube 上padding 0 */
body.home #youtube { padding-top: 0; }

/* client #5107: tone-design lp-why 本文を中央寄せ */
.lp-why__body--prose { text-align: center; }

/* ============================================================
 * client 2026-07-11: tone-design ヒーロー写真化＋「こんな方」節をcommunicator provide型に
 * ============================================================ */
.lp-hero--photo { position: relative; background: #1a1a1a; min-height: 82vh; display: flex; align-items: center; padding: calc(var(--header-h) + clamp(48px, 8vw, 96px)) clamp(24px, 6vw, 100px) clamp(64px, 8vw, 110px); border-bottom: 0; overflow: hidden; }
.lp-hero--photo::before { content: ""; position: absolute; inset: 0; background-image: var(--hero-bg); background-size: cover; background-position: center; z-index: 0; }
.lp-hero--photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20,20,20,.55) 0%, rgba(20,20,20,.32) 45%, rgba(20,20,20,.66) 100%); z-index: 1; }
.lp-hero--photo .lp-hero__inner { position: relative; z-index: 2; }
.lp-hero--photo .lp-hero__eyebrow { color: rgba(255,255,255,.85); }
.lp-hero--photo .lp-hero__title { color: #fff; }
.lp-hero--photo .lp-hero__lead { color: rgba(255,255,255,.92); }
.lp-hero--photo .lp-hero__body { color: rgba(255,255,255,.8); }

.lp-oc--provide-tone .lp-oc__cards { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 900px) { .lp-oc--provide-tone .lp-oc__cards { grid-template-columns: 1fr; } }
.lp-oc__card-list { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 10px; }
.lp-oc__card-list li { position: relative; padding-left: 18px; font-size: 15px; line-height: 1.85; color: var(--color-fg-soft); letter-spacing: .02em; }
.lp-oc__card-list li::before { content: ""; position: absolute; left: 0; top: .72em; width: 6px; height: 6px; border-radius: 50%; background: var(--color-fg); }
/* communicator提供内容と同じカード内レイアウト：番号の下(160px)から箇条書きを開始・縦書きタイトルと被らない右余白 */
.lp-oc--provide-tone .lp-oc__card { min-height: clamp(340px, 30vw, 420px); }
.lp-oc--provide-tone .lp-oc__card-list { position: relative; z-index: 1; margin: 0; padding: 60px 36px 0 0; }
.lp-oc--provide-tone .lp-oc__card-list::before { content: ""; position: absolute; left: clamp(20px, 1.6vw, 26px); top: 108px; width: 1px; height: 44px; background: var(--color-fg); }


/* #5113/#5114: tone-design 最終CTA 見出し/補足を暗色に */
.lp-tone .lp-finalcta__title { color: #2c2e2f; }
.lp-tone .lp-finalcta__support { color: #2c2e2f; }

/* client 2026-07-11: tone-design ヒーロー微調整（#5121-5128・.lp-toneスコープ） */
.lp-tone .lp-hero { padding-left: clamp(24px, 6vw, 107px); padding-right: clamp(24px, 6vw, 107px); } /* #5121 */
.lp-tone .lp-hero__inner { padding-left: 0; padding-right: 0; } /* #5122 */
.lp-tone .lp-hero__eyebrow { font-family: "mina", serif; text-transform: lowercase; font-size: clamp(19px, 1.7vw, 25px); letter-spacing: 0.04em; transform: rotate(-5deg); transform-origin: left center; } /* #5123 小文字・筆記体・5度右上 */
.lp-tone .lp-hero__lead { margin-bottom: 20px; } /* #5125 */
.lp-tone .lp-hero__body { padding-bottom: 40px; } /* #5124 */
.lp-tone .lp-hero__cta .lp-cta { background: #fff; color: var(--color-deepest); border-color: #fff; } /* #5126/#5127 白ボタン */
.lp-tone .lp-hero__cta .lp-cta:hover { background: rgba(255,255,255,.88); color: var(--color-deepest); }
.lp-tone .lp-faq { padding-top: 0; } /* #5128 */

/* client 2026-07-11: tone-design/join 個別調整（#5129/#5130・td-page--joinスコープ） */
.td-page--join .td-section:first-of-type { padding-top: 0; } /* #5129 */
.td-page--join .td-page__hero { padding-bottom: 100px; } /* #5130 */

/* client 2026-07-11: tone-design/join 追加（#5132/5133 th白・#5135 td-lead・#5137/5138 中央寄せ） */
body.theme-tone .td-table th { background: #ffffff; } /* #5132/#5133 */
.td-page--join #apply .td-lead { font-size: 16px; line-height: 30px; text-align: center; } /* #5135 */
.td-page--join .td-form__note { text-align: center; } /* #5137 */
.td-page--join .td-form__actions { text-align: center; } /* #5138 */

/* client 2026-07-12: join td 白（#5141・全ページ） */
body.theme-tone .td-table td { background: #ffffff; }

/* client 2026-07-12: フロント スマホ調整（#5143-5155）＋ヒーローもやもや撤去・写真トリミング */
@media (max-width: 768px) {
	.hero-full__moya { display: none !important; } /* スマホのもやもや撤去 */
	/* WebGLの geo-bg 背景をスマホで無効化（iOSでグレー被り）→ 静的なライト地に置換（デスクトップの明るいフィールドと同じ見え方） */
	.front-dark .geo-bg { display: none !important; }
	.front-dark { background: #f2f2f2; }
	body.home .hero-full__bg { object-position: 30% center; } /* 女性が見切れないよう左寄りトリミング */
	body.home .hero-full__inner { font-size: 19px; line-height: 34px; } /* #5154 */
	body.home .hero-full__mina-ja { font-size: 15px; } /* #5155 */
	body.home #concept { padding-bottom: 100px; } /* #5144 */
	body.home #service { padding-top: 0; padding-bottom: 100px; } /* #5143 + #5153 */
	body.home #service .srv-cards__heading { font-size: 15px; line-height: 26px; } /* #5145 */
	body.home #service .srv-main-lead__body { margin-bottom: 20px; } /* #5146 */
	body.home #service .srv-cards__grid { grid-template-columns: 1fr; } /* #5149 1列 */
	.srv-card__ja { font-size: 17px; } /* #5147 */
	.srv-card__caption { font-size: 15px; line-height: 24px; } /* #5148 -> #6281 SP 14->15 */
	body.home #events > .container { margin-bottom: 0; padding-bottom: 100px; } /* #5150 */
	body.home #journal > .container { margin-bottom: 100px; } /* #5151 */
	body.home #youtube .yt-grid { gap: 40px; } /* #5152 */
}

/* client 2026-07-12: スマホ ヘッダーメニュー右寄せ＋サービスカード横長・確実表示 */
@media (max-width: 900px) {
	.menu-btn { margin-left: auto; } /* メニューを右端へ（ロゴ左と対称の余白＝padding左右1.2vw） */
}
@media (max-width: 768px) {
	/* サービスカードが data-anim で opacity:0 のまま出ない事象を回避＝スマホは確実に表示 */
	body.home #service .srv-card,
	body.home #service .srv-card[data-anim],
	body.home #service [data-anim="fade-up"] { opacity: 1 !important; transform: none !important; }
	/* トレーニング以降のカードを横長に（1列・ランドスケープ画像） */
	body.home #service .srv-cards__grid { grid-template-columns: 1fr; gap: 18px; }
	/* 縦長リンク(aspect 3/4.35)＋media height:100% の連鎖がスマホで潰れ画像0高さ→写真が出ない。
	   スマホは縦横比を明示して確実に画像を表示＝横長カード */
	body.home #service .srv-card__link { aspect-ratio: auto; display: block; }
	body.home #service .srv-card__media { position: relative; width: 100%; height: auto; aspect-ratio: 16 / 9; overflow: hidden; }
	body.home #service .srv-card__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
}

/* client 2026-07-12: スマホ container 左右padding 20->30（#5156-5162） */
@media (max-width: 768px) {
	body.home #events > .container { padding-left: 30px; } /* #5156 */
	body.home #works > .container,
	body.home #journal > .container,
	body.home #youtube > .container,
	body.home #news > .container { padding-left: 30px; padding-right: 30px; } /* #5157-5161 */
	.site-footer__inner { padding-left: 30px; padding-right: 30px; } /* #5162 全ページ */
}

/* ============================================================
   client 2026-07-12 第8波（websupport #5165-5192）
   ============================================================ */

/* #5165-5167 works CTA を service card の「View More ●」ボタン仕様に統一 */
#works .works-grid__case-cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--font-en);
	font-size: 13px;
	letter-spacing: 0.05em;
	color: #1a1a1a;
	margin-top: 4px;
}
#works .works-grid__case-cta i {
	width: 6px; height: 6px; border-radius: 50%;
	background: currentColor; display: block; flex: none;
}

/* #5171 footer コピーライト（全ページ・PC/SP） */
.site-footer__copy { font-size: 13px; letter-spacing: 1px; }
/* #5172 footer ナビリンク（全ページ・PC/SP） */
.site-footer__col-list li a { font-size: 13px; letter-spacing: 1px; }

/* #5169 /journal/ ページネーション余白（この要素だけ・PC/SP） */
.journal-block__pagination { margin: 0; }
/* #5170 /journal/ nav.navigation 余白（この要素だけ・PC/SP） */
.journal-block__pagination .navigation { margin: 0; }

@media (max-width: 768px) {
	/* #5173 journal サイド見出し（全ページ・SP） */
	.journal-block__side-ttl { font-size: 17px; letter-spacing: 2px; color: #1d1916; }

	/* #5174 home #journal セクション見出しの字間（この要素だけ） */
	body.home #journal .section-heading__title { letter-spacing: 2px; }

	/* #5176 lp-oc__en（全ページ） / #5180 は本ルールに包含 */
	.lp-oc__en { font-size: 16px; letter-spacing: 2px; color: #1a1a1a; }
	/* #5177 lp-oc__title（全ページ） / #5181 は本ルールに包含 */
	.lp-oc__title { font-size: 29px; line-height: 50px; }
	/* #5182 lp-oc__card-text（全ページ） */
	.lp-oc__card-text { font-size: 15px; line-height: 28px; }
	/* #5183 lp-oc__provide-close（全ページ） */
	.lp-oc__provide-close { font-size: 15px; line-height: 28px; }

	/* --- /about/ 個別調整（この要素だけ） --- */
	/* #5175 section.cplay */
	.cplay { margin-top: -300px; padding-bottom: 50px; }
	/* #5178 #philosophy 本文p（無クラス→構造で特定） */
	#philosophy > div > div:nth-of-type(2) > div:nth-of-type(2) > p:nth-of-type(1) {
		font-size: 15px; line-height: 28px; letter-spacing: 1px;
	}
	/* #5179 #philosophy .container 下余白 */
	#philosophy > .container { margin-bottom: 100px; }
	/* #5184 section#background 余白 */
	#background { margin-bottom: 100px; padding-bottom: 100px; }
	/* #5185 #member 2列目p（無クラス→構造で特定）＋手動改行解除 */
	#member > div > div:nth-of-type(2) > p { font-size: 15px; line-height: 28px; }
	#member > div > div:nth-of-type(2) > p br { display: none; }
	/* #5186,#5187 member 写真中央寄せ */
	#member > div > div:nth-of-type(3) > div:nth-of-type(1) > figure > img,
	#member > div > div:nth-of-type(3) > div:nth-of-type(2) > figure > img {
		margin-left: auto; margin-right: auto; display: block;
	}
	/* #5188,#5189 #member .container（左右padding30 / 本文14px）
	   ※元指示は「div.container 全ページ」だが container への全ページ font-size は
	     全サイトの本文に波及するため #member にスコープ（要相談ポイント） */
	#member > .container {
		padding-left: 30px; padding-right: 30px;
		font-size: 15px; line-height: 28px; letter-spacing: 2px;
	}
	/* #5190 #member 役割下p margin */
	#member > div > div:nth-of-type(3) > div:nth-of-type(1) > div > div:nth-of-type(1) > p:nth-of-type(2) {
		margin-bottom: 70px;
	}
	/* #5191 section#member 下余白 */
	#member { padding-bottom: 100px; }
	/* #5192 #company .container 左右padding30 */
	#company > .container { padding-left: 30px; padding-right: 30px; }
}

/* #5182 補足: 既存 body.page-id-4 #background .lp-oc__card-text{15px} を上書き（SP 14px） */
@media (max-width: 768px) {
	body.page-id-4 #background .lp-oc__card-text { font-size: 16px; line-height: 28px; }
}

/* client 2026-07-12: スマホのコンテンツ両サイド余白＝30px基準（社長指示・全ページ共通）
   .container は padding-inline:var(--container-pad) 制御なので変数を一括上書き */
@media (max-width: 768px) {
	:root { --container-pad: 30px; }
}

/* ============================================================
   client 2026-07-12 第8波追補（#5220-5222）
   ============================================================ */
/* #5220/#5221 SP: タブ/カテゴリを角丸ピル型セレクトに（PCは従来UIのまま） */
.snw-select-wrap { display: none; }
.journal-cat-select { display: none; }
@media (max-width: 768px) {
	.snw-tabs { display: none; }
	.journal-block__cats { display: none; }
	.snw-select-wrap { display: block; margin-bottom: 24px; }
	.snw-select,
	.journal-cat-select {
		display: block; width: 100%;
		font-family: inherit; font-size: 15px; letter-spacing: 1px;
		color: #1a1a1a; background-color: #fff;
		border: 1px solid #d8d4cd; border-radius: 999px;
		padding: 12px 44px 12px 20px;
		-webkit-appearance: none; appearance: none;
		background-image: url("data:image/svg+xml,%3Csvg xmlns=http://www.w3.org/2000/svg width=12 height=8 viewBox=0 0 12 8 fill=none%3E%3Cpath d=M1 1.5L6 6.5L11 1.5 stroke=%231a1a1a stroke-width=1.4 stroke-linecap=round stroke-linejoin=round/%3E%3C/svg%3E");
		background-repeat: no-repeat; background-position: right 18px center;
	}
}
/* #5222 PC: SERVICE 2段目(4・5枚目)を横長・幅いっぱいの2並列に */
@media (min-width: 769px) {
	body.home #service .srv-cards__grid--5 { grid-template-columns: repeat(6, 1fr); }
	body.home #service .srv-cards__grid--5 > .srv-card:nth-child(-n+3) { grid-column: span 2; }
	body.home #service .srv-cards__grid--5 > .srv-card:nth-child(n+4) { grid-column: span 3; }
	body.home #service .srv-cards__grid--5 > .srv-card:nth-child(n+4) .srv-card__link { aspect-ratio: 16 / 9; }
}

/* ============================================================
   client 2026-07-12 第8波追補2（#5239-5246）
   ============================================================ */
@media (max-width: 768px) {
	/* #5244 SP select: 右余白＋矢印を確実に表示（base64 chevron） */
	.snw-select,
	.journal-cat-select {
		padding-right: 52px;
		background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSI4IiB2aWV3Qm94PSIwIDAgMTIgOCIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTEgMS41TDYgNi41TDExIDEuNSIgc3Ryb2tlPSIjMWExYTFhIiBzdHJva2Utd2lkdGg9IjEuNCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PC9zdmc+");
		background-repeat: no-repeat;
		background-position: right 20px center;
		background-size: 12px 8px;
	}
	/* #5239 section#concept padding 160/0/100/0 → 100/0/100/0（全ページ） */
	#concept { padding: 100px 0; }
	/* #5240 concept2__heading SP 32/50（この要素だけ） */
	#concept .concept2__heading { font-size: 33px; line-height: 50px; }
	/* #5241/#5242 concept2__text p2・p3 の手動改行をSPで外す */
	#concept .concept2__text p:nth-of-type(2) br,
	#concept .concept2__text p:nth-of-type(3) br { display: none; }
	/* #5245 #works .container margin-top 160→100（この要素だけ） */
	body.home #works > .container { margin-top: 100px; }
	/* #5246 #works .works-grid gap 60→40（この要素だけ） */
	body.home #works .works-grid { gap: 40px; }
}

/* ============================================================
   client 2026-07-12 第8波追補3（#5247,5249,5250,5251） ※#5248は#5244で対応済
   ============================================================ */
@media (max-width: 768px) {
	/* #5247 journal CATEGORY見出し 下padding/border除去 */
	body.home #journal .journal-block__side-ttl { padding-bottom: 0; border-bottom-width: 0; }
	/* #5249 srv-main-lead__text 14/28 */
	#service .srv-main-lead__text { font-size: 15px; line-height: 28px; }
	/* #5250 yt-card__title 太さ700（全ページ） */
	.yt-card__title { font-weight: 700; }
	/* #5251 srv-card padding 10→0 */
	body.home #service .srv-card { padding: 0; }
}

/* ============================================================
   client 2026-07-12 第8波追補4（#5253-5273）
   ※#5266/5267/5270-5273 は既存ルールで対応済（重複ピン）
   ============================================================ */
@media (max-width: 768px) {
	/* #5253 #concept 下padゼロ（#5239更新: 100/0/0/0） */
	#concept { padding: 100px 0 0; }
	/* #5254 srv-cards__head margin-bottom 60→40 */
	body.home #service .srv-cards__head { margin-bottom: 40px; }
	/* #5255 srv-cards__grid gap 18→40 */
	body.home #service .srv-cards__grid { gap: 40px; }
	/* #5256 snw-select 右margin30（overflow回避でwidth調整） */
	#events .snw-select { width: calc(100% - 30px); margin-right: 30px; }
	/* #5257 journal-row サムネ列 200px→100px */
	body.home #journal .journal-row__link { grid-template-columns: 100px 1fr; }
	/* #5258 menu-panel__body 上pad 89.9→40 */
	.menu-panel__body { padding-top: 40px; }
	/* #5259/#5260 about-intro__panel padding 32/30/32/30（後発#5260採用） */
	#lead .about-intro__panel { padding: 32px 30px; }
	/* #5261-5264 #philosophy 2列目 全p 14/28 */
	#philosophy > div > div:nth-of-type(2) > div:nth-of-type(2) > p { font-size: 15px; line-height: 28px; }
	/* #5265 #background lp-oc__cards gap 16→40 */
	#background .lp-oc__cards { gap: 40px; }
	/* #5268 about-member__name 上margin 50→0（全ページ） */
	.about-member__name { margin-top: 0; }
	/* #5269 #member 1つ目p 行間28 */
	#member > div > div:nth-of-type(3) > div:nth-of-type(1) > div > div:nth-of-type(1) > p:nth-of-type(1) { line-height: 28px; }
}

/* ============================================================
   client 2026-07-12 第8波追補5（#5277,5278） ※#5279/5280は既存で対応済
   ============================================================ */
@media (max-width: 768px) {
	/* #5277 #concept padding 60/0/100/0（#5253更新） */
	#concept { padding: 60px 0 100px; }
	/* #5278 about-intro__panel margin -44/30/0/30 ＋ padding 32/0/0/0（#5260更新） */
	#lead .about-intro__panel { margin: -44px 30px 0; padding: 32px 0 0; }
}

/* ============================================================
   client 2026-07-12 第8波追補6（#5281-5288） ※#5284/5287は既存で対応済
   ============================================================ */
@media (max-width: 760px) {
	/* #5281/#5282 メンバー写真を水平中央に（figがmax-width:260pxで左寄せだった＝figを中央化） */
	.about-lp .about-member__fig { margin-left: auto; margin-right: auto; }
}
@media (max-width: 768px) {
	/* #5283 メンバー1 名前 50/0/10/0→0/0/10/0（#5268を個別上書き） */
	#member > div > div:nth-of-type(3) > div:nth-of-type(1) > div > h3 { margin: 0 0 10px; }
	/* #5285 メンバー2 名前 50/0/10/0→10/0/10/0 */
	#member > div > div:nth-of-type(3) > div:nth-of-type(2) > div > h3 { margin: 10px 0 10px; }
	/* #5286 メンバー2 p2 下margin40→70 */
	#member > div > div:nth-of-type(3) > div:nth-of-type(2) > div > div:nth-of-type(1) > p:nth-of-type(2) { margin-bottom: 70px; }
	/* #5288 lp-oc__banner padding 97.4/30→60/30（全ページ） */
	.lp-oc__banner { padding: 60px 30px; }
}

/* ============================================================
   client 2026-07-12 第8波追補7（#5292,5293,5298-5300）
   ※#5294/5295/5297/5301 既存対応済・#5296は#5292に包含
   ============================================================ */
@media (max-width: 768px) {
	/* #5292/#5296 lp-oc__en 下margin 14→5（全ページ） */
	.lp-oc__en { margin-bottom: 5px; }
	/* #5293 #background lp-oc__cards gap 40→60（#5265更新） */
	#background .lp-oc__cards { gap: 60px; }
	/* #5298/#5299/#5300 メンバー本文p 行間 32.2→28 */
	#member > div > div:nth-of-type(3) > div:nth-of-type(1) > div > div:nth-of-type(1) > p:nth-of-type(2),
	#member > div > div:nth-of-type(3) > div:nth-of-type(2) > div > div:nth-of-type(1) > p:nth-of-type(1),
	#member > div > div:nth-of-type(3) > div:nth-of-type(2) > div > div:nth-of-type(1) > p:nth-of-type(2) { line-height: 28px; }
}

/* client 2026-07-12 社長口頭: /about/ 図形が降ってくるギミック(.cplay=Matter.js)をスマホ非表示 */
@media (max-width: 768px) {
	.cplay { display: none; }
}

/* #5305/#5306 メンバーp2 下margin40→70 をPC/SP両方に（従来SPのみ→全幅へ） */
#member > div > div:nth-of-type(3) > div:nth-of-type(1) > div > div:nth-of-type(1) > p:nth-of-type(2),
#member > div > div:nth-of-type(3) > div:nth-of-type(2) > div > div:nth-of-type(1) > p:nth-of-type(2) { margin-bottom: 70px; }

/* ============================================================
   client 2026-07-12 第8波追補8（#5318,5319,5322） ※#5320/5321既存対応済
   ============================================================ */
@media (max-width: 768px) {
	/* #5318 about-intro__panel margin-top -44→0（#5278更新） */
	#lead .about-intro__panel { margin: 0 30px 0; }
	/* #5319 provide-close: SPは手動改行を外し自然折返し（PC側#5303/5304のbrをSPで無効化） */
	#background .lp-oc__provide-close br { display: none; }
	/* #5322 メンバー2行 上margin/padding 100→80 */
	#member > div > div:nth-of-type(3) > div:nth-of-type(2) { margin-top: 80px; padding-top: 80px; }
}

/* client 2026-07-12 第8波追補9（#5325/#5326）※#5323/5324/5327既存対応済 */
@media (max-width: 768px) {
	/* #5325/#5326 メンバー meta-block 上margin 46→70（両メンバー同一クラス） */
	.about-lp .about-member__meta-block { margin-top: 70px; }
}

/* ============================================================
   client 2026-07-12 【重要】/about/ 詳細度是正・確定版
   既存 body.page-id-4 系ルール（margin-bottom:150 等）に無印セレクタが
   負けて第8波の /about/ 調整が全滅していたため、body.page-id-4 スコープで
   上書きし直す。値は各コメントの最終指示。
   ============================================================ */
/* --- PC/SP 両方（#5305/#5306: メンバー本文p2 下margin40→70） --- */
body.page-id-4 #member .about-member__bio p:nth-of-type(2) { margin-bottom: 70px; }

@media (max-width: 768px) {
	/* #5318/#5278 about-intro__panel */
	body.page-id-4 #lead .about-intro__panel { margin: 0 30px 0; padding: 32px 0 0; }
	/* #5178/#5261-5264 philosophy 2列目 全p 14/28 */
	body.page-id-4 #philosophy > div > div:nth-of-type(2) > div:nth-of-type(2) > p { font-size: 15px; line-height: 28px; }
	/* lp-oc 共通（#5176/#5177/#5292） about内で確実に効かせる */
	body.page-id-4 .lp-oc__en { font-size: 16px; letter-spacing: 2px; color: #1a1a1a; margin-bottom: 5px; }
	body.page-id-4 .lp-oc__title { font-size: 29px; line-height: 50px; }
	/* #5184等 #background 下margin150→100 */
	body.page-id-4 #background { margin-bottom: 100px; }
	/* #5288 lp-oc__banner padding 60/30 */
	body.page-id-4 #background .lp-oc__banner { padding: 60px 30px; }
	/* #5293 lp-oc__cards gap60 */
	body.page-id-4 #background .lp-oc__cards { gap: 60px; }
	/* #5182 card-text 14/28 */
	body.page-id-4 #background .lp-oc__card-text { font-size: 16px; line-height: 28px; }
	/* #5183等 provide-close 14/28 ＋ #5319 SP手動改行を外す */
	body.page-id-4 #background .lp-oc__provide-close { font-size: 15px; line-height: 28px; }
	body.page-id-4 #background .lp-oc__provide-close br { display: none; }
	/* #5191等 #member 下padding150→100 */
	body.page-id-4 #member { padding-bottom: 100px; }
	/* #5283 メンバー1名前 0/0/10 ・ #5285 メンバー2名前 10/0/10 */
	body.page-id-4 #member > div > div:nth-of-type(3) > div:nth-of-type(1) > div > h3.about-member__name { margin: 0 0 10px; }
	body.page-id-4 #member > div > div:nth-of-type(3) > div:nth-of-type(2) > div > h3.about-member__name { margin: 10px 0 10px; }
	/* #5269/5298/5300/5299 メンバー本文p 行間28 */
	body.page-id-4 #member .about-member__bio p { line-height: 28px; }
	/* #5325/#5326 meta-block 上margin70 */
	body.page-id-4 #member .about-member__meta-block { margin-top: 70px; }
	/* #5322 メンバー2行 上margin/padding80 */
	body.page-id-4 #member > div > div:nth-of-type(3) > div:nth-of-type(2) { margin-top: 80px; padding-top: 80px; }
	/* #5281/#5282 メンバー写真 水平中央 */
	body.page-id-4 #member .about-member__fig { margin-left: auto; margin-right: auto; }
}

/* #5305/#5306 メンバーp2 下margin70：既存#4977/#4978(2724行)と同一セレクタで確実に上書き（PC/SP両方） */
body.page-id-4 #member > div > div:nth-of-type(3) > div:nth-of-type(1) > div > div:nth-of-type(1) > p:nth-of-type(2),
body.page-id-4 #member > div > div:nth-of-type(3) > div:nth-of-type(2) > div > div:nth-of-type(1) > p:nth-of-type(2) {
	margin-bottom: 70px;
}

/* ============================================================
   client 2026-07-12 第8波追補10（#5349-5362）
   /about/ 追修正＋/service/(page-id-5) 一括。詳細度負け回避で page-id スコープ。
   ============================================================ */
/* #5349 /about/ バナーeyebrowを白に戻す（about全体を#1a1a1aにしたため） */
@media (max-width: 768px) {
	body.page-id-4 #background .lp-oc__banner .lp-oc__en { color: #ffffff; }
	/* #5281/#5282 写真中央：gridアイテムなのでjustify-selfで中央化 */
	body.page-id-4 #member .about-member__fig { justify-self: center; }
}
/* #5357 /service/ srv-story__diag ブロック削除（PC/SP両方） */
body.page-id-5 #srv-story .srv-story2__diag { display: none; }
/* #5353 /service/ 目次リンクに矢印（クリック可と分かるように・PC/SP両方） */
body.page-id-5 .srv-editorial__index li a::after { content: "→"; display: inline-block; margin-left: 8px; transition: transform .2s; }
body.page-id-5 .srv-editorial__index li a:hover::after { transform: translateX(4px); }
@media (max-width: 768px) {
	/* #5350 page-hero__label 16→15 */
	body.page-id-5 .page-hero__label { font-size: 16px; }
	/* #5351 page-hero__title 34→24 / lh55→40 */
	body.page-id-5 .page-hero__title { font-size: 25px; line-height: 40px; }
	/* #5352 srv-editorial 導入p 15→14/28 */
	body.page-id-5 #main > article > section:nth-of-type(2) > div:nth-of-type(1) > div > div > p:nth-of-type(1) { font-size: 15px; line-height: 28px; }
	/* #5354 srv-story2__en 16→15 */
	body.page-id-5 .srv-story2__en { font-size: 16px; }
	/* #5355 srv-story2__h 24→22 */
	body.page-id-5 .srv-story2__h { font-size: 23px; }
	/* #5356 srv-story2 本文p 15→14/28/ls1 */
	body.page-id-5 .srv-story2__text p { font-size: 15px; line-height: 28px; letter-spacing: 1px; }
	/* #5358 srv-timeline__text 15→14/28.8 */
	body.page-id-5 .srv-timeline__text { font-size: 15px; line-height: 28.8px; }
	/* #5359 srv-timeline__closing 15→14/28 */
	body.page-id-5 .srv-timeline__closing { font-size: 15px; line-height: 28px; }
	/* #5360 srv-svc__intro 16→14/28 */
	body.page-id-5 .srv-svc__intro { font-size: 15px; line-height: 28px; }
	/* #5361 srv-svc__rows gap 56→60 */
	body.page-id-5 .srv-svc__rows { gap: 60px; }
	/* #5362 srv-svc__text 16→14/28 */
	body.page-id-5 .srv-svc__text { font-size: 15px; line-height: 28px; }
}

/* client 2026-07-12 第8波追補11（#5363-5365 header/menu・全ページ・SP） */
@media (max-width: 768px) {
	/* #5363 site-header__inner 上padding 0→15 */
	.site-header__inner { padding-top: 15px; }
	/* #5364 menu-panel__en 24.8→26 / 太さ700（.menu-panel--v2で詳細度確保） */
	.menu-panel--v2 .menu-panel__en { font-size: 27px; font-weight: 700; }
	/* #5365 menu-panel__link padding 15/4/15/10→20/4/20/10 */
	.menu-panel--v2 .menu-panel__link { padding: 20px 4px 20px 10px; }
}

/* client 2026-07-12 第8波追補12（#5366-5371 /service/ SP・page-id-5） */
@media (max-width: 768px) {
	/* #5352/#5366/#5367 srv-editorial 導入 全p 14/28 */
	body.page-id-5 #main > article > section:nth-of-type(2) > div:nth-of-type(1) > div > div > p { font-size: 15px; line-height: 28px; }
	/* #5368 #srv-timeline padding 80→100/0/100/0 */
	body.page-id-5 #srv-timeline { padding: 100px 0; }
	/* #5369/#5371 #srv-forms padding 80/0/100/0（後発#5371採用） */
	body.page-id-5 #srv-forms { padding: 80px 0 100px; }
	/* #5370 #srv-forms .srv-forms gap 16→40 */
	body.page-id-5 #srv-forms .srv-forms { gap: 40px; }
}

/* client 2026-07-13 トップSERVICE 組織ブランディング導線：左写真削除→1カラム左寄せ */
.srv-main-lead--nomedia { grid-template-columns: 1fr; }

/* ============================================================
   client 2026-07-13 第9波（#5390/5391/5392）front #concept ＋ srv-main-lead__title
   ============================================================ */
@media (max-width: 768px) {
	/* #5391（#5390と相反→後発ピン採用）front #concept padding 160/0/120/0。
	   body.home #concept が同メディア内に存在し詳細度勝ち＝同スコープで上書き。 */
	body.home #concept { padding: 100px 0 120px; }
	/* #5392 .srv-main-lead__title のSP手動改行を外し続けて表示（frontのみ使用のクラス） */
	.srv-main-lead__title br { display: none; }
}

/* ============================================================
   client 2026-07-13 第9波追補（#5393-5400）/service/ SP 微調整
   （対象クラスは page-service.php=page-id-5 のみで使用。既存SPルールが
    body.page-id-5 スコープのため同スコープで詳細度を合わせて上書き） */
@media (max-width: 768px) {
	/* #5393 目次リンク 15→14 */
	body.page-id-5 .srv-editorial__index li a { font-size: 15px; }
	/* #5394 INDEXラベル 11→18・#8a8a8a→#1a1a1a（この要素だけ） */
	body.page-id-5 .srv-editorial__index-label { font-size: 19px; color: #1a1a1a; }
	/* #5395 story2 row gap 18/20→30/20 */
	body.page-id-5 .srv-story2__row { gap: 30px 20px; }
	/* #5396 story2 見出し margin 16/0/0/0→25/0/0/0 */
	body.page-id-5 .srv-story2__h { margin: 25px 0 0; }
	/* #5397 story2 画像 下margin 0→20 */
	body.page-id-5 .srv-story2__media img { margin: 0 0 20px; }
	/* #5398 svc タイトル margin 14/0/0/0→10/0/0/0 */
	body.page-id-5 .srv-svc__title { margin: 10px 0 0; }
	/* #5399 svc 画像 下margin 0→20 */
	body.page-id-5 .srv-svc__media img { margin: 0 0 20px; }
	/* #5400 svc 本文 margin 18/0/0/0→20/0/0/0 */
	body.page-id-5 .srv-svc__text { margin: 20px 0 0; }
}

/* ============================================================
   client 2026-07-13 第9波追補2（#5401-5410）
   /service/(page-id-5) ＋ /service/training/(page-id-3220) SP
   共有クラス lp-oc__en/__title は既存が全ページ定義＝全ページ更新。
   page-hero__label/__title は既存が page-id 別チューニング＝training にスコープ。
   ============================================================ */
@media (max-width: 768px) {
	/* #5401 srv-svc rows gap 60→70（page-id-5） */
	body.page-id-5 .srv-svc__rows { gap: 70px; }
	/* #5402 #works padding 0/0/80/0→0/0/100/0（#works は front にもある id＝page-id-5 限定） */
	body.page-id-5 #works { padding: 0 0 100px; }

	/* #5404 training hero label 16/2→14/1 */
	body.page-id-3220 .page-hero__label { font-size: 15px; letter-spacing: 1px; }
	/* #5405 training hero title 34/55/2→28/50/1 */
	body.page-id-3220 .page-hero__title { font-size: 29px; line-height: 50px; letter-spacing: 1px; }
	/* #5406/#5409 lp-oc__en 15→14（全ページ・共有クラス。既存 3007 と同詳細度で後置上書き。about=page-id-4 は個別15維持） */
	.lp-oc__en { font-size: 15px; }
	/* #5407/#5410 lp-oc__title 28/50→24/40（全ページ・後発#5410採用でlhも40） */
	.lp-oc__title { font-size: 25px; line-height: 40px; }
	/* #5408 training 課題カード ol を1列に */
	body.page-id-3220 .lp-problem-cases { grid-template-columns: 1fr; }
}

/* ============================================================
   client 2026-07-13 第9波追補3（#5411-5422）/service/training/(page-id-3220) SP
   共有クラスで全サイト誤爆する .section/.events-grid/final-text改行 等は training にスコープ。
   ※#5415/#5416 は #5406/#5407 で全ページ対応済（追加不要）。
   ============================================================ */
@media (max-width: 768px) {
	/* #5411/#5417 lp-oc__lead 13→14・#8a8a8a→#1a1a1a（全ページ・共有クラス） */
	.lp-oc__lead { font-size: 16px; color: #1a1a1a; } /* #6309 SP 15->16 */
	/* #5411 lead 内の手動改行を外す（training のこのまとまり） */
	body.page-id-3220 .lp-oc__lead br { display: none; }
	/* #5412/#5414 training 各 .section padding 48/0/120/0→100/0/100/0（全サイト誤爆回避＝trainingスコープ） */
	body.page-id-3220 .section { padding: 100px 0; }
	/* #5413 lp-oc__cards gap 16→60（全ページ） */
	.lp-oc__cards { gap: 60px; }
	/* #5418 lp-oc-events__anchors 上margin 24→40（この要素＝training） */
	body.page-id-3220 .lp-oc-events__anchors { margin: 40px 0 0; }
	/* #5419 grouptitle 18→20・下padding16→0（全ページ・既存.lp-oc--eventsスコープに合わせて上書き） */
	.lp-oc--events .lp-oc-events__grouptitle { font-size: 21px; padding: 0; }
	/* #5420 events-grid padding 4/30/20/0→0/0/20/0（events一覧誤爆回避＝trainingスコープ） */
	body.page-id-3220 .events-grid { padding: 0 0 20px; }
	/* #5421 #prog-type-workshop 上margin 56→60 */
	#prog-type-workshop { margin: 60px 0 0; }
	/* #5422 training final-text の手動改行を外す（/service/の#5403 u-sp-br を消さぬようtrainingスコープ） */
	body.page-id-3220 .lp-oc__final-text br { display: none; }
}

/* ============================================================
   第9波追補4（社長指示 2026-07-13）: 追補2/3で training スコープにした
   共有クラスを、指示通り全ページへ拡張。training 側の既存スコープ規則は
   同値のため温存（training はそちらが詳細度勝ちで効き、値は同じ）。
   ※.section の page-id-12/postid-3128/single-event/archive-event 等の
     個別上書きは意図的チューニングとして温存（それらは各ページ優先）。
   ============================================================ */
@media (max-width: 768px) {
	/* #5412/#5414 全ページ .section padding 100/0/100/0 */
	.section { padding: 100px 0; }
	/* #5420 全ページ .events-grid padding 0/0/20/0 */
	.events-grid { padding: 0 0 20px; }
	/* #5404 全ページ page-hero label 14/1（--split(0,2,0)と page-id-5(0,1,1)を超える） */
	.page-hero__label,
	.page-hero--split .page-hero__label { font-size: 15px; letter-spacing: 1px; }
	/* #5405 全ページ page-hero title 28/50/1（page-id-5 の 24/40 も上書き） */
	.page-hero__title { font-size: 29px; line-height: 50px; letter-spacing: 1px; }
	body.page-id-5 .page-hero__title { font-size: 29px; line-height: 50px; letter-spacing: 1px; }
}

/* ============================================================
   第9波追補5（#5428-5430・全ページ指示）
   ============================================================ */
@media (max-width: 768px) {
	/* #5428 lp-problem-case__title 18→16・lh 28.8→30 */
	.lp-problem-case__title { font-size: 17px; line-height: 30px; }
	/* #5429 lp-problem-cases gap 12→20 */
	.lp-problem-cases { gap: 20px; }
	/* #5430 lp-oc__cards 上margin 0→60 */
	.lp-oc__cards { margin: 60px 0 0; }
}

/* ============================================================
   第9波追補6（社長指示 2026-07-13）: 各ページの CHALLENGE(lp-oc--problem) SP を
   training と統一。差は Case カードの列数のみ＝#5408 の1列を全ページへ拡張
   （gap20/カード見出し16-30/split縦積みは既に全ページ共通）。 */
@media (max-width: 768px) {
	.lp-problem-cases { grid-template-columns: 1fr; }
}

/* ============================================================
   第9波追補7（社長指示 2026-07-13）: 各サービスLPの進め方/ご利用の流れ STEP
   タイムライン上部の接続矢印(lp-steps__flow)を SP で撤去。カード縦積み時の
   他の接続線(::before/::after)は既に≤900で非表示＝矢印だけ残っていたのを揃える。 */
@media (max-width: 900px) {
	.lp-steps__flow { display: none; }
}

/* ============================================================
   第9波追補8（#5433-5460）各サービスLP SP（coaching=3222/communicator=3174/
   design-branding=95/broadcast=3221/tone-design=3108）
   ※.section 全ページ化(追補4)の反動で各ページ section3 の上padを0に戻す等を個別対応。
   ============================================================ */
@media (max-width: 768px) {
	/* --- 全ページ（共有クラス・指示 or 安全に全ページ） --- */
	/* #5437/5440/5442 lp-oc__lead 内の手動改行を全ページで外す（leadは自然折返しが自然） */
	.lp-oc__lead br { display: none; }
	/* #5438/5441/5443 lp-steps__heading 34→24（#5441=全ページ） */
	.lp-steps__heading { font-size: 25px; }
	/* #5458 a.btn 15→14（全ページ指示・土台クラス＝反動あれば個別調整） */
	.btn { font-size: 15px; }
	/* #5460 lp-faq__q 15→16・lh24→30（全ページ） */
	.lp-faq__q { font-size: 17px; line-height: 30px; }

	/* --- section3 上pad 0 化（.section全ページ化の反動・各ページこの要素だけ #5433/5436/5439/5452） --- */
	body.page-id-3222 #main > article > section:nth-of-type(3),
	body.page-id-3174 #main > article > section:nth-of-type(3),
	body.page-id-95   #main > article > section:nth-of-type(3),
	body.page-id-3108 #main > article > section:nth-of-type(3) { padding-top: 0; }

	/* --- coaching(3222) --- */
	/* #5434 lp-children gap 18→40 */
	body.page-id-3222 .lp-children { gap: 40px; }

	/* --- communicator(3174) --- */
	/* #5435 page-hero__lead の改行を外す */
	body.page-id-3174 .page-hero__lead br { display: none; }

	/* --- tone-design(3108) --- */
	/* #5444 hero eyebrow 18→28 */
	body.page-id-3108 .lp-hero__eyebrow { font-size: 29px; }
	/* #5445 hero title 44→36 */
	body.page-id-3108 .lp-hero__title { font-size: 37px; }
	/* #5446 hero lead 太さ 400→600 */
	body.page-id-3108 .lp-hero__lead { font-weight: 600; }
	/* #5447 2つ目ボタンを「入会する」と同じ枠サイズに（sub=枠なし小padを primaryと同pad+白枠に） */
	body.page-id-3108 .lp-hero__cta .lp-cta--sub { padding: 16px 28px 16px 24px; border: 1px solid #fff; }
	/* #5448 lp-why padding 40/0/100/0→100/0/100/0 */
	body.page-id-3108 .lp-why { padding: 100px 0; }
	/* #5449/5450/5451 lp-why 本文pの手動改行を外す */
	body.page-id-3108 .lp-why__body p br { display: none; }
	/* #5453 lp-oc__cards 上margin 60→0（追補5の全ページ60をこのページだけ0に） */
	body.page-id-3108 .lp-oc__cards { margin: 0; }
	/* #5454 #plans container padding 0/30/0/30→100/30/0/30 */
	body.page-id-3108 #plans > .container { padding: 100px 30px 0; }
	/* #5455 #plans lp-section__title 22→24 */
	body.page-id-3108 #plans .lp-section__title { font-size: 25px; }
	/* #5456 lp-tone-plans__lead 13→14 */
	body.page-id-3108 .lp-tone-plans__lead { font-size: 15px; }
	/* #5457 td-plans gap 16→40 */
	body.page-id-3108 .td-plans { gap: 40px; }
	/* #5459 lp-faq padding 40/40/100/40→0/0/100/0 */
	body.page-id-3108 .lp-faq { padding: 0 0 100px; }
}

/* ============================================================
   第9波追補9（#5461-5474）/flow/・/portfolio/・/journal/・記事単体・/event/ SP
   共有クラス(.section-heading/.container/.navigation)は #journal / post-type-archive-event で
   スコープ（誤爆回避）。テンプレ固有クラスはクラス単位で適用。
   ============================================================ */
@media (max-width: 768px) {
	/* #5461 /flow/ flow-wrap 両サイド余白 24.8→30（全ページ・flow固有クラス） */
	.flow-wrap { padding: 0 30px; }

	/* #5462 portfolio case-info padding 28/24→0（テンプレ固有） */
	.case-info { padding: 0; }
	/* #5463 case-info 内リンクspan 15→14 */
	.case-info a span { font-size: 15px; }

	/* #5464 /journal/ section-heading 下margin 100→60 */
	#journal .section-heading { margin: 0 0 60px; }
	/* #5465 /journal/ container 下margin 0→40 */
	#journal > .container { margin: 0 0 40px; }
	/* #5466 /journal/ pagination 下margin 0→100 */
	#journal .navigation { margin: 0 0 100px; }
	/* #5467 /journal/ 記事サムネ 横幅100px（grid列 200px→100px） */
	#journal .journal-row__link { grid-template-columns: 100px 1fr; }

	/* #5468 記事単体 jnl 両サイド余白 20.7→30 */
	.jnl { padding: 0 30px; }
	/* #5469 記事本文 p 16→14・lh32.8→28（jnl本文にスコープ。※1カラム=本来16pxだが社長指示で14px） */
	.jnl__body p { font-size: 15px; line-height: 28px; }
	/* #5470 戻るボタン home-btn__label 16→15 */
	.home-btn__label { font-size: 16px; }
	/* #5471 jnl-related 下30・左30追加（top48/right20.7維持） */
	.jnl-related { padding-bottom: 30px; padding-left: 30px; }
	/* #5472 jnl-related__grid gap 32→40 */
	.jnl-related__grid { gap: 40px; }

	/* #5473 /event/ 絞り込みselect：両サイド余白＋角丸楕円 */
	.post-type-archive-event .journal-filter-select { padding: 0 30px; }
	.post-type-archive-event .journal-filter-select select { border-radius: 999px; }
	/* #5474 /event/ pagination 下margin 100→0 */
	.post-type-archive-event .navigation { margin: 20px 0 0; }
}

/* ============================================================
   第9波追補10（#5475-5480）/event/・/news/・/news単体・/contact/ SP
   ============================================================ */
@media (max-width: 768px) {
	/* #5475 /event/ アーカイブのカードを縦1列に（SP既定は横スクロールカルーセル＝gridに戻す） */
	.post-type-archive-event .events-grid--archive {
		display: grid;
		grid-template-columns: 1fr;
		overflow: visible;
		gap: 40px; /* #6268 24→40（この要素のみ） */
		padding-right: 0;
	}
	/* SPカードが左に寄る＝横スクロール時代の max-width:320px が grid化後も効いていたため解除 */
	.post-type-archive-event .events-grid--archive > .event-card {
		max-width: none;
		flex: initial;
	}
	/* 横スクロール時代に右paddingを0にしていた名残で右端が画面に張り付くため左右対称に戻す */
	.post-type-archive-event .section > .container { padding-right: var(--container-pad); }
	/* #5474 /event/ pagination margin 20/0/100/0→20/0/0/0（既存 .post-type-archive-event nav.navigation(0,2,1) を同詳細度で上書き） */
	.post-type-archive-event nav.navigation { margin: 20px 0 0 0; }

	/* #5476 /news/ section.container padding 100/0/100/0→100/30/100/30 */
	.post-type-archive-news #main > section { padding: 100px 30px; }
	/* #5477 /news/単体 section.container margin 0→0/30/0/30 */
	.single-news #main > section { margin: 0 30px; }

	/* #5478 /contact/ #main 背景 #fff */
	body.page-id-12 #main { background-color: #ffffff; }
	/* #5479 contact-form__row 下margin 60→30（split行は別ルールで0維持。既存page-id-12スコープを同詳細度で上書き） */
	body.page-id-12 .contact-form__row { margin-bottom: 30px; }
	/* #5480 送信ボタンに矢印が無い＝他.btnと同じ→をCSSで付与（em未挿入のため） */
	body.page-id-12 .contact-form__submit-btn::after {
		content: "\2192";
		font-style: normal;
		margin-left: 12px;
		transition: transform 0.3s var(--ease-out);
	}
	body.page-id-12 .contact-form__submit-btn:hover::after { transform: translateX(3px); }
}

/* ============================================================
   第9波追補11（#5678-5696 CSS分＋口頭:お知らせ詳細/イベント一覧の右余白）
   communicator=3174 / broadcast=3221 / design-branding=95 / coaching=3222
   ============================================================ */
@media (max-width: 768px) {
	/* #5678 communicator hero title SP改行off */
	body.page-id-3174 .page-hero__title br { display: none; }
	/* #5680 communicator closing SP改行off */
	body.page-id-3174 .lp-oc__closing br { display: none; }
	/* #5684 broadcast final-text SP改行off */
	body.page-id-3221 .lp-oc__final-text br { display: none; }
	/* #5686 design-branding final-text SP改行 全off */
	body.page-id-95 .lp-oc__final-text br { display: none; }
	/* #5691/#5692 coaching 子カード本文 15→14 / lh28 */
	body.page-id-3222 .lp-child__text { font-size: 15px; line-height: 28px; }
	/* #5694 event-card schedule 14→12（全ページ） */
	.event-card__schedule { font-size: 13px; }
	/* #5695 event-card more 14→12（全ページ） */
	.event-card__more { font-size: 13px; }

	/* (口頭) お知らせ詳細 右余白＝左：追補10の margin:0 30 は width:100% で右へoverflowするため撤回し padding で対称化 */
	.single-news #main > section { margin: 0; padding-left: var(--container-pad); padding-right: var(--container-pad); }
	/* (口頭) イベント一覧 右余白＝左：gridの左右padを0にし親.container(左右30)へ委ねて対称化（追補10のpadding-right:0の名残を上書き） */
	.post-type-archive-event .events-grid--archive { padding-left: 0; padding-right: 0; }
}

/* ============================================================
   第9波追補12（#5697-5705）/contact/・/event/予約フォーム・/flow/ SP
   contact=page-id-12 / flow=page-id-11
   ============================================================ */
@media (max-width: 768px) {
	/* #5697 contact 1行目 gap 40/24→25 */
	body.page-id-12 #wpcf7-f3126-o1 > form > div:nth-of-type(1) { gap: 25px; }
	/* #5698 送信ボタン矢印：_formのspan内改行(<br>混入)を除去し .btn::after 丸矢印が復活。margin微調整を既定gapに戻す */
	body.page-id-12 .contact-form__submit-btn::after { margin-left: 0; }
	/* #5699 contact 5行目 wpcf7-form-control 下margin 40→25 */
	body.page-id-12 #wpcf7-f3126-o1 > form > div:nth-of-type(5) span.wpcf7-form-control { margin-bottom: 25px; }
	/* #5700 contact-notice__title 13→15 / 字間3.3→1 / #807a72→#1d1916 */
	body.page-id-12 .contact-notice__title { font-size: 16px; letter-spacing: 1px; color: #1d1916; }
	/* #5701 reservation__form gap 40→25（全ページ） */
	.reservation__form { gap: 25px; }
	/* #5702 contact-form__input 15→13（全ページ） */
	.contact-form__input { font-size: 14px; }
	/* #5703 contact-form__textarea 15→14（全ページ） */
	.contact-form__textarea { font-size: 15px; }
	/* #5704 flow 各ステップ padding 60/0/60/0→40/0/40/0 */
	body.page-id-11 [id^="step-"] { padding: 40px 0; }
	/* #5705 flow-section 下margin 104.9→80 */
	body.page-id-11 .flow-section { margin-bottom: 80px; }
}

/* ============================================================
   第9波追補13（#5769-5770）/privacy/(13)・/sitemap/(14) SP
   ============================================================ */
@media (max-width: 768px) {
	/* #5769 privacy article padding 100/0/100/0→0/30/100/30 */
	body.page-id-13 #main > article { padding: 0 30px 100px; }
	/* #5770 sitemap 各列見出しh2 12→16 / 字間3→1 / #807a72→#1d1916（sitemap-col固有） */
	.sitemap-col h2 { font-size: 17px; letter-spacing: 1px; color: #1d1916; }
}

/* ============================================================
   第9波追補14（#5826）/privacy/(13) article 上padding 160→0（PC/SP両方）
   ============================================================ */
body.page-id-13 #main > article { padding-top: 0; }


/* ============================================================
   第10波 tone ヒーローの2ボタンを同一サイズに（社長スクショ指示 2026-07-18）
   ============================================================ */
.lp-tone .lp-hero__cta .lp-cta { min-width: 200px; justify-content: center; }
.lp-tone .lp-hero__cta .lp-cta--sub { padding: 16px 28px 16px 24px; border: 1px solid #fff; }



/* ============================================================
   第10波 ご提供のかたち：サムネを about の「降ってくる図形」に（社長指示 2026-07-18）
   about concept-play.js の Bodies.circle / rectangle / polygon ＋
   colors ['#111111','#1f1f1f','#333333','#555555','#7e7e7e','#b0b0b0'] を踏襲。
   ============================================================ */
#srv-forms .srv-form__media {
	aspect-ratio: 1 / 1;
	background: transparent;
	border-radius: 0;
	overflow: visible;
	display: flex;
	align-items: center;
	justify-content: center;
}
#srv-forms .srv-shape {
	display: block; width: 58%; aspect-ratio: 1 / 1;
	--rot: 0deg;
	transform: rotate(var(--rot));
	animation: srv-shape-float 6.5s ease-in-out infinite;
	will-change: transform;
}
#srv-forms .srv-shape--circle   { background: #1f1f1f; border-radius: 50%; --rot: 0deg;   animation-delay: -0.2s; }
#srv-forms .srv-shape--square   { background: #333333; --rot: 12deg;  animation-delay: -1.8s; }
#srv-forms .srv-shape--triangle { background: #555555; clip-path: polygon(50% 2%, 98% 96%, 2% 96%); --rot: -8deg; animation-delay: -3.4s; }
#srv-forms .srv-shape--hexagon  { background: #7e7e7e; clip-path: polygon(25% 3%, 75% 3%, 100% 50%, 75% 97%, 25% 97%, 0 50%); --rot: 10deg; animation-delay: -5s; }
@keyframes srv-shape-float {
	0%, 100% { transform: translateY(0) rotate(var(--rot)); }
	50%      { transform: translateY(-12px) rotate(calc(var(--rot) + 7deg)); }
}
@media (prefers-reduced-motion: reduce) { #srv-forms .srv-shape { animation: none; } }


/* ============================================================
   第10波 /event/ タブ切り替え型一覧（社長指示 2026-07-18・添付準拠）
   タブ＝下線付きテキスト／カード＝画像上にカテゴリピル＋NEW、下に開催日・場所。
   すべて .post-type-archive-event スコープ（front/service の .event-card 流用に非干渉）。
   ============================================================ */
.evt-tabs {
	display: flex;
	justify-content: center;
	gap: clamp(24px, 4vw, 64px);
	margin: 0 0 clamp(40px, 5vw, 64px);
	border-bottom: 1px solid var(--color-line);
	overflow-x: auto;
	overflow-y: hidden; /* 横スクロール指定で縦もスクロール可能になり上下に揺れるのを止める */
	scrollbar-width: none;
}
.evt-tabs::-webkit-scrollbar { display: none; }
.evt-tab {
	position: relative;
	flex: none;
	padding: 0 2px 14px;
	font-size: 16px;
	letter-spacing: 0.08em;
	line-height: 1.6;
	color: var(--color-fg-mute);
	text-decoration: none;
	white-space: nowrap;
	transition: color .3s var(--ease-out);
}
.evt-tab:hover { color: var(--color-fg); }
.evt-tab.is-active { color: var(--color-fg); font-weight: 600; }
.evt-tab.is-active::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 0; /* -1px だと枠外へはみ出し縦スクロールを生むため 0 に */
	height: 2px;
	background: var(--color-fg);
}

/* ---- カード（アーカイブのみ） ---- */
.post-type-archive-event .event-card__media { position: relative; }
.post-type-archive-event .event-card__new {
	position: absolute;
	top: -14px; left: -14px;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 68px; height: 68px;
	border-radius: 50%;
	background: #9a9384;
	color: #fff;
	font-family: var(--font-en);
	font-size: 13px;
	letter-spacing: 0.1em;
}
.post-type-archive-event .event-card__badges {
	position: absolute;
	left: 16px; bottom: 16px;
	z-index: 2;
	display: flex;
	gap: 8px;
}
.post-type-archive-event .event-card__pill {
	display: inline-flex;
	align-items: center;
	padding: 7px 18px;
	border-radius: 999px;
	background: #fff;
	color: #1a1a1a;
	font-size: 13px;
	letter-spacing: 0.06em;
	line-height: 1;
}
.post-type-archive-event .event-card__info { margin: 0; }
.post-type-archive-event .event-card__info-row { display: flex; gap: 6px; margin: 0; }
.post-type-archive-event .event-card__info-row dt {
	flex: none;
	font-size: 14px;
	color: var(--color-fg-soft);
	letter-spacing: 0.04em;
}
.post-type-archive-event .event-card__info-row dd {
	margin: 0;
	font-size: 14px;
	color: var(--color-fg);
	letter-spacing: 0.04em;
	line-height: 1.7;
}
@media (max-width: 768px) {
	.evt-tabs { justify-content: flex-start; gap: 28px; }
	.post-type-archive-event .event-card__new { width: 56px; height: 56px; font-size: 12px; top: -10px; left: -10px; }
}

/* 添付準拠：カードは白パネルを持たず、画像＋テキストを地に直置き（アーカイブのみ） */
.post-type-archive-event .event-card { background: transparent; box-shadow: none; border: 0; padding: 0; }
.post-type-archive-event .event-card__body { padding: 0; }


/* ============================================================
   #6259 イベント詳細「こちらの研修・ワークショップもおすすめ」
   1行・横自動スライド（CSS marquee／トラック2重化でシームレスループ）
   ============================================================ */
.evt-rec { margin: clamp(64px, 8vw, 110px) 0 clamp(40px, 5vw, 64px); }
.evt-rec__head { text-align: center; margin: 0 0 clamp(24px, 3vw, 36px); }
.evt-rec__en {
	display: block;
	font-family: var(--font-en);
	font-size: 15px;
	letter-spacing: 2px;
	color: var(--color-fg-mute);
	margin-bottom: 10px;
}
.evt-rec__title {
	font-size: clamp(18px, 1.6vw, 22px);
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.7;
	margin: 0;
}
/* カードは横幅いっぱいに（narrowコンテナから全幅へブリードアウト） */
.evt-rec__viewport {
	overflow: hidden;
	width: 100vw;
	margin-left: calc(50% - 50vw);
}
.evt-rec__track {
	display: flex;
	gap: clamp(16px, 1.6vw, 24px);
	width: max-content;
	animation: evt-rec-scroll 46s linear infinite;
}
.evt-rec:hover .evt-rec__track,
.evt-rec__track:focus-within { animation-play-state: paused; }
@keyframes evt-rec-scroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}
.evt-rec__card {
	flex: 0 0 clamp(200px, 20vw, 260px);
	display: block;
	text-decoration: none;
	color: inherit;
}
.evt-rec__media {
	display: block;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	border-radius: 10px;
}
.evt-rec__media img {
	width: 100%; height: 100%;
	object-fit: cover; display: block;
	transition: transform .7s var(--ease-out);
}
.evt-rec__card:hover .evt-rec__media img { transform: scale(1.04); }
.evt-rec__name {
	display: block;
	margin-top: 12px;
	font-size: 15px;
	line-height: 1.75;
	letter-spacing: 0.04em;
	color: var(--color-fg);
}
.evt-rec__sch {
	display: block;
	margin-top: 4px;
	font-size: 13px;
	line-height: 1.7;
	color: var(--color-fg-soft);
}
@media (prefers-reduced-motion: reduce) {
	.evt-rec__track { animation: none; }
	.evt-rec__viewport { overflow-x: auto; }
}


/* ============================================================
   社長指示 2026-07-18（第10波・続き）
   1) /service/ INDEX を白カード化＋右端に固定追従
   3) /journal/ 一覧のサムネ幅 200→300px
   4) /service/personal/ WHAT WE DO のカードを幅いっぱいに
   5) lp-oc__card-title：SPは横書き（PCは縦組み18px）
   ============================================================ */

/* 1) 右端追従INDEX */
.srv-index {
	position: fixed;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	z-index: 30;
	width: 288px;
	pointer-events: none; /* 閉じている間は本文の操作を邪魔しない */
}
/* 右端の細いタブ（通常はこれだけ見えている） */
.srv-index__toggle {
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	pointer-events: auto;
	appearance: none;
	border: 0;
	cursor: pointer;
	background: #fff;
	border-radius: 12px 0 0 12px;
	box-shadow: -6px 0 22px rgba(28, 22, 18, 0.10);
	padding: 20px 11px;
	transition: opacity .3s var(--ease-out), transform .3s var(--ease-out);
}
.srv-index__toggle-txt {
	writing-mode: vertical-rl;
	font-family: var(--font-en);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.18em;
	color: #2f6b53;
}
.srv-index__toggle:hover { transform: translateY(-50%) translateX(-3px); }
/* スライドして開くパネル */
.srv-index__panel {
	pointer-events: none;
	width: 288px;
	background: #fff;
	border-radius: 16px 0 0 16px;
	box-shadow: -10px 0 44px rgba(28, 22, 18, 0.13);
	padding: 26px 24px 20px;
	transform: translateX(100%);
	opacity: 0;
	visibility: hidden;
	transition: transform .45s var(--ease-out), opacity .35s var(--ease-out), visibility .45s;
}
.srv-index.is-open .srv-index__panel {
	pointer-events: auto;
	transform: translateX(0);
	opacity: 1;
	visibility: visible;
}
.srv-index.is-open .srv-index__toggle { opacity: 0; pointer-events: none; }
.srv-index__label {
	display: block;
	font-family: var(--font-en);
	font-size: 14px;
	letter-spacing: 0.14em;
	color: #2f6b53;
	margin-bottom: 16px;
}
.srv-index__list { list-style: none; margin: 0; padding: 0; }
.srv-index__item + .srv-index__item { border-top: 1px solid var(--color-line); }
.srv-index__link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 0;
	text-decoration: none;
	color: inherit;
	transition: opacity .3s var(--ease-out);
}
.srv-index__link:hover { opacity: .6; }
.srv-index__en {
	display: block;
	font-family: var(--font-en);
	font-size: 19px;
	font-weight: 700;
	letter-spacing: 0.04em;
	line-height: 1.3;
	color: #1a1a1a;
}
.srv-index__ja {
	display: block;
	margin-top: 5px;
	font-size: 12.5px;
	letter-spacing: 0.04em;
	color: var(--color-fg-mute);
}
.srv-index__dot { flex: none; width: 9px; height: 9px; border-radius: 50%; background: #2f6b53; }
/* 本文と干渉する幅では出さない */
@media (max-width: 899px) { .srv-index { display: none; } }

/* 3) JOURNAL一覧のサムネ 200→300px（/journal/ アーカイブのみ・frontの#journalには非干渉） */
.journal-block--archive .journal-row__link { grid-template-columns: 300px 1fr; }

/* 4) /service/personal/ の WHAT WE DO カードを幅いっぱいに */
.lp-oc--provide-personal .lp-oc__cards {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	padding-inline: clamp(16px, 3vw, 56px);
}

/* 5) lp-oc__card-title：SPは横書き（縦組み解除・通常フローへ） */
@media (max-width: 768px) {
	.lp-oc--provide .lp-oc__card-title {
		position: static;
		writing-mode: horizontal-tb;
		text-orientation: mixed;
		white-space: normal;
		font-size: 18px;
		letter-spacing: 0.04em;
		margin: 0 0 10px;
	}
}

/* 5-SP続き：縦組み前提の足場をSPで解除（本文の上160px余白・縦罫・番号の絶対配置）
   SPは markup順どおり 番号 → 見出し → 本文 の自然な縦並びにする。 */
@media (max-width: 768px) {
	.lp-oc--provide .lp-oc__card { min-height: 0; }
	.lp-oc--provide .lp-oc__card-num {
		position: static;
		display: block;
		font-size: 40px;
		line-height: 1;
		margin: 0 0 8px;
		color: #ededed;
	}
	.lp-oc--provide .lp-oc__card-text { padding: 0; }
	.lp-oc--provide .lp-oc__card-text::before { display: none; }
}

/* WHAT WE DO（personal）は4枚＝5列枠だと右が空いて左寄りになる。列数を枚数に合わせる
   （前例：.lp-oc--provide-training を4列化「左寄り解消」と同じ対処） */
.lp-oc--provide-personal .lp-oc__cards { grid-template-columns: repeat(4, 1fr); }


/* ============================================================
   社長コメント #6269-6278（/service/tone-design/ ほか・2026-07-18）
   ※ #6270(SP 50px) は後発の #6275(全ページ 60px) に統合＝subsumed
   ============================================================ */

/* #6277 メニューのリンク余白 → #6325 下15（全ページ） */
.menu-panel--v2 .menu-panel__link { padding: 30px 4px 15px 10px; }

/* #6274 tone-design 最終CTA：ボタンを縦並び＋同一サイズ（page-id-3108） */
body.page-id-3108 .lp-finalcta__cta {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
}
body.page-id-3108 .lp-finalcta__cta .lp-cta {
	min-width: 280px;
	justify-content: center;
}
/* #6276 最終CTA上部テキストに下線（page-id-3108） */
body.page-id-3108 .lp-finalcta__support {
	text-decoration: underline;
	text-underline-offset: 5px;
}

@media (max-width: 768px) {
	/* #6269 lp-why padding 40/0/100/0 → 100/0/100/0（この要素のみ） */
	body.page-id-3108 article > section.lp-why { padding: 100px 0 100px 0; } /* 既存 .page-id-3108 article>section:nth-of-type(2) (0,2,2) に勝つ詳細度 */
	/* #6271 lp-faq padding 40/40/100/40 → 0/40/100/40（この要素のみ） */
	body.page-id-3108 article > section.lp-faq { padding: 0 40px 100px 40px; } /* 同上 (0,2,3) */
	/* #6272 lp-faq 内の .container padding 0/30/0/30 → 0（この要素のみ） */
	body.page-id-3108 .lp-faq > .container { padding: 0; }
	/* #6273 lp-finalcta__text margin 0/0/48/0 → 0/0/30/0（この要素のみ） */
	body.page-id-3108 .lp-finalcta__text { margin: 0 0 30px 0; }
}


/* ============================================================
   client 2026-07-18 第11波（#6280/#6282/#6283/#6285）スマホ タイポ/余白
   ============================================================ */
@media (max-width: 768px) {
	/* #6280 srv-main-lead__title SP 行間40px（font=clamp min 24px） */
	.srv-main-lead__title { line-height: 40px; }
	/* #6283 section-heading__label SP 下margin 18->10px（全ページ同一クラス） */
	.section-heading__label { margin-bottom: 10px; }
	/* #6282 event-card__title SP 18px/32px（v2含む・全ページ同一クラス） */
	.event-card__title,
	.event-card--v2 .event-card__title { font-size: 18px; line-height: 32px; }
	/* #6285 works-grid__case-excerpt SP 15px/28px（全ページ同一クラス） */
	.works-grid__case-excerpt { font-size: 15px; line-height: 28px; }
}


/* ============================================================
   client 2026-07-18 #6321-6323 /event/ 一覧カード（この要素だけ＝event archiveスコープ）
   ============================================================ */
body.post-type-archive-event .event-card__excerpt { margin: 8px 0 15px; } /* #6321 */
body.post-type-archive-event .event-card__info dt,
body.post-type-archive-event .event-card__info dd { font-size: 13px; } /* #6322/#6323 */


/* ============================================================
   client 2026-07-18 第12波（#6326・#6330-6337）menu-panel__body / /project/ 事例詳細SP
   ============================================================ */
@media (max-width: 768px) {
	/* #6326 menu-panel__body 上pad 89.9->40（この要素だけ） */
	.menu-panel--v2 .menu-panel__body { padding-top: 40px; }
	/* #6330 case-info dt 16px/700/1px/#1a1a1a */
	.single-works .case-info__list dt { font-size: 16px; font-weight: 700; letter-spacing: 1px; color: #1a1a1a; }
	/* #6331/#6332 case-info__item padding 30 0（先頭は上0維持） */
	.single-works .case-info__item { padding: 30px 0; }
	.single-works .case-info__item:first-child { padding-top: 0; }
	/* #6333 case-single__cat 字間 1px */
	.single-works .case-single__cat { letter-spacing: 1px; }
	/* #6334 case本文 h2 20px */
	.single-works .case-single__content h2 { font-size: 20px; }
	/* #6335 case-single__title 24px/40px */
	.single-works .case-single__title { font-size: 24px; line-height: 40px; }
	/* #6336/#6337(後発採用) case-mockup padding 0 0 100 0 */
	.single-works .case-mockup { padding: 0 0 100px; }
}

/* client 2026-07-18 event単一ページ ヒーロー中央寄せ（社長指示・/event/training-motivation/） */
body.single-event .page-hero .container { text-align: center; }
body.single-event .page-hero__meta { justify-content: center; }


/* ============================================================
   client 2026-07-18 #6358/#6359/#6361 event単一ページ（.section/h3は土台クラスのためページスコープに限定）
   ============================================================ */
/* #6358 event単一の本文section 上padding 160->80（.section全ページ適用は土台崩れのためsingle-eventに限定） */
body.single-event #main > section.section { padding-top: 80px; }
/* #6359 event本文 h3 24px/40px（bare h3全ページは危険のためevent本文に限定） */
body.single-event .event-detail__body h3 { font-size: 24px; line-height: 40px; }
/* #6361 申込ボタンを半分の大きさに（inquiry） */
.reservation--inquiry .reservation__submit { width: 50%; align-self: center; } /* #6430 中央寄せ（flex column） */


/* client 2026-07-18 #6363/#6364 /journal/ サイドCATEGORY見出し（この要素だけ＝journal archive） */
body.post-type-archive-journal .journal-block__side-ttl { font-size: 20px; letter-spacing: 1px; color: #1a1a1a; border-bottom-width: 0; }


/* client 2026-07-19 #6426 /about/ philosophy 本文p 行間30px（about限定） */
body.page-id-4 #philosophy > div > div:nth-of-type(2) > div:nth-of-type(2) > p { line-height: 30px; }


/* ============================================================
   client 2026-07-19 #6431-6435 /event/ 単一ページ SP（event単一にスコープ）
   ============================================================ */
@media (max-width: 768px) {
	/* #6431 hero label 15->13 */
	body.single-event .page-hero__label { font-size: 13px; }
	/* #6432 hero title 29->24 / lh 50->40 */
	body.single-event .page-hero__title { font-size: 24px; line-height: 40px; }
	/* #6433 hero schedule 15->13 */
	body.single-event .page-hero__schedule { font-size: 13px; }
	/* #6434 event本文 h3 24->20 / lh 36（event本文に限定＝bare h3の全ページ誤爆回避） */
	body.single-event .event-detail__body h3 { font-size: 20px; line-height: 36px; }
	/* #6435 reservation 余白/枠：margin下40・左右padding0・左右border0 */
	#reservation { margin: 60px 0 40px; padding: 40px 0; border-width: 1px 0; }
}


/* ============================================================
   client 2026-07-19 スマホトップ セミナー・ワークショップ／ジャーナル（home限定）
   ============================================================ */
@media (max-width: 768px) {
	/* セミナー・ワークショップ：横スクロールをやめカードを縦積み・幅100%に
	   （右padding0だったのを戻し左右30pxで揃える） */
	body.home #events .events-grid {
		flex-direction: column;
		flex-wrap: nowrap;
		overflow-x: visible;
		scroll-snap-type: none;
		gap: 40px;
		padding-right: var(--container-pad);
	}
	body.home #events .events-grid > .event-card {
		flex: none;
		width: 100%;
		max-width: none;
	}
	/* 「一覧を見る」ボタン中央寄せ（container右padding0で右にずれるのを補正） */
	body.home #events .section__more { padding-right: var(--container-pad); }

	/* ジャーナル：サムネを横幅100%で上に、その下に日付＋カテゴリ→見出しを縦積み */
	body.home #journal .journal-row__link { grid-template-columns: 1fr; }
	body.home #journal .journal-row__media { width: 100%; }
}


/* ============================================================
   client 2026-07-20 #6513/#6514 スマホトップ #journal/#news 上padding除去（home限定・この要素だけ）
   ============================================================ */
@media (max-width: 768px) {
	/* #6513 #journal 上padding 100->0（100 0 0 0 → 0 0 0 0） */
	body.home #journal { padding: 0; }
	/* #6514 #news 上padding 100->0（100 0 100 0 → 0 0 100 0・下100維持） */
	body.home #news { padding: 0 0 100px; }
}