

/*2020（10月12）一元体验*/
.J-banner-container{ position: relative; overflow: hidden; height: 1000px; background: url(/zhuanti/yiyuancoupon/img/banner@img.jpg) center no-repeat; }
.J-banner-container .J-banner-body{ position: relative; height: 1002px;}
.J-banner-container .J-banner-body .gift-layer1{ position:absolute; left: 232px; top: 118px; z-index: 9; width:841px; height: 269px; background: url(/zhuanti/yiyuancoupon/img/gift-layer1@img.png); }
.J-banner-container .J-banner-body .gift-layer2{ position:absolute; left: 232px; top: 321px; z-index: 10; width:765px; height: 281px; background: url(/zhuanti/yiyuancoupon/img/gift-layer2@img.png);  }
.J-banner-container .J-banner-body .gift-layer2 .startTime{ width: 440px; font-size: 42px; font-weight: bold; color: #fff; margin: 192px 0 0 155px; text-align: center;}
.J-banner-container .J-banner-body .gift-layer3{ position:absolute; left: 50px; top: 621px; z-index: 11; width:1227px; height: 174px; background: url(/zhuanti/yiyuancoupon/img/gift-layer3@img.png);}
.J-banner-container .gift-layer4{ position:absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 8; width:100%; height: 1000px; background: url(/zhuanti/yiyuancoupon/img/gift-layer4@img.png) center no-repeat;}

.J-mian{ background: url(/zhuanti/yiyuancoupon/img/experience-box@bg.jpg) top center no-repeat #fdf9eb; }

.J-advantage-container h3{ text-align: center;}
.J-advantage-container .list{ margin-top: 60px;}
.J-advantage-container .list li{ float: left; width: 269px; border: 2px solid #ffc966; transition: All 0.3s ease-in-out;  border-radius: 8px; background-color:rgba(255,255,255,0.5); padding: 30px 0; text-align: center; box-shadow: 0px 4px 6px rgba(0,0,0,0.1);}
.J-advantage-container .list li:hover{transform: translate(0,-6px); }
.J-advantage-container .list li.spacer{ margin-right: 35px;}
.J-advantage-container .list li p{ font-size: 26px; color: #ff6c00; font-weight: bold; margin-top: 20px;}

/*一元体验*/
.J-giftCoupons-container{ width: 1200px; height: 441px; margin-top: 60px; background: url(/zhuanti/yiyuancoupon/img/gift-coupons@bg.png) no-repeat; box-shadow: 0px 4px 10px rgba(0,0,0,0.2); border-radius: 20px;}
.J-giftCoupons-container .J-giftCoupons-body{ padding: 60px;}
.J-giftCoupons-container .J-giftCoupons-body .bd{ margin-top: 50px;}
.J-giftCoupons-container .J-giftCoupons-body .bd .item1{ position: relative; float: left; width: 350px; font-size: 30px; color: #a56603; }
.J-giftCoupons-container .J-giftCoupons-body .bd .item1 .spacer{ position: absolute; right: 0; top: 10px; z-index: 9; width: 1px; height: 170px; background-color: #b48a49;}
.J-giftCoupons-container .J-giftCoupons-body .bd .item1 p{ margin-bottom: 10px;}
.J-giftCoupons-container .J-giftCoupons-body .bd .item1 p.dt{ font-size: 32px; font-weight: bold;}
.J-giftCoupons-container .J-giftCoupons-body .bd .item1 .countdownTime{ font-size: 38px; font-weight: bold;}
.J-giftCoupons-container .J-giftCoupons-body .bd .item1 .countdownTime span{ color: #a56603; margin:0 5px; font-weight: normal; font-size: 24px;}


.J-giftCoupons-container .J-giftCoupons-body .bd .item2{ float: left; font-size: 18px; color: #a56603; padding: 10px 0 0 50px;}
.J-giftCoupons-container .J-giftCoupons-body .bd .item2 p{ margin-bottom: 8px;}
.J-giftCoupons-container .J-giftCoupons-body .bd .but{ float: left; margin: 110px 0 0 40px; display: block; width: 220px; height: 60px; text-align: center; line-height: 60px; font-size: 30px; color: #fff; background-color: #ff5a00; border: 3px solid #da4a28; border-radius: 10px; box-shadow: 0px 5px 6px rgba(0,0,0,0.1);}
.J-giftCoupons-container .J-giftCoupons-body .bd .but:hover{ background-color: #ed5300;}
.J-giftCoupons-container .J-giftCoupons-body .bd .over{ background-color: #999 !important; color: #fff; border: 2px solid #777; cursor: default; }


/*1元体验规则*/
.J-giftRules-container{ padding: 0 0 80px 0;}
.J-giftRules-container .J-giftRules-body{ padding: 3px; border-radius: 8px; box-sizing: border-box; background: linear-gradient(#ff6600 , #ff9805 , #468fff); margin: 115px 0 0 0; box-shadow: 0 6px 8px rgba(0,0,0,0.2);}
.J-giftRules-container .J-giftRules-body .box{ padding:70px 45px 60px; border-radius: 6px; background-color: #fff; }
.J-giftRules-container .J-giftRules-body .box .title{ position:absolute; left: 50%; top: -43px; z-index: 9; margin-left: -245px; width:450px; height: 74px; background: url(/zhuanti/yiyuancoupon/img/coupons-rule@title.png);}
.J-giftRules-container .J-giftRules-body .box .title .a-hand{ position: absolute; left: 49px; top: -18px; width: 62px; height: 67px; z-index: 9; background: url(/zhuanti/yiyuancoupon/img/Order-process-title@icon.png);}
.J-giftRules-container .J-giftRules-body .box .title .a-spacer{ position: absolute; right: 60px; top:22px; width: 52px; height: 37px; z-index: 9; background: url(/zhuanti/yiyuancoupon/img/title-spacer@icon.png);}
.J-giftRules-container .J-giftRules-body .box .title h3{ font-size: 32px; font-weight: bold; text-align: center; line-height: 70px; color: #fff;}
.J-giftRules-container .J-giftRules-body .item{ font-size: 16px;}
.J-giftRules-container .J-giftRules-body .item p{ position: relative; margin-bottom: 12px;}
.J-giftRules-container .J-giftRules-body .item .list p{ padding-left: 23px;}
.J-giftRules-container .J-giftRules-body .item p i{ position: absolute; left: 0; top: 4px; display: inline-block; vertical-align: middle; width: 19px; height: 19px; margin: -2px 5px 0 0; border-radius: 20px; font-size: 12px; text-align: center; line-height: 19px; display: inline-block; background-color: #4f4f4f; color: #fff;}
.J-giftRules-container .J-giftRules-body .item .sourceBtn{ display: block; width: 438px; height: 101px; line-height: 78px; margin: 0 auto; margin-top: 50px; color: #fff; font-size: 28px; text-align: center; background: url(/zhuanti/yiyuancoupon/img/source@but.png); transition: All 0.2s ease-in-out;}
.J-giftRules-container .J-giftRules-body .item .sourceBtn:hover{ transform: translate(0,-1px);}

/*弹出层*/
.getCoupons-up {
  display: none;
  position: fixed;
  top: 50%;
  right: 0;
  left: 0;
  z-index: 999999;
  margin: auto;
  margin-top: -300px;
  width: 580px;
  padding: 40px 20px 50px;
  border-radius: 10px;
  border: 5px solid #b20000;
  background-color: #fff;
  box-shadow: 0 0 20px rgba(0,0,0,0.25);
}

.getCoupons-up .box{ padding: 20px;}
.getCoupons-up .box .item1{ overflow: hidden; border:2px dashed #e5e5e5; padding: 22px 20px; border-radius: 6px;}
.getCoupons-up .box .item1 .txt{ width: 320px; float: left;}
.getCoupons-up .box .item1 .txt .name{ font-size: 20px; font-weight: bold; margin-bottom: 5px; color: #b20000;}
.getCoupons-up .box .item1 .txt .note{ color: #888; font-size: 14px;}
.getCoupons-up .box .item1 .but{ float: right; width: 105px; height: 42px; background-color: #b20000; color: #fff; font-size: 14px; text-align: center; line-height: 42px; border-radius: 3px;}

.getCoupons-up .box .item2{ overflow: hidden; border:2px dashed #e5e5e5; padding: 22px 20px; border-radius: 6px; margin-top: 25px;}
.getCoupons-up .box .item2 .txt .name{ font-size: 20px; font-weight: bold; margin-bottom: 5px; color: #b20000;}
.getCoupons-up .box .item2 .txt .note{ color: #888; font-size: 14px; margin-bottom: 10px;}
.getCoupons-up .box .item2 .txt input{ float: left; width: 372px; height: 30px; padding: 5px 5px; border: 1px solid #999; font-size: 16px; border-radius: 3px;}
.getCoupons-up .box .item2 .txt button{ float: right; width: 105px; border: 0; height: 42px; background-color: #555; color: #fff; font-size: 14px; text-align: center; line-height: 42px; border-radius: 3px;}

.getCoupons-up h3 {
  color: #b20000;
  font-weight: bold;
  text-align: center;
  font-size: 30px;
}

.getCoupons-up .operation {
  text-align: center;
  margin-top: 20px;
}

.getCoupons-up .operation a {
  padding: 12px 22px;
  border: 0;
  margin: 0 5px;
  background-color: #e5e5e5;
  font-size: 14px;
  border-radius: 3px;
}

.getCoupons-up .operation a.ckBtn {
  background-color: #b20000;
  color: #fff;
}

.getCoupons-up .close {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 999;
  width: 25px;
  height: 25px;
  cursor: pointer;
}

/*弹窗黑色背景*/
.g-mian-bg {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 99999;
  background: #000;
  -moz-opacity: 0.6;
  opacity: 0.6;
  filter: alpha(opacity=60);
}


@-webkit-keyframes bounce-down {


    25% {
        -webkit-transform: translateY(-10px);
    }
    50%, 100% {
        -webkit-transform: translateY(0);
    }
    75% {
        -webkit-transform: translateY(10px);
    }
}
 
@keyframes bounce-down {
    25% {
        transform: translateY(-10px);
    }
    50%, 100% {
        transform: translateY(0);
    }
    75% {
        transform: translateY(10px);
    }
}
 
.animate-bounce-down{
    -webkit-animation: bounce-down 4s linear infinite;
    animation: bounce-down 4s linear infinite;
}
 
@-webkit-keyframes bounce-up {
    25% {
        -webkit-transform: translateY(25px);
    }
    50%, 100% {
        -webkit-transform: translateY(0);
    }
    75% {
        -webkit-transform: translateY(-25px);
    }
}
 
@keyframes bounce-up {
    25% {
        transform: translateY(25px);
    }
    50%, 100% {
        transform: translateY(0);
    }
    75% {
        transform: translateY(-25px);
    }
}
 
.gift-layer4{
    -webkit-animation: bounce-up 4s linear infinite;
    animation: bounce-up 4s linear infinite;
}
