

.mobile-inner{

	width:100%;

	margin-right: auto;

	margin-left: auto;

	background-color: #fafafa;



}

.mobile-inner img{

	width: 100%;

	margin-bottom: 30px;

}

.mobile-inner p{

	color: #676767;

	line-height: 25px;

	font-size: 16px;

	padding-bottom: 30px;

	padding-right: 30px;

	padding-left: 30px;

	margin:0px;

}

.mobile-inner-header{



	height: 50px;

	position: absolute;

	top: 0px;

	right: 10px;
	    z-index: 99;

}

.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: 2px;

	background-color: rgba(0,0,0,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:#1370ad;

	width: 100%;

	position:fixed;

	top:61px;

	left: 0px;

	bottom:0px;

	padding-top: 30px;

	padding-bottom: 80px;

	display: none;

	z-index:9;

}

.mobile-inner-nav a{

	display: inline-block;

	line-height: 50px;

	text-decoration: none;

	width:90%;

	margin:0 5%;

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

}

