@charset "utf-8";

/* main gnb */
.gnb_wrap {
	z-index: 10101010;
	height: 100%;
	overflow: hidden;
	position: fixed;
	width: 100%;
	right: -100%;
	-webkit-overflow-scrolling: touch;
}

.gnb_wrap .mobile_gnb_controller {
	max-width: 520px;
	height: 100%;
	background-color: #fff;
	float: right;
	overflow-y: auto;
}

.mobile_gnb_dim {
	width: 100%;
	position: fixed;
	height: 100%;
	left: 0;
	top: 0;
	background-color: #000;
	opacity: 0.6;
	filter: alpha(opacity = 60);
	z-index: 0;
	display: none;
}

.gnb_wrap .gnb_con.menu_depth_1 {
	float: left;
	width: 100%;
	text-align: justify;
	font-size: 0;;
	line-height: 0;
	-ms-text-justify: distribute-all-lines;
	text-justify: distribute-all-lines;
}

.gnb_wrap .gnb_con.menu_depth_1:after {
	content: "";
	display: inline-block;
	width: 100%;
}

.gnb_wrap .gnb_con.menu_depth_1>li {
	float: left;
	width: 100%;
	border-bottom: 1px solid rgba(0, 0, 0, 0.15);
	overflow: hidden;
}

.gnb_wrap .gnb_con.menu_depth_1>li.child_none>a {
	background-image: none;
}

.gnb_wrap .gnb_con.menu_depth_1>li:nth-child(7) {
	display: none;
}

.gnb_wrap .gnb_con.menu_depth_1>li:nth-child(8).active>a {
	background-color: transparent;
	color: #000;
}

.gnb_wrap .gnb_con.menu_depth_1>li:nth-child(n+9) {
	display: none;
}

.gnb_wrap .gnb_con.menu_depth_1 li.esg_menu {
	display: block;
}

.gnb_wrap .gnb_con.menu_depth_1>li>a {
	display: block;
	padding-left: 50px;
	padding-top: 30px;
	padding-bottom: 30px;
	padding-right: 30px;
	font-size: 30px;
	line-height: 36px;
	letter-spacing: -0.05em;
	font-weight: 400;
	color: #000;
	background-image: url('../img/gnb_1depth_open.png');
	background-repeat: no-repeat;
	background-position: right 30px center;
	background-color: #fff;
}

.gnb_wrap .gnb_con.menu_depth_1>li>a>span {
	
}

.gnb_wrap .gnb_con.menu_depth_1>li>ul {
	height: 0;
}

.gnb_wrap .gnb_con.menu_depth_1>li>ul>li {
	overflow: hidden;
}

.gnb_wrap .gnb_con.menu_depth_1>li>ul>li>a {
	display: block;
	font-size: 26px;
	line-height: 30px;
	letter-spacing: -0.05em;
	color: #000;
	font-weight: 400;
	padding-left: 50px;
	padding-top: 20px;
	padding-bottom: 20px;
	padding-right: 50px;
	box-sizing: border-box;
	background-color: #f4f4f4;
	transition: all 0.3s;
}

.gnb_wrap .gnb_con.menu_depth_1>li>ul>li.depth_con>a {
	background-image: url('../img/gnb_2depth_open.png');
	background-repeat: no-repeat;
	background-position: right 30px center;
}

.gnb_wrap .gnb_con.menu_depth_1>li>ul>li.depth_con>ul {
	height: 0;
}

.gnb_wrap .gnb_con.menu_depth_1>li>ul>li.depth_con.on>a {
	background-image: url('../img/gnb_2depth_close.png');
	color: #e7302a;
}

.gnb_wrap .gnb_con.menu_depth_1>li>ul>li.depth_con.on>ul {
	height: auto;
}

.gnb_wrap .gnb_con.menu_depth_1>li>ul>li>a:hover {
	color: #e7302a;
}

.gnb_wrap .gnb_con.menu_depth_1>li>ul>li>a>span {
	
}

.gnb_wrap .gnb_con.menu_depth_1>li>ul>li>ul {
	padding-left: 50px;
	background-color: #f4f4f4;
	height: 0;
}

.gnb_wrap .gnb_con.menu_depth_1>li>ul>li>ul>li {
	
}

.gnb_wrap .gnb_con.menu_depth_1>li>ul>li>ul>li>a {
	font-size: 22px;
	line-height: 28px;
	letter-spacing: -0.05em;
	color: #777777;
	font-weight: 400;
	display: block;
	padding-left: 27px;
	padding-top: 23px;
	padding-bottom: 19px;
	background-image: url('../img/gnb_3depth_dot.png');
	background-repeat: no-repeat;
	background-position: left top 35px;
}

.gnb_wrap .gnb_con.menu_depth_1>li.active>ul>li.active>a {
	color: #e7302a;
}

