/* 2026-10 모바일 전체 정리 — mobile.css 다음에 로드 (덮어쓰기용) */

/* 한국어: 단어 중간에서 줄바꿈 안 되게 */
html[lang="ko"] body { word-break: keep-all; overflow-wrap: break-word; }

@media (max-width: 767px) {
  /* ── 공통 ── */
  body { -webkit-text-size-adjust: 100%; }
  /* 상담·메일 플로팅 버튼: 작게, 글자 가림 줄이기 */
  .kakao-floating-button { width: 46px !important; height: 46px !important; right: 12px !important; bottom: 68px !important; box-shadow: 0 4px 12px rgba(0,0,0,.18) !important; }
  .mail-floating-button { width: 46px !important; height: 46px !important; right: 12px !important; bottom: 14px !important; box-shadow: 0 4px 12px rgba(0,0,0,.18) !important; }
  .chat-floating-button--whatsapp { padding: 7px !important; }
  .wechat-pop { right: 66px; bottom: 70px; }
  footer, .footer { padding-bottom: 70px; }

  /* 서브 상단 이미지(서브 비주얼) 높이 줄이기 */
  #greeting .sub-visual, #history .sub-visual, #organization .sub-visual, #exhibition .sub-visual,
  #technology .sub-visual, #products .sub-visual, #product_list .sub-visual, #product_detail .sub-visual,
  #inquiry .sub-visual, #qna_list .sub-visual, #resource_download .sub-visual, #news_list .sub-visual { height: 170px !important; min-height: 0 !important; }

  /* 서브 탭 글씨 키우기 (11px → 14px) */
  #greeting .sub-nav-item, #history .sub-nav-item, #organization .sub-nav-item, #exhibition .sub-nav-item,
  #products .product-nav__item, #product_list .product-nav__item, #product_detail .product-nav__item,
  #inquiry .tab-nav a, #qna_list .tab-nav a, #resource_download .tab-nav a, #news_list .tab-nav a, #news_detail .tab-nav a {
    font-size: 14px !important; white-space: nowrap;
  }
  .tech-tabs { margin-top: 20px; } .tech-tabs a { padding: 8px 20px; font-size: 14px; }

  /* ── 메인 ── */
  #index .hero:has(.hero-bg-factory) .hero-buttons .btn-outline { padding: 9px 36px 9px 16px !important; }
  /* 전시회 카드: 4개 찌그러짐 → 옆으로 넘기는 카드 */
  #index .exhibition-grid { display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px !important; padding-bottom: 12px; }
  #index .exhibition-card, #index .exhibition-news-container.no-news .exhibition-card { flex: 0 0 72% !important; min-width: 0; scroll-snap-align: start; }
  #index .exhibition-img-box { height: 200px !important; }
  #index .exhibition-card-title { font-size: 16px !important; white-space: normal !important; overflow: visible !important; text-overflow: clip !important; display: block !important; -webkit-line-clamp: unset !important; }
  #index .exhibition-card-date { font-size: 13px !important; text-align: left !important; }
  #index .exhibition-news-section { padding-top: 50px !important; padding-bottom: 50px !important; }

  /* ── 조직도: 영어 이미지 대신 실제 조직도(한국어) 표시 ── */
  #organization .org-chart-mobile { display: none !important; }
  #organization .org-chart { display: block !important; padding: 0 16px; }
  #organization .ceo-box { width: 120px !important; font-size: 20px !important; margin: 0 auto 18px; }
  #organization .ceo-box::after, #organization .level-2-wrapper::before, #organization .level-2-wrapper::after, #organization .org-column::before { display: none !important; }
  #organization .level-2-wrapper { display: grid !important; grid-template-columns: 1fr 1fr; gap: 18px 12px; padding-top: 0 !important; }
  #organization .org-column { width: auto !important; align-items: stretch !important; }
  #organization .dept-box { width: 100% !important; max-width: none !important; font-size: 17px !important; padding: 10px 6px !important; margin-bottom: 8px; }
  #organization .team-list { gap: 6px !important; align-items: stretch !important; }
  #organization .team-box { width: 100% !important; max-width: none !important; font-size: 13.5px !important; padding: 8px 4px !important; }

  /* ── 기술현황 ── */
  #technology .tech-card__title, #technology .tech-sustain__logo-text h4 { font-size: 13px !important; }
  #technology .tech-card__desc, #technology .tech-sustain__text, #technology .tech-sustain__logo-text p, #technology .tech-facilities__desc { font-size: 14px !important; line-height: 1.6 !important; }
  #technology .tech-facilities__grid { display: grid !important; grid-template-columns: 1fr 1fr !important; }
  #technology .tech-stat { width: auto !important; padding: 16px 4px; border-right: 0 !important; border-bottom: 1px solid #eee; }
  #technology .tech-stat:nth-child(odd) { border-right: 1px solid #eee !important; }
  #technology .tech-stat__count { font-size: 26px !important; }
  #technology .tech-stat__name { font-size: 13px !important; }

  /* ── 생산 설비: 공정 단계를 세로 타임라인으로 ── */
  .fac-flow { display: block !important; margin-left: 8px !important; border-left: 2px solid #dfe3e8; padding-left: 0; }
  .fac-flow li { display: flex; align-items: center; gap: 14px; text-align: left; padding: 8px 0; margin-left: -19px; }
  .fac-flow__no { width: 36px; height: 36px; font-size: 15px; flex-shrink: 0; }
  .fac-flow__txt { margin-top: 0; font-size: 15.5px; }
  .fac-stat__label { font-size: 14px; }
  .fac-card__img, .fac-split__img { aspect-ratio: 16/10; }

  /* ── 제품 상세: 색상 선택·컬러 차트 촘촘하게 ── */
  #product_detail .color-selection { grid-template-columns: repeat(5, 1fr) !important; gap: 6px !important; }
  #product_detail .color-option { max-width: none !important; padding: 6px 2px !important; }
  #product_detail .color-option-code { font-size: 11px !important; }
  #product_detail .color-option-name { font-size: 9.5px !important; line-height: 1.2; }
  #product_detail .color-grid { grid-template-columns: repeat(5, 1fr) !important; gap: 12px 8px !important; }
  #product_detail .color-item { height: auto !important; min-height: 0 !important; }
  #product_detail .color-swatch { width: 100% !important; height: auto !important; aspect-ratio: 1 / 1; border-radius: 10px !important; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); margin-bottom: 4px !important; }
  #product_detail .color-code { font-size: 11px !important; }
  #product_detail .color-name { font-size: 9.5px !important; }

  /* ── 결제 화면: 좌우 칸 폭 맞추기 ── */
  #checkout .checkout-layout { display: block !important; }
  #checkout .checkout-left, #checkout .checkout-right { width: 100% !important; max-width: none !important; }
  #checkout .checkout-right { margin-top: 24px; }
  #checkout .checkout-container { padding-left: 16px !important; padding-right: 16px !important; }

  /* 컬러 차트 줄 간격 */
  #product_detail .color-item { margin: 0 !important; padding: 0 !important; }
}
