.colorScheme1 { --color-background-100: #ffffff; --color-background-80: rgba(255,255,255,0.8); --color-background-60: rgba(255,255,255,0.6); --color-background-40: rgba(255,255,255,0.4); --color-background-0: rgba(255,255,255,0); --color-border-100: #000000FF; --color-text-100: #000000FF; --color-text-90: rgba(0,0,0,0.9); --color-text-80: rgba(0,0,0,0.8); --color-text-70: rgba(0,0,0,0.7); --color-text-60: rgba(0,0,0,0.6); --color-text-50: rgba(0,0,0,0.5); --color-text-40: rgba(0,0,0,0.4); --color-text-30: rgba(0,0,0,0.3); --color-text-20: rgba(0,0,0,0.2); --color-text-10: rgba(0,0,0,0.1); --color-text-5: rgba(0,0,0,0.05); --color-text-3: rgba(0,0,0,0.03); --color-accent-100: #000000FF; --color-accent-90: rgba(0,0,0,0.9); --color-accent-80: rgba(0,0,0,0.8); --color-accent-70: rgba(0,0,0,0.7); --color-accent-60: rgba(0,0,0,0.6); --color-accent-50: rgba(0,0,0,0.5); --color-accent-40: rgba(0,0,0,0.4); --color-accent-30: rgba(0,0,0,0.3); --color-accent-20: rgba(0,0,0,0.2); --color-accent-10: rgba(0,0,0,0.1); --color-accent-5: rgba(0,0,0,0.05); } .colorScheme2 { --color-background-100: #F6F6F6; --color-background-80: rgba(246,246,246,0.8); --color-background-60: rgba(246,246,246,0.6); --color-background-40: rgba(246,246,246,0.4); --color-background-0: rgba(246,246,246,0); --color-border-100: #000000FF; --color-text-100: #000000FF; --color-text-90: rgba(0,0,0,0.9); --color-text-80: rgba(0,0,0,0.8); --color-text-70: rgba(0,0,0,0.7); --color-text-60: rgba(0,0,0,0.6); --color-text-50: rgba(0,0,0,0.5); --color-text-40: rgba(0,0,0,0.4); --color-text-30: rgba(0,0,0,0.3); --color-text-20: rgba(0,0,0,0.2); --color-text-10: rgba(0,0,0,0.1); --color-text-5: rgba(0,0,0,0.05); --color-text-3: rgba(0,0,0,0.03); --color-accent-100: #000000FF; --color-accent-90: rgba(0,0,0,0.9); --color-accent-80: rgba(0,0,0,0.8); --color-accent-70: rgba(0,0,0,0.7); --color-accent-60: rgba(0,0,0,0.6); --color-accent-50: rgba(0,0,0,0.5); --color-accent-40: rgba(0,0,0,0.4); --color-accent-30: rgba(0,0,0,0.3); --color-accent-20: rgba(0,0,0,0.2); --color-accent-10: rgba(0,0,0,0.1); --color-accent-5: rgba(0,0,0,0.05); } .colorScheme3 { --color-background-100: #FAFAFFFF; --color-background-80: rgba(250,250,255,0.8); --color-background-60: rgba(250,250,255,0.6); --color-background-40: rgba(250,250,255,0.4); --color-background-0: rgba(250,250,255,0); --color-border-100: #292E2F; --color-text-100: #292E2F; --color-text-90: rgba(41,46,47,0.9); --color-text-80: rgba(41,46,47,0.8); --color-text-70: rgba(41,46,47,0.7); --color-text-60: rgba(41,46,47,0.6); --color-text-50: rgba(41,46,47,0.5); --color-text-40: rgba(41,46,47,0.4); --color-text-30: rgba(41,46,47,0.3); --color-text-20: rgba(41,46,47,0.2); --color-text-10: rgba(41,46,47,0.1); --color-text-5: rgba(41,46,47,0.05); --color-text-3: rgba(41,46,47,0.03); --color-accent-100: #5E51F0FF; --color-accent-90: rgba(94,81,240,0.9); --color-accent-80: rgba(94,81,240,0.8); --color-accent-70: rgba(94,81,240,0.7); --color-accent-60: rgba(94,81,240,0.6); --color-accent-50: rgba(94,81,240,0.5); --color-accent-40: rgba(94,81,240,0.4); --color-accent-30: rgba(94,81,240,0.3); --color-accent-20: rgba(94,81,240,0.2); --color-accent-10: rgba(94,81,240,0.1); --color-accent-5: rgba(94,81,240,0.05); } .colorScheme4 { --color-background-100: #5E51F0FF; --color-background-80: rgba(94,81,240,0.8); --color-background-60: rgba(94,81,240,0.6); --color-background-40: rgba(94,81,240,0.4); --color-background-0: rgba(94,81,240,0); --color-border-100: #FFFFFF; --color-text-100: #FFFFFF; --color-text-90: rgba(255,255,255,0.9); --color-text-80: rgba(255,255,255,0.8); --color-text-70: rgba(255,255,255,0.7); --color-text-60: rgba(255,255,255,0.6); --color-text-50: rgba(255,255,255,0.5); --color-text-40: rgba(255,255,255,0.4); --color-text-30: rgba(255,255,255,0.3); --color-text-20: rgba(255,255,255,0.2); --color-text-10: rgba(255,255,255,0.1); --color-text-5: rgba(255,255,255,0.05); --color-text-3: rgba(255,255,255,0.03); --color-accent-100: #FFFFFF; --color-accent-90: rgba(255,255,255,0.9); --color-accent-80: rgba(255,255,255,0.8); --color-accent-70: rgba(255,255,255,0.7); --color-accent-60: rgba(255,255,255,0.6); --color-accent-50: rgba(255,255,255,0.5); --color-accent-40: rgba(255,255,255,0.4); --color-accent-30: rgba(255,255,255,0.3); --color-accent-20: rgba(255,255,255,0.2); --color-accent-10: rgba(255,255,255,0.1); --color-accent-5: rgba(255,255,255,0.05); } .colorScheme5 { --color-background-100: #000000FF; --color-background-80: rgba(0,0,0,0.8); --color-background-60: rgba(0,0,0,0.6); --color-background-40: rgba(0,0,0,0.4); --color-background-0: rgba(0,0,0,0); --color-border-100: #FFFFFF; --color-text-100: #FFFFFF; --color-text-90: rgba(255,255,255,0.9); --color-text-80: rgba(255,255,255,0.8); --color-text-70: rgba(255,255,255,0.7); --color-text-60: rgba(255,255,255,0.6); --color-text-50: rgba(255,255,255,0.5); --color-text-40: rgba(255,255,255,0.4); --color-text-30: rgba(255,255,255,0.3); --color-text-20: rgba(255,255,255,0.2); --color-text-10: rgba(255,255,255,0.1); --color-text-5: rgba(255,255,255,0.05); --color-text-3: rgba(255,255,255,0.03); --color-accent-100: #5E51F0FF; --color-accent-90: rgba(94,81,240,0.9); --color-accent-80: rgba(94,81,240,0.8); --color-accent-70: rgba(94,81,240,0.7); --color-accent-60: rgba(94,81,240,0.6); --color-accent-50: rgba(94,81,240,0.5); --color-accent-40: rgba(94,81,240,0.4); --color-accent-30: rgba(94,81,240,0.3); --color-accent-20: rgba(94,81,240,0.2); --color-accent-10: rgba(94,81,240,0.1); --color-accent-5: rgba(94,81,240,0.05); } .defaultColorScheme { --color-background-100: #ffffff; --color-background-80: rgba(255,255,255,0.8); --color-background-60: rgba(255,255,255,0.6); --color-background-40: rgba(255,255,255,0.4); --color-background-0: rgba(255,255,255,0); --color-border-100: #000000FF; --color-text-100: #000000FF; --color-text-90: rgba(0,0,0,0.9); --color-text-80: rgba(0,0,0,0.8); --color-text-70: rgba(0,0,0,0.7); --color-text-60: rgba(0,0,0,0.6); --color-text-50: rgba(0,0,0,0.5); --color-text-40: rgba(0,0,0,0.4); --color-text-30: rgba(0,0,0,0.3); --color-text-20: rgba(0,0,0,0.2); --color-text-10: rgba(0,0,0,0.1); --color-text-5: rgba(0,0,0,0.05); --color-text-3: rgba(0,0,0,0.03); --color-accent-100: #000000FF; --color-accent-90: rgba(0,0,0,0.9); --color-accent-80: rgba(0,0,0,0.8); --color-accent-70: rgba(0,0,0,0.7); --color-accent-60: rgba(0,0,0,0.6); --color-accent-50: rgba(0,0,0,0.5); --color-accent-40: rgba(0,0,0,0.4); --color-accent-30: rgba(0,0,0,0.3); --color-accent-20: rgba(0,0,0,0.2); --color-accent-10: rgba(0,0,0,0.1); --color-accent-5: rgba(0,0,0,0.05); }

      :root {
        --color-black-100: #222222;
        --color-black-95: rgba(34,34,34,0.95);
        --color-black-90: rgba(34,34,34,0.9);
        --color-black-85: rgba(34,34,34,0.85);
        --color-black-80: rgba(34,34,34,0.8);
        --color-black-75: rgba(34,34,34,0.65);
        --color-black-70: rgba(34,34,34,0.7);
        --color-black-65: rgba(34,34,34,0.65);
        --color-black-60: rgba(34,34,34,0.6);
        --color-black-55: rgba(34,34,34,0.55);
        --color-black-50: rgba(34,34,34,0.5);
        --color-black-45: rgba(34,34,34,0.45);
        --color-black-40: rgba(34,34,34,0.4);
        --color-black-35: rgba(34,34,34,0.35);
        --color-black-30: rgba(34,34,34,0.3);
        --color-black-25: rgba(34,34,34,0.25);
        --color-black-20: rgba(34,34,34,0.2);
        --color-black-15: rgba(34,34,34,0.15);
        --color-black-10: rgba(34,34,34,0.1);
        --color-black-5: rgba(34,34,34,0.05);
        --color-black-0: rgba(34,34,34,0);

        --color-white-100: #ffffff;
        --color-white-95: rgba(255,255,255,0.95);
        --color-white-90: rgba(255,255,255,0.9);
        --color-white-85: rgba(255,255,255,0.85);
        --color-white-80: rgba(255,255,255,0.8);
        --color-white-75: rgba(255,255,255,0.75);
        --color-white-70: rgba(255,255,255,0.7);
        --color-white-65: rgba(255,255,255,0.65);
        --color-white-60: rgba(255,255,255,0.6);
        --color-white-55: rgba(255,255,255,0.55);
        --color-white-50: rgba(255,255,255,0.5);
        --color-white-45: rgba(255,255,255,0.45);
        --color-white-40: rgba(255,255,255,0.4);
        --color-white-35: rgba(255,255,255,0.35);
        --color-white-30: rgba(255,255,255,0.3);
        --color-white-25: rgba(255,255,255,0.25);
        --color-white-20: rgba(255,255,255,0.2);
        --color-white-15: rgba(255,255,255,0.15);
        --color-white-10: rgba(255,255,255,0.1);
        --color-white-5: rgba(255,255,255,0.05);
        --color-white-0: rgba(255,255,255,0);

        --color-success-100: #47c288;

        --color-error-100: #ff2e00;
        --color-error-10: rgba(255,46,0,0.1);

        --font-size-base: 16;

        --font-size-heading-1: 2.5;
        --font-size-heading-2: 2;
        --font-size-heading-3: 1.5;
        --font-size-heading-4: 1.25;
        --font-size-heading-5: 1.125;
        --font-size-heading-6: 0.875;
        --font-size-body-1: 1;
        --font-size-body-2: 0.875;
        --font-size-body-3: 0.75;

        --font-family-heading: 'Nanum Myeongjo';
        --font-family-body: 'Nanum Myeongjo';

        --font-weight-heading: 400;
        --font-weight-body: 400;

        --line-height-logo: 1.25;
        --line-height-heading: 1.4;
        --line-height-body: 1.6;

        --letter-spacing-logo: 0;
        --letter-spacing-heading: 0;
        --letter-spacing-body: 0;

        --spacing-text-heading-s: 0.5em;
        --spacing-text-heading-m: 1em;
        --spacing-text-heading-l: 1.5em;
        --spacing-text-heading-xl: 2em;

        --spacing-text-body-2xs: 0.25em;
        --spacing-text-body-xs: 0.5em;
        --spacing-text-body-s: 0.75em;
        --spacing-text-body-m: 1em;
        --spacing-text-body-l: 1.25em;
        --spacing-text-body-xl: 1.5em;
        --spacing-text-body-2xl: 2em;
        --spacing-text-body-3xl: 3em;

        --spacing-base-fx-xs: 0.5rem;
        --spacing-base-fx-s: 0.75rem;
        --spacing-base-fx-m: 1rem;
        --spacing-base-fx-l: 1.25rem;
        --spacing-base-fx-xl: 1.5rem;
        --spacing-base-fx-2xl: 2rem;
        --spacing-base-fx-3xl: 2.5rem;
        --spacing-base-fx-4xl: 3rem;

        --spacing-base-x-s: 20px;
        --spacing-base-x-l: 40px;
        --spacing-base-y-s: 2.5vmax;
        --spacing-base-y-m: 3.75vmax;
        --spacing-base-y-l: 5vmax;

        --section-content-width-normal: 1720px;
        --section-content-width-narrow: 1280px;
        --section-content-width-full: 100vw;

        --input-fixed-width: 335px;

        --button-border-radius: 0;

        --button-rectangle-border-radius: 0;
        --button-round-rectangle-border-radius: 8px;
        --button-capsule-border-radius: 100px;

        --toss-pay-color: #4780ef;
      }

      @media (min-width: 768px) {
        :root {
          --font-size-heading-1: 4;
          --font-size-heading-2: 3;
          --font-size-heading-3: 2;
          --font-size-heading-4: 1.5;
        }
      }