@charset "utf-8";

/*
Theme Name: CReAS Food
Description: A theme by MACQA.
Author: MACQA Arakawa
Version: 1.00
*/

/* 初期設定リセット */
*{margin: 0;padding: 0}

/* ボックスサイズ調整 */
*, *:before, *:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}

/* 基本設定 */
html,body {
margin: 0;
padding: 0;
width : 100%;
height: 100%;
}

body {
overflow-x: hidden;
font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
color: #362e2b;
animation: fadeIn 2s ease 0s 1 normal;
-webkit-animation: fadeIn 2s ease 0s 1 normal;
}

/* リンク色 */
a {color: #362e2b;transition: all .5s;}
a:hover {color: #ff9900;}

h1, h2, h3, h4, h5 {font-weight: normal;}
.head {margin: 0 !important;padding: 0 !important;}
.framer {margin: 0 !important;padding: 0 !important;}

/* フェードイン */

@keyframes fadeIn {0% {opacity: 0} 100% {opacity: 1}}
@-webkit-keyframes fadeIn {0% {opacity: 0} 100% {opacity: 1}}
@-webkit-keyframes 'fadeIn' {0% {opacity:0;} 100% {opacity:1;}}
.fadeIn, img.fadeIn {
-webkit-animation-name: 'fadeIn';
-webkit-animation-duration: 2s;
-webkit-animation-timing-function: ease-in;
-webkit-animation-iteration-count: 1;
}

/* キービジュアル背景 */
.bg-slider {
width: 100%;
height: 100vh;
background-position:center center;
background-size: cover;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}

.bg-slider::after {
/* 透過した黒を重ねる */
background-color: rgba(0,0,0,0.7);
/* どの範囲に重ねるかを指定 */
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
content: ' ';
z-index:2;
}

#blog .brand img {max-width: 150px;margin: 1em 0;}

.logo a {
font-family: "Sawarabi Mincho";
text-decoration: none;
font-size: 3.4em;
line-height: 1.2;
margin: 0 auto;
letter-spacing: 0.2em;
}

.logo a span {
display: block;
font-size: 40%;
line-height: 1.1;
margin: 0 auto;
letter-spacing: 0.2em;
}

h3 {
font-family: "Sawarabi Mincho";
font-size: 2em;
margin: 0;
}

/* ナビゲーション基本 */
#navi {
width: 100%;
margin: 0;
padding: 5px 0;
height: auto;
background: #362e2b;
}

#navi ul {
width: 100%;
height: auto;
text-align: center;
margin-top: 10px;
display: flex;
list-style: none;
flex-wrap: wrap;
}

#navi .fx-row {
margin: 0 !important;
padding: 0 !important;
}

.nleft {
display: flex;
display: -webkit-flex;
}

.fixed {
position: fixed;
top: 0px;
left: 0;
z-index: 9999;
}

/* ナビゲーションメニュー */
#navi li a {
margin: 0 5px;
line-height: 1;
height: auto;
padding: 5px 15px;
color: #fff;
text-decoration: none;
border-radius: 30px;
font-size: 90%;
transition: all .5s;
}

#navi li a:hover {
background: #ff9900;
}


/* ナビゲーションTEL */
.htel {
display: block;
font-family:"Times New Roman", serif;
font-size: 250%;
line-height: 1.2;
padding: 0;
margin: -15px 10px 0 0;
color: #fff;
text-align: right;
}

