jQueryにてスムーズスクロール

jQueryにて、
スムーズスクロールを実装しています。
スクロールするところはまではうまくできたのですが、
どうしても、スクロール先の位置がずれてしまいます。
思っているより、下に行ってしまいます。

調べてみて adjustを追加するといい
と書いていたので、試してみましたが
うまくいきませんでした。
コードに何か問題はあるでしょうか？

HTML
1コード
2
3<main>
4<a href="#class1" class="point-item">
5            <div class="left-point-item"><img src="img/label_point.png"></div>
6            <div class="right-point-item">
7              <h2>手作りオーダーメイド</h2>
8            <p>一つ一つが手作り完全オーダーメイド</p>
9          </div></a>
10
11//////
12
13
14<div id="class1" class="point-detail">
15              <div class="point-left">
16                <img src="img/img_recipe01.png">
17                </div>
18                <div class="point-right">
19                  <div class="inside-point-title">
20                  <div class="left-inside-point">
21                <img src="img/label_point.png"></div>
22                      <div class="right-inside-point">
23                        <h2>手作りオーダーメイド</h2></div></div>
24                <p>子どもの絵をデザイナーが一つ一つ手作りで再現します。同じ絵は世界に2つとないので、完全オリジナルのオーダーメイドです。
25また絵の裏側もデザイナーが想像して作り上げます。</p>
26                </div>
27              </div>
28
29
30</main>

jQuery
1
2
3  $(function(){
4
5$('.point-wrapper a').click(function(){
6    var adjust = 150;
7    var id = $(this).attr('href');
8    var position = $(id).offset().top + adjust;
9    $('html,main').animate({
10      'scrollTop':position
11    }, 500);
12  });
13});
14