page { padding-bottom: 50rpx; } .page { padding: 0 46rpx; color: #131D34; } .search-w { display: flex; width: 658rpx; border: 2rpx solid #e5e5e5; border-radius: 8rpx; height: 80rpx; line-height: 76rpx; margin-top: 16rpx; } .search-left { width: 120rpx; font-size: 26rpx; padding-left: 26rpx; position: relative; font-weight: bold; } .search-left::after { content: ''; width: 2rpx; height: 36rpx; position: absolute; top: 22rpx; right: 0; background: #E5E5E5; } .search-left .icon { position: absolute; right: 24rpx; } .select { position: absolute; background: #fff; left: 0; bottom: -180rpx; width: 100%; box-shadow:0px 2px 6px rgba(0,0,0,0.16); border: 2rpx solid #e5e5e5; border-radius: 8rpx; font-size: 26rpx; padding: 0 20rpx; z-index: 1111; } .select-w .mask { background: transparent; } .options { text-align: center; } .options:first-child { border-bottom: 2rpx solid #e5e5e5; } .options.active { color: #17D2D2; } .search-right { flex: 1; display: flex; font-size: 30rpx; padding-left: 24rpx; line-height: 76rpx; height: 76rpx; } .search-right input { height: 100%; flex: 1; margin-left: 12rpx; } .history-header { font-size: 26rpx; font-weight: bold; margin: 32rpx 0 26rpx; } .history-item { display: inline-block; padding: 0 26rpx; height: 40rpx; line-height: 40rpx; text-align: center; background: #F7F7F7; border-radius: 20rpx; font-size: 22rpx; margin: 0 20rpx 20rpx 0; } .search-tip { color: #909090; font-size: 22rpx; margin-bottom: 36rpx; margin-top: 34rpx; } .result-item { display: inline-block; width: 318rpx; margin-bottom: 34rpx; } .result-item:nth-child(2n) { margin-left: 22rpx; } .result-item .image { width: 100%; height: 238rpx; margin-bottom: 12rpx; background-repeat: no-repeat; background-position: center center; background-size: cover; } .result-name { font-size: 30rpx; font-weight: bold; line-height: 42rpx; }