/* =============================================================================
   shinseicraft 募集要項ページ用 CSS
   shinseisteel style.css から抽出した完全コピー
   ============================================================================= */

@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&family=Open+Sans:wght@600&family=Alatsi&display=swap");

/* -----------------------------------------------------------------------------
   second-mv - ヘッダー背景画像
   ----------------------------------------------------------------------------- */
.second-mv__img {
  background-image: url('/assets/img/recruit/second_mv.png');
}
@media only screen and (max-width: 768px) {
  .second-mv__img {
    background-image: url('/assets/img/recruit/second_mv_sp.png');
  }
}

/* フェードインアニメーション */
.second-mv__title {
  transition: .8s ease-in-out;
  transform: translateY(30px);
  opacity: 0;
}
.second-mv__title.on {
  transform: translateY(0);
  opacity: 1;
}
.second-mv__title::before {
  content: "RECRUIT";
}

/* -----------------------------------------------------------------------------
   subTitle06 - セクションタイトル
   ----------------------------------------------------------------------------- */
.subTitle06 {
  display: flex !important;
  flex-direction: column;
  align-items: flex-start;
  margin-bottom: 40px;
  opacity: 1 !important;
  visibility: visible !important;
}
@media screen and (max-width: 767px) {
  .subTitle06 {
    margin-bottom: 2em;
  }
}
.subTitle06 .ja {
  font-size: 18px;
  line-height: 1.4;
  letter-spacing: 0.06em;
  margin-bottom: 8px;
  color: #113E96;
}
@media screen and (max-width: 767px) {
  .subTitle06 .ja {
    font-size: 1em;
    margin-bottom: 0.2em;
  }
}
.subTitle06 .en {
  font-family: "Alatsi", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #000;
  display: inline-flex;
  vertical-align: middle;
  font-size: 40px;
  font-weight: normal;
  line-height: 1.4;
}
@media screen and (max-width: 767px) {
  .subTitle06 .en {
    font-size: 1.6em;
  }
}
.subTitle06.center {
  align-items: center;
}
.subTitle06.center .en {
  line-height: 1.3;
}

/* -----------------------------------------------------------------------------
   btn - ボタン共通
   ----------------------------------------------------------------------------- */
.btn {
  align-items: center;
  border: none;
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  position: relative;
  text-align: center;
  vertical-align: middle;
}

.btn-secondary {
  color: #101012;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .btn-secondary {
    letter-spacing: 0.05em;
  }
}
.btn-secondary i {
  width: 48px;
  height: 48px;
  border: 1px solid #113E96;
  border-radius: 5000em;
  position: relative;
  margin-right: 24px;
}
@media screen and (max-width: 767px) {
  .btn-secondary i {
    width: 2.9em;
    height: 2.9em;
    margin-right: 1.1em;
  }
}
.btn-secondary i::before {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 6px;
  height: 6px;
  border-radius: 5000em;
  position: absolute;
  background: #113E96;
}
.btn-secondary.white {
  color: #fff;
}
.btn-secondary.white i {
  border-color: #fff;
}
.btn-secondary.white i::before {
  background-color: #fff;
}

a.btn-secondary {
  color: #101012;
}
a.btn-secondary.white {
  color: #fff;
}

/* -----------------------------------------------------------------------------
   tableStyle04 - 募集要項テーブル
   ----------------------------------------------------------------------------- */
