1:1 문의 목록 추가

src/app/inquirylist/page.tsx

@@ -0,0 +1,20 @@
+import InquiryForm from "@/components/inquiry/inquirylist/InquiryForm";
+import InquiryTable from "@/components/inquiry/inquirylist/InquiryTable";
+import Footer from "@/components/layouts/Footer";
+import Header from "@/components/layouts/Header";
+
+export default function InquiryListPage (){
+  return(
+    <div className="wrap">
+      <Header name={"1:1お問い合わせ"} backBtn={true}/>
+      <div className="container">
+        <div className="sale-contents">
+          <InquiryForm/>
+          <InquiryTable/>
+        </div>
+      </div>
+      <Footer/>
+      <button className="top-btn"></button>
+    </div>
+  )
+}

src/components/PublishList/PublishList.tsx

@@ -131,6 +131,18 @@ export default function PublishList (){
                     </td>
                     <td className='c red'>2025/04/29</td>
                   </tr>
+                  <tr>
+                    <td rowSpan={3}>1:1 문의</td>
+                    <td>1:1 문의 목록</td>
+                    <td>
+                      <Link href={'inquirylist'}>InquiryListPage.tsx</Link>
+                    </td>
+                    <td className='c'>
+                    </td>
+                    <td className='c'>
+                    </td>
+                    <td className='c red'>2025/04/30</td>
+                  </tr>
                 </tbody>
               </table>
             </div>

src/components/inquiry/inquirylist/InquiryForm.tsx

@@ -0,0 +1,15 @@
+export default function InquiryForm(){
+  return(
+    <div className="sale-frame">
+      <div className="sale-form-bx">
+        <button className="btn-frame n-blue icon">お問い合わせ<i className="btn-arr"></i></button>
+      </div>
+      <div className="sale-form-bx">
+        <div className="search-input">
+          <input type="text" className="search-frame" placeholder="タイトルを入力してください. (2文字以上)"/>
+          <button className="search-icon"></button>
+        </div>
+      </div>
+    </div>
+  )
+}

src/components/inquiry/inquirylist/InquiryTable.tsx

@@ -0,0 +1,63 @@
+export default function InquiryTable(){
+  return(
+    <div className="sale-frame">
+      <div className="inquiry-table-filter">
+        <div className="filter-check">
+          <div className="check-form-box">
+            <input type="checkbox" id="ch01"/>
+            <label htmlFor="ch01">私が書いたお問い合わせ</label>
+          </div>
+        </div>
+        <div className="filter-select">
+          <select className="select-form" name="" id="">
+            <option value="">全体</option>
+            <option value="">全体</option>
+            <option value="">全体</option>
+            <option value="">全体</option>
+            <option value="">全体</option>
+          </select>
+        </div>
+      </div>
+      <div className="inquiry-list-wrap">
+        <div className="inquiry-list-tit">合計 <span>98</span>個</div>
+        <ul className="inquiry-list">
+          <li className="inquiry-item">
+            <div className="inquiry-item-bx">
+              <div className="inquiry-item-category">屋根</div>
+              <div className="inquiry-item-tit">屋根材適合性確認依頼</div>
+              <div className="inquiry-item-date">2025.04.02</div>
+              <div className="inquiry-badge badge blue">回答待ち</div>
+            </div>
+          </li>
+          <li className="inquiry-item">
+            <div className="inquiry-item-bx">
+              <div className="inquiry-item-category">設計</div>
+              <div className="inquiry-item-tit">設置可能ですか？</div>
+              <div className="inquiry-item-date">2025.04.02</div>
+              <div className="inquiry-badge badge orange">回答完了</div>
+            </div>
+          </li>
+          <li className="inquiry-item">
+            <div className="inquiry-item-bx">
+              <div className="inquiry-item-category">屋根</div>
+              <div className="inquiry-item-tit">屋根材適合性確認依頼屋根材適合性確認依頼屋根材適合性確認依頼屋根材適合性確認依頼</div>
+              <div className="inquiry-item-date">2025.04.02</div>
+              <div className="inquiry-badge badge blue">回答待ち</div>
+            </div>
+          </li>
+          <li className="inquiry-item">
+            <div className="inquiry-item-bx">
+              <div className="inquiry-item-category">設計</div>
+              <div className="inquiry-item-tit">設置可能ですか？</div>
+              <div className="inquiry-item-date">2025.04.02</div>
+              <div className="inquiry-badge badge orange">回答完了</div>
+            </div>
+          </li>
+        </ul>
+        <div className="sale-edit-btn">
+          <button className="btn-frame n-blue icon">もっと見る<i className="btn-edit"></i></button>
+        </div>
+      </div>
+    </div>
+  )
+}

src/styles/components/_sub.scss

@@ -144,6 +144,7 @@
   }
   .sale-item-tit{
     @include defaultFont($font-s-15, $font-w-500, $font-c);
+    @include ellipsis(1);
     margin-bottom: 9px;
   }
   .sale-item-customer{
@@ -258,4 +259,74 @@
       @include defaultFont($font-s-13, $font-w-400, $font-c);
     }
   }
+}
+
+// 1:1 문의 목록
+.inquiry-table-filter{
+  margin-bottom: 24px;
+  .filter-check{
+    margin-bottom: 12px;
+  }
+}
+.inquiry-list-tit{
+  padding-bottom: 10px;
+  border-bottom: 1px solid #2E3A59;
+  @include defaultFont($font-s-13, $font-w-400, $font-c);
+  span{
+    font-weight: $font-w-500;
+  }
+}
+.badge{
+  min-width: 60px;
+  height: 30px;
+  line-height: 30px;
+  padding: 0 8px;
+  border-radius: 60px;
+  text-align: center;
+  font-size: $font-s-12;
+  font-weight: $font-w-500;
+  &.blue{
+    color: #5497E9;
+    background-color: #ECF5FF;
+  }
+  &.orange{
+    color: #F86A56;
+    background-color: #FFEFED;
+  }
+  &.block{
+    width: 100%;
+    
+  }
+}
+.inquiry-list{
+  .inquiry-item{
+    padding: 10px 0;
+    cursor: pointer;
+    border-bottom: 1px solid #ECECEC;
+    &:last-child{
+      border-bottom: none;
+      padding-bottom: 0;
+    }
+    .inquiry-item-bx{
+      position: relative;
+      padding-right: 70px;
+      .inquiry-item-category{
+        @include defaultFont($font-s-13, $font-w-400, $font-c);
+        margin-bottom: 5px;
+      }
+      .inquiry-item-tit{
+        @include defaultFont($font-s-15, $font-w-500, $font-c);
+        @include ellipsis(1);
+        margin-bottom: 5px;
+      }
+      .inquiry-item-date{
+        @include defaultFont($font-s-13, $font-w-400, #A2ABB8);
+      }
+      .inquiry-badge{
+        position: absolute;
+        top: 0;
+        right: 0;
+      }
+    }
+  }
 }