
.sound_point{pointer-events:auto;border-radius: 50%;width: 42px;height: 42px;box-sizing: border-box;/* box-shadow: 0px 0px 0px 3px #ffffff47; */}
.sound_point:hover {box-shadow: 0 0 0 3px #ffffff33;opacity:1;}
.sound_point.on {opacity:0.9;}

.sound_point.on::before,
.sound_point.on::after {content: ""; position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; border-radius: 50%; border: 1px solid #fff; transform: translate(-50%, -50%) scale(1); opacity: 0; transition: opacity 0.3s ease-in-out; aspect-ratio: 1 / 1;}

.sound_point.on::before {animation: pulse-animation 1.2s infinite ease-out;}
.sound_point.on::after {animation: pulse-animation 1.2s infinite ease-out 0.6s;}
@keyframes pulse-animation {
    0% {transform: translate(-50%, -50%) scale(1);opacity: 0.9;}
    100% {transform: translate(-50%, -50%) scale(1.5);opacity: 0;}
}

.sp_white {opacity:0.7;/* border: 2px solid #5d201f; */background-color: black;background-image: url(resources/icon/audio/headphone.svg);background-size: 18px;background-position: 50% 11px;background-repeat: no-repeat;box-shadow: 0 0 0 3px #ffffff45;overflow: hidden;/* box-sizing: content-box; */}
.sp_black{opacity:1;border: 1px solid #1f241d;background-color: #978f8233;background-image: url(resources/icon/audio/headphone-black.svg);background-size: 20px;background-position: 50% 7px;background-repeat: no-repeat;}



#sticker {transition: right 0.2s ease-out;position: absolute;top: 50%;right:-90px;z-index: 9;display: flex;background-color: #000000bf;width: 73px;height: 60px;align-items: center;border-radius: 40px 0 0 40px;padding: 0 0 0 11px;cursor: pointer;}
#sticker .headset{opacity: 0.9;background-image: url(resources/icon/audio/headphone.svg);background-size: 24px;background-position: 50% 7px;background-repeat: no-repeat;pointer-events: auto;border-radius: 50%;width: 42px;height: 42px;box-sizing: border-box;position: relative;}
#sticker .headset::before,#sticker .headset::after {content: ""; position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; border-radius: 50%; border: 1px solid #fff; transform: translate(-50%, -50%) scale(1); opacity: 0; transition: opacity 0.3s ease-in-out; aspect-ratio: 1 / 1;}
#sticker .headset::before {animation: pulse-animation 1.5s infinite ease-out;}
#sticker .headset::after {animation: pulse-animation 1.5s infinite ease-out 0.6s;}
#sticker.on {right:0;transition: right 0.2s ease-out;}
