@charset "utf-8";

/*
	** 기본 공통 CSS
*/


@font-face {
	font-family: "Pretendard";
	src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Light.woff") format("woff");
	font-weight: 300;
	font-style: normal;
}
@font-face {
	font-family: "Pretendard";
	src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff") format("woff");
	font-weight: 400;
	font-style: normal;
}
@font-face {
	font-family: 'S-CoreDream';
	src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-6Bold.woff') format('woff');
	font-weight: 600;
	font-style: normal;
}
@font-face {
    font-family: 'SEBANG_Gothic';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2104@1.0/SEBANG_Gothic_Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}

:root {
	--primary-color: #1B84FF;
	--secondary-color: #9c9c9c;
	--height: 50px;
	--font-size-30: 1.85em;
	--font-size-28: 1.75em;
	--font-size-26: 1.65em;
	--font-size-24: 1.5em;
	--font-size-22: 1.4em;
	--font-size-20: 1.25em;
	--font-size-18: 1.125em;
	--font-size-17: 1.125em;
	--font-size-17: 1.062em;
	--font-size-16: 1em;
	--font-size-15: .95em;
	--font-size-14: .88em;
	--font-size-13: .82em;
	--space-xs: 10px;
	--space-sm: 20px;
	--space-md: 40px;
	--space-lg: 60px;
	--border-radius: 5px;
	--transition: 0.25s ease-in-out;
}
@media all and (max-width: 1023px) {
	:root {--height: 45px;}
}
@media all and (max-width: 767px) {
	:root {--height: 40px;}
}

html, input, select, textarea, button {font-family: "Pretendard", sans-serif;}
html,
input,
select,
textarea,
button { letter-spacing: -0.5px; }
.font-bold { font-weight: 600; }
.font-underline { text-decoration: underline; }
.font-italic { font-style: italic; }
.color-primary { color: var(--primary-color); }
.color-secondary { color: var(--secondary-color); }
.color-gray { color: #878d91; }
.color-warning { color: #f24147; }
.bg-primary { background-color: var(--primary-color); }
.bg-secondary { background-color: var(--secondary-color); }
.bg-gray { background-color: #eee; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.block { display: block; }
.t-block,
.m-block,
.hide { display: none; }
.flex { display: flex; }
.inline-block { display: inline-block; }
.inline-flex { display: inline-flex; }
.vt-top { vertical-align: top; }
.vt-bottom { vertical-align: bottom; }
.vt-center { vertical-align: center; }
.ellipsis-1 { overflow: hidden; text-overflow: ellipsis; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.ellipsis-2 { overflow: hidden; text-overflow: ellipsis; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
@media all and (max-width:1023px) {
	.t-block { display: block; }
}
@media all and (max-width:767px) {
	.m-block { display: block; }
}

.mt-5 { margin-top: 5px; }
.mt-10 { margin-top: 10px; }
.mt-15 { margin-top: 15px; }
.mt-20 { margin-top: 20px; }
.mt-25 { margin-top: 25px; }
.mt-30 { margin-top: 30px; }
.mt-35 { margin-top: 35px; }
.mt-40 { margin-top: 40px; }
.mt-45 { margin-top: 45px; }
.mt-50 { margin-top: 50px; }
.mb-5 { margin-bottom: 5px; }
.mb-10 { margin-bottom: 10px; }
.mb-15 { margin-bottom: 15px; }
.mb-20 { margin-bottom: 20px; }
.mb-25 { margin-bottom: 25px; }
.mb-30 { margin-bottom: 30px; }
.mb-35 { margin-bottom: 35px; }
.mb-40 { margin-bottom: 40px; }
.mb-45 { margin-bottom: 45px; }
.mb-50 { margin-bottom: 50px; }
.ml-5 { margin-left: 5px; }
.ml-10 { margin-left: 10px; }
.ml-15 { margin-left: 15px; }
.ml-20 { margin-left: 20px; }
.ml-25 { margin-left: 25px; }
.ml-30 { margin-left: 30px; }
.ml-35 { margin-left: 35px; }
.ml-40 { margin-left: 40px; }
.ml-45 { margin-left: 45px; }
.ml-50 { margin-left: 50px; }
.mr-5 { margin-right: 5px; }
.mr-10 { margin-right: 10px; }
.mr-15 { margin-right: 15px; }
.mr-20 { margin-right: 20px; }
.mr-25 { margin-right: 25px; }
.mr-30 { margin-right: 30px; }
.mr-35 { margin-right: 35px; }
.mr-40 { margin-right: 40px; }
.mr-45 { margin-right: 45px; }
.mr-50 { margin-right: 50px; }
.pt-5 { padding-top: 5px; }
.pt-10 { padding-top: 10px; }
.pt-15 { padding-top: 15px; }
.pt-20 { padding-top: 20px; }
.pt-25 { padding-top: 25px; }
.pt-30 { padding-top: 30px; }
.pt-35 { padding-top: 35px; }
.pt-40 { padding-top: 40px; }
.pt-45 { padding-top: 45px; }
.pt-50 { padding-top: 50px; }
.pb-5 { padding-bottom: 5px; }
.pb-10 { padding-bottom: 10px; }
.pb-15 { padding-bottom: 15px; }
.pb-20 { padding-bottom: 20px; }
.pb-25 { padding-bottom: 25px; }
.pb-30 { padding-bottom: 30px; }
.pb-35 { padding-bottom: 35px; }
.pb-40 { padding-bottom: 40px; }
.pb-45 { padding-bottom: 45px; }
.pb-50 { padding-bottom: 50px; }
.pl-5 { padding-left: 5px; }
.pl-10 { padding-left: 10px; }
.pl-15 { padding-left: 15px; }
.pl-20 { padding-left: 20px; }
.pl-25 { padding-left: 25px; }
.pl-30 { padding-left: 30px; }
.pl-35 { padding-left: 35px; }
.pl-40 { padding-left: 40px; }
.pl-45 { padding-left: 45px; }
.pl-50 { padding-left: 50px; }
.pr-5 { padding-right: 5px; }
.pr-10 { padding-right: 10px; }
.pr-15 { padding-right: 15px; }
.pr-20 { padding-right: 20px; }
.pr-25 { padding-right: 25px; }
.pr-30 { padding-right: 30px; }
.pr-35 { padding-right: 35px; }
.pr-40 { padding-right: 40px; }
.pr-45 { padding-right: 45px; }
.pr-50 { padding-right: 50px; }