diff --git a/src/components/content-detail/QuestionFooter.tsx b/src/components/content-detail/QuestionFooter.tsx
index c69f4f8..5d29fa3 100644
--- a/src/components/content-detail/QuestionFooter.tsx
+++ b/src/components/content-detail/QuestionFooter.tsx
@@ -87,6 +87,8 @@ const QuestionFooterStyle = styled.div`
     display: flex;
     line-height: 24px;
     gap: 20px;
+    margin-top: 30px;
+
     .likes {
       display: flex;
       cursor: pointer;
@@ -125,11 +127,13 @@ const QuestionFooterStyle = styled.div`
   .solvedWrap {
     width: 100%;
     border-radius: 20px;
+    margin-top: 30px;
+
     .solvedStatus {
       padding: 2.5rem 3.5rem;
       display: flex;
       justify-content: space-between;
-      font-size: 1.3rem;
+      font-size: 15px;
 
       .left {
         display: flex;
@@ -137,7 +141,7 @@ const QuestionFooterStyle = styled.div`
         gap: 20px;
 
         .solvedTitle {
-          font-size: 2rem;
+          font-size: 25px;
         }
       }
       .right {
@@ -145,8 +149,8 @@ const QuestionFooterStyle = styled.div`
         align-items: center;
         .solveButton {
           cursor: pointer;
-          border: 1px solid #e6e6e6;
-          font-size: 1.5rem;
+          border: 1px solid #c9ffcf;
+          font-size: 15px;
           height: fit-content;
           padding: 1rem 1.5rem;
           border-radius: 50px;
diff --git a/src/components/content-detail/QuestionHeader.tsx b/src/components/content-detail/QuestionHeader.tsx
index 2c047d1..7878792 100644
--- a/src/components/content-detail/QuestionHeader.tsx
+++ b/src/components/content-detail/QuestionHeader.tsx
@@ -73,6 +73,7 @@ const QuestionHeaderStyle = styled.div`
 
   .title {
     font-size: 30px;
+    margin-bottom: 10px;
   }
   .panel {
     display: flex;
diff --git a/src/components/main-page/QuestionBox.tsx b/src/components/main-page/QuestionBox.tsx
index 664caf0..bf99dcc 100644
--- a/src/components/main-page/QuestionBox.tsx
+++ b/src/components/main-page/QuestionBox.tsx
@@ -1,5 +1,8 @@
+// src/components/QuestionBox.tsx
+
 import { useEffect, useState } from 'react';
 import styled from 'styled-components';
+import { Link } from 'react-router'; // Link import 추가
 import QuestionBody from '../ui/molecules/mainpage-molecule/QuestionBody';
 import QuestionHeader from '../ui/molecules/mainpage-molecule/QuestionHeader';
 import QuestionTag from '../ui/atoms/mainpage-atom/QuesitonTag';
@@ -11,11 +14,23 @@ const QuestionBoxContainer = styled.div`
   display: flex;
   flex-direction: column;
   margin-top: 30px;
-  gap: 30px;
+  gap: 10px;
 `;
 
-const QuestionItem = styled.div`
+// Link를 기반으로 한 styled component로 변경
+const QuestionItem = styled(Link)`
   margin: 10px;
+  text-decoration: none;
+  color: inherit;
+  display: block;
+  padding: 20px;
+  border: 1px solid #ddd;
+  border-radius: 8px;
+  transition: box-shadow 0.3s;
+
+  &:hover {
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+  }
 `;
 
 function QuestionBox() {
@@ -44,7 +59,7 @@ function QuestionBox() {
   return (
     <QuestionBoxContainer>
       {posts.map((post) => (
-        <QuestionItem key={post.id}>
+        <QuestionItem key={post.id} to={`/posts/${post.id}`}>
           <QuestionHeader solved={post.solved} title={post.title} />
           <QuestionBody content={post.content} />
           {post.tags && <QuestionTag tags={post.tags.split(',')} />}