【jQライブラリのslick】スライドショーの写真配置を調整したい。

前提・実現したいこと

スライドショーの写真配置を調整したい。

発生している問題・エラーメッセージ

現在

理想
赤線のところで画面が見切れるようにしたいです。

該当のソースコード

html
1    <ul class="slider">
2      <li><img src="img/1.jpg" alt=""></li>
3      <li><img src="img/1.jpg" alt=""></li>
4      <li><img src="img/1.jpg" alt=""></li>
5      <li><img src="img/1.jpg" alt=""></li>
6      <li><img src="img/1.jpg" alt=""></li>
7    </ul>

css
1.slider {/*横幅94%で左右に余白を持たせて中央寄せ*/
2  width:90%;
3  margin:0 auto;
4}
5
6.slider img {
7   width:100%;/*スライダー内の画像を横幅100%に*/
8   height:auto;
9}
10
11/*slickのJSで書かれるタグ内、スライド左右の余白調整*/
12
13.slider .slick-slide {
14   margin:0 10px;
15}
16
17/*矢印の設定*/
18
19/*戻る、次へ矢印の位置*/
20.slick-prev, 
21.slick-next {
22   position: absolute;/*絶対配置にする*/
23   top: 42%;
24   cursor: pointer;/*マウスカーソルを指マークに*/
25   outline: none;/*クリックをしたら出てくる枠線を消す*/
26   border-top: 2px solid #666;/*矢印の色*/
27   border-right: 2px solid #666;/*矢印の色*/
28   height: 15px;
29   width: 15px;
30}
31
32.slick-prev {/*戻る矢印の位置と形状*/
33   left: -1.5%;
34   transform: rotate(-135deg);
35}
36
37.slick-next {/*次へ矢印の位置と形状*/
38   right: -1.5%;
39   transform: rotate(45deg);
40}
41
42/*ドットナビゲーションの設定*/
43
44.slick-dots {
45   text-align:center;
46 margin:20px 0 0 0;
47}
48
49.slick-dots li {
50   display:inline-block;
51 margin:0 5px;
52}
53
54.slick-dots button {
55   color: transparent;
56   outline: none;
57   width:8px;/*ドットボタンのサイズ*/
58   height:8px;/*ドットボタンのサイズ*/
59   display:block;
60   border-radius:50%;
61   background:#ccc;/*ドットボタンの色*/
62}
63
64.slick-dots .slick-active button{
65   background:#333;/*ドットボタンの現在地表示の色*/
66}

jQuery
1$('.slider').slick({
2  autoplay: true,//自動的に動き出すか。初期値はfalse。
3  infinite: true,//スライドをループさせるかどうか。初期値はtrue。
4  slidesToShow: 3,//スライドを画面に3枚見せる
5  slidesToScroll: 3,//1回のスクロールで3枚の写真を移動して見せる
6  prevArrow: '<div class="slick-prev"></div>',//矢印部分PreviewのHTMLを変更
7  nextArrow: '<div class="slick-next"></div>',//矢印部分NextのHTMLを変更
8  dots: true,//下部ドットナビゲーションの表示
9  responsive: [
10    {
11    breakpoint: 769,//モニターの横幅が769px以下の見せ方
12    settings: {
13      slidesToShow: 2,//スライドを画面に2枚見せる
14      slidesToScroll: 2,//1回のスクロールで2枚の写真を移動して見せる
15    }
16  },
17  {
18    breakpoint: 426,//モニターの横幅が426px以下の見せ方
19    settings: {
20      slidesToShow: 1,//スライドを画面に1枚見せる
21      slidesToScroll: 1,//1回のスクロールで1枚の写真を移動して見せる
22    }
23  }
24]
25});