.fix_box{
    position: fixed;
    display: flex;
    flex-direction: column;
    width: 36px;
    top: 51%;
    right: 1.3%;
    color: #fff;
    
  }
  .online_box{
    display: flex;
    flex-direction: column;
    border-radius: 18px;
    box-sizing: border-box;
    padding: 4px;
    background-image: linear-gradient(90deg, #61a8ff , #0e6bfe );
    align-items: center;
    height: 116px;
  }
  .online_box span{
    display: inline-block;
    writing-mode: vertical-rl;
    margin-top: 7px;
    font-size: 14px;
  }
  .code_box{
    position: relative;
    background: #000;
    box-shadow: 0 4px 10px #0f6bfe59, inset 0 -3px 10px #ffffff80, inset 0 -2px 2px #0e6bfe80;
    margin-top: 8px;
  }
  .float_img{
    position: absolute;
    box-sizing: border-box;
    padding: 2px;
    border-radius: 8px;
    background-color: #fff;
    left: -320%;
    display: none;
  }
  .code_box:hover .float_img{
    display: block;
  }

  @media screen and (max-width: 640px) {
    .online{
      display: none !important;
    }
    .online_box{
      height: 84px;
    }
    .code_box{
      height: 36px;
    }
    .fix_box{
      top: 74%;
      z-index: 999;
      right: 3.6%;
    }
  }