html, body   {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  color: #fff;
  letter-spacing: 4px;
}
a {
  text-decoration: none;
  color: #fff;
  -webkit-tap-highlight-color:#fff;
  -webkit-tap-highlight-color: transparent;
  outline:none;
  background: none;
  text-decoration: none;
}
p, h1, h2, h3, h4, h5, h6, ul, ul li {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
/*共用*/
.show {
  display: none;
}
.center {
  text-align: center;
}
.swiper-container, .swiper {
  width: 100%;
  height: 100%;
}
.middle {
  width: 1200px;
  margin: 0 auto;
}
.setting {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 6;
}
.swiper-slide {
  background-size: 100% 100% !important;
  background-position: center !important;
}
.translucent {
  width: 100%;
  height: 100%;
  background:#000;
  filter: alpha(Opacity=50);
  -moz-opacity: 0.5;
  position: fixed;
  opacity: 0.5;
  z-index: 1;
}
.Android, .apple, .computer, .two-apple, .two-android {
  display: none;
}
.hint {
  margin: 0 auto;
  text-align: center;
  position: absolute;
  bottom: 40px;
  left: 0;
  right: 0;
  animation:myfirst 1.5s infinite ;
  -moz-animation:myfirst 1.5s infinite ; /* Firefox */
  -webkit-animation:myfirst 1.5s infinite ; /* Safari and Chrome */
  -o-animation:myfirst 1.5s infinite ; /* Opera */
}
.hint .img {
  width: 1.823vw;
  height: 0.886vw;
  margin: 0 auto;
  background: url('../images/triangle.png') no-repeat;
  background-size: contain;
}

@keyframes myfirst
{
  0%   {bottom: 60px;}
  100% {bottom: 40px;}
}

@-moz-keyframes myfirst /* Firefox */
{
  0%   {bottom: 60px;}
  100% {bottom: 40px;}
}

@-webkit-keyframes myfirst /* Safari and Chrome */
{
  0%   {bottom: 60px;}
  100% {bottom: 40px;}
}

@-o-keyframes myfirst /* Opera */
{
  0%   {bottom: 60px;}
  100% {bottom: 40px;}
}
.promptBox {
  display: none;
}
.promptBoxLayer {
  background: #000;
  opacity: 0.86;
  z-index: 19;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.content {
  width: 28.125vw;
  background: #fff;
  margin: 0 auto;
  position: fixed;
  top: 28%;
  z-index: 19;
  left: 0;
  right: 0;
  text-align: center;
  border-radius: 10px;
}
.content p {
  color: #000;
  font-size: 1.66vw;
  margin: 3.1vw 0 4.7vw;
}
.content a {
  width: 17.709vw;
  height: 4.167vw;
  line-height: 4.167vw;
  font-size: 1.85vw;
  display: block;
  color: #fff;
  background: #00BC7E;
  border-radius: 40px;
  text-align: center;
  margin: 0 auto 2vw;
}
/*共用*/

/*头部*/
.navigation {
  position: fixed;
  z-index: 9;
  /* margin: 40px auto 0; */
  right: 0;
  left: 0;
}
.head {
  line-height: 50px;
  position: absolute;
  top: 40px;
  left: 160px;
}
.head span {
  font-size: 32px;
}
.logo {
  width: 50px;
  height: 50px;
  float: left;
  margin-right: 15px;
}
/*头部*/

.setting_img1 {
  background: url('../images/bimo_bg_img1.jpg') no-repeat;
  overflow: hidden;
}
.setting_img2 {
  background: url('../images/bimo_bg_img2.jpg') no-repeat;
  overflow: hidden;
}
.setting_img3 {
  background: url('../images/bimo_bg_img3.jpg') no-repeat;
  overflow: hidden;
}
.setting_img4 {
  background: url('../images/bimo_bg_img4.jpg') no-repeat;
  overflow: hidden;
}
.setting_img5 {
  background: url('../images/bimo_bg_img5.jpg') no-repeat;
}
#content-wrpper div {
  display: none;
}
#content-wrpper div:first-child {
  display: block;
}

