body {
    height: 100vw;
    max-width: 100vw;
    overflow-x: hidden;
    /* 可选，以防止任何内部元素超出 */
    /* background-color: black; */
    font-family: 'HarmonyOS';
}

.middle {
    position: relative;
    width: 100vw;
    top: 0vw;
}

#bottom {
    position: relative;
    top: 2.2vw;
}

.banner {
    position: relative;
    top: 3.15vw;
}

.banner img {
    width: 100%;
    height: auto;
    filter: brightness(99%);
    opacity: 0.9;
    /* 设置透明度为60%，你可以根据需要调整这个值 */
}

.banner p {
    color: #fff;
    font-size: 2.4vw;
    font-family: 'HarmonyOS-Bold';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.first-show {
    padding: 0 calc(470 / 1920 * 100vw);
    margin-top: 9vw;
}

.video-boxs {
    display: flex;
    justify-content: flex-start;
    gap: calc(40 / 1920 * 100vw);
    flex-wrap: wrap;
}

.video-item {
    display: flex;
    flex-direction: column;
    gap: 1.3vw;
    background-color: #fff;
    border-radius: 0.7vw;
    position: relative;
    width: calc(300 / 1920 * 100vw);
}

.item-img {
    width: 100%;
    border-top-left-radius: 0.7vw;
    border-top-right-radius: 0.7vw;

}

.video-item p {
    font-family: 'HarmonyOS-light';
    font-size: 0.82vw;
    text-align: justify;
    padding: 0vw 1.9vw;
    margin-bottom: 1.7vw;
    line-height: 1.2vw;
}

.play-icon {
    position: absolute;
    top: 35%;
    left: 50%;
    transform: translate(-50%, -50%);

}

.play-icon a {
    display: block;
    height: 2.5vw;
}

.play-icon img {
    width: 2.5vw;
    height: 2.5vw;
    cursor: pointer;
}

#gomore {
    height: 2.2vw;
    margin-top: 6vw;
    margin-bottom: 1vw;
    cursor: pointer;
}

#goback {
    height: 2.5vw;
    margin-top: 6vw;
    margin-bottom: 1vw;
    cursor: pointer;
}

#goTop {
    position: fixed;
    right: 5vw;
    bottom: 5vw;
}

#goTop img {
    width: 3vw;
    height: 3vw;
}