.event1 { width: 140px; height: 140px; display: block; position: absolute; top: 50%; left: 50%; /* background: url(../../user/images/event2024/jewelry1.png); */ z-index: 9999999999; -webkit-animation: eventMove1 ease-in-out 1s; -moz-animation: eventMove1 ease-in-out 1s; -ms-animation: eventMove1 ease-in-out 1s; -o-animation: eventMove1 ease-in-out 1s; animation: eventMove1 ease-in-out 1s; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; -ms-animation-iteration-count: infinite; -o-animation-iteration-count: infinite; animation-iteration-count: infinite; cursor: pointer; }
.event2 { width: 140px; height: 140px; display: block; position: absolute; top: 50%; left: 50%; /* background: url(../../user/images/event2024/jewelry2.png); */ z-index: 9999999999; -webkit-animation: eventMove1 ease-in-out 1s; -moz-animation: eventMove1 ease-in-out 1s; -ms-animation: eventMove1 ease-in-out 1s; -o-animation: eventMove1 ease-in-out 1s; animation: eventMove1 ease-in-out 1s; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; -ms-animation-iteration-count: infinite; -o-animation-iteration-count: infinite; animation-iteration-count: infinite; cursor: pointer; }
.event3 { width: 140px; height: 140px; display: block; position: absolute; top: 50%; left: 50%; /* background: url(../../user/images/event2024/jewelry3.png); */ z-index: 9999999999; -webkit-animation: eventMove1 ease-in-out 1s; -moz-animation: eventMove1 ease-in-out 1s; -ms-animation: eventMove1 ease-in-out 1s; -o-animation: eventMove1 ease-in-out 1s; animation: eventMove1 ease-in-out 1s; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; -ms-animation-iteration-count: infinite; -o-animation-iteration-count: infinite; animation-iteration-count: infinite; cursor: pointer; }
.event4 { width: 140px; height: 140px; display: block; position: absolute; top: 50%; left: 50%; /* background: url(../../user/images/event2024/jewelry4.png); */ z-index: 9999999999; -webkit-animation: eventMove1 ease-in-out 1s; -moz-animation: eventMove1 ease-in-out 1s; -ms-animation: eventMove1 ease-in-out 1s; -o-animation: eventMove1 ease-in-out 1s; animation: eventMove1 ease-in-out 1s; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; -ms-animation-iteration-count: infinite; -o-animation-iteration-count: infinite; animation-iteration-count: infinite; cursor: pointer; }
.event5 { width: 140px; height: 140px; display: block; position: absolute; top: 50%; left: 50%; /* background: url(../../user/images/event2024/jewelry5.png); */ z-index: 9999999999; -webkit-animation: eventMove1 ease-in-out 1s; -moz-animation: eventMove1 ease-in-out 1s; -ms-animation: eventMove1 ease-in-out 1s; -o-animation: eventMove1 ease-in-out 1s; animation: eventMove1 ease-in-out 1s; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; -ms-animation-iteration-count: infinite; -o-animation-iteration-count: infinite; animation-iteration-count: infinite; cursor: pointer; }


