*{padding:0; margin:0; outline: none; box-sizing: border-box; border: none;}
a{text-decoration: none; color: #000;
	-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
	-webkit-user-select: none;
	-moz-user-focus: none;
	-moz-user-select: none;
}
select{
    background: none;
}
html{
    background-color: #3f5e7d;
    height:100%;
}
ul,li{list-style-type: none;}
body{font-size: 13px; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; line-height:1.5; background:#000000;max-width:480px;margin:0 auto; min-height:100%;}
body.open{width: 100%; height: 100vh; overflow: hidden;}
body.bodybg{background:#ffffff;}
body.aboutbody{ background:#fff url(../images/qd/bj6.png) no-repeat; background-size:100% 170px;}
body.startbg {background: url(../images/qd/tt4.jpg) top center no-repeat #ffffff;
    background-size: 100% 301px;
}
body.serverbody{background:url(../images/qd/login_bg.jpg) no-repeat; background-size:cover; }
body.serverbody:after{
                content: '';
                width:100%;
                height:100%;
                position: absolute;
                left:0;
                top:0;
                backdrop-filter: blur(10px);
                background-image: linear-gradient(to bottom,rgba(255,255,255,0.3),rgba(0,0,0,0.3));
            }
body.securitybody{background:url(../images/qd/login_bg.jpg) no-repeat; background-size:cover; }

.bj2{
    color: #000000;
    margin: 0 26px;
    font-size: 12px;
    font-weight: 400;
    margin-top: 125px;
    padding-bottom: 80px;
    
}
.bj2 p {
    margin-top: 0;
    margin-bottom: 1rem;
}

/* header */
.header{
    width: 100%;
    height: 72px;
    padding: 0 15px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 0px 0px 39px 39px;
    background: #000000;
    justify-content: center;
}
.header h2{
    font-size: 26px;
    color:#fff;
}
.header .logo img{display: block; height: 30px;position: relative;z-index:999;}
.header .user a{display: flex; align-items: center;}
.header .user img{display: block; width: 30px; height: 28px; margin-right: 6px;}
.header .user span{text-decoration: underline; color: #8adcf1; font-weight: bold;}

/* header */
.header2{
    width: 100%;
    height: 60px;
    padding: 0 15px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 0px 0px 30px 30px;
    background: #000000;
    justify-content: center;
    position: relative;
}
.header2 .back{
    position: absolute;
    padding: 0 10px;
    top:0;
    left:8px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.header2 h2{
    font-size: 20px;
    color:#fff;
}

.headerfix{width: 100%; height: 45px; background: #FFF; display: flex; justify-content: center; position: sticky; top: 0;}
.headerfix .back{position: absolute; top: 50%; left: 15px; transform: translateY(-50%);}
.headerfix .back img{display: block; height: 20px;}
.headerfix h2{color: #000; text-align: center; line-height: 45px;}

.index-drawer-wrap{
    position: fixed;
    width:100%;
    height: 100%;
    left:0;
    top:0;
    display: none;
    background:rgba(0,0,0,0.3);
    backdrop-filter: blur(10px);
    z-index: 99;
}

@keyframes drawerwrapshow {
	0% {
		display: block;
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
@keyframes drawerwraphide {
	0% {
	    display: block;
		opacity: 1;
	}
	100% {
		opacity: 0;
		display: none;
	}
}
@keyframes drawershow {
	0% {
		display: block;
		left: -350px;
	}
	100% {
		left: 0;
	}
}
@keyframes drawerhide {
	0% {
		left: 0;
	}
	100% {
		left: -350px;
	}
}

.index-drawer-wrap--show{
    display: block;
    animation: drawerwrapshow .4s;
}
.index-drawer-wrap--show .index-drawer{
    animation: drawershow .4s;
}
.index-drawer-wrap--hide{
    display: none;
    animation: drawerwraphide .4s;
}
.index-drawer-wrap--hide .index-drawer{
    animation: drawerhide .4s;
}


.index-drawer{
    position: absolute;
    max-width: 350px;
    width:100%;
    height: 100%;
    left:0;
    top:0;
    background-color: #fff;
    overflow-y: auto;
}
.index-drawer-head{
    padding: 10px 20px;
    background: url(../images/qd/aside_bg.jpg) no-repeat;
    background-size:cover;
    
}
.index-drawer-user{
    display: flex;
    align-items: center;
    background-image: linear-gradient(to bottom,rgba(148,191,225,0.6),rgba(32,97,155,0.6));
    backdrop-filter: blur(10px);
    border-radius: 22px;
    padding: 30px 20px;
    
}
.index-drawer-user .avatar{
    width: 88px;
    height: 88px;
    border-radius: 4px;
    background-color: rgba(75,97,117,0.1);
}
.index-drawer-user .avatar img{
    width:100%;
    height: 100%;
    object-fit: cover;
    border-radius: 4px;
}
.index-drawer-user .cont {
    margin-left: 15px;
    flex:1;
}
.index-drawer-user .uname{
    font-size: 20px;
    color:#fff;
    display: flex;
    align-items: center;
    font-weight: 600;
}
.index-drawer-user .invitation-code{
    font-size: 14px;
    color:#fff;
}
.index-drawer-user .uname .level_icon{
    height: 21px;
}
.index-drawer-user .progress{
    display: flex;
    align-items: center;
    color:#fff;
    margin-top:8px;
}
.index-drawer-user .progress-s{
    flex:1;
    height: 6px;
    background:rgba(255,255,255,0.5);
    border-radius: 3px;
    position: relative;
    margin-right: 5px;
}
.index-drawer-user .progress-on{
    width:100%;
    height: 100%;
    border-radius: 3px;
    background: #fff;
    position: absolute;
    left:0;
    top:0;
}
.index-drawer-user .member-level{
    height: 26px;
    border-radius: 26px;
    background-color: rgba(0,0,0,0.1);
    border:1px solid rgba(255,255,255,0.2);
    padding: 0 8px 0 2px;
    margin-left: 8px;
    color:#fff;
    font-size: 12px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
}

.index-drawer-wallet {
    display: flex;
    position: relative;
    margin-left: -25px;
}
.index-drawer-wallet:after{
    content: '';
    width:1px;
    height:80px;
    position: absolute;
    left:50%;
    background: rgba(255,255,255,0.2);
    top:50%;
    margin-top: -40px;
}
.index-drawer-wallet ul{
    flex:1;
    padding-left: 25px;
}
.index-drawer-wallet li{
    padding: 5px 0;
    color:#fff;
    font-size: 14px;
    line-height: 20px;
}
.index-drawer-wallet li .label{
    font-size: 12px;
    color:rgba(255,255,255,0.7);
}
.index-drawer-wallet li .value{
    font-weight: 600;
}

.index-partners ul{
    display: flex;
    flex-wrap: wrap;
    gap:10px;
    padding:20px 0;
    
}
.index-partners ul li{
    flex:1;
    width:50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.index-partners ul li img{
    height:96px;
    display: block;
}

/* main */
.section{width: 100%; height: auto; overflow: hidden;}
/* home */


.index-head-main{
    height:262px;
    background:#3f5e7d url(../images/qd/head_bg2.jpg);
    background-size:100% 100%;
    position: relative;
    box-sizing: border-box;
    padding: 15px;
}
.index-head-main .menu-icon{
    width:32px;
    height: 32px;
    background-color: rgba(255,255,255,0.7);
    border-radius: 8px;
    position: absolute;
    left:15px;
    top:15px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.index_user{
    margin-top:130px;
    display: flex;
    align-items: center;
    
}
.index_user .avatar{
    width: 44px;
    height: 44px;
    border-radius: 4px;
    background-color: rgba(75,97,117,0.1);
}
.index_user .avatar img{
    width:100%;
    height: 100%;
    object-fit: cover;
    border-radius: 4px;
}
.index_user .uname{
    font-size: 30px;
    color:#fff;
    display: flex;
    align-items: center;
    margin-left: 10px;
}
.index_user .uname .level_icon{
    height: 24px;
}
.index_user .member-level{
    height: 28px;
    border-radius: 28px;
    background-color: rgba(0,0,0,0.1);
    border:1px solid rgba(255,255,255,0.2);
    padding: 0 8px 0 4px;
    margin-left: 10px;
    color:#fff;
    font-size: 13px;
    font-weight: 600;
    display: flex;
    align-items: center;
}

.index_ad{
    display: flex; 
    align-items: center; 
    font-size: 14px; color: #000;
    padding: 0 10px;
    height:32px;
    background-color: rgba(255,255,255,0.85);
    border-radius: 4px;
    margin-top:20px;
}
.index_ad img{display: block; height: 22px;}

.index{
    padding: 20px;
}
.index-tabs{
    height: 44px;
    border-radius: 22px;
    background: rgba(75,97,117,0.1);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3px;
}
.index-tab-item{
    flex:1;
    display: flex;
    justify-content: center;
    align-items: center;
    height:100%;
    font-size: 14px;
}
.index-tab-item.active{
    background: #fff;
    border-radius: 22px;
    font-weight: 600;    
}

.index_menu ul {
    padding: 20px;
}
.index_menu ul li{
    display: flex; 
    align-items: center;
    height:49px;
    padding: 0 10px;
    background: url(../images/qd/arrow_right.png) no-repeat;
    background-size:23px auto;
    background-position: 100% 50%;
    border-radius: 8px;
}
.index_menu ul li:active{
    background-color: #e9e9e9;
}
.index_menu ul li .img{width: 28px;margin-right:10px;}
.index_menu ul li a {
    display: flex;
    align-items: center;
    width:100%;
    height: 100%;
}
.index_menu ul li img{width: 28px; }
.index_menu ul li p{color:#000; font-size:16px; font-weight:600;}
.index_menu ul li.logout{
   
    background: none;
}
.index_menu ul li.logout p{
     color:rgb(84, 101, 255);
}

.index_vip{background: #FFF;border-radius: 16px;}
.index_vip .title{display: flex; align-items: center; justify-content: space-between; color: #0d152c; margin-bottom: 20px;}
.index_vip .title h2{font-size: 16px;}
.index_vip .title a{font-size: 14px; color: #8adcf1; display: flex; align-items: center;}
.index_vip .title a img{display: block; height: 15px; margin-left: 5px;}
.index_vip .box ul{display: flex; gap:15px;margin-top:15px; padding: 0 10px;flex-wrap: wrap;}
.index_vip .box ul li{border-radius: 22px;background-color:rgba(75,97,117,0.1); flex:1; display:flex; justify-content:center; flex-direction:column; align-items:center;padding:15px 0; font-size:14px;}
.index_vip .box ul li .t img{display: block; height: 45px;}
.index_vip .box ul li .t p{color: #002aa2; font-weight: bold; font-size: 16px; font-weight: bold;}
.index_vip .box ul li .level_id{
    padding-top: 3px;
}
.index_vip .box ul li .level_name{
    color: #DC5050;
    font-weight: 600;
    padding-top: 3px;
    
}
.index_vip .box ul li .level_num{
    font-weight: 600;
    padding-top:8px;
}

.index-info{
    padding: 0 5px;
}
.index-info-item {
    margin-top:23px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.index-info-item .pic{
   width:75px;
   height: 85px;
   background-color: rgba(75,97,117,0.1);
   border-radius: 19px;
}
.index-info-item .pic img{
    width:100%;
    height: 100%;
    border-radius: 19px;
    object-fit: fill;
}
.index-info-item .cont{
    margin-left: 10px;
   flex:1;
}
.index-info-item .title{
    font-weight: 600;
     font-size: 14px;
}
.index-info-item .desc{
     font-size: 12px;
     color:#8b8b8b;
     margin-top:6px;
     line-height: 1.3;
}

.menupop{width: 100%; height: 100vh; position: fixed; top: 0; left: 0; background: rgba(0,0,0,0.5); color: #fff; z-index: 9; display:none; }
.menupop .bg{width:345px; height: 450px; background: #F2F2F6; border-radius: 10px; padding: 15px; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.menupop .bg img{width:56px}
.menupop .bg p{color:#000;margin:8px 0;font-size: 16px;}
.menupop .t img{display: block; height: 50px;}
.menupop .t p{font-weight: bold; color: #fff; padding: 10px 0;}
.menupop .t h2{ padding-bottom: 10px;font-weight: lighter;color:#000;}
.menupop .b{width: 100%; height: 360px; overflow-y: scroll; margin-top: 5px;}
.menupop .b img {width:100%}
.menupop .b::-webkit-scrollbar {display: none;}
.menupop .b h1{padding-top:10px;}
.menupop .b p{color: #000; padding: 7px 0; line-height: 1.8; font-size: 14px;}
.menupop .b p img {width:100%;}
.menupop .menupopHide{color: #000; cursor: pointer; position: absolute; top: 10px; right: 10px; font-size: 25px;}

/* starting */
.starting{padding: 0 20px 60px 20px;}
.starting .view_one{ border-radius: 10px;}

.starting .view_one ul{
    padding: 0 5px;
}
.starting .view_one ul li{
    width:50%;
    float: left;
    margin-top: 40px;
    box-sizing:border-box;
}
.starting .view_one ul li p {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 5px;
    color:#fff;
}
.starting .view_one ul li h2{
    font-size: 16px;
    font-weight: 600;
    color:#fff;
}
.starting .view_one ul:after{
    content: '';
    display: block;
    clear: both;
}
.starting .view_two img{width: 100%; border-radius: 10px; display: block;}
.starting .view_three {
    margin-top: 76px;
}
.starting .view_three a {
    font-weight: 700;
    background: #3145FF;
    padding: 0px 88px;
    border-radius: 6px;
    margin-bottom: 20px;
    color: #ffffff;
    width:100%;
    height: 50px;
    width:100%;
    display: block;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* alert */
.fixinfo_back {display:none;width:100%;height:100%;position:fixed;top:0;left:0;overflow:auto;background:rgba(0,0,0,0.4)}
.fixinfo{width: 80%; height: auto; border-radius: 10px; padding: 0 15px; position: fixed; margin-left:10%;background:#FFF;}
.fixinfo .title{padding: 25px 0 30px; display: flex; justify-content: space-between;}
.fixinfo .title h2{color: #002aa2;}
.fixinfo .title img{width: 30px;}
.fixinfo .thumb img{display: block; height: 70px; border-radius: 10px; margin: 0 auto;}
.fixinfo .thumb p{text-align: center; color: #0d152c; font-size: 16px; color: #0d152c; padding: 20px 0;}
.fixinfo .u1{display: flex; justify-content: space-between; padding: 10px 0 25px;}
.fixinfo .u1 li{color: #0d152c;}
.fixinfo .u1 li p{font-size: 14px;}
.fixinfo .u1 li h2{color: #002aa2; padding-top: 5px;}
.fixinfo .u1 li{flex: 1; flex-direction: column; display: flex; justify-content: center; align-items: center;}
.fixinfo .u2{border-top: 1px solid #24345d;}
.fixinfo .u2 li {display: flex; align-items: center; justify-content: space-between; padding: 20px 0; border-bottom: 1px solid #24345d;}
.fixinfo .u2 li p:first-child{font-size: 16px; color: #0d152c; font-weight: bold;}
.fixinfo .u2 li p:last-child{font-size: 14px; color: #999;}
.fixinfo button{width: 100%; margin: 20px 0;background: linear-gradient(180deg,#002aa2,#002aa2); color: #fff; text-align: center; height: 50px; line-height: 50px; border-radius: 15px; font-size: 15px;}
.article {padding: 16px;}
/* cert */
.cert{padding: 35px 15px 15px; overflow: hidden;}
.cert img{ width: 100%; margin-bottom: 10px;}

/* withdraw */
.withdraw {
    padding: 20px;
}
.withdraw .tabnav ul{display: flex; align-items:center; justify-content:center; height:32px;padding: 0px 2px;border-radius: 60px; background-color: rgba(75,97,117,0.1); }
.withdraw .tabnav ul li{flex: 1; text-align: center; height: 28px; line-height:28px;}
.withdraw .tabnav ul li a{color: #000; font-size: 12px; display:block;}
.withdraw .tabnav ul li.on {
    background-color: #fff;
    border-radius: 20px;
}
.withdraw .tabnav ul li.on a{color: #02369C; font-weight: bold;}

.withdraw .tabbox { 
    color: #fff;
    background: #ffffff;
    border-radius: 20px;
    box-shadow: 0px 2px 6px 0px rgba(75,97,117,0.3);
    padding-bottom: 25px;
    margin-top: 20px;
    color: #2E2E2E;
    line-height: 1.2;
    font-size: 12px;
    padding-top:30px;
}
.withdraw .tabbox .head{
    text-align: center;
}
.withdraw .tabbox01{ color: #ffffff;}
.withdraw .method {
    padding: 0.8rem 1rem;
    font-size: 0.85rem;
    background: rgba(75,97,117,0.1);
    border-radius: 20px;
    margin: 20px;
}
.withdraw .method .title{
    font-size: 16px;
    font-weight: 600;
    text-align: left;
    color: #32373C;
    margin-bottom: 10px;
}
.withdraw .method p{
    font-weight: 500;
    color: #585858;
    font-size: 14px;
    color: #444444;
}
.withdraw .one{padding: 0 15px;}
.withdraw .one .t{padding: 20px 15px; margin:15px 0 10px; border-radius: 10px; background: #F2F2F2;color: #000;}
.withdraw .one .t p{font-size: 14px;}
.withdraw .one .t h2{font-size: 20px; padding: 10px 0;}
.withdraw .one .b h2{font-size: 16px; padding: 10px 0;}
.withdraw .one .b article{font-size: 14px;}
.withdraw .one .item{
    padding: 20px 15px;
    height: 49px;
    background-color: rgba(75,97,117,0.1);
    border-radius: 10px;
    display: flex;
    align-items: center;
    margin-top:15px;
    justify-content: space-between;
}
.withdraw .one .item .label{
    font-size: 13px;
    font-weight: 600;
}
.withdraw .one .item p{color: #000; font-size: 16px; padding-right: 10px; text-align: justify; white-space:nowrap;}
.withdraw .one .item input{
    background: none;
    color: #000;
    font-size: 13px;
    height: 28px;
    text-align: right;
    padding: 0 10px;
    border-radius: 20px;
    max-width: 50%;
}
.withdraw .one .item input::placeholder {
    color:rgba(0,0,0,0.3);
}
.withdraw .one .item .all{
    color:#3560AB;
    cursor: pointer;
    text-decoration: underline;
    font-weight: 600;
}
.withdraw .one .item input:focus{
    background-color: #fff;
}

.withdraw .one .item.end{border-bottom: none;}
.withdraw .one button{
    width: 100%;
    background: #0085FF;
    text-transform: inherit;
    color: #fff; 
    text-align: center; 
    height: 50px;
    line-height: 50px; 
    border-radius: 15px;
    font-size: 15px;
    max-width: 244px;
    margin-top: 20px; 
    box-shadow: 0 .3rem 0.6rem rgba(0, 0, 0, .1) !important;
}
.withdraw .button-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
}

.withdraw .two ul li{
    padding: 15px 20px;
    box-shadow: 0px 2px 6px 0px rgba(75,97,117,0.2);
    color: #0d152c;
    border-radius: 15px;
    margin-top:15px;
    display: flex;
}
.withdraw .two ul li .flex-1{
    flex: 2;
    flex-shrink: 0;
}
.withdraw .two ul li .flex-1 p{
    color:#707070;
    font-weight: 600;
}

.withdraw .two ul li .time{
    font-weight: 500;
    color:#2e2e2e;
}
.withdraw .two ul li .price{
    font-weight: 600;
    font-family: 'Roboto', sans-serif;
}

.withdraw .two ul li .status {
    border: 1px solid #3a2c71;
    border-radius: 8px;
    padding: 0 10px;
    color: #3a2c71;
    height: 24px;
    line-height: 22px;
    font-weight: 600;
    margin-top: 4px;
    display: inline-block;
}
/* deposit */
.deposit .one .t h2{padding-bottom: 0;}
.deposit .checkbox ul{display: flex; justify-content: space-between;}
.deposit .checkbox ul li{flex:0 0 31%; padding: 20px 0px; color:#999; text-align: center; border-radius: 10px; background-color: #141e42; color: #999; margin-bottom: 10px;}
.deposit .checkbox ul li .p1,.deposit .checkbox ul li .p3{font-size: 14px;}
.deposit .checkbox ul li .p2{font-size: 16px; padding: 5px 0; font-weight: bold;}
.deposit .checkbox ul li.on{background: linear-gradient(180deg,#ffc301,#fe262c)!important; font-weight: bold; color: #000;}
.deposit .inputbox{background-color: #141e42; display: flex; justify-content: space-between; padding: 20px; border-radius: 10px; font-size: 15px; color: #f86701; position: relative;}
.deposit .inputbox input{background: none; text-align: right; font-size: 15px; color: #0d152c;}
.deposit .three ul li{color: #0d152c; padding: 20px; border-radius: 10px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #30435e;}
.deposit .three ul li .l h2{font-size: 14px; padding-bottom: 5px;}
.deposit .three ul li .r{display: flex; flex-direction: column; justify-content: flex-end;}
.deposit .three ul li .r span{width: auto; margin-left: auto; background: linear-gradient(180deg,#ffc301,#fe262c); padding: 2px 10px; color: #111; border-radius: 10px; margin-bottom: 5px; font-weight: 700;}
.deposit .three ul li .r p{color: #717779; font-size: 14px; font-weight: bold;}

/* viplevel */
.viplevel{padding: 15px 15px 0 15px;}
.viplevel ul li{display: flex; padding: 20px 15px; border-radius: 10px; position: relative; margin-bottom: 15px; background-color: #fff;}
.viplevel ul li .img{margin-right: 10px;}
.viplevel ul li .img img{display: block; height: 50px; position: relative; top: -5px;}
.viplevel ul li .info h2{color: #330000; font-size: 16px; display: flex; align-items: center;}
.viplevel ul li .info h2 .active{font-size: 12px; color: #9d9d9d; border: 1px solid #dcdcdc; padding: 2px 8px; border-radius: 3px; margin-left: 10px;}
.viplevel ul li .info h3{color: #002aa2; font-size: 13px; margin: 10px 0;}
.viplevel ul li .info p{color: #a8a8a8; font-size: 13px;}
.viplevel ul li .update{position: absolute; top: 20px; right: 15px; color: #0d152c; text-decoration: underline; font-size: 13px;}

/* records */
.records{padding: 20px;}

.records .tabnav ul{display: flex; align-items:center; justify-content:center; height:32px;padding: 0px 2px;border-radius: 60px; background-color: rgba(75,97,117,0.1); }
.records .tabnav ul li{flex: 1; text-align: center; height: 28px; line-height:28px;}
.records .tabnav ul li a{color: #000; font-size: 12px; display:block;}
.records .tabnav ul li.on {
    background-color: #fff;
    border-radius: 20px;
}
.records .tabnav ul li.on a{color: #02369C; font-weight: bold;}


.records .tabbox li{
    border-radius: 20px;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
    margin-top: 25px;
    padding: 15px 15px 20px 15px;
    
    background-color: rgba(75,97,117,0.1); 
}
.records .tabbox li:after{
    content: '';
    width:100%;
    height: 100%;
    position: absolute;
    left:0;
    top:0;
    background-color: rgba(0,0,0,0.4);
}
.records .tabbox li .split-line{
    height:1px;
    background: rgba(255,255,255,0.5);
    width:100%;
    position: relative;
    z-index: 1;
    
}
.records .tabbox li .info{
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    font-size: 13px; 
    line-height: 18px;
    min-height: 36px;
    align-items: center;
    color:#fff;
}
.records .tabbox li .info h2{
    font-size: 13px;
    font-weight: 400;
    
}
.records .tabbox li .tip{
    position: relative;
    z-index: 1;
    border-radius: 8px;
    font-weight: 500;
    font-size: 13px;
    background-color: #b6c6ff;
    margin-top: 10px;
    background: #b6c6ff;
    border: 1px solid rgba(0,0,0,0.1);
    height: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.taskshow{
    padding: 20px;
}
.taskshow .flztoa{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.taskshow .tabs_btn{
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top:10px;
}
.taskshow .tabs_btn .submit {
    width: 100%;
    padding: 0.8rem 0;
    background: rgb(198, 42, 28);
    border-radius: 60px;
    text-transform: none;
    margin: 0px 39px;
    color: rgb(255, 255, 255);
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
    font-size: 16px;
}

.taskshow .rate {
    display: flex;
    align-items: center;
}
.taskshow .rate .rate__item{
    width: 18px;
    height: 18px;
    display: flex;
    margin:0 3px;
}
.taskshow .rate .rate__item .rate__icon{
    width:100%;
    height: 100%;
    background-image: url(../images/qd/star-light-svgrepo-com.svg);
    opacity: 0.6;
    background-size: 100% 100%;
    transition: .3s;
}
.taskshow .rate .rate__item.on .rate__icon{
    background-image: url(../images/qd/star-svgrepo-com.svg);
    transform: scale(1);
    opacity: 1;
}

.tooertt {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 998;
    background: #ffffff;
    padding: 20px;
    box-shadow: 6px 11px 12px 6px #000000bf;

}
.tooertt .title{
    display: flex;
    align-items: center;
    justify-content: space-between;
        padding-bottom: 20px;
}
.tooertt label {
    font-size: 12px;
    padding: 10px 0px;
    display: block;
}
.tooertt label:active{
    background-color: #f9f9f9;
}
/* user */
.userbox{padding: 0 15px;}
.usertop{background: #fff; padding: 15px 0; margin: 60px 0 30px; border-radius: 10px; position: relative;}
.usertop .userface{position: absolute; top: -45px; left: 50%; transform: translate(-50%,0);}
.usertop .userface img.face{width: 80px; height: 80px; border-radius: 100%; border: 8px solid #0d152c;}
.usertop .userface p{display: flex; align-items: center; font-size: 16px; color: #0d152c; margin-top: 10px;}
.usertop .userface p img{ height: 25px; margin-left: 5px; position: relative; top: 2px;}
.usertop .invite_code{ font-size: 12px !important;color: #94c2cf !important;}
.usertop .invite_code span{ margin-left: 8px;}
.userbox .userinfo ul{display: flex; justify-content: space-between; padding-top: 120px; color: #000; text-align: center;}
.userbox .userinfo ul p{padding-top: 5px;}
.userbox .userinfo ul h2{color: #0d152c; font-size: 13px; padding-top: 5px;}
.userbox .userinfo ul li{flex: 1;}
.userbox .userinfo ul li:nth-child(2){border-right: 1px solid rgb(96, 111, 28); border-left: 1px solid rgb(96, 111, 28);}
.userbox .userlist{background: #fff; border-radius: 10px;}
.userbox .userlist dl dt{padding: 25px; border-bottom: 1px solid #24345d; font-size: 16px; font-weight: bold; color: #0d152c;}
.userbox .userlist dl dd{border-bottom: 1px solid #24345d;}
.userbox .userlist dl dd a{color: #000; font-size: 15px; display: flex; align-items: center; width: 100%; padding: 15px 25px; background: url(../images-02.png) no-repeat right 20px center; background-size: auto 15px; }
.userbox .userlist dl img{display: block; height: 25px; margin-right: 15px;}
.userbox .userlist dl dt.end{border-bottom: none; padding: 0px;}
.userbox .userlist dl dt a{text-align: center; display: block; width: 100%; padding: 25px; color: #fe262c;}
.userbox .footer{padding-bottom: 50px;}
.userbox .index_menu ul li {width: 33% !important;}
.userbox .index_menu ul li .img{width: 80px !important;height:80px !important}
.userbox .index_menu ul li img {width: 60px !important;height:60px !important}
.contactuspop{width: 100%; height: 100vh; padding: 0 10px; display: none; position: fixed; top: 0; background: rgba(0,0,0,0.5); overflow: hidden;}
.contactuspop .bg{width: 100%; height: 100vh; position: relative;}
.contactuspop .box{ position: absolute; width: 100%; bottom: -100%;}
.contactuspop .box ul{background: #0d152c; border-radius: 5px;}
.contactuspop .box ul li{height: 44px; line-height: 44px; text-align: center; font-size: 18px;}
.contactuspop .box .contactuspopclose{background: #0d152c; border-radius: 5px; height: 44px; line-height: 44px; text-align: center; font-size: 18px; margin-top: 6px;}

/* Transaction */
.transaction{ padding: 15px;}
.transaction ul li{background: #fff; display: flex; align-items: center; padding: 15px; border-radius: 5px; margin-bottom: 10px;}
.transaction ul li img{display: block; height: 36px; margin-right: 15px;}
.transaction ul li .info{color: #0d152c; }
.transaction ul li .info h2{font-size: 14px; margin-bottom: 8px;}
.transaction ul li .info .timeprice{display: flex; align-items: center; justify-content: space-between;}
.transaction ul li .info .timeprice span{color: #f86701; font-weight: bold;}

/* profile */
.profile{padding: 15px;}
.profile dt{background: url(../images/next4.png) no-repeat right 15px center; background-size: auto 15px;}
.profile dt a{display: flex; justify-content: space-between; padding: 20px; align-items: center; border-bottom: 1px solid #24345d;}
.profile dt a p{color: #000; font-size: 16px;}
.profile dt img{display: block; width: 30px; border-radius: 100%; margin-right: 10px;}
.profile dl{background: #fff; border-radius: 10px; margin-bottom: 10px;}
.profile dl dd{border-bottom: 1px solid #24345d;  background: url(../images/next4.png) no-repeat right 20px center; background-size: auto 15px;}
.profile dl dd a{display: flex; justify-content: space-between; align-items: center; font-size: 16px; color: #9b9b9b; padding: 20px; width: 100%;}
.profile dl dd a p{color: #000;}
.profile dl dd a span{font-size: 14px; padding-right: 15px;}
.profile dl dd:last-child{border-bottom: none;}
.profile form{width: 0px; height:0px; overflow: hidden;}


.edit_pwd {
    padding: 20px;
}
.edit_pwd .tabnav ul{display: flex; align-items:center; justify-content:center; height:44px;padding: 0px 3px;border-radius: 60px; background-color: rgba(199,199,199,0.6);  font-weight:600; }
.edit_pwd .tabnav ul li{flex: 1; text-align: center; height: 38px; line-height:38px;}
.edit_pwd .tabnav ul li a{color: #000; font-size: 13px; display:block;}
.edit_pwd .tabnav ul li.on {
    background-color: #fff;
    border-radius: 20px;
}
.edit_pwd .tabnav ul li.on a{color: #02369C; }

.personalform{ 
    padding: 25px 15px;
    background-color: rgba(196,196,196,0.6);
    border-radius: 30px;
    margin: 0 25px;
}
.personalform ul li{width:100%;padding:0 15px;height:49px; display: flex; align-items: center; justify-content:space-between;  background: #fff; border-radius: 8px; border: 1px solid #e0e0e0; box-shadow: 0px 1px 0px 0px #00000029 inset; }
.personalform ul li + li{margin-top:15px;}
.personalform ul li input{ background: none; color: #252525; font-size: 13px; width:100%;flex:1; text-align:center; height:32px; }
.personalform ul li input::placeholder{font-size: 13px; color:rgba(0,0,0,0.5);}
.personalform ul li p{
    flex:1;
}
.personalform ul li p+input{
    text-align:right;
}

.personalform-submit,
.personalform button{width: 100%; margin: 30px auto 0; background-color: #3145FF; color: #fff; text-align: center; height: 50px; display: block; border-radius: 10px; font-size: 15px;}

.personalform-submit {
    box-shadow: 0 6px 12px rgba(0, 0, 0, .1);
    border-radius: 18px;
}

.personalform .tip{color:#fff; text-align:center; padding-top:20px;}

/* withdrawalinfo */
.withdrawalinfo{padding: 15px;}
.withdrawalinfo .t{color: #000; text-align: center; line-height: 1.6; padding: 15px 0; font-size:12px;}


/* notifications */
.notifications{padding: 15px;}
.notifications ul li{background: #fff; padding: 15px; border-radius: 5px; margin-bottom: 10px;}
.notifications ul li p{font-size: 14px; margin-bottom: 8px; color: #0d152c;}
.notifications ul li time{color:#f86701;}

/* invitation */
.invitation{padding:15px;}
.invitation .bg{ margin-top:16vh; width: 100%; height:auto; overflow: hidden; background: #050e1f; border-radius: 10px; padding:30px 15px;  }
.invitation .t img{height:50px; display: block; margin:0 auto;}
.invitation .t h2{color:#f86701; text-align:center; font-size:18px; padding:20px 0; }
.invitation .t p{color:#0d152c; text-align:center; }
.invitation .b{padding: 15px; border-radius: 10px; margin-top: 15px; background: linear-gradient(90deg,#32588d,#16203f);  color: #0d152c; display: flex; justify-content: space-between; align-items: center;}
.invitation .b p{font-size:14px; padding-bottom:3px;}
.invitation .b h2{font-size: 17px;}
.invitation .b a{padding:12px 10px; font-weight:bold; font-size:13px; color: #0d152c; border-radius: 5px; overflow: hidden; display: block; background: linear-gradient(90deg,#282184,#f76186);}

/* footer */
.footer{padding: 30px 0 105px; text-align: center; color: #fff;}
.footerfix_box{height: 80px;}
.footerfix{width: 100%;height: 80px; background: #FFF; position: fixed; bottom: 0px; border-top: 1px solid #fff;padding-top: 16px}
.footerfix ul{display: flex; align-items: center;}
.footerfix ul li{flex: 1; height: 50px; display: flex; align-items: center; justify-content: center; flex-direction: column;}
.footerfix ul .active{margin-top: -48px;}
.footerfix ul li a{display: flex;flex-direction: column;align-items: center;}
.footerfix ul .active a div{background: linear-gradient(180deg,#FFF,#FFF); border-radius: 50%; padding: 10px; }
.footerfix ul .active img {height:64px;}
.footerfix ul li img{display: block; height: 40px; margin: 0 auto;}
.footerfix ul li p{color: #000; margin-top: 5px;}

/* login register */
.login {width: 100%; min-height: 100vh; overflow: hidden;background:url(../images/qd/login_bg.jpg) no-repeat; background-size:cover; position:relative; }

.login .logo{padding-top: 150px;}
.login .logo img{display: block; width: 200px; margin: 0 auto;}

.login .form{
    position: relative;
    max-width: 350px; 
    height: auto;

    margin: 30px auto 0;
   
}

.login .item{width:100%;padding:0 15px;height:49px; display: flex; align-items: center; justify-content:center;  background: #fff; border-radius: 8px; border: 1px solid #e0e0e0; box-shadow: 0px 1px 0px 0px #00000029 inset; margin-top:15px;}
.login .item p{color: #000; font-size: 16px; padding-right: 10px; text-align: justify; white-space:nowrap;}
.login .item input{ background: none; color: #252525; font-size: 16px; width:100%; height:32px; text-align:center;}
.login .item input::placeholder{font-size: 14px; color:#999;}
.login .item input[type=radio]{
    width:20px;
    height: 20px;
    margin-right: 5px;
}
.login .form .item label{
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 10px;
    font-size: 14px;
}
.login .form .item:first-child{
    margin-top:0px;
}

.login .submit-btn{
    width:100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin:30px auto 0;
}
.login button{
    width:224px;
    height:49px;
    border-radius: 8px;
    background-color: #3145FF;
    font-size: 14px;
    box-shadow: 0px 0px 0px #00000014;
    color: #ffffff !important;
    font-weight: 700;
    border: 0px solid #3560AB;
}

.login .reg-link{
    text-align: center;
    font-size:14px;
    font-weight: 600;
    padding-top:30px;
    
}
.login .reg-link a{
    color:#fff;
}

.login .agree{color: #252525;max-width:350px;margin:0 auto; display: flex; align-items: center; padding: 15px 0 10px 15px;}
.login .agree input{width: 16px; height: 16px; margin-right: 8px; background-color: none;  border: 1px solid #000; border-radius: 2px;  text-align: center; line-height: 15px;-webkit-appearance:none; appearance:none; outline: none; color:rgba(255,255,255,0)}
.login .agree input:checked {color: #fff; background-color: #000; }
.login .agree input:after {content: "\2713";} 
.login .agree a{color: #252525; text-decoration: underline;}
.login .foot{color: rgba(255,255,255,0.7); text-align: center; padding: 50px 0 25px;}

.login .tips{
    font-size: 10px;
    color:#fff;
    display: flex;
    justify-content: center;
    align-content: center;
    line-height: 44px;
    color:#fff;
}

.bodyreg .login .form{
    padding: 30px 35px;
    border-radius: 16px;
    background: rgba(196,196,196,0.6);
    max-width: 350px;
    margin:0 auto;
    box-sizing: border-box;
    
}

.agreeinfo{width: 100%; height: 100vh; display: none; overflow-y: scroll; position: fixed; top: 0; background: #fff;}
.agreeinfo .tit{width: 100%; height:44px; background: #002aa2; display: flex; justify-content: center; position: fixed; background: #;}
.agreeinfo .tit h2{font-size: 16px; color: #fff; line-height: 44px;}
.agreeinfo .tit a{position: absolute; left: 15px; top: 50%; transform: translateY(-50%);}
.agreeinfo .tit a img{ height:20px;}
.agreeinfo .article{padding: 60px 15px 0; color: rgba(0,0,0,0.5); font-size: 14px;}
.agreeinfo .article article{padding-bottom: 20px;}
.agreeinfo .article p{line-height: 1.5; padding: 5px 0;}




/* public */
.msgpop{    z-index: 9999;width: auto; height: auto; overflow: hidden; display: none; padding: 15px 30px; border-radius: 10px; line-height: 1.6; font-weight: bold; white-space:nowrap; text-align: center; background: rgba(0,0,0,0.8); color: #fff; position: fixed; left: 50%; top: 50%; transform: translate(-50%,-50%);}

.alertpop{width: 100%; height: 100vh; overflow: hidden; display: none; position: fixed; top: 0; left: 0; background: rgba(0,0,0,0.5);}
.alertpop .box{width: 300px; height: auto; border-radius: 10px; background: #fff; overflow: hidden; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.alertpop .box .h2{text-align: center; padding-top: 25px; font-size: 18px; color: rgba(0,0,0,0.9);}
.alertpop .box article{height: 88px; line-height: 1.6; font-size: 15px; display: flex; align-items: center; justify-content: center; text-align: center; color: #999;}
.alertpop .box .btn a{display: block; width: 100%; height: 48px; line-height: 48px; text-align: center; color: #ffac07; font-size: 16px; border-top: 1px solid #eaeaeb;}

.confirmpop{width: 100%; height: 100vh; overflow: hidden; display: none; position: fixed; top: 0; left: 0; background: rgba(0,0,0,0.5);}
.confirmpop .box{width: 300px; height: auto; border-radius: 10px; background: #fff; overflow: hidden; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.confirmpop .box .h2{text-align: center; padding-top: 25px; font-size: 18px; color: rgba(0,0,0,0.9);}
.confirmpop .box article{height: 88px; line-height: 1.6; font-size: 15px; display: flex; align-items: center; justify-content: center; text-align: center; color: #999;}
.confirmpop .box .btn{display: flex;}
.confirmpop .box .btn a{display: block; flex: 1; height: 48px; line-height: 48px; text-align: center; color: #009900; font-size: 16px; border-top: 1px solid #eaeaeb;}
.confirmpop .box .btn a:first-child{color: #000;}

.selectpop{width: 100%; height: 100vh; padding: 0 10px; display: none; position: fixed; top: 0; background: rgba(0,0,0,0.5); overflow: hidden;}
.selectpop .bg{width: 100%; height: 100vh; position: relative;}
.selectpop .box{ position: absolute; width: 100%; bottom: -100%;}
.selectpop .box ul{background: #0d152c; border-radius: 5px;}
.selectpop .box ul li{height: 44px; line-height: 44px; text-align: center; border-bottom: 1px solid #f0f0f1; font-size: 18px;}
.selectpop .box ul li:last-child{border-bottom: none;}
.selectpop .box .selectpopclose{background: #0d152c; border-radius: 5px; height: 44px; line-height: 44px; text-align: center; font-size: 18px; margin-top: 6px;}

.loading{width: auto; height: auto; overflow: hidden; display: none; padding: 15px 30px; border-radius: 10px; line-height: 1.6; font-weight: bold; white-space:nowrap; text-align: center; background: rgba(0,0,0,0.5); color: #0d152c; position: fixed; left: 50%; top: 50%; transform: translate(-50%,-50%);}
.loading img{width: 35px;}
.loading p{font-size: 14px;}
.imageList{
        overflow-x: auto;
        overflow-y: hidden;
        height:180px;
        white-space: nowrap;
      img{
        width:auto;
        height:100%;
        margin-right:10px;
      }
 }
.handle-container{
    width: 59px;
    background: linear-gradient(90deg, #29134b 0%, #3433d9 100%);
    border-radius: 15px 0 0 15px;
    padding: 6px 0 6px 12px;
    display: flex;
    display: -webkit-flex;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    align-items: center;
    -webkit-align-items: center;
    flex-direction: row;
    -webkit-flex-direction: row;
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
    position: absolute;
    right: 0;
    top: 70px;
    border: solid 1px #777596;
}
.handle-container .handle-text{
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 18px;
    margin-right: 4px;
    color: #ffffff;
}
.handle-container i{
    border: solid #ffffff;
    border-width: 0px 3px 3px 0;
    display: inline-block;
    padding: 3px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    margin-right: 8px;
}