/* pc */
:root {
  --delay: 0.2s;
}

.eve_detail .eveCont .naviBtns button {
  opacity: 1;
  background-color: initial;
}

.eve_detail .eveCont .naviBtns {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 56.156%;
 background:#D0EE84;
}
.event_wrap #eventTypeArea.inner_wide .coupon_box .coupon_list+.btn_wrap button{
  color: #3c3c3c!important;
}
.event_wrap #eventTypeArea.inner_wide .coupon_box .coupon_list+.btn_wrap button:after{
  border-color: #3c3c3c!important;
}
.eve_detail .eveCont .naviBtns.navi02 {
  height: 54.5%;
}
.eve_detail .eveCont.top3 .naviBtns.navi02 {
  height: 52%;
}
.eve_detail .eveCont.top4 .naviBtns.navi02 {
  height: 52%;
}

.eve_detail .eveCont .naviBtns button.naviBtn {
  position: relative;
  font-size: 0;
  margin-top: -0.4%;
  vertical-align: top;
  opacity: 0;
  transform: translateY(0);
  animation: fadeUp 0.8s ease-in-out forwards;
  animation-delay: var(--delay);
}

.eve_detail .eveCont .naviBtns button.naviBtn:first-child {
  margin-top: 0;
}

.eve_detail .eveCont .naviBtns button.naviBtn:nth-child(2) {
  animation-delay: calc(2 * var(--delay));
}

.eve_detail .eveCont .naviBtns button.naviBtn:nth-child(3) {
  animation-delay: calc(3 * var(--delay));
}

.eve_detail .eveCont .naviBtns button.naviBtn:nth-child(4) {
  animation-delay: calc(4 * var(--delay));
}

.eve_detail .eveCont .naviBtns button.naviBtn:nth-child(5) {
  animation-delay: calc(5 * var(--delay));
}


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


.obj0{
top: 47.5%;
    left: 68%;
    width: 20% !important;
    z-index: 2;
  animation: blink 1s step-end infinite;
  animation-delay: 1.5s;
    opacity: 0;
}
/* .top2 .obj0{
top: 56.5%;
} */
.top4 .obj0{
top: 56.5%;
}
.top5 .obj0{
top:45.5%;
}
.top6 .obj0{
top:45.5%;
}
.top7 .obj0{
top:38.5%;
}
.obj1{
    top: 16%;
    left: 25%;
    width: 16% !important;
    animation: floatItem 1s ease-in-out infinite;
}
#sh .obj1{
    top: 4%;
    left: 68%;
    width: 20% !important;
  animation: floatItem 1s ease-in-out infinite;
}
.obj2{
    top: 66%;
    left: 77%;
    width: 20% !important;
  animation: floatItem 1s ease-in-out infinite;
  animation-delay: 0.3s;
}
.obj2_2{
    top: 46%;
    left: 34%;
    width: 18% !important;
    animation: blink 1.3s step-end infinite;
    animation-delay: 0.3s;
}
.obj3{
    top: 10.3%;
    left: 64%;
    width: 25% !important;
    animation: floatItem 1s ease-in-out infinite;
}
.obj4{
    top: 23.3%;
    left: 64%;
    width: 25% !important;
    animation: floatItem 1s ease-in-out infinite;
}
.obj5{
    top: 67.8%;
    left: 68%;
    width: 26% !important;
    animation: floatItem 1s ease-in-out infinite;
    display: none;
}
.obj6{
top: 80.3%;
    left: 68%;
    width: 24% !important;
    animation: floatItem 1s ease-in-out infinite;
}
.obj5_2{
    top: 71.8%;
    left: 65%;
    width: 27% !important;
    animation: floatItem 1s ease-in-out infinite;
    display: none;
}
.obj6_2{
    top: 83.7%;
    left: 65%;
    width: 25% !important;
    animation: floatItem 1s ease-in-out infinite;
}
.eveCont .eventLink.btnNavNV {
    width: 90%;
    height: 11.4%;
    bottom: 77%;
}
.eveCont .eventLink.btnNavSS {
    width: 90%;
    height: 11%;
    bottom: 66%;
}
.eveCont .eventLink.btnNavHD {
    width: 90%;
    height: 11%;
    bottom: 54%;
}
.eveCont.top2 .eventLink.btnNavNV {
width: 90%;
    height: 11%;
    bottom: 77%;
}
.eveCont.top2 .eventLink.btnNavSS {
    width: 90%;
    height: 11.4%;
    bottom: 64.9%;
}
.eveCont.top2 .eventLink.btnNavBC {
    width: 90%;
    height: 11.4%;
    bottom: 52.5%;
}
.eveCont.top2 .eventLink.btnNavHD {
    width: 90%;
    height: 11.4%;
    bottom: 40.5%;
}
.eveCont .eventLink.btnSH {
  width: 90%;
  height: 14%;
  bottom: 49%;
}
.eveCont .eventLink.btnBC {
  width: 90%;
  height: 14%;
bottom: 63.5%;
}
.eveCont .eventLink.btnSS {
  width: 90%;
  height: 14%;
  bottom: 65.7%;

}
.eveCont .eventLink.btnSS2 {
  width: 90%;
  height: 14%;
  bottom: 66.4%;

}
.eveCont .eventLink.btnNV {
  width: 90%;
  height: 14%;
  bottom: 3.5%;

}
.eveCont .eventLink.btnHD {
  width: 90%;
  height: 14%;
  bottom: 50.9%;

}
.eveCont .eventLink.btnFULL {
  width: 100%;
  height: 100%;
  bottom: 0%;

}

