.gallery-viewer .viewer-control .control-button,
.gallery-viewer .viewer-header .btn-round {
 display: -ms-grid;
 display: grid;
 place-items: center;
 background: none;
 border: none;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 padding: 0
}

.gallery-viewer .btn-copy:before,
.gallery-viewer .viewer-control .control-button:after,
.gallery-viewer .viewer-header .btn-round:after,
.gallery-viewer .x-post:before {
 content: "";
 display: block;
 background-repeat: no-repeat;
 background-position: center;
 background-size: cover
}

* {
 -webkit-tap-highlight-color: transparent
}

.gallery-viewer {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 justify-content: center;
 width: 100%;
 min-height: 100dvh;
 color: #fff;
 background: #282829;
 font-family: sans-serif;
 padding: 30px;
 margin: 0;
 -webkit-box-sizing: border-box;
 box-sizing: border-box
}

.gallery-viewer .gallery-viewer_inner {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 justify-content: center;
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
 width: 100%;
 height: auto
}

.gallery-viewer main {
 width: 100%
}

.gallery-viewer button {
 cursor: pointer
}

.gallery-viewer .x-post {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 justify-content: center;
 color: #fff;
 background: #000;
 border: none;
 border-radius: 45px;
 -webkit-transition: opacity 0.3s ease;
 transition: opacity 0.3s ease
}

.gallery-viewer .x-post:before {
 background-image: url(../img/viewer/icon-x.svg)
}

.gallery-viewer .x-post:hover {
 opacity: 0.65
}

.gallery-viewer .btn-copy {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 justify-content: center;
 color: #fff;
 background: #000;
 border: none;
 border-radius: 45px;
 -webkit-transition: opacity 0.3s ease;
 transition: opacity 0.3s ease
}

.gallery-viewer .btn-copy:before {
 background-image: url(../img/viewer/icon-copy.svg)
}

.gallery-viewer .btn-copy:hover {
 opacity: 0.65
}

.gallery-viewer .viewer-container {
 width: 100%;
 max-width: 1280px;
 margin-left: auto;
 margin-right: auto
}

.gallery-viewer .viewer-header {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: start;
 -ms-flex-align: start;
 align-items: start;
 -webkit-box-pack: justify;
 -ms-flex-pack: justify;
 justify-content: space-between;
 -ms-flex-wrap: wrap-reverse;
 flex-wrap: wrap-reverse;
 margin-bottom: 30px
}

.gallery-viewer .viewer-header .viewer-title_wrap {
 display: -ms-grid;
 display: grid
}

.gallery-viewer .viewer-header .viewer-title {
 font-size: 28px;
 margin-bottom: 15px
}

.gallery-viewer .viewer-header .viewer-meta_wrap {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
 gap: 10px 30px
}

.gallery-viewer .viewer-header .viewer-meta_wrap .viewer-meta {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 gap: 15px
}

.gallery-viewer .viewer-header .viewer-meta_wrap .viewer-label {
 display: -ms-grid;
 display: grid;
 place-items: center;
 width: 95px;
 height: 24px;
 font-size: 12px;
 line-height: 1;
 white-space: nowrap;
 border: 1px solid currentColor
}

.gallery-viewer .viewer-header .viewer-actions {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 -webkit-box-pack: end;
 -ms-flex-pack: end;
 justify-content: end;
 gap: 10px
}

.gallery-viewer .viewer-header .x-post {
 gap: 5px;
 width: 110px;
 height: 40px;
 padding-left: 10px;
 padding-right: 15px
}

.gallery-viewer .viewer-header .x-post:before {
 width: 28px;
 height: 28px
}

.gallery-viewer .viewer-header .btn-copy {
 gap: 5px;
 width: 110px;
 height: 40px;
 padding-left: 10px;
 padding-right: 15px
}

.gallery-viewer .viewer-header .btn-copy:before {
 width: 32px;
 height: 32px
}

