@charset "UTF-8";



.w1600 {



  width: 16rem;



  margin: 0 auto;



  position: relative;



  font-size: 0; }







@media (max-width: 1680px) {



  .w1600 {



    width: 90%; } }



@media (max-width: 800px) {



  .w1600 {



    width: 94%; } }



.w1400 {



  width: 14rem;



  margin: 0 auto;



  position: relative;



  font-size: 0; }







@media (max-width: 1480px) {



  .w1400 {



    width: 90%; } }



@media (max-width: 800px) {



  .w1400 {



    width: 94%; } }



.w1280 {



  width: 12.8rem;



  margin: 0 auto;



  position: relative;



  font-size: 0; }







@media (max-width: 1360px) {



  .w1280 {



    width: 90%; } }



@media (max-width: 800px) {



  .w1280 {



    width: 94%; } }



.w1000 {



  width: 10rem;



  margin: 0 auto;



  position: relative;



  font-size: 0;



  max-width: 100%; }







@media (max-width: 1020px) {



  .w1000 {



    width: 90%; } }



@media (max-width: 800px) {



  .w1000 {



    width: 94%; } }



:root {



  --themes: #ee7c1c;



  --ghemes: #c5272c; }







header {



  position: fixed;



  top: 0;



  left: 0;



  right: 0;



  z-index: 50;



  transition: all ease 0.5s;



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



  header .hop {



    width: 100%;



    display: flex;



    justify-content: space-between;



    transition: all ease 0.5s;



    min-height: 1rem;



    align-items: center; }



  header .rav {



    width: auto;



    display: inline-block;



    vertical-align: middle;



    font-size: 0;



    display: flex;



    align-items: center; }



    header .rav .search {



      display: inline-block;



      vertical-align: middle;



      text-align: center;



      cursor: pointer;



      position: relative;



      width: 0.4rem;



      height: 0.4rem;



      border-radius: 50%;



      background-color: #f3f5f9; }



      header .rav .search .sc {



        display: inline-block;



        vertical-align: middle;



        width: 15px;



        height: 15px;



        position: absolute;



        left: 50%;



        top: 50%;



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



        z-index: 3; }



        header .rav .search .sc img {



          width: 100%;



          height: 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);



        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(--ghemes);



        position: relative; }



        header .rav .sechom .stn img {



          position: absolute;



          top: 50%;



          left: 50%;



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



          width: 15px;



          height: 15px;



          display: block;



          cursor: pointer;



          z-index: 1;



          filter: grayscale(1000%) brightness(2000%); }



        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 .menu {



      display: inline-block;



      vertical-align: middle;



      width: 20px;



      height: 20px;



      cursor: pointer;



      position: relative;



      display: none; }



      header .rav .menu img {



        width: 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 .rav .languages {
      width: auto;
      display: inline-block;
      vertical-align: middle;
      font-size: 0;
      text-align: left;
      z-index: 3;
      margin-left: 0.14rem; }
      header .rav .languages .lauges {
        width: 100%;
        display: inline-block;
        vertical-align: middle;
        position: relative; }
        header .rav .languages .lauges .lashow {
          width: 100%;
          position: relative;
          cursor: pointer;
          font-size: 0;
          white-space: nowrap;
          line-height: 50px;
          padding-right: 16px; 
            
        }
          header .rav .languages .lauges .lashow .ac {
            display: inline-block;
            vertical-align: middle;
            width: 0.3rem;
            /*height: 0.3rem;*/
            /*background-color: var(--ghemes);*/
            /*border-radius: 50%;*/
            /*margin-right: 0.1rem; */
              
          }
            header .rav .languages .lauges .lashow .ac img {
              width: 100%;
              display: block; }
          header .rav .languages .lauges .lashow .am {
            color: #333;
            display: inline-block;
            vertical-align: middle;
            width: auto; }
          header .rav .languages .lauges .lashow:after {
            content: ' ';
            position: absolute;
            right: 0rem;
            top: calc(50%);
            transform: translateY(-50%);
            background-image: url("../images/i5.png");
            width: 12px;
            height: 8px;
            background-size: 100%; }
        header .rav .languages .lauges .language {
          position: absolute;
          z-index: 20;
          top: 100%;
          width: 100%;
          display: none;
          width: 60px;
          width: 1rem;
          left: 50%;
          transform: translateX(-50%); }
          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 .xd {
                width: 0.3rem;
                margin-right: 0.1rem; }
              header .rav .languages .lauges .language .latem a:after {
                content: "";
                position: absolute;
                width: 140%;
                height: 100%;
                left: -10%;
                top: 0;
                z-index: -1;
                transform: translate(-105%, 0) skew(-20deg);
                background-color: var(--ghemes);
                z-index: 1;
                animation: outHover 0.5s ease 1 forwards; }
            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 {
                animation-name: onHover; }
@keyframes onHover {
  from {
    transform: translate(-110%, 0) skew(-20deg); }
  to {
    transform: translate(0, 0) skew(-20deg); } }
@keyframes outHover {
  from {
    transform: translate(0, 0) skew(-20deg); }
  to {
    transform: translate(110%, 0) skew(-20deg); } }



  header .logo {



    display: inline-block;



    vertical-align: middle;



    width: auto;



    font-size: 0;



    white-space: nowrap; }



    header .logo .log {



      width: 2.5rem;



      display: inline-block;



      vertical-align: middle; }



      header .logo .log a, header .logo .log img {



        width: 100%;



        display: block; }



  header nav {



    width: 100%;



    display: block;



    text-align: right; }



    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.1rem; }



        header nav .natem .nas a {



          display: inline-block;



          line-height: 1rem;



          color: #222;



          position: relative;



          padding: 0 0.15rem;



          transition: all ease 0.5s; }



        header nav .natem .nas:after {



          content: ' ';



          position: absolute;



          left: 50%;



          bottom: 0rem;



          transform: translateX(-50%);



          opacity: 0;



          background-color: #fff;



          transition: all ease 0.5s;



          width: 0;



          height: 0.02rem; }



      header nav .natem .navuls {



        width: 2.2rem;



        width: 2rem;



        position: absolute;



        z-index: 101;



        left: calc(50%);



        top: 100%;



        transform: translateX(-50%);



        display: none; }



        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.has-nav .nas .xs {



      display: inline-block; }



    header nav .natem.on .nas a {



      color: var(--themes); }



    header nav .natem.on .nas:after {



      opacity: 1;



      width: 100%; }



    header nav .natem.on .nas .xs img:first-child {



      display: none; }



    header nav .natem.on .nas .xs img:last-child {



      display: block; }



    header nav .natem:hover .nas a {



      color: var(--themes); }



    header nav .natem:hover .nas .xs img:first-child {



      display: none; }



    header nav .natem:hover .nas .xs img:last-child {



      display: block; }



    header nav .natem:hover .nas:after {



      opacity: 1;



      width: 100%; }







@media (max-width: 900px) {



  header {



    background-color: #fff; }



    header .hop {



      align-items: center;



      padding: 0.1rem 0; }



    header .blace {



      position: fixed;



      z-index: -1;



      width: 100%;



      height: 100%;



      left: 0;



      top: 0;



      z-index: 450;



      display: none;



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



    header nav {



      width: 100%;



      width: 5rem;



      position: fixed;



      right: -100%;



      top: 0;



      left: auto;



      height: 100vh;



      background-color: #fff;



      margin-right: 0;



      overflow: auto;



      z-index: 500;



      transition: all ease  1.2s;



      padding-left: 0.1rem;



      padding: 0.1rem;



      display: block;



      text-align: left;



      opacity: 0;



      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 .logo .lm {



      color: #333; }



    header .rav .menu {



      width: 30px;



      height: 30px;



      display: inline-block;



      margin-left: 0.2rem; }



      header .rav .menu img:first-child {



        display: none; }



      header .rav .menu img:last-child {



        display: block; }



      header .rav .menu .clk {



        line-height: 30px; }



    header .rav .searcom {



      width: 80px;



      background-color: #f8f8f8;



      top: 1rem; }



      header .rav .searcom .input input {



        color: #333; }



      header .rav .searcom .input input::-webkit-input-placeholder,



      header .rav .searcom .input textarea::-webkit-input-placeholder {



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



      header .rav .searcom .input input:-moz-placeholder,



      header .rav .searcom .input textarea:-moz-placeholder {



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



      header .rav .searcom .input input::-moz-placeholder,



      header .rav .searcom .input textarea::-moz-placeholder {



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



      header .rav .searcom .input input:-ms-input-placeholder,



      header .rav .searcom .input textarea:-ms-input-placeholder {



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



    header .rav .search {



      width: 30px;



      height: 30px;



      display: inline-block; }



    header .rav .sechom {



      width: 100vw;



      position: fixed;



      left: 0;



      top: calc(1rem);



      padding: 0.15rem; }







  header.menu-state .rav .menu img {



    opacity: 0; }



  header.menu-state nav {



    opacity: 1;



    right: 0; }



  header.menu-state .blace {



    opacity: 1; } }



.banner {



  width: 100%;



  position: relative; }



  .banner .swiper-slide {



    width: 100%;



    position: relative; }



    .banner .swiper-slide .imgs {



      width: 100%;



      position: relative;



      overflow: hidden; }



      .banner .swiper-slide .imgs .img {



        width: 100%;



        padding-top: 50%; }



    .banner .swiper-slide .box {



      position: absolute;



      top: 50%;



      left: calc(260 / 1920 * 100%);



      transform: translateY(-50%);



      z-index: 3;



      width: 80%;



      max-width: 7rem;



      text-align: left; }



      .banner .swiper-slide .box .bit {



        width: 100%;



        color: #fff;



        line-height: 1.2;



        margin-bottom: 0.15rem;



        opacity: 0;



        transform: translate3d(0, 25%, 0);



        transition: opacity 1s ease-out 0.2s,transform 1s ease-out 0.2s,box-shadow .3s; }



        .banner .swiper-slide .box .bit p {



          color: #fff;



          line-height: 1.2; }



      .banner .swiper-slide .box .binp {



        width: 100%;



        color: #fff;



        line-height: 1.5;



        margin: 0.215rem 0 0.25rem;



        opacity: 0;



        transform: translate3d(0, 25%, 0);



        transition: opacity 1s ease-out 0.2s,transform 1s ease-out 0.2s,box-shadow .3s; }



        .banner .swiper-slide .box .binp p {



          color: #fff;



          line-height: 1.5; }



      .banner .swiper-slide .box .poc {



        width: 100%;



        font-size: 0;



        opacity: 0;



        transform: translate3d(0, 25%, 0);



        transition: opacity 1s ease-out 0.2s,transform 1s ease-out 0.2s,box-shadow .3s;



        margin-top: 0.35rem;



        max-width: 5.3rem; }



        .banner .swiper-slide .box .poc span {



          display: inline-block;



          vertical-align: middle;



          max-width: 100%;



          width: auto; }



          .banner .swiper-slide .box .poc span img {



            width: 100%;



            display: block; }



    .banner .swiper-slide .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: 5; }



      .banner .swiper-slide .videoc .vom {



        position: absolute;



        left: 0;



        top: 0;



        width: 100%;



        height: 100%;



        z-index: 3; }



  .banner .swiper-slide-active .box .bit, .banner .swiper-slide-active .box .binp, .banner .swiper-slide-active .box .poc {



    opacity: 1;



    transform: translate3d(0, 0, 0); }



  .banner .botom {



    position: absolute;



    left: 0;



    width: 100%;



    bottom: 0.75rem;



    z-index: 3; }



    .banner .botom .vomd {



      width: 100%;



      display: flex;



      flex-wrap: wrap;



      align-items: center;



      justify-content: space-between; }



    .banner .botom .pagination {



      display: inline-block;



      vertical-align: middle;



      width: auto;



      font-size: 0;



      white-space: nowrap; }



      .banner .botom .pagination .pi {



        display: inline-block;



        vertical-align: middle;



        width: 12px;



        height: 12px;



        margin-right: 0.1rem;



        position: relative;



        cursor: pointer;



        border-radius: 50%;



        transform: scale(0.8);



        transition: all ease 0.5s;



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



      .banner .botom .pagination .pi.on {



        background-color: var(--themes);



        transform: scale(1); }



    .banner .botom .nums {



      display: inline-block;



      vertical-align: middle;



      width: auto;



      font-size: 0; }



      .banner .botom .nums .lx {



        display: inline-block;



        vertical-align: middle;



        color: #fff;



        line-height: 1.5;



        font-weight: bold;



        margin: 0 0.02rem; }



      .banner .botom .nums .now {



        color: var(--themes); }







@media (max-width: 1380px) {



  .banner .swiper-slide .box {



    left: 5%; } }



@media (max-width: 800px) {



  .banner .swiper-slide .box {



    left: 3%; }



    .banner .swiper-slide .box .poc {



      max-width: 3rem; }



  .banner .swiper-slide .imgs .img {



    padding-top: 65%; }



  .banner .botom {



    bottom: 0.3rem; } }



footer {



  width: 100%;



  background-color: #181818;



  padding: 1rem 0; }



  footer .ftop, footer .fbot {



    width: 100%; }



  footer .lx {



    width: 100%;



    margin: 0.25rem 0 0.35rem;



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



  footer .fop {



    width: 100%;



    display: flex;



    flex-wrap: wrap;



    justify-content: space-between;



    align-items: flex-end; }



    footer .fop .ftl {



      display: inline-block;



      vertical-align: top; }



      footer .fop .ftl .fogo {



        width: 100%;



        font-size: 0; }



        footer .fop .ftl .fogo a {



          display: inline-block;



          vertical-align: middle;



          width: 2.5rem; }



          footer .fop .ftl .fogo a img {



            width: 100%;



            display: block; }



    footer .fop .ftr {



      display: inline-block;



      vertical-align: middle;



      width: auto;



      flex: 1;



      text-align: right; }



      footer .fop .ftr .fam {



        display: inline-block;



        vertical-align: middle;



        width: auto;



        margin-left: 0.3rem; }



        footer .fop .ftr .fam a {



          display: inline-block;



          vertical-align: middle;



          color: #fff;



          line-height: 1.5;



          margin-bottom: 0.1rem; }



        footer .fop .ftr .fam a:hover {



          color: var(--themes); }



  footer .fob {



    width: 100%;



    display: flex;



    flex-wrap: wrap;



    justify-content: space-between;



    flex-direction: row-reverse; }



    footer .fob .fbl {



      display: inline-block;



      vertical-align: top;



      width: auto;



      flex: 1;



      padding-right: 0.8rem; }



      footer .fob .fbl .fuls {



        width: 100%;



        font-size: 0;



        max-width: 7rem; }



        footer .fob .fbl .fuls .fli {



          display: inline-block;



          vertical-align: top;



          width: 49%;



          margin-right: 2%;



          margin-bottom: 0.1rem;



          color: #fff;



          line-height: 1.75; }



        footer .fob .fbl .fuls .fli:nth-child(2n) {



          margin-right: 0; }



    footer .fob .fbr {



      display: inline-block;



      vertical-align: top;



      width: auto; }



      footer .fob .fbr .cm {



        display: block;



        width: 1rem;



        margin: 0 auto 0.12rem; }



        footer .fob .fbr .cm img {



          width: 100%;



          display: block; }



      footer .fob .fbr .mx {



        width: 100%;



        text-align: center;



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



        line-height: 1.5; }



  footer .foe {



    width: 100%;



    margin-top: 0.35rem;



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



    line-height: 1.75; }



    footer .foe a {



      display: inline-block;



      vertical-align: middle;



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



      line-height: 1.75; }



    footer .foe a:hover {



      color: #fff; }



  footer .fox {



    width: 100%;



    display: none; }







@media (max-width: 800px) {



  footer .fop .ftr .fam {



    margin-right: 0.3rem;



    margin-left: 0; } }



.icons {



  width: 100%;



  background-color: #252525;



  padding: 0.2rem 0 0.1rem; }



  .icons .iconlist {



    width: 100%;



    font-size: 0;



    display: flex;



    flex-wrap: wrap; }



    .icons .iconlist .ictom {



      display: inline-block;



      vertical-align: top;



      width: 20%;



      padding: 0.2rem;



      margin-bottom: 0.1rem; }



      .icons .iconlist .ictom .imgs {



        width: 100%;



        position: relative;



        overflow: hidden;



        transition: all ease 0.5s; }



        .icons .iconlist .ictom .imgs .img {



          width: 100%;



          padding-top: 0.4rem; }



    .icons .iconlist .ictom:hover .imgs {



      transform: scale(1.08); }







.modular {



  width: 100%; }



  .modular .mitop {



    width: 100%;



    display: flex;



    flex-wrap: wrap;



    justify-content: space-between;



    margin-bottom: 0.4rem; }



    .modular .mitop .mol {



      display: inline-block;



      vertical-align: middle;



      width: auto; }



      .modular .mitop .mol .cit {



        width: 100%;



        color: var(--ghemes);



        line-height: 1.3;



        font-weight: bold; }



        .modular .mitop .mol .cit span {



          color: #111; }



      .modular .mitop .mol .eit {



        width: 100%;



        color: #444;



        font-weight: bold;



        line-height: 1.5;



        margin-top: 0.1rem; }



    .modular .mitop .mor {



      display: inline-block;



      vertical-align: middle;



      width: auto; }



      .modular .mitop .mor .more {



        display: inline-block;



        vertical-align: middle;



        width: auto; }



      .modular .mitop .mor .dtn {



        display: inline-block;



        vertical-align: middle;



        width: auto;



        border: solid 1px rgba(197, 39, 44, 0.2);



        padding: 0.08rem;



        border-radius: calc(1.5em + 0.08rem);



        transition: all ease 0.5s; }



        .modular .mitop .mor .dtn a {



          display: inline-block;



          line-height: 3;



          border-radius: 1.5em;



          background-color: var(--ghemes);



          color: #fff;



          padding: 0 0.3rem; }



          .modular .mitop .mor .dtn a span {



            display: inline-block;



            vertical-align: middle;



            margin-left: 0.25rem;



            width: 11px;



            transition: all ease 0.5s; }



            .modular .mitop .mor .dtn a span img {



              width: 100%;



              display: block; }



      .modular .mitop .mor .dtn:hover {



        transform: scale(1.06); }



        .modular .mitop .mor .dtn:hover a span {



          transform: rotate(45deg); }



  .modular .mitop.mid {



    text-align: center; }



    .modular .mitop.mid .mol {



      width: 100%; }



      .modular .mitop.mid .mol .cit {



        color: #222; }







.modular.white .mitop .mol .cit {



  color: #fff; }



  .modular.white .mitop .mol .cit span {



    color: #fff; }



.modular.white .mitop .mol .eit {



  color: #fff; }







.news {



  width: 100%;



  padding: 1rem 0 0.8rem; }



  .news .newpers {



    width: 100%; }



    .news .newpers .swiper-slide {



      width: 100%;



      position: relative;



      background-color: #f5f5f5;



      border-radius: 0.15rem;



      overflow: hidden; }



      .news .newpers .swiper-slide a {



        width: 100%;



        display: block; }



      .news .newpers .swiper-slide .imgs {



        width: 100%;



        position: relative;



        overflow: hidden; }



        .news .newpers .swiper-slide .imgs .img {



          width: 100%;



          padding-top: 56.36%;



          transition: all ease 0.5s; }



      .news .newpers .swiper-slide .com {



        width: 100%;



        padding: 0.3rem 0.2rem; }



        .news .newpers .swiper-slide .com .time {



          width: 100%;



          color: #222;



          line-height: 1.5; }



          .news .newpers .swiper-slide .com .time span {



            display: inline-block;



            vertical-align: middle;



            width: 0.21rem;



            position: relative;



            top: -0.02rem;



            margin-right: 0.1rem; }



            .news .newpers .swiper-slide .com .time span img {



              width: 100%;



              display: block; }



        .news .newpers .swiper-slide .com .xim {



          width: 100%;



          color: #222;



          line-height: 1.5;



          margin: 0.1rem 0 0.2rem;



          height: 3em; }



        .news .newpers .swiper-slide .com .ic {



          display: block;



          width: 0.21rem; }



          .news .newpers .swiper-slide .com .ic img {



            width: 100%;



            display: block; }



    .news .newpers .swiper-slide:hover .imgs .img {



      transform: scale(1.1); }



    .news .newpers .swiper-slide:hover .com .xim {



      color: var(--ghemes); }



    .news .newpers .swiper-container {



      padding-bottom: 0.45rem; }



    .news .newpers .swiper-pagination {



      bottom: 0; }



    .news .newpers .swiper-pagination-bullet {



      display: inline-block;



      vertical-align: middle;



      width: 12px;



      height: 12px;



      margin-right: 0.1rem;



      position: relative;



      cursor: pointer;



      border-radius: 50%;



      transform: scale(0.8);



      transition: all ease 0.5s;



      background-color: rgba(0, 0, 0, 0.4); }



    .news .newpers .swiper-pagination-bullet-active {



      background-color: var(--themes);



      transform: scale(1); }







.abouts {



  width: 100%;



  padding: 1.6rem 0 0;



  overflow: hidden; }



  .abouts .aboum {



    width: 100%;



    display: flex;



    flex-wrap: wrap;



    justify-content: space-between;



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



    .abouts .aboum .abl {



      display: inline-block;



      vertical-align: middle;



      width: calc(710 / 1660 * 100%); }



      .abouts .aboum .abl .lit {



        width: 100%;



        color: #222;



        font-weight: bold;



        line-height: 1.3;



        margin-bottom: 0.35rem; }



      .abouts .aboum .abl .sinp {



        width: 100%;



        color: #444;



        line-height: 1.5;



        margin-bottom: 0.45rem; }



        .abouts .aboum .abl .sinp p {



          color: #444;



          line-height: 1.5; }



      .abouts .aboum .abl .datas {



        width: 100%;



        font-size: 0;



        display: flex;



        flex-wrap: wrap;



        justify-content: space-between; }



        .abouts .aboum .abl .datas .daom {



          display: inline-block;



          vertical-align: top;



          width: auto;



          padding-right: 0.3rem; }



          .abouts .aboum .abl .datas .daom .xum {



            width: 100%;



            color: var(--themes); }



            .abouts .aboum .abl .datas .daom .xum span {



              display: inline-block;



              color: var(--themes);



              font-weight: bold; }



          .abouts .aboum .abl .datas .daom .lim {



            width: 100%;



            margin-top: 0.1rem;



            color: #444;



            line-height: 1.2; }



      .abouts .aboum .abl .more {



        width: 100%;



        font-size: 0;



        margin-top: 0.88rem; }



        .abouts .aboum .abl .more .dtn {



          display: inline-block;



          vertical-align: middle;



          width: auto;



          border: solid 1px rgba(197, 39, 44, 0.2);



          padding: 0.08rem;



          border-radius: calc(1.5em + 0.08rem);



          transition: all ease 0.5s; }



          .abouts .aboum .abl .more .dtn a {



            display: inline-block;



            line-height: 3;



            border-radius: 1.5em;



            background-color: var(--ghemes);



            color: #fff;



            padding: 0 0.3rem; }



            .abouts .aboum .abl .more .dtn a span {



              display: inline-block;



              vertical-align: middle;



              margin-left: 0.25rem;



              width: 11px;



              transition: all ease 0.5s; }



              .abouts .aboum .abl .more .dtn a span img {



                width: 100%;



                display: block; }



        .abouts .aboum .abl .more .dtn:hover {



          transform: scale(1.06); }



          .abouts .aboum .abl .more .dtn:hover a span {



            transform: rotate(45deg); }



    .abouts .aboum .abr {



      display: inline-block;



      vertical-align: middle;



      width: calc(885 / 1660 * 100%);



      position: relative; }



      .abouts .aboum .abr .imgs {



        width: 100%;



        position: relative;



        overflow: hidden; }



        .abouts .aboum .abr .imgs .img {



          width: 100%;



          padding-top: 74.01%;



          transition: all ease 0.5s; }



      .abouts .aboum .abr .play {



        position: absolute;



        z-index: 3;



        left: 50%;



        top: 50%;



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



        width: 1rem;



        height: 1rem;



        cursor: pointer;



        transition: all ease 0.5s; }



        .abouts .aboum .abr .play img {



          width: 100%;



          display: block; }



      .abouts .aboum .abr .play:hover {



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







@media (max-width: 1480px) {



  .abouts .aboum {



    padding-left: 5%; } }



@media (max-width: 800px) {



  .abouts .aboum {



    padding-left: 3%; } }



.contems {



  width: 100%;



  padding: 1.1rem 0 0.7rem;



  background-color: #eee; }



  .contems .contlist {



    width: 100%;



    display: flex;



    font-size: 0;



    flex-wrap: wrap; }



    .contems .contlist .covem {



      display: inline-block;



      vertical-align: top;



      width: calc(590 / 1400 * 100%);



      margin-right: calc(39 / 1400 * 100%);



      margin-bottom: 0.4rem;



      position: relative;



      border-radius: 0.15rem;



      overflow: hidden; }



      .contems .contlist .covem a {



        width: 100%;



        display: block; }



      .contems .contlist .covem .imgs {



        width: 100%;



        position: relative;



        overflow: hidden; }



        .contems .contlist .covem .imgs .img {



          width: 100%;



          padding-top: 2.9rem;



          transition: all ease 0.5s; }



      .contems .contlist .covem .pom {



        position: absolute;



        left: 0;



        top: 0;



        display: flex;



        flex-wrap: wrap;



        align-content: flex-end;



        padding: 0.3rem;



        z-index: 2;



        width: 100%;



        height: 100%; }



        .contems .contlist .covem .pom .xit {



          width: 100%;



          color: #fff;



          font-weight: bold;



          line-height: 1.2; }



          .contems .contlist .covem .pom .xit span {



            display: inline-block;



            vertical-align: middle;



            width: 0.32rem;



            margin-right: 0.14rem;



            position: relative;



            top: -0.02rem; }



            .contems .contlist .covem .pom .xit span img {



              width: 100%;



              display: block; }



        .contems .contlist .covem .pom .xim {



          width: 100%;



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



          line-height: 1.5;



          margin-top: 0.1rem; }



    .contems .contlist .covem:nth-child(2n) {



      margin-right: 0; }



    .contems .contlist .covem:nth-child(4n+1), .contems .contlist .covem:nth-child(4n+4) {



      width: calc(770 / 1400 * 100%); }



    .contems .contlist .covem:hover .imgs .img {



      transform: scale(1.1); }







.research {



  width: 100%;



  position: relative; }



  .research .bod {



    width: 100%; }



    .research .bod .hei {



      width: 100%;



      padding-top: 43.75%; }



  .research .imglist {



    width: 100%;



    position: absolute;



    top: 0;



    left: 0;



    height: 100%;



    z-index: 2; }



    .research .imglist .imtm {



      width: 100%;



      position: absolute;



      left: 0;



      top: 0;



      height: 100%;



      opacity: 0;



      transition: all ease 0.5s;



      z-index: 1; }



      .research .imglist .imtm .img {



        width: 100%;



        height: 100%;



        display: block; }



    .research .imglist .imtm.on {



      opacity: 1;



      z-index: 3; }



    .research .imglist:after {



      content: ' ';



      position: absolute;



      z-index: 4;



      left: 0;



      top: 0;



      height: 100%;



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



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



      background-size: 100% 100%; }



  .research .reconp {



    width: 100%;



    padding: 1rem 0;



    position: absolute;



    left: 0;



    top: 0;



    width: 100%;



    z-index: 3; }



    .research .reconp .peonst {



      width: 100%;



      margin-top: 1rem;



      position: relative; }



      .research .reconp .peonst .pitem {



        width: 100%;



        max-width: 4.6rem;



        position: absolute;



        top: 0;



        left: 0;



        opacity: 0;



        z-index: 1; }



      .research .reconp .peonst .pit {



        width: 100%;



        color: #fff;



        line-height: 1.5;



        margin-bottom: 0.15rem;



        opacity: 0;



        transform: translate3d(0, 25%, 0);



        transition: opacity 1s ease-out 0.2s,transform 1s ease-out 0.2s,box-shadow .3s;



        font-weight: bold; }



      .research .reconp .peonst .pinp {



        width: 100%;



        color: #fff;



        line-height: 1.5;



        opacity: 0;



        transform: translate3d(0, 25%, 0);



        transition: opacity 1s ease-out 0.2s,transform 1s ease-out 0.2s,box-shadow .3s; }



        .research .reconp .peonst .pinp p {



          color: #fff;



          line-height: 1.5; }



      .research .reconp .peonst .more {



        width: 100%;



        font-size: 0;



        margin-top: 0.5rem;



        opacity: 0;



        transform: translate3d(0, 25%, 0);



        transition: opacity 1s ease-out 0.2s,transform 1s ease-out 0.2s,box-shadow .3s; }



        .research .reconp .peonst .more .dtn {



          display: inline-block;



          vertical-align: middle;



          width: auto;



          border: solid 1px rgba(197, 39, 44, 0.2);



          padding: 0.08rem;



          border-radius: calc(1.5em + 0.08rem);



          transition: all ease 0.5s; }



          .research .reconp .peonst .more .dtn a {



            display: inline-block;



            line-height: 3;



            border-radius: 1.5em;



            background-color: var(--ghemes);



            color: #fff;



            padding: 0 0.3rem; }



            .research .reconp .peonst .more .dtn a span {



              display: inline-block;



              vertical-align: middle;



              margin-left: 0.25rem;



              width: 11px;



              transition: all ease 0.5s; }



              .research .reconp .peonst .more .dtn a span img {



                width: 100%;



                display: block; }



        .research .reconp .peonst .more .dtn:hover {



          transform: scale(1.06); }



          .research .reconp .peonst .more .dtn:hover a span {



            transform: rotate(45deg); }



      .research .reconp .peonst .pitem.on {



        opacity: 1;



        z-index: 3; }



        .research .reconp .peonst .pitem.on .pit, .research .reconp .peonst .pitem.on .pinp, .research .reconp .peonst .pitem.on .more {



          opacity: 1;



          transform: translate3d(0, 0, 0); }



  .research .botnavs {



    position: absolute;



    bottom: 0;



    z-index: 4;



    width: 100%;



    left: 0;



    right: 0;



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



    .research .botnavs .botnav {



      width: 100%; }



      .research .botnavs .botnav .swiper-slide {



        width: 100%; }



        .research .botnavs .botnav .swiper-slide a {



          width: 100%;



          display: block;



          color: #fff;



          line-height: 0.9rem;



          text-align: center; }



          .research .botnavs .botnav .swiper-slide a span {



            display: inline-block;



            vertical-align: middle;



            width: 0.24rem;



            margin-right: 0.05rem; }



            .research .botnavs .botnav .swiper-slide a span img {



              width: 100%;



              display: block; }



      .research .botnavs .botnav .swiper-slide.on {



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







@media (max-width: 1200px) {



  .research .reconp .peonst {



    margin-top: 0.4rem; } }



@media (max-width: 800px) {



  .research .bod .hei {



    padding-top: 100%; }



  .research .reconp .peonst {



    margin-top: 0.4rem; }



    .research .reconp .peonst .pitem {



      max-width: 80%; } }



.product {



  width: 100%;



  padding: 1rem 0;



  background-color: #f2f2f2; }



  .product .protm {



    width: 100%;



    position: relative;



    display: flex;



    flex-wrap: wrap; }



    .product .protm .hidm {



      display: none; }



    .product .protm .prl {



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



      display: inline-block;



      vertical-align: bottom;



      margin-right: calc(149 / 1400 * 100%);



      display: flex;



      flex-wrap: wrap;



      align-content: space-between; }



      .product .protm .prl .classom {



        width: 100%;



        padding-top: 0.3rem; }



        .product .protm .prl .classom .clsom {



          width: 100%;



          display: none; }



        .product .protm .prl .classom .clsom.on {



          display: block; }



      .product .protm .prl .textons {



        width: 100%; }



      .product .protm .prl .texts {



        width: 100%;



        display: none; }



      .product .protm .prl .tit {



        width: 100%;



        color: #222;



        font-weight: bold;



        line-height: 1.4;



        margin-bottom: 0.1rem;



        opacity: 0;



        transform: translate3d(0, 25%, 0);



        transition: opacity 1s ease-out 0.2s,transform 1s ease-out 0.2s,box-shadow .3s; }



      .product .protm .prl .tinp {



        width: 100%;



        color: #444;



        line-height: 1.75;



        opacity: 0;



        transform: translate3d(0, 25%, 0);



        transition: opacity 1s ease-out 0.2s,transform 1s ease-out 0.2s,box-shadow .3s; }



        .product .protm .prl .tinp p {



          color: #444;



          line-height: 1.75; }



      .product .protm .prl .btns {



        width: 100%;



        font-size: 0;



        margin-top: 1rem; }



        .product .protm .prl .btns .btn {



          display: inline-block;



          vertical-align: middle;



          width: 0.5rem;



          height: 0.5rem;



          cursor: pointer;



          border-radius: 50%;



          background-color: #fff; }



          .product .protm .prl .btns .btn img {



            width: 100%;



            display: block; }



          .product .protm .prl .btns .btn img:first-child {



            display: block; }



          .product .protm .prl .btns .btn img:last-child {



            display: none; }



        .product .protm .prl .btns .btn:hover {



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



          .product .protm .prl .btns .btn:hover img:first-child {



            display: none; }



          .product .protm .prl .btns .btn:hover img:last-child {



            display: block; }



        .product .protm .prl .btns .btn + .btn {



          margin-left: 0.1rem; }



      .product .protm .prl .texts.on {



        display: block; }



        .product .protm .prl .texts.on .tit, .product .protm .prl .texts.on .tinp, .product .protm .prl .texts.on .more {



          opacity: 1;



          transform: translate3d(0, 0, 0); }



    .product .protm .prm {



      width: calc(900 / 1400 * 100%);



      display: inline-block;



      vertical-align: bottom; }



      .product .protm .prm .prmitem {



        width: 100%;



        display: none; }



      .product .protm .prm .prmitem.on {



        display: block; }



    .product .protm .prmpers {



      width: 100%; }



      .product .protm .prmpers .swiper-container {



        padding-bottom: 0.1rem; }



      .product .protm .prmpers .swiper-slide {



        width: 100%;



        display: flex;



        align-items: flex-end;



        flex-wrap: wrap;



        height: auto; }



        .product .protm .prmpers .swiper-slide .imp {



          width: 5.6rem;



          height: 5.6rem;



          display: flex;



          flex-wrap: wrap;



          margin: 0 auto;



          align-content: flex-end; }



        .product .protm .prmpers .swiper-slide .imgs {



          width: 2rem;



          display: block;



          margin: 0 auto 0;



          overflow: hidden;



          position: relative;



          transition: all ease 1s;



          opacity: 0.3; }



          .product .protm .prmpers .swiper-slide .imgs .img {



            width: 100%;



            padding-top: 100%; }



        .product .protm .prmpers .swiper-slide .more {



          width: 100%;



          display: block;



          font-size: 0;



          text-align: center;



          margin-top: 0.3rem;



          transition: all ease 0.5s;



          opacity: 0; }



          .product .protm .prmpers .swiper-slide .more .dtn {



            display: inline-block;



            vertical-align: middle;



            width: auto;



            border: solid 1px rgba(197, 39, 44, 0.2);



            padding: 0.08rem;



            border-radius: calc(1.5em + 0.08rem);



            transition: all ease 0.5s; }



            .product .protm .prmpers .swiper-slide .more .dtn a {



              display: inline-block;



              line-height: 3;



              border-radius: 1.5em;



              background-color: var(--ghemes);



              color: #fff;



              padding: 0 0.3rem; }



              .product .protm .prmpers .swiper-slide .more .dtn a span {



                display: inline-block;



                vertical-align: middle;



                margin-left: 0.25rem;



                width: 11px;



                transition: all ease 0.5s; }



                .product .protm .prmpers .swiper-slide .more .dtn a span img {



                  width: 100%;



                  display: block; }



          .product .protm .prmpers .swiper-slide .more .dtn:hover {



            transform: scale(1.06); }



            .product .protm .prmpers .swiper-slide .more .dtn:hover a span {



              transform: rotate(45deg); }



      .product .protm .prmpers .swiper-slide-active .imgs {



        width: 5.6rem;



        opacity: 1; }



      .product .protm .prmpers .swiper-slide-active .more {



        opacity: 1; }



      .product .protm .prmpers .swiper-slide-next .imgs {



        opacity: 0.8; }







@media (max-width: 800px) {



  .product .protm .prr {



    order: 1;



    position: relative;



    width: 100%; }



    .product .protm .prr .pirlist {



      width: 100%;



      height: auto;



      white-space: nowrap; }



      .product .protm .prr .pirlist .piem {



        display: inline-block;



        vertical-align: middle;



        width: auto;



        margin-right: 0.3rem;



        line-height: 3; }



  .product .protm .prm {



    width: 100%;



    order: 2; }



  .product .protm .prl {



    order: 3;



    width: 100%;



    text-align: center;



    margin-right: 0; }



    .product .protm .prl .classom .btns {



      margin-top: 0.2rem; } }



.nanner {



  width: 100%;



  position: relative; }



  .nanner .imgs {



    width: 100%;



    position: relative;



    overflow: hidden; }



    .nanner .imgs .img {



      width: 100%;



      padding-top: 35.41%; }



  .nanner .nox {



    position: absolute;



    left: calc(200 / 1920 * 100%);



    top: 50%;



    transform: translateY(-50%); }



    .nanner .nox .nit {



      width: 100%;



      color: #fff;



      font-weight: bold;



      line-height: 1.5; }



    .nanner .nox .nie {



      width: 100%;



      color: #fff;



      font-weight: bold;



      line-height: 1.5; }







@media (max-width: 1580px) {



  .nanner .nox {



    left: 5%; } }



@media (max-width: 800px) {



  .nanner .nox {



    left: 3%; } }



.crumbs {



  width: 100%;



  background-color: #f5f5f5; }



  .crumbs .column {



    width: 100%;



    display: flex;



    flex-wrap: wrap;



    justify-content: flex-end;



    align-items: center;



    font-size: 0; }



    .crumbs .column .colum {



      width: auto;



      font-size: 0;



      display: inline-block;



      vertical-align: middle; }



      .crumbs .column .colum .home {



        display: inline-block;



        vertical-align: middle;



        width: .2rem;



        height: .2rem;



        min-width: 18px;



        min-height: 18px;



        margin-right: .1rem;



        position: relative;



        top: -0.02rem; }



        .crumbs .column .colum .home img {



          width: 100%;



          display: block; }



      .crumbs .column .colum .sm {



        display: inline-block;



        vertical-align: middle;



        color: #444;



        line-height: 1rem; }



      .crumbs .column .colum a {



        display: inline-block;



        vertical-align: middle;



        width: auto;



        color: #444;



        line-height: 1rem;



        overflow: hidden;



        white-space: nowrap;



        text-overflow: ellipsis; }



        .crumbs .column .colum a span {



          display: inline-block;



          color: #444;



          line-height: 1rem;



          position: relative;



          margin: 0 .08rem; }



          .crumbs .column .colum a span img {



            width: 100%;



            display: block; }



      .crumbs .column .colum a:hover {



        color: var(--ghemes); }



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



        color: #333; }



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



          display: none; }



    .crumbs .column .cul {



      display: inline-block;



      vertical-align: middle;



      flex: 1; }



      .crumbs .column .cul .swiper-slide {



        display: inline-block;



        vertical-align: middle;



        width: auto; }



        .crumbs .column .cul .swiper-slide a {



          display: inline-block;



          vertical-align: middle;



          color: #444;



          line-height: 1rem;



          width: auto;



          padding: 0 0.2rem;



          transition: all ease 0.5s; }



          .crumbs .column .cul .swiper-slide a span {



            display: inline-block;



            vertical-align: middle;



            position: absolute;



            bottom: 0rem;



            left: 50%;



            transform: translateX(-50%);



            width: 100%;



            height: 0.02rem;



            background-color: var(--ghemes);



            transition: all ease 0.5s;



            opacity: 0;



            transition: all ease 0.5s; }



      .crumbs .column .cul .swiper-slide.on a, .crumbs .column .cul .swiper-slide:hover a {



        background-color: var(--ghemes);



        color: #fff; }



      .crumbs .column .cul .swiper-scrollbar {



        background-color: rgba(0, 0, 0, 0.1);



        left: 0;



        right: 0;



        width: 100%;



        bottom: 0;



        display: none; }



      .crumbs .column .cul .swiper-scrollbar-drag {



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



    .crumbs .column .cul.pbs .swiper-container {



      padding-bottom: 0.15rem; }



    .crumbs .column .cul.pbs .swiper-scrollbar {



      display: block; }



  .crumbs .column.xl {



    justify-content: space-between;



    font-size: 0;



    align-items: center; }







.crumbs.white {



  background-color: #fff; }







@media (max-width: 800px) {



  .crumbs .w1400 {



    width: 100%; }



  .crumbs .column {



    flex-direction: column-reverse; }



    .crumbs .column .colum {



      border-bottom: solid 1px #eee;



      display: none; }



    .crumbs .column .cul {



      width: 100%; } }



.joins {



  width: 100%;



  padding: 1rem 0; }



  .joins .joinlist {



    width: 100%;



    font-size: 0;



    display: flex;



    flex-wrap: wrap; }



    .joins .joinlist .jotm {



      display: inline-block;



      vertical-align: top;



      width: calc(440 / 1400 * 100%);



      margin-right: calc(39 / 1400 * 100%);



      margin-bottom: 0.4rem;



      border: solid 1px #ececec;



      border-radius: 0.15rem;



      background-color: #fff;



      position: relative;



      overflow: hidden; }



      .joins .joinlist .jotm a {



        width: 100%;



        display: block; }



      .joins .joinlist .jotm .comp {



        width: 100%;



        position: relative;



        z-index: 2; }



        .joins .joinlist .jotm .comp .comd {



          width: 100%;



          padding: 0.55rem 0.45rem; }



          .joins .joinlist .jotm .comp .comd .cit {



            width: 100%;



            color: #222;



            font-weight: bold;



            line-height: 1.2;



            margin-bottom: 0.24rem; }



          .joins .joinlist .jotm .comp .comd .sinp {



            width: 100%;



            color: #444;



            line-height: 1.75;



            height: 2.5rem;



            overflow: auto;



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



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



            .joins .joinlist .jotm .comp .comd .sinp::-webkit-scrollbar {



              width: 4px;



              height: 4px;



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



            .joins .joinlist .jotm .comp .comd .sinp::-webkit-scrollbar-thumb {



              border-radius: 10px;



              -webkit-box-shadow: inset 0 0 10px rgba(197, 39, 44, 0.7);



              background: rgba(197, 39, 44, 0.7);



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



            .joins .joinlist .jotm .comp .comd .sinp::-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); }



            .joins .joinlist .jotm .comp .comd .sinp p {



              color: #444;



              line-height: 1.75; }



        .joins .joinlist .jotm .comp .bot {



          width: 100%;



          border-top: solid 1px #ececec;



          display: flex; }



          .joins .joinlist .jotm .comp .bot .times {



            display: inline-block;



            vertical-align: middle;



            flex: 1;



            padding: 0.25rem 0.4rem;



            color: #666; }



            .joins .joinlist .jotm .comp .bot .times span {



              display: inline-block;



              vertical-align: middle;



              width: 15px;



              margin-right: 0.06rem;



              position: relative;



              top: -0.02rem; }



              .joins .joinlist .jotm .comp .bot .times span img {



                width: 100%;



                display: block; }



          .joins .joinlist .jotm .comp .bot .ptn {



            display: inline-block;



            vertical-align: middle;



            padding: 0.24rem 0.3rem;



            border-left: solid 1px #ececec; }



            .joins .joinlist .jotm .comp .bot .ptn img {



              display: inline-block;



              vertical-align: middle;



              width: 18px; }



      .joins .joinlist .jotm .bg {



        width: 100%;



        position: absolute;



        left: 0;



        top: 0;



        height: 100%;



        z-index: 1;



        transition: all ease 0.5s;



        opacity: 0; }



        .joins .joinlist .jotm .bg .pm {



          width: 100%;



          height: 100%;



          display: block; }



    .joins .joinlist .jotm:nth-child(3n) {



      margin-right: 0; }



    .joins .joinlist .jotm:hover {



      border: solid 1px var(--ghemes); }



      .joins .joinlist .jotm:hover .bg {



        opacity: 1; }



      .joins .joinlist .jotm:hover .comp .bot {



        border-top: solid 1px rgba(236, 236, 236, 0.2); }



        .joins .joinlist .jotm:hover .comp .bot .times {



          color: #fff; }



          .joins .joinlist .jotm:hover .comp .bot .times span img {



            filter: grayscale(1000%) brightness(2000%); }



        .joins .joinlist .jotm:hover .comp .bot .ptn {



          border-left: solid 1px rgba(236, 236, 236, 0.2); }



          .joins .joinlist .jotm:hover .comp .bot .ptn img {



            filter: grayscale(1000%) brightness(2000%); }



      .joins .joinlist .jotm:hover .comp .comd .cit {



        color: #fff; }



      .joins .joinlist .jotm:hover .comp .comd .sinp {



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



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



        .joins .joinlist .jotm:hover .comp .comd .sinp p {



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



        .joins .joinlist .jotm:hover .comp .comd .sinp::-webkit-scrollbar {



          width: 4px;



          height: 4px;



          scrollbar-arrow-color: rgba(255, 255, 255, 0.7); }



        .joins .joinlist .jotm:hover .comp .comd .sinp::-webkit-scrollbar-thumb {



          border-radius: 10px;



          -webkit-box-shadow: inset 0 0 10px rgba(197, 39, 44, 0.7);



          background: rgba(197, 39, 44, 0.7);



          scrollbar-arrow-color: rgba(255, 255, 255, 0.7); }



        .joins .joinlist .jotm:hover .comp .comd .sinp::-webkit-scrollbar-track {



          border-radius: 10px;



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



          background: rgba(255, 255, 255, 0.7); }







@media (max-width: 800px) {



  .joins .joinlist .jotm .comp .comd .sinp {



    height: auto; } }



.poxop {



  width: 100%;



  height: 100%;



  position: fixed;



  top: 0;



  left: 0;



  background-color: rgba(0, 0, 0, 0.5);



  z-index: 31;



  display: none; }



  .poxop .xosm {



    width: 10rem;



    background-color: #fff;



    border-radius: 0.15rem;



    padding: 0.6rem;



    position: absolute;



    left: 50%;



    top: 52.5%;



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



    z-index: 20;



    max-width: 90%; }



    .poxop .xosm .items {



      width: 100%; }



      .poxop .xosm .items .iteom {



        width: 100%;



        display: none; }



      .poxop .xosm .items .iteom.on {



        display: block; }



      .poxop .xosm .items .xit {



        width: 100%;



        color: #222;



        font-weight: bold;



        line-height: 1.5;



        text-align: center;



        margin-bottom: 0.2rem; }



      .poxop .xosm .items .seom {



        width: 100%;



        font-size: 0;



        border-bottom: solid 1px #eee;



        padding-bottom: 0.1rem;



        margin-bottom: 0.35rem; }



        .poxop .xosm .items .seom span {



          display: inline-block;



          vertical-align: middle;



          color: #444;



          line-height: 1.6;



          margin-bottom: 0.1rem;



          margin-right: 0.4rem; }



      .poxop .xosm .items .vomp {



        width: 100%; }



        .poxop .xosm .items .vomp .vit {



          width: 100%;



          color: #222;



          line-height: 1.5;



          margin-bottom: 0.2rem; }



        .poxop .xosm .items .vomp .vulp {



          width: 100%;



          color: #444;



          line-height: 1.75;



          height: 2.2rem;



          overflow: auto;



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



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



          .poxop .xosm .items .vomp .vulp::-webkit-scrollbar {



            width: 4px;



            height: 4px;



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



          .poxop .xosm .items .vomp .vulp::-webkit-scrollbar-thumb {



            border-radius: 10px;



            -webkit-box-shadow: inset 0 0 10px rgba(197, 39, 44, 0.7);



            background: rgba(197, 39, 44, 0.7);



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



          .poxop .xosm .items .vomp .vulp::-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); }



          .poxop .xosm .items .vomp .vulp p {



            color: #444;



            line-height: 1.75; }



      .poxop .xosm .items .vob {



        width: 100%;



        font-size: 0;



        margin-top: 0.35rem;



        text-align: center; }



        .poxop .xosm .items .vob a {



          display: inline-block;



          vertical-align: middle;



          background-color: var(--ghemes);



          padding: 0 0.3rem;



          color: #fff;



          line-height: 3;



          border-radius: 1.5em; }



          .poxop .xosm .items .vob a span {



            display: inline-block;



            vertical-align: middle;



            width: 19px;



            margin-left: 0.2rem;



            position: relative;



            top: -0.02rem; }



            .poxop .xosm .items .vob a span img {



              width: 100%;



              display: block; }



      .poxop .xosm .items .pinps {



        width: 100%;



        color: #444;



        line-height: 1.75;



        padding-top: 0.4rem;



        margin-top: 0.2rem;



        border-top: solid 1px #e5e5e5; }



        .poxop .xosm .items .pinps p {



          color: #444;



          line-height: 1.75; }



    .poxop .xosm .clost {



      position: absolute;



      right: -0.2rem;



      top: -0.5rem;



      width: 0.3rem;



      cursor: pointer;



      z-index: 11;



      min-width: 20px; }



      .poxop .xosm .clost img {



        width: 100%;



        display: block; }







.pages {



  width: 100%;



  padding: 0.22rem 0 0.25rem;



  font-size: 0;



  text-align: center;



  margin-top: 0.2rem; }



  .pages .page {



    display: inline-block;



    vertical-align: middle;



    width: 0.5rem;



    height: 0.5rem;



    line-height: 0.5rem;



    text-align: center;



    color: #666;



    border-radius: 50%;



    margin: 0 0.05rem 0.1rem; }



  .pages .page.ltn {



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



    background-position: center;



    background-size: 100% 100%;



    background-repeat: no-repeat; }



  .pages .page.rtn {



    background-image: url("../images/b2.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/b3.png");



    background-position: center;



    background-size: 100% 100%;



    background-repeat: no-repeat; }



  .pages .page.on.ltn {



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



    background-position: center;



    background-size: 100% 100%;



    background-repeat: no-repeat; }



  .pages .page.on.rtn {



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



    background-position: center;



    background-size: 100% 100%;



    background-repeat: no-repeat; }



  .pages .page.rtn:hover {



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



    background-position: center;



    background-size: 100% 100%;



    background-repeat: no-repeat; }



  .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.8rem;



    height: 0.8rem;



    line-height: 0.8rem;



    font-size: 16px;



    margin: 0 0.1rem 0.1rem; } }



.mapsom {



  width: 100%;



  position: relative; }



  .mapsom .map {



    width: 100%; }



    .mapsom .map img {



      width: 100%;



      display: block; }



    .mapsom .map .imgs {



      width: 100%;



      position: relative;



      overflow: hidden; }



      .mapsom .map .imgs .img {



        width: 100%;



        padding-top: 31.25%; }



  .mapsom .message {



    width: 100%; }



  .mapsom .mesom {



    width: 100%;



    display: flex;



    flex-wrap: wrap;



    justify-content: space-between;



    align-items: center;



    position: relative; }



    .mapsom .mesom .mel {



      width: calc(370 / 1400 * 100%); }



      .mapsom .mesom .mel .xinp {



        width: 100%;



        color: #fff;



        line-height: 1.75; }



        .mapsom .mesom .mel .xinp p {



          color: #fff;



          line-height: 1.75; }



    .mapsom .mesom .mer {



      width: calc(710 / 1400 * 100%);



      position: relative;



      top: -1.6rem; }



    .mapsom .mesom .merom {



      width: 100%;



      background-color: #000;



      border-radius: 0.16rem;



      padding: 0.6rem 0.5rem; }



      .mapsom .mesom .merom form {



        width: 100%;



        display: block; }



      .mapsom .mesom .merom .mit {



        width: 100%;



        color: #fff;



        font-weight: bold;



        line-height: 1.2;



        margin-bottom: 0.3rem; }



      .mapsom .mesom .merom .row {



        width: 100%;



        font-size: 0; }



      .mapsom .mesom .merom .name {



        width: 100%;



        color: #fff;



        line-height: 1.5;



        margin-bottom: 0.1rem; }



      .mapsom .mesom .merom .input {



        display: inline-block;



        vertical-align: top;



        width: 100%;



        margin-bottom: 0.2rem; }



        .mapsom .mesom .merom .input .int {



          width: 100%;



          display: block;



          border: none;



          background-color: transparent;



          border-bottom: solid 1px rgba(255, 255, 255, 0.2);



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



          line-height: 3.2;



          height: 3.2em; }



      .mapsom .mesom .merom .input:nth-child(2n) {



        margin-right: 0; }



      .mapsom .mesom .merom .text {



        width: 100%;



        display: block; }



        .mapsom .mesom .merom .text .area {



          width: 100%;



          border: solid 1px #ebebeb;



          display: block;



          padding: 0.2rem;



          color: #333;



          line-height: 1.5; }



      .mapsom .mesom .merom .sub {



        width: 100%;



        margin-top: 0.3rem;



        font-size: 0;



        text-align: center; }



        .mapsom .mesom .merom .sub .stn {



          display: inline-block;



          vertical-align: middle;



          background-color: var(--themes);



          color: #fff;



          width: auto;



          padding: 0 0.9rem;



          line-height: 3;



          border-radius: 1.5em;



          height: 3em;



          cursor: pointer;



          border: none; }







@media (max-width: 800px) {



  .mapsom .map .imgs .img {



    padding-top: 62.5%; }



  .mapsom .message {



    top: 0;



    padding: 20px 0; }



  .mapsom .mesom .mel {



    width: 100%;



    margin-bottom: 15px; }



  .mapsom .mesom .mer {



    width: 100%;



    top: 0; }



    .mapsom .mesom .mer .merom {



      box-shadow: 0px 6px 12px 1px rgba(34, 34, 34, 0.2); } }



.content {



  width: 100%;



  padding: 1rem 0; }



  .content .contlis {



    width: 100%;



    font-size: 0;



    display: flex;



    flex-wrap: wrap; }



    .content .contlis .covem {



      display: inline-block;



      vertical-align: middle;



      width: 25%;



      text-align: center; }



      .content .contlis .covem .ic {



        display: block;



        width: 0.7rem;



        height: 0.7rem;



        border-radius: 50%;



        background-color: var(--ghemes);



        margin: 0 auto 0.28rem; }



        .content .contlis .covem .ic img {



          width: 100%;



          display: block; }



      .content .contlis .covem .xp {



        width: 100%;



        color: #000;



        line-height: 1.5; }



      .content .contlis .covem .xim {



        width: 100%;



        color: #000;



        line-height: 1.5;



        margin-top: 0.04rem; }



    .content .contlis .covem:nth-child(2n) .ic {



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







.newsom {



  width: 100%;



  padding: 1rem 0; }



  .newsom .newlist {



    width: 100%;



    font-size: 0;



    display: flex;



    flex-wrap: wrap; }



    .newsom .newlist .newam {



      display: inline-block;



      vertical-align: top;



      width: calc(440 / 1400 * 100%);



      margin-right: calc(39 / 1400 * 100%);



      margin-bottom: 0.4rem;



      position: relative;



      overflow: hidden;



      background-color: #f5f5f5;



      border-radius: 0.16rem; }



      .newsom .newlist .newam a {



        width: 100%;



        display: block; }



      .newsom .newlist .newam .imgs {



        width: 100%;



        position: relative;



        overflow: hidden; }



        .newsom .newlist .newam .imgs .img {



          width: 100%;



          padding-top: 56.36%;



          transition: all ease 0.5s; }



      .newsom .newlist .newam .com {



        width: 100%;



        padding: 0.3rem 0.2rem; }



        .newsom .newlist .newam .com .time {



          width: 100%;



          color: #222;



          line-height: 1.5; }



          .newsom .newlist .newam .com .time span {



            display: inline-block;



            vertical-align: middle;



            width: 0.21rem;



            position: relative;



            top: -0.02rem;



            margin-right: 0.1rem; }



            .newsom .newlist .newam .com .time span img {



              width: 100%;



              display: block; }



        .newsom .newlist .newam .com .xim {



          width: 100%;



          color: #222;



          line-height: 1.5;



          margin: 0.1rem 0 0.2rem;



          height: 3em; }



        .newsom .newlist .newam .com .ic {



          display: block;



          width: 0.21rem; }



          .newsom .newlist .newam .com .ic img {



            width: 100%;



            display: block; }



    .newsom .newlist .newam:nth-child(3n) {



      margin-right: 0; }



    .newsom .newlist .newam:hover .imgs .img {



      transform: scale(1.1); }



    .newsom .newlist .newam:hover .com .xim {



      color: var(--ghemes); }



  .newsom .cewpers {



    width: 100%;



    margin-bottom: 0.5rem; }



    .newsom .cewpers .swiper-slide {



      width: 100%;



      position: relative;



      border-radius: 0.16rem;



      overflow: hidden; }



      .newsom .cewpers .swiper-slide a {



        width: 100%;



        display: block; }



      .newsom .cewpers .swiper-slide .imgs {



        width: 100%;



        position: relative;



        overflow: hidden; }



        .newsom .cewpers .swiper-slide .imgs .img {



          width: 100%;



          padding-top: 42.85%;



          transition: all ease 0.5s; }



      .newsom .cewpers .swiper-slide .vom {



        position: absolute;



        bottom: 0;



        width: 100%;



        padding: 0.6rem;



        z-index: 4;



        display: flex;



        justify-content: space-between;



        align-items: flex-end; }



        .newsom .cewpers .swiper-slide .vom .vol {



          display: inline-block;



          vertical-align: middle;



          flex: 1;



          max-width: 8rem;



          padding-right: 0.8rem; }



          .newsom .cewpers .swiper-slide .vom .vol .vt {



            width: 100%;



            color: #fff;



            font-weight: bold;



            line-height: 1.2; }



          .newsom .cewpers .swiper-slide .vom .vol .vp {



            width: 100%;



            color: #fff;



            line-height: 1.6;



            margin-top: 0.24rem; }



            .newsom .cewpers .swiper-slide .vom .vol .vp p {



              color: #fff;



              line-height: 1.6; }



        .newsom .cewpers .swiper-slide .vom .vor {



          display: inline-block;



          vertical-align: middle; }



          .newsom .cewpers .swiper-slide .vom .vor .btn {



            display: inline-block;



            vertical-align: middle;



            width: 0.5rem;



            height: 0.5rem;



            border-radius: 50%;



            background-color: #fff; }



            .newsom .cewpers .swiper-slide .vom .vor .btn img {



              width: 100%;



              display: block; }



            .newsom .cewpers .swiper-slide .vom .vor .btn img:first-child {



              display: block; }



            .newsom .cewpers .swiper-slide .vom .vor .btn img:last-child {



              display: none; }



          .newsom .cewpers .swiper-slide .vom .vor .btn + .btn {



            margin-left: 0.2rem; }



          .newsom .cewpers .swiper-slide .vom .vor .btn:hover {



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



            .newsom .cewpers .swiper-slide .vom .vor .btn:hover img:first-child {



              display: none; }



            .newsom .cewpers .swiper-slide .vom .vor .btn:hover img:last-child {



              display: block; }



    .newsom .cewpers .swiper-slide:hover .imgs .img {



      transform: scale(1.08); }







.netails {



  width: 100%;



  padding: 0.6rem 0 0; }



  .netails .vob {



    width: 100%;



    border-top: solid 1px #e8e8e8; }



  .netails .vims {



    width: 100%;



    font-size: 0;



    display: flex;



    flex-wrap: wrap; }



    .netails .vims .vitm {



      width: 50%;



      border-right: solid 1px #e8e8e8; }



      .netails .vims .vitm a {



        width: 100%;



        display: flex;



        align-items: center;



        padding: 0.45rem 0; }



      .netails .vims .vitm .ac {



        display: inline-block;



        vertical-align: middle;



        width: 9px; }



        .netails .vims .vitm .ac img {



          width: 100%;



          display: block; }



        .netails .vims .vitm .ac img:first-child {



          display: block; }



        .netails .vims .vitm .ac img:last-child {



          display: none; }



      .netails .vims .vitm .am {



        display: inline-block;



        vertical-align: middle;



        flex: 1;



        color: #111;



        line-height: 1.5;



        margin: 0 0.1rem; }



      .netails .vims .vitm .cc {



        display: inline-block;



        vertical-align: middle;



        width: auto;



        color: #111;



        line-height: 1.5; }



    .netails .vims .vitm:hover .ac img:first-child {



      display: none; }



    .netails .vims .vitm:hover .ac img:last-child {



      display: block; }



    .netails .vims .vitm:hover .am {



      color: var(--ghemes); }



    .netails .vims .vitm:hover .cc {



      color: var(--ghemes); }



    .netails .vims .vitm:first-child {



      text-align: right; }



    .netails .vims .vitm:nth-child(2n) {



      border: none; }



  .netails .nevom {



    width: 100%;



    padding-bottom: 0.8rem; }



    .netails .nevom .nit {



      width: 100%;



      font-weight: bold;



      color: #131313;



      line-height: 1.2;



      margin-bottom: 0.2rem; }



    .netails .nevom .nim {



      width: 100%;



      display: flex;



      flex-wrap: wrap;



      justify-content: space-between;



      align-items: center;



      padding: 0.18rem 0; }



      .netails .nevom .nim .nml {



        display: inline-block;



        vertical-align: middle;



        width: auto; }



        .netails .nevom .nim .nml .vim {



          display: inline-block;



          vertical-align: middle;



          width: auto;



          color: #666;



          line-height: 1.5;



          margin-right: 0.24rem; }



          .netails .nevom .nim .nml .vim span {



            display: inline-block;



            vertical-align: middle;



            width: 20px;



            margin-right: 0.1rem;



            position: relative;



            top: -0.02rem; }



            .netails .nevom .nim .nml .vim span img {



              width: 100%;



              display: block; }



      .netails .nevom .nim .nmr {



        display: inline-block;



        vertical-align: middle;



        width: auto; }



        .netails .nevom .nim .nmr .share {



          display: inline-block;



          vertical-align: middle;



          width: auto; }



          .netails .nevom .nim .nmr .share .am {



            display: inline-block;



            vertical-align: middle;



            width: 20px; }



            .netails .nevom .nim .nmr .share .am a, .netails .nevom .nim .nmr .share .am img {



              width: 100%;



              display: block; }



          .netails .nevom .nim .nmr .share .am + .am {



            margin-left: 0.14rem; }



    .netails .nevom .ninp {



      width: 100%;



      color: #717273;



      line-height: 1.8;



      padding-top: 0.7rem;



      border-top: solid 1px #e8e8e8;



      margin-top: 0.1rem; }



      .netails .nevom .ninp p {



        color: #717273;



        line-height: 1.8; }

        .netails .nevom .ninp img{
          width: 100%;
        }
        .netails .nevom .ninp iframe{
          width: 100% !important;
          height: 5rem !important;
        }
        .netails .nevom .ninp video{
          width: 100% !important;
          height: 5rem !important;
        }



  .netails .videoc {



    width: 100%;



    display: block;



    position: relative;



    overflow: hidden;



    border-radius: 0.15rem;



    background-color: #000;



    margin-bottom: 0.6rem; }



    .netails .videoc .hei {



      width: 100%;



      padding-top: 56.25%; }



    .netails .videoc .vom {



      position: absolute;



      left: 0;



      top: 0;



      width: 100%;



      height: 100%;



      z-index: 3; }







@media (max-width: 800px) {



  .netails .vims .vitm .ac {



    order: 1;



    margin: 0 0.2rem 0 0 !important; }



  .netails .vims .vitm .cc {



    order: 2;



    margin: 0 0.1rem; }



  .netails .vims .vitm .am {



    order: 3; } }



.videoms {



  width: 100%;



  padding: 1rem 0; }



  .videoms .videolis {



    width: 100%;



    font-size: 0;



    display: flex;



    flex-wrap: wrap; }



    .videoms .videolis .vitem {



      display: inline-block;



      vertical-align: top;



      width: calc(680 / 1400 * 100%);



      margin-right: calc(39 / 1400 * 100%);



      margin-bottom: 0.4rem;



      position: relative;



      overflow: hidden;



      border-radius: 0.15rem; }



      .videoms .videolis .vitem a {



        width: 100%;



        display: block;



        padding: 0.25rem;



        background-color: #f5f5f5;



        transition: all ease 0.5s; }



      .videoms .videolis .vitem .imgs {



        display: inline-block;



        vertical-align: middle;



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



        position: relative;



        overflow: hidden;



        border-radius: 0.15rem; }



        .videoms .videolis .vitem .imgs .img {



          width: 100%;



          padding-top: 75%;



          transition: all ease 0.5s; }



      .videoms .videolis .vitem .pom {



        display: inline-block;



        vertical-align: middle;



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



        padding-left: 0.3rem; }



        .videoms .videolis .vitem .pom .time {



          width: 100%;



          color: #222;



          line-height: 1.5; }



          .videoms .videolis .vitem .pom .time span {



            display: inline-block;



            vertical-align: middle;



            width: 0.21rem;



            position: relative;



            top: -0.02rem;



            margin-right: 0.1rem; }



            .videoms .videolis .vitem .pom .time span img {



              width: 100%;



              display: block; }



        .videoms .videolis .vitem .pom .xip {



          width: 100%;



          color: #222;



          line-height: 1.5;



          margin: 0.2rem 0 0.3rem; }



        .videoms .videolis .vitem .pom .ptn {



          width: 0.55rem;



          height: 0.55rem;



          display: block; }



          .videoms .videolis .vitem .pom .ptn img {



            width: 100%;



            display: block; }



    .videoms .videolis .vitem:nth-child(2n) {



      margin-right: 0; }



    .videoms .videolis .vitem:hover a {



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



    .videoms .videolis .vitem:hover .imgs .img {



      transform: scale(1.1); }



    .videoms .videolis .vitem:hover .pom .time {



      color: #fff; }



      .videoms .videolis .vitem:hover .pom .time span img {



        filter: grayscale(1000%) brightness(2000%); }



    .videoms .videolis .vitem:hover .pom .xip {



      color: #fff; }







.tranms {



  width: 100%;



  padding: 0.7rem 0; }



  .tranms .tranlis {



    width: 100%; }



    .tranms .tranlis .titem {



      width: 100%; }



      .tranms .tranlis .titem a {



        width: 100%;



        display: flex;



        flex-wrap: wrap;



        align-items: center;



        justify-content: space-between;



        flex-direction: row-reverse;



        padding: 0.3rem 0;



        border-bottom: solid 1px #eee; }



      .tranms .tranlis .titem .imgs {



        display: inline-block;



        vertical-align: middle;



        width: calc(436 / 1400 * 100%);



        position: relative;



        overflow: hidden;



        border-radius: 0.16rem; }



        .tranms .tranlis .titem .imgs .img {



          width: 100%;



          padding-top: 53.90%;



          transition: all ease 0.5s; }



      .tranms .tranlis .titem .pom {



        display: inline-block;



        vertical-align: middle;



        width: calc(850 / 1400 * 100%); }



        .tranms .tranlis .titem .pom .xip {



          width: 100%;



          color: #222;



          line-height: 1.5; }



        .tranms .tranlis .titem .pom .xim {



          width: 100%;



          color: #999;



          line-height: 1.5;



          margin: 0.25rem 0; }



          .tranms .tranlis .titem .pom .xim p {



            color: #999;



            line-height: 1.5; }



        .tranms .tranlis .titem .pom .more {



          width: 100%;



          font-size: 0; }



        .tranms .tranlis .titem .pom .dtn {



          display: inline-block;



          vertical-align: middle;



          width: auto;



          border: solid 1px transparent;



          padding: 0.08rem;



          border-radius: calc(1.5em + 0.08rem);



          transition: all ease 0.5s; }



          .tranms .tranlis .titem .pom .dtn .cvn {



            display: inline-block;



            line-height: 3;



            border-radius: 1.5em;



            background-color: transparent;



            color: #333;



            padding: 0;



            transition: all ease 0.5s; }



            .tranms .tranlis .titem .pom .dtn .cvn span {



              display: inline-block;



              vertical-align: middle;



              margin-left: 0.05rem;



              width: 11px;



              transition: all ease 0.5s; }



              .tranms .tranlis .titem .pom .dtn .cvn span img {



                width: 100%;



                display: block;



                filter: grayscale(100%); }



              .tranms .tranlis .titem .pom .dtn .cvn span img:first-child {



                display: block; }



              .tranms .tranlis .titem .pom .dtn .cvn span img:last-child {



                display: none; }



    .tranms .tranlis .titem:hover .imgs .img {



      transform: scale(1.1); }



    .tranms .tranlis .titem:hover .pom .xip {



      color: var(--ghemes); }



    .tranms .tranlis .titem:hover .pom .dtn {



      border: solid 1px rgba(197, 39, 44, 0.2);



      transform: scale(1.06); }



      .tranms .tranlis .titem:hover .pom .dtn .cvn {



        display: inline-block;



        line-height: 3;



        border-radius: 1.5em;



        background-color: var(--ghemes);



        color: #fff;



        padding: 0 0.3rem; }



        .tranms .tranlis .titem:hover .pom .dtn .cvn span {



          display: inline-block;



          vertical-align: middle;



          margin-left: 0.25rem;



          width: 11px;



          transition: all ease 0.5s; }



          .tranms .tranlis .titem:hover .pom .dtn .cvn span img {



            width: 100%;



            display: block; }



      .tranms .tranlis .titem:hover .pom .dtn .cvn {



        padding: 0 0.3rem; }



        .tranms .tranlis .titem:hover .pom .dtn .cvn span {



          margin-left: 0.25rem;



          transform: rotate(45deg); }



          .tranms .tranlis .titem:hover .pom .dtn .cvn span img:first-child {



            display: none; }



          .tranms .tranlis .titem:hover .pom .dtn .cvn span img:last-child {



            display: block; }







.downs {



  width: 100%;



  padding: 0.8rem 0; }



  .downs .downlis {



    width: 100%;



    font-size: 0;



    display: flex;



    flex-wrap: wrap; }



    .downs .downlis .ditem {



      display: inline-block;



      vertical-align: top;



      width: calc(680 / 1400 * 100%);



      margin-right: calc(39 / 1400 * 100%);



      position: relative;



      border-radius: 0.16rem;



      margin-bottom: 0.4rem;



      background-color: #f5f5f5; }



      .downs .downlis .ditem a {



        width: 100%;



        display: block;



        padding: 0.4rem; }



      .downs .downlis .ditem .vit {



        display: inline-block;



        vertical-align: middle;



        width: calc(100% - 0.64rem);



        color: #222;



        line-height: 1.5; }



      .downs .downlis .ditem .rc {



        display: inline-block;



        vertical-align: middle;



        width: 0.4rem;



        height: 0.4rem;



        margin-left: 0.24rem;



        border-radius: 50%;



        background-color: #fff; }



        .downs .downlis .ditem .rc img {



          width: 100%;



          display: block; }



        .downs .downlis .ditem .rc img:first-child {



          display: block; }



        .downs .downlis .ditem .rc img:last-child {



          display: none; }



    .downs .downlis .ditem:nth-child(2n) {



      margin-right: 0; }



    .downs .downlis .ditem:hover {



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



      .downs .downlis .ditem:hover .vit {



        color: #fff; }



      .downs .downlis .ditem:hover .rc img:first-child {



        display: none; }



      .downs .downlis .ditem:hover .rc img:last-child {



        display: block; }







.setails {



  width: 100%;



  padding: 0.8rem 0;



  background-color: #f5f5f5; }



  .setails .setail {



    width: 100%; }



    .setails .setail .sit {



      width: 100%;



      text-align: center;



      color: #222;



      font-weight: bold;



      margin-bottom: 0.15rem;



      line-height: 1.5; }



    .setails .setail .intro {



      width: 100%;



      padding: 0.5rem 0 0.2rem;



      border-top: solid 1px #e5e5e5;



      color: #444;



      line-height: 1.75; }



      .setails .setail .intro p {



        color: #444;



        line-height: 1.75; }



    .setails .setail .setper {



      width: 100%;



      position: relative;



      margin: 0.3rem 0 0.5rem; }



      .setails .setail .setper .swiper-slide {



        width: 100%;



        position: relative;



        overflow: hidden;



        border-radius: 0.15rem; }



        .setails .setail .setper .swiper-slide .imgs {



          width: 100%;



          position: relative;



          overflow: hidden; }



          .setails .setail .setper .swiper-slide .imgs .img {



            width: 100%;



            padding-top: 35.71%;



            transition: all ease 0.5s; }



      .setails .setail .setper .swiper-pagination {



        bottom: 0;



        width: auto;



        right: 0.2rem;



        left: auto;



        bottom: 0.4rem; }



      .setails .setail .setper .swiper-pagination-bullet {



        display: inline-block;



        vertical-align: middle;



        width: 12px;



        height: 12px;



        margin-right: 0.1rem;



        position: relative;



        cursor: pointer;



        border-radius: 50%;



        transform: scale(0.8);



        transition: all ease 0.5s;



        background-color: #ccc;



        opacity: 1; }



      .setails .setail .setper .swiper-pagination-bullet-active {



        background-color: var(--themes);



        transform: scale(1); }



    .setails .setail .sinp {



      width: 100%;



      color: #444;



      line-height: 1.75; }



      .setails .setail .sinp p {



        color: #444;



        line-height: 1.75; }







.authens {



  width: 100%;



  padding: 0.2rem 0 0.8rem;



  background-color: #f5f5f5; }



  .authens .authlis {



    width: 100%;



    font-size: 0;



    display: flex;



    flex-wrap: wrap; }



    .authens .authlis .authm {



      display: inline-block;



      vertical-align: top;



      width: calc(440 / 1400 * 100%);



      margin-right: calc(39 / 1400 * 100%);



      margin-bottom: 0.4rem;



      overflow: hidden;



      border-radius: 0.16rem;



      background-color: #fff;



      cursor: pointer; }



      .authens .authlis .authm .sd {



        width: 100%;



        padding: 0.2rem;



        overflow: hidden; }



      .authens .authlis .authm .imgs {



        width: 100%;



        position: relative;



        overflow: hidden;



        border-radius: 0.16rem;



        background-color: #fff; }



        .authens .authlis .authm .imgs .img {



          width: 100%;



          padding-top: 63.75%;



          transition: all ease 0.5s;



          overflow: hidden;



          border-radius: 0.16rem; }



      .authens .authlis .authm .pem {



        width: 100%;



        padding: 0.2rem 0.4rem 0.4rem; }



      .authens .authlis .authm .pt {



        width: 100%;



        color: #222;



        font-weight: bold;



        line-height: 1.5; }



      .authens .authlis .authm .sim {



        width: 100%;



        color: #444;



        line-height: 1.5;



        height: 4.5em;



        margin: 0.2rem 0 0.25rem; }



        .authens .authlis .authm .sim p {



          color: #444;



          line-height: 1.5; }



      .authens .authlis .authm .ptn {



        width: 0.4rem;



        height: 0.4rem;



        display: block;



        border: solid 1px #e5e5e5;



        border-radius: 50%; }



        .authens .authlis .authm .ptn img {



          width: 100%;



          display: block; }



    .authens .authlis .authm:nth-child(3n) {



      margin-right: 0; }



    .authens .authlis .authm:hover {



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



      .authens .authlis .authm:hover .imgs .img {



        transform: scale(1.1); }



      .authens .authlis .authm:hover .pt, .authens .authlis .authm:hover .sim {



        color: #fff; }



      .authens .authlis .authm:hover .ptn {



        border: solid 1px rgba(255, 255, 255, 0.5); }



        .authens .authlis .authm:hover .ptn img {



          filter: grayscale(1000%) brightness(2000%); }







.briefs {



  width: 100%;



  padding: 0.8rem 0; }



  .briefs .bit {



    width: 100%;



    color: #222;



    font-weight: bold;



    line-height: 1.5;



    margin-bottom: 0.2rem; }



  .briefs .birem {



    width: 100%;



    display: flex;



    flex-wrap: wrap;



    justify-content: space-between;



    flex-direction: row-reverse; }



    .briefs .birem .bel {



      display: inline-block;



      vertical-align: top;



      width: calc(210 / 1400 * 100%); }



      .briefs .birem .bel .datas {



        width: 100%;



        font-size: 0;



        display: flex;



        flex-wrap: wrap;



        align-content: space-between;



        height: 100%; }



        .briefs .birem .bel .datas .daom {



          display: inline-block;



          vertical-align: top;



          width: 100%; }



          .briefs .birem .bel .datas .daom .xum {



            width: 100%;



            color: var(--themes); }



            .briefs .birem .bel .datas .daom .xum span {



              display: inline-block;



              color: var(--themes);



              font-weight: bold; }



          .briefs .birem .bel .datas .daom .lim {



            width: 100%;



            margin-top: 0.1rem;



            color: #444;



            line-height: 1.2; }



        .briefs .birem .bel .datas .daom + .daom {



          margin-top: 0.4rem; }



    .briefs .birem .ber {



      display: inline-block;



      vertical-align: top;



      width: calc(1120 / 1400 * 100%); }



      .briefs .birem .ber .binps {



        width: 100%;



        color: #444;



        line-height: 1.75; }



        .briefs .birem .ber .binps p {



          color: #444;



          line-height: 1.75; }







.cultrue {



  width: 100%;



  padding: 1rem 0; }



  .cultrue .cultoms {



    width: 100%;



    font-size: 0;



    display: flex;



    flex-wrap: wrap;



    background-color: rgba(0, 0, 0, 0.1);



    border-radius: 0.16rem;



    overflow: hidden; }



    .cultrue .cultoms .citem {



      display: inline-block;



      vertical-align: top;



      width: 25%;



      padding: 0.4rem;



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



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



      .cultrue .cultoms .citem .xit {



        width: 100%;



        color: #fff;



        line-height: 1.5;



        margin-bottom: 0.2rem; }



      .cultrue .cultoms .citem .ximp {



        width: 100%;



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



        line-height: 1.6;



        min-height: 6.4em; }



        .cultrue .cultoms .citem .ximp p {



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



          line-height: 1.6; }



    .cultrue .cultoms .citem:nth-child(1), .cultrue .cultoms .citem:nth-child(2), .cultrue .cultoms .citem:nth-child(3), .cultrue .cultoms .citem:nth-child(4) {



      border-top: none; }



    .cultrue .cultoms .citem:nth-child(4n) {



      border-right: none; }







@media (max-width: 800px) {



  .cultrue .cultoms .citem:nth-child(1), .cultrue .cultoms .citem:nth-child(2) {



    border-top: none; }



  .cultrue .cultoms .citem:nth-child(3), .cultrue .cultoms .citem:nth-child(4) {



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



  .cultrue .cultoms .citem:nth-child(2n) {



    border-right: none; } }



.honnrs {



  width: 100%;



  padding: 0.8rem 0;



  background-color: #f5f5f5; }



  .honnrs .honpm {



    width: 100%;



    display: flex;



    flex-wrap: wrap;



    justify-content: space-between;



    align-items: center; }



    .honnrs .honpm .hol {



      display: inline-block;



      vertical-align: middle;



      width: calc(580 / 1400 * 100%); }



      .honnrs .honpm .hol .imgs {



        width: 100%;



        position: relative;



        overflow: hidden;



        border-radius: 0.16rem;



        background-color: #fff; }



        .honnrs .honpm .hol .imgs .img {



          width: 100%;



          padding-top: 67.08%;



          transition: all ease 0.5s; }



    .honnrs .honpm .hor {



      display: inline-block;



      vertical-align: middle;



      width: calc(720 / 1400 * 100%);



      display: flex;



      flex-wrap: wrap; }



      .honnrs .honpm .hor .hitm {



        display: inline-block;



        vertical-align: middle;



        flex: 1;



        color: #444;



        line-height: 1.75; }



        .honnrs .honpm .hor .hitm p {



          color: #444;



          line-height: 1.75;



          padding: 0.04rem 0; }



      .honnrs .honpm .hor .lx {



        width: 1px;



        background-color: #e5e5e5;



        margin: 0 0.4rem;



        display: block; }







.qualifications {



  width: 100%;



  padding: 0.8rem 0; }



  .qualifications .quapers {



    width: 100%;



    position: relative;



    overflow: hidden; }



    .qualifications .quapers .bg {



      width: calc(1534 / 1400 * 100%);



      left: 50%;



      transform: translateX(-50%);



      position: absolute;



      z-index: 1;



      bottom: 8%; }



      .qualifications .quapers .bg .xg {



        width: 100%;



        padding-top: 7.235%; }



    .qualifications .quapers .swiper-container {



      position: relative;



      z-index: 3;



      padding-bottom: 0.4rem; }



    .qualifications .quapers .swiper-pagination {



      bottom: 0; }



    .qualifications .quapers .swiper-pagination-bullet {



      display: inline-block;



      vertical-align: middle;



      width: 12px;



      height: 12px;



      margin-right: 0.1rem;



      position: relative;



      cursor: pointer;



      border-radius: 50%;



      transform: scale(0.8);



      transition: all ease 0.5s;



      background-color: rgba(0, 0, 0, 0.4); }



    .qualifications .quapers .swiper-pagination-bullet-active {



      background-color: var(--themes);



      transform: scale(1); }



    .qualifications .quapers .swiper-slide {



      width: 100%; }



      .qualifications .quapers .swiper-slide a {



        width: 100%;



        display: block; }



      .qualifications .quapers .swiper-slide .imgs {



        width: 100%;



        position: relative;



        overflow: hidden;



        box-shadow: 7px 7px 8px 0px rgba(255, 255, 255, 0.16);



        max-width: 4.2rem;



        display: block;



        margin: 0 auto; }



        .qualifications .quapers .swiper-slide .imgs .img {



          width: 100%;



          padding-top: 73.50%;



          transition: all ease 0.5s; }



      .qualifications .quapers .swiper-slide .xit {



        width: 100%;



        text-align: center;



        color: #444;



        line-height: 1.5;



        margin-top: 0.4rem; }



    .qualifications .quapers .swiper-slide:hover .imgs .img {



      transform: scale(1.1); }







@media (max-width: 800px) {



  .qualifications .quapers .bg {



    bottom: 18%; } }



.procent {



  width: 100%;



  padding: 0.2rem 0 0.8rem;



  background-color: #fff; }



  .procent .proeom {



    width: 100%;



    font-size: 0;



    display: flex;



    flex-wrap: wrap;



    justify-content: space-between;



    align-items: flex-start; }



    .procent .proeom .prl {



      display: inline-block;



      vertical-align: top;



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



    .procent .proeom .prr {



      display: inline-block;



      vertical-align: top;



      width: calc(1040 / 1400 * 100%); }



    .procent .proeom .prolist {



      width: 100%;



      font-size: 0;



      display: flex;



      flex-wrap: wrap; }



      .procent .proeom .prolist .prom {



        display: inline-block;



        vertical-align: top;



        width: calc(320 / 1040 * 100%);



        margin-right: calc(39 / 1040 * 100%);



        margin-bottom: 0.4rem;



        position: relative;



        background-color: #f5f5f5;



        border-radius: 0.16rem;



        overflow: hidden; }



        .procent .proeom .prolist .prom a {



          width: 100%;



          display: block; }



        .procent .proeom .prolist .prom .imgs {



          width: 100%;



          position: relative;



          overflow: hidden; }



          .procent .proeom .prolist .prom .imgs .img {



            width: 100%;



            padding-top: 100%;



            transition: all ease 0.5s; }



        .procent .proeom .prolist .prom .coms {



          width: 100%;



          padding: 0.25rem 0.2rem; }



          .procent .proeom .prolist .prom .coms .xit {



            width: 100%;



            text-align: center;



            color: #222;



            line-height: 1.5; }



      .procent .proeom .prolist .prom:nth-child(3n) {



        margin-right: 0; }



      .procent .proeom .prolist .prom:hover .imgs .img {



        transform: scale(1.1); }



      .procent .proeom .prolist .prom:hover .coms {



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



        .procent .proeom .prolist .prom:hover .coms .xit {



          width: 100%;



          color: #fff; }



    .procent .proeom .prlist {



      width: 100%;



      border-radius: 16px;



      overflow: hidden;



      border: solid 1px #e9e9e9; }



      .procent .proeom .prlist .pli {



        width: 100%;



        font-size: 0; }



        .procent .proeom .prlist .pli .ns {



          width: 100%;



          background-color: #fff;



          font-size: 0;



          padding: 0.3rem 0.3rem; }



          .procent .proeom .prlist .pli .ns .am {



            display: inline-block;



            vertical-align: middle;



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



            .procent .proeom .prlist .pli .ns .am a {



              color: #222;



              line-height: 1.3;



              width: 100%;



              font-weight: bold;



              display: block; }



          .procent .proeom .prlist .pli .ns .am:hover a {



            color: var(--ghemes); }



          .procent .proeom .prlist .pli .ns .rc {



            display: inline-block;



            vertical-align: middle;



            width: 14px;



            margin-left: 0.1rem;



            display: none;



            cursor: pointer; }



            .procent .proeom .prlist .pli .ns .rc span {



              display: inline-block;



              vertical-align: middle;



              width: 100%; }



            .procent .proeom .prlist .pli .ns .rc span:first-child {



              display: inline-block; }



            .procent .proeom .prlist .pli .ns .rc span:last-child {



              display: none; }



        .procent .proeom .prlist .pli .puls {



          width: 100%;



          display: none;



          background-color: #f5f5f5;



          padding: 0.24rem 0.3rem; }



          .procent .proeom .prlist .pli .puls .plc {



            width: 100%;



            padding: 0.1rem 0; }



            .procent .proeom .prlist .pli .puls .plc .ts {



              width: 100%; }



              .procent .proeom .prlist .pli .puls .plc .ts a {



                display: inline-block;



                vertical-align: middle;



                width: 100%;



                color: #93a0b1;



                line-height: 1.5; }



              .procent .proeom .prlist .pli .puls .plc .ts a:hover {



                color: var(--ghemes); }



              .procent .proeom .prlist .pli .puls .plc .ts .em {



                display: inline-block;



                vertical-align: middle;



                width: 12px;



                margin-left: 0.1rem;



                display: none;



                cursor: pointer;



                transition: all ease 0.5s; }



                .procent .proeom .prlist .pli .puls .plc .ts .em img {



                  display: inline-block;



                  vertical-align: middle;



                  width: 100%; }



            .procent .proeom .prlist .pli .puls .plc .euls {



              width: 100%;



              display: none;



              padding: 0.05rem 0.05rem;



              border-left: solid 1px #ccc; }



              .procent .proeom .prlist .pli .puls .plc .euls .eli {



                width: 100%;



                padding: 0.05rem 0.14rem; }



                .procent .proeom .prlist .pli .puls .plc .euls .eli a {



                  width: 100%;



                  color: #93a0b1;



                  line-height: 1.4; }



                .procent .proeom .prlist .pli .puls .plc .euls .eli a:hover {



                  color: var(--ghemes); }



          .procent .proeom .prlist .pli .puls .plc + .plc {



            border-top: none; }



          .procent .proeom .prlist .pli .puls .plc.has-euls .ts a {



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



          .procent .proeom .prlist .pli .puls .plc.has-euls .ts .em {



            display: inline-block;



            vertical-align: middle; }



          .procent .proeom .prlist .pli .puls .plc.has-euls.show .ts a {



            color: var(--ghemes); }



          .procent .proeom .prlist .pli .puls .plc.has-euls.show .ts .em {



            display: inline-block;



            vertical-align: middle;



            transform: rotate(180deg); }



          .procent .proeom .prlist .pli .puls .plc.has-euls.show .euls {



            margin: 0.2rem 0; }



      .procent .proeom .prlist .pli.has-puls .ns .am {



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



      .procent .proeom .prlist .pli.has-puls .ns .rc {



        display: inline-block;



        vertical-align: middle; }



      .procent .proeom .prlist .pli.has-puls.show .ns {



        background-color: #333333; }



        .procent .proeom .prlist .pli.has-puls.show .ns .am a {



          color: #fff; }



        .procent .proeom .prlist .pli.has-puls.show .ns .rc span:first-child {



          display: none; }



        .procent .proeom .prlist .pli.has-puls.show .ns .rc span:last-child {



          display: inline-block; }



      .procent .proeom .prlist .pli.has-puls.onds .ns {



        background-color: #333333; }



        .procent .proeom .prlist .pli.has-puls.onds .ns .am a {



          color: #fff; }



      .procent .proeom .prlist .pli + .pli {



        border-top: solid 1px rgba(0, 0, 0, 0.05); }







.petails {



  width: 100%;



  padding: 0.2rem 0 0.8rem;



  background-color: #f5f5f5; }



  .petails .petom {



    width: 100%;



    display: flex;



    flex-wrap: wrap;



    justify-content: space-between;



    font-size: 0;



    align-items: center; }



    .petails .petom .pel {



      display: inline-block;



      vertical-align: middle;



      display: flex;



      flex-wrap: wrap;



      justify-content: space-between;



      width: calc(630 / 1400 * 100%); }



      .petails .petom .pel .ptper {



        display: inline-block;



        vertical-align: middle;



        width: calc(500 / 630 * 100%);



        position: relative; }



        .petails .petom .pel .ptper .swiper-slide {



          width: 100%;



          display: block;



          background-color: #fff;



          border-radius: 10px;



          border: solid 1px #e2f0f6;



          overflow: hidden; }



          .petails .petom .pel .ptper .swiper-slide .imgs {



            width: 100%;



            position: relative;



            overflow: hidden; }



            .petails .petom .pel .ptper .swiper-slide .imgs .img {



              width: 100%;



              padding-top: 5rem; }



        .petails .petom .pel .ptper .btn {



          position: absolute;



          bottom: 0.2rem;



          z-index: 3;



          width: 8px;



          cursor: pointer; }



          .petails .petom .pel .ptper .btn img {



            width: 100%;



            display: block; }



          .petails .petom .pel .ptper .btn img:first-child {



            display: block; }



          .petails .petom .pel .ptper .btn img:last-child {



            display: none; }



        .petails .petom .pel .ptper .btn:hover img:first-child {



          display: none; }



        .petails .petom .pel .ptper .btn:hover img:last-child {



          display: block; }



        .petails .petom .pel .ptper .br {



          right: 0.24rem; }



        .petails .petom .pel .ptper .bl {



          right: calc(0.24rem + 0.15rem + 9px); }



      .petails .petom .pel .pbper {



        display: inline-block;



        vertical-align: middle;



        width: calc(110 / 630 * 100%); }



        .petails .petom .pel .pbper .swiper-container {



          height: 5rem; }



        .petails .petom .pel .pbper .swiper-slide {



          width: 100%;



          display: block;



          background-color: #fff;



          border-radius: 10px;



          border: solid 2px #e2f0f6;



          overflow: hidden;



          height: auto;



          cursor: pointer; }



          .petails .petom .pel .pbper .swiper-slide .imgs {



            width: 100%;



            position: relative;



            overflow: hidden; }



            .petails .petom .pel .pbper .swiper-slide .imgs .img {



              width: 100%;



              padding-top: 100%; }



        .petails .petom .pel .pbper .swiper-slide.on, .petails .petom .pel .pbper .swiper-slide:hover {



          border: solid 2px var(--themes); }



    .petails .petom .per {



      display: inline-block;



      vertical-align: middle;



      width: calc(600 / 1400 * 100%); }



      .petails .petom .per .rit {



        width: 100%;



        color: #222;



        font-weight: bold;



        line-height: 1.2; }



      .petails .petom .per .rix {



        width: 100%;



        color: #222;



        line-height: 1.5;



        margin-top: 0.1rem; }



      .petails .petom .per .lx {



        width: 100%;



        height: 1px;



        background-color: #e5e5e5;



        margin: 0.3rem 0; }



      .petails .petom .per .sinp {



        width: 100%;



        color: #444;



        line-height: 1.75; }



        .petails .petom .per .sinp p {



          color: #444;



          line-height: 1.75; }



  .petails .maenavs {



    width: 100%;



    margin: 0.8rem 0 0.5rem; }



    .petails .maenavs .maenav {



      width: 100%; }



      .petails .maenavs .maenav .swiper-container {



        /*max-width: 15.2rem;*/



        margin: 0 auto;



        background-color: #fff;



        border-radius: 0.15rem;



        overflow: hidden; }



      .petails .maenavs .maenav .swiper-slide {



        display: inline-block;



        vertical-align: middle;



        width: auto; }



        .petails .maenavs .maenav .swiper-slide a {



          display: inline-block;



          vertical-align: middle;



          color: #222;



          line-height: 3.5;



          width: auto;



          padding: 0 0.35rem;



          transition: all ease 0.5s; }



      .petails .maenavs .maenav .swiper-slide.on a, .petails .maenavs .maenav .swiper-slide:hover a {



        background-color: var(--ghemes);



        color: #fff; }



    .petails .maenavs .maenav.fixed {



      position: fixed;



      z-index: 20;



      left: 0;



      right: 0;



      background-color: #fff; }



  .petails .mcont {



    width: 100%; }



    .petails .mcont .mitem {



      width: 100%; }



    .petails .mcont .mitem + .mitem {



      margin-top: 0.5rem; }



    .petails .mcont .mit {



      width: 100%;



      color: #222;



      font-weight: bold;



      margin-bottom: 0.34rem; }



      .petails .mcont .mit span {



        display: inline-block;



        vertical-align: middle;



        width: 4px;



        position: relative;



        top: -0.02rem;



        margin-right: 0.06rem; }



        .petails .mcont .mit span img {



          width: 100%;



          display: block; }



    .petails .mcont .minp {



      width: 100%;



      color: #444;



      line-height: 1.75; }



      .petails .mcont .minp p {



        color: #444;



        line-height: 1.75; }



      .petails .mcont .minp .table {



        width: 100%;



        overflow: auto;



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



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



        .petails .mcont .minp .table::-webkit-scrollbar {



          width: 4px;



          height: 4px;



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



        .petails .mcont .minp .table::-webkit-scrollbar-thumb {



          border-radius: 10px;



          -webkit-box-shadow: inset 0 0 10px rgba(197, 39, 44, 0.7);



          background: rgba(197, 39, 44, 0.7);



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



        .petails .mcont .minp .table::-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); }



        .petails .mcont .minp .table p {



          color: #444;



          line-height: 1.75; }



        .petails .mcont .minp .table table {



          width: 14rem; }



        .petails .mcont .minp .table table, .petails .mcont .minp .table tr, .petails .mcont .minp .table td {



          border: none; }



        .petails .mcont .minp .table tr {



          width: 100%;



          border-bottom: solid 1px #e5e5e5; }



        .petails .mcont .minp .table tr:first-child {



          border-top: solid 1px #e5e5e5; }



        .petails .mcont .minp .table td {



          color: #444;



          line-height: 1.75;



          padding: 0.2rem 0; }



          .petails .mcont .minp .table td p {



            color: #444;



            line-height: 1.75; }



        .petails .mcont .minp .table .td1 {



          display: inline-block;



          vertical-align: middle;



          width: calc(300 / 1400 * 100%); }



        .petails .mcont .minp .table .td2 {



          display: inline-block;



          vertical-align: middle;



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



          text-align: center; }



        .petails .mcont .minp .table .td3 {



          display: inline-block;



          vertical-align: middle;



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



          text-align: left; }



        .petails .mcont .minp .table .img {



          width: 100%; }



          .petails .mcont .minp .table .img img {



            width: auto;



            display: inline-block;



            vertical-align: middle;



            max-width: 100%; }



        .petails .mcont .minp .table .tinp {



          width: 100%;



          color: #444;



          line-height: 1.75; }



          .petails .mcont .minp .table .tinp p {



            color: #444;



            line-height: 1.75; }



    .petails .mcont .sitm {



      width: 100%;



      margin-top: 0.5rem; }



    .petails .mcont .perocer {



      width: 100%;



      font-size: 0; }



      .petails .mcont .perocer .prom {



        width: 100%;



        display: inline-block;



        vertical-align: top;



        position: relative;



        background-color: #fff;



        border-radius: 0.16rem;



        overflow: hidden; }



        .petails .mcont .perocer .prom a {



          width: 100%;



          display: block; }



        .petails .mcont .perocer .prom .imgs {



          width: 100%;



          position: relative;



          overflow: hidden; }



          .petails .mcont .perocer .prom .imgs .img {



            width: 100%;



            padding-top: 100%;



            transition: all ease 0.5s; }



        .petails .mcont .perocer .prom .coms {



          width: 100%;



          padding: 0.25rem 0.2rem; }



          .petails .mcont .perocer .prom .coms .xit {



            width: 100%;



            text-align: center;



            color: #222;



            line-height: 1.5; }



      .petails .mcont .perocer .prom:hover .imgs .img {



        transform: scale(1.1); }



      .petails .mcont .perocer .prom:hover .coms {



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



        .petails .mcont .perocer .prom:hover .coms .xit {



          width: 100%;



          color: #fff; }







@media (max-width: 800px) {



  .petails .petom .pel .ptper .swiper-slide .imgs .img {



    padding-top: 100%; } }



    .rightnav {
      position: fixed;
      z-index: 10;
      right: 0.2rem;
      top: 60%;
      transform: translateY(-50%);
      display: none; }
      .rightnav .ritm {
        display: block;
        background-color: var(--ghemes);
        width: 0.44rem;
        position: relative; }
        .rightnav .ritm .am {
          width: 100%;
          display: block; }
          .rightnav .ritm .am a, .rightnav .ritm .am img {
            width: 100%;
            display: block; }
        .rightnav .ritm .codm {
          position: absolute;
          right: calc(100% + 0.1rem);
          top: 50%;
          transform: translateY(-50%);
          background-color: var(--ghemes);
          padding: 0.08rem;
          border-radius: 0.1rem;
          width: 1.4rem;
          display: none; }
          .rightnav .ritm .codm img {
            width: 100%;
            display: block; }
        .rightnav .ritm .relom {
          position: absolute;
          right: calc(100% + 0.1rem);
          top: 50%;
          transform: translateY(-50%);
          background-color: var(--ghemes);
          padding: 0.1rem;
          border-radius: 0.15rem;
          width: auto;
          white-space: nowrap;
          display: none; }
          .rightnav .ritm .relom .tel {
            width: 100%;
            color: #fff;
            line-height: 1.6; }
      .rightnav .ritm:first-child {
        border-radius: 0.22rem 0.22rem 0 0; }
      .rightnav .ritm:last-child {
        border-radius: 0 0 0.22rem 0.22rem; }
      .rightnav .ritm:hover {
        background-color: var(--themes); }
        .rightnav .ritm:hover .codm {
          display: block; }
        .rightnav .ritm:hover .relom {
          display: block; }





      .searchd {

        width: 100%;

        padding: 0.6rem 0;

        background-color: #f1f1f1; }

        .searchd .sercom {

          width: 100%; }

          .searchd .sercom form {

            width: 100%;

            display: block;

            font-size: 0;

            margin: 0 auto;

            max-width: 8rem;

            overflow: hidden;

            border-radius: 0.3rem;

            display: flex;

            background-color: #fff; }

          .searchd .sercom .int {

            display: inline-block;

            vertical-align: middle;

            width: calc(100% - 65px); }

            .searchd .sercom .int input {

              width: 100%;

              display: block;

              padding: 0 0.3rem;

              line-height: 3.5;

              height: 3.5em;

              background-color: #fff;

              border: none; }

          .searchd .sercom .stn {

            width: 65px;

            display: inline-block;

            vertical-align: middle;

            position: relative;

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

            .searchd .sercom .stn img {

              position: absolute;

              left: 50%;

              top: 50%;

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

              width: 16px;

              height: 16px;

              filter: grayscale(1000%) brightness(2000%); }

            .searchd .sercom .stn .scc {

              position: absolute;

              left: 0;

              top: 0;

              width: 100%;

              height: 100%;

              cursor: pointer;

              opacity: 0; }

        .searchd .result {

          width: 100%;

          margin-top: 0.4rem; }

          .searchd .result .sit {

            width: 100%;

            text-align: center;

            color: #333;

            font-weight: bold;

            line-height: 1.4;

            margin-bottom: 0.2rem; }

            .searchd .result .sit span {

              color: var(--ghemes); }

          .searchd .result .resom {

            width: 100%;

            font-size: 0;

            text-align: center;

            margin-bottom: 0.4rem; }

            .searchd .result .resom .riem {

              display: inline-block;

              vertical-align: middle;

              width: auto;

              padding: 0 0.25rem;

              line-height: 2.5;

              border-radius: 1.25em;

              background-color: #fff;

              cursor: pointer;

              margin: 0 0.15rem; }

            .searchd .result .resom .riem:hover, .searchd .result .resom .riem.on {

              background-color: var(--ghemes);

              color: #fff; }

        .searchd .searpon {

          width: 100%;

          font-size: 0;

          display: block;

          max-width: 14rem;

          margin: 0 auto; }

          .searchd .searpon .sepom {

            width: 100%;

            display: none; }

          .searchd .searpon .sepom.on {

            display: block; }

          .searchd .searpon .searlist {

            width: 100%; }

            .searchd .searpon .searlist .seam {

              width: 100%;

              background-color: #fff;

              border-radius: 0.2rem;

              transition: all ease 0.5s; }

              .searchd .searpon .searlist .seam a {

                width: 100%;

                display: flex;

                align-items: center;

                padding: 0.3rem;

                justify-content: space-between; }

              .searchd .searpon .searlist .seam .lam {

                display: inline-block;

                vertical-align: middle;

                flex: 1;

                padding-right: 0.15rem; }

                .searchd .searpon .searlist .seam .lam .lit {

                  width: 100%;

                  color: #333;

                  font-weight: bold;

                  line-height: 1.5; }

                .searchd .searpon .searlist .seam .lam .linp {

                  width: 100%;

                  margin-top: 0.05rem;

                  color: #999;

                  line-height: 1.5; }

                  .searchd .searpon .searlist .seam .lam .linp p {

                    color: #999;

                    line-height: 1.5; }

              .searchd .searpon .searlist .seam .ram {

                display: inline-block;

                vertical-align: middle;

                width: auto; }

                .searchd .searpon .searlist .seam .ram .tip {

                  display: inline-block;

                  vertical-align: middle;

                  padding: 0 0.4rem;

                  line-height: 2.5;

                  border-radius: 1.25em;

                  background-color: var(--ghemes);

                  color: #fff; }

            .searchd .searpon .searlist .seam:hover {

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

              .searchd .searpon .searlist .seam:hover .lam .lit {

                color: var(--ghemes); }

            .searchd .searpon .searlist .seam + .seam {

              margin-top: 0.2rem; }