#headerWrapper {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: auto;
    z-index: 9999;
}

#headerWrapper::before {
    content: '';
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 72px;
    background-color: #fff;
}

@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) {
    #headerWrapper::before {
        background-color: hsla(0, 0%, 100%, 0.5);
        -webkit-backdrop-filter: blur(16px);
        backdrop-filter: blur(16px);
    }
}

#headerWrapper.active::before{
    background-color: #fff;
}

#headerWrapper .inner {
    width: 100%;
    font-size: 1.4em;
    font-weight: 500;
    height: 72px;
}

#headerWrapper .inner .logo {
    height: 20px;
    width: 95px;
}

#headerWrapper .inner em {
    margin: 0px 4px;
}

#headerWrapper .inner a.active{
    text-decoration: underline;
}

#headerWrapper .mobileMenu,
#headerWrapper .inner .mobileMenuBtn {
    display: none;
}

#footerWrapper {
    padding: 40px 0px;
    border-top: 1px rgba(0, 0, 0, 0.1) solid;
    background: #F3F3F4;
}

#footerWrapper .logoBox {
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px rgba(0, 0, 0, 0.1) solid;
    text-align: center;
}

#footerWrapper .logoBox p{
    margin-top: 12px;
    font-size: 1.6em;
}

#footerWrapper .logoBox p em{
    font-family: 'HostGrotesk', sans-serif !important;
}

#footerWrapper .inner {
    text-align: center;
    line-height: 1.9;
}

#footerWrapper .inner br{
    display: none;
}

#footerWrapper .inner:nth-child(3){
    margin:12px 0px;
}

#footerWrapper .inner span {
    font-size: 1.4em;
    display: inline-block;
    vertical-align: middle;
}

#footerWrapper .inner em {
    vertical-align: text-bottom;
    display: inline-block;
    width: 1px;
    height: 13px;
    background: #000;
    margin: 0px 7px;
}

#footerWrapper .inner > a {
    font-size: 1.4em;
    border-bottom: 1px #000 solid;
    line-height: 1;
    margin: 0px 10px;
}

#footerWrapper .inner:nth-child(2) > a{
    border-bottom: 0px;
    margin:0px;
    padding:0px 16px;
    font-weight: 500;
}

#footerWrapper .inner:nth-child(2) > a:first-child::after{
    content: '';
    position: absolute;
    right: 0px;
    top: 50%;
    width: 1px;
    height: 16px;
    background: rgba(0, 0, 0, 0.1);
    transform: translateY(-50%);
}

#footerWrapper .inner p{
    width: 100%;
}

@media screen and (max-width:1080px) {
    #headerWrapper::before {
        height: 56px;
    }

    #headerWrapper .mobileMenu {
        position: absolute;
        width: 100%;
        height: calc(100vh - 56px);
        left: 0px;
        top: 56px;
        background-color: #fff;
    }

    @supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) {
        #headerWrapper .mobileMenu {
            background-color: hsla(0, 0%, 100%, 0.5);
            -webkit-backdrop-filter: blur(16px);
            backdrop-filter: blur(16px);
        }
    }

    #headerWrapper.active .mobileMenu{
        background-color: #fff;
    }

    #headerWrapper .mobileMenu ul {
        padding: 20px 12px 0px;
        border-top: 1px rgba(0, 0, 0, 0.1) solid;
    }

    #headerWrapper .mobileMenu ul li {
        margin-bottom: 10px;
    }

    #headerWrapper .mobileMenu a {
        font-size: 4.8em;
        font-weight: 500;
    }

    #headerWrapper .inner {
        height: 56px
    }

    #headerWrapper .inner .flexBox4,
    #headerWrapper .inner .contactBtn {
        display: none;
    }

    #headerWrapper .inner .mobileMenuBtn {
        display: block;
        width: 20px;
        height: 20px;
    }

    #headerWrapper .inner .mobileMenuBtn.active span:first-child {
        transform: translate(-50%, -50%) rotate(90deg);
    }

    #headerWrapper .inner .mobileMenuBtn span {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 2px;
        height: 20px;
        background: #000;
        transition: all 0.3s;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
    }

    #headerWrapper .inner .mobileMenuBtn span:last-child {
        transform: translate(-50%, -50%) rotate(90deg);
    }

    #footerWrapper{
        padding:40px 8px;
    }

    #footerWrapper .logoBox {
        text-align: left;
    }

    #footerWrapper .logoBox  p{
        font-size: 1.4em;
    }

    #footerWrapper .inner,
    #footerWrapper .inner p {
        text-align: left;
        display: block;
    }

    #footerWrapper .inner > a{
        margin: 0px;
        margin-right: 16px;
        font-size: 1.2em;
    }

    #footerWrapper .inner:nth-child(2) > a:first-child{
        padding-left: 0px;
    }

    #footerWrapper .inner:nth-child(2) > a:first-child::after{
        height: 14px;
    }

    #footerWrapper .inner em{
        display: none;
    }

    #footerWrapper .inner br{
        display: block;
    }

    #footerWrapper .inner span{
        font-size: 1.2em;
    }
}