@charset "utf-8";
/* CSS Document */
.phone_nav{display:none;}
@media screen and (max-width:1200px){
	.phone_nav{display: block; height: 75px;}
	.body_on{overflow:hidden; width:100%; height:100%; position:fixed; left: 0; top: 0;}
	
	/*头部*/
	.phone_nav .top{ background: #ef801b; height: 75px; position:fixed; left: 0; top: 0; width: 100%; box-sizing: border-box; padding: 0 20px; z-index:999;box-shadow: 3px 4px 12px 0px rgba(0, 0, 0, 0.21);}
	.phone_nav .top .a{float: left; height: 30px; margin: 10px 0;}
	.phone_nav .top .a img{height:100%;}
	.phone_nav .top .but{ float:right; width: 25px; height: 25px; margin:10px 0; display: block;}	
	.phone_nav .top .but i{width:100%; height: 2px; margin-top: 15px; background: #fff; display: block; position: relative; transition: 0.4s;}
	.phone_nav .top .but i:before,
	.phone_nav .top .but i:after{content:""; position:absolute; left:0; top:0; display:block; width:100%; height:2px; background: #fff; transition: 0.4s;}
	.phone_nav .top .but i:before{ margin-top: -7px;}
	.phone_nav .top .but i:after{ margin-top: 7px;}
	
	/*背景*/
	.phone_nav .box{ width:100%; height: 100%; background-color: rgba(0,0,0,.85); position: fixed; left: 0; top: 0; z-index: 998; transform: translateX(100%); transition: 0.7s; }
	.phone_nav .box_con{ margin:80px 20px 10px 20px; overflow-x: hidden;}
	
	/*列表*/
	.phone_nav .box_con ul{ border-bottom: 1px solid rgba(225,225,225,0.7);}
	.phone_nav .box_con li{ border-bottom: 1px solid rgba(225,225,225,0.7); padding: 15px 10px; position: relative;}
	.phone_nav .box_con li a{color:#fff; font-size: 16px; display: block; line-height: 30px;}
	.phone_nav .box_con li:last-child{border-bottom: 0; }
	.phone_nav .box_con ol{display: none; padding-top: 10px;}
	.phone_nav .box_con .a_zk{position:absolute; right:0; top:15px; width: 70%; height: 30px; text-align: right;}
	.phone_nav .box_con .a_zk i {display: inline-block;width: 30px; height: 30px;transition:0.4s; transform: rotate(-90deg);
	background: url(../images/ico_nav.png) center no-repeat;}
	.phone_nav .box_con .a_zk_on i{transform: rotate(0deg);}
	
	/*打开样式*/
	.phone_on .top .but i:before{ transform: rotate(45deg); margin: 0;}
	.phone_on .top .but i:after{ transform: rotate(-45deg); margin: 0;}
	.phone_on .top .but i{ background:none;}
	.phone_on .box{transform: translateX(0%); }
	
}
@media screen and (max-width:758px){
	.phone_nav .top {padding: 0 15px;}
	.phone_nav .box_con {margin: 80px 15px 10px 15px;}
	.phone_nav .box_con li a {font-size: 15px;}
	.phone_nav .box_con li {padding: 10px;}
	.phone_nav .box_con .a_zk {top: 10px;}
	/*.phone_nav .box_con ul {padding-top: 10px;}*/
}
@media screen and (max-width:470px){/*--320--*/
	.phone_nav .top {padding: 0 10px;}
	.phone_nav .box_con {margin: 80px 10px 10px 10px;}
	.phone_nav .box_con li a {font-size: 14px;}
}