@charset "UTF-8";
@font-face {
  font-family: "Pretendard GOV";
  src: url("/resources/SITE/root/fonts/PretendardGOV-Thin.woff2") format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard GOV";
  src: url("/resources/SITE/root/fonts/PretendardGOV-ExtraLight.woff2") format("woff2");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard GOV";
  src: url("/resources/SITE/root/fonts/PretendardGOV-Light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard GOV";
  src: url("/resources/SITE/root/fonts/PretendardGOV-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard GOV";
  src: url("/resources/SITE/root/fonts/PretendardGOV-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard GOV";
  src: url("/resources/SITE/root/fonts/PretendardGOV-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard GOV";
  src: url("/resources/SITE/root/fonts/PretendardGOV-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Pretendard GOV";
  src: url("/resources/SITE/root/fonts/PretendardGOV-ExtraBold.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
/* Do not edit directly */
/* Generated on Tue, May 19, 2026, 01:41:52 PM GMT+9 */
:root {
  /* PRIMITIVE */
  --krds-color-light-primary-5: #ecf2fe;
  --krds-color-light-primary-10: #d8e5fd;
  --krds-color-light-primary-20: #b1cefb;
  --krds-color-light-primary-30: #86aff9;
  --krds-color-light-primary-40: #4c87f6;
  --krds-color-light-primary-50: #256ef4;
  --krds-color-light-primary-60: #0b50d0;
  --krds-color-light-primary-70: #083891;
  --krds-color-light-primary-80: #052561;
  --krds-color-light-primary-90: #03163a;
  --krds-color-light-primary-95: #020f27;
  --krds-color-light-secondary-5: #eef2f7;
  --krds-color-light-secondary-10: #d6e0eb;
  --krds-color-light-secondary-20: #bacbde;
  --krds-color-light-secondary-30: #90b0d5;
  --krds-color-light-secondary-40: #6b96c7;
  --krds-color-light-secondary-50: #346fb2;
  --krds-color-light-secondary-60: #1c589c;
  --krds-color-light-secondary-70: #063a74;
  --krds-color-light-secondary-80: #052b57;
  --krds-color-light-secondary-90: #031f3f;
  --krds-color-light-secondary-95: #02162c;
  --krds-color-light-gray-0: #ffffff;
  --krds-color-light-gray-5: #f4f5f6;
  --krds-color-light-gray-10: #e6e8ea;
  --krds-color-light-gray-20: #cdd1d5;
  --krds-color-light-gray-30: #b1b8be;
  --krds-color-light-gray-40: #8a949e;
  --krds-color-light-gray-50: #6d7882;
  --krds-color-light-gray-60: #58616a;
  --krds-color-light-gray-70: #464c53;
  --krds-color-light-gray-80: #33363d;
  --krds-color-light-gray-90: #1e2124;
  --krds-color-light-gray-95: #131416;
  --krds-color-light-gray-100: #000000;
  --krds-color-light-alpha-black100: #000000;
  --krds-color-light-alpha-black75: #000000bf;
  --krds-color-light-alpha-black50: #00000080;
  --krds-color-light-alpha-black25: #00000040;
  --krds-color-light-alpha-black10: #0000001a;
  --krds-color-light-alpha-black0: #00000000;
  --krds-color-light-alpha-white100: #ffffff;
  --krds-color-light-alpha-white75: #ffffffbf;
  --krds-color-light-alpha-white50: #ffffff80;
  --krds-color-light-alpha-white25: #ffffff40;
  --krds-color-light-alpha-white10: #ffffff1a;
  --krds-color-light-alpha-white0: #ffffff00;
  --krds-color-light-danger-5: #fdefec;
  --krds-color-light-danger-10: #fcdfd9;
  --krds-color-light-danger-20: #f7afa1;
  --krds-color-light-danger-30: #f48771;
  --krds-color-light-danger-40: #f05f42;
  --krds-color-light-danger-50: #de3412;
  --krds-color-light-danger-60: #bd2c0f;
  --krds-color-light-danger-70: #8a240f;
  --krds-color-light-danger-80: #5c180a;
  --krds-color-light-danger-90: #390d05;
  --krds-color-light-danger-95: #260903;
  --krds-color-light-information-5: #e7f4fe;
  --krds-color-light-information-10: #d3ebfd;
  --krds-color-light-information-20: #9ed2fa;
  --krds-color-light-information-30: #5fb5f7;
  --krds-color-light-information-40: #2098f3;
  --krds-color-light-information-50: #0b78cb;
  --krds-color-light-information-60: #096ab3;
  --krds-color-light-information-70: #085691;
  --krds-color-light-information-80: #053961;
  --krds-color-light-information-90: #03253f;
  --krds-color-light-information-95: #021a2c;
  --krds-color-light-warning-5: #fff3db;
  --krds-color-light-warning-10: #ffe0a3;
  --krds-color-light-warning-20: #ffc95c;
  --krds-color-light-warning-30: #ffb114;
  --krds-color-light-warning-40: #c78500;
  --krds-color-light-warning-50: #9e6a00;
  --krds-color-light-warning-60: #8a5c00;
  --krds-color-light-warning-70: #614100;
  --krds-color-light-warning-80: #422c00;
  --krds-color-light-warning-90: #2e1f00;
  --krds-color-light-warning-95: #241800;
  --krds-color-light-success-5: #eaf6ec;
  --krds-color-light-success-10: #d8eedd;
  --krds-color-light-success-20: #a9dab4;
  --krds-color-light-success-30: #7ec88e;
  --krds-color-light-success-40: #3fa654;
  --krds-color-light-success-50: #228738;
  --krds-color-light-success-60: #267337;
  --krds-color-light-success-70: #285d33;
  --krds-color-light-success-80: #1f4727;
  --krds-color-light-success-90: #122b18;
  --krds-color-light-success-95: #0e2012;
  --krds-color-light-point-5: #fbeff0;
  --krds-color-light-point-10: #f5d6d9;
  --krds-color-light-point-20: #ebadb2;
  --krds-color-light-point-30: #e0858c;
  --krds-color-light-point-40: #d65c66;
  --krds-color-light-point-50: #d63d4a;
  --krds-color-light-point-60: #ab2b36;
  --krds-color-light-point-70: #7a1f26;
  --krds-color-light-point-80: #521419;
  --krds-color-light-point-90: #310c0f;
  --krds-color-light-point-95: #21080a;
  --krds-color-light-graphic-10: #e5ecf9;
  --krds-color-light-graphic-30: #98acc5;
  --krds-color-light-graphic-50: #61758f;
  --krds-color-light-graphic-70: #39506c;
  --krds-color-light-graphic-90: #223a58;
  --krds-color-high-contrast-gray-0: #ffffff;
  --krds-color-high-contrast-gray-5: #f4f5f6;
  --krds-color-high-contrast-gray-10: #e6e8ea;
  --krds-color-high-contrast-gray-20: #cdd1d5;
  --krds-color-high-contrast-gray-30: #b1b8be;
  --krds-color-high-contrast-gray-40: #8a949e;
  --krds-color-high-contrast-gray-50: #6d7882;
  --krds-color-high-contrast-gray-60: #58616a;
  --krds-color-high-contrast-gray-70: #464c53;
  --krds-color-high-contrast-gray-80: #33363d;
  --krds-color-high-contrast-gray-90: #1e2124;
  --krds-color-high-contrast-gray-95: #131416;
  --krds-color-high-contrast-gray-100: #000000;
  --krds-color-high-contrast-primary-5: #ecf2fe;
  --krds-color-high-contrast-primary-10: #d8e5fd;
  --krds-color-high-contrast-primary-20: #b1cefb;
  --krds-color-high-contrast-primary-30: #86aff9;
  --krds-color-high-contrast-primary-40: #4c87f6;
  --krds-color-high-contrast-primary-50: #256ef4;
  --krds-color-high-contrast-primary-60: #0b50d0;
  --krds-color-high-contrast-primary-70: #083891;
  --krds-color-high-contrast-primary-80: #052561;
  --krds-color-high-contrast-primary-90: #03163a;
  --krds-color-high-contrast-primary-95: #020f27;
  --krds-color-high-contrast-secondary-5: #edf6f8;
  --krds-color-high-contrast-secondary-10: #d5ebf1;
  --krds-color-high-contrast-secondary-20: #abd8e3;
  --krds-color-high-contrast-secondary-30: #75c0d1;
  --krds-color-high-contrast-secondary-40: #3d9fb8;
  --krds-color-high-contrast-secondary-50: #268097;
  --krds-color-high-contrast-secondary-60: #1f687a;
  --krds-color-high-contrast-secondary-70: #17505e;
  --krds-color-high-contrast-secondary-80: #113b45;
  --krds-color-high-contrast-secondary-90: #0e3139;
  --krds-color-high-contrast-secondary-95: #091f25;
  --krds-color-high-contrast-point-5: #fbeff0;
  --krds-color-high-contrast-point-10: #f5d6d9;
  --krds-color-high-contrast-point-20: #ebadb2;
  --krds-color-high-contrast-point-30: #e0858c;
  --krds-color-high-contrast-point-40: #d65c66;
  --krds-color-high-contrast-point-50: #d63d4a;
  --krds-color-high-contrast-point-60: #ab2b36;
  --krds-color-high-contrast-point-70: #7a1f26;
  --krds-color-high-contrast-point-80: #521419;
  --krds-color-high-contrast-point-90: #310c0f;
  --krds-color-high-contrast-point-95: #21080a;
  --krds-color-high-contrast-danger-5: #fdefec;
  --krds-color-high-contrast-danger-10: #fcdfd9;
  --krds-color-high-contrast-danger-20: #f7afa1;
  --krds-color-high-contrast-danger-30: #f48771;
  --krds-color-high-contrast-danger-40: #f05f42;
  --krds-color-high-contrast-danger-50: #de3412;
  --krds-color-high-contrast-danger-60: #bd2c0f;
  --krds-color-high-contrast-danger-70: #8a240f;
  --krds-color-high-contrast-danger-80: #5c180a;
  --krds-color-high-contrast-danger-90: #390d05;
  --krds-color-high-contrast-danger-95: #260903;
  --krds-color-high-contrast-warning-5: #fff3db;
  --krds-color-high-contrast-warning-10: #ffe0a3;
  --krds-color-high-contrast-warning-20: #ffc95c;
  --krds-color-high-contrast-warning-30: #ffb114;
  --krds-color-high-contrast-warning-40: #c78500;
  --krds-color-high-contrast-warning-50: #9e6a00;
  --krds-color-high-contrast-warning-60: #8a5c00;
  --krds-color-high-contrast-warning-70: #614100;
  --krds-color-high-contrast-warning-80: #422c00;
  --krds-color-high-contrast-warning-90: #2e1f00;
  --krds-color-high-contrast-warning-95: #241800;
  --krds-color-high-contrast-success-5: #eaf6ec;
  --krds-color-high-contrast-success-10: #d8eedd;
  --krds-color-high-contrast-success-20: #a9dab4;
  --krds-color-high-contrast-success-30: #7ec88e;
  --krds-color-high-contrast-success-40: #3fa654;
  --krds-color-high-contrast-success-50: #228738;
  --krds-color-high-contrast-success-60: #267337;
  --krds-color-high-contrast-success-70: #285d33;
  --krds-color-high-contrast-success-80: #1f4727;
  --krds-color-high-contrast-success-90: #122b18;
  --krds-color-high-contrast-success-95: #0e2012;
  --krds-color-high-contrast-information-5: #e7f4fe;
  --krds-color-high-contrast-information-10: #d3ebfd;
  --krds-color-high-contrast-information-20: #9ed2fa;
  --krds-color-high-contrast-information-30: #5fb5f7;
  --krds-color-high-contrast-information-40: #2098f3;
  --krds-color-high-contrast-information-50: #0b78cb;
  --krds-color-high-contrast-information-60: #096ab3;
  --krds-color-high-contrast-information-70: #085691;
  --krds-color-high-contrast-information-80: #053961;
  --krds-color-high-contrast-information-90: #03253f;
  --krds-color-high-contrast-information-95: #021a2c;
  --krds-color-high-contrast-alpha-black100: #000000;
  --krds-color-high-contrast-alpha-black75: #000000bf;
  --krds-color-high-contrast-alpha-black50: #00000080;
  --krds-color-high-contrast-alpha-black25: #00000040;
  --krds-color-high-contrast-alpha-black10: #0000001a;
  --krds-color-high-contrast-alpha-black0: #00000000;
  --krds-color-high-contrast-alpha-white100: #ffffff;
  --krds-color-high-contrast-alpha-white75: #ffffffbf;
  --krds-color-high-contrast-alpha-white50: #ffffff80;
  --krds-color-high-contrast-alpha-white25: #ffffff40;
  --krds-color-high-contrast-alpha-white10: #ffffff1a;
  --krds-color-high-contrast-alpha-white0: #ffffff00;
  --krds-color-high-contrast-graphic-10: #e5ecf9;
  --krds-color-high-contrast-graphic-30: #98acc5;
  --krds-color-high-contrast-graphic-50: #61758f;
  --krds-color-high-contrast-graphic-70: #39506c;
  --krds-color-high-contrast-graphic-90: #223a58;
  --krds-typo-font-type: Pretendard GOV;
  --krds-typo-font-weight-regular: Regular;
  --krds-typo-font-weight-bold: Bold;
  --krds-typo-letter-spacing-0: 0rem;
  --krds-typo-letter-spacing-1: 0.1rem;
  --krds-number-0: 0rem;
  --krds-number-1: 0.1rem;
  --krds-number-2: 0.2rem;
  --krds-number-3: 0.4rem;
  --krds-number-4: 0.6rem;
  --krds-number-5: 0.8rem;
  --krds-number-6: 1rem;
  --krds-number-7: 1.2rem;
  --krds-number-8: 1.6rem;
  --krds-number-9: 2rem;
  --krds-number-10: 2.4rem;
  --krds-number-11: 2.8rem;
  --krds-number-12: 3.2rem;
  --krds-number-13: 3.6rem;
  --krds-number-14: 4rem;
  --krds-number-15: 4.4rem;
  --krds-number-16: 4.8rem;
  --krds-number-17: 5.6rem;
  --krds-number-18: 6.4rem;
  --krds-number-19: 7.2rem;
  --krds-number-20: 8rem;
  --krds-number-21: 9.6rem;
  --krds-number-max: 100rem;
  /* MODE-LIGHT */
  --krds-light-color-surface-gray-subtler: var(--krds-color-light-gray-5);
  --krds-light-color-surface-gray-subtle: var(--krds-color-light-gray-10);
  --krds-light-color-surface-disabled: var(--krds-color-light-gray-20);
  --krds-light-color-surface-primary-subtler: var(--krds-color-light-primary-5);
  --krds-light-color-surface-secondary-subtler: var(--krds-color-light-secondary-5);
  --krds-light-color-surface-danger-subtler: var(--krds-color-light-danger-5);
  --krds-light-color-surface-warning-subtler: var(--krds-color-light-warning-5);
  --krds-light-color-surface-success-subtler: var(--krds-color-light-success-5);
  --krds-light-color-surface-information-subtler: var(--krds-color-light-information-5);
  --krds-light-color-surface-point-subtler: var(--krds-color-light-point-5);
  --krds-light-color-surface-white: var(--krds-color-light-gray-0);
  --krds-light-color-surface-inverse: var(--krds-color-light-gray-90);
  --krds-light-color-surface-white-static: var(--krds-color-light-gray-0);
  --krds-light-color-surface-inverse-static: var(--krds-color-light-gray-90);
  --krds-light-color-surface-white-subtle: var(--krds-color-light-gray-0);
  --krds-light-color-surface-white-subtler: var(--krds-color-light-gray-0);
  --krds-light-color-border-gray-light: var(--krds-color-light-gray-20);
  --krds-light-color-border-gray: var(--krds-color-light-gray-30);
  --krds-light-color-border-secondary-light: var(--krds-color-light-secondary-10);
  --krds-light-color-border-danger-light: var(--krds-color-light-danger-10);
  --krds-light-color-border-danger: var(--krds-color-light-danger-50);
  --krds-light-color-border-warning-light: var(--krds-color-light-warning-10);
  --krds-light-color-border-warning: var(--krds-color-light-warning-50);
  --krds-light-color-border-success-light: var(--krds-color-light-success-10);
  --krds-light-color-border-success: var(--krds-color-light-success-50);
  --krds-light-color-border-information-light: var(--krds-color-light-information-10);
  --krds-light-color-border-information: var(--krds-color-light-information-50);
  --krds-light-color-border-gray-dark: var(--krds-color-light-gray-60);
  --krds-light-color-border-primary: var(--krds-color-light-primary-50);
  --krds-light-color-border-disabled: var(--krds-color-light-gray-30);
  --krds-light-color-border-gray-darker: var(--krds-color-light-gray-90);
  --krds-light-color-border-secondary: var(--krds-color-light-secondary-70);
  --krds-light-color-border-inverse: var(--krds-color-light-gray-0);
  --krds-light-color-border-transparency: var(--krds-color-light-alpha-black0);
  --krds-light-color-border-primary-light: var(--krds-color-light-primary-10);
  --krds-light-color-border-point: var(--krds-color-light-point-50);
  --krds-light-color-border-point-light: var(--krds-color-light-point-10);
  --krds-light-color-divider-gray-light: var(--krds-color-light-gray-20);
  --krds-light-color-divider-gray: var(--krds-color-light-gray-40);
  --krds-light-color-divider-gray-dark: var(--krds-color-light-gray-50);
  --krds-light-color-divider-primary: var(--krds-color-light-primary-50);
  --krds-light-color-divider-secondary-light: var(--krds-color-light-secondary-10);
  --krds-light-color-divider-secondary: var(--krds-color-light-secondary-70);
  --krds-light-color-divider-error: var(--krds-color-light-danger-50);
  --krds-light-color-divider-primary-light: var(--krds-color-light-primary-10);
  --krds-light-color-divider-inverse: var(--krds-color-light-gray-0);
  --krds-light-color-divider-gray-darker: var(--krds-color-light-gray-90);
  --krds-light-color-divider-point: var(--krds-color-light-point-50);
  --krds-light-color-text-bolder: var(--krds-color-light-gray-95);
  --krds-light-color-text-subtle: var(--krds-color-light-gray-70);
  --krds-light-color-text-disabled: var(--krds-color-light-gray-40);
  --krds-light-color-text-disabled-on: var(--krds-color-light-gray-50);
  --krds-light-color-text-primary: var(--krds-color-light-primary-60);
  --krds-light-color-text-secondary: var(--krds-color-light-secondary-80);
  --krds-light-color-text-danger: var(--krds-color-light-danger-60);
  --krds-light-color-text-warning: var(--krds-color-light-warning-60);
  --krds-light-color-text-success: var(--krds-color-light-success-60);
  --krds-light-color-text-information: var(--krds-color-light-information-60);
  --krds-light-color-text-basic: var(--krds-color-light-gray-90);
  --krds-light-color-text-point: var(--krds-color-light-point-60);
  --krds-light-color-text-bolder-inverse: var(--krds-color-light-gray-0);
  --krds-light-color-text-basic-inverse: var(--krds-color-light-gray-0);
  --krds-light-color-text-subtle-inverse: var(--krds-color-light-gray-30);
  --krds-light-color-text-inverse-static: var(--krds-color-light-gray-0);
  --krds-light-color-text-static: var(--krds-color-light-gray-90);
  --krds-light-color-icon-gray: var(--krds-color-light-gray-80);
  --krds-light-color-icon-gray-fill: var(--krds-color-light-gray-20);
  --krds-light-color-icon-inverse: var(--krds-color-light-gray-0);
  --krds-light-color-icon-primary: var(--krds-color-light-primary-50);
  --krds-light-color-icon-secondary: var(--krds-color-light-secondary-80);
  --krds-light-color-icon-point: var(--krds-color-light-point-50);
  --krds-light-color-icon-danger: var(--krds-color-light-danger-50);
  --krds-light-color-icon-warning: var(--krds-color-light-warning-50);
  --krds-light-color-icon-success: var(--krds-color-light-success-50);
  --krds-light-color-icon-information: var(--krds-color-light-information-50);
  --krds-light-color-icon-gray-light: var(--krds-color-light-gray-70);
  --krds-light-color-icon-disabled: var(--krds-color-light-gray-40);
  --krds-light-color-icon-disabled-on: var(--krds-color-light-gray-50);
  --krds-light-color-icon-inverse-static: var(--krds-color-light-gray-0);
  --krds-light-color-icon-primary-static: var(--krds-color-light-primary-50);
  --krds-light-color-icon-secondary-static: var(--krds-color-light-secondary-80);
  --krds-light-color-icon-point-static: var(--krds-color-light-point-50);
  --krds-light-color-icon-danger-static: var(--krds-color-light-danger-50);
  --krds-light-color-icon-warning-static: var(--krds-color-light-warning-50);
  --krds-light-color-icon-success-static: var(--krds-color-light-success-50);
  --krds-light-color-icon-information-static: var(--krds-color-light-information-50);
  --krds-light-color-icon-gray-static: var(--krds-color-light-gray-80);
  --krds-light-color-link-default: var(--krds-color-light-primary-50);
  --krds-light-color-link-hover: var(--krds-color-light-primary-60);
  --krds-light-color-link-pressed: var(--krds-color-light-primary-70);
  --krds-light-color-link-visited: #5917b8;
  --krds-light-color-button-primary-fill: var(--krds-color-light-primary-50);
  --krds-light-color-button-primary-fill-hover: var(--krds-color-light-primary-60);
  --krds-light-color-button-primary-fill-pressed: var(--krds-color-light-primary-70);
  --krds-light-color-button-secondary-fill: var(--krds-color-light-primary-5);
  --krds-light-color-button-secondary-fill-hover: var(--krds-color-light-primary-10);
  --krds-light-color-button-secondary-fill-pressed: var(--krds-color-light-primary-20);
  --krds-light-color-button-secondary-border: var(--krds-color-light-primary-50);
  --krds-light-color-button-tertiary-fill: var(--krds-color-light-alpha-white0);
  --krds-light-color-button-tertiary-fill-hover: var(--krds-color-light-gray-5);
  --krds-light-color-button-tertiary-fill-pressed: var(--krds-color-light-gray-10);
  --krds-light-color-button-tertiary-border: var(--krds-color-light-gray-60);
  --krds-light-color-button-disabled-fill: var(--krds-color-light-gray-20);
  --krds-light-color-button-text-fill-hover: var(--krds-color-light-secondary-5);
  --krds-light-color-button-text-fill-pressed: var(--krds-color-light-secondary-10);
  --krds-light-color-button-text-fill: var(--krds-color-light-alpha-white0);
  --krds-light-color-button-text-border: var(--krds-color-light-alpha-black0);
  --krds-light-color-button-disabled-border: var(--krds-color-light-gray-30);
  --krds-light-color-background-white: var(--krds-color-light-gray-0);
  --krds-light-color-background-inverse: var(--krds-color-light-gray-90);
  --krds-light-color-background-gray-subtler: var(--krds-color-light-gray-5);
  --krds-light-color-background-gray-subtle: var(--krds-color-light-gray-10);
  --krds-light-color-background-dim: var(--krds-color-light-alpha-black75);
  --krds-light-color-element-disabled-light: var(--krds-color-light-gray-20);
  --krds-light-color-element-disabled-dark: var(--krds-color-light-gray-40);
  --krds-light-color-element-gray-lighter: var(--krds-color-light-gray-5);
  --krds-light-color-element-gray-light: var(--krds-color-light-gray-10);
  --krds-light-color-element-gray: var(--krds-color-light-gray-50);
  --krds-light-color-element-primary-lighter: var(--krds-color-light-primary-5);
  --krds-light-color-element-primary-light: var(--krds-color-light-primary-10);
  --krds-light-color-element-primary: var(--krds-color-light-primary-50);
  --krds-light-color-element-secondary-lighter: var(--krds-color-light-secondary-5);
  --krds-light-color-element-secondary-light: var(--krds-color-light-secondary-10);
  --krds-light-color-element-secondary: var(--krds-color-light-secondary-70);
  --krds-light-color-element-point-lighter: var(--krds-color-light-point-5);
  --krds-light-color-element-point-light: var(--krds-color-light-point-10);
  --krds-light-color-element-point: var(--krds-color-light-point-50);
  --krds-light-color-element-danger-lighter: var(--krds-color-light-danger-5);
  --krds-light-color-element-danger: var(--krds-color-light-danger-50);
  --krds-light-color-element-warning-lighter: var(--krds-color-light-warning-5);
  --krds-light-color-element-warning: var(--krds-color-light-warning-30);
  --krds-light-color-element-success-lighter: var(--krds-color-light-success-5);
  --krds-light-color-element-success: var(--krds-color-light-success-50);
  --krds-light-color-element-information-lighter: var(--krds-color-light-information-5);
  --krds-light-color-element-information: var(--krds-color-light-information-50);
  --krds-light-color-element-inverse: var(--krds-color-light-gray-0);
  --krds-light-color-element-gray-dark: var(--krds-color-light-gray-60);
  --krds-light-color-element-inverse-static: var(--krds-color-light-gray-0);
  --krds-light-color-action-white: var(--krds-color-light-gray-0);
  --krds-light-color-action-primary: var(--krds-color-light-alpha-white0);
  --krds-light-color-action-primary-hover: var(--krds-color-light-primary-5);
  --krds-light-color-action-primary-pressed: var(--krds-color-light-primary-10);
  --krds-light-color-action-secondary: var(--krds-color-light-alpha-white0);
  --krds-light-color-action-secondary-hover: var(--krds-color-light-secondary-5);
  --krds-light-color-action-secondary-pressed: var(--krds-color-light-secondary-10);
  --krds-light-color-action-secondary-selected: var(--krds-color-light-secondary-5);
  --krds-light-color-action-secondary-on: var(--krds-color-light-alpha-white0);
  --krds-light-color-action-secondary-on-hover: var(--krds-color-light-gray-0);
  --krds-light-color-action-secondary-on-pressed: var(--krds-color-light-secondary-10);
  --krds-light-color-action-secondary-on-selected: var(--krds-color-light-gray-0);
  --krds-light-color-action-secondary-active: var(--krds-color-light-secondary-70);
  --krds-light-color-action-primary-active: var(--krds-color-light-primary-50);
  --krds-light-color-action-disabled: var(--krds-color-light-gray-20);
  --krds-light-color-action-primary-selected: var(--krds-color-light-primary-5);
  --krds-light-color-input-border: var(--krds-color-light-gray-60);
  --krds-light-color-input-border-disabled: var(--krds-color-light-gray-30);
  --krds-light-color-input-border-active: var(--krds-color-light-primary-50);
  --krds-light-color-input-border-error: var(--krds-color-light-danger-50);
  --krds-light-color-input-surface: var(--krds-color-light-gray-0);
  --krds-light-color-input-surface-disabled: var(--krds-color-light-gray-20);
  --krds-light-color-graphic-blue-subtler: var(--krds-color-light-graphic-10);
  --krds-light-color-graphic-blue-subtle: var(--krds-color-light-graphic-30);
  --krds-light-color-graphic-blue: var(--krds-color-light-graphic-50);
  --krds-light-color-graphic-blue-dark: var(--krds-color-light-graphic-70);
  --krds-light-color-graphic-blue-darker: var(--krds-color-light-graphic-90);
  --krds-light-color-graphic-red-subtler: var(--krds-color-light-point-5);
  --krds-light-color-graphic-red-subtle: var(--krds-color-light-point-10);
  --krds-light-color-graphic-red: var(--krds-color-high-contrast-point-20);
  --krds-light-color-graphic-red-dark: var(--krds-color-high-contrast-point-40);
  --krds-light-color-graphic-red-darker: var(--krds-color-high-contrast-point-70);
  --krds-light-color-graphic-brand: var(--krds-color-light-primary-50);
  --krds-light-color-alpha-base100: var(--krds-color-light-alpha-white100);
  --krds-light-color-alpha-base50: var(--krds-color-light-alpha-white50);
  --krds-light-color-alpha-base25: var(--krds-color-high-contrast-alpha-white25);
  --krds-light-color-alpha-base0: var(--krds-color-light-alpha-white0);
  --krds-light-color-alpha-inverse100: var(--krds-color-light-alpha-black100);
  --krds-light-color-alpha-inverse50: var(--krds-color-light-alpha-black50);
  --krds-light-color-alpha-inverse25: var(--krds-color-light-alpha-black25);
  --krds-light-color-alpha-inverse0: var(--krds-color-light-alpha-black0);
  --krds-light-color-alpha-base75: var(--krds-color-light-alpha-white75);
  --krds-light-color-alpha-inverse75: var(--krds-color-light-alpha-black75);
  --krds-light-color-alpha-inverse10: var(--krds-color-light-alpha-black10);
  --krds-light-color-alpha-base10: var(--krds-color-high-contrast-alpha-white10);
  --krds-light-color-alpha-shadow1: #0000000d;
  --krds-light-color-alpha-shadow2: #00000014;
  --krds-light-color-alpha-shadow3: #0000001f;
  --krds-light-border-width-variable-regular: 0.1rem;
  --krds-light-border-width-variable-medium: 0.2rem;
  --krds-light-border-width-static-regular: 0.1rem;
  --krds-light-border-width-static-medium: 0.2rem;
  /* MODE-HIGH-CONTRAST */
  --krds-high-contrast-color-surface-gray-subtler: var(--krds-color-high-contrast-gray-95);
  --krds-high-contrast-color-surface-gray-subtle: var(--krds-color-high-contrast-gray-90);
  --krds-high-contrast-color-surface-disabled: var(--krds-color-high-contrast-gray-70);
  --krds-high-contrast-color-surface-primary-subtler: var(--krds-color-high-contrast-primary-95);
  --krds-high-contrast-color-surface-secondary-subtler: var(--krds-color-high-contrast-secondary-95);
  --krds-high-contrast-color-surface-danger-subtler: var(--krds-color-high-contrast-danger-95);
  --krds-high-contrast-color-surface-warning-subtler: var(--krds-color-high-contrast-warning-95);
  --krds-high-contrast-color-surface-success-subtler: var(--krds-color-high-contrast-success-95);
  --krds-high-contrast-color-surface-information-subtler: var(--krds-color-high-contrast-information-95);
  --krds-high-contrast-color-surface-point-subtler: var(--krds-color-high-contrast-point-95);
  --krds-high-contrast-color-surface-white: var(--krds-color-high-contrast-gray-100);
  --krds-high-contrast-color-surface-inverse: var(--krds-color-high-contrast-gray-10);
  --krds-high-contrast-color-surface-white-static: var(--krds-color-high-contrast-gray-0);
  --krds-high-contrast-color-surface-inverse-static: var(--krds-color-high-contrast-gray-90);
  --krds-high-contrast-color-surface-white-subtle: var(--krds-color-high-contrast-gray-95);
  --krds-high-contrast-color-surface-white-subtler: var(--krds-color-high-contrast-gray-90);
  --krds-high-contrast-color-border-gray-light: var(--krds-color-high-contrast-gray-80);
  --krds-high-contrast-color-border-gray: var(--krds-color-high-contrast-gray-70);
  --krds-high-contrast-color-border-secondary-light: var(--krds-color-high-contrast-secondary-90);
  --krds-high-contrast-color-border-danger-light: var(--krds-color-high-contrast-danger-90);
  --krds-high-contrast-color-border-danger: var(--krds-color-high-contrast-danger-50);
  --krds-high-contrast-color-border-warning-light: var(--krds-color-high-contrast-warning-90);
  --krds-high-contrast-color-border-warning: var(--krds-color-high-contrast-warning-50);
  --krds-high-contrast-color-border-success-light: var(--krds-color-high-contrast-success-90);
  --krds-high-contrast-color-border-success: var(--krds-color-high-contrast-success-50);
  --krds-high-contrast-color-border-information-light: var(--krds-color-high-contrast-information-90);
  --krds-high-contrast-color-border-information: var(--krds-color-high-contrast-information-50);
  --krds-high-contrast-color-border-gray-dark: var(--krds-color-high-contrast-gray-40);
  --krds-high-contrast-color-border-primary: var(--krds-color-high-contrast-primary-50);
  --krds-high-contrast-color-border-disabled: var(--krds-color-high-contrast-gray-70);
  --krds-high-contrast-color-border-gray-darker: var(--krds-color-high-contrast-gray-10);
  --krds-high-contrast-color-border-secondary: var(--krds-color-high-contrast-secondary-60);
  --krds-high-contrast-color-border-inverse: var(--krds-color-high-contrast-gray-100);
  --krds-high-contrast-color-border-transparency: var(--krds-color-high-contrast-alpha-white25);
  --krds-high-contrast-color-border-primary-light: var(--krds-color-high-contrast-primary-90);
  --krds-high-contrast-color-border-point: var(--krds-color-high-contrast-point-50);
  --krds-high-contrast-color-border-point-light: var(--krds-color-high-contrast-point-90);
  --krds-high-contrast-color-divider-gray-light: var(--krds-color-high-contrast-gray-80);
  --krds-high-contrast-color-divider-gray: var(--krds-color-high-contrast-gray-70);
  --krds-high-contrast-color-divider-gray-dark: var(--krds-color-high-contrast-gray-50);
  --krds-high-contrast-color-divider-primary: var(--krds-color-high-contrast-primary-50);
  --krds-high-contrast-color-divider-secondary-light: var(--krds-color-high-contrast-secondary-90);
  --krds-high-contrast-color-divider-secondary: var(--krds-color-high-contrast-secondary-60);
  --krds-high-contrast-color-divider-error: var(--krds-color-high-contrast-danger-50);
  --krds-high-contrast-color-divider-primary-light: var(--krds-color-high-contrast-primary-90);
  --krds-high-contrast-color-divider-inverse: var(--krds-color-high-contrast-gray-100);
  --krds-high-contrast-color-divider-gray-darker: var(--krds-color-high-contrast-gray-10);
  --krds-high-contrast-color-divider-point: var(--krds-color-high-contrast-point-50);
  --krds-high-contrast-color-text-bolder: var(--krds-color-high-contrast-gray-10);
  --krds-high-contrast-color-text-subtle: var(--krds-color-high-contrast-gray-20);
  --krds-high-contrast-color-text-disabled: var(--krds-color-high-contrast-gray-60);
  --krds-high-contrast-color-text-disabled-on: var(--krds-color-high-contrast-gray-50);
  --krds-high-contrast-color-text-primary: var(--krds-color-high-contrast-primary-20);
  --krds-high-contrast-color-text-secondary: var(--krds-color-high-contrast-secondary-20);
  --krds-high-contrast-color-text-danger: var(--krds-color-high-contrast-danger-20);
  --krds-high-contrast-color-text-warning: var(--krds-color-high-contrast-warning-20);
  --krds-high-contrast-color-text-success: var(--krds-color-high-contrast-success-20);
  --krds-high-contrast-color-text-information: var(--krds-color-high-contrast-information-20);
  --krds-high-contrast-color-text-basic: var(--krds-color-high-contrast-gray-5);
  --krds-high-contrast-color-text-point: var(--krds-color-high-contrast-point-20);
  --krds-high-contrast-color-text-bolder-inverse: var(--krds-color-high-contrast-gray-95);
  --krds-high-contrast-color-text-basic-inverse: var(--krds-color-high-contrast-gray-90);
  --krds-high-contrast-color-text-subtle-inverse: var(--krds-color-high-contrast-gray-70);
  --krds-high-contrast-color-text-inverse-static: var(--krds-color-high-contrast-gray-0);
  --krds-high-contrast-color-text-static: var(--krds-color-high-contrast-gray-90);
  --krds-high-contrast-color-icon-gray: var(--krds-color-high-contrast-gray-5);
  --krds-high-contrast-color-icon-gray-fill: var(--krds-color-high-contrast-gray-70);
  --krds-high-contrast-color-icon-inverse: var(--krds-color-high-contrast-gray-90);
  --krds-high-contrast-color-icon-primary: var(--krds-color-high-contrast-primary-20);
  --krds-high-contrast-color-icon-secondary: var(--krds-color-high-contrast-secondary-20);
  --krds-high-contrast-color-icon-point: var(--krds-color-high-contrast-point-20);
  --krds-high-contrast-color-icon-danger: var(--krds-color-high-contrast-danger-20);
  --krds-high-contrast-color-icon-warning: var(--krds-color-high-contrast-warning-20);
  --krds-high-contrast-color-icon-success: var(--krds-color-high-contrast-success-20);
  --krds-high-contrast-color-icon-information: var(--krds-color-high-contrast-information-20);
  --krds-high-contrast-color-icon-gray-light: var(--krds-color-high-contrast-gray-20);
  --krds-high-contrast-color-icon-disabled: var(--krds-color-high-contrast-gray-60);
  --krds-high-contrast-color-icon-disabled-on: var(--krds-color-high-contrast-gray-50);
  --krds-high-contrast-color-icon-inverse-static: var(--krds-color-high-contrast-gray-0);
  --krds-high-contrast-color-icon-primary-static: var(--krds-color-high-contrast-primary-50);
  --krds-high-contrast-color-icon-secondary-static: var(--krds-color-high-contrast-secondary-80);
  --krds-high-contrast-color-icon-point-static: var(--krds-color-high-contrast-point-50);
  --krds-high-contrast-color-icon-danger-static: var(--krds-color-high-contrast-danger-50);
  --krds-high-contrast-color-icon-warning-static: var(--krds-color-high-contrast-warning-50);
  --krds-high-contrast-color-icon-success-static: var(--krds-color-high-contrast-success-50);
  --krds-high-contrast-color-icon-information-static: var(--krds-color-high-contrast-information-50);
  --krds-high-contrast-color-icon-gray-static: var(--krds-color-high-contrast-gray-80);
  --krds-high-contrast-color-link-default: var(--krds-color-high-contrast-primary-30);
  --krds-high-contrast-color-link-hover: var(--krds-color-high-contrast-primary-20);
  --krds-high-contrast-color-link-pressed: var(--krds-color-high-contrast-primary-10);
  --krds-high-contrast-color-link-visited: #c49ff9;
  --krds-high-contrast-color-button-primary-fill: var(--krds-color-high-contrast-primary-50);
  --krds-high-contrast-color-button-primary-fill-hover: var(--krds-color-high-contrast-primary-60);
  --krds-high-contrast-color-button-primary-fill-pressed: var(--krds-color-high-contrast-primary-70);
  --krds-high-contrast-color-button-secondary-fill: var(--krds-color-high-contrast-primary-95);
  --krds-high-contrast-color-button-secondary-fill-hover: var(--krds-color-high-contrast-primary-90);
  --krds-high-contrast-color-button-secondary-fill-pressed: var(--krds-color-high-contrast-primary-80);
  --krds-high-contrast-color-button-secondary-border: var(--krds-color-high-contrast-primary-50);
  --krds-high-contrast-color-button-tertiary-fill: var(--krds-color-high-contrast-alpha-black0);
  --krds-high-contrast-color-button-tertiary-fill-hover: var(--krds-color-high-contrast-gray-95);
  --krds-high-contrast-color-button-tertiary-fill-pressed: var(--krds-color-high-contrast-gray-80);
  --krds-high-contrast-color-button-tertiary-border: var(--krds-color-high-contrast-gray-40);
  --krds-high-contrast-color-button-disabled-fill: var(--krds-color-high-contrast-gray-80);
  --krds-high-contrast-color-button-text-fill-hover: var(--krds-color-high-contrast-secondary-95);
  --krds-high-contrast-color-button-text-fill-pressed: var(--krds-color-high-contrast-secondary-90);
  --krds-high-contrast-color-button-text-fill: var(--krds-color-high-contrast-alpha-black0);
  --krds-high-contrast-color-button-text-border: var(--krds-color-high-contrast-alpha-white50);
  --krds-high-contrast-color-button-disabled-border: var(--krds-color-high-contrast-gray-70);
  --krds-high-contrast-color-background-white: var(--krds-color-high-contrast-gray-100);
  --krds-high-contrast-color-background-inverse: var(--krds-color-high-contrast-gray-10);
  --krds-high-contrast-color-background-gray-subtler: var(--krds-color-high-contrast-gray-95);
  --krds-high-contrast-color-background-gray-subtle: var(--krds-color-high-contrast-gray-90);
  --krds-high-contrast-color-background-dim: var(--krds-color-high-contrast-alpha-black75);
  --krds-high-contrast-color-element-disabled-light: var(--krds-color-high-contrast-gray-80);
  --krds-high-contrast-color-element-disabled-dark: var(--krds-color-high-contrast-gray-60);
  --krds-high-contrast-color-element-gray-lighter: var(--krds-color-high-contrast-gray-95);
  --krds-high-contrast-color-element-gray-light: var(--krds-color-high-contrast-gray-90);
  --krds-high-contrast-color-element-gray: var(--krds-color-high-contrast-gray-50);
  --krds-high-contrast-color-element-primary-lighter: var(--krds-color-high-contrast-primary-95);
  --krds-high-contrast-color-element-primary-light: var(--krds-color-high-contrast-primary-90);
  --krds-high-contrast-color-element-primary: var(--krds-color-high-contrast-primary-50);
  --krds-high-contrast-color-element-secondary-lighter: var(--krds-color-high-contrast-secondary-95);
  --krds-high-contrast-color-element-secondary-light: var(--krds-color-high-contrast-secondary-90);
  --krds-high-contrast-color-element-secondary: var(--krds-color-high-contrast-secondary-60);
  --krds-high-contrast-color-element-point-lighter: var(--krds-color-high-contrast-point-95);
  --krds-high-contrast-color-element-point-light: var(--krds-color-high-contrast-point-90);
  --krds-high-contrast-color-element-point: var(--krds-color-high-contrast-point-50);
  --krds-high-contrast-color-element-danger-lighter: var(--krds-color-high-contrast-danger-95);
  --krds-high-contrast-color-element-danger: var(--krds-color-high-contrast-danger-50);
  --krds-high-contrast-color-element-warning-lighter: var(--krds-color-high-contrast-warning-95);
  --krds-high-contrast-color-element-warning: var(--krds-color-high-contrast-warning-30);
  --krds-high-contrast-color-element-success-lighter: var(--krds-color-high-contrast-success-95);
  --krds-high-contrast-color-element-success: var(--krds-color-high-contrast-success-50);
  --krds-high-contrast-color-element-information-lighter: var(--krds-color-high-contrast-information-95);
  --krds-high-contrast-color-element-information: var(--krds-color-high-contrast-information-50);
  --krds-high-contrast-color-element-inverse: var(--krds-color-high-contrast-gray-95);
  --krds-high-contrast-color-element-gray-dark: var(--krds-color-high-contrast-gray-40);
  --krds-high-contrast-color-element-inverse-static: var(--krds-color-high-contrast-gray-0);
  --krds-high-contrast-color-action-white: var(--krds-color-light-gray-100);
  --krds-high-contrast-color-action-primary: var(--krds-color-high-contrast-alpha-black0);
  --krds-high-contrast-color-action-primary-hover: var(--krds-color-high-contrast-primary-95);
  --krds-high-contrast-color-action-primary-pressed: var(--krds-color-high-contrast-primary-90);
  --krds-high-contrast-color-action-secondary: var(--krds-color-light-alpha-black0);
  --krds-high-contrast-color-action-secondary-hover: var(--krds-color-high-contrast-secondary-95);
  --krds-high-contrast-color-action-secondary-pressed: var(--krds-color-high-contrast-secondary-90);
  --krds-high-contrast-color-action-secondary-selected: var(--krds-color-high-contrast-secondary-95);
  --krds-high-contrast-color-action-secondary-on: var(--krds-color-high-contrast-alpha-black0);
  --krds-high-contrast-color-action-secondary-on-hover: var(--krds-color-high-contrast-gray-100);
  --krds-high-contrast-color-action-secondary-on-pressed: var(--krds-color-high-contrast-secondary-90);
  --krds-high-contrast-color-action-secondary-on-selected: var(--krds-color-high-contrast-gray-95);
  --krds-high-contrast-color-action-secondary-active: var(--krds-color-high-contrast-secondary-60);
  --krds-high-contrast-color-action-primary-active: var(--krds-color-high-contrast-primary-50);
  --krds-high-contrast-color-action-disabled: var(--krds-color-high-contrast-gray-80);
  --krds-high-contrast-color-action-primary-selected: var(--krds-color-high-contrast-primary-95);
  --krds-high-contrast-color-input-border: var(--krds-color-high-contrast-gray-40);
  --krds-high-contrast-color-input-border-disabled: var(--krds-color-high-contrast-gray-70);
  --krds-high-contrast-color-input-border-active: var(--krds-color-high-contrast-primary-50);
  --krds-high-contrast-color-input-border-error: var(--krds-color-high-contrast-danger-50);
  --krds-high-contrast-color-input-surface: var(--krds-color-high-contrast-gray-90);
  --krds-high-contrast-color-input-surface-disabled: var(--krds-color-high-contrast-gray-95);
  --krds-high-contrast-color-graphic-blue-subtler: var(--krds-color-high-contrast-graphic-10);
  --krds-high-contrast-color-graphic-blue-subtle: var(--krds-color-high-contrast-graphic-30);
  --krds-high-contrast-color-graphic-blue: var(--krds-color-high-contrast-graphic-50);
  --krds-high-contrast-color-graphic-blue-dark: var(--krds-color-high-contrast-graphic-70);
  --krds-high-contrast-color-graphic-blue-darker: var(--krds-color-high-contrast-graphic-90);
  --krds-high-contrast-color-graphic-red-subtler: var(--krds-color-high-contrast-point-5);
  --krds-high-contrast-color-graphic-red-subtle: var(--krds-color-high-contrast-point-10);
  --krds-high-contrast-color-graphic-red: var(--krds-color-high-contrast-point-20);
  --krds-high-contrast-color-graphic-red-dark: var(--krds-color-high-contrast-point-40);
  --krds-high-contrast-color-graphic-red-darker: var(--krds-color-high-contrast-point-70);
  --krds-high-contrast-color-graphic-brand: var(--krds-color-high-contrast-primary-50);
  --krds-high-contrast-color-alpha-base100: var(--krds-color-high-contrast-alpha-black100);
  --krds-high-contrast-color-alpha-base50: var(--krds-color-high-contrast-alpha-black50);
  --krds-high-contrast-color-alpha-base25: var(--krds-color-high-contrast-alpha-black25);
  --krds-high-contrast-color-alpha-base0: var(--krds-color-light-alpha-black0);
  --krds-high-contrast-color-alpha-inverse100: var(--krds-color-high-contrast-alpha-white100);
  --krds-high-contrast-color-alpha-inverse50: var(--krds-color-high-contrast-alpha-white50);
  --krds-high-contrast-color-alpha-inverse25: var(--krds-color-high-contrast-alpha-white25);
  --krds-high-contrast-color-alpha-inverse0: var(--krds-color-high-contrast-alpha-white0);
  --krds-high-contrast-color-alpha-base75: var(--krds-color-high-contrast-alpha-black75);
  --krds-high-contrast-color-alpha-inverse75: var(--krds-color-high-contrast-alpha-white75);
  --krds-high-contrast-color-alpha-inverse10: var(--krds-color-high-contrast-alpha-black25);
  --krds-high-contrast-color-alpha-base10: var(--krds-color-high-contrast-alpha-black10);
  --krds-high-contrast-color-alpha-shadow1: #0000001f;
  --krds-high-contrast-color-alpha-shadow2: #00000033;
  --krds-high-contrast-color-alpha-shadow3: #00000066;
  --krds-high-contrast-border-width-variable-regular: 0.2rem;
  --krds-high-contrast-border-width-variable-medium: 0.3rem;
  --krds-high-contrast-border-width-static-regular: 0.1rem;
  --krds-high-contrast-border-width-static-medium: 0.2rem;
  /* RESPONSIVE-PC */
  --krds-pc-font-size-display-large: 6rem;
  --krds-pc-font-size-display-medium: 4.4rem;
  --krds-pc-font-size-display-small: 3.6rem;
  --krds-pc-font-size-body-large: 1.9rem;
  --krds-pc-font-size-body-medium: 1.7rem;
  --krds-pc-font-size-body-small: 1.5rem;
  --krds-pc-font-size-body-xsmall: 1.3rem;
  --krds-pc-font-size-label-large: 1.9rem;
  --krds-pc-font-size-label-medium: 1.7rem;
  --krds-pc-font-size-label-small: 1.5rem;
  --krds-pc-font-size-label-xsmall: 1.3rem;
  --krds-pc-font-size-heading-large: 3.2rem;
  --krds-pc-font-size-heading-medium: 2.4rem;
  --krds-pc-font-size-heading-small: 1.9rem;
  --krds-pc-font-size-heading-xsmall: 1.7rem;
  --krds-pc-font-size-heading-xxsmall: 1.5rem;
  --krds-pc-font-size-heading-xlarge: 4rem;
  --krds-pc-font-size-navigation-title-medium: 2.4rem;
  --krds-pc-font-size-navigation-title-small: 1.9rem;
  --krds-pc-font-size-navigation-depth-medium-bold: 1.7rem;
  --krds-pc-font-size-navigation-depth-medium: 1.7rem;
  --krds-pc-font-size-navigation-depth-small-bold: 1.5rem;
  --krds-pc-font-size-navigation-depth-small: 1.5rem;
  --krds-pc-gap-layout-header-breadcrumb: var(--krds-number-10);
  --krds-pc-gap-layout-left-contents: var(--krds-number-18);
  --krds-pc-gap-layout-contents-right: var(--krds-number-14);
  --krds-pc-gap-layout-h1-h2: var(--krds-number-16);
  --krds-pc-gap-layout-h2-h2: var(--krds-number-20);
  --krds-pc-gap-layout-h2-h3: var(--krds-number-14);
  --krds-pc-gap-layout-h3-h3: var(--krds-number-18);
  --krds-pc-gap-layout-h3-h4: var(--krds-number-10);
  --krds-pc-gap-layout-h4-h4: var(--krds-number-14);
  --krds-pc-gap-layout-h4-h5: var(--krds-number-8);
  --krds-pc-gap-layout-h5-h5: var(--krds-number-12);
  --krds-pc-gap-layout-title-body-small: var(--krds-number-8);
  --krds-pc-gap-layout-title-body-medium: var(--krds-number-9);
  --krds-pc-gap-layout-title-body-large: var(--krds-number-10);
  --krds-pc-gap-layout-breadcrumb-h1: var(--krds-number-14);
  --krds-pc-gap-layout-contents-footer: var(--krds-number-18);
  --krds-pc-gap-layout-text-text-large: var(--krds-number-9);
  --krds-pc-gap-layout-text-text-medium: var(--krds-number-8);
  --krds-pc-gap-layout-text-text-small: var(--krds-number-7);
  --krds-pc-gap-layout-image-text-small: var(--krds-number-9);
  --krds-pc-gap-layout-image-text-medium: var(--krds-number-10);
  --krds-pc-gap-layout-image-text-large: var(--krds-number-12);
  --krds-pc-padding-card-large: var(--krds-number-14);
  --krds-pc-padding-card-medium: var(--krds-number-12);
  --krds-pc-padding-card-small: var(--krds-number-10);
  --krds-pc-padding-card-xsmall: var(--krds-number-8);
  /* RESPONSIVE-MOBILE */
  --krds-mobile-font-size-display-large: 4.4rem;
  --krds-mobile-font-size-display-medium: 3.2rem;
  --krds-mobile-font-size-display-small: 2.8rem;
  --krds-mobile-font-size-body-large: 1.9rem;
  --krds-mobile-font-size-body-medium: 1.7rem;
  --krds-mobile-font-size-body-small: 1.5rem;
  --krds-mobile-font-size-body-xsmall: 1.3rem;
  --krds-mobile-font-size-label-large: 1.9rem;
  --krds-mobile-font-size-label-medium: 1.7rem;
  --krds-mobile-font-size-label-small: 1.5rem;
  --krds-mobile-font-size-label-xsmall: 1.3rem;
  --krds-mobile-font-size-heading-large: 2.4rem;
  --krds-mobile-font-size-heading-medium: 2.2rem;
  --krds-mobile-font-size-heading-small: 1.9rem;
  --krds-mobile-font-size-heading-xsmall: 1.7rem;
  --krds-mobile-font-size-heading-xxsmall: 1.5rem;
  --krds-mobile-font-size-heading-xlarge: 2.8rem;
  --krds-mobile-font-size-navigation-title-medium: 2.2rem;
  --krds-mobile-font-size-navigation-title-small: 1.9rem;
  --krds-mobile-font-size-navigation-depth-medium-bold: 1.7rem;
  --krds-mobile-font-size-navigation-depth-medium: 1.7rem;
  --krds-mobile-font-size-navigation-depth-small-bold: 1.5rem;
  --krds-mobile-font-size-navigation-depth-small: 1.5rem;
  --krds-mobile-gap-layout-header-breadcrumb: var(--krds-number-8);
  --krds-mobile-gap-layout-left-contents: 0rem;
  --krds-mobile-gap-layout-contents-right: 0rem;
  --krds-mobile-gap-layout-h1-h2: var(--krds-number-12);
  --krds-mobile-gap-layout-h2-h2: var(--krds-number-14);
  --krds-mobile-gap-layout-h2-h3: var(--krds-number-10);
  --krds-mobile-gap-layout-h3-h3: var(--krds-number-12);
  --krds-mobile-gap-layout-h3-h4: var(--krds-number-8);
  --krds-mobile-gap-layout-h4-h4: var(--krds-number-10);
  --krds-mobile-gap-layout-h4-h5: var(--krds-number-7);
  --krds-mobile-gap-layout-h5-h5: var(--krds-number-8);
  --krds-mobile-gap-layout-title-body-small: var(--krds-number-5);
  --krds-mobile-gap-layout-title-body-medium: var(--krds-number-7);
  --krds-mobile-gap-layout-title-body-large: var(--krds-number-9);
  --krds-mobile-gap-layout-breadcrumb-h1: var(--krds-number-12);
  --krds-mobile-gap-layout-contents-footer: var(--krds-number-14);
  --krds-mobile-gap-layout-text-text-large: var(--krds-number-8);
  --krds-mobile-gap-layout-text-text-medium: var(--krds-number-7);
  --krds-mobile-gap-layout-text-text-small: var(--krds-number-6);
  --krds-mobile-gap-layout-image-text-small: var(--krds-number-8);
  --krds-mobile-gap-layout-image-text-medium: var(--krds-number-9);
  --krds-mobile-gap-layout-image-text-large: var(--krds-number-10);
  --krds-mobile-padding-card-large: var(--krds-number-10);
  --krds-mobile-padding-card-medium: var(--krds-number-10);
  --krds-mobile-padding-card-small: var(--krds-number-9);
  --krds-mobile-padding-card-xsmall: var(--krds-number-7);
  /* SEMANTIC */
  --krds-gap-1: var(--krds-number-2);
  --krds-gap-2: var(--krds-number-3);
  --krds-gap-3: var(--krds-number-5);
  --krds-gap-4: var(--krds-number-7);
  --krds-gap-5: var(--krds-number-8);
  --krds-gap-6: var(--krds-number-9);
  --krds-gap-7: var(--krds-number-10);
  --krds-gap-8: var(--krds-number-12);
  --krds-gap-9: var(--krds-number-14);
  --krds-gap-10: var(--krds-number-16);
  --krds-gap-11: var(--krds-number-18);
  --krds-gap-12: var(--krds-number-20);
  --krds-padding-1: var(--krds-number-2);
  --krds-padding-2: var(--krds-number-3);
  --krds-padding-3: var(--krds-number-5);
  --krds-padding-4: var(--krds-number-6);
  --krds-padding-5: var(--krds-number-7);
  --krds-padding-6: var(--krds-number-8);
  --krds-padding-7: var(--krds-number-9);
  --krds-padding-8: var(--krds-number-10);
  --krds-padding-9: var(--krds-number-12);
  --krds-padding-10: var(--krds-number-14);
  --krds-size-height-1: var(--krds-number-5);
  --krds-size-height-2: var(--krds-number-8);
  --krds-size-height-3: var(--krds-number-9);
  --krds-size-height-4: var(--krds-number-10);
  --krds-size-height-5: var(--krds-number-12);
  --krds-size-height-6: var(--krds-number-14);
  --krds-size-height-7: var(--krds-number-16);
  --krds-size-height-8: var(--krds-number-17);
  --krds-size-height-9: var(--krds-number-18);
  --krds-size-height-10: var(--krds-number-19);
  --krds-size-height-11: var(--krds-number-20);
  --krds-radius-xsmall1: var(--krds-number-2);
  --krds-radius-xsmall2: var(--krds-number-2);
  --krds-radius-xsmall3: var(--krds-number-2);
  --krds-radius-small1: var(--krds-number-3);
  --krds-radius-small2: var(--krds-number-3);
  --krds-radius-small3: var(--krds-number-3);
  --krds-radius-medium1: var(--krds-number-4);
  --krds-radius-medium2: var(--krds-number-4);
  --krds-radius-medium3: var(--krds-number-5);
  --krds-radius-medium4: var(--krds-number-5);
  --krds-radius-large1: var(--krds-number-6);
  --krds-radius-large2: var(--krds-number-6);
  --krds-radius-xlarge1: var(--krds-number-7);
  --krds-radius-xlarge2: var(--krds-number-7);
  --krds-radius-max: var(--krds-number-max);
}

:root {
  /* RESPONSIVE-PC */
  --krds-pc-font-size-heading-xlarge: 6.2rem;
  --krds-pc-font-size-heading-large: 4.6rem;
  --krds-pc-font-size-heading-medium: 3.5rem;
  --krds-pc-font-size-heading-small: 3.2rem;
  --krds-pc-font-size-heading-xsmall: 3rem;
  --krds-pc-font-size-heading-xxsmall: 2.4rem;
  /* RESPONSIVE-TABLET */
  --krds-tablet-font-size-heading-xlarge: 5.2rem;
  --krds-tablet-font-size-heading-large: 3.2rem;
  --krds-tablet-font-size-heading-medium: 3.0rem;
  --krds-tablet-font-size-heading-small: 2.8rem;
  --krds-tablet-font-size-heading-xsmall: 2.4rem;
  --krds-tablet-font-size-heading-xxsmall: 2rem;
  /* RESPONSIVE-MOBILE */
  --krds-mobile-font-size-heading-xlarge: 2.8rem;
  --krds-mobile-font-size-heading-large: 2.4rem;
  --krds-mobile-font-size-heading-medium: 2.2rem;
  --krds-mobile-font-size-heading-small: 2rem;
  --krds-mobile-font-size-heading-xsmall: 1.8rem;
  --krds-mobile-font-size-heading-xxsmall: 1.6rem;
}

/* 1. 기본 라이트 모드 커스텀 */
html[data-theme=light] {
  --krds-logo-url: url('/resources/SITE/root/images/logo.png');
  --krds-logo-on-main-url: url('/resources/SITE/root/images/high-contrast/logo.png');
}

/* 2. 고대비(다크) 모드 커스텀 */
html[data-theme=high-contrast] {
  --krds-logo-url: url('/resources/SITE/root/images/high-contrast/logo.png');
  --krds-logo-on-main-url: var(--krds-logo-url);
}

/* 1. 시스템(OS) 기본 다크모드 대응 및 사파리 렌더링 설정 */
@media (prefers-color-scheme: dark) {
  html {
    color-scheme: dark;
  }
}
html[data-theme=light] {
  color-scheme: light;
  --bg-color: #ffffff;
  --text-color: #222222;
  --main-color: #0d56bd;
  --sub-color: #003073;
  --title-color: #222222;
  --qna-bg: #0c225f;
  --fullmenu-color: #303030;
  --footerText-color: #333333;
  --th-bg: #eef5fa;
  --card-bg: #ffffff;
  --box-bg: #dbedf9;
  --box-text: #ffffff;
  --link-color: #0066cc;
  --border-basic: #c9c9c9;
  --border-sub: #ececec;
  --border-table: #dadada;
  --border-th: #8d99a6;
  --border-floor: #e4e4e4;
  --history-bg: #4d91d3 linear-gradient(to bottom, #4d91d3 60%, #2d6ebb 95%);
}

html[data-theme=high-contrast] {
  color-scheme: dark; /* 💡 사파리에게 다크모드 화면을 다시 그리라고 강제하는 핵심 속성 */
  --bg-color: #0b111e;
  --text-color: #e0e0e0;
  --main-color: #408af2;
  --sub-color: #8abbff;
  --title-color: #ffffff;
  --qna-bg: #ffffff;
  --fullmenu-color: #ffffff;
  --footerText-color: #b0b8c4;
  --th-bg: #050b10;
  --card-bg: #071f31;
  --box-bg: #071f31;
  --box-text: #0b111e;
  --link-color: #66b2ff;
  --border-basic: #363636;
  --border-sub: #121212;
  --border-table: #262626;
  --border-th: #5a6672;
  --border-floor: #232830;
  --history-bg: #2d70b4;
}

/* 4. 💡 실제 화면(body)에 CSS 변수 적용 */
body {
  background-color: var(--bg-color);
  color: var(--text-color);
  /* 테마가 바뀔 때 자연스럽게 스르륵 바뀌도록 트랜지션 추가 (사파리 버그 방지에도 도움됨) */
  transition: background-color 0.2s ease, color 0.2s ease;
}

:root {
  --krds-font-family-base: "Pretendard GOV", "Pretendard", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  --krds-font-size-base: 62.5%;
  --theme-toggle-url: url(/resources/SITE/root/images/theme-mode-light.png);
  --theme-toggle-on-main-url: url(/resources/SITE/root/images/theme-mode-light-color-white.png);
  --bullet-circle: url(/images/sub/bullet_circle.svg);
  --page-top: url(/resources/SITE/root/images/page-top-button.png);
  --page-top-active: url(/resources/SITE/root/images/page-top-button-active.png);
  --card-body-background-website: url(/resources/SITE/root/images/sub/bg_wrap_document.jpg);
  --card-body-background-work: url(/resources/SITE/root/images/sub/bg_wrap_information.jpg);
  --card-body-background-library: url(/resources/SITE/root/images/sub/bg_wrap_folder.jpg);
  --card-body-background-audit: url(/resources/SITE/root/images/sub/bg_wrap_graph.jpg);
  --business-grid-background: url(/resources/SITE/root/images/sub/business/bg_wrap_dotted.jpg);
  /* about */
  --about-vision-background: url(/resources/SITE/root/images/sub/bg_wrap_01.jpg);
  --about-business-background-blue: url(/resources/SITE/root/images/sub/about/bg_object_item_blue_blank.png);
  --about-business-background-iris: url(/resources/SITE/root/images/sub/about/bg_object_item_iris_blank.png);
  --about-business-background-violet: url(/resources/SITE/root/images/sub/about/bg_object_item_violet_blank.png);
  --about-business-dot-blue: url(/resources/SITE/root/images/sub/about/bg_dotted_item_blue.png);
  --about-business-dot-iris: url(/resources/SITE/root/images/sub/about/bg_dotted_item_iris.png);
  --about-business-dot-violet: url(/resources/SITE/root/images/sub/about/bg_dotted_item_violet.png);
  --about-business-object-blue: url(/resources/SITE/root/images/sub/about/bg_object_item_blue.png);
  --about-business-object-iris: url(/resources/SITE/root/images/sub/about/bg_object_item_iris.png);
  --about-business-object-violet: url(/resources/SITE/root/images/sub/about/bg_object_item_violet.png);
  /* MODE-LIGHT */
  --theme-light-toggle-black: url(/resources/SITE/root/images/theme-mode-light.png);
  --theme-light-toggle-white: url(/resources/SITE/root/images/theme-mode-light-on-main.png);
  /* MODE-HIGH-CONTRAST */
  --theme-high-contrast-toggle-black: url(/resources/SITE/root/images/theme-mode-high-contrast.png);
  --theme-high-contrast-toggle-white: url(/resources/SITE/root/images/theme-mode-high-contrast-on-main.png);
}

/* 2. 고대비(다크) 모드 커스텀 */
html[data-theme=high-contrast] {
  --theme-toggle-url: url(/resources/SITE/root/images/high-contrast/theme-mode-high-contrast.png);
  --theme-toggle-on-main-url: var(--theme-toggle-url);
}

/* reset */
html, body {
  font-family: var(--krds-font-family-base);
  position: relative;
  width: 100%;
  height: 100%;
  word-break: keep-all;
  word-wrap: break-word;
  -webkit-tap-highlight-color: transparent;
  scroll-behavior: smooth;
}

html {
  box-sizing: border-box;
  font-size: var(--krds-font-size-base);
  color: #111;
  line-height: 1.5;
}

body {
  background-color: var(--bg-color);
  color: var(--text-color);
  overflow-x: hidden;
}

.visual-more-btn {
  color: var(--link-color);
}

*, *::before, *::after {
  box-sizing: inherit;
}

* {
  margin: 0;
  padding: 0;
  color: inherit;
  font: inherit;
  box-sizing: border-box;
  word-break: keep-all;
}

ul {
  list-style: none;
}

a {
  text-decoration: none;
}

button {
  cursor: pointer;
}

img {
  max-width: 100%;
  max-height: 100%;
}

.blind,
hr,
.sr-only,
legend,
caption {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.hide {
  display: none !important;
}

.show {
  display: block !important;
}

#header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  width: 100%;
  height: 10rem;
  color: var(--title-color);
}
@media (max-width: 767px) {
  #header {
    height: 5.6rem;
  }
}
#header > .header-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100%;
  width: 100%;
  max-width: 1640px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
}
#header .btn-theme-toggle {
  display: flex;
  border: 0;
  width: 3.6rem;
  height: 3.6rem;
  background: var(--theme-toggle-url) no-repeat center/contain;
}
@media (max-width: 767px) {
  #header .btn-theme-toggle {
    height: 2.8rem;
  }
}
#header.on-main {
  color: #ffffff;
}
#header.on-main #topLogo {
  --krds-logo-url: var(--krds-logo-on-main-url);
}
#header.on-main #fullmenu-toggle-btn::before, #header.on-main #fullmenu-toggle-btn::after {
  background-color: #ffffff;
}
#header.on-main .btn-theme-toggle {
  --theme-toggle-url: var(--theme-toggle-on-main-url);
}

