@import url("https://fonts.cdnfonts.com/css/helvetica-neue-75");
:root {
    --color-primary-50: #e0f7f1;
    --color-primary-100: #b0e8df;
    --color-primary-200: #81dacb;
    --color-primary-300: #51cdb9;
    --color-primary-400: #29c1a7;
    --color-primary-500: #00b696;
    --color-primary-600: #00a186;
    --color-primary-700: #008c73;
    --color-primary-800: #00755e;
    --color-primary-900: #005C4B;
    --color-primary-1000: #009B7E;
    --color-primary-1100: #005C4B;
    --color-neutral-50: #f0eaea;
    --color-neutral-100: #e0dede;
    --color-neutral-200: #d0d0d0;
    --color-neutral-300: #bebebe;
    --color-neutral-400: #a6a6a6;
    --color-neutral-500: #787878;
    --color-neutral-600: #5a5a5a;
    --color-neutral-700: #414141;
    --color-neutral-800: #2b2b2b;
    --color-neutral-900: #131212;
    --color-tertiary-50: #fbf7ef;
    --color-tertiary-100: #f6edc5;
    --color-tertiary-200: #f0e2a0;
    --color-tertiary-300: #e3c996;
    --color-tertiary-400: #dab08c;
    --color-tertiary-500: #c99778;
    --color-tertiary-600: #b3875f;
    --color-tertiary-700: #997543;
    --color-tertiary-800: #74612e;
    --color-tertiary-900: #584827;
    --color-red-50: #fce6e5;
    --color-red-100: #fdd5d3;
    --color-red-200: #fbb4b1;
    --color-red-300: #f2938f;
    --color-red-400: #ea6f6b;
    --color-red-500: #e24944;
    --color-red-600: #d5231e;
    --color-red-700: #b7190e;
    --color-red-800: #831a17;
    --color-red-900: #581d19;
    --color-text: #2D2C2B;
    --color-sub-text: #868686;
    --color-sub-text-2: #575655;
    --color-white: #ffffff;
    --color-black: #000000;
    --color-suttle: #F2F2F7;
    --fw-regular: 400;
    --fw-medium: 500;
    --fw-semibold: 600;
    --fw-bold: 700;
    --bg-color-primary: #007862;
    --bg-color-sub-text: #f9f9f9;
    --bg-color-btn-primary: rgba(0, 155, 126, 1);
    --bg-color-btn-primary-tag: rgba(12, 32, 54, 0.6);
    --bg-color-btn-primary-active: rgba(230, 251, 247, 1);
    --bd-color-btn-primary: rgba(203, 213, 225, 1);
    --bd-color-btn-primary-active: rgba(0, 218, 178, 1);
    --bg-color-navbar-primary: rgba(242, 242, 247, 1);
    --color-border-navbar-active: rgba(203, 213, 225, 1);
}

.swm-m-auto {
    margin: auto;
}

.swm-m-0 {
    margin: 0rem !important;
}

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

.swm-mr-0 {
    margin-right: 0rem !important;
}

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

.swm-ml-0 {
    margin-left: 0rem !important;
}

.swm-mx-0 {
    margin-left: 0rem;
    margin-right: 0rem;
}

.swm-my-0 {
    margin-top: 0rem;
    margin-bottom: 0rem;
}

.swm-m-1 {
    margin: 0.25rem !important;
}

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

.swm-mr-1 {
    margin-right: 0.25rem !important;
}

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

.swm-ml-1 {
    margin-left: 0.25rem !important;
}

.swm-mx-1 {
    margin-left: 0.25rem;
    margin-right: 0.25rem;
}

.swm-my-1 {
    margin-top: 0.25rem;
    margin-bottom: 0.25rem;
}

.swm-m-2 {
    margin: 0.5rem !important;
}

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

.swm-mr-2 {
    margin-right: 0.5rem !important;
}

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

.swm-ml-2 {
    margin-left: 0.5rem !important;
}

.swm-mx-2 {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
}

