﻿
@charset "UTF-8";

body	{margin:0; font-family: 'メイリオ', 'Hiragino Kaku Gothic Pro', sans-serif}

/* サイト名 */
.site h1 a	{color: #000000;
	text-decoration: none;}

.site h1	{margin: 0;
	font-size: 30px;}

.boxA 	{position: fixed;
    height: 75px;
	top: 0;
	left: 0;
	width: 100%;
	opacity: 0.8;
	z-index:10;  /* 前面に */
	background-color: #ffffff;}


#MENU, #EVENT, #ACCESS, #CONTACT{
    padding-top: 75px;
}
#MENU, #EVENT, #ACCESS, #CONTACT{
    margin-top:-75px;
    padding-top:75px;
}

/* CONTENTS */
/* メニュー固定分下に */
.contents_top img	{max-width: 100%;
	height: auto;}

.contents_top{
    padding-top: 75px;
}


/* FOOD MENU */
.food_menu	{padding-left: 50px;
	padding-right: 50px;
}

.food_menu h1   {text-align: center;
    font-size: 32px;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	color: #666666;}

.gaiyou a	{display: block;
	color: #ffffff;
	text-align: center;
	text-decoration: none}

.gaiyou a:hover	{opacity: 0.5;
    text-decoration: none;}

.gaiyou i	{display: block;
	padding-top: 20px;
	padding-bottom: 20px;
	font-size: 38px;}

.gaiyou .fa-coffee	{color: #ea9447;}

.gaiyou .fa-cutlery	{color: #ea6c84;}

.gaiyou .fa-glass	{color: #19bab2;}

.gaiyou h1	{margin-top: 0;
	margin-bottom: 0;
	padding-top: 5px;
	padding-bottom: 5px;
	font-size: 20px;
	font-weight: normal}

.gaiyou p	{margin-top: 0;
	margin-bottom: 0;
	padding-top: 15px;
	padding-bottom: 15px;
	color: #524e3c;
	font-size: 12px}

/* EVENT */
.event	{padding-left: 50px;
	padding-right: 50px;
}

.event h1	{
    text-align: center;
	margin-bottom: 5px;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 32px;
	color: #666666}

.event ul	{margin: 0;
	padding: 0;
	list-style: none}

.event li a	{display: block;
	padding: 5px;
	border-bottom: dotted 2px #dddddd;
	color: #000000;
	font-size: 14px;
	text-decoration: none}

.event li a:hover	{background-color: #eeeeee}

.event time	{margin-right: 10px;
	color: #888888;
	font-weight: bold}

/* ACCESS */
.access	{padding-left: 50px;
	padding-right: 50px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box}
	
.access h1   {text-align: center;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 32px;
	color: #666666}

.access h2   {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 24px;
	color: #666666}
	
/* ボックスの上下 */
.boxA	{padding-top: 5px;
	padding-bottom: 10px;}

.footer	{padding-top: 20px;
	padding-bottom: 20px;}

.food_menu, .event, .access, .contact	{
	padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: solid 1px #aaaaaa;}

.food_menu-1, .food_menu-2, .food_menu-3
	{padding-bottom: 10px}

.content_pg-1, .content_pg-2
    {padding-top: 20px;
    padding-bottom: 20px;}


/* food_menu-1、food_menu-2、food_menu-3を横に並べる設定 */
.food_menu:after	{content: "";
	display: block;
	clear: both;}

.food_menu-1	{float: left;
	width: 32%;
	margin-right: 2%;}

.food_menu-2	{float: left;
	width: 32%;
	margin-right: 2%;}

.food_menu-3	{float: left;
	width: 32%;}

/* access-1、access-2を横に並べる設定 */
.access:after	{content: "";
	display: block;
	clear: both;}

.access-1	{float: left;
	width: 50%;}

.access-2	{float: left;
    padding-left: 2%;
	width: 48%;}

.access-1	{   position: relative;
    height: 0;
    overflow: hidden;
    padding-top: 40%;}
	
iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.access-2 p{padding-left: 20px;}

/* CONTACT */
.contact-act{padding-left: 50px;
	padding-right: 50px;}

.contact-message{text-align: center;
    padding-bottom: 20px}

.contact h1   {text-align: center;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 32px;
	color: #666666;}

.contact-form{
   background-color: #f1f1f1;
   padding: 30px;
}
.contact-form .form-control{
    height: 43px;
    border-radius: 0px;
    margin-bottom: 20px;
    border: 0px solid #fff;
}

.form_submit{
	width: 100%;
	background: #f73b56;
	border-radius: 0px;
	color: #fff;
	padding-top: 13px;
	padding-bottom: 10px;
	transition: all 1s;	
}

/* form-name-1、form-name-1を横に並べる設定 */
.form-name-1	{float: left;
	width: 50%;}

.form-name-2	{float: left;
    padding-left: 2%;
	width: 48%;}

/*Footer*/
.footer_logo{text-align: center;}
.footer_logo img{max-width: 200px;
   height: auto;}
.social{
	padding-top: 10px;
}
.social h2{
    text-transform: uppercase;
    font-size: 16px;
	text-align: center;	
}
ul.icon_list{
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: center;
    margin-top: 20px;
}
ul.icon_list li{
    display: inline;
    padding-left: 3px;
    padding-right: 3px;
}
ul.icon_list li a{
    display: inline-block;
    color: #636363;
    text-align: center;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 20px;
}
ul.icon_list li a:hover{
	color: #f73b56;
	border-color:#f73b56; 
}
.copyright_text{
    padding-top: 20px;
	text-align: center;	
}
.copyright_text p{
    color: #636363;
    font-size: 14px;
    text-transform: uppercase;
    margin-bottom: 0px;
    letter-spacing: 0px;
}
.copyright_text a{
	color:#f73b56;
	text-transform:uppercase;
	font-weight:700;
	text-decoration:none;
	}
/* コピーライト
.copyright p	{margin: 0;
	color: #666666;
	font-size: 14px}
 */


/* MENU PAGE */

.content_pg-2 h1   {
	border-left: solid 10px #ea9447;
	padding-left: 10px;
    font-size: 28px;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	color: #666666;}

.side_menu i	{
	padding-right: 15px;
	padding-left: 20px;
	font-size: 20px;}

.side_menu .fa-coffee	{color: #ea9447;}
.side_menu .fa-cutlery	{color: #ea6c84;}
.side_menu .fa-glass	{color: #19bab2;}

/* サイドメニュー（縦並び） */
.side_menu ul	{margin: 0;
	padding: 0;
	list-style: none;}

.side_menu li a	{display: block;
	padding: 5px;
	color: #000000;
	font-size: 16px;
	text-decoration: none;}

.select {background-color: #eeeeee;}

.side_menu li a:hover	{background-color: #eeeeee;}

.side_menu p {text-align: center;
    font-size: 24px;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	color: #666666;}

.content_pg dt   {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 20px;
	color: #666666}

.content_pg dd   {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 16px;
	padding: 20px 0 0 20px;
	color: #666666}

.content_menu-2 em   {
	padding-left: 30px;}
.dot   {
	width: 50px;
	border-bottom: dotted 2px #999;}
		
		
.content_pg-1	{padding-left: 10px;
    padding-right: 10px;}

.content_pg-2	{padding-left: 10px;}
	
/* ########### 359px以下 ########### */
@media (max-width: 359px) {

/* サイト名 */
.site img	{width: 250px;
	height: auto}
}
/* ########### 500px以上 ########### */
@media (min-width: 500px) {

.content_pg {
    border-bottom: solid 1px #aaaaaa;}

.content_pg:after	{content: "";
	display: block;
	clear: both;}
		
.content_pg-1	{float: left;
    padding-left: 2%;
	width: 18%;}

.content_pg-2	{float: left;
    padding-left: 2%;
	width: 78%;}


.content_menu {
    border-bottom: solid 1px #aaaaaa;
	padding: 10px;}

.content_menu:after	{content: "";
	display: block;
	clear: both;}
		
.content_menu-1	{float: left;
	width: 300px;
	height: auto;}

.content_menu-2	{float: left;
	padding-left: 30px;
	width: auto;}
}

/* ########### 779px以下 ########### */
@media (max-width: 779px) {


.box1, .food_menu, .access, .event, .contact-act{
	padding-left: 10px;}

.box2, .food_menu, .access, .event, .contact-act{
	padding-right: 10px;}

.box2	{float: right;
	width: auto;
	padding-right: 50px;}



/* トグルボタン */
#menubtn	{padding: 6px 12px;
	border: solid 1px #aaaaaa;
	border-radius: 5px;
	background-color: #ffffff;
	position: absolute;
	top: 30px;
	right: 15px;
	cursor: pointer}

#menubtn:hover	{background-color: #dddddd}

#menubtn:focus	{outline: none}

#menubtn i	{color: #888888;
	font-size: 18px}

#menubtn span	{display: inline-block;
	text-indent: -9999px}

/* ナビゲーションメニュー（縦並び） */
#menu	{display: none;}

#menu ul	{margin: 0;
	padding: 0;
	list-style: none;
	background-color: #ffffff;}

#menu li a	{display: block;
	padding: 5px;
	color: #000000;
	font-size: 14px;
	text-decoration: none;}

#menu li a:hover	{background-color: #eeeeee;}

}
 
/* ########### 780px以上 ########### */
@media (min-width: 780px) {


.boxA:after	{content: "";
	display: block;
	clear: both;}

.box1	{float: left;
	width: auto;
	padding-left: 50px;}

.box2	{float: right;
	width: auto;
	padding-right: 50px;}

	
/* トグルボタン */
#menubtn	{display: none}

/* ナビゲーション */
#menu	{display: block !important}

/* ナビゲーション */
#menu ul	{margin: 0;
	padding: 0;
	list-style: none;
	padding-top: 20px;
	font-family: 'Gudea', sans-serif;
	font-weight: 400;}

#menu li a	{display: block;
	padding: 10px;
	color: #000000;
	font-size: 18px;
	text-decoration: none;}

#menu li a:hover	{background-color: #eeeeee;}

#menu ul:after	{content: "";
	display: block;
	clear: both;}

#menu li	{float: left;
	width: auto;}

}

/* ########### 1190px以上 ########### */
@media (min-width: 1500px) {

/* 全体の横幅を固定 */
.box3, .box4, .content_pg
	{width: 1500px;
	margin-left: auto;
	margin-right: auto;}

/* BOX Aの下に罫線を挿入 
.boxA	{margin-bottom: 20px;
	border-bottom: solid 1px #dddddd}
*/
}