#main_bg{
background-color: #8ea495;
width: 90%;
margin: -16px auto 0 auto;
padding: 25px 0;
}

#main {
  position: relative;
  max-width: 1100px;
  height: auto;
  top: 0;
  left: -22px;
  margin: 0px auto;
  padding: 0px;
}

.sample-img {
  width: 100%;
  height: auto;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-background-size: cover;
}

.slick-slider {
  width: 100%;
  height: auto;
}

.slick-slide img {
  max-width: 100%;
  height: auto;
}

/* 左右の矢印の色を調整 */
.slick-prev:before,
.slick-next:before {
  color: #000;
}

/* 左右の矢印の位置を調整 */
.slick-next {
  right: -22px;
  z-index: 99;
}
.slick-prev {
  left: 18px;
  z-index: 100;
}

/* スライド数のドットの色をBlackに */
.slick-dots li.slick-active button:before,
.slick-dots li button:before {
  color: #000000;
  font-size: 50px;
  line-height: 20px;
}

/* ドットの位置調整(画像の真ん中に) */
.slick-dots {
  width: 94.8%;
}

@media screen and (max-width: 600px) {
  #main {
    width: 100%;
    left: -21px;
  }
  .slick-slider {
    width: 100%;
    height: auto;
  }
  .slick-dots {
   left: 31px;
}
}