
*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

body{
  font-family:
  "Hiragino Sans",
  "Noto Sans JP",
  sans-serif;

  color:#16305f;
  background:#fff;
  line-height:1.8;
}


/* =========================
   HEADER
========================= */
header{
  width:100%;
  position:fixed;
  top:0;
  left:0;
  background:#fff;
  z-index:999;
  border-bottom:1px solid #edf3fb;
  box-shadow:0 2px 12px rgba(0,0,0,0.04);
}

.header-inner{
  max-width:1400px;
  margin:auto;
  min-height:120px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:0 40px;
  box-sizing:border-box;
}

/* =========================
   LOGO
========================= */
.logo-area{
  flex-shrink:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.logo-link{
  display:inline-block;
}

.main-logo{
  width:260px;
  display:block;
  height:auto;
}

.logo-copy{
  font-size:10px;
  color:#78a7e2;
  margin-top:5px;
  margin-left:6px;
  letter-spacing:1px;
  line-height:1.5;
}

/* =========================
   右側エリア
========================= */
.header-nav-area{
  display:flex;
  align-items:center;
  gap:28px;
  margin-left:auto;
}

/* =========================
   NAV
========================= */
.global-nav{
  flex:1;
  display:flex;
  justify-content:center;
}

.global-nav ul{
  display:flex;
  gap:34px;
  list-style:none;
  margin:0;
  padding:0;
}

.global-nav a{ 
  color:#16305f; 
  text-decoration:none;
  font-size:18px;
  font-weight:500;
  letter-spacing:0.5px;
  white-space:nowrap;
  transition:.2s;
}

.global-nav a:hover{
  color:#2c7ee7;
}

/* =========================
   BUTTON
========================= */
.contact-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  background:linear-gradient(135deg,#2c7ee7,#1d59cb);
  color:#fff;
  text-decoration:none;
  padding:14px 24px;
  border-radius:40px;
  font-size:13px;
  flex-shrink:0;
  white-space:nowrap;
}

.contact-btn .mail-icon{
  width:18px;
  height:18px;
  display:block;
  object-fit:contain;
  flex-shrink:0;
}

/* =========================
   ハンバーガーボタン
========================= */
.menu-toggle{
  display:none;
  width:44px;
  height:44px;
  border:none;
  background:transparent;
  padding:0;
  cursor:pointer;
  flex-shrink:0;
  position:relative;
  z-index:1100;
}

.menu-toggle span{
  display:block;
  width:24px;
  height:2px;
  background:#16305f;
  margin:5px auto;
  transition:.3s;
}

/* =========================
   タブレット
========================= */
@media (max-width: 1200px){

  .header-inner{
    padding:0 24px;
    gap:18px;
  }

  .main-logo{
    width:220px;
  }

  .global-nav ul{
    gap:20px;
  }

  .global-nav a{
    font-size:15px;
  }

  .contact-btn{
    padding:12px 18px;
    font-size:12px;
  }
}

/* =========================
   スマホ
========================= */
@media (max-width: 860px){

  .header-inner{
    min-height:86px;
    padding:12px 16px;
    gap:12px;
    align-items:center;
  }

  .logo-area{
    max-width:calc(100% - 56px);
  }

  .main-logo{
    width:170px;
  }

  .logo-copy{
    font-size:9px;
    margin-top:4px;
    margin-left:2px;
    letter-spacing:0.5px;
    line-height:1.4;
  }

  /* ハンバーガー表示 */
  .menu-toggle{
    display:block;
    margin-left:auto;
  }

  /* PC用の右側をスマホではドロワー化 */
  .header-nav-area{
    position:fixed;
    top:86px;
    left:0;
    width:100%;
    background:#fff;
    box-shadow:0 10px 30px rgba(0,0,0,0.08);
    padding:24px 20px 28px;
    box-sizing:border-box;

    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:20px;
  }

  .header-nav-area.open{
    display:flex;
  }

  .global-nav{
    width:100%;
    display:block;
  }

  .global-nav ul{
    flex-direction:column;
    gap:0;
    align-items:stretch;
    border-top:1px solid #edf3fb;
  }

  .global-nav li{
    border-bottom:1px solid #edf3fb;
  }

  .global-nav a{
    display:block;
    padding:14px 4px;
    font-size:15px;
  }

  .contact-btn{
    width:100%;
    padding:14px 20px;
    justify-content:center;
    font-size:14px;
  }
}


/* HEROやCONTACTでも使うボタン */

.btn-primary{

  display:inline-flex;
  align-items:center;
  gap:10px;

  background:#2369dc;
  color:#fff;

  text-decoration:none;

  padding:16px 30px;

  border-radius:40px;

  font-weight:500;
}

/* HEROや本文ボタン用のメールアイコン */
.hero-mail-icon{
  width:25px;
  height:25px;
  object-fit:contain;
  opacity:0.95;
}



/* HERO */

/* TOP HERO */

.hero{

  position:relative;

  min-height:500px;
  padding-top:100px;
  padding-bottom:60px;

  display:flex;

  align-items:center;

  background-image:
  url("images/hero.jpg");

  background-size:cover;

  background-position:center;

  overflow:hidden;
}





/* 背景 */

.hero-content{

  position:relative;

  z-index:2;

  max-width:750px;

  margin-left:2%;

  padding:20px 40px;
}


/* HEROコンテンツ PC用*/

.hero-inner{

  position:relative;

  z-index:2;

  max-width:1300px;

  margin:auto;

  display:block;

  padding:0 40px;
}


.hero-text{ 
position:relative;
 padding:0;

 }


.hero-content h1{

  font-family:
  "Yu Mincho",
  "Hiragino Mincho ProN",
  "Noto Serif JP",
  serif;

  font-size:60px;

  line-height:1.3;

  margin-bottom:30px;

  font-weight:500;

  letter-spacing:1px;

  color:#16305f;

text-shadow:
0 4px 12px rgba(255,255,255,0.7),
0 10px 30px rgba(79,131,214,0.15);
}

.hero-content p{
  color:#6680aa;
  margin-bottom:40px;

  font-size:20px;

  line-height:2;
}

.hero-buttons{
  display:flex;
  gap:20px;
}


.btn-primary{

  display:inline-flex;
  align-items:center;
  gap:10px;

  background:#2369dc;
  color:#fff;

  text-decoration:none;

  padding:16px 30px;

  border-radius:40px;

  font-weight:500;
}


.btn-secondary{
  border:1px solid #2369dc;
  color:#2369dc;
  text-decoration:none;

  padding:16px 30px;
  border-radius:40px;
}

.hero-image{
  display:none;
}


/* =========================
   TOP HERO - TABLET　ここからスマホ
========================= */
@media (max-width: 1024px){

  .hero{
    min-height:420px;
    padding-top:90px;
    padding-bottom:50px;
    background-position:center center;
  }

  .hero-inner{
    padding:0 28px;
  }

  .hero-content{
    max-width:640px;
    margin-left:0;
    padding:10px 0;
  }

  .hero-content h1{
    font-size:48px;
    line-height:1.35;
    margin-bottom:24px;
  }

  .hero-content p{
    font-size:18px;
    line-height:1.9;
    margin-bottom:32px;
  }

  .hero-buttons{
    gap:14px;
  }

  .btn-primary,
  .btn-secondary{
    padding:14px 24px;
    font-size:15px;
  }
}


/* =========================
   TOP HERO - SP
========================= */
@media (max-width: 767px){

  .hero{
    min-height:auto;
    padding-top:110px;
    padding-bottom:44px;

    /* 画像をスマホで少し引き気味に見せる */
    background-size:cover;
    background-position:30% center;
  }

  .hero-inner{
    padding:0 18px;
  }

  .hero-content{
    max-width:100%;
    margin-left:0;
    padding:0;
  }

  .hero-text{
    padding:0;
  }

  .hero-content h1{
    font-size:32px;
    line-height:1.45;
    margin-bottom:18px;
    letter-spacing:0.5px;
  }

  .hero-content p{
    font-size:15px;
    line-height:1.85;
    margin-bottom:24px;
  }

  .hero-buttons{
    display:flex;
    flex-direction:column;
    gap:12px;
    align-items:stretch;
  }

  .btn-primary,
  .btn-secondary{
    width:100%;
    justify-content:center;
    text-align:center;
    padding:14px 20px;
    font-size:14px;
    box-sizing:border-box;
  }

  .hero-mail-icon{
    width:20px;
    height:20px;
  }
}


/* =========================
   TOP HERO - very small SP
========================= */
@media (max-width: 480px){

  .hero{
    padding-top:100px;
    padding-bottom:36px;
    background-position:24% center;
  }

  .hero-content h1{
    font-size:28px;
    line-height:1.45;
  }

  .hero-content p{
    font-size:14px;
    line-height:1.8;
  }

  .btn-primary,
  .btn-secondary{
    font-size:13px;
    padding:13px 18px;
  }
}




/* SECTION */

section{
  padding:70px 40px;
}

.section-title{
  text-align:center;
  margin-bottom:25px;
}

.section-title span{
  color:#6b94dd;
  font-size:22px;
  letter-spacing:2px;
}

.section-title h2{
  font-size:40px;
  margin-top:0px;
}



/* TOP NEWS */

.news-top{
  background:#fff;
}

.news-top .section-title{
  margin-bottom:18px;   /* 見出し下の余白も少し詰める */
}

.news-top-list{
  max-width:1000px;
  margin:auto;
  display:flex;
  flex-direction:column;
  gap:8px;   /* 行と行の間を短く */
}

.news-top-item{
  display:flex;
  align-items:center;
  gap:20px;

  padding:10px 16px;   /* ← ここを小さくして縦幅を短く */
  background:#f7fbff;
  border-radius:14px;
  text-decoration:none;
  transition:.3s;
}

.news-top-item:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 20px rgba(0,0,0,.05);
}

