swiper-paginationが表示されない状態になっています。

私は、今複数枚の画像のスワイプをできるように実装をしています。画像のスワイプすることができるのですが、swiper-paginationが表示されていない状態になっています。もしわかる方がいらしたら、教えて頂きたいです。

view
1<div class="swiper-container">
2     <!-- メイン表示部分 -->
3     <div class="swiper-wrapper">
4           <!-- 各スライド -->
5           <div class="swiper-slide">                                                 
6               <%= image_tag(event.event_img, class: "new-recruit-image120", style:"display: flex; border-radius: 12px; padding: 0;") %>
7                                                
8           </div>
9           <div class="swiper-slide">
10               <%= image_tag(event.img, class: "new-recruit-image120", style:"display: flex; border-radius: 12px; padding: 0;") %>
11                                              
12           </div>
13           <div class="swiper-slide">
14               <%= image_tag(event.img1, class: "new-recruit-image120", style:"display: flex; border-radius: 12px; padding: 0;") %>
15                                              
16           </div>
17           <div class="swiper-slide">
18               <%= image_tag(event.img2, class: "new-recruit-image120", style:"display: flex; border-radius: 12px; padding: 0;") %>
19                                              
20           </div>
21           <div class="swiper-slide">
22               <%= image_tag(event.weekday1, class: "new-recruit-image120", style:"display: flex; border-radius: 12px; padding: 0;") %>
23                                              
24           </div>
25         </div>
26         <div class="swiper-pagination"></div>
27                           
28 </div>
29
30
31<!-- Swiper JS -->
32<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.3.3/js/swiper.min.js"></script>
33<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.4.1/js/swiper.jquery.min.js"></script>
34
35<!-- Initialize Swiper -->
36<script>
37    var mySwiper = new Swiper('.swiper-container', {
38      pagination: {
39        el: '.swiper-pagination',
40        type: 'bullets',
41        clickable: true
42      }
43    });
44</script>
45