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

html{
	--pink:#ee88a6;
}

.wrap {margin: 0 auto; width: 95%;}
.wrap[max='1600'] {max-width: 1600px;}
.wrap[max='1280'] {max-width: 1280px;}

@media screen and (max-width:1600px) {}
@media screen and (max-width:1440px) {}
@media screen and (max-width:1280px) {}
@media screen and (max-width:1024px) {}
@media screen and (max-width:820px) {
	.wrap {width: 90%;}
}
@media screen and (max-width:500px) {}
@media screen and (max-width:320px) {}
/* 공통 기본 폰트 */
body {font-family: 'Pretendard', sans-serif;}

/* 꽃잎 떨어지는 모션 공통 */
._flower_drop{position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none;}
._flower_drop #_flower_drop_canvas{width: 100%; height: 100%;}


/* max-width */
@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:320px) {
	.max-320{display: block;}
	.min-321{display: none;}
	.max-320-none{display: none;}
}


/* min-width */
@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;}
}



/* 키프레임 모션 모음 */
@keyframes marquee {
	0% { transform: translateX(0%); }
	100%{ transform: translateX(-100%); }
}

@keyframes marquee_reverse {
	0% { transform: translateX(0%); }
	100%{ transform: translateX(100%); }
}


@keyframes opacity {
	0% { opacity: 1; }
	50% { opacity: 0; }
	100% { opacity: 1; }
}

@keyframes opacity20 {
	0% { opacity: 1; }
	50% { opacity: 0.2; }
	100% { opacity: 1; }
}

@keyframes opacity50 {
	0% { opacity: 1; }
	50% { opacity: 0.5; }
	100% { opacity: 1; }
}

@keyframes rotate {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

@keyframes rotate2 {
	0% { transform: rotate(0deg); }
	50% { transform: rotate(180deg); }
	100% { transform: rotate(360deg); }
}

@keyframes rotate3 {
	0% { transform: rotate(0deg); }
	25% { transform: rotate(90deg); }
	50% { transform: rotate(180deg); }
	75% { transform: rotate(270deg); }
	100% { transform: rotate(360deg); }
}

@keyframes rotate4 {
	0% { transform: rotate(0deg); }
	12.5% { transform: rotate(45deg); }
	25% { transform: rotate(90deg); }
	37.5% { transform: rotate(135deg); }
	50% { transform: rotate(180deg); }
	62.5% { transform: rotate(225deg); }
	75% { transform: rotate(270deg); }
	87.5% { transform: rotate(315deg); }
	100% { transform: rotate(360deg); }
}


@keyframes scale50 {
	0% { transform: scale(1); }
	50% { transform: scale(0.5); }
	100% { transform: scale(1); }
}

@keyframes scale80 {
	0% { transform: scale(1); }
	50% { transform: scale(0.8); }
	100% { transform: scale(1); }
}

@keyframes scale110 {
	0% { transform: scale(1); }
	50% { transform: scale(1.1); }
	100% { transform: scale(1); }
}

@keyframes scale120 {
	0% { transform: scale(1); }
	50% { transform: scale(1.2); }
	100% { transform: scale(1); }
}

@keyframes scale130 {
	0% { transform: scale(1); }
	50% { transform: scale(1.3); }
	100% { transform: scale(1); }
}

@keyframes scale140 {
	0% { transform: scale(1); }
	50% { transform: scale(1.4); }
	100% { transform: scale(1); }
}

@keyframes floating10 {
	0% { transform: translateY(0px); }
	50% { transform: translateY(-10px); }
	100% { transform: translateY(0px); }
}

@keyframes floating20 {
	0% { transform: translateY(0px); }
	50% { transform: translateY(-20px); }
	100% { transform: translateY(0px); }
}

@keyframes floating30 {
	0% { transform: translateY(0px); }
	50% { transform: translateY(-30px); }
	100% { transform: translateY(0px); }
}

@keyframes floating40 {
	0% { transform: translateY(0px); }
	50% { transform: translateY(-40px); }
	100% { transform: translateY(0px); }
}

@keyframes floating60 {
	0% { transform: translateY(0px); }
	50% { transform: translateY(-60px); }
	100% { transform: translateY(0px); }
}

@keyframes floating80 {
	0% { transform: translateY(0px); }
	50% { transform: translateY(-80px); }
	100% { transform: translateY(0px); }
}

@keyframes floating80 {
	0% { transform: translateY(0px); }
	50% { transform: translateY(-80px); }
	100% { transform: translateY(0px); }
}

@keyframes floating10_per {
	0% { transform: translateY(0px); }
	50% { transform: translateY(-10%); }
	100% { transform: translateY(0px); }
}

@keyframes floating20_per {
	0% { transform: translateY(0px); }
	50% { transform: translateY(-20%); }
	100% { transform: translateY(0px); }
}

@keyframes floating30_per {
	0% { transform: translateY(0px); }
	50% { transform: translateY(-30%); }
	100% { transform: translateY(0px); }
}

@keyframes floating40_per {
	0% { transform: translateY(0px); }
	50% { transform: translateY(-40%); }
	100% { transform: translateY(0px); }
}

@keyframes floating50_per {
	0% { transform: translateY(0px); }
	50% { transform: translateY(-50%); }
	100% { transform: translateY(0px); }
}

@keyframes marquee {
	from{transform:translateX(0%)}
	to{transform:translateX(-100%)}
}

@keyframes marquee50 {
	from{transform:translateX(0%)}
	to{transform:translateX(-50%)}
}

._delay05{animation-delay: 0.5s !important;}
._delay1{animation-delay: 1s !important;}
._delay15{animation-delay: 1.5s !important;}
._delay2{animation-delay: 2s !important;}
._delay25{animation-delay: 2.5s !important;}
._delay3{animation-delay: 3s !important;}
._delay35{animation-delay: 3.5s !important;}
._delay4{animation-delay: 4s !important;}
._delay45{animation-delay: 4.5s !important;}
._delay5{animation-delay: 5s !important;}