.news-top-date{
  min-width:95px;
  font-size:14px;
  color:#6b94dd;
  font-weight:600;
  line-height:1.4;
}

.news-top-title{
  color:#16305f;
  font-size:14px;
  line-height:1.35;  /* ← タイトルの行間も詰める */
}

.news-top-button{
  text-align:center;
  margin-top:18px;   /* ボタン上の余白も少し詰める */
}



/* SERVICE */


.service{

  padding:10px 40px 20px;
}


.service{
  background:#ffffff;
}

.service-grid{
  max-width:1400px;
  margin:auto;

  display:grid;
  grid-template-columns:repeat(6,1fr);

  gap:24px;
}

.service-card{
  background:#fff;

  border:1px solid #edf2fa;

  border-radius:28px;

  padding:42px 36px;

  transition:.3s;

  text-align:left;
}

.service-card:hover{
  transform:translateY(-8px);

  box-shadow:
  0 12px 30px rgba(0,0,0,0.06);
}

.service-icon{
  width:90px;
  height:90px;

  object-fit:contain;

  margin-bottom:24px;
}

.service-card h3{
  font-size:24px;

  margin-bottom:14px;

  color:#16305f;
}

.service-card p{
  color:#6881ab;

  font-size:15px;

  line-height:1.9;
}

