.tail-container {
  //position: absolute !important;
  left: 0;
  right: 0;
  bottom: 0;
  min-width: 100vw;
  width: 1230px;
  &>.right-bar {
    position: fixed;
    right: 20px;
    top: 50%;
    z-index: 9;
    margin-top: -80px;
    background: #FFFFFF;
    box-shadow: 0 3px 10px rgba(0,0,0,.1);
    border-radius: 4px;
    overflow: hidden;
    .menus {
      list-style: none;
      margin: 0;
      padding: 0;
      &>li {
        &:empty {
          display: none;
        }
        a,
        .el-backtop {
          position: static;
          right: auto!important;
          bottom: auto!important;
          display: block;
          width: 44px;
          height: 42px;
          color: #333333;
          text-align: center;
          line-height: 42px;
          -webkit-box-shadow: none;
          box-shadow: none;
          border-radius: 0;
          cursor: pointer;
          transition: all .3s;
          &:hover {
            color: #fff;
            background-color: @primaryColor;
          }
          i {
            font-size: 18px;
          }
        }
        .el-backtop {
          overflow: hidden;
          &:hover {
            .holder-wrap {
              margin-top: -42px;
            }
          }
          .holder-wrap {
            margin-top: 0;
            transition: all .3s;
            &>.holder {
              width: 44px;
              height: 42px;
            }
            &>.holder-hover {
              width: 44px;
              height: 42px;
              color: #fff;
              font-size: 12px;
              text-align: center;
              line-height: 14px;
              padding: 7px 0;
            }
          }
        }
      }
    }
  }
  &>.board {
    background-color: #28343E;
    padding-top: 40px;
    padding-bottom: 40px;
    .columns {
      display: table;
      width: 100%;
      .column-item {
        display: table-cell;
        border-right: 1px solid #1E2933;
        padding-left: 40px;
        padding-right: 40px;
        &:first-child {
          padding-left: 0;
        }
        &>.title {
          color: #F7F8FA;
          font-size: 14px;
          white-space: nowrap;
        }
        &>.links {
          list-style: none;
          margin: 20px 0 0;
          padding: 0;
          &>li {
            a {
              color: #999999;
              font-size: 13px;
              text-decoration: none;
              line-height: 20px;
            }
            &+li {
              margin-top: 4px;
            }
          }
        }
      }
    }
    .contact {
      .qrcode-item {
        margin-left: 50px;
        text-align: center;
        &>.img {
          display: block;
          margin: auto;
          width: 112px;
          height: 112px;
          background: center no-repeat #EEEEEE;
          background-size: contain;
        }
        &>.text {
          margin-top: 20px;
          max-width: 112px;
          color: #999999;
          font-size: 12px;
        }
      }
    }
  }
  &>.detail {
    height: 100px;
    background-color: #1C2934;
    padding-top: 30px;
    box-sizing: border-box;
    &>.register {
      text-align: center;
      a {
        color: #999999;
        text-decoration: none;
      }
      &>.provider {
        margin-left: 10px;
      }
      &> a {
        text-decoration: none;
        cursor: pointer;
        color: #999999;
        font-size: 12px;
      }
      a:hover {
        color: #fff;
      }
    }
    &>.copyright {
      margin-top: 8px;
      color: #999999;
      font-size: 12px;
      text-align: center;
    }
  }
}
.right-bar-service-info-popper {
  margin-right: 5px!important;
  .service-info {
    &>.phone {
      color: #333333;
      font-size: 14px;
    }
    &>.period {
      margin-top: 10px;
      color: #999999;
      font-size: 12px;
    }
  }
}
.right-bar-qrcode-info-popper {
  min-width: auto!important;
  margin-right: 5px!important;
  .qrcode-info {
    &>.qrcode-item {
      text-align: center;
      &>.qrcode {
        display: block;
        margin: auto;
        width: 72px;
        height: 72px;
        background: center no-repeat #EEEEEE;
        background-size: contain;

      }
      &>.text {
        margin-top: 6px;
        //max-width: 72px;
        color: #777777;
        font-size: 12px;
        text-align: center;
        white-space: nowrap;
      }
      &+.qrcode-item {
        margin-left: 12px;
        border-left: 1px solid #F7F8FA;
        padding-left: 12px;
      }
    }
  }
}
.right-bar-service-tooltip {
  border-color: #fff!important;
  margin-right: 5px!important;
  -webkit-box-shadow: 0 0 10px rgba(0,0,0,.1);
  box-shadow: 0 0 10px rgba(0,0,0,.1);
}