.eveCont .eventLink.btnDefault {
  width: 90%;
  height: 100px;
}


@keyframes floatItem {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(10%);
  }
  100% {
    transform: translateY(0);
  }
}

@keyframes fadeUp {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.ss + .naviBtn {
background-color: #018AEC!important;
}
.ss2 + .naviBtn {
background-color: #018AEC!important;
}
.nv + .naviBtn {
background-color: #03C75A!important;
}
.wr + .naviBtn {
background-color: #35C1D6!important;
}
/* mo */
.mo .eveCont .floatItem {
  height: 2.9rem;
}

.mo .eveCont.top .floatItem {
  height: 3.2rem;
}

.mo .eveCont .eventLink.btnDefault {
  height: 5rem;
}


.event_wrap #eventTypeArea.inner_wide {
    background-color: rgb(255, 208, 233)!important;
    background-image: url('https://stg-inm-cdn.innisfree.com/publish/event/2026/suBigPartner/1105/img_cpEnd.webp');
    background-size: 55%;
    background-repeat: repeat-x;
    background-position: bottom;
}
.mo .event_wrap #eventTypeArea.inner_wide {
    background-color: rgb(255, 208, 233)!important;
    background-image: url('https://stg-inm-cdn.innisfree.com/publish/event/2026/suBigPartner/1105/img_cpEnd.webp');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom;
}

.event_wrap #eventTypeArea.inner_wide .desc+.inner {
  margin-top: 0 !important;
  background-color: #fff0!important;
}
.event_wrap #eventTypeArea.inner_wide .coupon_box{
  padding-bottom: 9%;
}
.event_wrap #eventTypeArea.inner_wide .coupon_box .coupon_list+.btn_wrap {
  margin-top: 2rem;  
}

.event_wrap #eventTypeArea.inner_wide .coupon_box .coupon_list+.btn_wrap button {
  color: #fff;
}

.event_wrap #eventTypeArea.inner_wide .coupon_box .coupon_list+.btn_wrap button:after {
  border-color: #fff;
}

.mo .event_wrap #eventTypeArea.inner_wide .coupon_box .coupon_list+.btn_wrap {
  margin-top: 1rem;
  align-items:center;
}

.mo .event_wrap #eventTypeArea.inner_wide .coupon_box .coupon_list+.btn_wrap button {
  font-size: 1rem;
  margin-right: .3rem
}

.mo .event_wrap #eventTypeArea.inner_wide .coupon_box .coupon_list+.btn_wrap button:after {
  width: .5rem;
  height: .5rem;
}