/* MOBILE */

@media(max-width:960px){

  .service-grid{
    grid-template-columns:1fr;
  }

}


/* タブレット */

@media(max-width:1200px){

  .service-grid{
    grid-template-columns:repeat(3,1fr);
  }

}

/* スマホ */

@media(max-width:768px){

  .service-grid{
    grid-template-columns:repeat(2,1fr);
  }

}

/* 小さいスマホ */

@media(max-width:520px){

  .service-grid{
    grid-template-columns:1fr;
  }

}



/* Ori-Care */

.ori-care-section{
  padding:20px 40px 60px;
}

.ori-care-box{
  max-width:1300px;
  margin:auto;

  background:#f7fbff;
  border-radius:36px;

  padding:60px;

  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:40px;
  align-items:center;
}

.ori-care-text span{
  color:#4d86e8;
  font-size:24px;
  font-weight:600;
  letter-spacing:1px;
}

.ori-care-text h2{
  font-size:38px;
  line-height:1.6;
  margin:20px 0 30px;
  color:#16305f;
}

.ori-care-image img{
  width:100%;
  display:block;
}


/* =========================
   Ori-Care SP
========================= */
@media (max-width: 768px){

  .ori-care-section{
    padding:20px 20px 50px;
  }

  .ori-care-box{
    grid-template-columns:1fr;   /* 1列にする */
    gap:28px;
    padding:32px 22px;
    border-radius:24px;
  }

  .ori-care-text{
    text-align:center;
  }

  .ori-care-text span{
    font-size:20px;
  }

  .ori-care-text h2{
    font-size:28px;
    line-height:1.5;
    margin:16px 0 24px;
  }

  .ori-care-image{
    order:2;
  }

  .ori-care-image img{
    width:100%;
    max-width:100%;
  }

}



/* ボタン */

.btn-outline{

  display:inline-flex;

  align-items:center;

  justify-content:center;

  padding:14px 28px;

  border:1px solid #2f72df;

  border-radius:40px;

  text-decoration:none;

  color:#2f72df;

  font-weight:500;

  transition:.3s;
}

.btn-outline:hover{

  background:#2f72df;

  color:#fff;
}

/* レスポンシブ */

@media(max-width:960px){

  .vitalplus-box{

    grid-template-columns:1fr;

    padding:40px 30px;
  }

  .vitalplus-text h2{

    font-size:30px;
  }

}



/* MERIT */

.merit{

  background:#f8fbff;

  padding:70px 40px;
}

.merit-grid{

  max-width:1400px;

  margin:auto;

  display:grid;

  grid-template-columns:repeat(4,1fr);

  gap:24px;
}

.merit-card{

  background:#fff;

  border-radius:24px;

  overflow:hidden;

  transition:.3s;
}

.merit-card:hover{

  transform:translateY(-6px);

  box-shadow:
  0 12px 30px rgba(0,0,0,0.06);
}

.merit-card img{

  width:100%;

  display:block;
}


.merit-content{

  padding:12px 24px 20px;
}


/* タブレット */

@media(max-width:1200px){

  .merit-grid{

    grid-template-columns:repeat(2,1fr);
  }

}

/* スマホ */

@media(max-width:768px){

  .merit-grid{

    grid-template-columns:1fr;
  }

}



/* ABOUT */

.about{

  padding:60px 40px 30px;
}

