@import url(../fonts/iconfont.css);
*{margin: 0;padding: 0;box-sizing: border-box;font-family: 'Microsoft Yahei'}
a{text-decoration: none;color: #222}
a{-webkit-tap-highlight-color:rgba(0,0,0,0);}
.none{display: none}
body,html{width: 100%;height: 100%;overflow: hidden;}
body{font-size: .16rem}
img{border: 0;display: block;max-width: 100%}
ul{list-style: none}
#browser-modal{width:100%;height:100%;top:0;left:0;text-align:center;color:#303233;position:fixed;z-index:9999;}
#browser-modal .browser-modal-cover{position:fixed;left:0;top:0;height:100%;width:100%;background-color:#111;;z-index:-1}
#browser-modal .browser-content{width:700px;margin-top:120px;margin-left:auto;margin-right:auto;padding-bottom:80px;padding-top:50px;background-color:#fff;border-radius:5px}
#browser-modal .browser-content .browser-dpc-logo img{height:42px;margin:45px auto 40px}
#browser-modal .browser-content .browser-text-title{text-transform:uppercase;font-size:24px}
#browser-modal .browser-content .browser-text-desc{margin-top:30px;margin-bottom:20px;font-size:14px}
#browser-modal .browser-content .browser-list{width:600px;margin:20px auto;height:130px}
#browser-modal .browser-content .browser-item{float:left;width:150px;padding-top:20px;padding-bottom:20px;margin-left:auto;margin-right:auto}
#browser-modal .browser-content .browser-item .iconfont{width:100px;height:100px;margin:0 auto;font-size:80px;line-height:80px;margin-bottom:10px;}
#browser-modal .browser-content .browser-item .iconchrome{background: url(../images/bro.png) no-repeat 0 0}
#browser-modal .browser-content .browser-item .iconfirefox{background: url(../images/bro.png) no-repeat 0 -100px}
#browser-modal .browser-content .browser-item .iconopera{background: url(../images/bro.png) no-repeat 0 -200px}
#browser-modal .browser-content .browser-item .iconEdge{background: url(../images/bro.png) no-repeat 0 -300px}
#browser-modal .browser-content .browser-item a{cursor:pointer;display:block}
#browser-modal .browser-content .browser-item a img{display:block;margin:0 auto;max-width:100px;width:100px;height:100px}
#browser-modal .browser-content .browser-item a h4{text-align:center;margin-top:20px;font-size:18px;font-weight:700}
.skip{position: absolute;right: .3rem;top:.3rem;background: #dab370;width: 1rem;height: .35rem;text-align: center;
	line-height: .35rem;border-radius: 50px;z-index: 100;color: #fff;font-size: .16rem;border: 0;display: block; outline: none;cursor: pointer;}


.flex{display:flex;justify-content:space-between;flex-wrap:wrap}
.flex-left{display:flex;flex-wrap:wrap}
.flex-center{display:flex;flex-wrap:wrap;justify-content: center;}
.flex-right{display:flex;flex-wrap:wrap;justify-content: flex-end;}
.flex-v-center{display:-webkit-flex;display:flex;flex-direction:column;justify-content:center}
.flex-v{display:-webkit-flex;display:flex;flex-direction:column;justify-content:space-between;}
.flex-v-bottom{display: -webkit-flex;display: flex;align-items: flex-end;flex-wrap: wrap;justify-content: left;}
.videoU{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-align:center;
  -webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:horizontal;-webkit-box-direction:normal;
  -webkit-flex-direction:row;-moz-box-orient:horizontal;-moz-box-direction:normal;-ms-flex-direction:row;flex-direction:row;
  -webkit-justify-content:space-around;-ms-flex-pack:distribute;justify-content:space-around;height:100vh;
  overflow:hidden;width: 100%;position: fixed;left: 0;top:0;z-index: 8}
/*.videoU:before{content: '';position: absolute;left: 0;top:0;width: 100%;height: 100%;background: rgba(0,0,0,.5);z-index: 1}*/
.videoU video{min-width:100%;min-height:100%;position:absolute;top:50%;left:50%;-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0);
  z-index: 0;transform-origin: center;}
@media screen and (max-width:1600px){
.videoU video{transform:translate3d(-50%,-50%,0) scale(.9);}
}
@media screen and (max-width: 1440px){
.videoU video{transform:translate3d(-50%,-50%,0) scale(.8);}
}
@media screen and (max-width: 1366px){
.videoU video{transform:translate3d(-50%,-50%,0) scale(.75);}
}
@media screen and (max-width: 1280px){
.videoU video{transform:translate3d(-50%,-50%,0) scale(.7);}
}

.picbg{position: fixed;z-index: 6;left: 0;top:0;right: 0;bottom: 0;background-size: 100% 100%}
#logo{position: absolute;left: 1rem;top:.3rem;width:4.02rem;height: .8rem;z-index:12}
#logo img{max-width: 100%;display: block;}


@keyframes up{0%{transform:translateY(10px);}
50%{transform:translateY(0);}
100%{transform:translateY(10px);}
}
@keyframes up{0%{transform:translateY(0);}
50%{transform:translateY(-15px);}
100%{transform:translateY(0);}
}
@keyframes sc{0%{transform:scale(1);}
50%{transform:scale(.9);}
100%{transform:scale(1);}
}
.mob{display: none}
.loader{position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 999;background: url(../images/vv.jpg) no-repeat center;background-size: cover;}
.content{z-index: 10;}
.content ul{position: absolute;left: 0;right: 0;bottom: -30%;color: #fff;z-index: 10}
.content ul li{margin: 0 1%;position: relative;}
.content ul li img{width: 1.4rem}
.content ul li.sp img{width: 1.84rem;margin: 0 auto ; margin-bottom: .2rem;}
.content ul li.sp .btn a{display: block;;height: .35rem;line-height: .3rem; border-radius: .05rem;background: #059299;border: 2px solid #059299;color: #fff;padding: 0 .1rem;font-size: .14rem;margin: 0 .1rem;position: relative;}
.content ul li.sp .btn a span{position: absolute;width: 1.2rem;left: 50%;margin-left: -.6rem;top:100%;opacity: 1;visibility: inherit;/* transform: translateY(20px); */transition: .4s;padding-top: .1rem;}
.content ul li.sp .btn a:hover span{opacity: 1;visibility: inherit;transform: translateY(0);}
.content ul li.sp .btn a:hover,.content ul li.sp .btn a:hover{background: #16759d;border: 2px solid #16759d}
.content ul li.sp .btn a i{font-size: .2rem;margin-right: 5px;vertical-align: -.02rem}
.content ul li .t{position: absolute;left: 0;right: 0;z-index: 2;color: #fff;text-align: center;bottom: .65rem;}
.content ul li .t i{font-size: .35rem;display: inline-block;margin-bottom: .1rem;transition: .3s}
.content ul li .t p{font-size: .18rem;transition: .3s;font-weight: bold;}
.content ul li.flex-v-bottom:hover img{transform: rotateY(180deg);transition: .8s .3s}
.content ul li .sc{transition: .3s}
.content ul li .sc:hover p{font-weight: bold;}
.content ul li .sc:hover{transform:scale(1.2);}
#yuanqing a i{width:55px;height: 35px;display:block;margin: 0 auto 10px auto;background:url(../images/jzicon.png) no-repeat center;background-size: contain;}
.content ul li .t:before {opacity: 0; content: ""; display: block; width: 1rem; height: 1rem; position: absolute; top: 50%; left: 50%; margin-top: -.5rem; margin-left: -.5rem; background: url(../images/ydy-8.png) no-repeat center;background-size: 100% 100% }
.content ul li .t:after {opacity: 0; content: ""; display: block; width: .8rem; height: .8rem; position: absolute; top: 50%; left: 50%; margin-top: -.4rem; margin-left: -.4rem; background: url(../images/ydy-9.png) no-repeat center;background-size: 100% 100% }
.content ul li:hover .t:before { -webkit-animation: yuanbox 5s linear 0s infinite; animation: yuanbox 5s linear 0s infinite;opacity: 1 }
.content ul li:hover .t:after { -webkit-animation: yuanbox1 5s linear 0s infinite; animation: yuanbox1 5s linear 0s infinite;opacity: 1 }
/*.content ul li.flex-v-bottom:hover{transform:translateY(-.1rem);}*/
@keyframes yuanbox {
 0% {
 -webkit-transform: rotate(0deg);
 transform: rotate(0deg)
}
 100% {
 -webkit-transform: rotate(360deg);
 transform: rotate(360deg)
}
}

@keyframes yuanbox1 {
 0% {
 -webkit-transform: rotate(360deg);
 transform: rotate(360deg)
}
 100% {
 -webkit-transform: rotate(0deg);
 transform: rotate(0deg)
}
}

.Mbtn{position: fixed;right: 0;top:40%;transform:translateY(-50%);z-index: 20;display: none;}
.Mbtn .navbtn{width: .8rem;height: .8rem;line-height: .8rem;text-align: center;border-radius: 50%;border-radius: 50%;position: relative;z-index: 2;cursor: pointer;}
.Mbtn .navbtn span{width: .8rem;height: .8rem;line-height: .8rem;font-size: .14rem;position: relative;z-index: 4;display: block;margin-right: 0}
.Mbtn .navbtn span:before{content:"";display:block;position:absolute;left:50%;top:50%;width:.66rem;height:.66rem;margin-left:-.33rem;margin-top: -.33rem; background: #e1e1e1;border-radius: 50%}
.Mbtn .navbtn span:after{content:"MENU";display:block;position:absolute;left:50%;top:50%;width:.54rem;height:.54rem;line-height: .54rem; margin-left:-.27rem;margin-top: -.27rem; background: #fff;border-radius: 50%;z-index:;color: #009281 }

.Mbtn .navbtn:after{content:"";display:block;position:absolute;left:50%;top:50%;width:.7rem;height:.7rem;margin-left:-.35rem;
margin-top:-.35rem;z-index:1;background:#000;-moz-border-radius:50%;-webkit-border-radius:50%;border-radius:50%;opacity:0;
animation:scaleAnim1 1.6s infinite linear;}

.Mbtn .navbtn:before{content:"";display:block;position:absolute;left:50%;top:50%;width:.8rem;height:.8rem;margin-left:-.4rem;
margin-top:-.4rem;z-index:1;background:#000;-moz-border-radius:50%;-webkit-border-radius:50%;border-radius:50%;opacity:0;
animation:scaleAnim2 1.6s infinite linear;}
.Mbtn:hover  .navbtn span:after{background: #079399;color: #fff;}
.Mbtn:hover  .navbtn span:before{background: #2ca19d;}
.Mbtn:hover .navbtn:after{background:#009281}
.Mbtn:hover .navbtn:before{background: #2ca19d;}

.Mbtn .navbtn:before{animation-delay:-.5s}
@keyframes scaleAnim2{0%{transform:scale(.3);opacity:0}
50%{transform:scale(.7);opacity:.4}
100%{transform:scale(1.4);opacity:0}
}
@keyframes scaleAnim1{0%{transform:scale(.3);opacity:0}
50%{transform:scale(.6);opacity:.8}
100%{transform:scale(1.6);opacity:0}
}
.Mbtn .menu{list-style:none;padding:0;margin:0;position:absolute;top:50%;left:50%;width: 3rem;height: 3rem; cursor:default;border-radius:50%;transform:scale(0) ;transition:transform 1.4s 70ms;z-index:-1;margin-left: -1.5rem;margin-top: -1.5rem;}
.Mbtn .menu:after{content: '';position:absolute;top:50%;left:50%;width: 5rem;height: 5rem;margin-left: -2.5rem;margin-top: -2.5rem;background: rgba(0,0,0,.3);border-radius: 50%;z-index: -2}
.Mbtn:hover .menu{transition:transform .4s 80ms,z-index 0s .5s;transform:scale(1);z-index:1}
.Mbtn .menu li{position:absolute;transform-origin:center;transition:all .5s .1s;line-height: .5rem;display: flex;opacity: 0;visibility: hidden;}
.Mbtn .menu li a{transition:all .4s ease 0s;width:.45rem;height:.45rem;line-height:.45rem;border-radius:50%;display: inline-block;font-size:.25rem;color:#fff;transition:.6s;text-decoration:none;text-align: center;position: relative;}
.Mbtn .menu li a:before{content:"";display:block;position:absolute;left:50%;top:50%;width:.56rem;height:.56rem;margin-left:-.28rem;margin-top: -.28rem;  background:rgba(0,0,0,.2);;border-radius: 50%}
.Mbtn .menu li a:after{content:"";display:block;position:absolute;left:50%;top:50%;width:.62rem;height:.62rem;line-height: .62rem; margin-left:-.31rem;margin-top: -.31rem; background:rgba(0,0,0,.1);border-radius: 50%; }


.Mbtn .menu li a i{transition:all .4s ease 0s;width:.44rem;height:.44rem;line-height:.44rem;border-radius:50%;background:rgba(0,0,0,.3);display: inline-block;font-size:.25rem;color:#fff;transition:.6s;text-decoration:none;text-align: center;font-style: normal;z-index: 3;position:absolute;left:50%;top:50%;margin-left: -.22rem;margin-top: -.22rem}


/*.Mbtn .menu li:hover span{color: #009281 }*/
.Mbtn .menu li span{margin-right: .1rem;color: #fff}
.Mbtn .menu li a:hover{color:#fff}
.Mbtn .menu li a:hover i{background:rgba(0,146,129,.6);;color:#fff}
.Mbtn .menu li a:hover:after{background:rgba(0,146,129,.2);}
.Mbtn .menu li a:hover:before{background:rgba(0,146,129,.3);}
.Mbtn .menu li:nth-child(1){top:-.35rem;left:1.15rem;display: block;text-align: center;}
.Mbtn .menu li:nth-child(1) span{display: block;line-height: .3rem;margin-right: 0;margin-bottom: .05rem}
.Mbtn .menu li:nth-child(2){top:.25rem;left:-.23rem;}
.Mbtn .menu li:nth-child(3){top:.88rem;left:-.68rem;}
.Mbtn .menu li:nth-child(4){bottom:.88rem;left:-.68rem;}
.Mbtn .menu li:nth-child(5){bottom:.25rem;left:-.23rem;}
.Mbtn .menu li:nth-child(5) a i{font-size: .2rem;}
.Mbtn .menu li:nth-child(6) a i{font-size: .2rem;}
.Mbtn .menu li:nth-child(6) span{display: block;line-height: .3rem;margin-right: 0;position: relative;top:-.08rem;}
.Mbtn .menu li:nth-child(6){bottom:-.42rem;left:1.2rem;display: block;text-align: center;}

.Mbtn.on .menu li{transition:all .3s;opacity: 1;visibility: inherit;}
.Mbtn.on .menu li:nth-child(1){transition-delay:.2s;}
.Mbtn.on .menu li:nth-child(2){transition-delay:.4s;}
.Mbtn.on .menu li:nth-child(3){transition-delay:.6s;}
.Mbtn.on .menu li:nth-child(4){transition-delay:.8s;}
.Mbtn.on .menu li:nth-child(5){transition-delay:1s;}
.Mbtn.on .menu li:nth-child(6){transition-delay:1.2s;}

@keyframes move{0%{left:0;}100%{left:-200vw;}}
@keyframes movem{0%{left:0;}100%{left:-680vw;}}
@keyframes movem1{0%{left:0;}100%{left:-944vw;}}
.moveBg .move{background: url(../images/bg.jpg) no-repeat left center;background-size:cover;position: absolute;left: 0;top:0;bottom: 0;width:330vw;}
.moveBg.on .move{animation:move 100s linear infinite}

.stips {position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 9999;background: url(../images/v.jpg) no-repeat left center;background-size: cover;display: none;color: #fff;font-size: .23rem;;text-align: center;text-shadow: 0 2px 3px rgba(0,0,0,.5);padding-top: 10%;justify-content: center;}
.mobCon{position: fixed;top:0;left: 0;right: 0;bottom: 0;z-index: 10;padding-bottom: 20%}
.mobCon .list{width: 86vw;margin: 0 auto;max-width: 540px}
.mobCon .list ul li{box-shadow: 0 3px 10px rgba(0,0,0,.3)}
/*.mobCon .list ul li a:hover{color:#009180 }*/
.mobCon .list ul li i{color: #009180}
.mobCon .list1{margin-bottom: .2rem}
.mobCon .list1-1{width: 49%;}
.mobCon .list1-1 li{border-radius: .1rem;height: calc((100% - .3rem) / 3);background: #fff;}
.mobCon .list1-1 li .ico{width: .72rem;height: .8rem;background: url(../images/dp1.png) no-repeat center;background-size: 100% 100%;text-align: center;line-height: .7rem}
.mobCon .list1-1 li h4{text-align: center;font-size: .28rem}
.mobCon .list1-1 li i{font-size: .35rem}
.mobCon .list1-1 li h4 span{display: none;font-weight: normal;font-size: .15rem}
.mobCon .list1-1 li a{display: flex;justify-content: center;}
.mobCon .list1>li:nth-child(1){border-radius: .1rem;height:3.5rem;width:49%;background: url(../images/mmbg.png) no-repeat center;background-size: cover}
.mobCon .list1 li:nth-child(1) img{display: block;max-width: 75%;margin: 0 auto;max-height: 80%}

.mobCon .list1-1 li:hover{background:#009180  } 
 .mobCon .list1-1 li:hover .ico{background: url(../images/dp11.png) no-repeat center;background-size: 100% 100%; } 
.mobCon .list1-1 li:hover a{color: #fff }
.mobCon .list1-1 li:hover i{color: #fff }

.mobCon .list2 li{border-radius: .1rem;height: 1.5rem;background: #fff;width: 49%;}
.mobCon .list2 li .ico{width: .65rem;height: .72rem;background: url(../images/dp1.png) no-repeat center;background-size: 100% 100%;margin: 0 auto;text-align: center;line-height: .65rem}
.mobCon .list2 li a{display: block;}
.mobCon .list2 li h4{text-align: center;font-size: .28rem}
.mobCon .list2 li i{font-size: .32rem}
.mobCon .list2 li h4 span{font-size: .15rem;display: none;text-align: center;font-weight: normal;}
.mobCon .list2 li:hover{background:#009180  }
.mobCon .list2 li:hover .ico{background: url(../images/dp2.png) no-repeat center;background-size: 100% 100%; }
.mobCon .list2 li:hover a{color: #fff }
.mobCon .list2 li:hover i{color: #fff }
.mlogo img{height: 1.1rem;margin: 0 auto}
.mlogo{margin-bottom: 0.8rem}

@media screen and (max-width: 1080px){
.pc{display: none}
.mob{display: block;}
.loader{position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 999;background: #fff}
.moveBg .move{width:780vw;}
.moveBg.on .move{animation:movem 100s linear infinite}	
}
@media screen and (max-width: 640px){
.moveBg .move{width:1044vw;}
.moveBg.on .move{animation:movem1 100s linear infinite}
}