@charset "utf-8";

/* ============================================================
   footer.css — 푸터
   대응 마크업 : template-parts/footer/footer-main.php

   .row1 / .row2 는 이름이 일반적이라 반드시 .one-foot-btm 으로 스코프를 건다.
   ============================================================ */


/* 푸터 전용 토큰 */
:root {
  --one-ft-bg: #1c1e21;
}


/* ============================
   공통
============================ */

.one-footer {
  background-color: var(--one-ft-bg);
}

/* 기본 여백 축소 */
.one-footer .con-inner {
  padding-top: var(--one-space-s);
  padding-bottom: var(--one-space-s);
}

/* common.css 의 `.section img { width:100% }` 상쇄 */
.one-footer img {
  width: auto;
  max-width: 100%;
  height: auto;
}

.one-footer a {
  color: inherit;
}


/* ============================
   상단 — 로고 · SNS
============================ */

.one-foot-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--one-gap-lg);
}

.ft-logo img {
  width: 280px;
}

.one-foot-sns ul {
  display: flex;
  align-items: center;
  gap: var(--one-gap-lg);
}

.one-foot-sns a {
  display: block;
  line-height: 0;
  transition: opacity 0.2s ease;
}

.one-foot-sns a:hover {
  opacity: 0.6;
}

.one-foot-sns img {
  width: var(--one-icon-xl);
}


/* ============================
   하단 — 사업자정보 · 카피라이트
============================ */

.one-foot-btm {
  padding-top: var(--one-space-s);
}

/* 사업자정보 2줄 */
.one-foot-btm .row1 {
  display: flex;
  flex-direction: column;
  gap: var(--one-gap-xs);
  font-size: var(--one-caption);
}

.one-foot-btm .row1 address {
  font-style: normal;   /* <address> 기본 italic 해제 */
}

/* 카피라이트만 order 로 빼내므로 링크가 몇 개든 배치가 유지된다 */
.one-foot-btm .row2 {
  display: flex;
  align-items: center;
  gap: var(--one-gap-lg);
  padding-top: var(--one-gap-lg);
}

.one-foot-btm .row2 > a {
  flex: 0 0 auto;
  font-size: var(--one-caption);
  transition: opacity 0.2s ease;
}

.one-foot-btm .row2 > a:hover {
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

/* .one-ft-inner 의 .w-color(0,1,0) 를 이기려면 선택자가 2개여야 한다 */
.one-footer .ft-copy {
  order: -1;
  margin-right: auto;
  font-size: var(--one-m-footer);
  color: var(--gray-color01);
}


/* 편집 권한자에게만 보이는 안내 (inc/helpers.php) */

.one-builder-empty {
  display: inline-block;
  padding: var(--one-gap-xs) var(--one-gap-sm);
  border: 1px dashed var(--gray-color01);
  border-radius: 4px;
  font-size: var(--one-m-copy);
  color: var(--gray-color01);
}


/* ============================
   반응형 — 태블릿 (max-width: 1024px)
============================ */

@media all and (max-width: 1024px) {

  /* 하단 고정 퀵바에 가리지 않도록 */
  .one-footer .con-inner {
    padding-bottom: calc(var(--one-space-s) + 60px);
  }

  .ft-logo img {
    width: 200px;
  }

  .one-foot-sns img {
    width: var(--one-icon-l);   /* 24px */
  }
}


/* ============================
   반응형 — 모바일 (max-width: 639px)
============================ */

@media all and (max-width: 639px) {

  .one-foot-top {
    gap: var(--one-gap-r);
  }

  .ft-logo img {
    width: 150px;
  }

  .one-foot-sns ul {
    gap: var(--one-gap-r);
  }

  /* column-reverse 는 상하가 반대가 된다 */
  .one-foot-btm .row2 {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--one-gap-sm);
  }

  .one-footer .ft-copy {
    order: 0;
    margin-right: 0;
  }
}