:root { /* PRIMITIVE */ --wb-color-light-primary-5: #ecf2fe; --wb-color-light-primary-10: #d8e5fd; --wb-color-light-primary-20: #b1cefb; --wb-color-light-primary-30: #86aff9; --wb-color-light-primary-40: #4c87f6; --wb-color-light-primary-50: #256ef4; --wb-color-light-primary-60: #0b50d0; --wb-color-light-primary-70: #083891; --wb-color-light-primary-80: #052561; --wb-color-light-primary-90: #03163a; --wb-color-light-primary-95: #020f27; --wb-color-light-secondary-5: #eef2f7; --wb-color-light-secondary-10: #d6e0eb; --wb-color-light-secondary-20: #bacbde; --wb-color-light-secondary-30: #90b0d5; --wb-color-light-secondary-40: #6b96c7; --wb-color-light-secondary-50: #346fb2; --wb-color-light-secondary-60: #1c589c; --wb-color-light-secondary-70: #063a74; --wb-color-light-secondary-80: #052b57; --wb-color-light-secondary-90: #031f3f; --wb-color-light-secondary-95: #02162c; --wb-color-light-gray-0: #ffffff; --wb-color-light-gray-5: #f4f5f6; --wb-color-light-gray-10: #e6e8ea; --wb-color-light-gray-20: #cdd1d5; --wb-color-light-gray-30: #b1b8be; --wb-color-light-gray-40: #8a949e; --wb-color-light-gray-50: #6d7882; --wb-color-light-gray-60: #58616a; --wb-color-light-gray-70: #464c53; --wb-color-light-gray-80: #33363d; --wb-color-light-gray-90: #1e2124; --wb-color-light-gray-95: #131416; --wb-color-light-gray-100: #000000; --wb-color-light-alpha-black100: #000000; --wb-color-light-alpha-black75: #000000bf; --wb-color-light-alpha-black50: #00000080; --wb-color-light-alpha-black25: #00000040; --wb-color-light-alpha-black10: #0000001a; --wb-color-light-alpha-black0: #00000000; --wb-color-light-alpha-white100: #ffffff; --wb-color-light-alpha-white75: #ffffffbf; --wb-color-light-alpha-white50: #ffffff80; --wb-color-light-alpha-white25: #ffffff40; --wb-color-light-alpha-white10: #ffffff1a; --wb-color-light-alpha-white0: #ffffff00; --wb-color-light-danger-5: #fdefec; --wb-color-light-danger-10: #fcdfd9; --wb-color-light-danger-20: #f7afa1; --wb-color-light-danger-30: #f48771; --wb-color-light-danger-40: #f05f42; --wb-color-light-danger-50: #de3412; --wb-color-light-danger-60: #bd2c0f; --wb-color-light-danger-70: #8a240f; --wb-color-light-danger-80: #5c180a; --wb-color-light-danger-90: #390d05; --wb-color-light-danger-95: #260903; --wb-color-light-information-5: #e7f4fe; --wb-color-light-information-10: #d3ebfd; --wb-color-light-information-20: #9ed2fa; --wb-color-light-information-30: #5fb5f7; --wb-color-light-information-40: #2098f3; --wb-color-light-information-50: #0b78cb; --wb-color-light-information-60: #096ab3; --wb-color-light-information-70: #085691; --wb-color-light-information-80: #053961; --wb-color-light-information-90: #03253f; --wb-color-light-information-95: #021a2c; --wb-color-light-warning-5: #fff3db; --wb-color-light-warning-10: #ffe0a3; --wb-color-light-warning-20: #ffc95c; --wb-color-light-warning-30: #ffb114; --wb-color-light-warning-40: #c78500; --wb-color-light-warning-50: #9e6a00; --wb-color-light-warning-60: #8a5c00; --wb-color-light-warning-70: #614100; --wb-color-light-warning-80: #422c00; --wb-color-light-warning-90: #2e1f00; --wb-color-light-warning-95: #241800; --wb-color-light-success-5: #eaf6ec; --wb-color-light-success-10: #d8eedd; --wb-color-light-success-20: #a9dab4; --wb-color-light-success-30: #7ec88e; --wb-color-light-success-40: #3fa654; --wb-color-light-success-50: #228738; --wb-color-light-success-60: #267337; --wb-color-light-success-70: #285d33; --wb-color-light-success-80: #1f4727; --wb-color-light-success-90: #122b18; --wb-color-light-success-95: #0e2012; --wb-color-light-point-5: #fbeff0; --wb-color-light-point-10: #f5d6d9; --wb-color-light-point-20: #ebadb2; --wb-color-light-point-30: #e0858c; --wb-color-light-point-40: #d65c66; --wb-color-light-point-50: #d63d4a; --wb-color-light-point-60: #ab2b36; --wb-color-light-point-70: #7a1f26; --wb-color-light-point-80: #521419; --wb-color-light-point-90: #310c0f; --wb-color-light-point-95: #21080a; --wb-color-light-graphic-10: #e5ecf9; --wb-color-light-graphic-30: #98acc5; --wb-color-light-graphic-50: #61758f; --wb-color-light-graphic-70: #39506c; --wb-color-light-graphic-90: #223a58; --wb-color-high-contrast-gray-0: #ffffff; --wb-color-high-contrast-gray-5: #f4f5f6; --wb-color-high-contrast-gray-10: #e6e8ea; --wb-color-high-contrast-gray-20: #cdd1d5; --wb-color-high-contrast-gray-30: #b1b8be; --wb-color-high-contrast-gray-40: #8a949e; --wb-color-high-contrast-gray-50: #6d7882; --wb-color-high-contrast-gray-60: #58616a; --wb-color-high-contrast-gray-70: #464c53; --wb-color-high-contrast-gray-80: #33363d; --wb-color-high-contrast-gray-90: #1e2124; --wb-color-high-contrast-gray-95: #131416; --wb-color-high-contrast-gray-100: #000000; --wb-color-high-contrast-primary-5: #ecf2fe; --wb-color-high-contrast-primary-10: #d8e5fd; --wb-color-high-contrast-primary-20: #b1cefb; --wb-color-high-contrast-primary-30: #86aff9; --wb-color-high-contrast-primary-40: #4c87f6; --wb-color-high-contrast-primary-50: #256ef4; --wb-color-high-contrast-primary-60: #0b50d0; --wb-color-high-contrast-primary-70: #083891; --wb-color-high-contrast-primary-80: #052561; --wb-color-high-contrast-primary-90: #03163a; --wb-color-high-contrast-primary-95: #020f27; --wb-color-high-contrast-secondary-5: #edf6f8; --wb-color-high-contrast-secondary-10: #d5ebf1; --wb-color-high-contrast-secondary-20: #abd8e3; --wb-color-high-contrast-secondary-30: #75c0d1; --wb-color-high-contrast-secondary-40: #3d9fb8; --wb-color-high-contrast-secondary-50: #268097; --wb-color-high-contrast-secondary-60: #1f687a; --wb-color-high-contrast-secondary-70: #17505e; --wb-color-high-contrast-secondary-80: #113b45; --wb-color-high-contrast-secondary-90: #0e3139; --wb-color-high-contrast-secondary-95: #091f25; --wb-color-high-contrast-point-5: #fbeff0; --wb-color-high-contrast-point-10: #f5d6d9; --wb-color-high-contrast-point-20: #ebadb2; --wb-color-high-contrast-point-30: #e0858c; --wb-color-high-contrast-point-40: #d65c66; --wb-color-high-contrast-point-50: #d63d4a; --wb-color-high-contrast-point-60: #ab2b36; --wb-color-high-contrast-point-70: #7a1f26; --wb-color-high-contrast-point-80: #521419; --wb-color-high-contrast-point-90: #310c0f; --wb-color-high-contrast-point-95: #21080a; --wb-color-high-contrast-danger-5: #fdefec; --wb-color-high-contrast-danger-10: #fcdfd9; --wb-color-high-contrast-danger-20: #f7afa1; --wb-color-high-contrast-danger-30: #f48771; --wb-color-high-contrast-danger-40: #f05f42; --wb-color-high-contrast-danger-50: #de3412; --wb-color-high-contrast-danger-60: #bd2c0f; --wb-color-high-contrast-danger-70: #8a240f; --wb-color-high-contrast-danger-80: #5c180a; --wb-color-high-contrast-danger-90: #390d05; --wb-color-high-contrast-danger-95: #260903; --wb-color-high-contrast-warning-5: #fff3db; --wb-color-high-contrast-warning-10: #ffe0a3; --wb-color-high-contrast-warning-20: #ffc95c; --wb-color-high-contrast-warning-30: #ffb114; --wb-color-high-contrast-warning-40: #c78500; --wb-color-high-contrast-warning-50: #9e6a00; --wb-color-high-contrast-warning-60: #8a5c00; --wb-color-high-contrast-warning-70: #614100; --wb-color-high-contrast-warning-80: #422c00; --wb-color-high-contrast-warning-90: #2e1f00; --wb-color-high-contrast-warning-95: #241800; --wb-color-high-contrast-success-5: #eaf6ec; --wb-color-high-contrast-success-10: #d8eedd; --wb-color-high-contrast-success-20: #a9dab4; --wb-color-high-contrast-success-30: #7ec88e; --wb-color-high-contrast-success-40: #3fa654; --wb-color-high-contrast-success-50: #228738; --wb-color-high-contrast-success-60: #267337; --wb-color-high-contrast-success-70: #285d33; --wb-color-high-contrast-success-80: #1f4727; --wb-color-high-contrast-success-90: #122b18; --wb-color-high-contrast-success-95: #0e2012; --wb-color-high-contrast-information-5: #e7f4fe; --wb-color-high-contrast-information-10: #d3ebfd; --wb-color-high-contrast-information-20: #9ed2fa; --wb-color-high-contrast-information-30: #5fb5f7; --wb-color-high-contrast-information-40: #2098f3; --wb-color-high-contrast-information-50: #0b78cb; --wb-color-high-contrast-information-60: #096ab3; --wb-color-high-contrast-information-70: #085691; --wb-color-high-contrast-information-80: #053961; --wb-color-high-contrast-information-90: #03253f; --wb-color-high-contrast-information-95: #021a2c; --wb-color-high-contrast-alpha-black100: #000000; --wb-color-high-contrast-alpha-black75: #000000bf; --wb-color-high-contrast-alpha-black50: #00000080; --wb-color-high-contrast-alpha-black25: #00000040; --wb-color-high-contrast-alpha-black10: #0000001a; --wb-color-high-contrast-alpha-black0: #00000000; --wb-color-high-contrast-alpha-white100: #ffffff; --wb-color-high-contrast-alpha-white75: #ffffffbf; --wb-color-high-contrast-alpha-white50: #ffffff80; --wb-color-high-contrast-alpha-white25: #ffffff40; --wb-color-high-contrast-alpha-white10: #ffffff1a; --wb-color-high-contrast-alpha-white0: #ffffff00; --wb-color-high-contrast-graphic-10: #e5ecf9; --wb-color-high-contrast-graphic-30: #98acc5; --wb-color-high-contrast-graphic-50: #61758f; --wb-color-high-contrast-graphic-70: #39506c; --wb-color-high-contrast-graphic-90: #223a58; --wb-typo-font-type: Pretendard GOV; --wb-typo-font-weight-regular: Regular; --wb-typo-font-weight-bold: Bold; --wb-typo-letter-spacing-0: 0rem; --wb-typo-letter-spacing-1: 0.1rem; --wb-number-0: 0rem; --wb-number-1: 0.1rem; --wb-number-2: 0.2rem; --wb-number-3: 0.4rem; --wb-number-4: 0.6rem; --wb-number-5: 0.8rem; --wb-number-6: 1rem; --wb-number-7: 1.2rem; --wb-number-8: 1.6rem; --wb-number-9: 2rem; --wb-number-10: 2.4rem; --wb-number-11: 2.8rem; --wb-number-12: 3.2rem; --wb-number-13: 3.6rem; --wb-number-14: 4rem; --wb-number-15: 4.4rem; --wb-number-16: 4.8rem; --wb-number-17: 5.6rem; --wb-number-18: 6.4rem; --wb-number-19: 7.2rem; --wb-number-20: 8rem; --wb-number-21: 9.6rem; --wb-number-max: 100rem; /* MODE-LIGHT */ --wb-light-color-surface-gray-subtler: var(--wb-color-light-gray-5); --wb-light-color-surface-gray-subtle: var(--wb-color-light-gray-10); --wb-light-color-surface-disabled: var(--wb-color-light-gray-20); --wb-light-color-surface-primary-subtler: var(--wb-color-light-primary-5); --wb-light-color-surface-secondary-subtler: var(--wb-color-light-secondary-5); --wb-light-color-surface-danger-subtler: var(--wb-color-light-danger-5); --wb-light-color-surface-warning-subtler: var(--wb-color-light-warning-5); --wb-light-color-surface-success-subtler: var(--wb-color-light-success-5); --wb-light-color-surface-information-subtler: var(--wb-color-light-information-5); --wb-light-color-surface-point-subtler: var(--wb-color-light-point-5); --wb-light-color-surface-white: var(--wb-color-light-gray-0); --wb-light-color-surface-inverse: var(--wb-color-light-gray-90); --wb-light-color-surface-white-static: var(--wb-color-light-gray-0); --wb-light-color-surface-inverse-static: var(--wb-color-light-gray-90); --wb-light-color-surface-white-subtle: var(--wb-color-light-gray-0); --wb-light-color-surface-white-subtler: var(--wb-color-light-gray-0); --wb-light-color-border-gray-light: var(--wb-color-light-gray-20); --wb-light-color-border-gray: var(--wb-color-light-gray-30); --wb-light-color-border-secondary-light: var(--wb-color-light-secondary-10); --wb-light-color-border-danger-light: var(--wb-color-light-danger-10); --wb-light-color-border-danger: var(--wb-color-light-danger-50); --wb-light-color-border-warning-light: var(--wb-color-light-warning-10); --wb-light-color-border-warning: var(--wb-color-light-warning-50); --wb-light-color-border-success-light: var(--wb-color-light-success-10); --wb-light-color-border-success: var(--wb-color-light-success-50); --wb-light-color-border-information-light: var(--wb-color-light-information-10); --wb-light-color-border-information: var(--wb-color-light-information-50); --wb-light-color-border-gray-dark: var(--wb-color-light-gray-60); --wb-light-color-border-primary: var(--wb-color-light-primary-50); --wb-light-color-border-disabled: var(--wb-color-light-gray-30); --wb-light-color-border-gray-darker: var(--wb-color-light-gray-90); --wb-light-color-border-secondary: var(--wb-color-light-secondary-70); --wb-light-color-border-inverse: var(--wb-color-light-gray-0); --wb-light-color-border-transparency: var(--wb-color-light-alpha-black0); --wb-light-color-border-primary-light: var(--wb-color-light-primary-10); --wb-light-color-border-point: var(--wb-color-light-point-50); --wb-light-color-border-point-light: var(--wb-color-light-point-10); --wb-light-color-divider-gray-light: var(--wb-color-light-gray-20); --wb-light-color-divider-gray: var(--wb-color-light-gray-40); --wb-light-color-divider-gray-dark: var(--wb-color-light-gray-50); --wb-light-color-divider-primary: var(--wb-color-light-primary-50); --wb-light-color-divider-secondary-light: var(--wb-color-light-secondary-10); --wb-light-color-divider-secondary: var(--wb-color-light-secondary-70); --wb-light-color-divider-error: var(--wb-color-light-danger-50); --wb-light-color-divider-primary-light: var(--wb-color-light-primary-10); --wb-light-color-divider-inverse: var(--wb-color-light-gray-0); --wb-light-color-divider-gray-darker: var(--wb-color-light-gray-90); --wb-light-color-divider-point: var(--wb-color-light-point-50); --wb-light-color-text-bolder: var(--wb-color-light-gray-95); --wb-light-color-text-subtle: var(--wb-color-light-gray-70); --wb-light-color-text-disabled: var(--wb-color-light-gray-40); --wb-light-color-text-disabled-on: var(--wb-color-light-gray-50); --wb-light-color-text-primary: var(--wb-color-light-primary-60); --wb-light-color-text-secondary: var(--wb-color-light-secondary-80); --wb-light-color-text-danger: var(--wb-color-light-danger-60); --wb-light-color-text-warning: var(--wb-color-light-warning-60); --wb-light-color-text-success: var(--wb-color-light-success-60); --wb-light-color-text-information: var(--wb-color-light-information-60); --wb-light-color-text-basic: var(--wb-color-light-gray-90); --wb-light-color-text-point: var(--wb-color-light-point-60); --wb-light-color-text-bolder-inverse: var(--wb-color-light-gray-0); --wb-light-color-text-basic-inverse: var(--wb-color-light-gray-0); --wb-light-color-text-subtle-inverse: var(--wb-color-light-gray-30); --wb-light-color-text-inverse-static: var(--wb-color-light-gray-0); --wb-light-color-text-static: var(--wb-color-light-gray-90); --wb-light-color-icon-gray: var(--wb-color-light-gray-80); --wb-light-color-icon-gray-fill: var(--wb-color-light-gray-20); --wb-light-color-icon-inverse: var(--wb-color-light-gray-0); --wb-light-color-icon-primary: var(--wb-color-light-primary-50); --wb-light-color-icon-secondary: var(--wb-color-light-secondary-80); --wb-light-color-icon-point: var(--wb-color-light-point-50); --wb-light-color-icon-danger: var(--wb-color-light-danger-50); --wb-light-color-icon-warning: var(--wb-color-light-warning-50); --wb-light-color-icon-success: var(--wb-color-light-success-50); --wb-light-color-icon-information: var(--wb-color-light-information-50); --wb-light-color-icon-gray-light: var(--wb-color-light-gray-70); --wb-light-color-icon-disabled: var(--wb-color-light-gray-40); --wb-light-color-icon-disabled-on: var(--wb-color-light-gray-50); --wb-light-color-icon-inverse-static: var(--wb-color-light-gray-0); --wb-light-color-icon-primary-static: var(--wb-color-light-primary-50); --wb-light-color-icon-secondary-static: var(--wb-color-light-secondary-80); --wb-light-color-icon-point-static: var(--wb-color-light-point-50); --wb-light-color-icon-danger-static: var(--wb-color-light-danger-50); --wb-light-color-icon-warning-static: var(--wb-color-light-warning-50); --wb-light-color-icon-success-static: var(--wb-color-light-success-50); --wb-light-color-icon-information-static: var(--wb-color-light-information-50); --wb-light-color-icon-gray-static: var(--wb-color-light-gray-80); --wb-light-color-link-default: var(--wb-color-light-primary-50); --wb-light-color-link-hover: var(--wb-color-light-primary-60); --wb-light-color-link-pressed: var(--wb-color-light-primary-70); --wb-light-color-link-visited: #5917b8; --wb-light-color-button-primary-fill: var(--wb-color-light-primary-50); --wb-light-color-button-primary-fill-hover: var(--wb-color-light-primary-60); --wb-light-color-button-primary-fill-pressed: var(--wb-color-light-primary-70); --wb-light-color-button-secondary-fill: var(--wb-color-light-primary-5); --wb-light-color-button-secondary-fill-hover: var(--wb-color-light-primary-10); --wb-light-color-button-secondary-fill-pressed: var(--wb-color-light-primary-20); --wb-light-color-button-secondary-border: var(--wb-color-light-primary-50); --wb-light-color-button-tertiary-fill: var(--wb-color-light-alpha-white0); --wb-light-color-button-tertiary-fill-hover: var(--wb-color-light-gray-5); --wb-light-color-button-tertiary-fill-pressed: var(--wb-color-light-gray-10); --wb-light-color-button-tertiary-border: var(--wb-color-light-gray-60); --wb-light-color-button-disabled-fill: var(--wb-color-light-gray-20); --wb-light-color-button-text-fill-hover: var(--wb-color-light-secondary-5); --wb-light-color-button-text-fill-pressed: var(--wb-color-light-secondary-10); --wb-light-color-button-text-fill: var(--wb-color-light-alpha-white0); --wb-light-color-button-text-border: var(--wb-color-light-alpha-black0); --wb-light-color-button-disabled-border: var(--wb-color-light-gray-30); --wb-light-color-background-white: var(--wb-color-light-gray-0); --wb-light-color-background-inverse: var(--wb-color-light-gray-90); --wb-light-color-background-gray-subtler: var(--wb-color-light-gray-5); --wb-light-color-background-gray-subtle: var(--wb-color-light-gray-10); --wb-light-color-background-dim: var(--wb-color-light-alpha-black75); --wb-light-color-element-disabled-light: var(--wb-color-light-gray-20); --wb-light-color-element-disabled-dark: var(--wb-color-light-gray-40); --wb-light-color-element-gray-lighter: var(--wb-color-light-gray-5); --wb-light-color-element-gray-light: var(--wb-color-light-gray-10); --wb-light-color-element-gray: var(--wb-color-light-gray-50); --wb-light-color-element-primary-lighter: var(--wb-color-light-primary-5); --wb-light-color-element-primary-light: var(--wb-color-light-primary-10); --wb-light-color-element-primary: var(--wb-color-light-primary-50); --wb-light-color-element-secondary-lighter: var(--wb-color-light-secondary-5); --wb-light-color-element-secondary-light: var(--wb-color-light-secondary-10); --wb-light-color-element-secondary: var(--wb-color-light-secondary-70); --wb-light-color-element-point-lighter: var(--wb-color-light-point-5); --wb-light-color-element-point-light: var(--wb-color-light-point-10); --wb-light-color-element-point: var(--wb-color-light-point-50); --wb-light-color-element-danger-lighter: var(--wb-color-light-danger-5); --wb-light-color-element-danger: var(--wb-color-light-danger-50); --wb-light-color-element-warning-lighter: var(--wb-color-light-warning-5); --wb-light-color-element-warning: var(--wb-color-light-warning-30); --wb-light-color-element-success-lighter: var(--wb-color-light-success-5); --wb-light-color-element-success: var(--wb-color-light-success-50); --wb-light-color-element-information-lighter: var(--wb-color-light-information-5); --wb-light-color-element-information: var(--wb-color-light-information-50); --wb-light-color-element-inverse: var(--wb-color-light-gray-0); --wb-light-color-element-gray-dark: var(--wb-color-light-gray-60); --wb-light-color-element-inverse-static: var(--wb-color-light-gray-0); --wb-light-color-action-white: var(--wb-color-light-gray-0); --wb-light-color-action-primary: var(--wb-color-light-alpha-white0); --wb-light-color-action-primary-hover: var(--wb-color-light-primary-5); --wb-light-color-action-primary-pressed: var(--wb-color-light-primary-10); --wb-light-color-action-secondary: var(--wb-color-light-alpha-white0); --wb-light-color-action-secondary-hover: var(--wb-color-light-secondary-5); --wb-light-color-action-secondary-pressed: var(--wb-color-light-secondary-10); --wb-light-color-action-secondary-selected: var(--wb-color-light-secondary-5); --wb-light-color-action-secondary-on: var(--wb-color-light-alpha-white0); --wb-light-color-action-secondary-on-hover: var(--wb-color-light-gray-0); --wb-light-color-action-secondary-on-pressed: var(--wb-color-light-secondary-10); --wb-light-color-action-secondary-on-selected: var(--wb-color-light-gray-0); --wb-light-color-action-secondary-active: var(--wb-color-light-secondary-70); --wb-light-color-action-primary-active: var(--wb-color-light-primary-50); --wb-light-color-action-disabled: var(--wb-color-light-gray-20); --wb-light-color-action-primary-selected: var(--wb-color-light-primary-5); --wb-light-color-input-border: var(--wb-color-light-gray-60); --wb-light-color-input-border-disabled: var(--wb-color-light-gray-30); --wb-light-color-input-border-active: var(--wb-color-light-primary-50); --wb-light-color-input-border-error: var(--wb-color-light-danger-50); --wb-light-color-input-surface: var(--wb-color-light-gray-0); --wb-light-color-input-surface-disabled: var(--wb-color-light-gray-20); --wb-light-color-graphic-blue-subtler: var(--wb-color-light-graphic-10); --wb-light-color-graphic-blue-subtle: var(--wb-color-light-graphic-30); --wb-light-color-graphic-blue: var(--wb-color-light-graphic-50); --wb-light-color-graphic-blue-dark: var(--wb-color-light-graphic-70); --wb-light-color-graphic-blue-darker: var(--wb-color-light-graphic-90); --wb-light-color-graphic-red-subtler: var(--wb-color-light-point-5); --wb-light-color-graphic-red-subtle: var(--wb-color-light-point-10); --wb-light-color-graphic-red: var(--wb-color-high-contrast-point-20); --wb-light-color-graphic-red-dark: var(--wb-color-high-contrast-point-40); --wb-light-color-graphic-red-darker: var(--wb-color-high-contrast-point-70); --wb-light-color-graphic-brand: var(--wb-color-light-primary-50); --wb-light-color-alpha-base100: var(--wb-color-light-alpha-white100); --wb-light-color-alpha-base50: var(--wb-color-light-alpha-white50); --wb-light-color-alpha-base25: var(--wb-color-high-contrast-alpha-white25); --wb-light-color-alpha-base0: var(--wb-color-light-alpha-white0); --wb-light-color-alpha-inverse100: var(--wb-color-light-alpha-black100); --wb-light-color-alpha-inverse50: var(--wb-color-light-alpha-black50); --wb-light-color-alpha-inverse25: var(--wb-color-light-alpha-black25); --wb-light-color-alpha-inverse0: var(--wb-color-light-alpha-black0); --wb-light-color-alpha-base75: var(--wb-color-light-alpha-white75); --wb-light-color-alpha-inverse75: var(--wb-color-light-alpha-black75); --wb-light-color-alpha-inverse10: var(--wb-color-light-alpha-black10); --wb-light-color-alpha-base10: var(--wb-color-high-contrast-alpha-white10); --wb-light-color-alpha-shadow1: #0000000d; --wb-light-color-alpha-shadow2: #00000014; --wb-light-color-alpha-shadow3: #0000001f; --wb-light-border-width-variable-regular: 0.1rem; --wb-light-border-width-variable-medium: 0.2rem; --wb-light-border-width-static-regular: 0.1rem; --wb-light-border-width-static-medium: 0.2rem; /* MODE-HIGH-CONTRAST */ --wb-high-contrast-color-surface-gray-subtler: var(--wb-color-high-contrast-gray-95); --wb-high-contrast-color-surface-gray-subtle: var(--wb-color-high-contrast-gray-90); --wb-high-contrast-color-surface-disabled: var(--wb-color-high-contrast-gray-70); --wb-high-contrast-color-surface-primary-subtler: var(--wb-color-high-contrast-primary-95); --wb-high-contrast-color-surface-secondary-subtler: var(--wb-color-high-contrast-secondary-95); --wb-high-contrast-color-surface-danger-subtler: var(--wb-color-high-contrast-danger-95); --wb-high-contrast-color-surface-warning-subtler: var(--wb-color-high-contrast-warning-95); --wb-high-contrast-color-surface-success-subtler: var(--wb-color-high-contrast-success-95); --wb-high-contrast-color-surface-information-subtler: var(--wb-color-high-contrast-information-95); --wb-high-contrast-color-surface-point-subtler: var(--wb-color-high-contrast-point-95); --wb-high-contrast-color-surface-white: var(--wb-color-high-contrast-gray-100); --wb-high-contrast-color-surface-inverse: var(--wb-color-high-contrast-gray-10); --wb-high-contrast-color-surface-white-static: var(--wb-color-high-contrast-gray-0); --wb-high-contrast-color-surface-inverse-static: var(--wb-color-high-contrast-gray-90); --wb-high-contrast-color-surface-white-subtle: var(--wb-color-high-contrast-gray-95); --wb-high-contrast-color-surface-white-subtler: var(--wb-color-high-contrast-gray-90); --wb-high-contrast-color-border-gray-light: var(--wb-color-high-contrast-gray-80); --wb-high-contrast-color-border-gray: var(--wb-color-high-contrast-gray-70); --wb-high-contrast-color-border-secondary-light: var(--wb-color-high-contrast-secondary-90); --wb-high-contrast-color-border-danger-light: var(--wb-color-high-contrast-danger-90); --wb-high-contrast-color-border-danger: var(--wb-color-high-contrast-danger-50); --wb-high-contrast-color-border-warning-light: var(--wb-color-high-contrast-warning-90); --wb-high-contrast-color-border-warning: var(--wb-color-high-contrast-warning-50); --wb-high-contrast-color-border-success-light: var(--wb-color-high-contrast-success-90); --wb-high-contrast-color-border-success: var(--wb-color-high-contrast-success-50); --wb-high-contrast-color-border-information-light: var(--wb-color-high-contrast-information-90); --wb-high-contrast-color-border-information: var(--wb-color-high-contrast-information-50); --wb-high-contrast-color-border-gray-dark: var(--wb-color-high-contrast-gray-40); --wb-high-contrast-color-border-primary: var(--wb-color-high-contrast-primary-50); --wb-high-contrast-color-border-disabled: var(--wb-color-high-contrast-gray-70); --wb-high-contrast-color-border-gray-darker: var(--wb-color-high-contrast-gray-10); --wb-high-contrast-color-border-secondary: var(--wb-color-high-contrast-secondary-60); --wb-high-contrast-color-border-inverse: var(--wb-color-high-contrast-gray-100); --wb-high-contrast-color-border-transparency: var(--wb-color-high-contrast-alpha-white25); --wb-high-contrast-color-border-primary-light: var(--wb-color-high-contrast-primary-90); --wb-high-contrast-color-border-point: var(--wb-color-high-contrast-point-50); --wb-high-contrast-color-border-point-light: var(--wb-color-high-contrast-point-90); --wb-high-contrast-color-divider-gray-light: var(--wb-color-high-contrast-gray-80); --wb-high-contrast-color-divider-gray: var(--wb-color-high-contrast-gray-70); --wb-high-contrast-color-divider-gray-dark: var(--wb-color-high-contrast-gray-50); --wb-high-contrast-color-divider-primary: var(--wb-color-high-contrast-primary-50); --wb-high-contrast-color-divider-secondary-light: var(--wb-color-high-contrast-secondary-90); --wb-high-contrast-color-divider-secondary: var(--wb-color-high-contrast-secondary-60); --wb-high-contrast-color-divider-error: var(--wb-color-high-contrast-danger-50); --wb-high-contrast-color-divider-primary-light: var(--wb-color-high-contrast-primary-90); --wb-high-contrast-color-divider-inverse: var(--wb-color-high-contrast-gray-100); --wb-high-contrast-color-divider-gray-darker: var(--wb-color-high-contrast-gray-10); --wb-high-contrast-color-divider-point: var(--wb-color-high-contrast-point-50); --wb-high-contrast-color-text-bolder: var(--wb-color-high-contrast-gray-10); --wb-high-contrast-color-text-subtle: var(--wb-color-high-contrast-gray-20); --wb-high-contrast-color-text-disabled: var(--wb-color-high-contrast-gray-60); --wb-high-contrast-color-text-disabled-on: var(--wb-color-high-contrast-gray-50); --wb-high-contrast-color-text-primary: var(--wb-color-high-contrast-primary-20); --wb-high-contrast-color-text-secondary: var(--wb-color-high-contrast-secondary-20); --wb-high-contrast-color-text-danger: var(--wb-color-high-contrast-danger-20); --wb-high-contrast-color-text-warning: var(--wb-color-high-contrast-warning-20); --wb-high-contrast-color-text-success: var(--wb-color-high-contrast-success-20); --wb-high-contrast-color-text-information: var(--wb-color-high-contrast-information-20); --wb-high-contrast-color-text-basic: var(--wb-color-high-contrast-gray-5); --wb-high-contrast-color-text-point: var(--wb-color-high-contrast-point-20); --wb-high-contrast-color-text-bolder-inverse: var(--wb-color-high-contrast-gray-95); --wb-high-contrast-color-text-basic-inverse: var(--wb-color-high-contrast-gray-90); --wb-high-contrast-color-text-subtle-inverse: var(--wb-color-high-contrast-gray-70); --wb-high-contrast-color-text-inverse-static: var(--wb-color-high-contrast-gray-0); --wb-high-contrast-color-text-static: var(--wb-color-high-contrast-gray-90); --wb-high-contrast-color-icon-gray: var(--wb-color-high-contrast-gray-5); --wb-high-contrast-color-icon-gray-fill: var(--wb-color-high-contrast-gray-70); --wb-high-contrast-color-icon-inverse: var(--wb-color-high-contrast-gray-90); --wb-high-contrast-color-icon-primary: var(--wb-color-high-contrast-primary-20); --wb-high-contrast-color-icon-secondary: var(--wb-color-high-contrast-secondary-20); --wb-high-contrast-color-icon-point: var(--wb-color-high-contrast-point-20); --wb-high-contrast-color-icon-danger: var(--wb-color-high-contrast-danger-20); --wb-high-contrast-color-icon-warning: var(--wb-color-high-contrast-warning-20); --wb-high-contrast-color-icon-success: var(--wb-color-high-contrast-success-20); --wb-high-contrast-color-icon-information: var(--wb-color-high-contrast-information-20); --wb-high-contrast-color-icon-gray-light: var(--wb-color-high-contrast-gray-20); --wb-high-contrast-color-icon-disabled: var(--wb-color-high-contrast-gray-60); --wb-high-contrast-color-icon-disabled-on: var(--wb-color-high-contrast-gray-50); --wb-high-contrast-color-icon-inverse-static: var(--wb-color-high-contrast-gray-0); --wb-high-contrast-color-icon-primary-static: var(--wb-color-high-contrast-primary-50); --wb-high-contrast-color-icon-secondary-static: var(--wb-color-high-contrast-secondary-80); --wb-high-contrast-color-icon-point-static: var(--wb-color-high-contrast-point-50); --wb-high-contrast-color-icon-danger-static: var(--wb-color-high-contrast-danger-50); --wb-high-contrast-color-icon-warning-static: var(--wb-color-high-contrast-warning-50); --wb-high-contrast-color-icon-success-static: var(--wb-color-high-contrast-success-50); --wb-high-contrast-color-icon-information-static: var(--wb-color-high-contrast-information-50); --wb-high-contrast-color-icon-gray-static: var(--wb-color-high-contrast-gray-80); --wb-high-contrast-color-link-default: var(--wb-color-high-contrast-primary-30); --wb-high-contrast-color-link-hover: var(--wb-color-high-contrast-primary-20); --wb-high-contrast-color-link-pressed: var(--wb-color-high-contrast-primary-10); --wb-high-contrast-color-link-visited: #c49ff9; --wb-high-contrast-color-button-primary-fill: var(--wb-color-high-contrast-primary-50); --wb-high-contrast-color-button-primary-fill-hover: var(--wb-color-high-contrast-primary-60); --wb-high-contrast-color-button-primary-fill-pressed: var(--wb-color-high-contrast-primary-70); --wb-high-contrast-color-button-secondary-fill: var(--wb-color-high-contrast-primary-95); --wb-high-contrast-color-button-secondary-fill-hover: var(--wb-color-high-contrast-primary-90); --wb-high-contrast-color-button-secondary-fill-pressed: var(--wb-color-high-contrast-primary-80); --wb-high-contrast-color-button-secondary-border: var(--wb-color-high-contrast-primary-50); --wb-high-contrast-color-button-tertiary-fill: var(--wb-color-high-contrast-alpha-black0); --wb-high-contrast-color-button-tertiary-fill-hover: var(--wb-color-high-contrast-gray-95); --wb-high-contrast-color-button-tertiary-fill-pressed: var(--wb-color-high-contrast-gray-80); --wb-high-contrast-color-button-tertiary-border: var(--wb-color-high-contrast-gray-40); --wb-high-contrast-color-button-disabled-fill: var(--wb-color-high-contrast-gray-80); --wb-high-contrast-color-button-text-fill-hover: var(--wb-color-high-contrast-secondary-95); --wb-high-contrast-color-button-text-fill-pressed: var(--wb-color-high-contrast-secondary-90); --wb-high-contrast-color-button-text-fill: var(--wb-color-high-contrast-alpha-black0); --wb-high-contrast-color-button-text-border: var(--wb-color-high-contrast-alpha-white50); --wb-high-contrast-color-button-disabled-border: var(--wb-color-high-contrast-gray-70); --wb-high-contrast-color-background-white: var(--wb-color-high-contrast-gray-100); --wb-high-contrast-color-background-inverse: var(--wb-color-high-contrast-gray-10); --wb-high-contrast-color-background-gray-subtler: var(--wb-color-high-contrast-gray-95); --wb-high-contrast-color-background-gray-subtle: var(--wb-color-high-contrast-gray-90); --wb-high-contrast-color-background-dim: var(--wb-color-high-contrast-alpha-black75); --wb-high-contrast-color-element-disabled-light: var(--wb-color-high-contrast-gray-80); --wb-high-contrast-color-element-disabled-dark: var(--wb-color-high-contrast-gray-60); --wb-high-contrast-color-element-gray-lighter: var(--wb-color-high-contrast-gray-95); --wb-high-contrast-color-element-gray-light: var(--wb-color-high-contrast-gray-90); --wb-high-contrast-color-element-gray: var(--wb-color-high-contrast-gray-50); --wb-high-contrast-color-element-primary-lighter: var(--wb-color-high-contrast-primary-95); --wb-high-contrast-color-element-primary-light: var(--wb-color-high-contrast-primary-90); --wb-high-contrast-color-element-primary: var(--wb-color-high-contrast-primary-50); --wb-high-contrast-color-element-secondary-lighter: var(--wb-color-high-contrast-secondary-95); --wb-high-contrast-color-element-secondary-light: var(--wb-color-high-contrast-secondary-90); --wb-high-contrast-color-element-secondary: var(--wb-color-high-contrast-secondary-60); --wb-high-contrast-color-element-point-lighter: var(--wb-color-high-contrast-point-95); --wb-high-contrast-color-element-point-light: var(--wb-color-high-contrast-point-90); --wb-high-contrast-color-element-point: var(--wb-color-high-contrast-point-50); --wb-high-contrast-color-element-danger-lighter: var(--wb-color-high-contrast-danger-95); --wb-high-contrast-color-element-danger: var(--wb-color-high-contrast-danger-50); --wb-high-contrast-color-element-warning-lighter: var(--wb-color-high-contrast-warning-95); --wb-high-contrast-color-element-warning: var(--wb-color-high-contrast-warning-30); --wb-high-contrast-color-element-success-lighter: var(--wb-color-high-contrast-success-95); --wb-high-contrast-color-element-success: var(--wb-color-high-contrast-success-50); --wb-high-contrast-color-element-information-lighter: var(--wb-color-high-contrast-information-95); --wb-high-contrast-color-element-information: var(--wb-color-high-contrast-information-50); --wb-high-contrast-color-element-inverse: var(--wb-color-high-contrast-gray-95); --wb-high-contrast-color-element-gray-dark: var(--wb-color-high-contrast-gray-40); --wb-high-contrast-color-element-inverse-static: var(--wb-color-high-contrast-gray-0); --wb-high-contrast-color-action-white: var(--wb-color-light-gray-100); --wb-high-contrast-color-action-primary: var(--wb-color-high-contrast-alpha-black0); --wb-high-contrast-color-action-primary-hover: var(--wb-color-high-contrast-primary-95); --wb-high-contrast-color-action-primary-pressed: var(--wb-color-high-contrast-primary-90); --wb-high-contrast-color-action-secondary: var(--wb-color-light-alpha-black0); --wb-high-contrast-color-action-secondary-hover: var(--wb-color-high-contrast-secondary-95); --wb-high-contrast-color-action-secondary-pressed: var(--wb-color-high-contrast-secondary-90); --wb-high-contrast-color-action-secondary-selected: var(--wb-color-high-contrast-secondary-95); --wb-high-contrast-color-action-secondary-on: var(--wb-color-high-contrast-alpha-black0); --wb-high-contrast-color-action-secondary-on-hover: var(--wb-color-high-contrast-gray-100); --wb-high-contrast-color-action-secondary-on-pressed: var(--wb-color-high-contrast-secondary-90); --wb-high-contrast-color-action-secondary-on-selected: var(--wb-color-high-contrast-gray-95); --wb-high-contrast-color-action-secondary-active: var(--wb-color-high-contrast-secondary-60); --wb-high-contrast-color-action-primary-active: var(--wb-color-high-contrast-primary-50); --wb-high-contrast-color-action-disabled: var(--wb-color-high-contrast-gray-80); --wb-high-contrast-color-action-primary-selected: var(--wb-color-high-contrast-primary-95); --wb-high-contrast-color-input-border: var(--wb-color-high-contrast-gray-40); --wb-high-contrast-color-input-border-disabled: var(--wb-color-high-contrast-gray-70); --wb-high-contrast-color-input-border-active: var(--wb-color-high-contrast-primary-50); --wb-high-contrast-color-input-border-error: var(--wb-color-high-contrast-danger-50); --wb-high-contrast-color-input-surface: var(--wb-color-high-contrast-gray-90); --wb-high-contrast-color-input-surface-disabled: var(--wb-color-high-contrast-gray-95); --wb-high-contrast-color-graphic-blue-subtler: var(--wb-color-high-contrast-graphic-10); --wb-high-contrast-color-graphic-blue-subtle: var(--wb-color-high-contrast-graphic-30); --wb-high-contrast-color-graphic-blue: var(--wb-color-high-contrast-graphic-50); --wb-high-contrast-color-graphic-blue-dark: var(--wb-color-high-contrast-graphic-70); --wb-high-contrast-color-graphic-blue-darker: var(--wb-color-high-contrast-graphic-90); --wb-high-contrast-color-graphic-red-subtler: var(--wb-color-high-contrast-point-5); --wb-high-contrast-color-graphic-red-subtle: var(--wb-color-high-contrast-point-10); --wb-high-contrast-color-graphic-red: var(--wb-color-high-contrast-point-20); --wb-high-contrast-color-graphic-red-dark: var(--wb-color-high-contrast-point-40); --wb-high-contrast-color-graphic-red-darker: var(--wb-color-high-contrast-point-70); --wb-high-contrast-color-graphic-brand: var(--wb-color-high-contrast-primary-50); --wb-high-contrast-color-alpha-base100: var(--wb-color-high-contrast-alpha-black100); --wb-high-contrast-color-alpha-base50: var(--wb-color-high-contrast-alpha-black50); --wb-high-contrast-color-alpha-base25: var(--wb-color-high-contrast-alpha-black25); --wb-high-contrast-color-alpha-base0: var(--wb-color-light-alpha-black0); --wb-high-contrast-color-alpha-inverse100: var(--wb-color-high-contrast-alpha-white100); --wb-high-contrast-color-alpha-inverse50: var(--wb-color-high-contrast-alpha-white50); --wb-high-contrast-color-alpha-inverse25: var(--wb-color-high-contrast-alpha-white25); --wb-high-contrast-color-alpha-inverse0: var(--wb-color-high-contrast-alpha-white0); --wb-high-contrast-color-alpha-base75: var(--wb-color-high-contrast-alpha-black75); --wb-high-contrast-color-alpha-inverse75: var(--wb-color-high-contrast-alpha-white75); --wb-high-contrast-color-alpha-inverse10: var(--wb-color-high-contrast-alpha-black25); --wb-high-contrast-color-alpha-base10: var(--wb-color-high-contrast-alpha-black10); --wb-high-contrast-color-alpha-shadow1: #0000001f; --wb-high-contrast-color-alpha-shadow2: #00000033; --wb-high-contrast-color-alpha-shadow3: #00000066; --wb-high-contrast-border-width-variable-regular: 0.2rem; --wb-high-contrast-border-width-variable-medium: 0.3rem; --wb-high-contrast-border-width-static-regular: 0.1rem; --wb-high-contrast-border-width-static-medium: 0.2rem; /* RESPONSIVE-PC */ --wb-pc-font-size-display-large: 6rem; --wb-pc-font-size-display-medium: 4.4rem; --wb-pc-font-size-display-small: 3.6rem; --wb-pc-font-size-body-large: 1.9rem; --wb-pc-font-size-body-medium: 1.7rem; --wb-pc-font-size-body-small: 1.5rem; --wb-pc-font-size-body-xsmall: 1.3rem; --wb-pc-font-size-label-large: 1.9rem; --wb-pc-font-size-label-medium: 1.7rem; --wb-pc-font-size-label-small: 1.5rem; --wb-pc-font-size-label-xsmall: 1.3rem; --wb-pc-font-size-heading-large: 3.2rem; --wb-pc-font-size-heading-medium: 2.4rem; --wb-pc-font-size-heading-small: 1.9rem; --wb-pc-font-size-heading-xsmall: 1.7rem; --wb-pc-font-size-heading-xxsmall: 1.5rem; --wb-pc-font-size-heading-xlarge: 4rem; --wb-pc-font-size-navigation-title-medium: 2.4rem; --wb-pc-font-size-navigation-title-small: 1.9rem; --wb-pc-font-size-navigation-depth-medium-bold: 1.7rem; --wb-pc-font-size-navigation-depth-medium: 1.7rem; --wb-pc-font-size-navigation-depth-small-bold: 1.5rem; --wb-pc-font-size-navigation-depth-small: 1.5rem; --wb-pc-gap-layout-header-breadcrumb: var(--wb-number-10); --wb-pc-gap-layout-left-contents: var(--wb-number-18); --wb-pc-gap-layout-contents-right: var(--wb-number-14); --wb-pc-gap-layout-h1-h2: var(--wb-number-16); --wb-pc-gap-layout-h2-h2: var(--wb-number-20); --wb-pc-gap-layout-h2-h3: var(--wb-number-14); --wb-pc-gap-layout-h3-h3: var(--wb-number-18); --wb-pc-gap-layout-h3-h4: var(--wb-number-10); --wb-pc-gap-layout-h4-h4: var(--wb-number-14); --wb-pc-gap-layout-h4-h5: var(--wb-number-8); --wb-pc-gap-layout-h5-h5: var(--wb-number-12); --wb-pc-gap-layout-title-body-small: var(--wb-number-8); --wb-pc-gap-layout-title-body-medium: var(--wb-number-9); --wb-pc-gap-layout-title-body-large: var(--wb-number-10); --wb-pc-gap-layout-breadcrumb-h1: var(--wb-number-14); --wb-pc-gap-layout-contents-footer: var(--wb-number-18); --wb-pc-gap-layout-text-text-large: var(--wb-number-9); --wb-pc-gap-layout-text-text-medium: var(--wb-number-8); --wb-pc-gap-layout-text-text-small: var(--wb-number-7); --wb-pc-gap-layout-image-text-small: var(--wb-number-9); --wb-pc-gap-layout-image-text-medium: var(--wb-number-10); --wb-pc-gap-layout-image-text-large: var(--wb-number-12); --wb-pc-padding-card-large: var(--wb-number-14); --wb-pc-padding-card-medium: var(--wb-number-12); --wb-pc-padding-card-small: var(--wb-number-10); --wb-pc-padding-card-xsmall: var(--wb-number-8); /* RESPONSIVE-MOBILE */ --wb-mobile-font-size-display-large: 4.4rem; --wb-mobile-font-size-display-medium: 3.2rem; --wb-mobile-font-size-display-small: 2.8rem; --wb-mobile-font-size-body-large: 1.9rem; --wb-mobile-font-size-body-medium: 1.7rem; --wb-mobile-font-size-body-small: 1.5rem; --wb-mobile-font-size-body-xsmall: 1.3rem; --wb-mobile-font-size-label-large: 1.9rem; --wb-mobile-font-size-label-medium: 1.7rem; --wb-mobile-font-size-label-small: 1.5rem; --wb-mobile-font-size-label-xsmall: 1.3rem; --wb-mobile-font-size-heading-large: 2.4rem; --wb-mobile-font-size-heading-medium: 2.2rem; --wb-mobile-font-size-heading-small: 1.9rem; --wb-mobile-font-size-heading-xsmall: 1.7rem; --wb-mobile-font-size-heading-xxsmall: 1.5rem; --wb-mobile-font-size-heading-xlarge: 2.8rem; --wb-mobile-font-size-navigation-title-medium: 2.2rem; --wb-mobile-font-size-navigation-title-small: 1.9rem; --wb-mobile-font-size-navigation-depth-medium-bold: 1.7rem; --wb-mobile-font-size-navigation-depth-medium: 1.7rem; --wb-mobile-font-size-navigation-depth-small-bold: 1.5rem; --wb-mobile-font-size-navigation-depth-small: 1.5rem; --wb-mobile-gap-layout-header-breadcrumb: var(--wb-number-8); --wb-mobile-gap-layout-left-contents: 0rem; --wb-mobile-gap-layout-contents-right: 0rem; --wb-mobile-gap-layout-h1-h2: var(--wb-number-12); --wb-mobile-gap-layout-h2-h2: var(--wb-number-14); --wb-mobile-gap-layout-h2-h3: var(--wb-number-10); --wb-mobile-gap-layout-h3-h3: var(--wb-number-12); --wb-mobile-gap-layout-h3-h4: var(--wb-number-8); --wb-mobile-gap-layout-h4-h4: var(--wb-number-10); --wb-mobile-gap-layout-h4-h5: var(--wb-number-7); --wb-mobile-gap-layout-h5-h5: var(--wb-number-8); --wb-mobile-gap-layout-title-body-small: var(--wb-number-5); --wb-mobile-gap-layout-title-body-medium: var(--wb-number-7); --wb-mobile-gap-layout-title-body-large: var(--wb-number-9); --wb-mobile-gap-layout-breadcrumb-h1: var(--wb-number-12); --wb-mobile-gap-layout-contents-footer: var(--wb-number-14); --wb-mobile-gap-layout-text-text-large: var(--wb-number-8); --wb-mobile-gap-layout-text-text-medium: var(--wb-number-7); --wb-mobile-gap-layout-text-text-small: var(--wb-number-6); --wb-mobile-gap-layout-image-text-small: var(--wb-number-8); --wb-mobile-gap-layout-image-text-medium: var(--wb-number-9); --wb-mobile-gap-layout-image-text-large: var(--wb-number-10); --wb-mobile-padding-card-large: var(--wb-number-10); --wb-mobile-padding-card-medium: var(--wb-number-10); --wb-mobile-padding-card-small: var(--wb-number-9); --wb-mobile-padding-card-xsmall: var(--wb-number-7); /* SEMANTIC */ --wb-gap-1: var(--wb-number-2); --wb-gap-2: var(--wb-number-3); --wb-gap-3: var(--wb-number-5); --wb-gap-4: var(--wb-number-7); --wb-gap-5: var(--wb-number-8); --wb-gap-6: var(--wb-number-9); --wb-gap-7: var(--wb-number-10); --wb-gap-8: var(--wb-number-12); --wb-gap-9: var(--wb-number-14); --wb-gap-10: var(--wb-number-16); --wb-gap-11: var(--wb-number-18); --wb-gap-12: var(--wb-number-20); --wb-padding-1: var(--wb-number-2); --wb-padding-2: var(--wb-number-3); --wb-padding-3: var(--wb-number-5); --wb-padding-4: var(--wb-number-6); --wb-padding-5: var(--wb-number-7); --wb-padding-6: var(--wb-number-8); --wb-padding-7: var(--wb-number-9); --wb-padding-8: var(--wb-number-10); --wb-padding-9: var(--wb-number-12); --wb-padding-10: var(--wb-number-14); --wb-size-height-1: var(--wb-number-5); --wb-size-height-2: var(--wb-number-8); --wb-size-height-3: var(--wb-number-9); --wb-size-height-4: var(--wb-number-10); --wb-size-height-5: var(--wb-number-12); --wb-size-height-6: var(--wb-number-14); --wb-size-height-7: var(--wb-number-16); --wb-size-height-8: var(--wb-number-17); --wb-size-height-9: var(--wb-number-18); --wb-size-height-10: var(--wb-number-19); --wb-size-height-11: var(--wb-number-20); --wb-radius-xsmall1: var(--wb-number-2); --wb-radius-xsmall2: var(--wb-number-2); --wb-radius-xsmall3: var(--wb-number-2); --wb-radius-small1: var(--wb-number-3); --wb-radius-small2: var(--wb-number-3); --wb-radius-small3: var(--wb-number-3); --wb-radius-medium1: var(--wb-number-4); --wb-radius-medium2: var(--wb-number-4); --wb-radius-medium3: var(--wb-number-5); --wb-radius-medium4: var(--wb-number-5); --wb-radius-large1: var(--wb-number-6); --wb-radius-large2: var(--wb-number-6); --wb-radius-xlarge1: var(--wb-number-7); --wb-radius-xlarge2: var(--wb-number-7); --wb-radius-max: var(--wb-number-max); } .row { --grid-gutter-x: 1rem; --grid-gutter-y: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-left: calc(-0.5 * var(--grid-gutter-x)); margin-right: calc(-0.5 * var(--grid-gutter-x)); margin-top: calc(-1 * var(--grid-gutter-y)); } .row > * { -webkit-box-sizing: border-box; box-sizing: border-box; -ms-flex-negative: 0; flex-shrink: 0; width: 100%; max-width: 100%; padding-left: calc(var(--grid-gutter-x) / 2); padding-right: calc(var(--grid-gutter-x) / 2); margin-top: var(--grid-gutter-y); } @media (min-width: 1200px) { .col-1 { -webkit-box-flex: 0; -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; } .col-2 { -webkit-box-flex: 0; -ms-flex: 0 0 16.66667%; flex: 0 0 16.66667%; max-width: 16.66667%; } .col-3 { -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .col-4 { -webkit-box-flex: 0; -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; } .col-5 { -webkit-box-flex: 0; -ms-flex: 0 0 41.66667%; flex: 0 0 41.66667%; max-width: 41.66667%; } .col-6 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .col-7 { -webkit-box-flex: 0; -ms-flex: 0 0 58.33333%; flex: 0 0 58.33333%; max-width: 58.33333%; } .col-8 { -webkit-box-flex: 0; -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } .col-9 { -webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .col-10 { -webkit-box-flex: 0; -ms-flex: 0 0 83.33333%; flex: 0 0 83.33333%; max-width: 83.33333%; } .col-11 { -webkit-box-flex: 0; -ms-flex: 0 0 91.66667%; flex: 0 0 91.66667%; max-width: 91.66667%; } .col-12 { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .g-col-1 { grid-column: span 1; } .g-col-2 { grid-column: span 2; } .g-col-3 { grid-column: span 3; } .g-col-4 { grid-column: span 4; } .g-col-5 { grid-column: span 5; } .g-col-6 { grid-column: span 6; } .g-col-7 { grid-column: span 7; } .g-col-8 { grid-column: span 8; } .g-col-9 { grid-column: span 9; } .g-col-10 { grid-column: span 10; } .g-col-11 { grid-column: span 11; } .g-col-12 { grid-column: span 12; } .g-sm { --grid-gutter-x: 0.5rem; --grid-gutter-y: 0.5rem; } .g-md { --grid-gutter-x: 1rem; --grid-gutter-y: 1rem; } .g-lg { --grid-gutter-x: 2rem; --grid-gutter-y: 2rem; } } .grid { display: -ms-grid; display: grid; -ms-grid-columns: (1fr)[12]; grid-template-columns: repeat(12, 1fr); gap: var(--grid-gutter-x) var(--grid-gutter-y); } .filter { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2rem; width: 100%; } .filter .sec-input { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: center; flex-wrap: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 1.25rem; } .filter .sec-input .input-label { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: center; flex-wrap: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: var(--wb-pc-font-size-body-xsmall); color: var(--wb-color-light-gray-70); font-weight: var(--wb-typo-font-weight-bold); text-align: left; } .filter .sec-input .input-label.w-lg { -webkit-box-flex: 100px; -ms-flex: 100px 0 0px; flex: 100px 0 0; } .filter .sec-input .input-label.w-m { -webkit-box-flex: 70px; -ms-flex: 70px 0 0px; flex: 70px 0 0; } .filter .sec-input .input-label.w-auto { -webkit-box-flex: 0; -ms-flex: 0; flex: 0; } .filter .sec-input .input-group { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: .75rem; height: 100%; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .filter .sec-input .input-group .input { width: 100%; height: 100%; } .filter .sec-input .input-group .input input { font-size: var(--wb-pc-font-size-body-small); height: 100%; } .filter .sec-input .input-group .input span { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: center; flex-wrap: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 100%; font-size: var(--wb-pc-font-size-body-small); color: var(--wb-color-light-gray-70); border-right: none; border-left: none; } .filter .btn-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; gap: 0.5rem; height: 100%; } .filter .btn-wrap button { -ms-flex-negative: 0; flex-shrink: 0; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .k-list-md .k-list-item, .k-list-md .k-list-optionlabel { font-size: var(--wb-pc-font-size-body-small); } table th, table td { font-size: 1.25rem !important; } :root { --wb-font-family-base: var(--wb-typo-font-type); --wb-font-size-base: 62.5%; --wb-line-height-none: 1; --wb-line-height-base: 1.5; --wb-letter-spacing-none: var(--wb-typo-letter-spacing-0); --wb-letter-spacing-wide: var(--wb-typo-letter-spacing-1); --wb-font-weight-regular: 400; --wb-font-weight-bold: 700; --wb-transition-base: 0.4s ease-in-out; --wb-transition-fade: opacity 0.4s linear; --wb-transition-collapse: max-height 0.4s ease; --wb-transition-collapse-width: width 0.4s ease; --wb-contents-size: 1200px; --wb-contents-padding-x: 28px; --wb-contents-wrap-size: 1256px; --wb-box-shadow-outline: 0 0 0 0.4rem var(--wb-light-color-border-primary); --wb-box-shadow-outline-inset: inset 0 0 0 0.2rem var(--wb-light-color-border-primary); --wb-zoom-small: 0.9; --wb-zoom-medium: 1; --wb-zoom-large: 1.1; --wb-zoom-xlarge: 1.3; --wb-zoom-xxlarge: 1.5; --wb-font-underline-offset: 0.3rem; --wb-icon--size-xsmall: var(--wb-size-height-2); --wb-icon--size-small: var(--wb-size-height-2); --wb-icon--size-medium: var(--wb-size-height-3); --wb-icon--size-large: var(--wb-size-height-4); --wb-icon--size-xlarge: var(--wb-size-height-4); } [data-wb-mode="high-contrast"] :root { --wb-box-shadow-outline: 0 0 0 0.4rem var(--wb-high-contrast-color-border-primary); --wb-box-shadow-outline-inset: inset 0 0 0 0.2rem var(--wb-high-contrast-color-border-primary); } .svg-icon.ico-angle { -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; -webkit-mask-image: url(../../dist/images/ico-angle.svg); mask-image: url(../../dist/images/ico-angle.svg); -webkit-mask-image: none; mask-image: none; background-image: url(../../dist/images/ico-angle.svg); background-color: transparent !important; background-size: contain; background-position: center; background-repeat: no-repeat; -webkit-mask: none; mask: none; } .svg-icon.ico-angle.disabled { -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; -webkit-mask-image: url(../../dist/images/ico_angle_disabled.svg); mask-image: url(../../dist/images/ico_angle_disabled.svg); -webkit-mask-image: none; mask-image: none; background-image: url(../../dist/images/ico_angle_disabled.svg); background-color: transparent !important; background-size: contain; background-position: center; background-repeat: no-repeat; -webkit-mask: none; mask: none; } .svg-icon.ico-angle.up { -webkit-transform: rotate(180deg); transform: rotate(180deg); } .svg-icon.ico-angle.left { -webkit-transform: rotate(90deg); transform: rotate(90deg); } .svg-icon.ico-angle.right { -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } .svg-icon.ico-user { -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; -webkit-mask-image: url(../../dist/images/ico-user.svg); mask-image: url(../../dist/images/ico-user.svg); -webkit-mask-image: none; mask-image: none; background-image: url(../../dist/images/ico-user.svg); background-color: transparent !important; background-size: contain; background-position: center; background-repeat: no-repeat; -webkit-mask: none; mask: none; } .svg-icon.ico-mark { -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; -webkit-mask-image: url(../../dist/images/ico-mark.svg); mask-image: url(../../dist/images/ico-mark.svg); -webkit-mask-image: none; mask-image: none; background-image: url(../../dist/images/ico-mark.svg); background-color: transparent !important; background-size: contain; background-position: center; background-repeat: no-repeat; -webkit-mask: none; mask: none; } .svg-icon.ico-title-be { -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; -webkit-mask-image: url(../../dist/images/ico-title-be.svg); mask-image: url(../../dist/images/ico-title-be.svg); -webkit-mask-image: none; mask-image: none; background-image: url(../../dist/images/ico-title-be.svg); background-color: transparent !important; background-size: contain; background-position: center; background-repeat: no-repeat; -webkit-mask: none; mask: none; } .svg-icon.ico-menu01 { -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; -webkit-mask-image: url(../../dist/images/ico-menu01.svg); mask-image: url(../../dist/images/ico-menu01.svg); -webkit-mask-image: none; mask-image: none; background-image: url(../../dist/images/ico-menu01.svg); background-color: transparent !important; background-size: contain; background-position: center; background-repeat: no-repeat; -webkit-mask: none; mask: none; } .svg-icon.ico-menu02 { -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; -webkit-mask-image: url(../../dist/images/ico-menu02.svg); mask-image: url(../../dist/images/ico-menu02.svg); -webkit-mask-image: none; mask-image: none; background-image: url(../../dist/images/ico-menu02.svg); background-color: transparent !important; background-size: contain; background-position: center; background-repeat: no-repeat; -webkit-mask: none; mask: none; } .svg-icon.ico-menu03 { -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; -webkit-mask-image: url(../../dist/images/ico-menu03.svg); mask-image: url(../../dist/images/ico-menu03.svg); -webkit-mask-image: none; mask-image: none; background-image: url(../../dist/images/ico-menu03.svg); background-color: transparent !important; background-size: contain; background-position: center; background-repeat: no-repeat; -webkit-mask: none; mask: none; } .svg-icon.ico-menu04 { -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; -webkit-mask-image: url(../../dist/images/ico-menu04.svg); mask-image: url(../../dist/images/ico-menu04.svg); -webkit-mask-image: none; mask-image: none; background-image: url(../../dist/images/ico-menu04.svg); background-color: transparent !important; background-size: contain; background-position: center; background-repeat: no-repeat; -webkit-mask: none; mask: none; } .svg-icon.ico-menu05 { -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; -webkit-mask-image: url(../../dist/images/ico-menu05.svg); mask-image: url(../../dist/images/ico-menu05.svg); -webkit-mask-image: none; mask-image: none; background-image: url(../../dist/images/ico-menu05.svg); background-color: transparent !important; background-size: contain; background-position: center; background-repeat: no-repeat; -webkit-mask: none; mask: none; } .svg-icon.ico-menu06 { -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; -webkit-mask-image: url(../../dist/images/ico-menu06.svg); mask-image: url(../../dist/images/ico-menu06.svg); -webkit-mask-image: none; mask-image: none; background-image: url(../../dist/images/ico-menu06.svg); background-color: transparent !important; background-size: contain; background-position: center; background-repeat: no-repeat; -webkit-mask: none; mask: none; } .svg-icon.ico-menu07 { -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; -webkit-mask-image: url(../../dist/images/ico-menu07.svg); mask-image: url(../../dist/images/ico-menu07.svg); -webkit-mask-image: none; mask-image: none; background-image: url(../../dist/images/ico-menu07.svg); background-color: transparent !important; background-size: contain; background-position: center; background-repeat: no-repeat; -webkit-mask: none; mask: none; } /* wb-drop-wrap */ .wb-drop-wrap { --wb-dropdown--menu-radius: var(--wb-radius-medium4); --wb-dropdown--menu-padding: var(--wb-padding-3); --wb-dropdown--menu-margin-top: var(--wb-padding-6); --wb-dropdown--menu-gap: var(--wb-gap-3); --wb-dropdown--list-item-radius: var(--wb-radius-medium2); --wb-dropdown--list-item-height: var(--wb-size-height-7); --wb-dropdown--list-item-pc-font-size: var(--wb-pc-font-size-navigation-depth-medium); --wb-dropdown--list-item-mobile-font-size: var(--wb-mobile-font-size-navigation-depth-medium); --wb-dropdown--menu-color-border: var(--wb-light-color-border-gray-light); --wb-dropdown--menu-color-surface: var(--wb-light-color-surface-white-subtler); --wb-dropdown--menu-color-alpha-shadow: 0 0 0.2rem 0 var(--wb-light-color-alpha-shadow1), 0 0.4rem 0.8rem 0 var(--wb-light-color-alpha-shadow2); --wb-dropdown--list-item-color-action-hover: var(--wb-light-color-action-secondary-hover); --wb-dropdown--list-item-color-action-pressed: var(--wb-light-color-action-secondary-pressed); --wb-dropdown--list-item-color-action-selected: var(--wb-light-color-action-secondary-selected); --wb-dropdown--list-item-color-text-selected: var(--wb-light-color-text-secondary); display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; position: relative; } .wb-drop-wrap .drop-menu { position: absolute; top: 100%; left: 50%; display: none; z-index: 6; min-width: 13rem; border-radius: var(--wb-dropdown--menu-radius); padding: var(--wb-dropdown--menu-padding); margin-top: var(--wb-dropdown--menu-margin-top); background-color: var(--wb-dropdown--menu-color-surface); border: 0.1rem solid var(--wb-dropdown--menu-color-border); -webkit-box-shadow: var(--wb-dropdown--menu-color-alpha-shadow); box-shadow: var(--wb-dropdown--menu-color-alpha-shadow); -webkit-transform: translateX(-50%); transform: translateX(-50%); } .wb-drop-wrap .drop-menu::before { content: ""; width: 1.2rem; height: 1.2rem; position: absolute; bottom: 100%; left: 50%; display: block; margin-bottom: -0.5rem; margin-left: -0.6rem; -webkit-transform: rotate(-135deg); transform: rotate(-135deg); background-color: var(--wb-dropdown--menu-color-surface); border: 0.1rem solid var(--wb-dropdown--menu-color-border); border-top-color: transparent; border-left-color: transparent; } .wb-drop-wrap .drop-menu .drop-in { gap: var(--wb-dropdown--menu-gap); position: relative; z-index: 1; } .wb-drop-wrap .drop-menu .drop-top { width: 100%; padding: var(--wb-padding-3) var(--wb-padding-6); border-bottom: 0.1rem solid var(--wb-dropdown--menu-color-border); } .wb-drop-wrap .drop-menu .drop-bottom { width: 100%; padding: var(--wb-padding-3) 0; border-top: 0.1rem solid var(--wb-dropdown--menu-color-border); } .wb-drop-wrap .drop-menu .drop-list { width: 100%; } .wb-drop-wrap .drop-menu .drop-list .item-link { width: 100%; gap: var(--wb-gap-3); padding: 0 var(--wb-padding-6); font-size: var(--wb-dropdown--list-item-pc-font-size); border-radius: var(--wb-dropdown--list-item-radius); height: var(--wb-dropdown--list-item-height); background-color: var(--wb-dropdown--menu-color-surface); } .wb-drop-wrap .drop-menu .drop-list .item-link .ico-go { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; width: var(--wb-icon--size-medium); height: var(--wb-icon--size-medium); background-color: var(--wb-light-color-text-basic); forced-color-adjust: none; } .wb-drop-wrap .drop-menu .drop-list .item-link:hover { background-color: var(--wb-dropdown--list-item-color-action-hover); } .wb-drop-wrap .drop-menu .drop-list .item-link:active { background-color: var(--wb-dropdown--list-item-color-action-pressed); } .wb-drop-wrap .drop-menu .drop-list .item-link.active { font-weight: var(--wb-font-weight-bold); color: var(--wb-dropdown--list-item-color-text-selected); background-color: var(--wb-dropdown--list-item-color-action-selected); } .wb-drop-wrap.drop-left .drop-menu { left: 0; right: unset; -webkit-transform: none; transform: none; } .wb-drop-wrap.drop-left .drop-menu::before { left: 2.4rem; margin-left: 0; } .wb-drop-wrap.drop-right .drop-menu { left: unset; right: 0; -webkit-transform: none; transform: none; } .wb-drop-wrap.drop-right .drop-menu::before { left: unset; right: 2.4rem; } [data-wb-mode="high-contrast"] { /* wb-drop-wrap */ } [data-wb-mode="high-contrast"] .wb-drop-wrap { --wb-dropdown--menu-color-border: var(--wb-high-contrast-color-border-gray-light); --wb-dropdown--menu-color-surface: var(--wb-high-contrast-color-surface-white-subtler); --wb-dropdown--menu-color-alpha-shadow: 0 0 0.2rem 0 var(--wb-high-contrast-color-alpha-shadow1), 0 0.4rem 0.8rem 0 var(--wb-high-contrast-color-alpha-shadow2); --wb-dropdown--list-item-color-action-hover: var(--wb-high-contrast-color-action-secondary-hover); --wb-dropdown--list-item-color-action-pressed: var(--wb-high-contrast-color-action-secondary-pressed); --wb-dropdown--list-item-color-action-selected: var(--wb-high-contrast-color-action-secondary-selected); --wb-dropdown--list-item-color-text-selected: var(--wb-high-contrast-color-text-secondary); } [data-wb-mode="high-contrast"] .wb-drop-wrap .drop-list .item-link .ico-go { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; width: var(--wb-icon--size-medium); height: var(--wb-icon--size-medium); background-color: var(--wb-high-contrast-color-text-basic); forced-color-adjust: none; } .menu { height: 100%; background-color: #052b57; } .menu .menu-container { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -ms-flex-item-align: stretch; align-self: stretch; background-image: none; -webkit-column-gap: 10px; column-gap: 10px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-image: none; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding-bottom: 32px; padding-top: 32px; row-gap: 24px; } .group { left: 15.58px; position: absolute; top: 15.58px; } .menu-item-container { position: relative; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; border-top-left-radius: 8px; border-top-right-radius: 8px; -webkit-box-sizing: border-box; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding-bottom: 12px; padding-left: 4px; padding-right: 4px; padding-top: 12px; row-gap: 0px; } .menu-item-container.active .menu-sub { display: block; opacity: 1; } .menu-item-container:hover { background-color: rgba(255, 255, 255, 0.1); } .menu-item-container:focus { background-color: rgba(255, 255, 255, 0.25); } .menu-item-container .menu-sub { position: absolute; top: 0; right: -234px; background: #fff; -webkit-box-shadow: 0px 8px 16px 0 rgba(0, 0, 0, 0.12), 0px 0px 2px 0 rgba(0, 0, 0, 0.08); box-shadow: 0px 8px 16px 0 rgba(0, 0, 0, 0.12), 0px 0px 2px 0 rgba(0, 0, 0, 0.08); border-radius: 0 4px 4px 0; padding: 24px; z-index: 9; width: 21.875rem; display: none; -webkit-transition: max-height 0.3s ease, opacity 0.3s ease; transition: max-height 0.3s ease, opacity 0.3s ease; opacity: 0; } .menu-item-container .menu-sub .container { display: -ms-grid; display: grid; -ms-grid-columns: (minmax(45%, auto))[auto-fill]; grid-template-columns: repeat(auto-fill, minmax(45%, auto)); gap: 12px; } .menu-item-container .menu-sub .container li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 8px; -webkit-box-flex: 1; -ms-flex: 1 1 50%; flex: 1 1 50%; } .menu-item-container .menu-sub .container li .element-2-depth { border: 1px solid #86aff9; border-radius: 4px; text-align: center; padding: 4px; font-weight: 600; } .menu-item-container .menu-sub .container li ul li a { text-align: center; } .menu-item-container .menu-sub .container li ul li a:hover { color: #0b50d0; } .menu-item-container .menu-sub .container li ul li a:focus { color: #052561; } .menu-item-container .menu-sub .container li ul li ~ li { margin-top: 8px; } .wrap .element-1-depth { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; row-gap: 8px; } .wrap .menu-item-text { color: #b1b8be; font-size: 15px; font-weight: 700; line-height: 150%; text-align: center; } /* reset */ html, body { position: relative; width: 100%; height: 100%; font-family: var(--wb-font-family-base); color: var(--wb-light-color-text-basic); font-weight: var(--wb-font-weight-regular); line-height: var(--wb-line-height-base); word-break: keep-all; word-wrap: break-word; -webkit-tap-highlight-color: transparent; scroll-behavior: smooth; } html { font-size: var(--wb-font-size-base); } body { background-color: var(--wb-light-color-background-white); font-size: var(--wb-pc-font-size-body-xsmall); overflow-x: hidden; } [data-wb-mode="high-contrast"] html, [data-wb-mode="high-contrast"] body { color: var(--wb-high-contrast-color-text-basic); } [data-wb-mode="high-contrast"] body { background-color: var(--wb-high-contrast-color-background-white); } *:focus { outline: 0.2rem solid var(--wb-light-color-border-inverse); outline-offset: 0; -webkit-box-shadow: var(--wb-box-shadow-outline); box-shadow: var(--wb-box-shadow-outline); -webkit-transition: outline 0s, -webkit-box-shadow 0s !important; transition: outline 0s, -webkit-box-shadow 0s !important; transition: outline 0s, box-shadow 0s !important; transition: outline 0s, box-shadow 0s, -webkit-box-shadow 0s !important; } ::-moz-selection { background: var(--wb-color-light-secondary-50); color: var(--wb-color-light-gray-0); } ::selection { background: var(--wb-color-light-secondary-50); color: var(--wb-color-light-gray-0); } body, div, p, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, table, th, td, form, fieldset, legend, input, textarea, a, button, select, ul, li, span, em, label, :before, :after { margin: 0; padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-text-size-adjust: none; font-family: inherit; line-height: var(--wb-line-height-base); letter-spacing: inherit; } pre { font-family: inherit; } input, textarea, a, button, select, span, label, :before, :after { font-size: inherit; font-weight: inherit; } h1, h2, h3, h4, h5, h6, strong { font-weight: var(--wb-font-weight-bold); } article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section { display: block; margin: 0; padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box; } img, fieldset { border: 0; } fieldset { min-width: 100%; } img { max-width: 100%; vertical-align: top; } ul, ol { list-style: none; } em, address, i { font-style: normal; } a, button { -webkit-transition: var(--wb-transition-base); transition: var(--wb-transition-base); } a, a:hover, a:active, a:focus { color: inherit; text-decoration: none; } button, input[type="submit"], input[type="button"] { overflow: visible; margin: 0; background-color: transparent; border: none; -webkit-appearance: button; cursor: pointer; font: inherit; color: inherit; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } textarea { resize: none; } label { cursor: pointer; } select { appearance: none; -webkit-appearance: none; -moz-appearance: none; } input[type="text"], input[type="tel"], input[type="password"], input[type="file"], input[type="number"], input[type="email"], input[type="date"], input[type="search"], textarea { -webkit-box-shadow: none; box-shadow: none; appearance: none; -webkit-appearance: none; -moz-appearance: none; -webkit-tap-highlight-color: transparent; } input[type="number"] { -moz-appearance: textfield; margin: 0; } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } input[type='text']::-ms-clear { display: none; } caption { position: static !important; margin: 0 !important; } table { table-layout: fixed; max-width: none; width: auto; min-width: 100%; border-collapse: collapse; } [role="button"] { cursor: pointer; } .img img { min-width: 100%; max-width: 100%; } .img.bg-img { background-size: cover; } .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; } .al { text-align: left !important; } .ac { text-align: center !important; } .ar { text-align: right !important; } .underline { text-decoration: underline; text-underline-offset: var(--wb-font-underline-offset); } .break-all { word-break: break-all; } .svg-icon { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; width: var(--wb-icon--size-large); height: var(--wb-icon--size-large); background-color: var(--wb-light-color-text-basic); forced-color-adjust: none; } .svg-icon.pure { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; width: var(--wb-icon--size-large); height: var(--wb-icon--size-large); background-color: var(--wb-light-color-text-basic); background-color: transparent !important; forced-color-adjust: none; } .inner { max-width: var(--wb-contents-wrap-size); padding-left: var(--wb-contents-padding-x); padding-right: var(--wb-contents-padding-x); } @media (max-width: 767px) { body { font-size: var(--wb-mobile-font-size-body-medium); } .pc-only { display: none !important; } .pc-only.read { 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; } .mob-line { display: block; line-height: inherit; } } /*# sourceMappingURL=common.css.map */