* {
    margin: 0;
    padding: 0;
}

img {
    display: block;
}

.whole {
    position: relative;
}

.whole img {
    width: 100%;
}

.half {
    position: relative;
}

.whole .top {
    position: relative;
}

.whole .bottom {
    position: absolute;
    z-index: 10;
    width: 100%;
    height: 100%;

}

.half .top {
    width: 50%;
    float: left;
    position: relative;
    z-index: 10;
}

.half .bottom {
    position: absolute;
    z-index: 10;
    width: 100%;
    height: 100%;
}

.half img {
    width: 100%
}

.three {
    position: relative;
}

.three img {
    width: 100%;
}

.three .top {
    width: 33.3%;
    float: left;
    position: relative;
    z-index: 10;
}

.three .bottom {
    position: absolute;
    z-index: 10;
    width: 100%;
    height: 100%;
}

.clearFix {
    clear: both;
}

a {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}


.hdNavBox{
  width: 100%;
  margin: .4rem auto 0;
  height: 1.75rem;
}
.hdNavBox li{
  width: 2.25rem;
  height: 100%;
  margin-left: .18rem;
  float: left;
  position: relative;
  cursor: pointer;
}
.jfhcoupon{
    width: 6rem;
    padding-top: 2.25rem;
    margin: 0rem auto 0;
    height: auto;
    overflow: hidden;
  }
  .jfhcoupon dl{
    width: 2.3rem;
    height: 2.9rem;
    float: left;
    margin-left: .5rem;
  }
  .jfhcoupon dt{
    width: 2.08rem;
    height: 2.4rem;
    margin-left: .08rem;
    cursor: pointer;
    position: relative;
  }
  .jfhcoupon dt .dhbox{
     width: 100%;
     height: 100%;
  }
  .jfhcoupon dt div{
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 20;
    top:0;
    left: -0.01rem;
  }
  .jfhcoupon dt div .sold-out {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: .1rem;
    background: rgba(0,0,0,.5) url(../images/sold_out.png) no-repeat center center;
    background-size: 1.37rem 1.37rem;
}

  .jfhcoupon dd{
    width: 110%;
    height: .30rem;
    margin: .10rem auto 0;
  }
  .jfhcoupon dd div{
    width: 1.70rem;
    float: left;
    padding:0.02rem .02rem .02rem 0.02rem;
    height: .1rem;
    background: url('../images/jdt.png') no-repeat center center;
    background-size: 100%; 
    overflow: hidden;
  }
  .jfhcoupon dd span{
    font-size: .17rem;
    line-height: .11rem;
    float: left;
    margin-left: .05rem;
    color: #280000;
  }
  .jfhcoupon dd p{
    height: .08rem;
    background-color: #feffff;
    border-radius: .03rem;
   }

.jfhcouponInfro{
  font-family:' FZLTZHUNHK--GBK1-0';
    width: 80%;
    height: auto;
    overflow: hidden;
    margin: 0 auto;
  }
.jfhcouponInfro p{
  color: #563535;
  font-size: .17rem;
  line-height: .30rem;
}

.couponBox{
  width: 6rem;
  height: 4.1rem;
  padding-top: 1.6rem;
  margin: 0 auto;
}
.couponBox li{
  width: 2.7rem;
  height: 1.13rem;
  margin:0 .14rem .24rem; 
  float: left;
  cursor: pointer;
  position: relative;
}
.couponBox li p{
  position: absolute;
  width: 2.9rem;
  height: 1.13rem;
  left: -0%;
  top:0%;
}
.couponBox li p.slot{
  background: rgba(0,0,0,.5) url(../images/sold_out.png) no-repeat center center;
  background-size:1rem; 

}

.zxBtn{
  width: 2.70rem;
  height: .5rem;
  cursor: pointer;
}
.zxBtn p{
  font-size: .19rem;
  color: #fff;
  text-align: right;
  line-height: .35rem;
  height: .5rem;
  padding-right: .05rem;

}

.titleBox{
  width: 3.37rem;
  height: 2.40rem;
  position: absolute;
  left: 2.62rem;
  top:1.30rem;
}
.qxys{
  width:3.37rem;
  height: .81rem;
  position: absolute;
  top:2.10rem;
  left: 2rem;
 
}

.titleText{
  width: 3.05rem;
  height: .52rem;
  border-radius: .26rem;
  background-color: #f0e2b5;
  position: absolute;
  left: 2.2rem;
  top:3.0rem;
}
.titleText p{
  width: 3.05rem;
  height: .52rem;
  white-space:nowrap;
  overflow:hidden;
  animation:typing 2s steps(30,end),
     blink-caret .5s step-end infinite alternate;
}
.boxshow-an{animation: breathe .5s ease-in-out infinite alternate; -webkit-animation: breathe .5s ease-in-out infinite alternate;-moz-animation: breathe .5s ease-in-out infinite alternate;-ms-animation: breathe .5s ease-in-out infinite alternate;-o-animation: breathe .5s ease-in-out infinite alternate;}

