/*
 * 충남문화포털 리디자인 시안 A — 메인 본문
 * 방향: "우아한 격조" — 정제된 배너 + 카드 + 섹션
 * 적용 범위: 메인 페이지 전용 (서브페이지 미적용)
 * ─────────────────────────────────────────────────────────
 * 변경 요소:
 *   1. 폰트 — 섹션 타이틀(Noto Serif KR), 메인 배너 슬로건
 *   2. 배너 — 인디고 그라디언트 오버레이 + 검색박스 중앙 배치
 *   3. 문화행사 카드 — 둥근 모서리, 채도 억제, 하단 그라디언트
 *   4. 지도/시설 섹션 — 이미지 풀높이 카드
 *   5. 문화예술인/단체 카드
 *   6. NEWS 섹션 — 수직 리스트 레이아웃
 * ※ 폰트 로드(@import)는 redesign_header.css에서 처리
 */

/* ─────────────────────────────────────────
   1. 폰트 개선
   대상: 헤딩(.m_title strong, .title), 본문 가독성
   서브페이지 영향: 없음 (main.css에만 적용되는 셀렉터 한정)
───────────────────────────────────────── */

/* 메인페이지 섹션 타이틀 — FlightSans 대체 */
.m_title strong {
  font-family: 'Noto Serif KR', 'Noto Sans KR', serif !important;
  font-weight: 900 !important;
  letter-spacing: -0.5px;
  color: #1a1a2e !important;
}

/* 메인 배너 슬로건 — FlightSans 대체 */
#mvisual .group .title {
  font-family: 'Noto Serif KR', 'Noto Sans KR', serif !important;
  font-size: 42px !important;
  font-weight: 900 !important;
  line-height: 1.3 !important;
  letter-spacing: -1px;
  text-shadow: 1px 2px 12px rgba(0,0,0,0.35);
}


/* ─────────────────────────────────────────
   2. 메인 배너 영역 개선
   대상: #mvisual (mvisual_head 부분)
   기존 main_visual.jpg 위에 그라디언트 오버레이
───────────────────────────────────────── */

/* 기존 배경 이미지 위에 인디고-네이비 그라디언트 오버레이 추가 */
/* 흰색 레이어(0.28)를 그라디언트와 이미지 사이에 끼워
   #mvisual 전체(검색·여백·문화행사 영역 모두)의 이미지 채도를 연하게 처리 */
#mvisual {
  background-image:
    linear-gradient(
      135deg,
      rgba(29, 18, 98, 0.75) 0%,
      rgba(45, 27, 142, 0.60) 35%,
      rgba(0, 80, 160, 0.45) 65%,
      rgba(10, 30, 80, 0.55) 100%
    ),
    linear-gradient(rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.85)),
    url('../img/main/main_visual.jpg') !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

/* 검색 영역 — 슬로건 제거 후 박스를 중앙 배치, 너비 확장 */
#mvisual .group {
  justify-content: center !important;
}
#mvisual .group .box {
  width: 600px !important;
  max-width: 80% !important;
}

/* 검색박스 — 약간 더 큰 사이즈 + 인디고 submit */
#mvisual .group .box .form_wrap input[type="text"].search {
  height: 62px !important;
  line-height: 62px !important;
  font-size: 15px !important;
  border: 2px solid transparent !important;
  transition: border-color 0.2s ease !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.15) !important;
}
#mvisual .group .box .form_wrap input[type="text"].search:focus {
  border-color: #4a40f3 !important;
  outline: none !important;
}
#mvisual .group .box .form_wrap input[type="submit"] {
  background-color: #2d1b8e !important;
  width: 48px !important;
  height: 48px !important;
  margin-top: -24px !important;
  transition: background-color 0.2s ease !important;
}
#mvisual .group .box .form_wrap input[type="submit"]:hover {
  background-color: #4a40f3 !important;
}

/* 맞춤검색 버튼 색상 */
#mvisual .group .box .form_wrap .popbtn {
  color: #2d1b8e !important;
  font-weight: 700 !important;
}
#mvisual .group .box .form_wrap .popbtn:hover {
  color: #4a40f3 !important;
}


/* ─────────────────────────────────────────
   3. 기타 개선사항
───────────────────────────────────────── */

