フォームを横に並べた時に高さが合わない

途中で面倒になったので中途半端ですが、食べログの検索窓のエッセンスを取り出しました。加えて、食べログでは、ボタンは position: absolute で絶対配置してたり、select に矢印を :after 疑似セレクタで設定していたりします。

<form class="search-form">
    <div class="input-wrap search-keyword">
        <input type="text" name="keyword" class="input-search-keyword" placeholder="キーワード">
    </div>

    <div class="input-wrap search-area">
        <select name="area" class="input-search-area">
            <option value="all" selected >すべての地域</option>
            <option value="11">あああ</option>
            <option value="12">いいい</option>
            <option value="13">ううう</option>
        </select>
    </div>

    <div class="input-wrap search-category">
        <select name="category" class="input-search-category">
            <option value="all" selected class="na">すべてのカテゴリー</option>
            <option value="11">あああ</option>
            <option value="12">いいい</option>
            <option value="13">ううう</option>
        </select>
    </div>

    <div class="input-wrap search-button">
        <input type="submit" value="検索" class="input-search-button">
    </div>
</form>

body {
  background: red;
  width: 100%;
}

body, div, input, select {
  margin: 0;
  padding: 0;
  border: 0;
}

.search-form {
  background: #fff;
  position: relative;
  overflow: hidden;
  vertical-align: middle;
}

.input-wrap {
  display: block;
  position: relative;
  float: left;
}

.input-wrap.search-keyword {
  width: 20%;
}

.input-search-keyword {
  width: 100%;
  height: 54px;
  padding-left: 5%;
}

.input-wrap.search-area {
  width: 30%;
}

.input-search-area {
  width: 100%;
  height: 54px;
  padding-left: 5%;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
}

.input-wrap.search-category {
  width: 30%;
}

.input-search-category {
  width: 100%;
  height: 54px;
  padding-left: 5%;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
}

.input-wrap.search-button {
  width: 20%;
}

.input-search-button {
  width: 100%;
  height: 54px;
  background: #ffc12a;
  cursor: pointer;
}