@charset "UTF-8";

/* 共通部分 */
html {
  font-size: 100%;
}
body {
  font-family: "Yu Gothic Medium", "游ゴシック Medium",
    YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", sans-serif;
  line-height: 1.7;
color: #555;
}
main{padding-top: 100px;}
a {
  text-decoration: none;
}
img {
  max-width: 100%;
  height: auto;
}
p{font-size: 18px;}

.mt30{margin-top: 30px;}
.mb0{margin-bottom: 0!important;}

/* レイアウト共通 */
.wrapper {
  margin: 0 auto;
  padding: 0;
  max-width: 1300px;
}


.section-container {
    max-width: 1100px;
    margin: 60px auto 100px;
    padding: 0 30px;

}


.section-title {
    font-size: 24px;
    font-weight: 700;
    color: #333;
    margin:60px 0 30px 0;
    padding-left: 15px;
    border-left: 5px solid #00A0E9;
}

.bulletpoints-icon-title {
    display: flex;
    align-items: center;
    font-size: 20px;
    font-weight: bold;
    color: #333;
    margin-bottom: 10px;
}

.bulletpoints-icon {
    width: 18px;
    height: 18px;
    background-color: #2196F3;
    border-radius: 50%;
    margin-right: 12px;
    flex-shrink: 0;
}

.bulletpoints-description {
    line-height: 1.8;
    margin-bottom: 20px;
    margin-left: 30px;
}

.bulletpoints-list {
    list-style: none;
    background: #d6efff;
    padding: 30px;
    border-radius: 20px;
}

.bulletpoints-list li {
    font-size: 18px;
    line-height: 1.8;
    margin-bottom: 12px;
    padding-left: 20px;
    position: relative;
}

.bulletpoints-list li:before {
    content: "•";
    position: absolute;
    left: 0;
    color: #333;
    font-weight: bold;
}

.bulletpoints-list li:last-child {
    margin-bottom: 0;
}

img.photo{
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);}
.float-img {
  float: right;
  margin: 0 0 16px 40px;

}




/* ヘッダー */
.header {
  background: #fff;
  box-shadow: 0px 10px 10px -5px rgba(0,0,0,0.2);
}
.header {
position: fixed;
    width: 100%;
    z-index: 1000;
}
.header-inner {
  max-width: 1300px;
  margin: 0 auto;
  padding: 20px 8px;
  display: flex;
  align-items: center;
justify-content: flex-end;
}

.logo {
  margin-right: auto;
}
.header-logo {
  width: 250px;
  display: block; /* 画像下の余白対策 */
}
.instagram{margin-left: 20px;}
.instagram img{width: 36px;}

  .hamburger {
    display: none;
  }

  .main-nav {
    display: flex;
  }

  .main-nav > li {
    position: relative;
  }

  .main-nav > li > a {
    padding: 10px 20px;
    display: block;
  }

.main-nav {
  display: flex;
  font-size: 20px;
  list-style: none;
  gap: 1px;
  padding: 0;
  margin: 0;
}

.main-nav a {
  font-size: 20px;
  color: #5E5E5E;
  font-weight: 400;
}
.main-nav a:hover {
  color: #0bd;
}


.submenu {
  overflow: hidden;
  max-height: 0;
  border: none;
  transition: max-height 0.3s ease;
}










/* ファーストビュー */

.first-view {
  position: relative;
  width: 100%;
  overflow: hidden;
  aspect-ratio: 16 / 6;
}
.first-view::before {
  content: "";
  display: block;
  padding-top: 56.25%; /* 16:9 */
}



.first-view img {
  position: absolute;
  inset: 0;
  width: 100%;

  object-fit: cover;
}


.fv-img {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  animation: fade 15s infinite;
}

/* 1枚目 */
.fv-img:nth-child(1) {
  animation-delay: 0s;
}

/* 2枚目 */
.fv-img:nth-child(2) {
  animation-delay: 5s;
}

/* 3枚目 */
.fv-img:nth-child(3) {
  animation-delay: 10s;
}

@keyframes fade {
  0%   { opacity: 0; }
  10%  { opacity: 1; }
  30%  { opacity: 1; }
  40%  { opacity: 0; }
  100% { opacity: 0; }
}








/* メッセージ */

