@charset "UTF-8";

/* =============================================================================

Javascript CSS

・JS発動用クラス「.js-×××」
・JS側による状態変更クラスは「.is-×××」

上記はここに記述する

============================================================================= */

/* Javascript CSS .js-
============================================================================= */



/* Splide関連
----------------------------------------------------------------------------- */
/* 矢印基本 */
.js-splide-arrow-A {
  display:flex;
  justify-content: space;
  align-items: center;
  border-radius:50%;
  width:4.0rem;
  height:auto;
  aspect-ratio: 1/1;
  overflow:hidden;
  position:relative;
  background-image:url(/assets/img/common/carousel-arrow.svg);
  background-size:contain;
  background-repeat:no-repeat;
  background-position:center;
  transition-property: opacity;
  transition-duration: var(--duration-hover-A);

  @media(hover:hover) {
    &:hover {
      opacity:0.7;
    }
  }
  &.is-prev {
    transform:scaleX(-1);
  }
}

/* ページャー+左右ボタン */
.js-carousel-pager-A {
  display:flex;
  justify-content: space-between;
  @media (width <= 767px) {
  }
}