.locales {
    float: right!important;
}

.locales:hover {
    background-color: inherit !important;
}


.locales-href {
    /* TOOD: 반응형 추가해 줘야함 */
    font-size: 1rem;
    line-height: 2.0;
}

.w3-third img{
    margin-bottom:-6px;
    opacity:1;
    cursor:pointer
}
.sidebar{
    background-color:#000000b8
}
.profile-name {
    font-size: 32px;
    color:#fff
}
.profile-name:focus{
    color:#fff;
    text-decoration:none
}
.profile-name:visited{
    color:#fff;
    text-decoration:none
}
.profile-name:hover{
    color:#fff;
    text-decoration:none
}
.nav-category-key{
    color:#fff;
    text-align:left;
    font-size:18px
}
.nav-category-name {
    font-size: 15px;
    padding-left:30px!important
}

.nav-category-key:hover{
    color:#000!important;
    background-color:rgb(84, 84, 84, 0.550)!important
}
.nav-category-name:hover{
    color:rgb(255,255,255)!important;
    background-color:rgb(84, 84, 84, 0.550)!important
}
.nav-category-name,.nav-category-key a{
    color:#fff
}
.nav-category-name:hover,.nav-category-key .profile-name:hover{
    color:#fff;
    text-decoration:none;
    background-color:transparent
}
.profile-name:link{
    text-decoration:none
}
.profile-name:visited{
    text-decoration:none
}
.profile-name:hover{
    text-decoration:underline
}
.profile-name:active{
    text-decoration:underline
}
.background-red{
    background-color:#e4211b
}
p,span,h1 h2,h3,h4,h5,a{
    font-family: 'Noto Sans', sans-serif;
}
.slide-backgorund-red{
    color:#000!important;
    background-color:rgba(107, 107, 107, 0.550)!important
}
.header-span{
    line-height: 1.6 !important;
    padding-left:50px!important;
}

#mySidebar{
    z-index:3;
    width:380px;
    font-weight:200;
    right:0;
    display:none;
}

#mySidebar>.flex{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

#mySidebar>.flex>.flex-top>h1{
    padding-top:30px;
    padding-bottom:20px;
    padding-left:25px
}
#mySidebar>.flex>.flex-top>h1>.profile-name{
    text-decoration:none;
    background-color:transparent
}
#mySidebar>.flex>.flex-top>h1>.profile-name:hover{
    text-decoration:none;
    color:#fff;
    background-color:transparent
}
.nav-category-key:hover{
    color:#fff!important
}
.nav-category-key a:hover{
    color:#fff!important
}

.w3-main>.page-content-margin{
    margin-top:83px
}
header{
    height:100px
}
header>span{
    font-size: 38px;

}
header>span>a{
    text-decoration:none;
    line-height: 2;
    color:#000
}

.center-fit{
    max-width:100%;
    width:100%;
    max-height:100vh;
    margin:auto;
    height:calc(100vh - 80px)
}

@media (max-width:1200px){
    #mySidebar{
        width:330px
    }
    #mySidebar>.flex>.flex-top>h1{
        padding-top:30px;
        padding-bottom:20px;
        padding-left:25px
    }
    #mySidebar>.flex>.flex-top>h1>.profile-name:hover{
        text-decoration:none;
        background-color:transparent
    }
}

@media (max-width:767.98px){
    header {
        padding-left: 26px !important;
    }
    .header-span{
        padding-left:20px
    }
    .w3-main>.page-content-margin{
        margin-top:70px
    }
    .center-fit{
        height:calc(100vh - 70px)
    }
    header{
        height:70px
    }
    header>.header-span{
        font-size:2rem
    }
    header>.header-span{
        padding-left:5px!important
    }
    header>.w3-button{
        font-size:24px;
        padding:10px 10px
    }
    .locales {
        padding: 8px 10px 10px 10px !important;
    }
    header>span>a{
        line-height: 1.5;
    }
}
@media (max-width:575.98px){
    #mySidebar{
        width: 260px
    }
    body>nav>h1{
        font-size:1.55rem;
        padding-top:10px;
        padding-bottom:10px
    }
    body>nav>hr{
        margin-top:10px;
        margin-bottom:10px
    }
    body>nav .nav-category-name,body>nav .nav-category-key{
        font-size: 16px;
        padding:5px 20px
    }
    .w3-bar-block .w3-bar-item{
        padding:5px 20px
    }
    .w3-main>.page-content-margin{
        margin-top:70px
    }
    .center-fit{
        height:calc(100vh - 70px)
    }
    header{
        height:70px
    }
    header>.header-span{
        font-size:2rem
    }
    header>.header-span{
        padding-left:5px!important
    }

    .locales-href {
        line-height: 2.5;
    }
}