body{
  margin:0;
  padding:0;
  font-family:"Helvetica Neue", Arial, sans-serif;
  color:#333;
  line-height:1.6;
}

.container{
  max-width:1200px;
  margin:0 auto;
  padding:0 20px;
  box-sizing:border-box;
}

img{
  max-width:100%;
  display:block;
}

/* =========================
body fade-in/out
========================= */
body.fade-in {
  opacity:1;
  transition:opacity .6s ease;
}

body.fade-out {
  opacity:0;
}

/* =========================
header
========================= */
.header{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  padding:20px 30px;
  z-index:100;
  box-sizing:border-box;
}

.pc-menu a,
.footer-links a,
.mobile-menu a{
  position:relative;
  text-decoration:none;
}

.pc-menu a::after,
.footer-links a::after,
.mobile-menu a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-6px;
  width:0%;
  height:2px;
  background:currentColor;
  transition:width .25s ease;
}

.pc-menu a:hover::after,
.footer-links a:hover::after,
.mobile-menu a:hover::after{
  width:100%;
}

.pc-menu a{
  margin-left:25px;
  color:#025695;
  font-weight:500;
}

/* =========================
hero（TOP）
========================= */
.hero{
  height:100vh;
  position:relative;
  overflow:hidden;
}

.slideshow{
  position:absolute;
  width:100%;
  height:100%;
}

.slide{
  position:absolute;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  animation:zoomFade 40s infinite;
}

.slide:nth-child(1){ animation-delay:0s; }
.slide:nth-child(2){ animation-delay:8s; }
.slide:nth-child(3){ animation-delay:16s; }
.slide:nth-child(4){ animation-delay:24s; }
.slide:nth-child(5){ animation-delay:32s; }

@keyframes zoomFade{
  0%{ opacity:0; transform:scale(1); }
  5%{ opacity:1; }
  20%{ opacity:1; transform:scale(1.1); }
  25%{ opacity:0; }
  100%{ opacity:0; }
}

.overlay{
  position:absolute;
  inset:0;
  background:rgba(255,255,255,0.35);
}

.hero-center{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  text-align:center;
  z-index:10;
}

/* =========================
HERO ロゴ・会社名調整
========================= */

.center-brand{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  margin-bottom:25px;
}

/* ロゴ小さく */
.center-logo{
  height:90px;   /* ← 小さく調整 */
  width:auto;
}

/* 会社名 少し大きく＆色指定 */
.center-company-name{
  font-size:42px;   /* 少し大きめ */
  font-weight:700;
  color:#025695;
  letter-spacing:2px;
}

.center-company-name {
  color: #025695; /* 文字色（必要に応じて変更） */

    text-shadow:
    -1px -1px 0 #fff,
     1px -1px 0 #fff,
    -1px  1px 0 #fff,
     1px  1px 0 #fff,
     0 0 6px rgb(255, 255, 255);/* うっすら影（任意） */
}

