@charset "utf-8";


/*********************************
↓　全体設定
*********************************/

/* 全体設定 */
*
{
	margin: 0;
	padding: 0;
	border: 0;
	
	-webkit-padding-start: 0;
	-webkit-margin-before: 0;
	-webkit-margin-after: 0;
}

html
{
	font-size: 62.5%; /* font-size: 10px と同義 */
}

body
{
	color: #333;
	
	font-size: 120%; /* font-size: 12px と同義 */
	line-height: 1.7;
	
    font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', sans-serif;
	
	position: relative;
}

a
{
	color: #04c;
	text-decoration: none;
}

a:hover
{
	text-decoration: underline;
}

/* テーブル */
table,
th,
td
{
}

table
{
	margin: 0;
}

th, td
{
	padding: 4px 8px;
	font-weight: normal;
	font-size: 100%;
	vertical-align: middle;
	border: 1px solid #ccc;
}

th
{
	background-color: #333;
	color: white;
}

/* レスポンシブテーブル用画像（PC非表示） */
th img
{
	display: none;
}

td
{
}

/* clearfix */
.clearfix:after {
	content: ".";  /* 新しい要素を作る */
	display: block;  /* ブロックレベル要素に */
	clear: both;
	height: 0;
	visibility: hidden;
}
.clearfix {
	min-height: 1px;
}


/* inline-block */

.inline_block
{
	display: inline-block;
}

.serif
{
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}



/*********************************************************
 アニメーション定義
**********************************************************/

@keyframes sample_animation
{
	0% { color: white; }
	50% { color: black; }
	100% { color: white; }
}


/*********************************************************

**********************************************************/

#wrapper
{
	width: 100%;
	margin: 0 auto;
	
}

h1
{
	margin: 0;
	padding: 32px 0 0;
}

.hero,
.logo
{
	width: 400px;
	max-width: 80%;
	
	display: block;
	margin: 50px auto 32px;
}

.logo
{
	margin-bottom: 48px;
}

.notice {
    text-align: center;
	margin: 0 auto 30px;
}

#main
{
	box-sizing: border-box;

	width: 640px;
	max-width: 100%;
	border-top: 1px solid #999;
	border-bottom: 1px solid #999;
	
	padding: 24px 0 8px;
	
	margin: 0 auto 24px;
}

#main h2,
#main p
{
	box-sizing: border-box;

	width: 80%;
	margin: 0 auto 16px;
	padding: 0;
}

#main h2 img
{
	display: block;
	margin: 0;
	padding: 0;
}

#main p
{
	text-indent: -1em;
	padding-left: 1em;
}

#wrap_footer
{
	width: 640px;
	max-width: 100%;
	text-align: center;
	margin: 0 auto;
}

.head_footer
{
	width: 640px;
	max-width:100%;
	text-align: center;
	margin: 0 auto;
}

.info
{
	width: 80%;
	margin: 0 auto 16px;
}

.info .strong
{
	font-size: 1.3em;
	line-height: 2;
}

.info .bold
{
	font-weight: bold;
}

.footer_image
{
	width: 100%;
	height: 96px;

	background-image: url(../images/footer.png);
	background-position: center bottom;
	background-repeat: repeat-x;
	
}

/*********************************************************
メディアクエリ
**********************************************************/


/* スマートフォン表示（横640px以下） */
@media screen and (max-width: 640px)
{

#main h2,
#main p,
.info
{
	width: 90%;
}
}

/*********************************************************
追加css
**********************************************************/
/* 231110~浜崎追加 */
/*********************************************************
08labo
**********************************************************/
.kitchen_link a{
	color: #333;
	transition: 0.7;
}
.kitchen_link a:hover {
	opacity: 0.8;
	transition: 0.7;
}
.kitchen_link  {
	width: 60%;
	margin: 5em auto auto;
}
.kitchen_link img {
	width: 100%;
}

/* スライダー */
.slider {
    position:relative;
	z-index: 1;
	/*↑z-indexの値をh1のz-indexの値よりも小さくして背景に回す*/
	height: 100vh;/*スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/
}

.slider-top,
.slider-bottom {
    height: 50vh;/*スライダー上下の縦幅を画面の高さの半分（50vh）にする*/
}

/*　背景画像設定　*/

.slider-item01 {
    background:url(../production/assets/images/img_2023_fufufu.jpg);
}

.slider-item02 {
    background:url(../img/img_02.jpg);
}

.slider-item03 {
    background:url(../img/img_03.jpg);
}

.slider-item04 {
    background:url(../img/img_04.jpg);
}

.slider-item05 {
    background:url(../img/img_05.jpg);
}

.slider-item06 {
    background:url(../img/img_06.jpg);
}

.slider-item {
    width: 50%;/*各スライダー全体の横幅を画面の高さいっぱい（100%）にする*/
    height:50vh;/*各スライダーの縦幅を画面の高さの半分（50vh）にする*/
    background-repeat: no-repeat;/*背景画像をリピートしない*/
    background-position: center;/*背景画像の位置を中央に*/
    background-size: cover;/*背景画像が.slider-item全体を覆い表示*/
}

/*********************************************************
キッチン
**********************************************************/