@charset "UTF-8";
/* ==========================================================================
   MELB TOKYO / about.css
   ABOUTページ（page-about.php）専用
   --------------------------------------------------------------------------
   KV → INTRO → MEMORIES → DIFFERENT → PERSON
   ※ KV（.c-pageHero）/ MEMORIES（.c-memories--blue）/
     画像+テキスト（.c-split）/ CTA は common.css
   ========================================================================== */


/* ==========================================================================
   INTRO
   ========================================================================== */

/* 画像（about.png / 575px）が原寸に近い幅で収まる比率 */
.p-aboutIntro .c-split {
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
}

@media screen and (max-width: 1024px) {
	.p-aboutIntro .c-split {
		grid-template-columns: 1fr;
	}
}


/* ==========================================================================
   DIFFERENT（3つの特徴）
   ========================================================================== */
.p-aboutDifferent {
	background-color: var(--color-cream);
}

.p-aboutDifferent__head {
	margin-bottom: 48px;
}

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

.p-aboutDifferent__item {
	padding: 36px 32px 40px;
	border: 1px solid var(--color-line);
	background-color: var(--color-white);
}

/* アイコンは水色の丸背景まで入ったSVG */
.p-aboutDifferent__icon {
	width: 52px;
	height: 52px;
}

.p-aboutDifferent__title {
	margin-top: 24px;
	font-family: var(--font-serif);
	font-size: var(--fs-subheading);
	font-weight: 500;
	letter-spacing: 0.02em;
	line-height: var(--lh-subheading);
}

/* 見出し下の短い罫 */
.p-aboutDifferent__title::after {
	content: "";
	display: block;
	width: 32px;
	height: 2px;
	margin-top: 18px;
	background-color: var(--color-text);
}

.p-aboutDifferent__text {
	margin-top: 18px;
	font-size: var(--fs-text);
	line-height: var(--lh-text);
	color: var(--color-text);
}

@media screen and (max-width: 767px) {
	.p-aboutDifferent__list {
		grid-template-columns: 1fr;
	}
}
