/* Styles for validation helpers
-----------------------------------------------------------*/

*,*:before,*:after{
    margin:0;
    padding:0;
    outline:none;
    list-style:none;
    text-decoration:none;
    blr:expression(this.onFocus=this.blur());
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; 
} 

        * {
            margin: 0px;
            padding: 0px;
        }
body,html { 
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
     background: #fff;
    font-family:arial, Microsoft YaHei, "微软雅黑";
	color:#666;
    font-size: 15px; 
	line-height:1.7;  
}

button, input, textarea ,select{
    border:none;
    background:none;
    font-size:14px;
    vertical-align:middle;
    color:#333; 
	font-family: arial, Microsoft YaHei, "微软雅黑";
}
select {
    border:inherit;
    background: inherit;
}
a {
    text-decoration:none;
    blr:expression(this.onFocus=this.blur());
    outline: none;
    color:#333;
    cursor:pointer;
} 
a:hover,a:active,a:focus {
    text-decoration:none;
} 
em, i {
    font-style:normal;
}
a:focus, input, select {
    outline:none;
}
.clear {
    zoom:1;
}
.clear:after {
    content:"\200B";
    display: block;
    clear: both;
    height: 0;
}
input[type="submit"], input[type="reset"], input[type="button"], button, select {
    -webkit-appearance: none;
}
input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover, button:hover{
    opacity: 0.80;
} 
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6,label{  padding: 0; margin: 0; font-size: 14px; line-height: 1.25;}
p,ul, ol{ margin: 0;}
header,main,footer,section{ display:block;}
ul,li,ol {
    list-style: none;
}
.left {
  float: left;
}

.right {
  float: right;
}

/***********************************导航栏begin************************************************************************************/
        .nav {
            width: 100%;
            height: 100px;
       
            display: flex;
            position: fixed;
            padding: 0 40px;
            background-color: #fff;
            border-bottom: 1px solid #eee;
            z-index: 999;
        }
        .nav-logo {
            height: 100%;
            width: 120px;
            display: flex;
            align-items: center;
 
        }
        .nav-logo img{height:56px;width:200px;}
        .logo {
            height: 40px;
            width: 65px;
            background-image: url(../../Content/imges/logo-2.png);
            background-size: 100% 100%;
            cursor: pointer;
 
        }
        .nav-middle {
            height: 100%;
            width: 1200px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding-left: 180px;
        }
 
        .nav-middle .item {
            font-size: 21px;
            color: #293040;
            line-height: 32px;
        }
 
        .nav-middle .item a {
            text-decoration: none;
            color: #293040;
        }
 
        .nav-middle .item a:hover {
            color: #5e7ce0;
        }
 
        .nav-middle .item .main {
            color: #5e7ce0;
        }
 
        .header {
            width: 100%;
            height: 517.83px;
        }
 /***********************************导航栏end************************************************************************************/
  /***********************************首页begin************************************************************************************/
  .width_scale{width: 85%;}
        .content {
            
            margin: 0px auto;
            margin-top:150px;
      margin-bottom:100px;
        }
        .content_1 {
            
            margin: 0px auto;
            margin-top:0px;
      margin-bottom:100px;
        }
        .class-box {
            height: 930px;
            margin: 0 auto;
        }
 
        .class-box .class-box-top {
            width: 100%;
            height: 120px;
            text-align: center;
        }
 
        .class-box .class-box-top h3 {
            font-size: 40px;
            font-weight: 700;
            color: #293040;
            margin: 20px 0 16px;
        }
 
        .class-box .class-box-top p {
            font-size: 16px;
            color: #575d6c;
        }
        .class-box .class-box-middle {
            width: 100%;
            /*height: 850px;*/
        }
 
 
        .card-box {
            width: 100%;
            display: flex;
            /*justify-content: space-between;*/
            flex-wrap: wrap;
            /*height: 850px;*/
        }
 
        .card-item {
            width: 31.5%;
            height: 386px;
            border-radius: 12px 12px 0 0;
            box-shadow: 0 4px 16px 0 rgba(83, 85, 95, 0.12);
            margin-bottom:30px;
            margin-right:1.83%;
        }
 
        .card-item:hover {
            box-shadow: 0 20px 16px 0 rgba(83, 85, 95, 0.12);
            transform: scale(1.02); /*transform:变形属性，scale：缩放1.02倍 */
        }
 
 .card-item_2 {
            width: 48.5%;
            height: 386px;
            border-radius: 12px 12px 0 0;
            box-shadow: 0 4px 16px 0 rgba(83, 85, 95, 0.12);
            margin-bottom:30px;
            margin-right:1.5%;
        }
