.fixedTop{position: fixed; background: rgba(16, 17, 26, 0.20); width: 100%; left: 0; top: 0; z-index: 9; padding: 0 120px; box-sizing: border-box;  }
.fixedTop a{color: rgb(255,255,255,0.6);}
.fixedTop.bg{background: #10111A;}
.banner{height: 420px; position: relative; }
.banner .slideBox,.banner .slideBox .bd,.banner .slideBox .bd .tempWrap,.banner .slideBox .bd .tempWrap ul,.banner .slideBox .bd .tempWrap li{height: 100%;}
.banner .hd{position: absolute; text-align: center; width: 100%; bottom: 70px; }
.banner .hd ul{display: flex; align-items: center; justify-content: center; }
.banner .hd ul li{width: 10px;height: 3px;background: #FFFFFF; margin: 0 5px; border-radius: 3px;opacity: 0.4;}
.banner .hd ul li.on{background: #fff; width: 20px; opacity: 1; }
.fixedTop .top{display: flex; justify-content: right; line-height: 34px; font-size: 12px; color: rgba(255, 255, 255, 0.60); }
.fixedTop .top .lan{position: relative;}
.fixedTop .top .lan a{padding-left: 16px; cursor: pointer; }
.fixedTop .top .lan a:hover{color: #127FFF;}
.fixedTop .top .lan::before{position: absolute; content: ''; display: block; top: 12px; left: 0; width: 1px; height: 10px; background: rgba(255, 255, 255, 0.20); }
.fixedTop .top > a{margin-right: 16px; cursor: pointer; }
.redfont{color: #E74F4F !important;}
.fixedTop .top .redfont{margin-right: 16px;}
.fixedTop .top .user{padding-left: 16px; position: relative; margin-left: 16px; }
.fixedTop .top .user::before{position: absolute; content: ''; display: block; top: 12px; left: 0; width: 1px; height: 10px; background: rgba(255, 255, 255, 0.20); }
.fixedTop .navbar{display: flex; align-items: center; }
.fixedTop .navbar .logo{height: 24px;}
.fixedTop .navbar .logo img{height: 100%;}
.fixedTop .navbar .right{margin-left: auto;}
.fixedTop .navbar .right{display: flex; align-items: center; height: 72px; }
.fixedTop .navbar .right ul{display: flex; align-items: center; }
.fixedTop .navbar .right ul li{margin: 0 15px;}
.fixedTop .navbar .right ul li a{font-size: 14px; color: #fff; }
.fixedTop .navbar .right ul li.on a{color: #127FFF;}
.fixedTop .navbar .right form{width: 190px;height: 36px; position: relative; border-radius: 6px;border: 1px solid rgba(255,255,255,0.1);} 
.fixedTop .navbar .right form input{border: none; box-sizing: border-box; padding-left: 12px; background: none; width: 100%; height: 100%; }
.fixedTop .navbar .right form button{background: none; position: absolute; right: 8px; top: 4px; padding: 0; border: none; margin: 0;}
.fixedTop .navbar .right form button img{width: 24px; height: 24px; }
.menus{ padding: 12px 120px 18px; position: relative; margin-top: -52px; display: flex; align-items: center; border-bottom: 1px solid rgba(255,255,255,0.1);; }
.menus.bg{background: #10111A;}
.menus a{display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; margin-right: 3%; color: rgba(255, 255, 255, 0.70); }
.menus a img{width: 22px; height: 22px; margin-right: 4px; }
.menus a.on{color: #fff;}
.menus a.on::before{position: absolute; display: block; content: ''; left: 0; bottom: -18px; width: 100%; height: 1px; background: linear-gradient(90deg, rgba(255,255,255,0) 0%, #FFFFFF 51%, rgba(255,255,255,0) 100%); }
.selectBox{display: flex; align-items: center; padding: 0 120px; position: relative; }
.selectBox span{font-size: 12px; margin-right: 10px; color: rgba(255, 255, 255, 0.60); }
.selectBox a{height: 29px; cursor: pointer; margin-right: 10px; line-height: 29px; padding: 0 16px; background: rgba(255,255,255,0.05);border-radius: 8px; font-size: 12px; color: rgba(255, 255, 255, 0.60); }
.selectBox a.on,.selectBox a:hover{ color: #5BA6FF; background: rgba(18,127,255,0.2);}
.selectBox .morebtn{position: relative; margin-left: 10px; }
.selectBox .morebtn::before{position: absolute; width: 1px; height: 20px; background: rgba(255, 255, 255, 0.1); content: ''; display: block; left: -10px; top:5px }
.selectBox .moreItemBox{position: absolute; display: inline-block; box-sizing: border-box; z-index: 2; padding: 24px 30px; left: 600px; top: 40px; background: linear-gradient(135deg, #181925 0%, #1B1D29 100%);border-radius: 16px 16px 16px 16px; }
.selectBox .moreItemBox::before{position: absolute; width: 39px; height: 7px; display: block; content: ''; background: url(../images/icon-up.png) no-repeat center; background-size: 100% 100%; top: -7px; right: 20px; }
.selectBox .moreItemBox ul li{margin-bottom: 24px;}
.selectBox .moreItemBox ul li span{width: 48px; display: inline-block; text-align: right;; }
.selectBox .moreItemBox ul li a{display: inline-block;}
.selectBox .moreItemBox .btns{}
.selectBox .moreItemBox .btns button{width: 62px;height: 27px; cursor: pointer; border: none; margin-right: 10px; color: #fff; font-size: 12px; background: linear-gradient(174deg, #127FFF 0%, #17ABFF 100%);border-radius: 4px;}
.selectBox .moreItemBox .btns button:nth-child(2){color: #FF435A; background: rgba(255,67,90,0.04);border-radius: 4px;border: 1px solid rgba(255,67,90,0.2); }
.types{display: flex; align-items: center; flex-wrap: wrap; margin: 24px 0 14px; padding: 0 0 0 120px;}
.types .item{margin-right: 10px; margin-bottom: 10px; cursor: pointer; display: flex; align-items: center; background: rgba(255,255,255,0.05);border-radius: 12px; padding: 5px 10px; }
.types .item p{font-size: 16px; width: 100px; color: #fff; line-height: 18px; }
.types .item p small{ font-size: 12px; margin-top: 8px; opacity: 0.2; display: flex; align-items: center; }
.types .item img{width: 80px; height: 80px;}
.giftslist{display: flex; align-items: center; flex-wrap: wrap; padding: 20px 20px; justify-content: space-between; margin: 0 -12px;}
.giftslist .item{width: 247px;padding: 20px 8px; box-sizing: border-box; border-radius: 30px; position: relative;overflow: hidden;vertical-align: top;cursor: pointer;margin: 0 7px 22px;background: linear-gradient(180deg, #1a65e5 0%, #20338b 100%);}
.giftslist .item{overflow: revert;}
.giftslist .item .show_box{
    position: absolute;
    top: -5px;
    left: 0;
    width: 100%;
    /* height: 100%; */
    overflow: hidden;
    z-index: 9;
}
.item .show_box video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    overflow-clip-margin: content-box;
    overflow: clip;
    -webkit-filter: brightness(108.5%);
    min-height: 450px;
}
.show_box .btn_box {
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 225px;
    height: 64px;
    padding-top: 12px;
    opacity: 0;
}
.delayed {
    animation: change-color 0.3s linear 0.5s forwards;
}
.show_box .btn {
    width: 200px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background: #1371FF;
    border-radius: 8px;
    color: #FFF;
    font-size: 16px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}
.show_box .btn img {
    width: 22px;
    height: 22px;
    margin-right: 6px;
}
.giftslist .item .icon1{position: absolute; left: 16px; top: 0; width: 28px; height: 36px; }
.giftslist .item .icon1 img{width: 100%;}
.giftslist .item .icon2{position: absolute; right: -12px; top: 0; width: 57px; height: 33px; }
.giftslist .item .icon2 img{width: 100%;}
.giftslist .item .img{width: 211px; height: 211px; display: flex; align-items: center; justify-content: center; }
.giftslist .item .img img{max-width: 100%; max-height: 100%; }
.giftslist .item h4{margin: 16px 0 8px; padding: 0 4px; display: flex; align-items: center; font-size: 25px; color: #fff; }
.giftslist .item h4 span{margin-left: auto; color: #90FFAD; }
.giftslist .item .tags{margin-bottom: 12px; padding: 0 4px; display: flex; align-items: center; }
.giftslist .item .tags span{font-size: 10px; color: #fff; line-height: 16px; height: 16px; border-radius: 8px; padding: 0 6px; margin-right: 4px; background: rgba(255,255,255,0.08); }
.giftslist .item .tags .red{color: #FF6287;background: rgba(255,98,135,0.1);}
.giftslist .item p{display: flex; align-items: center; padding: 0 4px; }
.giftslist .item p span{font-size: 11px; position: relative; padding-right: 8px; margin-right: 8px; color: rgba(255,255,255,0.2); }
.giftslist .item p span::before{position: absolute; display: block; right: 0; top: 2px; content: ''; width: 1px; height: 7px; background-color: #fff; opacity: 0.08; }
.blank{width: 241px;height: 2px;}
.festivals{ position: relative; padding: 0 120px; margin: 24px 0 16px; }
.festivals .leftbtn{position: absolute; width: 38px; height: 38px; left: 120px; top: 20px; z-index: 2; cursor: pointer; }
.festivals .leftbtn img{width: 100%; height: 100%; }
.festivals .rightbtn{position: absolute; width: 38px; height: 38px; right: 120px; top: 20px; z-index: 2; cursor: pointer; }
.festivals .rightbtn img{width: 100%; height: 100%; }
.festivals .box{width: 100%; overflow: hidden; position: relative; }
.festivals .box::before{position: absolute; left: 0; top: 0; width: 98px; height: 100%; content: ''; display: block;background: linear-gradient(90deg, #10111A 0%, rgba(16,17,26,0) 100%); }
.festivals .box::after{position: absolute; right: 0; top: 0; width: 98px; height: 100%; content: ''; display: block;background: linear-gradient(270deg, #10111A 0%, rgba(16,17,26,0) 100%);}
.festivals ul{display: flex; align-items: center; }
.festivals .boxright ul{justify-content: flex-end;}
.festivals ul li{margin-right: 42px; cursor: pointer; }
.festivals ul li .img{width: 129px; height: 125px; border-radius: 100px; display: flex; align-items: center; justify-content: center; }
.festivals ul li .img img{max-width: 90%; max-height: 90%; }
.festivals ul li p{font-size: 13px; margin-top: 12px; color: rgba(255,255,255,0.5); text-align: center; margin-bottom: 0; }
.festivals ul li.on .img{border: 1px solid #127FFF;}
.festivals ul li.on p{color: #127FFF;}
.floatBox{position: fixed; right: 0; top: 50%; padding: 11px 12px; height: 636px; box-sizing: border-box; margin-top: -318px; background-image: linear-gradient(to right,#24469d,#1a1a5f); background-size: 100% 100%;border-radius:20px; }
.floatBox a{display: block; line-height: 0; cursor: pointer; margin-bottom: 24px; text-align: center; }
.floatBox a img{width: 36px; height: 36px; }
.floatBox p{font-size: 10px; color: rgba(204, 228, 255, 0.40); margin-top: 2px; line-height: 12px; }
.floatBox a:nth-child(1){margin-bottom: 16px;}
.floatBox a:nth-child(1) img{width: 60px; height: 60px; }
.floatBox a:nth-child(2) p{color: rgba(76, 212, 255, 0.60);}

.shadow, .loginShadow{background: rgba(0,0,0,0.4); position: fixed; width: 100%; height: 100%; left: 0; top: 0; z-index: 9;}
.contactBox{z-index: 10; box-sizing: border-box; padding: 32px; position: fixed; top: 20%; width: 694px; border-radius: 20px; left: 50%; margin-left: -347px; background: linear-gradient(225deg, #181D35 0%, #0C0A1B 100%); border: 1px solid rgba(125, 178, 241, 0.43); }
.contactBox header{display: flex; margin-bottom: 34px; align-items: center; font-size: 17px; color: #EBF4FF; }
.contactBox header img{cursor: pointer;cursor: pointer; margin-left: auto; width: 27px; height: 27px; }
.contactBox .flex{display: flex; align-items: center; }
.contactBox .left{}
.contactBox .left .item{margin-bottom: 48px;}
.contactBox .left .item:nth-last-child(1){margin-bottom: 0;}
.contactBox .left .item h4{display: flex; margin-bottom: 16px; align-items: center; font-size: 16px; color: #EBF4FF; }
.contactBox .left .item h4 img{width: 20px; height: 20px; margin-right: 6px; }
.contactBox .left .item p{font-size: 14px; padding-left: 28px; margin-top: 7px; color: rgba(204, 228, 255, 0.60); }
.contactBox .right{ margin-left: auto; padding: 1px 26px; width: 301px;height: 327px;border-radius: 20px;border: 1px dashed rgba(204, 228, 255, 0.14); box-sizing: border-box; }
.contactBox .right h4{font-size: 14px; color: #EBF4FF; opacity: 0.6; margin: 16px 0; text-align: center; }
.contactBox .right img{ width: 100%; border: 18px solid #fff; box-sizing: border-box; border-radius: 15px; }

.services{position: fixed; z-index: 10; left: 50%; padding: 32px; box-sizing: border-box; margin-left: -434px; top: 20%; width: 868px; background: linear-gradient(225deg, #181D35 0%, #0C0A1B 100%); border: 1px solid rgba(125, 178, 241, 0.43); border-radius: 26px;}
.services header{display: flex; margin-bottom: 24px; align-items: center; font-size: 17px; color: #EBF4FF; }
.services header img{margin-left: auto; cursor: pointer;width: 27px; height: 27px; }
.services .flex{display: flex; align-items: flex-start; justify-content: space-between; }
.services section{padding: 26px 26px; box-sizing: border-box; margin-top: 16px; }
.services section h4{display: flex; align-items: center; color: #EBF4FF; margin-bottom: 24px; }
.services section h4 img{width: 24px; height: 24px; margin-right: 6px; }
.services section div{font-size: 14px; line-height: 16px; margin-top: 16px; display: flex; justify-content: space-between; align-items: center; color: rgba(204, 228, 255, 0.60);  }
.services section div span{color: #127FFF;}
.services section div span.green{color: #90FFAD;}
.services .sec1{width: 395px;height: 150px;background: url(../images/sbg1.png) no-repeat center; background-size: 100% 100%; border-radius: 10px;border: 1px solid rgba(55, 59, 86, 0.42);}
.services .sec2{width: 395px;height: 165px;background: url(../images/sbg2.png) no-repeat center; background-size: 100% 100%; border-radius: 10px;border: 1px solid rgba(55, 59, 86, 0.42);}
.services .sec3{width: 395px;background: url(../images/sbg3.png) no-repeat center; background-size: 100% 100%; border-radius: 10px;border: 1px solid rgba(55, 59, 86, 0.42);}
.services .sec4{width: 395px; height: 102px; cursor: pointer; font-size: 17px; color: #7883A0; display: flex; align-items: center; justify-content: center; border-radius: 10px;border: 1px solid rgba(55, 59, 86, 0.42);}
.services .sec4 img{width: 24px; height: 24px; margin-right: 4px; }

.downloadfile{position: fixed; z-index: 10; left: 50%; margin-left: -342px; top: 20%; width: 684px; }
.downloadfile header{display: flex; margin-bottom: 22px; align-items: center; font-size: 17px; color: #EBF4FF; }
.downloadfile header img{margin-left: auto; cursor: pointer;width: 27px; height: 27px; }
.downloadfile .list{border-radius: 10px; overflow: hidden; width:600px; height:400px; margin-left:45px; margin-top:65px; }
.downloadfile .tit{height: 50px; color: rgba(204, 228, 255, 0.40);  font-size: 12px; display: flex; align-items: center; line-height: 50px; text-align: center; }
.downloadfile .tit span{flex: 1; box-sizing: border-box; border-left: 1px solid rgba(18, 28, 55, 0.08); }
.downloadfile .tit span:nth-child(1){flex: 2; border-left: none; text-align: left; padding-left: 20px; }
.downloadfile ul{padding:0; margin: 0; height: 430px; overflow-y: scroll; }
.downloadfile ul li{ text-align: center; font-size: 13px; display: flex; align-items: center;height: 33px; }
.downloadfile ul li span{flex: 1; line-height: 50px; color: rgba(204, 228, 255, 0.40); box-sizing: border-box; border-left: 1px solid rgba(18, 28, 55, 0.08);}
.downloadfile ul li span:nth-child(1){flex: 2; padding-left: 20px; text-align: left; display: flex; align-items: center; color: #EBF4FF; border-left: none; }
.downloadfile ul li span:nth-child(1) img{width: 28px; height: 28px; }
.downloadfile ul li div{flex: 1; height: 50px; display: flex; align-items: center; justify-content: center; box-sizing: border-box; border-left: 1px solid rgba(18, 28, 55, 0.08);}
.downloadfile ul li button{ background: none; display: flex; padding: 0; align-items: center; justify-content: center; width: 73px;height: 31px;border: none;}
.downloadfile ul li button img{width: 100%; height: 100%; }

.buycart{position: fixed; z-index: 10; left: 50%; padding: 32px; box-sizing: border-box; margin-left: -339px; top: 15%; width: 678px;background: linear-gradient(225deg, #181D35 0%, #0C0A1B 100%); border: 1px solid rgba(125, 178, 241, 0.43); border-radius: 20px;}
.buycart header{display: flex; margin-bottom: 24px; align-items: center; font-size: 17px; color: #EBF4FF; }
.buycart header img{margin-left: auto; cursor: pointer;width: 27px; height: 27px; }
.buycart header small{font-size: 12px; display: block; margin-top: 10px; opacity: 0.5; }
.buycart .tit{display: flex; font-size: 12px; color: rgba(204, 228, 255, 0.40); align-items: center; padding: 16px 0; border-bottom: 1px solid rgba(18, 28, 55, 0.08);  }
.buycart .tit span{flex: 2;}
.buycart .tit span:nth-child(1),.buycart .tit span:nth-last-child(1){flex: 1;}
.buycart .tit span:nth-child(2){flex: 4;}
.buycart ul{list-style: none; padding: 10px 0; max-height: 340px; overflow-y: scroll; }
.buycart ul li{font-size: 12px; color: #EBF4FF; display: flex; align-items: center; padding: 8px 0; }
.buycart ul li > div{flex: 2;}
.buycart ul li .icon,.buycart ul li .edit{flex: 1;}
.buycart ul li .icon img{width: 14px; height: 14px; cursor: pointer; }
.buycart ul li .img{ flex: 4; height: 55px; display: flex; align-items: center; }
.buycart ul li .name{font-size: 16px; margin-left: 8px; }
.buycart ul li .name small{display: block; margin-top: 12px; font-size: 12px; color: rgba(204, 228, 255, 0.50); }
.buycart ul li .edit img{width: 24px; height: 24px;  cursor: pointer; }
.buycart footer{display: flex; font-size: 10px; color: #EBF4FF; align-items: center; padding-top: 26px;border-top: 1px solid rgba(0, 0, 0, 0.08); }
.buycart footer img{width: 14px; height: 14px; cursor: pointer; margin-right: 6px; }
.buycart footer .green{color: #90FFAD;}
.buycart footer h4{font-size: 12px; color: #EBF4FF; padding-left: 16px; }
.buycart footer h4 small{color: rgba(204, 228, 255, 0.50); margin-top: 8px; display: block; font-size: 10px; }
.buycart footer .btns{margin-left: auto;}
.buycart footer .btns button{width: 139px;height: 40px; cursor: pointer; background: none; padding: 0; border: none; }
.buycart footer .btns button:nth-child(2){width: 113px;height: 40px; margin-left: 12px; cursor: pointer; background: none; padding: 0; border: none; }
.buycart footer .btns button img{width: 100%; height: 100%;}
.buycart ul::-webkit-scrollbar{width: 4px;}
.buycart ul::-webkit-scrollbar-thumb{border-radius: 10px; background: rgba(0, 0, 0, 0.08); }
.buycart ul::-webkit-scrollbar-track{border-radius: 0px; background: rgba(0, 0, 0, 0); }

.gooddetail{z-index: 10;background: #050915; box-sizing: border-box; position: fixed; top: 20%; width: 986px; border-radius: 25px; left: 55%; margin-left: -493px;}
.gooddetail .closebtn{position: absolute; width: 36px; height: 36px; right: 0; top: -48px; cursor: pointer; }
.gooddetail header{ margin-bottom: 16px; }
.gooddetail header .good{display: flex; align-items: center; }
.gooddetail header .good .img{ box-sizing: border-box;cursor: pointer; margin-left: auto; width: 102px;height: 102px;border-radius: 10px;border: 1px solid rgba(255,255,255,0.04);}
.gooddetail header .good .text{ border-bottom: 1px solid rgba(255,255,255,0.06); padding-bottom: 16px;}
.gooddetail header .good h4{font-size: 22px;color: #EBF4FF; margin: 20px 0 10px; display: flex; align-items: center; }
.gooddetail header .good h4 img{width: 40px; height: 23px; margin-left: 2px;}
.gooddetail header .good h5{color: #CCE4FF; font-size: 12px; }
.gooddetail header .good h5 span{ margin-right: 4px;color: #CCE4FF !important;height: 25px; padding: 0 10px; line-height: 25px; background: rgba(255,255,255,0.05);border-radius: 14px; }
.gooddetail header > img{width: 32px; height: 32px; margin-left: auto; cursor: pointer; }
.gooddetail header .price{font-size: 24px; color: #90FFAD; margin-top: 20px; }
.gooddetail header .subtit{display: flex; align-items: center; margin-top: 10px; }
.gooddetail header .subtit span{font-size: 12px; color: #CCE4FF; opacity: 0.4; }
.gooddetail header .subtit .line{width: 1px; height: 8px; background-color: rgba(204, 228, 255, 0.10); margin: 0 8px; }
.gooddetail .flex{display: flex; align-items: center; position: relative; }
.gooddetail .flex .left{ height: 530px; padding: 32px 0 32px 32px; overflow: hidden; line-height: 0; border-radius: 10px; display: flex; align-items: center; }
.gooddetail .flex .left video{width: 280px;height: 99%; margin-right: 16px; object-fit: cover;overflow-clip-margin: content-box;overflow: clip;border-radius:20px}
.gooddetail .flex .right{width: 545px; height: 585px; padding: 32px; margin-left: auto; }
.gooddetail .flex .right .btns{margin-top: 16px; display: flex; align-items: center; }
.gooddetail .flex .right .btns button{background: none; cursor: pointer; padding: 0; border: none; margin-right: 8px; }
.gooddetail .flex .right .btns button img{height: 48px;}
.gooddetail .flex .right .btns .rbtn button{padding: 0 8px; display: flex; align-items: center; justify-content: center; height: 48px; font-size: 14px; color: rgba(204, 228, 255, 0.60); }
.gooddetail .flex .right .btns .rbtn button img{width: 27px; height: 27px;}
.gooddetail .right .flex::before{position: absolute; content: ''; left: 0; bottom: 0; width: 604px; height: 105px; background: url(../images/gbg1.png) no-repeat center; background-size: 100% 100%;   }
.gooddetail .tip{height: 29px; margin-bottom: 10px; display: flex; align-items: center; font-size: 12px; color: #FFCEA1; background: rgba(255,180,110,0.05);border-radius: 16px; padding: 0 10px; }
.gooddetail .tip img{width: 16px; height: 16px; }
.gooddetail .flow{width: 259px; height: 235px; padding: 46px 14px 0; position: relative; border-radius: 10px;border: 1px solid rgba(204,228,255,0.08);}
.gooddetail .flow .tit{position: absolute; width: 74px;height: 28px; display: flex; align-items: center; justify-content: center; background: linear-gradient(270deg, rgba(18,127,255,0.14) 0%, rgba(18,127,255,0) 100%);border-radius: 0px 0px 16px 0px; font-size: 12px; color: #DFEEFF; left: 0; top: 0; }
.gooddetail .flow .small_tit{font-size: 12px; color: #EBF4FF; margin-bottom: 8px; }
.gooddetail .flow .small_tit span{color: #6FB1FF; }
.gooddetail .flow .txt{opacity: 0.4; font-size: 11px; line-height: 16px; color: #CCE4FF; margin-bottom: 40px; }
.gooddetail .tips{width: 275px; padding: 40px 14px 0; position: relative; height: 235px; margin-left: 10px; border-radius: 10px;border: 1px solid rgba(204,228,255,0.08);}
.gooddetail .tips .tit{position: absolute; width: 74px;height: 28px; display: flex; align-items: center; justify-content: center; background: linear-gradient(270deg, rgba(255,174,18,0.14) 0%, rgba(255,61,18,0) 100%);border-radius: 0px 0px 16px 0px; font-size: 12px; color: #FFDBB9; left: 0; top: 0;}
.gooddetail .tips .txt{font-size: 11px; padding-left: 15px; position: relative; margin-bottom: 10px; line-height: 22px; color: rgba(204, 228, 255, 0.50); }
.gooddetail .tips .txt.yellow{color: rgba(255, 206, 161, 0.80);}
.gooddetail .tips .txt::before{position: absolute; left: 2px; top: 8px; width: 4px; height: 4px; border-radius: 50%; background: rgba(204, 228, 255, 0.50); content: ''; }
.gooddetail .applet{position: absolute; top: 80px; right: -115px; padding: 10px; box-sizing: border-box; width: 115px; height: 216px; background: url(../images/gbg2.png) no-repeat center; background-size: 100% 100%; }
.gooddetail .applet img{width: 100%;}
.gooddetail .applet h4{font-size: 12px; color: #EBF4FF; margin: 10px 0 8px; }
.gooddetail .applet p{opacity: 0.4; font-size: 10px; color: #CCE4FF; line-height: 14px; }


.earnings{ padding: 12px 120px; display: flex; align-items: center; }
.earnings .box{margin-left: auto; padding: 0 14px; display: flex; align-items: center; font-size: 12px; color: #FFF7DA; width: 498px; height: 52px; background: url(../images/new_bg2.png) no-repeat center; background-size: 100% 100%; }
.earnings .box span{color: #FFD363; padding-left: 2px; }
.earnings .box big{font-size: 16px; font-weight: bold; }
.earnings .box .slideUpBox{ margin-left: 128px; padding-left:48px; background: url(../images/new_txt.png) no-repeat left center; background-size: 39px 18px;}
.earnings .box .btn{margin-left: auto; cursor: pointer; }
.earnings .box .btn img{height: 28px;}
.earningsBox{ position: fixed; box-sizing: border-box; padding: 265px 52px 0; z-index: 9; left: 50%; top: 50%; margin-top: -431px; margin-left: -431px; width: 862px; height: 861px;background: url(../images/new_bg.png) no-repeat center; background-size: 100% 100%; }
.earningsBox::before{position: absolute; content: ''; display: block; width: 100%; height: 100px; background: linear-gradient(0deg, rgba(15, 17, 25, 1), rgba(0, 0, 0, 0)); left: 0; bottom: 0; z-index: 2; border-radius: 0 0 40px 40px; }
.earningsBox header{display: flex; align-items: center; margin-bottom: 10px; color: #776666; font-size: 12px; }
.earningsBox header span:nth-child(1){flex: 1;}
.earningsBox header span:nth-child(2){flex: 6;}
.earningsBox header span:nth-child(3){flex: 1; text-align: right; }
.earningsBox ul{list-style: none; height: 550px; overflow-y: scroll; padding: 0; margin: 0; }
.earningsBox ul li{ padding: 18px 0; border-bottom: 1px solid rgba(255,255,255,0.04); display: flex; align-items: center; color: #fff; font-size: 14px; }
.earningsBox ul li span{flex: 1;}
.earningsBox ul li .user{flex: 6; opacity: 0.8; }
.earningsBox ul li .count big{font-size: 18px;}
.earningsBox ul li:nth-child(1) span,.earningsBox ul li:nth-child(1) .user,.earningsBox ul li:nth-child(1) .count{color: #FFD363;}
.earningsBox ul li:nth-child(2) span,.earningsBox ul li:nth-child(2) .user,.earningsBox ul li:nth-child(2) .count{color: #EDF9FF;}
.earningsBox ul li:nth-child(3) span,.earningsBox ul li:nth-child(3) .user,.earningsBox ul li:nth-child(3) .count{color: #FF9B63;}
.earningsBox .closeBtn{width: 32px; height: 32px; cursor: pointer; position: absolute; right: 24px; top: 165px; }
.earningsBox .closeBtn img{width: 100%;}
.earningsBox ul::-webkit-scrollbar{width: 4px;}
.earningsBox ul::-webkit-scrollbar-thumb{border-radius: 10px; background: rgba(0, 0, 0, 0.08); }
.earningsBox ul::-webkit-scrollbar-track{border-radius: 0px; background: rgba(0, 0, 0, 0); }

.loginbox{width: 512px;height: 355px; box-sizing: border-box; padding: 30px 30px 0; background: url(/static/backtype.png); background-size: 100% auto; position: fixed; z-index: 10; left: 50%; margin-left: -256px; top: 50%; margin-top: -276px; }
.loginbox header{position: relative;}
.loginbox header .logo{height: 23px;}
.loginbox header p{font-size: 14px; margin-top: 5px; line-height: 16px; color: rgba(235, 244, 255, 0.40); }
.loginbox header .closebtn{position: absolute; right: 0; top: 0; width: 27px; height: 27px; cursor: pointer; }
.loginbox .head{margin-top: 24px; margin-bottom:30px;}
.loginbox .head span{font-size: 18px; cursor: pointer; position: relative; margin-right: 22px; color: rgba(235, 244, 255, 0.40); }
.loginbox .head span.on{color:#328EFF; }
.loginbox .head span.on::before{position: absolute; content: ''; display: block; width: 17px;height: 3px;background: #328EFF;border-radius: 2px 2px 2px 2px; left: 50%; margin-left: -8px; bottom: -6px; }
.loginbox .item{height: 60px; display: flex; align-items: center; margin-bottom: 16px; position: relative; border-radius: 12px 12px 12px 12px;border: 1px solid rgba(255,253,253,0.1);}
.loginbox .item span{width: 80px; height: 20px; font-size: 16px; color: #fff; box-sizing: border-box; padding-left: 16px; border-right: 1px solid rgba(255,253,253,0.1); }
.loginbox .item span.blue{color: #328EFF;}
.loginbox .item input{width: calc(100% - 95px); outline: none; background-color: none; height: 30px; background: none; border: none; box-sizing: border-box; padding-left: 14px; font-size: 16px; color: #CCE4FF; }
.loginbox .item button{position: absolute; padding: 0; cursor: pointer; background: none; border: none; width: 109px; height: 38px; top: 11px; right: 16px; }
.loginbox .item button img{width: 100%;}
.loginbox .item .btn2{position: absolute; border-radius: 8px; padding: 0; font-size: 16px; color: rgba(117, 148, 184, 0.60); cursor: pointer; background: #222442; border: none; width: 109px; height: 38px; top: 11px; right: 16px;}
.loginbox .btn{height: 62px; cursor: pointer; border: none; width: 100%; background: #222442;border-radius: 10px 10px 10px 10px; font-size: 18px;color: rgba(117, 148, 184, 0.40); }
.loginbox .btn.active{background: url(../images/login_btn2.png) no-repeat center; background-size: 100% 100%;  }
.loginbox h4{font-size: 12px; margin: 0; display: flex; align-items: center; color: rgba(204, 228, 255, 0.40); }
.loginbox h4 a{color: #328EFF;}
.loginbox h4 span{margin-left: auto;}
.loginbox .morebtn{cursor: pointer; margin-bottom: 12px; }
.loginbox .morebtn img{width: 100%;}
.passwordbox{height: 466px;}
.passwordbox .item span{width: 90px;}
.loginbox .title{text-align: center; margin-bottom: 24px; }
.loginbox .title h4{font-size: 22px; text-align: center; display: block; color: #EBF4FF; margin-top: 0; margin-bottom: 8px; }
.loginbox .title p{font-size: 12px; color: rgba(235, 244, 255, 0.40); margin-bottom: 0; }
.passwordbox .btn3{height: 62px; color: rgba(204, 228, 255, 0.60); font-size: 18px; text-align: center; cursor: pointer; line-height: 62px; margin-top: 10px; width: 100%; border: none; background: none; outline: none; }
.passwordbox .btn{margin-top: 40px;}
.passwordbox .btn.active{background: url(../images/login_btn3.png) no-repeat center; background-size: 100% 100%;  }
.loginbox .item input::-webkit-input-placeholder {  /* WebKit browsers*/ 
    color: rgba(204, 228, 255, 0.40);
}
.loginbox .item input:-moz-input-placeholder {   /* Mozilla Firefox 4 to 18*/ 
    color: green;
    background-color: #f9f7f7;
    font-size: 14px;
}
.loginbox .item input::-moz-input-placeholder {  /* Mozilla Firefox 19+*/ 
    color: green;
    background-color: #f9f7f7;
    font-size: 14px;
}

.loginbox .item input:-ms-input-placeholder { /* Internet Explorer 10+*/ 
    color: green; 
    background-color: #f9f7f7;
    font-size: 14px;
}
.menus.fixed{position: fixed;left: 0; top: 157px;width: 100%;z-index: 9; }
.recommended{margin-top: 12px;}
.recommended > h4{font-size: 12px; margin-bottom: 20px; position: relative; color: rgba(235, 244, 255, 0.50); }
.recommended > h4::before{ width: 480px; top: 6px; right: 0; height: 1px; background: rgba(255, 255, 255, 0.06); position: absolute; display: block; content: ''; }
.recommended .list{display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.recommended .list .item{margin-bottom: 18px;}
.recommended .list .img{ display: flex; align-items: center; justify-content: center; width: 83px; height: 83px;border-radius: 13px 13px 13px 13px;border: 1px solid rgba(255,255,255,0.08);}
.recommended .list .img img{max-width: 90%; max-height: 90%; }
.recommended .list h4{text-align: center; margin-top: 8px; color: #FFFFFF; font-size: 12px; margin-bottom: 0; width: 85px;
    overflow: hidden;
    white-space: nowrap;}

.giftShow2 {
    width: 359px;
    height: 600px;
    right: 150px;
    bottom: 0px;
    border: 0px;
    /*margin-left: -444px;*/
    /*top: 50%;*/
    margin-top: -334px;
    /*background: #180d3273;*/
    /*background-image: linear-gradient( */
    /*135deg,#131a48,#15182c, #172847, #34103c);*/
    position: fixed;
    z-index: 100;
    padding: 24px;
    border-radius: 8px;
    box-sizing: border-box;
    /*box-shadow: 0px 0px 50px 1px #54545470;*/
}

.giftShow2 .close {
    position: absolute;
    cursor: pointer;
    right: -11px;
    top: -12px;
}

.giftShow2 .pull-left {
    width: 315px;
    height: 620px;
    overflow: hidden;
    border-radius: 4px;
}

.giftShow2 .pull-left img {
    width: 80%;
    margin-top: 300px
}

/* 新增css */
.giftShow2 .pull-left header {
    padding: 10px;
    margin-bottom: 10px;
    border-radius: 8px;
    border: 1px solid rgba(255,255,255,0.1);
    display: flex;
    align-items: center;
}

.giftShow2 .pull-left header .box {
    width: 128px;
    height: 28px;
    color: #fff;
    font-size: 14px;
    border-radius: 4px;
    background: rgba(255,255,255,0.1);
    display: flex;
    text-align: center;
    line-height: 28px;
}

.giftShow2 .pull-left header .box span {
    flex: 1;
    border-radius: 4px;
}

.giftShow2 .pull-left header .box span.active {
    background: #1A5EFF
}

.giftShow2 .pull-left header .info {
    font-size: 12px;
    color: rgba(255,255,255,0.6);
    margin-left: auto;
    text-align: right;
    line-height: 18px;
}

.giftShow2 .pull-left .con {
    width: 100%;
    height: 555px;
}

.giftShow2 .pull-left video {
    height: 100%;
    object-fit: fill;
    border-radius: 4px;
}

.scanCode{}
.scanCode .img{width: 215px; height: 215px; position: relative; margin: 40px auto 15px; box-sizing: border-box; border-radius: 15px; border: 10px solid #fff;  }
.scanCode .img > img{width: 100%; }
.scanCode p{line-height: 21px; font-size: 18px; text-align: center; color: #fff; }
.scanCode .btn{position: absolute; cursor: pointer; width: 215px; height: 215px; left: -10px; top: -10px; background: rgba(0, 0, 0, 0.7); display: flex; flex-direction: column; align-items: center; justify-content: center; }
.scanCode .btn img{width: 32px; height: 32px; }
.scanCode .btn p{font-size: 16px; color: #fff; margin-top: 6px; }


.perfectBox{position: fixed; width: 778px; height: 556px; box-sizing: border-box; padding: 30px 50px 0; left: 50%; top: 50%; z-index: 10; margin-left: -389px; margin-top: -278px; background: url(../images/new2_bg.png) no-repeat center; background-size: 100% 100%; }
.perfectBox header{display: flex; align-items: center; height: 44px; padding-bottom: 20px; font-size: 22px; color: #CDF3FF; font-weight: bold; padding-left: 52px; background: url(../images/new2_icon.png) no-repeat left 0; background-size: 44px 44px; border-bottom: 1px solid rgba(205,243,255,0.06); } 
.perfectBox header img{margin-left: auto; cursor: pointer; width: 27px; height: 27px; }
.perfectBox button{background: none; border: none; margin: 56px auto 0; width: 176px; display: block; }
.perfectBox button img{width: 100%;}
.perfectBox .item{margin-top: 28px;}
.perfectBox .item h4{font-size: 16px; color: #DBEBFF; margin-bottom: 14px; padding-left: 12px; position: relative; }
.perfectBox .item h4::before{position: absolute; left: 0; top: 6px; display: block; width: 4px; height: 4px; border-radius: 1px; background: #3091FF; content: '';  }
.perfectBox ul{list-style: none; padding: 0; margin: 0; display: flex; align-items: center; flex-wrap: wrap; }
.perfectBox ul li{height: 42px; padding: 0 30px; cursor: pointer; line-height: 42px; font-size: 14px; color: rgba(204,228,255,0.4); background: rgba(8,9,27,0.6); margin-right: 16px;border-radius: 8px 8px 8px 8px;}
.perfectBox ul li.on{background: #127FFF; color: #fff; }

.festivalsShow{height: 90px; width: 206px; margin-bottom: 10px; margin-right: 10px; display: block; background: rgba(18,127,255,0.1);border-radius: 12px 12px 12px 12px;border: 1px solid rgba(18,127,255,0.4);}
.festivalsShow header{height: 14px; line-height: 0; text-align: center; }
.festivalsShow header img{height: 100%;}
.festivalsShow ul{display: flex; align-items: center; padding: 4px; justify-content: space-between; flex-wrap: wrap; }
.festivalsShow ul li{width: 95px;height: 30px; margin: 2px; background: rgba(91,166,255,0.1);border-radius: 4px 4px 4px 4px; }
.festivalsShow ul li a{display: flex; align-items: center; height: 100%; padding: 0 8px; }
.festivalsShow ul li a big{font-size: 0.6rem; color: #A8D0FF; }
.festivalsShow ul li a small{ font-size: 0.5rem; padding-top: 2px; color: #5BA6FF; opacity: 0.4; display: block;}
.festivalsShow ul li a span{margin-left: auto; font-size: 0.8rem; color: #45E58E; }



.search_new{margin-bottom: 35px; display: flex; align-items: center;padding: 0 0 0 120px; }
.search_new h6{color: rgba(255, 255, 255, 0.20); margin-bottom: 4px; font-size: 10px; }
.search_new .typebtn{line-height: 0; margin-right: 24px; padding: 7px;background: #0C0D13;border-radius: 12px 12px 12px 12px;border: 1px solid rgba(199,235,255,0.4); }
.search_new .typebtn img{width: 126px; cursor: pointer; }
.search_new .newbtn{ margin-right: 24px; line-height: 0; }
.search_new .newbtn img{height: 36px; cursor: pointer;}
.search_new form{width: 331px;height: 43px; position: relative; border-radius: 24px;border: 1px solid rgba(255,255,255,0.2);}
.search_new form img{width: 24px; height: 24px; position: absolute; left: 12px; top: 9px; }
.search_new form input{width: 100%; height: 100%; background: none; font-size: 12px; color: #fff; padding-left: 40px; border: none; outline: none; box-sizing: border-box; }
.search_new form button{position: absolute;width: 58px;height: 31px;background: rgba(255,255,255,0.2);border-radius: 16px; border:none; outline: none; right:7px;top: 6px; font-size: 12px; color: rgba(255, 255, 255, 0.8); }

/*.flexslider{margin:40px auto;position:relative;width:960px;height:450px;overflow:hidden;zoom:1;}*/
.flex-viewport {
    max-height: 2000px;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    transition: all 1s ease;
}

.flexslider .slides {
    zoom:1;}

.flex-direction-nav a {
    width: 60px;
    height: 90px;
    line-height: 99em;
    overflow: hidden;
    margin: -60px 0 0;
    display: block;
    background: url(../images/ad_ctr.png) no-repeat;
    position: absolute;
    top: 50%;
    z-index: 10;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: all .3s ease;
}

.flex-direction-nav .flex-next {
    background-position: 0 -90px;
    right: 0;
}

.flex-direction-nav .flex-prev {
    left: 0;
}

.flexslider:hover .flex-next {
    opacity: 0.8;
    filter: alpha(opacity=25);
}

.flexslider:hover .flex-prev {
    opacity: 0.8;
    filter: alpha(opacity=25);
}

.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {
    opacity: 1;
    filter: alpha(opacity=50);
}

.flex-control-nav {
    width: 100%;
    position: absolute;
    bottom: 10px;
    text-align: center;
}

.flex-control-nav li {
    margin: 0 5px;
    display: inline-block;
    zoom:1;*display: inline;
}

.flex-control-paging li a {
    background: url(../images/dot.png) no-repeat 0 -16px;
    display: block;
    height: 16px;
    overflow: hidden;
    text-indent: -99em;
    width: 16px;
    cursor: pointer;
}

.flex-control-paging li a.flex-active {
    background-position: 0 0;
}

.flexslider .slides li .img {
    width: 227px;
    height: 329px
}

.datefestivals {
    position: relative;
    padding: 0 5% 0 0;
    margin: 24px 20px 16px;
}

.datefestivals .leftbtn {
    position: absolute;
    width: 38px;
    height: 38px;
    left: 5px;
    top: 10px;
    z-index: 2;
    cursor: pointer;
}

.datefestivals .leftbtn img {
    width: 100%;
    height: 100%;
}

.datefestivals .rightbtn {
    position: absolute;
    width: 38px;
    height: 38px;
    right: calc(5% + 5px);
    top: 10px;
    z-index: 2;
    cursor: pointer;
}

.datefestivals .rightbtn img {
    width: 100%;
    height: 100%;
}

.datefestivals .box {
    width: 100%;
    padding-left: 46px;
    overflow: hidden;
    position: relative;
}

.datefestivals .box::before {
    position: absolute;
    left: 0;
    top: 0;
    width: 98px;
    height: 100%;
    content: '';
    display: block;
    background: linear-gradient(90deg, #10111A 0%, rgba(16,17,26,0) 100%);
}

.datefestivals .box::after {
    position: absolute;
    right: 0;
    top: 0;
    width: 98px;
    height: 100%;
    content: '';
    display: block;
    background: linear-gradient(270deg, #10111A 0%, rgba(16,17,26,0) 100%);
}

.datefestivals ul {
    display: flex;
    align-items: center;
}

.datefestivals .boxright ul {
    justify-content: flex-end;
}

.datefestivals ul li {
    margin-right: 16px;
    padding: 0 6px 0 12px;
    box-sizing: border-box;
    width: 156px;
    height: 57px;
    background: linear-gradient( 270deg, rgba(42,137,252,0.06) 0%, rgba(42,137,252,0.3) 100%);
    border-radius: 9px 9px 9px 9px;
    border: 2px solid rgba(76,168,255,0.12);
    display: flex;
    align-items: center;
}

.datefestivals ul li .img {
    width: 68px;
    text-align: center;
    box-sizing: border-box;
    padding-top: 20px;
    height: 51px;
    font-size: 22px;
    background: url(../images/date_bg2.png) no-repeat center;
    background-size: 100% 100%;
    margin-left: auto;
}

.datefestivals ul li .img big {
    font-size: 20px;
    font-weight: bold;
    background: linear-gradient(180deg, #127FFF 0%, #3CAAFF 100%);
    color: white;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}

.datefestivals ul li .img small {
    font-size: 10px;
}

.datefestivals ul li .text {
    width: 70px;
}

.datefestivals ul li .text big {
    font-size: 14px;
    color: #E6F1FF;
    display: block;
    margin-bottom: 4px;
}

.datefestivals ul li .text small {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.60);
}

.datefestivals ul li.on {
    background: linear-gradient( 270deg, rgba(252,42,42,0.06) 0%, rgba(252,42,74,0.3) 100%);
    border: 2px solid rgba(255,103,76,0.12);
}

.datefestivals ul li.on .img {
    background: url(../images/date_bg.png) no-repeat center;
    background-size: 100% 100%;
}

.datefestivals ul li.on .img big {
    background: linear-gradient(180deg, #FF121A 0%, #FF7451 100%);
    color: white;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}