@media (max-width:1850px) {
    .wide-layout {
        width: 100%;
        padding: 0 1rem;
    }

    #logo {
        left: 1rem;
    }
    
}

@media (max-width:1600px) {

        
    html {
        font-size: 16px;
    }


    #header {
        height: 5rem;
    }

    #gnb ul li {
        line-height: 5rem;
    }

    #logo a {
        width: 15rem;
    }
}

@media (max-width:1240px) {
    .layout {
        width: 100%;
        padding: 0 1rem;
    }

    /* footer */

    .sns {
        right: 1rem;
    }
}

@media (max-width:1000px) {
    html {
        font-size: 14px;
    }
}

@media (max-width:768px) {

    
    #header {
        height: 4rem;
    }

    #gnb {
        position: fixed;
        top: 0;
        left: 0;
        padding-right: 0;
        transition: ease 0.3s;
        z-index: -1;
        opacity: 0;
    }

    #gnb.active {
        top: 4rem;
        opacity: 1;
    }

    #gnb ul {
        table-layout: fixed;
        width: 100%;
        background: #fff;
    }

    #gnb ul li {
        line-height: 4rem;
    }

    .header-right .all-menu {
        display: block;
        width: 2.4rem;
        height: 2.4rem;
    }

    .header-right .all-menu i {
        line-height: 2.4rem;
        transition: all 0.3s;
    }

    .header-right .all-menu.active i {
        transform: rotate(90deg);
    }

    /* footer */


    .footer1 ul li a {
        padding: 1rem 0;
    }

    .footer2 {
        padding: 1.5rem 0;
        position: relative;
    }

    .sns {
        position: relative;
        top: inherit;
        transform: inherit;
        left: 0;
        margin-top: .5rem;
    }

    .sns li {
        margin-left: 0;
        margin-right: .4rem;
    }

	/* popup */

	.pi-popup {
		left:5% !important;
		max-width:90% !important;
		width:auto !important;
		height:auto !important;
	}

	.pi-popup .pi-popup-container {
		width:100% !important;
		height:auto !important;
	}
    
}

@media (max-width:510px) {
    html {
        font-size: 13px;
    }
}