.popup{
    max-width: 480px;
    width: 100%;
    position: fixed;
    /* top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); */
    top: 3%;
    left: 2%;
    z-index: 10000;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 8px;
    box-shadow: 0px 6px 12px 0 #0000002c;
}
.popup .popup_content{
    /* padding: 24px; */
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.popup_bg{
    display: none;
}

.popup #popup-footer{
    padding: 16px 16px;
    display: flex;
    justify-content: flex-end;
    gap: 32px;
}
.popup #popup-footer span{
    font-size: 14px;
}

.popup #popup-footer button{
    background: none;
    border: none;
    font-size: 14px;
}

.swiper {
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 8px 8px 0 0;
    position: relative;
}
.swiper .swiper-wrapper {
    width: 100%;
    height: auto;
}

.swiper-slide {
    width: 100%;
    height: 610px !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}


/* .swiper-slide .slide_img{
    width: 100%;
    height: 610px;
    background-size: cover;
    background-repeat: no-repeat;
} */



.swiper-slide button {
    display: flex;
    padding: 12px 30px;
    margin: 16px 0 30px;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 16px;
    border-radius: 8px;
    background-color: #635041;
    border-color: transparent;
    transition: background-color 0.3s, color 0.3s;
}

.swiper-container-horizontal>.swiper-pagination-bullets{
    bottom: 1% !important;
}

.swiper-pagination-bullet{
    background: #fff !important;
    opacity: 0.3 !important;
}
.swiper-pagination-bullet-active{
    background: #fff !important;
    opacity: 1 !important;
}

.swiper-button-next, .swiper-button-prev{
    width: 34px !important;
    height: 34px !important;
    background-color: #00000050;
    border-radius: 100%;
}
.swiper-button-next:hover, .swiper-button-prev:hover{
    background-color: #00000069;
    transition: all 0.2s ease-in;
}
.swiper-button-next{
    background-image: url('/images/popup/arrow_next.svg')!important;

}
.swiper-button-prev{
    background-image: url('/images/popup/arrow_prev.svg')!important;
}



@media screen and (max-width: 767px) {
    .popup{
        max-width: -webkit-fill-available;
        width: 100%;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        z-index: 999999;
        margin: 0 8px;
    }
    .popup_bg{
        max-width: 1905px;
        width: 100%;
        height: 2318px;
        background: rgba(0, 0, 0, 0.6);
        position: absolute;
        left: 0;
        top: 0;
        z-index: 99999;

    }
    .swiper-slide {
        height: 520px !important;
        background-position: center;
    }
    .swiper-button-next, .swiper-button-prev{
        width: 36px !important;
        height: 36px !important;
    }
    .popup .popup_content .close_btn{
        top: 12px;
        right: 12px;
    }

}
@media (min-width: 768px) and (max-width: 1024px) {
    .popup{
        max-width: 580px;
        width: 100%;
        z-index: 999999;
        margin: 0 16px;
    }
    .swiper-slide {
        height: 710px !important;
    }
    .swiper-button-next, .swiper-button-prev{
        width: 36px !important;
        height: 36px !important;
    }
    .popup .popup_content .close_btn{
        top: 12px;
        right: 12px;
    }


}