@charset "utf-8";

/* 초기화 */
html {overflow-y:scroll; overflow-x: hidden}
body {margin:0;padding:0;font-family: 'NanumSquare','Nanum Gothic', 'Noto Sans KR','Malgun Gothic', Arial, Dotum, Gulim, Verdana, Tahoma; word-break: keep-all;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
header ul, nav ul, footer ul {margin:0;padding:0;list-style:none}
legend {position:absolute;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle;}
input, button {margin:0;padding:0;font-size:1em;}
button,input[type=submit]{cursor:pointer;}
input[type=text], input[type=password], input[type=submit], input[type=image], button {border-radius:0;font-size:1em;-webkit-appearance:none}
textarea, select {font-size:1em;font-family:dotum}
textarea {border-radius:0;-webkit-appearance:none}
p {margin:0;padding:0;word-break:break-all}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a:link, a:visited {color:#000;text-decoration:none}
ol,ul,li{list-style:none;padding:0;margin:0;}



#head_home, .menu, .allmenu, .myinfo, .toplogo, .left_icon, .inline, .search, .toplogo2, #gnb, .top_sp, .top_allicon, .brand, .search, .myinfo{
			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 */
		}



/* 메인메뉴 */

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

header.large #head_home {width:100% ; float:left;  height:230px;   position:fixed ; z-index:2 !important; border-bottom: 1px solid rgba(255, 255, 255, 0.3); background-color: rgba(255, 255, 255, 1)}
header.large #head_home .inner{margin:0px auto; position:relative;left:0px; width:100% ;  height:90px;  }
header.large #head_home .inner .toplogo_m{ display: none}
header.large #head_home .inner .toplogo{ float:left; background: url( ../images/com/logo.png); background-size: 100%; background-repeat: no-repeat; width:174px; height: 90px; background-position: center left; position: absolute;  left:50%; top: 60px; display: block; margin-left: -100px}
header.large #head_home .inner .toplogo a{width:174px; height: 90px; display: block}    
header.large #head_home .inner .toplogo2{ float:left; background: url( ../images/com/logo.png); background-size: 100%; background-repeat: no-repeat;  width:120px; height:70px; background-position: center left; position: absolute;  background-size:100%; left:5vw;  top: -80px; display: block;z-index: 9999999999999999999999 }
header.large #head_home .inner .toplogo2 a{width:120px; height:70px; display: block; position: relative;z-index: 9999999999999999999999}    

header.large #head_home .inner .brand{  position:absolute; left:3vw; top:10px; height: 50px ; line-height: 50px ; border-bottom: 1px solid #ccc; margin-bottom: -1px}	
header.large #head_home .inner .brand .tx1{ float: left; font-size: 14px; padding-right: 40px; position: relative; line-height: 50px}    
header.large #head_home .inner .brand .tx1 i{ color: #666; font-size: 14px; position: absolute; top:0px; right: 20px; line-height: 50px} 
header.large #head_home .inner .brand .tx2{ float: left; font-size: 14px;; line-height: 50px; margin-right: 20px }     
header.large #head_home .inner .brand .tx2 a{ color: #666; font-size: 14px;line-height: 49px ; box-sizing: border-box ;display: block ; border-bottom: 1px solid #ccc; font-weight: 900 }  
header.large #head_home .inner .brand .tx2 a:hover{ color: #ff3333; font-size: 14px;; line-height: 49px ; border-bottom: 1px solid #ff3333; box-sizing: border-box; font-weight: 900}   
 header.large #head_home .inner .brand .tx3{ float: left; font-size: 14px;; line-height:49px; margin-right: 20px }     
header.large #head_home .inner .brand .tx3 a{ color: #666; font-size: 14px;line-height: 49px ; box-sizing: border-box ;display: block ; border-bottom: 1px solid #ccc; font-weight: 900}  
header.large #head_home .inner .brand .tx3 a:hover{ color: #299e39; font-size: 14px;; line-height: 49px ; border-bottom: 1px solid #299e39; box-sizing: border-box; font-weight: 900}   
 

header.large #head_home .inner .myinfo{  position:absolute; right:6vw; top:30px; color: #666; font-size: 12px;  line-height: 20px;  z-index: 99}
header.large #head_home .inner .myinfo .g_menuin{ position: relative; float: left;  color: #666; font-size: 13px; margin: 0px 5px;  line-height: 20px}
header.large #head_home .inner .myinfo .g_menuin i{ float: left;  color: #666; font-size: 20px; line-height: 20px;  margin-right: 5px}
header.large #head_home .inner .myinfo .g_menuin a{float: left;  color: #666; font-size: 13px; line-height: 20px}
       
header.large  #head_home .inner .search{  position:absolute; right:4vw; top:30px; width: 300px}
    
header.large  #head_home .inner .top_allicon{  position:absolute; right:3vw; top:-50px; z-index: 99999999999999999   }
header.large  #head_home .inner .top_allicon a i{  font-size: 35px  }
    
   

 /**** 스트롤 내릴경우  ****/

header.small #head_home {width:100% ; float:left; background:#fff;   height:80px;   position:fixed ;  z-index:2; border-bottom: 1px solid #ccc; background-color: rgba(255, 255, 255, 1)}	
header.small #head_home .inner{margin:0px auto; position:relative;left:0px; width:100% ;  height:90px;  }
header.small #head_home .inner .toplogo_m{ display: none}
header.small #head_home .inner .toplogo{ float:left; background: url( ../images/com/logo.png); background-size: 100%; background-repeat: no-repeat; width:174px; height: 90px; background-position: center left; position: absolute;  left:50%; top: -100px; display: block; margin-left: -100px}
header.small #head_home .inner .toplogo2{ float:left; background: url( ../images/com/logo.png); background-size: 100%; background-repeat: no-repeat; width:120px; height:70px; background-position: center left; background-size:100%; position: absolute;  left:5vw;  top: 0px; display: block; }
header.small #head_home .inner .toplogo2 a{width:120px; height:70px; display: block; position: relative;z-index: 9999999999999999999999}    

header.small #head_home .inner .brand{  position:absolute; left:3vw; top:-50px; height: 50px ; line-height: 50px ; border-bottom: 1px solid #ccc; margin-bottom: -1px}	
header.small #head_home .inner .brand .tx1{ float: left; font-size: 14px; padding-right: 40px; position: relative; line-height: 50px}    
header.small #head_home .inner .brand .tx1 i{ color: #666; font-size: 14px; position: absolute; top:0px; right: 20px; line-height: 50px} 
header.small #head_home .inner .brand .tx2{ float: left; font-size: 14px;; line-height: 50px; margin-right: 20px }     
header.small #head_home .inner .brand .tx2 a{ color: #666; font-size: 14px;line-height: 49px ; box-sizing: border-box ;display: block ; border-bottom: 1px solid #ccc; font-weight: 900 }  
header.small #head_home .inner .brand .tx2 a:hover{ color: #ff3333; font-size: 14px;; line-height: 49px ; border-bottom: 1px solid #ff3333; box-sizing: border-box; font-weight: 900}   
header.small #head_home .inner .brand .tx3{ float: left; font-size: 14px;; line-height:49px; margin-right: 20px }     
header.small #head_home .inner .brand .tx3 a{ color: #666; font-size: 14px;line-height: 49px ; box-sizing: border-box ;display: block ; border-bottom: 1px solid #ccc; font-weight: 900}  
header.small  #head_home .inner .brand .tx3 a:hover{ color: #91a700; font-size: 14px;; line-height: 49px ; border-bottom: 1px solid #91a700; box-sizing: border-box; font-weight: 900}   
 

header.small #head_home .inner .myinfo{  position:absolute; right:6vw; top:-50px; color: #666; font-size: 12px;  line-height: 20px; z-index: 99}
header.small #head_home .inner .myinfo .g_menuin{ position: relative; float: left;  color: #666; font-size: 13px; margin: 0px 5px;  line-height: 20px}
header.small #head_home .inner .myinfo .g_menuin i{ float: left;  color: #666; font-size: 20px; line-height: 20px;  margin-right: 5px}
header.small #head_home .inner .myinfo .g_menuin a{float: left;  color: #666; font-size: 13px; line-height: 20px}
    
header.small  #head_home .inner .search{  position:absolute; right:4vw; top:30px; width: 250px ;}
header.small  #head_home .inner .top_allicon{  position:absolute; right:2vw; top:20px; display: block;  z-index: 999999999999999999999!important ; cursor:pointer; }    
header.small #head_home .inner .top_allicon a i{  font-size: 30px  }
    
    
#head_home_m .inner .left_icon{position:absolute; left:15px; top:13px; display: none}
#head_home_m .inner .right_icon{position:absolute; right:15px; top:13px; ; display: none}
	
#head_home_m .inner .right_lang{position:absolute; right:20px; top:13px; display: none}
        

}


	
/**** 테블릿 ****/
@media all and (max-width:1300px) and (min-width:1000px) {

header.large #head_home {width:100% ; float:left;  height:230px;   position:fixed ; z-index:9999; border-bottom: 1px solid rgba(255, 255, 255, 0.3); background-color: rgba(255, 255, 255, 1)}
header.large #head_home .inner{margin:0px auto; position:relative;left:0px; width:100% ;  height:90px;  }
header.large #head_home .inner .toplogo_m{ display: none}
header.large #head_home .inner .toplogo{ float:left; background: url( ../images/com/logo.png); background-size: 100%; background-repeat: no-repeat; width:174px; height: 90px; background-position: center left; position: absolute;  left:50%; top: 60px; display: block; margin-left: -100px}
header.large #head_home .inner .toplogo2{ float:left; background: url( ../images/com/logo.png); background-size: 100%; background-repeat: no-repeat;  width:120px; height:70px; background-position: center left; position: absolute;  background-size:100%; left:5vw;  top: -80px; display: block; }


header.large #head_home .inner .brand{  position:absolute; left:3vw; top:10px; height: 50px ; line-height: 50px ; border-bottom: 1px solid #ccc; margin-bottom: -1px}	
header.large #head_home .inner .brand .tx1{ float: left; font-size: 14px; padding-right: 40px; position: relative; line-height: 50px}    
header.large #head_home .inner .brand .tx1 i{ color: #666; font-size: 14px; position: absolute; top:0px; right: 20px; line-height: 50px} 
header.large #head_home .inner .brand .tx2{ float: left; font-size: 14px;; line-height: 50px; margin-right: 20px }     
header.large #head_home .inner .brand .tx2 a{ color: #666; font-size: 14px;line-height: 49px ; box-sizing: border-box ;display: block ; border-bottom: 1px solid #ccc; font-weight: 900 }  
header.large #head_home .inner .brand .tx2 a:hover{ color: #ff3333; font-size: 14px;; line-height: 49px ; border-bottom: 1px solid #ff3333; box-sizing: border-box; font-weight: 900}   
 header.large #head_home .inner .brand .tx3{ float: left; font-size: 14px;; line-height:49px; margin-right: 20px }     
header.large #head_home .inner .brand .tx3 a{ color: #666; font-size: 14px;line-height: 49px ; box-sizing: border-box ;display: block ; border-bottom: 1px solid #ccc; font-weight: 900}  
header.large #head_home .inner .brand .tx3 a:hover{ color: #91a700; font-size: 14px;; line-height: 49px ; border-bottom: 1px solid #91a700; box-sizing: border-box; font-weight: 900}   
 

header.large #head_home .inner .myinfo{  position:absolute; right:9vw; top:30px; color: #666; font-size: 12px;; line-height: 20px; ; z-index: 99}
header.large #head_home .inner .myinfo .g_menuin{ position: relative; float: left;  color: #666; font-size: 13px; margin: 0px 5px; line-height: 20px}
header.large #head_home .inner .myinfo .g_menuin i{ float: left;  color: #666; font-size: 20px; line-height: 20px; line-height: 20px}
header.large #head_home .inner .myinfo .g_menuin a{float: left;  color: #666; font-size: 13px; line-height: 15px; line-height: 20px}
         
header.large  #head_home .inner .search{  position:absolute; right:6vw; top:30px; width: 300px }
    
header.large  #head_home .inner .top_allicon{  position:absolute; right:3vw; top:-50px;   }
header.large  #head_home .inner .top_allicon a i{  font-size: 30px  }
    
   

 /**** 스트롤 내릴경우  ****/

header.small #head_home {width:100% ; float:left; background:#fff;   height:80px;   position:fixed ; z-index:9999; border-bottom: 1px solid #ccc; background-color: rgba(255, 255, 255, 1)}	
header.small #head_home .inner{margin:0px auto; position:relative;left:0px; width:100% ;  height:90px;  }
header.small #head_home .inner .toplogo_m{ display: none}
header.small #head_home .inner .toplogo{ float:left; background: url( ../images/com/logo.png); background-size: 100%; background-repeat: no-repeat; width:174px; height: 90px; background-position: center left; position: absolute;  left:50%; top: -100px; display: block; margin-left: -100px}
header.small #head_home .inner .toplogo2{ float:left; background: url( ../images/com/logo.png); background-size: 100%; background-repeat: no-repeat; width:120px; height:70px; background-position: center left; background-size:100%; position: absolute;  left:5vw;  top: 0px; display: block; }

header.small #head_home .inner .brand{   position:absolute; left:3vw; top:-50px; height: 50px ; line-height: 50px ; border-bottom: 1px solid #ccc; margin-bottom: -1px}	
header.small #head_home .inner .brand .tx1{ float: left; font-size: 14px; padding-right: 40px; position: relative; line-height: 50px}    
header.small #head_home .inner .brand .tx1 i{ color: #666; font-size: 14px; position: absolute; top:0px; right: 20px; line-height: 50px} 
header.small #head_home .inner .brand .tx2{ float: left; font-size: 14px;; line-height: 50px; margin-right: 20px }     
header.small #head_home .inner .brand .tx2 a{ color: #666; font-size: 14px;line-height: 49px ; box-sizing: border-box ;display: block ; border-bottom: 1px solid #ccc; font-weight: 900 }  
header.small #head_home .inner .brand .tx2 a:hover{ color: #ff3333; font-size: 14px;; line-height: 49px ; border-bottom: 1px solid #ff3333; box-sizing: border-box; font-weight: 900}   
header.small #head_home .inner .brand .tx3{ float: left; font-size: 14px;; line-height:49px; margin-right: 20px }     
header.small #head_home .inner .brand .tx3 a{ color: #666; font-size: 14px;line-height: 49px ; box-sizing: border-box ;display: block ; border-bottom: 1px solid #ccc; font-weight: 900}  
header.small #head_home .inner .brand .tx3 a:hover{ color: #91a700; font-size: 14px;; line-height: 49px ; border-bottom: 1px solid #91a700; box-sizing: border-box; font-weight: 900}   
 

header.small #head_home .inner .myinfo{  position:absolute; right:9vw; top:-50px; color: #666; font-size: 12px; line-height: 20px; ; z-index: 99}
header.small #head_home .inner .myinfo .g_menuin{ position: relative; float: left;  color: #666; font-size: 13px; margin: 0px 5px; line-height: 20px}
header.small #head_home .inner .myinfo .g_menuin i{ float: left;  color: #666; font-size: 20px; line-height: 20px; line-height: 20px}
header.small #head_home .inner .myinfo .g_menuin a{float: left;  color: #666; font-size: 13px; line-height: 15px; line-height: 20px}
 
header.small  #head_home .inner .search{  position:absolute; right:6vw; top:30px;  width: 300px}
header.small  #head_home .inner .top_allicon{  position:absolute; right:2vw; top:20px; width: 40px; height: 40px; display: block;  z-index: 99999999999999999999999 ; cursor:pointer;  }    
header.small #head_home .inner .top_allicon a i{  font-size: 30px  }
    
    
#head_home_m .inner .left_icon{position:absolute; left:15px; top:13px; display: none}
#head_home_m .inner .right_icon{position:absolute; right:15px; top:13px; ; display: none}
	
#head_home_m .inner .right_lang{position:absolute; right:20px; top:13px; display: none}
        

}