.center-logo {
  filter: drop-shadow(0 0 6px #ffffff);/* ロゴにもうっすら影（任意） */
}

.catch,
.sub {
  filter: drop-shadow(0 0 6px #ffffff);
}

/* =========================
HERO CTA ボタン幅統一
========================= */
.hero .cta{
  display:flex;
  justify-content:center;
  gap:20px;
  flex-wrap:wrap;
}

.hero .cta .btn{
  min-width:220px;   /* ← 横幅統一 */
  text-align:center;
}

/* =========================
button
========================= */
.btn{
  padding:15px 35px;
  margin:10px;
  display:inline-block;
  text-decoration:none;
  transition:.3s;
  border-radius:4px;
  border:1px solid #025695;
}

.primary{
  background:#025695;
  color:white;
  border:1px solid #025695;
}

.primary:hover{ background:#014070; }

.secondary{
  background:white;
  border:1px solid #025695;
  color:#025695;
}

.secondary:hover{
  background:#025695;
  color:white;
}

/* =========================
section共通
========================= */
.section-title{
  text-align:center;
  color:#025695;
  margin-bottom:60px;
  font-size:32px;
  letter-spacing:2px;
}

/* =========================
TOP service
========================= */
.service{
  padding:120px 20px;
  background:white;
}

.service-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:30px;
}

.card,
.reason-card{
  background:white;
  padding:40px;
  text-align:center;
  border:1px solid rgba(2,86,149,0.12);
  transition:.3s;
}

.card:hover,
.reason-card:hover{
  transform:translateY(-6px);
  box-shadow:0 12px 25px rgba(0,0,0,0.08);
}

.icon-img{
  width:78px;
  height:78px;
  object-fit:contain;
  margin:0 auto 20px;
}

/* =========================
Service CTA 余白調整
========================= */

/* =========================
Service Intro 余白統一（reasonに合わせる）
========================= */
.service-intro{
  padding:120px 20px;   /* ← reason-intro と同じ */
  background:white;
}

.service-contact-cta{
  padding:140px 20px 180px; 
}

/* =========================
会社概要 文字調整
========================= */

/* ラベルをボールド強調 */
.company-row .label{
  font-weight:700;
  display:block;
  margin-bottom:2px;   /* ← ラベルと内容の間隔を狭く */
}

/* 内容との行間を狭く */
.company-row .value{
  margin-top:0;
  line-height:1.4;   /* ← 少し詰める（既存1.6より狭く） */
}

/* value内の改行間も詰める */
.company-row .value br{
  line-height:1.3;
}

/* =========================
会社概要 アクセス
========================= */
.company-access{
  background: rgb(248, 251, 255);
  padding:80px 0;
}

.map-wrapper{
  position:relative;
  width:100%;
  max-width:1200px;   /* ← 会社情報白枠と同じ幅 */
  margin:40px auto;
  
}

.map-wrapper iframe{
  width:100%;
  height:350px;   /* ← PCは小さく */
  border:0;
  border-radius:10px;
}

.map-info{
  margin-top:20px;
  font-size:15px;
  line-height:1.8;
  color:#333;
}

.map-button{
  text-align:center;
  margin-top:20px;
}

/* =========================
reason
========================= */
.reason{
  background:#f8fbff;
  padding:120px 20px;
}

.reason-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:30px;
}

/* =========================
Reason Intro
========================= */
.reason-intro{
  padding:120px 20px;
  background:white;
}

.intro-text{
  max-width:800px;
  margin:0 auto;
  text-align:center;
  color:#555;
}

/* =========================
Strength
========================= */
.reason-strength{
  padding:120px 20px;
  background:#f8fbff;
}

.strength-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:30px;
}

.strength-card{
  background:white;
  padding:50px;
  border:1px solid rgba(2,86,149,0.12);
  transition:.3s;
}

.strength-card:hover{
  transform:translateY(-6px);
  box-shadow:0 12px 25px rgba(0,0,0,0.08);
}

.strength-card h3{
  position:relative;
  padding-bottom:12px;
  margin-bottom:20px;
  color:#025695;
}

.strength-card h3::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:0%;
  height:1px;
  background:#025695;
  transition:width .8s ease;
}

.strength-card.show h3::after{
  width:100%;
}

/* =========================
Data
========================= */
.reason-data{
  padding:120px 20px;
  background:white;
}

.data-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:30px;
}

.data-card{
  text-align:center;
  padding:40px;
  border:1px solid rgba(2,86,149,0.12);
}

.number{
  display:block;
  font-size:30px;
  font-weight:bold;
  color:#025695;
  white-space:nowrap;
  margin-bottom:10px;
}

/* =========================
Responsive
========================= */
@media(max-width:1100px){
  .strength-grid{ grid-template-columns:repeat(2,1fr); }
  .data-grid{ grid-template-columns:repeat(2,1fr); }
}

