/* 第一屏 */
.oneBox { height: 710px; }
.navBox { position: absolute; top: 595px; left: 0; right: 0; margin: 0 auto; z-index: 9997; width: 1200px; height: 125px; box-shadow: 5px 5px 10px rgba(204, 204, 204, .5); background:-moz-linear-gradient(top, #fcfcfc, #dee0ec); background: -ms-linear-gradient(top, #fcfcfc, #dee0ec); background: -o-linear-gradient(top, #fcfcfc, #dee0ec); background: -webkit-linear-gradient(top, #fcfcfc, #dee0ec); }
.navBox li { width: 300px; height: 125px; border-right: 1px solid #d0d0d0; border-left: 1px solid #fff; float: left; text-align: center; }
.navBox li h3 { font-size: 26px; color: #4f4f50; font-weight: normal; line-height: 40px; margin-top: 25px; font-family: SOURCEHANSANSCN-MEDIUM; }
.navBox li p { font-size: 16px; color: #4f4f50; line-height: 30px; }
.navBox li:hover { border-right: 1px solid #fcca2e; border-left: 1px solid #fcca2e; float: left; background: #fcca2e; }
.navBox li:hover > h3 { color: #2c3998; }
.navBox li:first-child { border-left: none; }
.navBox li:last-child { border-right: none; }
.banner { width: 100%; height: 572px; overflow: hidden; position: relative; }
.banner > ul { display: none; height: 572px; position: absolute; top: 0; left: 0; }
.banner > ul > li { float: left; height: 572px; }
.banner > ul > li > a { display: block; height: 572px; width: 100%; background-size: cover !important; }
.left-btn, .right-btn { width: 36px; height: 36px; position: absolute; top: 50%; transform: translateY(-50%); right: 150px; background: url("../img/bannerRight.png") no-repeat center; cursor: pointer; }
.left-btn { left: 150px; background: url("../img/bannerLeft.png") no-repeat center; }
.img-btn-list { width: 100%; position: absolute; bottom: 80px; left: 0; text-align: center; }
.img-btn-list > span { display: inline-block; width: 90px; height: 5px; margin: 0 12px; background: rgba(255, 255, 255, .8); cursor: pointer; overflow: hidden; }
.img-btn-list > span i { display: block; width: 90px; transform: translateX(-90px); height: 5px; background: #2c3998; }
.img-btn-list > span.current i { transform: translateX(0); transition: all 8s linear; -webkit-transition: all 8s linear; -moz-transition: all 8s linear;  -o-transition: all 8s linear; -ms-transition: all 8s linear; }
/* 第二屏 */
.twoBox { position: relative; width: 100%; height: 730px; background: url('../img/twoBoxBg.png') no-repeat center bottom; }
.twoBox h2 { width: 100%; line-height: 120px; color: #2c3998; font-size: 48px; font-weight: normal; text-align: center; font-family: SOURCEHANSANSCN-Bold; }
.twoMain { position: absolute; left: 50%; margin-left: 45px; top: 170px; }
.twoMain h4 { font-size: 30px; margin: 50px 0 15px; color: #ffcd33; line-height: 30px; font-weight: normal; padding-left: 10px; border-left: 5px solid #ffcd33; font-family: SOURCEHANSANSCN-Bold; }
.twoMain p { color: #fcfefd; line-height: 30px; font-size: 18px; font-family: SOURCEHANSANSCN-Regular; }
.twoMain ul { width: 450px; height: 250px; margin: 100px 0 0 65px; }
.twoMain li { width: 195px; height: 265px; display: inline-block; text-align: center; }
.twoMain li:first-child { margin-right: 55px; }
.twoMain li img { height: 195px; }
.twoMain li span { font-family: SOURCEHANSANSCN-Regular; font-size: 24px; color: #fcfefd; }
/* 第三屏 */
.threeBox { width: 100%; height: 630px; background: #fff; }
.threeMain { width: 1200px; height: 400px; margin: 130px auto; position: relative; }
.threeSwiper { width: 1200px; height: 900px; overflow: hidden; }
.threeSwiper .swiper-button-prev { left: -40px; background: url('../img/swiperLeft.png') no-repeat center; }
.threeSwiper .swiper-button-next { right: -40px; background: url('../img/swiperRight.png') no-repeat center; }
.threeSwiper .swiper-button-next,
.threeSwiper .swiper-button-prev { width: 32px; height: 32px; background-repeat: no-repeat; background-size: cover; position: absolute; top: 50%; cursor: pointer; }
.threeSwiper ul { width: 9999px; }
.threeSwiper li { width: 300px; height: 400px; }
.threeSlide { position: relative; width: 260px; height: 400px; background: #f4f4f5; margin: 0 auto; }
.threeSlideTitle { padding: 0 25px; height: 75px; }
.threeSlideTitle h4 { font-size: 25px; color: #595959; padding-top: 10px; font-weight: normal; line-height: 30px; }
.threeSlideTitle h5 { color: #4f4f50; font-weight: normal; font-size: 15px; line-height: 30px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.threeSlide:hover > .threeSlideTitle { background: #2c3998; }
.threeSlide:hover > .threeSlideTitle h4 { color: #ffcd33; }
.threeSlide:hover > .threeSlideTitle h5 { color: #fff; }
.threeSlide img { width: 260px; height: 165px; }
.threeSlide p { padding: 0 25px; margin-top: 10px; font-size: 14px; color: #4f4f50; line-height: 25px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; }
.threeSlide p span { color: #2c3998; }
.threeButton { position: absolute; right: 15px; bottom: 15px; width: 80px; height: 25px; border: 1px solid #595959; color: #595959; line-height: 25px; text-align: center; cursor: pointer; }
.threeButton:hover { color: #2c3998; background: #ffcd33; border: 1px solid #ffcd33; }
.threeEwm { visibility: visible; opacity: 0; position: absolute; z-index: -1; padding: 10px; top: 40px; background: #fff; right: 0; height: 135px; box-shadow: 0 0 10px rgba(204, 204, 204, .5); }
.threeEwm dd { display: inline-block; width: 100px; height: 100%; text-align: center; }
.threeEwm dd img { width: 100px; height: 100px; display: block; }
.threeEwm span { width: 100px; font-size: 12px; color: #313131; }
.threeEwm:after { position: absolute; content: ''; top: -15px; right: 25px; border-top: 0; border-left: 15px solid transparent; border-right: 15px solid transparent; border-bottom: 15px solid #fff; }
.threeButton:hover > .threeEwm { visibility: visible; opacity: 1; top: 35px; z-index: 99; }
/* 第四屏 */
.fourBox { overflow: hidden; position: relative; width: 100%; height: 944px; background: url('../img/fourBg.jpg') no-repeat center; }
.fourTitle { width: 100%; text-align: center; margin-top: 50px; }
.fourTitle h2 { font-weight: normal; font-size: 48px; color: #ffcd33; font-family: SOURCEHANSANSCN-Bold; }
.fourTitle p { font-size: 24px; color: #fff; margin-top: 10px; }
#fourBoxWatch { position: absolute; width: 1px; height: 1px; background: transparent; bottom: 25%; right: 0; z-index: 99; }
.fourCenter { position: absolute; z-index: 10; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: 0 auto; width: 380px; height: 375px; background: url('../img/fourTitle.png') no-repeat center; }
.fourLeft1 { position: absolute; z-index: 1; left: 50%; top: 50%; transform: translate3D(-50%, -50%, 0) scale(0.1); opacity: 0; width: 685px; height: 631px; background: url('../img/fourLeft1.png') no-repeat center; }
.fourLeft2 { position: absolute; z-index: 1; left: 50%; top: 50%; transform: translate3D(-50%, -50%, 0) scale(0.1); opacity: 0; width: 685px; height: 631px; background: url('../img/fourLeft2.png') no-repeat center; }
.fourLeft3 { position: absolute; z-index: 1; left: 50%; top: 50%; transform: translate3D(-50%, -50%, 0) scale(0.1); opacity: 0; width: 685px; height: 631px; background: url('../img/fourLeft3.png') no-repeat center; }
.fourRight1 { position: absolute; z-index: 1; right: 50%; top: 50%; transform: translate3D(50%, -50%, 0) scale(0.1); opacity: 0; width: 692px; height: 691px; background: url('../img/fourRight1.png') no-repeat center; }
.fourRight2 { position: absolute; z-index: 1; right: 50%; top: 50%; transform: translate3D(50%, -50%, 0) scale(0.1); opacity: 0; width: 692px; height: 691px; background: url('../img/fourRight2.png') no-repeat center; }
.fourRight3 { position: absolute; z-index: 1; right: 50%; top: 50%; transform: translate3D(50%, -50%, 0) scale(0.1); opacity: 0; width: 692px; height: 691px; background: url('../img/fourRight3.png') no-repeat center; }
.fourLeftHover { left: 0; top: 135px; transform: translate3D(0, 0, 0) scale(0.9); opacity: 1; }
.fourRightHover { right: 0; top: 135px; transform: translate3D(0, 0, 0) scale(0.9); opacity: 1; }
.fourAnimation {
  transition: all 1s ease-in-out;
  -webkit-transition: all 1s ease-in-out;
  -moz-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  -ms-transition: all 1s ease-in-out;
}
/* 第五屏 */
.fiveBox { width: 100%; height: 940px; }
.fiveBox h2 { width: 100%; line-height: 120px; margin-top: 100px; color: #2c3998; font-size: 48px; font-weight: normal; text-align: center; font-family: SOURCEHANSANSCN-Bold; }
.fiveMain { margin-top: 100px; margin: 0 auto; width: 1200px; height: 650px; position: relative; }
.fiveList { width: 1200px; height: 650px; overflow: hidden; }
.fiveBtn { position: absolute; display: block; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; font-size: 30px; cursor: pointer; z-index: 10; }
.fivePrev { left: 230px; background: url('../img/fiveLeft.png') no-repeat center; }
.fiveNext { right: 230px; background: url('../img/fiveRight.png') no-repeat center; }
.fiveList li { width: 580px; height: 610px; background: #fff; position: absolute; border: 1px solid #d2d2d2; top: 0; left: 0; list-style: none; opacity: 0; transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; }
.p1 { transform: translate3d(0px, 0, 0) scale(0.8); transform-origin: 0 50%; opacity: 0.5 !important; z-index: 2; }
.p2 { transform: translate3d(310px, 0, 0) scale(1); z-index: 3; opacity: 1 !important; }
.p3 { transform: translate3d(600px, 0, 0) scale(0.8); transform-origin: 100% 50%; opacity: 0.5 !important; z-index: 2; }
.fiveImgBox { width: 580px; height: 390px; display: block; background-size: cover !important; }
.fiveList li h4 { margin-top: 10px; text-align: center; font-weight: normal; font-size: 16px; color: #7b7b7b; font-family: SOURCEHANSANSCN-Regular; line-height: 40px; }
.fiveList li h4 b { font-weight: normal; font-size: 20px; color: #2c3998; max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-right: 5px; }
.fiveList li p { font-size: 16px; color: #7b7b7b; font-family: SOURCEHANSANSCN-Regular; line-height: 30px; padding: 0 10px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.fiveLine { width: 100%; height: 3px; background: url('../img/fiveLine.jpg') no-repeat center; margin-top: 40px; }
.fiveActive { font-size: 18px; color: #323e9a; text-align: center; width: 100%; display: inline-block; line-height: 25px; margin-top: 10px; }
.fiveActive:hover { color: #e89b1f; }
.fiveMain2 { display: none; overflow: hidden; text-align: center; margin-top: 100px; margin: 0 auto; width: 1200px; height: 610px; }
.fiveMain2 li { margin: 0 5px; display: inline-block; width: 580px; height: 610px; background: #fff; }
.fiveMain2 li img { width: 580px; height: 390px; border: none; }
.fiveMain2 li h4 { margin-top: 10px; text-align: center; font-weight: normal; font-size: 16px; color: #7b7b7b; font-family: SOURCEHANSANSCN-Regular; line-height: 40px; }
.fiveMain2 li h4 b { font-weight: normal; font-size: 20px; color: #2c3998; max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fiveMain2 li p { font-size: 16px; color: #7b7b7b; text-align: left; font-family: SOURCEHANSANSCN-Regular; line-height: 30px; padding: 0 10px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.fiveMain2 li a { font-size: 18px; color: #323e9a; text-align: center; width: 100%; display: inline-block; line-height: 25px; margin-top: 10px; }
.fiveMain2 li a:hover { color: #e89b1f; }
/********* H5 *********/
/* 第一屏 */
.oneBoxH5 { width: 100%; }
.bannerH5 { width: 100%; height: auto; overflow: hidden; position: relative; }
.bannerH5 ul { width: 9999px; }
.bannerH5 li { width: 100%; height: 100%; }
.bannerH5 li img { width: 100%; }
.bannerPointListH5 { display: flex; justify-content: center; left: 0; right: 0; margin: 0 auto; position: absolute; bottom: 0.2rem; z-index: 9998; }
.bannerPointListH5 span { width: 1rem; height: 0.05rem; background: #fff; margin: 0 0.1rem; }
.swiper-pagination-bullet-active { background: #2c3998 !important; }
.navBoxH5 { width: 100%; }
.navBoxH5 li { display: flex; justify-content: space-around; align-items: center; background: #f2f2f7; width: 100%; color: #4f4f50; height: 1.2rem; border-top: 1px solid #fff; border-bottom:1px solid #d0d0d0; }
.navBoxH5 li h3 { font-size: 0.4rem; width: 50%; text-align: center; font-family: SOURCEHANSANSCN-MEDIUM; }
.navBoxH5 li p { font-size: 0.24rem; text-align: left; width: 50%; }
.navBoxH5 li:active { background: #fbc729; }
.navBoxH5 li:active h3 { color: #2c3998; }
.navBoxH5 li:active p { color: #303238; }
/* 第二屏 */
.twoBoxH5 { width: 100%; }
.twoBoxH5 h2 { width: 100%; line-height: 2rem; text-align: center; font-size: 0.6rem; color: #2c3998; }
.twoMainH5 { padding: 0.25rem; background: linear-gradient(#517beb, #2e3c9d); }
.twoMainH5 h4 { margin-bottom: 0.4rem; border-left: 0.1rem solid #ffcd33; color: #ffcd33; font-size: 0.5rem; line-height: 0.5rem; padding-left: 0.2rem; }
.twoMainH5 p { font-size: 0.24rem; color: #fff; line-height: 0.5rem; }
.twoMainH5 ul { display: flex; justify-content: space-around; margin: 0.5rem auto 0; }
.twoMainH5 li { width: 2.5rem; height: 100%; text-align: center; }
.twoMainH5 li img { width: 100%; display: block; }
.twoMainH5 span { width: 100%; font-size: 0.4rem; color: #fff; }
/* 第三屏 */
.threeBoxH5 { width: 100%; overflow: hidden; margin-top: 0.5rem; }
.threeBoxH5 ul { width: 9999px; }
.threeSlideH5 { height: 9.5rem; position: relative; width: 7rem; padding-bottom: 0.5rem; background: #f4f4f5; margin: 0 auto; }
.threeSlideTitleH5 { padding: 0.4rem 0.5rem; }
.threeSlideTitleH5 h4 { font-size: 0.6rem; color: #595959; }
.threeSlideTitleH5 h5 { color: #4f4f50; font-size: 0.4rem; line-height: 0.8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.threeSlideH5:active > .threeSlideTitleH5 { background: #2c3998; }
.threeSlideH5:active > .threeSlideTitleH5 h4 { color: #ffcd33; }
.threeSlideH5:active > .threeSlideTitleH5 h5 { color: #fff; }
.threeSlideH5 img { width: 100%; height: 4.5rem; }
.threeSlideH5 p { padding: 0 0.5rem; font-size: 0.35rem; color: #4f4f50; line-height: 0.5rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; }
.threeSlideH5 p span { color: #2c3998; }
.threeSlidePointH5 { display: flex; justify-content: center; align-items: center; width: 100%; height: 1rem; }
.threeSlidePointH5 span { width: 0.5rem; height: 0.5rem; border-radius: 50%; border: 1px solid #2c3998; background: #fff; margin: 0 0.1rem; }
/* 第四屏幕 */
.fourBoxH5 { width: 100%; margin: 1rem auto; }
.fourBoxH5 img { width: 100%; }
/* 第五屏 */
.fiveBoxH5 { width: 100%; padding-bottom: 1rem; }
.fiveBoxH5 h2 { width: 100%; line-height: 2rem; text-align: center; font-size: 0.6rem; color: #2c3998; }
.fiveMainH5 { width: 100%; overflow: hidden; }
.fiveBoxH5 ul { width: 9999px; }
.fiveSlideH5 { position: relative; width: 7rem; height: 11.5rem; padding-bottom: 0.5rem; background: #f4f4f5; margin: 0 auto; }
.fiveSlideH5 img { width: 100%; height: 6rem; }
.fiveSlideH5 h4 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0.5rem auto 0; width: 70%; text-align: center; font-size: 0.4rem; color: #2c3998; font-family: SOURCEHANSANSCN-Regular; line-height: 0.6rem; }
.fiveSlideH5 h5 { font-size: 0.3rem; line-height: 0.6rem; color: #7b7b7b; text-align: center; }
.fiveSlideH5 p { padding: 0 0.5rem; font-size: 0.3rem; color: #7b7b7b; line-height: 0.6rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.fiveSlidePointH5 { display: flex; justify-content: center; align-items: center; width: 100%; height: 1rem; }
.fiveSlidePointH5 span { width: 0.5rem; height: 0.5rem; border-radius: 50%; border: 1px solid #2c3998; background: #fff; margin: 0 0.1rem; }
.fiveLineH5 { position: absolute; bottom: 1rem; width: 100%; height: 3px; background: url('../img/fiveLine.jpg') no-repeat center; }
.fiveSlideH5 a { position: absolute; bottom: 0; font-size: 0.3rem; color: #323e9a; text-align: center; width: 100%; display: inline-block; line-height: 1rem; }


@media screen and (max-width: 1440px) {
  .fourLeftHover { left: -40px; top: 135px; transform: translate3D(0, 0, 0) scale(0.7); opacity: 1; }
  .fourRightHover { right: -40px; top: 135px; transform: translate3D(0, 0, 0) scale(0.7); opacity: 1; }
  .fourCenter { position: absolute; z-index: 10; top: 50%; transform: translateY(-50%) scale(.6); left: 0; right: 0; margin: 0 auto; width: 380px; height: 375px; background: url('../img/fourTitle.png') no-repeat center; }
}

@media screen and (min-width: 750px) and (max-width: 1080px) {
  .navBoxH5 li p { width: 30%; }
  .twoMainH5 { width: 100%; display: flex; justify-content: flex-end; background: url('../img/H5/indexTwoBgH5.png') no-repeat center; background-size: cover; }
  .twoMainBoxH5 { width: 45%; }
}

@media screen and (max-width: 360px) {
  .navBoxH5 li p { width: 65%; }
}