.recommend { position: relative; } .recommend .desktopTips { position: fixed; z-index: 999; right: 0rpx; } .recommend .desktopTips .triangle { position: absolute; right: 124rpx; top: -26rpx; border: 20rpx solid #F9F9FF; border-top-color: transparent; border-left-color: transparent; border-right-color: transparent; } .recommend .desktopTips .tipsImg { width: 530rpx; height: 176rpx; } .recommend .scrollBox { width: 100%; } .recommend .scrollBox .firstClassify { padding: 24rpx 0rpx 20rpx; width: 100%; white-space: nowrap; background-color: white; } .recommend .scrollBox .firstClassify .firstBox { text-align: center; display: inline-block; width: 98rpx; padding: 0rpx 20rpx; } .recommend .scrollBox .firstClassify .firstBox .icon { width: 60rpx; height: 60rpx; } .recommend .scrollBox .firstClassify .firstBox .name { margin-top: 6rpx; font-weight: bold; font-size: 28rpx; } .recommend .selectType { padding: 30rpx 15rpx 30rpx 26rpx; display: flex; align-items: center; justify-content: space-between; } .recommend .selectType .type { padding: 14rpx 0rpx; width: 200rpx; box-sizing: border-box; text-align: center; border: 1rpx solid #9f9f9fa4; border-radius: 50rpx; color: #1A1A1A; font-size: 28rpx; } .recommend .selectType .currentType { color: white; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px; background-color: #00C657; border-color: #00C657; font-weight: bold; } .recommend .selectType .search { font-size: 0rpx; padding: 14rpx 14rpx; text-align: center; border: 1rpx solid #9f9f9fa4; border-radius: 50rpx; } .recommend .selectType .search .searchImg { width: 26rpx; height: 26rpx; }