@use "sass:math";
@use "global/acms-common" as acms;
@use "global/common" as global;

/* ------------------------------
　　カルーセル
------------------------------ */

.splide-wrap {
  padding-bottom: 2.5rem;
}

.splide {
  .splide__pagination {
    bottom: -2.5rem;
  }

  .splide__pagination__page {
    width: 12px;
    height: 12px;
    border-width: 4px;
  }

  .splide__pagination > li {
    margin-right: 4px;
    margin-left: 4px;
  }

  .splide__pagination__page {
    background-color: global.$color-gray30;
    opacity: 1;

    &:hover {
      background-color: global.$color-primary;
    }

    &.is-active {
      background-color: global.$color-primary;
      border-color: global.$color-primary;
      transform: none;
    }
  }
}
