﻿/* 首页 */
.home-Class .pageDiv {
  overflow: hidden;
  padding: 20px 15px;
  margin: 0 auto;
}

  .home-Class .pageDiv .homeImg {
    width: 290px;
    display: block;
    text-align: center;
    margin: 25px auto 0 auto;
  }

    .home-Class .pageDiv .homeImg > img {
      width: 100%;
    }

/* page1 */
.home-Class .Page .page1 {
  height: 100%;
  position: relative;
  background: url('/images/homeBG.png') center center no-repeat #3dd197;
  background-size: 350px auto;
}

  .home-Class .Page .page1 .scanningDiv {
    width: 333px;
    height: 333px;
    position: absolute;
    top: 50%;
    left: 50%;
    overflow: hidden;
    filter: alpha(opacity=90);
    -moz-opacity: 0.9;
    opacity: 0.9;
    border-radius: 200px;
    margin: -213px 0 0-166.5px;
  }

    .home-Class .Page .page1 .scanningDiv > i.Scanning {
      width: 200px;
      height: 200px;
      display: block;
      background: -webkit-linear-gradient(rgba(255,255,255,0.5), transparent); /* Safari 5.1 - 6.0 */
      background: -o-linear-gradient(rgba(255,255,255,0.5), transparent); /* Opera 11.1 - 12.0 */
      background: -moz-linear-gradient(rgba(255,255,255,0.5), transparent); /* Firefox 3.6 - 15 */
      background: linear-gradient(rgba(255,255,255,0.5), transparent); /* 标准的语法 */
      -webkit-transform-origin: 100% 100%; /* Safari 和 Chrome */
      -o-transform-origin: 100% 100%;
      -moz-transform-origin: 100% 100%; /* Firefox */
      -ms-transform-origin: 100% 100%; /* IE 9 */
      transform-origin: 100% 100%;
      -webkit-transform-style: preserve-3d;
      -o-transform-style: preserve-3d;
      -moz-transform-style: preserve-3d;
      -ms-transform-style: preserve-3d;
      transform-style: preserve-3d;
      -webkit-transform: rotate(30deg); /* Safari 和 Chrome */
      -o-transform: rotate(30deg);
      -moz-transform: rotate(30deg); /* Firefox */
      -ms-transform: rotate(30deg); /* IE 9 */
      transform: rotate(30deg);
      -webkit-animation: Scanning 5.9s infinite linear;
      animation: Scanning 5.9s infinite linear;
      /*mask-image:*/
      margin: -33.5px 0 0 -33.5px;
    }

  .home-Class .Page .page1 .downWork {
    width: 200px;
    position: absolute;
    left: 50%;
    bottom: 50px;
    color: #fff;
    font-size: 18px;
    text-align: center;
    line-height: 30px;
    background: url('/images/down.png') no-repeat;
    background-size: 100% auto;
    background-position: center bottom;
    padding-bottom: 10px;
    margin-left: -100px;
  }

/* page2 */
.home-Class .page2 > .Info {
  width: 100%;
  display: block;
  color: #555;
  font-size: 13px;
  line-height: 23px;
  max-width: 300px;
  margin: 15px auto 0 auto;
}

.home-Class .page2 .homeImg > img {
  width: 90%;
}

/* page3 */
.home-Class .page3 {
  filter: alpha(opacity=90);
  -moz-opacity: 0.9;
  opacity: 0.9;
}

/* page6 */
.home-Class .page6 .slideCase {
  width: 280px;
  height: 328px;
  /*height: 289px;*/
  position: relative;
  top: 25px;
  left: 50%;
  filter: alpha(opacity=90);
  -moz-opacity: 0.9;
  opacity: 0.9;
  margin-left: -140px;
}

  .home-Class .page6 .slideCase > .Content {
    height: 100%;
    display: -moz-flex;
    display: -webkit-flex;
    display: flex;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform: all 0.8s cubic-bezier(0, 0, 0, 1.5);
    -o-transform: all 0.8s cubic-bezier(0, 0, 0, 1.5);
    -moz-transform: all 0.8s cubic-bezier(0, 0, 0, 1.5);
    -ms-transition: all 0.8s cubic-bezier(0, 0, 0, 1.5);
    transition: all 0.8s cubic-bezier(0, 0, 0, 1.5);
  }

    .home-Class .page6 .slideCase > .Content > span {
      width: 280px;
      height: 100%;
      display: block;
      float: left;
      margin-right: 10px;
    }

      .home-Class .page6 .slideCase > .Content > span > a {
        display: block;
      }

    .home-Class .page6 .slideCase > .Content .Img {
      width: 100%;
      height: 200px;
    }

    .home-Class .page6 .slideCase > .Content .Title {
      width: 100%;
      color: #000;
      font-size: 15px;
      padding: 15px 5px;
    }

/* 动画样式 */
/* page1 */
@-webkit-keyframes Scanning /*Safari and Chrome*/
{
  0% {
    -webkit-transform: rotate(30deg); /* Safari 和 Chrome */
    -o-transform: rotate(30deg);
    -moz-transform: rotate(30deg); /* Firefox */
    -ms-transform: rotate(30deg); /* IE 9 */
    transform: rotate(30deg);
  }

  100% {
    -webkit-transform: rotate(390deg); /* Safari 和 Chrome */
    -o-transform: rotate(390deg);
    -moz-transform: rotate(390deg); /* Firefox */
    -ms-transform: rotate(390deg); /* IE 9 */
    transform: rotate(390deg);
  }
}

@keyframes Scanning {
  0% {
    -webkit-transform: rotate(30deg); /* Safari 和 Chrome */
    -o-transform: rotate(30deg);
    -moz-transform: rotate(30deg); /* Firefox */
    -ms-transform: rotate(30deg); /* IE 9 */
    transform: rotate(30deg);
  }

  100% {
    -webkit-transform: rotate(390deg); /* Safari 和 Chrome */
    -o-transform: rotate(390deg);
    -moz-transform: rotate(390deg); /* Firefox */
    -ms-transform: rotate(390deg); /* IE 9 */
    transform: rotate(390deg);
  }
}