@media(max-width:768px){
  .strength-grid,
  .data-grid{
    grid-template-columns:1fr;
  }

  .center-brand{
    flex-direction:column;   /* ← 縦並び */
    gap:15px;
  }

  .center-logo{
    height:70px;
  }

  .center-company-name{
    font-size:26px;
  }

  .page-hero h1{
    font-size:26px;
    white-space:nowrap;   /* ← 1行固定 */
  }

    /* 青枠中央固定 */
  .recruit-card{
    padding:50px 15px;
    margin:0 auto;
    text-align:center;
  }

  /* 中身完全センター */
  .recruit-content{
    width:100%;
    margin:0 auto;
    text-align:center;
  }

  /* タイトル中央固定 */
  .recruit-content h3{
    font-size:20px;
    margin:0 auto 20px;
    text-align:center;
    display:block;
    width:100%;
  }

  /* ボタン中央＋はみ出し防止 */
  .recruit-content .btn{
    display:block;
    width:100%;
    max-width:300px;   /* 画面内に収める */
    margin:25px auto 0;
    text-align:center;
    white-space:normal;   /* ← nowrap削除 */
    padding:14px 20px;    /* 内側余白調整 */
    box-sizing:border-box;
  }
}

/* =========================
corporate
========================= */
/* 代表挨拶 */
.company-message{
  padding:120px 20px;
  background:white;
}

.message-text{
  max-width:600px;
}

.message-subtitle{
  font-size:22px;
  font-weight:500;
  color:#025695;
  margin-bottom:25px;
  letter-spacing:1px;
}

.message-text p{
  margin-bottom:20px;
  line-height:1.8;
  color:#444;
}

.message-inner{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center;
}

.message-img img{
  width:100%;
  object-fit:cover;
}

.company-profile{
  padding:120px 20px;
  background:#f8fbff;
}

/* profile-tableと同じ幅にする */
.company-access .container{
  max-width:1200px;
}

.profile-table{
  background:white;
  border:1px solid rgba(2,86,149,0.1);
}

.profile-table .row{
  display:grid;
  grid-template-columns:250px 1fr;
  padding:20px 40px;
  border-bottom:1px solid rgba(0,0,0,0.05);
}

.profile-table .th{
  font-weight:bold;
  color:#025695;
}

.company-access{
  padding:120px 20px;
  background:white;
}

/* =========================
Google Map 安定表示版
========================= */

.map-wrapper{
  width:100%;
  margin:40px auto;
  border:1px solid rgba(2,86,149,0.1);
  box-shadow:0 20px 40px rgba(0,0,0,0.05);
  overflow:hidden;
}

/* ★ 高さ固定 */
.map-wrapper iframe{
  width:100%;
  height:350px;   /* ← 指定通り */
  border:0;
  display:block;
}

@media(max-width:768px){
  .message-inner{
    grid-template-columns:1fr;
    text-align:center;
  }
  .profile-table .row{
    grid-template-columns:1fr;
    gap:10px;
  }
  .message-text{
    margin:0 auto;
  }
}

.map-area{
  height:400px;
  border:1px solid rgba(2,86,149,0.1);
  box-shadow:0 20px 40px rgba(0,0,0,0.05);
}

/* =========================
Map Section
========================= */

/* 情報テキスト */
.map-info{
  padding:20px 0;
  font-size:14px;
  line-height:1.8;
}

/* ボタン中央 */
.map-button{
  text-align:center;
  margin-top:30px;
}

/* =========================
company
========================= */
.company{
  padding:100px 20px;
  background:#f9fbfd;
}

.company-card{
  background:white;
  padding:60px 80px;
  border:1px solid rgba(2,86,149,0.1);
  box-shadow:0 20px 40px rgba(0,0,0,0.05);
}

.company-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  margin-bottom:40px;
}

.company-button-area{
  display:flex;
  justify-content:center;
}

.company-btn{
  min-width:200px;
  text-align:center;
}

.company-origin {
  padding: 80px 0;
  background: #f9f9f9;
}

.origin-text {
  max-width: 800px;
  margin: 0 auto;
  line-height: 1.9;
  text-align: center;
}

/* =========================
recruit
========================= */
.recruit{
  padding:120px 20px;
  background:white;
}