/* 문화행사 카드 — 모서리 둥글게 */
.cont2 #cul_event .con_wrap .con .img_slide .grap ul li .thumb {
  border-radius: 12px !important;
  overflow: hidden !important;
}
.cont2 #cul_event .con_wrap .con .img_slide .grap ul li a:hover .thumb {
  box-shadow: 6px 6px 18px rgba(45, 27, 142, 0.50) !important;
}

/* 카드 배경 이미지 — 채도 억제 */
/* modify 20260624 : 이미지를 더 명확하게 보이게하기 위해 필터 제거 */
.cont2 #cul_event .con_wrap .con .img_slide .grap ul li .thumb span img {
  /*filter: saturate(0.45) brightness(0.9) !important;
  transition: filter 0.3s ease !important;*/
}
.cont2 #cul_event .con_wrap .con .img_slide .grap ul li a:hover .thumb span img {
  filter: saturate(0.65) brightness(0.95) !important;
}

/* 하단 텍스트 오버레이 — .thumb::after로 확실하게 위에 렌더링 */
/* modify 20260624 : 이미지를 더 명확하게 보이게하기 위해 필터 조절 */
/*.cont2 #cul_event .con_wrap .con .img_slide .grap ul li .thumb::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 70% !important;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.88) 0%,
    rgba(0, 0, 0, 0.60) 35%,
    rgba(0, 0, 0, 0.15) 65%,
    rgba(0, 0, 0, 0)    100%
  ) !important;
  pointer-events: none !important;
  z-index: 1 !important;
  border-radius: 0 0 12px 12px !important;
}*/
.cont2 #cul_event .con_wrap .con .img_slide .grap ul li .thumb::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 25% !important;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.90) 0%,
    rgba(0, 0, 0, 0.60) 35%,
    rgba(0, 0, 0, 0.15) 75%,
    rgba(0, 0, 0, 0)    100%
  ) !important;
  pointer-events: none !important;
  z-index: 1 !important;
  border-radius: 0 0 12px 12px !important;
}

/* 카드 하단 텍스트 — 가독성 강화 */
.cont2 #cul_event .con_wrap .con .img_slide .grap ul li .info {
  text-shadow: 0 1px 5px rgba(0, 0, 0, 0.95) !important;
  font-weight: 600 !important;
  font-size: 13px !important;
}
.cont2 #cul_event .con_wrap .con .img_slide .grap ul li .info_wrap {
  padding: 20px 14px 14px !important;
  z-index: 2 !important;
  position: absolute !important;
}

/* 지역 필터 셀렉트 — 인디고 계열 */
.cont2 #cul_event .select_wrap {
  background-color: rgba(240, 238, 255, 0.95) !important;
  background-image: url('../img/main/main_select.png') !important;
  background-repeat: no-repeat !important;
  background-position: center right 15px !important;
  border: 1.5px solid #4a40f3 !important;
  border-radius: 8px !important;
  color: #2d1b8e !important;
  font-family: 'Noto Sans KR', sans-serif !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 8px rgba(45, 27, 142, 0.12) !important;
}
.cont2 #cul_event .select_wrap:focus {
  outline: none !important;
  border-color: #2d1b8e !important;
  box-shadow: 0 0 0 3px rgba(74, 64, 243, 0.2) !important;
}

/* 지역 탭리스트 — 인디고 계열 (데스크탑 노출 시) */
.cont2 #cul_event .tablist li a {
  border-color: rgba(45, 27, 142, 0.25) !important;
  color: #3a3a5c !important;
  font-family: 'Noto Sans KR', sans-serif !important;
  font-size: 14px !important;
  transition: background 0.15s, color 0.15s !important;
}
.cont2 #cul_event .tablist li a:hover {
  background: #f0eeff !important;
  color: #2d1b8e !important;
}

/* 문화행사 탭 — 인디고 선택 상태 */
.cont2 .tablist li a.ov {
  background: #2d1b8e !important;
  border-color: #2d1b8e !important;
  color: #fff !important;
}
.cont2 .tablist li a:hover {
  background: #f0eeff !important;
  color: #2d1b8e !important;
}

