swiperで画面全体がスライドしてしまう

##前提・実現したいこと
プログラミング学習2ヶ月の初心者です。
eachで持ってきたアイテムを新しいものから8つずつ、計32枚（4ページ分）表示したいです。
8つで1グループは表示できていて、swiperを使用しアイテムが表示される部分のみスライドされることを期待しましたら、ページ全体がスライドしてしまいます。

##該当のソースコード

ruby
1index.html.erb
2
3<div class="wrapper">
4  <div class="header">
5    <%= render "header" %>
6  </div>
7  <div class="new_item_room">
8    <%= render "new_item_room" %>
9  </div>
10  <div class="calendar_room">
11    <%= render "calendar" %>
12  </div>
13</div>

ruby
1_new_iten_room.html.erb
2
3<div class="new_item_room">
4  <div class="inner">
5    <div class="page-head">新入荷商品</div>
6    <%= form_with(url: search_items_path, local: true, method: :get, class: "search_form") do |form| %>
7      <%= form.text_field :keyword, placeholder: "キーワード検索", class: "search_input" %>
8      <%= form.submit "検索", class: "search_button" %>
9    <% end %>
10    <% if user_signed_in? %>
11      <%= link_to "新商品登録", new_item_path, class: "new_item_btn" %>
12    <% end %>
13    <div class="new_item_wrapper">
14      <div class="swiper-wrapper">
15        <div class="swiper-slide">
16          <% @items1.each do |item| %>
17            <div class="new_item">
18              <div class="arrival_day" >
19                <%= item.arrival_day %>
20              </div>
21              <%= link_to item_path(item.id) do %>
22                <%=  image_tag item.image, class: 'new_item_image' if item.image.attached? %>
23                <div class="new_item_name">
24                  <%= item.name %>
25                </div>
26              <% end %>
27            </div>
28          <% end %>
29        </div>
30        <div class="swiper-slide">
31          <% @items2.each do |item| %>
32            <div class="new_item">
33              <div class="arrival_day" >
34                <%= item.arrival_day %>
35              </div>
36              <%= link_to item_path(item.id) do %>
37                <%=  image_tag item.image, class: 'new_item_image' if item.image.attached? %>
38                <div class="new_item_name">
39                  <%= item.name %>
40                </div>
41              <% end %>
42            </div>
43          <% end %>
44        </div>
45以下省略

ruby
1items_controller.rb
2
3  def index
4    @items1 = Item.all.order("arrival_day DESC").limit(8)
5    @items2 = Item.all.order("arrival_day DESC").limit(16).drop(8)
6    @items3 = Item.all.order("arrival_day DESC").limit(24).drop(16)
7    @items4 = Item.all.order("arrival_day DESC").limit(32).drop(24)
8  end

javascript
1item.js
2
3const mySwiper = new Swiper('.new_item_wrapper', {
4});

ruby
1application.html.erb
2
3<!DOCTYPE html>
4<html>
5  <head>
6    <title>KyoYu2021</title>
7    <meta charset="UTF-8">
8    <%= csrf_meta_tags %>
9    <%= csp_meta_tag %>
10    <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css">
11    <script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
12以下省略