/*手機尺吋*/	
.mainNav{
	     position:fixed;
	     left:0;
	     top:0;
         background: rgba(38,58,74,.99);
         z-index: 9999;
         overflow:auto;
         -webkit-overflow-scrolling: touch;
        /* transition:all .7s;*/
         transform:translateX(-100%);
		 width:100%;
		 height: 100%;
         left: auto;
         transition: all .3s;
         padding:15px 15px calc(50px + 15px);
	 }

.mainNav.active{transform:translateX(0);}

.mainNav>div{
    text-align:center;
    border: 1px solid #3b4e5c;
    height: 100%;
    padding:50px;
}

.mainNav>div h1{
    margin-bottom:50px;
}

.mainNav ul{
    display:flex;
    align-items: center;
    justify-content:center;
    flex-direction:column;
}

.mainNav li{
    width: 100%;
}

.mainNav li + li{
     border-top: 1px solid #465970;
}

.mainNav li a{
	color: #FFF;
    font-size: 15px;
    position:relative;
    line-height: 3em;
    display:block;
    font-weight:300;
}

.mainNav ul li.active {
    padding:0em;
    background: #37566e;
}

.mainNav ul li.active  a {

}



/*漢堡選單*/
:root{
    --btnHamW:45px;
}

.btn-mobile {
	position:fixed;z-index:99990;right:0px;top:0px;
    padding:5px;
     background-color:#17242D;
}

.btn-mobile.active{
    background-color:#5C727A;
}

.btn-mobile a{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    align-content:center;
    background-color:#17242D;
    width:var(--btnHamW);
    height:var(--btnHamW);
    padding:5px;
    overflow:hidden;
}

.btn-mobile  hr{
    margin:0;
    margin: 3px 2px;
    width: 100%;
    transition: all .3s;
}

.btn-mobile a img{display:none}

.btn-mobile.active .hr2{
    transform:translateX(100%);
    opacity:0;
}


.btn-mobile .hr2{
   
}


.btn-mobile.active .hr1{
    margin-bottom:-4px;
    transform:rotate(45deg);
    
}

.btn-mobile.active .hr3{
    margin-top:-4px;
    transform:rotate(-45deg);
    
}


/*遮罩*/
.block{position:fixed;width:100%;height:100%;left:0;top:0;display:none;background:rgba(0,0,0,.5); z-index: 90;}
.block.active{display:block;}


@media (max-width: 660px) {
    
}




/*IPHONE X*/    
@media only screen and (device-width:375px) and (-webkit-device-pixel-ratio: 3) {

}

/*IPHONE SE*/    
@media (max-width: 360px) {


}