body,html{
    font-family: "SourceHanSansCN-Light";
}
.header {
    width: 100%;
    height: 0.8rem;
    line-height: 0.8rem;
    font-size: 0;
    background: #fff;
}
.header .leftWrapper {
    display: inline-block;
    vertical-align: top;
    width: 50%;
}
.header .leftWrapper .logo {
    display: inline-block;
    vertical-align: middle;
    width: 0.55rem;
    height: 0.55rem;
    background: url("../images/logo.png") no-repeat;
    background-size: cover;
    margin: 0 0.23rem 0 0.5rem;
}
.header .leftWrapper .name {
    display: inline-block;
    vertical-align: middle;
    color: #000;
    font-size: 0.2rem;
}
.header .rightWrapper {
    display: inline-block;
    vertical-align: top;
    width: 50%;
    text-align: right;
}
.header .rightWrapper {
    font-size: 0;
}
.header .rightWrapper  .linkName {
    display: inline-block;
    vertical-align: middle;
    font-size: 0.2rem;
    color: #080404;
    margin-right: 0.96rem;
    position: relative;
}
.header .rightWrapper  .last {
    margin-right: 0.5rem;
}

.header .rightWrapper  .linkName a {
    display: block;
    font-size: 0.2rem;
    color: #080404;
}
.header .rightWrapper  .active a {
    font-family: "SourceHanSansCN-Medium";
}

.header .rightWrapper .linkName .hoverLine {
    display: none;
    position: absolute;
    left: 50%;
    bottom: 0.2rem;
    width: 0.35rem;
    height: 0.04rem;
    margin-left: -0.18rem;
    background: #e4011d;
    z-index: 10;
}
.header .rightWrapper .active .hoverLine  {
    display: block;
}
.header .rightWrapper .linkName:hover .hoverLine{
    display: block;
    background: #e4011d;
    transition: width .6s linear;
    z-index: 10;
}
/* caseBannerone */
.caseBannerone {
    width: 100%;
    box-sizing: border-box;
    position: relative;
}
.imgWrapper {
    width: 100%;
    
}
.imgWrapper .bg {
    display: block;
    width: 100%;
}
.posTitle {
    position: absolute;
    left: 0.8rem;
    bottom: 0.8rem;
}
.posTitle .title {
    font-size: 0.6rem;
    color: #fff;
    margin-bottom: 0.2rem;
}
.posTitle .max {
    color: #fff;
    font-size: 1rem;
}
.posTitle  .curTitle {
    color: #fff;
    font-size: 0.6rem;
}



.con {
    margin: 0 0.8rem;
    box-sizing: border-box;
}
.conTitle {
    font-size: 0;
    margin: 1rem 0 2.02rem;
}
.conTitle  .titleName {
    display: inline-block;
    vertical-align: top;
    width: 1.5rem;
    height: 0.5rem;
    line-height: 0.5rem;
    text-align: center;
    background: #ececec;
    font-size: 0.2rem;
    color: #000000;
    margin-right: 0.57rem;
    cursor: pointer;
}
.conTitle  .titleName:hover{
    background: #000;
    color: #fff;
}
.conTitle  .active {
    background: #000000;
    color: #fff;
}
.conList{
    width: 100%;
    justify-content:space-around; 
    flex-wrap:wrap;
    font-size: 0;
}
.serverList {
   
    display: inline-block;
    vertical-align: top;
    width: -webkit-calc((100% - 1.6rem) / 3 );
    margin-right: 0.8rem;
    
    border-bottom: 0.03rem solid #000;
    box-sizing: border-box;
    margin-bottom: 2.02rem;
}
.conList>a:nth-child(3n+3){
    margin-right: 0;
}
.serverList .titleWrapper{
    font-size: 0;
    color: #000;
    margin-bottom: 0.23rem;
}
.serverList .titleWrapper .leftWrapper {
    display: inline-block;
    vertical-align: middle;
    width: 25%;
    font-size: 0.2rem;
}
.serverList .titleWrapper .rightWrapper {
    display: inline-block;
    vertical-align: middle;
    width: 75%;
    font-size: 0.2rem;
    text-align: right;
    color: #9fa2a5;
} 
.serverList .imgWrapper {
    width: 100%;
    margin-bottom: 0.33rem;
    overflow: hidden;
}
.serverList .imgWrapper .caseImg {
    display: block;
    width: 100%;
    -webkit-transition: -webkit-transform .6s ease;
    -moz-transition: -moz-transform .6s ease;
    -ms-transition: -ms-transform .6s ease;
    transition: transform .6s ease;
    cursor: pointer;
}
.serverList .imgWrapper  .caseNone {
    height: 3.22rem;
}
.serverList .imgWrapper .caseImg:hover{
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2)
}
.serverList .descWrapper {
    height: 2.48rem;
}
.serverList .desc {
    font-size: 0.4rem;
    color: #000;
}
.serverList .descLast {
    margin-bottom: 0.5rem;
}

.initBg {
    width: 1rem;
    height: 1rem;
    background: url("../images/default.gif") no-repeat;
    text-align: center;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -0.5rem;
    margin-top: -0.5rem;
    z-index: 4;
}