.img-pre__container{position:fixed;left:0;right:0;top:0;bottom:0;width:100vw;height:100vh;font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;z-index:1040;pointer-events:none;display:none}
.img-pre__container .img-pre__header{box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;height:55px;width:100%;padding:0 calc(25px + (100vw - 100%)) 0 25px;background:rgba(0, 0, 0, var(--header-bg-opcity));position:absolute;z-index:1040}
.img-pre__container .img-pre__header .img-pre__nums{color:#fff}
.img-pre__container .img-pre__header .img-pre__button-item{outline:none;border:none;background:none;width:30px;height:30px;border-radius:4px;margin-right:1.5vw;display:inline-flex;justify-content:center;align-items:center;position:relative;color:#fff}.img-pre__container .img-pre__header .img-pre__button-item .bi,.img-pre__container .img-pre__header .img-pre__button-item svg{font-size:16px;width:16px;height:16px}.img-pre__container .img-pre__header .img-pre__button-item:last-child{margin-right:0}.img-pre__container .img-pre__header button:not(:disabled){cursor:pointer}.img-pre__container .img-pre__header button:not(:disabled)::after{content:attr(data-tooltip);font-size:12px;position:absolute;left:50%;top:130%;transform:translateX(-50%);background:rgba(0,0,0,0.9);padding:3px 7px;white-space:nowrap;border-radius:4px;display:none}.img-pre__container .img-pre__header button:not(:disabled):hover::after{display:inline-block}.img-pre__container .img-pre__header button:not(:disabled):hover{background:rgba(0,0,0,0.2)}.img-pre__container .img-pre__header button[disabled]{opacity:.4;cursor:not-allowed !important}.img-pre__container .img-pre__content-wrapper{height:100%;position:relative}.img-pre__container .img-pre__content-wrapper .img-pre__img-item{width:100%;height:100%;position:absolute;top:0;animation-duration:.3s;will-change:transform, opacity;animation-timing-function:ease-in-out}.img-pre__container .img-pre__content-wrapper .img-pre__img-item.slide-left-out{animation-name:img-pre_slide-left-hide}.img-pre__container .img-pre__content-wrapper .img-pre__img-item.slide-left-in{animation-name:img-pre_slide-left-show}.img-pre__container .img-pre__content-wrapper .img-pre__img-item.slide-right-out{animation-name:img-pre_slide-right-hide}.img-pre__container .img-pre__content-wrapper .img-pre__img-item.slide-right-in{animation-name:img-pre_slide-right-show}.img-pre__container .img-pre__content-wrapper .img-pre__img-item.loading::after{content:'';display:inline-block;width:40px;height:40px;background:url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJsb2FkZXItMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiCiAgIHdpZHRoPSI0MHB4IiBoZWlnaHQ9IjQwcHgiIHZpZXdCb3g9IjAgMCA0MCA0MCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgNDAgNDAiIHhtbDpzcGFjZT0icHJlc2VydmUiPgogIDxwYXRoIG9wYWNpdHk9IjAuMiIgZmlsbD0iI2NjYyIgZD0iTTIwLjIwMSw1LjE2OWMtOC4yNTQsMC0xNC45NDYsNi42OTItMTQuOTQ2LDE0Ljk0NmMwLDguMjU1LDYuNjkyLDE0Ljk0NiwxNC45NDYsMTQuOTQ2CiAgICBzMTQuOTQ2LTYuNjkxLDE0Ljk0Ni0xNC45NDZDMzUuMTQ2LDExLjg2MSwyOC40NTUsNS4xNjksMjAuMjAxLDUuMTY5eiBNMjAuMjAxLDMxLjc0OWMtNi40MjUsMC0xMS42MzQtNS4yMDgtMTEuNjM0LTExLjYzNAogICAgYzAtNi40MjUsNS4yMDktMTEuNjM0LDExLjYzNC0xMS42MzRjNi40MjUsMCwxMS42MzMsNS4yMDksMTEuNjMzLDExLjYzNEMzMS44MzQsMjYuNTQxLDI2LjYyNiwzMS43NDksMjAuMjAxLDMxLjc0OXoiLz4KICA8cGF0aCBmaWxsPSIjY2NjIiBkPSJNMjYuMDEzLDEwLjA0N2wxLjY1NC0yLjg2NmMtMi4xOTgtMS4yNzItNC43NDMtMi4wMTItNy40NjYtMi4wMTJoMHYzLjMxMmgwCiAgICBDMjIuMzIsOC40ODEsMjQuMzAxLDkuMDU3LDI2LjAxMywxMC4wNDd6Ij4KICAgIDxhbmltYXRlVHJhbnNmb3JtIGF0dHJpYnV0ZVR5cGU9InhtbCIKICAgICAgYXR0cmlidXRlTmFtZT0idHJhbnNmb3JtIgogICAgICB0eXBlPSJyb3RhdGUiCiAgICAgIGZyb209IjAgMjAgMjAiCiAgICAgIHRvPSIzNjAgMjAgMjAiCiAgICAgIGR1cj0iMXMiCiAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIi8+CiAgICA8L3BhdGg+CiAgPC9zdmc+') no-repeat center center / cover;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.img-pre__container .img-pre__content-wrapper img{cursor:pointer;position:absolute;transition:all .5s;will-change:transform;transform:translateX(var(--offsetX)) translateY(var(--offsetY)) translateZ(0) scale(var(--scale)) rotate(var(--rotate));user-select:none}.img-pre__container #J-img-pre__prev,.img-pre__container #J-img-pre__next{background:none;border:none;outline:none;position:fixed;top:50%;color:#f6f6f6;cursor:pointer;z-index:1040;display:flex;align-items:center;justify-content:center;padding:7px 5px;border-radius:2px}.img-pre__container #J-img-pre__prev .bi,.img-pre__container #J-img-pre__next .bi{font-size:20px;width:20px;height:20px}.img-pre__container #J-img-pre__prev:hover,.img-pre__container #J-img-pre__next:hover{background:rgba(0,0,0,0.2)}.img-pre__container #J-img-pre__prev{left:2%}.img-pre__container #J-img-pre__next{right:calc(2% + 100vw - 100%)}.img-pre__container .moving{transition:none !important}.img-pre__container.show{animation-name:img-pre_show;pointer-events:auto}.img-pre__container.show .img-pre__header{animation-name:img-pre_header-show}.img-pre__container.hide{animation-name:img-pre_hide}.img-pre__container.hide .img-pre__header{animation-name:img-pre_header-hide}.img-pre__container.hide img.img-pre__animated{animation-name:img-pre_header-hide}.img-pre__animated{-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-fill-mode:both;animation-fill-mode:both}@keyframes img-pre_show{0%{background:rgba(0,0,0,0)}100%{background:rgba(0, 0, 0, var(--container-opacity))}}@keyframes img-pre_hide{0%{background:rgba(0, 0, 0, var(--container-opacity))}100%{background:rgba(0,0,0,0)}}@keyframes img-pre_header-show{0%{opacity:0}100%{opacity:1}}@keyframes img-pre_header-hide{0%{opacity:1}100%{opacity:0}}@keyframes img-pre_slide-left-hide{0%{transform:translateX(0);opacity:1}100%{transform:translateX(-90%);opacity:0}}@keyframes img-pre_slide-left-show{0%{transform:translateX(90%);opacity:0}100%{transform:translateX(0);opacity:1}}@keyframes img-pre_slide-right-hide{0%{transform:translateX(0);opacity:1}100%{transform:translateX(90%);opacity:0}}@keyframes img-pre_slide-right-show{0%{transform:translateX(-90%);opacity:0}100%{transform:translateX(0);opacity:1}}