My anchor link generated automatically:

<a class="" href="#Heading_3" title="">Heading 3</a>
<a class="" href="#%E3%81%A8%E3%80%81%E3%82%B2%E3" title="">ゲゲームのフ</a>

and anchor to

<h4><span class="" id="Heading_3"></span>Heading 3<span class=""></span></h4>
<h4><span class="" id="%E3%81%A8%E3%80%81%E3%82%B2%E3"></span>ゲゲームのフ<span class=""></span></h4>

I use Javascrip & JQuery to smooth scrolling.

$('a[href^="#"]').on('click', function (e) {
    e.preventDefault();

    var target = this.hash;
    var $target = $(target);

    $('html, body').stop().animate({
        'scrollTop': $target.offset().top
    }, 900, 'swing', function () {
        window.location.hash = target;
    });
});

So, only heading 3 working ok, but link Japanese not working. How to scroll to link have Japanese smoothly?