* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: PingFang SC;
}
html,
body {
  width: 100%;
  height: 100%;
}
body {
  max-width: 750px;
  margin: 0 auto;
  background: #f5f5f5;
}
img {
  display: block;
  max-width: 100%;
}
.login_box {
  padding: 0.8rem 0.6rem;
}

.login_title {
  font-size: 0.34rem;
  font-weight: 600;
  text-align: center;
  margin-top: .3rem;
}
.login_logo {
  width: 1.7rem;
  margin: .6rem auto 0;
}
.login_logo img {
  width: 100%;
}

.login_form {
  width: 92%;
  margin: 0.6rem auto 0;
}
.login_form_col {
  width: 100%;
  height: 1rem;
  position: relative;
  margin-top: 0.4rem;
  display: flex;
  align-items: center;
  background: rgba(255, 255, 255, .5);
  border-radius: 1rem;
}

.login_form_col input {
  display: block;
  width: 100%;
  flex: 1;
  outline: none;
  border: none;
  font-size: 0.3rem;
  color: #fff;
  background: transparent;
  color: #000;
  padding: 0 0.4rem;
}
.login_form_col input::placeholder {
  color: #999;
}
.login_form_btn {
  width: 100%;
  height: 1rem;
  display: flex;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  line-height: 1;
  font-weight: bold;
  font-size: 0.32rem;
  margin-top: .4rem;
  background: #000;
  color: #fff;
  border-radius: 1rem;
}
.login_form_agree {
  margin-top: 0.2rem;
  display: flex;
  align-items: center;
}
.login_form_agree img {
  width: 0.36rem;
  height: 0.36rem;
}
.login_form_agree img:nth-of-type(2) {
  display: none;
}
.login_form_agree.checked img:nth-of-type(1) {
  display: none;
}
.login_form_agree.checked img:nth-of-type(2) {
  display: block;
}
.login_form_agree {
  color: #000;
  font-size: 0.24rem;
}
.login_form_agree > a {
  color: #333;
}
.login_form_order {
  margin-top: 2rem;
  display: flex;
  justify-content: center;
}
.login_form_order > a {
  color: #000;
}
.login_form_forget {
  display: block;
  width: 2rem;
  margin: 0.5rem auto 0;
  text-align: center;
}
.getcode_btn {
  font-weight: bold;
  background: #000;
  width: 1.8rem;
  height: 0.7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  line-height: 1;
  font-size: 0.26rem;
  border-radius: 0.7rem;
  margin-right: 0.2rem;
  color: #fff;
}

.tabbar {
  position: fixed;
  bottom: 0;
  display: flex;
  width: 7.5rem;
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  height: 1rem;
  padding: 0 0.1rem;
}

