@charset "UTF-8";

/* リーリース時には消すこと!!! */

/* 変数の定義 */
:root {
  --required-color: #e85b7e;
  --btn-off-color: #d2d2d2;
  --btn-off-shadow-color: #b3b0b3;
  --btn-on-color: #f7b7b7;
  --btn-on-shadow-color: #df9393;
  --btn-text-color: #fafafa;
  --btn-next-color: #a5d8d4;
  --btn-next-shadow-color: #64a5aa;
  --btn-next-text-color: #fafafa;
  --btn-previous-color: #a0a0a0;
  --btn-previous-text-color: #fafafa;
  --title-select-color: #535353;
  --memo-text-color: #a0a0a0;
  --memo-text-last-color: #959595;
  --memo-text-last-red-color: #ff919c;
}
html {
  max-width: 750px;
  min-width: 375px;
  margin-left: auto;
  margin-right: auto;
  /* font-family: 'Kosugi Maru', sans-serif; */
  /* 750px幅でのフォントサイズ */
  font-size: clamp(1px, 2.133vw, 16px);
}

.l-header_firstview__img,
.l-footer__img {
  width: 100%;
  height: auto;
}
.c-nav_menu {
  display: flex;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
  font-size: 1.375rem;
  color: var(--title-select-color);
}
.c-nav_menu_arrow {
  display: inline-flex;
  width: clamp(6px, 1.73vw, 13px);
  height: clamp(9px, 2.4vw, 18px);
  margin-right: clamp(2px, 0.53vw, 4px);
  margin-top: clamp(5px, 1.33vw, 10px);
  vertical-align: unset;
}
.c-nav_menu a {
  width: fit-content;
}
.c-nav_menu a:not(:first-child) .c-nav_menu_arrow {
  margin-left: clamp(9px, 2.4vw, 18px);
}

