body{
    font-size: 62.5%;
}

img {
    image-rendering: -moz-crisp-edges;
    image-rendering: -o-crisp-edges;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
    -ms-interpolation-mode: nearest-neighbor;
}
.container {
    /*width: 1200px!important; */
}

a:link {
    text-decoration: none;
}
a:visited {
    text-decoration: none;
}
a:hover {
    text-decoration: none!important;
    color: #2693b5;
}
a:active {
    text-decoration: none;
}

.mt-10 {
    margin-top: 10px;
}

.mt-20 {
    margin-top: 20px;
}

.mt-30 {
    margin-top: 30px;
}

.mt-40 {
    margin-top: 40px;
}

.mt-50 {
    margin-top: 50px;
}

.mt-60 {
    margin-top: 60px;
}

.mt-70 {
    margin-top: 70px;
}

.mt-80 {
    margin-top: 80px;
}

.mt-90 {
    margin-top: 90px;
}

.mt-100 {
    margin-top: 100px;
}

.ml-10 {
    margin-left: 10px;
}

.ml-20 {
    margin-left: 20px;
}

.ml-30 {
    margin-left: 30px;
}

.ml-40 {
    margin-left: 40px;
}

.ml-50 {
    margin-left: 50px;
}

.ml-60 {
    margin-left: 60px;
}

.ml-70 {
    margin-left: 70px;
}

.ml-80 {
    margin-left: 80px;
}

.mr-10 {
    margin-right: 10px;
}

.mr-20 {
    margin-right: 20px;
}

.mr-30 {
    margin-right: 30px;
}

.mr-40 {
    margin-right: 40px;
}

.mb-10 {
    margin-bottom: 10px;
}

.mb-20 {
    margin-bottom: 20px;
}

.mb-30 {
    margin-bottom: 30px;
}

.mb-40 {
    margin-bottom: 40px;
}

.mb-50 {
    margin-bottom: 50px;
}

.mb-60 {
    margin-bottom: 60px;
}
.top-5 {
    top:-5px;
    margin:5px ;
}
.top-10 {
    top:-10px;margin:5px ;
}
.layui-wthot{
    position: relative;
    display: inline-block;
    /*padding: 0 6px;*/
    font-size: 12px;
    text-align: center;
    color: #fff;
    border-radius: 2px;
    height: 18px;
    line-height: 18px;
}
.layui-btn {
  
}
.HOT {
    background-color: #167491;
}

.Sell {
    background-color: #FF5722;
}
.ICO {
    background-color:#fff;
}

/** 导航 CSS**/

/*.w1200 {width:1200px;flex-shrink:0；}*/
.dl-zc{
    display: flex;
    justify-content: flex-end;
}


.container_flex{
    display: flex;
   justify-content: space-between;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    align-items: center;
}
.index-top{
    height: 80px;
    position: fixed !important;
    z-index: 999;
    width: 100%;
    background: #fff;
    border-bottom: 1px solid #eee!important;
}
.layui-nav-bg{
    background-color: #fff;
}
.wap-nav{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
    padding: 5px;
    position: fixed !important;
    z-index: 999;
    width: 100%;
    background: #fff;
    border-bottom: 1px solid #eee!important;
}
.wap-nav-logo img{
    width: 150px;
}
.wap-nav-login{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
}
.wap-nav-login i{
    font-size: 30px;
    margin-left: 20px;
}
.wap-menu{
    position: absolute;
    top: 64px;
    left: 0;
    z-index: 9999;
}
.wap-menu-show{
    display: block;
}
.wap-menu-hide{
    display: none;
}
.container-logo{
    display: flex;
    align-items: center;
}
.container-logo .logo{
    /*margin-right: 20px;*/
}
.container-logo .logo img{
    height: 50px;
}
.layui-nav-child dd {
    line-height: 300%;
    
}

.pc_zdh {
    margin-top:13px;
}


#ld {
    color: #333;
}