.tabbar_col {
  width: 20%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.tabbar_col img {
  width: 0.44rem;
  height: 0.44rem;
}
.tabbar_col img:nth-of-type(2) {
  display: none;
}
.tabbar_col > p {
  font-size: 0.2rem;
  color: #777;
  font-weight: 600;
}
.tabbar_col.active img:nth-of-type(1) {
  display: none;
}
.tabbar_col.active img:nth-of-type(2) {
  display: block;
}
.tabbar_col.active > p {
  color: #000;
}
.tabbar_middle {
  width: 20%;
}
.tabbar_middle img {
  width: 1rem;
  height: 1rem;
  margin: -0.5rem auto 0;
}
.tabbar_middle > p {
  font-weight: bold;
  font-size: 0.28rem;
  text-align: center;
}

.main {
  padding: 0.6rem 0.3rem 2.2rem;
  width: 100%;
  height: 100%;
  overflow-y: auto;
}
.user_box {
  width: 100%;
}
.user_top {
  width: 100%;
  padding: 0.4rem 0.5rem 1rem;
  background: linear-gradient(180deg, #FEDA50 0%, #D0FC4C 100%);
}
.user_top_block {
  display: flex;
  align-items: center;
}
.user_headphoto {
  width: 1.1rem;
  height: 1.1rem;
  position: relative;
  border-radius: 50%;
}
.user_headphoto img {
  width: 100%;
  height: 100%;
}
.user_headphoto > img {
  border-radius: 50%;
  overflow: hidden;
}
.user_headphoto .vip {
  width: 0.4rem;
  height: 0.4rem;
  position: absolute;
  top: 0;
  right: 0;
}
.user_top_cont {
  width: 1px;
  flex: 1;
  margin-left: 0.2rem;
}
.user_username {
  display: flex;
  align-items: center;
  font-weight: bold;
  font-size: 0.3rem;
}
.user_editbtn {
  width: 0.32rem;
  height: 0.32rem;
  margin-left: 0.12rem;
}

.user_top_count {
  display: flex;
  margin-top: 0.3rem;
  align-items: center;
}
.user_top_count > div {
  width: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.user_top_count > div p:first-of-type {
  font-weight: bold;
  font-size: 0.34rem;
}
.user_top_count > div p:last-of-type {
  font-size: 0.26rem;
}

.vip_block {
  height: 1.2rem;
  position: relative;
  margin: -0.6rem 0.3rem 0;
  display: flex;
  align-items: center;
  background: #fff;
  border-radius: 0.12rem;
  padding: 0 0.3rem 0 0.5rem;
}
.vip_block > img {
  width: 0.5rem;
}
.vip_block > div {
  width: 100%;
  margin-left: 0.3rem;
  flex: 1;
}
.vip_block > div > p:first-of-type {
  font-size: 0.3rem;
  font-weight: bold;
}
.vip_block > div > p:last-of-type {
  font-size: 0.24rem;
  color: #999;
  margin-top: 0.08rem;
}
.vip_block button {
  width: 0.26rem;
  background: transparent;
  border: none;
  outline: none;
}
.vip_block button img {
  width: 100%;
}

.mine_block_heng {
  margin: 0.3rem 0.3rem 0;
  background: #fff;
  display: flex;
  flex-wrap: wrap;
  border-radius: 0.12rem;
}
.heng_col {
  width: 33.33%;
  padding: 0.3rem 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.heng_col_icon {
  width: 0.5rem;
  height: 0.5rem;
}
.heng_col_icon img {
  width: 100%;
  height: 100%;
}
.heng_col p {
  font-size: 0.26rem;
  color: #666;
  margin-top: 0.1rem;
}

.mine_block {
  margin: 0.3rem 0.3rem 0;
  background: #fff;
  border-radius: 0.12rem;
  padding: 0 0.3rem 0 0.5rem;
}
.mine_col {
  display: flex;
  align-items: center;
  height: 1rem;
}
.mine_col > p {
  width: 1px;
  flex: 1;
  margin-left: 0.26rem;
  font-size: 0.28rem;
  font-weight: bold;
}
.mine_col_icon {
  width: 0.5rem;
  height: 0.5rem;
}
.mine_col_arrow {
  width: 0.28rem;
}
.mine_col_vip {
  width: 0.4rem;
  margin-right: 0.2rem;
}

.header {
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 999;
  width: 100%;
  height: 1.2rem;
  max-width: 750px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(180deg, #FEDA50 0%, #D0FC4C 100%);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}
.header > p {
  width: 70%;
  font-weight: bold;
  font-size: 0.36rem;
  text-align: center;
  color: #333;
}
.header_back {
  width: 1.1rem;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-items: center;
  cursor: pointer;
  padding: 0 0.3rem 0.1rem;
}
.header_r {
  width: 1.2rem;
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-items: center;
  cursor: pointer;
  padding: 0 0.3rem;
  text-align: right;
}
.header_tabbar {
  width: 2.8rem;
  height: 100%;
  display: flex;
}
.header_tabbar > p {
  font-size: 0.3rem;
  color: #333;
  width: 50%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-around;
  font-weight: bold;
  position: relative;
}
.header_tabbar > p.active:after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  height: 0.04rem;
  width: 0.6rem;
  background: #333;
}

.header_zb {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0.3rem;
  display: flex;
  align-items: center;
  font-size: 0.28rem;
  line-height: 1;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  width: 1.6rem;
}
.header_zb > i {
  width: 0;
  height: 0;
  border-right: 0.08rem solid transparent;
  border-left: 0.08rem solid transparent;
  border-top: 0.1rem solid #333;
  margin-left: 0.1rem;
}

.header_year {
  width: 1.6rem;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0.3rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  font-size: 0.28rem;
  line-height: 1;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.header_year > i {
  width: 0;
  height: 0;
  border-right: 0.08rem solid transparent;
  border-left: 0.08rem solid transparent;
  border-top: 0.1rem solid #333;
  margin-left: 0.1rem;
}

.page_main {
  padding: 1.2rem 0 0;
  width: 100%;
  height: 100%;
  overflow-y: auto;
}

.vip_foot {
  position: fixed;
  bottom: .5rem;
  left: 50%;
  transform: translateX(-50%);
  width: 5.56rem;
  height: .96rem;
  z-index: 999;
  background: #DFF04B;
  color: #000;
  border-radius: .96rem;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .32rem;
  line-height: 1;
}

.vip_head {
  width: 100%;
  height: 2.3rem;
  border-radius: .15rem;
  position: relative;
  background: linear-gradient(180deg, #494856 0%, #22222E 100%);
}
.vipicon {
  position: absolute;
  right: 0rem;
  bottom: 0rem;
  width: 0.4rem;
}
.vip_head img {
  width: 100%;
}
.vip_head_info {
  position: absolute;
  left: 1.9rem;
  top: 0.6rem;
}
.vip_head_info > div {
  font-size: 0.3rem;
  color: #fff;
}
.vip_head_info > p {
  font-size: 0.24rem;
  font-weight: bold;
  color: #999;
  margin-top: 0.08rem;
}
.vip_head_headphoto {
  width: 1rem;
  height: 1rem;
  position: absolute;
  left: 0.55rem;
  top: 0.6rem;
}
.vip_head_headphoto > img {
  width: 100%;
  height: 100%;
}
.vip_list {
  margin-top: 0.4rem;
  width: 100%;
  display: flex;
}
.vip_col {
  width: 1.8rem;
  height: 2.2rem;
  background: #FDF8F2;
  margin-right: 0.2rem;
  border-radius: 0.2rem;
  padding: 0.34rem 0 0.34rem;
  border: .02rem solid #CCCCCC;
}
.vip_col .title {
  font-size: 0.28rem;
  font-weight: bold;
  color: #A57255;
  text-align: center;
}
.vip_col .price {
  margin-top: 0.4rem;
  font-weight: bold;
  font-size: 0.28rem;
  color: #A57255;
  text-align: center;
}
.vip_col .price span {
  font-size: 0.34rem;
}
.vip_col.active {
  border: 0.06rem solid #A57255;
}
.vip_col.active .title {
  color: #000;
}
.vip_col.active .price {
  color: #A57255;
}

.paymode {
  margin-top: 0.36rem;
  display: flex;
  padding: 0 0.2rem;
}
.paymode_col {
  margin-right: 0.4rem;
  display: flex;
  align-items: center;
  font-weight: bold;
  font-size: 0.3rem;
  line-height: 1;
}
.paymode_col > span {
  width: 0.3rem;
  height: 0.3rem;
  border-radius: 50%;
  background: #252531;
  margin-right: 0.16rem;
  position: relative;
}
.paymode_col.active > span::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 50%;
  height: 50%;
  border-radius: 50%;
  background: #FFFFFF;
}

.vip_quanyi {
  margin-top: 0.4rem;
}
.vip_quanyi img {
  width: 100%;
}

.page_content {
  width: 100%;
  height: 100%;
  background: #fff;
  padding: 0.3rem;
  overflow-y: auto;
}
.page_container {
  width: 100%;
  padding: 0.3rem;
}
.page_container img {
  height: auto !important;
}

.statistics_box {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.statistics_head,
.statistics_foot {
  width: 100%;
}
.statistics_head img,
.statistics_foot img {
  width: 100%;
}
.statistics_cont {
  width: 100%;
  padding: 0.1rem 0.5rem;
  flex: 1;
  height: 100%;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.statistics_screen {
  width: 100%;
  display: flex;
  justify-content: space-between;
  border-bottom: 1px dashed #000;
  height: 0.8rem;
  align-items: center;
}
.screen_zhangben {
  position: relative;
  font-weight: bold;
  font-size: 0.3rem;
  padding-right: 0.4rem;
  height: 100%;
  display: flex;
  align-items: center;
}
.screen_zhangben:after {
  content: "";
  width: 0;
  height: 0;
  border-right: 0.08rem solid transparent;
  border-left: 0.08rem solid transparent;
  border-top: 0.1rem solid #333;
  position: absolute;
  right: 0.1rem;
  top: 50%;
  transform: translateY(-50%);
}
.screen_month {
  display: flex;
  align-items: center;
}
.screen_month > span {
  margin-right: 0.1rem;
  font-weight: bold;
  font-size: 0.3rem;
}
.screen_month > img {
  width: 0.46rem;
}

.statistics_tab_box {
  display: flex;
  align-items: center;
}
.statistics_tab {
  height: 0.8rem;
  border-radius: 0.22rem;
  margin-top: 0.4rem;
  display: flex;
  background: rgb(241, 241, 241);
}
.statistics_tab > div {
  cursor: pointer;
  width: 1.6rem;
  height: 100%;
  display: flex;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 0.34rem;
  border-radius: 0.22rem;
  color: #999;
}
.statistics_tab > div.active {
  background: #d96e81;
  color: #fff;
}
.statistics_block {
  width: 100%;
  margin-top: 0.5rem;
  flex: 1;
  overflow-y: auto;
}

.qushi_top {
  width: 100%;
  display: flex;
}
.qushi_top > div {
  width: 33.33%;
  flex: 1;
  text-align: center;
  border-right: 1px solid #eee;
  line-height: 1;
}
.qushi_top > div:last-of-type {
  border-right: 0;
}
.qushi_top > div > p:first-of-type {
  font-weight: bold;
  color: #999;
  font-size: 0.28rem;
}
.qushi_top > div > p:last-of-type {
  margin-top: 0.2rem;
  font-size: 0.3rem;
}

.qushi {
  margin-top: 0.3rem;
  position: relative;
  width: 100%;
}
.qushi_tab_s {
  display: flex;
  align-items: center;
  color: #888;
  font-weight: bold;
  font-size: 0.28rem;
  background: rgb(239, 251, 247);
  height: 0.7rem;
  padding: 0 0.2rem;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 999;
}
.qushi_tab_s > div {
  padding: 0 0.1rem;
}
.qushi_tab_s > div.active {
  color: #000;
}
.qushi_tab_cont {
  width: 100%;
  height: 4rem;
  position: relative;
  z-index: 1118;
}
.qushi_tab_cont > div {
  width: 100%;
  height: 100%;
  display: none;
  padding-top: 0.14rem;
}
.qushi_tab_cont > div.active {
  display: block;
}
.qushi_total {
  width: 90%;
  margin: 0.3rem auto 0;
  background: rgb(240, 240, 240);
  display: flex;
  align-items: center;
  height: 0.7rem;
  border-radius: 0.22rem;
  padding: 0 0.2rem;
  font-weight: bold;
  font-size: 0.24rem;
  line-height: 1;
}
.qushi_total span {
  color: red;
}

.qushi_table {
  margin-top: 0.3rem;
  width: 100%;
  background: rgb(248, 248, 248);
  padding: 0.2rem 0.2rem 0;
  position: relative;
}
.qushi_table::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0.2rem;
  background: url("../image/public/bg.png");
  background-size: 100%;
}
.qushi_table_head {
  width: 100%;
  height: 0.7rem;
  display: flex;
  align-items: center;
  border-bottom: 1px dashed #000;
}
.qushi_table_head > div {
  width: 22%;
  text-align: center;
  color: #888;
  font-weight: bold;
  font-size: 0.26rem;
}
.qushi_table_head > div:nth-of-type(2),
.qushi_table_head > div:nth-of-type(3) {
  width: 28%;
}

.qushi_table_tr {
  width: 100%;
  height: 0.8rem;
  display: flex;
  align-items: center;
  border-bottom: 1px solid #000;
}
.qushi_table_tr > div {
  width: 22%;
  text-align: center;
  color: #000;
  font-size: 0.26rem;
}

.qushi_table_tr > div:nth-of-type(2),
.qushi_table_tr > div:nth-of-type(3) {
  width: 28%;
}

.paihang_tab {
  width: 100%;
  display: flex;
  height: 1rem;
  background: rgb(241, 241, 241);
  justify-content: center;
  align-items: center;
  padding-bottom: 0.1rem;
}
.paihang_tab > div {
  font-weight: bold;
  font-size: 0.26rem;
  padding: 0.2rem 0.3rem;
  color: #888;
  margin: 0 0.3rem;
}
.paihang_tab > div.active {
  color: #333;
  position: relative;
}
.paihang_tab > div.active::after {
  content: "";
  width: 0.28rem;
  height: 0.08rem;
  background: #d96e81;
  border-radius: 0.08rem;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.paihang_title {
  font-weight: bold;
  text-align: center;
  font-size: 0.34rem;
  padding: 0.3rem 0;
  margin-top: 0.2rem;
}
.paihang_bing {
  margin-top: 0.1rem;
  width: 100%;
  height: 4rem;
}
.paihang_list {
  width: 100%;
  margin-top: 0.2rem;
}
.paihang_col {
  display: flex;
  align-items: center;
  margin-bottom: 0.3rem;
}
.paihang_col_icon {
  width: 1rem;
  height: 1rem;
  margin-right: 0.2rem;
  border-radius: 50%;
  background: rgb(245, 245, 245);
  display: flex;
  align-items: center;
  justify-content: center;
}
.paihang_col_icon img {
  width: 100%;
  height: 100%;
}
.paihang_col_cont {
  width: 1px;
  flex: 1;
}
.paihang_col_t {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: bold;
  font-size: 0.26rem;
}
.paihang_col_m {
  width: 100%;
  height: 0.2rem;
  border-radius: 0.4rem;
  margin-top: 0.1rem;
}
.paihang_col_m > div {
  height: 100%;
  border-radius: 0.4rem;
  background: #DFF04B;
}
.paihang_col_b {
  font-size: 0.26rem;
  color: #999;
  margin: 0.1rem;
  font-weight: bold;
}

.paihang_items {
  width: 100%;
  margin-top: 0.2rem;
}
.paihang_items_col {
  margin-bottom: 0.3rem;
}
.paihang_items_icon {
  width: 1rem;
  height: 1rem;
  margin-right: 0.2rem;
}
.paihang_items_icon img {
  width: 100%;
  height: 100%;
}
.paihang_items_t {
  font-size: 0.26rem;
  color: #888;
  font-weight: bold;
}
.paihang_items_b {
  display: flex;
  align-items: center;
  margin-top: 0.24rem;
}
.paihang_items_icon img {
  width: 100%;
  height: 100%;
}
.paihang_items_cont {
  width: 1px;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.26rem;
  color: #888;
  font-weight: bold;
}

.mask {
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1000;
}
.display {
  display: none !important;
}
.dig {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10001;
  display: flex;
  justify-content: center;
  align-items: center;
}

.zhangben_popup {
  width: 6rem;
  height: 8rem;
  border-radius: 0.2rem;
  background: #fff;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.zhangben_popup_title {
  width: 100%;
  font-weight: bold;
  font-size: 0.32rem;
  height: 0.9rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.zhangben_popup_list {
  height: 100%;
  flex: 1;
  width: 100%;
  overflow-y: auto;
  padding: 0.3rem;
}
.zhangben_popup_list > div {
  border-bottom: 1px solid #eee;
  font-size: 0.3rem;
  height: 0.9rem;
  line-height: 0.9rem;
  color: #999;
}
.zhangben_popup_list > div.active {
  color: #d96e81;
}
.zhangben_popup_btn {
  width: 100%;
  height: 0.9rem;
  display: flex;
}
.zhangben_popup_btn > div {
  width: 50%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.3rem;
  line-height: 1;
  cursor: pointer;
}
.zhangben_popup_btn > div:first-of-type {
  background: #DFF04B;
  color: #000;
}
.zhangben_popup_btn > div:last-of-type {
  background: #d96e81;
  color: #fff;
}
.orders_list {
  padding: 0.2rem 0.3rem;
}
.orders_col {
  width: 100%;
  padding: 0.3rem;
  background: #fff;
  margin-bottom: 0.3rem;
  border-radius: 0.2rem;
}
.orders_col_no {
  font-weight: bold;
  font-size: 0.3rem;
}
.orders_col_p {
  font-size: 0.26rem;
  color: #999;
  margin-top: 0.1rem;
}
.orders_col_btn {
  display: flex;
  justify-content: flex-end;
  margin-top: 0.2rem;
}
.orders_col_btn > div {
  width: 1rem;
  height: 0.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  cursor: pointer;
  font-size: 0.26rem;
  color: #fff;
  background: #d96e81;
  border-radius: 0.1rem;
}

.acc_tab {
  width: 3.8rem;
  height: 0.9rem;
  margin: 0 auto;
}
.acc_tab_line {
  width: 100%;
  height: 0.14rem;
  border-radius: 0.14rem;
  background: rgb(251, 126, 160);
}
.acc_tab_s {
  background: #fff;
  width: 94%;
  display: flex;
  margin: 0 auto;
  padding: 0.2rem 0;
}
.acc_tab_s > div {
  width: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-right: 1px solid #eee;
  font-weight: bold;
  color: #999;
  font-size: 0.26rem;
  line-height: 1;
}
.acc_tab_s > div:last-of-type {
  border-right: 0;
}
.acc_tab_s > div.active {
  color: #000;
}

.acc_flex {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.acc_col {
  width: 25%;
  margin-bottom: 0.4rem;
}
.acc_col_inner {
  width: 1.5rem;
  margin: 0 auto;
}
.acc_col_inner .icon {
  width: 1rem;
  height: 1rem;
  margin: 0 auto;
  position: relative;
  z-index: 111;
  border-radius: 50%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgb(245, 245, 245);
}
.acc_col_inner .icon img {
  width: 100%;
  height: 100%;
}
.acc_col_inner .title {
  width: 100%;
  font-size: 0.24rem;
  height: 0.64rem;
  display: flex;
  align-items: center;
  justify-content: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  position: relative;
  z-index: 112;
  line-height: 1;
}
.acc_col.active .acc_col_inner .icon {
  transform: scale(1.2);
}

.index_top {
  background: linear-gradient(180deg, #FEDA50 0%, #D0FC4C 100%);
  width: 100%;
  padding: 0 0.3rem 0.8rem;
}
.index_top_title {
  position: relative;
  font-size: 0.36rem;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 1rem;
  width: 100%;
  font-weight: bold;
}
.index_top_title .zb {
  font-weight: bold;
  font-size: 0.3rem;
  padding-right: 0.4rem;
  display: flex;
  align-items: center;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.index_top_title .zb:after {
  content: "";
  width: 0;
  height: 0;
  border-right: 0.08rem solid transparent;
  border-left: 0.08rem solid transparent;
  border-top: 0.1rem solid #333;
  position: absolute;
  right: 0.1rem;
  top: 50%;
  transform: translateY(-50%);
}
.index_top_cont {
  display: flex;
  align-items: center;
  padding-bottom: 0.2rem;
}
.index_top_cont_l {
  width: 1.6rem;
}
.index_top_cont_l > p:first-of-type {
  font-size: 0.24rem;
  color: #999;
}
.index_top_cont_l > p:last-of-type {
  font-size: 0.26rem;
  color: #333;
  display: flex;
  align-items: center;
}
.index_top_cont_l > p:last-of-type i {
  width: 0;
  height: 0;
  border-right: 0.1rem solid transparent;
  border-left: 0.1rem solid transparent;
  border-top: 0.12rem solid #333;
  margin-left: 0.2rem;
}
.index_top_cont_l > p:last-of-type span {
  font-size: 0.4rem;
  margin-right: 0.1rem;
}
.index_top_cont_r {
  width: 100%;
  flex: 1;
  display: flex;
  align-items: center;
  position: relative;
  padding-left: 0.4rem;
}
.index_top_cont_r:after {
  content: "";
  width: 0.02rem;
  height: 0.4rem;
  background: #777;
  position: absolute;
  left: 0;
  bottom: 0;
}
.index_top_cont_r > div {
  width: 33.33%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.index_top_cont_r > div > p:first-of-type {
  color: #777;
  font-size: 0.26rem;
}
.index_top_cont_r > div > p:last-of-type {
  color: #333;
  font-size: 0.28rem;
  margin-top: 0.16rem;
}

.index_mm {
  background: #fff;
  border-radius: 0.12rem;
  height: 1.5rem;
  margin: -0.75rem 0.26rem 0;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  display: flex;
}
.index_mm > div {
  width: 25%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.index_mm > div > img {
  width: 0.6rem;
  height: 0.6rem;
}
.index_mm > div > p {
  margin-top: 0.1rem;
  font-size: 0.26rem;
  color: #666;
}

/* .index_box {
  width: 100%;
  position: relative;
}
.index_box .date {
  position: absolute;
  left: .42rem;
  top: 1.6rem;
  width: 1rem;
  font-weight: bold;
}
.index_box .date > p:first-of-type {
  text-align: center;
  font-size: .32rem;
}
.index_box .date > p:last-of-type {
  text-align: center;
  font-size: .22rem;
}
.index_box .title {
  font-weight: bold;
  font-size: .42rem;
  position: absolute;
  left: .4rem;
  position: absolute;
  top: .1rem;
} */

/* 
.index_list {
  width: 6.1rem;
  padding: .3rem;
  background: #fff;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 3.1rem;
}
.index_list_t {
  width: 100%;
  border-bottom: 1px dashed #000;
  padding-bottom: .2rem;
}
.index_list_t .index_col {
  width: 100%;
  display: flex;
  align-items: center;
  height: .7rem;
}
.index_list_t .index_col > div {
  width: 35%;
  font-size: .26rem;
  font-weight: bold;
}
.index_list_t .index_col > div:first-of-type {
  width: 50%;
}
.index_list_t .index_col > div:nth-of-type(2) {
  text-align: center;
  width: 15%;
}
.index_list_t .index_col > div:last-of-type {
  text-align: right;
}

.index_list_m {
  padding: .2rem 0;
  border-bottom: 1px dashed #000;
}
.index_list_m .index_col {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: .7rem;
}
.index_list_m .index_col > div {
  font-size: .26rem;
  font-weight: bold;
}

.index_list_b {
  padding: .2rem 0;
  text-align: right;
}
.index_list_b > p:first-of-type {
  font-size: .26rem;
  font-weight: bold;
}
.index_list_b > p:last-of-type {
  font-weight: bold;
  font-size: .34rem;
  color: red;
  margin-top: .1rem;
} */

.index_liushui {
  margin: 0.3rem 0.3rem 0;
}
.index_liushui_col {
  margin-bottom: 0.3rem;
}
.index_liushui_col_top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #999;
  font-size: 0.24rem;
}
.index_liushui_items {
  margin-top: 0.3rem;
}
.index_liushui_items_col {
  display: flex;
  align-items: center;
  margin-bottom: 0.2rem;
}
.liushui_col_items_icon {
  width: 0.8rem;
  height: 0.8rem;
  margin-right: 0.3rem;
  border-radius: 50%;
  background: rgb(245, 245, 245);
  display: flex;
  align-items: center;
  justify-content: center;
}
.liushui_col_items_icon img {
  width: 100%;
  height: 100%;
}
.liushui_col_items_cont {
  width: 1px;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.26rem;
  color: #888;
}

.bill_box {
  padding: 0.3rem;
}
.bill_card {
  background: linear-gradient(132deg, #FEDA50 8.51%, #D0FC4C 120.27%);
  border-radius: 0.16rem;
  padding: 0.3rem 0.5rem;
}
.bill_card > p:first-of-type {
  font-size: 0.24rem;
}
.bill_card > p:nth-of-type(2) {
  font-size: 0.44rem;
}
.bill_card > div {
  margin-top: 0.3rem;
  display: flex;
  align-items: center;
}
.bill_card > div > p {
  width: 50%;
  font-size: 0.24rem;
}
.bill_card > div > p span {
  font-size: 0.28rem;
  margin-left: 0.06rem;
}

.bill_table {
  margin-top: 0.3rem;
}
.bill_table > .bill_tr:first-of-type {
  color: #999;
  font-size: 0.24rem;
}
.bill_tr {
  width: 100%;
  border-bottom: 0.02rem solid rgba(0, 0, 0, 0.05);
  display: flex;
  padding: 0.2rem;
  font-size: 0.28rem;
  line-height: 1.6;
}
.bill_tr > p {
  width: 25%;
}

.bill_cont {
  width: 100%;
}

.bill_screen {
  width: 100%;
  display: flex;
  justify-content: space-between;
  border-bottom: 1px dashed #000;
  height: 0.8rem;
  align-items: center;
}
.screen_zhangben {
  position: relative;
  font-weight: bold;
  font-size: 0.3rem;
  padding-right: 0.4rem;
  height: 100%;
  display: flex;
  align-items: center;
}
.screen_zhangben:after {
  content: "";
  width: 0;
  height: 0;
  border-right: 0.08rem solid transparent;
  border-left: 0.08rem solid transparent;
  border-top: 0.1rem solid #333;
  position: absolute;
  right: 0.1rem;
  top: 50%;
  transform: translateY(-50%);
}
.screen_month {
  display: flex;
  align-items: center;
}
.screen_month > span {
  margin-right: 0.1rem;
  font-weight: bold;
  font-size: 0.3rem;
}
.screen_month > img {
  width: 0.46rem;
}

.bill_tab_box {
  display: flex;
  align-items: center;
}
.bill_tab {
  height: 0.7rem;
  margin-top: 0.2rem;
  display: flex;
}
.bill_tab > div {
  cursor: pointer;
  width: 1.2rem;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 0.3rem;
  color: #999;
  position: relative;
}
.bill_tab > div.active {
  color: #000;
  position: relative;
}
.bill_tab > div.active:after {
  content: '';
  position: absolute;
  bottom: .06rem;
  left: 50%;
  transform: translateX(-50%);
  background: #000;
  width: .4rem;
  height: .04rem;
}
.bill_tab > div img {
  position: absolute;
  top: 0;
  right: 0;
  width: 0.36rem;
  height: 0.36rem;
}

.bill_block {
  width: 100%;
  margin-top: 0.2rem;
  flex: 1;
  overflow-y: auto;
  position: relative;
}

.liushui_top {
  width: 100%;
  display: flex;
}
.liushui_top > div {
  width: 33.33%;
  flex: 1;
  text-align: center;
  border-right: 1px solid #eee;
  line-height: 1;
}
.liushui_top > div:last-of-type {
  border-right: 0;
}
.liushui_top > div > p:first-of-type {
  font-weight: bold;
  color: #999;
  font-size: 0.28rem;
}
.liushui_top > div > p:last-of-type {
  margin-top: 0.2rem;
  font-size: 0.3rem;
}

.liushui_list {
  width: 100%;
  margin-top: 0.8rem;
}
.liushui_col {
  margin-bottom: 0.3rem;
}
.liushui_col_top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: bold;
  color: #999;
  font-size: 0.24rem;
}
.liushui_items {
  margin-top: 0.2rem;
}
.liushui_items_col {
  display: flex;
  align-items: center;
  margin-bottom: 0.3rem;
}
.liushui_items_icon {
  width: 0.8rem;
  height: 0.8rem;
  margin-right: 0.3rem;
  border-radius: 50%;
  background: rgb(245, 245, 245);
  display: flex;
  align-items: center;
  justify-content: center;
}
.liushui_items_icon img {
  width: 100%;
  height: 100%;
}

.liushui_items_cont {
  width: 1px;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.26rem;
  color: #888;
  font-weight: bold;
}

.jianpan {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 7.5rem;
  height: 6.4rem;
  display: none;
  z-index: 113;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}
.jianpan_amount {
  font-weight: bold;
  font-size: 0.36rem;
  position: absolute;
  right: 0.3rem;
  top: 0.2rem;
}
.jianpan_remark {
  position: absolute;
  width: 100%;
  height: 0.66rem;
  left: 0;
  top: 0.85rem;
  padding: 0 0.5rem;
  display: flex;
  align-items: center;
  font-size: 0.28rem;
}
.jianpan_remark input {
  background: transparent;
  outline: none;
  border: none;
}

.jianpan_keys {
  display: flex;
  flex-wrap: wrap;
  position: absolute;
  left: 0rem;
  top: 1.75rem;
  bottom: 0.2rem;
  width: 7.5rem;
  height: 4.5rem;
}
.jianpan_keys > div {
  width: 25%;
  top: 1.75rem;
  height: 1.1rem;
}
.jianpan_keys > div.jianpan_date {
  font-size: 0.3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  color: #333;
}

.zhangben_list {
  padding: 0.3rem 0.3rem;
}
.zhangben_col {
  width: 100%;
  margin-bottom: 0.6rem;
  position: relative;
  padding-bottom: 0.8rem;
  padding-top: .3rem;
  border-radius: .3rem;
  border: .04rem solid #DFF04B;
}
.zhangben_col img {
  width: 1.8rem;
  margin: 0 auto;
}
.zhangben_col .name {
  height: 0.5rem;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -.4rem;
  border: 2px solid #DFF04B;
  border-radius: 0.16rem;
  background: #fff;
  height: 0.8rem;
  width: 3rem;
  display: flex;
  align-items: center;
  padding: 0 0.2rem;
}
.zhangben_col .name > p {
  width: 100%;
  flex: 1;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  font-weight: bold;
  font-size: 0.28rem;
  margin-right: 0.2rem;
  text-align: center;
}
.zhangben_col .name .edit {
  width: 0.36rem;
  cursor: pointer;
}

.zhangben_btn {
  width: 4rem;
  height: 0.9rem;
  margin: 0.4rem auto;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 0.3rem;
  background: #DFF04B;
  color: #000;
  border-radius: 0.9rem;
  position: fixed;
  bottom: 0.4rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 999;
}

.info_form {
  padding: 0 0.3rem;
}
.info_form_col {
  min-height: 1rem;
  border-bottom: 1px solid #eee;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.2rem 0;
}
.info_form_col .headphoto {
  width: 0.9rem;
  height: 0.9rem;
}
.info_form_col .headphoto img {
  width: 100%;
  border-radius: 50%;
  height: 100%;
}
.info_form_col > p {
  flex: 1;
  text-align: right;
}

.info_form_col label {
  font-size: 0.3rem;
  font-weight: bold;
}
.info_form_col .icon_right {
  width: 0.26rem;
}

.info_form_col .email {
  display: flex;
  align-items: center;
  font-size: 0.3rem;
  color: #999;
}
.info_form_col .email div {
  margin-left: 0.2rem;
  height: 0.52rem;
  width: 1rem;
  border-radius: 0.6rem;
  background: #000;
  color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.26rem;
  font-weight: bold;
  line-height: 1;
}

.daochu_box {
  padding: 0.3rem;
}
.daochu_inner {
  width: 100%;
  padding: 0.2rem 0.3rem;
  background: #fff;
}
.daochu_col {
  display: flex;
  height: 0.9rem;
  align-items: center;
  justify-content: space-between;
}
.daochu_col label {
  font-weight: bold;
  font-size: 0.28rem;
}
.daochu_col_select {
  display: flex;
  align-items: center;
  font-size: 0.28rem;
  color: #888;
}
.daochu_col_select .icon {
  width: 0.24rem;
  margin-left: 0.1rem;
}
.daochu_col_dates {
  display: flex;
  align-items: center;
}
.daochu_col_dates > div {
  height: 0.5rem;
  line-height: 0.5rem;
  font-size: 0.24rem;
  font-weight: bold;
  padding: 0 0.2rem;
  background: #F8F8F8;
  color: #8F8F8F;
  margin-right: 0.16rem;
  border-radius: 0.5rem;
}
.daochu_col_dates > div:last-of-type {
  margin-right: 0;
}
.daochu_col_dates > div.active {
  background: #000;
  color: #DFF04B;
}

.daochu_btn {
  width: 3rem;
  height: 0.9rem;
  margin: 0.4rem auto 0.3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 0.3rem;
  border-radius: 0.9rem;
  background: #DFF04B;
}

.popup {
  background: #fff;
  border-radius: 0.16rem;
  width: 6rem;
  padding: 0.3rem;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10001;
  display: none;
}
.popup_title {
  text-align: center;
  font-weight: 600;
  font-size: 0.34rem;
}
.popup_btn {
  width: 100%;
  height: 0.9rem;
  display: flex;
}
.popup_btn > div {
  width: 50%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.3rem;
  line-height: 1;
  cursor: pointer;
}
.popup_btn > div:first-of-type {
  background: #DFF04B;
  color: #fff;
}
.popup_btn > div:last-of-type {
  background: #fede65;
  color: #000;
}
.popup_form {
  width: 100%;
  padding: 0.3rem 0;
}
.popup_form_col {
  border-bottom: 1px solid #dedede;
  display: flex;
  margin-bottom: 0.26rem;
  align-items: center;
  width: 100%;
  height: 0.9rem;
}
.popup_form_col input {
  width: 100%;
  flex: 1;
  border: none;
  font-size: 0.3rem;
  outline: none;
}

.tuiding {
  height: 0.56rem;
  border-radius: 0.56rem;
  background: #fe7297;
  width: 1.2rem;
  line-height: 1;
  color: #fff;
  font-size: 0.26rem;
  position: absolute;
  right: 0.3rem;
  top: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  display: none;
}

.tuiding_box {
  padding: 0.2rem 0.3rem;
  background: #fff;
  border-radius: 0.2rem;
  margin: 0 0.26rem;
}
.tuiding_col {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.3rem;
  padding: 0.2rem 0;
}
.tuiding_btn {
  height: 0.7rem;
  border-radius: 0.7rem;
  background: #000;
  width: 2.4rem;
  color: #fff;
  font-size: 0.26rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0.4rem auto 0;
}
.tuiding_msg {
  margin-top: 0.8rem;
  font-size: 0.3rem;
  line-height: 1.8;
  color: #666;
}

.zhangben_style {
  width: 100%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.zhangben_style_col {
  width: 33.33%;
  padding: .3rem;
}
.zhangben_style_col.active {
  transform: scale(1.3);
}
.zhangben_style_col > img {
  width: 1rem;
  margin: 0 auto;
}
.zhangben_form_box {
  padding: 0.26rem;
}
.zhangben_form_title {
  font-weight: bold;
  margin-bottom: 0.2rem;
  line-height: 2;
  padding-left: 0.2rem;
  font-size: 0.32rem;
}
.zhangben_form_input {
  width: 100%;
  border-bottom: 1px solid #eee;
  height: 1rem;
  display: flex;
  align-items: center;
}
.zhangben_form_input > input {
  border: none;
  outline: none;
  background: transparent;
  font-size: 0.3rem;
  padding: 0 0.3rem;
}

.cls_list {
  padding: 0.3rem 0.6rem;
}
.cls_col {
  display: flex;
  align-items: center;
  margin-bottom: 0.3rem;
}
.cls_col_icon {
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  background: rgb(245, 245, 245);
  display: flex;
  align-items: center;
  justify-content: center;
}
.cls_col_icon img {
  width: 100%;
  height: 100%;
}
.cls_col_p {
  width: 1px;
  flex: 1;
  font-size: 0.3rem;
  margin-left: 0.3rem;
}
.cls_col_op {
  display: flex;
}
.cls_col_op > div {
  margin-left: 0.4rem;
  cursor: pointer;
  font-size: 0.28rem;
}
.cls_col_op > div.edit {
  color: #3464b5;
}
.cls_col_op > div.del {
  color: red;
}

.acc_top {
  display: flex;
  padding: 0.3rem;
}

.select_zb {
  font-weight: bold;
  font-size: 0.3rem;
  padding-right: 0.4rem;
  display: flex;
  align-items: center;
  position: relative;
}
.select_zb:after {
  content: "";
  width: 0;
  height: 0;
  border-right: 0.08rem solid transparent;
  border-left: 0.08rem solid transparent;
  border-top: 0.1rem solid #333;
  position: absolute;
  right: 0.1rem;
  top: 50%;
  transform: translateY(-50%);
}

.cls_popup {
  width: 6rem;
  /* height: 8rem; */
  border-radius: 0.2rem;
  background: #fff;
  display: block;
  /* flex-direction: column; */
  overflow: hidden;
}
.cls_popup_title {
  width: 100%;
  font-weight: bold;
  font-size: 0.32rem;
  height: 0.9rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cls_popup_btn {
  width: 100%;
  height: 0.9rem;
  display: flex;
}
.cls_popup_btn > div {
  width: 50%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.3rem;
  line-height: 1;
  cursor: pointer;
}
.cls_popup_btn > div:first-of-type {
  background: #DFF04B;
  color: #fff;
}
.cls_popup_btn > div:last-of-type {
  background: #d96e81;
  color: #fff;
}

.cls_popup_icon {
  display: flex;
  flex-wrap: wrap;
}
.cls_popup_icon > div {
  width: 25%;
  padding: 0.3rem;
}
.cls_popup_icon > div.active {
  transform: scale(1.3);
}
.cls_popup_subtitle {
  font-weight: bold;
  font-size: 0.28rem;
  padding: 0 0.3rem;
  line-height: 2;
}
.cls_popup_input {
  margin: 0.3rem;
  border-bottom: 1px solid #dedede;
  padding-bottom: 0.3rem;
}
.cls_popup_input input {
  display: block;
  width: 100%;
  font-size: 0.3rem;
  border: none;
  outline: none;
}
.cls_popup_radio {
  padding: 0.3rem;
}

.detail_box {
  background: #fff;
  padding: 0.3rem 0.3rem;
  border-radius: 0.4rem;
  margin: 0.3rem;
}
.detail_col {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: bold;
  font-size: 0.3rem;
  padding: 0.26rem 0;
}
.detail_col > p {
  display: flex;
  align-items: center;
}
.detail_col > p img {
  width: 0.6rem;
  height: 0.6rem;
  margin-right: 0.2rem;
  border-radius: 50%;
  background: rgb(245, 245, 245);
}

.vipVV {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 998;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.vipVV > p {
  font-size: 0.3rem;
  color: red;
  font-weight: bold;
}
.vipVV > div {
  width: 3.2rem;
  height: 0.7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 0.3rem;
  background: #fb80a0;
  color: #fff;
  border-radius: 0.7rem;
  z-index: 999;
  margin-top: 1rem;
}

.remind_list {
  padding: 0.2rem 0.3rem;
}
.remind_col {
  padding: 0.3rem;
  width: 100%;
  background: #fff;
  margin-bottom: 0.3rem;
  border-radius: 0.2rem;
}
.remind_col_item {
  display: flex;
  align-items: center;
  height: 0.8rem;
}
.remind_col_item > div {
  font-weight: bold;
  font-size: 0.28rem;
}
.remind_col_btn {
  display: flex;
  margin-top: 0.2rem;
  justify-content: space-around;
  padding: 0 0.6rem;
}
.remind_col_btn > div {
  width: 1.2rem;
  height: 0.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  cursor: pointer;
  font-size: 0.26rem;
  color: #fff;
  background: #d96e81;
  border-radius: 0.1rem;
}
.remind_col_btn > div:first-of-type {
  background: #000;
  color: #D0FC4C;
}
.remind_col_item > div:last-of-type {
  width: 100%;
  flex: 1;
  text-align: right;
  display: flex;
  justify-content: flex-end;
}
.remind_col_item .switch {
  width: 0.7rem;
}

.remind_btn {
  width: 4rem;
  height: 0.9rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 0.3rem;
  border-radius: 0.9rem;
  background: #DFF04B;
  position: fixed;
  bottom: 0.3rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 999;
}
.remind_hint {
  font-weight: bold;
  font-size: 0.26rem;
  padding-left: 0.3rem;
}

.remind_pop {
  width: 6.8rem;
  border-radius: 0.2rem;
  background: #fff;
  display: flex;
  flex-direction: column;
}
.remind_pop_title {
  width: 100%;
  font-weight: bold;
  font-size: 0.32rem;
  height: 0.9rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.remind_pop_btn {
  width: 100%;
  height: 0.9rem;
  display: flex;
}
.remind_pop_btn > div {
  width: 50%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.3rem;
  line-height: 1;
  cursor: pointer;
}
.remind_pop_btn > div:first-of-type {
  background: #DFF04B;
  color: #fff;
}
.remind_pop_btn > div:last-of-type {
  background: #d96e81;
  color: #fff;
}

.remind_form {
  padding: 0.2rem 0.3rem 0.3rem;
  width: 100%;
}
.remind_form_col {
  display: flex;
  align-items: center;
  height: 0.8rem;
  width: 100%;
  margin-bottom: 0.2rem;
}
.remind_form_col > label {
  font-size: 0.28rem;
  color: #666;
}
.remind_form_col > div {
  width: 1px;
  flex: 1;
  margin-left: 0.3rem;
}
.remind_form_time {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.remind_form_time .layui-form-select {
  width: 80px !important;
}
.remind_form_col > div .layui-input {
  text-align: right;
  padding-right: 0.2rem;
  font-size: 0.26rem;
}

.style_flex {
  display: flex;
  flex-wrap: wrap;
  padding: 0.2rem 0.3rem;
}
.style_col {
  width: 2.1rem;
  margin-right: 0.2rem;
  margin-bottom: 0.3rem;
  background: #fff;
  border-radius: 0.2rem;
  overflow: hidden;
  position: relative;
}
.style_col:nth-child(3n) {
  margin-right: 0;
}
.style_col_inner {
  width: 100%;
  height: 2.1rem;
  padding: 0.7rem;
}
.style_col_inner > div {
  width: 100%;
  height: 100%;
}
.style_col_title {
  height: 0.7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.26rem;
  font-weight: bold;
  color: #000;
}
.style_col.active .style_col_title {
  color: #000;
  background: #DFF04B;
}



.jp_flex {
  display: flex;
  flex-wrap: wrap;
  padding: 0 0.3rem;
}
.jp_col {
  width: 3.2rem;
  margin-right: 0.2rem;
  margin-bottom: 0.3rem;
  background: #fff;
  border-radius: 0.2rem;
  overflow: hidden;
  position: relative;
}
.jp_col:nth-child(2n) {
  margin-right: 0;
}
.jp_col_inner {
  width: 100%;
  height: 3rem;
}
.jp_col_inner > img {
  width: 100%;
  height: 100%;
}
.jp_col_title {
  height: 0.7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.26rem;
  font-weight: bold;
  color: #000;
}
.jp_col_title img {
  width: .3rem;
  margin-right: .2rem;
}
.jp_col.active .jp_col_title {
  color: #000;
  background: #DFF04B;
}





.bgpage_btn {
  width: 4rem;
  height: 0.9rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 0.3rem;
  border-radius: 0.9rem;
  background: #fede65;
  box-shadow: 0 6px 0 0 #ebb85f;
  position: fixed;
  bottom: 0.3rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1118;
}
.bgpage_btn .icon,
.style_col .icon {
  position: absolute;
  right: 0;
  top: 0;
  width: 0.4rem;
}

.mask2 {
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1001;
}

.timeset_list {
  padding: 0.2rem 0.3rem;
}
.timeset_col {
  padding: 0.3rem;
  width: 100%;
  background: #fff;
  margin-bottom: 0.2rem;
  border-radius: 0.2rem;
}
.timeset_col_item {
  display: flex;
  align-items: center;
  height: 0.7rem;
}
.timeset_col_item > div {
  font-weight: bold;
  font-size: 0.28rem;
}
.timeset_col_btn {
  display: flex;
  margin-top: 0.3rem;
  justify-content: space-around;
  padding: 0 0.6rem;
}
.timeset_col_btn > div {
  width: 1.2rem;
  height: 0.55rem;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  cursor: pointer;
  font-size: 0.26rem;
  color: #fff;
  background: #d96e81;
  border-radius: 0.1rem;
}
.timeset_col_btn > div:first-of-type {
  background: #fede65;
}
.timeset_col_item > div:last-of-type {
  width: 100%;
  flex: 1;
  text-align: right;
  display: flex;
  justify-content: flex-end;
}

.timeset_btn {
  width: 4rem;
  height: 0.9rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 0.3rem;
  border-radius: 0.9rem;
  background: #DFF04B;
  position: fixed;
  bottom: 0.3rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 996;
}
.timeset_hint {
  font-weight: bold;
  font-size: 0.26rem;
  padding-left: 0.3rem;
}

.timeset_pop {
  width: 6.8rem;
  border-radius: 0.2rem;
  background: #fff;
  display: flex;
  flex-direction: column;
}
.timeset_pop_title {
  width: 100%;
  font-weight: bold;
  font-size: 0.32rem;
  height: 0.9rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.timeset_pop_btn {
  width: 100%;
  height: 0.9rem;
  display: flex;
}
.timeset_pop_btn > div {
  width: 50%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.3rem;
  line-height: 1;
  cursor: pointer;
}
.timeset_pop_btn > div:first-of-type {
  background: #000;
  color: #DFF04B;
}
.timeset_pop_btn > div:last-of-type {
  background: #F26161;
  color: #fff;
}

.timeset_form {
  padding: 0.2rem 0.3rem 0.3rem;
  width: 100%;
}
.timeset_form_col {
  display: flex;
  align-items: center;
  height: 0.8rem;
  width: 100%;
  margin-bottom: 0.2rem;
}
.timeset_form_col > label {
  font-size: 0.28rem;
  color: #666;
  width: 2rem;
}
.timeset_form_col > div {
  width: 1px;
  flex: 1;
  margin-left: 0.3rem;
}
.timeset_form_col > div .layui-input {
  text-align: right;
  font-size: 0.26rem;
  padding-right: 0.5rem;
}

.help_list {
  padding: 0.3rem;
  background: #fff;
  margin-top: 0.26rem;
}
.help_col {
  font-size: 0.3rem;
  padding: 0.3rem 0;
}


.yusuan_info {
  width: 100%;
  background: #fff;
  padding: .3rem;
}

.yusuan_top_flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.yusuan_top_flex > p {
  font-size: .26rem;
  color: #333;
  display: flex;
  align-items: center;
}
.yusuan_top_flex > p img {
  width: .4rem;
  margin-right: .1rem;
}
.yusuan_top_flex > div {
  font-size: .26rem;
  color: #666;
}

.yusuan_cont {
  margin-top: .3rem;
  display: flex;
  align-items: center;
}
.yusuan_cont_quan {
  width: 2.4rem;
}
.yusuan_cont_r {
  width: 100%;
  flex: 1;
  margin-left: .3rem;
}

.yusuan_cont_r > div:first-of-type {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.yusuan_cont_r > div:first-of-type {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: .26rem;
  border-bottom: .02rem solid #eee;
  padding-bottom: .1rem;
}
.yusuan_cont_r > div:first-of-type > p:last-of-type {
  font-size: .34rem;
}

.yusuan_cont_r > div:nth-of-type(2),
.yusuan_cont_r > div:nth-of-type(3) {
  font-size: .24rem;
  align-items: center;
  justify-content: space-between;
  display: flex;
  color: #666;
  margin-top: .2rem;
}





.circle {
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: #DFF04B;
  position: relative;
}
.pie_left,
.pie_right {
  width: 2rem;
  height: 2rem;
  position: absolute;
  top: 0;
  left: 0;
}
.left,
.right {
  display: block;
  width: 2rem;
  height: 2rem;
  background: #dddddd;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
}
.pie_right,
.right {
  clip: rect(0, auto, auto, 1rem);
}
.pie_left,
.left {
  clip: rect(0, 1rem, auto, 0);
}
.circle_tit {
  width: 1.6rem;
  height: 1.6rem;
  border-radius: 50%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  position: absolute;
  font-size: .28rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #666;
  flex-direction: column;
}
.circle_tit p:last-of-type {
  color: #333;
  font-size: .32rem;
}


.budget_pop {
  width: 7.5rem;
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  border-top-left-radius: .2rem;
  border-top-right-radius: .2rem;
  z-index: 1001;
}
.budget_pop_tit {
  text-align: center;
  padding: .3rem;
  font-size: .3rem;
  font-weight: bold;
}
.budget_pop_input {
  width: 6.8rem;
  margin: .2rem auto 0;
  height: .8rem;
  border-radius: .1rem;
  background: rgb(245, 245, 245);
  display: flex;
  align-items: center;
}
.budget_pop_input > div {
  width: 100%;
}
.budget_pop_input input {
  border: none;
  outline: none;
  display: block;
  width: 100%;
  height: 100%;
  background: transparent;
  font-size: .28rem;
  padding: 0 .3rem;
}
.budget_pop_btn {
  width: 3rem;
  height: .85rem;
  background: #DFF04B;
  border-radius: .85rem;
  color: #333;
  font-weight: bold;
  font-size: .3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: .5rem auto 0;
}

.budget_pop_jp {
  width: 100%;
  position: relative;
  margin-top: .4rem;
}
.budget_pop_jp_keys {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  display: flex;
  flex-wrap: wrap;
}
.budget_pop_jp_keys > div {
  width: 33.33%;
  height: 1rem;
}

.select_pop {
  width: 7.5rem;
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  z-index: 1001;
}
.select_pop > div {
  border-bottom: .02rem solid #eee;
  width: 100%;
  height: .9rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .3rem;
}

.select_pop2 {
  width: 7.5rem;
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  z-index: 1001;
}
.select_pop2 > div {
  border-bottom: .02rem solid #eee;
  width: 100%;
  height: .9rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .3rem;
}

.yusuan_class {
  width: 100%;
  height: 100%;
  flex: 1;
  margin-top: .2rem;
  background: #fff;
  overflow-y: auto;
  padding: .3rem;
}
.yusuan_class_col {
  margin-bottom: .3rem;
}

.bg_title {
  font-weight: bold;
  font-size: .32rem;
  padding: .3rem;
}