diff --git a/src/app/[locale]/(protected)/quality/qms/components/InspectionModal.tsx b/src/app/[locale]/(protected)/quality/qms/components/InspectionModal.tsx
index bea4d737..068b4495 100644
--- a/src/app/[locale]/(protected)/quality/qms/components/InspectionModal.tsx
+++ b/src/app/[locale]/(protected)/quality/qms/components/InspectionModal.tsx
@@ -25,6 +25,8 @@ import type { ShipmentDetail } from '@/components/outbound/ShipmentManagement/ty
 
 // 수주서 문서 컴포넌트 import
 import { SalesOrderDocument } from '@/components/orders/documents/SalesOrderDocument';
+import { getOrderDocumentDetail } from '@/components/orders/actions';
+import type { OrderDocumentDetail } from '@/components/outbound/ShipmentManagement/documents/ShipmentOrderDocument';
 
 // 품질검사 문서 컴포넌트 import
 import {
@@ -199,8 +201,7 @@ type DocumentDetailData = Record<string, any>;
 
 /**
  * API 출고 상세 응답 → ShipmentDetail 타입 매핑
- * ShipmentOrderDocument 내부에서 아직 MOCK_ 데이터를 사용하므로
- * 여기서는 헤더 정보 매핑만 수행 (Phase 2에서 완전 전환)
+ * 헤더 정보 매핑 (BOM 데이터는 orderDetail props로 별도 전달)
  */
 function mapShipmentApiToDetail(api: DocumentDetailData): ShipmentDetail {
   return {
@@ -301,6 +302,9 @@ export const InspectionModal = ({
   const [docDetailData, setDocDetailData] = useState<DocumentDetailData | null>(null);
   const [isLoadingDocDetail, setIsLoadingDocDetail] = useState(false);
 
+  // 출고증/납품확인서용 수주 BOM 데이터 (orderDetail)
+  const [shipmentOrderDetail, setShipmentOrderDetail] = useState<OrderDocumentDetail | null>(null);
+
   // 수주서/출고증/납품확인서 데이터 로드
   useEffect(() => {
     if (!isOpen || !doc) return;
@@ -310,17 +314,36 @@ export const InspectionModal = ({
     if (!docItemId) return;
 
     setIsLoadingDocDetail(true);
+    setShipmentOrderDetail(null);
+
     getDocumentDetail(doc.type, docItemId)
-      .then((result) => {
+      .then(async (result) => {
         if (result.success && result.data) {
           const raw = result.data as DocumentDetailData;
-          setDocDetailData(raw?.data ?? raw);
+          const detailData = raw?.data ?? raw;
+          setDocDetailData(detailData);
+
+          // 출고증/납품확인서: 수주 BOM 데이터 추가 로드
+          if (['confirmation', 'shipping'].includes(doc.type) && detailData) {
+            // shipment API 응답에서 order_id를 찾아 BOM 조회
+            const shipmentData = detailData as DocumentDetailData;
+            const orderId = shipmentData.order_id;
+            if (orderId) {
+              const bomResult = await getOrderDocumentDetail(String(orderId));
+              if (bomResult.success && bomResult.data) {
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                const bomRaw = bomResult.data as Record<string, any>;
+                setShipmentOrderDetail((bomRaw?.data ?? bomRaw) as OrderDocumentDetail);
+              }
+            }
+          }
         }
       })
       .finally(() => setIsLoadingDocDetail(false));
 
     return () => {
       setDocDetailData(null);
+      setShipmentOrderDetail(null);
     };
   }, [isOpen, doc?.type, doc?.id, documentItem?.id]);
 
@@ -474,11 +497,9 @@ export const InspectionModal = ({
       case 'shipping':
         if (isLoadingDocDetail) return <LoadingDocument />;
         if (!docDetailData) return <ErrorDocument message="출고 데이터를 불러올 수 없습니다." />;
-        // TODO Phase 2: ShipmentOrderDocument도 실 데이터로 전환 시 여기서 매핑
-        // 현재는 ShipmentOrderDocument 내부 mock data를 사용하되 헤더 정보만 전달
         return doc.type === 'confirmation'
-          ? <DeliveryConfirmation data={mapShipmentApiToDetail(docDetailData)} />
-          : <ShippingSlip data={mapShipmentApiToDetail(docDetailData)} />;
+          ? <DeliveryConfirmation data={mapShipmentApiToDetail(docDetailData)} orderDetail={shipmentOrderDetail} />
+          : <ShippingSlip data={mapShipmentApiToDetail(docDetailData)} orderDetail={shipmentOrderDetail} />;
       case 'import':
         return renderImportInspectionDocument();
       case 'quality':