:root {
  --main-color: #00c8af;
  --font-color: #999;
}

:root {
  --editor-main-color: #00c8af;
  --editor-font-color: #999;
  --editor-toolbox-top: 0;
  --editor-toolbox-left: 0;
  --editor-toolbox-width: 240px;
  --editor-toolbox-padding: 0 10px;
  --editor-menu-active: rgba(0, 200, 175, 0.16);
  --colors-primary-base: var(--editor-main-color);
  --colors-primary-click: #005046;
}

:root {
  --colors-primary-fill: 255, 255, 255;
  --colors-primary-base-fill: 0, 200, 175;
  --colors-primary-base: rgb(var(--colors-primary-base-fill));
  --colors-primary-hover: #4dd8c7;
  --colors-primary-active: #008b7a;
  --colors-warn: #fa3f48;
  --colors-color: #999;
  --colors-border-color: rgba(var(--colors-primary-fill), 0.16);
  --colors-content-color: rgb(--colors-primary-fill);
  --colors-normal-back: rgba(var(--colors-primary-fill), 0.1);
  --colors-normal-base: rgba(var(--colors-primary-fill), 0.4);
  --colors-normal-hover: rgba(var(--colors-primary-fill), 1);
  --colors-normal-click: var(--colors-primary-click);
  --colors-normal-fill-back: var(--colors-normal-back);
  --colors-normal-fill-base: var(--colors-normal-base);
  --colors-normal-fill-hover: var(--colors-normal-hover);
  --colors-normal-fill-click: var(--colors-primary-click);
  --colors-error-fill: 250, 63, 72;
  --small-size: 12px;
  --medium-size: 14px;
  --big-size: 16px;
  --color-main-normal: var(--colors-primary-base);
  --color-main-hover: var(--colors-primary-hover);
  --color-main-focus: var(--colors-primary-click);
  --editor-head-filter: blur(0px);
  --editor-head-height: 50px;
  --editor-head-back: rgba(20, 20, 20, 0.86);
  --editor-menu-filter: var(--editor-head-filter);
  --editor-menu-width: 80px;
  --editor-menu-left: 0px;
  --editor-menu-right: 0px;
  --editer-menu-fill: 27, 27, 28;
  --editor-menu-back: rgba(var(--editer-menu-fill), 0.8);
  --editor-menu-active-back: rgba(var(--colors-primary-fill), 0.06);
  --editor-menu-color: #999;
  --editor-menu-active: hsla(0, 0%, 100%, 0.06);
  --editor-toolbox-top: var(--editor-head-height);
  --editor-toolbox-left: calc(var(--editor-menu-left) + var(--editor-menu-width));
  --editor-toolbox-width: 340px;
  --editor-toolbox-back: var(--editor-menu-back);
  --editor-toolbox-padding: 20px;
  --editor-toolbar-height: 60px;
}

:root {
  --main-color: #00c8af;
  --font-color: #999;
}

[x-cloak] {
  display: none !important;
}

*, ::before, ::after {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  text-rendering: optimizeLegibility !important;
  -webkit-font-smoothing: antialiased !important;
}

.kankan-app {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: #292929;
}

.kankan-app .player {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  overflow: hidden;
}

.kankan-app .player[name='copy'] {
  display: none;
}

.kankan-app .player-mark {
  display: none;
  cursor: grab;
  position: absolute;
  left: calc(50% - 56px);
  top: calc(50% - 56px);
  z-index: 999;
  width: 102px;
  height: 102px;
}

.kankan-app__split .player {
  cursor: crosshair;
}

.kankan-app__split .player[name='main'] {
  width: calc(50% - 1px);
}

.kankan-app__split .player[name='copy'] {
  width: calc(50% - 1px);
  display: block;
  left: auto;
  right: 0;
}

.kankan-app__split .player-mark {
  display: block;
}

.kankan-app__split [xui_tags] div {
  display: none !important;
}

.kankan-app__slide-right {
  will-change: transform;
  transition: all 0.2s ease-in-out;
}

.kankan-app__slide-right-enter {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.kankan-app__slide-right-leave {
  opacity: 0;
  transform: translate3d(100%, 0, 0);
}

/* plugins */
.kankan-plugins input {
  padding: 0 5px;
  width: 100%;
  height: 34px;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  outline: none;
  color: #fff;
}

.kankan-plugins input:focus {
  border: 1px solid var(--main-color);
}

.kankan-plugins button {
  cursor: pointer;
  width: 100%;
  height: 34px;
  outline: none;
  border-radius: 4px;
  font-size: 14px;
  background: none !important;
  transition: all 0.3s ease;
  color: var(--main-color);
  border: 1px solid var(--main-color);
}

/* xui */
.kankan-app_combox {
  cursor: pointer;
  position: relative;
  background: #323233;
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  outline: none;
  color: #fff;
  height: 34px;
  width: 100%;
}

.kankan-app_combox .inner-icon {
  cursor: pointer;
  font-size: 12px;
  position: absolute;
  right: 5px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--font-color);
}

.kankan-app_combox .inner-text {
  display: flex;
  align-items: center;
  padding: 0 5px;
  height: 100%;
}

.kankan-app_combox .inner-list {
  position: absolute;
  left: 0px;
  right: 0px;
  top: 100%;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: #323233;
  z-index: 1000;
}

.kankan-app_combox .inner-list > div {
  height: 34px;
  display: flex;
  align-items: center;
  padding: 0 5px;
}

.kankan-app_combox .inner-list > div:hover {
  color: var(--main-color);
}

#compass {
  display: none;
  position: absolute;
  width: 90px;
  height: 90px;
  pointer-events: none;
}

#compass .north {
  color: #02a0e9;
  top: 0;
}

#compass .south {
  color: #ff1414;
  bottom: 0;
}

#compass .dirText {
  text-align: center;
  font-size: 10px;
  position: absolute;
  line-height: 25px;
  color: rgb(255, 255, 255);
  top: 50%;
  left: 50%;
  width: 45%;
  height: 0px;
  transform-origin: left center;
}

#compass .dirText span {
  display: block;
  position: absolute;
  right: 5px;
  top: 0;
  width: 20px;
  height: 20px;
  line-height: 20px;
  margin-top: -10px;
}

#compass .center {
  width: 50px;
  height: 50px;
  background-size: contain;
  background-position: center;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: absolute;
}

#compass .center canvas {
  position: relative;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: block;
  background-color: transparent;
}

.widgets-doll-labels a, .widgets-plan-labels a, .widgets-doors a {
  color: #fff;
  font-size: 14px;
  line-height: normal;
  font-family: OpenSans, sans-serif;
  user-select: none;
}

.widgets-doll-labels .room-label {
  position: absolute;
  width: 0;
  height: 0;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: room-label 0.3s ease 0.1s;
  animation: room-label 0.3s ease 0.1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  cursor: pointer;
}

.widgets-doll-labels .room-label:not(.noLine):after {
  content: "";
  display: block;
  position: absolute;
  width: 4px;
  height: 68px;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAABQCAYAAADYxx/bAAAASElEQVQYlY2QwQoAIAhDR///x6Z2CCaGSpfHNoegcHdfAGwBCKVUMdAMK7IKm2Wh2oSOdkaUhVbG3u++x7aqPbX9lWVEdn9/AGvVUp4wTpLmAAAAAElFTkSuQmCC");
  background-size: contain;
  background-repeat: no-repeat;
  bottom: 0;
  left: 50%;
  -webkit-transform: translate(-50%);
  transform: translate(-50%);
}

.widgets-doll-labels .room-label a {
  display: block;
  position: absolute;
  line-height: 22px;
  top: -66px;
  transform: translate(-50%, -100%);
  text-align: center;
  white-space: nowrap;
  font-size: 12px;
  font-style: normal;
  pointer-events: auto;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background: rgba(210, 210, 210, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 3px;
  text-shadow: 0px 1px 3px rgb(0, 0, 0, 0.5);
}

.widgets-doll-labels .room-label a::before {
  content: "";
  position: absolute;
  left: -1px;
  top: -1px;
  width: 10px;
  height: 10px;
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iNnB4IiBoZWlnaHQ9IjZweCIgdmlld0JveD0iMCAwIDYgNiIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDx0aXRsZT5tYXBfY29ybmVyICA8L3RpdGxlPgogICAgPGcgaWQ9Iumhtemdoi0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMyIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyBpZD0i5bGV56S655WM6Z2iLeS4iee7tCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTU2LjAwMDAwMCwgLTI3MC4wMDAwMDApIiBmaWxsPSIjRkZGRkZGIiBmaWxsLXJ1bGU9Im5vbnplcm8iPgogICAgICAgICAgICA8ZyBpZD0i57yW57uELTE1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzMS4wMDAwMDAsIDI3MC4wMDAwMDApIj4KICAgICAgICAgICAgICAgIDxnIGlkPSLlvaLnirbnu5PlkIgtKy3lvaLnirbnu5PlkIgt6JKZ54mIIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNS4wMDAwMDAsIDAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTYsNiBMNSw2IEw1LDIuNzA1IEwzLjMwMSwxIEwwLDEgTDAsMCBMMy43MTUyMjY0MSwwIEw2LDIuMjkzNDQ3OTUgTDYsNiBaIiBpZD0ibWFwX2Nvcm5lci0tIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzLjAwMDAwMCwgMy4wMDAwMDApIHNjYWxlKC0xLCAxKSB0cmFuc2xhdGUoLTMuMDAwMDAwLCAtMy4wMDAwMDApICI+PC9wYXRoPgogICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=);
  background-repeat: no-repeat;
  background-position: top left;
}

.widgets-doll-labels .room-label a::after {
  content: "";
  position: absolute;
  left: -1px;
  bottom: -1px;
  width: 10px;
  height: 10px;
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iNnB4IiBoZWlnaHQ9IjZweCIgdmlld0JveD0iMCAwIDYgNiIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDx0aXRsZT5tYXBfY29ybmVyICA8L3RpdGxlPgogICAgPGcgaWQ9Iumhtemdoi0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMyIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyBpZD0i5bGV56S655WM6Z2iLeS4iee7tCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTU2LjAwMDAwMCwgLTI3MC4wMDAwMDApIiBmaWxsPSIjRkZGRkZGIiBmaWxsLXJ1bGU9Im5vbnplcm8iPgogICAgICAgICAgICA8ZyBpZD0i57yW57uELTE1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzMS4wMDAwMDAsIDI3MC4wMDAwMDApIj4KICAgICAgICAgICAgICAgIDxnIGlkPSLlvaLnirbnu5PlkIgtKy3lvaLnirbnu5PlkIgt6JKZ54mIIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNS4wMDAwMDAsIDAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTYsNiBMNSw2IEw1LDIuNzA1IEwzLjMwMSwxIEwwLDEgTDAsMCBMMy43MTUyMjY0MSwwIEw2LDIuMjkzNDQ3OTUgTDYsNiBaIiBpZD0ibWFwX2Nvcm5lci0tIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzLjAwMDAwMCwgMy4wMDAwMDApIHNjYWxlKC0xLCAxKSB0cmFuc2xhdGUoLTMuMDAwMDAwLCAtMy4wMDAwMDApICI+PC9wYXRoPgogICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=);
  background-repeat: no-repeat;
  background-position: top left;
  transform: rotate(270deg);
}

.widgets-doll-labels .room-label a > p {
  margin: 0;
  padding: 2px 10px;
  height: 100%;
  line-height: 1.5;
}

.widgets-doll-labels .room-label a > p::before {
  content: "";
  position: absolute;
  right: -1px;
  top: -1px;
  width: 10px;
  height: 10px;
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iNnB4IiBoZWlnaHQ9IjZweCIgdmlld0JveD0iMCAwIDYgNiIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDx0aXRsZT5tYXBfY29ybmVyICA8L3RpdGxlPgogICAgPGcgaWQ9Iumhtemdoi0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMyIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyBpZD0i5bGV56S655WM6Z2iLeS4iee7tCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTU2LjAwMDAwMCwgLTI3MC4wMDAwMDApIiBmaWxsPSIjRkZGRkZGIiBmaWxsLXJ1bGU9Im5vbnplcm8iPgogICAgICAgICAgICA8ZyBpZD0i57yW57uELTE1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzMS4wMDAwMDAsIDI3MC4wMDAwMDApIj4KICAgICAgICAgICAgICAgIDxnIGlkPSLlvaLnirbnu5PlkIgtKy3lvaLnirbnu5PlkIgt6JKZ54mIIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNS4wMDAwMDAsIDAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTYsNiBMNSw2IEw1LDIuNzA1IEwzLjMwMSwxIEwwLDEgTDAsMCBMMy43MTUyMjY0MSwwIEw2LDIuMjkzNDQ3OTUgTDYsNiBaIiBpZD0ibWFwX2Nvcm5lci0tIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzLjAwMDAwMCwgMy4wMDAwMDApIHNjYWxlKC0xLCAxKSB0cmFuc2xhdGUoLTMuMDAwMDAwLCAtMy4wMDAwMDApICI+PC9wYXRoPgogICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=);
  background-repeat: no-repeat;
  background-position: top left;
  transform: rotate(90deg);
}

.widgets-doll-labels .room-label a > p::after {
  content: "";
  position: absolute;
  right: -1px;
  bottom: -1px;
  width: 10px;
  height: 10px;
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iNnB4IiBoZWlnaHQ9IjZweCIgdmlld0JveD0iMCAwIDYgNiIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDx0aXRsZT5tYXBfY29ybmVyICA8L3RpdGxlPgogICAgPGcgaWQ9Iumhtemdoi0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMyIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyBpZD0i5bGV56S655WM6Z2iLeS4iee7tCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTU2LjAwMDAwMCwgLTI3MC4wMDAwMDApIiBmaWxsPSIjRkZGRkZGIiBmaWxsLXJ1bGU9Im5vbnplcm8iPgogICAgICAgICAgICA8ZyBpZD0i57yW57uELTE1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzMS4wMDAwMDAsIDI3MC4wMDAwMDApIj4KICAgICAgICAgICAgICAgIDxnIGlkPSLlvaLnirbnu5PlkIgtKy3lvaLnirbnu5PlkIgt6JKZ54mIIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNS4wMDAwMDAsIDAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTYsNiBMNSw2IEw1LDIuNzA1IEwzLjMwMSwxIEwwLDEgTDAsMCBMMy43MTUyMjY0MSwwIEw2LDIuMjkzNDQ3OTUgTDYsNiBaIiBpZD0ibWFwX2Nvcm5lci0tIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzLjAwMDAwMCwgMy4wMDAwMDApIHNjYWxlKC0xLCAxKSB0cmFuc2xhdGUoLTMuMDAwMDAwLCAtMy4wMDAwMDApICI+PC9wYXRoPgogICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=);
  background-repeat: no-repeat;
  background-position: top left;
  transform: rotate(180deg);
}

.widgets-doll-labels .room-label.noLine a {
  top: 16px;
}

.widgets-doll-labels .room-label a span {
  white-space: nowrap;
  user-select: none;
}

.widgets-doll-labels .room-label.with-entrance:after {
  display: none;
}

