@charset "utf-8";


#wrap{
	position: relative;
	width:100%;
	height:100%;
	margin:0 auto;
	padding:0;
	 
	min-width:320px;
	
	 
	}
 
.wrap{
	margin:0 auto;
	padding:0;
	 
	position:relative;
	max-width:750px;
	}

	
.dim{
	display:hidden;
	}
/* dHead */
#dHead {
	position:absolute ;
	z-index:100000;
	width:100%;
	margin:0 auto;
	top:0px;
	left:0; 
 	transition: top 0.3s;
	
	
	}

 #dHeadArea {
	position:relative;
	width:100%;
	max-width:750px;
	margin:0 auto;
	top:0px;
	padding-top:0px;
	transition: 0.4s; 
	
	height:0px !important; 
	border-bottom:0px solid #ccc;
	
 

} 
 
 .bodyfixed #dHead {
	position:fixed;
	z-index:9999999;
	background:#fff;
	transition: 0.4s; 
	height:70px !important; 
	 
	 

} 
   
 
#LogoMenu{
 	width:100%; 
	margin:0 auto;
	position:relative;
	height:70px;
	top:0;
	padding:0;
	overflow:hidden;
	
	 
}

h1.logo {
	position:absolute;
	padding:0px;
	left:10px;
	 
	width:180px;
	top:18px;
	z-index:2;
	text-indent:-9999px;
	background:url(/mobile/image/logo.png) no-repeat center 0;
	background-size:100%;
	 
}


 

h1.logo a{
	display:block;
}
 body.bodyfixed h1.logo {
	background:url(/mobile/image/logo_on.png) no-repeat center 0;
	background-size:100%;
 }
 
	


	 .btn_nav	{
		display:block;
		outline: none;
		position:absolute;
		z-index:99999999999;
		right:0px;
		top:0px;
		padding:20px;
		height:70px;
		background:none;
		
	 }

 
	
	
	.on .btn_nav	{
		display:block;
		display: inline-block;
		cursor: pointer;
		position:fixed;
		
	} 

	.bar1, .bar2, .bar3 {
		  width: 25px;
		  height: 4px;
		  background-color: #fff;
		  margin: 4px 0;
		  transition: 0.4s;
		}


