/* 체험 프로그램 안내 및 예약 CSS */
	
	.sitetitle, .tagline {
				position: absolute;
				clip: rect(1px, 1px, 1px, 1px);
			}
			

/* 테이블안에 테이블 CSS */
.miniTable{
border: 1px solid #d2d2d2;
/* border-bottom: 1px solid black !important; */
margin-bottom : 0px;
border-collapse: 0;

}
.thead_Rsv{
border: 1px solid #d2d2d2 !important;

}
.redTxt_bold{
	font-weight: bold;
	color: red;
}
.redTxt{
	color: red;
}
.thHeader{
/* 	width: 10rem; */
/* width: 30%; */
	text-align: center;
	border-bottom: 1px solid ;
	border: 1px solid  #d2d2d2;
	background-color: #dbdbdb;
	font-size :16px !important;
}
.thHeader_none{ 
    position: relative;
    background-color: #d2d2d2;
    text-align: center;
    border: 1px solid #d2d2d2;
    overflow: hidden; /* 가상 요소를 요소 내부에 가려질 수 있도록 */
}
.thHeader_none::before {
     content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background:  
           linear-gradient(22deg, #dbdbdb 49%, transparent 25%, transparent 51%, #dbdbdb 25%);
    z-index: 1; /* 가상 요소를 요소의 바로 위로 올려줍니다. */
}
.th-program {
 font-size: 16px !important;
 background: #dbdbdb;
  } 


td table.miniTable thead .mini_td {
	padding: 1px !important;
}
    .miniTable .thead_Rsv .thHeader {
        font-size: 12px ;
    }
.mini_td1{
	width: 15%;
	border: 1px solid #d2d2d2 ;
	background-color: #dbdbdb;
	font-size: 16px !important;
}
.mini_td{
width: 30%;
}
.thHeader_none2{ 
    position: relative;
    background-color: #d2d2d2;
    text-align: center;
    border: 1px solid #d2d2d2;
    overflow: hidden; /* 가상 요소를 요소 내부에 가려질 수 있도록 */
}
.thHeader_none2::before {
     content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background:  
           linear-gradient(30deg, #dbdbdb 49%, transparent 25%, transparent 51%, #dbdbdb 25%);
    z-index: 1; /* 가상 요소를 요소의 바로 위로 올려줍니다. */
}
.thHeader_none3{ 
    position: relative;
    background-color: #d2d2d2;
    text-align: center;
    border: 1px solid #d2d2d2;
    overflow: hidden; /* 가상 요소를 요소 내부에 가려질 수 있도록 */
}
.thHeader_none3::before {
     content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background:  
           linear-gradient(14deg, #dbdbdb 49%, transparent 25%, transparent 51%, #dbdbdb 25%);
    z-index: 1; /* 가상 요소를 요소의 바로 위로 올려줍니다. */
}
 .blue-text {
            color: blue; /* 파란색 텍스트 */
        }
/* 테이블안에 테이블 CSS 끝 */


/* 1. 어린이 김치학교 커리큘럼 카드형 표 */
.curr-grid{
  display: grid;
  grid-template-columns: repeat(4, 170px); /* 4칸 → 5번째(8~9월)부터 줄바꿈 */
  width: fit-content;        /* 내용 폭만큼만 */
  margin: 0 auto;            /* 가로 중앙 */
  border: 1px solid #bfc7bb; /* 외곽선 */
  border-right: 0;
  border-bottom: 0;
}
.curr-grid .cell{
  border-right: 1px solid #bfc7bb;
  border-bottom: 1px solid #bfc7bb;
}
.curr-grid .month{
  background: #dfead6;   /* 연한 연두 */
  text-align: center;
  font-weight: 700;
  padding: 8px 6px;
  font-size: 16px;
}
.curr-grid .menu {
  background: #fff;
  text-align: center;
  padding: 12px 6px;
  line-height: 1.35;
  font-size: 16px;
}
/* fit-content 지원이 약한 환경 대비(선택) */
.curr-grid.inline { display: inline-block; }  /* 필요 시 .curr-grid 에 inline 클래스 추가 */

/* 모바일 대응: 2열로 접힘 */
@media (max-width: 600px){
  .curr-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  
}

/* 1. 어린이 김치학교 커리큘럼 카드형 표 끝 */

/*기타 커리큘럼 및 가격표 */

/* 공통 테이블 베이스 */
.table-green{
  --line: #bfc7bb;
  --head: #dfead6;            /* 헤더 연두 */
/*   border-collapse: collapse; */
  table-layout: fixed;
/*   border: 2px solid var(--line); */
  border: 1px solid #bfc7bb; /* 외곽선 */
  border-right: 0;
  border-bottom: 0;
  font-size: 16px;
}
.table-green th,
.table-green td{
  border: 1px solid var(--line);
  padding: 8px 10px;
  text-align: center;
  vertical-align: middle;
  word-break: keep-all;
}
.table-green thead th{
  background: var(--head);
  font-weight: 700;
}

/* 유틸리티 */
.is-centered{ margin-left:auto; margin-right:auto; }
.w-400{ width:400px; }
.w-420{ width:420px; }
.w-460{ width:460px; }


/*2. 외국인 프로그램 커리큘럼 표 끝*/


/* 스토리 영역의 모든 표를 가로 중앙에 */
/* .story table { */
/*   margin-left: auto; */
/*   margin-right: auto; */
/*   width: auto;       부트스트랩 .table의 width:100% 무효화 */
/*   display: table;    혹시 display가 변경되어 있으면 복구 */
/* } */

/* 카드형 그리드도 중앙 정렬 */
.curr-grid {
  margin-left: auto;
  margin-right: auto;
}

/* 내가 만들어준 개별 표들도 확실히 중앙 */
.kimchi-plan,
.price-table {
  margin-left: auto;
  margin-right: auto;
}

/* 1) 프로그램 섹션: 인라인 style="display:flex"도 덮어쓰기 */
@media (max-width: 991px){
  /* 태블릿(세로) 이하부터 세로 스택 */
  .story .program-row,
  .story div[style*="display: flex"]{ display:block !important; }
  .story .program-row > *,
  .story div[style*="display: flex"] > *{ margin-bottom:12px; }
}

/* 2) 그리드(커리큘럼 카드) 반응형 칼럼 수 */
.curr-grid{
  /* 데스크톱 기본: 4열 */
  grid-template-columns: repeat(4, 170px);
  width: fit-content;
  margin: 0 auto;
  border: 1px solid #bfc7bb; border-right:0; border-bottom:0;
}
.curr-grid .cell{ border-right:1px solid #bfc7bb; border-bottom:1px solid #bfc7bb; }
.curr-grid .month{ background:#dfead6; text-align:center; font-weight:700; padding:8px 6px; font-size:16px; }
.curr-grid .menu{ background:#fff; text-align:center; padding:12px 6px; line-height:1.35; font-size:16px; }

/* .wp-block-image2 img{ */
/*   box-sizing:border-box; */
/*   height:auto; */
/*   max-width:100%; */
/*   vertical-align:bottom; */
/* } */

.wp-image-9796{
	width:196px;
	 height:230px;
}

/* 기본: 가로 배치 */
.program-row{ display:flex; gap:12px; align-items: flex-start; }


/* 태블릿(가로): 3열 */
@media (max-width: 1199px){
  .curr-grid{ grid-template-columns: repeat(3, 170px); }
}
/* 태블릿(세로): 2열 */
@media (max-width: 991px){
	  .story table{ width:100%; max-width: 700px; }
  .table-green{ font-size:15px; } /* 공통 테이블 클래스 쓰는 경우 */
  .curr-grid{ grid-template-columns: repeat(2, 170px); }
}
/* 중간 폰: 1열(세로 나열) */
@media (max-width: 599px){
   /* 커리큘럼 카드: 1열 세로 나열 */
  .curr-grid{
    grid-template-columns: 1fr;
    width: 100%;
    max-width: 360px;
  }
  .curr-grid .month,
  .curr-grid .menu{ font-size: 15px; }

  /* 표 공통 축소 */
/*   .table-green th, */
/*   .table-green td{ padding: 8px 8px; } */

  /* 버튼 크기 */
  .btn, .btn-sm, .btn-primary{ font-size: 14px; padding: 8px 14px; }

  /* “2. 외국인 프로그램 (개인)” 섹션만 텍스트 더 줄이기
     구조: 두 번째 h1 이후의 flex 래퍼 안 표들만 타겟 */
  .story h1:nth-of-type(2) ~ div[style*="display: flex"] table{
    font-size: 14px;
  }
  .story h1:nth-of-type(2) ~ div[style*="display: flex"] table th,
  .story h1:nth-of-type(2) ~ div[style*="display: flex"] table td{
    padding: 6px 8px;
  }
  /* 해당 섹션 안의 소표(miniTable 등)도 함께 축소하고 싶을 때 */
  .story h1:nth-of-type(2) ~ div[style*="display: flex"] table .miniTable{
    font-size: 13px;
  }
  .story h1:nth-of-type(2) ~ div[style*="display: flex"] table .miniTable th,
  .story h1:nth-of-type(2) ~ div[style*="display: flex"] table .miniTable td{
    padding: 6px 6px;
  }
    table.f15.rsv-foreign-personal > tbody > tr > td{
    font-size: 9px !important;
    line-height: 1.45 !important;
    padding: 10px 0px !important;
  }
table.f15.rsv-foreign-personal .table-green td,
  table.f15.rsv-foreign-personal .table-green th{
    font-size: 5px !important;
    line-height: 1.4 !important;
    padding: 6px 6px !important;
  }
  
h1, .h1 {
    font-size: 18px;
}
.story {
    font-size: 15px;
}

.wp-image-9796{
	width : 100%;
/* 	width:196px; */
/* 	 height:230px; */
}

  /* 이미지 중앙 배치 */
  .story figure{ margin: 0 auto 12px; text-align: center; }
}

/* 3) 표 공통(테이블) – 가운데 정렬 + 작은 화면 최적화 */
/* .story table{ margin-left:auto; margin-right:auto; width:auto; display:table; } */