/*
 * responsive.css
 * 전역 레이아웃 반응형 오버라이드
 *
 * default.css의 고정폭(1440px) 선언을 뷰포트별로 유동화한다.
 * head.sub.php에서 default.css 뒤에 로드되므로 동일 우선순위에서 후순위 적용된다.
 *
 * 브레이크포인트 기준 (Figma 4프레임):
 *   base    : 360 레이아웃
 *   > 360   : 767 레이아웃
 *   > 767   : 1023 레이아웃
 *   > 1023  : 1440 레이아웃 (default.css 원본 유지)
 */

/* ── 전역: 고정폭 해제 (모든 뷰포트) ── */
#hd,
#wrapper,
#ft {
    min-width: 0;
}

#hd_pop,
#tnb .inner,
#gnb .gnb_wrap,
#container_wr,
#ft_wr {
    width: 100%;
    max-width: 1660px;
    box-sizing: border-box;
}

#container {
    width: 100%;
    max-width: 100%;
    float: none;
    margin: 0;
    min-height: 0;
    height: auto !important;
    padding: 0;
}

#aside {
    display: none;
}

#container_title {
    display: none;
}

/* ── 디자인 페이지 상단 여백 변수 ── */
:root {
    --design-page-top-padding-desktop: 30px;
    --design-page-top-padding-mobile: 30px;
}

/* ── 디자인 페이지 공통(기술사사무소/기술역량/사업분야): 상단 여백 일괄 관리 ── */
:root {
    --design-page-top-padding-desktop: 30px;
    --design-page-top-padding-mobile: 30px;
}
.about-page__inner,
.chief-page__inner,
.location-page__inner,
.performance-page__inner,
.academy-page__inner,
.advisory-page__inner,
.field-support-page__inner,
.survey-support-page__inner,
.forest-ecology-page__inner,
.forest-management-page__inner,
.forest-recreation-page__inner,
.forest-restoration-page__inner,
.landscape-page__inner {
    padding-top: var(--design-page-top-padding-desktop);
    margin-top: 0;
}

/* ── 1023 이하: 푸터 패딩 조정 ── */
@media (max-width: 1023px) {
    #ft_wr {
        padding: 60px 40px;
    }

    .ft_texts {
        max-width: 100%;
    }
}

/* ── 767 이하: 푸터 축소 ── */
@media (max-width: 767px) {
    .about-page__inner,
    .chief-page__inner,
    .location-page__inner,
    .performance-page__inner,
    .academy-page__inner,
    .advisory-page__inner,
    .field-support-page__inner,
    .survey-support-page__inner,
    .forest-ecology-page__inner,
    .forest-management-page__inner,
    .forest-recreation-page__inner,
    .forest-restoration-page__inner,
    .landscape-page__inner {
        padding-top: var(--design-page-top-padding-mobile);
    }

    #ft_wr {
        padding: 40px 20px;
    }
}

/* ── 360 이하: 최소 뷰포트 ── */
@media (max-width: 360px) {
    .ft_texts {
        max-width: 257px;
    }

    #ft_link {
        flex-wrap: wrap;
        row-gap: 10px;
    }

    .ft_address,
    .ft_copyright {
        word-break: keep-all;
    }

    #top_btn {
        margin-left: 12px;
    }
}