@import "../../assets/stylus/colorConfig"
.top_head{
    width 100%
    height 4.7rem
    padding .99rem 1.25rem
    box-sizing border-box
    background #fff
    text-align left
    .input_wrap{
      height 2.98rem;
      line-height 2.98rem
      .cancel{
        margin-left .8rem
        font-size .875rem
        color contentColor
      }
      .icon-sousuo{
        position absolute
        left 2rem
        font-size 1.1rem
        color subheadColor
      }
      input{
        padding-left 2.2rem
        background #fff
        background-size 1.1rem
        border 1px solid rgba(255, 255, 255, 0.3)
        border-radius 6px
        box-shadow: 0px 0px 20px 0px rgba(150,149,150,0.33)
        color mainTitleColor
      }

      ::-webkit-input-placeholder {
        color #b6b6b6
      }
      :-moz-placeholder {
        color #b6b6b6
      }
      ::-moz-placeholder {
        color #b6b6b6
      }
      :-ms-input-placeholder {
        color #b6b6b6
      }
    }
}
.search_nav{
  margin 1rem 0rem 0
  .nav-item{
    width 50%
    text-align center
    box-sizing border-box
    span{
      position relative
      display inline-block
      min-width 7rem
      padding-bottom .5rem
      color subheadColor
      transition all .3s
      &:after{
        content ''
        position absolute
        width 0px
        height 2px
        bottom -2px
        background red
        left 50%
        transform translateX(-50%)
        transition all .2s
      }
    }
    &.active{
      span{
        color mainColor
        &:after{
          width 100%
          background mainColor
        }
      }
    }
  }
}
.search-content{
  width 100%
  height calc(100vh - 6.7rem)
  overflow-y auto
  -webkit-overflow-scrolling touch
}
.content{
  padding 0 1.25rem
  box-sizing border-box
  .search_box{
    position absolute
    height 0
    width 100%
    line-height 4rem
    box-sizing border-box
    margin-left 0
    opacity 0
    span{
      margin-right .825rem
      margin-bottom .5rem
    }
    &.showIn{
      margin-left 0
      height 4rem
      opacity 1
      z-index 1
    }

  }
  .history_box{
    position relative
    width 100%
    height 0
    left -200%
    box-sizing border-box
    opacity 0
    &.showIn{
      height auto
      margin-top 1.45rem
      left 0
      opacity 1
    }
    .title{
      margin-bottom .65rem
      font-weight bold
      font-size .95rem
      color subheadColor
    }
    ul{
      &.history_list{
        padding-bottom .75rem
        margin-bottom 1.6rem
        li{
          width 5rem
          background #eeeeee
          text-align left
          margin-right .875rem
        }
      }
      li{
        min-width 3.2rem
        width 31.3%
        height 2.1rem
        line-height 2.1rem
        margin 0 1% .75rem
        padding 0 .675rem
        box-sizing border-box
        background activeBg
        border-radius 3px
        font-size .9rem
        color mainTitleColor
        text-align center
        white-space nowrap
        text-overflow ellipsis
        overflow hidden
        i{
          float right
          color contentColor
          font-size 12px
        }
      }
    }
  }
}
.search-result{
  width 100%
  height calc(100vh - 4.62rem)
  overflow-y auto
  -webkit-overflow-scrolling touch
}
.item_wrap{
  height 4rem;
  line-height 4rem
  padding 0
  font-size .875rem
  &.nodata{
    color subheadColor
  }
  p{
    line-height 4rem
  }
  .position{
    margin-right .5rem
    font-size 1rem
    i{
      position relative
      top .2rem
      zoom 1.3
      margin-right .3rem
      color mainColor
    }
  }
}