@charset "UTF-8";
@font-face {
  font-family: 'thyFont1';
  src: url("../fonts/simpds.ttf");
}
@font-face {
  font-family: 'thyFont2';
  src: url("../fonts/bebas.ttf");
}
@font-face {
  font-family: 'thyFont3';
  src: url("../fonts/questrial-regular.ttf");
}
@font-face {
  font-family: 'Cabin-Regular';
  font-style: normal;
  font-stretch: normal;
  font-display: swap;
  src: url('../fonts/cabin-regular.ttf') format('truetype');
}
body {
  font-family: 'Cabin-Regular', Arial, Candal, sans-serif !important;
}
main {
  width: 94%;
  max-width: 1600px;
  margin: 0 auto;
  display: block;
  *zoom: 1;
}
main:before, main:after {
  content: " ";
  display: table;
}
main:after {
  clear: both;
}
html {
  background: #fff;
  overflow-x: hidden;
  width: 100%;
}
/*样式重置*/
html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}
body {
  margin: 0;
}
h1 {
  font-size: 2em;
  margin: .67em 0;
}
hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}
pre {
  font-family: monospace, monospace;
  font-size: 1em;
}
a {
  background-color: transparent;
}
abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted;
}
b, strong {
  font-weight: bolder;
}
code, kbd, samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
small {
  font-size: 80%;
}
sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -.25em;
}
sup {
  top: -.5em;
}
img {
  border-style: none;
}
button, input, optgroup, select, textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}
button, input {
  overflow: visible;
}
button, select {
  text-transform: none;
}
[type=button], [type=reset], [type=submit], button {
  -webkit-appearance: button;
}
[type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner {
  border-style: none;
  padding: 0;
}
[type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring, button:-moz-focusring {
  outline: 1px dotted ButtonText;
}
fieldset {
  padding: .35em .75em .625em;
}
legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
}
progress {
  vertical-align: baseline;
}
textarea {
  overflow: auto;
}
[type=checkbox], [type=radio] {
  box-sizing: border-box;
  padding: 0;
}
[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {
  height: auto;
}
[type=search] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}
::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}
details {
  display: block;
}
summary {
  display: list-item;
}
template {
  display: none;
}
[hidden] {
  display: none;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, audio, canvas, details, figcaption, figure, footer, header, hgroup, mark, menu, meter, nav, output, progress, section, summary, time, video {
  margin: 0;
  padding: 0;
}
fieldset, img {
  border: 0;
}
address, caption, cite, code, dfn, em, th, var, optgroup {
  font-style: normal;
  font-weight: normal;
}
ins {
  text-decoration: none;
}
li {
  list-style: none;
}
table {
  font-size: inherit;
  font: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
caption, th {
  text-align: left;
}
h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
}
q:before, q:after {
  content: '';
}
abbr, acronym {
  border: 0;
  font-variant: normal;
}
legend {
  color: #000;
}
input, button, textarea, select, optgroup, option {
  font-family: inherit;
  font-size: inherit;
  font-style: inherit;
  font-weight: inherit;
}
input, button, textarea, select {
  border: 0;
  padding: 0;
  margin: 0;
  *font-size: 100%;
  line-height: 1.2;
}
a img, img {
  -ms-interpolation-mode: bicubic;
}
sub, sup {
  vertical-align: baseline;
}
article, aside, dialog, figure, footer, header, hgroup, nav, section, blockquote {
  display: block;
}
pre {
  white-space: pre-wrap;
}
textarea {
  resize: none;
  overflow: auto;
}
input[type=text]:focus, input[type=password]:focus, textarea:focus {
  outline: 0;
}
button, input {
  outline: 0;
}
input[type=password]::-ms-reveal {
  display: none;
}
input::-ms-clear {
  display: none;
}
input:-ms-input-placeholder {
  color: #999;
}
/*样式重置*/
a:hover {
  color: #ffab00;
}
a:active {
  color: #ffab00;
}
/*滚动条*/ ::-webkit-scrollbar {
  width: 9px;
  background-color: #fff;
}
::-webkit-scrollbar-thumb {
  border: solid 2px #fff;
  width: 5px;
  border-radius: 4px;
  background-color: #373c41;
}
::-webkit-scrollbar-corner {
  background-color: #fff;
}
::-webkit-scrollbar:horizontal {
  height: 9px;
}
::-webkit-selection {
  background: #dcdddc;
  color: #000;
}
/*头部*/
#needHeaderBac {
  background: white;
}
#needHeaderBac .header_logo .logo1 {
  display: inline-block;
}
#needHeaderBac .header_logo .logo2 {
  display: none;
}
#needHeaderBac .header_mail a {
  color: #ffab00;
}
#needHeaderBac #tNav .tNav .navName {
  color: #333;
}
.pc_header {
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 999;
  height: 100px;
  background: rgba(255, 255, 255, 1);
  border-bottom: 2px solid rgba(0, 105, 133, 1);
  transition: all .5s ease; /* Firefox 4*/ /* Safari 和 Chrome*/ /* Opera*/ /*box-sizing: border-box;box-shadow: 0 3px 4px rgb(0 105 133 / 100%);*/
}
.pc_header .box {
  max-width: 90%;
  display: flex;
  align-items: center;
  margin: auto;
}
.pc_header .header_logo {
  width: 18%;
  height: 100%;
  z-index: 20;
  display: flex;
  align-items: center;
  overflow: visible;
}
.pc_header .header_logo a {
  display: block;
}
.pc_header .header_logo .logo1 {
  display: none;
  max-width: 100%;
}
.pc_header .header_logo .logo2 {
  display: inline-block;
  max-width: 100%;
}
.search {
  width: 2%;
  height: 70px; /*position: absolute;right: 15px;bottom: 0;*/ 
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.search_icon {
  display: block;
  width: 100%;
  height: 100%;
  background: url(../images/pc_sear.png) right center no-repeat;
  overflow: hidden;
  cursor: pointer
}
.search_box {
  width: 18%;
  /*height: 60px;*/
  padding: 15px 20px;
  overflow: hidden;
  position: absolute;
  /*right: 0;*/
  background: #e5e5e5;
  top: 80px;
  display: none;
}
.search_box form {
  /*width: 100%;*/
  height: 30px;
  overflow: hidden;
  background: #fff;
  position: relative;
  padding-right: 60px;
}
.search_input {
  width: 100%;
  padding: 0 10px;
  border: none;
  background: none;
  outline: none;
  height: 30px;
  line-height: 30px;
}
.search_btn {
  /*width: 60px;*/
  padding: 0 20px;
  height: 30px;
  line-height: 30px;
  /*text-align: center;*/
  position: absolute;
  top: 0;
  right: 0;
  background: #007d93;
  color: #fff;
  outline: none;
  border: none;
  cursor: pointer
}
.search_btn:hover {
  background: #ffab00;
  transition: all .5s ease;
}
@media only screen and (max-width: 1024px) {
.search {
  padding: 0 10px;
  height: 40px;
  width: 22px;
}
.search_box {
  width: 30%;
  top: 70px;
}
}
@media only screen and (max-width: 768px) {
.search_box {
  width: 40%;
}
}
@media only screen and (max-width: 414px) {
.search_box {
  width: 60%;
}
}
/*.pc_header .header_mail{width: 18%;display: flex;justify-content: flex-end;align-items: center;}
.pc_header .header_mail a{margin: 0 5px;height: 36px;font-size: 20px;font-family: arial;color: #fff;width: auto;display: flex;justify-content: center;align-items: center;}
.pc_header .header_mail a i{display: flex;justify-content: center;align-items: center;margin-right: 5px;font-size: inherit;}*/

.pc_header .header_lang {
  /*position: relative; border-left: solid 1px #ccc;border-right: solid 1px #ccc;*/ 
  padding-left: 10px;
  padding-right: 10px;
}
.pc_header .header_lang .lang {
  position: relative;
  font-size: 0.75rem;
  background: url(../images/langu.png) center left no-repeat;
  background-size: 15px;
  padding-left: 22px;
  padding-right: 0px
}
.pc_header .header_lang .lang i {
  margin-left: 10px;
}
.lang .down-arrow:before {
  position: absolute;
  display: block;
  content: "";
  top: 50%;
  right: 0;
  width: 6px;
  height: 6px;
  margin-top: -8px;
  border-top: 2px solid #545859;
  border-right: 2px solid #545859;
  transition: all .2s cubic-bezier(.4, 0, .2, 1) .2s;
  transform: rotate(135deg) translateY(-50%)
}
.lang:hover .down-arrow:before {
  position: absolute;
  display: block;
  content: "";
  top: 50%;
  right: -6px;
  width: 6px;
  height: 6px;
  margin-top: 2px;
  border-top: 2px solid #ffab00;
  border-right: 2px solid #ffab00;
  transition: all .2s cubic-bezier(.4, 0, .2, 1) .2s;
  transform: rotate(-45deg) translateY(-50%)
}
/*.pc_header .header_lang .lang .iconfont2{font-size: 0.875rem;color: #888}*/
.pc_header .header_lang span {
  display: block;
  cursor: pointer;
  color: #666
}
.pc_header .header_lang ul {
  position: absolute;
  z-index: 999;
  top: 22px;
  left: -10px; /*right: 0;*/ width: 130px;
  background: #e5e5e5;
  box-sizing: border-box;
  opacity: 0;
  visibility: hidden;
  transform: translate3d(0, 10px, 0);
  transition: all .5s ease;
}
.pc_header .header_lang ul li a {
  display: block;
  padding: 5px 10px;
  font-size: 0.875rem;
  color: #666
}
.pc_header .header_lang ul li a:hover {
  display: block;
  padding: 5px 10px;
  background: #ffab00;
  color: #fff
}
.pc_header .header_lang .lang:hover ul {
  opacity: 1;
  visibility: visible;
  transform: translate3d(0, 0, 0);
}
.pc_header .header_lang_mobile{display: none}
@media only screen and (max-width: 1024px) {
.pc_header .header_lang_mobile{display: block}
.pc_header .header_lang_mobile {
  /*position: relative; border-left: solid 1px #ccc;border-right: solid 1px #ccc;*/
  height: 40px;
  width: 100px;
  line-height: 40px;
  padding-left: 10px;
  padding-right: 10px;
}
.pc_header .header_lang_mobile .lang {
  position: relative;
  font-size: 0.75rem;
  background: url(../images/langu.png) center left no-repeat;
  background-size: 15px;
  padding-left: 22px;
  padding-right: 0px
}
.pc_header .header_lang_mobile .lang i {
  margin-left: 10px;
}
.pc_header .header_lang_mobile .lang .down-arrow:before {
  position: absolute;
  display: block;
  content: "";
  top: 50%;
  right: 0;
  width: 6px;
  height: 6px;
  margin-top: -8px;
  border-top: 2px solid #545859;
  border-right: 2px solid #545859;
  transition: all .2s cubic-bezier(.4, 0, .2, 1) .2s;
  transform: rotate(135deg) translateY(-50%)
}
.pc_header .header_lang_mobile .lang:hover .down-arrow:before {
  position: absolute;
  display: block;
  content: "";
  top: 50%;
  right: -6px;
  width: 6px;
  height: 6px;
  margin-top: 2px;
  border-top: 2px solid #ffab00;
  border-right: 2px solid #ffab00;
  transition: all .2s cubic-bezier(.4, 0, .2, 1) .2s;
  transform: rotate(-45deg) translateY(-50%)
}
.pc_header .header_lang_mobile span {
  display: block;
  cursor: pointer;
  color: #666
}
.pc_header .header_lang_mobile ul {
  position: absolute;
  top: 50px;
  left: -10px;
  width: 130px;
  margin: 0;
  padding: 0;
  background: #e5e5e5;
  box-sizing: border-box;
  opacity: 0;
  visibility: hidden;
  transform: translate3d(0, 10px, 0);
  transition: all .5s ease;
}
.pc_header .header_lang_mobile ul li a {
  display: block;
  height: 20px;
  line-height: 20px;
  margin: 0;
  padding: 5px 10px;
  font-size: 0.875rem;
  color: #666
}
.pc_header .header_lang_mobile ul li a:hover {
  display: block;
  padding: 5px 10px;
  background: #ffab00;
  color: #fff
}
.pc_header .header_lang_mobile .lang:hover ul {
  opacity: 1;
  visibility: visible;
  transform: translate3d(0, 0, 0);
}
}
@media only screen and (max-width: 1366px) and (min-width: 1025px) {
  .pc_header .box {
    max-width: 96%;
  }
  .pc_header .header_mail a {
    font-size: 18px;
  }
}
@media only screen and (max-width: 1024px) {
  .pc_header {
    width: 100%;
    max-width: 100%;
    height: 70px;
    line-height: 70px;
    background: rgba(255, 255, 255, 1);
    border-bottom: 1px solid rgba(27, 36, 43, 0);
  }
  .pc_header .box {
    max-width: 100%;
    justify-content: space-between;
  }
  .pc_header .header_logo {
    width: 21.34%;
  }
  .pc_header .header_logo img {
    width: 85%;
  }
  .pc_header .header_logo .logo1 {
    display: inline-block;
    transform: scale(.9);
  }
  .pc_header .header_logo .logo2 {
    display: none;
  }
}
@media only screen and (max-width: 768px) {
  .pc_header .header_logo {
    width: 60%;
  }
  .pc_header .header_logo img {
    width: 65%;
  }
}
@media only screen and (max-width: 414px) {
  .pc_header .header_logo {
    width: 55%;
  }
  .pc_header .header_logo img {
    width: 50%;
  }
}
#tNav {
  width: 80%;
  display: flex;
  justify-content: flex-end;
  padding-right: 0;
  box-sizing: border-box;
}
#tNav li.nav_mobile{
display: none;
}
@media only screen and (min-width: 1025px) {
  #tNav .navLi.tplink8 {
    display: none;
  }
  #tNav .tNavBox {
    width: 100%;
    height: auto;
    overflow: visible;
    background: none;
  }
  #tNav .navBtn {
    display: none;
  }
  #tNav .navSliBtn {
    display: none;
  }
  #tNav .iconJt {
    display: none;
  }
  #tNav .navUl {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    padding-right: 2%;
  }
  #tNav .navLi {
    padding: 0;
    min-width: 9%;
    display: inline-block;
    font-size: 1rem;
    margin: 0 1vw;
    position: relative;
  }
  #tNav .navLi:hover .tNavH::before, #tNav .navLi.cur .tNavH::before {
    width: 100%;
    opacity: 1;
  }
  #tNav .tNavH {
    position: relative;
  }
  #tNav .tNavH::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    display: block;
    width: 0;
    height: 3px;
    background-color: #007d93;
    opacity: 0;
    transition: all .5s ease;
  }
  .tNavH .down-arrow:before {
    position: absolute;
    display: block;
    content: "";
    top: 50%;
    right: 0;
    width: 6px;
    height: 6px;
    margin-top: -8px;
    border-top: 2px solid #545859;
    border-right: 2px solid #545859;
    transition: all .2s cubic-bezier(.4, 0, .2, 1) .2s;
    transform: rotate(135deg) translateY(-50%)
  }
  .tNavH:hover .down-arrow:before {
    position: absolute;
    display: block;
    content: "";
    top: 50%;
    right: -6px;
    width: 6px;
    height: 6px;
    margin-top: 2px;
    border-top: 2px solid #ffab00;
    border-right: 2px solid #ffab00;
    transition: all .2s cubic-bezier(.4, 0, .2, 1) .2s;
    transform: rotate(-45deg) translateY(-50%)
  }
  #tNav .tNav {
    width: 100%;
    margin: 0 auto;
    overflow: visible;
  }
  #tNav .tNav .navName {
    position: relative;
    display: block;
    padding: 0;
    line-height: 60px;
    font-size: 1rem;
    color: #333;
    text-align: center;
    transition: all .5s ease;
  }
  #tNav .tNav.active .navName:hover {
    color: #ffab00;
  }
  #tNav .tNav.active .navName {
    color: #333;
    font-family: 'Cabin-Regular', cursive !important;
  }
  #tNav .navName::after {
    content: attr(data-title);
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(100%);
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffab00;
    font-weight: bold;
    display: none;
  }
  #tNav .navLi:hover .navName {
    transform: translateY(0%);
  }
  #tNav .slidBox {
    position: absolute;
    left: 0;
    right: 0;
    width: 200%;
    opacity: 0;
    visibility: hidden;
    z-index: 110;
    margin: 0 auto;
    padding: 0;
    transform: translate3d(0, 20px, 0);
    transition: all .5s ease; /*background: rgb(236 119 41 / 78%);box-shadow: 0 2px 5px rgba(0,0,0,0.075);*/ border-top: none;
  }
  #tNav .navLi:hover .slidBox {
    opacity: 1;
    visibility: visible;
    transform: translate3d(0, 0, 0);
  }
  #tNav .navSbox {
    position: relative;
    float: none;
    width: 100%;
    margin-left: 0%;
    height: auto;
    overflow: hidden;
    font-size: 0;
    white-space: nowrap;
  }
  #tNav .navSli {
    background: #e5e5e5;
    width: 100%;
    padding: 0 10px;
    float: none;
    font-size: 0.875rem;
    color: #666;
    position: relative; /*text-align: center;*/
  }
  #tNav .navSli:hover {
    background: #ffab00;
    color: #fff
  }
  /*#tNav .navSli:before{content: '';position: absolute;bottom: 0;left: 0;width: 100%;height: 1px;background: rgba(255,255,255,.1);transition: all .5s ease;-webkit-transition: all .5s ease;}
#tNav .navSli:hover:before{width: 100%;background: rgba(255,255,255,.4);}*/
  #tNav .navSlink {
    display: block; /*color:#fff;*/ height: 36px;
    line-height: 36px;
  }
  #tNav .oneName {
    font-size: 26px;
    padding-bottom: 15px;
    color: #000;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  #tNav .tNavSummry {
    line-height: 24px;
    width: 100%;
    height: auto;
    overflow: hidden;
    color: #666666;
    font-size: 14px;
    max-width: 420px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
  }
  #tNav .tNavMore {
    display: block;
    position: relative;
    height: auto;
    padding-top: 25px;
    border-top: 1px dashed #cccccc;
    margin-top: 20px;
    cursor: pointer;
  }
  #tNav .txt {
    color: #000;
    transition: all .5s ease;
  }
  #tNav .leanMore {
    margin-left: 2rem;
    transition: all .5s ease;
  }
  #tNav .tNavMore:hover .txt {
    color: #21478b;
    margin-left: 10px;
  }
  #tNav .tNavMore:hover .leanMore {
    color: #21478b;
  }
  #tNav .navSimg {
    position: relative;
    width: 100%;
    height: 160px;
    overflow: hidden;
  }
  #tNav .navImg {
    position: absolute;
    left: 50%;
    transform: translateX(-50%) scale(1);
    width: auto;
    height: 100%;
    transition: all .5s ease;
  }
  #tNav .navSli:hover .navImg {
    transform: translateX(-50%) scale(1.1);
  }
  #tNav .navSli:hover .navSlink {
    color: #fff;
  }
  #tNav .navSli:hover .navSlink::after {
    width: 100%;
    opacity: 1;
  }
}
@media only screen and (max-width: 1366px) and (min-width: 1025px) {
  #tNav .tNav {
    width: 100%;
    margin: 0 auto;
    overflow: visible;
  }
  #tNav .tNav .navName {
    font-size: 16px;
  }
}
@media only screen and (max-width: 1024px) {
  #tNav {
    width: 60%;
    padding: 0;
  }
