@charset "utf-8";
/* 맘스클래스(class.ibabynews.com) 베뉴 스타일 — PC (2026-10-03 대표님 지시: "class 사이트를 베뉴 스타일로 전반적으로 수정, 메뉴·컬러 등")
   기준은 베뉴 허브(ibabynews.kr): 글꼴 Pretendard · 주색 주황 #F16531(진한 #D8471B) · 글자 군청 #17213A · 흰 카드 + 하늘→살구 배경 · 주황 대각선 투톤.
   기존 css(common·contents)는 그대로 두고 이 파일이 맨 뒤에서 덮는다 — 빼면 원래대로. 관리자 화면에는 붙이지 않는다(head.sub.php) */
:root { --bv-navy: #17213A; --bv-gun: #253272; --bv-gun-d: #1B2660;   /* 베이비뉴스 주색 = 군청 #253272 + 오렌지 (2026-10-03 대표님) — 짙은 남색 #17213A 는 글자에만 */ --bv-or: #F16531; --bv-or-d: #D8471B; --bv-line: #EFEDEA; --bv-text-2: #687084; --bv-card-sh: 0 6px 24px rgba(23, 33, 58, .08); }

body, button, h1, h2, h3, h4, h5, input, select, table, textarea, .header .nav li .index, .header .nav .submenu li, .header .util li { font-family: 'Pretendard Variable', Pretendard, -apple-system, 'Noto Sans KR', 'Malgun Gothic', sans-serif !important; letter-spacing: -.01em; }
body { color: var(--bv-navy); background: linear-gradient(180deg, #E2F2FA 0, #F3EEF6 420px, #FBEDE4 1200px, #FDF3EC 100%) fixed; }

/* ── 머리: 메뉴 띠(군청 바탕 + 오른쪽 베이비뉴스 오렌지 칸)는 처음 그대로 둔다 (2026-10-03 대표님 지시: "상단 베뉴바는 처음처럼") — 글꼴·밑줄만 ── */
.header .util li { font-size: 13px; }
.header .util li a { color: var(--bv-text-2); }
.header .util li a:hover { color: var(--bv-or); }
.header .nav { height: 55px; }
.header .nav li .index { line-height: 55px; height: 55px; padding: 0 20px; font-size: 17px; font-weight: 700; color: #fff; box-sizing: border-box; border: 0 !important; position: relative; }
.header .nav li .index:after { content: ""; position: absolute; left: 20px; right: 20px; bottom: 0; height: 3px; background: var(--bv-or); transform: scaleX(0); transition: transform .18s; }
.header .nav li:hover .index, .header .nav .active .index { background: none !important; color: #fff !important; border: 0 !important; height: 55px; }
.header .nav li:hover .index:after, .header .nav .active .index:after { transform: scaleX(1); }
.header .nav .submenu { top: 55px; border: 0; border-radius: 0 0 12px 12px; box-shadow: 0 12px 28px rgba(23, 33, 58, .16); overflow: hidden; }
.header .nav .submenu li a { color: var(--bv-navy); font-size: 14.5px; font-weight: 500; }
.header .nav .submenu li a:hover { background: #FFF3EC; color: var(--bv-or-d); }
#header.fixed_h, .header.fixed_h { box-shadow: 0 6px 18px rgba(23, 33, 58, .14); }

/* ── 본문 카드 ── */
.main_visual { border-radius: 16px; box-shadow: var(--bv-card-sh); }
.main_visual .slider .active { background-color: var(--bv-or) !important; }
.container { background: transparent !important; }
.section_w { background: #fff; border-radius: 16px; box-shadow: var(--bv-card-sh); padding: 24px 20px 14px; margin-bottom: 22px; }   /* 좌우 20px 는 그대로 — 넓히면 이벤트 카드가 한 줄 2개에서 1개로 떨어진다 */
.h_group { position: relative; margin-bottom: 18px; }
.h_group h3 { font-size: 23px; font-weight: 800; color: var(--bv-navy); letter-spacing: -.03em; }
.h_group h3 em, .h_group h3 strong { font-style: normal; color: var(--bv-or); font-weight: 800; }
.h_group h3 b { font-weight: 800; color: var(--bv-navy); }
.h_group .btn_more { color: var(--bv-text-2); font-size: 13px; }
.h_group .btn_more:hover { color: var(--bv-or); }

.conts_li ul li .itembx { border: 1px solid var(--bv-line); box-sizing: border-box; border-radius: 14px; overflow: hidden; background: #fff; transition: transform .15s, box-shadow .15s; }
.conts_li ul li .itembx:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(23, 33, 58, .12); }
.conts_li ul li .itembx .subject { color: var(--bv-navy); font-weight: 700; font-size: 20px; letter-spacing: -.02em; }
.conts_li ul li .itembx .th { border: 2px solid var(--bv-gun); border-radius: 12px; }
.conts_li ul li .itembx .th span { color: var(--bv-gun); border-bottom-color: var(--bv-or); font-weight: 800; }
.conts_li ul li .itembx .dp .place { color: var(--bv-or-d); }
.conts_li ul li .itembx .term dt span, .conts_li ul li .itembx .ann dt span { background-color: var(--bv-gun); font-size: 13px; font-weight: 700; }
.conts_li ul li .itembx .ann dt span { background-color: var(--bv-or); }
.conts_li ul li .itembx .term dd, .conts_li ul li .itembx .ann dd { color: var(--bv-text-2); font-size: 16px; }
.conts_li ul li .itembx .button_a .btn { width: auto; min-width: 140px; padding: 0 22px; box-sizing: border-box; white-space: nowrap; }   /* 글자 길이에 맞춰 늘어난다 */
.conts_li ul li .itembx .button_a .btn, .type_event ul li .itembx .button_a .btn { background: var(--bv-or) !important; font-weight: 700; font-size: 16px; box-shadow: 0 4px 12px rgba(241, 101, 49, .28); transition: background .15s; }
.conts_li ul li .itembx .button_a .btn:hover { background: var(--bv-or-d) !important; }

/* ── 게시판·공통 단추·탭 ── */
.button_area .btn { background-color: var(--bv-gun); }
.button_area .btn.b2 { background-color: var(--bv-or); }
.tabs_menu li.active a, .tabs_menu li a:hover { color: var(--bv-or) !important; border-color: var(--bv-or) !important; }
.bo_table thead th { border-top-color: var(--bv-gun) !important; }
.contents .bo_content { background: #fff; border-radius: 16px; box-shadow: var(--bv-card-sh); }

/* ── 바닥 ── */
.footer { background: var(--bv-gun); }
.footer .tnb li a { color: #fff; font-weight: 600; }
.footer .tnb li a:hover { color: var(--bv-or); }
.footer address p, .footer .copyright { color: #B4BCD8; }
.footer address p span { color: #6B78A8; }

/* 배너 잘리지 않게 (2026-10-03 대표님 지시) — 이벤트·클래스 목록 그림은 높이 고정을 풀고 원래 비율 그대로 */
.conts_li ul li .itembx .img_a, .type_event ul li .itembx .img_a { height: auto !important; max-height: none !important; }
.conts_li ul li .itembx .img_a img { display: block; width: 100%; height: auto; }
.type_event ul li .itembx .info_a { height: auto; min-height: 110px; }
/* 오른쪽 SNS 8개 — 베이비뉴스 본 사이트와 같은 그림 */
.posi-re .sns_li--bn li { margin-bottom: 6px; }
.posi-re .sns_li--bn img { display: block; width: 46px; height: auto; }

/* 맘스클래스 화면 강연일정 배너 — 상자 높이(490px 고정)가 배너보다 커서 아래가 비던 것, 배너 높이에 맞춘다 */
.section_w .main_visual { height: auto !important; }

/* 섹션 제목 아이콘 (2026-10-04) */
.sec-ico { display: inline-block; width: 26px; height: 26px; vertical-align: -5px; margin-right: 8px; }
.h_group h3 em, h3.h3 em { margin-right: 2px; }

/* ── 메뉴 띠를 웍스처럼 군청 + 오렌지 사선 투톤으로 (2026-10-04 대표님 지시: "상단 베뉴바를 works처럼 어드민·사용자페이지 군청+오렌지 투톤") ──
   예전 띠 그림(nav_bar_bg.gif · nav_bar.gif)은 끄고 머리 맨 아래 55px 에 색을 깐다. 오른쪽 베이비뉴스 로고는 오렌지 쪽에 온다 */
.header:not(#header) { position: relative; background-image: none !important; }
.header .nav_aw { background: none !important; position: relative; z-index: 1; }
.header:not(#header):before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 55px; background: #253272; }
.header:not(#header):after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 55px; background: #F16531; clip-path: polygon(calc(50% + 352px) 0, 100% 0, 100% 100%, calc(50% + 297px) 100%); }
#header .nav_aw { background: linear-gradient(110deg, #253272 calc(100% - 200px), #F16531 calc(100% - 200px)) !important; }

/* 메인 슬라이드 좌우 꽉 · 라운드 없음 (2026-10-04 대표님 "슬라이드는 라운드 빼줘", "좌우 전체 꽉 차게"). 그림은 1920×490, 글자는 가운데 1080 칸 안 */
.main_visual { border-radius: 0 !important; box-shadow: none !important; width: 100vw !important; max-width: none !important; position: relative; left: 50%; margin-left: -50vw !important; overflow: hidden; }
.main_visual .bx-wrapper, .main_visual .bx-viewport { border-radius: 0 !important; box-shadow: none !important; border: 0 !important; }
.main_visual .bxslider li img { width: 100% !important; height: 490px !important; object-fit: cover; object-position: center; }
body { overflow-x: hidden; }
.main_visual { margin-top: -20px !important; }   /* 메뉴바에 바로 붙게 — .cnt 위 여백 20px 만큼 끌어올림 (대표님 10/4 "슬라이드가 바랑 달라붙어서") */
/* 로고를 줄인 만큼 머리 높이도 줄여 메뉴띠를 올린다 (2026-10-04 대표님 "로고 위치 줄였으면 메뉴바도 올라가") — 띠 색은 아래 기준이라 따라 올라간다 */
.header .h_top { height: 74px !important; }
.header .h_top h1 { position: absolute !important; top: 50% !important; transform: translateY(-50%); margin: 0 !important; padding: 0 !important; line-height: 0; }
.header .h_top h1 { height: auto !important; }
/* 로고·회원가입 위치 다시 정리 (2026-10-04 대표님) — 로고는 흰 칸(74px) 세로 가운데·메뉴 첫 칸과 왼쪽 끝 맞춤, 회원가입·로그인 글자는 띠 세로 가운데 */
.header .h_top h1 img { height: 52px !important; }
.header .h_top .bn-util a { position: relative; top: 2px; line-height: 20px; }

/* 따라오는 메뉴(#header) 오렌지 한 색으로 — 띠 바깥 바탕과 메뉴 칸의 오렌지가 두 가지였다 (2026-10-04 대표님 "같은 컬러 맞춰줘") */
#header { background: linear-gradient(110deg, #253272 calc(50% + 340px), #F16531 calc(50% + 340px)) !important; }
#header .nav_aw { background: transparent !important; }