.recruit-card{
  background:#025695;
  color:white;
  padding:80px;
  text-align:center;
}

/* =========================
Recruit Hero ボタン白バージョン
========================= */

.hero-cta .btn{
  background:#ffffff;
  color:#025695;
  border:1px solid #025695;
}

.hero-cta .btn:hover{
  background:#025695;
  color:#ffffff;
}

/* =========================
Recruit Message
========================= */

.recruit-message{
  padding:120px 20px;
  background:white;
}

.recruit-text{
  max-width:800px;
  margin:0 auto;
  text-align:center;
  line-height:1.8;
  color:#444;
}

.recruit-text p{
  margin-bottom:20px;
}


/* =========================
Recruit Detail（募集要項）
========================= */

.recruit-detail{
  padding:120px 20px;
  background:#f8fbff;
}

.job-table{
  max-width:900px;
  margin:0 auto;
  border:1px solid rgba(2,86,149,0.15);
  background:white;
}

.job-row{
  display:grid;
  grid-template-columns:220px 1fr;
  border-bottom:1px solid rgba(2,86,149,0.1);
}

.job-row:last-child{
  border-bottom:none;
}

.job-label{
  background:#f4f7fa;
  padding:20px;
  font-weight:bold;
  color:#025695;
}

.job-value{
  padding:20px;
  color:#333;
}


/* =========================
Recruit Merit
========================= */

.recruit-merit{
  padding:120px 20px;
  background:white;
}

.merit-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:30px;
}

.merit-card{
  background:white;
  padding:40px;
  text-align:center;
  border:1px solid rgba(2,86,149,0.12);
  transition:.3s;
}

.merit-card:hover{
  transform:translateY(-6px);
  box-shadow:0 12px 25px rgba(0,0,0,0.08);
}

.merit-card h3{
  color:#025695;
  margin-bottom:15px;
  font-weight:500;
}


/* =========================
Recruit CTA
========================= */

.recruit-cta{
  padding:120px 20px;
  background:#f8fbff;
  text-align:center;
}

.recruit-cta h2{
  color:#025695;
  margin-bottom:20px;
}

.recruit-cta p{
  margin-bottom:30px;
}

.recruit-cta .cta-buttons{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
}

.recruit-cta .btn{
  margin:12px 16px;
}

/* =========================
フォーム関連
========================= */
.entry-section {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 120px 20px;
  background: #ffffff; /* 他ページと統一 */
}

.entry-section .container {
  max-width: 700px;
  width: 100%;
  margin: 0 auto;
}

.entry-form {
  max-width:700px;
  margin:0 auto;
  background:white;
  padding:60px;
  border:1px solid rgba(2,86,149,0.15);
  box-shadow:0 20px 40px rgba(0,0,0,0.05);
}

.form-group {
  margin-bottom:25px;
}

.form-group label {
  display:block;
  margin-bottom:8px;
  font-weight:500;
  color:#025695;
}

.required {
  font-size:12px;
  color:white;
  background:#d9534f;
  padding:2px 6px;
  margin-left:8px;
  border-radius:3px;
}

.entry-form input,
.entry-form textarea {
  width:100%;
  padding:12px 15px;
  border:1px solid rgba(2,86,149,0.2);
  border-radius:3px;
  font-size:14px;
  box-sizing:border-box;
}

.entry-form input:focus,
.entry-form textarea:focus {
  outline:none;
  border-color:#025695;
}

.form-submit {
  text-align:center;
  margin-top:40px;
}


/* =========================
Responsive
========================= */

