diff --git a/apps/cs/src/pages/groups/api/group-users-service.ts b/apps/cs/src/pages/groups/api/group-users-service.ts
new file mode 100644
index 000000000..69a81e366
--- /dev/null
+++ b/apps/cs/src/pages/groups/api/group-users-service.ts
@@ -0,0 +1,69 @@
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+import type {
+  GroupUserService,
+  GroupUserSearchParams,
+  GroupUserList,
+  GroupUserDetailResponse,
+  GroupUserSaveData,
+  GroupUserUpdateData,
+} from "../model/group-users-interface";
+
+export class GroupUsersApiService implements GroupUserService {
+  // 그룹 사용자 목록 조회
+  public async findPageGroupUser(
+    params: GroupUserSearchParams,
+  ): Promise<GroupUserList> {
+    const response = await client.get<GroupUserList>(
+      `${ENDPOINT.CMS_SERVICE.GROUP_USERS}`,
+      { params },
+    );
+    return response.data;
+  }
+
+  // 그룹 사용자 단건 조회
+  public async findByGroupAndUserId(
+    grpSn: number,
+    userUnqId: string,
+  ): Promise<GroupUserDetailResponse> {
+    const response = await client.get<GroupUserDetailResponse>(
+      `${ENDPOINT.CMS_SERVICE.GROUP_USERS}/${grpSn}/${userUnqId}`,
+    );
+    return response.data;
+  }
+
+  // 그룹 사용자 저장
+  public async saveGroupUser(
+    data: GroupUserSaveData,
+  ): Promise<GroupUserDetailResponse> {
+    const response = await client.post<GroupUserDetailResponse>(
+      `${ENDPOINT.CMS_SERVICE.GROUP_USERS}`,
+      data,
+    );
+    return response.data;
+  }
+
+  // 그룹 사용자 수정
+  public async updateGroupUser(
+    grpSn: number,
+    userUnqId: string,
+    data: GroupUserUpdateData,
+  ): Promise<GroupUserDetailResponse> {
+    const response = await client.put<GroupUserDetailResponse>(
+      `${ENDPOINT.CMS_SERVICE.GROUP_USERS}/${grpSn}/${userUnqId}`,
+      data,
+    );
+    return response.data;
+  }
+
+  // 그룹 사용자 삭제
+  public async deleteGroupUser(
+    grpSn: number,
+    userUnqId: string,
+  ): Promise<boolean> {
+    const response = await client.delete<boolean>(
+      `${ENDPOINT.CMS_SERVICE.GROUP_USERS}/${grpSn}/${userUnqId}`,
+    );
+    return response.data;
+  }
+}
diff --git a/apps/cs/src/pages/groups/api/groups-service.ts b/apps/cs/src/pages/groups/api/groups-service.ts
new file mode 100644
index 000000000..2b570c3cb
--- /dev/null
+++ b/apps/cs/src/pages/groups/api/groups-service.ts
@@ -0,0 +1,58 @@
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+import type {
+  GroupService,
+  GroupSearchParams,
+  GroupList,
+  GroupDetailResponse,
+  GroupSaveData,
+  GroupUpdateData,
+} from "../model/groups-interface";
+
+export class GroupsApiService implements GroupService {
+  // 그룹 목록 조회
+  public async findPageGroup(params: GroupSearchParams): Promise<GroupList> {
+    const response = await client.get<GroupList>(
+      `${ENDPOINT.CMS_SERVICE.GROUPS}`,
+      { params },
+    );
+    return response.data;
+  }
+
+  // 그룹 단건 조회
+  public async findById(id: number): Promise<GroupDetailResponse> {
+    const response = await client.get<GroupDetailResponse>(
+      `${ENDPOINT.CMS_SERVICE.GROUPS}/${id}`,
+    );
+    return response.data;
+  }
+
+  // 그룹 저장
+  public async saveGroup(data: GroupSaveData): Promise<GroupDetailResponse> {
+    const response = await client.post<GroupDetailResponse>(
+      `${ENDPOINT.CMS_SERVICE.GROUPS}`,
+      data,
+    );
+    return response.data;
+  }
+
+  // 그룹 수정
+  public async updateGroup(
+    id: number,
+    data: GroupUpdateData,
+  ): Promise<GroupDetailResponse> {
+    const response = await client.put<GroupDetailResponse>(
+      `${ENDPOINT.CMS_SERVICE.GROUPS}/${id}`,
+      data,
+    );
+    return response.data;
+  }
+
+  // 그룹 삭제
+  public async deleteGroup(id: number): Promise<boolean> {
+    const response = await client.delete<boolean>(
+      `${ENDPOINT.CMS_SERVICE.GROUPS}/${id}`,
+    );
+    return response.data;
+  }
+}
diff --git a/apps/cs/src/pages/groups/api/index.ts b/apps/cs/src/pages/groups/api/index.ts
new file mode 100644
index 000000000..3d10f342e
--- /dev/null
+++ b/apps/cs/src/pages/groups/api/index.ts
@@ -0,0 +1,2 @@
+export * from "./groups-service";
+export * from "./group-users-service";
diff --git a/apps/cs/src/pages/groups/model/group-users-interface.ts b/apps/cs/src/pages/groups/model/group-users-interface.ts
new file mode 100644
index 000000000..e26f1fa09
--- /dev/null
+++ b/apps/cs/src/pages/groups/model/group-users-interface.ts
@@ -0,0 +1,107 @@
+// 그룹 사용자 검색 파라미터 인터페이스
+export interface GroupUserSearchParams {
+  page?: number;
+  size?: number;
+  sort?: string;
+  grpSn?: number;
+  userId?: string;
+  userName?: string;
+}
+
+// 그룹 사용자 목록 응답 인터페이스
+export interface GroupUserListResponseDto {
+  grpSn: number;
+  userUnqId: string;
+  userId: string;
+  userName: string;
+  email: string;
+  mphn: string;
+  regDt: string;
+  rgtr: string;
+  mdfcnDt: string;
+  mdfr: string;
+  rgtrNm: string;
+  mdfrNm: string;
+}
+
+// 그룹 사용자 페이지 응답 인터페이스
+export interface GroupUserList {
+  content: GroupUserListResponseDto[];
+  pageable: {
+    sort: {
+      empty: boolean;
+      sorted: boolean;
+      unsorted: boolean;
+    };
+    offset: number;
+    pageSize: number;
+    pageNumber: number;
+    paged: boolean;
+    unpaged: boolean;
+  };
+  last: boolean;
+  totalPages: number;
+  totalElements: number;
+  size: number;
+  number: number;
+  sort: {
+    empty: boolean;
+    sorted: boolean;
+    unsorted: boolean;
+  };
+  first: boolean;
+  numberOfElements: number;
+  empty: boolean;
+}
+
+// 그룹 사용자 상세 응답 인터페이스
+export interface GroupUserDetailResponse {
+  grpSn: number;
+  userUnqId: string;
+  userId: string;
+  userName: string;
+  email: string;
+  mphn: string;
+  regDt: string;
+  rgtr: string;
+  mdfcnDt: string;
+  mdfr: string;
+  rgtrNm: string;
+  mdfrNm: string;
+}
+
+// 그룹 사용자 저장 데이터 인터페이스
+export interface GroupUserSaveData {
+  grpSn: number;
+  userUnqId: string;
+}
+
+// 그룹 사용자 수정 데이터 인터페이스
+export interface GroupUserUpdateData {
+  userUnqId: string;
+}
+
+// 그룹 사용자 서비스 인터페이스
+export interface GroupUserService {
+  // 그룹 사용자 목록 조회
+  findPageGroupUser: (params: GroupUserSearchParams) => Promise<GroupUserList>;
+
+  // 그룹 사용자 단건 조회
+  findByGroupAndUserId: (
+    grpSn: number,
+    userUnqId: string,
+  ) => Promise<GroupUserDetailResponse>;
+
+  // 그룹 사용자 저장
+  saveGroupUser: (data: GroupUserSaveData) => Promise<GroupUserDetailResponse>;
+
+  // 그룹 사용자 수정
+  updateGroupUser: (
+    grpSn: number,
+    userUnqId: string,
+    data: GroupUserUpdateData,
+  ) => Promise<GroupUserDetailResponse>;
+
+  // 그룹 사용자 삭제
+  deleteGroupUser: (grpSn: number, userUnqId: string) => Promise<boolean>;
+}
diff --git a/apps/cs/src/pages/groups/model/groups-interface.ts b/apps/cs/src/pages/groups/model/groups-interface.ts
new file mode 100644
index 000000000..c8d2c35fb
--- /dev/null
+++ b/apps/cs/src/pages/groups/model/groups-interface.ts
@@ -0,0 +1,101 @@
+// 그룹 검색 파라미터 인터페이스
+export interface GroupSearchParams {
+  page?: number;
+  size?: number;
+  sort?: string;
+  grpNm?: string;
+  useYn?: string;
+}
+
+// 그룹 목록 응답 인터페이스
+export interface GroupListResponseDto {
+  grpSn: number;
+  grpNm: string;
+  grpExpln: string;
+  useYn: string;
+  regDt: string;
+  rgtr: string;
+  mdfcnDt: string;
+  mdfr: string;
+  rgtrNm: string;
+  mdfrNm: string;
+}
+
+// 그룹 페이지 응답 인터페이스
+export interface GroupList {
+  content: GroupListResponseDto[];
+  pageable: {
+    sort: {
+      empty: boolean;
+      sorted: boolean;
+      unsorted: boolean;
+    };
+    offset: number;
+    pageSize: number;
+    pageNumber: number;
+    paged: boolean;
+    unpaged: boolean;
+  };
+  last: boolean;
+  totalPages: number;
+  totalElements: number;
+  size: number;
+  number: number;
+  sort: {
+    empty: boolean;
+    sorted: boolean;
+    unsorted: boolean;
+  };
+  first: boolean;
+  numberOfElements: number;
+  empty: boolean;
+}
+
+// 그룹 상세 응답 인터페이스
+export interface GroupDetailResponse {
+  grpSn: number;
+  grpNm: string;
+  grpExpln: string;
+  useYn: string;
+  regDt: string;
+  rgtr: string;
+  mdfcnDt: string;
+  mdfr: string;
+  rgtrNm: string;
+  mdfrNm: string;
+}
+
+// 그룹 저장 데이터 인터페이스
+export interface GroupSaveData {
+  grpNm: string;
+  grpExpln: string;
+  useYn: string;
+}
+
+// 그룹 수정 데이터 인터페이스
+export interface GroupUpdateData {
+  grpNm: string;
+  grpExpln: string;
+  useYn: string;
+}
+
+// 그룹 서비스 인터페이스
+export interface GroupService {
+  // 그룹 목록 조회
+  findPageGroup: (params: GroupSearchParams) => Promise<GroupList>;
+
+  // 그룹 단건 조회
+  findById: (id: number) => Promise<GroupDetailResponse>;
+
+  // 그룹 저장
+  saveGroup: (data: GroupSaveData) => Promise<GroupDetailResponse>;
+
+  // 그룹 수정
+  updateGroup: (
+    id: number,
+    data: GroupUpdateData,
+  ) => Promise<GroupDetailResponse>;
+
+  // 그룹 삭제
+  deleteGroup: (id: number) => Promise<boolean>;
+}
diff --git a/apps/cs/src/pages/groups/model/index.ts b/apps/cs/src/pages/groups/model/index.ts
new file mode 100644
index 000000000..0852eb491
--- /dev/null
+++ b/apps/cs/src/pages/groups/model/index.ts
@@ -0,0 +1,2 @@
+export * from "./groups-interface";
+export * from "./group-users-interface";
diff --git a/apps/cs/src/shared/config/api.ts b/apps/cs/src/shared/config/api.ts
index da5edaea1..54d038dbf 100644
--- a/apps/cs/src/shared/config/api.ts
+++ b/apps/cs/src/shared/config/api.ts
@@ -45,6 +45,8 @@ export const ENDPOINT = {
     SURVEY_QUESTION: "/cms-service/api/v1/srvy-qitem",
     SURVEY_ARTICLE: "/cms-service/api/v1/srvy-artcl",
     ZIPS: "/cms-service/api/v1/zips",
+    GROUPS: "/cms-service/api/v1/groups",
+    GROUP_USERS: "/cms-service/api/v1/group-users",
   },
   BOARD_SERVICE: {
     BBS: "/board-service/api/v1/bbs",