/* 重置css代码 */
*{margin:0;padding:0;box-sizing: border-box;}
html,body{width:100%;height:100%;}
body{font-family: "Arial", "微软雅黑", "Helvetica", "sans-serif";font-size:14px;line-height:1.8}
a{text-decoration:none;}
li{list-style:none;}

.warp{max-width:1200px;margin:0 auto;padding:0 20px;}
.header {height:80px;font-size: 16px;position: fixed;top:0;left:0;right:0;z-index:9;}
.header .warp {display:flex;justify-content:space-between;align-items:center;}
.logo{height:80px;line-height:80px;padding-left:90px;background:url(../images/logo.png) no-repeat 0 center;background-size:auto 80%;font-size:30px;color:#fff;font-weight: bold;}
.nav ul{display:flex;}
.nav li{margin:0 25px;}
.nav a{color:#fff;font-size:16px;}
.nav a:hover{color:#ff0;}
.fixed-menu .logo, .fixed-menu .nav a{color: #000 !important;}
.fixed-menu .nav a:active{color: #00579a !important;background: none;}
.fixed-menu{width:100%;background:#fff;position: fixed;top:0;animation:slide-down 0.7s;left:0;right:0;box-shadow:4px -86px 103px rgba(0,0,0,0.9);z-index:250;}
@keyframes slide-down { 0% {transform: translateY(-100%);} 100% {transform: translateY(0);}}
@keyframes slide {0% { opacity: 0; transform: translateY(50%);} 100% {  opacity: 1;  transform: translateY(0);} }

.banner-block{width:100%;height:auto;overflow:hidden;position:relative;top:0;background:url(../images/svg-web.svg) center bottom repeat-x, url(../images/banner-pic.webp) center center no-repeat;height:680px;background-size:contain, cover;}
.main {display: flex;justify-content: space-between;align-items: center;}
.b-col {width: 50%;color: #fff;}
.b-col h1 {font-size:45px;margin-bottom:20px;}
.b-col p {font-size:16px;margin-bottom:20px;}
.b-img {margin-top: 140px;}
.b-col img {width: 100%;}
.b-btn{background: #fff;border-radius:5px;color: #00579a !important;text-align: center;display: inline-block;margin: 0;margin: 0;width: 163px;font-family: 'Poppins', sans-serif; font-size: 15px; text-transform: capitalize; font-weight: 500; margin-top: 16px;margin-right: 8px;padding: 10px 0;transition: all 0.5s;border: solid 2px #fff;}
.b-btn:hover{background: none !important;color: #fff !important;}
.c-btn{background: none;border: solid 2px #fff;color: #fff !important;}
.d-btn{background: #00579a;border: solid 2px #00579a;color: #fff !important;}
.c-btn:hover{background: #fff !important;color: #00579a !important;}
.d-btn:hover{background: #fff !important;color: #00579a !important;}

.wave-dark {position: absolute;bottom:0;left: 0;width: 100%;height: auto;pointer-events: none;}
.wave-dark .wave-path {transform: scale(1.2, 1);transform-origin: 50% 100%;}
.wave-dark .wave-path-1 {fill: rgba(255, 255, 255, 0.05);animation: wave1 15s ease-in-out infinite;}
.wave-dark .wave-path-2 {fill: rgba(255, 255, 255, 0.08);animation: wave2 15s ease-in-out infinite;}
.wave-dark .wave-path-3 {	fill: rgba(255, 255, 255, 0.09);	animation: wave3 15s ease-in-out infinite;}
@keyframes wave1 { 25% {transform-origin: 0 100%;transform: scale(1.4, 1.3);} 75% {transform: scale(1.4, 0.7); transform-origin: 100% 100%;}}
@keyframes wave2 { 25% {transform-origin: 0 100%;} 50% {transform: scale(1.3, 0.8);} 75% {transform-origin: 100% 100%;}} 
@keyframes wave3 { 25% {transform-origin: 100% 100%;}	50% {transform: scale(1.2, 0.9);}	75% {transform-origin: 0 100%;}}

.title{font-size:35px;text-align: center;padding:10px 0;}
.title span {display:block;width: 100px;height: 4px;background-color: #00579a;margin:10px auto 0;}
.service-block {position: relative;z-index:10;padding:70px 0;}
.service-list ul{display: flex;flex-wrap: wrap;}
.service-list li{flex: 0 0 33.3%;text-align: center;padding:0 30px;margin-top:50px;}
.service-list li h3{font-size: 20px;margin: 10px 0;}
.service-list li p{color: #777;}
.service-item {border-radius:10px;box-shadow:5px 7px 15px 2px rgb(82 90 101 / 12%);background: #fff;height: 300px;display: grid;align-content: center;	padding: 0 30px;	transition: all 0.5s;}
.service-item:hover{background: #00579a;color:#fff;transition: all 0.5s;}
.service-item:hover p{color: #fff;transition: all 0.5s;}
.service-item .icon {width:80px;height:80px;margin:0 auto 20px;overflow: hidden;transition: all 0.5s;position:relative;}
.service-item .icon img {width:100%;}
.hover-show{top:-200px;position: relative;transition: all 0.5s;}
.service-item:hover .icon .hover-show{top:-88px;}
.dissplay-show{position: relative;top:0;transition: all 0.5s;}
.service-item:hover .icon .dissplay-show{top:-200px;}

.tc{text-align: center;}
.app-block{background: #f6f8fd;position: relative;width: 100%;display: inline-block;margin-top:60px;padding:70px 0;}
.app-block .warp{position: relative;z-index:9;}
.app-svg{left: 0;right: 0; width: 100%; display: inline-block; position: absolute;top: -390px;}
.app-svg-bt{left: 0; right: 0; width: 100%; display: inline-block; position: absolute;bottom: -380px;  z-index: 1;}
.app-li {display: flex;flex-wrap: wrap;}
.app-li h3{font-size:28px;}
.app-li p{font-size:18px;color:#888;padding:20px 0;}
.app-li > div{flex: 0 0 50%;display: flex;justify-content: center;align-items: center;}
.app-li img {width:350px;}

.contact-block{position: relative;color:#fff;padding: 200px 0;background: url(../images/bg-call.jpg) no-repeat; background-size: cover; width: 100%;}
.contact {margin-top:30px;}
.contact .b-btn{width:200px;}
.contact-block h2 span{background:#fff;}

.footer {padding:30px 0;display: inline-block; width: 100%;background:#212529;position: relative;z-index:9;}
.footer .warp{font-size:13px;color:#999;margin-bottom:10px;margin-top:12px;display: flex;justify-content: space-between;}
.footer a{color:#999;transition: all 0.5s;}
.footer a:hover{color:#00579a;}
