
    
    .p_top {
        position: absolute;
        top: -6.25rem;
    }

    .bg {
        background: #d00b0b;
    }

    .c {
        color: #d00b0b;
    }

    

    


    .line1 {
        display: block;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .line2 {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        text-overflow: ellipsis;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }

    .line3 {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        text-overflow: ellipsis;
        -webkit-line-clamp: 3;
        overflow: hidden;
    }

    .line4 {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        text-overflow: ellipsis;
        -webkit-line-clamp: 4;
        overflow: hidden;
    }

    .trans {
        transition: all 0.4s;
        -webkit-transform: all 0.4s;
        -moz-transition: all 0.4s;
        -o-transition: all 0.4s;
    }

    
    
    .cf {
        color: #fff !important;
    }

    .c0 {
        color: #000 !important;
    }
    .container {
        padding: 0 var(--container);
        width: 100%;
        max-width: 100%;
    }

    

    .alignc {
        align-items: center;
    }
    .title {
        color: #000;
        font-size: 3rem;
        font-weight: 700;
        line-height: 4rem;
        display: inline-block;
        position: relative;
        padding: 0.25rem 0.625rem 0 0;
    }

    .title::before {
        content:none;
        position: absolute;
        top: 0;
        right: 0;
        width: 1.6875rem;
        height: 1.6875rem;
        background: linear-gradient(180deg, #d4171a 0%, rgba(0, 152, 68, 0) 100%);
        border-radius: 50%;
    }

    .title.cf {
        color: #fff;
    }

    .title.cf::before {
        background: linear-gradient(180deg, #FFF 0%, rgba(255, 255, 255, 0) 100%);
    }

    .subtitle {
        color: #d00b0b;
        font-size: 1.5rem;
        font-weight: 700;
        line-height: 2rem;
        /* 275% */
        text-transform: uppercase;
    }

    .text {
        color: rgba(0, 0, 0, 0.7);
        font-size: 1rem;
        font-style: normal;
        line-height: 1.625rem;
    }

    .more {
        padding: 0 2.1875rem;
        border-radius: 0.375rem;
        font-size: 1rem;
        background: #009E41;
        line-height: 3.125rem;
        display: inline-block;
        border-radius: 3.125rem;
        color: #fff;
    }

    .more div {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .more .iconfont {
        font-size: 0.65rem;
        color: #fff;
        display: block;
        transition: all 0.4s;
        -webkit-transform: all 0.4s;
        -moz-transition: all 0.4s;
        -o-transition: all 0.4s;
        margin-left: 0.625rem;
        font-size: 1.25rem;
        font-weight: 600;
    }

    .more:hover {
        background: #000;
        transition: all 0.4s;
        -webkit-transform: all 0.4s;
        -moz-transition: all 0.4s;
        -o-transition: all 0.4s;
        color: #fff;
    }

    .more:hover .iconfont {
        transform: translateX(0.625rem);
        transition: all 0.4s;
        -webkit-transform: all 0.4s;
        -moz-transition: all 0.4s;
        -o-transition: all 0.4s;
    }

    .more.borf {
        border: 1px solid #FFF;
        background: transparent;
        color: #FFF;
    }

    .more.borf .iconfont {
        color: #fff;
    }

    .more.borf:hover {
        background: #fff;
        color: #d00b0b;
    }

    .more.borf:hover .iconfont {
        color: #d00b0b;
    }

    .more.bgf {
        border: 1px solid rgba(11, 11, 11, 0.2);
        background: transparent;
        color: #0B0B0B;
    }

    .more.bgf .iconfont {
        color: #0B0B0B;
    }

    .more.bgf:hover,
    .more.bgf.active {
        background: #d00b0b;
        color: #fff;
    }

    .more.bgf:hover .iconfont,
    .more.bgf.active .iconfont {
        color: #fff;
    }

    .more.bgff {
        background: #fff;
        color: #d00b0b;
    }

    .more.bgff .iconfont {
        color: #d00b0b;
    }

    .more.bgff:hover {
        background: #d00b0b;
        color: #fff;
    }

    .more.bgff:hover .iconfont {
        color: #fff;
    }
    .more_a {
        color: rgba(0, 0, 0, 0.8);
        font-size: 1rem;
        line-height: 1.5rem;
        display: flex;
        align-items: center;
    }

    .more_a .iconfont {
        font-size: 0.75rem;
        transition: all 0.4s;
        -webkit-transform: all 0.4s;
        -moz-transition: all 0.4s;
        -o-transition: all 0.4s;
        display: block;
    }

    .more_a:hover {
        color: #d00b0b;
    }

    .more_a:hover .iconfont {
        transform: translateX(0.625rem);
        transition: all 0.4s;
        -webkit-transform: all 0.4s;
        -moz-transition: all 0.4s;
        -o-transition: all 0.4s;
    }

    .jiantou {
        width: 3.5rem;
        height: 3.5rem;
        text-align: center;
        line-height: 3.5rem;
        background: none;
        border-radius: 50%;
        margin-top: 0;
        transform: translateY(-50%);
        border: 1px solid rgba(0, 0, 0, 0.3);
        background: #d00b0b;
    }

    .jiantou .iconfont {
        display: block;
        font-size: 1.25rem;
        color: #fff;
    }

    .jiantou:hover {
        background: #009844;
        border-color: #009844;
    }

    .jiantou:hover .iconfont {
        color: #fff;
    }

    .jiantou.white {
        background: #fff;
    }

    .jiantou.white:hover {
        background: #009844;
        border-color: #009844;
    }

    .index_pro a {
        /*padding: 0 1.875rem;*/
        padding: 1rem;
        border-radius: 20px;
        border: 1px solid rgba(0, 0, 0, 0.08);
        background: #FFF;
        box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.06);
    }

    .index_pro .content {
        padding: 0.25rem 0 0.875rem;
    }

    .index_pro .name {
        color: #000;
        /*font-size: 1.125rem;*/
        font-size: 1.225rem;
        font-weight: 500;
        line-height: 1.875rem;
        margin-bottom: 1rem;
    }
    .index_pro .text {
        margin: 0.875rem 0 2.5rem;
        height: 3.25rem;
        display: none;
    }
    .index_pro img{
        transform: scale(1.3);
    }
    .index_pro:hover img {
        transform: scale(1.4);
    }

    .index_pro:hover .name {
        color: #d00b0b;
    }
    .margin20 {
        margin: 0 -1.25rem;
    }
    .bread {
        color: #FFF;
        font-size: 1rem;
        font-weight: 300;
        line-height: 2rem;
    }
    .bread a {
        color: #FFF;
    }

    .bread a:hover {
        color: #d00b0b;
    }

    .bread span:last-child {
        display: none;
    }

    .bread span {
        margin: 0 0.3125rem;
    }

    .bread a:hover {
        opacity: 1;
    }
    .p110 {
        padding: 6.875rem 0;
    }
    .list_product .ul {
        margin: 0 -1.25rem;
    }

    .list_product .index_pro {
        padding: 0 1.25rem;
        margin-bottom: 2.5rem;
    }

    .list_product .index_pro:hover>a {
        box-shadow: 0 0 1rem rgba(0, 0, 0, 0.15);
        transition: all 0.4s;
        -webkit-transform: all 0.4s;
        -moz-transition: all 0.4s;
        -o-transition: all 0.4s;
    }
    .margin_l_r {
        margin: 0 -1.25rem;
    }
    .alignc {
        align-items: center;
    }

    .bor20 {
        border-radius: 1.25rem;
    }