/* reset */
html,
body,
div,
p,
ul,
li,
dl,
dt,
dd,
em,
i,
span,
a,
img,
input,
h1,
h2,
h3,
h4,
h5 {
  margin: 0;
  padding: 0;
  outline: none;
}

a,
img,
input {
  border: none;
}

a {
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  -webkit-user-select: none;
  -moz-user-select: none;
}

ul,
li {
  list-style: none;
}

i,
em {
  font-style: normal;
}

b {
  font-weight: bold;
}

.db {
  display: block;
  overflow: hidden;
  text-indent: -9999px;
  font-size: 0;
}

body {
  font: 14px/1.75 tahoma, Arial, sans-serif;
}

html {
  width: 100%;
  font-size: calc(100vw / 3840);
}

.flex {
  display: flex;
  justify-content: center;
  align-items: center;
}

body {
  width: 100%;
  background-color: #7b0e1e;
  overflow-x: hidden;
}

* {
  box-sizing: border-box;
}


/* wrap */
a.btn-gray {
  filter: grayscale(1)!important;  -webkit-filter: grayscale(1)!important;
  pointer-events: none;
}
.wrap a:hover,
.dia a:hover {
  filter: brightness(1.14);
}
.wrap a.btn-received:hover,
a.btn-gray:hover {
  filter: brightness(1);
  cursor: default;
}
.wrap {
  position: relative;
  width: 100%;
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/bg.jpg) top center / cover no-repeat;
  height: 2000rem;
  overflow: hidden;
}

.header {
  display: flex;
  justify-content: space-between;
  padding-right: 76rem;
  position: relative;
  z-index: 4;
}

.header .l {
  width: 1660rem;
  padding: 72rem 0 0 72rem;
}
.header .logo {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/logo.png) no-repeat;
  background-size: 100% auto;
  width:400rem;
  height:96rem;
}
.header .head-tit {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/head-tit.png) no-repeat;
  background-size: 100% auto;
  width:1441rem;
  height:475rem;
  margin: 118rem 0 0 116rem;
}
.header .loginBox {
  color: #efefef;
  font-size: 32rem;
  display: flex;
  padding-top: 95rem;
}

.header .loginBox a {
  color: #F5EB00;
}

.header .loginBox .login a {
  color: #F5EB00;
  text-decoration: underline;
}

.header .loginBox .ruleBtn {
  display: block;
  color: #F5EB00;
  margin-right: 46rem;
  text-decoration: underline;
}

.btn {
  background-size:100% auto;
  background-position:top center;
  background-repeat:no-repeat;
  display: block;
  text-indent: -9999px;
  font-size: 0;
  width: 292rem;
  height: 84rem;
}
.btn-copy {
  background-image: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/btn-copy.png);
}
.btn-down {
  background-image: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/btn-down.png);
}
.btn-receive {
  background-image: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/btn-receive.png);
}
.btn-received {
  background-image: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/btn-received.png);
  pointer-events: none;
}
.btn-accept-help {
  background-image: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/btn-accept-help.png);
}
.btn-cancel-help {
  background-image: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/btn-cancel-help.png);
}
.btn-confirm {
  background-image: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/btn-confirm.png);
}

.copyMain {
  width: 100%;
  height: 230rem;
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/invite1-bg.png) no-repeat;
  background-size: 100% 230rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.copyMain input {
  width: 828rem;
  height: 80rem;
  background: #29233d;
  border: 1px #544f64 solid;
  color: #a9a7b1;
  font-size: 28rem;
  padding-left: 20rem;
  margin-right: 16rem;
}
.copyMain a {
  margin-left: 8rem;
  margin-right: 8rem;
}

.main {
  display: flex;
  justify-content: space-between;
  padding: 0 200rem;
  position: absolute;
  width: 100%;
  left: 0;
  bottom:50rem;
  align-items: flex-end;
  z-index: 5;
}

.main .l,
.main .r {
  width: 1540rem;
}

.main .l .t ,
.main .r .t {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  margin-top: 160rem;
}

.invite-record {
  display: block;
  width: 194rem;
  height: 82rem;
  text-align: right;
  line-height: 82rem;
  color: #f5eb00;
  font-size: 28rem;
  padding-right: 40rem;
  position: relative;
}
.invite-record:after {
  content: "";
  width: 40rem;
  height:40rem;
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/icon-arrow.png) no-repeat;
  background-size: 100% auto;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

.main .l .t .tab {
  display: flex;
  align-items: center;
  height: 82rem;
}

