body{
    margin:0;
    /*font-family: SourceHanSansCN-Regular, SourceHanSansCN;*/
    font-family: Source Han Sans CN-Regular, Source Han Sans CN;
    background: #FBFBFB;
}
/*.zxhd_banner a{*/
/*    display: block;*/
/*    height: 502px;*/
/*}*/
.zxhdNav {
    width: 100%;
    height: 92px;
    background: #F8F9FB;
}

.zxhdNavBox {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: absolute;
    left: 0;
    right: 0;
    margin-top: -41px;

    background: linear-gradient(0deg, #FFFFFF 0%, #FFFBF8 100%);
    box-shadow: 0px 0px 10px 0px rgba(188, 198, 221, 0.3);
}

#navId {
    height: 30px;
    position: relative;
    z-index: 3;
}

.zxhdNavBox > a {
    /*width: 294px;*/
    width: 25%;
    height: 76px;
    background-color: rgba(255, 255, 255, 0.7);
    border-radius: 4px;
    display: flex;
    justify-content: center;
    box-sizing: border-box;
    padding-left: 80px;
    background-repeat: no-repeat;
    background-position: 14px center;
    flex-direction: column;
    transition: 0.3s;
    position: relative;
}

.zxhdNavBox > a:after {
    content: '';
    width: 1px;
    height: 34px;
    background: #C3C8D0;
    position: absolute;
    right: 0;
}

.zxhdNavBox > a:last-child:after {
    display: none;
}


.zxhdNavBox > a:hover {
    background-color: rgba(255, 255, 255, 0.86);
}

.zxhdNavBox > a:hover > div:nth-child(1) {
    transition: 0.3s;
    color: #C7000B;
}

.zxhdNavBox > a:nth-child(1) {
    background-image: url("img/cloud.png?v=1.2.3.5&");
}

.zxhdNavBox > a:nth-child(2) {
    background-image: url("img/zy.png?v=1.2.3.5&");
}

.zxhdNavBox > a:nth-child(3) {
    background-image: url("img/jz.png?v=1.2.3.5&");
}

.zxhdNavBox > a:nth-child(4) {
    background-image: url("img/aq.png?v=1.2.3.5&");
}

.zxhdNavBox > a > div:first-child {
    font-size: 16px;

    font-weight: bold;
    color: #444444;
}
a{
    text-decoration: none;
}
 .midBoxCss {
     width: 1200px;
     margin-left: auto;
     margin-right: auto;
 }

.zxhdNavBox > a > div:nth-child(2) {
    font-size: 12px;

    font-weight: 400;
    color: #666666;
    opacity: 0.8;
    margin-top: 10px;
}

.zxhdNavTitle {
    font-size: 18px;

    font-weight: bold;
    text-align: center;
}

.zxhdNavTitle a {
    color: #444444;
}

.zxhdNavTitle a:hover {
    color: #C7000B;
}

.zxhdNavDesc {
    font-size: 14px;

    font-weight: 400;
    color: #666666;
    text-align: center;
    margin-top: 12px;
}

.fgx {
    width: 1px;
    height: 64px;
    background: #CCCCCC;
    opacity: 0.6;
}
.zxhd_banner-pagination{
    position: absolute;
    text-align: center;
    bottom:55px!important;
    z-index: 2;
}

.ym-cn{
    background: url("img/cn.png") no-repeat;
}
.ym-com{
    background: url("img/com.png") no-repeat;
}
.ym-top{
    background: url("img/top.png") no-repeat;
}
.ym-net{
    background: url("img/net.png") no-repeat;
}
.ym-cc{
    background: url("img/cc.png") no-repeat;
}

