.mobile {
    color: #fff;
    position: relative;
    overflow: auto;
    width: 100%;
    height: 100%;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
    background: url("bg.png") no-repeat center/cover;
    background-color: #fff;
}

.header {
    width: 100%;
    flex-shrink: 0;
    height: 20vw;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.fixed-bg {
    flex: 1;
    width: 100%;
    font-size: 0;
    overflow: auto;
}

.btnImg1,
.btnImg2 {
    width: 8vw !important;
    z-index: 2;
    margin-right: 2vw;
}

.logo {
    display: flex;
    justify-content: center;
    height: 9vw !important;
    width: 42vw !important;
}
.logo img {
    width: 9vw !important;
}
.logo span {
    color: #fff;
    font-size: 24px !important;
    line-height: 9vw !important;
}

.contact {
    display: flex;
}

.content {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
    width: 100%;

}

.content .title {
    height: 30%;
    width: 100%;
    object-fit: contain;
}

/* 仅标题跑马灯 */
.title-marquee {
    position: absolute;
    top: 23vw;
    width: 90%;
    height: 45%;
    overflow: hidden;
}

.title-marquee .track {
    width: 200%;
    display: flex;
    animation: titleScroll 20s linear infinite;
}

.title-marquee img.title {
    width: 75%;
    height: 100%;
    object-fit: contain;
}

@keyframes titleScroll {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

.banner {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.swiper-container {
    width: 100%;
    height: 100%;
}

.swiper-slide img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

.swiper-slide {
    height: 100%;
    width: 100%;
    box-sizing: border-box;
}

/* 缩放容器与图片样式，让banner缩放时居中、可超出但不抖动 */
.banner-swiper {
    position: relative;
    width: 100%;
    height: 55vh;
    /* banner区域高度，可按需调整 */
    display: flex;
    align-items: center;
    justify-content: center;
}

.swiper-zoom-container img {
    max-width: 100%;
    max-height: 100%;
    display: block;
}

/* 在缩放时关闭页面滚动的穿透 */
.mobile.swiper-container,
.page-swiper {
    touch-action: pan-y pinch-zoom;
}


.fix-bot {
    bottom: 13vw !important;
}

.leftIcon {
    width: 45vw !important;
    position: fixed;
    /* 小屏固定在底部，避免被遮挡 */
    left: 50%;
    transform: translateX(-50%);
    bottom: calc(env(safe-area-inset-bottom) + 23vw);
    z-index: 9;
    object-fit: contain;
}

.text {
    position: absolute;
    bottom: 38vw;
    z-index: 3;
    width: 70vw !important;

}

/* 极小屏设备优化：按钮稍缩小并上移一点 */
@media (max-height: 650px) {
    .leftIcon {
        width: 70vw !important;
        bottom: calc(env(safe-area-inset-bottom) + 8vw);
    }
}

/* 为内容留出底部安全距离，避免覆盖分页或文本 */
.content {
    padding-bottom: calc(env(safe-area-inset-bottom) + 18vw);
}


.bottom_text {
    position: absolute;
    bottom: 15vw;
    left: 0;
    width: 100vw;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 2.5vw;
    flex-direction: column;
}

.back {
    position: absolute;
    bottom: 2vw;
    left: 45%;
    width: 10vw !important;
}

.title-dots {
    position: relative;
    top: 60%;
    left: 0%;
}