
.content1 {
    margin-top: 84px;
    width: 100%;
    height: 526px;
    background: url(../assets/datacenter/h1-bg.png) no-repeat;
    background-size: 100% 100%;
}

.content1 .ctn1-del {
    width: 1400px;
    padding-top: 50px;
    margin: 0 auto;
    display: flex;
}

.content1 .ctn1-del .left-cont {
    width: 697px;
    height: 412px;
    min-width: 697px;
    border-radius: 6px;
    overflow: hidden;
    background: url(../assets/datacenter/h1-img1.png) no-repeat;
    background-size: 100% 100%;
    position: relative;
    display: flex;

}

.content1 .left-cont .mask1 {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
}

.content1 .left-cont .left-cont-text {
    margin: auto 0 40px 48px;
    font-family: Source Han Sans CN;
    font-weight: 500;
    font-size: 24px;
    color: #FFFFFF;
    position: relative;
    z-index: 2;
    max-width: 620px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.content1 .right-cont {
    display: flex;
    flex-wrap: wrap;
    column-gap: 14px;
    row-gap: 14px;
    margin-left: 14px;
}

.content1 .right-cont-item {
    width: 337px;
    height: 199px;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
    display: flex;
}

.content1 .right-cont-item .right-item-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
}

.content1 .right-cont-item .mask2 {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
}

.right-cont-text {
    margin: auto 30px 22px;
    font-family: Source Han Sans CN;
    font-weight: 500;
    font-size: 20px;
    color: #FFFFFF;
    line-height: 24px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
    z-index: 3;
}

.content2 {
    width: 1400px;
    padding: 70px 0 96px;
    margin: 0 auto;
}

.content2 .content2-text {
    font-family: Source Han Sans CN;
    font-weight: 500;
    font-size: 36px;
    color: #222222;
    line-height: 36px;
}

.content2 .content2-navlist {
    display: flex;
    align-items: center;
}

.content2-navlist .nav-item {

    font-family: Source Han Sans CN;
    font-weight: 500;
    font-size: 16px;
    color: #949494;
    line-height: 16px;
    margin-left: 38px;
    cursor: pointer;
}

.content2-navlist .nav-item.active {
    background: #3381FF;
    border-radius: 4px;
    padding: 8px;
    font-family: Source Han Sans CN;
    font-weight: 500;
    font-size: 16px;
    color: #FFFFFF;
    line-height: 16px;
}

.content2 .content2-item {
    display: flex;
    margin-top: 70px;
    padding-bottom: 36px;
    border-bottom: 1px solid #F2F2F2;
    opacity: 0;
    transform: translateY(100%);

  
}
.noanmition {
    opacity: 1 !important;
    transform: unset !important;
}
.content2 .content2-item:nth-child(1) {
    opacity: 1;
    transform: translateY(0);
}


.content2 .content2-item+.content2-item {
    margin-top: 30px;
}

.content2 .content2-item:last-child {
    border-bottom: 0;
}

.content2 .content2-item .ctn2-item-left {
    width: 324px;
    height: 192px;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
}

.content2 .content2-item .ctn2-item-img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
}

.content2 .content2-item .item-sign {
    display: inline-flex;
    position: relative;
    z-index: 2;
    margin: 8px 0 0 14px;
    padding: 6px 16px;
    font-family: Source Han Sans CN;
    font-weight: 500;
    font-size: 20px;
    color: #FFFFFF;
    line-height: 24px;
    background: #0263FF;
}

.content2 .ctn2-item-right {
    padding-top: 16px;
    margin-left: 26px;
    flex: 1;
}

.content2 .ctn2-item-right .ctn2-right-text1 {
    font-family: Source Han Sans CN;
    font-weight: 500;
    font-size: 24px;
    color: #222222;
    line-height: 28px;
    max-width: 1010px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.content2 .ctn2-item-right .ctn2-right-text2 {
    font-family: Source Han Sans CN;
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    color: #787878;
    max-width: 1010px;
    margin-top: 31px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    /* 定义文本的行数 */
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
}

.content2 .ctn2-item-right .ctn2-right-bottomtext {
    display: flex;
    margin-top: 38px;
    align-items: center;
}

.content2 .ctn2-right-bottomtext .normal-text {
    font-family: Source Han Sans CN;
    font-weight: 500;
    font-size: 14px;
    color: #A7A7A7;
    line-height: 24px;
}

.content2 .ctn2-right-bottomtext .normal-text.special {
    color: #5591F2;
    margin-left: 8px;
}

.content2 .normal-line {
    margin: 0 16px;
    width: 1px;
    height: 11px;
    background: #E8E8E8;
}

.content2 .ctn2-item-right .btm-time-icon {
    width: 18px;
    height: 18px;
    margin: 0 8px 0 auto;
}

.content2 .ctn2-item-right .bottom-line {
    width: 100%;
    height: 1px;
    background: #DCDCDC;
    margin-top: 60px;
}

.pro-type {
    position: absolute;
    left: 12px;
    top: 12px;
    padding: 6px 12px;
    color: #fff;
    background: rgba(0, 0, 0, .6);
    font-size: 12px;
    text-align: center;
    z-index: 2;
    border-radius: 2px;
}

.mask-content {
    position: fixed;
    top: 84px;
    height: 100%;
    width: 100%;
    z-index: 11;
    backdrop-filter: blur(20px);
}

.mask-tips {
    position: fixed;
    left: 45%;
    top: 37%;
    padding: 24px 96px;
    color: #fff;
    background: rgba(0, 0, 0, .6);
    border-radius: 4px;
    display: block;
    text-align: center;
}

.mask-btn {}