@charset "utf-8";

/* =========================================
   [PC] #sm-footer (우측 사이드바 스타일)
   ========================================= */
#sm-footer.pc-right-sidebar {
    width: 420px; /* 사이드바 너비 */
    padding: 20px 20px 20px 30px; /* 왼쪽 여백을 좀 더 주어 본문과 간격 유지 */
    display: block;
}

/* 스크롤 시 따라오는 영역 */
#sm-footer .sticky-wrapper {
    position: sticky;
    top: 20px;
}

/* 1. 검색창 */
.footer-search {
    margin-bottom: 20px;
}
.footer-search form {
    position: relative;
    border-radius: 25px;
    background: #eff3f4;
    overflow: hidden;
}
.footer-search input {
    width: 100%;
    border: none;
    background: transparent;
    padding: 12px 20px;
    padding-right: 40px;
    font-size: 15px;
    outline: none;
}
.footer-search button {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    background: none;
    color: #536471;
    cursor: pointer;
}

/* 2. 공통 박스 스타일 */
.footer-box {
    background: #f7f9f9;
    border-radius: 16px;
    padding: 15px;
    margin-bottom: 15px;
}

/* 링크 모음 */
.footer-box.links-box {
  margin-top: 20px;
}
.footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 13px;
    color: #536471;
}
.footer-links a:hover {
    text-decoration: underline;
}
.footer-links .bold {
    font-weight: bold;
    color: #333;
}

/* 회사 정보 */
.company-info .copyright {
    font-size: 14px;
    margin-bottom: 8px;
    color: #333;
}
.company-info .details {
    font-size: 12px;
    color: #888;
    line-height: 1.4;
}
.company-info .details span {
    display: block; /* 한 줄에 하나씩 혹은 inline-block으로 조정 */
}

/* SNS 아이콘 */
.sns-box {
    display: flex;
    gap: 10px;
    background: transparent; /* 배경 없이 */
    padding: 0;
}
.sns-box a img {
    width: 24px;
    height: 24px;
    opacity: 0.6;
    transition: 0.2s;
}
.sns-box a:hover img {
    opacity: 1;
}


/* =========================================
   [Mobile] 모바일 하단 정보 (PC 숨김)
   ========================================= */
.mobile-footer {
    display: none;
    text-align: center;
    padding: 20px;
    padding-bottom: 80px; /* 하단 네비게이션바(60px) 높이만큼 여백 확보 */
    background: #f5f5f5;
    color: #999;
    font-size: 11px;
    border-top: 1px solid #eee;
}

.mf-links {
    margin-bottom: 10px;
}
.mf-links a {
    color: #666;
    text-decoration: none;
}
.mf-links .sep {
    margin: 0 5px;
    color: #ddd;
}


/* =========================================
   [Media Query] 1024px 이하 (태블릿/모바일)
   ========================================= */
@media (max-width: 1024px) {
    /* PC 사이드바 숨김 */
    #sm-footer.pc-right-sidebar {
        display: none;
    }

    /* 모바일 푸터 보이기 */
    .mobile-footer {
        display: block;
    }

    #top_btn {
      bottom: 70px;
    }
}