.messager_inner {
padding: 80px 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 40px;
}

.intro-text h2 {
  font-size: 28px;
  color: #333;
  margin-bottom: 30px;
  font-weight: 400;
}

.about-us-button {
    display: inline-block;
    background: #0099ff;
    color: white;
    padding: 12px 30px;
    border-radius: 40px;
    text-decoration: none;
    font-size: 20px;
    transition: background 0.3s;
}

.about-us-button:hover {
    background: #0088ee;
}

.message-image {
    width: 400px;
    border-radius: 20px;
}


/* Services Section */
.services {
    
    background:#FFFEEF;
}
.services-inner{
    max-width: 1300px;
    padding: 80px 10px;
    margin: 0 auto;
}


.service-header {
    width: 798px;
    max-width: 100%;
    height: 58px;

    margin: 0 auto 40px;

    color: #0E93FF;
    font-family: Inter;
    font-size: 18px;
    font-weight: 500;

    border: 2px solid #0E93FF;
    border-radius: 10px;
    background: #FFF;

    display: flex;
    align-items: center;
    justify-content: center;
}

.services-header h2, .news h2 {
    font-size: 40px;
    color: #0099ff;
    margin-bottom: 15px;
    text-align: center;
}

.services-header p {
    
    font-size: 20px;
    text-align: center;
}

.services-container {
    max-width: 1200px;
    margin: 0 auto;
}

.service-category {
    max-width: 900px;
    margin: 40px auto;
}

.service-category h3 {
    color: #0099ff;
    font-size: 20px;
    margin-bottom: 30px;
    text-align: center;
}

.service-card {
    width: 329px;
    background: white;
    border-radius: 21px;
    border: 2px solid #CACACA;
    position: relative;
    margin: 0 auto;
}

.service-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    justify-content: center; 
    
}

.service-card-image {
    width: 100%;
    position: relative;
}

.service-card-image img {
    width: 100%;
    height: 100%;
    display: block;
    border-radius: 20px 20px 0 0;
}

.service-badge {
    position: absolute;
    top: -30px;
    right: 10px;

    width: 111px;
    height: 111px;
    border-radius: 50%;   /* 正円 */

    background: #0099ff;
    color: #fff;

    display: flex;        /* 中央寄せの要 */
    align-items: center;  /* 縦中央 */
    justify-content: center; /* 横中央 */

    font-size: 20px;
    font-weight: 500;
    text-align: center;
    line-height: 1.3;
}

.service-card-content {
    padding: 40px;
}

.service-card-content p {
    
    margin-bottom: 30px;
    line-height: 1.6;
}

.service-card-button {
    display: block;
    background: #0099ff;
    color: white;
    text-align: center;
    padding: 10px;
    border-radius: 40px;
    text-decoration: none;
    font-size: 20px;
    transition: background 0.3s;
}

.service-card-button:hover {
    background: #0088ee;
}

/* Care Management Section */

/* .care-management {
    border: 2px solid #00cc44;
    border-radius: 5px;
    padding: 40px 30px;
} 
*/

.care-management .service-header {
   color: #10BD00;
   border: 2px solid #10BD00;
}

.care-card {
    width: 329px;
    margin: 0 auto;
    background: white;
    border-radius: 10px;
    border-radius: 21px;
    border: 2px solid #CACACA;
}

.care-card-image {
    width: 100%;
    position: relative;
}

.care-card-image img {
    width: 100%;
    height: 100%;
    border-radius: 20px 20px 0 0;
    display: block;
}

.care-badge {
    position: absolute;
    top: -30px;
    right: 10px;

    width: 111px;
    height: 111px;
    border-radius: 50%;   /* 正円 */

    background: #00cc44;
    color: #fff;

    display: flex;        /* 中央寄せ */
    align-items: center;  /* 縦中央 */
    justify-content: center; /* 横中央 */

    font-size: 20px;
    font-weight: 500;
    text-align: center;
    line-height: 1.3;
}

.care-card-content {
    padding: 40px;
}

.care-card-content p {
    
    margin-bottom: 20px;
}

.care-card-button {
    display: block;
    background: #00cc44;
    color: white;
    text-align: center;
    padding: 10px;
    border-radius: 40px;
    text-decoration: none;
    font-size: 20px;
    transition: background 0.3s;
}