#ymSwiper a{
    background-size: contain;
    display: block;
    height: 106px;
    width: 394px;
    box-sizing: border-box;
    padding-top:20px;
    padding-left: 22px;
}
#ymSwiper{
    margin-top:35px;
}
.zxhd_ym_pagination{
    text-align: center;
}
.zxhd_ym_paginatio>span{
    transition: 0.2s;
}
.zxhd_ym_pagination>.swiper-pagination-bullet-active{
    width: 30px;
    height: 8px;
    background: #B3B3B3;
    border-radius: 3px;
    opacity: 1;
}
.ym-a{
    font-size: 14px;
    font-weight: 400;
    margin-top:10px;
    color: #7E7E7E;
    padding-left: 4px;
}
#ymSwiper a:hover .ym-a{
    color:#EE232E;
}
.ym-title{
    font-size: 20px;
    font-weight: 400;
    color: #333333;
}
.ym-title span{
    color:#EE232E;
}

.module-head-title {
    text-align: left;
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
    color:#2D3241;
    font-size: 28px;
    margin-bottom:36px;
    position: relative;

}

.module-head-title .hdDesc {
    font-size: 14px;
    font-weight: 400;
    color: #444444;
    margin-top: 16px;
}

.djsTimerBox{
    position: relative;

}
.djsTitle{
    font-size: 15px;
    font-weight: 500;
    color: #666666;
    text-align: right;
    margin-bottom:4px;
}
.djsNumBox{
    font-size: 20px;
    font-family: Arial-BoldMT, Arial;
    font-weight: bold;
    color: #E6202B;
    text-align: center;
    margin-top:5px;
}
.djsUnit{
    font-size: 12px;
    font-weight: 600;
    color: #E6202B;
    text-align: center;
    display: block;
    margin-top:-2px;
}
.djs-box{
    background: url("img/djs.png") no-repeat center;
    background-size: contain;
    width: 50px;
    height: 50px;
}
.zxhd-cloud-list{
    display: flex;
    align-items: flex-start;
}
.zxhd-cloud-list>div{
    width: 288px;
    height: 446px;
    background: #FFFFFF;
    border-radius: 9px 9px 9px 9px;
    opacity: 1;
    position: relative;
    transition: 0.2s;
    margin-right: 16px;
}
.zxhd-cloud-list>div:last-child{
    margin-right: 0;
}
.top-right-icon{
    font-size: 14px;
    font-family: AlibabaPuHuiTi-Medium, AlibabaPuHuiTi;
    font-weight: 500;
    color: #FFFFFF;
    position: absolute;
    top:0;
    right: 0;
    height: 29px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding:0 17px;
    background: #2188fb;
    border-radius: 0 9px 0 24px;
    box-sizing: border-box;
    min-width: 90px;
}
.zxhd-cloud-list>div:hover{
    box-shadow: 2px 6px 10px 6px #8282823d;
    z-index: 2;
}

