/* 私たちについて（/about/）。共通部品は assets/css/info.css */
.about-msg__box {
	display: grid; grid-template-columns: 220px minmax(0, 1fr); grid-template-rows: auto 1fr;
	grid-template-areas: "ph text" "name text"; column-gap: 36px; row-gap: 10px; align-items: start;
	padding: 30px 36px; background: var(--white); border: 2px solid var(--ink); box-shadow: 8px 8px 0 var(--teal);
}
.about-msg__ph { grid-area: ph; height: 220px; font-size: 13px; }
.about-msg__ph small { font-size: 11px; }
.about-msg__name { grid-area: name; font-weight: 900; font-size: 17px; line-height: 1.6; text-align: center; }
.about-msg__text { grid-area: text; font-size: 16.5px; line-height: 2.1; }

.about-prom { gap: 18px; }
.about-prom__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.about-prom__item {
	display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "n title" "text text";
	column-gap: 12px; align-items: baseline; padding: 18px 22px; background: var(--white); border: 2px solid var(--ink);
}
.about-prom__n { grid-area: n; font-family: var(--f-hand); font-weight: 600; font-size: 30px; line-height: 1; color: var(--red); }
.about-prom__title { grid-area: title; font-weight: 900; font-size: 18.5px; line-height: 1.5; }
.about-prom__text { grid-area: text; margin-top: 6px; font-size: 15px; line-height: 1.9; color: var(--gray); }

.about-org { gap: 18px; }
.about-org__box { padding: 20px 24px; background: var(--tint); border: 2px solid var(--ink); font-size: 16px; line-height: 2; }
.about-org__link { font-weight: 700; color: var(--ink); }

.about-prof { gap: 20px; }

@media (max-width: 1023.98px) {
	.about-prom__list { grid-template-columns: 1fr; }
}

@media (max-width: 767.98px) {
	.about-msg__box {
		grid-template-columns: 96px minmax(0, 1fr); grid-template-rows: auto auto;
		grid-template-areas: "ph name" "text text"; column-gap: 14px; row-gap: 14px; align-items: center;
		padding: 18px 16px; box-shadow: 4px 4px 0 var(--teal);
	}
	.about-msg__ph { width: 96px; height: 96px; padding: 0 4px; font-size: 11px; line-height: 1.5; }
	.about-msg__name { font-size: 16px; text-align: left; }
	.about-msg__text { font-size: 15px; line-height: 2; }

	.about-prom__list { display: flex; flex-direction: column; gap: 10px; }
	.about-prom__item { grid-template-columns: 22px minmax(0, 1fr); grid-template-areas: "n title" "n text"; align-items: start; padding: 14px; }
	.about-prom__n { font-size: 28px; }
	.about-prom__title { font-size: 16px; line-height: 1.55; }
	.about-prom__text { margin-top: 4px; font-size: 14px; line-height: 1.85; }

	.about-org { gap: 14px; }
	.about-org__box { padding: 16px; font-size: 14.5px; line-height: 1.95; }
	.about-org__link { display: inline-flex; align-items: center; min-height: 44px; }
	.about-prof { gap: 14px; }
}

/* 2026-10-12：約束ごとのリンク、工事の体制の1行目 */
.about-prom__item { grid-template-areas: "n title" "text text" "link link"; }
.about-prom__link { grid-area: link; justify-self: start; margin-top: 8px; font-weight: 700; font-size: 14.5px; color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.about-org__lead { font-weight: 900; font-size: 18px; line-height: 1.7; }
@media (max-width: 767.98px) {
	.about-prom__item { grid-template-areas: "n title" "n text" "n link"; }
	.about-prom__link { display: inline-flex; align-items: center; min-height: 44px; margin-top: 2px; font-size: 14px; }
	.about-org__lead { font-size: 16px; }
}

/* 2026-10-13：代表の似顔絵を入れる（正方形・丸く切らない） */
.about-msg__pic { display: block; width: 220px; height: 220px; object-fit: cover; background: var(--tint); border: 2px solid var(--ink); }
@media (max-width: 767.98px) {
	.about-msg__pic { width: 96px; height: 96px; padding: 0; }
}

/* 番号のブランドの「1」は、ほかの番号と左をそろえる */
.about-prom__n .one svg { margin: 0; }