/*头尾*/
.header .top{width: 100%;padding: 20px 0;box-shadow: 0px 5px 10px rgb(34 133 162 / 20%);}
.header .logo{display: flex;align-items: center;}
.header .logo img{height: 42px;display: block;transition: all .3s ease-out;}
.header .logo .txt{border-left: 1px solid #ccc;padding-left: 10px;margin-left: 10px;color: #666;line-height: 1;}
.header .logo .txt span{color: var(--primary-color);font-weight: bold;margin-top: 8px;display: block;}
.header .top .icon{width: 36px;height: 36px;border-radius: 50px;background-color: var(--primary-color);padding: 8px;display: flex;align-items: center;justify-content: center;}
.header .tel{font-size: 20px;font-weight: bold;line-height: 1;}
.header .tel span{font-size: 14px;color: var(--primary-color);}
.header .tel .icon{margin-right: 8px;}
.header .qrcode li{position: relative;z-index: 5;margin-left: 20px;}
.header .qrcode li .icon{cursor: pointer;}
.header .qrcode li .img{position: absolute;top: 100%;right: 0;width: 150px;height: 150px;display: none;justify-content: center;align-items: center;}
.header .qrcode li:hover .img{display: flex;}

.header .btm .wrapper{padding: 15px 0;height: 100%;}
.header .nav> li{position: relative;flex: 1;padding: 0 2px;transition: all .3s ease-out;}
.header .nav> li:hover .children{margin-top: 0;opacity: 1;visibility: visible;}
.header .nav> li> a{width: 100%;height: 50px;line-height:50px;padding: 0 20px;text-align: center;font-size: 16px;white-space: nowrap;display: block;position: relative;transition: inherit;}
.header .nav> li.on> a,
.header .nav> li> a:hover{background-color: var(--primary-color);color: #fff; border-radius: 5px;}
.header .nav> li>.arrow{position:absolute; top:0; right:0; transition:all .3s linear;display: none;filter: contrast(0.5);;}
.header .nav .children{position: absolute;top:100%;left:50%;z-index: 3;transform: translateX(-50%);min-width: 100%;margin-top: 50px;visibility: hidden;opacity: 0;padding: 10px 20px;transition: margin-top 0.4s ease-in-out 0s, visibility 0.4s ease-in-out 0s, opacity 0.4s ease-in-out 0s;background-color: rgba(255, 255, 255, .9);box-shadow: 0 2px 3px #eee;}
.header .nav .children li{line-height:44px;padding:0 10px;text-align: center;}
.header .nav .children li:last-child{border-bottom: 0;}
.header .nav .children li a{display: block;white-space: nowrap;font-size: 15px;transition: all .3s linear;}
.header .nav .children li a:hover{color: var(--primary-color);}

.header .search{width: 300px;height: 40px;line-height: 40px;font-size: 15px;}
.header .search .keyword{flex: 1;height: 100%;border: 1px solid #eee;padding: 0 10px;}
.header .search .submit{width: 60px;height: 100%;text-align: center;color:  #fff;background-color: var(--primary-color);}

.menu_btn{width: 20px;height: 50px;cursor: pointer;display: none;position: relative;}
.menu_btn span{width: 20px;height: 2px;background: #000;position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: auto;will-change: transform;transition: .75s cubic-bezier(.19,1,.22,1);}
.menu_btn span:first-child{transform: translateY(-6px) scaleX(1);transition-delay: .4s;}
.menu_btn span:nth-child(2){transform: scaleX(1);transition-delay: 350ms;}
.menu_btn span:nth-child(3){transform: translateY(6px) scaleX(1);transition-delay: .3s;}
.menu_btn span:nth-child(4){transform: rotate(45deg) scaleX(0);transition-delay: 50ms;}
.menu_btn span:last-child{transform: rotate(-45deg) scaleX(0);transition-delay: 0s;}
.menu_btn.toggle span:first-child{transform: translateY(-6px) scaleX(0);transition-delay: .1s;}
.menu_btn.toggle span:nth-child(2){transform: scaleX(0);transition-delay: 50ms;}
.menu_btn.toggle span:nth-child(3){transform: translateY(6px) scaleX(0);transition-delay: 0s;}
.menu_btn.toggle span:nth-child(4){transform: rotate(45deg) scaleX(1);transition-delay: .3s;}
.menu_btn.toggle span:last-child{transform: rotate(-45deg) scaleX(1);transition-delay: 350ms;}

.footer-fix{box-shadow:0 0 10px rgba(0,0,0,0.2);position:fixed;bottom:0;left:0;width:100%;background-color:var(--primary-color);  z-index:10;display:none}
.footer-fix li{float:left;width:25%;}
.footer-fix li a{display:block;text-align:center;padding:7px 0;font-size:12px;line-height:1;color: #fff;}
.footer-fix li i{display:block;height:20px;background:no-repeat center;background-size:contain;margin-bottom:4px}

.footer{background: #333 url(../images/bg_footer.jpg) no-repeat center/cover;color: rgba(255, 255, 255, .6);font-size: 14px;}
.footer a:hover{text-decoration: underline;}
.footer .top{padding: 50px 0 30px;}
.footer .nav{flex: 1;display: flex;justify-content: space-between;padding-right: 10%;line-height: 1;}
.footer .nav .title{font-size: 16px;color: #fff;margin-bottom: 30px;}
.footer .nav li{margin-top: 20px;}
.footer .contact{color: #fff;}
.footer .contact h3{font-size: 24px;margin-bottom: 20px;font-weight: bold;line-height: 1;}
.footer .contact p{margin-top: 10px;}
.footer .qrcode{margin: 30px 0 0;}
.footer .qrcode li + li{margin-left: 30px;}
.footer .qrcode img{height: 120px;}
.footer .qrcode p{color: #fff;text-align: center;}
.footer .btm{border-top: 1px solid rgba(255, 255, 255, .1);padding: 20px 0;}

@media screen and (max-width: 1270px){
	.header .top{height: 60px;box-shadow: 0 7px 32px -12px rgba(0,0,0,.2);padding: 0;position: fixed;top: 0;left: 0;z-index: 999;background-color: #fff;}
	.header .top .wrapper{height: 100%;}
    .menu_btn{display: block;}

	.header .search{position: fixed;top: 70px;left: 4%;z-index: 999;width: 92%;display: none;}
	.header.toggle .search{display: flex;}
	
    .header .btm{position: fixed;top: 60px;left: 0;z-index: 998;width: 100%;height: 0;background-color: #fff;transition:all .4s ease-out;}
    .header.toggle .btm{height: calc(100vh - 60px);padding: 0 0 20px;overflow: hidden;display: block;}
	
	.header .nav{width: 100%;height: 100%;display: block;overflow-y: auto;}
	.header .nav> li{width: 100%;margin-left: 0;border-bottom: 1px solid rgba(0,0,0,.04);}
	.header .nav> li> a{width: calc(100% - 50px);height: 50px;line-height: 50px;font-size: 16px;padding: 0;text-align: left;}
	.header .nav> li.on> a, 
	.header .nav> li> a:hover{background: none;color: var(--primary-color);font-weight: bold;}
	.header .nav> li> .arrow{display: flex;align-items: center;justify-content: center;width: 50px;height: 50px;transform: rotate(0deg);font-size: 15px;}
	.header .nav .children{position: static;width: 100%;background: none;box-shadow: none;transform: none;margin-top: 0;padding: 0 0 10px 10px;opacity: 1;visibility: visible;display: none;}
	.header .nav .children li{padding: 0;line-height: 38px;}
	.header .nav .children li a{color: #999;text-align: left;}
	.header .nav> li> .rotate{transform: rotate(180deg);}
	
	.header .qrcode{display: none;}
	
	.footer{padding-bottom: 50px;}
	.footer .top{padding: 30px 0;text-align: center;width: 100%;display: block;}
	.footer .nav{display: none;}
	.footer .contact h3{margin-bottom: 15px;}
	.footer .contact p{margin-top: 5px;}
	.footer .qrcode{justify-content: center;}
	.footer .btm{text-align: center;display: block;}
	.footer .btm p{display: inline;}

	.footer-fix{ display: block;}

}

@media screen and (max-width: 1024px){
	.header .logo img{height: 30px;}
	.header .logo .txt{font-size: 14px;}
	.header .logo .txt span{margin-top: 5px;}
	.header .tel{display: none;}
	.footer .contact h3{font-size: 20px;}
}


@media screen and (max-width: 500px){
	.header .logo img{height: 23px;}
	.header .logo .txt{font-size: 12px;padding-left: 5px;margin-left: 5px;}
	.header .logo .txt span{margin-top: 2px;}
}




/*客服*/
.kf{width:165px;position:fixed; right:0;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%);z-index:999}
.kt-top{height:40px;line-height:40px;background:url(../images/kefu.png) 12px center no-repeat var(--primary-color);-o-background-size:auto 20px;-ms-background-size:auto 20px;-moz-background-size:auto 20px;-webkit-background-size:auto 20px;background-size:auto 20px;padding-left:46px;font-size:14px;color:#fff}
.kt-top span:hover{transform:rotate(90deg)}
.kt-top span{width:18px;height:16px;float:right;position:relative;margin:10px 10px 0 0;cursor:pointer;transition:.5s;-webkit-transition:.5s;-moz-transition:.5s;-ms-transition:.5s;-o-transition:.5s}
.kt-top span b{width:100%;height:2px;background:#fff;display:block;position:absolute;top:50%;left:0}
.kt-top span b:first-child{transform:rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg)}
.kt-top span b:last-child{transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg)}
.kf .con{overflow:hidden;background:#fff}
.kf .qq li{height:36px;line-height:36px;border-bottom:#f5f5f5 solid 1px;padding-left:40px; background:url(../images/lianxi.png) no-repeat 15px 8px; margin-bottom: 20px;}
.kf .qq li a{height:36px!important;color:#666;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-decoration:initial;display:block}
.kf .qq li a img{padding-right:6px}
.kf .con h5{height:26px;line-height:26px;margin-top:12px;background:url(../images/lianxi.png) 16px center no-repeat;padding-left:45px;color:#666;font-size:14px;margin-bottom:0}
.kf .contact{margin-top:1px}
.kf .contact p{height:26px;line-height:26px;color:#666;font-size:16px;padding-left:22px;margin:0;padding-left:32px}
.kf .contact p:nth-child(2n){padding-left:32px}
.kf .con h5.qr-icon{background:url(../images/erweima.png) 16px center no-repeat}
.kf .con .qr{padding-left:30px}
.kf .con .qr img{width:110px;height:110px; margin-bottom:10px;}
.kf .backTop{width:100%;height:40px;background:url(../images/top.png) center center no-repeat var(--primary-color);background-size:18px auto;cursor:pointer}
.kf-side{padding:18px 10px 10px;background:var(--primary-color);position:absolute;top:50%;transform:translateY(-50%);-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);left:-34px;cursor:pointer}
.kf-side b{display:block;color:#fff;line-height:18px;font-size:14px;font-weight:400}
.kf-side span.arrow{width:12px;height:12px;background:url(../images/jt-1.png) no-repeat;-o-background-size:auto 12px;-ms-background-size:auto 12px;-moz-background-size:auto 12px;-webkit-background-size:auto 12px;background-size:auto 12px;display:block;margin-top:10px}
.kf-side span.on{background:url(../images/jt-2.png) no-repeat;-o-background-size:auto 12px;-ms-background-size:auto 12px;-moz-background-size:auto 12px;-webkit-background-size:auto 12px;background-size:auto 12px}
@media screen and (max-width:640px){
	.kf {display:none;}
}