.section_01_1 {
  background: url(../images/pc_section_01_01.jpg) top center no-repeat;
  height: 551px;
}

.section_01_2 {
  background: url(../images/pc_section_01_02.jpg) top center no-repeat;
  height: 550px;
}

.section_01_3 {
  background: url(../images/pc_section_01_03.jpg) top center no-repeat;
  height: 551px;
}

.section_02 {
  background: url("../images/pc_section_02.jpg") top center no-repeat;
  height: 713px;
}

.section_03 {
  background: url("../images/pc_section_03.jpg") top center no-repeat;
  height: 926px;
}

#form1 {
  background: url("../images/form1_bg.jpg") top center no-repeat;
  height: 208px;
  margin-top: 5rem;
  margin-bottom: 8rem;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
  padding-left: 400px;
  padding-top: 50px;
  width: 1260px;
}

#form1 input {
  border: 1px solid #cfcfcf;
  padding: 10px;
  font-size: 16px;
  border-radius: 2px;
  width: 36rem;
  height: 4rem;
  margin-right: 3rem;
  margin-bottom: 2rem;
}

#form1 span {
  color: #000;
  font-size: 14px;
}

#form1 .btn1 {
  background-color: #0c96ed;
  border: 0;
  font-size: 16px;
  color: #fff;
  padding: 10px 0;
  width: 360px;
  cursor: pointer;
}

.section_05 {
  background: url("../images/pc_section_05.jpg") top center no-repeat;
  height: 540px;
}

.section_06 {
  background: url("../images/pc_section_06.jpg") top center no-repeat;
  height: 863px;
}

.section_07 {
  background: url("../images/pc_section_07.jpg") top center no-repeat;
  height: 879px;
}

.section_08 {
  background: url("../images/pc_section_08.jpg") top center no-repeat;
  height: 635px;
  position: relative;
}

.section_09 {
  background: url("../images/pc_section_09.jpg") top center no-repeat;
  height: 1228px;
  box-sizing: border-box;
  padding-top: 500px;
}

.section_09 .video {
  width: 1260px;
  margin: 0 auto;
  position: relative;
}

.video .startImage {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  cursor: pointer;
}

.video .startImage:hover {
  opacity: 0.8;
}

.section_10 {
  background-color: #1b396f;
}

.section_10 .form-wrapper {
  width: 1260px;
  margin: 0 auto;
  box-sizing: border-box;
  background: url("../images/pc_section_10.jpg") center no-repeat;
  min-height: 500px;
  padding-left: 780px;
  padding-top: 140px;
}

#form2 {
  background-color: #fff;
  padding: 10px 20px;
  line-height: 2;
  font-size: 16px;
}

#form2 .input {
  border: 1px solid #e0e0e0;
  margin-bottom: 10px;
  padding: 5px 10px;
  display: flex;
  flex-direction: row;
}

#form2 .input input {
  border: 0;
  background: #fff;
  height: 30px;
  width: 100%;
  font-size: 16px;
}

#form2 button {
  color: #fff;
  border: 0;
  background-color: #000;
  background-image: url("../images/btn2_bg.gif");
  background-position: center;
  font-size: 18px;
  font-weight: 600;
  width: 100%;
  padding: 10px 0;
  cursor: pointer;
  margin: 10px 0;
}

#form2 p {
  margin: 10px 0;
  color: #2b2b2b;
}

#form2 p .count {
  color: red;
}

.secret {
  color: #737373;
  line-height: 30px;
}

.video-canvas {
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.8);
  position: fixed;
  top: 0;
  left: 0;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}

.video-canvas.show {
  opacity: 1;
  visibility: visible;
}

.video-canvas .close {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 50px;
  cursor: pointer;
}

.video-canvas .close:hover {
  opacity: 0.8;
}