@-webkit-keyframes breathe {
    0%   {box-shadow:0 0 0.05rem rgba(206,0,40,0.1);opacity: .9;}
    100% {box-shadow:0 0 .80rem rgba(178,0,0,1);opacity: 1;}
}
@-o-keyframes breathe {
    0%   {box-shadow:0 0 .05rem rgba(206,0,40,0.1);opacity: .9;}
    100% {box-shadow:0 0 .80rem rgba(178,0,0,1);opacity: 1;}
}
@-moz-keyframes breathe {
    0%   {box-shadow:0 0 .05rem rgba(206,0,40,0.1);opacity: .9;}
    100% {box-shadow:0 0 .80rem rgba(178,0,0,1);opacity: 1;}
}
@keyframes breathe {
    0%   {box-shadow:0 0 .05rem rgba(206,0,40,0.1);opacity: .9;}
    100% {box-shadow:0 0 .80rem rgba(178,0,0,1);opacity: 1;}
}


@keyframes typing {
  from {
  width:0;
}
}@keyframes blink-caret {
  50% {
  border-color:transparent;
}
}


.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; }
#goodsAlert .hd-close,#couponAlert .hd-close{ width: .5rem; height: .50rem; position: absolute; top: 0%; right: 0%; z-index: 55; }
#goodsAlert .hdpop-mc { width: 7.00rem; position: fixed; top: 50%; left: 50%; z-index: 53; margin-left: -3.50rem; height: 3.76rem; margin-top: -1.88rem; background: url('../images/goodsAlert.png') no-repeat center center;background-size: 100%;}
#goodsAlert .hdpop-mc .alert-cont p,#couponAlert .hdpop-mc .alert-cont p,#successbAlert .hdpop-mc .alert-cont p{width: 3.15rem;margin:0 auto;height: 1.0rem;}

#couponAlert .hdpop-mc { width: 7.00rem; position: fixed; top: 50%; left: 50%; z-index: 53; margin-left: -3.50rem; height: 3.76rem; margin-top: -1.88rem; background: url('../images/couponAlert.png') no-repeat center center;background-size: 100% }

#successbAlert .hd-close{ width: .50rem; height: .50rem; position: absolute; top: 0%; right: 0%; z-index: 55; }
#successbAlert .hdpop-mc { width: 5.68rem; position: fixed; top: 50%; left: 50%; z-index: 53; margin-left: -2.84rem; height: 3.62rem; margin-top: -1.81rem; background: url('../images/cgalert.png') no-repeat center center;background-size: 100% }

.defultAn{
  -o-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
}
.gonglBtn{
    -webkit-transform-origin:50% 0;
    -moz-transform-origin:50% 0;
    -ms-transform-origin:50% 0;
    -o-transform-origin:50% 0;
    transform-origin:50% 0;
    animation: page_shake 3s ease 0s infinite; 
    -webkit-animation: page_shake 3s ease 0s infinite;
}


@keyframes page_shake{
    from{transform:rotate(0deg);}
      4%{transform:rotate(5deg);}
   12.5%{transform:rotate(-5deg);}
     21%{transform:rotate(5deg);}
     29%{transform:rotate(-5deg);}
   37.5%{transform:rotate(5deg);}
   46%{transform:rotate(-5deg);}
   50%,to{transform:rotate(0deg);}
}
@-webkit-keyframes page_shake{
    from{-webkit-transform:rotate(0deg);}
      4%{-webkit-transform:rotate(5deg);}
   12.5%{-webkit-transform:rotate(-5deg);}
     21%{-webkit-transform:rotate(5deg);}
     29%{-webkit-transform:rotate(-5deg);}
   37.5%{-webkit-transform:rotate(5deg);}
   46%{-webkit-transform:rotate(-5deg);}
   50%,to{-webkit-transform:rotate(0deg);}
}
@-moz-keyframes page_shake{
    from{-webkit-transform:rotate(0deg);}
      4%{-webkit-transform:rotate(5deg);}
   12.5%{-webkit-transform:rotate(-5deg);}
     21%{-webkit-transform:rotate(5deg);}
     29%{-webkit-transform:rotate(-5deg);}
   37.5%{-webkit-transform:rotate(5deg);}
   46%{-webkit-transform:rotate(-5deg);}
   50%,to{-webkit-transform:rotate(0deg);}
}
@-o-keyframes page_shake{
    from{-webkit-transform:rotate(0deg);}
      4%{-webkit-transform:rotate(5deg);}
   12.5%{-webkit-transform:rotate(-5deg);}
     21%{-webkit-transform:rotate(5deg);}
     29%{-webkit-transform:rotate(-5deg);}
   37.5%{-webkit-transform:rotate(5deg);}
   46%{-webkit-transform:rotate(-5deg);}
   50%,to{-webkit-transform:rotate(0deg);}
}

@-o-keyframes page_shake{
    from{-webkit-transform:rotate(0deg);}
      4%{-webkit-transform:rotate(5deg);}
   12.5%{-webkit-transform:rotate(-5deg);}
     21%{-webkit-transform:rotate(5deg);}
     29%{-webkit-transform:rotate(-5deg);}
   37.5%{-webkit-transform:rotate(5deg);}
   46%{-webkit-transform:rotate(-5deg);}
   50%,to{-webkit-transform:rotate(0deg);}
}