.elementor-kit-229{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-229 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1290px;}.e-con{--container-max-width:1290px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.elementor-widget:not(:last-child){--kit-widget-spacing:6px;}.elementor-element{--widgets-spacing:6px 6px;--widgets-spacing-row:6px;--widgets-spacing-column:6px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ============================================================
   Mekong Category Navigation v20.6 FINAL (실제 게시판 페이지 연결판)
   ------------------------------------------------------------
   ✅ 링크주소: /category/... → /general-board/, /near-me/?region=...
   ✅ 다른 스타일 요소 절대 변경 없음
=========================================================== */

/* ------------------------------
   🟢 기본 컬러 변수
------------------------------ */
:root {
  --mek-bg: #1ABC9C;
  --mek-hover: #17A589;
  --mek-border: rgba(255,255,255,0.3);
  --mek-text: #E8FFFA;
}

.mek-link {
  text-shadow: 0 1px 1px rgba(0,0,0,0.15);
}

/* ------------------------------
   1️⃣ 전체 네비 배경
------------------------------ */
.mek-topnav {
  width: 100%;
  background: var(--mek-bg);
  border-bottom: 1px solid rgba(0,0,0,0.1);
  box-shadow: inset 0 -1px 0 rgba(255,255,255,0.15);
  z-index: 9999;
  overflow: hidden;
}

/* ------------------------------
   2️⃣ 카테고리 바 내부 정렬
------------------------------ */
.mek-nav {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: stretch;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  white-space: nowrap !important;
  -webkit-overflow-scrolling: touch !important;
  scroll-behavior: smooth !important;
  scrollbar-width: none;
  width: 100%;
}
.mek-nav::-webkit-scrollbar { display: none; }

/* ------------------------------
   3️⃣ 탭 스타일
------------------------------ */
.mek-link {
  flex: 0 0 auto;
  padding: 12px 22px;
  font-size: 16px;
  font-weight: 600;
  color: var(--mek-text) !important;
  text-decoration: none !important;
  background: var(--mek-bg);
  border-right: 1px solid var(--mek-border);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.25s ease;
  white-space: nowrap;
}
.mek-link:hover { background: var(--mek-hover); }
.mek-link:last-child { border-right: none; }

/* ------------------------------
   4️⃣ 드롭다운 (PC)
------------------------------ */
.mek-dropdown { position: relative; }
.mek-dropdown-content {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background: #fff;
  border: 1px solid #ddd;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
  border-radius: 6px;
  z-index: 9999;
  min-width: 220px;
}
.mek-dropdown-content a {
  display: block;
  padding: 8px 14px;
  color: #333 !important;
  text-decoration: none !important;
  font-size: 14px;
}
.mek-dropdown-content a:hover {
  background: #E8FFF2;
  color: var(--mek-bg) !important;
}
.mek-dropdown-content.active {
  display: block !important;
  animation: fadeIn 0.25s ease;
}

/* ------------------------------
   5️⃣ 모바일 전용 스크롤 메뉴
------------------------------ */
.mek-region-scroll {
  display: none;
  overflow-x: auto;
  background: #fff;
  padding: 6px 8px;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
  position: relative;
}

/* 화살표 */
.mek-region-scroll::after {
  content: '›';
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: #1ABC9C;
  font-size: 18px;
  font-weight: 600;
  pointer-events: none;
}

.mek-region-scroll a {
  display: inline-block;
  margin-right: 6px;
  padding: 5px 10px;
  background: #E9FFF2;
  color: #17A589;
  font-size: 13px;
  text-decoration: none;
  white-space: nowrap;
  border-radius: 9999px;
  font-weight: 600;
  line-height: 1.3;
}
.mek-region-scroll a:hover {
  background: #CFFFE1;
  color: #207A4F;
}
.mek-region-scroll.active {
  display: flex;
  gap: 5px;
  animation: slideDown 0.25s ease;
}

/* ------------------------------
   6️⃣ 애니메이션
------------------------------ */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes slideDown {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ------------------------------
   7️⃣ 반응형
------------------------------ */
@media (max-width: 767.98px){
  .mek-link {
    padding: 12px 18px;
    font-size: 15px;
    flex: 1 1 auto;
    text-align: center;
    background: var(--mek-bg);
  }
  .mek-region-scroll { display: none; }
}

/* ------------------------------
   8️⃣ 드롭다운 보장
------------------------------ */
.mek-topnav,
.mek-topnav .mek-nav,
.mek-topnav .mek-dropdown { overflow: visible !important; }
.mek-dropdown-content { z-index: 10050 !important; }
.mek-dropdown-content.active { display: block !important; }
.mek-topnav .mek-dropdown-content a {
  display: block !important;
  padding: 6px 12px !important;
  line-height: 1.25 !important;
  color: #333 !important;
  text-decoration: none !important;
  font-size: 14px !important;
}
.mek-topnav .mek-dropdown-content a:hover {
  background: #E8FFF2 !important;
  color: var(--mek-bg) !important;
}
.elementor-widget-html,
.elementor-widget-container { overflow: visible !important; }

/* ============================================================
   ✅ [v19.4 PATCH] 카테고리바 스크롤 안정화
=========================================================== */
.mek-nav { overscroll-behavior-x: contain !important; touch-action: pan-x !important; }
.mek-topnav { touch-action: none !important; }
.mek-topnav .mek-nav { touch-action: pan-x !important; }

/* ============================================================
   ✅ [v19.5 HOTFIX] Elementor 컨테이너 복원
=========================================================== */
.elementor-element .mek-topnav { position: relative !important; overflow: visible !important; }
.elementor-element .mek-topnav .mek-nav {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  white-space: nowrap !important;
  width: 100% !important;
  -webkit-overflow-scrolling: touch !important;
}

/* 🌴 Tropical Energy — Bold & Friendly */
@import url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSans.css');
:root {
  --mek-bg: #1ABC9C;
  --mek-hover: #13997F;
  --mek-border: rgba(255,255,255,0.4);
  --mek-text: #FFFFFF;
}
.mek-link {
  font-family: 'GmarketSansMedium','GmarketSansBold',sans-serif;
  font-weight: 700;
  font-size: 17px;
  color: var(--mek-text) !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.15);
  transition: all 0.25s ease;
}
.mek-link:hover { background: var(--mek-hover); transform: translateY(-1px); }

/* ============================================================
   🌴 Mekong Category Navigation v20.6 FINAL — 연결 수정판
=========================================================== */
@import url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSans.css');
:root {
  --mek-bg: #1ABC9C;
  --mek-hover: #13997F;
  --mek-border: rgba(255,255,255,0.4);
  --mek-text: #FFFFFF;
  --mek-hot-bg: #FF4B4B;
  --mek-hot-text: #FFF5F5;
}
.mek-link {
  font-family: 'GmarketSansMedium','GmarketSansBold',sans-serif;
  font-weight: 700;
  font-size: 17px;
  color: var(--mek-text) !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.15);
  transition: all 0.25s ease;
  position: relative;
}
.mek-link:hover { background: var(--mek-hover); transform: translateY(-1px); }

/* HOT 태그 */
.mek-link.is-chat::before,
.mek-link.is-market::before {
  content:"HOT";
  position:absolute;
  top:4px; left:8px;
  font-size:10px;
  font-weight:800;
  background:var(--mek-hot-bg);
  color:var(--mek-hot-text);
  padding:1px 4px;
  border-radius:3px;
  letter-spacing:0.4px;
  text-shadow:none;
  box-shadow:0 1px 2px rgba(0,0,0,0.15);
  transform:rotate(-6deg);
  opacity:0.9;
  z-index:10;
}
@media (max-width:767.98px){
  .mek-link.is-chat::before,
  .mek-link.is-market::before{
    top:3px; left:6px; font-size:9px; transform:rotate(-8deg);
  }
}

/* 모바일 스크롤 화살표 */
@media (max-width:767.98px){
  .mek-topnav{ position:relative; }
  .mek-topnav::after{
    content:"›";
    position:absolute;
    right:6px; top:50%;
    transform:translateY(-50%);
    font-size:22px; font-weight:800;
    color:#fff;
    text-shadow:0 0 6px rgba(0,0,0,0.35),0 0 12px rgba(0,0,0,0.25);
    background:rgba(0,0,0,0.15);
    backdrop-filter:blur(2px);
    border-radius:50%;
    padding:2px 8px 4px 8px;
    animation:mekArrowHint 1.5s infinite ease-in-out;
    pointer-events:none;
  }
}
@keyframes mekArrowHint{
  0%,100%{opacity:0.5;transform:translate(0,-50%);}
  50%{opacity:1;transform:translate(3px,-50%);}
}/* End custom CSS */