.fixbox {
    position: fixed;
    bottom: 20vh;
    right: 0;
    z-index: 12;
    width:60px;
    z-index: 999999999999;
  }
  .fixbox .li {
    width: 60px;
    height: 60px;
    background: #FFF;
    color: #0041C3;
    margin-bottom: 2px;
    border:1px solid #ddd;
  }
  .fixbox .icon {
    transition: all .5s;
  }
  .fixbox .li:hover .icon {
    transform: translate(0, -2px);
  }
  .fixbox .litel{
    /* width:240px; */
    transform:translate(0,0);
    transition: all .5s;
  }
  .fixbox .li .telbox{
    color:#0041C3;
    width:200px;
    background:#fff;
    height:60px;
    padding-left:.5rem;
    transition: all .5s;
    position: relative;
  }
  .fixbox .li .telbox:before{
    content:"";
    position:absolute;
    width:1px;
    height:30px;
    top:50%;
    left:0;
    margin-top:-15px;
    background:#0041C3
  }
  .fixbox .litel .spbox{
    background:#fff;
    height:60px;
    width:60px;
    transition: all .5s;
    position: relative;
    z-index:2;
  }
  .fixbox .litel:hover{
    transform:translate(-200px,0);
  }
  .fixbox .li .telbox {
    border-top: 1px solid #d1d1d1;
    border-bottom: 1px solid #d1d1d1;
}
.fixbox .litel {
    border: none;
}
.fixbox .litel .spbox {
    border: 1px solid #ddd;
    border-right: none;
}
  
  @media (max-width: 767px) {
    .fixbox .li .telbox{
        display: none;
    }
    .fixbox .litel:hover{
        transform:translate(0,0);
      }
      
  }