@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@300&display=swap');

/* ベースとカラー等
/*--------------------------------- */
body{
	font-family: 'Noto Serif JP', serif;
	background-color: #FEFEFE;
	font-size: 18px;
	line-height: 1.6;
	color: #333;
	font-family: 'Sorts Mill Goudy', serif;
}
@media screen and (max-width:767px){body{font-size: 16px;}}
@media screen and (max-width:420px){body{font-size: 4.2vw;}}
footer{
	padding-top: 15px;
	display: block;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #CCC;
	box-sizing: border-box;
	background-color: #e8dfd9;
}
#footer{
	padding-top: 8px;
	padding-bottom: 8px;
	background: linear-gradient(-135deg, #111, #332b2f);
	color: #FFF;
	font-size: 14px;

}

nav{}
h1,h2{font-size: 2em;font-weight: bold;margin-bottom: 0.9em;}
h3,h4,h5{font-size: 1.6em;font-weight: bold;margin-bottom: 0.9em;}
.card{
	border: 1px solid #CCC;
	padding: 10px;
	background-color: rgba(255,255,255,0.75);
	position: relative;
}

section{
	padding-top: 30px;
	padding-bottom: 30px;
	display: block;
	background-color: #FFF;
	box-sizing: border-box;
}
section:nth-child(even){
	background-color:#F4F0EE
}

.title{
	color:#715c54;
	font-family: 'Sorts Mill Goudy', serif;
	font-size: 2.35em;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
@media screen and (max-width:460px){.title{
	font-size: 1.95em;
	margin-bottom:0.3em;
}}
.title span{
	font-size: 0.5em;
	padding-left: 1em;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight: normal;
	color: #333;
}

.title2{
	font-family: 'Sorts Mill Goudy', serif;
	text-align: center;
	color: #62565d;
	font-size: 1.8em;
}

.title3{
	color: #62565d;
	font-size: 1.6em;
}
.title3b{
	color: #62565d;
	font-size: 1.6em;
	font-weight: bold;
}


.small{
	color: #818181;
	font-size: 80%;
	line-height: 1.2;
	padding-left: 5px;
}


/* ヘッダー
/*--------------------------------- */
#logo{
	text-align: center;
}
#logo img{
	width:150px;
	margin-right: auto;
	margin-left: auto;
}
h1 span{
	color: #333;
	line-height: 1;
	display:none
}

@media screen and (max-width:991px){
#logo img{
	width:auto;
	height:58px;
	margin-left:8px;
	margin-right:8px;
}
#logo{margin-bottom:0px; text-align:left;}
h1 span{display: inline;font-size: 0.8em; }
}

h1#logo a, h1#logo a:hover{color: #369;}



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

#slider,.info{margin-top: 58.5px;}
}
/* ナビ
/*--------------------------------- */
/*PCのスタイル*/

nav ul{
	align-items: center;
	list-style-type: none;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 1em;
	font-size: 1.11em;
}
nav ul li .icon{
	display: inline-block;
}

nav ul li{margin: 12px auto;

}

nav ul li a{
	color: #441400;
	text-decoration: none;
}
#nav_toggle{
	display: none;
	position: absolute;
	top: 10px;
	right: 10px;
}
.iconimg{
	height: auto;
	width: 2.18em;
	vertical-align: text-bottom;
	margin-right: 8px;
}

