#fp-nav {position: fixed;z-index: 100;margin-top: -32px;top: 50%;opacity: 1;}
#fp-nav.right {right: 17px;}
#fp-nav.left {left: 17px;}
#fp-nav ul{  margin: 0;  padding: 0;}
#fp-nav ul li{display: block;width: 14px;height: 13px;margin: 7px;position:relative;}
#fp-nav ul li a{display: block;position: relative;z-index: 1;width: 100%;height: 100%;cursor: pointer;text-decoration: none;}
#fp-nav ul li .active span{background: #fff;}
#fp-nav ul li a span{top: 2px;left: 2px;width: 8px;height: 8px;border: 1px solid #156cb0;background:#156cb0;border-radius: 50%;position: absolute;z-index: 1;}
.mode_container{ width: 1100px; margin: 0 auto; position: relative; height: 100%;}
.part-1,.part-2,.part-3,.part-4,.part-5,.part-6,.part-7{text-align: center; overflow: hidden;}
.part-1{ background:url(images/p1_bg.jpg) no-repeat top center #000; background-size: cover; }
.part-1 h1{margin: 20px auto 10px auto;}
.part-1 .p1_title{ width: 100%; }
.part-1 .description{ color: #fff; text-shadow: 0 0 2px #000; line-height:23px; text-align: left; width: 80%; margin: 0 auto;}
.part-1 .p1_light,.part-1 .p1_lightt{ position: absolute; bottom:-400px; z-index:2;left:170px; }
.part-1 .p1_pic1{ position: absolute; bottom:12%;z-index:3; left:160px;}
.part-1 .p1_pic2{ position: absolute; bottom:37%;z-index:3; left:230px;}
.part-1 .p1_pic3{ position: absolute; bottom:46%;z-index:3; left:430px;}
.part-1 .p1_pic4{ position: absolute; bottom:37%;z-index:3; left:610px;}
.part-1 .p1_pic5{ position: absolute; bottom:12%;z-index:3; left:700px;}
.part-1 .p1_pic6{ position: absolute; bottom:10%;z-index:3; left:410px;}

.part-1 .p1_lightt,.part-6 .p6_pict{-webkit-animation: scaleout 1.3s infinite ease-in-out;animation: scaleout 1.3s infinite ease-in-out;}
@-webkit-keyframes scaleout {    0% { -webkit-transform: scale(1.0) }
    100% {-webkit-transform: scale(1.1);opacity: 0;}}
@keyframes scaleout {    0% {transform: scale(1.0);-webkit-transform: scale(1.0);    } 100% {transform: scale(1.1);-webkit-transform: scale(1.1);opacity: 0;}}

.part-1 .p1_light{ animation: spin 8s linear infinite;}
@keyframes spin {0% {    transform:rotate(0deg); } 100% {    transform:rotate(-360deg); }}


.p1_pic,.p1_pic:hover,.picfloat,.picfloat:hover,.p3_pic5,.p3_pic5:hover{transition:All 0.4s ease-in-out;-webkit-transition:All 0.4s ease-in-out;-moz-transition:All 0.4s ease-in-out;-o-transition:All 0.4s ease-in-out;}
.p1_pic:hover,.picfloat:hover,.p3_pic5:hover{transform:translate(0,-10px);-webkit-transform:translate(0,-10px);-moz-transform:translate(0,-10px);-o-transform:translate(0,-10px);-ms-transform:translate(0,-10px);}
@-webkit-keyframes movetop {0% { -webkit-transform: scale(1.0) } 100% {-webkit-transform: scale(1.1);opacity: 0;}}
@keyframes movetop {0% {transform: scale(1.0);-webkit-transform: scale(1.0);} 100% {transform: scale(1.1);-webkit-transform: scale(1.1);opacity: 0;}}

.part-2{ background:url(images/p2_bg.jpg) no-repeat top center #fefefe; background-size: cover;}
.part-2 h1{margin:10px auto;}
.part-2 .description{line-height:23px; text-align: left; width: 80%; margin: 0 auto;}
.part-2 .ftitle{ font-size:20px; text-align: center;}
.part-2 .p2_piclist{ position: absolute; height:70%; width: 100%; bottom: 0; left:-50px; }
.part-2 .p2_piclist_centont{ position: relative; height:100%;}
.part-2 .p2_pic{bottom:-120px;position: absolute;left:0; }
.part-2 .p3_pic{bottom:-60px;opacity: 0;position: absolute;left:0;}
.part-2 .p4_pic1{ position: absolute; display: none; bottom:5%; left:60px;}
.part-2 .p4_pic2{ position: absolute; display: none; bottom:38%; left:60px;}
.part-2 .p4_pic3{ position: absolute; display: none; bottom:57%; left:230px;}
.part-2 .p4_pic4{ position: absolute; display: none; bottom:58%; left:675px;}
.part-2 .p4_pic5{ position: absolute; display: none; bottom:37%; left:890px;}
.part-2 .p4_pic6{ position: absolute; display: none; bottom:5%; left:960px;}
.part-3{ position: relative; background: #000;}
#p3_list2 {background:url(images/p3_pic1.jpg) no-repeat top center #010916; background-size: cover; height:84%;}
#p3_list1 {background:url(images/p3_list1_bg.jpg) no-repeat top center #010916; background-size: cover; height:84%;}
#p3_list3 {background:url(images/p3_list3_bg.jpg) no-repeat top center #010916; background-size: cover; height:84%;}
.part-3 img,.part-3 h2{ position:absolute;left: 0;}
.part-3 .p3_title{left:20%; top:-100px ;bottom: auto; width:580px;}
.part-3 h2{ text-align: center;  font-size: 28px; color:#fff; width: 100%;top:50%; }
#p3_list2 .p3_pic3{ top:50%;left: 260px; }
#p3_list2 .p3_pic4{ top:50%;left: 260px; }
#p3_list2 .p3_pic5{ top:50%; left: 760px;}
#p3_list1 .p3_list1_pic1{ top:30%; left: -250PX; }
#p3_list1 .p3_list1_pic2{ top:30%; left: 250PX;}
#p3_list3 .p3_list3_pic1{ top:30%; left: -250PX; }
#p3_list3 .p3_list3_pic2{ top:30%; left: 250PX;}

.p3_nav{ position: absolute; width: 100%; background:#3db4ff; height:16%; bottom: 0; left: 0; z-index:100;}
.p3_nav ul{ width:100%; height:100%; }
.p3_nav li{ float: left;width: 33%; cursor: pointer;height:100%;}
.p3_nav li span{display: block; width:100%; height:100%;cursor: pointer;background-position:center center;  background-repeat: no-repeat;}
#p3_nav1 span{ background-image: url(images/p3_nav1.png); }
#p3_nav2 span{ background-image: url(images/p3_nav2.png); }
#p3_nav3 span{ background-image: url(images/p3_nav3.png); }
.p3_nav1on span{ background-image: url(images/p3_nav1_on.png) !important; }
.p3_nav2on span{ background-image: url(images/p3_nav2_on.png) !important; }
.p3_nav3on span{ background-image: url(images/p3_nav3_on.png) !important; }

.part-4{ background:url(images/p4_bg.jpg) no-repeat top center #fefefe; background-size: cover;}
.part-4 .p4_title{width:680px; margin-top:-120px;}
.part-4 h2{ text-align: center;  font-size: 28px;  width: 100%; margin-top:120px;}
.part-4 .box{position: relative;width: 880px;margin:60px auto 0 auto;height: 500px;}
.boxF, .boxS, .boxT, .overlay{width:150px;height: 200px;overflow: hidden;}
.boxF, .boxS{visibility: hidden;}
.boxF{position: absolute;transform: rotate(-30deg);margin-left: 10px;-ms-transform: rotate(-30deg);-moz-transform: rotate(-30deg);-webkit-transform: rotate(-30deg);}
.boxS{transform: rotate(-60deg);-ms-transform: rotate(-60deg);-moz-transform: rotate(-60deg);-webkit-transform: rotate(-60deg);}
.boxT{transform: rotate(-60deg);background: no-repeat 50% center;background-size: 125% auto;-ms-transform: rotate(-60deg);-moz-transform: rotate(-60deg);-webkit-transform: rotate(-60deg);visibility: visible;}
.overlay{transition: all 250ms ease-in-out 0s; position: relative; background: #efefef;display: block; width:200px; height:200px; cursor: pointer;}
.overlay:hover{background-color: rgba(0,0,0,0.6);}
.overlay .text{position: absolute;left:-30px;top:0;text-align: center;line-height:36px;width:100px;height:100px; padding:40px;text-decoration: none;font-size:30px;font-weight:bold;transform: rotate(150deg);margin-left: 10px;-ms-transform: rotate(150deg);-moz-transform: rotate(150deg);-webkit-transform: rotate(150deg); color: #fff; cursor: pointer;}
/*.texttwo{left:-30px;top:0;transform: rotate(150deg);margin-left: 10px;-ms-transform: rotate(150deg);-moz-transform: rotate(150deg);-webkit-transform: rotate(150deg);}*/
.content_box{position:relative; width:215px; height:215px; z-index: 2; overflow:visible;}
.boxFloat,.boxFloatS,.boxFloatT,.minbox{width:220px; height:176px;overflow:hidden;}
.boxFloat{position: absolute; left: 0. top:0;}
.boxFloatS{left: 0. top:0;transform: rotate(-60deg);-ms-transform: rotate(-60deg);-moz-transform: rotate(-60deg);-webkit-transform: rotate(-60deg);}
.boxFloatT{left: 0. top:0;transform: rotate(-60deg);-ms-transform: rotate(-60deg);-moz-transform: rotate(-60deg);-webkit-transform: rotate(-60deg);}
.minbox{margin-top:-20px;transition: all 250ms ease-in-out 0s;background: #148cd1;display: block; width:215px; height:215px; cursor: pointer;transform: rotate(-60deg);-ms-transform: rotate(-60deg);-moz-transform: rotate(-60deg);-webkit-transform: rotate(-60deg); }
.minbox .text{text-align: center; width:100%; height:100%;transform: rotate(-180deg);-ms-transform: rotate(-180deg);-moz-transform: rotate(-180deg);}
.minbox .texone{text-decoration: none;font-size:26px; color: #fff; line-height:50px;margin-top:-50px;}
.minbox .textwo{text-decoration: none;font-size:14px;color: #fff; width: 60%; margin:0 auto;}

.part-4 .box .pic_bg{ position: absolute; top:0; left: 0; }
.part-4 .box .pic{ position: absolute; z-index:9; display:none;}
.part-4 .box .pic1{ left: -40px; top:178px;}
.part-4 .box .pic3{ left: 112px; top:266px;}
.part-4 .box .pic4{ left: 250px; top:0px;}
.part-4 .box .pic7{ left: 400px; top:90px;}
.part-4 .box .pic8{ left:402px; top:250px;}
.part-4 .box .pic10{ left:535px; top:345px;}
.part-4 .box .pic11{ left: 680px; top:88px;}
.part-4 .box .pic12{ left: 680px; top: 253px;}

.part-4 .box .one{left:0px; top:160px;}
.part-4 .box .one .overlay{background: #f75925;}
.part-4 .box .two{left:140px; top:80px;}
.part-4 .box .two .overlay{background: #00b0f0;}
.part-4 .box .three{left:140px; top:240px;}
.part-4 .box .three .overlay{background: #00b0f0;}
.part-4 .box .four{left:280px; top:0px;}
.part-4 .box .four .overlay{background: #00b0f0;}
.part-4 .box .five{left:280px; top:160px;}
.part-4 .box .five .overlay{background: #00b0f0;}
.part-4 .box .six{left:280px; top:320px;}
.part-4 .box .six .overlay{background: #00b0f0;}
.part-4 .box .seven{left:420px; top:80px;}
.part-4 .box .seven .overlay{background: #f75925;}
.part-4 .box .eight{left:420px; top:240px;}
.part-4 .box .eight .overlay{background: #00b0f0;}
.part-4 .box .nine{left:560px; top:160px;}
.part-4 .box .nine .overlay{background: #00b0f0;}
.part-4 .box .ten{left:560px; top:320px;}
.part-4 .box .ten .overlay{background: #00b0f0;}
.part-4 .box .eleven{left:700px; top:80px;}
.part-4 .box .eleven .overlay{background: #00b0f0;}
.part-4 .box .twelve{left:700px; top:240px;}
.part-4 .box .twelve .overlay{background: #f75925;}

.part-5{ background: #0e171e; position: relative;}
.part-5 img,.part-5 h2,.part-5 p{ position:absolute;  }
.part-5 .p5_title{left:25%; top:-200px ; width:600px;}
.part-5 h2{ text-align: center; color: #fff;  font-size: 28px;  width: 100%;top:20%; left: 0; }
.part-5 p{ text-align: center; color: #fff; top:30%; left:80px;  text-align: left; width: 80%; line-height: 23px;}
.part-5 .p5_bg{left:50%; top:0; width: 10%;position:absolute; height: 100%; background: url(images/p5_bg.jpg) no-repeat center top; }
.part-5 .p5_pic{left:50%; margin-left: -300px; top:0;}
.part-5 span{position: absolute; color: #0c3f60; font-size:14px; font-weight:bold; text-shadow:0 0 1px #fff; transition:0.2s; cursor: pointer;}
.part-5 span:hover{ font-size: 16px;transition:0.2s; }
.part-5 .word1{ left:-10px; top:510px; }
.part-5 .word2{ left:185px; top:460px; }
.part-5 .word3{ left:285px; top:450px; }
.part-5 .word4{ left:380px; top:450px; }
.part-5 .word5{ left:475px; top:460px; }
.part-5 .word6{ left:760px; top:470px; }
.part-5 .word7{ left:830px; top:450px; }
.part-5 .word8{ right:-70px; top:440px; }
.part-5 .word9{ right:-20px; top:620px; }

.part-6{ background:url(images/p6_bg.jpg) no-repeat top center #fefefe; background-size:cover;position: relative;}
.part-6 img,.part-6 h2,.part-6 p{ position:absolute;}
.part-6 h2{ text-align: center; font-size: 28px; top:23%; left: 0; width:100%;}
.part-6 p{ text-align: center; top:23%; left: 80px; text-align: left; width: 80%;line-height: 23px;}
.part-6 .p6_pic{top:60%; left:5%; }
.part-6 .p6_pic1{top:46%; left:-120px; }
.part-6 .p6_pic2{top:60%; left:-120px; }
.part-6 .p6_pic3{top:46%; right:120px; }
.part-6 .p6_pic4{top:60%; right:120px; }
.part-6 .p6_pic5{top:15%; left:43%; }