body{
  font-family: 'PingFang HK';
  font-style: normal;
  font-size:16px;
}
/* 为所有的单选按钮设置样式 */
input[type="radio"] {
  /* 可以设置宽度、高度、边框、背景色等 */
  width: 20px;
  height: 20px;
  line-height: 20px;
  margin-right: 5px;
  background: #FFFFFF;
  border: 1px solid #083E50;
  border-radius: 4px;
  cursor: pointer;
  -webkit-appearance: none; /* 移除默认样式 */
  -moz-appearance: none;    /* 移除默认样式 */
  appearance: none;          /* 移除默认样式 */
  display: inline-block;     /* 使单选按钮水平排列 */
  margin-top: 9px;
}
 
/* 为选中的单选按钮设置样式 */
input[type="radio"]:checked {
  background-color: #083E50; /* 选中时的背景色 */
  border-color: #083E50;     /* 选中时的边框颜色 */
}
input[type="radio"]:checked + label::before {
  content: "√"; /* 显示☑字符 */
  color: #FFFFFF; /* 字体颜色 */
  font-size: 20px; /* 字体大小 */
  margin-right: 5px; /* 与radio按钮的距离 */
  display: inline-block; /* 使得伪元素可以作为块级元素显示 */
  width: 20px; /* 伪元素宽度 */
  height: 20px; /* 伪元素高度 */
  text-align: center; /* 文字居中 */
  line-height: 20px; /* 行高与高度相同，使得文字垂直居中 */
  border-radius: 4px; /* 圆形 */
  border: 1px solid #083E50; /* 边框 */
  background-color: #083E50; /* 选中时的背景色 */
}
/* 定义与radio按钮关联的label的样式 */
label {
  cursor: pointer; /* 鼠标悬停时显示指针样式 */
  width: 20px;
  height: 20px;
  line-height: 20px;
  background: #FFFFFF;
  border: 1px solid #083E50;
  border-radius: 4px;
}

.layui-unselect{
  width:0px;
}
.user-ques-type .layui-unselect{
  width:auto;
  height: 42px;
  background: #F7F7F7;
  border-radius: 8px;
  flex: none;
  order: 1;
  align-self: stretch;
  flex-grow: 0;
  border: none;
  text-indent: 15px;
}

#service-ban-box{
  top: 80px;
}
#countus-content-box{
  position:relative;
  top:75px;
}
#countus-content-box .content .content-right -info img{
  width:100%!important;
  height:auto!important;
}
.content-info p{
  margin:0;
  padding:0;
  font-family: 'PingFang HK';
  line-height: initial;
  width: 100%;
}
.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;
  min-width: 100px;
  max-width:200px;
}

.content-info span{
  padding: 0 5px;
  font-family: 'PingFang HK';
  display:inline-block;
}

#countus-content-box .content{
  /*margin-top:30px;*/
  background-color:#FFFFFF;
}
#countus-content-box .content .content-left,#countus-content-box .content .content-right{
  width: 100%;
  display: flex;
  position: relative;
}
#countus-content-box .content .content-right{
  height:655px;
  margin-top: 20px;
}

