@font-face {
  font-family: "Jost-Black";
  src: url("/font/Jost-Black.ttf");
  font-optical-sizing: auto;
}
@font-face {
  font-family: "Jost-SemiBold";
  src: url("/font/Jost-SemiBold.ttf");
  font-optical-sizing: auto;
}
@font-face {
  font-family: "Jost-Bold";
  src: url("/font/Jost-Bold.ttf");
  font-optical-sizing: auto;
}
@font-face {
  font-family: "Jost-Regular";
  src: url("/font/Jost-Regular.ttf");
  font-optical-sizing: auto;
}
@media (max-width: 991px) {
  #main {
    background: url(../img/page-top.avif) center 20vw no-repeat, url(../img/page-bottom.avif) center bottom no-repeat;
    background-size: 100%;
  }
  #main .m-page-top {
    padding-bottom: 0;
    border: 0;
    padding-top: 0 !important;
  }
}

.member-border {
  -webkit-box-shadow: 0 0 2px 1px #000, inset 0 0 2px 1px #8f161f;
          box-shadow: 0 0 2px 1px #000, inset 0 0 2px 1px #8f161f;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff9af), color-stop(30%, #ffe1b2), color-stop(50%, #813817), to(#ffffdc));
  background: linear-gradient(to bottom, #fff9af, #ffe1b2 30%, #813817 50%, #ffffdc);
  padding: 0.17em 0.15em;
  margin-top: 90px;
  border-radius: 0.52em;
}
.member-border .c-page-three-nav li {
  -webkit-box-shadow: 0 -2px 1px 0 #430e94;
          box-shadow: 0 -2px 1px 0 #430e94;
}
@media (min-width: 992px) {
  .member-border {
    border-top-right-radius: 1.4em;
    border-top-left-radius: 1.4em;
  }
}
@media (max-width: 991px) {
  .member-border {
    width: calc(100% - 30px);
    margin-top: 20px;
  }
  .member-border .c-page-three-nav li {
    border-top-left-radius: 0.5em;
    border-top-right-radius: 0.5em;
  }
}

.m-panel {
  background-image: -webkit-gradient(linear, left top, left bottom, from(#c000ff), color-stop(50%, #6b0fc1), to(#560cb3));
  background-image: linear-gradient(#c000ff, #6b0fc1 50%, #560cb3 100%);
  border-radius: 0.5em;
}
.m-panel::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  display: block;
  left: 0;
  top: 0;
  background-color: #00000d;
  background-image: linear-gradient(135deg, #000189 25%, transparent 25%), linear-gradient(225deg, #000189 25%, transparent 25%), linear-gradient(45deg, #000189 25%, transparent 25%), linear-gradient(315deg, #000189 25%, #00000d 25%);
  background-position: 1.5em 0, 1.5em 0, 0 0, 0 0;
  background-size: 3em 3em;
  background-repeat: repeat;
  opacity: 0.16;
}
.character-panel {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  -webkit-box-shadow: inset 0 -2px 3px 2px #430e94;
          box-shadow: inset 0 -2px 3px 2px #430e94;
}
@media (min-width: 992px) {
  .character-panel {
    padding: 1.6em 1.3em 1em 1.3em;
  }
  .character-panel > div {
    font-size: 33px;
  }
  .character-panel .character-head {
    width: 40%;
    -ms-flex-line-pack: start;
        align-content: flex-start;
  }
  .character-panel .character-body {
    width: 60%;
  }
}
@media (max-width: 991px) {
  .character-panel > div {
    font-size: 0.7em;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .character-panel {
    padding: 40px 30px;
  }
  .character-panel > div {
    font-size: 28px;
  }
}
.character-panel i {
  width: 55px;
  height: 55px;
  font-style: normal;
  color: #d6b2b9;
  font-size: 0.85em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  left: 5px;
  top: 0;
  bottom: 0;
  margin: auto;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
@media (max-width: 991px) {
  .character-panel i {
    width: 1.6em;
    height: 1.6em;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.character-panel i.icon-level {
  background-image: url(../img/Member/icon-level.png);
}
.character-panel i.icon-rank {
  -webkit-transform: scale(1.3);
          transform: scale(1.3);
}
.character-panel i.icon-fire {
  background-image: url(../img/Member/icon-fire.png);
}
.character-panel i.icon-guide {
  background-image: url(../img/Member/icon-guide.png);
}
.character-panel i.icon-gold {
  background-image: url(../img/Member/icon-gold.png);
}
.character-panel i.icon-link {
  background-image: url(../img/Member/icon-link.png);
}
.character-panel i.icon-intro {
  background-image: url(../img/Member/icon-intro.png);
}
.character-panel i.icon-copper {
  background-image: url(../img/Member/icon-copper.png);
}
.character-panel i.icon-point {
  background-image: url(../img/Member/icon-point.png);
}
.character-panel i.icon-start {
  background-image: url(../img/Member/icon-start.png);
}

.sub-table {
  margin-top: 15px;
  width: 85%;
  margin-right: 15%;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(80%, #200840), to(#5b367c));
  background-image: linear-gradient(#200840 80%, #5b367c 100%);
}
@media (max-width: 991px) {
  .sub-table {
    margin: 0 auto 0.5em;
  }
}
.sub-table .panel-title {
  font-size: 0.8em;
  font-weight: normal;
  font-family: "Jost-Regular", sans-serif !important;
}
.sub-table .panel-title.border {
  border-top: 3px solid #f333ff;
}
@media (max-width: 991px) {
  .sub-table .panel-title {
    padding: 0.4em;
  }
}
.sub-table .panel-content {
  background-color: transparent;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
}
@media (max-width: 991px) {
  .sub-table .panel-content {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 3px;
  }
}
.sub-table .radius {
  border-radius: 0;
}
.sub-table i {
  width: 65px;
  height: 65px;
  position: relative;
  margin: 0;
}
@media (max-width: 991px) {
  .sub-table i {
    width: 2em;
    height: 2em;
  }
}
.sub-table .text {
  width: 60%;
  text-align: center;
}
@media (max-width: 991px) {
  .sub-table .text {
    padding-right: 10%;
  }
}

.character-head {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.character-head .tip-nickName {
  font-size: 0.85em;
  color: #d6b2b9;
  margin-bottom: 10px;
}
.character-head .nickName {
  color: #fff;
}
.character-head .row-uid {
  margin-top: 0.5em;
}
.character-head .row-uid .content {
  width: 65%;
  margin-left: 15px;
}
@media (max-width: 991px) {
  .character-head {
    width: calc(100% - 2.5em);
    margin: 20px auto 4px auto;
  }
  .character-head .bascData {
    width: 54%;
    padding-right: 10px;
  }
  .character-head .sub-table {
    width: 45%;
  }
  .character-head .tip-nickName {
    font-size: 1.2em;
  }
  .character-head .nickName {
    font-size: 0.89em;
  }
  .character-head .row-uid {
    margin-top: 1em;
  }
  .character-head .row-uid .title {
    margin-bottom: 10px;
  }
  .character-head .row-uid .content {
    margin-left: 0;
  }
}

.c-btn.btn-yellow {
  font-size: 30px;
  padding: 0.6em 2em;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media (max-width: 991px) {
  .c-btn.btn-yellow {
    font-size: 0.7em;
    height: 2.7em;
  }
}

#Character .btn-back {
  width: auto;
  margin: 2em auto 0;
}
@media (max-width: 991px) {
  #Character .btn-back {
    margin-top: 1em;
    margin-bottom: 1em;
  }
}

.cha-border {
  padding: 20px 10px;
  color: #fcf6f6;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #1f0742;
  -webkit-box-shadow: inset 0 0 5px #f333ff, 0 2px 2px #f333ff;
          box-shadow: inset 0 0 5px #f333ff, 0 2px 2px #f333ff;
  border-radius: 0.5em;
  position: relative;
  margin-bottom: 0.7em;
}
.cha-border:last-child {
  margin-bottom: 0;
}
.cha-border a {
  color: inherit;
  text-decoration: none;
}
@media (max-width: 991px) {
  .cha-border {
    width: calc(100% - 2.5em);
    margin-left: auto;
    margin-right: auto;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    padding-left: 2em;
  }
  .cha-border.noBG-lg {
    background: none;
    -webkit-box-shadow: none;
            box-shadow: none;
  }
}
@media (max-width: 576px) {
  .cha-border {
    padding: 10px 2.5em;
  }
}

#Redeem .page-wrapper {
  background: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
}
@media (min-width: 992px) {
  #Redeem .page-wrapper {
    padding: 70px 70px 60px 70px;
  }
}
@media (max-width: 991px) {
  #Redeem .page-wrapper {
    padding-left: 15px;
    padding-right: 15px;
    margin-top: 20px;
  }
}

.redeem-card {
  background: -webkit-gradient(linear, left top, left bottom, from(#47067a), to(#36096e));
  background: linear-gradient(#47067a, #36096e);
  border-radius: 0.4em;
  -webkit-box-shadow: inset 0 0 7px 1px #cd40cb;
          box-shadow: inset 0 0 7px 1px #cd40cb;
  overflow: hidden;
}
.redeem-card .m-head {
  font-size: 0.55em;
  color: #d6b2b9;
  margin: 2em 2em 0;
}
.redeem-card .m-head b {
  color: #fff;
  margin-top: 10px;
}
.redeem-card ul li {
  color: #d6b2b9;
  line-height: 1.5;
}
@media (min-width: 992px) {
  .redeem-card .m-body {
    padding: 1em 2em 0.8em 2em;
  }
  .redeem-card .m-body input {
    max-width: 500px;
    margin-bottom: 1.5em;
    font-size: 30px;
  }
  .redeem-card .m-body ul li {
    font-size: 0.4em;
  }
}
@media (max-width: 991px) {
  .redeem-card .m-head {
    font-size: 0.65em;
  }
  .redeem-card .m-head b {
    margin-top: 5px;
  }
  .redeem-card .m-body {
    padding: 20px 0.5em;
  }
  .redeem-card .m-body input {
    width: 80% !important;
    margin-bottom: 1em;
    padding: 0.6em;
  }
  .redeem-card .m-body ul {
    margin-left: 0.9em;
  }
  .redeem-card .m-body ul li {
    font-size: 0.6em;
  }
}

#btn-redeemCode {
  margin-top: 1.8em;
}
@media (max-width: 991px) {
  #btn-redeemCode {
    margin-top: 1em;
    margin-bottom: 0.5em;
  }
}
@media (max-width: 767px) {
  #btn-redeemCode {
    margin-bottom: 0;
  }
}/*# sourceMappingURL=member.css.map */