  * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
  }

  body,
  html {
      overflow-x: hidden;
      position: relative;
  }

  .main {
      width: 100%;
      padding-bottom: 60px
  }

  .main .w_inner {
      position: absolute;
      height: 100%;
      max-width: 1420px;
      min-width: 1240px;
      margin: auto;
      left: 50%;
      transform: translateX(-50%);
  }

  .yfCode {
      display: none;
  }

  .whole {
      width: 100%;
      position: relative;
  }

  .whole img {
      width: 100%;
  }

  .slidepic {
      position: relative;
      height: 100%;
  }

  .aBox {
      width: 1100px;
      height: 100%;
      margin: 0 auto;
      position: relative;
  }

  .whole a {
      position: absolute;
      display: block;
  }

  .whole a.center {
      left: 50%;
      transform: translateX(-50%);
  }

  .libaoBox {
      width: 1040px;
      height: 340px;
      margin: 0 auto 0;
  }

  .libaoBox dd {
      width: 33%;
      float: left;
      position: relative;
      height: 100%;
  }

  .whole .cp-item {
        width: 71%;
        height: 86%;
        background: rgba(0, 0, 0, .5);
        position: absolute;
        top: 39px;
        left: 24px;
      opacity: 0;
      filter: alpha(opacity=0);
      -webkit-transform: translateY(-50px);
      -o-transform: translateY(-50px);
      -moz-transform: translateY(-50px);
      transform: translateY(-50px);
      -o-transition: all .4s ease;
      -moz-transition: all .4s ease;
      -webkit-transition: all .4s ease;
      transition: all .4s ease;
      z-index: 18;
  }

  .whole .cp-item:hover {
      opacity: 1;
      filter: alpha(opacity=100);
      -webkit-transform: translateY(0px);
      -o-transform: translateY(0px);
      -moz-transform: translateY(0px);
      transform: translateY(0px);
  }

  .whole .cp-item div {
      width: 100%;
      position: absolute;
      left: 50%;
      top: 50%;
      -webkit-transform: translate(-50%, -50%);
      -moz-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      -o-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
  }

  .whole .cp-item p {
      width: 100%;
      color: #fff;
      font-size: 12px;
      text-align: center;
      line-height: 18px;
      font-family: '方正中等线简体';
  }

  .whole .cp-item .fontLight p {
      line-height: 18px!important;
  }

  .hd-nav-box-wrap {
      z-index: 99;
      text-align: center;
      height: 64px;
      width: 1075px;
      position: absolute;
      top: 91px;
      left: 50%;
      margin-left: -538px;
  }
  /*   .hd-nav-box-wrap .hd-nav-box.fixed {
    position: fixed;
    top: 18px;
    left: 50%;
    margin-left: -642px;
    z-index: 80;
} */

  .hd-nav-box-wrap .hd-nav-box {
      width: 1075px;
      height: 64px;
      margin: 0 auto;
  }

  .hd-nav-box-wrap .hd-nav-box li {
      width: 205px;
      height: 64px;
      float: left;
      color: #fff;
      line-height: 64px;
      text-align: center;
      position: relative;
      font-size: 24px;
      font-family: '方正中等线简体';
      cursor: pointer;
      margin-right: 10px;
  }

  .hd-nav-box-wrap .hd-nav-box li span {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      z-index: 5;
      color: #000;
  }

  .hd-nav-box-wrap .hd-nav-box li.current span {
      color: #fff;
  }

  .hd-nav-box-wrap .hd-nav-box li.current p {
      background-color: #fd9a00;
      height: 64px;
      width: 100%;
      position: relative;
      z-index: 2;
  }

  .hd-nav-box-wrap.fixed {
      top: 0px;
      position: fixed!important;
  }


  .hdnav {
      width: 100%;
      height: 130px;
      background: #fff;
  }

  .hdnav ul {
      width: 1040px;
      margin: 38px auto 0;
  }

  .hdnav ul li {
      margin: 0 7px;
      width: 134px;
      float: left;
      height: 68px;
      line-height: 68px;
      text-align: center;
      color: #000;
      font-size: 21px;
      background: #eff2f7;
      cursor: pointer;
  }

  .hdnav ul li.active {
      color: #fff;
      background: #d70010;
  }

  .lighthover {
      overflow: hidden;
      position: relative;
      display: inline-block;
      -o-transition: all .3s ease;
      -moz-transition: all .3s ease;
      -webkit-transition: all .3s ease;
      transition: all .3s ease
  }

  .lighthover:before {
      content: "";
      position: absolute;
      width: 220px;
      height: 100%;
      top: 0;
      left: -300px;
      overflow: hidden;
      z-index: 10;
      background-image: linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
      -moz-transform: skewX(-25deg);
      -webkit-transform: skewX(-25deg);
      -o-transform: skewX(-25deg);
      -o-transition: all .6s ease;
      -moz-transition: all .6s ease;
      -webkit-transition: all .6s ease;
      transition: all .6s ease;
  }

  .lighthover:hover::before {
      left: 115%;
  }

  .addCartBtn {
      width: 50%;
      height: 60px;
      position: absolute;
      z-index: 10;
  }

  .changeList {
      display: none;
  }

  .hdpop {
      display: none;
  }

  .hdpop .mask {
      background-color: #000;
      opacity: .5;
      filter: alpha(opacity=50);
      width: 100%;
      height: 100%;
      position: fixed;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      z-index: 52;
  }

  .hdpop .hdpop-mc {
      position: fixed;
      top: 50%;
      left: 50%;
      z-index: 1000;
  }

  .hdpop .hd-close {
      display: block;
      position: absolute;
      width: 100px;
      height: 100px;
      left: 50%;
      transform: translateX(-50%);
  }

  .jifen .hdpop-mc {
      width: 750px;
      height: 500px;
      transform: translate(-50%, -50%);
      background: url('../images/corfm-bg.png') no-repeat center top;
      background-size: contain;
  }

  .tc1 .hdpop-mc {
      width: 384px;
      height: 187px;
      transform: translate(-50%, -50%);
      background: url('http://cdn-opimage.qiumeiapp.com/gw/2021May-richang/wap/xinke-tan.png') no-repeat center top;
      background-size: contain;
  }

  .tc1 .hd-close {
      width: 67%;
      height: 10%;
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
  }

  .tc2 .hdpop-mc {
      width: 384px;
      height: 187px;
      transform: translate(-50%, -50%);
      background: url('http://cdn-opimage.qiumeiapp.com/gw/2021May-richang/wap/laoke-tan.png') no-repeat center top;
      background-size: contain;
  }

  .tc2 .hd-close {
      width: 67%;
      height: 10%;
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
  }

  .tc3 .hdpop-mc {
      width: 750px;
      height: 256px;
      transform: translate(-50%, -50%);
      background: #fff url('https://winona-operating-image.oss-cn-hangzhou.aliyuncs.com/gw/2021April-huiyuan/mob/mzgz.png') no-repeat center top;
      background-size: contain;
  }

  .tc3 .hd-close {
      width: 67%;
      height: 10%;
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
  }

  .tc4 .hdpop-mc {
      width: 812px;
      height: 272px;
      transform: translate(-50%, -50%);
      background: #fff url('https://winona-operating-image.oss-cn-hangzhou.aliyuncs.com/gw/2021April-huiyuan/mob/rule.png') no-repeat center top;
      background-size: contain;
  }

  .tc4 .hd-close {
      width: 67%;
      height: 10%;
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
  }

  .couponMask .hdpop-mc {
      width: 750px;
      height: 767px;
      transform: translate(-50%, -50%);
      background: url('../images/coupon.png') no-repeat center top;
  }

  .couponMask .hd-close {
      width: 500px;
      height: 80px;
      position: absolute;
      bottom: 12%;
      left: 50%;
      margin-left: -250px;
      z-index: 55;
  }
  /* 点击对应楼层的菜单，缓慢滑动定位到对应的楼层*/

  .hd-nav-box {
      position: absolute;
      width: 73%;
      height: 100%;
      left: 14%;
      bottom: 0;
  }

  .hd-nav-box li {
      position: absolute;
      width: 18%;
      height: 37%;
      cursor: pointer;
  }

  .hd-nav-box .current {
      width: 31%;
      height: 80%;
  }

  .shake {
      -o-transition: all .3s ease;
      -moz-transition: all .3s ease;
      -webkit-transition: all .3s ease;
      transition: all .3s ease;
      -webkit-animation: shake 1s ease-in-out;
      -moz-animation: shake 1s ease-in-out;
      -ms-animation: shake 1s ease-in-out;
      -o-animation: shake 1s ease-in-out;
      animation: shake 1s ease-in-out;
  }

  @-webkit-keyframes shake {
      from,
      to {
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
      }
      10%,
      30%,
      50%,
      70%,
      90% {
          -webkit-transform: translate3d(-10px, 0, 0);
          transform: translate3d(-10px, 0, 0);
      }
      20%,
      40%,
      60%,
      80% {
          -webkit-transform: translate3d(10px, 0, 0);
          transform: translate3d(10px, 0, 0);
      }
  }

  @keyframes shake {
      from,
      to {
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
      }
      10%,
      30%,
      50%,
      70%,
      90% {
          -webkit-transform: translate3d(-10px, 0, 0);
          transform: translate3d(-10px, 0, 0);
      }
      20%,
      40%,
      60%,
      80% {
          -webkit-transform: translate3d(10px, 0, 0);
          transform: translate3d(10px, 0, 0);
      }
  }
  /*公告列表*/

  .noticeContainer {

      background-color: #d6000f;
      color: #fff;
  }

  .noticeBox {
      width: 100%;
      max-width: 1200px;
      margin: auto;
      position: relative;
      width: 100%;
      height: 30px;
      line-height: 30px;
      overflow: hidden;
      font-size: 14px;
      text-align: center;
      box-sizing: border-box;
      -moz-box-sizing: border-box;
      /* Firefox */
      -webkit-box-sizing: border-box;
      /* Safari */
  }

  .notice-icon {
      position: absolute;
      top: 0;
      right: 0;
      width: 30px;
      height: 30px;
      background: url(../images/closeBtn.png) center center no-repeat;
      background-size: 15px;
      z-index: 1
  }

  .notice {
      position: relative;
      width: 100%;
      margin: auto;
      overflow: hidden;
      white-space: nowrap;
  }

  .notice span {
      padding: 0 4px;
  }

  #nav1 .swiper-pagination-bullet {
      width: 10%;
      height: 65px;
      border-radius: 0;
      opacity: 0;
  }

  #nav2 .swiper-pagination-bullet {
      width: 10%;
      height: 65px;
      border-radius: 0;
      opacity: 0;
  }

  #nav3 .swiper-pagination-bullet {
      width: 10%;
      height: 65px;
      border-radius: 0;
      opacity: 0;
  }

  .firstNav .swiper-pagination-bullet {
      width: 12%;
      height: 60px;
      border-radius: 0;
      opacity: 0;
  }

  .hd-nav-box.tabs {
      position: absolute;
      width: 100%;
      height: 100%;
      left: 0%;
      bottom: 0px;
      top: 3%;
  }

  .hd-nav-box.tabs ul {
      position: relative;
      width: 50%;
      height: 100%;
      margin: auto;
      overflow: hidden;
  }

  .hd-nav-box li.comms {
      top: 2%;
      position: absolute;
      height: 95%;
      cursor: pointer;
  }

  .hd-nav-box li.singleNav1 {
      left: 8%;
  }

  .hd-nav-box li.singleNav2 {
      left: 29%;
  }

  .hd-nav-box li.singleNav3 {
      left: 51%;
  }

  .hd-nav-box li.singleNav4 {
      left: 74%;
  }

  .hd-nav-box li.singleNav5 {
      left: 77%;
  }

  .swiperSlidepic {
      height: 68%;
      width: 41%;
      left: 28%;
      top: 28%;
      z-index: 99;
  }

  .swiperSlidepic1 {
      height: 78%;
      width: 41%;
      left: 28%;
      top: 19%;
      z-index: 99;
  }

  .swiperSlidepic2 {
      height: 10%;
      width: 41%;
      left: 28%;

      bottom: 0%;
      z-index: 99;
  }

  .swiperSlidepicRight {
      height: 50%;
      width: 6%;
      right: 24%;
      top: 42%;
      z-index: 99;
  }
  /*三个图片排版样式*/

  .topList {
      height: 68%;
      width: 21%;
      left: 28%;
      top: 28%;
      z-index: 99;
  }

  .topList1 {
      height: 34%;
      width: 21%;
      right: 28%;
      top: 19%;
      z-index: 99;
  }

  .topList2 {
      height: 34%;
      width: 21%;
      right: 28%;
      top: 58%;
      z-index: 99;
  }
  /* .firstNav .swiper-pagination{top:10%;bottom: 0;height: 6%;}
 .swiper-container.firstNav{width: 100%; position: absolute;top: 0;left: 0;} */
