@media (max-width: 992px) {
  html {
    font-size: 20px;
  }
}
@media (max-width: 512px) {
  html {
    font-size: 10px;
  }
}
/*CSS Reset*/
body,
div,
ul,
ol,
li,
dl,
dt,
dd,
p,
h1,
h2,
h3,
h4,
h5,
h6,
form,
table,
tr,
td,
th,
button,
input,
select,
textarea {
  margin: 0;
  padding: 0;
}

.fs12 {
  font-size: 0.12rem;
}

.fs14 {
  font-size: 0.14rem;
}

.fs16 {
  font-size: 0.16rem;
}

.fs18 {
  font-size: 0.18rem;
}

.fs28 {
  font-size: 0.18rem !important;
}

.fs20 {
  font-size: 0.2rem;
}

.fs22 {
  font-size: 0.22rem;
}

.fs24 {
  font-size: 0.24rem;
}

.fs26 {
  font-size: 0.26rem;
}

.fs29 {
  font-size: 0.29rem;
}

.fs34 {
  font-size: 0.34rem;
}

.fs40 {
  font-size: 0.4rem;
}

.fs50 {
  font-size: 0.5rem;
}

.fs36 {
  font-size: 0.36rem;
}

.fs58 {
  font-size: 0.58rem;
}

.fs120 {
  font-size: 1.2rem;
}

img {
  display: block;
  border: none;
  vertical-align: middle;
}

ol,
ul {
  list-style: none;
}

button,
input,
select,
textarea {
  font-size: 100%;
  outline: none;
  -webkit-appearance: none;
}

input,
select,
textarea {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  border: 1px solid #ddd;
}

/*textarea{resize:none;}*/
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section {
  display: block;
  margin: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}

/*table td,table th{ border:1px solid #ddd;}*/
table th {
  font-weight: 500;
}

[role=button] {
  cursor: pointer;
}

@font-face {
  /*font-family: "SIYUAN";*/
  /*src: url("../../font/SourceHanSans-Regular.woff?t=1576415212818") format("woff");*/
  /* src: url('../../font/SOURCEHANSANSCN-REGULAR.eot?t=1576415212818'); !* IE9 *!
   src: url('../../font/SOURCEHANSANSCN-REGULAR.eot?t=1576415212818#iefix') format('embedded-opentype'), !* IE6-IE8 *!
   url('../../font/SOURCEHANSANSCN-REGULAR.woff?t=1576415212818') format('woff')*/
  /*src:*/
  /*url('../font/AKKURATPRO/AKKURATPRO-REGULAR_0.eot?#iefix') format('embedded-opentype'),*/
  /*url('../font/AKKURATPRO/AKKURATPRO-REGULAR_0.woff') format('woff'),*/
  /*url('../font/AKKURATPRO/AKKURATPRO-REGULAR_0.ttf') format('truetype');*/
}
html,
body {
  width: 100%;
  height: 100%;
  line-height: 1.15;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  font: 16px "Noto Sans SC", -apple-system,BlinkMacSystemFont, "Helvetica Neue","arial","sans-serif";
  color: #363636;
  margin: 0;
  padding: 0;
}

body {
  opacity: 0;
}

* {
  box-sizing: border-box;
}

a {
  text-decoration: none !important;
  outline: none !important;
}

a:hover {
  text-decoration: none !important;
  color: #4a4a4a;
}

:after,
:before,
*::before,
*::after {
  box-sizing: border-box;
}

/*box setting*/
.w {
  width: 100%;
}

.h {
  height: 100%;
}

.db {
  display: block;
}

.dl {
  display: inline-block;
}

.hide {
  display: none;
}

.hidden {
  visibility: hidden;
}

/*clear and float*/
.clear::after,
.row::after {
  content: "";
  display: table;
  clear: both;
}

.fl {
  float: left;
}

.fr {
  float: right;
}

/*cursor*/
.cursor {
  cursor: pointer;
}

/*font*/
.fs12 {
  font-size: 0.12rem;
}

.fs14 {
  font-size: 0.14rem;
}

.fs16 {
  font-size: 0.16rem;
}

.fs18 {
  font-size: 0.18rem;
}

.fs20 {
  font-size: 0.2rem;
}

.fs22 {
  font-size: 0.22rem;
}

.fs24 {
  font-size: 0.24rem;
}

.fs26 {
  font-size: 0.26rem;
}

.fs50 {
  font-size: 0.5rem;
}

.fs36 {
  font-size: 0.36rem;
}

.fs58 {
  font-size: 0.58rem;
}

.fs120 {
  font-size: 1.2rem;
}

/*position*/
.pr {
  position: relative;
}

.pa {
  position: absolute;
}

.pf {
  position: fixed;
}

.w_100 {
  width: 100%;
}

.h_100 {
  height: 100%;
}

/*text setting*/
.giveMeEllipsis {
  display: block;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.t-left {
  text-align: left;
}

.t-center {
  text-align: center;
}

.t-right {
  text-align: right;
}

.t-normal {
  font-weight: normal;
}

.t-weight {
  font-weight: 700;
}

.t-weightM {
  font-weight: 400;
}

.t-italic {
  font-style: italic;
}

.t-transformD {
  text-transform: uppercase;
}

.t-transformX {
  text-transform: lowercase;
}

.t-transformXD {
  text-transform: capitalize;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  background-color: #F5F5F5;
}

::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: #F5F5F5;
}

::-webkit-scrollbar-thumb {
  border-radius: 8px;
  background-color: #bfc3c6;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  background-color: #F5F5F5;
}

::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: #F5F5F5;
}

