/* ===========================
   FOOTER buttons/links common
=========================== */
#footer .family-site-open-btn{
  position: relative;
  width: 100%;
  height: 50px;
  line-height: 50px;
  padding: 0 40px 0 15px; /* 기본: 오른쪽 아이콘 공간 */
  background: transparent;
  border: 0;
  border-bottom: 1px solid #4e4e4e;
  text-align: left;
  font-size: 12px;
  color: #6c6c6c;
  cursor: pointer;
  font-family: inherit;  /* ✅ 텍스트 폰트 통일(버튼/링크 모두) */
}

/* layout.css 등에 남아있는 xeicon :after 무력화 */
#footer .family-site-open-btn::after{
  content: none !important;
}

/* ===========================
   Policy links (icons inline)
=========================== */
#footer .family-site-open-btn.policy-btn{
  display: flex;
  align-items: center;
  gap: 8px;
  padding-right: 15px; /* 정책 링크는 오른쪽 chevron 공간 필요 없음 */
}

#footer .family-site-open-btn.policy-btn{
  position: relative;
  padding-right: 40px; /* Family Site와 동일 */
  display: block;      /* flex 제거: 룩 통일 */
  line-height: 50px;   /* 버튼 룩 통일 */
}


/* 정책 링크 아이콘도 오른쪽 끝으로 */
#footer .family-site-open-btn.policy-btn > i{
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;     /* Family Site와 동일 */
  color: #6c6c6c;
}


/* ===========================
   Family Site dropdown (chevron absolute)
=========================== */
#footer .family-site-con{
  position: relative;
  display: inline-block;
  width: 160px;
}

#footer .family-site-con .family-site-open-btn > i{
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  color: #6c6c6c;
  transition: transform 0.2s ease;
}

#footer .family-site-con.open .family-site-open-btn > i{
  transform: translateY(-50%) rotate(180deg);
}

/* dropdown list */
#footer .family-site-list{
  position: absolute;
  bottom: 100%;
  left: 0;
  width: 100%;
  padding: 10px 0;
  background: #fff;
  border: 1px solid #ddd;
  border-bottom: 0;
  display: none;
  box-sizing: border-box;
  z-index: 10;
}

#footer .family-site-con.open .family-site-list{
  display: block;
}

#footer .family-site-list a{
  display: block;
  padding: 10px;
  font-size: 12px;
  color: #333;
}

#footer .family-site-list a:hover{
  color: #000;
  text-decoration: underline;
}

/* 데스크탑에서만: 위 3개 / 아래 2개로 줄바꿈 */
@media (min-width: 601px) {
  #footer .footer-address .footer-address-txt {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -8px 3px; /* 기존 값 유지 */
  }

  /* 3번째 뒤에 줄바꿈 강제 */
  #footer .footer-address .footer-address-txt::after {
    content: "";
    flex-basis: 100%;
    height: 0;
    order: 4;
  }

  /* 순서 고정 */
  #footer .footer-address .footer-address-txt p:nth-child(1) { order: 1; }
  #footer .footer-address .footer-address-txt p:nth-child(2) { order: 2; }
  #footer .footer-address .footer-address-txt p:nth-child(3) { order: 3; }
  #footer .footer-address .footer-address-txt p:nth-child(4) { order: 5; }
  #footer .footer-address .footer-address-txt p:nth-child(5) { order: 6; }

  /* 아래줄 첫 항목(TEL)은 앞 작대기 제거 */
  #footer .footer-address .footer-address-txt p:nth-child(4):before {
    display: none;
  }
}



/* =====================================================
   FOOTER Responsive
   - Tablet: 1024px 이하
   - Mobile: 600px 이하
===================================================== */

/* ---------- Tablet (<= 1024px) ---------- */
@media (max-width: 1024px) {
  /* 좌/우 2단 -> 1단 */
  #footer .footer-left-con,
  #footer .footer-right-con {
    float: none;
    width: 100%;
    text-align: left;
  }

  /* 오른쪽 메뉴 영역 풀폭 */
  #footer .footer-drop-menu {
    width: 100%;
    margin-top: 20px;
  }

  /* 3개 박스를 2열 느낌으로 */
  #footer .family-site-box {
    width: calc(50% - 10px);
    margin-left: 0;
    margin-right: 20px;
  }

  /* 짝수는 오른쪽 여백 제거 */
  #footer .family-site-box:nth-child(2n) {
    margin-right: 0;
  }

  /* 3번째 박스는 다음 줄로 내려갈 수 있으니 위쪽 간격 */
  #footer .family-site-box:nth-child(n+3) {
    margin-top: 10px;
  }
}

/* ---------- Mobile (<= 600px) ---------- */
@media (max-width: 600px) {
  #footer {
    padding: 35px 0;
  }

  #footer .area-box {
    padding: 0 16px;
  }

  /* 오른쪽 메뉴 3개를 전부 1열로 */
  #footer .family-site-box {
    float: none;
    width: 100%;
    margin: 0;
  }

  #footer .family-site-box + .family-site-box {
    margin-top: 10px;
  }

  /* 주소 텍스트: 모바일에선 p를 세로로 (작대기 제거) */
  #footer .footer-address .footer-address-txt {
    margin: 0;
    display: block; /* flex 해제 (있어도 덮어씀) */
  }

  #footer .footer-address .footer-address-txt p {
    display: block;
    margin: 0 0 6px;
  }

  #footer .footer-address .footer-address-txt p:before {
    display: none;
  }

  /* copyright 줄간격 */
  #footer .footer-copyright {
    line-height: 1.6;
    margin-top: 10px;
  }
}