:root{
	--vh:1vh;
	--vh100:calc(var(--vh,1vh) * 100);
	--sandoll: 'Sandoll GyeokdongG2';
}

html::-webkit-scrollbar {width: 8px;}
html::-webkit-scrollbar-thumb {background-color: #2f3542; border-radius: 10px;}

.wrap { position: relative; margin: 0 auto; width: calc(100% - 80px); }
.wrap[max='1600'] {max-width: 1600px;}
.wrap[max='1280'] {max-width: 1280px;}

@media screen and (max-width:1024px) {
	.wrap { position: relative; margin: 0 auto; width: calc(100% - 40px); }
}

/* 공통 기본 폰트 */
body {font-family: 'Pretendard', sans-serif; background-color: #000;}


/* br */
@media screen and (max-width:1600px) {
	.max-1600{display: block;}
	.min-1601{display: none;}
	.max-1600-none{display: none;}
}
@media screen and (max-width:1440px) {
	.max-1440{display: block;}
	.min-1441{display: none;}
	.max-1440-none{display: none;}
}
@media screen and (max-width:1280px) {
	.max-1280{display: block;}
	.min-1281{display: none;}
	.max-1280-none{display: none;}
}
@media screen and (max-width:1024px) {
	.max-1024{display: block;}
	.min-1025{display: none;}
	.max-1024-none{display: none;}
}
@media screen and (max-width:820px) {
	.max-820{display: block;}
	.min-821{display: none;}
	.max-820-none{display: none;}
}
@media screen and (max-width:500px) {
	.max-500{display: block;}
	.min-501{display: none;}
	.max-500-none{display: none;}
}

@media screen and (max-width:400px) {
	.max-400{display: block;}
	.min-401{display: none;}
	.max-400-none{display: none;}
}
@media screen and (max-width:360px) {
	.max-360{display: block;}
	.min-361{display: none;}
	.max-360-none{display: none;}
}

@media screen and (max-width:320px) {
	.max-320{display: block;}
	.min-321{display: none;}
	.max-320-none{display: none;}
}


/* br */
@media screen and (min-width:1601px) {
	.min-1601{display: block;}
	.max-1600{display: none;}
	.min-1601-none{display: none;}
}
@media screen and (min-width:1441px) {
	.min-1441{display: block;}
	.max-1440{display: none;}
	.min-1441-none{display: none;}
}
@media screen and (min-width:1281px) {
	.min-1281{display: block;}
	.max-1280{display: none;}
	.min-1281-none{display: none;}
}
@media screen and (min-width:1025px) {
	.min-1025{display: block;}
	.max-1024{display: none;}
	.min-1025-none{display: none;}
}
@media screen and (min-width:821px) {
	.min-821{display: block;}
	.max-820{display: none;}
	.min-821-none{display: none;}
}
@media screen and (min-width:501px) {
	.min-501{display: block;}
	.max-500{display: none;}
	.min-501-none{display: none;}
}
@media screen and (min-width:321px) {
	.min-321{display: block;}
	.max-320{display: none;}
	.min-321-none{display: none;}
}