.htel a {color: #fff;}
.htel a, .ntel a, .ftel a {text-decoration:none;}


/* ナビゲーション営業時間 */
.hinfo {
display: block;
font-size: 80%;
text-align: right;
clear: both;
line-height: 1.25;
margin: 0;
color: #fff;
}

/* コンテンツセクション */
section {padding: 50px 100px 30px;}

/* セクション見出し（英字） */
.sub-title {
font-family:"Times New Roman", serif;
font-size: 6em;
line-height: 1;
padding: 0;
margin: 0 0 -45px;
color: #eee;
}

/* コンテンツ文章 */
p {
font-size: 0.9em;
margin: 0.5em 0;
line-height: 1.5;
text-align: justify;
text-justify: inter-ideograph;
}

hr {border:none;}

/* お知らせ黒板 */
ul.news_list {
list-style-position: inside;
padding: 1.5em;
background: #3f5401;
color: #fff;
}

/* メニュータイトル */
.title {
font-size: 1em !important;
background: #f9f7f4;
padding: 5px;
}

/* メニュータブ切り替え全体のスタイル */
.tabs {
padding-bottom: 40px;
background-color: #fff;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
width: 100%;
margin: 0 auto;}

/* メニュータブのスタイル */
.tab_item {
width: calc(100%/3);
height: 45px;
border-bottom: 3px solid #413c32;
background-color: #d9d9d9;
line-height: 45px;
font-size: 0.9em;
text-align: center;
color: #565656;
display: block;
float: left;
font-weight: bold;
transition: all 0.2s ease;
}
.tab_item:hover {
  opacity: 0.75;
}

/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
.tab_content {
display: none;
padding: 40px 40px 0;
clear: both;
overflow: hidden;
}

/*選択されているタブのコンテンツのみを表示*/
#tab1:checked ~ #tab1_content,
#tab2:checked ~ #tab2_content,
#tab3:checked ~ #tab3_content,
#tab4:checked ~ #tab4_content,
#tab5:checked ~ #tab5_content,
#tab6:checked ~ #tab6_content {
display: block;
}

/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
background-color: #413c32;
color: #fff;
}

/* リンクボタン */
.btn {
border: 1px solid;
padding: 5px 10px;
border-radius: 30px;
font-size:0.8em;
float: right;
line-height: 1.1;
text-decoration: none;
}

/* フッター */
footer {position: relative;padding: 1.5em;}
.flogo img {max-width: 80px;}
.flogo {
font-family: "Sawarabi Mincho";
text-decoration: none;
font-size: 1.6em;
line-height: 1.2;
margin: 0 auto 0.1em;
letter-spacing: 0.2em;
}
.flogo span {font-size: 60%;}
.finfo {font-size: 70%;}
.fname,.faddress {text-align: center;}
.faddress {font-size: 0.8em;margin: 0.2em auto;}
/* フッターTEL */
.ftel {
font-family:"Times New Roman", serif;
font-size: 250%;
line-height: 1;
padding: 0;
margin: 0;
color: #59493f;
display: inline-block;
}

/* TOPに戻るボタン */
a.gotop {
display: inline-block;
margin: 0;
width: 50px;
height: 45px;
line-height: 45px;
font-size: 20px;
background: #ebe8e5;
color: #fff;
border-radius: 50px 50px 0 0;
position: absolute;
bottom: 0;
right: 30px;
}

a.gotop span {display: none;}
a.gotop:hover {background: #ff9900;}

.pc {display: block}
.sp {display: none;}

/* ヘッダー＆ナビゲーション スマホ */
@media screen and (max-width: 468px) {
#navi {
width: 100%;
height: auto;
text-align: center;
padding: 10px 0
}
#navi ul {
width: 100%;
height: auto;
text-align: center;
display: flex;
justify-content: space-between;
list-style: none;
margin: 0 2px 10px;
}
#navi div {margin: 0;}
#navi .nlogo {display: none;}
#navi li a {
margin: 0;
line-height: 1;
height: auto;
padding: 5px 8px;
font-size: 70%;
color: #fff;
border-radius: 30px;
text-decoration: none;
background: #282422;
}
.htel {
display: inline-block;
width: auto;
margin: 0 auto !important;
padding: 0;
font-size: 1.5em;
text-align: center;
}
.hinfo {margin: px 0 0;line-height: 1;text-align: center;font-size: 0.6em;}
}

