/* Project_01_color_base */
:root {
  --color-base-base-0: #ffffff;
  --color-base-base-000000: #000000;
  --color-base-base-error: var(--color-base-primary-400);
  --color-base-neutral-10: #f5f5f5;
  --color-base-neutral-100: #afb3bf;
  --color-base-neutral-20: #e6e7ea;
  --color-base-neutral-200: #8e93a2;
  --color-base-neutral-25: #e1e2e7;
  --color-base-neutral-30: #dcdee4;
  --color-base-neutral-300: #6d7384;
  --color-base-neutral-40: #d2d6de;
  --color-base-neutral-400: #4f566a;
  --color-base-neutral-50: #c6cad3;
  --color-base-neutral-500: #444a5a;
  --color-base-neutral-600: #383d4a;
  --color-base-neutral-70: #bec1cb;
  --color-base-neutral-700: #2d3039;
  --color-base-neutral-800: #212329;
  --color-base-neutral-900: #151618;
  --color-base-primary-10: #ffecec;
  --color-base-primary-100: #ff8484;
  --color-base-primary-20: #ffdada;
  --color-base-primary-200: #ff5656;
  --color-base-primary-25: #ffd1d1;
  --color-base-primary-30: #ffc8c8;
  --color-base-primary-300: #ff2c2c;
  --color-base-primary-40: #ffb6b6;
  --color-base-primary-400: #fe0000;
  --color-base-primary-50: #ffa4a4;
  --color-base-primary-500: #d30303;
  --color-base-primary-600: #aa0505;
  --color-base-primary-70: #ff9a9a;
  --color-base-primary-700: #7f0707;
  --color-base-primary-800: #570909;
  --color-base-primary-900: #2b0b0b;
}