.care-card-button:hover {
    background: #00bb33;
}

/*　お知らせ　*/
.news-container {
  padding: 80px 30px;
}

.news-title {
  text-align: center;
  font-size: 18px;
}
.news-list {
    max-width: 900px;
    margin: 0 auto;
}
.news-item {
    display: flex;
    align-items: center;
    padding: 20px 0;
    border-bottom: 1px solid #e0e0e0;
    gap: 20px;
}

.news-item:first-child {
    border-top: 1px solid #e0e0e0;
}

.news-date {
    font-size: 16px;
    
    min-width: 100px;
}

.news-category {
    display: inline-block;
    padding: 4px 12px;
    background-color: #EFF8FF;
    color: #0E93FF;
    font-size: 13px;
    border-radius: 20px;
    min-width: 80px;
    text-align: center;
}

.info_ins img{position:absolute;}


/*　採用情報　*/
.recruitment {
    background: linear-gradient(135deg, #0099ff 0%, #66ccff 100%);
    padding: 0px;
    color: white;
    position: relative;
}

.recruitment-content {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 60px;
    flex-wrap: wrap;
}
.recruitment-text{
  padding: 30px;
}
.recruitment-text h2 {
    color: #fff;   /* ← これを追加 */
    font-size: 40px;
    margin-bottom: 20px;
    font-weight: 400;
}

.recruitment-text p {
    font-size: 24px;
    margin-bottom: 30px;
    line-height: 1.8;
}

.recruitment-button {
    display: inline-block;
    background: white;
    color: #0099ff;
    padding: 12px 30px;
    border-radius: 42px;
    text-decoration: none;
    font-size: 20px;
    transition: background 0.3s;
}

.recruitment-button:hover {
    background: #f0f0f0;
}

.recruit-image {
    flex-shrink: 0;
    width: 400px;
    margin: 20px;

}

/* フッター */
footer {
    background: #f5f5f5;
    padding: 40px 20px;
}

.footer-container {
    max-width: 1200px;
    margin: 0 auto;
}

.footer-main {
    display: flex;
    justify-content: space-between;
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid #ddd;
    flex-wrap: wrap;
}

.footer-logo {
    display: flex;
    flex-direction: column; /* 縦並び */
    align-items: flex-start; /* 左揃え（中央にしたいなら center） */
}

.footer-logo-image{
  width: 280px;
  height: auto;
}

.footer-logo-text {
    margin-top: 8px;
}



.footer-bottom {
    display: flex;
    gap: 30px;
    justify-content: center;
}

.footer-bottom a {
    color: #666;
    text-decoration:underline;
}

.footer-bottom a:hover {
    color: #0099ff;
}


.sitemap__list{width: 300px;
margin: 10px auto;}
.sitemap__sublist{margin-left: 30px;}


/* 中ページ共通 */
main.about{margin-bottom: 100px;}


.page-title{max-width: 1100px;
margin: 60px auto;}
.page-title__container{

    background: #0E93FF;
    border-radius: 999px;
    padding: 14px 0;
    margin: 0 20px;


    
    

}


.page-title__text { 
    margin: 0;
    color: #fff;
    font-size: 28px;
    padding-left: 32px;
    text-align: left;
}


/* about */
.about p{
    margin-bottom: 20px;
    line-height: 2.2;
}
.greeting-company {
    font-size: 16px;
}
.greeting-company{margin-bottom: 0!important;}
.greeting-name-main {
    font-size: 20px;
    font-weight: 700;
    margin-left: 10px;
}

.greeting-body img{
    width: 220px;
}
.about-body img{
    width: 350px;
}
.service-section {
    margin-bottom: 40px;
}
.sienhiseido {
    font-size: 14px;
}
.service-section a{
    display: inline-block;
    color: #fff;
    background: #0088ee;
    padding: 10px 30px;
    border-radius: 30px;
    margin: 20px;
}

.greeting-c{
    clear: both;
    text-align: right;
}



/* company */
.gaiyou-content {
    display: flex;
    gap: 30px;
    align-items: flex-start;
}
.company table, .housekeeper table, .recruit table{
    flex: 1;
    border-collapse: collapse;
    background-color: #fff;
    margin-bottom: 30px;
    width: 100%;
    font-size: 18px;
}
.company table th,
.company table td ,.housekeeper table th,.housekeeper table td, .recruit table th, .recruit table td{
    padding: 15px 20px;
    border: 1px solid #e0e0e0;
    text-align: left;
}
.company table th,.housekeeper table th , .recruit table th{
    background-color: #E3F2FD;
    font-weight: bold;
    width: 200px;
    color: #333;
}

.gaiyou-photo {
    display: flex;
    flex-direction: column;
    gap: 15px;
    width: 250px;
    flex-shrink: 0;
}
.company .bulletpoints-icon-title{
    margin-top: 0;
    margin-bottom: 10px;
}
.section-box{display: flex;
flex-wrap: wrap;}

.office-info{width: 46%;
margin: 4px 2%;}
.access-heading {
    font-weight: bold;
    margin-top: 25px;
    margin-bottom: 10px;
}
.access-route-title {
    font-weight: 700;
    font-size: 16px;

}
.access-text{margin-bottom: 10px;}

.service-block{margin: 30px 0 60px;}


.service-text{margin-bottom: 10px;}

.houmon_book{
    background: #d6efff;
    padding: 30px;
    border-radius: 20px;

}
.houmon-list{
    font-size: 18px;
    margin-left: 40px;
    margin-bottom: 30px;
}
.houmon2{padding: 20px 10px;
border: #a7a7a7 1px solid;
border-radius: 10px;
margin: 30px 0;}
.houmon h4{

    background: #0099ff;
    color: white;
    padding: 10px 20px;
    border-radius: 40px;
    font-size: 18px;
    display:inline-block;}
.houmon span{font-weight: bold;}
.houmon2 .service-text{
    padding: 20px 0;
}



.top .fixed-recruit {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 1000;
  transition: opacity .3s ease, transform .3s ease;
}

.fixed-recruit img{  box-shadow: 0 4px 12px rgba(0,0,0,.15);
  border-radius: 40px;
  width: 400px;}

.fixed-recruit.is-hide{
  opacity: 0;
  transform: translateY(10px);
  pointer-events: none !important;
}


.date-info{text-align: right;}
.note-text{font-weight: bold;
margin-top: 30px;}
.terms-list{margin-left: 30px;
margin-top: 20px;}
.terms-list li{margin-bottom: 10px;}



.price-table-container {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.price-table-container table {
  min-width: 800px;
  border-collapse: collapse;
}
.housekeeper dl{margin-top: 30px;}
.housekeeper dt{font-size: 20px;
    font-weight: bold;
    color: #0088ee;}
.housekeeper dd{
    font-size: 18px;
    margin-bottom: 20px;
}


.message-text{padding: 20px 50px;

font-size: 20px;
line-height: 2.6;}


.accordion {
  max-width: 800px;
  margin: 0 auto;
}

.accordion__title {
  text-align: center;
  font-size: 24px;
  margin-bottom: 30px;
}

.accordion__item {
  border-top: 1px dashed #ccc;
}

.accordion__item:last-child {
  border-bottom: 1px dashed #ccc;
}

.accordion__header {
  width: 100%;
  padding: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 20px;
  background: none;
  border: none;
  cursor: pointer;
}

.accordion__icon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #e0e0e0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s;
}

.accordion__content {
  overflow: hidden;
  height: 0;
  transition: height 0.3s ease;
  padding: 0 20px;
}

.accordion__item.is-open .accordion__content {

  padding-bottom: 20px;
}

.accordion__item.is-open .accordion__icon {
  transform: rotate(45deg); /* ＋ → × */
}


.job-table p{margin: 10px 0;}


.recruit ul{
    margin: 60px 30px;
    font-size: 20px;
}

.photo-row {
  display: flex;
  gap: 16px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box; /* ←超重要 */
  margin-top: 30px;
}

.photo-row img {
  flex: 1 1 0;
  min-width: 0;           /* ←flexはみ出し対策の最重要 */
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.staff-card{clear: both;
margin: 20px;
background: #f8fbff;
padding: 30px;
overflow: hidden;
border-radius: 30px;}
.staff-role{font-size: 22px;}
.staff-name{margin-bottom: 20px;}

.staff .float-img{margin: 0 0 0 40px;}




/* CTA セクション */
.cta-section{position: fixed;
bottom: 0;
left: 50%;
  transform: translateX(-50%);
}




.cta-buttons {
    width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    gap: 40px;

}
.cta-cta{background: #0088ee;
padding: 50px}
.cta-button {
    background-color: white;
    border-radius: 100px;
    padding: 10px 30px;
    display: flex;
    align-items: center;

    text-decoration: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transition: transform 0.3s, box-shadow 0.3s;
    flex-shrink: 0;
}

.cta-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
}
.cta-button-text{
  font-size: 30PX;;
}
.cta-button-text,.cta-button-content  {

    flex-direction: column;

   width: 260px;
   text-align: center;
}

.cta-button-label {
    font-size: 16px;
    font-weight: bold;
    color: #0091ff;
}

.cta-button-number {
    font-size: 20px;
    font-weight: bold;
    color: #0091ff;
}

.cta-button-apply {
    font-size: 24px;
    font-weight: bold;
    color: #0091ff;
}

.cta-icon {
    width: 50px;
    height: 50px;
    background-color: #0091ff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 24px;
    flex-shrink: 0;
}










.speechBubble {
  position: relative;
  display: inline-block;
  margin-right: 16px;
  padding: 24px;
  border-radius: 12px;
  background-color: #ffe3b7;
  text-align: left;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  color: #000000;
  margin-bottom: 20px;
}

.speechBubble::after {
  content: "";
  position: absolute;
  top: 55%;
  right: 0;
  border-style: solid;
  border-width: 16px 0 0 16px;
  border-color: transparent transparent transparent #ffe3b7;
  translate: 100% calc(-50% + 0.4px);
  transform: skew(0, -10deg);
  transform-origin: left;
}




.speechBubble2 {
  position: relative;
  display: inline-block;
  margin-left: 16px;
  padding: 24px;
  border-radius: 12px;
  background-color: #faf5ab;
  text-align: left;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  color: #000000;
  margin-bottom: 20px;
}

.speechBubble2::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  border-style: solid;
  border-width: 16px 16px 0 0;
  border-color: transparent #faf5ab transparent transparent;
  translate: -100% calc(-50% + 0.4px);
  transform: skew(0, -10deg);
  transform-origin: right;
}

















/* ============================
   プライバシーポリシー 共通レイアウト
============================ */

.privacy {
  background: #fff;
  color: #222;
  line-height: 1.9;
  font-size: 16px;
}

.privacy__header {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 40px;
  padding-bottom: 16px;
}

.privacy__title {
  font-size: 28px;
  font-weight: 700;
  text-align: center;
  margin: 0;
}

.privacy__body {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 20px 80px;
}

/* ============================
   セクション
============================ */

.privacy__section {
  margin-bottom: 48px;
}


.privacy__subheading {
  font-size: 20px;
  font-weight: 700;

}

/* ============================
   テキスト
============================ */

.privacy p {
  margin: 0 0 16px;
}

.privacy__address p {
  margin: 0 0 6px;
  font-style: normal;
}

/* ============================
   リスト
============================ */

.privacy__list {
  padding-left: 1.4em;
  margin: 8x 0 20px;
    font-size: 18px;
}

.privacy__list > li {
  margin-bottom: 8px;
}

.privacy__sublist {
  padding-left: 1.2em;
  margin-top: 8px;

}

/* ============================
   フッター（制定情報）
============================ */

.privacy__footer {
  margin-top: 64px;
  padding-top: 24px;
  border-top: 1px solid #e5e5e5;
  text-align: right;
  font-size: 14px;
  color: #555;
}

/* ============================
   リンク
============================ */

.privacy a {
  color: #f46600;
  text-decoration: underline;
}

.privacy a:hover {
  opacity: .8;
}




















/* ===== レイアウト枠 ===== */
.helper-day {
  max-width: 900px;
  margin: 0 auto;
  padding: 32px 16px;
}

.helper-day__title {
  text-align: center;
  font-size: 22px;
  letter-spacing: 0.04em;
  margin: 0 0 24px;
}

/* ===== タイムライン ===== */
.timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 14px;
}