/* 더보기 버튼 — 원형에서 약간 더 세련되게 */
.cont2 #cul_event .con_wrap .con .more a {
  background: #2d1b8e !important;
  transition: transform 0.2s ease, background 0.2s ease !important;
}
.cont2 #cul_event .con_wrap .con .more a:hover {
  background: #4a40f3 !important;
  transform: rotate(90deg) scale(1.1) !important;
}
.cont4 #data_wrap .con_wrap .con .more a {
  background: #2d1b8e !important;
}
.cont4 #data_wrap .con_wrap .con .more a:hover {
  background: #4a40f3 !important;
}

/* 문화예술 데이터 카테고리 뱃지 — 인디고 */
.cont4 #data_wrap .con_wrap .con .data_slide .grap ul li .cate {
  background: #2d1b8e !important;
  font-family: 'Noto Sans KR', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0;
}

/* ─────────────────────────────────────────
   문화예술인 — 수직 타원형 인물 카드 (한 줄)
───────────────────────────────────────── */

/* grap 높이 — 1줄(padding 45 + 이미지 195 + margin 14 + 텍스트 ~55) */
#data-1 .data_slide .grap {
  height: 330px !important;
  margin-bottom: 73px !important;
}
/* ul 상단 패딩 — data-2와 동일 */
#data-1 .data_slide .grap ul {
  padding-top: 45px !important;
}

#data-1 .data_slide .grap ul li .thumb {
  border: none !important;
  background: none !important;
  overflow: visible !important;
  margin-bottom: 14px !important;
}
#data-1 .data_slide .grap ul li .thumb span {
  display: block !important;
  width: 150px !important;
  height: 195px !important;
  margin: 0 auto !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  border: none !important;
  box-shadow: 0 4px 20px rgba(45, 27, 142, 0.28) !important;
  transition: box-shadow 0.3s ease !important;
}
/* 이미지 꽉 채우기 */
#data-1 .data_slide .grap ul li .thumb span img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
#data-1 .data_slide .grap ul li .thumb span::after {
  border-radius: 50% !important;
}
#data-1 .data_slide .grap ul li a:hover .thumb span,
#data-1 .data_slide .grap ul li a:focus .thumb span {
  box-shadow: 0 8px 28px rgba(45, 27, 142, 0.45) !important;
}
#data-1 .data_slide .grap ul li a:hover .thumb,
#data-1 .data_slide .grap ul li a:focus .thumb {
  box-shadow: none !important;
}
#data-1 .data_slide .grap ul li .cate {
  background: #2d1b8e !important;
}
#data-1 .data_slide .grap ul li p {
  text-align: center !important;
}

/* ─────────────────────────────────────────
   문화예술단체 — 둥근 사각형 카드
───────────────────────────────────────── */
#data-2 .data_slide .grap ul li .thumb {
  border: none !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  margin-bottom: 14px !important;
  box-shadow: 0 2px 12px rgba(45, 27, 142, 0.15) !important;
  transition: box-shadow 0.3s ease, transform 0.3s ease !important;
}
#data-2 .data_slide .grap ul li .thumb span {
  height: 190px !important;
  border-radius: 0 !important;
}
#data-2 .data_slide .grap ul li .thumb span::after {
  border-radius: 0 !important;
}
#data-2 .data_slide .grap ul li a:hover .thumb,
#data-2 .data_slide .grap ul li a:focus .thumb {
  box-shadow: 0 8px 28px rgba(45, 27, 142, 0.50) !important;
  transform: translateY(-3px) !important;
}
#data-2 .data_slide .grap ul li .cate {
  background: #3a2bb8 !important;
  letter-spacing: -0.3px !important;
}

/* 행사 카드 hover 하단 바 — 인디고 */
.cont2 #cul_event .con_wrap .con .img_slide .grap ul li a:hover::after,
.cont2 #cul_event .con_wrap .con .img_slide .grap ul li a:focus::after {
  background: #2d1b8e !important;
}

/* 지도 섹션 배경 개선 — 배경 위 인디고 오버레이 약화 */
.cont3 {
  background-image:
    linear-gradient(
      180deg,
      rgba(26, 21, 80, 0.06) 0%,
      rgba(26, 21, 80, 0.0) 100%
    ),
    url('../img/main/cont3_bg.jpg') !important;
  background-size: cover !important;
  background-position: center !important;
}

