.main-header{height: 1.65rem;font-size: 0;top: 0;z-index: 999;transition: all .5s;}
.main-header:before{display: block;width: 100%;height: 100%;opacity: .95;background: #fff;content: "";position: absolute;top: 0;left: 0;z-index: 1;}
.main-header .logo{width: 5rem;margin: .4rem 0 .35rem .35rem;cursor:pointer;position: relative;z-index: 2;}
.main-header .logo img{width: 100%;display: block;}
.main-header .list{width: .6rem;height: .48rem;margin: .6rem .5rem .57rem 0;cursor:pointer;z-index: 2;position: relative;}
.main-header .list img{width: 100%;height: 100%;display: block;}


.main-nav{top: 0;height: 100%;z-index: 1000;display: none;}
.main-nav.on{display: block;}
.main-nav .nav-bg{background: #000;opacity: .3;position: absolute;top: 0;bottom: 0;left: 0;right: 0;width: 100%;height: 100%;}
.main-nav .nav-box{position: absolute;top: 0;right: -100%;width: 5.6rem;padding: .5rem;box-sizing: border-box;background: #fff;transition: all .5s;}
.main-nav .nav-box.on{right: 0;}
.main-nav .nav-close{position: absolute;width: .37rem;top: .6rem;right: .7rem;cursor:pointer;transition: all 1s;transform:rotate(0deg);}
.main-nav .nav-close.on{transform:rotate(270deg);}
.main-nav .nav-close img{width: 100%;display: block;}
.main-nav .nav-header{}
.main-nav .nav-header p{font-size: .36rem;color: #595757;line-height: .6rem;}
.main-nav .nav-list{margin-top: .1rem;}
.main-nav .nav-list ul{}
.main-nav .nav-list ul li{padding-top: .3rem;border-bottom: .01rem solid #595757;position: relative;}
.main-nav .nav-list ul li:last-child{border-bottom: 0;}
.main-nav .nav-list ul li p{font-size: .3rem;color: #595757;line-height: .6rem;letter-spacing: .1rem;}
.main-nav .nav-list ul li.on p{color: #f8b62d;font-weight: bold;}
.main-nav .nav-list ul li p.phone{position: absolute;top: .3rem;right: 0;color: #417efb;letter-spacing: 0;}

 @keyframes close-deg{0%{-webkit-transform:rotate(0deg);}100%{-webkit-transform:rotate(360deg);}}