* { padding: 0; margin: 0; }
.wrap { width: 100%; height: 100vh; display: flex; align-items: center; justify-content: center; }
.text-center { text-align: center; }
.download { width: 7.5rem; height: 4.84rem; }
.welcome { width: 4.72rem; height: 1.68rem; }
.logo { width: 5.5rem; height: 1rem; margin-bottom:1rem }
.downloadbtn { width: 6.88rem; height: .9rem!important; background: #F83F59; border-radius: .1rem; color: #fff; text-align: center; line-height: .9rem!important; font-size: .28rem!important; font-weight: bold; margin: 0 auto; }
.qcode { display: flex; }
.qcode input { flex: 1; }
.qcode div { text-align: center; margin-left: .1rem; }
.qcode img { width: 2.4rem; height: .9rem; }

.modal { width: 100%; height: 100vh; position: fixed; left: 0; bottom: -20rem; background-color: rgba(0,0,0,.4); opacity: 0; transform: scale(1.2); }
.modal .content { width: 100%; bottom: 0; position: absolute; left: 0; box-sizing: border-box;  z-index: 2; background-color: #fff; border-radius: .2rem .2rem 0 0; padding: .4rem; bottom: -10rem; transition: all 0.3s ease-in-out 0s;}
.modal.show { bottom: 0; opacity: 1; transform: scale(1); }
.modal.show .content { bottom: 0; }
.modal h4 { font-size: .34rem; text-align: center; margin-bottom: .8rem; }
.modal .content > div { position: relative; height: .88rem; margin-bottom: .2rem; font-size: 0; }
.modal p { font-size: .28rem; margin-bottom: .1rem; }
.modal input { width: 100%; line-height: .88rem; height: .88rem; font-size: .3rem; border: none; border-bottom: 1px solid #EAEAF1;}
.code { position: absolute; color: #1A86FF; font-size: .28rem; top: 0; right: 0; line-height: .88rem; }
.modal .content > div.btn { width: 6.9rem; height: .9rem; background-color: #1A86FF; color: #fff; text-align: center; line-height: .9rem; font-size: .32rem; border-radius: .1rem; font-weight: bold; margin: 1.4rem auto .4rem; }
.modal .content > div.close { font-size: .48rem; color: #000; font-weight: bold; text-align: center; margin-bottom: 0; margin-top: 1rem; }