/* ==========================================================================
   smart-office front-page 専用 v2.0（モノクロ＋深緑1点）
   - 大胆な余白／線で語る／装飾は最小限／深緑は CV と要点強調のみ
   ========================================================================== */

/* ==========================================================================
   1. FV
   ========================================================================== */
.fv {
	position: relative;
	background: #fff;
	border-bottom: 1px solid var(--c-line);
}
.fv__in {
	max-width: var(--container);
	margin: 0 auto;
	padding: 120px 32px 100px;
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: 80px;
	align-items: center;
}
.fv__body { max-width: 640px; }
.fv__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-family: var(--ff-en);
	font-size: .75rem;
	color: var(--c-accent);
	letter-spacing: .22em;
	text-transform: uppercase;
	margin-bottom: 32px;
}
.fv__eyebrow::before {
	content: ""; width: 24px; height: 1px; background: var(--c-accent);
}
.fv__h {
	font-size: clamp(2.25rem, 5vw, 3.75rem);
	line-height: 1.25;
	margin: 0 0 32px;
	letter-spacing: -.01em;
	color: var(--c-ink);
	font-weight: 700;
}
.fv__h-accent {
	position: relative;
	display: inline-block;
	color: var(--c-ink);
	/* 下の帯（::after・z-index:-1）を、この語の中で文字の下に描く。無いと .fv の白い地の下に隠れる（2026年11月4日のオーナー指示で見えるようにした） */
	isolation: isolate;
}
.fv__h-accent::after {
	content: ""; position: absolute;
	left: 0; right: 0; bottom: -2px;
	height: 8px;
	background: var(--c-accent);
	opacity: .25;
	z-index: -1;
}
.fv__sub {
	font-size: 1.0625rem;
	line-height: 2;
	color: var(--c-text-soft);
	margin: 0 0 40px;
}
.fv__cta {
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
}
.fv__trust {
	display: flex;
	gap: 32px;
	margin-top: 48px;
	padding-top: 32px;
	border-top: 1px solid var(--c-line);
	flex-wrap: wrap;
}
.fv__trust-item {
	display: flex; flex-direction: column; gap: 4px;
	min-width: 0;
}
.fv__trust-num {
	font-family: var(--ff-en);
	font-size: 1.875rem;
	font-weight: 700;
	color: var(--c-ink);
	line-height: 1;
	letter-spacing: -.01em;
}
.fv__trust-lbl {
	font-size: .75rem;
	color: var(--c-muted);
	letter-spacing: .04em;
}

/* FV 右側のビジュアル */
.fv__visual {
	position: relative;
	aspect-ratio: 4 / 5;
	max-width: 440px;
	justify-self: end;
	width: 100%;
}
.fv__visual-svg {
	width: 100%; height: 100%;
	background: var(--c-bg-soft);
	border: 1px solid var(--c-line);
}
.fv__visual-svg svg {
	width: 100%; height: 100%;
	display: block;
}

@media (max-width: 980px) {
	.fv__in {
		grid-template-columns: 1fr;
		gap: 56px;
		padding: 80px 32px 64px;
	}
	.fv__visual { max-width: 360px; justify-self: center; }
}
@media (max-width: 600px) {
	.fv__in { padding: 56px 20px 48px; }
	.fv__trust { gap: 24px; }
	.fv__trust-num { font-size: 1.5rem; }
}

/* ==========================================================================
   2. persona 3カード
   ========================================================================== */
.persona__cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0;
	border-top: 1px solid var(--c-line);
	border-left: 1px solid var(--c-line);
}
/* v1.3.0：会社案内の関連サイトは2枚なので2列（900px 以下は下の規則で1列） */
.persona__cards--two { grid-template-columns: repeat(2, 1fr); }
.persona__card {
	position: relative;
	display: flex; flex-direction: column;
	padding: 48px 40px;
	background: #fff;
	color: var(--c-text);
	text-decoration: none;
	border-right: 1px solid var(--c-line);
	border-bottom: 1px solid var(--c-line);
	transition: background .25s var(--ease-out);
}
.persona__card:hover {
	background: var(--c-bg-soft);
	color: var(--c-text);
	text-decoration: none;
}
.persona__icon {
	display: inline-grid;
	place-items: center;
	width: 48px; height: 48px;
	background: var(--c-accent);
	color: #fff;
	margin-bottom: 24px;
}
.persona__icon svg { width: 22px; height: 22px; }
.persona__tag {
	font-family: var(--ff-en);
	font-size: .75rem;
	font-weight: 500;
	color: var(--c-accent);
	letter-spacing: .22em;
	margin-bottom: 16px;
}
.persona__card h3 {
	font-size: 1.25rem;
	margin: 0 0 16px;
	color: var(--c-ink);
	line-height: 1.5;
}
.persona__card p {
	font-size: .9375rem;
	color: var(--c-text-soft);
	flex: 1;
	margin: 0 0 24px;
	line-height: 1.85;
}
.persona__more {
	display: inline-flex; align-items: center; gap: 10px;
	color: var(--c-ink);
	font-size: .875rem;
	font-weight: 600;
}
.persona__more::after {
	content: ""; width: 24px; height: 1px;
	background: var(--c-ink);
	transition: width .25s var(--ease-out);
}
.persona__card:hover .persona__more::after { width: 40px; }

@media (max-width: 900px) {
	.persona__cards { grid-template-columns: 1fr; border-left: none; }
	.persona__card { border-right: none; }
}