#topLogo {
  width: 22rem;
  height: 5rem;
  background-image: var(--krds-logo-url);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
@media (max-width: 767px) {
  #topLogo {
    width: 16rem;
    height: 3rem;
  }
}
#topLogo a {
  display: block;
  height: 100%;
}

.header-shadow {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  width: 100%;
  height: 12rem;
  background-color: rgba(255, 255, 255, 0);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px); /* 사파리 지원 */
  mask-image: linear-gradient(to bottom, black 0%, black 80%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, black 0%, black 80%, transparent 100%);
}
@media (max-width: 767px) {
  .header-shadow {
    height: 7.2rem;
  }
}

.gnb-wrap {
  display: flex;
  align-items: center;
  gap: 2rem;
}
@media (max-width: 767px) {
  .gnb-wrap {
    gap: 0.8rem;
  }
}

#gnb-menu {
  display: flex;
  align-items: center;
  gap: 5.8em;
}
@media (max-width: 1023px) {
  #gnb-menu {
    display: none;
  }
}
#gnb-menu .gnb-list {
  display: flex;
  align-items: center;
  position: relative;
}
#gnb-menu .gnb-list .gnb-link {
  display: block;
  padding: 1rem 0;
  font-size: 2.6rem;
  font-weight: 700;
}
@media (max-width: 1023px) {
  #gnb-menu .gnb-list .gnb-link {
    font-size: 2rem;
  }
}
#gnb-menu .gnb-list .gnb-link.typeQNA {
  width: 11.2rem;
  height: 4rem;
  font-size: 1.8rem;
  font-weight: 600;
  border-radius: 2rem;
  color: var(--box-text);
  background-color: var(--qna-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  flex-wrap: nowrap;
}
#gnb-menu .gnb-list .gnb-linkMenu {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  margin-top: -0.1rem;
  width: 22rem;
  background-color: white;
  border-radius: 1rem;
  box-shadow: 0 0 1rem rgba(0, 0, 0, 0.5);
}
#gnb-menu .gnb-list .gnb-linkMenu .depths {
  display: flex;
  flex-direction: column;
  gap: 0.8rem 0;
  padding: 2.6rem 3rem;
}
#gnb-menu .gnb-list .gnb-linkMenu .depths .depth2 .depth2_link {
  display: block;
  font-size: 2rem;
  font-weight: 500;
  color: #333333;
}
#gnb-menu .gnb-list .gnb-linkMenu .depths .depth2 .depth2_link:hover {
  color: #0d56bd;
  font-weight: 700;
}

