@charset "utf-8";



/* CSS Document */
header, a, #allmenu, .sns_box, .tel_box, #logo, .lang_menu, #lang_menu,.lang_selcet, #lnb_1da, .lnb_1da{transition: all 0.5s;
-moz-transition: all 0.5s; /* Firefox 4 */
-webkit-transition: all 0.5s; /* Safari and Chrome */
-o-transition: all 0.5s; /* Opera */  
}



header {width: 100%;	 position: fixed; left:0;	top:0;	height:var(--header-h); background-color: var(--header-bg-default);	 z-index:999999999999999999999999;  }


header.large { background-color: var(--header-bg-default);}
header.small { 	background-color: var(--header-bg-scroll);  backdrop-filter: blur(10px);}	

header.opacity {background-color: var(--header-bg-opacity)!important;}
header.opacity.large { background-color: var(--header-bg-default);}
header.opacity.small {background-color: var(--header-bg-scroll)!important;}



/*로고 설정  */

#logo {position:absolute; top:0px; height:var(--header-h);   left:0px; z-index:510; display: flex;  justify-content: center;  align-items: center;  grid-gap:10px }
#logo a img { width:var(--logo-size-w)}
#logo a img.White{filter: var(--logo-White); /* 흰색으로 변경 */}

#logo.White  {position:absolute; top:0px; height:var(--header-h);   left:0px; z-index:510; display: flex;  justify-content: center;  align-items: center;  }
#logo.White a  img {filter: var(--logo-White); float: left}
/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {#logo.White a .logotext{filter: var(--logo-White) ; font-size: 26px; font-weight: 700; float: left; padding-top:27px; margin-left: 10px; letter-spacing: -1px}


}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {#logo.White a .logotext{filter: var(--logo-White) ; font-size: 20px; font-weight: 700; float: left; padding-top:10px; margin-left: 10px; letter-spacing: -1px}


}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/



header.large #logo a img {filter: none; /* 흰색으로 변경 */}
header.large #logo a img.White{filter: var(--logo-White); /* 흰색으로 변경 */}
header.large #logo.White  {position:absolute; top:0px; height:var(--header-h);   left:0px; z-index:510; display: flex;  justify-content: center;  align-items: center;  }
header.large #logo.White a  img { filter: var(--logo-White)}


header.small #logo a img{filter: none;  }	
	

header.small #logo.White a .logotext{filter: none!important; color: #000}
header.small #logo.White a {filter: none!important; color: #000}
		
#lnb:hover #logo a img{filter: none!important; }
#lnb:hover #logo a .logotext{filter: none!important; }
	

header.large #lnb:hover #logo a img{filter: none!important;  color: #000}
header.large #lnb:hover #logo a .logotext{filter: none!important;  color: #000}
	
.Inner_wide{width: var(--inner-wide); position: relative}




.logo_name {position:absolute; top:0px; height:var(--header-h);   left:0px; z-index:510; display: flex;  justify-content: center;  align-items: center;  }