/* ==========================================================================
   3. まとまりの俯瞰
   ========================================================================== */
.overview .cluster { margin-bottom: 96px; }
.overview .cluster:last-child { margin-bottom: 0; }

.cluster__head {
	display: flex;
	align-items: baseline;
	gap: 24px;
	margin-bottom: 40px;
	padding-bottom: 24px;
	border-bottom: 1px solid var(--c-ink);
}
.cluster__num {
	font-family: var(--ff-en);
	font-size: .875rem;
	color: var(--c-accent);
	letter-spacing: .04em;
	font-weight: 500;
	flex-shrink: 0;
}
.cluster__h {
	font-size: clamp(1.5rem, 2.5vw, 2rem);
	margin: 0;
	color: var(--c-ink);
	font-weight: 700;
	flex: 1;
}
.cluster__sub {
	font-family: var(--ff-en);
	color: var(--c-muted);
	font-size: .75rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	margin: 0;
}

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

.svc-card {
	position: relative;
	display: flex; flex-direction: column;
	padding: 32px 28px;
	background: #fff;
	border: 1px solid var(--c-line);
	color: var(--c-text);
	text-decoration: none;
	transition: all .25s var(--ease-out);
}
.svc-card:hover {
	border-color: var(--c-ink);
	color: var(--c-text);
	text-decoration: none;
	transform: translateY(-2px);
}

.svc-card--hero {
	background: var(--c-ink-deep);
	border-color: var(--c-ink-deep);
	color: rgba(255,255,255,.85);
}
.svc-card--hero:hover { color: rgba(255,255,255,.95); }

.svc-card__top {
	display: flex; align-items: center; justify-content: space-between;
	margin-bottom: 20px;
}
.svc-card__icon-wrap {
	display: inline-grid; place-items: center;
	width: 40px; height: 40px;
	border: 1px solid var(--c-line);
	color: var(--c-ink);
}
.svc-card--hero .svc-card__icon-wrap {
	border-color: rgba(255,255,255,.3);
	color: #fff;
}
.svc-card__icon { width: 18px; height: 18px; }

