.side-bar{bottom:200px;position:fixed;right:10px;z-index:999;}
.side-bar a{
  display:block;
  cursor:pointer;
  width:46px;
  height:46px;
  line-height:46px;
  background:var(--san-service-background-color);
  position:relative;
  text-align:center;
  box-sizing:border-box;
  border-radius: 1em !important;
  overflow: visible !important;
  z-index: 1;
}
.side-bar a+a{margin-top:10px;}
.side-bar a i{display:inline-block;font-size:30px;color: var(--san-service-icon-color);}
.side-bar a:last-child i{font-size:22px;}

/* ç»Ÿä¸€æ°”æ³¡åŠ¨ç”» */
.side-bar a::before {
  content: "" !important;
  position: absolute !important;
  top: -10% !important;
  left: 41% !important;
  width: 1.4em !important;
  height: 1.4em !important;
  background: var(--san-service-background-color-hover) !important;
  border-radius: 50% !important;
  transform: scale(0) !important;
  transition: transform 0.8s ease !important;
  z-index: -1 !important;
}
.side-bar a::after {
  content: "" !important;
  position: absolute !important;
  bottom: -10% !important;
  right: 41% !important;
  width: 1.4em !important;
  height: 1.4em !important;
  background: var(--san-service-background-color-hover) !important;
  border-radius: 50% !important;
  transform: scale(0) !important;
  transition: transform 0.8s ease !important;
  z-index: -1 !important;
}

/* æ‚¬æµ®æ•ˆæžœ */
.side-bar a:hover{
  background: var(--san-service-background-color-hover) !important;
}
.side-bar a:hover::before,
.side-bar a:hover::after {
  transform: scale(1) !important;
}

@media(max-width:991px){
  .side-bar {
    bottom: 20px;
  }
}