._search{ display: flex; background-color: #ffffff; border-radius: 40rpx; justify-content: space-between; align-items: center; margin: 40rpx; padding: 20rpx 60rpx; box-shadow: 0 4rpx 20rpx 0 #F3F3F3; } ._search .input{ font-size: 24rpx; width: 100%; } .his_show .line{ display: flex; justify-content: space-between; margin: 20rpx 40rpx 20rpx 40rpx; } .his_show .his_item{ display: flex; flex-wrap: wrap; margin: 0 40rpx; } .his_show .his_item .his_keyword{ width: 240rpx; height: 60rpx; background: #F6F6F6; border-radius: 8rpx; margin: 0 20rpx 20rpx 0; text-align: center; line-height: 60rpx; font-size: 24rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } ._item { height: 260rpx; margin: 100rpx 30rpx 100rpx 30rpx; position: relative; background: #FFF9F9; box-shadow: 0 12rpx 8rpx 0 rgba(108, 106, 106, 0); border-radius: 8rpx; display: flex; flex-direction: column; justify-content: space-between; } ._item .shadow { width: 720rpx; height: 212rpx; background: #1C1C1C; border-radius: 8rpx; opacity: 0.19; filter: blur(10px); position: absolute; left: -20rpx; top: 70rpx; z-index: -1; } ._item .img { width: 204rpx; height: 306rpx; border-radius: 16rpx; position: absolute; right: 30rpx; bottom: 20rpx; } ._item ._title { margin: 20rpx 30rpx; font-size: 14px; font-weight: bold; width:392rpx; } ._item ._below { font-size: 24rpx; margin: 0 30rpx; } ._item ._home { font-size: 24rpx; font-weight: bold; margin: 20rpx 30rpx 40rpx 30rpx; display: flex; align-items: center; } .list_item { display: flex; padding: 30rpx 30rpx 20rpx 30rpx; background: #fff; border-radius: 12px 12px 0px 0px; position: relative; } .list_item .img_area{ background: #D8D8D8; width: 204rpx; height: 306rpx; border-radius: 16rpx; position: relative; } .list_item .img_area .img { width: 204rpx; height: 306rpx; border-radius: 16rpx; position: absolute; right: 4rpx; bottom: 4rpx; } .list_item .info { padding: 0 8rpx 0 30rpx; display: flex; flex-direction: column; justify-content: space-between; flex: 1; } .list_item .info .top .title { font-size: 32rpx; font-weight: bold; } .list_item .info .top .area { margin: 20rpx 0; font-size: 24rpx; color: #7B7B7B; } .list_item .info .bottom { display: flex; align-items: center; justify-content: space-between; } .list_item .info .bottom .price { font-size: 44rpx; font-weight: bold; color: #FF1D42; } .list_item .info .bottom ._detail{ font-size: 24rpx; width: 96rpx; height: 42rpx; white-space: nowrap; border-radius: 22rpx; text-align: center; margin: 0; background: linear-gradient(90deg, #FF4284 0%, #FF1D42 100%); color: #fff; line-height: 42rpx; } .suggest{ margin-bottom: 30rpx; } .suggest ._title{ display: flex; align-items: center; font-size: 32rpx; font-weight: bold; color: #181818; padding: 30rpx 30rpx 0 30rpx; background: #fff; } .suggest ._title ._icon{ width: 8rpx; height: 36rpx; background: #FF446B; border-radius: 4rpx; margin: 0 20rpx 0 0; } .suggest .list_item{ padding:30rpx; } .brief{ font-size: 20rpx; color: #FF1D42; line-height: 36rpx; border-radius: 8rpx; border: 2rpx solid #FF1D42; display: inline; padding: 3rpx 10rpx; } .more{ color: #7B7B7B; text-align: center; margin:70rpx 0 40rpx 0; }