.page .swiper-pagination{ display: none; position:absolute; z-index:10!important; width: 10px; margin-bottom: 0; transform: translateY(-50%); left: auto!important; right:0.3rem!important; top: 50%!important; margin-left: 0px!important;} 
.page .swiper-pagination-bullet{ cursor: pointer; display:block; opacity: 1; border-radius: 50%; width: 10px; height: 10px; margin: 10px 0!important; background: rgba(255,255,255,0.35); }
.page .swiper-pagination-bullet-active { background: #008ffe;}


@media screen and (min-width: 800px) {
	#page {
    height: 100vh;
    position: relative;
    overflow: hidden; }

  .pageSlide {
    height: 100vh;
    overflow: hidden;}

	.slideUp {
    opacity: 0;
    transition: All 0.6s linear;
    -webkit-transition: All 0.6s linear;
    -moz-transition: All 0.6s linear;
    -o-transition: All 0.6s linear;
    transform: translateY(30px);
    -webkit-transform: translateY(30px);
    -moz-transform: translateY(30px); }

  .pageSlide.swiper-slide-active .slideUp {
    opacity: 1;
    transition-delay: 0.6s;
    -webkit-transition-delay: 0.6s;
    -moz-transition-delay: 0.6s;
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0); }

  .slideLeft {
    opacity: 0;
    transition: All 0.6s linear;
    -webkit-transition: All 0.6s linear;
    -moz-transition: All 0.6s linear;
    -o-transition: All 0.6s linear;
    transform: translateX(-30px);
    -webkit-transform: translateX(-30px);
    -moz-transform: translateX(-30px); }

  .pageSlide.swiper-slide-active .slideLeft {
    opacity: 1;
    transition-delay: 0.6s;
    -webkit-transition-delay: 0.6s;
    -moz-transition-delay: 0.6s;
    transform: translateX(0);
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0); }

    .slideRight {
    opacity: 0;
    transition: All 0.6s linear;
    -webkit-transition: All 0.6s linear;
    -moz-transition: All 0.6s linear;
    -o-transition: All 0.6s linear;
    transform: translateX(30px);
    -webkit-transform: translateX(30px);
    -moz-transform: translateX(30px); }

  .pageSlide.swiper-slide-active .slideRight {
    opacity: 1;
    transition-delay: 0.6s;
    -webkit-transition-delay: 0.6s;
    -moz-transition-delay: 0.6s;
    transform: translateX(0);
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0); }

  .pageSlide.swiper-slide-active .slideDelay2 {
    transition-delay: 0.9s;
    -webkit-transition-delay: 0.9s;
    -moz-transition-delay: 0.9s; }
  .pageSlide.swiper-slide-active .slideDelay3 {
    transition-delay: 1.2s;
    -webkit-transition-delay: 1.2s;
    -moz-transition-delay: 1.2s; }
  .pageSlide.swiper-slide-active .slideDelay4 {
    transition-delay: 1.5s;
    -webkit-transition-delay: 1.5s;
    -moz-transition-delay: 1.5s; }
  .pageSlide.swiper-slide-active .slideDelay5 {
    transition-delay: 1.8s;
    -webkit-transition-delay: 1.8s;
    -moz-transition-delay: 1.8s; }
  .pageSlide.swiper-slide-active .slideDelay6 {
    transition-delay: 2.1s;
    -webkit-transition-delay: 2.1s;
    -moz-transition-delay: 2.1s; }
	
	.pageSlide.footBox { height: 4.8rem; padding-top: 1.0rem; background: #02183b; }
}

.pageSlide {
  position: relative;
  overflow: hidden; }
.pageSlide.cur .bg{ animation: myScale 3s forwards;}



