.ph_header{display: none;position:relative;z-index:3;}

.ph_logo{float:left;background:url(../images/logo.png) no-repeat center center;width:200px;height:60px;background-size: 100%;margin-left:20px;}

.ph_logo a{display:block;height:60px;}

.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{background-color:#fff;width: 100%;height: 60px;position: absolute;top: 0px;left: 0px;}

.mobile-inner-header-icon{color: #006f47;height: 45px;font-size:25px;text-align: center;float:right;width: 35px;position: relative;-webkit-transition: background 0.5s;-moz-transition: background 0.5s;-o-transition: background 0.5s;transition: background 0.5s;margin-right:20px;}

.mobile-inner-header-icon:hover{background-color: rgba(255,255,255,0.2);cursor: pointer;}

.mobile-inner-header-icon span{position: absolute;left:0;top: calc((100% - 1px) / 2);width: 35px;height: 2px;background-color: #006f47;margin: 5px 0;display:block}

.mobile-inner-header-icon span:nth-child(1){transform: translateY(4px) rotate(0deg);top:23px;}

.mobile-inner-header-icon span:nth-child(2){transform: translateY(-4px) rotate(0deg);top:23px;}

.mobile-inner-header-icon span:nth-child(3){top: 35px;}	



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

.mobile-inner-header-icon-click span:nth-child(3){opacity:0}





@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,151,87,0.9);width: 100%;position: absolute;top: 60px;left: 0px;padding-bottom:

30px;display: none;z-index:3;} .mobile-inner-nav a{display: inline-block;line-height: 36px;text-decoration: none;width:

80%;margin-left: 10%;color: #FFFFFF;border-bottom: solid 1px rgba(255,255,255,0.3);-webkit-transition: all 0.3s;-moz-

transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;-webkit- animation-duration: 0.3s

;animation-duration: 0.3s;-webkit-animation-fill-mode: both;animation-fill-mode: both;-webkit-animation-name:

returnToNormal ;animation-name: returnToNormal;} .mobile-inner-nav a:hover{color: rgba(255,255,255,0.4);border-bottom:

solid 1px rgba(255,255,255,0.2);} @-webkit- keyframes returnToNormal { 0% { opacity: 0; -webkit-transform:

translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); }



100% {

opacity: 1;

-webkit-transform: none;

transform: none;

}

}



@keyframes returnToNormal {

0% {

opacity: 0;

-webkit-transform: translate3d(0, -100%, 0);

transform: translate3d(0, -100%, 0);

}



100% {

opacity: 1;

-webkit-transform: none;

transform: none;

}

}