@charset "UTF-8";
/* [顧客側] ログイン css */
main { padding: 0; }

h2 { margin: 80px 0; text-align: center; }
.login-inp-wrap dl { display: flex; align-items: center; justify-content: center; gap: 40px; }
.login-inp-wrap dl ~ dl { margin-top: 40px; }
.login-inp-wrap dl > dt { width: 128px; }
.login-inp-wrap dl > dd { min-width: 400px; }

input { font-size: 24px; }
form .val-err { display: block; }
form .chk+.val-err { display: none; }

div:has( > button[type="submit"]),
div:has( > button.vc-btn)
 { margin: 44px 0 80px; }
div.ta-c:has( > a) { margin: 20px 0; }

.rule-wrap { max-width: 800px; margin: 60px auto 20px; }
.rule-wrap > * { margin-top: 32px; }
.rule-wrap dt { font-weight: bold; margin-bottom: 8px; }
.rule-wrap .txa-box { font-size: 14px; line-height: 1.4; max-height: 200px; }

.login-inp-wrap dl:has([data-vc-type*="required"]) > dt:not(.not-reqd):after, .reqd-clm:after {
  content: '*';
  color: var(--dai-main-color);
}

.chk:has(#ruleChk) {
  width: fit-content;
  margin: auto;
  padding: 2px 8px;
  border-radius: 24px;
}
.chk:has(#ruleChk):not(.box-err) {
  box-shadow: 0 0 1px 1px #ccc;
}

/* ボットチェック */
.band-rdo.on-margin label { background-color: #ababab; }
input[type="checkbox"][name="botchk"]+label { color: #fff; }
#botchknum { font-size: 20px; text-align: right; margin-bottom: 16px; letter-spacing: 0.2em; }

/* 個人情報の取扱い */
.pp-wrap {
  height: 400px;
  border: 1px solid #ccc;
  border-radius: 8px;
}



/* For SmartPhone */
@media screen and (max-width: 767px) {

  form { padding: 0 8px; }
  h2 { margin: 40px 0; }
  .login-inp-wrap > dl { flex-wrap: wrap; gap: 0; }
  .login-inp-wrap > dl > :is(dt, dd) { width: 100%; min-width: auto; }
  #ruleChk + label { word-break: break-all; white-space: break-spaces; line-height: 1.2; text-align: left; }

}