/***************** 상단 bg *****************/
#topAreaDummy { 
	padding-bottom:159px; 
} 
.top-area {
	width:100%;
	overflow:hidden;
	position:absolute;
	top:0;
	left:0;
	right:0;
	z-index:101;
}
.top-area-over { 
	box-shadow:0 1px 15px rgba(0, 0, 0, 0.1);
}
.top-area-box {
	padding:0;
	background:rgba(255, 255, 255, 1);
}
.top-area-scrolling {
	position:fixed;
	top:0;
	width:100%;
	z-index:300;
}
.top-area-bg {
	position:absolute;
	bottom:0;
	left:50%;
	margin-left:-520px;
	opacity:0;
	transition:all 0.3s ease-out; 
}
.top-area-over {
	background:rgba(255, 255, 255, 1);
}
.top-area-over .top-area-box { 
	/* border-bottom:1px solid #ddd; */
}
.top-area-box .boundary { 
	position:relative; 
}
@media screen and (max-width:1200px) {
	.top-area, 
	.top-area-box { overflow:visible; }
	.top-area-box { border-bottom:1px solid #ddd; }
	#topAreaDummy { padding-bottom:82px; } 
}
@media screen and (max-width:768px) {
	#topAreaDummy { padding-bottom:70px; } 
}


/***************** 로고 영역 *****************/
#logoBox { 
	clear:both; 
	padding:30px 0;
	margin:0 auto;
}
#logoBox .logo {
	float:left;
}
#logoBox .logo > a {
	display:block;
	line-height:39px; 
}
#logoBox .logo > a img {
	width:auto;
	height:39px; 
	vertical-align:top;
}
#logoBox .tnb { 
	float:right;
}
.tnb_m {
	display:none;
}
#logoBox .tnb ul { }
#logoBox .tnb li {
	display:inline-block;
	padding-left:20px;
}
#logoBox .tnb li a {
	line-height:39px;
	color:#888;
	font-size:0.92em;
}
#logoBox .tnb li span {
	color:#ccc;
	padding:0 7px;
}
@media screen and (max-width:1200px) {
	#logoBox { padding:20px 0; }
	#logoBox .tnb { display:none; }
}
@media screen and (max-width:768px) {
	#logoBox .logo > a { height:30px; line-height:30px; }
	#logoBox .logo > a img { height:100%; }
	.tnb_m { display:block; margin:10px 20px 20px; }
	.tnb_m ul { overflow:hidden; }
	.tnb_m li { float:left; width:32.33%; margin:0 0.5%; height:40px; border-radius:20px; border:1px solid #ddd; }
	.tnb_m li.w-50 { width:49%; }
	.tnb_m li a { display:block; line-height:40px; }
}



/***************** 전체메뉴 버튼 *****************/
.gnb_all_btn { position:absolute; left:0; top:0; z-index:99; width:60px; height:60px; background:#42649a; }
.gnb_all_btn button { display:block; width:60px; line-height:60px; vertical-align:middle; background:none; border:0; color:#fff; font-size:20px; }
.gnb_close_btn { position:absolute; left:0; top:-60px; z-index:99; width:60px; height:60px; background:#42649a; border:0; line-height:60px; vertical-align:middle; color:#fff; font-size:20px; }



/***************** 검색 *****************/
.hd_sch_wr { position:absolute; right:0; top:0; z-index:99; width:60px; height:60px; background:#42649a; }
.hd_sch_wr > a { display:block; line-height:60px; }
#hd_sch { position:fixed; top:0; left:0; background:rgba(0, 0, 0, 0.8); width:100%; height:100%; z-index:999; opacity:0; visibility:hidden; }
#hd_sch .searBox { width:50%; position:absolute; left:50%; top:56%; transform:translate(-50%, -70px); font-size:0; line-height:0; letter-spacing:0; }
#hd_sch.open { opacity:1; visibility:visible; }
#hd_sch.open .searBox { top:52%; }
#hd_sch .searBox  { }
#hd_sch .searBox #sch_stx,
#hd_sch .searBox #sch_submit { display:inline-block; vertical-align:bottom; font-size:25px; line-height:70px; }
#hd_sch .searBox #sch_stx { width:90%; height:70px; border:0; background:#fff; padding:0 20px; }
#hd_sch .searBox #sch_submit { width:10%; background:#fff; border:0; font-size:25px; text-align:center; cursor:pointer;}
#hd_sch :-ms-input-placeholder { color:inherit; }
input#sch_stx:focus { border:0 !important; }
@media screen and (max-width:1200px) {				
	.hd_sch_wr { position:static; width:calc(100% - 30px); margin:0 auto; height:40px; border-radius:20px; background:#333; }
	.hd_sch_wr > a { display:block; line-height:40px; }
	#hd_sch .searBox { width:90%; transform:translate(-50%, -60px); }
	#hd_sch .searBox #sch_stx { width:calc(100% - 50px); height:60px; font-size:12px; line-height:60px; padding:0 10px; }
	#hd_sch .searBox #sch_submit { font-size:12px; width:50px; line-height:60px; }
}




/***************** 메뉴 + 로그인 그룹 영역 *****************/
.top-navs { 
	width:100%;
	text-align:center;
	background-color:#4e76b5;	
}
.logo_m { 
	display:none; 
}
@media screen and (max-width:1200px) {	
	.logo_m { display:block; position:absolute; top:0; left:0; padding-left:20px; padding-top:26px; }
	.logo_m a { display:block; }

	.top-navs {
		position:fixed;
		overflow-y:auto;
		z-index:9999;
		top:0;
		right:-100%;
		bottom:0;
		padding-top:70px;
		width:320px;
		background-color:#fff;
		line-height:1.5;
		transition:right 0.5s ease-in-out;
	}
	.top-navs-curtain {
		visibility:hidden;
		opacity:0;
		position:fixed;
		z-index:-1;
		top:0; 
		bottom:0;
		right:0; 
		left:0;
		background-color:rgba(0, 0, 0, 0.32);
		transition:opacity 0.35s ease-in-out;
	}
}



/***************** 메뉴 영역 *****************/
.top-area .gnb { }
.gnb-hidden {
	display:none;
}
#gnb-list {
	z-index:101;
}
#gnb-list .gnb-item {
	display:inline-block;
	position:relative;
}
#gnb-list .gnb-item:before {
	content:"";
	position:absolute;
	left:0;
	right:100%;
	bottom:0;
	height:2px;
	opacity:0;
	background-color:#fff;
	-webkit-transition:all 0.3s;
	-moz-transition:all 0.3s;
	-ms-transition:all 0.3s;
	-o-transition:all 0.3s;
	transition:all 0.3s;
}
#gnb-list .gnb-item:hover:before {
	left:25px;
	right:25px;
	opacity:1;
}
#gnb-list .gnb-item1 {
	padding:0px;
}
#gnb-list .gnb-item8 {
	display:none;
	padding:0px;
}
#gnb-list .gnb-link {
	display:block;
	padding:0 40px;
	line-height:60px; 
 	font-size:1.2em;
	color:#fff;
	letter-spacing:-0.02em;
}
#gnb-list #gnb_empty { 
	text-align:center; 
	color:#fff; 
}