/* PC 오른쪽 글로벌 메뉴  */
.quick_body_close{width: var(--quick-menu-w);  height: 100vh; background-color: #FFF;  	position:fixed;	top:0px;	right: calc(var(--quick-menu-w) * -1); z-index:999999999999999999999; transition: all 0.5s;
-moz-transition: all 0.5s; /* Firefox 4 */
-webkit-transition: all 0.5s; /* Safari and Chrome */
-o-transition: all 0.5s; /* Opera */  }
.quick_body_open{ width: 300px;  height: 100vh;  background-color: #FFF;  	position:fixed;		top:0px;	right:0px; z-index:999;   box-shadow:3px 3px 30px rgba(0,0,0,0.3); }

.quick_head{ width: 100%; float: left; height: var(--header-h); line-height:var(--header-h); color: #333; padding: 0PX 20PX; display: flex;    align-items: center;  grid-gap: 10px}
.headtop{ width: 100%; height:var(--header-h); float: left;  background-color: #FFF;  color: #333; line-height: var(--header-h); box-sizing: border-box; padding-left: 20px;color: #fff; font-family:  'NanumSquare', sans-serif; transform: skew(-0.201deg);  font-weight: 700; }







#lnb{position:relative;overflow: hidden; height:var(--header-h);   width: 100%; transition: all 0.5s;
-moz-transition: all 0.5s; /* Firefox 4 */
-webkit-transition: all 0.5s; /* Safari and Chrome */
-o-transition: all 0.5s; /* Opera */   border-bottom: 1px solid rgba(255,255,255,0.0); display: flex;  justify-content: center;  }


#lnb .Inner{ position: relative; }

#lnb:hover{position:relative;overflow: hidden; height:var(--header-h-open); width: 100%;  background-color: rgba(255,255,255,1); }

	

#lnb h2{position:absolute;font-size:0;line-height:0;overflow:hidden}

#lnb_1dul{ padding:0; width:100%;height: 100%; position: absolute; left: 0px; top: 0px; display: flex;  justify-content: center; /* 가로 중앙 정렬 */  align-items: flex-start; /* 세로 위쪽 정렬 */ padding-left:var(--logo-size-w)!important; padding-right:var(--logo-size-w)!important  }

/**** 모바일 에서 전체 메뉴 감춤 ****/
@media only all and (max-width:767px) {#lnb_1dul{  display: none}}



#lnb_1dul:after{display:block; visibility:hidden; clear:both; content:""; }
	
	
.lnb_1dli{z-index:10; position:relative; float:left; height:100%;    transition: all 0.5s;-moz-transition: all 0.5s; -webkit-transition: all 0.5s;-o-transition: all 0.5s; }


.lnb_1da{display: inline-block;height:var(--header-h);    line-height:130%; font-size:var(--top1d-font-size); text-decoration:none; color:var(--top1d-font-color);   display: flex;  align-items: center;  margin-left: var(--top1d-margin-left);  margin-right: var(--top1d-margin-right);  position: relative; font-weight: var(--top1d-font-weight);}


#lnb_1dul .lnb_1da{transition: all 0.5s;-moz-transition: all 0.5s; -webkit-transition: all 0.5s;-o-transition: all 0.5s;   width:auto;}
#lnb .lnb_1dli{   width: auto;
            min-width: 100px; /* 초기 크기를 0으로 설정 */
            overflow: hidden; transition: all 0.5s;-moz-transition: all 0.5s; -webkit-transition: all 0.5s;-o-transition: all 0.5s; }

#lnb:hover .lnb_1dli{  height: 100%;  min-width: var(--top1d-over-min)}



/*사이트별 개별 수정 */
#lnb:hover .lnb_1dli:last-child{ min-width:calc( var(--top1d-over-min) + 40px)}



/*상단 배경이 투명일때 폰트 화이트 변환 선언 */

header:hover   #lnb .lnb_1da{color:var(--top1d-font-color); }

header.opacity   #lnb .lnb_1da{color:var(--top1d-font-color-opacity); }
header.opacity.small   #lnb .lnb_1da{color:var(--top1d-font-color)!important; }
header.opacity:hover  #lnb .lnb_1da{color:var(--top1d-font-color)!important; }







.lnb_1dli.current .lnb_1da,
.lnb_1dli:hover .lnb_1da,
.lnb_1da:focus,
.lnb_1da:hover,
.lnb_1da:active{text-decoration:none;}


.lnb_1dli .lnb_1da:after{width: 0%; height: 3px; background-color: var(--top1d-font-color-point); position: absolute; left:0px; top:var(--header-h); margin-top: -25px; content: ""; transition: all 0.5s;
-moz-transition: all 0.5s; /* Firefox 4 */
-webkit-transition: all 0.5s; /* Safari and Chrome */
-o-transition: all 0.5s; /* Opera */  }


.lnb_1dli:hover .lnb_1da:after{width:100%!important;content: "";   }

.lnb_1dli.active .lnb_1da:after{width:100%!important;content: "";   }





.lnb_2dul{width:100%; position: relative;margin-left: var(--top1d-margin-left);  padding:0px 0px 0px;box-sizing: border-box ; }


a.lnb_2da{display:block;padding:7px 0px;text-align:left; color:var(--top2d-font-color);font-size:var(--top2d-font-size); font-weight: var(--top2d-font-weight); position: relative; width: auto; clear: both; }

a.lnb_2da:hover{color:var(--top1d-font-color-point); }

.lnb_1dli a.lnb_2da:hover{color:var(--top1d-font-color-point);}
.lnb_1dli a.lnb_2da{width: auto; float: left;  position: relative  }
.lnb_1dli a.lnb_2da:after{width: 0%; height: 1px; background-color: var(--top1d-font-color-point);; position: absolute; left: 0px;  bottom:0px; content: ""; transition: all 0.5s;
-moz-transition: all 0.5s; /* Firefox 4 */
-webkit-transition: all 0.5s; /* Safari and Chrome */
-o-transition: all 0.5s; /* Opera */  
}
.lnb_1dli a.lnb_2da:hover:after{width: 100%; content: "";   }






/*  햄버거 메뉴 설정 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
#m_menu {position:absolute; height:var(--header-h);   top: calc(var(--header-h) * 0.5);  margin-top: -15px;	 right:0px; z-index:999999999999999999999999999999999999;display: none;  cursor: pointer}
#m_menu.change {position:fixed; height:var(--header-h);   top: calc(var(--header-h) * 0.5);  margin-top: -15px;	 right:20px; z-index:999999999999999999999999999999999999;display: none;  cursor: pointer}
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
#m_menu {position:fixed; height:var(--header-h);   top: calc(var(--header-h) * 0.5);  margin-top: -15px;	 right:20px; z-index:999999999999999999999999999999999999; cursor: pointer}
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/


/*  햄버거 메뉴 pc에서 보이게 설정  -----------------------------------*/	
#m_menu.pcview {  display: block}






.bar1, .bar2, .bar3 {
width: 25px;
height: 2px;
background-color: var(--top1d-font-color);
margin: 6px 0;
transition: 0.4s; 
}
.bar2 {
width: 25px;
height: 2px;
background-color: var(--top1d-font-color);
margin: 6px 0;
transition: 0.4s;
}
.change .bar1 {
-webkit-transform: rotate(-45deg) translate(-4px, 6px);
transform: rotate(-45deg) translate(-4px, 6px);background-color:var(--top1d-font-color);
}

.change .bar2 {opacity: 0;background-color: var(--top1d-font-color);}

.change .bar3 {
-webkit-transform: rotate(45deg) translate(-5px, -8px);
transform: rotate(45deg) translate(-5px, -8px);background-color:  var(--top1d-font-color);
}






header.opacity #lnb .bar1, header.opacity  #lnb .bar2, header.opacity #lnb .bar3 {
width: 25px;
height: 2px;
background-color: var(--top1d-font-color-opacity);
margin: 6px 0;
transition: 0.4s; 
}
header.opacity #lnb .bar2 {
width: 25px;
height: 2px;
background-color: var(--top1d-font-color-opacity);
margin: 6px 0;
transition: 0.4s;
}
header.opacity  #lnb .change .bar1 {
-webkit-transform: rotate(-45deg) translate(-4px, 6px);
transform: rotate(-45deg) translate(-4px, 6px);background-color:var(--top1d-font-color);
}

