@charset "utf-8";

/* 학습 목표 테이블 */
.c_table_bg {
  position: relative;
  border-collapse: collapse;
  width: 100%;
  overflow: scroll;
  background: white;
  background: url(/images/grit_watermark2.png) no-repeat;
  background-size: 15%; /* 배경 이미지 크기 */
  background-position: 22% 60%; /* 배경 이미지 위치 */
  background-attachment: fixed;
}

.c_table_bg th {
  background-color: #F2F0E6;
  border: 1px solid #D9D7CE;
  padding: 8px;
  text-align: center;
}

.c_table_bg td {
  border: 1px solid #D9D7CE;
  padding: 3px;
  text-align: center;
  vertical-align: middle;
}

.c_table_bg .td3 {
 text-align: left;
 background: #faf9f3;
 padding: 5px;
 text-align: left;
 vertical-align: middle;
}

.c_table_bg thead {
  position: sticky;
  top: 0;
  z-index: 1;
}


/* 아래 학습 목표 메인 */
.c_table_bg1 {
  position: relative;
  border-collapse: collapse;
  width: 100%;
  overflow: scroll;
  background: white;
  background: url(/images/grit_watermark2.png) no-repeat;
  background-size: 25%; /* 배경 이미지 크기 */
  background-position: 50% 40%; /* 배경 이미지 위치 */
  background-attachment: fixed;
}


.c_table_bg1 th {
  background-color: #F2F0E6;
  border: 1px solid #D9D7CE;
  padding: 8px;
  text-align: center;
}

.c_table_bg1 td {
  padding: 3px;
  text-align: center;
  vertical-align: middle;
}

.c_table_bg1 .td3 {
 text-align: left;
 background: #faf9f3;
 padding: 5px;
 text-align: center;
 vertical-align: middle;
}

/* 테이블 헤더 고정 스타일 */
.c_table_bg1 thead {
  position: sticky;
  top: 0;
  z-index: 1;
}

/* 아래 학습 목표 페이지 상단 학습 목표 */
.c_table_bg2 {
  position: relative;
  border-collapse: collapse;
  width: 100%;
  overflow: scroll;
  background: white;
  background: url(/images/grit_watermark2.png) no-repeat;
  background-size: 25%; /* 배경 이미지 크기 */
  background-position: 50% 22%; /* 배경 이미지 위치 */
  background-attachment: fixed;
}


.c_table_bg2 th {
  background-color: #F2F0E6;
  border: 1px solid #D9D7CE;
  padding: 8px;
  text-align: center;
}

.c_table_bg2 td {
  padding: 3px;
  text-align: center;
  vertical-align: middle;
}

.c_table_bg2 .td3 {
 text-align: left;
 background: #faf9f3;
 padding: 5px;
 text-align: center;
 vertical-align: middle;
}

/* 테이블 헤더 고정 스타일 */
.c_table_bg2 thead {
  position: sticky;
  top: 0;
  z-index: 1;
}

/* 수업게시판 상단 */
.c_table_bg3 {
  position: relative;
  border-collapse: collapse;
  width: 100%;
  overflow: scroll;
  background: white;
  background: url(/images/grit_watermark2.png) no-repeat;
  background-size: 25%; /* 배경 이미지 크기 */
  background-position: 45% 38%; /* 배경 이미지 위치 */
  background-attachment: fixed;
}

.c_table_bg3 th {
  background-color: #F2F0E6;
  border: 1px solid #D9D7CE;
  padding: 8px;
  text-align: center;
}

.c_table_bg3 td {
  padding: 3px;
  text-align: left;
  vertical-align: middle;
}

.c_table_bg3 .td3 {
 text-align: center;
 background: #faf9f3;
 padding: 5px;
 vertical-align: middle;
}

.c_table_bg3 thead {
  position: sticky;
  top: 0;
  z-index: 1;
}


/* 링크 스타일 */
.frame a {
  color: #fff; /* 링크 텍스트 색상 설정 */
  text-decoration: none; /* 밑줄 제거 */
}

.frame a:hover {
  color: #ff5500; /* 호버 시 링크 텍스트 색상 설정 */
}

.image-container img {
    /* 기본 상태에서 흑백 필터 적용 */
    filter: grayscale(100%);
    transition: filter 0.3s ease; /* 전환 효과 */
}

.image-container:hover img {
    /* 마우스 오버 시 흑백 필터 해제 */
    filter: grayscale(0%);
}