/* 중메뉴 */
#gnb-list .gnb-dep1 {    
	position:absolute;
	width:100%;
}
#gnb-list .gnb-d1-list {
	bottom:1em;
	padding-top:15px;
	text-align:center;
}
#gnb-list .gnb-d1-item {
	padding:3px 0;
	/*position:relative;*/
}
#gnb-list .gnb-d1-item:last-of-type {
	padding-bottom:50px;
}
#gnb-list .gnb-d1-link {
	font-size:1em;
	color:#787878;
	line-height:1.6;
	letter-spacing:-0.03em;
	padding-left:4px;
	padding-top:3px;
	position:relative; 
}
#gnb-list .gnb-d1-link:hover { 
	color:#000; 
}
#gnb-list .gnb-d1-link i {
	margin-left:10px;
}
@media screen and (max-width:1200px) {
	.top-area .gnb {
		width:auto;
		padding:0 20px;
		text-align:left;
		margin-left:0;
		margin-top:20px;
	}
	#gnb-list .gnb-item {
		display:block;
		margin-bottom:10px;
		padding-bottom:10px;
		border-bottom:1px solid #ddd;		
	}
	#gnb-list .gnb-item:before {
		content:"";
		display:none;
	}
	#gnb-list .gnb-item:hover:before {
		display:none;
	}
	#gnb-list .gnb-link {
		line-height:2;
		padding:0;
		color:#333;
	}
	#gnb-list .gnb-dep1 {
		position:static;
		width:auto;
	}
	#gnb-list .gnb-d1-list {
		display:none;
		margin:5px 0;
		padding:10px;
		text-align:left; 
		background:#f7f7f7;
		-webkit-border-radius:10px; 
		-moz-border-radius:10px; 
		border-radius:10px;
	}
	#gnb-list .gnb-d1-item {
		padding:2px 0;
		font-size:14px;	
	}
	#gnb-list .gnb-d1-item:last-of-type {
		padding:0;
	}
}

