#page-container {
    position: relative;
    display: flex; 
    flex-direction:column; 
    min-height: 100dvh;
}
#page-header {
    --hd-gap : 7.6rem;
}

@media(max-width:1080px){
    #page-header {
        --hd-gap : 5rem;
    }
}
@media(max-width:600px){
    #page-header {
        --hd-gap : 8.5rem;
    }
}

@media(max-width:768px){
    #page-sub {
        display: flex;
        flex-direction: column-reverse;   
    }
}

#page-wrapper {
    flex:1;
}
#page-visual {
    margin-top: 0.4rem;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 30rem;
    text-align: center;
    color: #fff;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

@media(max-width:1080px){
    #page-visual {margin-top: 0;}
}
@media(max-width:768px){
    #page-visual {height: auto; aspect-ratio: 1/0.54;}
}


.inner {
    width: 1280px; 
    max-width:100%; 
    margin: 0 auto;
}
@media(max-width:1320px){
    .inner {padding-right: 1.5rem; padding-left: 1.5rem;}
}