body{
  font-family: 'PingFang HK';
  font-style: normal;
  font-size:16px;
}

#service-content-box .content .content-right .content-info img{
  /*width:100%!important;
  height:auto!important;*/
}
.content-info p{
  width: 100%;
  margin:0;
  padding:0;
  font-family: 'PingFang HK';
  line-height: initial;
}
.content-info table{
  width:100%;
  border: 1px solid #DEE4EC;
  border-radius: 8px 8px 0px 0px;
}

/* 奇数行变色 */
.content-info  table tr:nth-child(odd) {
  background-color: #F2F7FF;
}
/* 偶数行不变色 */
/*.content-info  table tr:nth-child(even) {
  background-color: #ffffff;
}*/

.content-info td{
  width:auto!important;
  /*padding:5px 1px;*/
  padding:2px;
  /*min-width: 200px;*/
  max-width:200px;
}

.content-info a{
  padding: 0 2px;
}

.content-info span{
  padding: 0 5px;
  font-family: 'PingFang HK';
  display: inline-block;
  width: 98%;
  word-wrap:break-word; /* 允许在长单词或URL中间换行 */
  overflow-wrap: break-word; /* 同上，这是word-wrap的现代替代写法 */
  white-space: normal; /* 允许自动换行 */
}

#service-ban-box{
  display:inline-block;
  width:100%;
  height: 120px;
  position: relative;
  background: url(/static/index/images/service.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  top: 80px;
}
#service-ban-box .container{
  max-width: 100%;
  height: 120px;
  position: relative;
  padding: 0;
}

#service-ban-box .container .nav-top{
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0px 16px;
  gap: 16px;

  position: absolute;
  width: 100%;
  height: 48px;
  left: 0px;
  top: 0px;
}
#service-ban-box .container .nav-top a, #service-ban-box .container .nav-top span{
  height: 16px;

  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  color: #FFFFFF;
  flex: none;
  order: 0;
  flex-grow: 0;
}
#service-ban-box .container .nav-top span{
  color: #99AEBA
}

#service-ban-box .container .ban-title-box{
  width: 100%;
  height: 48px;
  line-height: 48px;
  margin: 0;
  padding: 0;
}
#service-ban-box .container .ban-title-box .ban-title-nav{
  position: absolute;
  width: 100%;
  height: 48px;
  left: 16px;
  top: 48px;
  font-weight: 600;
  font-size: 32px;
  line-height: 48px;
  text-transform: unset!important;
  color: #FFFFFF;
}

.section{
  padding: 0;
}
#service-content-box{
  position: relative;
  width:100%;
  /*margin-bottom: 80px;*/
  padding-bottom: 80px;
  top: 74px;
}
#service-content-box .container{
  display: block;
  padding: 0px 16px;
  width:100%;
  max-width: 100%;
  height: 48px;
  line-height: 48px;
  background: #083E50;
  position: relative;
  top:0;
}
#service-content-box .container .nav{
  width:100%;
  height:48px;
  line-height: 48px;
  display: inline-block;
}
#service-content-box .container .nav a{
  width: auto;
  height: 16px;
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  color: #FFFFFF;
  /*flex: none;
  order: 0;*/
  display: inline-table;
}
#service-content-box .container .nav span{
  width: 4px;
  height: 8px;
  left: 4px;
  top: 2px;
  color: #99AEBA;
}
#service-content-box .content{
  position: relative;
  background: #FFFFFF;

}
#service-content-box .menu-title-p{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 0px;
  gap: 10px;
  width: 100%;
  height: 48px;
  background: #F7F7F7;
  flex: none;
  order: 0;
  align-self: stretch;
  margin: 0;
}
#service-content-box .menu-title{

  width: 100%;
  height: 16px;
  display: flex;
}
#service-content-box .menu-title span{
  flex-direction: row;
  justify-content: space-between;
  gap: 10px;
  background: #F7F7F7;
  width: calc(100% - 24px* 2);
  height: 16px;
  font-weight: 600;
  font-size: 16px;
  line-height: 16px;
  display: flex;
  align-items: center;
  color: #083E50;
  flex: none;
  order: 1;
  flex-grow: 0;
  text-align: left;
  border-left: 6px solid #083E50;
  padding: 0 10px;
}
#service-content-box .menu-title img{
  width: 24px;
  height: 24px;
  background: #083E50;
  transform: matrix(1, 0, 0, -1, 0, 0);
  flex: none;
  order: 1;
  flex-grow: 0;
}

