.act-plane-hb {
  position: absolute;
  width: 500px;
  left: 140px;
  top: 10px;
  margin-left: -56px;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  z-index: -1;
  opacity: 0;
  filter: alpha(opacity=0);
}
.act-plane-hb.act-plane-raining .plane-wrap .airframe1 {
  display: none;
}
.act-plane-hb.act-plane-raining .plane-wrap .airframe2 {
  display: block;
}
.act-plane-hb .plane-wrap {
  position: relative;
  z-index: 1;
  *zoom: 1;
}
.act-plane-hb .plane-wrap:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.act-plane-hb .plane-wrap .close {
  float: left;
  margin-top: 2px;
  margin-right: 1px;
  width: 14px;
  height: 14px;
  overflow: hidden;
  cursor: pointer;
  /*background: url(#{$img-plane-path}close.png) no-repeat;*/
}
.act-plane-hb .plane-wrap .airframe {
  float: left;
  margin-left: -73px;
  width: 360px;
  height: 100px;
  position: relative;
  /*       .screw {
       	display: block;
       	margin-top: 32px;
       	margin-left: 74px;
       	transform: rotateY(42deg);
       	.screw-in {
       		display: block;
       		width: 30px;
       		height: 30px;
       		background: url(#{$img-plane-path}screw.png) no-repeat;
       		animation: plane-screw 0.6s linear forwards infinite;
       	}
       }*/
}
.act-plane-hb .plane-wrap.plane-wrap-2 {
  top: -15px;
}
.act-plane-hb .plane-wrap.plane-wrap-2 .airframe1 {
  /*background: url(#{$img-plane-path}airframe.png) 0 0  no-repeat;*/
}
.act-plane-hb .plane-wrap.plane-wrap-2 .airframe2 {
  display: none;
  /*background: url(#{$img-plane-path}airframe2.png) 0 0 no-repeat;*/
}
.act-plane-hb .plane-wrap.plane-wrap-1 {
  left: -18px;
}
.act-plane-hb .plane-wrap.plane-wrap-1 .ribbon {
  background: url(//www-stream.2345cdn.net/s/new2345/img/ribbon_052960c04f8239d26517e2274d6393122a54.png) no-repeat;
}
.act-plane-hb .plane-wrap.plane-wrap-1 .ribbon {
  float: left;
  width: 256px;
  height: 72px;
  margin-top: -30px;
  margin-left: -14px;
  -webkit-transform-origin: right center;
  transform-origin: right center;
  -webkit-animation: plane-ribbon 1.5s linear forwards infinite;
  animation: plane-ribbon 1.5s linear forwards infinite;
}
.act-plane-hb .plane-wrap.plane-wrap-1 .airframe {
  float: left;
  margin-left: -7px;
  margin-top: -15px;
  width: 104px;
  height: 56px;
}
.act-plane-hb .plane-wrap.plane-wrap-1 .airframe .screw {
  display: block;
  margin-top: 10px;
  margin-left: 75px;
  -webkit-transform: rotateY(42deg);
  transform: rotateY(42deg);
}
.act-plane-hb .plane-wrap.plane-wrap-1 .airframe .screw .screw-in {
  display: block;
  width: 30px;
  height: 30px;
  /*background: url(#{$img-plane-path}screw.png) no-repeat;*/
  -webkit-animation: plane-screw 0.6s linear forwards infinite;
  animation: plane-screw 0.6s linear forwards infinite;
}
.act-plane-hb .hb-wrap {
  position: relative;
  /* %piece {
    position: absolute;
    top: -100px;
    left: 210px;
    width: 66px;
    height: 88px;
    padding-top: 48px;
    // transform: translateY(-80px);
    text-decoration: none;
    text-align: center;
    font-size: 22px;
    color: #fff313;
    // opacity: 0;
    &:hover{
      animation-play-state: paused;
      transform: scale(1);
      z-index: 2;
    }
  }*/
}
.act-plane-hb .hb-wrap .piece {
  position: absolute;
  top: -100px;
  left: 210px;
  width: 66px;
  height: 88px;
  padding-top: 48px;
  /*transform: translateY(-80px);*/
  text-decoration: none;
  text-align: center;
  font-size: 22px;
  color: #fff313;
  /* opacity: 0;*/
  /*background: url(#{$img-plane-path}coupon.png) no-repeat;*/
}
.act-plane-hb .hb-wrap .piece:hover {
  -webkit-animation-play-state: paused;
  animation-play-state: paused;
  -webkit-transform: scale(1);
  transform: scale(1);
  z-index: 2;
}
.act-plane-hb .hb-wrap .piece-1 {
  -webkit-transform: rotate(30deg) scale(0);
  transform: rotate(30deg) scale(0);
  -webkit-animation: hbmove-1 2.5s linear;
  animation: hbmove-1 2.5s linear;
}
.act-plane-hb .hb-wrap .piece-2 {
  -webkit-transform: rotate(15deg) scale(0);
  transform: rotate(15deg) scale(0);
  -webkit-animation: hbmove-2 2.5s linear;
  animation: hbmove-2 2.5s linear;
}
.act-plane-hb .hb-wrap .piece-3 {
  -webkit-transform: rotate(-15deg) scale(0);
  transform: rotate(-15deg) scale(0);
  -webkit-animation: hbmove-3 2.5s linear;
  animation: hbmove-3 2.5s linear;
}
.act-plane-hb .hb-wrap .piece-4 {
  -webkit-transform: rotate(-30deg) scale(0);
  transform: rotate(-30deg) scale(0);
  -webkit-animation: hbmove-4 2.5s linear;
  animation: hbmove-4 2.5s linear;
}
.act-plane-hb .hb-wrap-has {
  width: 500px;
  height: 400px;
}
.act-plane-hb .plane-wrap.plane-wrap-1 + .hb-wrap {
  left: 45px;
  top: 17px;
}
.act-plane-hb-enter {
  z-index: 401;
  opacity: 1;
  left: 21%;
  -webkit-transition: left 5s ease-out 1s;
  transition: left 5s ease-out 1s;
}
.act-plane-hb-open .airframe {
  -webkit-animation: Speak 0.6s steps(2, start) infinite forwards;
  animation: Speak 0.6s steps(2, start) infinite forwards;
}
.act-plane-hb-leave {
  left: 90%;
  -webkit-transition: left 5s ease-in 2.5s;
  transition: left 5s ease-in 2.5s;
}
.act-plane-hb-hide {
  display: none;
}
.act-plane-hb .airframe-close {
  width: 14px;
  height: 14px;
  background: rgba(0, 0, 0, 0.1);
  top: -21px;
  position: absolute;
  right: 172px;
  border-radius: 50%;
  z-index: 100;
  background: url(//www-stream.2345cdn.net/s/new2345/img/tip_browser607f99aef0466861edf8334e58fb16a7.png) -18px 0 no-repeat;
  color: white;
  cursor: pointer;
}
.act-plane-hb .airframe-close:hover {
  background-position: -35px 0;
}
@-webkit-keyframes Speak {
to {
    background-position: -208px 0;
}
}
@keyframes Speak {
to {
    background-position: -208px 0;
}
}
@-webkit-keyframes hbmove-1 {
0% {
    left: 200px;
}
80% {
    opacity: 1;
}
100% {
    opacity: 0;
    left: 0px;
    top: 270px;
    -webkit-transform: rotate(30deg) scale(1);
    transform: rotate(30deg) scale(1);
}
}
@keyframes hbmove-1 {
0% {
    left: 200px;
}
80% {
    opacity: 1;
}
100% {
    opacity: 0;
    left: 0px;
    top: 270px;
    -webkit-transform: rotate(30deg) scale(1);
    transform: rotate(30deg) scale(1);
}
}
@-webkit-keyframes hbmove-2 {
0% {
    left: 200px;
}
80% {
    opacity: 1;
}
100% {
    opacity: 0;
    left: 100px;
    top: 270px;
    -webkit-transform: rotate(15deg) scale(1);
    transform: rotate(15deg) scale(1);
}
}
@keyframes hbmove-2 {
0% {
    left: 200px;
}
80% {
    opacity: 1;
}
100% {
    opacity: 0;
    left: 100px;
    top: 270px;
    -webkit-transform: rotate(15deg) scale(1);
    transform: rotate(15deg) scale(1);
}
}
@-webkit-keyframes hbmove-3 {
0% {
    left: 200px;
}
80% {
    opacity: 1;
}
100% {
    opacity: 0;
    left: 300px;
    top: 270px;
    -webkit-transform: rotate(-15deg) scale(1);
    transform: rotate(-15deg) scale(1);
}
}
@keyframes hbmove-3 {
0% {
    left: 200px;
}
80% {
    opacity: 1;
}
100% {
    opacity: 0;
    left: 300px;
    top: 270px;
    -webkit-transform: rotate(-15deg) scale(1);
    transform: rotate(-15deg) scale(1);
}
}
@-webkit-keyframes hbmove-4 {
0% {
    left: 200px;
}
80% {
    opacity: 1;
}
100% {
    opacity: 0;
    left: 400px;
    top: 270px;
    -webkit-transform: rotate(-30deg) scale(1);
    transform: rotate(-30deg) scale(1);
}
}
@keyframes hbmove-4 {
0% {
    left: 200px;
}
80% {
    opacity: 1;
}
100% {
    opacity: 0;
    left: 400px;
    top: 270px;
    -webkit-transform: rotate(-30deg) scale(1);
    transform: rotate(-30deg) scale(1);
}
}
@-webkit-keyframes plane-ribbon {
25% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
}
50% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
}
75% {
    -webkit-transform: rotate(-1deg);
    transform: rotate(-1deg);
}
100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
}
}
@keyframes plane-ribbon {
25% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
}
50% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
}
75% {
    -webkit-transform: rotate(-1deg);
    transform: rotate(-1deg);
}
100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
}
}
@-webkit-keyframes plane-screw {
0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
}
100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
}
}
@keyframes plane-screw {
0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
}
100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
}
}
.act-plane-hb-leave {
  left: 85%;
  opacity: 0;
  -webkit-transition: left 2s linear 2s, opacity 2s cubic-bezier(0.7, 0, 1, 1) 2s;
  transition: left 2s linear 2s, opacity 2s cubic-bezier(0.7, 0, 1, 1) 2s;
}
/*.act-plane-hb {
  @width: 280px;
  position: absolute;
  left: 0.5*@width;
  top: 10px;
  margin-left: -0.2*@width;
  transform: translate3d(0, 0, 0);
  z-index: 100;
  opacity: 1;
  filter: alpha(opacity=0);
  .plane-wrap {
    position: relative;
    z-index: 1;
    &:after{
      content:".";
      display:block;
      height:0;
      clear:both;
      visibility:hidden;
    }
    *zoom:1;
    .close {
      float: left;
      margin-top: 2px;
      margin-right: 1px;
      width: 14px;
      height: 14px;
      overflow: hidden;
      cursor: pointer;
      //background: url(#{$img-plane-path}close.png) no-repeat;
    }
    .airframe {
      float: left;
      margin-left: -73px;
      width: 360px;
      height: 100px;
    }
  }
}*/