@charset "utf-8";
/* CSS Document */
*{ padding:0; margin:0; list-style:none; font-size:14px; font-family:"微软雅黑"}
a{ text-decoration:none; color:#3d3d3d;}
.clear{ clear:both;}
.banner{ width:100%; height:450px; background:url(../images/idc/banner.jpg) center no-repeat; background-size:cover; color:#fff; text-align:center}
.banner h1{ padding:60px 0 10px; font-size:32px; font-weight:700;}
.banner .add-title{ font-size:20px;font-weight:700; color:#34bbfa;}
.banner-list{ width:640px; margin:10px auto;}
.banner-list li{width:25%; float:left; margin:10px 0;}  

.button{ display:block;width:320px;border-radius: 6px;font-size:16px; background:#3a62f4; margin:70px auto 20px; text-align:center; line-height:40px; font-weight:700; color:#fff;}

.banner .button{ display:block;width:320px;border-radius: 6px;font-size:20px; background:#3a62f4; margin:10px auto; text-align:center; line-height:56px; font-weight:700;}
.button:hover{ background:#284dd4;}
.container{ width:1180px; margin:0 auto;}
.banner .test{color:#34bbfa;}

.menu{ width:100%; height:60px; background:#1d1d1d}
.menu-list{ width:1200px; margin:0 auto;}
.menu-list li{ width:33.3%; float:left; border-right:1px solid #474646; text-align:center;line-height:60px; box-sizing:border-box;}
.menu-list li a{ color:#fff;font-size:16px;display: inline-block; width: 100%;}
.menu-list li:first-child{border-left:1px solid #474646;}
.menu-list li:nth-child(2){ background:#f2f2f2;}
.menu-list li:nth-child(2) a{ color:#1d1d1d;}

 h2{ font-size:24px; font-weight:700; text-align:center;color:#191c3d; line-height:60px;}
 .add-title{ font-size:14px; color:#666; text-align:center; line-height:25px;width: 85%; margin: 0 auto;}

.center{ width:100%;}
table{ width:80%; margin:30px auto;}
table td,table th{ border:1px solid #bfbfbf; text-align:center; font-size:14px; padding:20px 0;}
table td a{ color:#3a62f4; font-weight:700; font-size:18px;}
table td span{ font-size:20px; color:#d0021b; font-weight:700}



.photo{width:100%; background:#f5f8fb; padding:80px 0;}
.photo-list{ width:1180px; margin:30px auto;}
.photo-list li{ float:left; margin:8px;}

.lc { display:none;}




.speed{width:100%; background:#f5f8fb; padding:80px 0px;}
.speed .form{color:#3a62f4; text-align:center; font-size:18px; line-height:60px; font-weight:600; margin-top:30px;}


.cabinet-bg{width:100%; padding:50px 0;}
.cabinet{ text-align:center;}

.operation{width:100%; background:#f5f8fb; padding:50px 0;}
.operation-list{width:1180px; height:250px; margin:30px auto; background:#fff; box-shadow:0 0 10px #d1cfcf;border-radius:5px;}
.operation-list li{ width:15%; height:120px; float:left; padding:2.5%; text-align:center;}
.operation-list li img{ margin:30px 50px;}
.operation-list li p,.advantage-list li span{ float:left; color:#3d3d3d}


.advantage{width:100%; padding:80px 0;}
.advantage-list{ margin:30px auto;}
.advantage-list li{width:500px; height:90px; float:left; background:#fff; box-shadow:0 0 10px #d1cfcf; border-radius:5px; margin:15px;line-height:30px; padding:15px 30px}
.advantage-list li span{ font-size:18px; display:block; font-weight:700;margin: 12px 20px;}
.advantage-list li img{float:left;margin:5px 0;}
.data-center{ width:1180px; margin:0 auto; padding:70px 0; font-size:16px; color:#191C3D;}
.data-center p{ color:#666;}
.data-center .video{ width:1025px; height:581px; border:5px solid #2164ed; margin:30px auto;}



.node{ width:100%; height:880px; background:#1c2040; padding:80px 0;}
.node h2{ color:#fff;}
.node-container{ width:1180px; margin:0 auto; padding:80px 0;}
.prameters{ float:left; width:430px; margin:100px  auto 0;}
.prameters li{ line-height:25px; margin:50px 0;}
.prameters li img{ display:inline-block; margin:30px 20px 0 0; float:left;}
.node-prameters{display:inline-block; width:70%; color:#fff;}
.node-prameters span{ display:block; font-size:18px; margin:10px 0; font-weight:700;}
.node-map{ margin:20px auto 0;}

.china-map {
    position: relative;
    width: 748px;
    height: 618px;
    margin:0px 400px;
    background: url(../images/idc/map_black_bg.png?01) no-repeat center;
}

.map-mb{ display:none;}

.region-list {
    position: absolute;
    left: 0px;
    top: 0px;
}

@keyframes warn {
    0% {
        transform: scale(0);
        opacity: 1;
    }
    /*30% {
        transform: scale(0);
        opacity: 0.1;
    }
    60% {
        transform: scale(0.5);
        opacity: 0.5;
    }*/
    100% {
        transform: scale(1);
        opacity: 0;
    }
}

.area-box .dot {
    display: inline-block;
    position: absolute;
    left: 0px;
    width: 10px;
    height: 10px;
    /*background: url("../images/area_min.png") no-repeat center;*/
    border-radius: 50%;
    background: #a2a9b4;
    opacity: 1;
    filter: alpha(opacity=100);
}
.area-box .pulse {
    display: inline-block;
    position: absolute;
    top: -28px;
    left: -28px;
    height: 66px;
    width: 66px;
    border: 2px solid #b7b7b7;
    -webkit-border-radius: 48px;
    -moz-border-radius: 48px;
    border-radius: 48px;
    background: #a2a9b4;
    box-shadow: 0 0 4px #82878f,0 0 10px #82878f inset;
    opacity: 0.12;
    filter: alpha(opacity=0);
    -webkit-animation: warn 2s ease-out both;
    -moz-animation: warn 2s ease-out both;
    animation: warn 2s ease-out both;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    background: transparent;
}
.area-box .delay-01 {
    animation-delay: 0;
}
.area-box .delay-02 {
    animation-delay: .4s;
}
.area-box .delay-03 {
    animation-delay: .8s;
}
.area-box .delay-04 {
    animation-delay: 1.2s;
}
.area-box .delay-05 {
    animation-delay: 1.6s;
}
.area-box .delay-06 {
    animation-delay: 2s;
}
.area-box .delay-07 {
    animation-delay: 2.4s;
}
.area-box .delay-08 {
    animation-delay: -0.4s;
}
.area-box .delay-09 {
    animation-delay: -0.8s;
}
.area-box .delay-10 {
    animation-delay: -1.2s;
}
.area-box .delay-11 {
    animation-delay: 4s;
}
.region-list.active .area-box .dot {
    background: #009fd9;
}
.region-list.active .area-box .pulse {
    border-color:#009fd9;
    top: -39px;
    left: -39px;
    height: 88px;
    width: 88px;
    box-shadow: 0 0 12px #0080d9,0 0 20px #0080d9 inset;

}
.region-list.waite .area-box .dot {
    background: #ff9900;
}
.region-list.waite .area-box .pulse {
    border-color: #ff9900;
}
.show-regin {
    position: absolute;
    left: 2px;
    height: 0px;
    top: 0px;
    width: 11px;
    opacity:0;
    -o-transition: all 500ms ease-in-out;
    -ms-transition: all 500ms ease-in-out;
    -webkit-transition: all 500ms ease-in-out;
    transition: all 500ms ease-in-out;
}
.online-node .show-regin,
.region-list:hover .show-regin {
    height: 127px;
    opacity: 1;
}
.waite-node .show-regin,
.region-list:hover .show-regin {
    height: 127px;
    opacity: 1;
}
.underline-node .show-regin,
.region-list:hover .show-regin {
    height: 127px;
    opacity: 1;
}

.postition-3 .show-regin span {

    width: 80px;
    display: inline-block;
    position: absolute;
    left: -25px;
    top: 10px;
    padding: 6px 10px;
    font-size: 14px;
    color: #cccccc;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    text-align:center;
}
.show-regin span {

    width: 80px;
    display: inline-block;
    position: absolute;
    left: 8px;
    top: -11px;
    padding: 6px 10px;
    font-size: 14px;
    color: #cccccc;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    text-align:center;
}
.postition-10 .show-regin span {
    left: 0;
}
.postition-6 .show-regin span {
    left: -72px;
}
.area-box {
    z-index: 77;
}
.show-regin {
    z-index: 66;
}

.region-list.active .show-regin span {
    position: relative;
    color: #ccc;
}
.region-list.waite .show-regin span {
    color: #ccc;
}
.postition-1 {
    left: 302px;
    top: 308px;
}
.postition-2 {
    left: 401px;
    top: 403px;
}
.postition-3 {
    left: 615px;
    top: 375px;
}
.postition-4 {
    left: 473px;
    top: 348px;
}
.postition-5 {
    left: 526px;
    top: 394px;
}
.postition-6 {
    left: 526px;
    top: 515px;
}
.postition-7 {
    left: 551px;
    top: 245px;

}
.postition-7.region-list.active .area-box .pulse {
    top: -50px;
    left: -50px;
    width: 110px;
    height: 110px;
    border-radius: 50%;
}
.postition-8 {
    left: 559px;
    top: 229px;
}
.postition-9 {
    left: 637px;
    top: 371px;
}
.postition-9.region-list.active .area-box .pulse {
    top: -50px;
    left: -50px;
    width: 110px;
    height: 110px;
    border-radius: 50%;
}
.postition-10 {
    left: 554px;
    top: 539px;
}
.postition-11 {
    left: 604px;
    top: 300px;
}
.postition-13 {
    left: 515px;
    top: 280px;
}
.douhao {
    display: inline-block;
    width: 0px;
}




.case{ width:100%;padding:80px 0;}
.case-list{margin:50px auto; }
.case-list li{ width:300px; height:410px; background:#fff; float:left; margin:0 16px; box-shadow:0 0 15px #c9c9ca; padding:30px; }
.case-img{ text-align:center;}
.case-list li:hover{margin:-2px 16px;}
.case-list li strong{ color:#666; font-size:18px; line-height:50px; text-align:center; display:inline-block; width:100%; margin-top:10px;}
.case-list li .parameter{ height:170px;}

.case-list li p{ color:#3d3d3d; font-size:14px; line-height:25px; display:inline-block; margin:5px 10px}

.case-list li .button,.solution .button{ background:#2164ed; display:block; width:160px; height:40px; border-radius:20px; line-height:40px; text-align:center; color:#fff; font-size:14px; margin:5px auto;}

.case-list li .button:hover,.solution .button:hover{ background:#0f51d7;}


.product{width:100%; background:#f5f8fb; padding:80px 0;}
.product-list{ margin:30px auto;}
.product-list li{ width:29%; float:left; padding:2%; line-height:25px;}
.product-title{ color:#3a62f4; font-size:18px; line-height:50px; font-weight:700;}
		
		
		

		
@media screen and (max-width: 768px){
.banner{ height:300px; padding-top:40px;}
.banner .add-title{ font-size:14px;margin:5px auto 0;}

.button{ width:220px;font-size:14px;  margin:30px auto 10px;}

.banner .button{width:200px;font-size: 14px;  line-height:40px;margin:5px auto 8px;}

.menu-list{ width:100%;}
.menu-list li a{font-size:14px; }

.container,.data-center{ width:92%; min-width:360px;}

.banner h1{ font-size:24px;padding:30px 0 0px}
h2{ font-size:18px; line-height:30px;width: 90%; margin: 0 auto;}
.add-title{ line-height:22px; width: 95%; margin:10px auto;}
.banner-list{ width:100%; margin:0;}
.banner-list img{width:90%;}


.third-room,.speed,.cabinet-bg,.operation,.case{padding: 30px 0;}


table{ width:90%;margin: 15px auto;}
table td, table th{padding:8px 0;}
.data-center{padding:30px 0;}
table td span{font-size:18px;}
table td a{ font-size:16px;}

.photo{padding: 30px 0;}
.photo-list{ display:none;}

.lc { display:block;
    width: 360px;
    margin: 20px auto;
    overflow: hidden;
}

.lc .items p {
    color: #fff;
	
}
.lc .items p.p1 {
    text-align: center;
	padding:10px;
}

.lc .items p.p1 img{ width:100%;}




.lc .items a {
    transition: color .4s, opacity .4s;
    color: #fff;
}
.lc .items .right {
    width: 420px;
	margin:0 auto;
    position: relative;
    overflow: hidden;
}
.lc .items .right ul li {
    background-color: #fff;
    margin-right: 13px;
    text-align: center;
    float: left;
    width: 358px;
	border:1px solid #D7D7D7;
    -webkit-transition: box-shadow .2s ease-out;
    transition: box-shadow .2s ease-out;
}
.lc .items .right ul li h3 a {
    color: #323232;
}


.lc .items .right .next, .lc .items .right .prev {
    opacity: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: inline-block;
    cursor: pointer;
    z-index: 1;
    width: 28px;
    height: 62px;
    line-height: 62px;
    color: #fff;
    text-align: center;
    font-size: 22px;
    font-weight: 400;
    background: rgba(0, 0, 0, .2);
    font-family: simsun;
    transition: all ease-in .4s;
}
.lc .items .right .next {
    left: 0px;
}
.lc .items .right .prev {
    right: 60px;
}
.lc .items .right:hover .next {
    opacity: 1;
}
.lc .items .right:hover .prev {
    opacity: 1;
}




.third-list{ display:none;}
.third-img{ display:block; margin-top:30px;}
.third-img img{width:100%;}


.speed .form{ font-size:14px;line-height:30px; width:95%; margin:20px auto 0;}

.cabinet img{ width:100%;}
.operation-list{margin: 20px auto;width:100%; background:none; box-shadow:none;}
.operation-list li{ width:95%;margin:6px 0;line-height:25px;height: 80px; background:#fff;padding: 0 2.5%; border-radius:6px;box-shadow:0 0 6px #d1cfcf;}
.operation-list li img{margin:15px; float:left;}
.operation-list li p{ width:78%;margin-top: 18px; text-align:left;}

.advantage{ padding:40px 0;}
.advantage-list{margin:20px auto;}
.advantage-list li{ width:90%; margin:8px 0; padding:10px 5%; line-height:22px;height: 100px;}
.advantage-list li img{margin: 2px 0;}

.node{ height:830px; padding:40px 0;}
.prameters{width:98%; margin:10px auto 0; float:none;}
.node-prameters{ width:80%;}
.prameters li {line-height: 22px;margin: 20px 0;}
.node-prameters span{ font-size:16px;}
.node-map .china-map{ display:none;}
.map-mb{ display:block;}
.map-mb img{ width:100%;}


.product{ padding:40px 0;}




.case{ height:1450px;}
.case-list li{ width:100%; height:380px; background:#fff; float:left; margin:5px 0; box-shadow:0 0 10px #c9c9ca; padding:20px 0; border-radius:6px;}
.case-list{margin: 20px auto;width:98%;}
.case-list li .parameter{ padding:0 10px;}
.case-list li p{ line-height:22px;}
 
 
.product-list li{width:95%;padding: 2% 0; margin:0 auto; float:none;}
.product-title{ font-size:16px; line-height:30px;}
 
}