@charset 'utf-8';

:root {
--pop-background-color: #fff;
--pop-font-color: #232323;
--pop-box-shadow: #222243;
--pop-active-color: #189a70;
--pop-active-font: #fff;
--pop-btn-active-color: #189a70;
--pop-active-border-color: #dfdfdf;
--pop-border-radius: 0.2rem;
}

#popup_tab_slide { display:block; top:10px; left:10px; width:500px; z-index:9999 }
#popup_tab_slide .swiper-slide { display: flex; justify-content: center; align-items: center; background-color: #fff; height: fit-content; }
#popup_tab_slide .swiper-slide img { width: 100%; height: auto; }

.popup_tab_slide_footer { padding: 0.5rem 2rem; display: flex; justify-content: space-between; align-items: center; background: #3f3f3f; border-top:1px solid #333; border-radius: 0 0 var(--pop-border-radius) var(--pop-border-radius); /*-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);*/ }
.popup_tab_slide_footer button { background-color: transparent; padding: 0.2rem; transition: 0.4s; color: var(--pop-background-color); outline: none; border: none; }
.popup_tab_slide_footer button:hover,
.popup_tab_slide_footer button:active { color: var(--pop-btn-active-color); transition: 0.4s; }
.popup_tab_slide_footer button strong { font-size: 1.25rem; }

#popup_tab_slide { position: absolute; overflow: hidden; border-radius: 0.25rem; transition: top 0.5s, left 0.5s; border-radius: var(--pop-border-radius) var(--pop-border-radius) 0 0; filter: drop-shadow(2px 4px 6px var(--pop-box-shadow)); }
.popup_tab_slide_wrap  { overflow: hidden; background-color: var(--pop-background-color); }

#popup_tab_slide_tab { width: 100%;  background-color: var(--pop-background-color); display: flex; justify-content: center; overflow: hidden; }
#popup_tab_slide_tab .swiper-pagination-bullet { box-sizing: border-box; display: flex; align-items: center; justify-content: center; font-size: 1.35rem; width: auto; height: auto; margin: 0; flex-grow: 1; border-radius: 0; text-align: center; line-height: 1.2em; background-color: transparent; opacity: 1; padding: 1rem 0rem; }
#popup_tab_slide_tab .swiper-pagination-bullet:not(:first-child) { border-left: 1px solid var(--pop-active-border-color); }

#popup_tab_slide_tab .swiper-pagination-bullet span { font-size: inherit; }
#popup_tab_slide_tab .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: var(--pop-active-color); opacity: 1; font-weight: bold; color: var(--pop-active-font); }

@media all and (max-width: 1450px) {
    #popup_tab_slide { top: 178px !important; left: 10px !important; max-width: 500px; }
}
@media all and (max-width: 767px) {
    #popup_tab_slide { width: 90% !important; top: 100px !important; left: 5% !important; }
}
@media all and (max-width: 465px) {
    #popup_tab_slide_tab .swiper-pagination-bullet { font-size: 3vw; padding: 3vw 1.5vw; word-break: keep-all; }
    .popup_tab_slide_footer button { font-size: 3vw; }
    .popup_tab_slide_footer { padding: 0.5rem 1rem; }
}