@charset "utf-8";
/*----slick用のスライドショー設定*/
/*------ スライダー横幅 ------*/
.slider{
    width:100%;
    margin:0 auto;
}

/*------ スライダー画像 ------*/
.slider img{
    width:100%;
    align-items: center;
}

/*-------- 高さ調整 ----------*/
.slider .slick-slide{
    height:auto;
}

/*----------- 矢印 -----------*/
/*
.slick-arrow ・・・ 左の矢印（前へ）と右の矢印（次へ）の共通のクラス
.slick-prev  ・・・ 左の矢印（前へ）のクラス
.slick-next  ・・・ 右の矢印（次へ）のクラス
*/
.slick-arrow::before{
    content: "";    /*デフォルトの矢印を消去*/
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.slick-arrow{
    /*矢印のサイズ*/
    width: 30px;
    height: 30px;
    z-index:2;
}

/*----------- 矢印の画像設定 -----------*/
.slick-prev::before{
    background: url(../images/arrow_left.png);
    background-repeat: no-repeat;
    background-size: contain;   /*縦横比を保持したまま背景画像の全体が表示される*/
}
.slick-next::before{
    background: url(../images/arrow_right.png);
    background-repeat: no-repeat;
    background-size: contain;
}

/*----------- 矢印の位置 -----------*/
.slider .slick-prev{
    left: -15px;
}
.slider .slick-next{
    right: -15px;
}