@charset "utf-8";
@charset "utf-8";
html {
  color: #222;
  background: #fff;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-rendering: optimizelegibility;
  overflow-x: hidden;
}
html *, html *:before, html *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  outline: none;
}

body, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, select, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, menu, nav, section {
  margin: 0;
  padding: 0;
}

article, aside, details, figcaption, figure, footer, header, menu, nav, section {
  display: block;
}

audio, canvas, video {
  display: inline-block;
}

body, button, input, select, textarea {
  font: normal 1em/1.8 '微软雅黑',Roboto,PingFang SC, Lantinghei SC, Microsoft Yahei, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans-serif;
  -webkit-appearance: none;
  border-radius: 0;
}


button::-moz-focus-inner,
input::-moz-focus-inner {
  padding: 0;
  border: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

fieldset, img {
  border: 0;
}

blockquote {
  position: relative;
  color: #999;
  font-weight: normal;
  border-left: 1px solid #333;
  padding-left: 1em;
  margin: 1em 3em 1em 2em;
}

@media only screen and ( max-width: 640px ) {
  blockquote {
    margin: 1em 0;
  }
}

acronym, abbr {
  border-bottom: 1px dotted;
  font-variant: normal;
}

abbr {
  cursor: help;
}

del {
  text-decoration: line-through;
}

address, caption, cite, code, dfn, em, th, var {
  font-style: normal;
  font-weight: normal;
}

ul, ol {
  list-style: none;
}

caption, th {
  text-align: left;
}

q:before, q:after {
  content: '';
}

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
}