.card-item_4 {
    width: 23.5%;
    height: 386px;
    border-radius: 12px 12px 0 0;
    box-shadow: 0 4px 16px 0 rgba(83, 85, 95, 0.12);
    margin-bottom: 30px;
    margin-right: 1.5%;
}
 
        .card-item-1 .card-img {
            height: 270px;
            border-radius: 12px 12px 0 0;
        }
         .card-item-1 .card-img-1 {
            height: 230px;
            border-radius: 12px 12px 0 0;
        }
      .card-item-1 .card-img img
      {
          height:100%;
          width:100%;
      }
 
        .card-item .title {
            width: 100%;
            font-size: 16px;
            color: #293040;
            font-weight: 700;
            margin-top: 15px;
            display: block;
            padding-left: 15px;
            box-sizing: border-box;
        }
 
 
        .card-item .desc {
            height: 48px;
            line-height: 24px;
            width: 100%;
            font-size: 14px;
            color: #5e6678;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            letter-spacing: .5px;
            word-break: break-all;
            padding: 0 15px;
            box-sizing: border-box;
        }
 
        .card-item .desc .desc-p {
            z-index: 9999;
            box-sizing: border-box;
            border-bottom: 1px solid rgb(238, 238, 238);
            padding-bottom: 2px;
        }
 
 
 .card-item .free {
            width: 100%;
            height: 52px;
            text-align: right;
            line-height: 52px;
            font-size: 14px;
            color: #e41f2b;
            padding: 2px 15px;
            border-radius: 2px;
            box-sizing: border-box;
        }
        
 
        .content .market-box {
            width: 100%;
            /*height: 700px;*/
            /*background-color: #fafafa;*/
            margin-top:40px;
        }
 
        .content .market-box-body {
            /*width: 1200px;*/
            /*height: 700px;*/
            margin: 0 auto;
        }
 
        .market-box-body .class-box-top {
            width: 100%;
            height: 120px;
            text-align: center;
            
        }
 
        .market-box-body .class-box-top h3 {
            font-size: 40px;
            font-weight: 700;
            color: #293040;
            margin: 20px 0 16px;
        }
 
        .market-box-body .class-box-top p {
            font-size: 16px;
            color: #575d6c;
        }
    /***********************************首页end************************************************************************************/    
      /***********************************底部begin************************************************************************************/  
 .footer {
  background-color: #0b0b0b;
  overflow: hidden;
  position: relative;
  top: 1px;
}
.footercontent
{
  width: 83.33%;
  margin: 0 auto;
  /* overflow: hidden; */
}
.footertop {
  padding-top: 50px;
  padding-bottom: 25px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.footer ul {
  display: -webkit-flex;
  /* Safari */
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 50%;
  line-height: 50px;
}

.footer ul li a {
  font-size: 16px;
  color: #fff;
  opacity: 0.4;
  transition: 0.5s;
}

.footer ul li a:hover {
  opacity: 1;
}

.footer ul li.act a {
  opacity: 1;
}


.footer .footerbot .left {
  margin-top: 15px;
}

.footer .footerbot .ti {
  font-size: 16px;
  color: #fff;
  opacity: 0.5;
  margin-top: 0.2rem;
}

.footer .footerbot .right {
  width: 130px;
  height: 130px;
    position: relative;
  cursor: pointer;
  margin-top: 40px;
}
.footer .footerbot .right img {
  position: absolute;
  left: 50%;
  top: -15%;
  
  width:100%;
  height:100%;
}


.footer .footerlast a {
  font-size: 14px;
  color: #fff;
}

.footer .footerlast {
  padding-bottom: 35px;
  font-size: 14px;
  color: #fff;
  opacity: 0.4;
  margin-top: 20px;
}
  /***********************************底部end************************************************************************************/
        
    /********首页轮播图 begin****************/
#carousel {
    margin: auto; /* 居中 */
    width: 98.9vw; /* 设置宽度 浏览器可视窗口宽度的99%*/
    height: 550px;
    position: relative; /* 相对定位 */
    overflow: hidden; /* 超出隐藏 */
    top: 100px;
}
    #carousel img {
        width: 98.9vw; /* 设置宽度 浏览器可视窗口宽度的99%*/
        /*height:546px;*/
        height: 65vh;
    }
    #carousel > ul {
        display: flex; /* 图片处理为一行 */
        position: absolute; /* 设置绝对定位，实现相对于#carousel的绝对定位 */
    }
    #carousel > ul,
    #carousel > ul > li{
        padding: 0;
        margin: 0;
        list-style:none; 
    }

    /* 控制按钮的样式 */
    #leftArrow,
    #rightArrow{
        position: absolute;
        left: 5px;
        top: 50%;
        width: 25px;
        height: 30px;
        display: flex;
        justify-content: center;
        align-items: center;
        color:#595997;
        font-size: 50px;
        cursor: pointer;
    }
    #rightArrow{
        left: auto;
        right: 5px;
    }
    #sliderBtn{
        position: absolute;
        width: 100%;
        bottom: 0;
        display: flex;
        justify-content: center;
    }
    .unitBtn{
        width: 10px;
        height: 10px;
        background-color: #eee;
        border-radius: 10px;
        margin: 10px;
        cursor: pointer;
    }
    .active{
        background-color: #4C98F7;
    }
    /********首页轮播图 end****************/
  
  
      /********分页 ****************/  
    .pagination {
  text-align: center;
  margin-bottom: 80px;
  margin-top:50px;
}

