diff --git a/packages/common/components/src/api/client.ts b/packages/common/components/src/api/client.ts
index 0226a4f9a..46d5291fd 100644
--- a/packages/common/components/src/api/client.ts
+++ b/packages/common/components/src/api/client.ts
@@ -1,14 +1,17 @@
 import { Client } from "@common/network";
 import { getConfig } from "@common/config";
+import { getCookie } from "../lib";
+
+const siteId = getCookie("site-id-key") ?? "";
 
 const getClientInstance = () => {
   const config = getConfig();
-  const { PROXY_HOST, SITE_ID } = config;
+  const { PROXY_HOST } = config;
   const BASE_URL = `${PROXY_HOST}/server`;
 
   return Client.getInstance({
     baseURL: BASE_URL,
-    siteId: SITE_ID ?? "",
+    siteId,
   });
 };
 
diff --git a/packages/common/components/src/lib/client-ip-guard.tsx b/packages/common/components/src/lib/client-ip-guard.tsx
index e6b30fe81..d1ae1735c 100644
--- a/packages/common/components/src/lib/client-ip-guard.tsx
+++ b/packages/common/components/src/lib/client-ip-guard.tsx
@@ -1,11 +1,11 @@
 import { useEffect, useState } from "react";
 import { useQueryClient } from "@tanstack/react-query";
-import { getConfig } from "@common/config";
 import { getSiteInfo } from "../api/site";
 import { getIpList } from "../api/ip";
 import { ENDPOINT } from "../config";
+import { getCookie } from "../lib";
 
-const { SITE_ID } = getConfig();
+const siteId = getCookie("site-id-key") ?? "";
 
 const ClientIpGuard = ({
   currentPath,
@@ -29,17 +29,17 @@ const ClientIpGuard = ({
 
   useEffect(() => {
     (async () => {
-      if (!SITE_ID || !clientIp) return;
+      if (!siteId || !clientIp) return;
 
       const siteInfo = await queryClient.ensureQueryData({
-        queryKey: [ENDPOINT.CMS_SERVICE.SITES, SITE_ID],
-        queryFn: () => getSiteInfo(SITE_ID),
+        queryKey: [ENDPOINT.CMS_SERVICE.SITES, siteId],
+        queryFn: () => getSiteInfo(siteId),
       });
 
       if (siteInfo.siteKndCd === "O") return;
 
       const { content: ipList } = await getIpList({
-        siteId: SITE_ID,
+        siteId,
         prmYn: "Y",
       });
 
diff --git a/packages/common/components/src/ui/header/index.tsx b/packages/common/components/src/ui/header/index.tsx
index 7d4caad94..1b60b1c74 100644
--- a/packages/common/components/src/ui/header/index.tsx
+++ b/packages/common/components/src/ui/header/index.tsx
@@ -3,7 +3,6 @@ import "./header.css";
 import { useEffect, useCallback } from "react";
 import { useQuery } from "@tanstack/react-query";
 import { images } from "@common/assets";
-import { getConfig } from "@common/config";
 import { ENDPOINT } from "../../config";
 import { setCookie, getCookie } from "../../lib";
 import {
@@ -22,7 +21,7 @@ import {
 import { Button } from "../button";
 import { SidebarTrigger } from "../sidebar";
 
-const { SITE_ID } = getConfig();
+const siteId = getCookie("site-id-key") ?? "";
 
 export function Header({ viewOnly }: { viewOnly?: boolean }) {
   const { data: userInfo } = useQuery({
@@ -32,8 +31,8 @@ export function Header({ viewOnly }: { viewOnly?: boolean }) {
   });
 
   const { data: siteInfo } = useQuery({
-    queryKey: [ENDPOINT.CMS_SERVICE.SITES, SITE_ID],
-    queryFn: () => getSiteInfo(SITE_ID ?? ""),
+    queryKey: [ENDPOINT.CMS_SERVICE.SITES, siteId],
+    queryFn: () => getSiteInfo(siteId),
     select: (data) => {
       if (data.siteSkn) {
         const siteSkin = data.siteSkn.toLowerCase();