@charset "utf-8";
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: #FFFFFF; color: #262D36; font: 16px/1.7 "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif; }
#wrapper { width: min(900px, calc(100% - 32px)); margin: 36px auto; background: #FFFFFF; }
#main { padding: 20px; }
.section__ttl { margin: 0 0 22px; padding: 12px 18px; background: #1556A3; color: #FFFFFF; font-size: 22px; }
.section__body { padding: 0 18px; }
#txt_explain { margin-bottom: 22px; }
.table { width: 100%; border-collapse: collapse; }
.table th, .table td { border: 1px solid #DCE2E9; padding: 16px; text-align: left; vertical-align: middle; }
.table th { width: 230px; background: #EEF5FC; }
.table td { background: #FFFFFF; }
.table input[type="text"], .table input[type="email"], .table input[type="tel"], .table select, .table textarea { max-width: 100%; width: 100%; padding: 10px; font: inherit; }
.table textarea { min-height: 130px; }
.button_box { padding: 20px; text-align: center; }
.red_txt { color: #B42318; }
a { color: #1556A3; }
@media (max-width: 640px) {
  #main { padding: 12px; }
  .section__body { padding: 0; }
  .table, .table tbody, .table tr, .table th, .table td { display: block; width: 100%; }
  .table th { padding: 12px; }
  .table td { padding: 12px; border-top: 0; }
}

/* TSK 入力画面：完成イメージに基づく設定。確認・完了画面は後で調整。 */
html, body { max-width: 100%; }
body.tsk-contact-input {
  background: #F8FAFD;
  color: #262D36;
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
  font-size: 16px;
  line-height: 1.7;
}
.tsk-contact-input *, .tsk-contact-input *::before, .tsk-contact-input *::after { box-sizing: border-box; }
.tsk-contact-input #wrapper {
  width: min(900px, calc(100% - 32px));
  margin: 48px auto 40px;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.tsk-contact-input #main { padding: 0; }
.tsk-contact-input .section { margin: 0; }
.tsk-contact-input .section__ttl {
  margin: 0 0 34px;
  padding: 0;
  color: #262D36;
  background: transparent;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
}
.tsk-contact-input .section__ttl::before {
  content: "CONTACT";
  display: block;
  margin-bottom: 8px;
  color: #1556A3;
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .04em;
}
.tsk-contact-input .section__body { padding: 0; }
.tsk-contact-input #txt_explain {
  margin: 0 0 30px;
  color: #5F6975;
  text-align: center;
  line-height: 1.9;
}
.tsk-contact-input #txt_explain p { margin: 0; }
.tsk-contact-input .reply-time {
  margin-top: 12px;
  color: #1556A3;
  font-weight: 700;
}
.tsk-contact-input .privacy-caution {
  margin-top: 30px;
  padding: 15px 20px;
  background: #EEF5FC;
  color: #5F6975;
  font-size: 13px;
  line-height: 1.7;
  text-align: left;
}
.tsk-contact-input .red_txt {
  color: #B42318;
  line-height: 1.6;
}
.tsk-contact-input .red_txt:not(:empty) { margin: 0 0 15px; }
.tsk-contact-input .table {
  width: 100%;
  margin: 0;
  border: 0;
  border-top: 5px solid #1556A3;
  border-collapse: collapse;
  background: #FFFFFF;
  table-layout: fixed;
}
.tsk-contact-input .table tr { border-bottom: 1px solid #DCE2E9; }
.tsk-contact-input .table th,
.tsk-contact-input .table td {
  padding: 16px 0;
  border: 0;
  background: #FFFFFF;
  color: #262D36;
  vertical-align: middle;
  font-size: 16px;
}
.tsk-contact-input .table th {
  width: 238px;
  padding-left: 34px;
  padding-right: 12px;
  font-weight: 600;
  white-space: nowrap;
}
.tsk-contact-input .table td { padding-right: 34px; }
.tsk-contact-input .required-badge,
.tsk-contact-input .optional-badge {
  display: inline-block;
  margin-left: 10px;
  padding: 1px 6px;
  color: #FFFFFF;
  background: #1556A3;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
  vertical-align: middle;
}
.tsk-contact-input .optional-badge {
  color: #5F6975;
  background: #FFFFFF;
  border: 1px solid #DCE2E9;
}
.tsk-contact-input .table input[type="text"],
.tsk-contact-input .table input[type="email"],
.tsk-contact-input .table input[type="tel"],
.tsk-contact-input .table select,
.tsk-contact-input .table textarea {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  padding: 11px 13px;
  border: 1px solid #DCE2E9;
  border-radius: 0;
  background: #FFFFFF;
  box-shadow: none;
  color: #262D36;
  font: inherit;
  line-height: 1.5;
}
.tsk-contact-input .table input::placeholder,
.tsk-contact-input .table textarea::placeholder { color: #8290A2; opacity: 1; }
.tsk-contact-input .table textarea { min-height: 150px; resize: vertical; }
.tsk-contact-input .table input:focus-visible,
.tsk-contact-input .table select:focus-visible,
.tsk-contact-input .table textarea:focus-visible,
.tsk-contact-input .privacy-link:focus-visible,
.tsk-contact-input input[type="submit"]:focus-visible {
  outline: 2px solid #1556A3;
  outline-offset: 2px;
}
.tsk-contact-input .table input[type="radio"],
.tsk-contact-input .table input[type="checkbox"] { accent-color: #1556A3; }
.tsk-contact-input .field-note {
  margin: 4px 0 0;
  color: #5F6975;
  font-size: 12px;
  line-height: 1.6;
}
.tsk-contact-input .field-note__domain,
.tsk-contact-input .privacy-link { color: #1556A3; font-weight: 600; }
.tsk-contact-input .privacy-link { text-decoration: underline; text-underline-offset: 3px; }
.tsk-contact-input .table tr.privacy-row { display: none !important; }
.tsk-contact-input .privacy-consent {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
  padding: 32px 16px 0;
  background: #FFFFFF;
  color: #262D36;
}
.tsk-contact-input .privacy-consent[hidden] { display: none; }
.tsk-contact-input .privacy-consent label { display: inline-flex; align-items: center; gap: 8px; }
.tsk-contact-input .privacy-consent .required-badge { margin-left: 14px; }
.tsk-contact-input .button_box { padding: 36px 16px 56px; background: #FFFFFF; }
.tsk-contact-input .button_box input[type="submit"] {
  width: min(340px, 100%);
  min-height: 58px;
  padding: 12px 20px;
  border: 1px solid #1556A3;
  border-radius: 0;
  background: #1556A3;
  color: #FFFFFF;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}
.tsk-contact-input .button_box input[type="submit"]:hover { background: #104683; }
.tsk-contact-input .site-return { margin-top: 20px; padding: 0; background: transparent; }
.tsk-contact-input .site-return a { color: #1556A3; }
@media (max-width: 640px) {
  .tsk-contact-input #wrapper { width: calc(100% - 24px); margin: 30px auto; }
  .tsk-contact-input .section__ttl { margin-bottom: 25px; font-size: 24px; }
  .tsk-contact-input #txt_explain { margin-bottom: 24px; font-size: 14px; }
  .tsk-contact-input .privacy-caution { margin-top: 20px; padding: 14px; }
  .tsk-contact-input .table, .tsk-contact-input .table tbody,
  .tsk-contact-input .table tr, .tsk-contact-input .table th,
  .tsk-contact-input .table td { display: block; width: 100%; }
  .tsk-contact-input .table th { padding: 16px 16px 0; white-space: normal; }
  .tsk-contact-input .table td { padding: 10px 16px 16px; }
  .tsk-contact-input .table textarea { min-height: 130px; }
  .tsk-contact-input .privacy-consent { padding: 26px 14px 0; font-size: 14px; }
  .tsk-contact-input .button_box { padding: 26px 16px 36px; }
}


.tsk-contact-input .required-badge,
.tsk-contact-input .optional-badge {
  border-radius: 4px;
}