@charset "UTF-8";
/* CSS Document */

@media screen {

    /* #region 各Article背景 */

    .TitleBG01 {
        max-width: 710px;
        background: url(/Images/rsvbg01.png) no-repeat;
        height: 160px;
        background-size: 160px 160px;
        font-size: 26px;
        font-weight: 700;
        text-align: center;
        margin: 0 auto;
        padding:50px 20px 0 20px;
    }


    .TitleBG02 {
        max-width: 710px;
        background: url(/Images/rsvbg01.png) no-repeat;
        height: 160px;
        background-size: 160px 160px;
        font-size: 26px;
        font-weight: 700;
        text-align: center;
        margin: 0 auto;
        padding: 50px 20px 0 20px;
    }

    .TitleBG03 {
        max-width: 600px;
        background: url(/Images/rsvbg01.png) no-repeat;
        height: 160px;
        background-size: 160px 160px;
        font-size: 26px;
        font-weight: 700;
        text-align: center;
        margin: 0 auto;
        padding: 50px 20px 0 20px;
    }

    .TitleBG04 {
        max-width: 710px;
        background: url(/Images/rsvbg01.png) no-repeat;
        height: 160px;
        background-size: 160px 160px;
        font-size: 26px;
        font-weight: 700;
        text-align: center;
        margin: 0 auto;
        padding: 50px 20px 0 20px;
    }

        .TitleBG01 br, .TitleBG02 br, .TitleBG04 br {
            display: none;
        }

    .TitleBG03 br {
        display: block;
    }
    /* #endregion */

    /* #region タイトル～会社概要 */
    .container {
        position: relative;
        width: 100%;
    }

    .TitleWrap {
        position: relative;
        width: 100%;
        height: 350px;
        padding: 0;
        text-align: left;
        color: #FFF;
        background: #000 url(/images/Menu/Titlebg.jpg) center top no-repeat;
        background-size: cover;
    }

        .TitleWrap h1 {
            width: calc(100% - 40px);
            margin: 0 auto;
            padding-top: 200px;
            font-size: 34px;
        }

        .TitleWrap .TitleCome {
            width: calc(100% - 40px);
            margin: 0 auto;
            font-size: 120%;
            padding: 20px 0;
        }

    .WidthWrap {
        position: relative;
        width: 100%;
        max-width: 980px;
        margin: 0 auto;
    }

    /* #endregion */

    /* #region メニューナビ */

    .NavContents {
        position: relative;
        width: 100%;
        padding: 0 10px 0 10px;
        margin: 0 auto;
        overflow: hidden;
        background: #F4F1E9;
    }

    .menuWrap {
        width: 100%;
        margin: 0% auto;
        padding-bottom:30px;
        max-width: 980px;
        overflow:hidden;
    }

        .menuWrap ul.menunav {
            float: left;
            width: 100%;
            padding: 20px 0;
            text-align: center;
            overflow:hidden;
        }

            .menuWrap ul.menunav li {
                float: left;
                width: 33%;
                font-size: 120%;
                padding: 1px;

            }

                .menuWrap ul.menunav li a {
                    /* display: block; */
                    float: left;
                    width: 100%;
                    color: #000;
                }

    .MenuBtn {
        float: left;
        width: 100%;
        height:62px;
        border: 1px solid #eae3cf;
        padding: 20px 3px 0 3px;
        background-color: #fef4f4;
        border-radius:8px;
    }

    .onlineMenu {
        float: left;
        width: 80%;
        margin: 10px 10% 10px 10%;
        padding: 15px;
        border: 1px solid #b5b5b5;
        line-height: 160%;
        background-color:#fff;
        font-size:14px;
    }

    /* #endregion */

    /* #region メニューコンテンツ */

    .contents {
        position: relative;
        width: 100%;
        /*background: #F4F1E9;*/
    }

    .menuIntro {
        position: relative;
        width: 100%;
        max-width: 980px;
        margin: 0 auto;
        padding: 160px 0 50px;
    }

    .menuIntroCome {
        font-size: 17px;
        line-height: 160%;
        text-align: left;
        padding: 70px 20px 0 20px;
    }

    .menuIntroCome0 {
        font-size: 17px;
        line-height: 160%;
        text-align: left;
        padding: 20px 20px 0 20px;
    }

    .IntroImg {
        position: relative;
        bottom: 0;
        width: 100%;
        overflow: hidden;
    }

        .IntroImg img {
            width: 100%;
        }

    .menuBG {
        float: left;
        width: 100%;
        margin: 0 auto;
        background: linear-gradient(150deg, #F4F1E9 0%, #F4F1E9 30%, #FFF 30%, #FFF 100%);
    }

    .menuBG02 {
        float: left;
        width: 100%;
        margin: 50px auto;
        background: linear-gradient(180deg, #F4F1E9 0%, #F4F1E9 150px, #FFF 150px, #FFF 100%);
    }

    .menuConteArea {
        float:left;
        width: 100%;
        overflow:hidden;
    }

    .menuConte {
        width: 100%;
        max-width: 980px;
        margin: 0% auto;
        overflow: hidden;
        padding:0 10px;
    }

        .menuConte h3 {
            width: 100%;
            margin: 0% auto;
            padding: 50px 0 30px 0;
            font-size: 26px;
            line-height:180%;
            text-align: center;
            text-decoration: underline;
        }
    .menuConteBody {
        float: left;
        width: 100%;
        padding: 0;
        margin: 0;
        overflow:hidden;
    }
    .CourseAeraBig {
        float: left;
        width: 100%;
        padding: 5px;
        margin: 5px 0;
        border: 1px solid #333;
        background: rgba(255,255,255,0.75);
    }
    .CourseAeraHalf {
        float: left;
        width: calc(50% - 5px);
        margin: 5px 0 0 0;
        display: flex;
        justify-content: center;
        align-items: center;
        border: 1px solid #333;
        background: rgba(255,255,255,0.75);
    }
    .course {
        position: relative;
        float: left;
        width: 100%;
        padding: 30px 30px 30px 30px;
    }
    .course_w {
        position:relative;
        float: left;
        width: 50%;
        padding: 60px 30px 30px 30px;
    }
        .course_w h4, .course h4 {
            position:relative;
            font-size: 24px;
            font-weight:700;
        }
    .course_w_Img {
        float: left;
        width: 50%;
        padding: 30px 20px 30px 0;
    }
    .course_pri {
        padding:7px 0 16px 0;
        font-size: 17px;

    }
    .course_pri br {
        display:none;
    }
    .c_detail{
        width:100%;
    }
    .c_detail_dt {
        width: 100%;
        font-weight: 700;
        font-size: 15px;
        padding-bottom: 10px;
    }
    .c_detail_dd {
        width: 100%;
        padding-bottom: 3px;
        float: left;
    }
    .MenuDetail {
        float: left;
        width: 100%;
    }
    .MenuDetail dt{
        float: left;
        width: 50px;
    }
        .MenuDetail dd {
            float: left;
            width: calc(100% - 50px);
        }
    .MenuDetail2 {
        float: left;
        width: 100%;
    }

        .MenuDetail2 dt {
            float: left;
            width: 150px;
        }

        .MenuDetail2 dd {
            float: left;
            width: calc(100% - 150px);
        }

    .MenuItemList {
        float: left;
        width:100%;
        overflow:hidden;
        margin-bottom:20px;
    }

    .item {
        float: left;
        width: 94%;
        margin: 0px 3%;
        font-size: 14px;
        padding: 5px 0px;
        border-bottom: 1px dotted #333;
        font-family: "Osaka-mono", "MS Gothic", "monospace";
    }

        .item br {
            display: block;
        }

    .itemName {
        float: left;
        width: 75%;
        font-size: 14px;
        text-align: left;
        padding: 3px 0 0 0;
        line-height: 160%;
    }
    .itemPrice {
        float: right;
        width: 25%;
        padding: 3px 0 0 0;
        text-align: right;
        line-height: 160%;
    }

        .itemPrice br {
            display: block;
        }

    .itemNameTit{
        float:left;
        width:100%;
        font-size:16px;
        font-weight:700;
    }
    .itemNameCome {
        float: left;
        width: 100%;
    }
    .c_midashi {
        font-weight: 700;
        font-size: 120%;
        margin-bottom: 10px;
    }

    .box02 {
        float: left;
        width: 100%;
        padding: 5px 5px 15px 5px;
        margin: 5px 0 50px 0;
        background: #F4F1E9;
    }

        .box02 h4 {
            float: left;
            width:100%;
            text-align:center;
            font-size:18px;
            font-weight:700;
            padding:20px 0 15px 0;
        }

    .soup_Wrap {
        float: left;
        width: 80%;
        margin: 0 10%;
        padding: 0px;
    }

        .soup_Wrap .soup {
            float: left;
            width: 32%;
            margin: 0 1% 0 0;
            padding: 0px;
        }
            .soup_Wrap .soup dd {
                width: 100%;
            }
            .soup_Wrap .soup img {
                width: 100%;
            }
            .soup_Wrap .soup dt {
                width: 100%;
                font-size:16px;
                font-weight:700;
                padding-bottom:3px;
            }
            .soup_Wrap .soup .soupCome {
                width: 100%;
                font-size: 14px;
                padding-bottom: 10px;
            }


    /* #endregion */

    /* #region アラカルトメニュー */


    .AraTitle {
        position: relative;
        font-size: 130%;
        font-weight: 700;
        display: flex;
        align-items: center;
        justify-content: center;
        padding-bottom: 40px;
    }
        .AraTitle:before, .AraTitle:after {
            border-top: 1px solid #cccccc;
            content: "";
            width: 3em;
        }
        .AraTitle:before {
            margin-right: 1em;
        }

        .AraTitle:after {
            margin-left: 1em;
        }

    .AraList{
        position:relative;
        padding:0 10px;
    }

    .box03 {
        position: relative;
        float: left;
        width: 100%;
        padding: 0;
        margin: 0 0 5px 0;
        border: 1px solid #333;
        background: rgba(255,255,255,0.75);
    }
    .box03div {
        position: relative;
        float: left;
        width: 100%;
        padding: 30px 5px 10px 5px;
    }

    .menu_type {
        display: flex;
        position: absolute;
        top: -10px;
        left: 10px;
        width: 100px;
        height: 100px;
        color: #FFF;
        font-size: 150%;
        justify-content: center;
        align-items: center;
        background: #333;
    }

    .item02Title {
        float: left;
        width: 250px;
        margin: 2% 0% 0 115px;
        font-weight: 700;
        padding: 10px;
        background: #EFEFEF;
        text-align: center;
    }
    .item02 {
        float: left;
        width: 80%;
        margin: 0px 0% 0 16%;
        font-size: 90%;
        padding: 5px 0px;
        border-bottom: 1px dotted #333;
        font-family: "Osaka-mono", "MS Gothic", "monospace";
    }

    .itemNameMemo1 {
        float: left;
        width: 100%;
        font-size: 14px;
        padding:3px 0 0 0 ;
    }
    .itemNameMemo2 {
        float: left;
        width: 100%;
        font-size: 14px;
        padding: 5px 0 0 0;
    }
    .itemNameMemo3 {
        float: left;
        width: 100%;
        font-size: 12px;
        padding: 7px 0 0 0;
    }
    .itemNameMemo4 {
        float: left;
        width: 100%;
        font-size: 12px;
        padding: 2px 0 0 0;
    }
    .itemPrice2 {
        float: right;
        width: 25%;
        font-size: 14px;
        padding: 3px 0 0 0;
        text-align: right;
        line-height: 160%;
    }


    .boxrec {
        position:relative;
        float: left;
        width: 100%;
        padding: 5px;
        margin: 5px 0;
        border: 1px solid #333;
        font-size:16px;
        font-weight:700;
    }
    .FlRi {
        text-align: right;
        float: right;
        font-size: 14px;
        font-weight:normal;
    }
    /* #endregion */

    /* #region 共通操作 */
    .Notes {
        float: left;
        width: 100%;
        font-size: 12px;
        display: block;
        margin: 2px 0 0;
    }

    .Notes2 {
        float: left;
        width: 100%;
        font-size: 12px;
        display: block;
        margin: 40px 0 0 0;
        padding: 0 0 0 20px;
    }

    .Notes3 {
        float: left;
        width: 100%;
        font-size: 12px;
        display: block;
        margin: 2px 0 0;
        padding: 0 0 0 20px;
    }

    .MT30 {
        margin-top: 30px !important;
    }

    .MT30MV100 {
        margin-top: 30px !important;
    }

    .MB30 {
        margin-bottom: 30px !important;
    }

    .MB50 {
        margin-bottom: 50px !important;
    }

    .F_W {
        font-weight: 700;
        font-size: 15px;
    }

    .minh {
        height: 400px;
    }

    .rec1 {
        position: absolute;
        top: -10px;
        left: 230px;
        width: 60px;
        height: 60px;
        font-size: 11px !important;
        color: #333;
        padding: 5px;
        background: url(/Images/osusume.png) no-repeat;
        background-size: 60px 60px;
        margin: 0 0 0 0;
    }
    .rec2 {
        position: absolute;
        top: -36px;
        right:-10px;
        width:40px;
           height:40px;
        font-size: 11px !important;
        color: #333;
        padding: 5px;
        background: url(/Images/osusume.png) no-repeat;
        background-size:40px 40px;
        
        margin: 0 0 0 0;

    }
    .rec3 {
        position: absolute;
        top: -10px;
        right:-20px;
        width: 60px;
        height: 60px;
        font-size: 11px !important;
        color: #333;
        padding: 5px;
        background: url(/Images/osusume.png) no-repeat;
        background-size: 60px 60px;
        margin: 0 0 0 0;
    }

    .bg_c {
        background: #F4F1E9;
    }

    h2, h3 {
        font-weight: 700;
    }

    .LLS {
        margin-left: 10px !important;
    }

    .top_b10 {
        border-top: 10px solid #000;
        clear: both;
    }

    .BG_color {
        background-color: #f4f1e9;
    }

    /* #endregion */

    #pc-fixed-menu{
        float:left;
    }
}

@media screen and (max-width: 820px) {

    /* #region タイトル～会社概要 */

    .TitleWrap {
        position: relative;
        width: 100%;
        height: 250px;
        padding: 0;
        text-align: left;
        color: #FFF;
        background: #000 url(/images/Menu/Titlebg.jpg) center top no-repeat;
        background-size: cover;
    }

        .TitleWrap h1 {
            width: calc(100% - 40px);
            margin: 0 auto;
            padding-top: 100px;
            font-size: 34px;
        }

    /* #endregion */

    /* #region メニューコンテンツ */

    .menuIntro {
        position: relative;
        width: 100%;
        max-width: 980px;
        margin: 0 auto;
        padding: 80px 0 50px;
    }

    .TitleBG01 {
        max-width: 560px;
        background: url(/Images/rsvbg01.png) no-repeat;
        height: 160px;
        background-size: 160px 160px;
        font-size: 26px;
        font-weight: 700;
        text-align: center;
        margin: 0 auto;
        padding: 50px 20px 0 20px;
    }
        .TitleBG01 br {
            display: block;
        }

    .menuIntroCome {
        font-size: 16px;
        padding: 50px 30px 0 30px;
    }
    .menuIntroCome0 {
        font-size: 16px;
        padding: 20px 30px 0 30px;
    }

    .Breketd {
        width: 120px !important;
    }
    .Brekedd {
        width: calc(100% - 120px) !important;
    }

    .course_pri br {
        display: block;
    }

    
    /* #endregion */

    /* #region アラカルトメニュー */

    .menu_type {
        top: -80px;
        left: 5%;
    }

    .item02 {
        float: left;
        width: 90%;
        margin: 0px 0% 0 5%;
    }

    .box03 {
        margin: 80px 0 5px 0;
    }

    .item02Title {
        margin: 2% 0% 0 5%;
    }

    .MT30MV100 {
        margin-top: 100px !important;
    }

    /* #endregion */
}

@media screen and (max-width: 639px) {

    /* #region タイトル～会社概要 */

    .TitleWrap h1 {
        font-size: 34px;
    }

    /* #endregion */

    /* #region メニューナビ */

    .MenuBtn {
        font-size:14px;
    }

    /* #endregion */

    /* #region メニューコンテンツ */

    .TitleBG01 {
        max-width: 710px;
        background: url(/Images/rsvbg01.png) no-repeat;
        height: 160px;
        background-size: 160px 160px;
        font-size: 26px;
        font-weight: 700;
        text-align: center;
        margin: 0 auto;
        padding: 50px 20px 0 20px;
    }
        .TitleBG01 br, .TitleBG02 br, .TitleBG04 br {
            display: block;
        }

    .TitleBG03 br {
        display: none;
    }

    .menuConte h3 {
        font-size: 22px;
    }

    .course_w {
        float: left;
        width: 100%;
        padding: 30px 30px 30px 30px;
    }
    .course_w h4, .course h4 {
        font-size: 24px;
        font-weight: 700;
    }
    .course_w_Img {
        float: left;
        width: 100%;
        padding: 0 30px 30px 30px;
    }
    .CourseAeraHalf {
        float: left;
        width: 100%;
        margin: 5px 0 0 0;
        padding: 30px 30px 30px 30px;
        display: flex;
        justify-content: center;
        align-items: center;
        border: 1px solid #333;
        background: rgba(255,255,255,0.75);
    }
    .LLS {
        margin-left: 0 !important;
        margin-top: 10px !important;
    }
    .course {
        float: left;
        width: 100%;
        padding: 0;
    }
    .minh {
        height: auto;
    }

    .course_pri br {
        display: none;
    }

    .Breketd {
        width: 150px !important;
    }

    .Brekedd {
        width: calc(100% - 150px) !important;
    }

    .c_midashi {
        font-weight: 500;
        font-size: 16px;
    }

    .itemNameTit {
        font-weight: 700;
        font-size: 14px;
    }
    .itemName br {
        display: block;
    }
    .itemName{
      font-size:12px;
    }

    /* #endregion */
}

@media screen and (max-width: 450px) {

    /* #region タイトル～会社概要 */

    .TitleWrap h1 {
        font-size: 26px;
    }
    .TitleWrap .TitleCome {
        font-size: 16px;
    }
    .TitleWrap .TitleCome br {
       display:none;
    }

    /* #endregion */

    /* #region メニューナビ */

    .onlineMenu {
        font-size: 13px;
    }
    /* #endregion */

    /* #region メニューコンテンツ */

    .TitleBG01 {
        font-size: 20px;
    }
    .TitleBG02 {
        max-width: 710px;
        font-size: 20px;
    }
    .TitleBG03 {
        max-width: 600px;
        font-size: 20px;
    }
    .TitleBG04 {
        max-width: 710px;
        font-size: 20px;
    }
    .menuIntroCome, .menuIntroCome0 {
        font-size: 14px;
    }

    .menuConte h3 {
        font-size: 20px;
    }

    .course_w h4, .course h4 {
        font-size: 20px;
        font-weight: 700;
    }
    .c_midashi {
        font-weight: 500;
        font-size: 14px;
    }
    .course_pri {
        font-size: 16px;
    }
    .soup_Wrap {
        width: 90%;
        margin: 0 5%;
    }
        .soup_Wrap .soup dt {
            font-size: 14px;
            font-weight: 500;
        }
        .soup_Wrap .soup .soupCome {
            font-size: 12px;
        }
    .itemName {
        width: 70%;
    }
    .itemPrice {
        width: 30%;
        font-size:13px;
    }
    .boxrec {
        font-size: 14px;
        font-weight: 700;
    }
    .rec1 {
        left: 200px;
        width: 60px;
        height:60px;
        background-size: 60px 60px;
    }
    /* #endregion */

    /* #region アラカルトメニュー */
    .itemPrice2 {
        width: 30%;
        font-size: 13px;
    }
    .itemNameMemo2 {
        float: left;
        width: 100%;
        font-size: 12px;
        padding: 5px 0 0 0;
    }
    /* #endregion */
}



/* #region #### */

/* #endregion */