@media(max-width:1100px){
  .merit-grid{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:768px){

  .job-row{
    grid-template-columns:1fr;
  }

  .job-label{
    background:#025695;
    color:white;
  }

  .merit-grid{
    grid-template-columns:1fr;
  }

}

/* =========================
contact
========================= */
.contact{
  padding:120px 20px;
  background:#f8fbff;
}

.contact-card{
  background:white;
  padding:60px;
  text-align:center;
  border:1px solid rgba(2,86,149,0.1);
}


.company-row .label{
  color:#025695;
  font-weight:600;
  letter-spacing:1px;
  font-size:14px;
  font-weight:bold;
  margin-bottom:4px;
}

.company-row .value{
  color:#333;
  font-weight:normal;
}


/* =========================
footer
========================= */
.footer{
  background:#025695;
  color:white;
  padding:80px 20px 40px;
}

.footer-links{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:20px;
  margin-bottom:40px;
}

.footer-links a{ color:white; }

.footer-bottom{
  text-align:center;
  font-size:14px;
  opacity:0.85;
}

/* =========================
PAGE HERO（子ページ）
========================= */
.page-hero{
  position:relative;
  height:55vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
}

.page-hero .overlay{
  background:rgba(255,255,255,0.45);
}

.page-hero h1{
  font-size:44px;
  letter-spacing:4px;
  font-weight:500;
  color:#025695;
}

.page-brand{
  position:absolute;
  top:30px;
  left:40px;
  display:flex;
  align-items:center;
  gap:12px;
  z-index:2;
  text-decoration:none; 
}

.page-brand img{ height:50px; }
.page-brand span{ color:#025695; font-weight:bold; }


.page-hero .hero-center h1 {
    color: #025695;

      text-shadow:
        -1px -1px 0 #fff,
         1px -1px 0 #fff,
        -1px  1px 0 #fff,
         1px  1px 0 #fff,
         0 0 6px rgb(255, 255, 255);
 }

 .hero-sub {
  filter: drop-shadow(0 0 6px #ffffff);
}

/* =========================
子ページメイン画像
========================= */
.hero-service{
  background-image:url("../img/hero_service.jpg");
}

.hero-reason{
  background-image:url("../img/hero_reason.jpg");
}

.hero-corporate{
  background-image:url("../img/hero_corporate.jpg");
}

.hero-recruit{
  background-image:url("../img/hero_recruit.jpg");
}

.hero-certification{
  background-image:url("../img/hero_certification.jpg");
}

.hero-contact{
  background-image:url("../img/hero_contact.jpg");
}



/* =========================
service detail（子ページ）
========================= */
.service-detail{ background:#f8fbff; }

.service-block{
  padding:120px 20px;   
  position:relative;
  opacity:0;
  transform:translateY(40px);
  transition:.8s;
}

.service-block.show{
  opacity:1;
  transform:none;
}

.service-block:nth-child(odd){ background:white; }
.service-block:nth-child(even){ background:#f4f7fa; }

.service-block::after{
  content:"";
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:1px;
  background:rgba(2,86,149,0.15);
}

.service-inner{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center;
}

.service-inner.reverse{ direction:rtl; }
.service-inner.reverse .service-text{ direction:ltr; }

.service-img{
  height:260px;
  overflow:hidden;
}

.service-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  box-shadow:0 10px 30px rgba(0,0,0,0.06);
}

.service-text h3{
  font-size:30px;
  font-weight:400;
  letter-spacing:2px;
  color:#025695;
  margin-bottom:30px;
}

.service-text ul{
  list-style:none;
  padding:0;
}

.service-text li{
  position:relative;
  padding-left:18px;
  margin-bottom:10px;
}

.service-text li::before{
  content:"";
  position:absolute;
  left:0;
  top:9px;
  width:5px;
  height:5px;
  background:#025695;
  border-radius:50%;
}

/* =========================
Service 見出しアニメーション
========================= */

.service-text h3{
  position:relative;
  display:inline-block;
  padding-bottom:12px;
}

/* 下線 */
.service-text h3::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:0%;
  height:1px;
  background:#025695;
  transition:width .8s ease;
}

/* 表示時に伸びる */
.service-block.show .service-text h3::after{
  width:100%;
}

/* Serviceページ CTA ボタン中央寄せ */
.service-contact-cta .cta-buttons{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
}

.service-contact-cta .cta-buttons .btn{
  margin:12px 16px;
}

/* Service CTA 全体中央寄せ */
.service-contact-cta{
  text-align:center;
}

.service-contact-cta h2,
.service-contact-cta p{
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}


/* =========================
fade（共通）
========================= */
.fade-up{
  opacity:0;
  transform:translateY(40px);
  transition:1s;
}

.fade-up.show{
  opacity:1;
  transform:none;
}

/* =========================
mobile menu
========================= */

.hamburger{
  display:none;
  cursor:pointer;
  background:transparent;
  border:none;
  padding:6px;
  z-index:300;
}

.hamburger span{
  display:block;
  width:25px;
  height:3px;
  background:#025695;
  margin:5px 0;
}

/* モバイルメニュー本体 */
.mobile-menu{
  display:none;
  flex-direction:column;
  position:fixed;      /* ← これ重要 */
  top:0;
  right:0;
  width:260px;
  height:100vh;
  background:white;
  padding:100px 30px;
  box-shadow:-10px 0 30px rgba(0,0,0,0.1);
  z-index:200;
}

.mobile-menu.active{
  display:flex;
}

.mobile-menu a{
  margin-bottom:20px;
  color:#025695;
  font-weight:500;
}

/* =========================
mobile responsive
========================= */

@media(max-width:768px){

  .pc-menu{
    display:none;
  }

  .hamburger{
    display:block;
  }

}

/* =========================
responsive
========================= */
@media(max-width:1100px){
  .reason-grid{ grid-template-columns:repeat(2,1fr); }
}

@media(max-width:768px){

  .pc-menu{ display:none; }

  .service-grid{ grid-template-columns:1fr; }
  .reason-grid{ grid-template-columns:1fr; }

  .service-inner{ 
    grid-template-columns:1fr;
    gap:25px;   /* ← 60px → 25pxに縮小 */  
  }
  .service-img{ 
    height:200px; 
    margin-bottom:10px;   /* 画像下の余白を少しだけ */
  }

  .center-company-name{
  font-size:22px;
  white-space:nowrap;   /* ← 改行防止 */
}
  .center-logo{ height:80px; }

}

.service-text h3{
    margin-top:0;      /* 余計な上マージン削除 */
    margin-bottom:15px;
  }



/* =========================
レスポンシブ
========================= */
@media(max-width:768px){
  .entry-form{
    padding:40px 25px;
  }
}

/* =========================
会社概要縦表示
========================= */
@media(max-width:768px){

  .company-grid{
    grid-template-columns:1fr;   /* 1列にする */
  }

  .company-block{
    margin-bottom:20px;
  }

  .map-wrapper iframe{
    height:400px;   /* ← スマホは今まで通り大きめ */
  }

}

/* =========================
Phone Modal
========================= */

.phone-modal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.45);

  display:none;              /* ← 初期は非表示 */
  justify-content:center;
  align-items:center;

  z-index:9999;
}

.phone-modal.active{
  display:flex;              /* ← activeで表示 */
}

.phone-modal-box{
  background:white;
  padding:50px 60px;
  text-align:center;
  max-width:420px;
  width:90%;
  border-radius:8px;
  box-shadow:0 30px 60px rgba(0,0,0,0.15);
}

.phone-modal-box h3{
  color:#025695;
  margin-bottom:20px;
}

.phone-number{
  font-size:28px;
  font-weight:bold;
  color:#025695;
  margin-bottom:15px;
}

.phone-note{
  font-size:14px;
  color:#666;
  margin-bottom:30px;
}

.modal-close-btn{
  padding:12px 30px;
  background:#025695;
  color:white;
  border:none;
  border-radius:4px;
  cursor:pointer;
}

.modal-close-btn:hover{
  background:#014070;
}

/* =========================
Recruit FAQ
========================= */

.recruit-faq{
  padding:120px 20px;
  background:#f8fbff;
}

.faq-list{
  max-width:900px;
  margin:0 auto;
}

.faq-item{
  background:white;
  border:1px solid rgba(2,86,149,0.12);
  margin-bottom:20px;
  padding:25px 30px;
}

.faq-question{
  font-weight:bold;
  color:#025695;
  margin-bottom:10px;
}

.faq-answer{
  color:#444;
  line-height:1.7;
}

/* =========================
Recruit FLOW
========================= */

.recruit-flow{
  padding:120px 20px;
  background:white;
}

.flow-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:30px;
}

