﻿.wow{ transition-delay:0.3s;}
.pc{ display:block;}
.mob{ display:none;}

#index{ height:100vh;}
#index > .section{ position:relative; height:100vh; overflow:hidden;}
.banner{ position:relative; height:100vh; overflow:hidden;}
.banner .swiper-slide{ background-color: var(--baseColor); overflow:hidden;}
.banImg{ opacity: 1; height:100%; transform:scale(1.05); transition:all .5s;}
.banner .swiper-slide-active .banImg{ transform:scale(1); transition:all 5s;}
.banText{ position:absolute; left:0; top:0; width:100%; height:100%; z-index:1; color:#FFFFFF; font-size:2.7vw; line-height:150%;}
.banTit{ font-size: 3vw;}
.banCon{ font-size: 1.67vw;}
.banPage{ position:absolute; z-index:1; right:2%; top:50%; transform: translateY(-50%); text-align:center;}
.banPage .swiper-pagination-bullet{ display:block; width:12px; height:12px; margin:.1rem 0; border:1px solid #FFFFFF; opacity:1; background:none; position:relative; transition:all .3s;}
.banPage .swiper-pagination-bullet:before{ display:none; content:""; width:5px; height:5px; border-radius:50%; background:#FFFFFF; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}
.banPage .swiper-pagination-bullet-active::before{ display: block;}
.banMouse{ position: absolute; left: 50%; bottom: 2%; transform: translateX(-50%); z-index: 1; width: 20px; padding-top: 35px; background: url(../images/home/banMouse.png) center top no-repeat; background-size: 100% auto; cursor: pointer;}
.banArrow{ display: block; width: 16px; height: 22px; background: url(../images/home/banArrow.png) center center no-repeat; background-size: cover; margin: 0 auto; animation: banMouse 2s linear infinite;}
/* banner效果 */
.banText p span{ display:inline-block; vertical-align:middle; position:relative;}
.banText p i{ font-style:normal; display:inline-block; vertical-align:middle; margin:0 2px; position:relative; z-index:1;}
.box1P1 b{ display:block; position:absolute; width:2px; height:0%; left:100%; bottom:5px; transition:all 1s ease-in-out 0s;}
.box1P1 b:last-child{ width:0%; height:0.15rem; background:var(--baseColor); left:0; bottom:0;}
.box1P1 i{ transform: scale(0); opacity:0; transition:all 1s ease-in-out 0s;}
.box1P2 i{ transform:translateY(100%); opacity:0; transition:all 1s ease-in-out 0s;}
.box1P1.active i{ transform:translateY(0); opacity:1; transform: scale(1);}
.box1P1.active b{ width:100%;}
.box1P2.active i{ transform:translateY(0); opacity:1;}

.boxPd{ padding-top:86px;}

/*boxBg2*/
.boxBg2{ background:url(../images/home/boxBg2.jpg) center center no-repeat; background-size:cover;}
.boxBg2:before{ display:block; content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:url(../images/home/boxBg2.jpg) center center repeat-x; background-size:cover; animation:logoAni 40s linear infinite;}
.box2Box{ position:relative; z-index:1; text-align:center; width: 80%; max-width: 1480px; margin: 0 auto;}
.box2Logo{ max-width:30%; margin:.2rem auto;}
.box2Logo img{ display:block; max-width:100%; height:auto; margin:0 auto;}
.box2Text{ font-size:20px; color:#666666; line-height:190%; margin:.3rem auto;}
.box2List{ display:flex; flex-wrap:wrap; width: 90%; max-width:1300px; margin:.3rem auto; min-height: 12vw;}
.box2List li{ width:25%; padding:.1rem;}
.box2List strong{ display: inline-block; vertical-align:middle; font-size:52px; font-size:2.7vw; color:var(--baseColor); vertical-align:bottom; font-family:Arial; background-image: linear-gradient(to right,#0d2daf,#77cff5); -webkit-background-clip:text; -webkit-text-fill-color:transparent;}
.box2List h3{ font-size: 24px; color: #666666; line-height: 1.6;}
.box2More{ margin: .2rem 0;}
.box2More a{ display: block; width: 168px; line-height: 40px; background-color: var(--baseColor); color: #FFFFFF; text-align: center; border-radius: 20px; margin: 0 auto; transition: all .5s;}
.box2More a:hover{ box-shadow: 0 3px 3px rgba(0,0,0,0.3); transform: translateY(-5px);}


/*boxBg3*/
.boxBg3{ position: relative; background:url(../images/home/boxBg3.jpg) center center no-repeat; background-size:cover;}
.boxBg3::before{ display: block; content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; background-image: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.6));}
.box3Top{ position: absolute; left: 0; top: 86px; width: 100%; padding: 60px 0; z-index: 2;}
.box3List{ position: relative; display: flex; justify-content: center; height: 100%;}
.box3List li{ flex: 1;}
.box3Link{ position: relative; display: flex; flex-direction: column; justify-content: center; height: 100%; padding: 200px 5% 0; text-align: center; z-index: 1;}
.box3Link::after{ display: block; content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 0; background-image: linear-gradient(rgba(0,0,0,0),rgba(20,69,148,1) 80%); transition: all 0.5s linear; z-index: -1;}
.box3Img{ display: flex; flex-direction: column; justify-content: center; align-items: center; width: 95px; height: 95px; max-width: 1rem; max-height: 1rem; overflow: hidden; text-align: center; margin: 0 auto .1rem; transition: all .5s;}
.box3Img img{ display: block; max-width: 100%; max-height: 100%; margin: 0 auto;}
.box3Text{ padding: 10px 0; transition: all .5s;}
.box3Tit{ font-size: 30px; color: #FFFFFF; line-height: 1.4; margin: .3rem 0;}
.box3Des{ font-size: 18px; color: #FFFFFF; line-height: 2; height: 144px; -webkit-line-clamp:4; margin: .1rem auto; max-width: 260px;}
.box3More{ position: relative; display: block; width: 100%; max-width: 156px; line-height: 49px; color: #FFFFFF; border-radius: 5px; margin: .1rem auto; text-transform: uppercase; overflow: hidden; transition: all .3s; z-index: 1;}
.box3More::before{ display: block; content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 0; background-color: #FFFFFF; z-index: -1; transition: all .3s;}
.box3Link:hover::after{ height: 100%;}
.box3Link:hover .box3Img,
.box3Link:hover .box3Text{ transform: translateY(-.3rem);}
.box3Link:hover .box3More{ color: #144593;}
.box3Link:hover .box3More::before{ height: 100%;}

/*boxBg4*/
.boxBg4{ background:url(../images/home/boxBg4.jpg) center center no-repeat; background-size:cover;}
.box4List{ position: relative; width: 90%; max-width: 1440px; margin: 0 auto; color: #FFFFFF; text-align: center;}
/* .box4Item{ transform: translateY(100px); transition: all .3s;} */
.box4Item{ position: relative; display: flex; align-items: center; justify-content: center; height: 420px;}
.box4Cir{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 80%; height: 0; padding-bottom: 80%;}
.box4Cir::before,
.box4Cir::after{ display: block; content: ""; position: absolute; transition: all .5s;}
.box4Cir::before{ width: 100%; height: 100%; border: .1rem solid rgba(19, 230, 253, .4); border-radius: 50%; transform: scale(0);}
.box4Cir::after{ width: 50px; height: 50px; border-radius: 50%; left: 50%; bottom: 10px; transform: translate(-50%,50%); background: url(../images/btn_Next_Arrow.png) center center #13e6fd no-repeat; background-size: 25% auto; opacity: 0;}
.box4Con{ width: 100%; transition: all .5s;}
.box4Ico{ display: block; width: 64px; height: 64px; margin: .2rem auto;}
.box4Ico img{ display: block; width: 100%; height: 100%;}
.box4Tit{ font-size: 20px; font-weight: normal; line-height: 1.4; margin: .2rem 0;}
.box4Line{ position: relative; width: 100%; max-width: 100px; height: 1px; background: #FFFFFF; margin: 0 auto; opacity: .5;
    /* opacity: 0; visibility: hidden; */
    display: none;
}
.box4Line::before{ display: block; content: ""; width: 5px; height: 5px; border-radius: 50%; background: #FFFFFF; position: absolute; left: 50%; top: 50%; margin: -3px 0 0 -2px;}
.box4Info{ display: none;}
.box4Text{ font-size: 14px; line-height: 36px; -webkit-line-clamp: 6; margin: .2rem 0 .5rem;
    /* opacity: 0; visibility: hidden; transform: translateY(10px); */
}
.box2More .box4More{ background: none; border:1px solid #74d1f9;
    /* opacity: 0; visibility: hidden; transform: translateY(10px); */
}
.box2More .box4More span{ background-image: linear-gradient(to right,#74d1f9,#1db7f9); -webkit-background-clip:text; -webkit-text-fill-color:transparent;}
.box2More .box4More:hover{ transform: translateY(0); background-image: linear-gradient(to right,#74d1f9,#1db7f9); color: #FFFFFF;}
.box2More .box4More:hover span{ color: #FFFFFF; background: none; -webkit-text-fill-color: #FFFFFF;}
.box4Prev,
.box4Next{ display: block; width: 25px; height: 40px; position: absolute; top: 50%; margin-top: -20px; cursor: pointer;}
.box4Prev{ left: 0; transform: translateX(-100%); background: url(../images/btn_Prev.png) left center no-repeat;}
.box4Next{ right: 0; transform: translateX(100%); background: url(../images/btn_Next.png) right center no-repeat;}
.box4List .swiper-slide-active .box4Item{ transform: translateY(-5%);}
.box4List .swiper-slide-active .box4Cir::before{ transform: scale(1);}
.box4List .swiper-slide-active .box4Cir::after{ opacity: 1; bottom: 0; transition: all .3s linear .3s;}
/* .box4List .swiper-slide-active .box4Line{ opacity: 0.5; visibility: visible;} */
/* .box4List .swiper-slide-active .box4Text{ opacity: 1; visibility: visible; transform: translateY(0); transition: all 1s linear 0s;} */
/* .box4List .swiper-slide-active .box4More{ opacity: 1; visibility: visible; transform: translateY(0); transition: all .5s linear .3s;} */
/* .box4List .swiper-slide-active .box4Con{ transform: scale(1.5);} */
/* .box4Con:hover{ transform: scale(1.1);} */

/*boxBg5*/
.boxBg5{ background:url(../images/home/boxBg5.jpg) center center #FFFFFF no-repeat; background-size:cover;}
.box5Tit{ font-size:44px; font-size:2.29vw; color:#333333; line-height:120%; text-align:center; margin:.2rem 0;}
.box5Tab{ text-align:center; margin:.2rem -.12rem; font-size:0;}
.box5Tab li{ font-size:16px; color:#333333; line-height:40px; padding:0 .12rem;}
.box5Tab li a,
.box5Tab li span{ display:block; width:130px; border-radius:20px; color: #333333; background:#FFFFFF; box-shadow:0 0 15px rgba(0,0,0,0.1); cursor:pointer;}
.box5Tab li.active a,
.box5Tab li.active span{ background:var(--baseColor); color:#FFFFFF;}
.box5List{ width: 90%; max-width:1306px; margin:.3rem auto; position:relative;}
.box5Item{ display:none; background:#FFFFFF; padding:40px; box-shadow:0 0 15px rgba(0,0,0,0.1);}
.box5Link{ display:block;}
.box5Name{ font-size:20px; color:#222222; line-height:30px; height:60px; margin:.1rem 0; -webkit-line-clamp:2;}
.box5Des{ color:#888888; line-height:22px; height:44px; margin:.1rem 0; -webkit-line-clamp:2;}
.box5Time{ display:flex; justify-content:space-between; margin:.1rem 0;}
.box5Time span{ font-size:16px; color:#999999; font-family:Arial;}
.box5Time b{ font-weight:normal; color:var(--baseColor);}
.box5Img{ position:relative; overflow:hidden; height:0; padding-bottom:55.56%; margin-top:.2rem;}
.box5Img .imgBg{ position:absolute; left:0; top:0; right:0; bottom:0; transition:all .5s;}
.box5Link:hover .box5Name{ color:var(--baseColor);}
.box5Link:hover .imgBg{ transform:scale(1.05);}
.box5Prev,.box5Next{ display:block; width:54px; height:54px; border-radius:50%; position:absolute; top:50%; transform:translateY(-50%); background-position:center center; background-size:contain; background-color:var(--baseColor); cursor:pointer;}
.box5Prev{ left:-94px; background-image:url(../images/btn_Prev_Cir.png);}
.box5Next{ right:-94px; background-image:url(../images/btn_Next_Cir.png);}


.oneTit{ text-align: center; font-size: 36px; color: #333333; line-height: 1.8; margin: .2rem 0;}
.oneDes{ text-align: center; font-size: 18px; color: #888888; line-height: 2; margin: -.2rem auto .2rem; max-width: 1030px;}
.onePrev,.oneNext{ display:block; width:54px; height:54px; border-radius:50%; position:absolute; top:50%; margin-top:-27px; background-position:center center; background-repeat:no-repeat; background-size:contain; background-color: var(--baseColor); cursor:pointer; z-index:1;}
.onePrev{ left: 0; background-image:url(../images/btn_Prev_Cir.png);}
.oneNext{ right: 0; background-image:url(../images/btn_Next_Cir.png);}
.onePrev.swiper-button-disabled,.oneNext.swiper-button-disabled{ opacity:.1; cursor:no-drop;}

.one1Bg{ position:relative; padding:90px 0; overflow:hidden; text-align: center;}
.one1Box{ position:relative;}
.one1Logo{ max-width:32%; margin: 0 auto;}
.one1Logo img{ max-width:100%; height:auto;}
.one1Text{ font-size:16px; color:#666666; line-height:1.875; margin:.5rem auto; max-width: 1360px;}
.one1Text p{ margin:.2rem 0;}
.one1List{ list-style: none; display: flex; justify-content: space-around; font-size: 16px; color: #888888; line-height: 30px;}
.one1Item p:first-child{ font-size: 90px; line-height: 1; color: var(--baseColor); font-family:Arial;}

.one2Bg{ padding:90px 0 110px; background:url(../images/about/one2Bg.jpg) center center fixed no-repeat; background-size:cover; color:#FFFFFF; overflow:hidden;}
.one2Bg .oneTit{ color: #FFFFFF;}
.one2Box{ max-width: 1390px; margin: 0 auto;}
.one2Tab{ display: flex; justify-content: space-around; position:relative; margin: .5rem 0 .3rem; overflow: hidden;}
.one2Tab::before{ display: block; content: ""; position: absolute; left: 0; top: 58px; width: 100%; height: 14px; background: url(../images/about/one2Tab.png) left 0 repeat-x; background-size: auto 100%;}
.one2Tab li{ position: relative;}
.one2Ico{ display: flex; width: 127px; height: 127px; border: 1px solid #888888; border-radius: 50%; background: #FFFFFF; overflow: hidden; margin: 0 auto; transition: all .3s;}
.one2Ico img{ max-width: 100%;max-height: 100%; margin: 0 auto;}
.one2Tit{ font-size:30px; color:#FFFFFF; line-height:140%; font-weight: normal; text-align:center; padding:.1rem 0; transition:all .3s;}
.one2Tab li{ cursor: pointer;}
.one2Tab li.active .one2Ico{ background-color: var(--baseColor);}
.one2Tab li.active img.shows{ display: none;}
.one2Tab li.active img.hides{ display: block;}
.one2List{ list-style: none; font-size: 16px; color: #888888; line-height: 2; margin-top: .3rem; border: 1px solid #cbcbcb; background: #FFFFFF; padding: 35px 65px; text-align: center; min-height: 240px;}
.one2List h4{ font-size: 30px; color: var(--baseColor); line-height: 1.8; font-family: Arial; font-weight: normal; margin: .1rem 0;}

.one3Bg{ padding:70px 0; overflow:hidden;}
.one3Box{ display: flex; background: #f5f5f5; margin: .5rem 0;}
.one3Img,
.one3Text{ width: 50%; flex-shrink: 0; overflow: hidden;}
.one3Img{ padding: .3rem 0;}
.one3Img .imgBg{ width: 100%; height: 100%; min-height: 530px; background-size: contain;}
.one3Text{ padding: 40px 30px 40px 75px; font-size: 16px; color: #888888; line-height: 2.2; background: url(../images/about/douhao.png) right 50px top 50px no-repeat;}
.one3Text h4{ position: relative; font-size: 24px; color: var(--baseColor); margin: .3rem 0 .1rem;}
.one3Text h4::before{ display: block; content: ""; width: 7px; height: 22px; border-radius: 15px; background: var(--baseColor); position: absolute; left: -15px; top: 50%; margin-top: -11px;}

.one4Bg{ padding:80px 0; background:url(../images/about/one4Bg.jpg) center center no-repeat; background-size:cover; overflow:hidden;}
.one4List{ position:relative; margin:.5rem 0 .2rem; padding: 0 90px;}
.one4List .swiper-container{ padding:.1rem; margin:0 -.1rem;}
.one4Item{ border: 1px solid transparent; max-width: 358px; margin: 0 auto; background:#FFFFFF; padding:.25rem; box-shadow:0 0 .1rem rgba(0,0,0,0.1); overflow: hidden; transition:all .3s;}
.one4Img{ position:relative; overflow:hidden; height:0; padding-bottom:130.7%; transition:all 1s;}
.one4Img .imgBg{ position:absolute; left:0; top:0; right:0; bottom:0; background-size:contain;}
.one4Item:hover{ border: 1px solid var(--baseColor);}

.oneAnchor{ border-radius: 0 5px 5px 0; padding: .1rem .2rem; position: fixed; left: 0%; top: 50%; transform: translateY(-100%); font-size: 16px; color: #999999; line-height: 2; z-index: 5; opacity: 0; left: -50px; visibility: hidden; transition: all .3s;}
.oneAnchor li{ position: relative; padding-left: 27px; margin: .1rem 0; cursor: pointer;}
.oneAnchor li::before{ display: block; content: "";  width: 18px; height: 18px; border: 1px solid #999999; border-radius: 50%; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.oneAnchor li a{ display: block; color: #999999;}
.oneAnchor li.active::before{ border-color: var(--baseColor); background-color: var(--baseColor);}
.oneAnchor.open{ opacity: 1; left: 0; visibility: visible;}

.arTop{ display: flex; margin: 4.4vw 0 3.9vw; background-color: #f3f3f3; font-size: 16px;}
.arImg{ position:relative; width: 55.2%; flex-shrink: 0; overflow: hidden;}
.arImg .imgBg{ display:block; position:absolute; left:0; top:0; right:0; bottom:0; transition:all .8s linear;}
.arImg:hover .imgBg{ transform: scale(1.05);}
.arRig{ flex: 1; overflow: hidden; padding: 2.6vw 3.4vw;}
.arTit{ font-size:24px; color:#333333; line-height:1.4; font-weight: normal; -webkit-line-clamp: 2; margin: .15rem 0;}
.arTit a{ color: #333333;}
.arTime{ display: block; color: #999999; line-height: 1.8; font-family: Arial; margin: .15rem 0;}
.arDes{ color:#888888; line-height:34px; height:102px; margin:.15rem 0 .3rem; -webkit-line-clamp:3}
.arMore a{ color: #999999; transition: all .3s;}
.arTit a:hover,
.arMore a:hover{ color: var(--baseColor);}
.arList{ display: flex; flex-wrap: wrap; list-style: none; margin: 2.6vw -15px;}
.arList li{ width: 33.33%; padding: 0 .15rem; margin-bottom: .4rem;}
.arLink{ padding: 2vw; height: 100%; background-color: #FFFFFF; box-shadow: 0 0 8px rgba(0,0,0,0.1);}

.arBox{ font-size: 16px; color: #888888; line-height: 1.8; width: 90%; max-width: 1200px; margin: 0 auto; padding-top: .4rem;}
.arName{ text-align: center; font-size: 30px; color: #333333; line-height: 1.7; margin: .1rem 0;}
.arInfo{ text-align: center; color: #101010; margin: .1rem 0;}
.arInfo span{ display: inline-block; vertical-align: middle;}
.arInfo span + span::before{ display: inline-block; vertical-align: middle; content: ""; width: 1px; height: 14px; background: #101010; margin: 0 .2rem;}
.arLine{ display: block; width: 100%; height: 1px; background: #cccccc; margin: .3rem 0;}
.arText{ margin: .3rem 0 .5rem;}
.arText p{ margin: .2rem 0;}
.arText img{ display: block; max-width: 100% !important; height: auto !important; margin: .15rem auto;}
.arBot{ padding: 2.6vw 0 3vw; border-top: 1px solid #cccccc; display: flex; justify-content: space-between; align-items: center; margin-top: .3rem;}
.arPage{ flex: auto; overflow: hidden; color: #888888; line-height: 1.6;}
.arPage a{ color: #888888; transition: all .5s;}
.arPage a:hover{ color: var(--baseColor);}
.goList{ display: block; width: 180px; line-height: 46px; background: #e1e1e1; text-align: center; border-radius: 5px; font-size: 16px; color: #333333; margin-left: 15px; transition: all .3s;}
.goList:hover{ background: var(--baseColor); color: #FFFFFF;}

/* join */
.joinTop{ position: relative; overflow: hidden; margin: .3rem 0 .5rem;}
.joinTopImg{ height: 430px;}
.joinTopImg .imgBg{ height: 100%;}
.joinTopText{ position: absolute; left: 0; top: 0; width: 70%; height: 100%; max-width: 750px; color: #FFFFFF; font-size: 18px; line-height: 36px; padding: 0 100px; display: flex; flex-direction: column; justify-content: center;}
.joinTopText h3{ font-size: 200%;}
.joinTopDes{ margin: .2rem 0 0; -webkit-line-clamp: 4;}
.joinPrev,
.joinNext{ display: block; width: 18px; height: 30px; position: absolute; top: 50%; margin-top: -15px; z-index: 1; cursor: pointer;}
.joinPrev{ background: url(../images/btn_Prev_Arrow.png) left center no-repeat; left: .3rem;}
.joinNext{ background: url(../images/btn_Next_Arrow.png) right center no-repeat; right: .3rem;}
.one .joinPrev,
.one .joinNext{ display: none;}
.joinTab{ margin: .6rem -.2rem; display: flex; justify-content: center; text-align: center;}
.joinTab li{ padding: 0 .2rem; width: 50%; max-width: calc(212px + 0.4rem);}
.joinTab li a{ position: relative; display: block; width: 100%; line-height: 54px; background: #e8e8e8; font-size: 24px; color: #333333; border-radius: 4px;}
.joinTab li a::after{ display: none; content: ""; width: 0; height: 0; border-top: 8px solid var(--baseColor); border-left: 7px solid transparent; border-right: 7px solid transparent; position: absolute; left: 50%; margin-left: -7px; top: 100%;}
.joinTab li a:hover{ color: var(--baseColor);}
.joinTab li.active a{ background: var(--baseColor); color: #FFFFFF;}
.joinTab li.active a::after{ display: block;}
.joinBg{ background: #f6f6f6; padding: 4.69vw 0 6vw; position: relative;}
.joinList{ background: #FFFFFF; padding: 0 40px; box-shadow: 0 .1rem .3rem rgba(0,0,0,0.1);}
.joinList li{ border-bottom: 1px solid #dbdbdb;}
.joinList li:last-child{ border: none;}
.joinH4{ overflow: hidden; font-weight: normal; transition: all .5s; padding: 2.7vw 0; cursor: pointer;}
.joinName { padding-left: .15rem; overflow: hidden; font-size: 24px; color: var(--baseColor); font-weight: bold; line-height: 35px;}
.joinIco { float: right; width: 40px; font-size: 0; text-align: right;}
.joinIco i{ position: relative; display: inline-block; vertical-align: middle; width: 35px; height: 35px; background: var(--baseColor);}
.joinIco i::before,
.joinIco i::after { display: block; content: ""; background: #FFFFFF; position: absolute; left: 50%; top: 50%;}
.joinIco i::before { width: 14px; height: 2px; margin: -1px 0 0 -7px;}
.joinIco i::after { width: 2px; height: 14px; margin: -7px 0 0 -1px; transition: all .3s;}
.joinText{ padding: 0 0 40px .15rem; font-size: 16px; color: #888888; line-height: 30px; display: none;}
.joinText a{ color: #888888;}
.joinInfo{ margin-top: .2rem;}
.joinList li.active .joinIco i:after{ transform: rotate(90deg);}

.jobBg{ padding: .5rem 0;}
.celueBg{ background-color: #f6f6f6;}
.celueList{ display: flex; flex-wrap: wrap; justify-content: center; margin: 0 .15rem; margin-top: .3rem; text-align: center;}
.celueList li{ width: 33.33%; padding: 0 .15rem;}
.celueItem{ display: block; background:#FFFFFF; height: 100%; transition: all .5s;}
.celueImg{ position: relative; height: 0; overflow: hidden; padding-bottom: 37.8%; background-color: #000000;}
.celueImg .imgBg{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: .5; transition: all 1s;}
.celueTit{ position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%; color: #FFFFFF; padding: .1rem .2rem; font-size: 24px; line-height: 1.5;}
.celueText{ padding: .2rem; font-size: 16px; color: #333333; line-height: 1.6;}
.celueText p{ margin: .1rem 0;}
.celueItem:hover{ box-shadow: 0 0 .1rem rgba(0,0,0,0.1); transform: translateY(-5px);}
.celueItem:hover .imgBg{ opacity: .6;}

.fazhanBg{ background-color: #FFFFFF;}
.fazhanBg .oneDes{ color: #333333; font-size: 16px;}
.fazhanList{ display: flex; flex-wrap: wrap; justify-content: center; margin: .5rem auto .3rem;}
.fazhanList li{ position: relative; width: 25%; display: flex; align-items: center;}
.fazhanCir{ display: block; width: 180px; height: 180px; border-radius: 50%; background-color: var(--baseColor); color: #FFFFFF; text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; flex-shrink: 0;}
.fazhanCir img{ width: auto; height: 60px; margin: 0 auto .1rem;}
.fazhanCir h3{ font-size: 20px;}
.fazhanText{ flex: auto; font-size: 16px; color: #333333; line-height: 1.6; overflow: hidden; text-align: center;}
.fazhanText i{ display: block; width: 100%; max-width: 137px; height: 17px; background: url(../images/join/fazhan_arrow.png) right center no-repeat; margin: 0 auto;}

.fuliBg{ background: url(../images/join/fuliBg.jpg) center center no-repeat; background-size: cover;}
.fuliBg .oneTit{ color: #FFFFFF;}
.fuliList{ display: flex; flex-wrap: wrap; justify-content: center; margin: 0 -.14rem; margin-top: .3rem; text-align: center;}
.fuliList li{ width: 20%; padding: .14rem;}
.fuliItem{ background: #FFFFFF; height: 100%; padding: 25px; transition: all .5s;}
.fuliIco{ height: 60px; margin: .1rem auto;}
.fuliIco img{ display: block; width: auto; height: 100%; margin: 0 auto;}
.fuliTit{ font-size: 28px; color: #222222; line-height: 1.4; margin: .2rem 0;}
.fuliDes{ font-size: 16px; color: #777777; line-height: 1.75; margin: .2rem 0;}
.fuliItem:hover{ box-shadow: 0 0 .1rem rgba(0,0,0,0.1); transform: translateY(-5px);}
.fuliItem:hover .fuliIco{ animation: tada 1s linear 1;}

.jobBg .joinList{ margin: .4rem 0;}
.lcList{ display: flex; justify-content: space-between; margin: .3rem -.25rem; text-align: center;}
.lcList li{ position: relative; flex: 1; padding: 0 .25rem;}
.lcList li::before{ display: block; content: ""; width: 100%; height: 1px; background: #d2d2d2; position: absolute; left: 50%; top: 50%;}
.lcList li::after{ display: block; content: ""; width: 38px; height: 38px; background: url(../images/join/lcIco.png) center center no-repeat; background-size: contain; position: absolute; left: 100%; top: 50%; transform: translate(-50%,-50%);}
.lcList li:last-child::before,
.lcList li:last-child::after{ display: none;}
.lcItem{ width: 100%;}
.lcCon{ position: relative; height: 0; padding-bottom: 100%; border-radius: 50%; overflow: hidden; background-color: var(--baseColor); font-size: 28px; line-height: 1.2;}
.lcCon p{ position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%; color: #FFFFFF;}
.lcLi2 .lcCon{ background-color: #2b75c9;}
.lcLi3 .lcCon{ background-color: #609fe7;}

/* contact */
.conBg{ padding: .4rem 0;}
.conBg.whiteBg{ background: #FFFFFF;}
.conBg.grayBg{ background: #f6f6f6;}
.contact{ display: flex; border-radius: .1rem; overflow: hidden;}
.conText{ position: relative; width: 40%; flex-shrink: 0; padding: 3.125vw 4vw; color: #FFFFFF; font-size: 20px; line-height: 1.8; background: url(../images/contact/douhao.png) right .3rem top .5rem var(--baseColor) no-repeat;}
.conTit{ font-size: 30px; line-height: 1.4; font-weight: normal; margin: 5px 0;}
.conTit span{ margin-left: 1vw; font-size: 110%;}
.conLine{ display: block; width: 100%; height: 1px; background: #FFFFFF; opacity: .3; margin: 1vw 0;}
.conLef p{ margin: .1rem 0;}
#map{ flex: 1; overflow: hidden;}
.BMapLabel{ max-width: none;}
.conList{ display: flex; flex-wrap: wrap; margin: .25rem -.15rem; font-size: 16px; color: #333333; line-height: 1.6;}
.conList li{ width: 50%; padding: .15rem;}
.conItem{ height: 100%; background: #FFFFFF; box-shadow: 0 0 8px rgba(0,0,0,0.1); border: 4px solid transparent; padding: 25px; padding-left: 70px; transition: all .5s;}
.conItem h3{ position: relative; font-size: 24px; color: var(--baseColor); line-height: 1.4; margin-bottom: .1rem;}
.conItem h3::before{ display: block; content: ""; width: 10px; height: 10px; background: var(--baseColor); position: absolute; left: -28px; top: 10px;}
.conItem:hover{ border-color: var(--baseColor);}

.proDes{ font-size: 16px; color: #888888; line-height: 1.875; text-align: center; margin: .2rem 0;}
.dlBg1{ padding: .6rem 0;}
.dl1List{ margin-top: .5rem;}
.dl1List li{ margin: .2rem 0; border: 1px solid #cfcfcf; border-radius: 5px; display: flex; min-height: 215px;}
.dl1Img{ width: 23.47%; flex-shrink: 0; border-radius: 5px; overflow: hidden;}
.dl1Img .imgBg{ display: block; height: 100%;}
.dl1Rig{ flex: auto; padding: .2rem 3vw; display: flex; flex-direction: column; justify-content: center; transition: all .3s;}
.dl1Tit{ font-size: 20px; color: #333333; line-height: 1.5; margin: .1rem 0; width: 100%;}
.dl1Con{ font-size: 16px; color: #888888; line-height: 26px; -webkit-line-clamp: 5; width: 100%;}
.dl1List li:hover .dl1Rig{ box-shadow: 2px 2px 5px rgba(0,0,0,0.1);}
.dlBg2{ padding: .6rem 0; background-color: #F6F6F6;}
.dl2List{ margin: 0 -30px; margin-top: 30px;}
.dl2List li{ padding: 0 30px;}
.dl2List .celueItem{ border-radius: .06rem; overflow: hidden;}
.dl2List .celueImg{ padding-bottom: 63.72%; background-color: transparent;}
.dl2List .celueImg .imgBg{ opacity: 1;}
.dl2List .celueText{ color: #888888;}
.dlBg{ padding: 100px 0;}
.dlBox{ display: flex; align-items: center;}
.dlImg{ width: 46.52%; flex-shrink: 0;}
.dlImg img{ max-width: 100%; height: auto;}
.dlText{ flex: auto; overflow: hidden; margin-left: 4.68vw;}
.dlBox .oneTit,
.dlBox .proDes{ text-align: left;}
.dlBg:nth-child(2n){ background-color: #F6F6F6;}
.dlBg:nth-child(2n) .dlBox{ flex-direction: row-reverse;}
.dlBg:nth-child(2n) .dlText{ margin-left: 0; margin-right: 4.68vw;}

.dlBg3{ padding: .5rem 0; background: url(../images/product/proBg.jpg) center center no-repeat; background-size: cover; overflow: hidden;}
.dl-range{ list-style: none; display: flex; flex-wrap: wrap; margin: .3rem -.14rem;}
.dl-range li{ width: 50%; padding: .15rem .14rem;}
.dl-range li a{ position: relative; display: block; font-size: 22px; color: #0f0f0f; line-height: 35px; padding: 40px 54px; background-color: #FFFFFF; box-shadow: 0 .02rem .1rem rgba(26, 76, 152, 0.1); transition: all .3s;}
.dl-range li a::before{ display: block; content: ""; position: absolute; left: 0; top: 50%; width: 6px; max-width: .06rem; height: 30px; margin-top: -15px; background-color: #154896;}
.dl-range li a i{ float: right; width: 35px; height: 35px; background-image: url(../images/product/dl-arrow.png); background-position: center center; background-size: contain; background-repeat: no-repeat; border-radius: 50%; transition: all .3s;}
.dl-range li a:hover{ color: #FFFFFF; background: url(../images/product/dl-bg.png) center center #1a4c98 no-repeat; background-size: cover;}
.dl-range li a:hover::before{ background-color: #FFFFFF;}
.dl-range li a:hover i{ background-color: #FFFFFF;}

.dlTab{ list-style: none; display: flex; justify-content: center; font-size: 30px; color: #0a0204; text-align: center;}
.dlTab li{ border: 1px solid #b4b4b4; overflow: hidden;}
.dlTab li span{ display: block; line-height: 36px; padding: .25rem; min-width: 3.38rem; cursor: pointer;}
.dlTab li:first-child{ border-top-left-radius: .1rem; border-bottom-left-radius: .1rem;}
.dlTab li:last-child{ border-top-right-radius: .1rem; border-bottom-right-radius: .1rem;}
.dlTab li span:hover{ color: #00479d;}
.dlTab li.active{ border-color: #00479d;}
.dlTab li.active span{ background-color: #00479d; color: #FFFFFF;}
.dlWrap{ margin: .7rem 0;}
.dlItem{ position: relative; text-align: center; background: url(../images/product/dlItemBg.png) center top no-repeat; padding: 0 40px;}
.dlIco{ display: flex; flex-direction: column; justify-content: center; align-items: center; width: 150px; height: 150px; max-width: 1.2rem; max-height: 1.2rem; margin:  0 auto .3rem; background-color: #00479d; border-radius: 50%;}
.dlIco img{ display: block; max-width: 100%; max-height: 100%; margin: 0 auto;}
.dlTit{ font-size: 26px; color: #0a0204; font-weight: bold; margin: .2rem auto;}
.dlDes{ font-size: 16px; color: #888888; line-height: 26px; max-width: 210px; margin: .1rem auto;}
.dlBtn span{ display: block; position: absolute; top: 58px; width: 36px; height: 36px; border: 1px solid #888888; background-color: #FFFFFF; background-position: center center; background-repeat: no-repeat; background-size: contain; border-radius: 50%; cursor: pointer; z-index: 1;}
.dlPrev{ left: 0; background-image: url(../images/product/dl-prev.png);}
.dlNext{ right: 0; background-image: url(../images/product/dl-next.png);}
.dlBtn span:hover{ border-color: #00479d;}
.dlItem .swiper-slide:hover .dlIco img{ animation: swing 1s linear;}
.dlItem .swiper-slide:hover .dlTit{ color: #00479d;}

.d3List li{ margin: .25rem 0; border: none; border-radius: 0; box-shadow: 0 .02rem .1rem rgba(26, 76, 152, .2);}
.d3List .dl1Rig{ padding: .2rem 120px;}
.d3List .dl1Tit{ font-size: 26px; color: #0a0204; font-weight: bold;}

.equipBg2{ background-color: #F6F6F6; overflow: hidden;}
.equipBg2 .proDes{ margin: .6rem 0;}
.equipList{ display: flex; flex-wrap: wrap; margin: 0 -22px 60px; text-align: center;}
.equipList li{ width: 33.33%; padding: 0 22px; margin-bottom: 44px;}
.equipList .celueItem{ border-radius: .06rem; overflow: hidden;}
.equipList .celueImg{ padding-bottom: 62.14%; background-color: transparent;}
.equipList .celueImg .imgBg{ opacity: 1;}
.equipList .celueText{ color: #888888;}
.equipTit{ font-size: 26px; color: #0a0204; line-height: 1.4; margin: .1rem 0;}
.equipDes{ max-width: 360px; margin: .1rem auto;}
.equipMore{ display: block; width: 130px; line-height: 40px; background-color: #00479d; color: #FFFFFF; text-align: center; border-radius: 20px; margin: .1rem auto; transition: all .3s;}
.equipMore:hover,.equipMore:focus{ color: #FFFFFF; box-shadow: 0 3px 0 rgba(0,0,0,0.5);}
.equipMore img{ vertical-align: middle; margin-top: -2px; margin-right: 5px;}

.textBg1{ padding: 0 0 .7rem;}
.textTop{ border: 1px solid #d1d1d1; border-radius: 5px; display: flex; align-items: center; overflow: hidden;}
.textTop_Img{ width: 46.67%; overflow: hidden; flex-shrink: 0;}
.textTop_Img2{ width: 35%;}
.textTop_Img img{ display: block; width: 100%; height: auto;}
.textTop_Right{ padding: 25px 50px; overflow: hidden;}
.textTop_Tit{ font-size: 36px; color: #0a0204; line-height: 1.2; margin: .2rem 0;}
.textTop_Con{ font-size: 16px; color: #888888; line-height: 26px; height: 130px; -webkit-line-clamp: 5; margin: .2rem 0;}
.downBtn{ width: 160px; margin: .2rem 0;}
.textBg2{ background-color: #f5f6f7; padding: .4rem 0;}
.text{ margin: .2rem 0; font-size: 16px; color: #666666; line-height: 2;}
.text p{ margin: .1rem 0;}
.text img{ max-width: 100% !important; height: auto;}
.textBg3{ padding: .6rem 0;}
.useList{ list-style: none; display: flex; flex-wrap: wrap; margin: 0 -20px;}
.useList li{ width: 33.33%; padding: 0 20px; margin-top: 30px;}
.useLink{ display: block;}
.useImg{ position: relative; height: 0; padding-bottom: 68.8%; overflow: hidden; background-color: #e2f2fe; border-radius: 5px; margin-bottom: .2rem;}
.useImg .imgBg{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; transition: all 1s;}
.useTit{ font-size: 24px; color: #333333; line-height: 1.6; margin: .1rem 0 5px;}
.useDes{ font-size: 16px; color: #888888; line-height: 30px; -webkit-line-clamp: 2;}
.useLink:hover .imgBg{ transform: scale(1.05);}
.useLink:hover .useTit{ color: var(--baseColor);}


.LayBg{ position:fixed; left:0; top:0; right:0; bottom:0; background:rgba(0,0,0,0.6); z-index:10; display:flex; flex-direction:column; justify-content:center; align-items:center; overflow: hidden; padding:.3rem; opacity:0; visibility:hidden; transition:all .4s;}
.LayBox{ position:relative; display:block; max-width:1200px; width:calc(96% + 30px); background:#FFFFFF; padding:10px; border-radius:.1rem; min-height: 100px; z-index:11; opacity:0; visibility:hidden; transition:all .4s;}
.LayCase{ max-width: 1400px;}
.LayClose{ position: absolute; right: 10px; top: 10px; width: 24px; height: 24px; background: url(../images/LayClose.png) center center no-repeat; cursor: pointer; z-index: 2;}
.LayBg.active,.LayBox.active{ opacity:1; visibility:visible;}

.useLay{ display: flex; align-items: center; justify-content: space-between;}
.useLayImg{ width: 39.5%; flex-shrink: 0; margin-right: .14rem;}
.useLayImg img{ display: block; width: 100%; height: auto; border-radius: .1rem;}
.useLayText{ flex: auto; padding: 0 60px;}
.useLayTit{ font-size: 24px; color: #333333; line-height: 30px; margin: .2rem 0;}
.useLayCon{ font-size: 16px; color: #888888; line-height: 30px; max-height: 60vh; overflow-y: auto; margin: .2rem 0;}
.useLayCon::-webkit-scrollbar {
    width: .06rem;
    max-width: 5px;
    height: 1px;
}
.useLayCon::-webkit-scrollbar-thumb {
    border-radius: .1rem;
     box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
    background: var(--baseColor);
}
.useLayCon::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
    border-radius: .1rem;
    background: #EDEDED;
}

.designList{ list-style: none; display: flex; flex-wrap: wrap; margin: .4rem -20px;}
.designList li{ width: 50%; padding: 15px 20px;}
.designLink{ display: block; background-color: #FFFFFF; height: 100%; padding: .2rem; padding-right: 0; display: flex; transition: all .3s;}
.designImg{ width: 42%; flex-shrink: 0; overflow: hidden; background-color: #e0f2ff;}
.designImg .imgBg{ display: block; width: 100%; height: 100%; background-size: contain; transition: all 1s;}
.designText{ flex: auto; overflow: hidden; padding: 0 35px;}
.designTit{ font-size: 26px; color: #0a0204; line-height: 36px; height: 72px; margin: .1rem 0; transition: all .3s;}
.designDes{ font-size: 16px; color: #888888; line-height: 26px; height: 130px; margin: .1rem 0; -webkit-line-clamp: 5;}
.designText .equipMore{ margin: .2rem 0 0;}
.designLink:hover .imgBg{ transform: scale(1.05);}
.designLink:hover .designTit{ color: var(--baseColor);}

.designTd{ display: block; background-color: #FFFFFF; padding: 65px 70px; margin: .3rem 0;}
.designLeft{ float: left; max-width: 30%; margin-right: 50px;}
.designLeft img{ max-width: 100%; height: auto;}
.designRight{ overflow: hidden; font-size: 16px; color: #888888; line-height: 30px; padding: .1rem 0 0;}
.designRight p{ position: relative; padding-left: 15px;}
.designRight p::before{ display: block; content: ""; width: 4px; height: 4px; border-radius: 60%; background-color: var(--baseColor); position: absolute; left: 0; top: 13px;}

.proBox{ padding: 5.2vw 0; display: flex; align-items: center;}
.proImg{ max-width: 46.53%; flex-shrink: 0; margin-right: 30px;}
.proImg img{ max-width: 100%; height: auto; border-radius: 4px;}
.proText{ flex: auto; overflow: hidden; font-size: 16px; color: #888888; line-height: 26px; padding: 0 60px;}
.proText .oneTit{ text-align: left;}
.proText p{ margin: .15rem 0;}

.soluList{ display: flex; flex-wrap: wrap; margin: .75rem auto;}
.soluList li{ width: 50%; padding: 24px;}
.soluLink{ display: block; overflow: hidden; border-radius: 5px; border: 1px solid #cfcfcf; height: 100%;}
.soluImg{ position: relative; height: 0; padding-bottom: 51.35%; overflow: hidden;}
.soluImg .imgBg{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; transition: all 1s;}
.soluIco{ display: block; width: 160px; height: 160px; background-color: var(--baseColor); border-radius: 50%; position: absolute; left: 50%; top: 50%; margin: -80px 0 0 -80px; transition: all 1s;}
.soluIco img{ display: block; margin: 0 auto; width: 100%; height: 100%;}
.soluText{ padding: .1rem .3rem;}
.soluDes{ font-size: 16px; color: #888888; line-height: 26px; height: 78px; margin: .2rem auto; max-width: 543px;}
.soluMore{ display: block; width: 160px; line-height: 38px; border: 1px solid #48c4f9; color: #48c4f9; text-align: center; margin: .2rem auto; border-radius: 20px; transition: all .5s;}
.soluLink:hover .imgBg{ transform: scale(1.05);}
.soluLink:hover .soluIco{ transform: scale(0.95);}
.soluLink:hover .oneTit{ color: var(--baseColor);}
.soluLink:hover .soluMore{ border-color: var(--baseColor); background-color: var(--baseColor); color: #FFFFFF;}

.soluBg{ padding: .5rem 0;}
.soluBox1{ background-color: #f6f6f6; margin: .5rem 0 .3rem; border-radius: 5px; display: flex; align-items: center;}
.solu1Img{ float: left; max-width: 48%; margin-right: 15px; flex-shrink: 0;}
.solu1Img img{ display: block; width: 100%; height: auto; border-radius: 5px;}
.solu1Rig{ flex: auto; overflow: hidden; font-size: 16px; color: #888888; line-height: 30px; padding: .2rem .3rem .3rem;}
.solu1Rig .oneTit{ text-align: left;}

.soluBg2{ background-color: #f6f6f6;}
.ysList{ display: flex; flex-wrap: wrap; margin: 0 -42px; text-align: center;}
.ysList li{ width: 33.33%; padding: 20px 42px;}
.ysLink{ display: block; background-color: #FFFFFF; height: 100%; border-radius: 5px; overflow: hidden; padding: .3rem; transition: all .3s;}
.ysIco{ display: block; width: 102px; height: 102px; border-radius: 50%; background-color: var(--baseColor); text-align: center; margin: .3rem auto;}
.ysIco img{ display: block; width: 100%; height: 100%;}
.ysTit{ font-size: 24px; color: #333333; line-height: 1.2; margin: .2rem auto;}
.ysDes{ font-size: 16px; color: #888888; line-height: 30px; margin: .15rem auto; max-width: 320px;}
.ysLink:hover{ box-shadow: 0 0 .1rem rgba(0,0,0,0.1); transform: translateY(-5px);}
.ysLink:hover .ysIco img{ transform: scaleX(-1); transition: all .5s;}

.soluBg3 .caseList{ margin-top: .3rem !important; margin-bottom: 0 !important;}
.caseText{ font-size: 14px; color: #888888; line-height: 26px;}
.caseText::-webkit-scrollbar {
    width: .06rem;
    max-width: 5px;
    height: 1px;
}
.caseText::-webkit-scrollbar-thumb {
    border-radius: .1rem;
     box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
    background: var(--baseColor);
}
.caseText::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
    border-radius: .1rem;
    background: #EDEDED;
}
.caseBtn{ position: absolute; left: 58%; bottom: 0; display: flex; z-index: 2;}
.caseBtn span{ display: block; width: 48px; height: 48px; border-radius: 50%; margin-right: 20px; background-color: #d4d4d4; background-position: center center; background-repeat: no-repeat; cursor: pointer; transition: all .3s;}
.casePrev{ background-image: url(../images/btn_Prev_Cir.png);}
.caseNext{ background-image: url(../images/btn_Next_Cir.png);}
.caseBtn span:hover{ background-color: var(--baseColor);}
.caseLay{ position: relative; margin: 20px;}
.caseLay .swiper-slide{ background-color: #FFFFFF;}
.caseLayCon{ display: flex;}
.caseLayCon .caseImg{ width: 55%; height: auto; flex-shrink: 0; padding: 0; margin-right: 3%;}
.caseLayCon .caseImg .imgBg{ position: static;}
.caseLayCon .caseImg img{ display: block; width: 100%; height: auto;}
.caseLayCon .caseRig{ flex: auto; overflow: hidden; padding-bottom: 60px;}
.caseLayCon .caseRig .caseTit{ text-align: left; font-size: 28px;}
.caseLayCon .caseRig .caseText{ display: block !important; max-height: calc(100% - 60px); overflow-y: auto;}

.caseList{ display: flex; flex-wrap: wrap; margin: .6rem -40px;}
.caseList li{ width: 33.33%; padding: 0 40px; margin-top: 20px;}
.caseLink{ display: block;}
.caseImg{ position: relative; height: 0; padding-bottom: 67%; border-radius: 5px; overflow: hidden;}
.caseImg .imgBg{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; transition: all 1s;}
.caseTit{ font-size: 24px; color: #333333; line-height: 1.4; text-align: center; margin: 25px 0; transition: all .3s;}
.caseLink:hover .imgBg{ transform: scale(1.05);}
.caseLink:hover .caseTit{ color: var(--baseColor);}

.product{ width: 96%; max-width: 1680px; margin: 0 auto;}
.proLeft{ float: left; width: 20.47%; margin-right: 3%;}
.proBtn{ display: none;}
.proNav{ list-style: none;}
.proNav a{ color: #FFFFFF;}
.proNav > li{ position: relative; margin-bottom: .12rem; background-color: #154896;}
.proNav > li > h2{ display: flex; justify-content: space-between; align-items: center; padding: 0 .2rem; cursor: pointer;}
.proNav > li > h2 > a{ font-size: 20px; line-height: 64px; line-height: 54px;}
.proNav > li > h2 > i{ display: block; width: 12px; height: 12px; background: url(../images/product/pro-arrow.png) center center no-repeat; transition: all .3s;}
.proNav > li > ul{ list-style: none; padding: .2rem; background-color: #7ba1dc; display: none;}
.proNav > li > ul > li{ margin: .08rem 0;}
.proNav > li > ul > li > a{ line-height: 24px; padding-bottom: 3px;}
.proNav > li > ul > li > a:hover{ border-bottom: 1px solid #FFFFFF;}
.proNav > li.active h2 > i{ transform: rotate(90deg);}
.proRight{ overflow: hidden;}
.proList{ display: flex; flex-wrap: wrap; margin: 0 -25px; text-align: center;}
.proList li{ width: 33.33%; padding: 0 25px 50px;}
.proLink{ display: block; background-color: #FFFFFF; padding: .1rem; height: 100%; overflow: hidden;}
.proLink .pic{ position: relative; padding-bottom: 59.25%; overflow: hidden; margin: .3rem auto;}
.proLink .pic .imgBg{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: contain; transition: all 1s;}
.proTit{ font-size: 16px; color: #333333; line-height: 2; margin: .2rem auto;}
.proLink:hover .proTit{ color: var(--baseColor);}
.proButton{ display: flex; text-align: center; margin-top: .5rem;}
.proButton a{ width: 48%; max-width: 166px; line-height: 49px; color: #FFFFFF; font-size: 18px; background-color: #154896; border-radius: .1rem;}
.proButton a + a{ margin-left: 2%;}
.proButton .down i{ display: inline-block; vertical-align: middle; width: 18px; height: 18px; background: url(../images/product/download.png) center center no-repeat; margin-left: .2rem;}

.pro-swiper{ position: relative; text-align: center;}

.solu-top-list{ position: relative; list-style: none; display: flex; justify-content: space-between; max-width: 1200px; margin: 0 auto 1rem;}
.solu-top-list::before{ display: block; content: ""; width: 90%; height: 1px; background-color: #a7a7a7; position: absolute; left: 0; right: 0; margin: 0 auto; top: 50px; z-index: -1;}
.solu-top-list li{ flex: 1;}
.solu-top-list li a{ display: block;}
.solu-top-icon{ position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 105px; height: 105px; max-width: 1.1rem; max-height: 1.1rem; border: 1px solid #a7a7a7; background-color: #FFFFFF; border-radius: 50%; margin: 0 auto; z-index: 1; transition: all .3s;}
.solu-top-icon img{ display: block; max-width: 100%; max-height: 100%; margin: 0 auto;}
.solu-top-hover{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: scale(0); opacity: 0; visibility: hidden; transition: all .3s;}
.solu-top-title{ font-size: 16px; color: #888888; line-height: 1.4; margin: .1rem auto; text-align: center;}
.solu-top-list li.active .solu-top-icon,
.solu-top-list li a:hover .solu-top-icon{ background-color: var(--baseColor); border-color: var(--baseColor);}
.solu-top-list li.active .solu-top-hover,
.solu-top-list li a:hover .solu-top-hover{ transform: scale(1); opacity: 1; visibility: visible;}
.solu-top-list li.active .solu-top-title,
.solu-top-list li a:hover .solu-top-title{ color: var(--baseColor);}

.solu-text{ background-color: #FFFFFF; padding: .5rem .3rem; text-align: center; font-size: 16px; color: #888888; line-height: 1.8; overflow: hidden;}
.solu-text img{ display: block; max-width: 100% !important; height: auto !important; margin: .2rem auto;}
.solu-text p{ max-width: 930px; margin: 0 auto;}
.solu-proList{ margin-top: .4rem;}
.solu-proList .proLink{ box-shadow: 0 0 .2rem rgba(229, 229, 229, 1);}
.solu-proList .proLink .pic{ margin: .6rem auto;}
.solu-case{ margin: .4rem -.14rem 0;}
.solu-case li{ padding: 0 .14rem;}
.solu-case .caseImg{ border-radius: 0;}
.solu-case .caseTit{ text-align: left;}

.solu-service{ list-style: none; display: flex; flex-wrap: wrap; text-align: center; margin: .5rem -.15rem 0;}
.solu-service li{ width: 25%; padding: .15rem;}

.solu-map-box{ min-height: 60vh;}
.solu-map{ position: relative; max-width: 1316px; margin: .66rem auto;}
.solu-map-img img{ display: block; max-width: 100%; height: auto;}
.solu-map-list{ list-style: none;}
.solu-map-list li{ position: absolute;}
.solu-map-list li a{ position: relative; display: block; width: 30px; height: 30px; display: flex; flex-direction: column; justify-content: center; align-items: center; z-index: 1;}
.solu-map-list li a i{ position: relative; display: block; width: 15px; height: 15px; background-color: #FFFFFF; border-radius: 50%; border: 5px solid #0854fc; z-index: 1;}
.solu-map-list li a::before,
.solu-map-list li a::after{ display: block; content: ""; width: 30px; height: 30px; border-radius: 50%; background-color: #0854fc; position: absolute; left: 50%; top: 50%; margin: -15px 0 0 -15px; z-index: -1; transform: scale(0); opacity: 0; animation: warn2 2s linear infinite;}
.solu-map-list li a::before{ animation-delay: 1s;}
.solu-map-list li a span{ display: block; position: absolute; left: 100%; top: 0px; white-space: nowrap; background-color: #0854fc; color: #FFFFFF; line-height: 32px; padding: 0 .2rem; min-width: 150px; text-align: center; font-size: 16px; border-radius: 15px; opacity: 0; visibility: hidden; transform: translateX(.1rem); transition: all .3s;}
.solu-map-list li a:hover span{ opacity: 1; visibility: visible; transform: translateX(0);}
.solu-li-1{ left: 3.8%; top: 32.9%;}
.solu-li-2{ left: 11.77%; top: 13.7%;}
.solu-li-3{ left: 28.5%; top: 1.7%;}
.solu-li-4{ left: 67.8%; top: 1.3%;}
.solu-li-5{ left: 84.8%; top: 19%;}
.solu-li-6{ left: 29.9%; top: 32.7%;}
.solu-li-7{ left: 44.6%; top: 20%;}
.solu-li-8{ left: 54.4%; top: 40%;}
.solu-li-9{ left: 5.8%; top: 54.8%;}
.solu-li-10{ left: 16.2%; top: 67.6%;}
.solu-li-11{ left: 60.6%; top: 52.3%;}
.solu-li-12{ left: 44.7%; top: 85%;}
.solu-li-13{ left: 71.2%; top: 79.5%;}
.solu-li-14{ left: 89.7%; top: 67.1%;}

.solu-map-bot{ max-width: 1220px; display: flex; flex-wrap: wrap; justify-content: space-between; margin: .4rem auto; overflow: hidden;}
.solu-map-bot li{ position: relative; flex: auto; font-size: 16px; color: #333333; line-height: 42px; text-align: center; margin: .1rem .25rem; background-color: #FFFFFF;}
.solu-map-bot li a{ position: relative; display: block; color: #333333; border: 1px solid #c9c9c9; padding: 0 .1rem; background-color: #FFFFFF; border-radius: 25px; transition: all .3s; z-index: 1;}
.solu-map-bot li a:hover{ border-color: var(--baseColor); color: var(--baseColor); font-weight: bold;}
.solu-map-bot li::before,
.solu-map-bot li::after{ display: block; content: ""; width: 50px; border-top: 1px dotted #c9c9c9; position: absolute; top: 50%;}
.solu-map-bot li::before{ left: 100%;}
.solu-map-bot li::after{ right: 100%;}
.solu-map-bot li:first-child{ margin-left: 0;}
.solu-map-bot li:last-child{ margin-right: 0;}

@media (min-width:992px){
    .proNav{ display: block !important;}
}
@media (min-width:1600px){
	.container{ width:1470px;}
}
@media (max-width:1600px){
	.boxPd{ padding-top:80px;}
	.boxMore{ font-size:16px;}
	.box2Text{ font-size:16px;}
    .box2List h3{ font-size: 18px;}
    .box3Top{ padding: .3rem 0;}
    .box3Link{ padding: 10vw 5% 0;}
    .box3Text{ padding: 0;}
    .box3Img{ width: 5vw; height: 5vw;}
    .box3Tit{ font-size: 1.56vw; margin: .2rem 0;}
    .box3Des{ font-size: 16px; line-height: 28px; height: 112px;}
    .box3More{ max-width: 130px; line-height: 44px;}
    .box4Item{ height: 380px;}
    .box4Ico{ width: 58px; height: 58px;}
    .box4Tit{ font-size: 18px;}
    .box4Text{ line-height: 30px;}
	.box5Item{ padding:.3rem;}
	.box5Name{ font-size:18px; line-height:24px; height:48px;}
	.box5Time{ font-size:12px;}
	.box5Time span{ font-size:14px;}
	.box5Prev,.box5Next{ width:44px; height:44px;}
	.box5Prev{ left:-60px;}
	.box5Next{ right:-60px;}
    .oneTit{ font-size: 30px;}
    .oneDes{ font-size: 16px;}
	.one1Bg{ padding:.6rem 0;}
	.one1Text{ font-size:15px;}
    .one1List{ font-size: 14px; line-height: 2;}
    .one1Item p:first-child{ font-size: 60px;}
	.one2Bg{ padding:.6rem 0 .9rem;}
    .one2Tab::before{ top: 42px;}
    .one2Ico{ width: 100px; height: 100px;}
    .one2Tit{ font-size: 24px;}
    .one2List{ font-size: 14px; padding: .3rem .4rem; min-height: 2rem;}
    .one2List h4{ font-size: 24px;}
	.one3Bg{ padding:.6rem 0;}
    .one3Box{ margin: .3rem 0 0;}
    .one3Img .imgBg{ min-height: 460px;}
    .one3Text{ padding: .3rem .3rem .3rem .5rem; font-size: 14px; background-size: 100px auto;}
    .one3Text h4{ font-size: 20px;}
	.one4Bg{ padding:.6rem 0;}
	.one4Item{ padding:.15rem; max-width: 320px;}
	.onePrev,.oneNext{ width:44px; height:44px;}

    .arTop{ font-size: 15px;}
    .arTit{ font-size: 22px;}
    .arList li{ margin-bottom: .3rem;}

    .joinTopImg{ height: 400px;}
    .joinTopText{ font-size: 16px;}
    .joinTab{ margin: .4rem -.1rem;}
    .joinTab li{ padding: 0 .1rem; width: calc(160px + 0.2rem);}
    .joinTab li a{ font-size: 18px; line-height: 44px;}
    .joinList{ padding: 0 .3rem;}
    .joinName{ font-size: 20px;}
    .joinIco i{ width: 30px; height: 30px;}
    .joinText{ font-size: 14px;}

    .celueTit{ font-size: 20px;}
    .celueText{ font-size: 15px;}
    .celueText p{ margin: 5px 0;}
    .fazhanBg .oneDes{ font-size: 15px;}
    .fazhanCir{ width: 160px; height: 160px;}
    .fazhanCir img{ height: 50px;}
    .fazhanCir h3{ font-size: 16px;}
    .fazhanText{ font-size: 14px;}
    .fazhanText i{ width: 98%; height: 14px; background-size: auto 100%; max-width: 112px;}
    .fuliList{ margin: 0 -.1rem; margin-top: .3rem;}
    .fuliList li{ padding: .1rem;}
    .fuliIco{ height: 50px;}
    .fuliTit{ font-size: 24px;}
    .fuliDes{ font-size: 15px;}
    .lcList li::after{ width: 30px; height: 30px;}
    .lcCon{ font-size: 24px;}

    .conText{ font-size: 18px;}
    .conTit{ font-size: 26px;}
    .conList{ font-size: 15px; margin: .25rem -.1rem;}
    .conList li{ padding: .1rem;}
    .conItem{ padding: 20px; padding-left: 50px; border-width: 2px;}
    .conItem h3{ font-size: 20px;}
    .conItem h3::before{ width: 8px; height: 8px; left: -20px;}

    .proDes{ font-size: 15px;}
    .dlBg1{ padding: .4rem 0;}
    .dl1List li{ min-height: 200px;}
    .dl1Con{ font-size: 14px;}
    .dl1Tit{ font-size: 18px;}
    .dlBg2{ padding: .4rem 0 .6rem;}
    .dl2List{ margin-left: -.2rem; margin-right: -.2rem;}
    .dl2List li{ padding: 0 .2rem;}
    .dlBg{ padding: .6rem 0;}

    .dl-range{ margin: .3rem -.1rem;}
    .dl-range li{ padding: .1rem;}
    .dl-range li a{ font-size: 18px; line-height: 30px; padding: .3rem .4rem;}
    .dl-range li a i{ width: 30px; height: 30px;}
    .dl-range li a::before{ width: 4px; height: 24px; margin-top: -12px;}
    .dlTab{ font-size: 24px;}
    .dlTab li span{ padding: .15rem; min-width: 2.4rem;}
    .dlWrap{ margin: 3.65vw 0;}
    .dlItem{ background-size: 100% 7.8vw;}
    .dlIco{ width: 7.8vw; height: 7.8vw;}
    .dlTit{ font-size: 22px;}
    .dlDes{ font-size: 14px; line-height: 24px;}
    .dlBtn span{ top: calc(3vw - 6px);}
    .d3List .dl1Rig{ padding: .2rem 6.25vw;}
    .d3List .dl1Tit{ font-size: 22px;}

    .equipBg2 .proDes{ margin: .4rem 0;}
    .equipList{ margin: 0 -.15rem .3rem;}
    .equipList li{ padding: 0 .15rem; margin-bottom: .3rem;}
    .equipTit{ font-size: 22px;}
    .equipMore{ width: 120px; line-height: 36px;}

    .useLayTit{ font-size: 22px;}
    .useLayCon{ font-size: 15px; line-height: 2;}

    .designList{ margin: .4rem -.1rem;}
    .designList li{ padding: .1rem;}
    .designLink{ padding: .15rem;}
    .designText{ padding: 0 .2rem;}
    .designTit{ font-size: 22px; line-height: 30px; height: 60px;}
    .designDes{ font-size: 14px; line-height: 24px; height: 120px;}

    .designTd{ padding: .3rem;}
    .proText{ padding: 0 30px; font-size: 15px;}

    .soluList li{ padding: .15rem;}
    .soluIco{ width: 120px; height: 120px; margin: -60px 0 0 -60px;}
    .soluDes{ font-size: 15px;}

    .ysList{ margin: 0 -30px;}
    .ysList li{ padding: 15px 30px;}
    .ysIco{ width: 90px; height: 90px;}
    .ysTit{ font-size: 20px;}
    .ysDes{ font-size: 14px; line-height: 24px;}

    .caseList{ margin: .5rem -20px;}
    .caseList li{ padding: 0 20px; margin-top: 20px;}
    .caseTit{ font-size: 20px; margin: .15rem 0;}

    .proNav > li > h2 > a{ font-size: 16px; line-height: 54px; line-height: 44px;}
    .proNav > li > ul{ padding: .15rem;}
    .proList{ margin: 0 -1vw;}
    .proList li{ padding: 0 1vw 2vw;}
    .proTit{ margin: .1rem auto;}
    .proButton a{ font-size: 14px; line-height: 42px; max-width: 140px;}
    .proButton .down i{ width: 16px; height: 16px; margin-left: .1rem;}

    .pro-swiper{ margin: 0 .6rem;}
    .solu-map-bot li a{ font-size: 16px; line-height: 40px;}
}
@media (max-width:1400px){
	.box2Text{ font-size:14px;}
	.box2More a{ width:140px; line-height:36px;}
    .box3Des{ font-size: 14px; line-height: 24px; height: 96px;}
    .box4Cir::before{ border-width: .06rem;}
    .box4Cir::after{ width: 40px; height: 40px; max-width: .6rem; max-height: .6rem;}
    .box4Text{ margin: .2rem 0 .3rem;}
	.box5Tab li{ line-height:34px; padding:0 .1rem;}
    .box5Tab li a,
	.box5Tab li span{ width:120px;}
	.box5List{ margin:.2rem auto;}
	.box5Name{ font-size:16px; line-height:22px; height:44px;}
	.box5Des{ font-size:12px;}
	.box5Img{ padding-bottom:48%;}
	.box5More a{ font-size:14px; line-height:40px;}
	.box5More i{ width:16px; height:16px;}
    .oneTit{ font-size: 26px;}
    .one1Text{ font-size: 14px;}
    .one1Item p:first-child{ font-size: 50px;}
    .one3Img .imgBg{ min-height: 400px;}
    .one3Text{ padding: .2rem .2rem .2rem .4rem;}
    .one3Text h4{ font-size: 18px;}
    .joinTopImg{ height: 350px;}
    .joinTopText{ font-size: 14px; line-height: 2;}
    .celueText{ font-size: 14px;}
    .fazhanCir{ width: 140px; height: 140px;}
    .fazhanCir img{ height: 42px;}
    .fazhanCir h3{ font-size: 15px;}
    .fuliIco{ height: 42px;}
    .fuliItem{ padding: 15px;}
    .fuliTit{ font-size: 20px; margin: .15rem 0;}
    .fuliDes{ font-size: 14px; margin: .15rem 0 .2rem;}
    .lcCon{ font-size: 20px;}
    .conText{ padding: 5vw 3vw;}
    .conText{ font-size: 16px;}
    .conTit{ font-size: 24px;}
    .conList{ font-size: 14px;}
    .conItem h3{ font-size: 18px;}
    .proDes{ font-size: 14px;}

    .dl2List{ margin-left: -.1rem; margin-right: -.1rem;}
    .dl2List li{ padding: 0 .1rem;}
    .dlTab{ font-size: 20px;}
    .dlTab li span{ line-height: 1.4; min-width: 2rem;}
    .dlTit{ font-size: 18px; margin: .1rem auto;}
    .d3List .dl1Tit{ font-size: 18px;}

    .equipTit{ font-size: 20px;}
    .textTop_Tit{ font-size: 24px;}
    .textTop_Con{ font-size: 14px; line-height: 24px; height: 120px;}
    .equipMore img{ width: 16px;}
    .text{ font-size: 14px; line-height: 1.6;}
    .textBg3{ padding: .4rem 0;}
    .useList{ margin: 0 -.1rem;}
    .useList li{ padding: 0 .1rem; margin-top: .2rem;}
    .useTit{ font-size: 18px;}
    .useDes{ font-size: 14px; line-height: 24px;}

    .designTit{ font-size: 18px; line-height: 26px; height: 52px;}
    .designDes{ font-size: 14px; line-height: 22px; height: 110px;}
    .designRight{ font-size: 14px; line-height: 28px;}
    .designRight p::before{ top: 12px;}

    .proText{ font-size: 14px; padding-right: 0;}

    .soluList{ margin: .6rem auto;}
    .soluIco{ width: 100px; height: 100px; margin: -50px 0 0 -50px;}
    .soluDes{ font-size: 14px;}
    .soluBox1{ margin: .3rem 0;}
    .solu1Rig{ font-size: 15px;}

    .ysList{ margin: 0 -.2rem;}
    .ysList li{ padding: .1rem .2rem;}

    .caseList{ margin: .5rem -.1rem;}
    .caseList li{ padding: 0 .1rem; margin-top: .1rem;}
    .caseTit{ font-size: 16px; margin: .1rem 0;}

    .solu-top-list{ margin: 0 auto .6rem;}


    .solu-map-bot li a{ font-size: 15px; line-height: 40px;}

}
@media (max-width:1200px){
	#index{ height:auto !important;}
    .banTit{ font-size: .38rem;}
    .banCon{ font-size: .28rem;}
	.boxPd{ padding-top:0;}
	.boxMore{ width:120px; line-height:36px; font-size:14px;}
	.banner{ position:relative; height:6rem;}
	.banText{ font-size:.34rem;}
	.banItem{ padding:.1rem;}
	.boxBg2{ padding:.6rem 0;}
	.boxBg3{ padding:.6rem 0;}
	.boxBg4{ padding:.6rem 0;}
	.boxBg5{ padding:.6rem 0;}
    .box2List{ min-height: 0;}
    .box2List strong{ font-size: .44rem;}
    .box2List h3{ font-size: 16px;}
    .box3Top{ position: static; padding: 0;}
    .box3List{ width: 100%; margin: 0 auto; flex-wrap: wrap; margin-top: .5rem;}
    .box3List li{ flex: none; width: 33.33%; padding: .1rem;}
    .box3Link{ padding: 0;}
    .box3Link::after{ display: none;}
    .box3Text{ padding: .1rem .15rem;}
    .box3Des{ height: auto; -webkit-line-clamp:3;}
    .box3Link:hover .box3Img,
    .box3Link:hover .box3Text{ transform: translateY(0);}
    .box3More{ display: none;}
    .box4Item{ height: auto; min-height: 3rem;}
    .box4Cir{ width: 100%; padding-bottom: 100%;}
    .box4Line{ display: block;}
    .box4Info{ display: block;}
    .box4Text{ line-height: 24px; -webkit-line-clamp: 3;}
	.box5List{ padding:0 40px; width: 100%;}
	.box5Prev{ left:-10px;}
	.box5Next{ right:-10px;}
	.box2Logo,.box2Text,.box2List li,.box2More a,.boxTop,.box3List li,.box4List,.box5Tit,.box5Tab,.box5List,.box5More a{ animation-name:none !important;}

	.one1Bg{ position:relative;}
	.one1Box{ padding-right:0; z-index:1;}
	.one1Logo{ position:static; margin:0 auto .2rem;}
	.one1Text{ max-width:100%; width:100%; margin:.3rem 0; color:#333333;}
    .one2Tit{ font-size: 20px;}
	.one4List{ padding:0 40px;}
	.onePrev{ left:-10px;}
	.oneNext{ right:-10px;}

    .arTop{ margin: .4rem 0; font-size: 14px;}
    .arImg{ width: 45%;}
    .arRig{ padding: .2rem .3rem;}
    .arTit{ font-size: 20px; margin: .1rem 0;}
    .arTime{ margin: .1rem 0;}
    .arDes{ line-height: 24px; height: 72px; margin: .1rem 0;}
    .arBot{ padding: .4rem 0;}
    .goList{ width: 120px; line-height: 40px;}

    .celueList{ margin: 0 -.1rem; margin-top: .2rem;}
    .celueList li{ padding: .1rem;}
    .celueTit{ font-size: 18px;}

    .useLayText{ padding: .3rem;}
    .useLayTit{ font-size: 20px;}
    .useLayCon{ font-size: 14px; line-height: 2;}

    .soluList li{ padding: .1rem;}
    .soluText{ padding: 0 .2rem .1rem;}
    .solu1Rig{ font-size: 14px; line-height: 24px;}

    .caseTit{ font-size: 15px;}

    .caseLayCon .caseRig .caseTit{ font-size: 24px;}
    .caseBtn span{ width: 36px; height: 36px; background-size: 28px auto;}

    .proLeft{ width: 25%; margin-right: 2%;}
    .proNav > li > h2 > a{ line-height: 48px; line-height: 40px;}
    .proList{ margin: 0 -.1rem;}
    .proList li{ width: 50%; padding: 0 .1rem .2rem;}
    .proTit{ font-size: 14px;}

    .pro-swiper{ margin: 0; padding: 0 .6rem;}
    .solu-map-list li a span{ font-size: 14px; min-width: 1.2rem; padding: 0 .15rem;}
    .solu-map-bot li{ margin: .1rem !important;}
    .solu-map-bot li::before,
    .solu-map-bot li::after{ display: none;}

}
@media (max-width:991px){
	.banner{ height:5rem;}
	.banPage{ transform: translateY(-25%);}
	.banPage .swiper-pagination-bullet{ margin: 8px 0; width: 10px; height: 10px;}
	.box2List{ font-size:14px;}
    .box3Img{ width: 40px; height: 40px;}
    .box3Tit{ font-size: 16px; margin: .1rem 0;}
	.box5Tit{ font-size:.28rem;}
	.box5Img{ padding-bottom:55.56%;}
    .one1Logo{ max-width: 40%; width: 300px;}
    .one1Item p:first-child{ font-size: .46rem;}
    .one2Tab::before{ top: 32px;}
    .one2Ico{ width: 80px; height: 80px;}
    .one2Tit{ font-size: 18px;}
    .one2List{ padding: .2rem .3rem;}
    .one2List h4{ font-size: 20px; line-height: 1.4;}
    .one3Box{ display: block;}
    .one3Img{ width: 100%;}
    .one3Img .imgBg{ min-height: 0; padding-bottom: 60%;}
    .one3Text{ width: 100%; padding: .3rem .3rem .3rem .5rem; background-size: 1rem auto; background-position: right .5rem top .5rem;}
    .oneAnchor{ display: none;}
    .arList{ margin: .4rem -.1rem;}
    .arList li{ width: 50%; padding: 0 .1rem; margin-bottom: .2rem;}
    .arBox{ width: 100%; font-size: 14px;}
    .arName{ font-size: 24px;}
    .goList{ font-size: 14px;}
    .joinTopImg{ height: auto;}
    .joinTopImg .imgBg{ position: absolute; left: 0; top: 0; width: 100%;}
    .joinTopText{ position: relative; width: 100%; max-width: 100%; padding: 0.6rem calc(25px + .2rem); min-height: 4rem;}
    .joinTopText h3{ font-size: 160%;}
    .joinTopDes{ line-height: 28px;}
    .joinPrev,
    .joinNext{ width: 15px; height: 20px; background-size: cover;}
    .joinPrev{ left: .2rem;}
    .joinNext{ right: .2rem;}
    .joinName{ font-size: 18px;}

    .fazhanList li{ display: block;}
    .fazhanCir{ margin: 0 auto .2rem; width: 1.4rem; height: 1.4rem;}
    .fazhanCir img{ max-height: .6rem;}
    .fazhanText i{ height: 10px; background-position: center center; background-size: contain;}
    .fuliList li{ width: 33.33%;}
    .fuliIco img{ max-height: .6rem;}
    .fuliTit{ font-size: 18px; margin: .1rem 0;}
    .fuliDes{ margin: .1rem 0;}
    .lcList{ flex-wrap: wrap; justify-content: center;}
    .lcList li{ flex: none; width: 33.33%;}
    .lcList li::after{ max-width: .36rem; max-height: .36rem;}
    .lcList li:nth-child(3n)::before,
    .lcList li:nth-child(3n)::after{ display: none;}
    .lcItem{ max-width: 1.4rem; margin: .2rem auto;}
    .lcCon{ font-size: .24rem; line-height: 1.4;}

    .contact{ display: block;}
    .conText{ width: 100%;}
    #map{ height: 4rem; max-height: 300px;}

    .dl1List li{ align-items: center; min-height: 0;}
    .dl1Img{ padding: .1rem; width: 50%; max-width: 338px;}
    .dl1Img .imgBg{ position: relative; height: 0; padding-bottom: 63.6%; overflow: hidden; border-radius: 5px;}
    .dl1Rig{ padding: .1rem;}
    .dl1List li:hover .dl1Rig{ box-shadow: none;}

    .dl-range li a{ padding: .2rem .3rem; font-size: 16px;}
    .dlTab{ font-size: 18px;}
    .dlTab li span{ padding: .1rem .2rem;}
    .dlWrap{ margin: .5rem 0 .2rem;}
    .dlItem{ background: none; padding: 0;}
    .dlIco{ width: 80px; height: 80px; margin: 0 auto .2rem;}
    .dlBtn{ display: flex; align-items: center; justify-content: center; margin: .2rem 0;}
    .dlBtn span{ position: static; margin: 0 .1rem;}
    .d3List .dl1Rig{ padding: .3rem;}

    .equipList{ margin: 0 -.1rem .3rem;}
    .equipList li{ padding: 0 .1rem;}
    .equipTit{ font-size: 18px;}

    .textTop{ display: block; padding: .3rem;}
    .textTop_Img{ width: 100%; max-width: 560px; margin: 0 auto;}
    .textTop_Right{ padding: .2rem 0 0;}
    .textTop_Tit{ font-size: 18px; margin: .1rem 0;}
    .textTop_Con{ margin: .1rem 0; height: auto;}
    .downBtn{ margin: 0;}
    .equipMore img{ width: 14px;}
    .useTit{ font-size: 16px;}

    .designList li{ width: 100%;}
    .designImg{ max-width: 238px;}
    .designTd{ display: block; padding: .1rem .3rem;}
    .designLeft{ float: none; width: 100%; max-width: 100%; margin: .3rem auto; text-align: center;}
    .designRight{ padding: 0; margin: .3rem 0;}

    .proBox{ padding: .6rem 0; display: block;}
    .proImg{ max-width: 100%; margin: 0;}
    .proText{ padding: 0; font-size: 14px;}

    .soluIco{ width: 80px; height: 80px; margin: -40px 0 0 -40px;}
    .soluMore{ width: 120px; line-height: 34px;}
    .soluBox1{ display: block;}
    .solu1Img{ float: none; width: 100%; max-width: 100%; margin: 0 0 10px;}
    .solu1Rig{ padding: 0 .3rem .3rem;}

    .ysList{ margin: 0 -.1rem;}
    .ysList li{ padding: .1rem;}
    .ysLink{ padding: .2rem;}
    .ysIco{ max-width: 1rem; max-height: 1rem;}
    .ysTit{ font-size: 18px;}

    .caseTit{ font-size: 14px;}

    .caseLay{ margin: .1rem;}
    .caseLayCon .caseRig .caseTit{ font-size: 20px;}

    .proLeft{ float: none; width: 100%;}
    .proBtn{ position: relative; display: block; background: #00479d; color: #FFFFFF; margin-bottom: 10px; font-size: 18px; font-weight: bold; padding: .2rem .3rem; cursor: pointer;}
    .proBtn::after{ display: block; content: ""; width: 16px; height: 16px; background: url(../images/product/pro-arrow.png) center center no-repeat; position: absolute; right: .2rem; top: 50%; margin-top: -8px; transition: all .5s;}
    .proBtn.active::after{ transform: rotate(90deg);}
    .proNav{ background-color: #FFFFFF; padding: .2rem; margin-bottom: .2rem; display: none;}

    .solu-top-list{ flex-wrap: wrap; margin: 0 auto .3rem;}
    .solu-top-list::before{ display: none;}
    .solu-top-list li{ flex: none; width: 33.33%; margin: .15rem 0;}


    .solu-map-list li.solu-li-14 a span{ left: auto; right: 100%;}
    .solu-map-bot li{ min-width: 33.33%;}
}
@media (max-width:767px){
	.banner{ height:5rem;}
    .box2Box{ width: 100%; padding: 0 .3rem;}
    .box2List{ width: 100%;}
	.box2List li{ width:50%;}
	.box2Text{ font-size:14px;}
    .oneTit{ font-size: 24px;}
    .oneDes{ font-size: 14px;}
    .arBot{ display: block;}
    .goList{ margin: .3rem auto 0;}
    .joinTab li{ max-width: calc(120px + 0.2rem);}
    .joinTab li a{ font-size: 14px; line-height: 36px;}
    .fazhanBg .oneDes{ font-size: 14px;}
    .conItem{ padding: .2rem; padding-left: 30px;}
    .conItem h3{ font-size: 16px;}
    .conItem h3::before{ top: 5px; left: -15px;}
    .dlBox{ display: block;}
    .dlImg{ width: 100%; max-width: 670px; margin: 0 auto;}
    .dlText{ margin: 0 !important;}
    .dlTit{ font-size: 16px;}
    .equipList{ justify-content: center;}
    .equipList li{ width: 50%;}

    .useLay{ display: block;}
    .useLayImg{ width: 100%;}
    .useLayText{ padding: .2rem .1rem;}
    .useLayTit{ font-size: 18px; margin-bottom: .1rem;}
    .useLayCon{ max-height: 30vh;}

    .useList li{ width: 50%;}

    .soluList .oneTit{ font-size: 18px; margin-bottom: .1rem;}
    .soluDes{ margin-top: .1rem;}
    .soluBg3 .caseList li{ width: 33.33%;}

    .caseList li{ width: 50%;}

    .caseLay{ margin-top: 30px;}
    .caseLayCon{ display: block;}
    .caseLayCon .caseImg{ width: 100%; margin: 0;}
    .caseLayCon .caseRig{ padding-bottom: .2rem;}
    .caseLayCon .caseRig .caseText{ max-height: 3rem;}
    .caseBtn{ position: static; justify-content: center;}
    .caseBtn span{ margin: 0 .1rem;}

    .solu-service{ flex-wrap: wrap;}
    .solu-service li{ width: 50%;}
}
@media (max-width:640px){
	.banText{ padding-top:60px;}
    .banMouse{ background: none; padding-top: 0;}
    .banArrow{ width: 12px; height: 18px;}
    .box2Logo{ max-width: 50%;}
    .box3List li{ width: 50%;}
    .box4Cir{ width: 2.6rem; height: 2.6rem; padding: 0;}
    .box4Prev,
    .box4Next{
        width: 16px; height: 30px; top: 50%; margin-top: -15px;
    }
    .box4Prev.swiper-button-disabled,
    .box4Next.swiper-button-disabled{
        cursor: no-drop;
        opacity: .5;
    }
	.box5Tit{ font-size:.32rem;}
	.box5List{ padding:0 30px;}
	.box5Prev,.box5Next{ width:34px; height:34px;}

	.onePrev,.oneNext{ width:34px; height:34px;}
    .one2Tab::before{ top: 20px;}
    .one2Ico{ width: 60px; height: 60px;}
	.one4List{ padding:0 30px;}

    .arTop{ display: block;}
    .arImg{ width: 100%;}
    .arImg .imgBg{ position: static;}
    .arImg .imgBg img{ display: block; width: 100%; height: auto;}
    .arRig{ padding: .3rem;}
    .arTit{ font-size: 18px;}
    .arLink{ padding: .2rem;}
    .arName{ font-size: 18px;}

    .joinList{ padding: .3rem .2rem;}
    .joinH4{ padding: .2rem 0;}
    .joinName{ font-size: 16px; width: calc(100% - 30px); line-height: 24px;}
    .joinIco{ width: 30px;}
    .joinIco i{ width: 24px; height: 24px;}
    .joinIco i::before{ width: 10px; margin-left: -5px;}
    .joinIco i::after{ height: 10px; margin-top: -5px;}

    .celueList li{ width: 100%;}
    .fazhanList li{ width: 50%; margin-bottom: .2rem;}
    .fazhanCir{ width: 2rem; height: 2rem; margin: 0 auto .1rem;}
    .fuliList li{ width: 50%;}
    .fuliTit{ font-size: 16px;}
    .lcItem{ max-width: 1.8rem;}
    .lcCon{ font-size: .28rem;}

    .conText{ font-size: 14px; background-size: .6rem auto; padding: .3rem;}
    .conTit{ font-size: 18px;}
    .conLine{ margin: .2rem 0;}

    .dl1List li{ display: block; padding: .1rem;}
    .dl1Img{ width: 100%; max-width: 100%;}
    .dl2List li{ width: 100%;}

    .dl-range li{ width: 100%;}
    .dlTab{ font-size: 16px;}
    .dlTab li span{ line-height: 1.8;}

    .equipList li{ width: 100%;}
    .equipDes{ max-width: 100%;}

    .designTit{ font-size: 16px; line-height: 24px; height: 24px; -webkit-line-clamp:1;}
    .designDes{ line-height: 22px; -webkit-line-clamp: 4; height: 88px;}

    .soluList{ margin: .5rem -.1rem;}
    .soluIco{ width: 1rem; height: 1rem; margin: -.5rem 0 0 -.5rem;}
    .ysList li{ width: 100%;}
    .ysIco{ max-width: 1.2rem; max-height: 1.2rem;}
    .ysDes{ max-width: 100%;}

    .caseLayCon .caseRig .caseTit{ font-size: 18px;}

    .proNav > li > h2 > a{ font-size: 14px; line-height: 40px;}

    .solu-map-box{ min-height: 0;}
    .solu-map-list li a{ max-width: .4rem; max-height: .4rem;}
    .solu-map-list li a i{ max-width: .2rem; max-height: .2rem; border-width: .07rem;}
    .solu-map-list li a::before, .solu-map-list li a::after{ width: .4rem; height: .4rem; margin: -.2rem 0 0 -.2rem;}
}
@media (max-width:460px){
	.banText{ padding-top:50px;}
    .box2List strong{ font-size: .64rem;}
    .box2More a{ width: 120px; line-height: 32px; font-size: 12px;}
    /* .box3Tit{ font-size: 14px;} */
    .box4Tit{ font-size: 14px;}
	.box5Tit{ font-size:.38rem;}
	.box5Tab{ text-align:center;}
	.box5Tab li{ line-height:30px; width:30%; font-size:14px;}
    .box5Tab li a,
	.box5Tab li span{ width:100%;}
	.box5Name{ font-size:15px;}
    .oneTit{ font-size: 20px;}
    .one1Logo{ max-width: 50%;}
    .one2Tab::before{ top: 15px;}
    .one2Ico{ width: 50px; height: 50px;}
    .one2Tit{ font-size: 14px;}
    .one2List h4{ font-size: 16px; font-weight: bold;}
    .one3Text h4{ font-size: 16px;}
    .one3Text{ line-height: 1.8;}
    .one3Text h4::before{ width: 5px; height: 16px; margin-top: 0; top: 0px;}
    .arTit{ font-size: 16px;}
    .arList li{ width: 100%; margin-bottom: .3rem;}
    .arList .box5Name{ height: auto;}
    .joinTopText{ font-size: 12px;}
    .joinTopText h3{ font-size: 140%;}
    .joinTopDes{ line-height: 24px;}
    .joinTab li{ max-width: 50%;}

    .celueTit{ font-size: 16px;}
    .fazhanCir h3{ font-size: 14px;}
    .fuliList li{ width: 100%;}
    .lcItem{ max-width: 2rem;}
    .lcCon{ font-size: .3rem;}

    .conTit{ font-size: 16px;}
    .conList li{ width: 100%;}
    .conItem{ border-width: 1px;}
    .conItem h3::before{ width: 5px; height: 5px; top: 7px;}

    .dl1Tit{ font-size: 16px;}
    .dl-range li a{ font-size: 14px; line-height: 24px;}
    .dl-range li a i{ width: 24px; height: 24px;}
    .dl-range li a::before{ height: 18px; margin-top: -9px;}
    .dlItem .swiper-container{ padding: .1rem; margin: -.1rem;}
    .dlItem .swiper-slide{ width: 90%; height: auto; margin: 0 auto; padding: .2rem; box-shadow: 0 0 .1rem rgba(0,0,0,0.1);}
    .d3List .dl1Tit{ font-size: 16px;}
    .dlBtn span{ width: 30px; height: 30px;}

    .equipTit{ font-size: 16px;}
    .equipMore{ width: 100px; line-height: 32px; font-size: 12px; margin-bottom: .2rem;}

    .useTit{ font-size: 14px;}
    .useDes{ font-size: 12px; line-height: 1.6;}

    .useLayTit{ font-size: 16px;}
    .useLayCon{ font-size: 12px;}

    .designDes{ -webkit-line-clamp: 2; height: 44px;}

    .soluList .oneTit{ font-size: 15px;}
    .soluDes{ font-size: 12px; line-height: 20px; height: 40px; -webkit-line-clamp: 2;}
    .soluMore{ width: 100px; line-height: 28px; font-size: 12px;}
    .ysTit{ font-size: 16px;}
    .soluBg3 .caseList li{ width: 100%;}
    .soluBg3 .caseTit{ font-size: 14px;}

    .caseTit{ font-size: 12px;}

    .caseLayCon .caseRig .caseTit{ font-size: 16px;}

    .proTit{ font-size: 12px;}
    .proButton{ justify-content: center;}

    .solu-top-title{ font-size: 14px;}

    .solu-map-bot li a{ font-size: 14px; line-height: 38px;}
}
@media all and (orientation : landscape){
	.pc{ display:block;}
	.mob{ display:none;}
}
@media all and (orientation : portrait){
	.pc{ display:none;}
	.mob{ display:block;}
}