.pagination a {
  padding: 0 13px;
  min-width: 40px;
  line-height: 38px;
  border: 1px solid #dedede;
  box-sizing: border-box;
  margin: 0 5px;
  transition: 0.5s;
  font-size: 14px;
  display: inline-block;
}

.pagination a:hover {
  background-color: #f39800;
  color: #fff;
  border: 1px solid #f39800;
}

.pagination a.active {
  background-color: #f39800;
  color: #fff;
  border: 1px solid #f39800;
}

/***********************************页面头部图片加导航begin************************************************************************************/ 
    .headimg{margin: auto;  width: 98.9vw; height:475px;}
    .headimg img{margin: auto; width: 100%; height:100%;}
    
    .news_nav{display:block;
              box-sizing: border-box;
              vertical-align: middle;
              line-height: 70px;
              border-bottom: 1px solid #dedede;
              height: 70px;
              overflow: hidden;
              text-align:center;
              }
    .news_nav .news_nav_con a{font-size: 16px;
                             display: inline-block;
                             text-decoration: none;
                            -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
                            margin-left:30px;
                            position: relative;  
                            }
    .news_nav .news_nav_con a:after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 50%;
      width: 0%;
      border-bottom: 2px solid #f39800;
      transform: translateX(-50%);
      transition: 0.5s;
}

.news_nav a.act {
  color: #f39800;
}
.news_nav a.act:after {
  width: 100%;
}
     /***********************************新闻资讯begin************************************************************************************/ 
 .newscon{
            margin: 0px auto;
            margin-top:30px;
      margin-bottom:50px;
      background:#fff;
      padding:50px 30px 50px 30px;}
.newscon .news_title{
    text-align: center;
    font-size: 26px;
    color: #474545;
    margin-top: 30px;
}

.newscon .news_date
{
    text-align: center;
    border-bottom: 1px solid #dedede;
    height: 70px;
    line-height: 70px;

    }
   .newscon  .news_content{padding:18px 18px 60px 18px;}
   .newscon  .news_footer{
       text-align: center;
    border-top: 1px solid #dedede;
    height: 70px;
    line-height: 70px;
       }