.video-canvas .videoDom {
  width: 80%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.video-canvas .videoDom video {
  width: 100%;
  display: block;
}

.inrow {
  font-size: 0;
  font-family: arial;
  letter-spacing: normal;
  word-spacing: -1px;
}

.inrow>li,
.inrow span {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  font-size: 14px;
  letter-spacing: normal;
  word-spacing: normal;
}

.service_family {
  position: absolute;
  top: 240px;
  display: block;
  width: 100%;
  height: 150px;
  margin-top: -37px;
  text-align: center;
}

.service_family .dataOne {
  width: 100px;
  height: 150px;
  margin: 0px 5px;
  text-align: center;
  border-radius: 5px;
  background-color: #0e0e0e;
  overflow: hidden;

}

.service_family .dataBoc {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.service_family .dataBoc::after {
  content: '';
  position: absolute;
  top: 50%;
  border-top: 1px solid rgba(255, 255, 255, 0.6);
  height: 0;
  width: 100%;
  left: 0;
}

.service_family .dataBoc .tt {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;

}

.service_family .tt span {
  width: 100%;
  height: 100%;
  font: bold 120px/150px "Arial";
  color: #fff;

}

/*翻页动画*/
@-webkit-keyframes flipTop {
  0% {
    -webkit-transform: perspective(400px) rotateX(0deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(-90deg);
  }
}

@-webkit-keyframes flipBottom {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(0deg);
  }
}

@-moz-keyframes flipTop {
  0% {
    -moz-transform: perspective(400px) rotateX(0deg);
  }

  100% {
    -moz-transform: perspective(400px) rotateX(-90deg);
  }
}

@-moz-keyframes flipBottom {
  0% {
    -moz-transform: perspective(400px) rotateX(90deg);
  }

  100% {
    -moz-transform: perspective(400px) rotateX(0deg);
  }
}

@-ms-keyframes flipTop {
  0% {
    -ms-transform: perspective(400px) rotateX(0deg);
  }

  100% {
    -ms-transform: perspective(400px) rotateX(-90deg);
  }
}

@-ms-keyframes flipBottom {
  0% {
    -ms-transform: perspective(400px) rotateX(90deg);
  }

  100% {
    -ms-transform: perspective(400px) rotateX(0deg);
  }
}

@-keyframes flipTop {
  0% {
    transform: perspective(400px) rotateX(0deg);
  }

  100% {
    transform: perspective(400px) rotateX(-90deg);
  }
}

@-keyframes flipBottom {
  0% {
    transform: perspective(400px) rotateX(90deg);
  }

  100% {
    transform: perspective(400px) rotateX(0deg);
  }
}

.dataStatistics {
  color: #fff;
  font-family: "Helvetica Neue", Helvetica, sans-serif;
  font-size: 100px;
  font-weight: bold;
  line-height: 140px;
  height: 140px;
  width: 630px;
  position: absolute;
  top: 220px;
  left: 50%;
  margin-left:-315px ;
}

.dataStatistics .seperator {
  vertical-align: top;
  margin: 0 -20px;
  display: inline;
}

.dataStatistics .seconds,
.dataStatistics .minutes,
.dataStatistics .hours,
.dataStatistics .days {
  height: 100%;
  display: inline;
}

.dataStatistics .digit_set {
  float: left;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.8);
  border: 1px solid #111111;
  width: 100px;
  height: 100%;
  display: inline-block;
  position: relative;
  margin: 0 2px;
}

.dataStatistics .digit {
  position: absolute;
  height: 100%;
}

.dataStatistics .digit>div {
  position: absolute;
  left: 0;
  overflow: hidden;
  height: 50%;
  width: 100px;
  padding: 0 15px;
}

.dataStatistics .digit>div.digit_top,
.dataStatistics .digit>div.shadow_top {
  /* width: 120px; */
  background-color: #000;
  border-bottom: 1px solid #000;
  box-sizing: border-box;
  top: 0;
  z-index: 0;
  border-radius: 10px 10px 0 0;
  text-align: center;
}

.dataStatistics .digit>div.digit_top:before,
.dataStatistics .digit>div.shadow_top:before {
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.dataStatistics .digit>div.shadow_top {
  /* width: 120px; */
  opacity: 0;
  -webkit-transition: opacity 0.3s ease-in;
}

.dataStatistics .digit>div.digit_bottom,
.dataStatistics .digit>div.shadow_bottom {
  /* width: 120px; */
  text-align: center;
  background-color: #000;
  bottom: 0;
  z-index: 0;
  border-radius: 0 0 10px 10px;
}

.dataStatistics .digit>div.digit_bottom .digit_wrap,
.dataStatistics .digit>div.shadow_bottom .digit_wrap {
  display: block;
  margin-top: -95%;
}

.dataStatistics .digit>div.digit_bottom:before,
.dataStatistics .digit>div.shadow_bottom:before {
  content: "";
  border-radius: 0 0 10px 10px;
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.digit_wrap {
  line-height: 140px;
  display: block;
  overflow: hidden;
}

.dataStatistics .digit>div.shadow_bottom {
  opacity: 0;
  -webkit-transition: opacity 0.3s ease-in;
}

.dataStatistics .digit.previous .digit_top,
.dataStatistics .digit.previous .shadow_top {
  opacity: 1;
  z-index: 2;
  -webkit-transform-origin: 50% 100%;
  -webkit-animation: flipTop 0.3s ease-in both;
  -moz-transform-origin: 50% 100%;
  -moz-animation: flipTop 0.3s ease-in both;
  -ms-transform-origin: 50% 100%;
  -ms-animation: flipTop 0.3s ease-in both;
  transform-origin: 50% 100%;
  animation: flipTop 0.3s ease-in both;
}

.dataStatistics .digit.previous .digit_bottom,
.dataStatistics .digit.previous .shadow_bottom {
  z-index: 1;
  opacity: 1;
}

.dataStatistics .digit.active .digit_top {
  z-index: 1;
}

.dataStatistics .digit.active .digit_bottom {
  z-index: 2;
  -webkit-transform-origin: 50% 0%;
  -webkit-animation: flipBottom 0.3s 0.3s ease-out both;
  -moz-transform-origin: 50% 0%;
  -moz-animation: flipBottom 0.3s 0.3s ease-out both;
  -ms-transform-origin: 50% 0%;
  -ms-animation: flipBottom 0.3s 0.3s ease-out both;
  transform-origin: 50% 0%;
  animation: flipBottom 0.3s 0.3s ease-out both;
}