#service-content-box .content-left ul{
  display: none;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px;
  width: 100%;
  height: auto;
  flex: none;
  order: 2;
  align-self: stretch;
}
#service-content-box .content-left ul li{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 0px 16px 0px 0px;
  gap: 10px;
  width: 100%;
  height: 48px;
  background: #F7F7F7;
  flex: none;
  order: 0;
  align-self: stretch;
  flex-grow: 0;
}

#service-content-box .content-left ul li a{
  width: 100%;
  height: 16px;
  flex: none;
  order: 1;
  flex-grow: 0;
  text-align: left;
  padding: 0 16px;
  font-weight: 400;
  font-size: 14px;
  line-height: 16px;
  display: flex;
  align-items: center;
  color: #083E50;
}
#service-content-box .content-left ul li.active a{
  border-left: 6px solid #083E50;
  padding: 0 10px;
}

#service-content-box .content-right{
  width: calc(100% - 16px* 2);
  position: relative;
  left: 16px;
  padding-bottom: 20px;
}
#service-content-box .content-right .title{
  height: 34px;
  font-weight: 600;
  font-size: 24px;
  line-height: 34px;
  margin: 10px 3px;
  color: #083E50;
  flex: none;
  order: 0;
  flex-grow: 0;

}
 #service-content-box .content .content-right .content-info{
  overflow-x: auto;
  width:100%;
 }


@media (max-width: 374px){
  

}

@media (min-width: 374px) and (max-width: 450px) {
  
  .content-info *{
    font-size: 14px!important;
  }
}

@media (max-width: 554px) {

}

@media (min-width: 375px) and (max-width: 768px) {

  .content-info td{
    /*width:auto!important;
    padding:5px;*/
    min-width: 160px;
    max-width:160px;
  }

}
@media (min-width: 768px) and (max-width: 991px) {
  #service-ban-box{
    width:100%;
    top: 128px;
  }
  #service-content-box{
    top: 122px;
    margin-bottom: 60px;
  }

}

