@charset "utf-8";

/* ============================================================================
   sub_total.css
   기존 sub.css + sub_Ji.css + sub_Nam.css 3개 파일을 하나로 통합한 파일입니다.

   [목차]
     00. 전역 변수(:root)
     01. 서브 공통 – 서브비주얼 / 컨텐츠 레이아웃 / LNB(location) + 반응형
     02. sub1_1 융합보안이란? .is- + 반응형
     03. sub1_2 학과장 인사말 .gr-
     04. sub1_2 인재상 카드 #talent .tl-
     05. sub1_5 발전기금 #devel + 반응형
     06. 03~04 반응형(공통)
     07. sub1_4 오시는 길 .loc- + 반응형
     08. sub3_x 학과소개/교과과정/입학안내/학사안내 .nam-
     09. 08 반응형
     10. sub4_1 연구분야 및 연구실 #Research + 반응형
     11. sub4_2 국제교류 #Intern + 반응형
     12. 모바일 가로 스크롤 안내 오버레이 (공통, tail.php 스크립트와 세트)

   [통합 시 정리한 내용]
     - sub_Ji.css 안에 중복으로 들어있던 미디어쿼리(1170px / 980px / 767px) 블록 제거
       → 뒤쪽에 동일한 값이 그대로 남아있어 적용 결과는 기존과 동일합니다.
     - 미디어쿼리는 각 섹션 끝에 모아서 넓은 폭 → 좁은 폭 순서로 정렬
     - 코드 포맷을 1규칙 = 1줄로 통일(선언 값은 손대지 않음)

   [2026-08 정리 내용]
     - 미사용 섹션 삭제: 구성도(.org) / 교육과정(#curri .cu-) / 졸업요건(#grad .gd-)
     - HTML에 없는 요소 대상 규칙 삭제: .gr-stats, #sVisual .sVisual, .big-tit big/small,
       sv-img6~8, #devel .devel-visual/-shield/-lock/-campus(기본 스타일 유실 잔여분)
     - 빈 룰셋 / 주석 처리된 코드 삭제, 발전기금 섹션 포맷을 1규칙 = 1줄로 통일
     - 원본 백업: css/sub.css.bak_260814

   [반응형 브레이크포인트 7단계 통일]
     1600 / 1400 / 1200 / 991 / 768 / 500 / 400 (max-width 기준)
     - 구 브레이크포인트를 근접 구간으로 병합:
       1800→1600, 1500→1400, 1170·1199→1200, 1024·980·900→991,
       767→768, 640·480→500, 420→400
     - 신규 추가: .sCont 상하 패딩(991/768), .sCont-title(991/768/500),
       .is-intro__title(768), .gr-headline(991) 축소 규칙

   [2026-08-24 sub1_1 융합보안이란? 반응형 정비]
     - 브레이크포인트 1600 / 1400 / 1200 / 1024 / 768 / 500 (요청 기준)
     - 06번 섹션에 흩어져 있던 .is- 반응형 규칙을 02번 섹션 끝으로 이관·확장
     - PC 레이아웃 구조는 유지하고 여백·폰트만 단계적으로 축소
     - 768 이하 원형 다이어그램은 구조 유지 + .is-diagram-scroll 가로 스크롤
       (12번 섹션 안내 오버레이 / tail.php 스크립트와 세트)
   ========================================================================== */

/* ============================================================================
   00. 전역 변수 (:root)
   [sub_Nam.css]
   ========================================================================== */

