@charset "UTF-8";
/*
 * このフォーム固有の追加スタイル。
 * 基本の見た目は採用サイト共通の /recruit/j/assets/css/style.css に依存する。
 * インライン style を使わない方針のため（CSP）、必要なものはすべてここに書く。
 */

/* JS で表示切替する要素（[hidden] を確実に効かせる） */
[hidden] {
  display: none !important;
}

/* ハニーポット。人間には見えず、スクリーンリーダーからも隠す */
.c-hp-field {
  position: absolute !important;
  left: -9999px !important;
  top: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

/* リード文 */
.c-lead {
  max-width: 900px;
  margin: 0 auto 40px;
  /* 上の 24px は .c-lead__notes の margin-top と揃えている。
     margin-top で取ると、.c-lead は .p-form-content 配下の最初の子で
     間に padding も border も無いため margin が相殺して親の外に抜け、
     パネルごと下がってタイトル帯だけが広がってしまう。padding で取る。 */
  padding: 24px 16px 0;
}

.c-lead__text {
  margin-bottom: 16px;
  font-size: 1.5rem;
  line-height: 1.9;
}

.c-lead__notes {
  margin-top: 24px;
  padding: 16px 20px;
  background-color: #f5f5f5;
  border-left: 3px solid #219b35;
}

.c-lead__notes li {
  font-size: 1.4rem;
  line-height: 1.8;
}

/* 受付番号 */
.c-receipt {
  max-width: 480px;
  margin: 32px auto 0;
  padding: 20px 24px;
  border: 1px solid #ccc;
  text-align: center;
}

.c-receipt__label {
  margin-bottom: 8px;
  font-size: 1.3rem;
  font-weight: 700;
  letter-spacing: .08em;
}

.c-receipt__code {
  margin-bottom: 12px;
  font-size: 2.2rem;
  font-weight: 700;
  letter-spacing: .12em;
  word-break: break-all;
}

.c-receipt__note {
  font-size: 1.2rem;
  line-height: 1.7;
  color: #555;
}

/* 同意チェック */
.p-form-privacy {
  margin-bottom: 24px;
  text-align: center;
}

.p-form-privacy__txt {
  font-size: 1.5rem;
  line-height: 1.8;
}

.p-form-privacy.is-error .p-form-privacy__txt {
  color: #c00;
}

@media screen and (max-width: 896px) {
  .c-lead {
    margin-bottom: 28px;
  }

  .c-receipt__code {
    font-size: 1.8rem;
  }
}