@import url('https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css');
@media  (min-width: 768px) and (max-width:1400px){
.gnb {
    position: absolute;	width:100%;
    margin: 20px auto;
	 margin-right:auto;margin-left:auto;z-index:2;  top:465px; display:inline-block; 
    font-family: 'NanumSquare', sans-serif;
}
}
@media (min-width:1400px){
.gnb {
    position: absolute;	width:1500px;
    margin: 20px auto;
	 margin-right:auto;margin-left:auto;z-index:2;  top:450px; display:inline-block; 
    font-family: 'NanumSquare', sans-serif;
}
}
.gnb h1 {
    display: none;
}
.gnb ul {
    width: 100%;
    display: flex;
    align-items: center;
}

.gnb li {
    display: table-cell; border-right:1px solid rgba(0,0,0,0.8); box-shadow:2px 2px 10px rgba(0,0,0,0.2);
}

.gnb li {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding:15px;
    font-size: 20px;
    background: #585858;
    color: #fff;
    text-align: center;
    text-decoration: none;
	cursor: pointer;
}


.gnb li:hover {
    background-color:#FC522F; color:#fff; border-right:1px solid #FC522F; transition: 0.3s ease-out;
}

.gnb li.active {
    cursor: pointer;
    background-color:#FC522F; color:#fff; border-right:1px solid #FC522F;
}

/* Media Query */
@media screen and (max-width: 768px) {
    .gnb {
        width:100%;
        margin: 0 auto;
    }
    .gnb h1 {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 600;
        width: 100%;
        height: 68px;
        color: #fff;
        font-size: 22px;
        background: #262626;
    }

    .gnb h1 span {
        position: absolute;
        right: 10px;
        top: 24px;
    }
    .material-symbols-outlined.icon1 {
        display: inline;
    }
    .material-symbols-outlined.icon2 {
        display: none;
    }
    .gnb ul {
        flex-direction: column;
    }
    .gnb li {
        display: none;
        width: 100%;
        font-size: 16px;
		padding:15px;
        border-left: none;
        border: none;
    }

    .material-symbols-outlined {
        font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 48;
    }
}


ol,
ul {
    list-style: none;
}
blockquote,
q {
    quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}