.about-inner{
  max-width:1200px;
  margin:auto;

  display:grid;
  grid-template-columns:1.3fr 1fr;

  gap:60px;

  align-items:center;
}

.about-text span{
  color:#6b94dd;
  font-size:22px;
  letter-spacing:2px;
}

.about-text h2{
  font-size:35px;
  margin:16px 0 24px;
}

.about-text p{
  color:#6680aa;
}

.about-image img{
  border-radius:30px;
}


/* CONTACT */

.contact{

  background:#f7fbff;

  text-align:center;

  border-radius:40px;

  max-width:1200px;

  margin:20px auto 60px;

  padding:30px 40px;
}


.contact h2{
  font-size:32px;
  margin-top:0;
  margin-bottom:12px;
}

.contact p{
  color:#6680aa;
  margin-bottom:40px;
}


/* プライバシーポリシー経由の案内文 */
.privacy-note{
  margin:20px 0 30px;
  padding:14px 18px;
  background:#f1f7ff;
  border:1px solid #cfe0fb;
  border-radius:12px;
  color:#2369dc;
  font-size:14px;
  line-height:1.8;
}

/* スマホ */
@media (max-width: 767px){
  .privacy-note{
    margin:16px 0 24px;
    padding:12px 14px;
    font-size:13px;
    line-height:1.8;
  }
}


/* FOOTER */

footer{

  text-align:center;

  padding:15px 20px;

  background:#4f77c6;

  color:#fff;

  font-size:14px;
}

.footer-policy{

  color:#fff;

  text-decoration:none;
}

.footer-policy:hover{

  text-decoration:underline;
}

.footer-separator{

  margin:0 10px;

  opacity:.7;
}

.footer-mail-icon {
  width:18px; /* 必要に応じて調整 */
  height:18px;
  object-fit:contain;
  display:block;
}


/* MOBILE */

@media(max-width:960px){

  nav{
    display:none;
  }

  .contact-btn{
    display:none;
  }

  .header-inner{
    height:90px;
    padding:0 20px;
  }

  .main-logo{
    width:180px;
  }

  .hero{
    padding-top:140px;
  }

  .hero-inner,
  .about-inner,
  .service-grid,
  .merit-grid{
    grid-template-columns:1fr;
  }

  .hero-text h1{
    font-size:42px;
  }

  .section-title h2,
  .about-text h2,
  .contact h2{
    font-size:30px;
  }

}



/* ここからSERVICE PAGE */

.service-hero{

  padding-top:100px;
  padding-bottom:60px;
  min-height:500px;
  background:
  linear-gradient(
  180deg,
  #f7fbff 0%,
  #ffffff 100%
  );
}

.service-about{

  max-width:1200px;

  margin:auto;

  display:grid;

  grid-template-columns:1fr 1fr;

  gap:60px;

  align-items:center;
}

.service-about img{

  width:100%;

  border-radius:30px;
}

.service-flow{

  max-width:1200px;

  margin:auto;

  text-align:center;
}

.service-flow img{

  width:100%;

  max-width:900px;
}

.facility-grid{

  max-width:1200px;

  margin:auto;

  display:grid;

  grid-template-columns:repeat(3,1fr);

  gap:30px;
}

.facility-card{

  position:relative;

  border-radius:24px;

  overflow:hidden;

  box-shadow:
  0 8px 20px rgba(0,0,0,.05);
}

.facility-card img{

  width:100%;
}

.facility-card h3{

  position:absolute;

  left:0;

  right:0;

  bottom:15px;

  margin:0;

  padding:16px;

  text-align:center;

  color:#16305f;

  font-size:20px;

  font-weight:700;

}

.faq{

  max-width:1000px;

  margin:auto;
}

.faq details{

  background:#fff;

  border:1px solid #edf2fa;

  border-radius:18px;

  margin-bottom:15px;

  padding:20px;
}

.faq summary{

  cursor:pointer;

  font-weight:600;
}

@media(max-width:960px){

  .service-about{

    grid-template-columns:1fr;
  }

  .facility-grid{

    grid-template-columns:1fr;
  }

}


/* SERVICE HERO */

.service-hero{

  position:relative;

  min-height:450px;

  display:flex;

  align-items:center;

  background-image:
  url("images/service/service-hero.jpg");

  background-size:cover;

  background-position:center;

  overflow:hidden;
}

/* 左側を少し白くする */

.service-hero::before{

  content:"";

  position:absolute;

  inset:0;

  background:
  linear-gradient(
    90deg,
    rgba(255,255,255,0.88) 0%,
    rgba(255,255,255,0.78) 35%,
    rgba(255,255,255,0.30) 60%,
    rgba(255,255,255,0.00) 100%
  );
}

/* 文字エリア */

.service-hero-content{

  position:relative;

  z-index:2;

  max-width:650px;

  margin-left:3%;

  padding:20px 40px;
}