header.opacity #lnb .change .bar2 {opacity: 0;background-color: var(--top1d-font-color);}

header.opacity #lnb .change .bar3 {
-webkit-transform: rotate(45deg) translate(-5px, -8px);
transform: rotate(45deg) translate(-5px, -8px);background-color:  var(--top1d-font-color);
}






header.opacity:hover #lnb .bar1, header.opacity:hover   #lnb .bar2, header.opacity:hover #lnb .bar3 {
width: 25px;
height: 2px;
background-color: var(--top1d-font-color);
margin: 6px 0;
transition: 0.4s; 
}
header.opacity:hover  #lnb .bar2 {
width: 25px;
height: 2px;
background-color: var(--top1d-font-color);
margin: 6px 0;
transition: 0.4s;
}
header.opacity:hover  #lnb .change .bar1 {
-webkit-transform: rotate(-45deg) translate(-4px, 6px);
transform: rotate(-45deg) translate(-4px, 6px);background-color:var(--top1d-font-color);
}

header.opacity:hover #lnb .change .bar2 {opacity: 0;background-color: var(--top1d-font-color);}

header.opacity:hover #lnb .change .bar3 {
-webkit-transform: rotate(45deg) translate(-5px, -8px);
transform: rotate(45deg) translate(-5px, -8px);background-color:  var(--top1d-font-color);
}