/* ★必ずこの下に置く */
@media(max-width:768px){

  .flow-grid{
    grid-template-columns:1fr;
    gap:20px;
  }

  .flow-step{
    padding:30px 20px;
  }

}


.flow-step{
  background:#f8fbff;
  padding:40px;
  text-align:center;
  border:1px solid rgba(2,86,149,0.12);
  transition:.3s;
}

.flow-step:hover{
  transform:translateY(-6px);
  box-shadow:0 12px 25px rgba(0,0,0,0.08);
}

.step-number{
  font-size:14px;
  letter-spacing:2px;
  color:#025695;
  margin-bottom:10px;
}

.flow-step h3{
  color:#025695;
  margin-bottom:15px;
}

/* =========================
Contact Thanks
========================= */

.thanks-wrapper{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;   /* ← 横中央 */
  text-align:center;    /* ← 文字中央 */
  min-height:50vh;
  padding:120px 20px;
}

.thanks-wrapper h2{
  color:#025695;
  font-size:28px;
  margin-bottom:20px;
  width:100%;
  text-align:center;
}

.thanks-wrapper p{
  color:#333;
  font-size:16px;
  line-height:1.8;
  margin-bottom:30px;
  
}

@media(max-width:768px){
  .thanks-wrapper{
    padding:80px 20px;
  }
}