/* Project_02_color_styles */
.light,
.color-theme-light {
  --color-badge-bg-content-primary: var(--color-base-neutral-500);
  --color-badge-bg-neutral-lg: var(--color-base-neutral-50);
  --color-badge-bg-neutral-md: var(--color-base-neutral-40);
  --color-badge-bg-neutral-sm: var(--color-base-neutral-25);
  --color-badge-bg-neutral-xl: var(--color-base-neutral-70);
  --color-badge-bg-neutral-xs: var(--color-base-neutral-10);
  --color-bg-neutral-lg: var(--color-base-neutral-100);
  --color-bg-neutral-md: var(--color-base-neutral-50);
  --color-bg-neutral-sm: var(--color-base-neutral-25);
  --color-bg-neutral-xs: var(--color-base-neutral-10);
  --color-border-neutral-lg: var(--color-base-neutral-50);
  --color-border-neutral-md: var(--color-base-neutral-40);
  --color-border-neutral-sm: var(--color-base-neutral-30);
  --color-border-neutral-xl: var(--color-base-neutral-70);
  --color-border-neutral-xs: var(--color-base-neutral-25);
  --color-button-filled-neutral-md-focus: var(--color-base-neutral-100);
  --color-button-filled-neutral-md-bg-active: var(--color-base-neutral-100);
  --color-button-filled-neutral-md-bg-default: var(--color-base-neutral-50);
  --color-button-filled-neutral-md-bg-disabled: var(--color-base-neutral-25);
  --color-button-filled-neutral-md-bg-focus: var(--color-base-neutral-50);
  --color-button-filled-neutral-md-bg-hover: var(--color-base-neutral-70);
  --color-button-filled-neutral-md-content-active: var(--color-base-neutral-700);
  --color-button-filled-neutral-md-content-default: var(--color-base-neutral-500);
  --color-button-filled-neutral-md-content-disabled: var(--color-base-neutral-100);
  --color-button-filled-neutral-md-content-focus: var(--color-base-neutral-500);
  --color-button-filled-neutral-md-content-hover: var(--color-base-neutral-600);
  --color-button-filled-neutral-sm-focus: var(--color-base-neutral-100);
  --color-button-filled-neutral-sm-bg-active: var(--color-base-neutral-70);
  --color-button-filled-neutral-sm-bg-default: var(--color-base-neutral-30);
  --color-button-filled-neutral-sm-bg-disabled: var(--color-base-neutral-20);
  --color-button-filled-neutral-sm-bg-focus: var(--color-base-neutral-30);
  --color-button-filled-neutral-sm-bg-hover: var(--color-base-neutral-50);
  --color-button-filled-neutral-sm-bg-light-active: var(--color-base-neutral-30);
  --color-button-filled-neutral-sm-bg-light-default: var(--color-base-base-0);
  --color-button-filled-neutral-sm-bg-light-disabled: var(--color-base-neutral-20);
  --color-button-filled-neutral-sm-bg-light-focus: var(--color-base-base-0);
  --color-button-filled-neutral-sm-bg-light-hover: var(--color-base-neutral-20);
  --color-button-filled-neutral-sm-content-active: var(--color-base-neutral-700);
  --color-button-filled-neutral-sm-content-default: var(--color-base-neutral-500);
  --color-button-filled-neutral-sm-content-disabled: var(--color-base-neutral-70);
  --color-button-filled-neutral-sm-content-focus: var(--color-base-neutral-500);
  --color-button-filled-neutral-sm-content-hover: var(--color-base-neutral-600);
  --color-button-filled-neutral-xs-focus: var(--color-base-neutral-100);
  --color-button-filled-neutral-xs-bg-active: var(--color-base-neutral-30);
  --color-button-filled-neutral-xs-bg-default: var(--color-base-neutral-10);
  --color-button-filled-neutral-xs-bg-disabled: var(--color-base-neutral-10);
  --color-button-filled-neutral-xs-bg-focus: var(--color-base-neutral-10);
  --color-button-filled-neutral-xs-bg-hover: var(--color-base-neutral-20);
  --color-button-filled-neutral-xs-content-active: var(--color-base-neutral-700);
  --color-button-filled-neutral-xs-content-default: var(--color-base-neutral-500);
  --color-button-filled-neutral-xs-content-disabled: var(--color-base-neutral-70);
  --color-button-filled-neutral-xs-content-focus: var(--color-base-neutral-500);
  --color-button-filled-neutral-xs-content-hover: var(--color-base-neutral-600);
  --color-button-filled-primary-focus: var(--color-base-primary-30);
  --color-button-filled-primary-bg-active: var(--color-base-primary-700);
  --color-button-filled-primary-bg-default: var(--color-base-primary-500);
  --color-button-filled-primary-bg-disabled: var(--color-base-neutral-20);
  --color-button-filled-primary-bg-focus: var(--color-base-primary-500);
  --color-button-filled-primary-bg-hover: var(--color-base-primary-600);
  --color-button-filled-primary-content-active: var(--color-base-base-0);
  --color-button-filled-primary-content-default: var(--color-base-base-0);
  --color-button-filled-primary-content-disabled: var(--color-base-neutral-70);
  --color-button-filled-primary-content-focus: var(--color-base-base-0);
  --color-button-filled-primary-content-hover: var(--color-base-base-0);
  --color-button-filled-secondary-focus: var(--color-base-primary-30);
  --color-button-filled-secondary-bg-active: var(--color-base-primary-40);
  --color-button-filled-secondary-bg-default: var(--color-base-primary-20);
  --color-button-filled-secondary-bg-disabled: var(--color-base-neutral-20);
  --color-button-filled-secondary-bg-focus: var(--color-base-primary-20);
  --color-button-filled-secondary-bg-hover: var(--color-base-primary-30);
  --color-button-filled-secondary-content-active: var(--color-base-primary-500);
  --color-button-filled-secondary-content-default: var(--color-base-primary-500);
  --color-button-filled-secondary-content-disabled: var(--color-base-neutral-70);
  --color-button-filled-secondary-content-focus: var(--color-base-primary-500);
  --color-button-filled-secondary-content-hover: var(--color-base-primary-500);
  --color-button-text-neutral-lg-focus: var(--color-base-neutral-30);
  --color-button-text-neutral-lg-content-active: var(--color-base-neutral-900);
  --color-button-text-neutral-lg-content-default: var(--color-base-neutral-700);
  --color-button-text-neutral-lg-content-disabled: var(--color-base-neutral-100);
  --color-button-text-neutral-lg-content-focus: var(--color-base-neutral-700);
  --color-button-text-neutral-lg-content-hover: var(--color-base-neutral-800);
  --color-button-text-neutral-md-focus: var(--color-base-neutral-30);
  --color-button-text-neutral-md-content-active: var(--color-base-neutral-500);
  --color-button-text-neutral-md-content-default: var(--color-base-neutral-300);
  --color-button-text-neutral-md-content-disabled: var(--color-base-neutral-100);
  --color-button-text-neutral-md-content-focus: var(--color-base-neutral-300);
  --color-button-text-neutral-md-content-hover: var(--color-base-neutral-400);
  --color-button-text-primary-focus: var(--color-base-primary-30);
  --color-button-text-primary-content-active: var(--color-base-primary-700);
  --color-button-text-primary-content-default: var(--color-base-primary-500);
  --color-button-text-primary-content-disabled: var(--color-base-neutral-100);
  --color-button-text-primary-content-focus: var(--color-base-primary-500);
  --color-button-text-primary-content-hover: var(--color-base-primary-600);
  --color-content-link: var(--color-base-primary-500);
  --color-content-neutral-primary: var(--color-base-neutral-700);
  --color-content-neutral-secondary: var(--color-base-neutral-400);
  --color-content-neutral-tertiary: var(--color-base-neutral-200);
  --color-content-neutral-inversive-primary: var(--color-base-base-0);
  --color-content-neutral-inversive-secondary: var(--color-base-neutral-20);
  --color-content-neutral-inversive-tertiary: var(--color-base-neutral-40);
  --color-content-primary-primary: var(--color-base-primary-500);
  --color-content-primary-secondary: var(--color-base-primary-300);
  --color-content-primary-tertiary: var(--color-base-primary-200);
  --color-textfielf-filled-neutral-focus: var(--color-base-neutral-50);
  --color-textfielf-filled-neutral-bg-sm-default: var(--color-base-neutral-10);
  --color-textfielf-filled-neutral-bg-sm-disabled: var(--color-base-neutral-10);
  --color-textfielf-filled-neutral-bg-sm-error: var(--color-base-neutral-10);
  --color-textfielf-filled-neutral-bg-sm-hover: var(--color-base-neutral-20);
  --color-textfielf-filled-neutral-bg-xs-default: var(--color-base-base-0);
  --color-textfielf-filled-neutral-bg-xs-disabled: var(--color-base-neutral-10);
  --color-textfielf-filled-neutral-bg-xs-error: var(--color-base-base-0);
  --color-textfielf-filled-neutral-bg-xs-hover: var(--color-base-neutral-25);
  --color-textfielf-filled-neutral-content-default: var(--color-base-neutral-300);
  --color-textfielf-filled-neutral-content-disabled: var(--color-base-neutral-70);
  --color-textfielf-filled-neutral-content-error: var(--color-base-primary-400);
  --color-textfielf-filled-neutral-content-input: var(--color-base-neutral-800);
}

