/* ================================
   共通トークン・ベース
================================ */
:root {
  --blue:#6798E8;
  --pink:#FD65AB;
  --yellow:#EBA41D;
  --green:#55B76E;
  --surface:#ffffff;
  --text:#694C30;
  --muted:#E6A0D14A;
  --radius:12px;
  --shadow:0 4px 16px rgba(0,0,0,.08);
}

body {
  margin:0;
  font-family: "M PLUS 1c", sans-serif;
  background: #FBF7EB url(../images/bg_pattern.png);
  color: var(--text);
  line-height: 1.6;
}
.serif{
  font-family: "Noto Serif JP", serif;
}
img {max-width:100%; height:auto;}
a {color:var(--blue); text-decoration:none;}
a:hover {opacity:.8;}
a.phone{
  font-family: "Oswald", sans-serif;
  font-size: 42px;
  color: var(--green);
  font-weight: bold;
  letter-spacing: -1px;
  line-height: 40px;
}
a.phone img{
  width: 60px;
}
.tleft{
  text-align: left;
}
/* ================================
   Hero
================================ */
.hero-visual{ width:100%; position: relative; background: #ffffff;}
.hero-visual .nami{ width:100%; position: absolute; height: 38px; bottom: 0;background: url(../images/bg_wave.png) repeat-x bottom center; z-index: 100;}
.hero-container{ position:relative; width: 1200px; margin: 0 auto;}
.hero-photo img { width:100%; height:auto; display:block; }
.brand-right{ position: absolute; width: 320px; height: auto; top: 20px; right: 20px; text-align: center;}
img.corp-mark { width: 200px;}
img.site-title { width: 100%;}

/* ================================
   front（トップヘッダー）
================================ */
header{
  width: 100%;
}
header h1{
  padding: 0;
  margin: 0;
}
header .front{
  width: 960px;
  margin: 0 auto;
}
header .logo{
  width: 260px;
  float: left;
}
header .tel-strip{
  width: 300px;
  float: right;
}
header .tel-strip p{
  margin: 0;
  padding: 0;
  font-size: 14px;
  font-weight: bold;
  color: #333333;
}
header nav.tab-nav{
  clear: both;
  border-top: 9px solid #694C3026;
  border-bottom: 9px solid #694C3026;
}
header nav.tab-nav ul{
  width: 960px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
  display: flex;
}
header nav.tab-nav ul li {
  flex: 1;
}
header nav.tab-nav ul li a {
  display: block;
  padding: 28px 0;
  font-size: 16px;
  text-decoration: none;
  color: #694C30;
  font-weight: bold;
  text-align: center;
  border-bottom: 8px solid #333333;
}

header nav.tab-nav ul li.green a{ border-color: #93DE78CC;}
header nav.tab-nav ul li.pink a{ border-color: #FD9595CC;}
header nav.tab-nav ul li.sky a{ border-color: #8FE6E3CC;}
header nav.tab-nav ul li.orange a{ border-color: #EAC634CC;}

header nav.tab-nav ul li.green a:hover{ background-color: #93DE781A;}
header nav.tab-nav ul li.pink a:hover{ background-color: #FD95951A;}
header nav.tab-nav ul li.sky a:hover{ background-color: #8FE6E31A;}
header nav.tab-nav ul li.orange a:hover{ background-color: #EAC6341A;}

header nav.tab-nav ul li.is-active.green a{ background-color: #93DE781A;}
header nav.tab-nav ul li.is-active.pink a{ background-color: #FD95951A;}
header nav.tab-nav ul li.is-active.sky a{ background-color: #8FE6E31A;}
header nav.tab-nav ul li.is-active.orange a{ background-color: #EAC6341A;}

/* ================================
   Sitebar（下層ヘッダー）
================================ */
.sitebar { border-top:1px solid #d9ccb3; border-bottom:1px solid #d9ccb3; background:#f8f5ee; }
.sitebar-head {
  max-width:1040px; margin:0 auto; padding:12px 20px;
  display:flex; align-items:flex-end; justify-content:space-between; gap:16px;
}
.sitebar-left .kicker{ font-size:12px; color:#555; margin-bottom:2px; }
.sitebar-left .logo{ display:flex; align-items:flex-end; gap:8px; text-decoration:none; }
.sitebar-left .logo img{ width:28px; height:28px; }
.sitebar-left .logo-text{ font-size:28px; letter-spacing:.06em; color:#111; }
.sitebar-left .logo-text em{ color:var(--green); font-style:normal; font-weight:900; }

.sitebar-right { text-align:right; }
.sitebar-right .help{ font-size:12px; color:#555; margin-bottom:4px; }
.sitebar-right .tel{
  display:inline-flex; align-items:center; gap:8px;
  background:#1db15a; color:#ffffff; font-weight:800; text-decoration:none;
  padding:6px 12px; border-radius:6px;
}
.sitebar-right .tel span{
  background:#0f8f47; padding:3px 6px; border-radius:4px;
}

/* タブナビ */
.sitebar-nav { border-top:1px solid #d9ccb3; border-bottom:1px solid #d9ccb3; }
.sitebar-nav .menu{
  max-width:1040px; margin:0 auto; padding:10px 20px;
  display:flex; justify-content:space-between; gap:16px; list-style:none;
}
.sitebar-nav .menu li a{
  display:block; padding:12px 20px; text-decoration:none; color:#5a4f3b; font-weight:600;
  background:rgba(255,255,255,0.6); border-radius:8px;
}
.sitebar-nav .menu li.current a{ background:#ffffff; }

/* カラーバー */
.sitebar-colorbar{ height:10px; display:grid; grid-template-columns:repeat(4,1fr); }
.sitebar-colorbar .seg1{ background:#9bdc8a; }
.sitebar-colorbar .seg2{ background:#f2a0a1; }
.sitebar-colorbar .seg3{ background:#8ed9e8; }
.sitebar-colorbar .seg4{ background:#e7c04e; }

/* ================================
   セクション共通
================================ */
section { max-width:100%; margin:0 auto;}
section > div.container{
  width: 960px;
  margin: 0 auto;
  font-size: 16px;
}
h2.sec-title{
  font-size: 24px;
  font-family: "Noto Serif JP", serif;
  border-bottom: 8px solid #E6A0D14A;
  color: var(--text);
  padding-bottom: 8px;
  margin: 36px 0;
}
h2.sec-title img{
  vertical-align: bottom;
  margin-right: 8px;
}

/* ================================
   ご挨拶
================================ */
.greeting{
  text-align: center;
  margin: 80px 0;
}
.greeting h1{
  line-height:3;
  font-weight: bold;
  font-size: 16px;
}
.contact h1{
  line-height:3;
  font-weight: bold;
  font-size: 16px;
  text-align: center;
  margin: 40px 0 0;
}
/* ================================
   目指すところ
================================ */
.vision-list {
  list-style: none;
  margin: 0;
  padding: 0 0 150px 36px;
}
.vision-list li {
  position: relative;
  padding-left: 40px;
  margin-bottom: 14px;
  line-height: 1.6;
}
.vision-list li span {
  position: absolute;
  left: 0;
  top: 0.25em;
  width: 24px;
  height: 24px;
  display: inline-block;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
}
.vision-list li.num1 { color: var(--pink); }
.vision-list li.num1 span {
  background-color: var(--pink);
  -webkit-mask-image: url('../images/icon_no1.svg');
  mask-image: url('../images/icon_no1.svg');
}
.vision-list li.num2 { color: var(--blue); }
.vision-list li.num2 span {
  background-color: var(--blue);
  -webkit-mask-image: url('../images/icon_no2.svg');
  mask-image: url('../images/icon_no2.svg');
}
.vision-list li.num3 { color: var(--green); }
.vision-list li.num3 span {
  background-color: var(--green);
  -webkit-mask-image: url('../images/icon_no3.svg');
  mask-image: url('../images/icon_no3.svg');
}
.vision-list li.num4 { color: var(--yellow); }
.vision-list li.num4 span {
  background-color: var(--yellow);
  -webkit-mask-image: url('../images/icon_no3.svg');
  mask-image: url('../images/icon_no3.svg');
}

/* ================================
   併設事務所
================================ */
.annex .container{
  position: relative;
  padding-bottom: 150px;
}
.annex .container .bullets{
  font-size: 24px;
  font-weight: bold;
  font-family: "Noto Serif JP", serif;
  line-height: 2;
}
.annex_bg{
  position: absolute;
  top: -40px;
  right: 0;
  z-index: 100;
  height: 300px;
  width: auto;
}

/* ================================
   ギャラリー（施設のご案内）
================================ */
.gallery{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.gallery .card{ background:#ffffff; border:10px solid #fff; border-radius:6px; overflow:hidden; }
.gallery img{ display:block; width:100%; height:auto; }
.gallery figcaption{ padding:10px 12px;}
.gallery2{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.gallery2 .card{ background:#ffffff; border:10px solid #fff; border-radius:6px; overflow:hidden; }
.gallery2 img{ display:block; width:100%; height:auto; }
.gallery2 figcaption{ padding:10px 12px;}
.center{ text-align:center; }
.facility .note{ color:#43A825; margin-top:24px; font-size: 21px;font-family: "Noto Serif JP", serif; font-weight: bold; margin-bottom: 150px;}
.nibun{ width:66%; grid-template-columns:repeat(2,1fr);margin:auto;}

/* ================================
   料金表
================================ */
.table-wrap{ overflow-x:auto; }
.price-table{ width:100%; border-collapse:collapse; background:#ffffff; }
.price-table th{ border:1px solid #694C30; padding:12px; text-align:center; white-space: nowrap; background: #E6A0D14A;}
.price-table td{ border:1px solid #694C30; padding:12px; text-align:left; }
.price-table thead th{ background: #FFF09D; color: #694C30}
.price .note{font-family: "Noto Serif JP";margin-bottom: 150px;}

/* ================================
   募集要項
================================ */
.table-wrap2{ overflow-x:auto; }
.rec-table{ width:100%; border-collapse:collapse; background:#ffffff; }
.rec-table td{ border:1px solid #694C30; padding:12px; text-align:left; }
.rec-table th{  border:1px solid #694C30; padding:12px; background: #FFF09D; color: #694C30}

/* ================================
   CTA
================================ */
.cta{}
.container.cta-inner{
  background: #FFF09DB3;
  border: 4px solid #43A825;
  max-width: 960px;
  margin: 150px auto;
  padding: 0;
}
.cta-inner h2{
  text-align: center;
  background: #43A825;
  color: #ffffff;
  font-size: 24px;
  padding: 8px 0 9px;
  margin: 0;
  font-family: "Noto Serif JP", serif;
}
.cont-inner{
  display: flex;
  gap: 20px;
  justify-content: center;
  align-items: stretch;
  flex-wrap: wrap;
}
.cta-box{ margin: 18px; }
.cta-head{
  font-size: 24px;
  font-weight: bold;
  border-bottom: 4px solid #43A8254A;
  font-family: "Noto Serif JP", serif;
  line-height: 2;
  margin-bottom: 16px;
}
.cta-head img{
  vertical-align: middle;
  padding: 0 10px 6px 0;
  width: 40px;
}
.cta-box a.phone{ font-size: 60px; }
.cta-box a.phone img{ width: 100px; }
.cta-box.mail{}
.cta-box.mail .cta-head{ padding-right: 1.5em; }
.cta-box.mail a{
  display: block;
  text-align: center;
  color: #ffffff;
  font-size: 24px;
  font-weight: bold;
  padding: 8px 60px;
  background: #FD9595 no-repeat;
  box-shadow: 3px 3px 0px #00000029;
  border-radius: 10px;
  background-image: url('../images/icon_arrow.svg');
  background-position: left 20px center;
  background-size: 30px;
  width: 100%;
  box-sizing: border-box;
}

/* ================================
   footer
================================ */
footer{
  background: url("../images/footer_wave.png") repeat-x top center;
  padding: 50px 0 1em;
  max-height: 218px;
  color: #ffffff;
  box-sizing: border-box;
}
footer .inner{
  width: 960px;
  margin: 0 auto;
  text-align: right;
}
footer .inner p{ font-size: 16px; }
footer .inner p.copy{ font-size: 10px; }

/* ================================
   レスポンシブ
================================ */
@media (max-width:900px){
  .hero-container{
    max-width:100%;
    width:100%;
    padding:0;
    box-sizing: border-box;
  }
  header .logo{
    margin: auto;
    float: none;
  }
  header .tel-strip{
    width: 100%;
    float: none;
    text-align: center;
  }
  header .front,
  section > div.container,
  footer .inner {
    max-width:100%;
    width:100%;
    padding:0 16px;
    box-sizing: border-box;
  }
  header nav.tab-nav ul {
    max-width:100%;
    width:100%;
    padding:0;
  }
  .gallery{ grid-template-columns:1fr 1fr; }
  .brand-right{ display:none; }
  .sitebar-head{ align-items:center; }
  .sitebar-left .logo-text{ font-size:22px; }
  .sitebar-nav .menu{ gap:8px; }
  .sitebar-nav .menu li a{ padding:10px 14px; }
  .annex_bg{
  position: relative;
  top: 0;
  right: 0;
  z-index: 100;
  height: auto;
  width: 90%;
  max-width: 550px;
  margin: auto;
  display: block;
  }

}
@media (max-width:560px){
  * { font-size: 90%;}
  h2.sec-title{
  font-size: 20px;
  }
  .annex .container{
    padding-bottom: 40px;
  }
  .annex .container .bullets,
  .facility .note {
    font-size: 16px;
    margin-bottom: 40px;
  }
  .price .note{
    margin-bottom: 40px;
  }
  footer .inner p{ font-size: 14px; }
  .gallery{ grid-template-columns:1fr; }
  .gallery2{ grid-template-columns:1fr; }
  .site-title{ font-size:22px; }
  .sitebar-head{ flex-direction:column; align-items:flex-start; }
  .sitebar-right{ text-align:left; }
  .sitebar-nav .menu{ flex-wrap:wrap; row-gap:8px; }
  .cont-inner{ flex-direction: column; gap: 12px; }
  a.phone{
    font-size:28px;
    line-height:1.2;
  }
  a.phone img{ width:40px; }
  header nav.tab-nav ul{ flex-direction: column; }
/* スマホのタブナビ：横並び・改行なし */
  header nav.tab-nav ul{
    display:flex;
    flex-wrap: nowrap;          /* 縦並びにしない */
    gap: 0;
    width:100%;
  }
  header nav.tab-nav ul li{
    flex: 1 0 25%;              /* 4等分 */
  }
  header nav.tab-nav ul li a{
    white-space: nowrap;        /* 文字を折り返さない */
    padding: 14px 0;            /* 高さを少し詰める */
    font-size: clamp(12px, 3.5vw, 14px); /* 画面幅に応じて縮小 */
  }
  .vision-list{
    padding-left: 0;
    padding-bottom: 40px;
  }
/* 念のため、旧指定を打ち消し */
  header nav.tab-nav ul{ flex-direction: row !important;}
  .greeting{
    margin: 40px 0;
  }
  
  .container.cta-inner{
    max-width: 320px;
    margin: 40px auto;
    padding: 0;
  }
  .cta-inner h2{
    font-size: 18px;
    padding: 4px 0 5px;
    margin: 0;
    box-sizing: border-box;
  }
  .cont-inner{
    display: block;
    gap: 0;
    justify-content: center;
    align-items: stretch;
    flex-wrap: wrap;
  }
  .cta-box{ margin: 18px; }
  .cta-head{
    font-size: 18px;
    line-height: 2;
    margin-bottom: 16px;
  }
  .cta-head img{
    vertical-align: middle;
    padding: 0 10px 6px 0;
    width: 30px;
  }
  .cta-box a.phone img{ width: 50px; }
  .cta-box.mail .cta-head{ padding-right: 1.5em; }
  .cta-box.mail a{
    font-size: 16px;
    padding: 8px 60px;
    background-position: left 20px center;
    background-size: 20px;
    width: 100%;
  }

}
/**電話改行禁止**/
@media (max-width:560px){

  .cta-box.tel > a.phone{
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;

    width: auto !important;
    max-width: 100% !important;

    white-space: nowrap !important;

    font-size: clamp(36px, 12vw, 42px) !important;

    line-height: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .cta-box.tel > a.phone .txttel{
    flex: 0 0 auto !important;
    width: 1em !important;
    height: 1em !important;
  }

}

body:not(.home) header {
  background: #ffffff;
  padding-top: 12px;
}

body:not(.home) header nav.tab-nav{
  background: #FBF7EB url(../images/bg_pattern.png);
}

body:not(.home) h1 {
  font-size: 24px;
}

body:not(.home) h2.sec-title{
  position: relative;
  padding-left: 28px;
}
body:not(.home) h2.sec-title::before{
  display:block;
  position: absolute;
  top: 6px;
  left: 0px;
  content: "";
  width: 20px;
  height: 29px;
  background-color: #FD9595; 
}
body:not(.home) h3{
  color: #43A825;
}
.vision-list2 {
  margin-bottom: 40px;
}
.vision-list2 li {
  position: relative;
  margin-bottom: 14px;
  line-height: 1.6;
}

.page-id-12 .prof{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  place-items: center;
}
.page-id-12 .gallery2{
  grid-template-columns: repeat(2, 1fr);
}
.page-id-12 .gallery2 img{
  max-width: 300px;
  margin: auto;
}
figcaption p.name,figcaption p.syoku{
  text-align: center;
}
/* ===== Flow base ===== */
.flow { padding: 20px 0; }
.flow-steps{
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px;
}
.step{
  position: relative; background: #fff; border: 3px solid #6CC04A;
  border-radius: 10px; padding: 14px 14px 18px; box-sizing: border-box;
  min-height: 180px;
}

/* 見出し（緑帯） */
.step h3{
  margin: 0 0 10px; font-size: 16px; line-height: 1;
  color: #fff !important;
  background: #69BF49; border-radius: 8px;
  padding: 7px 10px; font-weight: 700;
  line-height: 1.2;
}
.step h3 span{
  margin-right: 4px;
  display: block;
}

/* 説明文 */
.step p{ margin: 0; font-size: 13px; color: #333; line-height: 1.8; }

/* 右向きグラデーション矢印（各ボックスの右に重ねる） */
.step::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -16px;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-top: 28px solid transparent;   /* 上辺を透明に */
  border-bottom: 28px solid transparent;/* 下辺を透明に */
  border-left: 14px solid #6CC04A;      /* ← 矢印の色と向き */
}
.step:last-child::after{ display: none; }

/* ==== レスポンシブ ==== */
@media (max-width: 1100px){
  .flow-steps{ grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 720px){
  .page-id-12 .prof{
    grid-template-columns: repeat(1, 1fr);
  }
  .page-id-12 .gallery2{
    grid-template-columns: repeat(1, 1fr);
  }

  .flow-steps{ 
    grid-template-columns: 1fr;
    gap:0;
  }
  .step h3 span {
    display: inline;
    margin-right: 1em;
  }
  .flow .step::after { content: none !important; }
  .flow { display:block; }
  .flow .step{
    position: relative;
    margin: 0 16px;
    padding-bottom: 12px;
    min-height: auto;
  }
  .flow .step + .step{
    margin-top: 44px;
  }
  .flow .step + .step::before{
    content: "";
    position: absolute;
    top: -36px;
    left: 50%;
    transform: translateX(-50%);
    width: 0; height: 0;
    border-left: 44px solid transparent;
    border-right: 44px solid transparent;
    border-top: 22px solid #6CC04A;
    border-bottom: 0;
    filter: drop-shadow(0 2px 0 rgba(0,0,0,.12));
  }
}

  .access iframe{
    display: block;
    width: 90%;
    margin: auto;
  }
  .access .note{
    text-align: center;
  }

/* ================================
   施設バナーリスト（.sisetubn）
================================ */
.sisetubn ul {
  display: flex;
  justify-content: center;
  align-items: stretch;
  gap: 10px;
  list-style: none;
  margin: 40px 0 0 0;
  padding: 0;
  flex-wrap: nowrap; /* 折り返さず常に横並び */
}

.sisetubn li {
  flex: 1 1 33.33%;
  text-align: center;
}

.sisetubn a {
  display: block;
  transition: opacity 0.2s ease;
}

.sisetubn a:hover {
  opacity: 0.8;
}

.sisetubn img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 6px;
}

/* スマホでも3つ横並びで維持 */
@media (max-width: 768px) {
  .sisetubn ul {
    gap: 6px;                 /* スマホ用に少し余白を詰める */
  }
  .sisetubn li {
    flex: 1 1 33.33%;         /* 3等分キープ */
  }
  .sisetubn img {
    border-radius: 4px;
  }
  body:not(.home) h3{
  font-size: 110%;
  }

}
/**お問い合わせ*********************************************************/

/* CF7フォーム全体（このCSSは .contact-form-container 周りを前提に丸ごと置き換え） */
.contact-form-container{
  max-width: 100%;
  margin: 0 auto;
  padding: 0;
  font-size: 14px;
  line-height: 1.7;
  color: #333;
}

/* 罫線（画像の点線っぽい区切り） */
.contact-form-container dl{
  margin: 0;
  padding: 0;
  border-top: 1px dotted #cfcfcf;
}
.contact-form-container dt,
.contact-form-container dd{
  margin: 0;
  padding: 14px 12px;
  border-bottom: 1px dotted #cfcfcf;
}

/* 2カラムレイアウト（左：項目名 / 右：入力） */
.contact-form-container dl{
  display: grid;
  grid-template-columns: 220px 1fr;
}
.contact-form-container dt{
  font-weight: 700;
  background: #fff;
}
.contact-form-container dd{
  background: #fff;
}

/* 必須バッジ */
.contact-form-container .required{
  display: inline-block;
  margin: 0 0 3px 8px;
  padding: 2px 8px 3px;
  font-size: 12px;
  line-height: 1.3;
  color: #fff;
  background: #e25757;
  border-radius: 3px;
  vertical-align: middle;
}

/* チェックボックス部の見た目 */
.contact-form-container dd p{
  margin: 8px 0 6px;
  font-weight: 700;
}
.contact-form-container .wpcf7-list-item{
  display: inline-block;
  margin: 0 12px 8px 0;
}
.contact-form-container .wpcf7-list-item-label{
  margin-left: 6px;
}

/* 入力共通（画像の細い枠＋薄い背景） */
.contact-form-container input[type="text"],
.contact-form-container input[type="email"],
.contact-form-container input[type="tel"],
.contact-form-container input[type="url"],
.contact-form-container input[type="number"],
.contact-form-container select,
.contact-form-container textarea{
  width: 100%;
  max-width: 560px;
  box-sizing: border-box;
  padding: 10px 12px;
  border: 1px solid #d7dde3;
  background: #f6fafc;
  border-radius: 2px;
  outline: none;
}

.contact-form-container textarea{
  max-width: 100%;
  min-height: 180px;
  resize: vertical;
}

/* フォーカス */
.contact-form-container input[type="text"]:focus,
.contact-form-container input[type="email"]:focus,
.contact-form-container input[type="tel"]:focus,
.contact-form-container select:focus,
.contact-form-container textarea:focus{
  border-color: #9fb8c9;
  background: #fff;
}

/* 郵便番号など短い入力を横並びにしたい場合に使える補助 */
.contact-form-container .is-inline{
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}
.contact-form-container .is-inline > *{
  flex: 0 0 auto;
}

/* 送信ボタン（画像の右寄せ） */
.contact-form-container .submit-btn{
  padding: 18px 12px;
  text-align: right;
}
.contact-form-container input[type="submit"],
.contact-form-container .wpcf7-submit{
  appearance: none;
  border: 0;
  padding: 12px 26px;
  border-radius: 3px;
  background: #b9b2a7;   /* 画像のグレージュ系 */
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}
.contact-form-container input[type="submit"]:hover,
.contact-form-container .wpcf7-submit:hover{
  filter: brightness(0.95);
}
.contact-form-container input[type="submit"]:disabled,
.contact-form-container .wpcf7-submit:disabled{
  opacity: 0.7;
  cursor: not-allowed;
}

/* CF7のエラーメッセージなど */
.contact-form-container .wpcf7-not-valid-tip{
  margin-top: 6px;
  font-size: 13px;
}
.contact-form-container .wpcf7-response-output{
  margin: 18px 0 0;
  padding: 12px 14px;
}

/* レスポンシブ：1カラム化 */
@media (max-width: 768px){
  .contact-form-container dl{
    grid-template-columns: 1fr;
  }
  .contact-form-container dt{
    padding-bottom: 8px;
    border-bottom: 0;
  }
  .contact-form-container dd{
    padding-top: 0;
  }

  .contact-form-container input[type="text"],
  .contact-form-container input[type="email"],
  .contact-form-container input[type="tel"],
  .contact-form-container select,
  .contact-form-container textarea{
    max-width: 100%;
  }

  .contact-form-container .submit-btn{
    text-align: center;
  }
}
/* 入力幅を揃える（このCSSは .contact-form-container 周りを前提に置き換え） */
.contact-form-container{
  --field-w: 620px;     /* 長い入力欄の基準幅（必要ならここだけ調整） */
  --field-w-md: 520px;  /* 住所など少し短めにしたい場合の幅 */
  --zip-w: 160px;       /* 郵便番号 */
  --pref-w: 360px;      /* 都道府県 */
}

/* CF7のwrapをブロック化して、幅の基準を作る */
.contact-form-container .wpcf7-form-control-wrap{
  display: block;
}

/* 基本：ほとんどの入力欄は同じ幅に揃える */
.contact-form-container input[type="text"],
.contact-form-container input[type="email"],
.contact-form-container input[type="tel"],
.contact-form-container select,
.contact-form-container textarea{
  width: min(var(--field-w), 100%);
  max-width: 100%;
}

/* お問い合わせ内容は横幅いっぱいでOK（見た目が整う） */
.contact-form-container textarea{
  width: 100%;
}

/* 郵便番号だけ短く */
.contact-form-container input[name="address-zip"]{
  width: min(var(--zip-w), 100%);
}

/* 都道府県は中くらい */
.contact-form-container select[name="address-pref"]{
  width: min(var(--pref-w), 100%);
}

/* 住所の「市区町村以下」「アパート・ビル名」は長め（郵便番号よりは長いが、基準幅より少し控えめ） */
.contact-form-container input[name="address-city"],
.contact-form-container input[name="address-building"]{
  width: min(var(--field-w-md), 100%);
}

/* 会社名は少し短めにしたい場合（不要なら削除OK） */
.contact-form-container input[name="your-company"]{
  width: min(var(--field-w-md), 100%);
}

/* 電話・メール・お名前は基準幅 */
.contact-form-container input[name="your-name"],
.contact-form-container input[name="your-tel"],
.contact-form-container input[name="your-email"]{
  width: min(var(--field-w), 100%);
}

/* 住所ブロックが改行でガタつくのを軽減（行間と余白） */
.contact-form-container dd{
  line-height: 1.9;
}
.contact-form-container dd br{
  display: block;
  margin: 8px 0;
  content: "";
}

/* モバイルは全部100%にして詰まりを防ぐ */
@media (max-width: 768px){
  .contact-form-container{
    --field-w: 100%;
    --field-w-md: 100%;
    --zip-w: 220px;   /* スマホだと郵便番号は少し長めでも押しやすい */
    --pref-w: 100%;
  }

  .contact-form-container input[name="address-zip"]{
    width: min(var(--zip-w), 100%);
  }
}
/* 送信ボタン：大きく・オレンジ・中央配置 */
.contact-form-container .submit-btn{
  text-align: center;   /* 左右中央 */
  padding: 30px 12px 10px;
}

.contact-form-container input[type="submit"],
.contact-form-container .wpcf7-submit{
  display: inline-block;
  min-width: 280px;
  padding: 16px 40px;
  font-size: 18px;
  font-weight: 700;
  border-radius: 6px;
  background: #f3981d;      /* オレンジ */
  color: #fff;
  border: none;
  cursor: pointer;
}

.contact-form-container input[type="submit"]:hover,
.contact-form-container .wpcf7-submit:hover{
  background: #ea8c12;
}

/* スマホは横幅いっぱい気味に */
@media (max-width: 768px){
  .contact-form-container input[type="submit"],
  .contact-form-container .wpcf7-submit{
    width: 100%;
    min-width: 0;
    font-size: 17px;
    padding: 16px 0;
  }
}
/* 郵便番号行：〒 を左に並べる（副作用なし） */
.contact-form-container .zip-row{
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.contact-form-container .zip-row input[name="address-zip"]{
  width: 160px;      /* 郵便番号は短く */
  max-width: 100%;
}

/**空き情報****************************************************/
/* 外枠 */
.vacancy-card{
  border: 1px solid #e6e1d8;
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
}

/* PC：横並びテーブル風 */
.vacancy-head,
.vacancy-row{
  display: grid;
  grid-template-columns: 1.1fr 1.1fr 2fr 1.2fr;
}

.cell{
  padding: 14px 14px;
  border-right: 1px solid #efe9df;
  border-bottom: 1px solid #efe9df;
  font-size: 14px;
  line-height: 1.7;
  color: #333;
  background: #fff;
}
.vacancy-head .cell{
  background: #8FE6E380;
  font-weight: 700;
  text-align: center;
}
.vacancy-head .cell:last-child,
.vacancy-row .cell:last-child{
  border-right: 0;
}
.vacancy-row .cell{
  vertical-align: top;
}
.vacancy-row .cell.lg{
  font-size: 1.1em;
}
.vacancy-row .cell.aki{ font-weight: 700; }

/* 更新日時 */
.updated .time{ margin-top: 2px; }
.updated .note{
  margin-top: 6px;
  display: inline-block;
  font-size: 12px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #ffe6e6;
  color: #c53030;
}

/* 箇条書き */
.list{
  margin: 0;
  padding-left: 18px;
}
.list li{ margin: 0 0 4px; }

/* スマホ：縦並び（見出し行は非表示、各セルにラベル表示） */
@media (max-width: 768px){
  .vacancy-head{ display: none; }

  .vacancy-row{
    display: block;
  }

  .vacancy-row .cell{
    display: block;
    border-right: 0;
    padding: 12px 14px;
  }

  .vacancy-row .cell::before{
    content: attr(data-label);
    display: block;
    font-weight: 700;
    margin-bottom: 6px;
    padding: 6px 10px;
    border-radius: 4px;
    background: #f6efe6;
  }
}


/* ===== 基本（PC） ===== */
.respo{
  width: 100%;
  border-collapse: collapse;
}


/* ===== スマホ：縦並び ===== */
@media (max-width: 768px){

  .respo,
  .respo tbody,
  .respo tr{
    display: block;
    width: 100%;
  }

  .respo tr{
    overflow: hidden;
    background: #fff;
  }

  .respo th,
  .respo td{
    display: block;
    border: none;
    padding: 12px 14px;
  }

  /* 見出し（th） */
  .respo th{
    font-size: 15px;
    border-bottom: 1px solid #e6e1d8;
  }

  /* 内容（td） */
  .respo td{
    background: #fff;
    line-height: 1.8;
    font-size: 120%;
  }
}