.gallery-viewer .viewer-header .btn-round {
 width: 40px !important;
 height: 40px !important;
 border: 1.5px solid #fff;
 border-radius: 50%;
 -webkit-transition: background-color 0.3s ease, opacity 0.3s ease;
 transition: background-color 0.3s ease, opacity 0.3s ease
}

.gallery-viewer .viewer-header .btn-round:after {
 width: 28px;
 height: 28px
}

.gallery-viewer .viewer-header .btn-round:hover {
 background: #fff
}

.gallery-viewer .viewer-header .btn-home {
 text-decoration: none
}

.gallery-viewer .viewer-header .btn-home:after {
 background-image: url(../img/viewer/icon-home.svg)
}

.gallery-viewer .viewer-header .btn-home:hover:after {
 background-image: url(../img/viewer/icon-home_bk.svg)
}

.gallery-viewer .viewer-header .btn-close:after {
 background-image: url(../img/viewer/icon-close.svg)
}

.gallery-viewer .viewer-header .btn-close:hover:after {
 background-image: url(../img/viewer/icon-close_bk.svg)
}

.gallery-viewer .viewer-main {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 justify-content: center;
 -webkit-box-align: stretch;
 -ms-flex-align: stretch;
 align-items: stretch;
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
 gap: 20px
}

.gallery-viewer .viewer-main .viewer-book {
 width: 100%;
 min-width: 0;
 height: auto
}

.gallery-viewer .viewer-main .page-info {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 -webkit-box-pack: justify;
 -ms-flex-pack: justify;
 justify-content: space-between;
 margin-bottom: 10px;
 font-size: 13px;
 color: #fff
}

.gallery-viewer .viewer-main .page-info .page-info_center {
 padding: 2px 5px 3px;
 background: #fff;
 color: #000
}

.gallery-viewer .viewer-main .book-swiper {
 width: 100%;
 height: auto
}

.gallery-viewer .viewer-main .book-swiper .swiper-wrapper {
 height: 55vh;
 background: #141414;
 margin-bottom: 10px;
 overflow: hidden
}

.gallery-viewer .viewer-main .book-swiper .swiper-slide {
 height: 100%
}

.gallery-viewer .viewer-main .book-swiper .swiper-slide-active {
 z-index: 1
}

.gallery-viewer .viewer-main .book-swiper .swiper-zoom-container {
 width: 100%;
 height: 100%
}

.gallery-viewer .viewer-main .book-swiper .swiper-zoom-target {
 width: 100%;
 height: 100%;
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: stretch;
 -ms-flex-align: stretch;
 align-items: stretch;
 -webkit-box-pack: stretch;
 -ms-flex-pack: stretch;
 justify-content: stretch;
 gap: 0;
 overflow: hidden
}

.gallery-viewer .viewer-main .book-swiper .swiper-zoom-target img {
 width: 50%;
 height: 100%;
 -webkit-box-flex: 1;
 -ms-flex: 1 1 50%;
 flex: 1 1 50%;
 -o-object-fit: contain;
 object-fit: contain;
 -o-object-position: center;
 object-position: center;
 display: block;
 max-width: none;
 max-height: none
}

.gallery-viewer .viewer-main .book-swiper .swiper-zoom-target img:first-child {
 -o-object-position: center right;
 object-position: center right
}

.gallery-viewer .viewer-main .book-swiper .swiper-zoom-target img:last-child {
 -o-object-position: center left;
 object-position: center left
}

.gallery-viewer .viewer-main .book-swiper .swiper-zoom-target.cover {
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 justify-content: center
}

.gallery-viewer .viewer-main .book-swiper .swiper-zoom-target.cover img {
 width: 100%;
 -webkit-box-flex: 1;
 -ms-flex: 1 1 0px;
 flex: 1 1 0;
 -o-object-position: center !important;
 object-position: center !important
}

.gallery-viewer .viewer-main .thumb-panel {
 width: 100%;
 height: auto;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 overflow: hidden
}