@keyframes eventMove1 {
	0% { transform: translateY(0); }
	25% { transform: translateY(0); }
	50% { transform: translateY(20px); }
	75% { transform: translateY(0); }
	100% { transform: translateY(0); }
}
@-moz-keyframes eventMove1 {
	0% { -moz-transform: translateY(0); }
	25% { -moz-transform: translateY(0); }
	50% { -moz-transform: translateY(20px); }
	75% { -moz-transform: translateY(0); }
	100% { -moz-transform: translateY(0); }
}
@-webkit-keyframes eventMove1 {
	0% { -webkit-transform: translateY(0); }
	25% { -webkit-transform: translateY(0); }
	50% { -webkit-transform: translateY(20px); }
	75% { -webkit-transform: translateY(0); }
	100% { -webkit-transform: translateY(0); }
}
@-o-keyframes eventMove1 {
	0% { -o-transform: translateY(0); }
	25% { -o-transform: translateY(0); }
	50% { -o-transform: translateY(20px); }
	75% { -o-transform: translateY(0); }
	100% { -o-transform: translateY(0); }
}
@-ms-keyframes eventMove1 {
	0% { -ms-transform: translateY(0); }
	25% { -ms-transform: translateY(0); }
	50% { -ms-transform: translateY(20px); }
	75% { -ms-transform: translateY(0); }
	100% { -ms-transform: translateY(0); }
}
@keyframes eventMove2 {
	0% { transform: translateY(0); }
	25% { transform: translateY(0); }
	50% { transform: translateY(20px); }
	75% { transform: translateY(0); }
	100% { transform: translateY(0); }
}
@-moz-keyframes eventMove2 {
	0% { -moz-transform: translateY(0); }
	25% { -moz-transform: translateY(0); }
	50% { -moz-transform: translateY(20px); }
	75% { -moz-transform: translateY(0); }
	100% { -moz-transform: translateY(0); }
}
@-webkit-keyframes eventMove2 {
	0% { -webkit-transform: translateY(0); }
	25% { -webkit-transform: translateY(0); }
	50% { -webkit-transform: translateY(20px); }
	75% { -webkit-transform: translateY(0); }
	100% { -webkit-transform: translateY(0); }
}
@-o-keyframes eventMove2 {
	0% { -o-transform: translateY(0); }
	25% { -o-transform: translateY(0); }
	50% { -o-transform: translateY(20px); }
	75% { -o-transform: translateY(0); }
	100% { -o-transform: translateY(0); }
}
@-ms-keyframes eventMove2 {
	0% { -ms-transform: translateY(0); }
	25% { -ms-transform: translateY(0); }
	50% { -ms-transform: translateY(20px); }
	75% { -ms-transform: translateY(0); }
	100% { -ms-transform: translateY(0); }
}
@keyframes eventMove3 {
	0% { transform: translateY(0); }
	25% { transform: translateY(0); }
	50% { transform: translateY(20px); }
	75% { transform: translateY(0); }
	100% { transform: translateY(0); }
}
@-moz-keyframes eventMove3 {
	0% { -moz-transform: translateY(0); }
	25% { -moz-transform: translateY(0); }
	50% { -moz-transform: translateY(20px); }
	75% { -moz-transform: translateY(0); }
	100% { -moz-transform: translateY(0); }
}
@-webkit-keyframes eventMove3 {
	0% { -webkit-transform: translateY(0); }
	25% { -webkit-transform: translateY(0); }
	50% { -webkit-transform: translateY(20px); }
	75% { -webkit-transform: translateY(0); }
	100% { -webkit-transform: translateY(0); }
}
@-o-keyframes eventMove3 {
	0% { -o-transform: translateY(0); }
	25% { -o-transform: translateY(0); }
	50% { -o-transform: translateY(20px); }
	75% { -o-transform: translateY(0); }
	100% { -o-transform: translateY(0); }
}
@-ms-keyframes eventMove3 {
	0% { -ms-transform: translateY(0); }
	25% { -ms-transform: translateY(0); }
	50% { -ms-transform: translateY(20px); }
	75% { -ms-transform: translateY(0); }
	100% { -ms-transform: translateY(0); }
}
@keyframes eventMove4 {
	0% { transform: translateY(0); }
	25% { transform: translateY(0); }
	50% { transform: translateY(20px); }
	75% { transform: translateY(0); }
	100% { transform: translateY(0); }
}
@-moz-keyframes eventMove4 {
	0% { -moz-transform: translateY(0); }
	25% { -moz-transform: translateY(0); }
	50% { -moz-transform: translateY(20px); }
	75% { -moz-transform: translateY(0); }
	100% { -moz-transform: translateY(0); }
}
@-webkit-keyframes eventMove4 {
	0% { -webkit-transform: translateY(0); }
	25% { -webkit-transform: translateY(0); }
	50% { -webkit-transform: translateY(20px); }
	75% { -webkit-transform: translateY(0); }
	100% { -webkit-transform: translateY(0); }
}
@-o-keyframes eventMove4 {
	0% { -o-transform: translateY(0); }
	25% { -o-transform: translateY(0); }
	50% { -o-transform: translateY(20px); }
	75% { -o-transform: translateY(0); }
	100% { -o-transform: translateY(0); }
}
@-ms-keyframes eventMove4 {
	0% { -ms-transform: translateY(0); }
	25% { -ms-transform: translateY(0); }
	50% { -ms-transform: translateY(20px); }
	75% { -ms-transform: translateY(0); }
	100% { -ms-transform: translateY(0); }
}
@keyframes eventMove5 {
	0% { transform: translateY(0); }
	25% { transform: translateY(0); }
	50% { transform: translateY(20px); }
	75% { transform: translateY(0); }
	100% { transform: translateY(0); }
}
@-moz-keyframes eventMove5 {
	0% { -moz-transform: translateY(0); }
	25% { -moz-transform: translateY(0); }
	50% { -moz-transform: translateY(20px); }
	75% { -moz-transform: translateY(0); }
	100% { -moz-transform: translateY(0); }
}
@-webkit-keyframes eventMove5 {
	0% { -webkit-transform: translateY(0); }
	25% { -webkit-transform: translateY(0); }
	50% { -webkit-transform: translateY(20px); }
	75% { -webkit-transform: translateY(0); }
	100% { -webkit-transform: translateY(0); }
}
@-o-keyframes eventMove5 {
	0% { -o-transform: translateY(0); }
	25% { -o-transform: translateY(0); }
	50% { -o-transform: translateY(20px); }
	75% { -o-transform: translateY(0); }
	100% { -o-transform: translateY(0); }
}
@-ms-keyframes eventMove5 {
	0% { -ms-transform: translateY(0); }
	25% { -ms-transform: translateY(0); }
	50% { -ms-transform: translateY(20px); }
	75% { -ms-transform: translateY(0); }
	100% { -ms-transform: translateY(0); }
}

