body {
  margin: 0;
  display: flex;
  flex-direction: column;
  height: 100vh;
  /*width: 100vh;*/
  background-color: #F3F3F3;
}

.up {
  width: 100%;
  height: 100%;
  position: relative;
  display: flex;
  background-color: #F47153;
}

.bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  margin: auto;
}

.avatarP {
  position: absolute;
  top: 50px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.avatarP img {
  width: 100px;
  height: 100px;
  border-style: solid;
  border-width: 4px;
  border-radius: 54px;
  border-color: #FFE690;
}

.center {
  width: 100%;
  position: absolute;
  top:200px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.center_p{
  color: #999999;
  line-height: 1px;
}

.peapleP{
  color: #F47153;
  display: flex;
  flex-direction: row;
  align-items: baseline;
}
.peapleP p{
  color: #F47153;
  line-height: 0px;
}
.peaple-other{
  font-size: 20px;
}
.peaple{
  font-size: 60px;
  margin-left: 10px;
  margin-right: 10px;
}
.complete_tip{
  color: #F47153;
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 0px;
}
.center button{
  background-color: #F8AB39;
  width: 300px;
  height: 50px;
  border-radius: 4px;
  border: none;
  color: white;
  font-size: 15px;
  margin-top: 50px;
}
@keyframes fromBottom{
  0%{
    transform: translateY(100%);
  }
  100%{
    transform: translateY(0%);
  }
}
@keyframes toBottom{
  0%{
    transform: translateY(0%);
  }
  100%{
    transform: translateY(100%);
  }
}
.dialog{
  width: 100%;
  height: 160px;
  background-color: white;
  position: absolute;
  bottom: 0px;
  z-index: 10;
  display: none;
  flex-direction: row;
  justify-content: center;
}
.dialog_left{
  margin-top: 15px;
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 0px;
}
.dialog_right{
  margin-top: 15px;
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 0px;
  margin-left: 20px;
}
.dialog img{
  width: 60px;
  height: 60px;
}
.dialog_close{
  margin-top: 0px;
  width: 100%;
  height: 50px;
  position: absolute;
  bottom: 0px;
  display: flex;
  justify-content: center;
  align-items: center;

  border-top-style: solid;
  border-width: 1px;
  border-color: rgba(85, 85, 85, 0.14);
}

.bottom {
display: flex;
width: 100%;
height: 10%;
background-color: white;
justify-content: center;
align-items: center;
position: fixed;
bottom: 0;
z-index: 1;
}

.bottom button {
font-size: 16px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;

color: white;
width: 90%;
height: 50px;
background-color: #FB4645;
border: none;
border-radius: 3px;
}