@charset "utf-8";
body {
  min-width:1200px;
}

/* 公用部分 */
.pc .pc-show,
.phone .phone-show {
  display:block;
}
.phone .pc-show,
.pc .phone-show {
  display:none;
}

/************ header start ***********/
header {
  min-width:1200px;
  width:100%;
  position:fixed;
  left:0;
  top:0;
  border-bottom:2px solid rgba(255, 255, 255, 0.3);
  -webkit-transition:background 0.3s;
  transition:background 0.3s;
  box-shadow:none;
  z-index:100;
}
header.sticky {
  background:rgba(255, 255, 255, 1);
  position:fixed;
  width:100%;
  box-shadow:0 2px 10px rgba(0, 0, 0, 0.5);
  border-bottom:1px solid rgba(0, 0, 0, 0.3);
}
header .topnav {
  padding:20px 20px 0 3.5%;
}
header.product {border-color:transparent}
header .logo {
  position:relative;
  padding-top:3px;
  padding-bottom:3px;
  float:left;
  -webkit-animation:fadeIn 1s ease-in both;
  animation:fadeIn 1s ease-in both;
  -webkit-transition:all 0.4s ease-in-out;
  transition:all 0.4s ease-in-out;
}
header .logo img {
  height:100%;
}
header .logo .logoImg1 {
  display:none;
}
header.sticky .logo .logoImg2,
header.product.color .logo .logoImg2 {
  display:none;
}
header.sticky .logo .logoImg1,
header.product.color .logo .logoImg1 {
  display:block;
}
/* 导航菜单 */
header .pc-nav {
  float:right;
  font-size:1.25em;
}
header .menu>li {
  float:left;
  margin:0 10px;
  position:relative;
}
header .menu>li>a {
  position:relative;
  display:block;
  line-height:20px;
  padding:20px 15px 40px;
  transition:all 0.28s;
  white-space:nowrap;
  color:#fff;
}
header.sticky .menu>li a,
header.product.color .menu>li a  {
  color:#333;
}
header .menu>li>a:before {
  content:'';
  font-size:1em;
  width:0;
  height:0.1em;
  position:absolute;
  left:0;
  right:0;
  bottom:1em;
  margin:auto;
  background-color:#fff;
}
header.sticky .menu>li>a:before,
header.product.color .menu>li a::before  {
  background-color:#19a179;
}
header.sticky .menu>li>a:hover,
header.sticky .menu>li>a:hover,
header.product.color .menu>li.active>a,
header.product.color .menu>li.active>a {
  color:#19A179;
}
header .menu>li>a:hover:before,
header .menu>li.active>a:before {
  width:30%;
  -webkit-animation:underline 0.3s ease-in-out;
  animation:underline 0.3s ease-in-out;
}

