/*
  /rakurakucloud/denshihozon/asset/css/page/p-column-fv.css
  コラム一覧ページFV用CSS
*/

.p-column {
  .slick-dots {
    bottom: -45px;
    @media screen and (max-width: 840px) {
      bottom: -35px;
    }
  }
  /* 以下slick上書き */
  .slick-pause {
    bottom: 3px;
    left: 426px;
    cursor: pointer;
    &:hover {
      opacity: 0.8;
    }
    @media screen and (max-width: 1200px) {
      left: 300px;
    }
    @media screen and (max-width: 1024px) {
      bottom: 13px;
      left: 0;
    }
  }
  @media screen and (min-width: 840px) {
    .slick-track {
      margin: 0 10px;
    }

    .slick-next {
      &::before {
        right: -130px;
      }
      &::after {
        top: -160px;
        right: -110px;
      }
    }
    .slick-prev {
      &::before {
        left: -130px;
      }
      &::after {
        top: -160px;
        left: -110px;
      }
    }
    .slick-prev,
    .slick-next {
      &::before {
        content: "";
        width: 50px;
        height: 50px;
        position: absolute;
        bottom: 160px;
      }
      &::after {
        width: 12px;
        height: 12px;
      }
      &:hover {
        &::before {
          background-color: var(--white);
          border: 2px solid var(--rdenshihozon-primary);
        }
        &::after {
          border-color: var(--rdenshihozon-primary);
        }
      }
    }
  }
}