:root {
	--base-color: #000;
	--header-topbar-bgcolor: transparent;
	/* 
	--header-bghover: transparent;
	--header-color: #fff;
	 */
	--header-height : 6.5rem;
	--theme-font : 'GMarketSans', 'Noto Sans KR', 'AppleGothic', 'Malgun Gothic', 'dotum', 'Sans-serif';
}
@font-face {
    font-family: 'GMarketSans';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
    font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: 'GMarketSans';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: 'GMarketSans';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight: 700;
    font-display: swap;
}



@media (min-width: 768px) {

	#header:hover #navigation {
		background:#fff;
	}

	#navigation .logo {
		width: 15rem;
	}
	#navigation .logo IMG {
		margin-top: -1rem;
	}
	#header.fixed #navigation .logo IMG {
		max-height: 100%;
		margin-top: 0;
	}
	#navigation {
		border:1px solid #ddd;
		border-left-width:0;
		border-right-width:0;
		backdrop-filter: blur(7px);
	}

	BODY.MP #header:not(.fixed):not(:hover) #navigation, BODY.MP #header:not(.fixed):not(:hover) #navigation::before {
		border-color: rgba(255,255,255,.3);
		background-color: rgba(255, 255, 255, .2);
	}


	#navigation NAV {
		width: calc(100% - 50rem);
		padding-right:15rem;
		font-family: var(--theme-font);;
	}
	#navigation NAV > UL > LI > A {
		font-size:2rem;
	}



}



/* 푸터 */
#footer .foot_data {
	padding: 7rem 0 3rem;
	color:#bbb;
	text-align:center;
	font-size:1.5rem;
	font-family: var(--theme-font);;

}
#footer .logo {
	width:20rem;
	margin:auto;
}
#footer .logo > IMG {
	width: 100%;
	padding: 0 2rem;
	-webkit-filter: saturate(0) invert(100%);
	filter: saturate(0) invert(100%);
}
#footer .corp {
	font-size: 1.9rem;
	font-weight:800;
	margin: 2.5rem 0 2rem;
}
#footer .warn {
	margin-top: 3rem;
	font-size:1.4rem;
	color:#cc004a94;
}
#footer .copyright {
	height: 7rem;
	display:flex;
	align-items: center;
	justify-content: center;
}

/* 페이지 */
#Channel_Cover {
	width: 100%;
	text-align: center;
	border-bottom: 1px solid #ddd;
}
.channel_navi {
	width:100%;
	height: 5rem;
}
.channel_navi > UL {
	width:100%;
	height:100%;
	display:flex;
	justify-content: flex-end;
}
.channel_navi > UL > LI {
	display: flex;
	align-items: center;
	font-size: 1.5rem;
}
.channel_navi > UL > LI:has(+ LI)::after {
	content: '';
	display: inline-block;
	width: 0.7rem;
	height: 0.7rem;
	margin: 0 1rem;
	border-top: 1px solid black;
	border-right: 1px solid black;
	transform: rotate(45deg);

}
.channel_title {
	width: 100%;

	height: 15rem;
	display:flex;
	align-items: center;
	justify-content: center;

}
.channel_title H2 {
	font-size: 5rem;
	font-family:var(--theme-font);
	font-weight: 500;
}
.channel_menu {
	width:100%;
	height: 7rem;
}
.channel_menu > UL {
	width:100%;
	height:100%;
	display:flex;
	justify-content: center;
}
.channel_menu > UL > LI {
	position: relative;
	display: flex;
	align-items: center;
	margin:0 2rem;

}
.channel_menu > UL > LI.active::after {
	position: absolute;
	left: 0;
	bottom: -1px;
	content: "";
	display: block;
	width: 100%;
	height: 0.75rem;
	background-color: var(--base-color);

}
.channel_menu > UL > LI A {

	width: 100%;
	height: 100%;
	display:flex;
	align-items: center;
	font-size: 2rem;
	padding:0 2rem;
}


section > article:first-child:empty {
	display:none;
}
.channel_cover {
	position: relative;

	display: flex;
	justify-content: center;
	align-items: center;

}
.channel_cover img {
	max-width:100%;
}
.channel_cover h3 {
	position: absolute;
	color:#fff;
	font-size: 6rem;
	line-height: 1;
	font-family:var(--theme-font);
	letter-spacing: -0.25rem;
}
.channel_cover h3 > p {
	margin-top: 5rem;
}


@media (max-width: 768px) {


	.channel_cover {
		height: 50vh;
	}
	.channel_cover img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	.channel_title H2 {
		font-size: 3.5rem;
	}

	.channel_cover h3 {
		font-size: 3rem;
	}
	.channel_cover h3 > p {
		margin-top: 2rem;
	}


	.channel_menu > UL > LI A {
		font-size: 1.8rem;
		padding:0 0.5rem;
	}
}