.swm-my-2 {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

.swm-m-3 {
    margin: 0.75rem !important;
}

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

.swm-mr-3 {
    margin-right: 0.75rem !important;
}

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

.swm-ml-3 {
    margin-left: 0.75rem !important;
}

.swm-mx-3 {
    margin-left: 0.75rem;
    margin-right: 0.75rem;
}

.swm-my-3 {
    margin-top: 0.75rem;
    margin-bottom: 0.75rem;
}

.swm-m-4 {
    margin: 1rem !important;
}

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

.swm-mr-4 {
    margin-right: 1rem !important;
}

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

.swm-ml-4 {
    margin-left: 1rem !important;
}

.swm-mx-4 {
    margin-left: 1rem;
    margin-right: 1rem;
}

.swm-my-4 {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.swm-m-5 {
    margin: 1.25rem !important;
}

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

.swm-mr-5 {
    margin-right: 1.25rem !important;
}

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

.swm-ml-5 {
    margin-left: 1.25rem !important;
}

.swm-mx-5 {
    margin-left: 1.25rem;
    margin-right: 1.25rem;
}

.swm-my-5 {
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
}

.swm-m-6 {
    margin: 1.5rem !important;
}

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

.swm-mr-6 {
    margin-right: 1.5rem !important;
}

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

.swm-ml-6 {
    margin-left: 1.5rem !important;
}

.swm-mx-6 {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
}

.swm-my-6 {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

.swm-m-8 {
    margin: 2rem !important;
}

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

.swm-mr-8 {
    margin-right: 2rem !important;
}

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

.swm-ml-8 {
    margin-left: 2rem !important;
}

.swm-mx-8 {
    margin-left: 2rem;
    margin-right: 2rem;
}

.swm-my-8 {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.swm-m-10 {
    margin: 2.5rem !important;
}

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

.swm-mr-10 {
    margin-right: 2.5rem !important;
}

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

.swm-ml-10 {
    margin-left: 2.5rem !important;
}

.swm-mx-10 {
    margin-left: 2.5rem;
    margin-right: 2.5rem;
}

.swm-my-10 {
    margin-top: 2.5rem;
    margin-bottom: 2.5rem;
}

.swm-m-12 {
    margin: 3rem !important;
}

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

.swm-mr-12 {
    margin-right: 3rem !important;
}

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

.swm-ml-12 {
    margin-left: 3rem !important;
}

.swm-mx-12 {
    margin-left: 3rem;
    margin-right: 3rem;
}

.swm-my-12 {
    margin-top: 3rem;
    margin-bottom: 3rem;
}

.swm-m-14 {
    margin: 3.75rem !important;
}

.swm-mt-14 {
    margin-top: 3.75rem !important;
}

.swm-mr-14 {
    margin-right: 3.75rem !important;
}

.swm-mb-14 {
    margin-bottom: 3.75rem !important;
}

.swm-ml-14 {
    margin-left: 3.75rem !important;
}

.swm-mx-14 {
    margin-left: 3.75rem;
    margin-right: 3.75rem;
}

.swm-my-14 {
    margin-top: 3.75rem;
    margin-bottom: 3.75rem;
}

.swm-m-16 {
    margin: 4rem !important;
}

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

.swm-mr-16 {
    margin-right: 4rem !important;
}

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

.swm-ml-16 {
    margin-left: 4rem !important;
}

.swm-mx-16 {
    margin-left: 4rem;
    margin-right: 4rem;
}

.swm-my-16 {
    margin-top: 4rem;
    margin-bottom: 4rem;
}

.swm-m-20 {
    margin: 5rem !important;
}

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

.swm-mr-20 {
    margin-right: 5rem !important;
}

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

.swm-ml-20 {
    margin-left: 5rem !important;
}

.swm-mx-20 {
    margin-left: 5rem;
    margin-right: 5rem;
}

.swm-my-20 {
    margin-top: 5rem;
    margin-bottom: 5rem;
}

.swm-m-22 {
    margin: 5.475rem !important;
}

.swm-mt-22 {
    margin-top: 5.475rem !important;
}

.swm-mr-22 {
    margin-right: 5.475rem !important;
}

.swm-mb-22 {
    margin-bottom: 5.475rem !important;
}

.swm-ml-22 {
    margin-left: 5.475rem !important;
}

.swm-mx-22 {
    margin-left: 5.475rem;
    margin-right: 5.475rem;
}

.swm-my-22 {
    margin-top: 5.475rem;
    margin-bottom: 5.475rem;
}

.swm-m-24 {
    margin: 6rem !important;
}

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

.swm-mr-24 {
    margin-right: 6rem !important;
}

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

.swm-ml-24 {
    margin-left: 6rem !important;
}

.swm-mx-24 {
    margin-left: 6rem;
    margin-right: 6rem;
}

.swm-my-24 {
    margin-top: 6rem;
    margin-bottom: 6rem;
}

.swm-m-32 {
    margin: 8rem !important;
}

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

.swm-mr-32 {
    margin-right: 8rem !important;
}

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

.swm-ml-32 {
    margin-left: 8rem !important;
}

.swm-mx-32 {
    margin-left: 8rem;
    margin-right: 8rem;
}

.swm-my-32 {
    margin-top: 8rem;
    margin-bottom: 8rem;
}

.swm-m-40 {
    margin: 10rem !important;
}

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

.swm-mr-40 {
    margin-right: 10rem !important;
}

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

.swm-ml-40 {
    margin-left: 10rem !important;
}

.swm-mx-40 {
    margin-left: 10rem;
    margin-right: 10rem;
}

.swm-my-40 {
    margin-top: 10rem;
    margin-bottom: 10rem;
}

.swm-p-0 {
    padding: 0rem !important;
}

.swm-pt-0 {
    padding-top: 0rem !important;
}

.swm-pr-0 {
    padding-right: 0rem !important;
}

.swm-pb-0 {
    padding-bottom: 0rem !important;
}

.swm-pl-0 {
    padding-left: 0rem !important;
}

.swm-px-0 {
    padding-left: 0rem;
    padding-right: 0rem;
}

.swm-py-0 {
    padding-top: 0rem;
    padding-bottom: 0rem;
}

.swm-p-1 {
    padding: 0.25rem !important;
}

.swm-pt-1 {
    padding-top: 0.25rem !important;
}

.swm-pr-1 {
    padding-right: 0.25rem !important;
}

.swm-pb-1 {
    padding-bottom: 0.25rem !important;
}

.swm-pl-1 {
    padding-left: 0.25rem !important;
}

.swm-px-1 {
    padding-left: 0.25rem;
    padding-right: 0.25rem;
}

.swm-py-1 {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}

.swm-p-2 {
    padding: 0.5rem !important;
}

.swm-pt-2 {
    padding-top: 0.5rem !important;
}

.swm-pr-2 {
    padding-right: 0.5rem !important;
}

.swm-pb-2 {
    padding-bottom: 0.5rem !important;
}

.swm-pl-2 {
    padding-left: 0.5rem !important;
}

.swm-px-2 {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.swm-py-2 {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.swm-p-3 {
    padding: 0.75rem !important;
}

.swm-pt-3 {
    padding-top: 0.75rem !important;
}

.swm-pr-3 {
    padding-right: 0.75rem !important;
}

.swm-pb-3 {
    padding-bottom: 0.75rem !important;
}

.swm-pl-3 {
    padding-left: 0.75rem !important;
}

.swm-px-3 {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

.swm-py-3 {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.swm-p-4 {
    padding: 1rem !important;
}

.swm-pt-4 {
    padding-top: 1rem !important;
}

.swm-pr-4 {
    padding-right: 1rem !important;
}

.swm-pb-4 {
    padding-bottom: 1rem !important;
}

.swm-pl-4 {
    padding-left: 1rem !important;
}

.swm-px-4 {
    padding-left: 1rem;
    padding-right: 1rem;
}

.swm-py-4 {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.swm-p-5 {
    padding: 1.25rem !important;
}

.swm-pt-5 {
    padding-top: 1.25rem !important;
}

.swm-pr-5 {
    padding-right: 1.25rem !important;
}

.swm-pb-5 {
    padding-bottom: 1.25rem !important;
}

.swm-pl-5 {
    padding-left: 1.25rem !important;
}

.swm-px-5 {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

.swm-py-5 {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
}

.swm-p-6 {
    padding: 1.5rem !important;
}

.swm-pt-6 {
    padding-top: 1.5rem !important;
}

.swm-pr-6 {
    padding-right: 1.5rem !important;
}

.swm-pb-6 {
    padding-bottom: 1.5rem !important;
}

.swm-pl-6 {
    padding-left: 1.5rem !important;
}

.swm-px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.swm-py-6 {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

.swm-p-8 {
    padding: 2rem !important;
}

.swm-pt-8 {
    padding-top: 2rem !important;
}

.swm-pr-8 {
    padding-right: 2rem !important;
}

.swm-pb-8 {
    padding-bottom: 2rem !important;
}

.swm-pl-8 {
    padding-left: 2rem !important;
}

.swm-px-8 {
    padding-left: 2rem;
    padding-right: 2rem;
}

.swm-py-8 {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.swm-p-10 {
    padding: 2.5rem !important;
}

.swm-pt-10 {
    padding-top: 2.5rem !important;
}

.swm-pr-10 {
    padding-right: 2.5rem !important;
}

.swm-pb-10 {
    padding-bottom: 2.5rem !important;
}

.swm-pl-10 {
    padding-left: 2.5rem !important;
}

.swm-px-10 {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
}

.swm-py-10 {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}

.swm-p-12 {
    padding: 3rem !important;
}

.swm-pt-12 {
    padding-top: 3rem !important;
}

.swm-pr-12 {
    padding-right: 3rem !important;
}

.swm-pb-12 {
    padding-bottom: 3rem !important;
}

.swm-pl-12 {
    padding-left: 3rem !important;
}

.swm-px-12 {
    padding-left: 3rem;
    padding-right: 3rem;
}

.swm-py-12 {
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.swm-p-14 {
    padding: 3.75rem !important;
}

.swm-pt-14 {
    padding-top: 3.75rem !important;
}

.swm-pr-14 {
    padding-right: 3.75rem !important;
}

.swm-pb-14 {
    padding-bottom: 3.75rem !important;
}

.swm-pl-14 {
    padding-left: 3.75rem !important;
}

.swm-px-14 {
    padding-left: 3.75rem;
    padding-right: 3.75rem;
}

.swm-py-14 {
    padding-top: 3.75rem;
    padding-bottom: 3.75rem;
}

.swm-p-16 {
    padding: 4rem !important;
}

.swm-pt-16 {
    padding-top: 4rem !important;
}

.swm-pr-16 {
    padding-right: 4rem !important;
}

.swm-pb-16 {
    padding-bottom: 4rem !important;
}

.swm-pl-16 {
    padding-left: 4rem !important;
}

.swm-px-16 {
    padding-left: 4rem;
    padding-right: 4rem;
}

.swm-py-16 {
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.swm-p-20 {
    padding: 5rem !important;
}

.swm-pt-20 {
    padding-top: 5rem !important;
}

.swm-pr-20 {
    padding-right: 5rem !important;
}

.swm-pb-20 {
    padding-bottom: 5rem !important;
}

.swm-pl-20 {
    padding-left: 5rem !important;
}

.swm-px-20 {
    padding-left: 5rem;
    padding-right: 5rem;
}

.swm-py-20 {
    padding-top: 5rem;
    padding-bottom: 5rem;
}

.swm-p-22 {
    padding: 5.475rem !important;
}

.swm-pt-22 {
    padding-top: 5.475rem !important;
}

.swm-pr-22 {
    padding-right: 5.475rem !important;
}

.swm-pb-22 {
    padding-bottom: 5.475rem !important;
}

.swm-pl-22 {
    padding-left: 5.475rem !important;
}

.swm-px-22 {
    padding-left: 5.475rem;
    padding-right: 5.475rem;
}

.swm-py-22 {
    padding-top: 5.475rem;
    padding-bottom: 5.475rem;
}

.swm-p-24 {
    padding: 6rem !important;
}

.swm-pt-24 {
    padding-top: 6rem !important;
}

.swm-pr-24 {
    padding-right: 6rem !important;
}

.swm-pb-24 {
    padding-bottom: 6rem !important;
}

.swm-pl-24 {
    padding-left: 6rem !important;
}

.swm-px-24 {
    padding-left: 6rem;
    padding-right: 6rem;
}

.swm-py-24 {
    padding-top: 6rem;
    padding-bottom: 6rem;
}

.swm-p-32 {
    padding: 8rem !important;
}

.swm-pt-32 {
    padding-top: 8rem !important;
}

.swm-pr-32 {
    padding-right: 8rem !important;
}

.swm-pb-32 {
    padding-bottom: 8rem !important;
}

.swm-pl-32 {
    padding-left: 8rem !important;
}

.swm-px-32 {
    padding-left: 8rem;
    padding-right: 8rem;
}

.swm-py-32 {
    padding-top: 8rem;
    padding-bottom: 8rem;
}

.swm-p-40 {
    padding: 10rem !important;
}

.swm-pt-40 {
    padding-top: 10rem !important;
}

.swm-pr-40 {
    padding-right: 10rem !important;
}

.swm-pb-40 {
    padding-bottom: 10rem !important;
}

.swm-pl-40 {
    padding-left: 10rem !important;
}

.swm-px-40 {
    padding-left: 10rem;
    padding-right: 10rem;
}

.swm-py-40 {
    padding-top: 10rem;
    padding-bottom: 10rem;
}

.d-block {
    display: block;
}

.d-inline {
    display: inline;
}

.d-inline-block {
    display: inline-block;
}

.d-flex {
    display: flex;
}

.d-grid {
    display: grid;
}

.d-inline-flex {
    display: inline-flex;
}

.d-none {
    display: none;
}

.flex-row {
    flex-direction: row;
}

.flex-row-reverse {
    flex-direction: row-reverse;
}

.flex-col {
    flex-direction: column;
}

.flex-col-reverse {
    flex-direction: column-reverse;
}

.flex-wrap {
    flex-wrap: wrap;
}

.flex-nowrap {
    flex-wrap: nowrap;
}

.flex-wrap-reverse {
    flex-wrap: wrap-reverse;
}

.justify-start {
    justify-content: flex-start;
}

.justify-end {
    justify-content: flex-end;
}

.justify-center {
    justify-content: center;
}

.justify-between {
    justify-content: space-between;
}

.justify-around {
    justify-content: space-around;
}

.justify-evenly {
    justify-content: space-evenly;
}

.items-start {
    align-items: flex-start;
}

.items-end {
    align-items: flex-end;
}

.items-center {
    align-items: center;
}

.items-baseline {
    align-items: baseline;
}

.items-stretch {
    align-items: stretch;
}

.content-start {
    align-content: flex-start;
}

.content-end {
    align-content: flex-end;
}

.content-center {
    align-content: center;
}

.content-between {
    align-content: space-between;
}

.content-around {
    align-content: space-around;
}

.content-stretch {
    align-content: stretch;
}

.self-auto {
    align-self: auto;
}

.self-start {
    align-self: flex-start;
}

.self-end {
    align-self: flex-end;
}

.self-center {
    align-self: center;
}

.self-baseline {
    align-self: baseline;
}

.self-stretch {
    align-self: stretch;
}

.flex-grow {
    flex-grow: 1;
}

.flex-grow-0 {
    flex-grow: 0;
}

.flex-shrink {
    flex-shrink: 1;
}

.flex-shrink-0 {
    flex-shrink: 0;
}

.flex-1 {
    flex: 1 1 0%;
}

.flex-auto {
    flex: 1 1 auto;
}

.flex-initial {
    flex: 0 1 auto;
}

.flex-none {
    flex: none;
}

.order-1 {
    order: 1;
}

.order-2 {
    order: 2;
}

.order-3 {
    order: 3;
}

.order-4 {
    order: 4;
}

.order-5 {
    order: 5;
}

.order-first {
    order: -9999;
}

.order-last {
    order: 9999;
}

.order-none {
    order: 0;
}

@media (max-width: 768px) {
    .mobile\:flex-row {
        flex-direction: row;
    }
    .mobile\:flex-col {
        flex-direction: column;
    }
    .mobile\:s-block {
        display: block;
    }
    .mobile\:t-center {
        text-align: center;
    }
    .mobile\:mw-100 {
        max-width: 100% !important;
    }
}
@media (min-width: 1200px) {
    .desktop\:flex-row {
        flex-direction: row;
    }
    .desktop\:flex-col {
        flex-direction: column;
    }
}
.width-auto {
    width: auto;
}

.width-full {
    width: 100%;
}

.width-screen {
    width: 100vw;
}

.width-1\/2 {
    width: 50%;
}

.width-1\/3 {
    width: 33.333333%;
}

.width-2\/3 {
    width: 66.666667%;
}

.width-1\/4 {
    width: 25%;
}

.width-3\/4 {
    width: 75%;
}

.width-1\/5 {
    width: 20%;
}

.width-2\/5 {
    width: 40%;
}

.width-3\/5 {
    width: 60%;
}

.width-4\/5 {
    width: 80%;
}

.width-1\/6 {
    width: 16.666667%;
}

.width-5\/6 {
    width: 83.333333%;
}

.width-px {
    width: 1px;
}

.width-4 {
    width: 4px;
}

.width-8 {
    width: 8px;
}

.width-16 {
    width: 16px;
}

.width-32 {
    width: 32px;
}

.width-64 {
    width: 64px;
}

.width-128 {
    width: 128px;
}

.width-256 {
    width: 256px;
}

.width-512 {
    width: 512px;
}

.width-1024 {
    width: 1024px;
}

.width-10vw {
    width: 10vw;
}

.width-25vw {
    width: 25vw;
}

.width-50vw {
    width: 50vw;
}

.width-75vw {
    width: 75vw;
}

.width-100vw {
    width: 100vw;
}

.width-10rem {
    width: 10rem;
}

.width-20rem {
    width: 20rem;
}

.width-30rem {
    width: 30rem;
}

.height-auto {
    height: auto;
}

.height-full {
    height: 100%;
}

.height-screen {
    height: 100vh;
}

.height-1\/2 {
    height: 50%;
}

.height-1\/3 {
    height: 33.333333%;
}

.height-2\/3 {
    height: 66.666667%;
}

.height-1\/4 {
    height: 25%;
}

.height-3\/4 {
    height: 75%;
}

.height-1\/5 {
    height: 20%;
}

.height-2\/5 {
    height: 40%;
}

.height-3\/5 {
    height: 60%;
}

.height-4\/5 {
    height: 80%;
}

.height-1\/6 {
    height: 16.666667%;
}

.height-5\/6 {
    height: 83.333333%;
}

.height-px {
    height: 1px;
}

.height-4 {
    height: 4px;
}

.height-8 {
    height: 8px;
}

.height-16 {
    height: 16px;
}

.height-32 {
    height: 32px;
}

.height-64 {
    height: 64px;
}

.height-128 {
    height: 128px;
}

.height-256 {
    height: 256px;
}

.height-512 {
    height: 512px;
}

.height-1024 {
    height: 1024px;
}

.height-10vh {
    height: 10vh;
}

.height-25vh {
    height: 25vh;
}

.height-50vh {
    height: 50vh;
}

.height-75vh {
    height: 75vh;
}

.height-100vh {
    height: 100vh;
}

.height-10rem {
    height: 10rem;
}

.height-20rem {
    height: 20rem;
}

.height-30rem {
    height: 30rem;
}

.height-80 {
    height: 80px;
}

.max-width-1200px {
    max-width: 1200px;
}

.max-width-252px {
    max-width: 252px;
}

.max-width-406px {
    max-width: 406px;
}

.size-24 {
    width: 1.5rem;
    height: 1.5em;
}

.gap-1 {
    gap: 10px;
}

.gap-8px {
    gap: 8px;
}

.gap-3-5 {
    gap: 3.5rem;
}

.gap-9\.5rem {
    gap: 9.5rem;
}

.gap-1rem {
    gap: 1rem;
}

.gap-1\.5rem {
    gap: 1.5rem;
}

.gap-2\.25rem {
    gap: 2.25rem;
}

.gap-2\.5rem {
    gap: 2.5rem;
}

.line-h-1\.2 {
    line-height: 1.2;
}

.radius-20 {
    border-radius: 20px;
}

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

.bg-color-primary {
    background-color: var(--color-primary-1000);
}

.bg-color-primary-2 {
    background-color: var(--color-primary-800);
}

.bg-color-primary-3 {
    background-color: var(--color-primary-200);
}

.bg-color-primary-4 {
    background-color: var(--color-primary-700);
}

.bg-color-white {
    background-color: var(--color-white);
}

.bg-color-suttle {
    background-color: var(--color-suttle);
}

.bg-color-tertiary-1 {
    background-color: var(--color-tertiary-200);
}

.color-white {
    color: var(--color-white) !important;
}

.color-primary-900 {
    color: var(--color-primary-900) !important;
}

.color-sub-text {
    color: var(--color-sub-text-2);
}

.position-relative {
    position: relative;
}

.position-absolute {
    position: absolute;
}

.bottom-33\.5 {
    bottom: -33.5%;
}

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

.swm-p-1\.5rem {
    padding: 1.5rem;
}

.swm-pr-5\% {
    padding-right: 5%;
}

.swm-pl-7\% {
    padding-left: 7%;
}

.swm-p-3125 {
    padding: 3.125rem;
}

.swm-p-container {
    padding: 8rem 6.25rem;
}

.gap-7\% {
    gap: 7%;
}

.opacity-75 {
    opacity: 75%;
}

.overflow-hidden {
    overflow: hidden;
}

.border-radius-1 {
    border-radius: 1.25rem;
}

.border-radius-2 {
    border-radius: 6.25rem;
}

.border-radius-3 {
    border-radius: 0.5rem;
}

.border-radius-4 {
    border-radius: 1.875rem;
}

.border-radius-5 {
    border-radius: 0.625rem;
}

.border-radius-6 {
    border-radius: 0.75rem;
}

.border-radius-7 {
    border-radius: 0.25rem;
}

.hover\:cursor-pointer:hover {
    cursor: pointer;
}

.object-fit-cover {
    -o-object-fit: cover;
    object-fit: cover;
}

/*
  1. Use a more-intuitive box-sizing model.
*/
*, *::before, *::after {
    box-sizing: border-box;
}

/*
  2. Remove default margin
*/
* {
    margin: 0;
}

/*
  Typographic tweaks!
  3. Add accessible line-height
  4. Improve text rendering
*/
body {
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

/*
  5. Improve media defaults
*/
img, picture, video, canvas, svg {
    display: block;
    max-width: 100%;
}

/*
  6. Remove built-in form typography styles
*/
input, button, textarea, select {
    font: inherit;
}

/*
  7. Avoid text overflows
*/
p, h1, h2, h3, h4, h5, h6 {
    overflow-wrap: break-word;
}

/*
  8. Create a root stacking context
*/
#root, #__next {
    isolation: isolate;
}

html {
    font-size: 16px !important;
}
@media (max-width: 768px) {
    html {
        font-size: 10px !important;
    }
}

* {
    font-family: "Helvetica Neue", Arial, sans-serif;
}

body {
    background-color: var(--color-white);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--color-text);
}

p {
    color: var(--color-sub-text);
}

.section-4__video {
    position: relative;
}
.section-4__video .overlay-border {
    position: absolute;
    width: 100%;
    height: 100%;
    border-color: red;
}

.swm-container {
    max-width: 1400px;
}

.swm-container-progress {
    max-width: 1244px;
}

.button-primary {
    font-size: 1.5rem;
    font-weight: var(--fw-regular);
    gap: 0.25rem;
    border-radius: 0.5rem;
    background: var(--bg-color-btn-primary);
    border: none;
    padding: 1rem;
    color: var(--color-white);
    line-height: 1.5rem;
    cursor: pointer;
    white-space: nowrap;
}
.button-primary.button-primary-pill {
    font-size: 1.25rem;
    border-radius: 62.5rem;
    padding: 1rem 1.5rem;
    gap: 0.625rem;
}
.button-primary.button-primary-pill:hover {
    background-color: var(--color-primary-600);
}
.button-primary.button-primary-pill.button-primary-pill-transparent {
    background-color: transparent;
    font-size: 2rem;
    line-height: 2.4rem;
    font-weight: var(--fw-medium);
}
@media (max-width: 768px) {
    .button-primary.button-primary-pill {
        font-size: 1.4rem;
        padding: 1rem 1.6rem;
        line-height: 2.1rem;
        font-weight: var(--fw-medium);
    }
}
.button-primary.button-primary-pill:active {
    transform: scale(0.98);
}
.button-primary.button-primary-inverse {
    border: 1px solid var(--bd-color-btn-primary);
    background: var(--color-white);
    color: var(--color-black);
}
.button-primary.button-primary-inverse:hover {
    background-color: var(--color-tertiary-50);
}
.button-primary.button-primary-inverse:active {
    transform: scale(0.98);
    border: 1px solid var(--bd-color-btn-primary-active);
    background: var(--bg-color-btn-primary-active);
}
.button-primary.button-primary-tag {
    background: var(--bg-color-btn-primary-tag);
    gap: 0.375rem;
}

.swm-btn {
    border: none;
    border-radius: 6.25rem;
    display: flex;
    padding: 0.875rem 1rem;
    justify-content: center;
    align-items: center;
    gap: 0.625rem;
    align-self: stretch;
    outline: none;
    transition: 0.3s;
}
.swm-btn:hover {
    cursor: pointer;
    opacity: 0.8;
}
.swm-btn.swm-btn-primary {
    background: var(--color-primary-1000);
    box-shadow: 0px 7px 20px 0px rgba(0, 198, 162, 0.2);
    color: var(--color-white);
}
.swm-btn.swm-btn-secondary {
    background: var(--color-white);
    color: var(--color-black);
}

.typo-head-1 {
    color: var(--color-text);
    font-size: 4.5rem;
    font-style: normal;
    font-weight: 700;
    line-height: 120%; /* 5.4rem */
}

.typo-head-2 {
    color: var(--color-text);
    font-size: 3.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: 120%; /* 3.9rem */
}

.typo-head-4 {
    color: var(--color-text);
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 500;
    line-height: 120%; /* 1.8rem */
}

.typo-head-4-b {
    color: var(--color-text);
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 700;
    line-height: 120%; /* 1.8rem */
}

.typo-head-5 {
    color: var(--color-text);
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 500;
    line-height: 120%; /* 1.5rem */
}

.typo-sub-text-1 {
    color: var(--color-sub-text-2);
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 500;
    line-height: 120%; /* 1.8rem */
}

.typo-sub-text-2 {
    font-size: 1rem;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 1.5rem */
}

.typo-sub-text-3 {
    color: var(--color-sub-text-2);
    font-size: 1rem;
    font-style: normal;
    font-weight: 500;
    line-height: 150%; /* 1.8rem */
}

.typo-sub-text-5 {
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 500;
    line-height: 150%; /* 1.125rem */
}

.typo-sub-text-4 {
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 500;
    line-height: 150%; /* 1.125rem */
}

.typo-sub-text-4-smb {
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 1.125rem */
}

.typo-sub-text-5-smb {
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 1.125rem */
}

.typo-sub-text-5-2 {
    color: var(--color-sub-text-2);
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 500;
    line-height: 150%; /* 1.125rem */
}

.text-heading-1 {
    font-size: 3.25rem;
}

.text-heading-1-b {
    font-size: 3.25rem;
    font-weight: bold;
}

.text-heading-2 {
    font-size: 2.625rem;
}

.text-heading-2-b {
    font-size: 2.625rem;
    font-weight: bold;
}

.text-heading-3-b {
    font-size: 2rem;
    font-weight: bold;
}

.text-heading-3-m {
    font-size: 2rem;
    font-weight: 500;
}

.text-heading-4-b {
    font-size: 1.5rem;
    font-weight: bold;
}

.text-heading-4-m {
    font-size: 1.5rem;
    font-weight: 500;
}

.text-heading-4 {
    font-size: 1.5rem;
}

.text-heading-5-m {
    font-size: 1.25rem;
    font-weight: 500;
}

.text-heading-5-r {
    font-size: 1.25rem;
    font-weight: 400;
}

.text-body-m {
    font-size: 1rem;
    font-weight: 500;
}

.text-body-r {
    font-size: 1rem;
    font-weight: 400;
}

.text-body-small-m {
    font-size: 0.875rem;
    font-weight: 500;
}

.text-body-small-r {
    font-size: 0.875rem;
    font-weight: 400;
}

/* Smallest Text */
.text-smallest-m {
    font-size: 0.75rem;
    font-weight: 500;
}

.text-smallest-r {
    font-size: 0.75rem;
    font-weight: 400;
}

.line-height-120\% {
    line-height: 120%;
}

.section-2__different .background {
    position: absolute;
    left: 21.75rem;
    bottom: -14.23775rem;
    z-index: 0;
    width: 44.71681rem;
    height: 43.85031rem;
}
.section-2__different .section-2__different__top {
    padding-top: 7.5rem;
    padding-bottom: 12.5rem;
    padding-left: 1.5rem;
    padding-right: 1rem;
    z-index: 1;
    height: 31.625rem;
}
@media (max-width: 768px) {
    .section-2__different .section-2__different__top {
        padding-top: 3.75rem;
    }
    .section-2__different .section-2__different__top .background_pattern {
        left: 11.75rem !important;
        scale: 1.6;
        top: 29%;
    }
}
@media (max-width: 768px) {
    .section-2__different .section-2__different__top .section-2__different__top__content {
        flex-direction: column;
        align-items: unset;
        gap: 2rem !important;
    }
    .section-2__different .section-2__different__top .section-2__different__top__content .section-2__different__top__content__desc {
        max-width: 100% !important;
    }
}
@media (max-width: 768px) {
    .section-2__different .section-2__different__bottom > .card-different {
        flex-direction: column;
        margin-top: -3.125rem !important;
        gap: 2rem !important;
    }
}

.line-horizontal-yellow {
    width: 0.237rem;
    background-color: #ffd700;
    height: 10.625rem;
    top: 9px;
    left: -30px;
}
@media (max-width: 768px) {
    .line-horizontal-yellow {
        top: 6px;
        left: -10px;
    }
}

.card-different {
    border-radius: 1.25rem;
    box-shadow: 634px 7039px 1979px 0px rgba(0, 0, 0, 0), 406px 4505px 1809px 0px rgba(0, 0, 0, 0.01), 228px 2534px 1527px 0px rgba(0, 0, 0, 0.05), 101px 1126px 1131px 0px rgba(0, 0, 0, 0.09), 25px 282px 622px 0px rgba(0, 0, 0, 0.1);
}

.cursor-pointer {
    cursor: pointer;
}

.footer-container {
    background-color: #007862;
}

.footer-text {
    line-height: 64px;
    font-size: 16px;
}

.list-avatar > .avatar:not(:nth-child(1)) {
    margin-left: -1.125rem;
}

.avatar {
    width: 2.8125rem;
    height: 2.8125rem;
    border-radius: 6.25rem;
    border: 2px solid var(--color-tertiary-50);
    overflow: hidden;
}

.section-5__benefits {
    max-width: 77.5rem;
    margin: auto;
    padding-top: 7.5rem;
    padding-bottom: 7.5rem;
}
@media (max-width: 768px) {
    .section-5__benefits {
        flex-direction: column !important;
        padding-top: 2.5rem !important;
        padding-bottom: 2.5rem !important;
    }
    .section-5__benefits .header-benefits {
        text-align: center;
    }
}
.section-5__benefits .section-5__benefits__left {
    width: 100rem;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
}
@media (max-width: 768px) {
    .section-5__benefits .section-5__benefits__left {
        width: 100% !important;
        align-items: center !important;
    }
    .section-5__benefits .section-5__benefits__left .list-benefits .each-benefit {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}
.section-5__benefits .section-5__benefits__right {
    flex-grow: 1;
}
.section-5__benefits .section-5__benefits__right > div {
    padding: 3.125rem;
    padding-top: 8.625rem;
    padding-left: 1.8125rem;
    padding-right: 2.88rem;
    background: var(--ll, linear-gradient(212deg, rgba(8, 141, 103, 0.9) -22.18%, rgba(41, 133, 195, 0.9) 128.95%));
}

header {
    position: fixed;
    top: 0;
    width: 100vw;
    background-color: var(--color-white);
    z-index: 1000;
    padding-left: 6.3125rem;
    padding-right: 6.3125rem;
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
}
@media (max-width: 768px) {
    header {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
    header .header__menu {
        display: none !important;
    }
}
header > nav img {
    width: 13rem;
}
header .header__menu {
    padding: 0.25rem 1rem 0.25rem 0.3125rem;
    gap: 1.6875rem;
    border-radius: 6.25rem;
    background: rgba(242, 242, 247, 0.6);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}
header .header__menu .header__menu__each-menu {
    display: flex;
    padding: 0.6875rem 1.375rem;
    justify-content: center;
    align-items: center;
    gap: 0.625rem;
    text-decoration: none;
}
header .header__menu .header__menu__each-menu.is-active {
    border-radius: 6.25rem;
    border: 1px solid var(--Stroke, #cbd5e1);
    font-weight: 500;
}

.section-3__video {
    padding-left: 4rem;
    padding-right: 4rem;
    padding-top: 67px;
}
@media (max-width: 768px) {
    .section-3__video {
        padding: 42px 13px 42px 13px;
    }
}

.section-4__text {
    padding: 3.75rem 6.25rem;
}
@media (max-width: 768px) {
    .section-4__text {
        padding: 20px 16px;
    }
}

@media (max-width: 768px) {
    .section-1__banner {
        padding: 1rem !important;
        padding-top: 6rem !important;
    }
    .section-1__banner .section-1__banner__content {
        flex-direction: column !important;
        padding: 3rem !important;
    }
}

.tb {
    background-color: var(--color-primary-1000);
}
@media (max-width: 768px) {
    .tb {
        margin: 16px 20px;
        border-radius: 8px;
    }
}

.tb-content {
    padding: 88, 96px 16px;
    border-radius: 20px;
}
@media (max-width: 768px) {
    .tb-content {
        padding: 89px 16px;
        border-radius: 10px;
    }
}

.tb-container {
    padding: 25px 100px;
    position: relative;
    z-index: 20;
}
@media (max-width: 768px) {
    .tb-container {
        padding: 20px 16px;
    }
}

.swm-feature-title {
    font-size: 32px;
    text-align: center;
    color: var(--color-primary-900);
}
@media (max-width: 768px) {
    .swm-feature-title {
        font-size: 40px;
        line-height: 38.4px;
    }
}

.swm-feature-des {
    color: var(--color-primary-900);
    font-size: 100px;
    line-height: 144px;
    text-align: center;
    margin: 0 auto;
    position: absolute;
    top: 20%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    visibility: hidden;
    animation-name: textFader;
    animation-duration: 18s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}
@media (max-width: 768px) {
    .swm-feature-des {
        margin: 0;
        line-height: 160px;
        top: -100px;
    }
}

.swm-feature {
    gap: 16px;
}
@media (max-width: 768px) {
    .swm-feature {
        gap: 40px;
        align-items: center;
    }
}

.swm-feature-proven {
    max-width: calc(100%/3 - 60px);
    min-width: calc(100%/3 - 60px);
}
@media (max-width: 768px) {
    .swm-feature-proven {
        max-width: 100%;
        min-width: none;
    }
}

.each-feature {
    gap: 117.92px;
    margin: 0px 24px;
    padding: 89px 57px;
}
@media (max-width: 768px) {
    .each-feature {
        gap: 95.2px;
        margin: 0px;
        align-items: center;
        padding: 0;
    }
}

.swm-section-pattern-background {
    left: 13%;
    bottom: -50%;
    z-index: 10;
}
@media (max-width: 768px) {
    .swm-section-pattern-background {
        top: 4.07%;
        right: -133%;
    }
}

.swm-before-after {
    width: 100%;
    padding-top: 60%;
}

.hair-before-after {
    position: absolute;
    top: 0;
    left: 100%;
    animation: 12s autoplay2 infinite ease-in-out;
    width: 100%;
    object-fit: cover;
    object-position: center;
}
.hair-before-after:first-of-type {
    animation-delay: 0s;
}

.hair-before-after:nth-of-type(2) {
    animation-delay: 4s;
}

.hair-before-after:last-of-type {
    animation-delay: 8s;
}

@keyframes autoplay2 {
    0% {
        left: 100%;
    }
    4% {
        left: 0%;
    }
    33.33% {
        left: 0%;
    }
    37.33% {
        left: -100%;
    }
    100% {
        left: -100%;
    }
}
@media (min-width: 1200px) {
    .face-before-after {
        display: none;
        height: 334.4px;
    }
}

@media (max-width: 768px) {
    .feature-price {
        gap: 115px;
    }
}

.swm-quality-product-container {
    width: 248px;
    min-width: 100%;
    max-width: 100%;
    padding-top: 95%;
    position: relative;
}

.quality-product {
    /* opacity: 0; */
    width: 100%;
    height: 100%;
}
.quality-product img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    left: 0;
    top: 0;
}
.quality-product:nth-child(1),
.quality-product:nth-child(4) {
    top: 0;
    left: 50%;
    transform: translate(-50%, 0);
}

.quality-product:nth-child(2),
.quality-product:nth-child(5) {
    bottom: 0;
    left: 0;
}

.quality-product:nth-child(3),
.quality-product:nth-child(6) {
    bottom: 0;
    right: 0;
}

@keyframes slideInOut {
    100% {
        left: 0;
    }
}
.swm-feature-des:first-of-type {
    animation-delay: 0s;
}

.swm-feature-des:nth-of-type(2) {
    animation-delay: 6s;
}

.swm-feature-des:last-of-type {
    animation-delay: 12s;
}

/* @keyframes textFader {
    0% {
        opacity: 0;
        display: none;
    }
    11% {
        opacity: 1;
        display: block;
    }
    22% {
        opacity: 1;
        display: block;
    }
    33% {
        opacity: 0;
        display: none;
    }
    100% {
        opacity: 0;
        display: none;
    }
} */

@keyframes textFader {
    0% {
        opacity: 0;
        visibility: hidden;
    }
    11% {
        opacity: 1;
        visibility: visible;
    }
    22% {
        opacity: 1;
        visibility: visible;
    }
    33% {
        opacity: 0;
        visibility: hidden;
    }
    100% {
        opacity: 0;
        visibility: hidden;
    }
}

@media (max-width: 768px) {
    body {
        background-color: rgb(255, 255, 255) !important;
    }
}

.header__progress .header__progress-nav {
    max-width: 1244px;
    margin: 0 auto;
}

.header__progress .header__progress-nav .header__progress-nav-btn-logout {
    padding-right: 5px;
}

@media (max-width: 768px) {
    .header__progress .header__progress-nav .header__progress-nav-btn-logout {
        padding-right: 0;
    }
}

.header__progress .header__progress-nav .header__progress-nav-btn-logout .section-1__progress__content__left-button-logout-box .section-1__progress__content__left-button-logout {
    padding: 12px 36px !important; 
    background: rgb(253, 236, 236) !important; 
    color: rgb(217, 62, 62) !important; 
    font-size: 12px !important
}

@media (max-width: 768px) {
    .header__progress .header__progress-nav .header__progress-nav-btn-logout .section-1__progress__content__left-button-logout-box .section-1__progress__content__left-button-logout {
        padding: 10px 24px !important; 
    }
}

.section-1__progress {
    margin: 96px auto;
    margin-bottom: 20px;
    background: rgb(255, 255, 255);
}
@media (max-width: 768px) {
    .section-1__progress {
        padding: 16px !important;
        margin-top: 66px;
        margin-bottom: 0;
    }
    .section-1__progress .section-1__progress__content {
        flex-direction: column !important;
    }
}
.section-1__progress .section-1__progress__content .section-1__progress__content__left {
    padding: 0 38px;
    width: 70%;
    gap: 14px;
}
@media (max-width: 768px) {
    .section-1__progress .section-1__progress__content .section-1__progress__content__left {
        padding: 0;
        width: 100%;
        margin: 0;
    }
}
@media (max-width: 768px) {
    .section-1__progress .section-1__progress__content .section-1__progress__content__left .section-1__progress__content__left-head {
        font-size: 32px;
    }
}
@media (max-width: 768px) {
    .section-1__progress .section-1__progress__content .section-1__progress__content__left .section-1__progress__content__left-title {
        width: 100%;
        font-size: 20px;
    }
}
@media (max-width: 768px) {
    .section-1__progress .section-1__progress__content .section-1__progress__content__right {
        border-radius: 10px;
        margin: 16px 0;
    }
}

.section-2__progress {
    margin: 0 auto;
}
@media (max-width: 768px) {
    .section-2__progress {
        padding: 16px !important;
        margin: 0 auto;
    }
    .section-2__progress .section-2__progress__content {
        flex-direction: column !important;
    }
}
.section-2__progress .section-2__progress__content {
    gap: 20px;
    align-items: stretch;
}
.section-2__progress .section-2__progress__content .section-2__progress__content__left {
    background: rgb(255, 255, 255);
    padding: 32px 20px;
}
@media (max-width: 768px) {
    .section-2__progress .section-2__progress__content .section-2__progress__content__left {
        padding: 0;
        width: 100%;
        margin: 0;
    }
}
@media (max-width: 768px) {
    .section-2__progress .section-2__progress__content .section-2__progress__content__left .section-2__progress__content__left-head {
        font-size: 24px;
    }
}
.section-2__progress .section-2__progress__content .section-2__progress__content__left .section-2__progress__parameters {
    gap: 10px;
    margin-top: 28px;
}
@media (max-width: 768px) {
    .section-2__progress .section-2__progress__content .section-2__progress__content__left .section-2__progress__parameters {
        margin-top: 10px;
    }
}
.section-2__progress .section-2__progress__content .section-2__progress__content__left .section-2__progress__parameters .section-2__progress__parameters_left {
    padding: 16px;
    border: 1.5px solid var(--bg-suttle, rgb(242, 242, 247));
}
@media (max-width: 768px) {
    .section-2__progress .section-2__progress__content .section-2__progress__content__left .section-2__progress__parameters .section-2__progress__parameters_left {
        width: 100%;
    }
}
@media (max-width: 768px) {
    .section-2__progress .section-2__progress__content .section-2__progress__content__left .section-2__progress__parameters .section-2__progress__parameters_left .section-2__progress__parameters_left-data .section-2__progress__parameters_left-data-number {
        font-size: 24px;
    }
}
@media (max-width: 768px) {
    .section-2__progress .section-2__progress__content .section-2__progress__content__left .section-2__progress__parameters .section-2__progress__parameters_left .section-2__progress__parameters_left-progressbar .section-2__progress__parameters_left-progressbar-img {
        width: 100%;
    }
}
.section-2__progress .section-2__progress__content .section-2__progress__content__left .section-2__progress__parameters .section-2__progress__parameters_left .section-2__progress__parameters_left-progressbar .section-2__progress__parameters_left-progressbar-ratio {
    height: 10px;
    border-radius: 6.25rem;
    background-color: rgb(234, 234, 234);
}
.section-2__progress .section-2__progress__content .section-2__progress__content__left .section-2__progress__parameters .section-2__progress__parameters_left .section-2__progress__parameters_left-progressbar .section-2__progress__parameters_left-progressbar-ratio .section-2__progress__parameters_left-progressbar-ratio-active {
    height: 100%;
    width: 60%;
    background-color: #00dab2;
    border-radius: 6.25rem;
}
@media (max-width: 768px) {
    .section-2__progress .section-2__progress__content .section-2__progress__content__left .section-2__progress__parameters .section-2__progress__parameters_left .section-2__progress__parameters_left-text-head {
        font-size: 20px;
    }
}
@media (max-width: 768px) {
    .section-2__progress .section-2__progress__content .section-2__progress__content__left .section-2__progress__parameters .section-2__progress__parameters_left .section-2__progress__parameters_left-text-title {
        font-size: 14px;
    }
}
.section-2__progress .section-2__progress__content .section-2__progress__content__right {
    background: rgb(255, 255, 255);
}
@media (max-width: 768px) {
    .section-2__progress .section-2__progress__content .section-2__progress__content__right {
        padding: 0 !important;
        width: 100%;
        margin: 15px 0;
    }
}
@media (max-width: 768px) {
    .section-2__progress .section-2__progress__content .section-2__progress__content__right .section-2__progress__content__right-head {
        font-size: 24px;
    }
}
.section-2__progress .section-2__progress__content .section-2__progress__content__right .section-2__progress__content__right-title {
    margin-top: 10px;
}
@media (max-width: 768px) {
    .section-2__progress .section-2__progress__content .section-2__progress__content__right .section-2__progress__content__right-title {
        font-size: 16px;
    }
}
.section-2__progress .section-2__progress__content .section-2__progress__content__right .section-2__progress__content__right-box-link {
    background: rgb(242, 242, 247);
}
.section-2__progress .section-2__progress__content .section-2__progress__content__right .section-2__progress__content__right-box-link .section-2__progress__content__right-link {
    text-decoration-line: underline;
}
@media (max-width: 768px) {
    .section-2__progress .section-2__progress__content .section-2__progress__content__right .section-2__progress__content__right-box-link .section-2__progress__content__right-link {
        font-size: 14px;
    }
}
.section-2__progress .section-2__progress__content .section-2__progress__content__right .section-2__progress__content__right-box-link .section-2__progress__content__right-link .section-2__progress__content__right-link-text {
    color: #575655 !important;
}
@media (max-width: 768px) {
    .section-2__progress .section-2__progress__content .section-2__progress__content__right .section-2__progress__content__right-box-link .section-2__progress__content__right-link .section-2__progress__content__right-link-text {
        font-size: 14px;
    }
}
@media (max-width: 768px) {
    .section-2__progress .section-2__progress__content .section-2__progress__content__right .section-2__progress__content__right-box-link .section-2__progress__content__right-link-button {
        font-size: 12px;
    }
}
.section-2__progress .section-2__progress__content .section-2__progress__content__right .section-2__progress__content__right-bottom .section-2__progress__content__right-bottom-text {
    font-size: 20px;
}
@media (max-width: 768px) {
    .section-2__progress .section-2__progress__content .section-2__progress__content__right .section-2__progress__content__right-bottom .section-2__progress__content__right-bottom-list-icon {
        gap: 16px;
    }
}

.section-3__progress {
    margin: 0 auto;
    background: rgb(255, 255, 255);
    padding: 22px 32px;
}
@media (max-width: 768px) {
    .section-3__progress {
        display: none;
    }
}
.section-3__progress .section-3__progress-table-box {
    border: 0.5px solid #DDDEE1;
}
.section-3__progress .section-3__progress-table-box table.section-3__progress-table,
.section-3__progress .section-3__progress-table-box th.section-3__progress-table-td,
.section-3__progress .section-3__progress-table-box td.section-3__progress-table-td {
    border: 0.5px solid #DDDEE1;
    text-align: center;
}
.section-3__progress .section-3__progress-table-box table.section-3__progress-table,
.section-3__progress .section-3__progress-table-box th.section-3__progress-table-td.section-3__progress-table-td-number,
.section-3__progress .section-3__progress-table-box td.section-3__progress-table-td.section-3__progress-table-td-number {
    text-align: left;
}
.section-3__progress .section-3__progress-table-box .section-3__progress-table {
    width: 100%;
    border-collapse: collapse;
    overflow: hidden;
    font-size: 16px;
    text-align: center;
    border-radius: 10px;
}
.section-3__progress .section-3__progress-table-box .section-3__progress-table thead.section-3__progress-table-head {
    text-align: center;
    font-weight: bold;
}
.section-3__progress .section-3__progress-table-box .section-3__progress-table tbody.section-3__progress-table-body tr.section-3__progress-table-tr {
    border-bottom: 1px solid #dddddd;
}
.section-3__progress .section-3__progress-table-box .section-3__progress-table tbody.section-3__progress-table-body tr.section-3__progress-table-tr:hover {
    background-color: #f1f1f1;
}
.section-3__progress .section-3__progress-table-box .section-3__progress-table th.section-3__progress-table-td,
.section-3__progress .section-3__progress-table-box .section-3__progress-table td.section-3__progress-table-td {
    padding: 12px 16px;
}

.section-4__progress {
    margin: 0 auto;
    background: rgb(255, 255, 255);
    padding: 16px !important;
    display: none;
}
@media (max-width: 768px) {
    .section-4__progress {
        display: block;
    }
}
@media (max-width: 768px) {
    .section-4__progress .section-4__progress-referral .section-4__progress-referral-head {
        font-size: 24px;
    }
}
.section-4__progress .section-4__progress-referral .section-4__progress-referral-list {
    margin-top: 10px;
}
.section-4__progress .section-4__progress-referral .section-4__progress-referral-list .section-4__progress-referral-item {
    background-color: var(--color-suttle);
}
.section-4__progress .section-4__progress-referral .section-4__progress-referral-list .section-4__progress-referral-item .section-4__progress-referral-left .section-4__progress-referral-left-number {
    padding: 10px;
    background-color: var(--color-white);
    border: 1px solid #CBD5E1;
}
@media (max-width: 768px) {
    .section-4__progress .section-4__progress-referral .section-4__progress-referral-list .section-4__progress-referral-item .section-4__progress-referral-left .section-4__progress-referral-left-number {
        font-size: 14px;
        border-radius: 4px;
    }
}
@media (max-width: 768px) {
    .section-4__progress .section-4__progress-referral .section-4__progress-referral-list .section-4__progress-referral-item .section-4__progress-referral-left .section-4__progress-referral-left-info .section-4__progress-referral-left-info-name {
        font-size: 14px;
    }
}
@media (max-width: 768px) {
    .section-4__progress .section-4__progress-referral .section-4__progress-referral-list .section-4__progress-referral-item .section-4__progress-referral-left .section-4__progress-referral-left-info .section-4__progress-referral-left-info-email {
        font-size: 12px;
    }
}
@media (max-width: 768px) {
    .section-4__progress .section-4__progress-referral .section-4__progress-referral-list .section-4__progress-referral-item .section-4__progress-referral-right {
        font-size: 12px;
    }
}

.footer__progress {
    margin: 0 auto;
}
@media (max-width: 768px) {
    .footer__progress {
        border-radius: 0;
        margin-bottom: 0 !important;
    }
}
.footer__progress .footer__progress-box {
    background-color: var(--bg-color-primary);
}
.footer__progress .footer__progress-box .footer__progress-text {
    color: var(--color-white);
}
@media (max-width: 768px) {
    .footer__progress .footer__progress-box .footer__progress-text {
        font-size: 16px;
    }
}

.footer-container {
    background-color: #007862;
}

.footer-text {
    line-height: 64px;
    font-size: 16px;
}

@media (max-width: 768px) {
    .section-1__banner {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }
}
@media (max-width: 768px) {
    .section-1__banner .section-1__banner__content {
        padding: 0 !important;
        background-color: transparent;
        gap: 32px;
    }
}
.section-1__banner .section-1__banner__content .section-1__banner__content__left {
    max-width: 35rem;
    gap: 5.5625rem;
}
@media (max-width: 768px) {
    .section-1__banner .section-1__banner__content .section-1__banner__content__left {
        max-width: 100%;
    }
}
.section-1__banner .section-1__banner__content .section-1__banner__content__left .section-1__banner__content__left__top {
    gap: 2rem;
}
@media (max-width: 768px) {
    .section-1__banner .section-1__banner__content .section-1__banner__content__left .section-1__banner__content__left__top {
        gap: 26px;
    }
}

@media (max-width: 768px) {
    .banner_img {
        display: none;
    }
}

.banner_title {
    line-height: 100%;
}
@media (max-width: 768px) {
    .banner_title {
        font-size: 42px;
        line-height: 50.4px;
    }
}

@media (max-width: 768px) {
    .banner_des {
        font-size: 14px;
        line-height: 21px;
    }
}

.banner_slider_row {
    display: inline-flex;
    align-items: center;
    gap: 1.5rem;
}
@media (max-width: 768px) {
    .banner_slider_row {
        display: flex;
        gap: 7.077px;
        align-self: stretch;
    }
}

.banner_slider_column_img_left {
    gap: 1.5rem;
    flex: 50%;
}
@media (max-width: 768px) {
    .banner_slider_column_img_left {
        flex: 39.069767441%;
        gap: 7.077px;
    }
}

.banner_slider_column_img_right {
    gap: 1.5rem;
    flex: 50%;
}
@media (max-width: 768px) {
    .banner_slider_column_img_right {
        flex: 48%;
    }
}

.section-1__banner__content__right-img-box {
    width: 250px;
    height: -moz-fit-content;
    height: fit-content;
    background-color: var(--color-white);
}
.section-1__banner__content__right-img-box .section-1__banner__content__right-img-tag {
    padding: 3px 16px 0px 194px;
}
.section-1__banner__content__right-img-box .section-1__banner__content__right-img-title {
    padding: 50% 16px 16px 16px;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.1) 54.18%, rgba(0, 0, 0, 0) 100%);
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    bottom: 0;
    color: var(--color-white);
    width: 100%;
}

.section-1__banner__content__right-img-box-mobile {
    width: 100%;
    height: -moz-fit-content;
    height: fit-content;
    background-color: var(--color-white);
}
.section-1__banner__content__right-img-box-mobile .section-1__banner__content__right-img-tag-mobile {
    top: 5px;
    left: 6px;
}
.section-1__banner__content__right-img-box-mobile .section-1__banner__content__right-img-title-mobile {
    padding: 50% 8px 8px 8px;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.1) 54.18%, rgba(0, 0, 0, 0) 100%);
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    bottom: 0;
    color: var(--color-white);
    width: 100%;
    font-size: 12px;
}

.section-1__banner__content__right-img-box-mobile-right {
    width: 100%;
    height: -moz-fit-content;
    height: fit-content;
    background-color: var(--color-white);
}
.section-1__banner__content__right-img-box-mobile-right .section-1__banner__content__right-img-tag-mobile-right {
    top: 5px;
    left: 6px;
}
.section-1__banner__content__right-img-box-mobile-right .section-1__banner__content__right-img-title-mobile-right {
    padding: 50% 8px 10px 8px;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.1) 54.18%, rgba(0, 0, 0, 0) 100%);
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    bottom: 0;
    color: var(--color-white);
    width: 100%;
    font-size: 14px;
}

.banner_slider_img {
    width: 100%;
    border-radius: 0.625rem;
    align-self: stretch;
}
@media (max-width: 768px) {
    .banner_slider_img_extra {
        padding: 12.22px 0px 0.78px 0px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
}

.banner_slider_img_extra_mobile {
    display: none;
}
@media (max-width: 768px) {
    .banner_slider_img_extra_mobile {
        display: flex;
    }
}

@media (max-width: 768px) {
    .banner_slider_img_extra_desktop {
        display: none;
    }
}

.coming-container {
    background-color: var(--color-primary-1000);
    border-radius: 24px;
}
.coming-container .coming-wrapper {
    padding: 76px 36px 79px 68px;
    max-width: 1400px;
    gap: 1.5rem;
}
@media (max-width: 768px) {
    .coming-container .coming-wrapper {
        flex-direction: column;
        padding: 19px;
        gap: 30.5px;
    }
}
@media (max-width: 768px) {
    .coming-container .coming-wrapper .vietnam {
        width: 57px;
        height: 43px;
    }
}
.coming-container .coming-wrapper .coming-soon-title {
    color: var(--color-white);
    line-height: 2.4rem;
}
@media (max-width: 768px) {
    .coming-container .coming-wrapper .coming-soon-title {
        font-size: 24px;
    }
}
.coming-container .coming-wrapper .coming-soon-des {
    color: var(--color-white);
    line-height: 3.9rem;
}
@media (max-width: 768px) {
    .coming-container .coming-wrapper .coming-soon-des {
        font-size: 32px;
    }
}
.coming-container .coming-wrapper .button-square {
    width: 90%;
    z-index: 2;
}
@media (max-width: 768px) {
    .coming-container .coming-wrapper .button-square {
        width: 100%;
    }
}
.coming-container .coming-wrapper .button-square .button-title {
    line-height: 120%;
    color: var(--color-sub-text-2);
}
@media (max-width: 768px) {
    .coming-container .coming-wrapper .button-square .button-title {
        font-size: 24px;
    }
}
@media (max-width: 768px) {
    .coming-container .coming-wrapper .image-container img {
        width: 88px;
        height: 88px;
    }
}
.coming-container .coming-wrapper .image-container .right-title {
    color: var(--color-white);
}
@media (max-width: 768px) {
    .coming-container .coming-wrapper .image-container .right-title {
        font-size: 24px;
    }
}
.coming-container .coming-wrapper .image-container .section-4__coming-credit {
    width: 170px;
    height: 170px;
    border-radius: 1000px;
    padding: 24px;
    background-color: var(--color-white);
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    overflow: hidden;
    flex-shrink: 0;
}
@media (max-width: 768px) {
    .coming-container .coming-wrapper .image-container .section-4__coming-credit {
        width: 81px;
        height: 81px;
        padding: 11.44px;
    }
}
.coming-container .coming-wrapper .image-container .section-4__coming-credit .section-4__coming-credit-1000 {
    white-space: nowrap;
    margin-bottom: 8px;
}
@media (max-width: 768px) {
    .coming-container .coming-wrapper .image-container .section-4__coming-credit .section-4__coming-credit-1000 {
        margin-bottom: 3.8px;
        font-size: 11.435px;
    }
}
.coming-container .coming-wrapper .image-container .section-4__coming-credit .section-4__coming-credit-icon1 {
    top: -8px;
    left: 7px;
}
@media (max-width: 768px) {
    .coming-container .coming-wrapper .image-container .section-4__coming-credit .section-4__coming-credit-icon1 {
        left: 3.335px !important;
        top: -3.812px !important;
        width: 24.418px;
        height: 24.418px;
    }
}
.coming-container .coming-wrapper .image-container .section-4__coming-credit .section-4__coming-credit-icon2 {
    right: 10.787px;
    bottom: -11.213px;
}
@media (max-width: 768px) {
    .coming-container .coming-wrapper .image-container .section-4__coming-credit .section-4__coming-credit-icon2 {
        right: 5.14px !important;
        bottom: -5.343px !important;
        width: 26.234px;
        height: 26.234px;
        transform: rotate(30deg);
    }
}
.coming-container .coming-wrapper .coming-pattern {
    top: 11rem;
    left: 15%;
    z-index: 1;
}
@media (max-width: 768px) {
    .coming-container .coming-wrapper .coming-pattern {
        top: 43%;
        left: 68%;
        scale: 1.5;
    }
}
.coming-container .coming-wrapper .coming-coin {
    top: 1rem;
    left: 40%;
}
@media (max-width: 768px) {
    .coming-container .coming-wrapper .coming-coin {
        display: none;
    }
}
.coming-container .coming-wrapper .coming-mage-coin {
    position: absolute;
    bottom: 1%;
    right: 0%;
}
@media (max-width: 768px) {
    .coming-container .coming-wrapper .coming-mage-coin {
        position: unset;
        align-self: flex-end;
    }
}
.coming-container .coming-wrapper .right-des {
    color: var(--color-white);
}
@media (max-width: 768px) {
    .coming-container .coming-wrapper .right-des {
        font-size: 20px;
        font-weight: 500;
    }
}

.earn-1000 {
    color: var(--color-sub-text-2);
}

.section-5__earn {
    padding: 1.25rem;
}
.section-5__earn .section-5__earn-box {
    padding: 5.188rem 3.75rem;
}
.section-5__earn .section-5__earn-box .section-5__earn-head-shop4free {
    color: var(--color-primary-1000);
}
@media (max-width: 768px) {
    .section-5__earn .section-5__earn-box {
        padding: 0;
        margin-bottom: 67px;
    }
}
.section-5__earn .section-5__earn-box .section-5__earn-list {
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 23px;
}
@media (max-width: 768px) {
    .section-5__earn .section-5__earn-box .section-5__earn-list {
        flex-direction: column;
        gap: 67px;
    }
}
.section-5__earn .section-5__earn-box .section-5__earn-list .section-5__earn-list-item {
    min-width: 395px;
    min-height: 426px;
    width: calc(33.3333333333% - 16px);
    background-color: rgb(242, 242, 247);
    padding: 32px 24px 50px 24px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}
@media (max-width: 768px) {
    .section-5__earn .section-5__earn-box .section-5__earn-list .section-5__earn-list-item {
        width: 100%;
        min-width: 100%;
        min-height: 100%;
    }
}
.section-5__earn .section-5__earn-box .section-5__earn-list .section-5__earn-list-item .section-5__earn-list-item-img {
    margin-bottom: 12px;
    width: 100%;
}
.section-5__earn .section-5__earn-box .section-5__earn-list .section-5__earn-list-item .section-5__earn-list-item-name {
    text-align: center;
}
@media (max-width: 768px) {
    .section-5__earn .section-5__earn-box .section-5__earn-list .section-5__earn-list-item .section-5__earn-list-item-name {
        font-size: 24px;
    }
}
.section-5__earn .section-5__earn-btn-box {
    margin-bottom: 83px;
}
.section-5__earn .section-5__earn-btn-box .section-5__earn-btn {
    min-width: 460px;
    padding: 2rem;
}
@media (max-width: 768px) {
    .section-5__earn .section-5__earn-btn-box .section-5__earn-btn {
        min-width: 100%;
        padding: 16px 24px;
    }
}
.section-5__earn .section-5__earn-btn-box .section-5__earn-btn .section-5__earn-btn-content-title {
    gap: 2rem;
}
@media (max-width: 768px) {
    .section-5__earn .section-5__earn-btn-box .section-5__earn-btn .section-5__earn-btn-content-title {
        gap: 32px;
    }
}
.section-5__earn .section-5__earn-btn-box .section-5__earn-btn .section-5__earn-btn-content-title .section-5__earn-1000 {
    color: var(--color-white) !important;
}
@media (max-width: 768px) {
    .section-5__earn .section-5__earn-btn-box .section-5__earn-btn .section-5__earn-btn-content-title .section-5__earn-1000 {
        font-size: 16px;
    }
}
.section-5__earn .section-5__earn-btn-box .section-5__earn-btn .section-5__earn-btn-content-title .button-title {
    line-height: 120%;
    color: var(--color-white);
}
@media (max-width: 768px) {
    .section-5__earn .section-5__earn-btn-box .section-5__earn-btn .section-5__earn-btn-content-title .button-title {
        font-size: 24px;
    }
}