@charset "utf-8";
@media screen and (max-width: 480px) {
    /* default */
    @viewport {
        width: device-width;
    }
    body {
        font-size: 16px;
        padding: 0;
        margin: 0;    
        line-height: 1;
        min-width: 100%;
    }
    img {
        max-width: 100%;
        height: auto;
    }
    .spNo {
        display: none;
    }
    .pcNo {
        display: block;
    }
    .pcNoInline {
        display: inline;
    }
    
    table th {
        width: 5em;   
    }
    img.floatL, .floatL img {
      float: none;
      margin-right: 0;
    }
    img.floatR, .floatR img {
      float: none;
      margin-left: 0;
    }
    img.alignleft {
      float: none;
      margin-right: 0;
    }
    img.alignright {
      float: none;
      margin-left; 0;
    }
    .captionR {
        padding-right: 0;
    }
    /***
    contents, header, slider
    ***/
    #contents, .headerTopWrap, .footerWrap {
        width: 100%;
    }
    header {
        background-color: white;
    
        position: relative;
}
    .headerTop {
        background-image: none;
    }
    .headerTopWrap {
        padding: 20px 0;
    }

    .headerTopWrap h1, .headerTopWrap .logo {
    margin-left: 10px;
    margin-bottom: 0px;
}
    .headerTopWrap h1.logo_text a, .headerTopWrap .logo.logo_text a {
    line-height: 34px;
        
}
    .headerTopWrap p.description {
        display: none;
    }
    .snsArea {
        position: absolute;
        top: 64px;
        right: 0;
    
        display: none;
        z-index: 9999;
        background-color: #fefefe;
        width: 100%;
        padding: 7px 0;
        text-align: right;
        border-top: 1px solid #eee;
        border-bottom: 1xp solid #eee;
}
    .slider {
        /* margin-top: -50px; */
        height: auto;
    }
    .rslides li {
        height: 330px;
    }
    .rslides img {
        height: 100%;
    }
    .rslides_tabs {
        display: none;
    }
    header nav, .archive header nav {
        width: 100%;
        height: 40px;
        margin: 0 auto;
    
        float: none;
        text-align: center;
        position: absolute;
        z-index: 9999;
        top: 111px;
        display: none;
}
    header i.menu_button {
        width: 40px;
        height: 40px;
        line-height: 40px !important;
        margin: 0px auto 0;
        position: absolute;
        top: 16px;
        right: 10px;
        background-color: #5a5a5a;
        float: none;
        border-radius: 100%;
        color: #fff;
        cursor: pointer;
        text-align: center;
        display: inline-block;
}
    header nav ul {
    
        width: 100%;
        position: relative;
        left: 0;
}
    header nav li {
        width: 100%; 
        margin: 0;
        float: none;
        background-color: #fefefe;
        border-bottom: 1px solid #eee;
}
    header nav li ul li:last-child {
        border-bottom: none;
    }
    
    header nav li ul.sub-menu {
    position: static;
        
    padding-top: 0;
    border-top: 1px solid #eee;
}
    header nav li ul.sub-menu li a {
        font-size: 12px;
    
        font-size: 0.750em;
}
    header nav li:hover {
        /* background-color: transparent; */
        /* background-image: url(../images/sp/bgMenu.png); */
    }
    header nav .menu {
        background-position: 0 2px;
    }
    header nav .course {
        background-position: 0 -53px;
    }
    header nav .shop {
        background-position: 0 -108px;
    }
    header nav .company {
        background-position: 0 -163px;
    }
    header nav .product {
        background-position: 0 -218px;
    }
    header nav li a {
        width: auto;
    }
    /***
    bannerArea
    ***/
    .top_message {
        padding: 0 20px;
    }
    .news {
        margin: 0 auto 30px;
        padding: 0 20px;
    }
    .news h2 {
        background-size: 90%;
    }
    .news h2 img {
        width: 75%;
    }
    .newsArea {
        padding: 1em 0 1em;
        max-height: none;
        font-size: 0.75em;
    }
    .newsArea dt {
        padding: 0; 
        border-bottom: none;
    
        margin: 1.5em 0;
}
    .newsArea dd {
    margin: -4em 0 0;
    }
    .newsArea dd a {
        padding: 1.5em 0 1.5em 8em;
        border-bottom: 1px solid #eee;
        /* margin: -2.5em 0 0em; */
        display: block;
    }
    .newsArea p {
        margin-top: 0;
    }
    .bannerArea {
        margin: 0 auto 60px;
        padding: 0 20px;
    }
    .bannerArea img {
        margin: 0 0px 60px;
    }
    .bannerArea a.more {
        width: auto;
    }

    /***
    footer
    ***/
    footer {
        padding-top: 0;
    }
    a#toTop {
        top: -22px;
    }
    .footerWrap nav {
        float: none;
    }
    .footerWrap nav ul {
        float: none;
        width: 100%;
        padding: 0;
        height: auto;
        border-right: none;
    }
    .footerWrap nav li {
        margin: 0;    
        border-bottom: 1px solid #eee;
        float: none;
    }
    .footerWrap nav li a {
        text-decoration: none;
        display: block;
        padding: 1.25em 1em 1.25em;
    
        background-color: #fefefe;
}
    .footerWrap nav ul.lastChild li.lastChild {
        border-bottom: none;
    }
    .footerWrap nav li ul {
        border-top: 1px solid #eee;
    }
    .footerWrap nav li ul li {
        margin-top: 0;
    }
    .fLogo {
        float: none;
        text-align: center;
    }
    .fLogo img {
        width: 79px;
    }
    /***
    page common
    ***/
    .page header, .archive header, .single header {
        background-color: white;
        text-align: left;
    
        position: relative;
}
    .page .headerTop, .archive .headerTop, .single .headerTop {
        /* display: none; */
    }
    header .pcLogo {
        display: none;
    }
    header .spLogo {
        display: inline;
    }
    header img.logo {
        padding: 6px 0 3px 8px;
        margin: 0;
    }
    .page header nav ul.lastChild li.lastChild, .archive header nav ul.lastChild li.lastChild, .single header nav ul.lastChild li.lastChild {
        border-bottom: none;
    }
    .wrapperOut {
        background-image: none;
    }
    .wrapper {
        background-image: none;
    }
    .ttlArea {
        background-image: none;
        padding: 12px 22px 10px 14px;
    
        margin-bottom: 40px;
}
    .ttlArea h1 {
        background-image: none;
        padding-bottom: 0;
    }
    .ttlArea h1 img {
        width: auto;
    }
    .page .main, .archive .main, .single .main {
        margin: 0 10px;
    }
    .wrapperBottom {
        display: none;
    }
    /***
    menu page
    ***/
    .page.menu .main {
        margin-top: 30px;
        position: relative;
    }
    .menuTab {
        left: -1px;
        top: -32px;
        margin-bottom: 0;
        position: absolute;
    }
    .menuTab li {
        background-size: 280px;
        width: 88px;
        height: 33px;
    }
    .menuTab li a {
        width: 87px;
        height: 30px;
        margin-left: 0px;
        margin-top: 2px;
    }
    .menuTab li.lunch {
        background-position: -97px 0;
    }
    .menuTab li.drink {
        background-position: -192px 0;
    }
    .menuTab li.dinner {
        background-position: -1px 0;
    }
    .menuArea ul {
        width: auto;
        float: none;
    }
    .menuArea .price {
        padding-bottom: 0;
    }
    .menuArea .reco .price {
        background: none;
    }
    .menuArea li img {
        float: none;
        margin-right: 0;
    }
    .menuArea .normal {
        width: auto;
        float: none;
        margin-right: 0;
        margin-bottom: 0;
    }
    .menuArea .normal h2 {
        width: 49%;
        float: right;
    }
    .menuArea .normal li img {
        margin-right: 10px;
        width: 49%;
        float: left;
    }
    .menuArea .normal li {
        width: 100%;
        background-position: 135% bottom;
        background: none;
        border-bottom: 1px solid #865d25;
    }
    .menuArea .reco li {
        padding-bottom: 10px;
    }
    .menuArea .reco li img {
        margin-bottom: 10px;
    }
    .menuArea .reco h2 {
        margin-bottom: 0;
    }
    .menuArea .text .price {
        margin-top: auto;
        margin-bottom: 1em;
    }
    .menuArea .text li h3 {
        width: auto;
        margin-bottom: 0.5em;
    }
    /***
    shop page
    ***/
    .shopArea .slide {
        width: 100%;
    }
    .shopArea .snsArea {
        position: static;
    }
    .shopArea table {
        width: 100%;
    }
    /***
    company page
    ***/
    .formArea tr, .formArea th, .formArea td {
        display: block;
    }
    .formArea table th {
        width: 100%;
        border-bottom: none;
    }
    .formArea table td {
        padding-bottom: 2em;
    }
    .formArea table input, .formArea table select, .formArea table textarea {
        max-width: 100%;
        width: 100%;
    }
    .formArea table input[type="checkbox"] {
        width: auto;
    }
    /***
    product page
    ***/
    .rayuImg p {
        display: inline;
    }
    /***
    blog page
    ***/
    .entryLink div {
        padding-left: 0;
    }
    .archive .entryLink h2 {
        margin-left: 65px;
        background-size: 100%;
    }
    aside .summary section {
        width: 100%;
        float: none;
        margin-right: 0;
        margin-bottom: 40px;
    }
    .archive aside h3, .single aside h3 {
        margin-bottom: 20px;
    }
    .ttlArea h1, p.logo {
        background-size: 100%;
    }
    .entryLink figure {
        margin-right: 20px;
    }
    .entryLink figure img {
        width: 100px;
    }
    /***
    staff page
    ***/
    .staff_area {
        text-align: center;
    }
    .staff_area img {
        margin: 0;
    }
    .staff_area .staff_content {
        max-width: 100%;
        margin: 0;
    }

@media screen and (min-width: 640px) and (max-width: 1024px) {
    @viewport {
        width: 980px;
    }
}
}