html,body{ width: 100%; height: 100%; margin: 0; user-select: none; scroll-behavior: smooth; font-family: 'PingFang SC', '微软雅黑'; }
i{ font-family: 'PingFang SC', '微软雅黑'; }
p, img, h1, h2, h3{ margin: 0; }
h1{ font-weight: 600; color:#333333; font-size: 55px; font-family: 'PingFang SC', '微软雅黑'}
.bannerMain{ max-width: 960px; margin: 0 auto; }
a{ text-decoration: none; color: #414141; }
.upnetMain{ width: 100%; }
/* 标题头 */
.title_layout{ width: 100%; background: white; }
.upnetTitle{ max-width: 960px; margin: 0 auto; flex: 1; display: flex; flex-direction: row; color: black; justify-content: space-between; background: white; height: 68px; line-height: 68px; }
.img_logo{ width: 98px; height: 13px; margin-top: 25px;}
.upnetTitle a{ text-decoration: none; color: black; }
.upnetTitle_l{ font-size: 22px; font-family: "微软雅黑"; font-weight: bold; color: #000000; }
.upnetTitle_r{ font-family: "PingFang SC"; font-size: 14px; font-weight: 400; }
.upnetTitle_r_l{ margin-left: -78% }
.upnetTitle_r_btn{ margin-top: 25px; color: #00AAFF; background-color: rgba(240, 251,255); text-align: center; border:1px solid #00AAFF; border-radius:25px; padding: 4px 11px; }
/* 头部 */
.head_l h1{ color: #333333; font-size: 28px; margin-top: -7px; margin-bottom: 10px; }
.head_l h2{ color: #313131; font-size: 20px; font-weight: 300; margin: 0; }
.head_title{ width: 373px; }
.head_free{ width: 110px; align-self: flex-end; margin-right: 50px; margin-top: 35px; }
.head_r{ max-width: 960px; margin-top: -80px; z-index: -1; margin-right: -240px; }
.head_bgm{ width: 100%; margin-top: -80px; z-index: -1; margin-right: -240px; }
.head_bg{ background: url("./img/new/bg.png") no-repeat center center fixed; background-size: 960px 100%;}
.head_txt1{ margin-top: -58%; margin-left: 21.6% }
.head_txt_ls { letter-spacing:-1.5px }
.head_txt2{ margin-top: -42%; margin-left: 35%; font-size: 30px; }
.head_btn{ margin-top: -27%; margin-left: -22%; width: 110px; }
.head_btns { width: 389px; margin-top: -10%; margin-left: 30%; }
.freeBtn_new{
  display: block;
  width: 188px;
  height: 50px;
  margin-top: 98px;
  color: white;
  background: #00AAFF;
  border-radius: 5px;
  text-align: center;
  line-height: 48px;
  text-decoration: none;
  align-self: flex-start;
  font-size: 15px;
}
.freeBtn{
  display: block;
  width: 180px;
  height: 62px;
  margin-top: 50px;
  color: white;
  background: linear-gradient(#3FDCFC, #1EB7F9);
  background: -webkit-linear-gradient(left, #3FDCFC, #1EB7F9);/* Safari 5.1 - 6.0 */
  background: -o-linear-gradient(right, #1EB7F9, #3FDCFC);/* Opera 11.1 - 12.0 */
  background: -moz-linear-gradient(right, #1EB7F9, #3FDCFC);/* Firefox 3.6 - 15 */
  border-radius: 10px;
  text-align: center;
  line-height: 62px;
  text-decoration: none;
  align-self: flex-start;
}
.head_icon{ width: 28px; }
/* 客户端下载 */
.client{ width: 100%; height: 165px;  margin: 20px 0 0 5px;}
.client_r { margin: 0 auto}
.client_l{ margin-left: 42px; padding: 10px 90px 10px 0; border-right: 1px solid #E2E5EF; }
.client_l p{ font-size: 14px; color: #919191; margin-top: 15px; }
.client_item{ padding: 0 30px; cursor: pointer; font-size: 14px; font-weight: 600;text-align: center; }
.client_item img{ display: block; margin: 0 auto; width: 58px; }
.client_item_img {border:0px solid #FFFFFF; border-radius:50%; background-color: rgba(235,238,243); }
.client_item_img:hover{ box-shadow: 0px 10px 15px 5px rgba(235,238,243); }
.client_item p { margin-top: 10px; color: #2E4270 }
.client_item_bor{  border:1px solid #C8D2DC; border-radius:50%; padding: 40px; }

.client_title { text-align: center; margin-top: 40px; color: #2E4270 }
.client_down{ display: block }
/* 就是倍儿快 */
.features{ margin-top: 48px; justify-content: space-around; }
.fe_item{ width: 320px; height: 213px; }
.fe_item img{ display: block; margin: 23px auto 0px; width: 80px; }
.fe_item h2, .fe_item p{ text-align: center; }
.fe_item p{ color: #313131; margin: 10px auto 0; font-size: 16px; font-weight: 300; }
.features_bg{  background: #F6F8FF; width: 100%; overflow: hidden; margin-top: 120px; padding: 80px 0; }
/* 海量节点， 随心选择  */
.nodes_more_title{ font-size: 30px; }
.nodes_more{ width: 100%; height: 254px; overflow: hidden; margin-top: 10px; }
.nodes_more_layout{ max-width: 960px; margin: 57px auto 0; }
.nodes_more img{ width: 330px; margin: 0 80px 0 60px; }
.nodes_more_l{ width: 300px; }
.nodes_more_l p{ color: #333333; font-size: 16px; margin-top: 30px; font-weight: 300; }
.country_map{ max-width: 1000px; display: block; margin: 68px auto 120px; }
/* 支持多端，下载即用 */
.devices_titile{ font-size: 30px; }
.devices_tip_layout{ max-width: 960px; margin: 57px auto 0; }
.devices_tip{ background: #F6F8FF; width: 100%; height: auto; overflow: hidden; margin-top: 10px; padding-bottom: 50px; }
.devices_tip img{ max-width: 560px; }
.devices_tip_r{ flex: 1; margin: 40px 0 0 20px; }
.devices_tip_r p{ margin-top: 30px; font-weight: 300; color: #313131; }
/* 设备列表 */
.deviceList{ margin: -45px auto 100px; max-width: 960px; }
.device_item{ width: 162px; height: 150px; border: 1px solid #F2F2F2; border-radius: 3px; background: white; margin-right: 22px; }
.device_item img{ width: 47px; display: block; margin: 34px auto 25px; }
.device_item p{ text-align: center; font-size: 16px; }
.upnet_fot{ max-width: 1200px; margin: 169px auto 50px; font-size: 12px; font-weight: 300; }
.upnet_fot a { text-decoration: none; color: #070707; font-size: 13px; }
.vcard-block { background-color: #0facf3; }
.vface,.vback {
  width:162px;
  height:150px;
  position: absolute;
  text-align: center;
  backface-visibility: hidden;
  transform-style: preserve-3d;
  transition: transform 2s;
}
.vface{transform: rotateX(0deg);}
.vback{transform: rotateX(-180deg);}
.card:hover .vback{transform:rotateX(0deg);}
.card:hover .vface{transform:rotateX(180deg);}
/* common */
.flexAuto{ display: flex; display: -webkit-flex; flex-direction: row; align-items: center; flex-wrap: wrap; }
.flexColm{ flex-direction: column !important; }
.jusLeft{ justify-content: left; }
.jusRight{ justify-content: flex-end; }
.jusCenter{ justify-content: center; }
.jusBetween{ justify-content: space-between; }
.alignStart{ align-items: start; }
.disBlock{ display: block !important; }
.disFlex{ display: flex; }
.disBlockIn{ display: inline-block; }
.disNone{ display: none; }
.margin0{ margin: 0; }
.padding0{ padding: 0; }
.tl{ text-align: left; }
.tc{ text-align: center; }
.imgAuto{ margin: 0 auto; display: block; }
.pcView{ display: block; }
.countryView{ display: none; }
.phoneView{ display: none; }
.headbg_view { display: block; }
/* 颜色 */
.cr31{ color: #313131; }
.cr89{ color: #848589; }
/* 字体 */
.fs-12{ font-size: 12px; }
.fs-16{ font-size: 16px; }
.fs-30{ font-size: 30px; }
.fw-300{ font-weight: 300; }
/* margin */
.mt-120{ margin-top: 120px; }
.mt-15{ margin-top: 15px; }
.mt-20{ margin-top: 20px; }
.mt-10{ margin-top: 10px; }
/* PC媒体查询 */
@media only screen and (max-width: 1024px) {
  h1{ font-weight: 600; color:#333333; }
  .head_r{
    max-width: 580px;
    margin-top: -50px;
  }
  .head_bgm{ width: 100%; margin-top: -80px; z-index: -1; margin-right: -240px; }
  .upnet_fot{ max-width: 960px; }
}
@media only screen and (max-width: 1200px) {

}

@media only screen and (min-width: 1667px) {

}

@media (min-width: 1680px) {

}

/* 移动媒体查询 */
@media only screen and (max-width: 768px) {
  .img_logo{ width: 81px; height: 11px;  margin: 15px 0 0 0;}
  .upnetTitle_r_l { margin-left: -45%; }
  h1{ font-weight: 600; color:#333333; }
  .head_txt1 { font-size: 36px;margin-top: -78%; margin-left: -0% }
  .head_txt2 { font-size: 24px; margin-top: 6%; margin-left: 0%; }
  .head_btn { margin-top: 10%; margin-left: -0%; }
  .head_btns { width: 90%; margin-top: 15%; margin-left: 0px}
  .client_down{ display: none }
.upnetTitle_r_btn,
  .upnetTitle { width: 90%;max-width: 90%; height: 50px; line-height: 50px;}
  .upnet_fot,
  .devices_tip_layout,
  .nodes_more_layout{ width: 90%; max-width: 90%; }
  .bannerMain{ width: 100%; max-width: 100%; }
  /*.title_layout{ display: none; }*/
  .upnet_head{ flex-direction: column; }
  .head_title{ width: 50%; }
  /*.upnetTitle_r{ display: none; }*/
  .head_free{ width: 24%; align-self: center; margin: 20px auto; }
  .head_l{ margin-top: 30px; align-items: center; }
  .head_l h1{ font-size: 24px; }
  .head_l h2{ font-size: 12px; }
  .head_r{ max-width: 100%; margin: 30px auto 0;}
  .head_r img{ width: 100%; }
  .head_bgs { width: 100%; }
  .line{ width: 90%; height: 1px; background: #E2E5EF; margin: 20px auto 10px; }
  .freeBtn{ width: 100%; height: 44px; line-height: 44px; margin-top: 20px; border-radius: 4px; }
  /* 客户端下载 */
  .client{ height: auto; padding-bottom: 20px; flex-direction: column; margin: -5px auto 0; }
  .client .freeBtn{ width: 90% !important; margin: 5px auto 0; }
  .client_item{ padding: 25px 35px; }
  .client_item p{ text-align: center; }
  .client_l{ flex: 1; border: 0; margin: 0; padding: 20px 0; text-align: center; }
  .client_l p{ margin-top: 5px; font-size: 12px; }
  .client_r{  flex: 1; justify-content: flex-start; width: 90%; }
  .fastTip{ margin-top: 40px; }
  .client_btn{
    position: relative;
    display: block;
    width: 90%;
    height: 50px;
    margin: 70px 5% 0 5%;
    color: white;
    background: #00AAFF;
    border-radius: 5px;
    text-align: center;
    line-height: 50px;
    text-decoration: none;
    align-self: flex-start;
    font-size: 15px;
  }
  .client_btn img { width: 16px; }
  .client_btn_get { margin: 0 5% ; }
  /* 就是倍儿快 */
  .features_bg{  background: #F6F8FF; width: 100%; overflow: hidden; margin-top: 60px; padding: 20px 0; }
  .fe_item{ width: 300px; height: 60px; }
  .fe_item_img { margin-left: -20px; }
  .fe_item img{ transform:scale(0.5); margin: -20px 0 0 -10px;  display:inline;position: absolute}
  .fe_item p{ font-size: 13px; width: 130px; }
  .fe_item h2{ font-size: 12px; font-weight: normal; margin: 10px 0 0 10px;}
  /* 海量节点，随心选择 */
  .nodes_more_layout{ margin: 20px auto 0; flex-direction: column; }
  .nodes_more{ height: auto; padding-bottom: 20px; background: white; margin-top: 30px; }
  .nodes_more_l{ width: 90%; text-align: center; }
  .nodes_more_l p{ margin-top: 10px; font-size: 15px; }
  .nodes_more_l h1{ font-size: 27px; margin: 30px auto 25px; }
  .nodes_more img{ width: 90%; margin: 50px auto; display: block; }
  .country_map{ width: 100%; margin: 60px 0 0 0; }
  .country_map img{ width: 90%; margin: 0 auto; display: block; }
  .nodes_more_word { color: #20B9F9; }
  .nodes_more_title { font-size: 26px;  }
  /* 支持多端，下载即用 */
  .devices_titile { font-size: 26px; text-align: center }
  .devices_tip{ padding-top: 40px; }
  .devices_tip_layout{ flex-direction: column; margin-top: 10px; }
  .devices_tip_r{ margin: 10px 0 0; }
  .devices_tip_r h1{ text-align: center; font-size: 27px; margin: 40px 0 24px; }
  .devices_tip_r p{ margin-top: 15px; text-align: center; font-size: 15px; }
  .devices_tip img{ max-width: 100%; }
  .deviceList{ max-width: 90%; margin: 0 auto; padding: 30px 5% 30px 5%; background: #F6F8FF; justify-content: space-between; }
  .device_item{ width: 46%; margin: 10px 0; }
  .upnet_fot{ margin: 20px auto 50px; justify-content: center; }
  .upnet_fot p{ margin-bottom: 5px; }
  .upnet_fot a{ font-size: 12px; color: #0C8AC7 !important; }
  .pcView{ display: block; }
  .phoneView{ display: block; }
  .headbg_view { display: none; }
  .head_icon{ display: none; }
  .deviceList_view{ display: none; }
}
@media only screen and (min-device-width: 360px) and (max-width: 640px) {
  .client_item{ padding: 25px 28px; }
  .fe_item{ width: 162px; height: 60px; }
}
@media only screen and (min-device-width: 411px) and (max-width: 823px) {
  .img_logo {margin-left: 20px}
  h1{ font-weight: 600; color:#333333; font-size: 32px; }
  .head_txt1 { font-size: 34px;margin-top: -58%; margin-left: 30% }
  .head_txt2 { font-size: 22px; margin-top: -44%; margin-left: -32%; }
  .head_btn { margin-top: -28%; margin-left: -22%; width: 110px; }
  .nodes_more_l { width: 300px; margin-left: 40px;}
  .nodes_more img { width: 330px; margin: 0 60px 0 40px; }
  .head_btns { width: 320px; }
  .client_item{ padding: 25px 36px; }
  .devices_tip img {  max-width: 500px; }
  .devices_titile { font-size: 28px; }
  .devices_tip_r .freeBtn_new {margin-top: 50px;}
  .deviceList {margin: -45px auto 100px 20px;}
  .device_item {margin-bottom: 10px;}
  .vbacks{display: none;}
  .card:hover .vback{transform:rotateX(360deg);}
  .card:hover .vface{transform:rotateX(360deg);}
}
@media (max-width: 375px){
  h1{ font-weight: 600; color:#333333; font-size: 32px; }
  .head_txt1 { font-size: 32px;margin-top: -70%; margin-left: -0% }
  .head_txt2 { font-size: 20px; margin-top: 6%; margin-left: 0%; }
  .head_btns { width: 280px; margin: 30px 0 0 0 ; }
}
@media only screen and (min-device-width: 375px) and (max-device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
  .client_item{ padding: 25px 31px; }
}
@media only screen and (device-width : 414px) and (device-height : 736px) and (-webkit-device-pixel-ratio : 3) {
  h1{ font-weight: 600; color:#333333; font-size: 32px; }
  .head_txt1 { font-size: 34px;margin-top: -75%; margin-left: -0% }
  .head_txt2 { font-size: 22px; margin-top: 6%; margin-left: 0%; }
  .head_btns { width: 320px; margin: 50px 0 0 0 ; }

}
@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (-webkit-device-pixel-ratio: 2) {
  .client_item{ padding: 25px 30px; }
  .head_txt1 { margin-top: -70%; }
}

@media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3){

}

@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (-webkit-device-pixel-ratio: 2) {
  h1{ font-weight: 600; color:#333333; font-size: 28px; font-family: 'PingFang SC Semibold'}
  .head_txt1 { font-size: 28px;margin-top: -75%; margin-left: -0% }
  .head_txt2 { font-size: 16px; margin-top: 6%; margin-left: 0%; }
  .head_btns { width: 180px; margin: 30px 0 0 0 ; }
  .nodes_more_l h1{ font-size: 24px; }
  .client_item{ padding: 25px 22px; }
  .fe_item{ width: 144px; }
}

