@charset "UTF-8";
::-webkit-scrollbar{width:8px;background:#e6e9ed}
::-webkit-scrollbar-track{border-radius:10px}
::-webkit-scrollbar-thumb{border-radius:10px;background:#c4cad1}
::-webkit-scrollbar-thumb:window-inactive{background:rgba(0,0,0,.3)}
*{margin:0;padding:0;list-style:none}
body,html{box-sizing:border-box;font-family:PingFangSC-Regular,Microsoft YaHei,Arial,sans-serif!important;line-height:1.5;background:#f3f5f7}
blockquote,body,button,dd,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,hr,input,legend,li,ol,p,pre,td,textarea,th,ul{margin:0;padding:0}
.overflow-hidden{overflow:hidden!important}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400}
address,cite,dfn,em,var{font-style:normal}
code,kbd,pre,samp{font-family:courier new,courier,monospace}
small{font-size:12px}
ol,ul{list-style:none}
legend{color:#000}
fieldset,img{border:0}
button,input,select,textarea{font-size:100%}
table{border-collapse:collapse;border-spacing:0;font-size:inherit}
button,input,select,textarea{font:15px/25px "Open Sans",Arial,"Hiragino Sans GB","Microsoft YaHei",STHeiti,"WenQuanYi Micro Hei",SimSun,sans-serif;color:#333}
input,select,textarea{font-size:100%;outline:0}
button{cursor:pointer;outline:0}
a{text-decoration:none;color:inherit;outline:0}
a:hover{text-decoration:none}
a:focus{outline:0}
.two-line-hide{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
input::-ms-clear{display:none}
input[type=password]::-ms-reveal{display:none}
a{display:inline-block;text-decoration:none}
a:visited{text-decoration:none}
.flex{display:flex}
.fl_ac{display:flex;align-items:center}
.fl_center{display:flex;align-items:center;justify-content:center}
.pc-page{position:relative}
.width-1200{width:1200px}
#header{position:fixed;top:0;z-index:1000;color:#fff;width:100vw;height:80px;transition:all .2s ease}
#header .header-inner{display:flex;width:1200px;height:inherit;justify-content:space-between;align-items:center;margin:0 auto}
#header .nav-logo{display:none;width:121px;height:44px}
#header .wlogo{ display:block}
#header .header-nav{display:flex;height:inherit}
#header .nav-linktag{color:#FFF;font-size:16px;transition:all .2s ease;display:flex;align-items:center;height:100%;margin:0 24px;position:relative;border-bottom:4px solid transparent}
#header .nav-item .nav-linktag.active{color:#2e8bff;border-bottom:4px solid #2e8bff}
#header .nav-item:hover .nav-linktag{color:#2e8bff}
#header .loginBtn .login{background:#fff;color:#2e8bff;transition:all .2s ease}
#header.active{background:#fff;border-color:#e2e2e2;box-shadow:0 8px 20px rgba(26,58,129,.1)}
#header.active .nav-linktag{color:#333;font-weight:400}
#header.active .nav-linktag.active{color:#2e8bff}
#header.active .nav-item:hover .nav-linktag{color:#2e8bff}
#header.active .nav-item:hover .nav-btn{color:#fff}
#header.active .nav-item:hover .has-more{border-color:#2e8bff}
#header.active .nav-linktag .has-more{border-color:#999}
#header.active .nav-linktag.active .has-more{border-color:#2e8bff}
#header .nav-item{display:flex;align-items:center}
#header .nav-item .nav-btn{width:120px;height:44px;border-radius:4px;background:#2e8bff;color:#fff;font-size:16px;line-height:44px;padding:0;font-weight:600;text-align:center;display:inline-block;border:none!important;margin-right:0}
#header .nav-item:hover .nav-btn{color:#fff;cursor:pointer}
#header.active .nav-btn{color:#fff;background:#2e8bff}
#header.active .nav-logo{display:block;}
#header.active  .wlogo{ display:none}
#header .nav-item .slide-nav{position:absolute;top:80px;left:0;width:100vw;background:#fff;box-shadow:0 8px 15px rgba(26,58,129,.03);transition:height .3s ease;overflow:hidden;height:0}
#header .nav-item:hover .slide-nav{height:160px}
#header .nav-item:hover .slide-nav.app{height:407px}
#header .slide-nav-inner{width:1200px;margin:50px auto 60px}
#header .slide-nav-ls{display:flex}
#header .slide-nav-item{width:254px}
#header .slide-nav-title{transition:color .2s ease;font-weight:400;line-height:22px;margin-bottom:8px;font-size:16px;color:#333}
#header .slide-nav-desc{line-height:20px;font-size:14px;color:#999}
#header .slide-nav-item:hover .slide-nav-title{color:#2e8bff}
#header .slide-nav.app .slide-nav-inner{display:flex;justify-content:space-between}
#header .slide-nav.app .slide-nav-header{position:relative;width:100%;line-height:20px;padding-bottom:16px;border-bottom:1px solid #e5e5e5;padding-left:16px;font-size:14px;color:#86909c}
#header .slide-nav.app .slide-nav-header::before{content:"";position:absolute;left:0;top:2px;width:3px;height:16px;background:#2e8bff}
#header .slide-nav.app .slide-nav-box{margin-top:30px;display:flex}
#header .slide-nav.app .slide-nav-ls{width:120px;margin-right:40px;display:block}
#header .slide-nav.app .slide-nav-ls:last-child{margin-right:0}
#header .slide-nav.app .slide-nav-item{margin-bottom:30px;width:inherit}
#header .slide-nav.app .slide-nav-item:last-child{margin-bottom:0}
#header .slide-nav.app .slide-nav-item a{display:block;line-height:22px;font-size:16px;color:#333;transition:color .2s ease}
#header .slide-nav.app .slide-nav-item a:hover{color:#2e8bff}
.top-banner{height:500px;background:linear-gradient(90deg,#d7e2f8 0,#d7e2f8 7.62%,#ecedf3 91.15%,#e7eaef 100%);overflow:hidden}
.top-banner .swiper-slide{height:500px!important}
.top-banner .swiper-slide .home-slide{height:500px}
.top-banner .swiper-slide .home-slide-bg{width:100%;height:500px;background-size:cover}
.top-banner .swiper-slide img{object-fit:cover;width:100%}
.top-banner .swiper-slide .home-slide .texts{position:absolute;width:1200px;top:200px;margin:auto}
.top-banner .swiper-slide .home-slide .title{font-style:normal;font-weight:600;font-size:30px;line-height:38px;color:#272e3b}
.top-banner .swiper-slide .home-slide .sub-title{font-style:normal;font-weight:600;font-size:30px;line-height:38px;color:#272e3b;margin-top:12px;margin-bottom:20px}
.top-banner .swiper-slide .home-slide .desc{font-style:normal;font-weight:400;font-size:18px;line-height:32px;color:#86909c}
.top-banner .swiper-slide .home-slide .btn{width:180px;height:56px;background:#2e8bff;border-radius:4px;font-style:normal;font-weight:600;font-size:18px;color:#fff;text-align:center;margin-top:36px;margin-right:12px;border:2px solid #2e8bff;box-sizing:border-box;cursor:pointer}
.top-banner .swiper-slide .home-slide .ghost{background:0 0;color:#2e8bff;position:relative}
.swiper{overflow:visible!important}
.top-banner .swiper-slide .home-slide .ghost:hover .miniprogram-pop{transform:scale(1)}
.top-banner .swiper-slide .home-slide .ghost .miniprogram-pop{transform:scale(0);transform-origin:left center;position:absolute;padding:20px;font-weight:600;font-size:14px;line-height:22px;text-align:center;color:#272e3b;background:#fff;box-shadow:0 0 40px rgba(26,58,129,.1);border-radius:10px;top:-100px;right:-230px;transition:all .2s ease-in-out .1s}
.top-banner .swiper-slide .home-slide .ghost .miniprogram-pop img{width:160px;height:160px;margin-bottom:20px}
.top-banner .swiper-slide .home-slide .ghost .miniprogram-pop:before{content:'';width:15px;height:15px;position:absolute;top:50%;left:-12px;transform:rotate(45deg) translateY(-50%);background:#fff}
.top-banner .swiper-pagination{bottom:30px!important}
.top-banner .swiper-pagination-bullet{background:#2e8bff!important;opacity:.2;width:60px;height:6px;border-radius:0;margin:0 12px;transform:scale(1)!important;left:unset!important}
.top-banner .swiper-pagination-bullet-active{opacity:1}
.swiper-pagination-custom,.swiper-pagination-fraction,.top-banner .swiper-container-horizontal>.swiper-pagination-bullets{bottom:20px}

.service { height: 647px; padding-top: 80px; position: relative; overflow: hidden; }
.service-bg { position: absolute; z-index: 0; width: 100vw; min-width: 1980px; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; }
.service .inner-width { position: relative; z-index: 1; }
.service .inner-width .home-sec-title { color: #fff; }
.service-container { width: 1200px; height: 343px; position: relative; }
.service-vessel { background: rgba(255, 255, 255, 0.15); width: 1200px; height: 343px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-top: 70px; }
.service-item { width: 300px; height: 343px; padding-top: 64px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; }
.service-iconbox { height: 72px; width: 72px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-bottom: 6px; }
.service-iconbox .service-icon { display: block; }
.service-title { height: 60px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; position: relative; font-size: 22px; color: #fff; }
.service-title::before { content: ''; position: absolute; width: 40px; height: 4px; background: #2e8bff; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); bottom: -4px; }
.service-desc { margin-top: 35px; line-height: 25px; font-size: 16px; color: #fff; width: 220px; text-align: center; }

.service-active-vessel { background: #2e8bff; margin-top: 0; }
.service-active-vessel .service-title::before { background: #fff; }

.service-slider { position: absolute; -webkit-transition: all .8s ease; -o-transition: all .8s ease; transition: all .8s ease; top: 0; left: 0; width: 300px; height: 343px; overflow: hidden; }
.service-slider .service-active-vessel { position: absolute; top: 0; left: 0; -webkit-transition: all .8s ease; -o-transition: all .8s ease; transition: all .8s ease; }



.footer{background:#3d3e4a;width:100%;color:#fff;font-size:14px;position:relative;z-index:1}
.footer .wrapper{padding:40px 0 0;align-items:center}
.footer a{color:#c9cdd4}
.footer a:hover{text-decoration:underline}
.footer .info{display:flex;width:1200px;margin:auto }
.footer .info-left{width:300px;border-right:1px solid rgba(255,255,255,.1);}
.footer .info-left .info-logo img{width:140px}
.footer .info-sign{margin-top:12px;font-style:normal;font-weight:400;font-size:14px;line-height:22px;color:#fff;margin-bottom:30px}
.footer .info-tel{display:flex;align-items:center;margin-bottom:10px}
.footer .info-tel .tel-icon{width:20px}
.footer .info-tel .tel-icon img{width:14px}
.footer .info-tel .tel-text{flex:1;margin-left:10px;font-style:normal;font-weight:400;font-size:16px;line-height:24px;color:#c9cdd4}
.footer .center-menu{margin-left:90px;width:110px;display:inline-block}
.footer .ewm{ width:400px;}
.footer .ewm ul{ display: flex;}
.footer .ewm li{ flex:1; text-align: center;}
.footer .ewm li img{width:150px}
.footer .menu-title a{font-style:normal;font-weight:600;font-size:16px;line-height:24px;color:#fff}
.footer .menu-list{margin-top:30px}
.footer .menu-list li{margin-top:12px}
.footer .menu-list li a{font-style:normal;font-weight:400;font-size:14px;line-height:22px;color:#c9cdd4}
.footer .right-title{font-style:normal;font-weight:600;font-size:16px;line-height:24px;color:#fff;text-align:left}
.footer .right-list{margin-top:30px;display:flex;justify-content:space-between}
.footer .right-item{width:90px;text-align:center}
.footer .right-item .item-qrcode img{width:90px;height:90px}
.footer .right-item .item-text{margin-top:8px;font-style:normal;font-weight:400;font-size:12px;line-height:17px;color:#c9cdd4}
.footer .copyright{display:flex;height:80px;line-height:80px;font-style:normal;font-weight:400;font-size:12px;color:#c9cdd4;width:1200px;margin:0 auto; justify-content:center;}
.footer .copyright .copyright-right a{margin-left:20px;display:inline-block;position:relative}
.footer .copyright .copyright-right a:not(:first-child):before{content:'';height:12px;width:1px;background:#c9cdd4;position:absolute;left:-10px;top:50%;transform:translateY(-50%)}
.common-float-win div{box-sizing:border-box}
.common-float-win{position:fixed;z-index:100;right:0;bottom:150px;height:212px}
.common-float-win .common-float-item{width:100px;height:100px;background-color:#fff;background-position:center 18px;background-repeat:no-repeat;border-top-left-radius:10px;border-bottom-left-radius:10px;transition:all .2s ease;cursor:pointer;position:relative;box-shadow:0 2px 10px rgba(26,58,129,.1);background-size:42px 36px;padding-top:18px}
.common-float-win .common-float-item.float-tel .hover-floatwin{height:100px;width:184px;left:-192px}
.common-float-icon{display:block;margin:0 auto;transition:all .2s ease}
.common-float-name{font-size:16px;margin-top:10px;color:#333;font-weight:700;text-align:center;transition:color .2s ease}
.common-float-win .common-float-item:hover{background:linear-gradient(89.99deg,#509dff -3.75%,#0071ff 99.44%),#fff}
.common-float-win .common-float-item:hover .common-float-name{color:#fff}
.common-float-item .float-icon{width:42px;height:36px;margin:0 auto;display:block}
.common-float-item .float-icon1{display:none}
.common-float-item:hover .float-icon{display:none}
.common-float-item:hover .float-icon1{display:block}
.common-float-item.back-top{margin-top:12px;padding:0;height:30px;background:#fff;transition:all .2s ease;border:unset;display:flex;align-items:center;justify-content:center;height:0;overflow:hidden}
.common-float-item.back-top.show{height:40px;line-height:40px}
.common-float-item.back-top:hover{transform:scale(1.04);background:#fff}
.common-float-item .hover-floatwin{width:170px;padding:20px 0;position:absolute;top:0;left:-182px;border-radius:10px;background:#fff;transition:display .2s ease;display:none;z-index:-1;box-shadow:0 0 40px rgba(26,58,129,.1)}
.common-float-item .hover-floatwin-img{display:block;margin:0 auto 20px;width:130px;height:130px}
.common-float-item .hover-floatwin-desc{line-height:21px;color:#333;font-size:14px;font-weight:900;text-align:center}
.common-float-item .hover-floatwin-title{font-style:normal;font-weight:600;font-size:14px;line-height:22px;color:#272e3b}
.common-float-item .hover-floatwin-tel{font-style:normal;font-weight:600;font-size:20px;line-height:28px;color:#2e8bff;margin-top:8px}
.common-float-item:hover .hover-floatwin{display:block;z-index:1}
.detail{margin-top:100px}
.detail-wrap{width:1200px;margin:auto;padding-bottom:100px}
.detail-wrap p{font-size:14px;line-height:22px;margin-bottom:10px}
.detail-wrap .sub-title{font-style:normal;font-weight:600;font-size:18px;line-height:25px;color:#4e5969;padding-bottom:10px;padding-top:10px}
.detail-wrap .title{font-style:normal;font-weight:600;font-size:26px;line-height:38px;text-align:center;padding-top:40px;padding-bottom:40px}
.home-sec *{-webkit-box-sizing:border-box;box-sizing:border-box}
.home-sec{-webkit-box-sizing:border-box;box-sizing:border-box}
.inner-width{width:80%;max-width:1200px;margin:0 auto}
.home-sec{margin:0 auto}
.animate-item{transform:translateY(80px) scale(.96);opacity:0;transition:all 1s ease .2s}
.animate-item.show{transform:translateY(0) scale(1);opacity:1}
.animate-item.static-show{transform:translateY(0) scale(1);opacity:1;transition:unset}
.home-sec-title{height:42px;line-height:42px;color:#272e3b;font-size:30px;font-weight:700;text-align:center}
.home-sec-desc{margin-top:20px;height:28px;line-height:28px;font-size:20px;text-align:center;color:#86909c}
.system{padding:80px 0 117px;height:810px;background:url(../images/bg.png) no-repeat;background-size:100% 100%}
.system .wrapper{padding-top:87px}
.system .list{position:relative;height:436px;display:inline-block;margin-right:20px;width:285px;background:#fff;box-shadow:0 0 40px rgba(26,58,129,.15);border-radius:10px;-webkit-transition:height .6s,margin .6s;transition:height .6s,margin .6s;-o-transition:height .6s,margin .6s;transition:height .6s,margin .6s;transition:height .6s,margin .6s}
.system .list:last-child{margin-right:0}
.system .list:hover{height:470px;margin-top:-17px}
.system .list .header{position:relative;padding:20px 30px;width:100%;height:80px}
.system .list .header img{position:absolute;top:0;left:0;bottom:0;width:100%}
.system .list .header .head-title{position:relative;z-index:10;font-size:20px;font-weight:700;color:#fff;line-height:28px}
.system .list .header .head-title:after{display:block;content:" ";box-sizing:border-box;width:28px;height:3px;background:#fff;border-radius:10px;position:absolute;left:0;bottom:-12px}
.system .list .list-item{padding-top:10px;font-size:16px;font-weight:700;color:#333}
.system .list .list-item li:hover{background:#f6f7ff}
.system .list .list-item li{padding:13px 26px 14px}
.system .list .list-item .tips{margin-top:8px;font-size:14px;line-height:22px;font-weight:400;color:#86909c;word-break:break-all;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}
.system .list .more{position:absolute;bottom:0;left:0;right:0;opacity:0;justify-content:space-between;padding:15px 18px 15px 26px;font-weight:700;font-size:14px;color:#2e8bff;align-items:center;background:#e4e8ff;border-bottom-left-radius:10px;border-bottom-right-radius:10px;cursor:pointer}
.system .list .more{-webkit-transition:-webkit-opacity .6s;transition:-webkit-opacity .6s;-o-transition:opacity .6s;transition:opacity .6s;transition:opacity .6s,-webkit-opacity .6s}
.system .list:hover .more{opacity:1}
.situation{padding-top:80px;padding-bottom:60px;overflow-x:hidden;overflow-y:hidden;background:transparent url(../images/bg.png) no-repeat;background-size:100% 100%}
.situation .swiper-tab{margin-top:72px;margin-bottom:40px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;border-bottom:1px solid #c9cdd4}
.situation .swiper-tabitem{line-height:24px;width:240px;text-align:center;position:relative;font-size:16px;font-weight:600;color:#272e3b;cursor:pointer;padding-bottom:20px}
.situation .swiper-tabitem:last-child{margin-right:0}
.situation .swiper-tabitem::before{content:"";width:0;height:3px;background:#2e8bff;position:absolute;bottom:0;left:50%;transform:translateX(-50%);-webkit-transition:width .3s ease;-o-transition:width .3s ease;transition:width .3s ease}
.situation .swiper-tabitem.active::before{width:120px}
.situation .swiper-box{position:relative;width:1200px;height:400px;margin:50px auto 0}
.situation .swiper-box .after,.situation .swiper-box .before{height:400px;width:999em;content:"";position:absolute;top:0;right:1200px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;overflow:hidden;z-index:20;cursor:pointer}
.situation .swiper-box .after{left:1200px}
.situation .swiper-box .after::before,.situation .swiper-box .before::before{content:"";display:block;width:1200px;height:400px;background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(26.74%,#fff));background:-webkit-linear-gradient(left,rgba(255,255,255,0) 0,#fff 26.74%);background:-o-linear-gradient(left,rgba(255,255,255,0) 0,#fff 26.74%);background:linear-gradient(to right,rgba(255,255,255,0) 0,#fff 26.74%)}
.situation .swiper-box .after::after,.situation .swiper-box .before::after{content:"";display:block;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;height:400px;background:#fff}
.situation .swiper-box .before::before{width:unset;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;background:#fff}
.situation .swiper-box .before::after{width:1200px;-webkit-box-flex:unset;-webkit-flex:unset;-ms-flex:unset;flex:unset;background:-webkit-gradient(linear,right top,left top,from(rgba(255,255,255,0)),color-stop(26.74%,#fff));background:-webkit-linear-gradient(right,rgba(255,255,255,0) 0,#fff 26.74%);background:-o-linear-gradient(right,rgba(255,255,255,0) 0,#fff 26.74%);background:linear-gradient(to left,rgba(255,255,255,0) 0,#fff 26.74%)}
.situation .swiper-container{overflow:visible!important;width:800px;height:435px}
.situation .swiper-container .swiper-wrapper .swiper-slide{opacity:.5;width:800px;border-radius:10px;background:0 0}
.situation .swiper-container .swiper-wrapper .swiper-slide-active{opacity:1}
.situation .swiper-vessel-item{width:800px;height:400px;position:relative;overflow:hidden;border-radius:10px}
.situation .swiper-bg{height:100%;position:absolute;display:block;top:0;left:0;z-index:0;opacity:.5}
.situation .swiper-vessel-item.active .swiper-bg{opacity:1}
.situation .tip{line-height:1;font-size:14px;font-weight:400}
.situation .situation-intro{margin:50px 55px 95px;position:relative;z-index:10}
.situation .situation-title{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;height:44px;line-height:44px;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;font-size:24px;color:#fff}
.situation .situation-title .situation-icon{display:block;margin-right:16px}
.situation .situation-desc,.situation .situation-desc1{margin-top:20px;line-height:28px;font-size:16px;color:#fff}
.situation .situation-desc1{margin-top:6px}
.situation .situation-ls{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;margin-top:60px}
.situation .situation-item{text-align:center;font-size:20px;color:#fff;width:260px}
.situation .situation-item img{margin:0 auto 25px}
.situation .situation-more{position:absolute;z-index:1;border-radius:4px;background:#fff;bottom:40px;right:70px;width:120px;height:44px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;font-size:16px;font-weight:700;color:#fb6638;-webkit-transition:all .2s ease;-o-transition:all .2s ease;transition:all .2s ease}
.situation .situation-more:hover{background:#fff4f0}
.situation .swiper-box{position:relative;width:800px;height:400px;margin:50px auto 0}
.situation .swiper-box .after,.situation .swiper-box .before{height:400px;width:999em;content:"";position:absolute;top:0;right:840px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;overflow:hidden;z-index:20;cursor:pointer}
.situation .swiper-box .after{left:840px}
.situation .swiper-box .after::before,.situation .swiper-box .before::before{content:"";display:block;width:800px;height:400px;background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(26.74%,rgba(0,0,0,.3)));background:-webkit-linear-gradient(left,rgba(255,255,255,0) 0,rgba(0,0,0,.3) 26.74%);background:-o-linear-gradient(left,rgba(255,255,255,0) 0,rgba(0,0,0,.3) 26.74%);background:linear-gradient(to right,rgba(255,255,255,0) 0,rgba(0,0,0,.3) 26.74%)}
.situation .swiper-box .after::after,.situation .swiper-box .before::after{content:"";display:block;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;height:400px;background:#fff}
.situation .swiper-box .before::before{width:unset;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;background:rgba(0,0,0,.3)}
.situation .swiper-box .before::after{width:800px;-webkit-box-flex:unset;-webkit-flex:unset;-ms-flex:unset;flex:unset;background:-webkit-gradient(linear,right top,left top,from(rgba(255,255,255,0)),color-stop(26.74%,rgba(0,0,0,.1)));background:-webkit-linear-gradient(right,rgba(255,255,255,0) 0,rgba(0,0,0,.3) 26.74%);background:-o-linear-gradient(right,rgba(255,255,255,0) 0,rgba(0,0,0,.3) 26.74%);background:linear-gradient(to left,rgba(255,255,255,0) 0,rgba(0,0,0,.3) 26.74%)}
.situation .swiper-vessel{width:2500px;height:400px;-webkit-transition:left .8s ease;-o-transition:left .8s ease;transition:left .8s ease;position:absolute;top:0;left:-800px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}
.situation .occupy-item-left,.situation .occupy-item-right{position:absolute!important;top:0;right:-840px}
.situation .occupy-item-left{left:-840px}
.feature{padding-top:90px;background:#fff}
.feature .feat-ls{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}
.feature .feat-ls:first-of-type{margin-top:90px}
.feature .feat-item{width:240px;text-align:center;margin-bottom:50px}
.feature .feat-item .feat-icon{width:140px;height:210px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;margin:0 auto}
.feature .feat-item .feat-icon .feat-img{display:block;width:155px}
.feature .feat-item .feat-title{line-height:30px;font-size:20px;color:#272e3b;margin-top:30px;font-weight:600}
.feature .feat-item .feat-desc{line-height:24px;font-size:14px;color:#86909c;margin-top:10px}
.business{padding-top:140px;padding-bottom:90px;height:800px;position:relative;overflow:hidden}
.business-bg{position:absolute;z-index:0;width:100vw;min-width:1980px;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-transition:all .5s ease;-o-transition:all .5s ease;transition:all .5s ease}
.business .inner-width{position:relative;z-index:1}
.business .home-sec-title{color:#fff;height:54px;line-height:54px}
#businessTitle{color:#333}
.business-container{position:relative;margin-top:56px;height:490px;border-radius:10px;box-shadow:0 0 40px rgba(26,58,129,.15)}
.business-container .business-tabbar{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;background:#2e8bff;border-top-left-radius:11px;border-top-right-radius:11px}
.business-container .tab-item{flex:1;display:flex;justify-content:space-between;align-items:center;padding:24px 32px 12px;font-size:22px;position:relative;color:#fff;line-height:60px;cursor:pointer;font-weight:700;white-space:nowrap}
.business-container .tab-item .icon{display:block;height:66px}
.business-container .tab-item .icon1{width:70px;background:url(../images/1.png) no-repeat;background-size:100% 100%}
.business-container .tab-item.active .icon1{background:url(../images/1-1.png) no-repeat;background-size:100% 100%}
.business-container .tab-item .icon2{width:75px;background:url(../images/2.png) no-repeat;background-size:100% 100%}
.business-container .tab-item.active .icon2{background:url(../images/2-1.png) no-repeat;background-size:100% 100%}
.business-container .tab-item .icon3{width:69px;background:url(../images/3.png) no-repeat;background-size:100% 100%}
.business-container .tab-item.active .icon3{background:url(../images/3-1.png) no-repeat;background-size:100% 100%}
.business-container .tab-item.active{background:#fff;color:#333;border-top-left-radius:10px;border-top-right-radius:10px}
.business-container .business-descbox{position:absolute;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;left:0;top:102px;width:1200px;opacity:0;padding:60px 70px 80px;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-transition:opacity .6s ease;-o-transition:opacity .6s ease;transition:opacity .6s ease;border-radius:10px}
.business-container .business-descbox.active{opacity:1;z-index:1;padding-top:60px;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}
.business-container .business-descbox-info{flex:1}
.business-container .business-descbox-info .business-title{height:48px;line-height:48px;font-size:24px;color:#fff;margin-bottom:18px}
.business-container .business-descbox-info .business-desc{line-height:30px;font-size:16px;color:#86909c;width:100%;margin-bottom:32px}
.business-container .business-descbox-info .business-desc.wholesaler{display:flex;color:#333;font-size:20px;margin-bottom:20px}
.business-container .business-descbox-info .business-desc.wholesaler span{flex:1;width:115px}
.business-container .business-descbox-info .business-desc.group{width:760px}
.business-container .business-feat{margin-top:60px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}
.business-container .business-feat-item{margin-right:30px;width:115px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}
.business-container .business-feat-item .business-feat-iconbox{width:50px;height:50px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center}
.business-container .business-feat-item .business-feat-icon{display:block}
.business-container .business-feat-item .business-feat-title{height:26px;font-size:14px;line-height:26px;color:#fff;text-align:center;margin-top:32px;white-space:nowrap}
.business-container .business-descbox-img{width:360px;height:290px;overflow:hidden;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;border-radius:10px}
.business-container .business-descbox-img .img{display:block;-webkit-transition:-webkit-transform .6s ease;transition:-webkit-transform .6s ease;-o-transition:transform .6s ease;transition:transform .6s ease;transition:transform .6s ease,-webkit-transform .6s ease}
.business-container .business-descbox-img .img:hover{-webkit-transform:scale(1.04);-ms-transform:scale(1.04);transform:scale(1.04)}
.us{padding:80px 0;background:url(../images/bg.png) no-repeat;background-size:100% 100%}
.us .wrapper{padding-top:90px;display:flex;justify-content:space-around}
.us .us-item{flex:1;border-radius:10px;overflow:hidden}
.us .us-item img{max-width:370px;width:100%;display:block;height:auto}
.us .us-item:nth-child(2){margin:0 45px}
.us .us-item p{background:#fff;color:#272e3b;font-size:20px;font-weight:700;height:90px;line-height:90px;text-align:center}
.introduce{padding:109px 0 90px;box-sizing:border-box;background:#fff}
.introduce-content{display:flex;flex-wrap:wrap}
.introduce-content-item{display:flex;align-items:center;width:calc(50% - 34px);height:146px;background:#fff;border-radius:10px;box-shadow:0 0 40px rgba(26,58,129,.1);padding:0 30px;box-sizing:border-box}
.introduce-content-item:last-child,.introduce-content-item:nth-child(2){margin-left:60px}
.introduce-content-item img{height:60px;width:60px;margin-right:31px}
.introduce-content-item .subtitle p,.introduce-content-item .subtitle span{font-weight:400;font-size:16px;line-height:28px;color:#86909c;padding-top:12px}
.introduce-content-item .subtitle p span{padding-left:10px}
.introduce-content-item .subtitle span{font-weight:700;font-size:24px;line-height:34px;color:#272e3b}
.sales{padding-top:80px;height:830px;background:#f5f9ff;position:relative}
.sales .sales-bg-left{position:absolute;z-index:0;left:0;bottom:0}
.sales .sales-bg-right{position:absolute;z-index:0;right:0;top:0}
.sales .sales-box{width:1200px;height:453px;position:relative;z-index:1;margin-top:70px}
.sales .sales-box .sales-vessel{width:1200px;height:453px;position:absolute;top:0;left:0;opacity:0;-webkit-transition:opacity .6s ease;-o-transition:opacity .6s ease;transition:opacity .6s ease;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}
.sales .sales-box .sales-vessel.active{opacity:1;z-index:1}
.sales .sales-box .sales-item{width:380px;height:131px;border-radius:10px;background:#fff;-webkit-transition:-webkit-box-shadow .2s ease;transition:-webkit-box-shadow .2s ease;-o-transition:box-shadow .2s ease;transition:box-shadow .2s ease;transition:box-shadow .2s ease,-webkit-box-shadow .2s ease;padding:22px 20px;margin-bottom:20px;margin-right:30px}
.sales .sales-box .sales-item:nth-of-type(3n){margin-right:0}
.sales .sales-box .sales-item:hover{-webkit-box-shadow:0 8px 20px rgba(26,58,129,.1);box-shadow:0 8px 20px rgba(26,58,129,.1)}
.sales .sales-box .sales-item .sales-title{height:38px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;font-size:20px;color:#333}
.sales .sales-box .sales-item .sales-title .sales-iconbox{width:45px;height:45px;margin-right:12px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center}
.sales .sales-box .sales-item .sales-title .sales-icon{width:45px;height:45px;display:block}
.sales .sales-box .sales-item .sales-desc{margin-top:12px;line-height:32px;color:#86909c;font-size:14px}
.sales-btn{width:40px;height:80px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;opacity:1;-webkit-transition:all .2s ease;-o-transition:all .2s ease;transition:all .2s ease;position:absolute;top:180px;right:-90px;border-radius:4px;cursor:pointer}
.sales-btn.sales-btn-left{left:-90px;-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}
.sales-btn:hover{transform:scale(1.06)}
.sales-btn.sales-btn-left:hover{transform:rotate(180deg) scale(1.06)}
.sales-btn.forbid{opacity:0;cursor:unset}
.sales-more-btn{width:190px;height:44px;border-radius:4px;background:linear-gradient(90deg,#ff6533 0,#f53d2d 100%);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;color:#fff;font-size:16px;-webkit-transition:background .2s ease;-o-transition:background .2s ease;transition:background .2s ease;margin:50px auto 0;position:relative;z-index:10}
.sales-more-btn:hover{background:linear-gradient(90deg,rgba(255,101,51,.85) 0,rgba(245,61,45,.85) 100%),#fff;color:#fff}
#salesTitle{color:#333}
#business .sales-more-btn{width:130px;position:absolute;right:70px;bottom:35px}
.scene{padding-top:80px;overflow-x:hidden;overflow-y:hidden;background:#fff;background-size:100% 100%;position:relative}
@keyframes FadeIn{0%{opacity:0;height:initial}
100%{opacity:1;height:initial}
}
@keyframes FadeOut{0%{opacity:1;height:initial}
99%{opacity:0;height:initial}
100%{height:0;opacity:0;height:0}
}
.scene .bg{position:absolute;width:100%;left:0;right:0;height:330px!important;display:flex;top:287px}
.scene .bg .bg-right{width:50%;background-repeat:no-repeat;background-position:center;background-size:cover;display:none;animation:FadeOut .3s ease-in-out}
.scene .bg .bg-right.active{display:block;animation:FadeIn .3s ease-in-out}
.scene .bg .bg-left{background-image:url(../images/bg1.png);background-repeat:no-repeat;background-position:center;background-size:cover;width:50%}
.scene .inner-width{width:100%;max-width:100%}
.scene .swiper-tab{width:1200px;margin:auto;margin-top:80px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;border-bottom:1px solid #e5e6eb}
.scene .swiper-tabitem{width:300px;text-align:center;position:relative;font-size:16px;color:#272e3b;cursor:pointer;padding-bottom:20px}
.scene .swiper-tabitem.active{font-weight:600;color:#2e8bff}
.scene .swiper-tabitem::before{content:"";width:0;height:3px;background:#2e8bff;position:absolute;bottom:0;left:50%;transform:translateX(-50%);-webkit-transition:width .3s ease;-o-transition:width .3s ease;transition:width .3s ease}
.scene .swiper-tabitem.active::before{width:100%}
.scene .swiper-box{position:relative;width:1200px;height:330px;margin:40px auto 0}
.scene .swiper-slide{display:none;transition:.3s ease;animation:FadeOut 1s ease-in-out}
.scene .swiper-slide.active{display:block;animation:FadeIn 1s ease-in-out}
.scene .swiper-vessel{width:1200px;height:330px;-webkit-transition:left .6s ease;-o-transition:left .6s ease;transition:left .6s ease;position:absolute;top:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}
.scene .swiper-vessel-item{width:100%;height:330px;position:relative;overflow:hidden;display:flex}
.scene .swiper-vessel-item .scene-img,.scene .swiper-vessel-item .scene-intro{width:50%}
.scene .swiper-vessel-item .scene-img{background-size:auto;background-position:center}
.scene .swiper-vessel-item .scene-intro .intro-inner{margin-top:80px}
.scene .swiper-vessel-item .scene-intro .intro-inner .title{font-style:normal;font-weight:600;font-size:20px;line-height:28px;color:#fff}
.scene .swiper-vessel-item .scene-intro .intro-inner .sub-title{font-style:normal;font-weight:400;font-size:14px;line-height:22px;color:rgba(255,255,255,.6);margin-top:12px}
.scene .swiper-vessel-item .scene-intro .intro-inner .desc{margin-top:40px;position:relative;display:flex;align-items:center}
.scene .swiper-vessel-item .scene-intro .intro-inner .desc .desc-check{width:30px}
.scene .swiper-vessel-item .scene-intro .intro-inner .desc .desc-check img{width:17.4px}
.scene .swiper-vessel-item .scene-intro .intro-inner .desc .desc-text{font-style:normal;font-weight:400;font-size:16px;line-height:24px;color:#fff;flex:1}
.scene .swiper-vessel-item .scene-intro .intro-inner .desc.desc1{margin-top:20px}
.case{padding-top:80px;padding-bottom:56px;overflow-x:hidden;overflow-y:hidden;background:transparent url(../images/bg.png) no-repeat;background-size:100% 100%}
.case .case-container{margin-top:70px;width:1200px;display:flex;flex-wrap:wrap;justify-content:center}
.case .case-item{width:282px;height:224px;background:#fff;border-radius:10px;box-shadow:0 0 30px rgba(26,58,129,.04);text-align:center;margin-right:24px;margin-bottom:24px;cursor:pointer;overflow:hidden}
.case .case-item:nth-child(4n){margin-right:0}
.case .case-item:hover{background:#e3e7ff}
.case .case-item:hover .img,.case .case-item:hover .name{display:none;transition:.3s ease;animation:FadeOut .3s ease-in-out}
.case .case-item:hover .preview{display:block;animation:FadeIn .3s ease-in-out}
.case .case-item .preview{display:none}
.case .case-item .name,.case .case-item .text{font-style:normal;font-weight:600;font-size:16px;line-height:24px;color:#272e3b}
.case .case-item img{margin:auto;margin-top:20px;display:block}
.case .case-item .intro-title{margin-top:20px}
.tel-modal{width:450px;height:156px;position:fixed;top:45%;left:50%;transform:translateX(-50%) scale(0);transform-origin:center center;background:#fff;box-shadow:0 0 40px rgba(26,58,129,.1);border-radius:10px;padding:0 24px;box-sizing:border-box;z-index:1000;transition:all .2s ease-in-out}
.tel-modal.show{transform:translateX(-50%) scale(1)}
.tel-modal .portrait{width:120px;height:120px;object-fit:cover;margin:0 17px;background:#a7b2fc}
.tel-modal .texts{ display: flex; align-items: center;}
.tel-modal .texts i{  width:70px; height:70px; border-radius:50%; background:#E7F0FF; margin-right: 10px;}
.tel-modal .texts p{ font-size: 18px; font-weight: bold; color:#3B426B;}
.tel-modal .texts p span{ display: block;}
.tel-modal .title{font-weight:600;font-size:20px;line-height:28px;color:#272e3b}
.tel-modal .tel{font-weight:600;font-size:30px;line-height:38px;color:#2e8bff;margin-top:10px}
.tel-modal .close{width:20px;height:20px;position:absolute;right:18px;top:18px;cursor:pointer}
