/* =================================================
Table Base（SWELL投稿内テーブル）
================================================= */

.post_content table{
 border-collapse:collapse;
}

.post_content table th,
.post_content table td{
 border:1px solid #bbb;
}

.post_content table th{
 font-weight:500;
 padding:0.625rem;
 white-space:nowrap;
text-align: center;
 background:#e7e7eb;
}

.post_content table td{
 font-size:0.95rem;
 padding:0.625rem;
}

.post_content thead td, .post_content thead th {
    color:#000;
}

/* PC */

@media screen and (min-width:481px){

.post_content table{
 background:#fbfbfc;
}

}


/* SP */

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

.post_content table{
 background:unset;
}

}


/* =================================================
Table Style : nth-1
================================================= */

#nth-1 table{
 background:#f8f8f8;
}

#nth-1 th,
#nth-1 td{
 border:1px solid #bbb;
}

#nth-1 th{
 background:#e7e7eb;
 padding:0.3125rem;
}

#nth-1 td{
 font-size:0.95rem;
 padding:0.1875rem;
}

#nth-1 td:nth-child(1){
 background:#f8f4e6;
}


/* =================================================
Table Style : normal
================================================= */

#normal table{
 margin:0;
 text-align:left;
}

#normal th{
 background:#f7f7f7;
 border:1px solid #bbb;
 font-size:1.1rem;
}

#normal td{
 border:1px solid #bbb;
 background:#fff;
 padding:0.375rem 0.625rem 0.375rem 0.75rem;
 font-size:0.875rem;
 transition:all .6s ease-out;
}


/* =================================================
Table Style : p4
================================================= */

#p4 table{
 border:none;
 background:#fff;
 padding:0.125rem;
 margin:0;
 text-align:left;
 transition:all .6s ease-out;
}

#p4 table tr{
 margin:0.125rem 0;
}

#p4 table th{
 background:#dcdddd;
 border:1px solid #bbb;
 font-size:1.1rem;
 font-weight:300;
}

#p4 table td{
 font-size:1rem;
 border:1px solid #bbb;
 background:#fff;
 padding:0.625rem;
 transition:all .6s ease-out;
}
#p4 tr>*:first-child{
background: #edf0f2;
}
#p4 tr>*:last-child{
text-align: right;
font-weight: 600;
}

/* =================================================
Table Style : noline
================================================= */

.post_content table#noline{
 border:none;
 margin:0;
}

.post_content #noline th{
 border:none;
 background:#fff;
 font-size:1.1rem;
}

.post_content #noline td{
 border:none;
 background:#fff;
 padding:0.375rem 0.125rem;
 font-size:0.95rem;
 vertical-align:top;
}


/* =================================================
Gallery (SP)
================================================= */

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

.gallery{
 display:flex;
 flex-wrap:wrap;
 align-content:space-around;
}

.gallery li,
.gallery ul li{
 flex-basis:48.5%;
 padding:0 0.125rem 0.625rem 0;
}

}


/* 写真marginなし */

.marginnone{
 margin:0 !important;
}


/* =================================================
レスポンシブtable（体験カレンダー等）
================================================= */

#table_res table{
 border-top:1px solid #ccc;
 border-right:1px solid #ccc;
 border-collapse:collapse;
 width:100%;
}

#table_res table th{
 background:#e7e7eb;
 color:#4d768e;
 border:1px solid #ccc;
 padding:0.625rem;
 white-space:nowrap;
    text-align: center;
}

#table_res table td{
 border:1px solid #ccc;
 padding:0.625rem;
}


/* SP */

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

#table_res table{
 border:none;
}

#table_res table thead{
 display:none;
}

#table_res table tr{
 border-top:1px solid #ccc;
 display:block;
 margin-bottom:1.25rem;
}

#table_res table td{
 border-right:1px solid #ccc;
 border-bottom:1px solid #ccc;
 display:block;
 padding:0.625rem;
 text-align:right;
}

#table_res table td::before{
 content:attr(data-label);
 float:left;
 font-weight:bold;
}

}


/* PC 列幅 */

@media screen and (min-width:481px){

#table_res .per10{width:10%;}
#table_res .per15{width:15%;}
#table_res .per18{width:18%;}
#table_res .per20{width:20%;}
#table_res .per25{width:25%;}
#table_res .per30{width:30%;}
#table_res .per40{width:40%;}
#table_res .per50{width:50%;}
#table_res .per60{width:60%;}
#table_res .per70{width:70%;}
#table_res .per80{width:80%;}
#table_res .per90{width:90%;}

}

/* =============================================
   津南病院 沿革・概要テーブル — レスポンシブ対応CSS
   ============================================= */

/* --- PC表示の基本スタイル --- */
.card-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 2em;
}

.card-table th, 
.card-table td {
  border: 1px solid #ddd;
  padding: 12px;
  text-align: left;
}

.card-table thead th {
  background-color: #1a5b82;
}

/* --- スマートフォン表示（768px以下） --- */
@media screen and (max-width: 768px) {
  /* PC用のヘッダーを隠す */
  .card-table thead {
    display: none;
  }

  /* テーブル要素をブロック化 */
  .card-table, 
  .card-table tbody, 
  .card-table tr, 
  .card-table th, 
  .card-table td {
    display: block;
    width: 100%;
    border: none;
  }

  /* 1年分のデータをカード化 */
  .card-table tr {
    margin-bottom: 25px;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    background-color: #fff;
    overflow: hidden;
  }

  /* 「年」をカードの見出しにする */
  .card-table th[data-label="年"] {
    background-color: #1a5b82; /* 病院のカラーに変更してください */
    color: #fff;
    font-size: 1.1em;
    padding: 10px 15px;
  }

  /* 各セルの調整 */
  .card-table td {
    padding: 10px 15px;
    border-bottom: 1px solid #f0f0f0;
    position: relative;
  }

  /* 最後のセルは線なし */
  .card-table td:last-child {
    border-bottom: none;
  }

  /* 見出し（data-label）の自動挿入 */
  .card-table td::before {
    content: attr(data-label);
    display: block;
    font-size: 0.85em;
    font-weight: bold;
    color: #888;
    margin-bottom: 4px;
  }

  /* --- 空の項目を隠す --- */
  .card-table td:empty {
    display: none;
  }
}