.svc-card__star {
	font-family: var(--ff-en);
	font-size: .6875rem;
	color: var(--c-accent);
	letter-spacing: .14em;
}
.svc-card--hero .svc-card__star { color: #fff; opacity: .9; }

.svc-card__h {
	font-size: 1.0625rem;
	font-weight: 600;
	margin: 0 0 12px;
	color: var(--c-ink);
}
.svc-card--hero .svc-card__h { color: #fff; }

.svc-card__short {
	font-size: .9375rem;
	flex: 1;
	margin: 0 0 24px;
	line-height: 1.85;
}

.svc-card__more {
	display: inline-flex; align-items: center; gap: 10px;
	color: var(--c-ink);
	font-size: .8125rem;
	font-weight: 600;
}
.svc-card--hero .svc-card__more { color: #fff; }
.svc-card__more::after {
	content: ""; width: 20px; height: 1px; background: currentColor;
	transition: width .25s var(--ease-out);
}
.svc-card:hover .svc-card__more::after { width: 32px; }

@media (max-width: 980px) {
	.cluster__cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
	.cluster__cards { grid-template-columns: 1fr; }
	.cluster__head { flex-direction: column; align-items: flex-start; gap: 8px; }
}

/* ==========================================================================
   4. ビフォーアフター比較表
   ========================================================================== */
.compare { background: var(--c-bg-soft); }
.compare__placeholder { max-width: 1080px; margin: 0 auto; }
.compare__table {
	width: 100%;
	background: #fff;
	border: 1px solid var(--c-line);
	border-collapse: separate;
	border-spacing: 0;
}
.compare__table th,
.compare__table td {
	padding: 20px 24px;
	text-align: left;
	border-bottom: 1px solid var(--c-line);
}
.compare__table thead th {
	background: #fff;
	color: var(--c-muted);
	font-family: var(--ff-en);
	font-weight: 500;
	font-size: .75rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	border-bottom: 1px solid var(--c-ink);
}
.compare__table tbody tr:last-child td { border-bottom: none; }
.compare__table tbody td { font-size: .9375rem; color: var(--c-text); }
.compare__table tbody td:first-child {
	font-weight: 600;
	color: var(--c-ink);
}
.compare__table tbody td:nth-child(2),
.compare__table tbody td:nth-child(3) {
	font-family: var(--ff-num);
	color: var(--c-text-soft);
	font-feature-settings: "tnum";
}
.compare__table tbody td:last-child {
	font-family: var(--ff-num);
	color: var(--c-accent);
	font-weight: 700;
	font-size: 1.0625rem;
	font-feature-settings: "tnum";
}
.compare__note {
	font-size: .75rem;
	color: var(--c-muted);
	margin-top: 16px;
	text-align: right;
}

/* 比較表の棒 */
.compare__bar {
	position: relative;
	width: 100%;
	height: 28px;
	background: var(--c-bg-soft);
	border: 1px solid var(--c-line);
	overflow: hidden;
	display: flex;
	align-items: center;
}
.compare__bar-fill {
	position: absolute;
	left: 0; top: 0; bottom: 0;
	background: var(--c-accent);
	transition: width .8s var(--ease-out);
}
.compare__bar-val {
	position: relative;
	z-index: 1;
	font-family: var(--ff-num);
	font-size: .9375rem;
	font-weight: 700;
	color: #fff;
	margin-left: 12px;
	letter-spacing: .04em;
	font-feature-settings: "tnum";
	text-shadow: 0 1px 2px rgba(0,0,0,.2);
}

@media (max-width: 600px) {
	.compare__table th, .compare__table td { padding: 14px 12px; font-size: .8125rem; }
}

/* ==========================================================================
   5. ハイライト
   ========================================================================== */
.cases__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.case-card {
	padding: 32px 28px;
	background: #fff;
	border: 1px solid var(--c-line);
	transition: border-color .25s var(--ease-out), transform .25s var(--ease-out);
	display: flex; flex-direction: column;
	position: relative;
}
.case-card:hover {
	border-color: var(--c-ink);
	transform: translateY(-2px);
}
.case-card__icon {
	display: inline-grid;
	place-items: center;
	width: 40px; height: 40px;
	border: 1px solid var(--c-line);
	background: var(--c-accent-bg);
	margin-bottom: 20px;
	color: var(--c-accent);
}
.case-card__icon svg { width: 18px; height: 18px; }
.case-card__industry {
	font-family: var(--ff-en);
	font-size: .75rem;
	color: var(--c-accent);
	letter-spacing: .14em;
	text-transform: uppercase;
	margin: 0 0 16px;
}
.case-card__title {
	font-size: 1.0625rem;
	line-height: 1.6;
	margin: 0 0 24px;
	color: var(--c-ink);
	font-weight: 600;
	flex: 1;
}
.case-card__metrics {
	display: flex; gap: 24px;
	padding-top: 20px;
	border-top: 1px solid var(--c-line);
}
.case-card__metric {
	display: flex; flex-direction: column; gap: 2px;
}
.case-card__metric-num {
	font-family: var(--ff-num);
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--c-ink);
	line-height: 1;
	letter-spacing: -.01em;
	font-feature-settings: "tnum";
}
.case-card__metric-lbl {
	font-size: .6875rem;
	color: var(--c-muted);
	letter-spacing: .04em;
}

@media (max-width: 900px) {
	.cases__grid { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; }
}

/* ==========================================================================
   6. 代表紹介（スプリットレイアウト）
   ========================================================================== */
.profile { background: var(--c-bg-soft); }
.profile__in {
	display: grid;
	grid-template-columns: 360px 1fr;
	gap: 80px;
	align-items: center;
	max-width: 1080px;
	margin: 0 auto;
}
/* v1.3.0：代表の写真が無いときは写真の列ごと出さない（雛形で写真の div を出さず、この class を足す） */
.profile__in--nophoto { grid-template-columns: 1fr; max-width: 760px; }

.profile__photo {
	aspect-ratio: 4 / 5;
	background: #fff;
	border: 1px solid var(--c-line);
	overflow: hidden;
}
.profile__photo-placeholder {
	width: 100%; height: 100%;
	display: grid; place-items: center;
	color: var(--c-muted);
	font-family: var(--ff-en);
	font-size: .75rem;
	letter-spacing: .14em;
	background: var(--c-bg-mute);
}
.profile__photo-img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
}
.profile__photo-svg { width: 100%; height: 100%; }
.profile__photo-svg svg { display: block; width: 100%; height: 100%; }

.profile__role {
	font-family: var(--ff-en);
	font-size: .75rem;
	color: var(--c-accent);
	letter-spacing: .22em;
	text-transform: uppercase;
	margin: 0 0 16px;
}
.profile__name {
	font-size: clamp(1.75rem, 3vw, 2.25rem);
	margin: 0 0 24px;
	letter-spacing: -.01em;
	color: var(--c-ink);
	font-weight: 700;
}
.profile__lead {
	font-size: 1rem;
	line-height: 2;
	margin: 0 0 32px;
	color: var(--c-text-soft);
}
.profile__badges {
	display: flex; flex-wrap: wrap; gap: 24px;
	margin: 0 0 40px;
}
.profile__badge {
	display: flex; flex-direction: column; gap: 4px;
	padding: 0 0 0 12px;
	border-left: 2px solid var(--c-accent);
}
.profile__badge-lbl {
	font-family: var(--ff-en);
	font-size: .6875rem;
	color: var(--c-muted);
	letter-spacing: .14em;
	text-transform: uppercase;
}
.profile__badge-txt {
	font-size: .9375rem;
	color: var(--c-ink);
	font-weight: 600;
}

@media (max-width: 900px) {
	.profile__in { grid-template-columns: 1fr; gap: 48px; }
	.profile__photo { max-width: 320px; margin: 0 auto; }
}

/* ==========================================================================
   7. CV ブロック
   ========================================================================== */
.cv {
	background: var(--c-ink-deep);
	color: #fff;
}
.cv__in { text-align: center; max-width: 800px; margin: 0 auto; }
.cv__eyebrow {
	font-family: var(--ff-en);
	font-size: .75rem;
	color: var(--c-accent-on-ink); /* v1.3.0：濃紺の地の上の差し色 */
	letter-spacing: .22em;
	text-transform: uppercase;
	margin: 0 0 24px;
	display: inline-block;
}
.cv__h {
	font-size: clamp(1.75rem, 4vw, 2.75rem);
	margin: 0 0 24px;
	color: #fff;
	letter-spacing: -.005em;
	line-height: 1.35;
	/* v1.3.0：語の途中で折らない（狭い幅で「ご相談くだ／さい。」と折れていた）。節の見出し .section__h と同じ */
	word-break: auto-phrase;
	text-wrap: balance;
}
.cv__sub {
	color: rgba(255,255,255,.7);
	font-size: 1rem;
	margin: 0 0 48px;
	line-height: 2;
}
.cv__buttons {
	display: flex; justify-content: center; gap: 16px;
	flex-wrap: wrap;
	margin-bottom: 40px;
}
.cv__buttons .btn--primary {
	background: #fff;
	color: var(--c-ink);
	border-color: #fff;
}
.cv__buttons .btn--primary:hover { background: #f0f0f0; color: var(--c-ink); }
.cv__buttons .btn--secondary {
	background: transparent;
	color: #fff;
	border-color: rgba(255,255,255,.4);
}
.cv__buttons .btn--secondary:hover { border-color: #fff; background: rgba(255,255,255,.05); color: #fff; }

.cv__info {
	display: flex; gap: 32px; justify-content: center;
	color: rgba(255,255,255,.6);
	font-size: .8125rem;
	flex-wrap: wrap;
	padding-top: 32px;
	border-top: 1px solid rgba(255,255,255,.12);
}
.cv__info-item { display: inline-flex; align-items: center; gap: 8px; }
.cv__info-item svg { width: 14px; height: 14px; color: var(--c-accent-on-ink); }

/* ==========================================================================
   8. About: 数字で語る
   ========================================================================== */
.about-numbers__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
	border-top: 1px solid var(--c-ink);
	border-left: 1px solid var(--c-line);
}
.about-num {
	padding: 40px 28px 36px;
	background: #fff;
	border-right: 1px solid var(--c-line);
	border-bottom: 1px solid var(--c-line);
	display: flex; flex-direction: column;
	gap: 14px;
}
.about-num__icon {
	display: inline-grid;
	place-items: center;
	width: 44px; height: 44px;
	background: var(--c-accent-bg);
	color: var(--c-accent);
	margin-bottom: 8px;
}
.about-num__icon svg { width: 20px; height: 20px; }
.about-num__lbl {
	font-family: var(--ff-en);
	font-size: .6875rem;
	color: var(--c-muted);
	letter-spacing: .22em;
	text-transform: uppercase;
	margin: 0;
}
.about-num__val {
	font-family: var(--ff-num);
	font-size: clamp(3rem, 6vw, 4.5rem);
	font-weight: 700;
	color: var(--c-ink);
	letter-spacing: -.03em;
	line-height: 1;
	margin: 0;
	display: flex;
	align-items: baseline;
	gap: 4px;
	font-feature-settings: "tnum";
}
.about-num__val span {
	font-family: var(--ff-jp);
	font-size: .9375rem;
	font-weight: 500;
	color: var(--c-muted);
	letter-spacing: 0;
}
.about-num__sub {
	font-size: .8125rem;
	color: var(--c-text-soft);
	margin: 0;
	padding-top: 12px;
	border-top: 1px solid var(--c-line-soft);
	line-height: 1.6;
}

@media (max-width: 900px) {
	.about-numbers__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
	.about-numbers__grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   9. About: 柱の解説
   ========================================================================== */
.about-trinity__layout {
	display: grid;
	grid-template-columns: 420px 1fr;
	gap: 80px;
	align-items: start;
}
.about-trinity__visual {
	aspect-ratio: 4 / 5;
	background: var(--c-bg-soft);
	border: 1px solid var(--c-line);
	padding: 24px;
	overflow: hidden;
}
.about-trinity__visual svg { display: block; width: 100%; height: 100%; }
.about-trinity__body { display: flex; flex-direction: column; gap: 40px; }
.about-trinity__item {
	display: flex;
	align-items: flex-start;
	gap: 20px;
	padding: 8px 0 8px 24px;
	border-left: 2px solid var(--c-accent);
}
.about-trinity__icon {
	display: inline-grid;
	place-items: center;
	flex-shrink: 0;
	width: 44px; height: 44px;
	background: var(--c-accent-bg);
	color: var(--c-accent);
}
.about-trinity__icon svg { width: 20px; height: 20px; }
.about-trinity__txt { flex: 1; }
.about-trinity__lbl {
	font-family: var(--ff-en);
	font-size: .75rem;
	color: var(--c-accent);
	letter-spacing: .22em;
	text-transform: uppercase;
	margin: 0 0 12px;
	font-weight: 500;
}
.about-trinity__h {
	font-size: 1.25rem;
	color: var(--c-ink);
	margin: 0 0 12px;
	font-weight: 700;
	line-height: 1.5;
}
.about-trinity__p {
	font-size: .9375rem;
	color: var(--c-text-soft);
	margin: 0;
	line-height: 1.95;
}

@media (max-width: 900px) {
	.about-trinity__layout { grid-template-columns: 1fr; gap: 48px; }
	.about-trinity__visual { max-width: 360px; margin: 0 auto; }
}

/* ==========================================================================
   10. About: クレド（黒地）
   ========================================================================== */
.about-credo { background: var(--c-ink-deep); }
.about-credo__head { text-align: center; margin-bottom: 64px; }
.about-credo__eyebrow { display: inline-block; }
.about-credo__h { color: #fff; margin: 0; }
.about-credo__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0;
	border-top: 1px solid rgba(255,255,255,.16);
	border-left: 1px solid rgba(255,255,255,.16);
}
.about-credo__item {
	padding: 40px 32px;
	border-right: 1px solid rgba(255,255,255,.16);
	border-bottom: 1px solid rgba(255,255,255,.16);
	display: flex; flex-direction: column;
	gap: 14px;
	min-height: 280px;
}
.about-credo__icon {
	display: inline-grid;
	place-items: center;
	width: 52px; height: 52px;
	/* v1.3.0：濃紺の地の上の丸の枠は明るい青。地は旧い緑の名残 rgba(27,67,50,…) を明るい青の薄い地に替えた */
	border: 1px solid var(--c-accent-on-ink);
	background: rgba(147,197,253,.12);
	color: var(--c-accent-on-ink);
	margin-bottom: 8px;
	border-radius: 50%;
}
.about-credo__icon svg { width: 22px; height: 22px; }
.about-credo__num {
	font-family: var(--ff-en);
	font-size: .8125rem;
	color: var(--c-accent-on-ink);
	letter-spacing: .22em;
	font-weight: 500;
	margin: 0;
}
.about-credo__item-h {
	font-size: 1.0625rem;
	color: #fff;
	margin: 0;
	font-weight: 600;
	line-height: 1.5;
}
.about-credo__item-p {
	font-size: .875rem;
	color: rgba(255,255,255,.6);
	margin: 0;
	line-height: 1.85;
}

@media (max-width: 1024px) {
	.about-credo__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
	.about-credo__grid { grid-template-columns: 1fr; border-left: none; }
	.about-credo__item { border-right: none; min-height: auto; }
}

/* ==========================================================================
   11. About: 沿革タイムライン
   ========================================================================== */
.about-history__timeline {
	position: relative;
	padding-left: 56px;
}
.about-history__timeline::before {
	content: "";
	position: absolute;
	left: 20px; top: 20px; bottom: 20px;
	width: 1px;
	background: var(--c-line);
}
.about-history__item {
	position: relative;
	display: grid;
	grid-template-columns: 140px 1fr;
	gap: 32px;
	padding: 0 0 48px;
}
.about-history__item:last-child { padding-bottom: 0; }
.about-history__icon {
	position: absolute;
	left: -56px;
	top: 0;
	width: 40px; height: 40px;
	display: grid;
	place-items: center;
	background: #fff;
	border: 1px solid var(--c-line);
	color: var(--c-accent);
	border-radius: 50%;
	z-index: 1;
}
.about-history__icon svg { width: 18px; height: 18px; }
.about-history__item--current .about-history__icon {
	background: var(--c-accent);
	border-color: var(--c-accent);
	color: #fff;
	box-shadow: 0 0 0 6px var(--c-accent-bg);
}
.about-history__year {
	font-family: var(--ff-en);
	font-size: .8125rem;
	color: var(--c-accent);
	letter-spacing: .14em;
	text-transform: uppercase;
	font-weight: 500;
	margin: 0;
	padding-top: 4px;
}
.about-history__item--current .about-history__year { color: var(--c-accent); font-weight: 700; }
.about-history__body { padding-top: 0; }
.about-history__h {
	font-size: 1.125rem;
	color: var(--c-ink);
	margin: 0 0 12px;
	font-weight: 700;
	line-height: 1.5;
}
.about-history__p {
	font-size: .9375rem;
	color: var(--c-text-soft);
	margin: 0;
	line-height: 1.95;
}
.about-history__note { margin-top: 32px; text-align: left; }

@media (max-width: 700px) {
	.about-history__timeline { padding-left: 44px; }
	.about-history__timeline::before { left: 14px; }
	.about-history__item { grid-template-columns: 1fr; gap: 8px; }
	.about-history__icon { left: -44px; width: 30px; height: 30px; }
	.about-history__icon svg { width: 14px; height: 14px; }
}

/* about-info 行間調整 */
.about-info__note { text-align: left; margin-top: 16px; }

/* About: 3 つの強み（カスタム実装・lp-solution__pillars の流用をやめてアイコン入りカードに） */
.about-strength__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.about-strength__item {
	background: #fff;
	border: 1px solid var(--c-line);
	padding: 40px 32px;
	display: flex;
	flex-direction: column;
	gap: 16px;
	position: relative;
	transition: border-color .25s var(--ease-out), transform .25s var(--ease-out);
}
.about-strength__item:hover {
	border-color: var(--c-ink);
	transform: translateY(-2px);
}
.about-strength__icon {
	display: inline-grid;
	place-items: center;
	width: 56px; height: 56px;
	background: var(--c-accent);
	color: #fff;
	border-radius: 4px;
}
.about-strength__icon svg { width: 26px; height: 26px; }
.about-strength__num {
	position: absolute;
	top: 28px; right: 28px;
	font-family: var(--ff-en);
	font-size: 2.25rem;
	font-weight: 700;
	color: var(--c-bg-mute);
	line-height: 1;
	letter-spacing: -.04em;
}
.about-strength__h {
	font-size: 1.25rem;
	color: var(--c-ink);
	margin: 0;
	font-weight: 700;
	line-height: 1.5;
}
.about-strength__p {
	font-size: .9375rem;
	color: var(--c-text-soft);
	margin: 0;
	line-height: 1.95;
}

@media (max-width: 900px) {
	.about-strength__grid { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; }
}

/* About: 会社概要 2 カラム（テーブル＋地図） */
.about-company__layout {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: 40px;
	align-items: start;
}
.about-info {
	background: #fff;
}
.about-info__icon {
	display: inline-grid;
	place-items: center;
	width: 24px; height: 24px;
	margin-right: 10px;
	color: var(--c-accent);
	background: var(--c-accent-bg);
	vertical-align: middle;
	border-radius: 2px;
	flex-shrink: 0;
}
.about-info__icon svg { width: 13px; height: 13px; }
/* v1.3.0：見出しのセルは 601px 以上では表のセルのまま縦の中央にそろえる（flex にすると、右の欄が2行以上の行で左のセルの
   高さが伸びず、左右の区切り線がずれた）。600px 以下は style.css で見出しと中身を縦に積むので、flex は下の 600px の規則で */
.about-info tbody th {
	vertical-align: middle;
	font-size: .875rem;
}

.about-company__map {
	position: sticky; top: 88px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.about-company__map-visual {
	position: relative;
	background: #fff;
	border: 1px solid var(--c-line);
	aspect-ratio: 1 / 1;
	overflow: hidden;
}
.about-company__map-visual svg {
	width: 100%; height: 100%;
	display: block;
}
/* 地図は枠に重ねて四隅まで広げる（縦に並べる flex の中では height の百分率が効かず、既定の低い高さで止まることがあるため） */
.about-company__map-visual iframe {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	display: block;
	border: 0;
}
.about-company__map-cap {
	font-size: .8125rem;
	color: var(--c-muted);
	margin: 0;
	text-align: center;
	padding: 12px 16px;
	background: var(--c-bg-soft);
	border: 1px solid var(--c-line-soft);
}

/* v1.3.0：地図を出さないとき（テーマオプションで「出さない」・埋め込みの形が合わない）は表を1列で組み、
   説明の行を表の下に左寄せで置く（右の欄が空いたままにならないように） */
.about-company__layout--nomap { grid-template-columns: 1fr; gap: 16px; }
.about-company__layout--nomap .about-company__map { position: static; max-width: none; margin: 0; }
.about-company__layout--nomap .about-company__map-cap { text-align: left; background: none; border: 0; padding: 0; }

@media (max-width: 900px) {
	.about-company__layout { grid-template-columns: 1fr; gap: 32px; }
	.about-company__map { position: static; max-width: 480px; margin: 0 auto; width: 100%; }
	/* 地図を出さないときの間は、狭い幅でも上の規則と同じ 16px に */
	.about-company__layout--nomap { gap: 16px; }
}
@media (max-width: 600px) {
	.about-info tbody th { display: flex; align-items: center; font-size: .8125rem; }
	.about-info__icon { width: 20px; height: 20px; }
	.about-info__icon svg { width: 11px; height: 11px; }
}

/* ==========================================================================
   12. front: Mission（黒地・中央寄せ）
   ========================================================================== */
.mission { padding: 120px 0; }
.mission__in { text-align: center; max-width: 880px; margin: 0 auto; }
.mission__eyebrow {
	font-family: var(--ff-en);
	font-size: .75rem;
	color: var(--c-accent-on-ink);
	letter-spacing: .22em;
	text-transform: uppercase;
	margin: 0 0 32px;
	display: inline-block;
}
.mission__h {
	font-size: clamp(1.875rem, 4vw, 2.75rem);
	color: #fff;
	margin: 0 0 32px;
	line-height: 1.4;
	letter-spacing: -.005em;
	font-weight: 700;
}
/* v1.3.0：紺の地の上の帯は明るい青の地に紺の字（6.38 : 1。見本の確認事項 13 のご回答） */
.mission__h-em {
	display: inline-block;
	background: var(--c-accent-on-ink);
	color: var(--c-ink-deep);
	padding: 2px 14px;
	font-style: normal;
}
.mission__lead {
	font-size: 1.0625rem;
	color: rgba(255,255,255,.7);
	line-height: 2;
	margin: 0 0 56px;
}
.mission__axes {
	display: grid;
	grid-template-columns: repeat(2, 1fr); /* v1.3.0：欄は2本（業務・技術） */
	gap: 0;
	border-top: 1px solid rgba(255,255,255,.16);
	border-left: 1px solid rgba(255,255,255,.16);
	text-align: left;
}
.mission__ax {
	padding: 32px 24px 28px;
	border-right: 1px solid rgba(255,255,255,.16);
	border-bottom: 1px solid rgba(255,255,255,.16);
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.mission__ax-icon {
	display: inline-grid;
	place-items: center;
	width: 44px; height: 44px;
	border: 1px solid var(--c-accent-on-ink);
	border-radius: 50%;
	background: rgba(147,197,253,.12);
	margin-bottom: 4px;
}
.mission__ax-icon svg { width: 20px; height: 20px; color: var(--c-accent-on-ink); }
.mission__ax-lbl {
	font-family: var(--ff-jp);
	font-size: .8125rem;
	color: var(--c-accent-on-ink);
	font-weight: 700;
	letter-spacing: .14em;
}
.mission__ax-txt {
	font-size: .9375rem;
	color: rgba(255,255,255,.85);
	line-height: 1.7;
}

@media (max-width: 900px) {
	.mission { padding: 88px 0; }
	.mission__axes { grid-template-columns: 1fr; border-left: none; }
	.mission__ax { border-right: none; }
}

/* ==========================================================================
   13. front: 事業の早見表（簡略カード）
   ========================================================================== */
.services-overview__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr); /* v1.3.0：事業は5つ＝PC では3列＋2列に折り返す */
	gap: 0;
	border-top: 1px solid var(--c-ink);
	border-left: 1px solid var(--c-line);
}
.svo-card {
	padding: 28px 24px;
	background: #fff;
	color: var(--c-text);
	border-right: 1px solid var(--c-line);
	border-bottom: 1px solid var(--c-line);
	display: flex; flex-direction: column;
	gap: 14px;
	text-decoration: none;
	transition: background .25s var(--ease-out);
}
.svo-card:hover {
	background: var(--c-bg-soft);
	color: var(--c-text);
	text-decoration: none;
}
.svo-card--hero {
	background: var(--c-ink-deep);
	color: rgba(255,255,255,.9);
}
.svo-card--hero:hover {
	background: var(--c-accent);
	color: #fff;
}
.svo-card__top {
	display: flex; justify-content: space-between; align-items: center;
	margin-bottom: 8px;
}
.svo-card__icon-wrap {
	display: inline-grid;
	place-items: center;
	width: 36px; height: 36px;
	background: var(--c-accent-bg);
	color: var(--c-accent);
	border: 1px solid var(--c-line);
}
.svo-card__icon { width: 18px; height: 18px; }
.svo-card--hero .svo-card__icon-wrap {
	background: rgba(255,255,255,.08);
	border-color: rgba(255,255,255,.15);
	color: #fff;
}
.svo-card__cluster {
	font-family: var(--ff-en);
	font-size: .6875rem;
	color: var(--c-accent);
	letter-spacing: .14em;
	text-transform: uppercase;
}
.svo-card--hero .svo-card__cluster { color: var(--c-accent-on-ink); }
.svo-card__bottom {
	display: flex; justify-content: space-between; align-items: center;
	margin-top: auto;
}
.svo-card__star {
	font-family: var(--ff-en);
	font-size: .625rem;
	color: var(--c-accent);
	letter-spacing: .14em;
}
.svo-card__h {
	font-size: 1rem;
	margin: 0;
	color: var(--c-ink);
	font-weight: 700;
	line-height: 1.4;
}
.svo-card--hero .svo-card__h { color: #fff; }
.svo-card__short {
	font-size: .8125rem;
	color: var(--c-text-soft);
	margin: 0;
	line-height: 1.75;
	flex: 1;
}
.svo-card--hero .svo-card__short { color: rgba(255,255,255,.65); }
/* v1.3.0：主役のカードの差し色。マウスを載せると地が #1D4ED8 になるので、そのときは白に（明るい青は 3.72 : 1 で足りない）。
   同じときの短い説明は白を濃く（旧い値は #1D4ED8 の地で 3.75 : 1） */
.svo-card--hero .svo-card__star { color: var(--c-accent-on-ink); }
.svo-card--hero:hover .svo-card__cluster,
.svo-card--hero:hover .svo-card__star { color: #fff; }
.svo-card--hero:hover .svo-card__short { color: rgba(255,255,255,.9); }
.svo-card__more {
	font-size: .75rem;
	color: var(--c-ink);
	font-weight: 600;
	letter-spacing: .04em;
}
.svo-card--hero .svo-card__more { color: #fff; }

@media (max-width: 1023px) { /* v1.3.0：1024px は3列（見本と同じ） */
	.services-overview__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
	.services-overview__grid { grid-template-columns: 1fr; border-left: none; }
	.svo-card { border-right: none; }
}

/* ==========================================================================
   14. services hub: 比較早見表
   ========================================================================== */
.svc-hub-compare__wrap {
	width: 100%;
	overflow-x: auto;
	border: 1px solid var(--c-line);
	background: #fff;
}
.svc-hub-compare__tbl {
	width: 100%;
	min-width: 720px;
	border-collapse: separate;
	border-spacing: 0;
	font-size: .9375rem;
}
.svc-hub-compare__tbl thead th {
	font-family: var(--ff-en);
	font-size: .6875rem;
	font-weight: 500;
	color: var(--c-muted);
	letter-spacing: .14em;
	text-transform: uppercase;
	text-align: left;
	padding: 18px 20px;
	background: var(--c-bg-soft);
	border-bottom: 1px solid var(--c-ink);
	white-space: nowrap;
}
.svc-hub-compare__tbl tbody td {
	padding: 18px 20px;
	border-bottom: 1px solid var(--c-line);
	vertical-align: top;
	color: var(--c-text);
	line-height: 1.6;
}
.svc-hub-compare__tbl tbody tr:last-child td { border-bottom: none; }
.svc-hub-compare__tbl tbody tr:hover td { background: var(--c-bg-soft); }
.svc-hub-compare__tbl td:first-child strong {
	font-size: 1rem;
	color: var(--c-ink);
	font-weight: 700;
}
.svc-hub-compare__tbl td:first-child a { color: var(--c-ink); text-decoration: none; }
.svc-hub-compare__tbl td:first-child a:hover { color: var(--c-accent); }
.svc-hub-compare__tbl td:nth-child(3) {
	font-family: var(--ff-num);
	color: var(--c-accent);
	font-weight: 700;
	white-space: nowrap;
}
.svc-hub-compare__tbl td:nth-child(4) { color: var(--c-text-soft); white-space: nowrap; }

/* ==========================================================================
   15. services hub: お悩み別ナビ
   ========================================================================== */
.svc-hub-nav__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0;
	border-top: 1px solid var(--c-line);
	border-left: 1px solid var(--c-line);
}
.svc-hub-nav__card {
	display: flex; flex-direction: column;
	gap: 14px;
	padding: 36px 32px;
	background: #fff;
	color: var(--c-text);
	border-right: 1px solid var(--c-line);
	border-bottom: 1px solid var(--c-line);
	text-decoration: none;
	transition: background .25s var(--ease-out), border-color .25s var(--ease-out);
}
.svc-hub-nav__icon {
	display: inline-grid;
	place-items: center;
	width: 44px; height: 44px;
	background: var(--c-accent-bg);
	color: var(--c-accent);
	margin-bottom: 4px;
}
.svc-hub-nav__icon svg { width: 20px; height: 20px; }
.svc-hub-nav__card:hover .svc-hub-nav__icon {
	background: var(--c-accent);
	color: #fff;
}
.svc-hub-nav__card:hover {
	background: var(--c-bg-soft);
	color: var(--c-text);
	text-decoration: none;
}
.svc-hub-nav__q {
	font-size: 1.0625rem;
	color: var(--c-ink);
	font-weight: 700;
	margin: 0;
	padding-bottom: 14px;
	border-bottom: 1px solid var(--c-line);
	line-height: 1.5;
}
.svc-hub-nav__a {
	font-size: .9375rem;
	color: var(--c-text-soft);
	margin: 0;
	line-height: 1.85;
}
.svc-hub-nav__a strong {
	color: var(--c-accent);
	font-weight: 700;
}

@media (max-width: 900px) {
	.svc-hub-nav__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
	.svc-hub-nav__grid { grid-template-columns: 1fr; border-left: none; }
	.svc-hub-nav__card { border-right: none; }
}

/* ==========================================================================
   16. services hub: 組み合わせパッケージ
   ========================================================================== */
.svc-hub-bundle__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.svc-hub-bundle__card {
	background: #fff;
	border: 1px solid var(--c-line);
	padding: 36px 32px;
	display: flex;
	flex-direction: column;
	gap: 16px;
	transition: border-color .25s var(--ease-out);
}
.svc-hub-bundle__icons {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 8px;
}
.svc-hub-bundle__icon {
	display: inline-grid;
	place-items: center;
	width: 44px; height: 44px;
	background: var(--c-accent-bg);
	color: var(--c-accent);
	border: 1px solid var(--c-line);
}
.svc-hub-bundle__icon svg { width: 22px; height: 22px; }
.svc-hub-bundle__plus {
	font-family: var(--ff-en);
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--c-muted);
}
.svc-hub-bundle__card--featured .svc-hub-bundle__icon {
	background: rgba(255,255,255,.1);
	border-color: rgba(255,255,255,.2);
	color: #fff;
}
.svc-hub-bundle__card--featured .svc-hub-bundle__plus {
	color: rgba(255,255,255,.55);
}
.svc-hub-bundle__card:hover { border-color: var(--c-accent); }
.svc-hub-bundle__card--featured {
	background: var(--c-ink-deep);
	color: rgba(255,255,255,.9);
	border-color: var(--c-ink-deep);
}
.svc-hub-bundle__lbl {
	font-family: var(--ff-en);
	font-size: .6875rem;
	color: var(--c-accent);
	letter-spacing: .22em;
	margin: 0;
	font-weight: 500;
}
.svc-hub-bundle__h {
	font-family: var(--ff-en);
	font-size: 1.5rem;
	color: var(--c-ink);
	margin: 0;
	font-weight: 700;
	letter-spacing: -.01em;
}
.svc-hub-bundle__card--featured .svc-hub-bundle__h { color: #fff; }
.svc-hub-bundle__card--featured .svc-hub-bundle__lbl { color: var(--c-accent-on-ink); } /* v1.3.0：濃紺の地の上の差し色 */
.svc-hub-bundle__p {
	font-size: .9375rem;
	color: var(--c-text-soft);
	margin: 0;
	line-height: 1.85;
	flex: 1;
}
.svc-hub-bundle__card--featured .svc-hub-bundle__p { color: rgba(255,255,255,.65); }
.svc-hub-bundle__list {
	list-style: none;
	padding: 16px 0 0;
	margin: 0;
	border-top: 1px solid var(--c-line);
	display: flex;
	flex-wrap: wrap;
	gap: 8px 16px;
}
.svc-hub-bundle__card--featured .svc-hub-bundle__list {
	border-top-color: rgba(255,255,255,.16);
}
.svc-hub-bundle__list li {
	font-size: .8125rem;
}
.svc-hub-bundle__list li a {
	color: var(--c-ink);
	text-decoration: none;
	font-weight: 600;
	padding-bottom: 2px;
	border-bottom: 1px solid var(--c-accent);
}
.svc-hub-bundle__list li a:hover { color: var(--c-accent); }
.svc-hub-bundle__card--featured .svc-hub-bundle__list li a {
	color: #fff;
	border-bottom-color: var(--c-accent-on-ink); /* v1.3.0：濃紺の地の上の下線（#1D4ED8 では見えない） */
}

@media (max-width: 900px) {
	.svc-hub-bundle__grid { grid-template-columns: 1fr; max-width: 560px; margin: 0 auto; }
}