@charset "utf-8";

/*
	** 기본 공통 CSS
*/


@font-face {
	font-family: "Pretendard-Regular";
	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: "SBAggro";
    src: url("https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SBAggroM.woff") format("woff");
    font-weight: 400;
    font-style: normal;
}

:root {
	--primary-color: #00802A;
	--secondary-color: #88BDA3;
	--height: 150px;
	--font-size-60: 1.36em;
	--font-size-56: 1.27em;
	--font-size-52: 1.18em;
	--font-size-48: 1.09em;
	--font-size-44: 1em;
	--font-size-40: .90em;
	--font-size-32: .72em;
	--font-size-28: .63em;
	--space-xs: 10px;
	--space-sm: 20px;
	--space-md: 40px;
	--space-lg: 60px;
	--border-radius: 5px;
	--transition: 0.2s ease-in-out;
}

html, input, select, textarea, button {font-family: "Pretendard-Regular", 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: #AAAAAA; }
.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; }

.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; }