#fullmenu-wrap {
  display: flex;
  align-items: center;
}

#fullmenu-toggle-btn {
  background-color: transparent;
  width: 4rem;
  height: 4rem;
  margin-left: 0.5em;
  border: 0;
  position: relative;
}
@media (max-width: 767px) {
  #fullmenu-toggle-btn {
    width: 3.2rem;
    height: 3.2rem;
  }
}
#fullmenu-toggle-btn::before, #fullmenu-toggle-btn::after {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 0.3rem;
  background-color: var(--fullmenu-color);
  border-radius: 1.5px;
  transition: top 0.3s ease, bottom 0.1s ease;
}
@media (max-width: 767px) {
  #fullmenu-toggle-btn::before, #fullmenu-toggle-btn::after {
    height: 0.2rem;
  }
}
#fullmenu-toggle-btn::before {
  top: 32%;
}
#fullmenu-toggle-btn::after {
  bottom: 32%;
}
#fullmenu-toggle-btn:hover::before {
  top: 20%;
}
#fullmenu-toggle-btn:hover:hover::after {
  bottom: 20%;
}

#fullmenu {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  width: 100%;
  height: 100%;
  color: white;
  background-color: rgba(27, 31, 64, 0.8156862745);
  backdrop-filter: blur(1rem);
  -webkit-backdrop-filter: blur(1rem);
  overflow-y: auto;
}
#fullmenu.active {
  display: block;
}
#fullmenu .fullmenu-container {
  width: 100%;
  max-width: 1640px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
  display: flex;
  align-items: center;
  height: 100%;
  padding-top: 6rem;
  position: relative;
}
@media (max-width: 359px) {
  #fullmenu .fullmenu-container {
    width: 100%;
  }
}
#fullmenu-toggle-trigger {
  position: absolute;
  top: 3rem;
  right: 2rem;
  background-color: transparent;
  width: 4rem;
  height: 4rem;
  border: 0;
  border-radius: 50%;
  transition: all 0.3s ease;
}
@media (max-width: 767px) {
  #fullmenu-toggle-trigger {
    top: 0.8rem;
    right: 1.6rem;
  }
}
#fullmenu-toggle-trigger::before, #fullmenu-toggle-trigger::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -0.125em 0 0 -1.25em;
  display: block;
  width: 3.6em;
  height: 0.3em;
  background-color: white;
  border-radius: 1.5px;
  transition: all 0.3s ease;
}
#fullmenu-toggle-trigger::before {
  transform: rotate(45deg) translate(-0.4rem, 0.4rem);
}
#fullmenu-toggle-trigger::after {
  transform: rotate(135deg) translate(0.4rem, 0.4rem);
}