/* cont3 색상 배경 블록 제거 */
.cont3::before,
.cont3::after {
  display: none !important;
}

/* 지도 크기 축소 — 원본 524×466 → 80% (419×373) */
.cont3 #map_wrap .map_left .box {
  width: 419px !important;
  height: 373px !important;
}
.cont3 #map_wrap .map_left .box > img {
  width: 100% !important;
  height: 100% !important;
}
/* 안내 문구 들여쓰기 비율 맞춤 (75px → 60px) */
.cont3 #map_wrap .map_left p {
  margin-left: 60px !important;
}

/* 지도 지역 표시 아이콘 */
.cont3 #map_wrap .map_left p span {
  background: #2d1b8e !important;
}
.cont3 #map_wrap .con_wrap .btn_wrap a {
  background: #2d1b8e !important;
}
.cont3 #map_wrap .con_wrap .btn_wrap a::before {
  display: none !important;
}

/* 시설 카드 — 3개만 표시 */
.cont3 #map_wrap .con_wrap .con .art_slide .grap ul li:nth-child(n+4) {
  display: none !important;
}

/* 시설 카드 — 막대기 제거 */
.cont3 #map_wrap .con_wrap .con .art_slide .grap ul li .title::before {
  display: none !important;
}

/* 시설 카드 — 썸네일 카드 전체 높이로 확장, 둥근 모서리 */
.cont3 #map_wrap .con_wrap .con .art_slide .grap ul li {
  position: relative !important;
}
.cont3 #map_wrap .con_wrap .con .art_slide .grap ul li .thumb {
  height: 285px !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  transition: box-shadow 0.3s ease !important;
  position: relative !important;
}

/* 시설 카드 — 하단 그라디언트로 텍스트 가독성 확보 */
/* modify 20260624 : 이미지를 더 명확하게 보이게하기 위해 필터 조절 */
/*.cont3 #map_wrap .con_wrap .con .art_slide .grap ul li .thumb::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 70% !important;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.88) 0%,
    rgba(0, 0, 0, 0.55) 40%,
    rgba(0, 0, 0, 0.10) 70%,
    rgba(0, 0, 0, 0)    100%
  ) !important;
  pointer-events: none !important;
  z-index: 1 !important;
  border-radius: 0 0 12px 12px !important;
}*/

/* 시설 카드 — 타이틀을 이미지 하단 오버레이로 배치 */
/* modify 20260624 : 이미지를 더 명확하게 보이게하기 위해 필터 조절 */
.cont3 #map_wrap .con_wrap .con .art_slide .grap ul li .title {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  padding: 32px 16px 16px !important;
  /*background: linear-gradient(to top, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.3) 60%, rgba(0,0,0,0) 100%) !important;*/
  background: linear-gradient(to top, rgba(0,0,0,1) 0%, rgba(0,0,0,0.8) 35%, rgba(0,0,0,0.3) 65%, rgba(0,0,0,0) 100%) !important;
  border-radius: 0 0 12px 12px !important;
  z-index: 2 !important;
}
.cont3 #map_wrap .con_wrap .con .art_slide .grap ul li .title strong {
  background: transparent !important;
  color: #ffffff !important;
  height: auto !important;
  line-height: 1.4 !important;
  padding: 0 !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.9), 0 2px 12px rgba(0, 0, 0, 0.7) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* 호버 효과 */
.cont3 #map_wrap .con_wrap .con .art_slide .grap ul li a:hover .thumb,
.cont3 #map_wrap .con_wrap .con .art_slide .grap ul li a:focus .thumb {
  box-shadow: 0 10px 30px rgba(45, 27, 142, 0.45) !important;
}
.cont3 #map_wrap .con_wrap .con .art_slide .grap ul li a:hover .thumb span::after,
.cont3 #map_wrap .con_wrap .con .art_slide .grap ul li a:focus .thumb span::after {
  /*opacity: 1 !important;*/
}
.cont3 #map_wrap .con_wrap .con .art_slide .grap ul li a:hover .title,
.cont3 #map_wrap .con_wrap .con .art_slide .grap ul li a:focus .title {
  background: linear-gradient(to top, rgba(45, 27, 142, 0.85) 0%, rgba(0,0,0,0) 100%) !important;
}

