/*  */

.web_th .title{color: var(--commonColor);}
.web_th .brief{color: #666;}
.c_right_box .web_th .title{margin-bottom: 20px;}
.c_right_box .web_th .brief{line-height: 28px;}

@media only screen and (max-width: 980px) {
	.c_right_box .web_th .title{margin-bottom: 15px;}
	.c_right_box .web_th .brief{margin-top: 0;}
}

/* listPro_list */
.listPro_list{padding: 0 0 0; flex-wrap: wrap;}
.listPro_list li{width: 48%; box-sizing: border-box; margin-right: 4%;}
.listPro_list li:nth-child(2n){margin-right: 0;}
.listPro_item{margin-top: 32px; position: relative; height: auto;}
.listPro_item>a{height: 100%;}
.listPro_item .pro_pic{padding-bottom: 100%; border: 1px solid #E5E5E5;}
.listPro_item .item_icon{display: block; width: 80px; height: 80px; position: absolute; left: 50%; top: 50%; margin: -26px 0 0 -40px; border-radius: 50%; background: rgba(var(--comColorRgb), 0.8); background-repeat: no-repeat; background-position: center; background-image: url(../img/icon_plus.png); opacity: 0; background-size: 20px auto;}
.listPro_item .title{margin: 24px 0 14px; font-size: 26px; line-height: 1.25; overflow: hidden; font-family: 'Montserrat-Bold'; text-transform: uppercase; flex: 1;}
.listPro_item .brief{color: #666; line-height: 28px; height: 84px;}
.listPro_item:hover .title{color: var(--commonColor);}
.listPro_item:hover .brief{color: #333;}
.listPro_item:hover .item_icon{margin-top: -40px; opacity: 1;}


@media only screen and (max-width: 1450px) {
	.listPro_item{margin-top: 26px;}
	.listPro_item .title{font-size: 24px;}
	.listPro_item .item_icon{width: 66px; height: 66px; margin: -20px 0 0 -33px;}
}
@media only screen and (max-width: 1300px) {
	.listPro_item .title{font-size: 22px;}
}
@media only screen and (max-width: 980px) {
	.listPro_list{padding-top: 0;}
	.listPro_list li{width: 100%; margin: 20px 0 0;}
	.listPro_item{padding-bottom: 0;}
	.listPro_item .title{height: auto; font-size: 20px; display: block; margin: 18px 0 8px; line-height: 1.5;}
	.listPro_item .brief{position: static; height: auto;}
	.listPro_item .item_icon{margin: -33px 0 0 -33px; opacity: 1;}
}

/* listPro_faq */
.listPro_faq{overflow: hidden;}
.listPro_faq .left_faq{width: 30%;}
.listPro_faq .left_faq .pic{padding-bottom: 160%;}
.listPro_faq .right_faq{width: 66.5%;}
.listPro_faq .faq_ul{margin-top: 3%;}
.listPro_faq .faq_ul .faq_item{width: 48.5%; margin-right: 3%;}
.listPro_faq .faq_ul .faq_item:nth-child(2n){margin-right: 0;}
.listPro_faq .faq_ul .faq_item:nth-child(n+3){margin-top: 3%;}
.listPro_faq .faq_ul .faq_item .order{width: 48px; height: 48px; border-radius: 50%; border: 1px dashed var(--commonColor); color: var(--commonColor); font-size: 21px; font-family: 'Montserrat-Light'; line-height: 46px; text-align: center;}
.listPro_faq .faq_ul .faq_item .title{font-family: 'Montserrat-Bold'; font-size: 24px; line-height: 1.3; margin: 15px 0 10px; color: var(--commonColor);}
.listPro_faq .faq_ul .faq_item .brief{color: #666; line-height: 28px;}

.listPro_faq .faq_ul .faq_item:hover .order{animation: jump 0.5s;}

@media only screen and (max-width: 1450px) {
	.listPro_faq .faq_ul .faq_item .order{font-size: 20px; width: 45px; height: 45px; line-height: 43px;}
	.listPro_faq .faq_ul .faq_item .title{font-size: 22px;}
	.listPro_faq .faq_ul .faq_item .brief{line-height: 26px;}
}
@media only screen and (max-width: 980px) {
	.listPro_faq .layout{flex-direction: column;}
	.listPro_faq .left_faq{width: 100%;}
	.listPro_faq .left_faq .pic{padding-bottom: 120%;}
	.listPro_faq .right_faq{width: 100%; margin-top: 20px;}
	.listPro_faq .faq_ul{margin-top: 20px;}
	.listPro_faq .faq_ul .faq_item{width: 100%; margin-right: 0;}
	.listPro_faq .faq_ul .faq_item:nth-child(n+2){margin-top: 20px;}
	.listPro_faq .faq_ul .faq_item .title{font-size: 20px;}
}

/* listPro_info */
.info_pic_item{width: 56%;}
.info_pic_item .pic{padding-bottom: 72%; height: 100%; padding-bottom: 0;}
.info_right{width: 53%; position: relative; z-index: 1; background: var(--commonColor); padding: 4.5% 4%; margin: 4.5% 0; margin-left: -9%;}
.info_right .title{color: #fff;}
.info_right .brief{color: #E5E5E5; margin-top: 3%; line-height: 30px;}

@media only screen and (max-width: 1450px) {
	.info_right{padding: 4% 3.5%;}
	.info_right .brief{line-height: 28px;}
}
@media only screen and (max-width: 980px) {
	.pro_info_inner{flex-direction: column;}
	.info_pic_item{width: 100%;}
	.info_pic_item .pic{padding-bottom: 72%; height: 0;}
	.info_right{width: 100%; margin: 0; padding: 20px 15px 24px;}
	.info_right .brief{line-height: 26px;}
}