@charset "utf-8";

/*
 * 하위 페이지 좌우 여백을 홈 화면과 같게 맞춘다 (2026-11-05 추가, appLayout 전 페이지 공통)
 *
 * 홈(sh_main.css)의 규칙: 섹션 좌우 여백 --page-pad 12% (1,400px 이하 8%, 768px 이하 20px),
 * 본문 최대 폭 1,440px.
 * 하위 페이지는 원래 "최대 1,280px + 좌우 24px" 였는데, 이를 홈과 같은 여백·최대 폭으로 바꾼다.
 *
 * --home-pad: 본문 안쪽 여백. % 는 쓰이는 곳(본문 래퍼)의 부모 폭 기준이라 홈과 같은 값이 된다.
 *   max(12%, (100% - 1440px) / 2) → 본문 폭 = min(1,440px, 화면의 76%)
 *
 * 되돌리려면 appLayout.html 의 이 파일 link 한 줄만 지우면 된다.
 */
html:root {
	--home-pad: max(12%, (100% - 1440px) / 2);
}

@media (max-width: 1400px) {
	html:root {
		--home-pad: 8%;
	}
}

@media (max-width: 768px) {
	html:root {
		--home-pad: 20px;
	}

	/* 뉴스룸은 모바일에서 여백을 변수 없이 16px 로 직접 쓴다 */
	html .nr-inner {
		padding-left: var(--home-pad);
		padding-right: var(--home-pad);
	}
}

/* 페이지별 여백·최대 폭 변수 (각 CSS 의 값보다 우선) */
html:root,
html .cv,
html .rs,
html .nr-page {
	--bd-pad: var(--home-pad);
	--nr-pad: var(--home-pad);
	--ev-pad: var(--home-pad);
	--cis-pad: var(--home-pad);
	--cv-pad: var(--home-pad);
	--ci-pad: var(--home-pad);
	--dir-pad: var(--home-pad);
	--eth-pad: var(--home-pad);
	--iq-pad: var(--home-pad);
	--pp-pad: var(--home-pad);
	--rc-pad: var(--home-pad);
	--rs-pad: var(--home-pad);
	--wf-pad: var(--home-pad);
	--ct-pad: var(--home-pad);
	--pd-pad: var(--home-pad);
	--pl-pad: var(--home-pad);

	--bd-max: none;
	--nr-max: none;
	--ev-max: none;
	--cv-max: none;
	--ci-max: none;
	--dir-max: none;
	--iq-max: none;
	--rc-max: none;
	--rs-max: none;
	--ct-max: none;
	--pd-max: none;
	--pl-max: none;
}

/* 최대 폭을 1,280px 로 직접 쓰는 본문 래퍼 */
html .ci-block__inner,
html .eth-inner,
html .pp-inner,
html .wf-inner {
	max-width: none;
}

/* 여백도 24px 로 직접 쓰는 본문 래퍼 (세로 여백은 그대로) */
html .bd-detail,
html .qs-inner {
	max-width: none;
	padding-left: var(--home-pad);
	padding-right: var(--home-pad);
}

/* 스마트계좌: 여백 대신 폭으로 맞추는 본문 */
html .sa-inner {
	width: calc(100% - 2 * var(--home-pad));
}
