/* ------------------------------
homeページ Intro2
------------------------------ */
.intro2-slider .swiper-button-prev,
.intro2-slider .swiper-button-next {
    height: 50px;
    width: 50px;
    top: initial;
    bottom: 80px;
}

.intro2-slider .swiper-controls {
    position: absolute;
    right: 17px;
    width: 113px;
}

@media screen and (min-width:768px) {
    .intro2-slider .swiper-controls {
        left: -17px;
        right: auto;
    }
}

/* 矢印共通のカスタマイズ */
.intro2-slider .swiper-button-prev::after,
.intro2-slider .swiper-button-next::after {
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    height: 13px;
    margin: auto;
    width: 36px;
}

/* 前への矢印カスタマイズ */
.intro2-slider .swiper-button-prev::after {
    background-image: url(../img/home/intro2_arrow-left-white.webp);
}

.intro2-slider .swiper-button-prev:hover::after {
    background-image: url(../img/home/intro2_arrow-left.webp);
}

/* 次への矢印カスタマイズ */
.intro2-slider .swiper-button-next::after {
    background-image: url(../img/home/intro2_arrow-right-white.webp);
}

.intro2-slider .swiper-button-next:hover::after {
    background-image: url(../img/home/intro2_arrow-right.webp);
}



/* ------------------------------
homeページ Clients 
------------------------------ */
.logos-slider {
    overflow-y: visible !important;
}

/* imgタグのセッティング */
.logos-slider .swiper-slide img {
    display: block;
    width: 100%;
    height: 80px;
    object-fit:contain;
    filter: grayscale(100%);
}

/* ホバーした時にグレースケールを解除 */
.logos-slider .swiper-slide:hover img {
    filter: grayscale(0%);
}

.logos-slider .swiper-pagination {
    position: static;
    bottom: -20px;
}

/* ページネーションのカスタマイズ */
.logos-slider .swiper-pagination {
    margin-top: 30px;
}

.logos-slider .swiper-pagination-bullet {
    background: #9FA4A9;
    height: 10px;
    width: 10px;
}

.logos-slider .swiper-pagination-bullet-active {
    background: #26282B;
    height: 10px;
    width: 10px;
}

/* スライドの動き等速 */
@media screen and (min-width:768px) {
    .logos-slider .swiper-slide img {
        height: 54px;
    }
    
    .logos-slider .swiper-wrapper {
        transition-timing-function: linear;
    }
}



/* ------------------------------
Aboutページ our locaiton
------------------------------ */
.accordion-slider .swiper-slide {
    height: auto;
    overflow: hidden;
}

/* ナビゲーションコントロールのスタイル */
.accordion-slider .swiper-controls {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 15px;
    padding: 0 10px;
}

.accordion-slider .swiper-button-prev,
.accordion-slider .swiper-button-next {
    position: static; /* Swiperデフォルトの絶対配置を解除 */
    transform: none;  /* Swiperデフォルトのtransformを解除 */
    width: auto;      /* Swiperデフォルトの固定幅を解除 */
    height: auto;     /* Swiperデフォルトの固定高さを解除 */
    margin-top: 0;    /* Swiperデフォルトのマージンを解除 */
}

/* 矢印共通のカスタマイズ */
.accordion-slider .swiper-button-prev::after,
.accordion-slider .swiper-button-next::after {
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    height: 36px;
    width: 36px;
}

/* 前への矢印カスタマイズ */
.accordion-slider .swiper-button-prev::after {
    background-image: url(../img/about/circle-arrow-left-white.webp);
}

.accordion-slider .swiper-button-prev:hover::after {
    background-image: url(../img/about/circle-arrow-left-gray.webp);
}

/* 次への矢印カスタマイズ */
.accordion-slider .swiper-button-next::after {
    background-image: url(../img/about/circle-arrow-right-white.webp);
}

.accordion-slider .swiper-button-next:hover::after {
    background-image: url(../img/about/circle-arrow-right-gray.webp);
}

/* ページネーションのカスタマイズ */
.accordion-slider .swiper-pagination {
    position: static; /* Swiperデフォルトの絶対配置を解除 */
    width: auto;      /* Swiperデフォルトの幅を解除 */
    bottom: auto;     /* Swiperデフォルトのbottomを解除 */
    margin: 0 15px;   /* ボタンとの間のマージン */
}

.accordion-slider .swiper-pagination-bullet {
    background: #9FA4A9;
    height: 10px;
    width: 10px;
}

.accordion-slider .swiper-pagination-bullet-active {
    background: #26282B;
    height: 10px;
    width: 10px;
}