Swiper

.swiper	スライダー全体を囲むコンテナ（※バージョン6以前では .swiper-container ）このエリア内にスライド要素が収まる形はみ出させたい場合は「overflow: visible;」で上書きします
.swiper-wrapper	「.swiper-slide」（各スライド）を囲む要素これを「transform」で移動させることでスライダーの動きを実現しています「.swiper-wrapper」の直下には「.swiper-slide」だけを入れます
.swiper-slide	この中に各スライドの要素を入れますデザインを調整する際、「.swiper-slide」に直接スタイルを当てると不具合に繋がる場合があるので要注意以下のように中身を囲う要素を作って、それに対してスタイルを当てるのがお勧めです `テキストが入ります`
.swiper-pagination	ページネーション
.swiper-button-prev	前へボタン
.swiper-button-next	次へボタン
.swiper-button-disabled	前のスライド / 次のスライドがないときに付くクラス名
.swiper-scrollbar	スクロールバー

「.swiper > .swiper-wrapper > .swiper-slide」の構造は守る必要がある

「.swiper-wrapper」と「.swiper-slide」の間に他の要素を割り込ませたりするとうまく動かなくなるので注意すること

それ以外の制限はあまりなく、ページネーション、前へ / 次へボタン、スクロールバーは「.swiper」の外に出しても問題なく動作します

.swiper-slide-active	アクティブなスライドに付くクラス名ループモード時は状況によって「.swiper-slide-duplicate-active」が付く
.swiper-slide-prev	アクティブなスライドの前のスライドに付くクラス名ループモード時は状況によって「.swiper-slide-duplicate-prev」が付く
.swiper-slide-next	アクティブなスライドの次のスライドに付くクラス名ループモード時は状況によって「.swiper-slide-duplicate-next」が付く
.swiper-slide-visible	※ 「watchSlidesProgress: true」のときのみ表示状態のスライドに付くクラス名
.swiper-slide-duplicate	ループモード時に複製されたスライドに付くクラス名

デザインやアニメーションのカスタマイズにはこのクラスを利用していきます

ループモード時は「-duplicate」が間に入った別のクラスになる場合があるので注意