@charset "utf-8";

/******************************  공통 영역  ******************************/
#wrap, .container { width: 100%; min-width: 1600px; }
#wrap {}
.container {}
.sector { width: 1364px; margin: 0 auto; }
.sub_sector { width: 1364px; margin: 0 auto; }

@media screen and (max-width:1000px) {
	#wrap, .container { min-width: 0; }
	.sub_container { width: 100%; padding-bottom: 50vw; }
	.sector, .sub_sector { width: 88%; }
}


/******************************  헤더  ******************************/
#header { position: relative; top: 0; left: 0; width: 100%; min-width: 1600px; text-align: center; z-index: 999999; background-color: initial; /* border-bottom: 1px solid #E1E1E1; */ }
#header .hd_top { height: 98px; }
#header .hd_bottom { height: 70px; background: #0059A0; }
#header .hd_sector { position: relative; width: 1364px; max-width: 90%; margin: 0 auto; height: inherit; }
#header .logo { position: absolute; top: 32px; left: calc(50% - 94.5px); width: 189px; height: 35px; background: url('../images/m_logo.png') no-repeat center center / contain; }
/* #header .right_logo { position: absolute; top: 28px; right: 0; width: 150px; height: 42px; background: url('../images/m_logo_book(2).png') no-repeat center center / contain; } */
#header .gnb { position: relative; display: inline-block; margin-top: 24px; }
#header .gnb > li { float: left; width: 194.5px; text-align: center; }
#header .gnb > li > a { font-size: 18px; font-weight: 700; color: #fff; }
#header .sitemap_btn { display: none; background: none; }

@media screen and (max-width:1000px) {
	#header { width: 100%; min-width: 0; }
	#header .hd_top { height: 17vw; }
	#header .hd_bottom { display: none; }
	#header .hd_sector { position: relative; width: 88%; }
	#header .logo { position: absolute; top: 0; left: 0; width: 39.3vw; height: 7.25vw; margin-top: 4.9vw;  }
	#header .sitemap_btn { display: block; position: absolute; top: 6vw; right: 0; width: 6vw; z-index: 1; }
	#header .right_logo { top: 5.3vw; right: 11.5vw; width: 16.5vw; height: 6.4vw; }
}

/******************************  snb  ******************************/
.snb_area {
	display: none;
	position: absolute;
	top: 168px;
	left: 0;
	width: 100%;
	height: 240px;
	min-width: 1600px;
	text-align: center;
	background-color: #fff;
	border-bottom: 1px solid #C5C5C5;
	/* transition: background-color 0.2s; */
	z-index: 999999;
}

.snb_area.hovered {
	display: block;
}

.snb_area > .snb {
	display: inline-block;
	height: inherit;
}

.snb_area > .snb > ul {
	float: left;
	width: 194.5px;
	height: inherit;
	border-left: 1px solid #C5C5C5;
	/* transition: background-color 0.2s; */
}

.snb_area > .snb > ul:last-child {
	border-right: 1px solid #C5C5C5;
}

.snb_area > .snb > ul > li {
	margin: 40px 0;
}

.snb_area > .snb > ul > li > a {
	font-size: 18px;
	font-weight: 500;
	/* transition: background-color 0.2s; */
}


.snb_area > .snb > ul.hovered {
	background: var(--main-color);
}

.snb_area > .snb > ul.hovered > li > a {
	color: #fff;
}


/******************************  사이트맵  ******************************/
#sitemap_area { display: none; }
#sitemap_area::-webkit-scrollbar { display: none; }

@media screen and (max-width:1000px) {
	#sitemap_area { display: block; position: fixed; top: 0; right: -100%; width: 100%; height: 100%; background: #fff; z-index: 999999; overflow-Y: auto; }

	.sitemap_header .sector { position: relative; }

	.sitemap_header { height: 17vw; border-bottom: 1px solid #e0e0e0; }
	.sitemap_header .logo { position: absolute; top: 0; left: 0; width: 39.3vw; height: 7.25vw; margin-top: 4.9vw; background: url('../images/m_logo.png') no-repeat center center / contain; z-index: 1; }
	.sitemap_header .right_logo { position: absolute; top: 5.3vw; right: 11.5vw; width: 16.5vw; height: 6.4vw; background: url('../images/m_logo_book.png') no-repeat center center / contain; }

	#sitemap_area .sitemap_gnb dt, #sitemap_area .sitemap_gnb dd { padding: 0 6vw; font-size: 4.4vw; }
	#sitemap_area .sitemap_gnb dt { border-bottom: 1px solid #ddd; line-height: 18.2vw; font-weight: bold;}
	#sitemap_area .sitemap_gnb dt.no_snb { background: none; }
	#sitemap_area .sitemap_gnb dt + dd { padding-top: 6vw; }
	#sitemap_area .sitemap_gnb dd { /* display: none; */ padding-bottom: 6vw; background: #E8E8E8; }
	#sitemap_area .sitemap_gnb dd:last-child { margin-bottom: 23vw; }

	.close_btn { display: block; position: absolute; top: 5.5vw; right: 0; width: 6vw; z-index: 1; background: none; }
}


/******************************  푸터  ******************************/
#footer {
	position: relative;
	z-index: 1;
	padding: 53px 0;
	background: #000;
}

#footer::after {
	display: block;
	clear: both;
	content: "";
}

#footer .sector {
	display: flex;
	align-items: center;
}

.ft_logo {
	float: left;
	width: 189px;
	height: 35px;
	background: url('../images/m_logo_footer.png') no-repeat center center / contain;
}

.ft_info {
	float: left;
	margin-left: 170px;
	font-size: 12px;
	line-height: 1.65;
	color: #7F7F7F;
}

@media screen and (max-width:1000px) {
	#footer {
		padding: 10vw 0;
	}

	#footer .sector {
		display: block;
	}

	.ft_logo {
		position: relative;
		float: left;
		width: 32vw;
		height: 5.9vw;
	}

	.ft_info {
		margin-top: 7vw;
		margin-left: 0;
		font-size: 3.6vw;
		line-height: 1.25;
		letter-spacing: -0.03em;
	}

}

/******************************  sub aside  ******************************/
#sub_aside {
	/* position: fixed; */
	/* position: absolute; */
	position: relative;
	float: left;
	/* top: 140px; */
	width: 250px;
	border: 1px solid #E1E1E1;
	border-radius: 30px;
	overflow: hidden;
	z-index: 99;
}

#sub_aside > h1 {
	display: flex;
	height: 133px;
	align-items: center;
	justify-content: center;
	background: var(--main-color) url('../images/sub_menu_bg.png') no-repeat center bottom -2px;
	font-size: 24px;
	font-weight: 500;
	color: #fff;
}

#sub_aside > ul {
	padding-bottom: 45px;
}

#sub_aside > ul > li {
	padding: 25px 15px;
	border-bottom: 1px solid #E1E1E1;
}

#sub_aside > ul > li > a {
	font-size: 16px;
	font-weight: 500;
}

@media screen and (max-width:1500px) {
	#sub_aside {
		/* left: 77px; */
	}
}


@media screen and (max-width:1000px) {
	#sub_aside {
		display: none;
	}
}