/*==================================================
スライダーのためのcss
===================================*/


/*矢印の設定*/

/*戻る、次へ矢印の位置*/
.arrow {
    position: absolute;/*絶対配置にする*/
    z-index: 10;
    top: 96%;
    cursor: pointer;/*マウスカーソルを指マークに*/
    outline: none;/*クリックをしたら出てくる枠線を消す*/
    border-top: 2px solid #459296;/*矢印の色*/
    border-right: 2px solid #459296;/*矢印の色*/
    height: 20px;
    width: 20px;
}

.prev {/*戻る矢印の位置と形状*/
    left:1.5%;
    transform: rotate(-135deg);
}

.next {/*次へ矢印の位置と形状*/
    right:1.5%;
    transform: rotate(45deg);
}

@media only screen and (max-width: 767px) {
  .slideBoxB .slick-slide img, .slideBoxC .slick-slide img {
    max-width: 55%;
  }
  .arrow {
    top: 93%;
  }

  .prev {
    left: 2%;
  }

  .next {
    right: 1.5%;
  }
}


/*選択するサムネイル画像の設定*/

.slick-list {
	background: white;
	margin: 0 0 10px 0;
}

.slick-slide{/*アクティブではないスライド*/
  opacity: 0.25;
}
.slick-current{/*アクティブなスライド*/
  opacity: 1;
}

.slick-slide img {
  margin: 0 auto;
}

.slideBox {
	width: 100%;
	margin: 0 auto;
}


.slideBox img {
	margin: 0 auto;
	display: inline-block;
	vertical-align: bottom;
}


.slick-dots {
  bottom: -10px;
}

.slick-dots li {
  margin: 0 5px;
}

.slick-dots li button::before {
  font-size: 8px;
}