@charset "UTF-8";
/* 모바일 대응 — 기존(PC 전용, 가로 1100~1140px 고정) 화면을 휴대폰에서도 읽히게 하는 덮어쓰기 CSS.
   build.mjs 가 모든 쪽 맨 뒤에 붙인다. PC 화면(1025px 이상)은 원래 모습 그대로다. */
@media (max-width: 1024px) {
  html, body { overflow-x: hidden; -webkit-text-size-adjust: 100%; }
  body { min-width: 0 !important; width: 100%; }
  * { box-sizing: border-box; }
  img, video, canvas, svg { max-width: 100%; height: auto; }
  iframe { max-width: 100%; }

  /* ---------- 머리말 ---------- */
  .header_wrap { height: 60px; }
  .header { width: 100%; padding: 0 12px; }
  .header_logo img { width: 140px; height: auto; }
  .header > a[href^="tel"] { top: 14px !important; right: 62px !important; }
  .header > a[href^="tel"] img { width: 112px; height: auto; }
  .gnb_sitemap { width: 42px; height: 38px; margin-top: -19px; right: 10px; padding-top: 2px; }
  .line { width: 22px; height: 2px; margin: 6px auto; }
  #hamburger-1.is-active .line:nth-child(1) { transform: translateY(8px) rotate(45deg); }
  #hamburger-1.is-active .line:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

  /* PC 용 마우스 올림 메뉴는 쓰지 않고, 햄버거로 여는 전체 메뉴(사이트맵)만 쓴다 */
  .cate_group { display: none !important; }
  .nav2_wrap { position: fixed; top: 60px; left: 0; right: 0; bottom: 0; z-index: 50; overflow-y: auto; background: rgba(0, 0, 0, 0.96); -webkit-overflow-scrolling: touch; }
  .nav2 { height: auto; min-height: 100%; position: static; border-top: 0; padding: 8px 0 40px; }
  .sitemap_wrap { width: 100%; padding: 0 16px; text-align: left; }
  .sitemap_wrap > li { display: block; width: 100%; height: auto; line-height: 1.4; margin: 16px 0 0; border: 0; border-bottom: 1px solid #555; padding-bottom: 12px; text-align: left; }
  .sitemap_wrap > li:hover { border: 0; border-bottom: 1px solid #555; }
  .sitemap_wrap > li > a { font-size: 19px; font-weight: 700; padding: 6px 0; }
  .sitemap_wrap > li > ul { margin: 6px 0 0; }
  .sitemap_wrap > li > ul > li { margin: 0; }
  .sitemap_wrap > li > ul > li > a { display: block; padding: 7px 0 7px 4px; font-size: 16px; }
  .sitemap_wrap > li > ul > li > ul { margin: 0 0 6px 12px; }
  .sitemap_wrap > li > ul > li > ul > li { line-height: 1.5; }
  .sitemap_wrap > li > ul > li > ul > li a { display: inline-block; padding: 4px 0; font-size: 15px; }
  .pc_opacity { display: none !important; }

  /* ---------- 홈 ---------- */
  .main_contents_wrap { width: 100%; padding: 0; }
  .main_contents_wrap ul { padding: 0; }
  .main_contents_wrap iframe { width: 100% !important; height: 56.25vw !important; min-height: 190px; display: block; }
  .mirae-home-links .mirae-home-links__services { padding: 0 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .mirae-home-links .mirae-home-links__support { grid-template-columns: 1fr; max-width: 420px; }
  .mirae-home-links .mirae-home-links__support-link + .mirae-home-links__support-link { border-left: 0; border-top: 1px solid #b9b9b9; }
  .mirae-home-links .mirae-home-links__support-image { width: 100%; height: auto; max-width: 320px; }
  .mirae-home-links .mirae-home-links__help { padding: 40px 16px; }

  /* ---------- 바닥글 ---------- */
  .footer_top { height: auto; padding: 14px 12px; }
  .footer_top li { display: inline-block; line-height: 24px; }
  .footer_top li:not(:last-child)::after { margin: 0 6px -1px 8px; }
  .footer_top li a { font-size: 13px; }
  .footer_top br { display: none; }
  .footer_bottom { height: auto; padding: 18px 14px 22px; }
  .footer_bottom > ul { padding: 0; text-align: center; }
  .footer_bottom > ul > li { display: block; margin: 4px 0; line-height: 1.5; font-size: 13px; }
  .footer_bottom > ul > li:not(:first-child):not(:last-child)::before { display: none; }
  .footer_bottom > ul > li:last-child { padding-left: 0; }
  .footer_bottom img { max-width: 180px; }
  .footer_btm_copy { margin: 10px 8px 0; font-size: 11px; }

  /* ---------- 하위 화면 공통 ---------- */
  .sub_visual_bg { height: 150px !important; background-size: cover !important; }
  .sub_visual_txt { margin-top: 0 !important; padding-top: 44px; text-align: center; }
  .sub_visual_txt dt h2, .sub_visual_txt dt { font-size: 26px !important; }
  .sub_visual_txt dd { font-size: 14px !important; padding: 0 12px; }
  .sub_depth_list { width: 100% !important; height: auto !important; display: flex; flex-wrap: wrap; justify-content: center; padding: 6px 8px 0; }
  .sub_depth_list li { float: none !important; width: auto !important; flex: 0 0 auto; }
  .sub_depth_list li a { display: block; padding: 12px 10px !important; font-size: 15px !important; line-height: 1.3 !important; }
  .sub_title { font-size: 28px !important; margin: 26px 0 22px !important; padding: 0 12px; text-align: center; }
  .sub_wrap { width: 100% !important; padding: 0 14px; min-height: 0; }
  .sub_wrap img { max-width: 100%; height: auto; }
  .sub_tab_btns { width: 100% !important; height: auto !important; display: flex; flex-wrap: wrap; }
  .sub_tab_btns li { float: none !important; flex: 1 1 33.33%; width: auto !important; min-width: 0; height: auto !important; line-height: 1.3 !important; font-size: 15px !important; }
  .sub_tab_btns li a { display: block; padding: 13px 4px; }
  .sub_6_tab_btns li, .sub_5_tab_btns li { flex-basis: 33.33%; }


  /* ---------- 연혁: 고정 높이(1810px)를 풀고, 세로 선이 내용 길이만큼만 ---------- */
  .history_group { height: auto !important; padding-bottom: 30px; }
  .history_wrap { padding-bottom: 10px; }
  .history_bar { height: 100% !important; left: 22px !important; }
  .history_cont { margin: 0 0 34px 8px !important; padding-left: 20px; }
  .history_cont dt { font-size: 26px !important; margin: 0 14px 0 0 !important; }
  .history_cont dt::before { width: 44px !important; background-size: contain !important; }
  .history_cont dd { font-size: 15px !important; line-height: 22px !important; margin: 0 0 0 20px !important; }

  /* ---------- 비전: 배경 그림 대신 "VISION 문장 → 세 가지 가치(제목+설명 카드)"로 위에서 아래로 읽히게 ---------- */
  .vision_bg { height: auto !important; background: none !important; padding: 0 0 30px; display: flex; flex-direction: column; gap: 0; }
  .vision_icon_txt_wrap { display: contents; }
  .vision_summary_txt { margin-bottom: 26px !important; padding: 0 6px; }
  .vision_summary_txt dt { font-size: 20px !important; line-height: 1.4; }
  .vision_summary_txt dd { font-size: 15px !important; line-height: 1.6; }
  .vision_point { order: 1; margin: 0 0 26px !important; padding: 22px 16px; background: #c40452; border-radius: 12px; }
  .vision_point dt, .vision_point dt.upper { font-size: 24px !important; color: #fff !important; letter-spacing: 2px; }
  .vision_point dt::after { background: #fff !important; margin: 10px auto !important; }
  .vision_point dd { font-size: 18px !important; line-height: 1.6 !important; color: #fff !important; font-weight: 500; }
  .vision_point dd span { font-weight: 800; border-bottom: 2px solid #fff; }
  .vision_value_head { order: 0; }
  /* 세 가지 가치: 제목(분홍 띠) + 설명(회색 칸)이 한 묶음으로 보이게 순서를 맞춘다 */
  .vision_icon_txt01 { order: 2; }
  .vision_txt01 { order: 3; }
  .vision_icon_txt02 { order: 4; }
  .vision_txt02 { order: 5; }
  .vision_icon_txt03 { order: 6; }
  .vision_txt03 { order: 7; }
  .vision_icon_txt { display: block; margin: 0 !important; padding: 13px 16px !important; font-size: 20px !important; font-weight: 700 !important; text-align: left !important; color: #c40452; background: #fff; border: 2px solid #c40452; border-bottom: 0; border-radius: 12px 12px 0 0; }
  .vision_icon_txt01::before { content: "1  "; }
  .vision_icon_txt02::before { content: "2  "; }
  .vision_icon_txt03::before { content: "3  "; }
  .vision_icon_txt::before { display: inline-block; width: 26px; height: 26px; line-height: 26px; margin-right: 10px; border-radius: 50%; background: #c40452; color: #fff; text-align: center; font-size: 15px; white-space: pre; overflow: hidden; }
  .vision_txt { position: static !important; display: block; margin: 0 0 18px !important; padding: 14px 16px 16px !important; text-align: left !important; font-size: 16px !important; line-height: 1.75 !important; color: #333; background: #f7f7f7; border: 2px solid #c40452; border-top: 0; border-radius: 0 0 12px 12px; word-break: keep-all; }
  .vision_sum { order: 8; margin-top: 10px; display: flex; justify-content: center; gap: 10px; }
  .vision_sum li, .vision_sum li:nth-of-type(1), .vision_sum li:nth-of-type(2) { float: none !important; width: auto !important; text-align: center !important; padding: 10px 18px !important; font-size: 17px !important; font-weight: 700; border: 1px solid #bbb; border-radius: 999px; }
  .vision_btm_txt { order: 9; font-size: 16px !important; margin: 22px 0 0 !important; padding: 0 10px; color: #888 !important; }

  /* 가로로 나란히 놓여 있던 덩어리는 위아래로 쌓는다 */
  .company_summary_txt, .company_summary_img_wrap, .vision_icon_txt_wrap span, .vision_sum li, .bond_ex, .bong_bg01_txt02 dl,
  .custom_counsel_wrap > div, .guide_ex_list li, .crm_service_list label > div, .gallery_img_wrap, .gallery_list_cont { float: none !important; width: 100% !important; }
  .custom_counsel_img img { float: none; margin: 10px auto 0; display: block; }
  .vision_sum li { padding-top: 40px !important; font-size: 17px !important; }
  .history_cont dt { float: none; margin: 0 0 6px; font-size: 28px; }
  .history_cont dd { margin-left: 0 !important; }
  .customer_list li { float: none; display: inline-block; margin: 0 6px 14px; }

  /* 표는 화면 안에서 옆으로 밀어 볼 수 있게 한다 */
  .sub_wrap table, .board_view_00 table, .mc table { max-width: 100%; }
  .sub_wrap table:not(.board_gallery), .board_list_00 table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }

  /* 게시판 */
  .board_list_00, .board_view_00 { width: 100% !important; }
  .board_list_00 .ar { text-align: left; }
  .board_list_00 .ar select, .board_list_00 .ar input[type="text"], .board_search_box input { width: 100% !important; max-width: 100%; margin: 4px 0; }
  .gallery_board_list_wrap li a { display: block; }
  .gallery_img_wrap { margin-bottom: 10px; }
  .gallery_list_cont { padding: 0 !important; }
  .gallery_list_title { font-size: 18px !important; }
  .pageU { padding: 0 8px; overflow-x: auto; }
  .view_cont, .board_view_00 .pd10 { overflow-x: auto; word-break: break-all; }
  .board_view_00 .pd10 img { max-width: 100% !important; height: auto !important; }
  .board_view_00 .pd10 table { width: 100% !important; }

  /* 서비스 의뢰 / 상담 안내 */
  .custom_service_btn { width: 100% !important; max-width: 320px; }
  .question_list label { display: block; }
  .question_answer_img { width: 18%; }

  /* 전화 안내 팝업(상담 폼을 대신함) */
  .bond_pop { width: 92% !important; left: 4% !important; margin-left: 0 !important; transform: translateY(-50%); }
  .bond_phone_tel a { font-size: 42px !important; }
}

@media (max-width: 600px) {
  .sub_visual_txt dt h2, .sub_visual_txt dt { font-size: 22px !important; }
  .sub_title { font-size: 24px !important; }
  .gnb_sitemap { right: 8px; }
  .footer_top li a { font-size: 12px; }
}