.navone:nth-child(2):after { content: ''; display: block; width: 60px; height: 4px; background-color: #ff6a00; position: absolute; bottom: 22px; left: 50%; transform: translateX(-50%); }
.topbanner { height: 500px; width: 100%; background: url(/Images/jjfa/o2o1.jpg); background-size: auto 100%; background-position: center; }

.faa { width: 1200px; margin: 30px auto; }
.faatitle { text-align: center; line-height: 45px; font-size: 36px; font-weight: bold; }
.faades { text-align: center; line-height: 25px; font-size: 18px; margin-top: 15px; color: #999; }
.faabg { /*background-image: url(/Images/jjfa/o2o2.jpg); background-position: center center; background-repeat: no-repeat; width: 1200px; height: 770px;*/ position: relative; }
.fab { background-image: url(/Images/jjfa/o2o3.jpg); background-position: center center; background-size: 100% auto; padding: 50px 0 10px 0; }
.fabtitle { text-align: center; line-height: 45px; font-size: 36px; font-weight: bold; color: #fff; }
.fabdes { text-align: center; line-height: 25px; font-size: 18px; margin-top: 15px; color: #fff; }
.fablist { width: 1200px; margin: 50px auto; padding: 10px; }
.fabone { width: 280px; height: 170px; margin: 0px 25px 25px 0px; float: left; text-align: center; background-color: rgba(255, 255, 255, 0.3); border-radius: 15px; border: solid 2px rgba(255, 255, 255, 0.6); box-sizing: border-box; }
    .fabone:nth-child(4n) { margin: 0px 0px 20px 0px; }
    .fabone span { padding: 13px 30px 0 30px; text-align: left; word-break: break-all; display: block; color: #fff; line-height: 30px; font-size: 15px; }
    .fabone h1 { font-size: 18px; padding: 33px 0 0 30px; color: #fff; text-align: left; font-weight: bold; display: block; }
    .fabone:hover { transform: translateY(-2px); box-shadow: 0 0 30px rgba(0,0,0,0.2); }
.fac { width: 1200px; margin: 50px auto 30px auto; padding: 10px; }
.factitle { text-align: center; height: 45px; line-height: 45px; font-size: 36px; font-weight: bold; }
.facdes { text-align: center; line-height: 25px; font-size: 18px; margin-top: 15px; color: #999; }
.facbg { padding: 50px 10px 10px 10px; }
    .facbg:after, .fadbg:after, .fafbg:after, .fablist:after { content: " "; clear: both; display: table; }
.facone { float: left; width: 270px; height: 450px; border-radius: 10px; margin-right: 32px; box-sizing: border-box; border: solid 1px #fff; box-shadow: 0 0 20px rgba(0,0,0,0.1); }
    .facone:last-child { margin-right: 0px; }
    .facone:hover { box-shadow: 0 0 30px rgba(0,0,0,0.2); transform: translateY(-3px); }
.fac1 { margin: 33px auto; }
.fac2 { color: #000; text-align: center; font-weight: bold; font-size: 20px; }
.fac3 { background-image: linear-gradient(90deg, rgba(255,255,255,1),rgba(255,255,255,0)); height: 5px; width: 50%; border-radius: 1px; margin: 10px 0; }
.fac4 { color: #999; line-height: 25px; padding: 30px 40px; text-align: center; font-size: 16px; }
.facone:hover .fac2 { color: #a355ff; }
.facone:hover .fac4 { color: #a355ff; }
.fad { padding: 50px 0 30px 0; background-color: #f5f8ff; }
.fadtitle { text-align: center; line-height: 45px; font-size: 36px; font-weight: bold; }
.faddes { text-align: center; line-height: 25px; font-size: 18px; margin-top: 15px; color: #999; }
.fadbg { width: 1200px; margin: 0 auto; padding: 50px 0px 30px 0px; height: 440px; }
.fadone { float: left; width: 155px; height: 220px; margin-right: 54px; }
    .fadone img { width: 100%; }
    .fadone:nth-child(6n) { margin-right: 0px; }
    .fadone:hover { transform: translateY(-3px); }
.fadotitle { font-size: 16px; font-weight: bold; color: #000; text-align: center; line-height: 5px; }
.fadodes { font-size: 16px; padding: 0px 40px 20px 40px; color: #999; line-height: 30px; color: #fff; }

.fae { padding: 50px 0 30px 0; background-image: url(/Images/jjfa/o2o11.jpg); background-position: center bottom; background-size: auto; background-repeat: no-repeat; }
.faetitle { text-align: center; height: 45px; line-height: 45px; font-size: 36px; font-weight: bold; }
.faedes { text-align: center; line-height: 25px; font-size: 18px; margin-top: 15px; color: #999; }
.faebg { width: 1200px; margin: 0 auto; padding: 50px 0px 50px 0px; }
.swiper-container1 { width: 900px; margin: 0 auto; padding: 30px 150px 60px 150px; }
.swiper-slide { width: 450px; height: 590px; background-color: #fff; border: solid 1px #fff; border-radius: 15px; box-shadow: 0px 0px 10px rgba(0,0,0,0.4); overflow: hidden; padding: 50px 70px; box-sizing: border-box; }
.swiper-slide-active { background-color: #ffa074; color: #fff; }
.swiper-slide-shadow-left, .swiper-slide-shadow-right { display: none !important; }
.faetext1 { font-size: 25px; font-weight: bold; padding-bottom: 10px; }
.faetext2 { font-size: 16px; padding-top: 30px; line-height: 35px; }
.faebg1 { background-image: url(/Images/jjfa/o2o32.png); background-position: right bottom; background-repeat: no-repeat; }
.faebg2 { background-image: url(/Images/jjfa/o2o34.png); background-position: right bottom; background-repeat: no-repeat; }
.faebg3 { background-image: url(/Images/jjfa/o2o30.png); background-position: right bottom; background-repeat: no-repeat; }
.swiper-pagination-bullet-active { opacity: 1; background: #fff; }

.faf { padding: 50px 0 10px 0; }
.faftitle { text-align: center; height: 45px; line-height: 45px; font-size: 36px; font-weight: bold; }
.fafdes { text-align: center; line-height: 25px; font-size: 18px; margin-top: 15px; color: #999; }
.fafbg { width: 1200px; margin: 0 auto; padding: 50px 10px 50px 10px; }
.fafa { float: left; width: 565px; height: 130px; margin: 0 50px 40px 10px; position: relative; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); border-radius: 0 15px 0 15px; box-sizing: border-box; border: solid 1px #fff; }
    .fafa:nth-child(2n) { margin-right: 0px; }
.fafb { position: absolute; right: 10px; bottom: 23px; }
.fafc { width: 505px; height: 130px; overflow: hidden; position: relative; background: #fff; margin: 10px 0 0 -10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); border-radius: 0 15px 0 15px; box-sizing: border-box; }
.fafd { position: absolute; left: 20px; top: 28px; }
.fafe { font-size: 22px; font-weight: bold; padding: 25px 25px 0px 115px; text-align: right; }
.faff { padding: 10px 25px 0px 115px; color: #999; text-align: right; }
.col1 { background: #008cdb; }
.col2 { background: #fc6592; }
.col3 { background: #5fbd65; }
.col4 { background: #f58861; }
.col5 { background: #4ab3af; }
.col6 { background: #fbb345; }
.col7 { background: #8054f1; }
.col8 { background: #2085f7; }
.fafa:hover { transform: translate(2px,-3px); box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); }
    .fafa:hover .fafc { transform: translate(-5px,2px); }

@media screen and (max-width: 750px) { /*.topimg { height:50vw; width: 100%; object-fit: cover; }*/
    .topbanner { height: 55vw; width: 100%; background-position: 30% center; }
    .faatitle, .fabtitle, .factitle, .fadtitle, .faetitle, .faftitle { font-size: 28px; padding: 0 2vw; }
    .faddes, .faedes, .fafdes { margin-top: 5px; }
    .fabdes { padding: 0 2vw; margin-top: 5px; }
    .faa { width: 94vw; padding: 0 3vw; box-sizing: border-box; height: auto; }
    .faabg, .fablist { width: 94vw; }
        .faabg img { width: 100%; }
    .fablist { margin: 3vw auto; }
    .fabone { width: 45vw; margin: 1vw; }
        .fabone:nth-child(4n) { margin: 1vw; }
    .fab { background-size: auto 100%; background-position: center; }
    .fac, .fad { width: 94vw; padding: 5vw 3vw; }
    .fac { margin-bottom: 0; }
    .facbg { padding: 2vw 0; }
    .facone { width: 100%; float: none; box-shadow: 0 0 20px rgba(0,0,0,0.1); margin: 3vw 0; height: auto; padding: 2vw 0 3vw 0; }
        .facone:hover { transform: translateY(0px); box-shadow: 0 0 20px rgba(0,0,0,0.1); }
    .fac1 { margin: 1vw auto; }
    .fac4 { padding: 1vw 4vw; }
    .fadbg { width: 94vw; height: auto; padding: 3vw 0; }
    .fadone { width: 31.3vw; margin: 2vw 0; text-align: center; height: auto; }
        .fadone img { width: 80%; margin: 0 auto; }
    .fae { padding: 5vw 0; width: 100vw; }
    .swiper-container1 { width: 90vw; padding: 5vw; }
    .swiper-container-3d { perspective: 90vw; }
    .swiper-slide { width: 45vw; padding: 7vw; height: 101vw; }
    .faebg { width: 100vw; padding: 2vw 0; }
    .faf { width: 94vw; padding: 5vw 3vw; }
    .fafbg { width: 100%; padding: 2vw 0; }
    .fafa { width: 100%; margin: 0 0 6vw 0; height: auto; }
    .fafc { width: calc(100% - 50px); padding-bottom: 8px; height: auto; margin-bottom: -5px; }
    .faetext1 { font-size: 17px; }
    .faetext2 { line-height: 24px; font-size: 14px; }
    .faetext2 { padding-top: 15px; }
    .fabone { height: 205px; }
        .fabone h1 { font-size: 18px; padding: 30px 0 0 20px; color: #fff; text-align: left; font-weight: bold; display: block; }
        .fabone span { padding: 13px 20px 0 20px; text-align: left; word-break: break-all; display: block; color: #fff; line-height: 28px; font-size: 15px; }
}

@media screen and (max-width: 580px) {
    .swiper-slide { width: 50vw; padding: 5vw; height: 101vw; }
}

@media screen and (max-width: 450px) {
    .swiper-slide { width: 50vw; padding: 5vw; height: 91vw; }
    .swiper-container1 { padding: 12vw 5vw; }
    .faetext2 { padding-top: 10px; }
}