@media screen and (max-width:720px){
*{margin:0;padding:0}
a{text-decoration:none;-webkit-tap-highlight-color:rgba(255,255,255,0)}
html,body{
	width: 100%;
        /* height: 100%; */
        overflow: scroll;
        overflow-y: scroll;
       
        }
#app{max-width:700px;height:100%;margin:auto}
.top{position:absolute;top:0;left:0;right:0;width:100%;height:115%;max-width:700px;margin:auto;background: radial-gradient(black, black)}
.bottom{position: absolute;
    top: 2rem;
    left: 0px;
    right: 0;
    width: 70%;
    max-width: 700px;
    margin: auto;
    margin-left: 2rem;}
.content{width:100%;height:100%;min-height:650px;overflow:hidden;background-color:#f3f3f3}
.form{
       left: 3rem;
    margin: 28vh auto 0;
    width: 80%;
    position: absolute;
    background: #171540;
    min-height: 58vh;
    /* padding: 32px 32px 0px 32px; */
    padding-top: 32px;
    padding-left: 32px;
    padding-right: 20px;
    padding-bottom:15px;
    box-sizing: border-box;
    background: #171540;}
input{background:#171540;box-sizing:border-box;border:none;font-size:16px;padding-left:6px;border-bottom: 1px solid #343177;height:40px;line-height:40px;margin-bottom:2vh;width:100%;outline:none;border-radius:4px;color:#FFFFFF;}
input:focus{border-bottom:2px solid #E7E7E7}
.item{position:relative}
.area{position:relative}
input::-webkit-input-placeholder {color: #BDBDBD}
select{box-sizing:border-box;border:none;font-size:16px;padding-left:6px;border-bottom: 1px solid #E7E7E7;height:40px;line-height:40px;margin-bottom:2vh;width:100%;outline:none;border-radius:4px}
.area select{appearance: none;-webkit-appearance: none;-moz-appearance: none;padding-left: 6px;color:#BDBDBD;}
.area:after{content: "";width: 44px;height: 10px;background: url(assets/select.png) no-repeat center;position: absolute;right: 20px;top:15px;pointer-events: none;}
.otp{width:81px;height:31px;border-radius:12px;font-size:12px;background:#18BDEB;color:#FFFFFF;text-align:center;line-height:31px;position:absolute;right:0;top:0;border-radius: 23px;}
.btn{    margin-top: 10px;
    font-weight: bold;
    font-size: 18px;
    margin-left: 10%;
    color: #FFFFFF;
    width: 80%;
    height: 44px;
    line-height: 44px;
    text-align: center;
    background: #B057FF;
    border-radius: 25px;
    font-family: MicrosoftYaHei;
    background: linear-gradient(90deg, #6800EC, rgba(27,181,235,0.98));}
.p{text-align:center;font-size:8px;margin-top:12px;color:#7F7BCC;}
/*.dlc-content{background-color:#20045A;width:100%;min-height:100%;overflow:hidden;padding-bottom:30px}*/
.dlc-logo{width:142px;height:28px;margin:25px auto 0;display:block}.dlc-tt{width:271px;height:37px;margin:9px auto 0;display:block}
.dlc-b{width:163px;height:21px;line-height:21px;color:#fff;font-size:14px;font-weight:bold;margin:7px auto 17px;border-radius:21px;background-color:#F94996;text-align:center}
.dlc-ttt{color:#FDE21F;margin:0 6px}
.dlc-c{width:299px;height:243px;margin:auto;display:block}
.dlc-s{width:292px;height:42px;margin:70px auto 0;display:block}
.dlc-cc{        /* width: 60%; */
        margin: 160px auto 0;
        display: block;
        width: 100px;
        height: 100px;}
.dlc-btn{display:block;width:296px;height:40px;line-height:37px;text-align:center;background:#FFFFFF;border-radius:20px;margin:12px auto 0;font-size:18px;color:#20D38F}
.dlc-ico{height:20px;position:relative;top:3px;}
.vx{position:fixed;top:0;left:0;background:rgba(0,0,0,0.5);width:100%;height:100%;z-index: 999;}
.dlc-vx{position:absolute;top:30px;right:45px;width:61px;height:47px}
.word{position:absolute;top:60px;right:45px}
.word>p{font-weight:bold;font-size:17px;margin-bottom:4px;color:#fff}
.word>p:first-child{color:#FFF600}
#nc .stage{height:40px;padding:0}
#nc .slider{width:100%;left:0}
#nc .bg-green{line-height:40px}
#nc .slider,#nc .label,#nc .button{height:38px;line-height:40px}
.succ{    color: #18BDEB;
    /* position: absolute; */
    top: 420px;
    /*margin-left: 25%;*/
    text-align: center;
    text-decoration: underline;
    font-size: 12px;
    width: 100%;
    text-align: center;
    height: 36px;
    text-decoration: none;
    line-height: 36px;
}
.reg_img2{
	width: 70px;
    height: 70px;
    margin-top: 35px;
    display: block;
    margin: 32px auto 0;
    display: block;
    width: 68px;
}
#title_name{
	position: relative;
    top: 11rem;
    left: 2rem;
	background: url(assets/mianfeilingqu@2x.png) 70% 0px no-repeat;
    background-size: 25%;
}
#title_line{
	width: 50px;
    height: 2px;
    background: #FFFFFF;
}
.title1{
	font-size: 16px;
    font-family: Microsoft YaHei;
    font-weight: bold;
    color: #DDDEE2;
	margin-top: 20px;
    margin-bottom: 20px;

}
.title2{
	font-size: 16px;
    font-family: Microsoft YaHei;
    font-weight: bold;
    color: #DDDEE2;
}
#from_bg{position: absolute;
    left: 2rem;
    margin: 26vh auto 0;
    width: 80%;
    /* position: relative; */
    /* background: #171540; */
    min-height: 56.5vh;
    padding: 32px;
    box-sizing: border-box;
    background: background: linear-gradient(-38deg, #6800EC, rgba(27,181,235,0.98));
    background: linear-gradient(-38deg, #6800EC, rgba(27,181,235,0.98));
    }
/*锟斤拷锟斤拷页*/
.down_img1{        position: absolute;
        /* top: 5rem; */
        left: 0px;
        right: 0px;
        width: 100%;
        height: 100%;
        margin: auto;
    }
.down_img2{
	 position: absolute;
    left: 0px;
    right: 0px;
    width: 90%;
    height: 55%;
    margin: auto;
    z-index: 5;
    top: 90px;
}
.down_img3{
	position: absolute;
        z-index: 2;
        width: 100px;
        height: 100px;
        margin: auto;
        left: 0;
        right: 0;
        top: 150px;
}
#desc_text{
	width: 100%;
    text-align: center;
    position: absolute;
    top: 13rem;
    height: 200px;
    line-height: 200px;
    z-index: 5;
}
.p1_text{
	height: 36px;
        font-size: 33px;
        font-family: Microsoft YaHei;
        font-weight: bold;
        color: #FFFFFF;
        font-style: italic;
        margin-bottom: 1rem;
        text-shadow: 2px 3px 2px #197ab1;
}
.p2_text{
        height: 34px;
        font-size: 1rem;
        font-family: MicrosoftYaHei;
        /* font-weight: bold; */
        color: #FFFFFF;
        text-shadow: 1px 1px 1px #197ab1;
}
#btn_div{
	    position: absolute;
    /* height: 200px; */
    /*margin: auto;*/
    /* inset: 450px 0px 10px; */
    /* display: block; */
    /*min-height: 18rem;
    z-index: 3;
    border-radius: 5px;
    background: url(assets/down3_wtb.png) no-repeat;
       background-size: 100% 100%;
    top: 58%;*/
    width: 100%;
    top: 55%;
}
.android_btn{
	        border-style: none;
        margin-bottom: 2rem;
        height: 50px;
        line-height: 50px;
        /* background: linear-gradient(265deg, #6800EC, rgba(27, 181, 235, 0.98)); */
        /* box-shadow: 0px 9px 0px 0px #4fe0ff; */
        border-radius: 49px;
        margin-left: 10%;
        position: absolute;
        z-index: 7;
        background: #7BAA49;
        border-radius: 49px;
        border: 2px solid #FFFFFF;
}
.android_text{
	color: #fffefe;
    font-family: MicrosoftYaHei;
    font-weight: bold;
    font-size:18px;
}
.ios_btn{
	        border-style: none;
        margin-bottom: 2rem;
        height: 50px;
        line-height: 50px;
        /* background: linear-gradient(265deg, #6800EC, rgba(27, 181, 235, 0.98)); */
        /* box-shadow: 0px 9px 0px 0px #4fe0ff; */
        border-radius: 49px;
        margin-left: 10%;
        position: absolute;
        z-index: 7;
        background: #7BAA49;
        border-radius: 49px;
        border: 2px solid #FFFFFF;
        margin-top:100px;
}
.ios_text{
	color: #fffefe;
	font-size: 36px;
    font-family: MicrosoftYaHei;
    font-weight: bold;
    font-size:18px;
    margin-left: 15px;
}

/*注锟斤拷晒锟揭�*/
.reg_img1{
	    /*    height: 50px;
        width: 60%;*/
        /* margin: 35px 25% 3rem 24%; */
        display: block;
        margin-top: 45px;
}
.android_reg{
	               border-style: none;
        height: 50px;
        line-height: 50px;
        margin-bottom: 2rem;
        background: #7BAA49;
        border-radius: 49px;
        border: 2px solid #FFFFFF;
        margin-top: 138px;
}
.android_reg_text{
	height: 34px;
	font-size: 16px;
    font-family: PingFang SC;
	/*font-weight: bold;*/
	color: #FFFFFF;
}
.ios_reg{
	border-style: none;
        height: 50px;
        line-height: 50px;
        margin-bottom: 2rem;
        background: #7BAA49;
        border-radius: 49px;
        border: 2px solid #FFFFFF;
}
.ios_reg_text{
	        height: 34px;
        font-size: 16px;
        font-family: PingFang SC;
        /* font-weight: bold; */
        color: #FFFFFF;
        margin-left:20px;
}
}
 @media screen and (min-width:721px){
*{margin:0;padding:0}
a{text-decoration:none;-webkit-tap-highlight-color:rgba(255,255,255,0)}
html,body{width:100%;max-width:700px;
    }   
#app{max-width:700px;height:100%;margin:auto}
.top{position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    min-height: 800px;
    max-width: 700px;
    margin: auto;
    background: radial-gradient(black, black);
    }
.bottom{        position: absolute;
    top: 2rem;
    left: 0px;
    right: 0;
    width: 30%;
    max-width: 700px;
    margin: auto;
    margin-left: 30%;
    }
.content{width:100%;height:100%;min-height:650px;overflow:hidden;background-color:#f3f3f3}
.form{
   /*left: 0.6rem; */
    /* margin: 28vh auto 0; */
    top: 22rem;
    margin-left: 15%;
    width: 30%;
    position: absolute;
    min-height: 300px;
    background: #171540;
    /* min-height: 77vh; */
    padding: 32px;
    box-sizing: border-box;
    background: #171540;}
input{background:#171540;box-sizing:border-box;border:none;font-size:16px;padding-left:6px;border-bottom: 1px solid #343177;height:40px;line-height:40px;margin-bottom:2vh;width:100%;outline:none;border-radius:4px;color:#FFFFFF;}
input:focus{border-bottom:2px solid #E7E7E7}
.item{position:relative}
.area{position:relative}
input::-webkit-input-placeholder {color: #BDBDBD}
select{box-sizing:border-box;border:none;font-size:16px;padding-left:6px;border-bottom: 1px solid #E7E7E7;height:40px;line-height:40px;margin-bottom:2vh;width:100%;outline:none;border-radius:4px}
.area select{appearance: none;-webkit-appearance: none;-moz-appearance: none;padding-left: 6px;color:#BDBDBD;}
.area:after{content: "";width: 44px;height: 10px;background: url(assets/select.png) no-repeat center;position: absolute;right: 20px;top:15px;pointer-events: none;}
.otp{width:81px;height:31px;border-radius:12px;font-size:12px;background:#18BDEB;color:#FFFFFF;text-align:center;line-height:31px;position:absolute;right:0;top:0;border-radius: 23px;}
.btn{    margin-top: 20px;
    font-weight: bold;
    font-size: 18px;
    margin-left: 10%;
    color: #FFFFFF;
    width: 80%;
    height: 44px;
    line-height: 44px;
    text-align: center;
    background: #B057FF;
    border-radius: 25px;
    font-family: MicrosoftYaHei;
    background: linear-gradient(90deg, #6800EC, rgba(27,181,235,0.98));}
.p{text-align:center;font-size:11px;margin-top:12px;color:#7F7BCC;}
.dlc-content{    
    width: 100%;
    /* min-height: 100%; */
    /* overflow: hidden; */
    padding-bottom: 30px;
    min-height: 700px;}
.dlc-logo{width:142px;height:28px;margin:25px auto 0;display:block}.dlc-tt{width:271px;height:37px;margin:9px auto 0;display:block}
.dlc-b{width:163px;height:21px;line-height:21px;color:#fff;font-size:14px;font-weight:bold;margin:7px auto 17px;border-radius:21px;background-color:#F94996;text-align:center}
.dlc-ttt{color:#FDE21F;margin:0 6px}
.dlc-c{width:299px;height:243px;margin:auto;display:block}
.dlc-s{width:292px;height:42px;margin:70px auto 0;display:block}
.dlc-cc{width:100%;margin:150px auto 0;display:block;width:150px;}
.dlc-btn{display:block;width:296px;height:40px;line-height:37px;text-align:center;background:#FFFFFF;border-radius:20px;margin:12px auto 0;font-size:18px;color:#20D38F}
.dlc-ico{height:20px;position:relative;top:3px}
.vx{position:fixed;top:0;left:0;background:rgba(0,0,0,0.5);width:100%;height:100%;z-index: 999;}
.dlc-vx{position:absolute;top:30px;right:45px;width:61px;height:47px}
.word{position:absolute;top:60px;right:45px}
.word>p{font-weight:bold;font-size:17px;margin-bottom:4px;color:#fff}
.word>p:first-child{color:#FFF600}
#nc .stage{height:40px;padding:0}
#nc .slider{width:100%;left:0}
#nc .bg-green{line-height:40px}
#nc .slider,#nc .label,#nc .button{height:38px;line-height:40px}
.succ{    color: #18BDEB;
    /* position: absolute; */
    top: 420px;
    margin-left: 25%;
    text-align: center;
    text-decoration: underline;
    font-size: 14px;
    width: 100%;
    text-align: center;
    height: 36px;
    text-decoration: none;
    line-height: 36px;
}

#title_name{
	    width: 500px;
    max-width: 700px;
    position: absolute;
    top: 14rem;
    left: 30%;
    background: url(assets/mianfeilingqu@2x.png) 70% 0px no-repeat;
    background-size: 20%;
}
#title_line{
	width: 50px;
    height: 2px;
    background: #FFFFFF;
}
.title1{
	font-size: 16px;
    font-family: Microsoft YaHei;
    font-weight: bold;
    color: #DDDEE2;
	margin-top: 20px;
    margin-bottom: 20px;

}
.title2{
	font-size: 16px;
    font-family: Microsoft YaHei;
    font-weight: bold;
    color: #DDDEE2;
}
#from_bg{position: absolute;
       position: absolute;
    /* left: 2rem; */
    /* margin: 20rem; */
    margin-left: 13%;
    top: 21rem;
    width: 30%;
    min-height: 430px;
    /* position: relative; */
    /* background: #171540; */
    /* min-height: 56.5vh; */
    padding: 32px;
    box-sizing: border-box;
    background: background: linear-gradient(-38deg, #6800EC, rgba(27,181,235,0.98));
    background: linear-gradient(-38deg, #6800EC, rgba(27,181,235,0.98));
    }
/*锟斤拷锟斤拷页*/
.down_img1{position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    margin: auto;
    max-width: 700px;
    }
.down_img2{
	    position: absolute;
    left: 0px;
    right: 0px;
    width: 50%;
    height: 102%;
    margin: auto;
    z-index: 5;
    /* top: 90px; */
    max-width: 700px;
}
.down_img3{
	        position: absolute;
        z-index: 2;
        width: 150px;
        height: 150px;
        margin: auto;
        left: 0;
        right: 0;
        top: 200px;
}
#desc_text{
	width: 100%;
        text-align: center;
        position: absolute;
        top: 23rem;
        height: 200px;
        line-height: 200px;
        z-index: 5;
}
.p1_text{
	              height: 36px;
        font-size: 58px;
        font-family: Microsoft YaHei;
        font-weight: bold;
        color: #FFFFFF;
        font-style: italic;
        margin-bottom: 3rem;
        text-shadow: 2px 3px 2px #197ab1;
}
.p2_text{
        font-size: 28px;
        font-family: MicrosoftYaHei;
        /* font-weight: bold; */
        color: #FFFFFF;
        text-shadow: 1px 1px 1px #197ab1;
        margin-top: 3.5rem;
}
#btn_div{
	    position: absolute;
    /* height: 200px; */
    margin: auto;
    inset: 660px 10px 10px;
    /* display: block; */
    z-index: 3;
    border-radius: 5px;
    max-width: 700px;
    min-height: 300px;
}
.android_btn{
	border-style: none;margin-bottom:2rem; height: 50px;
	height:60px;
    line-height: 60px;
    background: #7BAA49;
    border-radius: 49px;
    border: 2px solid #FFFFFF;
}
.android_text{
	color: #fffefe;
    font-family: MicrosoftYaHei;
    font-weight: bold;
    font-size:18px;
}
.ios_btn{
	border-style: none;
        margin-bottom: 2rem;
        height: 50px;
        height: 60px;
        line-height: 60px;
        background: #7BAA49;
        border-radius: 49px;
        border: 2px solid #FFFFFF;
}
.ios_text{
	color: #fffefe;
	font-size: 36px;
    font-family: MicrosoftYaHei;
    font-weight: bold;
    font-size:18px;
    margin-left: 15px;
}

/*注锟斤拷晒锟揭�*/
.reg_img1{
	display: block;
    margin-top: 90px;
}
.reg_img2{
    margin: 64px auto 0;
    display: block;
    width: 136px;
}
.android_reg{
	        border-style: none;
        height: 60px;
        line-height: 60px;
        margin-bottom: 2rem;
        background: #7BAA49;
        border-radius: 49px;
        border: 2px solid #FFFFFF;
        margin-top: 138px;
        width: 80%;
}
.android_reg_text{
	height: 34px;
	font-size: 20px;
	font-family: MicrosoftYaHei;
	font-weight: bold;
	color: #FFFFFF;
}
.ios_reg{
        border-style: none;
        height: 60px;
        line-height: 60px;
        margin-bottom: 2rem;
        background: #7BAA49;
        border-radius: 49px;
        border: 2px solid #FFFFFF;
        width: 80%;
}
.ios_reg_text{
	color:#FFFFFF;
	height: 34px;
	font-size: 20px;
    font-family: MicrosoftYaHei;
    font-weight: bold;
    color: #FFFFFF;
    margin-left: 20px;
}
}