CSSとJavascriptでリンクボックスの線を走らせる

<div class="button">
　<a class="arrow">
   View More<span></span>
 </a>
</div>

.button {
  position: relative;
  width: 180px;
  height: 45px;
  line-height: 100px;
  overflow: hidden;

  &::before,
  &::after {
    content: '';
    position: absolute;
    background: #266CB2;
  }

  .arrow {
    position: relative;
    height: 45px;
    padding-left: 8px;
    display: flex;
    align-items: center;
    font-weight: 300;
    font-size: 1.8rem;

    span {
      position: relative;
      height: 45px;
      display: flex;
      justify-content: center;

      &::before,
      &::after {
        content: '';
        display: block;
        position: absolute;
        top: 65%;
        right: 0;
        height: 1px;
        background: #000;
      }

      &::before {
        width: 50px;
        transform: translate(55px, 0px);
      }

      &::after {
        width: 15px;
        transform-origin: right center;
        transform: translate(55px, 0px) rotate(25deg);
      }
    }
  }
}

/* 下のボーダー */
.button:before {
  bottom: 0;
  left: -180px;
  width: 180px;
  height: 1px;
}

/* 右のボーダー */
.button:after {
  bottom: -45px;
  right: 0;
  width: 1px;
  height: 30px;
}

/* 上のボーダー */
.button a:before {
  content: '';
  position: absolute;
  background: $blu;
  top: 0;
  right: -180px;
  width: 180px;
  height: 1px;
}

/* 左のボーダー */
.button a:after {
  content: '';
  position: absolute;
  background: $blu;
  top: -45px;
  left: 0;
  width: 1px;
  height: 30px;
}

/* 下のボーダー */
.border:before {
  transition: .5s;
  left: 0;
  transition-delay: 3s;
}

/* 右のボーダー */
.border:after {
  transition: .5s;
  bottom: 0;
  transition-delay: 3s;
}

/* 上のボーダー */
.border a:before {
  transition: .5s;
  right: 0;
  transition-delay: 3s;
}

/* 左のボーダー */
.border a:after {
  transition: .5s;
  top: 0;
  transition-delay: 3s;
}

// クリックしたらクラス付与
let btn = document.querySelector('.button');

let btnToggleclass = function (el) {
  el.classList.toggle('border');
}

btn.addEventListener('click', function () {
  btnToggleclass(btn);
}, false);