.eventPop { width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: -99999; opacity: 0; background: rgba(0,0,0,0.5); transition: all .4s ease-out; }
.eventPop.on { opacity: 1; z-index: 999999999; }
.eventPop .eventcon { width: 622px; height: 518px; position: absolute; top: 200px; left: 50%; margin-left: -311px; margin-top: -750px; transition: all .4s ease-out .3s;  }
.eventPop .eventcon .btn_close { width: 35px; height: 35px; position: absolute; right: 100px; top: -65px; background: url(../../user/images/event2024/btn_close.png); cursor: pointer; z-index: 9999999999; }
.eventPop.on .eventcon { margin-top: 0; }

.eventPop.on .eventimg1 { width: 1385px; height: 518px; /*background: url(../../user/images/event2024/event1.png);*/ }
.eventPop.on .eventimg2 { width: 1385px; height: 518px; /*background: url(../../user/images/event2024/event2.png);*/ }
.eventPop.on .eventimg3 { width: 1385px; height: 518px; /*background: url(../../user/images/event2024/event3.png);*/ }
.eventPop.on .eventimg4 { width: 1385px; height: 518px; /*background: url(../../user/images/event2024/event4.png);*/ }
.eventPop.on .eventimg5 { width: 1385px; height: 518px; /*background: url(../../user/images/event2024/event5.png);*/ }

.eventPop.ev2.on .eventimg1 { width: 760px; height: 440px; margin-left: -380px;  }