@media screen and (max-width:1200px) {
	#gnb-list { }
	#gnb-list .gnb_all_btn { display:none; }
}



/***************** 3차 메뉴 추가 *****************/
#gnb-list .gnb-d2-list {
	padding:2px 0 6px;
	color:#8c8c8c;
    position:absolute;
    left:100%;
    top:0px;
    height:100%;
    width:0px;
    background-color:#4e76b5;
    z-index:99;
    overflow:hidden;
    -webkit-transition:width 0.2s, height 1s, background-color 1s, -webkit-transform 1s;
    transition:width 0.2s, height 1s, background-color 1s, transform 1s;
    padding-top:10px;
}

#gnb-list .gnb-d2-item {
	padding:2px 10px;
	white-space:nowrap;
	width:100%;
}
#gnb-list .gnb-d2-item:last-of-type { }
#gnb-list .gnb-d2-link {
	position:relative; 
	color:#fff;
	font-size:0.867em;
	line-height:1.6;
	letter-spacing:-0.03em;
	display:block;
	text-align:left;
	font-weight:normal;
}
#gnb-list .gnb-d2-link:hover { 
	color:#fff; 
	padding-left:4px; 
}


#gnb-list .gnb-d1-item:hover .gnb-d2-list {
	display:block;
	width:150%;
}

@media screen and (max-width:1200px) {
	#gnb-list .gnb-d2-list {
		display: block;
		background: none;
		box-shadow: none;
		position: relative;
		left: 0px;
		top: 0px;
		width: 100%;
		border: 0px;
		padding-top: 0px;
	}

	#gnb-list .gnb-d2-link {
		white-space: initial;
		color: #787878;
	}
}

@media screen and (min-width:1200px) {
	#gnb-list .gnb-d2-list {
		min-height:700px;
	}
}

/***************** 버튼으로 전체 메뉴 오픈시 3차메뉴 스타일 변경 *****************/
.top-area-full-opened { 
	background:#42649a; 
}
.top-area-full-opened #gnb-list .gnb-d1-link {
	color:#fff;
}
.top-area-full-opened #gnb-list .gnb-d1-link i { 
	display:none; 
}
.top-area-full-opened #gnb-list .gnb-d2-link {
	font-size:0.867em;
	color:#fff;
	opacity:0.85;
	text-align:center;
	white-space:initial;
}
.top-area-full-opened #gnb-list .gnb-d1-link:before {
	content:"";
	position:absolute; 
	left:0;
	top:0;
	width:4px;
	height:4px;
	display:inline-block;
	-webkit-border-radius:2px; 
	-moz-border-radius:2px; 
	border-radius:2px;
	background:#83c131;
	z-index:1;
}
.top-area-full-opened #gnb-list .gnb-d2-list {
	width:100%;
	left:0px;
	top:0px;
	position:relative;
	padding:5px 0;
	text-align:center;
	background:none;
	border:0;
	-webkit-border-radius:10px; 
	-moz-border-radius:10px; 
	border-radius:10px;
	box-shadow:none;
	display:block;
	min-height:0px;
}
.top-area-full-opened #gnb-list .gnb-d2-item:last-of-type {  }

