@charset "utf-8";

 div.close {
    display: none;
 }

 .blackbarnew {
     top: 0;
     left: 0;
     width: 100%;
     height: 30px;
     padding: 0 10px;
     background-color: #000;
     position: fixed;
     z-index: 999;
     overflow: hidden
 }

 .yeslogo {
     font-size: 12px;
     color: #fff;
     line-height: 30px;
     letter-spacing: 2px;
     float: left
 }

 .yeslogo i {
     margin-right: 8px;
     float: left
 }

 .yeslogo i img {
     width: 10px;
     margin-top: 10px
 }

 .yesgogo {
     font-size: 12px;
     color: #fff;
     line-height: 30px;
     letter-spacing: 2px;
     float: right
 }

 .yesyes {
     font-size: 15px;
     color: #fff;
     font-weight: bold;
     line-height: 30px;
     letter-spacing: 1px;
     margin-right: 4px
 }

 .bg {
     position: fixed;
     top: 30px;
     right: 0;
     bottom: 0;
     left: 0;
     z-index: -1;
     background-image: url("../img/bg.jpg");
     background-position: top center;
     background-repeat: no-repeat;
     background-size: cover
 }

 @media screen and (max-width:980px) {}

 @media screen and (max-width:736px) {}

 .page {
     max-width: 900px;
     margin: 0 auto 0;
     padding: 30px 0 0
 }

 .focbox {
     width: 100%;
     margin-bottom: -3px;
     margin-top: 0;
     padding-top: 10px
 }

 @media screen and (max-width:736px) {
     .focbox {
         padding-top: 0;
         margin-top: -20px
     }
 }

 .bar_box {
     background-image: url("../img/bar.png");
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
     padding: 17px;
     width: 100%
 }

 .bar {
     width: 100%;
     margin-bottom: 16px
 }

 .bar>ul {
     overflow: hidden
 }

 .bar>ul>li {
     float: left;
     height: 80px;
     margin-right: 20px;
     width: 100%
 }

 .bar>ul>li:last-child {
     margin-right: 0
 }

 .bar>ul>li img {
     transition: all .3s
 }

 .poun {
     width: 100%;
     background-color: #1b1b1b;
     height: 80px;
     border-radius: 8px;
     text-align: center;
     background-image: url("../img/un_bg.png");
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover
 }

 .poun>ul {
     overflow: hidden;
     height: 80px;
     padding-top: 3px
 }

 .poun>ul>li {
     display: inline-block;
     position: relative
 }

 .poun>ul>li:first-child {
     top: -10px;
     margin-right: -12px
 }

 .poun>ul>li:last-child {
     top: -10px;
     margin-left: -12px
 }

 .bf {
     font-size: 40px;
     font-weight: bold;
     color: #eee;
     line-height: 80px
 }

 .bf i {
     transform: scale(0.7);
     margin-left: 4px;
     color: #FCFFA8
 }

 .sf {
     font-size: 30px;
     color: #fff
 }

 @media screen and (max-width:980px) {
     .sf {
         font-size: 26px;
         color: #fff
     }
 }

 @media screen and (max-width:736px) {
     .bar {
         padding: 0px;
         margin-bottom: 8px
     }

     .bar>ul>li {
         height: 64px
     }

     .poun {
         height: 64px
     }

     .poun>ul {
         overflow: hidden;
         height: 64px;
         position: relative;
         padding-top: 2px
     }

     .poun>ul>li:first-child {
         top: -7px;
         margin-right: -10px
     }

     .poun>ul>li:last-child {
         top: -7px;
         margin-left: -10px
     }

     .bf {
         line-height: 64px;
         font-size: 30px
     }

     .sf {
         font-size: 20px
     }

     .bar_box {
         padding: 8px
     }
 }

 @media screen and (max-width:320px) {}

 .menu {
     width: 100%
 }

 .menu ul {
     overflow: hidden
 }

 .menu li {
     width: calc(33.33% - 8px);
     margin-right: 12px;
     height: 60px;
     text-align: center;
     float: left;
     transition: all .3s
 }

 .menu li:last-child {
     margin: 0
 }

 .menu li div {
     color: #fff;
     font-size: 26px;
     line-height: 60px;
     transition: all .3s;
     background-image: url("../img/mu_bg_a.png");
     background-position: center;
     background-repeat: no-repeat;
     background-size: contain;
     font-weight: bold;
     text-shadow: 0 2px 2px rgba(0, 50, 100, 0.6)
 }

 .menu li div:hover {
     color: #ffff91;
     background-image: url("../img/mu_bg_b.png")
 }

 .menu_ok {
     color: #ffff91 !important;
     background-image: url("../img/mu_bg_c.png") !important
 }

 @media screen and (max-width:980px) {
     .menu li div {
         background-size: contain;
         line-height: 55px;
         font-size: 22px
     }

     .menu li {
         height: 55px
     }
 }

 @media screen and (max-width:736px) {
     .menu li {
         height: 40px;
         margin-right: 9px;
         width: calc(33.33% - 6px)
     }

     .menu li div {
         color: #eee;
         font-size: 16px;
         line-height: 40px;
         background-size: contain;
         background-image: url("../img/mu_bg_a_m.png")
     }

     .menu li div:hover {
         background-image: url("../img/mu_bg_b_m.png");
         background-size: contain
     }

     .menu_ok {
         background-image: url("../img/mu_bg_c_m.png") !important;
         background-size: contain
     }
 }

 .acbox {
     width: 100%;
     background-color: #0096d9;
     padding: 20px 18px 20px;
     background: -webkit-linear-gradient(#0096d9, #0068b7);
     background: -o-linear-gradient(#0096d9, #0068b7);
     background: -moz-linear-gradient(#0096d9, #0068b7);
     background: linear-gradient(#0096d9, #0068b7)
 }

 @media screen and (max-width:736px) {
     .acbox {
         padding: 20px 18px 60px
     }
 }

 .playgame {
     width: 100%;
     margin-bottom: 20px;
     border-radius: 8px;
     overflow: hidden;
     position: relative
 }

 .playgame p {
     font-size: 30px;
     font-weight: bold;
     color: #333;
     margin-bottom: 8px;
     text-align: right;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap
 }

 .playgame_go {
     width: 160px;
     height: 42px;
     line-height: 42px;
     text-align: center;
     background-color: #d20011;
     color: #fff;
     font-size: 24px;
     border-radius: 6px;
     transition: all .3s;
     float: right
 }

 .playgame:hover .playgame_go {
     background-color: #a3001d
 }

 .ffgo {
     width: 100%;
     position: absolute;
     bottom: 35px;
     z-index: 88;
     overflow: hidden;
     padding: 0 32px 0 0px
 }

 .web {
     display: block
 }

 .mob {
     display: none
 }

 @media screen and (max-width:980px) {
     .playgame p {
         font-size: 26px
     }

     .ffgo {
         bottom: 30px
     }
 }

 @media screen and (max-width:736px) {
     .web {
         display: none
     }

     .mob {
         display: block
     }

     .playgame p {
         font-size: 28px;
         text-align: center;
         margin-bottom: 10px
     }

     .ffgo {
         bottom: 14px;
         padding: 0 14px
     }

     .playgame_go {
         width: 100%
     }
 }

 @media screen and (max-width:320px) {
     .playgame p {
         font-size: 22px;
         margin-bottom: 4px
     }
 }

 .photo_box {
     width: 100%;
     background-color: #fff;
     padding-bottom: 8px;
     position: relative;
     border-radius: 6px;
     overflow: hidden;
     box-shadow: 0 0 2px rgba(0, 50, 90, 0.5)
 }

 .photo_box img {
     margin-bottom: 8px;
     margin-top: 20px
 }

 .photo_box h1,
 .photo_box h3 {
     font-size: 18px;
     color: #333;
     margin-bottom: 10px;
     line-height: 1.4;
     padding: 0 10px;
     height: 50px;
     display: -webkit-box;
     -webkit-box-orient: vertical;
     -webkit-line-clamp: 2;
     overflow: hidden
 }

 .photo_box p {
     font-size: 22px;
     color: #ff5400;
     font-weight: bold;
     padding: 0 10px
 }

 .photo_box h2 {
     font-size: 20px;
     color: #8e8e8e;
     text-decoration: line-through;
     padding: 0 10px
 }

 .psf {
     font-size: 14px;
     margin: 0 2px;
     font-weight: normal
 }

 .gogo {
     width: 46px;
     height: 26px;
     line-height: 26px;
     background-color: #d20011;
     font-size: 15px;
     color: #fff;
     text-align: center;
     position: absolute;
     right: 10px;
     bottom: 10px;
     border-radius: 4px;
     z-index: 88;
     transition: all .3s
 }

 .icon {
     padding: 6px 8px;
     font-size: 16px;
     background-color: #004783;
     color: #eee;
     position: absolute;
     top: 0;
     left: 0;
     z-index: 88;
     border-radius: 0px 0 6px 0
 }

 .photo_box:hover .gogo {
     background-color: #a3001d
 }

 .sbox4 {
     width: 100%;
     margin-bottom: 2px
 }

 .sbox4 ul {
     overflow: hidden
 }

 .sbox4 li {
     float: left;
     width: calc(25% - 13.5px);
     margin-right: 18px;
     margin-bottom: 18px
 }

 .sbox4 li:nth-child(4n+4) {
     margin-right: 0
 }

 .sbox6 {
     width: 100%;
     margin-bottom: 2px
 }

 .sbox6 ul {
     overflow: hidden
 }

 .sbox6 li {
     float: left;
     width: calc(33.33% - 12px);
     margin-right: 18px;
     margin-bottom: 18px
 }

 .sbox6 li:nth-child(3n+3) {
     margin-right: 0
 }

 .foc_top {
     width: 100%
 }

 .foc_top {
     display: none
 }

 @media screen and (max-width:736px) {
     .photo_box h1 {
         font-size: 16px;
         height: 40px
     }

     .photo_box h2 {
         font-size: 12px
     }

     .photo_box h2 font {
         font-size: 12px
     }

     .sbox6 li {
         width: calc(50% - 9px)
     }

     .sbox6 li:nth-child(3n+3) {
         margin-right: 18px
     }

     .sbox6 li:nth-child(2n+2) {
         margin-right: 0
     }

     .foc_top {
         display: block;
         position: relative;
         margin-bottom: 20px
     }

     .icon {
         font-size: 12px
     }
 }

 .me_box {
     width: 100%;
     background-color: #fff;
     margin-bottom: 20px;
     border-radius: 6px;
     overflow: hidden;
     box-shadow: 0 0 2px rgba(0, 50, 90, 0.5)
 }

 .me_box h3 {
     font-size: 20px;
     color: #eee;
     padding: 10px 0;
     width: 100%;
     background-color: #004783;
     text-align: left;
     padding-left: 16px
 }

 .me_box h2 {
     font-size: 30px;
     font-weight: bold;
     padding: 20px 16px;
     width: 100%;
     color: #ff5400;
     background-color: #fffac0
 }

 .me_box ul {
     padding: 26px 16px 20px 36px
 }

 .me_box li {
     margin-bottom: 16px;
     font-size: 16px;
     list-style: decimal;
     color: #333;
     line-height: 1.5
 }

 .me_box li:last-child {
     margin-bottom: 0
 }

 @media screen and (max-width:736px) {
     .me_box h2 {
         text-align: center
     }
 }

 .buylist_box {
     width: 100%;
     background-color: #fff;
     margin-bottom: 20px;
     border-radius: 6px;
     overflow: hidden;
     box-shadow: 0 0 2px rgba(0, 50, 90, 0.5)
 }

 .buylist_box h3 {
     font-size: 20px;
     color: #eee;
     padding: 10px 0;
     width: 100%;
     background-color: #004783;
     text-align: left;
     padding-left: 16px
 }

 .buylist_box table {
     width: 100%
 }

 .buylist_box tr {
     border-bottom: 1px solid #ddd;
     width: 100%
 }

 .buylist_box th {
     height: 40px;
     line-height: 1.5;
     text-align: center;
     color: #333;
     font-size: 16px;
     padding: 8px
 }

 .buylist_box th:nth-child(1) {
     width: 25%;
     border-right: 1px solid #ddd
 }

 .buylist_box th:nth-child(2) {
     width: 30%;
     border-right: 1px solid #ddd;
     overflow: hidden
 }

 .buylist_box th:nth-child(3) {
     width: 25%;
     border-right: 1px solid #ddd;
     overflow: hidden
 }

 .buylist_box th:nth-child(4) {
     width: 20%
 }

 .buylist_box h2 {
     padding: 16px
 }

 .good2 {
     color: #d20011 !important;
     font-weight: bold
 }

 .buy_c {
     background-color: #d20011;
     color: #fff;
     width: 60%;
     height: 30px;
     line-height: 30px;
     display: inline-block;
     border-radius: 4px;
     transition: all .3s
 }

 .buy_c:hover {
     background-color: #a3001d
 }

 .buy_b {
     background-color: #999;
     color: #fff;
     width: 60%;
     height: 30px;
     line-height: 30px;
     display: inline-block;
     border-radius: 4px;
     transition: all .3s
 }

 .data {
     color: #666 !important
 }

 .good {
     color: #ff505e !important
 }

 .nono {
     color: #00b0ff !important
 }

 @media screen and (max-width:736px) {
     .buylist_box th {
         font-size: 12px
     }

     .buy_c,
     .buy_b {
         font-size: 14px;
         width: 100%;
         overflow: hidden;
         padding: 0 6px;
         min-width: 68px;
         display: block
     }

     .buylist_box th:nth-child(1) {
         width: 25%
     }

     .buylist_box th:nth-child(2) {
         width: 30%;
         font-size: 16px
     }

     .buylist_box th:nth-child(3) {
         width: 20%;
         font-size: 16px
     }

     .buylist_box th:nth-child(4) {
         width: 25%
     }

     .data {
         font-size: 14px !important
     }
 }

 .say_box {
     width: 100%;
     background-color: #fff;
     margin-bottom: 20px;
     border-radius: 6px;
     overflow: hidden;
     box-shadow: 0 0 2px rgba(0, 50, 90, 0.5);
     position: relative
 }

 .say_box h3 {
     font-size: 20px;
     color: #eee;
     padding: 10px 0;
     width: 100%;
     background-color: #004783;
     text-align: left;
     padding-left: 16px
 }

 .say_box ul {
     overflow: hidden;
     padding: 16px
 }

 .say_box li {
     width: 100%;
     line-height: 1.5;
     margin-bottom: 20px;
     font-size: 16px;
     color: #333
 }

 .say_box li:last-child {
     margin-bottom: 0
 }

 .say_b {
     color: #000;
     font-weight: bold;
     margin-bottom: 4px;
     font-size: 18px
 }

 .say_box ol {
     padding-left: 22px
 }

 .say_box ol li {
     list-style-type: decimal !important;
     margin-bottom: 6px;
     line-height: 1.5
 }

 .act_box2 {
     width: 100%;
     margin-bottom: 8px
 }

 .daily_signIn_area {
     display: flex;
     margin: 20px 0
 }

 .daily_signIn_area img {
     display: block
 }

 .daily_signIn_area h3 {
     text-align: center;
     padding-top: 15px;
     font-size: 20px;
     letter-spacing: 3px;
     font-weight: bold;
     color: #004783
 }

 .daily_signIn_area p {
     width: 100%;
     background: #ffbc00;
     font-size: 20px;
     color: #fff;
     letter-spacing: 3px;
     padding: 15px 0;
     text-align: center;
     font-weight: bold
 }

 .daily_signIn_area>div:nth-child(1) {
     flex: 7;
     display: flex;
     flex-wrap: wrap
 }

 .daily_signIn_area>div:nth-child(1)>div {
     width: calc(33.3333% - 15px);
     background: #fffce0;
     border: 2px solid #ffbc00;
     border-radius: 8px;
     margin: 0 15px 15px 0;
     overflow: hidden;
     position: relative
 }

 .daily_signIn_area>div:nth-child(1)>div>div {
     display: flex;
     align-items: center;
     justify-content: center;
     padding: 20px 0
 }

 .daily_signIn_area>div:nth-child(1)>div:nth-child(3)~div {
     margin-bottom: 0
 }

 .daily_signIn_area>div:nth-child(1)>div:nth-child(3n+3) {
     margin-right: 0
 }

 .daily_signIn_area>div:nth-child(2) {
     flex: 3;
     background: #fffce0;
     border-radius: 8px;
     border: 2px solid #ffbc00;
     display: flex;
     align-items: center;
     flex-direction: column;
     position: relative;
     overflow: hidden
 }

 .daily_signIn_area>div:nth-child(2)>div {
     width: 100%;
     padding: 15px;
     flex: 8;
     display: flex;
     align-items: center;
     justify-content: center
 }

 .signIn_cecked::after {
     content: '';
     background-image: url(../img/check-mark.png);
     background-size: 30%;
     background-position: center;
     background-repeat: no-repeat;
     width: 100%;
     height: 100%;
     position: absolute;
     top: 0;
     left: 0;
     display: block;
     background-color: rgba(80, 80, 80, .6);
     z-index: 5
 }

 .signIn_Exp::after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    background-color: rgba(80, 80, 80, .6);
    z-index: 5
 }

 .signIn_Btn {
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 20px
 }

 .signIn_Btn>div {
     text-align: center;
     letter-spacing: 10px;
     width: 250px;
     padding: 12px 20px 12px 30px;
     font-size: 24px;
     border-radius: 8px;
     font-weight: bold;
     background: #FF5722;
     color: #fff;
     cursor: pointer;
     box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2)
 }

 .signIn_Btn>div:hover {
     background: #ec5f00;
     transition: all .3s
 }

 @media screen and (max-width:736px) {
     .daily_signIn_area {
         margin: 0 0 20px
     }

     .daily_signIn_area>div:nth-child(1)>div {
         width: calc(33.3333% - 5px);
         background: #fffce0;
         margin: 0px 5px 5px 0
     }

     .daily_signIn_area>div:nth-child(1)>div>div {
         padding: 6px 0
     }

     .daily_signIn_area p {
         font-size: 14px;
         letter-spacing: 0px;
         padding: 5px 0px
     }

     .daily_signIn_area h3 {
         padding-top: 6px;
         font-size: 14px
     }

     .signIn_Btn>div {
         width: 100%
     }
 }

 .birthday_img {}

 .act_box2 ul {
     overflow: hidden
 }

 .act_box2 li {
     width: calc(33.33% - 10px);
     margin-right: 15px;
     padding: 0;
     transition: all .3s;
     float: left;
     margin-bottom: 20px;
     position: relative
 }

 .act_box2 li:nth-child(3n+3) {
     margin-right: 0
 }

 .act_boxf2 {
     position: relative;
     box-shadow: 0 0 2px rgba(0, 50, 90, 0.5);
     background-color: #fff;
     width: 100%;
     padding: 50px 16px 120px;
     border-radius: 6px;
     background-image: url("../img/bg_a.png");
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover
 }

 .act_boxf2 h1 {
     font-size: 32px;
     position: absolute;
     display: inline-block;
     width: 60px;
     height: 60px;
     text-align: center;
     line-height: 60px;
     border-radius: 50%;
     color: #fff;
     background-color: #ff505e;
     top: -20px;
     left: 50%;
     margin-left: -30px;
     background-image: url("../img/sing.png");
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover
 }

 .act_boxf2 h2 {
     font-size: 24px;
     font-weight: bold;
     margin-bottom: 4px;
     transition: all .3s;
     width: 100%;
     height: 40px;
     line-height: 40px;
     text-align: center;
     color: #004783
 }

 .act_boxf2 .acbt {
     position: absolute;
     bottom: 16px;
     width: calc(100% - 32px)
 }

 .act_boxf2 .act_m {
     position: absolute;
     left: 0;
     bottom: 50px
 }

 .act_f {
     font-size: 22px;
     font-weight: bold;
     color: #333;
     margin-bottom: 0px;
     transition: all .3s;
     width: 100%;
     height: 40px;
     line-height: 42px;
     border-bottom: 0px solid #ddd
 }

 .act_p {
     font-size: 16px;
     color: #1b1b1b;
     line-height: 1.5;
     padding-left: 0px;
     margin-bottom: 8px;
     min-height: 72px
 }

 .act_m {
     width: 100%;
     height: 60px;
     line-height: 60px;
     text-align: center;
     border-radius: 0px;
     font-size: 45px;
     font-weight: bold;
     color: #ff5400;
     transition: all .3s;
     margin-bottom: 8px
 }

 .acbt {
     width: calc(100%);
     height: 42px;
     line-height: 42px;
     text-align: center;
     color: #fff;
     background-color: #0096d9;
     font-size: 20px;
     border-radius: 6px;
     transition: all .3s;
     box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2)
 }

 .acbt:hover {
     background-color: #004783
 }

 .acbt a {
     color: #fff
 }

 .sf3 {
     font-size: 20px;
     font-weight: normal;
     margin: 0 2px;
     color: #1b1b1b
 }

 .df_list {
     width: 100%;
     margin-bottom: 0px
 }

 .df_list li {
     width: 100%;
     line-height: 1.5;
     margin-bottom: 2px;
     color: #d20011;
     margin-right: 0;
     padding: 0;
     font-size: 14px
 }

 .df_list i {
     margin-right: 4px;
     font-weight: bold;
     width: 18px;
     text-align: center
 }

 .checkok {
     color: #666 !important
 }

 .act_boxf_00 {
     background-color: #004783;
     color: #fff
 }

 .act_boxf_00:hover {
     background-color: #0068b7;
     color: #fff
 }

 .okjob {
     -webkit-filter: grayscale(1);
     opacity: 0.9
 }

 .okjob h1 {
     background-image: none
 }

 .okjob .acbt:hover {
     background-color: #0096d9
 }

 .okjob .act_boxf_00:hover {
     background-color: #004783
 }

 @media screen and (max-width:980px) {
     .act_boxf2 {
         background-image: url("../img/bg_b.png");
         background-position: top center
     }
 }

 @media screen and (max-width:736px) {
     .act_box2 li {
         width: calc(100%);
         margin-right: 0
     }

     .act_p {
         margin-bottom: 10px;
         min-height: auto
     }

     .act_boxf2 {
         background-image: url("../img/bg_c.png");
         background-position: top center;
         padding: 15px 16px 110px
     }
 }

 .bannerArea {
     margin: 10px 0
 }

 .task_list_m {
     display: none
 }

 @media screen and (max-width:736px) {
     .task_list {
         display: none
     }

     .task_list_m {
         display: block;
         margin-bottom: 10px
     }

     .task_list_m>div {
         padding: 8px 14px;
         background: #fffce2;
         background-position: center;
         background-repeat: no-repeat;
         background-size: cover;
         border-radius: 8px
     }

     .task_list_content {
         display: flex
     }

     .task_list_content>div:nth-child(1) {
         flex: 7;
         padding-right: 10px;
         border-right: 1px solid #e6e6e6
     }

     .task_list_content>div:nth-child(2) {
         flex: 3;
         padding-left: 10px
     }

     .task_list_m .acbt {
         width: calc(100%);
         height: 30px;
         line-height: 30px;
         text-align: center;
         color: #fff;
         background-color: #0096d9;
         font-size: 13px;
         border-radius: 6px;
         transition: all .3s;
         box-shadow: none
     }

     .task_list_m .act_m {
         width: 100%;
         height: 34px;
         line-height: 34px;
         text-align: center;
         border-radius: 0px;
         font-size: 26px;
         font-weight: bold;
         color: #ff5400;
         transition: all .3s;
         margin-bottom: 8px
     }

     .task_list_m .act_p {
         font-size: 15px;
         color: #1b1b1b;
         line-height: 1.5;
         padding-left: 0px
     }

     .task_list_m h2 {
         font-size: 20px;
         font-weight: bold;
         transition: all .3s;
         width: 100%;
         height: 32px;
         line-height: 32px;
         text-align: left;
         color: #004783
     }

     .sf3 {
         font-size: 15px
     }
 }

 .checkStatus {
     display: flex;
     margin: 15px 0;
     flex-wrap: wrap;
     align-self: center
 }

 .checkStatus>div {
     display: flex;
     align-items: center;
     flex-wrap: wrap;
     background-color: #00479d;
     line-height: 28px;
     border-radius: 6px;
     padding: 10px 12px;
     color: #fff;
     font-size: 20px
 }

 .checkStatus>div:nth-child(1) {
     width: 285px;
     margin-right: 10px
 }

 .checkStatus>div:nth-child(1)>div:nth-child(1) {
     display: flex;
     align-items: center
 }

 .reset_icon {
     height: 25px;
     width: 25px;
     background-image: url(../img/exchange.png);
     background-size: 25px;
     background-repeat: no-repeat;
     background-position: center;
     margin-left: 15px;
     cursor: pointer
 }

 .checkStatus>div:nth-child(2) {
     flex: auto
 }

 .checkStatus>div:nth-child(2)>div {
     flex: auto
 }

 .checkStatus>div:nth-child(2)>div:nth-child(2) {
     width: 200px;
     font-size: 16px;
     padding: 0 5px;
     color: #fff000
 }

 .checkStatus>div:nth-child(2)>div:nth-child(3) {
     padding: 2px 4px;
     border-radius: 4px;
     font-size: 16px;
     cursor: pointer;
     text-align: center;
     color: #fff;
     background-color: #ff5400;
     transition: all .3s
 }

 .checkStatus>div:nth-child(2)>div:nth-child(3):hover {
     background-color: #dd4a00
 }

 @media screen and (max-width:736px) {
     .checkStatus>div:nth-child(1) {
         width: 100%;
         margin-right: 0px;
         margin-bottom: 12px
     }

     .reset_icon {
         margin-left: 10px
     }

     .checkStatus>div:nth-child(2)>div:nth-child(2) {
         width: initial
     }

     .checkStatus>div:nth-child(2)>div:nth-child(3) {
         margin-bottom: 0px
     }
 }

 .blackbg {
     position: fixed;
     top: 0;
     left: 0;
     bottom: 0;
     right: 0;
     z-index: 888;
     background-color: rgba(0, 0, 0, 0.6);
     display: none
 }

 .popupgo {
     width: 600px;
     position: fixed;
     z-index: 999999;
     background-color: #fff;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
     min-height: 300px;
     max-height: 80vh;
     /* display: none */
 }

 .popupgo .pop_header,
 .popupgo h3 {
     font-size: 16px;
     color: #fff;
     width: 100%;
     background-color: #004783;
     height: 30px;
     line-height: 30px;
     text-align: left;
     padding: 0 16px
 }

 
 .popupgo .pop_countent {
     text-align: center;
     font-size: 26px;
     font-weight: bold;
     color: #ff5400;
     background-color: #fffde6;
     padding: 18px 16px;
     line-height: 1.5
 }

 .popupgo_p {
     overflow-y: auto;
     width: 100%;
     border-top: 1px solid #ddd;
     text-align: left
 }

 .popupgo p {
     text-align: left;
     font-size: 16px;
     color: #686868;
     line-height: 1.8;
     padding: 16px
 }

 .popimg {
     width: 150px;
     height: 150px;
     padding: 16px;
     text-align: center;
     position: absolute;
     right: 0px
 }

 .redf {
     color: #FF0004 !important;
     font-size: 15px !important
 }

 .popupgo_s {
     width: 100%;
     padding: 16px;
     border-top: 1px solid #ddd;
     text-align: left;
     position: relative
 }

 .popupgo_s li {
     line-height: 1.5;
     margin-bottom: 8px
 }

 .popupgo_s li:last-child {
     margin-bottom: 0
 }

 .prizeStatus {
     height: 100px;
     width: 100px;
     background-size: 100px;
     position: absolute;
     top: 60px;
     right: 20px;
     background-image: url(../img/b353a07b2ec65b4bc8fe7da178bfea80.png);
     background-repeat: no-repeat
 }

 .popupr {
     position: relative;
     min-height: 300px;
     max-height: 80vh;
     overflow-y: auto
 }

 .qrno {
     min-height: auto !important;
     height: auto !important
 }

 .closepop {
     width: 30px;
     height: 30px;
     background-color: #666;
     position: absolute;
     right: 0;
     top: 0;
     cursor: pointer
 }

 .code {
     width: 100%;
     text-align: center
 }

 .code img {
     width: 50%
 }


 @media screen and (max-width:736px) {
     .popupgo {
         position: fixed;
         top: 0 !important;
         right: 0;
         left: 0 !important;
         bottom: 0;
         margin: 0;
         width: 100%;
         text-align: center;
         height: auto;
         transform: translate(-0%, -0%);
         max-height: 100vh
     }

     .popupr {
         min-height: auto;
         max-height: 100vh;
         height: auto;
         top: 0;
         right: 0;
         left: 0;
         bottom: 0;
         position: fixed;
         overflow-y: auto
     }

     .popimg {
         position: static;
         width: 100%;
         height: auto
     }

     .popimg img {
         width: 150px
     }

     .popupgo_p {
         overflow-y: auto;
         height: auto
     }

     .code img {
         width: 100%
     }

     .birthday_popup {
         position: fixed;
         top: 20vh !important;
         right: 0;
         left: 0;
         bottom: 0;
         margin: 0;
         width: 100%;
         text-align: center;
         height: auto;
         transform: translate(-0%, -0%);
         max-height: 380px
     }
 }

 @media screen and (max-width:320px) {
     .popimg img {
         width: 100px
     }

     .popupgo_p {
         overflow-y: auto
     }

     .popupgo .pop_countent {
         font-size: 20px
     }
 }

 .codeshow {
     position: absolute;
     top: 10px;
     right: 10px;
     width: 100px;
     height: 30px;
     color: #fff;
     background-color: #ff505e;
     text-align: center;
     line-height: 30px;
     font-size: 14px;
     font-weight: bold;
     border-radius: 4px;
     cursor: pointer;
     transition: all .3s
 }

 .codeshow:hover {
     background-color: #a3001d
 }

 .nobuy {
     width: calc(100%);
     height: 48px;
     line-height: 48px;
     text-align: center;
     font-weight: bold;
     color: #fff;
     background-color: #999;
     font-size: 26px;
     letter-spacing: 2px;
     border-radius: 6px;
     transition: all .3s;
     box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
     cursor: pointer
 }

 .nobuy:hover {
     background-color: #666
 }

 .cbuy {
     width: calc(100%);
     height: 48px;
     line-height: 48px;
     text-align: center;
     font-weight: bold;
     color: #fff;
     background-color: #cd1536;
     font-size: 26px;
     letter-spacing: 2px;
     border-radius: 6px;
     transition: all .3s;
     box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
     cursor: pointer
 }

 .cbuy:hover {
     background-color: #a3001d
 }

 .dbuy {
     width: calc(100%);
     height: 48px;
     line-height: 48px;
     text-align: center;
     font-weight: bold;
     color: #fff;
     background-color: #006bbb;
     font-size: 26px;
     letter-spacing: 2px;
     border-radius: 6px;
     transition: all .3s;
     box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
     cursor: pointer
 }

 .dbuy:hover {
     background-color: #006bbb
 }

 .popb {
     width: 100%;
     position: relative;
     bottom: 0;
     z-index: 99;
     padding: 16px;
     background-color: #fff
 }

 .popb ul {
     height: 48px
 }

 .popb li {
     width: calc(50% - 8px);
     margin-right: 16px;
     float: left
 }

 .popb li:last-child {
     margin-right: 0;
     float: right
 }

 @media screen and (max-width:736px) {
     .popb {
         position: fixed;
         bottom: 0;
         box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.2)
     }
 }

 .fl {
     float: left
 }

 .fr {
     float: right
 }

 .none {
     display: none
 }

 /* .inrow {
     font-size: 0;
     [;
     font-size: 12px;
     ];
     *font-size: 0;
     font-family: arial;
     [;
     letter-spacing: -3px;
     ];
     *letter-spacing: normal;
     *word-spacing: -1px
 } */

 .inrow>li,
 .inrow span {
     display: inline-block;
     *display: inline;
     *zoom: 1;
     font-size: 14px;
     letter-spacing: normal;
     word-spacing: normal
 }

 .dataNums {
     width: 100%;
     height: 74px;
     text-align: center;
     transform: scale(0.9)
 }

 .dataNums .dataOne {
     width: 61px;
     height: 74px;
     margin: 0px 1px;
     text-align: center;
     background: url(../img/num-bg.png) no-repeat;
     background-size: cover;
     background-position: center
 }

 .dataNums .dataBoc {
     position: relative;
     width: 100%;
     height: 100%;
     overflow: hidden
 }

 .dataNums .dataBoc .tt {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%
 }

 .dataNums .tt span {
     width: 100%;
     height: 100%;
     font: bold 64px/74px "Arial";
     color: #fff000;
     text-shadow: 0 0 8px rgba(0, 0, 0, 0.8)
 }

 @media screen and (max-width:736px) {
     .dataNums {
         height: 60px
     }

     .dataNums .dataOne {
         width: 50px;
         height: 60px;
         border-radius: 6px
     }

     .dataNums .tt span {
         font: bold 54px/60px "Arial"
     }
 }

 #advertisement {
     position: fixed;
     z-index: 888;
     right: 10px;
     bottom: 10px;
     width: 150px
 }

 #advertisement img {
     border: none
 }

 @media screen and (max-width:736px) {
     #advertisement {
         right: 8px;
         bottom: 200px;
         display: none
     }
 }

 .description {
     display: none
 }

 @media screen and (max-width:736px) {
     .description {
         display: block;
         position: fixed;
         bottom: -3px;
         right: 0;
         z-index: 99
     }
 }

 .say3 {
     width: 100%;
     padding-bottom: 20px;
     border-bottom: 1px dotted #a9ffff;
     margin-bottom: 20px
 }

 .say3>h1 {
     font-size: 20px;
     color: #fff;
     margin-bottom: 15px;
     display: none
 }

 .say3>h4 {
     font-size: 20px;
     color: #fff;
     margin-bottom: 15px;
     display: none
 }

 .say3 ul {
     overflow: hidden
 }

 .say3 li {
     float: left;
     text-align: center;
     height: 70px;
     transition: all .3s;
     position: relative;
     overflow: hidden
 }

 .say3 li:nth-child(odd) {
     width: calc(33.33% - 28px);
     border-radius: 6px;
     background-color: rgba(0, 70, 157, 0.8);
     padding-top: 16px;
     overflow: hidden;
     display: grid;
     justify-content: center;
     align-items: center
 }

 .say3 li:nth-child(even) {
     width: 42px;
     line-height: 70px;
     color: #eee;
     font-size: 32px
 }

 .say3 li h2 {
     position: absolute;
     left: -25px;
     top: -28px;
     color: #fff;
     font-size: 16px;
     width: 60px;
     height: 60px;
     border-radius: 50%;
     background-color: rgba(0, 0, 0, 0.3);
     padding-left: 18px;
     line-height: 85px
 }

 .say3 li h3 {
     font-size: 44px;
     color: #000;
     margin-bottom: 16px
 }

 .say3 li p {
     font-size: 18px;
     color: #000
 }

 .say3 li a {
     font-size: 24px;
     color: #fff000;
     text-decoration: underline
 }

 .say3 li font {
     font-size: 16px;
     color: #333;
     margin-top: -20px
 }

 @media screen and (max-width:980px) {
     .say3 li a {
         font-size: 22px
     }
 }

 @media screen and (max-width:736px) {
     .d-m-none {
         display: none
     }

     #saym02 {
         position: fixed;
         z-index: 2000;
         top: 0;
         left: 0;
         bottom: 0;
         right: 0;
         padding: 20px;
         border-bottom: 0px dotted #aaa;
         background-color: #65cfff;
         margin: 0;
         display: none
     }

     .say3>h1 {
         display: none
     }

     .say3>h4 {
         display: none
     }

     .say3 li:nth-child(odd) {
         width: 100%
     }

     .say3 li:nth-child(even) {
         width: 100%;
         line-height: 40px;
         height: auto
     }

     .say3 li:nth-child(even) i {
         transform: rotate(90deg);
         color: #666
     }

     .nosee {
         width: 100%;
         height: 48px;
         line-height: 48px;
         text-align: center;
         font-size: 22px;
         color: #fff;
         background-color: #d20011;
         border-radius: 6px;
         margin-top: 30px
     }
 }

 .web {
     display: block
 }

 .mob {
     display: none
 }

 .mob2 {
     display: none
 }

 @media screen and (max-width:736px) {
     .web {
         display: none
     }

     .mob {
         display: block
     }
 }

 .hbf,
 .hbf2 {
     font-size: 20px;
     margin-bottom: 15px;
     padding: 10px 0 0;
     color: #fff
 }

 .hbf i {
     margin: 0 6px;
     color: #fff
 }

 .hbf2 i {
     margin: 0 6px;
     color: #fff
 }

 @media screen and (max-width:736px) {
     .hbf {
         width: 100%;
         height: 40px;
         background-color: #00479d;
         color: #fff000;
         padding: 0 0 0 10px;
         text-align: left;
         line-height: 40px;
         border-radius: 6px;
         margin-bottom: 15px;
         position: relative
     }

     .hbf2 {
         font-size: 18px;
         display: none
     }

     .hbf i {
         color: #ccc;
         position: absolute;
         right: 10px;
         top: 10px
     }
 }

 .say0829 {
     width: 100%;
     padding-bottom: 20px;
     border-bottom: 1px dotted #a9ffff;
     margin-bottom: 20px
 }

 .say0829>p {
     font-size: 20px;
     color: #fff;
     margin-bottom: 15px;
     display: none
 }

 .say0829 ul {
     overflow: hidden
 }

 .say0829 li {
     float: left;
     text-align: left;
     transition: all .3s;
     position: relative;
     overflow: hidden;
     width: calc(50% - 8px);
     margin-right: 16px;
     background-color: #00479d;
     border-radius: 6px;
     height: 54px;
     line-height: 54px;
     padding: 0 16px;
     cursor: pointer
 }

 .say0829 li:hover {
     background-color: #003b82
 }

 .say0829 li h2 {
     font-size: 24px;
     font-weight: bold;
     color: #fff000;
     float: left
 }

 .say0829 li p {
     color: #eee;
     font-size: 20px;
     float: right
 }

 .say0829 li i {
     margin-left: 8px
 }

 .say0829 li:last-child {
     margin: 0
 }

 @media screen and (max-width:736px) {
     .say0829 li {
         width: 100%;
         margin-right: 0;
         margin-bottom: 10px;
         height: 40px;
         line-height: 40px;
         padding: 0 10px
     }

     .say0829 li h2 {
         font-size: 20px;
         font-weight: normal
     }
 }

 .wtfbox {
     width: 100%;
     padding: 16px;
     line-height: 1.5;
     background-color: #fff;
     margin-bottom: 20px;
     border-radius: 6px
 }

 .mbr {
     margin-left: 8px
 }

 @media screen and (max-width:736px) {
     .mbr {
         margin-left: 0px;
         display: block;
         margin-top: 8px
     }
 }

 .list_man_02 {
     width: 100%
 }

 .list_man_02 table {
     border: 0px solid #000;
     width: 100%;
     background-color: #eee
 }

 .list_man_02 td {
     border-right: 1px solid #ddd;
     color: #333;
     text-align: center;
     line-height: 1.5;
     vertical-align: middle;
     height: 30px;
     font-size: 16px;
     padding: 8px
 }

 .list_man_02 td:last-child {
     border-right: 0px solid #ddd
 }

 .list_man_02 tr {
     border-bottom: 1px solid #ddd
 }

 .list_man_02 tr:nth-child(even) {
     background-color: #fff
 }

 .list_man_02 tr:last-child {
     border-bottom: 0px solid #ddd
 }

 .w20 {
     width: 20%
 }

 .w30 {
     width: 30%
 }

 .w50 {
     width: 50%
 }

 @media screen and (max-width:736px) {
     .w20 {
         width: 25%
     }

     .w30 {
         width: 30%
     }

     .w50 {
         width: 45%
     }
 }

 .list_box {
     width: 100%;
     height: 30px;
     text-align: center;
     margin-bottom: 20px;
     line-height: 30px;
     margin-top: -10px
 }

 .list_box a {
     color: #fff;
     transition: all .3s
 }

 .list_box a:hover {
     color: #FFFE74
 }

 .list_box select {
     padding: 2px 8px;
     margin: 0 10px;
     vertical-align: middle
 }

 .list_box td {
     vertical-align: middle
 }

 .buyman {
     width: 100%;
     padding: 16px 16px 8px;
     text-align: left;
     border-top: 1px solid #ddd
 }

 .buyman li {
     width: 100%;
     margin-bottom: 14px;
     overflow: hidden;
     font-size: 16px;
     line-height: 36px
 }

 .buyman li:last-child {
     margin-bottom: 0
 }

 .buyman li h3 {
     float: left;
     width: 90px;
     height: 36px;
     text-align: justify;
     text-justify: inter-ideograph;
     -ms-text-justify: inter-ideograph;
     -moz-text-align-last: justify;
     -webkit-text-align-last: justify
 }

 .buyman li h4 {
     float: left;
     margin-right: 4px
 }

 .buyman li h3:after {
     content: '';
     display: inline-block;
     width: 100%
 }

 .buyman li input {
     height: 34px;
     font-size: 15px;
     padding: 0 6px;
     float: left;
     margin-bottom: 8px;
     border: 1px solid #333;
     color: #333
 }

 .buyman li select {
     height: 34px;
     font-size: 15px;
     padding: 0 6px;
     float: left;
     margin-right: 8px;
     margin-bottom: 8px;
     border: 1px solid #333;
     color: #333
 }

 .w160 {
     width: 160px
 }

 .w240 {
     width: 240px
 }

 .w100 {
     width: 100px
 }

 .w80 {
     width: 80px
 }

 .man8 {
     margin-right: 8px
 }

 .buyman li input[type="checkbox"] {
     width: 20px;
     height: 20px;
     position: relative;
     margin: 7px 8px 0 0
 }

 .buyman li h5 {}

 @media screen and (max-width:736px) {
     .mw100 {
         width: 100%
     }

     .buyman li h4 {
         width: calc(100% - 90px);
         margin-right: 0
     }
 }

 .task {
     width: 100%
 }

 .task h2 {
    font-size: 32px;
    color: #fff;
    text-indent: 5px;
    line-height: 1.5;
    text-align: center;
}
 .task h3 {
    font-size: 20px;
    color: #fff;
    text-indent: 5px;
    line-height: 1.5;
    margin-top: 12px;
}


 .task p {
     font-size: 20px;
     color: #fff;
     text-indent: 5px;
     line-height: 1.5;
     text-align: justify;
 }

 .task p:before {
     content: "";
     width: 25px;
     height: 25px;
     float: left;
     background-image: url(../img/icon_task.png);
     background-position: center;
     background-repeat: no-repeat;
     background-size: 25px;
     margin-top: 1px;
 }

 @media screen and (max-width:736px) {
     .task {
         margin-bottom: 8px;
     }

     .task p:before {
         width: 18px;
         height: 20px;
         background-size: 20px;
         margin-top: 3px;
     }
     .task h3 {
        font-size: 18px;
     }
 }

 #a_description {
     position: absolute;
     top: -200px;
 }

 @media screen and (max-width:736px) {
     #a_description {
         top: -138px
     }
 }



 /* days21 */

