@charset "utf-8";

/* 
Theme Name: page
*/
/* 下層ページ */
.page_section_container {
  width: 100%;
  padding: 50px 40px;
}
.page_head {
    width: 100%;
    position: relative;
    background-color:#402E76;
    /* height:80vh; */
    /* max-height:800px; */
    background-image: url(../images/page_mv_bg.png);
    background-size: 40% 100%;
  }

.page_title {
    position: absolute;
    top:50%;
    left: 4%;
    transform: translateY(-50%);
    width:fit-content;
    z-index: 10;
}
.page_title h1 {
   
  font-size: clamp(24px, 2.63vw, 45px);
    width:fit-content;
    /* padding:5px 20px; */
    color:#fff;

  }
.page_title p {
  font-size: clamp(14px, 0.95vw, 16px);
    display: block;
   
    color:#fff;
    width:fit-content;
    /* padding:5px 20px; */
    margin-bottom:5px;


}
    
  .page_title_underline {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom:26px;
  }
  .page_title_underline span {
    display: block;
    width: 80px;
    height: 4px;
    background: #F9B129;
    margin-right:auto;
  }

.page_content {
    max-width: 1136px;
    margin: 0 auto;
}

.page_headImage {
  width: 60%;
    margin-top:85px;
    margin-left:auto;
    height:auto;
    /* max-height:800px; */
}

.page_headImage img {
    object-fit: cover;
  width: 100%;
 /* height:80vh; */
 height:auto;
}