/* 컨트롤 — 카드 아래에 자연스럽게 배치 (겹침 방지) */
.cont3 #map_wrap .con_wrap .con .art_slide .control {
  position: static !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 8px !important;
  margin-top: 16px !important;
}

/* prev/next/play/stop 컨트롤 버튼 — 전체시설보기 버튼 색 통일 */
.cont3 #map_wrap .con_wrap .con .art_slide .control button.prev,
.cont3 #map_wrap .con_wrap .con .art_slide .control button.next {
  margin-left: 0 !important;
  border-color: #2d1b8e !important;
  background: #2d1b8e !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: background 0.2s ease !important;
}
.cont3 #map_wrap .con_wrap .con .art_slide .control button.prev:hover,
.cont3 #map_wrap .con_wrap .con .art_slide .control button.next:hover {
  background: #4a40f3 !important;
  border-color: #4a40f3 !important;
}

.cont3 #map_wrap .con_wrap .con .art_slide .control button.play,
.cont3 #map_wrap .con_wrap .con .art_slide .control button.stop {
  border: 1px solid #2d1b8e !important;
  border-radius: 50% !important;
  background: #2d1b8e !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: background 0.2s ease !important;
}
.cont3 #map_wrap .con_wrap .con .art_slide .control button.play:hover,
.cont3 #map_wrap .con_wrap .con .art_slide .control button.stop:hover {
  background: #4a40f3 !important;
  border-color: #4a40f3 !important;
}

/* ─────────────────────────────────────────
   4. 뉴스 섹션 — 배너 외부 독립 영역
───────────────────────────────────────── */

/* 문화행사 영역 — 하단 여백 정리 */
.mvisual_body {
  padding-bottom: 40px !important;
}

/* 뉴스 영역 — 라이트 배경 독립 섹션 */
.mvisual_foot {
  background: #f4f5fb !important;
  border-top: 1px solid #f4f5fb !important;
  border-bottom: 1px solid #e2e4f0 !important;
  padding: 48px 0 52px !important;
}
/* main.css의 .cont1 margin-top 리셋 */
.mvisual_foot .cont1 {
  margin-top: 0 !important;
}

/* ─────────────────────────────────────────
   5. NEWS 섹션 — 수직 리스트 레이아웃
───────────────────────────────────────── */

/* 뉴스 타이틀 */
.cont1 .news .news_title {
  font-family: 'Pretendard Variable', 'Pretendard', sans-serif !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  color: #1a1550 !important;
  letter-spacing: -0.5px !important;
  margin: 0 0 20px 0 !important;
}
.cont1 .news .news_title span {
  color: #2d7a5f !important;
}

/* 레이아웃 — 상하 플렉스 배치 (탭 상단, 리스트 하단) */
.cont1 .news .layout {
  font-size: 14px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
}

/* 헤드 영역 — 상단 가로 바 */
.cont1 .news .news_head {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  width: 100% !important;
  flex-shrink: 0 !important;
  vertical-align: unset !important;
  margin-bottom: 0 !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid #d8daf0 !important;
}
.cont1 .news .news_head .control {
  display: none !important;
}

/* more + 링크 */
.cont1 .news .news_more {
  margin-left: auto !important;
  font-size: 12px !important;
  color: rgba(26, 21, 80, 0.45) !important;
  font-family: 'Pretendard Variable', 'Pretendard', sans-serif !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: color 0.15s !important;
}
.cont1 .news .news_more:hover {
  color: #2d1b8e !important;
}

/* 카테고리 탭 — 가로 나열 */
.cont1 .news .news_cats {
  display: flex !important;
  flex-direction: row !important;
  gap: 20px !important;
  margin-top: 0 !important;
}
.cont1 .news .news_cats .cat_btn {
  display: inline-block !important;
  width: auto !important;
  padding: 0 0 8px 0 !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  color: rgba(26, 21, 80, 0.45) !important;
  font-size: 14px !important;
  font-family: 'Pretendard Variable', 'Pretendard', sans-serif !important;
  font-weight: 500 !important;
  text-align: left !important;
  cursor: pointer !important;
  transition: color 0.15s, border-color 0.15s !important;
  position: relative !important;
}
.cont1 .news .news_cats .cat_btn:hover {
  background: transparent !important;
  color: #1a1550 !important;
  border-color: rgba(45, 27, 142, 0.3) !important;
}
.cont1 .news .news_cats .cat_btn.active {
  background: transparent !important;
  color: #2d1b8e !important;
  border-bottom: 2px solid #2d1b8e !important;
  font-weight: 700 !important;
  padding-left: 0 !important;
}