/* =========================
Certification Table
========================= */

.certification-section{
  background: rgb(248, 251, 255); /* 他ページと統一 */
  padding:120px 20px;
}

.certification-panel{
  background:#fff;
  padding:60px 40px;
  max-width:900px;
  margin:0 auto;
  box-shadow:0 10px 30px rgba(0,0,0,0.05);
}

.cert-table{
  width:100%;
  border-collapse:collapse;
}

.cert-table th,
.cert-table td{
  border:1px solid #333;   /* ← 枠線 #333 */
  padding:18px 20px;
  text-align:left;
  vertical-align:top;
}

.cert-table th{
  width:35%;
  background:#fff;
  font-weight:bold;
}

.cert-table td{
  width:65%;
  background:#fff;
}

/* スマホ */
@media(max-width:768px){

  .certification-panel{
    padding:40px 20px;
  }

  .cert-table th,
  .cert-table td{
    padding:14px;
    font-size:14px;
  }

}

@media screen and (max-width: 768px) {

  .hero .center-company-name {
    color: #025695 !important;
    text-shadow:
      -1px -1px 0 #fff,
       1px -1px 0 #fff,
      -1px  1px 0 #fff,
       1px  1px 0 #fff,
       0 0 6px #fff !important;
  }

  .hero .center-logo {
    filter: drop-shadow(0 0 6px #ffffff) !important;
  }

  .hero .catch,
  .hero .sub {
    filter: drop-shadow(0 0 6px #ffffff) !important;
  }
}


/* =========================
スマホ版画像指定
========================= */
@media screen and (max-width: 768px) {

  .hero-service {
    background-image: url("../img/hero_service.jpg");
    background-position: center 30%;
    background-size: cover;
  }

  .hero-reason {
    background-image: url("../img/hero_reason.jpg");
    background-position: center 20%;
    background-size: cover;
  }

  .hero-corporate {
    background-image: url("../img/hero_corporate.jpg");
    background-position: center 25%;
    background-size: cover;
  }

  .hero-recruit {
    background-image: url("../img/hero_recruit.jpg");
    background-position: center 40%;
    background-size: cover;
  }

  .hero-contact {
    background-image: url("../img/hero_contact.jpg");
    background-position: center 30%;
    background-size: cover;
  }

  .hero-certification {
    background-image: url("../img/hero_certification.jpg");
    background-position: center 25%;
    background-size: cover;
  }

}