.fullmenu-list {
  display: flex;
  flex-wrap: wrap;
  max-height: 100%;
  gap: 10%;
  width: 100%;
  max-width: 1640px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
}
.fullmenu-list > li {
  display: flex;
  flex-direction: column;
  gap: 3rem;
  flex: 1 1 16%;
}
@media (max-width: 1023px) {
  .fullmenu-list > li {
    flex: 1 1 45%;
  }
}
@media (max-width: 359px) {
  .fullmenu-list > li {
    flex: 1 1 100%;
  }
}
.fullmenu-list > li > h2 {
  font-size: 4.4rem;
  font-weight: 700;
  line-height: 1.8;
  border-bottom: 2px solid rgba(255, 255, 255, 0.1);
}
@media (max-width: 1023px) {
  .fullmenu-list > li > h2 {
    font-size: 2.4rem;
  }
}
@media (min-width: 1024px) and (max-width: 1279px) {
  .fullmenu-list > li > h2 {
    font-size: 2.8rem;
  }
}
.fullmenu-list > li > ul {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}
.fullmenu-list > li > ul > li:last-child {
  margin-bottom: 3rem;
}
.fullmenu-list > li > ul > li > a {
  font-size: 2.4rem;
}
@media (max-width: 1023px) {
  .fullmenu-list > li > ul > li > a {
    font-size: 1.6rem;
  }
}
@media (min-width: 1024px) and (max-width: 1279px) {
  .fullmenu-list > li > ul > li > a {
    font-size: 2rem;
  }
}