#countus-content-box .content .content-right  .send-box{
    /* Auto layout */
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0px;
    gap: 28px;

    width: 90%;
    height: 410px;
    position:absolute;
    top: 20px;
    left: 5%;

    flex: none;
    order: 0;
    flex-grow: 0;

  }
  #countus-content-box .content .content-right  .send-box .wel-text{
    width: 144px;
    height: 50px;

    font-family: 'PingFang TC';
    font-weight: 600;
    font-size: 36px;
    line-height: 50px;

    color: #083E50;

    flex: none;
    order: 0;
    flex-grow: 0;

  }
  #countus-content-box .content .content-right  .send-box .text-area{
    width: 100%;
    height: 165px;
    text-indent: 1em;
    background: #F7F7F7;
    border-radius: 8px;
    flex: none;
    order: 1;
    align-self: stretch;
    flex-grow: 0;
    border: none;
    resize: none;
    color:#6C6C6C;
  }
  #countus-content-box .content .content-right  .send-box .user-number, #countus-content-box .content .content-right  .send-box .user-password, #countus-content-box .content .content-right  .send-box .user-ques-type{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0px;
    gap: 15px;

    width: 100%;
    height: 83px;

    flex: none;
    order: 1;
    align-self: stretch;
    flex-grow: 0;

  }
  #countus-content-box .content .content-right  .send-box .user-ques-type select, #countus-content-box .content .content-right  .send-box .user-ques-type select option{
    color:#6C6C6C;
  }
  #countus-content-box .content .content-right  .send-box .user-text-area{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0px;
    gap: 15px;

    width: 100%;
    height: 202px;


    /* Inside auto layout */
    flex: none;
    order: 3;
    align-self: stretch;
    flex-grow: 0;

  }
  #countus-content-box .content .content-left .title{
    max-width: 440px;
    height: 50px;
    font-weight: 600;
    font-size: 36px;
    line-height: 50px;
    color: #083E50;
    margin: 0;
    padding: 0;
  }
  #countus-content-box .content .content-left .content-info{
    width: 90%;
    position:relative;
    left: 5%;
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    flex: none;
    order: 1;
    flex-grow: 0;
  }
  #countus-content-box .content .content-right  .send-box .title{
    /*width: 64px;*/
    height: 16px;
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
    margin-bottom: 5px;
    color: #083E50;

    flex: none;
    order: 0;
    flex-grow: 0;

  }

  #countus-content-box .content .content-right  .send-box .inp-text{
    width: 100%;
    height: 42px;

    background: #F7F7F7;
    border-radius: 8px;

    /* Inside auto layout */
    flex: none;
    order: 1;
    align-self: stretch;
    flex-grow: 0;
    border: none;
    text-indent: 15px;
    color:#6C6C6C!important;
  }
  #countus-content-box .content .content-right  .send-box .user-number .un-box .un-left, #countus-content-box .content .content-right  .send-box .user-number .un-right{
    float: left;
    display: inline-block;
  }
  #countus-content-box .content .content-right  .send-box .user-number .un-box .un-left .inp-text{
    width:179px;
    margin-right:10px;
  }
  #countus-content-box .content .content-right  .send-box .user-number .un-right{
    width:140px;
  }
  #countus-content-box .content .content-right  .send-box .user-number .un-right p{
    display: inline-flex;
    line-height: 22px;
    line-height: 38px;
    height: 38px;
  }
  #countus-content-box .content .content-right  .send-box .user-number .un-right input{
    
  }

  #countus-content-box .content .content-right  .send-box .user-rember-forget{
    /* Auto layout */
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 0px;
    gap: 15px;

    width: 520px;
    height: 22px;
    line-height:22px;

    /* Inside auto layout */
    flex: none;
    order: 3;
    align-self: stretch;
    flex-grow: 0;

  }
  #countus-content-box .content .content-right  .send-box .user-rember-forget .rember{
    height: 20px;
    line-height: 20px;
    display: flex;
  }
  #countus-content-box .content .content-right  .send-box .user-rember-forget input{
    box-sizing: border-box;

    width: 20px;
    height: 20px;

    /* #083E50 */
    border: 1px solid #083E50;
    border-radius: 4px;

    /* Inside auto layout */
    flex: none;
    order: 0;
    flex-grow: 0;

  }
  #countus-content-box .content .content-right  .send-box .user-rember-forget .rember .title{
    width: 48px;
    height: 22px;
    margin-left: 10px;
  }
  #countus-content-box .content .content-right  .send-box .user-rember-forget .forget .title{
    margin: 0 auto;
    width: 80px;
    height: 22px;
  }

  #countus-content-box .content .content-right  .send-box .send-btn{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 16px 0px;
    gap: 16px;

    width: 100%;
    height: 60px;

    background: #083E50;
    border-radius: 40px;

    /* Inside auto layout */
    flex: none;
    order: 4;
    align-self: stretch;
    flex-grow: 0;

  }
  #countus-content-box .content .content-right  .send-box .send-btn p{
    width: 100%;
    text-align: center;
    cursor: pointer;
    height: 60px;
    line-height: 60px;
    font-weight: 600;
    font-size: 16px;
    /* identical to box height, or 100% */

    /* #FFFFFF */
    color: #FFFFFF;

    /* Inside auto layout */
    flex: none;
    order: 0;
    flex-grow: 0;
    margin: 0;
  }
  #countus-content-box .content .content-right  .send-box .send-btn p img{
    width:22px;
    height:22px;
    position:relative;
    top:-2px;
    margin-right:20px;
  }
  .footer-countus{
    overflow:hidden;
    top: 80px;
  }

  .copyright{
    background-image: url(/static/index/images/footer-copyright.png)!important;
    top: 80px;
  }



@media (max-width: 374px){
  

}

@media (min-width: 374px) and (max-width: 450px) {
  
}

@media (max-width: 554px) {
  
}

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

  

}
@media (min-width: 768px) and (max-width: 991px) {
  #service-ban-box{
    top: 128px;
  }
  #countus-content-box{
    top: 122px;
  }
  
  .footer-countus{
    top:128px;
  }
  .copyright{
    top:128px;
  }

}

