// 搜索样式
.jw-search-component{
  width: 100%;
  height: 46px;
  position: relative;
  margin-left: 0;
  border-radius: 23px;
  background: #E7E7E7;
  text-align: left;
  font-size: 13px;
  line-height: 35px;
  &.rounded-rectangle{
    border-radius: 4px;
  }
  .jw-search-component-input{
    margin-left: 46px;
    line-height: 33px;
    width: 80%;
    padding-right: 30px;
    height: 100%;
  }
  .jw-search-component-icon{
    width: 32px;
    color: #999;
    height: 100%;
    display: flex;
    z-index: 22;
    position: absolute;
    align-items: center;
    margin-left: 12px;
    justify-content: center;
    .icon-jw-search{
      display: inline-block;
      background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAAAAXNSR0IArs4c6QAABL1JREFUWAm9mF1oVEcUx7ub3UWJzYdijXYNUogSv0CwfRFCFjQtoWJVTKlZWxJMoj4oldKHVpRGKvHBl9og+TYJWEg0mFAFqRgV9aUVERG0plpKG7VQN/1ITdzNpr8zm3ud3L27yW4uHZg7Z+ac85//nDN7Z+66XkmztLe3z4tGo6/i/qSiomIkTRjTzWVKSYSGhgYv6oDL5dpEW0LNHx8f92kuIeQ76HsZ762pqflJ001LTEoEUHdzc3OQlR8GLd+C+Af9v5k8D7tZuo6xM/Q/q66u/lEfTyYnJNLa2vpGOBw+jfMaAQD8LrWb2peVlXW3rKzshQEsaRodHS2mLxHbArFM2gi2dVVVVQdpx+knLbZESEUAr27qPEAeAXyA1X0zHcC2trY8FnAIn534e/DpzcnJCUL8n2RM4oiQinWk4hJAvumC2E3Q1NRUDI5EVBZzGbwS9k7YzlbG3LqCSOSPjY31TJD4mrBunmolur8u43vZ6/W+BYlfwSumPa7rrfIkIig7qa/hdB6gfbRT5tYKqPcrKysfgvEeY88hU8NCRbYtJhFSshGLIurvOG0HIGrrkeIgC7oJ1icTbnX9/f0eOwiTCCn5UgzcbnctufzTzjjdsYKCgkZ871OXDQwM7LDDUUQaGxtXoFwF86dsMHFytAQCgQgLPCKgRPsDO3BFBALy+5fSl2xnx0zSe3o8nj48w7Jx2SvZVhRFBKW8N6R8G2ucf3IeDbHg6yB7ic466wzGHnldFBg+sBo43Ff4LFzNp2MbEVkkg+yPQV3ptAwBhc+C1Xw6vhERdZLm5ua+0JVOy6RE4bNgNZ+ObxB5LIOhUCiOqW48U5mILJzAUPPpeAYRIyXWo163dUJW+ETGmM/EVETI2fcyQrvB1DgsdHV1+YhIscCSmh+s8EZEeicUCc8Cq2Oq/aGhIXlFZFFv8a76xeqviHBfuIZCzphCzpx3rEZO9MHeLzhEvccOTxHhqB/D4IgYELajOBmRsvNJeYwjZD1OJdRQZmZmvR2AOSFROQGZR5BYzaXmCzvjdMbq6+sLwTwpvrLY8vJyuWjHFZOI3EExlOtdBMcDkLE9nOIQkgx0dHSs5HJ0ExN5k95isV8lMjeJiAF3h0uQ2ScyZDo5nD4WOZ3CQhaMjIxcAGe2+IM7d3h4eG4irLg7qxhC4HMcDwMi+m6fz/cph9bPopuqiA8ktmF3DNkPzjCt3Oql3GaPFAWDwb9i3ZdPWyKiZoNtpukUEMDk1dxM7ZJfmGxu5EmFz4/5XK7exX439U1R4neFsXJeYKfoyu1Pjfn9/rdLS0tHpW+UhETEAPDFkUikFuAP6ao0Av4M+R51kCqfCAvQ+2nlcmWk+jfsDpLqk7RRuX/QXsVuNTZSevg82Sa6WBeChpCshdByvlV24LgJsEI7W3Ty/XuR9mx2dvYpovZct4OMnDM3qEtkHLsGyOwSWcq0iMRMY0/y74dMPkCLaOcw+jQjI2OQyD3gjfmvbmuVSfdSxq7hN190YNRC5pCS5fF/lpaWlrWQ7mdOWYSUPSzgRMoRifnO7ElUN/AGPweK/MsQZTO/b2yumSGn6M0m/o7JPyI18gHnJlVbU4Rw1pwNvJd9cxwi7v8AymzZaXYll68AAAAASUVORK5CYII=);
      background-size: cover;
      background-repeat: no-repeat;
      width: 17px;
      height: 17px;
    }
  }
  .jw-search-component-icon-right{
    position: absolute;
    right: 8px;
    top: 0;
    cursor: pointer;
  }
  .icon-jw-search-clear{
    display: inline-block;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAABB0lEQVQ4T6WSPU6FUBCFzzFALIidO9DSDhpYw6tMoHcF1vZauwJ7IFaugQoqX6k7sDMkmkA8Zsi75BJfjD9TTYbzzRnuDOFFXdfHJC8lbQCc7j49kXyQdFsUxYuT0yVVVZ0DuCN55DdzuaRXABdlWd5bbQYNIlkDONgHebUPSYXBtPEkPTunMAwxjuOK92vmTPKETdNcS7oypQnyPEff9xiGYYbjOEaSJGjbdmlI8sYcHwGcOQsnNNjCIL/RTrc18A3AoT+bwWmaQtI+yKTv34Km6LpuGdtrPoNfRjU3Ayxc7v55GdV/nCiKkGXZjx9ntY4gCDBN02odfm1Zx58P4F8n5+DfHPknLtWzy/XGqGMAAAAASUVORK5CYII=);
    background-size: cover;
    background-repeat: no-repeat;
    width: 14px;
    height: 14px;
  }
}