/***********************************新闻资讯end************************************************************************************/ 
/***********************************产品服务begin************************************************************************************/   
     
         .prolist_con{margin: 0px auto;margin-bottom:100px;margin-top:0px;padding:50px 100px 50px 100px;}
    .prolist_con .product_list{flex-wrap:wrap}
    .prolist_con .product_list li{height:170px;border-bottom: 1px solid #dedede;margin-bottom:30px;}
    .prolist_con .product_list a{display: flex;flex-direction:inherit !important;}
    .prolist_con .product_list .product_list_left{width:200px;}
    .prolist_con .product_list .product_list_left img{width:200px;height:125px;}
    .prolist_con .product_list .product_list_right{margin-left:20px;flex:1;}
    .prolist_con .product_list .product_list_right h3{ font-size: 18px;height: 30px;}
    .prolist_con .product_list .product_list_right .product_list_rightcon{font-size: 14px;color:#777c81;height:48px;line-height:24px;  overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            letter-spacing: .5px;
            word-break: break-all;
            padding: 0 15px;
            box-sizing: border-box;margin-bottom:24px;}
    .prolist_con .product_list .product_list_right .product_list_right_date{font-size: 14px;text-align:right;color:#777c81;}
    
    
/***********************************产品服务end************************************************************************************/   


/***********************************行业法规begin************************************************************************************/   
    .lawcontent{
            margin: 0px auto;
            margin-top:70px;
      margin-bottom:100px;}
.lawcon{display: flex;}
.lawcon_left{background:#fff;height:700px;padding:20px 0px 20px 20px;width:20%;}
.lawcon_left li{height:40px;line-height:40px;}
.lawcon_left li a{font-size:16px;font-weight:400;color:#255caf;}
.lawcon_left li.act a{font-weight:600;}
.lawcon_left li a:hover{font-weight:600;}
.lawcon_right{background:#fff;height:700px;width:80%;margin-left:20px;padding:15px 15px 15px 15px;}
.lawcon_right li{height:40px;line-height:40px;border-bottom: 1px dashed #dedede;margin-bottom:10px;}
.lawcon_right li:hover{font-weight:600;}
.lawcon_right p{font-size:14px;}
.lawcon_right .law_title{float:left}
.lawcon_right .law_date{float:right}

/***********************************行业法规end************************************************************************************/   


/***********************************关于交安begin************************************************************************************/ 
.selfcon{margin: 0px auto;
            margin-top:60px;
      margin-bottom:80px;
      display: flex;}
      .selfcon1{margin: 0px auto;
            margin-top:60px;
      margin-bottom:80px;
      }
  .selfcon_left{height:500px;width:60%;}
  .selfcon_right{height:420px;width:40%;padding-left:30px;}    
  .selfcon_right img{width:100%;height:100%;}
  .selfcon_left_title{height:70px;font-size:26px;color:#0d0c0c;}    
  .selfcon_left_con{font-size:16px;color:#0d0c0c;}
  .selfcon_ul{display: flex;
            justify-content: space-between;
            flex-wrap: wrap;}
   .selfcon_ul li{width:23.5%;margin-bottom:30px;padding:10px 10px 20px 10px;display: flex;flex-direction:column;border-radius:12px 12px 0 0;box-shadow:0 4px 16px 0 rgb(83 85 95 / 12%);
                  background:#fff;}
      .selfcon_ul li div{display: flex;justify-content:center;width:100%;height:100%;
                         /*border-radius:12px 12px 0 0;box-shadow:0 4px 16px 0 rgb(83 85 95 / 12%);*/
                         padding:10px;}
   .selfcon_ul li img{max-width:100%;height:200px;}
   .selfcon_ul li .title {
            width: 100%;
            font-size: 16px;
            color: #293040;
            font-weight: 700;
            margin-top: 15px;
            display: block;
            
            box-sizing: border-box;
            text-align:center;
        }
        .selfcon_ul li:hover {
            box-shadow: 0 20px 16px 0 rgba(83, 85, 95, 0.12);
            transform: scale(1.02); /*transform:变形属性，scale：缩放1.02倍 */
        }
        
 /***********************************关于交安end************************************************************************************/ 
 
  /***********************************联系我们begin************************************************************************************/ 
    .linkus_con{margin: 0px auto;
            margin-top:60px;
      margin-bottom:80px;
      height:340px;
      }
       .linkus_con ul{background-color: #fff;
  height:380px;
  display:flex;
  flex-wrap:wrap;
  box-shadow: 1px 1px 10px #dedede;
       }
     .linkus_con ul li{width: 50%;
  display: inline-block;
  vertical-align: top;
  height: 1.9rem;
  position: relative;
  transition: 0.5s;
  cursor: pointer;
  height:190px;
 
  text-align:center;
  }
       .linkus_con ul li.after{content: '';
  height: 80%;
  border-right: 1px solid #dedede;
  position: absolute;
  right: 0;
  bottom: 0;}
       .linkus_con .center{
  text-align: center;
  padding:30px 30px 30px 30px;}
   .linkus_con .center .icon{
  height:40px;}
         .linkus_con .center .c1{
            font-size: 18px;
  color: #333;
  transition: 0.5s;
  height:40px;}
  .linkus_con .center .c2{
            font-size: 16px;
  transition: 0.5s;
  color: #666;
  height:40px;}
  .linkus_con  .left1
  {
       border-bottom:1px solid #dedede;
  border-right:1px solid #dedede;
      }
  .linkus_con  .left2{border-right:1px solid #dedede;}
  .linkus_con  .right1{ border-bottom:1px solid #dedede;}
  .linkus_con  .right2{}
    /***********************************联系我们end************************************************************************************/ 