@charset "UTF-8";
/*! normalize-scss | MIT/GPLv2 License | bit.ly/normalize-scss */
/* Document
       ========================================================================== */
/**
     * 1. Correct the line height in all browsers.
     * 2. Prevent adjustments of font size after orientation changes in
     *    IE on Windows Phone and in iOS.
     */
html {
  line-height: 1.15;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

/* Sections
       ========================================================================== */
/**
     * Remove the margin in all browsers (opinionated).
     */
body {
  margin: 0;font-family: "Roboto" !important;
    font-weight: 400;
    font-style: normal;    font-size: 15px;}

/**
     * Add the correct display in IE 9-.
     */
article,
aside,
footer,
header,
nav,
section {
  display: block; }

/**
     * Correct the font size and margin on `h1` elements within `section` and
     * `article` contexts in Chrome, Firefox, and Safari.
     */
h1 {
  font-size: 2em;
  margin: 0.67em 0; }

/* Grouping content
       ========================================================================== */
/**
     * Add the correct display in IE 9-.
     */
figcaption,
figure {
  display: block; }

/**
     * Add the correct margin in IE 8.
     */
figure {
  margin: 1em 40px; }

/**
     * 1. Add the correct box sizing in Firefox.
     * 2. Show the overflow in Edge and IE.
     */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */ }

/**
     * Add the correct display in IE.
     */
main {
  display: block; }

/**
     * 1. Correct the inheritance and scaling of font size in all browsers.
     * 2. Correct the odd `em` font sizing in all browsers.
     */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/* Links
       ========================================================================== */
/**
     * 1. Remove the gray background on active links in IE 10.
     * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
     */
a {
  background-color: transparent;
  /* 1 */
  -webkit-text-decoration-skip: objects;
  /* 2 */ }

/* Text-level semantics
       ========================================================================== */
/**
     * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
     * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
     */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  text-decoration: underline dotted;
  /* 2 */ }

/**
     * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
     */
b,
strong {
  font-weight: inherit; }

/**
     * Add the correct font weight in Chrome, Edge, and Safari.
     */
b,
strong {
  font-weight: bolder; }

/**
     * 1. Correct the inheritance and scaling of font size in all browsers.
     * 2. Correct the odd `em` font sizing in all browsers.
     */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/**
     * Add the correct font style in Android 4.3-.
     */
dfn {
  font-style: italic; }

/**
     * Add the correct background and color in IE 9-.
     */