.eventPop.ev3 .event2024_12 {height: 100%; display: flex; justify-content: center; align-items: center; }
.eventPop.ev3 .event2024_12 .event_body {width: 650px; height: 674px; background: #6734d7; display: flex; position: relative; align-items: center; justify-content: center; }
.eventPop.ev3 .event2024_12 .event_body .head {font-size: 0; }
.eventPop.ev3 .event2024_12 .event_body .head .btn_close {position: absolute; top: 35px; right: 85px; display: block; width: 28px; height: 28px; background-image: url(/user/images/event2024/btn_pop_close_w.png); background-repeat: no-repeat; }
.eventPop.ev3 .event2024_12 .event_body .inner {width: 500px; height: 500px; background: #fff; border-radius: 15px; }
.eventPop.ev3 .event2024_12 .event_body .inner .title {font-size: 0; }
.eventPop.ev3 .event2024_12 .event_body .inner .title::after {display: block; content: ''; width: 100%; height: 230px; background-image: url(/user/images/event2024/img_title.png); background-repeat: no-repeat; background-position: center center; }
.eventPop.ev3 .event2024_12 .event_body .inner .cont {padding: 16px 40px; }
.eventPop.ev3 .event2024_12 .event_body .inner .cont .stamp_list {width: 100%; height: calc(100% - 230px); display: flex; flex-wrap: wrap; }
.eventPop.ev3 .event2024_12 .event_body .inner .cont .stamp_list li {position: relative; width: calc(100% / 3); display: flex; justify-content: center; padding-bottom: 20px; font-size: 0; }
.eventPop.ev3 .event2024_12 .event_body .inner .cont .stamp_list li::after {content: '참여완료 !'; color: #6734d7; display: none; width: 100%; height: 100%; font-size: 15px; font-weight: 500; position: absolute; align-items: flex-end; justify-content: center; }
.eventPop.ev3 .event2024_12 .event_body .inner .cont .stamp_list li span::after {display: block; content: ''; width: 99px; height: 99px; background-image: url(/user/images/event2024/img_stamp_off.png); background-repeat: no-repeat; }
.eventPop.ev3 .event2024_12 .event_body .cmpl {display: none; position: absolute; bottom: 35px; color: #fff; font-size: 20px; font-weight: 500; }

.eventPop.ev3 .event2024_12 .event_body.stamp1 .inner .cont .stamp_list {}
.eventPop.ev3 .event2024_12 .event_body.stamp1 .inner .cont .stamp_list li:nth-child(1)::after {display: none; }
.eventPop.ev3 .event2024_12 .event_body.stamp1 .inner .cont .stamp_list li:nth-child(-n+1) span::after {background-image: url(/user/images/event2024/img_stamp_on.png);  }

.eventPop.ev3 .event2024_12 .event_body.stamp2 .inner .cont .stamp_list {}
.eventPop.ev3 .event2024_12 .event_body.stamp2 .inner .cont .stamp_list li:nth-child(2)::after {display: none; }
.eventPop.ev3 .event2024_12 .event_body.stamp2 .inner .cont .stamp_list li:nth-child(-n+2) span::after {background-image: url(/user/images/event2024/img_stamp_on.png);  }

.eventPop.ev3 .event2024_12 .event_body.stamp3 .inner .cont .stamp_list {}
.eventPop.ev3 .event2024_12 .event_body.stamp3 .inner .cont .stamp_list li:nth-child(3)::after {display: none; }
.eventPop.ev3 .event2024_12 .event_body.stamp3 .inner .cont .stamp_list li:nth-child(-n+3) span::after {background-image: url(/user/images/event2024/img_stamp_on.png);  }

.eventPop.ev3 .event2024_12 .event_body.stamp4 .inner .cont .stamp_list {}
.eventPop.ev3 .event2024_12 .event_body.stamp4 .inner .cont .stamp_list li:nth-child(4)::after {display: none; }
.eventPop.ev3 .event2024_12 .event_body.stamp4 .inner .cont .stamp_list li:nth-child(-n+4) span::after {background-image: url(/user/images/event2024/img_stamp_on.png);  }

.eventPop.ev3 .event2024_12 .event_body.stamp5 .inner .cont .stamp_list {}
.eventPop.ev3 .event2024_12 .event_body.stamp5 .inner .cont .stamp_list li:nth-child(5)::after {display: none; }
.eventPop.ev3 .event2024_12 .event_body.stamp5 .inner .cont .stamp_list li:nth-child(-n+5) span::after {background-image: url(/user/images/event2024/img_stamp_on.png);  }

.eventPop.ev3 .event2024_12 .event_body.stamp6 .inner .cont .stamp_list {}
.eventPop.ev3 .event2024_12 .event_body.stamp6 .inner .cont .stamp_list li:nth-child(6)::after {display: flex; }
.eventPop.ev3 .event2024_12 .event_body.stamp6 .inner .cont .stamp_list li:nth-child(-n+6) span::after {background-image: url(/user/images/event2024/img_stamp_on.png);  }
.eventPop.ev3 .event2024_12 .event_body.stamp6 .cmpl {display: block; }

@media all and (max-width:1200px) {
    .event1,
    .event2,
    .event3,
    .event4,
    .event5 { width: 90px; height: 90px; background-size: 90px 90px; }

    .eventPop .eventcon .btn_close { width: 20px; height: 20px; position: absolute; right: 40px; top: -50px; background-size: 20px 20px !important; }
    .eventPop .eventcon { margin-left: -160px; }
    .eventPop.on .eventimg1,
    .eventPop.on .eventimg2,
    .eventPop.on .eventimg3,
    .eventPop.on .eventimg4,
    .eventPop.on .eventimg5,
    .eventPop.ev2.on .eventimg1 { width: 320px; background-size: 320px auto !important; background-repeat: no-repeat !important; }
}

@media all and (max-width:500px) {
	.eventPop.ev3 .event2024_12 .event_body {width: 100%; height: calc(100% - 25%); }
	.eventPop.ev3 .event2024_12 .event_body .head {display: none; }
	.eventPop.ev3 .event2024_12 .event_body .inner {width: calc(100% - 5%); }
	.eventPop.ev3 .event2024_12 .event_body .inner .cont {padding: 16px 10px; }
	.eventPop.ev3 .event2024_12 .event_body .cmpl {bottom: calc(100% - 98%); font-size: 15px; }
}