/* 1行 = 時刻 + カード */
.timeline__item {
  position: relative;
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 14px;
}

/* 左の縦ライン（全体） */
.timeline__item::before {
  content: "";
  position: absolute;
  left: 55px;              /* time列の中心に合わせる */
  top: -12px;
  bottom: -12px;
  width: 2px;
  background: #d9e2d8;
}

/* 最初と最後だけラインを整える（任意） */
.timeline__item:first-child::before { top: 22px; }
.timeline__item:last-child::before { bottom: 22px; }

/* 時刻バッジ */
.timeline__time {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  height: 44px;
  padding: 0 14px;
  border-radius: 999px;
  background: #e8eff1;
  color: #243d5a;
  font-weight: 700;
  font-size: 18px;
}



/* カード本体 */
.timeline__body {
  background: #fff;
  border: 1px solid #e7ece7;
  border-radius: 14px;
  padding: 16px 16px 14px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.05);
}

.timeline__heading {
  font-size: 20px;
  margin: 0 0 10px;
}

/* 箇条書き */
.timeline__list {
  margin: 0;
  padding-left: 1.2em;
  color: #333;
  line-height: 1.7;
}

@media (max-width: 640px) {
  .timeline__item {
    grid-template-columns: 1fr;
    padding-left: 0; /* ← これが重要：線の分の余白 */
  }

  /* 縦線を左端に寄せる */
  .timeline__item::before {
    content: none;
    left: 0;
    top: 0;
    bottom: 0;
  }

  /* 時刻バッジを右にずらす */
  .timeline__time {
    margin-left: 0;
    margin-bottom: 8px;
    min-width: 72px; /* ← 幅確保（かぶり防止） */
  }

  /* 丸（ノード）を線の位置に固定 */
  .timeline__time::after {
    left: -24px;     /* ← 時刻の外に出す */
    top: 50%;
    bottom: auto;
    transform: translateY(-50%);
  }

  .timeline__body {
    padding: 14px 16px;
  }
 
}














