html,body{margin:0 auto;/* background:#cc2d28;*/
 font-size:12px;}
ul,ul li,h1,h2,h3,h4{margin:0;padding:0;list-style:none;}
.VS{background:transparent;}
.canvas{max-width:120px;}
.extbox,.canvas{position:relative;float:left;margin:0 0 10px 0;width:50%;box-sizing:border-box;padding-left:5px;background:transparent;}
.resultbox ul{min-height:auto;}
.canvas{padding:0;}
.download{border-radius:1000px;background:#1D4B8F;color:#ffffff;display:flex;line-height:45px;justify-content:center;align-items:center;align-self:stretch;}
.match{box-shadow:0 2px 5px #dddddd;margin:5px 5px 10px 5px;}
.mainbox{margin:0 8px;}
.conveycen .name{color:#666;font-size:14px;}
.share{padding:5px 14px 8px 14px;background:#ededed;display:flex;flex-direction:column;gap:10px;font-size:14px;}
.share div{/*display:flex;*/
 align-items:center;box-sizing:border-box;}
.share .info{flex-direction:column;width:100%;flex-wrap:wrap;/*padding:8px;*/
 height:56px;line-height:28px !important;}
.share .info .company{flex:0 0 50%;flex-direction:column;align-items:flex-start;border-right:solid 1px #f1f1f1;padding:5px;}
.miniMatch div{height:32px;line-height:32px;}
.share .info .ai{flex:0 0 50%;}
.share .info .match{align-items:center;width:100%;position:relative;line-height:50px;font-size:16px;}
.share .info .match>div{display:flex;flex:1;justify-content:center;}
.share .tabs{background:#f1f1f1;padding:2px;border-radius:1000px;min-width:80px;text-align:center;margin:0 5px;}
.share .ai{padding:5px;}
.oddbox span:nth-child(1){background:#f1f1f1;border-radius:100px 0 0 100px;}
.oddbox span:nth-child(2){background:#f1f1f1;margin:0;border-radius:0 100px 100px 0;}
.oddbox span.on{background:#d0eaff;color:#1a9de1 !important;}
.share .tabs .tab{justify-content:center;min-width:40px;color:#666666;font-size:12px;line-height:26px;}
.share .tabs .tab.on{background:#ffffff;color:#333333;border-radius:1000px;min-width:40px;justify-content:center;font-weight:bold;}
.share .info .match i{position:absolute;right:-8px;top:10px;font-size:12px;background:var(--bg-secondary,#F4F4F4);justify-content:center;text-align:center;height:30px;width:30px;line-height:30px;border-radius:10px 0 0 10px;align-items:center;font-style:normal;}
.share .box{flex-direction:column;background:#ffffff;border-radius:8px;align-items:flex-start;}
.share .box .tit{display:flex;align-items:center;background:#F4F4F4;padding:0 8px;line-height:40px;width:100%;gap:5px;}
.share .user{display:flex;gap:10px;}
.share .user .name{font-size:15px;font-weight:bold;}
.share .user .icon{border-radius:1000px;overflow:hidden;}
.share .user .i{padding:0 5px 0 8px !important;background:#fff7f4 !important;border-radius:1000px;border:1px solid #f6d1c5;font-size:12px;color:#ff5107 !important;}
.miniMatch{display:flex;gap:5px;width:100%;}
.miniMatch i{border-radius:4px;background:#F0FAFF;font-style:normal;color:#2196F3;width:23px;height:23px;flex:0 0 23px;line-height:23px;display:flex;justify-content:center;}
.miniMatch .team{/* display:block;*/
 font-size:15px;max-width:25%;/* white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:24%;*/
}
.miniMatch .home{text-align:right;}
.miniMatch .score{font-size:15px;background:#FFF5F7;color:#E53935;padding:0 5px;font-size:15px;white-space:nowrap;}
.miniMatch .date{color:#666666;}
.miniMatch .league{white-space:nowrap;}
.bg0{/* url(./bg0.png) no-repeat top center, linear-gradient(180deg,#F5A843 0%,#F5913A 62.84%,#d94d5e 82.3%);*/
 background: #ff5622 url(./NewactivityBG.jpg) no-repeat top center;background-size:100% auto;min-height:110vh;padding:0 0 100px 0;}
.bg1,.bg2{/*background:url(./bg1.png) no-repeat top center;background-size:100% auto;*/background: none;position:relative;top:30vw;width:100%;height:98vw;}
.bg1 .msg{font-size:3.5vw;text-align:center;display:flex;width:37vw;position:absolute;top:75vw;left:50%;transform:translateX(-50%);color:#fff;flex-direction:column;}
.bg1 .msg.award {width: 50vw;}
.bg1 .msg.award .h1 {color: #fff !important;margin: 0;}
.bg1 .msg.award span {color: #ffd0d0;font-size: 3vw;}
.bg2{background:url(./bg2.png) no-repeat center 14px;background-size:100% auto;}
.bg2 .logo{display:none;}
.bg2 .resultLogo{width:10vw;height:10vw;left:50.5%;top:30%;position:absolute;transform:translateX(-50%);z-index:99;}
.bg2 .msg{font-size:2.3vw;text-align:center;display:flex;width:37vw;position:absolute;top:50vw;left:50%;transform:translateX(-50%);color:#666666;flex-direction:column;}
.bg2 .msg .h1,.bg1 .msg.award .h1 {line-height:6vw;font-size:3.8vw;font-weight:bold;color:#333333;}
.bg1 .btn,.bg2 .btn{/* background:rgba(0,0,0,0.5);*/
 height:9vw;width:36vw;border-radius:1000px;position:absolute;top:64vw;left:50%;transform:translateX(-50%);cursor:pointer;}
.bg1 .btn{top:85vw;height:45px;background:url(./NewredPack.png) no-repeat top center;background-size:auto 100%;cursor:pointer;}
.bg1 .btn.login {top:85vw;height:45px;background:url(./Newlogin.png) no-repeat top center;background-size:auto 100%;cursor:pointer;}
.bg1 .btn.award {background:url(./gomsg.png) no-repeat top center;background-size:auto 100%;}
.logo{background:url(./logo.png) no-repeat top center;background-size:100% 100%;width:20vw;height:20vw;position:absolute;top:36vw;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;}
.logo .ul{/* display:flex;*/
 left:50.5%;top:48%;transform:translate(-50%,-50%);width:12.5vw;height:12.5vw;position:absolute;overflow:hidden;border-radius:1000px;}
.logo .ul .logoList img{/* position:absolute;top:0;left:0;*/
 line-height:0;font-size:0;width:12.5vw;height:12.5vw;}
.logo img{width:13.5vw;height:13.5vw;}
img{max-width:100%;max-height:100%;}
.icon img{border-radius:50%}
.infoBox{position:relative;background:rgba(255,255,255,0.95);width:94vw;border-radius:10px;padding:15px;box-sizing:border-box;margin:30vw 3vw 2vw 3vw;}
.infoBox2{position:relative;width:97vw;margin-left:3vw;box-sizing:border-box;}
/* 因定 */
.infoBox2 ul{overflow-x:unset;width:100%;display:flex;flex-wrap:wrap;gap:8px;}
.infoBox2 ul li{background:rgba(255,255,255,0.95);padding:5px 5px 40px 5px;border-radius:10px;font-size:14px;justify-content:center;display:flex;flex-direction:column;position:relative;height:160px;box-sizing:border-box;flex:0 0 calc(33.33% - 10px);}
/* 滚动 */
/* .infoBox2 ul{display:flex;gap:2vw;justify-content:flex-start;overflow-x:auto;padding-right:3vw;}
.infoBox2 ul li{background:rgba(255,255,255,0.95);padding:10px 10px 50px 10px;border-radius:10px;font-size:14px;width:28%;flex:0 0 28%;justify-content:center;display:flex;flex-direction:column;position:relative;}
*/
.infoBox2 ul li .name{font-size:16px;}
.infoBox2 ul li .btn{background:#ffe5de;border-radius:8px;line-height:35px;text-align:center;color:#F12826;font-weight:bold;position:absolute;bottom:5px;right:5px;left:5px;}
.infoBox2 ul li .desc{color:#666666;text-align:center;font-size:12px;}
.infoBox2 ul li img{width:40px;margin:0 auto 5px auto;padding:5px;/* background:#ffffff;*/
 border-radius:4px;overflow:hidden;}
.infoBox2 .name{font-weight:bold;text-align:center;}
.nameList{line-height:30px;font-size:14px;height:120px;}
.nameList li{display:flex;gap:20px;}
.nameList li .name{flex:0 0 30%;white-space:nowrap;}
.nameList li .info{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.shareBtn{position:fixed;bottom:0;padding:3vw;cursor:pointer;}
.shareBtn.new {background:linear-gradient(0deg,#ff5e28,#febf69);color:#fff;font-size:17px;text-align:center;width:82%;margin:15px auto;border-radius:30px;border:2px solid #ffd77b;left:50%;right: auto;transform:translateX(-50%);}
.rules{position:relative;color:#eeeeee;font-size:14px;line-height: 22px;border-radius:10px;padding:15px;box-sizing:border-box;gap:8px;display:flex;flex-direction:column;}
.rules.new {position: unset;padding: 100% 20px 20px 20px;line-height: 22px;text-align: justify;}
.rules.new .tit {background: rgb(200 90 0 / 20%);margin-bottom: 10px;border-radius: 5px;}
.myBtn{position:absolute;top:5vw;right:5vw;background:#7443bc;color:#ffffff;border-radius:4px;padding:5px 15px;font-size:14px;line-height:25px;cursor:pointer;}
.back{position:absolute;top:5vw;left:5vw;width:30px;height:30px;background:#7443bc url(./back.png) no-repeat 10px center;background-size:30%;color:#ffffff;border-radius:50%;font-size:14px;cursor:pointer;}
.popupBox{position:fixed;top:30%;left:50%;transform:translateX(-50%);background:#ffffff;width:90vw;border-radius:10px;padding:15px;box-sizing:border-box;z-index:999;}
.popupBox .btns{text-align:center;border-top:solid 1px #f1f1f1;line-height:40px;margin-bottom:-10px;cursor:pointer;}
.popupBox .nameList{padding:10px;overflow-y:auto;}
.mask{position:fixed;left:0;top:0;background:rgba(0,0,0,0.8);width:100%;height:100vh;z-index:9;}
.logo .ul,.logo .ul img{width:64px !important;height:64px !important;top:48px;left:50px;}
.logo{width:100px;height:100px;}


@media screen and (min-width:1000px){ 
html,body{max-width:600px;position:relative;padding-top: 10px;}
.mainbox{margin:0;}
.match{margin:5px  0 0 0;}
.shareBtn{max-width:520px;position:fixed;bottom:0;padding:10px;right:0;left:50%;transform:translateX(-50%);}
.back{top:20px;left:20px;}
.myBtn{right:10px;top:10px;}
.bg0{position:relative;}
.bg1,.bg2{top:180px;height:765px;}
.bg2{top:185px;}
.logo{top:225px;width:100px;height:100px;}
.logo .ul,.logo .ul img{width:64px !important;height:64px !important;top:48px;left:50px;}
.bg1 .msg{font-size:20px;top:455px;}
.infoBox{width:unset;margin:0 20px 10px 20px;}
.infoBox>img{height:40px;margin:0 auto;display:block;}
.infoBox2{margin:0 0 20px 20px;width:calc(100% - 20px);box-sizing:border-box;}
.infoBox2 .vip{font-size:12px;background:#1a9de1;color:#ffffff;content:'';position:absolute;left:-20px;top:-7px;transform:rotateZ(-45deg);padding:14px 18px 3px 18px;font-style:normal;}
.infoBox2 ul{overflow-x:unset;width:100%;display:block;margin-right:-10px;}
.infoBox2 ul li{width:calc(25% - 12.5px);margin:0 10px 10px 0;height:160px;float:left;box-sizing:border-box;overflow:hidden;}
.nameList li{display:block;}
.nameList li .name{float:left;padding-right:30px;}
.rules{width:100%;}
.bg2 .msg{font-size:15px;top:300px;width:40%;}
.bg2 .msg .h1{font-size:20px;line-height:normal;}
.bg1 .msg.award {width: 50%;}
.bg1 .msg.award .h1 {font-size:20px;line-height: 36px;}
.bg1 .msg.award span {font-size:12px;}
.bg1 .btn{top:520px !important;height:52px !important;width:36% !important;cursor:pointer;}
.bg2 .btn{height:51px !important;width:36% !important;cursor:pointer;}
.bg2 .btn{top:380px;cursor:pointer;}
.bg2 .resultLogo{top:195px !important;height:60px !important;width:60px !important;}
.popupBox{max-width:450px;}
.share{position:relative; margin:5px 0 0 0; padding:0;}
}


.android.hd {
    padding-top:50px;
    background: #cd2f29;
}

.android .myBtn,
.android .back {
    margin-top: 40px;
    /* background: red !important; */
}
.android.hd {
    padding-bottom: constant(safe-area-inset-bottom, 40px);
    padding-bottom: env(safe-area-inset-bottom, 40px);
    padding-bottom: var(safe-area-inset-bottom, 40px);
    background: #cd2f29;
}

/* 判断iphoneX 将 footerBox 的 padding-bottom 填充到最底部 */
@supports (bottom:env(safe-area-inset-top)){.safe-area.hd{padding-top:constant(safe-area-inset-top,40px);padding-top:env(safe-area-inset-top,40px);padding-top:var(safe-area-inset-top,40px);background:#cd2f29;}
.safe-area .myBtn,.safe-area .back{margin-top:constant(safe-area-inset-top,40px);margin-top:env(safe-area-inset-top,40px);margin-top:var(safe-area-inset-top,40px);transform:translateY(-22px);}
}
@supports (bottom:env(safe-area-inset-bottom)){.safe-area.hd{padding-bottom:constant(safe-area-inset-bottom,40px);padding-bottom:env(safe-area-inset-bottom,40px);padding-bottom:var(safe-area-inset-bottom,40px);background:#cd2f29;}
}
.btn{cursor:pointer}
.convey{background-color:#ffff;border-radius:4px;position:fixed;/*width:max-content;*/
 top:0px;left:0px;right:0px;bottom:0px;margin:auto;z-index:100000;height:min-content;width:356px;}
.conveytop{margin:0 auto;border-bottom:1px solid #f2f2f2;text-align:center;height:34px;padding:8px 0;position:relative;}
.conveycen{margin:0 auto;display:inline-block;}
.conveyname{float:left;}
.conveylist{margin:0 auto;border-bottom:1px solid #f2f2f2;padding:7px 22px 7px 8px;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.conveylist .result{position:absolute;bottom:-4px;right:-2px;width:30px;height:30px;}
.conveylist .result.mingzhong{bottom:-4px !important;right:-2px !important;top:auto !important;left:auto !important;background:url(../images/mingzhong.png)no-repeat;background-size:30px;}
.conveylist .result.go{background:url(../images/go.png)no-repeat;background-size:30px;}
.conveylist .type{background:var(--blue50);color:var(--text-white);font-size:10px;padding:0 2px;border-radius:2px;vertical-align:1px;}
.conveylist .obvious{color:#FF5106;font-weight:600;}
.conveycen span,.conveycen div{float:left;}
#backgound{position:fixed;left:0px;top:0px;right:0px;bottom:0px;height:100%;width:100%;margin:auto;background-color:#333;z-index:9999;filter:alpha(opacity=50);-moz-opacity:0.5;-khtml-opacity:0.5;opacity:0.5;}