@keyframes zoomInOut {
  0% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
#main-visual {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  flex-wrap: nowrap;
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}
#main-visual img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  animation: zoomInOut 8s ease-in-out infinite alternate;
}
#main-visual > .main-visual-description {
  position: absolute;
  padding-bottom: 4rem;
  width: 100%;
  max-width: 1640px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
}
#main-visual > .main-visual-description .text {
  opacity: 0;
  padding: 0 2rem;
  color: white;
  transform: translate(0, 80px);
}
@media (max-width: 767px) {
  #main-visual > .main-visual-description .text {
    padding: 0 1rem;
  }
}
#main-visual > .main-visual-description .text h2 {
  font-size: 10rem;
  font-weight: 800;
  line-height: 1.2em;
  text-shadow: 0 0 2rem rgba(0, 0, 0, 0.4);
}
@media (max-width: 1023px) {
  #main-visual > .main-visual-description .text h2 {
    font-size: 8rem;
  }
}
@media (max-width: 767px) {
  #main-visual > .main-visual-description .text h2 {
    font-size: 4rem;
  }
}
#main-visual > .main-visual-description .text p {
  font-size: 2.8rem;
  padding-left: 4px;
  text-shadow: 0 0 2rem rgba(0, 0, 0, 0.4);
}
@media (max-width: 1023px) {
  #main-visual > .main-visual-description .text p {
    font-size: 2.4rem;
  }
}
@media (max-width: 767px) {
  #main-visual > .main-visual-description .text p {
    font-size: 1.4rem;
  }
}

.visual-section {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  flex-wrap: nowrap;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
  clip-path: inset(12% 6% round 50px);
}
.visual-section::after {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
  bottom: -1px;
  border: 2px solid #fff;
  border-radius: inherit;
  pointer-events: none;
  z-index: 2;
}
.visual-section img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.visual-section .visual-content {
  width: 100%;
  max-width: 1640px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
  position: absolute;
  padding: 0 10%;
  font-weight: 600;
  color: #5069e7;
  opacity: 0;
}
.visual-section .visual-content .visual-title {
  display: block;
  font-size: 8rem;
  font-weight: 800;
  color: #06328a;
}
@media (max-width: 1023px) {
  .visual-section .visual-content .visual-title {
    font-size: 6rem;
  }
}
@media (max-width: 767px) {
  .visual-section .visual-content .visual-title {
    font-size: 4rem;
  }
}
@media (max-width: 359px) {
  .visual-section .visual-content .visual-title {
    font-size: 3.2rem;
  }
}
.visual-section .visual-content .visual-description {
  font-size: 5.2rem;
  font-weight: 700;
}
@media (max-width: 1023px) {
  .visual-section .visual-content .visual-description {
    font-size: 4rem;
  }
}
@media (max-width: 767px) {
  .visual-section .visual-content .visual-description {
    font-size: 3.2rem;
  }
}
@media (max-width: 359px) {
  .visual-section .visual-content .visual-description {
    font-size: 2rem;
  }
}
.visual-section .visual-content .visual-more-btn {
  display: inline-block;
  margin-top: 0.75em;
  padding: 0.25em 1.25em;
  font-size: 2.2rem;
  color: #0d56bd;
  background-color: white;
  border: 2px solid #0d56bd;
  border-radius: 1.5em;
}
@media (max-width: 767px) {
  .visual-section .visual-content .visual-more-btn {
    font-size: 1.6rem;
  }
}
@media (max-width: 359px) {
  .visual-section .visual-content .visual-more-btn {
    font-size: 1.2rem;
  }
}

@keyframes float {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(4px); /* 위로 8px 이동 (원하는 만큼 조절 가능) */
  }
  100% {
    transform: translateY(0px);
  }
}
body.no-scroll {
  overflow: hidden;
  /* (선택 사항) 모바일 Safari 등 일부 환경에서 스크롤이 완벽히 막히도록 보완 */
  height: 100%;
  position: fixed;
  width: 100%;
}

.boxShadow {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}

.container {
  margin-bottom: -0.1rem;
}