#tNav li.nav_mobile{
display: block;
}
  #tNav .leftBox, .pc_header .header_mail/*, .header_lang*/ {
    display: none;
  }
  #tNav .navSimg {
    display: none;
  }
  #tNav .tNavBox {
    position: relative;
    height: 70px;
    background: none;
  }
  #tNav .navBtn {
    position: absolute;
    top: 1rem;
    right: 0;
    /*background: #ffab00;*/
    width: 40px;
    height: 40px;
    padding: 10px;
    line-height: 70px;
    box-sizing: border-box;
  }
  #tNav .navLine {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  #tNav .navBtnImg {
    display: block;
    width: 90%;
    height: 70%;
  }
  #tNav .tNav {
    position: fixed;
    top: 70px;
    left: 0;
    right: 0;
    height: 0;
    overflow: hidden;
    z-index: 999;
    background: rgba(37, 49, 58, 1);
    transition: all .5s ease;
  }
  #tNav .tNavHeight {
    height: 100%;
  }
  #tNav .slidBox {
    display: none;
  }
  #tNav .navUl {
    background: rgba(37, 49, 58, 1);
    overflow: hidden;
  }
  #tNav .navLi {
    border-bottom: 1px solid #394b58;
    position: relative;
  }
  #tNav .tNavH {
    position: relative;
    height: 46px;
    line-height: 46px;
    padding: 0 8%;
    font-size: 14px;
    font-weight: normal;
    transition: all .5s ease;
  }
  #tNav .tNavHBac {
    background-color: #ffab00;
  }
  #tNav .navName, #needHeaderBac #tNav .tNav .navName {
    display: block;
    width: 100%;
    height: 100%;
    color: #fff;
  }
  #tNav .iconJt {
    position: absolute;
    top: 0;
    right: 2%;
    display: flex;
    width: 46px;
    height: 46px;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 0.875rem;
    transition: all .5s ease;
  }
  #tNav .iconJtRotate {
    transform: rotate(-180deg);
  }
  #tNav .navSliBtn {
    height: 40px;
    width: 100%;
    text-align: center;
  }
  #tNav .hs {
    height: 100%;
  }
  #tNav .navSbox {
    padding-bottom: 30px;
  }
  #tNav .navSli {
    padding-left: 8%;
    font-size: 0.875rem;
    height: 38px;
    line-height: 38px;
  }
  #tNav .navSlink {
    display: block;
    width: 100%;
    height: 100%;
    color: #fff;
  }
  #tNav .navLi.tplink8 {
    border-bottom: none;
  }
  #tNav .navLi.tplink8 .slidBox {
    display: block !important;
  }
  #tNav .navLi.tplink8 .tNavH {
    display: none;
  }
  #tNav .navLi.tplink8 .navSbox {
    padding-top: 30px;
    display: flex;
    flex-direction: row;
    justify-content: center;
  }
  #tNav .navLi.tplink8 .navSli {
    padding-left: 0;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 4px;
    width: 38px;
    text-align: center;
    margin: 0 2vw;
  }
}
@media only screen and (max-width: 768px) {
  #tNav {
    width: 20%;
  }
  }
  @media only screen and (max-width: 414px) {
  #tNav {
    width: 10%;
  }
  }
.banner {
  margin-top: 100px;
  position: relative;
}
.banner .swiper-slide {
  position: relative;
  pointer-events: auto;
}
.banner .swiper-slide .slide-inner {
  width: 100%;
  height: auto;
}
.banner .swiper-slide .bannerPic {
  display: block;
  width: 100%;
  left: 0px;
  top: 0px;
  height: 100vh;
  max-height: 1080px;
  object-fit: cover;
}
.banner .swiper-slide .bannerPic {
  position: relative;
  width: 100%;
  height: auto;
  transition: all 1s ease 2.5s;
  transform: perspective(1000px) translate3d(0, 0, 100px);
}
.banner .swiper-slide.active .bannerPic {
  transition: all 5s ease 0s;
  transform: perspective(1000px) translate3d(0, 0, 0px);
}
.banner .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background-color: #ffffff;
  margin: 0 14px !important;
  opacity: 0.5;
  color: transparent;
}
.banner .swiper-pagination-bullet-active {
  opacity: 1;
  width: 42px;
  height: 42px;
  line-height: 42px;
  text-align: center;
  border: 2px solid rgba(255, 255, 255, 0.4);
  background-color: transparent;
  color: #ffffff;
}
.banner .swiper-pagination-bullet-active .rightcircle {
  -webkit-animation: circleProgressLoad_right 6.5s linear infinite;
  animation: circleProgressLoad_right 6.5s linear infinite;
}
.banner .swiper-pagination-bullet-active .leftcircle {
  -webkit-animation: circleProgressLoad_left 6.5s linear infinite;
  animation: circleProgressLoad_left 6.5s linear infinite;
}
.banner .swiper-pagination-bullet-active .wrapper_con {
  display: block;
}
.banner .swiper-pagination {
  font-size: 14px;
}
.banner .swiper-pagination > span {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  box-sizing: border-box;
}
.banner .swiper-container-rtl .swiper-button-next {
  left: calc(8.335% - 32px);
}
.banner .swiper-container-rtl .swiper-button-prev {
  right: calc(8.335% - 32px);
}
.banner .swiper-container-horizontal > .swiper-pagination-bullets {
  bottom: 5%;
}
.banner .right {
  right: -2px;
}
.banner .left {
  left: -2px;
}
.banner .circleProgress {
  width: 42px;
  height: 42px;
  border: 2px solid transparent;
  border-radius: 50%;
  position: absolute;
  top: 0px;
  -webkit-transform: rotate(-135deg);
  box-sizing: border-box;
}
.banner .rightcircle {
  border-bottom: 2px solid #ffffff;
  border-left: 2px solid #ffffff;
  right: 0px;
}
.banner .leftcircle {
  border-top: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
  left: 0px;
}
.banner .wrapper_con {
  width: 21px;
  height: 42px;
  position: absolute;
  top: -2px;
  overflow: hidden;
  display: none;
}
.banner_mobile {
  display: none
}
@media only screen and (max-width: 1024px) {
.banner {
  display: none
}
.banner_mobile {
  display: block
}
.banner_mobile {
  margin-top: 70px;
  position: relative;
}
.banner_mobile .swiper-slide {
  position: relative;
  pointer-events: auto;
}
.banner_mobile .swiper-slide .slide-inner {
  width: 100%;
  height: auto;
}
.banner_mobile .swiper-slide .bannerPic {
  display: block;
  width: 100%;
  left: 0px;
  top: 0px;
  height: 100vh;
  max-height: 1080px;
  object-fit: cover;
}
.banner_mobile .swiper-slide .bannerPic {
  position: relative;
  width: 100%;
  height: auto;
  transition: all 1s ease 2.5s;
  transform: perspective(1000px) translate3d(0, 0, 100px);
}
.banner_mobile .swiper-slide.active .bannerPic {
  transition: all 5s ease 0s;
  transform: perspective(1000px) translate3d(0, 0, 0px);
}
.banner_mobile .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background-color: #ffffff;
  margin: 0 14px !important;
  opacity: 0.5;
  color: transparent;
}
.banner_mobile .swiper-pagination-bullet-active {
  opacity: 1;
  width: 42px;
  height: 42px;
  line-height: 42px;
  text-align: center;
  border: 2px solid rgba(255, 255, 255, 0.4);
  background-color: transparent;
  color: #ffffff;
}
.banner_mobile .swiper-pagination-bullet-active .rightcircle {
  -webkit-animation: circleProgressLoad_right 6.5s linear infinite;
  animation: circleProgressLoad_right 6.5s linear infinite;
}
.banner_mobile .swiper-pagination-bullet-active .leftcircle {
  -webkit-animation: circleProgressLoad_left 6.5s linear infinite;
  animation: circleProgressLoad_left 6.5s linear infinite;
}
.banner_mobile .swiper-pagination-bullet-active .wrapper_con {
  display: block;
}
.banner_mobile .swiper-pagination {
  font-size: 14px;
}
.banner_mobile .swiper-pagination > span {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  box-sizing: border-box;
}
.banner_mobile .swiper-container-rtl .swiper-button-next {
  left: calc(8.335% - 32px);
}
.banner_mobile .swiper-container-rtl .swiper-button-prev {
  right: calc(8.335% - 32px);
}
.banner_mobile .swiper-container-horizontal > .swiper-pagination-bullets {
  bottom: 5%;
}
.banner_mobile .right {
  right: -2px;
}
.banner_mobile .left {
  left: -2px;
}
.banner_mobile .circleProgress {
  width: 42px;
  height: 42px;
  border: 2px solid transparent;
  border-radius: 50%;
  position: absolute;
  top: 0px;
  -webkit-transform: rotate(-135deg);
  box-sizing: border-box;
}
.banner_mobile .rightcircle {
  border-bottom: 2px solid #ffffff;
  border-left: 2px solid #ffffff;
  right: 0px;
}
.banner_mobile .leftcircle {
  border-top: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
  left: 0px;
}
.banner_mobile .wrapper_con {
  width: 21px;
  height: 42px;
  position: absolute;
  top: -2px;
  overflow: hidden;
  display: none;
}
}
@media only screen and (max-width: 768px) {
  .banner_mobile .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    margin: 0 6px !important;
  }
  .banner_mobile .rightcircle {
    display: none;
  }
  .banner_mobile .swiper-pagination-bullet-active .wrapper_con {
    display: none;
  }
  .banner_mobile .f-14 {
    display: none;
  }
}
@keyframes circleProgressLoad_right {
  0% {
    transform: rotate(45deg);
  }
  50%, 100% {
    transform: rotate(225deg);
  }
}
@keyframes circleProgressLoad_left {
  0%, 50% {
    transform: rotate(45deg);
  }
  100% {
    transform: rotate(225deg);
  }
}
.in_tit h3 {
  color: #111;
  font-size: 2.75rem;
  font-weight: bold;
  line-height: 1.2;
}
.in_tit span {
  display: block;
  max-width: 84px;
  height: 3px;
  margin: 9px 0;
  background: #007d93;
}
.in_tit p {
  color: #666;
  font-size: 16px;
  line-height: 1.6;
  padding-top: 10px;
  padding-bottom: 30px;
}
.in_tit.white h3, .in_tit.white p {
  color: #fff;
}
.in_tit.white span {
  background: #fff;
}
.in_more {
  position: relative;
  max-width: 120px;
  text-align: center;
  border: 1px solid rgba(255, 255, 255, 0);
  border-radius: 4px;
  transition: all .5s ease;
  z-index: 1;
  box-sizing: border-box;
  overflow: hidden;
}
.in_more a {
  color: #fff;
  position: relative;
  z-index: 3;
  font-size: 0.875rem;
  line-height: 40px;
  text-align: center;
  display: block;
  transition: all .5s ease;
}
.in_more:hover {
  border-color: #1b242b;
}
.in_more:hover a {
  color: #1b242b;
}
.in_more:after {
  content: '';
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background: #007d93;
  border: 1px solid #007d93;
  border-radius: 4px;
  z-index: 2;
  transition: all .5s ease;
}
.in_more:hover:after {
  -webkit-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  transform: translateY(-100%);
}
.in_more.white:hover {
  border-color: rgba(255, 171, 0, 1);
}
.in_more.white:hover a {
  color: #ffab00;
}
  .cont .imgpc{
  display: block;
  }
  .cont .imgmobile{
  display: none;
  }
@media only screen and (max-width: 1024px) {
  .in_tit {
    width: 75.24%;
  }
  .in_tit h3 {
    font-size: 2.25rem;
  }
  .in_tit p {
    font-size: 0.875rem;
  }
  .in_tit span {
  max-width: 70px;
}
}
@media only screen and (max-width: 768px) {
  .in_tit {
    width: auto;
    margin-top: 10px;
  }
  .in_tit h3 {
    font-size: 1.5rem;
  }
  .in_tit span {
  max-width: 50px;
  }
  .cont .imgpc{
  display: none;
  }
  .cont .imgmobile{
  display: block;
  }
}
@media only screen and (max-width: 414px) {
  .in_tit {
    width: auto;
    margin-top: 10px;
  }
  .in_tit h3 {
    font-size: 1rem;
  }
  .in_tit span {
  max-width: 34px;
  }
  .in_tit p {
  font-size: 0.75rem;
  line-height: 1.2;
  padding-top: 0px;
  padding-bottom: 10px;
}
.in_more a {
  font-size: 0.75rem;
  line-height: 30px;
}
}

.in_class {
  margin: 5rem 0;
}
.in_class .tit {
  display: flex;
  align-items: center;
}
.in_class .in_tit {
  width: 75.24%;
}
.in_class .more {
  width: 24.759999999999998%;
}
.in_class .in_more {
  margin-left: auto;
}
.in_class ul {
  display: flex;
  flex-wrap: wrap;
}
.in_class ul li {
  width: calc(100% / 4 - 2%);
  margin-right: 2.6%;
}
.in_class ul li:nth-child(4n) {
  margin-right: 0;
}
.in_class ul li .imgbox {
  width: 100%;
  height: 100%;
  position: relative;
  min-height: inherit;
}
.in_class ul li .imgbox > img {
  height: auto;
  width: 100%;
  object-fit: cover;
  opacity: 1;
  transition: all 1.5s ease;
}
.in_class ul li .contentbox {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  background: rgb(0 0 0 / 55%);
}
.in_class ul li .gridbox {
  width: 100%;
  padding: 5% 5%;
}
.in_class ul li .ico {
  max-width: 50px;
}
.in_class ul li .ico img {
  transition: all 1s;
}
.in_class ul li .txt {
  color: #fff;
  margin-top: 20px;
  margin-bottom: 40px;
  transition: all 0.3s ease;
}
.in_class ul li .txt h3 {
  font-size: 24px;
  line-height: 1.6;
}
.in_class ul li .txt p {
  font-size: 14px;
  line-height: 1.8;
  margin-top: 20px;
  opacity: .8;
}
.in_class ul li .btn {
  position: relative;
  min-height: 70px;
  line-height: 70px;
  border-top: 2px solid rgba(255, 255, 255, .2);
}
.in_class ul li .btn:after {
  content: '';
  width: 15%;
  height: 2px;
  background: #fff;
  transition: all 0.8s;
  position: absolute;
  left: 0px;
  top: -2px;
}
.in_class ul li .btn a {
  color: #fff;
  font-size: 14px;
}
.in_class ul li .imgbox:hover .contentbox {
  background: rgba(255,171, 0, 0.3);
}
.in_class ul li .imgbox:hover .ico img {
  transform: rotateY(360deg);
}
.in_class ul li .imgbox:hover .txt {
  margin-top: 50px;
  margin-bottom: 50px;
}
.in_class ul li .imgbox:hover .txt p {
  opacity: 1;
}
.in_class ul li .imgbox:hover .btn:after {
  width: 100%;
}
@media only screen and (max-width: 1024px) {
  .in_class {
    margin: 3.5rem 0;
  }
  .in_class ul li {
  width: calc(100% / 2 - 2%);
  margin-right: 2.6%;
  margin-bottom: 2.6%;
}
.in_class ul li:nth-child(2n) {
  margin-right: 0;
}
  .in_class ul li .imgbox > img {
    height: 560px;
  }
  .in_class ul li .txt, .in_class ul li .imgbox:hover .txt {
    margin: 20px 0;
  }
}
@media only screen and (max-width: 768px) {
  .in_class {
    margin: 2rem 0;
  }
  .in_class ul li {
    width: 100%;
    margin: 1% 0;
  }
  .in_class ul li .imgbox > img {
    height: 320px;
  }
  .in_class ul li .gridbox {
    padding: 8% 5%;
  }
  .in_class ul li .ico {
    max-width: 36px;
  }
  .in_class ul li .txt, .in_class ul li .imgbox:hover .txt {
    margin: 30px 0 20px;
  }
  .in_class ul li .txt h3 {
    font-size: 18px;
    height: 38px;
  }
  .in_class ul li .txt p {
    margin-top: 10px;
  }
  .in_class ul li .btn {
    min-height: 50px;
    height: 50px;
    overflow: hidden;
  }
}
@media only screen and (max-width: 414px) {
.in_class {
  padding: 1.25rem 0;
}
}