/* 顶部二级菜单 */
header .panel {
  display:none;
  position:absolute;
  left:-4em;
  background-color:#fff;
  box-shadow:0 2px 10px rgba(0, 0, 0, 0.1);
  font-size:1em;
  animation:fadeIn .5S linear
}
header .panel:not(.last-child){
  right:-4em;
}
header .panel.last-child{
  right:-30px;
}
header .menu>li:hover .panel {
  display:block;
}
header .panel .list-item{
  position:relative;
  width:100%;
}
header .panel .list-item+.list-item{border-top:1px solid rgba(23,23,23,.05);}
header .panel .list-item>a {
  font-size:.86em;
  display:-webkit-flex;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  width:100%;
  /* padding:0.8em 1.5em; */
  padding:.3em .5em;
  /* background:#f0f0f0; */
  text-align:center;
  background-color:#fff;
  /* border-radius:5px; */
  -webkit-transition:background 0.5s;
  transition:background 0.5s;
}
header .panel .list-item>a:hover {
  color:#19A179;
  background:#c0f0e1;
}
header .panel .list-item.active>a {
  color:#fff;
  background:#19a179;
}
header .panel .list-item>a .icon-static,
header .panel .list-item>a .icon-active {
  height:1.2em;
  /* margin-right:0.5em; */
  margin-top:.3em;
  margin-bottom:.5em;
}
header .panel .list-item>a .icon-active,
header .panel .list-item.active>a .icon-static {
  display:none;
}
header .panel .list-item.active>a .icon-active {
  display:block;
}
header .panel-child{
  position:absolute;
  left:0;
  right:0;
  top:10%;
  z-index:-3;
  font-size:.85em;
  background-color:#fff;
  opacity:0;
  transform:translateX(0);
  transition:all .4s;
}
header .panel .list-item:hover .panel-child{
  opacity:1;
  box-shadow:0 2px 10px rgba(0, 0, 0, 0.1);
  transform:translateX(-100%);
  transition:all .4s;
}
/* 顶部二级菜单 动画 */
@-webkit-keyframes upbit {from{-webkit-transform:translate3d(0,30px,0);opacity:.3}to{-webkit-transform:translate3d(0,0,0);opacity:1}}
@keyframes upbit {from{transform:translate3d(0,30px,0);opacity:.3}to{transform:translate3d(0,0,0);opacity:1}}
.anim-upbit{-webkit-animation-name:upbit;animation-name:upbit}
/************ header end ***********/

/************ footer start ***********/
footer {
  position:relative;
  padding:50px 0 20px 0;
  background:#343434;
  overflow:hidden;
  color:#fff;
}
footer:before {
  content:"";
  display:block;
  width:32%;
  height:120%;
  position:absolute;
  left:0;
  top:-20%;
  bottom:0;
  background:url("../images/footer-bg.png") left center no-repeat;
  background-size:100% 100%;
  opacity:0.4;
}
footer .footer-top {
  width:100%;
  height:100%;
}
footer .footer-nav {
  width:63.75%;
}
footer .footer-nav > ul {
  padding-bottom:1.2em;
  margin-bottom:1.2em;
  border-bottom:1px solid #338970;
}
footer .footer-nav > ul > li {
  width:16%;
  float:left;
  text-align:left;
}
footer .footer-nav > ul > li.foot-navitem2,
footer .footer-nav > ul > li.foot-navitem3 {
  width:28%;
}
footer .footer-nav > ul > li:last-child {
  width:12%;
  text-align:right;
}
footer .nav-item-title {
  padding-bottom:2em;
  border-bottom:1px solid #338970;
  font-size:1.25em;
  font-weight:600;
}
footer .nav-item > p {
  margin-top:1.2em;
}

footer .nav-item > p > a{
  color:#fff;
}

footer .nav-item > p > a:hover {
  cursor:pointer;
  border-bottom:1px solid #fff;
}

footer .footer-qrcode {
  text-align:right;
  line-height:1.5;
}
footer .footer-qrcode .important {
  font-size:1.25em;
  font-weight:600;
}
footer .qrcode-img {
  margin:1em 0;
}
/************ footer end ***********/

