/*@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css"); */

:root { 
 --base0: #000000; 
 --base1: #2d2d2d; 
 --base2: #444444; 
 --base3: #666666; 
 --base4: #8c8c8c; 
 --base5: #a4a4a4; 
 --base6: #b2b2b2; 
 --base7: #c4c4c4; 
 --base8: #e0e0e0; 
 --base9: #f4f4f4; 
 --base10: #ffffff; 
 --variant: #5a5e67;
 --success: #2bb6aa; 
 --red: #E01520; 
 --accent: #0D6EFD; 
 --dark-red: #E01520; 
 --green: #00C853; 
 --danger: #F13218;
 --primary: #D8155C;
 --primary-disabled: #EFD8DF;
 --secondary: #FFCE06;
 --white: white;
 --black: #000000;
 --black-950: #262626;
 --black-900: #3D3D3D;
 --black-800: #454545;
 --black-700: #4F4F4F;
 --black-600: #5D5D5D;
 --black-500: #6D6D6D;
 --black-400: #888888;
 --black-300: #B0B0B0;
 --black-200: #D1D1D1;
 --black-100: #E7E7E7;
 --black-50: #F6F6F6;
 --font-sans-serif: "Pretendard", sans-serif;
 --text-xxl: 24px;
 --text-xl: 20px;
 --text-lg: 16px;
 --text-md: 14px;
 --text-sm: 13px;
 --text-mn: 12px;
 --gt-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
 --bs-gutter-x: 20px;
 --bs-gutter-y: 20px;
 --footer-height: 140px;
 --footer-mo-height: 230px;
 }

:root {

}