/**** 모바일 ****/
@media only all and (max-width:999px) {
#head_home {display:none}
#head_home .inner{margin:0px auto; position:relative;left:0px; }
#head_home_m { idth:100% ; float:left; background:#fff; height:50px;   position:fixed ; z-index:99999; border-bottom: 1px solid #ddd }
#head_home_m .inner .toplogo{ display: none}	
#head_home_m .inner .toplogo_m{ width:100% ;float:left; background: url( ../images/com/logo.png); background-size: 100%; background-repeat: no-repeat; width:100px; display: table-cell;  vertical-align: middle; height: 50px; background-position: center left; left:50%; margin-left: -50px; position: absolute }
#head_home_m .inner .toplogo_m a{width:174px; height: 90px; display: block}

	
#head_home_m .inner .menu{ display: none }
#head_home_m .inner .menu ul li{float:left; color:#fff; font-size:16px; text-align: center; margin-right: 20px }
#head_home_m .inner .menu ul li a{color:#fff;}
#head_home_m .inner .menu ul li a:hover{color:#F33;}
#head_home_m .inner .search{  position:absolute; right:50px; top:9px; width:70px}
#head_home_m .inner .search input{ width:100px; border:none; background:#181818; color:#666; font-size:12px ; padding-left:35px}
#head_home_m .inner .search i{  position:absolute; right:0px; color:#fff; font-size:18px}
#head_home_m .inner .search img{  position:absolute; left:0px; color:#fff; font-size:18px; top:-5px}
	
#head_home_m .inner .myinfo{ display: none}
#head_home_m .inner .myinfo .name{ display: none}
#head_home_m .inner .myinfo .name .photo{ float: left; width:40px; height: 40px;  border-radius: 200px; border: 1px solid #fff;overflow:hidden; margin-right: 10px }
#head_home_m .inner .myinfo .name .photo img{ float: left; width:100%; }
#head_home_m .inner .myinfo .name .name_tx{ float: left; color: #fff; font-size: 18px; margin-top: 7px }

#head_home_m .inner .myinfo a.btn_manager{ display: none}
#head_home_m .inner .myinfo a.btn_manager img{ width:80px; }	

#head_home_m .inner .myinfo .icon1{float: left; margin-right: 15px}
#head_home_m .inner .myinfo .icon2{float: left;}
    
#head_home_m .inner .left_icon{position:absolute; left:15px; top:13px;}
#head_home_m .inner .left_icon i{color: #333; font-size: 25px}
#head_home_m .inner .right_icon{position:absolute; right:15px; top:13px; display: none}
#head_home_m .inner .right_icon i{color: #333; font-size: 25px}
	
#head_home_m .inner .right_lang{position:absolute; right:15px; top:18px; font-size: 13px}
#head_home_m .inner .right_lang i{color: #333; font-size: 25px}



#head_home .inner .allmenu{ display: none }
header.large #head_home_main {width:100% ; float:left; background:rgba(0, 0, 0, 0.0); height:137px;   position:fixed ; z-index:9999}

header.small #head_home_main {width:100% ; float:left; background:#ff7065; height:137px;   position:fixed ; z-index:9999}

}



