その他07

$BLOCK_NAME: '.other-07';

// 変数
$color_gray: #888;
$color_dot: radial-gradient($color_gray 30%, transparent 0);

#{ $BLOCK_NAME } {
  font-family: 'Noto Serif JP', serif;
  font-size: 32px;
  line-height: 1.8;

  & > b {
    position: relative;
    display: inline-block;
    cursor: help;
    &::before {
      position: absolute;
      right: 0;
      bottom: 0;
      left: 0;
      display: block;
      height: 6px;
      content: '';
      background-image: $color_dot;
      background-size: 6px 6px;
      opacity: 0.5;
      animation: other07Anim 0.8s linear 0s infinite;
    }
    &:hover::before {
      opacity: 1;
    }
  }
}

@keyframes other07Anim {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -12px 0;
  }
}