@charset "UTF-8";
/* ============================================================
   company.css — 会社概要ページ専用（page-company.php でのみenqueue）
   PRESIDENT'S MESSAGE / Parallax Divider / OUR MISSION / OVERVIEW
   配色・フォント・余白はサイト共通トークン（style.css :root）を使用
   ============================================================ */

/* ===== Hero（画像なしタイトルヘッダー。FAQ/リーガルと余白を統一） ===== */
.hero--title {
	padding-top: calc(var(--h-header) + 11.8rem); /* PC: 92 + 118 = 210px */
}
@media (max-width: 767px) {
	.hero--title {
		padding-top: calc(var(--h-header) + 9rem); /* SP: 60 + 90 = 150px */
	}
}

/* ===== セクション共通 ===== */
.company-message__inner,
.company-mission__inner,
.company-overview__inner {
	max-width: var(--s-content-max);
	margin: 0 auto;
	text-align: center;
}

/* ===== PRESIDENT'S MESSAGE ===== */
.company-message {
	padding: var(--s-section-y) var(--s-page-x) 0;
}
.company-message__image {
	max-width: 80rem;       /* 800px 静止画像 */
	margin: 5rem auto 0;
}
.company-message__image img {
	display: block;
	width: 100%;
	height: auto;
}
.company-message__heading {
	font-family: var(--f-jp);
	font-size: 2.8rem;      /* 28px */
	font-weight: 500;
	line-height: 1.7;
	letter-spacing: 0.06em;
	color: var(--c-ink);
	margin: 5rem 0 3rem;
}
.company-message__body {
	max-width: 52rem;       /* 520px */
	margin: 0 auto;
	text-align: left;
	font-weight: 300; /* v3.101: 継承400→300（本文統一） */
	color: var(--c-ink-mute);
	font-size: 1.5rem;
	line-height: 2.1;
}
.company-message__body p + p { margin-top: 1.6rem; }
.company-message__signature {
	max-width: 52rem;
	margin: 3.5rem auto 0;
	text-align: right;
	color: var(--c-ink-mute);
	font-size: 1.4rem;
	line-height: 1.9;
}

/* ===== Parallax Divider（feature-section__visual と同サイズ感: 両端40px・高さ580px・Parallax200） ===== */
/* ===== OUR MISSION ===== */
.company-mission {
	padding: var(--s-section-y) var(--s-page-x) 0;
}
/* v3.203: PRESIDENT'S MESSAGE と OUR MISSION の間にも区切り罫線(.company-rule)を追加。
   罫線直後の OUR MISSION は上paddingを0にし、罫線↔OVERVIEW と同じ対称余白に揃える
   （罫線の上下 margin=var(--s-section-y) のみで上下対称。PC/SP ともトークン追従）。 */
.company-rule + .company-mission {
	padding-top: 0;
}
.company-mission__heading {
	font-family: var(--f-jp);
	font-size: 2.8rem;
	font-weight: 500;
	line-height: 1.7;
	letter-spacing: 0.06em;
	color: var(--c-ink);
	margin: 5rem 0 3rem;
}
.company-mission__body {
	max-width: 52rem;
	margin: 0 auto;
	font-weight: 300; /* v3.101: 継承400→300（本文統一） */
	color: var(--c-ink-mute);
	font-size: 1.5rem;
	line-height: 2.1;
}
.company-mission__body p + p { margin-top: 1rem; }

/* ===== 区切り罫線 ===== */
.company-rule {
	width: calc(100% - 2 * var(--s-page-x));
	max-width: var(--s-content-max);
	margin: var(--s-section-y) auto;
	border: 0;
	border-top: 1px solid var(--c-rule);
}

/* ===== OVERVIEW（会社概要表） ===== */
.company-overview {
	padding: 0 var(--s-page-x) var(--s-section-y);
}
.company-overview__list {
	max-width: 72rem;       /* 720px */
	margin: 4rem auto 0;
	text-align: left;
}
.company-overview__row {
	display: grid;
	grid-template-columns: 12rem 1fr;
	gap: 0.5rem 3rem;
	padding: 2rem 0;
	border-bottom: 1px solid var(--c-rule);
	align-items: baseline;
}
.company-overview__row dt {
	color: var(--c-ink-mute);
	font-size: 1.4rem;
	letter-spacing: 0.08em;
}
.company-overview__row dd {
	color: var(--c-ink);
	font-size: 1.5rem;
	line-height: 1.9;
}
.company-overview__row dd a {
	color: var(--c-ink);
	text-decoration: none;
	text-underline-offset: 0.2em;
	word-break: break-all;
	transition: opacity 0.3s ease;
}
.company-overview__row dd a:hover {
	text-decoration: underline;
}

/* ===== SP ===== */
@media (max-width: 768px) {
	.company-message__heading,
	.company-mission__heading { font-size: 2.2rem; }
	.company-message__image { margin-top: 4rem; }
	.company-message__heading,
	.company-mission__heading { margin: 4rem 0 2.4rem; }
	.company-overview__row {
		grid-template-columns: 1fr;
		gap: 0.4rem;
		padding: 1.6rem 0;
	}
}