/* 富田林営業所 デイサービスセンター 固有スタイル */

/* ---------- 主なサービスのご紹介 アイコン画像（day.htmlに合わせたサイズ） ---------- */
.sub-feature img{height:190px;width:190px;}
@media only screen and (max-width:600px){
  .sub-feature img{height:180px;width:180px;}
}

/* ---------- 施設の様子（写真ギャラリー：3枚以下は3列、4枚以上は4列） ---------- */
.td-gallery{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:14px;
}
.td-gallery:has(.td-gallery-item:nth-child(4)){
  grid-template-columns:repeat(4, 1fr);
}
.td-gallery-item{aspect-ratio:4/3;overflow:hidden;border-radius:4px;}
.td-gallery-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease;}
.td-gallery-item:hover img{transform:scale(1.06);}
@media(max-width:560px){
  .td-gallery,
  .td-gallery:has(.td-gallery-item:nth-child(4)){
    grid-template-columns:repeat(2,1fr);
  }
}
/* 写真が3枚未満の場合は左寄せではなく中央寄せにする */
.td-gallery:not(:has(.td-gallery-item:nth-child(3))){
  display:flex;
  justify-content:center;
}
.td-gallery:not(:has(.td-gallery-item:nth-child(3))) .td-gallery-item{
  width:calc((100% - 14px * 2) / 3);
}
@media(max-width:560px){
  .td-gallery:not(:has(.td-gallery-item:nth-child(3))) .td-gallery-item{
    width:calc((100% - 14px) / 2);
  }
}


/* ---------- 所長からのご挨拶 ---------- */
.td-greeting{max-width:820px;margin:0 auto;}
.td-greeting p{font-size:15.5px;color:#555;line-height:1.9;margin-bottom:10px;}
.td-greeting p:last-child{margin-bottom:0;}
.td-greeting .td-greeting-lead{font-size:20px;font-weight:700;color:var(--pt-orange);margin-bottom:14px;}

/* 所長からのご挨拶：イラスト（写真）付きレイアウト */
.td-greeting--photo{display:grid;grid-template-columns:1fr 140px;gap:30px;align-items:start;}
.td-greeting--photo .td-greeting-photo-img{width:100%;border-radius:4px;display:block;}
@media(max-width:700px){
  .td-greeting--photo{grid-template-columns:1fr;}
  .td-greeting--photo .td-greeting-photo-img{width:160px;margin:20px auto 0;}
}

/* ---------- レクリエーション 写真グリッド ---------- */
.td-rec-photos{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
}
.td-rec-photo{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:4px;}
.td-rec-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease;}
.td-rec-photo:hover img{transform:scale(1.06);}
.td-rec-photo span{
  position:absolute;
  left:0;right:0;bottom:0;
  padding:8px 10px;
  font-size:14px;
  color:#fff;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.55) 100%);
}
@media(max-width:860px){ .td-rec-photos{grid-template-columns:repeat(3,1fr);} }
@media(max-width:560px){ .td-rec-photos{grid-template-columns:repeat(2,1fr);} }