#zc{
    border: 1px solid #34a7ca;
    padding: 0 30px;
    color: #fff;
    background-image: -webkit-gradient(linear,right top,left top,from(#33a6c9),to(#167491));
    background-image: -webkit-linear-gradient(right,#33a6c9,#167491);
    background-image: linear-gradient( 90deg,#33a6c9,#167491);
}

.layui-nav-item .nav-a i{
    color: #fff;
}

/** 导航 END CSS**/

/** 幻灯片 CSS**/
@media (min-width:1200px ) {
    .banner-img{
        height: 627px;
    }
}
@media (min-width:992px ) {
    .banner-img{
        height: 522px;
    }
}
@media (min-width:768px ) {
    .banner-img{
        height: 400px;
    }
}
.layui-nav-item .nav-a{
    color: #333!important;
    font-size: 16px;
}
.nav-a:hover{
    color: #333!important;
}
#index-banner .banner-item > div > img{
    width: 100%;
    height: 100%;
}
.join {
    padding: 86px 0 78px 0;
    background-color: #eaecf1;
    background-position: 50%;
    background-size: auto 100%;
    background-image: url(https://www.lfzidc.com/themes/web/ZdsjuM1/style/image/pc-hunheyun.jpg);
    /*background-repeat: no-repeat;*/
    background-attachment: fixed;
    text-align: center;
    /*filter:alpha(opacity=40);-moz-opacity:0.4;opacity:0.40;*/
}
.join .title {
    font-size: 30px;
    letter-spacing: 3px;
    line-height: 1;
    color: #333;
    font-weight: 500;
    text-align: center;
    margin-bottom: 8px;
}
.join .desc {
    font-size: 16px;
    line-height: 1.7;
    color: #666;
}


/* 新闻中心 start */
.news{
    background: #f7f7f9;
    padding: 3em 0 3.8em;
}
.news-item {
    background-color: #fff;
    padding: 2em;
    height: 300px;
}
.news-item-top{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: flex-start;
}
.news-item-time{
    width: 6em;
    height: 5em;
    padding-top: 1em;
    line-height: 1.5em;
    border: 1px solid #e2e3e8;
    background: #f0f2f5;
    text-align: center;
    color: #666666;
    margin-right: 0.5em;
}
.news-item-title{
    display: inline-block;
    line-height: 1.5em;
    text-align: left;
    color: #000000;
    width: 70%;
    padding-bottom: 10px;
}
.news-item-title>img{
    width: 30px;
    height: 30px;
    margin-right: 12px;
}
.news-item-title>a{
    font-weight: 600;
    font-size: 16px;
    line-height: 28px;
    color: #252b3a;
    -webkit-transition: .2s;
    transition: .2s;
}
.news-item-title>a:hover{
    text-decoration: none;
    color: #2b62f1;
}
.news-hr>li:first-child>.news-item{
    border: none;
}

.news-hr>li>.news-item{
    border-left: 1px solid #dfe1e6;
}

@media (max-width:768px ) {
    .news-hr>li>.news-item{
        border-left:none;
        border-top: 1px solid #dfe1e6;
    }
}

.news-item>ul>li{
    padding: 6px 0;
}
.news-item>ul>li>a{
    display: block;
    font-size: 14px;
    line-height: 22px;
    color: #252b3a;
    -webkit-transition: .2s;
    transition: .2s;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.news-item>ul>li>a>em{
    font-style: normal;
    font-weight: 600;
    color: inherit;
}
.news-item-doc{
    color: #666;
    height:4.2em ;
}
.solution-index li div {
    box-sizing: border-box;
    padding: 1.5em 2em;
    transition: .5s;
    cursor: pointer;
}
.solution-index li:first-child>div,.solution-index li:nth-child(2)>div{
    border-right: 1px solid #eeeeee;
    border-bottom: 1px solid #eeeeee;
}
.solution-index li:nth-child(3)>div{
    border-bottom: 1px solid #eeeeee;
}
.solution-index li:nth-child(4)>div,.solution-index li:nth-child(5)>div{
    border-right: 1px solid #eeeeee;
}



.solution-index li div:hover  {
    background-image: linear-gradient(-45deg, #2fc8ea, #00729c, #0077cc);
    box-shadow: 2px 2px 16px rgb(14 36 96 / 8%);
    transition: .3s;
}

.solution-index li div:hover  h3 {
    color: #fff!important;
}

.solution-index li div:hover p {
    color: #eee!important;
}

.solution-index li div h3{
    font-size: 1.5em;
    color: #333;
    font-weight: 500;
    line-height: 50px;
}
.solution-index li div p{
    font-size: 1em;
    line-height: 1.5em;
    color: #666;
    height: 7.5em;
}


/* 产品中心 start */
.product-index{
    text-align: center;
}
.product-cate{
    padding: 2em 0;
}
.product-cate li .product-index{
    cursor: pointer;
}
.product-index-title{
    font-size: 1.2em;
}
.product-service {
    border: 1px solid #eeeeee;
    background: #fff;
    border-radius: 5px;
    box-sizing: border-box;
    box-shadow: 2px 2px 16px rgb(14 36 96 / 8%);
    padding: 1.2em;
    cursor: pointer;
}
.product-service .title {
    height: 55px;
    padding-top: 20px;
    font-size: 20px;
    color: #333;
    text-align: center;
    box-sizing: border-box;
}

.product-service .title  span{
    padding: 0 6px;
}

.product-service .title2{
    width: 80%;
    margin: 0 auto;
    text-align: center;
    color: #666;
}
.product-service hr{
    margin-top: 10px;
}
.product-service .detail p {
    line-height: 1.8em;
    color: #666666;
    text-indent: 1.5em;
}
.product-service .price{
    color: #333;
    font-size: 1.8rem;
    text-align: center;
}
.product-service .more {
    text-align: center;
    margin-top: 1em;
}
.product-doc-left{
    border-right: 2px solid rgba(153,153,153,.2);
}

.product-doc-left h3{
    color: rgb(102,102,102);
}
.product-doc-left p {
    height: 2em;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.product-doc-left ul li {
    font-size: 15px;
    line-height: 45px;
    text-align: left;
    color:#333;
}
/*.product-doc-left ul li:before{*/
/*    content: "";*/
/*    display: inline-block;*/
/*    width: 6px;*/
/*    height: 6px;*/
/*    margin-right: 5px;*/
/*    background-color:#2693b5;*/
/*    border-radius: 50%;*/
/*}*/
.product-doc-right ul li a{
    text-decoration: none;
}
.product-doc-right ul li a h3{
    font-weight: normal;
    font-size: 18px;
    color: #333;
}
.product-doc-right ul li a p{
    font-size: 14px;
    line-height: 22px;
    color: #666;
}


/* 云盾 start */
div.yun_dun{
    background: url(../images/bg.jpg) top center no-repeat;
    background-size: cover;
    background-attachment: fixed;
}
div.yun_dun .title{
    text-align: center;
    font-size: 1.8em;
    margin: 0 0 2em;
    color: #fff;
    padding-top: 2em;
}

div.num-one{
    text-align:center;
    color:#aaa;
    line-height: 1.5em;
}

div.num-one a{
    color:#aaa;font-size:12px;
}
div.num-one h3{
    color:#fff;
    font-size:1.5em;
    font-weight:bold;
    letter-spacing:2px
}
div.num-one h3 span{
    color:#aaa;
    font-size:1em;
    font-weight:normal;
    padding-left:5px
}
div.num-one p strong{
    font-size:1em;
    font-weight:bold;
    color:#fff;
    padding:0 5px
}
div.num-one a:hover{
    color:#059fff;
}
div.yun_img{
    width: 50%;
    text-align:center;
    margin:0 auto;
}
div.yun_img img{
    width: 50%;
    text-align:center
}


/* 合作伙伴 */
.cooperation {
    padding: 56px 0;
    background: url(../images/cooperation.png) no-repeat center;
    background-size: cover;
}
.cooperation-list {
    margin-top: 48px;
}
.product-title{
    text-align: center;
    margin: 50px 0;
}
.product-title h3{
    margin-bottom: 20px;
    line-height: 34px;
    color: #000000;
    font-size: 34px;
    font-weight: normal;
}
.product-title p{
    font-size: 16px;
    color: #666666;
}
.cooperation-list li {
    margin-bottom: 10px;
}
.cooperation-list li a {
    display: block;
    text-align: center;
    background: #fff;
}
.cooperation-list li img {
    vertical-align: middle;
    margin: 0  auto;
}
/** footer CSS**/
.foot {
    background-color: #f3f3f3 !important;
    width: 100%;
    overflow: hidden;
}
.footer {
    padding-top: 70px;
    padding-bottom: 30px;
}
.footer-top{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    align-items: flex-start;
    padding-top: 20px;
}
.footer-top>div:first-child{
    margin-right: 20px;
}
.footer-top>div:last-child>h2{
    font-size: 18px;
    margin-top: 10px;
}
.footer-top>div:last-child>span{
    color: #666a75;
}
.footer-con{
    padding-bottom: 10px;
    display: flex;
}
.footer-con-left{
    flex-shrink: 0;
    width: calc(100% - 242px);
}
.footer-con-right{
    flex-shrink: 0;
    width: 242px;
}
.footer-con-left>dl{
    width: 20%;
}
@media only screen and (max-width: 768px){
    .footer-con{
        display: flex;
        flex-direction: column;
    }
    .footer-con-left{
        width: 100%;
        
    }
    .footer-con-left>dl{
        width: 50%;
        display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    }
    
    
    .footer-con-right {
        width: 100%;
            display: flex;
    flex-direction: column;
    align-content: center;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    }
}


.footer-con-left>dl>dt{
    margin-bottom: 12px;
    font-weight: 700;
    line-height: 18px;
    color: #252b3a;
}
.footer-con-left>dl>dd{
    font-size: 14px;
    line-height: 30px;
}
.footer-con-left>dl>dd>a{
    -webkit-transition: .2s;
    transition: .2s;
    color: #666a75;
}
.footer-con-left>dl>dd>a:hover{
    color: #2693b5;
}

.footer-con-right>h4{
    margin-bottom: 12px;
    font-size: 14px;
    line-height: 18px;
    color: #252b3a;
}
.footer-con-right>p{
    font-size: 20px;
    line-height: 22px;
    color: #252b3a;
    font-weight: 600;
    position: relative;
}
.footer-con-right>p>i{
    display: inline-block;
    width: 20px;
    height: 20px;
    background-size: 100% 100%;
    margin-right: 8px;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transition: all .2s;
    transition: all .2s;
    /*background-image: url("/skin/images/new/red-phone.svg");*/
}

.foot_ico {
    
}
.foot_ico span{
    margin-right: 20px;
}
.footer-con-right>a{
    line-height: 200%;
    color: #252b3a;
}
.footer-con-right>a:hover{
    color: #252b3a!important;
}
.footer-con-right>p>span{
    margin-left: 28px;
    color: #167491;
}

.footer-likes{
    display: flex;
}
.footer-likes>.footer-likes-title{
    font-weight: 600;
    color: #252b3a;
    font-size: 14px;
    padding-top: 8px;
    line-height: 18px;
}
.footer-likes>.footer-likes-content{
    margin-left: 20px;
    width: calc(100% - 86px);
}
.footer-likes>.footer-likes-content>a{
    display: inline-block;
    font-weight: 400;
    color: #575d6c;
    font-size: 14px;
    line-height: 18px;
    -webkit-transition: .2s;
    transition: .2s;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    margin-right: 32px;
    margin-top: 8px;
}
.footer-likes>.footer-likes-content>a:hover{
    color: #252b3a!important;
}
.foot .btzt{
    font-size: 16px;
    color: #999;
}

.foot .telz {
    display: flex;
    flex-direction: column;
    align-content: flex-start;
    align-items: flex-start;
}

.teladnbt {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    align-content: flex-start;
    align-items: flex-start;
}

.font-gray {
    color: #999999;
}

.footerxbt {
    color: #999999;
}
.w25{
    width: 25%;
    float: left;
}
.footer .tel {
    color:#fff !important;
    font-size:28px


}
.footernr {
    float: left;
    text-align:center;

}
.footer-info{
    line-height: 60px;
    background: #1A1A1A;
    overflow: hidden;
    width:100%;
}
.font-right {
    text-align: left;
    padding-top: 20px;
    padding-bottom: 20px;
}
.font-right>a:before{
    content: "|";
    width: 5px;
    text-align: center;
    padding: 0 5px;
    color: #999999;
}
.font-right>a:first-child:before{
    content: "";
    padding: 0;
    width: 0;
}
.font-right a:hover {
    color: #999!important;
}
.footer-nav-title {
    font-size: 16px;
    width: 120px;
    height: 30px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    float: right;
    display: flex;
    justify-content: flex-end;
}
.footer-nav-title.active {
    border-bottom: 1px solid rgba(255, 255, 255, 1);

}
.w25 a p {
    cursor: pointer;
    margin-top: 20px;
    color: #999;
    line-height: 1;
    font-size: 14px;
}
.foot_dblj {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    flex-wrap: nowrap;
    align-content: space-around;
    justify-content: flex-end;
}
.foot a:hover {
    color: #eee;
}

@media only screen and (max-width: 768px) {
    .footer .foot_dblj {
        display: flex;
        flex-direction: column;
        align-items: center;

    }
    .footer .footer-nav-title {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

}


.footer .foot_dblj {
    display: flex;
    flex-direction: column;
    align-items: center;

}
.footer .footer-nav-title {

    display: flex;
    flex-direction: column;
    align-items: center;
    height: 30px;
    line-height: 30px;
}
.foot .telz {

    display: flex;
    align-items: center;
}

.teladnbt {

    display: flex;
    align-items: center;
}

.foottb {
    display: flex;
    align-items: center;
    justify-content: center;
    width:auto!important;
}

.foottb a{
    padding:0 10%;
}

.foottb  {
    width:100%;
    display: flex;
    align-items: center
}
.foottb i {
    color: #999;
    font-size: 30px;
}
.foottb a {
    display: inline-block;
    padding-right:  15%;
}
/** Banner CSS**/
.banner-bg .container{
    position: relative;
}
.banner-bg .container .banner-text{
    margin-top: 125px;
}
.banner-bg .container .banner-text button{
    /*margin-left: 50px;*/
    margin-top: 20px;
}
.banner-bg {
    background-image:url(../images/banner_bg.png);
    background-repeat: no-repeat;
    /*background-size: cover;*/
    width: 100%;
    height: 50rem;
    background-attachment: fixed;
}


.banner-gywm-bg {
    background-image:url(../images/gywm_bg.jpg);
    background-repeat: no-repeat;
    /*background-size: cover;*/
    width: 100%;
    height: 50rem;
    background-attachment: fixed;
}


.font-gray ul li a{
    color: #999;
}
.banner-right-img{
    position: absolute;
    right: 0;
    top: 125px;
    width: 50%;
}

/** DDoS CSS**/
/** 产品优势 CSS**/
.ddos-title{
    text-align: center;
    padding: 1em 0;
}
.ddos-goodness li{
    height: 300px;
    text-align: center;
}
.ddos-goodness li h3{
    color: #0a1633;
    font-weight: bold;
    font-size: 18px;
    line-height: 50px;
}
.ddos-goodness li:hover h3:after{
    width: 60px;
}
.ddos-goodness li h3:after{
    left: 50%;
    transform: translateX(-50%);
    height: 2px !important;
    background-image: linear-gradient(90deg , #3543db 0%, #2124cd 100%), linear-gradient(#32363f, #32363f) !important;
    content: '';
    width: 20px;
    background-color: #333;
    display: block;
    position: absolute;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}
.ddos-goodness li p{
    text-align: left;
    color: #6b798e;
    line-height: 25px;
    overflow: hidden;
}
/** 产品功能 CSS**/
.ddos-fun{
    background: #f7fafd;
}
.ddos-fun-list li{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    padding-bottom: 20px;
    padding-top: 20px;
}
.ddos-fun-list li .ddos-fun-img{
    margin-right: 25px;
}
.ddos-fun-list li .ddos-fun-text h3{
    color: #32363f;
    font-size: 18px;
    margin-top: 0;
    font-weight: bold;
}
.ddos-fun-list li .ddos-fun-text p{
    color: #6d6f74;
    line-height: 150%;
}
/** 产品价格 CSS**/
.ddos-price table{
    width: 100%;
    border: 1px solid #ddd;
    margin-top: 32px;
    text-align: center;
    color: #333333;
    margin-bottom: 55px;
    border-collapse: collapse;
    border-spacing: 0;
}

.ddos-price table tr{
    border-bottom: 1px solid #ddd;
}
.ddos-price table td{
    border-right: 1px solid #ddd;
    text-align: center;
}
.ddos-price table strong {
    font-size: 16px;
    line-height: 16px;
    margin-top: 32px;
    display: block;
    color: #666;
    font-weight: normal;
}
.ddos-price table em {
    display: block;
    font-size: 14px;
    margin-top: 16px;
    color: #444444;
    font-style: normal;
}
.ddos-price table em span {
    font-size: 24px;
}
.ddos-price table th {
    border-right: 1px solid #ddd;
}
.ddos-price table tbody th {
    height: 48px;
    line-height: 48px;
    color: #666;
    font-weight: normal;
    box-sizing: border-box;
    text-align: center;
}
.ddos-price table thead tr td:nth-child(n+2) a {
    border-radius: 30px;
}
.ddos-price table thead tr td:nth-child(2) a {
    border-radius: 30px;
    background: #ff7101;
}



.ddos-price table thead a {
    margin-top: 16px;
    margin-bottom: 32px;
}
.ddos-icon {
    border-radius: 50%;
    width: 25px;
    height: 25px;
    background-color: orangered;
    font-size: 20px;
    display: inline-block;
    text-align: center;
    line-height: 25px;
    color: #fff;
    font-weight: bold;
}

/** 服务器 CSS**/
@media only screen and (max-width: 768px) {
    .banner-service-bg{
        background-image: url(../images/mod_cp_1.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        height: 40rem!important;
    }
    .banner-bg {
        background-image:url(../images/banner_bg.png);
        background-repeat: no-repeat;
        background-size: cover;
        width: 100%;
        height: 40rem!important;
    }
}
.banner-service-bg{
    background-image: url(../images/dsbg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    height: 50rem;
    /*background-attachment: fixed;*/
}
.banner-service-bg .banner-text {
    padding-top: 10%;
}
.banner-service-bg .banner-text h1{
    margin-bottom: 22px;
    height: 46px;
    line-height: 46px;
    font-size: 52px;
    color: #333;
    font-weight: normal;
}
@media only screen and (max-width: 768px) {
    .banner-service-bg .banner-text h1{
        padding-top:0.1em;
        font-size: 2em;
        line-height: 3em;
    }
}
.banner-service-bg .banner-text p{
    margin-bottom: 42px;
    max-width: 524px;
    font-size: 14px;
    color: #666;
    line-height: 30px;
}
.service-node{
    margin-top: 30px;
}
.service-node li a{
    display: block;
    border: 1px solid #ced9f2;
    font-size: 14px;
    line-height: 40px;
    text-align: center;
    color: #333;
}
.service-node li a:hover, .service-node li a.active{
    background-image: linear-gradient(to right, #33a6c9 , #167491);
    border: 1px solid #ced9f2;
    color: #fff;
    text-decoration: none;
}
.service-trait{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    padding: 10px;
    margin-bottom: 20px;
    cursor: pointer;
}
.service-trait .service-trait-img{
    margin-right: 40px;

}


@media only screen and (max-width: 768px){
    .service-trait {
        flex-direction: column;


    }
    .service-trait .service-trait-img {
        margin:0;
    }
    .service-trait-text{
        display:flex;
        align-items: center;
        flex-direction: column;
    }
}

.service-trait-item:hover{
    box-shadow: 1px 1px 15px rgba(223, 223, 223, 0.65);
}
.service-trait .service-trait-text p{
    margin-top: 16px;
    /*padding-right: 40px;*/
    line-height: 28px;
    font-size: 16px;
    color: #666;
}
.service-r th, .service-r td{
    text-align: center;
}
.service-table-bg{
    background-color: #fafafa;
}
.service-scene{
    border: 1px solid #eee;
    text-align: center;
    padding: 15px;
}
.service-scene span{
    width: 45px;
    height: 3px;
    background: #009dff;
    margin: 0 auto 10px auto;
    display: block;
}
.service-scene .service-scene-title{
    font-size: 16px;
    color: #000;
    line-height: 30px;
    margin-top: 10px;
}
.service-scene .service-scene-text{
    font-size: 14px;
    color: #666;
    line-height: 30px;
    text-align: left;
    height: 100px;
    overflow: hidden;
}

/** 云服务器 CSS **/
.yun-warp {
    margin-top: 20px;
}
.yun-item {
    position: relative;
    padding: 40px 20px 40px 58px;
    border: 1px solid #f6f7f9;
    /* border-left: none; */
    background-color: #fff;
    margin-bottom: 20px;
}
.yun-item:hover{
    border-color: #0096ff;
}
.yun-item:hover .yun-item-name{
    background-color: #0096ff;
}
.yun-item:hover .yun-item-name span{
    color: #fff;
}
.yun-item-name{
    position: absolute;
    left: 0;
    top: 0;
    width: 38px;
    height: 100%;
    background-color: #ebecee;
}
.yun-item-name span{
    word-wrap: break-word;
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 12px;
    margin-top: -28px;
    width: 1em;
    font-size: 12px;
    text-align: center;
    line-height: 14px;
    vertical-align: middle;
    color: #999;
}
.yun-item-row{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items:  flex-start;
    align-content: center;
    flex-wrap: nowrap;
    margin-top: 10px;
}
.yun-item-row .yun-item-row-name{
    width: 86px;
    font-size: 14px;
    color: #666;
    flex-shrink: 0;
    line-height: 36px;
}
.yun-item-val{
    width: 80%;
    flex-shrink: 0;
    height: 100%;
}
.yun-item-btn{
    line-height: 36px;
    text-align: center;
    border: 1px solid #fff;
    margin-left: -1px;
    background-color: #f3f5f9;
    font-size: 14px;
    color: #333;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    box-sizing: border-box;
    cursor: pointer;
    position: relative;
}
.yun-item-val ul li .active{
    background-color: #0096ff;
    color: #fff;
    z-index: 10;
}
.yun-item-btn .yun-discount {
    position: absolute;
    top: 0;
    right: 0;
    width: 20px;
    height: 20px;
    z-index: 2;
    background: url(../images/project_sprite.png) no-repeat -50px -70px;
}
.yun-buy{
    display: inline-block;
    width: 80px;
}
.yun-buy-item ul li{
    line-height: 200%;
}
.yun-buy-bottom{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: space-between;
    justify-content: space-between;
    align-items: center;
}
.yun-buy-bottom div span{
    font-size: 24px;
    color: #ff7b05;
}


.solution-scene{
    border: 1px solid #eee;
    text-align: center;
    padding: 15px;
}
.solution-scene span{
    width: 45px;
    height: 3px;
    background: #009dff;
    margin: 0 auto 10px auto;
    display: block;
}
.solution-scene .solution-scene-title{
    font-size: 16px;
    color: #000;
    line-height: 30px;
    margin-top: 10px;
}
.solution-scene .solution-scene-text{
    font-size: 14px;
    color: #666;
    line-height: 30px;
    text-align: left;
    height: 150px;
    overflow: hidden;
}
.solution-ability{
    background-color: #f9f9f9;
}
.solution-ability ul li div i{
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: middle;
    width: 54px;
    height: 43px;
}
.solution-ability-i1{
    background: url(../images/icon.png) -74px -501px;
}
.solution-ability-i2{
    background: url(../images/icon.png) -142px -501px;
}
.solution-ability-i3{
    background: url(../images/icon.png) 0 -501px;
}
.solution-ability-item{
    text-align: center;
}
.solution-ability-title{
    font-size: 22px;
    color: #263755;
    padding-top: 30px;
    padding-bottom: 20px;
}
.solution-ability-doc{
    font-size: 14px;
    line-height: 24px;
    color: #585858;
    padding-bottom: 20px;
}
.solution-ability-item-right{
    border-right: 1px solid #d8d8d8;
}

.solution-plan{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    margin-top: 30px;
    padding-bottom: 30px;
}
.solution-plan div img{
    width: 100%;
}
.solution-plan-doc{
    width: 400px;
    text-align: center;
}
.solution-plan-doc h3{
    font-size: 22px;
    font-weight: 400;
    color: #333;
    padding: 20px 0;
}
.solution-plan-doc p{
    text-align: left;
    font-size: 14px;
    color: #585858;
    line-height: 24px;
}
.about-subtitle{
    font-size: 16px;
    color: #666666;
    text-align: center;
}
.about-doc{
    margin-top: 20px;
}
.about-doc div img{
    width: 100%;
}
.about-doc-text{
    font-size: 14px;
    color: #555;
    line-height: 24px;
    text-indent: 2em;
    text-align: justify;
    margin-bottom: 25px;
    padding-left: 10px;
    float: right;
}
.about-expand-bg{
    background-color: #f5f5f5;
}
.about-expand-bg div.container ul.layui-timeline{
    background-color: #fff;
    padding: 50px 80px;
}

@media only screen and (max-width: 768px){
    .about-expand-bg div.container ul.layui-timeline{
        padding:10%;
    }
    .layui-table tr {
        transition: all .3s;
        -webkit-transition: all .3s;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        justify-content: center;
        align-items: center;
        margin-bottom: 45px;
    }
    .layui-table thead{
        display:none
    }
    .server_jf {
        width: 50%;
    }
    .serverjf {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }
    .server_byb {
        border-width: 0!important;
    }
}
@media only screen and (max-width: 800px){
    .video{
        width:100%;
    }
}

/**新闻中心**/
.news-fix{
    display: flex;
    margin-top: 30px;
}
.news-fix-left{
    flex-shrink: 0;
    width: 150px;
    margin-right: 30px;
}
.news-fix-left li a, .news-fix-xs-left li a{
    line-height: 50px;
    background-color: #fff;
    text-align: center;
    display: block;
    color: #333;
    font-size: 16px;
}
.news-fix-left li a:hover,.news-fix-left li a.active, .news-fix-xs-left li a:hover, .news-fix-xs-left li a.active{
    text-decoration: none;
    background-color: #2693b5;
    color: #fff;
}
.news-fix-xs-left{
    margin-bottom: 0;
}
.news-fix-xs-left li{
    width: 100%;
}
.news-fix-right{
    width: 100%;
}
.news-fix-right li{
    background-color: #fff;
    padding: 20px;
    display: flex;
    margin-bottom: 20px;
}
.news-time{
    padding: 0 20px;
    width:15%;
    display: flex;
    justify-content: center;
    align-items: center;
}
@media only screen and (max-width: 800px){
    .news-time{
        width: auto;
        padding: 0;
    }
}
.news-time-con{
    position: relative;
    width: 80px;
}
.news-time-day{
    position: absolute;
    font-size: 26px;
    font-weight: bold;
    top: -10px;
    left: -5px;
}
.news-time-day:after{
    content: "";
    display: block;
    position: absolute;
    top: 8px;
    right: -13px;
    height: 32px;
    border-right: solid 1px #575d6c;
    transform-origin: right top;
    transform: rotate(30deg);
}
.news-time-month{
    position: absolute;
    right: 10px;
    top: -10px;
}
.news-time-year {
    position: absolute;
    right: 10px;
    bottom: -40px;
}

.news-text{
    padding-left: 20px;
    border-left: 1px solid #ddd;
    width: 85%;
}
.news-text a {
    color: #2693b5;
}
.news-text a:hover {
    color: #2693b5;
}

.news-text a:hover {
    color: #2693b5;
}

.news-title a{
    display: block;
    font-size: 18px;
    line-height: 34px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #333;
}
.news-title a:hover{
    text-decoration: none;
    color: #2693b5;
}
.news-fix div.details-content{
    background-color: #fff;
    padding: 20px;
}
.news-fix div.details-content h1{
    text-align: center;
    font-size: 26px;
    margin-bottom: 20px;
}
.details-time{
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    letter-spacing: 0;
    color: #999999;
    margin-bottom: 40px;
    text-align: center;
}
.detail-doc{
    padding: 0 4%;
    font-size: 14px !important;
    font-weight: normal;
    font-stretch: normal;
    line-height: 24px;
    color: #404040;
    text-align: left;
    min-height: 100px;
    letter-spacing: 2px !important;
}
.detail-next{
    padding: 0 4%;
    margin-top: 20px;
}
.detail-next a:hover{
    text-decoration: none;
}

.layui-table th:first-child{
    font-weight:bold;
    /*font-size: 16px;*/
}



div#pages {
    float:right;
    padding-right:8px;
    white-space: nowrap;
}

div#pages ul{
    margin:0;
    padding:0;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    flex-direction: row;
    align-content: center;
    justify-content: center;
}

div#pages a:link,div#pages a:visited,div#pages a:active{
    color:#000;/*非当前页*/
    text-decoration: none;
}

div#pages a:hover{
    color:#25C01B;/*鼠标滑过*/
    text-decoration: none;
}

div#pages li{
    margin:3px;
    padding:2px 5px;
    list-style-type: none;
    float:left;
    border:1px #1D5124 solid;/*边框颜色*/
    white-space: nowrap;
}

@media (min-width: 1200px){
    .container {
        /*width: 1200px!important;*/
    }
}
@media only screen and (max-width: 1060px) { 
    .layui-nav .layui-nav-item a {
        padding: 0 10px;
    }
    .container-logo .logo img {
        width: 150px;
        height:auto;
    }
    .container_flex {
    display: flex;
   justify-content: space-between;
    }
    .layui-nav-item .nav-a {
        font-size: 14px;
    }
}


.bank_pay {
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    align-items: center;
        border: 1px solid #eee;
    box-shadow: 0px 0px 5px #b9b9b9;
    -webkit-box-shadow: 0px 0px 5px #b9b9b9;
    -moz-box-shadow: 0px 0px 5px #b9b9b9;
    -o-box-shadow: 0px 0px 5px #b9b9b9;
    padding: 5px 15px;
}
.bank_pay img{
width: 40%!important;
}

.bank_yh{
     display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    align-items: center;
        border: 1px solid #eee;
    box-shadow: 0px 0px 5px #b9b9b9;
    -webkit-box-shadow: 0px 0px 5px #b9b9b9;
    -moz-box-shadow: 0px 0px 5px #b9b9b9;
    -o-box-shadow: 0px 0px 5px #b9b9b9;
    padding: 5px 15px;
}
.bank_yh  img{
    width: 45%!important;
}
.max-dh{
    position: absolute;
    top: 67px;
    left: 0;
    font-size: 0;
    white-space: nowrap;
    padding: 0 40px;
}



.layui-nav-child{
    border: none;
}
.nav-children{
    border: 1px solid #34a7ca;
    background-image: -webkit-gradient(linear,right top,left top,from(#33a6c9),to(#167491));
    background-image: -webkit-linear-gradient(right,#33a6c9,#167491);
    background-image: linear-gradient(45deg,#33a6c9,#167491);
}
.nav-con{
    display: flex;
}
.nav-con-right{
    flex-shrink: 0;
    width: 400px;
    padding-left: 20px;
    text-align: left;
    margin:10px;
}
.nav-con-content{
    width: 100%;
    white-space: normal;
}
.nav-con-left{
    display: flex;
}
.nav-con-left-item{
    margin-right: 20px;
}
.nav-con-title{
    text-align: left;
    border-bottom: 1px solid #ffffff;
     font-weight:600;
}
.nav-con-list_10px {
    margin:10px 0;
    text-align:left;
    
}
 
.nav-con-list li{
    cursor: pointer;
   
}


.nav-con-list li{
    cursor: pointer;
}
.nav-con-list>li>a{
    color: #fff!important;
    
}
.nav-con-list li:hover, .nav-con-list>li>a:hover,.nav-con-list li:hover>a{
    color: #4395fd!important;
    background-color: #ffffff;
}
.nav-con-content{
    font-size: 14px;
    line-height: 28px;
    margin:15px 0;
}


.pc_zdh{
    position: relative;
}
.layui-nav-item{
    position: static!important;
}
.nav-children{
    left: 0!important;
}

.nav-con-left-title  {
    font-weight:600;
    margin: 10px 10px 0px 10px;
}

.product-area, .product-area-title{
    display: flex;
}
.area-title{
    flex-shrink: 0;
    width: 60px;
    color: rgb(102,102,102);
    font-size: 16px;
    margin-top:8px;
}
.product-area-title li{
    cursor: pointer;
    padding: 8px 10px;
    border: 1px solid #167491;
    margin-right: 10px;
    border-radius: 3px;
    font-size: 14px;
}

.product-area-title li.active{
    color: #fff;
    background-color:#167491;
}
.product-area-items{
    flex-shrink: 0;
    width: calc(100% - 60px);
}
.product-area-lists .item {
    /*border: 1px solid #eee;*/
    padding: 5px 10px;
    background: #fff;
    position: relative;
    box-shadow: 2px 2px 16px rgb(14 36 96 / 8%);
}

.product-area-lists .cloud_sbtg:hover {
    background: #f7f7f9;
   box-shadow: 2px 2px 16px rgb(14 36 96 / 8%);
}



.product-area-lists .item img{
    position: absolute;
    right: 10px;
    top: 10px;
    width: 10%;
    opacity:0.4;
  filter:alpha(opacity=40)
}
.product-area-lists .item i{
    display: none;
    color: #4c9cf7;
    position: absolute;
    right: 10px;
    bottom: 5px;
}
.product-area-lists .item.active{
    /*border: 1px solid #4c9df8;*/
}
.product-area-lists .item.active i{
    display: block;
}
.product-area-lists .item .title h3{
    display: inline-block;
    margin-top: 10px;
}
.product-area-lists .item .title span{
    color: #919393;
    font-size: 18px;
   font-weight: 300;
    
}
.product-area-lists .item p{
    line-height: 200%;
    font-size: 14px;
    color: #a8a8a7;
    margin: 0 5%;
    
}
.product-area-lists .item p span {
    color: #167491;
    font-weight: 600;
}

.product-area-lists .item p a {
    height: 35px;
    line-height: 35px;
    padding: 0px 15px;
    white-space: nowrap;
    text-align: center;
    font-size: 14px;
    border-radius: 2px;
    cursor: pointer;
    border: 1px solid #167491;
    color: #167491;
   
}