@media screen and (max-width:991px){
	/*メニュー部分*/
	nav{
		opacity: 0;
		overflow: hidden;
		height: 0px;
	}
	nav.open{
		display: block;
		position: absolute;
		top:0;
		width: 100%;
		height: 100vh;
		background:rgba(255,255,255,0.95);
		left: 0;
		z-index: 99;
		opacity: 1;
		transition: 0.5s;
	}
	nav ul{display: none;}
	
	nav ul li{
		margin: 0 auto;
	}
	nav ul li:last-child{
		border: none;
	}
	nav ul li a{
		display: block; 
		color: #441400;
		padding: 8px;
	}
	nav ul{font-size: 20px;}
	nav.open ul{
		display: block;
		width: 231px;
		height: 90%;
		position: absolute;
		top: 0px;
		bottom: 0px;
		left: 0;
		right:0;
		margin: auto;
	}
}
@media screen and (max-width:421px){
	nav ul{font-size: 1.15em;}
	nav.open ul{
		display: block;
		width: 60%;
		height: 90%;
		position: absolute;
		top: 0px;
		bottom: 0px;
		left: 0;
		right:0;
		margin: auto;
	}
}
@media screen and (max-width:991px){	
	/*開閉ボタン*/
	#nav_toggle{
		display: block;
		width: 36px;
		height: 36px;
		z-index: 100;
	}
	#nav_toggle div {
		position: relative;
	}
	
	#nav_toggle .navimenu{ 
	position:absolute;
	font-size:11px;
	top:25px;
	text-align:center;
	width: 100%;
	transition: 1s}
	
	#nav_toggle span{
		display: block;
		height: 3px;
		background: #4C444D;
		position:absolute;
		width: 100%;
		left: 0;
		-webkit-transition: 0.5s ease-in-out;
		-moz-transition: 0.5s ease-in-out;
		transition: 0.5s ease-in-out;	
	}
	#nav_toggle span:nth-child(1){
		top:0px;
	}
	#nav_toggle span:nth-child(2){
		top:10px;
	}
	#nav_toggle span:nth-child(3){
		top:20px;
	}
	
	/*開閉ボタンopen時*/
	.open #nav_toggle .navimenu{ 
	opacity: 0;
	transition: 0.5s;
	 }
	
	.open #nav_toggle span:nth-child(1) {
		background: #4C444D;
			top: 12px;
		   -webkit-transform: rotate(135deg);
			-moz-transform: rotate(135deg);
			transform: rotate(135deg);
		}
		.open #nav_toggle span:nth-child(2) {
			background: #4C444D;
			width: 0;
			left: 50%;
		}
		.open #nav_toggle span:nth-child(3) {
			background: #4C444D;
			top: 12px;
			-webkit-transform: rotate(-135deg);
			-moz-transform: rotate(-135deg);
			transform: rotate(-135deg);
		}
}


@media screen and (max-width:767px){.telicon{display:block;}}
/* フッターfooter
/*--------------------------------- */
footer address{
	font-size: 0.85em;
	line-height: 1.4;
	max-width: 20em;
	margin-right: auto;
	margin-left: auto;
	color: #441400;
}
@media screen and (max-width:575px){footer address{
	font-size: 1em;}}
