片側だけ少し画像見せてスライダー実装【swiper.js】

片側（右側）だけ少し画像を見せてスライダー実装がしたい。
マークアップ備忘録

■イメージ

■html

<div class="swiper-container">
    <div class="swiper-wrapper">
        <div class="swiper-slide"><img src="画像パス" alt=""></div>
        <div class="swiper-slide"><img src="画像パス" alt=""></div>
        <div class="swiper-slide"><img src="画像パス" alt=""></div>
        <div class="swiper-slide"><img src="画像パス" alt=""></div>
    </div>
    <div class="swiper-pagination"></div>
</div>

■js

・ページング設定
・自動再生(切り替わり速度2000ms)
・ループ設定
・スライド速度(1000ms)
・スライド間隔(20)
・ループ時のクローン数(1)
※ループ時に０だと最後のスライドで空白になるので、1以上が推奨

$(function(){
   var swiper = new Swiper('.swiper-container', {
        pagination: {
           el: '.swiper-pagination',
       },

       autoplay: {
           delay: 2000,
       },

       loop: true,
       speed: 1000,
       spaceBetween: 20,
       loopAdditionalSlides: 1
   });
})   

■CSS

今回の設定の肝の部分

.swiper-container {
　　　　padding-right: ２０%;
}

padding設定を入れてあげるだけです。
例では「20%」にしてますが画像サイズ・デザインによって変更。