.floating-btn{
    position: fixed;
    bottom: 20%;
    width: 100%;
    max-width: var(--width-dev);
}
.floating-btn-top{
    position: absolute;
    bottom: -2.35rem;
    right: .85rem;
    width: 100%;
    max-width: 4.85rem;
    z-index: 1;
}
.floating-btn-top div{
    padding-bottom: 46.255506607%;
    background: url('https://s.tykcdn.com/assets/gabut_ioh/event/img/flt_btn_3.png') no-repeat center center;
    background-size: contain;

    -webkit-animation: To 1s ease infinite .5s;
    -moz-animation: To 1s ease infinite .5s;
    -ms-animation: To 1s ease infinite .5s;
    -o-animation: To 1s ease infinite .5s;
    animation: To 1s ease infinite .5s;
    animation-delay: .15s;
}
@-webkit-keyframes To{
    0%{transform: translateY(0px)}
    20%{transform: translateY(0px)}
    40%{transform: translateY(-15px)}
    60%{transform: translateY(0px)}
    80%{transform: translateY(0px)}
    100%{transform: translateY(0px)}
}
@-moz-keyframes To{
    0%{transform: translateY(0px)}
    20%{transform: translateY(0px)}
    40%{transform: translateY(-15px)}
    60%{transform: translateY(0px)}
    80%{transform: translateY(0px)}
    100%{transform: translateY(0px)}
}
@-ms-keyframes To{
    0%{transform: translateY(0px)}
    20%{transform: translateY(0px)}
    40%{transform: translateY(-15px)}
    60%{transform: translateY(0px)}
    80%{transform: translateY(0px)}
    100%{transform: translateY(0px)}
}
@-o-keyframes To{
    0%{transform: translateY(0px)}
    20%{transform: translateY(0px)}
    40%{transform: translateY(-15px)}
    60%{transform: translateY(0px)}
    80%{transform: translateY(0px)}
    100%{transform: translateY(0px)}
}
@keyframes To{
    0%{transform: translateY(0px)}
    20%{transform: translateY(0px)}
    40%{transform: translateY(-15px)}
    60%{transform: translateY(0px)}
    80%{transform: translateY(0px)}
    100%{transform: translateY(0px)}
}

.floating-btn-btm{
    position: absolute;
    right: 0;
    width: 100%;
    max-width: 6rem;
}
.floating-btn-btm div{
    padding-bottom: 100%;
    
    -webkit-animation: Bt 1s infinite;
    -moz-animation: Bt 1s infinite;
    -o-animation: Bt 1s infinite;
    -ms-animation: Bt 1s infinite;
    animation: Bt 1s infinite;
}
@-webkit-keyframes Bt{
    0%{transform: scale(1,1) translateY(calc(0% + 0px));background: url('https://s.tykcdn.com/assets/gabut_ioh/event/img/flt_btn_1.png') no-repeat center center;background-size: contain}
    20%{transform: scale(1.1,.9) translateY(calc(0% + 10px))}
    40%{transform: scale(.9,1.1) translateY(calc(0% + -5px))}
    50%{background: url('https://s.tykcdn.com/assets/gabut_ioh/event/img/flt_btn_2.png') no-repeat center center;background-size: contain}
    60%{transform: scale(1.05,.95) translateY(calc(0% + 0px))}
    80%{transform: scale(1,1) translateY(calc(0% + 0px))}
    100%{transform: scale(1,1) translateY(calc(0% + 0px));background: url('https://s.tykcdn.com/assets/gabut_ioh/event/img/flt_btn_1.png') no-repeat center center;background-size: contain}
}
@-moz-keyframes Bt{
    0%{transform: scale(1,1) translateY(calc(0% + 0px));background: url('https://s.tykcdn.com/assets/gabut_ioh/event/img/flt_btn_1.png') no-repeat center center;background-size: contain}
    20%{transform: scale(1.1,.9) translateY(calc(0% + 10px))}
    40%{transform: scale(.9,1.1) translateY(calc(0% + -5px))}
    50%{background: url('https://s.tykcdn.com/assets/gabut_ioh/event/img/flt_btn_2.png') no-repeat center center;background-size: contain}
    60%{transform: scale(1.05,.95) translateY(calc(0% + 0px))}
    80%{transform: scale(1,1) translateY(calc(0% + 0px))}
    100%{transform: scale(1,1) translateY(calc(0% + 0px));background: url('https://s.tykcdn.com/assets/gabut_ioh/event/img/flt_btn_1.png') no-repeat center center;background-size: contain}
}
@-o-keyframes Bt{
    0%{transform: scale(1,1) translateY(calc(0% + 0px));background: url('https://s.tykcdn.com/assets/gabut_ioh/event/img/flt_btn_1.png') no-repeat center center;background-size: contain}
    20%{transform: scale(1.1,.9) translateY(calc(0% + 10px))}
    40%{transform: scale(.9,1.1) translateY(calc(0% + -5px))}
    50%{background: url('https://s.tykcdn.com/assets/gabut_ioh/event/img/flt_btn_2.png') no-repeat center center;background-size: contain}
    60%{transform: scale(1.05,.95) translateY(calc(0% + 0px))}
    80%{transform: scale(1,1) translateY(calc(0% + 0px))}
    100%{transform: scale(1,1) translateY(calc(0% + 0px));background: url('https://s.tykcdn.com/assets/gabut_ioh/event/img/flt_btn_1.png') no-repeat center center;background-size: contain}
}
@-ms-keyframes Bt{
    0%{transform: scale(1,1) translateY(calc(0% + 0px));background: url('https://s.tykcdn.com/assets/gabut_ioh/event/img/flt_btn_1.png') no-repeat center center;background-size: contain}
    20%{transform: scale(1.1,.9) translateY(calc(0% + 10px))}
    40%{transform: scale(.9,1.1) translateY(calc(0% + -5px))}
    50%{background: url('https://s.tykcdn.com/assets/gabut_ioh/event/img/flt_btn_2.png') no-repeat center center;background-size: contain}
    60%{transform: scale(1.05,.95) translateY(calc(0% + 0px))}
    80%{transform: scale(1,1) translateY(calc(0% + 0px))}
    100%{transform: scale(1,1) translateY(calc(0% + 0px));background: url('https://s.tykcdn.com/assets/gabut_ioh/event/img/flt_btn_1.png') no-repeat center center;background-size: contain}
}
@keyframes Bt{
    0%{transform: scale(1,1) translateY(calc(0% + 0px));background: url('https://s.tykcdn.com/assets/gabut_ioh/event/img/flt_btn_1.png') no-repeat center center;background-size: contain}
    20%{transform: scale(1.1,.9) translateY(calc(0% + 10px))}
    40%{transform: scale(.9,1.1) translateY(calc(0% + -5px))}
    50%{background: url('https://s.tykcdn.com/assets/gabut_ioh/event/img/flt_btn_2.png') no-repeat center center;background-size: contain}
    60%{transform: scale(1.05,.95) translateY(calc(0% + 0px))}
    80%{transform: scale(1,1) translateY(calc(0% + 0px))}
    100%{transform: scale(1,1) translateY(calc(0% + 0px));background: url('https://s.tykcdn.com/assets/gabut_ioh/event/img/flt_btn_1.png') no-repeat center center;background-size: contain}
}