/* ---------- レクリエーション 詳細（絵手紙・おやつ作り） ---------- */
.td-rec-detail-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  margin-top:34px;
}
.td-rec-detail{background:#fff;border:1px solid var(--pt-line);display:grid;grid-template-columns:230px 1fr;}
.td-rec-detail .photo{height:100%;}
.td-rec-detail .photo img{width:100%;height:100%;object-fit:cover;display:block;}
.td-rec-detail .body{padding:18px 20px;}
.td-rec-detail h4{font-size:16.5px;font-weight:700;color:var(--pt-accent);margin-bottom:8px;}
.td-rec-detail p{font-size:16px;color:#666;line-height:1.8;}
@media(max-width:700px){
  .td-rec-detail-grid{grid-template-columns:1fr;}
}
@media(max-width:480px){
  .td-rec-detail{grid-template-columns:1fr;}
  .td-rec-detail .photo{height:180px;}
}

/* ---------- 見学・無料体験 ---------- */
.td-reserve{display:grid;grid-template-columns:350px 1fr;gap:32px;align-items:center;}
.td-reserve .ph{height:220px;border-radius:4px;}
.td-reserve-lead{font-size:24px;font-weight:700;color:var(--pt-accent);margin-bottom:8px;}
.td-reserve-sub{font-size:17.5px;font-weight:700;color:var(--pt-ink);margin-bottom:10px;}
.td-reserve p{margin-bottom:8px;}
.td-reserve-tel{margin-top:20px;font-size:2vw;font-weight:700;color:var(--pt-orange);}
.td-reserve-tel a{color:inherit;}
@media(max-width:700px){
  .td-reserve{grid-template-columns:1fr;}
  .td-reserve .ph{height:180px;}
  /* 2vwのままだとスマホ幅で電話番号が極端に小さくなるため固定サイズにする */
  .td-reserve-tel{font-size:28px;}
}

/* ---------- ご利用者様の声 ---------- */
.td-voice-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  max-width:1000px;
  margin:0 auto;
}
.td-voice-card{
  background:#fff;
  border:1px solid var(--pt-line);
  border-left:4px solid var(--pt-orange);
  padding:28px 30px;
  text-align:left;
}
.td-voice-card h4{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:16px;
  font-weight:700;
  color:var(--pt-ink);
  margin-bottom:12px;
  line-height:1.5;
}
.td-voice-card h4 i{color:var(--pt-orange);font-size:14px;flex:none;}
.td-voice-card p{font-size:15.5px;color:#555;line-height:1.9;text-align:left;}
.td-voice-card .name{
  display:block;
  margin-top:14px;
  font-size:13px;
  color:var(--pt-accent);
  text-align:right;
}
@media(max-width:760px){
  .td-voice-grid{grid-template-columns:1fr;}
}

/* ---------- サービス紹介ブロック（定期巡回・訪問看護など：サブ見出し＋ボタン） ---------- */
.td-svc-block{max-width:820px;margin:0 auto;}
.td-svc-block h3{font-size:18px;font-weight:700;color:var(--pt-orange);margin-bottom:12px;}
.td-svc-block p{font-size:15.5px;color:#555;line-height:1.9;margin-bottom:10px;}
.td-svc-block p:last-child{margin-bottom:0;}
.td-svc-btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-top:20px;
  background:var(--pt-accent);
  color:#fff;
  font-size:14px;
  font-weight:700;
  letter-spacing:.04em;
  padding:13px 30px;
  border-radius:24px;
  text-decoration:none;
  transition:background .25s ease, transform .2s ease;
}
.td-svc-btn span{transition:transform .2s ease;}
.td-svc-btn:hover{background:var(--pt-accent-dark);color:#fff;transform:translateY(-2px);}
.td-svc-btn:hover span{transform:translateX(4px);}

/* ---------- 画像ブリード行内での調整 ---------- */
.pt-bleed-row .td-svc-block{max-width:none;margin:0;}

/* ---------- アクセス（地図） ---------- */
.td-map{max-width:1000px;margin:26px auto 0;border-radius:4px;overflow:hidden;}
.td-map iframe{width:100%;height:360px;display:block;border:0;}

/* ---------- 施設概要 ---------- */
.td-table{width:100%;max-width:1000px;margin:0 auto;border-collapse:collapse;}
.td-table th,.td-table td{border-bottom:1px solid var(--pt-line);padding:16px 18px;font-size:15px;text-align:left;}
.td-table th{width:180px;color:var(--pt-accent);font-weight:700;background:var(--pt-paper);}
/* 480px以下：ラベル列180pxが幅を圧迫し値が縦長になるため、
   ラベル→値を上下に積むレイアウトに切り替える */
@media(max-width:480px){
  .td-table,.td-table tbody,.td-table tr,.td-table th,.td-table td{display:block;width:auto;}
  .td-table tr{margin-bottom:2px;}
  .td-table th{border-bottom:none;padding:14px 18px 4px;}
  .td-table td{padding:0 18px 14px;}
}