.mobile-inner{
	width:100%;
	margin:0 auto;
	position:fixed;
	top:0;
	z-index:1000;
	display:none;
}
@media only screen and (max-width:768px){
	.mobile_bg{ display:block;}
	.mobile-inner{ display:block;}
}
.mobile_logo{ float:left;}
.mobile-inner a{
	display:block;
	margin-top:7px;
	margin-left:5px;
	position:relative;
	z-index:1000;
}
.mobile-inner img{
	display:block;
	height:36px;
}
.mobile-inner-header{
	background-color:rgba(0,0,0,0.8);
	width:100%;
	height:50px;
	position:absolute;
	top:0px;
	left:0px;
}
.mobile-inner-header-icon{
	color:#ffffff;
	height:50px;
	font-size:25px;
	text-align:center;
	float:right;
	width:50px;
	position:relative;
	-webkit-transition:background 0.5s;
	-moz-transition:background 0.5s;
	-o-transition:background 0.5s;
	transition:background 0.5s;
}
.mobile-inner-header-icon:hover{
	background-color:rgba(255,255,255,0.2);
	cursor:pointer;
}
.mobile-inner-header-icon span{
	position:absolute;
	left:calc((100% - 25px) / 2);
	top:calc((100% - 1px) / 2);
	width:25px;
	height:1px;
	background-color:rgba(255,255,255,1);
}
.mobile-inner-header-icon span:nth-child(1){
	transform:translateY(4px) rotate(0deg);
}
.mobile-inner-header-icon span:nth-child(2){
	transform:translateY(-4px) rotate(0deg);
}
	



	
.mobile-inner-header-icon-click span:nth-child(1){
	animation-duration:0.5s;
	animation-fill-mode:both;
	animation-name:clickfirst;
}		
.mobile-inner-header-icon-click span:nth-child(2){
	animation-duration:0.5s;
	animation-fill-mode:both;
	animation-name:clicksecond;
}
	


@keyframes clickfirst{
  0%{
	  transform:translateY(4px) rotate(0deg);
	  
  }

  100%{
    transform:translateY(0) rotate(45deg);
  }
}	



@keyframes clicksecond{
  0%{
	  transform:translateY(-4px) rotate(0deg);
  }

  100%{
    transform:translateY(0) rotate(-45deg);
  }
}	

.mobile-inner-header-icon-out span:nth-child(1){
	animation-duration:0.5s;
	animation-fill-mode:both;
	animation-name:outfirst;
	}		
.mobile-inner-header-icon-out span:nth-child(2){
	animation-duration:0.5s;
	animation-fill-mode:both;
	animation-name:outsecond;
	}

@keyframes outfirst{
  0%{
    transform:translateY(0) rotate(-45deg);
  }

  100%{
    transform:translateY(-4px) rotate(0deg);
  }
}	



@keyframes outsecond{
  0%{
    transform:translateY(0) rotate(45deg);
  }

  100%{
    transform:translateY(4px) rotate(0deg);
  }
}

.mobile-inner-nav{
	background-color:rgba(0,0,0,0.9);
	width:100%;
	position:absolute;
	top:50px;
	left:0px;
	padding-top:30px;
	padding-bottom:80px;
	display:none;
}
.mobile-inner-nav a{
	display:inline-block;
	line-height:50px;
	text-decoration:none;
	width:80%;
	margin-left:10%;
	color:#FFFFFF;
	border-bottom:solid 1px rgba(255,255,255,0.3);
	-webkit-transition:all 0.5s;
	-moz-transition:all 0.5s;
	-o-transition:all 0.5s;
	transition:all 0.5s;
	font-weight:300;
}
.mobile-inner-nav a:hover{
	color:rgba(255,255,255,0.4);
	border-bottom:solid 1px rgba(255,255,255,0.2);
}


.mobile-inner-nav a{
	-webkit-animation-duration:0.5s;
	animation-duration:0.5s;
	-webkit-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-name:returnToNormal;
	animation-name:returnToNormal;
}	
@-webkit-keyframes returnToNormal{
	from{
		opacity:0;
		-webkit-transform:translate3d(0, 100%, 0);
		transform:translate3d(0, 100%, 0);
	}
	to{
		opacity:1;
		-webkit-transform:none;
		transform:none;
	}
}
@keyframes returnToNormal{
	from{
		opacity:0;
		-webkit-transform:translate3d(0, 100%, 0);
		transform:translate3d(0, 100%, 0);
	}
	to{
		opacity:1;
		-webkit-transform:none;
		transform:none;
	}
}