@media   (max-width : 1279px) { 
    
    .topHeader{
        margin: 0 auto;
        padding:20px 50px;
    }

    .gnbWrap{
        padding:24px 50px;
    }
    
    .footerTop{
        margin-left:50px;
        margin-right:50px;
      }
      .footerBottom{
        padding-left:50px !important;
        padding-right:50px !important;
      }
      #footer .footerBottom .callInfo .integrated{
        padding: 0 12px 0 0;
      }
      #footer .footerBottom .callInfo .checkup{
        padding: 0 0 0 12px;
      }
      #footer .footerBottom .integrated::after{
        display: none;
      }
}

@media (max-width:1023px) { 
    #u_skip {
        z-index: 49;
    }
    #wrap{
        /* overflow: hidden; */
    }
	#topAsideMenu h1 a.nmc_sub_name { 
	color: #fff; 
	}
    .topHeader{
        position: absolute;
        top:0;
        z-index: 51;
        width:100%;
        padding:20px;
        background-color: transparent;
    }
    .topHeader.topSticky{
        position: sticky;
        background-color: #2677bb;
    }
    .topHeader h1 .logo{
        display: none;
    }
    .topHeader h1 .wlogo{
        display: block;
    }
    .toprightHeader .reservationBtn,
    .topHeader .toprightHeader ul{
        display: none;
    }
    
    .topHeader .toprightHeader .searchBtn,
    .topHeader .toprightHeader .userBtn{
        display: block;
        border: 0;
        padding:0 10px;
        cursor: pointer;
    }
    .topHeader .toprightHeader .searchBtn span {
        display: block;
        width: 28px;
        height: 28px;
        background-image: url(../../icon/search.svg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        filter: invert(0%) sepia(98%) saturate(0%) hue-rotate(180deg) brightness(100%) contrast(100%);
    }
    .topHeader .toprightHeader .userBtn span{
        display: inline-block;
        width: 28px;
        height: 28px;
        background-image: url(../../icon/user.svg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        /* filter: invert(0%) sepia(98%) saturate(0%) hue-rotate(180deg) brightness(100%) contrast(100%); */
        filter: invert(100%) sepia(0%) saturate(7500%) hue-rotate(123deg) brightness(96%) contrast(110%);
    }
    .topHeader .toprightHeader .searchBtn.active{
        position: fixed;
        top:25px;
        right: 120px;
    }
    .topHeader .toprightHeader .userBtn.active{
        position: fixed;
        top:25px;
        right: 66px;
    }
    /* .topHeader .toprightHeader .searchBtn.active{
        position: fixed;
        right: 0;
    } */
    .topHeader .toprightHeader .searchBtn.active span{
        z-index: 52;
        filter: invert(0%) sepia(98%) saturate(0%) hue-rotate(180deg) brightness(0%) contrast(100%);
    }
    .topHeader .toprightHeader .userBtn.active{
        z-index: 52;
        filter: invert(0%) sepia(98%) saturate(0%) hue-rotate(180deg) brightness(0%) contrast(100%);
    }

    .topHeader .toprightHeader .searchBtn input{
        top: -4px;
        right: 2px;
    }
    .topHeader .toprightHeader .searchBtn i{
        top: -4px;
        right: 2px;
    }
    
    .topHeader .toprightHeader .menu-trigger{
        display: block;
        width:30px;
        height:24px;
        margin: 2px 0px 0px 10px;
    }
    .topHeader .toprightHeader .menu-trigger.active{
        position: fixed;
        top:25px;
        right: 20px;
    }
    .menu-trigger span:nth-of-type(2){
        top:10px;
    }
    .menu-trigger.active{
        z-index: 52;
    }
    .menu-trigger.active span:nth-of-type(1) {
        -webkit-transform: translateY (10px) rotate (-45deg);
        transform: translateY(10px) rotate(-45deg);
        background-color: #000;
      }
      
    .menu-trigger.active span:nth-of-type(2) {
        opacity: 0;
    }
    
    .menu-trigger.active span:nth-of-type(3) {
        -webkit-transform: translateY(-11px) rotate(45deg);
        transform: translateY(-11px) rotate(45deg);
        background-color: #000;
    }

    .topHeader .mGnbWrap{
        display: flex;
        flex-direction: column;
        /* touch-action: none; */
        overflow: hidden;
    }

    .topHeader .mGnbWrap button{
        border: 0;
        background-color: transparent;
        border: 1px solid rgba(38,119,187,.3);
        border-radius: 20px;
        padding:9px 30px 9px 24px;
        display: flex;
        align-items: center;
    }
    .topHeader .mGnbWrap button i{
        display: inline-block;
        width:18px;
        height:18px;
        margin-right:12px;
        /* filter: invert(51%) sepia(10%) saturate(3960%) hue-rotate(167deg) brightness(78%) contrast(90%); */
    }
    .topHeader .mGnbWrap a button{
        margin-right:8px;
        cursor: pointer;
    }
    .topHeader .mGnbWrap .fastReservation i{
        background-image: url("../../icon/reservation.svg");
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .topHeader .mGnbWrap .outReservation i{
        background-image: url(/styles/assets/icon/ico_reserv_p.png);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    
    .topHeader .mGnbWrap button span{
        color: #2677bb;
        font-size: 15px;
        letter-spacing: 0;
        text-align: center;
        font-weight: 700;
    }

    .topHeader .mGnbWrap.on{
       /* width:100%; */
       right:0;
    }
	.topHeader .mGnbWrap.on{
       /* width:100%; */
       right:0;
    }

    .topHeader .mGnbHeaderLeft{
        display: flex;
        padding: 20px;
    }

    .topHeader .mGnbSiteWrap{
        padding:0 20px;
        position: relative;
    }

    .topHeader .mGnbSiteWrap .swiper-wrapper{
        height:80px;
        width:160px;
    }

    .topHeader .mGnbSiteWrap .swiper-slide div{
        width:160px;
        height:80px;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: contain;
        /* display: ; */
    }
    /* HSM 20251124 .topHeader .mGnbSiteWrap .swiper-slide:nth-child(2)추가 */
    .topHeader .mGnbSiteWrap .swiper-slide:nth-child(1) div{
        background-image: url(../../icon/mlogo2.jpg);
    }
    .topHeader .mGnbSiteWrap .swiper-slide:nth-child(2) div{
        background-image: url(../../icon/mlogo8.png);

    }
    .topHeader .mGnbSiteWrap .swiper-slide:nth-child(3) div{
        background-image: url(../../icon/mlogo3.jpg);

    }
    .topHeader .mGnbSiteWrap .swiper-slide:nth-child(4) div{
        background-image: url(../../icon/mlogo4.jpg);

    }
    .topHeader .mGnbSiteWrap .swiper-slide:nth-child(5) div{
        background-image: url(../../icon/mlogo5.jpg);

    }
    .topHeader .mGnbSiteWrap .swiper-slide:nth-child(6) div{
        background-image: url(../../icon/mlogo6.jpg);

    }
    .topHeader .mGnbSiteWrap .swiper-slide:nth-child(7) div{
        background-image: url(../../icon/mlogo7.jpg);

    }
    .topHeader .mGnbSiteWrap .swiper-slide p{
        text-align: center;
    }
    
    .mGnbSiteWrap .swiper-wrapper{
        padding-bottom:15px;
    }
    .mGnbSiteWrap .swiper-scrollbar-drag{
        background: #8bb8e8;
        height:8px;
        top:-2px;
    }

    .mGnbWrap .mGnb{
        flex:1 1;
        display: flex;
        overflow: hidden;
    }

    .mGnbWrap .mGnb .mGnbD1{
        width:150px;
        background-color: #f2f2f2;
        border-right: 2px solid #000;
        overflow: auto;
    }
    .mGnbWrap .mGnb .mGnbD1 ul{
        display: flex;
        flex-direction: column;
    }
    .mGnbWrap .mGnb .mGnbD1 ul li{
        padding:20px;
        color:#000;
        font-weight: 600;
    }
    .mGnbWrap .mGnb .mGnbD1 ul li.on{
        background-color: #fff;
    }

    .mGnbWrap .mGnb .mGnbD2{
        flex: 1 1;
        overflow: auto;
        /* touch-action: auto; */
    }


    .mGnbWrap .mGnb .mGnbD2 ul{
        display: none;
        flex-direction: column;
    }
    .mGnbWrap .mGnb .mGnbD2 li{
        display: flex;
        flex-direction: column;
    }
    .mGnbWrap .mGnb .mGnbD2 li p{
        padding: 20px 20px;
    }
    .mGnbWrap .mGnb .mGnbD2 li div{
        padding: 20px 40px;
    }
    .mGnbWrap .mGnb .mGnbD2 ul.on{
        display: flex;
    }

    .mGnbWrap .mGnbCall{
        /* position: fixed; */
        bottom:0;
        z-index: 10;
        display: flex;
        width:100%;
        background-color: #fff;
    }
    .mGnbWrap .mGnbCall > div{
        width: 50%;
        display: flex;
        justify-content: center;
        padding:20px 0;
        align-items: center;
        font-weight: 500;
    }
    .mGnbWrap .mGnbCall .mainPhone i{
        display: inline-block;
        width:30px;
        height: 30px;
        background-image: url(../../icon/call.svg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        filter: invert(0%) sepia(100%) saturate(0%) hue-rotate(125deg) brightness(0%) contrast(104%);
    }
    .mGnbWrap .mGnbCall .mainPhone p{
        padding-left:5px;
    }
    .mGnbWrap .mGnbCall .mainPhone em{
        padding-left:5px;
    }
    .mGnbWrap .mGnbCall .callCenter i{
        display: inline-block;
        width:30px;
        height: 30px;
        background-image:url(../../icon/callcenter.svg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        color: black;
        filter: invert(0%) sepia(100%) saturate(0%) hue-rotate(125deg) brightness(0%) contrast(104%);
    }
    .mGnbWrap .mGnbCall .callCenter p{
        padding-left:5px;
    }
    .mGnbWrap .mGnbCall .callCenter em{
        padding-left:5px;
    }

    .gnbWrap{
        display: none;
    }

    #sideMenu{
    position: relative;
    top:auto;
    right:auto;
	z-index: 0;
    width:100%;
    min-height: auto;
    transform: none;
    border-radius: 0;
    background-color: #242424;
    border: 0;
    display: block;
    }
    #sideMenu .sideFrequency,
    #sideMenu .sideButton{
    display: none;
    }
    #sideMenu .sideMedia{
    padding:36px 45px 0;
    }
    #sideMenu .sideMedia ul{
    flex-direction: row;
    margin: 0 auto;
    width:300px;
    justify-content: space-between;
    }
    #sideMenu .sideMedia li{
    padding-bottom: 0;
    }
    #sideMenu .sideMedia li a{
    width:50px;
    height: 50px;
    filter: invert(100%) sepia(98%) saturate(0%) hue-rotate(300deg) brightness(102%) contrast(103%);
    }


    #footer .footerTop{
        width:100%;
        margin:0;
    }
    #footer .footerTop ul{
        padding-bottom:0;
        padding-top: 20px;
        flex-wrap: wrap;
        justify-content: space-between;
        width:80%;
    }
    #footer .footerTop li{
        display: inline-block;
        width:33%;
        padding:0;
        /* padding-bottom:30px; */
        margin:15px 0px;
        /* margin: 0 30px 30px; */
        text-align: center;
    }
    #footer .footerTop li:after{
        display: none;
    }
    #footer .footerBottom{
        flex-direction: column;
        padding:36px 0 33px;
    }
    #footer .footerBottom .agencyInfo{
        order: 2;
        padding-top:30px;
        width:65%;
    }
    
    #footer .footerBottom .markSite{
        order: 1;
        margin: 0 auto;
		align-items: center;
    }

    #footer .footerBottom .markWrap{
        width:40%;
        justify-content: space-around;
    }
    #footer .footerBottom .sitemap{
        width:100%;
        flex: 1 1;
    }
    .sitemap .set{
        /* width:auto; */
        max-width: 200px;
    }


  .sitemap_wrap { display:none; }

}

 
@media  (max-width:767px) { 
  


    #footer .footerBottom .markWrap{
        width: auto;
        /* justify-content: ; */
    }
    #footer .footerBottom .agencyInfo{
        width:100%;
    }
} 
@media  (max-width:699px) { 
    .sitemap .set{
        width:150px;
    }
} 
@media  (max-width:550px) { 
    .topHeader .mGnbWrap button{
        padding: 9px 10px;
    }
    .topHeader .mGnbWrap .fastReservation i{
        display: none;
    }
    .topHeader .mGnbWrap .outReservation i{
        display: none;
    }
    .topHeader .mGnbWrap button span{
        font-size:12px;
    }
    #footer .footerTop li{
        font-size:14px;
    }
    #footer .footerBottom .sitemap{
        width: 100%;
        padding-top:20px;
    }
    .sitemap .set{
        width:140px;
    }
    .sitemap .set.shortcut{
        margin:0;
    }
    #footer .footerBottom .markWrap{
        justify-content: center;
    }
    #footer .footerBottom .markSite{
        flex-direction: column;
    }
} 
@media  (max-width:479px) { 
    .mGnbWrap .mGnbCall .mainPhone i{
        width:24px;
        height:24px;
    }
    .mGnbWrap .mGnbCall .callCenter i{
        width:24px;
        height:24px;
    }
    .mGnbWrap .mGnbCall > div{
        font-size:14px;
    }
    #footer .footerTop{
        padding: 0 30px;
    }
    #footer .footerTop ul{
        width: 100%;
    }
    #footer .footerTop li{
        font-size:12px;
    }
    .footerBottom{
        padding-left: 30px !important;    
        padding-right: 30px !important;    
    }
    #footer .footerBottom .agencyInfo > div{
        flex-direction: column;
    }
    #footer .footerBottom .callInfo{
        padding: 0;
    }
    #footer .footerBottom .callInfo .integrated,
    #footer .footerBottom .callInfo .checkup{
        padding: 4px 0;
    }
    #footer .footerBottom .callInfo .checkup:after{
        display: none;
    }
    #footer .footerBottom .agencyInfo *{
        font-size: 12px;
    }
} 










