@charset "utf-8";

:root {
    /* color */
    --color-black: #000;
    --color-white: #fff;
    --color-blue: #174aa3;
    --color-skyblue: #00C8FF;
    --color-lightblue: #F5F9FF;
    --color-green: #009944;
    --color-red: #E71F18;
    --color-burgundy: #B51611;
    --color-gray: #f8f9fa;
    --color-gray1: #f1f3f5;
    --color-gray2: #e9ecef;
    --color-gray3: #dee2e6;
    --color-gray4: #ced4da;
    --color-gray5: #adb5bd;
    --color-gray6: #868e96;
    --color-gray7: #495057;
    --color-gray8: #343a40;
    --color-gray9: #212529;

    /*  font-family */
    --font-Pretendard: 'Pretendard', sans-serif;
    --font-NotoSansSC: 'Noto_Sans_SC', sans-serif;
    --font-WAGURI: 'WAGURITTF';

    /* rem */
    --rem-10: 0.6rem;
    --rem-13: 1.3rem;
    --rem-14: 1.4rem;
    --rem-15: 1.5rem;
    --rem-16: 1.6rem;
    --rem-17: 1.7rem;
    --rem-18: 1.8rem;
    --rem-19: 1.9rem;
    --rem-20: 2rem;
    --rem-21: 2.1rem;
    --rem-22: 2.2rem;
    --rem-23: 2.3rem;
    --rem-24: 2.4rem;
    --rem-25: 2.5rem;
    --rem-26: 2.6rem;
    --rem-27: 2.7rem;
    --rem-28: 2.8rem;
    --rem-30: 3rem;
    --rem-33: 3.3rem;
    --rem-34: 3.4rem;
    --rem-35: 3.5rem;
    --rem-40: 4rem;
    --rem-45: 4.5rem;
    --rem-50: 5rem;
    --rem-55: 5.5rem;
    --rem-32: 32rem;
    --rem-60: 6rem;
    --rem-65: 6.5rem;
    --rem-70: 7rem;

    /* px */
    --px-base: 1310px;
    --px-14: 14px;
    --px-15: 15px;
    --px-16: 16px;
    --px-17: 17px;
    --px-18: 18px;
    --px-20: 20px;
    --px-25: 25px;
    --px-26: 26px;
    --px-30: 30px;

    /* font-weight */
    --font-lg: 300;
    --font-rg: 400;
    --font-md: 500;
    --font-sb: 600;
    --font-bd: 700;
    --font-eb: 800;

    /* text-align */
    --text-ag-left: left;
    --text-ag-right: right;
    --text-ag-center: center;
}



/* 모바일CSS */
@media screen and (max-width: 1800px) {
    :root {
        --spacing: 3rem;
        /*--header-hei: 8.6rem;
		--sub-visual-hei: 24rem;*/
    }
}

@media screen and (max-width: 1700px) {
    :root {
        --spacing: 2.5rem;
        /*--header-hei: 8.6rem;
		--sub-visual-hei: 24rem;*/
    }
}

@media screen and (max-width: 1640px) {
    :root {
        /*Common*/
        --header-hei: 10rem;
    }
}

@media screen and (max-width: 1280px) {
    :root {
        --spacing: 2rem;
        /*--header-hei: 8.6rem;
		--sub-visual-hei: 24rem;*/
    }
}

@media screen and (max-width: 1024px) {
    :root {
        /*Common*/
        --header-hei: 8rem;
    }
}


@media screen and (max-width: 800px) {
    :root {
        --spacing: 1.5rem;
        /*--header-hei: 4.4375rem;
		--sub-visual-hei: 20rem;*/
    }
}