	  * {
		  margin: 0;
		  padding: 0;
		  box-sizing: border-box;
	  }

	  html {
		  background-color: #ffffff ;
	  }

	  body {
		  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, sans-serif ;
		  font-size: 18px;
		  background-color: #ffffff ;
		  color: #000000 ;
		  min-height: 100vh;
		  overflow-x: hidden ;
	  }

	  #fixedBottom {
		  display: none ;
	  }

	  /* 브레드크럼 숨김 */
	  .breadcrumbs,
	  .breadcrumb,
	  #page-heading {
		  display: none ;
	  }

	  /* 상위 컨테이너 제한 해제 */
	  .container {
		  width: 100%;
		  padding-top: 0 ;
	  }

    .document {
	    background: #1a1f29;
    }

	  .landing.practicum {
		  overflow-x: visible;
		  margin: 0;
		  padding: 0;
		  max-width: none ;
	  }

	  /* 히어로 섹션 */
	  .hero-section {
		  width: 100vw;
		  position: relative;
		  left: 50%;
		  transform: translateX(-50%);
		  background-image: url('https://it.livestudy.com/files/images/202601/47efcf10-2d20-4bcd-b7ec-fbce35c2390c.webp');
		  background-size: cover;
		  background-position: center;
		  background-repeat: no-repeat;
		  padding: 100px 0 120px;
		  text-align: center;
		  box-sizing: border-box;
		  overflow: visible;
	  }

	  .hero-container {
		  max-width: 1140px;
		  margin: 0 auto;
		  padding: 0 20px;
	  }

	  .hero-title-img {
		  width: 80%;
		  max-width: 900px;
		  height: auto;
		  margin: 0 auto 24px;
		  display: block;
	  }

	  .hero-description {
		  font-family: "Pretendard", sans-serif;
		  font-size: 24px;
		  font-weight: 600;
		  color: #1a1f29;
		  line-height: 1.5;
		  margin-bottom: 18px;
		  max-width: 800px;
		  margin-left: auto;
		  margin-right: auto;
      padding: 14px ;
	  }

	  .hero-description .accent {
		  color: #e11d48;
		  position: relative;
	  }

	  .hero-description .accent::after {
		  content: "";
		  position: absolute;
		  bottom: 2px;
		  left: 0;
		  right: 0;
		  height: 8px;
		  background: rgba(225, 29, 72, 0.25);
		  z-index: -1;
	  }

	  .hero-description .accent {
		  color: #e11d48;
		  position: relative;
	  }

	  .hero-description .accent::after {
		  content: "";
		  position: absolute;
		  bottom: 2px;
		  left: 0;
		  right: 0;
		  height: 8px;
		  background: rgba(225, 29, 72, 0.25);
		  z-index: -1;
	  }

	  .hero-badges {
		  display: flex;
		  justify-content: center;
		  gap: 12px;
		  margin-bottom: 40px;
	  }

	  .hero-badge-item {
		  width: 130px;
		  height: 130px;
		  padding: 16px;
		  background: #ffffff;
		  border: 1px solid rgba(1, 1, 1, 0.2);
		  border-radius: 16px;
		  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
		  font-family: "Pretendard", sans-serif;
		  display: flex;
		  flex-direction: column;
		  align-items: center;
		  justify-content: center;
		  text-align: center;
		  transition: transform 0.2s, box-shadow 0.2s;
	  }

	  .hero-badge-item:hover {
		  transform: translateY(-2px);
		  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12);
	  }

	  .badge-emoji {
		  font-size: 32px;
		  margin-bottom: 8px;
	  }

	  .badge-text {
		  font-size: 16px;
		  font-weight: 600;
		  color: #1a1a1a;
		  line-height: 1.3;
	  }

	  .hero-subtitle {
		  font-family: "Pretendard", sans-serif;
		  font-size: 20px;
		  font-weight: 500;
		  color: #ffffff;
		  margin-bottom: 8px;
		  letter-spacing: -0.02em;
	  }

	  .hero-title {
		  font-family: "Pretendard", sans-serif;
		  font-size: 56px;
		  font-weight: 800;
		  color: #1a1f29;
		  line-height: 1.2;
		  letter-spacing: -0.02em;
      margin-bottom: 30px;
	  }

	  /* CTA 버튼 - social_worker_level_2 참고 */
	  .hero-cta-wrap {
		  position: relative;
		  display: inline-flex;
		  flex-direction: column;
		  align-items: center;
		  gap: 12px;
	  }

	  .hero-cta-badge {
		  font-family: "Pretendard", sans-serif;
		  font-size: 14px;
		  font-weight: 700;
		  color: #1a1f29;
		  letter-spacing: 0.02em;
		  animation: hero-cta-pulse 1.5s ease-in-out infinite;
	  }

	  @keyframes hero-cta-pulse {
		  0%, 100% { opacity: 1; transform: scale(1); }
		  50% { opacity: 0.85; transform: scale(1.02); }
	  }

	  .hero-cta {
		  display: inline-flex;
		  align-items: center;
		  justify-content: center;
		  padding: 18px 40px;
		  background-color: #f43f5e;
		  color: #ffffff;
		  font-family: "Pretendard", sans-serif;
		  font-size: 18px;
		  font-weight: 600;
		  text-decoration: none;
		  border-radius: 12px;
		  transition: all 0.3s ease;
		  border: none;
		  cursor: pointer;
		  box-shadow: 0 4px 16px rgba(244, 63, 94, 0.25);
	  }

	  .hero-cta::after {
		  content: "→";
		  margin-left: 8px;
	  }

	  .hero-cta:hover {
		  background-color: #e11d48;
		  color: #ffffff;
		  transform: translateY(-2px);
		  box-shadow: 0 8px 24px rgba(244, 63, 94, 0.35);
	  }

	  /* 오른쪽 이미지 카드 영역 */
	  .hero-cards-area {
		  display: flex;
		  align-items: center;
		  gap: 16px;
		  padding-left: 40px;
	  }

	  .hero-card {
		  width: 180px;
		  height: 260px;
		  border-radius: 16px;
		  overflow: hidden;
		  position: relative;
		  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
	  }

	  .hero-card img {
		  width: 100%;
		  height: 100%;
		  object-fit: cover;
	  }

	  .hero-card-text {
		  position: absolute;
		  bottom: 0;
		  left: 0;
		  right: 0;
		  background: rgba(255, 255, 255, 0.92);
		  padding: 16px;
		  color: #1a1f29;
		  font-family: "Pretendard", sans-serif;
		  font-size: 16px;
		  font-weight: 500;
		  line-height: 1.4;
	  }

	  .hero-card-text .card-highlight {
		  display: block;
		  font-size: 20px;
		  font-weight: 700;
		  color: #1a1f29;
		  margin-bottom: 2px;
	  }

	  /* 특징 섹션 */
	  .features-section {
		  width: 100vw;
		  position: relative;
		  left: 50%;
		  transform: translateX(-50%);
		  padding: 100px 0;
		  background: #f8f9fa;
	  }

	  .features-container {
		  max-width: 1200px;
		  margin: 0 auto;
		  padding: 0 40px;
	  }

	  .features-grid {
		  display: flex;
		  gap: 60px;
		  justify-content: center;
	  }

	  .feature-item {
		  flex: 1;
		  max-width: 320px;
		  text-align: center;
		  padding: 28px 20px;
		  border-radius: 20px;
		  background: transparent;
		  border: 1px solid transparent;
		  transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease, border-color 0.3s ease;
	  }

	  .feature-item:hover {
		  transform: translateY(-8px);
		  background: #ffffff;
		  border-color: rgba(244, 63, 94, 0.15);
		  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.08);
	  }

	  .feature-item:hover .feature-icon {
		  background: #fde8ed;
		  transition: background 0.3s ease;
	  }

	  .feature-icon {
		  width: 160px;
		  height: 160px;
		  margin: 0 auto 24px;
		  background: #e8f4f8;
		  border-radius: 50%;
		  overflow: hidden;
		  transition: background 0.3s ease;
	  }

	  .feature-icon img {
		  width: 100%;
		  height: 100%;
		  object-fit: cover;
	  }

	  .feature-title {
		  font-family: "Pretendard", sans-serif;
		  font-size: 22px;
		  font-weight: 700;
		  color: #1a1f29;
		  margin-bottom: 12px;
		  line-height: 1.3;
	  }

	  .feature-description {
		  font-family: "Pretendard", sans-serif;
		  font-size: 18px;
		  font-weight: 400;
		  color: #4f5969;
		  line-height: 1.6;
	  }

	  /* 공통 섹션 타이틀 */
	  .section-title {
		  font-family: "Pretendard", sans-serif;
		  font-size: 36px;
		  font-weight: 700;
		  color: #1a1f29;
		  text-align: center;
		  margin-bottom: 80px;
	  }

	  /* 로드맵 섹션 */
	  .roadmap-section {
		  width: 100vw;
		  position: relative;
		  left: 50%;
		  transform: translateX(-50%);
		  padding: 100px 0;
		  background: #ffffff;
	  }

	  .roadmap-container {
		  max-width: 1000px;
		  margin: 0 auto;
		  padding: 0 40px;
	  }

	  .roadmap-title {
		  font-family: "Pretendard", sans-serif;
		  font-size: 40px;
		  font-weight: 700;
		  color: #1a1f29;
		  text-align: center;
		  margin-bottom: 80px;
	  }

	  .roadmap-timeline {
		  position: relative;
	  }

	  /* 세로줄 */
	  .roadmap-timeline::before {
		  content: "";
		  position: absolute;
		  left: 50%;
		  transform: translateX(-50%);
		  top: 0;
		  bottom: 0;
		  width: 3px;
		  background: #e5e7eb;
	  }

	  .roadmap-item {
		  display: flex;
		  align-items: flex-start;
		  margin-bottom: 24px;
		  position: relative;
		  min-height: 120px;
	  }

	  .roadmap-item:last-child {
		  margin-bottom: 0;
	  }

	  /* 왼쪽 배치 */
	  .roadmap-item.left .roadmap-content {
		  width: calc(50% - 40px);
		  text-align: right;
		  padding-right: 40px;
		  border-right: 3px solid transparent;
		  transition: border-color 0.3s ease, transform 0.3s ease;
	  }

	  .roadmap-item.left:hover .roadmap-content {
		  border-right-color: #f43f5e;
		  transform: translateX(-6px);
	  }

	  .roadmap-item.left .roadmap-badge {
		  left: 50%;
		  transform: translateX(-50%);
		  transition: transform 0.3s ease, box-shadow 0.3s ease;
	  }

	  .roadmap-item.left:hover .roadmap-badge {
		  transform: translateX(-50%) scale(1.15);
		  box-shadow: 0 6px 20px rgba(244, 63, 94, 0.4);
	  }

	  /* 오른쪽 배치 */
	  .roadmap-item.right .roadmap-content {
		  width: calc(50% - 40px);
		  margin-left: calc(50% + 40px);
		  text-align: left;
		  padding-left: 40px;
		  border-left: 3px solid transparent;
		  transition: border-color 0.3s ease, transform 0.3s ease;
	  }

	  .roadmap-item.right:hover .roadmap-content {
		  border-left-color: #f43f5e;
		  transform: translateX(6px);
	  }

	  .roadmap-item.right .roadmap-badge {
		  left: 50%;
		  transform: translateX(-50%);
		  transition: transform 0.3s ease, box-shadow 0.3s ease;
	  }

	  .roadmap-item.right:hover .roadmap-badge {
		  transform: translateX(-50%) scale(1.15);
		  box-shadow: 0 6px 20px rgba(244, 63, 94, 0.4);
	  }

	  .roadmap-badge {
		  position: absolute;
		  top: 0;
		  width: 48px;
		  height: 48px;
		  background: linear-gradient(135deg, #f43f5e 0%, #e11d48 100%);
		  border-radius: 50%;
		  display: flex;
		  align-items: center;
		  justify-content: center;
		  font-family: "Pretendard", sans-serif;
		  font-size: 20px;
		  font-weight: 700;
		  color: #ffffff;
		  z-index: 2;
	  }

	  .roadmap-content-title {
		  font-family: "Pretendard", sans-serif;
		  font-size: 20px;
		  font-weight: 700;
		  color: #1a1f29;
		  margin-bottom: 8px;
		  line-height: 1.4;
	  }

	  .roadmap-content-list {
		  font-family: "Pretendard", sans-serif;
		  font-size: 18px;
		  font-weight: 400;
		  color: #4f5969;
		  line-height: 1.8;
		  list-style: none;
		  margin: 0;
	  }

	  .roadmap-note {
		  font-size: 16px;
		  color: #828c9c;
		  margin-top: 8px;
	  }

	  /* 모집요강 섹션 */
	  .recruit-section {
		  width: 100vw;
		  position: relative;
		  left: 50%;
		  transform: translateX(-50%);
		  padding: 100px 0;
		  background: #fef2f4;
	  }

	  .recruit-container {
		  max-width: 1100px;
		  margin: 0 auto;
		  padding: 0 40px;
	  }

	  .recruit-section .section-title {
		  color: #1a1f29;
	  }

	  .highlight-date {
		  color: #f43f5e;
		  font-weight: 700;
	  }

	  .recruit-grid {
		  display: grid;
		  grid-template-columns: 1fr 1fr;
		  gap: 24px;
	  }

	  .recruit-card {
		  background: #ffffff;
		  border-radius: 16px;
		  padding: 28px 32px;
		  border: 1px solid rgba(244, 63, 94, 0.15);
		  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
	  }

	  .recruit-card:hover {
		  transform: translateY(-6px);
		  box-shadow: 0 12px 32px rgba(244, 63, 94, 0.12);
		  border-color: rgba(244, 63, 94, 0.4);
	  }

	  .recruit-card.full-width {
		  grid-column: 1 / -1;
	  }

	  .recruit-label {
		  font-family: "Pretendard", sans-serif;
		  font-size: 16px;
		  font-weight: 600;
		  color: #f43f5e;
		  margin-bottom: 8px;
	  }

	  .recruit-value {
		  font-family: "Pretendard", sans-serif;
		  font-size: 24px;
		  font-weight: 700;
		  color: #1a1f29;
	  }

	  .recruit-value-sub {
		  font-family: "Pretendard", sans-serif;
		  font-size: 18px;
		  font-weight: 400;
		  color: #6b7684;
		  margin-top: 4px;
	  }

	  .recruit-price-row {
		  display: flex;
		  gap: 32px;
		  margin-top: 16px;
	  }

	  .recruit-price-item {
		  flex: 1;
	  }

	  .recruit-price-region {
		  font-family: "Pretendard", sans-serif;
		  font-size: 18px;
		  font-weight: 600;
		  color: #1a1f29;
		  margin-bottom: 4px;
	  }

	  .recruit-price-sub {
		  font-family: "Pretendard", sans-serif;
		  font-size: 16px;
		  color: #6b7684;
		  margin-bottom: 8px;
	  }

	  .recruit-price-original {
		  font-family: "Pretendard", sans-serif;
		  font-size: 18px;
		  color: #8b95a1;
		  text-decoration: line-through;
		  margin-right: 8px;
	  }

	  .recruit-price-discount {
		  font-family: "Pretendard", sans-serif;
		  font-size: 24px;
		  font-weight: 700;
		  color: #f43f5e;
	  }

	  .recruit-seminar-content {
		  display: flex;
		  gap: 32px;
		  margin-top: 16px;
	  }

	  .recruit-seminar-info {
		  flex: 1;
	  }

	  .recruit-seminar-images {
		  display: flex;
		  gap: 12px;
	  }

	  .recruit-seminar-images img {
		  width: 180px;
		  height: 120px;
		  object-fit: cover;
		  border-radius: 12px;
	  }

	  .recruit-list {
		  font-family: "Pretendard", sans-serif;
		  font-size: 18px;
		  color: #4e5968;
		  line-height: 1.8;
		  margin: 0;
	  }

	  .recruit-note {
		  font-family: "Pretendard", sans-serif;
		  font-size: 16px;
		  color: #6b7684;
		  margin-top: 12px;
		  line-height: 1.6;
	  }

	  /* 라이트박스 */
	  .lightbox {
		  display: none;
		  position: fixed;
		  top: 0;
		  left: 0;
		  right: 0;
		  bottom: 0;
		  background: rgba(0, 0, 0, 0.8);
		  z-index: 9999;
		  align-items: center;
		  justify-content: center;
		  cursor: pointer;
	  }

	  .lightbox.active {
		  display: flex;
	  }

	  .lightbox img {
		  max-width: 60% ;
		  max-height: 60% ;
		  object-fit: contain;
		  border-radius: 8px;
	  }

	  .lightbox-close {
		  position: absolute;
		  top: 24px;
		  right: 24px;
		  width: 48px;
		  height: 48px;
		  background: rgba(255, 255, 255, 0.1);
		  border: none;
		  border-radius: 50%;
		  cursor: pointer;
		  display: flex;
		  align-items: center;
		  justify-content: center;
		  transition: background 0.2s;
	  }

	  .lightbox-close:hover {
		  background: rgba(255, 255, 255, 0.2);
	  }

	  .lightbox-close::before,
	  .lightbox-close::after {
		  content: "";
		  position: absolute;
		  width: 24px;
		  height: 2px;
		  background: #ffffff;
	  }

	  .lightbox-close::before {
		  transform: rotate(45deg);
	  }

	  .lightbox-close::after {
		  transform: rotate(-45deg);
	  }

	  .recruit-seminar-images img {
		  cursor: pointer;
		  transition: transform 0.2s;
	  }

	  .recruit-seminar-images img:hover {
		  transform: scale(1.03);
	  }

	  .seminar-image-item {
		  text-align: center;
	  }

	  .seminar-image-caption {
		  font-family: "Pretendard", sans-serif;
		  font-size: 16px;
		  font-weight: 500;
		  color: #6b7684;
		  margin-top: 8px;
	  }

	  .seminar-schedule {
		  display: flex;
		  gap: 12px;
		  margin-bottom: 16px;
	  }

	  .seminar-schedule {
		  margin-bottom: 12px;
	  }

	  .seminar-class {
		  flex: 0 0 48px;
		  min-width: 48px;
		  display: inline-flex;
		  align-items: center;
		  justify-content: center;
		  font-family: "Pretendard", sans-serif;
		  font-size: 16px;
		  font-weight: 700;
		  color: #f43f5e;
		  background: rgba(244, 63, 94, 0.15);
		  padding: 4px 10px;
		  border-radius: 4px;
		  margin-right: 12px;
	  }

	  .seminar-badge {
		  flex: 0 0 130px;
		  min-width: 130px;
		  display: inline-flex;
		  align-items: center;
		  justify-content: center;
		  font-family: "Pretendard", sans-serif;
		  font-size: 24px;
		  font-weight: 700;
		  color: #1a1f29;
		  text-align: center;
		  white-space: nowrap;
	  }

	  .seminar-badge strong {
		  color: #f43f5e;
		  font-weight: 700;
		  margin-left: 6px;
	  }

	  .recruit-cta-wrap {
		  text-align: center;
		  margin-top: 48px;
	  }

	  .recruit-cta {
		  display: inline-flex;
		  align-items: center;
		  justify-content: center;
		  padding: 18px 40px;
		  background-color: #f43f5e;
		  color: #ffffff;
		  font-family: "Pretendard", sans-serif;
		  font-size: 18px;
		  font-weight: 600;
		  text-decoration: none;
		  border-radius: 12px;
		  transition: all 0.3s ease;
		  border: none;
		  cursor: pointer;
		  box-shadow: 0 4px 16px rgba(244, 63, 94, 0.25);
	  }

	  .recruit-cta::after {
		  content: "→";
		  margin-left: 8px;
	  }

	  .recruit-cta:hover {
		  background-color: #e11d48;
		  color: #ffffff;
		  transform: translateY(-2px);
		  box-shadow: 0 8px 24px rgba(244, 63, 94, 0.35);
	  }

	  /* 실습기관 검색 섹션 */
	  .search-section {
		  width: 100vw;
		  position: relative;
		  left: 50%;
		  transform: translateX(-50%);
		  background: #f5f7fa;
		  padding: 100px 0;
	  }

	  .search-container {
		  max-width: 1100px;
		  margin: 0 auto;
		  padding: 0 40px;
	  }

	  .search-header {
		  text-align: center;
		  margin-bottom: 40px;
	  }

	  .search-header h2 {
		  font-size: 32px;
		  font-weight: 700;
		  color: #1a1a1a;
		  margin-bottom: 10px;
	  }

	  .search-header p {
		  font-size: 18px;
		  color: #666;
	  }

	  .search-notice {
		  margin-top: 12px;
		  font-size: 18px ;
		  color: #e74c3c ;
	  }

	  .external-link-btn {
		  display: inline-flex;
		  align-items: center;
		  gap: 6px;
		  margin-top: 16px;
		  padding: 10px 20px;
		  background: #f43f5e;
		  border-radius: 8px;
		  font-family: "Pretendard", sans-serif;
		  font-size: 18px;
		  font-weight: 600;
		  color: #ffffff;
		  text-decoration: none;
		  transition: all 0.2s;
	  }

	  .external-link-btn:hover {
		  background: #e11d48;
		  color: #ffffff;
	  }

	  .external-link-btn svg {
		  flex-shrink: 0;
	  }

	  .search-box {
		  background: #fff;
		  border-radius: 12px;
		  padding: 24px;
		  margin-bottom: 24px;
		  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
	  }

	  .search-row {
		  display: flex;
		  flex-wrap: wrap;
		  gap: 16px;
		  align-items: flex-end;
	  }

	  .search-group {
		  display: flex;
		  flex-direction: column;
		  gap: 6px;
	  }

	  .search-group label {
		  font-size: 16px;
		  font-weight: 600;
		  color: #555;
	  }

	  .search-group select,
	  .search-group input {
		  padding: 10px 14px;
		  border: 1px solid #ddd;
		  border-radius: 8px;
		  font-size: 18px;
		  min-width: 150px;
	  }

	  .btn {
		  padding: 10px 20px;
		  border: none;
		  border-radius: 8px;
		  font-size: 18px;
		  font-weight: 600;
		  cursor: pointer;
		  transition: all 0.2s;
	  }

	  .btn-primary {
		  background: #f43f5e;
		  color: #fff;
	  }

	  .btn-primary:hover {
		  background: #e11d48;
	  }

	  .result-box {
		  background: #fff;
		  border-radius: 12px;
		  padding: 24px;
		  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
	  }

	  .result-header {
		  display: flex;
		  justify-content: space-between;
		  align-items: center;
		  margin-bottom: 20px;
		  padding-bottom: 16px;
		  border-bottom: 1px solid #eee;
	  }

	  .result-count {
		  font-size: 18px;
		  color: #333;
	  }

	  .result-count strong {
		  color: #f43f5e;
		  font-weight: 700;
	  }

	  .table-wrapper {
		  overflow-x: auto;
	  }

	  table {
		  width: 100%;
		  border-collapse: collapse;
		  font-size: 18px;
	  }

	  thead th {
		  background: #f8fafc;
		  padding: 14px 12px;
		  text-align: center;
		  font-weight: 600;
		  color: #374151;
		  border-bottom: 2px solid #e5e7eb;
		  white-space: nowrap;
	  }

	  tbody td {
		  padding: 14px 12px;
		  border-bottom: 1px solid #f0f0f0;
		  color: #4b5563;
		  text-align: center;
	  }

	  .main-row {
		  cursor: pointer;
		  transition: background 0.2s;
	  }

	  .main-row:hover {
		  background: #f0f7ff;
	  }

	  .main-row.expanded {
		  background: #e0edff;
	  }

	  .org-name {
		  font-weight: 600;
		  color: #1a1a1a;
	  }

	  .status-badge {
		  display: inline-block;
		  padding: 4px 10px;
		  border-radius: 20px;
		  font-size: 16px;
		  font-weight: 600;
	  }

	  .status-active {
		  background: #dcfce7;
		  color: #166534;
	  }

	  .status-stop {
		  background: #fef3c7;
		  color: #92400e;
	  }

	  .status-cancel {
		  background: #fee2e2;
		  color: #991b1b;
	  }

	  .detail-row {
		  display: none;
	  }

	  .detail-row.show {
		  display: table-row;
	  }

	  .detail-row td {
		  background: #f8fafc;
		  padding: 0;
	  }

	  .detail-content {
		  padding: 20px 24px;
	  }

	  .detail-grid {
		  display: grid;
		  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
		  gap: 16px;
	  }

	  .detail-item {
		  display: flex;
		  flex-direction: column;
		  gap: 4px;
	  }

	  .detail-label {
		  font-size: 16px;
		  color: #6b7280;
		  font-weight: 500;
	  }

	  .detail-value {
		  font-size: 18px;
		  color: #1f2937;
	  }

	  .map-container {
		  margin-top: 16px;
		  border-radius: 8px;
		  overflow: hidden;
		  border: 1px solid #e5e7eb;
	  }

	  .map-box {
		  width: 100%;
		  height: 400px;
		  background: #f0f0f0;
	  }

	  .map-loading {
		  display: flex;
		  align-items: center;
		  justify-content: center;
		  height: 400px;
		  color: #666;
		  font-size: 18px;
	  }

	  .map-error {
		  display: flex;
		  align-items: center;
		  justify-content: center;
		  height: 100px;
		  color: #991b1b;
		  font-size: 18px;
		  background: #fee2e2;
		  border-radius: 8px;
	  }

	  .pagination {
		  display: flex;
		  justify-content: center;
		  gap: 8px;
		  margin-top: 24px;
	  }

	  .pagination a, .pagination span {
		  padding: 8px 14px;
		  border: 1px solid #ddd;
		  background: #fff;
		  border-radius: 6px;
		  text-decoration: none;
		  font-size: 18px;
		  color: #333;
		  transition: all 0.2s;
	  }

	  .pagination a:hover {
		  background: #f3f4f6;
	  }

	  .pagination .active {
		  background: #f43f5e;
		  color: #fff;
		  border-color: #f43f5e;
	  }

	  .no-data {
		  text-align: center;
		  padding: 60px 20px;
		  color: #666;
		  font-size: 18px;
	  }

	  /* 유의사항 섹션 - 네이비 계열 */
	  .note-section {
		  width: 100vw;
		  position: relative;
		  left: 50%;
		  transform: translateX(-50%);
		  background: #1a1f29;
		  padding: 80px 0 160px;
	  }

	  .note-container {
		  max-width: 1100px;
		  margin: 0 auto;
		  padding: 0 40px;
	  }

	  .note-title {
		  font-family: "Pretendard", sans-serif;
		  font-size: 32px;
		  font-weight: 700;
		  color: #e8eaed;
		  margin-bottom: 32px;
		  line-height: 1.3;
	  }

	  .note-content {
		  font-size: 18px;
		  font-weight: 400;
		  color: #c1bfcd;
		  line-height: 1.65;
	  }

	  .note-list {
		  list-style: none;
		  padding: 0;
		  margin: 0;
	  }

	  .note-list > li {
		  margin-bottom: 20px;
		  padding-left: 24px;
		  position: relative;
		  font-family: "Pretendard", sans-serif;
		  font-size: 18px;
		  font-weight: 400;
		  line-height: 1.7;
		  color: #c1bfcd;
	  }

	  .note-list > li::before {
		  content: "";
		  position: absolute;
		  left: 8px;
		  top: 10px;
		  width: 4px;
		  height: 4px;
		  background: #c1bfcd;
		  border-radius: 50%;
	  }

	  .note-list > li:last-child {
		  margin-bottom: 0;
	  }

	  .note-sub-list {
		  list-style: none;
		  padding: 0;
		  margin: 12px 0 0 0;
	  }

	  .note-sub-list li {
		  padding-left: 20px;
		  position: relative;
		  font-size: 16px;
		  line-height: 1.7;
		  margin-bottom: 8px;
		  color: #b8bcc4;
	  }

	  .note-sub-list li::before {
		  content: "";
		  position: absolute;
		  left: 4px;
		  top: 10px;
		  width: 6px;
		  height: 1px;
		  background: #b8bcc4;
	  }

	  .note-highlight {
		  color: #f43f5e;
		  font-weight: 500;
	  }

	  /* 유의사항 테이블 */
	  .note-table-wrapper {
		  margin-top: 16px;
		  overflow-x: auto;

      border-top: 0;
      border-bottom: 0;
      margin-bottom: 0;
	  }

	  .note-table {
		  width: 100%;
		  border-collapse: collapse;
		  font-size: 18px;
		  min-width: 500px;
      border-top: 0;
      border-bottom: 0;
      margin-bottom: 0;
	  }

	  .note-table th,
	  .note-table td {
		  padding: 12px 16px ;
		  text-align: center ;
		  border: 1px solid #2e353e ;
		  color: #c1bfcd ;
	  }

	  .note-table th {
		  background: #242a33 ;
		  font-weight: 600;
		  font-size: 18px;
		  color: #e8eaed ;
	  }

	  .note-table td {
		  background: #1e242c;
		  font-size: 18px;
		  line-height: 1.5;
	  }

	  .note-table th {
		  width: 50%;
		  text-align: center ;
		  vertical-align: top;
	  }

	  .note-table td {
		  width: 50%;
		  text-align: left ;
		  vertical-align: top;
	  }

	  .note-table td ul {
		  list-style: none;
		  padding: 0;
		  margin: 0;
	  }

	  .note-table td ul li {
		  position: relative;
		  padding-left: 16px;
		  margin-bottom: 8px;
		  line-height: 1.6;
	  }

	  .note-table td ul li:last-child {
		  margin-bottom: 0;
	  }

	  .note-table td ul li::before {
		  content: "•";
		  position: absolute;
		  left: 0;
		  color: #c1bfcd;
	  }

	  /* 선이수과목 툴팁 */
	  .info-tooltip-wrap {
		  position: relative;
		  display: inline-block;
		  margin-left: 4px;
		  vertical-align: middle;
      padding-bottom: 5px;
	  }

	  .info-icon {
		  display: inline-flex;
		  align-items: center;
		  justify-content: center;
		  width: 20px;
		  height: 20px;
		  background: #fbc4ce;
		  border-radius: 50%;
		  font-family: "Pretendard", sans-serif;
		  font-size: 14px;
		  font-weight: 700;
		  color: #9f1239;
		  cursor: help;
		  transition: background 0.2s, color 0.2s;
	  }

	  .info-icon:hover {
		  background: #f9a8b4;
		  color: #7f1d1d;
	  }

	  .info-tooltip {
		  position: absolute;
		  bottom: calc(100% + 12px);
		  left: 50%;
		  transform: translateX(-50%);
		  width: 420px;
		  background: #ffffff;
		  border-radius: 12px;
		  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
		  padding: 20px;
		  opacity: 0;
		  visibility: hidden;
		  transition: opacity 0.2s, visibility 0.2s;
		  z-index: 100;
	  }

	  .info-tooltip::after {
		  content: "";
		  position: absolute;
		  top: 100%;
		  left: 50%;
		  transform: translateX(-50%);
		  border: 8px solid transparent;
		  border-top-color: #ffffff;
	  }

	  .info-tooltip-wrap:hover .info-tooltip {
		  opacity: 1;
		  visibility: visible;
	  }

	  .tooltip-table {
		  width: 100%;
		  border-collapse: collapse;
		  font-size: 16px;
	    border-top: 0;
      border-bottom: 0;
      margin-bottom: 0;
	  }

	  .tooltip-table th,
	  .tooltip-table td {
		  padding: 10px 12px;
		  border: 1px solid #e5e7eb;
		  text-align: left;
		  vertical-align: top;
	  }

	  .tooltip-table th {
		  background: #f8f9fa;
		  font-weight: 600;
		  color: #1a1f29;
		  white-space: nowrap;
	  }

	  .tooltip-table td {
		  color: #4f5969;
		  line-height: 1.5;
	  }

	  .tooltip-table tr:first-child th {
		  background: #f43f5e;
		  color: #ffffff;
	  }

	  .tooltip-table tr:first-child td {
		  background: #f43f5e;
		  color: #ffffff;
	  }