/*第一页*/
.img1 {
  width: 33.282vw;
  height: 35.105vw;
  position: absolute;
  bottom: 0;
  left: 0;
  background: url('../images/img1.png') no-repeat;
  background-size: contain;
  display: none;
}
.text_img {
  width: 26.3021vw;
  height: 9.219vw;
  /* margin: 159px 198px 112px 0; */
  /* position: relative; */
  /* display: none; */
  position: absolute;
  top: 18%;
  right: 29%;
  display: none;
  /* display: none; */
  /* top: 30%;
  left: 0;
  right: 0; */
}
.mediate {
  width: 210px;
  text-align: center;
  margin: 0 auto;
  font-size: 1.47vw;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 25%;
  display: none;
}
.code {
  width: 10.938vw;
  height: 10.938vw;
  display: block;
  margin: 0 auto 20px;
}
.download {
  width: 19.479vw;
  height: 4.4792vw;
  line-height: 4.4792vw;
  border: 2px #fff solid;
  border-radius: 43px;
  font-size: 1.35vw;
  text-align: center;
  position: relative;
  text-indent: 50px;
  letter-spacing: 1px;
}
.download:first-child {
  margin-bottom: 40px;
}
.download a {
  display: block;
  position: relative;
  z-index: 3;
}
.iphone, .android {
  width: 1.9792vw;
  height: 2.3438vw;
  display: inline-block;
  position: absolute;
  top: 1.2vw;
  left: 3.3vw;
}
.iphone {
  background: url('../images/iphone.png') no-repeat;
  background-size: contain;
}
.android {
  background: url('../images/android.png') no-repeat;
  background-size: contain;
}
/*第一页*/

/*第二页*/
.color {
  width: 28.021vw;
  height: 19.896vw;
  text-align: center;
  position: absolute;
  top: 12.5vw;
  left: 12.4vw;
  display: none;
}
.model {
  width: 100%;
}
.bright {
  width: 1.6vw;
  height: 1.6vw;
}
.caption, .caption2, .caption3 {
  width: 36.198vw;
  position: absolute;
  right: 11.8vw;
  top: 19.4vw;
  -webkit-transform: scale(1,1);
  -moz-transform: scale(1,1);
  -o-transform: scale(1,1);
  transform: scale(1,1);
  display: none;
}
.headline {
  font-size: 2.75vw;
}
.subheading {
  font-size: 1.9vw;
  padding-top: 2.7vw;
}
/*第二页*/

/*第三页*/
.bookreview {
  /* width: 34.4271vw; */
  height: 32.24vw;
  position: absolute;
  top: 12.5vw;
  left: 12.5vw;
  display: none;
}
.books {
  width: 33.75vw;
  height: 24.063vw;
  position: absolute;
  bottom: 13vw;
  left: 11.3vw;
  display: none;
}
/*第三页*/

