/* ========================================================================================= ^^
  Key visual for login
============================================================================================ ^^ */
.c-key-visual {
  background: transparent;
  align-items: flex-end;
}
@media (min-width: 768px) {
  .c-key-visual {
    height: calc(373 * var(--max-ratio));
  }
}
@media (min-width: 1300px) {
  .c-key-visual {
    height: calc(373 * var(--rem-ratio));
  }
}

/* ========================================================================================= ^^
  Login form
============================================================================================ ^^ */
#container .p-login-form {
  padding: calc(30 * var(--min-ratio)) calc(10 * var(--min-ratio)) calc(35 * var(--min-ratio));
}
@media (min-width: 768px) {
  #container .p-login-form {
    padding: calc(55 * var(--max-ratio)) calc(10 * var(--max-ratio)) calc(70 * var(--max-ratio));
  }
}
@media (min-width: 1300px) {
  #container .p-login-form {
    padding: calc(55 * var(--rem-ratio)) calc(10 * var(--rem-ratio)) calc(70 * var(--rem-ratio));
  }
}
#container .p-login-form .c-text {
  margin-bottom: calc(49 * var(--min-ratio));
  font-family: var(--font-shippori);
  font-size: clamp(0.875rem, 0.824rem + 0.22vw, 1rem);
  color: #685e59;
  line-height: 1.75;
  text-align: center;
}
@media (min-width: 768px) {
  #container .p-login-form .c-text {
    margin-bottom: calc(49 * var(--max-ratio));
  }
}
@media (min-width: 1300px) {
  #container .p-login-form .c-text {
    margin-bottom: calc(49 * var(--rem-ratio));
  }
}
#container .p-login-form input {
  max-width: 798px;
  width: 100%;
  height: calc(78 * var(--min-ratio));
  padding: 0 calc(20 * var(--min-ratio));
  margin: 0 auto;
  background-color: #fff;
  border: none;
  font-family: var(--font-noto-serif);
  font-size: clamp(0.875rem, 0.824rem + 0.22vw, 1rem);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  box-shadow: 3.09px 5px 3.09px rgba(155, 152, 152, 0.75);
}
@media (min-width: 768px) {
  #container .p-login-form input {
    height: calc(78 * var(--max-ratio));
    padding: 0 calc(53 * var(--max-ratio));
  }
}
@media (min-width: 1300px) {
  #container .p-login-form input {
    height: calc(78 * var(--rem-ratio));
    padding: 0 calc(53 * var(--rem-ratio));
  }
}
#container .p-login-form input:focus {
  outline: none;
}
#container .p-login-form .c-button {
  width: calc(250 * var(--min-ratio));
  height: calc(62 * var(--min-ratio));
  margin: 0 auto;
}
@media (min-width: 768px) {
  #container .p-login-form .c-button {
    width: calc(250 * var(--max-ratio));
    height: calc(62 * var(--max-ratio));
  }
}
@media (min-width: 1300px) {
  #container .p-login-form .c-button {
    width: calc(250 * var(--rem-ratio));
    height: calc(62 * var(--rem-ratio));
  }
}
#container .p-login-form .c-button__inner {
  font-family: var(--font-shippori);
  font-size: clamp(0.875rem, 0.824rem + 0.22vw, 1rem);
  line-height: 1.75;
  font-weight: 400;
}

/* ========================================================================================= ^^
  Entry
============================================================================================ ^^ */
#container .p-entry {
  padding: calc(35 * var(--min-ratio)) calc(10 * var(--min-ratio)) calc(68 * var(--min-ratio));
  font-family: var(--font-shippori);
  text-align: center;
}
@media (min-width: 768px) {
  #container .p-entry {
    padding: calc(70 * var(--max-ratio)) calc(10 * var(--max-ratio)) calc(135 * var(--max-ratio));
  }
}
@media (min-width: 1300px) {
  #container .p-entry {
    padding: calc(70 * var(--rem-ratio)) calc(10 * var(--rem-ratio)) calc(135 * var(--rem-ratio));
  }
}
#container .p-entry .l-section__inner {
  max-width: 1112px;
  width: 100%;
  padding: calc(39 * var(--min-ratio)) calc(10 * var(--min-ratio)) calc(48 * var(--min-ratio));
  margin: 0 auto;
  background-color: #f6f1ea;
}
@media (min-width: 768px) {
  #container .p-entry .l-section__inner {
    padding: calc(77 * var(--max-ratio)) calc(10 * var(--max-ratio)) calc(95 * var(--max-ratio));
  }
}
@media (min-width: 1300px) {
  #container .p-entry .l-section__inner {
    padding: calc(77 * var(--rem-ratio)) calc(10 * var(--rem-ratio)) calc(95 * var(--rem-ratio));
  }
}
#container .p-entry .c-title {
  margin-bottom: calc(29 * var(--min-ratio));
  font-size: clamp(0.875rem, 0.824rem + 0.22vw, 1rem);
  color: #685e59;
  line-height: 1.75;
  font-weight: 400;
  letter-spacing: 0.12em;
}
@media (min-width: 768px) {
  #container .p-entry .c-title {
    margin-bottom: calc(29 * var(--max-ratio));
  }
}
@media (min-width: 1300px) {
  #container .p-entry .c-title {
    margin-bottom: calc(29 * var(--rem-ratio));
  }
}
#container .p-entry .c-text {
  margin-bottom: calc(42 * var(--min-ratio));
  font-size: clamp(0.875rem, 0.824rem + 0.22vw, 1rem);
  color: #685e59;
  line-height: 1.75;
  font-weight: 400;
  letter-spacing: 0.12em;
}
@media (min-width: 768px) {
  #container .p-entry .c-text {
    margin-bottom: calc(84 * var(--max-ratio));
  }
}
@media (min-width: 1300px) {
  #container .p-entry .c-text {
    margin-bottom: calc(84 * var(--rem-ratio));
  }
}
#container .p-entry .c-button {
  width: calc(250 * var(--min-ratio));
  height: calc(57 * var(--min-ratio));
  margin: 0 auto;
}
@media (min-width: 768px) {
  #container .p-entry .c-button {
    width: calc(250 * var(--max-ratio));
    height: calc(57 * var(--max-ratio));
  }
}
@media (min-width: 1300px) {
  #container .p-entry .c-button {
    width: calc(250 * var(--rem-ratio));
    height: calc(57 * var(--rem-ratio));
  }
}
#container .p-entry .c-button__link {
  font-size: clamp(0.875rem, 0.85rem + 0.11vw, 0.938rem);
  line-height: 1.7333333333;
  letter-spacing: 0.06em;
}

/* ========================================================================================= ^^
  Login
============================================================================================ ^^ */