/* grap 영역 — 탭 아래 전체 너비 */
.cont1 .news .grap {
  display: block !important;
  position: static !important;
  height: auto !important;
  width: 100% !important;
  flex: none !important;
  vertical-align: unset !important;
  overflow: visible !important;
}

/* ul — 수직 플렉스로 나열 */
.cont1 .news .grap ul {
  position: static !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  height: auto !important;
  overflow: visible !important;
  width: 100% !important;
}

/* 리스트 개별 아이템 — 수평 행 */
.cont1 .news .grap ul li {
  flex: none !important;
  height: auto !important;
  font-size: 14px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 13px 0 !important;
  border-bottom: 1px solid #e2e4f0 !important;
  background: none !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-radius: 0 !important;
  transition: background 0.15s, padding-left 0.15s !important;
}
.cont1 .news .grap ul li:first-child {
  border-top: none !important;
}
.cont1 .news .grap ul li:hover {
  background: rgba(45, 27, 142, 0.04) !important;
  padding-left: 6px !important;
}
.cont1 .news .grap ul li.hidden {
  display: none !important;
}

/* 링크 — 한 줄 말줄임 */
.cont1 .news .grap ul li a {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: block !important;
  -webkit-line-clamp: unset !important;
  max-width: calc(100% - 90px) !important;
  line-height: 1.5 !important;
  font-size: 14px !important;
  color: #2c2a4a !important;
  flex: 1 !important;
  font-family: 'Pretendard Variable', 'Pretendard', sans-serif !important;
  transition: color 0.15s !important;
}
.cont1 .news .grap ul li a:hover {
  color: #2d1b8e !important;
}

/* 날짜 — 우측 고정 */
.cont1 .news .grap ul li span.date {
  display: inline-block !important;
  width: 80px !important;
  flex-shrink: 0 !important;
  text-align: right !important;
  font-size: 12px !important;
  color: rgba(26, 21, 80, 0.4) !important;
  font-family: 'Pretendard Variable', 'Pretendard', sans-serif !important;
  padding-right: 6px !important;
}

/* 협업공지 상태 뱃지 */
.cont1 .news .grap ul li .status-badge {
  display: inline-block !important;
  flex-shrink: 0 !important;
  padding: 2px 7px !important;
  border-radius: 3px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  font-family: 'Pretendard Variable', 'Pretendard', sans-serif !important;
  letter-spacing: 0 !important;
  line-height: 1.6 !important;
  white-space: nowrap !important;
  width: auto !important;
  text-align: center !important;
}
.cont1 .news .grap ul li .status-recruiting {
  background: rgba(45, 27, 142, 0.1) !important;
  color: #2d1b8e !important;
  border: 1px solid rgba(45, 27, 142, 0.25) !important;
}
.cont1 .news .grap ul li .status-upcoming {
  background: rgba(0, 120, 80, 0.08) !important;
  color: #006a47 !important;
  border: 1px solid rgba(0, 120, 80, 0.2) !important;
}

/* No Data 빈 상태 */
.cont1 .news .grap .news-no-data {
  display: none;
  text-align: center;
  padding: 28px 0;
  font-size: 14px;
  font-family: 'Pretendard Variable', 'Pretendard', sans-serif;
  color: rgba(26, 21, 80, 0.35);
}

/* 푸터 폰트 개선 */
#foot_layout .foot_list li a,
#foot_layout .footer-info address,
#foot_layout .footer-info .copy {
  font-family: 'Noto Sans KR', sans-serif !important;
}

/* ─────────────────────────────────────────
   반응형 (태블릿 1023px 이하)
───────────────────────────────────────── */
@media screen and (max-width: 1023px) {
  /* 검색박스 — 태블릿 크기 조정 */
  #mvisual .group .box {
    width: 60% !important;
    max-width: 90% !important;
  }
  #mvisual .group .box .form_wrap input[type="text"].search {
    height: 50px !important;
    line-height: 50px !important;
  }
  #mvisual .group .box .form_wrap input[type="submit"] {
    width: 38px !important;
    height: 38px !important;
    margin-top: -19px !important;
  }
}