.main .l .top-right {
  width: 670rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.main .top-right p {
  text-align: center;
  color: #fff;
  font-size:28rem;
  vertical-align: middle;
  padding: 0 38rem;
  height: 82rem;
  overflow: hidden;
  line-height: 82rem;
  position: relative;
}
.main .top-right p:after {
  content: "";
  width: 2rem;
  height: 32rem;
  display: block;
  background: rgba(255,255,255,.2);
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

.main .top-right p span {
  margin: 0 10rem;
  color: #f5eb00;
}

.main .l .tab a {
  width: 280rem;
  height: 82rem;
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/tab1.png) no-repeat;
  background-size: 100% 100%;
  text-align: center;
  line-height: 82rem;
  color: #afa3ac;
  font-size: 32rem;
  position: relative;
  margin-right: 2rem;
  text-decoration: none;
  display: block;
}
.main .l .tab a.active {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/tab1-1.png) no-repeat;
  background-size: 100% 100%;
  color: #fff;
}

.main .l .tabD,
.main .r .rightMain {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/invite2-bg.png) no-repeat;
  background-size: 100% 440rem;
  height: 440rem;
  padding-top: 75rem;
}
.main .r .rightMain {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/invite3-bg.png) no-repeat;
  background-size: 100% 440rem;
}

.main .tabMain3 .items:nth-of-type(1) .icon::after {
  content: '';
  display: none;
  width: 116rem;
  height: 117rem;
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/empty.png) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  left: 50%;
  top: 54%;
  transform: translate(-50%, -50%);
}

.main .tabMain3 .items.empty .icon::after {
  display: block;
}

.main .tabMain3 .items.empty img {
  filter: brightness(0.4);
}

.main .list,
.dia .list {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 290rem;
}

.main .list .items,
.dia .list .items {
  width: 290rem;
  height:290rem;
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/prize-bg1.png) no-repeat;
  background-size: 100% auto;
  text-align: center;
  color: #fff;
  font-size: 28rem;
  margin: 0 38rem;
  line-height: 1.3;
  position: relative;
}

.main .list .btn {
  margin-left: 200rem;
  margin-right: 38rem;
}
.main .tabMain:nth-child(1) .list .btn {
  margin-left: 60rem;
}

.main .list .items.itemsType,
.dia  .list .items.itemsType {
  width: 512rem;
  height:282rem;
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/prize-bg0.png) no-repeat;
  background-size: 100% auto;
}

.main .list .items p,
.dia .list .items p {
  height: 60rem;
  line-height: 60rem;
  text-align: center;
  width: 100%;
  position: absolute;
  bottom: 4rem;
}

.main .list .items .icon,
.dia .list .items .icon {
  height: 220rem;
  padding-top: 6rem;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  position: relative;
}

.main .list .items .icon img,
.dia .list .items .icon img {
  height: 220rem;
  display: block;
}

.main .r .list .items {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/prize-bg2.png) no-repeat;
  background-size: 100% auto;
}
.r-tit {
  width: 410rem;
  height: 60rem;
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/invite3-tit.png) no-repeat;
  background-size: 100% auto;
  margin-bottom: 22rem;
}


/* head icon_box */
.arms-box {
  width: 1700rem;
  height: 1110rem;
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/icon-arms.png) no-repeat;
  background-size: 100% auto;
  position: absolute;
  right: 385rem;
  top: 181rem;
  z-index: 2;
}
.icon_box {
  width: 784rem;
  height: 246rem;
  position: absolute;
  right: -176rem;
  top: 88rem;
}
.icon_box .q_icon {
  width: 0;
  height: 246rem;
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/q_icon.png) no-repeat;
  background-size: auto 100%;
  animation: ww 1.5s ease-in-out forwards;
}
@keyframes ww {
  0% {
    width: 0;
  }
  100% {
    width: 784rem;
  }
}


@media screen and (min-width: 1920px) {
  .wrap {
    height: 100vh;
  }
  .main .l .t {
    margin-top: 100rem;
  }
}


/**  pop **/
.dia {
  display: none;
  position: relative;
  padding-top: 1rem;
}
.dia .close {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/pop-colse.png) no-repeat;
  width: 64rem;
  height: 64rem;
  display: block;
  background-size: 100% 100%;
  position: absolute;
  right: 32rem;
  top:32rem;
}
.dia .btn {
  margin: 60rem auto 0;
}
.pop-tit {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/pop-tit3.png) no-repeat;
  background-size: 100% auto;
  width: 500rem;
  height: 66rem;
  margin: 120rem auto 60rem;
}
.diaXgy,
.diaLogin {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/pop1.png) no-repeat;
  background-size: 100% 100%;
  width: 1192rem;
  height: 778rem;
}
.dia .list .items {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/pop-prize-bg1.png) no-repeat;
  background-size: 100% auto;
}
.diaNew .list .items {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/pop-prize-bg2.png) no-repeat;
  background-size: 100% auto;
}
.dia .list .items.itemsType {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/pop-prize-bg0.png) no-repeat;
  background-size: 100% auto;
}