.top-area-full-opened #gnb-list .gnb-d1-item:hover .gnb-d2-list {
	display:block;
	width:100% !important;
}




/***************** 메뉴 전체 롤링시 배경 깔기 *****************/
.topMenuBg {
    display:none;
    position:fixed;
    background:rgba(0, 0, 0, 0.7); 
    height:100%;
    width:100%;
    z-index:9;
    top:0px;
}



/***************** 메뉴 열고 닫는 버튼 *****************/
.top-nav-btn {
	position:absolute;
	z-index:8888;
	top:0;
	right:0; 
	width:32px;
	height:27px;
	margin:26px 10px;
}
.top-nav-btn .pnb-bar {
	position:absolute;
	box-sizing:content-box;
	display:block;
	width:100%;
	height:3px;
	top:50%;
	margin-top:-1.5px;
	background-color:#000;
	transition:background-color 0.35s ease-out;
}
.top-nav-btn .pnb-bar-top {
	margin-top:3px;
}
.top-nav-btn .pnb-bar-btm {
	margin-top:21px;
}

.top-nav-btn .pnb-bar-top,
.top-nav-btn .pnb-bar-btm {
	top:0;
	transition:top 0.35s ease-out, margin-top 0.35s ease-out, transform 0.35s ease-in 0.35s;
}
@media screen and (min-width:1200px) {
	.top-nav-btn { display:none; }
}
@media screen and (max-width:768px) { 
	.top-nav-btn { margin:21px 10px; }
}


/***************** 서브 메뉴 열고 닫는 버튼 *****************/
.gnb-dep1-toggle {
	position:absolute;
	top:0;
	right:0;
	width:30px;
	height:20px;
	background-color:transparent;
	border:0;
}
.gnb-dep1-toggle::before,
.gnb-dep1-toggle::after {
	content:'';
	position:absolute;
	width:50%;
	height:2px;
	background-color:#858585;
	transition:transform 0.35s ease-in-out;
}
.gnb-dep1-toggle::before {
	left:3px;
	transform:rotate(45deg);
}
.gnb-dep1-toggle::after {
	right:3px;
	transform:rotate(-45deg);
}
.gnb-dep1-toggle.close::before {
	transform:rotate(-45deg);
}
.gnb-dep1-toggle.close::after {
	transform:rotate(45deg);
}
@media screen and (min-width:1200px) {
	.gnb-dep1-toggle { display:none; }
}


/***************** 메뉴 열렸을때 관련 스타일 모음 *****************/
.top-navs--open {
	position:relative;
	z-index:1;
	overflow-y:hidden;
	height:100%;
	height:100vh;
}
.top-navs--open .top-navs {
	right:0;
	height:100%;
}
.top-navs--open .top-navs-curtain {
	visibility:visible;
	opacity:1;
	z-index:9998;
}
.top-navs--open .top-nav-btn .pnb-bar {
	opacity:0;
	background-color:#363636;
}

/* 모바일 메뉴 버튼 효과 삭제  
.top-navs--open .top-nav-btn .pnb-bar-top,
.top-navs--open .top-nav-btn .pnb-bar-btm {
	top:50%;
	margin-top:-1.5px;
	opacity:1;
}

.top-navs--open .top-nav-btn .pnb-bar-top {
	-webkit-transform:rotate(45deg);
	-ms-transform:rotate(45deg);
	transform:rotate(45deg);
}
.top-navs--open .top-nav-btn .pnb-bar-btm {
	-webkit-transform:rotate(-45deg);
	-ms-transform:rotate(-45deg);
	transform:rotate(-45deg);
}
*/



/***************** 별도 버튼 분리 *****************/
.top-navs--open .top-nav-btn .pnb-bar,.top-navs--open .top-nav-btn .pnb-bar{
	opacity:1;
}

.top-navs .top-nav-btn .pnb-bar-top,
.top-navs .top-nav-btn .pnb-bar-btm {
	top:50%;
	margin-top:-1.5px;
	opacity:1;
}