header.small #lnb .bar1, header.small   #lnb .bar2, header.small #lnb .bar3 {
width: 25px;
height: 2px;
background-color: var(--top1d-font-color)!important;
margin: 6px 0;
transition: 0.4s; 
}


header.small  #lnb .change .bar1 {
-webkit-transform: rotate(-45deg) translate(-4px, 6px);
transform: rotate(-45deg) translate(-4px, 6px);background-color:var(--top1d-font-color);
}

header.small #lnb .change .bar2 {opacity: 0;background-color: var(--top1d-font-color);}

header.small #lnb .change .bar3 {
-webkit-transform: rotate(45deg) translate(-5px, -8px);
transform: rotate(45deg) translate(-5px, -8px);background-color:  var(--top1d-font-color);
}




/* 우측 글로벌 메뉴 설정-----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
#gmenu {position:absolute;	top:0px;	right:0%; z-index:2; display: flex;
justify-content:flex-end;  align-items: center; flex-direction:row; box-sizing: border-box; gap:20px; height:var(--header-h);}

header.large #gmenu {	position:absolute;		top:0px;	right:0%; z-index:2; display: flex;
justify-content:flex-end;  align-items: center; flex-direction:row; box-sizing: border-box; gap:20px}
header.small #gmenu {	position:absolute;	top:0px;	right:0%; z-index:2; display: flex;
justify-content:flex-end;  align-items: center; flex-direction:row; box-sizing: border-box; gap:20px}


#gmenu.pcview {right:50px!important;}


.loginbtn{width:auto;   float: left; display: flex;  justify-content:flex-start;  align-items: center;   color:var(--top1d-font-color); font-size: 0.9em; position: relative; cursor: pointer; border: 1px dashed var(--line-default);; border-radius: 30px; 
	padding: 10px 20px 10px 40px ;  height: 40px; line-height: 38px; }	
.loginbtn:before{position: absolute; left:15px; top:0px;content: "\eaf1";    font-family: unicons-line;  width:20px;   height: 40px; line-height: 38px; font-size:20px}	
	
	
.joinbtn{width:auto;  float: left; display: flex;  justify-content:flex-start;  align-items: center;   color: var(--top1d-font-color); font-size: 0.9em;  position: relative;  cursor: pointer;border: 1px dashed  var(--line-default);; border-radius: 30px; 
	padding: 10px 20px 10px 40px; height: 40px; line-height: 38px; }	
 .joinbtn:before{position: absolute; left:15px; top:0px;content: "\ea0e";    font-family: unicons-line;  width:20px; height: 40px; line-height: 38px; font-size:20px}		
	

	
.adminbtn{  float: left; display: flex;  justify-content:flex-start;  align-items: center;   color: var(--top1d-font-color); font-size: 0.9em;  position: relative;  cursor: pointer; 
 width:50px; height: 40px; line-height: 38px; }	
.adminbtn:before{position: absolute; left:0px; top:0px;content: "\ec60";    font-family: unicons-line;  width:50px; height: 40px; line-height: 38px; font-size:25px ; }		
	
	
header.opacity .loginbtn{ color: var(--top1d-font-color-opacity); border: 1px dashed  var(--line-opacity);}	
header.opacity .joinbtn{  color: var(--top1d-font-color-opacity); border: 1px dashed  var(--line-opacity);}	
header.opacity .adminbtn{  color: var(--top1d-font-color-opacity);}	

	
header.opacity:hover .loginbtn{ color: var(--top1d-font-color); border: 1px dashed  var(--line-default);}		
header.opacity:hover .joinbtn{  color: var(--top1d-font-color); border: 1px dashed  var(--line-default);}	
header.opacity:hover .adminbtn{  color: var(--top1d-font-color); }	

	
header.small  .loginbtn{ color: var(--top1d-font-color); border: 1px dashed  var(--line-default);}	
header.small  .joinbtn{  color: var(--top1d-font-color); border: 1px dashed  var(--line-default);}	
header.small  .adminbtn{  color: var(--top1d-font-color);}	

	
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
	
	
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
#gmenu {display: none;}
	
	
	

}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/



.loginbtn_m{width:auto;   float: left; display: flex;  justify-content:flex-start;  align-items: center;   color:var(--top1d-font-color); font-size: 0.9em; position: relative; cursor: pointer; border: 1px dashed var(--line-default);; border-radius: 30px; 
	padding: 10px 20px 10px 40px ;  height: 40px; line-height: 38px; }	
.loginbtn_m:before{position: absolute; left:15px; top:0px;content: "\eaf1";    font-family: unicons-line;  width:20px;   height: 40px; line-height: 38px; font-size:20px}	
	
	

.joinbtn_m{width:auto;  float: left; display: flex;  justify-content:flex-start;  align-items: center;   color: var(--top1d-font-color); font-size: 0.9em;  position: relative;  cursor: pointer;border: 1px dashed  var(--line-default);; border-radius: 30px; 
	padding: 10px 20px 10px 40px; height: 40px; line-height: 38px; }	
.joinbtn_m:before{position: absolute; left:15px; top:0px;content: "\ea0e";    font-family: unicons-line;  width:20px; height: 40px; line-height: 38px; font-size:20px}		
	




.mainNav {
			background: #FFF;
			width: 100%; float: left 
		}
			/* First Level */
			.mainNav ul {
				margin: 0;
				padding: 0;
				list-style: none;
				border-bottom: 1px solid #CCC
			}
			.mainNav ul li {
				border-top: 1px solid #CCC;
			}
			.mainNav ul li a {
				color: #333;
				display: block;
				font-size: 1.1em;
				line-height: normal;
				padding:12px 20px;
				text-decoration:none;
			}
			.mainNav ul li a:hover {
				background: #FFF;
				text-decoration: none;
			}
				/* Second Level */
				.mainNav ul ul {
					border-bottom: none
				}
				.mainNav ul ul li {
					border-top: 1px solid #CCC;
					background: #F7F7F7;
				}
				.mainNav ul ul li a {
					color: #333;
					display: block;
					font-size: 1em;
					line-height: normal;
					padding: 0.5em 1em 0.5em 2.5em;
				}
				.mainNav ul ul li a:hover {
					background: #F7F7F7;
				}
						/* Third Level */
				.mainNav ul ul ul {
					border-top:1px solid #CCC;
				}
				.mainNav ul ul ul li {
					border:none;
				}
				.mainNav ul ul ul li a {
					padding-left:3.5em; 
					padding-top:0.25em; 
					padding-bottom:0.25em;
				}
			/* Accordion Button */
			ul li.has-subnav .accordion-btn {
				color:#333; 
			 font-size:14px; box-sizing: border-box
			}
		
		@media screen and (max-width: 1024px) {
			.mainNav {width: 100%;}
		}
		@media screen and (max-width: 700px) {
			.mainNav {width: 100%;}
		}
	.has-subnav a {
				width: calc(100% -50px)!important; margin-right: 0px!important
			}


	ul li.has-subnav .accordion-btn-wrap{
			z-index: 99999999999999999999999999999!important	
			}