@charset "UTF-8";
:root {
  --el-color-white: #ffffff;
  --el-color-black: #000000;
  --el-color-primary-rgb: 64, 158, 255;
  --el-color-success-rgb: 103, 194, 58;
  --el-color-warning-rgb: 230, 162, 60;
  --el-color-danger-rgb: 245, 108, 108;
  --el-color-error-rgb: 245, 108, 108;
  --el-color-info-rgb: 144, 147, 153;
  --el-font-size-extra-large: 20px;
  --el-font-size-large: 18px;
  --el-font-size-medium: 16px;
  --el-font-size-base: 14px;
  --el-font-size-small: 13px;
  --el-font-size-extra-small: 12px;
  --el-font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
  --el-font-weight-primary: 500;
  --el-font-line-height-primary: 24px;
  --el-index-normal: 1;
  --el-index-top: 1000;
  --el-index-popper: 2000;
  --el-border-radius-base: 4px;
  --el-border-radius-small: 2px;
  --el-border-radius-round: 20px;
  --el-border-radius-circle: 100%;
  --el-transition-duration: 0.3s;
  --el-transition-duration-fast: 0.2s;
  --el-transition-function-ease-in-out-bezier: cubic-bezier(0.645, 0.045, 0.355, 1);
  --el-transition-function-fast-bezier: cubic-bezier(0.23, 1, 0.32, 1);
  --el-transition-all: all var(--el-transition-duration) var(--el-transition-function-ease-in-out-bezier);
  --el-transition-fade: opacity var(--el-transition-duration) var(--el-transition-function-fast-bezier);
  --el-transition-md-fade: transform var(--el-transition-duration) var(--el-transition-function-fast-bezier), opacity var(--el-transition-duration) var(--el-transition-function-fast-bezier);
  --el-transition-fade-linear: opacity var(--el-transition-duration-fast) linear;
  --el-transition-border: border-color var(--el-transition-duration-fast) var(--el-transition-function-ease-in-out-bezier);
  --el-transition-box-shadow: box-shadow var(--el-transition-duration-fast) var(--el-transition-function-ease-in-out-bezier);
  --el-transition-color: color var(--el-transition-duration-fast) var(--el-transition-function-ease-in-out-bezier);
  --el-component-size-large: 40px;
  --el-component-size: 32px;
  --el-component-size-small: 24px;
}
:root {
  color-scheme: light;
  --el-color-white: #ffffff;
  --el-color-black: #000000;
  --el-color-primary: #409eff;
  --el-color-primary-light-3: #79bbff;
  --el-color-primary-light-5: #a0cfff;
  --el-color-primary-light-7: #c6e2ff;
  --el-color-primary-light-8: #d9ecff;
  --el-color-primary-light-9: #ecf5ff;
  --el-color-primary-dark-2: #337ecc;
  --el-color-success: #67c23a;
  --el-color-success-light-3: #95d475;
  --el-color-success-light-5: #b3e19d;
  --el-color-success-light-7: #d1edc4;
  --el-color-success-light-8: #e1f3d8;
  --el-color-success-light-9: #f0f9eb;
  --el-color-success-dark-2: #529b2e;
  --el-color-warning: #e6a23c;
  --el-color-warning-light-3: #eebe77;
  --el-color-warning-light-5: #f3d19e;
  --el-color-warning-light-7: #f8e3c5;
  --el-color-warning-light-8: #faecd8;
  --el-color-warning-light-9: #fdf6ec;
  --el-color-warning-dark-2: #b88230;
  --el-color-danger: #f56c6c;
  --el-color-danger-light-3: #f89898;
  --el-color-danger-light-5: #fab6b6;
  --el-color-danger-light-7: #fcd3d3;
  --el-color-danger-light-8: #fde2e2;
  --el-color-danger-light-9: #fef0f0;
  --el-color-danger-dark-2: #c45656;
  --el-color-error: #f56c6c;
  --el-color-error-light-3: #f89898;
  --el-color-error-light-5: #fab6b6;
  --el-color-error-light-7: #fcd3d3;
  --el-color-error-light-8: #fde2e2;
  --el-color-error-light-9: #fef0f0;
  --el-color-error-dark-2: #c45656;
  --el-color-info: #909399;
  --el-color-info-light-3: #b1b3b8;
  --el-color-info-light-5: #c8c9cc;
  --el-color-info-light-7: #dedfe0;
  --el-color-info-light-8: #e9e9eb;
  --el-color-info-light-9: #f4f4f5;
  --el-color-info-dark-2: #73767a;
  --el-bg-color: #ffffff;
  --el-bg-color-page: #f2f3f5;
  --el-bg-color-overlay: #ffffff;
  --el-text-color-primary: #303133;
  --el-text-color-regular: #606266;
  --el-text-color-secondary: #909399;
  --el-text-color-placeholder: #a8abb2;
  --el-text-color-disabled: #c0c4cc;
  --el-border-color: #dcdfe6;
  --el-border-color-light: #e4e7ed;
  --el-border-color-lighter: #ebeef5;
  --el-border-color-extra-light: #f2f6fc;
  --el-border-color-dark: #d4d7de;
  --el-border-color-darker: #cdd0d6;
  --el-fill-color: #f0f2f5;
  --el-fill-color-light: #f5f7fa;
  --el-fill-color-lighter: #fafafa;
  --el-fill-color-extra-light: #fafcff;
  --el-fill-color-dark: #ebedf0;
  --el-fill-color-darker: #e6e8eb;
  --el-fill-color-blank: #ffffff;
  --el-box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, 0.04), 0px 8px 20px rgba(0, 0, 0, 0.08);
  --el-box-shadow-light: 0px 0px 12px rgba(0, 0, 0, 0.12);
  --el-box-shadow-lighter: 0px 0px 6px rgba(0, 0, 0, 0.12);
  --el-box-shadow-dark: 0px 16px 48px 16px rgba(0, 0, 0, 0.08), 0px 12px 32px rgba(0, 0, 0, 0.12), 0px 8px 16px -8px rgba(0, 0, 0, 0.16);
  --el-disabled-bg-color: var(--el-fill-color-light);
  --el-disabled-text-color: var(--el-text-color-placeholder);
  --el-disabled-border-color: var(--el-border-color-light);
  --el-overlay-color: rgba(0, 0, 0, 0.8);
  --el-overlay-color-light: rgba(0, 0, 0, 0.7);
  --el-overlay-color-lighter: rgba(0, 0, 0, 0.5);
  --el-mask-color: rgba(255, 255, 255, 0.9);
  --el-mask-color-extra-light: rgba(255, 255, 255, 0.3);
  --el-border-width: 1px;
  --el-border-style: solid;
  --el-border-color-hover: var(--el-text-color-disabled);
  --el-border: var(--el-border-width) var(--el-border-style) var(--el-border-color);
  --el-svg-monochrome-grey: var(--el-border-color);
}
.fade-in-linear-enter-active,
.fade-in-linear-leave-active {
  transition: var(--el-transition-fade-linear);
}
.fade-in-linear-enter-from,
.fade-in-linear-leave-to {
  opacity: 0;
}
.el-fade-in-linear-enter-active,
.el-fade-in-linear-leave-active {
  transition: var(--el-transition-fade-linear);
}
.el-fade-in-linear-enter-from,
.el-fade-in-linear-leave-to {
  opacity: 0;
}
.el-fade-in-enter-active,
.el-fade-in-leave-active {
  transition: all var(--el-transition-duration) cubic-bezier(0.55, 0, 0.1, 1);
}
.el-fade-in-enter-from,
.el-fade-in-leave-active {
  opacity: 0;
}
.el-zoom-in-center-enter-active,
.el-zoom-in-center-leave-active {
  transition: all var(--el-transition-duration) cubic-bezier(0.55, 0, 0.1, 1);
}
.el-zoom-in-center-enter-from,
.el-zoom-in-center-leave-active {
  opacity: 0;
  transform: scaleX(0);
}
.el-zoom-in-top-enter-active,
.el-zoom-in-top-leave-active {
  opacity: 1;
  transform: scaleY(1);
  transition: var(--el-transition-md-fade);
  transform-origin: center top;
}
.el-zoom-in-top-enter-active[data-popper-placement^=top],
.el-zoom-in-top-leave-active[data-popper-placement^=top] {
  transform-origin: center bottom;
}
.el-zoom-in-top-enter-from,
.el-zoom-in-top-leave-active {
  opacity: 0;
  transform: scaleY(0);
}
.el-zoom-in-bottom-enter-active,
.el-zoom-in-bottom-leave-active {
  opacity: 1;
  transform: scaleY(1);
  transition: var(--el-transition-md-fade);
  transform-origin: center bottom;
}
.el-zoom-in-bottom-enter-from,
.el-zoom-in-bottom-leave-active {
  opacity: 0;
  transform: scaleY(0);
}
.el-zoom-in-left-enter-active,
.el-zoom-in-left-leave-active {
  opacity: 1;
  transform: scale(1);
  transition: var(--el-transition-md-fade);
  transform-origin: top left;
}
.el-zoom-in-left-enter-from,
.el-zoom-in-left-leave-active {
  opacity: 0;
  transform: scale(0.45);
}
.collapse-transition {
  transition: var(--el-transition-duration) height ease-in-out, var(--el-transition-duration) padding-top ease-in-out, var(--el-transition-duration) padding-bottom ease-in-out;
}
.el-collapse-transition-enter-active,
.el-collapse-transition-leave-active {
  transition: var(--el-transition-duration) max-height ease-in-out, var(--el-transition-duration) padding-top ease-in-out, var(--el-transition-duration) padding-bottom ease-in-out;
}
.horizontal-collapse-transition {
  transition: var(--el-transition-duration) width ease-in-out, var(--el-transition-duration) padding-left ease-in-out, var(--el-transition-duration) padding-right ease-in-out;
}
.el-list-enter-active,
.el-list-leave-active {
  transition: all 1s;
}
.el-list-enter-from,
.el-list-leave-to {
  opacity: 0;
  transform: translateY(-30px);
}
.el-list-leave-active {
  position: absolute !important;
}
.el-opacity-transition {
  transition: opacity var(--el-transition-duration) cubic-bezier(0.55, 0, 0.1, 1);
}
.el-icon-loading {
  -webkit-animation: rotating 2s linear infinite;
  animation: rotating 2s linear infinite;
}
.el-icon--right {
  margin-left: 5px;
}
.el-icon--left {
  margin-right: 5px;
}
@-webkit-keyframes rotating {
  0% {
    transform: rotate(0);
  }
  to {
    transform: rotate(360deg);
  }
}
@keyframes rotating {
  0% {
    transform: rotate(0);
  }
  to {
    transform: rotate(360deg);
  }
}
.el-icon {
  --color: inherit;
  height: 1em;
  width: 1em;
  line-height: 1em;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: relative;
  fill: currentColor;
  color: var(--color);
  font-size: inherit;
}
.el-icon.is-loading {
  -webkit-animation: rotating 2s linear infinite;
  animation: rotating 2s linear infinite;
}
.el-icon svg {
  height: 1em;
  width: 1em;
}
.el-badge {
  --el-badge-bg-color: var(--el-color-danger);
  --el-badge-radius: 10px;
  --el-badge-font-size: 12px;
  --el-badge-padding: 6px;
  --el-badge-size: 18px;
  position: relative;
  vertical-align: middle;
  display: inline-block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.el-badge__content {
  background-color: var(--el-badge-bg-color);
  border-radius: var(--el-badge-radius);
  color: var(--el-color-white);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  font-size: var(--el-badge-font-size);
  height: var(--el-badge-size);
  padding: 0 var(--el-badge-padding);
  white-space: nowrap;
  border: 1px solid var(--el-bg-color);
}
.el-badge__content.is-fixed {
  position: absolute;
  top: 0;
  right: calc(1px + var(--el-badge-size)/2);
  transform: translateY(-50%) translate(100%);
  z-index: var(--el-index-normal);
}
.el-badge__content.is-fixed.is-dot {
  right: 5px;
}
.el-badge__content.is-dot {
  height: 8px;
  width: 8px;
  padding: 0;
  right: 0;
  border-radius: 50%;
}
.el-badge__content--primary {
  background-color: var(--el-color-primary);
}
.el-badge__content--success {
  background-color: var(--el-color-success);
}
.el-badge__content--warning {
  background-color: var(--el-color-warning);
}
.el-badge__content--info {
  background-color: var(--el-color-info);
}
.el-badge__content--danger {
  background-color: var(--el-color-danger);
}
.el-message {
  --el-message-bg-color: var(--el-color-info-light-9);
  --el-message-border-color: var(--el-border-color-lighter);
  --el-message-padding: 15px 19px;
  --el-message-close-size: 16px;
  --el-message-close-icon-color: var(--el-text-color-placeholder);
  --el-message-close-hover-color: var(--el-text-color-secondary);
}
.el-message {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: calc(100% - 32px);
  box-sizing: border-box;
  border-radius: var(--el-border-radius-base);
  border-width: var(--el-border-width);
  border-style: var(--el-border-style);
  border-color: var(--el-message-border-color);
  position: fixed;
  left: 50%;
  top: 20px;
  transform: translate(-50%);
  background-color: var(--el-message-bg-color);
  transition: opacity var(--el-transition-duration), transform 0.4s, top 0.4s;
  padding: var(--el-message-padding);
  display: flex;
  align-items: center;
}
.el-message.is-center {
  justify-content: center;
}
.el-message.is-closable .el-message__content {
  padding-right: 31px;
}
.el-message p {
  margin: 0;
}
.el-message--success {
  --el-message-bg-color: var(--el-color-success-light-9);
  --el-message-border-color: var(--el-color-success-light-8);
  --el-message-text-color: var(--el-color-success);
}
.el-message--success .el-message__content {
  color: var(--el-message-text-color);
  overflow-wrap: anywhere;
}
.el-message .el-message-icon--success {
  color: var(--el-message-text-color);
}
.el-message--info {
  --el-message-bg-color: var(--el-color-info-light-9);
  --el-message-border-color: var(--el-color-info-light-8);
  --el-message-text-color: var(--el-color-info);
}
.el-message--info .el-message__content {
  color: var(--el-message-text-color);
  overflow-wrap: anywhere;
}
.el-message .el-message-icon--info {
  color: var(--el-message-text-color);
}
.el-message--warning {
  --el-message-bg-color: var(--el-color-warning-light-9);
  --el-message-border-color: var(--el-color-warning-light-8);
  --el-message-text-color: var(--el-color-warning);
}
.el-message--warning .el-message__content {
  color: var(--el-message-text-color);
  overflow-wrap: anywhere;
}
.el-message .el-message-icon--warning {
  color: var(--el-message-text-color);
}
.el-message--error {
  --el-message-bg-color: var(--el-color-error-light-9);
  --el-message-border-color: var(--el-color-error-light-8);
  --el-message-text-color: var(--el-color-error);
}
.el-message--error .el-message__content {
  color: var(--el-message-text-color);
  overflow-wrap: anywhere;
}
.el-message .el-message-icon--error {
  color: var(--el-message-text-color);
}
.el-message__icon {
  margin-right: 10px;
}
.el-message .el-message__badge {
  position: absolute;
  top: -8px;
  right: -8px;
}
.el-message__content {
  padding: 0;
  font-size: 14px;
  line-height: 1;
}
.el-message__content:focus {
  outline-width: 0;
}
.el-message .el-message__closeBtn {
  position: absolute;
  top: 50%;
  right: 19px;
  transform: translateY(-50%);
  cursor: pointer;
  color: var(--el-message-close-icon-color);
  font-size: var(--el-message-close-size);
}
.el-message .el-message__closeBtn:focus {
  outline-width: 0;
}
.el-message .el-message__closeBtn:hover {
  color: var(--el-message-close-hover-color);
}
.el-message-fade-enter-from,
.el-message-fade-leave-to {
  opacity: 0;
  transform: translate(-50%, -100%);
}
.leftArea[data-v-af9de541] {
  height: 100%;
  position: relative;
  width: 60px;
  background: unset !important;
}
.iconArea[data-v-af9de541] {
  width: 50px;
  height: 50px;
  flex: none;
  border-radius: 50%;
}
.barButton[data-v-af9de541] {
  position: relative;
  overflow: hidden;
  width: auto;
  height: 50px;
  box-sizing: border-box;
  margin-bottom: 15px;
  cursor: pointer;
  text-decoration: none;
  background: #2b2b2b;
  color: #fff;
  display: flex;
}
.btIcon1[data-v-af9de541] {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 15px;
  display: inline-block;
  width: 40px;
  height: 40px;
  margin: auto 0;
  background-size: 100% 100%;
}
.btText1[data-v-af9de541] {
  top: 0;
  right: 0;
  bottom: 0;
  flex: auto;
  height: 2em;
  margin-inline-start: 30px;
  line-height: 2em;
  align-self: center;
}
.iconButton[data-v-af9de541] {
  position: relative;
  display: inline-block;
  overflow: hidden;
  width: 50px;
  height: 50px;
  margin: 0 10px;
  cursor: pointer;
  flex: none;
}
.btIcon2[data-v-af9de541] {
  position: absolute;
  display: block;
  width: 40px;
  height: 40px;
  background-size: 100% 100%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.fbLink[data-v-af9de541] {
  background: #3c5a9a;
  color: #fff;
}
.googleLink[data-v-af9de541],
.iconButton.googleLink[data-v-af9de541] {
  background: #eaeaea;
  color: #000;
}
.lineLink[data-v-af9de541] {
  background: #fff;
  color: #fff;
}
.yahooLink[data-v-af9de541] {
  background: #8b579f;
  color: #fff;
}
.twitterLink[data-v-af9de541] {
  background: #000;
  color: #fff;
}
.vkLink[data-v-af9de541] {
  background: #eaeaea;
  color: #fff;
}
.anonymousLink[data-v-af9de541] {
  background: #ff8a00;
  color: #fff;
}
.yandexLink[data-v-af9de541] {
  background: #fc3f1d;
  color: #fff;
}
.gpgLink[data-v-af9de541] {
  background: #eaeaea;
  color: #000;
}
.appleLink[data-v-af9de541] {
  background: #000;
  color: #fff;
}
.actionButton[data-v-57a79995] {
  height: 50px;
  background-color: #d0343a;
  width: 100%;
  font-size: 20px;
  line-height: 50px;
  color: #fff;
  text-align: center;
  cursor: pointer;
}
.fppHead[data-v-1e9bb066] {
  font-size: 32px;
  color: #fff;
  text-align: center;
  margin-bottom: 15px;
}
.subtitle[data-v-1e9bb066] {
  font-size: 14px;
  color: #818181;
  text-align: center;
  margin-bottom: 20px;
}
.fpsMain[data-v-1e9bb066] {
  width: 100%;
}
.fpsInput[data-v-1e9bb066] {
  display: block;
  width: 100%;
  height: 50px;
  box-sizing: border-box;
  padding: 05px 10px;
  margin-top: 10px;
  font-size: 14px;
  line-height: 50px;
}
.fpsMain[data-v-13d4843d] {
  color: #c4c4c4;
}
.fppHead[data-v-13d4843d] {
  font-size: 32px;
  color: #fff;
  text-align: center;
  margin-bottom: 15px;
}
.subtitle[data-v-13d4843d] {
  font-size: 14px;
  color: #818181;
  text-align: center;
  margin-bottom: 20px;
}
.fpsMain[data-v-13d4843d] {
  width: 100%;
}
.fpeInput[data-v-13d4843d] {
  display: block;
  width: 100%;
  height: 50px;
  box-sizing: border-box;
  padding: 05px 10px;
  margin-top: 10px;
  font-size: 14px;
  line-height: 50px;
}
.fpsMain[data-v-13d4843d],
.codeBox[data-v-13d4843d] {
  width: 100%;
}
.sendCode[data-v-13d4843d] {
  position: absolute;
  right: 5px;
  height: 40px;
  padding: 0 20px;
  top: 50%;
  min-width: 70px;
  transform: translateY(-50%);
  background: #c4c4c4;
  color: #383737;
  cursor: pointer;
  line-height: 40px;
  text-align: center;
}
.sendCode.disable[data-v-13d4843d] {
  color: #d2d2d2;
  cursor: not-allowed;
}
.fppBottom[data-v-13d4843d] {
  margin: 0 auto;
}
.fppHead[data-v-7fd43579] {
  font-size: 32px;
  color: #fff;
  text-align: center;
  margin-bottom: 15px;
}
.subtitle[data-v-7fd43579] {
  font-size: 14px;
  color: #818181;
  text-align: center;
  margin-bottom: 20px;
}
.fpsMain[data-v-7fd43579] {
  width: 100%;
}
.fpsInput[data-v-7fd43579] {
  display: block;
  width: 100%;
  height: 50px;
  box-sizing: border-box;
  padding: 05px 10px;
  margin-top: 10px;
  font-size: 14px;
  line-height: 50px;
}
.fppHead[data-v-024b9c39] {
  font-size: 32px;
  color: #fff;
  text-align: center;
}
.subtitle[data-v-024b9c39] {
  font-size: 14px;
  color: #818181;
  text-align: center;
  margin-bottom: 20px;
}
.fpsMain[data-v-024b9c39] {
  width: 100%;
}
.fpsInput[data-v-024b9c39] {
  display: block;
  width: 100%;
  height: 50px;
  box-sizing: border-box;
  padding: 05px 10px;
  margin-top: 10px;
  font-size: 14px;
  line-height: 50px;
}
.subcontent[data-v-0e5ce3ac] {
  width: 90%;
  box-sizing: border-box;
  margin: 0 auto;
  text-align: center;
}
.subcontent .title[data-v-0e5ce3ac] {
  font-size: 30px;
  line-height: 30px;
  color: #fff;
  margin: 40px 0;
}
.subcontent img[data-v-0e5ce3ac] {
  height: 40px;
  margin-top: -5px;
  vertical-align: middle;
}
.fppHead[data-v-570fa055] {
  font-size: 32px;
  color: #fff;
  text-align: center;
  margin-bottom: 15px;
}
.subtitle[data-v-570fa055] {
  font-size: 14px;
  color: #818181;
  text-align: center;
  margin-bottom: 20px;
}
.subcontent[data-v-570fa055] {
  color: #818181;
  border: solid #3f3f3f;
  border-width: 1px 0;
  margin-bottom: 20px;
}
.subcontent .optionRow[data-v-570fa055] {
  margin: 20px 0;
  display: flex;
  align-items: center;
}
.subcontent .text2[data-v-570fa055] {
  color: #c4c4c4;
  font-weight: 700;
}
.subcontent .btn[data-v-570fa055] {
  color: #d0343a;
}
.subcontent .pad[data-v-570fa055] {
  min-width: 10px;
  flex: auto;
}
.remember[data-v-736e0c83] {
  display: flex;
  align-items: center;
  margin-top: 10px;
  font-size: 14px;
  margin-bottom: 5px;
}
.remember .checkbox[data-v-736e0c83] {
  cursor: pointer;
  width: 16px;
  height: 16px;
  background-color: #3f3f3f;
  border: solid 1px #525252;
}
.remember .checkbox.check[data-v-736e0c83] {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAKCAYAAABv7tTEAAAAZElEQVR4XmNgIAH8//9fAojZ0MVxAqBiGSC+A8QN6HJYAZKGfUDMBRNkRlMHB7g0sAHxeSCORlOPXQOSZCYQ/0HWiFcDDCBrJEoDDCBpfEqUBhgAKswA4t1Ea4ABoAZGdDFkAABe2JbGN8bvXwAAAABJRU5ErkJggg==) center / contain no-repeat, #3f3f3f;
}
.remember .rememberUser[data-v-736e0c83] {
  cursor: pointer;
  color: #dedede;
  margin-inline-start: 5px;
}
.findPassword[data-v-736e0c83] {
  cursor: pointer;
  color: #d0343a;
  font-size: 14px;
  text-align: end;
}
.indexWrapper[data-v-7c49ef9b] {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #00000080;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
}
.container[data-v-7c49ef9b] {
  width: 414px;
  background-color: #1e1e1e;
  box-sizing: border-box;
  padding: 19px 37px 31px;
  max-width: 90%;
  position: relative;
}
.logo[data-v-7c49ef9b] {
  height: 87px;
  width: calc(100% - 30px);
  object-fit: contain;
  margin: 0 auto 10px;
  display: block;
}
.moreInfoLine[data-v-7c49ef9b] {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 0 20px;
  color: #717171;
  font-size: 14px;
  text-align: center;
}
.moreInfoLine .line[data-v-7c49ef9b] {
  display: inline-block;
  width: 125px;
  flex: auto;
  border-top: 1px solid #717171;
}
.moreInfoLine .content[data-v-7c49ef9b] {
  flex: none;
  padding: 0 10px;
}
.gameSelector[data-v-7c49ef9b] {
  width: 414px;
  background-color: #1e1e1e;
  max-width: 90%;
  position: relative;
  height: 490px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  padding: 20px 0 0;
  overflow: hidden;
}
.gameSelector > *[data-v-7c49ef9b] {
  flex: none;
}
.selectGameTip[data-v-7c49ef9b] {
  color: #a2a2a2;
  text-align: center;
}
.gameItem[data-v-7c49ef9b] {
  padding: 12px 0;
  margin: 0 45px;
  display: flex;
  color: #cacaca;
  border-bottom: #2e2e2e 1px solid;
  font-size: 18px;
  align-items: center;
  cursor: pointer;
}
.gameItem img[data-v-7c49ef9b] {
  flex: none;
  width: 56px;
  height: 56px;
  object-fit: cover;
}
.icon[data-v-7c49ef9b] {
  width: 26px;
  height: 26px;
  flex: none;
  border-radius: 13px;
  border: solid 1px #8b8b8b;
  box-sizing: border-box;
}
.icon.active[data-v-7c49ef9b] {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAE4AAABOCAMAAAC5dNAvAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAhZQTFRFAAAAxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGOR+ylQAAALJ0Uk5TAAFU1/7//dROJaqkIuLeTw+U/IwNta4eKc7IJC7o4yrhJuXkIcsgDrKxkI9S4KuoU9jV+TFKiggn76EHtKW4CdwTBNMfA3fZLWv3LAJu++dj8y9b9vQ7R+pG8lY6X936n0GTfRfafmT4jQUWw0v1HcnslaO8v+6pEazADFoVBpnCGMULvtCIxxnwwRzpNmDbPeY/WMxI6808RURRK88o1jPtYa9ZmLYQIzcyML0Sorq3YtABTxQAAANkSURBVHic7dj5PxVRFADw+5j7EEWSULbQa6FsWSNrVE9KCfGS9lLKVlqpqMSjkFSStC9a/sPmvTnTezNzZ7tzf+z89Nw7vp87nznn3LmDkCRsAYEcNhz2oGCkFSErjFtChIapYraAlWY1jFeF28haxGq7eQ3jyDVRJC1sLQ3mieh1Si0m1sQzkAYXt16ubYinxTyRECPVEpOsaBgnJfpryRutaRinJPu01DSrGsZpm0TNsZn6KfiC2+KA7N1qHfPENiGfA6iyVxn2dI8WQlFZ5Mjg08+2nZWG8Q6EMtlpGIejLJZcNmKQI77gEEsN4/+c0cgJzXXsjGXG5eXzVVVQyIgrKvZ2kF1suJJioSMVMeFKdwtaVBkLLq5c0Cry/EdpucoqQaveI6lSSq6mFjaGvfsk43Rc0H4Bc9YdkE5QcfWg2Q4eks3QcPUNcKeHj8inKLjGo6A1KTQKrrkJtJZjyknTXGErvB62NRNmzXJ2l1PQqo6TpqVc+4mOjpM5Glr7KbjT02eI81LubDV/5bnz6tyFi4LWeYk8L+FyhKq+3KWC2fNgbVeuqlwh4brh6nSV9fXA2qJU1ia/Wch21NpIWlsvPIXyPjVNxvV3gue6priSuz4gzOXfUNVkHHfzFvSd24ocLb0jTN0d1HhxkOfd0D1YX7Csgu4/gLX1aL0OKtJ4WPQyJc93BIZtDyM1NEJVPHosVviobzADBivqtDBikT0ZE/NlXBxKcMPQBKHsdTg8GQL//BQOLylwqHG6tDGVFjAC+wpqe+Zd2xT8OU1KR30Oz0BSoOezfK00QUtqGSVerM/hF6ngzY12vYSfr2Z1NdV+NyN6U6/hhztFX1Nvn1myQ/48qfka5/CbZH9t4a0RTau5B435NEelIU1zrwj8d+aNGDamaW89ZYtQ9kY1nZ1s1vtmE2H8G4bOxlgzh9BAifETqu4+OxT9zjDGH6IsfqKQxiRaYslNI2cpO+093ytqLX3f8Y+EAk8eLDE60nIfvEla3cuG+yju6v0MMO7TZ7EkY4y1C80Y+eJrGIvKdwiTET/v386+Wny88d+kzdbdbUXrdiNZ5GbTa9nf5Rr/PH7Qan0LSg2h5Z9U+cwVLZM0Pp+XDO1W0hifcJI1Php+mdV+16pifDj/mPmax2W4ZEv7C4jVz/HNFKg1AAAAAElFTkSuQmCC) center / cover;
  border: none;
}
.gameName[data-v-7c49ef9b] {
  margin: 0 15px;
  flex: auto;
}
.bottomAction[data-v-7c49ef9b] {
  display: flex;
  height: 72px;
  align-items: stretch;
  color: #fff;
  font-size: 20px;
}
.bottomAction .cancel[data-v-7c49ef9b] {
  width: 50%;
  background-color: #292929;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.bottomAction .confirm[data-v-7c49ef9b] {
  width: 50%;
  background-color: #292929;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background-color: #d0343a;
}
.gameSelectArea[data-v-7c49ef9b] {
  flex: auto;
  overflow: auto;
}
.close[data-v-7c49ef9b] {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
}
@media screen and (max-width: 900px) {
  .close[data-v-7c49ef9b] {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
  }
  .container[data-v-7c49ef9b] {
    padding: 12px 25px 20px;
    width: 360px;
  }
  .gameSelector[data-v-7c49ef9b] {
    height: 400px;
  }
  .logo[data-v-7c49ef9b] {
    height: 60px;
  }
  .gameItem[data-v-7c49ef9b] {
    font-size: 14px;
  }
  .gameItem img[data-v-7c49ef9b] {
    width: 40px;
    height: 40px;
  }
  .gameItem .icon[data-v-7c49ef9b] {
    width: 20px;
    height: 20px;
    border-radius: 10px;
  }
  .gameSelector[data-v-7c49ef9b] {
    width: 360px;
  }
  .bottomAction[data-v-7c49ef9b] {
    height: 50px;
    font-size: 14px;
  }
}
[data-v-7c49ef9b] input {
  height: 50px;
  color: #dedede;
  display: block;
  width: 100%;
  outline: none;
  background: transparent;
  border: solid 1px #525252;
  margin-bottom: 10px;
  padding: 0 14px;
  box-sizing: border-box;
  font-size: 14px;
}
[data-v-7c49ef9b] input.wrongStyle {
  border: solid 1px #d0343a;
}
[data-v-7c49ef9b] input::placeholder {
  color: #565656;
}
[data-v-7c49ef9b] .errorBox {
  font-size: 18px;
  color: #d0343a;
  margin-top: -10px;
}
.termsTip[data-v-7c49ef9b] {
  margin-top: 15px;
  font-size: 13px;
  color: #717171;
}
.termsTip a[data-v-7c49ef9b] {
  color: #717171;
}
.iconArea[data-v-7c49ef9b] {
  display: grid;
  grid-gap: 10px 0;
  grid-template-columns: repeat(auto-fill, minmax(70px, 1fr));
}

.protocolText[data-v-1eef6106] {
  margin-left: 18px;
  color: #d7d7d7;
  cursor: pointer;
}
.footerProtocol[data-v-1eef6106] {
  padding: 10px 0;
  color: #d7d7d7;
  font-size: 24px;
  text-align: start;
}
.contactUs[data-v-1eef6106] {
  position: relative;
  display: flex;
  height: 110px;
  align-items: center;
  justify-content: center;
  background: #232323;
}
.contactUs .backToTop[data-v-1eef6106] {
  position: absolute;
  bottom: 100%;
  left: 200px;
  width: 5vw;
  cursor: pointer;
}
.footer[data-v-1eef6106] {
  display: flex;
  height: 200px;
  align-items: center;
  justify-content: center;
  margin-top: 20px;
}
.footer .divider[data-v-1eef6106] {
  height: 60px;
  border-left: #fff 1px solid;
  margin: 0 20px;
}
.endLogo[data-v-1eef6106] {
  width: 312px;
  height: 60px;
  object-fit: contain;
}
.icon[data-v-1eef6106] {
  width: 66px;
  height: 66px;
  margin: 0 13px;
}
.icon > img[data-v-1eef6106] {
  width: 100%;
}

.en_EN[data-v-0fc6cb7a] {
  font-family: en, sans-serif;
}
.snMain[data-v-0fc6cb7a] {
  position: fixed;
  z-index: 3;
  top: 0;
  display: flex;
  width: 100%;
  height: 80px;
  align-items: center;
  justify-content: space-between;
  background: black;
  font-size: 20px;
}
.homeNav[data-v-0fc6cb7a] {
  background: rgba(0, 0, 0, 0.7);
}
.leftArea[data-v-0fc6cb7a] {
  position: relative;
  display: flex;
  align-items: center;
}
.iconImg[data-v-0fc6cb7a] {
  height: 60px;
  margin-right: 8px;
  margin-left: 56px;
}
.topNav[data-v-0fc6cb7a] {
  position: relative;
  display: flex;
  min-width: 100px;
  height: 80px;
  align-items: center;
  justify-content: center;
  margin: 0 20px;
  text-align: center;
}
.topNav:hover .subMenu[data-v-0fc6cb7a] {
  display: block;
}
.topNav .subMenu[data-v-0fc6cb7a] {
  position: absolute;
  top: calc(100%);
  left: -20px;
  display: none;
  width: calc(100% + 40px);
  padding-top: 4px;
}
.topNav .subMenu .subItem[data-v-0fc6cb7a] {
  display: flex;
  height: 40px;
  align-items: center;
  justify-content: center;
  background: rgba(51, 51, 51, 0.8);
  color: #9e9e9e;
  cursor: pointer;
  font-size: 20px;
  text-align: center;
}
.solid .topNav .subMenu .subItem[data-v-0fc6cb7a] {
  background: #333;
}
.solid .topNav .subMenu .subItem[data-v-0fc6cb7a]:hover {
  background: #5a5a5a;
}
.topNav .subMenu .subItem[data-v-0fc6cb7a]:hover {
  background: rgba(90, 90, 90, 0.8);
  color: #fefefe;
}
.linkName[data-v-0fc6cb7a] {
  display: block;
  min-width: 63px;
  color: #fff;
  cursor: pointer;
  line-height: 22px;
  user-select: none;
}
.linkName[data-v-0fc6cb7a]:hover,
.linkName.highlight[data-v-0fc6cb7a] {
  color: #e3a95d;
}
.textLine[data-v-0fc6cb7a] {
  position: absolute;
  bottom: 0;
  left: 0;
  display: none;
  width: 100%;
  border-top: solid 4px #e3a95d;
  transition: all 0.2s ease-in-out 0s;
}
.textLine.select[data-v-0fc6cb7a] {
  display: block;
}
.saleIcon[data-v-0fc6cb7a] {
  width: 60px;
  margin: 0 10px;
  animation: shakeicon-0fc6cb7a 3s linear 0s infinite;
}
.UserArea[data-v-0fc6cb7a] {
  display: flex;
  align-items: center;
  margin-right: 80px;
  color: #fff;
  cursor: pointer;
  gap: 20px;
}
.logout[data-v-0fc6cb7a] {
  padding: 0 40px;
  color: #fff;
  cursor: pointer;
}
.langSelect[data-v-0fc6cb7a] {
  position: relative;
  display: flex;
  height: 100%;
  align-items: center;
  margin-right: 30px;
  color: #dfdfdf;
  cursor: pointer;
  font-size: 24px;
  gap: 10px;
  text-align: center;
}
.langSelect .iconDown[data-v-0fc6cb7a] {
  position: relative;
  transition: transform 0.3s;
}
.langSelect .iconDown.active[data-v-0fc6cb7a] {
  transform: rotate(180deg);
}
.langOption[data-v-0fc6cb7a] {
  position: absolute;
  z-index: 5;
  top: 100%;
  left: 0;
  width: 174px;
  box-sizing: border-box;
  border: 1px solid #818181;
  background: #000;
}
.langOption .item[data-v-0fc6cb7a] {
  display: flex;
  height: 50px;
  align-items: center;
  justify-content: center;
  color: #a3a3a3;
  cursor: pointer;
}
.langOption .item[data-v-0fc6cb7a]:hover {
  background: #5a5a5a;
  color: #dfdfdf;
}
.langIcon[data-v-0fc6cb7a] {
  height: 30%;
}
@keyframes shakeicon-0fc6cb7a {
0%,
  20%,
  100% {
    transform: rotate(0deg);
}
2.5% {
    transform: rotate(10deg);
}
7.5% {
    transform: rotate(-10deg);
}
12.5% {
    transform: rotate(10deg);
}
17.5% {
    transform: rotate(-10deg);
}
}

.articleMain[data-v-597307bf] {
  display: flex;
  min-height: 100vh;
  box-sizing: border-box;
  flex-direction: column;
  align-items: center;
  padding: 613px 10px 0;
  background: top center / 1920px auto url(https://yottacdn.akamaized.net/carolpfres/common/assets/frontend/game_home/alliance/home/assets/bg.d9e85a54.png) no-repeat;
  color: #fff;
}
.content[data-v-597307bf] {
  width: 100%;
  max-width: 1060px;
  padding-bottom: 120px;
  margin: 0 auto;
  text-align: center;
}
.content .main[data-v-597307bf] {
  color: #fff;
}
.content[data-v-597307bf] td {
  border: #242c36 1px solid !important;
}
.content[data-v-597307bf] img,
.content[data-v-597307bf] iframe,
.content[data-v-597307bf] video {
  max-width: 100%;
}
.title[data-v-597307bf] {
  font-family: Beayfort, sans-serif;
  font-size: 58px;
}
@media screen and (width <= 700px) {
.articleMain[data-v-597307bf] {
    padding-top: 120vw;
    background: top center / 100% auto url(https://yottacdn.akamaized.net/carolpfres/common/assets/frontend/game_home/alliance/home/assets/bg_mobile.0454e54f.png) no-repeat;
}
.title[data-v-597307bf] {
    font-size: 36px;
    font-style: italic;
    text-align: left;
}
}

.link[data-v-33c58918] {
  color: #106be6;
  cursor: pointer;
  text-decoration: unset;
}
.bold[data-v-33c58918] {
  font-weight: bold;
}

.regionMain[data-v-59991cfa] {
  display: flex;
  min-height: 100vh;
  padding: 150px;
  background: #fff;
}
.regionMain .left[data-v-59991cfa] {
  width: 70%;
  margin-right: 80px;
}
.regionMain .left .title[data-v-59991cfa] {
  margin-top: 30px;
  font-size: 30px;
  font-weight: bold;
  text-align: center;
}
.regionMain .left .divider[data-v-59991cfa] {
  height: 14px;
  margin-bottom: 30px;
  border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABGYAAAAOAgMAAAAQz/JEAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURUdwTL6+vsDAwL+/v0AXin0AAAADdFJOUwCCVejCm2wAAABWSURBVEjHY2AYRICVYRTgAPIOo2GAA9RfGA0D7IDx15fRQMAO2B/sHQ0EHEVNg/6gKmz+Dx7wj4F7ELnmw2jQ4A6a0Qw1WgyPVt6jTb7RjsIoGJTdSwBHjDqNDKXb8AAAAABJRU5ErkJggg==) 0 557 fill / 0 calc(50% - 6px) stretch;
}
.regionMain .left .content[data-v-59991cfa] {
  margin-bottom: 60px;
  font-size: 22px;
  white-space: pre-line;
}
.regionMain .right[data-v-59991cfa] {
  width: 30%;
}
.regionMain .right .name[data-v-59991cfa] {
  margin-bottom: 30px;
  font-size: 60px;
}
.regionMain .right .logo[data-v-59991cfa] {
  width: 130px;
  background: #000;
}
.regionMain .right .divider[data-v-59991cfa] {
  height: 10px;
  margin: 30px 0;
  border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAKAgMAAADTB3b7AAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURb6+vra2tkdwTL+/v5F61xcAAAADdFJOU7cHAHUmuowAAAA1SURBVAjXY1gVtWrV0lUMK9lWrZqQxbDk46pV/lIMk/9krbQ/xuD/Hwg+wiioIFQJVANEOwApCiWzKn+N2QAAAABJRU5ErkJggg==) 0 10 0 10 fill / 0 10px stretch;
}
.regionMain .right .row[data-v-59991cfa] {
  display: flex;
  font-size: 22px;
}
.regionMain .right .row .title[data-v-59991cfa] {
  width: 150px;
  flex: none;
  margin-right: 10px;
  font-weight: bold;
}
.regionMain .right .row .content[data-v-59991cfa] {
  min-width: 0;
  flex: auto;
  white-space: pre-line;
}
.raceName[data-v-59991cfa] {
  font-size: 60px;
}
.heroRow[data-v-59991cfa] {
  display: flex;
  flex-wrap: wrap;
}
.heroRow > img[data-v-59991cfa] {
  width: 152px;
  height: 152px;
  flex: none;
  margin-right: 20px;
  margin-bottom: 10px;
}

.dbr[data-v-06d968fe] {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 283px;
  height: 500px;
}
.dtl[data-v-06d968fe] {
  position: absolute;
  top: 0;
  left: 0;
  width: 235px;
  height: 255px;
}

.cloudLayer[data-v-b0f62848] {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  height: 100%;
  animation: fly-b0f62848 30s infinite linear;
  pointer-events: none;
}
.cloudLayer > img[data-v-b0f62848] {
  flex: none;
}
@keyframes fly-b0f62848 {
from {
    transform: translateX(-50%);
}
to {
    transform: translateX(0);
}
}
.cloudMask[data-v-b0f62848] {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  width: 100%;
  height: 100%;
  mask: url(https://yottacdn.akamaized.net/carolpfres/common/assets/frontend/game_home/alliance/home/assets/mask.c39ec368.png) center / cover;
  pointer-events: none;
}

.hiddenBox[data-v-72bdae1f] {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 56.25vw;
}
.region[data-v-72bdae1f] {
  position: relative;
  width: 100%;
  height: 56.25vw;
  background: center / cover url(https://yottacdn.akamaized.net/carolpfres/common/assets/frontend/game_home/alliance/home/assets/bg_area_worldmap.164096eb.png);
}
@keyframes fly-72bdae1f {
from {
    transform: translateX(-50%);
}
to {
    transform: translateX(0);
}
}
.factionItem[data-v-72bdae1f] {
  position: absolute;
  display: block;
  color: #f5eed9;
  font-size: 1.25vw;
  text-decoration: none;
  text-shadow: 0 2px 2px rgba(0 0 0 / 80%);
}
.factionItem[data-v-72bdae1f]:hover {
  color: #ffce65;
}

.raceMain[data-v-50603707] {
  position: relative;
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  align-items: center;
  padding: 150px 0 0;
  background: #fff;
}
.title[data-v-50603707] {
  margin-bottom: 20px;
  font-size: 90px;
  font-weight: bold;
}
.en_EN .title[data-v-50603707] {
  font-family: en, sans-serif;
}
.subTitle[data-v-50603707] {
  margin-bottom: 70px;
  font-size: 26px;
  text-align: center;
  white-space: pre-line;
}
.raceList[data-v-50603707] {
  display: grid;
  width: 1400px;
  max-width: 90vw;
  padding: 60px 0;
  grid-gap: 50px 60px;
  grid-template-columns: 1fr 1fr;
}
.raceItem[data-v-50603707] {
  position: relative;
  cursor: pointer;
  outline: solid 5px rgba(0 0 0/0%);
  outline-offset: 5px;
  transition: all 0.5s;
}
.raceItem[data-v-50603707]:hover {
  outline: solid 5px #ffd36e;
}
.raceItem:hover .hoverImg[data-v-50603707] {
  opacity: 1;
}
.raceItem .raceImg[data-v-50603707] {
  display: block;
  width: 100%;
  height: 200px;
  object-fit: cover;
}
.raceItem .raceName[data-v-50603707] {
  position: absolute;
  bottom: 6px;
  left: 10px;
  color: #fff;
  font-size: 36px;
  line-height: 100%;
}
.raceItem .hoverImg[data-v-50603707] {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 46px;
  opacity: 0;
  pointer-events: none;
  transition: all 0.5s;
}

.item[data-v-7770dd53] {
  cursor: pointer;
}
.cornerArea[data-v-7770dd53] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.cornerArea img[data-v-7770dd53] {
  position: absolute;
  width: 1vw;
  height: 1vw;
  padding: 1vw;
}
.cornerArea img[data-v-7770dd53]:nth-child(1) {
  top: 0;
  left: 0;
  transform: rotate(-90deg);
}
.cornerArea img[data-v-7770dd53]:nth-child(2) {
  top: 0;
  right: 0;
}
.cornerArea img[data-v-7770dd53]:nth-child(3) {
  right: 0;
  bottom: 0;
  transform: rotate(90deg);
}
.wallPaperName[data-v-7770dd53] {
  position: absolute;
  bottom: 0;
  left: 0;
  display: flex;
  height: 53px;
  align-items: center;
  padding: 0 30px 0 10px;
  border-image: 20 20 1 1 fill / 20px 20px 0 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpEM0QwOTcyRjJEMDcxMUVFQTQzQkEyMzdEOEZDMDgxOSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpEM0QwOTczMDJEMDcxMUVFQTQzQkEyMzdEOEZDMDgxOSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkQzRDA5NzJEMkQwNzExRUVBNDNCQTIzN0Q4RkMwODE5IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkQzRDA5NzJFMkQwNzExRUVBNDNCQTIzN0Q4RkMwODE5Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+EYyObAAAAIlJREFUeNrs0MsNgDAMA1BTMR4dkDlgQHpCQvzaxkl6iCUfEz15ArCiL1vpDlKS4DaXLiNAqJhE+EHBJNKyYgwLIsYwISIMG9KN0YB0YbQgzRhNSBNGG1KNsYBUYawgvxhLyCfGGvKK8YA8YrwgN4wn5IKZ4Z88wiInZhQIAhKQgAQkIAHRziHAAAB6DaJ3GK7NAAAAAElFTkSuQmCC);
  color: #fff;
  font-size: 20px;
  pointer-events: none;
}
.wallPaperName > img[data-v-7770dd53] {
  width: 26px;
  height: 22px;
  padding-right: 5px;
  object-fit: cover;
}
.modal[data-v-7770dd53] {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  background: rgba(0 0 0/50%);
}
.modal .close[data-v-7770dd53] {
  position: absolute;
  top: 0.5vw;
  right: 10vw;
  width: 4vw;
  cursor: pointer;
}
.modal .content[data-v-7770dd53] {
  display: flex;
  width: 70%;
  flex-direction: column;
}
.modal .content > img[data-v-7770dd53] {
  width: 100%;
}
.modal .content .download[data-v-7770dd53] {
  display: flex;
  height: 86px;
  align-items: center;
  justify-content: space-between;
  padding: 0 23px;
  background: #000;
  color: #e8bc5f;
  font-size: 22px;
}
.img20[data-v-7770dd53] {
  object-position: right;
}
.img13[data-v-7770dd53] {
  object-position: 30%;
}
.img24[data-v-7770dd53] {
  object-position: 30%;
}
.img6[data-v-7770dd53] {
  object-position: 70%;
}
.img25[data-v-7770dd53] {
  object-position: 40%;
}
.img10[data-v-7770dd53] {
  object-position: 30%;
}
.downloadNameWrapper[data-v-7770dd53] {
  display: flex;
  align-items: center;
  color: #fff;
  gap: 10px;
}

.galleryContainer[data-v-770ebdde],
.firstBanner[data-v-770ebdde] {
  display: flex;
  flex-wrap: wrap;
  gap: 1.46vw;
}
.galleryContainer .item[data-v-770ebdde],
.firstBanner .item[data-v-770ebdde] {
  position: relative;
}
.container[data-v-770ebdde] {
  position: relative;
  min-height: 100vh;
  padding: 60px 10vw 150px;
  background: #fff;
}
.firstBanner[data-v-770ebdde] .item {
  position: relative;
}
.firstBanner[data-v-770ebdde] .item:nth-child(1) {
  width: 58.01vw;
  height: 30.21vw;
}
.firstBanner[data-v-770ebdde] .item:nth-child(4) {
  width: 44vw;
  height: 25vw;
}
.firstBanner[data-v-770ebdde] .item:nth-child(2) {
  width: 20vw;
  height: 14.38vw;
}
.firstBanner[data-v-770ebdde] .item:nth-child(2)::after {
  position: absolute;
  top: 25.52vw;
  left: 2.86vw;
  width: 2.97vw;
  height: 1.3vw;
  background: center / contain url(data:image/png;base64,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) no-repeat;
  content: '';
  pointer-events: none;
}
.firstBanner[data-v-770ebdde] .item:nth-child(3) {
  width: 34vw;
  height: 19vw;
}
.firstBanner[data-v-770ebdde] .item .img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.galleryContainer[data-v-770ebdde] {
  position: relative;
  margin-top: 1.46vw;
}
.galleryContainer[data-v-770ebdde] .item:nth-child(12n + 1),
.galleryContainer[data-v-770ebdde] .item:nth-child(12n + 2),
.galleryContainer[data-v-770ebdde] .item:nth-child(12n + 5),
.galleryContainer[data-v-770ebdde] .item:nth-child(12n + 6),
.galleryContainer[data-v-770ebdde] .item:nth-child(12n + 7),
.galleryContainer[data-v-770ebdde] .item:nth-child(12n + 10) {
  width: 18.7vw;
  height: 30.21vw;
}
.galleryContainer[data-v-770ebdde] .item:nth-child(12n + 3),
.galleryContainer[data-v-770ebdde] .item:nth-child(12n + 8),
.galleryContainer[data-v-770ebdde] .item:nth-child(12n + 9),
.galleryContainer[data-v-770ebdde] .item:nth-child(12n + 11) {
  width: 38.85vw;
  height: 30.21vw;
}
.galleryContainer[data-v-770ebdde] .item:nth-child(12n + 4),
.galleryContainer[data-v-770ebdde] .item:nth-child(12n + 12) {
  width: 18.7vw;
  height: 14.38vw;
}
.galleryContainer[data-v-770ebdde] .item:nth-child(12n + 4)::after,
.galleryContainer[data-v-770ebdde] .item:nth-child(12n + 12)::after {
  position: absolute;
  top: 25.52vw;
  left: 2.86vw;
  width: 2.97vw;
  height: 1.3vw;
  background: center / contain url(data:image/png;base64,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) no-repeat;
  content: '';
  pointer-events: none;
}
.galleryContainer[data-v-770ebdde] .item .img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.title[data-v-770ebdde] {
  width: fit-content;
  height: 190px;
  box-sizing: border-box;
  padding: 0 100px 0 10vw;
  margin: 0 auto 60px 0;
  background: #fff;
  border-image: 0 128 0 0 fill / 0 100px 0 0 url(https://yottacdn.akamaized.net/carolpfres/common/assets/frontend/game_home/alliance/home/assets/img_bg_blue4.8a2da60e.png);
  font-size: 90px;
  line-height: 190px;
}
.en_EN .title[data-v-770ebdde] {
  font-family: en, sans-serif;
}
.bg2[data-v-770ebdde] {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 234px;
  height: 586px;
  pointer-events: none;
}

/**
 * Swiper 11.2.6
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2025 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: March 19, 2025
 */
/* FONT_START */
@font-face {
  font-family: 'swiper-icons';
  src: url('data:application/font-woff;charset=utf-8;base64, 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');
  font-weight: 400;
  font-style: normal;
}
/* FONT_END */
:root {
  --swiper-theme-color: #007aff;
  /*
  --swiper-preloader-color: var(--swiper-theme-color);
  --swiper-wrapper-transition-timing-function: initial;
  */
}
:host {
  position: relative;
  display: block;
  margin-left: auto;
  margin-right: auto;
  z-index: 1;
}
.swiper {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  /* Fix of Webkit flickering */
  z-index: 1;
  display: block;
}
.swiper-vertical > .swiper-wrapper {
  flex-direction: column;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
  box-sizing: content-box;
}
.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
  transform: translate3d(0px, 0, 0);
}
.swiper-horizontal {
  touch-action: pan-y;
}
.swiper-vertical {
  touch-action: pan-x;
}
.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
  display: block;
}
.swiper-slide-invisible-blank {
  visibility: hidden;
}
/* Auto Height */
.swiper-autoheight,
.swiper-autoheight .swiper-slide {
  height: auto;
}
.swiper-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}
.swiper-backface-hidden .swiper-slide {
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
/* 3D Effects */
.swiper-3d.swiper-css-mode .swiper-wrapper {
  perspective: 1200px;
}
.swiper-3d .swiper-wrapper {
  transform-style: preserve-3d;
}
.swiper-3d {
  perspective: 1200px;
}
.swiper-3d .swiper-slide,
.swiper-3d .swiper-cube-shadow {
  transform-style: preserve-3d;
}
/* CSS Mode */
.swiper-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  /* For Firefox */
  -ms-overflow-style: none;
  /* For Internet Explorer and Edge */
}
.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}
.swiper-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}
.swiper-css-mode.swiper-horizontal > .swiper-wrapper {
  scroll-snap-type: x mandatory;
}
.swiper-css-mode.swiper-vertical > .swiper-wrapper {
  scroll-snap-type: y mandatory;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper {
  scroll-snap-type: none;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: none;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper::before {
  content: '';
  flex-shrink: 0;
  order: 9999;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: center center;
  scroll-snap-stop: always;
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child {
  margin-inline-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper::before {
  height: 100%;
  min-height: 1px;
  width: var(--swiper-centered-offset-after);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
  margin-block-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper::before {
  width: 100%;
  min-width: 1px;
  height: var(--swiper-centered-offset-after);
}
/* Slide styles start */
/* 3D Shadows */
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}
.swiper-3d .swiper-slide-shadow {
  background: rgba(0, 0, 0, 0.15);
}
.swiper-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  transform-origin: 50%;
  box-sizing: border-box;
  border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
  border-radius: 50%;
  border-top-color: transparent;
}
.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,
.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader {
  animation: swiper-preloader-spin 1s infinite linear;
}
.swiper-lazy-preloader-white {
  --swiper-preloader-color: #fff;
}
.swiper-lazy-preloader-black {
  --swiper-preloader-color: #000;
}
@keyframes swiper-preloader-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* Slide styles end */

.fadeInActive .heroBg[data-v-abd53e3e] {
  transform: scale(1);
}
.fadeInActive .heroBg[data-v-abd53e3e]::after {
  background: rgba(0 0 0 / 40%);
}
.fadeInActive .content[data-v-abd53e3e] {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}
.fadeInActive .heroSelect[data-v-abd53e3e] {
  width: 13.07vw;
}
.main[data-v-abd53e3e] {
  position: relative;
  height: 67.71vw;
  overflow-x: hidden;
}
.heroBg[data-v-abd53e3e] {
  position: absolute;
  width: 100%;
  height: 100%;
  background: center / cover var(--29294c9e) no-repeat;
  transform: scale(1.2);
  transition: all 0.5s;
  filter: blur(20px);
}
.heroBg[data-v-abd53e3e]::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: '';
  transition: all 0.5s;
}
.content[data-v-abd53e3e] {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  width: 86.46vw;
  height: 56.25vw;
  box-sizing: border-box;
  padding-top: 6vw;
  border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEYAAABGAgMAAAAMQAoXAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURUdwTJ2dnaCgoJ+fn06AvzEAAAAEdFJOUwBmM1UQoxFDAAAAp0lEQVQ4y83Muw1CQQwF0ZXIryjHISWQrPTKoVRK4e3f9jTAhCeYUutVUq8i0uMDKl+SkUTKs5vyrJGRREqzRmnWyUgixVmnOBtkJJHCbFCYTTKSSH42yc8WGUkkN1vkZpuMJNKZbTqzQ0YSac8O7ZkjI4m0Zo7WzJORRJozT3MWyEgijVmgMYtkJJH6LFKfJTKSSG2WqM0yGUmke5bpnoGef0s19/4Bv6gxN+EGqqYAAAAASUVORK5CYII=) 68 68 1 1/3.39vw 3.39vw 1px 1px;
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.9);
  transition: all 0.5s 0.3s;
}
.content > .right[data-v-abd53e3e] {
  display: flex;
  width: 19.38vw;
  flex-direction: column;
  align-items: center;
  margin-left: 1vw;
  color: #fff;
}
.content > .right .regionTitle[data-v-abd53e3e] {
  text-align: center;
}
.content > .right .divider[data-v-abd53e3e] {
  width: 100%;
  height: 0.52vw;
  align-self: center;
  border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAKAgMAAADTB3b7AAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURb6+vra2tkdwTL+/v5F61xcAAAADdFJOU7cHAHUmuowAAAA1SURBVAjXY1gVtWrV0lUMK9lWrZqQxbDk46pV/lIMk/9krbQ/xuD/Hwg+wiioIFQJVANEOwApCiWzKn+N2QAAAABJRU5ErkJggg==) 0 10 0 10 fill / 0 0.52vw 0;
}
.left[data-v-abd53e3e] {
  display: flex;
  width: 21.3vw;
  height: 100%;
  flex-direction: column;
  margin-left: 3.8vw;
  color: #fff;
}
.left .heroName[data-v-abd53e3e] {
  font-size: 3.13vw;
  font-weight: bold;
  text-align: center;
}
.left .divider[data-v-abd53e3e] {
  width: 105%;
  height: 0.52vw;
  align-self: center;
  border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAKAgMAAADTB3b7AAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURb6+vra2tkdwTL+/v5F61xcAAAADdFJOU7cHAHUmuowAAAA1SURBVAjXY1gVtWrV0lUMK9lWrZqQxbDk46pV/lIMk/9krbQ/xuD/Hwg+wiioIFQJVANEOwApCiWzKn+N2QAAAABJRU5ErkJggg==) 0 10 0 10 fill / 0 0.52vw 0;
}
.left .heroDesc[data-v-abd53e3e] {
  overflow: auto;
  height: 5.31vw;
  margin-top: 1.2vw;
  font-size: 1.15vw;
  line-height: 1.77vw;
}
.left .viewMore[data-v-abd53e3e] {
  margin-top: 2vw;
  color: #ffd36e;
  cursor: pointer;
  visibility: hidden;
}
.left .heroInfo[data-v-abd53e3e] {
  overflow: auto;
  height: 5.31vw;
  margin-top: 1.2vw;
  font-size: 1.15vw;
  line-height: 1.77vw;
  margin-top: 4vw;
}
.left .skillTitle[data-v-abd53e3e] {
  margin-top: 2vw;
  font-size: 1.56vw;
}
.left .skill[data-v-abd53e3e] {
  display: flex;
  justify-content: space-around;
  margin-top: 2vw;
  margin-bottom: 1vw;
}
.left .skill > img[data-v-abd53e3e] {
  display: block;
  width: 3.59vw;
  height: 3.59vw;
  cursor: pointer;
  outline: rgba(0 0 0 / 0%) solid 0.2vw;
  outline-offset: 0.2vw;
  transition: all 0.5s, transform 0.5s;
}
.left .skill > img[data-v-abd53e3e]:hover {
  outline: #ebb63d solid 0.2vw;
}
.left .skill > img.active[data-v-abd53e3e] {
  outline: #ebb63d solid 0.2vw;
  outline-offset: 0.2vw;
  transform: translateY(-30%);
}
.left .skillName[data-v-abd53e3e] {
  margin-top: 1vw;
  font-size: 1.25vw;
}
.left .skillDesc[data-v-abd53e3e] {
  overflow: auto;
  height: 5.31vw;
  margin-top: 1.2vw;
  font-size: 1.15vw;
  line-height: 1.77vw;
  margin-top: 0;
  font-size: 1.04vw;
}
.centerImg[data-v-abd53e3e] {
  position: relative;
  width: 38.07vw;
  margin-bottom: 8vw;
}
.centerImg .bg2[data-v-abd53e3e],
.centerImg .bg1[data-v-abd53e3e],
.centerImg .main[data-v-abd53e3e] {
  position: absolute;
}
.centerImg .bg1[data-v-abd53e3e] {
  top: 5%;
  width: 100%;
}
.centerImg .bg2[data-v-abd53e3e] {
  top: 6.5%;
  left: 1.5%;
  width: 97%;
  animation: rotate-abd53e3e 15s infinite linear;
}
.centerImg .main[data-v-abd53e3e] {
  top: 7.3%;
  left: 2.5%;
  width: 95%;
  height: auto;
  border-radius: 50%;
}
.centerImg .right[data-v-abd53e3e] {
  display: flex;
  flex: auto;
  flex-direction: column;
  align-items: center;
}
@keyframes rotate-abd53e3e {
from {
    transform: rotate(0deg);
}
to {
    transform: rotate(360deg);
}
}
.regionContainer[data-v-abd53e3e] {
  display: grid;
  margin-top: 1.35vw;
  margin-bottom: 2.4vw;
  grid-gap: 0.8vw;
  grid-template-columns: repeat(7, 2vw);
  place-content: center center;
}
.regionIcon[data-v-abd53e3e] {
  width: 2.03vw;
  cursor: pointer;
}
.regionRow[data-v-abd53e3e] {
  display: flex;
  align-items: center;
  justify-content: center;
}
.regionRow > img[data-v-abd53e3e] {
  width: 2vw;
}
.heroListContainer[data-v-abd53e3e] {
  position: relative;
  overflow: hidden;
  width: 100%;
  min-height: 0;
  flex: auto;
  margin-bottom: 6.8vw;
}
.heroSwiper[data-v-abd53e3e] {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 45vw;
}
.heroSlide[data-v-abd53e3e] {
  display: flex;
  height: 5vw;
  box-sizing: border-box;
  align-items: center;
  padding: 0.5vw 0 0.5vw 8.11vw;
  color: #fff;
  cursor: pointer;
  font-size: 1.04vw;
}
.heroSlide.swiper-slide-active > img[data-v-abd53e3e] {
  transform: translateX(-0.7vw) scale(1.08);
}
.heroSlide > img[data-v-abd53e3e] {
  position: relative;
  width: 3.96vw;
  height: 3.96vw;
  margin-right: 1vw;
  object-fit: cover;
  transition: all 0.5s;
}
.heroSelect[data-v-abd53e3e] {
  position: absolute;
  z-index: 10;
  top: 24.38vw;
  right: 10.4vw;
  width: 0;
  height: 5vw;
  object-fit: cover;
  object-position: top right;
  pointer-events: none;
  transition: width 0.5s 0.7s;
}
.fade-enter-active[data-v-abd53e3e],
.fade-leave-active[data-v-abd53e3e] {
  transition: all 0.5s ease;
}
.fade-enter-from[data-v-abd53e3e],
.fade-leave-to[data-v-abd53e3e] {
  opacity: 0;
}