.subpage {
  font-size: 2rem;
  font-weight: 400;
  color: var(--text-color);
}
@media screen and (min-width: 768px) {
  .subpage {
    margin-top: 6em;
  }
}
@media screen and (max-width: 767px) {
  .subpage {
    margin-top: 3em;
  }
}
.subpage .subpage-container-wrap {
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 767px) {
  .subpage .subpage-container-wrap {
    gap: 5rem;
  }
}
@media screen and (min-width: 768px) {
  .subpage .subpage-container-wrap {
    gap: 10rem;
  }
}
.subpage .subpage-container-wrap .contents-container [class*=subTitle] {
  width: 100%;
  max-width: 1640px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
}
.subpage .subpage-container-wrap .description-container {
  width: 100%;
  max-width: 1640px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
}
@media screen and (max-width: 767px) {
  .subpage .subpage-container-wrap .description-container:last-child {
    margin-bottom: 5rem;
  }
}
@media screen and (min-width: 768px) {
  .subpage .subpage-container-wrap .description-container:last-child {
    margin-bottom: 10rem;
  }
}
@media (max-width: 767px) {
  .subpage {
    font-size: 1.6rem;
  }
}
@media (max-width: 359px) {
  .subpage {
    font-size: 1.4rem;
  }
}

.subTitle1 {
  font-size: var(--krds-pc-font-size-heading-xlarge);
  font-weight: 700;
  text-align: center;
  margin-bottom: 0.5em;
  width: 100%;
  max-width: 1680px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}
@media (max-width: 767px) {
  .subTitle1 {
    font-size: var(--krds-mobile-font-size-heading-xlarge);
  }
}

.subTitle2 {
  font-size: var(--krds-pc-font-size-heading-large);
  font-weight: 700;
  text-align: center;
  margin-bottom: 2rem;
}
@media (max-width: 767px) {
  .subTitle2 {
    font-size: var(--krds-mobile-font-size-heading-large);
  }
}

.subTitle3 {
  font-size: var(--krds-pc-font-size-heading-medium);
  font-weight: 700;
  text-align: center;
  margin-bottom: 2rem;
  line-height: 1.3;
  color: var(--main-color);
}
@media (max-width: 767px) {
  .subTitle3 {
    font-size: var(--krds-mobile-font-size-heading-medium);
  }
}

.subTitle4 {
  font-size: var(--krds-pc-font-size-heading-small);
  font-weight: 700;
  text-align: center;
  margin-bottom: 0.375em;
}
@media (max-width: 767px) {
  .subTitle4 {
    font-size: var(--krds-mobile-font-size-heading-small);
  }
}

.subTitle5 {
  font-size: var(--krds-pc-font-size-heading-xsmall);
  font-weight: 500;
  text-align: center;
  margin-bottom: 0.375em;
}
.subTitle5:last-child {
  margin-bottom: 0;
}
@media (max-width: 767px) {
  .subTitle5 {
    font-size: var(--krds-mobile-font-size-heading-xsmall);
  }
}

.subTitle6 {
  font-size: var(--krds-pc-font-size-heading-xxsmall);
  font-weight: 500;
  text-align: center;
  margin-bottom: 3rem;
}
.subTitle6:last-child {
  margin-bottom: 0;
}
@media (max-width: 767px) {
  .subTitle6 {
    font-size: var(--krds-mobile-font-size-heading-xxsmall);
  }
}

@media (max-width: 1023px) {
  .subTitle3 br, .subTitle4 br, .subTitle5 br, .subTitle6 br {
    display: none;
  }
}

.font-w700 {
  font-weight: 700;
}

.font-w600 {
  font-weight: 600;
}

.font-w500 {
  font-weight: 500;
}

.font-w400 {
  font-weight: 400;
}

:root {
  --card-thumb-pc-width: 11.9rem;
  --card-thumb-tablet-width: 7rem;
  --card-thumb-mobile-width: 4rem;
}

.card-body-wrap {
  background-color: var(--box-bg);
  background-size: cover;
}
@media screen and (max-width: 767px) {
  .card-body-wrap {
    padding: 6rem 0;
  }
}
@media screen and (min-width: 768px) {
  .card-body-wrap {
    padding: 12rem 0;
  }
}
.card-body-wrap.visual-website {
  background-image: var(--card-body-background-website);
}
.card-body-wrap.visual-work {
  background-image: var(--card-body-background-work);
}
.card-body-wrap.visual-library {
  background-image: var(--card-body-background-library);
}
.card-body-wrap.visual-audit {
  background-image: var(--card-body-background-audit);
}
.card-body-wrap[class*=visual-] .card-container-wrap.col3-row {
  width: 100%;
  max-width: 128rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
}
.card-body-wrap[class*=visual-] .card-container-wrap.col4-row {
  width: 100%;
  max-width: 1640px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
}
.card-body-wrap .card-container-wrap .card-container.col3 {
  width: 100%;
  max-width: 154rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
  width: 90%;
}
.card-body-wrap .card-container-wrap .card-container .card-item {
  background-color: var(--card-bg);
}

.card-container-wrap {
  display: flex;
  border-radius: 1em;
}
@media (min-width: 768px) {
  .card-container-wrap {
    flex-wrap: wrap;
  }
}
@media (min-width: 1024px) {
  .card-container-wrap.wrap_01 {
    border: 1px solid var(--border-basic);
    padding: 4%;
    background-color: #ffffff;
  }
}
.card-container-wrap + .card-container-wrap {
  margin-top: 4rem;
}

@media (max-width: 767px) {
  .card-container-wrap {
    flex-wrap: wrap;
  }
}
.card-container-wrap > .card-row-title {
  flex: 1 1 10%;
  padding: 4.8rem 2rem 0 0;
  color: var(--sub-color);
}
@media (max-width: 767px) {
  .card-container-wrap > .card-row-title {
    flex: 1 1 100%;
  }
}
.card-container-wrap > .card-row-title p {
  font-size: 1.6em;
  font-weight: 700;
  word-break: keep-all;
}
.card-container-wrap > .card-row-thumb {
  flex: 1 1 10%;
  margin-left: -4%;
}
.card-container-wrap > .card-row-thumb .card-item {
  text-align: center;
  justify-content: start;
}
@media (max-width: 1023px) {
  .card-container-wrap > [class^=card-row-] {
    flex: 1 1 100%;
    text-align: center;
    padding: 0;
    margin-bottom: 1em;
  }
}
@media (max-width: 767px) {
  .card-container-wrap > [class^=card-row-] {
    flex: 1 1 100%;
  }
}
.card-container-wrap > [class^=card-row-] + .card-container {
  flex: 1 1 60%;
}
@media (max-width: 767px) {
  .card-container-wrap > [class^=card-row-] + .card-container {
    flex: 1 1 100%;
  }
}

.card-container {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  flex-direction: row;
  flex-wrap: wrap;
}
@media screen and (min-width: 768px) {
  .card-container {
    gap: 2rem;
  }
}
@media screen and (max-width: 767px) {
  .card-container {
    gap: 1rem;
  }
}
.card-container {
  font-weight: 500;
}

.card-item {
  display: flex;
  align-items: start;
  justify-content: center;
  flex-direction: row;
  flex-wrap: nowrap;
  background-color: var(--box-bg);
  border-radius: 1em;
  flex: 1 1 100%;
  padding: 4rem 5rem;
  text-align: center;
  gap: 1rem;
  overflow: hidden;
}
@media (min-width: 768px) {
  .card-item {
    flex-direction: row;
    flex-wrap: wrap;
    flex: 1 1 49%;
    padding: 3rem;
  }
}
@media (max-width: 767px) {
  .card-item {
    flex-direction: column;
    gap: 1rem 0;
    padding: 3rem 2rem;
  }
}
.card-item .card-thumb {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: row;
  flex-wrap: nowrap;
}
.card-item .card-thumb img {
  display: block;
}
@media screen and (max-width: 1023px) {
  .card-item .card-thumb img {
    width: var(--card-thumb-mobile-width);
  }
}
@media screen and (min-width: 1024px) and (max-width: 1639px) {
  .card-item .card-thumb img {
    width: var(--card-thumb-tablet-width);
  }
}
@media screen and (min-width: 1640px) {
  .card-item .card-thumb img {
    width: var(--card-thumb-pc-width);
  }
}
.card-item .card-item-title {
  font-size: var(--krds-tablet-font-size-heading-small);
  font-weight: 700;
  width: 100%;
  line-height: 1.3;
}
@media (max-width: 767px) {
  .card-item .card-item-title {
    font-size: var(--krds-mobile-font-size-heading-small);
  }
}
.card-item .card-item-description {
  font-weight: 500;
  word-break: keep-all;
  width: 100%;
  height: 100%;
}
@media (max-width: 1023px) {
  .card-item .card-item-description br {
    display: none;
  }
}
.card-item .card-item-description p:not(:only-child) {
  text-indent: -1rem;
  padding-left: 1rem;
}
.card-item .card-item-description p:not(:only-child)::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 0.5rem;
  height: 0.5rem;
  margin-right: 0.5rem;
  border-radius: 0.3rem;
  background-color: #7da7d9;
}
.card-item .card-item-description p + p {
  margin-top: 0.4rem;
}

.card-container-wrap.col3-row .card-container .card-item {
  gap: 1rem 2%;
}
@media screen and (min-width: 1280px) {
  .card-container-wrap.col3-row .card-container .card-item {
    flex: 0 1 32%;
    padding-top: 6rem;
    padding-bottom: 8rem;
  }
}
@media screen and (max-width: 768px) and (max-width: 1279px) {
  .card-container-wrap.col3-row .card-container .card-item {
    flex: 0 1 49%;
    padding-top: 5rem;
    padding-bottom: 6rem;
  }
}
@media screen and (max-width: 767px) {
  .card-container-wrap.col3-row .card-container .card-item {
    padding-top: 2rem;
    padding-bottom: 3rem;
    flex: 1 1 100%;
  }
}

