.proType_main {
    margin-top: 5%;
}

.proType_main .cate_list {
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap; max-width: 1280px; margin: 0 auto;
}

.proType_main .cate_list .cate_item {
    width: 48%;
    position: relative;
    height: 0;
    overflow: hidden;
    padding-bottom: 35.5%;
    margin-bottom: 50px;
    margin-right: 4%;
}

.proType_main .cate_list .cate_item:nth-child(2n) {
    margin-right: 0;
}

.proType_main .cate_list .cate_item:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(../img/other/cate_mask.png) no-repeat center center / cover;
    z-index: 99;
    transform: scale(0.5);
    opacity: 0;
    transition: transform .4s ease-in-out, opacity .4s ease-in-out;
}

.proType_main .cate_list .cate_item:hover:before {
    transform: scaleX(1);
    opacity: 1;
}

.proType_main .cate_list .cate_item img {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    object-fit: cover;
    z-index: 9;
}

.proType_main .cate_list .cate_item .item_info {
    padding: 0 100px;
    position: absolute;
    bottom: -25%;
    z-index: 99;
    opacity: 0;
    transition: bottom .5s ease-in-out, opacity .5s ease-in-out;
}

.proType_main .cate_list .cate_item:hover .item_info {
    bottom: 24%;
    opacity: 1;
}

.proType_main .cate_list .cate_item .item_info .item_title {
    font-weight: bold;
    font-size: 30px;
    color: #FFFFFF;
    text-align: left;
    font-style: normal;
    text-transform: uppercase;
    margin-bottom: 15px;
}

.proType_main .cate_list .cate_item .item_info .item_title a {
    display: inline-block;
    color: #FFFFFF;
    position: relative;
    padding-bottom: 10px;
}

.proType_main .cate_list .cate_item .item_info .item_title a:after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 64px;
    height: 5px;
    background: var(--commonColor);
}

