@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 {position: fixed; top: 0px; left: 0pz; z-index: 99999999; width: 100%; float: left}





/* 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; }



.wellness-N1{border-bottom:1px solid rgba(204,204,204,0.20)}

.wellness-N1.opacity{
    width: 100%;
    background:rgba(0,0,0,0.00)!important;
    transition: background 0.3s;
    padding-top: 0px;
    padding-bottom: 0rem;
    top: 0;
    left: 0;
    z-index: 999;
    position: absolute; 
}
h2.header-title a img{filter: none!important; /* 흰색으로 변경 */}


/*로고*/
.header-top-active h2.header-title a img.White{filter: none!important; /* 흰색으로 변경 */}
.header-top-active:hover h2.header-title a img.White{filter: none!important; /* 흰색으로 변경 */}

.opacity .header-top-active h2.header-title a img.White{filter: var(--logo-White)!important; /* 흰색으로 변경 */}
.opacity .header-top-active:hover h2.header-title a img.White{filter: none!important; /* 흰색으로 변경 */}




header .wellness-N1 .header-title a img {
filter: none;
}
header .wellness-N1.header-top-active .header-title a img {
filter: none;
}

header .wellness-N1 .header-title a img.White {
   filter: none;
}
header .wellness-N1.header-top-active .header-title a img.White {
  filter: invert(100%);
}


.header-utils {
display: none
}
.header-utils.pcview {
display:block!important
}



/*로고*/
.header-title a img{width:var(--logo-size-w)!important; height: auto!important/* 흰색으로 변경 */}







/* 우측 글로벌 메뉴 설정-----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
#gmenu {position:absolute;	top: -9px!important; 	right:0px; z-index:999; display: flex;
justify-content:flex-end;  align-items: center; flex-direction:row; box-sizing: border-box; grid-gap: 10px;  }
#gmenu.hmenuview {right:40px; }

#gmenu.noview {display: none; }


#gmenu .member_btn_box{width:auto;   float: left; display: flex; grid-gap: 5px; flex-direction: row;}
#gmenu .member_btn_box.noview {display: none; }
			
.member_btn_box .icon_btn{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;  
	 height: 35px; width: 30px; line-height: 38px;}
	
.member_btn_box .icon_btn::before{font-family: unicons-line;  font-size:25px;}
	
			

#gmenu .admin_topbtn{width:auto;   float: left; display: flex; grid-gap: 5px; flex-direction: row;}
#gmenu .admin_topbtn.noview {display: none; }
		


.admin_topbtn .icon_btn{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;  
	 height: 35px; width: 30px; line-height: 38px;}
	
.admin_topbtn .icon_btn::before{font-family: unicons-line;  font-size:25px; margin-top: -2PX}
	


.loginbtn:before{color: var(--top1d-font-color); }	
.logoutbtn:before{   color: var(--top1d-font-color); }
.joinbtn:before{  color: var(--top1d-font-color); margin-top: -5PX}	
.memberbtn:before{  color: var(--top1d-font-color); }	
.adminbtn:before{  color: var(--top1d-font-color); }		
.adminbtn2:before{  color: var(--top1d-font-color); }		
	
	
header.opacity .icon_btn:before{ color: var(--top1d-font-color-opacity); }	

	
header.opacity:hover .icon_btn:before{ color: #fff; }		

	
header.small  .icon_btn:before{  color: #fff; }	

	
.lang_select{width:auto;   float: left;  }	
	
header.opacity:hover .icon_btn:before{ color: var(--top1d-font-color); }	
header.opacity:hover .header-top-active .icon_btn:before{ color: var(--top1d-font-color);}	
header.opacity .icon_btn:before{ color: #333;}	
header.opacity .header-top-active .icon_btn:before{ color: var(--top1d-font-color-opacity)}	

	
	
header.small .loginbtn:before{color: var(--top1d-font-color); }	
header.small .logoutbtn:before{   color: var(--top1d-font-color); }
header.small .joinbtn:before{  color: var(--top1d-font-color); margin-top: -5PX}	
header.small .memberbtn:before{  color: var(--top1d-font-color);  }	
header.small .adminbtn:before{  color: var(--top1d-font-color); }		
header.small .adminbtn2:before{  color: var(--top1d-font-color); }		
	
		
	
}
/**** pc2 ****/
@media all and (max-width:1440px) and (min-width:768px) {
#gmenu.hmenuview {right:40px; }
	
	
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
#gmenu {position:absolute;	top: -9px!important; 	right:0px; z-index:999; display: flex;
justify-content:flex-end;  align-items: center; flex-direction:row; box-sizing: border-box; grid-gap: 10px;  }
#gmenu.hmenuview {right:40px; }