body { padding-right: 0 !important; width: 100%; box-sizing: border-box; overflow-x: hidden; margin: 0; padding: 0; display: flex; flex-direction: column; min-height: 100vh; } 
body * { font-family: "Pretendard"; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-touch-callout: none; margin: 0; padding: 0; box-sizing: border-box; word-break: keep-all; color: #000; } 
input, textarea { width: 100%; font-size: 14px; line-height: 20px; color: var(--base0); border: 0; outline: none; resize: none; background-color: transparent; } 
a { text-decoration: none; } 
a:hover { color: inherit; } 
input::placeholder, textarea::placeholder { color: var(--base6); } 
input:-webkit-autofill, textarea:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px white inset; box-shadow: 0 0 0 1000px white inset; } 
input:-webkit-autofill:active, textarea:-webkit-autofill:active { -webkit-text-fill-color: #000; text-fill-color: #000; } 
input:-internal-autofill-selected, textarea:-internal-autofill-selected { background-color: var(--base10) !important; } 
.btn-check:focus+.btn, .btn:focus { box-shadow: unset; } 

@media (min-width: 768px){
    body {overflow-y: auto !important;}
}

/* FONT STYLE */
.roboto { font-family: 'Roboto', sans-serif !important; } 

/* FONT WEIGHT */
.text-weight-regular { font-weight: 400; } 
.text-weight-medium { font-weight: 500; } 
.text-weight-semibold { font-weight: 600; } 
.text-weight-bold { font-weight: 700; } 
 
/* FONT SIZE */
.t10 { font-size: 10px; line-height: 12px; } 
.t12 { font-size: 12px; line-height: 16px; } 
.t13 { font-size: 13px; line-height: 18px; } 
.t14 { font-size: 14px; line-height: 20px; } 
.t15 { font-size: 15px; line-height: 22px; } 
.t16 { font-size: 16px; line-height: 24px; } 
.t18 { font-size: 18px; line-height: 26px; } 
.t20 { font-size: 20px; line-height: 28px; } 
.t22 { font-size: 22px; line-height: 30px; } 
.t24 { font-size: 24px; line-height: 32px; } 
.t28 { font-size: 28px; line-height: 34px; } 
.t30 { font-size: 30px; line-height: 34px; } 
.t32 { font-size: 32px; line-height: 36px; } 
.t36 { font-size: 36px; line-height: 44px; } 
.t40 { font-size: 40px; line-height: 40px; } 
.t44 { font-size: 44px; line-height: 54px; } 
.t48 { font-size: 48px; line-height: 56px; } 
.t60 { font-size: 60px; line-height: 56px; }

/* INDENT*/
.ti1 { text-indent: 1em;}
.ti2 { text-indent: 2em;}


/* TEXT-ALIGN */
.text-left { text-align: left; } 
.text-center { text-align: center; } 
.text-right { text-align: right; } 
.text-no-wrap { white-space: nowrap; } 
.text-underline { text-decoration: underline; text-underline-offset: 2px; } 
.ellipsis { width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 
.ellipsis-2-lines { width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } 

/* TEXT COLOR */
.text-primary { color: var(--primary) !important; } 
.text-variant { color: var(--variant) !important; } 
.text-success { color: var(--success) !important; } 
.text-red { color: var(--red) !important; } 
.text-green { color: var(--green) !important; } 
.text-danger { color: var(--danger) !important; } 
.text-accent { color: var(--accent) !important; } 
.text-dark-red { color: var(--dark-red) !important; } 
.text-base0 { color: var(--base0) !important; } 
.text-base1 { color: var(--base1) !important; } 
.text-base2 { color: var(--base2) !important; } 
.text-base3 { color: var(--base3) !important; } 
.text-base4 { color: var(--base4) !important; } 
.text-base5 { color: var(--base5) !important; } 
.text-base6 { color: var(--base6) !important; } 
.text-base7 { color: var(--base7) !important; } 
.text-base8 { color: var(--base8) !important; } 
.text-base9 { color: var(--base9) !important; } 
.text-base10 { color: var(--base10) !important; } 


/* BACKGROUND COLOR */
.bg-transparent { background: transparent !important; } 
.bg-red { background: var(--red) !important; } 
.bg-primary { background: var(--primary) !important; } 
.bg-base0 { background: var(--base0) !important; } 
.bg-base1 { background: var(--base1) !important; } 
.bg-base7 { background: var(--base7) !important; } 
.bg-base8 { background: var(--base8) !important; } 
.bg-base9 { background: var(--base9) !important; } 
.bg-base10 { background: var(--base10) !important; } 


/* POSITION */
.relative { position: relative; } 
.absolute { position: absolute; } 
.absolute-center { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } 
.absolute-top-left { position: absolute; top: 0; left: 0; } 
.absolute-top-right { position: absolute; top: 0; right: 0; } 
.absolute-bottom-left { position: absolute; bottom: 0; left: 0; } 
.absolute-bottom-right { position: absolute; bottom: 0; right: 0; } 
.fixed { position: fixed; } 
.sticky { position: sticky; } 
.z-index-1 { z-index: 1; } 


/* DISPLAY */
.flex { display: flex; } 
.block { display: block; } 
.grid { display: grid; } 
.hidden { display: none; } 

/* FLEX */
.wrap { flex-wrap: wrap; } 
.grow-1 { flex-grow: 1; } 
.shrink-0 { flex-shrink: 0; } 
.column { display: flex; flex-direction: column; flex-wrap: nowrap; } 
.items-start { align-items: flex-start; } 
.items-center { align-items: center; } 
.items-end { align-items: flex-end; } 
.justify-end { justify-content: flex-end; } 
.flex-start { display: flex; align-items: flex-start; justify-content: flex-start; } 
.flex-center { display: flex; align-items: center; justify-content: center; } 
.start-between { display: flex; align-items: flex-start; justify-content: space-between; } 
.center-start { display: flex; align-items: center; justify-content: flex-start; } 
.center-between { display: flex; align-items: center; justify-content: space-between; } 
.end-between { display: flex; align-items: flex-end; justify-content: space-between; } 


/* ROW-GAP */
.row-2 { display: flex; flex-direction: column; row-gap: 2px; } 
.row-4 { display: flex; flex-direction: column; row-gap: 4px; } 
.row-6 { display: flex; flex-direction: column; row-gap: 6px; } 
.row-8 { display: flex; flex-direction: column; row-gap: 8px; } 
.row-10 { display: flex; flex-direction: column; row-gap: 10px; } 
.row-12 { display: flex; flex-direction: column; row-gap: 12px; } 
.row-16 { display: flex; flex-direction: column; row-gap: 16px; } 
.row-20 { display: flex; flex-direction: column; row-gap: 20px; } 
.row-24 { display: flex; flex-direction: column; row-gap: 24px; } 
.row-32 { display: flex; flex-direction: column; row-gap: 32px; } 
.row-40 { display: flex; flex-direction: column; row-gap: 40px; } 
.row-46 { display: flex; flex-direction: column; row-gap: 46px; } 
.row-52 { display: flex; flex-direction: column; row-gap: 52px; } 
.row-60 { display: flex; flex-direction: column; row-gap: 60px; } 
.row-64 { display: flex; flex-direction: column; row-gap: 64px; } 
.row-72 { display: flex; flex-direction: column; row-gap: 72px; } 
.row-80 { display: flex; flex-direction: column; row-gap: 80px; } 
.row-120 { display: flex; flex-direction: column; row-gap: 120px; } 

/* COLUMN-GAP */
.column-2 { display: flex; column-gap: 2px; } 
.column-4 { display: flex; column-gap: 4px; } 
.column-6 { display: flex; column-gap: 6px; } 
.column-8 { display: flex; column-gap: 8px; } 
.column-10 { display: flex; column-gap: 10px; } 
.column-12 { display: flex; column-gap: 12px; } 
.column-14 { display: flex; column-gap: 14px; } 
.column-16 { display: flex; column-gap: 16px; } 
.column-20 { display: flex; column-gap: 20px; } 
.column-24 { display: flex; column-gap: 24px; } 
.column-28 { display: flex; column-gap: 28px; } 
.column-30 { display: flex; column-gap: 30px; } 
.column-32 { display: flex; column-gap: 32px; } 
.column-34 { display: flex; column-gap: 34px; } 
.column-40 { display: flex; column-gap: 40px; } 
.column-52 { display: flex; column-gap: 52px; } 
.column-68 { display: flex; column-gap: 68px; } 
.column-80 { display: flex; column-gap: 80px; } 
.column-100 { display: flex; column-gap: 100px; } 


/* BORDER */
.border { border: 1px solid var(--base8) !important; } 
.rounded-xs { border-radius: 4px !important; } 
.rounded-sm { border-radius: 8px !important; } 
.rounded-md { border-radius: 16px !important; } 
.rounded-lg { border-radius: 20px !important; } 
.rounded-xl { border-radius: 32px !important; } 
.rounded-circle { border-radius: 50% !important; } 
.rounded-pill { border-radius: 200px !important; } 
.no-radius { border-radius: 0 !important; } 

/* WIDTH */
.full-width { width: 100%; } 
.full-height { height: 100%; } 
.fit { width: 100%; height: 100%; }
.max-12 {width: 12px; min-width: 12px; max-width: 12px;}
.max-14 {width: 14px; min-width: 14px; max-width: 14px;}
.max-16 {width: 16px; min-width: 16px; max-width: 16px;}
.max-18 {width: 18px; min-width: 18px; max-width: 18px;}
.max-20 {width: 20px; min-width: 20px; max-width: 20px;}
.max-24 {width: 24px; min-width: 24px; max-width: 24px;}
.max-28 {width: 28px; min-width: 28px; max-width: 28px;}
.max-30 {width: 30px; min-width: 30px; max-width: 30px;}
.max-32 {width: 32px; min-width: 32px; max-width: 32px;}
.max-36 {width: 36px; min-width: 36px; max-width: 36px;}
.max-38 {width: 38px; min-width: 38px; max-width: 38px;}
.max-44 {width: 44px; min-width: 44px; max-width: 44px;}
.max-48 {width: 48px; min-width: 48px; max-width: 48px;}
.max-56 {width: 56px; min-width: 56px; max-width: 56px;}
.max-64 {width: 64px; min-width: 64px; max-width: 64px;}
.max-68 {width: 68px; min-width: 68px; max-width: 68px;}
.max-70 {width: 70px; min-width: 70px; max-width: 70px;}
.max-72 {width: 72px; min-width: 72px; max-width: 72px;}
.max-74 {width: 74px; min-width: 74px; max-width: 74px;}
.max-78 {width: 78px; min-width: 78px; max-width: 78px;}
.max-80 {width: 80px; min-width: 80px; max-width: 80px;}
.max-85 {width: 85px; min-width: 85px; max-width: 85px;}
.max-100 {width: 100px; min-width: 100px; max-width: 100px;}
.max-104 {width: 104px; min-width: 104px; max-width: 104px;}
.max-114 {width: 114px; min-width: 114px; max-width: 114px;}
.max-120 {width: 120px; min-width: 120px; max-width: 120px;}
.max-122 {width: 122px; min-width: 122px; max-width: 122px;}
.max-135 {width: 135px; min-width: 135px; max-width: 135px;}
/* IMAGE */
.object-cover { object-fit: cover; aspect-ratio: 1; object-position: center; } 
.overflow-hidden { overflow: hidden; } 
.pointer { cursor: pointer; } 


/* SPACE */
.mt-auto { margin-top:auto; } 
.mx-auto { margin-left:auto; margin-right:auto; }

/* SCROLL*/

.scroll_x { overflow-x: auto !important;}


.modal-backdrop { z-index: 1051}

@media (max-width: 767px) {
 .modal-backdrop { z-index: 1040}
}