finecarmini/module/search/search.wxss

/***********search************/

.content{
  
}
.search_space{  
  height: 78rpx;
}
.search{
  display: block;
  height: 78rpx;
  background: #fede18;
  width:100%;
  position: fixed;
  z-index: 10;
}
.search_input_b{
  position: absolute;
  height: 52rpx;
  width:600rpx;
  top:13rpx;
  left:75rpx;
  background: white;
  border-radius: 10rpx;
  transition:all 0.5s;
}
.search_input_ani{
  position: absolute;
  top:13rpx;
  left:315rpx;
  display: flex;
  align-items:center;
  transition:all 0.5s;
}
.search_input_ic{
  width:22rpx;
  height:22rpx;
}
.search_input_holder{
  margin-left:10rpx;
  width:500rpx;
  line-height: 52rpx;
  font-size: 24rpx;
  font-family: PingFangSC-Regular,NotoSansHans-DemiLight;  
}
.search_input_holderw{
  color: rgba(183, 183, 183, 1); 
}
.search_input_keys{
  margin-left:-230rpx;
  height: 50px;
}
.key_list_i{
  display: flex;
  border:1rpx solid #B7B7B7;
  border-radius: 4rpx;
  padding:0rpx 10rpx;
  line-height: 38rpx;
  height: 38rpx;
  color:#B7B7B7;
  margin-top:6rpx;
  margin-right: 10rpx;
}
.key_list_iw{  
  max-width:100rpx;
  overflow: hidden;
  white-space: nowrap;
  text-overflow:ellipsis;
}
.key_list_d{
  font-size: 10rpx;
  display: inline-block;
  padding-left:10rpx;
}
.key_list_d image{
  width:15rpx;
  height: 15rpx;
  vertical-align: middle;
}
.search_input{
  margin-left:10rpx;
  width:500rpx;
  line-height: 52rpx;
  font-size: 24rpx;
  font-family: PingFangSC-Regular,NotoSansHans-DemiLight;
}
.search_input_holder{
  color: rgba(183, 183, 183, 1);
}
.cancel_search{
  margin-left:50rpx;
  top:13rpx;
  height: 52rpx;
  line-height: 52rpx;
  color: rgba(56, 55, 53, 1);
  font-size: 26rpx;
  font-family: PingFangSC-Regular,NotoSansHans-DemiLight;
}
.input_supernatant{  
  position: absolute;
  top: 13rpx;
  height: 52rpx;
  width: 100%;
  background: rgba(235, 235, 235, 0);
  z-index: 1;
}
.inputbind_focus{
  height: 52rpx;
  width:600rpx;
  margin-left:75rpx;
}
/*************hotsearch**************/
.hot_search{
  position: absolute;
  top:78rpx;
  left: 100%;
  width:100%;
  padding-top: 20px;
  background:white;
  transition:all 0.5s;
}
.hot_search_t{
  text-indent: 38rpx;
  height: 33rpx;
  line-height: 33rpx;
  color: rgba(56, 55, 53, 1);
  font-size: 22rpx;
}
.hot_search_w{
  width:702rpx;
  margin-left:18rpx;
  display: flex;
  flex-wrap:wrap;
}
.hot_search_i{
  display: block;
/*  width:142rpx;*/
  padding:0rpx 25rpx;
  height: 52rpx;
  margin-top:30rpx;
  margin-left:28rpx;
  border-radius: 6rpx;
  border: 1px solid rgba(235, 235, 235, 1);
  line-height: 52rpx;
  color: rgba(56, 55, 53, 1);
  font-size: 24rpx;
  text-align: center;
  font-family: PingFangSC-Regular,NotoSansHans-Regular;
}

/*******focus*******/


.search_focus .search_input_b{
  left:38rpx;
}
.search_focus .search_input_ani{
  left:75rpx;
}
.search_focus .hot_search{
  left:0rpx;
}