/**
 * =========================================================
 * Layout
 * =========================================================
 */

:root{
    --header-height:72px;
}

/**
 * Header fixed 대응
 */
html{
    scroll-behavior:smooth;
}

body{
    padding-top:calc(var(--header-height) + env(safe-area-inset-top));
}

/**
 * Anchor 이동 시 fixed header에 가리지 않도록
 */
section[id],
.anchor-target{
    scroll-margin-top:calc(var(--header-height) + 24px);
}

/**
 * Page
 */
.site-wrap{
    min-height:100vh;
}

.site-main{
    width:100%;
}

/**
 * Section 공통
 */
.section{
    width:100%;
    padding:72px 24px;
}

.section-inner{
    max-width:1400px;
    margin:0 auto;
}

/**
 * Mobile
 */
@media (max-width:768px){

    :root{
        --header-height:64px;
    }

    body{
        padding-top:calc(var(--header-height) + env(safe-area-inset-top));
    }

    .section{
        padding:48px 20px;
    }

}