diff --git a/client/src/comp/SearchResult.js b/client/src/comp/SearchResult.js
index 10f89ab..8084fc5 100644
--- a/client/src/comp/SearchResult.js
+++ b/client/src/comp/SearchResult.js
@@ -1,65 +1,103 @@
 import React from "react";
 import styled from "styled-components";
-import empty from "../empty.png"
+import empty from "../empty.png";
 
-function SearchResult({data}){
-    // let result = data.sort((a,b)=>a.thumbsup-b.thumbsup).reverse().slice(0,3)
-    let result = []
-    const ResultList = styled.ul`
-        margin-top:20px;
-        width:75%;
-        margin: 0 auto;
-        display:flex;
-        flex-direction:column;
-        li{
-            display:flex;
-            height:8vh;
-            margin-top:2vh;
-            border:2px solid #000;
-            border-radius:40px;
-            text-align:center;
-            line-height:8vh;
-            background-color:#ffff8d;
-            p{
-                flex:1 1 auto
-            }
-            p:nth-child(2){
-                flex: 3 1 auto
-            }
-        }
-        li:nth-child(1){
-            margin-top:0px;
-        }
-    `
-    const EmptyResult = styled.div`
-        text-align:center;
-        > img{
-            width:20vh;
-            height:20vh;
-        }
-    `
-    return(
-        <>
-        {result.length===0? 
-            <EmptyResult>
-                <img src={empty} alt="empty"/>
-                <p>검색 결과가 없습니다.</p>
-            </EmptyResult>
-            :
-            <ResultList>
-                {result.map((ele,idx)=>{
-                    return (
-                        <li key={idx}>
-                            <p>{ele.wordName}</p>
-                            <p>{ele.wordMean}</p>
-                            <p>{ele.thumbsup}</p>
-                        </li>
-                    )
-                })}
-            </ResultList>
-        }
-        </>
-    )
+function SearchResult({ data }) {
+  let result = data
+    .sort((a, b) => a.thumbsup - b.thumbsup)
+    .reverse()
+    .slice(0, 3);
+  //let result = [];
+  const ResultList = styled.ul`
+    margin-top: 20px;
+    width: 75%;
+    margin: 0 auto;
+    display: flex;
+    flex-direction: column;
+    li {
+      display: flex;
+      height: 8vh;
+      margin-top: 2vh;
+      border: 2px solid #000;
+      border-radius: 40px;
+      text-align: center;
+      line-height: 8vh;
+      background-color: #ffff8d;
+      p {
+        flex: 1 1 auto;
+      }
+      p:nth-child(2) {
+        flex: 3 1 auto;
+      }
+    }
+    li:nth-child(1) {
+      margin-top: 0px;
+    }
+  `;
+  const EmptyResult = styled.div`
+    text-align: center;
+    > img {
+      width: 20vh;
+      height: 20vh;
+    }
+  `;
+  const BtnWrap = styled.div`
+    width: 30%;
+    margin: 3% auto;
+  `;
+  const NewMoreBtn = styled.button`
+    width: 15vh;
+    height: 5vh;
+    border-radius: 5vh;
+    border: 2px solid black;
+    background-color: black;
+    color: white;
+    margin-left: 10%;
+    font-size: 0.8rem;
+    transition: 0.2s;
+    :hover {
+      background-color: white;
+      color: black;
+      cursor: pointer;
+    }
+  `;
+
+  return (
+    <>
+      {result.length === 0 ? (
+        <div>
+          <EmptyResult>
+            <img src={empty} alt="empty" />
+            <p>검색 결과가 없습니다.</p>
+          </EmptyResult>
+
+          <BtnWrap>
+            <NewMoreBtn>새로 만들기</NewMoreBtn>
+            <NewMoreBtn>더보기</NewMoreBtn>
+          </BtnWrap>
+        </div>
+      ) : (
+        <div>
+          <ResultList>
+            {result.map((ele, idx) => {
+              return (
+                <li key={idx}>
+                  <p>{ele.wordName}</p>
+                  <p>{ele.wordMean}</p>
+                  <p>{ele.thumbsup}</p>
+                </li>
+              );
+            })}
+          </ResultList>
+
+          <BtnWrap>
+            <NewMoreBtn>새로 만들기</NewMoreBtn>
+            <NewMoreBtn>더보기</NewMoreBtn>
+          </BtnWrap>
+        </div>
+      )}
+    </>
+  );
 }
 
-export default SearchResult;
\ No newline at end of file
+export default SearchResult;
diff --git a/client/src/pages/Search.js b/client/src/pages/Search.js
index f549dfd..68b4773 100644
--- a/client/src/pages/Search.js
+++ b/client/src/pages/Search.js
@@ -1,14 +1,14 @@
-import SearchInput from "../comp/SearchInput"
-import SearchResult from "../comp/SearchResult"
+import SearchInput from "../comp/SearchInput";
+import SearchResult from "../comp/SearchResult";
 import dummyData from "../dummy/dummyData";
 
-function Search (){
-    return(
-        <section>
-            <SearchInput />
-            <SearchResult data={dummyData.word}/>
-        </section>
-    )
+function Search() {
+  return (
+    <section>
+      <SearchInput />
+      <SearchResult data={dummyData.word} />
+    </section>
+  );
 }
 
-export default Search;
\ No newline at end of file
+export default Search;