/* ===== カード全体レイアウト ===== */
.value-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin: 40px 0;
}

/* ===== 1カード ===== */
.value-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 24px 22px 26px;
  text-align: center;
  box-shadow: 0 10px 24px rgba(0,0,0,0.06);
  transition: transform .2s ease, box-shadow .2s ease;
}

.value-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 30px rgba(0,0,0,0.08);
}

/* ===== 上の丸アイコン ===== */
.value-icon {
  width: 52px;
  height: 52px;
  margin: 0 auto 14px;
  border-radius: 50%;
  background: #a6daff;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ===== 数字 ===== */
.icon-number {
  font-size: 20px;
  font-weight: 700;
  color: #2f496b;
}

/* ===== タイトル ===== */
.value-title {
  font-size: 20px;
  margin: 0 0 8px;
  color: #222;
}

/* ===== 説明文 ===== */
.value-text {
  font-size: 18px;
  line-height: 1.7;
  color: #555;
  margin: 0;
}

/* ===== レスポンシブ ===== */
@media (max-width: 900px) {
  .value-list {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 520px) {
  .value-list {
    grid-template-columns: 1fr;
  }
}









.pc_on{display: block;}
.sp_on{display: none;}
.sp_ins{display: none;}





















@media screen and (max-width: 1300px) {
    .main-nav > li > a {
        padding: 10px;
    }


.recruit-image {
    flex-shrink: 0;
    width: 40%;
    margin-right: 4%;
}

}





@media screen and (min-width: 1060px) {
    .main-nav > li > a.active {
    background: #0099ff;
    border-radius: 20px;
    color: #ffffff;
  }
/* 開いた状態 */
.has-submenu.is-open .submenu {
  max-height: 300px; /* 中身より少し大きめ */
  border: 1px solid #ddd;
}
 .has-submenu:hover .submenu {
    max-height: 300px;
    border: 1px solid #ddd;
  }
  /* サブメニュー */
.submenu {
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    min-width: 200px;
    z-index: 1000;

  }

  .submenu li a {
    padding: 12px 15px;
    display: block;
    white-space: nowrap;
  }

  
 }
 





/* ============================================
ハンバーガーメニューに切り替え　
=============================================== */

@media screen and (max-width: 1060px) {
  .hamburger {
    display: block;
    background: none;
    border: none;
    cursor: pointer;
    margin-right: 20px;
  }

  .hamburger span {
    display: block;
    width: 30px;
    height: 4px;
    background: #333;
    margin: 8px 0;
  }
  .global-nav.is-open {
    display: block;
  }
    .global-nav {
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    visibility: hidden;
    transition:
      max-height 0.4s ease,
      opacity 0.3s ease;
  }

  .global-nav.is-open {
    max-height: 100vh; /* 十分大きい値 */
    opacity: 1;
    visibility: visible;
  }


  .main-nav {
    display: block;
  }

  .main-nav li a {
    padding: 15px;
    display: block;
    border-bottom: 1px solid #eee;
  }
  /* サブメニュー（SPは最初は閉じる） */
 
  .has-submenu.is-open .submenu {
    display: block;
  }

  .submenu li a {
    padding-left: 30px;
    background: #f9f9f9;
  }
  .submenu {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.3s ease;
  }

  .has-submenu.is-open .submenu {
    max-height: 300px; /* 中身より少し大きめ */
  }
  .global-nav {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: #fff;

    overflow: hidden;
    max-height: 0;
    opacity: 0;
    visibility: hidden;

    transition:
      max-height 0.4s ease,
      opacity 0.3s ease;
  }

  .global-nav.is-open {
    max-height: 100vh;
    opacity: 1;
    visibility: visible;
  }

.service-cards {
    gap:0;
    justify-content: space-around;
}


.footer-logo{
    width: 100%;
}

.company table th {
    width: 30%;

}
	.company table th, .housekeeper table th, .recruit table th{width: 30%;}
.company table th, .company table td, .housekeeper table th, .housekeeper table td, .recruit table th, .recruit table td{
	padding: 15px 10px;
	}
.message-text
 {
    padding: 20px;
    font-size: 18px;
    line-height: 2;
}
.recruitment-content {

    gap: 30px;


}

	.intro-text h2{font-size: 24px;}
.services-header h2, .news h2{font-size: 30px;}
.instagram{display: none;}
.sp_ins{display: block;
text-align: center;}
.sp_ins img{width: 40px;
}
}
@media screen and (max-width: 871px) {
  .recruitment-content{display: block;}
  .recruitment-text{text-align: center;}
      .recruit-image {
        width: 90%;
            margin: 20px 5%;
    }
}


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

.messager_inner {
flex-wrap: wrap;
}
.intro-text{
    text-align: center;
}
.message-image {
    width: 80%;
  
}

.services-inner{
    padding: 80px 20px;
}
.service-cards {
    grid-template-columns: 1fr;
    
}
.service-card,.care-card{
    margin-bottom: 40px;
    width: 100%;
}
.news-item{
    flex-wrap: wrap;
}
.news-title{width: 100%;
text-align: left;}
.footer-main{display: block;}
.footer-logo{
    width: 300px;
    margin: 0 auto;
}
.footer-info,.footer-contact{
    margin: 4px auto;
    width: 320px;
}
.float-img{
    float: none;
    width: 80%;
    margin: 10px 10%;
    text-align: center;
}

.gaiyou-content,.section-box {
    flex-direction: column;

}
.gaiyou-image{width: 100%;}
.gaiyou-image img{margin: 10px auto;}
.office-info {
    width: 96%;
    margin: 4px 2%;
}
.company table th,.company table td {
    padding: 15px 10px;


}



  .cta-buttons {
    flex-direction: column;
    gap: 12px;
  }

  .cta-button {
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
  }

.pc_on{display: none;}
.sp_on{display: block;}

.top .fixed-recruit.sp_on {
  position: fixed;
  width: 100%;
  right: 0;
  bottom: -12px;
  z-index: 1000;
  transition: opacity .3s ease, transform .3s ease;
}
.fixed-recruit.sp_on img{  box-shadow: 0 4px 12px rgba(0,0,0,.15);
  border-radius: 0;
  width: 100%;}


.top_footer {
  padding-bottom: 120px;
}


.recruit .cta-section .section-container{
  margin: 60px auto 20px;
}
.section-container .cta-button-phone{display: none;}
.cta-cta{padding: 30PX 10PX;}
.cta-button-number{font-size: 18px;}
	.service-card-content,.care-card-content{padding: 20px;}
	
	.recruitment-text h2{font-size: 30px;}
	.recruitment-text p{font-size: 20px;}
	
	
}





















#formWrap {

	margin:0 auto;
	color:#555;
	line-height:120%;
	font-size:90%;
}
table.formTable{
	width:90%;
	margin:0 auto;
	border-collapse:collapse;
}
table.formTable td,table.formTable th{
	border:1px solid #ccc;
	padding:10px;
}
table.formTable th{
	width:30%;
	font-weight:normal;
	background:#efefef;
	text-align:left;
}
input[type="text"],textarea,select{

    padding: 10px;
    margin: 10px 4px;
    border: 1px solid #A6A6A6;
    border-radius: 5px;
    box-sizing: border-box;
}
.kakunin{
    background-color: #28a745;
    color: white;
    padding: 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    width: 300px;
    display: block;
    margin: 0 auto;
}



