@charset "utf-8";

body {text-align: center; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font-size: 16px; line-height: 2.0; color: #333; -moz-font-feature-settings: "palt"; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; font-variant-ligatures: no-common-ligatures; font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; }


/* リセット*/


div,p {text-align: left; vertical-align: top; margin: 0px;}

img { border: 0px; vertical-align: top; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; }
form, button { margin:0px; padding:0px; border: 0px;}
h1,h2,h3,h4,h5,h6 {font-weight:normal; margin:0px; padding: 0px; }

/*リセット*/
ul {margin: 0; padding:0; list-style: none;}

li {margin: 0; padding:0; float:left;}
/* XHTML 高さ指定解除 */
.cl_box {clear:both;}
.cl_box hr {display:none;}
/* XHTML 高さ指定解除 */
.mb02 {margin-bottom: 2px;}
.mb05 {margin-bottom: 5px;}
.mb10 {margin-bottom: 10px;}
.mb20 {margin-bottom: 20px;}
.mb30 {margin-bottom: 30px;}
.mb40 {margin-bottom: 40px;}
.mb50 {margin-bottom: 50px;}
.mb100 {margin-bottom: 100px;}
.mb160 {margin-bottom: 160px;}

/* テキストロールオーバー */
a:link {color:#333;	text-decoration:none;}
a:visited {color:#333; text-decoration:none;}
a:hover {color: #CE002D; text-decoration:none;}

#navi a:link {color:#fff;	text-decoration: none;}
#navi a:visited {color:#fff; text-decoration: underline;}
#navi a:hover {color: #fff; text-decoration: underline;}

.txt_btn01 a:link {color:#8C8C8C;	text-decoration: none; padding: 2% 0%; border: 1px solid #cdcdcd;}
.txt_btn01 a:visited {color:#8C8C8C; text-decoration: none; padding: 2% 0%; border: 1px solid #cdcdcd;}
.txt_btn01 a:hover {color: #333; text-decoration: none; padding: 2% 0%; border: 1px solid #333;}

.txt_btn03 a:link {color:#333; text-decoration: none; padding: 2% 0%; border: 1px solid #333;}
.txt_btn03 a:visited {color:#333; text-decoration: none; padding: 2% 0%; border: 1px solid #333;}
.txt_btn03 a:hover {color: #8c8c8c; text-decoration: none; padding: 2% 0%; border: 1px solid #8c8c8c;}

a:hover img {filter:alpha(opacity=85); -moz-opacity: 0.85; opacity: 0.85;}
a img:hover {opacity: 0.8 ;}
/* テキストロールオーバー */

.js-animation {opacity: 0; visibility: hidden; transform: translateY(40px); transition: all 1s;}
.js-animation.is-show {opacity: 1; visibility: visible; transform: translateY(0px);}

.pc_no {display: none;}

/*バーがメニュー*/

.menu-btn {
    position: fixed;
    top: 10px;
    right: 10px;
    display: flex;
    height: 60px;
    width: 60px;
    justify-content: center;
    align-items: center;
    z-index: 90;
}
.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {
    content: '';
    display: block;
    height: 3px;
    width: 25px;
    border-radius: 3px;
    background-color: #111;
    position: absolute;
}
.menu-btn span:before {
    bottom: 8px;
}
.menu-btn span:after {
    top: 8px;
}
#menu-btn-check:checked ~ .menu-btn span {
    background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
}
#menu-btn-check:checked ~ .menu-btn span::before {
    bottom: 0;
    transform: rotate(45deg);
}
#menu-btn-check:checked ~ .menu-btn span::after {
    top: 0;
    transform: rotate(-45deg);
}
#menu-btn-check {
    display: none;
}
.menu-content {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 80;
	background:rgba(255,255,255,0.9);
    /*background-color: #ffffff;*/
}
.menu-content ul {
    padding: 70px 10px 0;
	
}
.menu-content ul li {
    border-bottom: solid 1px #111;
    list-style: none;
	float:none;
}



.menu-content ul li a {
    display: block;
    width: 100%;
    font-size: 15px;
    box-sizing: border-box;
    color:#111;
    text-decoration: none;
    padding: 9px 15px 10px 0;
    position: relative;
}
.menu-content ul li a::before {
    content: "";
    width: 7px;
    height: 7px;
    border-top: solid 2px #111;
    border-right: solid 2px #111;
    transform: rotate(45deg);
    position: absolute;
    right: 11px;
    top: 16px;
}
.menu-content {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 100%;/*leftの値を変更してメニューを画面外へ*/
    z-index: 80;
	background:rgba(255,255,255,0.9);
    /*background-color: #ffffff;*/
    transition: all 0.5s;/*アニメーション設定*/
}

#menu-btn-check:checked ~ .menu-content {
    left: 0;/*メニューを画面内へ*/
}


  .js-animation {
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
  }
/* コンテンツ */
#wrapper {width: 100%; text-align: center;}
#main_img {width: 100%; text-align: center; min-height: 700px; background: url("../img/mmfk_bg01.jpg") no-repeat center center; background-size: cover;}
h1#logo {text-align: center; padding: 10% 0px 0px 0px; margin: 0px 0px 2% 0px;}
#navi {text-align: center; font-size:14px; margin: 0px 0px 3% 0px;}
#sns {text-align: center; width: 165px; margin: 0px auto 3% auto;}
#sns li {width: 55px; text-align: center;}
#catch_img img {width: 100%; margin: 0px 0px 9% 0px;}
h1.tit01 {font-size: 26px; color: #333; line-height: 1.2; margin: 0px 0px 4% 0px; text-align: center;}
h1.tit01 span.tit_sub {font-size: 16px;}
h2.txt01 {font-size: 16px; margin: 0px 0px 4% 0px;}
.txt_btn01 {width: 250px; margin: 0px auto 5% auto; text-align: center;}
.txt_btn01 a {display: block;}
.line_s {border-bottom: 1px solid #dedede; margin: 0px auto 5% auto; width: 96%;}
.news_set {width: 80%; margin: 0px auto 2% auto;}
.news_set li.day {width: 30%;}
.news_set li.txt {width: 70%;}
.line_s01 {margin: 0px auto 5% auto; width: 96%;}
.product {margin: 0px auto 5% auto; width: 96%;}
#info_box {margin: 0px auto 5% auto; width: 1501px;border-left: 1px solid #dedede; border-top: 1px solid #dedede; }
#info_box li {width: 500px; box-sizing: border-box; border-bottom: 1px solid #dedede; border-right: 1px solid #dedede; text-align: center; padding:2% 0%;}
#info_box li a {display: block;}
.shop_nav {width: 440px; margin: 0px auto; }
.nav_txt01 {border: 1px solid #747474; width: 60%; margin: 0px auto; padding: 1% 0px; text-align: center; color: #747474; }

h1.tit02 {font-size: 26px; color: #333; line-height: 1.2; margin: 0px 0px 6% 0px; text-align: center;}
h1.tit02 span.tit_sub {font-size: 16px;}
.f_line_s {border-bottom: 1px solid #dedede; margin: 0px auto 3% auto; width: 96%; padding: 0px 0px 5% 0px;}
h4.shop_name {font-size: 16px; font-weight: bold;}
h5.address {font-size: 14px; font-weight: normal;}

#copy_s {width:96%; margin: 0px auto;}
#copy_l {width:400px; float: left; display: inline;}
#copy_r {width:500px; float: right; display: inline; text-align: right;}
#copy_l li {margin: 0px 0px 0px 2%;}

h1.tit03 {font-size: 26px; color: #333; line-height: 1.2; text-align: left; width: 96%; margin: 0px auto 0% auto; border-bottom: 1px solid #dedede; padding: 0% 0% 2% 0% }
h1.tit03 span.tit_sub {font-size: 16px;}
#rec_box {margin: 0px auto 5% auto; width: 1502px;border-top: 1px solid #dedede; }
#rec_box li {width: 500px; box-sizing: border-box; border-bottom: 1px solid #dedede; text-align: center;}
#rec_box li a {display: block;}


/*下層ページ　共通*/
#b_header {position: relative; background-color: #fff; text-align: center; box-shadow: 0 0 8px gray; margin: 0px 0px 3% 0px; }
#b_sns_navi {position: absolute; top:38%; right:1%; width:150px;}
#b_txt_navi {position: absolute; top:38%; left:1%; font-size: 14px;}



/*下層ページ　アクセス*/
#g_map {position: relative; width: 100%; min-height: auto; margin: 0px 0px 6% 0px;}
#map_info {position: absolute; top:5%; right :7%; width: 610px; box-shadow: 0 0 8px gray; background:rgba(255,255,255,0.7); text-align: center;padding: 2% 0px;}
#map_txt {width: 560px; margin: 0px auto;}
h1.shop_name{font-size: 20px; font-weight: bold; margin: 0px 0px 4% 0px;}
h2.shop_add{font-size: 16px; margin: 0px 0px 4% 0px;}
.txt_btn03 {width: 250px; margin: 0px 0px 6% 0px; text-align: center;}
.txt_btn03 a {display: block;}


/*下層ページ　お知らせ*/
#news_box {width: 1200px; margin: 4% auto 4% auto; padding: 4% 0% 0% 0%; background: url("../img/news_img01.jpg") no-repeat bottom right; min-height: 550px;}
#news_left {width: 650px; float: left; display: inline; }
h2.news_txt01 {font-size: 20px; border-bottom: 1px solid #dedede; padding: 0% 0% 3% 0%; margin: 0% 0% 3% 0%;}
h2.news_txt01 span.subtxt {font-size: 12px; }
h3.news_txt01 {font-size: 16px;}


/*下層ページ　ご予約*/
.con_set {width:96%; margin: 0px auto; border-bottom: 1px solid #dedede; padding: 4% 0%;}
.con_set_l {width:96%; margin: 0px auto; padding: 4% 0%;}
h2.con_txt01 {font-size: 16px; line-height: 3.0; margin: 0% 0% 3% 0%;}
.con_btn01 {text-align: center;}
span.tel_txt {font-size: 32px;}
h2.con_tit01 {font-size: 16px; line-height: 2.0; font-weight: bold;}

/*下層ページ　百福について*/

#abo_box1 {background: url("../img/about_img01.jpg") no-repeat top center; min-height: 750px; position: relative;}
ul.pagination li {float:none;}
#abo_set01 {position: absolute; top:10%; right:10%; width:400px;}
h2.about_tit {font-size: 30px; color: #ffffff; margin: 0% 0% 10% 0%;}
span.about_sub {font-size: 14px;}
h3.about_txt {font-size: 16px; color: #ffffff; line-height: 2.6;}

#abo_box2 {background: url("../img/about_img02.jpg") no-repeat  top center; min-height: 750px; position: relative;}
#abo_set02 {position: absolute; top:10%; left:10%; width:400px;}

#abo_box3 {background: url("../img/about_img03.jpg") no-repeat top center; min-height: 750px; position: relative;}
#abo_set03 {position: absolute; top:10%; right:10%; width:400px;}

#abo_box4 {background: url("../img/about_img04.jpg") no-repeat top center; min-height: 750px; position: relative;}
#abo_set04 {position: absolute; top:10%; left:10%; width:400px;}

#abo_box5 {background: url("../img/about_img05.jpg") no-repeat top center; min-height: 750px; position: relative;}
#abo_set05 {position: absolute; top:10%; right:10%; width:400px;}

#shop_in {width: 1300px; margin:0px auto 7% auto;}
#shop_l {width: 900px; float: left; display: inline;}
#shop_r {width: 360px; float: right; display: inline;}
#shop_r ul li {float: none; display: inline;}
#shop_r ul li.mb40 {margin: 0px 0px 40px 0px;}
.shop_pl {width: 1200px; margin: 0px auto 10% auto;}
.shop_pl_l {width: 290px; float: left; display: inline;}
.shop_pl_r {width: 900px; float: right; display: inline; border-left:1px solid #dedede; }
.shop_info_b {padding: 0px 0px 0px 40px}
h3.shop_titit {font-size: 16px; font-weight: bold;}
.line_set01 { border-bottom:1px solid #dedede; padding: 0px 0px 3% 0px;}
.shop_naiyo {padding: 1% 0px 0px 0px;}
.shop_naiyo li {width: 300px; padding: 2% 0px 2% 0px;}


/*下層ページ　お品書き*/
#ancher_btn {padding: 1% 0px; text-align: center; margin: 0px 0px 2% 0px;}
#course {width: 100%; text-align: center; background: url("../img/menu_tit01.jpg") no-repeat center center; background-size: cover;}
h2.menu_tit01 {color: #ffffff; padding: 3% 0px; font-weight: normal; margin: 0% 0% 3% 0%;}
.course_box {width:1500px; margin: 0px auto 10% auto;}
.course_box li {width:470px; margin: 0px 15px;}
h3.menu_midashi01 {font-size: 26px; text-align: left; padding: 0% 0% 0% 1%; margin: 0% 0% 1% 1%; }
h4.menu_tit {font-size: 20px; margin: 0% 0% 2% 0%;  }
h5.menu_txt {font-size: 16px; line-height: 2.5;}
h6.menu_price {font-size: 18px; line-height: 2.5; text-align: right;}
.set_box_m  {margin: 0% 0% 3% 0%;  }

#lunch {width: 100%; text-align: center; background: url("../img/menu_tit02.jpg") no-repeat center center; background-size: cover;}
#ippin {width: 100%; text-align: center; background: url("../img/menu_tit03.jpg") no-repeat center center; background-size: cover;}
.tan_me {margin: 0% 0% 1% 0%;}
.tan_me li.name {font-size:14px; width:70%; margin: 0px;}
.tan_me li.price {font-size:14px; width:30%; text-align: right; margin: 0px;}
#takeout {width: 100%; text-align: center; background: url("../img/menu_tit04.jpg") no-repeat center center; background-size: cover;}






@media screen and (max-width: 1199px) {
	/* 1199px以下に適用されるCSS（スマホ用） */
	
.pc_no {
    display: block;
}
.sp_no {
    display: none;
}
img {
    width :100%;
}

.mb50 {margin-bottom: 25px;}
.mb160 {margin-bottom: 50px;}
#wrapper {width: 100%; }
#main_img {width: 100%; text-align: center; min-height: auto; background: url("../img/mmfk_bg01.jpg") no-repeat center center; background-size: cover;}
h1#logo {padding: 2% 0px 0px 0px;}	
h1#logo img {width: 100px; height: 109px;}
	
h1.tit01 {font-size: 22px;}
h1.tit01 span.tit_sub {font-size: 14px;}
h2.txt01 {font-size: 14px;}
.news_set li.day {width: 100%;}
.news_set li.txt {width: 100%;}
#info_box {margin: 0px auto 5% auto; width: 98%;}
#info_box li {width: 50%;}
.shop_nav {width: 100%; margin: 0px auto; }
	
h1.tit02 {font-size: 22px;}
h1.tit02 span.tit_sub {font-size: 14px;}
.nav_txt01 {font-size: 12px;}
#copy_l {width:159px; margin: 0px auto; float: none; display: block;}
#copy_l li {margin: 0px 15px;}
#copy_r {width:100%; float: none; display: block; text-align: center;}
	
#rec_box {margin: 0px auto 5% auto; width: 98%;}
#rec_box li {width: 50%;}
	
	
/*下層ページ　共通*/
#b_header img {width: 94px; height:71px;}
	
/*下層ページ　アクセス*/
#map_info {position: relative; top:0%; right :0%; width: 96%; box-shadow: 0 0 0px gray; background:rgba(255,255,255,0.7); text-align: center;padding: 2% 0px; margin: 0px auto;}
#map_txt {width: 100%;}
h1.shop_name{font-size: 16px;}
h2.shop_add{font-size: 12px;}
	

/*下層ページ　お知らせ*/
#news_box {width: 96%; min-height: auto; padding: 0% 0% 25% 0%; background-image: none;}
#news_left {width: 100%; float: left; display: inline; }
h2.news_txt01 {font-size: 16px;}
h2.news_txt01 span.subtxt {font-size: 12px; }
h3.news_txt01 {font-size: 12px;}
	
	
	
/*下層ページ　百福について*/
#abo_box1 {min-height: 500px;}
#abo_set01 {position: relative; top:10%; right:0%; width:96%; margin: 0px auto;}
h2.about_tit {font-size: 26px; }
h3.about_txt {font-size: 14px; }
	
#abo_box2 {min-height: 500px; }
#abo_set02 {position: relative; top:10%; right:0%; width:96%; margin: 0px auto;}
	
#abo_box3 {min-height: 500px; }
#abo_set03 {position: relative; top:10%; right:0%; width:96%; margin: 0px auto;}
	
#abo_box4 {min-height: 500px; }
#abo_set04 {position: relative; top:10%; right:0%; width:96%; margin: 0px auto;}
	
#abo_box5 {min-height: 500px; }
#abo_set05 {position: relative; top:10%; right:0%; width:96%; margin: 0px auto;}
	
#shop_in {width:100%; }
#shop_l {width: 100%; float: none; display: block;}
#shop_r {width: 100%; float: none; display: block;}
	
.shop_pl {width:96%; }
.shop_pl_l {width: 100%;  float: none; display: block;}
.shop_pl_r {width: 100%; float: none; display: block; border-left: none; }
	

/*下層ページ　お品書き*/
.course_box {width:96%;}
.course_box li {width: 94%; margin: 0px auto;}
h3.menu_midashi01 {font-size: 20px; text-align: left; padding: 0% 0% 0% 1%;}
h4.menu_tit {font-size: 18px;}
h5.menu_txt {font-size: 14px;}
h6.menu_price {font-size: 16px; line-height: 2.5; text-align: right;}
}