.recommend { position: relative; padding-top: 55rpx; padding-bottom: calc(140rpx + env(safe-area-inset-bottom)) !important; .firstClassify { margin: 50rpx auto; width: 700rpx; padding: 40rpx 10rpx; box-sizing: border-box; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; text-align: center; z-index: 2; background: #FFFFFF; border-radius: 30rpx; .classifyBox { margin-bottom: 20rpx; width: 25%; .icon { width: 108rpx; height: 150rpx; } } .searchBox { margin: 10rpx auto 0; width: 412rpx; padding: 12rpx 0; background: #F2F6FC; border-radius: 27rpx; display: flex; align-items: center; justify-content: center; font-size: 27rpx; color: #666666; .search-icon { margin-left: 22rpx; width: 28rpx; height: 28rpx; } } } .desktopTips { position: fixed; z-index: 999; right: 0rpx; .triangle { position: absolute; right: 124rpx; top: -26rpx; border: 20rpx solid #F9F9FF; border-top-color: transparent; border-left-color: transparent; border-right-color: transparent; } .tipsImg { width: 530rpx; height: 176rpx; } } } .subscribe { position: fixed; top: 0; left: 0; z-index: 99; width: 100vw; height: 100vh; }