.main-box {
    width: 100%;
    height: auto;
    background: url(zdly-bg.png) no-repeat center top;
    background-size: auto 700px;
    padding-top: 530px;
    margin-bottom: 40px;
}

.zdly-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    background-color: #fff;
    padding: 30px;
    padding-bottom: 0;
    border-radius: 4px;
    box-shadow: 0 3px 20px #68b9f829;
}

.zdly-list>li {
    width: 165px;
    height: 152px;
    margin-bottom: 30px;
    transition: transform 0.3s ease;
    border-radius: 4px;
    background: linear-gradient(180.00deg, #e8f0ff 0%, #fff 100%);
}

.zdly-list>li:hover {
    transform: translateY(-10px);
}

.zdly-list>li>a {
    display: flex;
    align-items: flex-end;
    width: 100%;
    height: 100%;
    font-size: 16px;
    font-weight: 700;
    color: #333;
    padding: 0 12px 20px 12px;
}

.zdly-list>li>a:hover {
    color: #0587FF;
}

.zdly-list>li>a>span {
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    word-break: keep-all;
    text-overflow: ellipsis;
    width: 100%;
    text-align: center;
}

/* 图片 */
.zdly-list>li:nth-child(1)>a {
    background: url(zdly-01.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(2)>a {
    background: url(zdly-02.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(3)>a {
    background: url(zdly-03.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(4)>a {
    background: url(zdly-04.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(5)>a {
    background: url(zdly-05.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(6)>a {
    background: url(zdly-06.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(7)>a {
    background: url(zdly-07.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(8)>a {
    background: url(zdly-08.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(9)>a {
    background: url(zdly-09.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(10)>a {
    background: url(zdly-10.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(11)>a {
    background: url(zdly-11.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(12)>a {
    background: url(zdly-12.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(13)>a {
    background: url(zdly-13.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(14)>a {
    background: url(zdly-14.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(15)>a {
    background: url(zdly-15.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(16)>a {
    background: url(zdly-16.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(17)>a {
    background: url(zdly-17.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(18)>a {
    background: url(zdly-18.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(19)>a {
    background: url(zdly-19.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(20)>a {
    background: url(zdly-20.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(21)>a {
    background: url(zdly-21.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(22)>a {
    background: url(zdly-22.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(23)>a {
    background: url(zdly-23.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(24)>a {
    background: url(zdly-24.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(25)>a {
    background: url(zdly-25.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(26)>a {
    background: url(zdly-26.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(27)>a {
    background: url(zdly-27.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(28)>a {
    background: url(zdly-28.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(29)>a {
    background: url(zdly-29.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(30)>a {
    background: url(zdly-30.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(31)>a {
    background: url(zdly-31.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(32)>a {
    background: url(zdly-32.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(33)>a {
    background: url(zdly-33.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(34)>a {
    background: url(zdly-34.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(35)>a {
    background: url(zdly-35.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(36)>a {
    background: url(zdly-36.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(37)>a {
    background: url(zdly-37.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(38)>a {
    background: url(zdly-38.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(39)>a {
    background: url(zdly-39.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(40)>a {
    background: url(zdly-40.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(41)>a {
    background: url(zdly-01.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(42)>a {
    background: url(zdly-02.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(43)>a {
    background: url(zdly-03.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(44)>a {
    background: url(zdly-04.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(45)>a {
    background: url(zdly-05.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(46)>a {
    background: url(zdly-06.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(47)>a {
    background: url(zdly-07.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(48)>a {
    background: url(zdly-08.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(49)>a {
    background: url(zdly-09.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(50)>a {
    background: url(zdly-10.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(51)>a {
    background: url(zdly-11.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(52)>a {
    background: url(zdly-12.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(53)>a {
    background: url(zdly-13.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(54)>a {
    background: url(zdly-14.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(55)>a {
    background: url(zdly-15.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(56)>a {
    background: url(zdly-16.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(57)>a {
    background: url(zdly-17.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(58)>a {
    background: url(zdly-18.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(59)>a {
    background: url(zdly-19.png) no-repeat center 20px;
    background-size: 90px auto;
}

.zdly-list>li:nth-child(60)>a {
    background: url(zdly-20.png) no-repeat center 20px;
    background-size: 90px auto;
}


/* 老年 */
.old_type .zdly-list>li {
    width: 30%;
    height: auto;
}

.old_type .zdly-list>li>a {
    font-size: 36px;
    background-size: 150px auto;
    padding: 150px 30px 30px 30px;
}


/* 移动 */
.mobile_type .main-box {
    background-size: 100% auto;
    padding-top: 30vw;
    margin-bottom: 4vw;
}

.mobile_type .zdly-list {
    padding: 2vw;
}

.mobile_type .zdly-list>li {
    width: 48%;
    height: auto;
    margin-bottom: 4vw;
}

.mobile_type .zdly-list>li>a {
    font-size: 4vw;
    background-size: 20vw auto;
    padding: 25vw 2vw 2vw 2vw;
}