@charset "UTF-8";
html { overflow-y: scroll; }

body, div, p, span, a, img, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, table, thead, tbody, tr, td, th { padding: 0; margin: 0; }

body, button, input, select, textarea { /* for ie */ font: 12px/1 "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; /* 用 ascii 字符表示，使得在任何编码下都无问题 */ background: transparent; }

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

input::-ms-input-placeholder { color: #c2c2c2; }

input::-webkit-input-placeholder { /* webkit 浏览器*/ color: #c2c2c2; }

input::-moz-placeholder { /* 火狐浏览器 */ color: #c2c2c2; }

textarea::-ms-input-placeholder { color: #c2c2c2; }

textarea::-webkit-input-placeholder { /* webkit 浏览器*/ color: #c2c2c2; }

textarea::-moz-placeholder { /* 火狐浏览器 */ color: #c2c2c2; }

/*  设置input placeholder 样式 */
select { appearance: none; -moz-appearance: none; -webkit-appearance: none; cursor: pointer; }

select::-ms-expand { display: none; }

/*将默认的select选择框样式清除*/
h1, h2, h3, h4, h5, h6 { font-weight: normal; }

em, i { font-style: normal; }

ul, ol { list-style: none; }

a { text-decoration: none; outline: none; color: #7f7f7f; }

a:visited { text-decoration: none; outline: none; }

a:hover { text-decoration: none; outline: none; }

a:active { text-decoration: none; outline: none; }

a:focus { text-decoration: none; outline: none; }

img { border: none; }

/* 让链接里的 img 无边框  ie会出现*/
label { cursor: pointer; }

/*  label标签鼠标移入后变为手型  */
table { border-collapse: collapse; /*合并边框*/ border-spacing: 0; }

/* 重置表格元素 */
/**********************************************************/
/* 二、常用的 class*/
.fl { float: left; }

.fr { float: right; }

.clear_fix:after { content: ""; display: block; clear: both; }

/*清除浮动*/
.beyond_eip { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }

.ofh { overflow: hidden; }

/*超出隐藏*/
.el_hide { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }

/*  隐藏元素  */
.bg_cover { background-position: center; background-size: cover; background-repeat: no-repeat; }

/*  背景居中铺满  */
.img_center { display: inline-block; margin: 0 auto; }

#model { width: 100%; height: 100%; position: relative; }

#progress { width: 50%; position: absolute; height: 25px; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

body { width: 100%; background: #000; position: relative; }

.max-width { width: 14.4rem; margin: 0 auto; }

.cc { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

img { display: block; border: none; }

.show_1440 { display: block; }

.show_620 { display: none; }

.s-top { width: 100%; height: 7.34rem; background: url("./../img/top-bg.png") center top no-repeat; background-size: 100%; position: relative; }

.s-top:before { width: 100%; height: 2.7rem; content: ""; display: block; background-color: #da0000; position: absolute; bottom: 0; }

.s-top .wrap { height: 100%; position: relative; }

.s-top .language { position: absolute; top: .20rem; right: .20rem; font-size: .18rem; color: #fff; }

.s-top .language a { font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 400; text-align: LEFT; color: #fff; margin: 0 .10rem; }

.s-top .logo { width: 4.05rem; height: 4.05rem; position: absolute; top: 1.75rem; left: 1.35rem; }

.s-top .model { width: 8.7rem; height: 6.42rem; position: absolute; bottom: 0; right: 0; }

.s-top .text { width: 5.98rem; height: 2.17rem; position: absolute; bottom: .27rem; right: 2.31rem; }

.handle-group { width: 100%; position: -webkit-sticky; position: sticky; bottom: 0; z-index: 1000; }

.handle-group .wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: .50rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.handle-group .goto-debris { width: 3rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color: #181818; font-size: 0.18rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 700; color: #ffffff; cursor: pointer; }

.handle-group .goto-debris .icon { width: .85rem; height: .60rem; margin-right: .22rem; }

.handle-group .goto-debris:hover { background-color: #372600; }

.handle-group .link-group { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.handle-group .btn-link { min-width: 2.48rem; height: 0.60rem; line-height: .60rem; background: #ffffff; font-size: 0.24rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 800; text-align: center; color: #000000; padding: 0 1.5em; }

.handle-group .btn-link:hover { color: #ffffff; background: #D81E55; text-decoration: none; }

.handle-group .icon-link { margin-left: .20rem; background-color: #000; }

.handle-group .icon-link img { width: .60rem; height: .60rem; }

.handle-group .icon-link:hover { background-color: #BD2B2B; }

.s-horn { position: relative; }

.s-horn .horn-line { width: 11.05rem; height: 11.05rem; position: absolute; left: 1.86rem; bottom: .96rem; z-index: 1; }

.s-horn .horn-wrap { width: 100%; height: 7.20rem; position: relative; z-index: 2; }

.s-horn .horn-wrap .text { line-height: 1.4; font-size: 0.18rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 400; text-align: LEFT; color: #c8c8c8; }

.s-horn .horn-wrap .golden { width: 8.89rem; height: 6.03rem; position: absolute; top: .50rem; left: .62rem; }

.s-horn .horn-wrap .golden-text-box { width: 5.30rem; position: absolute; top: 2.33rem; left: 6.18rem; }

.s-horn .horn-wrap .golden-text-box img { width: 2.83rem; height: .93rem; margin-bottom: .20rem; }

.s-horn .horn-wrap .sliver { width: 7.66rem; height: 6.12rem; position: absolute; top: .58rem; right: .70rem; }

.s-horn .horn-wrap .sliver-text-box { width: 5.30rem; position: absolute; top: 2.79rem; left: 2.30rem; }

.s-horn .horn-wrap .sliver-text-box img { width: 2.63rem; height: .86rem; margin-bottom: .20rem; }

.s-teams-players { width: 100%; height: 10.20rem; }

.s-teams-players .title .pic { width: 13.04rem; height: 1.77rem; margin: 0 auto; }

.s-teams-players .title .tip { font-size: 0.24rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 300; text-align: CENTER; color: #ffffff; margin-top: .10rem; }

.s-teams-players .players-swiper { width: 100%; height: 6.39rem; overflow: hidden; position: relative; white-space: nowrap; }

.s-teams-players .players-swiper .swiper-wrapper { width: auto; height: 6.39rem; display: inline-block; white-space: nowrap; }

.s-teams-players .players-swiper .swiper-slide { display: inline-block; width: 3.90rem; -moz-user-select: all; -webkit-user-select: all; -ms-user-select: all; user-select: all; }

.s-teams-players .players-swiper .pic { padding: .41rem 0; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; }

.s-teams-players .players-swiper .pic img { width: 3.90rem; height: 5.22rem; -webkit-user-drag: none; user-drag: none; }

.s-teams-players .players-swiper .name { font-size: 0.64rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 400; text-align: CENTER; color: #ffffff; }

.s-shoes { height: 9rem; position: relative; }

.s-shoes .wrap { position: relative; }

.s-shoes .pj { width: 7.16rem; height: 3.54rem; position: absolute; top: .74rem; left: .58rem; }

.s-shoes .p213 { width: 6.38rem; height: 3.43rem; position: absolute; top: 0; left: 7.04rem; }

.s-shoes .text { width: 6.24rem; line-height: 1.4; font-size: .18rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 300; text-align: LEFT; color: #c8c8c8; position: absolute; top: 3.27rem; left: 7.12rem; }

.s-shoes .shoes-content { width: 100%; height: 3.92rem; position: absolute; bottom: .69rem; background: -webkit-gradient(linear, left top, right top, from(#111111), to(rgba(17, 17, 17, 0))); background: linear-gradient(90deg, #111111 0%, rgba(17, 17, 17, 0) 100%); }

.s-shoes .shoes-content .max-width { height: 3.92rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0 1.3rem 0 .84rem; }

.s-shoes .shoes-content .logo { width: 1.59rem; height: 1.59rem; }

.s-shoes .shoes-content .list { display: -webkit-box; display: -ms-flexbox; display: flex; }

.s-shoes .shoes-content .list img { width: 1.80rem; height: 1.80rem; margin-left: .18rem; }

.s-live3D { height: 9rem; position: relative; }

.s-live3D .pic-title .game-ar-vr { width: 2.57rem; height: 1.14rem; margin: .20rem auto 0; }

.s-live3D .pic-title .live-3D { width: 7.38rem; height: 2.11rem; margin: .30rem auto 0; }

.s-live3D .text { width: 8.29rem; line-height: 1.5; font-size: 0.18rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 300; text-align: CENTER; color: #c8c8c8; margin: 4.1rem auto 0; }

.s-live3D .live3D-swiper { width: 100%; height: 4.50rem; overflow: hidden; position: absolute; top: 2.80rem; }

.s-live3D .live3D-swiper .swiper-slide { width: 4.50rem; height: 4.50rem; background-color: rgba(0, 0, 0, 0.8); border: 1px solid #3d3d3d; border-radius: 0.15rem; margin: 0 .10rem; -webkit-box-sizing: border-box; box-sizing: border-box; }

.s-live3D .live3D-swiper .swiper-slide img { max-width: 100%; max-height: 100%; }

.s-live3D .live3D-swiper .swiper-slide .icon-3D { width: .70rem; height: .70rem; background: rgba(255, 255, 255, 0.1); border-radius: 50%; position: absolute; top: .30rem; right: .30rem; cursor: pointer; }

.s-live3D .live3D-swiper .swiper-slide .icon-3D img { width: .30rem; height: .30rem; opacity: 0.5; }

.s-discord { width: 100%; background: #131313; }

.s-discord .wrap { height: 7.60rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }

.s-discord .wrap h1 { font-size: .64rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 400; color: #ffffff; margin-bottom: .15rem; }

.s-discord .wrap h2 { line-height: 1.5; font-size: 0.24rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 800; color: #ffffff; }

.s-discord .wrap p { max-width: 5rem; line-height: 1.5; font-size: 0.18rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 300; color: #c8c8c8; padding: .13rem 0 .34rem; }

.s-discord .wrap .t-green { color: #00ff00; }

.s-discord .wrap .icon { display: inline-block; width: .32rem; height: .32rem; vertical-align: text-top; }

.s-discord .wrap .icon-heti { background: url("../img/icon-heti.png") no-repeat; background-size: 100%; }

.s-discord .wrap .icon-debris { background: url("../img/icon-debris.png") no-repeat; background-size: 100%; }

.s-discord .wrap .icon-down { width: .14rem; height: .16rem; background: url("../img/icon-down.png") no-repeat; background-size: 100%; vertical-align: middle; }

.s-discord .wrap .huiguang { width: 3.20rem; height: 3.40rem; position: relative; overflow: hidden; margin: 0 auto; }

.s-discord .wrap .huiguang .front { width: 100%; height: 3.20rem; }

.s-discord .wrap .huiguang .reflect { width: 100%; position: absolute; top: calc(100% - .43rem); }

.s-discord .wrap .huiguang .reflect .pic { width: 100%; opacity: 0.3; filter: alpha(opacity= "30"); }

.s-discord .wrap .btn { width: 3.20rem; height: 0.80rem; margin: 0 auto; background: #00ff00; font-size: 0.18rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 700; color: #000000; border-radius: 0; }

.s-discord .wrap .btn:hover { background-color: #00AB00; }

.s-discord .wrap .discord-left { margin-left: 1.20rem; padding-top: .86rem; }

.s-discord .wrap .discord-right { margin-right: 2rem; padding-top: 1.45rem; }

.s-discord .wrap .discord-right .text { text-align: center; padding-top: .24rem; }

.s-roadmap { height: 6rem; }

.s-roadmap h1 { line-height: 1.5; font-size: 0.64rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 400; text-align: CENTER; color: #ffffff; padding: .73rem 0 0; }

.s-roadmap .roadmap { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; padding: 0 1.40rem; }

.s-roadmap .roadmap .roadmap-item { width: 5.20rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; margin-top: .40rem; line-height: 1.5; }

.s-roadmap .roadmap .roadmap-item .icon { width: 1rem; height: 1rem; }

.s-roadmap .roadmap .roadmap-item .text { width: 4rem; margin-left: .20rem; }

.s-roadmap .roadmap .roadmap-item h2 { font-size: 0.24rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 700; color: #ffffff; margin-bottom: .05rem; }

.s-roadmap .roadmap .roadmap-item p { font-size: 0.18rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 300; color: #c8c8c8; }

.s-heti2 { height: 6rem; position: relative; background-color: #d81e55; }

.s-heti2 .wrap { height: 6rem; position: relative; }

.s-heti2 .title { width: 4.77rem; height: 1.83rem; position: absolute; top: 1.94rem; right: 1.54rem; }

.s-heti2 .bg { width: 100%; height: 3.69rem; position: absolute; top: 1rem; }

.s-heti2 .heti { width: 4.76rem; height: 4.69rem; position: absolute; top: .68rem; left: 2.27rem; }

.footer { height: 1.60rem; }

.footer .logo { width: 1.46rem; height: 1.02rem; }

#container { width: 100%; height: 7.2rem; }

@media all and (max-width: 620px) { .show_1440 { display: none; }
  .show_620 { display: block; }
  .max-width { width: 100%; }
  .s-top { height: 9.80rem; background-position: top center; background-size: 14.40rem 7.2rem; position: relative; }
  .s-top:before { width: 100%; height: 3.75rem; content: ""; display: block; background-color: #da0000; position: absolute; bottom: 0; }
  .s-top .wrap { height: 100%; position: relative; }
  .s-top .logo { width: 2.58rem; height: 2.58rem; position: absolute; top: 1.22rem; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
  .s-top .model { width: 6.20rem; height: 5.60rem; position: absolute; bottom: 0; right: 0; }
  .s-top .text { width: 5.36rem; height: 1.95rem; position: absolute; bottom: .27rem; right: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
  .handle-group { width: 100%; position: -webkit-sticky; position: sticky; bottom: 0; z-index: 1000; }
  .handle-group .wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: .40rem; -webkit-box-sizing: border-box; box-sizing: border-box; }
  .handle-group .goto-debris { width: 3rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color: #181818; font-size: 0.18rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 700; color: #ffffff; margin-bottom: .40rem; }
  .handle-group .goto-debris .icon { width: .85rem; height: .60rem; margin-right: .22rem; }
  .handle-group .goto-debris:hover { background-color: #372600; }
  .handle-group .link-group { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
  .handle-group .btn-link { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 100%; height: 0.60rem; line-height: .60rem; background: #ffffff; font-size: 0.24rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 800; text-align: center; color: #000000; }
  .handle-group .btn-link:hover { color: #ffffff; background: #D81E55; text-decoration: none; }
  .handle-group .icon-link { margin-left: .24rem; background-color: #000; }
  .handle-group .icon-link img { width: .60rem; height: .60rem; }
  .handle-group .icon-link:hover { background-color: #BD2B2B; }
  .s-horn { position: relative; }
  .s-horn .horn-line { display: none; }
  .s-horn .horn-wrap { width: 100%; height: auto; position: relative; z-index: 2; }
  .s-horn .horn-wrap .text { line-height: 1.4; font-size: 0.18rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 400; text-align: LEFT; color: #c8c8c8; }
  .s-horn .horn-wrap .golden { width: 6.20rem; height: 6.00rem; position: static; }
  .s-horn .horn-wrap .golden-text-box { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; padding: .40rem; position: static; }
  .s-horn .horn-wrap .golden-text-box img { width: 2.83rem; height: .93rem; margin-bottom: .20rem; }
  .s-horn .horn-wrap .sliver { width: 6.20rem; height: 6.12rem; position: static; }
  .s-horn .horn-wrap .sliver-text-box { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; padding: .40rem; position: static; }
  .s-horn .horn-wrap .sliver-text-box img { width: 2.63rem; height: .86rem; margin-bottom: .20rem; }
  .s-teams-players { padding-top: .40rem; height: auto; }
  .s-teams-players .title .pic { width: 5.80rem; height: 1.70rem; margin: 0 auto; }
  .s-teams-players .title .tip { font-size: 0.24rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 300; text-align: CENTER; color: #ffffff; margin-top: .10rem; }
  .s-teams-players .players-swiper { width: 100%; height: 6.39rem; overflow: hidden; margin-top: .40rem; }
  .s-teams-players .players-swiper .swiper-slide { width: 3.90rem; }
  .s-teams-players .players-swiper .pic { padding: .41rem 0; }
  .s-teams-players .players-swiper .pic img { width: 3.90rem; height: 5.22rem; }
  .s-teams-players .players-swiper .name { font-size: 0.64rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 400; text-align: CENTER; color: #ffffff; }
  .s-shoes { height: auto; position: relative; }
  .s-shoes .pj { width: 5.80rem; height: 3.32rem; position: static; margin: 0 auto; }
  .s-shoes .p213 { width: 5.40rem; height: 3.43rem; position: static; margin: 0 auto; }
  .s-shoes .text { width: auto; line-height: 1.5; font-size: .18rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 300; text-align: right; color: #c8c8c8; position: static; margin: -.27rem .40rem 0; padding-bottom: .70rem; }
  .s-shoes .shoes-content { width: 100%; height: auto; position: relative; background: none; }
  .s-shoes .shoes-content .max-width { height: 3.92rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0; }
  .s-shoes .shoes-content .logo { width: 1.59rem; height: 1.59rem; position: absolute; left: .28rem; top: .50rem; }
  .s-shoes .shoes-content .list { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
  .s-shoes .shoes-content .list:before { display: block; width: 1.80rem; height: 1.80rem; content: ''; margin-top: .4rem; }
  .s-shoes .shoes-content .list img { width: 1.80rem; height: 1.80rem; margin-left: 0; margin-top: .4rem; }
  .s-live3D { height: auto; position: relative; }
  .s-live3D .pic-title .game-ar-vr { width: 2.57rem; height: 1.14rem; margin: .20rem auto 0; }
  .s-live3D .pic-title .live-3D { width: 3.97rem; height: 1.50rem; margin: 0 auto 0; }
  .s-live3D .text { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0 .60rem; line-height: 1.5; font-size: 0.18rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 300; text-align: CENTER; color: #c8c8c8; margin: 4.28rem auto .45rem; }
  .s-live3D .live3D-swiper { width: 100%; height: 4.50rem; overflow: hidden; position: absolute; top: 2.00rem; }
  .s-live3D .live3D-swiper .swiper-slide { width: 4.50rem; height: 4.50rem; background-color: rgba(0, 0, 0, 0.8); border: 1px solid #3d3d3d; border-radius: 0.15rem; margin: 0 .10rem; -webkit-box-sizing: border-box; box-sizing: border-box; }
  .s-live3D .live3D-swiper .swiper-slide img { max-width: 100%; max-height: 100%; }
  .s-live3D .live3D-swiper .swiper-slide .icon-3D { width: .70rem; height: .70rem; background: rgba(255, 255, 255, 0.1); border-radius: 50%; position: absolute; top: .30rem; right: .30rem; cursor: pointer; }
  .s-live3D .live3D-swiper .swiper-slide .icon-3D img { width: .30rem; height: .30rem; opacity: 0.5; }
  .s-discord { width: 100%; background: #131313; }
  .s-discord .wrap { height: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
  .s-discord .wrap h1 { font-size: .64rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 400; color: #ffffff; margin-bottom: .15rem; }
  .s-discord .wrap h2 { line-height: 1.5; font-size: 0.24rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 800; color: #ffffff; }
  .s-discord .wrap p { max-width: 5rem; line-height: 1.5; font-size: 0.18rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 300; color: #c8c8c8; padding: .13rem 0 .34rem; }
  .s-discord .wrap .t-green { color: #00ff00; }
  .s-discord .wrap .icon { display: inline-block; width: .32rem; height: .32rem; vertical-align: text-top; }
  .s-discord .wrap .icon-heti { background: url("../img/icon-heti.png") no-repeat; background-size: 100%; }
  .s-discord .wrap .icon-debris { background: url("../img/icon-debris.png") no-repeat; background-size: 100%; }
  .s-discord .wrap .icon-down { width: .14rem; height: .16rem; background: url("../img/icon-down.png") no-repeat; background-size: 100%; vertical-align: middle; }
  .s-discord .wrap .huiguang { width: 3.20rem; height: 3.40rem; position: relative; overflow: hidden; margin: 0 auto; }
  .s-discord .wrap .huiguang .front { width: 100%; height: 3.20rem; }
  .s-discord .wrap .huiguang .reflect { width: 100%; position: absolute; top: calc(100% - .43rem); }
  .s-discord .wrap .huiguang .reflect .pic { width: 100%; opacity: 0.3; filter: alpha(opacity= "30"); }
  .s-discord .wrap .btn { width: 5rem; height: 0.80rem; margin: 0 auto; background: #00ff00; font-size: 0.18rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 700; color: #000000; }
  .s-discord .wrap .btn:hover { background-color: #00AB00; }
  .s-discord .wrap .discord-left { margin-left: 0; padding-top: .86rem; }
  .s-discord .wrap .discord-right { margin-right: 0; padding-top: 0; }
  .s-discord .wrap .discord-right .text { text-align: center; padding-top: .24rem; padding-bottom: 1rem; }
  .s-roadmap { height: auto; }
  .s-roadmap h1 { line-height: 1.5; font-size: 0.64rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 400; text-align: CENTER; color: #ffffff; padding: .60rem 0 0; }
  .s-roadmap .roadmap { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; padding: 0 .50rem 1.20rem; }
  .s-roadmap .roadmap .roadmap-item { width: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; margin-top: .40rem; line-height: 1.5; }
  .s-roadmap .roadmap .roadmap-item .icon { width: 1rem; height: 1rem; }
  .s-roadmap .roadmap .roadmap-item .text { width: 4rem; margin-left: .20rem; }
  .s-roadmap .roadmap .roadmap-item h2 { font-size: 0.24rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 700; color: #ffffff; margin-bottom: .05rem; }
  .s-roadmap .roadmap .roadmap-item p { font-size: 0.18rem; font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; font-weight: 300; color: #c8c8c8; }
  .s-heti2 { height: 8.60rem; position: relative; background-color: #d81e55; }
  .s-heti2 .title { width: 4.77rem; height: 1.83rem; position: absolute; top: 6.03rem; right: auto; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
  .s-heti2 .bg { width: 5.26rem; height: 1.12rem; position: absolute; top: .70rem; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
  .s-heti2 .heti { width: 4.82rem; height: 5.68rem; position: absolute; top: .35rem; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
  .footer { height: 4.00rem; }
  .footer .logo { width: 2.80rem; height: 1.96rem; } }