/* PC 레이아웃(DW_ClayoutA) 모양: 모바일(mnav.css)과 같은 색·모양. pc.html 이 불러옴 (모바일 레이아웃은 안 씀)
   레이아웃 설정의 기본 색(bg_basic)이 <style> 에 !important 로 들어가므로, 여기서도 필요한 곳은 !important 로 덮음 */

/* 맨 위 메뉴 줄: 굵은 검은 선 대신 얇은 회색 선, 선택된 메뉴는 파랑 */
html .header#header { border-top-width: 0; border-bottom: 1px solid #e5e5e5 !important; box-shadow: none; }
html .header .active a.first_a, html .header .main_menu li div li a:hover, html .header .main_menu li div li a.active_a { color: #1f6fb2 !important; }

/* 페이지 머리 띠 (레이아웃 설정: 경로 위치 = 위 / up_breadclumb): 화면 폭 전체 연한 파랑, 위에 경로 + 아래 제목 (왼쪽 정렬) */
html .up_breadclumb { display: flex; flex-direction: column-reverse; margin-bottom: 24px; padding: 26px 10px 22px; background: #f0f6fc; border: 0 !important; box-shadow: 0 0 0 100vmax #f0f6fc; clip-path: inset(0 -100vmax); }
html .up_breadclumb .sub_title { height: auto; margin: 6px 0 0; line-height: 1.3; text-align: left; font-family: inherit; }
html .up_breadclumb .sub_title h1 { font-size: 28px; font-weight: 700; color: #222; }
html .up_breadclumb .sub_title h1 a { color: #222; }
html .up_breadclumb .span_breadclumb { display: none; }
html .up_breadclumb .breadclumb { float: none; margin: 0; padding: 0; font-size: 13px; }
html .up_breadclumb .breadclumb li { padding-left: 0; padding-right: 6px; }
html .up_breadclumb .breadclumb a { color: #888; }
html .up_breadclumb .breadclumb li:last-child a { color: #1f6fb2 !important; font-weight: 500; }
html .up_breadclumb .breadclumb i { color: #bbb; }

/* 왼쪽 메뉴: 검은 제목 상자 대신 흰 바탕 + 파란 밑줄, 지금 페이지는 모바일 메뉴와 같은 파란 왼쪽 막대 */
html .lnb .lnb_normal .lnb_h2 { background-color: #fff !important; box-shadow: none; padding: 0 12px; border-bottom: 2px solid #1f6fb2; }
html .lnb .lnb_normal .lnb_h2 a { color: #222; font-size: 17px; }
html .lnb .locNav { border-top: 0; padding-top: 4px; }
html .lnb .locNav li { border-bottom: 1px solid #eee; }
html .lnb .locNav li a, html .lnb .locNav li.active li:not(.mnav_cur) > a { color: #555 !important; }
html .lnb .locNav li a:hover { color: #1f6fb2 !important; padding-left: 15px !important; background: #f7fafd; }
html .lnb .locNav li.locLi1.active > a, html .lnb .locNav li.mnav_cur > a { color: #1f6fb2 !important; font-weight: 600; background: #f0f6fc; box-shadow: inset 3px 0 0 #1f6fb2; }
html .lnb .locNav .locNav { padding-top: 0; }
html .lnb .locNav .locNav li { border-bottom: 0; }
html .lnb .locNav .locNav li a { padding-left: 28px; font-size: 13px; }
html .lnb .locNav .locNav .locNav li a { padding-left: 40px; }

/* 소제목: 밑줄 대신 파란 왼쪽 막대 (페이지 본문 .xe_content, 게시판 스킨 .board) */
html #content .in_section .xe_content h2, html #content .in_section .board h2 { margin: 28px 0 14px; padding: 2px 0 2px 11px; border: 0; border-left: 4px solid #1f6fb2; font-size: 19px; font-weight: 700; line-height: 1.4; color: #222; }
html #content .in_section .xe_content h2 u, html #content .in_section .board h2 u { text-decoration: none; }
html #content .in_section .board .prs_grid { border-top: 0; }

/* 탭(발행물 분류, 프로젝트 진행/완료, 강의 학기): 알약 */
html #content .pub_tabs, html #content .prj_tabs, html #content .crs_terms { display: flex; flex-wrap: wrap; gap: 6px; border-bottom: 0; }
html #content .pub_tabs { padding-bottom: 10px; border-bottom: 1px solid #eee; }
html #content .pub_tabs button, html #content .prj_tabs button, html #content .crs_terms button { margin: 0; padding: 6px 14px; border: 1px solid #d5d5d5; border-radius: 16px; background: #fff; color: #555; font-size: 13px; font-weight: 500; }
html #content .pub_tabs button span, html #content .prj_tabs button span { color: #999; }
html #content .pub_tabs button.on, html #content .prj_tabs button.on, html #content .crs_terms button.on { background: #1f6fb2; border-color: #1f6fb2; color: #fff; }
html #content .pub_tabs button.on span, html #content .prj_tabs button.on span { color: #dbe8f5; }


/* 페이지 본문의 한국어/영어 (관리자가 쓴 본문에서 class="ml_ko" / "ml_en" 을 붙인 부분): 사이트 언어에 맞는 것만 */
html[lang="en"] #content .ml_ko, html:not([lang="en"]) #content .ml_en { display: none !important; }

/* ===== 메인 페이지 (관리자 → 메인 [수정] 위젯 편집기에서 만든 내용): 모양만 여기서 =====
   소개 상자 = 편집기의 콘텐츠 블록 (main_hero_block.html 내용, class="mhero"). 이 상자(.mhero) 안만 꾸밈.
   소식·사진 위젯의 모양은 각 위젯(MONET Content Widget, MONET 뉴스형 목록 위젯)의 스킨에 있음 */
html .mhero { margin: 0 0 30px; padding: 34px 40px; border-radius: 12px; background: #f0f6fc; display: flex; align-items: center; gap: 30px; }
html .mhero .mhero_in { flex: 1; min-width: 0; }
html .mhero p { margin: 0; }
html .mhero .mhero_sm { font-size: 14px; font-weight: 600; color: #1f6fb2; letter-spacing: .02em; }
html .mhero .mhero_t { margin-top: 6px; font-size: 32px; font-weight: 700; line-height: 1.25; color: #222; }
html .mhero .mhero_sub { margin-top: 10px; font-size: 15px; line-height: 1.6; color: #555; }
html .mhero .mhero_meta { margin-top: 10px; font-size: 14px; font-weight: 500; color: #1f6fb2; }
html .mhero .mhero_q { flex: 0 0 auto; display: grid; grid-template-columns: repeat(4, 110px); gap: 12px; margin: 0; padding: 0; list-style: none; }
html .mhero .mhero_q li { margin: 0; padding: 0; list-style: none; }
html .mhero .mhero_q a { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 18px 0 14px; border: 1px solid #e3ecf5; border-radius: 12px; background: #fff; font-size: 14px; color: #333; text-decoration: none; }
html .mhero .mhero_q a:hover { border-color: #1f6fb2; color: #1f6fb2; }
html .mhero .mhero_q i { font-size: 28px; color: #1f6fb2; }