/* Project_02_size */
/* Lg */
@media (min-width: 1180px) {
  :root {
    --size-banner-right-up-height-max-max: 560px;
    --size-button-width-lg: 184px;
    --size-font-2xl-letter-spacing: -1px;
    --size-font-2xl-size: var(--size-base-6x-24);
    --size-font-2xl-line: 31.200000762939453px;
    --size-font-3xl-letter-spacing: -1px;
    --size-font-3xl-size: var(--size-base-7x-28);
    --size-font-3xl-line: 33.599998474121094px;
    --size-font-4xl-letter-spacing: -1px;
    --size-font-4xl-size: var(--size-base-9x-36);
    --size-font-4xl-line: 43.20000076293945px;
    --size-font-5xl-letter-spacing: -1.5px;
    --size-font-5xl-size: var(--size-base-12x-48);
    --size-font-5xl-line: 52.79999923706055px;
    --size-font-6xl-letter-spacing: -1.5px;
    --size-font-6xl-size: var(--size-base-14x-56);
    --size-font-6xl-line: 61.599998474121094px;
    --size-font-xl-letter-spacing: 0px;
    --size-font-xl-size: var(--size-base-5x-20);
    --size-font-xl-line: 26px;
    --size-stories-horizontal-height-max: 252px;
    --size-stories-horizontal-height-min: 252px;
    --size-stories-horizontal-width-min: 580px;
    --size-stories-horizontal-width-max: 642px;
  }
}
/* Md */
@media (min-width: 894px) and (max-width: 1179px) {
  :root {
    --size-banner-right-up-height-max-max: 376px;
    --size-button-width-lg: 184px;
    --size-font-2xl-letter-spacing: -1px;
    --size-font-2xl-size: var(--size-base-6x-24);
    --size-font-2xl-line: 31.200000762939453px;
    --size-font-3xl-letter-spacing: -1px;
    --size-font-3xl-size: var(--size-base-7x-28);
    --size-font-3xl-line: 33.599998474121094px;
    --size-font-4xl-letter-spacing: -1px;
    --size-font-4xl-size: var(--size-base-9x-36);
    --size-font-4xl-line: 43.20000076293945px;
    --size-font-5xl-letter-spacing: -1.5px;
    --size-font-5xl-size: var(--size-base-12x-48);
    --size-font-5xl-line: 52.79999923706055px;
    --size-font-6xl-letter-spacing: -1.5px;
    --size-font-6xl-size: var(--size-base-14x-56);
    --size-font-6xl-line: 61.599998474121094px;
    --size-font-xl-letter-spacing: 0px;
    --size-font-xl-size: var(--size-base-5x-20);
    --size-font-xl-line: 26px;
    --size-stories-horizontal-height-max: 227px;
    --size-stories-horizontal-height-min: 227px;
    --size-stories-horizontal-width-min: 572px;
    --size-stories-horizontal-width-max: 610px;
  }
}
/* Sm */
@media (min-width: 604px) and (max-width: 893px) {
  :root {
    --size-banner-right-up-height-max-max: 490px;
    --size-button-width-lg: 184px;
    --size-font-2xl-letter-spacing: -1px;
    --size-font-2xl-size: var(--size-base-5x-20);
    --size-font-2xl-line: 31.200000762939453px;
    --size-font-3xl-letter-spacing: -1px;
    --size-font-3xl-size: var(--size-base-6x-24);
    --size-font-3xl-line: 33.599998474121094px;
    --size-font-4xl-letter-spacing: -1px;
    --size-font-4xl-size: var(--size-base-8x-32);
    --size-font-4xl-line: 43.20000076293945px;
    --size-font-5xl-letter-spacing: -1.5px;
    --size-font-5xl-size: var(--size-base-11x-44);
    --size-font-5xl-line: 52.79999923706055px;
    --size-font-6xl-letter-spacing: -1.5px;
    --size-font-6xl-size: var(--size-base-13x-52);
    --size-font-6xl-line: 61.599998474121094px;
    --size-font-xl-letter-spacing: 0px;
    --size-font-xl-size: 18px;
    --size-font-xl-line: 26px;
    --size-stories-horizontal-height-max: 240px;
    --size-stories-horizontal-height-min: 240px;
    --size-stories-horizontal-width-min: 572px;
    --size-stories-horizontal-width-max: 610px;
  }
}
/* Xs */
@media (max-width: 603px) {
  :root {
    --size-banner-right-up-height-max-max: 300px;
    --size-button-width-lg: 184px;
    --size-font-2xl-letter-spacing: -1.5px;
    --size-font-2xl-size: var(--size-base-5x-20);
    --size-font-2xl-line: 43.20000076293945px;
    --size-font-3xl-letter-spacing: -1.5px;
    --size-font-3xl-size: var(--size-base-6x-24);
    --size-font-3xl-line: 33.599998474121094px;
    --size-font-4xl-letter-spacing: -1.5px;
    --size-font-4xl-size: var(--size-base-7x-28);
    --size-font-4xl-line: 43.20000076293945px;
    --size-font-5xl-letter-spacing: -1.5px;
    --size-font-5xl-size: var(--size-base-10x-40);
    --size-font-5xl-line: 52.79999923706055px;
    --size-font-6xl-letter-spacing: -1.5px;
    --size-font-6xl-size: var(--size-base-12x-48);
    --size-font-6xl-line: 61.599998474121094px;
    --size-font-xl-letter-spacing: 0px;
    --size-font-xl-size: 18px;
    --size-font-xl-line: 26px;
    --size-stories-horizontal-height-max: 600px;
    --size-stories-horizontal-height-min: 600px;
    --size-stories-horizontal-width-max: 328px;
    --size-stories-horizontal-width-min: 328px;
  }
}/*# sourceMappingURL=vars.css.map */