.diaLogin .diaMain {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/loginIcon.png) no-repeat;
  background-size: 100% 100%;
  width: 648rem;
  height:290rem;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
.diaLogin .diaMain a {
  display: block;
  height: 100%;
  width: 286rem;
}
.diaLogin .pop-tit {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/pop-tit4.png) no-repeat;
  background-size: 100% auto;
  margin-bottom: 108rem;
}

.diaTxt {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/pop0.png) no-repeat;
  background-size: 100% 100%;
  width: 992rem;
  height: 578rem;
}
.diaTxt .pop-tit {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/pop-tit0.png) no-repeat;
  background-size: 100% auto;
  margin-bottom: 0;
}
.diaTxt .btn {
  margin: 0 auto;
}
.diaTxt .txt {
  width: 80%;
  height:200rem;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  color: #d0d0d0;
  font-size: 28rem;
  line-height: 40rem;
}

.diaYqjl,
.diaRule {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/pop2.png) no-repeat;
  background-size: 100% 100%;
  width: 1392rem;
  height: 978rem;
}
.diaYqjl .pop-tit {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/pop-tit1.png) no-repeat;
  background-size: 100% auto;
  margin-bottom: 32rem;
}
.diaYqjl .table {
  width: 1262rem;
  margin: 0 auto;
  font-size: 28rem;
}
.diaYqjl .table .thead {
  display: flex;
  background: #070109;
}
.diaYqjl .table .thead p {
  line-height: 80rem;
  color: #d0d0d0;
}
.diaYqjl .table .tbody {
  height: 500rem;
  overflow-y: auto;
}
.diaYqjl .table .items {
  padding: 20rem 0;
  line-height: 30rem;
  display: flex;
  border-bottom: 1px solid #b2263d;
}
.diaYqjl .table .items:last-child {
  border-bottom: none;
}

.diaYqjl .table .items p,
.diaYqjl .table .i-name {
  display: flex;
  font-size: 28rem;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #f4e8ea;
}
.diaYqjl .table .thead p,
.diaYqjl .table .items p,
.diaYqjl .table .i-name {
  width: 50%;
  text-align: center;
}
.diaYqjl .table .i-name {
  flex-wrap: wrap;
}
.diaYqjl .table .i-name img {
  width: 40rem;
  height: 40rem;
  border-radius: 100%;
  display: block;
  margin-right: 14rem;
}
.diaYqjl .table .i-name span {
  max-width: calc(100% - 60rem);
  text-align: left;
}


.diaRule .pop-tit {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/pop-tit2.png) no-repeat;
  background-size: 100% auto;
  margin-bottom: 50rem;
}
.diaRule .diaMain {
  padding: 0 100rem;
  color: #d0d0d0;
  font-size: 28rem;
  height: 620rem;
  overflow-y: auto;
}

.diaYqjl .table .tbody::-webkit-scrollbar,
.diaRule .diaMain::-webkit-scrollbar {
  width: 4rem;
}
.diaYqjl .table .tbody::-webkit-scrollbar-thumb,
.diaRule .diaMain::-webkit-scrollbar-thumb {
  width: 4rem;
  background: #fdf7d4;
}
.diaYqjl .table .tbody::-webkit-scrollbar-track,
.diaRule .diaMain::-webkit-scrollbar-track {
  width: 4rem;
  background: #962111;
}
.diaRule p {
  padding-left: 36rem;
  line-height: 42rem;
}
.diaRule p em {
  color: #f5eb00;
}
.diaRule p.spe-p {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/dot.png) no-repeat left top;
  background-size: 12rem 12rem;
  background-position-y: 12rem;
}

.diaRule p:last-child {
  margin-bottom: 0;
}

.diaRule p.type {
  font-weight: 700;
}

.queryAssist {
  background-image: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/pop3.png);
  background-size: 100% auto;
  width: 992rem;
  height: 858rem;
}
.queryAssist .box {
  margin: 30rem auto 20rem;
}
.queryAssist .txt {
  height: auto;
  padding: 0;
}
.queryAssist .btn_box {
  display: flex;
  justify-content: center;
}
.queryAssist .btn_box a {
  margin: 50rem 36rem 0;
}
.queryAssist .list .items {
  background: url(//game.gtimg.cn/images/thefinals/cp/thefinalsliebian/pop-prize-bg2.png) no-repeat;
  background-size: 100% auto;
}
