::-webkit-scrollbar { display: none; } .group { height: 100%; width: 100%; /* padding-bottom: 102rpx; box-sizing: border-box; */ } scroll-view { height: 100%; } .group-container { width: 100%; box-sizing: border-box; padding: 0 18rpx; } .group-bars { display: flex; justify-content: space-between; width: 100%; height: 188rpx; background: #fff; margin-top: 20rpx; border-radius: 12rpx; padding: 14rpx 28rpx; box-sizing: border-box; } .group-head { display: flex; flex-direction: column; align-items: center; justify-content: center; } .group-head image { width: 96rpx; height: 96rpx; border-radius: 50%; } .group-head text { font-size: 32rpx; margin-top: 12rpx; width: 150rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center; } .group-jion { width: 460rpx; color:#444; } .group-jion .top-title { display: flex; justify-content: space-between; font-size: 32rpx; } .group-jion .group-detail { display: flex; justify-content: space-between; width: 100%; height: 84rpx; border: 4rpx solid #FFACB6; border-radius: 12rpx; overflow: hidden; margin-top: 26rpx; } .group-jion .specialBorder{ border: 4rpx solid #C6C6C6; } .group-jion .group-detail .number { display: flex; flex-direction: column; justify-content: center; margin-left: 34rpx; font-size: 28rpx; color: #4A4A4A; } .group-jion .group-detail .jion-btn { display: flex; align-items: center; justify-content: center; width: 36%; height: 100%; background: #FF3E55; color: #fff; font-size: 36rpx; line-height: 100%; } .group-jion .group-detail .specialBtn{ background: #C6C6C6 } .change { width: 146rpx; height: 48rpx; background: #5BB7FD; border-radius: 48rpx; margin: 20rpx auto; text-align: center; line-height: 48rpx; color: #fff; font-size: 28rpx; } .whole-group { width: 100%; min-height: 60%; background: #fff; } .whole-group { padding: 20rpx 18rpx; box-sizing: border-box; } .title { display: flex; align-items: center; justify-content: space-between; height: 70rpx; padding: 0 18rpx; position: relative; box-sizing: border-box; color:#444; } .title .left { font-size: 32rpx; padding-left: 52rpx; } .quota { font-size: 28rpx; color: red; } .title .ren { width: 42rpx; height: 36rpx; position: absolute; left: 20rpx; } .title .right { display: flex; /* flex-direction: row; */ align-items: center; font-size: 28rpx; color:#444; } .title .right image { width: 16rpx; height: 28rpx; margin-left:14rpx; } .group-box { display: flex; width: 105%; flex-wrap: wrap; flex-direction: row; /* justify-content: space-between; */ } .group-item { position: relative; display: flex; margin-right: 35rpx; flex-direction: column; } .group-item .item-img { width: 214rpx; height: 278rpx; } .group-item view:nth-child(2) { font-size: 32rpx; color: #E51C23; } .group-item view:nth-child(3) { font-size: 28rpx; color: #969595; margin-top: 18rpx; } .group-item text { margin-left: 10rpx; } .group-item #grade { margin-top: 20rpx; color:#444; text-align: center; font-size: 28rpx; } .Collage-bottom { display: flex; justify-content: space-around; align-items: center; height: 102rpx; position: relative; } .Collage-bottomx { height: 82rpx; } .Collage-bottom view image { width: 42rpx; height: 50rpx; vertical-align: middle; margin-right: 30rpx; } .Collage-bottom text { vertical-align: middle; } .Collage-bottom .bg { position: absolute; left: 50%; top: 15%; width: 4rpx; height: 70%; transform: translateX(-50%); } .group-popup { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .5); z-index: 99; } .group-popup .group-content { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 80%; background: #fff; border-radius: 20rpx; } .group-title { text-align: center; margin: 36rpx 0; } .group-list { display: flex; justify-content: space-between; flex-wrap: wrap; padding: 0 62rpx; } .group-list .group-item { position: relative; display: flex; margin-right: 0; justify-content: space-between; /* flex-direction: column; */ } .group-content-img { width: 214rpx; height: 290rpx; } .sure { position: relative; width: 392rpx; height: 80rpx; margin: 36rpx auto 26rpx auto; } .sure image { width: 100%; height: 100%; } .sure text { position: absolute; left: 164rpx; top: 18rpx; color: #fff; z-index: 2; } .select-img { position: absolute; left: 10rpx; top: 10rpx; width: 52rpx; height: 52rpx; }