@media (max-width: 1440px) {
  .right-sidebar {
    right: 0 !important;
  }
}
.right-sidebar {
  position: fixed;
  right: 68px;
  top: 240px;
  width: 83px;
  height: 420px;
  z-index: 10;
}
.right-sidebar .sidebar-square {
  width: 83px;
  height: 83px;
  line-height: 83px;
  text-align: center;
  color: #fff;
  background-color: #bfbfbf;
}
.right-sidebar .right-sidebar-item {
  margin-top: 20px;
}
.right-sidebar .right-sidebar-item .item-phone:active + .txt {
  display: block;
}
.right-sidebar .right-sidebar-item .img {
  width: 110px;
  display: none;
  position: absolute;
  right: 85px;
  top: 58px;
  padding: 0 10px 12px 10px;
  background: #fff;
  z-index: 99;
  text-align: center;
  box-shadow: 0 0 6px rgba(110, 110, 110, 0.4);
  border-radius: 10px;
}
.right-sidebar .right-sidebar-item .img.item-appcode {
  top: 150px;
}
.right-sidebar .right-sidebar-item .img > div span {
  display: block;
  padding: 10px 0;
  font-size: 12px;
  color: #333333;
}
.right-sidebar .right-sidebar-item .img:after {
  position: absolute;
  right: -10px;
  top: 44%;
  content: '';
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid #fff;
}
.right-sidebar .right-sidebar-item .txt {
  display: none;
  position: absolute;
  right: 87px;
  top: 25px;
  width: 155px;
  padding: 10px 20px;
  height: 37px;
  background-color: #fff;
  box-shadow: 0 0 6px rgba(110, 110, 110, 0.4);
  border-radius: 10px;
}
.right-sidebar .right-sidebar-item .txt span {
  display: block;
  font-size: 18px;
}
.right-sidebar .right-sidebar-item .txt span.phone {
  color: #DF4F4F;
  line-height: 24px;
  font-weight: bold;
  text-align: center;
}
.right-sidebar .right-sidebar-item .txt span.time {
  color: #333333;
  font-size: 15px;
  font-weight: bold;
  margin-top: 2px;
  line-height: 30px;
  text-align: center;
}
.right-sidebar .right-sidebar-item .txt:after {
  position: absolute;
  right: -10px;
  top: 50%;
  margin-top: -10px;
  content: '';
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid #fff;
}
.right-sidebar .right-sidebar-item .item {
  position: relative;
  width: 68px;
  height: 68px;
  /*border: 1px solid #999999;*/
  margin: 0 auto 17px;
  text-align: center;
  font-size: 12px;
  border-radius: 5px;
  /*background:linear-gradient(180deg,rgba(255,172,172,1) 0%,rgba(251,113,113,1) 100%);*/
  background-color: #EEEEEE;
  overflow: hidden;
}
.right-sidebar .right-sidebar-item .item .active {
  background-color:#ff4c4c;
}
.right-sidebar .right-sidebar-item .item .active span {
  color: #fff;
}
.right-sidebar .right-sidebar-item .item .top {
  transition: all .5s;
}
.right-sidebar .right-sidebar-item .item .top .top-container {
  height: 68px;
}
.right-sidebar .right-sidebar-item .item span {
  color: #333333;
}
.right-sidebar .right-sidebar-item .item i {
  transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -o-transition: all 0.5s;
}
.right-sidebar .right-sidebar-item .item.item-phone:hover .txt {
  display: block;
}
.right-sidebar .right-sidebar-item .item.item-wx .img {
  top: -47px;
}
.right-sidebar .right-sidebar-item .item.item-wx:hover + .code {
  display: block;
}
.right-sidebar .right-sidebar-item .item.item-app .img {
  top: -103px;
}
.right-sidebar .right-sidebar-item .item.item-app:hover + .app {
  display: block;
}
.right-sidebar .right-sidebar-item .item:hover .top {
  transform: translateY(-68px);
  -ms-transform: translateY(-68px);/* IE 9 */
  -moz-transform: translateY(-68px);/* Firefox */
  -webkit-transform: translateY(-68px);/* Safari 和 Chrome */
  -o-transform: translateY(-68px);
}
.right-sidebar .right-sidebar-item .item:hover a {
  color: #333333;/*i{*/
  /*    display: block;*/
  /*    width: 65px;*/
  /*    height: 40px;*/
  /*    &.shopping{*/
  /*        background: url("../static/img/shopping_active.png") no-repeat center center;*/
  /*    }*/
  /*    &.phone{*/
  /*        background: url("../static/img/phone_active.png") no-repeat center center;*/
  /*    }*/
  /*    &.wx{*/
  /*        background: url("../static/img/wx_acitve.png") no-repeat center center;*/
  /*    }*/
  /*    &.app{*/
  /*        background: url("../static/img/app_active.png") no-repeat center center;*/
  /*    }*/
  /*}*/
}
.right-sidebar .right-sidebar-item .item a {
  display: block;
}
.right-sidebar .right-sidebar-item .item a i {
  display: block;
  width: 68px;
  height: 48px;
}
.right-sidebar .right-sidebar-item .item a i.shopping {
  background: url("../../../img/shopping.png") no-repeat center center;
}
.right-sidebar .right-sidebar-item .item a i.phone_active {
  background: url("../../../img/phone5_active.png") no-repeat center center;
}
.right-sidebar .right-sidebar-item .item a i.wx_active {
  background: url("../../../img/wx_active.png") no-repeat center center;
}
.right-sidebar .right-sidebar-item .item a i.app_active {
  background: url("../../../img/app_active.png") no-repeat center center;
}
.right-sidebar .right-sidebar-item .item a i.phone {
  background: url("../../../img/phone5.png") no-repeat center center;
}
.right-sidebar .right-sidebar-item .item a i.wx {
  background: url("../../../img/wx3.png") no-repeat center center;
}
.right-sidebar .right-sidebar-item .item a i.app {
  background: url("../../../img/app3.png") no-repeat center center;
}
.right-sidebar .right-sidebar-item .items {
  position: relative;
  width: 65px;
  height: 65px;
  /*border: 1px solid #999999;*/
  margin: 0 auto 17px;
  text-align: center;
  font-size: 12px;
  background-color: #ff4c4c;
}
.right-sidebar .right-sidebar-item .items.return {
  width: 68px;
  height: 30px;
  color: #fff;
  background: url("../../../img/index/return.gif") top center no-repeat transparent;
  background-size: 100% 100%;
  cursor: pointer;
}
.right-sidebar .right-sidebar-item .items.return span {
  position: absolute;
  left: 0;
  bottom: 0;
  display: block;
  width: 68px;
  height: 18px;
  line-height: 18px;
  /*background: -webkit-gradient(linear,left top,left bottom,from(rgba(66,133,244,.4)),color-stop(70%,#4285f4));*/
  background: linear-gradient(180deg,rgba(251,67,67,.4),#ff4c4c 70%);
  opacity: 1;
  border-radius: 13px;
  animation: mymove 0.8s infinite alternate;
  -webkit-animation: mymove 0.8s infinite alternate;/*Safari and Chrome*/
  -o-animation: mymove 0.8s infinite alternate;/*Safari and Chrome*/
  margin-top: 28px;
}
@keyframes mymove {
  from {
    top: 0;
  }
  to {
    top: 3px;
  }
}
@-webkit-keyframes mymove /*Safari and Chrome*/ {
  from {
    top: 0;
  }
  to {
    top: 3px;
  }
}
@-o-keyframes mymove /*Safari and Chrome*/ {
  from {
    top: 0;
  }
  to {
    top: 3px;
  }
}