.in_pro {
  padding: 5rem 0;
  background: url(../images/xy_pro_bg.jpg) no-repeat center center;
  background-attachment: fixed;
  background-size: cover;
}
.in_pro .tit {
  display: flex;
  align-items: center;
}
.in_pro .in_tit {
  width: 75.24%;
}
.in_pro .more {
  width: 24.759999999999998%;
}
.in_pro .in_more {
  margin-left: auto;
}
.in_pro #products {
  width: 100%;
  height: auto;
  overflow: hidden;
  padding: 1rem 0rem;
}
.in_pro .list {
  position: relative;
  width: 100%;
  height: auto;
  padding-bottom: 60px;
}
.in_pro li {
  overflow: hidden;
  padding: 15px;
  background: #fff;
  box-sizing: border-box;
}
.in_pro li .img {
  position: relative;
  width: 100%;
  padding-bottom: 100%;
  overflow: hidden;
}
.in_pro li .img img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(1);
  width: 100%;
  height: auto;
  transition: all .5s ease;
}
.in_pro li h3 {
  display: block;
  color: #000;
  font-size: 18px;
  line-height: 2;
  text-align: center;
  padding: 0 2%;
  margin: 10px 0px;
  transition: all .5s ease;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.in_pro li:hover .img img {
  transform: translate(-50%, -50%) scale(1.1);
}
.in_pro li:hover h3 {
  color: #ffab00;
}
.in_pro .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  margin: 5px;
  background: #d2d5d9;
  opacity: 1;
  transition: all .5s ease;
}
.in_pro .swiper-pagination-bullet-active {
  background: #ffab00;
}
.in_pro .swiper-pagination {
  width: 100%;
  bottom: 0px;
}
@media only screen and (max-width: 1024px) {
  .in_pro {
    padding: 3rem 0;
  }
}
@media only screen and (max-width: 768px) {
  .in_pro {
    padding: 2rem 0;
  }
  .in_pro .in_tit {
    width: 100%;
  }
  .in_pro .more {
    display: none;
  }
  .in_pro .list {
    padding-bottom: 40px;
  }
  .in_pro li {
    padding: 5px;
  }
  .in_pro li h3 {
    font-size: 14px;
    line-height: 1.6;
    margin: 10px 0px 5px 0px;
  }
}
.in_about {
  margin: 5rem 0;
}
.in_about .box {
  display: flex;
  align-items: center;
}
.in_about .fl {
  width: 49%;
}
.in_about .fl .txt {
  color: #666;
  font-size: 16px;
  line-height: 1.6;
  margin: 20px 0 30px;
}
.in_about .fr {
  width: 49%;
  margin-left: 2%;
}
.in_about .fr li {
  display: flex;
  align-items: center;
  margin: 10px 0;
  background: #f3f3f3;
  transition: all .5s ease;
}
.in_about .fr li .img {
  width: 19.100199999999997%;
}
.in_about .fr li .img > div {
  max-width: 80px;
  margin: 50px auto;
}
.in_about .fr li .img img {
  width: 100%;
  height: 100%;
}
.in_about .fr li .txt {
  width: 78.8998%;
  margin-left: 2%;
}
.in_about .fr li .txt > div {
  padding: 0 10px;
}
.in_about .fr li .txt h3 {
  color: #ffab00;
  font-size: 20px;
  margin-top: 30px;
  transition: all .5s ease;
}
.in_about .fr li .txt p {
  max-width: 90%;
  color: #666;
  font-size: 14px;
  line-height: 1.6;
  margin: 10px 0 30px;
  transition: all .5s ease;
}
.in_about .fr li:hover {
  background-color: #ffab00;
}
.in_about .fr li:hover .txt h3, .in_about .fr li:hover .txt p {
  color: #fff;
}
@media only screen and (max-width: 1024px) {
  .in_about {
    margin: 3rem 0;
  }
  .in_about .fl .txt {
    font-size: 14px;
  }
}
@media only screen and (max-width: 768px) {
  .in_about {
    margin: 2rem 0;
  }
  .in_about .box {
    display: block;
  }
  .in_about .fl, .in_about .fr {
    width: 100%;
    margin: 0;
  }
  .in_about .fl .txt {
    font-size: 14px;
  }
  .in_about .fr li .img {
    display: none;
  }
  .in_about .fr li .txt {
    width: 100%;
    margin: 0;
  }
  .in_about .fr li .txt p {
    max-width: 100%;
  }
}
.in_quality {
  padding: 5rem 0;
  background: url(../images/xy_qc_bg.jpg) no-repeat center center;
  background-attachment: fixed;
  background-size: cover;
}
.in_quality .box {
  display: flex;
  align-items: center;
  background: rgb(236 119 41 / 78%);
}
.in_quality .fl {
  position: relative;
  width: 48.5%;
}
.in_quality .fl .img {
  position: relative;
  width: 100%;
  padding-bottom: 67.5%;
  overflow: hidden;
}
.in_quality .fl img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: all .5s ease;
}
.in_quality .fl .tit {
  position: absolute;
  top: 0%;
  left: 3%;
  width: 94%;
}
.in_quality .fl .tit h3 {
  display: block;
  font-size: 26px;
  color: #ffffff;
  line-height: 40px;
  padding: 20px 0;
  text-shadow: 1px 1px 5px #000;
}
.in_quality .fl .img:hover img {
  transform: scale(1.1);
}
.in_quality .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  margin: 5px;
  background: none;
  border: 2px solid #fff;
  opacity: 1;
  transition: all .5s ease;
}
.in_quality .swiper-pagination-bullet-active {
  background: #fff;
}
.in_quality .swiper-pagination {
  width: 100%;
  bottom: 1%;
}
.in_quality .fr {
  width: 48.5%;
  margin-left: 3%;
}
.in_quality .fr > div {
  padding-right: 5%;
}
.in_quality .in_tit {
  width: 100%;
}
.in_quality .fr .txt {
  color: #fff;
  font-size: 16px;
  line-height: 1.6;
  margin: 20px 0;
}
.in_quality .fr .img {
  max-width: 650px;
  margin-bottom: 30px;
}
.in_quality .fr .img img {
  max-width: 100%;
}
@media only screen and (max-width: 1024px) {
  .in_quality {
    padding: 3rem 0;
  }
  .in_quality .fr .txt {
    font-size: 14px;
  }
}
@media only screen and (max-width: 768px) {
  .in_quality {
    padding: 2rem 0;
  }
  .in_quality .box {
    display: block;
    background: none;
  }
  .in_quality .fl, .in_quality .fr {
    width: 100%;
    margin: 0;
  }
  .in_quality .fl .tit h3 {
    font-size: 1rem;
    line-height: 1.5;
    padding: 8px 0;
  }
  .in_quality .fr > div {
    padding: 0;
  }
}
.in_news {
  padding: 5rem 0;
  background: #f5f5f5;
}
.in_news .tit {
  display: flex;
  align-items: center;
}
.in_news .in_tit {
  width: 75.24%;
}
.in_news .more {
  width: 24.759999999999998%;
}
.in_news .in_more {
  margin-left: auto;
}
@media only screen and (max-width: 1024px) {
  .in_news {
    padding: 3.5rem 0;
  }
}
@media only screen and (max-width: 768px) {
  .in_news {
    padding: 2rem 0;
  }
/*  .in_news .in_tit {
    width: 100%;
  }
  .in_news .more {
    display: none;
  }*/
}
@media only screen and (max-width: 414px) {
.in_news {
  padding: 1.25rem 0;
}
}
.newListBox {
  margin-bottom: 0;
}
.nuew_list {
  display: flex;
  -ms-flex-preferred-size: 100%;
  flex-basis: 100%;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.nuew_list li {
  background: #fff;
  width: calc(100% / 4 - 2.16%);
  margin-right: 2.6%;
  margin-top: 0px;
  padding-bottom: 20px;
  border: solid 1px #ccc;
  border-radius: 4px;
}
.nuew_list li:nth-child(4n) {
  margin-right: 0px;
}
.nuew_list li .box {
  padding: 0;
}
.nuew_list li .lin {
  position: relative;
  width: 100%;
  height: 2px;
  background: #ededed;
  margin-bottom: 20px;
}
.nuew_list li .lin::before {
  content: '';
  position: absolute;
  top: 0px;
  left: 0px;
  width: 0px;
  height: 100%;
  background: #ffab00;
  transition: all .5s ease;
}
/*.nuew_list li .time{font-size:14px;line-height:1.5;letter-spacing:.25px;color:#777;margin-bottom:20px;}*/
.nuew_list li .title {
  padding: 0 10px;
  font-size: 18px;
  margin-bottom: 0;
  min-height: 22px;
  line-height: 1.2;
  font-weight: bold;
  color: #333;
  transition: all .5s ease;
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}
.nuew_list li .txt {
  padding: 0 10px;
  position: relative; /*width:100%;*/ line-height: 1.4;
  clear: both;
  font-size: 14px;
  color: #777;
  min-height: 48px;
  letter-spacing: .25px;
  margin: 10px 0px;
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}
.nuew_list li .pic {
  position: relative;
  width: 100%;
  height: 0px;
  padding-bottom: 75%;
  overflow: hidden;
  border-radius: 0px;
  margin: 0 auto; /*display:none;*/
}
.nuew_list li .pic img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(1);
  width: 100%;
  height: auto;
  transition: all .5s ease;
}
.nuew_list li .pic .typename {
  position: absolute;
  z-index: 9;
  display: block;
  text-align: center;
  top: 0;
  right: 0;
  padding: 5px 20px;
  background: #007d93;
  color: #fff
}
.nuew_list li .box2 {
  padding: 0
}
.nuew_list li .times {
  width: 30%;
  float: left;
  text-align: center
}
.nuew_list li .times h4 {
  font-size: 30px;
  color: #007d93
}
.nuew_list li .times p {
  font-size: 12px;
  color: #999
}
.nuew_list li .btn {
  float: right;
  width: 40%;
  font-size: 14px; /*font-weight:bold;*/ letter-spacing: .5px;
  text-transform: uppercase;
  display: flex;
  -webkit-box-align: right;
  -ms-flex-align: right;
  align-items: right;
  margin-top: 30px;
  color: #777;
  overflow: hidden;
  transition: all .5s ease;
}
.nuew_list li .btn span {
  margin-right: 10px;
  position: relative;
}
.nuew_list li .box .btn {
  display: none;
}
.nuew_list li:hover .pic img {
  transform: translate(-50%, -50%) scale(1.1);
}
.nuew_list li:hover .title {
  color: #ffab00;
}
.nuew_list li:hover .lin::before {
  width: 100%;
}
.nuew_list li:hover .btn {
  color: #ffab00;
}
.nuew_list.ny li {
  margin-top: 80px;
}
.nuew_list.ny li .lin::before {
  background: #afafaf;
}
.nuew_list.ny li .pic {
  display: block;
}
@media only screen and (max-width: 1024px) {
.nuew_list li {
  width: calc(100% / 2 - 2.16%);
  margin-right: 2.6%;
  margin-bottom: 2.6%;
  margin-top: 0px;
  padding-bottom: 20px;
  border: solid 1px #ccc;
  border-radius: 4px;
}
.nuew_list li:nth-child(2n) {
  margin-right: 0px;
}
/*  .nuew_list li, .nuew_list.ny li {
    flex-basis: 100%;
    width: 100%;
    margin-right: 0;
    margin-top: 50px;
  }*/
  .nuew_list.ny li a {
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
  }
  .nuew_list.ny li .box, .nuew_list.ny li .image {
    width: 48%;
  }
  .nuew_list.ny li .box .btn {
    display: block;
  }
  .nuew_list.ny li .image .btn {
    display: none;
  }
  .nuew_list.ny li .pic {
    padding-bottom: 72%;
  }
}
@media only screen and (max-width: 768px) {
  .nuew_list li, .nuew_list.ny li {
    flex-basis: 100%;
    width: 100%;
    margin-right: 0;
    margin-top: 0px;
  }
  .nuew_list li .title {
    font-size: 18px;
    min-height: 38px;
  }
  .nuew_list li .txt {
    font-size: 14px;
    min-height: 50px;
  }
  .nuew_list.ny li a {
    display: block;
  }
  .nuew_list.ny li .box, .nuew_list.ny li .image {
    width: 100%;
  }
  .nuew_list.ny li .title {
    font-size: 16px;
    min-height: auto;
  }
  .nuew_list.ny li .txt {
    min-height: auto;
    margin: 10px 0px 20px;
  }
  .nuew_list.ny li .box .btn {
    display: none;
  }
  .nuew_list.ny li .image .btn {
    display: block;
  }
  .nuew_list.ny li .pic {
    padding-bottom: 62%;
  }
}
footer {
  padding-top: 2.5rem;
  padding-bottom: 2rem;
  background: #007d93;
  color: #fff;
  font-size: 0.875rem;
}
footer a {
  color: #fff
}
footer a:hover {
  color: #ffab00
}
footer .f_top {
  clear: both;
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
  display: flex;
  align-items: center;
}
/*footer .f_logo{clear: left;margin-right: 0;width: 19.235100000000003%;}
footer .f_logo .box{width: 100%;max-width: 200px;margin: 20px 0;}
footer .f_logo img{width: 100%;}
footer .f_nav{width: 100%;}
footer .f_nav ul{font-size: 14px;color: #333;margin: 20px 0;}
footer .f_nav li{display: inline-block;margin-right: 2%;line-height: 24px;}
footer .f_nav li a{display: block;font-size: 20px;color: #fff;}*/
footer .f_bottom {}
footer .f_fl {
  float: left;
  width: 30%;
}
footer .f_fl .box {
  padding-right: 5%;
}
footer .f_fl ul{padding: 10px}
footer .bottom_logo img {
  width: 100%;
  height: auto
}
footer .bottom_address {
  background: url(../images/address.png) center left no-repeat;
  background-size: 16px;
  padding: 5px 0 5px 24px;
  font-size: 0.875rem;
}
footer .bottom_phone {
  background: url(../images/phone.png) center left no-repeat;
  background-size: 16px;
  padding: 5px 0 5px 24px;
  font-size: 0.875rem;
}
footer .bottom_email {
  background: url(../images/email.png) center left no-repeat;
  background-size: 16px;
  padding: 5px 0 5px 24px;
  font-size: 0.875rem;
}
/*footer .f_fl .search{display: inline-block;border: 1px solid #aaa;box-sizing: border-box;}
footer .f_fl .search .p_searchBox{width: auto;height: auto;display: inline-block;vertical-align: middle;overflow: visible;padding: 0;margin: 0;border-width: 1px;border-style: none;border-color: rgba(228,228,228,0);background-color: transparent;position: relative;}
footer .f_fl .search .p_searchBox .p_input{width: 220px;display: inline-block;height: 40px;vertical-align: middle;color: inherit;position: relative;font-size: 14px;}
footer .f_fl .search .p_searchBox .p_input .last{display: none;}
footer .f_fl .search .p_searchBox .p_input .forward{position: absolute;left: 5px;top: 50%;transform: translateY(-50%);height: auto;font-size: 15px;}
footer .f_fl .search .p_searchBox .p_input .forward:before{color: #a9a9a9;}
footer .f_fl .search .p_searchBox .p_input .InputText{color:#fff;background-color:#ffffff00;display: inline-block;height: 100%;width: inherit;line-height: inherit;padding-left: 25px;padding-right: 5px;box-sizing: border-box;}
footer .f_fl .search .p_searchBox .p_input .InputText::-webkit-input-placeholder{color:#cecece;font-size:14px}
footer .f_fl .search .sbtn{height: 36px;background-color: #ffab00;border-radius: 3px;margin: 3px;width: auto;display: inline-block;vertical-align: middle;font-size: 14px;color: rgba(255,255,255,1);border-width: 1px;border-style: solid;border-color: rgba(255,255,255,0);text-align: center;position: inherit;padding: 0 20px;cursor: pointer;font-family: inherit;font-weight: inherit;text-decoration: none;background-size: 100% 100%;}*/
footer .f_fr {
  float: right;
  width: 62%;
}
footer .f_fr ul {
  display: flex;
  flex-wrap: wrap;
}
footer .f_fr ul li {
  width: calc(100% / 3 - 2%);
  margin-right: 2.6%;
  text-align: center;
}
footer .f_fr ul li:nth-child(3n) {
  margin-right: 0;
}
footer .f_fr ul li img {}
footer .f_fr ul li p {
  padding: 10px 0;
  font-size: 1rem
}
/*footer .f_fr h3{color: #fff;font-size: 24px;text-align: right;margin-bottom: 20px;}
footer .f_fr .foot_share{display:block;text-align:right;margin-bottom: 30px;}
footer .f_fr .foot_share a{display:inline-block;position:relative;padding:0px 20px;}
footer .f_fr .foot_share a:first-of-type{padding-left:0px;}
footer .f_fr .foot_share a:last-of-type{padding-right:0px;}
footer .f_fr .foot_share a:not(:last-of-type):before{content:"";position:absolute;top:0;right:0;width:1px;height:100%;background-color:#666;}
footer .f_fr .foot_share span{display:inline-block;vertical-align:middle;width:100px;height:100px;}
footer .f_fr .foot_share span img{height:100%;width:100%;display:block;filter:brightness(0.6);transition:all .5s ease;}
footer .f_fr .foot_share span:hover img{filter:brightness(1);}*/
footer .copyrightarea {
  padding: 0.75rem 0;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
footer .copyright {
  width: 50%;
}
footer .links_foot {
  width: 50%;
  text-align: right
}
footer .links_foot a {
padding: 0 0 0 15px
}
@media only screen and (max-width: 1024px) {
  footer {
    padding: 2rem 0;
  }
footer .bottom_logo img {
  width: 50%;
  height: auto
}
  footer .f_fl, footer .f_fr {
    width: 100%;
    margin: 0;
    margin-bottom: 2rem;
  }
  footer .f_fr h3, footer .f_fr .foot_share, footer .f_fr .copyright {
    text-align: left;
  }
footer .copyright {
  flex-basis: 100%;
}
footer .links_foot {
  flex-basis: 100%;
}
}
@media only screen and (max-width: 768px) {
  footer {
    padding: 1.5rem 0;
  }
footer .bottom_logo img {
  width: 65%;
  height: auto
}  
  /*footer .f_logo{width: auto;}*/
  footer .f_fl {
    margin: 0;
  }
  footer .f_fl .box {
    padding-bottom: 5px;
  }
  /*footer .f_fl .lianxi{font-size: 14px;}
footer .f_fl .search{display: none;}
footer .f_fr h3{font-size: 18px;}*/
}
@media only screen and (max-width: 414px) {
  footer {
    padding: 1.5rem 0;
  }
footer .bottom_logo img {
  width: 98%;
  height: auto
}  
  /*footer .f_logo{width: auto;}*/
  footer .f_fl {
    margin: 0;
  }
  footer .f_fl .box {
    padding-bottom: 5px;
  }
  /*footer .f_fl .lianxi{font-size: 14px;}
footer .f_fl .search{display: none;}
footer .f_fr h3{font-size: 18px;}*/
}
/*内页*/
.small_banner {
  position: relative;
  max-height: 420px;
  height: 42vh;
  overflow: hidden;
}
.small_banner .pic {
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  background: no-repeat center/cover;
}
.small_banner .mask {
  position: absolute;
  width: 80%;
  color: #fff;
  text-align: center;
  bottom: 50px;
  left: 10%;
  z-index: 4;
}
.small_banner .mask .a1 {
  font-size: 3vw;
  font-weight: bold;
  text-align: left;
  line-height: 120%;
}
.small_banner .mask .a2 {
  height: 1px;
  width: 100%;
  background: rgba(255, 255, 255, 0.5);
  margin: 30px 0 20px;
}
@media only screen and (max-width: 1024px) {
  .small_banner .mask {
    bottom: 75px;
    width: 90%;
    left: 5%;
  }
  .small_banner .mask .a1 {
    font-size: 2.75rem;
  }
  .small_banner .mask .a2 {
    margin-bottom: 25px;
  }
}
@media only screen and (max-width: 768px) {
  .small_banner {
    height: 40vh;
  }
  .small_banner .mask {
    bottom: 40px;
    width: 90%;
    left: 5%;
  }
  .small_banner .mask .a1 {
    font-size: 5vw;
  }
  .small_banner .mask .a2 {
    margin: 10px 0 20px;
  }
}
.location {
  width: 100%;
  position: relative;
  background: #f5f5f5;
}
.location > main {
  width: 100%;
  display: flex;
  align-items: center;
}
.ny_class {
  position: relative;
  width: 70.34%;
  z-index: 9;
}
.ny_class ul {
  text-align: left;
  display: flex;
  flex-wrap: nowrap;
}
.ny_class ul li {
  display: inline-block;
  color: #fff;
  width: auto;
  vertical-align: top;
}
.ny_class ul li a {
  position: relative;
  font-size: 17px;
  height: 80px;
  line-height: 80px;
  padding: 0px 30px;
  color: #000;
  font-weight: bold;
  display: block;
  transition: 0.3s ease 0s;
}
.ny_class ul li a:before {
  position: absolute;
  content: '';
  left: 50%;
  bottom: 0px;
  width: 0%;
  height: 3px;
  background-color: none;
  transition: all .3s;
}
.ny_class ul li a:after {
  content: "";
  position: absolute;
  width: 1px;
  height: 15px;
  display: block;
  background: #ccc;
  top: 50%;
  margin-top: -7px;
  right: 0px;
}
.ny_class ul li:last-child a:after {
  display: none;
}
.ny_class ul li a:hover, .ny_class ul li a.cur {
  color: #ffab00;
}
.ny_class ul li a:hover:before, .ny_class ul li a.cur:before {
  width: 80%;
  left: 10%;
  background-color: #ffab00;
}
.ny_class .btn-pre, .ny_class .btn-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 25px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  z-index: 999;
  background: #f5f5f5;
  color: #ffab00;
  cursor: pointer;
  display: none;
}
.ny_class .btn-pre {
  left: 0;
}
.ny_class .btn-next {
  right: 0;
}
.ny_class .fa-share{
padding-left: 10px;
font-size: 16px;
color: #ffab00
}
.weizhi {
  color: #555;
  line-height: 30px;
  padding: 25px 0;
  box-sizing: border-box;
}
.location .weizhi {
  width: 29.659999999999997%;
  text-align: right;
  padding-right: 20px;
}
.weizhi span {
  position: relative;
  padding-left: 25px;
}
.weizhi span .iconfont2 {
  position: absolute;
  width: 20px;
  height: 22px;
  left: 0px;
}
.weizhi span .iconfont2:before {
  content: '\e630';
  color: #ffab00;
  font-size: 20px;
}
.weizhi a {
  color: #555;
}
.weizhi a:hover {
  color: #ffab00;
}
@media only screen and (max-width: 1200px) {
  .ny_class ul li a {
    font-size: 14px;
  }
}
@media only screen and (max-width: 1024px) {
  .location > main {
    display: block;
  }
  .ny_class {
    width: auto;
    border-bottom: 1px solid #ddd;
    border-radius: 4px;
  }
  .weizhi, .location .weizhi {
    width: 100%;
    /*text-align: left;*/
    padding: 10px;
  }
}
@media only screen and (max-width: 768px) {
  .ny_class {
    padding: 0px 25px;
  }
  .ny_class ul li a {
    padding: 0px 20px;
    height: 62px;
    line-height: 62px;
  }
  .ny_class .btn-pre, .ny_class .btn-next {
    display: block;
  }
  .location .weizhi {
    display: none;
  }
}
.nr_page {
  overflow: hidden;
  background-color: #fff;
  position: relative;
  height: auto;
  margin: 4rem 0;
}
.nr_page .title {
  max-width: 80%;
  font-size: 2rem;
  font-weight: bold;
  color: #222;
  text-align: center;
  word-break: break-all;
  margin: auto;
}
.nr_page .status {
  color: #595959;
  font-size: 14px;
  text-align: center;
  padding-bottom: 20px;
  margin-top: 20px;
  overflow: hidden;
  border-bottom: 1px solid #d9d9d9;
  border-radius: 4px;
}
.nr_page .status a {
  color: #595959;
}
.nr_page .status span {
  margin-right: 20px;
}
.nr_page .intro {
  color: #595959;
  font-size: 14px;
  padding: 10px;
  white-space: normal;
  background: #f2f2f2;
  margin-bottom: 20px;
}
.nr_page .content {
  padding: 20px 0;
  text-align: justify;
  word-break: break-word !important;
  overflow: hidden;
}
.nr_page .content p {
  font-size: 16px;
  color: #666;
  padding-bottom: 15px;
  line-height: 1.8;
}
.nr_page .content img {
  /*width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;*/
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  margin: 0 auto;
}
.nr_page .key {
  color: #595959;
}
.nr_page .key span {
  color: #595959;
}
.nr_page .key p {
  display: inline-block;
}
.nr_page .key button {
  font-size: 14px;
  margin: 2px;
  padding: 6px 5px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  cursor: pointer;
  transition: all .5s ease;
}
.nr_page .key button:hover {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad
}
.nr_page .reLink {
  display: flex;
  margin: 20px 0;
  padding-bottom: 20px;
  border-bottom: 1px solid #d9d9d9;
  overflow: hidden;
}
.nr_page .prev, .nr_page .next {
  width: 50%;
  color: #595959;
  line-height: 1.5;
}
.nr_page .prev a, .nr_page .next a {
  color: #595959;
}
.nr_page .next {
  text-align: right;
}
.nr_page .relevant {
  margin-top: 30px;
}
.nr_page .relevant .tit {
  background-color: #ededed;
  height: 60px;
}
.nr_page .relevant .tit h3 {
  color: #000;
  font-size: 1.125rem;
  line-height: 60px;
  font-weight: bold;
  padding: 0 15px;
}
.nr_page .relevant ul {
  display: flex;
  padding: 30px 0;
  border: 1px solid #f0f0f0;
  border-radius: 4px;
}
.nr_page .relevant ul li {
  width: calc(100% / 3);
  padding: 20px 10px;
  box-sizing: border-box;
}
.nr_page .relevant ul li .box {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  transition: all .5s ease;
}
.nr_page .relevant ul li .img {
  width: 100%;
  height: 0px;
  position: relative;
  padding-bottom: 75%;
}
.nr_page .relevant ul li .img img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
}
.nr_page .relevant ul li .txt {
  width: 100%;
  height: 150px;
  padding: 20px 10px;
  box-sizing: border-box;
}
.nr_page .relevant ul li span {
  color: #999;
}
.nr_page .relevant ul li h3 {
  height: 40px;
  line-height: 40px;
  font-weight: 200;
  color: #333;
  font-size: 1.125rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
}
.nr_page .relevant ul li .line {
  border-top-color: #ffab00;
  border-top-width: 1px;
  border-top-style: solid;
  margin: 10px 0;
  width: 5%;
  transition: all .5s ease;
}
.nr_page .relevant ul li p {
  font-size: 0.875rem;
  display: -webkit-box;
  overflow: hidden;
  word-break: break-word;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  line-height: 1.6;
  color: #999;
  overflow-wrap: break-word;
}
.nr_page .relevant ul li:hover .box {
  transform: translateY(-15px);
}
.nr_page .relevant ul li:hover .line {
  width: 100%;
}
@media only screen and (max-width: 768px) {
  .nr_page {
    margin: 2rem 0;
  }
  .nr_page .title {
    max-width: 100%;
    font-size: 18px;
    line-height: 1.6;
    margin: 10px 0;
  }
  .nr_page .status {
    margin: 0;
    padding: 0;
    border: 0;
    line-height: 24px;
    padding-bottom: 10px;
    border-bottom: 1px solid #d9d9d9;
  }
  .nr_page .status span:first-child {
    display: none;
  }
  .nr_page .intro {
    display: none;
  }
  .nr_page .content {
    padding: 10px 0;
  }
  .nr_page .content p {
    font-size: 14px;
  }
  .nr_page .key button {
    font-size: 12px;
    padding: 5px 3px;
  }
  .nr_page .reLink {
    display: block;
    margin: 3vw auto;
    padding: 0;
    border: 0;
  }
  .nr_page .reLink span {
    font-weight: bold;
  }
  .nr_page .prev, .nr_page .next {
    width: auto;
    text-align: left;
    background: #f2f2f2;
    padding: 10px;
    margin: 2vw auto;
  }
  .nr_page .relevant {
    margin-top: 20px;
  }
  .nr_page .relevant ul {
    display: block;
    padding: 0;
  }
  .nr_page .relevant ul li {
    width: 100%;
    padding: 10px;
  }
  .nr_page .relevant ul li:hover .box {
    transform: translateY(0);
  }
  .nr_page .relevant ul li:hover .line {
    width: 5%;
  }
}
.imgListBox {
  margin: 4rem 0;
}
.img_list {
  display: flex;
  -ms-flex-preferred-size: 100%;
  flex-basis: 100%;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.img_list li {
  width: calc(100% / 4 - 1.95%);
  margin-right: 2.6%;
  margin-bottom: 2.6%;
  padding: 10px;
  background: #f6f6f6;
  box-sizing: border-box;
  transition: 0.3s ease 0s;
}
.img_list li:nth-child(4n) {
  margin-right: 0;
}
.img_list li .img {
  width: 100%;
  position: relative;
  padding-bottom: 67.5%;
  overflow: hidden;
}
.img_list li .img img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
  transition: 0.5s linear 0s;
}
.img_list li h3 {
  color: #666;
  font-size: 16px;
  text-align: center;
  padding: 3% 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  transition: 0.3s ease 0s;
}
.img_list li:hover img {
  transform: scale(1.1);
}
.img_list li:hover h3 {
  color: #ffab00;
  background: #ffffff;
}
@media only screen and (max-width: 1500px) {
  .img_list li h3 {
    font-size: 14px;
  }
}
@media only screen and (max-width: 768px) {
  .imgListBox {
    margin: 2rem 0;
  }
  .img_list li, .img_list li:nth-child(4n) {
    width: calc(100% / 2 - 2%);
    margin-right: 4%;
    margin-bottom: 4%;
    padding: 5px;
  }
  .img_list li:nth-child(2n) {
    margin-right: 0;
  }
  .img_list li h3 {
    padding: 2vw;
  }
}
.PicListBox {
  margin: 4rem 0;
}
.PicListBox .title {
  color: #333;
  font-size: 30px;
  line-height: 50px;
}
.Pic_list {
  display: flex;
  -ms-flex-preferred-size: 100%;
  flex-basis: 100%;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.Pic_list li {
  width: calc((100% - 80px)/4);
  margin: 10px;
  border: 1px solid #ddd;
  box-sizing: border-box;
  transition: 0.3s ease 0s;
}
.Pic_list li .img {
  width: 100%;
  position: relative;
  padding-bottom: 100%;
  overflow: hidden;
}
.Pic_list li .img img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
  transition: 0.5s linear 0s;
}
.Pic_list li h3 {
  color: #333;
  font-size: 16px;
  line-height: 50px;
  text-align: center;
  padding: 0 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  transition: 0.3s ease 0s;
}
.Pic_list li:hover img {
  transform: scale(1.1);
}
.Pic_list li:hover h3 {
  color: #fff;
  background: #ffab00;
}
@media only screen and (max-width: 1024px) {
  .PicListBox {
    margin: 2rem 0;
  }
}
@media only screen and (max-width: 768px) {
  .PicListBox .title {
    font-size: 20px;
    text-align: center;
  }
  .Pic_list li {
    width: calc((100% - 20px)/2);
    margin: 5px;
  }
  .Pic_list li h3 {
    font-size: 12px;
    line-height: 40px;
    padding: 0 5px;
  }
}
.contact {
  margin: 4rem 0;
}
.contact .box {
  position: relative;
  display: flex;
  justify-content: space-between;
}
.contact .lianxi {
  width: 39.050000000000004%;
  color: #fff;
  padding: 50px 40px;
  background: #ffab00;
  box-sizing: border-box;
  flex: 1 auto;
  height: auto;
}
.contact .lianxi h3 {
  font-size: 28px;
  line-height: 1.2;
}
.contact .lianxi span {
  display: inline-block;
  width: 60px;
  height: 2px;
  margin: 27px 0;
  background: #c3161c;
}
.contact .lianxi p {
  font-size: 16px;
  line-height: 2;
}
.contact .lianxi a {
  color: #fff;
}
#mapContainer {
  width: 60.95%;
  height: auto;
}
#mapContainer .amap-copyright {
  display: none !important;
}
#mapContainer .amap-logo {
  display: none !important;
}
div.info-top {
  position: relative;
  background: none repeat scroll 0 0 #F9F9F9;
  border-bottom: 1px solid #CCC;
  border-radius: 5px 5px 0 0;
}
div.info-top div {
  display: inline-block;
  color: #333;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.5;
  padding: 10px;
  padding-right: 30px;
  text-align: left;
}
div.info-top img {
  position: absolute;
  top: 10px;
  right: 10px;
  transition-duration: 0.25s;
}
div.info-top img:hover {
  box-shadow: 0px 0px 5px #000;
}
div.info-middle {
  color: #666;
  font-size: 12px;
  padding: 10px;
  line-height: 21px;
  text-align: left;
  border-radius: 0 0 5px 5px;
  box-shadow: 0 5px 5px rgb(0 0 0 / 20%);
}
div.info-bottom {
  height: 0px;
  width: 100%;
  clear: both;
  text-align: center;
}
div.info-bottom img {
  position: relative;
  z-index: 104;
}
@media only screen and (max-width: 1024px) {
  .contact {
    margin: 2rem 0;
  }
  .contact .box {
    display: block;
  }
  .contact .lianxi, #mapContainer {
    width: 100%;
  }
  #mapContainer {
    height: 400px;
  }
}
@media only screen and (max-width: 780px) {
  .contact .lianxi {
    padding: 30px 20px;
  }
  .contact .lianxi h3 {
    font-size: 18px;
  }
  .contact .lianxi span {
    margin: 15px 0;
  }
  .contact .lianxi p {
    font-size: 14px;
  }
  #mapContainer {
    height: 300px;
  }
}
.message {
  padding: 4rem 0;
  background: #f5f5f5;
}
.message .tit {
  text-align: center;
  margin-bottom: 20px;
}
.message .tit h3 {
  color: #333;
  font-size: 34px;
  font-weight: bold;
}
.message .tit p {
  color: #787878;
  font-size: 16px;
  line-height: 1.6;
  padding: 5px 0 10px;
}
@media only screen and (max-width: 768px) {
  .message {
    padding: 2rem 0;
  }
  .message .tit {
    margin-bottom: 10px;
  }
  .message .tit h3 {
    font-size: 22px;
  }
  .message .tit p {
    font-size: 14px;
  }
}
.inner_form {
  display: flex;
  flex-wrap: wrap;
}
.inner_form .layui-form-item {
  float: left;
  width: 31%;
  margin-right: 2%;
  clear: none;
  transition: all .3s ease;
}
.inner_form .layui-form-text, .inner_form .btn {
  float: none;
  width: 100%;
  margin-right: 0;
}
.inner_form .layui-input, .inner_form .layui-textarea {
  border-radius: 4px;
  border-color: #ccc;
  box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
}
.inner_form .layui-input:hover, .inner_form .layui-textarea:hover, .inner_form .layui-input:focus, .inner_form .layui-textarea:focus {
  border-color: #66afe9 !important;
}
.inner_form .layui-textarea {
  min-height: 240px;
  resize: none;
}
.inner_form .Code {
  width: 34%;
  margin-right: 0;
}
.inner_form .Code input {
  display: inline-block;
  width: 73%;
  margin-right: 2%;
}
.inner_form .Code img {
  vertical-align: top;
  width: 25%;
  height: 36px;
  background: #fff;
  object-fit: contain;
}
.inner_form .layui-btn {
  width: 100%;
  font-size: 18px;
  text-transform: uppercase;
  background-color: #ffab00;
}
.inner_form .layui-btn:hover {
  background-color: #c3161c;
  border-color: #c3161c;
  opacity: 1;
}
@media only screen and (max-width: 768px) {
  .inner_form .layui-form-item {
    float: none;
    width: 100%;
    margin-right: 0;
  }
  .inner_form .layui-input:hover, .inner_form .layui-textarea:hover, .inner_form .layui-input:focus, .inner_form .layui-textarea:focus {
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6)
  }
}

