@charset "UTF-8";
:root {
--header-title-bg:#e2e1fb;
--header-title-border:#4F46E5;
}
* {box-sizing:border-box;word-break:keep-all;}
.curriculum-map-section {
    /* Background colors */
    --color-class-01: #eaf6fd; /* 연계전공 필수 */
    --color-class-02: #eaeffc; /* 식품영양학과 */
    --color-class-03: #e2f8f7; /* 제약공학과 */
    --color-class-04: #e4f4f9; /* 보건의료정보 */
    --color-class-05: #eaeefc; /* 물리치료학과 */
    --color-class-06: #eceafa; /* 스포츠과학과 */
    --color-class-07: #ddeef0; /* 작업치료학과 */
    --color-class-08: #fef7d8; /* 외식조리학과 */
    --color-class-09: #dff5ea; /* 프로네시스융합 */
    --color-class-10: #ffe9cf; /* 전기공학과 */
    --color-class-11: #dcf3fb; /* 전자SW공학과 */
    --color-class-12: #e3e6fb; /* 컴퓨터공학부 */
    --color-class-13: #fdeafa; /* 게임학과 */
    --color-class-14: #fdf3e6; /* 인공지능학과 */
    --color-class-15: #fefad4; /* 디지털마케팅 */
    --color-class-16: #feeee8; /* 건축학부 */
    --color-class-17: #fff4e6; /* 미래자동차학과 */
    --color-class-18: #fffaf4; /* 미래형자동차융합 */
    --color-class-19: #feeadc; /* 기계공학부 */
    --color-class-20: #e2f8ec; /* 무역물류학부 */
    --color-class-21: #fdeeed; /* MSC교육부 */
    --color-class-22: #eceef1; /* SW융합 공통 */
    --color-class-23: #f2f0f9; /* 경영학부 */
    --color-class-24: #e8edf5; /* 수학교육과 */
    --color-class-25: #fefee0; /* 웹툰디자인 */
    --color-class-26: #dcfaf3; /* 신규 26 */
    --color-class-27: #fdf0f5; /* 신규 27 */
    --color-class-28: #fdf6e8; /* 신규 28 */
    --color-class-29: #eefade; /* 신규 29 */
    --color-class-30: #fdecea; /* 신규 30 */

    /* Text colors */
    --text-class-01: #01567a; /* 연계전공 필수 */
    --text-class-02: #0e2b8a; /* 식품영양학과 */
    --text-class-03: #055450; /* 제약공학과 */
    --text-class-04: #044d6c; /* 보건의료정보 */
    --text-class-05: #1a2f90; /* 물리치료학과 */
    --text-class-06: #2a1f88; /* 스포츠과학과 */
    --text-class-07: #064a50; /* 작업치료학과 */
    --text-class-08: #6b3a00; /* 외식조리학과 */
    --text-class-09: #0f6b45; /* 프로네시스융합 */
    --text-class-10: #a35a00; /* 전기공학과 */
    --text-class-11: #0b6e94; /* 전자SW공학과 */
    --text-class-12: #29348f; /* 컴퓨터공학부 */
    --text-class-13: #7a0880; /* 게임학과 */
    --text-class-14: #886f0b; /* 인공지능학과 */
    --text-class-15: #6e4400; /* 디지털마케팅 */
    --text-class-16: #8c2200; /* 건축학부 */
    --text-class-17: #7a3200; /* 미래자동차학과 */
    --text-class-18: #6b2e00; /* 미래형자동차융합 */
    --text-class-19: #6e1e00; /* 기계공학부 */
    --text-class-20: #0a4020; /* 무역물류학부 */
    --text-class-21: #6a1010; /* MSC교육부 */
    --text-class-22: #252c38; /* SW융합 공통 */
    --text-class-23: #2a1e4a; /* 경영학부 */
    --text-class-24: #1e2e4a; /* 수학교육과 */
    --text-class-25: #444400; /* 웹툰디자인 */
    --text-class-26: #064438; /* 기타 1 */
    --text-class-27: #7a1040; /* 기타 2 */
    --text-class-28: #6a4400; /* 기타 3 */
    --text-class-29: #285010; /* 기타 4 */
    --text-class-30: #7a1408; /* 기타 5 */
}
.curriculum-map-section { margin: 0rem auto; max-width: var(--content-max-width); overflow:hidden;}
.curriculum-map-section > h3 { font-size: 1.25rem; font-weight: 600; font-family: 'S-core','Escoredream';letter-spacing: -0.05em; margin-bottom: 10px; text-align: center; border-radius: 2rem; background-color: var(--header-title-bg); border: 2px solid var(--header-title-border); color: var(--header-title-border); padding: 0.3em 1.5em; }
.curriculum-map caption { font-size: 0px !important; position: absolute; width: 100%; }
.curriculum-map { width: 100%; overflow: hidden; font-size: 1rem;/* border: 1px solid #405988; */
}
.curriculum-map-box { box-shadow: 0px 2px 0px rgba(0,0,0,0.1); padding-bottom: 0px; }
.map-scroll { position: relative; width: 100%; white-space: nowrap; overflow: auto; /*max-height:70vh;*/ scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;  cursor: grab; /* 기본 마우스 커서를 잡기 모양으로 변경 */  user-select: none; /* 드래그 시 내부 요소 선택 방지 */ }
.map-scroll:active,
.map-scroll.active {
  cursor: grabbing; /* 클릭하거나 드래그 중일 때 잡은 모양으로 변경 */
}
.curriculum-map > table th,.curriculum-map > table td{font-size:13px;}
.curriculum-map > table { position: relative; border-collapse: collapse; border-spacing: 1px; min-width: 100%; table-layout: auto; font-size: 0.8em; border-radius: 20px 0 0 0; white-space: nowrap; }
.curriculum-map > table > thead { background-color: #333; color: #ffffff; box-shadow: 0px 2px 4px rgba(0,0,0,0.15); }
.curriculum-map > table > thead { position: sticky; top: 0; left: 0; z-index: 2; }
.curriculum-map > table > thead th, .curriculum-map > table > thead td { border: 1px solid #ccc; }
.curriculum-map > table > thead th, .curriculum-map > table > thead td, .curriculum-map > table > tbody th { text-align: center; }
.curriculum-map > table > thead > tr > th:first-child, .curriculum-map > table > tbody > tr > th:first-child { position: sticky; z-index: 3; left: 0; box-shadow: 2px 0px 4px rgba(0,0,0,0.12); white-space: normal; min-width: 50px; width: 8%; vertical-align: middle; }
.curriculum-map > table > thead th:first-child { background-color: #405988; color: #fff; }
.curriculum-map > table > tbody > tr > th:first-child { text-align: center; font-weight: 700; }
.curriculum-map > table > tbody > tr > th:first-child .map-class-parent { display: flex; align-items: center; justify-content: center; min-height: 40px; font-weight: 700; letter-spacing: -0.03em; }
.curriculum-map > table > thead th { color: #111; padding: 5px 8px; }
.curriculum-map > table > thead th:nth-of-type(2) { background-color: #e9e9e9 !important; }
.curriculum-map > table > thead th:nth-of-type(3) { background-color: #e9e9e9 !important; }
.curriculum-map > table > thead th:nth-of-type(4) { background-color: #e9e9e9 !important; }
.curriculum-map > table > thead th:nth-of-type(5) { background-color: #e9e9e9 !important; }
.curriculum-map > table > thead td { background-color: #f8f8f8; color: #111; font-size: 0.9em; }
.curriculum-map th, .curriculum-map td { padding: 2px; }
.curriculum-map td { min-width: 100px; width: 10.5%; }
.curriculum-map tbody td { vertical-align: top; }
.map-class { padding: 8px 8px; border-radius: 0.5em; font-size:13px; background-color: #f8f8f8; min-height: 45px; display: flex; flex-direction: column; justify-content: center; align-items: center; margin: 4px 0; position: relative; overflow: hidden; word-break: break-all; white-space: wrap; width: 100%; text-align: center; box-shadow: 0px 2px 3px rgba(0,0,0,0.15); line-height: 1.1em; font-weight: 500; letter-spacing: -0.05em; border-width: 1px; border-style: solid; border-color: #dedede; }
.map-class { max-width:145px;}
.map-class:before { content: ''; position: absolute; width: 4px; height: 100%; left: 0; top: 0; }
.map-class-parent { padding: 8px 8px; border-radius: 0; width: 100%; word-break: keep-all; font-size:13px; }
.curriculum-map > table > thead > tr:first-child > th { width: auto; word-break: keep-all; }
.curriculum-map > table > tbody > tr > th { width: auto; word-break: keep-all; }
.curriculum-map > table > thead > tr:last-child > td:nth-of-type(2), .curriculum-map > table > thead > tr:last-child > td:nth-of-type(4), .curriculum-map > table > thead > tr:last-child > td:nth-of-type(6), .curriculum-map > table > thead > tr:last-child > td:nth-of-type(8) { background-color: #f4f4f4 !important; }
.curriculum-map > table > tbody > tr > td:nth-of-type(2), .curriculum-map > table > tbody > tr > td:nth-of-type(4), .curriculum-map > table > tbody > tr > td:nth-of-type(6), .curriculum-map > table > tbody > tr > td:nth-of-type(8) { /* background-color:#efefef !important; */
border-left: 1px dashed #ccc !important; border-right: 1px dashed #ccc !important; }
.curriculum-map > table > tbody > tr:hover > th, .curriculum-map > table > tbody > tr:hover > td { /* background-color: #f4f4f4 !important; color: #fff;*/ }
.year-tabs { display: flex; gap: 10px; margin: 20px auto; flex-wrap: wrap; justify-content: flex-start; }
.year-tab { padding: 10px 25px; border: 1px solid #ddd; background: #fff; cursor: pointer; text-decoration: none !important; color: #333 !important; border-radius: 5px; font-weight: 600; transition: all 0.2s; }
.year-tab:hover { background: #f8f8f8; border-color: #bbb; }
.year-tab.active { background: var(--header-title-border); color: #fff !important; border-color: var(--header-title-border); }
.curriculum-map-content { margin: 15px 25px; padding: 1.25rem; background-color: #f4f4f4; border-radius: 8px; }
.color-class-01 { background-color: var(--color-class-01) !important; color: var(--text-class-01) !important; border-color: var(--text-class-01) !important; }
.color-class-02 { background-color: var(--color-class-02) !important; color: var(--text-class-02) !important; border-color: var(--text-class-02) !important; }
.color-class-03 { background-color: var(--color-class-03) !important; color: var(--text-class-03) !important; border-color: var(--text-class-03) !important; }
.color-class-04 { background-color: var(--color-class-04) !important; color: var(--text-class-04) !important; border-color: var(--text-class-04) !important; }
.color-class-05 { background-color: var(--color-class-05) !important; color: var(--text-class-05) !important; border-color: var(--text-class-05) !important; }
.color-class-06 { background-color: var(--color-class-06) !important; color: var(--text-class-06) !important; border-color: var(--text-class-06) !important; }
.color-class-07 { background-color: var(--color-class-07) !important; color: var(--text-class-07) !important; border-color: var(--text-class-07) !important; }
.color-class-08 { background-color: var(--color-class-08) !important; color: var(--text-class-08) !important; border-color: var(--text-class-08) !important; }
.color-class-09 { background-color: var(--color-class-09) !important; color: var(--text-class-09) !important; border-color: var(--text-class-09) !important; }
.color-class-10 { background-color: var(--color-class-10) !important; color: var(--text-class-10) !important; border-color: var(--text-class-10) !important; }
.color-class-11 { background-color: var(--color-class-11) !important; color: var(--text-class-11) !important; border-color: var(--text-class-11) !important; }
.color-class-12 { background-color: var(--color-class-12) !important; color: var(--text-class-12) !important; border-color: var(--text-class-12) !important; }
.color-class-13 { background-color: var(--color-class-13) !important; color: var(--text-class-13) !important; border-color: var(--text-class-13) !important; }
.color-class-14 { background-color: var(--color-class-14) !important; color: var(--text-class-14) !important; border-color: var(--text-class-14) !important; }
.color-class-15 { background-color: var(--color-class-15) !important; color: var(--text-class-15) !important; border-color: var(--text-class-15) !important; }
.color-class-16 { background-color: var(--color-class-16) !important; color: var(--text-class-16) !important; border-color: var(--text-class-16) !important; }
.color-class-17 { background-color: var(--color-class-17) !important; color: var(--text-class-17) !important; border-color: var(--text-class-17) !important; }
.color-class-18 { background-color: var(--color-class-18) !important; color: var(--text-class-18) !important; border-color: var(--text-class-18) !important; }
.color-class-19 { background-color: var(--color-class-19) !important; color: var(--text-class-19) !important; border-color: var(--text-class-19) !important; }
.color-class-20 { background-color: var(--color-class-20) !important; color: var(--text-class-20) !important; border-color: var(--text-class-20) !important; }
.color-class-21 { background-color: var(--color-class-21) !important; color: var(--text-class-21) !important; border-color: var(--text-class-21) !important; }
.color-class-22 { background-color: var(--color-class-22) !important; color: var(--text-class-22) !important; border-color: var(--text-class-22) !important; }
.color-class-23 { background-color: var(--color-class-23) !important; color: var(--text-class-23) !important; border-color: var(--text-class-23) !important; }
.color-class-24 { background-color: var(--color-class-24) !important; color: var(--text-class-24) !important; border-color: var(--text-class-24) !important; }
.color-class-25 { background-color: var(--color-class-25) !important; color: var(--text-class-25) !important; border-color: var(--text-class-25) !important; }
.color-class-26 { background-color: var(--color-class-26) !important; color: var(--text-class-26) !important; border-color: var(--text-class-26) !important; }
.color-class-27 { background-color: var(--color-class-27) !important; color: var(--text-class-27) !important; border-color: var(--text-class-27) !important; }
.color-class-28 { background-color: var(--color-class-28) !important; color: var(--text-class-28) !important; border-color: var(--text-class-28) !important; }
.color-class-29 { background-color: var(--color-class-29) !important; color: var(--text-class-29) !important; border-color: var(--text-class-29) !important; }
.color-class-30 { background-color: var(--color-class-30) !important; color: var(--text-class-30) !important; border-color: var(--text-class-30) !important; }
.color-class-01.map-class { border-style: dashed !important; }
.color-class-02.map-class { border-style: dashed !important; }
.color-class-01.map-class:before { background-color: var(--text-class-01) !important; }
.color-class-02.map-class:before { background-color: var(--text-class-02) !important; }
.color-class-03.map-class:before { background-color: var(--text-class-03) !important; }
.color-class-04.map-class:before { background-color: var(--text-class-04) !important; }
.color-class-05.map-class:before { background-color: var(--text-class-05) !important; }
.color-class-06.map-class:before { background-color: var(--text-class-06) !important; }
.color-class-07.map-class:before { background-color: var(--text-class-07) !important; }
.color-class-08.map-class:before { background-color: var(--text-class-08) !important; }
.color-class-09.map-class:before { background-color: var(--text-class-09) !important; }
.color-class-10.map-class:before { background-color: var(--text-class-10) !important; }
.color-class-11.map-class:before { background-color: var(--text-class-11) !important; }
.color-class-12.map-class:before { background-color: var(--text-class-12) !important; }
.color-class-13.map-class:before { background-color: var(--text-class-13) !important; }
.color-class-14.map-class:before { background-color: var(--text-class-14) !important; }
.color-class-15.map-class:before { background-color: var(--text-class-15) !important; }
.color-class-16.map-class:before { background-color: var(--text-class-16) !important; }
.color-class-17.map-class:before { background-color: var(--text-class-17) !important; }
.color-class-18.map-class:before { background-color: var(--text-class-18) !important; }
.color-class-19.map-class:before { background-color: var(--text-class-19) !important; }
.color-class-20.map-class:before { background-color: var(--text-class-20) !important; }
.color-class-21.map-class:before { background-color: var(--text-class-21) !important; }
.color-class-22.map-class:before { background-color: var(--text-class-22) !important; }
.color-class-23.map-class:before { background-color: var(--text-class-23) !important; }
.color-class-24.map-class:before { background-color: var(--text-class-24) !important; }
.color-class-25.map-class:before { background-color: var(--text-class-25) !important; }
.color-class-26.map-class:before { background-color: var(--text-class-26) !important; }
.color-class-27.map-class:before { background-color: var(--text-class-27) !important; }
.color-class-28.map-class:before { background-color: var(--text-class-28) !important; }
.color-class-29.map-class:before { background-color: var(--text-class-29) !important; }
.color-class-30.map-class:before { background-color: var(--text-class-30) !important; }

.small-th{width:80px !important;min-width:initial !important;font-size:0.75rem !important;position:relative;}
thead .small-th{border:0 !important;}
tbody .small-th > div.class-bookmark{
    height: calc(100% + 2px);
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: center;
    top:-1px;
    left: 0;
    border-radius: 0 16px 16px 0;
    font-size:11px;
    padding:5px;
    writing-mode: vertical-rl;
}
tbody .small-th:has(.class-bookmark){background:transparent !important;}
.group-border-top > .ks-cell{
  border-top: 2px solid #405988;
}
tbody .group-border-bottom > .ks-cell{
  border-bottom: 2px solid #405988;
}

.color-class-01.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-02.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-03.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-04.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-05.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-06.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-07.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-08.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-09.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-10.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-11.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-12.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-13.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-14.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-15.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-16.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-17.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-18.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-19.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-20.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-21.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-22.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-23.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-24.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-25.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-26.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-27.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-28.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-29.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}
.color-class-30.small-th > div.class-bookmark { background-color: #f4f4f4 !important; color:#111 !important; border:2px solid #405988 !important; border-width:2px 2px 2px 0 !important;}

/* Tooltip 스타일 */
.ks-tooltip { position: absolute; z-index: 9999; padding: 6px 10px; background: #333; color: #fff; font-size: 11px; border-radius: 4px; display: none; pointer-events: none; white-space: nowrap; box-shadow: 0 2px 5px rgba(0,0,0,0.2); }
.ks-tooltip:after { content: ''; position: absolute; bottom: -4px; left: 50%; margin-left: -4px; border-width: 4px 4px 0; border-style: solid; border-color: #333 transparent transparent; }
.curriculum-map-legend { 
    display:none;
    padding: 15px 15px 0 15px; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; border-top: 1px solid 405988; 
}
.legend-flex { display: flex; align-items: center; gap: 2px; font-size: 0.75rem; }
.legend-info-checkbox { display: block; width: 1rem; height: 1rem; border-width: 0.2em; border-style: solid; }
.legend-info-checkbox.color-class-01,.legend-info-checkbox.color-class-02 { border-style: dashed; }
.legend-flex strong { font-size: 0.75rem; font-weight: 400; }
.curriculum-tabs { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.curriculum-tab { font-size: 0.85rem; text-decoration: none; display: flex; align-items: center; padding: 0.3em 1.25em; border: 1px solid #ccc; border-radius: 8px; color: #575757; }
.curriculum-tab:hover, .curriculum-tab:active { color: #1748a4; }
.curriculum-head-sticky { position: sticky; top: 150px; z-index: 3; background-color: #ffffff; padding-top: 10px; padding-bottom: 10px; }
.max-width { max-width: var(--content-max-width); margin: 0 auto; }
.scroll-spacer { padding: 25px; }

@media(max-width:1100px){
    .curriculum-head-sticky { top:58px; }
    .curriculum-map > table > thead > tr > th:first-child,.curriculum-map > table > tbody > tr > th:first-child {
        width:0px;
        display:none !important;
        word-break: keep-all;
    }
    .curriculum-map-legend{display: flex;}
}

/* 모바일: 이수체계도 셀 축소 + 가로 스크롤 힌트(오른쪽 페이드) */
@media(max-width:768px){
    .curriculum-map-section { margin:1.2rem auto; }
    .curriculum-map-section > h3 { font-size:1.02rem; padding:0.3em 1em; }
    .curriculum-map td { min-width:90px; }
    .curriculum-map > table { font-size:0.78em; }
    .curriculum-map > table > thead > tr > th:first-child, .curriculum-map > table > tbody > tr > th:first-child { min-width:82px; width:82px; }
    .map-class { padding:6px 8px; min-height:36px; font-size:0.94em; }
    .map-class-parent { padding:6px 8px; }
    .curriculum-map-box { position:relative; }
    .curriculum-map-box::after { content:""; position:absolute; top:0; right:0; width:24px; height:100%; background:linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,.92)); pointer-events:none; z-index:2; }
    .curriculum-map-legend { padding:12px 12px 0; gap:6px; }
    .legend-flex strong, .legend-flex { font-size:0.7rem; }
}
@media(max-width:480px){
    .curriculum-map td { min-width:88px; }
    .curriculum-map > table { font-size:0.72em; }
}