.subclass-b span{
    display: inline-block;
    margin-top: 5px; /* 设置上边距 */
}
.contents img{max-width: 80%;max-height: 80%;}
.home5-hero-content .iconbox-small1 {
    top: 0px;
}
.home5-hero-content .iconbox-small2 {
    bottom: -200px;
    top: auto;
}

.juzhong{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 18px;
    font-family: Arial, sans-serif;
}

.body-color{
    text-align: center;
    /*margin: -4px;*/
}


/* 手机端样式 */
@media (max-width: 767.98px) {
    .listing-style1{
        margin-bottom: 0px;
        border-radius:0px
    }
}

/* 电脑端样式 */
@media (min-width: 768px) {
    .listing-style1{
        margin-bottom: 10px;
        border-radius:0px
    }
}


/* 手机端样式 */
@media (max-width: 767.98px) {
    .sjname{
        font-size: 10px;
    }
    .list-thumb{
        /*width: 80px;*/
        /*height: 70px;*/

    }

    .class-color_title{
        border-radius: 2px;
        padding: 7px;
        color: white;font-weight: 300;
    }

}

/* 电脑端样式 */
@media (min-width: 768px) {
    .sjname{
        font-size: 13px;
    }
    .list-thumb{

        /*width: 80px;*/
        /*height: 70px;*/
    }
    /**
    pc端颜色方块
     */

    .mobile_color_data {
        display: flex;
        flex-wrap: wrap;
        /*margin: 0 -2px 0 0px;*/
    }

    .mobile_color_data .box {
        width:8%;
        padding-bottom: 8%;
        background-color: #f5f5f5;
        margin-left: 4px;
        margin-bottom: 4px;
        position: relative;
    }
    .mobile_color_data .box a {
        text-decoration: none;
        color:inherit;
    }




    .class-color_title{

        border-radius: 5px;

    }
    .ub-but-c{
        padding: 15px 40px 15px 40px;
        font-size: 16px;
    }
    /*!*放大div*!*/
    /*.zoom-effect {*/
    /*    transition: transform 0.3s ease;*/
    /*}*/

    /*.zoom-effect:hover {*/
    /*    transform: scale(2.2);*/
    /*}*/
}



/* 更新的手机手机端样式 */
@media (max-width: 320px) {
    .mobile_color_data .box {
        width:18.8% !important;
        padding-bottom: 18.8% !important;
        background-color: #f5f5f5;
        margin-left: 4px;
        margin-bottom: 4px;
        position: relative;
    }
}



/*
手机端
 */
@media (max-width: 768px) {
    .mobile_color_data {
        display: flex;
        flex-wrap: wrap;
        /*margin: 0 -2px 0 0px;*/
    }

    /*//老版本*/
    /*.box {*/
    /*    width: 23%;*/
    /*    padding-bottom: 23%;*/
    /*    background-color: #f5f5f5;*/
    /*    margin: 4px 4px 0px 0px;*/
    /*    position: relative;*/
    /*}*/
    .mobile_color_data .box {
        width:18.8%;
        padding-bottom: 18.8%;
        background-color: #f5f5f5;
        margin-left: 4px;
        margin-bottom: 4px;
        position: relative;
    }

    .mobile_color_data .box a {
        text-decoration: none;
        color:inherit;
    }



}