/* SERVICE */

.service-hero span{

  color:#2c6dde;

  font-size:20px;

  letter-spacing:4px;

  font-weight:600;
}

/* タイトル */

.service-hero h1{

  font-size:50px;

  line-height:1.25;

  color:#16305f;

  margin:20px 0 30px;

  font-weight:700;
}

/* 説明 */

.service-hero p{

  font-size:20px;

  line-height:2;

  color:#334f7d;

  margin-bottom:40px;
}


/* SERVICE LIST */

.service-list{

  list-style:none;

  padding:0;

  margin-top:25px;
}

.service-list li{

  position:relative;

  padding-left:40px;

  margin-bottom:18px;

  color:#334f7d;

  line-height:1.8;
}

.service-list li::before{

  content:"✓";

  position:absolute;

  left:0;

  top:2px;

  width:27px;

  height:27px;

  background:#2c7ee7;

  color:#fff;

  border-radius:50%;

  text-align:center;

  line-height:28px;

  font-size:16px;

  font-weight:bold;
}

/* ボタン */

.service-hero .btn-primary{

  font-size:18px;
}


/* SERVICE SENSOR SHOWCASE */
.sensor-showcase {
  background: #f8fbff;
  padding: 20px 40px;
}

.sensor-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px;
  max-width: 1200px;
  margin: auto;
}

.sensor-card {

  padding: 15px;

  text-align: center;

  background:#fff;

  border-radius:24px;

  border:1px solid #edf2fa;

  box-shadow:
  0 8px 20px rgba(0,0,0,.05);

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  transition: .3s;
}

.sensor-card:hover{

  transform: translateY(-6px);

  box-shadow:
  0 15px 35px rgba(0,0,0,.08);
}

.sensor-image{

  height:180px;

  display:flex;

  align-items:center;

  justify-content:center;

  margin-bottom:10px;

  background:
  linear-gradient(
    180deg,
    #f8fbff 0%,
    #ffffff 100%
  );

  border-radius:20px;

  padding:10px;
}

.sensor-icon{

  width:100%;
  height:170px;

  object-fit:contain;

  filter: /* 画像に立体感をつける */
  drop-shadow(
    0 8px 15px rgba(0,0,0,.12)
  );
}

.sensor-card h3 {

  min-height:70px;

  display:flex;

  align-items:center;

  justify-content:center;

  font-size:20px;

  font-weight:700;

  color:#16305f;

  margin-top:0;
}

.sensor-card p {
  color: #6680aa;
  font-size: 16px;
  line-height: 1.3; /* 行間も少し詰める */
  text-align: left;
}


@media (max-width: 960px) {
  .sensor-grid {
    grid-template-columns: 1fr 1fr;
  }
}



/* SERVICE FLOW */
/* =========================
   FLOW
========================= */
.flow{
  padding:80px 40px 40px;
}

.flow-steps{
  max-width:1300px;
  margin:50px auto 0;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  gap:18px;
  flex-wrap:nowrap;
}

.flow-step{
  flex:1;
  max-width:220px;
  text-align:center;
}

.flow-icon{
  width:170px;
  height:170px;
  margin:0 auto 0px;
  border-radius:50%;
  background:#f7fbff;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  box-shadow:0 8px 24px rgba(92, 137, 216, 0.08);
}

.flow-icon img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}

.flow-step h3{
  font-size:22px;
  color:#16305f;
  margin-bottom:12px;
  line-height:1.5;
  font-weight:700;
}

.flow-step p{
  font-size:14px;
  line-height:1.9;
  color:#5f7597;
}

.flow-arrow{
  flex-shrink:0;
  font-size:28px;
  color:#7aa4e8;
  line-height:120px;
  margin-top:0;
  font-weight:500;
}

/* =========================
   FACILITY / FAQ
========================= */
.facility{
  padding-top:40px;
}

.faq{
  padding-top:20px;
}

/* =========================
   FLOW - Tablet
========================= */
@media (max-width: 1100px){

  .flow{
    padding:70px 24px 30px;
  }

  .flow-steps{
    gap:12px;
  }

  .flow-step{
    max-width:180px;
  }

  .flow-icon{
    width:100px;
    height:100px;
    margin-bottom:16px;
    padding:18px;
  }

  .flow-step h3{
    font-size:18px;
  }

  .flow-step p{
    font-size:13px;
    line-height:1.8;
  }

  .flow-arrow{
    font-size:22px;
    line-height:100px;
  }
}