.heroMain[data-v-6a743a48] {
  position: relative;
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  align-items: center;
  padding: 150px;
  background: #fff;
}
.title[data-v-6a743a48] {
  margin-bottom: 20px;
  font-size: 90px;
  font-weight: bold;
}
.en_EN .title[data-v-6a743a48] {
  font-family: en, sans-serif;
}
.subTitle[data-v-6a743a48] {
  font-size: 26px;
  text-align: center;
  white-space: pre-line;
}
.filterRow[data-v-6a743a48] {
  position: relative;
  display: flex;
  width: 100%;
  height: 66px;
  align-items: center;
  padding: 0 20px 0 30px;
  margin-top: 70px;
  border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAgBAMAAAD3btVMAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAPUExURUdwTJ+fn56enp2dnZ6envi+ogIAAAAEdFJOUwAVf9SAZ3T1AAAAWklEQVQY083KyQ2AMBBD0UGiAyggNVBBDum/JjK7TQVY8uFJX5ZuSG3uHw9brsGGwAyBuwN3B+EKwhWkM0hnUI6gHEHbg7YHYAvAFqA1QGtA3gFZ7o/P33nxXuKyEPbUoxUOAAAAAElFTkSuQmCC) 21 20 1 1 fill / 21px 20px 1px 1px;
  color: #1c1c1c;
  font-size: 22px;
}
.regionIcon[data-v-6a743a48] {
  width: 32px;
  margin: 0 5px;
  cursor: pointer;
}
.divider[data-v-6a743a48] {
  width: 1px;
  height: 40px;
  margin: 0 10px;
  background: #c2c2c2;
  pointer-events: none;
}
.search[data-v-6a743a48] {
  width: 26px;
  height: 26px;
  object-fit: contain;
}
.searchInput[data-v-6a743a48] {
  width: 100px;
  padding: 0 10px;
  border: none;
  font-size: 22px;
  outline: none;
}
.searchInput[data-v-6a743a48]::placeholder {
  color: #a8a8a8;
}
.dividerFull[data-v-6a743a48] {
  width: 1px;
  align-self: stretch;
  margin: 0 10px;
  background: #c2c2c2;
  pointer-events: none;
}
.list-move[data-v-6a743a48],
.list-enter-active[data-v-6a743a48] {
  transition: all 0.5s ease !important;
}
.list-leave-active[data-v-6a743a48] {
  position: absolute !important;
  opacity: 0 !important;
  transition: none !important;
}
.list-enter-from[data-v-6a743a48] {
  opacity: 0 !important;
  transform: scale(0.8) !important;
}
.heroGrid[data-v-6a743a48] {
  position: relative;
  display: grid;
  align-self: stretch;
  justify-content: center;
  margin-top: 65px;
  gap: 39px 15px;
  grid-auto-rows: 250px;
  grid-template-columns: repeat(auto-fill, 195px);
}
.heroItem[data-v-6a743a48] {
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
  transition: all 0.5s;
}
.heroItem[data-v-6a743a48]:hover {
  background: #66b6fe;
  transform: scale(1.05);
}
.heroItem:hover .heroName[data-v-6a743a48] {
  color: #fff;
}
.heroImg[data-v-6a743a48] {
  width: 182px;
  height: 182px;
  margin-top: 5px;
}
.heroName[data-v-6a743a48] {
  color: #1c1c1c;
  font-size: 28px;
  font-weight: bold;
  line-height: 200%;
  text-align: center;
  transition: all 0.5s;
}
.optionArea[data-v-6a743a48] {
  position: absolute;
  z-index: 10;
  top: calc(100% - 1px);
  right: 0;
  overflow: auto;
  width: 175px;
  max-height: 325px;
  border: solid #c2c2c2;
  border-width: 0 1px 1px;
  background: #fff;
}
.optionItem[data-v-6a743a48] {
  height: 50px;
  padding-left: 10px;
  cursor: pointer;
  font-size: 22px;
  line-height: 50px;
}
.optionItem[data-v-6a743a48]:hover {
  background: #ededed;
}
.allIcon[data-v-6a743a48],
.positionLabel[data-v-6a743a48] {
  position: relative;
  display: flex;
  align-items: center;
  align-self: stretch;
  justify-content: center;
  margin: 0 14px;
  color: #a8a8a8;
  cursor: pointer;
}
.allIcon.active[data-v-6a743a48],
.positionLabel.active[data-v-6a743a48] {
  color: #1c1c1c;
}
.allIcon.active[data-v-6a743a48]::after,
.positionLabel.active[data-v-6a743a48]::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 6px;
  background: #ffd36e;
  content: '';
}


