@charset "UTF-8";
/* 新疆科技馆页面样式 */

/* 顶部地图区域 */
.xinjiang-section .xj-map {
    margin-bottom: 0.3rem;
}

.xinjiang-section .xj-map img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 0.12rem;
}

/* 中间主图区 - 左右布局 */
.xinjiang-section .xj-main {
    display: flex;
    gap: 0.2rem;
    margin-bottom: 0.2rem;
}

.xinjiang-section .xj-main-left {
    flex: 6.7;
}

.xinjiang-section .xj-main-right {
    flex: 3.3;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

/* 图片卡片通用样式 */
.xinjiang-section .xj-card {
    position: relative;
    overflow: hidden;
}

.xinjiang-section .xj-card-img {
    width: 100%;
    overflow: hidden;
}

.xinjiang-section .xj-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s;
}

.xinjiang-section .xj-card:hover .xj-card-img img {
    transform: scale(1.05);
}

/* 卡片标题 - 底部半透明遮罩 */
.xinjiang-section .xj-card-title {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 0.2rem 0.2rem 0.2rem 0.2rem;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
    color: #fff;
    font-size: 0.24rem;
    box-sizing: border-box;
}

/* 左侧大图样式 */
.xinjiang-section .xj-card-large {
    height: 100%;
}

.xinjiang-section .xj-card-large .xj-card-img {
    height: 100%;
}

/* 右侧小图样式 */
.xinjiang-section .xj-card-small {
    flex: 1;
}

.xinjiang-section .xj-card-small .xj-card-img {
    height: 100%;
}

/* 底部网格布局 */
.xinjiang-section .xj-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.2rem;
}

.xinjiang-section .xj-card-grid .xj-card-img {
    aspect-ratio: 16 / 10;
}
.xinjiang-section .pagination{
    padding-bottom: 0.5rem;
}
/* ========== 响应式适配 ========== */

/* 1199px */
@media screen and (max-width: 1199px) {
    .xinjiang-section .xj-card-title {
        font-size: 0.16rem;
        padding: 0.12rem 0.15rem;
    }
    .xinjiang-section .pagination{
        margin: 0;
        padding: 0.6rem 0;
    }
}

/* 768px */
@media screen and (max-width: 768px) {
    

    .xinjiang-section .xj-main {
        flex-direction: column;
    }

    .xinjiang-section .xj-main-left,
    .xinjiang-section .xj-main-right {
        flex: none;
        width: 100%;
    }

    .xinjiang-section .xj-main-right {
        flex-direction: row;
    }

    .xinjiang-section .xj-card-large .xj-card-img {
        aspect-ratio: 16 / 9;
        height: auto;
    }

    .xinjiang-section .xj-card-small .xj-card-img {
        aspect-ratio: 1 / 1;
        height: auto;
    }

    .xinjiang-section .xj-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .xinjiang-section .xj-card-title {
        font-size: 0.14rem;
        padding: 0.1rem 0.12rem;
    }
}

/* 481px */
@media screen and (max-width: 481px) {
    

    .xinjiang-section .xj-map {
        margin-bottom: 0.2rem;
    }

    .xinjiang-section .xj-main {
        gap: 0.15rem;
        margin-bottom: 0.15rem;
    }

    .xinjiang-section .xj-main-right {
        gap: 0.15rem;
    }

    .xinjiang-section .xj-grid {
        grid-template-columns: 1fr;
        gap: 0.15rem;
    }

    .xinjiang-section .xj-card-title {
        font-size: 0.18rem;
    }
    .xinjiang-section .pagination{
        padding: .2rem 0 .4rem;
    }

}