.barmenu-wrap {position: absolute;bottom: 20px;left: 50%;transform: translateX(-50%);z-index: 1;border-radius: 50px;display: flex;flex-direction: row;align-items: center;justify-content: space-between;gap: 10px;}
.brmn .icon {background-color: rgb(0 0 0 / 50%);width: 42px;height: 42px;border-radius: 40px;overflow: hidden;background-repeat: no-repeat;}

.bookinfo-button {opacity:1;transition: opacity 0.5s ease-out;-o-transition: opacity 0.5s ease-out;-moz-transition: opacity 0.5s ease-out;-webkit-transition: opacity 0.5s ease-out;}
.bookinfo-button div {background-image: url(resources/icon/info/mono-white.svg);background-size: 38px;background-position: 50%;}
.bookinfo-button div:hover {box-shadow: 0 0 0 3px #ffffff61;cursor: pointer;}
#text_bookinfo {left: 20px;display:none;}
.about_floor {width: 158px;}

#sound.off {background-image: url(skin/ico/sound-off.svg);background-size: 18px;background-position: 50% 50%;transform: rotate(180deg);}
#sound.on {background-image: url(skin/ico/sound-on.svg);background-size: 18px;background-position: 50% 50%;transform: rotate(180deg);}
#sound:hover {box-shadow: 0 0 0 3px #ffffff61;cursor: pointer;}
#text_sound_off {left: 72px;display:none;pointer-events:none;}
#text_sound_on {left: 72px;display:none;pointer-events:none;}

#zoom_in {background-image: url(resources/menu-ico/zoom-in.svg);background-size: 20px;background-position: 50% 50%;}
#zoom_out {background-image: url(resources/menu-ico/zoom-out.svg);background-size: 20px;background-position: 50% 50%;}
#zoom_out:hover, #zoom_in:hover {box-shadow: 0 0 0 3px #ffffff61;cursor: pointer;}

#text_zoomin {left: 226px;display:none;}
#text_zoomout {left: 280px;display:none;}
.en #text_zoomin {left: 230px;display:none;}
.en #text_zoomout {left: 280px;display:none;}

.navigation_wrap {background-size: 24px;}
.brmn .tooltip {width: max-content;transform: translateX(-50%);border-radius: 6px;position:absolute;top: -42px;background-color: rgb(0 0 0 / 60%);color: #ffffff;font-family: 'e-Ukraine-Bold';font-size: 14px;line-height: 1;padding: 8px 14px 9px 14px;text-align: center;z-index: 1;}
.navigation_wrap.disbld {opacity: 0.5;}
.navigation_wrap.enbld {opacity:1;}
.navigation_wrap.show {opacity:0;visibility: hidden;}

#navi_prev {background-image: url(resources/menu-ico/shevron-bold-white.svg);background-position: 10px 50%;transform: scaleX(-1);}
#navi_next {background-image: url(resources/menu-ico/shevron-bold-white.svg);background-position: 10px 50%;}
#navi_prev.enbld:hover, #navi_next.enbld:hover {box-shadow: 0 0 0 3px #ffffff61;cursor: pointer;}

#text_next {left: 172px;display:none;}
#text_prev {left: 120px;display:none;}
.en #text_next {left: 176px;display:none;}
.en #text_prev {left: 124px;display:none;}

.leftbar {position: absolute;bottom: 20px;left: 22px;z-index: 2;display: flex;align-items: center;justify-content: space-between;gap: 8px;}
.leftbar .icon {background-color: rgb(0 0 0 / 50%);width: 42px;height: 42px;border-radius: 50%;overflow: hidden;background-repeat: no-repeat;}
.leftbar .faq_b {background-image: url(resources/icon/faq/faq-white-normal.svg);background-size: 34px;background-position: 50% 50%;}
.leftbar .flscrn_b.on {background-image: url(resources/menu-ico/fullscreen-on.svg);background-size: 20px;background-position: 50% 50%;}
.leftbar .flscrn_b.off {background-image: url(resources/menu-ico/fullscreen-off.svg);background-size: 20px;background-position: 50% 50%;}
#flscrn:hover, #faq:hover {box-shadow: 0 0 0 3px #ffffff61;cursor: pointer;}

#text_flscrn_on {left: 70px;display:none;top: -42px;}
.en #text_flscrn_on {left: 54px;}
#text_flscrn_off {left: 110px;display:none;top: -42px;}
.en #text_flscrn_off {left: 70px;}
#text_faq {left: 74px;display:none;top: -42px;}

.leftbar .tooltip {width: max-content;transform: translateX(-50%);border-radius: 6px;position:absolute;top: -36px;background-color: rgb(0 0 0 / 60%);color: #ffffff;font-family: 'e-Ukraine-Bold';font-size: 14px;line-height: 1;padding: 8px 14px 9px 14px;text-align: center;z-index: 1;}

#guide_bar {z-index: 2;position:absolute;right: 30px;bottom: 30px;}
.guide_point{border-radius: 50%;width: 60px;height: 60px;box-sizing: border-box;box-shadow: 0px 0px 0px 3px #ffffff47;background-color: rgb(0 0 0 / 50%);background-image: url(resources/icon/audio/headphone.svg);background-size: 28px;background-position: 50% 14px;background-repeat: no-repeat;}
.guide_point:hover {box-shadow: 0px 0px 0px 4px #ffffff47;cursor:pointer;background-color: rgb(0 0 0 / 60%);}

.guide_point.on::before,
.guide_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;}

.guide_point.on::before {animation: pulse-animation 1.2s infinite ease-out;}
.guide_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;}
}

#guide_bar .tooltip {transform: translateX(-50%);border-radius: 6px;position:absolute;top: -66px;background-color: rgb(0 0 0 / 60%);color: #ffffff;font-family: 'e-Ukraine-Bold';
font-size: 14px;line-height: 1.3;padding: 8px 14px 9px 14px;text-align: center;z-index: 1;
width: max-content;left: -36px;display: none;pointer-events: none;}



@media (hover: none) {
#text_next, #text_prev, #text_zoomin, #text_zoomout, #text_sound_off, #text_sound_on, #text_flscrn_on, #text_flscrn_off, #text_faq, #guide_bar .tooltip {visibility:hidden;display: none !important;}
}

/* 1010 */
@media screen and (max-width: 1010px) {
#navi_next.enbld:hover, #navi_prev.enbld:hover, #sound:hover, #flscrn:hover, #faq:hover  {cursor: default;box-shadow:none;}
#text_next, #text_prev, #text_bookinfo, #text_sound_on, #text_sound_off, #text_flscrn_on, #text_flscrn_off, #text_faq, #guide_bar .tooltip {visibility:hidden;display: none !important;}
.bookinfo-button div:hover {cursor: default;box-shadow:none;}
#zoom_in, #zoom_out {display:none;}
#sound {order: 4;display: flex;}
.barmenu-wrap, .leftbar {bottom: 16px;}
#guide_bar {bottom: 20px;}
}


/* 760px */
@media screen and (max-width: 760px) {
.leftbar {display: none;}
}

/* 520px */
@media screen and (max-width: 520px) {
.barmenu-wrap {left: 126px; bottom: 20px;}
#sound {order:0;}
}

/* 440px */
@media screen and (max-width: 440px) {
.barmenu-wrap {left: 120px;bottom: 16px;}
#guide_bar {bottom: 18px;right: 22px;}
.guide_point {width: 50px;height: 50px; background-size: 24px; background-position: 50% 12px;}
}

/* 360px */
@media screen and (max-width: 360px) {
#guide_bar {bottom: 16px;right: 20px;}
}