/* Footer Design - White & Clean */

/* 기본 설정 */
#rb_footer {
    width: 100%;
    background-color: #fff; /* 하얀색 배경 */
    color: #666; /* 기본 텍스트 짙은 회색 */
    font-size: 14px;
    padding: 50px 0;
    margin-top: 60px;
    border-top: 1px solid #eee; /* 상단 구분선 연하게 */
    box-sizing: border-box;
}

#rb_footer .footer_inner {
    max-width: var(--rb-footer-width);
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}

/* 1. 상단 링크 (좌우 분할) */
.ft_links {
    display: flex;
    justify-content: space-between; /* 양쪽 끝 배치 */
    align-items: center;
    border-bottom: 1px solid #f5f5f5;
    padding-bottom: 20px;
    margin-bottom: 30px;
    flex-wrap: wrap; /* 창이 좁아지면 줄바꿈 허용 */
    gap: 20px;
}

/* 링크 그룹 공통 */
.ft_link_group {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: center;
}

.ft_link_group a {
    color: #666;
    text-decoration: none;
    transition: color 0.2s;
    font-size: 14px;
}
.ft_link_group a:hover {
    color: var(--rb-main-color); /* 호버 시 포인트 컬러 */
}
.ft_link_group a.bold {
    color: #222;
    font-weight: 700;
}

/* 2. 메인 컨텐츠 영역 (정보 + SNS) */
.ft_main_content {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 30px;
}

/* 좌측 정보 영역 */
.ft_info_area {
    flex: 1;
    min-width: 300px;
}
.ft_logo {
    margin-bottom: 20px;
}
.ft_logo img {
    height: 32px;
}
.ft_address {
    font-style: normal;
    line-height: 1.6;
    color: #888;
    font-size: 13px;
    margin-bottom: 15px;
}
.ft_address span {
    display: inline-block;
    margin-right: 10px;
}
.ft_copyright {
    font-size: 12px;
    color: #999;
    margin-top: 10px;
}

/* 우측 사이드 영역 (SNS + APP) */
.ft_side_area {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 20px;
}

/* SNS 아이콘 */
.ft_sns {
    display: flex;
    gap: 10px;
}
.ft_sns a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: #f5f5f5; /* 연한 회색 배경 */
    border: 1px solid #eee;
    border-radius: 50%;
    transition: all 0.2s;
}
.ft_sns a:hover {
    background: var(--rb-main-color);
    border-color: var(--rb-main-color);
    transform: translateY(-2px);
}
.ft_sns img {
    width: 18px;
    height: 18px;
    filter: grayscale(100%); /* 기본 흑백 */
}
.ft_sns a:hover img {
    filter: brightness(0) invert(1); /* 호버 시 흰색 아이콘 */
}

/* 앱 다운로드 버튼 */
.ft_app_btn button {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--rb-main-color);
    border: 1px solid var(--rb-main-color);
    color: #fff;
    padding: 10px 20px;
    border-radius: 30px;
    cursor: pointer;
    transition: all 0.2s;
    box-shadow: 2px 2px 10px rgba(0,0,0,0.1);
}
.ft_app_btn button:hover {
    background: #fff;
    color: var(--rb-main-color);
}
.ft_app_btn .icon_app img {
    width: 16px;
    height: 16px;
    filter: brightness(0) invert(1); /* 흰색 아이콘 */
}
.ft_app_btn button:hover .icon_app img {
    filter: none; /* 호버 시 포인트 컬러 아이콘 */
}
.ft_app_btn .text_app {
    font-weight: bold;
    font-size: 13px;
}

/* 반응형 (모바일) */
@media (max-width: 1024px) {
    #rb_footer {
        padding: 30px 0 80px 0;
        margin-top: 0;
    }
    .ft_links {
        flex-direction: column; /* 세로 정렬 */
        align-items: flex-start;
        gap: 15px;
    }
    .ft_link_group {
        gap: 15px;
    }
    .ft_main_content {
        flex-direction: column;
    }
    .ft_side_area {
        align-items: flex-start;
        width: 100%;
        margin-top: 20px;
        padding-top: 20px;
        border-top: 1px solid #f5f5f5;
    }
}