body.bodyfixed .bar1, body.bodyfixed .bar2, body.bodyfixed .bar3 {
		  
		  background-color: #2c57a7;
		   
		}


		/* Rotate first bar */
		.change .bar1 {
		  -webkit-transform: rotate(-45deg) translate(-5px, 8px) ;
		  transform: rotate(-45deg) translate(-5px, 8px) ;
		}

			/* Fade out the second bar */
			.change .bar2 {
			  opacity: 0;
			}

		/* Rotate last bar */
		.change .bar3 {
		  -webkit-transform: rotate(45deg) translate(-3px, -6px) ;
		  transform: rotate(45deg) translate(-3px, -6px) ;
		} 

 
 


	 #gnb	{
		 position:fixed;
		 z-index:10000;
		 padding-left:0;
		 top:0px;
		 right:-500px;
		 bottom:0;
		 width:250px;
		 background:#163c9f;
		 margin-left:0;
	}

	 #gnb ul{
		position:relative;
		float:none;
		top:70px;
		width:100%;
	}
	 #gnb ul	{
		 
		text-align: left;
	}
		#gnb > ul:after{
		clear:both;
		display:block;
		position:relative;
		content:'';
		height:50px;
		padding-top:70px;
	}
	 #gnb ul li{
		 float:none;
		 width:100%;
		 text-align:left;
		 margin:0 !important;
		  
	}
	 #gnb ul li:after{
			content:'';
			display:block;
			background: rgba(255,255,255,.1);
			width:100%;
			height:1px;
			position:relative;
	 }
	 #gnb ul li a{
		 padding:0px 0px 0 20px;
		 text-align:left;
		 line-height:2;
		 color:#fff;
		 font-weight:400;
		 font-family:'Noto Sans KR', sans-serif;
	}
	 #gnb ul li a:hover{
		color:#fff;
	}
	 

	 #gnb ul li a:after{
		 content:"";
		 display:block !important;
		 position:absolute;
		 top:10px;
		 right:20px;
		 width:17px;
		 height:14px;
		 background:url('/mobile/image/arrow_off.png') no-repeat 0 0
	 
	 }
	 #gnb ul li:hover a:after{
		 content:"";
		 display:block !important;
		 position:absolute;
		 top:10px;
		 right:20px;
		 left:auto;
		 width:17px;
		 height:14px;
		 background:url('/mobile/image/arrow_on.png') no-repeat 0 0;
		 
	 
	 }
	 #gnb ul li.on a:after{
		 top:16px;
		 background-position:0 0px;
	}

	 #gnb ul li.on ul li a:after	{
		display:block !important;
		background:none;
	}	
	
	#gnb ul li.on:hover a:after ul li a:after{
		display:block;
		background:none;
	}
	 #gnb ul li ul li a:after	{
		display:none !important
	}
	 #gnb ul li:hover ul li a:after	{
		display:none !important
	}

	#gnb ul > li:hover > ul a {
		 
	}



	 #gnb ul li ul{
		width:100%;
		display: none;
		position: relative;
		overflow: hidden;
		padding:0px 0 15px 0;
		top:0px;
		margin:0px;
		min-height:auto;
		background: rgba(255,255,255,.1);
	 }

	 #gnb ul.hover ul{
	display:block;
	
}
 
 
	 #gnb ul li ul{
		 position:static !important;
		 margin:0 !important;
		 padding:0px 0 !important;
		 border:0;
		 box-shadow:none;
		 margin-top:0;
	}
	 #gnb ul li ul li{
		float:none !important;
		border:0;
		text-align:left;
		margin:0;
	}
	 #gnb ul li ul li a{
		display:block;
		color:#fff;
		margin:0 !important;
		text-transform:none;
		position:relative; 
		padding: 2px 5px 2px 35px;  
		 
	 }
	 #gnb ul li ul li a:before{
		content:'';
		display:block;
		position:absolute;
		top:17px;
		left:20px;
		width:5px;
		height:1px;
		background: rgba(255,255,255,.3);
	 }
	 #gnb ul li ul li:first-child a:hover	{
			box-shadow:none
	}
	 #gnb > ul > li > ul > li a:hover{
		color:#fff;
		 
	}

	.menu_tel{
		margin-top:30px;
		color:#fff;
		text-align:center;
		font-size:20px;
	}
	.menu_tel a{color:#fff;display:block;position:relative;}
	.menu_tel span{
		display:inline-block;
		 
		position:relative;
		 
	}
	.menu_tel span:after{
		display:inline-block;
		font-size: 26px;
		 font-family: FontAwesome;
		 
		 content: "\f2a0";
		position:relative; 
		width:40px;
		height:40px; 
		color:#fff; 
		line-height:1.5;
		background:red;
		border-radius:5px;
		margin-right:20px;
	}
 
  .dim	{
		 display:block;
		 position:fixed;
		 z-index:100;
		 top:0;
		 left:-100%;
		 bottom:0;
		 background:#000;
		 opacity:0.0;
		 -moz-transition: opacity 0.5s ease-out;
		 -ms-transition: opacity 0.5s ease-out;
		 -o-transition: opacity 0.5s ease-out;
		 transition: all 0.3s ease-out;
	}

	.on #gnb	{
		right:0px
	}
	 #gnb ul li ul{

		 overflow:hidden;
		 max-height:0;
		 padding:0 0 !important;
		 -webkit-transition: all 0.2s ease;
		 -moz-transition: all 0.2s ease;
		 -ms-transition: all 0.2s ease;
		 -o-transition: all 0.2s ease;
		 transition: all 0.2s ease;
	}
	 #gnb ul li.on ul	{

		 max-height:1000px !important;
		 padding:0px 0 !important;
		 -webkit-transition: all 0.5s ease;
		 -moz-transition: all 0.5s ease;
		 -ms-transition: all 0.5s ease;
		 -o-transition: all 0.5s ease;
		 transition:all 0.5s ease;
	}
	 #gnb ul li.on ul li ul	{
		padding:0 !important
	}

 

	 #gnb > ul > li{
		-webkit-transform: translate3d(250px, 0, 0);
		-moz-transform: translate3d(250px, 0, 0);
		-o-transform: translate3d(250px, 0, 0);
		transform: translate3d(250px, 0, 0);
		-webkit-transition: all 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
		-moz-transition: all 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
		-o-transition: all 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
		transition: all 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	
	}
	.on #gnb >ul > li	{
		-webkit-transform: translate3d(0px, 0, 0);
		 -moz-transform: translate3d(0, 0, 0);
	    -o-transform: translate3d(0, 0, 0);
	    transform: translate3d(0, 0, 0);
	}
	 .on .dim	{
		 display:block;
	     right:0;
		  opacity:0.8;
		 -moz-transition: opacity 0.3s ease-out;
		 -ms-transition: opacity 0.3s ease-out;
		 -o-transition: opacity 0.3s ease-out;
		 transition: opacity 0.3s ease-out;
	} 



	.onhover #gnb > ul > li > a,
	body.bodyfixed #gnb > ul > li > a{
		color:#fff;
	}
	#gnb > ul > li > a:hover,
	#gnb > ul > li.topOn > a,
	body.bodyfixed #gnb > ul > li > a:hover,
	body.bodyfixed #gnb > ul > li.topOn > a {
		 
		color:#fff;
		}
 

 .otherlink{
	margin-top:30px;
	position:relative;
 }
 .otherlink:after{
	clear:both;
	display:block;
	content:'';
 }
 .otherlink a{
	float:left;
	width:48%;
	margin: 0 1%;
	color:#fff;
	display:block;
	padding:5px;
	text-align:center;
	background:#72be28;
 }



 
 
 
  
 
 