/* =========================
   FLOW - SP
========================= */
@media (max-width: 767px){

  .flow{
    padding:60px 20px 20px;
  }

  .flow-steps{
    flex-direction:column;
    align-items:stretch;
    gap:14px;
    margin-top:36px;
  }

  .flow-step{
    max-width:100%;
    background:#f7fbff;
    border-radius:24px;
    padding:24px 20px;
  }

  .flow-icon{
    width:100px;
    height:100px;
    margin:0 auto 14px;
    background:#fff;
    padding:16px;
    box-shadow:none;
  }

  .flow-step h3{
    font-size:18px;
    margin-bottom:10px;
  }

  .flow-step p{
    font-size:14px;
    line-height:1.8;
  }

  .flow-arrow{
    line-height:1;
    font-size:24px;
    margin:0 auto;
    transform:rotate(90deg);
  }

  .facility{
    padding-top:30px;
  }

  .faq{
    padding-top:10px;
  }
}


/*ここから会社概要*/
/* COMPANY HERO */



.company-hero span{

  color:#6b94dd;

  font-size:22px;
}

.company-hero h1{

  font-size:64px;

  color:#16305f;

  margin:20px 0;
}

.company-hero p{

  color:#6680aa;

  font-size:20px;

  line-height:2;
}

/* COMPANY HERO 2 */

.company-hero{

  position:relative;

  min-height:550px;

  display:flex;

  align-items:center;

  background-image:
  url("images/company/company-hero.png");

  background-size:cover;

  background-position:center;

  overflow:hidden;
}

/* 左側を少し白くする */

.company-hero::before{

  content:"";

  position:absolute;

  inset:0;

  background:
  linear-gradient(
    90deg,
    rgba(255,255,255,0.88) 0%,
    rgba(255,255,255,0.78) 35%,
    rgba(255,255,255,0.30) 60%,
    rgba(255,255,255,0.00) 100%
  );
}

/* 文字エリア */

.company-hero-content{

  position:relative;

  z-index:2;

  max-width:650px;

  margin-left:3%;

  padding:20px 40px;
}



.company-hero-inner{

  max-width:1300px;

  margin:auto;

  display:flex;

  align-items:center;

  justify-content:space-between;

  gap:60px;
}

.company-text{

  flex:1;
}

.company-hero-content span{

  color:#6b94dd;

  font-size:22px;

  letter-spacing:2px;
}

.company-hero-content h1{

  font-size:40px;

  line-height:1.3;

  color:#16305f;

  margin:20px 0 30px;
}

.company-hero-content p{

  color:#6680aa;

  font-size:20px;

  line-height:2;
}

.company-image{

  flex:1;

  text-align:center;
}

.company-image img{

  width:100%;

  max-width:550px;
}

/* ABOUT */

.about-content{

  max-width:900px;

  margin:auto;

  text-align:center;

  line-height:2.2;

  color:#555;
}

/* PHILOSOPHY */

.philosophy-message{        /* 企業理念の下のキャッチ */

  text-align:center;

  font-size:30px;

  color:#16305f;

  margin-bottom:35px;

  line-height:1.8;
}


.philosophy-grid{

  max-width:1200px;
  min-height: 170px; /* 最低でも400pxの高さを確保。文字が増えれば伸びる */
  margin:auto;

  display:grid;

  grid-template-columns:repeat(3,1fr);

  gap:30px;
}

.philosophy-card{

  background:#fff;

  padding:10px 30px;

  border-radius:20px;

  text-align:center;

  box-shadow:
  0 8px 20px rgba(0,0,0,.05);

  transition:.3s;
}

.philosophy-card:hover{

  transform:translateY(-5px);


}


/* PHILOSOPHY */
.philosophy-icon{

  width:110px;

  height:110px;

  object-fit:contain;

  margin-bottom:0px;
}

.philosophy-card{

  text-align:center;
}

.philosophy-card h3{
  margin-top:0;
  margin-bottom:8px;

  color:#16305f;

  font-size:25px;
}




/* BUSINESS */

.business-grid{

  display:grid;

  grid-template-columns:repeat(3,1fr);

  gap:30px;

  max-width:1200px;

  margin:auto;
}

.business-card{

  background:#fff;

  padding:40px;

  border-radius:24px;

  box-shadow:
  0 8px 20px rgba(0,0,0,.05);

  text-align:center;
}

/* PROFILE */

.profile-table{

  width:100%;

  max-width:1000px;

  margin:auto;

  border-collapse:collapse;
}

.profile-table th{

  width:220px;

  background:#f7fbff;

  color:#16305f;

  padding:20px;
}

.profile-table td{

  padding:20px;

  border-bottom:1px solid #e5eaf3;
}




/* ACCESS */

.access-wrap{

  max-width:1200px;

  margin:auto;

  display:flex;

  gap:0px;  /* ← 地図の枠と右側の住所枠の間の余白 */

  align-items:stretch;   /* ← 左右の高さを揃えたいならこれでOK */
}

.access-map{

  flex:1.6;

  height:300px;   /* ← ここを小さくして高さを半分近くに */
  border-radius:24px;

  overflow:hidden;

  box-shadow:
  0 8px 20px rgba(0,0,0,.05);
}

.access-map iframe{

  width:100%;

  height:100%;

  border:0;
}