.page{padding: 30px 0; display: flex; justify-content:center;}
.page:before, .page:after{content: " ";display: table;}
.page:after{clear: both;}
.page li{}
.page a{min-width: 38px;color: #666;font-size: 0.875rem;display: inline-block;padding: 0 10px;margin: 2.5px;text-align: center;line-height: 36px;border: 1px solid #ddd;border-radius: 4px;background: #fff;box-sizing: border-box;transition: all .5s ease;}
.page .active a{color: #fff;background: #007d93;border-color: #007d93;}
.page .current {min-width: 38px;font-size: 0.875rem;display: inline-block;padding: 0 10px;margin: 2.5px;text-align: center;line-height: 36px;border: 1px solid #007d93;border-radius: 4px;box-sizing: border-box;transition: all .5s ease;color: #fff;background: #007d93}
.page a:hover{color: #fff;background: #ffab00;border-color: #ffab00;}
.page .disabled{min-width: 38px;color: #666;font-size: 0.875rem;display: inline-block;padding: 0 10px;margin: 2.5px;text-align: center;line-height: 36px;border: 1px solid #ddd;border-radius: 4px;background: #fff;box-sizing: border-box;transition: all .5s ease;}

.pro_box {
  padding: 4rem 0;
  background: #f2f2f2;
}
.pro_box > main {
  display: flex;
}
.pro_box .pro_fl {
  width: 300px;
}
.pro_box .pro_class {
  background: #fff;
}
.pro_box .pro_class .tit {
  position: relative;
  color: #fff;
  font-size: 36px;
  font-weight: bold;
  line-height: 80px;
  padding: 0 15px;
  background: url(../images/zb_bg.jpg) no-repeat;
  background-size: cover;
}
.pro_box .pro_class .btn {
  position: absolute;
  top: 10px;
  right: 15px;
  padding: 9px 5px;
  border: 1px solid #fff;
  border-radius: 4px;
  box-sizing: border-box;
  display: none;
}
.pro_box .pro_class .btn span {
  display: block;
  width: 22px;
  height: 2px;
  background: #fff;
  border-radius: 1px;
}
.pro_box .pro_class .btn span + span {
  margin-top: 4px;
}
.pro_box .pro_class .class {
  padding: 20px 15px;
  padding-top: 0;
}
.pro_box .pro_class .class .title-box {
  position: relative;
  padding-left: 20px;
  line-height: 40px;
}
.pro_box .pro_class .class .title-box .iconA {
  position: absolute;
  left: 0px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-block;
  width: 14px;
  height: 19px;
  vertical-align: middle;
  background-image: url(../images/pro_01.gif);
  text-align: left;
  padding-left: 9px;
  background-repeat: no-repeat;
  background-position: left 50%;
  cursor: pointer;
  box-sizing: border-box;
}
.pro_box .pro_class .class .title-box .iconB {
  position: absolute;
  left: 0px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url(../images/pro_03.gif);
  padding-left: 9px;
  display: block;
  width: 14px;
  height: 19px;
  background-repeat: no-repeat;
  background-position: left 50%;
  cursor: default;
}
.pro_box .pro_class .class .active .title-box .iconA {
  background-image: url(../images/pro_02.gif);
}
.pro_box .pro_class .class .title-box a {
  display: block;
  color: #333;
  transition: all .5s ease;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.pro_box .pro_class .class .title-box a:hover, .pro_box .pro_class .class .title-box a.cur {
  color: #ffab00;
}
.pro_box .pro_class .class .title-box .titleA {
  font-size: 18px;
  font-weight: bold;
}
.pro_box .pro_class .class .title-box .titleB {
  font-size: 14px;
}
.pro_box .pro_class .class ul {
  padding-left: 25px;
}
.pro_box .pro_lx {
  margin: 5% 0;
  padding: 20px 0;
  background: #fff;
}
.pro_box .pro_lx > div {
  width: 90%;
  margin: 1rem auto;
}
.pro_box .pro_lx > div p {
  color: #777;
  font-size: 16px;
  line-height: 1.8;
}
.pro_box .pro_lx > div b {
  color: #333;
}
.pro_box .pro_lx > div .add {
  line-height: 1.4;
  margin-top: 5px;
}
.pro_box .pro_lx > div a {
  color: #777;
}
.pro_box .pro_fr {
  width: calc(100% - 340px);
  margin: 0 0 0 40px;
  background: #fff;
}
.pro_box .position {
  margin: 1% 0;
  border-bottom: 1px solid #eee;
}
.pro_box .list_box {
  padding-bottom: 30px;
}
.pro_box .list_box .title {
  color: #333;
  font-size: 28px;
  line-height: 60px;
  text-align: center;
  border-bottom: 1px solid #f0f0f0;
}
.pro_box .list_box .intro {
  padding: 0 0 20px;
  margin: 0 0 30px;
  border-bottom: 1px solid #e8e8e8;
}
.pro_box .list_box .intro p {
  color: rgba(0, 0, 0, 0.45);
  font-size: 14px;
  line-height: 1.8;
  text-align: center;
  margin: 20px 15px;
  vertical-align: top;
  word-break: break-all;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}
.pro_box .list_box .list {
  display: flex;
  flex-wrap: wrap;
}
.pro_box .list_box .list li {
  width: calc(100% / 3);
  padding: 10px;
  box-sizing: border-box;
}
.pro_box .list_box .list li .img {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: auto;
  border: 1px solid #ddd;
  border-radius: 4px;
  border-bottom: 0;
  padding-bottom: 100%;
  box-sizing: border-box;
}
.pro_box .list_box .list li .img img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  transition: all .5s ease;
}
.pro_box .list_box .list li .showBox {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  background: rgb(236 119 41 / 78%);
  transition: all 0.5s ease;
}
.pro_box .list_box .list li .showBox span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 60%;
  color: #fff;
  text-align: center;
  font-size: 1rem;
  padding: 0.5rem 0;
}
.pro_box .list_box .list li .showBox span::before, .pro_box .list_box .list li .showBox span::after {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 60%;
  height: 1px;
  background: #fff;
  transition: all .5s ease;
}
.pro_box .list_box .list li .showBox span::after {
  top: auto;
  bottom: 0;
}
.pro_box .list_box .list li .tit {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: auto;
  padding: 15px;
  border: 1px solid #ddd;
  border-radius: 4px;
  border-top: 0;
  box-sizing: border-box;
}
.pro_box .list_box .list li .tit h3 {
  color: #333;
  font-size: 1rem;
  line-height: 1.42857143;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
  white-space: nowrap;
  width: 100%;
  text-align: center;
}
.pro_box .list_box .list li:hover .img img {
  transform: translate(-50%, -50%) scale(1.1);
}
.pro_box .list_box .list li:hover .showBox {
  opacity: 1;
}
.pro_box .list_box .list li:hover .showBox span::before, .pro_box .list_box .list li:hover .showBox span::after {
  width: 1rem;
}
.pro_box .show_box {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  padding: 20px 0 30px;
  overflow: hidden;
}
.pro_box .gallery {
  float: left;
  width: 450px;
}
.pro_box .gallery .gallery-top .swiper-slide {
  cursor: pointer;
}
.pro_box .gallery .gallery-top .swiper-slide .pic {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 100%;
}
.pro_box .gallery .gallery-top .swiper-slide .pic img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
}
.pro_box .gallery .thumbs {
  position: relative;
  margin-top: 20px;
  padding: 0 33px;
  overflow: hidden;
}
.pro_box .gallery .gallery-thumbs .swiper-slide {
  width: calc(96.1% / 4);
  margin-right: 5px;
  border: .15rem solid #eee;
  border-radius: 4px;
  box-sizing: border-box;
  transition: all .5s ease;
}
.pro_box .gallery .gallery-thumbs .swiper-slide .pic {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  cursor: pointer;
}
.pro_box .gallery .gallery-thumbs .swiper-slide .pic img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
}
.pro_box .gallery .gallery-thumbs .swiper-slide-thumb-active {
  border-color: #ffab00;
}
.pro_box .swiper-pagination .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  position: relative;
  box-sizing: border-box;
  background: rgba(0, 0, 0, 0.4);
  opacity: 1;
  transition: all .5s ease;
  box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.2);
}
.pro_box .swiper-pagination .swiper-pagination-bullet:hover:after {
  transform: scale(2);
}
.pro_box .swiper-pagination .swiper-pagination-bullet:after {
  content: '';
  width: 4px;
  height: 4px;
  background: #fff;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  border-radius: 50%;
  transition: all .5s ease;
}
.pro_box .swiper-pagination .swiper-pagination-bullet-active {
  border: 2px solid #fff;
}
.pro_box .swiper-pagination .swiper-pagination-bullet-active:after {
  width: 0;
  height: 0;
  transform: scale(0);
}
.pro_box .gallery .swiper-button-prev:hover, .pro_box .gallery .swiper-button-next:hover {
  opacity: .35;
}
.pro_box .gallery .swiper-button-disabled {
  pointer-events: auto !important;
}
.pro_box .gallery .swiper-button-black {
  display: inline-block;
  vertical-align: middle;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0px;
  width: 28px;
  height: 100%;
  margin: 0;
  opacity: .6;
  background-size: 16px;
  transition: all .5s ease;
}
.pro_box .gallery .swiper-button-next {
  left: auto;
  right: 0;
}
.pro_box .info {
  float: left;
  min-width: 200px;
  padding-left: 38px;
  flex: 1;
}
.pro_box .info .box {
  margin-bottom: 20px;
  border-bottom: 1px solid #e8e8e8;
}
.pro_box .info .box h3 {
  color: #262626;
  font-size: 30px;
  line-height: 1.4;
  font-weight: bold;
}
.pro_box .info .txt {
  font-size: 14px;
  line-height: 1.8;
  color: #666;
  padding: 20px 0px;
  word-break: break-word;
}
.pro_box .info .btn {
  padding-bottom: 10px;
  white-space: nowrap;
}
.pro_box .info .btn a {
  display: inline-block;
  max-width: 45%;
  color: #fff;
  font-size: 14px;
  line-height: 1.572;
  text-align: center;
  padding: 0.6vw 3vw;
  background: #ffab00;
  transition: all .5s ease;
}
.pro_box .info .btn a:hover {
  background: #c3161c;
}
.pro_box .info .tel {
  display: flex;
  font-family: arial;
  font-size: 14px;
  height: 40px;
  margin-top: 10px;
  line-height: 40px;
  white-space: nowrap;
}
.pro_box .info .tel a {
  color: #707070;
}
.pro_box .info .tel a:first-child {
  margin-right: 20px;
}
.pro_box .info .tel i {
  color: #ffab00;
  font-size: 18px;
  vertical-align: middle;
}
.pro_box .info .tel a:hover {
  color: #ffab00;
}
.pro_box .pro_show {
  width: 100%;
  margin-top: 20px;
}
.pro_box .pro_show .tit {
  color: #333;
  font-size: 26px;
  line-height: 70px;
  font-weight: bold;
  text-align: center;
  background: #f5f5f5;
  border-bottom: 4px solid #ffab00;
  height: 70px;
  box-sizing: border-box;
}
.pro_box .pro_show .content {
  padding: 20px 0;
  word-break: break-word !important;
  overflow: hidden;
}
.pro_box .pro_show .content p {
  color: #666;
  font-size: 16px;
  padding-bottom: 15px;
  line-height: 1.8;
}
.pro_box .pro_show .content img {
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  margin: 0 auto;
}
.pro_box .pro_show .key {
  color: #595959;
  padding: 20px 0;
}
.pro_box .pro_show .key span {
  color: #595959;
}
.pro_box .pro_show .key p {
  display: inline-block;
}
.pro_box .pro_show .key button {
  color: #595959;
  font-size: 14px;
  margin: 2px;
  padding: 7px 10px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  cursor: pointer;
  transition: all .5s ease;
}
.pro_box .pro_show .key button:hover {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad
}
.pro_box .pro_show .reLink {
  display: flex;
  padding: 20px 0;
  overflow: hidden;
}
.pro_box .pro_show .prev, .pro_box .pro_show .next {
  width: 50%;
  color: #595959;
  line-height: 1.5;
}
.pro_box .pro_show .prev a, .pro_box .pro_show .next a {
  color: #595959;
}
.pro_box .pro_show .next {
  text-align: right;
}
.pro_box .pro_show .frame {
  margin-top: 30px;
}
.pro_box .pro_show .frame .titi {
  background-color: #ededed;
  height: 60px;
}
.pro_box .pro_show .frame .titi h3 {
  color: #000;
  font-size: 18px;
  line-height: 60px;
  font-weight: bold;
  padding: 0 15px;
}
.pro_box .pro_show .frame .box {
  padding: 20px;
  border: 1px solid #f0f0f0;
  border-radius: 4px;
}
.pro_box .pro_show .pro_relevant li {
  width: 100%;
  position: relative;
}
.pro_box .pro_show .pro_relevant li .img {
  position: relative;
  width: 100%;
  padding-bottom: 100%;
  overflow: hidden;
}
.pro_box .pro_show .pro_relevant li .img img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(1);
  width: 100%;
  height: auto;
  transition: all .5s ease;
}
.pro_box .pro_show .pro_relevant li h3 {
  color: #333;
  font-size: 15px;
  line-height: 3;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  transition: all .5s ease;
}
.pro_box .pro_show .pro_relevant li:hover .img img {
  transform: translate(-50%, -50%) scale(1.1);
}
.pro_box .pro_show .pro_relevant li:hover h3 {
  color: #ffab00;
}
.pro_box .pro_show .swiper-pagination {
  position: relative;
  bottom: auto;
}
@media only screen and (max-width: 1400px) {
  .pro_box .gallery {
    width: 350px;
  }
}
@media only screen and (max-width: 1200px) {
  .pro_box .gallery {
    width: 300px;
  }
}
@media only screen and (max-width: 1080px) {
  .pro_box .gallery {
    float: none;
    width: 100%;
  }
  .pro_box .info {
    float: none;
    width: 100%;
    padding: 0;
    padding-top: 40px;
  }
}
@media only screen and (max-width: 1024px) {
  .pro_box {
    padding: 2rem 0;
  }
  .pro_box > main {
    display: block;
  }
  .pro_box .pro_fl, .pro_box .pro_fr {
    width: 100%;
    margin: 0;
  }
  .pro_box .pro_class .tit {
    font-size: 20px;
    font-weight: normal;
    line-height: 24px;
    padding: 15px 20px;
    position: relative;
    background: #ffab00;
  }
  .pro_box .pro_class .tit .btn {
    display: block;
  }
  .pro_box .pro_class .class, .pro_box .pro_lx {
    display: none;
    padding: 0 15px;
    border-bottom: 1px solid #f0f0f0;
  }
  .pro_box .list_box .intro {
    padding: 15px;
    margin: 0;
  }
  .pro_box .list_box .list li {
    width: calc(100% / 2);
    padding: 5px;
  }
  .pro_box .list_box .list li .showBox span {
    font-size: 12px;
  }
  .pro_box .list_box .list li .tit {
    padding: 10px 5px;
  }
  .pro_box .list_box .list li .tit h3 {
    font-size: 13px;
  }
  .pro_box .gallery .thumbs {
    display: none;
  }
  .pro_box .info {
    padding: 0;
  }
  .pro_box .info .box {
    margin-bottom: 15px;
  }
  .pro_box .info .box h3 {
    font-size: 20px;
    font-weight: bold;
    padding: 10px 0px;
  }
  .pro_box .info .txt {
    padding-top: 0;
  }
  .pro_box .info .btn a {
    width: 170px;
    line-height: 3;
  }
  .pro_box .pro_show .tit {
    font-size: 20px;
    line-height: 50px;
    height: 50px;
  }
  .pro_box .pro_show .content p {
    font-size: 14px;
    line-height: 24px;
  }
  .pro_box .pro_show .content {
    padding: 10px 0px;
  }
  .pro_box .pro_show .key {
    padding: 10px 0px;
  }
  .pro_box .pro_show .key button {
    font-size: 12px;
    padding: 5px 3px;
  }
  .pro_box .pro_show .reLink {
    padding: 0;
    background: rgba(0, 0, 0, 0.02);
  }
  .pro_box .pro_show .prev, .pro_box .pro_show .next {
    padding: 10px 0;
    text-align: center;
  }
  .pro_box .pro_show .prev a, .pro_box .pro_show .next a {
    display: block;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }
  .pro_box .pro_show .next {
    text-align: center;
    border-left: 1px solid rgba(0, 0, 0, 0.04);
  }
  .pro_box .pro_show .frame {
    margin-top: 20px;
  }
  .pro_box .pro_show .frame .box {
    padding: 10px;
  }
  .pro_box .pro_show .pro_relevant li h3 {
    font-size: 14px;
    line-height: 2;
  }
}
/*右侧悬浮*/
.right_bar {
  position: fixed;
  top: 300px;
  right: 0;
  width: 50px;
  height: 203px;
  z-index: 10;
  display: none;
}
.right_bar li {
  width: 62px;
  height: 50px;
  z-index: 20;
}
.right_bar li.rtbar_li1, .right_bar li.rtbar_li4 {
  position: absolute;
  left: 0;
}
.right_bar li.rtbar_li1 {
  top: 0;
  width: 172px;
}
.right_bar li.rtbar_li2 {
  position: absolute;
  top: 51px;
  left: 0;
}
.right_bar li.rtbar_li3 {
  position: absolute;
  top: 102px;
  left: 0;
  width: 126px;
}
.right_bar li.rtbar_li4 {
  top: 153px;
}
.rtbar_li4 {
  position: absolute;
  top: 153px;
  left: 0;
}
.right_bar li a {
  display: block;
  color: #FFF;
  font-size: 14px;
  height: 50px;
  line-height: 50px;
  overflow: hidden;
  background-color: #007d93;
  opacity: 0.8;
  border-radius: 6px;
}
.right_bar li a img {
  display: block;
  float: left;
  vertical-align: middle;
  width: 24px;
  height: 24px;
  margin: 12px 12px 14px 14px;
}
.right_bar li a:hover {
  background-color: #ffab00;
  opacity: 1;
}
.rtbar_shwx {
  display: none;
  position: absolute;
  top: -120px;
  left: -160px;
}
.rtbar_shwx img {
  width: 150px;
  padding: 5px;
  background-color: #FFF;
}
.rtbar_shwx {
  top: -50px;
}
/*增加 1st 20251115*/
.pc_header .toparea {
  max-width: 90%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin: auto
}
.pc_header .toparea a {
  color: #666
}
.pc_header .toparea a:hover {
  color: #ffab00
}
.pc_header .recruit {
  background: url(../images/handbag.png) center left no-repeat;
  background-size: 15px;
  padding-left: 22px;
  padding-right: 10px;
  font-size: 0.75rem;
}
@media only screen and (max-width: 1024px) {
.pc_header .toparea {
  display: none;
}
  }