/* li on컨트롤 */
.gnb_wrap .gnb_con.menu_depth_1>li.active {
	
}

.gnb_wrap .gnb_con.menu_depth_1>li.active.child_none>a {
	background-image: none;
}

.gnb_wrap .gnb_con.menu_depth_1>li.active>a {
	background-image: url('../img/gnb_1depth_close.png');
	background-color: #e7302a;
	color: #fff;
}

.gnb_wrap .gnb_con.menu_depth_1>li.menu_1_5.active>a {
	background-color: transparent;
	color: #000;
	background-image: none;
}

.gnb_wrap .gnb_con.menu_depth_1>li.active>ul {
	height: auto;
	padding-bottom: 22px;
	background-color: #f4f4f4;
	padding-top: 18px;
}

.gnb_wrap .gnb_con.menu_depth_1>li.active>ul>li {
	
}

.gnb_wrap .gnb_con.menu_depth_1>li.active>ul>li>a {
	
}

.gnb_wrap .gnb_con.menu_depth_1>li>ul {
	transition: all 0.3s
}

.gnb_wrap .gnb_con.menu_depth_1>li.on>a {
	background-image: url('../img/gnb_1depth_close.png');
	background-color: #e7302a;
	color: #fff;
}

.gnb_wrap .gnb_con.menu_depth_1>li.on>ul {
	height: auto;
	padding-bottom: 22px;
	background-color: #f4f4f4;
	padding-top: 18px;
}

.gnb_wrap .gnb_con.menu_depth_1>li.on>ul>li {
	
}

.gnb_wrap .gnb_con.menu_depth_1>li.on>ul>li>a {
	
}
/* //li on컨트롤 */
/* //main gnb */

/* sub gnb */
.sub_gnb_wrap {
	overflow: hidden;
	margin-left: auto;
	margin-right: auto;
	display: none;
}

.sub_gnb_wrap>div>div {
	position: static;
}
/* .sub_gnb_wrap .gnb_con.menu_depth_1{float:left; width:100%; font-size:0; line-height:0; text-align: center;} */
.sub_gnb_wrap .gnb_con.menu_depth_1 {
	display: flex;
	justify-content: space-evenly;
	width: 96%;
	font-size: 0;
	line-height: 0;
	text-align: center;
}

.sub_gnb_wrap .gnb_con.menu_depth_1>li {
	display: inline-block;
	vertical-align: middle;
}

.sub_gnb_wrap .gnb_con.menu_depth_1>li:nth-child(7) {
	display: none;
}
/* .sub_gnb_wrap .gnb_con.menu_depth_1 > li:nth-child(9) > a{padding-right:0;} */
.sub_gnb_wrap .gnb_con.menu_depth_1>li:nth-child(n+10) {
	display: none;
}

.sub_gnb_wrap .gnb_con.menu_depth_1>li>a {
	display: inline-block;
	font-size: 18px;
	line-height: 24px;
	letter-spacing: -0.05em;
	color: #000;
	font-weight: 300;
	padding: 28px 10px;
	transition: all 0.3s;
}
/* .sub_gnb_wrap .gnb_con.menu_depth_1 > li:first-child > a{padding-left:0;} */
.sub_gnb_wrap .gnb_con.menu_depth_1>li:last-child>a {
	padding-right: 0;
}
/*.sub_gnb_wrap .gnb_con.menu_depth_1 > li > a:hover{color:#e7302a; font-weight:bold;}*/
.sub_gnb_wrap .gnb_con.menu_depth_1>li>ul {
	position: absolute;
	text-align: center;
	width: 100%;
	left: 0;
	overflow: hidden;
	background-color: #fff;
	display: none;
	transition: border 0s;
}

.sub_gnb_wrap .gnb_con.menu_depth_1>li:hover>a {
	color: #e7302a;
	font-weight: bold;
}

.sub_gnb_wrap .gnb_con.menu_depth_1>li:hover>ul {
	display: block;
	z-index: 1;
}
/*.sub_gnb_wrap .gnb_con.menu_depth_1 > li:hover > a:after{content:""; position:absolute; height:89px; background-color: #fff; width:100%; margin-top:32px; left:0;}*/
.sub_gnb_wrap .gnb_con.menu_depth_1>li.active>a {
	color: #e7302a;
	font-weight: bold;
}

.main .sub_gnb_wrap .gnb_con.menu_depth_1>li.active:not(:hover)>a {
	color: #000;
	font-weight: 300;
}

.sub_gnb_wrap .gnb_con.menu_depth_1>li.active>ul {
	display: block;
}

.sub_gnb_wrap .gnb_con.menu_depth_1>li.active>ul>li.active>a {
	color: #e7302a;
	font-weight: bold;
}

.sub_gnb_wrap .gnb_con.menu_depth_1>li>ul>li {
	display: inline-block;
	vertical-align: top;
}