@media screen and (min-width: 1280px) {
  .card-container-wrap.col4-row .card-container .card-item {
    flex: 1 1 21%;
    padding-top: 6rem;
    padding-bottom: 8rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1279px) {
  .card-container-wrap.col4-row .card-container .card-item {
    flex: 1 1 34%;
    padding-top: 5rem;
    padding-bottom: 6rem;
  }
}

@media screen and (min-width: 360px) {
  .card-container-wrap .card-container.grid-col2 .card-item {
    display: grid;
    grid-template-columns: auto minmax(20rem, 3fr);
    grid-template-rows: auto 1fr;
    text-align: left;
    justify-content: unset;
    gap: 0 0.6rem;
  }
}
@media screen and (min-width: 768px) {
  .card-container-wrap .card-container.grid-col2 .card-item {
    flex: 1 1 40%;
  }
}
@media screen and (min-width: 360px) and (max-width: 767px) {
  .card-container-wrap .card-container.grid-col2 .card-item {
    padding: 2rem 2rem 3rem 1rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .card-container-wrap .card-container.grid-col2 .card-item {
    padding: 3rem 2rem 4rem;
  }
}
@media screen and (min-width: 1024px) and (max-width: 1639px) {
  .card-container-wrap .card-container.grid-col2 .card-item {
    padding: 3rem 2rem 4rem;
  }
}
@media screen and (min-width: 1640px) {
  .card-container-wrap .card-container.grid-col2 .card-item {
    padding: 3rem 4rem 4rem;
  }
}
@media screen and (min-width: 360px) {
  .card-container-wrap .card-container.grid-col2 .card-item .card-thumb {
    grid-column: 1/2;
    grid-row: 1/2;
    height: 100%;
  }
}
@media screen and (min-width: 360px) {
  .card-container-wrap .card-container.grid-col2 .card-item .card-item-title {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    flex-wrap: nowrap;
    grid-column: 2/3;
    height: 100%;
  }
}
@media screen and (min-width: 360px) {
  .card-container-wrap .card-container.grid-col2 .card-item .card-item-description {
    grid-column: 1/3;
    margin-left: 0.6rem;
  }
}
@media screen and (min-width: 1024px) and (max-width: 1639px) {
  .card-container-wrap .card-container.grid-col2 .card-item .card-item-description {
    margin-left: 1rem;
  }
}
@media screen and (min-width: 1640px) {
  .card-container-wrap .card-container.grid-col2 .card-item .card-item-description {
    margin-left: 1.4rem;
  }
}

@media screen and (min-width: 360px) {
  .card-container-wrap .card-container.col2 .card-item {
    text-align: left;
  }
}
@media screen and (min-width: 768px) {
  .card-container-wrap .card-container.col2 .card-item {
    flex: 1 1 40%;
  }
}
@media screen and (min-width: 360px) and (max-width: 767px) {
  .card-container-wrap .card-container.col2 .card-item {
    padding: 2rem 3rem 3rem 7rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .card-container-wrap .card-container.col2 .card-item {
    padding: 3rem 3rem 4rem 7rem;
  }
}
@media screen and (min-width: 1024px) and (max-width: 1639px) {
  .card-container-wrap .card-container.col2 .card-item {
    padding: 5rem 3rem 6rem 10rem;
  }
}
@media screen and (min-width: 1640px) {
  .card-container-wrap .card-container.col2 .card-item {
    padding: 5rem 3rem 6rem 21rem;
  }
}
@media screen and (min-width: 360px) {
  .card-container-wrap .card-container.col2 .card-item .card-thumb {
    width: auto;
  }
}
@media screen and (min-width: 360px) and (max-width: 767px) {
  .card-container-wrap .card-container.col2 .card-item .card-thumb {
    position: absolute;
    top: 1.8rem;
    left: 1.8rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .card-container-wrap .card-container.col2 .card-item .card-thumb {
    position: absolute;
    top: 3rem;
    left: 2rem;
  }
}
@media screen and (min-width: 1024px) and (max-width: 1639px) {
  .card-container-wrap .card-container.col2 .card-item .card-thumb {
    position: absolute;
    top: 4rem;
    left: 2rem;
  }
}
@media screen and (min-width: 1640px) {
  .card-container-wrap .card-container.col2 .card-item .card-thumb {
    position: absolute;
    top: 4rem;
    left: 6rem;
  }
}
.card-container-wrap .card-container.col2 .card-item .card-item-title {
  width: 100%;
}
@media screen and (min-width: 1640px) {
  .card-container-wrap .card-container.col2 .card-item .card-item-title {
    display: flex;
    align-items: center;
  }
}
.card-container-wrap .card-container.col2 .card-item .card-item-description {
  width: 100%;
  height: 100%;
}

@media screen and (min-width: 360px) {
  .card-container-wrap .card-container.col3 .card-item {
    width: 100%;
    padding: 4rem 3rem 4rem 2rem;
    text-align: left;
  }
}
@media screen and (min-width: 360px) and (max-width: 767px) {
  .card-container-wrap .card-container.col3 .card-item {
    flex: 1 1 100%;
    padding: 2rem 3rem 2rem 2rem;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .card-container-wrap .card-container.col3 .card-item {
    flex: 1 1 40%;
    padding: 3rem 3rem 4rem 2rem;
  }
}
@media screen and (min-width: 1024px) and (max-width: 1639px) {
  .card-container-wrap .card-container.col3 .card-item {
    flex: 1 1 40%;
    padding: 4rem 3rem 4rem 2rem;
  }
}
@media screen and (min-width: 1640px) {
  .card-container-wrap .card-container.col3 .card-item {
    flex: 1 1 30%;
    padding: 4rem 3rem 4rem 2rem;
  }
}
@media screen and (min-width: 360px) {
  .card-container-wrap .card-container.col3 .card-item .card-thumb {
    position: absolute;
    top: 3rem;
    left: 2rem;
    width: auto;
  }
}
@media screen and (min-width: 768px) {
  .card-container-wrap .card-container.col3 .card-item .card-thumb {
    top: 3rem;
  }
}
@media screen and (min-width: 1640px) {
  .card-container-wrap .card-container.col3 .card-item .card-thumb {
    top: 4rem;
    left: 3rem;
  }
}
.card-container-wrap .card-container.col3 .card-item .card-item-title {
  width: 100%;
}
@media screen and (min-width: 360px) and (max-width: 1023px) {
  .card-container-wrap .card-container.col3 .card-item .card-item-title {
    padding-left: calc(var(--card-thumb-mobile-width) + 1rem);
  }
}
@media screen and (min-width: 1024px) and (max-width: 1639px) {
  .card-container-wrap .card-container.col3 .card-item .card-item-title {
    padding-left: calc(var(--card-thumb-tablet-width) + 2rem);
  }
}
@media screen and (min-width: 1640px) {
  .card-container-wrap .card-container.col3 .card-item .card-item-title {
    padding-left: calc(var(--card-thumb-pc-width) + 3rem);
  }
}
.card-container-wrap .card-container.col3 .card-item .card-item-description {
  width: 100%;
  height: 100%;
}
@media screen and (min-width: 360px) and (max-width: 1023px) {
  .card-container-wrap .card-container.col3 .card-item .card-item-description {
    padding-left: calc(var(--card-thumb-mobile-width) + 1rem);
  }
}
@media screen and (min-width: 1024px) and (max-width: 1639px) {
  .card-container-wrap .card-container.col3 .card-item .card-item-description {
    padding-left: calc(var(--card-thumb-tablet-width) + 2rem);
  }
}
@media screen and (min-width: 1640px) {
  .card-container-wrap .card-container.col3 .card-item .card-item-description {
    padding-left: calc(var(--card-thumb-pc-width) + 3rem);
  }
}

/* 개념 */
.circle-container {
  background: var(--history-bg) no-repeat center bottom/cover;
  text-align: center;
  border-radius: 1em;
  color: white;
}
@media screen and (min-width: 768px) {
  .circle-container {
    padding: 4em 3em;
  }
}
@media screen and (max-width: 767px) {
  .circle-container {
    padding: 2em 1em;
  }
}
.circle-container {
  /* 고성능 그리드 */
}
.circle-container.visual-dot {
  padding-top: 1em;
  padding-bottom: 3em;
  background-image: var(--business-grid-background);
}
.circle-container.visual-blank {
  background-image: none;
  background-color: #f7f7f7;
  border: 1px solid var(--border-basic);
}

/* 기존 솔루션 대비 차이점 */
table.table-basic {
  width: 100%;
  border-top: 1px solid;
  border-collapse: collapse;
  border-spacing: 0;
  overflow: hidden;
}
table.table-basic th,
table.table-basic td {
  padding: 16px 4px;
  border: 1px solid var(--border-table);
  background-color: var(--bg-color);
}
table.table-basic thead th {
  font-weight: 600;
  background-color: var(--th-bg);
  border: 1px solid var(--border-table);
}
table.table-basic thead tr:first-child th {
  border-top: 2px solid var(--border-th);
}
table.table-basic thead tr:last-child th {
  border-bottom: 1px solid var(--border-th);
}
table.table-basic thead tr th:first-child,
table.table-basic tbody tr th:first-child,
table.table-basic tbody tr td:first-child {
  border-left-width: 0;
}
table.table-basic thead tr th:last-child,
table.table-basic tbody tr td:last-child {
  border-right-width: 0;
}

/* 검증된 솔루션 */
.cert-container-wrap {
  border: 0.1rem solid var(--border-basic);
  background-color: #ffffff;
}
@media (max-width: 767px) {
  .cert-container-wrap {
    border-radius: 1rem;
  }
}
@media (min-width: 768px) {
  .cert-container-wrap {
    border-radius: 2rem;
  }
}
.cert-container-wrap .cert-container {
  display: flex;
  justify-content: center;
  padding: 3rem 4%;
  width: 100%;
  max-width: 1024px;
  margin: 0 auto;
}
@media (max-width: 767px) {
  .cert-container-wrap .cert-container {
    flex-wrap: wrap;
  }
}
.cert-container-wrap .cert-container .cert-item {
  display: flex;
  flex-grow: 1;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 2rem 1.2rem;
  color: #111;
}
@media (max-width: 767px) {
  .cert-container-wrap .cert-container .cert-item {
    width: 50%;
  }
}
@media (max-width: 359px) {
  .cert-container-wrap .cert-container .cert-item {
    width: 100%;
  }
}
.cert-container-wrap .cert-container .cert-item .cert-item-thumb {
  display: flex;
  align-items: center;
  height: 13.8rem;
  margin-bottom: 2rem;
}
@media (max-width: 767px) {
  .cert-container-wrap .cert-container .cert-item .cert-item-thumb {
    height: 8rem;
    margin-bottom: 1rem;
  }
}
@media (max-width: 359px) {
  .cert-container-wrap .cert-container .cert-item .cert-item-thumb {
    width: 10rem;
    height: auto;
  }
}
.cert-container-wrap .cert-container .cert-item .cert-item-description {
  font-size: var(--krds-pc-font-size-heading-xxsmall);
}
@media (max-width: 1023px) {
  .cert-container-wrap .cert-container .cert-item .cert-item-description {
    font-size: var(--krds-tablet-font-size-heading-xxsmall);
  }
}
@media (max-width: 767px) {
  .cert-container-wrap .cert-container .cert-item .cert-item-description {
    font-size: var(--krds-mobile-font-size-heading-xxsmall);
  }
}

/* 납품실적 */
.history-container-wrap {
  display: flex;
  align-items: stretch;
  background: var(--history-bg) no-repeat center bottom/cover;
  color: #ffffff;
  text-align: left;
  word-break: keep-all;
}
@media (max-width: 767px) {
  .history-container-wrap {
    flex-wrap: wrap;
    justify-content: center;
    padding: 5rem 2rem;
    border-radius: 1rem;
    gap: 1rem;
  }
}
@media (min-width: 768px) {
  .history-container-wrap {
    padding: 6rem 3rem;
    border-radius: 2rem;
    gap: 4rem;
  }
}
.history-container-wrap .history_image {
  text-align: center;
}
@media (max-width: 767px) {
  .history-container-wrap .history_image {
    flex: 0 1 70%;
    max-width: 20rem;
  }
}
@media (min-width: 768px) {
  .history-container-wrap .history_image {
    flex: 1 1 30%;
  }
}
.history-container-wrap .history-container {
  flex: 1 1 70%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.history-container-wrap .history-container .history-list {
  flex: 1 1 auto;
  padding-right: 2rem;
}
.history-container-wrap .history-container .history-list li {
  display: flex;
  padding: 0.1em 0;
  font-size: 2.4rem;
}
@media screen and (max-width: 1279px) {
  .history-container-wrap .history-container .history-list li {
    font-size: 2rem;
  }
}
@media screen and (max-width: 767px) {
  .history-container-wrap .history-container .history-list li {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 359px) {
  .history-container-wrap .history-container .history-list li {
    font-size: 1.5rem;
  }
}
.history-container-wrap .history-container .history-list li .year {
  display: block;
  width: 4em;
}
.history-container-wrap .history-container .history-list li .year + p {
  width: calc(100% - 5em);
}

@keyframes spin {
  from {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(360deg);
    opacity: 1;
  }
}
/* 주요고객 */
.grid-list-small {
  display: grid;
  border: 1px solid var(--border-basic);
  border-radius: 2rem;
  overflow: hidden;
}
@media (min-width: 1024px) {
  .grid-list-small {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (max-width: 1023px) {
  .grid-list-small {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 767px) {
  .grid-list-small {
    grid-template-columns: repeat(2, 1fr);
  }
}
.grid-list-small .grid-item {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  flex-wrap: nowrap;
  padding: 7.5% 20px;
  background-color: #ffffff;
  border: 1px solid var(--border-sub);
  border-top-width: 0;
  border-left-width: 0;
  border-right-width: 1px;
  border-bottom-width: 1px;
}
.grid-list-small .grid-item img {
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

@media (min-width: 1024px) {
  .grid-list-small .grid-item:nth-child(4n) {
    border-right-width: 0;
  }
  .grid-list-small .grid-item:nth-last-child(-n+4):nth-child(4n+1),
  .grid-list-small .grid-item:nth-last-child(-n+4):nth-child(4n+1) ~ .grid-item {
    border-bottom-width: 0;
  }
}
@media (max-width: 1023px) and (min-width: 768px) {
  .grid-list-small .grid-item:nth-child(3n) {
    border-right-width: 0;
  }
  .grid-list-small .grid-item:nth-last-child(-n+3):nth-child(3n+1),
  .grid-list-small .grid-item:nth-last-child(-n+3):nth-child(3n+1) ~ .grid-item {
    border-bottom-width: 0;
  }
}
@media (max-width: 767px) {
  .grid-list-small .grid-item:nth-child(2n) {
    border-right-width: 0;
  }
  .grid-list-small .grid-item:nth-last-child(-n+2):nth-child(2n+1),
  .grid-list-small .grid-item:nth-last-child(-n+2):nth-child(2n+1) ~ .grid-item {
    border-bottom-width: 0;
  }
}
/* 오시는길 */
.location-address {
  margin: 4rem 0 8rem;
  font-size: var(--krds-pc-font-size-heading-xxsmall);
  width: 100%;
  max-width: 1640px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
}
@media (min-width: 1024px) {
  .location-address {
    text-align: center;
  }
}
@media (max-width: 1023px) {
  .location-address {
    text-align: left;
  }
}
@media (max-width: 767px) {
  .location-address {
    font-size: var(--krds-tablet-font-size-heading-xxsmall);
  }
}
@media (max-width: 359px) {
  .location-address {
    font-size: var(--krds-mobile-font-size-heading-xxsmall);
  }
}
.location-address p strong {
  font-weight: 700;
  margin-right: 1rem;
}
.location-address p + .location-contact-wrap {
  margin-top: 3rem;
}
.location-address .location-contact-wrap {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: row;
  flex-wrap: wrap;
}
@media (max-width: 1023px) {
  .location-address .location-contact-wrap {
    justify-content: start;
  }
}
@media (min-width: 768px) {
  .location-address .location-contact-wrap {
    gap: 2rem 4rem;
  }
}
@media (max-width: 767px) {
  .location-address .location-contact-wrap {
    gap: 1rem 2rem;
  }
}
.location-address .location-contact-wrap .location-contact-item {
  display: inline-block;
}
.location-address .location-contact-wrap .location-contact-item img {
  width: 7.8rem;
  vertical-align: middle;
  margin-right: 1.2rem;
}
@media (max-width: 767px) {
  .location-address .location-contact-wrap .location-contact-item img {
    width: 1.75em;
  }
}

.map-wrapper {
  width: 100% !important;
  margin: 30px auto !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
}

.root_daum_roughmap,
.root_daum_roughmap .wrap_map {
  width: 100% !important;
}

.root_daum_roughmap .wrap_content,
.root_daum_roughmap .cont,
.root_daum_roughmap .wrap_controllers {
  display: none !important;
}

.root_daum_roughmap .hide_land {
  border-bottom: none !important;
}

.root_daum_roughmap_landing .border2 {
  display: block !important;
}

/* 개요 - 비전 */
.vision-container {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 2rem;
  padding: 10rem 2rem;
  border-radius: 2rem;
  overflow: hidden;
  text-align: center;
  background-image: var(--about-vision-background);
  background-size: cover;
}
.vision-container .vision_description {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 1rem;
}
.vision-container * {
  color: white;
}

/* 개요 - 사업분야 */
.business-container {
  display: flex;
  gap: 6rem;
  width: 100%;
  max-width: 110rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
  padding-left: 0;
  padding-right: 0;
}
@media (max-width: 767px) {
  .business-container {
    flex-direction: column;
    gap: 2em;
  }
}
.business-container .business-item {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 3rem;
  flex: 1 1 30%;
}
@media (max-width: 767px) {
  .business-container .business-item {
    gap: 1em;
    align-items: center;
  }
}
.business-container .business-item .business-item-title {
  position: relative;
  width: 100%;
  padding-bottom: 100%;
  overflow: hidden;
  background: var(--about-business-background-blue) no-repeat center/contain;
}
@media (max-width: 767px) {
  .business-container .business-item .business-item-title {
    height: auto;
    border-radius: 1em;
    padding-bottom: unset;
    background: #0754be none;
    border: 0.5em solid #266dd0;
  }
}
@media (min-width: 768px) {
  .business-container .business-item .business-item-title::before {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    display: block;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    background: center/cover;
    animation: spin 15s linear infinite;
    content: "";
  }
}
.business-container .business-item .business-item-title strong {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  flex-wrap: nowrap;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 9% 7% 7%;
  font-size: var(--krds-pc-font-size-heading-small);
  font-weight: 600;
  line-height: 1.2;
  z-index: 1;
  color: white;
  text-align: center;
  word-break: keep-all;
}
@media (max-width: 767px) {
  .business-container .business-item .business-item-title strong {
    display: inline-block;
    height: auto;
    padding: 0.5em;
    position: static;
    font-size: var(--krds-mobile-font-size-heading-small);
  }
}
.business-container .business-item .business-item-title strong span {
  font-size: var(--krds-pc-font-size-heading-xxsmall);
  font-weight: 400;
}
@media (max-width: 767px) {
  .business-container .business-item .business-item-title strong span {
    font-size: var(--krds-mobile-font-size-heading-xxsmall);
  }
}
.business-container .business-item .business-item-description {
  font-size: var(--krds-tablet-font-size-heading-xxsmall);
  font-weight: 500;
  word-break: keep-all;
}
@media (max-width: 767px) {
  .business-container .business-item .business-item-description {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    flex-wrap: nowrap;
    flex: 1 1 100%;
    width: 100%;
    margin-top: 0;
    padding: 0 1rem;
    font-size: var(--krds-mobile-font-size-heading-xxsmall);
  }
}
@media (min-width: 768px) {
  .business-container .business-item:nth-of-type(1) .business-item-title::before {
    background-image: var(--about-business-dot-blue);
  }
}
.business-container .business-item:nth-of-type(2) .business-item-title {
  background-image: var(--about-business-background-iris);
}
@media (max-width: 767px) {
  .business-container .business-item:nth-of-type(2) .business-item-title {
    background-image: none;
    background-color: #3b3eac;
    border-color: #545dd2;
  }
}
@media (min-width: 768px) {
  .business-container .business-item:nth-of-type(2) .business-item-title::before {
    background-image: var(--about-business-dot-iris);
  }
}
.business-container .business-item:nth-of-type(3) .business-item-title {
  background-image: var(--about-business-background-violet);
}
@media (max-width: 767px) {
  .business-container .business-item:nth-of-type(3) .business-item-title {
    background-image: none;
    background-color: #5738b0;
    border-color: #7a5ad5;
  }
}
@media (min-width: 768px) {
  .business-container .business-item:nth-of-type(3) .business-item-title::before {
    background-image: var(--about-business-dot-violet);
  }
}

/* 조직도 */
/* --- 기본 세팅 및 초기화 --- */
.org-container-wrap {
  width: 100%;
  border: 1px solid var(--border-basic);
  border-radius: 2rem;
}

.org-container {
  font-weight: 500;
  text-align: center;
  overflow: hidden;
  gap: 4rem;
  padding-top: 8.6rem;
  padding-bottom: 8.6rem;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  flex-wrap: nowrap;
  width: 100%;
  max-width: 110rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
}
@media (min-width: 1024px) {
  .org-container {
    font-size: var(--krds-pc-font-size-heading-xxsmall);
  }
}
@media (max-width: 1023px) {
  .org-container {
    padding: 4rem 1rem;
    font-size: var(--krds-mobile-font-size-heading-xxsmall);
  }
}
@media (max-width: 359px) {
  .org-container {
    font-size: var(--krds-mobile-font-size-heading-xxsmall);
  }
}
.org-container .node-group {
  width: 100%;
  position: relative;
}
.org-container .node-group .node {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  flex-wrap: nowrap;
}
.org-container .node-group .node .node-shape {
  padding: 1rem;
  background-color: #132789;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  flex-wrap: nowrap;
}
.org-container li {
  position: relative;
}
.org-container ::before,
.org-container ::after {
  border-width: 0;
  border-style: solid;
  border-color: #ccc;
  z-index: -1;
}

/* 1. 대표이사 / 전문위원 */
.node-group.top-level {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 1023px) {
  .node-group.top-level {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: row;
    flex-wrap: nowrap;
  }
}
.node-group.top-level .node.ceo {
  grid-column: 2/3;
  grid-row: 1/2;
}
@media (min-width: 1024px) {
  .node-group.top-level .node.ceo {
    font-size: var(--krds-pc-font-size-heading-small);
  }
}
@media (max-width: 1023px) {
  .node-group.top-level .node.ceo {
    font-size: var(--krds-mobile-font-size-heading-small);
  }
}
.node-group.top-level .node.advisor {
  grid-column: 3/4;
  grid-row: 1/2;
  position: relative;
}
.node-group.top-level .node.advisor::before {
  position: absolute;
  top: 50%;
  right: 50%;
  content: "";
  z-index: 1;
  display: block;
  width: 100%;
  border-top-width: 0.2rem;
  margin-top: -0.1rem;
}
.node-group.top-level .node.advisor .node-shape {
  border: 0.6rem solid #3a6ed6;
  background-color: #fff;
  color: #333;
}
.node-group.top-level .node .node-shape {
  display: flex;
  border-radius: 50%;
  position: relative;
  z-index: 9;
}
@media (min-width: 1024px) {
  .node-group.top-level .node .node-shape {
    width: 19rem;
    height: 19rem;
  }
}
@media (max-width: 1023px) {
  .node-group.top-level .node .node-shape {
    width: 10rem;
    height: 10rem;
  }
}

/* 2. 감사실 / 경영지원본부 */
.node-group.middle-level {
  gap: 3rem 0;
}
@media (min-width: 1024px) {
  .node-group.middle-level {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
  }
}
@media (max-width: 1023px) {
  .node-group.middle-level {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    flex-wrap: nowrap;
  }
}
.node-group.middle-level::before {
  content: "";
  display: block;
  height: calc(100% + 8rem);
  border-left-width: 2px;
  position: absolute;
  bottom: -4rem;
}
@media (min-width: 1024px) {
  .node-group.middle-level::before {
    right: 50%;
  }
}
@media (max-width: 1023px) {
  .node-group.middle-level::before {
    right: 75%;
  }
}
.node-group.middle-level:last-child::before {
  height: calc(100% + 4rem);
  position: absolute;
  bottom: calc(50% - 0.1rem);
}
.node-group.middle-level .side-staff {
  gap: 1.6rem 0;
  width: 50%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: column;
  flex-wrap: nowrap;
}
@media (max-width: 1023px) {
  .node-group.middle-level .side-staff {
    width: 100%;
    padding-left: 50%;
  }
}
.node-group.middle-level .side-staff .node.staff .node-shape {
  background-color: #623dc9;
  color: #fff;
  border-radius: 3rem;
}
@media (min-width: 1024px) {
  .node-group.middle-level .side-staff .node.staff .node-shape {
    width: 23rem;
  }
}
@media (max-width: 1023px) {
  .node-group.middle-level .side-staff .node.staff .node-shape {
    width: 100%;
  }
}
.node-group.middle-level .side-staff .node.staff .node-shape::before {
  content: "";
  display: block;
  position: absolute;
}
.node-group.middle-level .side-staff .node.staff:nth-of-type(1) .node-shape::before {
  width: 15%;
  border-bottom-width: 2px;
  bottom: calc(50% - 0.1rem);
}
@media (max-width: 1023px) {
  .node-group.middle-level .side-staff .node.staff:nth-of-type(1) .node-shape::before {
    right: auto;
    left: 25%;
  }
}
.node-group.middle-level .side-staff .node.staff:nth-of-type(2) .node-shape::before {
  border-top-left-radius: 1rem;
}
.node-group.middle-level .side-staff .node.staff:last-of-type .node-shape::before {
  border-bottom-left-radius: 1rem;
}
.node-group.middle-level .side-staff .node.staff:nth-of-type(n+2) {
  position: relative;
}
.node-group.middle-level .side-staff .node.staff:nth-of-type(n+2) .node-shape::before {
  bottom: calc(50% - 0.1rem);
  border-width: 0.2rem;
}
@media (max-width: 1023px) {
  .node-group.middle-level .side-staff .node.staff:nth-of-type(n+2) .node-shape::before {
    right: 70%;
    width: 50%;
    height: 5.7rem;
    border-right-width: 0;
  }
}
.node-group.middle-level .side-staff .node.staff:nth-of-type(n+3) .node-shape::before {
  border-top-width: 0;
}
.node-group.middle-level .side-staff:nth-of-type(odd) .node.staff:nth-of-type(1) .node-shape::before {
  right: 0;
}
.node-group.middle-level .side-staff:nth-of-type(odd) .node.staff:only-child .node-shape::before {
  width: 50%;
}
@media (min-width: 1024px) {
  .node-group.middle-level .side-staff:nth-of-type(odd) .node.staff:nth-of-type(2) .node-shape::before {
    border-top-right-radius: 1rem;
  }
}
@media (min-width: 1024px) {
  .node-group.middle-level .side-staff:nth-of-type(odd) .node.staff:last-of-type .node-shape::before {
    border-bottom-right-radius: 1rem;
  }
}
@media (min-width: 1024px) {
  .node-group.middle-level .side-staff:nth-of-type(odd) .node.staff:nth-of-type(n+2) .node-shape::before {
    right: auto;
    left: 50%;
    width: 35%;
    height: 6.8rem;
    border-left-width: 0;
  }
}
.node-group.middle-level .side-staff:nth-of-type(even) .node.staff:nth-of-type(1) .node-shape::before {
  right: 85%;
}
.node-group.middle-level .side-staff:nth-of-type(even) .node.staff:only-child .node-shape::before {
  right: 50%;
  width: 50%;
}
@media (min-width: 1024px) {
  .node-group.middle-level .side-staff:nth-of-type(even) .node.staff:nth-of-type(n+2) .node-shape::before {
    width: 35%;
    height: 6.8rem;
    right: 50%;
    border-right-width: 0;
  }
}

/* 2. 사업본부 / 팀 */
.node-group.bottom-level {
  position: relative;
  width: 100%;
  overflow: hidden;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: row;
  flex-wrap: nowrap;
}
@media (min-width: 1024px) {
  .node-group.bottom-level {
    padding-top: 2.5em;
  }
}
@media (max-width: 1023px) {
  .node-group.bottom-level {
    padding-top: 0;
    gap: 2rem;
    padding-left: 50%;
    display: flex;
    align-items: end;
    justify-content: flex-start;
    flex-direction: column;
    flex-wrap: nowrap;
  }
}
.node-group.bottom-level > li {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 1.6rem;
  flex: 1;
  width: 100%;
}
@media (min-width: 1024px) {
  .node-group.bottom-level > li {
    padding: 0 4%;
  }
}
.node-group.bottom-level > li .node.headquarter {
  padding: 1rem;
  width: 100%;
  background-color: #0c41ab;
  color: #fff;
  border-radius: 2em;
}
.node-group.bottom-level > li::before {
  content: "";
  width: 100%;
  height: 6rem;
  border-left-width: 0.2rem;
  position: absolute;
  bottom: 100%;
  right: calc(50% + 0.2rem);
}
@media (min-width: 1024px) {
  .node-group.bottom-level > li::before {
    border-top-width: 0.2rem;
  }
}
@media (max-width: 1023px) {
  .node-group.bottom-level > li::before {
    border-bottom-width: 0.2rem;
    margin-bottom: -2.2rem;
  }
}
@media (min-width: 1024px) {
  .node-group.bottom-level > li:first-of-type::before {
    right: calc(50% - 0.6rem);
    width: 1rem;
    border-top-left-radius: 0.5em;
  }
}
@media (max-width: 1023px) {
  .node-group.bottom-level > li:first-of-type::before {
    height: 2.5rem;
  }
}
@media (min-width: 1024px) {
  .node-group.bottom-level > li:nth-of-type(2)::before {
    width: calc(100% - 0.5rem);
  }
}
@media (min-width: 1024px) {
  .node-group.bottom-level > li:nth-of-type(n+2)::before {
    left: auto;
    right: 50%;
    border-left-width: 0;
    border-right-width: 2px;
  }
}
@media (max-width: 1023px) {
  .node-group.bottom-level > li:nth-of-type(n+2)::before {
    width: 100%;
    height: calc(100% + 2rem);
  }
}
@media (min-width: 1024px) {
  .node-group.bottom-level > li:last-of-type::before {
    right: 50%;
    border-top-right-radius: 0.5em;
  }
}
@media (max-width: 1023px) {
  .node-group.bottom-level > li:last-of-type::before {
    border-left-width: 0.2rem;
    border-bottom-left-radius: 1rem;
  }
}
@media (max-width: 1023px) {
  .node-group.bottom-level > li:not(:last-of-type)::after {
    content: "";
    display: block;
    width: 50%;
    height: 100%;
    border-left: 2px solid #ccc;
    position: absolute;
    top: 2rem;
    right: calc(100% + 0.2rem);
  }
}
@media (min-width: 1024px) {
  .node-group.bottom-level > li:only-child::before {
    width: 0;
    border-radius: 0;
  }
}
.node-group.bottom-level ul {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 1.6rem;
  width: 100%;
}
.node-group.bottom-level ul .node.team {
  padding: 0.8rem;
  width: 100%;
  background-color: #f7f7f7;
  border: 1px solid #c4c4c4;
  color: #333;
  border-radius: 3rem;
}
.node-group.bottom-level ul .node.team:last-of-type {
  margin-bottom: 2rem;
}

.page-top-button {
  position: fixed;
  bottom: 10px;
  right: 1%;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  color: white;
  border: none;
  cursor: pointer;
  font-size: 18px;
  font-weight: 600;
  display: none;
  z-index: 999;
  opacity: 1;
  background-color: #0d56bd;
  transition: opacity 0.5s ease-in-out;
}
@media (max-width: 767px) {
  .page-top-button {
    font-size: 14px;
    width: 36px;
    height: 36px;
  }
}

#footer {
  border-top: 1px solid var(--border-floor);
}
#footer .footer-container {
  display: flex;
  flex-direction: row-reverse;
  gap: 2rem;
  color: var(--footerText-color);
}
@media screen and (min-width: 768px) {
  #footer .footer-container {
    padding: 6.8rem 0;
    font-size: 1.8rem;
  }
}
@media screen and (max-width: 768px) {
  #footer .footer-container {
    padding: 5rem 0;
    font-size: 1.6rem;
  }
}
#footer .footer-container {
  width: 100%;
  max-width: 1640px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2rem;
  padding-right: 2rem;
}
@media (max-width: 1023px) {
  #footer .footer-container .footer-gnb-wrap {
    display: none;
  }
}
#footer .footer-container .footer-gnb-wrap > ul {
  display: flex;
  font-weight: 700;
  gap: 6rem;
}
#footer .footer-container .footer-gnb-wrap > ul > li {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
#footer .footer-container .footer-gnb-wrap > ul > li > a {
  font-size: 2.2rem;
}
#footer .footer-container .footer-gnb-wrap > ul > li > ul {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  font-weight: 500;
}
#footer .footer-container .footer-info-wrap {
  display: flex;
  flex-direction: column;
  gap: 3.2rem;
  flex: 1;
}
#footer .footer-container .footer-info-wrap p {
  font-size: 4rem;
  font-weight: 600;
  line-height: 1.2;
}
@media (max-width: 767px) {
  #footer .footer-container .footer-info-wrap p {
    font-size: 2.8rem;
  }
}
#footer .footer-container .footer-info-wrap address dl {
  display: flex;
}
#footer .footer-container .footer-info-wrap address dl dt {
  flex-shrink: 0;
  font-weight: 700;
  margin-right: 1em;
}
#footer .footer-container .footer-info-wrap address dl dd span {
  display: inline-block;
}