#gmenu.noview {display: none; }


#gmenu .member_btn_box{width:auto;   float: left; display: flex; grid-gap: 5px; flex-direction: row;}
#gmenu .member_btn_box.noview {display: none; }
			
.member_btn_box .icon_btn{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;  
	 height: 35px; width: 30px; line-height: 38px;}
	
.member_btn_box .icon_btn::before{font-family: unicons-line;  font-size:25px;}
	
			

#gmenu .admin_topbtn{width:auto;   float: left; display: flex; grid-gap: 5px; flex-direction: row;}
#gmenu .admin_topbtn.noview {display: none; }
		


.admin_topbtn .icon_btn{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;  
	 height: 35px; width: 30px; line-height: 38px;}
	
.admin_topbtn .icon_btn::before{font-family: unicons-line;  font-size:25px; margin-top: -2PX}
	


.loginbtn:before{color: var(--top1d-font-color); }	
.logoutbtn:before{   color: var(--top1d-font-color); }
.joinbtn:before{  color: var(--top1d-font-color); margin-top: -5PX}	
.memberbtn:before{  color: var(--top1d-font-color); }	
.adminbtn:before{  color: var(--top1d-font-color);}		
.adminbtn2:before{  color: var(--top1d-font-color); }		
	
	
header.opacity .icon_btn:before{ color: var(--top1d-font-color-opacity); }	

	
header.opacity:hover .icon_btn:before{ color: #fff; }		

	
header.small  .icon_btn:before{  color: #fff; }	

	
.lang_select{width:auto;   float: left;  }	
	
header.opacity:hover .icon_btn:before{ color: var(--top1d-font-color); }	
header.opacity:hover .header-top-active .icon_btn:before{ color: var(--top1d-font-color);}	
header.opacity .icon_btn:before{ color: #333;}	
header.opacity .header-top-active .icon_btn:before{ color: var(--top1d-font-color-opacity)}	

	
	
header.small .loginbtn:before{color: var(--top1d-font-color); }	
header.small .logoutbtn:before{   color: var(--top1d-font-color); }
header.small .joinbtn:before{  color: var(--top1d-font-color); margin-top: -5PX}	
header.small .memberbtn:before{  color: var(--top1d-font-color);  }	
header.small .adminbtn:before{  color: var(--top1d-font-color); }		
header.small .adminbtn2:before{  color: var(--top1d-font-color); }		
	
		

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









/* sns 아이콘 //end -----------------------------------*/

#gmenu .topSNSbtn{width:auto;   float: left; display: flex; grid-gap: 5px; flex-direction: row; margin-right: 10px}
#gmenu .topSNSbtn.noview {display: none; }
				

.topSNSbtn .icon_btn{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;  
	 height: 40px; min-width: 30px; line-height: 38px;}
	
.topSNSbtn .icon_btn i{ font-size:23px; color: #333; }
 .topSNSbtn .icon_btn img{ width: 100%}
.topSNSbtn .icon_btn:before{ font-family: unicons-line; font-size:23px;}
	

.opacity  .topSNSbtn .icon_btn i{ font-size:23px; color: #Fff; }


header.small .topSNSbtn .icon_btn i{ font-size:23px; color: #333; }
header:hover .topSNSbtn .icon_btn i{ font-size:23px; color: #333; }
header.large:hover .topSNSbtn .icon_btn i{ font-size:23px; color: #333!important; }









/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
	
	

.icon_btn_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-radius: 30px; 
	padding: 0px 0px 0px 40px ;  height: 35px; line-height: 35px; }
	
.icon_btn_m::before{ width:20px;   height: 20px;  font-size:25px; position: absolute; left: 10px; top: 0px }
	

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

.icon_btn_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-radius: 30px; 
	padding: 0px 0px 0px 40px ;  height: 35px; line-height: 35px; }
	
.icon_btn_m::before{ width:20px;   height: 20px;  font-size:25px; position: absolute; left: 10px; top: 0px }
		
		
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/

.loginbtn:before{content: "\e855";    font-family: unicons-line; }	
.logoutbtn:before{content: "\eaf1";    font-family: unicons-line; }	
.joinbtn:before{content: "\ea0e";    font-family: unicons-line; }		
.memberbtn:before{content: "\ea0d";    font-family: unicons-line;  }	
.adminbtn:before{content: "\e877"!important;    font-family: unicons-line;  }		
.adminbtn2:before{content: "\ec60";    font-family: unicons-line;  }		


.loginbtn_m:before{content: "\e855";    font-family: unicons-line; }	
.logoutbtn_m:before{content: "\eaf1";    font-family: unicons-line; }	
.joinbtn_m:before{content: "\ea0e";    font-family: unicons-line; }		
.memberbtn_m:before{content: "\ea0d";    font-family: unicons-line;  }	
.adminbtn_m:before{content: "\ec60";    font-family: unicons-line;  }		
.adminbtn2_m:before{content: "\ec60";    font-family: unicons-line;  }		
	






/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
	
	.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}		

.adminbtn_m{  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 ; }		
	

}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
	
	
.loginbtn_m{width:auto;   float: left; display: flex;  justify-content:flex-start;  align-items: center;   color:var(--top1d-font-color); font-size: 0.8em; position: relative; cursor: pointer; border: 1px dashed var(--line-default);; border-radius: 30px; 
	padding: 5px 10px 5px 30px ;  height: 30px; line-height: 30px; }	
.loginbtn_m:before{position: absolute; left:5px; top:3px;content: "\eaf1";    font-family: unicons-line;  width:20px;   height: 30px; line-height:20px; 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.8em;  position: relative;  cursor: pointer;border: 1px dashed  var(--line-default);; border-radius: 30px; 
	padding: 5px 10px 5px 30px; height: 30px; line-height: 30px; }	
.joinbtn_m:before{position: absolute; left:5px; top:3px;content: "\ea0e";    font-family: unicons-line;  width:20px; height: 30px; line-height: 20px; font-size:20px}		

.adminbtn{  float: left; display: flex;  justify-content:flex-start;  align-items: center;   color: var(--top1d-font-color); font-size: 0.8em;  position: relative;  cursor: pointer; 
 width:50px; height: 30px; line-height: 30px; }	
.adminbtn:before{position: absolute; left:0px; top:12px;content: "\ec60";    font-family: unicons-line;  width:50px; height: 30px; line-height: 20px; font-size:25px ; }		
	.adminbtn2:before{position: absolute; left:0px; top:3px; }		
	
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/






/* 언어 셀렉트   추가*/

       /* 기본 스타일 */
        .language-dropdown {
            position: relative;
            display: inline-block; display: none
        }
       .language-dropdown.view{
            position: relative;
            display: block!important;
        }

        .dropdown-button {
            display: flex;
            align-items: center;
            gap: 5px;
            padding: 5px 15px;
            border: 1px solid #ddd;
           background: #f1f1f1;
            cursor: pointer;
            border-radius: 30px;
            transition: background 0.3s ease;font-size: 13px; color: #333
        }
     .language-dropdown:hover {
            position: relative;
            display: inline-block;
        }

       .language-dropdown:hover   .dropdown-button {
            background: #f1f1f1;;font-size: 13px; color: #333
        }

        .dropdown-button img {
            width: 20px;
            height: auto;
        }

        .dropdown-menu {
            display: none;
            position: absolute;
            top: 100%;
            left: 0;
            width:130px;
            background: white;
            border: 1px solid #ddd;
            border-radius: 5px;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
            overflow: hidden;
        }

        .dropdown-item {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 5px 12px;
            cursor: pointer;
            transition: background 0.3s ease;font-size: 13px; color: #333
        }

        .dropdown-item:hover {
            background: #f1f1f1;
        }

        .dropdown-item img {
            width: 20px;
            height: auto;
        }



    /* 버튼 스타일 */
        .tooltip_ov {
            position: relative;
        }

        /* 말풍선 스타일 */
        .tooltip_ov .tooltip {
            position: absolute;
            bottom: -65%;
            left: 42%;
            transform: translateX(-50%);
            background: rgba(0, 0, 0, 0.75);
            color: white;
            padding: 5px 5px!important;; line-height: 120%!important; 
            border-radius: 5px;
            font-size: 11px;
            white-space: nowrap;
            opacity: 0;
            visibility: hidden;
            transition: opacity 0.2s ease-in-out;
        }

        /* 말풍선 화살표 */
       .tooltip_ov .tooltip::after {
            content: "";
            position: absolute;
            top: -10px;
            left:17px;
         
            border-width: 6px;
            border-style: solid;
            border-color: rgba(0, 0, 0, 0.75) transparent transparent transparent; transform:rotate(180deg) 
        }

        /* 마우스 오버 시 말풍선 표시 */
        .tooltip_ov:hover .tooltip {
            opacity: 1;
            visibility: visible;
        }




.header-gnbitem:focus-within > .header-sublist {
  display: block !important;
}