/* @font-face {
  font-family: '阿里巴巴普惠体B';
  src: url('../font/Alibaba-PuHuiTi-Bold_0.otf'), url('../font/Alibaba-PuHuiTi-Bold_0.otf');
} 
  @font-face {
  font-family: '阿里巴巴普惠体R';
  src: url('../font/Alibaba-PuHuiTi-Regular_0.otf'), url('../font/Alibaba-PuHuiTi-Regular_0.otf');
}  
 @font-face {
  font-family: '阿里巴巴普惠体H';
  src: url('../font/ALIBABA-PUHUITI-HEAVY_0.OTF'), url('../font/ALIBABA-PUHUITI-HEAVY_0.OTF');
} */

@font-face {
  font-family: 'Impact';
  src: url('../font/IMPACT.TTF'), url('../font/IMPACT.TTF');
}
@font-face {
        font-family: "mfji";
        src: url("../font/MFJINHEI_NONCOMMERCIAL-REGULAR.OTF");
    }

body {
  margin: 0;
  padding: 0;
  background-color: #2b2b2d;
  font-family: "思源黑体 CN";
}
li {
  list-style: none;
}
/* 最外面的大盒子 */
.bigBox{
	width:100%;
	height:auto;
	position:relative;
}
.title {
  width: 7.5rem;
  height: 0.8rem;
  background-color: #222224;
  display: flex;
  justify-content: center;
  align-items: center;
}
.title span {
  color: #fff;
  opacity: 0.65;
  font-size: 0.3rem;
}
.template_big{
	width:100%;
	display:flex;
	justify-content:center;
	align-items:center;
}
.template {
 width: 7.5rem;
  height: 7.5rem;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}
