/* BASIC css start */
/* ============================================================
   스위티스푼 | 모바일 공통 푸터 (foot.css)
   마크업 순서 = html/foot.html 섹션 순서. "SECTION N" 주석으로 1:1 대응.
   ============================================================ */
#footer_container { margin-top: 0px; margin-bottom: 70px; }

/* ============================================================
   SECTION 1   아코디언 메뉴 (고객문의 · 배송/제작안내 · 결제수단 · 법적고지)
   html: <div class="foot-accordion">
   장바구니(basket.css #cart-page .cart-acc-*) 서비스안내 아코디언과 동일 패턴
   (Material Symbols 아이콘 · chevron_right 회전 · jQuery slideUp/slideDown)을
   푸터 라이트 테마(#F9F9F9)에 맞게 이식. 전 페이지 공용 파일이라 클래스는 완전히 분리(.foot-acc-*).
   ============================================================ */
.foot-accordion {
    width: 100%;
    border-top: 1px solid #c7c7c7;
    padding: 30px 0px 30px 0px;
}
.foot-acc-item { }
.foot-acc-trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 16px 20px;
    background: none;
    border: none;
    outline: none;
    cursor: pointer;
    text-align: left;
}
.foot-acc-title {
    font-size: 13px;
    font-weight: 500;
    color: #222;
    letter-spacing: -0.3px;
    font-family: 'Lato', 'Noto Sans KR', sans-serif;
}

.foot-acc-arrow {
    font-size: 18px;
    color: #222;
    font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 20;
    transition: transform 0.22s ease;
    flex-shrink: 0;
}
/* 열린 상태: 화살표 90도 회전 (장바구니와 동일) */
.foot-acc-item.is-open .foot-acc-arrow { transform: rotate(90deg); }
/* 패널: 기본 숨김 (JS slideToggle 제어) */
.foot-acc-panel { display: none; overflow: hidden; }
.foot-acc-body {
    padding: 0 20px 0px;
    color: #3b3b3b;
    font-size: 11px;
    line-height: 1.7;
    font-family: 'Lato', 'Noto Sans KR', sans-serif;
    letter-spacing: 0.02em;
}
.foot-acc-desc { margin: 0; font-size: 11px; letter-spacing: 0.02em; max-width: 90%; }
.foot-acc-desc--mt { margin-top: 10px; font-size: 11px; max-width: 90%; }
.foot-acc-ring { font-size: 11px; }

/* 고객문의: 운영시간 */
.foot-acc-hours { margin-top: 14px; }
.foot-acc-hours-row { display: flex; gap: 10px; padding: 2px 0; }
.foot-acc-hours-row:first-child { border-top: none; }
.foot-acc-hours-label { flex: 0 0 50px; color: #222; font-weight: 500; font-size: 11px; }
.foot-acc-hours-value { flex: 1 1 auto; font-size: 10.5px; letter-spacing: 0.03em; }

/* 문의 링크 / 법적고지 링크 (div/div 구조   li 간섭 없음, 장바구니와 동일 이유) */
.foot-acc-links { margin: 20px 0 0; padding: 0; }
.foot-acc-link-row { margin-top: 0; }
.foot-acc-link-row + .foot-acc-link-row { margin-top: 10px; }
.foot-acc-link { display: inline-flex; align-items: center; gap: 10px; font-size: 12px; color: #1a1a1a; text-decoration: none; }
.foot-acc-link .material-symbols-outlined { font-size: 16px; color: #222; font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 20; }

/* 결제수단 목록 (div/p 구조   li 간섭 없음) */
.foot-acc-paylist { margin: 12px 0 0; padding: 0; }
.foot-acc-payitem { font-size: 11px; color: #444; line-height: 2; padding-left: 12px; position: relative; margin: 0; }
.foot-acc-payitem::before { content: '-'; position: absolute; left: 0; color: #c39562; }

/* -- 이동 콘텐츠: 사이즈가이드 / 구매전 필독 쇼핑가이드 (상세 하단 아코디언 -> 푸터).
   detail.css SECTION 11 스타일을 푸터 전용 스코프(.foot-acc-body)로 이식.
   foot.css는 전 페이지 로드되므로 이 스타일이 여기 있어야 모든 페이지에서 정상 표시됨 -- */
.foot-acc-body .guide-block { margin: 20px 0 10px; font-weight: 400; line-height: 1.5; font-size: 11px; color: #3b3b3b; list-style: none; padding: 0; }
.foot-acc-body .guide-block:first-child { margin-top: 0; }
.foot-acc-body .guide-block li { margin: 0; }   /* ul/li 구조: 기본 불릿·들여쓰기 제거(텍스트 앞 '·'는 수동 표기) */
.foot-acc-body .guide-block-compact { font-weight: 400; line-height: 1.5; font-size: 11px; color: #3b3b3b; word-break: keep-all; letter-spacing: 0.02em; }
.foot-acc-body .guide-block-title { padding-bottom: 5px; font-weight: bold; display: block; }
.foot-acc-body .guide-block-text { padding-bottom: 10px; }
.foot-acc-body .guide-block-highlight {  }
.foot-acc-body .guide-block-link-btn { text-align: center; background-color: #000; border-radius: 5px; padding: 10px 0; margin-top: 5px; }
.foot-acc-body .guide-block-link-btn a { color: #fff; text-decoration: none; }


/* ============================================================
   SECTION 2   로고 이미지
   html: <div class="foot-logo-wrap">
   ============================================================ */
.foot-logo-wrap { display: flex; align-items: center; justify-content: center; gap: 65px; padding: 35px 0px 0px 0px; border-top: 1px solid #c7c7c7; }
.ss-logo-dark { width: auto; height: 60px; } 
.ss-logo-anniversary { width: auto; height: 60px; } 
.foot-logo-divider { width: 1px; height: 26px; background: #d8d8d8; min-height: 50px; }


/* ============================================================
   SECTION 3   사업자정보
   html: <div class="foot-biz-info">
   ============================================================ */
.foot-biz-info { font-family: 'Lato', 'Noto Sans KR', sans-serif; padding: 35px 0px 5px 25px; font-size: 11px; color: #222; text-align: left; letter-spacing: 0.02rem; }
.foot-biz-info p { margin: 0 0 4px; }
.foot-biz-label { color: #222; }
.foot-biz-value { color: #222; padding: 0 5px; }


/* ============================================================
   SECTION 4   카피라이트
   html: <div class="foot-copyright">
   ============================================================ */
.foot-copyright { padding: 0px 0px 0px 25px; }
.foot-copyright p {     
    font-family: 'Lato', 'Noto Sans KR', sans-serif;
    font-size: 10px;
    font-weight: normal;
    text-align: left;
    color: #222;    
    letter-spacing: 0.02rem;
}

/* BASIC css end */