
.listApp_box .web_th .title{font-family: Arial; font-weight: 500;}
.listApp_box .web_th .brief{font-family: Arial; font-weight: 500; color: #333;}

/* listApp_ul */
.listApp_ul{--pad: calc((100% - 1480px) / 2);}
@media only screen and (max-width: 1620px) {
	.listApp_ul{--pad: 70px;}
}
@media only screen and (max-width: 1024px) {
	.listApp_ul{--pad: 30px;}
}
@media only screen and (max-width: 980px) {
	.listApp_ul{--pad: 15px;}
}
.listApp_ul li{padding-left: var(--pad);}
.listApp_ul li:nth-child(n+2){margin-top: 5%;}
.listApp_pic{order: 3; width: 52%;}
.listApp_pic .app_pic{padding-bottom: 72%;}
.listApp_info{order: 2; width: 44%; align-items: flex-start;}
.listApp_info .app_info{flex: 1;}
.listApp_info .order{padding-right: 20px; position: relative; font-family: 'DIN-Medium'; line-height: 1; font-size: 96px; color: #666; margin-right: 30px;}
.listApp_info .order::before{position: absolute; right: 0; top: 0; height: 100%; width: 10px; border-radius: 10px; background: #666; content: '';}
.listApp_info .title{font-family: 'Archivo Black-Regular'; font-size: 36px; line-height: 1.3;}
.listApp_info .brief{line-height: 27px; margin: 20px 0 20px; color: #777; -webkit-line-clamp: 12;}
.listApp_info .more{display: inline-block; position: relative; text-transform: uppercase; font-weight: bold; color: var(--commonColor); padding-right: 36px; line-height: 30px; border-bottom: 2px solid var(--commonColor); border-top: 2px solid transparent;}
.listApp_info .more span{display: block; position: absolute; right: 0; top: 0; width: 30px; height: 30px; background: url(../img/icon_right_h.png) no-repeat right center; background-size: 24px auto; transition: all 0.45s ease;}
.listApp_info .more:hover{padding: 0 12px; padding-right: 46px; background: var(--commonColor); color: #fff;}
.listApp_info .more:hover span{right: 10px; background-image: url(../img/icon_right_w.png);}
.listApp_ul li:hover .order span{animation: swing 0.5s; display: inline-block;}

.listApp_ul li:nth-child(even){padding-left: 0; padding-right: var(--pad);}
.listApp_ul li:nth-child(even) .listApp_pic{order: 1;}

@media only screen and (max-width: 1650px) {
	.listApp_info .order{font-size: 90px;}
	.listApp_info .title{font-size: 34px;}
	.listApp_pic{width: 48%;}
	.listApp_info{width: 48%;}
}
@media only screen and (max-width: 1450px) {
	.listApp_info .order{font-size: 82px;}
	.listApp_info .order::before{width: 8px;}
	.listApp_info .title{font-size: 32px;}
	.listApp_info .brief{-webkit-line-clamp: 9;}
}
@media only screen and (max-width: 1300px) {
	.listApp_ul{zoom: 0.88;}
	.listApp_info .order{font-size: 72px;}
	.listApp_info .title{font-size: 26px;}
	.listApp_info .brief{-webkit-line-clamp: 8;}
}
@media only screen and (max-width: 980px) {
	.listApp_ul{zoom: 1;}
	.listApp_ul li{flex-wrap: wrap; padding: 0 15px !important;}
	.listApp_ul li:nth-child(n+2){margin-top: 24px;}
	.listApp_pic, .listApp_info{width: 100%;}
	.listApp_pic{order: 1 !important;}
	.listApp_info{padding-top: 14px; flex-direction: column;}
	.listApp_info .order{font-size: 48px; font-weight: bold;}
	.listApp_info .order::before{display: none;}
	.listApp_info .title{font-size: 22px; margin-top: 10px;}
	.listApp_info .brief{-webkit-line-clamp: 6; margin: 10px 0 10px;}
	
}


/* innerApp_box */
.innerContent{padding-top: 0;}

/* app_img_txt */
.app_title{font-family: 'Archivo Black-Regular'; font-size: 32px; line-height: 1.25; margin-bottom: 10px; color: #333;}
.app_img_txt{display: flex; justify-content: space-between; align-items: center;}
.app_img_txt .pic{width: 51%; overflow: hidden; order: 1; border-radius: 12px;}
.app_img_txt .pic img{display: block; width: 100%; height: auto; transition: all 0.5s ease;}
.app_img_txt .pic:hover img{transform: scale(1.08);}
.app_img_txt .txt_div{width: 46%; font-family: 'Inter-Regular'; color: #666; line-height: 28px; order: 2;}
.app_txt_img .pic{order: 3;}
.app_img_txt:nth-of-type(n+2){margin-top: 20px;}
@media only screen and (max-width: 1480px) {
	.app_title{font-size: 30px;}
}
@media only screen and (max-width: 1300px) {
	.app_title{font-size: 28px;}
}
@media only screen and (max-width: 980px) {
	.app_img_txt{flex-direction: column;}
	.app_img_txt:nth-of-type(n+2){margin-top: 10px;}
	.app_img_txt .pic{width: 100%; order: 1 !important;}
	.app_img_txt .txt_div{width: 100%; margin-top: 12px;}
}

/* appDetail_adv */
.pro_adv_ul{margin-top: 2.4%; padding: 0 2px;}
.pro_adv_ul .adv_item{border-radius: 8px; border: 1px solid #EBEBEB; width: 31.5%; margin-right: 2.75%; text-align: center; padding: 24px;}
.pro_adv_ul .adv_item:nth-child(3n){margin-right: 0;}
.pro_adv_ul .adv_item:nth-child(n+4){margin-top: 2%;}
.pro_adv_ul .adv_item img{display: block; height: 52px; width: auto; margin: 0 auto;}
.pro_adv_ul .adv_item .title{font-family: 'Archivo Black-Regular'; font-size: 24px; line-height: 1.3; margin: 12px 0 8px;}
.pro_adv_ul .adv_item .brief{line-height: 28px; color: #666;}
.pro_adv_ul .adv_item:hover{box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 0.2);}
.pro_adv_ul .adv_item:hover img{animation: swing 0.5s;}
@media only screen and (max-width: 1450px) {
	.pro_adv_ul .adv_item .title{font-size: 22px;}
}
@media only screen and (max-width: 1300px) {
	.pro_adv_ul{zoom: 0.9;}
	.pro_adv_ul .adv_item .title{min-height: 2.6em;}
}
@media only screen and (max-width: 980px) {
	.pro_adv_ul{zoom: 1; margin-top: 20px;}
	.pro_adv_ul .adv_item{width: 100%; margin-right: 0 !important; padding: 20px 16px;}
	.pro_adv_ul .adv_item:nth-child(n+2){margin-top: 20px;}
	.pro_adv_ul .adv_item .title{min-height: unset;}
}


