.screen-first {
    height: 1080px;
}

.screen-second {
    margin-top: 93px;
    height: 563px;
    position: relative;
}

.screen-second-left {
    margin-left: 159px;
    position: absolute;
    top: 142px;
}

.screen-second-right {
    position: relative;
    width: 890px;
    height: 563px;
    left: 871px;
}

.screen-third {
    margin-top: 124px;
    position: relative;
    height: 871px;
}

.screen-third-title {
    top: 81px;
    position: absolute;
    width: 100%;
    text-align: center;
}

.screen-third-content {
    top: 469px;
    position: absolute;
    width: 100%;

}

.screen-third-content-item {
    width: 247px;
    height: 318px;
    position: absolute;
    color: #ffffff;
}

.screen-fourth {
    height: 920px;
    padding-top: 131px;
    padding-left: 160px;
    position: relative;
    /*overflow: hidden;*/
}

.screen-fourth-number {
    padding: 0 5px;
    font-size: 130px;
    color: #494848;
    font-weight: bold;
    text-shadow: 1px 2px rgba(1, 18, 122, 0.13);
    /*background: conic-gradient( #0848b3 0,#0361fd 42%,#03b9fc 88%,#03e7fc 100%);*/
    background: linear-gradient(137deg, #03e7fc 1%, #03b9fc 32%, #0361fd 48%, #023486 100%);
    -webkit-background-clip: text;
    /*将设置的背景颜色限制在文字中*/
    -webkit-text-fill-color: transparent;
    /*给文字设置成透明*/

}

.screen-fifth {
    height: 1077px;
    position: relative;
}

.screen-sixth {
    height: 929px;
    position: relative;
}
















.image-container {
    display: flex;
    padding: 5%;
}

.image-wrapper {
    width: 16%;
    height: 494px;
    transition: width 0.3s ease;
    margin-right: 20px;
    overflow: hidden;
    position: relative;
}

.image-wrapper:last-child {
    margin-right: none;
}

.image-wrapper img {
    width: 100%;
    height: 100%;
    transition: transform 0.3s ease;
    /* 平滑过渡效果 */
    object-fit: cover;
    /* 保持图片宽高比，同时覆盖整个容器 */

}

.image-wrapper:hover {
    width: 32%;
    transition: width 0.3s ease;
    z-index: 1;
}

.image-wrapper:hover img {
    transform: scale(1.1);
}

/* .image-wrapper:not(:hover) img {
  transform: scale(0.9);
} */
.hover-effect {
    width: 32%;
    z-index: 1;
}

.hide-overflow {
    overflow: hidden;
    text-overflow: ellipsis;
    /*  溢出用省略号显示 */
    display: -webkit-box;
    /* 作为弹性伸缩盒子模型显示。 */
    -webkit-box-orient: vertical;
    /* 设置伸缩盒子的子元素排列方式：从上到下垂直排列 */
    -webkit-line-clamp: 1;
    /* 显示的行数 */
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    /* 黑色半透明背景 */
    opacity: 1;
    /* 初始状态透明 */
    transition: opacity 0.3s ease;
    /* 平滑过渡效果 */
    pointer-events: none;
    /* 确保点击事件可以穿透到图片上 */
}

.image-wrapper.active .overlay {
    opacity: 0;
    /* 激活状态下显示蒙版 */
}