diff --git a/src/main/resources/templates/department.html b/src/main/resources/templates/department.html
index 0ba7b5b..d62f751 100644
--- a/src/main/resources/templates/department.html
+++ b/src/main/resources/templates/department.html
@@ -1,57 +1,201 @@
 <!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org">
+<html xmlns:th="http://www.thymeleaf.org" lang="en">
 <head>
     <meta charset="UTF-8">
     <title>门诊缴费凭证</title>
+    <style>
+        .bold-text {
+            font-weight: 700;
+        }
+
+        .text-35 {
+            font-size: 35px;
+        }
+
+        .text-30 {
+            font-size: 30px;
+        }
+
+        .center-text {
+            text-align: center;
+        }
+
+        .margin-top-10 {
+            margin-top: 10px;
+        }
+
+        .margin-top-40 {
+            margin-top: 40px;
+        }
+
+        .header-title {
+            font-size: 28px;
+        }
+
+        .header-terminal {
+            font-size: 38px;
+            margin-top: 20px;
+        }
+
+        .header-receipt {
+            font-size: 38px;
+            margin-top: 10px;
+        }
+
+        .divider {
+            text-align: center;
+            font-weight: 700;
+            font-size: 32px;
+        }
+
+        .patient-info {
+            font-size: 35px;
+            margin: 10px 20px;
+        }
+
+        .patient-info .info-item {
+            flex: 1;
+        }
+
+        .patient-info .info-row {
+            display: flex;
+        }
+
+        .payment-info {
+            font-size: 35px;
+            margin: 10px 20px;
+        }
+
+        .payment-info .info-item {
+            flex: 1;
+        }
+
+        .payment-info .info-row {
+            display: flex;
+        }
+
+        .table-container {
+            margin: 10px 20px;
+        }
+
+        .table-container table {
+            width: 100%;
+            table-layout: fixed;
+            border-collapse: collapse;
+        }
+
+
+        .table-container .first-th {
+            width: 300px;
+            text-align: left;
+        }
+
+        .table-container .df-th {
+            width: calc(25% - 5px);
+            text-align: center;
+        }
+
+        .table-container .first-td {
+            text-align: left;
+            width: 300px;
+            word-break: break-all;
+        }
+
+        .table-container .df-td {
+            text-align: center;
+        }
+
+        .terminal-info {
+            margin-left: 20px;
+            font-weight: 700;
+            font-size: 35px;
+        }
+
+        .tips {
+            margin-left: 20px;
+            font-size: 35px;
+            font-weight: 700;
+            margin-top: 20px;
+        }
+    </style>
 </head>
 <body>
-<div style="font-weight: 700;">
-    <div style="text-align: center;margin-top: 40px;">
-        <div><span style="font-size: 28px;">******<span th:text="${registeTerminalName}"></span>******</span></div>
-        <div style="font-size: 38px; margin-top: 20px;"><span th:text="${hospitalName}"></span></div>
-        <div style="font-size: 38px; margin-top: 10px;"><span th:text="${registeType}"></span></div>
+<div class="bold-text">
+    <div class="center-text margin-top-40">
+        <div><span class="header-title">******<span th:text="${hospitalName}"></span>******</span></div>
+        <div class="header-terminal"><span th:text="${registeTerminalName}"></span></div>
+        <div class="header-receipt"><span th:text="${registeType}"></span></div>
     </div>
-    <div style="text-align: center; font-weight: 700;  font-size: 32px;">-----------------------------------------------------------------------------</div>
-    <div style="margin-left: 20px; font-size: 35px; margin-bottom: 10px; display: flex">
-        <div style="flex: 1; margin-top: 10px; ">
-            姓名：<span style="margin-right: 25px;" th:text="${name}"></span><br>
-            性别：<span  style="margin-right: 25px;" th:text="${gender}"></span>
-            年龄：<span  style="margin-right: 25px;" th:text="${age}"></span>
+    <div class="divider">
+        -----------------------------------------------------------------------------
+    </div>
+    <div class="patient-info">
+        <div class="info-row">
+            <div class="info-item">姓名：<span th:text="${name}"></span></div>
+            <div class="info-item">性别：<span th:text="${gender}"></span></div>
+            <div class="info-item">年龄：<span th:text="${age}"></span></div>
         </div>