/*---------------------- 본문영역 ----------------------*/
/**** pc ****/
@media only all and (min-width:1301px) {
#container{ width: 100%; float: left; box-sizing: border-box; padding: 0px; margin: 0px; min-height: calc(100vh - 480px);  }
}
/**** 테블릿 ****/
@media all and (max-width:1300px) and (min-width:769px) {
#container{ width: 100%; float: left ;box-sizing: border-box; padding: 0px; }
}
/**** 모바일 ****/
@media only all and (max-width:768px) {
#container{ width: 100%; float: left; box-sizing: border-box; padding: 0px;  margin: 0px;   }
}




/*---------------------- 3d메뉴: tab ----------------------*/
/**** pc ****/
@media only all and (min-width:1301px) {
.quick_info{ width: 100%; float: left;  background-color: #ff6000; height: 180px;  position: relative }	
.quick_info .info_my{  width: 100%; float: left; text-align: center; overflow: hidden;float: left; height: 80px;}	
.quick_info .info_my .icon{ width:50px; height:50px;  overflow:hidden; display: inline-block; vertical-align: middle; margin-bottom: 5px;  position: absolute; left: 15px; top: 15px; z-index: 9999; background-color: #333; border-radius: 60px;}
.quick_info .info_my .icon i{ color: #FF6700 ; font-size: 30px; line-height: 50px}
.quick_info .info_my .name{ font-size: 14px; color: #ffc27a; margin-bottom: 10px;  position: absolute; left:80px; top:22px}
.quick_info .info_my .name em{ font-size: 13px; color: #fff ; }
.quick_info .info_my .info_btn{  width: 100%; float: left;  padding:15px 3vw 0vw 0vw; position: absolute;  left:80px; top: 18px}
.quick_info .info_my .info_btn  a{  color: #fff; font-size: 13px; margin-right: 15px; float: left; border: none }
	
.quick_info .gogolink{ width: 100%; float: left; background: #000;  position: relative }				
.quick_info .gogolink a{ width: 100%; float: left; box-sizing: 	border-box; color: #fff;  padding-left: 80px; ;  font-size: 13px; height: 50px; line-height: 50px; padding: 0px 0px 0px 80px; font-weight: 200}			
.quick_info .gogolink i{ position: absolute; left:25px; top: 13px ; color: #f60; font-size: 25px; line-height: 25px }		
	
.quick_info .close{ position: absolute; top: 5px ; right: 5px;  }	
.quick_info .close i{ color: #fff; font-size:25px }	
	
.quick_kko{ width: 100%; float: left; background-color: #f4f4f4; padding: 20px 15px;  }	
.quick_kko img{ width: 100%;   }		
}
/**** 테블릿 ****/
@media all and (max-width:1300px) and (min-width:1000px) {
.quick_info{ width: 100%; float: left;  background-color: #ff6000; height: 180px;  position: relative }	
.quick_info .info_my{  width: 100%; float: left; text-align: center; overflow: hidden;float: left; height: 80px;}	
.quick_info .info_my .icon{ width:50px; height:50px;  overflow:hidden; display: inline-block; vertical-align: middle; margin-bottom: 5px;  position: absolute; left: 15px; top: 15px; z-index: 9999; background-color: #333; border-radius: 60px;}
.quick_info .info_my .icon i{ color: #FF6700 ; font-size: 30px; line-height: 50px}
.quick_info .info_my .name{ font-size: 14px; color: #ffc27a; margin-bottom: 10px;  position: absolute; left:80px; top:22px}
.quick_info .info_my .name em{ font-size: 13px; color: #fff ; }
.quick_info .info_my .info_btn{  width: 100%; float: left;  padding:15px 3vw 0vw 0vw; position: absolute;  left:80px; top: 18px}
.quick_info .info_my .info_btn  a{  color: #fff; font-size: 13px; margin-right: 15px; float: left; border: none }
	
.quick_info .gogolink{ width: 100%; float: left; background: #000;  position: relative }				
.quick_info .gogolink a{ width: 100%; float: left; box-sizing: 	border-box; color: #fff;  padding-left: 80px; ;  font-size: 13px; height: 50px; line-height: 50px; padding: 0px 0px 0px 80px; font-weight: 200}			
.quick_info .gogolink i{ position: absolute; left:25px; top: 13px ; color: #f60; font-size: 25px; line-height: 25px }		
	
.quick_info .close{ position: absolute; top: 5px ; right: 5px;  }	
.quick_info .close i{ color: #fff; font-size:25px }	
	
.quick_kko{ width: 100%; float: left; background-color: #f4f4f4; padding: 20px 15px;  }	
.quick_kko img{ width: 100%;   }	
}
/**** 모바일 ****/
@media only all and (max-width:999px) {
.quick_info{ width: 100%; float: left;  background-color: #ff6000; height: 100px;  position: relative }	
.quick_info .info_my{  width: 100%; float: left; text-align: center; overflow: hidden;float: left; height: 80px;}	
.quick_info .info_my .icon{ width:50px; height:50px;  overflow:hidden; display: inline-block; vertical-align: middle; margin-bottom: 5px;  position: absolute; left: 15px; top: 15px; z-index: 9999; background-color: #333; border-radius: 60px;}
.quick_info .info_my .icon i{ color: #FF6700 ; font-size: 30px; line-height: 50px}
.quick_info .info_my .name{ font-size: 14px; color: #ffc27a; margin-bottom: 10px;  position: absolute; left:80px; top:0px; display:none;}
.quick_info .info_my .name em{ font-size: 13px; color: #fff ; }
.quick_info .info_my .info_btn{  width: 100%; float: left;  padding:15px 3vw 0vw 0vw; position: absolute;  left:80px; top: 18px}
.quick_info .info_my .info_btn  a{  color: #fff; font-size: 13px; margin-right: 15px; float: left; border: none }
	
.quick_info .gogolink{ width: 100%; float: left; background: #000;  position: relative }				
.quick_info .gogolink a{ width: 100%; float: left; box-sizing: 	border-box; color: #fff;  padding-left: 80px; ;  font-size: 13px; height: 50px; line-height: 50px; padding: 0px 0px 0px 80px; font-weight: 200}			
.quick_info .gogolink i{ position: absolute; left:25px; top: 13px ; color: #f60; font-size: 25px; line-height: 25px }		
	
.quick_info .close{ position: absolute; top: 5px ; right: 5px;  }	
.quick_info .close i{ color: #fff; font-size:25px }	
	
.quick_kko{ width: 100%; float: left; background-color: #f4f4f4; padding: 20px 15px;  }	
.quick_kko img{ width: 100%;   }	
}


/*---------------------- 3d메뉴: tab ----------------------*/
/**** pc ****/
@media only all and (min-width:1301px) {
.quick_search{ width: 100%; float: left; position: relative; padding: 0px 0px ;box-sizing: border-box; margin-top: 10px; z-index: 999999999999999 ;}	
.quick_search input.inp{ width: 100%; float: left; background-color: #444!important; border: none; height: 40px !important; padding: 0px 20px !important; box-sizing: border-box; line-height: 40px; border: none!important; position: relative ; color: #fff; font-size: 12px }		
.quick_search .icon{ position: absolute ; right: 5px; top: 10px; width: 30px; height:40px}
.quick_search .icon i{color: #fff; font-size: 25px}	
	
.quick_search input.bt{ position: absolute ; right: 5px; top: 5px; width: 35px; height:40px; background: url(../images/com/top_icon1.png); background-size:35px ;  background-repeat: no-repeat;  z-index: 99999999}	

}
/**** 테블릿 ****/
@media all and (max-width:1300px) and (min-width:769px) {
.quick_search{ width: 100%; float: left; position: relative; padding: 0px 0px ;box-sizing: border-box; margin-top: 10px; z-index: 999999999999999 ;}	
.quick_search input.inp{ width: 100%; float: left; background-color: #444!important; border: none; height: 40px !important; padding: 0px 20px !important; box-sizing: border-box; line-height: 40px; border: none!important; position: relative ; color: #fff; font-size: 12px }		
.quick_search .icon{ position: absolute ; right: 5px; top: 10px; width: 30px; height:40px}
.quick_search .icon i{color: #fff; font-size: 25px}	
	
.quick_search input.bt{ position: absolute ; right: 5px; top: 5px; width: 35px; height:40px; background: url(../images/com/top_icon1.png); background-size:35px ;  background-repeat: no-repeat;  z-index: 99999999}	

}
/**** 모바일 ****/
@media only all and (max-width:768px) {
.quick_search{ width: 100%; float: left; position: relative; padding: 0px 0px ;box-sizing: border-box; margin-top: 0px; z-index: 999999999999999 ;}	
.quick_search input.inp{ width: 100%; float: left; background-color: #444!important; border: none; height: 40px !important; padding: 0px 20px !important; box-sizing: border-box; line-height: 40px; border: none!important; position: relative ; color: #fff; font-size: 12px }		
.quick_search .icon{ position: absolute ; right: 5px; top: 10px; width: 30px; height:40px}
.quick_search .icon i{color: #fff; font-size: 25px}	
.quick_search input.bt{ position: absolute ; right: 5px; top: 5px; width: 35px; height:40px; background: url(../images/com/top_icon1.png); background-size:35px ;  background-repeat: no-repeat;  z-index: 99999999}	

}

/*---------------------- 본문영역 ----------------------*/
/**** pc ****/
@media only all and (min-width:1301px) {
.subtop{ width: 100%; float: left; height: 230px; margin-top: 0px; overflow: hidden; }
.inimg {
    width: 100%;
   height:300px;
    position: relative;
 -webkit-animation-name: example; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
    -webkit-animation-iteration-count: 3; /* Safari 4.0 - 8.0 */
    animation-name: example;
    animation-duration: 4s;
    animation-iteration-count: 1;  position: relative; z-index:-2}

.subtop_img1{ background: url(../images/com/sub01.jpg); background-position: center top;}
 .subtop_img2{ background: url(../images/com/sub02.jpg); background-position: center top;}
 .subtop_img3{ background: url(../images/com/sub03.jpg); background-position: center top;}
 .subtop_img4{ background: url(../images/com/sub04.jpg); background-position: center top;}
 .subtop_img5{ background: url(../images/com/sub05.jpg); background-position: center top;}
 .subtop_img6{ background: url(../images/com/sub06.jpg); background-position: center top;}
 .subtop_img7{ background: url(../images/com/sub07.jpg); background-position: center top;}
 
    
.subtop .inner2{  position: relative; z-index: -1 }    
    
}

    
/* Safari 4.0 - 8.0 */
@-webkit-keyframes example {
     from {left:0px; top:-60px;}
    to {left:0px; top:0px;}
   
}

/* Standard syntax */
@keyframes example {
    from {left:0px; top:-60px;}
    to {left:0px; top:0px;}
}    
    
/**** 테블릿 ****/
@media all and (max-width:1300px) and (min-width:768px) {
.subtop{ width: 100%; float: left; height: 150px; margin-top: 0px; overflow: hidden; }
.inimg {
    width: 100%;
   height:300px;
    position: relative;
 -webkit-animation-name: example; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
    -webkit-animation-iteration-count: 3; /* Safari 4.0 - 8.0 */
    animation-name: example;
    animation-duration: 4s;
    animation-iteration-count: 1;  position: relative; z-index:-2}

.subtop_img1{ background: url(../images/com/sub01.jpg); background-position: center top;}
 .subtop_img2{ background: url(../images/com/sub02.jpg); background-position: center top;}
 .subtop_img3{ background: url(../images/com/sub03.jpg); background-position: center top;}
 .subtop_img4{ background: url(../images/com/sub04.jpg); background-position: center top;}
 .subtop_img5{ background: url(../images/com/sub05.jpg); background-position: center top;}
 .subtop_img6{ background: url(../images/com/sub06.jpg); background-position: center top;}
 .subtop_img7{ background: url(../images/com/sub07.jpg); background-position: center top;}
 
    
.subtop .inner2{  position: relative; z-index: -1 }    
	
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
.subtop{ width: 100%; float: left; height:100px; margin-top: 0px; overflow: hidden; }
.inimg {
    width: 100%;
   height:300px;
    position: relative;
 -webkit-animation-name: example; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
    -webkit-animation-iteration-count: 3; /* Safari 4.0 - 8.0 */
    animation-name: example;
    animation-duration: 4s;
    animation-iteration-count: 1;  position: relative; z-index: -1}
.subtop_img1{ background: url(../images/com/sub01.jpg); background-position: center top; }
 .subtop_img2{ background: url(../images/com/sub01.jpg); background-position: center top;}
 .subtop_img3{ background: url(../images/com/sub01.jpg); background-position: center top;}
 .subtop_img4{ background: url(../images/com/sub01.jpg); background-position: center top;}
 .subtop_img5{ background: url(../images/com/sub01.jpg); background-position: center top;}
 .subtop_img6{ background: url(../images/com/sub01.jpg); background-position: center top;}
 .subtop_img7{ background: url(../images/com/sub01.jpg); background-position: center top;}
 
    
.subtop .inner2{  position: relative; z-index: 1 }    
}



/** 상단 이미지 영역 **/
/**** pc ****/
@media only all and (min-width:1025px) {


.b_title{ width: 40%; float: left; padding-top:50px; display: none;}
.b_title .tx1{ width: 100%; float: left; font-size: 36px; color: #fff; font-weight: 700; margin-bottom: 5px;   }
.b_title .route_t{ width: 100%; float: left; font-size: 16px;  color: #fff; font-weight: 300  }

}
/**** 테블릿 ****/
@media all and (max-width:1024px) and (min-width:768px) {

.b_title{ width: 40%; float: left; padding-top:0px; display: none; }
.b_title .tx1{ width: 100%; float: left; font-size: 36px; color: #fff; font-weight: 700; margin-bottom: 5px;   }
.b_title .route_t{ width: 100%; float: left; font-size: 16px;  color: #fff; font-weight: 300 ; display: none }

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

.b_title{ width: 100%; float: left; padding-top: 8.5vw; z-index: 1 !important;  }
.b_title .tx1{ width: 100%; float: left; font-size: 30px; color: #fff; font-weight: 500; text-align: center  }
.b_title .route_t{ width: 100%; float: left; font-size: 12px;  color: #fff; font-weight: 300 ;text-align: center ; display: none }

}

/*---------------------- 본문영역 ----------------------*/
/**** pc ****/
@media only all and (min-width:1001px) {
.pc_close{  position: absolute ; top: -5px; right: 20px; color: #000; cursor:pointer; border-bottom: none!important}
.pc_close a{ border-bottom: none!important}	
.pc_close i{ color: #000; font-size: 40px; border-bottom: none}	

.pc_open{  position: fixed; top:50%; right: 20px; color: #000; width: 50px; height: 50px; background-color: #333; text-align: center; border-radius: 100px; z-index: 999999; cursor:pointer; }
.pc_open i{ color: #fff; font-size: 30px; line-height: 50px;}	
	
.ri_box{ width: 100%; float: left; box-sizing: border-box; padding:10px 20px;  }
.ri_box .title{ width: 100%; float: left; font-size: 20px; color: #333; padding-bottom: 10px;  }
.ri_box .title .reset{float:right; font-size: 12px; color: #333; padding: 7px 10px; border: 1px solid #ccc; border-radius: 50px; background-color: #fff}

.ri_box .ri_tab{ width: 100%; float: left; margin-bottom: 10px }
.ri_box .ri_tab ul li{ width: calc(50% - 1px); float: left;  font-size: 12px; color: #999; margin-left: -1px; position: relative; }
.ri_box .ri_tab ul li a{ width: 100%; float: left; border: 1px solid #ccc; text-align: center; font-size: 12px; color: #999; margin-left: -1px; position: relative; padding: 10px 0px}
.ri_box .ri_tab ul li.on{ width:  calc(50% - 1px);  float: left; text-align: center; font-size: 12px; color: #333; margin-left: -1px; position: relative;z-index: 99; background-color: #fff }
.ri_box .ri_tab ul li.on a{  width: 100%; float: left; border: 1px solid #333; text-align: center; font-size: 12px; color: #333; margin-left: -1px; position: relative; padding: 10px 0px; z-index: 99; background-color: #fff }
.ri_box .ri_tb{ width: 100%; float: left; }
}
/**** 테블릿 ****/

/**** 모바일 ****/
@media only all and (max-width:1000px) {
.pc_close{  position: absolute ; top: -5px; right: 20px; color: #000; cursor:pointer;}
.pc_close i{ color: #000; font-size: 40px}	
	
.mobile_close{  position: absolute ; top: -5px; right: 10px; color: #000}
.mobile_close i{ color: #000; font-size: 30px}

.pc_open{  display: none; position: fixed; top:50%; right: 20px; color: #000; width: 50px; height: 50px; background-color: #333; text-align: center; border-radius: 100px; z-index: 999999; cursor:pointer; }
.pc_open i{ color: #000; font-size: 30px}	
	
.ri_box{ width: 100%; float: left; box-sizing: border-box; padding:50px 20px; box-sizing: border-box  }
.ri_box .title{ width: 100%; float: left; font-size: 20px; color: #333; padding-bottom: 10px;  }
.ri_box .title .reset{float:right; font-size: 12px; color: #333; padding: 7px 10px; border: 1px solid #ccc; border-radius: 50px; ; background-color: #fff}

.ri_box .ri_tab{ width: 100%; float: left; margin-bottom: 10px }
.ri_box .ri_tab ul li{ width: calc(50% - 1px); float: left;  font-size: 12px; color: #999; margin-left: -1px; position: relative; }
.ri_box .ri_tab ul li a{ width: 100%; float: left; border: 1px solid #ccc; text-align: center; font-size: 12px; color: #999; margin-left: -1px; position: relative; padding: 10px 0px}
.ri_box .ri_tab ul li.on{ width:  calc(50% - 1px);  float: left; text-align: center; font-size: 12px; color: #333; margin-left: -1px; position: relative;z-index: 99; background-color: #fff }
.ri_box .ri_tab ul li.on a{  width: 100%; float: left; border: 1px solid #333; text-align: center; font-size: 12px; color: #333; margin-left: -1px; position: relative; padding: 10px 0px; z-index: 99; background-color: #fff }
.ri_box .ri_tb{ width: 100%; float: left; }
}



/**** 퀵메뉴 아코디언 ****/
.sidebar-toggle {
  margin-left: -240px;
}
.sidebar {
  width: 250px;
 background: #eee;
  position: absolute;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  z-index: 100; top: 125px
}
.sidebar #leftside-navigation ul,
.sidebar #leftside-navigation ul ul {
  margin: -2px 0 0;
  padding: 0;
}
.sidebar #leftside-navigation ul li {
  list-style-type: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.sidebar #leftside-navigation ul li.active > a {
  color: #333; 
}
.sidebar #leftside-navigation ul li.active ul {
  display: block; 
}
.sidebar #leftside-navigation ul li a {
  color: #333;
  text-decoration: none;
  display: block;
  padding: 15px 0 15px 20px;
  font-size: 14px;
  outline: 0;
  -webkit-transition: all 200ms ease-in;
  -moz-transition: all 200ms ease-in;
  -o-transition: all 200ms ease-in;
  -ms-transition: all 200ms ease-in;
  transition: all 200ms ease-in;
}
.sidebar #leftside-navigation ul li a:hover {
  color: #333; 
}
.sidebar #leftside-navigation ul li a span {
  display: inline-block;
}
.sidebar #leftside-navigation ul li a i {
  width: 20px;
}
.sidebar #leftside-navigation ul li a i .fa-angle-left,
.sidebar #leftside-navigation ul li a i .fa-angle-right {
  padding-top: 3px;
}
.sidebar #leftside-navigation ul ul {
  display: none;
}
.sidebar #leftside-navigation ul ul li {
  background: #666;
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
  border-bottom: none;
}
.sidebar #leftside-navigation ul ul li a {
  font-size: 12px;
  padding-top: 13px;
  padding-bottom: 13px;
   color: #fff;
}


/**** pc ****/
@media only all and (min-width:1201px) {
footer{ width: 100%; float: left; background-color: #2c2c2c; height: 200px; position: relative; z-index: 9}
footer .f_pc{ max-width: 1220px; margin: 0px auto; padding: 0px 0px; box-sizing: border-box}    
footer .f_pc .fl_cont{ width: calc(100% - 400px) ; float: left; padding: 30px 0px}
footer .f_pc .fl_cont .link_box{ float: left; padding: 5px 0px; border-bottom: 1px solid #ccc; color: #fff; margin-bottom: 20px}
footer .f_pc .fl_cont .link_box a{  margin-right: 5px; color: #fff; font-size: 13px}
footer .f_pc .fl_cont .copy_box{ float: left;width:100% ; color: #fff; font-size: 14px; line-height: 18px; margin-top:45px;}

footer .f_pc .fr_cont{ width: 400px; float: left; padding: 30px 0px; position: relative}
footer .f_pc .fr_cont .banner_img{ position: absolute; right: 200px ; top: 30px; width: 200px}
footer .f_pc .fr_cont .familysite{ width: 180px; float: right; }
footer .f_pc .fr_cont .familysite select{ float:right; background: url(../images/com/select_icon2.png); background-repeat: no-repeat; background-position: 95% center;  background-color: #000000; color: #fff; padding:0px 10px ; box-sizing: border-box; height: 40px; line-height: 40px;  border: none ; width: 180px; font-size: 12px }

footer .f_pc .fr_cont .sns{ position: absolute; right: 0px ; top: 90px; transform: translateY(-40%); display: flex; align-items: center; gap: 20px; }
footer .f_pc .fr_cont .sns>a {margin-top: 60px;}
footer .f_pc .fr_cont .sns a{float: left;  width: 50px; height: 50px; text-align: center; line-height: 50px; background-color: #000000; border-radius: 50px;  margin-left: 10px}
footer .f_pc .fr_cont .sns .btn-container {display: flex; flex-direction: column; gap: 10px; }


footer .m_familysite{  display: none}
    
 footer .f_m{display: none}     
}
/**** pc ****/
@media all and (max-width:1200px) and (min-width:769px) {
footer{ width: 100%; float: left; background-color: #2c2c2c; height: 200px; position: relative; z-index: 9}
footer .f_pc{ max-width: 1220px; margin: 0px auto; padding: 0px 20px; box-sizing: border-box}    
footer .f_pc .fl_cont{ width: calc(100% - 400px) ; float: left; padding: 30px 0px}
footer .f_pc .fl_cont .link_box{ float: left; padding: 5px 0px; border-bottom: 1px solid #ccc; color: #fff; margin-bottom: 20px}
footer .f_pc .fl_cont .link_box a{  margin-right: 5px; color: #fff; font-size: 13px}
footer .f_pc .fl_cont .copy_box{ float: left;width:100% ; color: #fff; font-size: 12px; line-height: 18px;  margin-top:15px;}

footer .f_pc .fr_cont{ width: 400px; float: left; padding: 30px 0px; position: relative}
footer .f_pc .fr_cont .banner_img{ position: absolute; left: 0px ; top: 30px}
footer .f_pc .fr_cont .familysite{ width: 180px; float: right; }
footer .f_pc .fr_cont .familysite select{ float:right; background: url(../images/com/select_icon2.png); background-repeat: no-repeat; background-position: 95% center;  background-color: #000000; color: #fff; padding:0px 10px ; box-sizing: border-box; height: 40px; line-height: 40px;  border: none ; width: 180px; font-size: 12px }
    
footer .f_pc .fr_cont .familysite select a {width: 100%; height: 100%; display: block    }
footer .f_pc .fr_cont .sns{ position: absolute; right: 0px ; top: 90px}
footer .f_pc .fr_cont .sns a{float: left;  width: 50px; height: 50px; text-align: center; line-height: 50px; background-color: #000000; border-radius: 50px;  margin-left: 10px}


footer .m_familysite{  display: none}ter
    
 footer .f_m{display: none}     
}
/**** 모바일 ****/
@media only all and (max-width:768px) {
footer .f_pc {display: none}
footer{position: relative; z-index: 9;}
footer .f_m{ display: block  }    
    
footer .f_m .m_familysite{ width:100% ; float: left;  padding-top:20px;}
footer .f_m  .m_familysite select{ float:right; background: url(../images/com/select_icon2.png); background-repeat: no-repeat; background-position: 95% center;  background-color: #000000; color: #fff; padding:0vw 5vw 0vw 5vw; box-sizing: border-box; height: 50px; line-height: 50px;  border: none ; width: 100%; font-size: 12px }

footer .f_m  .m_copy_box{ width:100% ; float: left; background-color: #2c2c2c; position: relative ; padding:4vw 5vw 2vw 5vw; box-sizing: border-box;  margin-top:0px;}
    
footer .f_m  .m_copy_box .tx1{ width:100% ; float: left;  color: #ccc; font-size: 12px; margin-bottom: 20px }    
footer .f_m  .m_copy_box .tx2{ width:100% ; float: left;  color: #ccc; font-size: 11px; margin-bottom: 20px }  
footer .f_m  .m_copy_box .tx2 em{ width:100% ; float: left;  color: #fff; font-size: 20px;  font-weight: 700 ; line-height: 30px }         
footer .f_m  .m_copy_box .tx3{ width:100% ; float: left;  color: #ccc; font-size: 11px; margin-bottom: 0px }  
footer .f_m  .m_copy_box .tx3 em{ width:100% ; float: left;  color: #fff; font-size: 16px;  ; line-height: 30px   } 
    
footer  .f_m  .m_copy_box .sns{  position: absolute; bottom: 60px; right: 20px}     
footer .f_m  .m_copy_box .sns a{float: left;  width: 40px; height:40px; text-align: center; line-height: 40px; background-color: #000000; border-radius: 50px;  margin-left: 5px} 
footer  .f_m  .m_copy_box .banner_logo{  width:100% ; float: left; margin-top: 10px}      
footer  .f_m  .m_copy_box .banner_logo img{ width:100% ;}    
	
footer  .f_m .m_copy_box2{ width:100% ; float: left; background-color: #111;padding:0vw 5vw 2vw; box-sizing: border-box; position: relative; padding-top:3vw}         
footer  .f_m .m_copy_box2 .logo{ width:100% ; float: left; }     
footer .f_m  .m_copy_box2 .logo img{ width:40% ; }        
footer  .f_m .m_copy_box2 .tx1{ width:100% ; float: left; color: #ccc; font-size: 11px; line-height: 14px }       
  
}

/**** pc ****/
@media only all and (min-width:1301px) {
.route{width: 100%; float: left;  position: relative; z-index: 1 }
.route .ininbox{margin: 0px auto ; max-width: 1250px; }
.route .ininbox .route_inbox{width: 100%; float: left; background-color: #fff; height: 60px; box-sizing: border-box; margin-top: -60px;position: relative;  position: relative; z-index:0  }
.route .ininbox .route_inbox .route_menu{ width: 600px;  line-height: 60px;background-color: #333 !important;  }

#navigation { width:100%!important; float: left; position: relative}
#navigation .home{ width:60px!important; float: left; height: 60px; text-align: center; line-height: 60px; background: url(../images/com/ar_line.png); background-position: right 15px; background-repeat: no-repeat  }

#navigation ul{  float: left;}
#navigation ul li{ float: left !important; text-align: left; width: 220px}
.route .ininbox .route_inbox  .sns_link{ width:60px!important; float: left; position: absolute;top:10px; right: 10px; height: 60px; text-align: center; line-height: 60px; cursor:pointer;}
.route .ininbox .route_inbox .sns_link i{  font-size: 30px; color: #666}
.route .ininbox .route_inbox  .sns_view{  float: left; width: 100px !important; height: 60px; position: absolute;top:13px; right: 50px; height: 60px; text-align: center; line-height: 60px}
.route .ininbox .route_inbox  .sns_view a{ float: left; width: 40px; height: 40px; border-radius: 50px; background-color: #333; text-align: center; line-height: 40px; display: block; margin-left: 5px }

}
/**** 테블릿 ****/
@media all and (max-width:1300px) and (min-width:768px) {
.route{width: 100%; float: left;  position: relative; z-index: 99991 }
.route .ininbox{margin: 0px auto ; max-width: 1200px; }
.route .ininbox .route_inbox{width: 100%; float: left; background-color: #fff; height: 60px; box-sizing: border-box; margin-top: -60px;position: relative; border-bottom: 1px solid #ccc}
.route .ininbox .route_inbox .route_menu{ width: 600px;  line-height: 60px;background-color: #333 !important;  }

#navigation { width:100%!important; float: left; position: relative}
#navigation .home{ width:60px!important; float: left; height: 60px; text-align: center; line-height: 60px; background: url(../images/com/ar_line.png); background-position: right 15px; background-repeat: no-repeat  }

#navigation ul{  float: left;}
#navigation ul li{ float: left !important; text-align: left; width: 220px}
.route .ininbox .route_inbox  .sns_link{ width:60px!important; float: left; position: absolute;top:10px; right: 10px; height: 60px; text-align: center; line-height: 60px; cursor:pointer;}
.route .ininbox .route_inbox .sns_link i{  font-size: 30px; color: #666}
.route .ininbox .route_inbox  .sns_view{  float: left; width: 220px !important; height: 60px; position: absolute;top:13px; right: 50px; height: 60px; text-align: center; line-height: 60px}
.route .ininbox .route_inbox  .sns_view a{ float: left; width: 40px; height: 40px; border-radius: 50px; background-color: #999; text-align: center; line-height: 40px; display: block; margin-left: 5px }

}
/**** 모바일 ****/
@media only all and (max-width:767px) {
    .route{width: 100%; float: left;  position: relative; z-index: 999 ; display: none}
.route .ininbox{margin: 0px auto ; max-width: 1200px; }
.route .ininbox .route_inbox{width: 100%; float: left; background-color: #fff; height: 60px; box-sizing: border-box; margin-top: -60px;position: relative  }
.route .ininbox .route_inbox .route_menu{ width: 600px;  line-height: 60px;background-color: #333 !important;  }

#navigation { width:100%!important; float: left; position: relative}
#navigation .home{ width:60px!important; float: left; height: 60px; text-align: center; line-height: 60px; background: url(../images/com/ar_line.png); background-position: right 15px; background-repeat: no-repeat  }

#navigation ul{  float: left;}
#navigation ul li{ float: left !important; text-align: left; width: 220px}
.route .ininbox .route_inbox  .sns_link{ width:60px!important; float: left; position: absolute;top:10px; right: 10px; height: 60px; text-align: center; line-height: 60px; cursor:pointer;}
.route .ininbox .route_inbox .sns_link i{  font-size: 30px; color: #666}
.route .ininbox .route_inbox  .sns_view{  float: left; width: 150px !important; height: 60px; position: absolute;top:13px; right: 50px; height: 60px; text-align: center; line-height: 60px}
.route .ininbox .route_inbox  .sns_view a{ float: left; width: 40px; height: 40px; border-radius: 50px; background-color: #999; text-align: center; line-height: 40px; display: block; margin-left: 5px }

}


/**** pc ****/
@media only all and (min-width:1001px) {
    a.no_link_pc{ display: block }
    a.no_link_m{ display: none !important}
    .sub-menu{ }
}
/**** 모바일 ****/
@media only all and (max-width:1000px) {
    a.no_link_pc{display: none !important}
    a.no_link_m{ display: block }
    .sub-menu{  background: url(../images/com/ar_down.png); background-position: 95% 15px; background-repeat: no-repeat}
}

	

/**** pc ****/
@media only all and (min-width:1301px) {
	.right_quick{ width: 100%; float: left; padding: 20px;  box-sizing: border-box
}
	.right_quick .langmenu{ width: 100%; float: left; border-bottom: 1px solid #ccc}
	.right_quick .langmenu>a{ float: left; margin-right: 10px; border-bottom: none !important; color: #666}
	.right_quick .langmenu>a:hover{ color: #333; float: left; margin-right: 10px; border-bottom: none !important;}
	.right_quick .brandmenu{ width: 100%; float: left; border-bottom: 1px solid #ccc ; padding: 15px 0px}
.right_quick .brandmenu .title{ width: 100%; float: left;  font-size: 15px !important; color: #000; font-family: 'Noto Sans KR', sans-serif; ; font-weight: 700; height: 18px; line-height: 18px}
	.right_quick .brandmenu .smenu{ width: 100%; float: left;  }
.right_quick .brandmenu .smenu a.link1{ width: 100%; float: left !important; color: #666; font-size: 14px ; border-bottom: none !important; line-height: 18px !important; height: 25px !important}
.right_quick .brandmenu .smenu a.link1:hover{ width: 100%; float: left; color: #ff3333; }	
.right_quick .brandmenu .smenu a.link2{ width: 100%; float: left; color: #666; font-size: 14px; border-bottom: none !important; line-height: 18px !important; height: 25px !important}	
.right_quick .brandmenu .smenu a.link2:hover{ width: 100%; float: left; color: #299e39; }	
.right_quick .qdmenu{ width: 100%; float: left; }	
.right_quick .qdmenu a{ width: 100%; float: left;  position: relative !important; padding-left: 30px; font-size: 16px; color: #333}		
.right_quick .qdmenu a:hover{ color: #000}			
.right_quick  .qdmenu i{ position: absolute !important; left: 0px; top: 15px; color: #666; font-size: 22px}	
}
/**** 테블릿 ****/
@media all and (max-width:1300px) and (min-width:769px) {

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


}