/*** responsive ***/
@media print, screen and (max-width: 1400px) {
    nav .main_nav a{
        width: 14%;
    }

    #slider_section .slider .slider_cont{
        padding-bottom: 3%;
    }
    #slider_section .slider .slider_cont p{
        width: 90%;
    }
}

@media print, screen and (max-width: 1200px) {
    #location_section .direc_holder ul{
        width: 32%;
        margin-right: 1%;
    }
}

@media print, screen and (max-width: 1024px) {
    nav .mobile_menu{
    	display: inline-block;
    }
    nav .main_nav{
	    width: 200px;
	    height: 100%;
	    position: fixed;
	    top: 0;
	    right: -250px;
	    margin: 0;
	    background: #ffffff;
        box-shadow: 0 0 20px rgba(0,0,0,0.5);
    }
    nav .main_nav a{
        margin: 10% 0;
        display: block;
        width: 100%;
        font-size: 16px;
    }
    nav .main_nav a:first-child{
    	margin-top: 7rem;
    }
    nav .main_nav a.logo{
    	display: none;
    }
    nav .main_nav a.nav:hover{
	    opacity: 0.3;
	    padding-bottom: 0;
	}
    nav .logo_mobile{
    	display: inline-block;
    }

    #home_section{
        padding-top: 6rem;
    }
    /* #home_section .banner_holder{
        width: 100%;
        padding-bottom: 45%;
    } */

    #slider_section .slider .slider_img, #plan_section .plan .plan_img{
        margin-right: 2%;
    }
    #slider_section .slider .slider_cont img.icon{
        width: 30%;
    }
    #slider_section .slider .slider_cont, #slider_section .slider_indi_holder, #plan_section .slider_indi_holder, #plan_section .plan .plan_cont{
        width: 45%;
    }
    #slider_section .slider .slider_cont h1, #plan_section .half_plan .plan_cont h1{
        font-size: 2.3vw;
    }
    #slider_section .slider .slider_cont h2, #plan_section .half_plan .plan_cont h2{
        font-size: 1.6vw;
    }
    #slider_section .slider .slider_cont p{
        font-size: 14px;
    }

    #gallery_section ul li{
        width: 12%;
    }
    #gallery_section ul li:nth-child(5n+5), #gallery_section ul li:nth-child(5n+6){
        margin: 0 1% 1%;
    }
    #gallery_section ul li:nth-child(7n+7){
        margin-right: 0;
    }

    #plan_section .plan .plan_cont{
        padding: 1% 0 0;
    }
    #plan_section .plan .plan_cont ul{
        margin: 2% 0 0;
        margin-right: 10%;
    }
    #plan_section .plan .plan_cont ul:nth-child(4){
        margin-right: 0;
    }
    #plan_section .plan .plan_cont ul li{
        margin-bottom: 2px;
    }
    #plan_section .plan .plan_cont ul li p{
        font-size: 1.2vw;
    }

    #location_section .direc_holder{
        text-align: left;
    }
    #location_section .direc_holder ul{
        width: 44%;
        margin-bottom: 5%;
        margin-right: 5%;
    }
    #location_section .direc_holder ul:last-child{
        margin-bottom: 0;
    }

    .register_form .fill_holder .fill_checkbox_title{
        width: 90%;
    }

    #contact_section .contact_right{
        width: 75%;
    }
    #contact_section .contact_right .info1, #contact_section .contact_right .info2{
        width: 27%;
        padding-right: 2%;
    }
    #contact_section .contact_right .info3{
        width: 35%;
    }
    #contact_section .contact_right .info1 p.note{
        font-size: 0.9vw;
    }
    #contact_section .contact_right .info1 h5{
        font-size: 1.5vw;
    }
    #contact_section .contact_right .info1 p, #contact_section .contact_right .info1 p span{
        font-size: 1.1vw;
    }
    #contact_section .contact_right .info2 h3{
        font-size: 1.8vw;
    }
    #contact_section .contact_right .info3 h3{
        font-size: 1.4vw;
    }
    #contact_section .contact_right .info3 a{
        width: 11%;
    }
    #contact_section .contact_right .info2 h4{
        font-size: 1.6vw;
    }
    #contact_section .contact_right .info2 img{
        width: 80%;
        margin-top: 7%;
    }
    #contact_section .contact_right .info3 h1{
        font-size: 2.5vw;
    }
    #contact_section p.disclaimer{
        width: 80%;
    }
}

