Document
html {
margin:0;
height:100%;
-ms-text-size-adjust:100%;
-webkit-text-size-adjust:100%;
font-size:62.5%;
}
body {
width:100%;
max-width:640px;
min-width:320px;
height:100%;
margin:0 auto;
padding:0;
font-family:”Microsoft Yahei”;
font-size:1.2rem;
color:#a1a1a1;
background:#f5f5f5;
position:relative;
overflow-x:hidden;
-webkit-overflow-scrolling:touch;
}
a {
text-decoration:none;
color:#a1a1a1;
background:transparent;
-webkit-tap-highlight-color:transparent;
}
a:active {
color:#8c88ff;
border:none;
outline:none;
}
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary {
display:block;
}
audio,canvas,progress,video {
display:inline-block;
vertical-align:baseline;
}
audio:not([controls]) {
display:none;
height:0;
}
[hidden],template {
display:none;
}
input {
border:1px solid #999;
line-height:normal;
vertical-align:middle;
outline:0;
border-radius:0;
background:#FFFFFF;
-webkit-appearance:none;
}
input[type=”radio”],input[type=”checkbox”] {
padding:0;
-webkit-tap-highlight-color:rgba(255,255,255,0);
}
input[type=”number”] {
-moz-appearance:textfield;
}
input[type=”number”]::-webkit-inner-spin-button,input[type=”number”]::-webkit-outer-spin-button {
margin:0;
height:auto;
-webkit-appearance:none !important;
}
input[type=”search”] {
-webkit-appearance:textfield;
}
input[type=”search”]::-webkit-search-cancel-button,input[type=”search”]::-webkit-search-decoration {
-webkit-appearance:none;
}
input::-moz-placeholder,textarea::-moz-placeholder {
font-size:1.4rem;
color:#c1c1c1;
}
input:-ms-input-placeholder,textarea:-ms-input-placeholder {
font-size:1.4rem;
color:#c1c1c1;
}
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder {
font-size:1.4rem;
color:#c1c1c1;
}
button,input,optgroup,select,textarea {
margin:0;
font:inherit;
color:inherit;
-webkit-tap-highlight-color:rgba(255,255,255,0);
}
button {
border:none;
overflow:visible;
}
button,select {
text-transform:none;
}
button,html input[type=”button”],input[type=”reset”],input[type=”submit”] {
-webkit-appearance:none;
cursor:pointer;
}
button[disabled],html input[disabled] {
cursor:default;
}
button::-moz-focus-inner,input::-moz-focus-inner {
border:0;
padding:0;
}
textarea {
resize:vertical;
overflow:auto;
}
textarea:focus {
outline:none;
}
h1,h2,h3,h4,h5,h6,p,figure,form,blockquote,ul,ol,li,dl,dd,td,th {
margin:0;
padding:0;
}
h1,h2,h3,h4,h5,h6 {
font:inherit;
}
ul,ol {
list-style:none;
}
em,i {
font-style:normal;
}
table {
border-collapse:collapse;
border-spacing:0;
}
label {
-webkit-tap-highlight-color:rgba(255,255,255,0);
}
img {
max-width:100%;
height:auto;
border:0;
vertical-align:middle;
}
* {
-webkit-box-sizing:border-box;
box-sizing:border-box;
}
.coupon-wrapper {
width:100%;
height:auto;
padding:5%;
}
.coupon-wrapper .coupon-item {
width:100%;
}
.coupon-wrapper h3 {
height:3rem;
line-height:1.8rem;
font-size:1.4rem;
color:#454545;
padding:2% 0;
}
.coupon-item .nick {
padding:.66% 0;
color:#fff;
}
.coupon-item .coupon-money {
width:100%;
display:-webkit-box;
display:-webkit-flex;
display:flex;
font-size:1.2rem;
align-items:center;
}
.coupon-item .coupon-money em {
font-size:3.8rem;
}
.coupon-item .coupon-money .lay:last-child {
flex:1;
padding:0 3%;
line-height:1.66rem;
}
.style-one,.style-two,.style-three,.style-four,.style-five,.style-six,.style-seven {
width:100%;
height:8rem;
position:relative;
margin:5% 0;
display:-webkit-box;
display:-webkit-flex;
display:flex;
align-items:center;
justify-content:center;
background-color:#fff;
border:1px solid #E5004F;
}
.style-one:after,.style-three .get-btn:after {
content:”“;
width:1.2rem;
position:absolute;
top:0;
bottom:0;
right:23.9%;
display:block;
z-index:9;
background-color:#fff;
background-position:100% 35%;
background-size:2rem .66rem;
background-image:linear-gradient(-45deg,#e5004f 25%,transparent 25%,transparent),linear-gradient(-135deg,#e5004f 25%,transparent 25%,transparent),linear-gradient(-45deg,transparent 75%,#e5004f 75%),linear-gradient(-135deg,transparent 75%,#e5004f 75%);
}
.style-one .info-box,.style-two .info-box,.style-three .info-box,.style-four .info-box,.style-five .info-box,.style-six .info-box,.style-seven .info-box {
-webkit-box:1;
-webkit-flex:1;
flex:1;
padding:0 3% 0 10%;
position:relative;
}
.style-one .info-box:before,.style-one .info-box:after,.style-one .get-btn:before,.style-one .get-btn:after,.style-two .info-box:before,.style-two .info-box:after,.style-two .get-btn:before,.style-two .get-btn:after {
content:”“;
width:1.4rem;
height:2rem;
position:absolute;
z-index:9;
border-width:1px;
border-style:solid;
border-color:transparent #E5004F transparent transparent;
-webkit-border-radius:50%;
border-radius:50%;
background-color:#f5f5f5;
}
.style-one .info-box:before,.style-two .info-box:before {
top:-1.8rem;
left:-.5rem;
-webkit-transform:rotate(43deg);
transform:rotate(43deg);
}
.style-one .info-box:after,.style-two .info-box:after {
bottom:-1.8rem;
left:-.5rem;
-webkit-transform:rotate(-43deg);
transform:rotate(-43deg);
}
.style-one .get-btn:before,.style-two .get-btn:before {
top:-.8rem;
right:-.35rem;
-webkit-transform:rotate(143deg);
transform:rotate(143deg);
border-color:transparent;
}
.style-one .get-btn:after,.style-two .get-btn:after {
bottom:-.8rem;
right:-.35rem;
-webkit-transform:rotate(-143deg);
transform:rotate(-143deg);
border-color:transparent;
}
.style-one .get-btn,.style-two .get-btn,.style-three .get-btn,.style-four .get-btn,.style-six .get-btn,.style-seven .get-btn {
display:-webkit-box;
display:-webkit-flex;
display:flex;
align-items:center;
justify-content:center;
width:24%;
height:8rem;
text-align:center;
color:#fff;
font-size:1.5rem;
line-height:1.35;
background-color:#E5004F;
position:relative;
}
.style-one .get-btn span {
width:1.6rem;
padding:.66rem 2rem .66rem 0;
display:inherit;
margin:0 auto;
word-break:break-all;
}
.style-one .nick,.style-four .nick {
color:#c1c1c1;
}
.style-one .of,.style-one .lay .tit,.style-four .of,.style-four .lay .tit,.style-six .nick {
color:#E5004F;
}
.style-one .lay .demand,.style-four .lay .demand {
color:#454545;
}
.style-two {
background-color:#ED008C;
border:1px solid #ED008C;
color:#fff;
}
.style-two:before,.style-two:after {
content:”“;
height:.5rem;
position:absolute;
display:block;
z-index:9;
background-image:linear-gradient(-45deg,#ED008C 25%,transparent 25%,transparent),linear-gradient(-135deg,#ED008C 25%,transparent 25%,transparent),linear-gradient(-45deg,transparent 75%,#ED008C 75%),linear-gradient(-135deg,transparent 75%,#ED008C 75%);
background-size:1rem 1rem;
background-repeat:repeat-x,repeat-x;
}
.style-two:before {
top:-.4rem;
left:.5rem;
right:.5rem;
-webkit-transform:rotate(180deg);
transform:rotate(180deg);
}
.style-two:after {
bottom:-.36rem;
left:1.2rem;
right:1.38rem;
}
.style-two .info-box:before,.style-two .info-box:after {
border-color:transparent;
}
.style-two .get-btn {
background-color:#ed008c;
}
.style-two .get-btn span,.style-three .get-btn span,.style-six .get-btn span,.style-seven .get-btn span {
width:4rem;
font-size:1.8rem;
word-break:break-all;
}
.style-two .of {
color:#FFF100;
}
.style-three {
background-color:#378AE8;
border:none;
color:#fff;
}
.style-three:before {
content:”“;
position:absolute;
left:-.66rem;
width:2.4rem;
height:2.8rem;
top:50%;
-webkit-transform:translate(-30%,-50%);
transform:translate(-30%,-50%);
-webkit-box-shadow:3px 0 0 #aeadad;
box-shadow:3px 0 0 #aeadad;
-webkit-border-radius:80%;
border-radius:80%;
background-color:#f5f5f5;
}
.style-three .get-btn {
width:34%;
background-color:#fff;
}
.style-three .get-btn:after {
left:0;
background-image:linear-gradient(-45deg,#ffffff 25%,#378ae8 25%,#378ae8)
}
.style-six .get-btn,.style-seven .get-btn {
width:28%;
background-color:#fff;
}
.style-three .get-btn span,.style-six .get-btn span {
color:#378AE8;
}
.style-three .get-btn span:after,.style-six .get-btn span:after {
content:”V”;
font-size:1.6rem;
display:block;
}
.style-four {
background-color:#fff;
-webkit-border-radius:1rem;
border-radius:1rem;
border:1px dashed #e5004f;
}
.style-four .get-btn {
width:30%;
height:7rem;
background-color:#fff;
text-align:center;
}
.style-four .get-btn span {
display:block;
padding:2.66rem 0;
font-size:1.5rem;
word-break:break-all;
color:#454545;
}
.style-five {
background-color:#E5004F;
-webkit-border-radius:1rem;
border-radius:1rem;
border:none;
color:#fff;
}
.style-five .get-btn {
width:28%;
height:7rem;
position:relative;
-webkit-perspective:180;
perspective:180;
}
.style-five .get-btn:after {
content:”“;
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
background-color:#F8B551;
transform:rotateY(-28deg);
z-index:1;
-webkit-border-radius:.66rem;
border-radius:.66rem;
-webkit-box-shadow:-3px 0 8px #793030;
box-shadow:-3px 0 8px #793030;
}
.style-five .get-btn span {
width:4rem;
word-break:break-all;
font-size:1.8rem;
color:#454545;
position:absolute;
top:50%;
left:50%;
-webkit-transform:translate(-30%,-50%);
transform:translate(-30%,-50%);
z-index:3;
}
.style-six {
background-color:#F7DBCD;
color:#E5004F;
border:none;
}
.style-six:after,.style-six:before {
content:”“;
height:.5rem;
position:absolute;
left:0;
right:0;
display:block;
z-index:9;
background-image:linear-gradient(-45deg,#f5f5f5 25%,transparent 25%,transparent),linear-gradient(-135deg,#f5f5f5 25%,transparent 25%,transparent),linear-gradient(-45deg,transparent 75%,#f5f5f5 75%),linear-gradient(-135deg,transparent 75%,#f5f5f5 75%);
background-size:1rem 1rem;
background-repeat:repeat-x,repeat-x;
}
.style-six:after {
top:-.12rem;
}
.style-six:before {
bottom:-.12rem;
-webkit-transform:rotate(180deg);
transform:rotate(180deg);
}
.style-six .get-btn span {
color:#E5004F;
}
.style-seven {
background-color:#F3B502;
color:#fff;
border:none;
}
.style-seven:before,.style-seven:after {
content:”“;
position:absolute;
width:2rem;
height:6rem;
-webkit-border-radius:50%;
border-radius:50%;
background-color:#f5f5f5;
top:50%;
-webkit-transform:translate(0,-50%);
transform:translate(0,-50%);
}
.style-seven:before {
left:-1rem;
-webkit-box-shadow:2px 0 0 #c6c6c6;
box-shadow:2px 0 0 #c6c6c6;
}
.style-seven:after {
right:-1rem;
-webkit-box-shadow:-2px 0 0 #c6c6c6;
box-shadow:-2px 0 0 #c6c6c6;
}
.style-seven .get-btn {
background-color:#000000;
padding-right:.88rem;
}
/* 已领取 */
.style-one.have {
border:1px solid #ddd;
color:#C1C1C1;
color:#C1C1C1;
}
.style-one.have .info-box:before,.style-one.have .info-box:after,.style-two.have .info-box:before,.style-two.have .info-box:after {
border-right:1px solid #c1c1c1;
}
.style-one.have .of,.style-one.have .tit,.style-one.have .demand,.style-four.have .of,.style-four.have .tit,.style-four.have .demand {
color:#c1c1c1;
}
.style-one.have .get-btn {
background-color:#c1c1c1;
}
.style-one.have .get-btn span {
color:#fff;
}
.style-one.have .get-btn:before,.style-one.have .get-btn:after,.style-two.have .get-btn:before,.style-two.have .get-btn:after {
border-color:transparent;
}
.style-one.have:after {
background-image:linear-gradient(-45deg,#c1c1c1 25%,transparent 25%,transparent),linear-gradient(-135deg,#c1c1c1 25%,transparent 25%,transparent),linear-gradient(-45deg,transparent 75%,#c1c1c1 75%),linear-gradient(-135deg,transparent 75%,#c1c1c1 75%);
}
.style-two.have,.style-three.have {
background-color:#c1c1c1;
border:none;
}
.style-two.have .of {
color:#fff;
}
.style-two.have:before,.style-two.have:after {
background-image:linear-gradient(-45deg,#c1c1c1 25%,transparent 25%,transparent),linear-gradient(-135deg,#c1c1c1 25%,transparent 25%,transparent),linear-gradient(-45deg,transparent 75%,#c1c1c1 75%),linear-gradient(-135deg,transparent 75%,#c1c1c1 75%);
}
.style-two.have .get-btn {
background-color:#c1c1c1;
}
.style-two.have .get-btn span,.style-three.have .get-btn span,.style-six.have .get-btn span,.style-seven.have .get-btn span {
width:1.6rem;
padding:1.36rem 0;
font-size:1.6rem;
}
.style-three.have .get-btn:after {
background-image:linear-gradient(-45deg,#ffffff 25%,#c1c1c1 25%,#c1c1c1);
}
.style-three.have .get-btn span,.style-four.have .get-btn span,.style-six.have .get-btn span {
color:#767676;
font-size:1.6rem;
}
.style-three.have .get-btn span:after,.style-six.have .get-btn span:after {
content:”“;
}
.style-four.have {
border:1px dashed #C1C1C1;
}
.style-five.have,.style-five.have .get-btn:after,.style-six.have,.style-seven.have {
background-color:#c1c1c1;
}
.style-five.have .get-btn:after {
-webkit-box-shadow:-3px 0 8px #8c8c8c;
box-shadow:-3px 0 8px #8c8c8c;
}
.style-five.have .get-btn span {
width:5rem;
font-size:1.5rem;
color:#fff;
}
.style-six.have .nick,.style-six.have .of,.style-six.have .tit,.style-six.have .demand {
color:#fff;
}
.style-six.have span,.style-seven.have span {
font-size:1.6rem;
color:rgba(189,189,189,1);
}
立即领取
已领取
立即领取
已领取
点击领取
已领取
立即领取
已领取
立即领取
已领取
点击领取
已领取
立即领取
已领取
京东优惠领取：
京东平台优惠?
￥10
优惠?
满100元可用
京东平台优惠?
￥10
优惠?
满100元可用
唯品会优惠?领取：
唯品会平台优惠?
￥10
优惠?
满100元可用
唯品会平台优惠?
￥10
优惠?
满100元可用
1号店优惠?领取：
1号店平台优惠券
￥10
优惠?
满100元可用
1号店平台优惠券
￥10
优惠?
满100元可用
当当网优惠券领取：
当当网平台优惠券
￥10
优惠?
满100元可用
当当网平台优惠券
￥10
优惠?
满100元可用
飞牛网优惠?领取：
飞牛网平台优惠券
￥10
优惠?
满100元可用
飞牛网平台优惠券
￥10
优惠?
满100元可用
我买网优惠?领取：
我买网平台优惠券
￥10
优惠?
满100元可用
我买网平台优惠券
￥10
优惠?
满100元可用
苏宁优惠?领取：
苏宁平台优惠券
￥10
优惠?
满100元可用
苏宁平台优惠券
￥10
优惠?
满100元可用
扫一扫
381
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