.un-text-shadow {
  text-shadow: none;
}

.toggleEvent-fake-button {
  float: right;
  background-color: red;
}

.hoverEvent_wrap .hoverEvent_list {
  display: none;
}

.hoverEvent_wrap .hoverEvent_list.active,
.hoverEvent_wrap:hover .hoverEvent_list {
  display: block;
}

.color-blue {
  color: #0d56bd;
}

.bg-lightGray {
  background-color: #f7f7f7 !important;
}

.bg_imgNone {
  background-image: none;
}

.border-lightGray {
  border: 1px solid #cacaca !important;
}

.align-center {
  text-align: center !important;
}

.align-right {
  text-align: right !important;
}

.grid {
  display: grid;
}

.flex {
  display: flex;
}

.mb-0 {
  margin-bottom: 0 !important;
}

.mb-1 {
  margin-bottom: 1rem !important;
}

.mb-2 {
  margin-bottom: 2rem !important;
}

.mb-3 {
  margin-bottom: 3.2rem !important;
}

.mb-4 {
  margin-bottom: 4rem !important;
}

.mb-5 {
  margin-bottom: 4.8rem !important;
}

.mb-6 {
  margin-bottom: 6rem !important;
}

.mb-7 {
  margin-bottom: 6.8rem !important;
}

.mb-8 {
  margin-bottom: 8rem !important;
}

.mb-9 {
  margin-bottom: 8.6rem !important;
}

.mb-10 {
  margin-bottom: 10rem !important;
}

.mt-0 {
  margin-top: 0 !important;
}

.mt-1 {
  margin-top: 1rem !important;
}

.mt-2 {
  margin-top: 2rem !important;
}

.mt-3 {
  margin-top: 3.2rem !important;
}

.mt-4 {
  margin-top: 4rem !important;
}

.mt-5 {
  margin-top: 4.8rem !important;
}

.mt-6 {
  margin-top: 6rem !important;
}

.mt-7 {
  margin-top: 6.8rem !important;
}

.mt-8 {
  margin-top: 8rem !important;
}

.mt-9 {
  margin-top: 8.6rem !important;
}

.mt-10 {
  margin-top: 10rem !important;
}

.pt-1em {
  padding-top: 1em !important;
}

.pt-2em {
  padding-top: 2em !important;
}

.pt-3em {
  padding-top: 3em !important;
}

.pt-4em {
  padding-top: 4em !important;
}

.pt-5em {
  padding-top: 5em !important;
}

.pd4per {
  padding: 4%;
}

.pdTop1em {
  padding-top: 1em !important;
}

.pdTop2em {
  padding-top: 2em !important;
}

.pdBottom1em {
  padding-bottom: 1em !important;
}

.pdBottom2em {
  padding-bottom: 2em !important;
}

.pdBottom3em {
  padding-bottom: 3em !important;
}