@media print, screen and (max-width: 800px) {
    #vsg_section, #vsg {
        display: none;
    }
    .mobile_show {
        display: initial !important;
    }
    ._popup .closeX{
        right: 0rem;
        top: -1.5rem;
    }
	._popup ._popup_content.content_text, ._popup ._popup_content.content_media{
    	margin-top: 15rem;
	}
    #about_section.active .facility_holder .facility_small_holder {
        max-width: 100%;
        margin-bottom: 30px;
    }

    #about_section .facility_holder .facility{
        margin: 0 5px 10px;
    }
    #about_section .facility_holder .facility img{
        min-width: 80px;
    }
    #about_section .facility_holder .facility div h5{
        font-size: 13px;
        margin-bottom: 1%;
    }
    #about_section .facility_holder .facility div p{
        font-size: 13px;
    }

    .facility-content {
        flex-direction: column;
    }
    .facility-content .column {
        width: 100% !important;
        margin-bottom: 20px;
    }
    .facility-content .column:last-child {
        text-align: center !important;
        padding-left:0 !important;
        padding-right: 0 !important;
    }
    
    .facility-content:last-child .column:first-child {
        order: 1;
        text-align: center !important;
        padding-left:0 !important;
        padding-right: 0 !important;
    } 


    #slider_section{
        padding-bottom: 100%;
    }
    #slider_section .slider .slider_img, #plan_section .plan .plan_img{
        margin: 0;
        padding-bottom: 50%;
    }
    #slider_section .slider .slider_img, #slider_section .slider .slider_cont{
        display: block;
        width: 100%;
    }
    #slider_section .slider .slider_cont, #plan_section .plan .plan_cont{
        height: 280px;
        position: relative;
        padding: 4% 0;
    }
    #slider_section .slider .slider_cont img.icon{
        margin: 0 auto 1%;
    }
    #slider_section .slider .slider_cont h1, #plan_section .half_plan .plan_cont h1{
        font-size: 4.5vw;
    }
    #slider_section .slider .slider_cont h2, #plan_section .half_plan .plan_cont h2{
        font-size: 2.5vw;
    }
    #slider_section .slider .slider_cont, #slider_section .slider_indi_holder, #plan_section .slider_indi_holder, #plan_section .plan .plan_cont, #plan_section .plan .plan_img{
        width: 100%;
    }
    #slider_section .slider_indi_holder, #plan_section .slider_indi_holder{
        top: 88%;
    }
    #slider_section .slider_indi_holder a, #plan_section .slider_indi_holder a{
        margin: 0 0.5%;
        width: 4%;
    }
    #myCarousel .carousel-indicators li,
    #myCarousel .carousel-indicators .active{
        width: 30px;
        height: 6px;
    }
    #myCarousel .carousel-indicators {
        width: 100%;
        left: 0;
        margin-left: 0;
    }

    #gallery_section ul li{
        width: 11.8%;
    }

    #plan_section{
        /*padding-bottom: 3rem;
        background-color: #f6c31d;*/
    }
    #plan_section .half_plan{