:root{--nam-navy: #002279; --nam-accent: #1f53c4; --nam-sky: #45c5fd; --nam-accent-soft: #eef3fc; --nam-accent-soft2: #f6f9ff; --nam-line: #e8ecf3; --nam-line-soft: #f0f3f8; --nam-line-dark: #aab4c3; --nam-gray-bg: #f6f8fc; --nam-text: #2b323d; --nam-text-sub: #6b7480; --nam-card-shadow: 0 6px 24px rgba(20, 40, 80, 0.07);}

/* ============================================================================
   01. 서브 공통 – 서브비주얼 / 컨텐츠 레이아웃 / LNB(location)
   [sub.css]
   ========================================================================== */

/* ---------- 서브 비주얼 ---------- */

#allWrap.sub{overflow-x: hidden; padding-top: 0;}
#allWrap.sub #quick{top: 500px;}
#sVisual{position: relative; z-index: 2;}
#sVisual .sVis_wr{position: relative; display: block; width: 98%; max-width: 1880px; min-height: 370px; margin: 0 auto; padding-top: 185px;}
#sVisual .sVis_wr::before{content: ''; width: 518px; height: 147px; background: url('/images/main/visual_bf.png') no-repeat 0 0; background-size: cover; position: absolute; left: 0; top: 19px;}
#sVisual .sVis_wr::after{content: ''; width: 110px; height: 82px; transform: skew(-330deg) translateX(5%); z-index: 1; position: absolute; right: -2px; top: 18px; background-color: #f5f4f2; border-radius: 0 0 0 18px;}
/* 슬로건 : 우측 LNB(#location) 영역을 침범하지 않도록 padding-right 로 폭을 확보 */
#sVisual .slogan{position: relative; line-height: 1.1; z-index: 10; display: block; margin: 0 auto; padding-left: 5%; padding-right: 740px;}
#sVisual .slogan .big-tit{position: relative; margin-bottom: 10px; font-weight: 700; font-size: 48px; color: #fff; line-height: 1.2; letter-spacing: -1px; word-break: keep-all;}
#sVisual .slogan .loca{width: 100%; padding: 10px 0; z-index: 10;}
#sVisual .slogan .loca ul.loc{display: flex; flex-wrap: wrap; align-items: center; row-gap: 4px;}
#sVisual .slogan .loca ul.loc li{display:inline-block; font-size: 20px; padding: 0 20px 0 0; color: #bbb; position: relative; word-break: keep-all;}
#sVisual .slogan .loca ul.loc li:after{display:block; width: 3px; height: 3px; background-color: #cdcdcd; border-radius:50%; content:''; position: absolute; right: 6px; top: 50%; margin-top: -1px;}
#sVisual .slogan .loca ul.loc li.last{color:#bbb; position: relative; padding: 0;}
#sVisual .slogan .loca ul.loc li.last:after{display:none;}
#sVisual .slogan .loca ul.loc li.home{display: flex; align-items: center;}
#sVisual .slogan .loca ul.loc li.home i{color: #bbb;}
/* 배경 이미지 : 래퍼 높이가 늘어나도 항상 하단까지 채워지도록 calc 사용 */
#sVisual .svWrap{overflow: hidden; position: absolute; top: 20px; left: 0; width: 100%; height: calc(100% - 20px); background: #000; border-radius: 40px; z-index: -1;}
#sVisual .svWrap .sv-img{width: 100%; height: 100%; min-height: 480px; position: relative; top: 0; left: 0; opacity: 1; animation: mymove 5s; background: url("/images/sub/sVisual_260722.jpg") no-repeat 50% 12% / cover;}
#sVisual .svWrap .sv-img1{background: url("/images/sub/sVisual_260722.jpg") no-repeat 50% bottom; background-size:cover; overflow: hidden;}
#sVisual .svWrap .sv-img2{background: url("/images/sub/sVisual_260722.jpg") no-repeat 50% bottom; background-size:cover; overflow: hidden;}
#sVisual .svWrap .sv-img3{background: url("/images/sub/sVisual_260722.jpg") no-repeat 50% bottom; background-size:cover; overflow: hidden;}
#sVisual .svWrap .sv-img4{background: url("/images/sub/sVisual_260722.jpg") no-repeat 50% bottom; background-size:cover; overflow: hidden;}
#sVisual .svWrap .sv-img5{background: url("/images/sub/sVisual_260722.jpg") no-repeat 50% bottom; background-size:cover; overflow: hidden;}
@keyframes mymove{
	from{filter: blur(5px); transform:scale(1.2);}
	to{filter: blur(0); transform:scale(1);}
}

/* ---------- 컨텐츠 영역 / LNB ---------- */
#sContWrap{position: relative; z-index: 0;}
.sContWrap{position:relative; width:100%; height:100%; min-height:500px;}
.sContWrap:after{display:block; content:""; clear:both;}
.sCont{width:90%; max-width: 1520px; min-height:500px; margin:0 auto; position:relative; word-break:keep-all; padding: 100px 0;}
.sCont .sCont-title{display:block; padding: 0px 0 60px; color: #222; font-size: 42px; line-height:1.6; font-weight: 700; letter-spacing: -1px; text-align:center;}
.sub-board-bottom{padding-bottom:160px;}
#location{position: absolute; bottom: 0; right: 0; display: inline-block; width: auto; z-index: 999;}
.lnb{position: relative; z-index: 999; display: flex; justify-content: flex-start; gap: 10px; padding: 10px; border-radius: 30px 0 0 0; background: #f5f4f2;}
.lnb::before{content: ''; width: 5rem; height: 5rem; border-radius: 0 0 25px 0; box-shadow: 1rem 1rem 0 0 #f5f4f2; position: absolute; right: 0; top: -5rem;}
.lnb::after{content: ''; width: 5rem; height: 5rem; border-radius: 0 0 25px 0; box-shadow: 1rem 1rem 0 0 #f5f4f2; position: absolute; left: -5rem; bottom: 0;}
.lnb .lnb-map{display: flex; width: 100%;}
.lnb .lnb-map:after{content:''; display:block; clear:both;}
.lnb .lnb-map li a{display:block;}
.lnb .lohom{position:relative; width: 67px; height: 60px; z-index:1; background-color:transparent;}
.lnb .lohom > a{display:flex; align-items:center; justify-content:center; height: 100%; width: 100%; color: #0c35e9; font-size:18px; border-radius: 50%; position:relative;}
.lnb .lnb-map > li{width: 300px; backdrop-filter: blur(10px); border-radius: 10px; transition:all 0.4s ease;}
.lnb .lnb-map > li:hover{background: rgba(255, 255, 255, 0.05);}
.lnb .lnb-map > li:first-child{margin-right: 10px;}
.lnb .lnb-map li.depth{position:relative;}
.lnb .lnb-map li.depth ul{display:none; position:absolute; top: 70px; left:0; width:100%; padding: 20px 0; background:#fff; z-index:10; border-radius: 10px; box-shadow: 0 20px 20px 0px rgba(79, 85, 99, 0.2);}
.lnb .lnb-map li.depth ul li a{display: block; padding: 7px 30px; font-size: 16px; font-weight: 500; letter-spacing: -.5px; color: #333;}
.lnb .lnb-map li.depth ul li a:hover{color: #222;}
.lnb .lnb-map li a:after{/*arrow*/ transform:rotate(135deg); top:50%; margin-top:-5px; right:10%; width:8px; height:8px; border-top: 2px solid #cdcdcd; border-right: 2px solid #cdcdcd; display:inline-block; position:absolute; content:""; transition:.3s ease-out;}
.lnb .lnb-map li:first-child a:after{border-top:2px solid #cdcdcd; border-right:2px solid #cdcdcd;}
.lnb .lnb-map li.depth a span{width:100%; font-size: 18px; color: #222; height: 70px; line-height: 1.3; display:flex; font-weight: 500; letter-spacing: -.5px; padding: 0 30% 0 30px; transition:.1s ease-out; align-items:center;}
.lnb .lnb-map li.depth a.menu_active{box-shadow:15px 15px 20px 0 rgba(0,0,0,.1);}
.lnb .lnb-map li a.menu_active:after{border-color:#878894; transform:rotate(314deg); margin-top:-5px;}
.lnb .lnb-map li.depth a.menu_active span{position: relative; background: #fff; color: #222; border-radius: 25px 25px 0 0;}
.lnb .lnb-map li.depth a.menu_active span:after{content:''; position:absolute; bottom:0; left:30px; width:220px; height:1px; background:rgba(255,255,255,.1);}
.lnb .lnb-map li.depth ul.moreMenu li a{position:relative; word-break:keep-all;}
.lnb .lnb-map li.depth ul.moreMenu li a:after{display:none;}
.lnb .lnb-map li.depth ul.moreMenu li a.active{font-weight: 600; color: #2c7bf2;}
.lnb .lnb-map li.depth ul.moreMenu li a.active:after{opacity:1;}
.lnb .lnb-map li.depth ul.moreMenu li a:hover:after{opacity:1;}
.lnb.scrollFx{position: fixed; top: 0; left: 0; width: 100%; z-index: 999; border-bottom: 1px solid #ddd; background: #f5f4f2; padding: 10px; transform: translateY(0);}
.lnb.scrollFx::before, .lnb.scrollFx::after{display: none;}
.lnb.hide{position: fixed; top: 0; left: 0; width: 100%; transform: translateY(-100%) !important; opacity: 0; pointer-events: none;}
.lnb.hide::before, .lnb.hide::after{display: none;}

/* ---------- 01 반응형 (서브비주얼 / LNB) --------------------------------------
   브레이크포인트 : 1600 / 1400 / 1200 / 1024 / 991 / 768 / 500
   - #sVisual .sVis_wr 의 ::before / ::after (라운드 노치) 크기는 보안대학원과 동일.
   - .sVis_wr 의 padding-top 은 각 구간의 nav 높이(nav.css)에 맞춰 내려온다.
   - 1200 이하에서는 LNB 가 비주얼 하단 가로 전체 바로 내려오므로
     padding-bottom 으로 자리를 미리 확보해 텍스트와 겹치지 않게 한다.
   ---------------------------------------------------------------------------- */

@media (max-width: 1600px){
	#sVisual .sVis_wr{padding-top: 162px;}
	#sVisual .sVis_wr::before{width: 400px; height: 115px;}
	#sVisual .sVis_wr::after{width: 90px; height: 66px;}
	#sVisual .slogan{padding-right: 680px;}
	#sVisual .slogan .big-tit{font-size: 44px;}
	#sVisual .slogan .loca ul.loc li{font-size: 18px;}

	.lnb .lnb-map > li{width: 270px;}
	.lnb .lnb-map li.depth a span{font-size: 17px; padding: 0 28% 0 24px;}
	.lnb .lnb-map li.depth ul li a{padding: 7px 24px; font-size: 15px;}
}

@media (max-width: 1400px){
	#sVisual .sVis_wr{min-height: 345px; padding-top: 150px;}
	#sVisual .sVis_wr::before{top: 14px; width: 404px; height: 105px;}
	#sVisual .sVis_wr::after{top: 13px; width: 82px; height: 67px;}
	#sVisual .svWrap{top: 15px; height: calc(100% - 15px); border-radius: 34px;}
	#sVisual .slogan{padding-right: 620px;}
	#sVisual .slogan .big-tit{font-size: 40px;}
	#sVisual .slogan .loca ul.loc li{padding: 0 18px 0 0; font-size: 17px;}

	.lnb{gap: 8px; padding: 9px;}
	.lnb .lohom{width: 58px; height: 56px;}
	.lnb .lohom > a{font-size: 17px;}
	.lnb .lnb-map > li{width: 240px;}
	.lnb .lnb-map > li:first-child{margin-right: 8px;}
	.lnb .lnb-map li.depth a span{height: 62px; font-size: 16px; padding: 0 26% 0 20px;}
	.lnb .lnb-map li.depth ul{top: 62px; padding: 14px 0;}
	.lnb .lnb-map li.depth ul li a{padding: 7px 20px; font-size: 15px;}
}

/* 1200 이하 : LNB 를 비주얼 하단 가로 전체 바로 */
@media (max-width: 1200px){
	#sVisual .sVis_wr{min-height: 330px; padding-top: 134px; padding-bottom: 102px;}
	#sVisual .sVis_wr::before{top: 9px; width: 363px; height: 90px;}
	#sVisual .sVis_wr::after{top: 8px; width: 75px; height: 57px;}
	#sVisual .svWrap{top: 10px; height: calc(100% - 10px); border-radius: 30px;}
	#sVisual .slogan{padding-left: 4%; padding-right: 4%;}
	#sVisual .slogan .big-tit{font-size: 36px;}
	#sVisual .slogan .loca{padding: 8px 0 0;}
	#sVisual .slogan .loca ul.loc li{font-size: 16px;}
	/* 태블릿 이하는 이미지를 래퍼 크기에 맞춰 중앙 정렬 */
	#sVisual .svWrap .sv-img{min-height: 0;}
	#sVisual .svWrap .sv-img1,
	#sVisual .svWrap .sv-img2,
	#sVisual .svWrap .sv-img3,
	#sVisual .svWrap .sv-img4,
	#sVisual .svWrap .sv-img5{background-position: 50% 50%; background-attachment: unset; background-size: cover;}

	/* reset.css 가 border-box 를 전역 지정하지 않으므로 명시 (width 100% + padding 이 밖으로 삐져나가는 것 방지) */
	#location{left: 0; right: 0; bottom: 22px; width: 100%; padding: 0 20px; box-sizing: border-box;}
	.lnb{gap: 8px; padding: 8px; border-radius: 16px; box-shadow: 0 12px 30px rgba(0, 0, 0, .14);}
	.lnb::before,
	.lnb::after{display: none;}
	.lnb .lnb-map{flex: 1 1 auto; width: auto; gap: 8px;}
	.lnb .lohom{flex: 0 0 52px; width: 52px; height: 54px;}
	.lnb .lnb-map > li{flex: 1 1 0; width: 50%; height: 54px; background: #fff; box-shadow: inset 0 0 0 1px #e8eaee;}
	.lnb .lnb-map > li:hover{background: #fff;}
	.lnb .lnb-map > li:first-child{margin-right: 0;}
	.lnb .lnb-map > li > a{height: 54px;}
	.lnb .lnb-map li.depth a span{height: 54px; font-size: 15px; padding: 0 34px 0 16px;}
	.lnb .lnb-map li.depth a span,
	.lnb .lnb-map li.depth a.menu_active span{border-radius: 10px 10px 0 0;}
	.lnb .lnb-map li a:after{right: 16px;}
	.lnb .lnb-map li.depth ul{top: 54px; padding: 10px 0; border-radius: 0 0 10px 10px;}
	.lnb .lnb-map li.depth ul li a{padding: 7px 16px; font-size: 14px;}

	.sub-board-bottom{padding-bottom: 80px;}
}

@media (max-width: 1024px){
	#sVisual .sVis_wr{min-height: 306px; padding-top: 118px; padding-bottom: 96px;}
	#sVisual .sVis_wr::before{top: 8px; width: 364px; height: 78px;}
	#sVisual .sVis_wr::after{width: 68px; height: 56px;}
	#sVisual .svWrap{border-radius: 26px;}
	#sVisual .slogan .big-tit{font-size: 32px;}
	#sVisual .slogan .loca ul.loc li{padding: 0 15px 0 0; font-size: 15px;}

	#location{bottom: 20px; padding: 0 16px;}
	.lnb .lohom{flex-basis: 48px; width: 48px; height: 50px;}
	.lnb .lohom > a{font-size: 16px;}
	.lnb .lnb-map > li{height: 50px;}
	.lnb .lnb-map > li > a{height: 50px;}
	.lnb .lnb-map li.depth a span{height: 50px; font-size: 14px; padding: 0 30px 0 14px;}
	.lnb .lnb-map li a:after{right: 14px; width: 7px; height: 7px; margin-top: -4px;}
	.lnb .lnb-map li.depth ul{top: 50px;}
}

@media (max-width: 991px){
	.sCont{padding: 80px 0;}
	.sCont .sCont-title{font-size: 36px; padding-bottom: 50px;}
}

@media (max-width: 768px){
	#sVisual .sVis_wr{width: calc(100% - 20px); min-height: 274px; padding-top: 108px; padding-bottom: 80px;}
	#sVisual .sVis_wr::before{top: 8px; width: 308px; height: 74px;}
	#sVisual .sVis_wr::after{width: 68px; height: 49px; border-radius: 0 0 0 12px;}
	#sVisual .svWrap{border-radius: 20px;}
	#sVisual .slogan{margin: 0 auto; padding-left: 16px; padding-right: 16px;}
	#sVisual .slogan .big-tit{margin-bottom: 4px; font-size: 28px; letter-spacing: -0.6px;}
	#sVisual .slogan .loca{padding: 6px 0 0;}
	#sVisual .slogan .loca ul.loc li{padding: 0 14px 0 0; font-size: 14px;}

	#location{bottom: 15px; padding: 0 12px; margin-top: 0;}
	.lnb{gap: 6px; padding: 7px; border-radius: 14px;}
	.lnb .lohom{flex-basis: 40px; width: 40px; height: 44px;}
	.lnb .lohom > a{font-size: 15px;}
	.lnb .lnb-map{gap: 6px;}
	.lnb .lnb-map > li{height: 44px; border-radius: 10px;}
	.lnb .lnb-map > li > a{height: 44px;}
	.lnb .lnb-map li.depth a span{height: 44px; font-size: 13px; padding: 0 26px 0 12px;}
	.lnb .lnb-map li a:after{right: 12px;}
	.lnb .lnb-map li.depth ul{top: 44px; padding: 8px 0;}
	.lnb .lnb-map li.depth ul li a{padding: 7px 12px; font-size: 13px;}

	.sCont{padding: 60px 0;}
	.sCont .sCont-title{font-size: 30px; padding-bottom: 40px;}
	.sub-board-bottom{padding-bottom: 40px;}
}

@media (max-width: 500px){
	#sVisual .sVis_wr{min-height: 244px; padding-top: 92px; padding-bottom: 68px;}
	#sVisual .sVis_wr::before{top: 6px; width: 232px; height: 54px;}
	#sVisual .sVis_wr::after{width: 58px; height: 39px; border-radius: 0 0 0 10px;}
	#sVisual .svWrap{border-radius: 16px;}
	#sVisual .slogan{padding-left: 12px; padding-right: 12px;}
	#sVisual .slogan .big-tit{font-size: 23px; letter-spacing: -0.5px;}
	#sVisual .slogan .loca ul.loc li{padding: 0 12px 0 0; font-size: 13px;}
	#sVisual .slogan .loca ul.loc li:after{right: 5px;}

	#location{bottom: 12px; padding: 0 10px;}
	.lnb{gap: 5px; padding: 6px; border-radius: 12px;}
	.lnb .lohom{flex-basis: 34px; width: 34px; height: 38px;}
	.lnb .lohom > a{font-size: 14px;}
	.lnb .lnb-map{gap: 5px;}
	.lnb .lnb-map > li{height: 38px; border-radius: 8px;}
	.lnb .lnb-map > li > a{height: 38px;}
	.lnb .lnb-map li.depth a span{height: 38px; font-size: 12px; padding: 0 20px 0 10px;}
	.lnb .lnb-map li a:after{right: 8px; width: 6px; height: 6px; margin-top: -4px;}
	.lnb .lnb-map li.depth ul{top: 38px; padding: 6px 0;}
	.lnb .lnb-map li.depth ul li a{padding: 6px 10px; font-size: 12px;}

	.sCont .sCont-title{font-size: 26px;}
}

/* ============================================================================
   02. sub1_1 융합보안이란? .is-
   [sub_Ji.css]
   ========================================================================== */

.pc-only{display: inline;}
.is-intro__bg-deco{position: absolute; inset: 0; pointer-events: none;}
.is-intro__bg-deco::before, .is-intro__bg-deco::after{content: ''; position: absolute; border-radius: 50%;}
.is-intro__bg-deco::before{top: -160px; right: -160px; width: 420px; height: 420px; background: radial-gradient(circle,rgba(69,197,253,.18) 0%,rgba(69,197,253,0) 70%);}
.is-intro__bg-deco::after{bottom: -140px; left: -140px; width: 360px; height: 360px; background: radial-gradient(circle,rgba(0,34,121,.08) 0%,rgba(0,34,121,0) 70%);}
.is-intro__inner{position: relative; z-index: 2;}
.is-intro__eyebrow{display: inline-block; font-size: 16px; font-weight: 700; letter-spacing: 3px; color: #45c5fd; margin-bottom: 14px;}
.is-intro__title{font-size: 46px; color: #111; letter-spacing: -1.6px; line-height: 1.2; margin: 0;}
.is-intro__cards{display: grid; grid-template-columns: 1fr 1fr; gap: 26px;}
.is-intro__card{position: relative; padding: 42px 38px; background: #fff; border-radius: 20px; border: 1px solid #eaf0ff; box-shadow: 0 12px 32px -14px rgba(0,34,121,.12); transition: transform .35s ease,box-shadow .35s ease,border-color .35s ease; overflow: hidden;}
.is-intro__card::before{content: ''; position: absolute; top: 0; left: 0; width: 0; height: 4px; background: linear-gradient(90deg,#002279 0%,#45c5fd 100%); transition: width .5s ease;}
.is-intro__card:hover{transform: translateY(-6px); box-shadow: 0 24px 46px -16px rgba(0,34,121,.2); border-color: #d8e3ff;}
.is-intro__card:hover::before{width: 100%;}
.is-intro__card-num{position: absolute; top: 24px; right: 30px; font-size: 50px; font-weight: 800; color: #eef2fc; line-height: 1; letter-spacing: -2px;}
.is-intro__card-tit{position: relative; font-size: 22px; font-weight: 700; color: #002279; letter-spacing: -.5px; line-height: 1.3; margin: 0 0 16px; padding-left: 18px;}
.is-intro__card-tit::before{content: ''; position: absolute; left: 0; top: 5px; bottom: 5px; width: 5px; border-radius: 3px; background: linear-gradient(#002279,#45c5fd);}
.is-intro__card p{font-size: 17px; color: #444; line-height: 1.8; letter-spacing: -.3px; margin: 0;}
.is-intro__card p em{font-style: normal; font-weight: 700; color: #1f53c4;}
.is-hero{position: relative; border-radius: 24px; overflow: hidden; padding: 170px 60px 70px 60px; background: #0b1f3a center/cover no-repeat; box-shadow: 0 24px 50px -22px rgba(0,34,121,.3); /* 회색 배경에 맞춰 그림자 투명도 살짝 낮춤 */}
.is-hero__overlay{position: absolute; inset: 0; background: url(/images/sub/sub1_1_Vs.jpg) no-repeat center;}
.is-hero__inner{position: relative; max-width: 1000px;}
.is-hero__title{font-size: 40px; color: #fff; letter-spacing: -1px; line-height: 1.2; margin: 0 0 28px;}
.is-hero__title em{font-style: normal; color: #45c5fd;}
.is-hero__desc{font-size: 22px; /* 원본 크기 복구 */ color: rgba(255,255,255,.9); line-height: 1.85; letter-spacing: -.3px; margin: 0;}
.is-hero__desc + .is-hero__desc{margin-top: 18px;}
.is-hero__desc em{font-style: normal; font-weight: 700; color: #7fd8ff;}
.is-tabsec{margin-top: 90px;}
.is-tabs{display: flex; gap: 12px; margin-bottom: 40px;}
.is-tab{font-size: 23px; flex: 1; position: relative; display: flex; align-items: center; justify-content: center; gap: 14px; height: 94px; cursor: pointer; background: #ffffff; /* 회색 배경에서 분리되도록 순백색 처리 */ border: 1px solid #e1e3e8; /* 은은한 그레이 테두리 */ border-radius: 16px; transition: background .3s ease,border-color .3s ease,box-shadow .3s ease,transform .3s ease; box-shadow: 0 6px 16px rgba(0,0,0,0.02); /* 가벼운 그림자 */}
.is-tab:hover{background: #f8f9fc; transform: translateY(-2px);}
.is-tab__num{font-weight: 700; color: #a7b1cf; letter-spacing: 1px; transition: color .3s ease;}
.is-tab__txt{font-weight: 700; color: #5e6a86; letter-spacing: -.5px; transition: color .3s ease;}
.is-tab.active{background: linear-gradient(135deg,#002279 0%,#1a3aa3 100%); border-color: #002279; box-shadow: 0 16px 32px -14px rgba(0,34,121,.45); transform: translateY(-2px);}
.is-tab.active .is-tab__num{color: #45c5fd;}
.is-tab.active .is-tab__txt{color: #fff;}
.is-tabcontents{position: relative; padding: 60px 55px; background: #ffffff; /* 푸른빛(#fafbff) 제거 -> 회색 배경과 대비되는 순백색 */ border-radius: 24px; border: 1px solid #e1e3e8; box-shadow: 0 15px 40px rgba(0,0,0,0.03); /* 컨텐츠 박스 깊이감 추가 */}
.is-tabpane{display: none;}
.is-tabpane.active{display: block; animation: isFade .55s ease;}
@keyframes isFade{
	from{opacity: 0; transform: translateY(12px);}
	to{opacity: 1; transform: translateY(0);}
}
.is-pane__head{display: flex; align-items: center; gap: 22px; margin-bottom: 36px; padding-bottom: 26px; border-bottom: 1px dashed #d6deef;}
.is-pane__num{display: inline-flex; align-items: center; justify-content: center; width: 70px; height: 70px; border-radius: 50%; background: linear-gradient(135deg,#002279 0%,#1a3aa3 100%); color: #fff; font-size: 22px; font-weight: 700; letter-spacing: 1px; box-shadow: 0 10px 22px -6px rgba(0,34,121,.35);}
.is-pane__eng{display: block; font-size: 18px; font-weight: 600; color: #45c5fd; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 6px;}
.is-pane__tit{font-size: 32px; font-weight: 700; color: #111; letter-spacing: -.8px; margin: 0; line-height: 1.2;}
/* ---------- 체크리스트 ---------- */
.is-checklist{list-style: none; padding: 0; margin: 0;}
.is-checklist li{position: relative; padding: 22px 26px 22px 60px; background: #fff; border-radius: 14px; border: 1px solid #eef1f9; font-size: 20px; /* 원본 크기 복구 */ color: #444; line-height: 1.6; letter-spacing: -.3px; transition: border-color .3s ease,box-shadow .3s ease,transform .3s ease;}
.is-checklist li + li{margin-top: 14px;}
.is-checklist li::before{content: ''; position: absolute; left: 24px; top: 26px; width: 22px; height: 22px; border-radius: 50%; background: linear-gradient(135deg,#45c5fd 0%,#1f9be0 100%); box-shadow: 0 4px 10px -2px rgba(69,197,253,.5);}
.is-checklist li::after{content: ''; position: absolute; left: 31px; top: 31px; width: 7px; height: 11px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg);}
.is-checklist li:hover{border-color: #002279; box-shadow: 0 12px 24px -10px rgba(0,34,121,.15); transform: translateX(4px);}
/* ---------- 시각자료 공통 타이틀 ---------- */
.is-vistitle{text-align: center; margin: 70px 0 45px 0;}
.is-vistitle span{display: inline-block; font-size: 26px; font-weight: 700; color: #002279; letter-spacing: -.5px; padding-bottom: 10px; border-bottom: 3px solid #45c5fd;}
/* ---------- 융합보안 다이어그램 (글래스모피즘 & 자식 요소 호버) ---------- */
.is-diagram{position: relative; width: 100%; max-width: 640px; margin: 0 auto; aspect-ratio: 1/1; margin-top: 50px;}
.is-diagram__orbit{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 85%; height: 85%; border-radius: 50%; border: 1px dashed #a6b9df;}
.is-diagram__orbit--inner{width: 46%; height: 46%; border-color: #bccded;}
.is-diagram__hub{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 25%; height: 25%; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; color: #fff; font-size: 20px; /* 원본 크기 복구 */ font-weight: 800; letter-spacing: -.5px; /* 다크 앤 테크 글래스모피즘 (그레이 배경과 이질감 없게 유지) */ background: radial-gradient(circle at top left, rgba(26, 58, 163, 0.95), rgba(0, 34, 121, 0.9)); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,0.2); box-shadow: 0 20px 40px rgba(0, 34, 121, 0.4); z-index: 0; line-height: 1.3;}
.is-diagram__core{position: absolute; transform: translate(-50%,-50%); width: 18%; height: 18%; border-radius: 50%; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 16px; /* 원본 크기 복구 */ font-weight: 700; line-height: 1.25; color: #fff; background: linear-gradient(135deg,#2f6fe0,#1f53c4); box-shadow: 0 12px 26px -10px rgba(0,34,121,.45); z-index: 4; border: 2px solid #fff; transition: transform 0.3s ease;}
/* 부모(.is-diagram)가 아닌 자식(.is-diagram__core) 요소에만 호버 액션 적용 */
.is-diagram__core:hover{transform: translate(-50%, -50%) scale(1.08);}
.is-core--1{top: 27%; left: 50%;}
.is-core--2{top: 50%; left: 73%;}
.is-core--3{top: 73%; left: 50%;}
.is-core--4{top: 50%; left: 27%;}
.is-diagram__sat{position: absolute; transform: translate(-50%,-50%); width: 15.5%; height: 15.5%; border-radius: 50%; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 18px; /* 원본 크기 복구 */ font-weight: 600; line-height: 1.15; color: #1f3a78; background: #fff; border: 1px solid #d8e3ff; box-shadow: 0 8px 18px -8px rgba(0,34,121,.25); z-index: 3;}
/* 법제도(상단)/기술(우측)/범죄심리(하단)/경영(좌측) 그룹 위치(원본 유지) */
.is-sat--1{left: 28.7%; top: 13.2%;}
.is-sat--2{left: 50%; top: 7.5%;}
.is-sat--3{left: 71.3%; top: 13.2%;}
.is-sat--4{left: 86.8%; top: 28.7%;}
.is-sat--5{left: 92.5%; top: 50%;}
.is-sat--6{left: 86.8%; top: 71.3%;}
.is-sat--7{left: 71.3%; top: 86.8%;}
.is-sat--8{left: 50%; top: 92.5%;}
.is-sat--9{left: 28.7%; top: 86.8%;}
.is-sat--10{left: 13.2%; top: 71.3%;}
.is-sat--11{left: 7.5%; top: 50%;}
.is-sat--12{left: 13.2%; top: 28.7%;}
.is-diagram__legend{margin-top: 40px; text-align: center; font-size: 16px; color: #777; letter-spacing: -.3px;}
/* ---------- 차별성 (정보보호 / 물리보안 / 융합보안) ---------- */
.is-diff{display: flex; flex-direction: column; gap: 16px; margin-bottom: 22px;}
.is-diff__row{display: flex; align-items: center; gap: 26px; background: #fff; border: 1px solid #eef1f9; border-radius: 16px; padding: 28px 34px;}
.is-diff__row--point{background: radial-gradient(circle at top right,rgba(69,197,253,.3) 0%,rgba(69,197,253,0) 55%),linear-gradient(135deg,#002279 0%,#1a3aa3 100%); box-shadow: 0 20px 40px -20px rgba(0,34,121,.45);}
.is-diff__tag{flex: 0 0 130px; text-align: center; padding: 13px 0; border-radius: 50px; background: #f0f4ff; color: #002279; font-size: 18px; font-weight: 700; letter-spacing: 1px;}
.is-diff__row--point .is-diff__tag{background: rgba(255,255,255,.15); color: #45c5fd;}
.is-diff__row p{font-size: 20px; /* 원본 크기 복구 */ line-height: 1.8; color: #444; letter-spacing: -.3px;}
.is-diff__row p strong{color: #002279; font-weight: 700;}
.is-diff__row--point p{color: #eef3ff;}
.is-diff__row--point p strong{color: #45c5fd;}
.is-note{display: flex; align-items: flex-start; gap: 18px; background: #fff; border: 1px dashed #c9d3ee; border-radius: 14px; padding: 26px 30px;}
.is-note__icon{flex: 0 0 32px; width: 32px; height: 32px; border-radius: 50%; background: #45c5fd; color: #fff; font-size: 17px; font-weight: 700; display: flex; align-items: center; justify-content: center;}
.is-note p{font-size: 19px; /* 원본 크기 복구 */ color: #555; line-height: 1.8; letter-spacing: -.3px; margin: 0;}
.is-note p strong{color: #002279; font-weight: 700;}
/* ---------- 발전방향 차트 ---------- */
.is-chartwrap{background: #fff; border: 1px solid #e1e3e8; /* 그레이 배경과 어울리는 테두리 적용 */ border-radius: 20px; padding: 38px 40px; box-shadow: 0 12px 30px -16px rgba(0,0,0,0.06); /* 부드러운 그림자로 변경 */ margin-top: 50px;}
.is-chart__title{font-size: 20px; font-weight: 700; color: #002279; letter-spacing: -.3px; margin: 0 0 18px;}
.is-chart svg{width: 100%; height: auto; display: block;}
.is-prospect{display: flex; align-items: center; justify-content: center; gap: 48px; flex-wrap: wrap; margin-top: 30px; padding-top: 50px; border-top: 1px dashed #d6deef;}
.is-donut{position: relative; width: 200px; height: 200px; border-radius: 50%; flex: 0 0 auto; background: conic-gradient(#002279 0 58%,#45c5fd 58% 87%,#9cc2f5 87% 97%,#dfe6f5 97% 100%); display: flex; align-items: center; justify-content: center;}
.is-donut::before{content: ''; position: absolute; width: 60%; height: 60%; border-radius: 50%; background: #fff; box-shadow: inset 0 2px 8px rgba(0,34,121,.08);}
.is-donut__txt{position: relative; text-align: center; line-height: 1.2;}
.is-donut__txt b{display: block; font-size: 28px; font-weight: 800; color: #002279;}
.is-donut__txt span{display: block; font-size: 16px; color: #777;}
.is-prospect__info{max-width: 320px;}
.is-prospect__info h5{font-size: 22px; font-weight: 700; color: #111; margin: 0 0 14px;}
.is-legend{list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 18px;}
.is-legend li{display: flex; align-items: center; gap: 8px; font-size: 17px; color: #555;}
.is-legend i{width: 14px; height: 14px; border-radius: 4px; display: inline-block;}
.is-chart__cap{display: inline-block; padding: 11px 24px; border-radius: 50px; background: linear-gradient(135deg,#45c5fd,#1f9be0); color: #fff; font-size: 20px; font-weight: 700; box-shadow: 0 10px 22px -8px rgba(69,197,253,.6);}
.is-chart__src{margin: 14px 0 0; font-size: 16px; color: #9aa3b5; text-align: right;}

/* ---------- 02 반응형 (sub1_1 융합보안이란?) ---------------------------------
   브레이크포인트 : 1600 / 1400 / 1200 / 1024 / 768 / 500
   - 히어로 / 3분할 탭 / 원형 다이어그램 등 PC 레이아웃 "구조"는 그대로 두고
     여백·폰트 크기만 단계적으로 줄인다.
   - 768 이하에서 원형 다이어그램(.is-diagram)은 구조를 유지한 채
     .is-diagram-scroll 로 가로 스크롤 처리한다.
     ("좌우로 스크롤하세요" 안내 오버레이 = 12번 섹션 + tail.php 스크립트 세트)
   - sub1_1.php 에 인라인 style 로 박혀 있는 폰트 값(.is-prospect__info h5 / p,
     .is-diagram__hub)만 !important 로 덮는다.
   ---------------------------------------------------------------------------- */

/* 다이어그램 가로 스크롤 래퍼 (tail.php 스크립트가 .is-diagram 을 감싸서 생성) */
.is-diagram-scroll{position: relative;}

@media (max-width: 1600px){
	.is-hero{padding: 150px 52px 64px;}
	.is-hero__title{font-size: 38px; margin-bottom: 24px;}
	.is-hero__desc{font-size: 21px;}
	.is-tabsec{margin-top: 84px;}
	.is-tab{font-size: 22px; height: 90px;}
	.is-tabcontents{padding: 56px 48px;}
	.is-pane__tit{font-size: 30px;}
	.is-checklist li{font-size: 19px;}
	.is-diff__row p{font-size: 19px;}
}

@media (max-width: 1400px){
	.is-hero{padding: 130px 46px 58px;}
	.is-hero__title{font-size: 36px; margin-bottom: 22px;}
	.is-hero__desc{font-size: 20px; line-height: 1.8;}
	.is-hero__desc + .is-hero__desc{margin-top: 16px;}
	.is-tabsec{margin-top: 76px;}
	.is-tabs{margin-bottom: 34px;}
	.is-tab{font-size: 21px; height: 86px; gap: 12px;}
	.is-tabcontents{padding: 52px 44px;}
	.is-pane__num{width: 64px; height: 64px; font-size: 20px;}
	.is-pane__tit{font-size: 29px;}
	.is-checklist li{font-size: 18px; padding: 21px 24px 21px 58px;}
	.is-diff__row{padding: 26px 30px;}
	.is-diff__row p{font-size: 18px;}
	.is-prospect{gap: 40px;}
}

@media (max-width: 1200px){
	.is-hero{padding: 110px 40px 52px; border-radius: 22px;}
	.is-hero__title{font-size: 33px; margin-bottom: 20px;}
	.is-hero__desc{font-size: 19px;}
	.is-tabsec{margin-top: 66px;}
	.is-tabs{gap: 10px; margin-bottom: 30px;}
	.is-tab{font-size: 19px; height: 80px; gap: 10px;}
	.is-tab__txt{word-break: keep-all;}
	.is-tabcontents{padding: 46px 36px; border-radius: 20px;}
	.is-pane__head{gap: 18px; margin-bottom: 30px; padding-bottom: 22px;}
	.is-pane__num{width: 60px; height: 60px; font-size: 19px;}
	.is-pane__eng{font-size: 17px;}
	.is-pane__tit{font-size: 27px;}
	.is-checklist li{font-size: 17px; padding: 19px 22px 19px 54px;}
	.is-checklist li::before{left: 20px; top: 23px; width: 20px; height: 20px;}
	.is-checklist li::after{left: 26px; top: 28px; width: 6px; height: 10px;}
	.is-diff{gap: 14px;}
	.is-diff__row{gap: 20px; padding: 24px 26px;}
	.is-diff__tag{flex: 0 0 116px; padding: 12px 0; font-size: 17px; letter-spacing: .5px;}
	.is-diff__row p{font-size: 17px; line-height: 1.75;}
	.is-diagram{max-width: 560px;}
	.is-diagram__hub{font-size: 21px !important;}
	.is-diagram__core{font-size: 15px;}
	.is-diagram__sat{font-size: 16px;}
	.is-chartwrap{padding: 32px 30px;}
	.is-prospect{gap: 34px;}
	.is-donut{width: 180px; height: 180px;}
	.is-donut__txt b{font-size: 26px;}
	.is-prospect__info h5{font-size: 21px !important;}
	.is-prospect__info p{font-size: 17px !important;}
	.is-legend li{font-size: 16px;}
}

@media (max-width: 1024px){
	.is-hero{padding: 92px 32px 46px; border-radius: 20px;}
	.is-hero__title{font-size: 30px; margin-bottom: 18px;}
	.is-hero__desc{font-size: 18px; line-height: 1.78;}
	.is-hero__desc + .is-hero__desc{margin-top: 14px;}
	.is-tabsec{margin-top: 58px;}
	.is-tabs{margin-bottom: 26px;}
	.is-tab{height: auto; min-height: 74px; padding: 12px 10px; font-size: 17px; gap: 8px; border-radius: 14px;}
	.is-tabcontents{padding: 40px 28px;}
	.is-pane__head{gap: 16px; margin-bottom: 26px; padding-bottom: 20px;}
	.is-pane__num{width: 54px; height: 54px; font-size: 18px;}
	.is-pane__eng{font-size: 16px; letter-spacing: 1.5px;}
	.is-pane__tit{font-size: 25px;}
	.is-checklist li{font-size: 16px; padding: 18px 20px 18px 50px;}
	.is-checklist li::before{left: 18px; top: 22px; width: 19px; height: 19px;}
	.is-checklist li::after{left: 24px; top: 27px; width: 6px; height: 10px;}
	.is-diff__row{gap: 18px; padding: 22px 22px;}
	.is-diff__tag{flex: 0 0 104px; padding: 11px 0; font-size: 16px; letter-spacing: 0;}
	.is-diff__row p{font-size: 16px;}
	.is-diagram{max-width: 520px;}
	.is-diagram__hub{font-size: 19px !important;}
	.is-diagram__core{font-size: 14px;}
	.is-diagram__sat{font-size: 15px;}
	.is-chartwrap{padding: 28px 24px; margin-top: 40px;}
	.is-prospect{gap: 28px;}
	.is-donut{width: 170px; height: 170px;}
	.is-donut__txt b{font-size: 24px;}
	.is-donut__txt span{font-size: 15px;}
	.is-prospect__info{max-width: 340px;}
	.is-prospect__info h5{font-size: 20px !important;}
	.is-prospect__info p{font-size: 16px !important; line-height: 1.6 !important;}
	.is-legend li{font-size: 15px;}
}

@media (max-width: 768px){
	/* 히어로 */
	.is-hero{padding: 46px 22px; border-radius: 18px;}
	.is-hero__title{font-size: 24px; margin-bottom: 16px;}
	.is-hero__desc{font-size: 15px; line-height: 1.75;}
	.is-hero__desc + .is-hero__desc{margin-top: 12px;}
	/* 탭 : 3개 가로 배치가 불가능한 폭이라 세로 스택 */
	.is-tabsec{margin-top: 48px;}
	.is-tabs{flex-direction: column; gap: 8px; margin-bottom: 22px;}
	.is-tab{min-height: 0; height: auto; padding: 15px 16px; gap: 10px; justify-content: flex-start; border-radius: 12px; font-size: 16px;}
	.is-tab__num{font-size: 15px;}
	.is-tab__txt{font-size: 16px;}
	/* 패널 */
	.is-tabcontents{padding: 28px 18px; border-radius: 16px;}
	.is-pane__head{gap: 12px; margin-bottom: 22px; padding-bottom: 18px;}
	.is-pane__num{width: 44px; height: 44px; font-size: 15px;}
	.is-pane__eng{font-size: 13px; letter-spacing: 1.2px; margin-bottom: 4px;}
	.is-pane__tit{font-size: 19px;}
	/* 체크리스트 */
	.is-checklist li{font-size: 15px; padding: 16px 16px 16px 44px; border-radius: 12px; line-height: 1.65;}
	.is-checklist li + li{margin-top: 10px;}
	.is-checklist li::before{left: 15px; top: 19px; width: 17px; height: 17px;}
	.is-checklist li::after{left: 20px; top: 23px; width: 5px; height: 9px;}
	.is-checklist li:hover{transform: none;}
	/* 차별성 */
	.is-diff{gap: 12px; margin-bottom: 18px;}
	.is-diff__row{flex-direction: column; align-items: flex-start; gap: 10px; padding: 20px 18px; border-radius: 14px;}
	.is-diff__tag{flex: none; width: auto; min-width: 92px; padding: 9px 16px; font-size: 14px; letter-spacing: 0;}
	.is-diff__row p{font-size: 15px; line-height: 1.7;}
	/* 다이어그램 : 원형 구조 그대로 두고 가로 스크롤 (안내 오버레이는 12번 섹션) */
	.is-diagram-scroll{overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; margin-top: 36px; border-radius: 16px;}
	.is-diagram-scroll::-webkit-scrollbar{height: 4px;}
	.is-diagram-scroll::-webkit-scrollbar-thumb{background: #c9d3ee; border-radius: 999px;}
	/* 컨테이너에 맞춰 줄어들다가 560px 아래로는 줄이지 않고 가로 스크롤로 넘긴다 */
	.is-diagram{width: 100%; min-width: 560px; max-width: 640px; margin: 0 auto !important;}
	.is-diagram__hub{font-size: 20px !important;}
	.is-diagram__core{font-size: 15px;}
	.is-diagram__sat{font-size: 15px;}
	/* 차트 */
	.is-chartwrap{padding: 22px 16px; border-radius: 16px; margin-top: 34px;}
	.is-prospect{flex-direction: column; gap: 20px;}
	.is-donut{width: 160px; height: 160px;}
	.is-donut__txt b{font-size: 21px;}
	.is-donut__txt span{font-size: 13px;}
	.is-prospect__info{max-width: 100%;}
	.is-prospect__info h5{font-size: 18px !important; margin-bottom: 10px;}
	.is-prospect__info p{font-size: 15px !important; line-height: 1.65 !important; margin-bottom: 16px !important;}
	.is-legend{gap: 8px 14px;}
	.is-legend li{font-size: 14px; gap: 6px;}
	.is-legend i{width: 12px; height: 12px;}
}

@media (max-width: 500px){
	.is-hero{padding: 36px 18px; border-radius: 14px;}
	.is-hero__title{font-size: 21px; margin-bottom: 12px;}
	.is-hero__desc{font-size: 14px; line-height: 1.72;}
	.is-hero__desc + .is-hero__desc{margin-top: 10px;}
	.is-tabsec{margin-top: 40px;}
	.is-tabs{gap: 7px; margin-bottom: 18px;}
	.is-tab{padding: 13px 14px; gap: 8px; border-radius: 10px;}
	.is-tab__num{font-size: 13px;}
	.is-tab__txt{font-size: 14px;}
	.is-tabcontents{padding: 22px 14px; border-radius: 14px;}
	.is-pane__head{gap: 10px; margin-bottom: 18px; padding-bottom: 14px;}
	.is-pane__head > div{width: calc(100% - 38px);}
	.is-pane__num{width: 38px; height: 38px; font-size: 13px;}
	.is-pane__eng{font-size: 11px; letter-spacing: 1px;}
	.is-pane__tit{font-size: 17px;}
	.is-checklist li{font-size: 14px; padding: 14px 14px 14px 38px; line-height: 1.6;}
	.is-checklist li::before{left: 13px; top: 16px; width: 15px; height: 15px;}
	.is-checklist li::after{left: 17px; top: 20px; width: 4px; height: 8px;}
	.is-diff__row{padding: 16px 14px; gap: 9px; border-radius: 12px;}
	.is-diff__tag{min-width: 84px; padding: 8px 14px; font-size: 13px;}
	.is-diff__row p{font-size: 14px; line-height: 1.65;}
	.is-diagram-scroll{margin-top: 28px;}
	.is-chartwrap{padding: 18px 14px; margin-top: 28px;}
	.is-donut{width: 140px; height: 140px;}
	.is-donut__txt b{font-size: 19px;}
	.is-donut__txt span{font-size: 12px;}
	.is-prospect__info h5{font-size: 16px !important;}
	.is-prospect__info p{font-size: 14px !important;}
	.is-legend li{font-size: 13px;}
	.is-legend i{width: 11px; height: 11px;}
}
/* ============================================================================
   03. sub1_2 학과장 인사말 .gr-
   [sub_Ji.css]
   ========================================================================== */

#greeting{position: relative;}
#greeting .pc-only{display: inline;}
/* ---------- 인트로 히어로 (이미지 배경) ---------- */
.gr-hero{position: relative; overflow: hidden; border-radius: 26px; padding: 100px 40px; text-align: center; background: #06163a center 35%/cover no-repeat; box-shadow: 0 24px 56px -30px rgba(0,34,121,.4);}
.gr-hero__overlay{position: absolute; inset: 0; background: url(/images/sub/sub1_2_Vs.jpg) no-repeat center;}
.gr-hero__inner{position: relative;}
.gr-eyebrow{display: inline-block; font-size: 20px; font-weight: 700; letter-spacing: 3px; color: #7fd8ff; text-transform: uppercase; margin-bottom: 18px;}
.gr-headline{font-size: 45px; font-weight: 700; line-height: 1.42; color: #fff; letter-spacing: -.7px; margin: 0; word-break: keep-all;}
.gr-headline em{font-style: normal; color: #45c5fd;}
/* ---------- 리드 문단 ---------- */
.gr-intro{text-align: center; padding: 70px 0;}
p.gr-reveal.gr-lead{font-size: 22px; font-weight: 500; line-height: 1.95; max-width: 1100px; margin: 0 auto;}
/* ---------- 본문 블록 (좌 제목 / 우 본문) ---------- */
.gr-section{margin-top: 24px;}
.gr-block{display: flex; align-items: flex-start; gap: 85px; margin-top: 60px; padding-top: 50px; border-top: 1px solid #e7edf9; justify-content: center;}
.gr-block:first-child{border-top: 0;}
.gr-block__head{flex: 0 0 360px;}
.gr-block__no{display: inline-block; font-size: 18px; font-weight: 800; letter-spacing: 3px; color: #45c5fd; margin-bottom: 12px;}
.gr-block__tit{font-size: 30px; font-weight: 800; line-height: 1.45; color: #002279; letter-spacing: -.5px; word-break: keep-all; padding-left: 22px; border-left: 5px solid transparent; border-image: linear-gradient(180deg, #002279, #45c5fd) 1;}
.gr-block .gr-reveal{flex: 1; margin: 0;}
/* ---------- 스크롤 텍스트 리빌 ---------- */
.gr-reveal{font-size: 21px; line-height: 2; letter-spacing: -.3px; word-break: keep-all; font-weight: 500; max-width: 950px; margin: 0 auto; color: #222;}
/* ---------- 마무리 ---------- */
/* ---------- 4. 맺음말 (테크 감성 배경 & 애니메이션 완벽 복구) ---------- */
.gr-closing{position: relative; overflow: hidden; margin-top: 100px; padding: 74px 64px; border-radius: 24px; text-align: center; /* 1. 기본 배경: 더 깊고 묵직한 다크 네이비 그라데이션 */ background: linear-gradient(135deg, #020b1f 0%, #00195e 40%, #002279 100%); box-shadow: 0 30px 64px -32px rgba(0,34,121,.6);}
/* 2. 사이버 틱한 그리드(망사) 패턴 오버레이 */
.gr-closing::before{content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none; background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 40px 40px; /* 가장자리는 자연스럽게 페이드 아웃 */ -webkit-mask-image: radial-gradient(circle at 50% 50%, rgba(0,0,0,1) 25%, transparent 80%); mask-image: radial-gradient(circle at 50% 50%, rgba(0,0,0,1) 25%, transparent 80%);}
/* 3. 양 모서리에 은은하게 퍼지는 홀로그램 빛 베이스 */
.gr-closing::after{content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: radial-gradient(circle at 10% 20%, rgba(69,197,253,.15), transparent 45%), radial-gradient(circle at 90% 80%, rgba(31,83,196,.2), transparent 45%);}
/* 4. 떠다니는 빛 구체 (원래 있으셨던 애니메이션 복구 및 강화!) */
.gr-closing__orb{position: absolute; z-index: 0; border-radius: 50%; pointer-events: none; filter: blur(8px);}
.gr-closing__orb--1{width: 300px; height: 300px; top: -120px; left: -80px; background: radial-gradient(circle, rgba(69,197,253,.25), transparent 70%); animation: grFloat 8s ease-in-out infinite;}
.gr-closing__orb--2{width: 250px; height: 250px; bottom: -100px; right: -60px; background: radial-gradient(circle, rgba(127,216,255,.15), transparent 70%); animation: grFloat 10s ease-in-out infinite reverse;}
@keyframes grFloat{
	0%, 100%{transform: translateY(0) scale(1);}
	50%{transform: translateY(30px) scale(1.05);}
}
/* 글자와 서명이 배경에 묻히지 않도록 z-index 확실히 잡아주기 */
.gr-closing__text, .gr-sign{position: relative; z-index: 2;}
.gr-closing__text{position: relative; z-index: 2; font-size: 30px; font-weight: 700; line-height: 1.65; color: #fff; letter-spacing: -.6px; word-break: keep-all;}
.gr-closing__text em{font-style: normal; color: #45c5fd;}
.gr-sign{position: relative; z-index: 2; margin-top: 34px; font-size: 22px; color: #bcd3ff; letter-spacing: 1px;}
.gr-sign strong{display: block; font-size: 26px; font-weight: 600; color: #fff; letter-spacing: -.3px;}

/* ---------- 스크롤 텍스트 리빌 (핵심 애니메이션) ---------- */
.gr-word{color: #222;}
/* <strong> 이나 <em> 안의 단어는 켜졌을 때 브랜드 컬러로 강조! */
strong .gr-word.is-on{color: #002279;}
em .gr-word.is-on{color: #45c5fd;}

/* ============================================================================
   04. sub1_2 인재상 카드 #talent .tl-
   [sub_Ji.css]
   ========================================================================== */

#talent{position: relative; padding-bottom: 80px;}
.tl-cards{display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 50px;}
.tl-card{position: relative; padding: 46px 36px 40px; background: #ffffff; border: 1px solid #e1e3e8; border-radius: 20px; box-shadow: 0 10px 30px rgba(0, 34, 121, 0.04); overflow: hidden; transition: box-shadow 0.4s ease, border-color 0.4s ease;}
.tl-card::before{content: ''; position: absolute; top: 0; left: 0; width: 0; height: 4px; background: linear-gradient(90deg, #002279 0%, #45c5fd 100%); transition: width 0.5s ease;}
.tl-card:hover{box-shadow: 0 20px 40px rgba(0, 34, 121, 0.12); border-color: #d8e3ff;}
.tl-card:hover::before{width: 100%;}
.tl-card__icon{display: inline-flex; align-items: center; justify-content: center; width: 54px; height: 54px; border-radius: 14px; background: linear-gradient(135deg, #002279 0%, #1a3aa3 100%); color: #ffffff; font-size: 20px; font-weight: 800; margin-bottom: 24px; box-shadow: 0 10px 20px rgba(0, 34, 121, 0.2); transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);}
.tl-card:hover .tl-card__icon{transform: translateY(-8px) scale(1.05);}
.tl-card__tit{font-size: 22px; font-weight: 700; color: #111; line-height: 1.4; letter-spacing: -0.5px; margin: 0 0 18px; transition: color 0.3s ease;}
.tl-card__tit em{display: block; font-style: normal; color: #002279; font-size: 24px; margin-top: 4px;}
.tl-card:hover .tl-card__tit em{color: #45c5fd;}
.tl-card__desc{font-size: 17px; color: #555; line-height: 1.75; letter-spacing: -0.3px; word-break: keep-all; margin: 0;}

/* ============================================================================
   05. sub1_5 발전기금 #devel
   ========================================================================== */
#devel{--dv-navy: #061a4d; --dv-blue: #1f75f7; --dv-sky: #45c5fd; --dv-ink: #101828; --dv-muted: #4b5565; --dv-line: #e5ebf6; position: relative; overflow: hidden; padding: 10px 0 30px; color: var(--dv-ink); word-break: keep-all;}
#devel *{box-sizing: border-box;}
#devel .devel-hero{position: relative; min-height: 400px; padding: 50px 70px; border-radius: 28px; overflow: hidden; isolation: isolate; background: url('../images/sub/devel-hero.jpg') no-repeat 50% 0 /cover;}
#devel .devel-hero__copy{position: relative; z-index: 2; color: #fff;}
#devel .devel-hero__copy h2{margin: 0; color: #fff; font-size: 34px; font-weight: 700; line-height: 1.43; letter-spacing: -1px;}
#devel .devel-hero__copy h2 strong{color: #7fd8ff; font-weight: 800;}
#devel .devel-hero__bar{display: block; width: 50px; height: 1px; margin: 20px 0; background: #fff; opacity: .5;}
#devel .devel-hero__copy p{margin: 0; color: rgba(255,255,255,.9); font-size: 20px; line-height: 1.8; letter-spacing: -.35px;}
#devel .devel-cards{position: relative; display: flex; justify-content: center; gap: 20px; margin: -90px 34px 64px; z-index: 1;}
#devel .devel-card{width: 28%; padding: 20px 20px 30px; text-align: center; border: 1px solid rgba(228, 234, 246, .95); border-radius: 18px; background: rgba(255,255,255,.9); box-shadow: 0 24px 50px -34px rgba(3, 24, 74, .38); backdrop-filter: blur(10px); transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;}
#devel .devel-card__icon{display: inline-flex; align-items: center; justify-content: center; width: 70px; height: 70px; margin-bottom: 20px; border-radius: 50%; color: #fff; font-size: 32px; background: radial-gradient(circle at 28% 22%, #1f75f7, #092a8d 72%); box-shadow: 0 18px 34px -22px rgba(3, 24, 74, .7);}
#devel .devel-card h3{position: relative; margin: 0 0 20px; padding-bottom: 20px; color: #071d5c; font-size: 26px; font-weight: 700; line-height: 1.25; letter-spacing: -.7px;}
#devel .devel-card h3::after{content: ""; position: absolute; left: 50%; bottom: 0; width: 30px; height: 2px; background: var(--dv-blue); transform: translateX(-50%);}
#devel .devel-card p{margin: 0; color: #263244; font-size: 18px; line-height: 1.78; letter-spacing: -.35px;}
#devel .devel-link{display: flex; justify-content: center;}
#devel .devel-link a{display: inline-flex; align-items: center; gap: 16px; padding: 0 10px 16px; color: #111827; border-bottom: 3px solid var(--dv-blue); font-size: 24px; font-weight: 800; line-height: 1.2; letter-spacing: -.55px; text-decoration: none; transition: color .25s ease, gap .25s ease;}
#devel .devel-link a:hover,
#devel .devel-link a:focus{color: var(--dv-blue); gap: 20px;}
#devel .devel-link i{color: #072989; font-size: 34px; font-weight: 400; line-height: 1;}
#devel .devel-link .ri-external-link-line{color: #111827; font-size: 30px;}
@media (max-width: 1200px){
	#devel .devel-hero{min-height: 560px; padding: 84px 54px 66px;}
	#devel .devel-hero__copy h2{font-size: 38px;}
	#devel .devel-cards{gap: 22px; margin-right: 10px; margin-left: 10px;}
	#devel .devel-card{min-height: 330px; padding: 48px 26px 38px;}
}

@media (max-width: 991px){
	#devel .devel-hero{min-height: auto; padding: 70px 42px;}
	#devel .devel-hero__copy{max-width: none;}
	#devel .devel-cards{flex-direction: column; align-items: stretch; max-width: 560px; margin: 54px auto 50px;}
	#devel .devel-card{min-height: 0; width: 100%;}
}

@media (max-width: 768px){
	#devel{padding-top: 0;}
	#devel .devel-hero{padding: 44px 24px; border-radius: 18px;}
	#devel .devel-hero__copy h2{font-size: 28px; line-height: 1.45;}
	#devel .devel-hero__bar{width: 46px; margin: 26px 0 22px;}
	#devel .devel-hero__copy p{font-size: 16px; line-height: 1.7;}
	#devel .devel-cards{gap: 16px; margin-top: 36px; margin-bottom: 38px;}
	#devel .devel-card{padding: 34px 22px 30px; border-radius: 14px;}
	#devel .devel-card__icon{width: 86px; height: 86px; margin-bottom: 22px; font-size: 40px;}
	#devel .devel-card h3{margin-bottom: 22px; padding-bottom: 18px; font-size: 22px;}
	#devel .devel-card p{font-size: 15px; line-height: 1.68;}
	#devel .devel-link a{gap: 10px; max-width: 100%; padding-bottom: 12px; font-size: 18px; text-align: center;}
	#devel .devel-link i{font-size: 26px;}
	#devel .devel-link .ri-external-link-line{font-size: 22px;}
}

@media (max-width: 400px){
	#devel .devel-hero{padding-right: 20px; padding-left: 20px;}
	#devel .devel-hero__copy h2{font-size: 25px;}
}

/* ============================================================================
   06. 03~04 반응형(공통)
   [sub_Ji.css]
   - sub1_1(.is-) 반응형은 02번 섹션 끝의 "02 반응형" 블록으로 이관했다.
   ========================================================================== */

@media (max-width: 1200px){
	.is-intro__title{font-size: 38px;}
}

@media (max-width: 991px){
	.gr-block{gap: 34px;}
	.gr-block__head{flex-basis: 260px;}
	.gr-block__tit{font-size: 26px;}
	.gr-closing__text{font-size: 24px;}
	.gr-headline{font-size: 36px;}
	.tl-cards{grid-template-columns: repeat(2, 1fr);}
	.pc-only{display:none;}
	.is-intro__cards{grid-template-columns: 1fr;}
}

@media (max-width: 768px){
	#greeting .pc-only, #Intro .pc-only{display: none;}
	/* 히어로 섹션 */
	.is-intro__title{font-size: 30px;}
	.gr-hero{padding: 58px 22px; border-radius: 20px;}
	.gr-headline{font-size: 25px; letter-spacing: -1px;}
	.gr-eyebrow{margin-bottom: 14px; font-size: 16px;}
	/* 리드 및 본문 */
	.gr-intro{padding: 40px 0;}
	p.gr-reveal.gr-lead{font-size: 17px; line-height: 1.8;}
	.gr-reveal{font-size: 16px; line-height: 1.8;}
	.gr-block{flex-direction: column; gap: 20px; margin-top: 10px; padding-top: 10px;}
	.gr-block__head{flex-basis: auto;}
	.gr-block__head::before{margin-bottom: 14px;}
	.gr-block__tit{font-size: 22px;}
	/* 인재상 카드 */
	.tl-cards{grid-template-columns: 1fr; gap: 16px;}
	.tl-card{padding: 34px 26px 30px;}
	.tl-card__icon{width: 48px; height: 48px; font-size: 18px; margin-bottom: 18px;}
	.tl-card__tit{font-size: 20px;}
	.tl-card__tit em{font-size: 22px;}
	.tl-card__desc{font-size: 16px; line-height: 1.7;}
	/* 노트 */
	.is-note{flex-direction: column; gap: 12px; padding: 22px;}
	/* 맺음말 */
	.gr-closing{padding: 54px 26px; margin-top: 60px;}
	.gr-closing__text{font-size: 20px; line-height: 1.5;}
	.gr-sign strong{font-size: 20px;}
}

/* ============================================================================
   07. sub1_4 오시는 길 .loc-
   [sub_Ji.css]
   ========================================================================== */

.loc{/* 학과 전용 테마 컬러 로컬 변수 세팅 */ --navy: #002279; --sky: #45c5fd; --grad-soft: linear-gradient(135deg, #002279, #45c5fd); --text: #111111; --text-2: #555555; --line: #cdcdcd; --tint: #f4f7ff; --tint-2: #fafbff; --shadow-sm: 0 12px 24px -10px rgba(0, 34, 121, 0.15); font-family: 'Pretendard', sans-serif;}
.loc-inner{margin: 0 auto;}
/* ---------- 1. 지도 영역 (Inverted Radius 적용) ---------- */
.loc-map{position: relative; width: 100%; height: 540px; border-radius: 28px; overflow: hidden; background: var(--tint-2);}
.loc-map iframe{display: block; width: 100%; height: 100%;}
/* 지도 바로가기 버튼 컨테이너 */
.loc-links{position: absolute; bottom: 0; right: 0; z-index: 2; display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-end; padding: 24px 24px 0 24px; max-width: 100%; background-color: #f5f4f2; border-radius: 36px 0 0 0; padding-bottom:20px;}
/* 우측 하단 역방향 곡선(Inverted Radius) 마법 */
.loc-links::before, .loc-links::after{content: ''; position: absolute; width: 65px; height: 65px; border-radius: 0 0 36px 0; box-shadow: 20px 20px 0 0 #f5f4f2; /* 하얀색 그림자로 곡선 채우기 */ pointer-events: none;}
.loc-links::before{top: -65px; right: 0;}
.loc-links::after{bottom: 0; left: -65px;}
/* 링크 버튼 디자인 */
.loc-link{display: inline-flex; align-items: center; gap: 14px; min-width: 240px; padding: 16px 22px; border-radius: 18px; background: #fff; border: 1px solid var(--line); box-shadow: 0 6px 12px rgba(0,0,0,0.03); transition: 0.35s cubic-bezier(0.16, 0.84, 0.44, 1); text-decoration: none;}
.loc-link:hover{transform: translateY(-6px); box-shadow: var(--shadow-sm); border-color: var(--sky);}
/* 링크 아이콘 */
.loc-link-ico{flex: 0 0 auto; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; font-size: 18px; font-weight: 900; color: #fff;}
.loc-link.is-naver .loc-link-ico{background: #03c75a;}
.loc-link.is-google .loc-link-ico{background: #4285f4;}
.loc-link.is-campus .loc-link-ico{background: var(--grad-soft); font-size: 14px;}
/* 링크 텍스트 */
.loc-link-txt{display: flex; flex-direction: column; font-size: 19px; font-weight: 800; color: var(--text); line-height: 1.25;}
.loc-link-txt small{font-size: 14px; font-weight: 500; color: var(--text-2); margin-top: 4px;}
/* ---------- 2. 공통 블록 (타이틀) ---------- */
.loc-block{margin-top: 80px;}
.loc-h3{font-size: 28px; font-weight: 800; letter-spacing: -.5px; color: var(--text); margin-bottom: 28px; padding-left: 20px; position: relative;}
.loc-h3::before{content: ""; position: absolute; left: 0; top: 4px; bottom: 4px; width: 6px; border-radius: 4px; background: var(--grad-soft);}
/* ---------- 3. 사무실 정보 테이블 ---------- */
.loc-table{list-style: none; padding: 0; margin: 0; border-top: 2px solid var(--navy);}
.loc-table > li{display: flex; align-items: flex-start; gap: 24px; padding: 26px 16px; border-bottom: 1px solid var(--line);}
.loc-table .lk{flex: 0 0 130px; font-size: 19px; font-weight: 800; color: var(--navy);}
.loc-table .lv{flex: 1; font-size: 18px; color: var(--text); line-height: 1.7; word-break: keep-all;}
.loc-table .lv strong{color: #111;}
.loc-table .lv a{color: var(--navy); font-weight: 700; text-decoration: none; transition: color 0.2s;}
.loc-table .lv a:hover{color: var(--sky); text-decoration: underline;}
/* 알림(Note) 박스 */
.loc-note{margin-top: 20px; padding: 18px 24px 18px 48px; font-size: 16px; color: var(--text-2); line-height: 1.6; background: var(--tint-2); border: 1px dashed #d1d9ec; border-radius: 14px; position: relative; word-break: keep-all;}
.loc-note::before{content: "※"; position: absolute; left: 20px; top: 18px; color: var(--sky); font-weight: 800;}
/* ---------- 4. 교통편 카드 ---------- */
.loc-cards{display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;}
.loc-card{background: #fff; border: 1px solid var(--line); border-radius: 22px; padding: 40px 32px; transition: 0.35s cubic-bezier(0.16, 0.84, 0.44, 1);}
/* 카드 호버 시 상단 테두리 그라데이션 라인 효과 */
.loc-card{position: relative; overflow: hidden;}
.loc-card::after{content: ''; position: absolute; top: 0; left: 0; width: 0; height: 4px; background: var(--grad-soft); transition: width 0.4s ease;}
.loc-card:hover{transform: translateY(-8px); box-shadow: var(--shadow-sm); border-color: #d8e3ff;}
.loc-card:hover::after{width: 100%;}
.loc-card-ico{width: 64px; height: 64px; display: grid; place-items: center; border-radius: 16px; background: var(--tint); color: var(--sky); font-size: 32px; margin-bottom: 24px; transition: background 0.3s, color 0.3s;}
.loc-card:hover .loc-card-ico{background: var(--navy); color: #fff;}
.loc-card h4{font-size: 24px; font-weight: 800; color: var(--navy); margin: 0 0 18px;}
.loc-card ul{list-style: none; padding: 0; margin: 0;}
.loc-card li{position: relative; padding: 6px 0 6px 18px; font-size: 17px; color: var(--text-2); line-height: 1.6; word-break: keep-all;}
.loc-card li::before{content: ""; position: absolute; left: 0; top: 16px; width: 6px; height: 6px; border-radius: 50%; background: var(--sky);}
.loc-card li b{color: #111; font-weight: 700;}
/* ---------- 5. 반응형 (모바일 완벽 대응) ---------- */
@media (max-width: 991px){
	.loc-cards{grid-template-columns: repeat(2, 1fr);}
	.loc-map{height: 460px;}
	.loc-links{padding: 16px 16px 0 16px; gap: 8px; border-radius: 28px 0 0 0;}
	.loc-links::before, .loc-links::after{width: 40px; height: 40px;}
	.loc-links::before{top: -40px;}
	.loc-links::after{left: -40px;}
	.loc-link{min-width: 0; gap: 12px; padding: 12px 18px; border-radius: 14px;}
	.loc-link-ico{width: 40px; height: 40px; font-size: 16px;}
	.loc-link-txt{font-size: 16px;}
	.loc-link-txt small{display: none;}
}
@media (max-width: 768px){
	.loc-block{margin-top: 60px;}
	.loc-h3{font-size: 24px; margin-bottom: 20px;}
	.loc-map{height: 400px; border-radius: 20px;}
	/* 모바일에서는 버튼들을 좌측 하단으로 풀고 일렬 배치 */
	.loc-links{position: relative; padding: 16px 0 0 0; background: transparent; flex-direction: column; align-items: stretch; gap: 10px; border-radius: 0;}
	.loc-links::before, .loc-links::after{display: none;}
	.loc-link-wrap{width: 100%;}
	.loc-link{width: 100%; justify-content: center; padding: 14px;}
	.loc-link-txt small{display: block; font-size: 13px;}
	.loc-table > li{flex-direction: column; gap: 10px; padding: 22px 10px;}
	.loc-table .lk{flex-basis: auto; font-size: 18px;}
	.loc-table .lv{font-size: 16px;}
	.loc-cards{grid-template-columns: 1fr; gap: 16px;}
	.loc-card{padding: 34px 26px;}
	.loc-card h4{font-size: 22px;}
	.loc-card li{font-size: 16px;}
}

/* ============================================================================
   08. sub3_x 학과소개 / 교과과정 / 입학안내 / 학사안내 .nam-
   [sub_Nam.css]
   ========================================================================== */

.nam-curriculum{color: var(--nam-text); line-height: 1.6; box-sizing: border-box;}
.nam-curriculum *, .nam-curriculum *::before, .nam-curriculum *::after{box-sizing: border-box;}
.nam-page-head{text-align: center; margin-bottom: 50px;}
.nam-page-head h1{font-size: 34px; font-weight: 800; color: var(--nam-navy); margin: 0 0 14px; letter-spacing: -0.02em;}
.nam-page-head h1::after{content: ""; display: block; width: 46px; height: 4px; border-radius: 2px; background: var(--nam-accent); margin: 16px auto 0;}
.nam-page-head p{font-size: 16px; color: var(--nam-text-sub); margin: 0;}
.nam-section{padding-top: 100px;}
.nam-section:first-of-type{margin-top: 0; padding-top: 0;}
.nam-section > h2{display: flex; align-items: center; gap: 14px; font-size: 32px; font-weight: 800; color: var(--nam-navy); margin: 0 0 22px; line-height: 1.25; letter-spacing: -0.6px; word-break: keep-all;}
.nam-section > h2::before{content: ""; flex: none; width: 6px; height: 30px; border-radius: 4px; background: linear-gradient(var(--nam-navy), var(--nam-sky));}
.nam-table-scroll{border-radius: 16px; overflow: hidden; background: #fff; border: 1px solid var(--nam-line); box-shadow: var(--nam-card-shadow);}
.nam-table{width: 100%; border-collapse: collapse; font-size: 15px; background: #fff;}
.nam-table th, .nam-table td{padding: 15px 18px; vertical-align: middle; border-bottom: 1px solid var(--nam-line);}
.nam-table th:not(:last-child), .nam-table td:not(:last-child){border-right: 1px solid var(--nam-line-soft);}
.nam-table tbody tr:last-child th, .nam-table tbody tr:last-child td{border-bottom: 0;}
.nam-table thead th{background: var(--nam-navy); color: #fff; font-weight: 600; text-align: center; padding: 16px 18px; letter-spacing: 0.02em; border-bottom: 0; font-size: 18px;}
.nam-table thead th:not(:last-child){border-right: 1px solid rgba(255, 255, 255, 0.16);}
.nam-note{margin-top: 14px; font-size: 14px; font-weight: 500; color: var(--nam-text-sub); padding-left: 2px; text-align: right;}
.nam-note::before{content: "※ "; color: var(--nam-accent); font-weight: 700;}
/* ----------------------------------- sub3_1 : 학과소개 ----------------------------------- */
.nam-org{display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding: 12px 0 4px;}
.nam-org__group{display: flex; flex-direction: column; align-items: center; gap: 24px; width: 47%;}
.nam-org__roof{width: 100%; text-align: center; color: #fff; font-size: 23px; font-weight: 700; letter-spacing: 0.08em; padding: 18px 24px; border-radius: 12px; background: linear-gradient(135deg, var(--nam-navy), var(--nam-accent)); box-shadow: 0 12px 24px rgba(20, 40, 80, 0.16);}
.nam-org__roof--alt{background: linear-gradient(135deg, #123a82, var(--nam-sky));}
.nam-org__branches{display: flex; align-items: flex-start; justify-content: center; gap: 18px; width: 100%;}
.nam-org__branch{display: flex; flex-direction: column; align-items: center; gap: 18px; width: 100%;}
.nam-org__node{padding: 14px 26px; border-radius: 12px; font-size: 22px; font-weight: 600; text-align: center; background: #6479af; color: #fff; transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; width: 100%;}
.nam-org__node:hover{border-color: var(--nam-accent); box-shadow: 0 12px 26px rgba(31, 83, 196, 0.2);}
.nam-org__node--fill{color: #fff; border: 0; background: #90bbce;}
.nam-org__plus{align-self: center; color: #f5821f; font-size: 27px; font-weight: 800; line-height: 1;}
.nam-org__plus--lg{font-size: 34px;}
.nam-org__leafrow{display: flex; gap: 18px; justify-content: center; width: 100%;}
.nam-org__leaf{position: relative; width: 100%; padding: 14px 18px; text-align: center; color: var(--nam-navy); font-weight: 600; font-size: 20px; background: #fff; border: 1px solid #dde6f4; border-radius: 12px; box-shadow: 0 4px 12px rgba(20, 40, 80, 0.06); transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.nam-org__leaf:hover{border-color: var(--nam-accent); box-shadow: 0 12px 26px rgba(31, 83, 196, 0.18);}
.nam-org__leaf::before{content: ""; position: absolute; left: 50%; top: -18px; width: 2px; height: 18px; background: #d6dfec; transform: translateX(-50%); z-index: -1;}
.nam-org__leaf .sub{display: block; margin-top: 5px; font-size: 18px; font-weight: 500; color: var(--nam-text-sub); line-height: 1.45;}
.nam-tabs__nav{display: flex; gap: 12px; margin-bottom: 40px; list-style: none; padding: 0;}
.nam-tab{flex: 1; position: relative; display: flex; align-items: center; justify-content: center; gap: 14px; height: 94px; font-size: 23px; cursor: pointer; background: #fff; border: 1px solid #e1e3e8; border-radius: 16px; box-shadow: 0 6px 16px rgba(0, 0, 0, 0.02); transition: background .3s ease, border-color .3s ease, box-shadow .3s ease, transform .3s ease;}
.nam-tab:hover{background: #f8f9fc; transform: translateY(-2px);}
.nam-tab__num{font-weight: 700; color: #a7b1cf; letter-spacing: 1px; transition: color .3s ease;}
.nam-tab__txt{font-weight: 700; color: #5e6a86; letter-spacing: -.5px; transition: color .3s ease;}
.nam-tab.is-active{background: linear-gradient(135deg, #002279 0%, #1a3aa3 100%); border-color: #002279; box-shadow: 0 16px 32px -14px rgba(0, 34, 121, .45); transform: translateY(-2px);}
.nam-tab.is-active .nam-tab__num{color: #45c5fd;}
.nam-tab.is-active .nam-tab__txt{color: #fff;}
.nam-tabpanel{display: none;}
.nam-tabpanel.is-active{display: block; animation: namTabFade .35s ease;}
@keyframes namTabFade{
	from{opacity: 0; transform: translateY(10px);}
	to{opacity: 1; transform: none;}
}
.nam-majorview{display: grid; grid-template-columns: 47% 1fr; gap: 50px; align-items: center;}
.nam-majorview__img{position: relative; aspect-ratio: 11 / 9; border-radius: 24px; overflow: hidden; background: var(--nam-accent-soft); display: flex; align-items: center; justify-content: center;}
.nam-majorview__img img{width: 100%; height: 100%; object-fit: cover; display: block;}
.nam-majorview__imgph{display: flex; flex-direction: column; align-items: center; gap: 10px; color: var(--nam-accent); font-size: 14px; font-weight: 600; opacity: .7;}
.nam-majorview__imgph svg{width: 48px; height: 48px;}
.nam-majorview__info{display: flex; flex-direction: column; gap: 20px;}
.nam-major__head{display: block; margin-bottom: 22px;}
.nam-major__tag{display: none;}
.nam-major__ko{display: block; font-size: 50px; font-weight: 800; color: var(--nam-navy); letter-spacing: -0.02em; line-height: 1.25;}
.nam-major__en{transform: translateY(30px); display: block; font-family: 'Poppins', sans-serif; font-size: 38px; font-weight: 600; color: #e7e7e7; text-align: right; position: relative; z-index: -1;}
.nam-major__desc{margin: 0; font-weight: 500; font-size: 20px; line-height: 1.7; color: #222; word-break: keep-all;}
.nam-major__kw ul{position: relative; display: flex; align-items: center; flex-wrap: wrap; gap: 9px;}
.nam-major__kw .kw-label{flex: none; padding: 4px 12px; font-size: 13px; font-weight: 700; color: var(--nam-accent); background: var(--nam-accent-soft); border-radius: 7px;}
.nam-major__kw ul{display: flex; flex-wrap: wrap; gap: 7px; list-style: none; margin: 0; padding: 0;}
.nam-major__kw li{padding: 8px 20px; font-size: 20px; font-weight: 500; color: var(--nam-text-sub); background: #f2f2f2; border: 1px solid #dde6f4; border-radius: 10px; background: rgba(255,255,255,.3); transition: background .18s ease, color .18s ease, border-color .18s ease;}
.nam-major_prof{display: flex; align-items: center; flex-wrap: wrap; gap: 22px; padding-top: 20px; margin-top: 20px; border-top: 1px dotted #b7bec9;}
.nam-major_prof .mj-tag a{display: inline-flex; flex-direction: column; align-items: center; gap: 9px; padding: 10px 20px; font-size: 17px; font-weight: 600; color: #5e6a86; background: rgba(255,255,255,.3); border: 1px solid #dde6f4; border-radius: 10px; letter-spacing: -.2px; transition:all 0.4s ease;}
.nam-major_prof .mj-tag a::before{display: none;}
.nam-major_prof .mj-tag a .img_box{width: 90px; height: 90px; flex: none; border-radius: 50%; overflow: hidden; background: #eef2f8;}
.nam-major_prof .mj-tag a .img_box img{display: block; width: 100%; height: 100%; object-fit: cover;}
.nam-major_prof .mj-tag a .img_box.noimg{display: flex; align-items: center; justify-content: center; font-size: 42px; color: #b9c4d6;}
.nam-major_prof .mj-tag a:hover{transform: translateY(-5px); background: var(--nam-accent-soft);}
/* ----------------------------------- sub3_3 : 교과과정 ----------------------------------- */
.nam-table .col-gubun{width: 132px;}
.nam-table .row-label{background: var(--nam-gray-bg); color: var(--nam-navy); font-weight: 700; text-align: center; width: 132px; line-height: 1.45; font-size: 18px;}
.nam-table .sub-label{background: var(--nam-accent-soft); color: var(--nam-accent); font-weight: 700; text-align: center; letter-spacing: 0.01em;}
.nam-table .area-row th{background: var(--nam-accent-soft); color: var(--nam-navy); font-weight: 700; text-align: center; letter-spacing: 0.05em; padding: 12px 18px; font-size: 18px;}
.nam-common-list{list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;}
.nam-common-list li{background: var(--nam-accent-soft); color: var(--nam-accent); border-radius: 8px; padding: 7px 14px; font-size: 16px; font-weight: 600; transition: transform .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease;}
.nam-course-list{list-style: none; margin: 0; padding: 0;}
.nam-course-list li{position: relative; padding: 8px 8px 8px 18px; font-weight: 600; font-size: 18px; color: var(--nam-text); border-radius: 8px; transition: background 0.15s ease;}
.nam-course-list li::before{content: ""; position: absolute; left: 8px; top: 50%; transform: translateY(-50%); width: 5px; height: 5px; border-radius: 50%; background: var(--nam-accent);}
.nam-course-list li .tag{font-size: 11.5px; font-weight: 600; color: var(--nam-accent); background: var(--nam-accent-soft); border-radius: 5px; padding: 1px 6px; margin-left: 5px; vertical-align: middle;}
.nam-credit-table th[scope="row"], .nam-credit-table .credit-head{background: var(--nam-gray-bg); color: var(--nam-navy); font-weight: 700; text-align: center; font-size: 18px;}
.nam-credit-table td{font-weight: 600; font-size: 18px; text-align: center; color: var(--nam-text);}
.nam-credit-table .credit-desc{font-size: 16px; color: var(--nam-text-sub); font-weight: 600; display: block; margin-top: 5px; line-height: 1.45;}
.nam-credit-table .num{display: inline-block; font-weight: 700; font-size: 18px; color: var(--nam-accent);}
/* ----------------------------------- sub3_5 : 입학안내 ----------------------------------- */
.nam-admission-table .major-name{text-align: center; font-weight: 600; color: var(--nam-navy); font-size: 18px;}
.nam-admission-table .quota{font-size: 16px; display: inline-block; padding: 4px 14px; font-weight: 700; color: var(--nam-accent); background: var(--nam-accent-soft); border-radius: 8px;}
.nam-info-card{display: flex; align-items: center; gap: 14px; padding: 22px 26px; background: #fff; border: 1px solid var(--nam-line); border-radius: 14px; box-shadow: var(--nam-card-shadow); transition: transform .22s ease, box-shadow .22s ease;}
.nam-info-card .nam-info-icon{flex: none; display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: var(--nam-accent); color: #fff; font-size: 16px; font-weight: 700;}
.nam-info-card p{margin: 0; font-weight: 600; font-size: 20px; color: var(--nam-text);}
.nam-info-card strong{color: var(--nam-navy); font-weight: 700;}
.nam-contact-grid{display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px;}
.nam-contact-card{position: relative; padding: 26px 28px; background: #fff; border: 1px solid var(--nam-line); border-radius: 16px; box-shadow: var(--nam-card-shadow); transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;}
.nam-contact-card .nam-contact-tag{display: inline-block; padding: 5px 13px; font-size: 16px; font-weight: 700; color: var(--nam-accent); background: var(--nam-accent-soft); border-radius: 999px;}
.nam-contact-card .nam-contact-name{margin: 14px 0 16px; font-size: 24px; font-weight: 700; color: var(--nam-navy);}
.nam-contact-list{list-style: none; margin: 0; padding-top: 16px; border-top: 1px solid var(--nam-line-soft);}
.nam-contact-list li{display: flex; align-items: baseline; gap: 8px; padding: 6px 0; font-weight: 600; font-size: 20px; color: var(--nam-text);}
.nam-contact-list li:not(:last-child){padding-top: 0;}
.nam-contact-list .label{flex: none; min-width: 70px; font-weight: 700; color: var(--nam-text-sub);}
.nam-contact-list a{color: var(--nam-accent); text-decoration: none;}
.nam-contact-list a:hover{text-decoration: underline;}
/* ----------------------------------- sub3_6 : 학사안내 ----------------------------------- */
.nam-regula{display: flex; flex-wrap: wrap; justify-content: center; gap: 28px;}
.nam-rgbox{display: block; width: 340px; max-width: 100%; padding: 50px 24px 24px; text-align: center; background: #fff; border: 1px solid var(--nam-line); border-radius: 20px; text-decoration: none; color: inherit; transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;}
.nam-rgbox:hover{transform: translateY(-6px); border-color: var(--nam-navy); box-shadow: 0 20px 42px rgba(20, 40, 80, 0.13);}
.nam-rgbox__icon{display: flex; align-items: center; justify-content: center; width: 140px; height: 140px; margin: 0 auto; border-radius: 50%; background: rgba(0, 34, 121, 0.05); color: var(--nam-navy); transition: background .25s ease, color .25s ease;}
.nam-rgbox__icon i{font-size: 60px;}
.nam-rgbox:hover .nam-rgbox__icon{background: var(--nam-navy); color: #fff;}
.nam-rgbox__title{margin: 0; padding: 34px 0 22px; font-size: 28px; font-weight: 700; color: var(--nam-navy);}
.nam-rgbox__btn{display: flex; align-items: center; justify-content: center; gap: 9px; padding: 17px 10px; font-size: 17px; font-weight: 600; color: #fff; background: #2b3340; border-radius: 8px; transition: background .25s ease;}
.nam-rgbox:hover .nam-rgbox__btn{background: var(--nam-navy);}
.nam-rgbox__btn i{font-style: normal; transition: transform .25s ease;}
.nam-rgbox:hover .nam-rgbox__btn i{transform: translateX(5px);}

/* ============================================================================
   09. 08 반응형
   [sub_Nam.css]
   ========================================================================== */
@media (max-width: 1400px){
	.nam-org__group{width: 46%;}
}
@media (max-width: 1024px){
	/* sub3_1 : 전공소개 – 2열 그리드가 좁아지는 구간에서 1열 전환 */
	.nam-org__group{width: 45%;}
	.nam-majorview{grid-template-columns: 1fr; gap: 30px;}
	.nam-major__ko{font-size: 36px;}
	.nam-major__en{font-size: 28px;}
	.nam-page-head h1{font-size: 30px;}
	.nam-section > h2{font-size: 28px;}
}

@media (max-width: 768px){
	/* 공통 */
	.nam-page-head h1{font-size: 26px;}
	.nam-section{padding-top: 20px;}
	.nam-section > h2{font-size: 22px; gap: 12px; margin-bottom: 20px;}
	.nam-section > h2::before{height: 24px;}
	.nam-table-scroll{overflow-x: auto; -webkit-overflow-scrolling: touch;}
	.nam-table-scroll .nam-table{min-width: 660px;}
	.nam-table th, .nam-table td{padding: 12px 12px; font-size: 13.5px;}
	/* sub3_1 : 학과소개 */
	.nam-org{flex-direction: column; gap: 8px;}
	.nam-org__group{width: 100%;}
	.nam-org__roof{font-size: 19px; padding: 15px 18px;}
	.nam-org__branches{flex-wrap: wrap; gap: 12px;}
	.nam-org__node{font-size: 15px; padding: 11px 18px;}
	.nam-org__node--fill{min-width: 0;}
	.nam-org__leaf{font-size: 14px;}
	.nam-org__leaf .sub{font-size: 14px;}
	.nam-org__plus--lg{font-size: 28px;}
	.nam-tabs__nav{flex-direction: column; gap: 10px;}
	.nam-tab{height: auto; padding: 18px; justify-content: flex-start; border-radius: 14px;}
	.nam-tab__txt{font-size: 18px;}
	.nam-majorview{grid-template-columns: 1fr; gap: 24px;}
	.nam-majorview__img{aspect-ratio: 16 / 10; border-radius: 18px;}
	.nam-major__head{margin-bottom: 18px;}
	.nam-major__ko{font-size: 25px;}
	.nam-major__en{font-size: 22px;}
	.nam-major__desc{font-size: 15px; line-height: 1.8;}
	.nam-major__kw{margin-top: 0; padding-top: 0;}
	.nam-major__kw li{font-size: 16px; padding: 7px 16px;}
	.nam-major_prof .mj-tag a{font-size: 15px; padding: 9px 16px;}
	/* sub3_3 : 교과과정 */
	.nam-common-list li{font-size: 14px; padding: 6px 12px;}
	.nam-course-list li{font-size: 14px;}
	/* sub3_5 : 입학안내 */
	.nam-contact-grid{grid-template-columns: 1fr; gap: 14px;}
	.nam-info-card{padding: 18px 20px;}
	.nam-info-card p{font-size: 15px;}
	.nam-contact-card{padding: 22px 22px;}
	.nam-contact-card .nam-contact-name{font-size: 21px;}
	.nam-contact-list li{font-size: 16px;}
	/* sub3_6 : 학사안내 */
	.nam-regula{gap: 16px;}
	.nam-rgbox{width: 100%; padding: 36px 22px 22px;}
	.nam-rgbox__icon{width: 110px; height: 110px;}
	.nam-rgbox__icon svg{width: 46px; height: 46px;}
	.nam-rgbox__title{padding: 24px 0 18px; font-size: 23px;}
}

@media (max-width: 500px){
	/* 공통 */
	.nam-page-head h1{font-size: 23px;}
	.nam-section > h2{font-size: 20px;}
	.nam-section > h2::before{height: 20px;}
	/* sub3_1 : 학과소개 */
	.nam-org__roof{font-size: 17px;}
	.nam-org__node{font-size: 14px; padding: 10px 14px;}
	.nam-org__leaf{font-size: 13px;}
	.nam-org__leaf .sub{font-size: 13px;}
	.nam-tab{padding: 14px 16px;}
	.nam-tab__txt{font-size: 16px;}
	.nam-major__ko{font-size: 22px;}
	.nam-major__en{font-size: 18px; transform: translateY(20px);}
	.nam-major__desc{font-size: 14px;}
	.nam-major__kw li{font-size: 14px; padding: 6px 14px;}
	.nam-major_prof .mj-tag a{font-size: 14px;}
	/* sub3_3 : 교과과정 */
	.nam-common-list li{font-size: 13px;}
	.nam-course-list li{font-size: 13px;}
	/* sub3_5 : 입학안내 */
	.nam-info-card p{font-size: 14px;}
	.nam-contact-card .nam-contact-name{font-size: 19px;}
	.nam-contact-list li{font-size: 15px;}
	/* sub3_6 : 학사안내 */
	.nam-rgbox__icon{width: 90px; height: 90px;}
	.nam-rgbox__icon i{font-size: 44px;}
	.nam-rgbox__title{font-size: 20px;}
}

/* ============================================================================
   10. sub4_1 연구분야 및 연구실 #Research
   ========================================================================== */

#Research{color:var(--nam-text); line-height:1.6;}
#Research *,#Research *::before,#Research *::after{box-sizing:border-box;}
#Research .rlab-lead{max-width:900px; margin:0 0 40px; font-size:17px; font-weight:500; color:var(--nam-text-sub); word-break:keep-all;}

#Research .rlab-grid{display:grid; grid-template-columns:1fr; gap:26px;}

#Research .rlab-card{position:relative; display:flex; flex-direction:row; align-items:stretch; background:#fff; border:1px solid var(--nam-line); border-radius:20px; overflow:hidden; transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;}

#Research .rlab-card__thumb{position:relative; flex:none; width:40%; min-height:260px; background:var(--nam-accent-soft); overflow:hidden;}
#Research .rlab-card__thumb img{position:relative; z-index:1; display:block; width:100%; height:100%; object-fit:cover; transition:transform .4s ease;}
#Research .rlab-card__thumb-ph{position:absolute; inset:0; z-index:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:9px; color:var(--nam-accent); background:repeating-linear-gradient(45deg,var(--nam-accent-soft),var(--nam-accent-soft) 14px,var(--nam-accent-soft2) 14px,var(--nam-accent-soft2) 28px);}
#Research .rlab-card__thumb-ph i{font-size:42px; opacity:.7;}
#Research .rlab-card__thumb-ph em{font-size:13.5px; font-weight:700; font-style:normal; letter-spacing:.02em; opacity:.75;}

#Research .rlab-card__body{flex:1; display:flex; flex-direction:column; padding:30px 34px 30px;}

#Research .rlab-card__top{display:flex; align-items:flex-start; gap:18px;}
#Research .rlab-card__icon{flex:none; display:inline-flex; align-items:center; justify-content:center; width:62px; height:62px; border-radius:16px; background:var(--nam-accent-soft); color:var(--nam-navy); transition:background .25s ease, color .25s ease;}
#Research .rlab-card__icon i{font-size:32px; line-height:1;}
#Research .rlab-card__head{min-width:0;}
#Research .rlab-card__name{margin:2px 0 0; font-size:24px; font-weight:800; color:var(--nam-navy); letter-spacing:-.4px; line-height:1.25; word-break:keep-all;}
#Research .rlab-card__full{margin:6px 0 0; font-size:16px; font-weight:600; color:var(--nam-text-sub); letter-spacing:.01em; word-break:keep-all;}
#Research .rlab-card__prof{margin:12px 0 0; font-size:18px; font-weight:600; color:var(--nam-text);}
#Research .rlab-card__prof .label{display:inline-block; margin-right:8px; padding:3px 11px; font-size:12.5px; font-weight:700; color:#fff; background:var(--nam-navy); border-radius:7px; vertical-align:middle;}
#Research .rlab-card__prof .en{color:var(--nam-text-sub); font-weight:600;}

#Research .rlab-card__tags{display:flex; flex-wrap:wrap; gap:8px; margin:22px 0 0; padding:0; list-style:none;}
#Research .rlab-card__tags li{padding:5px 18px; font-size:17px; font-weight:500; color:var(--nam-accent); background:var(--nam-accent-soft); border-radius:999px; word-break:keep-all;}

#Research .rlab-card__desc{margin:22px 0 0; padding-top:22px; border-top:1px solid var(--nam-line-soft); font-size:16px; font-weight:500; color:var(--nam-text); line-height:1.75; word-break:keep-all;}

#Research .rlab-card__foot{margin-top:auto; padding-top:24px;}
#Research .rlab-card__link{display:inline-flex; align-items:center; gap:9px; padding:13px 22px; font-size:15px; font-weight:600; color:#fff; background:#2b3340; border-radius:10px; text-decoration:none; transition:background .25s ease;}
#Research .rlab-card__link i{font-size:18px; transition:transform .25s ease;}
#Research .rlab-card .rlab-card__link:hover{background:var(--nam-navy);}
#Research .rlab-card__link:hover i{transform:translate(3px,-3px);}

@media (max-width: 1024px){
	#Research .rlab-card__thumb{width:38%; min-height:220px;}
	#Research .rlab-card__body{padding:26px 26px;}
}
@media (max-width: 768px){
	#Research .rlab-lead{font-size:15px; margin-bottom:30px;}
	#Research .rlab-card{flex-direction:column;}
	#Research .rlab-card__thumb{width:100%; min-height:0; aspect-ratio:16/9;}
	#Research .rlab-card__body{padding:24px 22px;}
	#Research .rlab-card__thumb-ph i{font-size:34px;}
	#Research .rlab-card__top{gap:14px;}
	#Research .rlab-card__icon{width:52px; height:52px; border-radius:13px;}
	#Research .rlab-card__icon i{font-size:26px;}
	#Research .rlab-card__name{font-size:20px;}
	#Research .rlab-card__prof{font-size:15px;}
	#Research .rlab-card__desc{font-size:14.5px; line-height:1.7;}
	#Research .rlab-card__link{width:100%; justify-content:center;}
}
@media (max-width: 500px){
	#Research .rlab-card__name{font-size: 18px;}
	#Research .rlab-card__full{font-size: 13px;}
	#Research .rlab-card__prof{font-size: 14px;}
	#Research .rlab-card__tags li{font-size: 13px; padding: 4px 12px;}
	#Research .rlab-card__desc{font-size: 14px;}
}

/* ============================================================================
   11. sub4_2 국제교류 #Intern
   ========================================================================== */

#Intern{--it-navy:#00215f; --it-blue:#1265c7; --it-sky:#4aa7ff; --it-line:#dfe7f3; --it-text:#14234a; --it-muted:#65738d; --it-bg:#f4f7fb; padding:0 0 110px; color:var(--it-text); font-family:inherit;}
#Intern *{box-sizing:border-box;}
#Intern button{font-family:inherit;}
#Intern .intern-inner{width:90%; max-width:1520px; margin:0 auto;}
#Intern .intern-title{text-align:center; margin:0 0 28px;}
#Intern .intern-title h2{margin:0; font-size:32px; line-height:1.25; font-weight:800; letter-spacing:-.8px; color:var(--it-navy); word-break:keep-all;}
#Intern .intern-title__bar{display:flex; align-items:center; justify-content:center; gap:8px; margin-top:18px;}
#Intern .intern-title__bar span{display:block; width:8px; height:8px; border-radius:50%; background:#c8d5e8;}
#Intern .intern-title__bar span:first-child{width:48px; height:5px; border-radius:10px; background:linear-gradient(90deg,var(--it-blue),var(--it-sky));}

#Intern .map-wrap{width:100%;}
#Intern .map-area{position:relative; width:100%; max-width: 1000px; margin: 0 auto 40px;}
#Intern .world-map-img img{display:block; width:100%;}
#Intern .world-map-img::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(238,244,251,.2)); pointer-events:none;}
#Intern .map-markers{position:absolute; inset:0; z-index:1; pointer-events:none;}

#Intern .map-marker{position:absolute; width:82px; height:104px; padding:0; border:0; background:transparent; color:var(--marker-color,#256fd2); cursor:pointer; transform:translate(-50%,-100%); z-index:2; pointer-events:auto; transition:transform .3s ease, filter .3s ease;}
#Intern .map-marker::after{content:""; position:absolute; left:50%; top:5px; width:75px; height:75px; transform:translateX(-50%) rotate(-45deg); transform-origin:center; border-radius:50% 50% 50% 0; background:currentColor; box-shadow:0 16px 22px rgba(16,60,130,.23);}
#Intern .map-marker::before{content:""; position:absolute; top:9px; left:50%; width:58px; height:58px; border:2px solid currentColor; border-radius:50%; transform:translateX(-50%) scale(.85); opacity:0; z-index:2;}
#Intern .map-marker__symbol{position:absolute; top:11px; left:50%; z-index:3; width:58px; height:58px; border-radius:50%; background:#fff; border:1px solid rgba(10,35,90,.08); transform:translateX(-50%); display:flex; align-items:center; justify-content:center; overflow:hidden;}
#Intern .map-marker__symbol img{width:100%; height:100%; object-fit:contain;}
#Intern .map-marker:hover,#Intern .map-marker:focus-visible{transform:translate(-50%,calc(-100% - 8px)) scale(1.08); filter:drop-shadow(0 14px 18px rgba(10,50,120,.24)); z-index:10; outline:none;}
#Intern .map-marker:hover::before,#Intern .map-marker:focus-visible::before,#Intern .map-marker.is-active::before{animation:markerPulse 1.4s ease-out infinite;}
#Intern .map-marker.is-active{z-index:11;}
@keyframes markerPulse{0%{opacity:.45; transform:translateX(-50%) scale(.85);}100%{opacity:0; transform:translateX(-50%) scale(1.55);}}

#Intern .map-info{position:absolute; left:50%; top:50%; z-index:20; width:min(460px,calc(100% - 40px)); padding:24px; border:1px solid rgba(209,219,236,.75); border-radius:18px; background:rgba(255,255,255,.96); box-shadow:0 24px 52px -24px rgba(10,40,92,.36); backdrop-filter:blur(10px); transform:translate3d(-50%,-50%,0); opacity:0; pointer-events:none; transition:opacity .22s ease, transform .22s ease;}
#Intern .map-info.is-open{opacity:1; pointer-events:auto;}
#Intern .map-info__close{position:absolute; right:16px; top:14px; width:30px; height:30px; border:0; border-radius:50%; background:#f0f4fb; color:#496082; font-size:22px; line-height:1; cursor:pointer;}
#Intern .map-info__head{display:flex; gap:15px; align-items:center; padding-right:32px;}
#Intern .logo-circle,#Intern .institution-symbol,#Intern .partner-logo{flex:0 0 auto; border-radius:50%; background:#fff; border:1px solid rgba(16,55,120,.12); display:inline-flex; align-items:center; justify-content:center; overflow:hidden;}
#Intern .logo-circle{width:58px; height:58px; box-shadow:0 7px 17px rgba(22,45,90,.08);}
#Intern .logo-circle img,#Intern .institution-symbol img,#Intern .partner-logo img{width:100%; height:100%; object-fit:contain;}
#Intern .logo-fallback{font-size:14px; font-weight:800; color:var(--it-blue); text-align:center; line-height:1.05;}
#Intern .map-info h3{margin:0; font-family:"Poppins",inherit; font-size:18px; color:var(--it-navy); line-height:1.35;}
#Intern .map-info__loc{margin:5px 0 0; font-size:14px; color:var(--it-muted);}
#Intern .map-info__programs{display:grid; gap:12px; margin:22px 0 20px;}
#Intern .map-info__program{padding:15px 16px; border:1px solid #e2e9f5; border-radius:14px; background:#f8fbff;}
#Intern .map-info__program-title{display:flex; align-items:flex-start; gap:8px; margin:0 0 11px; color:var(--it-navy); font-size:15px; line-height:1.35; font-weight:700; word-break:keep-all;}
#Intern .map-info__details{display:grid; gap:10px; margin:0;}
#Intern .map-info__details div{display:grid; grid-template-columns:72px 1fr; gap:12px; align-items:start;}
#Intern .map-info__details dt{position:relative; padding-left:18px; font-size:14px; font-weight:700; color:#38517e;}
#Intern .map-info__details dt::before{content:""; position:absolute; left:2px; top:5px; width:7px; height:7px; border:2px solid var(--it-blue); border-radius:2px; transform:rotate(45deg);}
#Intern .map-info__details dd{margin:0; font-size: 14px; color:#17346d;}
#Intern .map-info__link{display:inline-flex; align-items:center; gap:10px; min-height:42px; padding:0 20px; border-radius:999px; background:var(--nam-navy); color:#fff; font-weight:500; text-decoration:none;}

#Intern .partner-grid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:30px; margin-top:44px;}
#Intern .partner-card{padding:28px; border-radius:16px; background:#fff; border:1px solid #e9eef7; box-shadow:0 18px 42px -34px rgba(10,40,92,.42);}
#Intern .partner-card__title{display:flex; align-items:center; justify-content:center; gap:12px; margin:0 0 24px; color:var(--it-navy); font-size:26px; font-weight:800;}
#Intern .partner-card__icon{display:inline-flex; align-items:center; justify-content:center; width:50px; height:50px; border-radius:50%; background:#edf3ff; color:var(--it-blue);}
#Intern .partner-card__icon svg{width:26px; height:26px; stroke:currentColor; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;}
#Intern .partner-list{display:grid; gap:12px; padding:0; margin:0; list-style:none;}
#Intern .partner-list--uni{grid-template-columns:repeat(2,minmax(0,1fr));}
#Intern .partner-item a{display:flex; align-items:center; gap:15px; min-height:68px; padding:10px 16px; border-radius:8px; background:linear-gradient(135deg,#06285f,#125ba7); color:#fff; box-shadow:inset 0 1px 0 rgba(255,255,255,.16);}
#Intern .partner-logo{width:46px; height:46px; box-shadow:0 4px 12px rgba(22,45,90,.08);}
#Intern .partner-name{font-size:15px; line-height:1.35; font-weight:600; word-break:keep-all;}

@media (max-width: 1200px){
	#Intern{padding-bottom:0;}
	#Intern .intern-title h2{font-size:36px;}
	#Intern .map-area{min-height:500px;}
	#Intern .map-marker{width:72px; height:92px;}
	#Intern .map-marker::after{width:72px; height:72px;}
	#Intern .map-marker__symbol,#Intern .map-marker::before{top:9px; width:52px; height:52px;}
	#Intern .partner-grid{grid-template-columns:1fr;}
}
@media (max-width: 768px){
	#Intern .intern-inner{width:100%;}
	#Intern .intern-title h2{font-size:30px;}
	/* 지도: 축소 대신 원본 크기 유지 + 좌우 스크롤 (안내 오버레이는 .scroll-guide) */
	#Intern .map-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:10px;}
	#Intern .map-area{min-width:760px; min-height:0; aspect-ratio:auto;}
	#Intern .map-marker{width:60px; height:78px;}
	#Intern .map-marker::after{width:60px; height:60px;}
	#Intern .map-marker::before,#Intern .map-marker__symbol{top:7px; width:44px; height:44px;}
	/* 상세 팝업: 스크롤 영역과 무관하게 화면 하단 고정 */
	#Intern .map-info{position:fixed !important; left:50% !important; right:auto; top:auto !important; bottom:20px; width:min(420px, calc(100vw - 32px)); max-height:60vh; overflow:auto; transform:translateX(-50%); z-index:100;}
	#Intern .map-info.is-open{transform:translateX(-50%);}
	#Intern .partner-card{padding:22px 16px;}
	#Intern .partner-list--uni{grid-template-columns:1fr;}
}
@media (max-width: 500px){
	#Intern .intern-title h2{font-size:24px;}
	#Intern .partner-card__title{font-size:20px;}
	#Intern .partner-item{align-items:flex-start; min-height:auto; padding:0;}
	#Intern .partner-item a{min-height:0; padding:10px 12px;}
	#Intern .partner-name{font-size:14px;}
}
@media (prefers-reduced-motion:reduce){
	#Intern .map-marker,#Intern .map-marker::before,#Intern .map-info{animation:none !important; transition:none !important;}
}

/* ============================================================================
   12. 모바일 가로 스크롤 안내 오버레이 (공통)
   - 대상: .nam-table-scroll(교과과정/입학안내 표), #Intern .map-wrap(국제교류 지도),
           .is-diagram-scroll(융합보안이란? 원형 다이어그램)
   - tail.php 스크립트가 대상을 .scroll-guide-wrap으로 감싸고 .scroll-guide 버튼을 추가
   - 768px 이하 + 실제로 가로 넘침이 있을 때만 표시, 클릭하면 사라지고 좌우 스크롤 가능
   ========================================================================== */

.scroll-guide-wrap{position: relative;}
.scroll-guide{display: none;}
/* 가로 넘침이 없으면 tail.php 스크립트가 .is-hide 를 붙여 안내를 숨긴다 */
.scroll-guide.is-hide{display: none !important;}

@media (max-width: 768px){
	.scroll-guide{position: absolute; inset: 0; z-index: 6; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding: 0; border: 0; border-radius: 16px; background: rgba(0,0,0,.2); color: #fff; cursor: pointer; touch-action: none; -webkit-tap-highlight-color: transparent;}
	.scroll-guide span{display: inline-flex; align-items: center; gap: 8px; padding: 11px 20px; font-size: 14px; font-weight: 600; letter-spacing: -.3px; background: rgba(0,0,0,.45); border-radius: 999px; backdrop-filter: blur(2px);}
	.scroll-guide i{font-size: 18px;}
}