:root{
    --subtitle--:#C1C1C1;
    --menu--:#303133;
    --blue--:#0066BB;;
    --font--:#606266;
    --yellow--:#FF6F1F;
    --foot--:#343434;
}
body{
    overflow-x:hidden;
}
@font-face {
	font-family: AlibabaPuHuiTi-2-45-Light;
	src:url(https://puhuiti.oss-cn-hangzhou.aliyuncs.com/AlibabaPuHuiTi-2/AlibabaPuHuiTi-2-45-Light/AlibabaPuHuiTi-2-45-Light.eot) format('embedded-opentype'),
    url(https://puhuiti.oss-cn-hangzhou.aliyuncs.com/AlibabaPuHuiTi-2/AlibabaPuHuiTi-2-45-Light/AlibabaPuHuiTi-2-45-Light.otf) format('opentype'),
    url(https://puhuiti.oss-cn-hangzhou.aliyuncs.com/AlibabaPuHuiTi-2/AlibabaPuHuiTi-2-45-Light/AlibabaPuHuiTi-2-45-Light.ttf) format('TrueType'),
    url(https://puhuiti.oss-cn-hangzhou.aliyuncs.com/AlibabaPuHuiTi-2/AlibabaPuHuiTi-2-45-Light/AlibabaPuHuiTi-2-45-Light.woff) format('woff'),
    url(https://puhuiti.oss-cn-hangzhou.aliyuncs.com/AlibabaPuHuiTi-2/AlibabaPuHuiTi-2-45-Light/AlibabaPuHuiTi-2-45-Light.woff2) format('woff2');
}
@font-face {
	font-family: AlibabaPuHuiTi-2-55-Regular;
	src:url(https://puhuiti.oss-cn-hangzhou.aliyuncs.com/AlibabaPuHuiTi-2/AlibabaPuHuiTi-2-55-Regular/AlibabaPuHuiTi-2-55-Regular.eot) format('embedded-opentype'),
    url(https://puhuiti.oss-cn-hangzhou.aliyuncs.com/AlibabaPuHuiTi-2/AlibabaPuHuiTi-2-55-Regular/AlibabaPuHuiTi-2-55-Regular.otf) format('opentype'),
    url(https://puhuiti.oss-cn-hangzhou.aliyuncs.com/AlibabaPuHuiTi-2/AlibabaPuHuiTi-2-55-Regular/AlibabaPuHuiTi-2-55-Regular.ttf) format('TrueType'),
    url(https://puhuiti.oss-cn-hangzhou.aliyuncs.com/AlibabaPuHuiTi-2/AlibabaPuHuiTi-2-55-Regular/AlibabaPuHuiTi-2-55-Regular.woff) format('woff'),
    url(https://puhuiti.oss-cn-hangzhou.aliyuncs.com/AlibabaPuHuiTi-2/AlibabaPuHuiTi-2-55-Regular/AlibabaPuHuiTi-2-55-Regular.woff2) format('woff2');
}
@font-face {
    font-family:Poppins-Medium;
    src:url('../font/Poppins-Medium.ttf')
}
@font-face {
    font-family:DINPro-Medium;
    src:url('../font/DINPro-Medium.ttf')
}
*{
    box-sizing: border-box;
    padding:0;
    margin:0;
    font-family:'AlibabaPuHuiTi-2-45-Light','微软雅黑','Arial','PingFang SC';
}
ul,li{
    list-style: none;
}
a:hover,
a{
    text-decoration: none;
    color:var(--menu--);
}
img{
    border:none;
    max-width:100%;
}
::selection {
    background:var(--blue--); 
    color:var(--foot--);
}   
::-moz-selection {
    background:var(--blue--); 
    color:var(--foot--);
}  
::-webkit-selection {
    background:var(--blue--); 
    color:var(--foot--);
}
.cl{
    clear: both;
}
.containers{
    max-width:1300px;
    margin:0 auto;
}
/* header */
.header{
    height:90px;
}
.header .containers{
    height:100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.logo{
    width:264px;
    height:43px;
}
.menu ul{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left:85px;
}
.menu ul li{
    width:106px;
    height:90px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right:10px;
}
.menu ul li:first-child{
    width:68px;
    margin-right:10px;
}
.menu ul li a{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width:100%;
    height:100%;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.02em;
    color: var(--menu--);
}
.menu ul li a::after{
    content: '';
    position: absolute;
    left:50%;
    bottom: 1px;
    width:0;
    height:3px;
    background: var(--blue--);
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
}
.menu ul li a:hover,
.menu ul li.on a{
    color:var(--blue--);
}
.menu ul li a:hover::after,
.menu ul li.on a::after{
    width:38px;
    opacity: 1;
}
.tool{
    position: relative;
    padding-left:32px;
}
.tool::before{
    content: '';
    width:24px;
    height:24px;
    background: url(../images/tel.svg) no-repeat center;
    background-size: cover;
    position: absolute;
    left:0;
    top:50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}
.tool a{
    font-family: 'DINPro-Medium';
    font-weight: 800;
    font-size: 22px;
    line-height: 24px;
    letter-spacing: 0.02em;
    color: #0066BB;
}

/* banner */
.banner-li{
    display: block;
    width:100%;
    height:660px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.banner-desc{
    position: absolute;
    top:300px;
    opacity: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    width:100%;
    transition: all 1s;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
}
.swiper-slide-active .banner-desc{
    top:120px;
    opacity: 1;
}
.banner-desc p{
    padding-top:10px;
    font-weight: 400;
    font-size: 24px;
    line-height: 34px;
    letter-spacing: 0.02em;
    color:#ffffff;
    text-align: center;
}
.banner-li .containers{
    height:100%;
    display:flex;
    align-items: flex-start;
    position: relative;
}
.banner .swiper-pagination{
    display: flex;
    align-items: center;
    justify-content: center;
    bottom: 27px;
}
.banner .swiper-pagination-bullet{
    background: #D9D9D9;
    width:10px;
    height:10px;
    opacity: 1;
    transition: all .2s;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -ms-transition: all .2s;
    -o-transition: all .2s;
}
.banner .swiper-pagination-bullet-active{
    width:12px;
    height:12px;
    border: 2px solid #E4E7ED;
    background: rgba(0, 0, 0, 0);
}
.tab{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.tab span{
    position: relative;
    padding-left:20px;
    font-family: 'AlibabaPuHuiTi-2-55-Regular';
    font-size: 42px;
    font-weight: bold;
    line-height: 59px;
    letter-spacing: 0.01em;
    color: #303133;
}
.tab span::before{
    content: '';
    position: absolute;
    top:50%;
    left:0;
    width:7px;
    height:7px;
    background: #0066BB;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}
.tab span::after{
    content: '';
    position: absolute;
    top:calc(50% - 7px);
    left:0;
    width:7px;
    height:7px;
    background: #FF6F1F;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}
.tab p{
    padding-left:26px;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    color: #606266;
}


/* product */
.product{
    height:840px;
    background: #f5fafd;
    padding-top:90px;
}
.product .containers{
    max-width:1192px;
}
.product-main{
    position: relative;
    margin-top:40px;
}
.product-side{
    position: absolute;
    top:-14px;
    right:0;
    z-index: 222;
    width:264px;
    height:200px;
    overflow: hidden;
}
.side-li div{
    width:264px;
    height:48px;
    line-height:48px;
    border-bottom: 1px solid #E6E4EF;
    position: relative;
    padding-left:20px;
}
.side-li div::before{
    content: '';
    position: absolute;
    top:50%;
    left:0;
    width:5px;
    height:5px;
    background: #0066BB;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}
.side-li div::after{
    content: '';
    position: absolute;
    right:14px;
    top:50%;
    width:15px;
    height:10px;
    background: url(../images/arrow.svg) no-repeat center;
    background-size: contain;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}
.side-li div a{
    position: relative;
    display: block;
    width:100%;
    height:100%;
    font-weight: 400;
    font-size: 15px;
    letter-spacing: 0.01em;
    color: var(--blue--);
}
.side-li div a::after{
    content: '';
    position: absolute;
    left:-20px;
    bottom: -1px;
    width:0px;
    height:1px;
    background: var(--yellow--);
    transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
}
.side-li:hover div a::after,
.side-li.slick-current div a::after{
    width:120px;
}
.side-li:hover div a,
.side-li.slick-current div a{
    color:var(--yellow--);
}
.side-li:hover div::before,
.side-li.slick-current div::before{
    background: var(--yellow--);
}
.side-li:hover div::after,
.side-li.slick-current div::after{
    background: url(../images/arrow-on.svg) no-repeat center;
}
.product-txt{
    position: absolute;
    top:200px;
    right:0;
    z-index:8888;
    width: 475px;
    height: 302px;
    overflow: hidden;
    padding:45px 48px;
    background: #ffffff;
}
.product-info{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 380px;
    height: 206px;
    overflow: hidden;
}
.product-info span{
    position: relative;
    display: block;
    padding-left:50px;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.01em;
    color: var(--blue--);
}
.product-info span::before{
    content: '';
    width:45px;
    height:1px;
    background: var(--blue--);
    position: absolute;
    left:0;
    top:50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}
.product-info b{
    display: block;
    padding:30px 0 10px 0;
    font-weight: 500;
    font-size: 28px;
    line-height: 39px;
    letter-spacing: 0.01em;
    color: #000000;
    word-break: break-all;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.product-info p{
    margin-bottom: 32px;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.02em;
    color: #606266;
    word-break: break-all;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.product-info a{
    position: relative;
    display: block;
    padding-right:24px;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.02em;
    color: #0066BB;
}
.product-info a::after{
    content: '';
    position: absolute;
    right:0;
    top:50%;
    width:15px;
    height:10px;
    background: url(../images/arrow-on.svg) no-repeat center;
    background-size: contain;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}
.product-ul,
.product-pic img{
    width:828px;
    height:541px;
}


/* about */
.about{
    height:964px;
    padding-bottom: 100px;
}
.about .containers{
    position: relative;
    height:100%;
    max-width: 1282px;
    padding-top:96px;
}
.about .containers::after{
    content: '';
    width:1602px;
    height:435px;
    background: url(../images/about-bg.jpg) no-repeat center;
    background-size: cover;
    position: absolute;
    left:0;
    bottom: 0px;
    z-index: -1;
}
.about-t{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.about-l{
    width:210px;
}
.about-desc{
    width:856px;
}
.about-desc p{
    font-weight: 400;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.02em;
    color: #303133;
    padding:8px 0 16px 0;
}
.about-more{
    width: 160px;
    height: 46px;
    margin:76px 0 0 23px;
}
.about-more a{
    width:100%;
    height:100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.02em;
    color: #0066BB;
    padding-left:24px;
    border: 1px solid #C1C6C9;
    transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
}
.about-more a:hover{
    color:#ffffff;
    background: #0066BB;
    border: 1px solid #0066BB;
}
.about-more a::after{
    content: '';
    position: absolute;
    right:18px;
    top:50%;
    width:15px;
    height:10px;
    background: url(../images/arrow-on.svg) no-repeat center;
    background-size: contain;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}
.about-more a:hover::after{
    background: url(../images/arrow-white.svg) no-repeat center;
    background-size: contain;
}
.about-info{
    display: flex;
    align-items:center;
    justify-content: flex-end;
    padding-top:25px;
}
.about-info li{
    width:200px;
    height:220px;
    background: #FFFFFF;
    box-shadow: 0px 0px 10px 2px rgba(0, 91, 172, 0.1);
    border-radius: 8px;
    margin-right:14px;
    transition: all .4s;
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -ms-transition: all .4s;
    -o-transition: all .4s;
}
.about-info li a{
    display: block;
    width:100%;
    height:100%;
    padding:26px 24px;
}
.about-info li.on{
    background: #0066BB;
    transform: translateY(-17px);
    -webkit-transform: translateY(-17px);
    -moz-transform: translateY(-17px);
    -ms-transform: translateY(-17px);
    -o-transform: translateY(-17px);
}
.about-info li p{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.about-info li p b{
    font-weight: 500;
    font-size: 18px;
    line-height: 26px;
    letter-spacing: 0.02em;
    color: #000000;
    transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
}
.about-info li.on p b{
    color:#ffffff;
}
.about-info li p span{
    display: block;
    height: 60px;
    padding-top:5px;
    font-weight: 400;
    font-size: 13px;
    line-height: 18px;
    letter-spacing: 0.02em;
    color: #C1C1C1;
    text-transform: uppercase;
    transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
}
.about-info li.on p span{
    color: rgba(255, 255, 255, 0.6);
}
.about-info li div{
    padding:34px 0 0 4px;
}
.about-info li div img{
    transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
}
.about-info li div img:last-child,
.about-info li.on div img:first-child{
    display: none;
}
.about-info li.on div img:last-child{
    display: block;
}

/* adva */
.adva{
    height:860px;
    background: url(../images/adva-bg.jpg) no-repeat center;
    background-size: cover;
    padding-top:90px;
}
.adva .tab{
    margin-left:20px;
}
.adva .tab p,
.adva .tab span{
    color:#ffffff;
}
.adva-main{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top:40px;
}
.adva-main li{
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    cursor: pointer;
}
.adva-min{
    width:170px;
    height:320px;
    background: #FFFFFF;
    box-shadow: 0px 0px 10px 2px rgba(0, 91, 172, 0.1);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.adva-main li.on .adva-min{
    background: #0770C8;
}
.adva-min p{
    width: 66px;
    height: 66px;
    background: #EAF4FD;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}
.adva-main li.on .adva-min p{
    background: #EAF4FD;
}
.adva-min span{
    font-family: 'AlibabaPuHuiTi-2-55-Regular';
    font-weight: 500;
    font-size: 18px;
    line-height: 26px;
    text-align: center;
    letter-spacing: 0.02em;
    color: #0066BB;
    display: block;
    padding:20px 0 80px 0;
}
.adva-main li.on .adva-min span{
    color:#ffffff;
}
.adva-min a{
    width:16px;
    height:16px;
    background: url(../images/cross.svg) no-repeat;
    background-size: cover;
}
.adva-main li.on .adva-min a{
    background: url(../images/cross-on.svg) no-repeat;
    background-size: cover;
}
.adva-max{
    width:558px;
    height:320px;
    background: #5BC2EF;
    box-shadow: 0px 0px 10px 2px rgba(0, 91, 172, 0.1);
    overflow: hidden;
    width:0px;
    height:320px;
    transition: all 1s;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
}
.adva-main li.on .adva-max{
    width:558px;
}
.adva-max p{
    width:558px;
    padding:76px 45px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.adva-max p b{
    position: relative;
    display: block;
    padding-bottom: 22px;
    font-weight: 500;
    font-size: 28px;
    line-height: 26px;
    letter-spacing: 0.02em;
    color: #FFFFFF;
}
.adva-max p b::after{
    content: '';
    width:26px;
    height:2px;
    background: #D9D9D9;
    position: absolute;
    left:0;
    bottom: 0;
}
.adva-max p span{
    display: block;
    padding-top:24px;
    width:242px;
    font-weight: 400;
    font-size: 15px;
    line-height: 26px;
    letter-spacing: 0.02em;
    color: #FFFFFF;
}


/* news */
.news{
    height:642px;
    margin-top:-230px;
}
.news .containers{
    height:100%;
    background: #ffffff;
    position: relative;
}
.news .containers::after{
    content: '';
    width:100%;
    height:100%;
    position: absolute;
    bottom: 0;
    right:0;
    z-index: 0;
    background: #ffffff;
    transform: translateX(50%);
    -webkit-transform: translateX(50%);
    -moz-transform: translateX(50%);
    -ms-transform: translateX(50%);
    -o-transform: translateX(50%);
}
.news-main{
    position:absolute;
    left:0;
    top:0;
    z-index: 111;
    width:100%;
    height:100%;
    padding:100px 50px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}
.news-l{
    width:260px;
}
.news-side{
    padding:46px 26px 0 26px;
}
.news-side li a{
    position: relative;
    display: block;
    padding:16px 0;
    height:100%;
    font-weight: 400;
    font-size: 15px;
    line-height: 21px;
    color: #606266;
}
.news-side li.on a{
    color:var(--blue--);
}
.news-side li.on a::after{
    content: '';
    width:20px;
    height:2px;
    background: var(--blue--);
    position: absolute;
    left:0;
    bottom: 0;
}
.news-l .about-more{
    margin-top: 44px;
}
.news-box{
    width:780px;
}
.news-r{
    width:780px;
    border-top: 1px solid #E6E4EF;
    margin-top:10px;
}
.news-r li{
    width:100%;
    height:108px;
    border-bottom: 1px solid #E6E4EF;
}
.news-r li a{
    position: relative;
    width:100%;
    height:100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}
.news-r li a::after{
    content: '';
    position: absolute;
    right:30px;
    top:50%;
    width:15px;
    height:10px;
    background: url(../images/arrow.svg) no-repeat center;
    background-size: contain;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}
.news-r li a span{
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.02em;
    color: #B3B9C3;
}
.news-r li a p{
    margin-top:10px;
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0.02em;
    color: #303133;
    word-break: break-all;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.news-r li a:hover p{
    color:var(--blue--);
}
.news-r li a::before{
    content: '';
    position: absolute;
    left:0;
    bottom: 0;
    width:0px;
    height:1px;
    background: var(--blue--);
    transition: all .6s;
    -webkit-transition: all .6s;
    -moz-transition: all .6s;
    -ms-transition: all .6s;
    -o-transition: all .6s;
}
.news-r li a:hover::before{
    width:680px;
}

/* foot */
.foot{
    height:340px;
    background: #343434;
}
.foot-main{
    display: flex;
    align-items: flex-start;
    justify-content:center;
    height:230px;
    padding-right:60px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.foot-logo{
    width:270px;
    height:100%;
    padding-top:95px;
}
.foot-menu{
    width:188px;
    padding-top:62px;
    margin:0 100px 0 90px;
}
.foot-menu span{
    font-weight: 500;
    font-size: 18px;
    line-height: 25px;
    color: #FFFFFF;
}
.foot-menu ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-top:20px;
}
.foot-menu ul li{
    width:90px;
}
.foot-menu ul li a{
    font-weight: 400;
    font-size: 14px;
    line-height: 210%;
    color: #FFFFFF;
    opacity: 0.8;
}
.foot-tel{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-top:62px;
}
.foot-tel span{
    font-weight: 500;
    font-size: 18px;
    line-height: 25px;
    color: #FFFFFF;
}
.foot-tel b{
    position: relative;
    display: block;
    padding:18px 0 14px 35px;
    font-family: 'DINPro-Medium';
    font-weight: 400;
    font-size: 24px;
    line-height: 26px;
    letter-spacing: 0.02em;
    color: #FFFFFF;
}
.foot-tel b::before{
    content: '';
    width:24px;
    height:24px;
    background: url(../images/foot-tel.svg) no-repeat center;
    background-size: cover;
    position: absolute;
    left:0;
    top:50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}
.foot-tel p{
    font-weight: 400;
    font-size: 14px;
    line-height: 200%;
    color: #FFFFFF;
    opacity: 0.8;
}
.foot-code{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-top:60px;
    margin-left:85px;
}
.foot-code span{
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #FFFFFF;
}
.foot-code p{
    margin-top:18px;
    width:100px;
    height:100px;
}
.copyright{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    height:108px;
    padding-top:10px;
}
.copyright p a,
.copyright p{
    font-weight: 400;
    font-size: 13px;
    line-height: 18px;
    color: rgba(255, 255, 255, 0.7);
}
.rkf{
    position: fixed;
    top: 50%;
    right: 0px;
    z-index: 99999;
    width: 68px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #333;
    transform: translateY(-50%);
}
.rkf ul{
    background: #fff;
    box-shadow: 0px 4px 26px rgb(20 26 75 / 9%);
    border-radius: 4px;
    padding: 10px 0;
}
.rkf li {
    width: 68px;
    height: 68px;
    box-sizing: border-box;
    margin-top: 4px;
    border-radius: 8px;
    box-sizing: border-box;
    cursor: pointer;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
}
.rkf li a{
    display:flex;
    flex-direction: column;
    align-items: center;
}
.rkf li span {
    font-size:14px;
    color: #303133;
    display: block;
    text-align: center;
    padding-top:4px;
}
.rkf li:last-child a img{
    width:26px;
}
.rkf .rkf-card{
    position: absolute;
    right: 80px;
    box-shadow: 0 6px 20px 0 rgb(50 50 51 / 10%);
    border-radius: 2px;
    background: #fff;
    box-sizing: border-box;
    width: 138px;
    padding: 8px;
    top: 50%;
    opacity: 1;
    z-index: 66;
    display: none;
    transform: translateY(-50%);
}
.rkf .rkf-card p{
    margin-bottom: 0;
}
.rkf .rkf-card a{
    font-size:17px;
    font-weight: bold;
    color: #303133;
    display: flex;
    align-items: center;
    justify-content: center;
    padding:6px 0;
}
.rkf .rkf-card span{
    padding-top:0;
}
.page_bar{
    background-position:center;
    background-repeat: no-repeat;
    background-size: cover;
    height:460px;
}
.page_bar .containers{
    position: relative;
}
.page_bar .banner-desc{
    opacity: 1;
    top:140px;
}
.page_bar .banner-desc p{
    text-shadow: 0px 4px 11px rgb(14 53 86 / 46%);
}
.page{
    height:auto;
    padding:50px 0 20px 0;
}
.view{
    padding:30px 0;
    margin-bottom: 0;
}
.nav{
    height:44px;
    background: #F5F6F8;
}
.nav .containers{
    display: flex;
    justify-content: space-between;
    align-items: center;
    height:100%;
}
.nav-l{
    position: relative;
    padding-left:30px;
}
.nav-l::before{
    content:'';
    width:26px;
    height:26px;
    background:url(../images/nav.svg) no-repeat center;
    background-size: 100% 100%;
    position: absolute;
    z-index: 22;
    left:0;
    top:50%;
    transform: translateY(-50%);
    -ms-transform:translateY(-50%);
    -moz-transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    -o-transform:translateY(-50%);
}
.nav-l a{
    overflow: hidden;
    padding:0 4px;
}
.nav-l a,
.nav-l{
    color: #3b3a44;
    font-size:16px;
}
.nav-tag ul{
    display:flex;
    justify-content:center;
    align-items: center;
    padding-bottom: 20px;
}
.nav-tag ul li{
    margin-left:22px;
    min-width: 140px;
    height: 48px;
    border: 1px solid #E4E7ED;
    transition: all .3s;
}
.nav-tag ul li a{
    font-size: 16px;
    line-height: 26px;
    display: flex;
    justify-content: center;
    align-items: center;
    width:100%;
    height:100%;
    padding:0 16px;
    transition: all .3s;
}
.nav-tag ul li:hover,
.nav-tag ul li.active{
    border:1px solid var(--blue--);
    background: var(--blue--);
}
.nav-tag ul li:hover a,
.nav-tag ul li.active a{
    color:#fff;
}
.pbox-ul{
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-items: flex-start;
    padding:10px 0 30px 0;
}
.pbox-li{
    width:305px;
    margin-right:26px;
    margin-top:16px;
}
.pbox-li:nth-child(4n+0){
    margin-right:0;
}
.pbox-li a{
    width:100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.pbox-li a p{
    width:100%;
    height:200px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.pbox-li a span{
    height:48px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.02em;
    color: #606266;
}
.pbox-li a img{
    transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
}
.pbox-li a:hover span{
    color:var(--blue--);   
}
.pbox-li a:hover img{
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
}
.pagination {
	display: inline-block;
	border-radius: 4px;
}
.pager .pagination {
    display: inline-block;
	border-radius: 4px;
    padding:3rem 0 2rem 0;
}
.pager {
	display: flex;
	justify-content: center;
	width:100%;
}
.pager li {
	display: inline;
}
.pager li span,  .pager li a {
	margin:0 8px;
	padding:10px 16px;
    background:#ffffff;
	color:#202020;
    border-radius:4px;
    border-color:#fff;
}
.pager li a:hover,
.pagination > .active > span {
	background:var(--blue--);
	color:#ffffff;
    border-color:#fff;
}
.pagination > .disabled > span {
	background: white !important;
	color:#202020;
    border-color:#fff;
}
.view .news-r{
    width:100%;
}
.view .news-r li{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height:220px;
    padding-left:20px;
}
.view .news-r a{
    width:860px;
    padding-right:80px;
}
.news-r b{
    font-size:18px;
    display: block;
    padding-top:10px;
    word-break: break-all;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.news-r li a:hover b{
    color:var(--blue--);
}
.view .news-r p{
    font-size:16px;
    line-height:28px;
    word-break: break-all;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.news-pic{
    width:280px;
    height:160px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}
.news-pic img{
    transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
}
.news-r li:hover .news-pic img{
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
}
.bull-t{
    display: flex;
    align-items: center;
    padding-top:20px;
}
.bull-li{
    display: flex;
    align-items: center;
    padding-right:20px;
}
.bull-t i{
    display: inline-block;
    padding-left:5px;
    font-style:normal;
    font-size:14px;
    color:var(--font--);
}
.view .news-r li a::before{
    display: none;
}
.contact{
    width:100%;
    background: url(../images/contact-bg.jpg) no-repeat center;
    background-size: cover;
    padding:70px 0 60px 0;
}
.contact-box{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height:426px;
}
.contact-pic{
    flex:1;
    height:440px;
    display: flex;
    align-items:center;
    justify-content:center;
    overflow: hide;
}
.contact-pic img{
    max-width: auto;
    height:100%;
}
.contact-txt{
    flex:1;
    height:440px;
    background: #ffffff;
    padding:32px;
}
.contact-t{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    border-bottom: 1px solid #ebeef5;
    padding-top:28px;
    padding-bottom: 26px;
}
.contact-t span{
    font-family: 'AlibabaPuHuiTi-2-55-Regular';
    font-size: 32px;
    line-height: 45px;
    letter-spacing: 0.481672px;
    color: #303133;
}
.contact-t p{
    padding-top:26px;
    font-size: 18px;
    line-height: 25px;
    letter-spacing: 0.04em;
    color: #202020;
}
.contact-t b{
    display: block;
    padding-top:6px;
    font-family: 'DINPro-Medium';
    font-size: 28px;
    line-height: 36px;
    color: #202020;
}
.contact-b{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding:24px 0;
}
.contact-code{
    display: flex;
    flex-direction: column;
    align-items: center;
    width:140px;
}
.contact-code p{
    width:112px;
    height:112px;
}
.contact-code span{
    font-size: 14px;
    line-height: 21px;
    text-align: center;
    color: #202020;
}
.contact-b ul{
    width:400px;
}
.contact-b ul li{
    font-size: 18px;
    line-height: 1.8;
    letter-spacing: 0.481672px;
    color: #303133;
    padding:2px 0 0 36px;
    position: relative;
}
.contact-b ul li::before{
    content: '';
    width:20px;
    height:20px;
    position: absolute;
    left:0;
    top:8px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.contact-b ul li:nth-child(1)::before{
    background-image: url(../images/handset.svg);
}
.contact-b ul li:nth-child(2)::before{
    background-image: url(../images/network.svg);
}
.contact-b ul li:nth-child(3)::before{
    background-image: url(../images/address.svg);
}
.view h1{
    font-family: 'AlibabaPuHuiTi-2-55-Regular';
    font-weight: normal;
    font-size: 24px;
    text-align: center;
    color:#303133;
    line-height:1.2;
}
.view-time{
    border-bottom: 1px solid #ddd;
    text-align: center;
    line-height:20px;
    text-indent:0;
}
.view-time span{
    font-size: 12px;
    margin: 0 10px;
    color: #999;
    line-height: 50px;    
}
.content{
    margin-top: 30px;
    line-height: 30px;
    color: #303133;
    font-size: 14px;
}
.prepage{
    line-height: 30px;
    margin:25px 0;
    color: #303133;
    font-size: 14px;
}
.prepage a{
    color:var(--menu--);
}