@charset "utf-8";
/* ==========================================================================
	글로벌이코노믹 PC 메인 상단 개편 - 신규 스타일
	- 기존 common.css 와 충돌하지 않도록 모든 클래스에 nh_ 접두어 사용
	- 컨텐츠 폭 1200px (기존 .top_in 과 동일)
	========================================================================== */

/* --------------------------------------------------------------------------
	0. 공통 변수 / 리셋 (nh_ 영역 내부에서만)
	-------------------------------------------------------------------------- */
:root {
	--nh-point: #ce0f4c;		/* 브랜드 포인트 컬러 (기존 검색창 테두리색) */
	--nh-text: #222222;
	--nh-text-sub: #666666;
	--nh-line: #e5e5e5;
	--nh-line-dark: #222222;
	--nh-width: 1200px;
}

.nh_header *,
.nh_side *,
.nh_dim {
	box-sizing: border-box;
}

.nh_header ul,
.nh_side ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.nh_header a,
.nh_side a {
	color: inherit;
	text-decoration: none;
}

.nh_header a:hover,
.nh_side a:hover {
	text-decoration: none;
}

.nh_blind {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

.nh_in {
	position: relative;
	width: var(--nh-width);
	margin: 0 auto;
	line-height: 1;
}

/* --------------------------------------------------------------------------
	1. 헤더 전체
	-------------------------------------------------------------------------- */
.nh_header {
	position: relative;
	background: #ffffff;
	color: var(--nh-text);
	font-size: 16px;
	line-height: 1.4;
	z-index: 100;
}

/* --------------------------------------------------------------------------
	1-1. 유틸 바 (패밀리사이트 / 언어)
	-------------------------------------------------------------------------- */
.nh_util {
	border-bottom: 1px solid var(--nh-line);
}

.nh_util .nh_in {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 36px;
}

.nh_family {
	display: flex;
	align-items: center;
}

.nh_family li {
	position: relative;
	padding: 0 12px;
}

.nh_family li:first-child {
	padding-left: 0;
}

.nh_family li + li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 1px;
	height: 11px;
	margin-top: -5px;
	background: #cccccc;
}

.nh_family a {
	display: block;
	font-size: 13px;
	line-height: 36px;
	color: var(--nh-text-sub);
}

.nh_family a:hover {
	color: var(--nh-point);
}

.nh_lang {
	display: flex;
	align-items: center;
}

.nh_lang li + li {
	margin-left: 8px;
}

.nh_lang a {
	display: block;
}

.nh_lang img {
	display: block;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}

.nh_lang a:hover img {
	box-shadow: 0 0 0 2px var(--nh-point);
}

/* --------------------------------------------------------------------------
	1-2. 브랜드 바 (날짜·기온 / 로고 / SNS·검색)
	-------------------------------------------------------------------------- */
.nh_brand .nh_in {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 96px;
}

.nh_wd {
	width: 340px;
}

.nh_wd .nh_date {
	font-size: 13px;
	line-height: 18px;
	color: var(--nh-text-sub);
}

.nh_wd .nh_temp {
	font-size: 20px;
	line-height: 24px;
	font-weight: 700;
	color: var(--nh-text);
}

.nh_wd .nh_temp span {
	display: inline-block;
	margin-left: 3px;
	font-size: 14px;
	font-weight: 400;
	color: var(--nh-text-sub);
}

.nh_logo {
	margin: 0;
	padding: 0;
	font-size: 0;
	line-height: 0;
}

.nh_logo a {
	display: block;
}

.nh_logo img {
	display: block;
	width: 365px;
	height: 50px;
}

.nh_tools {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	width: 340px;
}

.nh_sns {
	display: flex;
	align-items: center;
}

.nh_sns li {
	margin-left: 8px;
}

.nh_sns a {
	display: block;
	width: 30px;
	height: 30px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100%;
}