/************ 主体 start ***********/
.banner, .banner>img {
  width:100%;
}
.bannerSwiper {
  width:100%;
}
.bannerSwiper .swiper-slide>img {
  width:100%;
}
main {
  position:relative;
  background-color:#fff;
}
.main-card {
  position:relative;
  width:100%;
  padding-top:56.25%;
}
.main-card .main-card-title {
  position:absolute;
  left:10.2%;
  top:8em;
  font-style:normal;
  text-align:center;
  z-index:99;
}
.main-card .card-title-box {
  position:relative;
  line-height:1;
}
.main-card .card-title-box > h3 {
  position:relative;
  margin-top:1em;
  margin-bottom:1em;
  padding-top:1em;
  text-align:left;
  font-size:1.875em;
  color:#222;
  font-weight:600;
}
.main-card .card-title-box > h1 {
  text-transform:uppercase;
  font-size:3.375em;
  color:#e6e6e6;
  text-align:left;
  font-weight:600;
}
.main-card .card-title-box > h3::before {
  content:"";
  position:absolute;
  top:0;
  left:2.3em;
  width:0.25em;
  height:0.25em;
  border-radius:50%;
  background-color:#19a179;
}
.main-card .card-title-box > h3::after {
  content:"";
  position:absolute;
  top:0;
  left:0.1em;
  width:2em;
  height:0.25em;
  background-color:#19a179;
}
.main-card.white-card .card-title-box > h3,
.main-card.white-card .card-title-box > h1 {
  color:#fff;
}
.main-card .main-card-content {
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
  padding:6.7% 0 4.68%;
}
/* fullwidth */
.main-card.full .main-card-content {
  padding:0;
}
.main-card-content .tab-content {
  width:100%;
  height:100%;
  padding-left:27%;
  padding-right:10.15%;
}
.main-card.full .main-card-content .tab-content {
  padding-left:0;
  padding-right:0;
}
.main-card-content .tab-content .tab-pane {
  width:100%;
  height:100%;
  display:none;
}
.main-card-content .tab-content .tab-pane.active {
  display:block;
}
.tab-pane img {
  width:100%;
}
.tab-content .tab-pane-detail {
  width:60%;
  margin:0 auto;
}
.tab-content .tab-pane-detail>h3 {
  font-size:1.75em;
  text-align:center;
}
.tab-content .tab-pane-detail>p {
  margin-top:0.5em;
  font-size:1.125em;
  text-indent:2em;
  line-height:1.8;
  color:#444;
}
.tab-content .tab-pane-detail>a {
  display:block;
  font-size:1.125em;
  width:10.5em;
  height:2.7em;
  line-height:2.6;
  margin:1em auto 0;
  border:1px solid #19a179;
  text-align:center;
  -webkit-transition:background 0.5s;
  transition:background 0.5s;
  color:#19a179;
}
.tab-content .tab-pane-detail>a:hover {
  background-color:#19a179;
  color:#fff;
}

.main-card .card-nav {
  position:absolute;
  left:10.2%;
  top:27em;
}
.main-card .card--nav-item {
  margin-bottom:1.5em;
  text-align:left;
}
.main-card .card--nav-item>span {
  position:relative;
  cursor:pointer;
  display:inline-block;
  padding:0.5em 0 0.2em;
  -webkit-transition:all .5s;
  transition:all .5s;
  font-size:1.25em;
}
.main-card .card--nav-item:hover>span,
.main-card .card--nav-item:active>span {
  color:#19a179;
}
.main-card .card--nav-item>span::before {
  content:'';
  font-size:1.25em;
  position:absolute;
  bottom:0;
  left:0;
  width:0;
  height:2px;
  background-color:#19a179;
}
.main-card.white-card .card--nav-item>span {
  color:#fff;
}
/* .main-card.white-card .card--nav-item:hover>span,
.main-card.white-card .card--nav-item:active>span {
  color:#fff;
} */

.main-card .card--nav-item:hover>span::before,
.main-card .card--nav-item.active>span::before {
  width:100%;
  -webkit-animation:cardNavUnderline 0.3s ease-in-out;
  animation:cardNavUnderline 0.3s ease-in-out;
}
/* 跳转按钮 */
.main-card-link {
  width:3.75em;
  height:3.75em;
  line-height:4;
  position:absolute;
  left:10.2%;
  bottom:5em;
  background-color:#19a179;
  -webkit-transition:all .5s;
  transition:all .5s;
  border-radius:50%;
  color:#fff;
  box-shadow:none;
  text-align:center;
  cursor:pointer;
  -webkit-animation:bounce2 3s linear infinite;
  animation:bounce2 3s linear infinite;
}
.main-card-link.arrow-right {
  /* -webkit-animation:bounce1 3s linear infinite;
  animation:bounce1 3s linear infinite; */
  animation:none;
  box-shadow:0 15px 20px rgba(0, 0, 0, 0.3);
  cursor:default
}
.main-card-link .fa {
  font-size:1.3em;
}
.main-card-link:hover {
  box-shadow:0 15px 20px rgba(0, 0, 0, 0.3);
}
.main-card.white-card .main-card-link {
  background-color:#fff;
  color:#19A179;
}

