@charset "UTF-8";

.w1200 {

  width: 12rem;

  margin: 0 auto;

  position: relative;

  font-size: 0;

  max-width: 100%; }



@media (max-width: 1220px) {

  .w1200 {

    width: 90%; } }

@media (max-width: 800px) {

  .w1200 {

    width: 94%; } }

:root {

  --themes: #064e95; }



.head {

  width: 100%;

  background-color: var(--themes);

  position: fixed;

  top: 0;

  left: 0;

  z-index: 21; }

  .head .hem {

    width: 100%;

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between;

    align-items: center; }

    .head .hem .hml {

      display: inline-block;

      vertical-align: middle;

      color: rgba(255, 255, 255, 0.6);

      line-height: 3; }

    .head .hem .hmr {

      display: inline-block;

      vertical-align: middle; }

      .head .hem .hmr .share {

        display: inline-block;

        vertical-align: middle;

        font-size: 0;

        width: auto; }

        .head .hem .hmr .share .am {

          display: inline-block;

          vertical-align: middle;

          width: 0.19rem;

          height: 0.19rem;

          margin-left: 0.2rem;

          position: relative;

          transition: all ease 0.6s;

          opacity: 0.6;

          min-height: 16px;

          min-width: 16px; }

          .head .hem .hmr .share .am img {

            width: 100%;

            display: block; }

          .head .hem .hmr .share .am .dome {

            position: absolute;

            top: calc(100% + 0.1rem);

            left: 50%;

            transform: translateX(-50%);

            width: 1.3rem;

            height: 1.3rem;

            background-color: #fff;

            border-radius: 0.05rem;

            padding: 0.1rem;

            display: none; }

            .head .hem .hmr .share .am .dome img {

              width: 100%;

              display: block; }

        .head .hem .hmr .share .am:hover {

          opacity: 1; }

          .head .hem .hmr .share .am:hover .dome {

            display: block; }



header {

  width: 100%;

  position: fixed;

  top: 0;

  z-index: 20;

  background-color: #004c92;

  transition: all ease 0.5s;

  box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, 0.27); }

  header .hop {

    width: 100%;

    display: flex;

    flex-wrap: wrap;

    align-items: center; }

  header .logo {

    display: inline-block;

    vertical-align: middle;

    width: 1.28rem; }

    header .logo a, header .logo img {

      width: 100%;

      display: block; }

  header .rav {

    display: inline-block;

    vertical-align: middle;

    width: auto; }

    header .rav .menu {

      display: none; }

    header .rav .search {

      display: inline-block;

      vertical-align: middle;

      width: auto;

      text-align: center;

      cursor: pointer;

      position: relative;

      margin-left: 0.2rem;

      width: 0.28rem;

      height: 1rem; }

      header .rav .search .sc {

        display: inline-block;

        vertical-align: middle;

        width: 0.28rem;

        min-width: 20px;

        min-height: 20px;

        position: absolute;

        left: 50%;

        top: 50%;

        transform: translate(-50%, -50%);

        z-index: 3; }

        header .rav .search .sc img {

          width: 100%;

          display: block; }

    header .rav .sechom {

      position: absolute;

      z-index: 3;

      right: 0;

      width: 4rem;

      background-color: #fff;

      box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.09);

      padding: 0.1rem;

      top: 100%;

      display: none; }

      header .rav .sechom form {

        width: 100%;

        display: block;

        font-size: 0; }

      header .rav .sechom .input {

        display: inline-block;

        vertical-align: middle;

        width: calc(100% - 2.4em - 0.2rem);

        border: solid 1px #e5e5e5;

        margin-right: 0.2rem; }

        header .rav .sechom .input .int {

          width: 100%;

          display: block;

          background-color: #fff;

          line-height: 2.4;

          height: 2.4em;

          color: #111;

          padding: 0 0.1rem;

          border: none;

          background-color: #fff; }

      header .rav .sechom .stn {

        display: inline-block;

        vertical-align: middle;

        width: 2.2em;

        height: 2.2em;

        border-radius: 50%;

        background-color: var(--themes);

        position: relative; }

        header .rav .sechom .stn img {

          position: absolute;

          top: 50%;

          left: 50%;

          transform: translate(-50%, -50%);

          width: 22px;

          height: 21px;

          width: 0.22rem;

          height: 0.21rem;

          display: block;

          border-radius: 50%;

          cursor: pointer;

          z-index: 1;

          filter: grayscale(100%) brightness(400%); }

        header .rav .sechom .stn input {

          position: absolute;

          top: 0;

          left: 0;

          width: 100%;

          height: 100%;

          display: block;

          border-radius: 50%;

          cursor: pointer;

          z-index: 3;

          opacity: 0; }

    header .rav .languages {

      width: auto;

      display: inline-block;

      vertical-align: middle;

      font-size: 0;

      margin: 0 0.1rem;

      text-align: left;

      margin-right: 0rem; }

      header .rav .languages .lauges {

        width: 100%;

        display: inline-block;

        vertical-align: middle;

        position: relative; }

        header .rav .languages .lauges .lashow {

          width: 100%;

          color: #333;

          position: relative;

          cursor: pointer;

          font-size: 0;

          padding-right: 20px; }

          header .rav .languages .lauges .lashow .ac {

            display: inline-block;

            vertical-align: middle;

            width: 0.2rem;

            height: 0.2rem;

            width: 20px;

            height: 20px;

            margin-right: 0.1rem; }

            header .rav .languages .lauges .lashow .ac img {

              width: 100%;

              display: block; }

          header .rav .languages .lauges .lashow .am {

            color: #fff;

            line-height: 0.8rem;

            display: inline-block;

            vertical-align: middle;

            width: auto; }

          header .rav .languages .lauges .lashow:after {

            content: ' ';

            position: absolute;

            right: 0rem;

            top: calc(49% + 0.015rem);

            transform: translateY(-50%);

            background-image: url("../images/x.png");

            width: 10px;

            height: 6px;

            background-size: 100%; }

        header .rav .languages .lauges .lashow:hover .am {

          color: #fff; }

        header .rav .languages .lauges .language {

          position: absolute;

          z-index: 10;

          top: 100%;

          width: 100%;

          display: none;

          width: 60px;

          width: 1rem;

          left: 50%;

          transform: translateX(-50%);

          border-radius: 0 0 0.1rem 0.1rem;

          overflow: hidden; }

          header .rav .languages .lauges .language .latem {

            width: 100%; }

            header .rav .languages .lauges .language .latem a {

              width: 100%;

              display: block;

              color: #333;

              padding: 0 0.1rem;

              line-height: 3;

              text-align: center;

              position: relative;

              background: #efefef;

              overflow: hidden; }

              header .rav .languages .lauges .language .latem a span {

                display: inline-block;

                vertical-align: middle;

                position: relative;

                z-index: 2; }

              header .rav .languages .lauges .language .latem a:after {

                content: "";

                position: absolute;

                width: 140%;

                height: 100%;

                left: -10%;

                top: 0;

                z-index: -1;

                background: #fff;

                z-index: 1; }

            header .rav .languages .lauges .language .latem a:hover {

              color: #fff; }

              header .rav .languages .lauges .language .latem a:hover span {

                color: #fff; }

              header .rav .languages .lauges .language .latem a:hover:after {

                background-color: var(--themes); }

          header .rav .languages .lauges .language .latem:last-child {

            border-radius: 0 0 0.1rem 0.1rem;

            overflow: hidden; }

    header .rav .carts {

      display: inline-block;

      vertical-align: middle;

      margin: 0 0.18rem;

      display: none; }

      header .rav .carts .ctn {

        display: inline-block;

        vertical-align: middle;

        width: 0.28rem;

        height: 0.28rem;

        min-width: 20px;

        min-height: 20px;

        position: relative; }

        header .rav .carts .ctn .ad, header .rav .carts .ctn img {

          width: 100%;

          display: block; }

        header .rav .carts .ctn .num {

          position: absolute;

          right: -0.5em;

          top: -0.5em;

          width: 1.2em;

          height: 1.2em;

          line-height: 1.2;

          border-radius: 50%;

          background-color: var(--themes);

          color: #fff;

          text-align: center;

          z-index: 3; }

  header nav {

    display: inline-block;

    vertical-align: middle;

    flex: 1;

    text-align: center; }

    header nav .natem {

      width: auto;

      display: inline-block;

      vertical-align: middle;

      position: relative;

      text-align: center;

      font-size: 0; }

      header nav .natem .nas {

        width: auto;

        display: inline-block;

        position: relative;

        margin: 0 0.15rem; }

        header nav .natem .nas a {

          display: inline-block;

          line-height: 1rem;

          color: #fff;

          position: relative;

          padding: 0 0.15rem; }

        header nav .natem .nas:after {

          content: ' ';

          position: absolute;

          left: 50%;

          bottom: 0.25rem;

          transform: translateX(-50%);

          opacity: 0;

          width: 0.2rem;

          height: 0.07rem;

          transition: all ease 0.5s;

          background-image: url("../images/y.png");

          background-size: 100% 100%; }

      header nav .natem .navuls {

        width: 2.2rem;

        width: 1.8rem;

        position: absolute;

        z-index: 101;

        left: calc(50%);

        top: 100%;

        transform: translateX(-50%);

        background-color: white;

        display: none;

        border-radius: 0 0 0.1rem 0.1rem;

        overflow: hidden; }

        header nav .natem .navuls ul {

          width: 100%; }

          header nav .natem .navuls ul li {

            width: 100%;

            position: relative; }

            header nav .natem .navuls ul li .njm {

              width: 100%;

              font-size: 0;

              background-color: rgba(255, 255, 255, 0.5); }

            header nav .natem .navuls ul li .ns {

              width: 100%;

              display: inline-block;

              vertical-align: middle;

              line-height: 3;

              color: #222;

              text-align: left;

              text-overflow: ellipsis;

              overflow: hidden;

              white-space: nowrap;

              padding: 0 0.1rem;

              position: relative;

              text-align: center;

              background-color: rgba(255, 255, 255, 0.5); }

            header nav .natem .navuls ul li .theul {

              width: 100%;

              background-color: #fff;

              display: none; }

              header nav .natem .navuls ul li .theul li {

                width: 100%;

                font-size: 0; }

                header nav .natem .navuls ul li .theul li .xn {

                  display: inline-block;

                  vertical-align: middle;

                  color: #333;

                  line-height: 2.5;

                  padding: 0 0.2rem; }

                header nav .natem .navuls ul li .theul li .xn:hover {

                  color: #333; }

          header nav .natem .navuls ul li:hover .ns {

            background-color: var(--themes);

            color: #fff; }

          header nav .natem .navuls ul li.has-the:after {

            content: "+";

            display: inline-block;

            width: 36px;

            height: 36px;

            line-height: 36px;

            text-align: center;

            position: absolute;

            background: none;

            right: 0;

            left: auto;

            transform: translateX(0);

            top: 0.05rem;

            font-size: 20px;

            color: #333;

            border: none;

            display: none; }

          header nav .natem .navuls ul li.has-the.show:after {

            content: "-"; }

    header nav .natem.on .nas a {

      color: #ffffff;

      font-weight: bold; }

    header nav .natem.on .nas:after {

      opacity: 1; }

    header nav .natem:hover .nas a {

      color: #fff;

      font-weight: bold; }

    header nav .natem:hover .nas:after {

      opacity: 1; }



@media (max-width: 800px) {

  header nav {

    width: 100%;

    position: fixed;

    right: 0;

    top: calc(0.9rem);

    left: auto;

    height: calc(100vh - 0.9rem);

    background-color: #fff;

    margin-right: 0;

    overflow: auto;

    z-index: 500;

    transition: transform .3s;

    padding: 0rem 0.2rem;

    display: block;

    text-align: left;

    display: none;

    border-top: solid 1px #e5e5e5; }

    header nav .natem {

      display: inline-block;

      vertical-align: middle;

      position: relative;

      width: auto;

      width: 100%;

      padding: 0.1rem 0;

      opacity: 0;

      transform: translate(-10px, -30px);

      transition: all .8s ease; }

      header nav .natem .nas {

        width: auto;

        display: inline-block;

        text-align: left;

        width: 100%;

        margin: 0; }

        header nav .natem .nas a {

          width: auto;

          display: inline-block;

          vertical-align: middle;

          line-height: 2.5;

          color: #333;

          font-weight: bold;

          font-family: 'Alibaba-PuHuiTi-Bold';

          padding: 0 0.3rem;

          position: relative; }

        header nav .natem .nas .ik {

          display: none !important; }

        header nav .natem .nas a:hover {

          color: var(--themes);

          background-color: transparent; }

      header nav .natem .navuls {

        width: 100%;

        position: relative;

        z-index: 101;

        left: 0%;

        top: 0%;

        transform: translateX(0%);

        background: #fff;

        box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.09);

        display: none;

        text-align: left; }

        header nav .natem .navuls ul {

          width: 100%;

          padding: 0.1rem 0.2rem; }

          header nav .natem .navuls ul li {

            width: 100%;

            display: block;

            position: relative;

            margin-bottom: 0; }

            header nav .natem .navuls ul li .ns {

              width: auto;

              display: inline-block;

              vertical-align: middle;

              line-height: 3;

              color: #333;

              text-align: left !important;

              text-overflow: ellipsis;

              overflow: hidden;

              white-space: nowrap;

              padding: 0 0.2rem;

              background: #fff;

              position: relative; }

            header nav .natem .navuls ul li .ns:hover {

              color: var(--themes); }

          header nav .natem .navuls ul li + li {

            border-top: solid 1px #eee; }

          header nav .natem .navuls ul li:hover .ns {

            background-color: transparent;

            color: var(--themes); }

          header nav .natem .navuls ul li.has-the:after {

            display: block; }

      header nav .natem:before {

        display: none !important; }

      header nav .natem .prosubnav {

        display: none; }

    header nav .natem.on .nas:after {

      display: none; }

    header nav .natem.has-nav .nas .xs {

      display: none; }

    header nav .natem.has-nav:after {

      content: "+";

      display: inline-block;

      width: 36px;

      height: 36px;

      line-height: 36px;

      text-align: center;

      position: absolute;

      background: none;

      right: 0;

      left: auto;

      transform: translateX(0);

      top: 0.05rem;

      font-size: 20px;

      color: #333;

      border: none; }

    header nav .natem.has-nav.show:after {

      content: "-"; }

    header nav .natem.animate {

      opacity: 1;

      transform: translate(0, 0); }

  header .rav {

    flex: 1;

    text-align: right; }

    header .rav .sechom {

      width: 100vw;

      position: fixed;

      left: 50%;

      right: auto;

      transform: translateX(-50%); }

    header .rav .menu {

      display: inline-block;

      vertical-align: middle;

      width: 24px;

      height: 24px;

      margin-left: 0.1rem;

      cursor: pointer;

      position: relative; }

      header .rav .menu img {

        width: 100%;

        height: 100%;

        display: block; }

      header .rav .menu .clk {

        width: 100%;

        height: 100%;

        text-align: center;

        color: #333;

        font-size: 20px;

        line-height: 24px;

        text-align: center;

        position: absolute;

        z-index: 3;

        left: 50%;

        top: 50%;

        transform: translate(-50%, -50%);

        display: none; }



  header.menu-state .rav .menu img {

    opacity: 0; } }

.banner {

  width: 100%;

  position: relative; }

  .banner .swiper-slide {

    width: 100%;

    display: block; }

    .banner .swiper-slide .imgs {

      width: 100%;

      position: relative;

      overflow: hidden;

      display: block; }

      .banner .swiper-slide .imgs .img {

        width: 100%;

        padding-top: 28.125%;

        display: block; }

    .banner .swiper-slide .imgs.phm .img {

      padding-top: 50%; }

  .banner .btn {

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    z-index: 3;

    width: 0.45rem;

    height: 0.45rem;

    cursor: pointer;

    background-color: rgba(255, 255, 255, 0.15); }

    .banner .btn img {

      width: 100%;

      display: block; }

  .banner .btn:hover {

    background-color: var(--themes); }

  .banner .bl {

    left: 0; }

  .banner .br {

    right: 0; }



footer {

  width: 100%; }

  footer .ftop {

    width: 100%;

    display: block;

    background-color: #7f7f7f; }

    footer .ftop .fop {

      width: 100%;

      display: flex;

      flex-wrap: wrap;

      justify-content: space-between;

      padding: 0.4rem 0 0.1rem; }

      footer .ftop .fop .fpl {

        display: inline-block;

        vertical-align: middle; }

        footer .ftop .fop .fpl .em {

          display: inline-block;

          vertical-align: middle; }

          footer .ftop .fop .fpl .em a {

            display: inline-block;

            vertical-align: middle;

            color: #fff;

            line-height: 1.5;

            margin-right: 0.3rem;

            margin-bottom: 0.1rem; }

      footer .ftop .fop .fpr {

        display: inline-block;

        vertical-align: middle; }

        footer .ftop .fop .fpr .share {

          display: inline-block;

          vertical-align: middle;

          font-size: 0;

          width: auto; }

          footer .ftop .fop .fpr .share .am {

            display: inline-block;

            vertical-align: middle;

            width: 0.19rem;

            height: 0.19rem;

            margin-left: 0.2rem;

            position: relative;

            transition: all ease 0.6s;

            opacity: 0.6;

            min-height: 16px;

            min-width: 16px; }

            footer .ftop .fop .fpr .share .am img {

              width: 100%;

              display: block; }

            footer .ftop .fop .fpr .share .am .dome {

              position: absolute;

              top: calc(100% + 0.1rem);

              left: 50%;

              transform: translateX(-50%);

              width: 1.3rem;

              height: 1.3rem;

              background-color: #fff;

              border-radius: 0.05rem;

              padding: 0.1rem;

              display: none; }

              footer .ftop .fop .fpr .share .am .dome img {

                width: 100%;

                display: block; }

          footer .ftop .fop .fpr .share .am:hover {

            opacity: 1; }

            footer .ftop .fop .fpr .share .am:hover .dome {

              display: block; }

    footer .ftop .fod {

      width: 100%;

      border-top: solid 1px rgba(255, 255, 255, 0.1);

      margin-top: 0.1rem;

      padding: 0.6rem 0; }

      footer .ftop .fod .fodlist {

        width: 100%;

        font-size: 0; }

        footer .ftop .fod .fodlist .fodm {

          display: inline-block;

          vertical-align: top;

          width: calc(20%);

          padding-right: 0.2rem; }

          footer .ftop .fod .fodlist .fodm .fc {

            display: block;

            width: 0.3rem;

            height: 0.3rem;

            min-width: 18px;

            min-height: 18px; }

            footer .ftop .fod .fodlist .fodm .fc img {

              width: 100%;

              display: block; }

          footer .ftop .fod .fodlist .fodm .fid {

            width: 100%;

            color: #fff;

            line-height: 1.5;

            margin-top: 0.08rem; }

          footer .ftop .fod .fodlist .fodm .fim {

            width: 100%;

            color: rgba(255, 255, 255, 0.5);

            line-height: 1.5;

            margin-top: 0.08rem;

            word-break: break-all; }

  footer .fbot {

    width: 100%;

    background-color: var(--themes); }

    footer .fbot .fob {

      width: 100%;

      text-align: center;

      padding: 0.3rem 0; }

      footer .fbot .fob .fm {

        width: 100%;

        color: rgba(255, 255, 255, 0.5);

        line-height: 1.75; }

        footer .fbot .fob .fm a {

          display: inline-block;

          line-height: 1.75;

          color: rgba(255, 255, 255, 0.5); }

        footer .fbot .fob .fm a:hover {

          color: #fff; }



@media (max-width: 800px) {

  footer .ftop .fop .fpl {

    width: 100%;

    text-align: center; }

  footer .ftop .fop .fpr {

    width: 100%;

    text-align: center;

    padding: 0.1rem 0; }

    footer .ftop .fop .fpr .am {

      margin: 0 0.14rem; }

  footer .ftop .fod .fodlist .fodm {

    width: 49%;

    margin-right: 2%;

    margin-bottom: 0.2rem;

    padding-right: 0; }

  footer .ftop .fod .fodlist .fodm:nth-child(2n) {

    margin-right: 0; }

  footer .ftop .fod .fodlist .fodm:last-child {

    width: 100%;

    margin-right: 0;

    margin-bottom: 0; } }

.nanner {

  width: 100%;

  position: relative; }

  .nanner .imgs {

    width: 100%;

    overflow: hidden;

    position: relative; }

    .nanner .imgs .img {

      width: 100%;

      height: 3rem; }

  .nanner .phm .img {

    height: 5rem; }

  .nanner .nox {

    position: absolute;

    left: calc((100% - 12rem) / 2);

    top: 50%;

    transform: translateY(-50%);

    z-index: 3;

    width: 7rem;

    max-width: 90%; }

    .nanner .nox .nit {

      width: 100%;

      color: #fff;

      line-height: 1; }

    .nanner .nox .xm {

      width: 100%;

      color: #fff;

      line-height: 1.5;

      margin-bottom: 0.1rem; }

    .nanner .nox .lx {

      width: 0.2rem;

      margin-top: 0.3rem;

      height: 2px;

      background-color: #fff; }



@media (max-width: 1220px) {

  .nanner .nox {

    left: 5%; } }

.crumbs {

  width: 100%;

  position: relative; }

  .crumbs .column {

    width: 100%;

    background-color: #ffffff;

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between;

    align-items: center;

    position: relative; }

    .crumbs .column .colum {

      font-size: 0;

      display: inline-block;

      vertical-align: middle;

      width: auto; }

      .crumbs .column .colum .home {

        display: inline-block;

        vertical-align: middle;

        width: 19px;

        height: 19px;

        margin-right: 0.1rem;

        position: relative;

        top: -0.02rem; }

        .crumbs .column .colum .home img {

          width: 100%;

          display: block; }

      .crumbs .column .colum a {

        display: inline-block;

        vertical-align: middle;

        width: auto;

        color: #666;

        line-height: 4;

        max-width: 4.5rem;

        overflow: hidden;

        white-space: nowrap;

        text-overflow: ellipsis; }

        .crumbs .column .colum a span {

          display: inline-block;

          color: #666;

          margin: 0 0.1rem 0 0.1rem;

          line-height: 4;

          position: relative;

          top: -0.01rem; }

          .crumbs .column .colum a span img {

            width: 100%;

            display: block; }

      .crumbs .column .colum a:hover {

        color: var(--themes); }

      .crumbs .column .colum a:last-child span {

        display: none; }



.newomd {

  width: 100%;

  padding: 0.8rem 0 0.6rem; }

  .newomd .newomlis {

    width: 100%;

    font-size: 0; }

    .newomd .newomlis .newam {

      display: inline-block;

      vertical-align: top;

      width: calc(380 / 1200 * 100%);

      margin-right: calc(29 / 1200 * 100%);

      margin-bottom: 0.2rem; }

      .newomd .newomlis .newam a {

        width: 100%;

        display: block; }

      .newomd .newomlis .newam .imgs {

        width: 100%;

        position: relative;

        overflow: hidden; }

        .newomd .newomlis .newam .imgs .img {

          width: 100%;

          padding-top: 60%;

          transition: all ease 0.5s; }

      .newomd .newomlis .newam .pom {

        width: 100%;

        margin-top: 0.2rem; }

      .newomd .newomlis .newam .time {

        width: 100%;

        color: #999;

        line-height: 1.5; }

        .newomd .newomlis .newam .time span {

          display: inline-block;

          vertical-align: middle;

          width: 0.2rem;

          height: 0.2rem;

          min-height: 16px;

          min-width: 16px; }

          .newomd .newomlis .newam .time span img {

            width: 100%;

            display: block; }

      .newomd .newomlis .newam .nit {

        width: 100%;

        color: #222;

        line-height: 1.5;

        margin: 0.06rem 0; }

      .newomd .newomlis .newam .nim {

        width: 100%;

        color: #999;

        line-height: 1.5;

        height: 3em;

        margin: 0.12rem 0; }

      .newomd .newomlis .newam .more {

        width: 100%;

        font-size: 0;

        margin-top: 0.2rem; }

        .newomd .newomlis .newam .more .mtn {

          display: inline-block;

          vertical-align: middle;

          color: #666;

          line-height: 1.5; }

          .newomd .newomlis .newam .more .mtn span {

            width: 7px;

            position: relative;

            top: -0.01rem;

            display: inline-block;

            vertical-align: middle; }

            .newomd .newomlis .newam .more .mtn span img {

              width: 100%;

              display: block; }

            .newomd .newomlis .newam .more .mtn span img:first-child {

              display: block; }

            .newomd .newomlis .newam .more .mtn span img:last-child {

              display: none; }

    .newomd .newomlis .newam:nth-child(3n) {

      margin-right: 0; }

    .newomd .newomlis .newam:hover .imgs .img {

      transform: scale(1.1); }

    .newomd .newomlis .newam:hover .nit {

      color: var(--themes); }

    .newomd .newomlis .newam:hover .more .mtn {

      color: var(--themes); }

      .newomd .newomlis .newam:hover .more .mtn span img:first-child {

        display: none; }

      .newomd .newomlis .newam:hover .more .mtn span img:last-child {

        display: block; }



.newomp {

  width: 100%;

  background-color: #dedede;

  padding: 0.8rem 0 0.6rem; }

  .newomp .newmplis {

    width: 100%; }

    .newomp .newmplis .newme {

      width: 100%;

      background-color: #fff;

      font-size: 0; }

      .newomp .newmplis .newme a {

        width: 100%;

        display: block;

        padding: 0.3rem; }

      .newomp .newmplis .newme .imgs {

        width: calc(350 / 1140 * 100%);

        position: relative;

        overflow: hidden;

        display: inline-block;

        vertical-align: middle; }

        .newomp .newmplis .newme .imgs .img {

          width: 100%;

          padding-top: 60%;

          transition: all ease 0.5s; }

      .newomp .newmplis .newme .pom {

        display: inline-block;

        vertical-align: middle;

        width: calc(790 / 1140 * 100%);

        padding-left: 0.3rem; }

        .newomp .newmplis .newme .pom.w100{
          width: 100%;
          padding-left: 0;
        }

        .newomp .newmplis .newme .pom .nit {

          width: 100%;

          color: #222;

          line-height: 1.5;

          font-weight: bold;

          margin-bottom: 0.1rem; }

        .newomp .newmplis .newme .pom .nim {

          width: 100%;

          color: #999;

          line-height: 1.5;

          height: 3em;

          margin: 0.12rem 0; }

        .newomp .newmplis .newme .pom .pob {

          width: 100%;

          font-size: 0;

          display: flex;

          flex-wrap: wrap;

          justify-content: space-between;

          align-items: center; }

          .newomp .newmplis .newme .pom .pob .time {

            color: #999;

            line-height: 1.5;

            display: inline-block;

            vertical-align: middle;

            width: auto; }

            .newomp .newmplis .newme .pom .pob .time span {

              display: inline-block;

              vertical-align: middle;

              width: 0.2rem;

              height: 0.2rem;

              min-height: 16px;

              min-width: 16px; }

              .newomp .newmplis .newme .pom .pob .time span img {

                width: 100%;

                display: block; }

          .newomp .newmplis .newme .pom .pob .add {

            display: inline-block;

            vertical-align: middle;

            width: 0.4rem;

            height: 0.4rem;

            background-color: #dedede; }

            .newomp .newmplis .newme .pom .pob .add img {

              width: 100%;

              display: block; }

    .newomp .newmplis .newme:hover .imgs .img {

      transform: scale(1.1); }

    .newomp .newmplis .newme:hover .nit {

      color: var(--themes); }

    .newomp .newmplis .newme:hover .pom .add {

      background-color: var(--themes); }

    .newomp .newmplis .newme + .newme {

      margin-top: 0.3rem; }

  .newomp .screen {

    width: 100%;

    background-color: #fff;

    margin-bottom: 0.3rem;

    padding: 0.3rem; }

    .newomp .screen form {

      width: 100%;

      font-size: 0;

      display: flex;

      flex-wrap: wrap; }

    .newomp .screen .select {

      font-size: 0;

      display: inline-block;

      vertical-align: middle;

      border: none;

      text-align: left;

      position: relative;

      width: calc((100% - 1.5rem - 0.9rem) / 3);

      margin-right: 0.3rem; }

      .newomp .screen .select .select-con {

        width: 100%;

        display: inline-block;

        vertical-align: middle;

        position: relative;

        font-size: 0; }

        .newomp .screen .select .select-con .select-value {

          display: inline-block;

          vertical-align: middle;

          width: 100%;

          line-height: 3.5em;

          height: 3.5em;

          color: #666;

          padding: 0 .2rem;

          border-bottom: solid 1px #ddd;

          padding: 0 0.2rem;

          cursor: pointer; }

        .newomp .screen .select .select-con select {

          position: absolute;

          width: 100%;

          height: 100%;

          left: 0;

          top: 0;

          z-index: 2;

          opacity: 0; }

          .newomp .screen .select .select-con select option {

            color: #666;

            font-size: .16rem;

            line-height: 2.5;

            background: #fff; }

        .newomp .screen .select .select-con .seluls {

          position: absolute;

          left: 0;

          top: 100%;

          min-width: 100%;

          max-height: 360px;

          overflow: auto;

          display: none;

          padding: 5px 0;

          box-sizing: border-box;

          text-align: left;

          background-color: #fff;

          z-index: 123;

          border-radius: 4px;

          box-shadow: 0 6px 12px rgba(0, 0, 0, 0.18);

          overflow: auto;

          /*滚动条里面小方块*/

          /*滚动条里面轨道*/ }

          .newomp .screen .select .select-con .seluls .option {

            width: 100%;

            color: #666;

            line-height: 2.5;

            background: #fff;

            cursor: pointer;

            padding: 0 0.15rem; }

          .newomp .screen .select .select-con .seluls .option:hover {

            background-color: var(--themes);

            color: #fff; }

        .newomp .screen .select .select-con .seluls::-webkit-scrollbar {

          width: 4px;

          height: 4px;

          scrollbar-arrow-color: rgba(0, 0, 0, 0.1); }

        .newomp .screen .select .select-con .seluls::-webkit-scrollbar-thumb {

          border-radius: 10px;

          -webkit-box-shadow: inset 0 0 10px rgba(6, 78, 149, 0.3);

          background: rgba(6, 78, 149, 0.3);

          scrollbar-arrow-color: rgba(0, 0, 0, 0.1); }

        .newomp .screen .select .select-con .seluls::-webkit-scrollbar-track {

          border-radius: 10px;

          -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1);

          background: rgba(0, 0, 0, 0.1); }

      .newomp .screen .select .select-con:after {

        display: inline-block;

        content: "";

        position: absolute;

        right: .2rem;

        top: 50%;

        transform: translateY(-50%);

        z-index: 1;

        width: 12px;

        height: 7px;

        background-image: url("../images/xx.png");

        background-size: 100%;

        background-repeat: no-repeat;

        background-position: center; }

    .newomp .screen .query {

      display: inline-block;

      vertical-align: middle;

      width: 1.5rem; }

      .newomp .screen .query .stn {

        width: 100%;

        display: block;

        background-color: var(--themes);

        color: #fff;

        border: none;

        line-height: 3.5;

        cursor: pointer; }



.pages {

  width: 100%;

  padding: 0.22rem 0 0.25rem;

  font-size: 0;

  text-align: center; }

  .pages .page {

    display: inline-block;

    vertical-align: middle;

    width: 2.8em;

    height: 2.8em;

    line-height: 2.8;

    text-align: center;

    color: #666;

    background-color: #fff;

    margin: 0 0.05rem 0.1rem; }

  .pages .page.ltn {

    background-image: url("../images/b3.png");

    background-position: center;

    background-size: 100% 100%;

    background-repeat: no-repeat; }

  .pages .page.rtn {

    background-image: url("../images/b4.png");

    background-position: center;

    background-size: 100% 100%;

    background-repeat: no-repeat; }

  .pages .page.on {

    background-color: var(--themes);

    color: #fff; }

  .pages .page.ltn:hover {

    background-image: url("../images/b1.png");

    background-position: center;

    background-size: 100% 100%;

    background-repeat: no-repeat; }

  .pages .page.on.ltn {

    background-image: url("../images/b1.png");

    background-position: center;

    background-size: 100% 100%;

    background-repeat: no-repeat;

    border: none; }

  .pages .page.on.rtn {

    background-image: url("../images/b2.png");

    background-position: center;

    background-size: 100% 100%;

    background-repeat: no-repeat;

    border: none; }

  .pages .page.rtn:hover {

    background-image: url("../images/b2.png");

    background-position: center;

    background-size: 100% 100%;

    background-repeat: no-repeat;

    border: none; }

  .pages .page.auto {

    width: auto;

    padding: 0 0.24rem; }

  .pages .page:hover {

    background-color: var(--themes);

    color: #fff; }



@media (max-width: 900px) {

  .pages .page {

    width: 0.7rem;

    height: 0.7rem;

    line-height: 0.7rem;

    font-size: 14px; } }

.netails {

  width: 100%;

  padding: 0.5rem 0; }

  .netails .netail {

    width: 100%;

    font-size: 0;

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between;

    position: relative; }

    .netails .netail .nel {

      display: inline-block;

      vertical-align: top;

      width: calc(800 / 1200 * 100%); }

      .netails .netail .nel .nit {

        width: 100%;

        color: #111;

        line-height: 1.3; }

      .netails .netail .nel .nim {

        width: 100%;

        display: flex;

        flex-wrap: wrap;

        justify-content: space-between;

        align-items: center;

        margin: 0.2rem 0 0; }

        .netails .netail .nel .nim .nml {

          display: inline-block;

          vertical-align: middle;

          width: auto; }

          .netails .netail .nel .nim .nml .pm {

            display: inline-block;

            vertical-align: middle;

            color: #666;

            line-height: 1.5;

            margin-right: 0.3rem; }

        .netails .netail .nel .nim .nmr {

          display: inline-block;

          vertical-align: middle; }

        .netails .netail .nel .nim .back {

          display: inline-block;

          vertical-align: middle;

          color: var(--themes);

          line-height: 1.5; }

          .netails .netail .nel .nim .back span {

            display: inline-block;

            vertical-align: middle;

            width: 0.19rem;

            height: 0.19rem;

            position: relative;

            top: -0.02rem;

            min-width: 16px;

            min-height: 16px;

            margin-left: 0.1rem; }

            .netails .netail .nel .nim .back span img {

              width: 100%;

              display: block; }

      .netails .netail .nel .ninps {

        width: 100%;

        padding: 0.3rem 0;

        margin: 0.3rem 0;

        color: #666;

        line-height: 1.8;

        border-top: solid 1px #ddd; }

        .netails .netail .nel .ninps p {

          color: #666;

          line-height: 1.8; }

        .netails .netail .nel .ninps img {

          max-width: 100%; }

      .netails .netail .nel .nob {

        width: 100%;

        margin-top: 0.2rem;

        padding: 0.3rem 0;

        border-top: solid 1px #ddd;

        border-bottom: solid 1px #ddd;

        display: flex;

        flex-wrap: wrap;

        justify-content: space-between;

        align-items: center; }

        .netails .netail .nel .nob .nobm {

          display: inline-block;

          vertical-align: middle;

          width: auto;

          font-size: 0;

          display: flex;

          align-items: center; }

          .netails .netail .nel .nob .nobm .imgs {

            display: inline-block;

            vertical-align: middle;

            width: 1.5rem;

            position: relative;

            overflow: hidden; }

            .netails .netail .nel .nob .nobm .imgs .img {

              width: 100%;

              padding-top: 60%;

              transition: all ease 0.5s; }

          .netails .netail .nel .nob .nobm .rom {

            width: 1.8rem;

            padding-left: 0.2rem;

            display: inline-block;

            vertical-align: middle; }

            .netails .netail .nel .nob .nobm .rom .rt {

              width: 100%;

              color: #333;

              line-height: 1.5; }

            .netails .netail .nel .nob .nobm .rom .rim {

              width: 100%;

              color: #666;

              line-height: 1.5;

              height: 3em; }

        .netails .netail .nel .nob .nobm.nrs {

          flex-direction: row-reverse;

          text-align: right; }

          .netails .netail .nel .nob .nobm.nrs .rom {

            padding-left: 0;

            padding-right: 0.2rem; }

        .netails .netail .nel .nob .nobm:hover .imgs .img {

          transform: scale(1.1); }

        .netails .netail .nel .nob .nobm:hover .rom .rim {

          color: var(--themes); }

    .netails .netail .ner {

      display: inline-block;

      vertical-align: top;

      width: calc(330 / 1200 * 100%); }

      .netails .netail .ner .nit {

        width: 100%;

        color: #222;

        font-weight: bold;

        line-height: 1.5;

        margin-bottom: 0.2rem; }

      .netails .netail .ner .nerlist {

        width: 100%; }

        .netails .netail .ner .nerlist .nrom {

          width: 100%; }

          .netails .netail .ner .nerlist .nrom a {

            width: 100%;

            display: block; }

          .netails .netail .ner .nerlist .nrom .imgs {

            width: 1.5rem;

            position: relative;

            overflow: hidden;

            display: inline-block;

            vertical-align: middle;

            width: calc(150 / 330 * 100%); }

            .netails .netail .ner .nerlist .nrom .imgs .img {

              width: 100%;

              padding-top: 60%;

              transition: all ease 0.5s; }

          .netails .netail .ner .nerlist .nrom .rom {

            display: inline-block;

            vertical-align: middle;

            width: calc(100% - 1.5rem);

            width: calc(180 / 330 * 100%);

            padding-left: 0.2rem; }

            .netails .netail .ner .nerlist .nrom .rom .rm {

              width: 100%;

              color: #111;

              line-height: 1.5; }

            .netails .netail .ner .nerlist .nrom .rom .time {

              width: 100%;

              color: #999;

              line-height: 1.5;

              margin-top: 0.1rem; }

              .netails .netail .ner .nerlist .nrom .rom .time span {

                display: inline-block;

                vertical-align: middle;

                width: 0.2rem;

                height: 0.2rem;

                min-height: 16px;

                min-width: 16px; }

                .netails .netail .ner .nerlist .nrom .rom .time span img {

                  width: 100%;

                  display: block; }

        .netails .netail .ner .nerlist .nrom + .nrom {

          margin-top: 0.25rem; }

        .netails .netail .ner .nerlist .nrom:hover .imgs .img {

          transform: scale(1.1); }

        .netails .netail .ner .nerlist .nrom:hover .rom .rm {

          color: var(--themes); }

    .netails .netail .ner.fixed {

      width: calc(330 / 1920 * 100%);

      position: fixed;

      right: 50%;

      margin-right: -6rem; }

    .netails .netail .ner.bot {

      position: absolute !important;

      right: 0 !important;

      bottom: 0 !important;

      margin-right: 0 !important;

      top: auto !important;

      width: calc(330 / 1200 * 100%) !important; }



@media (max-width: 1620px) {

  .netails .netail .ner.fixed {

    margin-right: -6rem;

    width: 3.3rem; }

  .netails .netail .nel .nob .nobm {

    width: 100%;

    padding: 0.1rem;

    flex-direction: row !important; }

    .netails .netail .nel .nob .nobm .imgs {

      width: 40%; }

    .netails .netail .nel .nob .nobm .rom {

      width: 60%;

      text-align: left !important;

      padding-left: 0.3rem !important;

      padding-right: 0 !important; }

      .netails .netail .nel .nob .nobm .rom .rim {

        height: auto;

        max-height: 3em; } }

.mapsd {

  width: 100%;

  background-color: #dedede;

  padding: 0.8rem 0; }

  .mapsd .maps {

    width: 100%;

    font-size: 0;

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between; }

    .mapsd .maps .mal {

      display: inline-block;

      vertical-align: middle;

      width: calc(800 / 1200 * 100%);

      background-color: #fff;
      width: 100%;

      padding: 0.3rem; }

      .mapsd .maps .mal .malm {

        width: 100%;

        display: flex;

        flex-wrap: wrap;

        justify-content: space-between;

        align-items: center;

        flex-direction: row-reverse; }

        .mapsd .maps .mal .malm .img {

          display: inline-block;

          vertical-align: middle;

          width: calc(340 / 740 * 100%);
        
          text-align: center;
        }

        .mapsd .maps .mal .malm .img img{
          max-width: 100%;
        }

        .mapsd .maps .mal .malm .rom {

          display: inline-block;

          vertical-align: middle;

          width: calc(340 / 740 * 100%); }

          .mapsd .maps .mal .malm .rom .rt {

            width: 100%;

            color: var(--themes);

            line-height: 1.5;

            margin-bottom: 0.15rem; }

          .mapsd .maps .mal .malm .rom .romul {

            width: 100%; }

            .mapsd .maps .mal .malm .rom .romul .ali {

              width: 100%;

              font-size: 0;

              padding: 0.04rem 0; }

              .mapsd .maps .mal .malm .rom .romul .ali .ac {

                display: inline-block;

                vertical-align: top;

                width: 0.23rem;

                height: 0.23rem;

                min-width: 18px;

                min-height: 18px;

                margin-right: 0.1rem; }

                .mapsd .maps .mal .malm .rom .romul .ali .ac img {

                  width: 100%;

                  display: block; }

              .mapsd .maps .mal .malm .rom .romul .ali .am {

                width: calc(100% - 0.23rem - 0.1rem);

                max-width: calc(100% - 18px - 0.1rem);

                display: inline-block;

                vertical-align: top;

                color: #666;

                line-height: 1.5; }

    .mapsd .maps .mar {

      display: inline-block;

      vertical-align: middle;

      width: calc(385 / 1200 * 100%);

      padding: 0.3rem;

      background-color: #fff;

      height: 4rem; }

      .mapsd .maps .mar .select {

        font-size: 0;

        display: inline-block;

        vertical-align: middle;

        border: none;

        text-align: left;

        position: relative;

        width: 100%;

        margin-bottom: 0.2rem; }

        .mapsd .maps .mar .select .select-con {

          width: 100%;

          display: inline-block;

          vertical-align: middle;

          position: relative;

          font-size: 0; }

          .mapsd .maps .mar .select .select-con .select-value {

            display: inline-block;

            vertical-align: middle;

            width: 100%;

            line-height: 3.5em;

            height: 3.5em;

            color: #666;

            padding: 0 .2rem;

            border-bottom: solid 1px #ddd;

            padding: 0 0.2rem;

            cursor: pointer; }

          .mapsd .maps .mar .select .select-con select {

            position: absolute;

            width: 100%;

            height: 100%;

            left: 0;

            top: 0;

            z-index: 2;

            opacity: 0; }

            .mapsd .maps .mar .select .select-con select option {

              color: #666;

              font-size: .16rem;

              line-height: 2.5;

              background: #fff; }

          .mapsd .maps .mar .select .select-con .seluls {

            position: absolute;

            left: 0;

            top: 100%;

            min-width: 100%;

            max-height: 360px;

            overflow: auto;

            display: none;

            padding: 5px 0;

            box-sizing: border-box;

            text-align: left;

            background-color: #fff;

            z-index: 123;

            border-radius: 4px;

            box-shadow: 0 6px 12px rgba(0, 0, 0, 0.18);

            overflow: auto;

            /*滚动条里面小方块*/

            /*滚动条里面轨道*/ }

            .mapsd .maps .mar .select .select-con .seluls .option {

              width: 100%;

              color: #666;

              line-height: 2.5;

              background: #fff;

              cursor: pointer;

              padding: 0 0.15rem; }

            .mapsd .maps .mar .select .select-con .seluls .option:hover {

              background-color: var(--themes);

              color: #fff; }

          .mapsd .maps .mar .select .select-con .seluls::-webkit-scrollbar {

            width: 4px;

            height: 4px;

            scrollbar-arrow-color: rgba(0, 0, 0, 0.1); }

          .mapsd .maps .mar .select .select-con .seluls::-webkit-scrollbar-thumb {

            border-radius: 10px;

            -webkit-box-shadow: inset 0 0 10px rgba(6, 78, 149, 0.3);

            background: rgba(6, 78, 149, 0.3);

            scrollbar-arrow-color: rgba(0, 0, 0, 0.1); }

          .mapsd .maps .mar .select .select-con .seluls::-webkit-scrollbar-track {

            border-radius: 10px;

            -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1);

            background: rgba(0, 0, 0, 0.1); }

        .mapsd .maps .mar .select .select-con:after {

          display: inline-block;

          content: "";

          position: absolute;

          right: .2rem;

          top: 50%;

          transform: translateY(-50%);

          z-index: 1;

          width: 12px;

          height: 7px;

          background-image: url("../images/xx.png");

          background-size: 100%;

          background-repeat: no-repeat;

          background-position: center; }

      .mapsd .maps .mar .maron {

        width: 100%;

        height: calc(100% - 3.5em - 0.2rem);

        overflow: auto; }

        .mapsd .maps .mar .maron::-webkit-scrollbar {

          width: 4px;

          height: 4px;

          scrollbar-arrow-color: rgba(0, 0, 0, 0.1); }

        .mapsd .maps .mar .maron::-webkit-scrollbar-thumb {

          border-radius: 10px;

          -webkit-box-shadow: inset 0 0 10px rgba(6, 78, 149, 0.3);

          background: rgba(6, 78, 149, 0.3);

          scrollbar-arrow-color: rgba(0, 0, 0, 0.1); }

        .mapsd .maps .mar .maron::-webkit-scrollbar-track {

          border-radius: 10px;

          -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1);

          background: rgba(0, 0, 0, 0.1); }

        .mapsd .maps .mar .maron .maien {

          width: 100%; }

          .mapsd .maps .mar .maron .maien .mit {

            width: 100%;

            color: #222;

            line-height: 1.5;

            margin-bottom: 0.14rem; }

          .mapsd .maps .mar .maron .maien .mauls {

            width: 100%; }

            .mapsd .maps .mar .maron .maien .mauls .ali {

              width: 100%;

              font-size: 0;

              padding: 0.04rem 0; }

              .mapsd .maps .mar .maron .maien .mauls .ali .ac {

                display: inline-block;

                vertical-align: top;

                width: 0.23rem;

                height: 0.23rem;

                min-width: 18px;

                min-height: 18px;

                margin-right: 0.1rem; }

                .mapsd .maps .mar .maron .maien .mauls .ali .ac img {

                  width: 100%;

                  display: block; }

              .mapsd .maps .mar .maron .maien .mauls .ali .am {

                width: calc(100% - 0.23rem - 0.1rem);

                max-width: calc(100% - 18px - 0.1rem);

                display: inline-block;

                vertical-align: top;

                color: #666;

                line-height: 1.5; }

        .mapsd .maps .mar .maron .maien + .maien {

          margin-top: 0.25rem; }

          .mapsd .malistm {
            width: 100%;
            font-size: 0;
            margin-top: 0.2rem; }
            .mapsd .malistm .maien {
              width: 100%;
              display: inline-block;
              vertical-align: top;
              width: 49%;
              margin-right: 2%;
              margin-bottom: 0.2rem;
              background-color: #fff;
              padding: 0.2rem; }
              .mapsd .malistm .maien .mit {
                width: 100%;
                color: #222;
                line-height: 1.5;
                margin-bottom: 0.14rem; }
              .mapsd .malistm .maien .mauls {
                width: 100%; }
                .mapsd .malistm .maien .mauls .ali {
                  width: 100%;
                  font-size: 0;
                  padding: 0.04rem 0; }
                  .mapsd .malistm .maien .mauls .ali .ac {
                    display: inline-block;
                    vertical-align: top;
                    width: 0.23rem;
                    height: 0.23rem;
                    min-width: 18px;
                    min-height: 18px;
                    margin-right: 0.1rem; }
                    .mapsd .malistm .maien .mauls .ali .ac img {
                      width: 100%;
                      display: block; }
                  .mapsd .malistm .maien .mauls .ali .am {
                    width: calc(100% - 0.23rem - 0.1rem);
                    max-width: calc(100% - 18px - 0.1rem);
                    display: inline-block;
                    vertical-align: top;
                    color: #666;
                    line-height: 1.5; }
            .mapsd .malistm .maien:nth-child(2n) {
              margin-right: 0; }



.recommends {

  width: 100%;

  position: relative;

  padding: 0.8rem 0; }

  .recommends .recommend {

    width: 100%; }

    .recommends .recommend .rit {

      width: 100%;

      margin-bottom: 0.24rem;

      color: var(--themes);

      line-height: 1.5; }

    .recommends .recommend .aroom {

      width: 100%;

      position: relative; }

      .recommends .recommend .aroom form {

        width: 100%;

        display: block; }

      .recommends .recommend .aroom .row {

        width: 100%; }

      .recommends .recommend .aroom .latom {

        width: 100%;

        font-size: 0;

        margin: 0.1rem 0; }

        .recommends .recommend .aroom .latom .label {

          display: inline-block;

          vertical-align: middle;

          width: auto;

          position: relative; }

          .recommends .recommend .aroom .latom .label .lc {

            display: inline-block;

            vertical-align: middle;

            border: solid 1px #ebebeb;

            width: 0.22rem;

            height: 0.22rem;

            min-width: 18px;

            min-height: 18px;

            margin-right: 0.1rem; }

            .recommends .recommend .aroom .latom .label .lc img {

              width: 100%;

              display: none; }

          .recommends .recommend .aroom .latom .label .am {

            display: inline-block;

            vertical-align: middle;

            color: #666;

            line-height: 1.75; }

          .recommends .recommend .aroom .latom .label .regitem {

            position: absolute;

            left: 0;

            top: 0;

            width: 100%;

            height: 100%;

            display: block;

            cursor: pointer;

            opacity: 0;

            z-index: 3; }

        .recommends .recommend .aroom .latom .label.selected .lc {

          border: solid 1px var(--themes);

          background-color: var(--themes); }

          .recommends .recommend .aroom .latom .label.selected .lc img {

            width: 100%;

            display: block; }

        .recommends .recommend .aroom .latom .span {

          display: inline-block;

          vertical-align: middle;

          color: var(--themes);

          line-height: 1.5; }

      .recommends .recommend .aroom .item {

        width: 100%;

        margin-bottom: 0.25rem;

        display: inline-block;

        vertical-align: top;

        width: calc(380 / 1200 * 100%);

        margin-right: calc(29 / 1200 * 100%); }

        .recommends .recommend .aroom .item .tme {

          width: 100%;

          color: #666;

          font-weight: bold;

          line-height: 1.5;

          margin-bottom: 0.05rem; }

        .recommends .recommend .aroom .item .int {

          width: 100%; }

          .recommends .recommend .aroom .item .int .sin {

            width: 100%;

            display: block;

            background-color: #dedede;

            padding: 0 0.2rem;

            line-height: 3.5;

            height: 3.5em;

            color: #333;

            border: none; }

          .recommends .recommend .aroom .item .int .area {

            width: 100%;

            display: block;

            background-color: #dedede;

            padding: 0.15rem 0.2rem;

            line-height: 1.5;

            color: #333;

            border: none; }

      .recommends .recommend .aroom .item.yzm {

        width: 100%; }

        .recommends .recommend .aroom .item.yzm .int {

          display: flex; }

          .recommends .recommend .aroom .item.yzm .int .sin {

            max-width: 3.8rem;

            display: inline-block;

            vertical-align: middle;

            flex: 1; }

          .recommends .recommend .aroom .item.yzm .int .ymg {

            display: inline-block;

            vertical-align: middle;

            height: 3.5em;

            margin-left: calc(29 / 1200 * 100%); }

            .recommends .recommend .aroom .item.yzm .int .ymg img {

              height: 100%;

              display: block; }

      .recommends .recommend .aroom .item:nth-child(3n) {

        margin-right: 0; }

      .recommends .recommend .aroom .item.w100 {

        width: 100%;

        margin-right: 0; }

      .recommends .recommend .aroom .botm {

        width: 100%;

        margin-top: 0.2rem;

        font-size: 0; }

        .recommends .recommend .aroom .botm .btn {

          display: inline-block;

          vertical-align: middle;

          width: auto;

          margin-right: 0.2rem; }

          .recommends .recommend .aroom .botm .btn .stn {

            display: inline-block;

            vertical-align: middle;

            width: auto;

            padding: 0 0.6rem;

            background-color: var(--themes);

            color: #fff;

            line-height: 3;

            border: none;

            cursor: pointer; }

        .recommends .recommend .aroom .botm .vtn {

          display: inline-block;

          vertical-align: middle;

          padding: 0 0.6rem;

          line-height: 3;

          color: #fff;

          width: auto;

          background-color: #7f7f7f;

          cursor: pointer; }



.modular {

  width: 100%; }

  .modular .mitop {

    width: 100%;

    text-align: center;

    margin-bottom: 0.5rem; }

    .modular .mitop .mit {

      width: 100%;

      color: var(--themes);

      line-height: 1.5; }

    .modular .mitop .em {

      width: 100%;

      color: #666;

      line-height: 1.5;

      margin: 0.1rem 0 0rem; }

      .modular .mitop .em p {

        color: #666;

        line-height: 1.5; }

    .modular .mitop .ld {

      width: 0.2rem;

      height: 2px;

      display: block;

      margin: 0.15rem auto 0;

      background-color: var(--themes); }



.industrys {

  width: 100%;

  padding: 0.8rem 0 1.2rem; }

  .industrys .indusm {

    width: 100%;

    font-size: 0; }

    .industrys .indusm .intem {

      display: inline-block;

      vertical-align: middle;

      width: calc(200 / 1200 * 100%);

      margin-right: calc(9 / 1200 * 100%);

      position: relative;

      transition: all ease 0.5s; }

      .industrys .indusm .intem a {

        width: 100%;

        display: block; }

      .industrys .indusm .intem .imgs {

        width: 100%;

        position: relative;

        overflow: hidden; }

        .industrys .indusm .intem .imgs .img {

          width: 100%;

          height: 4.4rem;

          transition: all ease 0.5s; }

      .industrys .indusm .intem .bg {

        position: absolute;

        z-index: 2;

        left: 0;

        top: 0;

        width: 100%;

        height: 100%;

        transition: all ease 0.5s;

        opacity: 0; }

      .industrys .indusm .intem .pomd {

        position: absolute;

        z-index: 4;

        left: 0;

        top: 0;

        width: 100%;

        height: 100%;

        display: flex;

        flex-wrap: wrap;

        align-content: space-between;

        padding: 0.3rem; }

        .industrys .indusm .intem .pomd .pop {

          width: 100%;

          font-size: 0; }

          .industrys .indusm .intem .pomd .pop .pc {

            display: inline-block;

            vertical-align: middle;

            width: 0.6rem;

            height: 0.6rem; }

            .industrys .indusm .intem .pomd .pop .pc img {

              width: 100%;

              display: block; }

        .industrys .indusm .intem .pomd .bop {

          width: 100%; }

          .industrys .indusm .intem .pomd .bop .bit {

            width: 100%;

            color: #fff;

            font-size: 0.18rem;

            line-height: 1.3; }

          .industrys .indusm .intem .pomd .bop .em {

            width: 100%;

            color: rgba(255, 255, 255, 0.6);

            line-height: 1.5; }

          .industrys .indusm .intem .pomd .bop .pim {

            width: 100%;

            color: rgba(255, 255, 255, 0.6);

            line-height: 1.5;

            transition: all ease 0.5s;

            overflow: hidden;

            height: 0;

            margin: 0;

            max-width: 4rem; }

          .industrys .indusm .intem .pomd .bop .more {

            width: 100%;

            color: #fff;

            line-height: 1.5;

            height: 0;

            transition: all ease 0.5s;

            overflow: hidden; }

            .industrys .indusm .intem .pomd .bop .more span {

              display: inline-block;

              vertical-align: middle;

              width: 7px;

              position: relative;

              top: -0.02rem;

              margin-left: 0.04rem; }

              .industrys .indusm .intem .pomd .bop .more span img {

                width: 100%;

                display: block; }

    .industrys .indusm .intem.on {

      width: calc(363 / 1200 * 100%); }

      .industrys .indusm .intem.on .bg {

        opacity: 1; }

      .industrys .indusm .intem.on .pomd .bop .bit {

        font-size: 0.24rem; }

      .industrys .indusm .intem.on .pomd .bop .pim {

        height: 4.5em;

        margin: 0.25rem 0 0.4rem; }

      .industrys .indusm .intem.on .pomd .bop .more {

        height: 1.5em; }

    .industrys .indusm .intem:nth-child(5n) {

      margin-right: 0; }



@media (max-width: 800px) {

  .industrys .indusm .intem {

    width: 100%;

    margin-right: 0; }

    .industrys .indusm .intem .imgs .img {

      height: 5.4rem; }

    .industrys .indusm .intem .pomd .pop {

      width: 0.8rem;

      height: 0.8rem; }

    .industrys .indusm .intem .pomd .bop .bit {

      font-size: 0.38rem; }

    .industrys .indusm .intem .pomd .bop .em {

      font-size: 0.3rem; }

    .industrys .indusm .intem .pomd .bop .pim {

      width: 100%;

      max-width: 100%; }

  .industrys .indusm .intem.on {

    width: 100%; }

    .industrys .indusm .intem.on .pomd .pop {

      width: 0.8rem;

      height: 0.8rem; }

    .industrys .indusm .intem.on .pomd .bop .bit {

      font-size: 0.38rem; }

    .industrys .indusm .intem.on .pomd .bop .em {

      font-size: 0.3rem; }

    .industrys .indusm .intem.on .pomd .bop .pim {

      width: 100%;

      max-width: 100%; }

  .industrys .indusm .intem + .intem {

    margin-top: 10px; } }

.contacts {

  width: 100%;

  padding: 0.8rem 0;

  overflow: hidden; }

  .contacts .convnt {

    width: 100%;

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between;

    align-items: center; }

    .contacts .convnt .conl {

      display: inline-block;

      vertical-align: top;

      flex: 1;

      padding-right: 0.4rem;

      position: relative; }

      .contacts .convnt .conl .rc {

        position: absolute;

        left: -1.1rem;

        width: 0.72rem;

        top: 0;

        z-index: 2; }

        .contacts .convnt .conl .rc img {

          width: 100%;

          display: block; }

      .contacts .convnt .conl .cit {

        width: 100%;

        color: #fff;

        line-height: 1.3; }

        .contacts .convnt .conl .cit p {

          color: #fff;

          line-height: 1.3; }

      .contacts .convnt .conl .cinp {

        width: 100%;

        color: rgba(255, 255, 255, 0.6);

        line-height: 1.5; }

        .contacts .convnt .conl .cinp p {

          color: rgba(255, 255, 255, 0.6);

          line-height: 1.5; }

      .contacts .convnt .conl .cinp.mrt {

        margin-top: 0.24rem; }

      .contacts .convnt .conl .dim {

        width: 100%;

        color: #fff;

        line-height: 1.5;

        margin-top: 0.3rem; }

    .contacts .convnt .conr {

      display: inline-block;

      vertical-align: middle; }

      .contacts .convnt .conr .ctn {

        width: 2rem;

        display: block;

        margin-bottom: 0.2rem; }

        .contacts .convnt .conr .ctn a {

          width: 100%;

          display: block;

          color: #fff;

          line-height: 3;

          text-align: center;

          background-color: #2476c7;

          transition: all ease 0.5s; }

        .contacts .convnt .conr .ctn a:hover {

          transform: scale(1.1); }

      .contacts .convnt .conr .ctn.em a {

        background-color: #ec8b00; }

      .contacts .convnt .conr .diem {

        width: 100%;

        color: #fff;

        line-height: 1.3; }

        .contacts .convnt .conr .diem p {

          color: #fff;

          line-height: 1.3; }



@media (max-width: 800px) {

  .contacts .convnt .conl {

    width: 100%;

    padding-right: 0;

    margin-bottom: 20px;

    flex: none; }

  .contacts .convnt .conr {

    width: 100%; } }

.products {

  width: 100%;

  padding: 0.8rem 0;

  background-color: #dedede; }

  .products .prodlist {

    width: 100%;

    font-size: 0; }

    .products .prodlist .proam {

      display: inline-block;

      vertical-align: top;

      width: calc(385 / 1200 * 100%);

      margin-right: calc(22 / 1200 * 100%);

      transition: all ease 0.5s;

      position: relative;

      z-index: 1;

      margin-bottom: 0.3rem; }

      .products .prodlist .proam a {

        width: 100%;

        display: block; }

      .products .prodlist .proam .imgs {

        width: 100%;

        position: relative;

        overflow: hidden; }

        .products .prodlist .proam .imgs .img {

          width: 100%;

          padding-top: 100%;

          transition: all ease 0.5s; }

      .products .prodlist .proam .vom {

        width: 100%;

        background-color: var(--themes);

        padding: 0.3rem; }

        .products .prodlist .proam .vom .bit {

          width: 100%;

          color: #fff;

          font-weight: bold;

          line-height: 1.4; }

        .products .prodlist .proam .vom .em {

          width: 100%;

          color: #e7e7e7;

          line-height: 1.5; }

        .products .prodlist .proam .vom .pim {

          width: 100%;

          color: #fff;

          line-height: 1.5;

          height: 3em;

          margin: 0.12rem 0 0.2rem; }

        .products .prodlist .proam .vom .more {

          width: 100%;

          color: #fff;

          line-height: 1.5;

          transition: all ease 0.5s; }

          .products .prodlist .proam .vom .more span {

            display: inline-block;

            vertical-align: middle;

            width: 7px;

            position: relative;

            top: -0.02rem;

            margin-left: 0.04rem; }

            .products .prodlist .proam .vom .more span img {

              width: 100%;

              display: block; }

            .products .prodlist .proam .vom .more span img:first-child {

              display: block; }

            .products .prodlist .proam .vom .more span img:last-child {

              display: none; }

    .products .prodlist .proam:hover {

      z-index: 4;

      transform: scale(1.05); }

      .products .prodlist .proam:hover .vom {

        background-color: var(--themes); }

        .products .prodlist .proam:hover .vom .bit, .products .prodlist .proam:hover .vom .em, .products .prodlist .proam:hover .vom .pim {

          color: #fff; }

        .products .prodlist .proam:hover .vom .more {

          color: #fff; }

          .products .prodlist .proam:hover .vom .more span img:first-child {

            display: none; }

          .products .prodlist .proam:hover .vom .more span img:last-child {

            display: block; }

    .products .prodlist .proam:nth-child(3n) {

      margin-right: 0; }

  .products .checks {

    width: 100%;

    text-align: center;

    font-size: 0;

    margin-top: 0.2rem; }

    .products .checks a {

      display: inline-block;

      vertical-align: middle;

      border: solid 1px var(--themes);

      color: var(--themes);

      text-align: center;

      padding: 0 0.4rem;

      line-height: 3; }

      .products .checks a span {

        display: inline-block;

        vertical-align: middle;

        width: 7px;

        position: relative;

        top: -0.02rem;

        margin-left: 0.04rem; }

        .products .checks a span img {

          width: 100%;

          display: block; }

        .products .checks a span img:first-child {

          display: block; }

        .products .checks a span img:last-child {

          display: none; }

    .products .checks a:hover {

      background-color: var(--themes);

      color: #fff; }

      .products .checks a:hover span img:first-child {

        display: none; }

      .products .checks a:hover span img:last-child {

        display: block; }



.brands {

  width: 100%;

  padding: 0.8rem 0; }

  .brands .brandlis {

    width: 100%;

    font-size: 0; }

    .brands .brandlis .branm {

      display: inline-block;

      vertical-align: top;

      width: calc(285 / 1200 * 100%);

      margin-right: calc(19 / 1200 * 100%);

      background-color: #fff;

      position: relative;

      cursor: pointer; }

      .brands .brandlis .branm .bg {

        position: absolute;

        z-index: 1;

        width: 100%;

        height: 100%;

        display: block;

        opacity: 0;

        transition: all ease 0.5s;

        top: 0;

        left: 0; }

      .brands .brandlis .branm .vom {

        width: 100%;

        padding: 0.3rem;

        height: 2.6rem;

        display: flex;

        flex-wrap: wrap;

        align-content: space-between; }

        .brands .brandlis .branm .vom .bot {

          width: 100%;

          position: relative;

          z-index: 2; }

          .brands .brandlis .branm .vom .bot .ic {

            display: block;

            height: 0.54rem; }

            .brands .brandlis .branm .vom .bot .ic img {

              height: 100%;

              display: block; }

            .brands .brandlis .branm .vom .bot .ic img:first-child {

              display: block; }

            .brands .brandlis .branm .vom .bot .ic img:last-child {

              display: none; }

        .brands .brandlis .branm .vom .bob {

          width: 100%;

          position: relative;

          z-index: 2; }

          .brands .brandlis .branm .vom .bob .by {

            width: 100%;

            color: var(--themes);

            line-height: 1.4; }

          .brands .brandlis .branm .vom .bob .ay {

            width: 100%;

            color: #999;

            line-height: 1.5; 

            height: 3em;

            overflow : hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;
          
          }

    .brands .brandlis .branm:nth-child(4n) {

      margin-right: 0; }

    .brands .brandlis .branm:hover .bg {

      opacity: 1; }

    .brands .brandlis .branm:hover .vom .bot .ic img:first-child {

      display: none; }

    .brands .brandlis .branm:hover .vom .bot .ic img:last-child {

      display: block; }

    .brands .brandlis .branm:hover .vom .bob .by, .brands .brandlis .branm:hover .vom .bob .ay {

      color: #fff; }



.aboutsd {

  width: 100%;

  padding: 1rem 0 3.6rem;

  border-bottom: solid 0.05rem var(--themes); }

  .aboutsd .abotms {

    width: 100%;

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between;

    align-items: center; }

    .aboutsd .abotms .abl {

      display: inline-block;

      vertical-align: middle;

      flex: 1;

      padding-right: 0.4rem; }

      .aboutsd .abotms .abl .aib {

        width: 100%;

        color: #000;

        line-height: 1.5; }

      .aboutsd .abotms .abl .ainp {

        width: 100%;

        margin-top: 0.24rem;

        color: #666;

        line-height: 1.5;

        max-width: 7rem; }

        .aboutsd .abotms .abl .ainp p {

          color: #666;

          line-height: 1.5; }

    .aboutsd .abotms .abr {

      display: inline-block;

      vertical-align: middle; }

      .aboutsd .abotms .abr a {

        display: inline-block;

        vertical-align: middle;

        background-color: var(--themes);

        color: #fff;

        text-align: center;

        padding: 0 0.4rem;

        line-height: 3;

        transition: all ease 0.5s; }

        .aboutsd .abotms .abr a span {

          display: inline-block;

          vertical-align: middle;

          width: 7px;

          position: relative;

          top: -0.02rem;

          margin-left: 0.04rem; }

          .aboutsd .abotms .abr a span img {

            width: 100%;

            display: block; }

      .aboutsd .abotms .abr a:hover {

        transform: scale(1.1); }

  .aboutsd .plays {

    width: 100%;

    font-size: 0;

    margin-top: 1rem; }

    .aboutsd .plays .ptn {

      display: inline-block;

      vertical-align: middle;

      width: 0.6rem;

      height: 0.6rem;

      border-radius: 50%;

      background-color: var(--themes);

      cursor: pointer;

      position: relative; }

      .aboutsd .plays .ptn img {

        width: 100%;

        display: block;

        position: relative;

        z-index: 3; }

      .aboutsd .plays .ptn:before {

        content: ' ';

        background: rgba(6, 78, 149, 0.5);

        border-radius: 50%;

        position: absolute;

        left: 50%;

        top: 50%;

        z-index: 1;

        transform: translate(-50%, -50%);

        animation: kuosan 2.2s linear 0.1s infinite; }

      .aboutsd .plays .ptn:after {

        content: ' ';

        background: rgba(6, 78, 149, 0.5);

        border-radius: 50%;

        position: absolute;

        left: 50%;

        top: 50%;

        z-index: 1;

        transform: translate(-50%, -50%);

        animation: kuosan1 2.2s linear .1s infinite; }

@keyframes kuosan {

  0% {

    width: 0.6rem;

    height: 0.6rem;

    opacity: 1; }

  50% {

    width: 0.7rem;

    height: 0.7rem; }

  100% {

    width: 0.8rem;

    height: 0.8rem;

    opacity: 0; } }

@keyframes kuosan1 {

  0% {

    width: 0.6rem;

    height: 0.6rem;

    opacity: 1; }

  50% {

    width: 0.8rem;

    height: 0.8rem; }

  100% {

    width: 1rem;

    height: 1rem;

    opacity: 0; } }

@media (max-width: 800px) {

  .aboutsd .abotms .abl {

    width: 100%;

    flex: none;

    margin-bottom: 20px; }

  .aboutsd .abotms .abr {

    width: 100%; } }

.aboutem {

  width: 100%;

  padding: 0.6rem 0; }

  .aboutem .aboem {

    width: 100%;

    font-size: 0;

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between;

    align-items: center;

    flex-direction: row-reverse; }

    .aboutem .aboem .abl {

      display: inline-block;

      vertical-align: middle;

      width: calc(480 / 1200 * 100%); }

      .aboutem .aboem .abl .imgs {

        width: 100%;

        position: relative;

        overflow: hidden; }

        .videoc {
          position: absolute;
          left: 0;
          top: 0;
          width: 100%;
          height: 100%;
          display: block;
          z-index: 4;
          background-color: rgba(0, 0, 0, 0.3);
          opacity: 1;
          transition: all ease 0.5s;
          z-index: 2; }
          .videoc .vom {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            z-index: 3; }

        .aboutem .aboem .abl .bkm{
          position: absolute;
          left: 0;
          top: 0;
          width: 100%;
          height: 100%;
          z-index: 5;
          background-color: #000;
        }

        .aboutem .aboem .abl .bkm .img{
          position: absolute;
          left: 0;
          top: 0;
          width: 100%;
          height: 100%;
          z-index: 6;
        }

        .aboutem .aboem .abl .bkm .play{
          width: 0.6rem;
          height: 0.6rem;
          position: absolute;
          left: 50%;
          top: 50%;
          transform: translate(-50%,-50%);
          cursor: pointer;
          z-index: 7;
        }

        .aboutem .aboem .abl .bkm .play img{
          width: 100%;
          height: 100%;
          display: block;
        }


        .aboutem .aboem .abl .imgs .img {

          width: 100%;

          padding-top: 60%; }

    .aboutem .aboem .abr {

      display: inline-block;

      vertical-align: middle;

      width: calc(700 / 1200 * 100%); }

      .aboutem .aboem .abr .air {

        width: 100%;

        color: var(--themes);

        line-height: 1.3; }

        .aboutem .aboem .abr .air p {

          color: var(--themes);

          line-height: 1.3; }

      .aboutem .aboem .abr .sinp {

        width: 100%;

        margin-top: 0.2rem;

        color: #666;

        line-height: 1.5; }

        .aboutem .aboem .abr .sinp p {

          color: #666;

          line-height: 1.5; }



@media (max-width: 800px) {

  .aboutem .aboem .abl {

    display: block;

    margin: 0 auto;

    max-width: 100%;

    width: 100%; } }

.statistics {

  width: 100%;

  position: relative;

  padding-bottom: 1.4rem; }

  .statistics .smgs {

    width: 100%;

    position: relative;

    overflow: hidden; }

    .statistics .smgs .img {

      width: 100%;

      padding-top: 35.41%; }

  .statistics .statilis {

    width: 100%;

    position: absolute;

    bottom: -1.4rem;

    left: 0;

    font-size: 0; }

    .statistics .statilis .branm {

      display: inline-block;

      vertical-align: top;

      width: calc( 300 / 1200 * 100%);

      background-color: #fff;

      position: relative;

      cursor: pointer;

      box-shadow: 14px 5px 20px 0px rgba(0, 0, 0, 0.27); }

      .statistics .statilis .branm .bg {

        position: absolute;

        z-index: 1;

        width: 100%;

        height: 100%;

        display: block;

        opacity: 0;

        transition: all ease 0.5s;

        top: 0;

        left: 0; }

      .statistics .statilis .branm .vom {

        width: 100%;

        padding: 0.3rem;

        height: 2.6rem;

        display: flex;

        flex-wrap: wrap;

        align-content: space-between; }

        .statistics .statilis .branm .vom .bot {

          width: 100%;

          position: relative;

          z-index: 2; }

          .statistics .statilis .branm .vom .bot .ic {

            display: block;

            height: 0.54rem; }

            .statistics .statilis .branm .vom .bot .ic img {

              height: 100%;

              display: block; }

            .statistics .statilis .branm .vom .bot .ic img:first-child {

              display: block; }

            .statistics .statilis .branm .vom .bot .ic img:last-child {

              display: none; }

        .statistics .statilis .branm .vom .bob {

          width: 100%;

          position: relative;

          z-index: 2; }

          .statistics .statilis .branm .vom .bob .by {

            width: 100%;

            color: var(--themes);

            line-height: 1.4; }

          .statistics .statilis .branm .vom .bob .ay {

            width: 100%;

            color: #999;

            line-height: 1.5;
          
            height: 3em;
            overflow : hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;

          }

    .statistics .statilis .branm:hover .bg {

      opacity: 1; }

    .statistics .statilis .branm:hover .vom .bot .ic img:first-child {

      display: none; }

    .statistics .statilis .branm:hover .vom .bot .ic img:last-child {

      display: block; }

    .statistics .statilis .branm:hover .vom .bob .by, .statistics .statilis .branm:hover .vom .bob .ay {

      color: #fff; }



@media (max-width: 800px) {

  .statistics {

    padding-bottom: 0; }

    .statistics .statilis {

      position: relative;

      bottom: 0;

      padding: 0.5rem 0; }

      .statistics .statilis .branm {

        box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } }

.historys {

  width: 100%;

  padding: 0.8rem 0;

  overflow: hidden; }

  .historys .mitop {

    margin-bottom: 0.3rem; }

  .historys .histper {

    width: 100%;

    padding-left: calc((100% - 12rem) / 2);

    position: relative; }

    .historys .histper:after {

      content: ' ';

      position: absolute;

      width: 100%;

      top: 50%;

      transform: translateY(-50%);

      height: 1px;

      background-color: #ddd;

      left: calc((100% - 12rem) / 2); }

    .historys .histper .btn {

      position: absolute;

      left: calc((100% - 12rem) / 2 - 1rem);

      top: 50%;

      transform: translateY(-50%);

      width: 0.6rem;

      height: 0.6rem;

      border-radius: 50%;

      background-color: var(--themes);

      font-size: 0; }

      .historys .histper .btn .bn {

        display: inline-block;

        vertical-align: middle;

        width: 0.3rem;

        height: 0.6rem;

        position: relative;

        cursor: pointer; }

        .historys .histper .btn .bn img {

          position: absolute;

          left: 50%;

          top: 50%;

          transform: translate(-50%, -50%); }

      .historys .histper .btn .bn:hover img {

        transform: translate(-50%, -50%) scale(1.1); }

    .historys .histper .swiper-container {

      padding: 1.5rem 0; }

    .historys .histper .swiper-slide {

      width: 100%;

      position: relative;

      transform: translateY(-50%);

      top: 0.05rem;

      transition: all ease 0.5s;

      opacity: 0; }

      .historys .histper .swiper-slide .line {

        display: flex;

        width: 0.1rem;

        flex-wrap: wrap;

        flex-direction: column-reverse; }

        .historys .histper .swiper-slide .line .x1 {

          display: block;

          width: 0.1rem;

          height: 0.1rem; }

          .historys .histper .swiper-slide .line .x1 img {

            width: 100%;

            display: block; }

        .historys .histper .swiper-slide .line .x2 {

          display: block;

          width: 0.1rem; }

          .historys .histper .swiper-slide .line .x2 img {

            width: 100%;

            display: block; }

          .historys .histper .swiper-slide .line .x2 img:first-child {

            display: block; }

          .historys .histper .swiper-slide .line .x2 img:last-child {

            display: none; }

      .historys .histper .swiper-slide .rem {

        position: absolute;

        top: 0;

        left: 0;

        width: calc(526 / 300 * 100%);

        padding-left: calc(30 / 526 * 100%);

        font-size: 0; }

        .historys .histper .swiper-slide .rem .rom {

          width: 100%;

          font-size: 0; }

        .historys .histper .swiper-slide .rem .imgs {

          display: inline-block;

          vertical-align: middle;

          width: calc(240 / 526 * 100%);

          position: relative;

          overflow: hidden; }

          .historys .histper .swiper-slide .rem .imgs .img {

            width: 100%;

            padding-top: 75%; }

        .historys .histper .swiper-slide .rem .eam {

          display: inline-block;

          vertical-align: middle;

          width: calc(286 / 526 * 100%);

          padding-left: 0.3rem; }

          .historys .histper .swiper-slide .rem .eam .et {

            width: 100%;

            color: var(--themes);

            line-height: 1.3;

            font-weight: bold; }

          .historys .histper .swiper-slide .rem .eam .eim {

            width: 100%;

            margin-top: 0.12rem;

            color: #666;

            line-height: 1.5;

            height: 4.5em; }

            .historys .histper .swiper-slide .rem .eam .eim p {

              color: #666;

              line-height: 1.5; }

    .historys .histper .swiper-slide:nth-child(2n) {

      transform: translateY(50%);

      top: -0.05rem; }

      .historys .histper .swiper-slide:nth-child(2n) .line {

        flex-direction: column; }

        .historys .histper .swiper-slide:nth-child(2n) .line .x2 img:first-child {

          display: none; }

        .historys .histper .swiper-slide:nth-child(2n) .line .x2 img:last-child {

          display: block; }

      .historys .histper .swiper-slide:nth-child(2n) .rem {

        top: auto;

        bottom: 0; }

    .historys .histper .swiper-slide-active, .historys .histper .swiper-slide-active + .swiper-slide, .historys .histper .swiper-slide-active + .swiper-slide + .swiper-slide, .historys .histper .swiper-slide-active + .swiper-slide + .swiper-slide + .swiper-slide {

      opacity: 1; }



@media (max-width: 800px) {

  .historys .histper {

    padding-left: 3%; }

    .historys .histper .swiper-container {

      max-width: 97%;

      padding: 2rem 0; }

    .historys .histper .swiper-slide .line {

      width: 0.11rem; }

      .historys .histper .swiper-slide .line .x1 {

        width: 0.11rem;

        height: 0.11rem; }

      .historys .histper .swiper-slide .line .x2 {

        width: 0.11rem; }

    .historys .histper .swiper-slide .rem {

      width: 6rem; }

      .historys .histper .swiper-slide .rem .eam .eim {

        width: 100%;

        margin-top: 0.12rem;

        color: #666;

        line-height: 1.5;

        height: 5.8em;

        overflow: hidden;

        text-overflow: ellipsis;

        display: -webkit-box;

        -webkit-line-clamp: 4;

        -webkit-box-orient: vertical; }

        .historys .histper .swiper-slide .rem .eam .eim p {

          color: #666;

          line-height: 1.5; }

    .historys .histper .btn {

      left: 1.5%;

      z-index: 4; }

    .historys .histper:after {

      left: 0; } }

.produmt {

  width: 100%;

  background-color: #dedede;

  padding: 0.8rem 0 0.6rem; }

  .produmt .prodlist {

    width: 100%;

    font-size: 0; }

    .produmt .prodlist .proam {

      display: inline-block;

      vertical-align: top;

      width: calc(385 / 1200 * 100%);

      margin-right: calc(22 / 1200 * 100%);

      transition: all ease 0.5s;

      position: relative;

      z-index: 1;

      margin-bottom: 0.3rem; }

      .produmt .prodlist .proam a {

        width: 100%;

        display: block; }

      .produmt .prodlist .proam .imgs {

        width: 100%;

        position: relative;

        overflow: hidden; }

        .produmt .prodlist .proam .imgs .img {

          width: 100%;

          padding-top: 100%;

          transition: all ease 0.5s; }

      .produmt .prodlist .proam .vom {

        width: 100%;

        background-color:var(--themes);

        padding: 0.3rem; }

        .produmt .prodlist .proam .vom .bit {

          width: 100%;

          color: #fff;

          font-weight: bold;

          line-height: 1.4; }

        .produmt .prodlist .proam .vom .em {

          width: 100%;

          color: #e7e7e7;

          line-height: 1.5; }

        .produmt .prodlist .proam .vom .pim {

          width: 100%;

          color: #fff;

          line-height: 1.5;

          height: 3em;

          margin: 0.12rem 0 0.2rem; }

        .produmt .prodlist .proam .vom .more {

          width: 100%;

          color: #fff;

          line-height: 1.5;

          transition: all ease 0.5s; }

          .produmt .prodlist .proam .vom .more span {

            display: inline-block;

            vertical-align: middle;

            width: 7px;

            position: relative;

            top: -0.02rem;

            margin-left: 0.04rem; }

            .produmt .prodlist .proam .vom .more span img {

              width: 100%;

              display: block; }

            .produmt .prodlist .proam .vom .more span img:first-child {

              display: block; }

            .produmt .prodlist .proam .vom .more span img:last-child {

              display: none; }

    .produmt .prodlist .proam:hover {

      z-index: 4;

      transform: scale(1.05); }

      .produmt .prodlist .proam:hover .vom {

        background-color: var(--themes); }

        .produmt .prodlist .proam:hover .vom .bit, .produmt .prodlist .proam:hover .vom .em, .produmt .prodlist .proam:hover .vom .pim {

          color: #fff; }

        .produmt .prodlist .proam:hover .vom .more {

          color: #fff; }

          .produmt .prodlist .proam:hover .vom .more span img:first-child {

            display: none; }

          .produmt .prodlist .proam:hover .vom .more span img:last-child {

            display: block; }

    .produmt .prodlist .proam:nth-child(3n) {

      margin-right: 0; }



.petails {

  width: 100%;

  padding: 0.8rem 0 0 0;

  background-color: #fff; }

  .petails .petail {

    width: 100%;

    font-size: 0;

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between;

    align-items: center; }

    .petails .petail .pel {

      display: inline-block;

      vertical-align: middle;

      width: calc(430 / 1200 * 100%);

      /*margin: 0 calc(50 / 1200 * 100%);*/

      border: solid 1px #ddd; }

      .petails .petail .pel .swiper-slide {

        width: 100%; }

        .petails .petail .pel .swiper-slide .imgs {

          width: 100%;

          position: relative;

          overflow: hidden; }

          .petails .petail .pel .swiper-slide .imgs .img {

            width: 100%;

            padding-top: 100%;

            transition: all ease 0.5s; }

    .petails .petail .per {

      display: inline-block;

      vertical-align: middle;

      width: calc(700 / 1200 * 100%); }

      .petails .petail .per .pit {

        width: 100%;

        color: var(--themes);

        line-height: 1.3;

        font-weight: bold; }

      .petails .petail .per .lx {

        width: 0.2rem;

        height: 2px;

        background-color: var(--themes);

        margin: 0.12rem 0 0.2rem; }

      .petails .petail .per .petuls {

        width: 100%; }

        .petails .petail .per .petuls .pli {

          width: 100%;

          display: flex;

          flex-wrap: wrap;

          padding: 0.02rem 0; }

          .petails .petail .per .petuls .pli .em {

            display: inline-block;

            vertical-align: middle;

            width: auto;

            color: #999;

            line-height: 1.8; }

          .petails .petail .per .petuls .pli .ed {

            display: inline-block;

            vertical-align: middle;

            flex: 1;

            color: #222;

            line-height: 1.8;

            padding-left: 0.1rem; }



.petacont {

  width: 100%;

  background-color: #fff;

  padding: 0.8rem 0; }

  .petacont .pitop {

    width: 100%;

    margin-bottom: 0.3rem; }

    .petacont .pitop .pt {

      width: 100%;

      padding-left: 0.14rem;

      color: var(--themes);

      position: relative;

      font-weight: 400; }

      .petacont .pitop .pt:after {

        content: ' ';

        position: absolute;

        left: 0;

        top: 50%;

        transform: translateY(-50%);

        height: 0.25rem;

        width: 0.04rem;

        border-radius: 0.02rem;

        background-color: var(--themes); }

  .petacont .parameter {

    width: 100%; }

    .petacont .parameter .tables {

      width: 100%;

      overflow-x: auto;

      border: solid 1px #999; }

      .petacont .parameter .tables .table {

        width: auto; }

      .petacont .parameter .tables .tr {

        display: flex; }

      .petacont .parameter .tables .tr + .tr {

        border-top: solid 1px #999; }

      .petacont .parameter .tables .td {

        display: inline-block;

        vertical-align: middle;

        width: 110px;

        border-right: solid 1px #999; }

      .petacont .parameter .tables .td:last-child {

        border: none; }

      .petacont .parameter .tables .td:nth-child(2n-1) {

        background-color: #dedede; }

      .petacont .parameter .tables .td.name {

        width: 240px; }

        .petacont .parameter .tables .td.name .tdm {

          padding: 0.1rem 0.2rem;

          text-align: left;

          justify-content: flex-start; }

      .petacont .parameter .tables .tdm {

        width: 100%;

        height: 100%;

        display: flex;

        flex-wrap: wrap;

        justify-content: center;

        align-items: center;

        color: #666;

        line-height: 1.75;

        word-break: break-word;

        padding: 0.1rem; }

  .petacont .Example {

    width: 100%;

    margin-top: 0.7rem;

    font-size: 0; }

    .petacont .Example .examp {

      display: inline-block;

      vertical-align: top;

      width: calc(560 / 1200 * 100%);

      margin-right: calc(79 / 1200 * 100%); }

      .petacont .Example .examp .exauls {

        width: 100%; }

        .petacont .Example .examp .exauls .eli:first-child {

          border-top: solid 1px #999; }

        .petacont .Example .examp .exauls .eli {

          width: 100%;

          font-size: 0;

          display: flex;

          padding: 0.15rem 0;

          border-bottom: solid 1px #999; }

          .petacont .Example .examp .exauls .eli .ec {

            display: inline-block;

            vertical-align: top;

            width: 10px;

            height: 14px;

            margin-right: 0.1rem;

            margin-top: calc(0.75em - 7px); }

            .petacont .Example .examp .exauls .eli .ec img {

              width: 100%;

              display: block; }

          .petacont .Example .examp .exauls .eli .ep {

            display: inline-block;

            vertical-align: middle;

            flex: 1;

            color: #666;

            line-height: 1.5; }

    .petacont .Example .examp:nth-child(2n) {

      margin-right: 0; }



@media (max-width: 800px) {

  .petacont .parameter .tables .table {

    width: 17rem; }

  .petacont .parameter .tables .td.name {

    width: 180px; }

  .petacont .parameter .tables .td:first-child {

    position: sticky;

    left: 0; } }

.prolistm {

  width: 100%;

  padding: 0.8rem 0;

  background-color: #dedede; }

  .prolistm .prolim {

    width: 100%;

    font-size: 0;

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between; }

    .prolistm .prolim .plm {

      display: inline-block;

      vertical-align: top;

      width: calc(280 / 1200 * 100%); }

      .prolistm .prolim .plm .prlist {

        width: 100%; }

        .prolistm .prolim .plm .prlist .pli {

          width: 100%; }

          .prolistm .prolim .plm .prlist .pli .ns {

            width: 100%;

            padding: 0.2rem 0.3rem;

            font-size: 0;

            background-color: #fff;

            cursor: pointer; }

            .prolistm .prolim .plm .prlist .pli .ns .rc {

              display: inline-block;

              vertical-align: middle;

              width: 7px;

              margin-right: 0.1rem;

              transition: all ease 0.5s;

              transform: rotate(0); }

              .prolistm .prolim .plm .prlist .pli .ns .rc img {

                width: 100%;

                display: block; }

              .prolistm .prolim .plm .prlist .pli .ns .rc img:first-child {

                display: block; }

              .prolistm .prolim .plm .prlist .pli .ns .rc img:last-child {

                display: none; }

            .prolistm .prolim .plm .prlist .pli .ns .am {

              display: inline-block;

              vertical-align: middle;

              width: calc(100% - 7px - 0.1rem);

              color: #222;

              line-height: 1.5; }

              .prolistm .prolim .plm .prlist .pli .ns .am a {

                width: 100%;

                display: block;

                color: #222;

                line-height: 1.5; }

          .prolistm .prolim .plm .prlist .pli .puls {

            width: 100%;

            background-color: #f7f7f7;
            display: none;

            padding: 0.15rem 0.3rem; }

            .prolistm .prolim .plm .prlist .pli .puls .plc {

              width: 100%; }

              .prolistm .prolim .plm .prlist .pli .puls .plc a {

                width: 100%;

                font-size: 0;

                display: flex;

                align-items: center;

                padding: 0.08rem 0; }

              .prolistm .prolim .plm .prlist .pli .puls .plc .dx {

                display: inline-block;

                vertical-align: middle;

                color: #999;

                line-height: 1.5;

                margin-right: 0.1rem;

                width: auto; }

              .prolistm .prolim .plm .prlist .pli .puls .plc .em {

                display: inline-block;

                vertical-align: middle;

                flex: 1;

                color: #666;

                line-height: 1.5; }

            .prolistm .prolim .plm .prlist .pli .puls .plc.active .dx, .prolistm .prolim .plm .prlist .pli .puls .plc.active .em, .prolistm .prolim .plm .prlist .pli .puls .plc:hover .dx, .prolistm .prolim .plm .prlist .pli .puls .plc:hover .em {

              color: var(--themes); }

        .prolistm .prolim .plm .prlist .pli.has-puls.show .ns {

          background-color: var(--themes); }

          .prolistm .prolim .plm .prlist .pli.has-puls.show .ns .am {

            color: #fff; }

            .prolistm .prolim .plm .prlist .pli.has-puls.show .ns .am a {

              color: #fff; }

          .prolistm .prolim .plm .prlist .pli.has-puls.show .ns .rc {

            transform: rotate(90deg); }

            .prolistm .prolim .plm .prlist .pli.has-puls.show .ns .rc img:first-child {

              display: none; }

            .prolistm .prolim .plm .prlist .pli.has-puls.show .ns .rc img:last-child {

              display: block; }

    .prolistm .prolim .prm {

      display: inline-block;

      vertical-align: top;

      width: calc(880 / 1200 * 100%); }

      .prolistm .prolim .prm .prlem {

        width: 100%;

        display: none; }

      .prolistm .prolim .prm .prlem.on {

        display: block; }

      .prolistm .prolim .prm .pevop {

        width: 100%;

        margin-bottom: 0.3rem; }

        .prolistm .prolim .prm .pevop .pid {

          width: 100%;

          color: var(--themes);

          line-height: 1.5;

          margin-bottom: 0.15rem; }

        .prolistm .prolim .prm .pevop .pims {

          width: 100%;

          color: #666;

          line-height: 1.6; }

          .prolistm .prolim .prm .pevop .pims p {

            color: #666;

            line-height: 1.6; }

      .prolistm .prolim .prm .prmlist {

        width: 100%;

        font-size: 0; }

        .prolistm .prolim .prm .prmlist .peavm {

          display: inline-block;

          vertical-align: top;

          width: calc(280 / 880 * 100%);

          margin-right: calc(19 / 880 * 100%);

          transition: all ease 0.5s;

          margin-bottom: 0.2rem; }

          .prolistm .prolim .prm .prmlist .peavm a {

            width: 100%;

            display: block;

            padding: 0.3rem;

            background-color: #fff;

            position: relative; }

            .prolistm .prolim .prm .prmlist .peavm a:after {

              content: ' ';

              position: absolute;

              top: 0;

              left: 0;

              width: 100%;

              z-index: 2;

              height: 0.02rem;

              background-color: var(--themes);

              transition: all ease 0.5s;

              opacity: 0; }

          .prolistm .prolim .prm .prmlist .peavm .imgs {

            width: 100%;

            position: relative;

            overflow: hidden; }

            .prolistm .prolim .prm .prmlist .peavm .imgs .img {

              width: 100%;

              padding-top: 106.27%;

              transition: all ease 0.5s; }

          .prolistm .prolim .prm .prmlist .peavm .cim {

            width: 100%;

            color: #222;

            line-height: 1.5;

            text-align: center;

            margin-top: 0.14rem; }

        .prolistm .prolim .prm .prmlist .peavm:nth-child(3n) {

          margin-right: 0; }

        .prolistm .prolim .prm .prmlist .peavm:hover a {

          box-shadow: 0px 10px 20px 0px rgba(6, 78, 149, 0.1); }

          .prolistm .prolim .prm .prmlist .peavm:hover a:after {

            opacity: 1; }

        .prolistm .prolim .prm .prmlist .peavm:hover .imgs .img {

          transform: scale(1.1); }

        .prolistm .prolim .prm .prmlist .peavm:hover .cim {

          color: var(--themes); }



.searchlom {

  width: 100%;

  padding: 0.3rem 0; }

  .searchlom .results {

    width: 100%; }

    .searchlom .results .rips {

      width: 100%;

      color: #222;

      line-height: 1.5; }

      .searchlom .results .rips a {

        display: inline-block;

        color: #222;

        line-height: 1.5;

        margin-right: 0.25rem; }

        .searchlom .results .rips a i {

          display: inline-block;

          margin: 0 0.06rem;

          color: var(--themes);

          font-style: normal; }

    .searchlom .results .resulis {

      width: 100%;

      margin-top: 0.4rem; }

      .searchlom .results .resulis .reuom {

        width: 100%;

        border: solid 1px #ddd;

        transition: all ease 0.5s;

        border-radius: 0.2rem; }

        .searchlom .results .resulis .reuom a {

          width: 100%;

          display: block;

          padding: 0.3rem 0.25rem; }

        .searchlom .results .resulis .reuom .cit {

          width: 100%;

          font-size: 0; }

          .searchlom .results .resulis .reuom .cit .cp {

            display: inline-block;

            vertical-align: middle;

            max-width: calc(100% - 6em);

            color: #222;

            line-height: 1.5;

            padding-right: 0.2rem; }

            .searchlom .results .resulis .reuom .cit .cp span {

              color: var(--themes); }

          .searchlom .results .resulis .reuom .cit .tic {

            display: inline-block;

            vertical-align: middle;

            color: #fff;

            /*width: 6em;*/

            line-height: 2;

            text-align: center;

            border-radius: 1em;

            background-color: var(--themes);
            
            padding: 0 0.2rem; }

        .searchlom .results .resulis .reuom .vim {

          width: 100%;

          color: #888;

          line-height: 2;

          margin-top: 0.08rem; }

      .searchlom .results .resulis .reuom:hover {

        background-color: #fff;

        border: 1px solid #ddd;

        box-shadow: 0px 0px 20px 2px rgba(0, 0, 0, 0.1); }

      .searchlom .results .resulis .reuom + .reuom {

        margin-top: 0.3rem; }

        .examper {
          width: 100%;
          padding: 0.4rem 0; }
          .examper .exit {
            width: 100%;
            color: #333;
            font-weight: bold;
            line-height: 1.5;
            margin-bottom: 0.4rem;
            text-align: center; }
          .examper .swiper-slide {
            width: 100%; }
            .examper .swiper-slide a {
              width: 100%;
              display: block; }
            .examper .swiper-slide .imgs {
              width: 100%;
              position: relative;
              overflow: hidden; }
              .examper .swiper-slide .imgs .img {
                width: 100%;
                padding-top: 100%;
                transition: all ease 0.5s; }
            .examper .swiper-slide .sim {
              width: 100%;
              color: #333;
              line-height: 1.5;
              text-align: center;
              margin-top: 0.14rem; }