@charset "UTF-8";
/* CSS Document*/
/* CSS Document*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, blockquote, th, td, p, iframe {
  margin: 0;
  padding: 0; }

input, button, select, textarea {
  outline: none; }

li {
  list-style: none; }

img {
  border: none; }

textarea {
  resize: none; }

body {
  color: #202020;
  background: #fff;
  word-break: break-word;
  word-wrap: break-word; }

body, input, textarea {
  font-size: 12px;
  font-family: GothamBook, Microsoft YaHei; }

i, em {
  font-style: normal; }

a {
  color: #202020;
  text-decoration: none;
  outline: none; }

a:hover {
  color: #63B6EF; }

table {
  border-collapse: collapse; }

/*clearfix*/
.clearfix:after, .cl:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden; }

.fl, .z {
  float: left; }

.fr, .y {
  float: right !important; }

.show {
  display: block; }

.hide {
  display: none; }

.tal {
  text-align: left !important; }

.fz12 {
  font-size: 12px !important; }

.fz14 {
  font-size: 14px !important; }

.tac {
  text-align: center !important; }

.tal {
  text-align: left !important; }

.tar {
  text-align: right !important; }

.pt0 {
  padding-top: 0px !important; }

.mt0 {
  margin-top: 0px !important; }

.mt10 {
  margin-top: 10px !important; }

.mt20 {
  margin-top: 20px !important; }

.mt30 {
  margin-top: 30px !important; }

.mt40 {
  margin-top: 40px !important; }

.mt50 {
  margin-top: 50px !important; }

.mt60 {
  margin-top: 60px !important; }

.mt70 {
  margin-top: 70px !important; }

.mt80 {
  margin-top: 80px !important; }

.mt90 {
  margin-top: 90px !important; }

.mt100 {
  margin-top: 100px !important; }

.mb80 {
  margin-bottom: 80px !important; }

body {
  position: relative;
  background-color: #fff;
  overflow-x: hidden;
  overflow-y: auto;
  min-width: 320px;
  width: 100%; }

.hide {
  display: none !important; }

.wrap {
  width: 80%;
  margin: 0 auto;
  position: relative; }

.iconfont {
  font-size: inherit; }

.cblue {
  color: #55ADE5 !important; }

.body-en {
  word-break: break-word; }

.iconfont {
  font-size: inherit; }

.flexCentery {
  display: flex;
  align-items: center; }

.flexCenterxy {
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center; }

.flexCenterxys {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-content: center; }

.ctArrow {
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 8px solid #ccc; }

.maintop {
  padding-top: 85px; }

@-webkit-keyframes scaleout {
  0% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    opacity: .7; }
  50% {
    -webkit-transform: scale(1);
    transform: scale(1); }
  100% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2); } }

@keyframes scaleout {
  0% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    opacity: .7; }
  50% {
    -webkit-transform: scale(1);
    transform: scale(1); }
  100% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    opacity: .7; } }

@-webkit-keyframes huadong {
  0% {
    -webkit-transform: translate(0, -60px);
    transform: translate(0, -60px); }
  100% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0); } }

@-webkit-keyframes shandong {
  0% {
    -webkit-transform: scale(0.6);
    transform: scale(0.6); }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1); } }

.burger {
  padding: 15px;
  cursor: pointer;
  position: absolute;
  right: 0;
  margin-top: 8px; }
  .burger .burger-in {
    width: 30px;
    margin: 0 auto; }
  .burger [class^="line"] {
    background: #63B6EF;
    height: 3px;
    margin-bottom: 5px;
    opacity: 1;
    transition: all 0.3s;
    -webkit-transition: all 0.3s; }
  .burger .line1 {
    width: 30px; }
    .burger .line1:last-of-type {
      margin-bottom: 0; }
    .burger .line1:hover {
      width: 30px; }
  .burger .line2 {
    width: 25px; }
    .burger .line2:last-of-type {
      margin-bottom: 0; }
    .burger .line2:hover {
      width: 30px; }
  .burger .line3 {
    width: 20px; }
    .burger .line3:last-of-type {
      margin-bottom: 0; }
    .burger .line3:hover {
      width: 30px; }
  .burger.on .line1 {
    -webkit-transform: matrix(0.7071, 0.7071, -0.7071, 0.7071, 0, 6);
    transform: matrix(0.7071, 0.7071, -0.7071, 0.7071, 0, 6); }
  .burger.on .line2 {
    visibility: hidden;
    opacity: 0;
    -webkit-transform: matrix(1, 0, 0, 1, -40, 0);
    transform: matrix(1, 0, 0, 1, -40, 0); }
  .burger.on .line3 {
    width: 30px;
    -webkit-transform: matrix(0.7071, -0.7071, 0.7071, 0.7071, 0, -10);
    transform: matrix(0.7071, -0.7071, 0.7071, 0.7071, 0, -10); }

.bgfixed {
  background-attachment: fixed !important; }

@media screen and (max-width: 750px) {
  .wrap {
    width: 100%;
    box-sizing: border-box;
    padding: 0 10px; }
  .burger {
    display: block; }
  .maintop {
    padding-top: 60px; }
  .bgfixed {
    background-attachment: scroll !important; } }

