@charset "utf-8";

/* グローバルナビゲーション */

/* コンテンツタイトル */
.ttl_content {
  margin-top: 88px;
  padding-top: 50px;
  background-color: #f5f6f8;
}

/* コンテンツ内容セクションタイトル */
.ttl_section {
  position: relative;
  color: #0c66ab;
  font-size: 2.4rem;
  font-weight: 700;
  padding-bottom: 22px;
  /* 下のライン：左を強調色、右をグレーに分ける * */
  background: linear-gradient(to right, #0c66ab 30%, #e0e0e0 30%);
  background-size: 100% 3px;
  background-repeat: no-repeat;
  background-position: left bottom;
  /* ラインの下 */
  margin-bottom: 40px;
}

.text_content {
  padding-top: 40px;
}

/* ------------------ */
/* テーブル */
.table_cmn {
  width: 100%;
}

.table_cmn th,
.table_cmn td {
  padding: 18px 0;
  border: 1px solid #e0e0e0;
}

.table_cmn th {
  width: 167px;
  background-color: #e3ebf1;
  text-align: left;
  padding-left: 20px;
}

.table_cmn td {
  padding-left: 50px;
  padding-right: 112px;
}

.table_cmn ul {
  list-style: none;
}

.table_cmn ul li {
  position: relative;
  padding-left: 1.4em;
  line-height: 1.4;
}

.table_cmn ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.45em;
  width: 10px;
  height: 10px;
  border: 2px solid #0c66ab; /* 太さここ */
  border-radius: 50%;
}

.table_cmn ol {
  list-style-position: inside;
  padding-left: 0;
  line-height: 1.4;
}

/* --------------------------------------------- */
/* 企業情報　about */
.img_about {
  display: block;
  margin: 0 auto;
}

.text_wrapper {
  padding-bottom: 80px;
}

/* --------------------------------------------- */
/* 採用情報 */
/* 採用情報ナビゲーション */
.nav_recruit {
  width: 100%;
  background-color: #e3ebf1;
}

.nav_recruit_wrapper {
  max-width: 940px;
  margin: 0 auto;
}

.list_nav_recruit {
  display: flex;
  list-style: none;
}

.list_nav_recruit li {
  flex: 1; /* 940pxを2等分 */
  text-align: center; /* 文字中央 */
}

.recruit_current {
  display: block;
  position: relative;
  padding: 24px 0;
  color: #0c66ab;
  font-weight: 600;
  text-decoration: none;
  transition: color 0.3s;
}

.recruit_current::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 4px;
  background-color: #0c66ab;
}

.recruit_list {
  display: block;
  position: relative;
  padding: 24px 0;
  color: #000;
  font-weight: 600;
  text-decoration: none;
  transition: color 0.3s;
}

/* ナビゲーションここまで */

.text_recruit_wrapper {
  display: grid;
  grid-template-columns: 514px 222px;
  justify-content: space-between;
  padding: 41px 30px 48px;
  background-color: #f5f6f8;
  align-items: center;
}

.job_wrapper {
  padding: 50px 0 70px;
}

/* 採用情報の職種H3 */
.ttl_job {
  position: relative;
  font-size: 2rem;
  font-weight: 700;
  padding-left: 14px; /* ライン分の余白 */
  margin: 30px 0 18px;
}

.ttl_job::before {
  content: "";
  position: absolute;
  color: #0c66ab;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 5px; /* 線の太さ */
  height: 1.2em; /* 文字高さ基準 */
  background-color: #0c66ab;
}

/* --------------------------------------------- */
/* 採用情報～応援～ */
/* VoiceH3 */
.ttl_voice {
  font-size: 2.8rem;
  color: #0c66ab;
  font-weight: 700;
  line-height: 1.4;
  margin-top: 30px;
  margin-bottom: 44px;
}

.img_voice {
  float: right; /* 右に写真 */
  width: 470px;
  margin: 0 0 10px 50px; /* 文章との余白 */
}

.voice_wrapper::after {
  content: "";
  display: block;
  clear: both; /* 回り込み解除 */
}

/* --------------------------------------------- */
/* お問い合わせ */

.form_contact {
  background-color: #f5f6f8;
  padding: 32px 63px 32px 67px;
}

.form_attention {
  text-align: right;
  padding-bottom: 10px;
}

.form_attention span {
  color: #fff;
  background-color: #df304d;
  border-radius: 2px;
  font-size: 1.2rem;
  padding: 0 2px;
}

.table_contact {
  width: 100%;
}

.table_contact th,
.table_contact td {
  padding: 20px 0;
  border: none;
}

.table_contact th {
  text-align: left;
  padding: 12px;
}

.table_contact th::before {
  content: ""; /* 必須：擬似要素を出す */
  display: inline-block; /* 丸を表示するため */
  width: 6px; /* 丸の直径 */
  height: 6px;
  margin-right: 8px; /* th 内のテキストとの間隔 */
  background-color: #004992; /* 青緑系 */
  border-radius: 50%; /* 丸にする */
  vertical-align: middle; /* thのテキストと縦位置を揃える */
}

.table_contact th::after {
  content: "必須"; /* 表示したい文字 */
  color: #fff; /* 文字色 */
  background-color: #df304d;
  border-radius: 2px;
  font-size: 1.2rem; /* 少し小さく */
  padding: 0 2px;
  margin-left: 8px; /* thのテキストとの間隔 */
}

.table_contact td {
  width: 603px;
}

.text_form {
  width: 345px;
  padding: 6px 6px;
  border-radius: 5px;
  border: 1px solid #d9d9d9;
}

.text_tel {
  width: 100%;
  padding: 6px 6px;
  border-radius: 5px;
  border: 1px solid #d9d9d9;
}

.text_email {
  width: 100%;
  padding: 6px 6px;
  border-radius: 5px;
  border: 1px solid #d9d9d9;
}

.text_area {
  width: 100%;
  height: 168px;
  padding: 6px 6px;
  border-radius: 5px;
  border: 1px solid #d9d9d9;
  resize: vertical; /* 縦だけ伸縮可 */
  line-height: 1.4;
}

/* 情報セキュリティー */
.scroll_box_security {
  width: 812px;
  height: 132px;
  padding: 19px 44px 19px 22px;
  border: 1px solid #d9d9d9;
  border-radius: 5px;
  overflow-y: scroll; /* 縦スクロールを出す */
  background-color: #fff;
  margin-top: 20px;
}

.scroll_box_security h1 {
  font-size: 2rem;
  font-weight: 700;
  padding-bottom: 20px;
}

.scroll_box_security p {
  line-height: 1.4;
}

.scroll_box_security ol {
  list-style-position: inside;
  padding-left: 0;
  line-height: 1.4;
}

.consent_wrapper {
  text-align: center;
}

.consent_label {
  display: inline-block;
  padding: 25px 0 45px;
}

.submit_form {
  text-align: center;
  margin-bottom: 48px;
}