.selectbox-3 {
    display: inline-flex;
    align-items: center;
    position: relative;
}

.selectbox-3::after {
    position: absolute;
    right: 15px;
    width: 10px;
    height: 7px;
    background-color: #535353;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    content: '';
    pointer-events: none;
}

.selectbox-3 select {
    appearance: none;
    min-width: 230px;
    height: 2.8em;
    padding: .4em calc(.8em + 30px) .4em .8em;
    border: 1px solid #d0d0d0;
    border-radius: 3px;
    background-color: #fff;
    color: #333333;
    font-size: 1em;
    cursor: pointer;
}



input[type="radio"]{
  -webkit-appearance: none;
  appearance: none;

  width: 18px;
  height: 18px;
  border-radius: 50%;

  border: 2px solid #e0e0e0; /* ← 外枠グレーをここで変更 */
  background: #fff;
  display: inline-grid;
  place-content: center;

  transform: scale(1.5); /* そのまま使える */
  margin: 0;
}

input[type="radio"]::before{
  content: "";
  width: 12px;
  height: 12px;
  border-radius: 50%;
  transform: scale(0);
  transition: transform .12s ease-in-out;
  background: #0E93FF; /* ← 中の点（選択色） */
}

input[type="radio"]:checked{
  border-color: #e0e0e0; /* ここを #f00 にして「枠も赤」にもできる */
}

