html.no-scroll,
body.no-scroll {
    overflow: hidden;
}
/*福袋和福袋背景位置*/
.bag {
    width: 30%;
    position: absolute;
    transform: translate(-50%, -50%);
    cursor: pointer;
    z-index: 5;
}
.bag_bg{
    width: 45%;
    position: absolute;
    transform: translate(-50%, -50%)
    cursor: pointer;
    z-index: 3;
}
.bagGif{
    width: 85%;
    top: 13%;
    left: 5%;
    position: absolute;
    transform: translate(-50%, -50%)
    cursor: pointer;
    z-index: 32;
}

#item-bg-1 {
    top: 14%;
    left: 8.5%;
}

#item-bg-2 {
    top: 14%;
    left: 47%;
    z-index: 4;
}

#item-bg-3 {
    top: 23.4%;
    left: 8.5%;
}
#item-bg-4 {
    top: 23.4%;
    left: 47%;
    z-index: 4;
}
@keyframes slide {
      0%{ transform: translateY(0); }
      100% {transform: translateY(17px); }
}

#item-1 {
    top: 15.5%;
    left: 13.5%;
    animation: slide 0.70s ease-in infinite alternate forwards;
}

#item-2 {
    top: 15.5%;
    left: 60.5%;
    animation: slide 0.75s ease-in infinite alternate forwards;
}

#item-3 {
    top: 24.5%;
    left: 13.5%;
    animation: slide 0.80s ease-in infinite alternate forwards;
}
#item-4 {
    top:24.5%;
    left: 60.5%;
    animation: slide 0.65s ease-in infinite alternate forwards;
}


/* 左下浮動按鈕 */
.count-icon {
    display: none;
    z-index: 100;
    position: fixed;
    left: 10px;
    bottom: 10px;
    width: 20%;
    max-width: 70px;
    cursor: pointer;
}

/* 抽獎券數量數字 */
.redemption-count{
    position: fixed;
    top: 56%;
    left: 50%;
    font-size: clamp(2px, 17.5vw, 105px);
    color: black;
    transform: translate(-50%, -50%);
    user-select: none;
}

/* 遮罩層樣式 */
.overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 30;
    background-color: rgba(0, 0, 0, 0.5);
}

/* 彈出視窗樣式 */
.popup {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 20px;
    z-index: 600;
    width: 100%;
    max-width: 600px;
}