.gallery-viewer .viewer-main .thumb-panel .thumb-swiper {
 padding-bottom: 15px;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 position: relative
}

.gallery-viewer .viewer-main .thumb-panel .thumb-swiper .swiper-wrapper {
 gap: 8px
}

.gallery-viewer .viewer-main .thumb-panel .thumb-swiper .swiper-slide {
 display: -ms-grid;
 display: grid;
 width: auto;
 height: auto !important;
 margin: 0 !important;
 cursor: pointer
}

.gallery-viewer .viewer-main .thumb-panel .thumb-swiper .swiper-slide.spread {
 -ms-grid-columns: 1fr 1fr;
 grid-template-columns: 1fr 1fr
}

.gallery-viewer .viewer-main .thumb-panel .thumb-swiper .swiper-slide.swiper-slide-thumb-active {
 outline: 4px solid #5EACDB;
 outline-offset: -4px
}

.gallery-viewer .viewer-main .thumb-panel .thumb-swiper .swiper-slide img {
 display: block;
 width: 100%;
 height: auto
}

.gallery-viewer .viewer-main .thumb-panel .thumb-swiper .swiper-scrollbar {
 width: 100%;
 height: 5px;
 background: #fff;
 border-radius: 10px;
 position: absolute;
 left: 0;
 bottom: 0
}

.gallery-viewer .viewer-main .thumb-panel .thumb-swiper .swiper-scrollbar .swiper-scrollbar-drag {
 background: #9e9e9e
}

.gallery-viewer .viewer-control {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 -webkit-box-pack: end;
 -ms-flex-pack: end;
 justify-content: flex-end;
 gap: 5px;
 cursor: pointer
}

.gallery-viewer .viewer-control .control-button {
 width: 40px;
 height: 40px;
 -webkit-transition: opacity 0.3s ease;
 transition: opacity 0.3s ease
}

.gallery-viewer .viewer-control .control-button:after {
 width: 40px;
 height: 40px
}

.gallery-viewer .viewer-control .control-button:hover {
 opacity: 0.65
}

.gallery-viewer .viewer-control .control-pre:after {
 background-image: url(../img/viewer/icon-pre.svg)
}

.gallery-viewer .viewer-control .control-next:after {
 background-image: url(../img/viewer/icon-next.svg)
}

@media (max-width:992px) {
 .gallery-viewer {
  padding: 15px !important
 }

 .gallery-viewer .viewer-header {
  margin-bottom: 15px
 }

 .gallery-viewer .viewer-header .btn-copy,
 .gallery-viewer .viewer-header .x-post {
  width: 100px;
  height: 35px
 }

 .gallery-viewer .viewer-header .btn-copy:before,
 .gallery-viewer .viewer-header .x-post:before {
  width: 25px;
  height: 25px
 }

 .gallery-viewer .viewer-header .btn-round {
  width: 35px !important;
  height: 35px !important
 }

 .gallery-viewer .viewer-header .btn-round:after {
  width: 25px;
  height: 25px
 }

 .gallery-viewer .viewer-header .viewer-actions {
  width: 100%
 }

 .gallery-viewer .viewer-main .page-info {
  margin-bottom: 5px;
  font-size: 11px
 }

 .gallery-viewer .viewer-main .page-info .page-info_center {
  padding: 0 5px 2px
 }

 .gallery-viewer .viewer-main .book-swiper .swiper-wrapper {
  height: 70vh;
  height: 80dvh
 }

 .gallery-viewer .viewer-control .control-button {
  width: 30px;
  height: 30px
 }

 .gallery-viewer .viewer-control .control-button:after {
  width: 30px;
  height: 30px
 }
}

.gallery-viewer.is-sp-landscape .viewer-header .viewer-title {
 font-size: 15px
}

.gallery-viewer.is-sp-landscape .viewer-header .viewer-meta_wrap {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 gap: 15px
}

.gallery-viewer.is-sp-landscape .viewer-header .viewer-meta_wrap .viewer-meta {
 font-size: 11px;
 gap: 8px
}