.nh_sns .nh_sns_fb a { background-image: url(https://nimage.g-enews.com/g_www/css/nt_sns01.png); }
.nh_sns .nh_sns_x a { background-image: url(https://nimage.g-enews.com/g_www/css/nt_sns02.png?pp=001); }
.nh_sns .nh_sns_yt a { background-image: url(https://nimage.g-enews.com/g_www/css/nt_sns04.png); }
.nh_sns .nh_sns_tg a { background-image: url(https://nimage.g-enews.com/g_www/css/nt_sns05.png); }

.nh_search {
	display: flex;
	align-items: center;
	flex: none;
	margin-left: 14px;
	height: 34px;
	border: 1px solid #cccccc;
	border-radius: 17px;
	background: #ffffff;
	overflow: hidden;
}

.nh_search:focus-within {
	border-color: var(--nh-point);
}

.nh_search input {
	width: 120px;
	height: 32px;
	padding: 0 6px 0 14px;
	border: 0;
	outline: 0;
	font-size: 14px;
	color: var(--nh-text);
	background: transparent;
}

.nh_search button {
	flex: none;
	width: 34px;
	height: 32px;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
	position: relative;
}

/* 돋보기 아이콘 (CSS) */
.nh_search button::before {
	content: "";
	position: absolute;
	left: 8px;
	top: 7px;
	width: 11px;
	height: 11px;
	border: 2px solid var(--nh-text);
	border-radius: 50%;
}

.nh_search button::after {
	content: "";
	position: absolute;
	left: 20px;
	top: 19px;
	width: 7px;
	height: 2px;
	background: var(--nh-text);
	transform: rotate(45deg);
}

/* --------------------------------------------------------------------------
	1-3. GNB
	-------------------------------------------------------------------------- */
.nh_gnb {
	border-top: 1px solid var(--nh-line);
	border-bottom: 2px solid #cf054b;
}

.nh_gnb .nh_in {
	display: flex;
	align-items: center;
	height: 52px;
}

/* 햄버거 버튼 */
.nh_menu_btn {
	position: relative;
	width: 44px;
	height: 52px;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
	flex: none;
}

.nh_menu_btn span,
.nh_menu_btn span::before,
.nh_menu_btn span::after {
	position: absolute;
	left: 10px;
	width: 24px;
	height: 2px;
	background: var(--nh-text);
	border-radius: 1px;
}

.nh_menu_btn span {
	top: 25px;
}

.nh_menu_btn span::before,
.nh_menu_btn span::after {
	content: "";
	left: 0;
}

.nh_menu_btn span::before {
	top: -8px;
}

.nh_menu_btn span::after {
	top: 8px;
}

.nh_menu_btn:hover span,
.nh_menu_btn:hover span::before,
.nh_menu_btn:hover span::after {
	background: var(--nh-point);
}

/* 대분류 메뉴 */
.nh_gnb_list {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex: 1;
	margin-left: 6px;
}

.nh_gnb_list > li {
	position: relative;
}

.nh_gnb_list > li > a {
	display: block;
	padding: 0 8px;
	font-size: 17px;
	line-height: 50px;
	font-weight: 600;
	color: var(--nh-text);
	letter-spacing: -0.5px;
	white-space: nowrap;
}

.nh_gnb_list > li > a::after {
	content: "";
	position: absolute;
	left: 8px;
	right: 8px;
	bottom: 0;
	height: 3px;
	background: var(--nh-point);
	transform: scaleX(0);
	transition: transform 0.15s ease;
}

.nh_gnb_list > li > a:hover,
.nh_gnb_list > li.nh_on > a {
	color: var(--nh-point);
}

.nh_gnb_list > li > a:hover::after,
.nh_gnb_list > li.nh_on > a::after {
	transform: scaleX(1);
}

/* --------------------------------------------------------------------------
	2. 햄버거 슬라이드 패널 (조선일보형 왼쪽 패널)
	-------------------------------------------------------------------------- */
.nh_dim {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.45);
	z-index: 1000;
}

.nh_dim.nh_show {
	display: block;
}

.nh_side {
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	width: 320px;
	background: #ffffff;
	box-shadow: 4px 0 16px rgba(0, 0, 0, 0.15);
	transform: translateX(-100%);
	transition: transform 0.25s ease;
	z-index: 1001;
	display: flex;
	flex-direction: column;
	font-size: 16px;
	line-height: 1.4;
	color: var(--nh-text);
}

.nh_side.nh_show {
	transform: translateX(0);
}

/* 패널 상단 (닫기 / 검색) */
.nh_side_head {
	display: flex;
	align-items: center;
	height: 56px;
	padding: 0 8px 0 12px;
	border-bottom: 1px solid var(--nh-line);
	flex: none;
}

.nh_side_close {
	position: relative;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
}

.nh_side_close::before,
.nh_side_close::after {
	content: "";
	position: absolute;
	left: 8px;
	top: 19px;
	width: 24px;
	height: 2px;
	background: var(--nh-text);
}

.nh_side_close::before {
	transform: rotate(45deg);
}

.nh_side_close::after {
	transform: rotate(-45deg);
}

.nh_side_close:hover::before,
.nh_side_close:hover::after {
	background: var(--nh-point);
}

.nh_side_search {
	display: flex;
	align-items: center;
	flex: 1;
	height: 36px;
	margin-left: 8px;
	border: 1px solid #cccccc;
	border-radius: 18px;
	overflow: hidden;
}

.nh_side_search:focus-within {
	border-color: var(--nh-point);
}

.nh_side_search input {
	flex: 1;
	height: 34px;
	padding: 0 6px 0 14px;
	border: 0;
	outline: 0;
	font-size: 14px;
	background: transparent;
}

.nh_side_search button {
	position: relative;
	width: 36px;
	height: 34px;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
}

.nh_side_search button::before {
	content: "";
	position: absolute;
	left: 9px;
	top: 8px;
	width: 11px;
	height: 11px;
	border: 2px solid var(--nh-text);
	border-radius: 50%;
}

.nh_side_search button::after {
	content: "";
	position: absolute;
	left: 21px;
	top: 20px;
	width: 7px;
	height: 2px;
	background: var(--nh-text);
	transform: rotate(45deg);
}

/* 패널 본문 (스크롤 영역) */
.nh_side_body {
	flex: 1;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

/* 카테고리 아코디언 */
.nh_cate > li {
	position: relative;
	border-bottom: 1px solid #f0f0f0;
}

.nh_cate > li > a {
	position: relative;
	display: block;
	padding: 0 44px 0 20px;
	font-size: 16px;
	line-height: 50px;
	font-weight: 600;
	color: var(--nh-text);
}

.nh_cate > li > a:hover {
	color: var(--nh-point);
}

/* 하위 분류 토글 버튼 (>) */
.nh_cate_tgl {
	position: absolute;
	right: 8px;
	top: 5px;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
}

.nh_cate_tgl::before {
	content: "";
	position: absolute;
	left: 14px;
	top: 15px;
	width: 8px;
	height: 8px;
	border-right: 2px solid #999999;
	border-bottom: 2px solid #999999;
	transform: rotate(-45deg);
	transition: transform 0.15s ease;
}

.nh_cate > li.nh_open .nh_cate_tgl::before {
	transform: rotate(45deg);
	top: 12px;
	border-color: var(--nh-point);
}

.nh_cate > li.nh_open > a {
	color: var(--nh-point);
}

/* .nh_side ul {padding:0} 리셋보다 우선하도록 .nh_side 를 붙여 우선순위 확보 */
.nh_side .nh_cate_sub {
	display: none;
	padding: 8px 20px 12px 20px;
	background: #f7f7f7;
}

.nh_cate > li.nh_open .nh_cate_sub {
	display: block;
}

.nh_cate_sub li a {
	display: block;
	padding-left: 12px;
	font-size: 14px;
	line-height: 32px;
	color: #444444;
	position: relative;
}

.nh_cate_sub li a::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 4px;
	height: 4px;
	margin-top: -2px;
	border-radius: 50%;
	background: #bbbbbb;
}

.nh_cate_sub li a:hover {
	color: var(--nh-point);
}

.nh_cate_sub li a:hover::before {
	background: var(--nh-point);
}

/* 패밀리 사이트 / 서비스 링크 */
.nh_side_family {
	margin-top: 10px;
	padding: 6px 0;
	border-top: 6px solid #f2f2f2;
}

.nh_side_family li a {
	display: block;
	padding: 0 20px;
	font-size: 15px;
	line-height: 44px;
	color: #444444;
}

.nh_side_family li a:hover {
	color: var(--nh-point);
}

/* 패널 하단 (SNS) */
.nh_side_foot {
	flex: none;
	padding: 14px 20px;
	border-top: 1px solid var(--nh-line);
	background: #fafafa;
}

.nh_side_foot .nh_sns {
	justify-content: flex-start;
}

.nh_side_foot .nh_sns li {
	margin: 0 12px 0 0;
}

.nh_side_foot .nh_sns a {
	width: 32px;
	height: 32px;
}

/* 패널 열렸을 때 body 스크롤 잠금 */
body.nh_side_open {
	overflow: hidden;
}

/* --------------------------------------------------------------------------
	3. 톱기사 3단 영역 (기획기사 / 톱기사 / 오늘의 PICK)
	- 컨텐츠 폭 1100px (.mcon 내부 폭과 동일)
	- 좌 240 + 25 | 25 + 중앙 460 + 25 | 25 + 우 300
	  (우측 300px 은 하단 컨텐츠 우측 영역(.m_rt) 폭과 동일,
	   우측 세로줄 위치 775px = 하단 .mcon_in 구분선과 동일, 줄 양쪽 여백 25px 동일)
	- 세 컬럼 하단 정렬 : 컬럼을 flex column 으로 두고 가장 긴 컬럼 높이에
	  나머지 컬럼이 늘어나면서(space-between) 하단이 맞춰짐
	- 이미지 비율 16:9 통일 (기획 240x135 / 톱 460x259)
	-------------------------------------------------------------------------- */
.nh_top {
	display: flex;
	align-items: stretch;
	width: 1100px;
	margin: 24px auto 40px auto;
	font-size: 16px;
	line-height: 1.4;
	color: var(--nh-text);
	box-sizing: border-box;
}

.nh_top *,
.nh_top *::before,
.nh_top *::after {
	box-sizing: border-box;
}

.nh_top ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.nh_top a {
	color: inherit;
	text-decoration: none;
}

.nh_top img {
	display: block;
	width: 100%;
	height: auto;
}

/* 말줄임 (n줄) */
.nh_clamp2,
.nh_clamp3 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.nh_clamp2 {
	-webkit-line-clamp: 2;
}

.nh_clamp3 {
	-webkit-line-clamp: 3;
}

/* 컬럼 공통 */
.nh_top_lt,
.nh_top_ct,
.nh_top_rt {
	display: flex;
	flex-direction: column;
	flex: none;
}

.nh_top_lt {
	width: 265px;
	padding-right: 25px;
	border-right: 1px solid var(--nh-line);
}

.nh_top_ct {
	width: 510px;
	padding: 0 25px;
}

.nh_top_rt {
	width: 325px;
	padding-left: 25px;
	border-left: 1px solid var(--nh-line);
}

/* 컬럼 제목 */
.nh_top_tit {
	position: relative;
	flex: none;
	margin: 0 0 14px 0;
	padding: 0 0 10px 0;
	border-bottom: 2px solid var(--nh-line-dark);
	font-size: 19px;
	line-height: 26px;
	font-weight: 700;
	color: var(--nh-text);
}

.nh_top_tit a {
	display: inline-block;
	padding-right: 14px;
	position: relative;
}

/* 제목 옆 > 화살표 */
.nh_top_tit a::after {
	content: "";
	position: absolute;
	right: 0;
	top: 9px;
	width: 7px;
	height: 7px;
	border-top: 2px solid #999999;
	border-right: 2px solid #999999;
	transform: rotate(45deg);
}

.nh_top_tit a:hover {
	color: var(--nh-point);
}

.nh_top_tit em {
	font-style: normal;
	color: var(--nh-point);
}

/* 썸네일 공통 : 비율 고정 + 잘라내기 */
.nh_top .nh_thumb {
	display: block;
	overflow: hidden;
	border-radius: 4px;
	background: #f2f2f2;
}

.nh_top .nh_thumb img {
	object-fit: cover;
}

/* --- 기획기사 (좌) --- */
.nh_plan {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	row-gap: 20px;
}

.nh_plan .nh_thumb img {
	width: 240px;
	height: 135px;		/* 16:9 */
	transition: transform 0.2s ease;
}

.nh_plan a:hover .nh_thumb img {
	transform: scale(1.03);
}

.nh_plan .nh_ttl {
	display: -webkit-box;
	margin-top: 10px;
	height: 46px;		/* 2줄 고정 (높이 일정하게) */
	font-size: 16px;
	line-height: 23px;
	font-weight: 500;
	color: var(--nh-text);
}

.nh_plan a:hover .nh_ttl {
	color: var(--nh-point);
}

/* --- 톱기사 (중앙) --- */
.nh_headline {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;		/* 이미지-제목 붙여서 위에서부터 배치 (하단은 좌·우 컬럼보다 조금 짧아도 됨) */
	margin: 0;
}

.nh_headline .nh_thumb img {
	width: 460px;
	height: 259px;		/* 16:9 */
}

.nh_headline_txt {
	padding-top: 14px;
}

.nh_headline .nh_ttl {
	display: -webkit-box;
	-webkit-line-clamp: 2;		/* 최대 2줄 + 말줄임 */
	max-height: 80px;
	margin: 0;
	font-size: 30px;
	line-height: 40px;
	font-weight: 700;
	color: var(--nh-text);
	text-align: center;
	letter-spacing: -1px;
	word-break: keep-all;
}

.nh_headline .nh_ttl a:hover {
	color: var(--nh-point);
}

.nh_headline .nh_rel {
	margin-top: 16px;
}

/* 관련기사가 없을 때 : 2줄 써머리 (nh_rel 대신 사용) */
.nh_headline .nh_summary {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	margin: 12px 0 0 0;
	max-height: 46px;
	font-size: 15px;
	line-height: 23px;
	font-weight: 400;
	color: var(--nh-text-sub);
}

.nh_headline .nh_rel li + li {
	margin-top: 10px;
}

.nh_headline .nh_rel a {
	display: block;
	position: relative;
	padding-left: 14px;
	font-size: 15px;
	line-height: 22px;
	font-weight: 500;
	color: var(--nh-text-sub);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ㄴ 모양 관련기사 불릿 */
.nh_headline .nh_rel a::before {
	content: "";
	position: absolute;
	left: 1px;
	top: 3px;
	width: 7px;
	height: 8px;
	border-left: 1px solid #999999;
	border-bottom: 1px solid #999999;
}

.nh_headline .nh_rel a:hover {
	color: var(--nh-point);
}

/* --- 오늘의 PICK (우) --- */
.nh_pick {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.nh_pick li {
	flex: 1;
	display: flex;
	align-items: center;
	border-bottom: 1px solid var(--nh-line);
}

.nh_pick li:last-child {
	border-bottom: 1px solid var(--nh-line);		/* 마지막 항목도 중간 구분선과 동일한 하단선 */
}

.nh_pick a {
	display: -webkit-box;
	width: 100%;
	padding: 6px 0;
	font-size: 16px;
	line-height: 23px;
	font-weight: 500;
	color: var(--nh-text);
}

.nh_pick a:hover {
	color: var(--nh-point);
}

/* --------------------------------------------------------------------------
	4. GETV 영역 (좌 영상 + 우 썸네일 2개)
	- 좌측 컨텐츠 폭 750 : 영상 500x281 | 20 | 썸네일 230x130 x 2 (세로 간격 21 → 총 281)
	- 기존 .m9d 의 인라인 height:560 제거, 제목줄(.mtit01)은 기존 스타일 그대로
	-------------------------------------------------------------------------- */
.nh_getv .nh_getv_con {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	width: 750px;
	margin-top: 12px;
}

.nh_getv .nh_getv_con *,
.nh_getv .nh_getv_con *::before,
.nh_getv .nh_getv_con *::after {
	box-sizing: border-box;
}

.nh_getv_main {
	flex: none;
	width: 500px;
	height: 281px;
	background: #efefef;
	border-radius: 4px;
	overflow: hidden;
}

.nh_getv_main iframe {
	display: block;
	width: 500px;
	height: 281px;
	border: 0;
}

.nh_getv_list {
	flex: none;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	width: 230px;
	height: 281px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.nh_getv_list li {
	margin: 0;
	padding: 0;
}

.nh_getv_list a {
	display: block;
	overflow: hidden;
	border-radius: 4px;
	background: #f2f2f2;
}

.nh_getv_list img {
	display: block;
	width: 230px;
	height: 130px;		/* 16:9 */
	object-fit: cover;
	transition: transform 0.2s ease;
}

.nh_getv_list a:hover img {
	transform: scale(1.03);
}