footer address .t_name{
	font-size:1.4em;
	margin-bottom: 8px;
	display: block;
	text-align: center;
}
footer address table th,footer address table td{
	vertical-align: top;
}
footer address table td{

}
.tablepad{
	padding-top:4px;
	margin-top: 4px;
}
.label{
	display: inline-block;
	text-align: center;
	vertical-align: middle;
	border: 1px solid #441400;
	font-size: .7em;
	line-height: 1.5;
border-radius: .25em;
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
	color: #FFF;
	background-color: #441400;
	width: 4.5em;
	font-weight: bold;
}
.snsbox{
	color: #441400;
	font-size:1em;
	text-align: center;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight: bold;
}
@media screen and (min-width:576px){
	.snsbox{
	padding-top: 2.6em;
}}
.sns{
	text-align: center;
	width: 100%;
	margin-bottom: 10px;
	padding-top: 10px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.sns li{
	display: inline-block;
	list-style-type: none;
	padding-right: 0.3em;
	padding-left: 0.3em;
}
.sns li img{
	height: auto;
	width: 2.1em;
}
/* 各ページトップ　info
/*--------------------------------- */
.info{
	height: auto;
	width: 100%;
	position: relative;
	background-image: linear-gradient(0deg, rgba(154, 154, 154, 1) 1%, rgba(67, 66, 66, 1) 40%, rgba(23, 21, 31, 1));
}
.info .imgcover{height:250px;
opacity: 0.6666;}
.infotitle{
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	-o-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	font-size: 24px;
	color: #FFF;
	text-align: center;
	text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
}
.infotitle>span{
	font-size: 18px;
	display: block;
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #FFF;
	color: #FFF;
	line-height:1.6;
}
@media screen and (max-width:767px){
.info .imgcover{height:150px;}
}
ul.link {
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
}
ul.link li{
	display: inline-block;
	padding-right: 0.5em;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #CCC;
	font-size: 0.92em;
	position: relative;
	z-index: 1;
}
ul.link li:last-child{
	padding-right: 0px;
	border-right-width: 0px;
}
ul.link li a{
	color: #A44831;
}
/* サムネイル
/*--------------------------------- */
.thum{height:250px;}
@media screen and (max-width:767px){.thum{height:80px;}}
/* access　グーグルマップ
/*--------------------------------- */
.gmap{	width: 100%;
	height: 450px;}
@media screen and (max-width:767px){.gmap{	height: 360px;}}

.max800{
	width: 100%;
	max-width:800px;
	margin-right: auto;
	margin-left: auto;
}
.max600{
	width: 100%;
	max-width:600px;
	margin-right: auto;
	margin-left: auto;
}
/* アンカーリンク調整
/*--------------------------------- */
.anchor{
	display: block;
	padding-top: 100px;
	margin-top: -100px;
	z-index: -1;
	position: relative;
}
/* タイトルにライン
/*--------------------------------- */
.line{
	background:linear-gradient(transparent 60%, #ff6 60%);
}
.line-red{
	background:linear-gradient(transparent 60%, #ef93b6 60%);
}
/* 画像調整　上揃え
/*--------------------------------- */
.covertop{
	z-index: 0;
	object-fit: cover;
	object-position:50% 0%;
	font-family: 'object-fit: cover;';
	height: auto;
	width: 100%;
}


/* topics
/*--------------------------------- */
.topics{
	margin: 1em auto;
	padding: 0 1.5em;
	overflow: auto;
	width:100%;
	max-height: 12em;
}
.topics dl {
	border-bottom: 1px solid #ccc;
	padding-top: 10px;
	padding-right: 0;
	padding-bottom: 4px;
	padding-left: 0;
}

.topics dt {
padding-bottom: 4px;
}

@media screen and (min-width: 768px) {
.topics dt {
clear: left;
float: left;
width: 11em;
}
.topics dd {
margin-left: 11em;
}
}


.text-right{
	text-align: right;
}
.smal{
	font-size:80%;
	color: #4c444d;
	line-height: 1.2;
	padding-left: 5px;
}


@media(min-width: 768px) {
.infothum .imgcover{
	height: 100%;
}
}
.btn-flat-border {
	display: inline-block;
	padding: 0.2em 1em;
	text-decoration: none;
	color: #67c5ff;
	border: solid 2px #67c5ff;
	border-radius: 3px;
  transition: .4s;
	font-size: 13px;
	font-family:Arial, 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
}

.btn-flat-border:hover {
  background: #67c5ff;
  color: white;
}

/* Access
/*--------------------------------- */
.map{
	height: 800px;
	width: 100%;
}
.access_table{
	margin-right: auto;
	margin-left: auto;
	max-width:450px;
	width:100%;
	margin-bottom: 25px;
	font-size:1.09em
}
.access_table th{
	width: 6em;
	text-align: right;
	vertical-align: top;
}
.access_table td{}
@media screen and (min-width:576px){
	.mapsetumei{ padding-top:30px;}
}
@media screen and (min-width:768px){
.mapimg{
	position: absolute;
	bottom: 25px;
	right: 10px;
}
}
@media screen and (max-width:767px){.map{height: 450px;}}
/* 左右分け、左ヘッダー化
/*--------------------------------- */

.sidebar_fixed {
  position: sticky;
  top: 0;
}
@media screen and (min-width:992px){
.left{
	width: 225px;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #CCC;
	background-color: #FEFEFE;
	max-width: 225px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 40px;
	padding-left: 0px;
}

.right{
	width : -webkit-calc(100% - 225px);
	width : calc(100% - 225px);
	padding: 0px;
}
}
@media screen and (max-width:991px){
.left{ width: 100%;
max-width: 100%;
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: 98;
	border-right-width: 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCC;
	padding:0px;
	background-color: #FEFEFE;
}

.right{width: 100%; padding:0px;}
.sidebar_fixed {
  position:  static;
}

}
/* アイコン
/*--------------------------------- */


/*ふわっとでてくる*/
.scroll-block{
	opacity : 0;
	visibility: hidden;
	transition: 1.5s;
	transform: translateY(30px);
}


/*アニメーション要素までスクロールした時のスタイル*/
.active{
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}


.right .scroll-block:last-child {margin-bottom:1px; }

.event_title{
	 position: absolute;
  top: 0;
  display: flex;
  width : -webkit-calc(100% - 16px);
	width : calc(100% - 16px);
  height: 100%;
  margin: 0;
  align-items: center;
  justify-content: center;
	padding:0;
	font-size: 1.2em;
	color: #FFF;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight: bold;
	  text-shadow:1px 1px 0 #444, -1px -1px 0 #444,
              -1px 1px 0 #444, 1px -1px 0 #444,
              0px 1px 0 #444,  0-1px 0 #444,
              -1px 0 0 #444, 1px 0 0 #444;
	background-color: rgba(0, 0, 0, 0.1);
}
.event_title span{ font-size:70%;}
.event_date{
	margin:0;
	position: absolute;
	bottom: 0px;
	color: #FFF;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	right: 18px;
	font-size: 0.9em;
	text-shadow:1px 1px 0 #444, -1px -1px 0 #444,
              -1px 1px 0 #444, 1px -1px 0 #444,
              0px 1px 0 #444,  0-1px 0 #444,
              -1px 0 0 #444, 1px 0 0 #444;
}
@media screen and (max-width:420px){
.event_title{font-size: 4vw;}
}
.event_sns{
	 position: absolute;
  top: 0;
  display: flex;
  width : -webkit-calc(100% - 16px);
	width : calc(100% - 16px);
  height: 100%;
  margin: 0;
  align-items: center;
  justify-content: center;
	padding:0;
	font-size: 2em;
	color: #FFF;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight: bold;
	  text-shadow:1px 1px 0 #666, -1px -1px 0 #666,
              -1px 1px 0 #666, 1px -1px 0 #666,
              0px 1px 0 #666,  0-1px 0 #666,
              -1px 0 0 #666, 1px 0 0 #666;
}
.matb8{
	margin-top: 8px;
	margin-bottom: 8px;
}

.menu_t{
	font-size: 1.28em;
	font-weight: bold;
	padding-left: 0.45em;
	border-left-width: 2px;
	border-left-style: solid;
	border-left-color: #441400;
	position: relative;
}
.menu_t_s{
	font-size: 1.2em;
	font-weight: bold;
}
.menu_setumei{ padding-left:1em;}
.menu_p{
	font-size: 0.9em;
	display: inline-block;
	margin-left: 1em;
}
.menu_kimagure{	font-size: 0.9em;
	display: inline-block;
	margin-left: 1em;}
@media screen and (max-width:767px){
.menu_t{margin-bottom:28px;}
.menu_p{display:block; line-height:1; text-align:right; position:absolute; right:0;
}
.menu_kimagure{	font-size: 0.7em;
display:block; padding-top:4px; line-height:1.2; text-align: center; position:absolute; right:0; text-decoration:none; margin-left: 0px;}
}
.food_set{line-height:1.2}
.under_r {
    background: linear-gradient(transparent 70%, #ff99ab 70%);}
.under_y {
    background: linear-gradient(transparent 70%, #fff799 70%);}
.underline{
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #D3A9A9;
}
.drink{}
.drink dt{
	float: left;
	font-weight: normal;
}
.drink dt:before{ content:"・";}
.drink dd{
	float: right;
}
.crayon-orange {
  background: linear-gradient(transparent 62%,rgba(250, 142, 104, 0.2) 62%,rgb(250, 142, 104) 78%,rgba(250, 142, 104, 0.2));
    font-weight: bold; padding-bottom: 2px;
}
.crayon-blue {
  background: linear-gradient(transparent 62%,rgba(156, 228, 235, 0.2) 62%,rgb(156, 228, 235) 78%,rgba(156, 228, 235, 0.2));
    font-weight: bold; padding-bottom: 2px;
}
.crayon-pink {
  background: linear-gradient(transparent 62%,rgba(255, 173, 206, 0.2) 62%,rgb(255, 173, 206) 78%,rgba(255, 173, 206, 0.2));
    font-weight: bold; padding-bottom: 2px;
}
.crayon-parple {
  background: linear-gradient(transparent 62%,rgba(211, 157, 255, 0.2) 62%,rgb(211, 157, 255) 78%,rgba(211, 157, 255, 0.2));
    font-weight: bold; padding-bottom: 2px;
}
.crayon-green {
  background: linear-gradient(transparent 62%,rgba(149, 210, 151, 0.2) 62%,rgb(149, 210, 151) 78%,rgba(149, 210, 151, 0.2));
    font-weight: bold; padding-bottom: 2px;
}
.crayon-yerow {
  background: linear-gradient(transparent 62%,rgba(255, 202, 106, 0.2) 62%,rgb(255, 202, 106) 78%,rgba(255, 202, 106, 0.2));
    font-weight: bold; padding-bottom: 2px;
}


/*  ボタン
-------------------------------------------------------*/
.btn {
 position: relative;
 display: inline-block;
 font-size: calc(28 / 750 * 100vw);
 text-align: center;
 transition: all 0.3s ease;
}

.btn span {
 position: relative;
 display: inline-block;
 padding: .5em 1em;
 width: 100%;
 height: 100%;
}

.btn:before,
.btn:after {
 position: absolute;
 content: '';
 width: 1px;
 height: 0%;
}

.btn:before {
 right: 0;
 top: 0;
 transition: all 0.1s ease;
}

.btn:after {
 left: 0;
 bottom: 0;
 transition: all 0.1s 0.2s ease;
}

.btn:hover:before {
 transition: all 0.1s 0.2s ease;
 height: 100%;
}

.btn:hover:after {
 transition: all 0.1s ease;
 height: 100%;
}

.btn span:before,
.btn span:after {
 position: absolute;
 content: '';
}

.btn span:before {
 left: 0;
 top: 0;
 width: 0%;
 height: 1px;
 transition: all 0.1s 0.1s ease;
}

.btn span:after {
 left: 0;
 bottom: 0;
 width: 100%;
 height: 1px;
}

.btn span:hover:before {
 width: 100%;
}

.btn--dark {
 color: #715c54;
}

.btn--light {
 color: #a09692;
}

.btn--white {
 color: #fff;
}

.btn--dark:before,
.btn--dark:after,
.btn--dark span:before,
.btn--dark span:after {
 background: #715c54;
}

.btn--light:before,
.btn--light:after,
.btn--light span:before,
.btn--light span:after {
 background: #a09692;
}

.btn--white:before,
.btn--white:after,
.btn--white span:before,
.btn--white span:after {
 background: #fff;
}

@media screen and (min-width: 751px) {
 .btn {
  font-size: 18px;
  font-size: 1.8rem;
 }
}
.ichimatsu {
  background-size: 40px 40px;
  background-image: repeating-conic-gradient(from 0deg, #ff943e 0deg 90deg, #ffa965 90deg 180deg);
  background-repeat: repeat;
  min-height:120px;
}