.access-info{

  flex:1;

  height:300px;   /* ← これを追加 */

  box-sizing:border-box;   /* ← これ重要 */

  background:#f7fbff;

  border-radius:24px;

  padding:18px 22px;   /* ← 余白を少し小さく */
  box-shadow:
  0 8px 20px rgba(0,0,0,.04);

  display:flex;

  flex-direction:column;

  justify-content:center;

}

.access-info h3{

  font-size:18px;

  color:#16305f;

  margin:0;
}

.access-info p{

  color:#555;

  line-height:1.6;

  font-size:14px;

  margin:0 0 8px;
}

.access-info p:last-child{

  margin-bottom:0;
}





/* ABOUT US */

.about{

  background:#fff;
}

.about-wrapper{

  max-width:1300px;

  margin:auto;
}

.about-body{

  display:flex;

  align-items:center;

  gap:60px;
}

.about-text{

  flex:1.4;

  color:#444;

  line-height:1.8;

  font-size:17px;
}

.about-image{

  flex:1;
}


/* 左タイトル */

.about-title{

  text-align:center;
  margin-bottom:40px;
}


.about-title span{

  color:#6b94dd;

  font-size:22px;

  letter-spacing:2px;
}

.about-title h2{

  margin-top:15px;

  color:#16305f;

  font-size:40px;

  line-height:1.4;
}


/* 右画像 */

.about-image img{

  width:100%;

  border-radius:20px;

}


/* ここからお知らせページ */

/* =========================
   NEWS PAGE
========================= */

/* HERO */
.news-hero{
  padding:120px 40px 80px;
  background:
    linear-gradient(
      180deg,
      #f7fbff 0%,
      #ffffff 100%
    );
  text-align:center;
}

.news-hero-inner{
  max-width:900px;
  margin:auto;
}

.news-hero span{
  color:#6b94dd;
  font-size:22px;
  letter-spacing:2px;
}

.news-hero h1{
  font-size:52px;
  color:#16305f;
  margin:18px 0 16px;
}

.news-hero p{
  color:#6680aa;
  font-size:18px;
  line-height:1.9;
}

/* LIST SECTION */
.news-list-section{
  padding:0px 40px 80px;
  background:#fff;
}


.news-list-section .section-title h2{
  font-size:28px;
  margin-top:2px;
}

.news-list{
  max-width:1000px;
  margin:auto;
  display:flex;
  flex-direction:column;
  gap:18px;
}

/* CARD */
.news-card{
  background:#fff;
  border:1px solid #e7eef9;
  border-radius:22px;
  padding:24px 28px;
  box-shadow:0 8px 20px rgba(0,0,0,.04);
}

.news-meta{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:10px;
  flex-wrap:wrap;
}

.news-date{
  color:#6b94dd;
  font-size:14px;
  font-weight:600;
}

.news-category{
  display:inline-block;
  background:#f0f6ff;
  color:#4f77c6;
  font-size:13px;
  padding:4px 10px;
  border-radius:999px;
}

.news-title{
  font-size:24px;
  color:#16305f;
  margin:0 0 10px;
  line-height:1.5;
}

.news-text{
  color:#555;
  font-size:15px;
  line-height:1.9;
  margin:0;
}

.news-link{
  display:inline-block;
  margin-top:14px;
  color:#4f77c6;
  text-decoration:none;
  font-weight:600;
  transition:.3s;
}

.news-link:hover{
  opacity:.7;
}


/* =========================
   NEWS PAGE SP
========================= */
@media (max-width: 768px){

  .news-hero{
    padding:150px 20px 60px;
  }

  .news-hero h1{
    font-size:38px;
  }

  .news-hero p{
    font-size:16px;
  }

  .news-list-section{
    padding:40px 20px 60px;
  }

  .news-card{
    padding:20px 18px;
  }

  .news-title{
    font-size:20px;
  }

  .news-text{
    font-size:14px;
    line-height:1.8;
  }

}



/* ここから問合せフォーム(上部に一部あり) */
/* CONTACT HERO */

.contact-hero{

  padding:120px 40px 80px;

  background:
  linear-gradient(
    180deg,
    #f7fbff 0%,
    #ffffff 100%
  );

  text-align:center;
}

.contact-hero span{

  color:#6b94dd;

  font-size:22px;

  letter-spacing:2px;
}

.contact-hero h1{

  font-size:48px;

  color:#16305f;

  margin:15px 0;
}

/* お問い合わせ説明文だけに適用 */
.contact-lead{
  color:#6680aa;
  line-height:2;
  margin:0 auto;
}

/* 必須マーク */
.contact-lead .required{
  color:#ff5b5b;
  font-weight:700;
}

/* プライバシーポリシー経由の案内文 */
.privacy-note{
  display:block;
  margin:24px auto 0;
  padding:14px 18px;
  max-width:760px;
  background:#f1f7ff;
  border:1px solid #cfe0fb;
  border-radius:12px;
  color:#2369dc;
  font-size:14px;
  line-height:1.8;
  text-align:center;
  box-sizing:border-box;
}