.cloud-title{
    font-size: 21px;
    font-weight: 500;
    color: #333333;
    padding:30px 20px 0 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cloud-desc{
    font-size: 14px;
    font-weight: 400;
    color: #808080;
    height: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding:0 20px;
    margin-top:6px;
}
.cloud-config-box{
    padding:0 15px;
    margin-top:30px;
}

.cloud-spec-row{
    border-bottom:1px solid #f7f7f7;
    padding-bottom:8px;
    font-size: 14px;
    color: #4D4D4D;
    padding-left: 8px;
    display: flex;
    align-items: center;
    margin-top:14px;
}
.cloud-spec-row>div:first-child{
    width: 75px;
    color:#808080;
}
.now-price{
    font-size: 14px;
    font-weight: 400;
    color: #EE232E;
}
.zxhd-yj-price{
    font-size: 14px;
    font-weight: 400;
    color: #333333;
    margin-left: 12px;
}
.zxhd-percent{
    height: 3px;
    background: #B3B3B3;
    border-radius:2px;
    opacity: 1;
    margin:10px 20px;
    position: relative;
}
.zxhd-render{
    position: absolute;
    height: 100%;
    top:0;
    background: #E6202B;
    border-radius:2px;
    transition: 0.2s;
}
.zxhd-render span{
    width: 9px;
    height: 9px;
    background: #FFFFFF;
    opacity: 1;
    border: 2px solid #E6202B;
    display: block;
    border-radius: 50%;
    box-sizing: border-box;
    position: absolute;
    right: 0;
    margin-top:-3px;
}
.zxhd-render span:after{
    content:attr(data-font);
    position: absolute;
    font-size: 12px;
    color: #999999;
    white-space: nowrap;
    margin-top: 10px;
    margin-left: -10px;
}
.zxhd-buy-btn{
    width: 114px;
    height: 41px;
    background: white;
    border-radius: 20px;
    opacity: 1;
    border: 1px solid #333333;
    box-sizing: border-box;
    /*transition: 0.2s;*/
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 400;
    color: #333333;
    cursor: pointer;
}
.zxhd-buy-btn:hover{

    background: linear-gradient(270deg, #FF4C47, #E6202B);
    color:white;
    border:none;
}
.zxhd-select{
    position: relative;
    font-size: 14px;
    color: #4D4D4D;
}
.zxhd-select>span.zxhd-select-title{
    background: url("img/arrow.png") no-repeat right;
    padding-right: 20px;
    width: 96px;
    background-position-y: 5px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
}
.zxhd-select>span.zxhd-select-title.show{
    background: url("img/arrow-up.png") no-repeat right;
}
.zxhd-select-drop{
    position: absolute;
    background: #F3F3F3;
    border-radius: 5px;
    overflow: hidden;
    opacity: 1;
    width: calc(100% + 10px);
    margin-left: -7px;
    margin-top:10px;
    display: none;
    z-index: 2;
}
.zxhd-select-drop>div{
    cursor: pointer;
    height: 28px;
    border-bottom:1px solid #DBDBDB;
    padding-left: 6px;
    padding-right: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.zxhd-select-drop>div:last-child{
    border-bottom:none;
}
.zxhd-select-drop>div.on,.zxhd-select-drop>div:hover{
    background: #E1E0E0;
}

.zxhd-host-list{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.zxhd-host-list>div{
    width: 592px;
    height: 264px;
    background: #FFFFFF;
    border-radius: 9px;
    transition: 0.2s;
    box-sizing: border-box;
    position: relative;
    padding:25px 60px 20px 20px;
    margin-bottom:20px;
}
.zxhd-host-list>div:hover{
    box-shadow: 2px 6px 10px 6px #8282823d;
    z-index: 2;
}

.host-title{
    font-size: 20px;
    font-weight: 500;
    color: #333333;
}
.host-row{
    display: flex;
    align-items: flex-start;
    margin-top:20px;
}
.host-spec-box{
    font-size: 14px;
    /*font-weight: 500;*/
    color: #4D4D4D;
}
.host-spec-box:before{
    content:attr(data-font);
    display: block;
    font-size: 14px;
    color: #808080;
}
.zxhd-host-line{
    width: 2px;
    height: 35px;
    background: #DBDBDB;
    border-radius: 1px;
}
.zxhd-zk-css{
    min-width: 37px;
    padding:0 5px;
    height: 17px;
    background: transparent;
    opacity: 1;
    border: 1px solid #E21B26;
    font-size: 12px;
    color: #E6202B;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
}
.host-yqg{
    font-size: 12px;
    color: #999999;
    white-space: nowrap;
    margin-left: 12px;
}
.zxhd-yjz-list{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.zxhd-yjz-list>div{
    width: 386px;
    height: 456px;
    background: #FFFFFF;
    transition: 0.2s;
    border-radius: 9px;
    position: relative;
}
.zxhd-yjz-list>div:hover{

    box-shadow: 2px 6px 10px 6px #8282823d;
}

.yjz-title{
    font-size: 20px;
    font-weight: 500;
    color: #333333;
    padding-top:25px;
    padding-left: 25px;
}
.yjz-desc{
    font-size: 12px;
    font-weight: 400;
    color: #808080;
    padding-left: 25px;
    margin-top:6px;
}
.yjz-zk{
    height: 25px;
    background: linear-gradient(to right, white, rgba(219, 219, 219, 0.2));
    display: flex;
    align-items: center;
    padding-left: 25px;

    font-size: 12px;
    /*font-weight: 300;*/
    color: #EE232E;
    margin-top:20px;
}
.yjz-row{
    display: flex;
    align-items: center;
    padding-left: 25px;
    margin-top:24px;
}
.yjz-row>div{
    font-size: 14px;
    font-weight: 300;
    color: #666666;
    background: url("img/hx.png") no-repeat;
    background-position-x: left;
    padding-left: 30px;
    width: 48%;
    box-sizing: border-box;
}
.yjz-line{
    height: 1px;
    background: #f7f7f7;
    margin:25px;
    margin-bottom:36px;
}
.zxhd-idc-list{
    display: flex;
    padding-bottom:60px;
}
.zxhd-idc-list>div{
    transition: 0.2s;
    position: relative;
    width: 288px;
    height: 460px;
    background: #FFFFFF;
    border-radius: 9px 9px 9px 9px;
    opacity: 1;
    margin-right: 16px;
}
.zxhd-idc-list>div:last-child{
    margin-right: 0;
}
.zxhd-idc-list>div:hover{
    box-shadow: 2px 6px 10px 6px #8282823d;
}
.idc-title{
    font-size: 20px;
    font-weight: 500;
    padding-top:35px;
    padding-left: 22px;
    color: #333333;
}
.idc-desc{
    font-size: 12px;
    font-weight: 300;
    color: #808080;
    padding-left: 22px;
    margin-top:6px;
}
.idc-line{
    margin:20px 15px;
    height: 1px;
    background: #f7f7f7;
}
.idc-row{
    display: flex;
    align-items: center;
    font-size: 14px;
    font-weight: 300;
    color: #4D4D4D;
    padding-left: 22px;
    height: 30px;
}
.idc-row>div:first-child{
    width: 100px;
    color:#808080;
}

.more-position > div {
    width: 390px;
    height: 125px;
    display: inline-block;
    box-sizing: border-box;
    padding-top: 22px;
    padding-left: 26px;
    margin-right: 10px;
    margin-bottom: 20px;
    /*box-shadow: 0 0 10px #f4f4f4;*/
    transition: 0.2s;
    position: relative;
}
.more-position > div:hover{
    box-shadow: 2px 6px 10px 6px #8282823d;
}

.more-position > div:nth-child(3n) {
    margin-right: 0;
}

.more-position .zxhd-bottom-1 {

    background: url("img/zxhd_icon_1.png?v=1.2.3.5&") no-repeat center;
    background-size: cover;
}

.more-position .zxhd-bottom-2 {

    background: url("img/zxhd_icon_2.png?v=1.2.3.5&") no-repeat center;
    background-size: cover;
}

.more-position .zxhd-bottom-3 {

    background: url("img/zxhd_icon_3.png?v=1.2.3.5&") no-repeat center;
    background-size: cover;
}

.more-position .zxhd-bottom-4 {

    background: url("img/zxhd_icon_4.png?v=1.2.3.5&") no-repeat center;
    background-size: cover;
}

.more-position .zxhd-bottom-5 {

    background: url("img/zxhd_icon_5.png?v=1.2.3.5&") no-repeat center;
    background-size: cover;
}

.more-position .zxhd-bottom-6 {

    background: url("img/zxhd_icon_6.png?v=1.2.3.5&") no-repeat center;
    background-size: cover;
}

.more-position .zxhd-bottom-7 {

    background: url("img/zxhd_icon_7.png?v=1.2.3.5&") no-repeat center;
    background-size: cover;
}

.more-position .zxhd-bottom-8 {
    background: url("img/zxhd_icon_8.png?v=1.2.3.5&") no-repeat center;
    background-size: cover;
}

.more-position .zxhd-bottom-9 {

    background: url("img/zxhd_icon_9.png?v=1.2.3.5&") no-repeat center;
    background-size: cover;
}

.zxhd-b-title {
    font-size: 20px;
    font-weight: 400;
    color: #2D3241;
}

.zxhd-b-desc {
    font-size: 12px;
    font-weight: 400;
    margin-top:5px;
    color: #2D3241;
}

.zxhd-b-desc span {
    color: #EE232E;
}
.zxhd-b-a{
    margin-top:10px;
}
.zxhd-b-a > a {
    font-size: 12px;
    font-weight: 400;
    color: #827F7F;
}

.zxhd-b-a > a:hover {
    color: #EE232E;
}


.yh-modal{
    position: fixed;
    left: 0;
    right: 0;
    top:0;
    bottom:0;
    z-index: 9999999999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.34);
    flex-direction: column;
}
.yh-layer-box{
    background: white;
    width: 600px;
    min-height: 300px;
    border-radius: 20px;
    position: relative;
    padding-bottom:12px;
    background: url("img/yhq-box-bg.png") no-repeat center;
    background-size: cover;
}
.yh-activity-title{
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    color:#181818;
    padding-top:22px;
    padding-bottom:16px
}
.activity-rules{
    text-align: center;
}
.activity-rules span{
    cursor: pointer;
    font-size: 14px;
    color:#333;
    text-decoration: underline;
}
.activity-rules-box{
    width: 700px;
    height: 476px;
    border-radius: 20px;
    background: white;
    padding:22px;
}
.activity-rules-box .title{
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    /*padding:15px 0;*/
}
.hide-rules-btn{
    text-align: center;
}
.hide-rules-btn span{
    cursor: pointer;
    color:white;
    background: #c7000b;
    width: 60px;
    height: 32px;
    border-radius: 22px;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.hide-rules-btn span:hover{
    opacity: 0.8;
    transition: 0.3s;
}
.rules-content{
    height: 358px;
    overflow: auto;
    margin:30px 0;
}
#closeModalBtn{
    position: absolute;right: 0;
    margin-top:-30px;
    margin-right: -30px;
    color:white;
    font-size: 22px;
    cursor: pointer;
}
.get-activity-coupon-row{
    text-align: center;
}
.get-activity-coupon-row span{
    cursor: pointer;
    width: 180px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #c7000b;
    color:white;
    font-size: 18px;
    border-radius: 40px;
}
.get-activity-coupon-row span:hover{
    transition: 0.3s;
    opacity: 0.8;
}
.activity-coupon-list{
    min-height: 100px;
    max-height: 200px;
    margin:20px 0;
    padding:0 20px;
    overflow: auto;
    display: flex;
    flex-wrap: wrap;
}
.activity-coupon-list>div{
    background: url("img/yhq-bg.png") no-repeat;
    width: 128px;
    height: 54px;
    background-size: 128px 54px;
    margin-right: 16px;
    margin-bottom: 12px;
    position: relative;
    box-sizing: border-box;
    padding-top:4px;
    padding-left: 10px;
}
.activity-coupon-list>div:nth-child(4n){
    margin-right: 0;
}
.activity-coupon-list .desc{
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #fff;
}
.activity-coupon-list .money{
    color: #fff;
    font-size: 18px;
    font-weight: 700;
}
.activity-coupon-list .money:before{
    content:'\ffe5';
    font-size: 12px;
    font-weight: normal;
}
.activity-coupon-list .money.zk:before{
    display: none;
}
.activity-coupon-list .num{
    position: absolute;
    right: 10px;
    top:0;
    font-size: 14px;
    margin-top: 16px;
    color:white;
}


.activity-coupon-list {
    scrollbar-width: thin;
}

.activity-coupon-list::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.activity-coupon-list::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .2);
    /*background:linear-gradient(to top, #fcf5ee, #faf7e6,#73d2f3,#eeeeee);*/
    background: #E8E2D8;
    border-radius: 1px;
    display: none;
}

.activity-coupon-list::-webkit-scrollbar-thumb {
    border-radius: 1px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .2);
    /*background:linear-gradient(to top, #fcf5ee, #faf7e6,#73d2f3,#eeeeee);*/
    background: #E8E2D8;
}

.activity-coupon-list::-webkit-scrollbar-track-piece {
    background-color: #e8e8e8;
}