.h_banner{
    width: 100%;
    position: relative;
}
.h_banner img{
    width: 100%;
}
.h_banner .box{
    position: absolute;
    left: 18%;
    top: 37%;
}
.h_banner .box .h_title{
    font-size: 48px;
    font-family: Source Han Sans CN-Regular, Source Han Sans CN;
    font-weight: 400;
    color: #FFFFFF;
    line-height: 56px;
}
.h_banner .box .h_desc{
    font-size: 20px;
    font-family: Source Han Sans CN-Regular, Source Han Sans CN;
    font-weight: 400;
    color: #FFFFFF;
    line-height: 23px;
    margin-top: 15px;
}




/* 列表 */
.h_kdbox{
    padding: 80px 18%;
    background: #F6F6F6;
    flex-wrap: wrap;
}
.h_kdbox .box{
    width: 32%;
    margin: 0 2% 2% 0;
    background: #fff;
    cursor: pointer;
}
.h_kdbox .box:nth-child(3n){
    margin-right: 0;
}

.h_kdbox .box .h_img{
    width: 100%;
    overflow: hidden;
}
.h_kdbox .box .h_img img{
    width: 100%;
}
.h_kdbox .box p{
    padding: 3.8% 6% 4.825%;
    font-size: 15px;
    font-family: Source Han Sans CN-Regular, Source Han Sans CN;
    font-weight: 400;
    color: #333333;
    line-height: 18px;
}


@media (max-width:767px){
    
    /* banner */
    .h_banner .box{left: 4.5%;top: 42%;}
    .h_banner .box .h_title{font-size: 20px;margin-bottom: 2px;line-height: normal;}
    .h_banner .box .h_desc{font-size: 12px;line-height: normal;margin-top: 0;}

    .h_kdbox{padding: 5%;}
    .h_kdbox .box p{font-size: 13px;}
}

@media (max-width:400px){
    /* banner */
    .h_banner .box{left: 4.5%;top: 42%;}
    .h_banner .box .h_title{font-size: 16px;margin-bottom: 2px;line-height: normal;}
    .h_banner .box .h_desc{font-size: 12px;line-height: normal;margin-top: 0;}

    .h_kdbox{padding: 5%;}
    .h_kdbox .box p{font-size: 12px;}
}
@media (min-width:768px) and (max-width:991px){
    /* banner */
    .h_banner .box{left: 8.5%;top: 42%;}
    .h_banner .box .h_title{font-size: 30px;margin-bottom: 6px;line-height: normal;}
    .h_banner .box .h_desc{font-size: 14px;line-height: normal;margin-top: 0;}

    .h_kdbox{padding: 5%;}
}

@media (min-width:992px) and (max-width:1024px){
    /* banner */
    .h_banner .box{left: 8.5%;top: 42%;}
    .h_banner .box .h_title{font-size: 30px;margin-bottom: 6px;line-height: normal;}
    .h_banner .box .h_desc{font-size: 14px;line-height: normal;margin-top: 0;}

    .h_kdbox{padding: 5% 8%;}
}

@media (min-width:1025px) and (max-width:1199px){
    /* banner */
    .h_banner .box{left: 8.5%;top: 42%;}
    .h_banner .box .h_title{font-size: 38px;margin-bottom: 6px;line-height: normal;}
    .h_banner .box .h_desc{font-size: 14px;line-height: normal;margin-top: 0;}

    
    .h_kdbox{padding: 5% 8%;}
}
@media (min-width:1200px) and (max-width:1440px){
    /* banner */
    .h_banner .box{left: 8.5%;top: 42%;}
    .h_banner .box .h_title{font-size: 42px;margin-bottom: 12px;line-height: normal;}
    .h_banner .box .h_desc{font-size: 18px;line-height: normal;margin-top: 0;}

}