.sub_gnb_wrap .gnb_con.menu_depth_1>li.esg_menu > ul > li a {
	width:100px;
	padding-left:0;
	padding-right:0;
}

.sub_gnb_wrap .gnb_con.menu_depth_1>li>ul>li>a {
	display: inline-block;
	font-size: 16px;
	line-height: 22px;
	letter-spacing: -0.05em;
	color: #000;
	font-weight: 300;
	padding-top: 18px;
	padding-bottom: 20px;
	padding-left: 30px;
	padding-right: 30px;
}

.sub_gnb_wrap .gnb_con.menu_depth_3 li a {
	font-size: 16px;
	line-height: 32px;
	letter-spacing: -0.05em;
}

/*
.sub_gnb_wrap .gnb_con.menu_depth_1>li>ul>li:first-child>a {
	padding-left: 0;
}

.sub_gnb_wrap .gnb_con.menu_depth_1>li>ul>li:last-child>a {
	padding-right: 0;
}
*/
.sub_gnb_wrap .gnb_con.menu_depth_1>li>ul>li>a:hover {
	color: #e7302a;
	font-weight: bold;
}
.sub_gnb_wrap .gnb_con.menu_depth_1>li.esg_menu>ul>li>a {
	font-weight: 500;
}

.sub_gnb_wrap .gnb_con.menu_depth_1>li.esg_menu ul li a:hover {
	color: #000;
}

.sub_gnb_wrap .gnb_con.menu_depth_1>li.esg_menu .menu_depth_3>li>a:hover {
	color: #e7302a;
	font-weight: 400;
}
.sub_mobile_gnb_con {
	float: right;
	padding-top: 33px;
}
/* //sub gnb */
@media all and (min-width:992px) {
	/* main gnb */
	.mobile_gnb_dim {
		display: none !important;
	}
	.gnb_wrap {
		position: relative;
		max-width: none;
		height: 100%;
		right: 0;
		background-color: transparent;
	}
	.header_wrap.active .gnb_wrap {
		margin-top: 0;
	}
	.gnb_wrap .gnb_con.menu_depth_1 {
		text-align: justify;
		-ms-text-justify: distribute-all-lines;
		text-justify: distribute-all-lines;
	}
	.gnb_wrap .gnb_con.menu_depth_1>li {
		display: inline-block;
		vertical-align: top;
		float: none;
		width: auto;
		border-bottom: none;
	}
	.gnb_wrap .gnb_con.menu_depth_1>li>ul {
		height: auto;
	}
	.gnb_wrap .gnb_con.menu_depth_1>li>a {
		font-size: 18px;
		line-height: 24px;
		display: inline-block;
		padding-bottom: 21px;
		background-image: none;
		padding-right: 0;
		font-weight: bold;
		padding-left: 0;
		padding-top: 0;
		background-color: transparent;
	}
	.gnb_wrap .gnb_con.menu_depth_1>li>ul>li>a {
		display: inline-block;
		font-size: 15px;
		line-height: 21px;
		padding-top: 11px;
		padding-bottom: 11px;
		padding-left: 0;
		font-weight: 300;
		background-color: transparent;
		background-image: none;
		padding-right: 0;
	}
	.gnb_wrap .gnb_con.menu_depth_1>li>ul>li>ul {
		display: none;
	}
	.gnb_wrap .gnb_con.menu_depth_1>li>ul>li.depth_con>a {
		background-image: none;
	}
	.gnb_wrap .gnb_con.menu_depth_1>li>ul>li.depth_con.on>a {
		background-image: none;
		color: #000;
	}
	.gnb_wrap .mobile_gnb_controller {
		max-width: none;
		height: 100%;
		width: 100%;
		background-color: transparent;
	}
	/* li on컨트롤 */
	.gnb_wrap .gnb_con.menu_depth_1>li.on {
		
	}
	.gnb_wrap .gnb_con.menu_depth_1>li.on>a {
		background-image: none;
		background-color: transparent;
		color: #000;
	}
	.gnb_wrap .gnb_con.menu_depth_1>li.on>ul {
		padding-bottom: 0;
		background-color: transparent;
		padding-top: 0;
	}

	/* sub gnb */
	.sub_gnb_wrap {
		display: block;
	}
	.sub_mobile_gnb_con {
		display: none;
	}
	.sub_gnb_wrap .gnb_con.menu_depth_1 {
		text-align: center;
		padding-left: 0px;
	}
	/* .sub_gnb_wrap .gnb_con.menu_depth_1 > li > a{padding-left:16px;padding-right:16px;} */
	/* //sub gnb */
	.header_wrap .gnb_wrap:after {
		display: none;
	}
	.header_wrap.active .gnb_wrap:after {
		display: none;
	}
}

@media all and (min-width:1200px) { /* sub gnb */
	/* .sub_gnb_wrap .gnb_con.menu_depth_1 > li > a{padding-left:33px; padding-right:33px;} */
}