input[type="radio"]:checked::before{
  transform: scale(1);
}

input[type="radio"]:focus-visible{
  outline: 3px solid rgba(255,0,0,.25);
  outline-offset: 2px;
}
input[type="checkbox"],
input[type="radio"] {

 
	margin: 10px;
}
input.add{width: 100%}
#formWrap span{font-weight: bold;}
.form .kakunin{margin: 20px 0;}

.sender{display: flex;
  align-items: center;
  justify-content: space-between;
width: 90%;
margin: 20px auto;}
.sender .send{
    background-color: #28a745;
    color: white;
    padding: 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 20px;
    width: 240px;
    display: block;

}
.sender .send-back{background-color: #F08113;
    color: white;
    padding: 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 20px;
    width: 200px;
    display: block;}

/*　簡易版レスポンシブ用CSS（必要最低限のみとしています。ブレークポイントも含め自由に設定下さい）　*/
@media screen and (max-width:572px) {
#formWrap {
	width:100%;
	margin:0 auto;
}
table.formTable th, table.formTable td {
	width:auto;
	display:block;
}
table.formTable th {
	margin-top:5px;
	border-bottom:0;
}
form input[type="text"], form textarea {

	padding:5px;
}
form textarea{width: 90%;}

	.sender .send{ width: 160px; 
	padding: 10px;
	font-size: 16px;}
.sender .send-back{ width: 140px;
	padding: 10px;
	font-size: 16px;}
	.section-container{padding:0 20px;}
	.section-title{font-size: 20px;}
.recruit ul {
    margin: 30px 10px;
    font-size: 18px;
}
	.accordion__content{padding: 0;}
}



.rec_pc{
	display: block;
}
.rec_sp{
	display: none;
}
.first-view2{width: 100%;
max-width: 2000px;
margin: 0 auto;}
@media screen and (max-width:572px) {
	.rec_pc{
	display: none;
}
.rec_sp{
	display: block;
}
	.first-view{overflow: visible;}


}


@media (max-width: 768px) {
  .message-text {
    padding: 20px;
  }
}