/*        padding-bottom: 100%;*/
        position: relative;
    }
    #plan_section .full_plan{
        background-color: #fff;
    }
    #plan_section .plan .plan_img{
        background-size: 90%;
        background-repeat: no-repeat;
        background-color: #fff;
    }
    #plan_section .full_plan .plan{
        background-color: transparent;
    }
    #plan_section .full_plan .plan .plan_img{
        background-color: rgba(245,194,29,0.1);
    }
    #plan_section .half_plan .plan_cont{ 
        text-align: center;
        height: 320px;
    }
    #plan_section .plan .plan_cont ul{
        text-align: left;
    }
    #plan_section .plan .plan_cont ul li p{
        font-size: 2vw;
    }
    #plan_section .plan .plan_cont .plan_img2{
        width: 90%;
        padding-bottom: 40%;
        background-size: 75%;
    }

    #location_section .google_map_holder, #virtual_section .tour_holder{
        padding-bottom: 50%;
    }
    #location_section .direc_holder{
        margin: 2% auto 0;
    }
    #location_section .direc_holder ul li h5, #location_section .direc_holder ul ol{
        font-size: 14px;
    }

    #registration_section h2{
    	font-size: 3.6vw;
    }
    #registration_section h2 img{
	    width: 21.5%;
    }
    #registration_section .register_form{
	    margin: 10% auto 0;
    	width: 75%;
    }
    .register_form .fill_holder .form_input{
    	font-size: 14px;
    }

    #contact_section .logo_mkh{
	    width: 12%;
        margin-right: 0;
        margin-bottom: 2%;
    }
    #contact_section .contact_right{
        width: 80%;
        display: block;
        margin: auto;
        text-align: center;
    }
    #contact_section .contact_right .info1{
        width: 35%;
        text-align: left;
    }
    #contact_section .contact_right .info2{
        width: 27%;
        text-align: left;
    }
    #contact_section .contact_right .info3{
        width: 28%;
        text-align: left;
    }
    #contact_section .contact_right .info1 p.note{
        font-size: 1.3vw;
    }
    #contact_section .contact_right .info1 h5{
        font-size: 1.6vw;
    }
    #contact_section .contact_right .info1 p, #contact_section .contact_right .info1 p span{
        font-size: 1.4vw;
    }
    #contact_section .contact_right .info2 h3{
        font-size: 2.2vw;
    } 
    #contact_section .contact_right .info3 h3{
        font-size: 2.2vw;
        width: 80%;
    }
    #contact_section .contact_right .info3 a{
        width: 17%;
        margin-left: 0;
    }
    #contact_section .contact_right .info2 h4{
        font-size: 1.9vw;
    }
    #contact_section .contact_right .info2 img{
        width: 90%;
        margin-top: 0;
    }
    #contact_section .contact_right .info3 h1{
        font-size: 2.7vw;
    }
}

@media print, screen and (max-width: 420px) {
    h1{
        font-size: 8vw;
    }
    h2{
        font-size: 6vw;
    }
    p{
        font-size: 14px;
    }

	._popup ._popup_content.content_text h2{
	    font-size: 5vw;
	}
	._popup .closeX{
	    right: 0;
    	top: -1.5rem;
	}

	#signupBtn{
		font-size: 12px;
	}

    /* #home_section .banner_holder{
        padding-bottom: 81%;
    } */
    /* #home_section .banner_holder .banner{
        background-size: cover;
    }
    #home_section .banner_holder .banner img{
        width: 36.5%;
        left: 53%;
    }
    #home_section .banner_holder .banner.active img{
        left: 57%;
    } */

    #about_section .facility_holder h1{
        width: 80%;
        font-size: 5.3vw;
    }

    #slider_section{
        padding-bottom: 150%;
    }
    #slider_section .slider .slider_img, #plan_section .plan .plan_img{
        padding-bottom: 70%;
    }
    #slider_section .slider .slider_cont, #plan_section .plan .plan_cont{
        height: 220px;
        padding: 8% 0;
    }
    #slider_section .slider .slider_cont img.icon{
        width: 40%;
    }
    #slider_section .slider .slider_cont h1, #plan_section .half_plan .plan_cont h1{
        font-size: 8vw;
    }
    #slider_section .slider .slider_cont h2, #plan_section .half_plan .plan_cont h2{
        font-size: 6vw;
    }

    #gallery_section .img_holder{
        padding-bottom: 70%;
    }
    #gallery_section ul li{
        width: 22%;
    }
    #gallery_section ul li:nth-child(7n+7){
        margin: 0 1% 1%;
    }
    #gallery_section ul li:nth-child(4n+4){
        margin-right: 0;
    }
    #gallery_section ul li:nth-child(5){
        margin-left: 0;
    }

    #plan_section .half_plan{
