/* ======================== 데스크탑 (1250px~) ======================== */
@media (min-width: 1250px) {
	.mobile { display: none !important; }

	/* 사이드바 헤더 */
	header {
		z-index: 900;
		position: fixed;
		width: 270px;
		height: 100%;
		top: 0;
		background-color: #fff;
		box-shadow: 2px 0px 7px rgba(0,0,0,.1) !important;
		padding: 0 0 30px;
		display: flex !important;
		flex-direction: column;
		justify-content: space-between;
		overflow-y: auto;
		gap: 32px;
	}
	header .head .wrap { text-align: center; }
	header .head .wrap .imgWrap { padding: 28px 0 12px; }
	header .head .wrap .imgWrap img {width:80px;}
	header .head .wrap h1 { font-size:20px; font-weight:800; color: #000; padding-bottom: 5px; letter-spacing: -0.025em; line-height:1.4; }
	header .head .wrap h1 span {display:block; color:var(--c_base1);}
	header .head .wrap p { font-size:12px; font-weight:500; color: #666; letter-spacing: -0.025em; }

	/* GNB — 세로형 */
	nav.mobile { visibility: hidden; }
	nav.pc { flex-grow: 1; }
	nav.pc .wrap { position: relative; display: block; max-width: 1200px; margin: 0 auto; }
	nav.pc .gnb { position: relative; display: block; font-size: 18px; font-weight: 500; }
	nav.pc .gnb .gnb_home { line-height: 1; display: inline-block; width: 100%; text-align: center; padding: 18px 0; color: #000; }
	nav.pc .gnb a.on { color: var(--c_base2); }
	nav.pc .gnb a:hover { color: var(--c_base2); }
	nav.pc .gnb > ul { margin: 0 !important; padding-left: 0; }
	nav.pc .gnb > ul > li { z-index: 0; position: relative; display: flex; justify-content: center; padding: 0 !important; }
	nav.pc .gnb > ul > li.on { z-index: 10; }
	nav.pc .gnb > ul > li > a { line-height: 1; display: inline; text-align: center; padding: 15px 0; color: #000; }
	nav.pc .gnb > ul > li.on > a { color: var(--c_base2); }

	/* 2dep 슬라이드 패널 — 사이드바 우측으로 열림 */
	nav.pc .gnb > ul > li > ul {
		position: fixed;
		left: 270px;
		top: 0;
		width: 0;
		height: 100%;
		overflow: hidden;
		background: var(--c_base1);
		opacity: 0;
		transition: all 0.5s ease;
		box-shadow: 20px 0px 10px rgba(0,0,0,.1);
	}
	nav.pc .gnb > ul > li.on > ul { width: 340px; opacity: 1; }

	/* depth2 padding-top — 메뉴 수에 따라 위치 조정 */
	nav.pc .gnb > ul > li .depth2_company  { padding-top: 328px; }
	nav.pc .gnb > ul > li .depth2_product  { padding-top: 375px; }
	nav.pc .gnb > ul > li .depth2_business { padding-top: 423px; }
	nav.pc .gnb > ul > li .depth2_support  { padding-top: 472px; }
	nav.pc .gnb > ul > li .depth2_facility { padding-top: 520px; }
	nav.pc .gnb > ul > li .depth2_commu    { padding-top: 568px; }

	nav.pc .gnb > ul > li > ul > li a {
		position: relative;
		display: inline-block;
		letter-spacing: 1px;
		margin-bottom: 7px;
		margin-left: 50px;
		opacity: 0;
		padding: 10px 0 2px;
		color: #fff;
		font-size: 16px;
		font-weight: 400;
		transition: .2s;
	}
	nav.pc .gnb > ul > li.on > ul > li a { opacity: 1; }
	nav.pc .gnb > ul > li > ul > li a:before {
		position: absolute;
		display: block;
		left: -20px;
		top: 18px;
		opacity: 0;
		width:3px;
		height:10px;
		border-radius:3px;
		background: var(--c_base5);
		content: "";
		transition: .2s;
	}
	nav.pc .gnb > ul > li > ul > li.on a:before { position: absolute; left: -20px; top: 18px; display: inline-block; width:3px; height: 10px; background: var(--c_base5); border-radius:3px; content: ""; opacity:1; }
	nav.pc .gnb > ul > li > ul > li:last-child { margin-bottom: 20px; }
	nav.pc .gnb > ul > li > ul > li a:hover { color: var(--c_base5); }
	nav.pc .gnb > ul > li > ul > li.on a { color: var(--c_base5); }
	nav.pc .gnb > ul > li > ul > li a:hover:before { opacity: 1; }

	/* 사이드바 하단 파트너 로고 */
	header aside { display: flex; flex-direction: column; align-items: center; justify-content: center; }
	header aside ul li + li { margin-top: 20px; }
	header aside ul li a { display:flex; justify-content:center; align-items: center;}
	header aside ul li a img {max-width:190px; max-height:40px; object-fit:contain; }
}

/* ======================== 모바일 (~1249px) ======================== */
@media (max-width: 1249px) {
	.pc { display: none !important; }

	header { position: relative; left: 0; top: 0; height: 70px; }
	header .head { position: relative; display: flex; align-items: center; width: 100%; height: 70px; }
	header .head .gnbView { position: absolute; display: block; width: 60px; height: 70px; right: 0; top: 0; background: url(/images/common/icon_gnbView.png); background-size: 22px; background-repeat: no-repeat; background-position: center; border-radius: 0; }
	header .head .wrap a { padding-left: 20px; display: flex; align-items: center; gap: 6px; }
	header .head .wrap h1 { font-size:16px; font-weight:800; color: #000; letter-spacing: -0.025em; line-height:1.3; }
	header .head .wrap h1 span {display:block; color:var(--c_base1);}
	header .head .wrap p { display: none; }
	header .head .wrap .imgWrap { height: 2.8rem; }
	header .head .wrap .imgWrap img { height: 100%; }
	header aside ul li { display: none; }

	/* 모바일 GNB */
	nav.mobile { z-index: 9999; position: fixed; visibility: hidden; top: 0; width: 80%; height: 100%; overflow: hidden; background: #fff; box-shadow: 5px 0px 10px rgba(0,0,0,.7) !important; }
	nav.mobile .closeWrap { position: relative; height: 70px; background: #fff; color: #000; border-bottom: 4px solid #eee; }
	nav.mobile .closeWrap .gnbClose { display: block; width: 70px; height: 70px; background: url(/images/common/icon_close.png) no-repeat center; background-size:24px; border-left: 1px solid #efefef; }
	nav.mobile .closeWrap > a { display: inline-block; float: right; height: 50px; color: #fff; font-size: 11px; line-height: 1; }
	nav.mobile .closeWrap aside { position: absolute; top: 50%; transform: translateY(-50%); margin-left: 20px; font-weight: 500; }
	nav.mobile .closeWrap aside a { color: #666; font-size: 14px; }
	.gnbCover { z-index: 9998; position: fixed; left: 0; top: 0; display: none; width: 100%; height: 100%; background: rgba(0,0,0,.5); }

	nav.mobile .gnb * { width: 100% !important; }
	nav.mobile .gnb { position: relative; width: 100%; height: 100%; overflow-y: auto; }
	nav.mobile .gnb .gnb_home { display: none; }
	nav.mobile .gnb > ul > li { clear: both; position: relative; }
	nav.mobile .gnb > ul > li > a { display: block; padding: 18px 20px; color: #000; border-bottom: 1px solid #ddd; font-size: 16px; background: #fff; font-weight: 400; }
	nav.mobile .gnb > ul > li.on > a { color: #fff; background: var(--c_base1); }
	nav.mobile .gnb > ul > li > ul { display: none; }
	nav.mobile .gnb > ul > li > ul > li { position: relative; }
	nav.mobile .gnb > ul > li > ul > li a { display: block; padding: 12px 20px 12px 35px; font-size: 14px; color: #666; border-bottom: 1px solid #eee; background: #f9f9f9; font-weight: 400; }
	nav.mobile .gnb > ul > li > ul > li a:before { display: block; content: ""; width: 3px; height: 3px; background: #666; border-radius: 50%; position: absolute; top: 22px; left: 22px; }
	nav.mobile .gnb > ul > li > ul > li:last-child a { border-bottom: 6px solid #eee; }
	nav.mobile .gnb > ul > li > ul > li.on a { color: var(--c_base2); }
	nav.mobile .gnb > ul > li > ul > li.on a:before {background:var(--c_base2);}
}

/* ======================== 모바일 (0~767px) ======================== */
@media (max-width: 767px) { }