diff --git a/apps/web/src/components/models/course/detail/CourseSyllabus/SectionItem.tsx b/apps/web/src/components/models/course/detail/CourseSyllabus/SectionItem.tsx
index 95c61db..d2a4fe6 100755
--- a/apps/web/src/components/models/course/detail/CourseSyllabus/SectionItem.tsx
+++ b/apps/web/src/components/models/course/detail/CourseSyllabus/SectionItem.tsx
@@ -7,6 +7,7 @@ import { LectureItem } from "./LectureItem";
 // components/CourseSyllabus/SectionItem.tsx
 interface SectionItemProps {
 	section: SectionDto;
+	index?: number;
 	isExpanded: boolean;
 	onToggle: (sectionId: string) => void;
 	onLectureClick: (lectureId: string) => void;
@@ -14,7 +15,7 @@ interface SectionItemProps {
 }
 
 export const SectionItem = React.forwardRef<HTMLDivElement, SectionItemProps>(
-	({ section, isExpanded, onToggle, onLectureClick }, ref) => (
+	({ section, index, isExpanded, onToggle, onLectureClick }, ref) => (
 		<motion.div
 			ref={ref}
 			initial={{ opacity: 0, y: 20 }}
@@ -26,9 +27,9 @@ export const SectionItem = React.forwardRef<HTMLDivElement, SectionItemProps>(
 				onClick={() => onToggle(section.id)}>
 				<div className="flex items-center gap-4">
 					<span className="text-lg font-medium text-gray-700">
-						第{Math.floor(section.order)}章
+						第{index}章
 					</span>
-					<div>
+					<div className="flex flex-col items-start">
 						<h3 className="text-left font-medium text-gray-900">
 							{section.title}
 						</h3>