page { background-color: #fff !important; } .productSort .header { width: 100%; height: 96rpx; background-color: #fff; position: fixed; left: 0; right: 0; z-index: 9; border-bottom: 1rpx solid #f5f5f5; } .productSort .header .input { width: 90%; height: 60rpx; background-color: #f5f5f5; border-radius: 50rpx; box-sizing: border-box; padding: 0 25rpx; } .productSort .header .input .iconfont { font-size: 35rpx; color: #555; } .productSort .header .input .placeholder { color: #999; } .productSort .header .input input { font-size: 26rpx; height: 100%; width: 90%; } .productSort .aside { position: fixed; width: 180rpx; left: 0; bottom: 0; background-color: #f7f7f7; overflow-y: auto; overflow-x: hidden; } .productSort .aside .item { height: 80rpx; width: 100%; font-size: 26rpx; color: #424242; } .productSort .aside .item.on { background-color: #fff; border-left: 4rpx solid #fc4141; width: 100%; text-align: center; color: #fc4141; font-weight: bold; } .productSort .conter { margin: 98rpx 0 0 180rpx; padding: 0 14rpx; } .productSort .conter .listw { padding-top: 20rpx; vertical-align: top; } .productSort .conter .listw .title { height: 90rpx; } .productSort .conter .listw .title .line { width: 100rpx; height: 2rpx; background-color: #999; } .productSort .conter .listw .title .name { font-size: 28rpx; color: #333; margin: 0 30rpx; font-weight: bold; } .productSort .conter .list { flex-wrap: wrap; } .productSort .conter .list .item { width: 177rpx; margin-top: 26rpx; } .productSort .conter .list .item .picture { width: 120rpx; height: 120rpx; border-radius: 50%; } .productSort .conter .list .item .picture image { width: 100%; height: 100%; border-radius: 50%; } .productSort .conter .list .item .name { font-size: 24rpx; color: #333; height: 56rpx; line-height: 56rpx; width: 120rpx; text-align: center; }