トップへ戻るボタン

<div class="scroller">
          <div class="sc-block"><strong>下にスクロールしてください</strong><br>ある程度スクロールすると右下にボタンが現れます。</div>
          <div class="sc-block">セクション 1<br>ダミーの本文テキストです。記事の内容がここに入ります。</div>
          <div class="sc-block">セクション 2<br>ダミーの本文テキストです。記事の内容がここに入ります。</div>
          <div class="sc-block">セクション 3<br>ダミーの本文テキストです。記事の内容がここに入ります。</div>
          <div class="sc-block">セクション 4<br>ここまで読んだら、右下のボタンで先頭へ戻れます。</div>
        </div>
        <button class="to-top" type="button" aria-label="先頭へ戻る">&#8593;</button>

.prev.d11-01-07{padding:0}
        .d11-01-07 .scroller{position:absolute;inset:0;overflow-y:auto;padding:18px;scroll-behavior:smooth}
        .d11-01-07 .sc-block{background:#f4f6fb;border:1px solid #e2e6ee;border-radius:10px;padding:16px;margin-bottom:12px;font-size:12px;line-height:1.8;color:#4a5268}
        .d11-01-07 .sc-block strong{color:#2b3245;font-size:12.5px}
        .d11-01-07 .to-top{position:absolute;right:14px;bottom:14px;width:42px;height:42px;border-radius:50%;background:#5b6bff;color:#fff;border:none;font-size:17px;cursor:pointer;font-family:inherit;box-shadow:0 5px 14px rgba(91,107,255,.4);opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .35s,transform .35s,visibility .35s;z-index:3}
        .d11-01-07 .to-top.on{opacity:1;visibility:visible;transform:translateY(0)}
        .d11-01-07 .to-top:hover{background:#4757e8}

(function(){
        var root = document.querySelector('#item-11-01-07 .d11-01-07');
        var sc = root.querySelector('.scroller');
        var btn = root.querySelector('.to-top');
        sc.addEventListener('scroll', function(){
          btn.classList.toggle('on', sc.scrollTop > 80);
        });
        btn.addEventListener('click', function(){
          sc.scrollTo({ top: 0, behavior: 'smooth' });
        });
      })();