﻿@charset "utf-8";

@media (max-width:960px){/*mobile,tablet*/   
#header{height:57px;}  
#header .head_box > h1{width:calc(100% - 94px);left:48px;top:0;display:block;position:fixed;z-index:10001;font-size:22px;text-align:center;line-height:44px;font-family:'Open Sans' , 'Nanum Gothic' , '나눔고딕';font-weight:600;min-width:226px;}
#header .head_box > h1 > a{color:#fff;}
#header .head_box > h1 > a:hover{color:#fff;}
#header .head_box > h1 > a > img{display:none;}
#header .head_box > h1 > a > span{display:inline}
 
/*info_box*/
.info_list_box{
	display:none;background-color:rgba(0,0,0,0.5);   
	position:fixed;
	width:100%;height:100%;max-height:calc(100% - 45px);
	z-index:10001;top:45px;right:0;     
	font-family:'Open Sans' , 'Nanum Gothic' , '나눔고딕';font-weight:600;
	text-align:center;
	}
.info_list_box > ul{position:relative;text-align:center;width:100%;height:auto;border-bottom:3px solid transparent;background:#fff;padding:10px 0;} 
.info_list_box > ul > li{display:inline-block;padding:10px 0;width:85px;}
.info_list_box > ul > li i{position:relative;display:inline-block;background:#f1f1f1;width:40px;height:40px;line-height:40px;text-align:center;cursor:pointer;border-radius:50px;font-size:18px;}
.info_list_box > ul > li > a{color:#fff;} 
.info_list_box > ul > li > a > span{display:block;width:auto;margin-top:4px;color:#333;font-size:10px;}
.info_list_bt{position:fixed;top:0;right:0;z-index:10001;text-align:center;width:45px;height:45px;line-height:45px;background:transparent;color:#fff;font-size:27px;cursor:pointer;}   
.info_list_open{display:block;}
.info_list_close{display:none;}   
.info_list_close i{transform:rotate(45deg);}	

/*user name*/ 
.info_list_box > ul > li.user_name{position:absolute;bottom:-43px;left:0;width:100%;background:transparent;border-bottom:3px solid transparent;}    
.info_list_box > ul > li.user_name > i{display:inline;background:none;font-family:'FontAwesome' , 'Nanum Gothic';font-size:15px;color:#666;cursor:default;line-height:20px;}   
/*my notice*/     
.info_list_box > ul > li.mynotice a > i > span{background:transparent;font-family:'Open Sans' , 'Nanum Gothic' , '나눔고딕';font-weight:600;font-size:14px;position:absolute;display:inline-block;top:0px ;left:-3px;color:#fff;text-align:center;width:22px;height:22px;line-height:22px;border-radius:50%;}
.info_list_box > ul > li.admin_on > a > i > span{background:#ff5050 !important;}   

/*sub_search search*/  
.sub_search_box{left:10px;top:-43px;z-index:1;position:absolute;width:calc(100% - 20px);}        
.sub_search_box fieldset .search_text{float:left;width:calc(100% - 30px);height:30px;line-height:30px;font-size:15px;border:1px solid transparent;background:#fff;color:#383838;font-family:'Open Sans' , 'Nanum Gothic' , '나눔고딕';font-weight:600;padding:0 35px 0 12px;}  
.sub_search_box fieldset .search_btn{float:left;width:30px;height:30px;padding:0;vertical-align:0px;border:none;background:transparent;text-align:center;right:0;cursor:pointer;color:#fff;}
.sub_search_box fieldset .search_btn > i{color:#fff;font-size:20px;text-align:center;line-height:30px;}
.sub_search_box ::-webkit-input-placeholder{color:#383838 !important;}  
.sub_search_box :-moz-placeholder{/* Firefox 18- */  color:#383838 !important;}
.sub_search_box ::-moz-placeholder{ /* Firefox 19+ */color:#383838 !important;}
.sub_search_box :-ms-input-placeholder{color:#383838 !important;}     

/*****  Nav - Main Menu css *****/
#nav{position:fixed;top:0;left:0;width:100%;z-index:10000;background-color:transparent;min-width:320px;font-family:'Open Sans' , 'Nanum Gothic' , '나눔고딕';font-weight:600;} 
.nav .wrapper{width:100%;min-width:320px;height:45px;}
.nav-container{
	position:fixed;top:45px; left:0;z-index:9999;overflow-y:auto;
	visibility:hidden;width:100%;height:100%;min-height:100%;
	margin:0;padding:0;
	-webkit-transition:all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
	transition:all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
	-webkit-transform:translateX(-100%);	
	-ms-transform:translateX(-100%);
	transform:translateX(-100%);
	background-color:#f8f8f9 ;
 	-webkit-overflow-scrolling:touch;
}
.nav-container.is-visible{visibility:visible;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);}
.nav-toggle{line-height:1;display:inline-block;width:46px;height:45px;border:0;background-color:transparent;padding:0;cursor:pointer;outline:none}     
.nav-toggle .icon-menu{position:relative;display:block;width:28px;height:20px;vertical-align:middle;fill:none;margin-left:8px;}
.icon-menu .line{position:absolute;left:0;display:block;width:100%; height:4px;
	  -webkit-transition:all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1.000);
	  transition:all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1.000);
	  -webkit-transition-timing-function:cubic-bezier(0.645, 0.045, 0.355, 1.000);
	  transition-timing-function:cubic-bezier(0.645, 0.045, 0.355, 1.000);
	  background-color:#fff;
}
.icon-menu .line-1{top:0;}
.is-active .icon-menu .line-1{
  -webkit-transform:translateY(8px) translateX(0) rotate(45deg);
  -ms-transform:translateY(8px) translateX(0) rotate(45deg);
  transform:translateY(8px) translateX(0) rotate(45deg);
}
.icon-menu .line-2{top:50%;margin-top:-2px;}
.is-active .icon-menu .line-2{opacity:0;}
.icon-menu .line-3{bottom:0;}
.is-active .icon-menu .line-3{
  -webkit-transform:translateY(-8px) translateX(0) rotate(-45deg);
  -ms-transform:translateY(-8px) translateX(0) rotate(-45deg);
  transform:translateY(-8px) translateX(0) rotate(-45deg);
}
.nav-menu{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;} 
.nav-menu .menu-link{display:block; text-decoration:none;}
.has-dropdown{position:relative;cursor:pointer;}
.has-dropdown > .menu-link{display:inline-block;}
.has-dropdown:after{font-family:'FontAwesome';font-size:20px;position:absolute;top:0px;right:0px;content:"\f078"; color:#555;width:100%;text-align:right;padding:15px;}
.has-dropdown.is-active:after{content:"\f077";color:transparent;}  
.nav-dropdown{display:none;}
.has-dropdown.is-active > .nav-dropdown{display:block;} 
.nav-dropdown .menu-item:last-child{border-bottom:none;}
.content{margin-top:60px;}
.content .wrapper{padding:1rem 0;}
.m_home{display:none;}
.nav-container a{color:#555;} 
.nav-container > ul{padding-bottom:45px;}   
.nav-container > ul > li{border-bottom:1px solid #d1d1d1;}  
.nav-container > ul > li.is-active{background:transparent;border-bottom:2px solid #ccc;}      
.nav-container > ul > li > a{padding:15px;font-size:16px}  
.nav-container > ul > li.is-active > a, .nav-container > ul > li:hover > a, .nav-container > ul > li.active > a{color:transparent;}    
.nav-container > ul > li > div{background:#f8f8f9;} 
.nav-container > ul > li > div > ul{} 
.nav-container > ul > li > div > ul > li{border-bottom:1px solid #ddd;}  
.nav-container > ul > li > div > ul > li > a{padding:13px 35px;font-size:14px} 
.nav-container > ul > li > div > ul > li:hover > a{color:transparent;}  
.nav-container > ul > li > div > ul > li > ul{background:#fff;}
.nav-container > ul > li > div > ul > li > ul > li{padding-left:30px;border-bottom:1px solid #f1f1f1;}
.nav-container > ul > li > div > ul > li > ul > li > a{padding:12px;font-size:13px;} 

/*전체메뉴*/
.all_navi_wrap{display:none;}
 
}

@media (min-width:961px){/*desktop*/ 

/*****  Header *****/
#header{width:100%;height:100px;}
#header .head_box{width:100%;margin:0 auto;position:relative;}
#header .head_box > h1{float:left;width:auto;max-width:500px;height:100px;font-size:36px;font-family:'Open Sans' , 'Nanum Gothic' , '나눔고딕';font-weight:600;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;letter-spacing:-1px;}
#header .head_box > h1 > a{color:#fff;display:inline-block;line-height:100px;color:transparent}     
#header .head_box > h1 > a.text_img_type > img{vertical-align:-8px;height:40px;width:auto;max-width:90px;margin-right:8px;}  
#header .head_box > h1 > a.img_type > img{vertical-align:middle;margin-top:-8px;height:auto;max-height:50px;width:auto;max-width:100%;}
#header .head_box > h1 > a.img_type > span{display:none;}
#header .head_box ul li{display:inline;}

/*info_box*/
#header .info_list{float:right;line-height:100px;} 
#header .info_list > li{font-size:13px;font-family:'Open Sans' , 'Nanum Gothic' , '나눔고딕';font-weight:600;margin-right:4px;}
#header .info_list > li > a{color:#555;padding:6px 4px;}             
#header .info_list > li > a:hover{border-bottom:2px solid transparent;}      
#header .info_list > li > a:hover > i{color:transparent}
.info_list_open, .info_list_close{display:none !important;}  
/*user_name*/ 
#header .info_list > li.user_name{padding-left:4px;color:transparent;}   
/*login bt*/
#header .info_list > li.login_bt{margin-right:0px;}  
#header .info_list > li.login_bt > a{background:#eee;padding:2px 4px;}         
#header .info_list > li.login_bt > a:hover{border:none;background:transparent;}
/*my notice*/    
#header .info_list > li.mynotice > a{padding:6px 0;} 
#header .info_list > li.mynotice > a > i{position:relative;display:inline-block;font-size:16px;margin:0px;padding-left:10px;}  
#header .info_list > li.mynotice > a > i > span{
	font-family:'Open Sans' , 'Nanum Gothic' , '나눔고딕';font-weight:600;font-size:10px;position:absolute;display:inline-block;top:-5px ;left:-1px;     
	background:transparent;color:#fff;text-align:center;width:18px;height:18px;line-height:18px;border-radius:50%;   
	} 
#header .info_list > li.admin_on > a > i > span{background:#ff5050 !important;}   
 
/*sub_search search*/ 
.sub_search_box{right:20px;top:33px;z-index:1;position:absolute;width:300px;}      
.sub_search_box fieldset .search_text{float:left;width:265px;height:35px;line-height:35px;font-size:15px;border:1px solid transparent;background:#fff;color:#383838;font-family:'Open Sans' , 'Nanum Gothic' , '나눔고딕';font-weight:600;padding:0 35px 0 12px;}  
.sub_search_box fieldset .search_btn{float:left;width:35px;height:35px;padding:0;vertical-align:0px;border:none;background:transparent;text-align:center;right:0;cursor:pointer;color:#fff;}
.sub_search_box fieldset .search_btn > i{color:#fff;font-size:20px;text-align:center;line-height:35px;}
.sub_search_box ::-webkit-input-placeholder{color:#383838 !important;}  
.sub_search_box :-moz-placeholder{/* Firefox 18- */  color:#383838 !important;} 
.sub_search_box ::-moz-placeholder{ /* Firefox 19+ */color:#383838 !important;} 
.sub_search_box :-ms-input-placeholder{color:#383838 !important;}     

/*****  Nav - Main Menu css *****/
#nav{position:relative;z-index:10000;font-family:'Open Sans' , 'Nanum Gothic' , '나눔고딕';font-weight:600;width:100%;background:transparent} 
#nav:after{content:" ";display:block;font-size:0;height:0;clear:both;visibility:hidden;}
.nav-toggle{display:none;}
.nav .wrapper{position:relative;}	
.nav, .nav-container, .nav-container.is-visible{position:static;top:auto;left:auto;z-index:auto;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);}
.nav-container, .nav-container.is-visible{visibility:visible;height:auto;min-height:0;overflow-y:visible;}
.nav-menu > .menu-item,  .nav-menu > .menu-item.is-active{display:inline-block;background-color:transparent;border:0;}
.nav-menu .menu-item{-webkit-transition:background-color 0.15s ease-in-out,  color 0.15s ease-in-out;transition:background-color 0.15s ease-in-out,  color 0.15s ease-in-out;}
.has-dropdown:after{content:"" !important;}  
.has-dropdown:hover > .nav-dropdown{visibility:visible;opacity:1;-webkit-transition-delay:0s;transition-delay:0s;}
.nav-dropdown .menu-item{border:0;}
.nav-dropdown .nav-dropdown,  .nav-dropdown .nav-dropdown .menu-item{background-color:#dedede;}
.nav-dropdown .nav-dropdown{z-index:9998;top:0;left:100%;}
.content{margin-top:0;}
.nav-container{width:100%;margin:0 auto;height:50px;}
.nav-container > ul{display:block;padding:0;font-weight:600;width:100%;max-width:1240px;margin:0 auto;padding:0 20px;}
.nav-container > ul:after{content:" ";display:block;font-size:0;height:0;clear:both;visibility:hidden;} 
.nav-container > ul > li{float:left;padding:0 40px 0 0;font-size:15px;} 
.nav-container > ul > li:first-child{margin-left:0;}
.nav-container > ul > li > a{display:block;height:100%;line-height:50px;color:#fff;text-align:center;position:relative;}
.nav-container > ul > li:hover > a:after{content:"\f0d8";font-family:'FontAwesome';position:absolute;font-size:26px;top:20px;left:50%;margin-left:-8px;color:#fff;}
.nav-container > ul > li > div{display:block;opacity:0;position:absolute;top:100%;left:0;width:100%;margin:0;padding:15px 0;line-height:20px;border-bottom:2px solid transparent;	background:#fff;border-top:none;visibility:hidden;
-webkit-transition:visibility 0s linear 0.25s,  opacity 0.25s linear;	transition:visibility 0s linear 0.25s,  opacity 0.25s linear;}	
.nav-container > ul > li > div > ul{width:100%;margin:0 auto;font-family:'Open Sans' , 'Nanum Gothic' , '나눔고딕';}	 
.nav-container > ul > li > div > ul > li{float:left;padding-right:20px;font-size:14px;}
.nav-container > ul > li > div > ul > li:first-child{margin-left:-12px;}
.nav-container > ul > li > div > ul > li > a{display:inline;padding:5px 12px;color:#373738;border-radius:20px}	 
.nav-container > ul > li > div > ul > li:hover > a{color:transparent;background:transparent;}    
.nav-container > ul > li > div > ul > li > ul{padding:5px 12px}  
.nav-container > ul > li > div > ul > li > ul > li{padding:2px 0;font-size:13px;}
.nav-container > ul > li > div > ul > li > ul > li > a{padding:5px 0;color:#777}
.nav-container > ul > li > div > ul > li > ul > li > a:before{content:"-";padding-right:3px;}  
.nav-container > ul > li > div > ul > li > ul > li > a:hover{color:transparent;}

/*전체메뉴*/
.all_navi_wrap{position:absolute;width:1200px;top:150px;left:50%;margin-left:-600px;z-index:10001;}
.all_navi_wrap p{position:absolute;width:50px;height:50px;line-height:50px;cursor:pointer;text-align:center;background:transparent;color:#fff;font-size:25px;}
.all_navi_open{top:-50px;right:1px;}
.all_navi_close{top:0;right:0px;line-height:46px;}
/*.all_navi_close > i{transform:rotate(45deg);}*/

.all_navi_box{display:none;position:absolute;width:100%;top:-50px;background:#fff;line-height:16px;border:1px solid transparent;border-top:none;}
.all_navi_box > h3{width:100%;height:50px;line-height:50px;background:transparent;color:#fff;font-size:20px;font-family:'Open Sans';font-weight:300;} 
.all_navi_box > ul{width:100%;position:relative;}   
.all_navi_box > ul > li{float:left;width:20%;padding-bottom:15px;} 
.all_navi_box > ul > li:nth-child(5n+2){clear:both;}  
.all_navi_box > ul > li > a{display:inline-block;width:100%;font-size:18px;color:transparent;padding:15px;border:1px solid transparent;border-left:none;background:#f8f8f9;}
.all_navi_box > ul > li:nth-child(5n+1) > a{border-right:none;}
.all_navi_box > ul > li:nth-child(1) > a, .all_navi_box > ul > li:nth-child(2) > a, .all_navi_box > ul > li:nth-child(3) > a,
.all_navi_box > ul > li:nth-child(4) > a, .all_navi_box > ul > li:nth-child(5) > a, .all_navi_box > ul > li:nth-child(6) > a{border-top:none;}
.all_navi_box > ul > li:hover > a{background:transparent;}   
.all_navi_box > ul > li > ul{padding:10px;}  
.all_navi_box > ul > li > ul > li{padding:3px 0;position:relative;}
.all_navi_box > ul > li > ul > li > a{color:#383838;font-size:14px;padding:5px;padding-left:10px;line-height:22px;font-family:'Open Sans' , 'Nanum Gothic' , '나눔고딕';font-weight:600;}          
.all_navi_box > ul > li > ul > li:hover > a{color:transparent;} 
.all_navi_box > ul > li > ul > li:hover > a:before{content:"\f0da";font-family:'FontAwesome';position:absolute;left:2px;}
.all_navi_box > ul > li > ul > li > ul{padding:3px 8px 0px 8px}
.all_navi_box > ul > li > ul > li > ul > li{line-height:23px;} 
.all_navi_box > ul > li > ul > li > ul > li > a{padding:2px 5px;color:#555;font-size:14px;}  
.all_navi_box > ul > li > ul > li > ul > li > a:hover{background:#f1f1f1}  
.all_navi_box > ul > li > ul > li > ul > li > a:before{content:"·";margin-right:2px;color:#000;}      
.all_navi_box .m_home{display:none;}

}  
@media (min-width:961px) and (max-width:1199px){
/*****  Nav - Main Menu css *****/
.nav-container > ul > li > a{font-size:14px;}
.nav-container > ul > li > div > ul > li{padding-right:12px}
.nav-container > ul > li > div > ul > li > a{padding:5px 10px;font-size:12px;}	

/*전체메뉴*/
.all_navi_wrap{position:absolute;width:100%;left:0;margin-left:0;}
.all_navi_box > h3{padding-left:15px;font-size:16px;}
.all_navi_box > ul > li > a{font-size:14px;}
.all_navi_box > ul > li > ul > li> a{font-size:13px;}
.all_navi_box > ul > li > ul > li > ul > li > a{font-size:12px;}

}

@media (max-width:767px){

#header .head_box > h1{font-size:18px;} 
	
/*sub_search search*/   	
.sub_search_box{top:-41px;width:100%;left:0;}    
}