.featurePart[data-v-58c1b89c] {
  position: relative;
  width: 100%;
  height: 56vw;
  opacity: 0.2;
  transform: scale(1.1);
  transition: all 0.8s ease;
}
.featurePart.fadeIn[data-v-58c1b89c] {
  opacity: 1;
  transform: scale(1);
}
.featurePart.en_EN .featureTitle[data-v-58c1b89c] {
  font-family: en, sans-serif;
}
.featureBg[data-v-58c1b89c] {
  position: absolute;
  bottom: 0;
  width: 100%;
}
.featureTitle[data-v-58c1b89c] {
  position: absolute;
  top: 2.5vw;
  left: 9vw;
  padding-left: 0.3vw;
  color: #fff;
  font-size: 2.2vw;
}
.titleBg[data-v-58c1b89c] {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  height: 90%;
  margin: auto;
}
.titleText[data-v-58c1b89c] {
  position: relative;
}
.featureSwiper[data-v-58c1b89c] {
  position: absolute;
  width: 95vw;
  height: 49vw;
  margin: auto;
  inset: 0;
}
.swiperImage[data-v-58c1b89c] {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 60vw;
  border: 0.5vw solid transparent;
  border-radius: 0 2vw;
  transform: translate(-50%, -50%);
}
.activeBorder[data-v-58c1b89c] {
  border-image: url(https://yottacdn.akamaized.net/carolpfres/common/assets/frontend/game_home/alliance/home/assets/border_img.197a777a.png) 66 75 70 70/2.6vw;
}
.myPagination[data-v-58c1b89c] {
  position: absolute;
  bottom: -13%;
  display: flex;
  width: 100%;
  justify-content: center;
  gap: 2vw;
}
.myPagination .paginationIcon[data-v-58c1b89c] {
  width: 1.2vw;
  height: 1.2vw;
  cursor: pointer;
}
.myPagination .paginationIcon > img[data-v-58c1b89c] {
  width: 100%;
  height: 100%;
}
.arrowWrapper[data-v-58c1b89c] {
  position: absolute;
  z-index: 1;
  top: 47%;
  cursor: pointer;
}
.arrowWrapper > img[data-v-58c1b89c] {
  width: 2.2vw;
}
.leftArrow[data-v-58c1b89c] {
  left: 6vw;
  transform: rotate(180deg);
}
.rightArrow[data-v-58c1b89c] {
  right: 6vw;
}

.main[data-v-dced219e] {
  position: relative;
  width: 100%;
}
.main .content[data-v-dced219e] {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  padding-bottom: 6vw;
}
@keyframes iconShake-dced219e {
0%,
  20%,
  100% {
    transform: rotate(0deg);
}
2.5% {
    transform: rotate(-10deg);
}
7.5% {
    transform: rotate(10deg);
}
12.5% {
    transform: rotate(-10deg);
}
17.5% {
    transform: rotate(10deg);
}
}
.rewardBtn[data-v-dced219e] {
  position: relative;
  width: 20vw;
  height: 7.1vw;
  margin-bottom: 0.6vw;
  background: url(https://yottacdn.akamaized.net/carolpfres/common/assets/frontend/game_home/alliance/home/assets/free.d6a5b740.png) center / cover;
  cursor: pointer;
}
.rewardBtn[data-v-dced219e]:hover {
  filter: drop-shadow(0 0 0.5vh white);
  transform: translate(0, -0.5vw);
  transition-duration: 0.15s;
}
.rewardBtn .rewardIcon[data-v-dced219e] {
  position: absolute;
  width: 76%;
  margin: auto;
  inset: 0;
  transform: translateY(-15%);
}
.rewardBtn .rewardTooltip[data-v-dced219e] {
  position: absolute;
  top: -20%;
  right: -18%;
  width: 8vw;
  height: 4.87vw;
  animation: iconShake-dced219e 3s linear 0s infinite;
  background: url(https://yottacdn.akamaized.net/carolpfres/common/assets/frontend/game_home/alliance/home/assets/tooltip.4de493e7.png) center / cover;
}
.mainVideo[data-v-dced219e] {
  display: block;
  width: 100%;
  height: fit-content;
  aspect-ratio: 1920/1080;
}
.btnBar[data-v-dced219e] {
  display: flex;
  margin-bottom: 0.5vw;
  gap: 2vw;
}
.btnBar .btnItem[data-v-dced219e] {
  position: relative;
}
.btnBar .btnItem[data-v-dced219e]:hover {
  filter: drop-shadow(0 0 0.5vh white);
  transform: translate(0, -0.5vw);
  transition-duration: 0.15s;
}
.btnBar .btnItem .saleIcon[data-v-dced219e] {
  position: absolute;
  top: -1.7vw;
  right: -2vw;
  width: 4.4vw;
}
.playBtn[data-v-dced219e] {
  width: 15.47vw;
  height: 4.43vw;
}
.next[data-v-dced219e] {
  width: 4vw;
  transition: all 0.5s;
}
.divider[data-v-dced219e] {
  position: absolute;
  z-index: 1;
  bottom: -5vw;
  width: 100%;
}
.socialPart[data-v-dced219e] {
  position: absolute;
  top: 50%;
  right: 15px;
  display: flex;
  flex-direction: column;
  padding: 5px;
  border-radius: 40px;
  background-color: rgba(0, 0, 0, 0.5);
  transform: translateY(-50%);
}
.icon[data-v-dced219e] {
  display: block;
  width: 2.5vw;
  margin: 8px 0;
}
.icon > img[data-v-dced219e] {
  width: 100%;
}

.heroPart[data-v-4bf509ea] {
  position: relative;
  width: 100%;
  height: 62vw;
  opacity: 0.2;
  transform: scale(1.1);
  transition: all 0.8s ease;
}
.heroPart.fadeIn[data-v-4bf509ea] {
  opacity: 1;
  transform: scale(1);
}
.heroPart.en_EN .heroTitle[data-v-4bf509ea] {
  font-family: en, sans-serif;
}
.heroItem[data-v-4bf509ea] {
  position: absolute;
  top: 0;
  overflow: hidden;
  width: 100%;
  height: 100%;
}
.heroItem .heroBg[data-v-4bf509ea] {
  position: absolute;
  top: 0;
  width: 100%;
}
.heroItem .heroImg[data-v-4bf509ea] {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
}
.heroItem .heroEffect[data-v-4bf509ea] {
  position: absolute;
  top: 0;
  width: 100%;
}
.heroItem1 .heroImg[data-v-4bf509ea] {
  top: 0;
  right: 1.8%;
  width: 70%;
}
.heroItem2 .heroImg[data-v-4bf509ea] {
  top: 3%;
  right: 0;
  width: 70%;
}
.heroItem3 .heroEffect[data-v-4bf509ea] {
  top: 14vw;
  right: 17.5vw;
  width: 24.5vw;
}
.heroItem4 .heroImg[data-v-4bf509ea] {
  top: 0;
  right: 0;
  width: 60%;
}
.heroItem6 .heroEffect[data-v-4bf509ea] {
  top: 17vw;
  width: 95vw;
}
.heroTitle[data-v-4bf509ea] {
  position: absolute;
  top: 7.4vw;
  left: 9vw;
  padding-left: 0.3vw;
  color: #fff;
  font-size: 2.2vw;
}
.titleBg[data-v-4bf509ea] {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  height: 90%;
  margin: auto;
}
.titleText[data-v-4bf509ea] {
  position: relative;
}
.heroText[data-v-4bf509ea] {
  position: absolute;
  top: 12vw;
  left: 9vw;
  display: flex;
  width: 25vw;
  flex-direction: column;
  color: #c8eaed;
}
.heroText .heroName[data-v-4bf509ea] {
  font-size: 3.1vw;
}
.heroText .heroDescription[data-v-4bf509ea] {
  margin-top: 0.5vw;
  font-size: 1.1vw;
}
.videoBtn[data-v-4bf509ea] {
  position: absolute;
  top: 35vw;
  left: 9vw;
  display: flex;
  width: 10vw;
  height: 5vw;
  align-items: center;
  justify-content: center;
  border: 2px solid #fff;
  border-radius: 15px;
  background-position: center;
  background-size: 100% 120%;
  cursor: pointer;
}
.playBtn[data-v-4bf509ea] {
  width: 1.2vw;
}
.videoContainer[data-v-4bf509ea] {
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.videoContainer .videoPlayer[data-v-4bf509ea] {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 70vw;
  aspect-ratio: 1.77;
  background-color: #000;
  transform: translate(-50%, -50%);
}
.videoContainer .videoMask[data-v-4bf509ea] {
  width: 100%;
  height: 100%;
  background-color: black;
  opacity: 0.7;
}
.avatarList[data-v-4bf509ea] {
  position: absolute;
  top: 44vw;
  left: 9vw;
  display: flex;
  width: 100%;
}
.avatarList .heroIcon[data-v-4bf509ea] {
  position: relative;
  z-index: 1;
  width: 6.3vw;
  height: 6.3vw;
  flex: none;
  border: 0.25vw solid #adadad;
  border-radius: 20px 0;
  margin-right: 1vw;
  cursor: pointer;
  filter: grayscale(100%);
  transition: all 0.5s;
}
.avatarList .heroIcon.active[data-v-4bf509ea] {
  border-image: url(https://yottacdn.akamaized.net/carolpfres/common/assets/frontend/game_home/alliance/home/assets/avatar_border.21b9abfe.png) 27 / 20px;
  filter: none;
}
.avatarList .heroIcon[data-v-4bf509ea]:hover {
  border-color: transparent;
  filter: none;
}
.viewMore[data-v-4bf509ea] {
  display: flex;
  width: 14.5vw;
  height: 3.5vw;
  align-items: center;
  justify-content: center;
  border: 0.25vw solid #fff;
  border-radius: 1.04vw 0;
  margin-left: 18vw;
  background: #000;
  border-image: url(https://yottacdn.akamaized.net/carolpfres/common/assets/frontend/game_home/alliance/home/assets/avatar_border.21b9abfe.png) 27 / 1.04vw;
  color: #fff;
  cursor: pointer;
  font-size: 1.4vw;
}
.fadeLTR-enter-active[data-v-4bf509ea],
.fade-enter-active[data-v-4bf509ea] {
  transition: all 0.5s ease-out;
}
.fadeLTR-enter-active .heroImg[data-v-4bf509ea],
.fade-enter-active .heroImg[data-v-4bf509ea] {
  transition: all 0.5s ease-out;
}
.fadeLTR-enter-active .heroText .heroName[data-v-4bf509ea],
.fade-enter-active .heroText .heroName[data-v-4bf509ea] {
  transition: all 0.4s ease-out;
}
.fadeLTR-enter-active .heroText .heroDescription[data-v-4bf509ea],
.fade-enter-active .heroText .heroDescription[data-v-4bf509ea] {
  transition: all 0.5s ease-out;
}
.fadeLTR-leave-active[data-v-4bf509ea],
.fade-leave-active[data-v-4bf509ea] {
  transition: all 0.2s ease-out;
}
.fadeLTR-leave-active .heroImg[data-v-4bf509ea],
.fade-leave-active .heroImg[data-v-4bf509ea] {
  transition: all 0.2s ease-out;
}
.fadeLTR-leave-active .heroText[data-v-4bf509ea],
.fade-leave-active .heroText[data-v-4bf509ea] {
  transition: all 0.2s ease-out;
}
.fadeLTR-enter-from[data-v-4bf509ea],
.fadeLTR-leave-to[data-v-4bf509ea],
.fade-enter-from[data-v-4bf509ea],
.fade-leave-to[data-v-4bf509ea] {
  opacity: 0;
}
.fade-enter-from .heroImg[data-v-4bf509ea] {
  transform: translateX(-10vw);
}
.fade-enter-from .heroText .heroName[data-v-4bf509ea] {
  transform: translateX(-5vw);
}
.fade-enter-from .heroText .heroDescription[data-v-4bf509ea] {
  transform: translateX(-7vw);
}
.fadeLTR-enter-from .heroImg[data-v-4bf509ea] {
  transform: translateX(10vw);
}
.fadeLTR-enter-from .heroText .heroName[data-v-4bf509ea] {
  transform: translateX(5vw);
}
.fadeLTR-enter-from .heroText .heroDescription[data-v-4bf509ea] {
  transform: translateX(7vw);
}
.fade-leave-to .heroText[data-v-4bf509ea] {
  transform: translateX(5vw);
}
.fade-leave-to .heroImg[data-v-4bf509ea] {
  transform: translateX(15vw);
}
.fadeLTR-leave-to .heroText[data-v-4bf509ea] {
  transform: translateX(-5vw);
}
.fadeLTR-leave-to .heroImg[data-v-4bf509ea] {
  transform: translateX(-15vw);
}

.regionMain[data-v-1e56c016] {
  display: flex;
  min-height: 100vh;
  padding: 150px;
  background: #fff;
}
.regionMain .left[data-v-1e56c016] {
  width: 70%;
  margin-right: 80px;
}
.regionMain .left .title[data-v-1e56c016] {
  margin-top: 30px;
  font-size: 30px;
  font-weight: bold;
  text-align: center;
}
.regionMain .left .divider[data-v-1e56c016] {
  height: 14px;
  margin-bottom: 30px;
  border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABGYAAAAOAgMAAAAQz/JEAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURUdwTL6+vsDAwL+/v0AXin0AAAADdFJOUwCCVejCm2wAAABWSURBVEjHY2AYRICVYRTgAPIOo2GAA9RfGA0D7IDx15fRQMAO2B/sHQ0EHEVNg/6gKmz+Dx7wj4F7ELnmw2jQ4A6a0Qw1WgyPVt6jTb7RjsIoGJTdSwBHjDqNDKXb8AAAAABJRU5ErkJggg==) 0 557 fill / 0 calc(50% - 6px) stretch;
}
.regionMain .left .content[data-v-1e56c016] {
  margin-bottom: 60px;
  font-size: 22px;
  white-space: pre-line;
}
.regionMain .right[data-v-1e56c016] {
  width: 32%;
}
.regionMain .right .name[data-v-1e56c016] {
  margin-bottom: 30px;
  font-size: 60px;
}
.regionMain .right .logo[data-v-1e56c016] {
  width: 130px;
  background: #000;
}
.regionMain .right .divider[data-v-1e56c016] {
  height: 10px;
  margin: 30px 0;
  border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAKAgMAAADTB3b7AAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURb6+vra2tkdwTL+/v5F61xcAAAADdFJOU7cHAHUmuowAAAA1SURBVAjXY1gVtWrV0lUMK9lWrZqQxbDk46pV/lIMk/9krbQ/xuD/Hwg+wiioIFQJVANEOwApCiWzKn+N2QAAAABJRU5ErkJggg==) 0 10 0 10 fill / 0 10px stretch;
}
.regionMain .right .row[data-v-1e56c016] {
  display: flex;
  font-size: 22px;
}
.regionMain .right .row .title[data-v-1e56c016] {
  width: 150px;
  flex: none;
  margin-right: 10px;
  font-weight: bold;
}
.regionMain .right .row .content[data-v-1e56c016] {
  min-width: 0;
  flex: auto;
  white-space: pre-line;
}
.raceName[data-v-1e56c016] {
  display: flex;
  width: 100%;
  height: 370px;
  box-sizing: border-box;
  align-items: flex-end;
  padding: 20px;
  background: top center / cover var(--4f0bc1c7);
  color: #fefefe;
  font-size: 60px;
}
.rightPart:last-child .divider[data-v-1e56c016] {
  display: none;
}

.raceMain[data-v-c7df48b4] {
  position: relative;
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  align-items: center;
  padding: 150px;
  background: #fff;
}
.title[data-v-c7df48b4] {
  margin-bottom: 20px;
  font-size: 90px;
  font-weight: bold;
}
.en_EN .title[data-v-c7df48b4] {
  font-family: en, sans-serif;
}
.subTitle[data-v-c7df48b4] {
  font-size: 26px;
  text-align: center;
  white-space: pre-line;
}
.raceList[data-v-c7df48b4] {
  display: grid;
  width: 1400px;
  max-width: 90vw;
  padding: 60px 0;
  grid-gap: 50px 60px;
  grid-template-columns: 1fr 1fr;
}
.raceItem[data-v-c7df48b4] {
  position: relative;
  cursor: pointer;
  outline: solid 5px rgba(0 0 0/0%);
  outline-offset: 5px;
  transition: all 0.5s;
}
.raceItem[data-v-c7df48b4]:hover {
  outline: solid 5px #ffd36e;
}
.raceItem:hover .hoverImg[data-v-c7df48b4] {
  opacity: 1;
}
.raceItem .raceImg[data-v-c7df48b4] {
  display: block;
  width: 100%;
  height: 200px;
  object-fit: cover;
}
.raceItem .raceName[data-v-c7df48b4] {
  position: absolute;
  bottom: 6px;
  left: 10px;
  color: #fff;
  font-size: 36px;
  line-height: 100%;
}
.raceItem .hoverImg[data-v-c7df48b4] {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 46px;
  opacity: 0;
  pointer-events: none;
  transition: all 0.5s;
}

.regionMain[data-v-783f11da] {
  display: flex;
  min-height: 100vh;
  padding: 150px;
  background: #fff;
}
.regionMain .left[data-v-783f11da] {
  width: 70%;
  margin-right: 80px;
}
.regionMain .left .title[data-v-783f11da] {
  font-size: 30px;
  font-weight: bold;
  text-align: center;
}
.regionMain .left .divider[data-v-783f11da] {
  height: 14px;
  margin-bottom: 30px;
  border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABGYAAAAOAgMAAAAQz/JEAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURUdwTL6+vsDAwL+/v0AXin0AAAADdFJOUwCCVejCm2wAAABWSURBVEjHY2AYRICVYRTgAPIOo2GAA9RfGA0D7IDx15fRQMAO2B/sHQ0EHEVNg/6gKmz+Dx7wj4F7ELnmw2jQ4A6a0Qw1WgyPVt6jTb7RjsIoGJTdSwBHjDqNDKXb8AAAAABJRU5ErkJggg==) 0 557 fill / 0 calc(50% - 6px) stretch;
}
.regionMain .left .content[data-v-783f11da] {
  margin-bottom: 60px;
  font-size: 22px;
}
.regionMain .right[data-v-783f11da] {
  width: 35%;
}
.regionMain .right .name[data-v-783f11da] {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
  font-size: 60px;
}
.regionMain .right .logo[data-v-783f11da] {
  width: 80px;
  margin-right: 10px;
  background: #000;
}
.regionMain .right .divider[data-v-783f11da] {
  height: 10px;
  margin: 30px 0;
  border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAKAgMAAADTB3b7AAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURb6+vra2tkdwTL+/v5F61xcAAAADdFJOU7cHAHUmuowAAAA1SURBVAjXY1gVtWrV0lUMK9lWrZqQxbDk46pV/lIMk/9krbQ/xuD/Hwg+wiioIFQJVANEOwApCiWzKn+N2QAAAABJRU5ErkJggg==) 0 10 0 10 fill / 0 10px stretch;
}
.regionMain .right .row[data-v-783f11da] {
  display: flex;
  font-size: 22px;
}
.regionMain .right .row .title[data-v-783f11da] {
  width: 150px;
  flex: none;
  margin-right: 20px;
  font-weight: bold;
}
.regionMain .right .row .content[data-v-783f11da] {
  min-width: 0;
  flex: auto;
  white-space: pre-line;
}
.regionHeros[data-v-783f11da] {
  display: flex;
  margin-top: 10px;
}
.regionHeros .more[data-v-783f11da],
.regionHeros img[data-v-783f11da] {
  width: 68px;
  height: 68px;
  flex: none;
  margin-right: 10px;
}
.regionHeros .more[data-v-783f11da] {
  box-sizing: border-box;
  padding: 3px;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAABEAQMAAAAC3QHxAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAGUExURQAAAGVlZc4pujEAAAABdFJOU8zSNFb9AAAAHUlEQVQoz2P4DwUfGBCsAwwQYDDKGmUNAAtLmgQAm4lfoeIKl8gAAAAASUVORK5CYII=) no-repeat center / contain;
  color: #fcfcfc;
  font-size: 22px;
  text-align: center;
}

.regionItem[data-v-68ea9786] {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #f5eed9;
}
.regionIcon[data-v-68ea9786] {
  position: relative;
  z-index: 1;
  display: block;
  width: 3.75vw;
  height: 3.75vw;
  box-sizing: border-box;
  cursor: pointer;
}
.regionName[data-v-68ea9786] {
  margin-top: 0.3vw;
  font-size: 1.04vw;
  opacity: 0;
  text-shadow: 0 0.1vw 0.1vw rgba(0, 0, 0, 0.8);
  transform: translateX(-2vw);
  transition: all 0.5s;
}
.hoverBg[data-v-68ea9786] {
  position: absolute;
  top: 0.08vw;
  left: 0;
  width: 3.75vw;
  height: 3.75vw;
  border-radius: 1.87vw;
  background: #fcd257;
  opacity: 0;
  transition: all 0.5s;
}
.hoverBg.active[data-v-68ea9786] {
  opacity: 1;
}
.regionDes[data-v-68ea9786] {
  position: absolute;
  display: flex;
  width: 27.92vw;
  height: 10.94vw;
  box-sizing: border-box;
  flex-direction: column;
  padding: 1.67vw 2.4vw 1.67vw 1.67vw;
  background: center / contain no-repeat url(https://yottacdn.akamaized.net/carolpfres/common/assets/frontend/game_home/alliance/home/assets/img_area_details.8e705e9c.png);
  color: #fcfcfc;
  opacity: 0;
  pointer-events: none;
  transition: all 0.5s;
}
.regionDes.right[data-v-68ea9786] {
  padding: 1.67vw 1.67vw 1.67vw 2.4vw;
  background: center / contain no-repeat url(https://yottacdn.akamaized.net/carolpfres/common/assets/frontend/game_home/alliance/home/assets/img_area_details_2.3990e5db.png);
}
.regionDes.active[data-v-68ea9786] {
  opacity: 1;
  pointer-events: visible;
}
.regionDes .text1[data-v-68ea9786] {
  margin-bottom: 0.4vw;
  font-size: 1.68vw;
  font-weight: bold;
  line-height: 100%;
}
.regionDes .text2[data-v-68ea9786] {
  font-size: 1.05vw;
  line-height: 100%;
}
.regionDes .regionHeros[data-v-68ea9786] {
  display: flex;
}
.regionDes .regionHeros > a[data-v-68ea9786] {
  width: 3.24vw;
  height: 3.24vw;
  flex: none;
  margin-right: 0.5vw;
}
.regionDes .regionHeros .more[data-v-68ea9786],
.regionDes .regionHeros img[data-v-68ea9786] {
  width: 100%;
  height: 100%;
  flex: none;
}
.regionDes .regionHeros .more[data-v-68ea9786] {
  box-sizing: border-box;
  padding: 0.2vw;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAABEAQMAAAAC3QHxAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAGUExURQAAAGVlZc4pujEAAAABdFJOU8zSNFb9AAAAHUlEQVQoz2P4DwUfGBCsAwwQYDDKGmUNAAtLmgQAm4lfoeIKl8gAAAAASUVORK5CYII=) no-repeat center / contain;
  color: #fcfcfc;
  font-size: 1.15vw;
  text-align: center;
}
.iconElement[data-v-68ea9786] {
  position: relative;
  opacity: 0;
  transition: all 0.5s;
}
@keyframes region-fadeIn-68ea9786 {
from {
    opacity: 0.2;
    transform: scale(1.1);
}
to {
    opacity: 1;
    transform: scale(1);
}
}

.regionMain[data-v-df0c3d12] {
  position: relative;
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  align-items: center;
  padding: 150px 0;
  background: #fff;
}
.title[data-v-df0c3d12] {
  margin-bottom: 20px;
  font-size: 90px;
  font-weight: bold;
}
.en_EN .title[data-v-df0c3d12] {
  font-family: en, sans-serif;
}
.subTitle[data-v-df0c3d12] {
  font-size: 26px;
  text-align: center;
  white-space: pre-line;
}
.hiddenBox[data-v-df0c3d12] {
  overflow: hidden;
  width: 100%;
  height: 56.25vw;
  margin-top: 60px;
}
.region[data-v-df0c3d12] {
  position: relative;
  width: 100%;
  height: 56.25vw;
  background: center / cover url(https://yottacdn.akamaized.net/carolpfres/common/assets/frontend/game_home/alliance/home/assets/bg_area_worldmap.164096eb.png);
  transform: scale(1.1);
  transition: all 0.6s;
}
.region.fadeIn[data-v-df0c3d12] {
  transform: scale(1);
}
.fadeIn[data-v-df0c3d12] .iconElement {
  opacity: 1;
  transition: all 0.5s 1s;
}
.fadeIn[data-v-df0c3d12] .regionName {
  opacity: 1;
  transform: unset;
  transition: all 0.5s 1s;
}
.fadeIn .RegionTitle[data-v-df0c3d12] {
  opacity: 0;
  text-align: center;
  transition: all 0.5s 0.5s;
}
.fadeIn[data-v-df0c3d12] .cloudLayer {
  animation-play-state: running;
}
[data-v-df0c3d12] .cloudLayer {
  animation-play-state: paused;
}
.RegionTitle[data-v-df0c3d12] {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  width: 35.89vw;
  flex-direction: column;
  align-items: center;
  color: #fff;
  opacity: 1;
  text-align: center;
  transform: translate(-50%, -50%);
  transition: all 0.5s;
}
.RegionTitle .text1[data-v-df0c3d12] {
  font-size: 4.69vw;
  font-weight: bold;
}
.RegionTitle .text2[data-v-df0c3d12] {
  font-size: 2.08vw;
}
.RegionTitle .divider[data-v-df0c3d12] {
  width: 35.89vw;
}
@keyframes fly-df0c3d12 {
from {
    transform: translateX(-50%);
}
to {
    transform: translateX(0);
}
}

.fadeInActive .heroBg[data-v-726b9438] {
  transform: scale(1);
}
.fadeInActive .heroBg[data-v-726b9438]::after {
  background: rgba(0 0 0 / 40%);
}
.fadeInActive .content[data-v-726b9438] {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}
.fadeInActive .heroSelect[data-v-726b9438] {
  width: 14.95vw;
}
.main[data-v-726b9438] {
  position: relative;
  height: 67.71vw;
}
.heroBg[data-v-726b9438] {
  position: absolute;
  width: 100%;
  height: 100%;
  background: center / cover var(--10e2eccd) no-repeat;
  transform: scale(1.2);
  transition: all 0.5s;
}
@supports not (backdrop-filter: blur(40px)) {
.heroBg[data-v-726b9438] {
    filter: blur(40px);
}
}
@supports (backdrop-filter: blur(40px)) {
.heroBg[data-v-726b9438]::after {
    backdrop-filter: blur(40px);
}
}
.heroBg[data-v-726b9438]::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: '';
  transition: all 0.5s;
}
.content[data-v-726b9438] {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  width: 86.46vw;
  height: 56.25vw;
  box-sizing: border-box;
  padding-top: 6vw;
  border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEYAAABGAgMAAAAMQAoXAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURUdwTJ2dnaCgoJ+fn06AvzEAAAAEdFJOUwBmM1UQoxFDAAAAp0lEQVQ4y83Muw1CQQwF0ZXIryjHISWQrPTKoVRK4e3f9jTAhCeYUutVUq8i0uMDKl+SkUTKs5vyrJGRREqzRmnWyUgixVmnOBtkJJHCbFCYTTKSSH42yc8WGUkkN1vkZpuMJNKZbTqzQ0YSac8O7ZkjI4m0Zo7WzJORRJozT3MWyEgijVmgMYtkJJH6LFKfJTKSSG2WqM0yGUmke5bpnoGef0s19/4Bv6gxN+EGqqYAAAAASUVORK5CYII=) 68 68 1 1/3.39vw 3.39vw 1px 1px;
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.9);
  transition: all 0.5s 0.3s;
}
.content > .right[data-v-726b9438] {
  display: flex;
  width: 19.38vw;
  flex-direction: column;
  align-items: center;
  margin-left: 3.3vw;
  color: #fff;
}
.content > .right .regionTitle[data-v-726b9438] {
  font-size: 1.04vw;
  text-align: center;
}
.content > .right .divider[data-v-726b9438] {
  width: 100%;
  height: 0.52vw;
  align-self: center;
  border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAKAgMAAADTB3b7AAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURb6+vra2tkdwTL+/v5F61xcAAAADdFJOU7cHAHUmuowAAAA1SURBVAjXY1gVtWrV0lUMK9lWrZqQxbDk46pV/lIMk/9krbQ/xuD/Hwg+wiioIFQJVANEOwApCiWzKn+N2QAAAABJRU5ErkJggg==) 0 10 0 10 fill / 0 0.52vw 0;
}
.left[data-v-726b9438] {
  display: flex;
  width: 20.3vw;
  height: 100%;
  flex-direction: column;
  margin-right: 1vw;
  margin-left: 3.8vw;
  color: #fff;
}
.left .heroName[data-v-726b9438] {
  font-size: 3.13vw;
  text-align: center;
}
.left .title[data-v-726b9438] {
  font-size: 1.15vw;
  text-align: center;
}
.left .divider[data-v-726b9438] {
  width: 105%;
  height: 0.52vw;
  align-self: center;
  border-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAKAgMAAADTB3b7AAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURb6+vra2tkdwTL+/v5F61xcAAAADdFJOU7cHAHUmuowAAAA1SURBVAjXY1gVtWrV0lUMK9lWrZqQxbDk46pV/lIMk/9krbQ/xuD/Hwg+wiioIFQJVANEOwApCiWzKn+N2QAAAABJRU5ErkJggg==) 0 10 0 10 fill / 0 0.52vw 0;
}
.left .heroDesc[data-v-726b9438] {
  overflow: auto;
  height: 5.31vw;
  margin-top: 1.2vw;
  font-size: 1.15vw;
  line-height: 1.77vw;
}
.left .viewMore[data-v-726b9438] {
  margin-top: 2vw;
  color: #ffd36e;
  cursor: pointer;
  font-size: 1.15vw;
  visibility: hidden;
}
.left .heroInfo[data-v-726b9438] {
  overflow: auto;
  height: 5.31vw;
  margin-top: 1.2vw;
  font-size: 1.15vw;
  line-height: 1.77vw;
  margin-top: 4vw;
}
.left .skillTitle[data-v-726b9438] {
  margin-top: 2vw;
  font-size: 1.56vw;
}
.left .skill[data-v-726b9438] {
  display: flex;
  margin-top: 2vw;
  margin-bottom: 1vw;
}
.left .skill > img[data-v-726b9438] {
  width: 3.59vw;
  height: 3.59vw;
  margin-right: 1vw;
  cursor: pointer;
  outline: rgba(0 0 0 / 0%) solid 0.2vw;
  outline-offset: 0.2vw;
  transition: all 0.5s, transform 0.5s;
}
.left .skill > img.active[data-v-726b9438] {
  outline: #ebb63d solid 0.2vw;
  outline-offset: 0.2vw;
  transform: translateY(-30%);
}
.left .skillName[data-v-726b9438] {
  margin-top: 1vw;
  font-size: 1.25vw;
}
.left .skillDesc[data-v-726b9438] {
  overflow: auto;
  height: 5.31vw;
  margin-top: 1.2vw;
  font-size: 1.15vw;
  line-height: 1.77vw;
  margin-top: 0;
  font-size: 1.04vw;
}
.centerImg[data-v-726b9438] {
  position: relative;
  width: 33.85vw;
  margin-bottom: 8vw;
}
.centerImg .bg1[data-v-726b9438],
.centerImg .main[data-v-726b9438],
.centerImg .wrapper[data-v-726b9438] {
  position: absolute;
}
.centerImg .bg1[data-v-726b9438] {
  top: 5%;
  width: 100%;
}
.centerImg .bg2[data-v-726b9438] {
  position: absolute;
  top: 0.5%;
  left: -6%;
  width: 112%;
  height: 99%;
  animation: rotate-orig-726b9438 8s infinite linear;
  transform: rotate(0deg);
  transform-origin: 50% 50%;
}
.centerImg .bg2 polygon[data-v-726b9438] {
  fill: none;
  stroke: #ebb63d;
  stroke-width: 0.1vw;
}
.centerImg .wrapper[data-v-726b9438] {
  left: 2%;
  width: 96%;
  height: 101%;
  animation: rotate-726b9438 8s infinite linear;
  clip-path: polygon(50% -20%, 120% 81%, -20% 81%);
  transform: rotate(0deg);
}
.centerImg .main[data-v-726b9438] {
  top: 5.4%;
  left: 2%;
  width: 96%;
  height: 90%;
  object-fit: cover;
}
.centerImg .right[data-v-726b9438] {
  display: flex;
  flex: auto;
  flex-direction: column;
  align-items: center;
}
@keyframes rotate-726b9438 {
from {
    transform: rotate(0deg);
}
to {
    transform: rotate(360deg);
}
}
@keyframes rotate-orig-726b9438 {
from {
    transform: rotate(0deg);
}
to {
    transform: rotate(-360deg);
}
}
.regionContainer[data-v-726b9438] {
  display: grid;
  align-content: center;
  justify-content: center;
  margin-top: 1.35vw;
  margin-bottom: 2.4vw;
  grid-gap: 1vw;
  grid-template-columns: repeat(3, 3.75vw);
}
.regionIcon[data-v-726b9438] {
  width: 100%;
  border-radius: 50%;
  cursor: pointer;
}
.regionIcon.select[data-v-726b9438] {
  outline: 0.2vw solid #ffd36e;
}
.regionRow[data-v-726b9438] {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.04vw;
}
.regionRow > img[data-v-726b9438] {
  height: 2.24vw;
}
.heroListContainer[data-v-726b9438] {
  position: relative;
  overflow: hidden;
  width: 100%;
  min-height: 0;
  flex: auto;
  margin-bottom: 7vw;
}
.heroSwiper[data-v-726b9438] {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 45vw;
}
.heroSlide[data-v-726b9438] {
  display: flex;
  height: 5vw;
  box-sizing: border-box;
  align-items: center;
  padding: 0.5vw 0 0.5vw 8.11vw;
  color: #fff;
  cursor: pointer;
  font-size: 1.04vw;
}
.heroSlide.swiper-slide-active > img[data-v-726b9438] {
  transform: translateX(-0.3vw);
}
.heroSlide > img[data-v-726b9438] {
  position: relative;
  width: 3.54vw;
  height: 3.96vw;
  margin-right: 1vw;
  object-fit: cover;
  transition: all 0.5s;
}
.heroSelect[data-v-726b9438] {
  position: absolute;
  z-index: 10;
  top: 24.38vw;
  right: 12.5vw;
  width: 0;
  height: 5vw;
  object-fit: cover;
  object-position: top right;
  pointer-events: none;
  transition: width 0.5s 0.7s;
}
.fade-enter-active[data-v-726b9438],
.fade-leave-active[data-v-726b9438] {
  transition: all 0.5s ease-in-out;
}
.fade-enter-from[data-v-726b9438],
.fade-leave-to[data-v-726b9438] {
  opacity: 0;
}