@media (min-width:992px) {
  #service-ban-box{
    width:100%;
    height: 160px;
    position: relative;
    background: url(/static/index/images/service.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    top: 83px;
  }
  #service-ban-box .container{
    max-width: 900px;
    height: 160px;
    position: relative;
    left: calc(50% - 900px/2);
    padding: 0;
  }

  #service-ban-box .container .ban-title-box{
    width: 192px;
    height: 160px;
    line-height: 160px;
    margin: 0;
    padding: 0;
  }
  #service-ban-box .container .ban-title-box .ban-title-nav{
    width: 192px;
    height: 160px;
    font-weight: 600;
    font-size: 40px;
    line-height: 160px;
    color: #FFFFFF;
    margin-bottom: 0!important!;
  }

  #countus-content-box{
    width: 100%;
    height:800px;
    background: #FFFFFF!important;
    position: relative;
    top: 83px;
    /*padding-bottom: 64px;*/
  }
  #countus-content-box .services-nav-box{
    padding: 0px;
    width: 900px;
    height: 64px;
  }
  #countus-content-box .container{
    width:900px;
    height:64px;
    left:calc(50% - 900px/2);
    padding:0px;
  }
  #countus-content-box .container .nav{
    width:900px;
    height:64px;
    text-align: left;
    display: inherit;
    line-height: 64px;
  }
  #countus-content-box .container .nav .title{
    width: 24px;
    height: 16px;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    padding: 0 5px 0 0;
    color: #6C6C6C;

  }

  #countus-content-box .content{
    position: relative;
    top: 80px;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 0px;
    width: 900px;
    background: #FFFFFF;
    flex: none;
    order: 1;
    flex-grow: 0;
    left: calc(50% - 900px/2);
    margin-bottom: 64px;
    margin-top:0;
  }
  #countus-content-box .content .content-left,#countus-content-box .content .content-right{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    /*padding: 40px 0px;*/
    gap: 8px;
    background: rgba(255, 255, 255, 0.01);
    border-radius: 24px 0px 0px 24px;
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
  }
  #countus-content-box .content .content-right{
    width:50%;
  }
  
  #countus-content-box .content .content-left{
    /*padding: 64px 60px;*/
    width: 50%;
    min-height: 300px;
    float:left;
  }
  #countus-content-box .content .content-left .title{
    max-width: 440px;
  }
  #countus-content-box .content .content-left .content-info{
    max-width:440px;
  }

  #service-ban-box{
    top:90px;
  }
  #countus-content-box{
    top:85px;
  }

  #countus-content-box .content .content-right  .send-box{
    width: 440px;
    height: 410px;
    position:absolute;
    left: calc(50% - 440px/2);

  }
  #countus-content-box .content .content-right .send-box .user-number, #countus-content-box .content .content-right .send-box .user-password, #countus-content-box .content .content-right .send-box .user-ques-type {
    width: 440px;
  }
  #countus-content-box .content .content-right .send-box .user-number .un-box .un-left .inp-text{
    width:290px;
    margin-right:10px;
  }
  #countus-content-box .content .content-right .send-box .inp-text, #countus-content-box .content .content-right .send-box .text-area, #countus-content-box .content .content-right .send-box .send-btn{
    width:440px;
  }

  .footer-countus{
    overflow:hidden;
    top:85px;
  }
  .copyright{
    top:45px;
  }

}

@media (min-width:1200px) {
  #service-ban-box{
    top: 105px;
  }
  #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;
  }

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

  #countus-content-box .content .content-right  .send-box{
    width: 520px;
    height: 410px;
    position:absolute;
    left: calc(50% - 520px/2);

  }

  #countus-content-box .content .content-left .title{
    max-width: 520px;
  }
  #countus-content-box .content .content-left .content-info{
    max-width:450px;
  }


  #countus-content-box .content .content-right .send-box .user-number, #countus-content-box .content .content-right .send-box .user-password, #countus-content-box .content .content-right .send-box .user-ques-type {
    width: 520px;
  }
  #countus-content-box .content .content-right .send-box .user-number .un-box .un-left .inp-text{
    width:356px;
    margin-right:10px;
  }
  .inp-text:focus , .text-area:focus{
    border: none;
    outline: none; /* 也可以隐藏轮廓，如果需要的话 */
  }
  #countus-content-box .content .content-right .send-box .inp-text, #countus-content-box .content .content-right .send-box .text-area, #countus-content-box .content .content-right .send-box .send-btn{
    width:520px;
  }


  #countus-content-box .content{
    width: 1128px;
    left: calc(50% - 1128px/2);
  }

  
  
  .footer-countus, .copyright{
    top: 78px;
    position: relative;
  }
  .footer-horse{
    top:80px;
  }

}


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