.qj_pproduct{background-color: #f7f7f7;padding-bottom: 1px;}

.qp_banner{position: relative;}
.qp_banner>img{width: 100%;}

.qp_list{background-color: #fff;margin: 100px auto;padding: 40px 30px;}
.qp_list>h1{font-size: 24px;color: #333;font-weight: 600;margin-bottom: 30px;}
.qp_list>h1>span{background-color: var(--base);display: inline-block;width: 7px;height: 26px;border-radius: 5px;vertical-align: text-bottom;margin-right: 5px;}

.qp_item>h1{font-size: 20px;color: #333;line-height: 2;margin: 30px 0 10px;}
.qp_item>h1>span{background-color: var(--base);display: inline-block;width: 7px;height: 7px;border-radius: 5px;vertical-align: middle;margin-right: 5px;}
.qp_item_w>a{width: 300px;height: 44px;line-height: 44px;display: inline-block;margin-right: 2.6%;width: 23%;background-color: #f7f7f7;border-radius: 10px;padding: 0 20px;margin-bottom: 20px;transition: .3s;}
.qp_item_w>a:nth-child(4n){margin-right: 0;}
.qp_item_w>a:hover {background-color: var(--base);color: #fff;}

@media screen and (max-width: 766px) {
    .qp_banner>img{height: 18rem;object-fit: cover;}
    .qp_list{margin: 0 auto;}
    .qp_item>h1{font-size: 1.8rem;}
    .qp_item_w{display: flex;flex-wrap: wrap;justify-content: space-between;}
    .qp_item_w>a{display: inline-block;width: 48%;margin-bottom: 1.5rem;padding-left: 1.5rem;padding-right: 0;font-size: 1.4rem;margin-right: 0;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
}