/* header */
.navbar {position: fixed; z-index: 999; width: 100%; height:120px;  margin-top:-15px; }/*border-bottom: 1px solid rgba(255, 255, 255, 0.8);*/

.mnlogo {display: block; position: absolute; z-index: 20; left: 40px; top:10px; width: 227px; height: 46px; transition: all 0.5s;}
.logo {position: fixed; left: 40px; z-index: 999;}
.blogo {display: none;}
.mbreser {vertical-align:middle; text-shadow: 0 1px 1px rgba(69, 69, 69, 0.3); position: absolute; top: 55px; right: 40px; z-index: 110; font-size: 12px; font-weight: bolder; text-align: center; letter-spacing: 0.025em; color: #000; transition: all .5s ease;}
.mbreser .txt{margin-left:10px; font-size: 18px; letter-spacing: -0.065em; color:#fff;} 
.mbreser i {font-size: 35px; vertical-align: middle; margin-right: 5px;}
#sticky_navs {display: block; position: fixed; width: 100%; z-index: 100; transition: all .5s ease;}
.mlogo,
.mreser {display: none;}
.mopen {position: fixed; z-index: 110; top: 0px; right: 200px; line-height: 70px; color: #fff; font-size: 15px; font-weight: bold;}
#cssmenu {position: relative; width: 100%; background: transparent !important; margin: 0 auto; }
#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #head-mobile {display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 0;}
#cssmenu:after,
#cssmenu > ul:after {content: "."; display: block; clear: both; height: 0; visibility: hidden; line-height: 0;}
#cssmenu #head-mobile {display: none;}
#cssmenu > ul {text-align: center;}
#cssmenu > ul > li {display: inline-block !important; vertical-align: top;}
#cssmenu > ul > li > a {display: inline-block; font-size: 18px; font-weight: 600; /*font-family: 'Noto Serif', serif !important;*/ line-height: 60px; /*text-transform: uppercase;*/ letter-spacing: -0.065em; color: #fff; padding: 0 30px; cursor: pointer;}
#cssmenu ul li.active a {color: #fff; text-shadow: none;}
#cssmenu ul ul {padding: 10px 0;}
#cssmenu ul ul li {-webkit-transition: all .25s ease; -ms-transition: all .25s ease; transition: all .25s ease;}
#cssmenu ul ul li:hover {}
#cssmenu:hover li > ul {left: auto;}
#cssmenu:hover li > ul > li {height: 30px;}
#cssmenu ul ul li a {display: inline-block; font-size: 13px; font-weight: normal; line-height: 30px; font-family: 'Noto Sans', sans-serif !important; letter-spacing: -0.04em; color: #fff;}
#cssmenu ul ul li:last-child > a,
#cssmenu ul ul li.last-item > a {border-bottom: 0;}
#cssmenu ul ul li:hover > a,
#cssmenu ul ul li a:hover {text-decoration: underline; color:#00b8f5; font-weight: bold;}

@media (min-width:1001px) {
	.navbar {padding: 40px 0 0; -webkit-transition: background .5s ease-in-out,padding .5s ease-in-out; -moz-transition: background .5s ease-in-out,padding .5s ease-in-out; transition: background .5s ease-in-out,padding .5s ease-in-out;}
    /*.navbar.top-nav-collapse {height: 60px; background: #fff; padding: 0;}*/
	.navbar:before {content: ''; display: block; position: absolute; top: 0; z-index: -1; width: 100%; height: 0; background: rgba(45, 45, 45, 0.9); transition: all .5s ease;}
	.navbar:hover:before {height: 270px;}
	#cssmenu > ul > li > a {min-width: 100px; text-shadow: 0 1px 1px rgba(69, 69, 69, 0.5);}
	#cssmenu > ul > li:nth-child(1) > a {} /* prologue */
	#cssmenu > ul > li:nth-child(2) > a {} /* rooms */
	#cssmenu > ul > li:nth-child(3) > a {} /* reservation */
	#cssmenu > ul > li:nth-child(4) > a {} /* special */
	#cssmenu > ul > li:nth-child(5) > a {} /* travel */
	#cssmenu > ul > li > ul {display: none !important; transition: all .5s ease;}
    .navbar:hover #cssmenu > ul > li > ul {display: block !important;}
}

@media (scroll >= 50px) {
	.navbar {padding: 0;}
}

@media screen and ( max-width:1000px ){
	.navbar {position: static; padding-top:15px; height:75px;}

    .logo,
	.blogo,
	.mbreser {display: none !important; }
    .mbreser {right: 15px; font-size: 0; line-height: 60px;}
    .mbreser i{font-size: 35px !important;}

	#sticky_navs {position: static;}
    .mlogo,
	.mreser {display: block; z-index:999;}
    .mlogo {display: flex; position: absolute; width: 100%; height: 60px; text-align: center; justify-content:center; align-items:center;}
    .mlogo a {display: inline-block;}
    .mlogo a img {width: 70%}
    .mreser {display: flex; position: absolute; right: 20px;  height: 60px; font-size: 30px; color: #2a2a2a; justify-content:center; align-items:center;}
	.tt {font-size: 15px;width:100%;}
    nav {width: 100%;}
    #cssmenu {width: 100%;}
    #cssmenu ul {width: 100%;}
    #cssmenu > ul {position: absolute; top: 60px; z-index: 999; padding: 0; display:block !important}
    /* #cssmenu > ul > li {width: 100%; float: none; border-top: 1px solid #ebebeb;}
    #cssmenu > ul > li:last-child {border-bottom: 1px solid #ebebeb;} */
    #cssmenu > ul > li:hover,
	#cssmenu ul li.active:hover,
    #cssmenu ul li.active {}
    #cssmenu > ul > li {display:inline-block !important}
    #cssmenu > ul > li > a {font-size: 15px; font-weight: normal; line-height: 250%; background: #fff; color: #000 !important; text-shadow: none !important; padding: 0 0;}
    #cssmenu > ul > li > a
    #cssmenu ul li a {}
    #cssmenu ul li a,
	#cssmenu ul ul li a {width: 100%;}
	#cssmenu > ul > li:hover > a,
    #cssmenu ul li.active a {}
    #cssmenu ul ul li,
	#cssmenu li:hover > ul > li {height: auto; text-align: center; display: inline-block}
	#cssmenu ul ul,
    #cssmenu > ul > ul > li {background: #757575 !important;}
    #cssmenu ul ul li:hover {}
    #cssmenu ul ul li a {color: #fff; padding-left: 0;}
    #cssmenu ul ul li:hover > a,
	#cssmenu ul ul li.active > a {color: #fff;}
    #cssmenu ul ul {position: absolute; left: 0; width: 100%; text-align: center; padding: 10px 0; margin: 0;}
    #cssmenu #head-mobile {display: block; font-size: 12px; font-weight: 700; color: #ddd; padding: 30px;}

    #cssmenu:hover li > ul {left: 0;}
    #cssmenu ul ul li a{min-width:65px;}

    /* .button {position: absolute; top: 0; left: 15px; z-index: 12399994; width: 25px; height: 60px; color: #000; cursor: pointer;}
    .button:after {content: ''; display: block; position: absolute; top: 27px; right: 0px; width: 25px; height: 12px; border-top: 3px solid #000; border-bottom: 3px solid #000;}
    .button:before {content: ''; display: block; position: absolute; top: 17px; right: 0px; width: 25px; height: 3px; background: #000; -webkit-transition: all .3s ease; -ms-transition: all .3s ease; transition: all .3s ease;}
    .button.menu-opened:after {top: 27px; width: 25px; height: 3px; background: #000; border: 0; -webkit-transition: all .3s ease; -ms-transition: all .3s ease; transition: all .3s ease; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg);}
    .button.menu-opened:before {top: 27px; width: 25px; background: #000; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg);} */

    .navbar {
        margin-bottom: 37px !important;
    }

    .menu-pc {
        display: none;
    }
    .menu-mobile {
        display: block !important;
    }
    .sssm {
        width: 19%;
    }
}

@media ( max-width: 767px ) {
    .mlogo img {display: inline-block; width: 70%;}
    #cssmenu > ul > li > a {font-size: 13px;}
	#cssmenu ul ul li a {font-size: 11px;}
    #cssmenu ul ul li:hover > a,
	#cssmenu ul ul li.active > a {text-decoration: none;}
}