.pc_header .pcnav {
  display: none;
}
@media only screen and (max-width: 1024px) {
.pc_header .pcnav {
  display: block;
}
  }
.pc_header .hottel{padding-left: 10px; color: #333; font-size: 1rem; font-weight: 700}
.pc_header .hottel .phone{padding-right: 6px;color: #666; font-size: 0.875rem;font-weight:normal}

.in_guanyu {
  margin: 5rem 0;
}
.in_guanyu .tit {
  display: flex;
  align-items: center;
}
.in_guanyu .in_tit {
  width: 75.24%;
}
.in_guanyu .more {
  width: 24.759999999999998%;
}
.in_guanyu .in_more {
  margin-left: auto;
}
.in_guanyu .contup{
  display: flex;
  flex-wrap: wrap;
}
.in_guanyu .contup .infoarea, .in_guanyu .contup .videoarea{
   width: 48%;
}
.in_guanyu .contup .infoarea{
   margin-right: 4%;
   font-size: 1rem;
   line-height: 1.8rem
}
.in_guanyu .contdown{
  margin-top: 3rem
}
.in_guanyu .contdown ul{
  display: flex;
  flex-wrap: wrap;
}
.in_guanyu .contdown ul li{
  width: calc(100% / 4 - 1px);
  border-right: 1px solid #ccc;
  text-align: center
}
.in_guanyu .contdown ul li:nth-child(4n) {
  border-right: 0px solid #ccc;
}
.in_guanyu .contdown .guanyucounter{
font-size: 2.75rem;
font-weight: bold;
color: #007d93
}
.in_guanyu .contdown .guanyucounter sub{
vertical-align: top;
}
.in_guanyu .contdown .guanyucounter .unit{
   font-size: 0.875rem;
   color: #999
}
.in_guanyu .contdown h4{
font-size: 1.25rem;
font-weight: bold;
color: #333
}
@media only screen and (max-width: 1024px) {
.in_guanyu .contup{
  flex-basis: 100%;
}
.in_guanyu .contup .infoarea, .in_guanyu .contup .videoarea{
   width: 100%;
}
.in_guanyu .contup .infoarea{
   margin-right: 0;
}
.in_guanyu .contup .videoarea{
   margin-top: 20px;
}
.in_guanyu .contdown .guanyucounter{
font-size: 2rem;
}
.in_guanyu .contdown h4{
font-size: 1rem;
}
}
@media only screen and (max-width: 768px) {
.in_guanyu .contdown ul li{
  width: calc(100% / 2 - 1px);
  margin: 10px 0
}
.in_guanyu .contdown ul li:nth-child(2n) {
  border-right: 0px solid #ccc;
}
}

.in_plan {
  padding: 5rem 0;
  background: #f5f5f5
/*  background: url(../images/xy_pro_bg.jpg) no-repeat center center;
  background-attachment: fixed;
  background-size: cover;*/
}
.in_plan .tit {
  display: flex;
  align-items: center;
}
.in_plan .in_tit {
  width: 75.24%;
}
.in_plan .more {
  width: 24.759999999999998%;
}
.in_plan .in_more {
  margin-left: auto;
}
.in_plan ul{
  display: flex;
  flex-wrap: wrap;
}
.in_plan ul li{
  width: calc(100% / 5 - 44px);
  margin-right: 30px;
  background: #fff;
  padding: 10px
}
.in_plan ul li:nth-child(5n) {
  margin-right: 0;
}
.in_plan .p_area img {
  width: 100%;
  height: auto;
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease;
}
.in_plan .p_area img:hover {
  transform: translate(0%, 0%) scale(1.02);
}
.in_plan .p_area .p_title{
  font-size: 2.5rem;
  color: #007d93;
  margin-top: 20px;
}
.in_plan .p_area h3{
  font-size: 1.25rem;
  color: #111;
  margin-top: 6px;
}
.in_plan .p_area p{
  font-size: 1rem;
  color: #666;
  margin-top: 6px;
}
.in_plan .p_area .p_more{
  padding: 10px 0;
  text-align: right
}
.in_plan .p_area .p_more img{
  width: 32px;
  height: 8px
}
@media only screen and (max-width: 1366px) {
.in_plan ul li{
  width: calc(100% / 3 - 40px);
  margin-right: 30px;
  margin-bottom: 30px
}
.in_plan ul li:nth-child(3n) {
  margin-right: 0;
}
}
@media only screen and (max-width: 1024px) {
.in_plan {
  padding: 3.5rem 0;
}
.in_plan ul li{
  width: calc(100% / 2 - 35px);
  margin-right: 30px;
}
.in_plan ul li:nth-child(2n) {
  margin-right: 0;
}
.in_plan ul li:nth-child(3n) {
  margin-right: 30px;
}
}
@media only screen and (max-width: 768px) {
.in_plan {
  padding: 2rem 0;
}
.in_plan ul{
  flex-basis: 100%; 
}
.in_plan ul li{
  width: 100%;
  margin-right: 0;
  margin-bottom: 30px
}
.in_plan ul li:nth-child(3n) {
  margin-right: 0;
}
}
@media only screen and (max-width: 576px) {
}
@media only screen and (max-width: 414px) {
.in_plan {
  padding: 1.25rem 0;
}
}

.in_service {
  padding: 5rem 0;
/*  background: url(../images/xy_pro_bg.jpg) no-repeat center center;
  background-attachment: fixed;
  background-size: cover;*/
}
.in_service .tit {
  display: flex;
  align-items: center;
}
.in_service .in_tit {
  width: 75.24%;
}
.in_service .more {
  width: 24.759999999999998%;
}
.in_service .in_more {
  margin-left: auto;
}
.in_service .cont {}
.in_service .cont img {
  width: 100%;
  height: auto;
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease;
}
.in_service .cont img:hover {
  transform: translate(0%, 0%) scale(1.02);
}
@media only screen and (max-width: 1024px) {
.in_service {
  padding: 3.5rem 0;
}
}
@media only screen and (max-width: 768px) {
.in_service {
  padding: 2rem 0;
}
}
@media only screen and (max-width: 414px) {
.in_service {
  padding: 1.25rem 0;
}
}

.aboutarea {
  margin: 2rem 0;
  width: 100%
}
.aboutarea img {
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease
}
.aboutarea img:hover {
  transform: translate(0%, 0%) scale(1.02);
}
.aboutarea h3{
  font-size: 1.375rem;
  font-weight: bold
}
.aboutarea .h3line {
  display: block;
  max-width: 84px;
  height: 3px;
  margin: 9px 0;
  background: #007d93;
}
.aboutarea .contentarea {
  font-size: 1rem;
  line-height: 1.8rem
}
.aboutarea .contentarea p {
  padding: 10px 0
}
.aboutarea .contentarea img {
  width: 100%;
  height: auto
}
@media only screen and (max-width: 1024px) {
}
@media only screen and (max-width: 768px) {
}
@media only screen and (max-width: 414px) {
}

.wenhuaarea img, .huobanarea img{
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease
}
.wenhuaarea img:hover, .huobanarea img:hover {
  transform: translate(0%, 0%) scale(1.05);
}
.wenhuaarea{
  padding: 3rem 0;
  width: 100%;
  background: #f5f5f5
}
.wenhuaarea h3{
  font-size: 1.375rem;
  font-weight: bold
}
.wenhuaarea .h3line {
  display: block;
  max-width: 84px;
  height: 3px;
  margin: 9px 0;
  background: #007d93;
}
.wenhuaarea ul{
  margin-top: 30px;
  display: flex;
  flex-wrap: wrap;
}
.wenhuaarea ul li {
  width: calc(100% / 2 - 75px);
  margin: 0 30px 30px 0;
  padding: 30px;
  aspect-ratio: 1 / 0.15;/*宽高比*/
  background: #fff;
  display: flex;
  flex-wrap: wrap;
}
.wenhuaarea ul li:nth-child(2n) {
  margin-right: 0;
}
.wenhuaarea .list_l{
width: 11%;
margin-right: 4%;
}
.wenhuaarea .list_l img{
width: 100%;
height: auto;
}
.wenhuaarea .list_r{
width: 85%
}
.wenhuaarea .list_r .list_title{
font-size: 1.25rem;
font-weight: bold;
color: #007d93
}
.wenhuaarea .list_r .list_info{
padding-top: 10px;
font-size: 0.875rem;
color: #333
}
@media only screen and (max-width: 1024px) {
.wenhuaarea .list_l{
width: 13%;
}
.wenhuaarea .list_r{
width: 83%
}
}
@media only screen and (max-width: 768px) {
.wenhuaarea{
  padding: 2rem 0;
}
.wenhuaarea ul li {
  width: calc(100% / 2 - 50px);
  margin: 0 20px 20px 0;
  padding: 20px;
}
.wenhuaarea .list_l{
width: 16%;
}
.wenhuaarea .list_r{
width: 80%
}
}
@media only screen and (max-width: 576px) {
.wenhuaarea ul li {
flex-basis: 100%;
margin: 0 0 20px 0;
}
.wenhuaarea .list_l{
width: 12%;
}
.wenhuaarea .list_r{
width: 84%
}
}

.lichengarea{
  padding: 3rem 0;
  width: 100%;
  background: #fff
}
.lichengarea h3{
  font-size: 1.375rem;
  font-weight: bold
}
.lichengarea .h3line {
  display: block;
  max-width: 84px;
  height: 3px;
  margin: 9px 0;
  background: #007d93;
}
.lichengarea .lichengimg{
  margin: 2rem 0
}
.lichengarea .lichengimg img{
  width: 100%;
  height: auto
}
.lichengarea .lichengimg img {
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease;
}
.lichengarea .lichengimg img:hover {
  transform: translate(0%, 0%) scale(1.01);
}
.lichengarea .lichengimg .imgpc{
  display:block
}
.lichengarea .lichengimg .imgmobile{
  display:none
}

@media only screen and (max-width: 768px) {
.lichengarea{
  padding: 2rem 0;
}
.lichengarea .lichengcounter{
font-size: 2.25rem;
}
.lichengarea h4{
font-size: 1rem;
}
.lichengarea .lichengimg .imgpc{
  display:none
}
.lichengarea .lichengimg .imgmobile{
  display:block
}
}


.huobanarea{
  padding: 3rem 0;
  width: 100%;
  background: #dbe6fc
}
.huobanarea h3{
  font-size: 1.375rem;
  font-weight: bold
}
.huobanarea .h3line {
  display: block;
  max-width: 84px;
  height: 3px;
  margin: 9px 0;
  background: #007d93;
}
.huobanarea ul{
  margin-top: 30px;
  display: flex;
  flex-wrap: wrap;
}
.huobanarea ul li {
  width: calc(100% / 6 - 25px);
  margin: 0 30px 30px 0;
}
.huobanarea ul li:nth-child(6n) {
  margin-right: 0;
}
.huobanarea ul li img {
  width: 100%;
  height: auto;
  border-radius: 10px;
}
@media only screen and (max-width: 768px) {
.huobanarea{
  padding: 2rem 0;
}
.huobanarea ul li {
  width: calc(100% / 5 - 16px);
  margin: 0 20px 20px 0;
}
.huobanarea ul li:nth-child(5n) {
  margin-right: 0;
}
.huobanarea ul li:nth-child(6n) {
  margin-right: 20px;
}
.huobanarea ul li:nth-child(30n) {
  margin-right: 0;
}
}
@media only screen and (max-width: 576px) {
.huobanarea ul li {
  width: calc(100% / 4 - 15px);
  margin: 0 20px 20px 0;
}
.huobanarea ul li:nth-child(4n) {
  margin-right: 0;
}
.huobanarea ul li:nth-child(5n), .huobanarea ul li:nth-child(6n) {
  margin-right: 20px;
}
.huobanarea ul li:nth-child(12n), .huobanarea ul li:nth-child(20n) {
  margin-right: 0;
}
}
@media only screen and (max-width: 414px) {
.huobanarea ul li {
  width: calc(100% / 3 - 14.33px);
  margin: 0 20px 20px 0;
}
.huobanarea ul li:nth-child(3n) {
  margin-right: 0;
}
.huobanarea ul li:nth-child(4n), .huobanarea ul li:nth-child(5n) {
  margin-right: 20px;
}
.huobanarea ul li:nth-child(6n), .huobanarea ul li:nth-child(15n) {
 margin-right: 0;
}
}
.rongyuarea{
  padding: 3rem 0;
  width: 100%;
  background: #f5f5f5
}
.rongyuarea h3{
  font-size: 1.375rem;
  font-weight: bold
}
.rongyuarea .h3line {
  display: block;
  max-width: 84px;
  height: 3px;
  margin: 9px 0;
  background: #007d93;
}
.rongyuarea ul{
  margin-top: 30px;
  padding: 0 20%;
  display: flex;
  flex-wrap: wrap;
}
.rongyuarea ul li {
  width: calc(100% / 3 - 25px);
  margin: 0 30px 30px 0;
  text-align: center;
  border-right: 1px solid #007d93
}
.rongyuarea ul li:nth-child(3n) {
  margin-right: 0;
  border-right: 0px solid #007d93
}
.rongyuarea .rongyucounter{
font-size: 3.375rem;
font-weight: bold;
color: #007d93
}
.rongyuarea .rongyucounter sub{
vertical-align: top;
}
.rongyuarea h4{
font-size: 1.25rem;
font-weight: bold;
color: #333
}
.rongyuarea .rongyuimg{
}
.rongyuarea .rongyuimg img{
width:100%;
height:auto
}
.rongyuarea img {
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease;
}
.rongyuarea img:hover {
  transform: translate(0%, 0%) scale(1.01);
}
.rongyuarea .rongyuimg .imgpc{
  display:block
}
.rongyuarea .rongyuimg .imgmobile{
  display:none
}
@media only screen and (max-width: 1024px) {
.rongyuarea ul{
  padding: 0 10%;
}
.rongyuarea .rongyucounter{
font-size: 3rem;
}
}
@media only screen and (max-width: 768px) {
.rongyuarea{
  padding: 2rem 0;
}
.rongyuarea .rongyucounter{
font-size: 2.25rem;
}
.rongyuarea h4{
font-size: 1rem;
}
.rongyuarea .rongyuimg .imgpc{
  display:none
}
.rongyuarea .rongyuimg .imgmobile{
  display:block
}
}
@media only screen and (max-width: 576px) {
.rongyuarea ul{
  padding: 0;
}
.rongyuarea .rongyucounter{
font-size: 2rem;
}
.rongyuarea h4{
font-size: 0.875rem;
}
}

.gongyiarea{
  padding: 3rem 0;
  width: 100%;
}
.gongyiarea h3{
  font-size: 1.375rem;
  font-weight: bold
}
.gongyiarea .h3line {
  display: block;
  max-width: 84px;
  height: 3px;
  margin: 9px 0;
  background: #007d93;
}
.gongyiarea .gongyiinfos{
  padding: 20px 0;
  font-size: 1rem;
  line-height: 1.8rem
}
.gongyiarea .gongyiinfos p{
  padding: 10px 0;
}
.gongyiarea .gongyiinfos img{
  width: 100%;
  height: auto
}
.gongyiarea .gongyiinfos img {
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease;
}
.gongyiarea .gongyiinfos img:hover {
  transform: translate(0%, 0%) scale(1.01);
}

.newslistarea {
  margin: 0;
  width: 100%
}
.imgtxtarea {}
.imgtxtarea li {
  display: flex;
  flex-wrap: wrap;
  margin: 3rem 0;
}
.imgtxtarea li .imgarea {
  width: 20%;
  margin-right: 3%
}
.imgtxtarea li .imgarea img {
  width: 100%;
  height: auto
}
.imgtxtarea li .imgarea img {
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease;
}
.imgtxtarea li .imgarea img:hover {
  transform: translate(0%, 0%) scale(1.02);
}
.imgtxtarea li .txtarea {
  width: 77%;
  font-size: 0.875rem;
  color: #666;
}
.imgtxtarea li .txtarea h3 {
  font-size: 1.125rem
}
.imgtxtarea li .txtarea h3 a {
  color: #111
}
.imgtxtarea li .txtarea h3 a:hover {
  color: #ffab00
}
.imgtxtarea li .txtarea .overview {
  line-height: 1.5rem;
  height: 70%;
  margin-top: 10px
}
@media only screen and (max-width: 1024px) {
.imgtxtarea li .imgarea {
  width: 35%;
}
.imgtxtarea li .txtarea {
  width: 62%;
}
}
@media only screen and (max-width: 768px) {
}
@media only screen and (max-width: 576px) {
.imgtxtarea li .imgarea {
  flex-basis: 100%;
}
.imgtxtarea li .txtarea {
  flex-basis: 100%;
}
}
.guestbookarea {
  margin: 2rem auto;
  width: 60%;
  font-size: 0.875rem;
  color: #666
}
.guestbookarea .tablearea {
  margin: 1rem 0
}
.guestbookarea .tablearea label {
  display: block;
  padding: 20px 0
}
.guestbookarea .tablearea h3 {
  font-size: 1.125rem;
  color: #111;
  font-weight: 700
}
.guestbookarea .tablearea h3 span {
  font-size: 0.875rem;
  color: #ffab00;
  font-weight: normal
}
.guestbookarea .tablearea li {
  padding: 5px 0
}
.guestbookarea .tablearea input[type="checkbox"] {
  margin-right: 5px
}
.lines {
  width: 100%;
  border-bottom: solid 1px #ccc
}
.guestbookarea .tablearea input[type="text"], .guestbookarea .tablearea textarea {
  color: #666;
  width: 65%;
  padding: 5px;
  border: 1px solid #C5E2FF;
  border-radius: 4px;
  background: #FBFBFB;
  outline: 0;
  -webkit-box-shadow: inset 0px 1px 6px #ECF3F5;
  box-shadow: inset 0px 1px 6px #ECF3F5;
  height: 30px;
  line-height: 15px;
  margin: 2px 4px 16px 0px;
}
.guestbookarea .tablearea textarea {
  height: 90px;
  padding: 10px 5px;
}
.guestbookarea .tablearea .button {
  width: 120px;
  /*padding: 10px;*/
  line-height: 40px;
  text-align: center;
  background: #007d93;
  border: solid 1px #007d93;
  border-radius: 4px;
  color: #fff;
  cursor: pointer
}
.guestbookarea .tablearea .button:hover {
  background: #ffab00;
  border: solid 1px #ffab00;
  border-radius: 4px;
  color: #222;
  transition: all .5s ease;
}
.guestbookarea .remarksarea {
  margin: 1rem 0
}
.guestbookarea .remarksarea p {
  padding: 5px 0
}
.guestbookarea .remarksarea .links {
  background: url(../images/links.png) center left no-repeat;
  background-size: 14px;
  padding-left: 20px;
  margin-left: 8px
}

.addressarea {
  margin: 2rem 0;
}
.addressarea ul {
  display: flex;
  flex-wrap: wrap;
}
.addressarea ul a {
  color: #666
}
.addressarea ul a:hover {
  color: #ffab00
}
.addressarea ul li {
  width: calc(100% / 2 - 40px);
  margin-right: 80px;
  border-bottom: solid 1px #ccc;
  padding: 30px 0
}
.addressarea ul li:nth-child(2n) {
  margin-right: 0;
}
.addressarea ul li img {
  width: 100%;
  height: auto
}
.addressarea img {
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease;
}
.addressarea img:hover {
  transform: translate(0%, 0%) scale(1.02);
}
.addressarea ul li h3 {
  margin-top: 20px;
  color: #111
}
.addressarea ul li p {
  margin-top: 10px;
  color: #666
}
.addressarea ul li .home {
  background: url(../images/home.png) center left no-repeat;
  background-size: 32px;
  padding-left: 32px;
  font-size: 1.125rem;
}
.addressarea ul li .addr {
  background: url(../images/addr.png) center left no-repeat;
  background-size: 32px;
  padding-left: 32px;
  font-size: 0.875rem;
}
.addressarea ul li .website {
  background: url(../images/website.png) center left no-repeat;
  background-size: 32px;
  padding-left: 32px;
  font-size: 0.875rem;
}
.addressarea ul li .tel {
  background: url(../images/tel.png) center left no-repeat;
  background-size: 32px;
  padding-left: 32px;
  font-size: 0.875rem;
}
.addressarea ul li .mail {
  background: url(../images/mail.png) center left no-repeat;
  background-size: 32px;
  padding-left: 32px;
  font-size: 0.875rem;
}
@media only screen and (max-width: 1024px) {

}
@media only screen and (max-width: 768px) {
.contentarea {
}
.contentarea .txtarea {
  flex-basis: 100%;
  font-size: 1.25rem;
  margin-right: 0
}
.contentarea .imgarea {
  flex-basis: 100%;
  margin-top: 20px;
}
.hotarea .imgpc{
  display: none
}
.hotarea .imgmobile{
  display: block
}
.addressarea ul li {
  flex-basis: 100%;
  margin-right: 0;
  border-bottom: solid 1px #ccc;
  padding: 30px 0
}
}
@media only screen and (max-width: 414px) {
}

.down_box {
  padding: 4rem 0;
}
.down_box > main {
  display: flex;
}
.down_box .down_fl {
  width: 300px;
  background: #fff;
}
.down_box .down_class {
  
}
.down_box .down_class .tit {
  position: relative;
  color: #111;
  font-size: 2.25rem;
  font-weight: bold;
  line-height: 80px;
}
.down_box .down_class .btn {
  position: absolute;
  top: 10px;
  right: 15px;
  padding: 9px 5px;
  border: 1px solid #007d93;
  border-radius: 4px;
  box-sizing: border-box;
  display: none;
}
.down_box .down_class .btn span {
  display: block;
  width: 22px;
  height: 2px;
  background: #007d93;
  border-radius: 1px;
}
.down_box .down_class .btn span + span {
  margin-top: 4px;
}
.down_box .down_class .line {
  display: block;
  max-width: 130px;
  height: 3px;
  margin: 0 0 20px;
  background: #007d93;
}
.down_box .down_class .class {
  padding: 15px 15px 15px 0;
}
.down_box .down_class .class .title-box {
  position: relative;
  padding-left: 0px;
  line-height: 40px;
}
.title-box .down-arrow:before {
  position: absolute;
  display: block;
  content: "";
  top: 50%;
  /*left: 0;*/
  right: 0;
  width: 6px;
  height: 6px;
  margin-top: -8px;
  border-top: 2px solid #545859;
  border-right: 2px solid #545859;
  transition: all .2s cubic-bezier(.4, 0, .2, 1) .2s;
  transform: rotate(135deg) translateY(-50%)
}
.down_box .down_class .class .title-box a {
  display: block;
  color: #333;
  transition: all .5s ease;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.down_box .down_class .class .title-box a:hover {
  color: #ffab00;
}
.down_box .down_class .class .title-box a.cur {
  color: #007d93;
}
.down_box .down_class .class .title-box .titleA {
  font-size: 1.125rem;
  font-weight: bold;
}
.down_box .down_class .class .title-box .titleB {
  font-size: 0.875rem;
}
.down_box .down_class .class ul {
  padding-left: 0px;
}
.down_box .down_fr {
  width: calc(100% - 0);
  margin: 0;
  background: #fff;
}
.down_box .list_box {
  padding-bottom: 30px;
}
.down_box .list_box .title {
  color: #333;
  font-size: 28px;
  line-height: 60px;
  text-align: center;
  border-bottom: 1px solid #f0f0f0;
}
.down_box .list_box .intro {
  padding: 0 0 20px;
  margin: 0 0 30px;
  border-bottom: 1px solid #e8e8e8;
}
.down_box .list_box .intro p {
  color: rgba(0, 0, 0, 0.45);
  font-size: 14px;
  line-height: 1.8;
  text-align: center;
  margin: 20px 15px;
  vertical-align: top;
  word-break: break-all;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}
.down_box .list_box .list {
  display: flex;
  flex-wrap: wrap;
}
.down_box .list_box .list li {
  width: calc(100% / 2 - 10px);
  margin: 0 20px 20px 0;
  padding: 20px;
  box-sizing: border-box;
  background: #e5e5e5;
  display: flex;
  flex-wrap: wrap;
}
.down_box .list_box .list li:nth-child(2n) {
  margin-right: 0;
}
.down_box .list_box .list li .imgarea {
  width: 40%;
}
.down_box .list_box .list li .imgarea img {
  width: 100%;
  height: auto
}
.down_box img {
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease;
}
.down_box img:hover {
  transform: translate(0%, 0%) scale(1.02);
}
.down_box .list_box .list li .txtarea {
  width: 55%;
  padding-left: 4%
}
.down_box .list_box .list li .txtarea h3 {
  font-size: 1.125rem;
  height: 15%
}
.down_box .list_box .list li .txtarea p {
  font-size: 0.875rem;
  line-height: 1.5em;
  color: #666;
  height: 35%
}
.down_box .list_box .list li .txtarea .links {
  height: 48%;
  position: relative
}
.down_box .list_box .list li .txtarea .links .downbutton {
  position: absolute;
  left: 0;
  bottom: 0;
}
.down_box .list_box .list li .txtarea .links .downs {
  background: url(../images/download.png) center left no-repeat;
  background-size: 24px;
  padding-left: 24px;
  font-size: 0.875rem;
}
.down_box .list_box .list li .txtarea .links .downbutton a {
  background: #007d93;
  border-radius: 4px;
  padding: 6px 10px;
  color: #fff;
}
.down_box .list_box .list li .txtarea .links .downbutton a:hover {
  background: #ffab00;
}
.down_box .list_box .list li .txtarea .links .erweima {
  position: absolute;
  right: 0;
  bottom: 0;
}
.down_box .list_box .list li .txtarea .links .erweima img {
  width: 72px;
  height: 72px;
}
@media only screen and (max-width: 1024px) {
  .down_box {
    padding: 2rem 0;
  }
  .down_box > main {
    display: block;
  }
  .down_box .down_fl, .down_box .down_fr {
    width: 100%;
    margin: 0;
  }
  .down_box .down_class .tit {
    font-size: 1.5rem;
    font-weight: normal;
    line-height: 24px;
    padding: 15px 20px;
    position: relative;
  }
  .down_box .down_class .btn {
    display: block;
  }
.down_box .down_class .line {
  display: block;
  max-width: 100%;
  height: 3px;
  margin: 10px 0 0;
  background: #007d93;
}
  .down_box .down_class .class {
    display: none;
    padding: 0 15px;
    border-bottom: 1px solid #f0f0f0;
  }
  .down_box .down_class ul ul li{
  float: left;
  padding: 0 10px;
}
}
@media only screen and (max-width: 768px) {
.down_box .list_box .list li {
  flex-basis: 100%;
  margin: 0 0 20px;
  padding: 20px;
  box-sizing: border-box;
  background: #e5e5e5;
  display: flex;
  flex-wrap: wrap;
}
}

.servicearea {
  padding: 4rem 0;
}
.servicearea > main {
}
.servicearea .servicelists ul {
  display: flex;
  flex-wrap: wrap;
}
.servicearea .servicelists ul li {
  width: calc(100% / 4 - 15px);
  margin: 0 20px 20px 0;
  padding: 25px;
  box-sizing: border-box;
  border-radius: 4px;
  color: #fff;
  text-align: center;
  /*cursor: pointer;*/
  aspect-ratio: 1 / 1.7;/*宽高比*/
  background: #007d93
}
.servicearea .servicelists ul li:hover {
  background: #ffab00;
  transition: all .5s ease;
}
.servicearea .servicelists ul li:nth-child(4n) {
  margin-right: 0;
}
.servicearea .servicelists ul li img{
padding-top: 20%;
width: 100%;
height: auto
}
.servicearea img {
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease;
}
.servicearea img:hover {
  transform: translate(0%, 0%) scale(1.02);
}
.servicearea .servicelists ul li h3{
font-size: 2.5vw;
padding: 10% 0;
line-height: 1.5em
}
.servicearea .servicelists ul li h3 a{
color: #fff
}
.servicearea .servicelists ul li h3 a:hover{
color: #e5e5e5
}
.servicearea .servicelists ul li .overview{
font-size: 1rem;
color: #e5e5e5;
line-height: 1.5em;
white-space: normal
}
/*.servicearea .servicelists ul li .box_l{
width: 65%;
padding-right: 2%
}
.servicearea .servicelists ul li .box_l h3{
font-size: 1.25rem;
line-height: 40px
}
.servicearea .servicelists ul li .box_l h3 a{
color: #007d93
}
.servicearea .servicelists ul li .box_l h3 a:hover{
color: #ffab00
}
.servicearea .servicelists ul li .box_l .overview{
font-size: 0.875rem;
color: #333;
line-height: 1.5em;
white-space: normal
}
.servicearea .servicelists ul li .box_r{
width: 33%;
text-align: right;
}
.servicearea .servicelists ul li .box_r img{
width: 100%;
height: auto
}*/
@media only screen and (max-width: 768px) {
.servicearea {
  padding: 2rem 0;
}
.servicearea .servicelists ul li {
  width: calc(100% / 2 - 10px);
  margin: 0 20px 20px 0;
  padding: 20px;
}
.servicearea .servicelists ul li:nth-child(2n) {
  margin-right: 0;
}
.servicearea .servicelists ul li h3{
font-size: 5.625vw;
padding: 10% 0;
line-height: 1.5em
}

.guestbookarea {
  margin: 2rem auto;
  width: 95%;
}
.guestbookarea .tablearea label {
  padding: 10px 0
}
.guestbookarea .tablearea input[type="text"], .guestbookarea .tablearea textarea {
  width: 95%;
  height: 24px;
}

}

.planarea {
  padding: 4rem 0;
}
.planarea .planlists{}
.planarea .planlists li{
padding: 30px 0;
}
.planarea .planlists li:nth-child(odd) {
    background-color: #fff;
}
.planarea .planlists li:nth-child(even) {
    background-color: #f5f6fb;
}
.planarea .planlists li h3{
text-align: center;
font-size: 1.5rem;
font-weight: 700
}
.planarea .planlists li .lines{
  border-top: 3px solid #007d93;
  margin: 10px auto;
  width: 50px;
  height: 1px;
  display: block
}
.planarea .planlists .infoarea{
font-size: 1rem;
line-height: 1.8rem
}
.planarea .planlists .infoarea p{
padding: 10px 0
}
.planarea .planlists .infoarea img{
width: 90%;
height: auto;
transform: translate(0%, 0%) scale(1);
transition: all .5s ease
}
.planarea .planlists .infoarea img:hover {
transform: translate(0%, 0%) scale(1.02);
}
.planarea .planlists .morearea{
margin: 0 auto;
padding: 20px 0;
width: 120px
}
.planarea .planlists .morearea a {
  display: block;
  width: 120px;
  line-height: 40px;
  text-align: center;
  background: #007d93;
  border: solid 1px #007d93;
  border-radius: 4px;
  color: #fff;
  cursor: pointer
}
.planarea .planlists .morearea a:hover {
  background: #ffab00;
  border: solid 1px #ffab00;
  border-radius: 4px;
  color: #222;
  transition: all .5s ease;
}
.planarea .planlists1 ul {
  display: flex;
  flex-wrap: wrap;
}
.planarea .planlists1 ul li {
  width: calc(100% / 3 - 20px);
  margin: 0 30px 30px 0;
  padding: 0px;
  box-sizing: border-box; 
  border: solid 1px #ccc;
  border-radius: 4px;
}
.planarea .planlists1 ul li:nth-child(3n) {
  margin-right: 0;
}
.planarea .planlists2 ul {
  display: flex;
  flex-wrap: wrap;
}
.planarea .planlists2 ul li {
  width: calc(100% / 2 - 20px);
  margin: 0 39px 0 0;
  padding: 0px;
  box-sizing: border-box; 
  border: solid 1px #ccc;
  border-radius: 4px;
}
.planarea .planlists2 ul li:nth-child(2n) {
  margin-right: 0;
}
.planarea .imgarea{}
.planarea .imgarea img{
width: 100%;
height: auto;
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease
}
.planarea .imgarea img:hover {
  transform: translate(0%, 0%) scale(1.02);
}
.planarea .titlearea{
line-height: 52px;
padding: 0 10px;
  display: flex;
  flex-wrap: wrap;
}
.planarea .titlearea:hover{
background: #ffab00;
transition: all .5s ease;
}
.planarea .titlearea h3{
width: 65%;
font-size: 1.25rem;
color: #111;
font-weight: 700
}
.planarea .titlearea:hover h3{
color: #fff;
}
.planarea .titlearea .links{
width: 30%;
}
.planarea .titlearea .links a{
color: #007d93
}
.planarea .titlearea:hover .links a{
color: #fff
}
.planarea .titlearea:hover .links a:hover{
color: #111
}
@media only screen and (max-width: 768px) {
.planarea .planlists1 ul li {
  flex-basis: 100%;
  margin: 0 0 30px 0;
}
.planarea .planlists2 ul li {
  flex-basis: 100%;
  margin: 0 0 30px 0;
}
.planarea .planlists2 ul li:nth-child(2n) {
  margin-bottom: 0;
}
}

.planarea {
  margin: 2rem 0;
  width: 100%
}
.planarea img{
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease
}
.planarea img:hover {
  transform: translate(0%, 0%) scale(1.02);
}
.planarea .contentarea {
  margin: 1rem 0;
  display: flex;
  flex-wrap: wrap;
}
.planarea .contentarea .txtarea {
  width: 38%;
  font-size: 1.125rem;
  color: #111;
  line-height: 1.8em;
  margin-right: 4%
}
.planarea .contentarea .txtarea .links a {
  width: 120px;
  margin-top: 20px;
  display: block;
  line-height: 40px;
  text-align: center;
  background: #007d93;
  border: solid 1px #007d93;
  border-radius: 4px;
  color: #fff;
  cursor: pointer
}
.planarea .contentarea .txtarea .links a:hover {
  background: #ffab00;
  border: solid 1px #ffab00;
  border-radius: 4px;
  color: #222;
  transition: all .5s ease;
}
.planarea .contentarea .imgarea {
  width: 58%
}
.planarea .contentarea .imgarea img {
  width: 100%;
  height: auto
}
.planarea .hotarea {
  margin: 2rem 0;
}
.planarea .hotarea img {
  width: 100%;
  height: auto
}
.planarea .hotarea .imgpc {
  display: block
}
.planarea .hotarea .imgmobile {
  display: none
}
@media only screen and (max-width: 768px) {
.planarea {
  margin: 0;
  padding: 30px 0;
}
.planarea .contentarea {
  margin: 0;
}
.planarea .contentarea .txtarea {
  padding-bottom: 20px
}
.planarea .contentarea .txtarea {
  flex-basis: 100%;
  font-size: 1.25rem
}
.planarea .contentarea .imgarea {
  flex-basis: 100%
}

.planarea .hotarea .imgpc {
  display: none
}
.planarea .hotarea .imgmobile {
  display: block
}
}

.contactarea {
  padding: 4rem 0;
}
.contactarea > main {
}
.contactarea .contactcontent{

}

.otherarea {
  padding: 4rem 0;
}
.otherarea > main {
}
.otherarea .othercontent{

}

.case_box {
  padding: 4rem 0;
}
.case_box img{
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease
}
.case_box img:hover {
  transform: translate(0%, 0%) scale(1.02);
}
.case_box > main {
}

.filterarea{
padding: 30px;
margin: 0 0 2rem 0;
background: #f5f5f5;
font-size: 0.875rem;
border-bottom: solid 1px #007d93
}
.filterarea h2{
color: #007d93;
  font-size: 2.25rem;
  font-weight: bold;
  line-height: 50px;
}
/*.filterarea .titleline {
  display: block;
  max-width: 140px;
  height: 3px;
  margin: 9px 0;
  background: #007d93;
}*/
.filterarea p{
margin-top: 2rem;
color: #111;
  font-size: 1.375rem;
  font-weight: bold;
  line-height: 50px;
}
.filterarea .filter-box{
padding: 0 6%;
}
.filterarea .filter-box h3 {
  padding: 6px 0;
}
.filterarea .filter-box h3 a{
cursor:pointer;
color: #333;
  font-size: 1.125rem;
  font-weight: bold;
  padding: 5px 15px;
  background: #f5f5f5;
  border: solid 1px #f5f5f5;
  border-radius: 4px;
}
.filterarea .filter-box h3 a:hover{
color: #fff;
  background: #ffab00;
  border: solid 1px #ffab00;
  border-radius: 4px;
}
.filterarea .filter-box h3 .active{
color: #fff;
  background: #007d93;
  border: solid 1px #007d93;
  border-radius: 4px;
}
.filterarea .filter-box h4 {
  padding: 6px 0;
}
.filterarea .filter-box h4 a{
cursor:pointer;
color: #333;
  font-size: 1.125rem;
  font-weight: bold;
  padding: 5px 15px;
  background: #f5f5f5;
  border: solid 1px #f5f5f5;
  border-radius: 4px;
}
.filterarea .filter-box ul{}
.filterarea .filter-box ul li{
margin:0;
float:left;
width:auto;
padding: 6px 0;
}
.filterarea .filter-box ul li a{
cursor:pointer;
color:#666;
  padding: 5px 15px;
  background: #f5f5f5;
  border: solid 1px #f5f5f5;
  border-radius: 4px; 
transition:.3s;-moz-transition:.3s;-webkit-transition:.3s;
}
.filterarea .filter-box ul li a:hover{
color: #fff;
background: #ffab00;
border: solid 1px #ffab00;
border-radius: 4px;
}
.filterarea .filter-box ul li a.active{
color:#fff;
background:#007d93;
border: solid 1px #007d93;
border-radius: 4px;
}
.clearfix{clear:both}
.filterarea .selectarea{
color: #333;
  font-size: 1.125rem;
}
.filterarea .selectarea span{
  font-weight: bold;
  padding-right: 10px;
}
.filterarea .selectarea select{
  font-size: 1rem;
  padding: 5px 10px;
  border: solid 1px #d5d5d5;
  border-radius: 4px;
}
.filterarea .selectarea select option:hover {
  background-color: #ffab00; /* 设置选中背景色 */
  color: white; /* 设置选中文本颜色 */
}


.case_box .caselistarea ul {
  display: flex;
  flex-wrap: wrap;
}
.case_box .caselistarea ul li {
  width: calc(100% / 3 - 20px);
  margin: 0 30px 30px 0;
  border-radius: 10px;
  border: solid 0px #ccc;
  transition: all .5s ease;
  box-sizing: border-box;
  box-shadow: 0 3px 4px rgb(0 0 0 / 10%);
}
.case_box .caselistarea ul li:hover {
  box-shadow: 0 6px 8px rgb(0 0 0 / 20%);
}
.case_box .caselistarea ul li:nth-child(3n) {
  margin-right: 0;
}
.case_box .caselistarea ul li img{
width: 100%;
height: auto
}
.case_box .caselistarea ul li h3{
padding: 5px 10px;
font-size: 1.25rem;
color: #111;
}
.case_box .caselistarea ul li p{
padding: 5px 10px;
font-size: 0.875rem;
color: #666;
line-height: 1.5em
}
.case_box .caselistarea ul li .filter{
padding: 5px 10px;
line-height: 30px;
text-align: right
}
.case_box .caselistarea ul li .filter span{
padding: 2px 6px;
margin-left: 10px;
font-size: 0.75rem;
color: #007d93;
border: solid 1px #007d93;
border-radius: 10px
}

.case_box .casecontent {
  margin: 0;
}

.case_box .show_box {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  padding: 20px 0 30px;
  overflow: hidden;
}
.case_box .gallery {
  float: left;
  width: 600px;
}
.case_box .gallery .gallery-top .swiper-slide {
  cursor: pointer;
}
.case_box .gallery .gallery-top .swiper-slide .pic {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 100%;
}
.case_box .gallery .gallery-top .swiper-slide .pic img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
}
.case_box .gallery .thumbs {
  position: relative;
  margin-top: 20px;
  padding: 0 33px;
  overflow: hidden;
}
.case_box .gallery .gallery-thumbs .swiper-slide {
  width: calc(96.1% / 4);
  margin-right: 5px;
  border: .15rem solid #eee;
  border-radius: 4px;
  box-sizing: border-box;
  transition: all .5s ease;
}
.case_box .gallery .gallery-thumbs .swiper-slide .pic {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  cursor: pointer;
}
.case_box .gallery .gallery-thumbs .swiper-slide .pic img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
}
.case_box .gallery .gallery-thumbs .swiper-slide-thumb-active {
  border-color: #ffab00;
}
.case_box .swiper-pagination .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  position: relative;
  box-sizing: border-box;
  background: rgba(0, 0, 0, 0.4);
  opacity: 1;
  transition: all .5s ease;
  box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.2);
}
.case_box .swiper-pagination .swiper-pagination-bullet:hover:after {
  transform: scale(2);
}
.case_box .swiper-pagination .swiper-pagination-bullet:after {
  content: '';
  width: 4px;
  height: 4px;
  background: #fff;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  border-radius: 50%;
  transition: all .5s ease;
}
.case_box .swiper-pagination .swiper-pagination-bullet-active {
  border: 2px solid #fff;
}
.case_box .swiper-pagination .swiper-pagination-bullet-active:after {
  width: 0;
  height: 0;
  transform: scale(0);
}
.case_box .gallery .swiper-button-prev:hover, .case_box .gallery .swiper-button-next:hover {
  opacity: .35;
}
.case_box .gallery .swiper-button-disabled {
  pointer-events: auto !important;
}
.case_box .gallery .swiper-button-black {
  display: inline-block;
  vertical-align: middle;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0px;
  width: 28px;
  height: 100%;
  margin: 0;
  opacity: .6;
  background-size: 16px;
  transition: all .5s ease;
}
.case_box .gallery .swiper-button-next {
  left: auto;
  right: 0;
}
.case_box .info {
  float: left;
  min-width: 200px;
  padding-left: 38px;
  flex: 1;
}
.case_box .info .box {
  margin-bottom: 20px;
  border-bottom: 1px solid #e8e8e8;
}
.case_box .info .box h3 {
  color: #262626;
  font-size: 30px;
  line-height: 1.4;
  font-weight: bold;
}
.case_box .info .txt {
  font-size: 14px;
  line-height: 1.8;
  color: #666;
  padding: 20px 0px;
  word-break: break-word;
}
.case_box .info .btn {
  padding-bottom: 10px;
  white-space: nowrap;
}
.case_box .info .btn a {
  display: inline-block;
  max-width: 45%;
  color: #fff;
  font-size: 14px;
  line-height: 1.572;
  text-align: center;
  padding: 0.6vw 1.4vw;
  background: #007d93;
  transition: all .5s ease;
}
.case_box .info .btn a:hover {
  background: #ffab00;
}
.case_box .case_show {
  width: 100%;
  margin-top: 20px;
}
.case_box .case_show .tit {
  color: #333;
  font-size: 26px;
  line-height: 70px;
  font-weight: bold;
  text-align: center;
  background: #f5f5f5;
  border-bottom: 3px solid #007d93;
  height: 70px;
  box-sizing: border-box;
}
.case_box .case_show .content {
  padding: 20px 0;
  word-break: break-word !important;
  overflow: hidden;
}
.case_box .case_show .content p {
  color: #666;
  font-size: 16px;
  padding-bottom: 15px;
  line-height: 1.8;
}
.case_box .case_show .content img {
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  margin: 0 auto;
}
.case_box .case_show .key {
  color: #595959;
  padding: 20px 0;
}
.case_box .case_show .key span {
  color: #595959;
}
.case_box .case_show .key p {
  display: inline-block;
}
.case_box .case_show .key button {
  color: #595959;
  font-size: 14px;
  margin: 2px;
  padding: 7px 10px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  cursor: pointer;
  transition: all .5s ease;
}
.case_box .case_show .key button:hover {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad
}
.case_box .case_show .reLink {
  display: flex;
  padding: 20px 0;
  overflow: hidden;
}
.case_box .case_show .prev, .case_box .case_show .next {
  width: 50%;
  color: #595959;
  line-height: 1.5;
}
.case_box .case_show .prev a, .case_box .case_show .next a {
  color: #595959;
}
.case_box .case_show .next {
  text-align: right;
}
.case_box .case_show .frame {
  margin-top: 30px;
}
.case_box .case_show .frame .titi {
  background-color: #ededed;
  height: 60px;
}
.case_box .case_show .frame .titi h3 {
  color: #000;
  font-size: 18px;
  line-height: 60px;
  font-weight: bold;
  padding: 0 15px;
}
.case_box .case_show .frame .box {
  padding: 20px;
  border: 1px solid #e5e5e5;
  border-radius: 4px;
}
.case_box .case_show .pro_relevant li {
  width: 100%;
  position: relative;
}
.case_box .case_show .pro_relevant li .img {
  position: relative;
  width: 100%;
  padding-bottom: 75%;
  overflow: hidden;
}
.case_box .case_show .pro_relevant li .img img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(1);
  width: 100%;
  height: auto;
  transition: all .5s ease;
}
.case_box .case_show .pro_relevant li h3 {
  color: #333;
  font-size: 15px;
  line-height: 3;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  transition: all .5s ease;
}
.case_box .case_show .pro_relevant li:hover .img img {
  transform: translate(-50%, -50%) scale(1.02);
}
.case_box .case_show .pro_relevant li:hover h3 {
  color: #ffab00;
}
.case_box .case_show .swiper-pagination {
  position: relative;
  bottom: auto;
}
.swiper-button-prev.swiper-button-black {
  background-image: url("../images/prev1.png")
}
.swiper-button-next.swiper-button-black {
  background-image: url("../images/next1.png")
}
.swiper-button-prev.swiper-button-black:hover {
  background-image: url("../images/prev2.png")
}
.swiper-button-next.swiper-button-black:hover {
  background-image: url("../images/next2.png")
}
.case_box .pro_relevant .swiper-button-black {
  display: inline-block;
  vertical-align: middle;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0px;
  width: 40px;
  height: 100%;
  margin: 0;
  opacity: 1;
  background-size: 60px;
  transition: all .5s ease;
}
.case_box .pro_relevant .swiper-button-next {
  left: auto;
  right: 0;
}

