.business-index .index-detail .profile-container .profile-detail { position: relative; display: flex; justify-content: flex-end; margin: 86px auto; } .business-index .index-detail .profile-container .profile-detail .pf-left { position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .business-index .index-detail .profile-container .profile-detail .pf-left:before { content: ''; position: absolute; top: -110px; left: -140px; width: 415px; height: 402px; background: url('/static/cn/images/business/profile-left.png') no-repeat center; background-size: cover; } .business-index .index-detail .profile-container .profile-detail .pf-left .left-text { width: 795px; padding: 85px 40px; background-color: #fff; box-shadow: 0 1px 54px 0 rgba(125, 125, 125, 0.23); } .business-index .index-detail .profile-container .profile-detail .pf-left .left-text p { font-size: 16px; font-weight: 400; color: #333333; line-height: 32px; } .business-index .index-detail .profile-container .profile-detail .pf-left .left-text p:last-of-type { margin-top: 30px; } .business-index .index-detail .profile-container .profile-detail .pf-right img { width: 670px; } .business-index .index-detail .procedure-container .procedure-detail { margin: 26px 0 100px; padding: 60px 45px; border: 1px solid #e5e5e5; } .business-index .index-detail .procedure-container .procedure-detail .detail-item { display: none; } .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list .sort-img { width: 712px; margin: 37px auto 50px; } .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list p.des-info, .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list .property label, .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list .property span { font-size: 18px; font-weight: 400; color: #666666; line-height: 36px; } .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list .property { display: flex; } .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list .property span { flex: 1; } .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list ul.recycled-list { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; margin-top: 35px; } .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list ul.recycled-list li.recycled-item { position: relative; width: 290px; height: 240px; } .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list ul.recycled-list li.recycled-item .recycled-img { width: 100%; height: 100%; background-position: 100% 100%; background-repeat: no-repeat; background-size: cover; } .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list ul.recycled-list li.recycled-item .item-detail { position: absolute; bottom: 0; left: 0; display: flex; flex-direction: column; align-items: center; width: 100%; height: 85px; padding: 0 10px; background: url('/static/cn/images/business/shadow.png') no-repeat center; background-size: cover; } .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list ul.recycled-list li.recycled-item .item-detail p { font-size: 20px; font-weight: bold; color: #ffffff; line-height: 24px; padding-top: 25px; } .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list ul.equipment-list { display: flex; justify-content: space-between; align-items: center; margin-top: 35px; } .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list ul.equipment-list .equipment-item { width: 32%; } .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list ul.equipment-list .equipment-item a { cursor: default; } .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list ul.equipment-list .equipment-item .equipment-img { width: 100%; height: 270px; background-position: 100% 100%; background-repeat: no-repeat; background-size: cover; } .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list ul.equipment-list .equipment-item .equipment-img + p { font-size: 22px; font-weight: bold; color: #333333; line-height: 32px; margin-top: 15px; text-align: center; } .business-index .index-detail .procedure-container .procedure-detail .detail-item .item-list:not(:last-of-type) { margin-bottom: 80px; } .business-index .index-detail .procedure-container .procedure-detail .detail-item:nth-of-type(3) ul.recycled-list .recycled-item:nth-of-type(1), .business-index .index-detail .procedure-container .procedure-detail .detail-item:nth-of-type(3) ul.recycled-list .recycled-item:nth-of-type(2), .business-index .index-detail .procedure-container .procedure-detail .detail-item:nth-of-type(3) ul.recycled-list .recycled-item:nth-of-type(3), .business-index .index-detail .procedure-container .procedure-detail .detail-item:nth-of-type(3) ul.recycled-list .recycled-item:nth-of-type(4) { margin-bottom: 16px; } ul.procedure-list { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; } ul.procedure-list li.item { position: relative; display: inline-block; margin: 0 24px; padding: 16px 36px; font-weight: bold; font-size: 18px; border: 2px solid #F51C30; border-right-width: 0; color: #F51C30; cursor: pointer; text-align: center; width: 18%; padding: 10px 10px; } ul.procedure-list li.item:before { position: absolute; top: -2px; right: -19px; content: ''; display: block; width: 20px; height: 107%; background-repeat: no-repeat; background-size: auto 100%; background-position: left center; background-image: url(/static/cn/images/home/part_three_tab_arrow-two.png); } ul.procedure-list li.item:hover, ul.procedure-list li.item.active { background-color: #EC2026; } ul.procedure-list li.item:hover p, ul.procedure-list li.item.active p { color: #fff; } ul.procedure-list li.item:hover:before, ul.procedure-list li.item.active:before { background-image: url(/static/cn/images/home/part_three_tab_arrow_a.png); }