.widgets-doll-labels .room-label.with-entrance a {
  top: 50%;
  width: 38.5px;
  height: 15.75px;
  background-size: 38.5px 15.75px;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.widgets-doll-labels .room-label.with-entrance a span {
  margin-left: -0.875px;
  margin-top: -0.875px;
}

.widgets-plan-labels .room-label {
  position: absolute;
  -webkit-animation: room-label 0.3s ease 0.1s;
  animation: room-label 0.3s ease 0.1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.widgets-plan-labels .room-label a {
  display: block;
  position: absolute;
  line-height: 24px;
  -webkit-transform: translate(-50%);
  transform: translate(-50%, -50%);
  text-align: center;
  white-space: nowrap;
  font-size: 14px;
  font-style: normal;
}

.widgets-doors {
  position: absolute;
  pointer-events: none;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

.widgets-doors[data-camera-toward=right] .door.show-arrow.right a:before, .widgets-doors[data-camera-toward=forward] .door.show-arrow.right a:before {
  margin-right: 3.5px;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.widgets-doors[data-camera-toward=right] .door.show-arrow.right a:before, .widgets-doors[data-camera-toward=forward] .door.show-arrow.forward a:before, .widgets-doors[data-camera-toward=forward] .door.show-arrow.left a:after, .widgets-doors[data-camera-toward=forward] .door.show-arrow.right a:before {
  content: "";
  position: relative;
  display: inline-block;
  width: 10.5px;
  height: 10.5px;
  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNCIgaGVpZ2h0PSIxMCIgdmlld0JveD0iMCAwIDE0IDEwIj4KICA8ZyBpZD0iaW1nX2Fycm93IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNzIxIC01OTMpIj4KICAgIDxwYXRoIGlkPSLot6/lvoRfMTQ0NSIgZGF0YS1uYW1lPSLot6/lvoQgMTQ0NSIgZD0iTTUyNS41OCw1MTAuNzczbC00LjczOC00LjU4OGEuNjIyLjYyMiwwLDAsMC0uNDM0LS4xNzNINTE3LjdhLjYyNS42MjUsMCwwLDEsLjQzNS4xNzNsNC43MzgsNC41ODhhLjM3LjM3LDAsMCwxLDAsLjU0bC00LjczOSw0LjUzMmEuNjIxLjYyMSwwLDAsMS0uNDMyLjE2N2gyLjcxMWEuNjIxLjYyMSwwLDAsMCwuNDMxLS4xNjdsNC43MzktNC41MzJBLjM3LjM3LDAsMCwwLDUyNS41OCw1MTAuNzczWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjA5LjMwMyA4Ni45ODkpIiBmaWxsPSIjZmZmIi8+CiAgICA8cGF0aCBpZD0i6Lev5b6EXzE0NDYiIGRhdGEtbmFtZT0i6Lev5b6EIDE0NDYiIGQ9Ik01MjUuNTgsNTEwLjc3M2wtNC43MzgtNC41ODhhLjYyMi42MjIsMCwwLDAtLjQzNC0uMTczSDUxNy43YS42MjUuNjI1LDAsMCwxLC40MzUuMTczbDQuNzM4LDQuNTg4YS4zNy4zNywwLDAsMSwwLC41NGwtNC43MzksNC41MzJhLjYyMS42MjEsMCwwLDEtLjQzMi4xNjdoMi43MTFhLjYyMS42MjEsMCwwLDAsLjQzMS0uMTY3bDQuNzM5LTQuNTMyQS4zNy4zNywwLDAsMCw1MjUuNTgsNTEwLjc3M1oiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIwMy4zMDMgODYuOTg5KSIgZmlsbD0iI2ZmZiIgb3BhY2l0eT0iMC41Ii8+CiAgPC9nPgo8L3N2Zz4K) no-repeat 50%;
  background-size: 100% 100%;
  vertical-align: middle;
}

.widgets-doors[data-camera-toward="forward"] .door.show-arrow.left a:after {
  margin-left: 4px;
}

.widgets-doors[data-camera-toward="forward"] .door.show-arrow.back a:after, .widgets-doors[data-camera-toward="right"] .door.show-arrow.left a:after {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 10.5px;
  height: 10.5px;
  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNCIgaGVpZ2h0PSIxMCIgdmlld0JveD0iMCAwIDE0IDEwIj4KICA8ZyBpZD0iaW1nX2Fycm93IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNzIxIC01OTMpIj4KICAgIDxwYXRoIGlkPSLot6/lvoRfMTQ0NSIgZGF0YS1uYW1lPSLot6/lvoQgMTQ0NSIgZD0iTTUyNS41OCw1MTAuNzczbC00LjczOC00LjU4OGEuNjIyLjYyMiwwLDAsMC0uNDM0LS4xNzNINTE3LjdhLjYyNS42MjUsMCwwLDEsLjQzNS4xNzNsNC43MzgsNC41ODhhLjM3LjM3LDAsMCwxLDAsLjU0bC00LjczOSw0LjUzMmEuNjIxLjYyMSwwLDAsMS0uNDMyLjE2N2gyLjcxMWEuNjIxLjYyMSwwLDAsMCwuNDMxLS4xNjdsNC43MzktNC41MzJBLjM3LjM3LDAsMCwwLDUyNS41OCw1MTAuNzczWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjA5LjMwMyA4Ni45ODkpIiBmaWxsPSIjZmZmIi8+CiAgICA8cGF0aCBpZD0i6Lev5b6EXzE0NDYiIGRhdGEtbmFtZT0i6Lev5b6EIDE0NDYiIGQ9Ik01MjUuNTgsNTEwLjc3M2wtNC43MzgtNC41ODhhLjYyMi42MjIsMCwwLDAtLjQzNC0uMTczSDUxNy43YS42MjUuNjI1LDAsMCwxLC40MzUuMTczbDQuNzM4LDQuNTg4YS4zNy4zNywwLDAsMSwwLC41NGwtNC43MzksNC41MzJhLjYyMS42MjEsMCwwLDEtLjQzMi4xNjdoMi43MTFhLjYyMS42MjEsMCwwLDAsLjQzMS0uMTY3bDQuNzM5LTQuNTMyQS4zNy4zNywwLDAsMCw1MjUuNTgsNTEwLjc3M1oiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIwMy4zMDMgODYuOTg5KSIgZmlsbD0iI2ZmZiIgb3BhY2l0eT0iMC41Ii8+CiAgPC9nPgo8L3N2Zz4K) no-repeat 50%;
  background-size: 100% 100%;
  margin-left: 4px;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

.widgets-doors[data-camera-toward=forward] .door.show-arrow.forward a:before, .widgets-doors[data-camera-toward=right] .door.show-arrow.back a:before {
  margin-right: 3.5px;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.widgets-doors[data-camera-toward="right"] .door.show-arrow.back a:before, .widgets-doors[data-camera-toward="right"] .door.show-arrow.forward a:after {
  content: "";
  position: relative;
  display: inline-block;
  width: 10.5px;
  height: 10.5px;
  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNCIgaGVpZ2h0PSIxMCIgdmlld0JveD0iMCAwIDE0IDEwIj4KICA8ZyBpZD0iaW1nX2Fycm93IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNzIxIC01OTMpIj4KICAgIDxwYXRoIGlkPSLot6/lvoRfMTQ0NSIgZGF0YS1uYW1lPSLot6/lvoQgMTQ0NSIgZD0iTTUyNS41OCw1MTAuNzczbC00LjczOC00LjU4OGEuNjIyLjYyMiwwLDAsMC0uNDM0LS4xNzNINTE3LjdhLjYyNS42MjUsMCwwLDEsLjQzNS4xNzNsNC43MzgsNC41ODhhLjM3LjM3LDAsMCwxLDAsLjU0bC00LjczOSw0LjUzMmEuNjIxLjYyMSwwLDAsMS0uNDMyLjE2N2gyLjcxMWEuNjIxLjYyMSwwLDAsMCwuNDMxLS4xNjdsNC43MzktNC41MzJBLjM3LjM3LDAsMCwwLDUyNS41OCw1MTAuNzczWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjA5LjMwMyA4Ni45ODkpIiBmaWxsPSIjZmZmIi8+CiAgICA8cGF0aCBpZD0i6Lev5b6EXzE0NDYiIGRhdGEtbmFtZT0i6Lev5b6EIDE0NDYiIGQ9Ik01MjUuNTgsNTEwLjc3M2wtNC43MzgtNC41ODhhLjYyMi42MjIsMCwwLDAtLjQzNC0uMTczSDUxNy43YS42MjUuNjI1LDAsMCwxLC40MzUuMTczbDQuNzM4LDQuNTg4YS4zNy4zNywwLDAsMSwwLC41NGwtNC43MzksNC41MzJhLjYyMS42MjEsMCwwLDEtLjQzMi4xNjdoMi43MTFhLjYyMS42MjEsMCwwLDAsLjQzMS0uMTY3bDQuNzM5LTQuNTMyQS4zNy4zNywwLDAsMCw1MjUuNTgsNTEwLjc3M1oiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIwMy4zMDMgODYuOTg5KSIgZmlsbD0iI2ZmZiIgb3BhY2l0eT0iMC41Ii8+CiAgPC9nPgo8L3N2Zz4K) no-repeat 50%;
  background-size: 100% 100%;
  vertical-align: middle;
}

.widgets-doors[data-camera-toward="right"] .door.show-arrow.forward a:after {
  margin-left: 4px;
}

.widgets-doors[data-camera-toward="left"] .door.show-arrow.right a:after {
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

.widgets-doors[data-camera-toward=back] .door.show-arrow.back a:after, .widgets-doors[data-camera-toward=left] .door.show-arrow.left a:after, .widgets-doors[data-camera-toward=left] .door.show-arrow.back a:after, .widgets-doors[data-camera-toward=left] .door.show-arrow.right a:after {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 10.5px;
  height: 10.5px;
  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNCIgaGVpZ2h0PSIxMCIgdmlld0JveD0iMCAwIDE0IDEwIj4KICA8ZyBpZD0iaW1nX2Fycm93IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNzIxIC01OTMpIj4KICAgIDxwYXRoIGlkPSLot6/lvoRfMTQ0NSIgZGF0YS1uYW1lPSLot6/lvoQgMTQ0NSIgZD0iTTUyNS41OCw1MTAuNzczbC00LjczOC00LjU4OGEuNjIyLjYyMiwwLDAsMC0uNDM0LS4xNzNINTE3LjdhLjYyNS42MjUsMCwwLDEsLjQzNS4xNzNsNC43MzgsNC41ODhhLjM3LjM3LDAsMCwxLDAsLjU0bC00LjczOSw0LjUzMmEuNjIxLjYyMSwwLDAsMS0uNDMyLjE2N2gyLjcxMWEuNjIxLjYyMSwwLDAsMCwuNDMxLS4xNjdsNC43MzktNC41MzJBLjM3LjM3LDAsMCwwLDUyNS41OCw1MTAuNzczWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjA5LjMwMyA4Ni45ODkpIiBmaWxsPSIjZmZmIi8+CiAgICA8cGF0aCBpZD0i6Lev5b6EXzE0NDYiIGRhdGEtbmFtZT0i6Lev5b6EIDE0NDYiIGQ9Ik01MjUuNTgsNTEwLjc3M2wtNC43MzgtNC41ODhhLjYyMi42MjIsMCwwLDAtLjQzNC0uMTczSDUxNy43YS42MjUuNjI1LDAsMCwxLC40MzUuMTczbDQuNzM4LDQuNTg4YS4zNy4zNywwLDAsMSwwLC41NGwtNC43MzksNC41MzJhLjYyMS42MjEsMCwwLDEtLjQzMi4xNjdoMi43MTFhLjYyMS42MjEsMCwwLDAsLjQzMS0uMTY3bDQuNzM5LTQuNTMyQS4zNy4zNywwLDAsMCw1MjUuNTgsNTEwLjc3M1oiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIwMy4zMDMgODYuOTg5KSIgZmlsbD0iI2ZmZiIgb3BhY2l0eT0iMC41Ii8+CiAgPC9nPgo8L3N2Zz4K) no-repeat 50%;
  background-size: 100% 100%;
  margin-left: 4px;
}

.widgets-doors[data-camera-toward="left"] .door.show-arrow.back a:after {
  position: relative;
}

.widgets-doors[data-camera-toward="left"] .door.show-arrow.forward a:before {
  position: relative;
  margin-right: 3.5px;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.widgets-doors[data-camera-toward="back"] .door.show-arrow.forward a:after, .widgets-doors[data-camera-toward="left"] .door.show-arrow.forward a:before {
  content: "";
  display: inline-block;
  width: 10.5px;
  height: 10.5px;
  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNCIgaGVpZ2h0PSIxMCIgdmlld0JveD0iMCAwIDE0IDEwIj4KICA8ZyBpZD0iaW1nX2Fycm93IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNzIxIC01OTMpIj4KICAgIDxwYXRoIGlkPSLot6/lvoRfMTQ0NSIgZGF0YS1uYW1lPSLot6/lvoQgMTQ0NSIgZD0iTTUyNS41OCw1MTAuNzczbC00LjczOC00LjU4OGEuNjIyLjYyMiwwLDAsMC0uNDM0LS4xNzNINTE3LjdhLjYyNS42MjUsMCwwLDEsLjQzNS4xNzNsNC43MzgsNC41ODhhLjM3LjM3LDAsMCwxLDAsLjU0bC00LjczOSw0LjUzMmEuNjIxLjYyMSwwLDAsMS0uNDMyLjE2N2gyLjcxMWEuNjIxLjYyMSwwLDAsMCwuNDMxLS4xNjdsNC43MzktNC41MzJBLjM3LjM3LDAsMCwwLDUyNS41OCw1MTAuNzczWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjA5LjMwMyA4Ni45ODkpIiBmaWxsPSIjZmZmIi8+CiAgICA8cGF0aCBpZD0i6Lev5b6EXzE0NDYiIGRhdGEtbmFtZT0i6Lev5b6EIDE0NDYiIGQ9Ik01MjUuNTgsNTEwLjc3M2wtNC43MzgtNC41ODhhLjYyMi42MjIsMCwwLDAtLjQzNC0uMTczSDUxNy43YS42MjUuNjI1LDAsMCwxLC40MzUuMTczbDQuNzM4LDQuNTg4YS4zNy4zNywwLDAsMSwwLC41NGwtNC43MzksNC41MzJhLjYyMS42MjEsMCwwLDEtLjQzMi4xNjdoMi43MTFhLjYyMS42MjEsMCwwLDAsLjQzMS0uMTY3bDQuNzM5LTQuNTMyQS4zNy4zNywwLDAsMCw1MjUuNTgsNTEwLjc3M1oiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIwMy4zMDMgODYuOTg5KSIgZmlsbD0iI2ZmZiIgb3BhY2l0eT0iMC41Ii8+CiAgPC9nPgo8L3N2Zz4K) no-repeat 50%;
  background-size: 100% 100%;
  vertical-align: middle;
}

.widgets-doors[data-camera-toward="back"] .door.show-arrow.forward a:after {
  margin-left: 4px;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

.widgets-doors[data-camera-toward="back"] .door.show-arrow.right a:after {
  margin-left: 4px;
}

.widgets-doors[data-camera-toward="back"] .door.show-arrow.left a:before, .widgets-doors[data-camera-toward="back"] .door.show-arrow.right a:after {
  content: "";
  position: relative;
  display: inline-block;
  width: 10.5px;
  height: 10.5px;
  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNCIgaGVpZ2h0PSIxMCIgdmlld0JveD0iMCAwIDE0IDEwIj4KICA8ZyBpZD0iaW1nX2Fycm93IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNzIxIC01OTMpIj4KICAgIDxwYXRoIGlkPSLot6/lvoRfMTQ0NSIgZGF0YS1uYW1lPSLot6/lvoQgMTQ0NSIgZD0iTTUyNS41OCw1MTAuNzczbC00LjczOC00LjU4OGEuNjIyLjYyMiwwLDAsMC0uNDM0LS4xNzNINTE3LjdhLjYyNS42MjUsMCwwLDEsLjQzNS4xNzNsNC43MzgsNC41ODhhLjM3LjM3LDAsMCwxLDAsLjU0bC00LjczOSw0LjUzMmEuNjIxLjYyMSwwLDAsMS0uNDMyLjE2N2gyLjcxMWEuNjIxLjYyMSwwLDAsMCwuNDMxLS4xNjdsNC43MzktNC41MzJBLjM3LjM3LDAsMCwwLDUyNS41OCw1MTAuNzczWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjA5LjMwMyA4Ni45ODkpIiBmaWxsPSIjZmZmIi8+CiAgICA8cGF0aCBpZD0i6Lev5b6EXzE0NDYiIGRhdGEtbmFtZT0i6Lev5b6EIDE0NDYiIGQ9Ik01MjUuNTgsNTEwLjc3M2wtNC43MzgtNC41ODhhLjYyMi42MjIsMCwwLDAtLjQzNC0uMTczSDUxNy43YS42MjUuNjI1LDAsMCwxLC40MzUuMTczbDQuNzM4LDQuNTg4YS4zNy4zNywwLDAsMSwwLC41NGwtNC43MzksNC41MzJhLjYyMS42MjEsMCwwLDEtLjQzMi4xNjdoMi43MTFhLjYyMS42MjEsMCwwLDAsLjQzMS0uMTY3bDQuNzM5LTQuNTMyQS4zNy4zNywwLDAsMCw1MjUuNTgsNTEwLjc3M1oiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIwMy4zMDMgODYuOTg5KSIgZmlsbD0iI2ZmZiIgb3BhY2l0eT0iMC41Ii8+CiAgPC9nPgo8L3N2Zz4K) no-repeat 50%;
  background-size: 100% 100%;
  vertical-align: middle;
}

.widgets-doors[data-camera-toward="back"] .door.show-arrow.left a:before {
  margin-right: 3.5px;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.widgets-doors .door {
  position: absolute;
  width: 0;
  height: 0;
  /* display: none; */
  -webkit-animation: viewport-door-label 0.3s ease 1s;
  animation: viewport-door-label 0.3s ease 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  cursor: pointer;
}

.widgets-doors .door a {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  border-radius: 1.75px;
  background: rgba(0, 0, 0, 0.5);
  line-height: 14px;
  padding: 8px 8px;
  border-radius: 4px;
  white-space: nowrap;
  font-size: 14px;
  font-style: normal;
  pointer-events: auto;
  -webkit-transition: background 0.3s ease, color 0.3s ease, -webkit-transform 1s ease;
  transition: background 0.3s ease, color 0.3s ease, -webkit-transform 1s ease;
  transition: transform 1s ease, background 0.3s ease, color 0.3s ease;
  transition: transform 1s ease, background 0.3s ease, color 0.3s ease, -webkit-transform 1s ease;
}

.widgets-doors .door a:after {
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

.widgets-doors .door a:active {
  background: rgba(0, 0, 0, 0.5);
  color: hsla(0, 0%, 100%, 0.5);
}

.widgets-doors .door a:active:after {
  opacity: 0.5;
}

@-webkit-keyframes room-label {
  0% {
    opacity: 0;
    margin-top: 8.75px;
  }

  to {
    opacity: 1;
    margin-top: 0;
  }
}

@keyframes room-label {
  0% {
    opacity: 0;
    margin-top: 8.75px;
  }

  to {
    opacity: 1;
    margin-top: 0;
  }
}

@-webkit-keyframes door-label {
  0% {
    opacity: 0;
    margin-top: 8.75px;
  }

  to {
    opacity: 1;
    margin-top: 0;
  }
}

@keyframes door-label {
  0% {
    opacity: 0;
    margin-top: 8.75px;
  }

  to {
    opacity: 1;
    margin-top: 0;
  }
}

.widgets-rulers {
  position: absolute;
  pointer-events: none;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

.widgets-rulers .ruler-line {
  position: absolute;
  -webkit-transform-origin: left 0.875px;
  transform-origin: left 0.875px;
  width: 0;
  height: 1.75px;
}

.widgets-rulers .ruler-line em {
  background: linear-gradient(90deg, hsla(0, 0%, 100%, 0.5), hsla(0, 0%, 100%, 0.3));
  display: block;
  height: 100%;
  -webkit-animation: ruler-line 0.5s ease 1s;
  animation: ruler-line 0.5s ease 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-box-shadow: 0 0 3.5px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 3.5px rgba(0, 0, 0, 0.6);
}

.widgets-rulers .ruler-label {
  position: absolute;
  /* width: 0; */
  height: 0;
  top: 0.875px;
  left: 38%;
}

.widgets-rulers .ruler-label .ruler-label-point {
  position: absolute;
  width: 28px;
  height: 11.375px;
  right: 0;
  bottom: 0;
  background-position: bottom;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMzRweCIgaGVpZ2h0PSIxNXB4IiB2aWV3Qm94PSIwIDAgMzQgMTUiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDQ4LjIgKDQ3MzI3KSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDx0aXRsZT5Hcm91cCA3PC90aXRsZT4KICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPgogICAgPGRlZnM+CiAgICAgICAgPGNpcmNsZSBpZD0icGF0aC0xIiBjeD0iMS41IiBjeT0iMS41IiByPSIxLjUiPjwvY2lyY2xlPgogICAgICAgIDxmaWx0ZXIgeD0iLTEwMC4wJSIgeT0iLTEwMC4wJSIgd2lkdGg9IjMwMC4wJSIgaGVpZ2h0PSIzMDAuMCUiIGZpbHRlclVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgaWQ9ImZpbHRlci0yIj4KICAgICAgICAgICAgPGZlT2Zmc2V0IGR4PSIwIiBkeT0iMCIgaW49IlNvdXJjZUFscGhhIiByZXN1bHQ9InNoYWRvd09mZnNldE91dGVyMSI+PC9mZU9mZnNldD4KICAgICAgICAgICAgPGZlR2F1c3NpYW5CbHVyIHN0ZERldmlhdGlvbj0iMSIgaW49InNoYWRvd09mZnNldE91dGVyMSIgcmVzdWx0PSJzaGFkb3dCbHVyT3V0ZXIxIj48L2ZlR2F1c3NpYW5CbHVyPgogICAgICAgICAgICA8ZmVDb2xvck1hdHJpeCB2YWx1ZXM9IjAgMCAwIDAgMCAgIDAgMCAwIDAgMCAgIDAgMCAwIDAgMCAgMCAwIDAgMC4yOTkzNjU5NDIgMCIgdHlwZT0ibWF0cml4IiBpbj0ic2hhZG93Qmx1ck91dGVyMSI+PC9mZUNvbG9yTWF0cml4PgogICAgICAgIDwvZmlsdGVyPgogICAgPC9kZWZzPgogICAgPGcgaWQ9IuWbuuWumueKtuaAgS3liqDovb0iIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC00MjcuMDAwMDAwLCAtMjY3LjAwMDAwMCkiPgogICAgICAgIDxnIGlkPSJHcm91cC03IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0MjkuMDAwMDAwLCAyNjkuMDAwMDAwKSI+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0zMS41LDEyLjUgTDIxLjUsMS41IiBpZD0iTGluZS1Db3B5LTExIiBzdHJva2U9IiNGRkZGRkYiIHN0cm9rZS13aWR0aD0iMC41IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjwvcGF0aD4KICAgICAgICAgICAgPHBhdGggZD0iTTIxLjUsMS41IEwyLjUsMS41IiBpZD0iTGluZS1Db3B5LTEyIiBzdHJva2U9IiNGRkZGRkYiIHN0cm9rZS13aWR0aD0iMC41IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjwvcGF0aD4KICAgICAgICAgICAgPGcgaWQ9Ik92YWwtNi1Db3B5LTYiPgogICAgICAgICAgICAgICAgPHVzZSBmaWxsPSJibGFjayIgZmlsbC1vcGFjaXR5PSIxIiBmaWx0ZXI9InVybCgjZmlsdGVyLTIpIiB4bGluazpocmVmPSIjcGF0aC0xIj48L3VzZT4KICAgICAgICAgICAgICAgIDx1c2UgZmlsbD0iI0ZGRkZGRiIgZmlsbC1ydWxlPSJldmVub2RkIiB4bGluazpocmVmPSIjcGF0aC0xIj48L3VzZT4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+");
  background-size: 28px 11.375px;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  transform-origin: right center;
  -webkit-animation: ruler-point 0.3s ease 1.3s;
  animation: ruler-point 0.3s ease 1.3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.widgets-rulers .ruler-label .ruler-label-name {
  position: absolute;
  height: 15.75px;
  font-size: 12px;
  line-height: 15.75px;
  right: 28px;
  bottom: 0.875px;
  white-space: nowrap;
  /* max-width: 0; */
  overflow: hidden;
  -webkit-animation: ruler-label 1s ease 1.6s;
  animation: ruler-label 1s ease 1.6s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  text-shadow: 0 0 3.5px rgba(0, 0, 0, 0.6);
}

.widgets-rulers .ruler-label.reverse .ruler-label-point {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

.widgets-rulers .ruler-label.reverse .ruler-label-name {
  /* -webkit-transform: rotateY(-180deg); */
  /* transform: rotateY(-180deg); */
  right: auto;
  left: 28px;
}

.widgets-rulers .measure .ruler-label .ruler-label-name {
  color: #f0ff00;
}

.widgets-rulers .ruler-intersection {
  position: absolute;
  width: 0;
  height: 0;
}

.widgets-rulers .ruler-intersection .ruler-intersection-point {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 18.375px;
  height: 7px;
  background-repeat: no-repeat;
  background-size: 18.375px 7px;
  background-position: 50%;
}

.widgets-rulers .ruler-intersection .ruler-intersection-text {
  position: absolute;
  left: 18.375px;
  bottom: 0;
  font-size: 12px;
  line-height: 12px;
  white-space: nowrap;
  color: #12fffb;
  text-shadow: 0 0 3.5px rgba(0, 0, 0, 0.3);
  -webkit-transform-origin: left center;
  transform-origin: left center;
  -webkit-transform: scale(0.85);
  transform: scale(0.85);
}

.measure .ruler-label .ruler-label-name {
  font-size: 14px;
  line-height: 14px;
}

.measure .ruler-label {
  position: absolute;
}

.measure .ruler-label .ruler-label-point {
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIxLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IuWbvuWxgl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgMzQgMTUiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDM0IDE1OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6bm9uZTtzdHJva2U6I0YwRkYwMDtzdHJva2Utd2lkdGg6MC41O3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1saW5lam9pbjpyb3VuZDt9Cgkuc3Qxe2ZpbHRlcjp1cmwoI2ZpbHRlci0yKTt9Cgkuc3Qye2ZpbGw6I0YwRkYwMDt9Cjwvc3R5bGU+CjxmaWx0ZXIgIGZpbHRlclVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgaGVpZ2h0PSIzMDAuMCUiIGlkPSJmaWx0ZXItMiIgd2lkdGg9IjMwMC4wJSIgeD0iLTEwMC4wJSIgeT0iLTEwMC4wJSI+Cgk8ZmVPZmZzZXQgIGR4PSIwIiBkeT0iMCIgaW49IlNvdXJjZUFscGhhIiByZXN1bHQ9InNoYWRvd09mZnNldE91dGVyMSI+PC9mZU9mZnNldD4KCTxmZUdhdXNzaWFuQmx1ciAgaW49InNoYWRvd09mZnNldE91dGVyMSIgcmVzdWx0PSJzaGFkb3dCbHVyT3V0ZXIxIiBzdGREZXZpYXRpb249IjEiPjwvZmVHYXVzc2lhbkJsdXI+Cgk8ZmVDb2xvck1hdHJpeCAgaW49InNoYWRvd0JsdXJPdXRlcjEiIHR5cGU9Im1hdHJpeCIgdmFsdWVzPSIwIDAgMCAwIDAgICAwIDAgMCAwIDAgICAwIDAgMCAwIDAgIDAgMCAwIDAuMjk5MzY1OTQyIDAiPgoJCTwvZmVDb2xvck1hdHJpeD4KPC9maWx0ZXI+Cjx0aXRsZT5Hcm91cCA3PC90aXRsZT4KPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+CjxwYXRoIGlkPSJMaW5lLUNvcHktMTEiIGNsYXNzPSJzdDAiIGQ9Ik0zMy41LDE0LjVsLTEwLTExIi8+CjxwYXRoIGlkPSJMaW5lLUNvcHktMTIiIGNsYXNzPSJzdDAiIGQ9Ik0yMy41LDMuNWgtMTkiLz4KPGcgaWQ9Ik92YWwtNi1Db3B5LTYiPgoJPGcgY2xhc3M9InN0MSI+CgkJPGNpcmNsZSBpZD0icGF0aC0xXzJfIiBjbGFzcz0ic3QyIiBjeD0iMy41IiBjeT0iMy41IiByPSIxLjUiLz4KCTwvZz4KCTxnPgoJCTxjaXJjbGUgaWQ9InBhdGgtMV8xXyIgY2xhc3M9InN0MiIgY3g9IjMuNSIgY3k9IjMuNSIgcj0iMS41Ii8+Cgk8L2c+CjwvZz4KPC9zdmc+Cg==");
  animation-delay: 0.3s;
}

.measure .ruler-label .ruler-label-name {
  animation-delay: 0.6s;
}

.slide-down-enter-active[data-v-18538fc6], .slide-down-leave-active[data-v-18538fc6] {
  will-change: transform;
  transition: all .35s ease-in-out
}

.slide-down-enter-from[data-v-18538fc6] {
  opacity: 0;
  transform: translate3d(0, -100%, 0)
}

.slide-down-enter[data-v-18538fc6] {
  opacity: 1;
  transform: translate3d(-50%, 100%, 0)
}

.slide-down-leave-active[data-v-18538fc6] {
  opacity: 0;
  transform: translate3d(0, -100%, 0)
}

.vue-cropper[data-v-48aab112] {
  position: relative;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  direction: ltr;
  touch-action: none;
  text-align: left;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC")
}

.cropper-box-canvas[data-v-48aab112], .cropper-box[data-v-48aab112], .cropper-crop-box[data-v-48aab112], .cropper-drag-box[data-v-48aab112], .cropper-face[data-v-48aab112] {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.cropper-box-canvas img[data-v-48aab112] {
  position: relative;
  text-align: left;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  transform: none;
  max-width: none;
  max-height: none
}

.cropper-box[data-v-48aab112] {
  overflow: hidden
}

.cropper-move[data-v-48aab112] {
  cursor: move
}

.cropper-crop[data-v-48aab112] {
  cursor: crosshair
}

.cropper-modal[data-v-48aab112] {
  background: rgba(0, 0, 0, .5)
}

.cropper-view-box[data-v-48aab112] {
  display: block;
  overflow: hidden;
  width: 100%;
  height: 100%;
  outline: 1px solid #39f;
  outline-color: rgba(51, 153, 255, .75)
}

.cropper-view-box[data-v-48aab112], .cropper-view-box img[data-v-48aab112] {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

.cropper-view-box img[data-v-48aab112] {
  text-align: left;
  max-width: none;
  max-height: none
}

.cropper-face[data-v-48aab112] {
  top: 0;
  left: 0;
  background-color: #fff;
  opacity: .1
}

.crop-info[data-v-48aab112] {
  position: absolute;
  left: 0;
  min-width: 65px;
  text-align: center;
  color: #fff;
  line-height: 20px;
  background-color: rgba(0, 0, 0, .8);
  font-size: 12px
}

.crop-line[data-v-48aab112] {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  opacity: .1
}

.line-w[data-v-48aab112] {
  top: -3px;
  left: 0;
  height: 5px;
  cursor: n-resize
}

.line-a[data-v-48aab112] {
  top: 0;
  left: -3px;
  width: 5px;
  cursor: w-resize
}

.line-s[data-v-48aab112] {
  bottom: -3px;
  left: 0;
  height: 5px;
  cursor: s-resize
}

.line-d[data-v-48aab112] {
  top: 0;
  right: -3px;
  width: 5px;
  cursor: e-resize
}

.crop-point[data-v-48aab112] {
  position: absolute;
  width: 8px;
  height: 8px;
  opacity: .75;
  background-color: #39f;
  border-radius: 100%
}

.point1[data-v-48aab112] {
  top: -4px;
  left: -4px;
  cursor: nw-resize
}

.point2[data-v-48aab112] {
  top: -5px;
  left: 50%;
  margin-left: -3px;
  cursor: n-resize
}

.point3[data-v-48aab112] {
  top: -4px;
  right: -4px;
  cursor: ne-resize
}

.point4[data-v-48aab112] {
  top: 50%;
  left: -4px;
  margin-top: -3px;
  cursor: w-resize
}

.point5[data-v-48aab112] {
  top: 50%;
  right: -4px;
  margin-top: -3px;
  cursor: e-resize
}

.point6[data-v-48aab112] {
  bottom: -5px;
  left: -4px;
  cursor: sw-resize
}

.point7[data-v-48aab112] {
  bottom: -5px;
  left: 50%;
  margin-left: -3px;
  cursor: s-resize
}

.point8[data-v-48aab112] {
  bottom: -5px;
  right: -4px;
  cursor: se-resize
}

@media screen and (max-width: 500px) {
  .crop-point[data-v-48aab112] {
    position: absolute;
    width: 20px;
    height: 20px;
    opacity: .45;
    background-color: #39f;
    border-radius: 100%
  }

  .point1[data-v-48aab112] {
    top: -10px;
    left: -10px
  }

  .point2[data-v-48aab112], .point4[data-v-48aab112], .point5[data-v-48aab112], .point7[data-v-48aab112] {
    display: none
  }

  .point3[data-v-48aab112] {
    top: -10px;
    right: -10px
  }

  .point4[data-v-48aab112] {
    top: 0;
    left: 0
  }

  .point6[data-v-48aab112] {
    bottom: -10px;
    left: -10px
  }

  .point8[data-v-48aab112] {
    bottom: -10px;
    right: -10px
  }
}

.vue-cropper {
  background-repeat: repeat
}

.cropper-view-box {
  outline-color: var(--color-main-normal) !important
}

.crop-point {
  background-color: var(--color-main-normal) !important
}

.size {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 20px
}

.ui-input {
  margin-right: 30px
}

.ui-input:last-of-type {
  margin-right: 0
}

.x-scrollbar {
  position: relative
}

.x-scrollbar__container {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  overflow: auto
}

.x-scrollbar__container--hideScrollbar {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important
}

.x-scrollbar__container--hideScrollbar::-webkit-scrollbar {
  display: none !important
}

.x-scrollbar__container--preventDefault {
  overscroll-behavior: contain;
  -ms-scroll-chaining: none
}

.x-scrollbar__content {
  display: inline-block;
  vertical-align: middle;
  min-width: 100%
}

.x-scrollbar__track-x, .x-scrollbar__track-y {
  overflow: hidden;
  opacity: 1;
  position: absolute;
  z-index: 2;
  transition: background-color .2s linear, opacity .2s linear
}

.x-scrollbar__track-x {
  left: 0;
  bottom: 0;
  width: 100%;
  height: 8px
}

.x-scrollbar__track-y {
  top: 0;
  right: 0;
  height: 100%;
  width: 8px
}

.x-scrollbar__thumb-x, .x-scrollbar__thumb-y {
  position: absolute;
  background-color: hsla(0, 0%, 100%, .2);
  border-radius: 5px;
  transition: height .2s ease-in-out, width .2s ease-in-out
}

.x-scrollbar__thumb-x {
  height: 5px;
  bottom: 0
}

.x-scrollbar__thumb-y {
  width: 5px;
  right: 0
}

.x-scrollbar__track--draging .x-scrollbar__thumb-x, .x-scrollbar__track-x:hover .x-scrollbar__thumb-x {
  height: 8px
}

.x-scrollbar__track--draging .x-scrollbar__thumb-y, .x-scrollbar__track-y:hover .x-scrollbar__thumb-y {
  width: 8px
}

.x-scrollbar-keep > .x-scrollbar__track-x, .x-scrollbar-keep > .x-scrollbar__track-y, .x-scrollbar:hover > .x-scrollbar__track-x, .x-scrollbar:hover > .x-scrollbar__track-y {
  opacity: 1
}

.x-scrollbar__track-x.x-scrollbar__track--draging, .x-scrollbar__track-x:hover, .x-scrollbar__track-y.x-scrollbar__track--draging, .x-scrollbar__track-y:hover {
  opacity: 1 !important
}

.slide-up-enter-active[data-v-7444db70], .slide-up-leave-active[data-v-7444db70] {
  will-change: transform;
  transition: all .2s ease-in-out
}

.slide-up-enter-from[data-v-7444db70] {
  opacity: 0;
  transform: translate3d(0, 100%, 0)
}

.slide-up-enter[data-v-7444db70] {
  opacity: 1;
  transform: translate3d(0, -100%, 0)
}

.slide-up-leave-active[data-v-7444db70] {
  opacity: 0;
  transform: translate3d(0, 100%, 0)
}

.slide-right-enter-active[data-v-ccff5222], .slide-right-leave-active[data-v-ccff5222] {
  will-change: transform;
  transition: all 0s ease-in-out
}

.slide-right-enter-from[data-v-ccff5222] {
  opacity: 0;
  transform: translate3d(100%, 0, 0)
}

.slide-right-enter[data-v-ccff5222] {
  opacity: 1;
  transform: translate3d(-100%, 0, 0)
}

.slide-right-leave-active[data-v-ccff5222] {
  opacity: 0;
  transform: translate3d(100%, 0, 0)
}

.del-btn[data-v-74f94aee] {
  width: 24px;
  height: 24px;
  background: rgba(0, 0, 0, .3);
  border-radius: 50%;
  cursor: pointer;
  top: 10px;
  right: 10px;
  display: flex;
  align-items: center;
  justify-content: center
}

.del-btn[data-v-74f94aee], .pic-box[data-v-74f94aee] {
  position: absolute;
  z-index: 10
}

.pic-box[data-v-74f94aee] {
  width: 100%;
  height: 100%;
  border-radius: 4px;
  border: 1px solid hsla(0, 0%, 100%, .2);
  top: 0;
  left: 0
}

.pic-box .loading-icon[data-v-74f94aee] {
  color: var(--editor-main-color);
  -webkit-animation: rotate-74f94aee 2s linear infinite;
  animation: rotate-74f94aee 2s linear infinite;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 30px
}

@-webkit-keyframes rotate-74f94aee {
  0% {
    transform: translate(-50%, -50%) rotate(0deg)
  }

  to {
    transform: translate(-50%, -50%) rotate(1turn)
  }
}

@keyframes rotate-74f94aee {
  0% {
    transform: translate(-50%, -50%) rotate(0deg)
  }

  to {
    transform: translate(-50%, -50%) rotate(1turn)
  }
}

.pic-box .over-box[data-v-74f94aee] {
  width: 100%;
  height: 100%;
  overflow: hidden
}

.pic-box .continue[data-v-74f94aee] {
  width: 100%;
  height: 32px;
  background: linear-gradient(180deg, rgba(0, 0, 0, .1), #000 200%);
  border-radius: 0 0 4px 4px;
  position: absolute;
  bottom: 0;
  left: 0
}

.pic-box .continue .ui-input[data-v-74f94aee] {
  width: 100%
}

.pic-box .continue .continue-tips[data-v-74f94aee] {
  font-size: 12px
}

.pic-box .continue .pic-num[data-v-74f94aee] {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px
}

.pic-box .continue .pic-num .cur[data-v-74f94aee] {
  color: var(--editor-main-color)
}

.pic-box .ctrl-btn[data-v-74f94aee] {
  width: 32px;
  height: 32px;
  background: rgba(0, 0, 0, .2);
  border-radius: 50%;
  position: absolute;
  cursor: pointer;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center
}

.pic-box .ctrl-btn .iconfont[data-v-74f94aee] {
  font-size: 14px
}

.pic-box .ctrl-btn.left-btn[data-v-74f94aee] {
  left: 5px
}

.pic-box .ctrl-btn.right-btn[data-v-74f94aee] {
  right: 5px
}

.pic-box .image-list[data-v-74f94aee] {
  width: 100%;
  height: 100%;
  position: relative;
  transition: all .3s linear
}

.pic-box .image-list .image-item[data-v-74f94aee] {
  width: 100%;
  height: 100%;
  position: absolute;
  transform: translateX(0);
  text-align: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 50%
}

.pic-box .image-list .image-item img[data-v-74f94aee] {
  height: 100%;
  width: auto
}

.pic-box.show .ctrl-btn[data-v-74f94aee] {
  width: 40px;
  height: 80px;
  background: rgba(0, 0, 0, .6)
}

.pic-box.show .ctrl-btn .iconfont[data-v-74f94aee] {
  font-size: 20px
}

.pic-box.show .ctrl-btn.left-btn[data-v-74f94aee] {
  left: 0;
  border-radius: 0 40px 40px 0
}

.pic-box.show .ctrl-btn.left-btn .icon[data-v-74f94aee] {
  margin-right: 5px
}

.pic-box.show .ctrl-btn.right-btn[data-v-74f94aee] {
  right: 0;
  border-radius: 40px 0 0 40px
}

.pic-box.show .ctrl-btn.right-btn .icon[data-v-74f94aee] {
  margin-left: 8px
}

.pic-box.show .continue[data-v-74f94aee] {
  width: 76px;
  height: 36px;
  background: rgba(0, 0, 0, .6);
  border-radius: 20px;
  position: absolute;
  bottom: -5%;
  left: 50%;
  transform: translateX(-50%)
}

.pic-box.show .continue .pic-num[data-v-74f94aee] {
  width: 76px;
  height: 36px;
  display: inline-block;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)
}

.pic-box.show .continue .pic-num span[data-v-74f94aee] {
  display: flex;
  align-items: center;
  justify-content: center
}

[is-mobile] .pic-box.show .ctrl-btn[data-v-74f94aee] {
  width: 40px;
  height: 80px;
  background: rgba(0, 0, 0, .6)
}

[is-mobile] .pic-box.show .ctrl-btn .iconfont[data-v-74f94aee] {
  font-size: 20px
}

[is-mobile] .pic-box.show .ctrl-btn.left-btn[data-v-74f94aee] {
  left: 0;
  border-radius: 0 40px 40px 0
}

[is-mobile] .pic-box.show .ctrl-btn.left-btn .icon[data-v-74f94aee] {
  margin-right: 5px
}

[is-mobile] .pic-box.show .ctrl-btn.right-btn[data-v-74f94aee] {
  right: 0;
  border-radius: 40px 0 0 40px
}

[is-mobile] .pic-box.show .ctrl-btn.right-btn .icon[data-v-74f94aee] {
  margin-left: 8px
}

[is-mobile] .pic-box.show .continue[data-v-74f94aee] {
  width: 76px;
  height: 36px;
  background: rgba(0, 0, 0, .6);
  border-radius: 20px;
  position: absolute;
  bottom: -6%;
  left: 50%;
  transform: translateX(-50%)
}

[is-mobile] .pic-box.show .continue .pic-num[data-v-74f94aee] {
  width: 76px;
  height: 36px;
  display: inline-block;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)
}

[is-mobile] .pic-box.show .continue .pic-num span[data-v-74f94aee] {
  display: flex;
  align-items: center;
  justify-content: center
}

.del-btn[data-v-5675b14c] {
  width: 24px;
  height: 24px;
  background: rgba(0, 0, 0, .3);
  border-radius: 50%;
  cursor: pointer;
  top: 10px;
  right: 10px;
  display: flex;
  align-items: center;
  justify-content: center
}

.del-btn[data-v-5675b14c], .web-box[data-v-5675b14c] {
  position: absolute;
  z-index: 10
}

.web-box[data-v-5675b14c] {
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 4px;
  border: 1px solid hsla(0, 0%, 100%, .2);
  background: hsla(0, 0%, 100%, .1);
  top: 0;
  left: 0
}

.web-box .show-tips[data-v-5675b14c] {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center
}

.web-box .show-tips span[data-v-5675b14c] {
  color: hsla(0, 0%, 100%, .3);
  font-size: 16px;
  font-weight: 700
}

.web-box .iframe-box[data-v-5675b14c] {
  position: absolute;
  top: 0;
  left: 0
}

.web-box .iframe-box[data-v-5675b14c], .web-box .iframe-box iframe[data-v-5675b14c] {
  width: 100%;
  height: 100%
}

.web-box .input-web[data-v-5675b14c] {
  height: 32px;
  background: linear-gradient(180deg, rgba(0, 0, 0, .25), #000 200%) !important;
  border-radius: 0 0 4px 4px;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px 0 0
}

.web-box .input-web.disabled[data-v-5675b14c] {
  background: linear-gradient(180deg, rgba(0, 0, 0, .5), #000 200%) !important;
  opacity: .8 !important
}

.web-box .input-web input[data-v-5675b14c] {
  background: none;
  border: none;
  padding: 0 0 0 10px;
  width: 94%;
  box-sizing: border-box
}

.web-box .input-web input[data-v-5675b14c]:focus {
  border: none
}

.web-box .input-web input[data-v-5675b14c]::-moz-placeholder {
  color: hsla(0, 0%, 100%, .6)
}

.web-box .input-web input[data-v-5675b14c]:-ms-input-placeholder {
  color: hsla(0, 0%, 100%, .6)
}

.web-box .input-web input[data-v-5675b14c]::placeholder {
  color: hsla(0, 0%, 100%, .6)
}

.web-box .input-web .ok-web[data-v-5675b14c] {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: hsla(0, 0%, 100%, .6);
  color: rgba(0, 0, 0, .6);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer
}

.tag-layer {
  width: 100vw;
  height: 100vh;
  z-index: 10000;
  top: 0;
  position: fixed;
  left: 0;
  background-color: rgba(0, 0, 0, .7)
}

.tag-layer .tag-info {
  color: #fff;
  width: 100%;
  height: 85%;
  position: absolute;
  top: 7.5%;
  left: 0
}

.tag-layer .tag-info .close-btn {
  position: fixed;
  right: 36px;
  top: 36px;
  font-size: 18px;
  cursor: pointer;
  z-index: 100
}

.tag-layer .tag-info .tag-metas {
  width: 100%;
  height: 100%;
  position: relative
}

.tag-layer .tag-info .tag-metas .pic-box {
  width: 100%;
  height: 100%;
  border: none
}

.tag-layer .tag-info .tag-metas .pic-box .image-list .image-item {
  background-size: contain
}

.tag-layer .tag-info .tag-metas .video-box {
  height: auto;
  border: none
}

.tag-layer .tag-info .tag-metas .video-box video {
  width: 100%;
  height: auto;
  -o-object-fit: contain;
  object-fit: contain
}

.tag-layer .tag-info .tag-metas .web-box {
  width: 91%;
  height: 100%;
  border: none;
  left: 50%;
  transform: translateX(-50%)
}

[is-mobile] .tag-layer .tag-info .close-btn {
  position: absolute;
  right: 20px;
  top: -30px;
  font-size: 18px;
  cursor: pointer
}

.del-btn[data-v-38df8efc] {
  width: 24px;
  height: 24px;
  background: rgba(0, 0, 0, .3);
  border-radius: 50%;
  cursor: pointer;
  top: 10px;
  right: 10px;
  display: flex;
  align-items: center;
  justify-content: center
}

.del-btn[data-v-38df8efc], .video-box[data-v-38df8efc] {
  position: absolute;
  z-index: 10
}

.video-box[data-v-38df8efc] {
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 4px;
  border: 1px solid hsla(0, 0%, 100%, .2);
  top: 0;
  left: 0
}

.video-box .loading-icon[data-v-38df8efc] {
  color: var(--editor-main-color);
  -webkit-animation: rotate-38df8efc 2s linear infinite;
  animation: rotate-38df8efc 2s linear infinite;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 30px
}

@-webkit-keyframes rotate-38df8efc {
  0% {
    transform: translate(-50%, -50%) rotate(0deg)
  }

  to {
    transform: translate(-50%, -50%) rotate(1turn)
  }
}

@keyframes rotate-38df8efc {
  0% {
    transform: translate(-50%, -50%) rotate(0deg)
  }

  to {
    transform: translate(-50%, -50%) rotate(1turn)
  }
}

.video-box .video-item[data-v-38df8efc] {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain
}

.del-btn[data-v-72112ceb] {
  width: 24px;
  height: 24px;
  background: rgba(0, 0, 0, .3);
  border-radius: 50%;
  cursor: pointer;
  top: 10px;
  right: 10px;
  display: flex;
  align-items: center;
  justify-content: center
}

.audio-box[data-v-72112ceb], .del-btn[data-v-72112ceb] {
  position: absolute;
  z-index: 10
}

.audio-box[data-v-72112ceb] {
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 4px;
  border: 1px solid hsla(0, 0%, 100%, .2);
  background: hsla(0, 0%, 100%, .1);
  top: 0;
  left: 0
}

.audio-box .audio-msg[data-v-72112ceb] {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center
}

.audio-box .audio-msg .iconfont[data-v-72112ceb] {
  margin-right: 6px
}

.show-tag[data-v-26d14923] {
  pointer-events: auto;
  background: rgba(27, 27, 28, .8);
  border-radius: 4px;
  min-width: 400px;
  padding: 30px 20px
}

.show-tag .edit-btn[data-v-26d14923] {
  margin-top: 20px;
  text-align: right
}

.show-tag .edit-btn span[data-v-26d14923] {
  font-size: 14px;
  color: hsla(0, 0%, 100%, .6);
  cursor: pointer
}

.show-tag .edit-btn span[data-v-26d14923]:hover {
  color: #fff
}

.show-tag .tag-metas[data-v-26d14923] {
  width: 100%;
  height: 225px;
  background: hsla(0, 0%, 100%, .1);
  border-radius: 4px;
  overflow: hidden;
  position: relative;
  cursor: -webkit-zoom-in;
  margin-top: 20px
}

.show-tag .tag-metas.nocursor[data-v-26d14923] {
  cursor: auto
}

.show-tag .tag-metas.mask[data-v-26d14923]:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100
}

.show-tag .tag-title[data-v-26d14923] {
  word-break: break-all
}

.show-tag .tag-title h2[data-v-26d14923] {
  font-size: 20px;
  line-height: 20px;
  color: #fff;
  position: relative
}

.show-tag .tag-title h2 .ui-audio[data-v-26d14923] {
  float: right
}

.show-tag .tag-title h2 .ui-audio.audio[data-v-26d14923] {
  display: inline-block;
  cursor: pointer
}

.show-tag .desc[data-v-26d14923] {
  margin-top: 10px
}

.show-tag .desc .text[data-v-26d14923] {
  font-size: 14px;
  color: #999;
  line-height: 20px;
  text-align: justify;
  word-break: break-all
}

[is-mobile] .show-tag[data-v-26d14923] {
  pointer-events: auto;
  background: rgba(27, 27, 28, .8);
  border-radius: .0533rem;
  min-width: 7.4667rem;
  padding: .4rem .2667rem
}

[is-mobile] .show-tag .edit-btn[data-v-26d14923] {
  margin-top: .2667rem;
  text-align: right
}

[is-mobile] .show-tag .edit-btn span[data-v-26d14923] {
  font-size: .1867rem;
  color: hsla(0, 0%, 100%, .6);
  cursor: pointer
}

[is-mobile] .show-tag .edit-btn span[data-v-26d14923]:hover {
  color: #fff
}

[is-mobile] .show-tag .tag-metas[data-v-26d14923] {
  width: 100%;
  height: 4.2667rem;
  background: hsla(0, 0%, 100%, .1);
  border-radius: .0533rem;
  overflow: hidden;
  position: relative;
  cursor: -webkit-zoom-in;
  margin-top: .4rem
}

[is-mobile] .show-tag .tag-metas.mask[data-v-26d14923]:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100
}

[is-mobile] .show-tag .tag-title h2[data-v-26d14923] {
  font-size: .5333rem;
  color: #fff;
  position: relative
}

[is-mobile] .show-tag .tag-title h2 .ui-audio[data-v-26d14923] {
  float: right
}

[is-mobile] .show-tag .tag-title h2 .ui-audio.audio[data-v-26d14923] {
  display: inline-block;
  cursor: pointer
}

[is-mobile] .show-tag .desc[data-v-26d14923] {
  margin-bottom: .2933rem
}

[is-mobile] .show-tag .desc .text[data-v-26d14923] {
  font-size: .3733rem;
  color: #999;
  line-height: .2533rem;
  text-align: justify;
  line-height: .5333rem
}

[is-mobile] .show-tag .desc .text p[data-v-26d14923] {
  line-height: .5333rem
}

.title[data-v-15feaaa8] {
  display: flex;
  align-items: center;
  padding-right: 30px;
  width: 100%;
  height: 100%;
  cursor: pointer;
  transition: all .1s
}

.title.collapse[data-v-15feaaa8] {
  padding-right: 0
}

.title.collapse .back-btn .iconfont[data-v-15feaaa8] {
  transform: rotate(180deg)
}

.title.collapse .back-btn[data-v-15feaaa8]:after, .title.collapse .icon[data-v-15feaaa8], .title.collapse .text[data-v-15feaaa8] {
  display: none
}

.title .back-btn[data-v-15feaaa8] {
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  position: relative;
  transition: all .1s
}

.title .back-btn[data-v-15feaaa8]:after {
  content: "";
  position: absolute;
  width: 1px;
  height: 65%;
  background: linear-gradient(transparent, #fff, transparent);
  top: 50%;
  transform: translateY(-50%);
  right: 0
}

.title .text[data-v-15feaaa8] {
  width: 240px;
  padding-left: 20px;
  transition: width .3s
}

.title .text > div[data-v-15feaaa8] {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.title .icon i[data-v-15feaaa8] {
  transition: transform .2s ease-in-out
}

.title.pull-up .icon i[data-v-15feaaa8] {
  transform: rotate(180deg)
}

.description[data-v-15feaaa8] {
  display: none;
  position: absolute;
  left: 10px;
  top: calc(100% + 10px);
  background: rgba(15, 15, 15, .3);
  border-radius: 10px
}

.description.show[data-v-15feaaa8] {
  display: block
}

.description .text[data-v-15feaaa8] {
  padding: 20px;
  width: 400px;
  letter-spacing: 1px;
  overflow: hidden;
  word-break: break-all;
  white-space: normal;
  line-height: 1.5
}

.disable[data-v-72c6a2c0] {
  opacity: 1
}

.header[data-v-72c6a2c0] {
  position: absolute;
  top: .3rem;
  left: 0;
  height: 1.15789rem;
  width: 100%;
  z-index: 101;
  color: #fff;
  display: flex;
  align-items: center;
  text-shadow: 0 0 4px rgba(0, 0, 0, .4)
}

.header.app[data-v-72c6a2c0] {
  top: 1rem
}

.header .left[data-v-72c6a2c0] {
  width: 1rem;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center
}

.header .left.show[data-v-72c6a2c0] {
  visibility: visible;
  pointer-events: auto
}

.header .left.show .back[data-v-72c6a2c0] {
  visibility: visible
}

.header .left .back[data-v-72c6a2c0] {
  width: .78rem;
  height: .78rem;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, .3);
  display: flex;
  align-items: center;
  justify-content: center;
  visibility: hidden;
  position: relative
}

.header .left .back i[data-v-72c6a2c0] {
  font-size: .3rem;
  width: auto;
  position: static
}

.header .left .back-pano[data-v-72c6a2c0] {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative
}

.header .left .back-pano i[data-v-72c6a2c0] {
  font-size: .6rem;
  position: static
}

.header .right[data-v-72c6a2c0] {
  position: relative;
  width: 1.28rem;
  height: 100%;
  padding-right: 15px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  z-index: 11
}

.header .right > i[data-v-72c6a2c0] {
  font-size: .6rem
}

.header .right > div[data-v-72c6a2c0] {
  position: absolute;
  display: flex;
  flex-direction: column;
  right: 10px;
  top: 1.3rem;
  padding: 4px .42105rem;
  background-color: rgba(0, 0, 0, .5);
  border-radius: 5px
}

.header .right > div[data-v-72c6a2c0]:after {
  content: "";
  position: absolute;
  top: -5px;
  right: .3rem;
  width: 0;
  height: 0;
  border-width: 0 5px 5px;
  border-style: solid;
  border-color: transparent transparent rgba(0, 0, 0, .5)
}

.header .right > div.flex li span[data-v-72c6a2c0] {
  flex: 1;
  width: auto
}

.header .right > div li[data-v-72c6a2c0] {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0;
  padding: .1333rem 0 .2667rem
}

.header .right > div li i[data-v-72c6a2c0] {
  font-size: .3733rem;
  margin-right: .4rem
}

.header .right > div li b[data-v-72c6a2c0] {
  position: absolute;
  left: .32rem;
  top: .33rem;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background-color: #00c2c4
}

.header .right > div li b i[data-v-72c6a2c0] {
  color: #fff;
  font-size: 12px;
  transform: scale(.3);
  top: -4px;
  left: -3px;
  position: absolute
}

.header .right > div li span[data-v-72c6a2c0] {
  width: 1.89474rem;
  white-space: nowrap;
  text-align: left;
  font-size: .3733rem
}

.header .right > div .home[data-v-72c6a2c0] {
  border-top: 1px solid hsla(0, 0%, 100%, .4)
}

.header .right > div .home a[data-v-72c6a2c0] {
  width: 1.89474rem;
  margin-top: .3rem;
  margin-bottom: .1rem;
  margin-left: auto;
  margin-right: auto;
  display: block;
  text-decoration: none;
  overflow: hidden
}

.header .right > div .home a img[data-v-72c6a2c0] {
  width: 100%;
  outline: none;
  border: none
}

.header .title[data-v-72c6a2c0] {
  flex: 1;
  width: 100%;
  font-size: .42105rem;
  letter-spacing: 1px
}

.header .title[data-v-72c6a2c0], .header .title > div[data-v-72c6a2c0] {
  display: flex;
  height: 100%;
  align-items: center;
  justify-content: center
}

.header .title > div[data-v-72c6a2c0] {
  transition: background .3s ease, min-width .3s ease, border-radius .3s ease;
  padding-right: 12px;
  padding-left: 12px;
  white-space: nowrap;
  position: absolute;
  min-width: 100%;
  overflow: visible;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(0, 0, 0, .15) 50%, transparent)
}

.header .title span[data-v-72c6a2c0] {
  display: inline-block;
  position: relative;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 7rem
}

.header .title i[data-v-72c6a2c0] {
  transition: all .3s;
  position: absolute;
  left: 50%;
  bottom: 0;
  font-size: .3rem;
  transform: translateX(-50%);
  margin-bottom: .07rem
}

.header .title.up i[data-v-72c6a2c0] {
  transform: translateX(-50%) rotate(180deg)
}

.header .title.up > div[data-v-72c6a2c0] {
  min-width: 0;
  flex-shrink: 0;
  background-color: rgba(0, 0, 0, .5);
  border-radius: 1.15789rem
}

.header .title.up.drak > div[data-v-72c6a2c0] {
  background-color: rgba(0, 0, 0, .8)
}

.header .title.empty i[data-v-72c6a2c0] {
  display: none
}

.header .content[data-v-72c6a2c0] {
  position: absolute;
  top: 1.6rem;
  left: .92105rem;
  right: .92105rem;
  padding: 10px;
  background: rgba(0, 0, 0, .5);
  border-radius: 5px;
  font-size: .36842rem;
  text-align: center
}

.header .content.drak[data-v-72c6a2c0] {
  background: rgba(0, 0, 0, .8)
}

.header .content > div[data-v-72c6a2c0] {
  display: inline-block;
  text-align: left;
  letter-spacing: 1px;
  word-break: break-all;
  white-space: normal;
  line-height: 1.5
}

.header .content > div[data-v-72c6a2c0] p {
  word-break: break-word
}

.header .content > div[data-v-72c6a2c0] a {
  color: var(--editor-main-color)
}

.header .url-share[data-v-72c6a2c0] {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, .1)
}

.header .url-share > div[data-v-72c6a2c0] {
  position: absolute;
  left: .6rem;
  right: .6rem;
  top: 50vh;
  transform: translateY(-50%);
  border-radius: 4px;
  background-color: rgba(0, 0, 0, .5);
  padding: .31579rem;
  font-size: .36842rem
}

.header .url-share > div .tips[data-v-72c6a2c0] {
  display: flex;
  align-items: center;
  justify-content: space-between
}

.header .url-share > div .tips h4[data-v-72c6a2c0] {
  margin: 0;
  font-size: .42105rem
}

.header .url-share > div .tips i[data-v-72c6a2c0] {
  font-size: .6rem
}

.header .url-share > div .url[data-v-72c6a2c0] {
  display: -webkit-box;
  color: #fff;
  text-align: center;
  padding: .26316rem;
  width: 100%;
  height: 1.8rem;
  margin: .7rem 0;
  border-radius: .07rem;
  line-height: 1.99;
  font-size: .36842rem;
  background-color: rgba(0, 0, 0, .35);
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
  word-wrap: break-word;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical
}

.header .url-share > div .btns[data-v-72c6a2c0] {
  display: flex;
  justify-content: space-between
}

.header .url-share > div .btns button[data-v-72c6a2c0] {
  font-size: .36842rem;
  width: 47%;
  height: 1.05263rem;
  border-radius: 1.05263rem
}

.header .url-share > div .btns button.submit[data-v-72c6a2c0] {
  background: #00c2c4
}

@media (orientation: landscape) {
  .header[data-v-72c6a2c0] {
    height: .7rem
  }

  .header[data-v-72c6a2c0], .header.app[data-v-72c6a2c0] {
    top: .2rem
  }

  .header .left .back-pano i[data-v-72c6a2c0], .header .right > i[data-v-72c6a2c0] {
    font-size: .5rem
  }

  .header .right > div[data-v-72c6a2c0] {
    right: 10px;
    top: .75rem;
    padding: 4px .2rem
  }

  .header .right > div[data-v-72c6a2c0]:after {
    right: .23rem
  }

  .header .right > div li[data-v-72c6a2c0] {
    margin-top: .15rem
  }

  .header .right > div li i[data-v-72c6a2c0] {
    font-size: .3rem
  }

  .header .right > div li b[data-v-72c6a2c0] {
    left: .2rem;
    top: .15rem
  }

  .header .right > div li span[data-v-72c6a2c0] {
    padding-bottom: .15rem;
    margin-left: .5rem;
    font-size: .25rem
  }

  .header .right > div .home a[data-v-72c6a2c0] {
    margin-top: .15rem;
    margin-bottom: 0;
    width: 1.4rem
  }

  .header .title[data-v-72c6a2c0] {
    font-size: .3rem
  }

  .header .content[data-v-72c6a2c0] {
    top: 1rem;
    left: 2rem;
    right: 2rem;
    padding: 10px
  }

  .header .content > div[data-v-72c6a2c0] {
    max-height: 3rem;
    font-size: .25rem;
    line-height: 1.5
  }
}

@media only screen and (min-device-width: 768px)and (orientation: landscape) {
  .header[data-v-72c6a2c0] {
    height: .8rem
  }

  .header .title i[data-v-72c6a2c0] {
    margin-bottom: 0
  }
}

.app-share[data-v-72c6a2c0] {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: #fff;
  color: var(--editor-main-color);
  text-shadow: none;
  border-radius: .146667rem .146667rem 0 0;
  z-index: 1000
}

.app-share i[data-v-72c6a2c0] {
  font-size: 1rem;
  margin: .666667rem 0 .106667rem;
  display: inline-block
}

.app-share ul[data-v-72c6a2c0] {
  overflow: hidden
}

.app-share ul div[data-v-72c6a2c0] {
  text-align: center;
  font-size: .34rem
}

.app-share ul li[data-v-72c6a2c0] {
  width: 33.3%;
  float: left;
  overflow: hidden;
  text-align: center
}

.app-share ul.flex[data-v-72c6a2c0] {
  display: flex
}

.app-share ul.flex li[data-v-72c6a2c0] {
  float: none
}

.app-share > div[data-v-72c6a2c0] {
  height: 1.293333rem;
  font-size: 16px;
  text-align: center;
  border-top: 1px solid #eee;
  margin-top: .466667rem;
  line-height: 1.293333rem
}

.animated.short.faster {
  -webkit-animation-duration: .3s;
  animation-duration: .3s
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translate3d(0, 1rem, 0)
  }

  to {
    opacity: 1;
    transform: translateZ(0)
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translate3d(0, 1rem, 0)
  }

  to {
    opacity: 1;
    transform: translateZ(0)
  }
}

@-webkit-keyframes fadeOutDown {
  0% {
    opacity: 1
  }

  to {
    opacity: 0;
    transform: translate3d(0, 1rem, 0)
  }
}

@keyframes fadeOutDown {
  0% {
    opacity: 1
  }

  to {
    opacity: 0;
    transform: translate3d(0, 1rem, 0)
  }
}

.information[data-v-07e23c81] {
  position: absolute;
  left: 0;
  top: 20px;
  height: 34px;
  border-radius: 0 34px 34px 0;
  background: rgba(0, 0, 0, .3);
  pointer-events: all;
  color: hsla(0, 0%, 100%, .88);
  z-index: 100
}

.information.mobile[data-v-07e23c81] {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  background: none;
  height: 0
}

.information[data-v-07e23c81] .icon {
  cursor: pointer;
  display: flex;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 24px;
  align-items: center;
  justify-content: flex-start;
  color: inherit
}

.information[data-v-07e23c81] .icon i {
  font-size: 14px
}

.floor-switch[data-v-73278a1f] {
  pointer-events: all;
  position: absolute;
  bottom: calc(100% + 5px);
  left: 20px;
  z-index: 10;
  transition: bottom .1s
}

.floor-switch li[data-v-73278a1f], .floor-switch ul[data-v-73278a1f] {
  padding: 0;
  margin: 0
}

.floor-switch ul[data-v-73278a1f] {
  position: relative;
  z-index: 2
}

.floor-switch li[data-v-73278a1f] {
  cursor: pointer;
  display: flex;
  align-items: center;
  position: relative;
  height: 50px
}

.floor-switch li:first-child b[data-v-73278a1f]:before {
  display: none
}

.floor-switch li:first-child.active b[data-v-73278a1f]:after {
  bottom: -10px
}

.floor-switch li:last-child b[data-v-73278a1f]:after {
  display: none
}

.floor-switch li:last-child.active b[data-v-73278a1f]:before {
  top: -10px
}

.floor-switch li b[data-v-73278a1f] {
  position: relative;
  width: 16px;
  height: 16px;
  background-color: #1c1c1c;
  border-radius: 50%;
  box-shadow: 0 0 2px 1px #404040;
  cursor: pointer
}

.floor-switch li b[data-v-73278a1f]:before {
  top: -5px
}

.floor-switch li b[data-v-73278a1f]:after, .floor-switch li b[data-v-73278a1f]:before {
  content: "";
  position: absolute;
  left: 50%;
  margin-left: -3px;
  background: #1c1c1c;
  width: 6px;
  height: 6px
}

.floor-switch li b[data-v-73278a1f]:after {
  bottom: -5px
}

.floor-switch li span[data-v-73278a1f] {
  margin-left: 10px;
  font-size: 14px;
  cursor: pointer;
  color: #eee;
  text-shadow: 0 0 4px rgba(0, 0, 0, .5)
}

.floor-switch li.active b[data-v-73278a1f] {
  left: -6px;
  width: 28px;
  height: 28px;
  border: 6px solid #1c1c1c;
  background-color: #404040;
  box-shadow: 0 0 2px 1px #404040
}

.floor-switch li.active b[data-v-73278a1f]:before {
  top: -10px
}

.floor-switch li.active b[data-v-73278a1f]:after {
  bottom: -10px
}

.floor-switch li.active span[data-v-73278a1f] {
  margin-left: 0;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  color: hsla(0, 0%, 100%, .88);
  border: 4px solid #1c1c1c;
  background-color: #404040;
  border-radius: 32px;
  box-shadow: 0 0 2px 1px #404040;
  padding: 0 10px;
  text-shadow: none
}

.floor-switch li.active span[data-v-73278a1f]:before {
  content: "";
  position: absolute;
  left: -10px;
  background: #1c1c1c;
  width: 7px;
  height: 4px;
  box-shadow: -2px 0 2px 1px #404040
}

.floor-switch li.active span[data-v-73278a1f]:after {
  left: -16px;
  height: 11px;
  border-radius: 50%
}

.floor-switch[data-v-73278a1f]:after, .floor-switch li.active span[data-v-73278a1f]:after {
  content: "";
  position: absolute;
  background: #1c1c1c;
  width: 6px
}

.floor-switch[data-v-73278a1f]:after {
  left: 5px;
  top: 20px;
  bottom: 20px;
  box-shadow: 0 0 2px 1px #404040;
  z-index: 1
}

[is-mobile] .floor-switch[data-v-73278a1f] {
  bottom: 2.5rem
}

[is-mobile] .floor-switch.showTours[data-v-73278a1f] {
  bottom: 5rem
}

[is-mobile] .floor-switch li[data-v-73278a1f] {
  height: 45px
}

[is-mobile] .floor-switch li:first-child.active b[data-v-73278a1f]:after {
  bottom: -6px
}

[is-mobile] .floor-switch li:last-child.active b[data-v-73278a1f]:before {
  top: -6px
}

[is-mobile] .floor-switch li b[data-v-73278a1f] {
  width: 14px;
  height: 14px
}

[is-mobile] .floor-switch li b[data-v-73278a1f]:before {
  top: -3px;
  left: 50%;
  margin-left: -2px;
  width: 4px;
  height: 4px
}

[is-mobile] .floor-switch li b[data-v-73278a1f]:after {
  bottom: -3px;
  left: 50%;
  margin-left: -2px;
  width: 4px;
  height: 4px
}

[is-mobile] .floor-switch li span[data-v-73278a1f] {
  font-size: .36842rem
}

[is-mobile] .floor-switch li.active b[data-v-73278a1f] {
  left: -3px;
  width: 20px;
  height: 20px;
  border: 4px solid #1c1c1c
}

[is-mobile] .floor-switch li.active b[data-v-73278a1f]:before {
  top: -6px
}

[is-mobile] .floor-switch li.active b[data-v-73278a1f]:after {
  bottom: -6px
}

[is-mobile] .floor-switch li.active span[data-v-73278a1f] {
  height: 30px;
  border: 3px solid #1c1c1c;
  border-radius: 30px;
  padding: 0 10px;
  margin-left: 5px
}

[is-mobile] .floor-switch li.active span[data-v-73278a1f]:before {
  left: -11px;
  width: 10px;
  height: 4px;
  box-shadow: -2px 0 1px 1px #404040
}

[is-mobile] .floor-switch li.active span[data-v-73278a1f]:after {
  left: -14px;
  width: 3px;
  height: 6px;
  border-radius: 40%
}

[is-mobile] .floor-switch[data-v-73278a1f]:after {
  left: 5px;
  top: 20px;
  bottom: 20px;
  width: 4px
}

@media (orientation: landscape) {
  [is-mobile] .floor-switch[data-v-73278a1f] {
    bottom: 1rem
  }

  [is-mobile] .floor-switch li span[data-v-73278a1f] {
    font-size: .25rem
  }
}

.controls-left-buttons[data-v-5c93102a] {
  margin-left: 20px;
  margin-bottom: 20px;
  display: flex
}

.buttons.tour[data-v-5c93102a] {
  margin-right: 10px
}

.buttons.tour > div[data-v-5c93102a] {
  margin-left: 0;
  margin-right: 0;
  padding: 0 10px
}

.buttons.tour > div.show-list[data-v-5c93102a] {
  border-left: solid 1px var(--editor-font-color)
}

.buttons.tour > div .icon-pull-down[data-v-5c93102a] {
  font-size: 12px
}

.buttons.tour > div span[data-v-5c93102a] {
  right: -10px
}

.tour-list[data-v-5c93102a] {
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  height: 120px;
  background-color: var(--editor-menu-back);
  pointer-events: all;
  left: var(--editor-toolbox-left);
  z-index: 1;
  transition: all .3s ease
}

.tour-list.ban[data-v-5c93102a] {
  pointer-events: none
}

.tour-list .part-content[data-v-5c93102a] {
  display: flex;
  flex-direction: row;
  overflow: hidden;
  width: 100%;
  height: 100%
}

.tour-list .part-content .part-list[data-v-5c93102a] {
  width: 100%;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0 10px;
  box-sizing: border-box
}

.tour-list .part-content .part-list .part-item[data-v-5c93102a] {
  width: 120px;
  height: 80px;
  position: relative;
  cursor: pointer;
  margin-right: 10px;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: 50%
}

.tour-list .part-content .part-list .part-item[data-v-5c93102a]:last-of-type {
  margin-right: 0
}

.tour-list .part-content .part-list .part-item[data-v-5c93102a]:hover {
  opacity: .6
}

.tour-list .part-content .part-list .part-item .precent[data-v-5c93102a] {
  width: 0;
  height: 24px;
  position: absolute;
  bottom: 0;
  left: 0;
  background: #00c8af;
  opacity: .4;
  z-index: 1
}

.tour-list .part-content .part-list .part-item .part-title[data-v-5c93102a] {
  width: 100%;
  height: 24px;
  background: linear-gradient(180deg, rgba(0, 0, 0, .25), rgba(0, 0, 0, .5));
  position: absolute;
  bottom: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  z-index: 10
}

.play-control[data-v-5c93102a] {
  pointer-events: all;
  height: 34px;
  background-color: rgba(0, 0, 0, .3);
  min-width: 34px;
  border-radius: 17px;
  margin-left: 10px
}

.play-control[data-v-5c93102a], .play-control .tour-btn[data-v-5c93102a] {
  display: flex;
  align-items: center;
  justify-content: center
}

.play-control .tour-btn[data-v-5c93102a] {
  width: 34px;
  height: 22px;
  cursor: pointer
}

.play-control .tour-btn > .iconfont[data-v-5c93102a] {
  font-size: 14px
}

.play-control .tour-btn.play-btn > .iconfont[data-v-5c93102a] {
  font-size: 20px;
  transition: rotate .3s
}

.play-control .tour-btn.bor[data-v-5c93102a] {
  border-left: 1px solid hsla(0, 0%, 100%, .2)
}

.play-control .tour-btn.bor > .iconfont[data-v-5c93102a] {
  transform: rotate(180deg)
}

.play-control .tour-btn.bor > .iconfont.active[data-v-5c93102a] {
  transform: rotate(0deg)
}

.controls-right-buttons[data-v-24306319] {
  display: flex;
  margin-right: 20px;
  margin-bottom: 20px
}

.controls-right-buttons > div[data-v-24306319] {
  cursor: pointer;
  margin-left: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  background-color: rgba(0, 0, 0, .3);
  border-radius: 50%;
  font-size: 18px
}

.controls-right-buttons .playing[data-v-24306319] {
  -webkit-animation: spinner-24306319 4s linear infinite;
  animation: spinner-24306319 4s linear infinite
}

@-webkit-keyframes spinner-24306319 {
  0% {
    transform: rotate(0)
  }

  to {
    transform: rotate(1turn)
  }
}

@keyframes spinner-24306319 {
  0% {
    transform: rotate(0)
  }

  to {
    transform: rotate(1turn)
  }
}

.bottom-controls[data-v-7cd1b0a0] {
  width: 100%;
  position: absolute;
  left: 0;
  right: var(--editor-toolbox-width);
  bottom: 20px;
  height: 34px;
  display: flex;
  justify-content: space-between;
  transition: bottom .3s ease;
  z-index: 100
}

[data-v-7cd1b0a0] .buttons {
  pointer-events: all;
  display: flex;
  align-items: center;
  justify-content: space-around;
  height: 34px;
  border-radius: 17px;
  background-color: rgba(0, 0, 0, .3)
}

[data-v-7cd1b0a0] .buttons > div {
  position: relative;
  margin-left: 20px;
  margin-right: 20px;
  cursor: pointer
}

[data-v-7cd1b0a0] .buttons > div.active {
  color: var(--editor-main-color)
}

[data-v-7cd1b0a0] .buttons > div > i {
  font-size: 18px
}

[data-v-7cd1b0a0] .buttons > div span {
  cursor: pointer;
  display: none;
  position: absolute;
  top: -20px;
  right: -15px;
  width: 24px;
  height: 24px;
  background-color: rgba(0, 0, 0, .5);
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  color: var(--editor-main-color);
  transition: all .1s
}

[data-v-7cd1b0a0] .buttons > div span:hover {
  transform: scale(1.2)
}

[data-v-7cd1b0a0] .buttons > div span.disable i {
  opacity: .5
}

.wrapper[data-v-71ee85bf] {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center
}

.error[data-v-71ee85bf] {
  height: 18px;
  margin-top: 10px;
  color: red;
  text-align: left;
  width: 100%;
  padding-left: 10px
}

.scene-loading[data-v-6faf0118] {
  display: table;
  table-layout: fixed;
  height: 100%;
  width: 100%;
  z-index: 100
}

.scene-loading.thumb[data-v-6faf0118] {
  position: fixed;
  left: 0;
  top: 0;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: cover;
  z-index: 5000
}

.scene-loading.thumb.default[data-v-6faf0118] {
  background-position: 100%
}

.scene-loading *[data-v-6faf0118] {
  opacity: 1 !important
}

.scene-loading .content[data-v-6faf0118] {
  width: 100%;
  height: 100%;
  display: table-cell;
  text-align: center;
  vertical-align: middle
}

.scene-loading .content .all[data-v-6faf0118] {
  perspective: 100px;
  text-align: center;
  display: inline-block
}

.scene-loading .content .brick[data-v-6faf0118] {
  text-align: center;
  position: relative;
  width: 30px;
  height: 10px;
  transform-style: preserve-3d;
  transform-origin: 15px 5px;
  margin: 0 auto 2.5px
}

.scene-loading .content .brick-1[data-v-6faf0118] {
  -webkit-animation: rorate-6faf0118 2s linear 1s infinite;
  animation: rorate-6faf0118 2s linear 1s infinite;
  transform: rotateX(-30deg) rotateY(45deg) translateZ(30px)
}

.scene-loading .content .brick-2[data-v-6faf0118] {
  -webkit-animation: rorate-6faf0118 2s linear .75s infinite;
  animation: rorate-6faf0118 2s linear .75s infinite;
  transform: rotateX(-30deg) rotateY(45deg) translateZ(20px)
}

.scene-loading .content .brick-3[data-v-6faf0118] {
  -webkit-animation: rorate-6faf0118 2s linear .5s infinite;
  animation: rorate-6faf0118 2s linear .5s infinite;
  transform: rotateX(-30deg) rotateY(45deg) translateZ(10px)
}

.scene-loading .content .face[data-v-6faf0118] {
  width: 30px;
  height: 10px;
  overflow: hidden;
  position: absolute;
  background: hsla(0, 0%, 100%, .4);
  opacity: 0
}

.scene-loading .content .brick.enter[data-v-6faf0118] {
  transition: all .5s;
  transform: rotateX(-30deg) rotateY(45deg)
}

.scene-loading .content .brick.enter .face[data-v-6faf0118] {
  transition: all .5s;
  opacity: 1
}

.scene-loading .content .brick-2 .face[data-v-6faf0118] {
  background: hsla(0, 0%, 100%, .3)
}

.scene-loading .content .brick-2 .brick-back[data-v-6faf0118], .scene-loading .content .brick-2 .brick-front[data-v-6faf0118] {
  background: hsla(0, 0%, 100%, .4)
}

.scene-loading .content .brick-3 .face[data-v-6faf0118] {
  background: hsla(0, 0%, 100%, .2)
}

.scene-loading .content .brick-3 .brick-back[data-v-6faf0118], .scene-loading .content .brick-3 .brick-front[data-v-6faf0118] {
  background: hsla(0, 0%, 100%, .1)
}

.scene-loading .content .brick-front[data-v-6faf0118] {
  transform: translateZ(15px);
  background: hsla(0, 0%, 100%, .6)
}

.scene-loading .content .brick-top[data-v-6faf0118] {
  width: 30px;
  height: 30px;
  transform: rotateX(90deg) translateZ(15px);
  background-color: hsla(0, 0%, 100%, .8)
}

.scene-loading .content .brick-bottom[data-v-6faf0118] {
  width: 30px;
  height: 30px;
  transform: rotateX(-90deg) translateZ(-5px);
  background-color: hsla(0, 0%, 100%, .8)
}

.scene-loading .content .brick-left[data-v-6faf0118] {
  transform: rotateY(-90deg) translateZ(15px);
  background: hsla(0, 0%, 100%, .5)
}

.scene-loading .content .brick-right[data-v-6faf0118] {
  transform: rotateY(90deg) translateZ(15px);
  background: hsla(0, 0%, 100%, .5)
}

.scene-loading .content .brick-back[data-v-6faf0118] {
  transform: rotateY(180deg) translateZ(15px);
  background: hsla(0, 0%, 100%, .6)
}

.scene-loading .logo[data-v-6faf0118] {
  width: 100%;
  color: #fff;
  font-size: 16px;
  text-align: center;
  opacity: 0
}

.scene-loading .logo.enter[data-v-6faf0118] {
  -webkit-animation: logo-enter-6faf0118 .5s forwards;
  animation: logo-enter-6faf0118 .5s forwards;
  visibility: initial
}

.scene-loading .logo .logo-main[data-v-6faf0118] {
  width: 140px;
  height: 70px;
  position: absolute;
  left: 50%;
  top: 80%;
  transform: translateX(-50%) translateY(-50%)
}

.scene-loading .logo div[data-v-6faf0118] {
  margin: 0 auto;
  width: 100%;
  height: 100%;
  position: relative;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 50%;
  min-height: 70px
}

.scene-loading .logo i[data-v-6faf0118] {
  position: absolute;
  left: 50%;
  top: 65%;
  transform: translateX(-50%) translateY(-50%);
  font-size: 148px
}

.scene-loading .copy-right[data-v-6faf0118] {
  color: hsla(0, 0%, 100%, .6);
  opacity: .5;
  position: absolute;
  left: 50%;
  bottom: 30px;
  transform: translateX(-50%);
  line-height: 30px;
  height: 48px;
  white-space: nowrap
}

.scene-loading .copy-right span[data-v-6faf0118] {
  white-space: nowrap
}

.small[data-v-6faf0118] {
  display: table;
  table-layout: fixed;
  height: 100%;
  width: 100%;
  z-index: 100
}

.small *[data-v-6faf0118] {
  opacity: 1 !important
}

.small .content[data-v-6faf0118] {
  width: 100%;
  height: 100%;
  display: table-cell;
  text-align: center;
  vertical-align: middle
}

.small .content .all[data-v-6faf0118] {
  perspective: 100px;
  text-align: center;
  display: inline-block
}

.small .content .brick[data-v-6faf0118] {
  text-align: center;
  position: relative;
  width: 12px;
  height: 4px;
  transform-style: preserve-3d;
  transform-origin: 6px 2px;
  margin: 0 auto 1px
}

.small .content .brick-1[data-v-6faf0118] {
  -webkit-animation: rorate-6faf0118 2s linear 1s infinite;
  animation: rorate-6faf0118 2s linear 1s infinite;
  transform: rotateX(-30deg) rotateY(45deg) translateZ(30px)
}

.small .content .brick-2[data-v-6faf0118] {
  -webkit-animation: rorate-6faf0118 2s linear .75s infinite;
  animation: rorate-6faf0118 2s linear .75s infinite;
  transform: rotateX(-30deg) rotateY(45deg) translateZ(20px)
}

.small .content .brick-3[data-v-6faf0118] {
  -webkit-animation: rorate-6faf0118 2s linear .5s infinite;
  animation: rorate-6faf0118 2s linear .5s infinite;
  transform: rotateX(-30deg) rotateY(45deg) translateZ(10px)
}

.small .content .face[data-v-6faf0118] {
  width: 12px;
  height: 4px;
  overflow: hidden;
  position: absolute;
  background: hsla(0, 0%, 100%, .4);
  opacity: 0
}

.small .content .brick.enter[data-v-6faf0118] {
  transition: all .5s;
  transform: rotateX(-30deg) rotateY(45deg)
}

.small .content .brick.enter .face[data-v-6faf0118] {
  transition: all .5s;
  opacity: 1
}

.small .content .brick-2 .face[data-v-6faf0118] {
  background: hsla(0, 0%, 100%, .3)
}

.small .content .brick-2 .brick-back[data-v-6faf0118], .small .content .brick-2 .brick-front[data-v-6faf0118] {
  background: hsla(0, 0%, 100%, .4)
}

.small .content .brick-3 .face[data-v-6faf0118] {
  background: hsla(0, 0%, 100%, .2)
}

.small .content .brick-3 .brick-back[data-v-6faf0118], .small .content .brick-3 .brick-front[data-v-6faf0118] {
  background: hsla(0, 0%, 100%, .1)
}

.small .content .brick-front[data-v-6faf0118] {
  transform: translateZ(6px);
  background: hsla(0, 0%, 100%, .6)
}

.small .content .brick-top[data-v-6faf0118] {
  transform: rotateX(90deg) translateZ(6px)
}

.small .content .brick-bottom[data-v-6faf0118], .small .content .brick-top[data-v-6faf0118] {
  width: 12px;
  height: 12px;
  background-color: hsla(0, 0%, 100%, .8)
}

.small .content .brick-bottom[data-v-6faf0118] {
  transform: rotateX(-90deg) translateZ(-2px)
}

.small .content .brick-left[data-v-6faf0118] {
  transform: rotateY(-90deg) translateZ(6px);
  background: hsla(0, 0%, 100%, .5)
}

.small .content .brick-right[data-v-6faf0118] {
  transform: rotateY(90deg) translateZ(6px);
  background: hsla(0, 0%, 100%, .5)
}

.small .content .brick-back[data-v-6faf0118] {
  transform: rotateY(180deg) translateZ(6px);
  background: hsla(0, 0%, 100%, .6)
}

.small .logo[data-v-6faf0118] {
  width: 100%;
  color: #fff;
  font-size: 16px;
  text-align: center;
  opacity: 0
}

.small .logo.enter[data-v-6faf0118] {
  -webkit-animation: logo-enter-6faf0118 .5s forwards;
  animation: logo-enter-6faf0118 .5s forwards;
  visibility: initial
}

.small .logo .logo-main[data-v-6faf0118] {
  width: 70px;
  height: 35px;
  position: absolute;
  left: 50%;
  top: 80%;
  transform: translateX(-50%) translateY(-50%)
}

.small .logo div[data-v-6faf0118] {
  margin: 0 auto;
  width: 100%;
  height: 100%;
  position: relative;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 50%;
  min-height: 35px
}

.small .logo i[data-v-6faf0118] {
  position: absolute;
  left: 50%;
  top: 65%;
  transform: translateX(-50%) translateY(-50%);
  font-size: 74px
}

.small .logo-bottom[data-v-6faf0118] {
  width: 100%;
  height: 48px;
  color: #fff;
  font-size: 16px;
  position: absolute;
  bottom: 42px;
  left: 0
}

.small .logo-bottom div[data-v-6faf0118] {
  margin: 0 auto;
  width: 100%;
  height: 100%;
  position: relative;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 50%
}

.small .logo-bottom i[data-v-6faf0118] {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  font-size: 140px
}

[edit-mode=mobile] .content .brick[data-v-6faf0118], [show-mode=mobile] .content .brick[data-v-6faf0118] {
  width: 24px;
  height: 8px;
  transform-origin: 12px 4px;
  margin: 0 auto 2px
}

[edit-mode=mobile] .content .brick.enter[data-v-6faf0118], [show-mode=mobile] .content .brick.enter[data-v-6faf0118] {
  transition: all .5s;
  transform: rotateX(-30deg) rotateY(45deg)
}

[edit-mode=mobile] .content .brick.enter .face[data-v-6faf0118], [show-mode=mobile] .content .brick.enter .face[data-v-6faf0118] {
  transition: all .5s;
  opacity: 1
}

[edit-mode=mobile] .content .brick-1[data-v-6faf0118], [show-mode=mobile] .content .brick-1[data-v-6faf0118] {
  -webkit-animation: rorate-6faf0118 2s linear 1s infinite;
  animation: rorate-6faf0118 2s linear 1s infinite;
  transform: rotateX(-30deg) rotateY(45deg) translateZ(30px)
}

[edit-mode=mobile] .content .brick-2[data-v-6faf0118], [show-mode=mobile] .content .brick-2[data-v-6faf0118] {
  -webkit-animation: rorate-6faf0118 2s linear .75s infinite;
  animation: rorate-6faf0118 2s linear .75s infinite;
  transform: rotateX(-30deg) rotateY(45deg) translateZ(20px)
}

[edit-mode=mobile] .content .brick-3[data-v-6faf0118], [show-mode=mobile] .content .brick-3[data-v-6faf0118] {
  -webkit-animation: rorate-6faf0118 2s linear .5s infinite;
  animation: rorate-6faf0118 2s linear .5s infinite;
  transform: rotateX(-30deg) rotateY(45deg) translateZ(10px)
}

[edit-mode=mobile] .content .face[data-v-6faf0118], [show-mode=mobile] .content .face[data-v-6faf0118] {
  width: 24px;
  height: 8px
}

[edit-mode=mobile] .content .brick-front[data-v-6faf0118], [show-mode=mobile] .content .brick-front[data-v-6faf0118] {
  transform: translateZ(12px)
}

[edit-mode=mobile] .content .brick-top[data-v-6faf0118], [show-mode=mobile] .content .brick-top[data-v-6faf0118] {
  width: 24px;
  height: 24px;
  transform: rotateX(90deg) translateZ(12px)
}

[edit-mode=mobile] .content .brick-bottom[data-v-6faf0118], [show-mode=mobile] .content .brick-bottom[data-v-6faf0118] {
  width: 24px;
  height: 24px;
  transform: rotateX(-90deg) translateZ(-4px)
}

[edit-mode=mobile] .content .brick-left[data-v-6faf0118], [show-mode=mobile] .content .brick-left[data-v-6faf0118] {
  transform: rotateY(-90deg) translateZ(12px)
}

[edit-mode=mobile] .content .brick-right[data-v-6faf0118], [show-mode=mobile] .content .brick-right[data-v-6faf0118] {
  transform: rotateY(90deg) translateZ(12px)
}

[edit-mode=mobile] .content .brick-back[data-v-6faf0118], [show-mode=mobile] .content .brick-back[data-v-6faf0118] {
  transform: rotateY(180deg) translateZ(12px)
}

[edit-mode=mobile] .logo[data-v-6faf0118], [show-mode=mobile] .logo[data-v-6faf0118] {
  margin-top: 5px
}

[edit-mode=mobile] .logo .logo-main[data-v-6faf0118], [show-mode=mobile] .logo .logo-main[data-v-6faf0118] {
  margin-top: 15px
}

[edit-mode=mobile] .logo i[data-v-6faf0118], [show-mode=mobile] .logo i[data-v-6faf0118] {
  font-size: 100px
}

[edit-mode=mobile] .logo-bottom[data-v-6faf0118], [show-mode=mobile] .logo-bottom[data-v-6faf0118] {
  bottom: .7rem
}

[edit-mode=mobile] .logo-bottom i[data-v-6faf0118], [show-mode=mobile] .logo-bottom i[data-v-6faf0118] {
  font-size: 75px
}

[edit-mode=mobile] .logo-bottom div[data-v-6faf0118], [show-mode=mobile] .logo-bottom div[data-v-6faf0118] {
  height: 36px
}

@-webkit-keyframes logo-enter-6faf0118 {
  0% {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

@keyframes logo-enter-6faf0118 {
  0% {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

@-webkit-keyframes rorate-6faf0118 {
  0% {
    transform: rotateX(-30deg) rotateY(-45deg)
  }

  50% {
    transform: rotateX(-30deg) rotateY(-315deg)
  }

  to {
    transform: rotateX(-30deg) rotateY(-315deg)
  }
}

@keyframes rorate-6faf0118 {
  0% {
    transform: rotateX(-30deg) rotateY(-45deg)
  }

  50% {
    transform: rotateX(-30deg) rotateY(-315deg)
  }

  to {
    transform: rotateX(-30deg) rotateY(-315deg)
  }
}

.check-browser[data-v-c29c77ea] {
  width: 100vw;
  height: 100vh;
  background: #f7f7f7;
  overflow: hidden
}

.check-browser .pic[data-v-c29c77ea] {
  width: 240px;
  height: 240px;
  background: url(https://4dkk.4dage.com/v4/www/viewer/img/pic_update.342ed9ce.png) no-repeat;
  background-size: 100% 100%;
  margin: 120px auto 30px
}

.check-browser .tips[data-v-c29c77ea] {
  font-size: 24px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #646566;
  line-height: 33px;
  text-align: center
}

.check-browser .center-tips[data-v-c29c77ea] {
  font-family: PingFangSC-Regular, PingFang SC;
  text-align: center;
  margin: 10px auto 30px
}

.check-browser .browser-list[data-v-c29c77ea], .check-browser .center-tips[data-v-c29c77ea] {
  font-size: 16px;
  font-weight: 400;
  color: #909090;
  line-height: 32px
}

.check-browser .browser-list[data-v-c29c77ea] {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center
}

.check-browser .browser-list .browser-item[data-v-c29c77ea] {
  width: 80px;
  margin-right: 100px;
  margin-bottom: 10px
}

.check-browser .browser-list .browser-item[data-v-c29c77ea]:last-of-type {
  margin-right: 0
}

.check-browser .browser-list .browser-item .browser-pic[data-v-c29c77ea] {
  width: 80px;
  height: 80px;
  background-size: 100% 100%;
  background-repeat: no-repeat
}

.check-browser .browser-list .browser-item .browser-pic.Firefox[data-v-c29c77ea] {
  background-image: url(https://4dkk.4dage.com/v4/www/viewer/img/browser_Firefox.cbc0ba86.png)
}

.check-browser .browser-list .browser-item .browser-pic.Edge[data-v-c29c77ea] {
  background-image: url(https://4dkk.4dage.com/v4/www/viewer/img/browser_Edge.cb5b542a.png)
}

.check-browser .browser-list .browser-item .browser-pic.Safari[data-v-c29c77ea] {
  background-image: url(https://4dkk.4dage.com/v4/www/viewer/img/browser_Safari.42f97fd2.png)
}

.check-browser .browser-list .browser-item .browser-pic.Chrome[data-v-c29c77ea] {
  background-image: url(https://4dkk.4dage.com/v4/www/viewer/img/browser_Chrome.5a769bf8.png)
}

.check-browser .browser-list .browser-item .borwser-name[data-v-c29c77ea] {
  display: block;
  width: 100%;
  font-size: 16px;
  text-align: center
}

.mobile .pic[data-v-c29c77ea] {
  width: 3.2rem;
  height: 3.2rem;
  background: url(https://4dkk.4dage.com/v4/www/viewer/img/pic_update.342ed9ce.png) no-repeat;
  background-size: 100% 100%;
  margin: 5.2rem auto .4rem
}

.mobile .tips[data-v-c29c77ea] {
  font-size: .32rem;
  color: #646566;
  line-height: .44rem
}

.mobile .center-tips[data-v-c29c77ea], .mobile .tips[data-v-c29c77ea] {
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  text-align: center
}

.mobile .center-tips[data-v-c29c77ea] {
  font-size: .2133rem;
  color: #909090;
  line-height: .4267rem;
  margin: 10px auto .4rem
}

.mobile .browser-list[data-v-c29c77ea] {
  width: 100%;
  height: auto;
  font-size: 16px;
  font-weight: 400;
  color: #909090;
  line-height: .4267rem;
  display: flex;
  align-items: center;
  justify-content: center
}

.mobile .browser-list .browser-item[data-v-c29c77ea] {
  width: 1.0667rem;
  margin-right: 1.3333rem;
  margin-bottom: .1333rem
}

.mobile .browser-list .browser-item[data-v-c29c77ea]:last-of-type {
  margin-right: 0
}

.mobile .browser-list .browser-item .browser-pic[data-v-c29c77ea] {
  width: 1.0667rem;
  height: 1.0667rem;
  background-size: 100% 100%;
  background-repeat: no-repeat
}

.mobile .browser-list .browser-item .browser-pic.Firefox[data-v-c29c77ea] {
  background-image: url(https://4dkk.4dage.com/v4/www/viewer/img/browser_Firefox.cbc0ba86.png)
}

.mobile .browser-list .browser-item .browser-pic.Edge[data-v-c29c77ea] {
  background-image: url(https://4dkk.4dage.com/v4/www/viewer/img/browser_Edge.cb5b542a.png)
}

.mobile .browser-list .browser-item .browser-pic.Safari[data-v-c29c77ea] {
  background-image: url(https://4dkk.4dage.com/v4/www/viewer/img/browser_Safari.42f97fd2.png)
}

.mobile .browser-list .browser-item .browser-pic.Chrome[data-v-c29c77ea] {
  background-image: url(https://4dkk.4dage.com/v4/www/viewer/img/browser_Chrome.5a769bf8.png)
}

.mobile .browser-list .browser-item .borwser-name[data-v-c29c77ea] {
  display: block;
  width: 100%;
  text-align: center;
  font-size: .2133rem
}

[xui_min_map] {
  top: 20px !important;
  right: 20px !important;
}

[xui_min_map] {
  visibility: hidden;
  position: absolute;
  pointer-events: all;
  width: 204px;
  height: 200px;
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 10px;
}

[xui_min_map] canvas {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

[xui_min_map].show {
  visibility: visible;
}

@-webkit-keyframes rorate-data-v-34f3e455 {
  0% {
    -webkit-transform: rotateX(-30deg) rotateY(-45deg);
    transform: rotateX(-30deg) rotateY(-45deg)
  }

  50% {
    -webkit-transform: rotateX(-30deg) rotateY(-315deg);
    transform: rotateX(-30deg) rotateY(-315deg)
  }

  to {
    -webkit-transform: rotateX(-30deg) rotateY(-315deg);
    transform: rotateX(-30deg) rotateY(-315deg)
  }
}

@keyframes rorate-data-v-34f3e455 {
  0% {
    -webkit-transform: rotateX(-30deg) rotateY(-45deg);
    transform: rotateX(-30deg) rotateY(-45deg)
  }

  50% {
    -webkit-transform: rotateX(-30deg) rotateY(-315deg);
    transform: rotateX(-30deg) rotateY(-315deg)
  }

  to {
    -webkit-transform: rotateX(-30deg) rotateY(-315deg);
    transform: rotateX(-30deg) rotateY(-315deg)
  }
}

.widgets-loading[data-v-34f3e455] {
  display: table;
  table-layout: fixed;
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(0, 0, 0, .45);
  z-index: 100
}

.widgets-loading .content[data-v-34f3e455] {
  width: 100%;
  height: 100%;
  display: table-cell;
  text-align: center;
  vertical-align: middle
}

.widgets-loading .content .all[data-v-34f3e455] {
  -webkit-perspective: 100px;
  perspective: 100px;
  text-align: center;
  display: inline-block
}

.widgets-loading .content .brick[data-v-34f3e455] {
  text-align: center;
  position: relative;
  width: 36px;
  height: 12px;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform-origin: 18px 6px;
  transform-origin: 18px 6px;
  margin: 0 auto 3px
}

.widgets-loading .content .brick-1[data-v-34f3e455] {
  -webkit-animation: rorate-data-v-34f3e455 2s linear 1s infinite;
  animation: rorate-data-v-34f3e455 2s linear 1s infinite;
  -webkit-transform: rotateX(-30deg) rotateY(45deg) translateZ(30px);
  transform: rotateX(-30deg) rotateY(45deg) translateZ(30px)
}

.widgets-loading .content .brick-2[data-v-34f3e455] {
  -webkit-animation: rorate-data-v-34f3e455 2s linear .75s infinite;
  animation: rorate-data-v-34f3e455 2s linear .75s infinite;
  -webkit-transform: rotateX(-30deg) rotateY(45deg) translateZ(20px);
  transform: rotateX(-30deg) rotateY(45deg) translateZ(20px)
}

.widgets-loading .content .brick-3[data-v-34f3e455] {
  -webkit-animation: rorate-data-v-34f3e455 2s linear .5s infinite;
  animation: rorate-data-v-34f3e455 2s linear .5s infinite;
  -webkit-transform: rotateX(-30deg) rotateY(45deg) translateZ(10px);
  transform: rotateX(-30deg) rotateY(45deg) translateZ(10px)
}

.widgets-loading .content .face[data-v-34f3e455] {
  width: 36px;
  height: 12px;
  overflow: hidden;
  position: absolute;
  background: hsla(0, 0%, 100%, .4);
  opacity: 0
}

.widgets-loading .content .brick.enter[data-v-34f3e455] {
  -webkit-transition: all .5s;
  transition: all .5s;
  -webkit-transform: rotateX(-30deg) rotateY(45deg);
  transform: rotateX(-30deg) rotateY(45deg)
}

.widgets-loading .content .brick.enter .face[data-v-34f3e455] {
  -webkit-transition: all .5s;
  transition: all .5s;
  opacity: 1
}

.widgets-loading .content .brick-2 .face[data-v-34f3e455] {
  background: hsla(0, 0%, 100%, .3)
}

.widgets-loading .content .brick-2 .brick-back[data-v-34f3e455], .widgets-loading .content .brick-2 .brick-front[data-v-34f3e455] {
  background: hsla(0, 0%, 100%, .4)
}

.widgets-loading .content .brick-3 .face[data-v-34f3e455] {
  background: hsla(0, 0%, 100%, .2)
}

.widgets-loading .content .brick-3 .brick-back[data-v-34f3e455], .widgets-loading .content .brick-3 .brick-front[data-v-34f3e455] {
  background: hsla(0, 0%, 100%, .1)
}

.widgets-loading .content .brick-front[data-v-34f3e455] {
  -webkit-transform: translateZ(18px);
  transform: translateZ(18px);
  background: hsla(0, 0%, 100%, .6)
}

.widgets-loading .content .brick-top[data-v-34f3e455] {
  width: 36px;
  height: 36px;
  -webkit-transform: rotateX(90deg) translateZ(18px);
  transform: rotateX(90deg) translateZ(18px);
  background-color: hsla(0, 0%, 100%, .8)
}

.widgets-loading .content .brick-bottom[data-v-34f3e455] {
  width: 36px;
  height: 36px;
  -webkit-transform: rotateX(-90deg) translateZ(-6px);
  transform: rotateX(-90deg) translateZ(-6px);
  background-color: hsla(0, 0%, 100%, .8)
}

.widgets-loading .content .brick-left[data-v-34f3e455] {
  -webkit-transform: rotateY(-90deg) translateZ(18px);
  transform: rotateY(-90deg) translateZ(18px);
  background: hsla(0, 0%, 100%, .5)
}

.widgets-loading .content .brick-right[data-v-34f3e455] {
  -webkit-transform: rotateY(90deg) translateZ(18px);
  transform: rotateY(90deg) translateZ(18px);
  background: hsla(0, 0%, 100%, .5)
}

.widgets-loading .content .brick-back[data-v-34f3e455] {
  -webkit-transform: rotateY(180deg) translateZ(18px);
  transform: rotateY(180deg) translateZ(18px);
  background: hsla(0, 0%, 100%, .6)
}

.widgets-loading .logo[data-v-34f3e455] {
  width: 100%;
  height: 48px;
  color: #fff;
  font-size: 16px;
  text-align: center;
  margin-top: 40px;
  opacity: 1;
}

.widgets-loading .logo.enter[data-v-34f3e455] {
  -webkit-animation: logo-enter-data-v-34f3e455 .5s forwards;
  animation: logo-enter-data-v-34f3e455 .5s forwards;
  visibility: initial
}

.widgets-loading .logo .logo-main[data-v-34f3e455] {
  width: 100%;
  height: 80px
}

.widgets-loading .logo div[data-v-34f3e455] {
  margin: 0 auto;
  width: 180px;
  height: 100%;
  position: relative;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 50%
}

.widgets-loading .logo i[data-v-34f3e455] {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  font-size: 140px
}

.widgets-loading .bottom-intro[data-v-34f3e455] {
  font-size: 14px;
  color: #fff;
  opacity: .5;
  position: absolute;
  left: 50%;
  bottom: 20px;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  line-height: 30px;
  height: 48px;
  white-space: nowrap
}

.widgets-loading .bottom-intro i[data-v-34f3e455] {
  vertical-align: middle;
  font-size: 30px
}

.widgets-loading .bottom-intro span[data-v-34f3e455] {
  white-space: nowrap
}

.widgets-loading .bottom-intro div[data-v-34f3e455] {
  margin: 0 auto;
  width: 180px;
  height: 100%;
  position: relative;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 50%
}

.widgets-loading .logo-bottom[data-v-34f3e455] {
  width: 100%;
  height: 48px;
  color: #fff;
  font-size: 16px;
  position: absolute;
  bottom: 42px;
  left: 0
}

.widgets-loading .logo-bottom div[data-v-34f3e455] {
  margin: 0 auto;
  width: 180px;
  height: 100%;
  position: relative;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 50%
}

.widgets-loading .logo-bottom i[data-v-34f3e455] {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  font-size: 140px
}

[is-mobile] [xui_min_map] {
  width: 100px;
  height: 100px;
  top: 2.3rem !important;
  right: 15px !important;
  background-color: rgba(0, 0, 0, .2) !important;
  border-radius: 4px 4px 0 0 !important;
  border-top-left-radius: 0 !important;
  transition: all .3s;
}

[is-mobile] [xui_min_map] {
  width: 100px;
  height: 100px;
  top: 2.3rem !important;
  right: 15px !important;
  background-color: rgba(0, 0, 0, .2) !important;
  border-radius: 4px 4px 0 0 !important;
  border-top-left-radius: 0 !important;
  transition: all .3s;
}

.information.mobile[data-v-07e23c81] {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  background: none;
  height: 0;
}

.header[data-v-72c6a2c0] {
  position: absolute;
  top: 0.3rem;
  left: 0;
  height: 1.15789rem;
  width: 100%;
  z-index: 101;
  color: #fff;
  display: flex;
  align-items: center;
  text-shadow: 0 0 4px rgb(0 0 0 / 40%);
}

.header .left[data-v-72c6a2c0] {
  width: 1rem;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.header .left .back-pano[data-v-72c6a2c0] {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.header .left .back-pano i[data-v-72c6a2c0] {
  font-size: .6rem;
  position: static;
}

.information[data-v-07e23c81] .icon {
  cursor: pointer;
  display: flex;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 24px;
  align-items: center;
  justify-content: flex-start;
  color: inherit;
}

.header .left .back[data-v-72c6a2c0] {
  width: 0.78rem;
  height: 0.78rem;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, .3);
  display: flex;
  align-items: center;
  justify-content: center;
  visibility: hidden;
  position: relative;
}

.header .left .back i[data-v-72c6a2c0] {
  font-size: .3rem;
  width: auto;
  position: static;
}

.header .left .back i[data-v-72c6a2c0] {
  font-size: .3rem;
  width: auto;
  position: static;
}

.header .title[data-v-72c6a2c0], .header .title > div[data-v-72c6a2c0] {
  display: flex;
  height: 100%;
  align-items: center;
  justify-content: center;
}

.header .title[data-v-72c6a2c0] {
  flex: 1;
  width: 100%;
  font-size: .42105rem;
  letter-spacing: 1px;
}

.trans.active {
  transform: translateY(-50%) scale(1);
}

.trans {
  padding: 0 40px 0 0;
  position: absolute;
  right: 35px;
  top: 50%;
  min-width: 420px;
  min-height: 60px;
  z-index: 1000;
  transform: translateY(-50%) scale(0);
  transform-origin: center right;
  transition: all 0.3s cubic-bezier(0.35, 0.32, 0.65, 0.63);
  pointer-events: none;
  /* background-color: rgba(0, 0, 0, 0.8); */
}

.trans .arrow {
  pointer-events: auto;
  content: '';
  position: absolute;
  top: 50%;
  right: 0;
  width: 0;
  height: 0;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
  border-left: 40px solid rgba(27, 27, 28, 0.8);
  transform: translateY(-50%);
}

.show-tag[data-v-26d14923] {
  pointer-events: auto;
  background: rgba(27, 27, 28, .8);
  border-radius: 4px;
  min-width: 400px;
  padding: 30px 20px;
}

.tag-title[data-v-26d14923] {
  word-break: break-all;
}

.show-tag .tag-title h2[data-v-26d14923] {
  font-size: 20px;
  line-height: 20px;
  color: #fff;
  position: relative;
}

.show-tag .desc[data-v-26d14923] {
  margin-top: 10px;
}

.show-tag .desc .text[data-v-26d14923] {
  font-size: 14px;
  color: #999;
  line-height: 20px;
  text-align: justify;
  word-break: break-all;
}

.show-tag .tag-metas[data-v-26d14923] {
  width: 100%;
  height: 225px;
  background: hsla(0, 0%, 100%, .1);
  border-radius: 4px;
  overflow: hidden;
  position: relative;
  cursor: -webkit-zoom-in;
  margin-top: 20px;
}

.pic-box[data-v-74f94aee] {
  width: 100%;
  height: 100%;
  border-radius: 4px;
  border: 1px solid hsla(0, 0%, 100%, .2);
  top: 0;
  left: 0;
}

.del-btn[data-v-74f94aee], .pic-box[data-v-74f94aee] {
  position: absolute;
  z-index: 10;
}

.is-none {
  display: none !important;
}

[xui_tags] {
  position: absolute;
  width: 100%;
  height: 100%;
}

[xui_tags] > div {
  pointer-events: all;
  visibility: hidden;
  position: absolute;
  width: 48px;
  height: 48px;
  margin-left: -24px;
  margin-top: -24px;
}

[is-mobile] [xui_tags_view] > div {
  pointer-events: all;
  /* visibility: hidden; */
  position: absolute;
  width: 48px;
  height: 48px;
  margin-left: -24px;
  margin-top: -24px;
}

/* [xui_tags] > div:hover .content .trans{
    transform: translateY(-50%) scale(1);
    transition: all .3s cubic-bezier(0.075, 0.82, 0.165, 1);
} */
[xui_tags] > div.visible {
  visibility: visible;
}

[xui_tags] .point {
  display: block;
  width: 48px;
  height: 48px;
  background-size: cover;
  cursor: pointer;
}

[is-mobile] [xui_tags_view] .point {
  display: block;
  width: 48px;
  height: 48px;
  background-size: cover;
  cursor: pointer;
}

[xui_tags] .point.zoom {
  animation: tag-animate-zoom 3s -1s linear infinite;
}

[xui_tags] .content {
  /* position: absolute;
right: 60px;
top: 50%;
min-width: 100px;
min-height: 60px;
z-index: 1000;
transform: translateY(-50%) scale(1);
transform-origin: center right;
background-color: rgba(0, 0, 0, 0.8); */
}

[xui_tags] .content .trans {
  padding: 0 40px 0 0;
  position: absolute;
  right: 35px;
  top: 50%;
  min-width: 420px;
  min-height: 60px;
  z-index: 1000;
  transform: translateY(-50%) scale(0);
  transform-origin: center right;
  transition: all 0.3s cubic-bezier(0.35, 0.32, 0.65, 0.63);
  pointer-events: none;
  /* background-color: rgba(0, 0, 0, 0.8); */
}

[is-mobile] [xui_tags_view] .content .trans {
  /* display: none !important; */
  padding: 0 0 0 0;
  right: 50%;
  bottom: 170%;
  top: auto;
  min-width: 1.3333rem;
  min-height: 0.8rem;
  z-index: 1000;
  transform: translateX(50%) scale(0);
  transform-origin: center bottom;
}

[xui_tags] .content .trans.active {
  transform: translateY(-50%) scale(1);
}

[is-mobile] [xui_tags_view] .content .trans.active {
  transform: translateX(50%) scale(1);
}

/* [xui_tags] .content .trans::before {
  pointer-events: auto;
    content: '';
    position: absolute;
    top: 50%;
    right: 0;
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-left: 40px solid rgba(0, 0, 0, 0.8);
    transform: translateY(-50%);
} */
[xui_tags] .content .trans .arrow {
  pointer-events: auto;
  content: '';
  position: absolute;
  top: 50%;
  right: 0;
  width: 0;
  height: 0;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
  border-left: 40px solid rgba(27, 27, 28, 0.8);
  transform: translateY(-50%);
}

[is-mobile] [xui_tags_view] .content .trans .arrow {
  pointer-events: auto;
  content: '';
  position: absolute;
  left: 50%;
  top: 100%;
  width: 0;
  height: 0;
  border-left: 0.2rem solid transparent;
  border-right: 0.2rem solid transparent;
  border-top: 0.5333rem solid rgba(27, 27, 28, 0.8);
  /* border-bottom: 0.2rem solid transparent;
border-left: 0.2rem solid transparent;
border-top: 0.5333rem solid rgba(0, 0, 0, 0.8); */
  transform: translateX(-50%);
}

@keyframes tag-animate-zoom {
  0% {
    transform: scale(1);
  }

  50% {
    transform: scale(0.7);
  }

  100% {
    transform: scale(1);
  }
}

@media only screen and (max-width: 768px) {
  html {
    font-size: 37.5px;
  }

  body {
    font-size: 12px;
  }

  [is-mobile] [xui_min_map] {
    width: 100px;
    height: 100px;
    top: 2.3rem !important;
    right: 15px !important;
    background-color: rgba(0, 0, 0, .2) !important;
    border-radius: 4px 4px 0 0 !important;
    border-top-left-radius: 0 !important;
    transition: all .3s;
  }

  .header .title i[data-v-72c6a2c0] {
    transition: all .3s;
    position: absolute;
    left: 50%;
    bottom: 0;
    font-size: .3rem;
    transform: translateX(-50%);
    margin-bottom: -0.02rem;
  }

  .animated.short.faster {
    -webkit-animation-duration: .3s;
    animation-duration: .3s
  }

  @-webkit-keyframes fadeInUp {
    0% {
      opacity: 0;
      transform: translate3d(0, 1rem, 0)
    }

    to {
      opacity: 1;
      transform: translateZ(0)
    }
  }

  @keyframes fadeInUp {
    0% {
      opacity: 0;
      transform: translate3d(0, 1rem, 0)
    }

    to {
      opacity: 1;
      transform: translateZ(0)
    }
  }

  @-webkit-keyframes fadeOutDown {
    0% {
      opacity: 1
    }

    to {
      opacity: 0;
      transform: translate3d(0, 1rem, 0)
    }
  }

  @keyframes fadeOutDown {
    0% {
      opacity: 1
    }

    to {
      opacity: 0;
      transform: translate3d(0, 1rem, 0)
    }
  }

  [is-mobile] [xui_min_map].collapse {
    transform: translateX(calc(100% + 15px));
  }

  .right .flex {
    display: none !important;
  }

  .right.more .flex {
    display: flex !important;
  }

  .swal2-container, .swal2-popup {
    font-size: 16px !important;
  }

  .tab-layer, .tabs {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .tab-layer {
    width: 100%;
    text-align: center;
    z-index: 10;
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    top: 2.3rem;
    pointer-events: none;
  }

  .disabled, :disabled {
    opacity: .3 !important;
    pointer-events: none !important;
  }

  .tabs {
    pointer-events: auto;
    position: relative;
    background: #222;
    border-radius: 6px;
    padding: 2px;
    border: 1px solid hsla(0, 0%, 100%, .1);
    box-shadow: inset 0 0 6px 0 rgb(0 0 0 / 50%);
  }

  .tab-layer, .tabs {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .tabs span.active {
    opacity: 1;
    background: #444;
    box-shadow: 2px 0 4px 0 rgb(0 0 0 / 30%);
  }

  .tabs span {
    flex: 1;
    color: #fff;
    opacity: .5;
    border-radius: 6px;
    height: 0.94737rem;
    font-size: .36842rem;
    transition: all .3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 10px;
    padding-right: 10px;
    white-space: nowrap;
    z-index: 1;
  }

  .ui-kankan-icon.iconfont {
    color: currentColor;
    font-size: 1em;
  }

  .tabs span i {
    font-size: .47368rem;
    margin-right: 4px;
    pointer-events: none;
  }

  .icon {
    position: relative;
  }

  .iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  .tabs .background {
    position: absolute;
    left: 2px;
    top: 2px;
    bottom: 2px;
    width: 50%;
    border-radius: 4px;
    background: #444;
    box-shadow: 2px 0 4px 0 rgb(0 0 0 / 30%);
    z-index: 0;
    transition: left .3s;
  }
}

.audio > span:not(:last-child) {
  margin-right: 2px;
}

.audio > span {
  --height: 18px;
  width: 4px;
  height: calc(var(--height) * var(--percent));
  background: var(--colors-primary-base);
  transition: height .2s linear;
  display: inline-block;
  margin-left: -3px;
}

[is-mobile] [xui_min_map] .button-switch {
  position: absolute;
  top: 0;
  left: -20px;
  background-color: rgba(0, 0, 0, .2);
  height: 32px;
  width: 20px;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: rotate .3s;
}

[is-mobile] [xui_min_map] .button-switch > .iconfont {
  font-size: 12px;
  transform: scale(.7);
}

.ui-kankan-icon.iconfont {
  color: currentColor;
  font-size: 1em;
}

.icon {
  position: relative;
}

.icon-show_map_collect:before {
  content: "\e679";
}

[is-mobile] [xui_min_map] .button-dollhouse {
  position: absolute;
  bottom: -30px;
  left: 0;
  width: 100%;
  height: 30px;
  font-size: 12px;
  background-color: rgba(0, 0, 0, .2) !important;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border-top: 1px solid #eee;
  border-radius: 0 0 4px 4px;
}

[is-mobile] [xui_min_map] .button-dollhouse > .iconfont {
  font-size: 14px;
  margin-right: 0.0667rem;
}

.ui-kankan-icon.iconfont {
  color: currentColor;
  font-size: 1em;
}

a {
  color: #00c8af !important;
}

[xui_tags_view] .point.zoom {
  /* animation: tag-animate-zoom 3s -1s linear infinite; */
}

[xui_tags_view] .content .trans .arrow {
  pointer-events: auto;
  content: '';
  position: absolute;
  top: 50%;
  right: 0;
  width: 0;
  height: 0;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
  border-left: 40px solid rgba(27, 27, 28, 0.8);
  transform: translateY(-50%);
}

[xui_tags_view] .point {
  display: block;
  width: 48px;
  height: 48px;
  background-size: cover;
  cursor: pointer;
}

[is-mobile] [xui_tags_view] .content .trans.active {
  transform: translateX(50%) scale(1);
}

[is-mobile] [xui_tags_view] .content .trans {
  /* display: none !important; */
  padding: 0 0 0 0;
  right: 50%;
  bottom: 170%;
  top: auto;
  min-width: 1.3333rem;
  min-height: 0.8rem;
  z-index: 1000;
  transform: translateX(50%) scale(0);
  transform-origin: center bottom;
}

[is-mobile] [xui_tags_view] .content .trans .arrow {
  pointer-events: auto;
  content: '';
  position: absolute;
  left: 50%;
  top: 100%;
  width: 0;
  height: 0;
  border-left: 0.2rem solid transparent;
  border-right: 0.2rem solid transparent;
  border-top: 0.5333rem solid rgba(27, 27, 28, 0.8);
  transform: translateX(-50%);
}

[is-mobile] .show-tag[data-v-a8c60814] {
  pointer-events: auto;
  background: rgba(27, 27, 28, .8);
  border-radius: 0.0533rem;
  min-width: 7.4667rem;
  padding: 0.4rem 0.2667rem;
}

[is-mobile] .show-tag .tag-title h2[data-v-a8c60814] {
  font-size: .5333rem;
  color: #fff;
  position: relative;
}

[is-mobile] .show-tag .desc[data-v-a8c60814] {
  margin-bottom: 0.2933rem;
}

[is-mobile] .show-tag .desc .text[data-v-a8c60814] {
  font-size: .3733rem;
  color: #999;
  line-height: .2533rem;
  text-align: justify;
  line-height: .5333rem;
}

[is-mobile] .show-tag .tag-metas[data-v-a8c60814] {
  width: 100%;
  height: 4.2667rem;
  background: hsla(0, 0%, 100%, .1);
  border-radius: 0.0533rem;
  overflow: hidden;
  position: relative;
  cursor: -webkit-zoom-in;
  margin-top: 0.4rem;
}

[xui_tags] {
  position: absolute;
  width: 100%;
  height: 100%;
}

[xui_tags] > div {
  pointer-events: all;
  visibility: hidden;
  position: absolute;
  width: 48px;
  height: 48px;
  margin-left: -24px;
  margin-top: -24px;
}

/* [xui_tags] > div:hover .content .trans{
    transform: translateY(-50%) scale(1);
    transition: all .3s cubic-bezier(0.075, 0.82, 0.165, 1);
} */
[xui_tags] > div.visible {
  visibility: visible;
}

[xui_tags] .point {
  display: block;
  width: 48px;
  height: 48px;
  background-size: cover;
  cursor: pointer;
}

[xui_tags] .point.zoom {
  animation: tag-animate-zoom 3s -1s linear infinite;
}

[xui_tags] .content {
  /* position: absolute;
right: 60px;
top: 50%;
min-width: 100px;
min-height: 60px;
z-index: 1000;
transform: translateY(-50%) scale(1);
transform-origin: center right;
background-color: rgba(0, 0, 0, 0.8); */
}

[xui_tags] .content .trans {
  padding: 0 40px 0 0;
  position: absolute;
  right: 35px;
  top: 50%;
  min-width: 420px;
  min-height: 60px;
  z-index: 1000;
  transform: translateY(-50%) scale(0);
  transform-origin: center right;
  transition: all 0.3s cubic-bezier(0.35, 0.32, 0.65, 0.63);
  pointer-events: none;
  /* background-color: rgba(0, 0, 0, 0.8); */
}

[is-mobile] [xui_tags_view] .content .trans {
  /* display: none !important; */
  padding: 0 0 0 0;
  right: 50%;
  bottom: 170%;
  top: auto;
  min-width: 1.3333rem;
  min-height: 0.8rem;
  z-index: 1000;
  transform: translateX(50%) scale(0);
  transform-origin: center bottom;
}

[xui_tags] .content .trans.active {
  transform: translateY(-50%) scale(1);
}

[is-mobile] [xui_tags_view] .content .trans.active {
  transform: translateX(50%) scale(1);
}

/* [xui_tags] .content .trans::before {
  pointer-events: auto;
    content: '';
    position: absolute;
    top: 50%;
    right: 0;
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-left: 40px solid rgba(0, 0, 0, 0.8);
    transform: translateY(-50%);
} */
[xui_tags] .content .trans .arrow {
  pointer-events: auto;
  content: '';
  position: absolute;
  top: 50%;
  right: 0;
  width: 0;
  height: 0;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
  border-left: 40px solid rgba(27, 27, 28, 0.8);
  transform: translateY(-50%);
}

[is-mobile] [xui_tags_view] .content .trans .arrow {
  pointer-events: auto;
  content: '';
  position: absolute;
  left: 50%;
  top: 100%;
  width: 0;
  height: 0;
  border-left: 0.2rem solid transparent;
  border-right: 0.2rem solid transparent;
  border-top: 0.5333rem solid rgba(27, 27, 28, 0.8);
  /* border-bottom: 0.2rem solid transparent;
border-left: 0.2rem solid transparent;
border-top: 0.5333rem solid rgba(0, 0, 0, 0.8); */
  transform: translateX(-50%);
}

[xui_tags_view] .content .trans .arrow {
  pointer-events: auto;
  content: '';
  position: absolute;
  top: 50%;
  right: 0;
  width: 0;
  height: 0;
  border-top: 15px solid rgb(0 0 0 / 0%);
  border-bottom: 15px solid rgb(0 0 0 / 0%);
  border-left: 40px solid rgb(27 27 28 / 80%);
  transform: translateY(-50%);
}

.show-tag[data-v-7245d1d7] {
  pointer-events: auto;
  background: rgb(27 27 28 / 80%);
  border-radius: 4px;
  min-width: 400px;
  padding: 30px 20px;
}

.show-tag .tag-title[data-v-7245d1d7] {
  word-break: break-all;
}

.show-tag .tag-title h2[data-v-7245d1d7] {
  font-size: 20px;
  line-height: 30px;
  color: rgb(255 255 255);
  position: relative;
}

.show-tag .desc[data-v-7245d1d7] {
  margin-top: 10px;
}

.show-tag .desc .text[data-v-7245d1d7] {
  font-size: 14px;
  color: rgb(153 153 153);
  line-height: 20px;
  text-align: justify;
  word-break: break-all;
}

.show-tag .tag-metas.nocursor[data-v-7245d1d7] {
  cursor: auto;
}

.show-tag .tag-metas[data-v-7245d1d7] {
  width: 100%;
  height: 225px;
  background: rgb(255 255 255 / 10%);
  border-radius: 4px;
  overflow: hidden;
  position: relative;
  cursor: -webkit-zoom-in;
  margin-top: 20px;
}

.video-box[data-v-38df8efc] {
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 4px;
  border: 1px solid rgb(255 255 255 / 20%);
  top: 0;
  left: 0;
}

.del-btn[data-v-38df8efc], .video-box[data-v-38df8efc] {
  position: absolute;
  z-index: 10;
}

.video-box .loading-icon[data-v-38df8efc] {
  color: var(--editor-main-color);
  -webkit-animation: rotate-38df8efc 2s linear infinite;
  animation: rotate-38df8efc 2s linear infinite;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 30px;
}

.video-box .video-item[data-v-38df8efc] {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}

@keyframes tag-animate-zoom {
  0% {
    transform: scale(1);
  }

  50% {
    transform: scale(0.7);
  }

  100% {
    transform: scale(1);
  }
}

[is-mobile] [xui_min_map].collapse .button-switch > .iconfont {
  font-size: 12px;
  transform: rotate(180deg) scale(.7);
}

@media only screen and (max-width: 768px) {
  [is-mobile] [xui_tags_view] .content .trans.active {
    transform: translateX(50%) scale(1);
  }

  [is-mobile] [xui_tags_view] .content .trans {
    /* display: none !important; */
    padding: 0 0 0 0;
    right: 50%;
    bottom: 170%;
    top: auto;
    min-width: 1.3333rem;
    min-height: 0.8rem;
    z-index: 1000;
    transform: translateX(50%) scale(0);
    transform-origin: center bottom;
  }

  [is-mobile] [xui_tags_view] .content .trans .arrow {
    pointer-events: auto;
    content: '';
    position: absolute;
    left: 50%;
    top: 100%;
    width: 0;
    height: 0;
    border-left: 0.2rem solid rgb(0 0 0 / 0%);
    border-right: 0.2rem solid rgb(0 0 0 / 0%);
    border-top: 0.5333rem solid rgb(27 27 28 / 80%);
    transform: translateX(-50%);
  }

  [is-mobile] .show-tag[data-v-7245d1d7] {
    pointer-events: auto;
    background: rgb(27 27 28 / 80%);
    border-radius: 0.0533rem;
    min-width: 7.4667rem;
    padding: 0.4rem 0.2667rem;
  }

  .show-tag .tag-title[data-v-7245d1d7] {
    word-break: break-all;
  }

  [is-mobile] .show-tag .tag-title h2[data-v-7245d1d7] {
    font-size: .5333rem;
    line-height: .8rem;
    color: rgb(255 255 255);
    position: relative;
  }

  [is-mobile] .show-tag .desc[data-v-7245d1d7] {
    margin-bottom: 0.2933rem;
  }

  .show-tag .desc[data-v-7245d1d7] {
    margin-top: 10px;
  }

  [is-mobile] .show-tag .desc .text[data-v-7245d1d7] {
    font-size: .3733rem;
    color: rgb(153 153 153);
    line-height: .2533rem;
    text-align: justify;
    line-height: .5333rem;
  }

  [is-mobile] .show-tag .tag-metas[data-v-7245d1d7] {
    width: 100%;
    height: 4.2667rem;
    background: rgb(255 255 255 / 10%);
    border-radius: 0.0533rem;
    overflow: hidden;
    position: relative;
    cursor: -webkit-zoom-in;
    margin-top: 0.4rem;
  }
}

.video-box .video-item {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}

[is-ios] [xui_tags_view] > div {
  margin-left: -24px;
  margin-top: -48px;
}

svg {
  fill: #ffffff;
  cursor: pointer;
}

svg:hover {
  fill: #00c8af;
}

.sketchfab-embed-wrapper {
  height: 250px;
}

.sketchfab-embed-wrapper iframe {
  height: 250px;
  width: 100%;
}

.text p:nth-child(0) {
  color: #FFF;
}

.text p:nth-child(1) {
  color: #FFF;
}

.text p:nth-child(2) {
  color: #FFF;
}

.tag-layer {
  width: 100vw;
  height: 100vh;
  z-index: 10000;
  top: 0;
  position: fixed;
  left: 0;
  background-color: rgba(0, 0, 0, .7)
}

.tag-layer .tag-info {
  color: #fff;
  width: 100%;
  height: 85%;
  position: absolute;
  top: 7.5%;
  left: 0
}

.tag-layer .tag-info .close-btn {
  position: fixed;
  right: 36px;
  top: 36px;
  font-size: 18px;
  cursor: pointer;
  z-index: 100
}

.tag-layer .tag-info .tag-metas {
  width: 100%;
  height: 100%;
  position: relative
}

.tag-layer .tag-info .tag-metas .pic-box {
  width: 100%;
  height: 100%;
  border: none
}

.tag-layer .tag-info .tag-metas .pic-box .image-list .image-item {
  background-size: contain
}

.tag-layer .tag-info .tag-metas .video-box {
  height: auto;
  border: none
}

.tag-layer .tag-info .tag-metas .video-box video {
  width: 100%;
  height: auto;
  -o-object-fit: contain;
  object-fit: contain
}

.tag-layer .tag-info .tag-metas .web-box {
  width: 91%;
  height: 100%;
  border: none;
  left: 50%;
  transform: translateX(-50%)
}

[is-mobile] .tag-layer .tag-info .close-btn {
  position: absolute;
  right: 20px;
  top: -30px;
  font-size: 18px;
  cursor: pointer
}

[is-mobile] .tag-layer.full {
  background-color: #141414
}

[is-mobile] .tag-layer.full .tag-info {
  height: 100%;
  top: 0
}

[is-mobile] .tag-layer.full .tag-info .close-btn {
  position: absolute;
  right: 20px;
  top: 20px;
  font-size: 18px;
  cursor: pointer
}

.showPicBox[data-v-0100b98a] {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 10000;
  background: #181616;
  top: 0;
  left: 0
}

.showPicBox .close[data-v-0100b98a] {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 20px;
  height: 20px;
  z-index: 100;
  color: #fff
}

.showPicBox .close .iconfont[data-v-0100b98a] {
  font-size: 20px
}

.showPicBox .loading[data-v-0100b98a] {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)
}

.showPicBox .imgbox[data-v-0100b98a] {
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 50%
}

.showPicBox .imgbox #eleImg[data-v-0100b98a] {
  margin: 0 auto;
  display: block
}

.showPicBox .imgbox #eleImg.s[data-v-0100b98a] {
  height: 100%;
  width: auto
}

.showPicBox .imgbox #eleImg.h[data-v-0100b98a] {
  height: auto;
  width: 100%
}

.del-btn[data-v-0100b98a] {
  width: 24px;
  height: 24px;
  background: rgba(0, 0, 0, .3);
  border-radius: 50%;
  position: absolute;
  cursor: pointer;
  top: 10px;
  right: 10px;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center
}

.loading-icon[data-v-0100b98a] {
  color: var(--editor-main-color);
  -webkit-animation: rotate-0100b98a 2s linear infinite;
  animation: rotate-0100b98a 2s linear infinite;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 30px
}

.pic-box[data-v-0100b98a] {
  width: 100%;
  height: 100%;
  position: absolute;
  border-radius: 4px;
  border: 1px solid hsla(0, 0%, 100%, .2);
  top: 0;
  left: 0;
  z-index: 10
}

@-webkit-keyframes rotate-0100b98a {
  0% {
    transform: translate(-50%, -50%) rotate(0deg)
  }
  to {
    transform: translate(-50%, -50%) rotate(1turn)
  }
}

@keyframes rotate-0100b98a {
  0% {
    transform: translate(-50%, -50%) rotate(0deg)
  }
  to {
    transform: translate(-50%, -50%) rotate(1turn)
  }
}

.pic-box .over-box[data-v-0100b98a] {
  width: 100%;
  height: 100%;
  overflow: hidden
}

.pic-box .continue[data-v-0100b98a] {
  width: 100%;
  height: 32px;
  background: linear-gradient(180deg, rgba(0, 0, 0, .1), #000 200%);
  border-radius: 0 0 4px 4px;
  position: absolute;
  bottom: 0;
  left: 0
}

.pic-box .continue .ui-input[data-v-0100b98a] {
  width: 100%
}

.pic-box .continue .continue-tips[data-v-0100b98a] {
  font-size: 12px
}

.pic-box .continue .pic-num[data-v-0100b98a] {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px
}

.pic-box .continue .pic-num .cur[data-v-0100b98a] {
  color: var(--editor-main-color)
}

.pic-box .ctrl-btn[data-v-0100b98a] {
  width: 32px;
  height: 32px;
  background: rgba(0, 0, 0, .2);
  border-radius: 50%;
  position: absolute;
  cursor: pointer;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center
}

.pic-box .ctrl-btn .iconfont[data-v-0100b98a] {
  font-size: 14px
}

.pic-box .ctrl-btn.left-btn[data-v-0100b98a] {
  left: 5px
}

.pic-box .ctrl-btn.right-btn[data-v-0100b98a] {
  right: 5px
}

.pic-box .image-list[data-v-0100b98a] {
  width: 100%;
  height: 100%;
  position: relative;
  transition: all .3s linear
}

.pic-box .image-list .image-item[data-v-0100b98a] {
  width: 100%;
  height: 100%;
  position: absolute;
  transform: translateX(0);
  text-align: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 50%
}

.pic-box .image-list .image-item img[data-v-0100b98a] {
  height: 100%;
  width: auto
}

.pic-box.show .ctrl-btn[data-v-0100b98a] {
  width: 40px;
  height: 80px;
  background: rgba(0, 0, 0, .6)
}

.pic-box.show .ctrl-btn .iconfont[data-v-0100b98a] {
  font-size: 20px
}

.pic-box.show .ctrl-btn.left-btn[data-v-0100b98a] {
  left: 0;
  border-radius: 0 40px 40px 0
}

.pic-box.show .ctrl-btn.left-btn .icon[data-v-0100b98a] {
  margin-right: 5px
}

.pic-box.show .ctrl-btn.right-btn[data-v-0100b98a] {
  right: 0;
  border-radius: 40px 0 0 40px
}

.pic-box.show .ctrl-btn.right-btn .icon[data-v-0100b98a] {
  margin-left: 8px
}

.pic-box.show .continue[data-v-0100b98a] {
  width: 76px;
  height: 36px;
  background: rgba(0, 0, 0, .6);
  border-radius: 20px;
  position: absolute;
  bottom: -5%;
  left: 50%;
  transform: translateX(-50%)
}

.pic-box.show .continue .pic-num[data-v-0100b98a] {
  width: 76px;
  height: 36px;
  display: inline-block;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)
}

.pic-box.show .continue .pic-num span[data-v-0100b98a] {
  display: flex;
  align-items: center;
  justify-content: center
}

[is-mobile] .pic-box.show .ctrl-btn[data-v-0100b98a] {
  width: 40px;
  height: 80px;
  background: rgba(0, 0, 0, .6)
}

[is-mobile] .pic-box.show .ctrl-btn .iconfont[data-v-0100b98a] {
  font-size: 20px
}

[is-mobile] .pic-box.show .ctrl-btn.left-btn[data-v-0100b98a] {
  left: 0;
  border-radius: 0 40px 40px 0
}

[is-mobile] .pic-box.show .ctrl-btn.left-btn .icon[data-v-0100b98a] {
  margin-right: 5px
}

[is-mobile] .pic-box.show .ctrl-btn.right-btn[data-v-0100b98a] {
  right: 0;
  border-radius: 40px 0 0 40px
}

[is-mobile] .pic-box.show .ctrl-btn.right-btn .icon[data-v-0100b98a] {
  margin-left: 8px
}

[is-mobile] .pic-box.show .continue[data-v-0100b98a] {
  width: 76px;
  height: 36px;
  background: rgba(0, 0, 0, .6);
  border-radius: 20px;
  position: absolute;
  bottom: -6%;
  left: 50%;
  transform: translateX(-50%)
}

[is-mobile] .pic-box.show .continue .pic-num[data-v-0100b98a] {
  width: 76px;
  height: 36px;
  display: inline-block;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)
}

[is-mobile] .pic-box.show .continue .pic-num span[data-v-0100b98a] {
  display: flex;
  align-items: center;
  justify-content: center
}

.image-view[data-v-8182d9f6], .image-view .swiper[data-v-8182d9f6] {
  width: 100%;
  height: 100%
}

.image-view .swiper .swiper-slide[data-v-8182d9f6] {
  transform: translateZ(0);
  overflow: hidden
}

.image-view .swiper .swiper-zoom-container[data-v-8182d9f6] {
  width: 100%;
  height: 100%;
  transform: translateZ(0)
}

.image-view .swiper .swiper-zoom-container .swiper-zoom-target[data-v-8182d9f6] {
  width: 100%;
  height: 100%;
  background-position: 50%;
  background-size: contain;
  margin: 0 auto;
  transform: translateZ(0)
}

.image-view .swiper-pagination-bullet-active {
  background: var(--editor-main-color);
}