@charset"utf-8";
/*Header Search*/

#skip a {width:100%; height:50px; line-height:50px; text-align:center; position:absolute; left:-9999px; top:0; z-index:10000; background-color:rgba(0,0,0,0.6); color:#fff;}
#skip a:active,
#skip a:focus {left:0; text-decoration:none;}



.sb-search {
	position:absolute;right:0;	float:right;
	width:40px; height:40px; /* 검색버튼 위치 사이즈조절*/
	overflow:hidden;
	-webkit-transition:width 0.3s;
	-moz-transition:width 0.3s;
	transition:width 0.3s;
	-webkit-backface-visibility:hidden;
	}
.sb-search-input {
	position:absolute; 
	top:0; 	right:40px; /* 버튼 겹치지 않게 여백 조절 */
	width:calc(100% - 40px); height:40px; /* 입력창 사이즈조절*/ 
	width:-webkit-calc(100% - 40px);	
	padding:0 0 0 10px !important ;
	border:none;outline:none;
	background:#fff;
	margin:0; 	z-index:10;
	font-size:15px;color:#2c3e50;
	border-radius:0 !important ; 
	border:4px solid transparent; border-right:none !important;/*입력창 테두리 조절*/
	}
.sb-search-input ::-webkit-input-placeholder {color:#f00 !important;}
.sb-search-input :-moz-placeholder {color:#f00 !important;}
.sb-search-input ::-moz-placeholder {color:#f00 !important;}
.sb-search-input :-ms-input-placeholder {color:#f00 !important;}     
.sb-icon-search, .sb-search-submit{
	width:40px;height:40px; /* 검색버튼 사이즈조절*/
	display:block;
	position:absolute;right:0;	top:0;
	padding:0;margin:0;
	line-height:40px;  /* 라인 높이 사이즈 조절*/
	text-align:center;
	cursor:pointer;}
.sb-search-submit {
	background:#fff; /* IE needs this */
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */ 
	filter:alpha(opacity=0); /* IE 5-7 */ 
	opacity:0;color:transparent;
	border:none;outline:none;z-index:-1;}
.sb-icon-search {color:#fff;	background:transparent ;z-index:90;border-radius:50%; font-size:20px;}
/*.sb-icon-search > i{position:absolute;}
.sb-icon-search > i.fa-book{font-size:20px;top:5px; left:3px}
.sb-icon-search > i.fa-search{font-size:15px;top:5px; left:10px;color:transparent}*/ 

/* Header Search Open state */
.sb-search.sb-search-open, .no-js .sb-search {width:100%;}  
.sb-search.sb-search-open .sb-icon-search, .no-js .sb-search .sb-icon-search {	background:transparent ;color:#fff;z-index:11;}
.sb-search.sb-search-open .sb-search-submit, .no-js .sb-search .sb-search-submit {z-index:90;} 

@media (min-width:768px) {
.d_skip{ font-size:0; width:0; height:0; line-height:0; position:absolute; left:-9999px; }
/*****************************/
/* Header css*/
/*****************************/
#m_header{width:100%; max-width:1240px;height:170px;margin:0 auto;padding:50px 20px 0 20px; }    
#m_header a {color:transparent;}
#m_header div.header_left{font-family:'Open Sans' , 'Nanum Gothic' , '나눔고딕';font-weight:600;color:transparent ;width:auto; }
#m_header div.header_left img.big_logo{height:36px;max-width:380px;}
#m_header div.header_left a.small_text{vertical-align:middle;}
#m_header div.header_left img.small_logo{height:38px;max-width:50px; vertical-align:top}
#m_header h1.big_title{font-size:34px;line-height:30px;float:left;}
#m_header span.small_title{font-size:16px;display:block;position:relative;z-index:9999;text-transform:uppercase;letter-spacing:8px;padding:0 0 9px 1px;}	
#m_header div.header_right{position:relative; float:right; width:auto;min-width:400px;}
#m_header div.header_right ul.info_list{float:right;font-size:15px; line-height:38px; margin-right:40px;}	
#m_header div.header_right ul.info_list > li{display:inline;padding-right:6px;}	  
#m_header div.header_right ul.info_list > 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;}
#m_header div.header_right ul.info_list > li > i.fa-user{display:inline; background:none;font-family:'FontAwesome' , 'Nanum Gothic';font-weight:600;font-size:16px; color:#666;cursor:default;}   
#m_header div.header_right ul.info_list > li > i > span{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%;}
#m_header div.header_right ul.info_list > li.admin_on > i{color:#ff6262;}
#m_header div.header_right ul.info_list > li.admin_on > i > span{background:#ff6262;}
#m_header div.header_right ul.info_list > li.admin_off > i{color:transparent;}
#m_header div.header_right ul.info_list > li.admin_off > i > span{background:transparent;} 

/*info_box*/
.info_list_open, .info_list_close{display:none !important;}  

/*****************************/
/*  Nav - Main Menu css */
/*****************************/
.nav-toggle { display:none; }
#nav {position:relative;z-index:10000; text-align:center; border-bottom:1px solid transparent ;font-family:'Open Sans' , 'Nanum Gothic' , '나눔고딕';font-weight:600; } 
#nav:after {content:" "; display:block; font-size:0; height:0; clear:both; visibility:hidden;}
.nav-container > ul{display:inline-block; margin-bottom:-5px; padding:0;font-family:'Nanum Gothic' , '나눔고딕';font-weight:600;} 
.nav-container > ul:after{content:" "; display:block; font-size:0; height:0; clear:both; visibility:hidden;} 
.nav-container > ul > li{ display:block;  float:left; position:relative;margin-right:10px; width:auto;} 
.nav-container > ul > li:last-child{ margin-right:0;}
.nav-container > ul > li:after { content:""; display:block; position:absolute; width:100%; height:0; top:0; z-index:0; background:#ffffff;}  
.nav-container > ul > li > a{
	font-size:18px;text-decoration:none; display:block; margin:0;color:#716495;
 	padding:15px 20px; letter-spacing:0px; text-transform:uppercase; z-index:2; position:relative;      
 	border:1px solid #b9c3c8;border-bottom:none;  
	}
.nav-container > ul > li > ul {position:absolute;left:-9999px;top:auto; width:100%; display:block; border:1px solid transparent ; border-top:none;padding:5px 0 10px 0; background:#fff;} 
.nav-container > ul > li > ul > li {max-height:0; position:absolute;background:#fff; text-align:left; width:100%; display:block;padding:5px 15px;} 
.nav-container > ul > li > ul > li > a {width:100%; display:block; font-size:14px;color:#666;}  
.nav-container > ul > li > ul > li:hover > a, .nav-container > ul > li > ul > li.active > a {color:transparent;}   
.nav-container > ul > li > ul > li:hover:after,.nav-container > ul > li > ul > li.active:after {background:transparent;}
.nav-container > ul > li > ul > li:hover > ul { position:relative; right:auto; left:0;}
.nav-container > ul > li > ul > li:hover > ul > li { position:relative;}    
.nav-container > ul > li > ul > li > ul{padding:5px 0 0 5px; }    
.nav-container > ul > li > ul > li > ul > li {padding:0;margin:0; line-height:14px; padding:3px 0px 3px 5px; } 
.nav-container > ul > li > ul > li > ul > li > a{font-size:13px;color:#666;display:block;font-family:'Nanum Gothic'; }   
.nav-container > ul > li > ul > li > ul > li > a > span:before{font-family:'FontAwesome'; content:"-"; padding-right:2px;}      
.nav-container > ul > li > ul > li > ul > li > a:hover{color:#222; }  
.nav-container > ul > li > ul > li > ul > li > a:hover > span:before{color:transparent;}  
.nav-container > ul > li:hover:after, .nav-container > ul > li.active:after {height:100%; }  
.nav-container > ul > li:hover > a, .nav-container > ul > li.active > a {padding:12px 20px 15px 20px; color:transparent ;  border:1px solid transparent; border-bottom:none; border-top-width:4px; }
.nav-container > ul > li:hover > a:after, .nav-container > ul > li.active > a:after {background:#000000;}
.nav-container > ul > li:hover > a:before, .nav-container > ul > li.active > a:before { border-top-color:#ffffff;}

.nav-container > ul > li:hover > ul {left:0;}
.nav-container > ul > li:hover > ul > li {max-height:500px; position:relative;}
/* 
.nav-container > ul > li > a:focus + ul {left:0;}
.nav-container > ul > li > a:focus + ul > li {max-height:500px; position:relative;}
 */

}
 
@media (max-width:1200px){
#m_header{height:150px;padding:35px 20px 0 20px;} 
.nav-container > ul > li > a{font-size:15px;letter-spacing:-0.5px;} 
.nav-container > ul > li > ul > li > a{font-size:13px;}
.nav-container > ul > li > ul > li > ul > li > a{font-size:12px;}
}
@media (max-width:960px){
#m_header h1{font-size:28px;line-height:32px;}  
#m_header span.small_title{font-size:12px;} 	
#m_header div.header_left img.small_logo{height:34px; max-width:46px; }
#m_header div.header_right{min-width:300px;}  
.nav-container > ul > li{margin-right:6px;} 
.nav-container > ul > li > a {font-size:14px;padding:15px 10px; }
.nav-container > ul > li > ul{letter-spacing:-0.5px}    
.nav-container > ul > li > ul > li{padding:2px 8px; }
.nav-container > ul > li > ul > li > a{font-size:12px;padding:6px 0;} 
.nav-container > ul > li > ul > li > ul{padding:0 0 0 5px;} 
.nav-container > ul > li > ul > li > ul > li > a{font-size:12px; padding:2px 0 ;}   
.nav-container > ul > li:hover > a, .nav-container > ul > li.active > a {padding:12px 10px 15px 10px;}  
}

@media (max-width:767px){/*ppppp*/
.m_skip{ font-size:0; width:0; height:0; line-height:0; position:absolute; left:-9999px; }

/*****************************/
/* Header css*/
/*****************************/  
#m_header{width:100%; max-width:1240px; padding:0 10px; height:auto;margin:0 auto;} 
#m_header h1{width:calc(100% - 90px);left:45px; top:0; display:block; position:fixed;z-index:10001;font-size:18px; text-align:center; line-height:44px;font-family:'Open Sans' , 'Nanum Gothic' , '나눔고딕';font-weight:600; min-width:230px;}
#m_header h1 a{color:#fff;text-align:center;vertical-align:none; }  

/*info_box*/
#m_header div.header_right{position:relative; clear:both; width:100%; text-align:center;padding:55px 0 10px 0; }
 .info_list_box{
	display:none;background-color:rgba(0,0,0,0.4);    
	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{text-align:center;width:100%; height:auto;border-bottom:3px solid transparent; background:#fff;padding:20px 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:transparent;} 
.info_list_box > ul > li > a > span{display:block; width:auto; margin-top:4px; color:#333;font-size:10px;}
.info_list_box > ul > li span.list_text{color:#666;font-size:14px; }  
.info_list_box > ul > li.user_name{width:100%; padding:10px 0 0 0;  }
.info_list_box > ul > li > i.fa-user{display:inline; background:none;font-family:'FontAwesome' , 'Nanum Gothic'; font-weight:600;font-size:15px; color:#666;cursor:default;  }   
.info_list_box > ul > li > i > span{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 > i{color:#ff6262;}
.info_list_box > ul > li.admin_on > i > span{background:#ff6262;}
.info_list_box > ul > li.admin_off > i{color:transparent;}
.info_list_box > ul > li.admin_off > i > span{background:transparent;}   

.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);}


/*Header Search*/
/*
.sb-search {position:relative;float:none; margin:0;width:100%; height:30px; }
.sb-search-input {border:1px solid #ccc !important;left:0;width:100%;height:30px;}
.sb-search-input:focus , .sb-search-input:hover{border-color:transparent !important;}
.sb-icon-search {border-radius:0% ; }
.sb-icon-search, .sb-search-submit{
	width:30px;height:30px; 
	line-height:30px;  	
}
*/
.sb-search {display:none;}
  
/* Header Search Open state */
.sb-search.sb-search-open, .no-js .sb-search {width:100%;}
.sb-search.sb-search-open .sb-icon-search, .no-js .sb-search .sb-icon-search {background:transparent;color:#fff;z-index:11;}
.sb-search.sb-search-open .sb-search-submit, .no-js .sb-search .sb-search-submit {z-index:90;}

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

.nav-container a{color:#555;} 
.nav-container > ul{padding-bottom:45px; }   
.nav-container > ul > li {border-bottom:1px solid #d1d1d1;background:#e8e8e8;margin-right:0;}  
#.nav-container > ul > li:first-child{display:none; }    
.nav-container > ul > li.is-active { background:transparent;border-bottom:2px solid transparent; }     
.nav-container > ul > li > a{padding:15px; font-size:16px}  
.nav-container > ul > li:hover > a{padding:15px;}
.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 > ul{background:#f8f8f9;} 
.nav-container > ul > li > ul > li {border-bottom:1px solid #ddd;padding:0;}  
.nav-container > ul > li > ul > li > a{padding:13px 35px;font-size:14px} 
.nav-container > ul > li > ul > li:hover > a {color:transparent;}     
.nav-container > ul > li > ul > li > ul{display:block;background:#fff;padding:0; } 
.nav-container > ul > li > ul > li > ul > li{padding-left:30px; border-bottom:1px solid #f1f1f1;}
.nav-container > ul > li > ul > li > ul > li > a{padding:12px; font-size:13px;}
.nav-container > ul > li > ul > li > ul > li > a > span:before{font-family:'FontAwesome'; content:"\f0da"; padding-right:3px;}  
}