.page_catchcopy {
    font-size:34px;
    font-weight:bold;
    line-height:1.47;
    color:#402E76;
    text-align: center;
}
.page_section_inner {
  background: #fff;
  padding:50px 140px;
  border-radius: 10px;
}
.page_content_head {
  max-width:960px;
  margin:0 auto;
}
.page_content_head_text {
    font-size:18px;
    line-height: 1.87;
    text-align: center;
    margin-top:40px;
    margin-bottom:45px;
    
}
.section_head {
    text-align: center;
   margin-bottom:45px;
  }
  section.company,
  section.service {
    padding-bottom:0;
  }
  .page_section_title {
    font-size: 28px;
    font-weight: bold;
    color: #000;
    margin-bottom: 24px;
    line-height: 1.4;
  }
  
  .page_section_title_underline {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .page_section_title_underline span {
    display: block;
    width: 60px;
    height: 4px;
    background: linear-gradient(90deg, #402E76 0%, #402E76 50%, #F9B129 50%, #F9B129 100%);
    margin: 0 auto;
  }

  .line_left span {
    margin-left:0;

  }
  /* 採用情報 */
  .recruit_tabs_container {
    display: flex;
    max-width:1126px;
    justify-content: center; /* タブを中央寄せにする場合 */
    margin-bottom: 40px; /* タブとコンテンツの間隔 */
    overflow: hidden; /* 角丸からはみ出る子要素を隠す */
    margin-left: auto; /* 中央寄せ */
    margin-right: auto; /* 中央寄せ */
    gap:47px;
  }
  
  .recruit_tab {
    position: relative;
    padding: 15px 30px; /* タブのパディング */
    white-space: nowrap;
    color: #402E76; /* タブのテキスト色 */
    border: 1px solid #402E76;
    text-decoration: none;
    font-size: 20px;
    font-weight: bold;
    width:50%;
    transition: background-color 0.3s, color 0.3s; /* ホバーエフェクト */
    text-align: center;
    background-color: #fff;
  }

  .recruit_tab::after {
    content: '▼'; /* 三角のアイコン */
    font-size: 12px;
    position: absolute;
    right:48px;
    top:50%;
    transform: translateY(-50%);
    color: #402E76; /* アイコンの色 */
    margin-left: 10px; /* テキストとアイコンの間隔 */
}

  .recruit_tab:hover,
  .recruit_tab.is-active {
    background-color: #402E76; /* アクティブ/ホバー時の背景色 */
    color: #fff; /* アクティブ/ホバー時のテキスト色 */
  }
  .recruit_tab:hover.recruit_tab::after {
    color:#fff;
  }
  .page_recruit_section {
      margin-bottom: 50px; /* 各セクションの下の間隔 */
    }

  .page_recruit_section h2 {
      font-size: 26px;
      margin-bottom: 20px;
      color: #402E76;
  }
  .page_section_recruit_inner {
    width:1085px;
    margin: 0 auto;
  }
  .page_section_recruit_inner p {
    margin-bottom:40px;

  }
  .recruit_info_table {
    width: 100%; /* テーブルの幅を親要素に合わせる */
    border-collapse: collapse; /* セルのボーダーを重ねる */
    margin-bottom: 20px; /* テーブルの下に余白 */
  }
  .recruit_info_table th,
  .recruit_info_table td {
    border: 1px solid #ddd; /* セルのボーダー */
    padding: 10px; /* セル内の余白 */
    text-align: left; /* テキスト左揃え */
  }
  
.recruit_info_table th {
  background-color: #f2f2f2; 
  width:30%;  
  color: #000; 
}

.recruit_info_table td {
  color: #000; /* 内容のテキスト色 */
}



  /* アクセス */
  .access_section {
    width: 100%;
    padding: 50px 40px;
  }
  
  .access_content {
    margin-top:48px;
  }
  .access_map iframe {
    width:100%;
  }
  /* 企業情報ページ */
  .message_inner {
    display: flex; 
    align-items: flex_start;
    gap: 40px; 
    justify-content: center;
}

.message_image_area {
    flex-shrink: 0; /* 縮小しない */
    width: 40%; /* 左側のグレー領域の幅（適宜調整） */
    /* height: 400px; */ /* 高さを固定する場合（コンテンツ量に合わせて調整） */
    aspect-ratio: 3 / 4; /* アスペクト比を固定する場合 */
}

.message_content_area {
    /* flex-grow: 1;  */
    width: 960px; 
}

.message_title {
    font-size: 26px; /* タイトルのフォントサイズ（適宜調整） */
    font-weight: bold; /* 太字 */
    margin-bottom: 20px; /* タイトルの下部の余白 */
    color: #333; /* タイトルの色 */
}

.message_text {
    font-size: 18px; /* 本文のフォントサイズ（適宜調整） */
    line-height: 1.9; /* 行間 */
    margin-bottom: 30px; /* 本文の下部の余白 */
    color: #555; /* 本文の色 */
}

.message_signature {
    margin-left:auto;
    width:250px;
}
/* 会社概要セクション */
.company_info_section {
  margin-top: 60px; /* 上部の余白を調整 */
  margin-bottom: 60px; /* 下部の余白を調整 */
}

.company_info_inner {
  display: flex; /* 子要素（基本情報エリアと事業所情報エリア）を横並びに */
  gap: 40px; /* エリア間の隙間 */
  margin:38px auto 0 auto;
  width:960px;
}
.company_basicinfo_inner {
  margin:38px auto 0 auto;
  width:960px;
}
.company_basic_info {
  flex: 1; /* 基本情報エリアが均等にスペースを占めるように */
  width:100%;
}

.company_branch_info {
  flex: 1; /* 事業所情報エリアが基本情報エリアの倍のスペースを占めるように（適宜調整） */
  width:50%;
  
}

.company_info_table {
  width: 100%; /* テーブルの幅を親要素に合わせる */
  border-collapse: collapse; /* セルのボーダーを重ねる */
  margin-bottom: 20px; /* テーブルの下に余白 */
}

.company_info_table th,
.company_info_table td {
  border: 1px solid #ddd; /* セルのボーダー */
  padding: 10px; /* セル内の余白 */
  text-align: left; /* テキスト左揃え */
}

.company_info_table th {
  background-color: #f2f2f2; 
  width:30%;  
  color: #000; 
}

.company_info_table td {
  color: #000; /* 内容のテキスト色 */
}

.branch_block {
  margin-bottom: 30px; /* 各事業所ブロックの下に余白 */
}

.branch_title {
  font-size: 22px; /* 事業所名のフォントサイズ（適宜調整） */
  color: #402E76;
  padding-bottom: 5px; /* 下線とテキストの間隔 */
  text-align: left;
}
.branch_block ul li {
  text-align: left;
  margin-bottom:16px;
}
.ict_link {
  margin-top: 15px; /* リンクの上部に余白 */
}
.ict_link img {
  width:22px;
  height:22px;
  margin-right: 8px;
}
.ict_link a {
  color:#000;
  text-decoration: none; /* 下線なし */
  display: inline-flex; /* アイコンとテキストを横並びに */
  align-items: center;
 
  width:fit-content;
}
.company_service_text{
  text-align: center;
}

  /* お問合せ */
.page_contact_inner {
  max-width: 960px;
  margin: 0 auto;
  padding: 100px 0 60px 0;
}

.contact_head_text {
  font-size:18px;
  font-weight:500;
  text-align: center;
  line-height:1.8;
  margin-bottom:60px;
}
.contact_bottom_text {
  font-size: 14px;
  text-align: center;
  margin-top:55px;
}
.wpcf7 table {
  width: 100%;
  border-collapse: collapse; /* テーブルのセルの境界線を重ねない */
}
.wpcf7 table tr {
  display:flex;
  align-items: center;
}
form table th {
  text-align: left;
  padding-right: 10px;
  width: 20%; /* ラベルの幅を設定 */
  vertical-align: middle;
}

form table td {
  padding: 15px;
  width: 80%; /* 入力欄の幅を設定 */
}

form table th.textarea_title {
  vertical-align: top;
  padding-top:15px;
}

input.form_text_box, textarea {
  width: 100%;
  padding: 8px;
  margin: 3px 0;
  border-radius: 10px;
  background-color: #fff;
  font-size:16px;
  border:1px solid #707070;
}
input.form_text_box {
  height:50px;
}
span.required {
  color: #FF0000;
  font-weight: bold;
}

.custom-submit,.custom-pre {
  display: block;
  position: relative;
  width:240px;
  margin: 0 auto;
  border: solid 1px #402E76;
    background-color: #fff;
    margin: 0 auto;
    border-radius: 50px;

  text-align: center;

}
.custom-submit {
  margin-top:24px;
}
.wpcf7-submit {
  /* box-shadow: 4.9px 5px 8px 0 rgba(101, 101, 101, 0.44); */
  
  background-color: #fff;
  margin:0 auto;
  color:#402E76;
  font-weight: bold;
  padding:18px;
  padding-right:32px;
  border-radius: 50px;
  width:100%;

}
.wpcf7-previous {
  margin:0 auto;
  color:#402E76;
  padding:18px;
  padding-right:32px;
  font-weight: bold;
  width:100%;

}
.custom-submit::after {
  content:"";
  background-image:url(../images/contact_submit.png);
  position: absolute;
  top:50%;
  transform:translateY(-50%);
  right:22px;
  background-size: 30px 30px; /* ← 矢印画像の大きさを調整 */
  background-repeat: no-repeat;
  background-position: center;
  width:30px;
  height: 30px;

}

.wpcf7-spinner {
  display:none;
}


/* ポリシー */
  .policy_section {
    padding:30px;
  }
  .policy_title {
    font-size: 20px;
    color:#402E76;
  }
  .policy_item {
    font-size:16px;
    color:#402E76;
    margin-top:29px;
    margin-bottom:21px;
  }
  
@media (max-width: 1100px) {
  .company_basicinfo_inner,.company_info_inner {
    width:100%;
  } 
  .page_head {
    background-size: 40% 100%;
    /* height:70vh; */
  }
  .page_headImage {
    width:60%;
    /* height:70vh; */

  }
  /* .page_headImage img {
    height:70vh;

  } */
  .page_content_head {
    padding:50px 20px;
  }
}
@media (max-width: 768px) { 
  .page_section_container {
    padding:50px 20px;
  }
  .page_content_head {
    width:100%;
    padding:50px 20px;
  }
  .page_contact_inner {
    width:100%;
    padding: 100px 32px 60px;
  }
  .page_head {
    background-size: 40% 100%;
    /* height:50vh; */
  }
  .page_headImage {
    width:60%;
    /* height:50vh; */

  }
  /* .page_headImage img {
    height:50vh;

  } */
  .message_inner {
      flex-direction: column; /* 縦並びにする */
      gap: 30px;
  }

  .message_image_area,
  .message_content_area {
      width: 100%; /* 幅を100%にする */
  }

  .message_image_area {
       /* height: 300px; */ /* 高さを調整 */
       aspect-ratio: 16 / 9; /* アスペクト比を調整 */
  }
  .page_content_head.company .page_content_head_text {
    margin-bottom:0;
  }
  .company_basicinfo_inner,
  .company_info_inner {
    flex-direction: column;
    gap: 30px;
    width:100%;
}

.company_basic_info,
.company_branch_info {
    flex: none; 
    width: 100%; 
    min-width: 0; 
}

.recruit_tabs_container {
  width:100%;
  padding:0 20px;
}
.page_section_recruit_inner {
  width:100%;
}
/* .page_title h1 {
  font-size:30px;
} */
.access_map iframe {
  width:100%;
}
}
@media (max-width: 600px) { 
  .page_head {
    display: flex;
    flex-direction: column;
      height:auto;
      background-image:none;
      margin-top:88px;
      background-color: transparent;
    }
    .page_headImage {
      width:100%;
      margin-top:0;
      height:auto;

    }

    .page_headImage img.sp_s {
      height:auto;
      object-fit: cover;
    }
    .page_title_underline {
      margin-bottom:11px;
    }
    .page_title {
      /* top:45%;
      left:50%; */
      background-image: url(../images/page_mv_bg_sp.png);
      background-size: cover;
      top:auto;
      left:auto;
      transform: none;
      position: relative;
      width:100%;
      height:200px;
      padding-top:15%;
    }
    .page_title p {
      text-align: center;
      font-size:16px;
      margin:0 auto;
      /* margin-bottom:11px; */
    }
    .page_title h1 {
      text-align: center;
      font-size:26px;
      margin:0 auto;
  
  }
  .page_title_underline span {
    margin:0 auto;
  }
}
  @media (max-width: 480px) { 
  
 
  .recruit_tabs_container {
    width:100%;
    flex-direction: column;
    padding:0 20px;
  }
  .recruit_tab {
    width:100%;
  }

.wpcf7 table tr {
 flex-direction: column;
 margin-bottom:16px;
}
form table th {
  text-align: left;
  padding-right: 10px;
  width: 100%; /* ラベルの幅を設定 */
  vertical-align: middle;
}

form table td {
  padding: 0;
  width: 100%; /* 入力欄の幅を設定 */
}
.branch_block {
  margin-bottom:0;
}
.company_basicinfo_inner,
.company_info_inner {
  gap:0;
}
}