@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

@font-face {
    font-family: 'Pretendard';
    src:url('../font/Pretendard-Thin.woff2') format('woff2'),
        url('../font/Pretendard-Thin.woff') format('woff'),
        url('../font/Pretendard-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src:url('../font/Pretendard-ExtraLight.woff2') format('woff2'),
        url('../font/Pretendard-ExtraLight.woff') format('woff'),
        url('../font/Pretendard-ExtraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src:url('../font/Pretendard-Light.woff2') format('woff2'),
        url('../font/Pretendard-Light.woff') format('woff'),
        url('../font/Pretendard-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src:url('../font/Pretendard-Regular.woff2') format('woff2'),
        url('../font/Pretendard-Regular.woff') format('woff'),
        url('../font/Pretendard-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src:url('../font/Pretendard-Medium.woff2') format('woff2'),
        url('../font/Pretendard-Medium.woff') format('woff'),
        url('../font/Pretendard-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src:url('../font/Pretendard-SemiBold.woff2') format('woff2'),
        url('../font/Pretendard-SemiBold.woff') format('woff'),
        url('../font/Pretendard-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src:url('../font/Pretendard-Bold.woff2') format('woff2'),
        url('../font/Pretendard-Bold.woff') format('woff'),
        url('../font/Pretendard-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src:url('../font/Pretendard-ExtraBold.woff2') format('woff2'),
        url('../font/Pretendard-ExtraBold.woff') format('woff'),
        url('../font/Pretendard-ExtraBold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src:url('../font/Pretendard-Black.woff2') format('woff2'),
        url('../font/Pretendard-Black.woff') format('woff'),
        url('../font/Pretendard-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

/* 폰트굵기 */
.f100 {
    font-weight:100 !important
}
.f200 {
    font-weight:200 !important
}
.f300 {
    font-weight:300 !important
}
.f400 {
    font-weight:400 !important
}
.f500 {
    font-weight:500 !important
}
.f600 {
    font-weight:600 !important
}
.f700 {
    font-weight:700 !important
}
.f800 {
    font-weight:800 !important
}
.f900 {
    font-weight:900 !important
}


/* 폰트자간 */
.letter02 {
    letter-spacing: 0.02em !important;
}
.letter03 {
    letter-spacing: 0.03em !important;
}
.letter04 {
    letter-spacing: 0.04em !important;
}


/* 폰트크기 */
.f13 {
    font-size: 13px !important;
}
.f14 {
    font-size: 0.875rem !important;
}
.f15 {
    font-size: 0.9375rem !important;
}
.f16 {
    font-size: 1rem !important;
}
.f17 {
    font-size: 17px !important;
}
.f18 {
    font-size: 1.125rem !important;
}
.f19 {
    font-size: 19px !important;
}
.f20 {
    font-size: 1.25rem !important;
}

/*폰트정렬*/
.f_left {
    text-align: left !important;
}
.f_center {
    text-align: center !important;
}
.f_right {
    text-align: right !important;
}

.flex {
    display: flex;
}
.flex_center {
    display: flex;
    justify-content: center;
}
.flex_between {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.flex_center {
    display: flex;
    justify-content: center;
}
.flex_total {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.flex_acenter {
    display: flex;
    align-items: center;
}