2023-07-31 11:28:48 +08:00
|
|
|
body {
|
|
|
|
width: 100%;
|
|
|
|
height: 21.6533333333rem;
|
|
|
|
background: linear-gradient(90deg, #9980FF, #EB8FEA);
|
|
|
|
margin: 0 auto;
|
|
|
|
}
|
|
|
|
|
|
|
|
.back {
|
|
|
|
position: fixed;
|
|
|
|
top: 0.9333333333rem;
|
|
|
|
left: 0.4533333333rem;
|
|
|
|
z-index: 9999;
|
|
|
|
width: 0.8266666667rem;
|
|
|
|
height: 0.8266666667rem;
|
|
|
|
}
|
|
|
|
.back img {
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
}
|
|
|
|
.back p {
|
|
|
|
color: #fff;
|
|
|
|
font-size: 0.4266666667rem;
|
|
|
|
position: absolute;
|
|
|
|
width: 9rem;
|
|
|
|
left: 0;
|
|
|
|
top: 0;
|
|
|
|
height: 100%;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 0.8266666667rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
.header {
|
|
|
|
width: 10rem;
|
2023-08-01 16:47:16 +08:00
|
|
|
height: 10.9066666667rem;
|
2023-07-31 11:28:48 +08:00
|
|
|
background: url(../images/header.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
2023-08-09 18:29:45 +08:00
|
|
|
margin: 0 auto -2.4rem;
|
2023-07-31 11:28:48 +08:00
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
.header .rule {
|
|
|
|
width: 1.84rem;
|
|
|
|
height: 0.6133333333rem;
|
|
|
|
line-height: 0.6133333333rem;
|
|
|
|
text-align: center;
|
|
|
|
position: absolute;
|
2023-08-15 10:08:47 +08:00
|
|
|
top: 6rem;
|
2023-07-31 11:28:48 +08:00
|
|
|
right: 0;
|
|
|
|
color: #F8F3FC;
|
|
|
|
font-size: 0.3466666667rem;
|
|
|
|
background: url(../images/rule_bg.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
2023-08-09 18:29:45 +08:00
|
|
|
.header .titleHeader {
|
|
|
|
position: absolute;
|
|
|
|
width: 9.0266666667rem;
|
|
|
|
height: 0.88rem;
|
|
|
|
line-height: 0.88rem;
|
|
|
|
text-align: center;
|
|
|
|
top: 7.7333333333rem;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.4rem;
|
|
|
|
font-weight: bold;
|
|
|
|
background: url(../images/titleHeader.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
2023-07-31 11:28:48 +08:00
|
|
|
|
|
|
|
.betrothal {
|
|
|
|
width: 9.28rem;
|
|
|
|
height: 4.2533333333rem;
|
|
|
|
background: url(../images/betrothal.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
margin: 0 auto 0.4rem;
|
|
|
|
position: relative;
|
|
|
|
z-index: 2;
|
2023-08-01 11:26:28 +08:00
|
|
|
box-sizing: border-box;
|
|
|
|
padding-top: 1.5733333333rem;
|
|
|
|
}
|
|
|
|
.betrothal .swiper {
|
|
|
|
width: 8.52rem;
|
|
|
|
height: 2.32rem;
|
|
|
|
margin: 0 auto 0;
|
|
|
|
overflow: hidden;
|
|
|
|
}
|
|
|
|
.betrothal .swiper .swiper-wrapper .swiper-slide img {
|
|
|
|
display: block;
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
2023-07-31 11:28:48 +08:00
|
|
|
}
|
|
|
|
|
2023-08-01 16:47:16 +08:00
|
|
|
.tab {
|
|
|
|
width: 9.3333333333rem;
|
|
|
|
height: 1.0666666667rem;
|
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
|
|
margin: 0 auto 0.16rem;
|
|
|
|
}
|
|
|
|
.tab div {
|
|
|
|
width: 25%;
|
|
|
|
height: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.tab1 {
|
|
|
|
background: url(../images/tab1.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.tab2 {
|
|
|
|
background: url(../images/tab2.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.tab3 {
|
|
|
|
background: url(../images/tab3.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.tab4 {
|
|
|
|
background: url(../images/tab4.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
|
|
|
|
2023-08-07 11:49:19 +08:00
|
|
|
.page1 {
|
|
|
|
padding-bottom: 0.6266666667rem;
|
|
|
|
}
|
|
|
|
.page1 .blessingBag {
|
2023-08-01 16:47:16 +08:00
|
|
|
width: 8.88rem;
|
|
|
|
height: 5.04rem;
|
|
|
|
background: url(../images/blessingBag.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
margin: 0 auto 0.4933333333rem;
|
|
|
|
position: relative;
|
|
|
|
}
|
2023-08-07 11:49:19 +08:00
|
|
|
.page1 .blessingBag .blessingBag_in {
|
2023-08-01 22:34:20 +08:00
|
|
|
width: 7.8rem;
|
2023-08-01 16:47:16 +08:00
|
|
|
height: 2rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: 2.4rem;
|
|
|
|
border-radius: 0.1333333333rem;
|
|
|
|
overflow: hidden;
|
|
|
|
}
|
2023-08-07 11:49:19 +08:00
|
|
|
.page1 .blessingBag .blessingBag_in ul {
|
2023-08-01 22:34:20 +08:00
|
|
|
list-style: none;
|
2023-08-01 16:47:16 +08:00
|
|
|
position: absolute;
|
2023-08-01 22:34:20 +08:00
|
|
|
display: flex;
|
2023-08-02 14:44:21 +08:00
|
|
|
animation: scrollLeft 11s linear infinite;
|
2023-08-01 16:47:16 +08:00
|
|
|
}
|
2023-08-07 11:49:19 +08:00
|
|
|
.page1 .blessingBag .blessingBag_in ul li {
|
2023-08-01 16:47:16 +08:00
|
|
|
width: 1.8666666667rem;
|
|
|
|
height: 1.8666666667rem;
|
|
|
|
background: url(../images/blessingBagLiBg.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
float: left;
|
|
|
|
margin-top: 0.045rem;
|
|
|
|
position: relative;
|
|
|
|
}
|
2023-08-07 11:49:19 +08:00
|
|
|
.page1 .blessingBag .blessingBag_in ul li img {
|
2023-08-01 16:47:16 +08:00
|
|
|
position: absolute;
|
|
|
|
left: 51%;
|
|
|
|
top: 50%;
|
|
|
|
border-radius: 50%;
|
|
|
|
width: 1.2533333333rem;
|
|
|
|
height: 1.2533333333rem;
|
|
|
|
transform: translate(-50%, -50%);
|
|
|
|
}
|
2023-08-07 11:49:19 +08:00
|
|
|
.page1 .blessingBag .blessingBag_in ul li b {
|
2023-08-01 16:47:16 +08:00
|
|
|
padding: 0 0.0933333333rem;
|
|
|
|
height: 0.2666666667rem;
|
|
|
|
line-height: 0.2666666667rem;
|
|
|
|
text-align: center;
|
|
|
|
color: #fff;
|
|
|
|
background: linear-gradient(0deg, #DC87FF, #BF2BED, #DD89FF);
|
|
|
|
font-size: 0.1733333333rem;
|
|
|
|
border-radius: 0px 0.1333333333rem 0px 0.2533333333rem;
|
|
|
|
position: absolute;
|
|
|
|
top: 0.1066666667rem;
|
|
|
|
right: 0.0666666667rem;
|
|
|
|
}
|
2023-08-07 11:49:19 +08:00
|
|
|
.page1 .blessingBag .blessingBag_in ul li p {
|
2023-08-01 16:47:16 +08:00
|
|
|
width: 1.68rem;
|
|
|
|
height: 0.3146666667rem;
|
|
|
|
line-height: 0.3146666667rem;
|
|
|
|
background: linear-gradient(90deg, #FB80C3, rgba(253, 252, 254, 0.1));
|
|
|
|
position: absolute;
|
|
|
|
left: 0.0933333333rem;
|
|
|
|
bottom: 0.2933333333rem;
|
|
|
|
color: #fff;
|
|
|
|
font-size: 0.1733333333rem;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding-left: 0.0666666667rem;
|
|
|
|
}
|
|
|
|
@keyframes scrollLeft {
|
|
|
|
100% {
|
2023-08-02 14:44:21 +08:00
|
|
|
transform: translateX(-11.2rem);
|
2023-08-01 16:47:16 +08:00
|
|
|
}
|
|
|
|
}
|
2023-08-07 11:49:19 +08:00
|
|
|
.page1 .magpieBridge {
|
2023-08-01 16:47:16 +08:00
|
|
|
width: 9.28rem;
|
|
|
|
height: 9.7333333333rem;
|
|
|
|
background: url(../images/magpieBridge.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
margin: 0 auto 0.4933333333rem;
|
2023-08-02 14:44:21 +08:00
|
|
|
position: relative;
|
|
|
|
}
|
2023-08-07 11:49:19 +08:00
|
|
|
.page1 .magpieBridge .magpieBridgeBg {
|
2023-08-02 14:44:21 +08:00
|
|
|
width: 8.9066666667rem;
|
|
|
|
height: 6.5466666667rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: 0.2rem;
|
|
|
|
}
|
2023-08-15 10:08:47 +08:00
|
|
|
.page1 .magpieBridge .leftRen {
|
|
|
|
width: 1.2266666667rem;
|
|
|
|
height: 2.04rem;
|
|
|
|
position: absolute;
|
|
|
|
top: 2.0133333333rem;
|
|
|
|
left: 10%;
|
|
|
|
z-index: 2;
|
|
|
|
}
|
|
|
|
.page1 .magpieBridge .rightRen {
|
2023-08-15 15:47:35 +08:00
|
|
|
width: 1.7333333333rem;
|
|
|
|
height: 2.0133333333rem;
|
2023-08-15 10:08:47 +08:00
|
|
|
position: absolute;
|
|
|
|
top: 2.0133333333rem;
|
|
|
|
right: 10%;
|
|
|
|
z-index: 2;
|
|
|
|
}
|
2023-08-09 18:29:45 +08:00
|
|
|
.page1 .magpieBridge .xiques {
|
|
|
|
width: 8.9066666667rem;
|
|
|
|
height: 6.5466666667rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: 0.2rem;
|
2023-08-15 10:08:47 +08:00
|
|
|
z-index: 2;
|
2023-08-09 18:29:45 +08:00
|
|
|
}
|
|
|
|
.page1 .magpieBridge .xiques .xique {
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
overflow: hidden;
|
|
|
|
}
|
2023-08-07 11:49:19 +08:00
|
|
|
.page1 .magpieBridge .birdNum {
|
2023-08-04 11:00:43 +08:00
|
|
|
height: 0.4533333333rem;
|
|
|
|
line-height: 0.4533333333rem;
|
2023-08-02 14:44:21 +08:00
|
|
|
position: absolute;
|
|
|
|
right: 0.5866666667rem;
|
|
|
|
top: 1.3466666667rem;
|
|
|
|
vertical-align: middle;
|
|
|
|
}
|
2023-08-07 11:49:19 +08:00
|
|
|
.page1 .magpieBridge .birdNum .bird {
|
2023-08-02 14:44:21 +08:00
|
|
|
display: inline-block;
|
2023-08-04 11:00:43 +08:00
|
|
|
width: 0.4533333333rem;
|
|
|
|
height: 0.4266666667rem;
|
2023-08-02 14:44:21 +08:00
|
|
|
margin-right: 0rem;
|
|
|
|
}
|
2023-08-07 11:49:19 +08:00
|
|
|
.page1 .magpieBridge .birdNum b {
|
2023-08-02 14:44:21 +08:00
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.2933333333rem;
|
|
|
|
}
|
2023-08-07 11:49:19 +08:00
|
|
|
.page1 .magpieBridge .but1 {
|
2023-08-02 14:44:21 +08:00
|
|
|
width: 2.9066666667rem;
|
|
|
|
height: 1.16rem;
|
|
|
|
line-height: 1.0666666667rem;
|
|
|
|
text-align: center;
|
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.4rem;
|
|
|
|
font-weight: bold;
|
|
|
|
position: absolute;
|
|
|
|
bottom: 0.4533333333rem;
|
|
|
|
left: 1.4933333333rem;
|
|
|
|
background: url(../images/1.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
text-shadow: 0px 0.0533333333rem 0.0266666667rem rgba(193, 64, 253, 0.67);
|
|
|
|
}
|
2023-08-07 11:49:19 +08:00
|
|
|
.page1 .magpieBridge .but10 {
|
2023-08-02 14:44:21 +08:00
|
|
|
width: 2.9066666667rem;
|
|
|
|
height: 1.16rem;
|
|
|
|
line-height: 1.0666666667rem;
|
|
|
|
text-align: center;
|
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.4rem;
|
|
|
|
font-weight: bold;
|
|
|
|
position: absolute;
|
|
|
|
bottom: 0.4533333333rem;
|
|
|
|
right: 1.4933333333rem;
|
|
|
|
background: url(../images/10.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
text-shadow: 0px 0.0533333333rem 0.0266666667rem rgba(193, 64, 253, 0.67);
|
2023-08-01 16:47:16 +08:00
|
|
|
}
|
2023-08-09 18:29:45 +08:00
|
|
|
.page1 .magpieBridge .buting {
|
|
|
|
display: none;
|
|
|
|
width: 2.9066666667rem;
|
|
|
|
height: 1.16rem;
|
|
|
|
line-height: 1.0666666667rem;
|
|
|
|
text-align: center;
|
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.4rem;
|
|
|
|
font-weight: bold;
|
|
|
|
position: absolute;
|
|
|
|
bottom: 0.4533333333rem;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
background: url(../images/10.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
text-shadow: 0px 0.0533333333rem 0.0266666667rem rgba(193, 64, 253, 0.67);
|
|
|
|
}
|
|
|
|
.page1 .magpieBridge .buterr {
|
|
|
|
display: none;
|
|
|
|
width: 2.9066666667rem;
|
|
|
|
height: 1.16rem;
|
|
|
|
line-height: 1.0666666667rem;
|
|
|
|
text-align: center;
|
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.4rem;
|
|
|
|
font-weight: bold;
|
|
|
|
position: absolute;
|
|
|
|
bottom: 0.4533333333rem;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
background: url(../images/10.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
text-shadow: 0px 0.0533333333rem 0.0266666667rem rgba(193, 64, 253, 0.67);
|
|
|
|
}
|
|
|
|
.page1 .magpieBridge .butout {
|
|
|
|
display: none;
|
|
|
|
width: 2.9066666667rem;
|
|
|
|
height: 1.16rem;
|
|
|
|
line-height: 1.0666666667rem;
|
|
|
|
text-align: center;
|
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.4rem;
|
|
|
|
font-weight: bold;
|
|
|
|
position: absolute;
|
|
|
|
bottom: 0.4533333333rem;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
background: url(../images/butOut.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
2023-08-07 11:49:19 +08:00
|
|
|
.page1 .magpieBridge .text {
|
|
|
|
width: 6.8rem;
|
|
|
|
text-align: center;
|
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.2933333333rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: 5.7866666667rem;
|
|
|
|
line-height: 0.45rem;
|
|
|
|
}
|
|
|
|
.page1 .magpieBridge .line {
|
|
|
|
width: 6.5333333333rem;
|
|
|
|
height: 0.52rem;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding: 0.12rem 0.1066666667rem 0.1333333333rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 0.92rem;
|
|
|
|
top: 6.9466666667rem;
|
|
|
|
background: url(../images/lineBg.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
|
|
|
.page1 .magpieBridge .line .line_in {
|
2023-08-09 18:29:45 +08:00
|
|
|
width: 0%;
|
2023-08-07 11:49:19 +08:00
|
|
|
height: 100%;
|
|
|
|
background: linear-gradient(0deg, #F772D1, #A639D1);
|
|
|
|
border-radius: 0.224rem;
|
|
|
|
}
|
|
|
|
.page1 .magpieBridge .ts {
|
|
|
|
width: 0.9333333333rem;
|
|
|
|
height: 0.9333333333rem;
|
|
|
|
background: url(../images/lineTx.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
position: absolute;
|
2023-08-08 15:44:35 +08:00
|
|
|
right: 0.8rem;
|
2023-08-07 11:49:19 +08:00
|
|
|
top: 6.7333333333rem;
|
|
|
|
}
|
|
|
|
.page1 .magpieBridge .ts img {
|
|
|
|
position: absolute;
|
|
|
|
width: 0.72rem;
|
|
|
|
height: 0.72rem;
|
|
|
|
border-radius: 50%;
|
|
|
|
left: 50%;
|
2023-08-08 15:44:35 +08:00
|
|
|
top: 51%;
|
2023-08-07 11:49:19 +08:00
|
|
|
transform: translate(-50%, -53%);
|
|
|
|
}
|
|
|
|
.page1 .magpieBridge .ts b {
|
|
|
|
position: absolute;
|
|
|
|
text-align: center;
|
|
|
|
font-size: 0.2133333333rem;
|
|
|
|
color: #BE4A98;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
bottom: -0.36rem;
|
|
|
|
white-space: nowrap;
|
|
|
|
}
|
|
|
|
.page1 .task {
|
2023-08-01 22:34:20 +08:00
|
|
|
width: 9.28rem;
|
|
|
|
height: 8.88rem;
|
|
|
|
background: url(../images/task.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
2023-08-07 11:49:19 +08:00
|
|
|
margin: 0 auto 0rem;
|
|
|
|
position: relative;
|
|
|
|
}
|
2023-08-08 15:44:35 +08:00
|
|
|
.page1 .task .tab {
|
|
|
|
width: 100%;
|
|
|
|
height: 1.3333333333rem;
|
|
|
|
position: absolute;
|
|
|
|
top: 0;
|
|
|
|
left: 0;
|
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
|
|
}
|
|
|
|
.page1 .task .tab div {
|
|
|
|
width: 50%;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 {
|
|
|
|
display: block;
|
|
|
|
}
|
2023-08-07 11:49:19 +08:00
|
|
|
.page1 .task .box1 .title {
|
|
|
|
width: 6.4rem;
|
|
|
|
position: absolute;
|
|
|
|
top: 1.72rem;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 0.45rem;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task1 {
|
|
|
|
width: 8.5066666667rem;
|
|
|
|
height: 1.44rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: 2.9333333333rem;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task1 .but {
|
|
|
|
width: 1.5733333333rem;
|
|
|
|
height: 0.5066666667rem;
|
|
|
|
line-height: 0.5066666667rem;
|
|
|
|
text-align: center;
|
|
|
|
color: #fff;
|
|
|
|
font-size: 0.2933333333rem;
|
|
|
|
background: url(../images/go.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
position: absolute;
|
|
|
|
right: 0.4133333333rem;
|
|
|
|
top: 50%;
|
|
|
|
transform: translateY(-50%);
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task1 .out {
|
|
|
|
color: #DB5593;
|
|
|
|
background: url(../images/out.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task1 img {
|
|
|
|
width: 0.9066666667rem;
|
|
|
|
height: 1.04rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 0.5333333333rem;
|
|
|
|
top: 0.2666666667rem;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task1 .p1 {
|
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
left: 1.7066666667rem;
|
|
|
|
top: 0.3466666667rem;
|
|
|
|
font-weight: bold;
|
|
|
|
position: absolute;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task1 .p2 {
|
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.2666666667rem;
|
|
|
|
left: 1.72rem;
|
|
|
|
top: 0.84rem;
|
|
|
|
position: absolute;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task2 {
|
|
|
|
width: 8.5066666667rem;
|
|
|
|
height: 1.44rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: 4.6666666667rem;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task2 .but {
|
|
|
|
width: 1.5733333333rem;
|
|
|
|
height: 0.5066666667rem;
|
|
|
|
line-height: 0.5066666667rem;
|
|
|
|
text-align: center;
|
|
|
|
color: #fff;
|
|
|
|
font-size: 0.2933333333rem;
|
|
|
|
background: url(../images/go.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
position: absolute;
|
|
|
|
right: 0.4133333333rem;
|
|
|
|
top: 50%;
|
|
|
|
transform: translateY(-50%);
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task2 .out {
|
|
|
|
color: #DB5593;
|
|
|
|
background: url(../images/out.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task2 img {
|
|
|
|
width: 0.9066666667rem;
|
|
|
|
height: 1.04rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 0.5333333333rem;
|
|
|
|
top: 0.2666666667rem;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task2 .p1 {
|
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
left: 1.7066666667rem;
|
|
|
|
top: 0.3466666667rem;
|
|
|
|
font-weight: bold;
|
|
|
|
position: absolute;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task2 .p2 {
|
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.2666666667rem;
|
|
|
|
left: 1.72rem;
|
|
|
|
top: 0.84rem;
|
|
|
|
position: absolute;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task3 {
|
|
|
|
width: 8.5066666667rem;
|
|
|
|
height: 2.1066666667rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: 6.4rem;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task3 .but {
|
|
|
|
width: 1.5733333333rem;
|
|
|
|
height: 0.5066666667rem;
|
|
|
|
line-height: 0.5066666667rem;
|
|
|
|
text-align: center;
|
|
|
|
color: #fff;
|
|
|
|
font-size: 0.2933333333rem;
|
|
|
|
background: url(../images/go.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
position: absolute;
|
|
|
|
right: 0.4133333333rem;
|
|
|
|
top: 50%;
|
|
|
|
transform: translateY(-50%);
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task3 .out {
|
|
|
|
color: #DB5593;
|
|
|
|
background: url(../images/out.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task3 img {
|
|
|
|
width: 0.9066666667rem;
|
|
|
|
height: 1.04rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 0.5333333333rem;
|
|
|
|
top: 0.6rem;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task3 .p1 {
|
|
|
|
position: absolute;
|
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
font-weight: bold;
|
|
|
|
left: 1.72rem;
|
|
|
|
top: 0.3466666667rem;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task3 .line {
|
|
|
|
width: 3.7333333333rem;
|
|
|
|
height: 0.1866666667rem;
|
|
|
|
background: #A722AC;
|
|
|
|
position: absolute;
|
|
|
|
left: 1.6266666667rem;
|
|
|
|
top: 1.2666666667rem;
|
|
|
|
border-radius: 0.1866666667rem;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task3 .line .line_in {
|
2023-08-09 18:29:45 +08:00
|
|
|
width: 0%;
|
2023-08-07 11:49:19 +08:00
|
|
|
height: 100%;
|
|
|
|
position: absolute;
|
|
|
|
left: 0;
|
|
|
|
top: 0;
|
|
|
|
background: linear-gradient(0deg, #F772D1, #A639D1);
|
|
|
|
border-radius: 0.1866666667rem;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task3 .line .drop1 {
|
|
|
|
width: 0.24rem;
|
|
|
|
height: 0.24rem;
|
|
|
|
position: absolute;
|
|
|
|
z-index: 2;
|
|
|
|
left: 1.8666666667rem;
|
|
|
|
top: 50%;
|
|
|
|
transform: translateY(-50%);
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task3 .line .drop2 {
|
|
|
|
width: 0.24rem;
|
|
|
|
height: 0.24rem;
|
|
|
|
position: absolute;
|
|
|
|
z-index: 2;
|
|
|
|
left: 94%;
|
|
|
|
top: 50%;
|
|
|
|
transform: translateY(-50%);
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task3 .line .sp1 {
|
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.24rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 0.0933333333rem;
|
|
|
|
top: -0.4666666667rem;
|
|
|
|
white-space: nowrap;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task3 .line .sp2 {
|
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.24rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 1.5333333333rem;
|
|
|
|
top: -0.4666666667rem;
|
|
|
|
white-space: nowrap;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task3 .line .sp3 {
|
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.24rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 3.0266666667rem;
|
|
|
|
top: -0.4666666667rem;
|
|
|
|
white-space: nowrap;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task3 .line .sp4 {
|
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.24rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 0.0933333333rem;
|
|
|
|
bottom: -0.4666666667rem;
|
|
|
|
white-space: nowrap;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task3 .line .sp5 {
|
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.24rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 1.5333333333rem;
|
|
|
|
bottom: -0.4666666667rem;
|
|
|
|
white-space: nowrap;
|
|
|
|
}
|
|
|
|
.page1 .task .box1 .task3 .line .sp6 {
|
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.24rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 3.0266666667rem;
|
|
|
|
bottom: -0.4666666667rem;
|
|
|
|
white-space: nowrap;
|
2023-08-01 22:34:20 +08:00
|
|
|
}
|
2023-08-08 15:44:35 +08:00
|
|
|
.page1 .task .box2 {
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
.page1 .tasks2 {
|
|
|
|
background: url(../images/task2.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
height: 11.68rem;
|
|
|
|
}
|
|
|
|
.page1 .tasks2 .box1 {
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
.page1 .tasks2 .box2 {
|
|
|
|
display: block;
|
|
|
|
}
|
|
|
|
.page1 .tasks2 .box2 .task2But {
|
|
|
|
width: 3.5866666667rem;
|
|
|
|
height: 1.3rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
bottom: 0.52rem;
|
|
|
|
}
|
2023-08-01 22:34:20 +08:00
|
|
|
|
2023-08-07 14:56:02 +08:00
|
|
|
.page2 {
|
|
|
|
padding-bottom: 0.72rem;
|
2023-08-08 15:44:35 +08:00
|
|
|
display: none;
|
2023-08-07 14:56:02 +08:00
|
|
|
}
|
|
|
|
.page2 .blessingTree {
|
|
|
|
width: 9.28rem;
|
|
|
|
height: 12.08rem;
|
|
|
|
position: relative;
|
|
|
|
margin: 0 auto 0.48rem;
|
|
|
|
background: url(../images/blessingTree.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
.page2 .blessingTree .redRope {
|
|
|
|
display: flex;
|
|
|
|
height: 0.32rem;
|
|
|
|
line-height: 0.32rem;
|
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.2933333333rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 0.5733333333rem;
|
|
|
|
top: 1.8rem;
|
|
|
|
}
|
|
|
|
.page2 .blessingTree .redRope .redRopeIcon {
|
|
|
|
float: left;
|
|
|
|
width: 0.32rem;
|
|
|
|
height: 0.32rem;
|
|
|
|
margin-right: 0.1066666667rem;
|
|
|
|
}
|
|
|
|
.page2 .blessingTree .but {
|
|
|
|
width: 4.5066666667rem;
|
|
|
|
height: 1.1733333333rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: 9.6133333333rem;
|
|
|
|
background: url(../images/blessingTreeBut.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
|
|
|
.page2 .blessingTree .introduction {
|
|
|
|
width: 100%;
|
|
|
|
position: absolute;
|
|
|
|
left: 0;
|
|
|
|
top: 11.0666666667rem;
|
|
|
|
text-align: center;
|
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
}
|
|
|
|
.page2 .blessingTree .refresh {
|
|
|
|
display: flex;
|
|
|
|
height: 0.3333333333rem;
|
|
|
|
line-height: 0.3333333333rem;
|
|
|
|
color: #BE4A98;
|
|
|
|
font-size: 0.2933333333rem;
|
|
|
|
position: absolute;
|
|
|
|
right: 0.76rem;
|
|
|
|
top: 10.4133333333rem;
|
|
|
|
}
|
|
|
|
.page2 .blessingTree .refresh .refreshIcon {
|
|
|
|
float: left;
|
|
|
|
width: 0.3333333333rem;
|
|
|
|
height: 0.3333333333rem;
|
|
|
|
margin-right: 0.1466666667rem;
|
|
|
|
}
|
|
|
|
.page2 .blessingTree .lantern {
|
2023-08-08 15:44:35 +08:00
|
|
|
width: 1.4133333333rem;
|
|
|
|
height: 4.04rem;
|
2023-08-07 16:00:23 +08:00
|
|
|
background: url(../images/lantern.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
position: absolute;
|
|
|
|
}
|
2023-08-08 15:44:35 +08:00
|
|
|
.page2 .blessingTree .lantern .box {
|
|
|
|
display: none;
|
|
|
|
}
|
2023-08-07 16:00:23 +08:00
|
|
|
.page2 .blessingTree .lantern1 {
|
|
|
|
left: 0.92rem;
|
2023-08-08 15:44:35 +08:00
|
|
|
top: 4.8rem;
|
2023-08-07 16:00:23 +08:00
|
|
|
}
|
|
|
|
.page2 .blessingTree .lantern2 {
|
2023-08-08 15:44:35 +08:00
|
|
|
left: 2.9466666667rem;
|
|
|
|
top: 5.2666666667rem;
|
2023-08-07 16:00:23 +08:00
|
|
|
}
|
|
|
|
.page2 .blessingTree .lantern3 {
|
2023-08-08 15:44:35 +08:00
|
|
|
left: 5.12rem;
|
|
|
|
top: 4.4666666667rem;
|
2023-08-07 16:00:23 +08:00
|
|
|
}
|
|
|
|
.page2 .blessingTree .lantern4 {
|
2023-08-08 15:44:35 +08:00
|
|
|
left: 7.0133333333rem;
|
|
|
|
top: 5.1466666667rem;
|
2023-08-07 16:00:23 +08:00
|
|
|
}
|
|
|
|
.page2 .blessingTree .openLantern {
|
|
|
|
background: url(../images/openLantern.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
2023-08-08 15:44:35 +08:00
|
|
|
.page2 .blessingTree .openLantern .box {
|
|
|
|
display: block;
|
|
|
|
}
|
|
|
|
.page2 .blessingTree .openLantern .box img {
|
|
|
|
width: 1.0266666667rem;
|
|
|
|
height: 0.9866666667rem;
|
2023-08-07 16:00:23 +08:00
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-48%);
|
2023-08-08 15:44:35 +08:00
|
|
|
top: 0.9866666667rem;
|
2023-08-07 16:00:23 +08:00
|
|
|
}
|
2023-08-15 15:47:35 +08:00
|
|
|
.page2 .blessingTree .openLantern .box .typemp {
|
|
|
|
width: 1.0266666667rem;
|
|
|
|
height: 0.4rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-48%);
|
|
|
|
top: 1.33rem;
|
|
|
|
}
|
|
|
|
.page2 .blessingTree .openLantern .box .typeqp {
|
|
|
|
width: 1rem;
|
|
|
|
height: 0.8rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-48%);
|
|
|
|
top: 1.0933333333rem;
|
|
|
|
}
|
2023-08-08 15:44:35 +08:00
|
|
|
.page2 .blessingTree .openLantern .box p {
|
2023-08-07 16:00:23 +08:00
|
|
|
width: 100%;
|
|
|
|
position: absolute;
|
|
|
|
left: 0;
|
2023-08-08 15:44:35 +08:00
|
|
|
top: 2.12rem;
|
2023-08-07 16:00:23 +08:00
|
|
|
text-align: center;
|
|
|
|
color: #E4797A;
|
|
|
|
font-size: 0.1466666667rem !important;
|
|
|
|
}
|
2023-08-08 15:44:35 +08:00
|
|
|
.page2 .blessingTree .openLantern .box b {
|
2023-08-07 16:00:23 +08:00
|
|
|
width: 100%;
|
|
|
|
position: absolute;
|
|
|
|
left: 0;
|
2023-08-08 15:44:35 +08:00
|
|
|
top: 2.3866666667rem;
|
2023-08-07 16:00:23 +08:00
|
|
|
text-align: center;
|
|
|
|
color: #E4797A;
|
|
|
|
font-size: 0.1466666667rem !important;
|
2023-08-07 14:56:02 +08:00
|
|
|
}
|
2023-08-11 19:02:15 +08:00
|
|
|
.page2 .blessingTree .blessingTreeSvga {
|
|
|
|
width: 1.4133333333rem;
|
|
|
|
height: 4.0666666667rem;
|
|
|
|
position: absolute;
|
|
|
|
z-index: 3;
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
.page2 .blessingTree .blessingTreeSvga .blessingTreeSvgaActive {
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
overflow: hidden;
|
|
|
|
}
|
|
|
|
.page2 .blessingTree .blessingTreeSvga .blessingTreeSvgaActive .canvas {
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
}
|
|
|
|
.page2 .blessingTree .blessingTreeSvga1 {
|
|
|
|
left: 0.92rem;
|
|
|
|
top: 4.8rem;
|
|
|
|
}
|
|
|
|
.page2 .blessingTree .blessingTreeSvga2 {
|
|
|
|
left: 2.9466666667rem;
|
|
|
|
top: 5.2666666667rem;
|
|
|
|
}
|
|
|
|
.page2 .blessingTree .blessingTreeSvga3 {
|
|
|
|
left: 5.12rem;
|
|
|
|
top: 4.4666666667rem;
|
|
|
|
}
|
|
|
|
.page2 .blessingTree .blessingTreeSvga4 {
|
|
|
|
left: 7.0133333333rem;
|
|
|
|
top: 5.1466666667rem;
|
|
|
|
}
|
2023-08-07 14:56:02 +08:00
|
|
|
.page2 .blessingTreeBoomt {
|
|
|
|
width: 9.28rem;
|
2023-08-16 17:38:20 +08:00
|
|
|
height: 11.2933333333rem;
|
2023-08-07 14:56:02 +08:00
|
|
|
background: url(../images/blessingTreeBoomt.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
margin: 0 auto;
|
|
|
|
}
|
2023-08-07 16:00:23 +08:00
|
|
|
.page2 .blessingTreeBoomt .tab {
|
|
|
|
width: 9.28rem;
|
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
|
|
height: 1.3rem;
|
|
|
|
margin: 0 auto;
|
|
|
|
}
|
|
|
|
.page2 .blessingTreeBoomt .tab div {
|
|
|
|
width: 50%;
|
|
|
|
}
|
2023-08-08 15:44:35 +08:00
|
|
|
.page2 .blessingTreeBoomt .box2 {
|
|
|
|
display: none;
|
|
|
|
}
|
2023-08-07 16:00:23 +08:00
|
|
|
.page2 .blessingTreeBoomt2 {
|
2023-08-16 17:38:20 +08:00
|
|
|
height: 8.2133333333rem;
|
2023-08-07 16:00:23 +08:00
|
|
|
background: url(../images/blessingTreeBoomt2.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
|
|
|
.page2 .blessingTreeBoomt2 .box2 {
|
2023-08-08 15:44:35 +08:00
|
|
|
display: block;
|
2023-08-07 16:00:23 +08:00
|
|
|
width: 8.2666666667rem;
|
|
|
|
height: 6.2666666667rem;
|
|
|
|
margin: 0.1333333333rem auto 0;
|
|
|
|
border-radius: 0.1333333333rem;
|
|
|
|
overflow: hidden;
|
|
|
|
}
|
|
|
|
.page2 .blessingTreeBoomt2 .box2 .title {
|
|
|
|
width: 8.2666666667rem;
|
|
|
|
height: 1.12rem;
|
|
|
|
line-height: 1.12rem;
|
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
|
|
background: #75009F;
|
|
|
|
}
|
|
|
|
.page2 .blessingTreeBoomt2 .box2 .title div {
|
|
|
|
width: 50%;
|
|
|
|
text-align: center;
|
|
|
|
color: #fff;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
}
|
|
|
|
.page2 .blessingTreeBoomt2 .box2 ul {
|
|
|
|
width: 8.2666666667rem;
|
|
|
|
height: 5.1rem;
|
|
|
|
margin: 0 auto;
|
|
|
|
overflow-y: scroll;
|
|
|
|
border-bottom-left-radius: 0.1333333333rem;
|
|
|
|
border-bottom-right-radius: 0.1333333333rem;
|
2023-08-08 15:44:35 +08:00
|
|
|
background: #9317B1;
|
2023-08-07 16:00:23 +08:00
|
|
|
}
|
|
|
|
.page2 .blessingTreeBoomt2 .box2 ul::-webkit-scrollbar {
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
.page2 .blessingTreeBoomt2 .box2 ul li {
|
|
|
|
width: 100%;
|
|
|
|
height: 1.2rem;
|
|
|
|
background: #9317B1;
|
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
|
|
}
|
|
|
|
.page2 .blessingTreeBoomt2 .box2 ul li div {
|
|
|
|
width: 50%;
|
|
|
|
text-align: center;
|
|
|
|
color: #FFD4F3;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding-top: 0.2rem;
|
|
|
|
}
|
|
|
|
.page2 .blessingTreeBoomt2 .box2 ul li div p {
|
|
|
|
width: 100%;
|
|
|
|
margin-bottom: 0.16rem;
|
|
|
|
}
|
|
|
|
.page2 .blessingTreeBoomt2 .box2 ul li div i {
|
|
|
|
font-size: 0.2666666667rem;
|
|
|
|
font-style: normal;
|
|
|
|
}
|
2023-08-11 19:02:15 +08:00
|
|
|
.page2 .blessingTreeBoomt2 .box2 ul li .b {
|
|
|
|
padding: 0;
|
|
|
|
height: 100%;
|
|
|
|
height: 1.2rem;
|
|
|
|
line-height: 1.2rem;
|
|
|
|
}
|
2023-08-07 16:00:23 +08:00
|
|
|
.page2 .blessingTreeBoomt2 .box2 ul .active {
|
|
|
|
background: #870EAA;
|
|
|
|
}
|
2023-08-07 14:56:02 +08:00
|
|
|
|
2023-08-08 15:44:35 +08:00
|
|
|
.page3 {
|
|
|
|
display: none;
|
|
|
|
padding-bottom: 0.76rem;
|
|
|
|
}
|
|
|
|
.page3 .roomRule {
|
|
|
|
position: fixed;
|
|
|
|
left: 0;
|
|
|
|
bottom: 0;
|
|
|
|
right: 0;
|
|
|
|
top: 0;
|
|
|
|
background: rgba(0, 0, 0, 0.4);
|
|
|
|
z-index: 99;
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
.page3 .roomRule .roomRule_in {
|
|
|
|
width: 7.3466666667rem;
|
|
|
|
height: 8.8666666667rem;
|
|
|
|
position: relative;
|
|
|
|
left: 50%;
|
|
|
|
top: 50%;
|
|
|
|
transform: translate(-50%, -50%);
|
|
|
|
}
|
|
|
|
.page3 .rule {
|
|
|
|
width: 0.56rem;
|
|
|
|
height: 1.8266666667rem;
|
|
|
|
box-sizing: border-box;
|
|
|
|
position: absolute;
|
|
|
|
right: 0;
|
|
|
|
top: 17.2rem;
|
|
|
|
text-align: center;
|
|
|
|
padding: 0.1466666667rem 0.08rem 0 0.1466666667rem;
|
|
|
|
font-size: 0.3466666667rem;
|
|
|
|
background: linear-gradient(90deg, #7776FF, #AE2CF1);
|
|
|
|
color: #F8F3FC;
|
|
|
|
}
|
|
|
|
.page3 .title {
|
|
|
|
width: 6.96rem;
|
|
|
|
height: 1.8rem;
|
|
|
|
margin: 0 auto 0rem;
|
|
|
|
display: block;
|
|
|
|
}
|
|
|
|
.page3 .titleText {
|
|
|
|
width: 100%;
|
|
|
|
text-align: center;
|
|
|
|
color: #fff;
|
|
|
|
font-size: 0.2933333333rem;
|
|
|
|
}
|
|
|
|
.page3 .no1 {
|
|
|
|
width: 3.8266666667rem;
|
|
|
|
height: 3.3733333333rem;
|
|
|
|
background: url(../images/no1Bg.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: 18.6rem;
|
|
|
|
}
|
|
|
|
.page3 .no1 .txBg {
|
|
|
|
width: 3.0933333333rem;
|
|
|
|
height: 2.3733333333rem;
|
|
|
|
z-index: 3;
|
|
|
|
position: absolute;
|
|
|
|
top: -1.1066666667rem;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
}
|
|
|
|
.page3 .no1 .tx {
|
|
|
|
width: 1.2666666667rem;
|
|
|
|
height: 1.2666666667rem;
|
|
|
|
border-radius: 50%;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: -0.5rem;
|
|
|
|
}
|
|
|
|
.page3 .no1 p {
|
2023-08-09 18:29:45 +08:00
|
|
|
width: 76%;
|
2023-08-08 15:44:35 +08:00
|
|
|
text-align: center;
|
|
|
|
overflow: hidden;
|
|
|
|
white-space: nowrap;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
position: absolute;
|
2023-08-09 18:29:45 +08:00
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
2023-08-08 15:44:35 +08:00
|
|
|
top: 1.56rem;
|
|
|
|
color: #fff;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
}
|
|
|
|
.page3 .no1 div {
|
|
|
|
min-width: 2.4rem;
|
|
|
|
height: 0.5333333333rem;
|
|
|
|
line-height: 0.2666666667rem;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding: 0.1333333333rem 0.2133333333rem;
|
|
|
|
border-radius: 0.5333333333rem;
|
|
|
|
background: linear-gradient(90deg, #7A1183, #4F279F);
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: 2.0533333333rem;
|
|
|
|
white-space: nowrap;
|
|
|
|
font-size: 0.2666666667rem;
|
|
|
|
color: #FFFFFF;
|
|
|
|
vertical-align: middle;
|
|
|
|
}
|
|
|
|
.page3 .no1 div .loveIcon {
|
|
|
|
width: 0.3333333333rem;
|
|
|
|
height: 0.28rem;
|
|
|
|
margin-right: 0.1066666667rem;
|
|
|
|
}
|
|
|
|
.page3 .no2 {
|
|
|
|
width: 3.3733333333rem;
|
|
|
|
height: 2.7733333333rem;
|
|
|
|
background: url(../images/no23Bg.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
position: absolute;
|
|
|
|
left: 0.1333333333rem;
|
|
|
|
top: 19.7rem;
|
|
|
|
}
|
|
|
|
.page3 .no2 .txBg {
|
|
|
|
width: 2.72rem;
|
|
|
|
height: 2.08rem;
|
|
|
|
z-index: 3;
|
|
|
|
position: absolute;
|
|
|
|
top: -1.1066666667rem;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
}
|
|
|
|
.page3 .no2 .tx {
|
|
|
|
width: 1.1066666667rem;
|
|
|
|
height: 1.1066666667rem;
|
|
|
|
border-radius: 50%;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: -0.55rem;
|
|
|
|
}
|
|
|
|
.page3 .no2 p {
|
2023-08-09 18:29:45 +08:00
|
|
|
width: 76%;
|
2023-08-08 15:44:35 +08:00
|
|
|
text-align: center;
|
|
|
|
overflow: hidden;
|
|
|
|
white-space: nowrap;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
position: absolute;
|
2023-08-09 18:29:45 +08:00
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
2023-08-08 15:44:35 +08:00
|
|
|
top: 1.2933333333rem;
|
|
|
|
color: #fff;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
}
|
|
|
|
.page3 .no2 div {
|
|
|
|
min-width: 2.4rem;
|
|
|
|
height: 0.5333333333rem;
|
|
|
|
line-height: 0.2666666667rem;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding: 0.1333333333rem 0.2133333333rem;
|
|
|
|
border-radius: 0.5333333333rem;
|
|
|
|
background: linear-gradient(90deg, #7A1183, #4F279F);
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: 1.7333333333rem;
|
|
|
|
white-space: nowrap;
|
|
|
|
font-size: 0.24rem;
|
|
|
|
color: #FFFFFF;
|
|
|
|
vertical-align: middle;
|
|
|
|
}
|
|
|
|
.page3 .no2 div .loveIcon {
|
|
|
|
width: 0.3333333333rem;
|
|
|
|
height: 0.28rem;
|
|
|
|
margin-right: 0.1066666667rem;
|
|
|
|
}
|
|
|
|
.page3 .no3 {
|
|
|
|
width: 3.3733333333rem;
|
|
|
|
height: 2.7733333333rem;
|
|
|
|
background: url(../images/no23Bg.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
position: absolute;
|
|
|
|
right: 0.1333333333rem;
|
|
|
|
top: 19.7rem;
|
|
|
|
}
|
|
|
|
.page3 .no3 .txBg {
|
|
|
|
width: 2.72rem;
|
|
|
|
height: 2.08rem;
|
|
|
|
z-index: 3;
|
|
|
|
position: absolute;
|
|
|
|
top: -1.1066666667rem;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
}
|
|
|
|
.page3 .no3 .tx {
|
|
|
|
width: 1.1066666667rem;
|
|
|
|
height: 1.1066666667rem;
|
|
|
|
border-radius: 50%;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: -0.55rem;
|
|
|
|
}
|
|
|
|
.page3 .no3 p {
|
2023-08-09 18:29:45 +08:00
|
|
|
width: 76%;
|
2023-08-08 15:44:35 +08:00
|
|
|
text-align: center;
|
|
|
|
overflow: hidden;
|
|
|
|
white-space: nowrap;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
position: absolute;
|
2023-08-09 18:29:45 +08:00
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
2023-08-08 15:44:35 +08:00
|
|
|
top: 1.2933333333rem;
|
|
|
|
color: #fff;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
}
|
|
|
|
.page3 .no3 div {
|
|
|
|
min-width: 2.4rem;
|
|
|
|
height: 0.5333333333rem;
|
|
|
|
line-height: 0.2666666667rem;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding: 0.1333333333rem 0.2133333333rem;
|
|
|
|
border-radius: 0.5333333333rem;
|
|
|
|
background: linear-gradient(90deg, #7A1183, #4F279F);
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: 1.7333333333rem;
|
|
|
|
white-space: nowrap;
|
|
|
|
font-size: 0.24rem;
|
|
|
|
color: #FFFFFF;
|
|
|
|
vertical-align: middle;
|
|
|
|
}
|
|
|
|
.page3 .no3 div .loveIcon {
|
|
|
|
width: 0.3333333333rem;
|
|
|
|
height: 0.28rem;
|
|
|
|
margin-right: 0.1066666667rem;
|
|
|
|
}
|
|
|
|
.page3 ul {
|
|
|
|
width: 9.9066666667rem;
|
2023-08-09 18:29:45 +08:00
|
|
|
margin: 6rem auto 1.4rem;
|
|
|
|
min-height: 1rem;
|
2023-08-08 15:44:35 +08:00
|
|
|
}
|
|
|
|
.page3 ul li {
|
|
|
|
width: 100%;
|
|
|
|
height: 1.96rem;
|
|
|
|
margin: 0 auto 0.2rem;
|
|
|
|
background: url(../images/page3Libg.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding: 0 0.8rem;
|
|
|
|
overflow: hidden;
|
2023-08-18 18:49:05 +08:00
|
|
|
display: flex;
|
2023-08-08 15:44:35 +08:00
|
|
|
}
|
|
|
|
.page3 ul li .num {
|
|
|
|
width: 0.8rem;
|
|
|
|
text-align: center;
|
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.48rem;
|
|
|
|
font-weight: bold;
|
|
|
|
float: left;
|
|
|
|
margin-right: 0.2933333333rem;
|
|
|
|
height: 100%;
|
|
|
|
line-height: 1.96rem;
|
|
|
|
}
|
|
|
|
.page3 ul li .tx {
|
|
|
|
width: 1.2666666667rem;
|
|
|
|
height: 1.2666666667rem;
|
|
|
|
border-radius: 50%;
|
|
|
|
background: #fff;
|
|
|
|
margin-right: 0.3333333333rem;
|
|
|
|
margin-top: 0.3466666667rem;
|
|
|
|
float: left;
|
|
|
|
}
|
|
|
|
.page3 ul li .name {
|
|
|
|
width: 2.5rem;
|
|
|
|
height: 100%;
|
|
|
|
line-height: 1.96rem;
|
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
overflow: hidden;
|
|
|
|
white-space: nowrap;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
float: left;
|
|
|
|
}
|
|
|
|
.page3 ul li .score {
|
|
|
|
min-width: 1.6133333333rem;
|
|
|
|
width: auto;
|
|
|
|
height: 0.5333333333rem;
|
|
|
|
line-height: 0.2666666667rem;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding: 0.1333333333rem 0.2133333333rem;
|
|
|
|
border-radius: 0.5333333333rem;
|
|
|
|
background: linear-gradient(90deg, #7A1183, #4F279F);
|
|
|
|
white-space: nowrap;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
color: #FFFFFF;
|
|
|
|
vertical-align: middle;
|
|
|
|
float: right;
|
|
|
|
margin-top: 0.7066666667rem;
|
|
|
|
}
|
|
|
|
.page3 ul li .score .loveIcon {
|
|
|
|
width: 0.3333333333rem;
|
|
|
|
height: 0.28rem;
|
|
|
|
margin-right: 0.1066666667rem;
|
|
|
|
}
|
2023-08-09 18:29:45 +08:00
|
|
|
.page3 .my {
|
|
|
|
position: fixed;
|
|
|
|
bottom: 0;
|
|
|
|
left: 0;
|
|
|
|
width: 100%;
|
|
|
|
height: 1.96rem;
|
|
|
|
background: url(../images/myBg.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding: 0 0.64rem 0 0.2666666667rem;
|
|
|
|
overflow: hidden;
|
|
|
|
z-index: 9;
|
2023-08-18 18:49:05 +08:00
|
|
|
display: flex;
|
2023-08-09 18:29:45 +08:00
|
|
|
}
|
|
|
|
.page3 .my .num {
|
|
|
|
width: 1.6rem;
|
|
|
|
text-align: center;
|
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.48rem;
|
|
|
|
font-weight: bold;
|
|
|
|
float: left;
|
|
|
|
margin-right: 0.2933333333rem;
|
|
|
|
height: 100%;
|
|
|
|
line-height: 1.96rem;
|
|
|
|
}
|
|
|
|
.page3 .my .tx {
|
|
|
|
width: 1.2666666667rem;
|
|
|
|
height: 1.2666666667rem;
|
|
|
|
border-radius: 50%;
|
|
|
|
background: #fff;
|
|
|
|
margin-right: 0.3333333333rem;
|
|
|
|
margin-top: 0.3466666667rem;
|
|
|
|
float: left;
|
|
|
|
}
|
|
|
|
.page3 .my .name {
|
|
|
|
width: 2.3rem;
|
|
|
|
height: 100%;
|
|
|
|
line-height: 1.96rem;
|
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
overflow: hidden;
|
|
|
|
white-space: nowrap;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
float: left;
|
|
|
|
}
|
|
|
|
.page3 .my .score {
|
|
|
|
min-width: 1.6133333333rem;
|
|
|
|
width: auto;
|
|
|
|
height: 0.5333333333rem;
|
|
|
|
line-height: 0.2666666667rem;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding: 0.1333333333rem 0.2133333333rem;
|
|
|
|
border-radius: 0.5333333333rem;
|
|
|
|
background: linear-gradient(90deg, #7A1183, #4F279F);
|
|
|
|
white-space: nowrap;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
color: #FFFFFF;
|
|
|
|
vertical-align: middle;
|
|
|
|
float: right;
|
|
|
|
margin-top: 0.7066666667rem;
|
|
|
|
}
|
|
|
|
.page3 .my .score .loveIcon {
|
|
|
|
width: 0.3333333333rem;
|
|
|
|
height: 0.28rem;
|
|
|
|
margin-right: 0.1066666667rem;
|
|
|
|
}
|
2023-08-08 15:44:35 +08:00
|
|
|
|
|
|
|
.page4 {
|
|
|
|
display: none;
|
|
|
|
padding-bottom: 0.76rem;
|
|
|
|
}
|
|
|
|
.page4 .rule {
|
|
|
|
width: 0.56rem;
|
|
|
|
height: 1.8266666667rem;
|
|
|
|
box-sizing: border-box;
|
|
|
|
position: absolute;
|
|
|
|
right: 0;
|
|
|
|
top: 27.4rem;
|
|
|
|
text-align: center;
|
|
|
|
padding: 0.1466666667rem 0.08rem 0 0.1466666667rem;
|
|
|
|
font-size: 0.3466666667rem;
|
|
|
|
background: linear-gradient(90deg, #7776FF, #AE2CF1);
|
|
|
|
color: #F8F3FC;
|
|
|
|
}
|
|
|
|
.page4 .loveList {
|
|
|
|
width: 9.3333333333rem;
|
|
|
|
height: 7.4933333333rem;
|
|
|
|
background: url(../images/loveListTimeBg.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
margin: 0 auto 0.4666666667rem;
|
|
|
|
position: relative;
|
|
|
|
}
|
2023-08-11 10:36:56 +08:00
|
|
|
.page4 .loveList .leftName {
|
|
|
|
width: 2rem;
|
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
position: absolute;
|
|
|
|
top: 4.2533333333rem;
|
|
|
|
left: 2.3rem;
|
|
|
|
text-align: center;
|
|
|
|
overflow: hidden;
|
|
|
|
white-space: nowrap;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
}
|
|
|
|
.page4 .loveList .rightName {
|
|
|
|
width: 2rem;
|
|
|
|
color: #CA56A9;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
position: absolute;
|
|
|
|
top: 4.2533333333rem;
|
|
|
|
right: 2.3rem;
|
|
|
|
text-align: center;
|
|
|
|
overflow: hidden;
|
|
|
|
white-space: nowrap;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
}
|
2023-08-08 15:44:35 +08:00
|
|
|
.page4 .loveList .left {
|
|
|
|
width: 3.0666666667rem;
|
|
|
|
height: 2.44rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 0.92rem;
|
|
|
|
top: 1.6666666667rem;
|
|
|
|
z-index: 2;
|
|
|
|
}
|
|
|
|
.page4 .loveList .right {
|
|
|
|
width: 3.0666666667rem;
|
|
|
|
height: 2.44rem;
|
|
|
|
position: absolute;
|
|
|
|
right: 0.92rem;
|
|
|
|
top: 1.6666666667rem;
|
|
|
|
z-index: 2;
|
|
|
|
}
|
|
|
|
.page4 .loveList .center {
|
|
|
|
width: 0.84rem;
|
|
|
|
height: 0.76rem;
|
|
|
|
position: absolute;
|
|
|
|
right: 4.2533333333rem;
|
|
|
|
top: 2.5333333333rem;
|
|
|
|
}
|
|
|
|
.page4 .loveList p {
|
|
|
|
color: #CA56A9;
|
|
|
|
width: 100%;
|
|
|
|
text-align: center;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 0;
|
|
|
|
top: 5.0933333333rem;
|
|
|
|
}
|
|
|
|
.page4 .loveList .times {
|
|
|
|
width: 100%;
|
|
|
|
text-align: center;
|
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.3733333333rem;
|
|
|
|
height: 0.6666666667rem;
|
|
|
|
line-height: 0.6666666667rem;
|
|
|
|
position: absolute;
|
|
|
|
left: 0;
|
|
|
|
top: 6.4933333333rem;
|
|
|
|
}
|
|
|
|
.page4 .loveList .times span {
|
|
|
|
width: 0.6666666667rem;
|
|
|
|
height: 0.6666666667rem;
|
|
|
|
text-align: center;
|
|
|
|
background: #7F0770;
|
|
|
|
border-radius: 0.1333333333rem;
|
|
|
|
display: inline-block;
|
|
|
|
margin: 0 0.1733333333rem;
|
|
|
|
}
|
|
|
|
.page4 .loveList .txL {
|
|
|
|
width: 1.3333333333rem;
|
|
|
|
height: 1.3333333333rem;
|
|
|
|
border-radius: 50%;
|
|
|
|
position: absolute;
|
|
|
|
left: 2.62rem;
|
|
|
|
top: 2.3066666667rem;
|
|
|
|
}
|
|
|
|
.page4 .loveList .txR {
|
|
|
|
width: 1.3333333333rem;
|
|
|
|
height: 1.3333333333rem;
|
|
|
|
border-radius: 50%;
|
|
|
|
position: absolute;
|
|
|
|
right: 2.62rem;
|
|
|
|
top: 2.3066666667rem;
|
|
|
|
}
|
|
|
|
.page4 .page4Tab {
|
|
|
|
width: 10rem;
|
|
|
|
height: 1.5066666667rem;
|
|
|
|
margin: 0 auto 0.36rem;
|
|
|
|
background: url(../images/page4Tab1.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
|
|
}
|
|
|
|
.page4 .page4Tab div {
|
|
|
|
width: 50%;
|
|
|
|
}
|
|
|
|
.page4 .page4Tab2 {
|
|
|
|
background: url(../images/page4Tab2.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
|
|
|
.page4 .dayAll {
|
|
|
|
width: 7.8133333333rem;
|
|
|
|
height: 0.8533333333rem;
|
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
|
|
margin: 0 auto 0.4rem;
|
|
|
|
background: url(../images/pagesTab1.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
|
|
|
.page4 .dayAll div {
|
|
|
|
width: 50%;
|
|
|
|
}
|
|
|
|
.page4 .dayAll2 {
|
|
|
|
background: url(../images/pagesTab2.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
}
|
|
|
|
.page4 .giftVal {
|
|
|
|
width: 100%;
|
|
|
|
text-align: center;
|
2023-08-15 17:36:17 +08:00
|
|
|
margin: 0.8rem auto 0.4rem;
|
2023-08-08 15:44:35 +08:00
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
}
|
|
|
|
.page4 .timeList {
|
|
|
|
width: 100%;
|
|
|
|
display: flex;
|
|
|
|
justify-content: center;
|
|
|
|
}
|
|
|
|
.page4 .timeList div {
|
|
|
|
width: 0.9733333333rem;
|
|
|
|
height: 0.4533333333rem;
|
|
|
|
line-height: 0.4533333333rem;
|
|
|
|
background: #770F80;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
color: #fff;
|
|
|
|
margin: 0 0.24rem;
|
|
|
|
text-align: center;
|
|
|
|
border-radius: 0.1333333333rem;
|
|
|
|
}
|
|
|
|
.page4 .timeList .active {
|
|
|
|
background: #C238A6;
|
|
|
|
}
|
|
|
|
.page4 .no1 {
|
|
|
|
width: 3.8266666667rem;
|
|
|
|
height: 3.3733333333rem;
|
|
|
|
background: url(../images/no1Bg.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: 28.9rem;
|
|
|
|
}
|
|
|
|
.page4 .no1 .txBg {
|
|
|
|
width: 3.0933333333rem;
|
|
|
|
height: 2.3733333333rem;
|
|
|
|
z-index: 3;
|
|
|
|
position: absolute;
|
|
|
|
top: -1.1066666667rem;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
}
|
|
|
|
.page4 .no1 .tx {
|
|
|
|
width: 1.2666666667rem;
|
|
|
|
height: 1.2666666667rem;
|
|
|
|
border-radius: 50%;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: -0.5rem;
|
|
|
|
}
|
|
|
|
.page4 .no1 p {
|
2023-08-09 18:29:45 +08:00
|
|
|
width: 76%;
|
2023-08-08 15:44:35 +08:00
|
|
|
text-align: center;
|
|
|
|
overflow: hidden;
|
|
|
|
white-space: nowrap;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
position: absolute;
|
2023-08-09 18:29:45 +08:00
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
2023-08-08 15:44:35 +08:00
|
|
|
top: 1.56rem;
|
|
|
|
color: #fff;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
}
|
|
|
|
.page4 .no1 div {
|
|
|
|
min-width: 2.4rem;
|
|
|
|
height: 0.5333333333rem;
|
|
|
|
line-height: 0.2666666667rem;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding: 0.1333333333rem 0.2133333333rem;
|
|
|
|
border-radius: 0.5333333333rem;
|
|
|
|
background: linear-gradient(90deg, #7A1183, #4F279F);
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: 2.0533333333rem;
|
|
|
|
white-space: nowrap;
|
|
|
|
font-size: 0.2666666667rem;
|
|
|
|
color: #FFFFFF;
|
|
|
|
vertical-align: middle;
|
|
|
|
}
|
|
|
|
.page4 .no1 div .loveIcon {
|
|
|
|
width: 0.3333333333rem;
|
|
|
|
height: 0.28rem;
|
|
|
|
margin-right: 0.1066666667rem;
|
|
|
|
}
|
|
|
|
.page4 .no2 {
|
|
|
|
width: 3.3733333333rem;
|
|
|
|
height: 2.7733333333rem;
|
|
|
|
background: url(../images/no23Bg.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
position: absolute;
|
|
|
|
left: 0.1333333333rem;
|
|
|
|
top: 29.9rem;
|
|
|
|
}
|
|
|
|
.page4 .no2 .txBg {
|
|
|
|
width: 2.72rem;
|
|
|
|
height: 2.08rem;
|
|
|
|
z-index: 3;
|
|
|
|
position: absolute;
|
|
|
|
top: -1.1066666667rem;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
}
|
|
|
|
.page4 .no2 .tx {
|
|
|
|
width: 1.1066666667rem;
|
|
|
|
height: 1.1066666667rem;
|
|
|
|
border-radius: 50%;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: -0.55rem;
|
|
|
|
}
|
|
|
|
.page4 .no2 p {
|
2023-08-09 18:29:45 +08:00
|
|
|
width: 76%;
|
2023-08-08 15:44:35 +08:00
|
|
|
text-align: center;
|
|
|
|
overflow: hidden;
|
|
|
|
white-space: nowrap;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
position: absolute;
|
2023-08-09 18:29:45 +08:00
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
2023-08-08 15:44:35 +08:00
|
|
|
top: 1.2933333333rem;
|
|
|
|
color: #fff;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
}
|
|
|
|
.page4 .no2 div {
|
|
|
|
min-width: 2.4rem;
|
|
|
|
height: 0.5333333333rem;
|
|
|
|
line-height: 0.2666666667rem;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding: 0.1333333333rem 0.2133333333rem;
|
|
|
|
border-radius: 0.5333333333rem;
|
|
|
|
background: linear-gradient(90deg, #7A1183, #4F279F);
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: 1.7333333333rem;
|
|
|
|
white-space: nowrap;
|
|
|
|
font-size: 0.24rem;
|
|
|
|
color: #FFFFFF;
|
|
|
|
vertical-align: middle;
|
|
|
|
}
|
|
|
|
.page4 .no2 div .loveIcon {
|
|
|
|
width: 0.3333333333rem;
|
|
|
|
height: 0.28rem;
|
|
|
|
margin-right: 0.1066666667rem;
|
|
|
|
}
|
|
|
|
.page4 .no3 {
|
|
|
|
width: 3.3733333333rem;
|
|
|
|
height: 2.7733333333rem;
|
|
|
|
background: url(../images/no23Bg.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
position: absolute;
|
|
|
|
right: 0.1333333333rem;
|
|
|
|
top: 29.9rem;
|
|
|
|
}
|
|
|
|
.page4 .no3 .txBg {
|
|
|
|
width: 2.72rem;
|
|
|
|
height: 2.08rem;
|
|
|
|
z-index: 3;
|
|
|
|
position: absolute;
|
|
|
|
top: -1.1066666667rem;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
}
|
|
|
|
.page4 .no3 .tx {
|
|
|
|
width: 1.1066666667rem;
|
|
|
|
height: 1.1066666667rem;
|
|
|
|
border-radius: 50%;
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: -0.55rem;
|
|
|
|
}
|
|
|
|
.page4 .no3 p {
|
2023-08-09 18:29:45 +08:00
|
|
|
width: 76%;
|
2023-08-08 15:44:35 +08:00
|
|
|
text-align: center;
|
|
|
|
overflow: hidden;
|
|
|
|
white-space: nowrap;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
position: absolute;
|
2023-08-09 18:29:45 +08:00
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
2023-08-08 15:44:35 +08:00
|
|
|
top: 1.2933333333rem;
|
|
|
|
color: #fff;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
}
|
|
|
|
.page4 .no3 div {
|
|
|
|
min-width: 2.4rem;
|
|
|
|
height: 0.5333333333rem;
|
|
|
|
line-height: 0.2666666667rem;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding: 0.1333333333rem 0.2133333333rem;
|
|
|
|
border-radius: 0.5333333333rem;
|
|
|
|
background: linear-gradient(90deg, #7A1183, #4F279F);
|
|
|
|
position: absolute;
|
|
|
|
left: 50%;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
top: 1.7333333333rem;
|
|
|
|
white-space: nowrap;
|
|
|
|
font-size: 0.24rem;
|
|
|
|
color: #FFFFFF;
|
|
|
|
vertical-align: middle;
|
|
|
|
}
|
|
|
|
.page4 .no3 div .loveIcon {
|
|
|
|
width: 0.3333333333rem;
|
|
|
|
height: 0.28rem;
|
|
|
|
margin-right: 0.1066666667rem;
|
|
|
|
}
|
|
|
|
.page4 ul {
|
|
|
|
width: 9.9066666667rem;
|
2023-08-09 18:29:45 +08:00
|
|
|
margin: 6rem auto 2rem;
|
|
|
|
min-height: 1rem;
|
2023-08-08 15:44:35 +08:00
|
|
|
}
|
|
|
|
.page4 ul li {
|
|
|
|
width: 100%;
|
|
|
|
height: 1.96rem;
|
|
|
|
margin: 0 auto 0.2rem;
|
|
|
|
background: url(../images/page3Libg.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding: 0 0.8rem;
|
|
|
|
overflow: hidden;
|
2023-08-18 18:49:05 +08:00
|
|
|
display: flex;
|
2023-08-08 15:44:35 +08:00
|
|
|
}
|
|
|
|
.page4 ul li .num {
|
|
|
|
width: 0.8rem;
|
|
|
|
text-align: center;
|
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.48rem;
|
|
|
|
font-weight: bold;
|
|
|
|
float: left;
|
|
|
|
margin-right: 0.2933333333rem;
|
|
|
|
height: 100%;
|
|
|
|
line-height: 1.96rem;
|
|
|
|
}
|
|
|
|
.page4 ul li .tx {
|
|
|
|
width: 1.2666666667rem;
|
|
|
|
height: 1.2666666667rem;
|
|
|
|
border-radius: 50%;
|
|
|
|
background: #fff;
|
|
|
|
margin-right: 0.3333333333rem;
|
|
|
|
margin-top: 0.3466666667rem;
|
|
|
|
float: left;
|
|
|
|
}
|
|
|
|
.page4 ul li .name {
|
|
|
|
width: 2.5rem;
|
|
|
|
height: 100%;
|
|
|
|
line-height: 1.96rem;
|
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
overflow: hidden;
|
|
|
|
white-space: nowrap;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
float: left;
|
|
|
|
}
|
|
|
|
.page4 ul li .score {
|
|
|
|
min-width: 1.6133333333rem;
|
|
|
|
width: auto;
|
|
|
|
height: 0.5333333333rem;
|
|
|
|
line-height: 0.2666666667rem;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding: 0.1333333333rem 0.2133333333rem;
|
|
|
|
border-radius: 0.5333333333rem;
|
|
|
|
background: linear-gradient(90deg, #7A1183, #4F279F);
|
|
|
|
white-space: nowrap;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
color: #FFFFFF;
|
|
|
|
vertical-align: middle;
|
|
|
|
float: right;
|
|
|
|
margin-top: 0.7066666667rem;
|
|
|
|
}
|
|
|
|
.page4 ul li .score .loveIcon {
|
|
|
|
width: 0.3333333333rem;
|
|
|
|
height: 0.28rem;
|
|
|
|
margin-right: 0.1066666667rem;
|
|
|
|
}
|
|
|
|
.page4 .my {
|
|
|
|
position: fixed;
|
|
|
|
bottom: 0;
|
|
|
|
left: 0;
|
|
|
|
width: 100%;
|
|
|
|
height: 1.96rem;
|
|
|
|
background: url(../images/myBg.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding: 0 0.64rem 0 0.2666666667rem;
|
|
|
|
overflow: hidden;
|
|
|
|
z-index: 9;
|
2023-08-18 18:49:05 +08:00
|
|
|
display: flex;
|
2023-08-08 15:44:35 +08:00
|
|
|
}
|
|
|
|
.page4 .my .num {
|
|
|
|
width: 1.6rem;
|
|
|
|
text-align: center;
|
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.48rem;
|
|
|
|
font-weight: bold;
|
|
|
|
float: left;
|
|
|
|
margin-right: 0.2933333333rem;
|
|
|
|
height: 100%;
|
|
|
|
line-height: 1.96rem;
|
|
|
|
}
|
|
|
|
.page4 .my .tx {
|
|
|
|
width: 1.2666666667rem;
|
|
|
|
height: 1.2666666667rem;
|
|
|
|
border-radius: 50%;
|
|
|
|
background: #fff;
|
|
|
|
margin-right: 0.3333333333rem;
|
|
|
|
margin-top: 0.3466666667rem;
|
|
|
|
float: left;
|
|
|
|
}
|
|
|
|
.page4 .my .name {
|
|
|
|
width: 2.3rem;
|
|
|
|
height: 100%;
|
|
|
|
line-height: 1.96rem;
|
|
|
|
color: #FFFFFF;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
overflow: hidden;
|
|
|
|
white-space: nowrap;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
float: left;
|
|
|
|
}
|
|
|
|
.page4 .my .score {
|
|
|
|
min-width: 1.6133333333rem;
|
|
|
|
width: auto;
|
|
|
|
height: 0.5333333333rem;
|
|
|
|
line-height: 0.2666666667rem;
|
|
|
|
box-sizing: border-box;
|
|
|
|
padding: 0.1333333333rem 0.2133333333rem;
|
|
|
|
border-radius: 0.5333333333rem;
|
|
|
|
background: linear-gradient(90deg, #7A1183, #4F279F);
|
|
|
|
white-space: nowrap;
|
|
|
|
font-size: 0.32rem;
|
|
|
|
color: #FFFFFF;
|
|
|
|
vertical-align: middle;
|
|
|
|
float: right;
|
|
|
|
margin-top: 0.7066666667rem;
|
|
|
|
}
|
|
|
|
.page4 .my .score .loveIcon {
|
|
|
|
width: 0.3333333333rem;
|
|
|
|
height: 0.28rem;
|
|
|
|
margin-right: 0.1066666667rem;
|
|
|
|
}
|
|
|
|
.page4 .sweet {
|
|
|
|
position: fixed;
|
|
|
|
left: 0;
|
|
|
|
bottom: 0;
|
|
|
|
right: 0;
|
|
|
|
top: 0;
|
|
|
|
background: rgba(0, 0, 0, 0.4);
|
|
|
|
z-index: 99;
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
.page4 .sweet .sweet_in {
|
|
|
|
width: 8.5866666667rem;
|
|
|
|
height: 11.7066666667rem;
|
|
|
|
position: relative;
|
|
|
|
left: 50%;
|
|
|
|
top: 50%;
|
|
|
|
transform: translate(-50%, -50%);
|
|
|
|
background: url(../images/sweet.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
overflow: hidden;
|
|
|
|
}
|
|
|
|
.page4 .sweet .sweet_in .box {
|
|
|
|
width: 7.3066666667rem;
|
|
|
|
height: 9.6rem;
|
|
|
|
margin: 1.96rem auto 0;
|
|
|
|
overflow-y: scroll;
|
|
|
|
}
|
|
|
|
.page4 .sweet .sweet_in .box::-webkit-scrollbar {
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
.page4 .sweet .sweet_in .box img {
|
|
|
|
width: 100%;
|
|
|
|
height: 23.48rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
.rule_pub {
|
|
|
|
position: fixed;
|
|
|
|
left: 0;
|
|
|
|
bottom: 0;
|
|
|
|
right: 0;
|
|
|
|
top: 0;
|
|
|
|
background: rgba(0, 0, 0, 0.4);
|
|
|
|
z-index: 99;
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
.rule_pub .rule_pub_in {
|
|
|
|
width: 8.5866666667rem;
|
|
|
|
height: 11.9733333333rem;
|
|
|
|
position: relative;
|
|
|
|
left: 50%;
|
|
|
|
top: 50%;
|
|
|
|
transform: translate(-50%, -50%);
|
|
|
|
background: url(../images/rule_pub.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
overflow: hidden;
|
|
|
|
}
|
|
|
|
.rule_pub .rule_pub_in .box {
|
|
|
|
width: 7.76rem;
|
|
|
|
height: 9.6rem;
|
|
|
|
margin: 2.08rem auto 0;
|
|
|
|
overflow-y: scroll;
|
|
|
|
}
|
|
|
|
.rule_pub .rule_pub_in .box::-webkit-scrollbar {
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
.rule_pub .rule_pub_in .box img {
|
|
|
|
width: 100%;
|
|
|
|
height: 22.5466666667rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
.endActivity {
|
|
|
|
position: fixed;
|
|
|
|
left: 0;
|
|
|
|
bottom: 0;
|
|
|
|
right: 0;
|
|
|
|
top: 0;
|
|
|
|
background: rgba(0, 0, 0, 0.4);
|
|
|
|
z-index: 99;
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
.endActivity .endActivity_in {
|
|
|
|
width: 6rem;
|
|
|
|
height: 4.76rem;
|
|
|
|
position: relative;
|
|
|
|
left: 50%;
|
|
|
|
top: 50%;
|
|
|
|
transform: translate(-50%, -50%);
|
|
|
|
background: url(../images/endActivity.png) no-repeat;
|
|
|
|
background-size: 100% 100%;
|
|
|
|
overflow: hidden;
|
|
|
|
}
|
|
|
|
.endActivity .endActivity_in .but {
|
|
|
|
position: absolute;
|
|
|
|
width: 3.2rem;
|
|
|
|
height: 0.8rem;
|
|
|
|
left: 50%;
|
|
|
|
top: 3.3333333333rem;
|
|
|
|
transform: translateX(-50%);
|
|
|
|
}
|
|
|
|
|
2023-07-31 11:28:48 +08:00
|
|
|
/*# sourceMappingURL=index.css.map */
|