You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

522 lines
13 KiB

@charset "UTF-8";
/* CSS Document */
html {
height:100%;
}
body {
height:100%;
width:100%;
}
.bg{
margin:0 auto;
width:100%;
height:100%;
/*min-height:100vh;*/
background:url(../images/bg2.jpg) ;
/*background-size: cover;*/
background-repeat: no-repeat;
background-size: 100% 100%;
padding-top:0rem;
padding:0.1rem 0.2rem;
}
.title{
width:100%;
font-size:0.12rem;
/*line-height:0.4rem;*/
color:rgba(14,253,255,1);
text-align:center;
font-weight:bold;
height: 6.2%;
vertical-align:middle;
}
.border_bg_leftTop{
position:absolute;
left:-0.008rem;
top:-0.04rem;
width:0.37rem;
height:0.05rem;
display:block;
background:#01279d url(../images/title_left_bg.png) no-repeat;
background-size:cover;}
.border_bg_rightTop{
position:absolute;
right:-0.01rem;
top:-0.01rem;
width:0.1rem;
height:0.1rem;
display:block;
background:url(../images/border_bg.jpg) no-repeat;
background-size:cover;}
.border_bg_leftBottom{
position:absolute;
left:-0.008rem;
bottom:-0.008rem;
width:0.1rem;
height:0.1rem;
display:block;
background:url(../images/border_bg.jpg) no-repeat;
background-size:cover;}
.border_bg_rightBottom{
position:absolute;
right:-0.01rem;
bottom:-0.01rem;
width:0.08rem;
height:0.08rem;
display:block;
background:url(../images/title_right_bg.png) no-repeat;
background-size:cover;}
.leftMain_top{
width:100%;
padding-bottom:0.05rem;}
.leftMain_top ul{
display:block;
/*display: -webkit-flex;*/
}
.leftMain_top ul li:nth-child(1){
float:left;
width:28%;
padding-right:0.05rem;}
.leftMain_top ul li:nth-child(2){
float:left;
width:44%;
padding-right:0.05rem;}
.leftMain_top ul li:nth-child(3){
float:right;
width:28%;
}
.leftMain_top ul li:last-child{
padding:0;}
.leftMain_top ul li .liIn{
border:0.008rem solid rgba(14,253,255,0.5);
width:100%;
/*min-height:60px;*/
position:relative;
padding:0.08rem 0.05rem;
}
.leftMain_top ul li .liIn h3{
font-size:0.08rem;
color:#fff;
margin-bottom:0.05rem;
}
.leftMain_top ul li .liIn .shu{
font-size:0.12rem;
color:rgba(14,253,255,1);
font-family:dig;
margin-bottom:0.02rem;}
.leftMain_top ul li .liIn .shu i{
font-size:0.04rem;
margin-left:0.06rem;
font-style:normal;}
.leftMain_top ul li .liIn .zi{
font-size:0.04rem;
color:#fff;
position:relative;
z-index:10;}
.leftMain_top ul li .liIn .zi .span1{
margin-right:0.1rem;}
.leftMain_bottom{
width:100%;
padding-bottom:0.1rem;}
.leftMain_bottom ul{
display:block;
/*display: -webkit-flex;*/
}
/*.leftMain_bottom ul li{
float:left;
width:33.33%;
padding-right:0.05rem;}*/
.leftMain_bottom ul li:nth-child(1){
float:left;
width:28%;
padding-right:0.05rem;}
.leftMain_bottom li:nth-child(2){
float:left;
width:44%;
padding-right:0.05rem;}
.leftMain_bottom li:nth-child(3){
float:right;
width:28%;
}
.leftMain_bottom ul li:last-child{
padding-right:0;}
.leftMain_bottom ul li .liIn{
border:0.008rem solid rgba(14,253,255,0.5);
width:100%;
/*min-height:60px;*/
position:relative;
padding:0.08rem 0.05rem;
}
.leftMain_bottom ul li .liIn h3{
font-size:0.08rem;
color:#fff;
margin-bottom:0.05rem;
}
.leftMain_bottom ul li .liIn .shu{
font-size:0.12rem;
color:rgba(14,253,255,1);
font-family:dig;
margin-bottom:0.02rem;}
.leftMain_bottom ul li .liIn .shu i{
font-size:0.04rem;
margin-left:0.06rem;
font-style:normal;}
.leftMain_bottom ul li .liIn .zi{
font-size:0.04rem;
color:#fff;
position:relative;
z-index:10;}
.leftMain_bottom ul li .liIn .zi .span1{
margin-right:0.1rem;}
.leftMain_middle{
width:100%;
padding-bottom:0.1rem;
display:block;
/*display: -webkit-flex;*/
}
.leftMain_middle .leftMain_middle_left{
width:60%;
padding-right:0.02rem;}
.leftMain_middle .leftMain_middle_left .leftMain_middle_leftIn{
border:0.008rem solid rgba(14,253,255,0.5);
width:100%;
/*min-height:60px;*/
position:relative;
padding:0.08rem 0.05rem;
}
.leftMain_middle .leftMain_middle_left .leftMain_middle_leftIn h3{
font-size:0.08rem;
color:#fff;
margin-bottom:0.05rem;
}
.leftMain_middle .leftMain_middle_left .leftMain_middle_leftIn .biaoge{
/*min-height:200px;*/
}
.leftMain_middle .leftMain_middle_right{
width:40%;
}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn{
border:0.008rem solid rgba(14,253,255,0.5);
width:100%;
/*min-height:60px;*/
position:relative;
padding:0.08rem 0.05rem;
}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn h3{
font-size:0.08rem;
color:#fff;
margin-bottom:0.05rem;
}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge{
/*min-height:200px;*/
}
/*左边中间部分排行榜*/
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai{
width:100%;
overflow:hidden;
}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn{
display:block;
/*display: -webkit-flex;*/
align-items:center;
color:#fff;
font-size:0.06rem;
height:0.18rem;
}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn .liIn_left{
width:25%;
position:relative;
padding-left:0.14rem;
}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn .liIn_left .bot{
width:0.08rem;
height:0.08rem;
background:#f78cf3;
border-radius:1000px;
display:block;
position:absolute;
left:0.02rem;
top:0;
bottom:0;
margin:auto 0;
}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn2 .liIn_left .bot{
background:#e7feb8;}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn3 .liIn_left .bot{
background:#fdea8a;}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn4 .liIn_left .bot{
background:#8ff9f8;}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn5 .liIn_left .bot{
background:#d890fa;}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn6 .liIn_left .bot{
background:#05d1fc;}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn .liIn_left zi{
}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn .liIn_line{
width:58%;
height:0.08rem;
background:rgba(255,255,255,0.5);
border-radius:2000px;}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn .liIn_line .line_lineIn{
width:100%;
height:0.08rem;
background:#f78cf3;
border-radius:100px;
-webkit-animation: widthMove1 2s ease-in-out ;}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn2 .liIn_line .line_lineIn{
background:#e7feb8;
-webkit-animation: widthMove2 2s ease-in-out ;}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn3 .liIn_line .line_lineIn{
background:#fdea8a;
-webkit-animation: widthMove3 2s ease-in-out ;
}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn4 .liIn_line .line_lineIn{
background:#8ff9f8;
-webkit-animation: widthMove4 2s ease-in-out ;}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn5 .liIn_line .line_lineIn{
background:#d890fa;
-webkit-animation: widthMove5 2s ease-in-out ;}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn6 .liIn_line .line_lineIn{
background:#05d1fc;
-webkit-animation: widthMove6 2s ease-in-out ;}
@-webkit-keyframes widthMove1 {
0% {width:0%; }
100% { width:98.5%; }
}
@-webkit-keyframes widthMove2 {
0% {width:0%; }
100% { width:88.5%; }
}
@-webkit-keyframes widthMove3 {
0% {width:0%; }
100% { width:68.5%; }
}
@-webkit-keyframes widthMove4 {
0% {width:0%; }
100% { width:40.5%; }
}
@-webkit-keyframes widthMove5 {
0% {width:0%; }
100% { width:22.5%; }
}
@-webkit-keyframes widthMove6 {
0% {width:0%; }
100% { width:10.5%; }
}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_pai ul li .liIn .num{
width:17%;
font-family:dig;
padding-left:0.02rem;}
/*左边底部*/
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_bi ul{
display:block;
/*display: -webkit-flex;*/
flex-wrap:wrap;
width:100%;
}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_bi ul li{
width:33.3%;
text-align:center;
margin-bottom:0.05rem;}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_bi ul li .shu{
font-size:0.14rem;
color:rgba(14,253,255,1);
font-family:dig;
padding:0.12rem 0 0.02rem;
font-weight:normal;}
.leftMain_middle .leftMain_middle_right .leftMain_middle_rightIn .biaoge_bi ul li .zi{
font-size:0.06rem;
color:#fff;}
/*右边部分*/
.rightMain .rightMain_top{
width:100%;
padding-bottom:0.1rem;
}
.rightMain .rightMain_topIn{
border:0.008rem solid rgba(14,253,255,0.5);
width:100%;
/*min-height:60px;*/
position:relative;
padding:0.08rem 0.05rem;
}
.rightMain .rightMain_topIn h3{
font-size:0.08rem;
color:#fff;
margin-bottom:0.05rem;
}
.rightMain .rightMain_topIn .biaoge{
/*min-height:200px;*/
}
.rightMain .rightMain_bottom{
width:100%;
}
.rightMain .rightMain_bottomIn{
border:0.008rem solid rgba(14,253,255,0.5);
width:100%;
/*min-height:60px;*/
position:relative;
padding:0.08rem 0.05rem;
}
.rightMain .rightMain_bottomIn h3{
font-size:0.08rem;
color:#fff;
margin-bottom:0.05rem;
}
/*右下角表格*/
.rightMain .rightMain_bottomIn .biaoge{
/*min-height:200px;*/
}
.rightMain .rightMain_bottomIn .biaoge_list{
overflow:hidden;
position: relative;}
.rightMain .rightMain_bottomIn .biaoge_list .biaoge_listIn .ul_list{
overflow:hidden;
position: relative;}
.rightMain .rightMain_bottomIn .biaoge_list .biaoge_listIn .ul_listIn{
-webkit-animation: 14s gundong linear infinite normal;
animation: 14s gundong linear infinite normal;
position: relative;}
@keyframes gundong {
0% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
100% {
-webkit-transform: translate3d(0, -30vh, 0);
transform: translate3d(0, -30vh, 0);
}
}
.rightMain .rightMain_bottomIn .biaoge_list ul{
display:flex;
display: -webkit-flex;
width:100%;
}
.rightMain .rightMain_bottomIn .biaoge_list .ul_title{
background: linear-gradient(left, rgba(255,255,255,0.1), rgba(255,255,255,0.5), rgba(255,255,255,0.1));
background: -ms-linear-gradient(left, rgba(255,255,255,0.1), rgba(255,255,255,0.5), rgba(255,255,255,0.1));
background: -webkit-linear-gradient(left, rgba(255,255,255,0.1), rgba(255,255,255,0.5), rgba(255,255,255,0.1));
background: -moz-linear-gradient(left, rgba(255,255,255,0.1), rgba(255,255,255,0.5), rgba(255,255,255,0.1));
}
.rightMain .rightMain_bottomIn .biaoge_list .ul_con{
border-bottom:0.008rem solid rgba(14,253,255,0.5);}
.rightMain .rightMain_bottomIn .biaoge_list ul li{
width:20%;
text-align:center;
color:#fff;
font-size:0.06rem;
height:0.2rem;
line-height:0.2rem;}
.rightMain .rightMain_bottomIn .biaoge_list ul li:frist-child{
text-align:left;}
.rightMain_topIn{
border:0.008rem solid rgba(14,253,255,0.5);
width:100%;
min-height:60px;
position:relative;
padding:0.08rem 0.05rem;
}
.rightMain_topIn h3{
font-size:0.08rem;
color:#fff;
margin-bottom:0.05rem;
}
.rightMain_topIn .biaoge{
/*min-height:200px;*/
}
.rightMain_bottom{
width:100%;
}
.rightMain_bottomIn{
border:0.008rem solid rgba(14,253,255,0.5);
width:100%;
/*min-height:60px;*/
position:relative;
padding:0.08rem 0.05rem;
}
.rightMain_bottomIn h3{
font-size:0.08rem;
color:#fff;
margin-bottom:0.05rem;
}
/*右下角表格*/
.rightMain_bottomIn .biaoge{
/*min-height:200px;*/
height: calc(100% - 0.1rem);
}
.rightMain_bottomIn .biaoge_list{
overflow:hidden;
position: relative;}
.rightMain_bottomIn .biaoge_list .biaoge_listIn .ul_list{
overflow:hidden;
position: relative;}
.rightMain_bottomIn .biaoge_list .biaoge_listIn .ul_listIn{
-webkit-animation: 14s gundong linear infinite normal;
animation: 14s gundong linear infinite normal;
position: relative;}
.rightMain_bottomIn .biaoge_list ul{
display:flex;
display: -webkit-flex;
width:100%;
}
.rightMain_bottomIn .biaoge_list .ul_title{
background: linear-gradient(left, rgba(255,255,255,0.1), rgba(255,255,255,0.5), rgba(255,255,255,0.1));
background: -ms-linear-gradient(left, rgba(255,255,255,0.1), rgba(255,255,255,0.5), rgba(255,255,255,0.1));
background: -webkit-linear-gradient(left, rgba(255,255,255,0.1), rgba(255,255,255,0.5), rgba(255,255,255,0.1));
background: -moz-linear-gradient(left, rgba(255,255,255,0.1), rgba(255,255,255,0.5), rgba(255,255,255,0.1));
}
.rightMain_bottomIn .biaoge_list .ul_con{
border-bottom:0.008rem solid rgba(14,253,255,0.5);}
.rightMain_bottomIn .biaoge_list ul li{
width:20%;
text-align:center;
color:#fff;
font-size:0.06rem;
height:0.2rem;
line-height:0.2rem;}
.rightMain_bottomIn .biaoge_list ul li:frist-child{
text-align:left;}
.ul_title {
padding-right:0.02rem;
}
.LineLi {
height:100%;
}