.page-reg{
   background: url(../images/top-back.svg) no-repeat;
   background-size: 100%;
   margin-top: 2.5rem;
}
.layout{

display: flex;

justify-content: center; /* 水平居中 */

align-items: center;

flex-direction: column;

width: 60%;

margin: auto;

padding: 24px 4rem;

margin-top: 2.5rem;

background-color: #000000ad;

border-radius: 0.2rem;
}
.layout .reg-w{}
.layout .reg-group{
    display: flex;
    margin: 20px 0;
}
.layout .reg-group label{
    width: 86px;
}
.layout .reg-group .reg-control{
    height: 1rem;
    border: 0 none;
    outline: 0 none;
    padding: 1px 17px;
    width: 70%;
}
.layout .btn-brand{
   
width: 3rem;
   
height: 1rem;
   
border: 0 none;
   
outline: 0 none;
   
background-image: linear-gradient( 
90deg , #00b3ff 0%, #0060ff 100%);
   
color: aliceblue;
   
border-radius: 10rem;
}
.layout .reg-w h4{

font-size: 0.7rem;

color: white;
}
#btn_send_sms{

color: aliceblue;

background-image: linear-gradient( 
90deg , #00a8ff 0%, #009aff 100%);

border: 0 none;

outline: 0 none;

margin-left: 0.2rem;

border-radius: 00.2rem;
}
#verify{
   
width: 40%;
}
.user-head{

display: flex;

justify-content: center; /* 水平居中 */

align-items: center;

flex-direction: column;

background-color: rgb(0 0 0 / 50%);

padding: 0.4rem 0.4rem;

border-radius: 0.2rem;
}
.user-head .user_portrait{
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 2.5rem;
}
.user-head h1{
    padding: 0 0;
    margin: 6px 0;
    color: aliceblue;
}
.user-head h2{
    font-size: 0.4rem;
}
.user_navigate_list{
   
padding: 7px 6px;
}
.user-left{background-color: rgb(0 0 0 / 50%);padding: 0.4rem 0.4rem;border-radius: 0.2rem;width: 7rem;}
.user-right{
   flex: 1;
   background-color: rgb(0 0 0 / 50%);
   padding: 0.3rem;
   margin-left: 0.3rem;
   border-radius: 0.2rem;
}
.user-body{
   display: flex;
   justify-content: flex-start; /* 水平居中 */
   align-items: flex-start;
   margin-top: 0.3rem;
}
.user-body .item{
    /* margin: 20px 0; */
    border-bottom: 1px solid rgb(62 62 62);
    padding: 14px 0;
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.user-body .item:last-child {
    border-bottom: 1px solid rgb(62 62 62 / 0%);
}

.iconarrow-right{
    right: 10px;
    left: auto;
    background-image: url(../images/right.svg);
    display: inline-block;
    position: absolute;
    width: 0.5rem;
    height: 0.5rem;
    background-size: cover;
}
.item .navi_link{
   display: flex;
   justify-content: flex-start; /* 水平居中 */
   align-items: center;
}
.navi_link i{
    background: url(../images/star.png) no-repeat;
    display: inline-block;
    width: 0.7rem;
    height: 0.7rem;
    background-size: cover;
    margin-right: 0.15rem;
}
@media only screen and (max-width: 576px){
   .page-reg{
      margin-top: 3rem;
   }
   .user-head{
      border-radius: 0;
   }
   .user-body{
      flex-direction: column;
      margin-top: 0;
   }
   .user-left{
      width: 100%;
      border-radius: 0;
   }
   .user-right{
      display: none;
   }
}