body {-webkit-user-select: unset;}
.wrapper {
    margin: 0 auto;
    padding-top: 8.8rem;
    width: 7.5rem;
    height: 47.78rem;
    background-image: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/bg_task.jpg");
    font-family: 'fengzheng-ys';
    font-size: .28rem;
    color: #fef0b9;
    overflow: hidden;
    box-sizing: border-box;
}

.float-top {
    top: 0;
    left: 50%;
    padding: 0 .2rem 0 .15rem;
    width: 7.5rem;
    height: 1.5rem;
    background: -webkit-linear-gradient(#11445f 80%, rgba(17, 68, 95, .5));
    background: linear-gradient(#11445f 80%, rgba(17, 68, 95, .5));
    color: #fff;
    font-size: .4rem;
    z-index: 99;
    box-sizing: border-box;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.float-top .logo-top {
    margin-right: .15rem;
}

.float-top .logo-top img {
    width: 1.1rem;
}

.float-top .desc {
    display: block;
    font-size: .2rem;
}

.float-top .btn-download-top {
    width: 2.27rem;
    height: .93rem;
    background-image: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/btn_download_top.png");
}

.logo {
    top: 1.7rem;
    left: .1rem;
    width: 2.24rem;
    height: .95rem;
    background-image: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/logo.png");
}

.float-list {
    top: 1.8rem;
    right: .2rem;
    -webkit-flex-flow: column;
    flex-flow: column;
    gap: .25rem;
}

.float-list [class*="ico-"] {
    width: .85rem;
    height: .72rem;
}

.float-list .ico-service {
    background-image: url("//png.pookcdn.net/new_net/bydrqp/activity_2/ico_service.png");
}

.float-list .ico-ruler {
    background-image: url("//png.pookcdn.net/new_net/bydrqp/activity_2/ico_ruler.png");
}

.float-list .ico-login {
    background-image: url("//png.pookcdn.net/new_net/bydrqp/activity_2/ico_login.png");
}

.btn-download-center {
    margin: 0 auto;
    width: 4.62rem;
    height: 1.22rem;
    background-image: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/btn_download.png");
}

.user-info {
    margin-top: .3rem;
    text-align: center;
}

.user-info .user-name {
    color: #15c2bc;
    font-size: .36rem;
}

.user-info .btn-exchange {
    margin: 0 auto;
    text-decoration: underline;
}

.item-title {
    text-align: center;
}

.item-title img {
    height: 1.27rem;
}

.sub-title {
    margin-top: .1rem;
    font-size: .2rem;
    color: #c1fffe;
    text-align: center;
}

.item-task .task-list,
.item-task .task-progress {
    margin-top: -.1rem;
    padding-top: .8rem;
    width: 7.49rem;
    height: 4.39rem;
    background-image: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/bg_task_info.png");
    box-sizing: border-box;
    color: #684a2b;
}

.item-task .task-list .item-li {
    margin-left: 1.5rem;
    width: 5.42rem;
    height: .75rem;
    font-size: .26rem;
}

.item-task .task-list .item-li::before {
    content: "";
    position: absolute;
    left: -.4rem;
    width: .24rem;
    height: .24rem;
    background: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/ico_task_before.png") no-repeat;
    background-size: 100% 100%;
}

.item-task .task-list .item-li::after {
    content: "";
    position: absolute;
    left: -.1rem;
    bottom: 0;
    width: 5.4rem;
    height: .08rem;
    background: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/bg_task_after.png") no-repeat;
    background-size: 100% 100%;
}

.item-task .task-list li:last-child::after {
    background: none;
}

.item-task .task-list .item-li .con-left span,
.task-progress .task-name span,
.progress .progress-text span,
.award-list .award-item .award-name span {
    color: #FE5C09;
}

.item-task .task-tips {
    margin-top: .3rem;
    color: #2c7180;
    font-size: .2rem;
    text-align: center;
}

.btn-open {
    margin-right: .1rem;
    width: 1.72rem;
    height: .6rem;
    background-image: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/btn_open.png");
}

.task-progress .task-name {
    margin-top: .4rem;
    font-size: .3rem;
    text-align: center;
}

.progress {
    padding: 0 .2rem;
    margin: .2rem auto;
    width: 4.5rem;
    height: .3rem;
    background-image: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/bg_progress.png");
    box-sizing: border-box;
}

.progress .progress-bar {
    width: 0%;
    height: .12rem;
    background: -webkit-linear-gradient(to right, #F95D12, #F9AA12);
    background: linear-gradient(to right, #F95D12, #F9AA12);
}

.progress .progress-bar::before {
    content: "";
    position: absolute;
    top: 53%;
    left: -.3rem;
    width: .5rem;
    height: .5rem;
    background: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/ico_progress_before.png") no-repeat;
    background-size: 100% 100%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.progress .progress-bar::after {
    content: "";
    position: absolute;
    top: calc(50% + .02rem);
    right: -.24rem;
    width: .36rem;
    height: .36rem;
    background: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/ico_progress_after.png") no-repeat;
    background-size: 100% 100%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.progress .progress-text {
    top: .3rem;
    right: -.3rem;
    text-align: right;
    color: #258275;
    font-weight: bold;
}

.btn-task {
    margin: .9rem auto 0;
    width: 1.72rem;
    height: .54rem;
    background-image: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/btn_task.png");
    color: #9d5c19;
}

.award-list {
    margin-top: -.2rem;
}

.award-list .award-item {
    margin: 0 -.4rem;
    width: 3.04rem;
    height: 2.35rem;
    background-image: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/bg_award.png");
    flex-shrink: 0;
}

.award-list .award-item img {
    width: 1.54rem;
}

.award-list .award-item .award-name {
    bottom: .4rem;
    font-size: .2rem;
    color: #1b5567;
}
.award-list .tag{
    top: .2rem;
    right: .5rem;
    width: .6rem;
    height: .32rem;
    background-image: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/tag_award_01.png");
}
.btn-receive {
    margin: 0 auto;
    width: 3.94rem;
    height: 1.06rem;
    background-image: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/btn_receive.png");
}

.text-received {
    display: block;
    margin: 0 auto;
    width: 1.01rem;
    height: .47rem;
    background-image: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/txt_received.png");
}

.text-incomplete {
    display: block;
    margin: 0 auto;
    width: .83rem;
    height: .28rem;
    background-image: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/txt_incomplete.png");
}

.item-achievement {
    margin-top: 2rem;
}

.achievement-info {
    margin: .35rem auto 0;
    width:  6.3rem;
    height: 9.96rem;
    background: #174856;
    -webkit-border-radius: .3rem;
    border-radius: .3rem;
}
.achievement-info::after{
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 6.2rem;
    height: 10.06rem;
    background: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/bg_result_after.png") no-repeat;
    background-size: 100% 100%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
.achievement-info .info-img{
    width: 6.14rem;
    height: 9.8rem;
    -webkit-border-radius: .3rem;
    border-radius: .3rem;
    overflow: hidden;
}
.achievement-info .info-img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.achievement-info .info-img .nickname{
    top: .35rem;
    left: 0;
    width: 100%;
    text-align: center;

}
.item-achievement .tips{
    margin: .1rem auto .2rem;
    font-size: .24rem;
    color: #55eee9;
    text-align: center;
}
.btn-enter{
    top: 50%;
    left: 50%;
    width: 2.94rem;
    height: 2.23rem;
    background-image: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/ico_share.png");
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

.item-invite{
    margin-top: 1.2rem;
}
.item-invite .award-list .award-item{
    margin: .2rem -.4rem;
}

.item-invite .btn-task{
    bottom: -.4rem;
}
.item-invite .text-received{
    bottom: -.4rem;
}
.item-invite .text-incomplete{
    bottom: -.28rem;
}
.item-invite .award-list .award-item .award-name{
    font-size: .18rem;
    line-height: 1.2;
    text-align: center;
}
.award-list .ico-head{
    bottom: -1.8rem;
    width: 1.14rem;
    height: 1.14rem;
    background-image: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/bg_head.png");
}
.award-list .ico-head img{
    width: .9rem;
    height: .9rem;
    object-fit: cover;
    -webkit-border-radius: 50%;
    border-radius: 50%;
}
.award-list .ico-head i{
    top: 50%;
    left: 50%;
    padding-left: .05rem;
    width: .9rem;
    height: .9rem;
    background: rgba(0, 0, 0, .5);
    font-size: .24rem;
    text-align: left;
    color: #f6da9a;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    box-sizing: border-box;
}

.award-list .ico-head.none img{ display: none; }
.btn-share{
    margin: .5rem auto 0;
    width: 3.94rem;
    height: 1.06rem;
    background-image: url("//png.pookcdn.net/new_net/bydrqp/anniversary/task/btn_share.png");
}
.hint {position: fixed;background: rgba(0, 0, 0, 0) url(//png.pookcdn.net/new_net/bydrqp/pup_hint.png) no-repeat scroll 0 0 / 100% 100%;height: 5.4rem;right: .51rem;top: 0;width: 6.03rem;z-index: 120;}
.item-invite .award-list{
    margin-top: .1rem;
}
.item-invite .task-title{
    top: -.15rem;
    font-size: .24rem;
}

.bot-tips{
    margin:2.2rem auto 0;
    width:6.72rem;
    height:.48rem;
    background-image:url('//png.pookcdn.net/new_net/bydrqp/anniversary/task/bg_url.png');
    font-size:.18rem;
    color:#acffe1;
}