* {
	margin: 0;
	padding: 0;
	border: 0;
	box-sizing: border-box
}
a{outline:none;text-decoration:none;}
a:hover{text-decoration:none;}
html{zoom:1;}
html *{outline:0;zoom:1;}
html button::-moz-focus-inner{border-color:transparent!important;}
body{overflow-x: hidden;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
fieldset,a img{border:0;}
address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal;}
li{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
input[type="submit"], input[type="reset"], input[type="button"], button{-webkit-appearance: none;}
em,i{font-style:normal;}
body {
	font-size: 14px;
	color: #fff;
	background: #333;
	overflow-x: hidden;
	font-family: arial
}
.clear {
	clear: both
}
.pagewidth {
	max-width: 450px
}
.bg {
	position: fixed;
	z-index: -1;
	width: 100%;
	margin: 0 auto;
	top: 0;
	left: 0;
	right: 0;
	height: 100%;
	background:#000;
}
body.body-style {
    background: #F6F6F6 !important;
}
.wrap {
	width: 100%;
	margin: 0 auto;
	overflow: hidden
}
.wrap .header {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: 15px;
	box-sizing: content-box;
	background: #211001;
	z-index: 2;
    position: relative;
}
.wrap .header .top-ico1 {
	margin-right: auto
}
.wrap .header .top-ico1 img {
	width:88px;
	padding-left: 15px
}
.wrap .header .logo img {
	height: 50px
}
.wrap .header .top-ico2 {
	margin-left: auto
}
.wrap .header .top-ico2 img {
	width:88px;
	padding-right: 15px
}
.wrap .header .top-ico1, .wrap .header .top-ico2 {
	margin-top: 5px
}
.wrap .banner {
	text-align: center;
	width: 100%;
	margin:0 auto 5px;
	display: block
}
.itemList {
    transform: scale(.85);
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 30px;
    padding: 5px 0;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    transition: all .3s ease;
    z-index: 10;
    position: relative;
}
.itemList img{width:100%}
.itemList .dico1 {
    background: url(../img/dico1.gif) no-repeat;
    width: 95px;
    height: 36px;
    background-size: auto 100%;
    position: absolute;
    top: -10px;
    right: -10px;
}
.itemList .dico2 {
    background: url(../img/dico2.gif) no-repeat;
    width: 95px;
    height: 36px;
    background-size: auto 100%;
    position: absolute;
    top: -10px;
    right: -10px;
}
.footer{width:100%;margin:10px auto 20px;text-align:center}
.footer .tips{color:#fff}
.jsBox {
    position: absolute;
    top: -507px;
    left: 0;

    width: min(100vw, 750px);
    max-width: 750px;
    min-width: 300px;

    box-sizing: border-box;
    color: #fff;
    border:1px solid #f0c22b;
    background: rgba(0, 0, 0, 0.9);

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    
    z-index: 10;
    font-size:14px;

    width: 96%;
    left: 50%;
    transform: translateX(-50%);

    position: absolute;
    left: 50%;
    top: 0;                  
    transform: translate(-50%, -100%);

}

.jsBox li .ms,
.jsBox li span,
.jsBox li a{
    padding: .4rem;
}

.jsBox .arrow {
    width: .8rem;
    position: absolute;
    left: 50%;
    bottom: -0.48rem;
    transform: translateX(-50%);
}

.jsBox p {
    color: #fff;
    text-align: center;
    width: 90%;
    margin: 1rem 0 1rem;
}

.jsBox .txtapp {
    width: 90%;
    color: #fff;
    background: #c9a526;
    border: 1px solid #f2c731;
    padding: .2rem .6rem;
    border-radius: 2rem;
    font-weight: bold;
    text-align: center;
    padding: .3rem;
    margin-bottom: 1rem;
	cursor: pointer;
}

.jsBox ul {
    width: 100%;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    flex-direction: column;
}

.jsBox li {
    width: 90%;
    margin-bottom: .5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    zoom: 1;
}

.jsBox li:last-child{
    margin-bottom: 0;
}

.jsBox li .ms {
    width: 16%;
}

.jsBox li span {
    display: block;
    float: left;
    color: #414755;
    text-align: center;
    background: #fff;
    box-sizing: border-box;
}

.jsBox li img {
    display: block;
    width: 5%;
    margin-right: 1.2%;
}

.jsBox li .url {
    margin-right: .5rem;
    white-space: nowrap;
    width: 52%;
}


.jsBox li a {
    display: block;
    float: right;
    color: #fff;
    font-weight: bold;
    text-align: center;
    background:#b59d3f;
    box-sizing: border-box;
    width: 25%;
    white-space: nowrap;
}

.show{
    display: block;
}

.hide{
    display: none;
}

.un-loading{display:none}
.main-wrapper{display:flex;flex:1;flex-direction:column;align-items:center;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif;}
.main-content{margin:96px auto;width:100%;max-width:960px;padding:0 24px}
.main-wrapper .title{color:#FC5431;font-size:32px;font-weight:500;text-align:center;margin-bottom:10px}
.main-wrapper .card{background:#fff;border-radius:10px;border:1px solid #E1E1E1;padding:30px;width:90%;max-width:460px;margin:0 auto}
.main-wrapper .card-title{background:#FDF5E6;border-radius:5px;padding:16px;display:flex;align-items:center;justify-content:start}
.main-wrapper .welcome-text{color:#222226;font-size:18px;font-weight:500}
.main-wrapper .card-loading{display:flex;align-items:center;justify-content:center;margin-top:25px}
.main-wrapper .card-footer{margin-top:30px;text-align:center}
.main-wrapper .card-footer-title{font-size:12px;font-family:AlibabaPuHuiTi_2_65_Medium,system-ui;font-weight:500;color:rgba(43,36,54,.5);margin-bottom:10px}
@media (max-width:768px){.main-wrapper .card{padding:30px 20px}}
.main-wrapper .card-title .header-arrow path{
  fill:#94C86C!important;
  stroke:#94C86C!important;
}
.main-wrapper .loading{display:inline-block;animation:spinner-rotate 1s linear infinite;transform-origin:center center;will-change:transform}
.main-wrapper .loading .track{stroke:rgba(0,0,0,0.12)}
.main-wrapper .loading .arc{stroke:#9e9e9e}
@keyframes spinner-rotate{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
.main-wrapper .btn{
  display:inline-block;padding:10px 20px;text-align:center;cursor:pointer;
  font-size:15px;font-family:AlibabaPuHuiTi_2_65_Medium,system-ui;color:#fff;border-radius:20px;border:none;
  background:linear-gradient(145deg,#28a745,#34d058);
  box-shadow:0 2px 6px rgba(0,0,0,.12),0 0 12px rgba(40,167,69,.55);
  transition:transform .2s ease,box-shadow .2s ease;animation:btnBreathe 2.6s infinite ease-in-out
}
.main-wrapper .btn:hover{transform:translateY(-1px) scale(1.03);box-shadow:0 6px 14px rgba(0,0,0,.16),0 0 18px rgba(52,208,88,.75)}
.main-wrapper .btn:active{transform:translateY(0) scale(0.97);box-shadow:inset 0 2px 6px rgba(0,0,0,.18),0 0 10px rgba(40,167,69,.55)}
@keyframes btnBreathe{
  0%{box-shadow:0 2px 6px rgba(0,0,0,.12),0 0 10px rgba(40,167,69,.45)}
  50%{box-shadow:0 4px 10px rgba(0,0,0,.14),0 0 22px rgba(52,208,88,.8)}
  100%{box-shadow:0 2px 6px rgba(0,0,0,.12),0 0 10px rgba(40,167,69,.45)}
}

@media screen and (max-width:370px){
 #challenge-stage{zoom:85%}
}



@media screen and (max-width:500px){
  .wrap .header .top-ico1 img,.wrap .header .top-ico2 img{width:66px}
  .wrap .header .logo img{height:40px}
  .footer .tips,.jsBox{font-size:12px}

}