/* その他スマホ表示調整 */
@media screen and (max-width: 468px) {
.sp {display: block}
.pc {display: none;}
.bg-slider {
width: 100%;
height: 50vh;
background-position:center center;
background-size: auto 60vh !important;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
section {padding: 2%;}
h3 {font-size: 1.1em;margin-top: -15px;}
.sub-title {font-size: 2em;margin:0;}
.tab_content {padding: 0;}
footer {padding-bottom: 45px;}
.flogo img {max-width: 80px;margin: 10px auto !important;}
.ftel {font-size: 200%;margin: 0;}
.finfo {font-size: 65%;}
.default {margin: 0.5em 0 0;}
.tabs {box-shadow: none;}
.mb-0 a {margin-bottom: 15px;}
.tab_item {
width: calc(88%/3);
border: none;
background: #f3efe9;
border-radius: 30px;
height: 30px;
margin: 0 2% 0;
line-height: 30px;
font-size: 0.7em;
}
a.gotop {
width: 35px;
height: 35px;
line-height: 35px;
font-size: 20px;
bottom: 0;
right: 7%;
}
.news_list {font-size: 0.7em;padding: 0.8em !important;}
}

/* 問い合わせフォーム */
input,textarea {
width: 98%;
padding: 1%;
border:none;
background: #eee;
}
.input {padding: 0 0 5px;font-size: 90%;}
.input input {border: 1px solid #ddd;}
textarea {
border: 1px solid #ddd;
height: 70px !important;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
.submit input {
background: #638f02;
border-radius: 50px;
color: #fff;
margin-top: 5px
}

/*ブログ＆カテゴリー＆アーカイブ*/
.single header, .category header, .page header  {
height: auto;
padding: 2em 0;
}
.single #main, .page #main  {
max-width: 640px;
margin: 0 auto 3em !important;
}
.category .container {max-width: 1100px;margin: 0 auto !important;}
.category #main {
padding: 0;
}
.category #catlist {max-width: 100%;}
.category #catlist img {margin-bottom: 2em;}
.content {font-size: 0.9em;line-height: 2;}

.single h2, #catlist h3, .page h2 {
font-family: "Sawarabi Mincho";
margin: 2em 0;
letter-spacing: 0.5em;
font-size: 1.6em;
}
#catlist h2 {
font-size: 0.8em;
border-top: 2px solid #f9f7f4;
border-bottom: 2px solid #f9f7f4;
padding: 0.5em 0;
font-weight: normal;
text-align: center;
letter-spacing: 0.3em;
}
#catlist h3 a {text-decoration: none;color: #222;}
.single .hentry img {margin-bottom: 2em;}
.single p {line-height: 2;}
.menu {
text-align: center;
padding: 0.5em;
background: #f9f7f4;
border-radius: 5px;
font-size: 0.9em;
margin-bottom: 1.5em !important;
}
.list {
border-bottom: 2px solid #f9f7f4;
padding-bottom: 3em;}

.sidetitle {margin: 1em;}
.sidetitle a {
text-decoration: none;
color: #222;
font-size: 0.9em;
}

/* パンくず */
#breadcrumb {
margin: 0 auto !important;
padding: 0;
color: #666;
}
#breadcrumb li {
list-style: none;
float: left;
margin: 5px;
font-size: 0.7em;
}

#breadcrumb li a {display: inline-block;text-decoration: none;color: #666;}
#breadcrumb li a:nth-child(2):before {content: ">";padding: 0 5px;}
#breadcrumb li a:hover {color: #e84f56}
#breadcrumb :after {
content: "";
display: block;
clear: both;
height: 1px;
overflow: hidden;
}

#breadcrumb :after {
content: "";
display: block;
clear: both;
height: 1px;
overflow: hidden;
}

/* SNSブロック設定 */
.sns div {text-align: center}
.sns-header {color: #fff;padding: 10px;margin: 2% auto;}
.instagram .pc {height: 300px !important;}
.instagram .pc {width: 100%;}
.instagram .sns-header {background: #362e2b}
.facebook .sns-header {background: #3b5999}
.twitter .sns-header {background: #55acee}