.template .photoBox {
 /*  width: 16rem;
  height: 16rem; */
        width: 2.31rem;
    height: 2.31rem;
   border: 0.06rem solid #2b2b2d; 
}
.template .photoBox .photoBox1 {
  width: 7rem;
  height: 7rem;
  position: relative;
  transform: scale(0.33);
  transform-origin: left top;
  color: #fff;
}
.template .photoBox .photoBox1 .player_name {
    width: 7rem;
    height: 1.2rem;
    position: absolute;
    top: 0.6rem;
    left: 0.5rem;
}
.template .photoBox .photoBox1 .player_name .top,
.template .photoBox .photoBox1 .player_name .stroke {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.template .photoBox .photoBox1 .player_name .top  p:nth-child(1),
.template .photoBox .photoBox1 .player_name .stroke  p:nth-child(1) {
  width: 2rem;
  font-size: 1.48rem;
  /* font-weight: bold; */
  transform: skew(-8deg);
  font-family: "Impact";
}
.template .photoBox .photoBox1 .player_name .top  p:nth-child(2),
.template .photoBox .photoBox1 .player_name .stroke  p:nth-child(2) {
  width: 4.8rem;
  height: 1rem;
  text-align: center;
}
.template .photoBox .photoBox1 .player_name .top  p:nth-child(2)  span,
.template .photoBox .photoBox1 .player_name .stroke  p:nth-child(2)  span {
  display: block;
  font-size: 0.37rem;
  font-weight: bold;
  letter-spacing: 0.06rem;
  transform: skew(-8deg);
}
.template .photoBox .photoBox1 .player_name .top  p:nth-child(2) span:nth-child(1),
.template .photoBox .photoBox1 .player_name .stroke  p:nth-child(2) span:nth-child(1) {
  margin-top: -0.1rem;
  margin-right:0.15rem;
}
.template .photoBox .photoBox1 .player_name .top  p:nth-child(2)  span:nth-child(2),
.template .photoBox .photoBox1 .player_name .stroke  p:nth-child(2)  span:nth-child(2) {
  font-size: 0.7rem;
  letter-spacing: 0.14rem;
  margin-top: -0.18rem;
}
.template .photoBox .photoBox1 .player_name .stroke {
  position: absolute;
  top: -0.12rem;
  left: 0.1rem;
  z-index: 1;
}
.template .photoBox .photoBox1 .player_name .stroke p {
  color: transparent;
  -webkit-text-stroke: 0.02rem #1b4383;
}
.template .photoBox .photoBox1 .player_name .stroke p:nth-child(2) {
  margin-top: 1.2rem;
}
.template .photoBox .photoBox1 .score_detail {
  width: 1.92rem;
  height: 5.69rem;
  position: absolute;
  left: 0;
  top: 2.96rem;
}
.template .photoBox .photoBox1 .score_detail div {
  width: 100%;
  height: 1.61rem;
  margin-bottom: 0.39rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.template .photoBox .photoBox1 .score_detail div p span {
  display: block;
  transform: skew(-8deg);
  text-align: center;
}
.template .photoBox .photoBox1 .score_detail div p span:nth-child(1) {
  font-size: 0.92rem;
  font-family: "Impact";
}
.template .photoBox .photoBox1 .score_detail div p span:nth-child(2) {
  font-size: 0.4rem;
  margin-top: -0.15rem;
  font-weight: bold;
}
.template .photoBox .photoBox1 .score_detail div:nth-child(2) {
  margin-bottom: 0.47rem;
}
.template .photoBox .photoBox1 .t_score {
  width: 4.4rem;
  height: 0.96rem;
  position: absolute;
  left: 0.9rem;
  bottom: 0.32rem;
}
.template .photoBox .photoBox1 .t_score .date {
  height: 0.35rem;
  text-align: center;
  font-size: 0.3rem;
  font-weight: bold;
  transform: skew(-8deg);
}
.template .photoBox .photoBox1 .t_score .team_score {
  height: 0.5rem;
  font-size: 0.3rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: bold;
  transform: skew(-8deg);
}
.template .photoBox .photoBox1 .t_score .team_score p:nth-child(2) {
  font-family: "Impact";
  font-size: 0.41rem;
}
.template .photoBox .photoBox1 img {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: -1;
}
.photoBox1,.photoBox2{
	transform: scale(0.33);
}
.template .photoBox .photoBox2 {
    width: 7rem;
    height: 7rem;
  position: relative;
  transform-origin: left top;
  color: #fff;
}
.template .photoBox .photoBox2 .player_name {
  width: 7.2rem;
  height: 1.33rem;
  position: absolute;
  top: 0.35rem;
  left: 0.3rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.template .photoBox .photoBox2 .player_name p:nth-child(1) {
  width: 1.8rem;
  font-size: 1.7rem;
  /* font-weight: bold; */
  transform: skew(-8deg);
  font-family: "Impact";
}
.template .photoBox .photoBox2 .player_name p:nth-child(2) {
  width: 5.6rem;
  height: 1rem;
}
.template .photoBox .photoBox2 .player_name p:nth-child(2) span {
  display: block;
  font-size: 0.36rem;
  font-weight: bold;
  letter-spacing: 0.06rem;
  transform: skew(-8deg);
  /* float:right; */
  text-align:center;
}
.template .photoBox .photoBox2 .player_name p:nth-child(2) span:nth-child(1) {
  margin-right: 0.2rem;
  margin-top: -0.2rem;
}
.template .photoBox .photoBox2 .player_name p:nth-child(2) span:nth-child(2) {
  font-size: 0.88rem;
  letter-spacing: 0.01rem;
  margin-top: -0.18rem;
}
.template .photoBox .photoBox2 .score_detail {
  width: 1.33rem;
  height: 4rem;
  position: absolute;
  right: 0.57rem;
  top: 7.08rem;
}
.template .photoBox .photoBox2 .score_detail div {
  width: 100%;
  height: 1.25rem;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 0.07rem;
}
.template .photoBox .photoBox2 .score_detail div p span {
  display: block;
  transform: skew(-8deg);
  text-align: center;
}
.template .photoBox .photoBox2 .score_detail div p span:nth-child(1) {
  font-size: 0.8rem;
  font-family: "Impact";
  margin-bottom: -0.15rem;
}
.template .photoBox .photoBox2 .score_detail div p span:nth-child(2) {
  font-size: 0.36rem;
}
.template .photoBox .photoBox2 .score_detail div:nth-child(2) {
  margin-top: 0.08rem;
}
.template .photoBox .photoBox2 .score_detail div:nth-child(3) {
  margin-top: 0.13rem;
}
.template .photoBox .photoBox2 .t_score {
width: 5.2rem;
    height: 1.1rem;
    position: absolute;
    left: 0.9rem;
    bottom: 1rem;
}
.template .photoBox .photoBox2 .t_score .team_score {
  height: 0.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transform: skew(-8deg);
  font-size: 0.3rem;
}
.template .photoBox .photoBox2 .t_score .team_score p:nth-child(2) {
  font-family: "Impact";
  font-size: 0.8rem;
}
.template .photoBox .photoBox2 .t_score .date {
  height: 0.35rem;
  text-align: center;
  font-size: 0.3rem;
  transform: skew(-8deg);
  margin-top: 0.05rem;
}
.template .photoBox .photoBox2 img {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: -1;
}
/* .template .photoBox .photoBox3 {
  width: 7.5rem;
  height: 13.34rem;
  position: relative;
  font-size: 0.26rem;
  transform: scale(0.25);
  transform-origin: left top;
} */
/* .template .photoBox .photoBox3 .player_number {
  position: absolute;
  top: 0;
  left: 0.15rem;
  font-size: 1.23rem;
  font-weight: bold;
  color: #f0464a;
  text-shadow: #000 3px 0 0, #000 0 3px 0, #000 -3px 0 0, #000 0 -3px 0;
} */
/* .template .photoBox .photoBox3 .player_number span:nth-child(2) {
  display: inline-block;
  margin-left: -0.15rem;
  font-family: "Impact";
  font-weight:200;
}
.template .photoBox .photoBox3 .player {
  position: absolute;
  top: 0.15rem;
  right: 0.45rem;
}
.template .photoBox .photoBox3 .player p {
  font-size: 0.4rem;
  color: #fff;
  font-weight: bold;
  text-shadow: #000 3px 0 0, #000 0 3px 0, #000 -3px 0 0, #000 0 -3px 0;
  transform: skew(-8deg);
      text-align: right;
}
.template .photoBox .photoBox3 .player p:nth-child(2) {
  font-size: 0.85rem;
  margin-top: -0.65rem;
  margin-left: -0.15rem;
}
.template .photoBox .photoBox3 .t_score {
  width: 4.4rem;
  height: 0.96rem;
  position: absolute;
  top: 8.8rem;
  left: -1.36rem;
  transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  Internet Explorer
  -moz-transform: rotate(-90deg);
  Firefox
  -webkit-transform: rotate(-90deg);
  Safari 和 Chrome
  -o-transform: rotate(-90deg);
  Opera
}
.template .photoBox .photoBox3 .t_score .team_score {
  height: 0.5rem;
  font-size: 0.3rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transform: skew(-8deg);
}
.template .photoBox .photoBox3 .t_score .team_score p:nth-child(2) {
  font-family: "Impact";
  font-size: 0.39rem;
}
.template .photoBox .photoBox3 .t_score .date {
  height: 0.35rem;
  text-align: center;
  font-size: 0.3rem;
  font-weight: bold;
  transform: skew(-8deg);
  margin-top: 0.05rem;
}
.template .photoBox .photoBox3 .score_detail {
  width: 6.07rem;
  height: 2.5rem;
  position: absolute;
  top: 10.23rem;
  left: 1.4rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.template .photoBox .photoBox3 .score_detail div {
  width: 2.03rem;
  height: 2.4rem;
  margin-top: 0.3rem;
}
.template .photoBox .photoBox3 .score_detail div P:nth-child(1) {
  width: 100%;
  height: 1.9rem;
  text-align: center;
  line-height: 1.9rem;
  color: #f4bc10;
  font-size: 1.14rem;
  font-family: "Impact";
  transform: skew(-8deg);
  text-shadow: #000 3px 0 0, #000 0 3px 0, #000 -3px 0 0, #000 0 -3px 0;
  margin-top: 0rem;
}
.template .photoBox .photoBox3 .score_detail div p:nth-child(2) {
  width: 100%;
  text-align: center;
  font-family: "思源黑体 CN Heavy";
  font-size: 0.5rem;
  transform: skew(-8deg);
  text-shadow: #fff 3px 0 0, #fff 0 3px 0, #fff -3px 0 0, #fff 0 -3px 0;
  margin-top: -1.15rem;
}
.template .photoBox .photoBox3 .score_detail div:nth-child(3) {
  margin-right: -0.22rem;
}
.template .photoBox .photoBox3 img {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: -1;
} */
.template .photoBox_high {
  border-radius: 0.08rem;
  border: 0.06rem solid #eb5953;
  box-shadow: 0.1rem 0.2rem 0.3rem #1b1b1c;
  overflow: hidden;
}
.template .photoBox_high_2{
  border-radius: 0.08rem;
  border: 0.06rem solid #eb5953;
  box-shadow: 0.04rem 0.04rem 0.16rem rgba(27, 27, 28, 0.4);;
  overflow: hidden;
}
.color_big{
	width:100%;
	display: flex;
    justify-content: center;
    align-items: center;
}
.color {
  width: 6rem;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: center;
}
.color div {
  width: 1.5rem;
  height: 1.3rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.color div p {
  width: 0.9rem;
  height: 0.9rem;
  border-radius: 50%;
  background-color: red;
  border: 0.04rem solid #999999;
}
.color div .bc1b2d {
  background-color: #bc1b2d;
}
.color div .dc6d3d {
  background-color: #dc6d3d;
}
.color div .e7aa06 {
  background-color: #e7aa06;
}
.color div .g289343 {
  background-color: #289343;
}
.color div .b3c97cb {
  background-color: #3c97cb;
}
.color div .b1b4383 {
  background-color: #1b4383;
}
.color div .p4e2279 {
  background-color: #4e2279;
}
.color div .b131112 {
  background-color: #131112;
}
.color div .color_high {
  border: 0.04rem solid #eb5953;
}
.next {
  width: 7.5rem;
  height: 1.5rem;
  position: absolute;left:0;
}
.next p {
  width:100%;
  height:0.9rem;
  text-align:center;
  line-height:0.9rem;
  border-top: 0.02rem solid #414142;
  border-bottom: 0.04rem solid #000000;
  color: #fff;
  opacity: 0.45;
  font-size: 0.3rem;
  margin-top:-0rem;
}
.weix1{
    margin-left: 5.5rem;
    margin-top: 0.2rem;
}
.weix1{
	width: 1.2rem!important ;
    height: 1.2rem!important ;
    z-index:999!important;
}
.weix2{
    right: 0.34rem;
    bottom: 0.1rem;
    width: 1rem!important ;
    height: 1rem!important ;
    position:absolute;
    z-index:999!important;
}
.dataClass {
	height: 1.3rem;
	position: absolute;
	bottom: 0rem;
	width: 7rem;
	display: flex;
	flex-direction: row;
	align-items: center;
	margin:0 auto;
}
.dataClass_1,.dataClass_2{
	font-size:0.16rem;
	/* font-family:"黑体"; */
}
.dataClass_2{
	text-align:right;
	margin-top: 0.3rem;
}
.dataClass_1{
	margin-top:0.15rem;
}

.dataClass_1>p,.dataClass_2>p{
	height: 0.2rem;
    padding: 0;
    margin: 0;
}
.dataClass_1>p:nth-child(1),.dataClass_2>p:nth-child(4){
	font-size:0.24rem;
	height: 0.3rem;
	font-family:"黑体 "!important;
}

.dataClass>div {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 50%
}
.score_1,.score_2{
	position:absolute;
	font-size:1.1rem;
	display:flex;
	flex-direction:row;
	
}
.score_1{
	bottom:0.1rem;
	left:0.35rem;
}
.score_2{
	top:0rem;
	right:0.35rem;
}
.dataClass>div p {
	font-size: 0.2rem;
	margin:0;
	padding:0;
}