/*
 * 회장 인사말(/chairman) — 이미지 한 장이던 본문을 글자로 (문서 43066766 본문 .cm-v2)
 * layout.html 에서 $mid == 'chairman' 일 때만 불러온다. 모든 선택자는 .cm-v2 안.
 * 움직임: js/chairman_v2.js 가 .cm-in 클래스를 붙이면 떠오름·형광펜 그어짐 (동작 줄이기 설정이면 즉시 표시)
 */
.cm-v2 {
	--cm-navy: #1e2b45;
	--cm-deep: #12305f;
	--cm-teal: #2f8fa3;
	--cm-ink: #3a4352;
	--cm-hl: rgba(127, 214, 228, .38);
	max-width: 880px;
	margin: 0 auto;
	padding: 8px 4px 40px;
	color: var(--cm-ink);
	font-family: 'Nanum Gothic', 'Noto Sans KR', sans-serif;
	font-size: 17px;
	line-height: 1.9;
	letter-spacing: -.2px;
	word-break: keep-all;
}
.cm-v2 p { margin: 0 0 1.1em; }

/* 머리말 */
.cm-v2 .cm-crumb {
	display: inline-block;
	margin: 0 0 22px;
	padding: 4px 12px;
	border-radius: 14px;
	background: #eaf6f8;
	color: var(--cm-teal);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0;
}
.cm-v2 .cm-hero {
	position: relative;
	display: grid;
	grid-template-columns: 1fr 230px;
	align-items: center;
	gap: 28px;
	padding: 34px 36px;
	border-radius: 24px;
	background: linear-gradient(135deg, #f3fafb 0%, #eaf6f8 55%, #ddf0f4 100%);
	overflow: hidden;
}
.cm-v2 .cm-hero::before {
	content: "\201C";
	position: absolute;
	left: 18px;
	top: -18px;
	color: rgba(47, 143, 163, .14);
	font: 700 150px/1 Georgia, 'Times New Roman', serif;
	pointer-events: none;
}
.cm-v2 .cm-title {
	position: relative;
	margin: 0 0 10px;
	padding: 0;
	border: 0;
	color: var(--cm-deep);
	font-family: 'Noto Serif KR', 'Nanum Myeongjo', serif;
	font-size: 34px;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: -1px;
}
.cm-v2 .cm-sub {
	position: relative;
	margin: 0;
	color: var(--cm-teal);
	font-family: 'Noto Serif KR', 'Nanum Myeongjo', serif;
	font-size: 22px;
	font-weight: 600;
	line-height: 1.5;
}
.cm-v2 .cm-photo { position: relative; width: 210px; height: 210px; justify-self: center; }
.cm-v2 .cm-photo img {
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	box-shadow: 0 14px 34px rgba(18, 48, 95, .18);
}
.cm-v2 .cm-bub { position: absolute; border-radius: 50%; animation: cm-float 7s ease-in-out infinite; }
.cm-v2 .cm-bub.b1 { left: -18px; top: -14px; width: 62px; height: 62px; background: rgba(127, 214, 228, .35); }
.cm-v2 .cm-bub.b2 { right: -20px; bottom: 30px; width: 52px; height: 52px; background: rgba(113, 201, 168, .3); animation-delay: -2.5s; }
.cm-v2 .cm-bub.b3 { right: 10px; bottom: -16px; width: 34px; height: 34px; background: rgba(127, 214, 228, .45); z-index: 2; animation-delay: -4.5s; }
@keyframes cm-float { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(4px, -9px); } }

/* 본문 */
.cm-v2 .cm-body { margin-top: 36px; padding: 0 8px; }
.cm-v2 .cm-lead { color: var(--cm-navy); font-size: 18.5px; font-weight: 700; }
/* 강조: 형광펜(왼쪽→오른쪽으로 그어짐) */
.cm-v2 mark {
	padding: 0 2px;
	background: linear-gradient(transparent 52%, var(--cm-hl) 52%) no-repeat;
	background-size: 100% 100%;
	color: var(--cm-navy);
	font-weight: 800;
	transition: background-size .9s cubic-bezier(.3, .8, .3, 1) .25s;
}
.cm-v2 .cm-big { font-size: 1.12em; }

/* 운영위원회 목표 */
.cm-v2 .cm-goal {
	position: relative;
	margin: 44px 0 40px;
	padding: 34px 28px 30px;
	border-radius: 22px;
	background: var(--cm-deep);
	color: #fff;
	text-align: center;
	overflow: hidden;
}
.cm-v2 .cm-goal::before, .cm-v2 .cm-goal::after {
	content: "";
	position: absolute;
	border-radius: 50%;
	background: rgba(127, 214, 228, .12);
}
.cm-v2 .cm-goal::before { left: -40px; top: -60px; width: 180px; height: 180px; }
.cm-v2 .cm-goal::after { right: -30px; bottom: -70px; width: 160px; height: 160px; }
.cm-v2 .cm-goal-tag {
	position: relative;
	display: inline-block;
	margin-bottom: 14px;
	padding: 5px 16px;
	border: 1px solid rgba(255, 255, 255, .35);
	border-radius: 18px;
	color: #bfe9f0;
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0;
}
.cm-v2 .cm-goal-text {
	position: relative;
	margin: 0;
	font-family: 'Noto Serif KR', 'Nanum Myeongjo', serif;
	font-size: 28px;
	font-weight: 600;
	line-height: 1.55;
	letter-spacing: -.6px;
}
.cm-v2 .cm-goal-text b { color: #7fd6e4; font-weight: 800; }

.cm-v2 .cm-thanks {
	margin: 34px 0 0;
	color: var(--cm-navy);
	font-family: 'Noto Serif KR', 'Nanum Myeongjo', serif;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.5;
}
.cm-v2 .cm-sign {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 12px;
	margin-top: 26px;
	color: var(--cm-ink);
	font-size: 15px;
	font-weight: 700;
}
.cm-v2 .cm-sign img { display: block; width: 210px; height: auto; }

/* 등장 모션 (JS 가 .cm-anim 을 붙인 경우에만) */
.cm-v2.cm-anim .cm-rv { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s cubic-bezier(.3, .8, .3, 1); }
.cm-v2.cm-anim .cm-rv.cm-in { opacity: 1; transform: none; }
.cm-v2.cm-anim mark { background-size: 0% 100%; }
.cm-v2.cm-anim .cm-in mark, .cm-v2.cm-anim mark.cm-in { background-size: 100% 100%; }

@media (max-width: 768px) {
	.cm-v2 { padding: 4px 2px 30px; font-size: 16px; line-height: 1.85; }
	.cm-v2 .cm-hero { grid-template-columns: 1fr; gap: 20px; padding: 26px 20px 28px; text-align: center; }
	.cm-v2 .cm-photo { order: -1; width: 150px; height: 150px; }
	.cm-v2 .cm-title { font-size: 25px; }
	.cm-v2 .cm-sub { font-size: 17px; }
	.cm-v2 .cm-body { margin-top: 26px; padding: 0 4px; }
	.cm-v2 .cm-lead { font-size: 17px; }
	.cm-v2 .cm-goal { margin: 34px 0 30px; padding: 28px 18px 24px; }
	.cm-v2 .cm-goal-text { font-size: 21px; }
	.cm-v2 .cm-thanks { font-size: 19px; }
	.cm-v2 .cm-sign { flex-wrap: wrap; gap: 6px 10px; font-size: 14px; }
	.cm-v2 .cm-sign img { width: 170px; }
}
@media (prefers-reduced-motion: reduce) {
	.cm-v2 .cm-bub { animation: none; }
	.cm-v2 mark { transition: none; }
}
