body {
  padding-bottom: 1.2rem;
}

.lg-page {
  padding-top: 1.1rem;
  overflow: hidden;
  background: #ffffff;
}

.lg-content {
  min-height: 5.72rem;
  padding: 1.04rem 0 .85rem;
  background: #ffffff;
}

.lg-box {
  width: 6rem;
  margin: 0 auto;
}

.lg-box h1 {
  margin-bottom: .31rem;
  font-family: Poppins, Poppins, sans-serif;
  font-weight: 700;
  font-size: .34rem;
  line-height: .46rem;
  color: #333333;
}

.lg-form {
  width: 100%;
}

.lg-field {
  width: 100%;
  height: .48rem;
  display: grid;
  grid-template-columns: .9rem 1fr;
  align-items: center;
  border: .01rem solid #e0e0e0;
  border-radius: .04rem;
  background: #ffffff;
}

.lg-field span {
  height: .2rem;
  padding-left: .16rem;
  border-right: .01rem solid #eeeeee;
  font-family: Poppins, Poppins;
  font-weight: 400;
  font-size: 0.14rem;
  color: #333333;
}

.lg-field input {
  min-width: 0;
  height: 100%;
  padding: 0 .17rem;
  font-family: Poppins, Poppins, sans-serif;
  font-weight: 400;
  font-size: .16rem;
  color: #333333;
}

.lg-field input::placeholder {
  color: #cfcfcf;
}

.lg-panel {
  display: none;
  margin-top: .22rem;
}

.lg-panel.active {
  display: block;
}

.lg-code-line {
  display: grid;
  grid-template-columns: 4.8rem 1fr;
  gap: .22rem;
  align-items: center;
}

.lg-code-line .lg-field {
  margin-top: 0;
}

.lg-code-line .lg-field {
  grid-template-columns: 1.48rem 1fr;
}

.lg-send-code {
  justify-self: start;
  font-family: Poppins, Poppins, sans-serif;
  font-weight: 400;
  font-size: .16rem;
  line-height: .24rem;
  color: var(--red);
  text-decoration: underline;
}

.lg-options {
  margin-top: .2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.lg-remember {
  display: flex;
  align-items: center;
  gap: .1rem;
  cursor: pointer;
}

.lg-remember input {
  display: none;
}

.lg-remember i {
  width: .18rem;
  height: .18rem;
  border: .01rem solid #c8c8c8;
  border-radius: .03rem;
  background: #ffffff;
}

.lg-remember input:checked+i {
  border-color: var(--red);
  background: var(--red);
  box-shadow: inset 0 0 0 .04rem #ffffff;
}

.lg-remember span,
.lg-switch,
.lg-bottom {
  font-family: Poppins, Poppins, sans-serif;
  font-weight: 400;
  font-size: .16rem;
  line-height: .24rem;
  color: #333333;
}

.lg-switch {
  min-width: 1.6rem;
  text-align: right;
}

.lg-submit {
  width: 4rem;
  height: .48rem;
  margin-top: .43rem;
  border-radius: .06rem;
  background: var(--red);
  font-family: Poppins, Poppins, sans-serif;
  font-weight: 700;
  font-size: .18rem;
  line-height: .48rem;
  color: #ffffff;
  text-align: center;
}

.lg-bottom {
  margin-top: .28rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.lg-bottom p {
  color: #333333;
}

.lg-bottom a {
  color: #003c9c;
  display: inline-block;
}

.lg-bottom>a {
  color: #333333;
}

@media (max-width: 1200px) {
  .lg-box {
    width: 6rem;
    max-width: 92%;
  }
}

.rg-content,
.fg-content {
  min-height: 7.3rem;
  padding: 1rem 0 .95rem;
}

.rg-box,
.fg-box {
  width: 6rem;
}

.rg-box h1,
.fg-box h1 {
  margin-bottom: .26rem;
}

.rg-field,
.fg-field {
  margin-top: .2rem;
}

.rg-form>.rg-field:first-child,
.fg-form>.fg-field:first-child {
  margin-top: 0;
}

.rg-field,
.fg-field {
  grid-template-columns: 1.4rem 1fr;
}

.rg-field span,
.fg-field span {
  padding-left: .16rem;
}

.rg-code-line,
.fg-code-line {
  margin-top: .2rem;
  grid-template-columns: 4.38rem 1fr;
}

.rg-code-line .lg-field,
.fg-code-line .lg-field {
  grid-template-columns: 1.52rem 1fr;
}

.rg-action-row,
.fg-action-row {
  margin-top: .22rem;
  display: flex;
  align-items: center;
  gap: .17rem;
}

.rg-submit,
.fg-submit {
  width: 4rem;
  margin-top: 0;
}

.rg-action-row>a,
.fg-action-row>a {
  font-family: Poppins, Poppins, sans-serif;
  font-weight: 500;
  font-size: .14rem;
  line-height: .22rem;
  color: #333333;
  white-space: nowrap;
}