/* スマホ */
@media (max-width: 767px){

  .contact-hero{
    padding:100px 20px 60px;
  }

  .contact-hero span{
    font-size:18px;
  }

  .contact-hero h1{
    font-size:34px;
  }

  .contact-lead{
    font-size:14px;
    line-height:1.9;
  }

  .privacy-note{
    margin:18px 0 0;
    padding:12px 14px;
    font-size:13px;
    line-height:1.8;
  }
}


/* CONTACTとFORMの余白を、ここだけ少なくする */
.contact-form-section{

  padding-top:0px;
}

.contact-note{

  margin-top:20px;

  font-size:14px;

  color:#666;
}

.contact-note .required{

  color:#ff5b5b;

  font-weight:700;
}

.form-group{

  margin-bottom:24px;
}

.form-group label{

  display:block;

  margin-bottom:10px;

  font-weight:700;

  color:#16305f;
}

.required{

  color:#ff5b5b;
}

.form-group input,
.form-group select,
.form-group textarea{

  width:100%;

  padding:16px;

  border:1px solid #dbe5f5;

  border-radius:12px;

  font-size:16px;

  box-sizing:border-box;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{

  outline:none;

  border-color:#6b94dd;
}

.privacy{

  margin:30px 0;

  text-align:center;
}

.submit-btn{

  width:100%;

  padding:18px;

  border:none;

  border-radius:999px;

  background:#6b94dd;

  color:#fff;

  font-size:18px;

  font-weight:700;

  cursor:pointer;

  transition:.3s;
}

.submit-btn:hover{

  background:#547fcd;
}



/* プライバシーポリシーのページ */
/* PRIVACY HERO */

.privacy-hero{

  padding:180px 40px 10px;

  background:
  linear-gradient(
    180deg,
    #f7fbff 0%,
    #ffffff 100%
  );

  text-align:center;
}

.privacy-hero span{

  color:#6b94dd;

  font-size:22px;

  letter-spacing:2px;
}

.privacy-hero h1{

  font-size:40px;

  color:#16305f;

  margin:20px 0;
}

.privacy-hero p{

  color:#6680aa;

  font-size:18px;
}


/* PRIVACY */

.privacy{

  padding:0px 40px 80px;
}

.privacy-container{

  max-width:750px;

  margin:auto;

  background:#fff;

  padding:60px;

  border-radius:24px;

  box-shadow:
  0 8px 20px rgba(0,0,0,.05);

  text-align:left;  /* ←追加 */
}

.privacy-container h2{

  text-align:center;

  color:#16305f;

  font-size:30px;

  margin-top:0;

  margin-bottom:30px;
}

.privacy-container h3{

  color:#16305f;

  font-size:24px;

  margin-top:50px;

  margin-bottom:20px;

  padding-left:16px;

  border-left:4px solid #6b94dd;
}

.privacy-container p{

  color:#555;

  line-height:2;
}

.privacy-container ul{

  padding-left:24px;

  color:#555;

  line-height:2;
}

.privacy-contact{

  margin-top:20px;

  padding:30px;

  background:#f7fbff;

  border-radius:16px;
}


/* SP */

@media(max-width:768px){

  .privacy-hero h1{

    font-size:40px;
  }

  .privacy-container{

    padding:35px;
  }

}




/* 問合せ送信後に表示される画面 */
/* THANKS */

.thanks{

  min-height:100vh;

  display:flex;

  justify-content:center;

  align-items:center;

  padding:40px;

  background:
  linear-gradient(
    180deg,
    #f7fbff 0%,
    #ffffff 100%
  );
}

.thanks-box{

  max-width:700px;

  width:100%;

  background:#fff;

  padding:60px;

  border-radius:30px;

  text-align:center;

  box-shadow:
  0 8px 20px rgba(0,0,0,.05);
}

.thanks-icon{

  width:90px;

  height:90px;

  margin:auto;

  border-radius:50%;

  background:#6b94dd;

  color:#fff;

  font-size:42px;

  font-weight:700;

  display:flex;

  justify-content:center;

  align-items:center;

  margin-bottom:30px;
}

.thanks-box span{

  color:#6b94dd;

  letter-spacing:2px;

  font-size:18px;
}

.thanks-box h1{

  color:#16305f;

  font-size:42px;

  margin:20px 0 30px;
}

.thanks-box p{

  color:#6680aa;

  line-height:2;
}

.thanks-btn{

  display:inline-block;

  margin-top:40px;

  padding:16px 40px;

  border-radius:999px;

  background:#6b94dd;

  color:#fff;

  text-decoration:none;

  font-weight:700;

  transition:.3s;
}

.thanks-btn:hover{

  background:#547fcd;
}