mark {
  background-color: #ff0;
  color: #000; }

/**
     * Add the correct font size in all browsers.
     */
small {
  font-size: 80%; }

/**
     * Prevent `sub` and `sup` elements from affecting the line height in
     * all browsers.
     */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

/* Embedded content
       ========================================================================== */
/**
     * Add the correct display in IE 9-.
     */
audio,
video {
  display: inline-block; }

/**
     * Add the correct display in iOS 4-7.
     */
audio:not([controls]) {
  display: none;
  height: 0; }

/**
     * Remove the border on images inside links in IE 10-.
     */
img {
  border-style: none; }

/**
     * Hide the overflow in IE.
     */
svg:not(:root) {
  overflow: hidden; }

/* Forms
       ========================================================================== */
/**
     * 1. Change the font styles in all browsers (opinionated).
     * 2. Remove the margin in Firefox and Safari.
     */
button,
input,
optgroup,
select,
textarea {
  font-family: sans-serif;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */ }

/**
     * Show the overflow in IE.
     */
button {
  overflow: visible; }

/**
     * Remove the inheritance of text transform in Edge, Firefox, and IE.
     * 1. Remove the inheritance of text transform in Firefox.
     */
button,
select {
  /* 1 */
  text-transform: none; }

/**
     * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
     *    controls in Android 4.
     * 2. Correct the inability to style clickable types in iOS and Safari.
     */
button,
html [type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
  /* 2 */ }

button,
[type="button"],
[type="reset"],
[type="submit"] {
  /**
       * Remove the inner border and padding in Firefox.
       */
  /**
       * Restore the focus styles unset by the previous rule.
       */ }
  button::-moz-focus-inner,
  [type="button"]::-moz-focus-inner,
  [type="reset"]::-moz-focus-inner,
  [type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0; }
  button:-moz-focusring,
  [type="button"]:-moz-focusring,
  [type="reset"]:-moz-focusring,
  [type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText; }

/**
     * Show the overflow in Edge.
     */
input {
  overflow: visible; }

/**
     * 1. Add the correct box sizing in IE 10-.
     * 2. Remove the padding in IE 10-.
     */
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
     * Correct the cursor style of increment and decrement buttons in Chrome.
     */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

/**
     * 1. Correct the odd appearance in Chrome and Safari.
     * 2. Correct the outline style in Safari.
     */
[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
  /**
       * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
       */ }
  [type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration {
    -webkit-appearance: none; }

/**
     * 1. Correct the inability to style clickable types in iOS and Safari.
     * 2. Change font properties to `inherit` in Safari.
     */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */ }

/**
     * Correct the padding in Firefox.
     */
fieldset {
  padding: 0.35em 0.75em 0.625em; }

/**
     * 1. Correct the text wrapping in Edge and IE.
     * 2. Correct the color inheritance from `fieldset` elements in IE.
     * 3. Remove the padding so developers are not caught out when they zero out
     *    `fieldset` elements in all browsers.
     */
legend {
  box-sizing: border-box;
  /* 1 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  color: inherit;
  /* 2 */
  white-space: normal;
  /* 1 */ }

/**
     * 1. Add the correct display in IE 9-.
     * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
     */
progress {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */ }

/**
     * Remove the default vertical scrollbar in IE.
     */
textarea {
  overflow: auto; }

/* Interactive
       ========================================================================== */
/*
     * Add the correct display in Edge, IE, and Firefox.
     */
details {
  display: block; }

/*
     * Add the correct display in all browsers.
     */
summary {
  display: list-item; }

/*
     * Add the correct display in IE 9-.
     */
menu {
  display: block; }

/* Scripting
       ========================================================================== */
/**
     * Add the correct display in IE 9-.
     */
canvas {
  display: inline-block; }
body,html{ color: #000000;font-family: "Roboto Condensed" !important;
    font-weight: 400; padding: 0px; margin:0px;
    font-style: normal; }
a{ color: #000; text-decoration: none;   }
li{ list-style: none; float: left; }
/**
     * Add the correct display in IE.
     */
template {
  display: none; }
.top{ width: 100%;z-index: 10000; position: relative; background-color: #fff; height: 73px; padding-top: 50px; }
.header{  transition: all 1s ease 0s; z-index: 1100; width:90%;  position: relative; margin:auto; height: 70px;}
.header .logo{top:0; position: absolute; }
.header .logo img{ max-width: 100%;}
.header .nav{  width: 35%; float: right;  margin:auto; height: 30px; overflow: hidden; }
.header .nav li{ width: 25%;  height: 30px; overflow: hidden; line-height: 30px;  text-align: left; }
.header .nav li a{position:absolute;}
.header .nav li a:hover{ font-weight: bold; }
.header .nav li a::after{
  content:'';
  display:block; 
  width:100%;
  height:3px;
  position:absolute;
  bottom:-10px;
  background:#000;
  transition:all 0.3s ease-in-out; 
  transform: scale3d(0,1,1); 
  transform-origin:50% 0;
}
.header .hsearch{ width: 30px; cursor: pointer; float: right; font-size: 24px; height: 30px; line-height: 30px; padding-right: 20px; }
.header .nav li a:hover::after{ 
  transform:scale3d(1,1,1); 
} 
.header .htel{ width:20%; overflow: hidden; height: 30px; line-height: 30px; padding-right: 40px; font-size: 18px; text-align: right; float: right; }
.header .icon-gengduo{ display:none; }
.header .hline{width: 97%; height: 15px; position: absolute; top:56px; float: left; }
.header .hline2{ position: absolute; top:16px;  left:96%; width: 3%; height:55px;}
line {   /* stroke-dasharray: 10;*/
    stroke: #000000;
    stroke-width: 1px; 
    shape-rendering: crispEdges;
}
.line2{stroke: #aaa;}
.shadow {
    box-shadow: 0 6px 30px 0 rgba(0, 0, 0, 0.2);
    position: fixed;
    height: 63px; padding-top: 10px;
  }
  .shadow .header{ 
    width: 100%;
    opacity: 1;
    transition: all 1s ease 0s;
  }
.shadow .hline,.shadow .hline2{ display: none; }
 
  @media (max-width :1365px) {
  

    }
  @media (max-width: 1279px) { 
    .bottom .binfo img {margin-right: 50px!important;}
    .header .logo{top:0; width: 35%; position: absolute; }
}
  @media (max-width: 1023px) {
    .header .htel{ display: none; }
    .bottom .binfo {width: 80% !important; ; }
    .bottom .bobinfo li {  width: 20% !important;}
    .bottom .binfo img {  margin-right: 25px!important;}
    .bottom .rbj{ display: none; }
    .header .nav{ width: 360px;}
    .header .logo{ width:250px; }
     .bottom .binfo li{ width: 14%!important;}
     .navnews .nshow2 {
    left: 0px !important;
    z-index: 100;
    opacity: 1 !important;} 
    .msearch input {width: 50%!important;}
.serbut{margin-left: 0% !important;  margin-right:1% !important; }
}
  @media (max-width: 767px) {
      #bannera{display: none !important;}
      #bannerb{display: block !important;}
      .layui-layer{ width: 360px !important; left:0px !important; }
      .msghtml h2,.msghtml h4, .msghtml lable{ padding-left: 10px; padding-right: 10px;  }
      .msghtml{ padding: 20px 0px !important; }
      .msghtml .i1,.msghtml textarea{ width:300px !important;  }
      .msghtml select{ margin-left: 10px !important; }
      .right-colunm{ display: none; }
      .header .nav{ display: none; } 
      .top{ padding-top: 30px;} 
      .header .icon-gengduo{ display:block ; }

      .banner .btext .bccont .btitle{ margin-bottom: 20px !important; }
      .banner .btext{ top:130px !important; width: 80% !important; left: 5% !important; padding: 20px 5% !important; margin:auto 0;}
      .banner .next{ right: 3%; left:auto!important; }
      .banner .hd { bottom: 280px !important;}
      .banner .btext .prev, .banner .btext .next {top: 10%!important;}
      .banner .btext .next {right: -10px !important;} 
      .hprolist{width: 100% !important;  height: auto !important;} 
      .hpro{ width: 100% !important;  height:auto!important;}
      .hotpro .hcont  li{ width: 100% !important; margin: 0 !important; height: auto !important; padding: 0!important; }
      .hotpro{ height: auto !important; width: 100%; }
      .hcont{ width: 100% !important; height:auto !important; }
      .hpt2 { width: 100% !important; border-bottom: solid 1px #000; float: left; height: 15px; margin: 30px 0% !important;}
      .hser {margin: 0 !important; width: 100% !important; }
      .hcont li{ width:90% !important; margin: 10px 5% !important;   padding: 0 !important; }
      .hotpro2 .hcont li .htime,.hotpro2 .hcont li .htitle,.hotpro2 .hcont li .hhcont { width: 90% !important; margin-bottom: 30px; height: auto; padding: 0 5% !important; }
      .bottom .binfo img{ display: none;   float: left; width: 20%  !important;  margin-right:5% !important; }
      .bottom .binfo li { width: 25%!important;}
      .bottom .binfo .bconcat{ width: 100%!important; }
      .bottom .bobinfo li {width: 20% !important;}
      .bottom .rbj{ display: none; }
      .bottom .binfo {width:90% !important; margin: auto; height: 230px;}
      .hotpro2 {  width: 100%!important; padding: 20px 0 !important;  height:auto !important;}
      .hotpro { width: 100% !important; padding: 20px 0 !important;}
      .mnav .prohead { width: 100%!important; padding: 0!important; height: 50px; float: left;  line-height: 50px; background-color: #f1f1f1;} 
      .navnews .nshow2 { left: 10px !important;  opacity: 1 !important; }
      .servicelm1 .lmcont img{ width: 100% !important; }
      .servicelm1 .lmcont .rtext {  width: 100% !important; } 
      .bottom .binfo .heightauto{ height: auto; }
      .bottom .binfo li {  width: 100% !important; height: 40px;  overflow: hidden; color: #fff; line-height: 40px;}
      .bottom .binfo li h3{ border-bottom:solid 1px #fff; height: 39px;}
      .bottom .binfo li h3 span{ display: block; padding: 10px; color: #fff; float: right; }
      .bottom .bobinfo li { padding: 0 6px;}
      .innav{ display: none; }
      .napro .napropic { width: 100%!important;}
      .napro {width: 100%!important; margin: 0px auto!important;padding: 0!important;}
      .napro .naprotxt { width: 90%!important; margin-left: 5%!important;}
      .banner .bd li {  height:500px !important; }
      .provtit {width: 100% !important; padding: 0 !important; }
      .provtit li { width: 33%!important; }
      .hotpro2 .newslist {width: 90% !important;}
      .navlist{overflow-x: scroll!important; overflow-y: hidden; position: relative;  }
      .navlist span{  right: 0px; padding: 0 10px; background-color: #8a8e91; position: fixed; color: #fff; display: block; }
      .navlist li {width:100px!important; display: inline-block;} 
      .navlist2{ width:700px; }
      .hcbut2{ width: 160px!important; }
      .nplist{ width: 100% !important; }
      .nplist li {  height: 300px; padding: 15px 1% !important; width:44%!important; margin:0 2% 30px 2% !important;}
      .serdownload li .hcbut3{ display: none; }
      .top{ top: 0; }
      .newsview { width: 90% !important;  margin: 20px auto;}
      .nacont {width: 90% !important;}
      .navhpt { width: 100% !important; margin:0 0 30px 0!important;}
      .hprolist{ margin-top: 0!important;}
      .bottom .bobinfo {width: 90% !important;}
      .hotpro2 .hcont li .img { height: auto!important;}
      .hotpro2 .hcont li {height:auto !important;}
      .hprolist li .hppic img { height: 110px !important;}
      .hprolist li {height: 260px !important; width: 46% !important;} 
      .naptxt { width: 90%!important; margin: 20px auto 50px auto!important;}
      .provhalf { width: 100%!important;}
      .napro .naprotxt .nptit { 
      font-size: 28px!important; line-height: 30px; height: auto!important;}
      .newsview .nvtitle {
      width: 100%;
      line-height: 30px!important;
      font-size: 22px!important;
      }
      .napro .npiclist li { width: 100%!important;}
      .hcont2 .hd .prev, .hcont2 .hd .next {
      display: block;
      width: 30px!important ;
      height: 70px!important ;
      overflow: hidden;
      cursor: pointer;
      background-color: #fff;
      position: absolute;
      line-height: 70px!important ;
      text-align: center;
      font-size: 30px!important ;}
      .bpbj li img {
      width: 100% !important;
      }
      .bpbj li .txt {
      width: 100%!important; 
      }
      .nplist li .htitle {
      font-family: "Roboto Condensed" !important;
      font-weight: 700;
      font-style: normal;
      font-size: 16px !important;
      line-height: 20px !important;
      height:40px !important;
      overflow: hidden;
      padding: 5px !important;
      width: 100%;
      }

      .hotpro2 .hcont2 li{ margin-left:20px;   width: 320px!important;}
      .pro2list li {  margin: 20px 10%; width: 80%!important; }
      .bottom .binfo li h3 {padding-left: 27px;}
    } 

  @media (max-width: 479px) {
     .header{ width: 100%; }
     .top{ padding-top: 20px; }
    } 
 
      .naptxt img{ max-width: 100%; }
.banner{width:100%; margin:auto; padding: 0px;  position:relative; }  
.banner .bd{ margin:0 auto; position:relative; z-index:0; overflow:hidden;   }  
.banner .bd ul{ width:100% !important;  padding: 0; margin:0; } 
.banner .bd li{ width:100% !important; background-size: 100% 100%;  height:657px; overflow:hidden; text-align:center;  }  
.banner .bd li a{ display:block;  width:100%; }  
.banner .btext .prev,.banner .btext .next{ z-index: 1; font-size: 24px; display:block; 
 position:absolute; color: #fff;   width:60px; height:60px;  cursor:pointer;    } 
.banner .btext .next{ right:0px; top:8%;}
.banner .btext .prev{ left:20px; top:8%;}
.banner .prev:hover,.banner .next:hover{ color: #ff0000 }
.banner .hd{ position:absolute; top: 190px; left: 16%;  }
.banner .hd li{ background-color: #aaa; color: #fff; width: 30px; height: 5px;   margin:3px; }
.banner .hd .on{ background-color: #fff; color: #ff0000; }
.navlist span{ display: none; }
.banner .btext{
    width:23.5%;
      height: 230px; padding:10px 30px;
    position:absolute; top:150px; left: 5%;  
    background: rgba(0, 0, 0, 0.5);
    text-align: left;
    overflow: hidden; color: #fff; 
}
.banner .btext .bccont{ width: 100%; height: 200px; overflow: hidden; }
.banner .btext .bccont .btitle{ width: 100%; text-align: center; line-height: 50px; margin-bottom: 10px; font-weight: bold; font-size: 20px; }
.banner .btext .bccont .bcont{ width: 100%; overflow: hidden; font-size: 16px; line-height: 30px;  }
 
.hpro{ width:80%; height:340px; margin:auto; position: relative;  }
.hprolist{ width: 100%; position: absolute;   height: 300px; margin:-160px auto 20px auto;  }
.hprolist li{ width: 21%;position: relative; cursor: pointer;   height: 300px; margin:0 11px; background-color: #fff; }
.hprolist li .hptext{ width: 80%; overflow: hidden!important; line-height: 25px; font-size: 14px; padding: 0px 10% 10px 10%; height: 140px; overflow: hidden; float: left; }
.hprolist li .hptext h3{ font-size: 20px; margin:10px auto; }
.hprolist li .hppic{ overflow: hidden; width: 100%;  height: 150px; }
.hprolist li .hppic img{ width: 100%; 
  transition: transform 2s cubic-bezier(0.05, 1, 0.8, 1) 1ms; height: 150px; }
.hprolist li .hppic .player{ position: absolute; transition: background-color 2s cubic-bezier(0.05, 1, 0.8, 1) 0ms;  width: 100%; height: 150px; z-index: 10; background-color:  rgba(0, 0, 0, 0);  }
.hprolist li:hover   img{ transition: transform 2s cubic-bezier(0.05, 1, 0.8, 1) 0ms; 
    transform: scale(1.1, 1.1); }
.hprolist li:hover .hppic .player{
     background-color:  rgba(0, 0, 0, 0.65) ; transition: background-color 2s cubic-bezier(0.05, 1, 0.8, 1) 0ms; } 
.hprolist li:hover .rect{  transition:background 2s cubic-bezier(0.05, 1, 0.8, 1) 0ms;    background: linear-gradient(135deg, transparent 10px, #f00 0); }
.rect{ position: absolute; right: 0; bottom: 0; color: #fff; 
  text-align: center; width: 60px;  z-index: 20;
  height: 35px; line-height: 35px; font-size: 26px; cursor: pointer;
   background: linear-gradient(135deg, transparent 10px, rgba(0, 0, 0, 0.5) 0); 
} 
.hotpro{ width: 80%; margin:auto; background-color: #f1f1f1; height: auto; padding: 50px 10%; }
.hotpro .hpt{ width: 100%; border-bottom: solid 1px #000; float: left;height: 15px; }
.hotpro .hpt .hptext{ width: 150px; font-size: 24px; margin:auto; height: 30px; text-align: center; background-color: #f1f1f1; }
.hotpro .hcont{ width:100%; margin-top: 80px;  }
.hotpro .hcont .li1{ width: 65%; height: auto; }
.hotpro .hcont .li2{ width: 40%; height: auto;   }
.hotpro .hcont .li3{ width: 35%; height: auto;  }
.hotpro .hcont .li4{ width: 33.3%; height: auto;  } 

.hotpro .hcont img{ width: 100%; height: 100%; }

.hotpro .hcont li{ cursor: pointer; overflow: hidden; position: relative; }
.hotpro .hcont  li:hover .htext{ color: #fff; }
.hotpro .hcont  li:hover img{ transition: transform 2s cubic-bezier(0.05, 1, 0.8, 1) 0ms; 
    transform: scale(1.1, 1.1); }
.hotpro .hcont  li:hover  .hplayer{
     background-color:  rgba(0, 0, 0, 0.4) ; transition: background-color 3s cubic-bezier(0.05, 1, 0.8, 1) 0ms; } 
 
.hotpro .hcont  li .htext .htcont{  width: 55%; font-size:18px;text-align: left; line-height: 26px;  }
 
.hotpro .hcont  li .hplayer{ position: absolute; transition: background-color 2s cubic-bezier(0.05, 1, 0.8, 1) 0ms;  width: 100%; height: 100%; z-index: 10; background-color:  rgba(0, 0, 0, 0);  }
 
.hotpro .hcont  li .htext{ width: 30px; z-index: 1000; position: absolute; width:60%; color: #000;margin:40px 20% 20px 5%;  }


.hpt2{ width: 80%;  border-bottom: solid 1px #000; float: left;height: 15px;margin:30px 10% 50px; }
.hpt2 .hptext{ width: 150px; font-size: 24px; margin:auto; height: 30px; text-align: center; background-color: #fff; }
.hser{ margin:0 10% 20px 10%; cursor: pointer; overflow: hidden; width: 80%; }
.hser img{ width: 100%; height: 100%; }

.hser:hover img{ transition: transform 2s cubic-bezier(0.05, 1, 0.8, 1) 0ms; 
    transform: scale(1.1, 1.1); }
.hotpro2{ width: 80%; margin:auto; background-color: #f1f1f1;padding: 50px 10%; }
.hotpro2 .hpt{ width: 100%; border-bottom: solid 1px #000; float: left;height: 15px; }
.hotpro2 .hpt .hptext{ width: 150px; font-size: 24px; margin:auto; height: 30px; text-align: center; background-color: #f1f1f1; }
.hotpro2 .hcont{ width:100%; overflow: hidden; height: 360px; margin-top:50px;  }
.hotpro2 .hcont li{ cursor: pointer; position: relative; height: 360px; 
  padding: 0;  background-color: #fff;  margin: 0 0.68182%; width: 279px;}
.hotpro2 .hcont li .img{ width: 100%; padding: 10px 5% 0 5%; height: 150px; overflow: hidden; position: relative; }
.hotpro2 .hcont li img{ width:90%; height: 100%; }
.hotpro2 .hcont li .img .ifdj{
position: absolute; right: 0; bottom: 0; color: #fff;  
  text-align: center; width:60px;  z-index: 20;
  height: 40px; line-height: 40px; font-size:24px; cursor: pointer;
   background: linear-gradient(135deg, transparent 10px, #ccc 0);   }
   .hotpro2 .hcont li:hover .img .ifdj{background: linear-gradient(135deg, transparent 10px, #000 0);  }
.hotpro2 .hcont li .htime{ width: 100%; font-size: 12px; line-height: 30px; }
.hotpro2 .hcont li .htitle{ font-family: "Roboto Condensed" !important;
    font-weight: 700;
    font-style: normal;
    font-size: 18px;
    line-height:50px; 
    position: relative; height: 50px; overflow: hidden; text-align: left; padding-left: 10%; width:90%;    }
.hotpro2 .hcont li .hhcont{ width: 100%; font-size: 15px;line-height: 24px; height: 72px; overflow: hidden; }
.hotpro2 .hcont li .rect2{ position: absolute; right: 0; bottom: 0; color: #fff;  
  text-align: center; width: 60px;  z-index: 20;
  height: 40px; line-height: 40px; font-size:24px; cursor: pointer;
   background: linear-gradient(135deg, transparent 10px, #000 0); 
} 
.hotpro2 .hcont li .class2{ position: absolute; left: 0; bottom: 0; color: #fff;  
  text-align: center; width: 60px;  z-index: 20; background-color: #aaacaf;   
  height: 25px; line-height: 25px; font-size:12px; 
} 

.hotpro2 .hcont li:hover .rect2{ color: #fff;  transition:background 2s cubic-bezier(0.05, 1, 0.8, 1) 0ms;    background: linear-gradient(135deg, transparent 10px, #f00 0); }
 .hotpro2 .hcont li:hover img{ transition: transform 2s cubic-bezier(0.05, 1, 0.8, 1) 0ms; 
    transform: scale(1.1, 1.1); }


.hotpro2 .hcont2{ width:100%; height: 360px; margin-top:50px;  }
.hotpro2 .hcont2 li{ cursor: pointer; position: relative; height: 360px; 
  padding: 0;  background-color: #fff;  margin: 0 0.68182%; width: 279px;}
.hotpro2 .hcont2 li .img{ width: 100%; height: 150px; overflow: hidden; position: relative; }
.hotpro2 .hcont2 li img{ width: 100%; height: 100%; }
.hotpro2 .hcont2 li .img .ifdj{
position: absolute; right: 0; bottom: 0; color: #fff;  
  text-align: center; width:60px;  z-index: 20;
  height: 40px; line-height: 40px; font-size:24px; cursor: pointer;
   background: linear-gradient(135deg, transparent 10px, #ccc 0);   }
.hotpro2 .hcont2 li:hover .img .ifdj{background: linear-gradient(135deg, transparent 10px, #000 0);  }
.hotpro2 .hcont2 li .htime{ width: 100%; font-size: 12px; line-height: 30px; }
.hotpro2 .hcont2 li .htitle{ font-family: "Roboto Condensed" !important;
    font-weight: 700;
    font-style: normal;
    font-size: 18px;
    line-height:50px; 
    position: relative; height: 50px; overflow: hidden; text-align: left; padding-left: 10%; width:90%;    }
.hotpro2 .hcont2 li .hhcont{ width: 90%; padding: 0 5%; font-size: 15px;line-height: 24px; height: 72px; overflow: hidden; }
.hotpro2 .hcont2 li .rect2{ position: absolute; right: 0; bottom: 0; color: #fff;  
  text-align: center; width: 60px;  z-index: 20;
  height: 40px; line-height: 40px; font-size:24px; cursor: pointer;
   background: linear-gradient(135deg, transparent 10px, #000 0); 
} 
.hotpro2 .hcont2 li .class2{ position: absolute; left: 0; bottom: 0; color: #fff;  
  text-align: center; width: 60px;  z-index: 20; background-color: #aaacaf;   
  height: 25px; line-height: 25px; font-size:12px; 
} 

.hotpro2 .hcont2 li:hover .rect2{ color: #fff;  transition:background 2s cubic-bezier(0.05, 1, 0.8, 1) 0ms;    background: linear-gradient(135deg, transparent 10px, #f00 0); }
 .hotpro2 .hcont2 li:hover img{ transition: transform 2s cubic-bezier(0.05, 1, 0.8, 1) 0ms; 
    transform: scale(1.1, 1.1); }


.hcbut2{ margin:10px auto 30px; font-weight: bold; cursor: pointer; position: relative; background-size:200px 39px; width: 200px; height: 39px; color: #fff; text-align: center; background-size: 100% 100%; line-height: 39px; background: url('but.jpg');  }
.hcbut2 img{width: 100%; height: 100%;}
.hcbut2 .blayer{ position: absolute;transition: width 0.5s ease 0s; background-color: rgba(241,241,241,0.6);width: 0; height: 40px; }
.hcbut2:hover .blayer{width: 100%; transition: width 0.5s ease 0s;}

.bottom{ position: relative; width: 100%; background-color: #262727; height: auto; min-height: 460px; margin:auto; }
.bottom .rbj{ position: absolute; width: 150px; bottom: 0; right: 0; }
.bottom .blogo{ padding: 40px 0; width: 80%; margin:auto; }
.bottom .binfo{ width: 70%; margin:auto; padding-top: 50px; height: 190px; 
   ;}

 .bottom .binfo img{float: right; width: 150px; box-shadow:20px 20px 0px 0px #f00;}
  .bottom .binfo li{ width: 25%; text-align: center; color: #fff; line-height: 30px; }
  .bottom .binfo li a{ color: #fff; }
  .bottom .binfo li h3{  margin:0; width: 100%; }
  .bottom .binfo li h3 span{ margin-right: 20px; }
  .bottom .binfo li span{ display: none;}
  .bottom .bobinfo{ line-height: 35px; text-align: center; width: 80%; margin:auto; }
  .bottom .bobinfo li{ width: 10%; }
  .bottom .bobinfo li a{ color: #fff; }
  .bottom .bobinfo{ color: #fff; }

.msearch{ background-color: #f1f1f1; overflow: hidden; transition: all 0.6s ease 0s; opacity: 0; border-bottom:solid 1px #ccc; z-index: 1000; top:-200px;   padding: 20px 2%; width:96%; height: 140px; background-color: #fff; position: absolute;  }

.mnav,.mnavm{ transition: all 0.6s ease 0s; overflow: hidden;   opacity: 0; border-bottom:solid 1px #ccc; z-index: 1200; 
  top:-400px;   padding: 20px 0; width:100%; height: 300px; background-color: #fff; position: absolute; }
.mnavm li {width:80%; margin-left:5%; padding: 0 5%; height: 40px; line-height: 40px;  border-bottom: solid 1px #ccc; }
.mnavm li span{ float: right;  }
.mnavshow{  transition: all 0.6s ease 0s; opacity: 1; top:60px;   }
.ci-nav-flyout-close, .ci-product-viewer-expander {
    transition: opacity 450ms cubic-bezier(0.05, 1, 0.8, 1) 0ms;
    position: absolute;
    bottom: 0;
    width: 100%;
    display: flex; margin-bottom: 1px;
    justify-content: center;
    opacity: 1;
}
.bottom .bobinfo a{
    color: #fff;
}
.mnav .prohead{ width: 80%; padding: 0 10%; height: 50px; float: left; line-height: 50px; background-color: #f1f1f1; }
.mnav .prohead li{ cursor: pointer; margin: 0; padding: 0; width: 100px; text-align: center; }
.mnav .prohead .procur{ background-image: url('procur.jpg'); background-repeat: no-repeat; background-position: 50% bottom; }
.ci-nav-flyout-close, .ci-product-viewer-expander {
    z-index: 2500;
}
.ci-btn-close {
    display: flex;
    align-items: stretch;
}
.ci-btn-close {
    cursor: pointer;
}
.ci-btn-close.ci-btn-close-bottom .ci-btn-close-before {
    overflow: hidden;
    background: linear-gradient(135deg, transparent 20px, #000000 0) bottom left;
}
.ci-btn-close .ci-btn-close-before, .ci-btn-close .ci-btn-close-after {
    width: 36px;
}
.ci-btn-close-content {
    font-family: "Roboto" !important;
    font-weight: 400;
    font-style: normal;
    border-radius: 0;
    height: 34px;
    font-size: 11px;
    line-height: 13px;
    text-transform: uppercase;
    color: #ffffff;
    background-color: #000000;
    margin: 0;
    border: 0;
    padding: 9px 0;
    cursor: pointer;
}
.ci-btn-close.ci-btn-close-bottom .ci-btn-close-after {
    overflow: hidden;
    background: linear-gradient(225deg, transparent 20px, #000000 0) bottom right;
}
.ci-btn-close .ci-btn-close-before, .ci-btn-close .ci-btn-close-after {
    width: 36px;
}

.msearch input{ width: 60%; margin-top: 40px; margin-left: 15%; height: 38px; padding-left:10px; background-color: #fff;  float: left;line-height: 38px; border:solid 1px #ccc;  }
.msearch .but{ width: 100px; cursor: pointer; height: 42px; text-align: center; background-color: #ccc; color: #fff; float: left; margin:40px 0 0 1px; line-height: 42px; }

.innav{ width: 90%; margin:auto;line-height: 50px; font-family: "Roboto Condensed" !important;
    font-weight: 320;
    font-style: normal;
    font-size: 14px; }
.intit{width: 90%; margin:auto; height: 50px; line-height: 50px; font-size: 24px;  }
.navlist{ width: 90%; padding: 0 5%; height: 40px; line-height: 40px; background-color: #8a8e91; margin:0 auto 40px auto; }

.navlist li{ width: 150px; text-align: center;color: #fff; border-left:solid 1px #fff; }
.navlist li a{ color: #fff; }
.navlist .rbor{ border-right: solid 1px #fff; }
.navlist li:hover,.navlist .cur{ background-color: #333; } 

.navpx{ width: 90%; height: 50px; margin:auto; }
.navpx .px1{ float: left; background: linear-gradient(45deg, transparent 10px, #e2e2e2 0); line-height: 40px; width: 150px; text-align: center; height: 40px;}
.navpx .px2{ float: right; background: linear-gradient(45deg, transparent 10px, #e2e2e2 0);line-height: 40px; width: 200px; text-align: center; height: 40px;}

.navhpt{ width: 80%; margin:40px 10% 70px 10%; border-bottom: solid 1px #000; float: left; height: 15px; }
.navhpt .navhptext{ width: 150px; font-size: 24px; margin:auto; height: 30px; text-align: center; background-color: #f1f1f1; }
.clear{ clear:both; }
.nplist{ width: 80%; margin:auto; padding-bottom: 20px; }

.nplist li{ cursor: pointer;overflow: hidden; position: relative; height: 290px; 
  padding: 15px 1.5% 25px 1.5%; width: 19%; background-color: #fff; margin:1.5%; }
.nplist li .img{ width: 100%; height: 120px; overflow: hidden; }
.nplist li img{ width: 100%; }
.nplist li .htime{ width: 100%; font-size: 12px; line-height: 30px; }
.nplist li .htitle{font-family: "Roboto Condensed" !important;
    font-weight: 700;
    font-style: normal;
    font-size: 18px;
    line-height: 28px; height: 56px; overflow: hidden;
    padding: 14px 10px 10px 10px; width: 100% }
.nplist li .hhcont{     font-family: "Roboto" !important;
    font-weight: 400;
    font-style: normal;
    font-size: 15px;
    line-height: 24px;
    height: 48px; overflow: hidden;
    padding: 0 10px; overflow: hidden;}

.nplist li .rect2{ position: absolute; right: 0; bottom: 0; color: #fff;  
  text-align: center; width: 60px;  z-index: 20;
  height: 40px; line-height: 40px; font-size:24px; cursor: pointer;
   background: linear-gradient(135deg, transparent 10px, #000 0); 
} 
.nplist li .class2{ position: absolute; left: 0; overflow: hidden; bottom: 0; color: #fff;  
  text-align: center; width: 60px;  z-index: 20; background-color: #aaacaf;   
  height: 25px; line-height: 25px; font-size:12px; 
} 
.nplist li:hover .rect2{ color: #fff;  transition:background 2s cubic-bezier(0.05, 1, 0.8, 1) 0ms;    background: linear-gradient(135deg, transparent 10px, #f00 0); }
.nplist li:hover img{ transition: transform 2s cubic-bezier(0.05, 1, 0.8, 1) 0ms; 
    transform: scale(1.1, 1.1); }

.navnews{ width: 80%; float: left; margin:20px 10%; }
.navnews li{width:20%; overflow: hidden; position: relative; height: auto; border-bottom: none; margin-right: 25px; }
.navnews li .li{ float: left; cursor: pointer; padding-left: 20px; width: 100%; height: 40px; line-height: 40px; border-bottom: solid 1px #dcdcdc}
.navnews li .licur{background-color: #111; color: #fff; }
.navnews li .li span{ float: right; margin-right: 20px; }
.navnews li .li:hover{ background-color: #111; color: #fff; }
.navnews .nvpic{ width: 200px; overflow: hidden; line-height: 30px; display: none; 
 position: absolute; right: 20px; padding: 20px;
  height: 190px; background-color: #f1f1f1; float: right; }
.navnews .nvpic img{ width:100%; height: 80px; }
.navnews .nvpic  h3{ padding:0; margin:0;} 
.navnews .ncs2{transition: all 0.6s ease 0s;z-index: 10; position: absolute; opacity: 0; left:-100px; }
.navnews .nshow2{ left:140px !important; z-index: 100; opacity: 1 !important; }
.navnews .ncs3{transition: all 0.6s ease 0s; z-index: 10; position: absolute; opacity: 0; left:-100%; }
.navnews .nshow3{ left:33% !important;z-index: 100; opacity: 1 !important; }

.navnews .ncs4{transition: all 0.6s ease 0s;z-index: 10; position: absolute; opacity: 0; left:40% }
.navnews .nshow4{ left:55% !important;z-index: 100; opacity: 1 !important; }
.naprotxt .npcont{ width: 100%; }
.naprotxt .npcont li{ width: 100%;  font-family: "Roboto Condensed" !important;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    line-height: 38px;
    word-wrap: break-word; }
.naprotxt .npcont li span{ float: right; font-weight: bold; }
#cover{ 
    position:fixed;left:0px;top:0px;
    background:rgba(0, 0, 0, 0.8);
    width:100%;  /*宽度设置为100%，这样才能使隐藏背景层覆盖原页面*/
    height:100%; 
    opacity:0.6;  /*非IE浏览器下设置透明度为60%*/
    display:none; 
    z-index: 1100;  
}

.nbanner{ width: 100%; height:auto; margin:auto;  }
.nbanner img{ width: 100%; height: auto; }
.nacont{ width:70%; margin:20px auto 50px auto; line-height:2.5;}
.napro{width: 80%;background: -webkit-linear-gradient(#FFF ,#f1f1f1); margin:20px auto 0px auto; padding:0 10%; }
.napro .napropic{ width: 35%; float: left; }
.napro .napropic img{ width: 100%; height: 100%; }
.napro .naprotxt{ width: 50%; float: left; margin-left: 5%; }
.napro .naprotxt .nptit{ float: left; width: 100%; height: 40px;     font-family: "Roboto Condensed" !important;
    font-weight: 300;
    font-style: normal;
    font-size: 40px;
    line-height: 44px;
    margin: 5px 0 10px 0;
    word-break: break-word;}
.napro .naprotxt .npsubtit{ float: left; width: 100%; line-height: 40px;  height: 40px; font-size: 18px; font-family: "Roboto Condensed" !important;
    font-weight: 300;
    font-style: normal;}
.napro .naprotxt .npline{ font-weight: bold; cursor: pointer; font-size: 18px; line-height: 40px; width: 100%; height: 40px; border-bottom: solid 1px #ccc; float: left; }
.napro .naprotxt .npline span{ float: right; padding-top:5px; }

.napro .npiclist{ width:80%; height: 200px; float: left; margin:20px 10%; }

.napro .npiclist li{ width:20%;}
.napro .npiclist li img{ width: 80%; }
.napro .morepro{ background-repeat:no-repeat;background-position: 50% 0 ; width: 100%; margin:auto; text-align: center;  height: 40px; background-image:url('morepro.png'); color: #fff; line-height: 40px; }
.napro .naprotxt .npli{ transition:all 0.3s cubic-bezier(0.4, 0, 1, 1); -webkit-transition:all 0.3s cubic-bezier(0.4, 0, 1, 1);
 width: 100%; height: 0;   visibility:hidden;overflow: hidden;}
.napro .naprotxt .npli li{ width:100%; line-height: 30px; }

.npshow{ visibility:visible !important; border-bottom: solid 1px #ccc; height: auto !important; transition:all 0.3s cubic-bezier(0.4, 0, 1, 1); -webkit-transition:all 0.3s cubic-bezier(0.4, 0, 1, 1);
 }

.naptxt{ width: 60%; margin:20px auto 50px auto; line-height:27px; font-size:17px; color:#000000; font-weight:400;}

.provtit{ width: 80%; height: 50px; margin-top: 2px; padding: 0px 10%; background-color: #f4f4f4; }

.provtit li{ width: 180px; cursor: pointer; text-align: center; line-height: 50px;  }
.provtit li:hover{ background-color: #ccc; }
.provcont{ width: 80%; margin:20px auto 0 auto; }
.provcont .provcli{ padding: 0 5%; margin-bottom: 20px; line-height: 30px; width: 90%; float: left;  }
.provcont .provcli span{ font-weight: bold; }
.provcont .provcli img{width:100%; margin:auto; max-height: 300px;}
 
.hotpro2 .newslist{ width: 80%; margin:80px auto; }
.hotpro2 .newslist li{font-family: "Roboto Condensed" !important;
    font-weight: 400;
    font-style: normal;
    font-size: 15px;
    line-height: 23px;
    word-wrap: break-word; width: 100%;  padding: 10.5px 0; border-bottom: solid 1px #ccc; }
.hotpro2 .newslist .nltit{ font-family: "Roboto Condensed" !important;
    font-weight: 700;
    font-style: normal;
    font-size: 24px;
    line-height: 28px;
    color: #000000;
    margin-top: 0;}

.hotpro2 .newslist .nltit2{font-family: "Roboto Condensed" !important;
    font-weight: 300;
    font-style: normal;
    font-size: 26px;
    padding-bottom: 15px; margin-top: 40px;
    border-bottom: 2px solid #555A5F;  }
.hotpro2 .newslist li span{ float: right; }

.provhalf{ width: 50%; float: left; }
.servicelm1{ width: 100%;  background:linear-gradient(to bottom,#fff, #f1f1f1); height:auto; margin:auto; }
.servicelm1 .lmcont{ width: 80%; margin:auto; }
.servicelm1 .lmcont img{ width:40%; float: left; margin:20px 2%; float: left; }
.servicelm1 .lmcont .rtext{width: 55%; float: left;}
.servicelm1 .lmcont .rtext h3{ width: 80%; font-size:24px;  }
.servicelm1 .lmcont .rtext .rtext2{ width: 100%; font-size: 18px; }
.servicelm1 .lmcont .rtext .rtext2 li{ margin:0 5% 0 0; line-height: 40px; cursor: pointer; }
.servicelm1 .lmcont .rtext .rtext2 .rtcur{ border-bottom: solid 3px #000;  }
.rtcont{ width: 100%; line-height: 30px; float: left; margin-top: 20px; }
.sbby{ width: 100%;height: 400px; padding: 40px 0; }
.sbby img { width: 45%; float: right; margin-left: 5%; max-height: 400px; }
.sbby li{ width: 40%; padding-left:5%;  line-height: 50px; }
.serdownload{ width: 80%; margin:0 auto 40px auto; }
.serdownload li{ width: 100%; line-height: 50px; }
.serdownload li .hcbut3{ float: right; margin-bottom: 0px; }
.hcbut3{ margin:10px auto 30px; cursor: pointer; position: relative; background-size:150px 30px; width: 150px; height: 30px; color: #fff; text-align: center; background-size: 100% 100%; line-height: 30px; background: url('bt2.jpg');  }
.hcbut3 img{width: 100%; height: 100%;}
.hcbut3 .blayer{ position: absolute;transition: width 0.5s ease 0s; background-color: rgba(241,241,241,0.6);width: 0; height: 40px; }
.hcbut3:hover .blayer{width: 100%; transition: width 0.5s ease 0s;}
.hotpro2 .hcont li:hover img{ transition: transform 2s cubic-bezier(0.05, 1, 0.8, 1) 0ms; 
    transform: scale(1.1, 1.1); }
.mnavm .submenu{ margin-top: 30px; transition: all 0.6s ease 0s;opacity: 1;  width: 100%; position: absolute; left:0; top: 0; }
.mnavm .submenu .smtitle{ padding: 0 5%; width: 90%; height: 40px; font-weight: bold; line-height: 40px;  background-color: #ccc;float: left; }
.mnavm .gopre{ left: -300px;opacity: 0;  }
.mnavm .gonext{ left: 300px;opacity: 0;  }
.newsview{ width: 60%; margin:20px auto; }
.newsview .nvtime{ width: 100%;line-height: 30px; }
.newsview .nvtitle{ width:100%; line-height: 60px; font-size: 36px;  }
.newsview .nvcont{  margin-bottom: 30px; width:100%; line-height: 30px;  }
.newsview .nvcont .nltit{ width: 100%; font-weight: bold; margin-top: 20px; }
.serbut{margin-left: 30%; margin-right: 10%;}
.rtext{ line-height: 25px; font-size: 14px; }
.rtext .input{ border:solid 1px #ccc; width: 100%; line-height: 21px; margin-top: 6px;   float: left; padding:2px 5px; }
.rtext select{line-height: 25px; height: 25px; }
.rtext .lable{ width: 30%; margin-right: 3%; float: left; margin-bottom: 5px; }
.nacont img{ max-width: 100%; } 
.hprolist{ overflow:hidden; position:relative; height:400px;   }
.hprolist .hd{ overflow:hidden; z-index: 10000; position: absolute; width: 100%;  height:110px; top: 100px; position: absolute;  }
.hprolist .hd .prev,.hprolist .hd .next{   display:block;  width:50px; height:100px;    overflow:hidden; cursor:pointer; background-color: #fff; position: absolute; line-height: 100px; text-align: center; font-size: 36px;}
.hprolist .hd .next{ right: 0; border-radius:50px 0 0  50px;box-shadow: -10px 0px 5px #ccc;  }
.hprolist .hd .prev{ left: 0; border-radius:0 50px 50px 0 ; box-shadow: 10px 0px 5px #ccc;  }
.hprolist .hd .prevStop{ background-position:-60px 0; }
.hprolist .hd .nextStop{ background-position:-60px -50px; }

.hprolist .bd{ padding:10px;   }
.hprolist .bd ul{ overflow:hidden; zoom:1; }
.hprolist .bd ul li{ margin:0 15px; float:left; _display:inline; overflow:hidden; text-align:center;  } 



.hcont2{ overflow:hidden; position:relative; height:400px;   }
.hcont2 .hd{ overflow:hidden; z-index: 10000; position: absolute; width: 100%;  height:110px; top: 100px; position: absolute;  }
.hcont2 .hd .prev,.hcont2 .hd .next{   display:block;  width:50px; height:100px;    overflow:hidden; cursor:pointer; background-color: #fff; position: absolute; line-height: 100px; text-align: center; font-size: 36px;}
.hcont2 .hd .next{ right: 0; border-radius:50px 0 0  50px;box-shadow: -10px 0px 5px #ccc;  }
.hcont2 .hd .prev{ left: 0; border-radius:0 50px 50px 0 ; box-shadow: 10px 0px 5px #ccc;  }
.hcont2 .hd .prevStop{ background-position:-60px 0; }
.hcont2 .hd .nextStop{ background-position:-60px -50px; }

.hprolist .bd{ padding:10px;   }
.hprolist .bd ul{ overflow:hidden; zoom:1; }
.hprolist .bd ul li{ margin:0 15px; float:left; _display:inline; overflow:hidden; text-align:center;  } 





.prolist{ width: 80%; margin:auto; padding-bottom: 20px; }

.prolist li{ cursor: pointer;  height: 300px;   width: 22%; padding-bottom: 10px; background-color: #f1f1f1;overflow: hidden; margin:1.5%; }
.prolist li .img{ width: 100%; position: relative;  overflow: hidden;  }
.prolist li img{ width: 100%; } 
.prolist li .htitle{font-family: "Roboto Condensed" !important;
    font-weight: 700;
    font-style: normal;
    font-size: 24px;
    line-height: 28px;
    padding: 24px 24px 10px 24px;
  overflow: hidden;  }
.prolist li .hhcont{ font-family: "Roboto" !important;
    font-weight: 400;
    font-style: normal;
    font-size: 15px;
    line-height: 24px; overflow: hidden;padding: 0 24px;}

.prolist li .rect2{ position: absolute; right: 0; bottom: 0; color: #fff;  
  text-align: center; width: 60px;  z-index: 20;
  height: 40px; line-height: 40px; font-size:24px; cursor: pointer;
   background: linear-gradient(135deg, transparent 10px, #000 0); 
} 
.prolist li .class2{ position: absolute; left: 0; overflow: hidden; bottom: 0; color: #fff;  
  text-align: center; width: 60px;  z-index: 20; background-color: #aaacaf;   
  height: 25px; line-height: 25px; font-size:12px; 
} 
.prolist li:hover .rect2{ color: #fff;  transition:background 2s cubic-bezier(0.05, 1, 0.8, 1) 0ms;    background: linear-gradient(135deg, transparent 10px, #f00 0); }
.prolist li:hover img{ transition: transform 2s cubic-bezier(0.05, 1, 0.8, 1) 0ms; 
    transform: scale(1.1, 1.1); }
.proptit{ width: 80%; font-size: 32px; margin: auto; line-height: 50px; font-weight: bold; }
.propcont{width: 60%; margin: auto;line-height: 27px; font-size:17px; font-weight:400;}


.pro2list{ width: 90%; margin:auto; padding-bottom: 20px; }
.pro2list li{ cursor: pointer;  height: 360px; position: relative; margin: 20px 10%;   width: 30%; padding-bottom: 10px; background-color: #fff;overflow: hidden; }
.pro2list li .img{ width: 90%; border:solid 1px #ccc; position: absolute; height: 280px;  }
.pro2list li img{ width: 100%; } 
.pro2list li .protxt{
   width: 80%; height:200px;  background-color: #f1f1f1; position: absolute; top:200px; right: 0; 
}
.pro2list li .protxt .htitle{font-family: "Roboto Condensed" !important;
    font-weight: 700;
    font-style: normal;
    font-size: 24px;
    line-height: 28px;
    padding: 24px 24px 10px 24px;
  overflow: hidden;  }
.pro2list li .protxt .htitle span{ float: right; font-size: 28px; }
.pro2list li .hhcont{ font-family: "Roboto" !important;
    font-weight: 400;
    font-style: normal;
    font-size: 15px;
    line-height: 24px; overflow: hidden;padding: 0 24px;}



/*右侧固定*/

.right-colunm {
    width: 50px;
    height:300px;
    margin-right: 5px;
    /*background-color: #444;*/
    position: fixed;
    right: 0;
    top:26%;
    z-index: 9999;
    /*        display: none;*/
}

.right-col-inner {
    width: 100%;
    height: 300px;
    position: relative;
}

.right-col-ul {
    width: 50px;
    height:300px;
    padding: 5px 0 0 5px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10; 
}
.right-col-ul li img{ width: 80%; }

.right-col-li.scrollTop{
    transition: all 1.3s;
    -webkit-transition: all 1.3s;
}
.rli1{ position: absolute; right: 0; color: #fff;  
  text-align: center; width: 60px;  z-index: 20;
  height: 40px; line-height: 40px; font-size:24px; cursor: pointer;
    background-color: rgba(0, 0, 0, 0) !important;
   background: linear-gradient(225deg, transparent 15px, #646464 0);   box-shadow: none !important; 
} 

.rli2{ position: absolute; right: 0; bottom: 0; color: #fff;  
  text-align: center; width: 60px;  z-index: 20;
  height: 40px; line-height: 40px; font-size:24px; cursor: pointer;
    background-color: rgba(0, 0, 0, 0) !important;
   background: linear-gradient(45deg, transparent 15px, #646464 0);  box-shadow: none !important;
    border-bottom: 0px solid #fff  !important;
} 

.right-col-li {
    width: 100%;
    height: 65px;  
    /*margin-bottom: 15px;*/
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    cursor: pointer;
    position: relative;
    padding-top: 15px;
    text-align: center;
    color: #fff;
    font-size: 30px !important;
    background-color: rgba(0, 0, 0, 1);
    /*border-radius: 4px;*/
    border-bottom: 1px solid #fff;
    box-shadow: 0 0 9px 0 rgba(0,0,0,0.1);
    /*margin-top: 15px;*/
    /*background-color: white;*/
}
.right-col-li .bgimg{
  width: 26px;
  height: 26px;
  margin: 0 auto 8px;
}
.background-image1:hover{
    background-color: #646464;
}
.background-image1 .bgimg{
    background: url(../images/kefu_icon.png) 1px 2px no-repeat;
}
.background-image2:hover{
    background-color: #2476f2;
}
.background-image2  .bgimg{
    background: url(../images/kefu_icon.png) 1px -88px no-repeat;
}
.background-image3:hover{
    background-color: #2476f2;
}
.background-image3 .bgimg{
    background: url(../images/kefu_icon.png) 1px -29px no-repeat;
}
.background-image4:hover{
    background-color: #2476f2;
}
.background-image4{
  border-bottom: 0;
}
.background-image4 .bgimg{
    background: url(../images/kefu_icon.png) 1px -58px no-repeat;
}
.background-image5{
    height: 50px;
    padding-top: 4px;
    cursor: pointer;
    border-bottom: 0;
    background: url(../images/gotop.png) no-repeat center;
    background-color: rgba(0, 0, 0, 0.3);
}
.background-image5:hover{
  background-color: rgba(0, 0, 0, 0.65);
}
.right-col-li:hover {
    /*background-color: #333;*/
}


.right-col-li:nth-child(1) {
    border-top: none;
}

.right-col-li>span,
.right-col-li>a {
    /*float: left;
    width: 26px;
    margin: 12px;*/
   color: #fff; font-size: 36px;
}
.xing{
    display: block;
    position: absolute;
    top:10px;
    right:-6px;
    bottom: 0;
    width:30px;
    height:30px;
    z-index: 9999;
    border-radius:1px;
    background-color: #fff;
    transform:rotate(45deg);
}
.xing2{
    display: block;
    position: absolute;
    top:5px;
    right:-6px;
    bottom: 0;
    width:30px;
    height:30px;
    border-radius:1px;
    z-index: -2;
    background-color: #fff;
    transform:rotate(45deg);
}
.xing3{
    display: block;
    position: absolute;
    top:5px;
    right:-6px;
    bottom: 0;
    width:30px;
    height:30px;
    border-radius:1px;
    z-index: -999;
    background-color: #fff;
    transform:rotate(45deg);
}
.right-con-list {
    position: absolute;
    right:72px;
    top:5px;
    width:200px;
    min-height: 210px;
    max-height:300px;
    border-radius: 3px;
    background-color:#fff;
    border: 1px solid #e7eaf2;
    box-shadow: 0 0 9px 0 rgba(0,0,0,0.1);
    color: #fff;
    display: none;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
.telzx-list{
  min-height: 80px;
}
.telzx-list .service_phone{
  color: #2476f2;
  font-size: 15px;
  line-height: 80px;
}
.service_feedback_1{
    position: absolute;
    right: 51px;
    top: 0;
    width:250px;
    border-radius: 3px;
    background-color:#fff;
    border: 1px solid #e7eaf2;
    box-shadow: 0 0 9px 0 rgba(0,0,0,0.1);
    color: #fff;
    display: none;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
.right-col-li:hover.right-col-li .right-con-list {
    display: block;
    animation: mylist .3s;
    -webkit-animation: mylist .3s;
}

@keyframes mylist {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@-webkit-keyframes mylist {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.right-list-li {
    /*padding:5px;*/
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
.right-list-li span{
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 12px;
    color: #9aa8c2;
    margin-left:30px;
    text-align: center;
    align-items: center;
}
.right-list-li .buttont{
    width: 100%;
    display: flex;
    flex-direction: column;

}
.right-list-li .buttont>span{
    width: 160px;
    height:35px;
    line-height:35px;
    border-radius: 18px;
    background: #4f7cfc;
    text-align: center;
    color: #fff;
    margin: 5px 0 10px 20px;
    cursor: pointer;
}
.right-list-li .buttont>span:hover{
    background: #618aff;
}
.right-list-li .buttont .service_phone{
    width: 100%;
    height: 53px;
    line-height: 53px;
    font-size: 14px;
    font-family: "微软雅黑";
    color: #243558;
    text-align: center;
    border-top: 1px solid #e7eaf2;
    /*border-bottom: 1px solid #e7eaf2;*/
    /*box-shadow: 0 0 4px 0 rgba(0,0,0,0.1);*/
}
.right-list-li .buttont .service_test{
    width: 100%;
    height: 53px;
    line-height:53px;
    color: #3b6bf4;
    border-top: 1px solid #eaeef5;
    font-family: "微软雅黑";
    text-align: center;
    /*cursor: pointer;*/
    /*box-shadow: 0 0 4px 0 rgba(0,0,0,0.1);*/
}
.right-list-li .buttont .service_test>span{
    height: 53px;
    font-size: 14px;
    color: #3b6bf4;
    margin-left:10px;
}
.right-list-li span>img{
    margin: 0 5px 0 0;
}
.right-list-li:hover {
    /*background-color: rgba(0, 0, 0, .61);*/
}

.right-list-li div {
    float: left;
    margin: 0 6px 0 0;
    /*width: 20px;*/
}
 .suggres{
    float: left;
    margin-right: 60px;
    text-align: center;
    align-items: center;
    width: 250px;
}

.right-list-li a {
    display: block;
    width: 100%;
    /*color: #fff;*/
}

.right-list-li a:hover {
    /*color: #fff;*/
}

.bpbj{ width: 80%; margin: auto; }
.bpbj li{ width: 100%; margin-bottom:60px;  }
.bpbj li .txt{ width: 50%; float: left; } 
.bpbj li .r{ margin-left:5%; float: right; }
.bpbj li .l{ margin-right:5%; float: left; }
.bpbj li img{ width: 45%; }

.msghtml{ padding: 20px 50px; width: 400px; float: left; }
.msghtml input{ background-color: #f4f4f4;border-width: 0px; border-bottom: solid 1px #c5c5c5; height: 40px; line-height: 40px; padding: 0 10px; margin: 5px 10px; float: left;   }
.msghtml textarea{ background-color: #f4f4f4;border-width: 0px; border-bottom: solid 1px #c5c5c5; height: 100px; line-height: 30px;width: 410px; padding: 0 5px; margin: 10px; float: left;   }
.msghtml .i1{ width: 410px; }
.msghtml .i2{ width: 180px; }
.msghtml select{background-color: #f4f4f4;border-width: 0px; border-bottom: solid 1px #c5c5c5; height: 42px; line-height: 40px; float: left; margin:10px 5px; padding: 0 10px; width:135px !important;}
.msghtml h4{ font-weight: normal; }
.msghtml label input{height:auto; margin: 0 5px;}
.msghtml label{ float: left; width: 100%; margin: 5px 0; }
.msghtml .msbut{ width: 100px; text-align: center; color: #fff; line-height: 40px; height: 40px; background-color: #000; margin-bottom: 20px; float: left; margin-left: 140px; cursor: pointer; } 

#bannerb{display: none;}
.footzi{ width: 80%; margin: auto; text-align: left;}
.footzi a{ margin-right: 20px; }

.layui-layer-content{ overflow-x: hidden !important;}
.layui-layer-close ,.layui-layer-close2{    right: -8px !important; top: -8px !important;; }