/*
 *  style.css by 453883682@qq.com
 */
.hm1Bg {
    position: relative;
    background: #FFFFFF;
    overflow: hidden;
    text-align: center;
    z-index: 1;
}
.banner {
    position: relative;
    height: 100vh;
    background-color: #000000;
}
.banImg {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    transition: all .5s;
}
.banVideo{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.banText {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    color: #FFFFFF;
    z-index: 1;
    text-align: center;
    text-shadow: 0 0 .1rem rgba(0, 0, 0, .1);
    letter-spacing: 0.2em;
    overflow: hidden;
}
.banTit {
    font-size: 52px;
    line-height: 1.6;
    margin: .1rem 0;
}
.banDes {
    font-size: 20px;
    line-height: 1.6;
    max-width: 900px;
    margin: 0 auto;
}
.banner .swiper-slide-active .banImg {
    transform: scale(1.1);
    transition: all 6s linear;
}
.banMask {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(../images/index/banMask.png) center center no-repeat;
    background-size: cover;
    z-index: 1;
}
.banDown {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 20px;
    text-align: center;
    font-size: 16px;
    color: #FFFFFF;
    z-index: 1;
    margin: 0 auto;
}
.banDown .text {
    display: block;
    margin: 0 auto;
}
.banDown .mouse {
    position: relative;
    display: block;
    width: 17px;
    height: 28px;
    background: url(../images/icon_mouse.png) center center no-repeat;
    background-size: contain;
    margin: 0 auto 10px;
}
.banDown .dot {
    position: absolute;
    left: 50%;
    top: 0;
    width: 2px;
    height: 4px;
    margin-left: -1px;
    border-radius: 50%;
    background-color: #FFFFFF;
    animation: banDot 2s linear infinite;
}
.banPrev,
.banNext {
    display: block;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 2;
    cursor: pointer;
    overflow: hidden;
}
.banPrev::before,
.banNext::before {
    display: block;
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, .12);
    transform: scale(0);
    transition: all .3s;
}
.banPrev {
    left: .3rem;
    background-image: url(../images/icon_prev.png);
}
.banNext {
    right: .3rem;
    background-image: url(../images/icon_next.png);
}
.banPrev:hover::before,
.banNext:hover::before {
    transform: scale(1);
}
.banPage {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 35px;
    z-index: 2;
}
.banPage .swiper-pagination-bullet {
    position: relative;
    width: 30px;
    height: 3px;
    background-color: rgba(255, 255, 255, 0.35);
    opacity: 1;
    border-radius: 0;
    margin: 0 4px;
}
.banPage .swiper-pagination-bullet i {
    display: block;
    width: 0;
    height: 100%;
    background-color: #FFFFFF;
}
.banPage .swiper-pagination-bullet-active i {
    animation: aniWidth 5s;
}
.titEn {
    font-size: 14px;
    line-height: 1.6;
    font-weight: bold;
    text-transform: uppercase;
}
.titCn {
    font-size: 46px;
    line-height: 1.6;
    font-weight: normal;
}
.titCn.font20 {
    font-size: 20px;
    font-weight: bold;
}
.titCn.font24 {
    font-size: 24px;
    font-weight: bold;
}
.titLine {
    display: block;
    width: 12px;
    height: 2px;
    margin: .1rem 0;
    background-color: #FFFFFF;
}
.titTop {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    color: #333333;
}
.titTop.white {
    color: #FFFFFF;
}
.titDes {
    max-width: 490px;
    font-size: 16px;
    line-height: 1.8;
}
.title_black {
    color: #333333;
}
.title_black .titLine {
    background-color: #333333;
}
.text-center .titLine {
    margin: .1rem auto;
}
.more {
    display: block;
    width: 210px;
    line-height: 44px;
    color: #FFFFFF;
    border: 1px solid #FFFFFF;
    border-radius: 2px;
    text-align: center;
    margin-top: .3rem;
    transition: all .3s;
}
.more i {
    display: inline-block;
    vertical-align: middle;
    width: 32px;
    height: 7px;
    background: url(../images/icon_arrow.png) right center no-repeat;
    margin-left: .1rem;
    margin-top: -2px;
    transition: all .5s;
}
.more:hover {
    color: var(--main-color);
    background-color: #FFFFFF;
}
.more:hover i {
    width: 20px;
    background-image: url(../images/icon_arrow_blue.png);
}
.more2 {
    color: var(--main-color);
    border-color: var(--main-color);
}
.more2 i {
    background-image: url(../images/icon_arrow_blue.png);
}
.more2:hover {
    color: #FFFFFF;
    background-color: var(--main-color);
}
.more2:hover i {
    background-image: url(../images/icon_arrow.png);
}
.more.hides {
    display: none;
}
.hm2Bg {
    position: relative;
    background: url(../images/index/hm2Bg.jpg) repeat;
}
.hm2Img {
    position: absolute;
    top: 0;
    right: 0;
    width: 50%;
    height: 100%;
}
.hm2Img .imgBg {
    display: block;
    width: 100%;
    height: 100%;
}
.hm2Box {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 100px;
    z-index: 3;
}
.hm2Lef {
    width: 34.375%;
    color: #FFFFFF;
    flex-shrink: 0;
}
.hm2Tit .titCn {
    font-size: 32px;
}
.hm2Text {
    font-size: 16px;
    line-height: 30px;
    min-height: 240px;
    margin: .3rem 0;
}
.hm2Rig {
    list-style: none;
    width: 55.625%;
    padding: 50px 60px;
    background-color: #FFFFFF;
    flex-shrink: 0;
}
.hm2Rig li + li {
    margin-top: .3rem;
}
.hm2Ico {
    float: left;
    width: 50px;
    height: 50px;
    max-width: 0.8rem;
    max-height: 0.8rem;
    margin-right: .3rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.hm2Ico img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    margin: 0 auto;
}
.hm2Info {
    overflow: hidden;
}
.hm2Des {
    font-size: 16px;
    color: #737373;
    line-height: 1.8;
    font-weight: 100;
    margin-top: .1rem;
}
.hm2Des img {
    max-width: 1.6rem;
    max-height: .68rem;
    margin-right: .4rem;
    margin-bottom: 5px;
}
.hm2Des img:last-child {
    margin-right: 0;
}
.hm3Bg {
    background: url(../images/index/hm3Bg.jpg) center top no-repeat;
    overflow: hidden;
}
.hm3Box {
    padding-top: 100px;
}
.hm3Box .titTop {
    margin-bottom: 30px;
}
.hm3List {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -6px;
}
.hm3List li {
    width: 25%;
    padding: 6px;
}
.hm3Link {
    position: relative;
    height: 100%;
    overflow: hidden;
}
.hm3Img {
    padding-bottom: 82.05%;
    border-radius: .12rem;
    background-color: #000000;
    overflow: hidden;
}
.hm3Text {
    max-width: 330px;
    padding: 40px 0 0;
}
.hm3Link:hover .imgBg {
    transform: scale(1.05);
}
.hm3Link:hover .titEn,
.hm3Link:hover .titCn {
    color: var(--main-color);
}
.hm3Link:hover .titLine {
    transform: scaleX(2);
    background-color: var(--main-color);
    transition: all .5s;
}
.hm4Bg {
    background: url(../images/index/hm4Bg.jpg) repeat;
}
.hm4Lef {
    width: 23.125%;
    color: #333333;
    flex-shrink: 0;
}
.hm4Rig {
    width: 66.25%;
}
.hm4Rig li {
    float: left;
    width: 33.33%;
    padding: 2px;
}
.hm4Link {
    position: relative;
    overflow: hidden;
}
.hm4Img {
    padding-bottom: 91.42%;
}
.hm4Img::after {
    display: block;
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.6));
}
.hm4Text {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 35px;
    color: #FFFFFF;
}
.hm4Con {
    line-height: 26px;
    max-height: 0;
    overflow: hidden;
    transition: all 0.5s;
}
.hm4Des {
    color: #FFFFFF;
}
.hm4Rig li:first-child {
    float: right;
}
.hm4Rig li:first-child .hm4Img {
    padding-bottom: 182.85%;
}
.hm4Rig li:nth-child(2) {
    width: 66.66%;
}
.hm4Rig li:nth-child(2) .hm4Img {
    padding-bottom: 44.68%;
}
.hm4Link:hover .imgBg {
    transform: scale(1.05);
    filter: blur(5px);
}
.hm4Link:hover .hm4Con {
    max-height: 78px;
}
.hm5Bg {
    position: relative;
    background: url(../images/index/hm2Bg.jpg) repeat;
}
.hm5Bg::before {
    display: block;
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    width: 50%;
    height: 100%;
    background: url(../images/index/hm4Bg.jpg) repeat;
}
.hm5Lef {
    width: 23.125%;
    color: #FFFFFF;
    flex-shrink: 0;
}
.hm5List {
    width: 66.25%;
}
.hm5List li + li {
    margin-top: 60px;
}
.hm5Link {
    display: flex;
    overflow: hidden;
}
.hm5Img {
    flex-shrink: 0;
    width: 41.5%;
    margin-right: 6%;
    border-radius: .12rem 0 .12rem 0;
    overflow: hidden;
}
.hm5Img .imgBg {
    display: block;
    height: 100%;
    transition: all 1s;
}
.hm5Text {
    flex: auto;
    overflow: hidden;
}
.hm5Con {
    line-height: 24px;
    height: 72px;
    margin: .2rem 0;
}
.hm5More {
    display: block;
    color: var(--main-color);
    line-height: 2;
    text-decoration: underline;
    margin: 50px 0 20px;
    transition: all .3s;
}
.hm5Link:hover .imgBg {
    transform: scale(1.05);
}
.hm5Link:hover .hm5More {
    color: var(--hover-color);
}
.hm6Bg {
    background: url(../images/index/hm4Bg.jpg) repeat;
}
.hm6Box .titTop {
    align-items: center;
}
.hm6Tab {
    display: flex;
    flex-wrap: wrap;
    text-align: center;
}
.hm6Tab li + li {
    margin-left: 25px;
}
.hm6Tab li span {
    display: block;
    min-width: 110px;
    line-height: 40px;
    font-size: 16px;
    color: #333333;
    border-radius: 2px;
    transition: all .5s;
    cursor: pointer;
}
.hm6Tab li.active span {
    color: #FFFFFF;
    background-color: var(--hover-color);
}
.hm6Bot .swiper-slide {
    height: auto;
}
.hm6List {
    margin: 0 -15px;
    overflow: hidden;
}
.hm6List li {
    float: left;
    width: 44%;
    padding: 0 15px;
}
.hm6Link {
    padding: 23px 0;
    border-top: 1px solid rgba(0, 0, 0, .06);
    border-bottom: 1px solid rgba(0, 0, 0, .06);
    margin-bottom: -1px;
    overflow: hidden;
}
.hm6Img {
    float: left;
    width: 190px;
    height: 120px;
    border-radius: .12rem 0 .12rem 0;
    margin-right: 30px;
    overflow: hidden;
}
.hm6Img .imgBg {
    width: 100%;
    height: 100%;
    transition: all 1s;
}
.hm6Text {
    overflow: hidden;
}
.hm6Tag {
    display: inline-block;
    vertical-align: middle;
    min-width: 80px;
    line-height: 26px;
    background-color: rgba(0, 0, 0, .12);
    border-radius: 2px;
    color: #FFFFFF;
    text-align: center;
    margin: 0 0 .15rem;
    display: none;
}
.hm6Tit {
    font-size: 20px;
    color: #333333;
    line-height: 1.5;
    transition: all .3s;
}
.hm6Time {
    font-size: 18px;
    color: #333333;
    line-height: 1.2;
    font-family: 'BarlowCondensed';
    font-weight: bold;
    display: none;
}
.hm6Con {
    line-height: 30px;
    height: 60px;
    -webkit-line-clamp: 2;
    margin-top: .15rem;
}
.hm6Link:hover .hm6Tit {
    color: var(--hover-color);
}
.hm6Link:hover .imgBg {
    transform: scale(1.05);
}
.hm6List li:nth-child(1),
.hm6List li:nth-child(2) {
    width: 28%;
}
.hm6List li:nth-child(1) .hm6Link,
.hm6List li:nth-child(2) .hm6Link {
    padding: 0;
    border: none;
    border-radius: .12rem .12rem 0 0;
    background-color: #FFFFFF;
}
.hm6List li:nth-child(1) .hm6Img,
.hm6List li:nth-child(2) .hm6Img {
    float: none;
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 63%;
    border-radius: 0;
    margin: 0;
    overflow: hidden;
}
.hm6List li:nth-child(1) .imgBg,
.hm6List li:nth-child(2) .imgBg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
.hm6List li:nth-child(1) .hm6Text,
.hm6List li:nth-child(2) .hm6Text {
    padding: 35px;
}
.hm6List li:nth-child(1) .hm6Tag,
.hm6List li:nth-child(2) .hm6Tag,
.hm6List li:nth-child(1) .hm6Time,
.hm6List li:nth-child(2) .hm6Time {
    display: inline-block;
}
#banIn .banImg,
#banIn .banMask {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
#banIn .banDes{
    -webkit-line-clamp: 6;
}
.banMin {
    max-height: 520px;
}
.banMin .banImg,
.banMin .banMask {
    max-height: 520px;
}
/* about */
.aBg1 {
    background-color: var(--gray-bg-color);
}
.aList1 {
    display: flex;
    height: 100vh;
}
.aList1 li {
    position: relative;
    flex: 1;
    padding: 17.7vw 3.5vw .3rem;
}
.a1Img {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 0;
    transition: all .5s ease-in-out;
    z-index: -1;
}
.a1Img .imgBg {
    display: block;
    width: 100%;
    height: 100%;
    background-color: var(--main-color);
}
.aList1 li:hover {
    color: #FFFFFF;
}
.aList1 li:hover .a1Img {
    height: 100%;
}
.aList1 li:hover .title {
    color: #FFFFFF;
    transition: all .3s;
}
.aList1 li:hover .titLine {
    background-color: #FFFFFF;
}
.aBg2 {
    /* background: url(../images/about/aBg2.jpg) center center #000000 no-repeat; */
    background-color: #000000;
    background-size: cover;
    overflow: hidden;
}
.aBox2 {
    position: relative;
    min-height: 100vh;
}
.aBox2::after{
    display: block;
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -30%;
    margin-top: -30%;
    width: 60%;
    padding-bottom: 60%;
    background: url(../images/about/aBox2Cir.jpg) center center no-repeat;
    background-size: 100% 100%;
    animation: aniCir 50s linear infinite;
}
.a2Text {
    position: relative;
    width: 100%;
    padding: .6rem 0;
    color: #FFFFFF;
    text-align: center;
    z-index: 1;
}
.a2Text .titLine {
    margin: .1rem auto;
}
.a2Con {
    margin-top: .3rem;
}
.a2Con h4 {
    font-size: 150%;
    font-weight: normal;
}
.aBox3 {
    display: flex;
}
.a3Img,
.a3Rig {
    width: 50%;
}
.a3Img .imgBg {
    display: block;
    height: 100%;
}
.a3Rig {
    min-height: 100vh;
}
.a3Text {
    padding: .6rem 7.6vw;
}
.aBox4 {
    padding: 5.8vw 0;
}
.a4Top {
    position: relative;
    padding: 0 114px;
    margin: .3rem auto;
}
.a4Top .swiper-container {
    padding: .2rem 0;
}
.a4Top .swiper-slide {
    width: 580px;
    height: auto;
    background-color: #FFFFFF;
}
.a4Top .swiper-slide-active .a4Item {
    opacity: 1;
    box-shadow: 0 0 .2rem rgba(0, 0, 0, .1);
}
.a4Top.one {
    padding: 0;
}
.a4Top.one .swiper-slide {
    width: 100%;
}
.a4Top.one .swiper-slide .a4Item {
    opacity: 1;
}
.a4Top.one .a4Prev,
.a4Top.one .a4Next {
    display: none;
}
.a4Item {
    padding: 40px 60px;
    border-radius: .12rem;
    border: 1px solid #EEEEEE;
    background-color: #FFFFFF;
    opacity: .35;
    transition: all .3s linear .3s;
}
.a4Item .titCn {
    color: #333333;
}
.a4Con {
    line-height: 26px;
    margin: .2rem 0;
}
.a4Logo {
    text-align: right;
}
.a4Logo img {
    width: auto;
    height: 42px;
    max-height: 0.42rem;
}
.a4Prev,
.a4Next {
    display: block;
    width: 60px;
    height: 60px;
    line-height: 60px;
    background-color: rgba(0, 0, 0, .02);
    border-radius: 50%;
    font-size: 24px;
    color: #666666;
    text-align: center;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
    cursor: pointer;
    transition: all .3s;
}
.a4Prev {
    left: 0;
    padding-right: 2px;
}
.a4Next {
    right: 0;
    padding-left: 2px;
}
.a4Prev:hover,
.a4Next:hover {
    color: #FFFFFF;
    background-color: var(--hover-color);
}
.parList {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    margin: 0 -.13rem;
}
.parList li {
    width: 16.66%;
    padding: .13rem;
}
.parLink {
    display: block;
    position: relative;
    height: 0;
    padding-bottom: 45.7%;
    border: 1px solid #EEEEEE;
    border-radius: 5px;
    transition: all .3s;
}
.parImg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.parImg img {
    display: block;
    max-width: 90%;
    max-height: 80%;
    margin: 0 auto;
}
.parLink:hover {
    border-color: var(--hover-color);
}
/* product */
.proItem {
    position: relative;
    padding-bottom: 100px;
    border-bottom: 1px solid rgba(0, 0, 0, .06);
}
.proItem .wrap{
    position: relative;
}
.proItem:nth-child(2n){
    background: url(../images/product/proBg.jpg) center center no-repeat;
    background-size: cover;
}
.proItem:nth-child(2n):before{
    display: block;
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #FFFFFF;
    opacity: .8;
}
.proItem:last-child {
    border-bottom: none;
}
.proItem .titTop {
    padding: 120px 0 45px;
    align-items: flex-start;
}
.proItem .titDes {
    max-width: 560px;
    color: #737373;
}
.proList {
    position: relative;
}
.proLink {
    display: block;
    height: auto;
}
.proImg {
    padding-bottom: 100%;
    background-color: #FAFAFA;
}
.proImg .imgBg{
    background-size: 100% 100%;
}
.proText {
    margin-top: 30px;
    max-width: 440px;
}
.proTit {
    font-size: 20px;
    color: #333333;
    line-height: 26px;
    transition: all .3s;
}
.proCon {
    font-size: 16px;
    color: #737373;
    line-height: 26px;
    margin-top: .1rem;
    -webkit-line-clamp: 2;
}
.proLink:hover .imgBg {
    transform: scale(1.05);
}
.proLink:hover .proTit {
    color: var(--hover-color);
}
.proPrev,
.proNext {
    z-index: 2;
    top: calc(50% - 54px - .05rem);
    background-color: rgba(0, 0, 0, .2);
    color: #000000;
}
.proPrev {
    left: 30px;
}
.proNext {
    right: 30px;
}
.proPrev.swiper-button-disabled,
.proNext.swiper-button-disabled {
    display: none;
}
/* proText */
.proBg {
    padding: 120px 0;
}
.pro1List {
    display: flex;
    flex-wrap: wrap;
    margin-top: .5rem;
    background-color: rgba(0, 70, 156, 0.03);
    text-align: center;
}
.pro1List li {
    flex: auto;
    width: 25%;
    padding: .4rem .3rem;
    border-radius: .2rem;
    transition: all .3s;
}
.pro1Ico {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 120px;
    height: 120px;
    max-width: 1.2rem;
    max-height: 1.2rem;
    border-radius: 50%;
    border: 2px solid var(--main-color);
    margin: .4rem auto;
}
.pro1Ico img {
    max-width: 100%;
    max-height: 100%;
    margin: 0 auto;
}
.pro1Text {
    max-width: 290px;
    margin: 0 auto;
}
.pro1List li:hover {
    color: #FFFFFF;
    border-radius: .2rem;
    background-color: var(--main-color);
}
.pro1List li:hover .pro1Ico {
    border-color: #FFFFFF;
}
.pro1List li:hover img.shows {
    display: none;
}
.pro1List li:hover img.hides {
    display: block;
}
.proBg2 {
    position: relative;
    z-index: 1;
}
.pro2Img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}
.pro2Img .imgBg {
    height: 100%;
}
.pro2Img::before,
.pro2Img::after {
    display: block;
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
}
.pro2Img::before {
    background-color: rgba(0, 0, 0, .35);
}
.pro2Img::after {
    background-color: rgba(13, 77, 161, .08);
}
.pro2List {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    text-align: center;
    min-height: 640px;
    font-size: 30px;
    color: #FFFFFF;
    line-height: 1.4;
    font-weight: 100;
}
.pro2List li {
    position: relative;
    flex: 1;
    padding: 275px 40px 100px;
    transition: all .3s;
}
.pro2List li::before {
    position: absolute;
    left: 0;
    bottom: 0;
    display: block;
    content: "";
    width: 100%;
    height: 0;
    background: linear-gradient(to bottom, transparent 0%, rgba(0, 70, 156, 0.8));
    transition: all .8s ease;
    z-index: -1;
}
.pro2List li.active::before {
    height: 100%;
}
.pro3List {
    position: relative;
    margin-top: .5rem;
}
.pro3List .swiper-slide {
    width: 62.5%;
}
.pro3List .swiper-slide img {
    width: 100%;
    height: auto;
}
.pro3List .swiper-slide-prev,
.pro3List .swiper-slide-next {
    background-color: #000000;
}
.pro3List .swiper-slide-prev img,
.pro3List .swiper-slide-next img {
    opacity: .8;
}
.pro3Prev,
.pro3Next {
    color: #FFFFFF;
    background-color: rgba(0, 0, 0, .2);
}
.pro3Prev {
    left: 7%;
}
.pro3Next {
    right: 7%;
}
.pro4List {
    position: relative;
}
.pro4List .swiper-slide {
    height: auto;
}
.pro4Img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
.pro4Img .imgBg {
    height: 100%;
}
.pro4Img .imgBg::after,
.pro4Img::before,
.pro4Img::after {
    display: block;
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.pro4Img::before {
    background-color: rgba(0, 0, 0, .3);
}
.pro4Img::after {
    background-color: #0d4da1;
    opacity: .08;
}
.pro4Img .imgBg::after {
    height: 30%;
    background: linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.3));
}
.pro4Text {
    position: relative;
    padding: .6rem 0;
    min-height: 6.4rem;
    color: #FFFFFF;
    z-index: 1;
}
.pro4Text .banTit {
    font-weight: normal;
    letter-spacing: 0.2em;
}
.pro4Text .banDes {
    max-width: 760px;
    letter-spacing: .16em;
}
.pro4Page {
    position: absolute;
    left: 0;
    right: 0;
    bottom: .24rem;
    text-align: center;
    z-index: 1;
}
.pro4Page .swiper-pagination-bullet {
    width: 2px;
    height: 8px;
    background-color: #FFFFFF;
    opacity: .35;
    margin: 0 .06rem;
    vertical-align: bottom;
    transition: all .3s;
}
.pro4Page .swiper-pagination-bullet-active {
    height: 18px;
    opacity: 1;
}
.pro5List {
    list-style: none;
    border-top: 1px solid rgba(0, 0, 0, .06);
    margin-top: .5rem;
}
.pro5List li {
    border-bottom: 1px solid rgba(0, 0, 0, .06);
}
.pro5Tit {
    font-size: 20px;
    color: #333333;
    line-height: 24px;
    padding: .25rem 0;
    cursor: pointer;
}
.pro5Tit i {
    position: relative;
    float: right;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 2px solid #000000;
    background-color: #000000;
    transition: all .3s;
}
.pro5Tit i::before,
.pro5Tit i::after {
    display: block;
    content: "";
    background-color: #FFFFFF;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: all .3s;
}
.pro5Tit i::before {
    width: 8px;
    height: 2px;
}
.pro5Tit i::after {
    width: 2px;
    height: 8px;
}
.pro5Text {
    padding: 0 88px 50px;
    display: none;
}
.pro5Text h4 {
    color: #333333;
}
.active .pro5Tit i {
    background-color: transparent;
}
.active .pro5Tit i::before {
    background-color: #000000;
}
.active .pro5Tit i::after {
    height: 0;
}
/* proText2 */
.proTop {
    display: flex;
    box-shadow: 0 0 .2rem rgba(0, 0, 0, .03);
    margin-bottom: 1.2rem;
}
.proLef,
.proRig {
    width: 50%;
    flex-shrink: 0;
}
.proLef {
    position: relative;
    background-color: #FAFAFA;
    overflow: hidden;
}
.proLef .swiper-container {
    position: relative;
    height: auto;
}
.proLef .imgBg {
    height: 0;
    padding-bottom: 80%;
    background-size: contain;
    overflow: hidden;
}
.proLef .a4Prev {
    left: 4%;
}
.proLef .a4Next {
    right: 4%;
}
.proRig {
    padding: .5rem 100px;
}
.proInfo .title {
    margin-bottom: .4rem;
}
.proInfo {
    width: 100%;
}
.proParm {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    line-height: 30px;
    margin: .5rem 0 0;
}
.proParm li {
    width: 50%;
    padding: 1px;
}
.proParmItem {
    display: flex;
    padding: .2rem .3rem;
}
.proParmLabel {
    flex-shrink: 0;
    width: 160px;
    color: #333333;
}
.proParm li:nth-child(2n) .proParmItem {
    background-color: rgba(13, 77, 161, 0.03);
}
.proParm table {
    width: 100%;
    line-height: 30px;
}
.proParm table tr th {
    width: 12%;
    color: #333333;
    border-left: 4px solid #FFFFFF;
    text-align: left;
    padding-left: .3rem;
}
.proParm table tr td {
    padding: .2rem;
    width: 38%;
}
.proParm table tr:nth-child(2n + 1) {
    background-color: rgba(13, 77, 161, 0.03);
}
/* solution */
.soluTop {
    max-width: 1000px;
    margin-bottom: 120px;
}
.soluLine {
    height: 1px;
    margin: .4rem 0;
    background-color: #000000;
    opacity: .06;
}
.soluH3 {
    color: #333333;
    line-height: 30px;
    margin: .2rem 0;
}
.soluYs {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 50px -.1rem 120px;
}
.soluYs li {
    flex: auto;
    padding: .2rem .1rem 0;
}
.soluYs li:hover .soluIco img{
    animation: swing 1s linear 1;
}
.soluIco {
    width: 100px;
    height: 100px;
    max-width: 1rem;
    max-height: 1rem;
    border-radius: 50%;
    background-color: var(--main-color);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto .15rem;
}
.soluIco img {
    display: block;
    max-width: 100%;
    max-height: 100%;
}
.soluTit {
    color: #333333;
    line-height: 1.4;
    max-width: 104px;
    text-align: center;
    margin: 0 auto;
    font-weight: normal !important;
}
.soluImg {
    margin: 120px 0;
}
.soluImg img {
    max-width: 100% !important;
    height: auto !important;
}
.soluList {
    list-style: none;
}
.soluList li {
    display: flex;
    min-height: 480px;
    box-shadow: 0 0 .2rem rgba(0, 0, 0, 0.05);
    margin-top: 50px;
}
.soluList li:nth-child(2n) {
    flex-direction: row-reverse;
}
.soluLef,
.soluRig {
    width: 50%;
    flex-shrink: 0;
}
.soluLef{
    overflow: hidden;
}
.soluLef .imgBg {
    display: block;
    height: 100%;
    transition: all 1s;
}
.soluLef .imgBg:hover{
    transform: scale(1.1);
    transition: all 2s;
}
.soluText {
    width: 100%;
    padding: .3rem 85px;
}
.soluText .title {
    margin-bottom: .2rem;
}
/* service */
.serList li {
    margin-top: 0 !important;
    min-height: 980px;
    background-color: #f4f6f9;
}
.serList li:nth-child(2n) {
    background-color: #f7f9fc;
}
.serList .soluText {
    padding: .3rem 145px;
}
.serTit {
    color: #FFFFFF;
    padding: .1rem .2rem;
    border-radius: 5px 5px 0 0;
    background-color: var(--main-color);
    margin: .1rem 0;
}
.serDot {
    color: #333333;
}
.serDot p {
    padding: .1rem .2rem;
    border-bottom: 1px solid rgba(0, 0, 0, .06);
    transition: all .5s;
}
.serDot p:hover{
    text-indent: -.1rem;
}
/* news */
.newsList {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    margin: 0 -.17rem;
    margin-bottom: .5rem;
}
.newsList li {
    width: 33.33%;
    padding: 0 .17rem;
    margin-top: .52rem;
}
.newsLink {
    height: 100%;
    border-radius: .12rem;
    border: 1px solid #F2F2F2;
    overflow: hidden;
    transition: all .3s;
}
.newsImg {
    padding-bottom: 62.75%;
}
.newsText {
    padding: 30px 50px;
}
.newsText .hm6Tag {
    display: inline-block;
}
.newsText .hm6Tit {
    -webkit-line-clamp: 1;
}
.newsText .hm6Time {
    display: block;
}
.newsText .more {
    display: none;
    margin-top: .5rem;
}
.newsLink:hover {
    box-shadow: 0 0 .2rem rgba(0, 0, 0, 0.05);
}
.newsLink:hover .imgBg {
    transform: scale(1.05);
}
.newsLink:hover .hm6Tit {
    color: var(--hover-color);
    text-decoration: underline;
}
.newsLink:hover .more {
    color: #FFFFFF;
    border-color: var(--hover-color);
    background-color: var(--hover-color);
}
.newsLink:hover .more i {
    width: 20px;
    background-image: url(../images/icon_arrow.png);
}
.newsList li:nth-child(4n + 1) {
    width: 100%;
}
.newsList li:nth-child(4n + 1) .newsLink {
    display: flex;
    background-color: #FAFAFA;
    border: none;
}
.newsList li:nth-child(4n + 1) .newsImg {
    flex-shrink: 0;
    width: 48.125%;
    height: auto;
    padding: 0;
}
.newsList li:nth-child(4n + 1) .imgBg {
    height: 100%;
}
.newsList li:nth-child(4n + 1) .newsText {
    flex: auto;
    padding: 80px 90px;
    overflow: hidden;
}
.newsList li:nth-child(4n + 1) .hm6Tag,
.newsList li:nth-child(4n + 1) .hm6Time {
    display: none;
}
.newsList li:nth-child(4n + 1) .more {
    display: block;
}
.newsList li:nth-child(4n + 1) .hm6Tit {
    font-size: 30px;
    -webkit-line-clamp: 2;
}
.newsList li:nth-child(4n + 1) .hm6Con {
    height: 90px;
    -webkit-line-clamp: 3;
    margin: .3rem 0;
}
/* newsdetail */
.newsBg {
    background-color: #f2f9fc;
    overflow: initial;
}
.newsBox {
    transform: translateY(-.35rem);
}
.newsLef {
    float: left;
    padding: 50px 55px;
    width: calc(100% - 400px);
    min-height: 50vh;
    background-color: #FFFFFF;
}
.newsTop {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: flex-start;
    padding: .1rem 0 .2rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.fontSize {
    flex-shrink: 0;
    margin-left: .1rem;
    color: #333333;
    line-height: 46px;
}
.fontSize span {
    display: inline-block;
    vertical-align: middle;
}
.fontSize span.active {
    color: #FFFFFF;
    background-color: var(--hover-color);
}
.fontTit {
    background: url(../images/news/fontsize.png) left center no-repeat;
    padding-left: 25px;
    margin-right: 5px;
}
.max, .mid, .min {
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-radius: 50%;
    background-color: #F6F6F6;
    text-align: center;
    margin-left: 8px;
    cursor: pointer;
}
.newsName {
    font-size: 32px;
    color: #333333;
    line-height: 46px;
}
.newsBot {
    margin: .3rem 0 0;
}
.newsBot img {
    max-width: 100% !important;
    height: auto !important;
}
.newsInfo {
    margin: .2rem -.2rem;
}
.newsInfo span {
    display: inline-block;
    vertical-align: middle;
    padding: 0 .2rem;
}
.share {
    list-style: none;
    margin: .2rem -.07rem;
}
.share li {
    display: inline-block;
    vertical-align: middle;
    padding: 0 .07rem;
}
.share li a {
    display: block;
    width: 40px;
    height: 40px;
    max-width: .6rem;
    max-height: .6rem;
    background-position: center center;
    background-size: cover;
    background-position: center center;
}
.shareIco1 {
    background-image: url(../images/news/shareIco1.png);
}
.shareIco2 {
    background-image: url(../images/news/shareIco2.png);
}
.shareIco3 {
    background-image: url(../images/news/shareIco3.png);
}
.shareIco4 {
    background-image: url(../images/news/shareIco4.png);
}
.newsRig {
    position: sticky;
    top: 100px;
    float: right;
    width: 370px;
    min-height: 50vh;
    padding: 30px;
    margin-left: 30px;
    background-color: #FFFFFF;
}
.newsH2 {
    font-size: 24px;
    color: #333333;
    line-height: 42px;
    font-weight: normal;
    padding: .1rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.recomList {
    list-style: none;
    margin: .1rem 0;
}
.recomList li {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.recomLink {
    padding: .2rem 0;
}
.recomTit {
    font-size: 16px;
    color: #333333;
    line-height: 1.5;
    -webkit-line-clamp: 2;
    transition: all .3s;
}
.recomTime {
    display: block;
    color: #999999;
    margin-top: .1rem;
    font-family: 'BarlowCondensed';
    font-weight: bold;
}
.recomCon {
    color: #737373;
    -webkit-line-clamp: 2;
    margin-top: .1rem;
}
.recomImg {
    margin-bottom: .2rem;
}
.recomImg img {
    display: block;
    max-width: 100% !important;
    height: auto;
}
.recomImg + .recomTit {
    font-size: 20px;
    -webkit-line-clamp: 2;
}
.recomImg + .recomTit + .recomTime {
    font-size: 18px;
    margin-top: 0;
    color: #333333;
}
.recomLink:hover .recomTit {
    color: var(--hover-color);
}
.newsPage {
    margin: .3rem 0;
}
.newsPage p {
    margin: .1rem 0;
    overflow: hidden;
}
.newsPage strong {
    float: left;
    color: #333333;
}
.newsPage a {
    display: block;
    color: #737373;
    overflow: hidden;
    transition: all .3s;
}
.newsPage a:hover {
    color: var(--hover-color);
    text-decoration: underline;
}
.goBack {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #333333;
    padding: .1rem .36rem;
    line-height: 26px;
    background: #F6F6F6;
    border-radius: 3px;
    margin-top: .3rem;
    transition: all .3s;
}
.goBack i {
    font-size: 140%;
}
.goBack:hover {
    color: #FFFFFF;
    background-color: var(--hover-color);
}
/* contact */
.conBox {
    display: flex;
}
.conLef {
    flex-shrink: 0;
    width: 64.625%;
    padding-right: 80px;
}
.conLef .title {
    margin-bottom: .4rem;
}
.conTips {
    color: #333333;
    font-weight: normal !important;
    margin: .2rem 0;
}
.conForm {
    list-style: none;
    max-width: 950px;
    margin: 0 -.24rem;
    overflow: hidden;
}
.conForm li {
    float: left;
    width: 50%;
    padding: 0 .24rem;
    margin-top: .15rem;
}
.conItem {
    display: flex;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.conLabel {
    color: #333333;
    margin-right: 5px;
    line-height: 40px;
}
.conText {
    flex: auto;
    overflow: hidden;
}
.conInput {
    display: block;
    width: 100%;
    height: 40px;
    line-height: 24px;
    padding: 8px;
    border: none;
}

textarea.conInput {
    max-height: 3rem;
    height: 200px;
    border: 1px solid rgba(0, 0, 0, 0.06);
    resize: none;
}
.conForm li.one {
    width: 100%;
}
.conForm li.last .conItem {
    display: block;
}
.conBtn {
    width: 450px;
    height: 50px;
    border: none;
    font-size: 20px;
    color: #FFFFFF;
    background: #0D4DA1;
    border: 1px solid #0D4DA1;
    cursor: pointer;
    margin-top: .5rem;
    transition: all .3s;
}
.conBtn:hover{
    border-color: var(--hover-color);
    background-color: var(--hover-color);
}
.conRig {
    flex: auto;
    padding-left: 85px;
    border-left: 1px solid rgba(0, 0, 0, 0.06);
    overflow: hidden;
}
.conTit {
    font-size: 30px;
    color: #333333;
    line-height: 1.4;
    font-weight: normal;
}
.conList {
    list-style: none;
}
.conList li {
    padding: .25rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.conList li:last-child {
    border: none;
    padding-bottom: 0;
}
.conList .titCn {
    color: #333333;
    line-height: 2;
    margin-bottom: 5px;
    font-weight: normal;
}
.conList a {
    color: #737373;
}
.conList p {
    padding-left: 25px;
    margin: 4px 0;
    background-position: left 6px;
    background-repeat: no-repeat;
}
.conAdd {
    background-image: url(../images/contact/conIco1.png);
}
.conTel {
    background-image: url(../images/contact/conIco2.png);
}
.conEmail {
    background-image: url(../images/contact/conIco3.png);
}
/*page*/
.page {
    text-align: center;
    margin-top: 30px;
}
.page a {
    display: inline-block;
    height: 40px;
    line-height: 40px;
    padding: 0 18px;
    background: #ffffff;
    color: #0b2b4d;
    font-size: 14px;
    margin-bottom: 5px;
    border: 1px solid #e5e5e5;
    border-radius: 5px;
}
.page a:hover, .page a.current {
    background: #F36E21;
    color: #ffffff;
}
.page strong {
    display: inline-block;
    height: 40px;
    line-height: 40px;
    padding: 0 18px;
    background: #F36E21;
    color: #ffffff;
    font-size: 14px;
    margin-bottom: 5px;
    border: 1px solid #e5e5e5;
    border-radius: 5px;
}