html,body{position:relative;height:100%; padding: 0; margin: 0;}
body{background:#eee;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;color:#000;margin:0;padding:0}
a:link,a:visited,a:hover,a:active{color:#555;text-decoration:none;}
ul,li,lo{ list-style: none; padding: 0; margin: 0;}
.swiper{width:100%;height:100%}
.swiper-slide{text-align:center;font-size:18px;background:#fff;display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center}

.sh-bg1{background: url(header.jpg) center no-repeat; background-size: cover}
.sh-bg2{background: url(n02.jpg) center no-repeat; background-size: cover}
.sh-bg3 {background: url(n03.jpg) center no-repeat; background-size:cover}
.sh-bg4 {background: url(n04.jpg) center no-repeat; background-size:cover}
.sh-bg5 {background: url(n05.jpg) center no-repeat}
.sh-bg6,.sh-bg7,.sh-bg8,.sh-bg10{background: url(n06.jpg) center no-repeat; background-size:cover}
.sh-bg9 {background: url(n08.jpg) center no-repeat}
.sh-bg11{background: url(n09.jpg) center no-repeat}

.endplay {position: absolute;z-index: 80;right: 66px;top: 78px;width: 136px;height: 40px;background: url(endplay.png) no-repeat 0 0/100% 100%;cursor: pointer;}

.btn-right{width: 55px; height: 86px; background: url(btn-right.png);}
.btn-left{width: 55px; height: 86px; background: url(btn-left.png);}

.t-pic{display: block; position:absolute;width: 1184px; height: 435px; top: 20%; left: 50%; margin-left:-592px}
@-webkit-keyframes tpic {
	0%{width:1px; height:1px;top:180px; left:50%;margin-left:0; opacity:0}
    100%{width:1184px; height:435px; opacity:1.0}
        }
.t-pic.animation{animation-name:tpic;animation-duration:1.5s;animation-fill-mode:forwards;}


.m-logo{display: block; position:absolute;width: 168px; height:25px; top:65%; right:23%}
@-webkit-keyframes mlogo {0%{ top:68%;opacity:0}100%{top:65%; opacity:1.0;}}
.m-logo.animation {animation-name:mlogo;animation-delay:0s;animation-duration:1.5s;animation-fill-mode:forwards;}


#quote{width:880px; display:none; position:absolute; left:50%; top:18%; margin-left:-440px;font-size:18px;line-height:32px;color:#fff; text-align: justify;}

#quotec{width:900px; display: none; position:absolute; left:50%; top:25%; margin-left:-440px;font-size:18px;line-height:32px;color:#fff; text-align: justify;}

.g-box-1{ position: absolute; width: 1114px; height: 675px; position: absolute; top:10%; left: 50%; margin-left: -557px; background: url(n03-a.png)  no-repeat; opacity: 0;}
@-webkit-keyframes box01 {0%{ top:50%;opacity:0}100%{top:10%; opacity:1.0;}}
.g-box-1-animation {animation-name:box01;animation-delay:0s;animation-duration:1.5s;animation-fill-mode:forwards;}


.m-tt-1{display: block; padding:290px 50px 0 615px; overflow: hidden;}
.m-tt-1 strong{display:block;color:#fff; font-size:32px; line-height:40px; margin-bottom:10px; text-align:justify;}
a.m-more-1{display:block; float:right; width:100px; height:30px; line-height:30px; color:#fff; background: #ea6a25; border-radius:8px; text-align: center; border-bottom-left-radius:0; border-top-right-radius:0; font-size: 14px;}
a.m-more-1:hover,.m-txt-1 a:hover,.m-txt-3 span a:hover{ background: #facd89; color: #472F19;}
.m-lst-1{ overflow: hidden; padding-top:70px;}
.m-lst-1 li{ display: block; float: left; width: 470px; height: 60px; line-height: 60px; padding:0 40px;box-sizing: border-box; }
.m-lst-1 a{display: block; padding-left:30px; color: #fff; font-size: 20px; height: 58px; border-bottom: 1px dashed #fff; background: url(ico-01.png) 5px center no-repeat;}
.m-lst-1 a:hover{color: #facd89;}
.m-tt-2 {position: absolute;width: 575px;height: 194px;top: 10%;left: 50%;margin-left: -287px}


.m-tt-3{position:absolute;width: 575px; height: 194px; bottom:14%; left:68%; margin-left:-287px;}
.g-tf{ position: relative; width: 1200px; height:700px}
.f01{position: absolute; display: block;width: 248px; height: 175px;top:25%; left:50%;margin-left: -140px;}
@-webkit-keyframes f01 {0%{top:25%}50%{top:27%}100%{top:25%}}
.f01{animation-name:f01;animation-delay:0.3s;animation-duration:3s;animation-iteration-count:infinite;}

.f02{position: absolute; display: block;width: 245px; height: 175px;top:45%; left:0;}
@-webkit-keyframes f02 {0%{top:45%}50%{top:43%}100%{top:45%}}
.f02{animation-name:f02;animation-delay:0.25s;animation-duration:2.5s;animation-iteration-count:infinite;}

.f03{position: absolute; display: block;width:156px; height: 175px;top:65%; left:46%}
@-webkit-keyframes f03 {0%{top:65%}50%{top:67%}100%{top:65%}}
.f03{animation-name:f03;animation-delay:0.25s;animation-duration:3.5s;animation-iteration-count:infinite;}

.f04{position: absolute; display: block;width:184px; height: 175px;top:40%; right:0;}
@-webkit-keyframes f04 {0%{top:40%}50%{top:37%}100%{top:40%}}
.f04{animation-name:f04;animation-delay:0.25s;animation-duration:3s;animation-iteration-count:infinite;}

/*第五屏*/
.g-box-2{ position:absolute;width: 1200px;height:650px; top: 10%; left: 50%; margin-left: -600px}

.g-box-map{position: relative; width: 1200px; height: 600px; margin:13% auto 0 auto}

.m01{position: absolute; width:20%; left:40%; top:0%; opacity: 0; cursor:pointer}
@-webkit-keyframes m01 {0%{ left:20%;opacity:0}100%{left:40%; opacity:1.0;}}
.m01-animation {animation-name:m01;animation-delay:0s;animation-duration:1.5s;animation-fill-mode:forwards;}
.m01:hover,.m02:hover,.m03:hover,.m04:hover{-webkit-filter: saturate(2);-moz-filter: saturate(2);-o-filter: saturate(2); -ms-filter: saturate(2);filter: saturate(2);}

.m02{position: absolute; width:20%; left:35%; top:13%; opacity: 0;cursor:pointer}
@-webkit-keyframes m02 {0%{ left:15%;opacity:0}100%{left:35%; opacity:1.0;}}
.m02-animation {animation-name:m02;animation-delay:0.2s;animation-duration:1.5s;animation-fill-mode:forwards;}

.m03{position: absolute; width:20%; left:38%; top:26%; opacity: 0;cursor:pointer}
@-webkit-keyframes m03 {0%{ left:18%;opacity:0}100%{left:38%; opacity:1.0;}}
.m03-animation {animation-name:m03;animation-delay:0.4s;animation-duration:1.5s;animation-fill-mode:forwards;}

.m04{position: absolute; width:20%; left:30%; top:60%; opacity: 0;cursor:pointer}
@-webkit-keyframes m04{0%{ left:10%;opacity:0}100%{left:30%; opacity:1.0;}}
.m04-animation {animation-name:m04;animation-delay:0.6s;animation-duration:1.5s;animation-fill-mode:forwards;}

.show01,.show02,.show03,.show04{display:none; position:absolute; right:0; top:-20px; width:40%}


/*第六屏*/
.m-tt-4{position:absolute;width:644px; height:179px; top:7%; left:50%; margin-left:-322px}
.g-box-3{ position: absolute; width: 1200px; height: 600px; top: 27%; left: 50%; margin-left: -600px; background: url(n06-b.png) center no-repeat}
.m-txt-1{position:  absolute; top: 10%; width:270px; height: 150px; color: #fff; right:4%; text-align: justify; line-height:32px; font-size:22px;}
.m-txt-1 strong{ display: block;font-weight:normal; margin-bottom: 10px; }
.m-txt-1 a{ display: block; float: right; padding: 0 2%; font-size: 12px; color: #fff;background: #ea6a25; border-radius:6px; text-align: center; border-bottom-left-radius:0; border-top-right-radius:0}

/*第七屏*/
.g-box-4{ position: absolute; width:1060px;height:390px;top:28%;left:50%; margin-left:-600px; padding:210px 0 0 140px;background:url(n07-b.png) center no-repeat}
.m-txt-2{float:left;width:210px; padding:0 20px; margin-right:100px; height: 150px; color: #222; right:4%; text-align: justify; line-height:26px; font-size:16px;}
.m-txt-2 strong{display: block; height:140px;font-weight:normal; margin-bottom:10px}
.m-txt-2 a{display: block; float: right; padding: 0 2%; font-size: 12px; color: #fff;background: #ea6a25; border-radius:6px; text-align: center; border-bottom-left-radius:0; border-top-right-radius:0}

/*第八屏*/
.g-box-5{position:absolute; width: 1200px; height: 600px; top: 30%; left: 50%; margin-left: -600px; background: url(n08-b.png) center no-repeat}
/*.m-txt-3{float:right;width:380px; padding:90px 110px; height: 150px; color: #222; right:4%; text-align: justify; line-height:26px; font-size:16px;}
.m-txt-3 strong a{display: block;margin-bottom:20px; color: #d14242; font-size: 22px;}
.m-txt-3 strong a:hover{ text-decoration: underline}
.m-txt-3 p{ display: block; margin-bottom: 20px; color: #777;}
.m-txt-3 span a{display: block; float: right; padding: 0 2%; font-size: 12px; color: #fff;background: #ea6a25; border-radius:6px; text-align: center; border-bottom-left-radius:0; border-top-right-radius:0}
.m-txt-3 span a:hover{background: #facd89;}*/

.m-lst-2{width: 350px; color: #fff; display: block; margin-bottom:30px; text-align: left;}
.m-lst-2 strong a{ display: block; font-size:24px; color: #fff; margin-bottom: 10px;}
.m-lst-2 p{ display: block; font-size:16px;}
.m-lst-2 strong a:hover{text-decoration: underline}
.txt01,.txt02,.txt03,.txt04,.txt05{position:absolute}
.txt01{top:60px; right:0}
.txt02{top:65px; left:20px}
.txt03{top:325px; left:5px}
.txt04{top:415px; right:15px}
.txt05{top:235px; right:-33px}



/*第9屏*/
.g-box-6{width: 1200px; height: 700px; position: relative;}
.m-tt-5{ position: absolute; top: 0; left: 0;}
.x01{ position: absolute; left: 0; opacity:0}
@-webkit-keyframes x01{0%{bottom:190px;opacity:0}100%{bottom:165px; opacity:1.0;}}
.x01-animation {animation-name:x01;animation-delay:0s;animation-duration:1s;animation-fill-mode:forwards;}

.x02{ position: absolute; left:245px; opacity:0}
@-webkit-keyframes x02{0%{bottom:260px;opacity:0}100%{bottom:218px; opacity:1.0;}}
.x02-animation {animation-name:x02;animation-delay:0.2s;animation-duration:1s;animation-fill-mode:forwards;}

.x03{ position: absolute; left:490px; opacity:0}
@-webkit-keyframes x03{0%{bottom:200px;opacity:0}100%{bottom:178px; opacity:1.0;}}
.x03-animation {animation-name:x03;animation-delay:0.4s;animation-duration:1s;animation-fill-mode:forwards;}

.x04{ position: absolute; left:735px; opacity:0}
@-webkit-keyframes x04{0%{bottom:285px;opacity:0}100%{bottom:280px; opacity:1.0;}}
.x04-animation {animation-name:x04;animation-delay:0.6s;animation-duration:1s;animation-fill-mode:forwards;}

.x05{ position: absolute; right:0; opacity:0}
@-webkit-keyframes x05{0%{bottom:450px;opacity:0}100%{bottom:414px; opacity:1.0;}}
.x05-animation {animation-name:x05;animation-delay:0.8s;animation-duration:1s;animation-fill-mode:forwards;}

.x06{ position: absolute; left:290px; bottom:-7px; opacity:0}
@-webkit-keyframes x06{0%{bottom:-30px;opacity:0}100%{bottom:-7px; opacity:1.0;}}
.x06-animation {animation-name:x06;animation-delay:0.25s;animation-duration:1s;animation-fill-mode:forwards;}

.x07{ position: absolute; left:626px; bottom:-25px; opacity:0}
@-webkit-keyframes x07{0%{bottom:-50px;opacity:0}100%{bottom:-25px; opacity:1.0;}}
.x07-animation {animation-name:x07;animation-delay:0.45s;animation-duration:1s;animation-fill-mode:forwards;}

.x08{ position: absolute; right:120px; bottom:150px; opacity:0}
@-webkit-keyframes x08{0%{bottom:100px;opacity:0}100%{bottom:150px; opacity:1.0;}}
.x08-animation {animation-name:x08;animation-delay:0.65s;animation-duration:1s;animation-fill-mode:forwards;}


/*第10屏*/
.g-box-7{width: 1200px; height: 750px; position: relative; background: url(n10a.png) center 240px no-repeat; overflow: hidden;}
.m-tt-6{ display: block; margin: 0 auto 70px auto;}

.ub01,.ub02,.ub03,.ub04,.ub05{position:absolute; display:block}
.ub01{ top:270px; opacity:0}
@-webkit-keyframes ub01{0%{left:0px;opacity:0}100%{left:70px; opacity:1.0;}}
.ub01-animation {animation-name:ub01;animation-delay:0s;animation-duration:1s;animation-fill-mode:forwards;}

.ub02{ top:270px;opacity:0}
@-webkit-keyframes ub02{0%{right:0px;opacity:0}100%{right:50px; opacity:1.0;}}
.ub02-animation {animation-name:ub02;animation-delay:0.2s;animation-duration:1s;animation-fill-mode:forwards;}

.ub03{ top:450px; opacity:0}
@-webkit-keyframes ub03{0%{right:-30px;opacity:0}100%{right:20px; opacity:1.0;}}
.ub03-animation {animation-name:ub03;animation-delay:0.4s;animation-duration:1s;animation-fill-mode:forwards;}

.ub04{ top:600px;  opacity:0}
@-webkit-keyframes ub04{0%{right:-30px;opacity:0}100%{right:60px; opacity:1.0;}}
.ub04-animation {animation-name:ub04;animation-delay:0.6s;animation-duration:1s;animation-fill-mode:forwards;}

.ub05{top:500px; opacity:0}
@-webkit-keyframes ub05{0%{left:20px;opacity:0}100%{left:90px; opacity:1.0;}}
.ub05-animation {animation-name:ub05;animation-delay:0.8s;animation-duration:1s;animation-fill-mode:forwards;}



/*视频*/
.endplay {position: absolute;z-index: 80;right: 66px;top: 78px;width: 136px;height: 41px;background: url(endplay.png) no-repeat 0 0/100% 100%;cursor: pointer;}
#m-video{position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: #000;z-index: 20;}

.g-qdlogo{ display:block; position:absolute; left:50%; top:70%; margin-left:-100px; opacity:0}
@-webkit-keyframes qdlogo{0%{top:73%;opacity:0}100%{top:70%; opacity:1.0;}}
.g-qdlogo-animation {animation-name:qdlogo;animation-delay:17s;animation-duration:1s;animation-fill-mode:forwards;}

.g-Planning{display:block; position:absolute; text-align:center; top:73%; color:#001c54; font-weight:bold; opacity:0}
@-webkit-keyframes Planning{0%{top:76%;opacity:0}100%{top:73%; opacity:1.0;}}
.g-Planning-animation {animation-name:Planning;animation-delay:17.5s;animation-duration:1s;animation-fill-mode:forwards;}