/* ─────────────────────────────────────────
   반응형 (767px 이하) — 메인 본문
───────────────────────────────────────── */
@media screen and (max-width: 767px) {
  /* 검색박스 — 모바일 크기 및 유격 */
  #mvisual .group .box {
    width: 88% !important;
    max-width: 100% !important;
  }
  #mvisual .group .box .form_wrap input[type="text"].search {
    height: 46px !important;
    line-height: 46px !important;
    font-size: 14px !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.12) !important;
  }
  #mvisual .group .box .form_wrap input[type="submit"] {
    width: 34px !important;
    height: 34px !important;
    margin-top: -17px !important;
  }

  /* 문화행사 — 1개씩 표시 + 이미지 자연 비율
     .layout { padding: 0 20px } → cul_event_width = 100vw - 40px (= 드롭다운 너비)
     grap { margin: 0 -15px } → grap_width = (100vw - 40px) + 30px = 100vw - 10px
     li { width: calc(100vw - 40px); margin: 0 15px } → li_total = 100vw - 10px = grap_width = 1슬라이드 단위 */
  .cont2 #cul_event .con_wrap .con .img_slide .grap {
    height: auto !important;
    overflow: hidden !important;
  }
  .cont2 #cul_event .con_wrap .con .img_slide .grap ul {
    height: auto !important;
    width: 9000px !important;
  }
  .cont2 #cul_event .con_wrap .con .img_slide .grap ul li {
    width: calc(100vw - 40px) !important;
    height: auto !important;
    padding-bottom: 0 !important;
  }
  .cont2 #cul_event .con_wrap .con .img_slide .grap ul li a {
    height: auto !important;
  }
  .cont2 #cul_event .con_wrap .con .img_slide .grap ul li .thumb {
    aspect-ratio: 3 / 4 !important;
    height: auto !important;
    border-radius: 8px !important;
    overflow: hidden !important;
  }
  .cont2 #cul_event .con_wrap .con .img_slide .grap ul li .thumb span {
    height: 100% !important;
    background: #111 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  .cont2 #cul_event .con_wrap .con .img_slide .grap ul li .thumb span img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    display: block !important;
  }
  /* modify 20260624 : 이미지를 더 명확하게 보이게하기 위해 필터 조절 */
  .cont2 #cul_event .con_wrap .con .img_slide .grap ul li .thumb::after {
    /*height: 70% !important;*/
  }

  /* 문화예술 시설 — 1열(전체 너비)로 전환하여 1개씩 표시 */
  .cont3 #map_wrap .con_wrap .con .art_slide .grap {
    overflow: hidden !important;
    height: 200px !important;
  }
  .cont3 #map_wrap .con_wrap .con .art_slide .grap ul li {
    width: 100% !important;
    margin: 0 !important;
  }
  .cont3 #map_wrap .con_wrap .con .art_slide .grap ul li .thumb {
    height: 200px !important;
  }
  .cont3 #map_wrap .con_wrap .con .art_slide .grap ul li .title {
    padding: 20px 12px 12px !important;
  }
  .cont3 #map_wrap .con_wrap .con .art_slide .grap ul li .title strong {
    font-size: 13px !important;
  }

  /* 문화예술 시설 — 전체시설보기 버튼 */
  .cont3 #map_wrap .con_wrap .btn_wrap {
    position: static !important;
    text-align: center !important;
    margin-top: 14px !important;
  }
  .cont3 #map_wrap .con_wrap .btn_wrap a {
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    line-height: 1.4 !important;
    border-radius: 20px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 9px 22px !important;
    background: #2d1b8e !important;
    color: #fff !important;
  }
  .cont3 #map_wrap .con_wrap .btn_wrap a::before,
  .cont3 #map_wrap .con_wrap .btn_wrap a::after {
    display: none !important;
  }

  /* 문화예술단체 — 1개씩 표시 (수평 슬라이더)
     grap { margin: 0 } 으로 리셋 → grap = container = 100vw - 40px
     li { width: calc(100vw - 56px); margin: 0 8px } → li_total = 100vw - 40px = grap_width
     카드 양쪽 8px 여백으로 우측 잘림 없이 1개씩 표시 */
  #data-2 .data_slide .grap {
    height: auto !important;
    overflow: hidden !important;
    margin: 16px 0 0 !important;
  }
  #data-2 .data_slide .grap ul {
    width: 9000px !important;
    height: auto !important;
    padding: 0 !important;
  }
  #data-2 .data_slide .grap ul li {
    width: calc(100vw - 56px) !important;
    height: auto !important;
    margin: 0 8px !important;
  }
  #data-2 .data_slide .grap ul li .thumb span {
    height: auto !important;
    aspect-ratio: 4 / 3 !important;
  }
  #data-2 .data_slide .grap ul li .thumb span img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
  }

  /* 뉴스 섹션 — main.css height:70px 해제 */
  .mvisual_foot {
    padding: 32px 0 36px !important;
  }
  .cont1 .news {
    height: auto !important;
    overflow: visible !important;
  }
  .cont1 .news .layout {
    flex-direction: column !important;
  }
  .cont1 .news .news_title {
    font-size: 18px !important;
    margin-bottom: 14px !important;
  }
  .cont1 .news .news_head {
    width: 100% !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    padding-bottom: 8px !important;
  }
  .cont1 .news .news_cats {
    gap: 12px !important;
  }
  .cont1 .news .news_cats .cat_btn {
    font-size: 13px !important;
  }
  .cont1 .news .grap {
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;
  }
  .cont1 .news .grap ul {
    height: auto !important;
    overflow: visible !important;
    position: static !important;
  }
  .cont1 .news .grap ul li {
    height: auto !important;
    font-size: 13px !important;
    padding: 11px 0 !important;
    gap: 8px !important;
  }
  .cont1 .news .grap ul li a {
    font-size: 13px !important;
    max-width: calc(100% - 70px) !important;
  }
  .cont1 .news .grap ul li span.date {
    width: 65px !important;
    font-size: 11px !important;
  }
  .cont1 .news .grap ul li .status-badge {
    font-size: 10px !important;
    padding: 1px 5px !important;
  }
}