/*footer*/
#footer{
	clear:both;
	position:relative;
	width:100%;
	background:#124f7a;
	letter-spacing:0;
	border-top:1px solid #ccc;
	
}
 
.footerarea_in{
	clear:both;
	position:relative;
	margin: 0 auto;
	padding:5px 10px;

}


.footerarea_in .addr{
	position:relative;
	width:100%;
	 
	font-size:14px;
	font-weight:400;
	line-height:150%;
	word-break:keep-all;
	}

 

.footerarea_in .addr .bottomlink:after{
	clear:both;
	content:'';
	display:block;
}
.footerarea_in .addr .bottomlink ul{
 	  
	position:relative;
	margin:0 auto;
	text-align:center;
}

.footerarea_in .addr .bottomlink ul li{
	 display:inline-block;
	 
	padding:3px 8px;
	font-size:14px;
	background:#000;
	position:relative;
	border: 0px solid #ccc;
	margin-top:20px;
	margin-right:3px;
	 
	
}
.footerarea_in .addr .bottomlink ul li a{color:#fff;}
 
 
.footerarea_in .bottom_wrap{
	position:relative;
	margin:0 auto;
	 
}

.footerarea_in .bottom_logo{
 
 	text-align:center; 
	padding-top:20px;
	}
	.footerarea_in .bottom_logo img{max-width:220px;}
.footerarea_in .companyinfo{
 
	padding-left:0px;
	padding-top:20px;
	font-size:15px;
	line-height:1.3;
	text-align:center;
	}
.footerarea_in .companyinfo span{
	margin-right:10px;
	color:#fff;
	display:inline-block;
	}
.footerarea_in .companyinfo strong{
	
	font-weight:400;
	}
 
.footerarea_in .companyinfo p.cpyright{
	color:#f7f7f7;
	font-size:12px;
	 letter-spacing:0px;
	}

.blankclear{
	clear:both;
	height:10px;
	}