メールフォームのページだけslicknavが表示できません。

前提・実現したいこと

パソコンでは一般的なナビゲーションでスマホで見たときにハンバーガーナビで表示したいのですが
他のページは表示されているのにメールフォームのページだけスマホで表示されません。

発生している問題・エラーメッセージ

メールフォームのページだけスマホで見たときにナビが表示されません。
javascriptが原因なのでしょうか？
まだコーディング初心者でどこを直していいのかわかりません。
わかる方がいましたら教えて下さい。
宜しくお願い致します。

該当のソースコード

    </ul>
  </div>
</nav>

</header> <div class="wrapper"> <div class="container"> <div class="contact-ttl"><img src="../images/contact/contact-ttl.png" alt=""/></div> <article> <div class="form">  <p> 下記フォームをご入力の上、「確認画面へ」をクリックしてください。<br> <span class="required">【必須】</span>は必須項目です。</p> <form action="./clipmail.cgi" method="post" enctype="multipart/form-data"> <input type="hidden" name="need" value="お名前お名前フリガナ email お問い合せ内容" /> <input type="hidden" name="match" value="email email2" /> <dl class="clearfix"> <dt>お名前（漢字）<span class="required">【必須】</span></dt> <dd> <input name="お名前" type="text" class="txt" /> <p class="exa">例）山田　太郎</p> </dd> </dl> <dl class="clearfix"> <dt>フリガナ（カタカナ）<span class="required">【必須】</span></dt> <dd> <input name="お名前フリガナ" type="text" class="txt" /> <p class="exa">例）ヤマダ　タロウ</p> </dd> </dl> <dl class="clearfix"> <dt>メールアドレス<span class="required">【必須】</span></dt> <dd> <input name="email" type="text" class="txt ina" /> <p class="exa">例）abc@xxx.co.jp</p> </dd> </dl> <dl class="clearfix"> <dt>メールアドレス再入力<span class="required">【必須】</span></dt> <dd> <input name="email2" type="text" class="txt ina" /> <p class="exa">例）abc@xxx.co.jp</p> </dd> </dl>

    <dl class="clearfix">
      <dt>お問い合せ内容<span class="required">【必須】</span></dt>
      <dd>
        <textarea name="お問い合せ内容" rows="5" ></textarea>
      </dd>
    </dl>
    
    <ul class="kakunin">
      <li>
        <input type="reset" value="リセット" class="btn_reset">
      </li>
      <li>
        <input type="submit" value="確認画面へ" class="btn_submit">
      </li>
    </ul>
  </form>
</div>

</article>  </div> <script src="//code.jquery.com/jquery-2.1.0.min.js"></script> <script src="//jpostal-1006.appspot.com/jquery.jpostal.js"></script> <script> $(function(){ $('#postcode1').jpostal({ postcode : [ '#postcode', ], address : { '#address1' : '%3', '#address2' : '%4%5', } }); }); </script> <script src="js/icheck.min.js"></script> <script> $(function() { $('input').iCheck({ checkboxClass: 'icheckbox_minimal-grey', radioClass: 'iradio_minimal-grey', }); }); </script> <script src="js/jquery.customSelect.min.js"></script> <script> $(function() { $('.ctSelect').customSelect() }); </script>

---css---

/* メニュー */
.slicknav_menu {
display: none;
}
.gnav {
background: #f6bebc;
}
.gnav #menu {
display: flex;
justify-content: space-between;
align-items: center;
max-width: 1020px;
padding: 10px 10px;
margin: 0 auto 0;
}
.gnav li {
font-size: 20px;
letter-spacing: normal;
}
.gnav li:last-child {
flex-basis: 54.22px;
}
.gnav a {
display: inline-block;
color: #808080;
text-align: center;
}

.mainvisual {
/height: 0;/
margin-bottom: 30px;

}

.pc-main-img {
display: block !important;
}

.sp-main-img { display: none !important; }

/* ==================================================================================

768px以下

================================================================================== */
@media screen and (max-width:768px){

/* ヘッダー
---------------------------------------------------------------------------------- */

/* メニュー */
.pc_menu {
display: none;
}
.gnav #menu {
display: block;
padding: 0;
margin: 0 auto;
}
.gnav li {
font-size: 16px;
}
.gnav a {
display: block;
text-align: left;
}
.slicknav_menu {
display: block;
background: transparent;
padding: 0;
position: relative;
}
.slicknav_nav {
width: 100%;
background: #fff;
position: absolute;
top: 100%;
left: 0;
z-index: 1000;
}
.slicknav_nav li {
border-top: 1px dashed #66c3b7;
}
.slicknav_nav li:last-child {
border-bottom: 1px dashed #66c3b7;
}
.slicknav_btn {
background-color: #66c3b7;
border-radius: 0;
padding: .6em .8em;
}
.slicknav_menu .slicknav_icon-bar {
width: 1.5em;
box-shadow: none;
}
.slicknav_menu .slicknav_icon:before,
.slicknav_menu .slicknav_icon {
width: 1.5em;
height: 1.2em;
}
.slicknav_btn .slicknav_icon-bar+.slicknav_icon-bar {
margin-top: .4em;
}
.slicknav_nav a:hover {
color: #808080;
background: transparent;
}

.sp-main-img {
display: block !important;
}

.pc-main-img { display: none !important; }

試したこと

ここに問題に対して試したことを記載してください。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

退会済みユーザー

2018/06/07 13:05

mail form画面でchromeのディベロッパーツールでconsoleをみてみてください。赤文字でエラーが表示されているようでしたらエラー内容も記載してください。

MichiruYoshida

2018/06/08 00:10

ありがとうございます。赤文字エラーですがUncaught TypeError: $(...).slicknav is not a function at HTMLDocument.<anonymous> (menu.js:5) at j (jquery.min.js:2) at k (jquery.min.js:2)　宜しくお願い致します。

MichiruYoshida

2018/06/08 00:11

黄色い注意書きもありましたので一応記載します。　jquery.min.js:2 jQuery.Deferred exception: $(...).slicknav is not a function TypeError: $(...).slicknav is not a function at HTMLDocument.<anonymous> (http://hairmake-sora.com/test/js/menu.js:5:14) at j (https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js:2:29948) at k (https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js:2:30262) undefined