search

@@ -11,22 +11,20 @@
             </form>
         </div>
         <ul class="search-associate"></ul>
-        <div class="search-items">
-            {{#if hotTerms}}
-            <div class="hot-search-new search-group clearfix">
+        {{#if hotTerms}}
+            <div class="hot-search-new clearfix">
                
-                <div class="search-content new-hot">
-                    <ul class="hot-content">
-                        <li class="hot-title">热搜</li>
-                        {{# hotTerms}}
-                            <li class="hot-term">
-                                <a href='javascript:void(0);'>{{content}}</a>
-                            </li>
-                        {{/ hotTerms}}
-                    </ul>
+                <div class="new-hot">
+                    <div class="hot-title hot-term">热搜</div>
+                    {{# hotTerms}}
+                        <div class="hot-term">
+                            <a href='javascript:void(0);'>{{content}}</a>
+                        </div>
+                    {{/ hotTerms}}
                 </div>
             </div>
-            {{/if}}
+        {{/if}}
+        <div class="search-items">
             <div class="search-index">
                 <div class="search-group history-search hide">
                     <div class="search-content-title">

@@ -182,9 +182,6 @@ $('.search-items .search-group').on('click', 'li', function(event) {
     if ($(this).parents('.search-group').hasClass('history-search')) {
         POS_ID = 1;
         FLR_INDEX = 1;
-    } else if ($(this).parents('.search-group').hasClass('hot-search-new')) {
-        POS_ID = 2;
-        FLR_INDEX = 2;
     } else {
         var PRD_NUM = $(this).index() + 1;
 
@@ -209,6 +206,34 @@ $('.search-items .search-group').on('click', 'li', function(event) {
     goSearch(query);
 });
 
+$('.hot-term').on('click', function(event) {
+    var Hotquery = '',
+        POS_ID = 2,
+        FLR_INDEX = 2;
+
+    if (event.target.nodeName === 'A') {
+        Hotquery = $(event.target).html();
+    }
+
+    if (event.target.nodeName === 'DIV') {
+        Hotquery = $(event.target).find('a').html();
+    }
+
+    if (window._yas && window._yas.sendCustomInfo) {
+        window._yas.sendCustomInfo({
+            op: 'YB_KEYWORD_SEARCH_C',
+            param: JSON.stringify({
+                C_ID: C_ID,
+                KEYWORD: Hotquery,
+                POS_ID: POS_ID,
+                FLR_INDEX: FLR_INDEX
+            })
+        }, true);
+    }
+
+    goSearch(Hotquery);
+})
+
 inputAction();
 
 cHammer = new Hammer($clear[0]);

@@ -46,22 +46,64 @@
         }
     }
 
+    .hot-search-new {
+        white-space: nowrap;
+        width: 100%;
+        overflow-x: auto;
+        /*background: #f0f0f0;*/
+        border-bottom: 1px solid #e0e0e0;
+
+        .new-hot {
+            background: #fff;
+            padding: 25px 0 0 30px;
+        }
+
+        .hot-term {
+            display: inline-block;
+            height: 68px;
+            line-height: 70px;
+            padding: 0 20px;
+            font-size: 28px;
+            color: #000;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            border-radius: 0.2rem;
+            border: 1PX solid #e0e0e0;
+            background: #fff;
+            font-size: 0.7rem;
+            width: auto;
+            margin-right: 15px;
+        }
+
+        .hot-title {
+            font-size: 34px;
+            color: #000;
+            border: none;
+            padding: 0;
+        }
+
+    }
+
     .search-items {
+        background: #f0f0f0;
+        padding-top: 30px;
+
         h3 {
             font-size: 24px;
             margin-bottom: 20px;
         }
 
         li {
-            margin-right: 8px;
-            /*margin-bottom: 5px;*/
+            margin-right: 15px;
+            margin-bottom: 15px;
             max-width: 100%;
             overflow: hidden;
             display: inline-block;
         }
 
         a {
-            display: inline-block;
+            float: left;
             height: 68px;
             line-height: 70px;
             padding: 0 20px;
@@ -77,6 +119,7 @@
             border-top: 1px solid #e0e0e0;
             background: #fff;
             padding: 30px;
+            /*margin-top: 30px;*/
         }
 
         .clear-icon {
@@ -107,42 +150,6 @@
             }
         }
 
-        .hot-search-new {
-            background: #f0f0f0;
-            padding-bottom: 30px;
-
-            .new-hot {
-                background: #fff;
-                padding-bottom: 30px;
-                border-bottom: 1px solid #e0e0e0;
-            }
-
-            .search-content {
-                padding-bottom: 0;
-            }
-
-            .hot-title {
-                font-size: 34px;
-                color: #000;
-                line-height: 76px;
-                height: 80px;
-                padding-left: 30px;
-                text-align: center;
-                display: inline-block;
-            }
-
-            .hot-term {
-                padding-top: 27px;
-            }
-
-            .hot-content {
-                width: 100%;
-                overflow-x: auto;
-                overflow-y: hidden;
-                white-space: nowrap;
-                height: 130px;
-            }
-        }
 
         .search-content-title {
             height: 40px;