.heroMain[data-v-1dd68054] {
  position: relative;
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  align-items: center;
  padding: 150px;
  background: #fff;
}
.title[data-v-1dd68054] {
  position: relative;
  margin-bottom: 20px;
  font-size: 90px;
  font-weight: bold;
}
.en_EN .title[data-v-1dd68054] {
  font-family: en, sans-serif;
}
.subTitle[data-v-1dd68054] {
  position: relative;
  margin-bottom: 100px;
  font-size: 26px;
  white-space: pre-line;
}
.elementRow[data-v-1dd68054] {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
}
.elementName[data-v-1dd68054] {
  width: 5.2vw;
  align-items: center;
  font-size: 1.67vw;
}
.en_EN .elementName[data-v-1dd68054] {
  font-family: en, sans-serif;
}
.divider[data-v-1dd68054] {
  width: 0.15vw;
  height: 3.13vw;
  margin-right: 2.08vw;
  background: #9e9e9e;
}
.titanContainer[data-v-1dd68054] {
  position: relative;
  margin: 1vw;
}
.titanContainer .hoverTip[data-v-1dd68054],
.titanContainer .titanName[data-v-1dd68054] {
  opacity: 0;
  transition: opacity 0.5s;
}
.titanContainer:hover .hoverTip[data-v-1dd68054],
.titanContainer:hover .titanName[data-v-1dd68054] {
  opacity: 1;
}
.titanImg[data-v-1dd68054] {
  width: 7.66vw;
  height: 8.75vw;
  object-fit: cover;
}
.titanName[data-v-1dd68054] {
  position: absolute;
  top: 100%;
  left: 50%;
  margin-top: 0.55vw;
  color: #1c1c1c;
  font-size: 1.25vw;
  font-weight: bold;
  text-align: center;
  transform: translateX(-50%);
  white-space: nowrap;
}
.hoverTip[data-v-1dd68054] {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 120%;
  height: 122%;
  pointer-events: none;
  transform: translate(-50%, -50%);
}
.hoverTip polygon[data-v-1dd68054] {
  fill: none;
  stroke: #ebb63d;
  stroke-width: 3px;
}
.titanBg[data-v-1dd68054] {
  position: absolute;
  top: 80px;
  left: 0;
  width: calc(100% - 50px);
  height: 310px;
  background: 100%/100% 100% url(https://yottacdn.akamaized.net/carolpfres/common/assets/frontend/game_home/alliance/home/assets/img_bg_blue3.a16c7652.png) no-repeat;
}

* {
  padding: 0;
  margin: 0;
}
body::-webkit-scrollbar {
  display: none;
}
html {
  background: #000913;
  font-family: 'Microsoft YaHei', Roboto, 'PingFang SC', sans-serif;
}
html,
body,
#mainPage {
  width: 100%;
  overflow-x: hidden;
}
#mainPage {
  top: 0;
  left: 0;
  width: 100%;
  min-height: 100vh;
}
#toast-container {
  right: 0;
  left: 0;
  width: 80%;
  margin: auto;
  font-size: 0.4rem;
}
#toast-container > div {
  width: 100%;
}
a {
  text-decoration: none;
}
img {
  display: block;
  -webkit-touch-callout: none;
  -webkit-user-drag: none;
  /* stylelint-disable-next-line property-no-unknown */
  user-drag: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
@font-face {
  font-family: en;
  src: url(https://yottacdn.akamaized.net/carolpfres/common/assets/frontend/game_home/alliance/home/assets/en.0af6a1c6.ttf);
}