@charset "utf-8";
html {
  font-size: 100%;
  width: 100%;
  overflow-x: hidden;
  min-height: 100%
}
/**{
   -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}*/
body {
  position: relative;
  min-height: 100%;
  height: 23.6rem;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  /*width: 100%;*/
  /*overflow: hidden;*/
  max-width: 600px;
  /*height: 100%;*/
  overflow-x: hidden;
  /*  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;*/
  margin: auto;
  background-color: #7f2713;
  background-size: 100% auto;
  font-family: '微软雅黑';
  -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
  /*padding-bottom: 1rem*/
  /*font-size: 1.4rem;*/
}
p {
  display: block;
  -webkit-margin-before: 0em;
  -webkit-margin-after: 0em;
  -webkit-margin-start: 0px;
  -webkit-margin-end: 0px;
}

li {
  /*position: relative;*/
}
li .title {
  position: absolute;
  bottom: -0.5rem;
  left: 50%;
  transform: translateX(-50%);
}

.bgimg img {
  max-width: 100%;
}


.logo {
    position: absolute;
    top: 2rem;
    left: 2.7rem;
    width: 4.7rem;
    height: auto;
    z-index: 99;
  }

.b1 {
position: absolute;
    top: 13.7rem;
    left: 0.8rem;
    width: 8.5rem;
    height: auto;
    z-index: 99;  }

.b2 {
position: absolute;
    top: 20rem;
    left: 0.8rem;
    width: 8.5rem;
    height: auto;
    z-index: 99;}

.logo_main {
    position: absolute;
    top: 7.5rem;
    left: 0.2rem;
    width: 9.6rem;
    height: auto;
    z-index: 99;
      -webkit-animation: zoomInRight linear 0.5s;
  animation: zoomInRight linear 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-delay: 0.1s;
}

.zhua {
    position: absolute;
    top: 6.8rem;
    left: 5.6rem;
    width: 2.5rem;
    height: auto;
    z-index: 1;
    -webkit-animation-name: scaleDraw; /*关键帧名称*/
    -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
    -webkit-animation-iteration-count: infinite;  /*动画播放的次数*/
    -webkit-animation-duration: 8s; /*动画所花费的时间*/
}
   @keyframes scaleDraw {  /*定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称*/
            0%{
                transform: scale(1);  /*开始为原始大小*/
            }
            25%{
                transform: scale(1.1); /*放大1.1倍*/
            }
            50%{
                transform: scale(1);
            }
            75%{
                transform: scale(1.1);
            }
        }


.card1 {
    position: absolute;
    top: 17rem;
    left: 1.9rem;
    width: 6rem;
    height: auto;
    z-index: 10;
      -webkit-animation: zoomInRight linear 1s;
  animation: zoomInRight linear 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-delay: 0.2s;
}

.card2 {
position: absolute;
    top: 24.6rem;
    left: 1.7rem;
    width: 7rem;
    height: auto;
    z-index: 10;
     -webkit-animation: zoomInRight linear 1s;
  animation: zoomInRight linear 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-delay: 0.2s;
}

.card3 {
position: absolute;
    top: 29.6rem;
    left: 1.7rem;
    width: 7rem;
    height: auto;
    z-index: 10;
     -webkit-animation: zoomInRight linear 1s;
  animation: zoomInRight linear 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-delay: 0.2s;
}


.btn1 {
    position: absolute;
    top: 35.8rem;
    left: 3.5rem;
    width: 3rem;
    height: auto;
    z-index: 99;
    -webkit-animation: scaleDraw 3s ease-in-out infinite;

}

.btn_cj {
    position: absolute;
    top: 46.9rem;
    left: 5.2rem;
    width: 2.5rem;
    height: auto;
    z-index: 99;
    -webkit-animation: scaleDraw 3s ease-in-out infinite;
}

.btn_lq {
    position: absolute;
    top: 42.8rem;
    left: 5.2rem;
    width: 2.5rem;
    height: auto;
    z-index: 99;
    -webkit-animation: scaleDraw 3s ease-in-out infinite;
}



@-webkit-keyframes zoomInRight {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
            transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

@keyframes zoomInRight {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
            transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomInRight {
  -webkit-animation-name: zoomInRight;
          animation-name: zoomInRight;
}

   @keyframes scaleDraw {  /*定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称*/
            0%{
                transform: scale(1);  /*开始为原始大小*/
            }
            25%{
                transform: scale(1.1); /*放大1.1倍*/
            }
            50%{
                transform: scale(1);
            }
            75%{
                transform: scale(1.1);
            }
        }
    .ballon{
            -webkit-animation-name: scaleDraw; /*关键帧名称*/
            -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
            -webkit-animation-iteration-count: infinite;  /*动画播放的次数*/
            -webkit-animation-duration: 5s; /*动画所花费的时间*/
        }


      .anim-opacity2{animation: 2s opacity2 0s infinite; -webkit-animation: 2s opacity2 0s infinite;-moz-animation: 2s opacity2 0s infinite;}
      @keyframes opacity2{
          0%{opacity:0}
          50%{opacity:.8;}
          100%{opacity:0;}
      }
      @-webkit-keyframes opacity2{
          0%{opacity:0}
          50%{opacity:.8;}
          100%{opacity:0;}
      }
      @-moz-keyframes opacity2{
          0%{opacity:0}
          50%{opacity:.8;}
          100%{opacity:0;}
      }