.case_box .pro_relevant .swiper-button-prev:hover, .case_box .pro_relevant .swiper-button-next:hover {
  opacity: 1;
}

@media only screen and (max-width: 1400px) {
  .case_box .gallery {
    width: 350px;
  }
}
@media only screen and (max-width: 1200px) {
  .case_box .gallery {
    width: 300px;
  }
}
@media only screen and (max-width: 1080px) {
  .case_box .gallery {
    float: none;
    width: 100%;
  }
  .case_box .info {
    float: none;
    width: 100%;
    padding: 0;
    padding-top: 40px;
  }
}
@media only screen and (max-width: 1024px) {
  .case_box {
    padding: 2rem 0;
  }
  .case_box > main {
    display: block;
  }
  .case_box .pro_fl, .case_box .casecontent {
    width: 100%;
    margin: 0;
  }
  .case_box .pro_class .tit {
    font-size: 20px;
    font-weight: normal;
    line-height: 24px;
    padding: 15px 20px;
    position: relative;
    background: #ffab00;
  }
  .case_box .pro_class .tit .btn {
    display: block;
  }
  .case_box .pro_class .class, .case_box .pro_lx {
    display: none;
    padding: 0 15px;
    border-bottom: 1px solid #f0f0f0;
  }
  .case_box .list_box .intro {
    padding: 15px;
    margin: 0;
  }
  .case_box .list_box .list li {
    width: calc(100% / 2);
    padding: 5px;
  }
  .case_box .list_box .list li .showBox span {
    font-size: 12px;
  }
  .case_box .list_box .list li .tit {
    padding: 10px 5px;
  }
  .case_box .list_box .list li .tit h3 {
    font-size: 13px;
  }
  .case_box .gallery .thumbs {
    display: none;
  }
  .case_box .info {
    padding: 0;
  }
  .case_box .info .box {
    margin-bottom: 15px;
  }
  .case_box .info .box h3 {
    font-size: 20px;
    font-weight: bold;
    padding: 10px 0px;
  }
  .case_box .info .txt {
    padding-top: 0;
  }
  .case_box .info .btn a {
    width: 170px;
    line-height: 3;
  }
  .case_box .case_show .tit {
    font-size: 20px;
    line-height: 50px;
    height: 50px;
  }
  .case_box .case_show .content p {
    font-size: 14px;
    line-height: 24px;
  }
  .case_box .case_show .content {
    padding: 10px 0px;
  }
  .case_box .case_show .key {
    padding: 10px 0px;
  }
  .case_box .case_show .key button {
    font-size: 12px;
    padding: 5px 3px;
  }
  .case_box .case_show .reLink {
    padding: 0;
    background: rgba(0, 0, 0, 0.02);
  }
  .case_box .case_show .prev, .case_box .case_show .next {
    padding: 10px 0;
    text-align: center;
  }
  .case_box .case_show .prev a, .case_box .case_show .next a {
    display: block;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }
  .case_box .case_show .next {
    text-align: center;
    border-left: 1px solid rgba(0, 0, 0, 0.04);
  }
  .case_box .case_show .frame {
    margin-top: 20px;
  }
  .case_box .case_show .frame .guestbookarea {
    width: 80%;
}
  .case_box .case_show .frame .box {
    padding: 10px;
  }
  .case_box .case_show .pro_relevant li h3 {
    font-size: 14px;
    line-height: 2;
  }
}
@media only screen and (max-width: 768px) {
.filterarea h3{
  font-size: 1.75rem;
  line-height: 40px;
}
.filterarea .titleline {
  max-width: 112px;
}
.filterarea .filter-box{
padding: 0 5%;
}
.case_box .caselistarea ul li {
  width: calc(100% / 2 - 20px);
}
.case_box .caselistarea ul li:nth-child(2n) {
  margin-right: 0;
}
}
@media only screen and (max-width: 576px) {
.filterarea h3{
  font-size: 1.5rem;
  line-height: 30px;
}
.filterarea .titleline {
  max-width: 100px;
}
.filterarea .filter-box{
padding: 0;
}
.case_box .caselistarea ul li {
  flex-basis: 100%;
  margin: 0 0 30px 0;
}
.case_box .case_show .frame .guestbookarea {
  width: 95%;
}
.case_box .case_show .frame .guestbookarea .tablearea label {
  padding: 10px 0
}
.case_box .case_show .frame .guestbookarea .tablearea input[type="text"], .case_box .case_show .frame .guestbookarea .tablearea textarea {
  width: 95%;
  height: 24px;
}

}