.fade {
  -webkit-animation:fadeIn 0.3s ease-in-out;
  animation:fadeIn 0.3s ease-in-out;
}

/* 下划线 */
@-webkit-keyframes cardNavUnderline{
    0%{opacity:0;width:0%;-webkit-transform:translate3d(0,2px,0);transform:translate3d(0,2px,0)}
    to{opacity:1;width:100%;-webkit-transform:translateZ(0);transform:translateZ(0)}
}
@keyframes cardNavUnderline{
    0%{opacity:0;width:0%;-webkit-transform:translate3d(0,2px,0);transform:translate3d(0,2px,0)}
    to{opacity:1;width:100%;-webkit-transform:translateZ(0);transform:translateZ(0)}
}

/************ 主体 end ***********/

.back-to-top {
  -webkit-transition:.3s all linear;
  transition:.3s all linear;
  bottom:30px;
  opacity:1;
  visibility:visible;
  z-index:999;
}
.back-to-top a {
  /* width:35px;
  height:35px;
  background:#5b39c9; */
  width:2.5em;
  height:2.5em;
  background:#19a179;
  box-shadow:1px 5px 19px rgba(0,0,0,0.15);
  -webkit-transition:all 0.2s;
  transition:all 0.2s;
  font-size:1.5em;
  color:#fff;
  border-radius:50%;
  display:inline-block;
  text-align:center;
  line-height:2.2;
  bottom:10%;
  right:4%;
  position:fixed;
  z-index:999;
  -webkit-animation:bounce2 3s linear infinite;
  animation:bounce2 3s linear infinite;
}
.back-to-top a:hover {
  background:#fff;
  /* color:#5b39c9; */
  color:#19a179
}
/* .back-to-top a i {
  -webkit-animation:bounce2 3s linear infinite;
  animation:bounce2 3s linear infinite;
} */
@-webkit-keyframes bounce1 {
  0% {
    -webkit-transform:translateX(3px);
    transform:translateX(3px);
  }
  50% {
    -webkit-transform:translateX(-10px);
    transform:translateX(-10px);
  }
  100% {
    -webkit-transform:translateX(3px);
    transform:translateX(3px);
  }
}
@keyframes bounce1 {
  0% {
    -webkit-transform:translateX(3px);
    transform:translateX(3px);
  }
  50% {
    -webkit-transform:translateX(-10px);
    transform:translateX(-10px);
  }
  100% {
    -webkit-transform:translateX(3px);
    transform:translateX(3px);
  }
}
@-webkit-keyframes bounce2 {
  0% {
    -webkit-transform:translateY(3px);
    transform:translateY(3px);
  }
  50% {
    -webkit-transform:translateY(-10px);
    transform:translateY(-10px);
  }
  100% {
    -webkit-transform:translateY(3px);
    transform:translateY(3px);
  }
}
@keyframes bounce2 {
  0% {
    -webkit-transform:translateY(3px);
    transform:translateY(3px);
  }
  50% {
    -webkit-transform:translateY(-10px);
    transform:translateY(-10px);
  }
  100% {
    -webkit-transform:translateY(3px);
    transform:translateY(3px);
  }
}

/************* 媒体查询 ************/
@media screen and (max-width:1600px) {
  body {
    font-size:15px;
  }
  .maxWidth {
    width:1100px;
  }
}

@media screen and (max-width:1480px) {
  body {
    font-size:14px;
  }
  .maxWidth {
    width:1024px;
  }
}
@media screen and (max-width:1366px) {
  body {
    font-size:13px;
  }
  .maxWidth {
    width:1024px;
  }
}

@media screen and (max-width:1280px) {
  body {
    font-size:12px;
  }
  .maxWidth {
    width:920px;
  }
}