.c-title {
  display: block;
  width: auto;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.c-title.pd_b {
  padding-bottom: clamp(24px, 6.4vw, 48px);
}

.p-form {
  background-image: url('../images/background.webp');
  padding-bottom: clamp(18px, 4.8vw, 36px);
}
.p-form_step_area {
  width: 100%;
  padding-top: clamp(15px, 4vw, 30px);
  padding-bottom: clamp(25px, 6.67vw, 50px);
}
.p-form_step__img {
  display: block;
  width: 66%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}

h2 {
  display: inline-block;
  color: var(--title-select-color);
  font-size: 1.375rem;
}
.u-required {
  display: inline-flex;
  width: clamp(30px, 8vw, 60px);
  height: clamp(16px, 4.27vw, 32px);
  margin-left: clamp(10px, 2.8vw, 21px);
  border-radius: clamp(4px, 1.07vw, 8px);
  border: solid 1px var(--required-color);
  color: var(--required-color);
  font-size: 1.25rem;
  justify-content: center;
  align-items: center;
}

.p-table_align_center,
.p-table_align_left {
  display: block;
  width: 100%;
  padding-top: 1px;
  padding-bottom: 1px;
}
/* contact form 7 */
.wpcf7-form-control-wrap {
  display: block;
  width: clamp(324px, 86.4vw, 648px);
  margin-left: auto;
  margin-right: auto;
}
.wpcf7-form-control {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
}
.btn_employable .wpcf7-form-control {
  width: 94%;
  margin-left: auto;
  margin-right: auto;
}
.wpcf7-list-item {
  display: block;
  width: 50%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: clamp(9px, 2.4vw, 18px);
}
.p-table_align_left .wpcf7-list-item:last-child {
  margin-left: 0;
}

/* チェックボックスを消す */
.wpcf7-list-item input[type='checkbox'],
.wpcf7-list-item input[type='radio'] {
  display: none;
}

/* チェックボックスが選択されていないときの色 */
.btn-tgle .wpcf7-list-item-label {
  display: flex;
  width: 88.52%;
  margin-left: auto;
  margin-right: auto;
  height: clamp(35px, 9.33vw, 70px);
  font-size: 1.75rem;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  color: var(--btn-text-color);
  background-color: var(--btn-off-color);
  box-shadow: 0 3px 0px 0px var(--btn-off-shadow-color);
}

/* チェックボックスが選択されたときの色 */
.btn-tgle input[type='checkbox']:checked + .wpcf7-list-item-label,
.btn-tgle input[type='radio']:checked + .wpcf7-list-item-label {
  background-color: var(--btn-on-color);
  box-shadow: 0 3px 0px 0px var(--btn-on-shadow-color);
}

.p-form_area {
  width: 100%;
  padding-bottom: clamp(15px, 4.13vw, 31px);
}
.c-title_select {
  width: clamp(290px, 77.33vw, 580px);
  margin-left: auto;
  margin-right: auto;
  padding-top: clamp(15px, 4.13vw, 31px);
  padding-bottom: clamp(15px, 4.13vw, 31px);
  font-size: 1.375rem;
  color: var(--title-select-color);
}
.wpcf7-select,
.wpcf7-text {
  display: flex;
  width: clamp(290px, 77.33vw, 580px);
  height: clamp(37px, 9.87vw, 74px);
  margin-left: auto;
  margin-right: auto;
  padding-left: clamp(11px, 2.93vw, 22px);
  border: 1px solid #d2d2d2;
  border-radius: clamp(7px, 2vw, 15px);
  font-size: 1.375rem;
  align-items: center;
  justify-content: center;
}

.p-form_memo {
  width: clamp(258px, 68.8vw, 516px);
  margin-top: clamp(23px, 6.13vw, 46px);
  margin-left: auto;
  margin-right: auto;
  font-size: 1.25rem;
  color: var(--memo-text-color);
}
.p-form_last_memo {
  width: fit-content;
  margin-top: clamp(23px, 6.13vw, 46px);
  margin-left: auto;
  margin-right: auto;
  font-size: 1.375rem;
  color: var(--memo-text-last-color);
}
.p-form_last_memo_red {
  color: var(--memo-text-last-red-color);
}
/* 戻る・次へすすむボタン 設置範囲 */
.c-btn_area {
  display: flex;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
  padding-top: clamp(7px, 1.87vw, 14px);
  padding-bottom: clamp(12px, 3.2vw, 24px);
}

/* 戻るボタン */
.wpcf7-previous {
  display: inline-flex;
  width: clamp(88px, 26.13vw, 196px);
  height: clamp(40px, 10.67vw, 80px);
  margin-right: clamp(11px, 2.8vw, 21px);
  background-color: var(--btn-previous-color);
  border-radius: clamp(10px, 2.67vw, 20px);
  color: var(--btn-previous-text-color);
  font-size: 1.5rem;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* 次へボタン */
.wpcf7-submit {
  display: inline-flex;
  width: clamp(202px, 53.73vw, 403px);
  height: clamp(40px, 10.67vw, 80px);
  font-size: 1.75rem;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-radius: clamp(2px, 0.67vw, 5px);
  background-color: var(--btn-next-color);
  box-shadow: 0 3px 0px 0px var(--btn-next-shadow-color);
  color: var(--btn-next-text-color);
}
.wpcf7-spinner {
  display: none;
}

/* 送信ボタン */
.btn-send .wpcf7-submit {
  background-color: var(--btn-on-color);
  box-shadow: 0 3px 0px 0px var(--btn-on-shadow-color);
}

/* バリデーションメッセージ */
.wpcf7-not-valid-tip {
  display: block;
  width: 100%;
  padding-top: clamp(4px, 1.07vw, 8px);
  text-align: center;
  font-size: 1.375rem;
}
/* 次へすすむボタンを押したときのバリデーションメッセージ */
.wpcf7-response-output {
  display: none;
}

.p-thanks_area {
  position: relative;
}
.p-thanks__img {
  width: 100%;
  height: auto;
}
.p-thanks_link_line {
  width: clamp(350px, 93.33vw, 700px);
  height: auto;
  position: absolute;
  left: clamp(12px, 3.33vw, 25px);
  bottom: clamp(75px, 19.87vw, 149px);
}

/* 同意する */
.wpcf7-list-item input[name='acceptance'] {
  display: block;
}
