@charset "UTF-8";

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
/*fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,*/
fieldset, form, label, legend, caption,
article, aside, dialog, figure, footer, header, hgroup, menu, nav, section, menu, time, mark, audio, video {
	margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background-color:transparent;
}
.cf:before, .cf:after { content: " "; display: table; }
.cf:after { clear: both; }
.cf { *zoom: 1; }

/* ----------------------------------------------------------- */

html,body{
    width: 100%;
    height: 100%;
}

body{
    display: flex;
    font-size: 14px;
    font-family: "Osaka", "ＭＳ ゴシック", sans-serif;
    -webkit-font-smoothing: none;
    background-image: url(../img/menu_bar.png), url(../img/main_bg.jpg);
    background-size: 4px auto, 800px auto;
    background-repeat: repeat-y, repeat;
    background-position: 196px 0px, left top;
}

#wrapper{
    display: inline-flex;
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
}

/* /////////////////////////////////////// 
// FONT
// //////////////////////////////////// */
@font-face {
    font-family: "myFont";
    src: url("../font/morinaga.woff") format('woff');
}

/* /////////////////////////////////////// 
// SIDE MENU
// //////////////////////////////////// */

#sidemenu{
    width: 200px;
    height: 100%;
    position: relative;
    text-align: center;
}

#sidemenu .logo{
    width: 150px;
    margin: 0 auto;
    padding: 16px 0 8px 0;
}

#sidemenu .logo img{
    width: 100%;
}

#sidemenu #vbar{
    width: 4px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
}

#sidemenu .bnr_welcome img{
    width: 70px;
    margin: 0 0 10px 0;
}

#sidemenu .bnr_room img{
    width: 120px;
    margin: 0 0 10px 0;
}

#sidemenu .bnr_welcome_txt,
#sidemenu .bnr_room_txt{
    font-style: italic;
    font-weight: bold;
}

#sidemenu .link_txt{
    font-size: 12px;
    font-style: italic;
}

#sidemenu #menu li{
    list-style: none;
    width: 130px;
    height: 50px;
    margin: 2px auto;
    background-image: url(../img/btn_base.png);
    background-size: 130px auto;
    background-repeat: no-repeat;
    background-position: center center;
}

#sidemenu #menu li img{
    visibility: hidden;
}

#sidemenu #menu li a{
    font-family: "MS P明朝", "MS PMincho", "MS 明朝", serif;
    font-size: 20px;
    font-style: italic;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    line-height: 50px;
    color:#7c2828;
    width: 126px;
    height: 49px;
    display: block;
    text-shadow: 2px 3px 3px #fadaa8;
}

/* /////////////////////////////////////// 
// Content
// //////////////////////////////////// */

#content{
    height: 100%;
    overflow-y: scroll;
}

#content.main{
    width: 100%;
    background-image: url(../img/main_bg.jpg);
    background-size: 1000px auto;
    background-position: center;
}

#content.room,
#content.greeting,
#content.staff,
#content.drink,
#content.access,
#content.contact{
    width: calc(100% - 200px);
    background-image: url(../img/room_bg.jpg);
    background-size: 800px auto;
}

#content .ttl,
#tryfont .ttl{
    display: block;
    width: 100%;
    height: 64px;
    line-height: 64px;
    font-size: 32px;
    font-family: "MS P明朝", "MS PMincho", "MS 明朝", serif;
    font-style: italic;
    text-align: center;
    color:#7c2828;
    padding: 6px 0;
    margin: 0;
    padding: 0;
    text-shadow: 2px 3px 3px #ffffff;
}