.indexPart1 .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100vh; background: center no-repeat; background-size: cover; z-index: 2; }
.indexPart1 .txt{ position: relative; z-index: 3; color: #008ffe; font-size: 90px; line-height: 90px; font-weight: bold; text-align: center;}
.indexPart1 .wen{ position: relative; z-index: 3; font-size: 30px; line-height: 30px; padding-top: 30px; color: #fff; text-align: center;}
.indexPart1 .btnDiv{ position: relative; z-index: 3; padding-top: 100px; text-align: center;}
.indexPart1 .btnDiv li{ display: inline-block; margin: 0 20px; position: relative;}
.indexPart1 .btnDiv li a{ display: block; text-align: left; width: 198px; height: 53px; line-height: 53px; font-size: 18px; color: #fff; text-indent: 85px; border: #b6b6b6 solid 1px; background: #000; border-radius: 8px; }
.indexPart1 .btnDiv li a img{ position: absolute; left: 32px; top: 50%; margin-top: -17px; }
.indexPart1 .btnDiv li .layerDiv{ position:absolute; z-index: 2; box-sizing: border-box; left: 50%; margin-left: -107px; overflow: hidden; width: 214px; padding-top: 13px; top: 45px; opacity: 0; visibility: hidden;}
.indexPart1 .btnDiv li .layerDiv .bgbg{ position: absolute; left: 50%; margin-left: -10px; top: 0; width: 20px; height: 13px; background: url(../images/nimg20Bg.png) no-repeat; }
.indexPart1 .btnDiv li .layerDiv .ewm{ background: #fff; padding: 10px 0;}
.indexPart1 .btnDiv li.on .layerDiv{ opacity: 1; visibility: visible; top: 55px;}
.indexPart1 .btnDiv li .rimg{ display: none; }

.indexPart2{ position: relative;}
.indexPart2 .bg{ position: absolute; left: 0; top: 0; width: 100%; height: 100vh; background: center no-repeat; background-size: cover; z-index: 2;}
.indexPart2 .layerDiv{ position: relative; z-index: 5;}
.indexPart2 .num{ padding-bottom: 20px; }
.indexPart2 .txt{ font-size: 60px; line-height: 60px; color: #008efc; padding-bottom: 90px; }
.indexPart2 .msg{ color: rgba(255,255,255,0.8); font-size: 24px; line-height: 24px; padding-bottom: 130px;}
.pre-wrap{width: 43px; height: 61px; position:relative;animation:start 2.5s infinite ease-in-out;-webkit-animation:start 2.5s infinite ease-in-out;-moz-animation:start 2.5s infinite ease-in-out;}


@keyframes start{0%,30%{opacity:0;-webkit-transform:translate(0,-8px)}60%{opacity:1;-webkit-transform:translate(0,0)}100%{opacity:0;-webkit-transform:translate(0,10px)}}
@-webkit-keyframes start{0%,30%{opacity:0;-webkit-transform:translate(0,-8px)}60%{opacity:1;-webkit-transform:translate(0,0)}100%{opacity:0;-webkit-transform:translate(0,10px)}}
@-moz-keyframes start{0%,30%{opacity:0;-moz-transform:translate(0,-8px)}60%{opacity:1;-moz-transform:translate(0,0)}100%{opacity:0;-moz-transform:translate(0,10px)}}

.indexPart3{ position: relative;}
.indexPart3 .bg{ position: absolute; left: 0; top: 0; width: 100%; height: 100vh; background: center no-repeat; background-size: cover; z-index: 2;}
.indexPart3 .layerDiv{ position: relative; float: right; z-index: 5; width: 510px;}
.indexPart3 .num{ padding-bottom: 20px; }
.indexPart3 .txt{ font-size: 60px; line-height: 60px; color: #008efc; padding-bottom: 90px; }
.indexPart3 .msg{ color: rgba(255,255,255,0.8); font-size: 24px; line-height: 24px; padding-bottom: 130px;}

.indexPart4{ position: relative;}
.indexPart4 .bg{ position: absolute; left: 0; top: 0; width: 100%; height: 100vh; background: center no-repeat; background-size: cover; z-index: 2;}
.indexPart4 .layerDiv{ position: relative; z-index: 5;}
.indexPart4 .num{ padding-bottom: 20px; }
.indexPart4 .txt{ font-size: 60px; line-height: 60px; color: #008efc; padding-bottom: 90px; }
.indexPart4 .msg{ color: rgba(255,255,255,0.8); font-size: 24px; line-height: 24px; padding-bottom: 130px;}

.ewm-modal-box { display: none; width: 100%; height: 100%; position: fixed; left: 0; top: 0; background: rgba(0, 0, 0, 0.5); z-index: 999;}
.ewm-modal-box .box {
  width: 100%;
  height: 100%;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 10;
  display: flex;
  display: -webkit-box;
  /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
  display: -moz-box;
  /* Firefox 17- */
  display: -webkit-flex;
  /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
  display: -moz-flex;
  /* Firefox 18+ */
  display: -ms-flexbox;
  /* IE 10 */
  align-items: center;
  box-sizing:border-box;
}
.ewm-modal-box .main { position: relative; background: #fff; width: 150px; margin: 0 auto; padding: 10px;}
.ewm-modal-box .close { position: absolute; right: 0; top: -40px; z-index: 10; width: 30px; height: 30px; display: inline-block; background: url(../images/close2.png) no-repeat; background-size: contain;
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;}
.ewm-modal-box .close:hover { transform: rotate(-90deg);}
.ewm-modal-box .pic-box img { display: block; width: 150px;}



























