:root sub, :root sup {
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

a {
  color: #333;
}

a:hover {
  text-decoration: none;
}


ins, a {
  text-decoration: none;
}

u {
  text-decoration: underline;
}

mark {
  background: #fffdd1;
  border-bottom: 1px solid #ffedce;
  padding: 2px;
  margin: 0 5px;
}

pre, code, pre tt {
  font-family: Courier, 'Courier New', monospace;
}

pre {
  background: #f8f8f8;
  border: 1px solid #ddd;
  padding: 1em 1.5em;
  display: block;
  -webkit-overflow-scrolling: touch;
}

hr {
  border: none;
  border-bottom: 1px solid #cfcfcf;
  margin-bottom: 0.8em;
  height: 10px;
}

small,
figcaption {
  font-size: 0.9em;
  color: #888;
}

strong, b {
  font-weight: bold;
  color: #2a2a2a;
}

[draggable] {
  cursor: move;
}

h1, h2, h3, h4, h5, h6 {
  font-family: '微软雅黑','Novecento wide Medium',Roboto,PingFang SC, Lantinghei SC, Microsoft Yahei, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans-serif;
  font-weight: normal;
  color: #222;
  line-height: 1.5;
}
*,
*:before,
*:after{ transition: all .5s cubic-bezier(0.215, 0.610, 0.355, 1.000); }
  .slick-list{ z-index: 1; }
  .slick-track{ transition: all; }
  .slick-arrow{ position: absolute; top: 0; display: flex; justify-content: center; align-items: center; width: 10%; height: 100%; max-width: 48px; text-align: center; cursor: pointer; z-index: 2; }
  .slick-arrow:before{ font-family: 'Font Awesome 5 Pro'; font-weight: 100; font-size: 24px; color: #fff; opacity: .5; }
  .slick-arrow:hover:before{ opacity: 1; }
  .slick-prev{ left: 0; }
  .slick-prev:before{ content: '<'; }
  .slick-next{ right: 0; }
  .slick-next:before{ content:'>'; }
  .slick-dots{ position: absolute; right: 0; bottom: 5px; width: 100%; text-align: center; font-size: 0; z-index: 2; }
  .slick-dots li{ display: inline-block; margin: 0 5px;}
  .slick-dots li b{ display: block; width: 8px; height: 8px; border-radius: 50%; overflow: hidden; text-indent: -9999px; font-weight: normal; background: #fff; opacity: .5; }
  .slick-dots li.slick-active b{ opacity: 1; }
  .index-menu{ position: absolute; top: 0; right: 0; display: flex; flex-flow: column wrap; justify-content: center; align-items: center; width: 50px; height: 50px; }
  .index-menu i{ display: block; width: 40%; height: 2px; margin-left: 10%; border-radius: 1px; background: #d0021b; }
  .index-menu:before{ content: ''; display: block; width: 50%; height: 2px; margin-bottom: 6px; border-radius: 1px; background: #d0021b; }
  .index-menu:after{ content: ''; display: block; width: 50%; height: 2px; margin-top: 6px; border-radius: 1px; background: #d0021b; }
  .index-menu-t i{ width: 0; }
  .index-menu-t:before{ transform: translate3d(0,8px,0) rotate(135deg); }
  .index-menu-t:after{ transform: translate3d(0,-8px,0) rotate(45deg); }
  .index-menu{ display: none; }

  .index-nav-act{ transform: translateX( -50vw ); }

    .index-nav{ position: fixed; top: 0; right: -50vw; width: 50vw; height: 100vh; background: #fff; z-index: 7; display: none; }
    .index-nav-list{ position: relative; width: 100%; height: 100%; overflow: hidden; }
    .index-nav-list>li{ width: 100%; border-bottom: 1px solid #f8f8f8; }
    .index-nav-list>li>a{ position: relative; display: block; padding: 1.25em 0; font-size: 14px; text-align: center; line-height: 1; color: #666; }
    .index-nav-list li.has>a:after{ content: '\f105'; position: absolute; right: 0; padding: 0 1em; font-family: 'Font Awesome 5 Pro'; }
    .index-nav-list ul{ position: absolute; top: 0; right: -50vw; width: 100%; height: 100%; background: #fff; z-index: 2; }
    .index-nav-list ul li{ width: 100%; border-bottom: 1px solid #f8f8f8; }
    .index-nav-list ul li a{ position: relative; display: block; padding: 1em 0; font-size: 14px; text-align: center; line-height: 1; color: #666; }
    .index-nav-list ul li[data-id=''] a{ font-size: 14px; }
    .index-nav-list ul li[data-id=''] a:after{ content: '\f104'; position: absolute; left: 0; padding: 0 1em; font-family: 'Font Awesome 5 Pro'; }
  .index-bottom-bar{ position: fixed; right: 0; bottom: 5vw; left: 0; display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; width: 60vw; height: 40px; margin: auto; border-radius: 20px; background: rgba(198, 47, 38, .7); z-index: 8; display: none; }
  .index-bottom-bar a{ display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; width: 20vw; height: 100%; }
  .index-bottom-bar a:nth-child(2){ border-right: 1px solid rgba(255, 255, 255, .05); border-left: 1px solid rgba(255, 255, 255, .05); }
  .index-bottom-bar a i{ font-size: 16px; line-height: 1; color: #fff; }

.index-header{ position: relative; width: 100%; height: 144px; background: #fff; z-index: 9; }
.index-head{ width: 100%; max-width: 1344px; height: 96px; margin: auto; }
.index-head .logo{ float: left; width: 560px; }
.index-head .logo img{ display: block; width: auto; height: 100%; }
.index-head .search{ float: right; width: 320px; height: 96px; padding: 30px 0; font-size: 0; text-align: left; }
.index-head .search input{ position: relative; height: 36px; font-size: 14px; line-height: 36px; border: none; background: none; }
.index-head .search input::-webkit-input-placeholder{ color: #999; }
.index-head .search input[type='text']{ width: 240px; padding: 0 .75em; background: #f1f1f1;}
.index-head .search input[type='submit']{ width: 80px; color: #fff; text-align: center; background: #d0021b;}
.index-head .telephone{ float: right; width: 300px; height: 96px; padding: 36px 10px; text-align: right;  }
.index-head .telephone .phone{ font-size: 26px; line-height: 1; color: #555;font-weight: bold; }
.index-head .telephone .phone i{ font-size: 16px; }
.index-head .telephone .phone i:after{ content: ''; display: inline-block; width: 1px; height: 1em; margin: 0 .5em; background: rgba(170, 170, 170, .2); }
.index-head .telephone .mail{ font-size: 12px; line-height: 1.3; color: #999; }

.nav{ width: 100%; height: 48px; box-shadow: 0 3px 5px rgba(0, 0, 0, .2); background: #d0021b; }
.nav-list{ width: 100%; max-width: 1344px; height: 48px; margin: auto; }
.nav-list>li{ position: relative; float: left; width: 14.28%; height: 100%; }
.nav-list>li:after{ content: ''; position: absolute; top: 0; right: 0; bottom: 0; display: block; width: 1px; height: 12px; margin: auto; background: rgba(255, 255, 255, .1); }
.nav-list>li:last-child:after{ display: none; }
.nav-list>li>a{ display: block; height: 48px; font-size: 16px; line-height: 48px; color: #fff; text-align: center; }
.nav-list>li.hover>a,
.nav-list>li.on>a{ color: #d0021b; background: #fff; }

.nav-list .nav-sub{ position: absolute; top: 48px; left: 0; width: 100%; text-align: center; }
.nav-list .nav-sub li{ height: 0; overflow: hidden; }
.nav-list .nav-sub li a{ display: block; font-size: 16px; line-height: 48px; color: #fff; background: rgba(198, 47, 38, .8); }
.nav-list .nav-sub li:nth-child(even) a{ background: rgba(198, 47, 38, .6); }
.nav-list .nav-sub li a:hover{ color: #d0021b; background: #fff; }

.nav-list>li.on .nav-sub li{ height: 48px; }

.index-container{ position: relative; width: 100%; height: auto; z-index: 8; }
.index-container.index-nav-act{ box-shadow: 0 0 20px rgba(0, 0, 0, .1); }

.index-slide{ width: 100%; height: 32vw; z-index: 1; }
.index-slide .items{ width: 100%; height: 32vw; background-position: center center; background-repeat: no-repeat; background-size: cover;}
.index-slide .slick-arrow:before{ width: 48px; height: 48px; background: rgba(0, 0, 0, .5);}

.index-number-list{ position: relative; display: flex; flex-flow: row wrap; justify-content: center; align-items: center; width: 100%; max-width: 1344px; height: 144px; margin: -72px auto 0; background: #fff; box-shadow: 0 5px 15px rgba(0, 0, 0, .15); z-index: 2; }
.index-number-list .items{ position: relative; display: flex; flex-flow: column wrap; justify-content: center; align-items: center; width: 25%; height: 100%; }
.index-number-list .items:after{ content: ''; position: absolute; top: 0; right: 0; bottom: 0; display: block; width: 1px; height: 30%; margin: auto; background: rgba(170, 170, 170, .2); }
.index-number-list .items:last-child:after{ display: none; }
.index-number-list .items .num{ position: relative; font-size: 0; line-height: 1; }
.index-number-list .items .num span{ font-size: 48px; color: #222;  }
.index-number-list .items .num i{ position: absolute; top: 0; left: 100%; width: 100%; font-size: 14px; font-style: normal; color: #666; }
.index-number-list .items .tit{ font-size: 16px; line-height: 1.5; color: #999; }

.index-row{ position: relative; padding: 48px 0 48px 0; }
.index-row .row-title{ text-align: center; }
.index-row .row-title .cn{ font-size: 48px; line-height: 1; color: #d0021b; margin-top: -15px; }
.index-row .row-title .en{ font-size: 60px; line-height: 1; font-weight: bolder; text-transform: uppercase; color: #eee; }
.index-row .row-title .ad{ font-size: 14px; line-height: 3; color: #666; }
.index-row .row-title:after{ content: ''; display: block; width: 50px; height: 2px; margin: auto; background: #d0021b; }

.index-product .row-title .cn{ color: #000; font-weight: bold; }

.index-core .row-title .cn{ color: #fff; }
.index-core .row-title .en{ color: #d0021b; }
.index-core .row-title .ad{ color: #eee; }

.index-product{ background: url(../images/product-bg.jpg) center top no-repeat; background-size: cover; }
.index-core{ background: url(../images/core-bg.jpg) center top no-repeat; background-size: cover; }
.index-about{ background: url(../images/about-bg.jpg) center top no-repeat; background-size: cover; }
.index-news{ background: url(../images/news-bg.jpg) center top no-repeat; background-size: cover; }
.index-after{ background: url(../images/after-bg.jpg) center top no-repeat; background-size: cover; }


.index-link{ width: 100%; height: 96px; background: #fafafa; }

.index-contact{ width: 100%; height: 230px; padding: 24px 0; background: #24252a; }

.index-footer{ width: 100%; height: 48px; border-top: 1px solid #000; font-size: 14px; line-height: 48px; text-align: center; color: #666; text-transform: uppercase; background: #1b1b1b; }
.index-footer a{ color: #666; }

/*product*/
.index-product-list{ width: 100%; padding: 46px 0 10px 0; }
.index-product-list li{ width: 35vw; height: calc( 35vw / 16 * 9 );/* transform: scale(.8);*/ }
.index-product-list li a{ display: block; width: 100%; height: 100%; }
.index-product-info{ display: block; width: 100%; max-width: 1152px; height: auto; margin: auto; text-align: center; }
.index-product-info .caption{ }
.index-product-info .caption h1{ font-size: 30px; line-height: 2; color: #d0021b; }
.index-product-info .caption h1 strong{ font-size: 30px; color: #d0021b; }
.index-product-info .caption h5{ font-size: 14px; line-height: 1.5; color: #ccc; text-transform: uppercase;  }
.index-product-info .info{ padding: 14px 0; font-size: 16px; line-height: 1.75; color: #666; text-align: center; }

/*core*/
.index-core-list{ position: relative; width: 100%; max-width: 1344px; padding: 46px 0 48px; margin: auto; }
.index-core-list li{ padding: 0 10px; overflow: hidden; }
.index-core-list li a{ position: relative; display: block; width: 100%; height: 480px; background: #ddd; }
.index-core-list li a .thumb{ position: absolute; top: 0; right: 0; width: 100%; height: 100%; z-index: 1; }
.index-core-list li a .info{ display: flex; flex-flow: column wrap; justify-content:space-between; align-content: space-between; position: absolute; top: 0; right: 0; width: 100%; height: 100%; padding: 36px; background: rgba(0, 0, 0, .5); z-index: 2; }
.index-core-list li a .info .caption h1{ font-size: 24px; line-height: 1.5; color: #fff; }
.index-core-list li a .info .caption h5{ font-size: 14px; line-height: 1.5; font-family: h33; color: #ccc; text-transform: uppercase; }
.index-core-list li a .info i{ display: block; width: 96px; height: 96px; margin: auto; border-radius: 50%; font-size: 64px; text-align: center; line-height: 96px; color: #fff; background: #d0021b; }
.index-core-list li a .info .num{ position: relative; font-size: 60px; line-height: 1; font-family: h53; font-weight: bold; color: #fff; }
.index-core-list li a .info .num:before{ content: ''; position: absolute; top: 0; bottom: 0; left: -36px; display: block; width: 36px; height: 4px; margin: auto; background: #d0021b; }
.index-core-list li a .mask{ position: absolute; right: 0; bottom: -351px; width: 100%; height: 351px; padding: 24px; background: #d0021b; z-index: 3; }
.index-core-list li a .mask h4{ font-size: 16px; line-height: 1.5; color: #fff; }
.index-core-list li a .mask i{ position: absolute; bottom: 24px; right: 0; display: flex; justify-content: center; align-items: center; width: 100%; height: 192px; font-size: 64px; color: #fff; }
.index-core-list li a:hover .mask{ bottom: 0; }

.index-core-list .slick-dots{ bottom: -5px; }
.index-core-list .slick-dots li{ padding: 0; }
.index-core-list .slick-dots li b{ width: 10px; height: 10px; }
.index-core-list .slick-dots li.slick-active b{ width: 30px; border-radius: 5px; }

.index-core-list .slick-arrow{ width: 15vw; max-width: 15vw; }
.index-core-list .slick-arrow:before{ font-size: 64px; }
.index-core-list .slick-arrow:hover:before{ color: #d0021b; opacity: 1; }
.index-core-list .slick-prev{ left: -15vw; }
.index-core-list .slick-next{ right: -15vw; }
.index-core-list .slick-prev:before{ content: '\f053'; }
.index-core-list .slick-next:before{ content: '\f054'; }

/*about*/
.index-about{ position: relative; }
.index-about .row-title{ width: 100%; max-width: 1344px; margin: auto; text-align: left; }
.index-about .row-title:after{ margin: 0; }
.index-about .row-content{ width: 100%; max-width: 1344px; margin: auto; }
.index-about-thumb{ position: absolute; display: flex; justify-content: flex-start; align-items: center; width: 50vw; height: 497px; top: 48px; right: 0; background: url(../images/about-r-bg.jpg) right 0 no-repeat; }
.index-about-thumb .thumb{ width: 35vw; height: calc( 35vw / 16 * 9 ); }
.index-about-info{ width: 100%; padding: 48px 54% 0 0; }
.index-about-info p{ font-size: 16px; line-height: 1.75; color: #222; text-align: justify; }
.index-about-info a{ display: block; width: 144px; height: 48px; margin: 48px 0; font-size: 16px; line-height: 3;  text-align: center; text-transform: uppercase; color: #fff; background: #d0021b; }
.index-about-info a:after{ content: '→'; padding-left: 1em; font-family: 'Font Awesome 5 Pro'; font-weight: 100; }

/*news*/
.index-news-list{ width: 100%; max-width: 1344px; padding-top: 1.5vw; margin: auto; }
.index-news-list li{ width: 100%; padding: 0 3.5%; }
.index-news-list li:after{ content: ''; display: block; clear: both; }
.index-news-list li a{ position: relative; display: block; width: 100%; padding: 10px 0; height: 125px; }
.index-news-list li a:before{ content: ''; position: absolute; top: 35px; right: 0; left: 0; display: block; width: 8px; height: 8px; margin: auto; border-radius: 50%; background: #999; z-index: 1; }
.index-news-list li a:after{ content: ''; position: absolute; top: 46px; right: 0; left: 0; display: block; width: 1px; height: 111px; margin: auto; background: #c9c9c9; z-index: 1; }
.index-news-list li a .attr{ position: relative; float: left; width: 50%; padding: 0 48px; z-index: 3; }
.index-news-list li a .attr .thumb{ float: right; width: 315px; height: 105px; background: #000; }
.index-news-list li a .attr .thumb img{ width: 315px; height: 105px; background: #000; }
.index-news-list li a .attr .date{ float: right; text-align: right; margin:0 30px 0 30px; }
.index-news-list li a .attr .date .day{ font-size: 36px; line-height: 1; font-family:'Font Awesome 5 Pro'; color: #666; }
.index-news-list li a .attr .date .year{ font-size: 14px; line-height: 25px; font-family:'Font Awesome 5 Pro'; color: #999; }
.index-news-list li a .attr .date:after{ content: '→'; display: block; font-family: 'Font Awesome 5 Pro'; font-weight: 100; font-size: 24px; color: #fff; }
.index-news-list li a .info{ position: relative; float: right; width: 50%; padding: 0 48px; z-index: 3; }
.index-news-list li a .info h1{ font-size: 18px; line-height: 2; color: #222; }
.index-news-list li a .info h5{ font-size: 14px; line-height: 25px; color: #999; height: 50px; overflow: hidden; }
.index-news-list li a .mask{ position: absolute; top: 0; right: 0; width: 100%; height: 100%; background: #d0021b; z-index: 2; opacity: 0; }

.index-news-list li:nth-child(even) .attr{ float: right; }
.index-news-list li:nth-child(even) .attr .thumb{ float: left; }
.index-news-list li:nth-child(even) .attr .date{ float: left; text-align: left; }
.index-news-list li:nth-child(even) .info{ float: left; text-align: right; }

.index-news-list li a:hover .mask{ opacity: 1; }
.index-news-list li a:hover .attr .date .day{ color: #fff; }
.index-news-list li a:hover .attr .date .year{ color: #fff; }
.index-news-list li a:hover .attr .thumb{ width: 315px; margin-left: 24px; }
.index-news-list li a:hover .info h1{ color: #fff; }
.index-news-list li a:hover .info h5{ color: #fff; }

.index-news-list li:nth-child(even) a:hover .attr .thumb{ margin-right: 24px; margin-left: 0; }

.index-news .index-more{ display: block; width: 168px; height: 48px; margin: 32px auto 0 auto; font-size: 16px; line-height: 48px;  text-align: center; color: #fff; background: #24252a; }

/*after*/
.index-after-list{ display: flex; flex-flow: row wrap; justify-content: space-around; align-items: center; width: 100%; max-width: 1248px; margin: 28px auto 50px auto; }
.index-after-list li{ padding: 20px; }
.index-after-list li a{ position: relative; display: flex; flex-flow: row wrap; justify-content: center; align-items: center; width: 288px; height: 288px; border-radius: 50%; margin: auto; overflow: hidden; }
.index-after-list li a:before{ content: ''; position: absolute; top: 0; right: 0; display: block; width: 100%; height: 100%; background: rgba(255, 255, 255, .7); opacity: 1; z-index: 1;}

.index-after-list li a .thumb{ position: absolute; top: 0; right: 0; width: 100%; height: 100%; }

.index-after-list li a .info{ position: relative; display: flex; flex-flow: column wrap; justify-content: center; align-items: center; width: 128px; height: 128px; border-radius: 50%; background: rgba(198, 47, 38, .8); z-index: 2; }
.index-after-list li a .info i{ display: block; font-size: 64px; margin-top:18px; color: #fff; }
.index-after-list li a .info h1{ font-size: 24px; line-height: 2; color: #fff; display: none; }
.index-after-list li a .info h5{ font-size: 16px; line-height: 1;  color: #fff; display: none; }

.index-after-list li a:hover{ border: 10px solid #fff; border-radius: 0; box-shadow:  0 5px 15px rgba(0, 0, 0, .15) }
.index-after-list li a:hover:before{ opacity: 0; }
.index-after-list li a:hover .info{ width: 100%; height: 100%; border-radius: 0; }
.index-after-list li a:hover .info h1{ display: block; }
.index-after-list li a:hover .info h5{ display: block; }


/*contact*/
.index-xc-code{ float: left; margin: 40px 0 0 210px;}

.index-contact .content{ width: 100%; max-width: 1344px; margin: auto; overflow: hidden; }
.index-contact .content .index-info{ float: left; }
.index-contact .content .index-er-code{ float: right; }
.index-contact .content .index-map{ float: right; }

.index-info .tit .cn{ font-size: 24px; line-height: 1.5; color: #d0021b; }
.index-info .tit .en{ font-size: 14px; line-height: 1.75; color: #999; font-family: '微软雅黑'; }

.index-contact-list{ padding-top: 10px; }
.index-contact-list dt{ font-size: 18px; line-height: 2; color: #fff; }
.index-contact-list dd{ font-size: 14px; line-height: 25px; color: #999; }

.index-er-code{ height: 100%; padding: 30px 10px 0; text-align: center; }
.index-er-code i{ display: block; width: 96px; height: 96px; margin: auto; }
.index-er-code span{ display: block; padding-top:10px; font-size: 14px; line-height:20px; color: #fff; }

.soc-list{ padding-top: 24px; overflow: hidden;  }
.soc-list a{ float: left; width: 36px; height: 36px; margin-right: 24px; border-radius: 50%; line-height: 36px; text-align: center; background: #333; }
.soc-list a i:before{ font-size: 20px; color: #fff; }

.index-map{ float: right; width: 624px; height: 188px; background: #fff; }

.index-ercode{ position: fixed; top: 0; right: 0; bottom: 0; left: -1000vh; width: 200px; height: 200px; margin: auto; border: 10px solid #fff; border-radius: 8px; box-shadow: 0 0 15px rgba(0, 0, 0, .5); background: #fff; z-index: 999; }
.index-ercode img{ display: block; width: 100%; height: 100%; }

@media screen and (max-width: 1344px) {
  .index-number-list{ width: 80%; height: 128px; margin-top: -64px; }
  .index-about-thumb{ background-position: 10vw 0; background-size: auto 100%; }
  .index-row .row-title .en{ font-size: 50px; }
  .index-row .row-title .cn{ font-size: 36px; }
  .index-after-list li a{ width: 22vw; height: 22vw; }
}

@media screen and (max-width: 1248px) {
  .index-contact{ padding: 24px 10px; }
  .index-er-code{ display: none; }
}

@media screen and (max-width: 1156px) {
  .index-head .search{ display: none; }
  .index-row .row-title .en{ font-size: 40px; }
  .index-row .row-title .cn{ font-size: 24px; }

  .index-number-list{ height: 96px; margin-top: -48px; }
  .index-number-list .items .num span{ font-size: 36px; }
  .index-number-list .items .tit{ font-size: 14px; }
  .index-product-info .info{ padding: 0 8vw; }
  .index-product-info .caption h1{ font-size: 20px; }
  .index-product-info .caption h1 strong{ font-size: 20px; }
  .index-product-info .caption h5{ font-size: 12px; }
  .index-product-info .info{ font-size: 14px; }

  .index-core-list li a{ height: 420px; }
  .index-core-list li a .info{ padding: 24px; }
  .index-core-list li a .info .caption h1{ font-size: 18px; }
  .index-core-list li a .info .caption h5{ font-size: 12px; }
  .index-core-list li a .info .num{ font-size: 40px; }
  .index-core-list li a .info .num:before{ left: -24px; width: 24px; }
  .index-core-list li a .mask{ height: 70%; padding: 12px; }
  .index-core-list li a .mask i{ height: 30%; }
}

@media screen and (max-width: 1024px) {
  .index-core-list li a{ height: 380px; }
  .index-about-thumb .thumb{ width: 45vw; height: calc( 45vw / 16 * 9) }
  .index-after-list li a .info{ width: 50%; height: 50%; }
  .index-after-list li a .info i{ font-size: 48px; }
}

@media screen and (max-width: 960px) {
  .index-header{ position: fixed; top: 0; right: 0; height: 50px; box-shadow: 0 0 5px rgba(0, 0, 0, .1); }
  .index-menu{ display: flex; }
  .index-head{ height: 50px; }
  .index-head .logo{ width: auto; height: 50px; }
  .index-head .telephone{ display: none; }
  .nav{ display: none; }
  .index-nav{ display: block; }
  .index-bottom-bar{ display: flex; }
  .index-container{ padding-top: 50px; }
  .index-slide,
  .index-slide .items{ height: calc( 100vw / 16 * 9 ); }
  .index-number-list{ width: 100vw; height: 72px; margin: 0; box-shadow: none; }
  .index-number-list .items:after{ height: 20%; }
  .index-number-list .items .num span{ font-size: 24px; }
  .index-number-list .items .num i{ font-size: 10px; }
  .index-number-list .items .tit{ font-size: 12px; }

  .index-row{ padding: 24px 0; }
  .index-row .row-title .en{ font-size: 24px; }

  .index-product{ padding-top: 0; }
  .index-product-list{ padding-top: 24px; }
  .index-product-list li{ width: 100vw; height: calc( 100vw / 16 * 9); transform: scale(1);  }
  .index-product-info .info{ padding: 0 2vw; }
  .index-product-info .caption h5{ font-size: 10px; }

  .index-core-list{ padding: 24px 0; }
  .index-core-list li{ padding: 0 2vw; }
  .index-core-list li a .info i{ width: 30vw; height: 30vw; line-height: 30vw; }
  .index-core-list li a .info .caption h1{ font-size: 24px; }
  .index-core-list li a .info .caption h5{ font-size: 16px; }
  .index-core-list li a .info .num{ font-size: 64px; }
  .index-core-list li a .mask i{ height: 40%; }

  .index-about .row-title{ text-align: center; }
  .index-about .row-title:after{ margin: auto; }
  .index-about-thumb{ position: relative; top: 24px; width: 100vw; height: calc( 100vw / 16 * 9 ); background: none; }
  .index-about-thumb .thumb{ width: 100%; height: 100%; }
  .index-about-info{ padding: 36px 2vw; }
  .index-about-info a{ height: auto; margin: 24px auto 0; font-size: 14px; }

  .index-factory{ padding: 0; }
  .index-factory .caption{ text-align: center; }
  .index-factory .caption h2{ font-size: 20px; }
  .index-factory .caption h1{ font-size: 18px; }
  .index-factory-list li{ padding: 24px 2vw 48px; }
  .index-factory-list li a .thumb{ height: calc( 98vw / 16 * 9); }
  .index-factory-list li a .info{ text-align: center; }

  .index-news-list{ padding-top: 24px; }
  .index-news-list li{ padding: 0 2vw 24px; margin-bottom: 24px; border-bottom: 1px solid #eee; }
  .index-news-list li a:before,
  .index-news-list li a:after{ display: none; }
  .index-news-list li a{ height: auto; padding: 0; }
  .index-news-list li a .attr{ float: none; width: 100%; padding: 0; }
  .index-news-list li a .attr .thumb{ float: none; width: 100%; }
  .index-news-list li a .attr .date{ float: none; width: 100%; text-align: left; overflow: hidden; }
  .index-news-list li a .attr .date .day,
  .index-news-list li a .attr .date .year{ float: left; font-size: 14px; padding-top: 5px; line-height: 20px; color: #999; }
  .index-news-list li a .attr .date .year:before{ content: '-'; }
  .index-news-list li a .attr .date:after{ display: none; }
  .index-news-list li a .info{ float: none; width: 100%; padding: 0; }
  .index-news-list li a .info h1{ font-size: 16px; line-height: 30px; text-align: left !important; }
  .index-news-list li a .info h5{ font-size: 13px; line-height: 20px; text-align: left !important;  height: 40px; }
  .index-news-list li a .mask{ display: none; }

  .index-news-list li a:hover .mask{ opacity: 1; }
  .index-news-list li a:hover .attr .date .day{ color: #999; }
  .index-news-list li a:hover .attr .date .year{ color: #999; }
  .index-news-list li a:hover .attr .thumb{ width: 100%; margin: 0; }
  .index-news-list li a:hover .info h1{ color: #222; }
  .index-news-list li a:hover .info h5{ color: #999; }
  .index-news-list li:nth-child(even) a:hover .attr .thumb{ margin-right: 0; margin-left: 0; }

  .index-after-list{  }
  .index-after-list li{ padding: 2vw; }
  .index-after-list li a{ width: 28vw; height: 28vw; border: none; border-radius: 0; }
  .index-after-list li a .info{ width: 100%; height: 100%; border-radius: 0; }
  .index-after-list li a .info i{ font-size: 24px; }
  .index-after-list li a .info h1{ display: block; font-size: 16px; }
  .index-after-list li a .info h5{ display: block; font-size: 12px; }
  .index-after-list li a:hover{ border: none; }

  .index-contact{ height: auto; }
  .index-contact .content{ padding: 0 2vw; }
  .index-contact .content .index-info{ float: none; width: 100%; }
  .index-contact .content .index-map,
  .index-contact .content .index-er-code{ display: none; }

  .index-footer{ height: auto; padding: 2vw 5vw; font-size: 13px; line-height: 1.5; }
}


/*sub*/
.index-banner{ position: relative; display: flex; flex-flow: column wrap; justify-content: center; align-items: center; width: 100vw; height: 450px; background-position: center top; background-repeat: no-repeat; background-size: cover; }
.index-banner h1{ font-size: 24px; color: #fff; }
.index-banner h2{ font-size: 36px; color: #fff; font-family: hn53; text-transform: uppercase; }
.index-banner h5{ font-size: 14px; color: #fff; }
.index-banner:after{ content: ''; position: absolute; right: 0; bottom: 0; left: 0; width: 1px; height: 30%; margin: auto; background: #fff; }
.index-column{ width: 100%; max-width: 1200px; padding: 50px 0; margin: auto; }

.index-classify{ padding-bottom: 50px; font-size: 0; text-align: left; }
.index-classify a{ display: inline-block; padding: .5em 2em; border-radius: 1.5em; margin-right: 1em; font-size: 16px; line-height: 1; color: #222; }
.index-classify a:hover,
.index-classify a.on{ color: #fff; background: #d0021b; }

.index-list-news{}
.index-list-news li{ padding-bottom: 30px; }
.index-list-news li a{ display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center; background: #fafafa; box-shadow: 0 2px 10px rgba(0, 0, 0, .1); }
.index-list-news li a .thumb{ width: 26.5%; border: 15px solid #fafafa; }
.index-list-news li a .thumb i{ display: block; width: 100%; height: 140px; }
.index-list-news li a .info{ width: 53.5%; padding-right: 80px; }
.index-list-news li a .info h1{ font-size: 16px; line-height: 1.25; padding-bottom: 25px; color: #222; }
.index-list-news li a .info h5{ font-size: 14px; line-height: 1.5; color: #999;}
.index-list-news li a .date{ width: 13.5%; color: #aaa;}
.index-list-news li a .date span{ display: block; font-size: 24px; line-height: 1; font-weight: normal; font-style: normal; }
.index-list-news li a .date i{ display: block; font-size: 14px; line-height: 1; font-weight: normal; font-style: normal; }
.index-list-news li a .date b{ position: relative; left: 0; display: block; width: 3.5em; height: 30px; padding: 0 .5em; margin-top: 15px; border: 1px solid #ccc; border-radius: 20px; text-align: right; font-size: 24px; line-height: 30px; color: #ccc; }
.index-list-news li a:hover{ background: #fff; box-shadow: 0 5px 15px rgba(0, 0, 0, .1); }
.index-list-news li a:hover .thumb{ border-color: #d0021b; }
.index-list-news li a:hover b{ border-color: #d0021b; color: #fff; background: #d0021b; left: 1em; }

.index-pages{ position: relative; clear: both; padding-top: 30px; padding-bottom: 5px; overflow: hidden; }
.index-pages a,
.index-pages span{ float: left; display: block; width: 48px; height: 48px; margin-right: 10px; border: 1px solid #ccc; border-radius: 24px; font-size: 18px; line-height: 46px; text-align: center; color: #666; }
.index-pages a:hover{ background: #ccc; }
.index-pages span{ border-color: #d0021b; color: #fff; background: #d0021b; transform: scale(1.1); }
.index-pages a.prev,
.index-pages a.next{ position: absolute; font-family: 'Font Awesome 5 Pro'; width: 90px; margin: auto; font-size: 28px; font-weight: 100; }
.index-pages a.prev{ right: 90px; border-color: #d0021b; border-radius: 24px 0 0 24px; color: #fff; background: #d0021b; }
.index-pages a.next{ right: 0; border-radius: 0 24px 24px 0; }

/*service*/
.index-service-row{ display: flex; flex-flow: column wrap; justify-content: center; align-items: center; width: 100vw; height: 580px; text-align: center; background-position: center center; background-repeat: no-repeat; background-size: cover;}
.index-service-row i{ font-size: 96px; color: #d0021b; }
.index-service-row .cn{ font-size: 24px; font-weight: bold; }
.index-service-row .en{ font-size: 24px; font-family: hn53; text-transform: uppercase; color: #d0021b; }
.index-service-row h1{ font-size: 26px; }
.index-service-row a{ display: block; border-bottom: 5px solid #d0021b; font-size: 20px; font-family: hn53; text-transform: uppercase; }
.index-service-row.ser-1{ background-image: url('../images/ser-1.jpg'); }
.index-service-row.ser-2{ background-image: url('../images/ser-2.jpg'); }
.index-service-row.ser-3{ background-image: url('../images/ser-3.jpg'); }

/*contact*/
.index-contact-row{}
.index-contact-row{}
.index-contact-row .row-content{ width: 100%; max-width: 1200px; margin: auto; }
.list-contact{ display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center;}
.list-contact li{ display: flex; flex-flow: column wrap; justify-content: center; align-items: center; width: 25%; padding: 50px 0; background: #d0021b; }
.list-contact li:nth-child(2n){ background: rgba(198, 47, 38, .8); }
.list-contact li i{ width: 96px; height: 96px; border-radius: 50%; font-size: 42px; text-align: center; line-height: 96px; color: #d0021b; background: #fff; }
.list-contact li b{ font-size: 24px; line-height: 3; color: #fff; }
.list-contact li h1{ height: 60px; font-size: 16px; line-height: 20px; color: #fff; }

.index-contant-map{ width: 100vw; height: 500px; background: #f1f1f1; }

/*about*/
.index-about-row{ width: 100%; padding-top: 50px; margin: auto; overflow: hidden; }
.index-about-row.idea{ background: #fafafa; }
.index-about-row .row-title{ font-size: 0; text-align: center; color: #d0021b; }
.index-about-row .row-title .en{ font-size: 36px; line-height: 1; font-family: hn33; }
.index-about-row .row-title i{ display: inline-block; width: 50px; height: 2px; margin: 15px 0; background: #ddd; }
.index-about-row .row-title .cn{ font-size: 20px; line-height: 1; font-weight: bold; }
.index-about-row .row-content{ position: relative; }
.profile-box{ display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center; width: 100%; max-width: 1200px; padding: 50px 0; margin: auto; margin-bottom: 50px; }
.profile-box:after{ content: ''; position: absolute; top: 0; left: 0; width: 40%; height: 100%; background: #d0021b; z-index: 0; }
.profile-box .thumb{ position: relative; width: calc( 50% - 20px ); height: 326px;box-shadow: 20px 20px 0 #f1f1f1; z-index: 1; }
.profile-box .info{ width: calc( 50% - 20px ); }
.profile-box .info h1{ font-size: 24px; line-height: 1; padding-bottom: .75em; color: #222; }
.profile-box .info h5{ font-size: 14px; line-height: 1; padding-bottom: 1em;  color: #aaa; text-transform: uppercase; }
.profile-box .info p{ font-size: 14px; line-height: 1.75; color: #696969; }

.idea-box{ margin-top: 50px; }
.idea-box a{ position: relative; display: flex; flex-flow: column wrap; justify-content: center; align-items: center; width: 100%; height: 450px; background: url(../images/idea.jpg) center center no-repeat; }
.idea-box h1{ font-size: 48px; line-height: 1.75; font-weight: bold; color: #fff; text-shadow: 2px 2px 5px rgba(0, 0, 0, .2) }
.idea-box h2{ font-size: 16px; line-height: 1.75; font-weight: bold; color: #fff; text-shadow: 2px 2px 5px rgba(0, 0, 0, .2); text-transform: uppercase; }
.idea-box span{ display: block; width: 160px; height: 40px; margin-top: 60px; font-size: 16px; line-height: 40px; text-align: center; text-transform: uppercase; color: #fff; background: #d0021b; }

.appearance-scroll{ width: 100vw; margin-top: 50px; }
.appearance-scroll li{ height: calc( 18.75vw + 20px ); padding-top: 20px; }
.appearance-scroll li a{ position: relative; display: block; width: 100%; height: 100%; bottom: 0; }
.appearance-scroll li a .img{ z-index: 0;}
.appearance-scroll li a .mask{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: flex; flex-flow: column wrap; justify-content: center; align-items: center; width: 50%; height: 30%; margin: auto; background: rgba(198, 47, 38, .8); z-index: 1; opacity: 1; }
.appearance-scroll li a .mask h1{ padding-bottom: 5px;font-size: 28px; line-height: 1; color: #fff; }
.appearance-scroll li a .mask h5{ padding-top: 5px;font-size: 14px; line-height: 1; color: #fff; }
.appearance-scroll li:hover a{ bottom: 15px; box-shadow: 0 2px 8px rgba(0, 0, 0, .2); z-index: 3; }
.appearance-scroll li:hover a .mask{ opacity: 0; }

.index-product-row{ width: 100%; padding: 50px 0; margin: auto; overflow: hidden; }
.index-product-row .row-title{ font-size: 0; text-align: center; color: #d0021b; }
.index-product-row .row-title .en{ font-size: 36px; line-height: 1; font-family: hn33; }
.index-product-row .row-title i{ display: inline-block; width: 50px; height: 2px; margin: 15px 0; background: #ddd; }
.index-product-row .row-title .cn{ font-size: 20px; line-height: 1; font-weight: bold; }
.index-product-row .row-content{ position: relative; }

.index-product-row  .product-category{ width: 100%; max-width: 1200px; padding-bottom: 50px; margin: auto; font-size: 0; text-align: left; }
.index-product-row  .product-category a{ display: inline-block; padding: .5em 1em; border-radius: 1.5em; margin-right: 1em; font-size: 16px; line-height: 1; color: #222; }
.index-product-row  .product-category a:hover,
.index-product-row  .product-category a.on{ color: #fff; background: #d0021b; }


.explan-box{ display: flex; flex-flow: column wrap; justify-content: center; align-items: center; margin-top: 50px; text-align: center; }
.explan-box .thumb{ width: 800px; height: 450px; background: #fff; }
.explan-box .info{ width: 1140px; }
.explan-box .info h1{ font-size: 24px; line-height: 2; color: #d0021b }
.explan-box .info h5{ font-size: 16px; }

.core-list{ width: 100%; max-width: 1200px; margin: auto;  }
.core-list li{ position: relative; margin-top: 50px; overflow: hidden; }
.core-list li .thumb{ width: 100%; height: 500px; background: #fafafa; }
.core-list li .info{ position: absolute; top: 0; bottom: 0; display: flex; flex-flow: column wrap; justify-content: center; width: 50%; height: 70%; padding: 30px; margin: auto; color: #fff; background: rgba(198, 47, 38, .8); }
.core-list li .info i{ font-size: 96px; line-height: 1; }
.core-list li .info h1{ padding: 20px 0; font-size: 24px; line-height: 1; font-weight: bold; color: #fff; }
.core-list li .info h5{ font-size: 16px; line-height: 1.75; color: rgba(255, 255, 255, .9); }
.core-list li:nth-child(2n) .info{ right: 50px; }
.core-list li:nth-child(2n+1) .info{ left: 50px; }

.index-channel-row{ width: 100%; max-width: 1200px; padding: 50px 0; margin: auto; }
.channel-category{ padding-bottom: 50px; font-size: 0; text-align: left; }
.channel-category a{ display: inline-block; padding: .5em 1em; border-radius: 1.5em; margin-right: 1em; font-size: 16px; line-height: 1; color: #222; }
.channel-category a:hover,
.channel-category a.on{ color: #fff; background: #d0021b; }

.channel-content{ font-size: 16px; line-height: 1.75; text-align: justify; }
.channel-content img{ display: inline-block; max-width: 100%; }

.index-article-row{ margin: auto; }
.article-bread{ margin: auto; background: #fafafa; }
.list-bread{ width: 100%; max-width: 1200px; margin: auto; }
.list-bread span,
.list-bread a{ display: inline-block; font-size: 12px; color: #666; line-height: 50px; }
.list-bread a:last-child{ color: #d0021b; }
.list-bread a:last-child:after{ display: none; }
.list-bread a:after{ content:'-'; display: inline-block; padding: 0 .5em; }
.list-bread a:hover{ color: #d0021b; }

.article-title{ width: 100%; max-width: 1200px; border-bottom: 1px solid #eee; margin: auto; }
.article-title h1{ padding: 15px 0; font-size: 18px; line-height: 1.75; }

.article-content{ width: 100%; max-width: 1200px; padding: 15px 0; margin: auto; font-size: 16px; line-height: 2; color: #333; text-align: justify; }
.article-content img{ display: block; max-width: 100%; }

.article-around{ width: 100%; max-width: 1200px; margin: 20px auto 50px; overflow: hidden; }
.article-around a{ float: left; width: 50%; color: #999; font-size: 14px; line-height: 1; padding: 40px 20px; background: #f8f8f8; }
.article-around a:before,
.article-around a:after{ transition: all }
.article-around a.prev{ text-align: left; }
.article-around a.prev:before{ content:'\f104'; font-family: Font Awesome\ 5 Pro; display: inline-block; padding-right: 1em; border-right: 1px solid #eee; margin-right: 1em; }
.article-around a.next{ text-align: right; }
.article-around a.next:after{ content:'\f105'; font-family: Font Awesome\ 5 Pro; display: inline-block; padding-left: 1em; border-left: 1px solid #eee; margin-left: 1em; }
.article-around a:hover{ background: #d0021b; color: #fff; }

.article-around a.prev:hover{ padding-left: 40px; }
.article-around a.next:hover{ padding-right: 40px; }


.index-list-album{ width: 100%; max-width: 1200px; margin: auto; }
.index-list-album:after{ content: ''; display: block; clear: both; }
.index-list-album li{ float: left; width: 400px; margin-bottom: 30px; }
.index-list-album li a{ position: relative; display: block; width: 384px; height: 216px; }
.index-list-album li a .thumb{ width: 100%; height: 100%; }
.index-list-album li a .info{ position: absolute; right: 0; bottom: 0; width:100%; height:40px; padding: 0 10px; background: rgba(0,0,0,.5); }
.index-list-album li a .info h1{ font-size: 16px; line-height:40px; color: #fff; }


.jobs-row{ padding: 10px 0; color: #fff; background: #d0021b; overflow: hidden; }
.jobs-row .column{ float: left; font-size: 16px; font-weight: bold; text-align: center; }
.jobs-row .column-1{ width: 25%; text-align: left; padding-left: 30px; }
.jobs-row .column-2{ width: 15%; }
.jobs-row .column-3{ width: 15%; }
.jobs-row .column-4{ width: 15%; }
.jobs-row .column-5{ width: 15%; }
.jobs-row .column-6{ width: 15%; }
.jobs-row .column i{ padding-right: .25em; font-size: 14px; }


.list-join{ overflow: hidden; }
.list-join li{ background: #f8f8f8; overflow: hidden; margin: 10px 0; }
.list-join li span{ display: block; color: #2a2a2a; overflow: hidden; padding: 10px 0; }
.list-join li span .jobs{ float: left; font-size: 14px; text-align: center; }
.list-join li span .jobs-1{ width: 25%; text-align: left; padding-left: 30px; }
.list-join li span .jobs-2{ width: 15%; }
.list-join li span .jobs-3{ width: 15%; }
.list-join li span .jobs-4{ width: 15%; }
.list-join li span .jobs-5{ width: 15%; }
.list-join li span .jobs-6{ width: 15%; cursor: pointer; }
.list-join li span .jobs i{ color: #999; }
.list-join li .desc{ padding: 30px; background: #fff; border: 1px solid #f8f8f8; overflow: hidden; padding: 0 30px; height: 0; }
.list-join li .desc .info{ float: left; width: 80%; }
.list-join li .desc .info h1{ font-size: 13px; font-weight: bold; line-height: 1; padding-bottom: .5em; color: #2a2a2a }
.list-join li .desc .info p{ font-size: 13px; line-height: 1.5; color: #666; }
.list-join li .desc .link{ float: right; width: 20%; }
.list-join li .desc .link a{ display: block; width: 60%; margin: 10px auto; color: #fff; background: #d0021b; text-align: center; font-size: 14px; line-height: 2; }
.list-join li .desc .link a:first-child{ background: #99d31f; }
.list-join li.on .desc{ padding: 30px; height: auto;}

/*banner*/
.index-banner-about{ background: url('../banner/about.jpg') center center no-repeat; background-size: cover; }
.index-banner-album{ background: url('../banner/album.jpg') center center no-repeat; background-size: cover; }
.index-banner-guide{ background: url('../banner/guide.jpg') center center no-repeat; background-size: cover; }
.index-banner-product{ background: url('../banner/product.jpg') center center no-repeat; background-size: cover; }
.index-banner-service{ background: url('../banner/service.jpg') center center no-repeat; background-size: cover; }
.index-banner-news{ background: url('../banner/news.jpg') center center no-repeat; background-size: cover; }
.index-banner-jobs{ background: url('../banner/jobs.jpg') center center no-repeat; background-size: cover; }
.index-banner-contact{ background: url('../banner/contact.jpg') center center no-repeat; background-size: cover; }

@media screen and (max-width: 1344px) {}
@media screen and (max-width: 1248px) {}
@media screen and (max-width: 1156px) {
  .appearance-scroll li{ height: calc( 50vw / 16 * 9 + 20px); }
  .index-classify{ padding: 0 30px 50px; }
  .index-list-news li{ padding: 30px; padding-top: 0; }
  .index-pages{ padding: 30px; }
  .index-pages a.next{ right: 30px; }
  .index-pages a.prev{ right: 120px; }
  .explan-box .info{ width: 100%; padding: 0 30px; }
  .core-list{ padding: 0 30px; }
  .list-bread,
  .article-title,
  .article-content{ padding: 0 10px; }
}
@media screen and (max-width: 1024px) {
  .index-map{ width: 524px; }
  .idea-box h1{ font-size: 32px; }
  .idea-box h2{ font-size: 14px; }
  .core-list li .info{ height: 60%; }
  .core-list li .info i{ font-size: 64px; }
  .core-list li .info h1{ font-size: 18px; }
  .core-list li .info h5{ font-size: 14px; }
  .index-service-row i{ font-size: 64px; }
  .index-service-row .en{ font-size: 16px; }
  .index-service-row h1{ font-size: 20px; }
  .index-service-row a{ font-size: 16px; }
  .list-contact li{ padding: 30px 0; }
  .list-contact li i{ width: 72px; height: 72px; line-height: 72px; font-size: 36px; }
  .list-contact li b{ font-size: 18px; }
  .list-contact li h1{ font-size: 14px; }
}
@media screen and (max-width: 960px) {
  .index-banner{ height: 56.25vw; }
  .index-banner h2{ font-size: 16px; }
  .index-column{ padding: 30px 0; }
  .index-about-row{ padding-top: 20px; }
  .index-about-row .row-title i{ margin: 10px 0; }
  .index-about-row .row-title .en{ font-size: 16px; }
  .index-channel-row{ padding: 30px 2vw; }
  .channel-category{ padding: 0 2vw 20px; text-align: center; }
  .channel-category a{ font-size: 12px; }

  .profile-box{ padding: 20px 0; margin-bottom: 0; }
  .profile-box:after{ display: none; }
  .profile-box .thumb{ width: 96vw; height: 54vw; margin: auto; box-shadow: none; }
  .profile-box .info{ width: 100%; padding: 20px 2vw 0; }
  .profile-box .info h1{ font-size: 20px; }
  .profile-box .info h5{ font-size: 12px; }
  .idea-box{ margin-top: 20px; }
  .idea-box h1{ padding: 0 5vw; font-size: 24px; text-align: center; }
  .idea-box h2{ padding: 0 5vw; font-size: 10px; font-weight: normal; text-align: center; }
  .appearance-scroll{ margin-top: 20px; }
  .appearance-scroll li{ height: calc( 100vw / 16 * 9 ); padding-top: 0; }
  .appearance-scroll li a .mask h1{ font-size: 20px; }
  .index-service-row{ height: 75vw; }
  .index-service-row i{ font-size: 48px; }
  .index-service-row .cn{ font-size: 18px; }
  .index-service-row .en{ font-size: 14px; }
  .index-service-row h1{ font-size: 12px; }
  .index-service-row a{ font-size: 14px; }
  .index-classify{ padding: 0 2vw 20px; text-align: center; }
  .index-classify a{ font-size: 12px; }

  .index-list-news li{ padding: 0 2vw 20px; }
  .index-list-news li a{ flex-flow: column wrap; }
  .index-list-news li a .thumb{ width: 100%; height: 40vw; border: none; }
  .index-list-news li a .thumb i{ height: 100%; }
  .index-list-news li a .info{ width: 100%; padding: 10px 2vw; }
  .index-list-news li a .info h1{ padding-bottom: 10px; }
  .index-list-news li a .date{ position: relative; width: 100%; padding: 10px 2vw; text-align: left; }
  .index-list-news li a .date span{ font-size: 20px; }
  .index-list-news li a .date b{ position: absolute; top: 0; bottom: 0; left: auto; right: 2vw; margin: auto; }
  .index-pages a,
  .index-pages span{ display: none; }
  .index-pages{ text-align: center; font-size: 0; }
  .index-pages a.prev,
  .index-pages a.next{ position: relative; top: 0; right: 0; bottom: 0; left: 0; float: none; display: inline-block; margin: auto; }

  .index-product-row{ padding: 20px 0; }
  .index-product-row .row-title .en{ font-size: 16px; }
  .index-product-row .row-title i{ margin: 10px 0; }
  .index-product-row .product-category{ padding: 0 2vw 20px; text-align: center; }
  .index-product-row .product-category a{ font-size: 12px; }

  .explan-box{ margin-top: 20px; }
  .explan-box .thumb{ width: 100vw; height: 56.25vw; }
  .explan-box .info{ padding: 0 2vw; }
  .explan-box .info h1{ font-size: 20px; }
  .explan-box .info h5{ font-size: 14px; line-height: 1.75; text-align: justify; }

  .core-list{ padding: 0 2vw; }
  .core-list li{ margin-top: 20px; }
  .core-list li .thumb{ height: 60vw; }
  .core-list li .info{ left: 0!important; right: 0!important; width: 90%; height: 80%; padding: 10px; margin: auto; text-align: center; }
  .core-list li .info i{ font-size: 32px }
  .core-list li .info h1{ font-size: 16px; padding: 5px 0; }
  .core-list li .info h5{ font-size: 12px; line-height: 1.5; }

  .jobs-row .column{ font-size: 12px; font-weight: normal; }
  .jobs-row .column-3,
  .jobs-row .column-5{ display: none; }
  .list-join li span .jobs-3,
  .list-join li span .jobs-5{ display: none; }
  .list-join li span .jobs-1,
  .jobs-row .column-1{ width: 37%; }
  .list-join li span .jobs-2,
  .jobs-row .column-2,
  .list-join li span .jobs-4,
  .jobs-row .column-4,
  .list-join li span .jobs-6,
  .jobs-row .column-6{ width: 21%; }
  .list-join li .desc .info{ width: 100%; }
  .list-join li .desc .link{ width: 100%; }

  .list-contact li{ width: 50%; }
  .list-contact li:nth-child(2),
  .list-contact li:nth-child(3){ background: rgba(198, 47, 38, .8); }
  .list-contact li:nth-child(4){ background: #d0021b; }
  .list-contact li i{ width: 48px; height: 48px; line-height: 48px; font-size: 24px; }
  .list-contact li b{ font-size: 16px; line-height: 2; }
  .list-contact li h1{ font-size: 12px; line-height: 1.25; height: 3.75em; }

  .index-contant-map{ width: 100vw; height: 100vw; }

  .article-around a.prev{ display: none; }
  .article-around a.next{ width: 100%; }
}

/*product*/
.product{ padding:0 0 60px 0;}
.product .product_right { width:1344px; overflow: hidden; }
.product .product_right .right_box .hd { text-align:center; margin:0 auto; width:1056px;}
.product .product_right .right_box .hd  li { float:left;  width: 184px; height: 52px; line-height:52px; text-align: center; background-color: #4d4d4d; margin:0 13px;}
.product .product_right .right_box .hd  li a { color:#fff; font-size:16px; font-weight:bold; }
.product .product_right .right_box .hd  li.on {  background-color: #d0021b; }
.product .product_right .right_box .hd .more { float:left;  width: 184px; height: 52px; line-height:52px; text-align: center; background-color: #4d4d4d;}
.product .product_right .right_box .hd .more a { color:#fff; font-size:16px; font-weight:bold;}
.product .product_right .right_box .hd .more:hover { background-color: #d0021b; }
.product .product_right .right_box .bd li {float:left; width:430px;  margin-top:30px; margin-right:27px; background-color: #e6e6e6}
.product .product_right .right_box .bd li:nth-of-type(3n){ margin-right:0;}
.product .product_right .right_box .bd li img { width:430px; padding: 8px 8px 0;}
.product .product_right .right_box .bd li p{ text-align: center; line-height:40px; height:47px; overflow:hidden;}
.product .product_right .right_box .bd li:hover { background-color: #4d4d4d; }
.product .product_right .right_box .bd li:hover p{ color: #fff;}
.container {width:1344px; margin:0 auto;}
.lf   {float:left;}
.rt  {float:right;}
.clear  {clear:both;}

.cen_fen {margin: 40px 0;width: 235px;}
.cen_c {
	width: 218px;
	height: auto;
	background: #f4f4f4;
	overflow: hidden;
}
.cen_c .h03 a {background: #848484;color: #fff;}
.cen_c .h03 em {color: #b5b5b5;}
.cen_c h2 a {
	display: block;
	font-size: 24px;
	text-align: center;
	background: url(../images/cen_h.gif) repeat-x center top;
	line-height: 68px;
	overflow: hidden;
	color: #fff;
	height: 72px;
	background-color: #cf2929;
}
.cen_c h2 em {
	font-size: 18px;
	padding-left: 5px;
	color: #f07a7f;
	text-transform: uppercase;
}
.cen_c h2.cur a {
	display: block;
	font: 24px "Microsoft Yahei";
	text-align: center;
	background: url(../images/cen_h.gif) repeat-x center top;
	line-height: 68px;
	overflow: hidden;
	color: #fff;
	height: 72px;
}
.cen_c h2.cur em {
	font-size: 18px;
	padding-left: 5px;
	color: #f07a7f;
	text-transform: uppercase;
}
.cen_c h3 {
	height: 52px;
	font: 18px "Microsoft Yahei";
	line-height: 52px;
	overflow: hidden;
	background: #2f61c6;
}

.weiz {
	width: 100%;
	height: 56px;
	border-top: 1px solid #dedede;
	border-bottom: 1px solid #dedede;
	background: #f4f4f4;
	line-height: 56px;
	overflow: hidden;
}
.weiz .content {
	width: 1200px;
	height: 56px;
	background: url(../images/weizhi.png) no-repeat left center;
	padding-left: 35px;
}
.weiz a {color: #666;padding: 0 5px;}
.weiz .c_red a {color: #cf2929;}

.content{
    width: 1200px;
    margin: 0 auto;
}

.cen_c ul {padding: 15px 0;}
.cen_c li {
	width: 175px;
	font-size:14px;
	margin: 0 auto;
	height: 39px;
	line-height: 39px;
	border-bottom: 1px dashed #b9b6b6;
	overflow: hidden;
}
.cen_c li a {
	color: #666;
	display: inline-block;
	background: url(../images/cen_jt4.gif) no-repeat 16px 16px;
	padding-left: 35px;
}
.cen_c li a:hover, .cen_c li.cur a {
	background: url(../images/cen_jt3.gif) no-repeat 16px 16px;
	color: #e62129;
}
.cen_c .nones {border-bottom: 0;}
.cen_fen h5 {
	width: 218px;
	height: 90px;
	background: url(../images/cen_bg.gif) no-repeat center top;
	margin-top: 10px;
	font-size:14px;
	color: #fff;
	padding: 20px 0 0 50px;
}
.cen_fen h5 em {
	display: block;
	font:22px Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #fff;
	width: 164px;
    overflow: hidden;
    white-space: nowrap;
}
.cen_pro {width: 905px;margin: 40px 0;}

.fl {float: left;}
.fr {float: right;}

.clearfix {
    zoom: 1;
}
.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

.tit3 {
	color: #2e2e2e;
	height: 40px;
	font-size: 24px;
	font-weight: bold;
	overflow: hidden;
	margin-bottom: 28px;
}
.tit3 a {color: #2e2e2e;}
.tit3 em {
	font: 18px Arial, Helvetica, sans-serif;
	color: #cfcfcf;
	text-transform: uppercase;
	padding-left: 5px;
}
.cen_pro1 {
	width: 747px;
	height: 350px;
	margin-bottom: 40px;
	overflow: hidden;

	position: relative;
}
.cen_pro1 dl {
	width: 747px;
	height: 350px;
	overflow: hidden;
	position: relative;
}
.cen_pro1 dt {
	width: 747px;
	height: 350px;
	overflow: hidden;
}
.cen_pro1 dt img {
	width: 747px;
	height: 350px;
	display: block;
}
.cen_pro1 dd {
	width: 727px;
	height: 58px;
	font: 18px "Microsoft Yahei";
	font-weight: bold;
	overflow: hidden;
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 5px 0 0 20px;
}
.cen_pro1 dd a {color: #fff;}
.cen_pro1 dd em {
	display: block;
	font-size:14px;
	color: #fff;
}
.cen_pro1 dd span a {
	display: inline-block;
	width: 62px;
	height: 63px;
	background: #e62129;
	font-size:14px;
	text-align: center;
	line-height: 63px;
	overflow: hidden;
	position: absolute;
	top: 0;
	right: 0;
}
.cen_pro1 .h01 {
	width: 33px;
	height: 55px;
	overflow: hidden;
	position: absolute;
	top: 150px;
	left: 30px;
}
.cen_pro1 .h02 {
	width: 33px;
	height: 55px;
	overflow: hidden;
	position: absolute;
	top: 150px;
	right: 30px;
}
.tit4 {background: url(../images/cen_line2.gif) no-repeat left bottom;}
.cen_pro li:nth-of-type(2n) { margin-right:0;}
.cen_pro li {
	width:424px;
	border: 1px solid #e3e3e3;
	background: #f7f7f7;
	border-bottom: 5px solid #e1e1e1;
	float: left;
	margin-right:53px;
	margin-bottom: 17px;
}
.cen_pro li em {
	display: block;
	font-size:14px;
	text-align: center;
	height: 40px;
	line-height: 30px;
	overflow: hidden;
	color: #323232;
}
.cen_pro .nones {margin-right: 0;}
/******new-LB***********/
.newslist {
	width:905px;
	margin: 40px 0;
}
.news_con {
	width:905px;
	overflow: hidden;
	float: right;
}
.newslist dl {
	margin-top: 18px;
	border: 1px solid #ddd;
	overflow: hidden;
}
.newslist dd {width: 745px;float: left;}
.newslist dd h3 {
	width:745px;
	height:36px;
	overflow: hidden;
	text-overflow: ellipsis;
    white-space: nowrap;
	font-size: 16px;
	line-height: 36px;
}
.newslist dd h3 a{float:left;width:460px;overflow: hidden;text-overflow: ellipsis;}
.newslist dd h3 span{float:right;width:93px;font:14px "微软雅黑";color:#d5d5d5;margin-top:15px;}
.newslist dd p {
	line-height: 20px;
	height: 40px;
    overflow: hidden;
	font-size:14px;
	margin-top: 5px;
}
.newslist .dl01 {
	height:144px;
	padding: 18px 18px 0 18px;
	background: #f4f4f4;
}
.newslist .dl01 dt {
	float: left;
    width: 234px;
    height: 126px;
    overflow: hidden;
    margin-right: 28px;
	background:url(../images/news.jpg) no-repeat center;
}
.newslist .dl01 dd {width: 605px;}
.newslist .dl01 dd h3 {
	height: 43px;
	width: 605px;
	line-height: 43px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.newslist .dl01 dd p {
	font-size:14px;
	color: #6e6e6e;
	line-height: 24px;
	margin-top: 12px;
	height: 72px;
	overflow: hidden;
}
.newsdetail {width: 915px;margin: 40px 0;}
.newsdetail h2 {
	height: 70px;
	font-size: 28px;
	text-align: center;
	color: #454545;
	line-height: 70px;
	overflow: hidden;
	background: #f4f4f4;
}
.newsdetail h3 {
	background: #f4f4f4;
	font: 14px "微软雅黑";
	color: #8d8d8d;
	text-align: center;
	height: 24px;
	border-bottom: 1px dotted #9b9b9b;
}
.newsdetail h3 a {
	display: inline-block;
	background: url(../Images/icon1.gif) no-repeat 10px center;
	padding: 0 5px 0 25px;
}
.newsdetail h3 a.a02 {background: url(../Images/icon2.gif) no-repeat 10px center;}
.newsdetail h3 a.a03 {
	background: none;
	width: 79px;
	height: 38px;
	position: absolute;
	top: 20px;
	right: 20px;
}
.detail {
	background: #f4f4f4;
	padding: 15px 30px;
	line-height: 24px;
}
.detail img {
	display: block;
	margin: 0 auto;
	padding: 20px 0;
}
.detail h4 {
	width: 684px;
	height: 313px;
	margin-bottom: 30px;
}
.detail h4 img {width: 684px;height: 313px;}
.detail .hh1 {width: 682px;height: 221px;}
.detail .hh1 img {width: 682px;height: 221px;}
.detail h5 {
	border-top: 1px dashed #cacaca;
	border-bottom: 1px dashed #cacaca;
	font-size: 14px;
	line-height: 38px;
	color: #797979;
}
.detail h5 a {
	color: #797979;
	display: inline-block;
	padding: 0 12px;
}
.detail .h04 {
	border: 0;
	padding: 15px;
	overflow: hidden;
}
.detail .h04 .fl {
	width: 390px;
	height: 38px;
}
.detail .h04 .fr {
	width: 390px;
	height: 38px;
}
.detail .h04 span a {
	white-space: nowrap;
	width: 262px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.detail .h04 em {
	color: #e62129;
	float: left;
}

#pagelist{ line-height:22px;color:#666; padding:15px;}
#pagelist a{ width:28px; text-align:center; float:left; border:1px solid #bfbfc7;background:#fff; height:28px; font-size:12px;color:#666; line-height:28px; margin-left:5px;border-radius:3px;}
#pagelist a.next,#pagelist a.prev{width:70px;}
#pagelist a.curr{ background:#bfbfc7;border:1px solid #bfbfc7;color:#fff;}
#pagelist a:hover{background:#bfbfc7;border:1px solid #bfbfc7;color:#fff; text-decoration:none}
#pagelist a img{ display:block;margin:0 auto;margin-top:12px;}
#pagelist span{line-height:28px; font-size:13px; height:28px; margin-left:10px;}
#pagelist span#totalpage{ margin:0;}