/*        padding-bottom: 155%;*/
    }
    #plan_section .plan .plan_img{
        background-size: 110%;
    }
    #plan_section .half_plan .plan_cont{
        height: 280px;
    }
    #plan_section .plan .plan_cont ul{
        margin: 5% 0 0;
        margin-right: 5%;
        width: 43%;
    }
    #plan_section .plan .plan_cont ul li p{
        font-size: 12px;
    }
    #plan_section .full_plan{
        padding-bottom: 69%;
    }
    #plan_section .full_plan .plan .plan_img{
        padding-bottom: 69%;
        background-size: 125%;
    }
    #plan_section .plan .plan_cont .plan_img2{
        padding-bottom: 50%;
        background-size: 100%;
        margin-top: 7%;
    }
    #plan_section .full_plan .slider_indi_holder {
        top: 84%;
    }

    #location_section .google_map_holder, #virtual_section .tour_holder{
        margin: 3% auto 10%;
        display: inline-block;
    }
    #location_section .direc_holder{
        margin: 5% auto 0;
        text-align: center;
    }
    #location_section .direc_holder ul{
        width: 90%;
        margin-right: 0;
    }
    #virtual_section .tour_holder{
        margin: 3% auto 0;
    }

    #registration_section .logo_register{
    	min-width: 120px;
    }
    #registration_section h2{
    	font-size: 4.6vw;
    }
    #registration_section h2 span.tgt{
    	margin: 0 3px;
    }
    #registration_section h2 img{
    	width: 25.5%;
    }
    .register_form .err_msg{
    	font-size: 10px;
    	font-weight: bold;
    }
    .register_form .fill_holder .fill_checkbox_title{
    	width: 85%;
    }

    #contact_section .logo_mkh{
    	width: 23%;
        margin-bottom: 5%;
    }
    #contact_section .contact_right .info1, #contact_section .contact_right .info2, #contact_section .contact_right .info3{
        width: 90%;
        text-align: center;
        display: block;
        margin: 0 auto 5%;
        padding-bottom: 5%;
        border-right: 0;
        border-bottom: 1px solid rgba(0,0,0,0.3);
    }
    #contact_section .contact_right .info3{
        border: none;
    }
    #contact_section .contact_right .info1 p.note{
        font-size: 12px;
    }
    #contact_section .contact_right .info1 h5{
        font-size: 16px
    }
    #contact_section .contact_right .info1 h5 span{
        font-size: 15px;
    }
    #contact_section .contact_right .info1 p, #contact_section .contact_right .info1 p span{
        font-size: 13px;
    }
    #contact_section .contact_right .info2 h3{
        font-size: 22px;
    }
    #contact_section .contact_right .info3 h3{
        font-size: 6vw;
        width: 70%;
    }
    #contact_section .contact_right .info2 h4{
        font-size: 20px;
    }
    #contact_section .contact_right .info2 img{
        width: 65%;
        margin-top: 3%;
    }
    #contact_section .contact_right .info3 h1{
        font-size: 19px;
    }
    #contact_section p.disclaimer{
    	font-size: 10px;
    }
}

@media print, screen and (max-width: 320px) {
    #slider_section{
        padding-bottom: 160%;
    }

    #plan_section{
        padding-bottom: 0.5rem;
    }
    #plan_section .half_plan{
/*        padding-bottom: 170%;*/
    }

    #location_section .direc_holder ul li h5, #location_section .direc_holder ul ol, #location_section .direc_holder ul ol p{
        font-size: 13px;
    }

    #contact_section .contact_right .info1 p span{
        display: block;
    }
}