.searcharea {
  padding: 4rem 0;
}
.searchlist{
  padding: 0;
}
.searcharea .searchlist ul {
  display: flex;
  flex-wrap: wrap;
}

.searcharea .searchlist ul li.case {
  width: calc(100% / 3 - 20px);
  margin: 0 30px 30px 0;
  border-radius: 10px;
  border: solid 0px #ccc;
  transition: all .5s ease;
  box-sizing: border-box;
  box-shadow: 0 3px 4px rgb(0 0 0 / 10%);
}
.searcharea .searchlist ul li.case:hover {
  box-shadow: 0 6px 8px rgb(0 0 0 / 20%);
}
.searcharea .searchlist ul li.case:nth-child(3n) {
  margin-right: 0;
}
.searcharea .searchlist ul li.case img{
width: 100%;
height: auto
}
.searcharea .searchlist ul li.case .types {
  padding: 5px 10px;
  font-size: 0.875rem;
  line-height: 1.5em;
  color: #007d93;
}
.searcharea .searchlist ul li.case h3{
padding: 5px 10px;
font-size: 1.25rem;
color: #111;

}
.searcharea .searchlist ul li.case p{
padding: 5px 10px;
font-size: 0.875rem;
color: #666;
line-height: 1.5em
}
@media only screen and (max-width: 768px) {
.searcharea .searchlist ul li.case {
  width: calc(100% / 2 - 20px);
}
.searcharea .searchlist ul li.case:nth-child(2n) {
  margin-right: 0;
}
}
@media only screen and (max-width: 576px) {
.searcharea .searchlist ul li.case {
  flex-basis: 100%;
  margin: 0 0 30px 0;
}
.searcharea .searchlist ul li.case:nth-child(2n) {
  margin-right: 0;
}
}
.searcharea .searchlist ul li.down {
  width: calc(100% / 2 - 10px);
  margin: 0 20px 20px 0;
  padding: 20px;
  box-sizing: border-box;
  background: #e5e5e5;
  display: flex;
  flex-wrap: wrap;
}
.searcharea .searchlist ul li.down:nth-child(2n) {
  margin-right: 0;
}
.searcharea .searchlist ul li.down .imgarea {
  width: 30%;
}
.searcharea .searchlist ul li.down .imgarea img {
  width: 100%;
  height: auto
}
.searcharea .searchlist ul li.down .txtarea {
  width: 65%;
  padding-left: 4%
}
.searcharea .searchlist ul li.down .txtarea .types {
  font-size: 0.875rem;
  line-height: 1.5em;
  color: #007d93;
  height: 10%
}
.searcharea .searchlist ul li.down .txtarea h3 {
  font-size: 1.125rem;
  height: 15%
}
.searcharea .searchlist ul li.down .txtarea p {
  font-size: 0.875rem;
  line-height: 1.5em;
  color: #666;
  height: 30%
}
.searcharea .searchlist ul li.down .txtarea .links {
  height: 42%;
  position: relative
}
.searcharea .searchlist ul li.down .txtarea .links .downbutton {
  position: absolute;
  left: 0;
  bottom: 0;
}
.searcharea .searchlist ul li.down .txtarea .links .downs {
  background: url(../images/download.png) center left no-repeat;
  background-size: 24px;
  padding-left: 24px;
  font-size: 0.875rem;
}
.searcharea .searchlist ul li.down .txtarea .links .downbutton a {
  background: #007d93;
  padding: 6px 10px;
  color: #fff;
}
.searcharea .searchlist ul li.down .txtarea .links .downbutton a:hover {
  background: #ffab00;
}
.searcharea .searchlist ul li.down .txtarea .links .erweima {
  position: absolute;
  right: 0;
  bottom: 0;
}
.searcharea .searchlist ul li.down .txtarea .links .erweima img {
  width: 72px;
  height: 72px;
}
@media only screen and (max-width: 768px) {
.searcharea .searchlist ul li.down {
  flex-basis: 100%;
  margin: 0 0 20px;
  padding: 20px;
  box-sizing: border-box;
  background: #e5e5e5;
  display: flex;
  flex-wrap: wrap;
}
}

