diff --git a/dictation_client/src/AppRouter.tsx b/dictation_client/src/AppRouter.tsx
index 08b7185..248c80b 100644
--- a/dictation_client/src/AppRouter.tsx
+++ b/dictation_client/src/AppRouter.tsx
@@ -18,6 +18,7 @@ import DictationPage from "pages/DictationPage";
 import PartnerPage from "pages/PartnerPage";
 import WorkflowPage from "pages/WorkflowPage";
 import TypistGroupSettingPage from "pages/TypistGroupSettingPage";
+import WorktypeIdSettingPage from "pages/WorkTypeIdSettingPage";
 
 const AppRouter: React.FC = () => (
   <Routes>
@@ -66,6 +67,10 @@ const AppRouter: React.FC = () => (
       path="/workflow/typist-group"
       element={<RouteAuthGuard component={<TypistGroupSettingPage />} />}
     />
+    <Route
+      path="/workflow/worktype-id"
+      element={<RouteAuthGuard component={<WorktypeIdSettingPage />} />}
+    />
     <Route
       path="/partners"
       element={<RouteAuthGuard component={<PartnerPage />} />}
diff --git a/dictation_client/src/api/api.ts b/dictation_client/src/api/api.ts
index e0430ca..429eb58 100644
--- a/dictation_client/src/api/api.ts
+++ b/dictation_client/src/api/api.ts
@@ -462,6 +462,25 @@ export interface CreateTypistGroupRequest {
      */
     'typistIds': Array<number>;
 }
+/**
+ * 
+ * @export
+ * @interface CreateWorktypesRequest
+ */
+export interface CreateWorktypesRequest {
+    /**
+     * WorktypeID
+     * @type {string}
+     * @memberof CreateWorktypesRequest
+     */
+    'worktypeId': string;
+    /**
+     * Worktypeの説明
+     * @type {string}
+     * @memberof CreateWorktypesRequest
+     */
+    'description'?: string;
+}
 /**
  * 
  * @export
@@ -873,15 +892,15 @@ export interface GetUsersResponse {
 /**
  * 
  * @export
- * @interface GetWorkTypesResponse
+ * @interface GetWorktypesResponse
  */
-export interface GetWorkTypesResponse {
+export interface GetWorktypesResponse {
     /**
      * 
-     * @type {Array<WorkType>}
-     * @memberof GetWorkTypesResponse
+     * @type {Array<Worktype>}
+     * @memberof GetWorktypesResponse
      */
-    'workTypes': Array<WorkType>;
+    'worktypes': Array<Worktype>;
 }
 /**
  * 
@@ -1609,25 +1628,25 @@ export interface User {
 /**
  * 
  * @export
- * @interface WorkType
+ * @interface Worktype
  */
-export interface WorkType {
+export interface Worktype {
     /**
-     * WorkTypeのID
+     * WorktypeのID
      * @type {number}
-     * @memberof WorkType
+     * @memberof Worktype
      */
     'id': number;
     /**
-     * WorkTypeID
+     * WorktypeID
      * @type {string}
-     * @memberof WorkType
+     * @memberof Worktype
      */
-    'workTypeId': string;
+    'worktypeId': string;
     /**
-     * WorkTypeの説明
+     * Worktypeの説明
      * @type {string}
-     * @memberof WorkType
+     * @memberof Worktype
      */
     'description'?: string;
 }
@@ -1794,6 +1813,46 @@ export const AccountsApiAxiosParamCreator = function (configuration?: Configurat
                 options: localVarRequestOptions,
             };
         },
+        /**
+         * 
+         * @summary 
+         * @param {CreateWorktypesRequest} createWorktypesRequest 
+         * @param {*} [options] Override http request option.
+         * @throws {RequiredError}
+         */
+        createWorktype: async (createWorktypesRequest: CreateWorktypesRequest, options: AxiosRequestConfig = {}): Promise<RequestArgs> => {
+            // verify required parameter 'createWorktypesRequest' is not null or undefined
+            assertParamExists('createWorktype', 'createWorktypesRequest', createWorktypesRequest)
+            const localVarPath = `/accounts/worktypes`;
+            // use dummy base URL string because the URL constructor only accepts absolute URLs.
+            const localVarUrlObj = new URL(localVarPath, DUMMY_BASE_URL);
+            let baseOptions;
+            if (configuration) {
+                baseOptions = configuration.baseOptions;
+            }
+
+            const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
+            const localVarHeaderParameter = {} as any;
+            const localVarQueryParameter = {} as any;
+
+            // authentication bearer required
+            // http bearer authentication required
+            await setBearerAuthToObject(localVarHeaderParameter, configuration)
+
+
+    
+            localVarHeaderParameter['Content-Type'] = 'application/json';
+
+            setSearchParams(localVarUrlObj, localVarQueryParameter);
+            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
+            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
+            localVarRequestOptions.data = serializeDataIfNeeded(createWorktypesRequest, localVarRequestOptions, configuration)
+
+            return {
+                url: toPathString(localVarUrlObj),
+                options: localVarRequestOptions,
+            };
+        },
         /**
          * 
          * @summary 
@@ -2256,6 +2315,17 @@ export const AccountsApiFp = function(configuration?: Configuration) {
             const localVarAxiosArgs = await localVarAxiosParamCreator.createTypistGroup(createTypistGroupRequest, options);
             return createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration);
         },
+        /**
+         * 
+         * @summary 
+         * @param {CreateWorktypesRequest} createWorktypesRequest 
+         * @param {*} [options] Override http request option.
+         * @throws {RequiredError}
+         */
+        async createWorktype(createWorktypesRequest: CreateWorktypesRequest, options?: AxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<object>> {
+            const localVarAxiosArgs = await localVarAxiosParamCreator.createWorktype(createWorktypesRequest, options);
+            return createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration);
+        },
         /**
          * 
          * @summary 
@@ -2346,7 +2416,7 @@ export const AccountsApiFp = function(configuration?: Configuration) {
          * @param {*} [options] Override http request option.
          * @throws {RequiredError}
          */
-        async getWorktypes(options?: AxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<GetWorkTypesResponse>> {
+        async getWorktypes(options?: AxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<GetWorktypesResponse>> {
             const localVarAxiosArgs = await localVarAxiosParamCreator.getWorktypes(options);
             return createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration);
         },
@@ -2423,6 +2493,16 @@ export const AccountsApiFactory = function (configuration?: Configuration, baseP
         createTypistGroup(createTypistGroupRequest: CreateTypistGroupRequest, options?: any): AxiosPromise<object> {
             return localVarFp.createTypistGroup(createTypistGroupRequest, options).then((request) => request(axios, basePath));
         },
+        /**
+         * 
+         * @summary 
+         * @param {CreateWorktypesRequest} createWorktypesRequest 
+         * @param {*} [options] Override http request option.
+         * @throws {RequiredError}
+         */
+        createWorktype(createWorktypesRequest: CreateWorktypesRequest, options?: any): AxiosPromise<object> {
+            return localVarFp.createWorktype(createWorktypesRequest, options).then((request) => request(axios, basePath));
+        },
         /**
          * 
          * @summary 
@@ -2505,7 +2585,7 @@ export const AccountsApiFactory = function (configuration?: Configuration, baseP
          * @param {*} [options] Override http request option.
          * @throws {RequiredError}
          */
-        getWorktypes(options?: any): AxiosPromise<GetWorkTypesResponse> {
+        getWorktypes(options?: any): AxiosPromise<GetWorktypesResponse> {
             return localVarFp.getWorktypes(options).then((request) => request(axios, basePath));
         },
         /**
@@ -2587,6 +2667,18 @@ export class AccountsApi extends BaseAPI {
         return AccountsApiFp(this.configuration).createTypistGroup(createTypistGroupRequest, options).then((request) => request(this.axios, this.basePath));
     }
 
+    /**
+     * 
+     * @summary 
+     * @param {CreateWorktypesRequest} createWorktypesRequest 
+     * @param {*} [options] Override http request option.
+     * @throws {RequiredError}
+     * @memberof AccountsApi
+     */
+    public createWorktype(createWorktypesRequest: CreateWorktypesRequest, options?: AxiosRequestConfig) {
+        return AccountsApiFp(this.configuration).createWorktype(createWorktypesRequest, options).then((request) => request(this.axios, this.basePath));
+    }
+
     /**
      * 
      * @summary 
diff --git a/dictation_client/src/app/store.ts b/dictation_client/src/app/store.ts
index 722801d..73c16f7 100644
--- a/dictation_client/src/app/store.ts
+++ b/dictation_client/src/app/store.ts
@@ -14,6 +14,7 @@ import dictation from "features/dictation/dictationSlice";
 import partner from "features/partner/partnerSlice";
 import licenseOrderHistory from "features/license/licenseOrderHistory/licenseOrderHistorySlice";
 import typistGroup from "features/workflow/typistGroup/typistGroupSlice";
+import worktype from "features/workflow/worktype/worktypeSlice";
 
 export const store = configureStore({
   reducer: {
@@ -32,6 +33,7 @@ export const store = configureStore({
     dictation,
     partner,
     typistGroup,
+    worktype,
   },
 });
 
diff --git a/dictation_client/src/assets/images/worktype_add.svg b/dictation_client/src/assets/images/worktype_add.svg
new file mode 100644
index 0000000..a63ac00
--- /dev/null
+++ b/dictation_client/src/assets/images/worktype_add.svg
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 27.7.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="レイヤー_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
+	 y="0px" viewBox="0 0 48 48" style="enable-background:new 0 0 48 48;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#282828;}
+</style>
+<path class="st0" d="M9,40c-0.8,0-1.5-0.3-2.1-0.9C6.3,38.5,6,37.8,6,37V7c0-0.8,0.3-1.5,0.9-2.1S8.2,4,9,4h30
+	c0.8,0,1.5,0.3,2.1,0.9C41.7,5.5,42,6.2,42,7v15.1c-0.3,0-0.5-0.1-0.7-0.1s-0.5,0-0.7,0H39V7H9v30h6.9c0.2,0.5,0.3,1,0.5,1.5
+	s0.4,1,0.7,1.5H9z M9,34v3V7V34z M14.5,31.5H16c0.4-1.2,1-2.5,1.8-3.7s1.8-2.3,2.8-3.3h-6.1C14.5,24.5,14.5,31.5,14.5,31.5z
+	 M14.5,19.5h7v-7h-7V19.5z M26.5,19.5h7v-7h-7V19.5z M29.6,41.9v-6.5H23v-3.9h6.5V25h3.9v6.5H40v3.9h-6.5v6.5H29.6z"/>
+</svg>
diff --git a/dictation_client/src/features/workflow/worktype/index.ts b/dictation_client/src/features/workflow/worktype/index.ts
new file mode 100644
index 0000000..22036b3
--- /dev/null
+++ b/dictation_client/src/features/workflow/worktype/index.ts
@@ -0,0 +1,4 @@
+export * from "./worktypeSlice";
+export * from "./state";
+export * from "./selectors";
+export * from "./operations";
diff --git a/dictation_client/src/features/workflow/worktype/operations.ts b/dictation_client/src/features/workflow/worktype/operations.ts
new file mode 100644
index 0000000..ad05f7c
--- /dev/null
+++ b/dictation_client/src/features/workflow/worktype/operations.ts
@@ -0,0 +1,45 @@
+import { createAsyncThunk } from "@reduxjs/toolkit";
+import type { RootState } from "app/store";
+import { openSnackbar } from "features/ui/uiSlice";
+import { getTranslationID } from "translation";
+import { AccountsApi, GetWorktypesResponse } from "../../../api/api";
+import { Configuration } from "../../../api/configuration";
+import { ErrorObject, createErrorObject } from "../../../common/errors";
+
+export const listWorktypesAsync = createAsyncThunk<
+  GetWorktypesResponse,
+  void,
+  {
+    // rejectした時の返却値の型
+    rejectValue: {
+      error: ErrorObject;
+    };
+  }
+>("workflow/listWorktypesAsync", async (args, thunkApi) => {
+  // apiのConfigurationを取得する
+  const { getState } = thunkApi;
+  const state = getState() as RootState;
+  const { configuration, accessToken } = state.auth;
+  const config = new Configuration(configuration);
+  const accountsApi = new AccountsApi(config);
+
+  try {
+    const worktypes = (
+      await accountsApi.getWorktypes({
+        headers: { authorization: `Bearer ${accessToken}` },
+      })
+    ).data;
+
+    return worktypes;
+  } catch (e) {
+    // e ⇒ errorObjectに変換"
+    const error = createErrorObject(e);
+    thunkApi.dispatch(
+      openSnackbar({
+        level: "error",
+        message: getTranslationID("common.message.internalServerError"),
+      })
+    );
+    return thunkApi.rejectWithValue({ error });
+  }
+});
diff --git a/dictation_client/src/features/workflow/worktype/selectors.ts b/dictation_client/src/features/workflow/worktype/selectors.ts
new file mode 100644
index 0000000..343d665
--- /dev/null
+++ b/dictation_client/src/features/workflow/worktype/selectors.ts
@@ -0,0 +1,7 @@
+import { RootState } from "app/store";
+
+export const selectWorktypes = (state: RootState) =>
+  state.worktype.domain.worktypes;
+
+export const selectIsLoading = (state: RootState) =>
+  state.worktype.apps.isLoading;
diff --git a/dictation_client/src/features/workflow/worktype/state.ts b/dictation_client/src/features/workflow/worktype/state.ts
new file mode 100644
index 0000000..365b7b7
--- /dev/null
+++ b/dictation_client/src/features/workflow/worktype/state.ts
@@ -0,0 +1,14 @@
+import { Worktype } from "api";
+
+export interface WorktypeState {
+  apps: Apps;
+  domain: Domain;
+}
+
+export interface Apps {
+  isLoading: boolean;
+}
+
+export interface Domain {
+  worktypes?: Worktype[];
+}
diff --git a/dictation_client/src/features/workflow/worktype/worktypeSlice.ts b/dictation_client/src/features/workflow/worktype/worktypeSlice.ts
new file mode 100644
index 0000000..624f3bd
--- /dev/null
+++ b/dictation_client/src/features/workflow/worktype/worktypeSlice.ts
@@ -0,0 +1,31 @@
+import { createSlice } from "@reduxjs/toolkit";
+import { WorktypeState } from "./state";
+import { listWorktypesAsync } from "./operations";
+
+const initialState: WorktypeState = {
+  apps: {
+    isLoading: false,
+  },
+  domain: {},
+};
+
+export const worktypeSlice = createSlice({
+  name: "worktype",
+  initialState,
+  reducers: {},
+  extraReducers: (builder) => {
+    builder.addCase(listWorktypesAsync.pending, (state) => {
+      state.apps.isLoading = true;
+    });
+    builder.addCase(listWorktypesAsync.fulfilled, (state, action) => {
+      const { worktypes } = action.payload;
+      state.domain.worktypes = worktypes;
+      state.apps.isLoading = false;
+    });
+    builder.addCase(listWorktypesAsync.rejected, (state) => {
+      state.apps.isLoading = false;
+    });
+  },
+});
+
+export default worktypeSlice.reducer;
diff --git a/dictation_client/src/pages/DictationPage/changeTranscriptionistPopup.tsx b/dictation_client/src/pages/DictationPage/changeTranscriptionistPopup.tsx
index e13e8dd..98d6b38 100644
--- a/dictation_client/src/pages/DictationPage/changeTranscriptionistPopup.tsx
+++ b/dictation_client/src/pages/DictationPage/changeTranscriptionistPopup.tsx
@@ -185,7 +185,7 @@ export const ChangeTranscriptionistPopup: React.FC<
               <input
                 type="button"
                 name="submit"
-                value={t(getTranslationID("dictationPage.label.saveChanges"))}
+                value={t(getTranslationID("common.label.save"))}
                 className={`${styles.formSubmit} ${styles.marginBtm1} ${
                   !isLoading ? styles.isActive : ""
                 }`}
diff --git a/dictation_client/src/pages/LicensePage/licenseOrderHistory.tsx b/dictation_client/src/pages/LicensePage/licenseOrderHistory.tsx
index 8b82ca7..cc6d2ca 100644
--- a/dictation_client/src/pages/LicensePage/licenseOrderHistory.tsx
+++ b/dictation_client/src/pages/LicensePage/licenseOrderHistory.tsx
@@ -181,7 +181,7 @@ export const LicenseOrderHistory: React.FC<LicenseOrderHistoryProps> = (
                     onClick={returnGui}
                   >
                     <img src={undo} alt="" className={styles.menuIcon} />
-                    {t(getTranslationID("orderHistoriesPage.label.return"))}
+                    {t(getTranslationID("common.label.return"))}
                   </a>
                 </li>
               </ul>
diff --git a/dictation_client/src/pages/LicensePage/licenseSummary.tsx b/dictation_client/src/pages/LicensePage/licenseSummary.tsx
index 202e968..1744105 100644
--- a/dictation_client/src/pages/LicensePage/licenseSummary.tsx
+++ b/dictation_client/src/pages/LicensePage/licenseSummary.tsx
@@ -126,11 +126,7 @@ export const LicenseSummary: React.FC<LicenseSummaryProps> = (
                             alt=""
                             className={styles.menuIcon}
                           />
-                          {t(
-                            getTranslationID(
-                              "partnerLicense.label.returnButton"
-                            )
-                          )}
+                          {t(getTranslationID("common.label.return"))}
                         </a>
                       )}
                     </li>
diff --git a/dictation_client/src/pages/LicensePage/partnerLicense.tsx b/dictation_client/src/pages/LicensePage/partnerLicense.tsx
index b6653da..c93501d 100644
--- a/dictation_client/src/pages/LicensePage/partnerLicense.tsx
+++ b/dictation_client/src/pages/LicensePage/partnerLicense.tsx
@@ -277,9 +277,7 @@ const PartnerLicense: React.FC = (): JSX.Element => {
                           alt=""
                           className={styles.menuIcon}
                         />
-                        {t(
-                          getTranslationID("partnerLicense.label.returnButton")
-                        )}
+                        {t(getTranslationID("common.label.return"))}
                       </a>
                     )}
                   </li>
diff --git a/dictation_client/src/pages/TypistGroupSettingPage/addTypistGroupPopup.tsx b/dictation_client/src/pages/TypistGroupSettingPage/addTypistGroupPopup.tsx
index 484522b..12000af 100644
--- a/dictation_client/src/pages/TypistGroupSettingPage/addTypistGroupPopup.tsx
+++ b/dictation_client/src/pages/TypistGroupSettingPage/addTypistGroupPopup.tsx
@@ -190,7 +190,7 @@ export const AddTypistGroupPopup: React.FC<AddTypistGroupPopupProps> = (
               <input
                 type="button"
                 name="submit"
-                value={t(getTranslationID("typistGroupSetting.label.save"))}
+                value={t(getTranslationID("common.label.save"))}
                 className={`${styles.formSubmit} ${styles.marginBtm1} ${styles.isActive}`}
                 onClick={addTypistGroup}
               />
diff --git a/dictation_client/src/pages/TypistGroupSettingPage/editTypistGroupPopup.tsx b/dictation_client/src/pages/TypistGroupSettingPage/editTypistGroupPopup.tsx
index a20c6c7..faf85d4 100644
--- a/dictation_client/src/pages/TypistGroupSettingPage/editTypistGroupPopup.tsx
+++ b/dictation_client/src/pages/TypistGroupSettingPage/editTypistGroupPopup.tsx
@@ -184,7 +184,7 @@ export const EditTypistGroupPopup: React.FC<EditTypistGroupPopupProps> = (
               <input
                 type="button"
                 name="submit"
-                value={t(getTranslationID("typistGroupSetting.label.save"))}
+                value={t(getTranslationID("common.label.save"))}
                 className={`${styles.formSubmit} ${styles.marginBtm1} ${styles.isActive}`}
                 onClick={editTypistGroup}
               />
diff --git a/dictation_client/src/pages/TypistGroupSettingPage/index.tsx b/dictation_client/src/pages/TypistGroupSettingPage/index.tsx
index 2d17ff1..6b1ff06 100644
--- a/dictation_client/src/pages/TypistGroupSettingPage/index.tsx
+++ b/dictation_client/src/pages/TypistGroupSettingPage/index.tsx
@@ -83,7 +83,7 @@ const TypistGroupSettingPage: React.FC = (): JSX.Element => {
                       className={`${styles.menuLink} ${styles.isActive}`}
                     >
                       <img src={undo} alt="" className={styles.menuIcon} />
-                      {t(getTranslationID("typistGroupSetting.label.return"))}
+                      {t(getTranslationID("common.label.return"))}
                     </a>
                   </li>
                   <li>
@@ -127,11 +127,7 @@ const TypistGroupSettingPage: React.FC = (): JSX.Element => {
                                   onEditPopupOpen(group.id);
                                 }}
                               >
-                                {t(
-                                  getTranslationID(
-                                    "typistGroupSetting.label.edit"
-                                  )
-                                )}
+                                {t(getTranslationID("common.label.edit"))}
                               </a>
                             </li>
                           </ul>
diff --git a/dictation_client/src/pages/WorkTypeIdSettingPage/index.tsx b/dictation_client/src/pages/WorkTypeIdSettingPage/index.tsx
new file mode 100644
index 0000000..2a77caf
--- /dev/null
+++ b/dictation_client/src/pages/WorkTypeIdSettingPage/index.tsx
@@ -0,0 +1,170 @@
+import { UpdateTokenTimer } from "components/auth/updateTokenTimer";
+import Footer from "components/footer";
+import Header from "components/header";
+import React, { useEffect, useState } from "react";
+import { getTranslationID } from "translation";
+import styles from "styles/app.module.scss";
+import undo from "assets/images/undo.svg";
+import worktype_add from "assets/images/worktype_add.svg";
+import progress_activit from "assets/images/progress_activit.svg";
+import { useTranslation } from "react-i18next";
+import { useDispatch, useSelector } from "react-redux";
+import {
+  listWorktypesAsync,
+  selectIsLoading,
+  selectWorktypes,
+} from "features/workflow/worktype";
+import { AppDispatch } from "app/store";
+
+const WorktypeIdSettingPage: React.FC = (): JSX.Element => {
+  const dispatch: AppDispatch = useDispatch();
+  const [t] = useTranslation();
+  const isLoading = useSelector(selectIsLoading);
+  const worktypes = useSelector(selectWorktypes);
+  const [selectedRow, setSelectedRow] = useState<number>(NaN);
+  useEffect(() => {
+    dispatch(listWorktypesAsync());
+  }, [dispatch]);
+
+  return (
+    <div className={styles.wrap}>
+      <Header userName="XXXXXXX" />
+      <UpdateTokenTimer />
+      <main className={styles.main}>
+        <div>
+          <div className={styles.pageHeader}>
+            <h1 className={styles.pageTitle}>
+              {t(getTranslationID("workflowPage.label.title"))}
+            </h1>
+            <p className={styles.pageTx}>
+              {t(getTranslationID("worktypeIdSetting.label.title"))}
+            </p>
+          </div>
+          <section className={styles.workflow}>
+            <div>
+              <ul className={`${styles.menuAction} ${styles.worktype}`}>
+                <li>
+                  <a
+                    href="/workflow"
+                    className={`${styles.menuLink} ${styles.isActive}`}
+                  >
+                    <img src={undo} alt="" className={styles.menuIcon} />
+                    {t(getTranslationID("common.label.return"))}
+                  </a>
+                </li>
+                <li>
+                  <a
+                    className={`${styles.menuLink} ${styles.isActive}`}
+                    // onClick={}
+                  >
+                    <img
+                      src={worktype_add}
+                      alt=""
+                      className={styles.menuIcon}
+                    />
+                    {t(
+                      getTranslationID("worktypeIdSetting.label.addWorktypeId")
+                    )}
+                  </a>
+                </li>
+                <li className={styles.selectMenu}>
+                  {`${t(
+                    getTranslationID("worktypeIdSetting.label.activeWorktypeId")
+                  )}:`}
+                  <select name="Active Worktype" className={styles.formInput}>
+                    {worktypes?.map((worktype) => (
+                      <option key={worktype.id} value={worktype.id}>
+                        {worktype.worktypeId}
+                      </option>
+                    ))}
+                  </select>
+                </li>
+              </ul>
+              <table className={`${styles.table} ${styles.worktype}`}>
+                <tr className={styles.tableHeader}>
+                  <th className={styles.noLine}>
+                    {t(getTranslationID("worktypeIdSetting.label.worktypeId"))}
+                  </th>
+                  <th className={styles.noLine}>
+                    {t(getTranslationID("worktypeIdSetting.label.description"))}
+                  </th>
+                  <th>{/** empty th */}</th>
+                </tr>
+                {worktypes?.map((worktype) => (
+                  <tr
+                    key={worktype.id}
+                    className={
+                      worktype.id === selectedRow ? styles.isSelected : ""
+                    }
+                    onMouseEnter={() => {
+                      setSelectedRow(worktype.id);
+                    }}
+                    onMouseLeave={() => {
+                      setSelectedRow(NaN);
+                    }}
+                  >
+                    <td>{worktype.worktypeId}</td>
+                    <td>{worktype.description}</td>
+                    <td>
+                      <ul className={`${styles.menuAction} ${styles.inTable}`}>
+                        <li>
+                          <a
+                            className={`${styles.menuLink} ${styles.isActive}`}
+                            // onClick={}
+                          >
+                            {t(getTranslationID("common.label.edit"))}
+                          </a>
+                        </li>
+                        <li>
+                          <a
+                            className={`${styles.menuLink} ${styles.isActive}`}
+                            // onClick={}
+                          >
+                            {t(
+                              getTranslationID(
+                                "worktypeIdSetting.label.optionItem"
+                              )
+                            )}
+                          </a>
+                        </li>
+                        <li>
+                          <a
+                            className={`${styles.menuLink} ${styles.isActive}`}
+                            // onClick={}
+                          >
+                            {t(getTranslationID("common.label.delete"))}
+                          </a>
+                        </li>
+                      </ul>
+                    </td>
+                  </tr>
+                ))}
+              </table>
+              {!isLoading && worktypes?.length === 0 && (
+                <p
+                  style={{
+                    margin: "10px",
+                    textAlign: "center",
+                    width: "1000px",
+                  }}
+                >
+                  {t(getTranslationID("common.message.listEmpty"))}
+                </p>
+              )}
+              {isLoading && (
+                <img
+                  src={progress_activit}
+                  className={styles.icLoading}
+                  alt="Loading"
+                />
+              )}
+            </div>
+          </section>
+        </div>
+      </main>
+      <Footer />
+    </div>
+  );
+};
+
+export default WorktypeIdSettingPage;
diff --git a/dictation_client/src/pages/WorkflowPage/index.tsx b/dictation_client/src/pages/WorkflowPage/index.tsx
index e817a00..6d57be9 100644
--- a/dictation_client/src/pages/WorkflowPage/index.tsx
+++ b/dictation_client/src/pages/WorkflowPage/index.tsx
@@ -15,6 +15,11 @@ const WorkflowPage: React.FC = (): JSX.Element => (
             Transcriptionist Group Setting
           </a>
         </span>
+        <span>
+          <a style={{ margin: 20 }} href="/workflow/worktype-id">
+            Worktype ID Setting
+          </a>
+        </span>
       </div>
     </main>
     <Footer />
diff --git a/dictation_client/src/translation/de.json b/dictation_client/src/translation/de.json
index 8e2df7e..3fdb8fc 100644
--- a/dictation_client/src/translation/de.json
+++ b/dictation_client/src/translation/de.json
@@ -14,6 +14,10 @@
       "cancel": "(de)Cancel",
       "headerTitle": "(de)ODMS Cloud",
       "copyRight": "(de)OM Digital Solutions 2023",
+      "edit": "(de)Edit",
+      "save": "(de)Save",
+      "delete": "(de)Delete",
+      "return": "(de)Return",
       "tier1": "(de)Admin",
       "tier2": "(de)BC",
       "tier3": "(de)Distributor",
@@ -120,8 +124,6 @@
     "label": {
       "title": "(de)User",
       "addUser": "(de)Add User",
-      "edit": "(de)Edit",
-      "delete": "(de)Delete",
       "licenseAllocation": "(de)License Allocation",
       "name": "(de)Name",
       "role": "(de)Role",
@@ -236,8 +238,7 @@
       "changeTranscriptionist": "(de)Change Transcriptionist",
       "deleteDictation": "(de)Delete Dictation",
       "selectedTranscriptionist": "(de)Selected",
-      "poolTranscriptionist": "(de)Pool",
-      "saveChanges": "(de)Save"
+      "poolTranscriptionist": "(de)Pool"
     }
   },
   "cardLicenseIssuePopupPage": {
@@ -294,7 +295,6 @@
     "label": {
       "title": "(de)License",
       "subTitle": "(de)License for partners",
-      "returnButton": "(de)Return",
       "orderLicenseButton": "(de)Order License",
       "orderHistoryButton": "(de)Order History",
       "IssueLicenseCardButton": "(de)License Card",
@@ -314,7 +314,6 @@
     "label": {
       "title": "(de)License",
       "orderHistory": "(de)Order History",
-      "return": "(de)Return",
       "orderDate": "(de)Order date",
       "issueDate": "(de)Issue date",
       "numberOfOrder": "(de)Number of Order",
@@ -367,22 +366,29 @@
   "typistGroupSetting": {
     "label": {
       "title": "(de)Transctiprionist Group",
-      "return": "(de)Return",
       "addGroup": "(de)Add Group",
       "groupName": "(de)Group Name",
-      "edit": "(de)Edit",
       "addTypistGroup": "(de)Add Transcriptionist Group",
       "transcriptionist": "(de)Transcriptionist",
       "selected": "(de)Selected",
       "pool": "(de)Pool",
       "add": "(de)Add",
       "remove": "(de)Remove",
-      "editTypistGroup": "(de)Edit Transcriptionist Group",
-      "save": "(de)Save"
+      "editTypistGroup": "(de)Edit Transcriptionist Group"
     },
     "message": {
       "selectedTypistEmptyError": "(de)TranscriptionistがいないTranscriptionistGroupは保存できません。1名以上をTranscriptionistとして選択してください。",
       "groupSaveFailedError": "(de)TypistGroupの保存に失敗しました。画面を更新し、再度実行してください"
     }
+  },
+  "worktypeIdSetting": {
+    "label": {
+      "title": "(de)Worktype ID Setting",
+      "activeWorktypeId": "(de)Active Worktype ID",
+      "addWorktypeId": "(de)Add Worktype ID",
+      "worktypeId": "(de)Worktype ID",
+      "description": "(de)Description",
+      "optionItem": "(de)Option Item"
+    }
   }
 }
diff --git a/dictation_client/src/translation/en.json b/dictation_client/src/translation/en.json
index 47be47a..4ca6d4a 100644
--- a/dictation_client/src/translation/en.json
+++ b/dictation_client/src/translation/en.json
@@ -14,6 +14,10 @@
       "cancel": "Cancel",
       "headerTitle": "ODMS Cloud",
       "copyRight": "OM Digital Solutions 2023",
+      "edit": "Edit",
+      "save": "Save",
+      "delete": "Delete",
+      "return": "Return",
       "tier1": "Admin",
       "tier2": "BC",
       "tier3": "Distributor",
@@ -120,8 +124,6 @@
     "label": {
       "title": "User",
       "addUser": "Add User",
-      "edit": "Edit",
-      "delete": "Delete",
       "licenseAllocation": "License Allocation",
       "name": "Name",
       "role": "Role",
@@ -236,8 +238,7 @@
       "changeTranscriptionist": "Change Transcriptionist",
       "deleteDictation": "Delete Dictation",
       "selectedTranscriptionist": "Selected",
-      "poolTranscriptionist": "Pool",
-      "saveChanges": "Save"
+      "poolTranscriptionist": "Pool"
     }
   },
   "cardLicenseIssuePopupPage": {
@@ -294,7 +295,6 @@
     "label": {
       "title": "License",
       "subTitle": "License for partners",
-      "returnButton": "Return",
       "orderLicenseButton": "Order License",
       "orderHistoryButton": "Order History",
       "IssueLicenseCardButton": "License Card",
@@ -314,7 +314,6 @@
     "label": {
       "title": "License",
       "orderHistory": "Order History",
-      "return": "Return",
       "orderDate": "Order date",
       "issueDate": "Issue date",
       "numberOfOrder": "Number of Order",
@@ -367,22 +366,29 @@
   "typistGroupSetting": {
     "label": {
       "title": "Transctiprionist Group",
-      "return": "Return",
       "addGroup": "Add Group",
       "groupName": "Group Name",
-      "edit": "Edit",
       "addTypistGroup": "Add Transcriptionist Group",
       "transcriptionist": "Transcriptionist",
       "selected": "Selected",
       "pool": "Pool",
       "add": "Add",
       "remove": "Remove",
-      "editTypistGroup": "Edit Transcriptionist Group",
-      "save": "Save"
+      "editTypistGroup": "Edit Transcriptionist Group"
     },
     "message": {
       "selectedTypistEmptyError": "TranscriptionistがいないTranscriptionistGroupは保存できません。1名以上をTranscriptionistとして選択してください。",
       "groupSaveFailedError": "TypistGroupの保存に失敗しました。画面を更新し、再度実行してください"
     }
+  },
+  "worktypeIdSetting": {
+    "label": {
+      "title": "Worktype ID Setting",
+      "activeWorktypeId": "Active Worktype ID",
+      "addWorktypeId": "Add Worktype ID",
+      "worktypeId": "Worktype ID",
+      "description": "Description",
+      "optionItem": "Option Item"
+    }
   }
 }
diff --git a/dictation_client/src/translation/es.json b/dictation_client/src/translation/es.json
index 5fcb345..c5cd179 100644
--- a/dictation_client/src/translation/es.json
+++ b/dictation_client/src/translation/es.json
@@ -14,6 +14,10 @@
       "cancel": "(es)Cancel",
       "headerTitle": "(es)ODMS Cloud",
       "copyRight": "(es)OM Digital Solutions 2023",
+      "edit": "(es)Edit",
+      "save": "(es)Save",
+      "delete": "(es)Delete",
+      "return": "(es)Return",
       "tier1": "(es)Admin",
       "tier2": "(es)BC",
       "tier3": "(es)Distributor",
@@ -120,8 +124,6 @@
     "label": {
       "title": "(es)User",
       "addUser": "(es)Add User",
-      "edit": "(es)Edit",
-      "delete": "(es)Delete",
       "licenseAllocation": "(es)License Allocation",
       "name": "(es)Name",
       "role": "(es)Role",
@@ -236,8 +238,7 @@
       "changeTranscriptionist": "(es)Change Transcriptionist",
       "deleteDictation": "(es)Delete Dictation",
       "selectedTranscriptionist": "(es)Selected",
-      "poolTranscriptionist": "(es)Pool",
-      "saveChanges": "(es)Save"
+      "poolTranscriptionist": "(es)Pool"
     }
   },
   "cardLicenseIssuePopupPage": {
@@ -294,7 +295,6 @@
     "label": {
       "title": "(es)License",
       "subTitle": "(es)License for partners",
-      "returnButton": "(es)Return",
       "orderLicenseButton": "(es)Order License",
       "orderHistoryButton": "(es)Order History",
       "IssueLicenseCardButton": "(es)License Card",
@@ -314,7 +314,6 @@
     "label": {
       "title": "(es)License",
       "orderHistory": "(es)Order History",
-      "return": "(es)Return",
       "orderDate": "(es)Order date",
       "issueDate": "(es)Issue date",
       "numberOfOrder": "(es)Number of Order",
@@ -367,22 +366,29 @@
   "typistGroupSetting": {
     "label": {
       "title": "(es)Transctiprionist Group",
-      "return": "(es)Return",
       "addGroup": "(es)Add Group",
       "groupName": "(es)Group Name",
-      "edit": "(es)Edit",
       "addTypistGroup": "(es)Add Transcriptionist Group",
       "transcriptionist": "(es)Transcriptionist",
       "selected": "(es)Selected",
       "pool": "(es)Pool",
       "add": "(es)Add",
       "remove": "(es)Remove",
-      "editTypistGroup": "(es)Edit Transcriptionist Group",
-      "save": "(es)Save"
+      "editTypistGroup": "(es)Edit Transcriptionist Group"
     },
     "message": {
       "selectedTypistEmptyError": "(es)TranscriptionistがいないTranscriptionistGroupは保存できません。1名以上をTranscriptionistとして選択してください。",
       "groupSaveFailedError": "(es)TypistGroupの保存に失敗しました。画面を更新し、再度実行してください"
     }
+  },
+  "worktypeIdSetting": {
+    "label": {
+      "title": "(es)Worktype ID Setting",
+      "activeWorktypeId": "(es)Active Worktype ID",
+      "addWorktypeId": "(es)Add Worktype ID",
+      "worktypeId": "(es)Worktype ID",
+      "description": "(es)Description",
+      "optionItem": "(es)Option Item"
+    }
   }
 }
diff --git a/dictation_client/src/translation/fr.json b/dictation_client/src/translation/fr.json
index 82274c8..afd1048 100644
--- a/dictation_client/src/translation/fr.json
+++ b/dictation_client/src/translation/fr.json
@@ -14,6 +14,10 @@
       "cancel": "(fr)Cancel",
       "headerTitle": "(fr)ODMS Cloud",
       "copyRight": "(fr)OM Digital Solutions 2023",
+      "edit": "(fr)Edit",
+      "save": "(fr)Save",
+      "delete": "(fr)Delete",
+      "return": "(fr)Return",
       "tier1": "(fr)Admin",
       "tier2": "(fr)BC",
       "tier3": "(fr)Distributor",
@@ -120,8 +124,6 @@
     "label": {
       "title": "(fr)User",
       "addUser": "(fr)Add User",
-      "edit": "(fr)Edit",
-      "delete": "(fr)Delete",
       "licenseAllocation": "(fr)License Allocation",
       "name": "(fr)Name",
       "role": "(fr)Role",
@@ -236,8 +238,7 @@
       "changeTranscriptionist": "(fr)Change Transcriptionist",
       "deleteDictation": "(fr)Delete Dictation",
       "selectedTranscriptionist": "(fr)Selected",
-      "poolTranscriptionist": "(fr)Pool",
-      "saveChanges": "(fr)Save"
+      "poolTranscriptionist": "(fr)Pool"
     }
   },
   "cardLicenseIssuePopupPage": {
@@ -294,7 +295,6 @@
     "label": {
       "title": "(fr)License",
       "subTitle": "(fr)License for partners",
-      "returnButton": "(fr)Return",
       "orderLicenseButton": "(fr)Order License",
       "orderHistoryButton": "(fr)Order History",
       "IssueLicenseCardButton": "(fr)License Card",
@@ -314,7 +314,6 @@
     "label": {
       "title": "(fr)License",
       "orderHistory": "(fr)Order History",
-      "return": "(fr)Return",
       "orderDate": "(fr)Order date",
       "issueDate": "(fr)Issue date",
       "numberOfOrder": "(fr)Number of Order",
@@ -367,22 +366,29 @@
   "typistGroupSetting": {
     "label": {
       "title": "(fr)Transctiprionist Group",
-      "return": "(fr)Return",
       "addGroup": "(fr)Add Group",
       "groupName": "(fr)Group Name",
-      "edit": "(fr)Edit",
       "addTypistGroup": "(fr)Add Transcriptionist Group",
       "transcriptionist": "(fr)Transcriptionist",
       "selected": "(fr)Selected",
       "pool": "(fr)Pool",
       "add": "(fr)Add",
       "remove": "(fr)Remove",
-      "editTypistGroup": "(fr)Edit Transcriptionist Group",
-      "save": "(fr)Save"
+      "editTypistGroup": "(fr)Edit Transcriptionist Group"
     },
     "message": {
       "selectedTypistEmptyError": "(fr)TranscriptionistがいないTranscriptionistGroupは保存できません。1名以上をTranscriptionistとして選択してください。",
       "groupSaveFailedError": "(fr)TypistGroupの保存に失敗しました。画面を更新し、再度実行してください"
     }
+  },
+  "worktypeIdSetting": {
+    "label": {
+      "title": "(fr)Worktype ID Setting",
+      "activeWorktypeId": "(fr)Active Worktype ID",
+      "addWorktypeId": "(fr)Add Worktype ID",
+      "worktypeId": "(fr)Worktype ID",
+      "description": "(fr)Description",
+      "optionItem": "(fr)Option Item"
+    }
   }
 }