.tableStyle04 {
  background-color: #fff;
  text-align: left;
}
@media screen and (max-width: 767px) {
  .tableStyle04 {
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .tableStyle04 tbody,
  .tableStyle04 tr,
  .tableStyle04 th,
  .tableStyle04 td {
    display: block;
    width: 100%;
  }
}
@media screen and (min-width: 768px) {
  .tableStyle04 th,
  .tableStyle04 td {
    padding: 1.5em 0.6em;
  }
}
@media screen and (min-width: 768px) {
  .tableStyle04 th {
    width: 248px;
    position: relative;
  }
}
@media screen and (max-width: 767px) {
  .tableStyle04 th {
    padding: 1.3em 0.6em 0;
  }
}
@media screen and (min-width: 768px) {
  .tableStyle04 th::after {
    content: "";
    display: block;
    width: calc(100% - 16px);
    height: 1px;
    background: #787B89;
    position: absolute;
    left: 0;
    bottom: 0;
  }
}
.tableStyle04 ul {
  margin-left: 1.5em;
}
@media screen and (min-width: 768px) {
  .tableStyle04 td {
    position: relative;
  }
  .tableStyle04 td::after {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background: #787B89;
    position: absolute;
    left: 0;
    bottom: 0;
  }
}
@media screen and (max-width: 767px) {
  .tableStyle04 td {
    border-bottom: 1px solid #787B89;
    padding: 0.4em 0.6em 1.3em;
  }
}

/* -----------------------------------------------------------------------------
   contents-recruit07 - 募集要項セクション
   ----------------------------------------------------------------------------- */
.contents-recruit07 {
  padding: 86px 0 96px;
  position: relative;
  background: #fff;
}
@media screen and (max-width: 767px) {
  .contents-recruit07 {
    padding: 4em 5% 4.8em;
  }
}
.contents-recruit07 .inner {
  /* shinseicraft style.css の .inner を上書き */
  opacity: 1 !important;
  position: static !important;
  right: auto !important;
  background: transparent !important;
  padding: 0 20px !important;
  height: auto !important;
  overflow: visible !important;
  transition: none !important;
  /* shinseisteel のスタイル */
  max-width: 1200px;
  margin: 0 auto;
  width: 100%;
  box-sizing: border-box;
}
.contents-recruit07 .navi {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 16px;
  margin-bottom: 56px;
}
@media screen and (max-width: 767px) {
  .contents-recruit07 .navi {
    flex-direction: column;
    gap: 0.8em 0;
    padding: 0 13%;
  }
}
@media screen and (max-width: 767px) {
  .contents-recruit07 .navi li {
    width: 100%;
  }
}
.contents-recruit07 .navi a {
  width: 320px;
  height: 76px;
  font-size: 24px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #113E96;
  border: 1px solid #113E96;
  text-decoration: none;
  background: #fff;
  transition: all 0.3s ease;
}
@media screen and (max-width: 767px) {
  .contents-recruit07 .navi a {
    width: 100%;
    height: auto;
    font-size: 1.2em;
    padding: 0.75em 0;
  }
}
.contents-recruit07 .navi a:hover {
  background: #113E96;
  color: #fff;
}
.contents-recruit07 .navi a.on {
  background: #113E96;
  color: #fff;
}
.contents-recruit07 .recruitWrapper {
  max-width: 992px;
  margin: 0 auto;
}
.contents-recruit07 .tableStyle04 {
  max-width: 992px;
  margin: 0 auto;
}
.contents-recruit07 .wrapper {
  display: none;
}
.contents-recruit07 .wrapper.on {
  display: block;
}
.contents-recruit07 .link {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 112px;
}
@media screen and (max-width: 767px) {
  .contents-recruit07 .link {
    margin-top: 5.2em;
  }
}
.contents-recruit07 .link > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 1060px;
  height: 192px;
  background: linear-gradient(190deg, #316EF3, #004291);
  text-decoration: none;
}
@media screen and (max-width: 767px) {
  .contents-recruit07 .link > a {
    height: 9em;
  }
}
.contents-recruit07 .link > a .btn {
  font-size: 20px;
}
@media screen and (max-width: 767px) {
  .contents-recruit07 .link > a .btn {
    font-size: 1.1em;
  }
}

/* -----------------------------------------------------------------------------
   tableStyle04 内のリンク
   ----------------------------------------------------------------------------- */
.tableStyle04 a {
  color: #113E96;
  text-decoration: underline;
}
.tableStyle04 a:hover {
  text-decoration: none;
}