.searcharea .searchlist ul li.news {
  display: flex;
  flex-wrap: wrap;
  margin: 3rem 0;
}
.searcharea .searchlist ul li.news .imgarea {
  width: 35%;
  margin-right: 3%
}
.searcharea .searchlist ul li.news .imgarea img {
  width: 100%;
  height: auto
}
.searcharea .searchlist ul li.news .imgarea img {
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease;
}
.searcharea .searchlist ul li.news .imgarea img:hover {
  transform: translate(0%, 0%) scale(1.02);
}
.searcharea .searchlist ul li.news .txtarea {
  width: 62%;
  font-size: 0.875rem;
  color: #666;
}
.searcharea .searchlist ul li.news .txtarea .types {
  font-size: 0.875rem;
  line-height: 1.5em;
  color: #007d93;
}
.searcharea .searchlist ul li.news .txtarea h3 {
  font-size: 1.125rem
}
.searcharea .searchlist ul li.news .txtarea h3 a {
  color: #111
}
.searcharea .searchlist ul li.news .txtarea h3 a:hover {
  color: #ffab00
}
.searcharea .searchlist ul li.news .txtarea .overview {
  line-height: 1.5rem;
  height: 60%;
  margin-top: 10px
}
@media only screen and (max-width: 1024px) {
}
@media only screen and (max-width: 768px) {
}
@media only screen and (max-width: 576px) {
.searcharea .searchlist ul li.news .imgarea {
  flex-basis: 100%;
}
.searcharea .searchlist ul li.news .txtarea {
  flex-basis: 100%;
}
}

.searcharea .searchlist ul li.prod {
padding: 30px 0;
border-top: 1px solid #ccc;
  display: flex;
  flex-wrap: wrap;
}
.searcharea .searchlist ul li.prod .imgarea{
  width: 20%;
  margin-right: 3%
  border: 1px solid #e8e8e8;
  padding: 10px
}
.searcharea .searchlist ul li.prod .imgarea img{
  width: 100%;
  height: auto
}
.searcharea .searchlist ul li.prod .imgarea img {
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease;
}
.searcharea .searchlist ul li.prod .imgarea img:hover {
  transform: translate(0%, 0%) scale(1.02);
}
.searcharea .searchlist ul li.prod .txtarea{
  width: 77%;
}
.searcharea .searchlist ul li.prod .txtarea .types {
  font-size: 0.875rem;
  line-height: 1.5em;
  color: #007d93;
}
.searcharea .searchlist ul li.prod .txtarea h3{
  font-size: 1.375rem;
  line-height: 1.8rem;
  color: #111;
  font-weight: 700;
  margin-top: 10px 
}
.searcharea .searchlist ul li.prod .txtarea .xinghao{
  font-size: 1rem;
  line-height: 1.8rem;
  color: #333;
  margin-top: 10px 
}
.searcharea .searchlist ul li.prod .txtarea .jianjie{
  color: #666;
  font-size: 1rem;
  line-height: 1.8rem;
  margin: 20px 0;
  vertical-align: top;
  word-break: break-all;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}
.searcharea .searchlist ul li.prod .txtarea .xiangqin {
  padding-top: 20px;
  white-space: nowrap;
}
.searcharea .searchlist ul li.prod .txtarea .xiangqin a {
  display: inline-block;
  max-width: 45%;
  color: #fff;
  font-size: 0.875rem;
  line-height: 1.5rem;
  text-align: center;
  padding: 0.6vw 1.4vw;
  background: #007d93;
  transition: all .5s ease;
  margin-right: 20px;
  border-radius: 4px
}
.searcharea .searchlist ul li.prod .txtarea .xiangqin a:hover {
  background: #ffab00;
  }

.productcat {
  padding: 4rem 0;
}
.productcat img{
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease
}
.productcat img:hover {
  transform: translate(0%, 0%) scale(1.02);
}
.productcat > main {
}
.productcat .productcatlist ul {
  display: flex;
  flex-wrap: wrap;
}
.productcat .productcatlist ul li {
  width: calc(100% / 3 - 20px);
  margin: 0 30px 30px 0;
}
.productcat .productcatlist ul li:nth-child(3n) {
  margin-right: 0;
}
.productcat .productcatlist ul li img{
width: 100%;
height: auto
}
.productcat .productcatlist ul li h3{
padding: 10px 0;
font-size: 1.25rem;
font-weight: 700;
color: #111;
border-bottom: 1px solid #666;
line-height: 1.8rem
}
.productcat .productcatlist ul li h3 .more_arr{
float: right;
color: #0079d3
}
.productcat .productcatlist ul li h3 .more_arr:hover{
color: #ffab00
}
.productcat .productcatlist ul li p{
padding: 10px 0;
font-size: 0.875rem;
color: #666;
line-height: 1.5em
}
@media only screen and (max-width: 768px) {
.productcat .productcatlist ul li {
  width: calc(100% / 2 - 20px);
}
.productcat .productcatlist ul li:nth-child(2n) {
  margin-right: 0;
}
.productcat .productcatlist ul li:nth-child(3n) {
  margin-right: 30px;
}
}
@media only screen and (max-width: 576px) {
.productcat .productcatlist ul {
  flex-basis: 100%
}
.productcat .productcatlist ul li {
  width: 100%;
  margin: 0 0 30px 0;
}
}

.productlist {
  padding: 4rem 0;
}
.productlist > main {
  display: flex;
}
.productlist .productlist_fl {
  width: 300px;
  background: #fff;
}
.productlist .productlist_class {
  
}
.productlist .productlist_class .tit {
  position: relative;
  color: #111;
  font-size: 2.25rem;
  font-weight: bold;
  line-height: 80px;
}
.productlist .productlist_class .btn {
  position: absolute;
  top: 10px;
  right: 15px;
  padding: 9px 5px;
  border: 1px solid #007d93;
  border-radius: 4px;
  box-sizing: border-box;
  display: none;
}
.productlist .productlist_class .btn span {
  display: block;
  width: 22px;
  height: 2px;
  background: #007d93;
  border-radius: 1px;
}
.productlist .productlist_class .btn span + span {
  margin-top: 4px;
}
.productlist .productlist_class .line {
  display: block;
  max-width: 130px;
  height: 3px;
  margin: 0 0 20px;
  background: #007d93;
}
.productlist .productlist_class .class {
  padding: 15px 15px 15px 0;
}
.productlist .productlist_class .class .title-box {
  position: relative;
  padding-left: 0px;
  line-height: 40px;
}
.title-box .down-arrow:before {
  position: absolute;
  display: block;
  content: "";
  top: 50%;
  /*left: 0;*/
  right: 0;
  width: 6px;
  height: 6px;
  margin-top: -8px;
  border-top: 2px solid #545859;
  border-right: 2px solid #545859;
  transition: all .2s cubic-bezier(.4, 0, .2, 1) .2s;
  transform: rotate(45deg) translateY(-50%)
}
/*.active .title-box .down-arrow:before {
  position: absolute;
  display: block;
  content: "";
  top: 50%;
  left: 0;
  right: 0;
  width: 6px;
  height: 6px;
  margin-top: -8px;
  border-top: 2px solid #ffab00;
  border-right: 2px solid #ffab00;
  transition: all .2s cubic-bezier(.4, 0, .2, 1) .2s;
  transform: rotate(135deg) translateY(-50%)
}*/
.productlist .productlist_class .class .title-box a {
  display: block;
  color: #333;
  transition: all .5s ease;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.productlist .productlist_class .class .title-box a:hover {
  color: #ffab00;
}
.productlist .productlist_class .class .title-box a.cur {
  color: #007d93;
}
.productlist .productlist_class .class .title-box .titleA {
  font-size: 1.125rem;
  font-weight: bold;
}
.productlist .productlist_class .class .title-box .titleB {
  font-size: 0.875rem;
}
.productlist .productlist_class .class ul {
  padding-left: 0px;
}
.productlist .productlist_fr {
  width: 100%;
  margin: 0;
  /*background: #fafafa;*/
}
.productlist .productlist_fr .list_box {
  padding-bottom: 30px;
}
.productlist .productlist_fr .list_box .title {
  color: #333;
  font-size: 28px;
  line-height: 60px;
  text-align: center;
  border-bottom: 1px solid #f0f0f0;
}
.productlist .productlist_fr .list_box .intro {
  padding: 0 0 20px;
  margin: 0 0 30px;
  border-bottom: 1px solid #e8e8e8;
}
.productlist .productlist_fr .list_box .intro p {
  color: #666;
  font-size: 1rem;
  line-height: 1.8rem;
  text-align: center;
  margin: 20px 15px;
  vertical-align: top;
  word-break: break-all;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}
.productlist .productlist_fr .list_box .list {
margin: 0;
padding: 0;
}
.productlist .productlist_fr .list_box .list li {
padding: 30px 0;
border-top: 1px solid #ccc;
  display: flex;
  flex-wrap: wrap;
}
.productlist .productlist_fr .list_box .list li .imgarea{
  width: 20%;
  margin-right: 3%
  border: 1px solid #e8e8e8;
  padding: 10px
}
.productlist .productlist_fr .list_box .list li .imgarea img{
  width: 100%;
  height: auto
}
.productlist .productlist_fr .list_box .list li .imgarea img {
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease;
}
.productlist .productlist_fr .list_box .list li .imgarea img:hover {
  transform: translate(0%, 0%) scale(1.02);
}
.productlist .productlist_fr .list_box .list li .txtarea{
  width: 77%;
}
.productlist .productlist_fr .list_box .list li .txtarea h3{
  font-size: 1.375rem;
  line-height: 1.8rem;
  color: #111;
  font-weight: 700 
}
.productlist .productlist_fr .list_box .list li .txtarea .xinghao{
  font-size: 1rem;
  line-height: 1.8rem;
  color: #333;
  margin-top: 10px 
}
.productlist .productlist_fr .list_box .list li .txtarea .jianjie{
  color: #666;
  font-size: 1rem;
  line-height: 1.8rem;
  margin: 20px 0;
  vertical-align: top;
  word-break: break-all;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}
.productlist .productlist_fr .list_box .list li .txtarea .xiangqin {
  padding-top: 20px;
  white-space: nowrap;
}
.productlist .productlist_fr .list_box .list li .txtarea .xiangqin a {
  display: inline-block;
  max-width: 45%;
  color: #fff;
  font-size: 0.875rem;
  line-height: 1.5rem;
  text-align: center;
  padding: 0.6vw 1.4vw;
  background: #007d93;
  transition: all .5s ease;
  margin-right: 20px;
  border-radius: 4px
}
.productlist .productlist_fr .list_box .list li .txtarea .xiangqin a:hover {
  background: #ffab00;
  }

.ny_class .back_list {padding: 0 20px;}
@media only screen and (max-width: 1024px) {
.ny_class .back_list {line-height: 40px}
}
@media only screen and (max-width: 768px) {
.ny_class .back_list {padding: 0 }
}

.productcontent {
  padding: 4rem 0;
}
.productcontent img{
  transform: translate(0%, 0%) scale(1);
  transition: all .5s ease
}
.productcontent img:hover {
  transform: translate(0%, 0%) scale(1.02);
}
.productcontent > main {
}
.productcontent h3{
  color: #111;
  font-size: 2rem;
  line-height: 1.8rem;
  font-weight: bold;
}
.productcontent .productjianjie{
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  padding: 20px 0 30px;
  overflow: hidden;
}
.productcontent .productjianjie .info{
  float: left;
  min-width: 380px;
  flex: 1;
}
.productcontent .productjianjie .info .box{
  margin-bottom: 20px;
}
.productcontent .productjianjie .info .box .xinghao{
  color: #333;
  font-size: 1.125rem;
  line-height: 1.8rem;
  margin-top: 15px
}
.productcontent .productjianjie .info .box .gailan{
  color: #666;
  font-size: 1rem;
  line-height: 1.8rem;
  margin-top: 15px;
  word-break: break-word;
}
.productcontent .productjianjie .info .box .yingyong{
  margin-top: 20px
}
.productcontent .productjianjie .info .box .yingyong h4{
  color: #333;
  font-size: 1.5rem;
  line-height: 1.8rem;
  font-weight: bold;
}
.productcontent .productjianjie .info .box .yingyong .yy_content{
  color: #666;
  font-size: 1rem;
  line-height: 1.8rem;
  margin-top: 15px;
  word-break: break-word;
}
.productcontent .productjianjie .info .btn {
  padding-top: 20px;
  white-space: nowrap;
}
.productcontent .productjianjie .info .btn a {
  display: inline-block;
  max-width: 45%;
  color: #fff;
  font-size: 0.875rem;
  line-height: 1.5rem;
  text-align: center;
  padding: 0.6vw 1.4vw;
  background: #007d93;
  transition: all .5s ease;
  margin-right: 20px;
  border-radius: 4px
}
.productcontent .productjianjie .info .btn a:hover {
  background: #ffab00;
}
.productcontent .productjianjie .info .btn .downs {
  background: url(../images/download.png) center left no-repeat;
  background-size: 24px;
  padding-left: 24px;
  font-size: 0.875rem;
}
.productcontent .productjianjie .info .btn .rmb {
  background: url(../images/rmb.png) center left no-repeat;
  background-size: 24px;
  padding-left: 24px;
  font-size: 0.875rem;
}
.productcontent .productjianjie .gallery{
  float: left;
  width: 400px;
  padding-left: 40px;
}
.productcontent .productjianjie .gallery img{
  width: 100%;
  height: auto
}
.productcontent .productxiangxi{
margin: 3rem 0;
}
.productcontent .productxiangxi .xx_line{
  width: 100%;
  height: 1px;
  border-top: 1px solid #666;
}
.productcontent .productxiangxi .xx_line span{
  position:relative;  
  z-index: 9;
  left: 0;
  top: -2px;
  width: 180px;
  height: 4px;
  background: #666;
  display: block
}
.productcontent .productxiangxi .tedian{
  margin-top: 20px;
  padding: 20px 0 40px 0;
}
.productcontent .productxiangxi .tedian h4{
  color: #333;
  font-size: 1.5rem;
  line-height: 1.8rem;
  font-weight: bold;
}
.productcontent .productxiangxi .tedian .td_content{
  color: #666;
  font-size: 1rem;
  line-height: 1.8rem;
  margin-top: 15px;
  word-break: break-word;
}
.productcontent .productxiangxi .canshu{
  margin-top: 20px;
  padding: 20px 0 40px 0;
}
.productcontent .productxiangxi .canshu h4{
  color: #333;
  font-size: 1.5rem;
  line-height: 1.8rem;
  font-weight: bold;
}
.productcontent .productxiangxi .canshu .cs_content{
  margin-top: 15px;
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
}
.productcontent .productxiangxi .canshu .cs_content .cs_text {
  float: left;
  min-width: 380px;
  flex: 1;
}
.productcontent .productxiangxi .canshu .cs_content .cs_text li:nth-child(odd) {
    background-color: #f9f9f9;
    padding: 20px;
}
.productcontent .productxiangxi .canshu .cs_content .cs_text li:nth-child(even) {
    background-color: #fff;
    padding: 20px;
}
.productcontent .productxiangxi .canshu .cs_content .cs_img {
  float: left;
  width: 400px;
  margin-left: 40px;
  background: #f9f9f9
}
.productcontent .productxiangxi .canshu .cs_content .cs_img img{
  width: 100%;
  height: auto
}
.productcontent .productxiangxi .canshu .beizhu{
  color: #666;
  text-align: right;
  font-size: 0.875rem;
  line-height: 1.8rem;
  padding: 20px;
}
.productcontent .productxiangxi .canshu .beizhu span{
  color: #f00;
  padding: 0 10px;
}
.productcontent .reLink {
  display: flex;
  padding: 20px 0;
  overflow: hidden;
}
.productcontent .prev, .productcontent .next {
  width: 50%;
  color: #595959;
  line-height: 1.5;
}
.productcontent .prev a, .productcontent .next a {
  color: #595959;
}
.productcontent .next {
  text-align: right;
}
.productcontent .frame {
  margin-top: 30px;
}
.productcontent .frame {
  margin-top: 30px;
}
.productcontent .frame .titi {
  background-color: #ededed;
  height: 60px;
}
.productcontent .frame .titi h3 {
  color: #000;
  font-size: 18px;
  line-height: 60px;
  font-weight: bold;
  padding: 0 15px;
}
.productcontent .frame .box {
  padding: 20px;
  border: 1px solid #e5e5e5;
  border-radius: 4px;
}
.productcontent .pro_relevant li {
  width: 100%;
  position: relative;
}
.productcontent .pro_relevant li .img {
  position: relative;
  width: 100%;
  padding-bottom: 75%;
  overflow: hidden;
}
.productcontent .pro_relevant li .img img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(1);
  width: 100%;
  height: auto;
  transition: all .5s ease;
}
.productcontent .pro_relevant li h3 {
  color: #333;
  font-size: 15px;
  line-height: 3;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  transition: all .5s ease;
}
.productcontent .pro_relevant li:hover .img img {
  transform: translate(-50%, -50%) scale(1.02);
}
.productcontent .pro_relevant li:hover h3 {
  color: #ffab00;
}
.productcontent .pro_relevant .swiper-pagination {
  position: relative;
  bottom: auto;
}
.productcontent .pro_relevant .swiper-button-prev.swiper-button-black {
  background-image: url("../images/prev1.png")
}
.productcontent .pro_relevant .swiper-button-next.swiper-button-black {
  background-image: url("../images/next1.png")
}
.productcontent .pro_relevant .swiper-button-prev.swiper-button-black:hover {
  background-image: url("../images/prev2.png")
}
.productcontent .pro_relevant .swiper-button-next.swiper-button-black:hover {
  background-image: url("../images/next2.png")
}
.productcontent .pro_relevant .swiper-button-black {
  display: inline-block;
  vertical-align: middle;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0px;
  width: 40px;
  height: 100%;
  margin: 0;
  opacity: 1;
  background-size: 60px;
  transition: all .5s ease;
}
.productcontent .pro_relevant .swiper-button-next {
  left: auto;
  right: 0;
}

.productcontent .pro_relevant .swiper-button-prev:hover, .productcontent .pro_relevant .swiper-button-next:hover {
  opacity: 1;
}
@media only screen and (max-width: 1024px) {
  .productlist {
    padding: 2rem 0;
  }
  .productlist > main {
    display: block;
  }
  .productlist .productlist_fl, .productlist .productlist_fr {
    width: 100%;
    margin: 0;
  }
  .productlist .productlist_class .tit {
    font-size: 1.5rem;
    font-weight: normal;
    line-height: 24px;
    padding: 15px 20px;
    position: relative;
  }
  .productlist .productlist_class .btn {
    display: block;
  }
.productlist .productlist_class .line {
  display: block;
  max-width: 100%;
  height: 3px;
  margin: 10px 0 0;
  background: #007d93;
}
  .productlist .productlist_class .class {
    display: none;
    padding: 0 15px;
    border-bottom: 1px solid #f0f0f0;
  }
  .productlist .productlist_class ul ul li{
  float: left;
  padding: 0 10px;
}
}
@media only screen and (max-width: 991px) {
.productcontent .productjianjie{
  flex-basis: 100%
}
.productcontent .productjianjie .info{
  float: none;
  width: 100%;
  padding-top: 40px;
}
.productcontent .productjianjie .gallery{
  float: none;
  width: 100%;
  padding-left: 0;
  padding-top: 40px
}
.productcontent .productxiangxi .canshu .cs_content{
  flex-basis: 100%
}
.productcontent .productxiangxi .canshu .cs_content .cs_text {
  float: none;
  width: 100%;
  padding-top: 40px;
}
.productcontent .productxiangxi .canshu .cs_content .cs_img {
  float: none;
  width: 100%;
  margin-left: 0;
  margin-top: 40px
}
.productcontent .reLink {
    padding: 0;
    background: rgba(0, 0, 0, 0.02);
  }
.productcontent .reLink .prev, .productcontent .reLink .next {
    padding: 10px 0;
    text-align: center;
  }
.productcontent .reLink .prev a, .productcontent .reLink .next a {
    display: block;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }
}
@media only screen and (max-width: 768px) {
.productlist .productlist_fr .list_box .list li {
flex-basis: 100%
}
.productlist .productlist_fr .list_box .list li .imgarea{
width: 100%
}
.productlist .productlist_fr .list_box .list li .txtarea{
  width: 100%;
  padding: 20px;
}

.productcontent {
  padding: 2rem 0;
}
.productcontent .productjianjie{
  padding: 0;  
}
.productcontent .productjianjie .info .box .xinghao{
  margin-top: 0;
}
.productcontent .productxiangxi{
margin: 3rem 0 0;
}
.productcontent .productxiangxi .canshu .cs_content{
  margin-top: 0;
}
}























