Swiper не работает в другом блоке?

Использую для верстки на сайте плагин Swiper
У меня есть обычный раздел с логотипами, который исправно работает и не вызывает вопросов.

В модальном окне карточки товара мне нужно вставить точно такой же слайдер, только с другими "слайдами", соответственно. Слайдер исправно вставляет и отображается, но кнопки не пролистывают его. Если зажать мышью и прокрутить слайдер, то он проходит, но слайды не переключаются по кнопке. Что я делаю не так? Внизу скрипт для первого слайдера, который работает исправно и второй с другой переменной. Пробовал и с такой же, пробовал задавать классы для других кнопок.

<!-- Swiper -->
	<div class="swiper-container m-auto">
		<h1 class="swiper__title">Посмотрите, как мы сэкономили нашим клиентам деньги</h1>
		<div class="swiper-wrapper">
			<div class="swiper-slide"><img class="swaper-img-fluid" src="img/rectangle2.png" alt="logobrand"></div>
			<div class="swiper-slide"><img class="swaper-img-fluid" src="img/rectangle4.png" alt="logobrand"></div>
			<div class="swiper-slide"><img class="swaper-img-fluid" src="img/rectangle3.png" alt="logobrand"></div>
			<div class="swiper-slide"><img class="swaper-img-fluid" src="img/rectangle6.png" alt="logobrand"></div>
			<div class="swiper-slide"><img class="swaper-img-fluid" src="img/rectangle5.png" alt="logobrand"></div>
		</div>
		<!-- Add Arrows -->
		<div class="swiper-button-next"></div>
		<div class="swiper-button-prev"></div>
	</div>

$(function() {

	// Swiper JS //
	var swiper = new Swiper('.swiper-container', {
		slidesPerView: 5,
		spaceBetween: 0,
		slidesPerGroup: 5,
		loop: true,
		loopFillGroupWithBlank: true,
		navigation: {
			nextEl: '.swiper-button-next',
			prevEl: '.swiper-button-prev',
		},
	});

	// Swiper JS //
	var swiper1 = new Swiper1('.swiper-container', {
		slidesPerView: 4,
		spaceBetween: 0,
		slidesPerGroup: 5,
		loop: true,
		loopFillGroupWithBlank: true,
		navigation: {
			nextEl: '.swiper-button-next-second',
			prevEl: '.swiper-button-prev-second',
		},
	});
});