@charset "utf-8";

/*全局样式*/
* {padding:0px; margin:0px;}
html,body{ height:100%;}
*{-webkit-tap-highlight-color: rgba(0,0,0,0);}
body {font-size:14px;padding:0px; background:#ffffff;font-family: "微软雅黑","黑体",Arial,sans-serif; width:auto;}
label {font-size:14px; font-family: "微软雅黑","黑体",Arial,sans-serif;}
ul, li, ol, li { margin:0px; padding:0px;}
h1, h2, h3, h4, h5, h6, p, dl, dt, dd, form { margin:0px; padding:0px; font-weight:normal; font-size:14px; }
img { border:0px; margin:0px; padding:0px; vertical-align:middle; }
table { border:0px; font-size:14px;}
.clear{clear:both;}
a{ text-decoration:none;}
.no_bor{border-right:none;}
.no_bor_t{border-top:none;}
button{ outline:none;}
input, select,textarea{ vertical-align:middle;font-size:12px;font-family:"微软雅黑","黑体",Arial,sans-serif; padding:3px; line-height:20px; }
input::-webkit-input-placeholder {
  color: #ccc;
}
input::-moz-input-placeholder {
  color: #ccc;
}
input::-ms-input-placeholder {
  color: #ccc;
}
/*为了消除选中时的虚线框*/
a{
	bblr:expression(this.onFocus=this.blur());/*IE使用*/
	outline-style:none;/*FF使用*/
}

.fl{float:left;}
.f4{float:right;}
.relative{position:relative;}



/* 轮播图 */
.slider {position: relative;overflow: hidden;width: 100%;}
.slider li{list-style:none;  }
.slideBox .hd {height: 10px;z-index:1; overflow: hidden;position: absolute;left: 50%;bottom: 50px;transform: translateX(-50%);z-index: 1;}
.slideBox .hd ul{ text-align:center;  padding-top:5px;}
.slideBox .hd ul li {cursor:pointer;float: left;margin-right: 5px;width: 30px;height: 10px;line-height: 14px;text-align: center;background: #51baf2; }
.slideBox .hd ul .on {background: #016af4;color: #fff;}
.slideBox .bd{ position:relative; z-index:0; }
.slideBox .bd li.banner1{ background:url(../images/banner1.jpg) no-repeat center top; height:540px;}
.slideBox .bd li.banner2{ background:url(../images/banner2.jpg) no-repeat center top; height:540px;}
.slideBox .bd li.banner3{ background:url(../images/banner3.jpg) no-repeat center top; height:540px;}
.slideBox .bd li img{width:100%; vertical-align:top; } 



/*移动端导航*/
@media screen and (max-width: 1024px) and (min-width: 0px){
   .msgNum{display: none;}
   .slider{margin-top: 48px;}
   .head{display:none}
   .m_img{display:block;height:48px;background:#fff;position:fixed;top:0px;left:0px;width:100%;z-index:9999;border-bottom:1px solid #ddd;overflow: hidden;}
   .m_img .headlf{padding-left:5px;float: left;}
   .m_img .headlf .m_logo{height:48px;display: block}
   .m_img .headrg{padding-right:5%;padding-top:16px;float: right;}
   .m_img .headrg a .m_menuimg{height:16px;vertical-align:top;display: block}
   .m_nav {display:block;position:fixed;top:0px;left:0px;width:0px;height:0px;overflow:hidden;z-index:10000}
   .m_nav .closecover{position:absolute;width:100%;height:100%;background:#0b0d19;filter:alpha(opacity=0);opacity:0;left:0px;top:0px;z-index:1}
   .m_nav .closeicon{position:absolute;width:20%;left:10px;top:5%;z-index:100;text-align:center;filter:alpha(opacity=0);opacity:0}
   .m_nav .m_navList{position:absolute;width:80%;right:0px;top:0px;background:#0b0d19;height:100%;z-index:100;right:-80%;overflow-y: scroll;}
   .m_nav .m_navList ul{padding-left:5%;padding-right:5%; list-style:none;}
   .m_nav .m_navList ul li{border-bottom:1px solid #232530}
   .m_nav .m_navList ul li a{display:block;height:45px;color:#fff;line-height:45px;padding-left:5%;font-size:16px}
   .m_nav .m_navList ul li .m_f_a{display: flex;align-items: center;justify-content: space-between; width: 100%}
   .m_nav .m_navList ul li .m_f_a a{flex: 1;}
   .m_nav .m_navList ul li .m_f_a i{width: 40px;height:35px;box-sizing: border-box; padding:0 5px; display: block;}
   .icon{ background:url(../images/plus.png) 100% no-repeat;background-position: 50% 50%; -webkit-transition:all 0s;-moz-transition:all 0s;transition:all 0s}
   .icon_on{background:url(../images/reduce.jpg) 50% no-repeat!important;background-position: 50% 50%;-webkit-transition:all 0s;-moz-transition:all 0s;transition:all 0s}
   .m_nav .m_navList ul li .m_s_nav{display:none;width: 100%;}
   .m_nav .m_navList ul li .m_s_nav a{display: block; height:40px;line-height:40px;font-size:14px;padding-left:10%;overflow: hidden; white-space: nowrap;width: 90%;text-overflow: ellipsis;}
}

/*首页功能展开缩起*/
.demobg{background:#f4f4f4; padding:0.1em 0 2em 0; text-align:center;margin-top:83px;}
.demo{width:1200px; margin:70px auto 0 auto; text-align:center;}
.section-header h3{ font-size:36px; color:#333; font-weight:bold;}
.section-header p{ border-bottom:1px solid #bababa; position:relative; margin:30px auto 60px; width:290px;}
.section-header p span{ position:absolute; top:-15px; left:60px; right:60px;background:#f4f4f4; font-size:20px; color:#777;}
.section-header p.sty{ width:auto; border:none; font-size:18px; color:#777; margin:20px auto 40px; }
.demo .accordion_pic{ display:inline-block; *display:inline; *zoom:1; vertical-align:middle;}
.demo .container{ display:inline-block; *display:inline; *zoom:1; vertical-align:middle; text-align:left; margin-left:20px; width:600px;}
#accordion .panel{border: none;box-shadow: none;border-radius: 0;margin: 0 0 15px 10px;}
#accordion .panel-heading{padding: 0;border-radius: 30px;}
#accordion .panel-title a{display: block;padding: 12px 20px 12px 50px;background: #0085db;font-size: 18px;font-weight: 600;color: #fff;border: 1px solid transparent;border-radius: 30px;position: relative;transition: all 0.3s ease 0s; text-decoration:none;}
#accordion .panel-title a.collapsed{background: #fff;color: #0d345d;border: 1px solid #ddd;}
#accordion .panel-title a i{ width:26px; height:26px; display:inline-block; vertical-align:middle; margin-right:5px;}
#accordion .panel-title a.collapsed .icon1{ background:url(../images/accordion_icon.png) no-repeat 0 -2px;}
#accordion .panel-title a .icon1{ background:url(../images/accordion_icon.png) no-repeat -26px -2px;} 
#accordion .panel-title a.collapsed .icon2{ background:url(../images/accordion_icon.png) no-repeat 0 -26px;}
#accordion .panel-title a .icon2{ background:url(../images/accordion_icon.png) no-repeat -26px -26px;} 
#accordion .panel-title a.collapsed .icon3{ background:url(../images/accordion_icon.png) no-repeat 0 -53px;}
#accordion .panel-title a .icon3{ background:url(../images/accordion_icon.png) no-repeat -26px -53px;} 
#accordion .panel-title a.collapsed .icon4{ background:url(../images/accordion_icon.png) no-repeat 0 -79px;}
#accordion .panel-title a .icon4{ background:url(../images/accordion_icon.png) no-repeat -26px -79px;} 
#accordion .panel-title a.collapsed .icon5{ background:url(../images/accordion_icon.png) no-repeat 0 -105px;}
#accordion .panel-title a .icon5{ background:url(../images/accordion_icon.png) no-repeat -26px -105px;} 
#accordion .panel-title a:after,#accordion .panel-title a.collapsed:after{content: "\f107";font-family: fontawesome;width: 55px;height: 55px;line-height: 55px;border-radius: 50%;background: #0085db;font-size: 25px;color: #fff;text-align: center;border: 1px solid transparent;box-shadow: 0 3px 10px rgba(0, 0, 0, 0.58);position: absolute;top: -5px;left: -20px;transition: all 0.3s ease 0s;}
#accordion .panel-title a.collapsed:after{content: "\f105";background: #fff;color: #0d345d;border: 1px solid #ddd;box-shadow: none;}
#accordion .panel-body{padding: 20px 25px 10px 9px;background: transparent;font-size: 14px;color: #8c8c8c;line-height: 25px;border-top: none;position: relative;}
#accordion .panel-body p{padding-left: 25px;border-left: 1px dashed #8c8c8c; font-size:14px; line-height:22px; color:#888;}
#accordion .panel-body p b{ font-size:16px; color:#333; display:block; margin-bottom:10px;}

a.button_more{background: linear-gradient(-90deg, #2ad8dc, #0169f4); border-radius:50px; color:#fff; line-height:52px; text-align:center; font-size:16px; font-weight:bold; padding:0 40px;-moz-box-shadow:2px 2px 5px #999; -webkit-box-shadow:2px 2px 5px #999; box-shadow:2px 2px 5px #999; display:inline-block; *display:inline; *zoom:1; vertical-align:middle; margin:25px auto 40px; }
a.button_more i{ width:20px; height:20px; display:inline-block; *display:inline; *zoom:1; vertical-align:middle; background:url(../images/arrow1.png) no-repeat 0 -2px; background-size:20px 20px; margin-left:10px;}
a.button_more:hover{ color:#fff;text-decoration:none;}





@media only screen and (max-width: 1200px) {
.slideBox .bd li.banner1,.slideBox .bd li.banner2,.slideBox .bd li.banner3{ height:480px;background-size:auto 480px;}
.slideBox .hd{ bottom:4vh;}
.demo{width:100%;}
.section-header h3{ font-size:2.4em;}
.section-header p{margin:2em auto;font-size:1.2em;}
.section-header p.sty{font-size:1.1em; }
.section-header p span{font-size:1.2em; }
#accordion .panel-title a{font-size:1.2em; }
#accordion .panel-body p{font-size:1em;}
#accordion .panel-body p b{font-size:1.1em;}
.content_personality .personality li h3,.content_quanfangwei .quanfangwei li h3{font-size:1.2em;}
.content_personality .personality li p,.content_quanfangwei .quanfangwei li p{font-size:1em;}
.demo .accordion_pic{ display:none;}
.demo .accordion_pic img{ width:95%;}
.demo .container{ margin:3vh 5vw; width:90%;}
.content_quanfangwei .quanfangwei li{ width:30%;}
.content_quanfangwei .quanfangwei,.content_personality .personality{width:90%;}
.content_personality .personality li{ width:272px; margin:0 15px;}
.content_service .service{ width:100%;}
.content_personality .personality li{ width:30%; margin:5px 1%;}
.content_service .service h3{ float:none; text-align:left; width:100%;font-size:2.2em; margin:1.5em 0 0.5em 0.3em;}
.content_service .service .list{width:100%; text-align:center; float:none; height:auto;}
.content_service .service .list li{ width:22%; margin:0 1%;}
.content_service .service .list li h4{font-size:1.4em;}
.content_service .service .list li h4 b{ font-size:3em;}
.content_service .service .list li h5{font-size:1.2em;}

.content_download ul li span{font-size:0.9em; }
}

@media only screen and (max-width: 992px) {
.slideBox .bd li.banner1,.slideBox .bd li.banner2,.slideBox .bd li.banner3{ height:350px;background-size:auto 350px;}
.client_box{width:706px;}
.rollBox{ width:706px;}
.rollBox .Cont{width:606px;}
.service_sbox .sicon li{height:30px; line-height:30px;padding:0 0 0 35px; font-size:1.1em; margin:0.5em 0; }
.service_sbox .sicon li.icon1{background:url(../images/footer_sicon1.png) no-repeat 0 center; background-size:auto 30px; height:30px;}
.service_sbox .sicon li.icon2{background:url(../images/footer_sicon2.png) no-repeat 0 center; background-size:auto 30px;height:30px; margin-left:2vw;}
.service_sbox .sicon li.icon3{background:url(../images/footer_sicon3.png) no-repeat 0 center; background-size:auto 30px;height:30px; margin:0 2vw;}
.service_sbox .sicon li.icon4{background:url(../images/footer_sicon4.png) no-repeat 0 center; background-size:auto 30px;height:30px;padding:0 0 0 35px;}
.cloud-product-wrapper{ width:96%; margin-left:2%;}
.cloud-product-ul li{ width:20%; margin-left:1%;}
.cloud-product-ul li.active{ width:36%;}
.mt-tabpage {width: 640px;}
.mt-tabpage-count {width: 640px; height:1100px; }
.content_quanfangwei .quanfangwei .mt-tabpage-count li.mt-tabpage-item {width: 640px;text-align: center; height:1100px;}
.content_quanfangwei .quanfangwei ul.features_list li{ width:44%; float:left; height:120px; padding:5px;} 
.BQ_features .li.colorbg i{ margin-right:10px;}
.BQ_features .li i{margin-left: 20px; margin-right:0;}
.banner-relay .banner-content{ width:94%;}
.banner-relay .banner-content .rollBox{ width:706px;}
.banner-relay .banner-content .rollBox .Cont{ width:606px;}
.banner_proxy{ height:400px; background-size:auto 500px; overflow:hidden;}
.wrap{display:none;}
.wrap_s{width:95%; display:block; margin:20px auto 40px; text-align:center;}
.wrap_s li{ width:48%; list-style:none; padding:0.5em; text-align:center; display:inline-block; *display:inline; *zoom:1; vertical-align:top;}
.wrap_s li.bg1{ background:#2fd0f8 url(../images/proxy_icon1.png) no-repeat center 20px; padding-top:90px; color:#fff;}
.wrap_s li.bg2{ background:#149ce9 url(../images/proxy_icon2.png) no-repeat center 20px; padding-top:90px; color:#fff;}
.wrap_s li.bg3{ background:#0d77da url(../images/proxy_icon3.png) no-repeat center 20px; padding-top:90px; color:#fff;}
.wrap_s li.bg4{ background:#2fd0f8 url(../images/proxy_icon4.png) no-repeat center 20px; padding-top:90px; color:#fff;}
.wrap_s li h3{ font-size:2em;}
.wrap_s li p{ font-size:1em;}
}

@media only screen and (max-width: 767px) {  
.slideBox .bd li.banner1,.slideBox .bd li.banner2,.slideBox .bd li.banner3{ height:280px;}
.slideBox .bd li.banner1{background:#f4f4f4 url("../images/phone_banner1.jpg") no-repeat center -40px;background-size:auto 280px;}
.slideBox .bd li.banner2 {background:#f4f4f4 url("../images/phone_banner2.jpg") no-repeat center -40px;background-size:auto 280px;}
.slideBox .bd li.banner3{background:#f4f4f4 url("../images/phone_banner3.jpg") no-repeat center -40px;background-size:auto 280px;}
a.button_more{ width:60%; font-size:1.4em; padding:0 2%; line-height:3.6em; margin:0;}
a.button_more i{ width:30px; height:30px; background-size:30px 30px; margin-left:10px;}
.content_quanfangwei .quanfangwei li,.content_personality .personality li{ width:90%; margin:5px 15px;}
.content_service .service{ width:90%; padding:20px 0 40px 0; text-align:center; }
.content_service .service .list li{ width:44%; margin:2%; padding:2%;}
.client_box{width:302px;}
.rollBox{ width:302px;}
.rollBox .Cont{width:202px;}
.content_service .service h3{ font-size: 1.8em;}
.content_service .service .list li h4 b{font-size: 2.4em;}
.content_service .service .list li h5{font-size: 1em; }
.content_service .service .list li{ height:135px;}
.banner_inner1,.banner_inner2{ height:350px; background-size:auto 350px;}
.content_quanfangwei .quanfangwei ul.features_list li{ height:120px;}

.cloud-product-ul li{ float:none; width:304px; margin:0 auto;}
.cloud-product-ul li.active{ margin:0 auto;width:304px;}
.cloud-product-ul li:first-child{ margin:0 auto;}

.mt-tabpage {width: 340px;}
.mt-tabpage-count {width: 340px; height:2040px; }
.content_quanfangwei .quanfangwei .mt-tabpage-count li.mt-tabpage-item {width: 340px;text-align: center; height:2040px;}
.content_quanfangwei .quanfangwei ul.features_list li{ width:90%; float:left; height:120px; padding:5px;} 
.mt-tabpage-title .mt-tabpage-item{ width:160px;}
.mt-tabpage-title{ text-align:center;}

.BQ_features .li .txt h2{text-align:center; font-size:1.2em; font-weight:bold; line-height:1.4em;}
.banner-relay{ height:400px; background-size:auto 400px; padding-bottom:120px;}
.banner_proxy{ height:330px; background-size:auto 400px; overflow:hidden;}

.proxy_how .how_step li{ width:95%; padding:130px 0 20px 0;}
.proxy_how .how_step li.step1{background-size:auto 140px;}
.proxy_how .how_step li.step2{background-size:auto 140px;}
.proxy_how .how_step li.step3{background-size:auto 140px;}
.proxy_how .how_step li.step4{background-size:auto 140px;}
.proxy_how .how_btn{padding: 20px 0;}
.proxy_how .how_btn a.btn1,.proxy_how .how_btn a.btn2{margin: 0 25px 25px;}
.proxy_how .how_step li h3{font-size:2em;}
.proxy_how .how_step li h5{ font-size:1.2em; line-height:1.6em;}
.wrap_s li{ display:block; width:100%;}
.banner_download{ height:220px; background-size:auto 220px;}
.download_content .box.center .txt .download_btn{ width:50%;}
.download_content .box.left,.download_content .box.right{width:100%; margin-bottom:0;}

}

@media only screen and (max-width: 576px) {
.content_quanfangwei ul.features_list li{ display:block; width:88%; margin:0 auto; height:auto;}
.content_quanfangwei ul.features_list{ margin-bottom:20px;}
.banner-relay{ padding-top:30px;}	
}

@media only screen and (max-width: 479px) {
  .BQ_features .li .txt{ display:block;}
  .BQ_features .li.colorbg,.BQ_features .li.leftpic{background:#fff;}
  .BQ_features .li i,.BQ_features .li.colorbg i{float:none; margin:0 auto; display:block; } 
  .BQ_features .li .pic1,.BQ_features .li .pic2,.BQ_features .li .pic3,.BQ_features .li .pic4,.BQ_features .li .pic5,.BQ_features .li .pic6,.BQ_features .li .pic7,.BQ_features.relay .li .pic1,.BQ_features.relay .li .pic2,.BQ_features.relay .li .pic3,.BQ_features.relay .li .pic4,.BQ_features.relay .li .pic5,.BQ_features.relay .li .pic6,.BQ_features.relay .li .pic7{ background-size:224px 163px; width:224px; height:163px; }
  .relay_safe .ul_box{ width:100%;}
  .relay_safe .ul_box h2{ font-size:2rem;}
  .relay_safe .ul_box .title-s{ width:320px;}
  .relay_safe .ul_box .title-s .line{ width:75px;}
  .relay_safe .ul_box .title-s p{ width:150px;font-size:1.2em;}
  .relay_safe .ul_box .txt{ width:285px; padding:10px;}
  .banner-relay .banner-txt{ font-size:1.8rem;padding: 40px 0 10px 0;}
  .banner-relay .banner-content p{ width:85%; text-align:center; margin:0 auto; font-size:0.9em; line-height:1.2em;}
  .banner-relay .banner-content{ padding:20px 0;}
  .banner-relay .banner-content .client_box{ background:none; padding:10px 0;}
  .banner-relay .banner-content .rollBox{ width:302px; }
  .banner-relay .banner-content .rollBox .Cont{ width:202px;}
}

@media only screen and (max-width: 414px) { 
  h2.cp_title1{ font-size:2.5em;}
  .relay_safe .ul_box h2{font-size:1.8em; line-height:2em; }
  .relay_safe .ul_box .title-s p{ width:120px;}
  .relay_safe .ul_box .txt{ width:277px; margin: -15px auto 0;}
  .relay_safe .ul_box .txt li{font-size:1em;}
  .banner-relay .banner-txt{font-size:1.6em;}
  .download_content .box .txt .download_btn{ width:60%;}
}
@media only screen and (max-width: 320px) { 
.banner_inner1,.banner_inner2{ height:290px; background-size:auto 290px;}
h2.cp_title1{ font-size:2em;}
.mt-tabpage {width: 290px;}
.mt-tabpage-count {width: 290px; height:2050px; }
.content_quanfangwei .quanfangwei .mt-tabpage-count li.mt-tabpage-item {width: 290px;text-align: center; height:2050px;}
.mt-tabpage-title .mt-tabpage-item{ width:145px;}
.mt-tabpage-title .mt-tabpage-item-cur i{left: 66px;}
.banner_proxy{ height:240px; background-size:auto 290px; overflow:hidden;}
.banner_download{ height:200px; background-size:auto 200px;}
}




.rightfix {
    position: fixed;
    top: 300px;
    right: 0px;
    width: 70px;
    z-index: 10;
    background: rgba(0,0,0,0.5);
}

.fix_ul li {
    font-size: 12px;
    color: #696d73;
    text-align: center;
    float: none;
    position: relative;
    width: 100%;
    height: 70px;

    margin-bottom: 0px;
    color: #fff;
    border-bottom: 1px solid #eee;
}
.fix_ul li i {
    font-size: 40px;
  color: #fff;
  display: block; line-height: 70px;
}

.fix_ul li:last-of-type{  border-bottom: none;}

.right_div {
    opacity: 0;
    position: absolute;
    right: -100px;
    top: 0px;
    background: rgba(0,0,0,0.5);
    transition: all .2s ease-in-out;
    min-width: 190px;
    min-height: 70px;
    color: #fff;
    text-align: left; padding: 10px;

}
.right_div p:nth-child(2){ font-size: 24px;  }
.right_div img{ width: 170px; }

.fix_ul li:hover a{ color: #848484;}
.fix_ul li:hover .right_div{ font-size: 18px;  opacity: 1; right:70px;}
.fix_ul li:hover{    background: #ed353c;}
.fix_ul li:hover i{ color: #fff; }
.keg{width:574px; float:left;}