.container {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 100px 0;
  box-sizing: border-box;
} 
page,.page {
  height: 100%;
  font-family: 'PingFang SC', 'Helvetica Neue', Helvetica, 'Droid Sans Fallback', 'Microsoft Yahei', sans-serif;
}
.page-bottom{
  height: 100%;
  width: 725px;
  position: fixed; 
  background-color: #07c160;
  z-index: 0;
}
.wc{
  color: white;
  padding: 15px 0 15px 20px;
}
.page-content{
  padding-top: 150px;
}
.page-top{
  height: 100%;
  position: fixed;
  width: 725px;
  background-color: var(--weui-BG-1);
  z-index: 0;
  transition: All 0.4s ease; 
  -webkit-transition: All 0.4s ease;
}

.c-state1{
  transform: rotate(0deg) scale(1) translate(40%,0%); 
  -webkit-transform: rotate(0deg) scale(1) translate(40%,0%); 
}
.c-state2{
  transform: rotate(0deg) scale(.8) translate(40%,0%); 
  -webkit-transform: rotate(0deg) scale(.8) translate(40%,0%); 
}

.item-title {
  margin: 10px 10px 5px;
  font-size: 18px;
  width: 100%;
}
.item-desc {
  margin: 5px 10px 0;
  width: 100%;
  color: #00000080
}