/* ==================================================
	Typography
================================================== */
.sound-only {
	position: absolute;
	left: -999px;
	width: 0;
	height: 0;
	text-indent: -999px;
	font-size: 0;
	line-height: 0;
	overflow: hidden;
}

/* ==================================================
	header
================================================== */
header {
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	z-index: 100;
}

header.on {
	border-bottom: 1px solid #ddd;
}

header .logo {
	position: relative;
	height: max-content;
	padding: 1.5rem 0;
}

/*header.sitemap .logo a {
	position: fixed;
	z-index: 200;
	top: 19px;
}

header .logo .white {
	display: none;
}

header .logo .color {
	display: block;
}

.mheader.logo .white {
	display: block;
}

.mheader.logo .color {
	display: none;
}

header.index.active .logo .white,
header.index.on .logo .white {
	display: none;
}

header.index.active .logo .color,
header.index.on .logo .color {
	display: block;
}

header.sitemap .logo {
	display: none;
}*/

header>.hinner {
	width: 100%;
	padding: 0 5rem;
	position: relative;
	display: flex;
	justify-content: space-between;
}

header.index>.hinner::after {
	position: absolute;
	bottom: 0;
	width: calc(100% - 10rem);
	height: 1px;
	left: 50%;
	transform: translateX(-50%);
	background-color: rgba(255, 255, 255, 0.2);
	content: '';
}

header .gnb-menu .depth01 {
	display: flex;

}

header.on .depth01>li {
	width: 25rem;
	transition: .5s;
}

header .depth01>li {
	width: 18rem;
	position: relative;
	transition: width .5s;
}

header .depth01>li>a {
	font-size: 2.4rem;
	font-weight: var(--font-sb);
	color: var(--color-black);
	width: 100%;
	display: block;
	text-align: center;
	padding: 3.5rem 0;
	position: relative;
	height: 10rem;
}

.mheader .depth01>li>a {
	color: var(--color-white);
}

.mheader .active .depth01>li>a,
.mheader .on .depth01>li>a,
.mheader .floating .depth01>li>a {
	color: var(--color-black);
}

body.eng header .depth01>li>a {
	font-size: 2rem;
}

header .depth01>li:hover>a,
.mheader .depth01>li:hover>a {
	color: var(--brand-color-main);
}

header .depth01>li.active>a,
header .depth01>li.on>a {
	color: var(--brand-color-main);
}

header .depth01>li.on {
	background-color: var(--color-white);
}

