サムネイル付きスライダーがうまく実装できない（swiper.js）

【教えてもらいたいこと】
プログラミング/WEB制作

【具体的な相談内容】
自己紹介
・個人事業主としてウェブ制作をしております。幸野と申します。

約1年半、WordpressやShopifyのWebサイト制作（企画、デザイン、開発）を行なっております。


依頼内容
・swiper.jsにて、サムネイル付きスライダーを実装中なのですが、恥ずかしながらうまく実装できずにおります。

（作りたいもの）
・サムネイル付きのスライダー
・それを1ページの中に2つ作りたい
・10枚の画像が入るようにしたい
・画像の大きさについて横:縦=4:3で切り取るようにしたい

●現状こちらのような状態です。
https://konoyohei.com/test/

（できていること）
・それぞれのスライダーが動く状態にはなりました

（できていないこと）
①画像の大きさについて横:縦=4:3で切り取るために、padding-top:75%を指定する形でCSSを書いています。メインスライダーは綺麗に表示されるのですが、サムネイルスライダーの方が崩れてしまう。

②button-nextとbutton-prevの位置の調整がうまくいかない。

③button-nextとbutton-prevについて、cursor:pointerのものと、そうでないものが入り混じっている。


上記について、1時間程度ビデオ通話しながら解決してくださる方を募集しております。

以上、よろしくお願いいたします。
【目安予算】
4,000円