/*第五页*/
.read {
  width: 36.9272vw;
  position: absolute;
  top: 12.5vw;
  display: none;
  left: 30.5%;
}
.location {
  padding-left: 23.5vw;
}
.code-mediate {
  width: 17.588vw;
  text-align: center;
  font-size: 1.47vw;
  position: absolute;
  right: 31.8%;
  bottom: 29%;
  display: none;
}
.clarity {
  background:rgba(1,1,1,1);
  opacity: 0.6;
  z-index: -1;
}
.base, .clarity {
  height: 6.542vw;
  width: 100%;
  position: absolute;
  bottom: 0;
  padding-top: 2vw;
}
.company {
  position: absolute;
  left: 0;
  letter-spacing: 1px;
}
.company span {
  display: block;
  padding-left: 3.1vw;
}
.waga {
  width: 2.188vw;
  height: 2.188vw;
  position: absolute;
}
.companyName {
  font-size: 1.25vw;
}
.URL {
  font-size: 0.95vw;
  padding-bottom: 0.5vw;
}
.copyright {
  font-size: 0.83vw;
}
.line {
  width: 1px;
  height: 4.167vw;
  background: #fff;
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.cooperation {
  position: absolute;
  right: 0;
  letter-spacing: 1px;
}
.cooperation p {
  width: 27vw;
  font-size: 0.83vw;
  text-align: center;
}
/*第五页*/

/*动效*/
/*第一页*/
.title {
  display: block;
  animation: posture 1.3s;
}
@keyframes posture {
  from { opacity: 0;top: -60%; }
  to { opacity: 1;top: 18%; }
}
.graphics {
  display: block;
  animation: post 1.3s;
}
@keyframes post {
  from { opacity: 0;left: -60%; }
  to { opacity: 1;left: 0; }
}
.sweep {
  display: block;
  animation: mobile 1.3s;
}
@keyframes mobile {
  from    { opacity: 0;bottom: -60%; }
  to      { opacity: 1;bottom: 25%; }
}
.flush-first, .flush-second {
  position: absolute;
  right: 19.7%;
  display: none;
}
.flush-first {
  bottom: 39.6%;
}
.flush-second {
  bottom: 26%;
}
.firstButton {
  display: block;
  animation: first 1.3s;
}
@keyframes first {
  from    { opacity: 0;right: -60%; }
  to      { opacity: 1;right: 19.7%; }
}
 /*第一页*/

/*第二页*/
.scenario {
  display: block;
  animation: scene 1.3s;
}
@keyframes scene {
  from    { opacity: 0;left: -60%; }
  to      { opacity: 1;left: 12.4vw; }
}
.scenario2 {
  display: block;
  animation: scenes 1.3s;
}
@keyframes scenes {
  from    { opacity: 0;left: -60%; }
  to      { opacity: 1;left: 11.3vw; }
}
.scaling1 {
  display: block;
  animation: flexible 1.5s;
}
@keyframes flexible {
  from    {
    opacity: 0;
    right: -60%;
  }
  to      {
    opacity: 1;
    right: 11.8vw;
  }
}
/*第二页*/

/*第五页*/
.drop {
  display: block;
  animation: read 1.3s;
}
@keyframes read {
  from   { opacity: 0;top: -50%; }
  to     { opacity: 1;top: 12.5vw;}
}
.android-address, .iphone-address {
  position: absolute !important;
  display: none;
  left: 30.5%;
}
.iphone-address {
  top: 41.5%;
}
.android-address {
  bottom: 35%;
}
.speed {
  display: block;
  animation: velocity 1.3s;
}
@keyframes velocity {
  from   { opacity: 0;left: -50%; }
  to     { opacity: 1;left: 30.5%; }
}
.yard {
  display: block;
  animation: code 1.5s;
  -webkit-transform: scale(1,1);
  -moz-transform: scale(1,1);
  -o-transform: scale(1,1);
  transform: scale(1,1);
}
@keyframes code {
  from {
    opacity: 0;
    -webkit-transform: scale(1.5,1.5);
    -moz-transform: scale(1.5,1.5);
    -o-transform: scale(1.5,1.5);
    transform: scale(1.5,1.5);
  }
  to {
    opacity: 1;
    -webkit-transform: scale(1,1);
    -moz-transform: scale(1,1);
    -o-transform: scale(1,1);
    transform: scale(1,1);
  }
}
.entire {
  display: none;
}
.complete {
  display: block;
  animation: stretch 1.5s;
  -webkit-transform: scale(1,1);
  -moz-transform: scale(1,1);
  -o-transform: scale(1,1);
  transform: scale(1,1);
}
@keyframes stretch {
  from {
    opacity: 0;
    -webkit-transform: scale(1.5,1.5);
    -moz-transform: scale(1.5,1.5);
    -o-transform: scale(1.5,1.5);
    transform: scale(1.5,1.5);
  }
  to {
    opacity: 1;
    -webkit-transform: scale(1,1);
    -moz-transform: scale(1,1);
    -o-transform: scale(1,1);
    transform: scale(1,1);
  }
}
/*第五页*/