.dib{display:inline-block;}
.tac{text-align:center;}
.fl{float:left;}
.ssl-bg1{background-color:#EFF1F5;padding:96px 0;}

.ssl-bg1 img{width:198px;height:60px;margin:0 auto 20px;display:block;border: 1px solid rgba(0, 0, 0, 0.1);border-radius:8px;}
.ssl-bg1 div{padding:32px 20px 24px;border-radius:12px;background-color:#fff;height:186px;box-sizing: border-box;margin: 0 auto;}
.ssl2-h{margin:72px 0 64px;}
.ssl3-h{margin-top:80px;}
.ssl3-text{font-size: 16px; padding-bottom:100px;}
.ssl3-title{font-size: 26px;}

.dm2{padding-bottom:96px;}
.dm2-h1{margin:96px 0 32px;}
.ssl2-s li{width:25%;}
.ssl2-s li h1{padding-top:18px;}
.ssl2-s img{ width: 50px; height: 50px;}
.ssl2-s li h1{font-size: 18px;}
.ssl2-s li p{font-size: 14px;}
.ssl2-s p{color:#292929;margin-top: 16px;}
.ssl2-s span{color:#9e9e9e;}
.ssl2-s1 img{margin-right:10px;}
.ssl2-s1 span.c3{padding-top:12px;}


.cs-action{
  width: 100%;
  height: 200px;
  background: url('../images/cs-bg1.png');
  background-size: 1440px 100%;
  background-position: center 100%;
  background-repeat: no-repeat;
  background-color: #000;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 18px;
}
.cs-action-box{
  text-align: left;
}
.cs-action-box a{
  float: left;
  width:112px;
  height:40px;
  line-height:40px;
  border-radius:20px;
  margin:24px auto 0;
  text-align: center;
  display: block;
}

.tabs{
  display: flex;
  justify-content: center;
  border-bottom: 1px solid #F0F0F0;
}
.tabs a{
  display: inline-block;
  font-size: 16px;
  padding: 15px 28px;
  margin-bottom: -1px;
  color: #000;
}
.tabs a:hover{
  color:#FF5500;
}
.tabs .current{
  color:#FF5500;
  border-bottom: 2px solid #FF5500;
  font-weight: bold;
}

.tabs .current a{
  color: #FF5500;
}

.menus{
  width: 100%;
  display: flex;
  padding: 20px 0;
  cursor: pointer;
}
.menus ul li {
  padding: 10px 20px;
  color: #747474;
}
.menus ul li:hover{
  color:#FF5500;
}
.menus ul li.current{
  background: #FF5500;
  box-shadow: 0px 4px 16px 0px rgba(255,85,0,0.3);
  border-radius: 18px;
  color:#FFF;
}

.menus ul li a{
   color: #747474;
}

.menus ul li.current a{
  color:#FFF;
}

.content{
  clear: both;
  display: none;
}
.content ul{
  display: flex;
  flex-wrap: wrap;
}
.content ul li{
  width: 23%;
  padding: 0 1%;
}
.content ul li a{
  background: #FFFFFF;
  border-radius: 4px;
  border: 1px solid rgba(0,0,0,0.12);
  padding: 24px;
  display: block;
  transition:All 0.4s ease-in-out;
  -webkit-transition:All 0.2s ease-in-out;
  -moz-transition:All 0.2s ease-in-out;
  -o-transition:All 0.2s ease-in-out;
}
.content ul li a:hover{
  transform:translate(0,-10px);
  -webkit-transform:translate(0,-10px);
  -moz-transform:translate(0,-10px);
  -o-transform:translate(0,-10px);
  -ms-transform:translate(0,-10px);
  box-shadow: 0px 4px 32px 0px rgba(0,0,0,0.1);
}
.content ul li a p{
  font-size: 14px;
  color: #A1A1A1;
  overflow: hidden;
  text-overflow:ellipsis;
  white-space: nowrap;
}
.content ul li a p.title{
  color: #171717;
  font-size: 16px;
  font-weight: bold;
  padding-bottom: 12px;
}

.button-wrap{
  display:flex; 
  justify-content: center;
}
.button-wrap a{
  margin: 24px 10px 0 10px;
}
.button-wrap a.white-button{
  color: #FFF;
  border: 1px solid #FFFFFF;
  background: rgba(0, 0, 0, 0);
}

@media(max-width:767px){
  .ssl-bg1{padding:48px 0;}
  .dm2-h1{margin:60px 0 16px;}
  .dm2{padding-bottom:48px;}
  .ssl2-s li{width:50%; margin-top: 25px;}
  .ssl2-h{margin:40px 0 10px;}
  .ssl2-s li:nth-child(4),.ssl2-s li:last-child{width:50%;}
  .ssl2-s p{margin-top:8px;}
  .ssl-bg1 li{width:100%;}
  .ssl-bg1 div{width:auto;margin-bottom:20px;}
  .ssl3-img{ width: 100%}
  .ssl3-title{padding-top: 40px;}
  .ssl3-text{padding-bottom:30px;}
  .content ul{display: block;}
  .content ul li{width: 100%; padding:0; margin-top: 3%;}
  .menus{ display: block; overflow: auto;}
  .menus ul{ white-space: nowrap;}
  .menus ul li { display: inline-block;}

  .full-menu-item h1{ font-weight: 400; font-size: 15px; padding-left: 12px;}
  .full-menu-item span{ display: none; width: 100%; float: left; padding-left: 24px;}
}
@media(min-width:768px){
  .ssl-bg1 div{width:auto;padding:32px 10px 24px;margin:20px;}
  .ssl-bg1 li{width:50%;}
  .ssl3-img{ width: 100%}
  .ssl3-title{padding-top: 80px;}
  .ssl3-text{padding-bottom:30px;}
  .content ul{display: block;}
  .content ul li{width: 100%; padding:0; margin-top: 2%;}
  .menus{ display: block; overflow: auto;}
  .menus ul{ white-space: nowrap;}
  .menus ul li { display: inline-block;}
  #header:hover{
    background-color: #fff;
    animation:fadein .4s;
  }
  /*#header .logo-black{display: none;}*/
  #header:hover .logo{display: none;}
  /*#header:hover .logo-black{display: block;}*/
  @keyframes fadein
  {
    0%   {background:rgba(255, 255, 255, 0);}
    100%  {background:rgba(255, 255, 255, 100);}
  }
  /*#header:hover #navl li,#header:hover #navl li a,#header:hover #navr li,#header:hover #navr li a{color: #232323;}*/
  #header:hover #navr li:last-child a{ color:#fff;}
  /*#header:hover #navr span{opacity:0.7;box-shadow:0 0 0 1px inset #000;padding:7.5px 36px 7.5px 16px;border-radius:20px;position:relative;}*/
  /*#header:hover #navr span:after{position:absolute;top:16px;right:16px;content:'';width:0px;height:0px;border-top:7px solid #000;border-right:6px solid transparent;border-left:6px solid transparent;}*/
  /*#header #navl li:hover,#header #navl li a:hover,#header #navr li a:hover{*/
    /*color: #FF5500;*/
  /*}*/
  /*#navl{ width: 100%;}*/
/*#header #navl li.full-menu-wrap{ position:static;}*/
/*#header #navl li .full-menu{ position: absolute; left: 0; top: 60px; width: 80%; padding: 0 10%; height: auto; border-top: 1px solid #eee; margin: 0; box-shadow: 0px 8px 24px 0px rgba(0,0,0,0.16);}*/
/*#header #navl li .full-menu article{ display: flex;}*/
/*.full-menu-item{ width: 16%; margin: 0 1%; line-height: 1.6em; padding-bottom: 20px;}*/
/*.full-menu-item h1{ color:#FF5500; border-bottom: 1px solid #E0E0E0; font-size: 15px; padding: 15px 0; font-weight: 400;}*/
/*#header #navl li .full-menu-item a{font-size: 13px; color: #3D3D3D; padding-top: 10px; text-align: left;}*/
/*#header #navl li .full-menu-item a:hover{ color:#FF5500;}*/
  
}
@media(min-width:992px){
  .ssl-bg1 div{width:220px;margin:0 auto;}
  .ssl-bg1 li{width:25%;}
  .ssl3-img{ width: 100%}
  .ssl3-title{padding-top: 80px;}
  .content ul li div p{
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
  }
  .content ul{display: flex;}
  .content ul li{width: 23%; padding:0 1%;}
  .menus{ display: flex;}
  #header:hover{
    background-color: #fff;
    animation:fadein .4s;
  }
  /*#header .logo-black{display: none;}*/
  #header:hover .logo{display: none;}
  /*#header:hover .logo-black{display: block;}*/
  @keyframes fadein
  {
    0%   {background:rgba(255, 255, 255, 0);}
    100%  {background:rgba(255, 255, 255, 100);}
  }
  /*#header:hover #navl li,#header:hover #navl li a,#header:hover #navr li,#header:hover #navr li a{color: #232323;}*/
  #header:hover #navr li:last-child a{ color:#fff;}
  /*#header:hover #navr span{opacity:0.7;box-shadow:0 0 0 1px inset #000;padding:7.5px 36px 7.5px 16px;border-radius:20px;position:relative;}*/
  /*#header:hover #navr span:after{position:absolute;top:16px;right:16px;content:'';width:0px;height:0px;border-top:7px solid #000;border-right:6px solid transparent;border-left:6px solid transparent;}*/
  /*#header #navl li:hover,#header #navl li a:hover,#header #navr li a:hover{*/
    /*color: #FF5500;*/
  /*}*/
  /*#navl{ width: 100%;}*/
/*#header #navl li.full-menu-wrap{ position:static;}*/
/*#header #navl li .full-menu{ position: absolute; left: 0; top: 60px; width: 80%; padding: 0 10%; height: auto; border-top: 1px solid #eee; margin: 0; box-shadow: 0px 8px 24px 0px rgba(0,0,0,0.16);}*/
/*#header #navl li .full-menu article{ display: flex;}*/
/*.full-menu-item{ width: 16%; margin: 0 1%; line-height: 1.6em; padding-bottom: 20px;}*/
/*.full-menu-item h1{ color:#FF5500; border-bottom: 1px solid #E0E0E0; font-size: 15px; padding: 15px 0; font-weight: 400;}*/
/*#header #navl li .full-menu-item a{font-size: 13px; color: #3D3D3D; padding-top: 10px; text-align: left;}*/
/*#header #navl li .full-menu-item a:hover{ color:#FF5500;}*/
  
}
@media(min-width:1200px){
  .ssl-bg1 div{width:240px;}
  .ssl3-img{ max-width: 1088px;}
  .ssl3-text{ max-width: 920px; }
  .ssl3-title{padding-top: 80px;}
  .content ul{display: flex;}
  .content ul li{width: 23%; padding:0 1%;}
  .menus{ display: flex;}
  #header:hover{
    background-color: #fff;
    animation:fadein .4s;
  }
  /*#header .logo-black{display: none;}*/
  #header:hover .logo{display: none;}
  /*#header:hover .logo-black{display: block;}*/
  @keyframes fadein
  {
    0%   {background:rgba(255, 255, 255, 0);}
    100%  {background:rgba(255, 255, 255, 100);}
  }
  /*#header:hover #navl li,#header:hover #navl li a,#header:hover #navr li,#header:hover #navr li a{color: #232323;}*/
  /*#header:hover #navr li:last-child a{ color:#fff;}*/
  /*#header:hover #navr span{opacity:0.7;box-shadow:0 0 0 1px inset #000;padding:7.5px 36px 7.5px 16px;border-radius:20px;position:relative;}*/
  /*#header:hover #navr span:after{position:absolute;top:16px;right:16px;content:'';width:0px;height:0px;border-top:7px solid #000;border-right:6px solid transparent;border-left:6px solid transparent;}*/
  /*#header #navl li:hover,#header #navl li a:hover,#header #navr li a:hover{*/
    /*color: #FF5500;*/
  /*}*/
  /**/
/*#navl{ width: 100%;}*/
/*#header #navl li.full-menu-wrap{ position:static;}*/
/*#header #navl li .full-menu{ position: absolute; left: 0; top: 60px; width: 80%; padding: 0 10%; height: auto; border-top: 1px solid #eee; margin: 0; box-shadow: 0px 8px 24px 0px rgba(0,0,0,0.16);}*/
/*#header #navl li .full-menu article{ display: flex;}*/
/*.full-menu-item{ width: 16%; margin: 0 1%; line-height: 1.6em; padding-bottom: 20px;}*/
/*.full-menu-item h1{ color:#FF5500; border-bottom: 1px solid #E0E0E0; font-size: 15px; padding: 15px 0; font-weight: 400;}*/
/*#header #navl li .full-menu-item a{font-size: 13px; color: #3D3D3D; padding-top: 10px; text-align: left;}*/
/*#header #navl li .full-menu-item a:hover{ color:#FF5500;}*/
}