.paging {
  height: 32px;
  line-height: 30px;
  margin: 50px 0;
  text-align: center; }
  .paging a {
    display: inline-block;
    padding: 0 12px;
    margin: 5px 3px 0;
    font-size: 14px;
    border: 1px solid #999;
    color: #666;
    transition: all 0.3s;
    -webkit-transition: all 0.3s; }
    .paging a:hover, .paging a.cur {
      background: #63B6EF;
      border-color: #63B6EF;
      color: #fff; }

.pc-show {
  display: block; }

.wap-show {
  display: none !important; }

@media screen and (max-width: 750px) {
  .pc-show {
    display: none !important; }
  .wap-show {
    display: block !important; } }

/**************************/
.nodata {
  padding: 80px 0;
  text-align: center;
  font-size: 18px;
  color: #666; }
  .nodata .ico-nodata {
    display: block;
    width: 200px;
    height: 188px;
    background: url(../images/nodata.jpg) no-repeat;
    margin: 0 auto; }

.search-title h4 {
  font-size: 24px;
  font-weight: normal;
  color: #333; }
  .search-title h4 strong {
    color: #63B6EF;
    font-weight: normal; }

.search-view {
  padding-bottom: 50px; }
  .search-view li {
    margin-bottom: 20px;
    border-bottom: 1px solid #ddd;
    padding: 20px; }
    .search-view li .tit {
      display: block;
      font-size: 16px;
      color: #333;
      line-height: 2;
      transition: all 0.3s;
      -webkit-transition: all 0.3s; }
      .search-view li .tit:hover {
        color: #63B6EF; }
    .search-view li .des {
      font-size: 14px;
      color: #999;
      line-height: 2; }
    .search-view li .hand {
      display: inline-block;
      width: 120px;
      height: 32px;
      border: none;
      background: #63B6EF;
      color: #fff;
      text-align: center;
      cursor: pointer;
      font-size: 12px;
      box-sizing: border-box;
      line-height: 32px;
      transition: all 0.3s;
      -webkit-transition: all 0.3s;
      margin-top: 10px; }
      .search-view li .hand:hover {
        -webkit-transform: scale(1.1);
        transform: scale(1.1); }

.pagering {
  text-align: center;
  padding: 50px 0; }
  .pagering .page-item {
    display: inline-block;
    margin: 0 3px; }
  .pagering .page-link {
    display: block;
    line-height: 32px;
    padding: 0 12px;
    height: 34px;
    box-sizing: border-box;
    border: 1px solid #d9d9d9;
    font-size: 14px; }
  .pagering .disabled .page-link {
    background: #ddd;
    color: #fff; }
  .pagering .active .page-link {
    background: #63B6EF;
    color: #fff;
    border-color: #63B6EF; }
  .pagering a.page-link {
    display: block;
    width: 100%;
    height: 100%;
    font-size: 16px; }

/*首页banner*/
.com-banner {
  position: relative;
  overflow: hidden; }

.com-banner a {
  display: block;
  height: 560px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  position: relative; }

.com-banner .swiper-pagination {
  bottom: 30px; }

.com-banner .swiper-pagination span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #fff;
  opacity: 1; }

.com-banner .swiper-pagination span.swiper-pagination-bullet-active {
  background-color: transparent;
  border: 1px solid #fff; }

.com-banner .bcont {
  padding-top: 100px;
  color: #fff; }

.com-banner .tit {
  font-size: 52px;
  font-weight: normal;
  line-height: 60px;
  padding: 10px 0; }

.com-banner .disc {
  font-size: 15px;
  line-height: 30px;
  height: 90px;
  overflow: hidden;
  margin-top: 10px;
  max-width: 750px; }

.com-banner .handle {
  display: block;
  width: 140px;
  height: 38px;
  border: 1px solid #fff;
  color: #fff;
  font-size: 14px;
  text-align: center;
  line-height: 38px;
  margin-top: 20px;
  -webkit-transition: all 0.3s;
  transition: all 0.3s; }

.com-banner .handle:hover {
  background-color: #fff;
  border-color: #fff;
  color: #273A55; }

.com-banner .swiper-button-prev {
  left: 30px; }

.com-banner .swiper-button-next {
  right: 30px; }

.com-banner .bgTxt {
  overflow: hidden;
  height: 100%;
  text-align: center;
  line-height: 1.8;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  align-content: center;
  flex-direction: column;
  flex-wrap: nowrap;
  color: #fff; }
  .com-banner .bgTxt h4 {
    font-size: 60px;
    font-weight: normal; }
  .com-banner .bgTxt h5 {
    font-size: 20px;
    font-weight: normal; }
  .com-banner .bgTxt .inh4 {
    font-size: 30px;
    font-weight: normal; }
  .com-banner .bgTxt .hand {
    display: inline-block;
    width: 240px;
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    margin-top: 10px;
    height: 52px;
    background: #fff;
    color: #000;
    text-align: center;
    font-size: 16px;
    line-height: 52px; }
    .com-banner .bgTxt .hand:hover {
      background-color: #63B6EF;
      color: #fff; }
  .com-banner .bgTxt.teb {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    align-content: center;
    flex-direction: column;
    flex-wrap: nowrap; }
  .com-banner .bgTxt .lettes {
    margin-bottom: 40px;
    font-size: 46px;
    text-shadow: 0 0 12px rgba(0, 0, 0, 0.8); }

.com-banner .bbtit {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  flex-direction: row;
  flex-wrap: nowrap; }
  .com-banner .bbtit strong {
    position: relative;
    color: #fff;
    font-size: 52px;
    font-weight: normal;
    padding-bottom: 20px; }
    .com-banner .bbtit strong:after {
      content: "";
      width: 120px;
      position: absolute;
      left: 50%;
      bottom: 0;
      margin-left: -60px;
      height: 4px;
      background: #fff; }

.com-banner .camTxt {
  position: absolute;
  line-height: 20px;
  padding: 20px 40px;
  max-width: 90%;
  bottom: 10%;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
  font-size: 15px; }

.com-banner .mouse {
  position: absolute;
  bottom: 30px;
  left: 50%;
  width: 64px;
  height: 64px;
  margin-left: -32px;
  background: #fff;
  z-index: 10;
  -webkit-animation: huadong 1.2s infinite linear;
  animation: huadong 1.2s infinite linear;
  border-radius: 50%;
  pointer-events: none;
  line-height: 64px;
  text-align: center;
  font-size: 32px; }

.com-banner a {
  height: 60vh; }

.hm-banner a {
  height: 100vh; }

/*底部*/
@media screen and (max-width: 750px) {
  .wrap {
    width: 100%;
    box-sizing: border-box;
    padding: 0 10px; }
  .com-banner a {
    height: 280px; }
  .com-banner .bgTxt {
    margin: 0 20px; }
    .com-banner .bgTxt h4 {
      font-size: 18px; }
    .com-banner .bgTxt h5 {
      font-size: 20px; }
    .com-banner .bgTxt .hand {
      width: 100px;
      height: 32px;
      line-height: 32px;
      font-size: 14px; }
    .com-banner .bgTxt .lettes {
      font-size: 24px; } }

.disTit {
  color: #1F1F1F;
  text-align: center;
  line-height: 1.7; }

.disTit h2 {
  font-size: 25px;
  font-weight: normal;
  position: relative; }

.disTit h2.dline {
  padding-bottom: 15px; }

.disTit h2.dline:after {
  content: "";
  position: absolute;
  bottom: 0;
  width: 120px;
  left: 50%;
  margin-left: -60px;
  border-top: 1px solid #010101; }

.disTit h3 {
  font-size: 13px;
  font-weight: normal; }

.uicase-main li {
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  flex-direction: row;
  flex-wrap: nowrap;
  background: #fff;
  height: 620px; }

.uicase-main .pic {
  width: 50%;
  position: relative;
  overflow: hidden;
  height: 100%; }
  .uicase-main .pic img, .uicase-main .pic .img {
    display: block;
    transition: all 0.3s;
    -webkit-transition: all 0.3s; }
  .uicase-main .pic:hover img, .uicase-main .pic:hover .img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1); }
  .uicase-main .pic .img {
    display: block;
    width: 100%;
    height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover; }

.uicase-main .info {
  width: 50%;
  background: #fff;
  height: 100%;
  box-sizing: border-box;
  padding: 0 10%;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  align-content: center;
  flex-direction: column;
  flex-wrap: nowrap; }
  .uicase-main .info .t {
    font-size: 36px;
    color: #111;
    display: block; }
  .uicase-main .info .d {
    margin-top: 20px;
    font-size: 14px;
    color: #999;
    line-height: 24px; }
  .uicase-main .info .hand {
    margin-top: 30px; }
    .uicase-main .info .hand a {
      display: inline-block;
      width: 140px;
      height: 55px;
      border: none;
      background: #63B6EF;
      color: #fff;
      text-align: center;
      cursor: pointer;
      font-size: 12px;
      box-sizing: border-box;
      line-height: 55px;
      transition: all 0.3s;
      -webkit-transition: all 0.3s; }
      .uicase-main .info .hand a:hover {
        -webkit-transform: scale(1.1);
        transform: scale(1.1); }

.uicase-main li:nth-child(2n) {
  flex-direction: row-reverse; }
  .uicase-main li:nth-child(2n) .info {
    background: #63B6EF; }
    .uicase-main li:nth-child(2n) .info .t {
      color: #fff; }
    .uicase-main li:nth-child(2n) .info .d {
      color: #fff; }
    .uicase-main li:nth-child(2n) .info .hand a {
      background: #fff;
      color: #63B6EF; }

@media screen and (max-width: 750px) {
  .uicase-main li {
    display: block;
    position: relative;
    padding: 10px;
    height: auto;
    margin-top: 10px; }
  .uicase-main .pic {
    width: 100%;
    height: auto;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
  .uicase-main .info {
    width: 100%;
    background: rgba(255, 255, 255, 0.8);
    height: auto;
    padding: 50px 10px;
    position: relative;
    z-index: 1; }
    .uicase-main .info .d {
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp: 4;
      -webkit-box-orient: vertical; }
  .uicase-main li:nth-child(2n) .info {
    background: rgba(67, 193, 255, 0.8); } }

.newsList {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  align-content: center;
  flex-direction: row;
  flex-wrap: wrap; }
  .newsList .item {
    width: 33.33%;
    margin-top: 30px;
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    position: relative;
    display: block; }
    .newsList .item .pic {
      position: relative;
      overflow: hidden;
      position: relative;
      overflow: hidden;
      display: block;
      height: 420px; }
      .newsList .item .pic img, .newsList .item .pic .img {
        display: block;
        transition: all 0.3s;
        -webkit-transition: all 0.3s; }
      .newsList .item .pic:hover img, .newsList .item .pic:hover .img {
        -webkit-transform: scale(1.1);
        transform: scale(1.1); }
      .newsList .item .pic:after {
        content: "";
        position: absolute;
        left: -120%;
        top: 0;
        width: 100%;
        height: 100%;
        background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
        transform: skewx(-25deg);
        -webkit-transform: skewx(-25deg); }
      .newsList .item .pic:hover:after {
        transition: all .5s ease;
        left: 100%; }
      .newsList .item .pic .img {
        display: block;
        width: 100%;
        height: 100%;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover; }
    .newsList .item .info {
      padding: 20px;
      box-sizing: border-box;
      height: 190px; }
    .newsList .item .t {
      display: block;
      font-size: 17px;
      color: #555;
      line-height: 30px;
      height: 30px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      transition: all 0.3s;
      -webkit-transition: all 0.3s; }
      .newsList .item .t:hover {
        color: #63B6EF; }
    .newsList .item .d {
      display: block;
      font-size: 13px;
      color: #555;
      line-height: 24px;
      height: 48px;
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      margin-top: 10px;
      transition: all 0.3s;
      -webkit-transition: all 0.3s; }
      .newsList .item .d:hover {
        color: #63B6EF; }
    .newsList .item .tim {
      margin-top: 10px;
      font-size: 12px;
      color: #aaa; }
    .newsList .item:hover {
      box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15); }

.home-news .item {
  margin-top: 0; }
  .home-news .item:before {
    content: "";
    z-index: 1;
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40%;
    background: linear-gradient(transparent 0%, black 100%); }
  .home-news .item .info {
    position: absolute;
    z-index: 2;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 160px; }
    .home-news .item .info .t {
      color: #fff; }
    .home-news .item .info .d {
      color: #aaa; }
    .home-news .item .info .tim {
      color: #aaa; }

@media screen and (max-width: 750px) {
  .newsList {
    display: block; }
    .newsList .item {
      margin-top: 10px;
      width: 100%; }
      .newsList .item:before {
        content: "";
        z-index: 1;
        transition: all 0.3s;
        -webkit-transition: all 0.3s;
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 40%;
        background: linear-gradient(transparent 0%, black 100%); }
      .newsList .item .info {
        position: absolute;
        z-index: 2;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 160px; }
        .newsList .item .info .t {
          color: #fff; }
        .newsList .item .info .d {
          color: #aaa; }
        .newsList .item .info .tim {
          color: #aaa; } }

.news-mc {
  padding-bottom: 80px; }
  .news-mc .nc-title {
    font-size: 40px;
    line-height: 60px; }
  .news-mc .nc-time {
    margin-top: 30px;
    font-size: 14px;
    color: #333;
    overflow: hidden; }
    .news-mc .nc-time .sj {
      float: left;
      line-height: 36px; }
    .news-mc .nc-time .oshares, .news-mc .nc-time .bdsharebuttonbox {
      float: left;
      margin-left: 20px; }
  .news-mc .nc-content {
    margin-top: 35px;
    line-height: 26px;
    font-size: 15px;
    color: #202020; }
    .news-mc .nc-content img {
      max-width: 100%;
      height: auto; }

@media screen and (max-width: 750px) {
  .news-mc .nc-title {
    font-size: 24px;
    line-height: 40px; } }

.product-param {
  display: block;
  height: 100%;
  padding: 80px 0 140px;
  background: transparent url("../images/pr-bg1.jpg") center center no-repeat/cover; }
  .product-param .ht {
    text-align: center;
    font-size: 52px;
    font-weight: normal;
    color: #fff; }
  .product-param .list {
    margin: 60px auto 0;
    width: 700px;
    padding-left: 50px; }
    .product-param .list li {
      float: left;
      width: 50%;
      font-size: 20px;
      box-sizing: border-box;
      position: relative;
      margin-top: 15px;
      padding-left: 60px; }
      .product-param .list li:hover i:after {
        -webkit-animation: shandong 0.6s infinite linear;
        animation: shandong 0.6s infinite linear; }
    .product-param .list .t {
      color: #fff;
      line-height: 40px; }
    .product-param .list .d {
      color: #666;
      line-height: 40px; }
    .product-param .list i {
      position: absolute;
      left: 20px;
      top: 13px;
      width: 14px;
      height: 14px;
      background: #63B6EF;
      border-radius: 50%; }
      .product-param .list i:after {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        box-shadow: 0 0 25px 6px #469edf;
        content: "";
        border-radius: 50%; }

.product-info {
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  flex-direction: row;
  flex-wrap: nowrap;
  height: 720px; }
  .product-info .pic {
    width: 50%;
    position: relative;
    overflow: hidden;
    height: 100%; }
    .product-info .pic img, .product-info .pic .img {
      display: block;
      transition: all 0.3s;
      -webkit-transition: all 0.3s; }
    .product-info .pic:hover img, .product-info .pic:hover .img {
      -webkit-transform: scale(1.1);
      transform: scale(1.1); }
    .product-info .pic .img {
      position: relative;
      display: block;
      width: 100%;
      height: 100%;
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover; }
    .product-info .pic .picTxt {
      display: flex;
      justify-content: center;
      align-items: center;
      align-content: center;
      flex-direction: column;
      flex-wrap: nowrap;
      box-sizing: border-box;
      padding: 0 10%;
      color: #fff;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.4); }
    .product-info .pic .t {
      font-size: 40px; }
    .product-info .pic .d {
      font-size: 20px;
      line-height: 40px;
      margin-top: 30px; }
  .product-info .info {
    width: 50%;
    background: linear-gradient(135deg, #4296DE 0%, #8780DC 65%, #937CDC);
    height: 100%;
    box-sizing: border-box;
    padding: 0 4%;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    flex-direction: column;
    flex-wrap: nowrap; }
    .product-info .info .t {
      font-size: 40px;
      color: #fff;
      display: block; }
    .product-info .info .list {
      margin-top: 30px;
      padding: 0 3%;
      box-sizing: border-box;
      width: 100%; }
      .product-info .info .list li {
        float: left;
        width: 33.33%;
        margin-top: 25px; }
        .product-info .info .list li .icoblock {
          width: 132px;
          height: 132px;
          margin: 0 auto;
          display: flex;
          justify-content: center;
          align-items: center;
          align-content: center;
          flex-direction: row;
          flex-wrap: nowrap;
          background: linear-gradient(135deg, #937CDC, #8780DC, #4296DE);
          border-radius: 50%; }
          .product-info .info .list li .icoblock img {
            max-width: 100%;
            max-height: 100%; }
        .product-info .info .list li .txt {
          text-align: center;
          font-size: 20px;
          line-height: 30px;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          color: #fff;
          padding: 10px 0; }

@media screen and (max-width: 750px) {
  .product-param .ht {
    font-size: 36px; }
  .product-param .list {
    width: auto;
    padding-left: 0; }
    .product-param .list li {
      font-size: 16px; }
  .product-info {
    display: block;
    height: auto; }
    .product-info .pic {
      width: 100vw;
      height: 100vw; }
    .product-info .info {
      width: auto;
      padding: 50px 0;
      height: auto; }
      .product-info .info .list li {
        width: 50%; } }

.about-intro {
  padding: 130px 0; }
  .about-intro .wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    flex-direction: row;
    flex-wrap: nowrap; }
  .about-intro .info {
    width: 65%; }
    .about-intro .info .t {
      font-size: 30px;
      margin-bottom: 20px;
      color: #0B1F46; }
    .about-intro .info .d {
      font-size: 14px;
      color: #535353;
      line-height: 32px; }
  .about-intro .pic {
    width: 30%; }
    .about-intro .pic img {
      display: block;
      width: 100%; }

.about-param {
  background: #eee;
  padding: 80px 0 50px; }
  .about-param .ht {
    font-size: 30px;
    font-weight: normal;
    color: #666;
    text-align: center; }
  .about-param .list {
    margin: 40px 5% 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    align-content: center;
    flex-direction: row;
    flex-wrap: nowrap; }
    .about-param .list li {
      width: 33.33%;
      height: 100%;
      box-sizing: border-box;
      padding: 0 1%;
      /*border-left: 1px solid #999;*/ }
      .about-param .list li:first-child {
        border-left: 0; }
    .about-param .list img {
      display: block;
      width: 100%;
      height: 286px;
      margin: 0 auto; }
    .about-param .list .t {
      margin-top: 15px;
      text-align: center;
      font-size: 18px;
      color: #666; }
    .about-param .list .d {
      margin-top: 10px;
      text-align: center;
      font-size: 12px;
      color: #999; }
  .about-param .desp {
    margin: 50px 5% 0;
    font-size: 13px;
    color: #777;
    line-height: 30px;
    text-align: center; }

.about-history {
  padding: 80px 0; }
  .about-history .ht {
    font-size: 30px;
    font-weight: normal;
    color: #0B1F46;
    text-align: center; }
  .about-history .list {
    padding: 50px 0;
    overflow: hidden; }
    .about-history .list li {
      position: relative;
      text-align: right;
      display: flex;
      justify-content: flex-start;
      align-items: center;
      align-content: center;
      flex-direction: row;
      flex-wrap: nowrap;
      padding-bottom: 40px; }
      .about-history .list li:before {
        content: "";
        position: absolute;
        left: 50%;
        top: 0;
        margin-left: -1px;
        height: 18px;
        height: 100%;
        width: 2px;
        background: #63B6EF; }
      .about-history .list li:after {
        content: "";
        position: absolute;
        left: 50%;
        top: 0;
        width: 18px;
        height: 18px;
        border: 4px solid #63B6EF;
        border-radius: 50%;
        background: #fff;
        box-sizing: border-box;
        margin-left: -9px; }
      .about-history .list li:nth-child(2n) {
        justify-content: flex-end;
        text-align: left; }
      .about-history .list li:last-child:before {
        display: none; }
    .about-history .list .info {
      position: relative;
      top: -10px;
      width: calc(50% - 30px); }
    .about-history .list .t {
      font-size: 37px;
      line-height: 37px;
      color: #63B6EF; }
    .about-history .list .d {
      margin-top: 10px;
      font-size: 12px;
      color: #999; }

@media screen and (max-width: 750px) {
  .about-intro {
    padding: 50px 0; }
    .about-intro .wrap {
      display: block; }
    .about-intro .info {
      width: auto; }
    .about-intro .pic {
      width: auto; }
  .about-param .list {
    display: block; }
    .about-param .list li {
      width: 100%;
      border-left: 0;
      margin-bottom: 20px; } }

.skillTop {
  padding: 50px 0;
  text-align: center;
  background: #eaeaea; }
  .skillTop .t {
    font-size: 54px;
    margin-bottom: 20px;
    color: #000;
    font-weight: normal; }
  .skillTop .d {
    font-size: 24px;
    color: #000;
    line-height: 32px;
    font-weight: normal; }
  .skillTop .pic {
    margin-top: 50px; }
    .skillTop .pic img {
      display: block;
      max-width: 100%;
      margin: 0 auto; }

.skillCenter {
  padding: 70px 0 0;
  text-align: center;
  background: #000; }
  .skillCenter .t {
    font-size: 50px;
    margin-bottom: 20px;
    color: #fff;
    font-weight: normal; }
  .skillCenter .d {
    font-size: 19px;
    color: #ccc;
    line-height: 32px;
    font-weight: normal; }
  .skillCenter .list {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    flex-direction: row;
    flex-wrap: nowrap;
    margin-top: 60px; }
    .skillCenter .list li {
      flex: 1;
      position: relative;
      overflow: hidden;
      position: relative; }
      .skillCenter .list li img, .skillCenter .list li .img {
        display: block;
        transition: all 0.3s;
        -webkit-transition: all 0.3s; }
      .skillCenter .list li:hover img, .skillCenter .list li:hover .img {
        -webkit-transform: scale(1.1);
        transform: scale(1.1); }
    .skillCenter .list img {
      width: 100%; }
    .skillCenter .list .laybg {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }
      .skillCenter .list .laybg:before {
        content: "";
        z-index: 1;
        transition: all 0.3s;
        -webkit-transition: all 0.3s;
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 40%;
        background: linear-gradient(transparent 0%, rgba(0, 0, 0, 0.9) 70%, black 100%); }
      .skillCenter .list .laybg span {
        position: absolute;
        z-index: 2;
        left: 0;
        bottom: 35px;
        font-size: 28px;
        color: #fff;
        width: 100%;
        text-align: center; }

.zyimg-info {
  display: flex;
  justify-content: center;
  align-items: stretch;
  align-content: center;
  flex-direction: row;
  flex-wrap: nowrap; }
  .zyimg-info .pic {
    width: 50%;
    position: relative;
    overflow: hidden; }
    .zyimg-info .pic img, .zyimg-info .pic .img {
      display: block;
      transition: all 0.3s;
      -webkit-transition: all 0.3s; }
    .zyimg-info .pic:hover img, .zyimg-info .pic:hover .img {
      -webkit-transform: scale(1.1);
      transform: scale(1.1); }
    .zyimg-info .pic img {
      display: block;
      width: 100%; }
  .zyimg-info .info {
    width: 50%;
    background: linear-gradient(135deg, #4296DE 0%, #8780DC 65%, #937CDC);
    box-sizing: border-box;
    padding: 0 4%;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    flex-direction: column;
    flex-wrap: nowrap; }
    .zyimg-info .info .t {
      font-size: 40px;
      color: #fff;
      display: block; }
    .zyimg-info .info .d {
      font-size: 20px;
      line-height: 40px;
      margin-top: 40px;
      text-align: center;
      color: #fff;
      display: block; }
  .zyimg-info:nth-child(2n) {
    flex-direction: row-reverse; }

@media screen and (max-width: 750px) {
  .skillCenter .list {
    margin-top: 40px;
    display: block; }
  .zyimg-info {
    display: block; }
    .zyimg-info .pic {
      width: 100%; }
    .zyimg-info .info {
      width: 100%;
      padding: 70px 4%; } }

.contactView {
  padding: 70px 0 100px;
  background: #3C9CDB;
  color: #fff; }
  .contactView .t {
    font-size: 30px;
    font-weight: normal; }
  .contactView .d {
    font-size: 18px;
    line-height: 42px;
    margin-top: 30px; }
  .contactView .cshare {
    margin-top: 30px; }
    .contactView .cshare a {
      display: flex;
      justify-content: center;
      align-items: center;
      align-content: center;
      flex-direction: row;
      flex-wrap: nowrap;
      float: left;
      border: 2px solid #fff;
      border-radius: 50%;
      box-sizing: border-box;
      width: 58px;
      height: 58px;
      margin-right: 30px; }
    .contactView .cshare img {
      display: block;
      width: 34px;
      height: 34px; }

.bdmap {
  height: 500px; }

.zhaopin-page {
  padding: 100px 0 170px; }
  .zhaopin-page .zhaop-des {
    width: 50%; }
    .zhaopin-page .zhaop-des .t {
      font-size: 26px;
      font-weight: normal;
      color: #212121; }
    .zhaopin-page .zhaop-des .d {
      margin-top: 40px;
      font-size: 15px;
      line-height: 24px;
      color: #212121; }
  .zhaopin-page .zhaop-views {
    margin-top: 100px; }
    .zhaopin-page .zhaop-views .showList {
      float: left;
      width: 47%; }
      .zhaopin-page .zhaop-views .showList dt {
        height: 60px;
        line-height: 60px;
        cursor: pointer;
        position: relative;
        margin-bottom: 5px;
        background: #F8F8F8;
        transition: all 0.3s;
        -webkit-transition: all 0.3s;
        padding: 0 15px;
        font-size: 14px;
        color: #222; }
        .zhaopin-page .zhaop-views .showList dt:after {
          content: "";
          position: absolute;
          top: 10px;
          left: 104%;
          width: 51px;
          height: 30px;
          background: url(../images/blue-arr.png) no-repeat;
          transition: all 0.3s;
          -webkit-transition: all 0.3s;
          opacity: 0;
          -webkit-transform: translate(-100%, 0);
          transform: translate(-100%, 0); }
      .zhaopin-page .zhaop-views .showList dl:hover dt, .zhaopin-page .zhaop-views .showList dl.on dt {
        background: #000;
        color: #fff; }
        .zhaopin-page .zhaop-views .showList dl:hover dt:after, .zhaopin-page .zhaop-views .showList dl.on dt:after {
          opacity: 1;
          -webkit-transform: translate(0, 0);
          transform: translate(0, 0); }
      .zhaopin-page .zhaop-views .showList dd {
        display: none; }
    .zhaopin-page .zhaop-views .showInfo {
      float: right;
      width: 45%;
      font-size: 14px;
      color: #636363;
      line-height: 24px; }
      .zhaopin-page .zhaop-views .showInfo .panel {
        display: none; }
      .zhaopin-page .zhaop-views .showInfo .panel.on {
        display: block; }

@media screen and (max-width: 750px) {
  .zhaopin-page {
    margin: 0;
    padding: 50px 10px; }
    .zhaopin-page .zhaop-des {
      width: auto; }
    .zhaopin-page .zhaop-views {
      margin-top: 60px; }
      .zhaopin-page .zhaop-views .showList {
        float: none;
        width: auto; }
        .zhaopin-page .zhaop-views .showList dl.on dd {
          display: block;
          padding: 10px;
          font-size: 13px;
          color: #636363;
          line-height: 18px; }
      .zhaopin-page .zhaop-views .showInfo {
        display: none; } }

.header {
  position: fixed;
  top: 0;
  background: #02155b;
  z-index: 100;
  left: 0;
  width: 100%;
  height: 85px;
  box-sizing: border-box;
  /*background: rgb(2 21 91 / 83%);*/
  opacity:0.83;
}
  
  .header .hh-logo {
    float: left;
    margin-top: 15px; }
    .header .hh-logo img {
      display: block;
      height: 54px; }
  .header .mlink {
    float: left;
    width: 100px;
    text-align: center;
    color: #fff;
    font-size: 15px;
    line-height: 90px;
    transition: all 0.3s;
    -webkit-transition: all 0.3s; }
    .header .mlink:hover {
      color: #63B6EF; }
  .header .hh-menus {
    float: right;
    height: 85px;
    margin-right: 40px; }
    .header .hh-menus dl {
      position: relative;
      text-align: center;
      float: left; }
      .header .hh-menus dl dt {
        float: left;
        display: block;
        position: relative;
        z-index: 1; }
        .header .hh-menus dl dt a {
          font-size: 18px;
          padding: 0 20px;
          height: 85px;
          color: #fff;
          display: block;
          line-height: 85px;
          transition: all 0.3s;
          -webkit-transition: all 0.3s; }
      .header .hh-menus dl dd {
        position: absolute;
        top: 85px;
        left: 0;
        box-sizing: border-box;
        width: 240px;
        background-color: #022a70e3;
        color: #fff;
        text-align: left;
        opacity: 0;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
        pointer-events: none;
        transition: all 0.3s;
        -webkit-transition: all 0.3s; }
        .header .hh-menus dl dd a {
          display: block;
          padding: 8px 20px;
          border-top: 1px solid #2982e6;
          font-size: 14px;
          color: #fff;
          line-height: 30px;
          transition: all 0.3s;
          -webkit-transition: all 0.3s;
          position: relative; }
          .header .hh-menus dl dd a:first-child {
            border-top: 0; }
          .header .hh-menus dl dd a:hover {
            color: #fff;
            background: #044b9b; }
          .header .hh-menus dl dd a:hover:after {
            -webkit-transform: translate(15px, 0);
            transform: translate(15px, 0); }
      .header .hh-menus dl:hover dt a, .header .hh-menus dl.on dt a {
        color: #63B6EF; }
      .header .hh-menus dl:hover dd {
        pointer-events: auto;
        opacity: 1; }
      .header .hh-menus dl .gezi {
        float: left;
        width: 46%;
        margin: 0 2%; }
  .header .hh-lang {
    float: right;
    margin-top: 26px; }
    .header .hh-lang a {
      display: block;
      transition: all 0.3s;
      -webkit-transition: all 0.3s;
      line-height: 24px;
      height: 24px;
      text-align: center;
      color: #fff;
      border-radius: 5px;
      border: 1px solid #fff;
      box-sizing: border-box;
      padding:0 10px;}
      .header .hh-lang a:hover {
        color: #63B6EF;
        border-color: #63B6EF; }

.m-toper {
  display: none;
  height: 60px;
  position: fixed;
  left: 0;
  background: #000;
  width: 100%;
  top: 0;
  z-index: 100;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); }
  .m-toper .hh-logo {
    float: left;
    margin-top: 5px;
    margin-right: 10px; }
    .m-toper .hh-logo img {
      display: block;
      height: 40px; }

.m-header {
  position: fixed;
  display: none;
  pointer-events: none;
  top: 60px;
  bottom: 0;
  left: 0;
  z-index: 100;
  width: 100%; }
  .m-header .m-header-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    pointer-events: none; }
  .m-header .m-header-box {
    margin-left: 100%;
    width: 80%;
    background: #fff;
    position: relative;
    z-index: 1;
    height: 100%;
    overflow: hidden;
    overflow-y: auto;
    transition: all 0.3s;
    -webkit-transition: all 0.3s; }
  .m-header .hh-menus dl {
    position: relative;
    border-bottom: 1px solid #af783c; }
    .m-header .hh-menus dl dt a {
      display: block;
      background: #63B6EF;
      height: 45px;
      line-height: 45px;
      padding: 0 15px;
      font-size: 14px;
      color: #fff; }
    .m-header .hh-menus dl dd {
      padding: 8px 0;
      width: auto !important;
      display: none; }
      .m-header .hh-menus dl dd .gezi:nth-child(n+2) {
        padding-top: 8px;
        margin-top: 8px;
        border-top: 2px dotted #63B6EF; }
      .m-header .hh-menus dl dd a {
        display: block;
        line-height: 20px;
        padding: 6px 10px;
        margin-left: 10px;
        font-size: 13px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis; }
      .m-header .hh-menus dl dd .brand a {
        font-weight: normal;
        font-size: 14px;
        line-height: 24px;
        border-bottom: 1px dashed #ddd; }
    .m-header .hh-menus dl:hover dt a, .m-header .hh-menus dl.on dt a {
      background: #63B6EF; }
    .m-header .hh-menus dl:hover dd, .m-header .hh-menus dl.on dd {
      display: block; }
  .m-header.over .m-header-layer {
    opacity: 1;
    pointer-events: auto; }
  .m-header.over .m-header-box {
    -webkit-transform: translate(-100%, 0);
    transform: translate(-100%, 0); }

.footer {
  color: #fff;
  width: 100%;
  background: #202635; }
  .footer .foot-center {
    padding-top: 60px; }
    .footer .foot-center .ftc-logo {
      float: left;
      margin-top: 30px; }
      .footer .foot-center .ftc-logo img {
        height: 54px;
        display: block; }
    .footer .foot-center .ftc-rbox {
      display: flex;
      justify-content: flex-end;
      align-items: flex-start;
      align-content: center;
      flex-direction: row;
      flex-wrap: nowrap;
      margin-left: 250px; }
    .footer .foot-center .ftc-menu {
      float: left;
      width: 200px;
      padding-right: 20px;
      box-sizing: border-box; }
      .footer .foot-center .ftc-menu .dt {
        font-size: 16px;
        color: #fff;
        padding-top: 25px;
        padding-bottom: 18px;
        line-height: 26px;
        position: relative; }
        .footer .foot-center .ftc-menu .dt:after {
          position: absolute;
          left: 0;
          content: "";
          top: 0;
          height: 3px;
          background: #fff;
          width: 45px; }
      .footer .foot-center .ftc-menu .dda {
        font-size: 13px;
        line-height: 25px;
        color: #999;
        display: block;
        transition: all 0.3s;
        -webkit-transition: all 0.3s; }
        .footer .foot-center .ftc-menu .dda:hover {
          color: #63B6EF; }
    .footer .foot-center .ftc-share {
      float: left;
      margin-left: 10%;
      line-height: 25px;
      color: #ccc; }
    .footer .foot-center .ftc-codes {
      padding-right: 0;
      margin-left: 40px; }
      .footer .foot-center .ftc-codes .srCode img {
        width: 130px;
        display: block; }
      .footer .foot-center .ftc-codes span {
        color: #ccc;
        display: block;
        font-size: 13px;
        margin-top: 10px; }
  .footer .gtd-share {
    overflow: hidden;
    padding-top: 20px;
    margin-top: 20px; }
    .footer .gtd-share .xshare-icon {
      display: inline-block;
      width: 24px;
      height: 24px;
      margin: 0 10px; }
      .footer .gtd-share .xshare-icon img {
        display: block;
        width: 100%;
        height: 100%; }
  .footer .bottomCopyr {
    padding: 10px 0;
    line-height: 36px;
    font-size: 12px;
    color: #aaa; }
    .footer .bottomCopyr a {
      color: #aaa;
      transition: all 0.3s;
      -webkit-transition: all 0.3s; }
      .footer .bottomCopyr a:hover {
        color: #63B6EF; }
    .footer .bottomCopyr .vby {
      color: #5a5a5a;
      margin-left: 15px; }
    .footer .bottomCopyr .beian {
      float: right; }
  .footer .qme {
    position: absolute;
    font-size: 15px;
    right: 100px;
    overflow: hidden;
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    height: 40px;
    top: -40px;
    background: #9F7917;
    color: #fff;
    line-height: 40px;
    width: 180px;
    text-align: center; }
    .footer .qme a {
      color: #fff;
      display: block;
      height: 40px;
      line-height: 40px; }
    .footer .qme i {
      font-size: 28px;
      margin-right: 5px;
      vertical-align: middle; }
    .footer .qme .info {
      height: 180px;
      width: 180px;
      background: #fff;
      box-sizing: border-box;
      padding: 10px; }
      .footer .qme .info img {
        width: 160px;
        height: 160px; }
  .footer .qme:hover {
    height: 220px; }

.backTop {
  width: 58px;
  z-index: 100;
  opacity: 0;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
  pointer-events: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  height: 58px;
  position: fixed;
  bottom: 20px;
  right: 20px;
  background-color: #fff;
  border-radius: 50%;
  text-align: center;
  color: #000;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  flex-direction: row;
  flex-wrap: nowrap; }
  .backTop i {
    font-size: 45px;
    line-height: 45px; }
  .backTop:hover {
    background-color: #63B6EF;
    color: #fff; }
  .backTop.over {
    opacity: 1;
    pointer-events: auto; }

@media screen and (max-width: 750px) {
  .toper, .header {
    display: none; }
  .m-toper, .m-header {
    display: block; }
  .m-header.over {
    pointer-events: auto; }
  .pageBox {
    transition: all 0.3s;
    -webkit-transition: all 0.3s; }
    .pageBox.out {
      -webkit-transform: translate(-80%, 0);
      transform: translate(-80%, 0); }
  .foot-center {
    display: none; }
  .wap-menu-mask {
    position: absolute;
    z-index: 90;
    top: 60px;
    width: 100%;
    bottom: 0;
    pointer-events: none; }
  .wap-menu-mask.open {
    pointer-events: auto; }
  .m-pulleft {
    transition: all 0.3s;
    -webkit-transition: all 0.3s; }
  .m-pulleft.close {
    -webkit-transform: translate(-80%, 0);
    transform: translate(-80%, 0); } }

.home-pageIn {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden; }
  .home-pageIn .videobox {
    width: 1920px;
    height: 1080px;
    position: absolute;
    left: 50%;
    margin-left: -960px;
    top: 50%;
    margin-top: -540px; }
    .home-pageIn .videobox video {
      width: 1920px;
      height: 1080px;
      pointer-events: none; }

.crumbsTab {
  line-height: 32px;
  background: #fff;
  padding: 34px 0;
  box-sizing: content-box; }
  .crumbsTab .crumb {
    float: left;
    font-size: 14px; }
    .crumbsTab .crumb a {
      display: block;
      float: left;
      color: #111;
      transition: all 0.3s;
      -webkit-transition: all 0.3s; }
      .crumbsTab .crumb a:hover {
        color: #63B6EF; }
    .crumbsTab .crumb i {
      float: left;
      margin: 0 15px;
      color: #333; }
    .crumbsTab .crumb span {
      float: left;
      color: #63B6EF; }

.leTitle {
  height: 150px;
  line-height: 150px;
  text-align: center;
  font-size: 30px;
  font-weight: normal;
  color: #000;
  background: url(../images/title-shop.png) no-repeat center center/contain; }

@media screen and (max-width: 750px) {
  .crumbsTab {
    padding: 5px 10px 5px 5px; }
  .leTitle {
    height: 120px;
    line-height: 120px; } }

.comViews {
  padding: 150px 0;
  position: relative;
  color: #fff;
  text-align: center;
  background: transparent url(../images/hbg-1.png) center center no-repeat/cover;
  background-attachment: fixed; }
  .comViews:before {
    content: "";
    background: rgba(40, 57, 144, 0.8);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
  .comViews .wrap {
    position: relative;
    z-index: 1; }
  .comViews .cvtitle {
    font-size: 30px;
    font-weight: normal; }
  .comViews .info {
    font-size: 16px;
    line-height: 36px;
    margin-top: 50px; }
  .comViews .alinks {
    margin-top: 40px; }
    .comViews .alinks a {
      margin: 0 10px; }
    .comViews .alinks .abtn-bd {
      display: inline-block;
      width: 220px;
      height: 56px;
      border: 2px solid #fff;
      background: none;
      color: #fff;
      text-align: center;
      cursor: pointer;
      font-size: 15px;
      box-sizing: border-box;
      line-height: 54px;
      transition: all 0.3s;
      -webkit-transition: all 0.3s; }
      .comViews .alinks .abtn-bd:hover {
        background: #63B6EF; }
    .comViews .alinks .abtn-vv {
      display: inline-block;
      width: 180px;
      height: 56px;
      border: none;
      background: #111;
      color: #fff;
      text-align: center;
      cursor: pointer;
      font-size: 15px;
      box-sizing: border-box;
      line-height: 56px;
      transition: all 0.3s;
      -webkit-transition: all 0.3s; }
      .comViews .alinks .abtn-vv:hover {
        background: #63B6EF; }

@media screen and (max-width: 750px) {
  .comViews {
    padding: 80px 0; } }

.ceTitle {
  text-align: center;
  font-size: 42px;
  font-weight: normal;
  padding-bottom: 15px;
  position: relative;
  margin-bottom: 20px;
  color: #333; }
  .ceTitle:after {
    position: absolute;
    width: 36px;
    height: 3px;
    left: 50%;
    margin-left: -18px;
    bottom: 0;
    background: #333;
    content: ""; }

.pageTurning {
  text-align: center;
  margin-bottom: 80px;
  margin-top: 20px; }
  .pageTurning a {
    display: inline-block;
    margin: 0 30px;
    padding: 0 5px;
    font-size: 18px;
    color: #333;
    transition: all 0.3s;
    -webkit-transition: all 0.3s; }
    .pageTurning a:hover {
      color: #63B6EF; }

.pageMore {
  display: block;
  margin-top: 20px;
  text-align: center;
  padding-bottom: 50px; }
  .pageMore .loadMore {
    display: inline-block;
    width: 168px;
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    height: 52px;
    border: 1px solid #bbb;
    font-size: 16px;
    text-align: center;
    color: #444;
    line-height: 52px; }
    .pageMore .loadMore:hover {
      background: #63B6EF;
      border-color: #63B6EF;
      color: #fff; }
  .pageMore .supporting {
    display: none; }

.pageMore-reverse .loadMore {
  color: #fff; }