/* ─────────────────────────────────────────
   반응형 (500px 이하)
───────────────────────────────────────── */
@media screen and (max-width: 500px) {
  /* 검색박스 — 전체 너비 */
  #mvisual .group .box {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* 문화행사 — 500px 이하에서도 자연 비율 유지 */
  .cont2 #cul_event .con_wrap .con .img_slide .grap ul li .thumb {
    border-radius: 6px !important;
  }

  /* 문화예술 시설 — 단일 열 높이 확대 */
  .cont3 #map_wrap .con_wrap .con .art_slide .grap {
    height: 220px !important;
  }
  .cont3 #map_wrap .con_wrap .con .art_slide .grap ul li .thumb {
    height: 220px !important;
  }

  /* 문화예술단체 — 단일 열 높이 조정 */
  #data-2 .data_slide .grap {
    height: 320px !important;
  }

  /* 뉴스 날짜 숨김 (main.css 동일 처리) */
  .cont1 .news .grap ul li span.date {
    display: none !important;
  }
  .cont1 .news .grap ul li a {
    max-width: 100% !important;
  }
}


/* modify 20260609 : main 페이지 문화예술데이터 mouse hover 이벤트 관련 추가 */
.cont4 #data_wrap .con_wrap .con .data_slide .grap ul li a:hover .thumb span:after, .cont4 #data_wrap .con_wrap .con .data_slide .grap ul li a:focus .thumb span:after{
	opacity: 0 !important;
}

/* modify 20260609 : main 페이지 - 문화예술단체 2번째 줄 노출에 따른 처리 */
.cont4 #data_wrap .con_wrap #data-2.con .data_slide .grap {height: 321px  !important;}
@media screen and (max-width:1023px){
	.cont4 #data_wrap .con_wrap #data-2.con .data_slide .grap {height: 305px  !important;}
}
@media screen and (max-width:765px){
	.cont4 #data_wrap .con_wrap #data-2.con .data_slide .grap {height: 100% !important;}
}