header.on .depth01>li>a::after {
	position: absolute;
	bottom: -2px;
	left: 0;
	content: '';
	width: 100%;
	height: 3px;
	background: linear-gradient(0.25turn, #403B97, #2C3056);
	z-index: 50;
	transform: scale(0);
	transition: .5s;
}

header .depth01>li:hover>a::after {
	transform: scale(1);
}

header .depth02 {
	display: block;
	text-align: center;
	width: 100%;
	box-sizing: border-box;
	padding: 2.5rem 0;
	background-color: #fcfcfc;
	display: none;
}

header.on .depth02 {
	border-top: 1px solid #ddd;
}

header .depth01>li::before {
	width: 1px;
	height: calc(100% - 10rem);
	position: absolute;
	content: '';
	background-color: #dddddd;
	left: 0;
	top: 10rem;
}

header .depth01>li:last-of-type::after {
	width: 1px;
	height: calc(100% - 10rem);
	position: absolute;
	content: '';
	background-color: #dddddd;
	right: 0;
	top: 10rem;
}

header .depth03 {
	display: none;
}

header .depth01>li.on .depth02 {
	background-color: var(--color-white);
}

header .depth02>li>a {
	padding: 1rem 0px 1rem 0;
	color: var(--color-gray);
	font-size: 1.9rem;
	display: inline-block;
}

header .depth02>li>a.more {
	position: relative;
	padding: 1.5rem 2.5rem 1.5rem 0;
}

header .depth02>li.on>a.more::after {
	content: url('../images/gnb/gnb-more-ico.svg');
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
}

header .depth02>li>a.more::after {
	content: url('../images/gnb/gnb-more-gray-ico.svg');
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
}

header .depth02>li.active>a,
header .depth02>li.on>a,
header .depth02>li:hover>a {
	color: var(--color-black);
	font-weight: 500;
}

header .depth03 {
	padding-bottom: 1.5rem;
}

header .depth03 li {
	margin-bottom: 1.5rem;
}

header .depth03 li:last-of-type {
	margin-bottom: 0;
}

header .depth03 li a {
	font-size: 1.8rem;
	color: #666666;
	position: relative;
	display: inline-block;
}

header .depth03 li a:hover {
	color: var(--color-black);
}

header .depth03 li a::after {
	position: absolute;
	content: '';
	width: 0%;
	transition: .3s;
	height: 1px;
	background-color: var(--color-black);
	bottom: 0;
	left: 0;
}

header .depth03 li a:hover::after {
	width: 100%;
}

header .depth03 li a:hover {
	color: var(--color-black);
}

header::before {
	width: 100%;
	position: absolute;
	top: 0px;
	height: 0px;
	content: '';
	background-color: #fcfcfc;
	border-bottom: 1px solid rgba(0, 0, 0, .2);
	transition: 0s;
	z-index: -2;
}

header.on::before,
header.floating::before {
	height: 100%;
	transition: 0s;
}

header::after {
	width: 100%;
	height: 0px;
	background-color: var(--color-white);
	position: absolute;
	content: '';
	top: 0;
	left: 0;
	z-index: -1;
	box-shadow: none;
	transition: 0s;
}

header.active::after,
header.on::after {
	height: 10rem;
	transition: 0s;
	border-bottom: 1px solid #ddd;
}

/* 모바일CSS */
@media screen and (max-width:1700px) {
	header.on .depth01>li {
		width: 20rem;
	}

	header>.hinner {
		padding: 0 2rem;
	}
}

@media screen and (max-width:1640px) {
	header {
		/*display: flex;
		align-items: center;
		height: 10rem;*/
	}

	header .logo {
		width: 22rem;
		padding: 2.2rem 0;
	}

	header .logo img {
		width: 100%;
	}

	header>.hinner {
		padding: 0 2rem;
	}

	header .depth01>li {
		width: 18rem;
	}

	header.on .depth01>li {
		width: 20rem;
	}

	header .depth01>li>a {
		font-size: 2.2rem;
		width: 100%;
		height: 10rem;
		box-sizing: border-box;
	}

	header .depth02>li>a {
		font-size: 2rem;
	}

	header .depth03 li a {
		font-size: 1.8rem;
	}
}

@media screen and (max-width:1200px) {
	header .depth01>li {
		width: 13rem;
	}

	header.on .depth01>li {
		width: 16rem;
	}

	header .depth02>li {
		padding: 0 0.5rem;
		box-sizing: border-box;
	}

	header .depth02>li>a.more {
		padding: 1rem 1.4rem 1rem 0;
	}
	
	header .depth01>li>a {
		font-size: 2rem;
	}

	header .depth02>li>a {
		font-size: 1.8rem;
	}

	header .depth03 li a {
		font-size: 1.6rem;
	}
}

@media screen and (max-width:1024px) {
	header {
		display: flex;
		align-items: center;
		height: 8rem;
	}
}

/* ==================================================
	util-menu
================================================== */
header .util-menu {
	display: flex;
	height: 4.4rem;
	margin: 2.8rem 0;
}

header .util-menu>li {
	display: flex;
	justify-content: center;
	align-items: center;
}

header .lang-btn {
	position: relative;
	width: 7rem;
}

/* S: svg class */
header .logo a {
	display: block;
	width: 100%;
	/* height: 100%; */
}

header .logo i {
	display: block;
	max-width: 100%;
	content: url('../images/gnb/logo.svg?v=0724');
}

.mheader .logo i {
	content: url('../images/gnb/logo_w.svg?v=0724');
}

.mheader .on .logo i,
.mheader .active .logo i,
.mheader .floating .logo i {
	content: url('../images/gnb/logo.svg?v=0724g');
}

header.sitemap .logo i {
	content: url('../images/gnb/logo_w.svg?v=0724');
}

header .lang i {
	display: block;
	width: 3rem;
	height: 3rem;
	background: transparent url('../images/gnb/ico-lang.svg');
	background-size: cover;
	filter: invert(0);
}

.mheader header .lang i {
	filter: invert(1);
}

.mheader .lang {
	color: var(--color-white);
}

.mheader .lang::after {
	content: url('../images/gnb/lang-more-wico.svg');
}

header.sitemap .lang i,
.mheader.lang i {
	filter: invert(1);
}

.mheader .active .lang,
.mheader .on .lang,
.mheader .floating .lang {
	color: var(--color-black);
}

.mheader .active .lang i,
.mheader .on .lang i,
.mheader .floating .lang i {
	filter: invert(0);
}

.mheader .active .lang::after,
.mheader .on .lang::after,
.mheader .floating .lang::after {
	content: url('../images/gnb/lang-more-ico.svg');
}

header .sitemap-btn>a i {
	display: block;
	width: 4.2rem;
	height: 4.2rem;
	background: transparent url('../images/gnb/ico-sitemap-btn.svg');
	background-size: cover;
}

.mheader .sitemap-btn>a i {
	filter: invert(1);
}

.mheader .on .sitemap-btn>a i,
.mheader .active .sitemap-btn>a i,
.mheader .floating .sitemap-btn>a i {
	filter: invert(0);
}

header.sitemap .sitemap-btn>a i {
	background: url('../images/gnb/ico-close.svg');
	background-size: cover;
	filter: invert(0);
}

/* E: svg class */
header .lang {
	width: 100%;
	position: relative;
	cursor: pointer;
	display: flex;
	align-items: center;
	font-weight: 500;
	color: var(--color-black);
}

header button.lang {
	border: none;
	background-color: inherit;
}

header .lang::after {
	position: absolute;
	content: url('../images/gnb/lang-more-ico.svg');
	right: 0;
	top: 2px;
}

/*
.mheader.lang::after {
	content: url(../img/lang-more-white-ico.svg);
}

header.index.active .lang::after,
header.index.on .lang::after {
	content: url('../images/gnb/lang-more-ico.svg');
}

header .lang::before {
	position: absolute;
	content: '';
	display: block;
	width: 1px;
	height: 15px;
	background-color: #dddddd;
	right: -16px;
	top: 4px;
}*/

header .lang-menu {
	position: absolute;
	left: 50%;
	top: 4.5rem;
	transform: translateX(-50%);
	background-color: white;
	border: 1px solid #dddddd;
	border-radius: 5px;
	display: none;
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
	z-index: 400;
}

header .lang-menu li {
	padding: 1rem 0;
}

header .lang-menu li:first-of-type {
	border-bottom: 1px solid #dddddd;
}

header .lang-menu li a {
	color: #666666;
	font-weight: var(--font-md);
	font-size: 1.5rem;
	padding: 1rem 1.5rem;
}

header .lang-menu li.on a {
	color: var(--color-black);
}

header .sitemap-btn {
	width: 4.2rem;
	height: 4.2rem;
	position: relative;
	margin-left: 2rem;
}

header .sitemap-btn>a {
	position: absolute;
	z-index: 505;
	top: 0;
}

.mheader.sitemap-btn svg rect {
	fill: var(--color-white);
}

header.index.active .sitemap-btn svg rect,
header.index.on .sitemap-btn svg rect {
	fill: var(--color-black);
	transition: 0s 0s;
}

header .sitemap-menu {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	min-height: 100vh;
	z-index: 500;
	background-color: #333;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	display: none;
}

header .sitemap-menu.on {
	display: block;
}

header .st_inner {
	width: 100%;
	max-width: 160rem;
	position: relative;
	margin: 0 auto;
}

header .sitemap-title {
	font-size: 4.2rem;
	font-weight: bold;
	color: var(--color-white);
	padding-top: 3.4rem;
	line-height: normal;
}

header .sitemap-title span {
	color: var(--brand-color-sub);
}

header.sitemap .logo .white {
	display: block;
}

header .sitemap-menu li a {
	color: var(--color-white);
	display: inline-block;
}

header .sitemap-list {
	display: flex;
	justify-content: space-between;
	margin-top: 12rem;
	flex-direction: column;
	gap: 6rem;
}

header .sitemap-list>li {
	width: 100%;
	display: flex;
	justify-content: space-between;
}

header .sitemap-list>li>a {
	font-size: 2.4rem;
	font-weight: bold;
	position: relative;
	width: 13%;
	height: fit-content;
	padding-left: 1.5rem;
	line-height: 1.2;
}

header .sitemap-list>li>a::after {
	position: absolute;
	left: 0;
	top: 0;
	content: '';
	background-color: var(--color-white);
	width: 3px;
	height: 100%;
}

header .sitemap-depth02 {
	display: flex;
	width: calc(100% - 13%);
}

header .sitemap-depth02>li {
	width: 18%;
	width: calc(18% - 1em);
	padding-left: 1em;
}

header .sitemap-depth02>li>a {
	font-size: 1.8rem;
	font-weight: 500;
}

header .sitemap-depth03 {
	margin-top: 1.5rem;
	padding: 0 2.4rem;
	border-left: 1px solid rgba(255, 255, 255, 0.15);
}

/*header .sitemap-list>li:first-of-type .sitemap-depth03 {
	height: 140px;
}*/

header .sitemap-depth03 li a {
	margin-bottom: 1.5rem;
	font-size: 1.8rem;
}

header .sitemap-depth03 li:last-of-type a {
	margin-bottom: 0;
}

header .sitemap-depth03 li a {
	opacity: .6;
	position: relative;
}

header .sitemap-depth03 li a::before {
	position: absolute;
	top: 0.8rem;
	left: -1rem;
	content: '';
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background-color: var(--color-white);
}

header .sitemap-depth03 li a:hover {
	opacity: 1;
}

header .sitemap-menu .priv {
	position: absolute;
	width: 100%;
	max-width: 160rem;
	height: 100%;
	left: 50%;
	transform: translateX(-50%);
	top: 0;
	z-index: -1;
}

header .sitemap-menu .privacy {
	display: flex;
	position: absolute;
	bottom: 4rem;
}

header .sitemap-menu .privacy a {
	color: var(--color-white);
	position: relative;
	opacity: .5;
}

header .sitemap-menu .privacy a:first-of-type {
	margin-right: 4rem;
	opacity: 1;
}

header .sitemap-menu .privacy a:first-of-type::after {
	content: '';
	width: 1px;
	height: 14px;
	background-color: var(--color-white);
	opacity: .3;
	position: absolute;
	right: -20.5px;
	top: 2px;
}

header .close {
	display: none;
}

header.sitemap .close {
	display: block;
	margin-top: 1rem;
}

header.sitemap .lines {
	display: none;
}

/* 모바일CSS */
@media screen and (max-width:1640px) {
	header .st_inner {
		width: 96%;
	}

	header .sitemap-menu .priv {
		width: 100%;
		padding: 0 2rem;
	}

	header .sitemap-menu .privacy {
		right: 3rem;
	}

	header .sitemap-list>li>a {
		width: 15%;
	}

	header .sitemap-depth02 {
		/* width: calc(100% - 7%); */
	}

	header .sitemap-depth02>li>a {
		font-size: 1.6rem;
	}

	header .sitemap-depth03 li a {
		font-size: 1.6rem;
	}

	header .sitemap-list>li>a {
		font-size: 1, 8rem;
	}

	header .sitemap-depth02>li {
		width: 16.66666666666667%;
		width: calc(16.66666666666667% - 1em);
	}

	header .sitemap-depth02>li:nth-of-type(5) {
		width: 25%;
		width: calc(24% - 1em);
	}
}

@media screen and (max-width:1400px) {
	header .st_inner {
		width: 94%;
	}
}

@media screen and (max-width:1200px) {
	header .util-menu {
		margin: 2.4rem 0;
	}

	header .sitemap-list>li>a {
		font-size: 2rem;
	}

	header .sitemap-depth02>li>a {
		font-size: 2rem;
	}
}

@media screen and (max-width:1024px) {
	header .st_inner {
		width: 100%;
	}

	header.sitemap .logo a {
		z-index: 202;
	}

	header .sitemap-menu {
		z-index: 100;
	}

	header .sitemap-list>li:first-of-type .sitemap-depth03 {
		height: auto;
	}

	header .sitemap-depth02>li:nth-of-type(5) {
		width: 100%;
	}

	header .logo {
		width: 18rem;
		padding: 0;
	}

	header .util-menu {
		margin: 0;
	}

	header .sitemap-btn {
		margin-left: 1.5rem;
	}

	header .sitemap-title {
		display: none;
	}

	header.sitemap .logo {
		display: block;
		padding: 0;
		z-index: 101;
	}

	/* header.sitemap .logo a {
		top: 14px;
	} */

	header.sitemap .logo .color {
		display: none;
	}

	/* header.sitemap .logo .white */
	header.sitemap .logo>a {
		display: block;
	}

	header.sitemap .close {
		transform: scale(.8);
		margin-top: 0px;
	}

	header .sitemap-list>li>a::after {
		display: none;
	}

	header .lang {
		z-index: 200;
		color: var(--color-white);
	}

	header .lang-btn {
		width: 3.8rem;
	}

	header .lang {
		font-size: 0px;
	}

	header .lang::after {
		top: 50%;
		transform: translateY(-50%);
	}

	header.sitemap .lang::after {
		content: url('../images/gnb/gnb-more-white-ico.svg');
	}

	header .util-menu {
		width: max-content;
	}

	header .gnb-menu .depth01 {
		display: none;
	}

	header>.inner {
		padding: 0.8rem 2rem;
	}

	header .lang-menu li a {
		font-size: 1.6rem;
		font-weight: 600;
	}

	header .sitemap-list {
		margin-top: 8rem;
		gap: 0;
		position: relative;
	}

	header .sitemap-list>li:first-of-type>a {
		margin-top: 1rem;
	}

	header .sitemap-list>li.on>a {
		background-color: var(--brand-color-main);
		color: var(--color-white);
		padding: 1.3rem 2rem 1.3rem 1rem;
		transform: translateX(1.5rem);
		z-index: 210;
		width: 20.5rem;
		border-radius: 5px;
	}

	header .sitemap-list.inner {
		padding: 0;
	}

	header .sitemap-list>li>a {
		padding-left: 0;
		color: var(--color-black);
		background-color: #F5F5F8;
		padding: 1.3rem 2rem 1.3rem 2rem;
		box-sizing: border-box;
		width: 20rem;
		font-size: 2rem;
	}

	header .sitemap-depth02>li {
		width: 100%;
		height: 100%;
		background-color: var(--color-white);
		color: var(--color-black);
		box-sizing: border-box;
	}

	header .sitemap-depth02>li>a {
		color: #666;
		padding: 2rem 0px;
		margin: 0 2rem;
		border-bottom: 1px solid #ddd;
		width: calc(100% - 4rem);
		position: relative;
	}

	header .sitemap-depth02>li>a.on {
		color: var(--color-black);
	}

	header .sitemap-depth02>li>a.more::after {
		position: absolute;
		right: 0px;
		content: url('../images/gnb/gnb-mob-gray-ico.svg');

	}

	header .sitemap-depth02>li>a.more.on::after {
		content: url('../images/gnb/mob-more-ico.svg');
	}

	header .sitemap-depth02 {
		flex-direction: column;
		position: absolute;
		left: 21rem;
		top: 0;
		display: none;
	}

	header li.on .sitemap-depth02 {
		display: flex;
		z-index: 201;
		width: calc(100% - 21rem);
		padding-top: 1rem;
	}

	header .sitemap-depth03 {
		display: none;
		padding: 1.5rem;
		margin: 0 2rem;
		background-color: #F5F5F8;
		border-left: none;
		border-bottom: 1px solid #ddd;
	}

	header .sitemap-depth03 li a::before {
		display: none;
	}

	header .sitemap-depth03 li a {
		color: black;
		font-size: 2rem;
		display: block;
		margin-bottom: 2rem;
	}

	header .sitemap-list::after {
		position: absolute;
		left: 0;
		content: '';
		background-color: var(--color-white);
		width: 100%;
		height: 100vh;
		z-index: -2;
	}

	header .sitemap-list::before {
		position: absolute;
		left: 0;
		content: '';
		background-color: #F5F5F8;
		width: 20rem;
		height: 100vh;
		z-index: -1;
	}

	header .sitemap-menu .priv {
		display: none;
	}
}

@media screen and (min-width:1025px) and (max-height:1040px) {
	header.sitemap .logo a {
		width: 19rem;
	}

	header .sitemap-list {
		margin-top: 6rem;
		gap: 4rem;
	}

	header .sitemap-menu .privacy {
		bottom: 2rem;
		z-index: 10;
	}
}

/* ==================================================
	Sub Bread Menu
================================================== */
.nav-sub-bread {}

.sub_bread_menu {
	width: 100%;
	display: flex;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: center;
	position: relative;
	height: 40px;
}

.sub_bread_menu:after {
	content: "";
	display: block;
	clear: both;
}

.sub_bread_menu>li {
	display: flex;
	align-items: center;
	position: relative;
	width: 30%;
	height: 100%;
	margin-left: 3.5rem;
}

.sub_bread_menu>li.depth1 {
	margin-left: 1.5rem;
}

/*.sub_bread_menu>li::after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 1px;
	height: 69px;
	background-color: #e1e1e1;
}*/

.sub_bread_menu>li.firstHome {
	flex: 0 0 2rem;
	width: auto;
	justify-content: center;
	margin-left: 0;
}

.sub_bread_menu>li.firstHome img {
	width: 100%;
	max-width: 2rem;
}

.sub_bread_menu>li.firstHome>a {
	display: block;
	position: relative;
	font-size: 1.8rem;
	color: var(--brand-color-sub);
}

.sub_bread_menu>li:not(.firstHome) {
	/*flex: 0 0 17.5rem;*/
	width: 16rem;
	justify-content: left;
}

.sub_bread_menu>li.depth1 {
	width: 16rem;
}

.sub_bread_menu>li.depth2 {
	width: 16rem;
}

.sub_bread_menu>li.depth3 {
	width: 20rem;
}

.sub_bread_menu>li:not(.firstHome)>a {
	display: flex;
	align-items: center;
	position: relative;
	width: 100%;
	height: 100%;
	font-size: 1.8rem;
	font-weight: 500;
	color: var(--brand-color-main);
}

/*.sub_bread_menu>li:last-child>a {
	color: var(--brand-color-sub);
}*/

.sub_bread_menu>li:not(.firstHome)>a::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 0;
	width: 14px;
	height: 10px;
	background: url('../images/gnb/arrow.svg');
	background-repeat: no-repeat;
	background-size: cover;
	transform: translateY(-50%);
	display: inline-block;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/*.sub_bread_menu>li:last-child>a::after {
	background: url('../images/gnb/arrow_on.svg');
	background-repeat: no-repeat;
	background-size: cover;
}*/

.sub_bread_menu .menu-name {
	display: block;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.sub_bread_menu>li>ul {
	position: absolute;
	width: 100%;
	top: 100%;
	background: #545454;
	box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
	transition: opacity 0.25s, visibility 0.25s;
	opacity: 0;
	visibility: hidden;
}

.sub_bread_menu>li.open>ul {
	opacity: 1;
	visibility: visible
}

.sub_bread_menu>li>ul>li>a {
	display: block;
	font-size: 1.6rem;
	text-align: left;
	color: #222;
	padding: 0 1.5rem;
	line-height: 40px;
	background-color: var(--color-white);
	transition: background-color 0.25s, color .25s, border .25s;
	border-bottom: 1px solid #eee;
}

.sub_bread_menu>li>ul>li:last-child>a {
	border-bottom: 0;
}

.sub_bread_menu>li>ul>li>a:hover,
.sub_bread_menu>li>ul>li.act>a {
	background: var(--brand-color-main);
	color: var(--color-white);
	border-color: var(--brand-color-main);
}

/* 모바일CSS */
@media screen and (max-width:800px) {
	.sub_bread_menu>li:not(.firstHome) {
		width: auto;
	}

	.sub_bread_menu>li.depth1 {
		width: 30%;
	}

	.sub_bread_menu>li.depth2 {
		width: 30%;
	}

	.sub_bread_menu>li.depth3 {
		width: 30%;
	}
}

/* ==================================================
	컨텐츠 서브메뉴
================================================== */
.cnb2 {
	width: 100%;
	max-width: var(--px-base);
	/*margin-right: auto;
	margin-left: auto;*/
	margin-top: 5rem;
}

.cnb2 ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.cnb2 ul li {
	position: relative;
	margin-right: 3.5rem;
}

.cnb2 ul li:last-child {
	margin-right: 0;
}

.cnb2 ul li a {
	font-size: 2rem;
	font-weight: var(--font-md);
	display: inline-block;
	position: relative;
	text-align: center;
}

.cnb2 ul li.on a {
	color: var(--brand-color-sub);
	font-weight: var(--font-sb);
}

.cnb2 ul li a:hover {
	color: var(--brand-color-sub);
}

.cnb2 ul li.on a:after {
	background-color: var(--brand-color-sub);
	content: "";
	bottom: -1.3rem;
	left: 0;
	position: absolute;
	height: 0.3rem;
	width: 100%;
}

/* 애니메이션 */
.cnb_ani {
	opacity: 0;
	transform: translateY(30px);
}

.cnb_ani.active {
	opacity: 1;
	transform: translateX(0px);
	transition: 0.7s 0.6s;
}

/* 모바일CSS */
@media screen and (max-width:1023px) {
	.cnb2 {
		margin-top: 4.5rem;
	}

	.cnb2 ul {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: (1fr)[3];
		grid-template-columns: repeat(3, 1fr);
		gap: 3.5rem;
		text-align: center;
	}

	.cnb2 ul.col2 {
		-ms-grid-columns: (1fr)[2];
		grid-template-columns: repeat(2, 1fr);
	}

	.cnb2 ul.col4 {
		-ms-grid-columns: (1fr)[2];
		grid-template-columns: repeat(2, 1fr);
	}

	.cnb2 ul li {
		margin-right: 0;
	}

	.cnb2 ul li.on:after {
		display: none;
	}

	.cnb2 ul li a {
		font-size: 2rem;
		letter-spacing: -0.05px;
	}
}

@media screen and (max-width:640px) {
	.cnb2 ul li a {
		font-size: 18px;
	}

	.cnb2 ul li.on a:after {
		background-color: var(--brand-color-sub);
		content: "";
		bottom: -1.2rem;
		left: 0;
		position: absolute;
		height: 0.3rem;
		width: 100%;
	}
}

@media screen and (max-width:450px) {
	.cnb2 ul li a {
		font-size: 17px;
		letter-spacing: -0.35px;
	}
}