::-webkit-scrollbar-thumb {
  border-radius: 8px;
  background-color: #bfc3c6;
}

.content-box {
  width: 100%;
}

.content-item {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}
.nothing {
  width: 100%;
  height: 415px;
  color: #414856;
  font-size: 24px;
  line-height: 2;
  text-align: center;
  padding-top: 89px;
}
.nothing .nothing-img {
  width: 216px;
  height: 178px;
  background: url('../image/nothing.png');
  background-size: 100% 100%;
  margin: auto;
  margin-bottom: 10px;
}
.color-keyword-hl {
  color: #e94730;
}
@keyframes a-fadeIn-bottom-2 {
  from {
    opacity: 0;
    transform: translateY(30%);
  }
  to {
    opacity: 1;
    transform: translateY(-50%);
  }
}
@keyframes scrollAniUp {
  from {
    transform: translateY(30%);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes scrollAniDown {
  from {
    transform: translateY(-30%);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes scrollAniRight {
  from {
    transform: translateX(30%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes scrollAniLeft {
  from {
    transform: translateX(-30%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes scrollAniShow {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.scroll-ani-up {
  opacity: 0;
}
.scroll-ani-up.scroll-active {
  animation: scrollAniUp 0.6s linear forwards;
}

.scroll-ani-down {
  opacity: 0;
}
.scroll-ani-down.scroll-active {
  animation: scrollAniDown 0.6s linear forwards;
}

.scroll-ani-right {
  opacity: 0;
}
.scroll-ani-right.scroll-active {
  animation: scrollAniRight 0.6s linear forwards;
}

.scroll-ani-left {
  opacity: 0;
}
.scroll-ani-left.scroll-active {
  animation: scrollAniLeft 0.6s linear forwards;
}

.scroll-ani-show {
  opacity: 0;
}
.scroll-ani-show.scroll-active {
  animation: scrollAniShow 0.6s linear forwards;
}

@media (max-width: 992px) {
  html {
    -webkit-overflow-scrolling: auto;
  }

  body {
    position: relative;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    opacity: 1;
  }
  body.lock {
    overflow: hidden;
  }
  .mainCont .box-banner .box-text .banner-title::after {
    display: none;
  }
  .nothing {
    height: 20.75rem;
    font-size: 1.2rem;
    padding-top: 4.45rem;
  }
  .nothing .nothing-img {
    width: 10.8rem;
    height: 8.9rem;
    background: url("../image/nothing.png");
    background-size: 100% 100%;
    margin: auto;
  }
}
@media (max-width: 768px) {
  ::-webkit-scrollbar {
    width: 0rem;
    height: 0.2rem;
    background-color: #F5F5F5;
  }

  ::-webkit-scrollbar-track {
    border-radius: 0.2rem;
    background-color: #F5F5F5;
  }

  ::-webkit-scrollbar-thumb {
    border-radius: 0.2rem;
    background-color: #bfc3c6;
  }
}
@media (min-width: 576px) {
  .content-item {
    max-width: 100%;
  }
  #nb_invite_wrap,#nb_icon_wrap{
    display: none;
  }
}
@media (min-width: 992px) {
  .content-item {
    max-width: 100%;
  }
  .containerBox .mainCont .box-banner {
    position: relative;
    height: 420px;
    background: -moz-linear-gradient(left, #171924, #141C33);
    background: -webkit-linear-gradient(left, #171924, #141C33);
    background: -o-linear-gradient(left, #171924, #141C33);
    background: -ms-linear-gradient(left, #171924, #141C33);
    background: linear-gradient(to right, #171924, #141C33);
    display: block;
    overflow: hidden;
  }
  .containerBox .mainCont .box-banner.ty500 {
    height: 500px;
  }
  /* .containerBox .mainCont .box-banner.ty500 .box-text {
    top: 168px;
    bottom: 128px;
  } */
  .containerBox .mainCont .box-banner.tybutton .box-text::after {
    display: none;
  }
  .containerBox .mainCont .box-banner img {
    left: 50%;
    transform: translateX(-50%);
    top: 0;
  }
  .containerBox .mainCont .box-banner img.img-banner {
    display: block;
  }
  .containerBox .mainCont .box-banner img.img-banner-m {
    display: none;
  }
  .containerBox .mainCont .box-banner .box-text {
    display: block;
    position: absolute;
    /* top: 148px;
    bottom: 88px; */
    top: 56%;
    transform: translateY(-50%);
    line-height: 1;
    left: 0;
    right: 0;
    margin: 0 auto;
    animation: a-fadeIn-bottom-2 1s ease-in-out forwards;
  }
  .containerBox .mainCont .box-banner .box-text::after {
    content: "";
    position: absolute;
    width: 78px;
    height: 4px;
    background-color: #ffffff;
    margin-top: 0;
    bottom: 0;
    left: 0;
    transform: translateX(0);
    display: none;
  }
  .containerBox .mainCont .box-banner .box-text .banner-title {
    font-size: 48px;
    color: #fff;
    margin-bottom: 28px;
    text-align: left;
  }
  .containerBox .mainCont .box-banner .box-text .banner-subTitle {
    font-size: 24px;
    color: rgba(223, 236, 255, 0.6);
  }
  .containerBox .mainCont .box-banner .box-text .banner-subTitle p {
    display: inline-block;
    text-align: center;
  }
}
@media (min-width: 1200px) {
  .content-item {
    max-width: 1200px;
  }
}

#nb_invite_wrap{
  min-height: 100px!important;
}
#nb_icon_wrap{
  transform: scale(0.5)!important;
  transform-origin: 100% 50%;
}