.top-navs .top-nav-btn .pnb-bar-top {
	-webkit-transform:rotate(45deg);
	-ms-transform:rotate(45deg);
	transform:rotate(45deg);
}
.top-navs .top-nav-btn .pnb-bar-btm {
	-webkit-transform:rotate(-45deg);
	-ms-transform:rotate(-45deg);
	transform:rotate(-45deg);
}


/***************** 언어선택 *****************/

.language{z-index: 9999; margin-left: 20px;float: right; position: relative;}
.language button {line-height: 40px; border: 0; font-weight: 600;	transition: .3s; background-color: transparent;	outline: 0;	font-size: 16px; color: #939caa; height: 26px;display: inline-block;}
.language button:hover{color:#598cb5;}
.language button i {transition: .3s; font-size: 1.2em;	line-height: .75em;	vertical-align: -15%;}
.language button span {transition: .3s;	display: inline-block; width: 13px;	height: 9px; margin-left: 5px; background: url(/img/lang/lang_arrow_on.gif) center center no-repeat; margin-bottom: 1px;}
.language button.on span {transform: rotate(180deg);	background: url(/img/lang/lang_arrow_on.gif) center center no-repeat;}
.language ul {display: none;position: absolute;	left: 0; top: 36px;	width: 100%;}
#logoBox .language ul li { width: 100%; height: 36px; border-bottom: 1px solid rgba(255,255,255,0.2);background-color: #598cb5;	text-align: center;	padding-left:0;}
#logoBox .language ul li:hover a{background-color:#42649a;}
#logoBox .language ul li:last-child{border-bottom:none;}

#logoBox .language ul li a {font-size: 16px; color: #fff; line-height: 36px; display: block;}

.lang_btn_link{cursor:pointer; display:none; z-index: 8888; right: 60px; position: absolute;}
.lang_btn_link > i{font-size:30px;}

@media(max-width:1200px){
	.lang_btn_link{display:block;}
	#logoBox {display: flex; align-items: center;}
}


/*********************lang_menu.css*********************/

.flex_center{
	display:-webkit-box;
	display:-ms-flexbox;
	display:-moz-flexbox;
	display:flex;
	flex-flow:row wrap;

	-webkit-box-orient:horizontal;
	-ms-flex-direction:row;
	flex-direction:row;

	-webkit-box-lines:multiple;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;

	-webkit-box-pack:center;
	-ms-flex-pack:center;
	justify-content:center;

	-webkit-box-align:center;
	-ms-flex-align:center;
	align-items:center;
}

.lang_menu_wrap{
	background-color:#353535;
	position:fixed;
	z-index:9999;
	top:0;
	bottom:0;
	left:0;
	right:0;
	padding:50px 20px;
	background-color:rgba(0,0,0,0.3);
	overflow-y:auto;
	transition-duration:0.4s;
	display:none;
}
.lang_menu_wrap.on{
	display: block;
}

.lang_menu_box{
	width:100%;
	height:100%;
	position:relative;
}

.lang_menu_close{
	position:absolute;
	top:12px;
	right:12px;
	color:#fff;
	font-size:20px;
	line-height:20px;
	cursor:pointer;
}

.lang_title{ font-size:13px; margin-bottom:10px; text-align:center; color:#fff}

.lang_menu{
	width:350px;
	padding:40px 20px;
	background-color:#37455d;
	position:relative;
	border-radius: 5px;
}

.lang_menu ul.lang_list{
	padding:12px 25px;
	background-color:#202d3e

}

.lang_menu ul li{ border-bottom:1px solid #51556a; }
.lang_menu ul li:last-child{ border-bottom:none; }
.lang_menu ul li a{
	font-size: 14px;
	transition-duration: 0.3s;
	color: #fff;
	display: flex;
	align-items:center;
	padding: 7px 3px;
}
.lang_menu ul li a:hover{ padding-left:10px; }

.lang_menu ul li a img{ margin-right:10px; width: 20px;	height: 20px;}
.language img{ margin-right:5px; width: 16px;height: 16px;	margin-bottom: 0.155em;}