-        <div th:if="${outpatientNumber}" style="flex: 1; margin-top: 10px; margin-right: 15px;">门诊号：<span th:text="${outpatientNumber}"></span></div>
-        <div th:if="${doctor}" style="flex: 1; margin-top: 10px; margin-right: 15px;">就诊医生：<span th:text="${doctor}"></span></div>
-        <div th:if="${department}" style="flex: 1; margin-top: 10px;">就诊科室：<span th:text="${department}"></span></div>
+        <div class="info-row margin-top-10">
+            <div class="info-item" th:if="${outpatientNumber}">门诊号：<span th:text="${outpatientNumber}"></span></div>
+            <div class="info-item" th:if="${doctor}">就诊医生：<span th:text="${doctor}"></span></div>
+        </div>
+        <div class="margin-top-10" th:if="${department}">就诊科室：<span th:text="${department}"></span></div>
     </div>
-    <div style="text-align: center; font-weight: 700; font-size: 32px;">-----------------------------------------------------------------------------</div>
-    <div style="margin-left: 20px; font-size: 35px; margin-bottom: 20px; ">
-        <div style="margin-top: 20px; ">费用总额：<span style="margin-right: 30px;" th:text="${totalFee}"></span>  个人支付：<span th:text="${personalPayment}"></span></div>
-        <div style="margin-top: 10px;">实收金额：<span style="font-weight: 700;" th:text="${actualReceiptAmount}"></span></div>
-        <div style="margin-top: 10px;">实收金额：<span style="font-weight: 700;" th:text="${actualReceiptAmountChinese}"></span></div>
+    <div class="divider">
+        -----------------------------------------------------------------------------
+    </div>
+    <div class="payment-info">
+        <div class="info-row">
+            <div class="info-item">费用总额：<span th:text="${totalFee}"></span></div>
+            <div class="info-item">个人支付：<span th:text="${personalPayment}"></span></div>
+        </div>
+        <div class="margin-top-10">实收金额：<span th:text="${actualReceiptAmount}"></span></div>
+        <div class="margin-top-10">实收金额：<span th:text="${actualReceiptAmountChinese}"></span></div>
+    </div>
+    <div class="divider">
+        -----------------------------------------------------------------------------
     </div>
-    <div style="text-align: center; font-weight: 700; font-size: 32px;">-----------------------------------------------------------------------------</div>
     <div style="margin-left: 20px; margin-top: 10px; ">
         <table border="0" style="font-size: 30px;">
             <tr style="font-size: 34px; ">
-                <th >项目名称</th>
-                <th >数量</th>
-                <th >单价</th>
-                <th >小计</th>
+                <th>项目名称</th>
+                <th>数量</th>
+                <th>单价</th>
+                <th>小计</th>
             </tr>
             <tr th:each="item : ${items}" style="height: 50px;">
-                <td style=" width: 310px;  word-break: break-all; margin-right: 10px;" th:text="${item.name}"></td>
-                <td style="margin-left: 5px;" th:text="${item.quantity}"></td>
+                <td style=" width: 310px;  word-break: break-all;" th:text="${item.name}"></td>
+                <td th:text="${item.quantity}"></td>
                 <td th:text="${item.unitPrice}"></td>
                 <td th:text="${item.subtotal}"></td>
             </tr>
         </table>
     </div>
-    <div style="text-align: center; font-weight: 700; font-size: 32px;">-----------------------------------------------------------------------------</div>
-    <div style="margin-left: 20px; font-weight: 700; font-size: 35px;">
+    <div class="table-container">
+        <table>
+            <tr class="text-35">
+                <th class="first-th">项目名称</th>
+                <th class="df-th">数量</th>
+                <th class="df-th">单价</th>
+                <th class="df-th">小计</th>
+            </tr>
+            <tr class="text-30" th:each="item : ${items}">
+                <td class="first-td" th:text="${item.name}"></td>
+                <td class="df-td" th:text="${item.quantity}"></td>
+                <td class="df-td" th:text="${item.unitPrice}"></td>
+                <td class="df-td" th:text="${item.subtotal}"></td>
+            </tr>
+        </table>
+    </div>
+    <div class="divider">
+        -----------------------------------------------------------------------------
+    </div>
+    <div class="terminal-info">
         <div>终端编号：<span th:text="${terminalNumber}"></span></div>
         <div>打印时间：<span th:text="${printTime}"></span></div>
     </div>
-    <div style="margin-left: 20px; font-size: 35px; font-weight: 700; margin-top: 20px;">
-        <span style="margin-top: 20px;">温馨提示</span><br>
+    <div class="tips">
+        <span>温馨提示</span><br>
         <span>1.请取走全部凭条、并妥善保管</span><br>
         <span>2.如果对缴费结算存在疑问，请到人工窗口咨询</span>
     </div>
