/*-------------------------------------------------------------------*/
/* お問い合わせ（/contact/・page-contact.php）
   用件ボタン4つ → 案内 → 手順 → フォーム（CF7）。フォームの見た目は4つ共通。      */
/*-------------------------------------------------------------------*/
.sub-Wrapper--contact{
  padding-top: 92px;
}
/* パンくず・h1・リード・用件ボタン以下を、同じ中央コンテナ（1040px）の左端にそろえる */
.ct-Wrap{
  max-width: 1040px;
  margin: 0 auto;
}
.ct-Wrap > .nk-Breadcrumb{
  margin-top: 20px;
  margin-bottom: 20px;
}
.ct-Head_Title{
  margin: 0;
  font-weight: 700;
  font-size: 44px;
  line-height: 1.3;
  letter-spacing: .06em;
  color: #0f0f0f;
}
.ct-Head_Lead{
  margin: 12px 0 0;
  font-size: 15px;
  line-height: 1.9;
  color: #0f0f0f;
}
.ct-Body{
  max-width: none;
  margin: 40px 0 0;
  padding-bottom: 160px;
}

/* 用件ボタン（PC 4列 / SP 2×2。選択中は黒地白字） */
.ct-Types ul{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ct-Type{
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  min-height: 120px;
  height: 100%;
  padding: 20px 22px;
  border: 2px solid #0f0f0f;
  background: #fff;
  color: #0f0f0f;
  text-decoration: none;
  transition: background-color .3s ease, color .3s ease;
}
.ct-Type_Label{
  font-weight: 700;
  font-size: 18px;
  line-height: 1.4;
  letter-spacing: .06em;
}
.ct-Type_Desc{
  font-weight: 500;
  font-size: 13px;
  line-height: 1.6;
  letter-spacing: .04em;
}
.ct-Type.is-on{
  background: #0f0f0f;
  color: #fff;
}
@media (hover: hover) and (pointer: fine) {
  .ct-Type:not(.is-on):hover{ background: #0f0f0f; color: #fff; }
}
.ct-Type:focus-visible{ outline: 2px solid #0f0f0f; outline-offset: 3px; }

.ct-Notice{
  margin: 20px 0 0;
  font-size: 13px;
  line-height: 1.9;
  letter-spacing: .04em;
  color: #0f0f0f;
}
.ct-Notice a{ text-decoration: underline; text-underline-offset: 3px; font-weight: 700; color: #0f0f0f; }

/* 手順（01 入力 >> 02 内容の確認 >> 03 送信完了） */
/* 1行に並べ、間を >>（nokid_chev）でつなぐ。現在地は黒、それ以外は灰色で示す */
.ct-Steps{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 18px;
  margin: 48px 0 0;
  padding: 0;
  list-style: none;
}
.ct-Steps li{
  display: flex;
  align-items: center;
  gap: 8px;
  color: #a3a3a3;
  transition: color .3s;
}
.ct-Steps li.is-current{ color: #0f0f0f; }
.ct-Steps_Sep{
  flex: none;
  width: 22px;
  height: 12px;
  margin-right: 10px;
  color: #a3a3a3;
}
.ct-Steps_No{
  font-family: 'Jost', 'Zen Kaku Gothic New', sans-serif;
  font-weight: 700;
  font-size: 18px;
  letter-spacing: .06em;
}
.ct-Steps_Name{
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .06em;
}

.ct-Panels{ margin-top: 48px; }
.ct-Panel[hidden]{ display: none; }
.ct-Intro{
  margin: 0 0 32px;
  font-size: 14px;
  line-height: 1.9;
  color: #0f0f0f;
}
.ct-Band{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0 0 32px;
  border-top: 2px solid #0f0f0f;
  border-bottom: 2px solid #0f0f0f;
}
.ct-Band_Link{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .06em;
  color: #0f0f0f;
  text-decoration: none;
}
.ct-Band_Link + .ct-Band_Link{ border-left: 1px solid #cfcfcf; }
/* 折り返すときは行の長さをそろえ、「こちら」だけが次の行に落ちないようにする */
.ct-Band_Link span{ line-height: 1.6; text-wrap: balance; }
.ct-Band_Link svg{ flex: none; width: 26px; height: 14px; }
@media (hover: hover) and (pointer: fine) {
  .ct-Band_Link:hover{ background: #0f0f0f; color: #fff; }
}

/* ---- フォーム（CF7 の出力に当てる。4つ共通） ---- */
/* 同意チェックのラベルなど、色指定のない文字が #000 にならないよう親で固定 */
.ct-Panels{ color: #0f0f0f; }
.ct-Panels .wpcf7-acceptance .wpcf7-list-item-label{ letter-spacing: .04em; }
.ct-Panels form.wpcf7-form{
  max-width: none;
  margin: 0;
  padding: 0;
}
.ct-Panels .ct-SecTitle{
  margin: 56px 0 28px;
  padding-bottom: 12px;
  border-bottom: 2px solid #0f0f0f;
  font-weight: 700;
  font-size: 20px;
  line-height: 1.5;
  letter-spacing: .03em;
  color: #0f0f0f;
}
.ct-Panels .input_area > .ct-SecTitle:first-child,
.ct-Panels .confirm_area > .ct-SecTitle:first-child{ margin-top: 0; }
.ct-Panels .wpcf7-form .form-group{
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  column-gap: 32px;
  align-items: start;
  margin: 0 0 28px;
  padding-bottom: 28px;
  border-bottom: 1px solid #cfcfcf;
}
.ct-Panels .wpcf7-form .label-wrapper{
  margin: 0;
  padding-top: 14px;
  align-items: flex-start;
  gap: 12px;
}
.ct-Panels .wpcf7-form .label-wrapper label,
.ct-Panels .wpcf7-form .ct-LabelText{
  font-weight: 700;
  font-size: 15px;
  line-height: 1.6;
  letter-spacing: .04em;
  color: #0f0f0f;
}
/* 必須: 黒地白字 / 任意: 枠線 */
.ct-Panels .wpcf7-form .label-wrapper span.required,
.ct-Panels .wpcf7-form .label-wrapper span.optional{
  flex: none;
  margin-top: 3px;
  padding: 2px 8px;
  border: 1px solid #0f0f0f;
  border-radius: 0;
  font-weight: 700;
  font-size: 11px;
  line-height: 1.5;
  letter-spacing: .08em;
}
.ct-Panels .wpcf7-form .label-wrapper span.required{ background: #0f0f0f; color: #fff; }
.ct-Panels .wpcf7-form .label-wrapper span.optional{ background: transparent; color: #0f0f0f; }
.ct-Panels .wpcf7-form .input-wrapper{ min-width: 0; }
.ct-Panels .wpcf7-form .form-group .note{
  margin: 10px 0 0;
  font-size: 12px;
  line-height: 1.8;
  color: #0f0f0f;
}
.ct-Panels .wpcf7-form .form-group .note a{ color: #0f0f0f; text-decoration: underline; }

/* 入力欄: 高さ56px・白地・1px黒枠・角丸0 */
.ct-Panels .wpcf7-form input[type="text"],
.ct-Panels .wpcf7-form input[type="email"],
.ct-Panels .wpcf7-form input[type="url"],
.ct-Panels .wpcf7-form input[type="tel"],
.ct-Panels .wpcf7-form select{
  box-sizing: border-box;
  width: 100%;
  height: 56px;
  padding: 0 16px;
  border: 1px solid #0f0f0f;
  border-radius: 0;
  background-color: #fff;
  color: #0f0f0f;
  font-family: inherit;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: .03em;
}
.ct-Panels .wpcf7-form textarea{
  box-sizing: border-box;
  width: 100%;
  min-height: 160px;
  padding: 14px 16px;
  border: 1px solid #0f0f0f;
  border-radius: 0;
  background: #fff;
  color: #0f0f0f;
  font-family: inherit;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.9;
  letter-spacing: .03em;
}
.ct-Panels .wpcf7-form .input-wrapper select{
  border: 1px solid #0f0f0f;
  appearance: none;
  -webkit-appearance: none;
  padding-right: 44px;
  background-image: linear-gradient(45deg, transparent 50%, #0f0f0f 50%), linear-gradient(135deg, #0f0f0f 50%, transparent 50%);
  background-position: calc(100% - 22px) 50%, calc(100% - 16px) 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}
/* プレースホルダーも黒（グレー文字にしない）。入力済みの文字は太く、プレースホルダーは細くして見分ける */
.ct-Panels .wpcf7-form ::placeholder{ color: #0f0f0f; opacity: 1; font-weight: 400; }
.ct-Panels .wpcf7-form input:focus,
.ct-Panels .wpcf7-form select:focus,
.ct-Panels .wpcf7-form textarea:focus{ outline: 2px solid #0f0f0f; outline-offset: 2px; }
.ct-Panels .wpcf7-form .name-fields{ display: flex; gap: 12px; }
.ct-Panels .wpcf7-form .name-fields label{ flex: 1; margin: 0; }
.ct-Panels .wpcf7-form .ct-Select select{ max-width: 520px; }
.ct-Panels .wpcf7-form .birthday-fields{ display: flex; gap: 12px; max-width: 520px; }
.ct-Panels .wpcf7-form .birthday-fields select{ flex: 1; width: auto; max-width: none; }
/* 最低・最高受注額は横並び */
.ct-Panels .wpcf7-form .ct-Pair{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ct-Panels .wpcf7-form .ct-PairItem{ display: block; margin: 0; }
.ct-Panels .wpcf7-form .ct-PairItem > span:first-child{ display: block; margin-bottom: 6px; font-weight: 700; font-size: 12px; letter-spacing: .06em; }

/* 選択肢はボタン状（高さ44px・1px黒枠・選択で黒地白字）。項目・職種は2列の大きめカード */
.ct-Panels .ct-Choices .wpcf7-checkbox,
.ct-Panels .ct-Choices .wpcf7-radio{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.ct-Panels .ct-Choices .wpcf7-list-item{ margin: 0; }
.ct-Panels .ct-Choices .wpcf7-list-item label{
  position: relative;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 10px 18px;
  border: 1px solid #0f0f0f;
  border-radius: 0;
  background: #fff;
  color: #0f0f0f;
  font-weight: 700;
  font-size: 14px;
  line-height: 1.5;
  letter-spacing: .04em;
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease;
}
.ct-Panels .ct-Choices .wpcf7-list-item label:has(input:checked){
  border-color: #0f0f0f;
  background: #0f0f0f;
  color: #fff;
}
.ct-Panels .ct-Choices .wpcf7-list-item label:has(input:focus-visible){ outline: 2px solid #0f0f0f; outline-offset: 2px; }
.ct-Panels .ct-Choices--cards .wpcf7-checkbox,
.ct-Panels .ct-Choices--cards .wpcf7-radio{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ct-Panels .ct-Choices--cards .wpcf7-list-item label{
  display: flex;
  width: 100%;
  min-height: 64px;
  padding: 14px 20px;
  font-size: 15px;
}
@media (hover: hover) and (pointer: fine) {
  .ct-Panels .ct-Choices .wpcf7-list-item label:hover{ background: #f0f0f0; }
  .ct-Panels .ct-Choices .wpcf7-list-item label:has(input:checked):hover{ background: #0f0f0f; }
}
/* ファイル（点線枠） */
.ct-Panels .wpcf7-form .ct-Drop{
  padding: 20px;
  border: 1px dashed #0f0f0f;
  background: #fff;
}
.ct-Panels .wpcf7-form .ct-Drop input[type="file"]{ width: 100%; font-size: 14px; color: #0f0f0f; }
.ct-Panels .wpcf7-form .ct-Drop input[type="file"]::file-selector-button{
  margin-right: 14px;
  padding: 8px 16px;
  border: 1px solid #0f0f0f;
  border-radius: 0;
  background: #fff;
  color: #0f0f0f;
  font-weight: 700;
  cursor: pointer;
}
.ct-Panels .wpcf7-form .privacy-policy{ display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 14px; }
.ct-Panels .wpcf7-form .privacy-policy input[type="checkbox"]{ width: 22px; height: 22px; accent-color: #0f0f0f; }
.ct-Panels .wpcf7-form .wpcf7-not-valid-tip{ margin-top: 6px; font-weight: 700; font-size: 13px; color: #0f0f0f; }
.ct-Panels .wpcf7-form .wpcf7-not-valid{ border-color: #0f0f0f; outline: 1px solid #0f0f0f; outline-offset: 2px; }
.ct-Panels .wpcf7-form .wpcf7-response-output{ margin: 24px 0 0; padding: 12px 16px; border: 1px solid #0f0f0f; color: #0f0f0f; font-weight: 700; font-size: 14px; }

/* 送信ボタン: .nk-Btn L primary・最大幅420px・中央 */
.ct-Panels .ct-Submit{
  display: flex;
  justify-content: center;
  gap: 16px;
  margin-top: 56px;
}
.ct-Panels .ct-Submit .nk-Btn,
.ct-Panels .ct-Submit .btn-to-confirm,
.ct-Panels .ct-Submit .btn-back,
.ct-Panels .ct-Submit .wpcf7-submit{
  width: 100%;
  max-width: 420px;
  height: auto;
  min-height: 56px;
  margin: 0;
}
.ct-Panels .ct-Submit--confirm .btn-back{ max-width: 200px; }
.ct-Panels .ct-Submit .wpcf7-submit.nk-Btn{
  background: #0f0f0f;
  color: #fff;
  border: 2px solid #0f0f0f;
  border-radius: 0;
  font-family: 'Jost', 'Zen Kaku Gothic New', sans-serif;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: .08em;
}
@media (hover: hover) and (pointer: fine) {
  .ct-Panels .ct-Submit .wpcf7-submit.nk-Btn:hover{ background: #fff; color: #0f0f0f; }
}
/* 確認画面 */
.ct-Panels .confirm_area .confirm{ margin: 0; padding-top: 14px; font-size: 15px; line-height: 1.9; white-space: pre-wrap; word-break: break-word; color: #0f0f0f; }
/* reCAPTCHA の注記。確認画面の送信ボタン群（.ct-Submit--confirm）の直下に1段落で置く。幅はボタン群（200 + 16 + 420）に合わせて中央 */
.ct-Panels .protected-recaptcha{ box-sizing: border-box; max-width: 636px; margin: 14px auto 0; font-size: 11px; line-height: 1.7; color: #0f0f0f; text-align: center; }
.ct-Panels .protected-recaptcha a{ color: #0f0f0f; text-decoration: underline; }

/* ---- SP ---- */
@media screen and (max-width:1024px) {
  .ct-Types ul{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .ct-Panels .wpcf7-form .form-group{ display: block; }
  .ct-Panels .wpcf7-form .label-wrapper{ padding-top: 0; margin-bottom: 10px; align-items: center; }
  .ct-Panels .wpcf7-form .label-wrapper label,
  .ct-Panels .wpcf7-form .ct-LabelText{ font-size: 14px; }
}
@media screen and (max-width:767px) {
  .sub-Wrapper--contact{ padding-top: 84px; }
  .ct-Wrap > .nk-Breadcrumb{ margin-top: 14px; margin-bottom: 16px; }
  .ct-Head_Title{ font-size: 30px; }
  .ct-Head_Lead{ font-size: 14px; }
  .ct-Body{ margin-top: 28px; padding-bottom: 18.23vw; }
  .ct-Type{ min-height: 120px; padding: 16px 14px; gap: 6px; }
  .ct-Type_Label{ font-size: 15px; }
  .ct-Type_Desc{ font-size: 11px; line-height: 1.55; }
  .ct-Steps{ margin-top: 32px; gap: 6px 10px; }
  .ct-Steps li{ gap: 5px; }
  .ct-Steps_Sep{ width: 16px; height: 9px; margin-right: 5px; }
  .ct-Steps_No{ font-size: 15px; }
  .ct-Steps_Name{ font-size: 12px; }
  .ct-Panels{ margin-top: 32px; }
  .ct-Panels .ct-SecTitle{ margin: 40px 0 22px; font-size: 18px; }
  .ct-Band{ grid-template-columns: minmax(0, 1fr); }
  .ct-Band_Link + .ct-Band_Link{ border-left: 0; border-top: 1px solid #cfcfcf; }
  .ct-Band_Link{ gap: 12px; padding: 18px 16px; letter-spacing: .04em; }
  .ct-Panels .ct-Choices--cards .wpcf7-checkbox,
  .ct-Panels .ct-Choices--cards .wpcf7-radio{ grid-template-columns: minmax(0, 1fr); }
  .ct-Panels .wpcf7-form .name-fields{ gap: 8px; }
  .ct-Panels .wpcf7-form .ct-Pair{ grid-template-columns: minmax(0, 1fr); }
  .ct-Panels .ct-Submit{ flex-direction: column; align-items: center; margin-top: 40px; }
  .ct-Panels .ct-Submit--confirm .btn-back{ max-width: 420px; }
}

/* 英語版: 日本語のフォームへ送るカード（破線で、同じ画面で切り替わる用件と区別する） */
.ct-Type--ja{ border-style: dashed; }
.ct-Type--ja:hover{ background: #0f0f0f; color: #fff; }
.ct-Type_Ja{ font-weight: 500; font-size: .8em; letter-spacing: .04em; white-space: nowrap; }
.ct-Notice--ja{ margin-top: -8px; }