@charset "UTF-8";

/* ====================================================
   FONT FACE
==================================================== */
@font-face {
	font-family: 'Pretendard Variable';
	font-weight: 45 920;
	font-style: normal;
	font-display: swap;
	src: url('/library/css/fonts/woff2/PretendardVariable.woff2') format('woff2-variations');
}


/* ====================================================
   BASE RESET
==================================================== */
*, *::before, *::after {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html {
  /* °¡À̵å Á¤ÇØÁö¸é ÆùÆ® Àû¿ëÇصαâ */
	/* font-size: clamp(16px, 1.066vw, 18px); */
	-webkit-text-size-adjust: none;
}

body {
	font-family: 'Pretendard Variable', 'Malgun Gothic', 'Noto Sans KR', dotum;
	font-weight: normal;
	color: #222;
	word-break: keep-all;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

body, div, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, p, form, fieldset, input, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
}

h1, h2, h3, h4, h5, p {
	margin: 0;
}

ul, ol, li {
	list-style: none;
}

img, svg, video, fieldset {
	/* max-width: 100%;
	height: auto;
	display: block;
	vertical-align: middle;
	border: none; */
}

a {
	text-decoration: none;
	color: inherit;
	display: inline-block;
}

a:hover, a:focus, a:active, a:visit {
	text-decoration: none;
}

table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
}

table td, table th {
	vertical-align: top;
}

button {
	margin: 0;
	padding: 0;
	border: none;
	background: none;
	cursor: pointer;
	font-family: inherit;
	color: inherit;
}

em {
	font-style: normal;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}

pre {
	white-space: pre-wrap;
	word-wrap: break-word;
}

textarea, button, input, select, pre {
	color: #333;
	font-family: 'Pretendard Variable', 'Malgun Gothic', 'Noto Sans KR', dotum;
	font-weight: normal;
	-webkit-text-size-adjust: none;
}


/* ====================================================
   TYPOGRAPHY
==================================================== */
/* ÆùÆ®´Â µðÀÚÀÎ °¡ÀÌµå ¿Ï·á ÈÄ ¼öÄ¡ Àû¿ë */

/* ¸ÞÀΠŸÀÌƲ (°­Á¶¿ë) */
.h1, h1 {
	/* font-size: clamp(26px, 4vw, 42px);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.02em; */
}

/* ¼½¼Ç ŸÀÌƲ */
.h2, h2 {
	/* font-size: clamp(22px, 3.2vw, 32px);
	font-weight: 700;
	line-height: 1.3; */
}

/* ¼ÒÁ¦¸ñ / ¸®½ºÆ® Á¦¸ñ */
.h3, h3 {
	/* font-size: clamp(18px, 2.5vw, 24px);
	font-weight: 600;
	line-height: 1.4; */
}

.h4, h4 {
	/* font-size: clamp(16px, 2vw, 20px);
	font-weight: 600;
	line-height: 1.4; */
}

/* º»¹® ÅؽºÆ® */
p, div, span, li {
	/* font-size: clamp(15px, 1.2vw, 16px);
	line-height: 1.7; */
}

.txt-sm {
	/* font-size: clamp(13px, 1vw, 14px);
	color: #666; */
}

/* ±Û²Ã ±½±â À¯Æ¿¸®Æ¼ */
.fw-thin { font-weight: 100; }
.fw-normal { font-weight: 400; }
.fw-medium { font-weight: 500; }
.fw-semibold { font-weight: 600; }
.fw-bold { font-weight: 700; }
.fw-black { font-weight: 900; }


/* ====================================================
   SPACING UTILITIES
==================================================== */
.mt-xs { margin-top: clamp(8px, 1vw, 12px); }
.mt-sm { margin-top: clamp(15px, 2vw, 25px); }
.mt-md { margin-top: clamp(30px, 4vw, 50px); }
.mt-lg { margin-top: clamp(50px, 8vw, 100px); }

.mb-xs { margin-bottom: clamp(8px, 1vw, 12px); }
.mb-sm { margin-bottom: clamp(15px, 2vw, 25px); }
.mb-md { margin-bottom: clamp(30px, 4vw, 50px); }
.mb-lg { margin-bottom: clamp(50px, 8vw, 100px); }

.pt-xs { padding-top: clamp(8px, 1vw, 12px); }
.pt-sm { padding-top: clamp(15px, 2vw, 25px); }
.pt-md { padding-top: clamp(30px, 4vw, 50px); }
.pt-lg { padding-top: clamp(50px, 8vw, 100px); }

.pb-xs { padding-bottom: clamp(8px, 1vw, 12px); }
.pb-sm { padding-bottom: clamp(15px, 2vw, 25px); }
.pb-md { padding-bottom: clamp(30px, 4vw, 50px); }
.pb-lg { padding-bottom: clamp(50px, 8vw, 100px); }


/* ====================================================
   LAYOUT UTILITIES
==================================================== */
.flex { display: flex; }
.flex-center { display: flex; justify-content: center; align-items: center; }
.flex-between { display: flex; justify-content: space-between; align-items: center; }
.flex-wrap { flex-wrap: wrap; }
.flex-column { flex-direction: column; }

.tac { text-align: center; }
.tal { text-align: left; }
.tar { text-align: right; }

.d-none { display: none; }
.d-block { display: block; }
.d-flex { display: flex; }


/* ====================================================
   TABLET (768px ~ 1199px)
==================================================== */
@media (max-width: 1199px) and (min-width: 768px) {
	.hide-t { display: none !important; }

}


/* ====================================================
   MO (767px ÀÌÇÏ)
==================================================== */
@media (max-width: 767px) {
	.hide-m { display: none !important; }
	
	.mo-full-btn {
		width: 100% !important;
		display: block;
	}
	
}

@media screen and (max-width: 479px) {
	/* ÇÊ¿ä½Ã Ãß°¡ */
}