@media (min-width:992px) {
  .nav-sticky .navbar-nav li.open-account{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    height: 32px;
    line-height: 32px;
    background: #083E50;
    border-radius: 20px;
    flex: none;
    order: 4;
    flex-grow: 0;
    z-index: 4;
  }
  .nav-sticky .navbar-nav li.open-account a{
    height: 16px;
    font-weight: 600;
    font-size: 16px;
    line-height: 16px;
    color: #FFFFFF !important;
    flex: none;
    order: 0;
    flex-grow: 0;
  }
  #service-ban-box{
    width:100%;
    height: 120px;
    top: 90px;
  }
  #service-ban-box .container .nav-top{
    display: none;
  }
  #service-ban-box .container .ban-title-box{
    height: 120px;
    line-height: 120px;
  }
  #service-ban-box .container .ban-title-box .ban-title-nav{
    height: 128px;
    line-height: 128px;
    top: 0;
  }
  #service-content-box{
    width: 100%;
    background: #F2F7FF!important;
    position: relative;
    top: 85px;
    padding-bottom: 64px;
  }
  #service-content-box .services-nav-box{
    padding: 0px;
    width: 900px;
    height: 64px;
  }
  #service-content-box .container{
    width:900px;
    height:64px;
    left:calc(50% - 900px/2);
    padding:0px;
    background-color:#F2F7FF;
  }
  #service-content-box .nav-max{
    display:none;
  }
  #service-content-box .container .nav{
    width:900px;
    height:64px;
    text-align: left;
    display: inherit;
    line-height: 64px;
  }
  #service-content-box .container .nav .title{
    height: 16px;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #6C6C6C;
    flex: none;
    order: 0;
    flex-grow: 0;
    padding: 0 5px 0 0;
  }

  #service-content-box .content{
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 0px;
    width: 900px;
    background: #FFFFFF;
    border-radius: 24px;
    flex: none;
    order: 1;
    flex-grow: 0;
    left: calc(50% - 900px/2);
    margin-bottom: 64px;
  }
  #service-content-box .content .content-left{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 40px 0px;
    gap: 8px;
    width: 264px;
    background: rgba(255, 255, 255, 0.01);
    box-shadow: 1px 0px 0px #e9eaed;
    border-radius: 24px 0px 0px 24px;
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
  }
  #service-content-box .content .content-left .menu-title-p{
    display:none;
  }
  #service-content-box .content .content-left ul{
    display: inline-block;
    margin:0;
    padding:0;
  }
  #service-content-box .content .content-left ul li{
    list-style:none;
    width: 264px;
    height: 48px;
    line-height: 48px;
  }
  #service-content-box .content .content-left ul li a{
    height: 48px;
    font-weight: 600;
    font-size: 16px;
    line-height: 48px;
    color: #083E50;
    display: inherit;
    padding-left: 32px;
    float: left;
    width: 90%;
  }
  #service-content-box .menu-title img{
    display:none;
  }
  #service-content-box .content .content-left ul li.active{
    background: #F7F7F7;
  }
  #service-content-box .content .content-left ul li.active .act{
    /*position: relative;*/
    width: 6px;
    height: 14.61px;
    left: 0px;
    float:left;
    /*top: calc(50% - 14.61px/2 + 0.3px);*/
    background: #083E50;
    border-radius: 0px 2px 2px 0px;
  }
  #service-content-box .content .content-left ul li.active a{
    border: none;
    padding-left: 30px;
    /*left: 5px;
    position: relative;*/
  }
  #service-content-box .content .content-right{
    padding: 64px 60px;
    width: 864px;
    min-height: 300px;
    float:left;
  }
  #service-content-box .content .content-right .title{
    height: 50px;
    font-weight: 600;
    font-size: 36px;
    line-height: 50px;
    color: #083E50;
    margin: 0 3px;
    padding: 0;
  }
  #service-content-box .content .content-right .content-info{
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    flex: none;
    order: 1;
    flex-grow: 0;
  }

  /*#service-ban-box, #service-content-box{
    top:68px;
  }*/

  #service-content-box .content .content-left{
    width:236px;
  }
  #service-content-box .content .content-right{
    width:664px;
  }
  #service-content-box .content .content-left ul li{
    width:236px;
    background-color:#FFFFFF;
  }
  #service-content-box .content .content-left ul li a{
    font-size:14px;
  }


}

@media (min-width:1200px) {
  .nav-sticky .navbar-nav li.open-account{
    height: 40px;
    line-height: 40px;
  }
  #service-ban-box{
    height: 160px;
    top: 108px;
  }
  #service-ban-box .container{
    height: 160px;
  }

  #service-ban-box .container .ban-title-box{
    height: 160px;
    line-height: 160px;
  }
  #service-ban-box .container .ban-title-box .ban-title-nav{
    height: 160px;
    line-height: 160px;
  }
  #service-ban-box .container{
    max-width: 1128px;
    left: calc(50% - 1128px/2);
    padding: 0;
  }

  #service-ban-box .container .ban-title-box .ban-title-nav{
    font-size: 48px;
  }

  #service-content-box{
    top: 102px;
  }
  #service-content-box .services-nav-box{
    padding: 0px;
    width: 1128px;
    height: 64px;
  }
  #service-content-box .container{
    width:1128px;
    height:64px;
    left:calc(50% - 1128px/2);
    padding:0px;
  }
  #service-content-box .container .nav{
    width:1128px;
    height:64px;
    text-align: left;
    display: inherit;
    line-height: 64px;
  }

  #service-content-box .content{
    width: 1128px;
    left: calc(50% - 1128px/2);
  }
  #service-content-box .content .content-left{
    width: 264px;
  }
  #service-content-box .content .content-left ul li{
    width: 264px;
  }
  #service-content-box .content .content-left ul li a{
    font-size: 16px;
  }
  #service-content-box .content .content-right{
    width: 864px;
  }
  
  .footer-countus, .copyright{
    top: 20px;
    position: relative;
  }

}


@media (min-width:1440px) {
  #service-ban-box{
    top: 128px;
  }
  #service-content-box{
    top: 122px;
  }
  .footer-countus, .copyright{
    top: 50px;
  }
  
}