.hospital-new-component .hospital-services-component { overflow: hidden; position: relative; z-index: 1; padding: 32rpx 24rpx; background-color: #fff; border-top-left-radius: 24rpx; border-top-right-radius: 24rpx; } .hospital-new-component .hospital-services-component .service-item { height: 156rpx; } .hospital-new-component .hospital-services-component .service-item .service-item-content { background-size: cover; background-position: center; background-repeat: no-repeat; display: flex; height: 100%; padding: 24rpx; border-radius: 16rpx; background-image: url("https://gw.alipayobjects.com/mdn/rms_373ab8/afts/img/A*XKPySZVmyGQAAAAAAAAAAAAAARQnAQ"); } .hospital-new-component .hospital-services-component .icon-container { display: none; } .hospital-new-component .hospital-services-component .left-content { flex: 1; } .hospital-new-component .hospital-services-component .left-content .title { color: #fff; font-weight: bold; font-size: 32rpx; display: flex; align-items: center; justify-content: space-between; } .hospital-new-component .hospital-services-component .left-content .desc { color: #fff; font-size: 24rpx; margin-top: 8rpx; } .hospital-new-component .hospital-services-component .action-button { display: none; } .hospital-new-component .hospital-services-component.model-a .service-item { margin-bottom: 16rpx; } .hospital-new-component .hospital-services-component.model-a .service-item .service-item-content { align-items: center; } .hospital-new-component .hospital-services-component.model-a .service-item:last-child { margin-bottom: 0; } .hospital-new-component .hospital-services-component.model-a .icon-container { width: 80rpx; height: 80rpx; display: flex; align-items: center; justify-content: center; margin-right: 24rpx; border-radius: 50%; background-color: #fff; } .hospital-new-component .hospital-services-component.model-a .icon-image { width: 56rpx; height: 56rpx; display: block; } .hospital-new-component .hospital-services-component.model-a .action-button { display: block; height: 54rpx; padding: 0 32rpx; border: none; outline: none; line-height: 54rpx; border-radius: 28rpx; background-color: #fff; color: #FF9123; font-size: 24rpx; font-weight: bold; } .hospital-new-component .hospital-services-component.model-b, .hospital-new-component .hospital-services-component.model-c { display: flex; flex-wrap: wrap; margin-bottom: -16rpx; } .hospital-new-component .hospital-services-component.model-b .right-content, .hospital-new-component .hospital-services-component.model-c .right-content { height: 100%; } .hospital-new-component .hospital-services-component.model-b .left-content .title::after, .hospital-new-component .hospital-services-component.model-c .left-content .title::after { content: ''; display: block; background-size: cover; background-position: center; background-repeat: no-repeat; width: 20rpx; height: 20rpx; background-image: url('https://gw.alipayobjects.com/mdn/rms_373ab8/afts/img/A*n_7ZTq7ZXb8AAAAAAAAAAAAAARQnAQ'); } .hospital-new-component .hospital-services-component.model-b .service-item { margin-right: 16rpx; margin-bottom: 16rpx; width: calc(50% - 8rpx); } .hospital-new-component .hospital-services-component.model-b .service-item:nth-child(2n) { margin-right: 0; } .hospital-new-component .hospital-services-component.model-c .service-item { margin-right: 16rpx; margin-bottom: 16rpx; width: calc(33.3% - 10.66rpx); } .hospital-new-component .hospital-services-component.model-c .service-item:nth-child(3n) { margin-right: 0; }