.day21Bg {
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0, 0.3);
    z-index: 999998;
}

 
 .days21Content {    
    max-width: 490px;
    width: 100%;
    position: fixed;
     z-index: 999999;
     min-height: 300px;
     max-height: 80vh;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     padding-left: 15px;
     padding-right: 15px;
     
 }

 .days21Content .closepop {
    z-index: 999999;
    right: 30px;
    border-radius: 30px;
    
 }

 .day21_header {
    position: relative;
 }
 
 .day21_header img  {
    display: block;
    width: 100%;
}

.day21_header .day21_rabbit {
    max-width: 320px;
    width: 100%;
    margin: 0 auto -60px;
    
}

.day21_header .day21_title {
    position: relative;
    z-index: 9998;
    max-width: 490px;
    max-height: 100px;
    background: url(../img/popup_bg.png);
    background-size: auto 100%;
    background-position: center bottom;
    width: 100%;
    border-top-left-radius: 40px;
    border-top-right-radius: 40px;
    padding: 15px;
    margin: auto;
 }

 .day21_header .day21_title img{
    max-height: 100%;
    width: 50%;
    margin: auto;
 }
 

 .days21.notToday .days21List ul,.days21.noLogin .days21List ul{
    display: none;
 }
 
 .days21.Login .days21List .day21Text{
    display: none;
 }

 .days21.notToday .days21List .day21Text ,.days21.noLogin .days21List .day21Text{
    display: block;
    background: inherit;
    text-align: center;
 }

 .days21 .days21List .day21Text li {
    width: 100%;
    font-weight: bold;
    margin: 0;
 }
 
 .days21.noLogin p {
    margin-bottom: 18px;
 }

 .days21.notToday .days21List .day21Text li:nth-of-type(2) ,.days21.noLogin .days21List .day21Text li:nth-of-type(1){
    display: none;
 }
 
 
 .days21List {
     position: relative;
     margin-top: -20px;
    padding: 40px 20px  30px;
    background-color: #FCFFA8;
    border-bottom-left-radius: 40px;    
    border-bottom-right-radius: 40px;    
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
 }

 div.days21List p {
    display: block;
    width: 100%;
    height: auto;
    font-size: 24px;
    line-height: 1.5;
    font-weight: bold;
    background-color: #FCFFA8;
    color: #ec5f00;
 }

 .days21List ul {
    display: flex;
    align-items: center;
    padding: 15px;
    margin-bottom: 15px;
    background-color: #ffffff;
    border-radius: 8px;
 }

 .days21List li {
    font-size: 20px;
    line-height: 1.5;
 }

 .days21List img {
    display: block;
    margin: auto;
 }

 .days21List li:nth-of-type(1) {
    flex:1;
    padding: 8px;
    margin-right: 40px;
 }

 .days21List li:nth-of-type(2) {
    width: 140px;
 }
 .days21List li:nth-of-type(2) a {
    display: block;
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    background-color: #ff6600;
    color: #ffffff;
    border-radius: 8px;
 }

 .days21List　 li:nth-of-type(2) a {
    display: block;
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    background-color: #ff6600;
    color: #ffffff;
    border-radius: 8px;
 }

 .days21List .taskFinsh li:nth-of-type(2) a {
    display: none;
 }

 img.popFinsh {
    display: none;
}

.taskFinsh  .popFinsh {
    display: block;
    height: 70px;
}


 .days21List div:nth-of-type(1) {
    height: 20px;
    text-align: center;
    border: 1px solid #ff6600;
    background-color: #fad0b3;
    border-radius: 100px;
 }

 .days21List .taskFinsh div:nth-of-type(1) {
    height: 20px;
    text-align: center;
    border: 1px solid #ff6600;
    background-color: #ff6600;
    border-radius: 100px;
 }
 
 .days21List div:nth-of-type(1) section {
    font-size: 16px;
    line-height: 20px;
    color: #ffffff;
 }


 @media screen and (max-width:736px) {
    .days21 {
        padding-left: 15px;
        padding-right: 15px;
    }
    .days21List li:nth-of-type(1) {
        margin: 0;
    }
}