﻿@charset "utf-8";
/*end*/
body{overflow-x:hidden;}



@font-face {
    font-family: 'OPPOSANS-R';
    src: url('../fonts/OPPOSANS-R_0.TTF')
} 
@font-face {
    font-family: 'OPPOSANS-B';
    src: url('../fonts/OPPOSANS-B_0.TTF')
}


/**/
.guide{height:54.75rem;background: url(../images/guide.jpg) no-repeat center;background-size:100% 100%;}
.guide .gui-top{height:45.45rem;}
.guide .gui-top .left{width:41rem;float:left;padding-top:8rem;}
.guide .gui-top .left i{display: block; line-height: 3.1rem;font-size: 1.85rem;color:#043a7a;font-weight: bold;}
.guide .gui-top .left span{display: block; line-height: 5.05rem;font-size: 4.3rem;color:rgba(4,58,122,.1);font-weight: bold;}
.guide .gui-top .left h4{line-height: 3.2rem;font-size: 2.6rem;color:#043a7a;background:url(../images/gui-yw.png) no-repeat left 1.6rem; background-size:29.85rem 4.55rem;height:11.7rem; box-sizing: border-box;padding-top:2.4rem; }
.guide .gui-top .left p{line-height: 1.85rem; margin-bottom: 3.65rem;font-size: 1rem;color:#000000;}
.guide .gui-top .left strong{display: block;width:9rem;height:2.6rem;background:#F1712A;border-radius: 1.3rem; transition:.5s;}
.guide .gui-top .left strong a{display: block; height:2.6rem;text-align: right;}
.guide .gui-top .left strong i{display: inline-block; line-height: 2.6rem;font-size: 0.9rem;color:#FFFF;padding-right:3.6rem; background:url(../images/gui-jt.png) no-repeat right;background-size:2.65rem 2.65rem; font-weight: normal;}
.guide .gui-top .left strong:hover{-webkit-transform:translate(0,-10px);transform:translate(0,-10px);}
.guide .gui-top .rig{width:27.5rem;height:31.4rem;float:right; margin-top: 8rem; position: relative;}
.guide .gui-top .rig i{display: block;width:12.05rem;height:5.65rem;line-height: 0;margin:18.75rem 0 0 5.7rem;}
.guide .gui-top .rig i img{width:100%;}
.guide .gui-top .rig span{display: block;width:6.05rem; line-height: 0;position: absolute;left:0;bottom:0;z-index:200;background:#FFF;border-radius: 50%;}
.guide .gui-top .rig span img{width:100%;}
.guide .gui-top .rig .walletImgBox {width:6.05rem;height:6.05rem; position: absolute;left: 0;bottom: 0;} 
.walletImgBox .walletSpread1,.walletImgBox .walletSpread2,.walletImgBox .walletSpread3 { position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(255,255,255,.5); box-sizing:border-box; border-radius:50%; opacity:0;}
.walletImgBox .walletSpread1 {-webkit-animation:spread 3s linear infinite;animation:spread 3s linear infinite}
.walletImgBox .walletSpread2 {-webkit-animation:spread 3s linear 1s infinite;animation:spread 3s linear 1s infinite}
.walletImgBox .walletSpread3 {-webkit-animation:spread 3s linear 2s infinite;animation:spread 3s linear 2s infinite}
@-webkit-keyframes spread {
    0% {
     -webkit-transform:scale(1);
     transform:scale(1);
     opacity:1
    }
    100% {
     -webkit-transform:scale(2);
     transform:scale(2);
     opacity:0
    }
   }
   @keyframes spread {
    0% {
     -webkit-transform:scale(1);
     transform:scale(1);
     opacity:1
    }
    100% {
     -webkit-transform:scale(2);
     transform:scale(2);
     opacity:0
    }
   }
.guide .gui-list ul li{width:100%; line-height: 0;border: 1px solid #CDCDCD; box-sizing: border-box;}
.guide .gui-list ul li img{width:100%;}
/**/
.yycj{padding:1.9rem 1.8% 3.7rem;background:#f0f7ff;}
.yycj h2{text-align: center; margin-bottom: 1.55rem;}
.yycj h2 span{display: block; line-height: 4.1rem;font-size: 2.75rem;color:#000000; font-family: 'OPPOSANS-B'; font-weight: normal;}
.yycj h2 em{display: block; line-height: 2.3rem;font-size: 1rem;color:#000000;font-family: 'OPPOSANS-R';font-weight: normal;}
.yycj ul{display: flex;display: -webkit-flex;justify-content: space-between;-webkit-justify-content: space-between;flex-wrap: wrap;}
.yycj ul li{width:49.5%;position: relative; margin-bottom: .8rem;}
.yycj ul li span{display: block;width:100%;line-height: 0; overflow: hidden;}
.yycj ul li span img{width:100%; transition: 1s;}
.yycj ul li em{display: block; width:23.3rem;height:3.25rem; background:#043A7A; position: absolute;left:0;bottom:0;padding:0 1.1rem 0 1.25rem; box-sizing: border-box;z-index:200;border-radius: 0 20px 10px 0;}
.yycj ul li em i{display: inline-block; width:100%; line-height: 3.25rem; font-size: 1.1rem;color:#ffffff;background:url(../images/cj-jia.png) no-repeat right;background-size:1.65rem 1.7rem;}
.yycj ul li:hover span img{-webkit-transform: scale(1.1);-moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);}
.yycj ul li:hover em{background:#F0712A;}
/**/
.product{padding:2.75rem 0 3.05rem;}
.product h2{text-align: center; margin-bottom: 1.15rem;}
.product h2 span{display: block; line-height: 4.05rem;font-size: 2.75rem;color:#000000;font-family: 'OPPOSANS-B'; font-weight: normal;}
.product h2 em{display: block; line-height: 2.25rem;font-size: 1rem;color:#000000;font-family: 'OPPOSANS-R'; font-weight: normal;}
.product .pro-nav{ margin-bottom: 3.15rem;}
.product .pro-nav ul li{width:17.65rem;height:22.25rem; float:left;background:#F5F5F5;margin-left: .5rem;padding:0 1.05rem 0 .85rem; box-sizing: border-box; transition: .5s; overflow: hidden;}
.product .pro-nav ul li:first-child{margin-left: 0;}
.product .pro-nav ul li dl{position: relative;width:100%; overflow: hidden;}
.product .pro-nav ul li dl dd{width:15.85rem;padding:2.8rem 0 0;box-sizing: border-box;}
.product .pro-nav ul li dl dd h4{margin-bottom: .8rem;padding:0 .65rem;}
.product .pro-nav ul li dl dd h4 a{display: block; line-height: 2.2rem;font-size: 1.5rem;color:#282828; font-family: 'OPPOSANS-B'; font-weight: normal;}
.product .pro-nav ul li dl dd p{line-height: 1.4rem; height:7.5rem;font-size: .7rem;color:#282828;font-family: 'OPPOSANS-R';padding:0 .65rem;}
.product .pro-nav ul li dl dd em{display: block;width:15.8rem; transition:.5s;}
.product .pro-nav ul li dl dd em a{display: block;float:left; margin-right: .5rem;width:4.9rem;height:1.45rem; line-height: 1.45rem; margin-bottom: .55rem;text-align: center; font-size: .65rem;color:#282828;border-radius: .5rem;border: 1px solid #CACACA; box-sizing: border-box;transition:.5s;}
.product .pro-nav ul li dl dd em a:nth-child(3n){margin-right:0;}
.product .pro-nav ul li dl dd em a:hover{background:#F0712A;border: 1px solid #F0712A;color:#FFF;}
.product .pro-nav ul li dl dt{width:0;line-height: 0;position: absolute;right:-22.25rem;top:0; opacity: 0; transition: .5s;}
.product .pro-nav ul li dl dt img{width: 22.25rem;}
.product .pro-nav ul li.cur{width:43.65rem;padding:0 0 0 1.45rem;}
.product .pro-nav ul li.cur dd{width:20.3rem;}
.product .pro-nav ul li.cur dt{width: 22.25rem;opacity: 1;right:0;}
.product .pro-nav ul li.cur em{width:18.8rem;}
.product .pro-nav ul li.cur em a{width:5.9rem;}
.product .pro2-nav{margin-bottom: 2.55rem;}
.product .pro2-nav ul{display: flex;display: -webkit-flex;justify-content: space-between;-webkit-justify-content: space-between;flex-wrap: wrap;}
.product .pro2-nav ul li em{display: block; line-height: 3.8rem;padding:0 2.45rem;font-size: 1.2rem;color:#282828;font-family: 'OPPOSANS-R'; }
.product .pro2-nav ul li i{display: block;width:0; height:.15rem;background:#F1712A;margin:0 auto; transition: .5s;}
.product .pro2-nav ul li:hover em{color:#f1712a;font-weight: bold;}
.product .pro2-nav ul li:hover i{width:100%;}
.product .pro-list{padding-bottom:3.7rem;}
.product .pro-list ul li{width:100%;}
.product .pro-list ul li span{display: block;width:100%;border: 1px solid #D3D3D3; box-sizing: border-box; margin-bottom: .85rem;}
.product .pro-list ul li span a{display: block; position: relative;}
.product .pro-list ul li span a i{display: block;width:100%; line-height: 0;}
.product .pro-list ul li span a i img{width:100%;}
.product .pro-list ul li span a em{display: block;width:100%; line-height: 4.6rem;text-align: center;font-size: 1.2rem;color:#FFF; position: absolute;left:0;bottom:0;    background: rgba(0, 0, 0, .5);}
.product .pro-list ul li span:hover{border: 1px solid #F0712A;}
.product .pro-list ul li span:hover em{color:#F0712A;}
.product .pro-list .swiper-pagination{bottom:0; line-height: 0;}
.product .pro-list .swiper-pagination .swiper-pagination-bullet{width:.85rem; height:.85rem;background:#043A7A;margin:0 .4rem;}
.product .pro-list .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background:#F0712A;}
/**/
.super{padding:2.65rem 0 0;background:#F5F5F5;}
.super h2{text-align: center; margin-bottom: .9rem;}
.super h2 span{display: block; line-height: 4.4rem;font-size: 2.75rem;color:#000000; font-family: 'OPPOSANS-B'; font-weight: normal;}
.super h2 span i{display: inline-block;font-size: 3.5rem;color:#043a7a;}
.super h2 em{display: block; line-height: 2.25rem;font-size: 1rem;color:#000000;font-family: 'OPPOSANS-R';font-weight: normal;}
.super .sup-con{position: relative;}
.super .sup-con dl{position: relative;}
.super .sup-con dl dt{width:100%; line-height: 0;}
.super .sup-con dl dt img{width:100%;}
.super .sup-con dl dd{width: 100%;padding-top:6.05rem; position: absolute;left:0;top:0;z-index:200;}
.super .sup-con dl dd h4{margin-bottom: 2.1rem;}
.super .sup-con dl dd h4 span{display: block; line-height: 2.6rem;font-size: 2rem;color:#FFF; margin-bottom: 1.45rem; font-weight: normal;}
.super .sup-con dl dd h4 span i{color:#fe772c;}
.super .sup-con dl dd h4 em{display: block;width:3.45rem;height:.3rem;background:#FFFFFF; border-radius: .15rem;}
.super .sup-con dl dd p em{display: block; line-height: 1.5rem;font-size: 1rem;color:#ffffff; margin-bottom: 1.5rem;font-family: 'OPPOSANS-R';}
.super .sup-con dl dd p em i{color:#fe772c;}
.super .sup-con .sup-nav{width:70.35rem;height:7.55rem;background:#003E97;border-radius: 0px 1.5rem 1.5rem 0px; position: absolute;left:0;bottom:0; z-index:200;padding-left:8.05rem; box-sizing: border-box;}
.super .sup-con .sup-nav ul li{float:left;padding:1rem 3.7rem 0 3.85rem; position: relative;}
.super .sup-con .sup-nav ul li:first-child{padding-left:0;}
.super .sup-con .sup-nav ul li:before{width:.05rem; height:4.4rem;background:#FFFFFF; content:"";position: absolute;right:0;top:1.65rem;}
.super .sup-con .sup-nav ul li:last-child:before{display: none;}
.super .sup-con .sup-nav ul li h4{ line-height: 3.05rem;font-size: 1.5rem;color:#ffffff;font-family: 'OPPOSANS-B'; font-weight: normal;}
.super .sup-con .sup-nav ul li i{display: block;width:1.7rem;height:.2rem;background:#FFFFFF;border-radius: .1rem;}
.super .sup-con .sup-nav ul li em{display: block; line-height: 2.5rem;font-size: .7rem;color:#ffffff; font-family: 'OPPOSANS-R'; font-weight: 300;}
.super .sup-con .sup-list .swiper-pagination{ left:auto;right:0; bottom:4.25rem;width:21.55rem; line-height: 3rem;font-size: 3rem;color:#ffffff;font-family: 'OPPOSANS-B';}
.super .sup-con .sup-jt{width:10.2rem;height:3.1rem;position: absolute;right:7.95rem; top:18.05rem;z-index:200;}
.super .sup-con .sup-jt i{display: block;width:4.15rem;height:3.15rem;cursor: pointer;float:left;}
.super .sup-con .sup-jt i.sup-prev{background:url(../images/sup-prev.png) no-repeat center;background-size:100% 100%;}
.super .sup-con .sup-jt i.sup-next{background:url(../images/sup-next.png) no-repeat center;background-size:100% 100%;float:right;}
/**/
.video{padding:3.7rem 0 6.2rem;}
.video h2{text-align: center; margin-bottom: 1.3rem;}
.video h2 span{display: block; line-height: 4.05rem;font-size: 2.75rem;color:#000000;font-family: 'OPPOSANS-B'; font-weight: normal;}
.video h2 em{display: block; line-height: 2.3rem;font-size: 1rem;color:#000000; font-weight: normal;}
.video .vid-con{position: relative;}
.video .vid-list ul li {width: 100%;}
.video .vid-list ul li dl dt {width: 100%;line-height: 0;position: relative;}
.video .vid-list ul li dl dt i {display: block;width: 100%;line-height: 0;overflow: hidden;border-radius: 0.3rem;}
.video .vid-list ul li dl dt i img {width: 100%;}
.video .vid-list ul li dl dt span {display: block;width: 3.5rem;height: 3.5rem;position: absolute;left: 1.1rem;bottom: 1.1rem;}
.video .vid-list ul li dl dt span img {width: 100%;}
.video .vid-list ul li dl dt video {position: absolute;left: 0px;top: 0px;width: 100%;height: 100%;z-index: 3;background: rgb(0, 0, 0);opacity: 0;transition: 0.5s;}
.video .vid-list ul li dl dd {height: 5.95rem;line-height: 1.4rem;background: #F4F4F4;padding: 1.55rem 3rem 0px;box-sizing: border-box;text-align: center;font-size: 1rem;color: rgba(46, 46, 46, 0.8);font-family: 'OPPOSANS-R';border-radius: 6px;}
.video .vid-list ul li:hover video {opacity: 1;}
.video .vid-list ul li:hover dl dd {background: #F0712A;color: #FFF;}
.video .vid-jt i {display: block;width: 48px;height: 48px;cursor: pointer;}
.video .vid-jt i.vid-prev {background: url("../images/vid-prev.png") center;background-size:100% 100%;position: absolute;left: -50px;top: 40%;}
.video .vid-jt i.vid-next {background: url("../images/vid-next.png") center; background-size:100% 100%;position: absolute;right: -50px;top: 40%;}
/**/
.news{padding:3.5rem 0 6.7rem; position: relative;background:#F5F5F5;}
.news h2{text-align: center; margin-bottom: 1.45rem;}
.news h2 span{display: block;line-height: 4.2rem;font-size: 2.75rem;color:#030000;font-weight: normal;font-family: "OPPOSANS-B";}
.news h2 em{display: block; line-height: 2.25rem;font-size: 1rem;color:#000000;font-family: 'OPPOSANS-R'; font-weight: normal;}
.news .news-left{width: 32.95rem;float:left;}
.news .news-left h3{height:3.4rem;}
.news .news-left h3 a{display: inline-block; line-height: 3.4rem;padding-left:2.85rem;background:url(../images/news-ico1.png) no-repeat left;background-size:2.05rem 1.5rem; font-size: 1.2rem;color:#f0712a; font-weight: normal;}
.news .news-left dl dt{width:100%; line-height: 0; overflow: hidden;}
.news .news-left dl dt img{width: 100%; transition: 1s;}
.news .news-left dl dd{padding-top:1.2rem;}
.news .news-left dl dd h4{margin-bottom: .45rem;}
.news .news-left dl dd h4 a{display: block; line-height: 1.85rem;font-size: .9rem;color:#272828; font-weight: bold;}
.news .news-left dl dd p{line-height: 1.5rem; margin-bottom: 1.1rem;font-size: .7rem;color:#5d5d5d;}
.news .news-left dl dd span{display: block; line-height: 1.45rem;font-size: .7rem;color:#c5c5c5;}
.news .news-rig{width:43.05rem;float:right;}
.news .news-rig h3{height:3.4rem;}
.news .news-rig h3 a{display: block; line-height: 3.4rem;float:left;padding-left:2.2rem;font-size: 1.2rem;color:#282828;font-family: 'OPPOSANS-R'; font-weight: normal; margin-right: 3.8rem;}
.news .news-rig h3 a.cj{background:url(../images/news-ico2.png) no-repeat left;background-size:1.65rem 1.5rem;}
.news .news-rig h3 a.gd{background:url(../images/news-ico3.png) no-repeat left;background-size:1.65rem 1.5rem;}
.news .news-rig ul li{padding:.75rem 0 0; height:7rem!important;border-top:.1rem solid rgba(39,40,40,.05);box-sizing: border-box;}
.news .news-rig ul li:last-child{border-bottom:.1rem solid rgba(39,40,40,.05);}
.news .news-rig ul li dl dt{width:9.6rem; line-height: 0;float:left;}
.news .news-rig ul li dl dt img{width:100%; transition: 1s;}
.news .news-rig ul li dl dd{width:31.55rem;float:right;padding-top:1.1rem;}
.news .news-rig ul li dl dd p{ height:3.3rem;line-height: 1.65rem;font-size: .75rem;color:#272828;}
.news .news-rig ul li dl dd i{display: block; line-height: 1.75rem;text-align: right;font-size: .7rem;color:#c5c5c5; margin-top:-1.75rem;}
/**/
.about{height:64.95rem;background:url(../images/about.jpg) no-repeat center;background-size:100% 100%;}
.about .abo-top{height: 45.6rem;padding-top:5.95rem; box-sizing: border-box;}
.about .abo-top h2{ line-height: 3.7rem; margin-bottom: 3.9rem;font-size: 3.25rem;color:#ffffff; font-weight: bold;font-family: 'OPPOSANS-R';}
.about .abo-top span{display: block; line-height: 2.35rem;font-size: 1.7rem;color:#ffffff;font-family: 'OPPOSANS-B'; margin-bottom: .8rem;}
.about .abo-top p{line-height: 1.5rem; margin-bottom: 2.8rem;font-size: .8rem;color:#ffffff;width:28.8rem;}
.about .abo-top strong{display: block;width:6.5rem;height:2.35rem;background:#F0712A;border-radius: .5rem;}
.about .abo-top strong a{display: block; line-height: 2.35rem; text-align: center;font-size: .9rem;color:#ffffff;font-family: 'OPPOSANS-R'; font-weight: normal;}
.about .abo-bot ul li{width:100%;}
.about .abo-bot ul li span{display: block;width:100%; line-height: 0; overflow: hidden;}
.about .abo-bot ul li span img{width:100%; transition: 1s;}
.about .abo-bot ul li em{display: block; line-height: 3.65rem;text-align: center;font-size: 1rem;color:#282828;}





























































































































































































html{font-size:10px;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0);}
@media screen and (min-width:320px){html{font-size:8.6px;}}
@media screen and (min-width:360px){html{font-size:9.6px;}}
@media screen and (min-width:375px){html{font-size:10px;}}
@media screen and (min-width:400px){html{font-size:10.6px;}}
@media screen and (min-width:414px){html{font-size:11px;}}
@media screen and (min-width:440px){html{font-size:11.8px;}}
@media screen and (min-width:480px){html{font-size:12.8px;}}
@media screen and (min-width:520px){html{font-size:13.8px;}}
@media screen and (min-width:560px){html{font-size:15px;}}
@media screen and (min-width:600px){html{font-size:16px;}}
@media screen and (min-width:640px){html{font-size:17px;}}
@media screen and (min-width:680px){html{font-size:18.2px;}}
@media screen and (min-width:700px){html{font-size:18.6px;}}
@media screen and (min-width:720px){html{font-size:19.2px;}}
@media screen and (min-width:750px){html{font-size:20px;}}


@media screen and (min-width: 800px) {html {font-size: 12.6px;}}
@media screen and (min-width: 900px) {html {font-size: 12.6px;}}
@media screen and (min-width: 1000px) {html {font-size: 12.6px;}}
@media screen and (min-width: 1100px) {html {font-size: 12.6px;}}
@media screen and (min-width: 1200px) {html {font-size: 12.6px;}}
@media screen and (min-width: 1280px) {html {font-size: 13.4px;}}
@media screen and (min-width: 1366px) {html {font-size: 14.2px;}}
@media screen and (min-width: 1440px) {html {font-size: 15px;}}
@media screen and (min-width: 1600px) {html {font-size: 16.6px;}}
@media screen and (min-width: 1920px) {html {font-size: 20px;}}