@charset "UTF-8";
/* ---------------------------------------------
*   p-app-top-bnr
--------------------------------------------- */
.p-app-top-bnr {
    max-width: 660px;
    margin-inline: auto;
    margin-bottom: 34px;
    padding-inline: 20px;
}

@media screen and (max-width: 750px) {
    .p-app-top-bnr {
        max-width: calc(330 / 375* 100vw);
        margin-block: calc(-32 / 375* 100vw) calc(90 / 375* 100vw);
        padding-inline: 0;
    }
}

.p-app-top-bnr:has(.is-active) {
    margin-bottom: 10px;
}

@media screen and (max-width: 750px) {
    .p-app-top-bnr:has(.is-active) {
        margin-bottom: calc(75 / 375* 100vw);
    }
}

.p-app-top-bnr:has(.is-hide) {
    display: none;
}

.p-app-top-bnr__slide.is-active {
    padding-bottom: 45px;
}

@media screen and (max-width: 750px) {
    .p-app-top-bnr__slide.is-active  {
        padding-bottom: calc(43 / 375 * 100vw);
    }
}

.p-app-top-bnr__slide-link {
    display: block;
    transition: opacity .6s;
}

@media screen and (min-width: 751px) {
    .p-app-top-bnr__slide-link:hover {
        opacity: 0.7;
    }
}

.p-app-top-bnr .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    background-color: #91ACBF;
    opacity: 1;
    transition: opacity .6s;
}

@media screen and (min-width: 751px) {
    .p-app-top-bnr .swiper-pagination-bullet:hover {
        opacity: 0.7;
    }
}

@media screen and (max-width: 750px) {
    .p-app-top-bnr .swiper-pagination-bullet {
        width: calc(10 / 375* 100vw);
        height: calc(10 / 375* 100vw);
    }
}

@media screen and (max-width: 750px) {

}

.p-app-top-bnr .swiper-pagination-bullet-active {
    background-color: #FCC76D;
}

.p-app-top-bnr .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    margin-inline: 7px;
}