.gallery-viewer.is-sp-landscape .viewer-header .viewer-meta_wrap .viewer-label {
 width: auto;
 height: auto;
 font-size: 8px;
 line-height: 1;
 padding: 5px 8px
}

.gallery-viewer.is-sp-landscape .viewer-header .viewer-actions {
 width: auto
}

.gallery-viewer.is-sp-landscape .viewer-main {
 gap: 25px
}

.gallery-viewer.is-sp-landscape .viewer-main .viewer-book {
 width: calc(100% - 125px);
 height: -webkit-fit-content;
 height: -moz-fit-content;
 height: fit-content
}

.gallery-viewer.is-sp-landscape .viewer-main .thumb-panel {
 width: 100px;
 height: 100%
}

.gallery-viewer.is-sp-landscape .viewer-main .thumb-panel .thumb-swiper {
 padding-bottom: 0;
 padding-right: 12px
}

.gallery-viewer.is-sp-landscape .viewer-main .thumb-panel .thumb-swiper .swiper-wrapper .swiper-slide {
 width: 100% !important
}

.gallery-viewer.is-sp-landscape .viewer-main .thumb-panel .thumb-swiper .swiper-wrapper .swiper-slide.spread {
 -ms-grid-columns: 1fr 1fr;
 grid-template-columns: 1fr 1fr
}

.gallery-viewer.is-sp-landscape .viewer-main .thumb-panel .thumb-swiper .swiper-wrapper .swiper-slide img {
 display: block;
 width: 100%;
 height: auto
}

.gallery-viewer.is-sp-landscape .viewer-main .thumb-panel .thumb-swiper .swiper-scrollbar {
 width: 5px;
 height: 100%;
 left: auto;
 right: 0;
 top: 0;
 bottom: auto
}

.gallery-viewer.is-sp-portrait {
 padding: 15px
}

.gallery-viewer.is-sp-portrait .viewer-header {
 margin-bottom: 20px
}

.gallery-viewer.is-sp-portrait .viewer-header .viewer-title_wrap {
 gap: 15px
}

.gallery-viewer.is-sp-portrait .viewer-header .viewer-title {
 font-size: 24px
}

.gallery-viewer.is-sp-portrait .viewer-header .viewer-meta_wrap .viewer-meta {
 gap: 10px;
 font-size: 14px
}

.gallery-viewer.is-sp-portrait .viewer-header .viewer-meta_wrap .viewer-label {
 width: 80px;
 height: 22px;
 font-size: 10px
}

.gallery-viewer.is-sp-portrait .viewer-header .viewer-actions {
 width: 100%;
 -webkit-box-pack: end;
 -ms-flex-pack: end;
 justify-content: flex-end;
 margin-bottom: 10px
}

.gallery-viewer.is-sp-portrait .viewer-header .viewer-actions .btn-round {
 width: 30px !important;
 height: 30px !important
}

.gallery-viewer.is-sp-portrait .viewer-header .viewer-actions .btn-round:after {
 width: 23px;
 height: 23px
}

.gallery-viewer.is-sp-portrait .viewer-main {
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
 gap: 15px
}

.gallery-viewer.is-sp-portrait .viewer-main .viewer-book {
 width: 100%
}

.gallery-viewer.is-sp-portrait .viewer-main .page-info {
 font-size: 11px
}

.gallery-viewer.is-sp-portrait .viewer-main .book-swiper .swiper-wrapper {
 height: 50vh
}

.gallery-viewer.is-sp-portrait .viewer-main .thumb-panel .swiper-slide.swiper-slide-thumb-active {
 outline: 3px solid #5EACDB;
 outline-offset: -3px
}

.gallery-viewer.is-sp-portrait .viewer-control .control-button {
 width: 35px;
 height: 35px
}

.gallery-viewer.is-sp-portrait .viewer-control .control-button:after {
 width: 28px;
 height: 28px
}

/*# sourceMappingURL=gallery.viewer.css.map */