/*头尾*/
.header .top{width: 100%;padding: 20px 0;box-shadow: 0px 5px 10px rgb(34 133 162 / 20%);}
.header .logo img{height: 60px;display: block;transition: all .3s ease-out;}

.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::before{content: '';position: absolute;height: 20px;width: 2px;top: 50%;left: -1px;transform: translateY(-50%);background-color: #ccdadd;}
.header .nav> li:last-child::after{content: '';position: absolute;height: 20px;width: 2px;top: 50%;right: -1px;transform: translateY(-50%);background-color: #ccdadd;}
.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> a:hover{border-radius: 0 30px;background-color: var(--primary-color);color: #fff;}
.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%);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-color: #2285a2;color: #fff;}
.footer a:hover{text-decoration: underline;}
.footer .links{padding: 30px 0 20px;border-bottom: 1px solid rgba(255, 255, 255, 0.2);}
.footer .links li+li{margin-left: 20px;}
.footer .main{padding: 20px 0;font-size: 14px;}
.footer .contact{margin-left: 30px;}
.footer .contact p{margin: 5px 0;}
.footer .qrcode li+li{margin-left: 30px;}
.footer .qrcode img{height: 120px;}
.footer .qrcode p{margin-top: 10px;text-align: center;}
.footer .btm{background-color: #185a6d;padding: 15px 0;font-size: 14px;}



@media screen and (max-width: 1320px){
	.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%;}
	.header .logo img{height: 40px;}
    .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: 60px 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::before,
	.header .nav> li::after{display: none;}
	.header .nav> li> a{width: calc(100% - 50px);height: 50px;line-height: 50px;font-size: 16px;padding: 0;text-align: left;}
	.header .nav> li> a:after{display: none;}
	.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);}
	
	.footer{padding-bottom: 50px;}
	.footer .links li:first-child{width: 100%;margin-bottom: 6px;}
	.footer .links li + li{margin: 5px 10px 0 0;font-size: 15px;}
	.footer .main .left{width: 100%;justify-content: flex-start;margin-bottom: 20px;}
	.footer .main .logo{width: 110px;}
	.footer .contact{margin-left: 20px;flex: 1;}
	.footer .qrcode{justify-content: center;width: 100%;}
	.footer .qrcode li+li{margin-left: 15px;}
	.footer .qrcode img{height: 100px;}

	.footer-fix{ display: block;}

}