.proType_main .cate_list .cate_item .item_info .item_desc {
    font-weight: 400;
    color: #FFFFFF;
    line-height: 30px;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.proType_main .cate_list .cate_item .item_info .item_desc a {
    color: #FFFFFF;
}

.proType_main .cate_list .cate_item .item_btn a {
    position: absolute;
    bottom: 30px;
    right: 20px;
    z-index: 99;
    padding: 10px 25px;
    font-weight: bold;
    font-size: 24px;
    color: #FFFFFF;
    text-align: left;
    font-style: normal;
    text-transform: none;
    background-color: #333333;
    display: flex;
    align-items: center;
}

.proType_main .cate_list .cate_item:hover .item_btn a {
    background-color: var(--commonColor);
}

.proType_main .cate_list .cate_item .item_btn a:after {
    content: '';
    display: inline-block;
    width: 34px;
    height: 34px;
    background: url(../img/other/read_more3.png) no-repeat center center / cover;
    margin-left: 10px;
}

.proType_application {
    margin-top: 5%;
    padding-bottom: 7%;
    /* background-image: url(../img/other/pro_app_bg.png);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: contain; */
    position: relative;
}

.proType_application::before{position: absolute; left: 0; top: 50%; content: ''; z-index: 1; border-bottom: 0; border-top: 120px solid #fff; border-right: 120px solid transparent; border-left: 0;}
.proType_application::after{position: absolute; left: 0; width: 100%; top: 50%; content: ''; z-index: 0; bottom: 0; background: var(--commonColor);}

/* .proType_application .layout {
    width: 1700px;
    margin-left: auto;
    margin-right: 0;
}

@media (max-width: 1740px) {
    .proType_application .layout {
        width: 1400px;
    }
}

@media (max-width: 1440px) {
    .proType_application .layout {
        width: 95%;
    }
} */
@media only screen and (max-width: 1200px) {
    .recommended_news {visibility: visible !important;}
}

@media only screen and (max-width: 1100px) {
    .proType_main .cate_list .cate_item:before {
        transform: scaleX(1);
        opacity: 1;
    }
    .proType_main .cate_list .cate_item .item_info{bottom: 24%; opacity: 1;}
    .proType_main .cate_list .cate_item:hover .item_info .item_title a{color: var(--commonColor);}
}

.proType_application .app_title {
    font-family: 'OpenSans-Bold';
    font-weight: bold;
    font-size: 48px;
    color: #333333;
    text-align: left;
    font-style: normal;
    text-transform: uppercase;
    margin-bottom: 20px;
}

.proType_application .app_desc {
    font-weight: 400;
    color: #666666;
    line-height: 30px;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.proType_application .app_box {
    position: relative;
    margin-top: 60px;
}

.proType_application .app-btn-next,
.proType_application .app-btn-prev {
    content: '';
    position: absolute;
    top: 37%;
    margin-top: -48px;
    width: 96px;
    height: 96px;
    background-color: var(--commonColor);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 80%;
    z-index: 99;
    border-radius: 50%;
    cursor: pointer;
}

.proType_application .app-btn-next {
    right: 11%;
    background-image: url(../img/other/pro_app_next.png);
}

.proType_application .app-btn-prev {
    left: -3%;
    background-image: url(../img/other/pro_app_prev.png);
}
.proType_application .app-btn-next:hover,
.proType_application .app-btn-prev:hover{
    background-color: var(--commonColor);
}

.proType_application .app_list .app_item {
    -webkit-transition: all .5s ease-out 0ms;
    -moz-transition: all .5s ease-out 0ms;
    -o-transition: all .5s ease-out 0ms;
    transition: all .5s ease-out 0ms;
    display: flex;
    flex-direction: column;
    justify-content: space-between; height: auto;
}

.proType_application .app_list .app_item .item_img {
    position: relative;
    height: 0;
    overflow: hidden;
    padding-bottom: 81%;
    z-index: 9;
}

.proType_application .app_list .app_item .item_img img {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    object-fit: cover;
}

.proType_application .app_list .app_item:hover .item_img img {
    -webkit-transform: scale(1.08);
    -moz-transform: scale(1.08);
    -o-transform: scale(1.08);
    transform: scale(1.08);
}

.proType_application .app_list .app_item .item_num {
    font-weight: 400;
    font-size: 86px;
    color: #FFFFFF;
    line-height: 132px;
    text-align: left;
    font-style: normal;
    text-transform: none;
    margin-top: -10%;
    padding-left: 60px;
    margin-bottom: 20px;
    position: relative;
    z-index: 99;
}

.proType_application .app_list .app_item .item_info {
    margin: 0 35px 0 200px; flex: 1;
}

.proType_application .app_list .app_item .item_info>a{
    display: flex; flex-direction: column; justify-content: space-between; height: 100%;
}


.proType_application .app_list .app_item .item_title {
    font-weight: bold;
    font-size: 30px;
    color: #FFFFFF;
    text-align: left;
    font-style: normal;
    text-transform: none;
    margin-bottom: 20px; flex: 1; line-height: 1.3;
}

.proType_application .app_list .app_item .item_desc {
    font-weight: 400;
    color: #FFFFFF;
    line-height: 30px;
    text-align: left;
    font-style: normal;
    text-transform: none;
    height: 120px;
}

.proType_faq {
    padding: 5% 0;
    background-color: var(--weightColor);
}

.proType_faq .web_th {
    margin-bottom: 15px;
}
/* 
.proType_faq .layout {
    width: 1700px;
    margin-left: 0;
    margin-right: auto;
}

@media only screen and (max-width: 1740px) {
    .proType_faq .layout {
        width: 1400px;
    }
}

@media only screen and (max-width: 1440px) {
    .proType_faq .layout {
        width: 95%;
    }
} */

.proType_faq .faq_wrap {
    justify-content: space-between;
    align-items: center;
}

.proType_faq .faq_wrap .faq_left {
    width: 35%;
    position: relative;
    height: 697px;
    overflow: hidden;
    -webkit-transition: all .5s ease-out 0ms;
    -moz-transition: all .5s ease-out 0ms;
    -o-transition: all .5s ease-out 0ms;
    transition: all .5s ease-out 0ms;
}

.proType_faq .faq_wrap .faq_left img {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    object-fit: cover;
}

.proType_faq .faq_wrap .faq_left:hover img {
    -webkit-transform: scale(1.08);
    -moz-transform: scale(1.08);
    -o-transform: scale(1.08);
    transform: scale(1.08);
}

.proType_faq .faq_wrap .faq_right {
    width: 60%;
}

.proType_faq .faq_wrap .faq_right .faq_list .faq_item {
    position: relative;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 54px;
    margin-bottom: 40px;
}

.proType_faq .faq_wrap .faq_right .faq_list .faq_item:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: rgba(255, 255, 255, .7);
}

.proType_faq .faq_wrap .faq_right .faq_list .faq_item .faq_num {
    width: 10%;
    font-family: 'Arial-Regular';
    font-weight: 400;
    font-size: 88px;
    color: var(--commonColor);
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.proType_faq .faq_wrap .faq_right .faq_list .faq_item .faq_info {
    width: 85%;
}

.proType_faq .faq_wrap .faq_right .faq_list .faq_item .faq_info .item_title {
    font-weight: bold;
    font-size: 24px;
    color: #FFFFFF;
    line-height: 48px;
    text-align: left;
    font-style: normal;
    text-transform: uppercase;
    margin-bottom: 12px;
}

.proType_faq .faq_wrap .faq_right .faq_list .faq_item .faq_info .item_cont {
    font-weight: 400;
    color: #FFFFFF;
    line-height: 30px;
    text-align: left;
    font-style: normal;
    text-transform: none;
}

.proType_faq .pagination {
    margin-top: 40px;
    display: flex;
    justify-content: center;
    align-items: center
}

.proType_faq .pagination a,
.pagination span {
    width: 24px !important;
    height: 24px !important;
    background: #FFFFFF;
    border-radius: 2px 2px 2px 2px;
    margin-right: 1%;
    display: inline-block;
    font-weight: 400;
    line-height: 1.5 !important;
    color: #333333;
    text-align: center;
    font-style: normal;
    text-transform: none;
    margin-right: 15px;
    border: none !important;
}

.proType_faq .pagination a.next {
    border: none;
    background-color: unset;
    border-radius: 8px !important;
    width: auto;
    height: auto;
    font-size: 0;
}

.proType_faq .pagination a.prev {
    border: none;
    background-color: unset;
    border-radius: 8px !important;
    width: auto;
    height: auto;
    font-size: 0;
}

.proType_faq .pagination a.next:hover,
.pagination a.prev:hover {
    color: #FFFFFF;
    border: none;
    background-color: unset;
}

.proType_faq .pagination a.prev::after {
    content: '';
    display: inline-block;
    width: 23px;
    height: 23px;
    background-image: url(../img/other/faq_pages_prev.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    border: 1px solid transparent;
    transition: border .5s ease-in-out;
    border-radius: 2px 2px 2px 2px;
}

.pagination a.prev:hover::after {
    background-image: url(../img/other/faq_pages_prev.png) !important;
    border: 1px solid #FFFFFF;
}

.proType_faq .pagination a.next::before {
    content: '';
    display: inline-block;
    width: 23px;
    height: 23px;
    background-image: url(../img/other/faq_pages_next.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    border: 1px solid transparent;
    transition: border .5s ease-in-out;
    border-radius: 2px 2px 2px 2px;
}

.pagination a.next:hover::before {
    background-image: url(../img/other/faq_pages_next.png) !important;
    border: 1px solid #FFFFFF;
}

.proType_faq .pagination a:hover {
    background: var(--commonColor);
}

.proType_faq .pagination a.page-numbers:hover {
    color: #FFFFFF
}

.proType_faq .pagination span.current {
    background: var(--commonColor);
    cursor: pointer;
}

.proType_faq .pagination span.current {
    color: #FFFFFF
}

@media only screen and (max-width: 1500px) {
    .proType_application {
        background-size: 100% 55%;
    }

    .proType_application .app_list .app_item .item_info {
        margin: 0 20px 0 140px;
    }
}

@media only screen and (max-width: 980px) {

    .proType_application::before{border-top-width: 80px; border-right-width: 80px; top: 55%;}
    .proType_application::after{top: 55%;}

    .proType_main .cate_list .cate_item .item_info .item_title{
        font-size: 20px;
    }
    .proType_main .cate_list .cate_item .item_btn a{font-size: 18px; padding: 8px 20px;}
    .proType_main .cate_list {
        flex-direction: column;
    }

    .proType_main .cate_list .cate_item {
        width: 100%;
        margin: 0;
        margin-bottom: 20px;
        padding-bottom: 75%;
    }
    .proType_main .cate_list .cate_item:last-child{margin-bottom: 0;}

    .proType_main .cate_list .cate_item:before {
        opacity: 1 !important;
        transform: scale(1) !important;

    }

    .proType_main .cate_list .cate_item .item_info {
        padding: 0 30px;
        bottom: 24%;
        opacity: 1 !important;
    }

    .proType_main .cate_list .cate_item .item_btn a {
        background-color: var(--commonColor) !important;
    }

    .proType_application {
        background-size: 100% 35%;
        margin: 30px 0 0;
    }

    .proType_application .app_title {
        font-size: 26px; margin-bottom: 14px;
        line-height: 1.4;
    }
    .proType_application .app_desc {
        font-size: 16px;
    }

    .proType_application .app-btn-prev {
        left: -4% !important;
        width: 40px;
        height: 40px;
    }

    .proType_application .app-btn-next {
        right: -4% !important;
        width: 40px;
        height: 40px;
    }

    .proType_application .app_list .app_item .item_num {
        font-size: 56px;
        line-height: 1.2;
        margin-top: -35px; margin-bottom: 0;
    }

    .proType_application .app_list .app_item .item_info {
        margin: 0 20px;
    }
    .proType_application .app_list .app_item .item_title{font-size: 24px; margin-bottom: 14px;}

    .proType_faq{padding: 30px 0;}

    .proType_faq .faq_wrap {
        flex-direction: column;
    }

    .proType_faq .faq_title {
        font-size: 35px;
        line-height: 40px;
        margin-bottom: 30px;
    }


    .proType_faq .faq_wrap .faq_left {
        width: 100%;
        height: 0;
        padding-bottom: 85%;
        margin-bottom: 20px;
    }

    .proType_faq .faq_wrap .faq_right {
        width: 100%;
    }

    .proType_application .app_box{margin-top: 30px;}
}

@media only screen and (max-width: 786px) {
    .proType_application {
        background-size: 100% 45%;
    }

    .proType_faq .faq_wrap .faq_right .faq_list .faq_item {
        flex-direction: column;
        padding-bottom: 20px;
        margin-bottom: 20px;
    }
    .proType_faq .faq_wrap .faq_right .faq_list .faq_item:last-child{margin-bottom: 0;}

    .proType_faq .faq_wrap .faq_right .faq_list .faq_item .faq_num {
        width: 95%;
        font-size: 56px;
        text-align: left;
        line-height: 1; margin-bottom: 15px;
    }

    .proType_faq .faq_wrap .faq_right .faq_list .faq_item .faq_info {
        width: 95%;
    }

    .proType_faq .faq_wrap .faq_right .faq_list .faq_item .faq_info .item_title {
        font-size: 20px;
        line-height: 1.5;
    }
}

@media only screen and (max-width: 480px) {
    .proType_main .cate_list .cate_item .item_info {
        padding: 0 20px;
        bottom: 45% !important;
    }

    .proType_main .cate_list .cate_item .item_info .item_desc {
        display: none;
    }

}