@charset "utf-8";
/*
theme Name: 103Cafeオリジナルテーマ
Author: Yusuke Kikuchi
Description: 103Cafe - 土佐町のオリジナルテーマ
version： 0.0.1
*/

/* リセット↓↓↓↓ */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}

body {
	line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
	display:block;
}

nav ul {
	list-style:none;
}

blockquote, q {
	quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content:'';
	content:none;
}

a {
	margin:0;
	padding:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}

/* change colours to suit your needs */
ins {
	background-color:#ff9;
	color:#000;
	text-decoration:none;
}

/* change colours to suit your needs */
mark {
	background-color:#ff9;
	color:#000;
	font-style:italic;
	font-weight:bold;
}

del {
	text-decoration: line-through;
}

abbr[title], dfn[title] {
	border-bottom:1px dotted;
	cursor:help;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}

/* change border colour to suit your needs */
hr {
	display:block;
	height:1px;
	border:0;  
	border-top:1px solid #cccccc;
	margin:1em 0;
	padding:0;
}

input, select {
	vertical-align:middle;
}
/* リセット↑↑↑↑ */

/* 基本↓↓↓↓ */
html {
	font-size: 16px;
}
 
body {
	/*フォントの指定*/
/*	font-family: 'Meiryo UI','メイリオ', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'Noto Sans Japanese', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;*/
	font-family: "Times New Roman","Noto Serif JP","Hiragino Mincho ProN","游明朝",YuMincho,'Meiryo UI','メイリオ', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'Noto Sans Japanese', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif,serif;
	/*行間の指定*/
	line-height: 1.4;
	margin: 0;
	padding: 0;
	/*サイトのデフォルトとなる文字の色を指定*/
	color: rgba(255,255,255,0.85);
	background: url(images/board-black.png); /* 紙の色 */
/*	background-color: black; 紙の色 */
}
 
/*見出しを全て太字で表示 + 文字色を白に*/
h1, h2, h3, h4, h5, h6 {
	font-weight: bold;
	color: rgba(255,255,255,0.85);
}
 
img {
	max-width: 100%;
	height: auto;
}
a {
	text-decoration: none;
}

/* スマホ */
@media(max-width: 600px) {
	body {
		background: url(images/board-black-m.png);
	}
}

/* 基本↑↑↑↑ */

/* 確認用に記述 */
/* 
.contents, #sidebar {height: 800px; }
 
header{background-color: #888;}
 
.header-inner{ background-color: #ccc; height: 0px;}
 
.container {background-color: #FFFFFF; }
 
.contents {background-color: #a5e2ff; }

#sidebar{background-color: #aefffc; }

footer{background-color: #777; }
 
.footer-inner{background-color: #ddd; height: 50px; }
*/ 

/*コンテンツのサイズ指定*/
body {
	display: grid;
	display: -ms-grid;
	min-height: 100vh;
	grid-template-rows: 130px auto 100px;
	grid-template-columns: 1fr;
	-ms-grid-template-rows: 130px auto 100px;
	-ms-grid-template-columns: 1fr;
	grid-template-areas: "header"
						 "container"
						 "footer";
	justify-content: center;
	align-items: center;
}
header{
	grid-area: header;
	-ms-grid-column: 1;
	-ms-grid-row: 1;
}
.container{
	grid-area: container;
	-ms-grid-column: 1;
	-ms-grid-row: 1;
}
footer{
	grid-area: footer;
	-ms-grid-column: 1;
	-ms-grid-row: 3;
}
/*
.header-inner {
	display: grid;
	display: -ms-grid;
	grid-template-rows: 30px 60px 50px;
	grid-template-columns: 120px 7fr;
	-ms-grid-template-rows: 30px 60px 50px;
	-ms-grid-template-columns: 120px 7fr;
	grid-template-areas: "h-logo h-sns"
						 "h-logo h-menu"
						 "h-cat  h-cat";
	justify-content: center;
	align-items: center;
}
.header-category{
	grid-area: h-cat;
	-ms-grid-column: 1;
	-ms-grid-row: 3;
	-ms-grid-column-span: 2;
}
.site-title-wrap{
	grid-area: h-logo;
	-ms-grid-column: 1;
	-ms-grid-row: 1;
	-ms-grid-row-span: 3;
}
.todayinfo{
	grid-area: h-sns;
	-ms-grid-column: 2;
	-ms-grid-row: 1;
}
.header-nav-wrap{
	grid-area: h-menu;
	-ms-grid-column: 2;
	-ms-grid-row: 2;
}*/
/* PC */
.header-inner,
.container,
.footer-inner {
	box-sizing: border-box;
/*  max-width: 1200px;*/
	margin-right: auto;
	margin-left: auto;
}

.header-inner,
.footer-inner {
	max-width: 100%;
}

.container {
	clear: both;
	margin-top: 39px;
	padding-top: 77px;
/*	padding: 1rem 1rem;*/
	width: 95%;
}
.container:before {
  box-shadow: 0 1px 0 0 black;
}

.container:after {
	display: block;
	clear: both;
	content: '';
}
 
.contents {
	float: left;
	width: 100%;
/*	margin-left: 1%; */
	text-align: center;
/*	border-right: #C4C3C3 solid 1px;*/
}
.sidebar {
	float: left;
	width: 100%;
}

/* タブレット */
@media(max-width: 800px) {
	.contents {
		margin-bottom: 1.5rem;
		width: 100%;
	}
	.sidebar {
		width: 100%;
	}
}
 
/* スマホ */
@media(max-width: 600px) {
	html {
		font-size: 13px;
	}
 
	.contents {
		margin-bottom: 1rem;
		width: 100%;
	}
	.header-inner {
		padding: 0rem;
	}
	.container,
	.footer-inner {
		padding: 0rem;
	}
	.sidebar {
		width: 100%;
	}
}

/*サイドメニュー*/
.widget_nav_menu ul {
	list-style: none;
}

.widget_nav_menu li {
	position: relative;
	top: 0;
	right: 0;
	color: rgba(0,0,0,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3); 
}
.fa-stack-1x{
	color: rgba(255,255,255,0.85);
}
.fa-book-open{
	color: rgba(255,255,255,1);
 text-shadow    : 
       2px  2px 1px #000000,
      -2px  2px 1px #000000,
       2px -2px 1px #000000,
      -2px -2px 1px #000000,
       2px  0px 1px #000000,
       0px  2px 1px #000000,
      -2px  0px 1px #000000,
       0px -2px 1px #000000; 
}
.fa-map-marker{
	color: rgba(255,255,255,1);
 text-shadow    : 
       2px  2px 1px #000000,
      -2px  2px 1px #000000,
       2px -2px 1px #000000,
      -2px -2px 1px #000000,
       2px  0px 1px #000000,
       0px  2px 1px #000000,
      -2px  0px 1px #000000,
       0px -2px 1px #000000; 
}
.fa-clock-o{
	color: rgba(255,255,255,1);
 text-shadow    : 
       2px  2px 1px #000000,
      -2px  2px 1px #000000,
       2px -2px 1px #000000,
      -2px -2px 1px #000000,
       2px  0px 1px #000000,
       0px  2px 1px #000000,
      -2px  0px 1px #000000,
       0px -2px 1px #000000; 
}

.fa-search{
	color: rgba(255,255,255,1);
 text-shadow    : 
       2px  2px 1px #000000,
      -2px  2px 1px #000000,
       2px -2px 1px #000000,
      -2px -2px 1px #000000,
       2px  0px 1px #000000,
       0px  2px 1px #000000,
      -2px  0px 1px #000000,
       0px -2px 1px #000000; 
}

.fa-birthday-cake{
	color: rgba(255,255,255,1);
 text-shadow    : 
       2px  2px 1px #000000,
      -2px  2px 1px #000000,
       2px -2px 1px #000000,
      -2px -2px 1px #000000,
       2px  0px 1px #000000,
       0px  2px 1px #000000,
      -2px  0px 1px #000000,
       0px -2px 1px #000000; 
}

.fa-store{
	color: rgba(0,0,0,0.85);
 text-shadow    : 
       2px  2px 1px #FFFFFF,
      -2px  2px 1px #FFFFFF,
       2px -2px 1px #FFFFFF,
      -2px -2px 1px #FFFFFF,
       2px  0px 1px #FFFFFF,
       0px  2px 1px #FFFFFF,
      -2px  0px 1px #FFFFFF,
       0px -2px 1px #FFFFFF; 
}

.fa-envelope{
	color: rgba(255,255,255,1);
 text-shadow    : 
       2px  2px 1px #000000,
      -2px  2px 1px #000000,
       2px -2px 1px #000000,
      -2px -2px 1px #000000,
       2px  0px 1px #000000,
       0px  2px 1px #000000,
      -2px  0px 1px #000000,
       0px -2px 1px #000000; 
}

@supports (background-clip: text) or (-webkit-background-clip: text) {
	widget_nav_menu li {
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}

.widget_nav_menu a {
	text-decoration: none;
	color: rgba(255,255,255,0.85);
	margin: 0px 20px;
}

/* ヘッダ */
/* サイトタイトル */
.site-title-wrap {
	display: inline-block;
	position: relative;
	text-align: left;
}

.site-title {
	padding-top: 55px;
	position: relative;
	margin: 10px;
	transition: 1s cubic-bezier(0.86,0,0.07,1);
}

.menu-top {
	top: 0px;
	left: 0;
	right: 0;
	margin: auto;
}
.menu-top img{
	height: 180px;
}

.slide:hover .concept{
  opacity: .9;
}

.site-title img {
	width: auto;
	height: 150px;
	background: rgba(0,0,0,0.03); /* 帯の透明度 */
	border-top-left-radius: 47% 47%;
	border-top-right-radius: 47% 47%;
	border-bottom-right-radius: 50% 50%;
	border-bottom-left-radius: 50% 50%;
}

/* スライドショー */
.slide {
	margin-top: 20px;
	position: relative;
	max-width: 100%;
	margin-left:auto;
	margin-right:auto;
	text-align: center;
	left: 0;
	right: 0;
	margin: auto;
}

.slideimage {
	position: relative;
	max-width: 100%;
}

.slide .concept {
	position: absolute;
	display: inline-block;
	left: 0;
	right: 0;
	margin: auto;
/*	bottom: 50%; */
	max-width: 100%;
	height: auto;
	color: #fff;
/*	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;*/
	text-shadow: 0px 0px 4px #000000;
	font-size: 1.2rem;
	font-weight: normal;
	padding: 0 0 0 0;
	line-height: 1.5;
	letter-spacing: 0.07em;
	opacity: 0;
	transition: 2s cubic-bezier(.17,.67,.83,.67);
	text-align: left;
	background: rgba(0,0,0,0.1); /* 帯の透明度 */
}
.slide .concept h2{
/*	text-decoration:underline;*/
	color: #FFF;
	opacity: .9;
	font-size: 1.1rem;
	text-align: center;
}

.text-combine {
  -webkit-text-combine: horizontal;
  -ms-text-combine-horizontal: all;
  text-combine-upright: all;
}

@media(max-width: 1200px) {
	.site-title img {
		height: 130px;
	}
	.slide .concept {
		font-size: 1rem;
/*		bottom: 50%;*/
	}
	.menu-top img{
		height: 180px;
	}

}

@media(max-width: 1000px) {
	.site-title img {
		height: 110px;
	}
	.slide .concept {
		font-size: 1rem;
/*		bottom: 40%;*/
	}
	.menu-top img{
		height: 160px;
	}
}

@media(max-width: 800px) {
	.site-title img {
		height: 100px;
	}
	.slide .concept {
		font-size: 1rem;
		bottom: 40%;
	}
	.menu-top img{
		height: 150px;
	}
}

@media(max-width: 600px) {
	.site-title img {
		height: 90px;
	}
	.slide .concept {
		font-size: .8rem;
		height: 40%;
		text-align: left;
	}
	.menu-top img{
		height: 110px;
	}
}

@media(max-width: 400px) {
	.site-title img {
		height: 70px;
	}
	.slide .concept {
		font-size: .6rem;
		text-align: left;
	}
	.menu-top img{
		height: 100px;
	}
}

@media(max-width: 300px) {
	.site-title img {
		height: 50px;
	}
	.slide .concept {
		font-size: .5rem;
		text-align: left;
	}
	.menu-top img{
		height: 80px;
	}
}

@keyframes slideshow {
	0%{
		opacity: 0;
	}
	10%{
		opacity: 1;
	}
	20%{
		opacity: 1
	}
	30%{
		opacity: 0;
	}
	100%{
		opacity: 0;
	}
}

.slide img {
	position: absolute;
	width: 100vw;
	left: 0;
	height: auto;
	opacity: 0;
	animation :slideshow 32s linear infinite;
	transform: translateX(0%);
}

.slide img:nth-child(2){
	animation-delay: 8s;
}
 
.slide img:nth-child(3){
	animation-delay: 16s;
}

.slide img:nth-child(4){
	animation-delay: 24s;
}
 
.slide img:last-child{
	animation-delay: 0s;
}
.contents-board {
	display: inline-block;
	max-width: 95%;
	text-align: center;
	vertical-align: top;
}

/* トップページのコンテンツトップ */
/* イベント */
.event-board{
	display: inline-grid;
	display: -ms-inline-grid;
	grid-template-rows: 1fr 3fr;
	grid-template-columns: 1fr 1fr;
	grid-template-areas: "evetitle evetitle"
						"evedescription eveimage";
	-ms-grid-template-rows: 1fr 3fr;
	-ms-grid-template-columns: 1fr 1fr;
	justify-content: center;
	align-items: center;
	margin-left: 10px;
	margin-right: 20px;
	max-width: 700px;
}

.event-board-title {
	grid-area: evetitle;
	-ms-grid-column: 1;
	-ms-grid-column-span: 2;
	-ms-grid-row: 1;
	letter-spacing: .05em;
	display: inline-block;
	text-align: center;
	max-width: 90%;
}
.event-board-title h2 {
	font-size: 1.1rem;
	display: block;
	position: relative;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	margin-top: .3em;
	padding: 0 2em;
	color: rgba(255,255,255,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.event-board-title h2 {
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
		text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	}
}
.event-board-title h2:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.event-board-title h2:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.event-board-title h2:before{
	left: -.5em;
	transform: rotate(45deg);
}
.event-board-title h2:after{
	top:.01em;
	right: -.52em;
	transform: rotate(-135deg);
}

.event-board-image{
	grid-area: eveimage;
	-ms-grid-column: 2;
	-ms-grid-row: 2;
}
.event-board-image img{
/*	filter: sepia(50%);*/
	border-radius: 10%;
}

.event-board p{
	grid-area: evedescription;
	-ms-grid-column: 1;
	-ms-grid-row: 2;
	color: rgba(255,255,255,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	text-align: left;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.event-board p{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
		text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	}
}
/* できたて */
.fresh-board{
	display: inline-grid;
	display: -ms-inline-grid;
	grid-template-rows: 1fr 1fr 1fr 3fr;
	grid-template-columns: 9fr 8fr;
	grid-template-areas: "freshtitle freshtitle"
						"freshimage freshproduct"
						"freshimage freshprice"
						"freshimage freshdescription";
	-ms-grid-template-rows: 1fr 1fr 1fr 3fr;
	-ms-grid-template-columns: 9fr 8fr;
	justify-content: center;
	align-items: center;
	margin-left: 10px;
	margin-right: 20px;
	max-width: 700px;
	row-gap: 10px;
}

/*
.fresh-board-title{
	grid-area: title;
}

.fresh-board-title h2{
	font-size: 1.3em;
	text-shadow: 8px 8px 8px rgba(235,78,128,0.3); 
	background: url(images/text-color-pink.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	text-align: center;
	transform: rotate(-10deg);
}
*/
.fresh-board-title {
	grid-area: freshtitle;
	-ms-grid-column: 1;
	-ms-grid-column-span: 2;
	-ms-grid-row: 1;
	-ms-grid-row-span: 1;
	letter-spacing: .05em;
	display: inline-block;
	text-align: center;
	max-width: 100%;
}
.fresh-board-title h2 {
	font-size: 1.1rem;
	display: block;
	position: relative;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	margin-top: .3em;
	padding: 0 2em;
	color: rgba(255,255,255,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.fresh-board-title h2 {
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
		text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	}
}
.fresh-board-title h2:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.fresh-board-title h2:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.fresh-board-title h2:before{
	left: -.5em;
	transform: rotate(45deg);
}
.fresh-board-title h2:after{
	top:.01em;
	right: -.52em;
	transform: rotate(-135deg);
}

.fresh-board-youtube{
	grid-area: freshimage;
	-ms-grid-column: 1;
	-ms-grid-row: 2;
	-ms-grid-row-span: 3;
}

.fresh-board-youtube iframe{
	width: 90%;
	height: 100%;
}

.fresh-board-youtube p{
	display: none;
}

.fresh-board-productname{
	grid-area: freshproduct;
	-ms-grid-column: 2;
	-ms-grid-row: 2;
	-ms-grid-row-span: 1;
}

.fresh-board-price{
	grid-area: freshprice;
	-ms-grid-column: 2;
	-ms-grid-row: 3;
	-ms-grid-row-span: 1;
	color: rgba(255,255,0,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	text-align: right;
	font-size: 1.1em;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.fresh-board-price{
		background: url(images/text-color-yellow.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
		text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	}
}

.fresh-board-productname h3{
	color: rgba(255,255,0,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	text-align: left;
	font-size: 1.1em;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.fresh-board-productname h3{
		background: url(images/text-color-yellow.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
		text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	}
}

.fresh-board p{
	grid-area: freshdescription;
	-ms-grid-column: 2;
	-ms-grid-row: 4;
	-ms-grid-row-span: 1;
	color: rgba(255,255,255,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	text-align: left;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.fresh-board p{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
		text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	}
}
/* おすすめ */
.rec-board{
	display: inline-grid;
	display: -ms-inline-grid;
	grid-template-rows: 1fr 1fr 1fr 3fr;
	grid-template-columns: 8fr 9fr;
	grid-template-areas: "rectitle       rectitle" 
						 "recproduct     recimage"
						 "recprice       recimage"
						 "recdescription recimage";
	-ms-grid-template-rows: 1fr 1fr 1fr 3fr;
	-ms-grid-template-columns: 8fr 9fr;
	justify-content: center;
	align-items: center;
	margin-left: 10px;
	margin-right: 20px;
	max-width: 700px;
	row-gap: 10px;
}

.rec-board-title{
	grid-area: rectitle;
	-ms-grid-column: 1;
	-ms-grid-row: 1;
	-ms-grid-column-span: 2;
	letter-spacing: .05em;
	display: inline-block;
	text-align: center;
	max-width: 100%;
}

.rec-board-title h2{
	font-size: 1.1rem;
	display: block;
	position: relative;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	margin-top: .3em;
	padding: 0 2em;
	color: rgba(255,255,255,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.rec-board-title h2{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.rec-board-title h2:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.rec-board-title h2:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.rec-board-title h2:before{
	left: -.5em;
	transform: rotate(45deg);
}
.rec-board-title h2:after{
	top:.01em;
	right: -.52em;
	transform: rotate(-135deg);
}

.rec-board-image{
	grid-area: recimage;
	-ms-grid-column: 2;
	-ms-grid-row: 2;
	-ms-grid-row-span: 3;
}
.rec-board-image img{
/*	filter: sepia(80%);*/
	border-radius: 10%;
}

.rec-board-productname{
	grid-area: recproduct;
	-ms-grid-column: 1;
	-ms-grid-row: 2;
}

.rec-board-price{
	grid-area: recprice;
	-ms-grid-column: 1;
	-ms-grid-row: 3;
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	color: rgba(255,255,0,0.85);
	text-align: right;
	font-size: 1.1em;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.rec-board-price{
		background: url(images/text-color-yellow.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}

.rec-board-productname h3{
	color: rgba(255,255,0,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	text-align: left;
	font-size: 1.1em;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.rec-board-productname h3{
		background: url(images/text-color-yellow.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.rec-board p{
	grid-area: recdescription;
	-ms-grid-column: 1;
	-ms-grid-row: 4;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	text-align: left;
	color: rgba(255,255,255,0.85);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.rec-board p{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
/* おすすめ２行目 */
.srec-board{
	display: inline-grid;
	display: -ms-inline-grid;
	grid-template-rows: 1fr 1fr 1fr 3fr;
	grid-template-columns: 9fr 8fr;
	grid-template-areas: "srectitle srectitle"
						 "srecimage srecproduct"
						 "srecimage srecprice"
						 "srecimage srecdescription";
	-ms-grid-template-rows: 1fr 1fr 1fr 3fr;
	-ms-grid-template-columns: 9fr 8fr;
	justify-content: center;
	align-items: center;
	margin-left: 10px;
	margin-bottom: 20px;
	margin-right: 20px;
	max-width: 700px;
}

.srec-board-title{
	grid-area: srectitle;
	-ms-grid-column: 1;
	-ms-grid-row: 1;
	-ms-grid-column-span: 2;
	letter-spacing: .05em;
	display: inline-block;
	text-align: center;
	max-width: 100%;
}

.srec-board-title h2{
	font-size: 1.1rem;
	display: block;
	position: relative;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	margin-top: .3em;
	padding: 0 2em;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	color: rgba(255,255,255,0.85);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.srec-board-title h2{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.srec-board-title h2:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.srec-board-title h2:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.srec-board-title h2:before{
	left: -.5em;
	transform: rotate(45deg);
}
.srec-board-title h2:after{
	top:.01em;
	right: -.52em;
	transform: rotate(-135deg);
}

.srec-board-image{
	grid-area: srecimage;
	-ms-grid-column: 1;
	-ms-grid-row: 2;
	-ms-grid-row-span: 3;
}
.srec-board-image img{
/*	filter: sepia(50%);*/
	border-radius: 10%;
}


.srec-board-productname{
	grid-area: srecproduct;
	-ms-grid-column: 2;
	-ms-grid-row: 2;
}

.srec-board-price{
	grid-area: srecprice;
	-ms-grid-column: 2;
	-ms-grid-row: 3;
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	text-align: right;
	font-size: 1.1em;
	color: rgba(255,255,0,0.85);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.srec-board-price{
		background: url(images/text-color-yellow.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}

.srec-board-productname h3{
	color: rgba(255,255,0,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	text-align: left;
	font-size: 1.1em;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.srec-board-productname h3{
		background: url(images/text-color-yellow.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}

.srec-board p{
	grid-area: srecdescription;
	-ms-grid-column: 2;
	-ms-grid-row: 4;
	color: rgba(255,255,255,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	text-align: left;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.srec-board p{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}

/* お知らせ */
.info-board-space{
	clear: both;
	display: block;
	margin-left:auto;
	margin-right:auto;
	text-align: center;
	width: 95%;
}
.info-board-space>h2{
	font-size: 1.1rem;
	display: block;
	position: relative;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	margin-top: .3em;
	padding: 0 2em;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	color: rgba(255,255,255,0.85);
	max-width: 100%;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.info-board-space>h2{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.info-board-space>h2:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.info-board-space>h2:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.info-board-space>h2:before{
	left: -.5em;
	transform: rotate(45deg);
}
.info-board-space>h2:after{
	top:.01em;
	right: -.52em;
	transform: rotate(-135deg);
}

.info-board{
	display: inline-grid;
	display: -ms-inline-grid;
/*	grid-template-rows: 1fr 1fr 3fr 1fr;
	grid-template-columns: 7fr 8fr;*/
	grid-template-rows: 1fr 4fr;
	grid-template-columns: 6fr 2fr 13fr;
	grid-template-areas: "infodate  infotitle infotitle"
						 "infoimage infoimage infoinfo";
/*	grid-template-areas: "infoimage infodate"
						 "infoimage infotitle"
						 "infoimage infoinfo"
						 "infoimage infotag";
	grid-template-areas: "infodate infotitle infotitle"
						 "infoimage infoimage infoinfo"
						 "infoimage infoimage infotag";
*//*	-ms-grid-template-rows: 1fr 1fr 3fr 1fr;
	-ms-grid-template-columns: 7fr 8fr;*/
	-ms-grid-template-rows: 1fr 3fr 1fr;
	-ms-grid-template-columns: 3fr 1fr 5fr;
	column-gap: 10px;
	justify-content: center;
	align-items: center;
	margin-left: 20px;
	margin-top: 5px;
	margin-right: 20px;
	max-width: 100%;
}

.info-board-date{
	grid-area: infodate;
	-ms-grid-column: 1;
	-ms-grid-row: 1;
	text-align: left;
}

.info-board-title{
	grid-area: infotitle;
	-ms-grid-column: 2;
	-ms-grid-row: 1;
	-ms-grid-column-span: 2;
}

.info-board-title h3{
	font-size: 1.1em;
	margin: 10px;
	text-align: left;
	color: rgba(235,78,128,0.85);
	text-shadow: 8px 8px 8px rgba(235,78,128,0.3); 
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.info-board-title h3{
		background: url(images/text-color-pink.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
@media(max-width: 600px) {
	.info-board-date h2{
		font-size: 0.9em;
	}
	.info-board-title h3{
		font-size: 1.0em!important;
	}
}

.info-board-image{
	grid-area: infoimage;
	-ms-grid-column: 1;
	-ms-grid-row: 2;
	-ms-grid-column-span: 2;
}
.info-board-image img{
	border-radius: 10%;
	max-width: 100%;
	max-height: 250px;
}
.info-board p{
	grid-area: infoinfo;
	-ms-grid-column: 3;
	-ms-grid-row: 2;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	text-align: left;
	color: rgba(255,255,255,0.85);
}
.info-board-tag{
	grid-area: infotag;
	-ms-grid-column: 3;
	-ms-grid-row: 3;
	text-shadow: 8px 8px 8px rgba(0,157,191,0.3); 
	text-align: left;
	color: rgba(0,157,191,0.85);
}
.info-board-tag::before {
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	content: '\f02c';
}
.info-board-tag a{
	grid-area: infotag;
	-ms-grid-column: 3;
	-ms-grid-row: 3;
	text-shadow: 8px 8px 8px rgba(0,157,191,0.3); 
	text-align: left;
	color: rgba(0,157,191,0.85);
}

@supports (background-clip: text) or (-webkit-background-clip: text) {
	.info-board-tag{
		background: url(images/text-color-blue.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
	.info-board-tag a{
		background: url(images/text-color-blue.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
	.info-board p{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
/* メニュー */
.menu-board{
	display: inline-grid;
	display: -ms-inline-grid;
	grid-template-rows: 1fr 1fr 1fr 3fr;
	grid-template-columns: 9fr 8fr;
	grid-template-areas: "menutitle menutitle"
						 "menuimage menuproduct"
						 "menuimage menuprice"
						 "menuimage menudescription";
	-ms-grid-template-rows: 1fr 1fr 1fr 3fr;
	-ms-grid-template-columns: 9fr 8fr;
	justify-content: center;
	align-items: center;
	margin-left: 10px;
	margin-right: 20px;
	max-width: 700px;
}
@media(max-width: 800px) {
	.menu-board{
		grid-template-areas: "menutitle menutitle"
							 "menuproduct menuproduct"
							 "menuimage menuprice"
							 "menuimage menudescription";
	}
}
.menu-board-title{
	grid-area: menutitle;
	-ms-grid-column: 1;
	-ms-grid-row: 1;
	-ms-grid-column-span: 2;
	letter-spacing: .05em;
	display: inline-block;
	text-align: center;
	max-width: 90%;
}

.menu-board-title h2{
	font-size: 1.1rem;
	display: block;
	position: relative;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	margin-top: .3em;
	padding: 0 2em;
	color: rgba(255,255,255,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.menu-board-title h2{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.menu-board-title h2:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.menu-board-title h2:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.menu-board-title h2:before{
	left: -.5em;
	transform: rotate(45deg);
}
.menu-board-title h2:after{
	top:.01em;
	right: -.52em;
	transform: rotate(-135deg);
}
.menu-board-image{
	grid-area: menuimage;
	-ms-grid-column: 1;
	-ms-grid-row: 2;
	-ms-grid-row-span: 3;
}
.menu-board-image img{
/*	filter: sepia(50%);*/
	border-radius: 10%;
}


.menu-board-productname{
	grid-area: menuproduct;
	-ms-grid-column: 2;
	-ms-grid-row: 2;
}
@media(max-width: 800px) {
	.menu-board-productname{
		-ms-grid-column: 1;
		-ms-grid-row: 2;
		-ms-grid-column-span: 2;
	}
}

.menu-board-price{
	grid-area: menuprice;
	-ms-grid-column: 2;
	-ms-grid-row: 3;
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	text-align: right;
	font-size: 1.1em;
	color: rgba(255,255,0,0.85);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.menu-board-price{
		background: url(images/text-color-yellow.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.menu-board-productname h3{
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	color: rgba(255,255,0,0.85);
	text-align: left;
	font-size: 1.1em;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.menu-board-productname h3{
		background: url(images/text-color-yellow.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.menu-board p{
	grid-area: menudescription;
	-ms-grid-column: 2;
	-ms-grid-row: 4;
	color: rgba(255,255,255,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	text-align: left;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.menu-board p{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
/* メニュー２行目 */
.smenu-board{
	display: inline-grid;
	display: -ms-inline-grid;
	grid-template-rows: 1fr 1fr 1fr 3fr;
	grid-template-columns: 8fr 9fr;
	grid-template-areas: "smenutitle       smenutitle" 
						 "smenuproduct     smenuimage"
						 "smenuprice       smenuimage"
						 "smenudescription smenuimage";
	-ms-grid-template-rows: 1fr 1fr 1fr 3fr;
	-ms-grid-template-columns: 8fr 9fr;
	justify-content: center;
	align-items: center;
	margin-bottom: 20px;
	margin-right: 20px;
	max-width: 700px;
}
@media(max-width: 800px) {
	.smenu-board{
		grid-template-areas: "smenutitle       smenutitle" 
							 "smenuproduct     smenuproduct"
							 "smenuprice       smenuimage"
							 "smenudescription smenuimage";
	}
}

.smenu-board-title{
	grid-area: smenutitle;
	-ms-grid-column: 1;
	-ms-grid-row: 1;
	-ms-grid-column-span: 2;
}

.smenu-board-title h2{
	font-size: 1.6em;
	color: rgba(235,78,128,0.85);
	text-shadow: 8px 8px 8px rgba(235,78,128,0.3); 
	text-align: center;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.smenu-board-title h2{
		background: url(images/text-color-pink.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.smenu-board-image{
	grid-area: smenuimage;
	-ms-grid-column: 2;
	-ms-grid-row: 2;
	-ms-grid-row-span: 3;
}
.smenu-board-image img{
/*	filter: sepia(50%);*/
	border-radius: 10%;
}

.smenu-board-productname{
	grid-area: smenuproduct;
	-ms-grid-column: 1;
	-ms-grid-row: 2;
}
@media(max-width: 800px) {
	.smenu-board-productname{
		-ms-grid-column: 1;
		-ms-grid-row: 2;
		-ms-grid-column-span: 2;
	}
}

.smenu-board-price{
	grid-area: smenuprice;
	-ms-grid-column: 1;
	-ms-grid-row: 3;
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	text-align: right;
	font-size: 1.1em;
	color: rgba(255,255,0,0.85);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.smenu-board-price{
		background: url(images/text-color-yellow.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.smenu-board-productname h3{
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	text-align: left;
	font-size: 1.1em;
	color: rgba(255,255,0,0.85);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.smenu-board-productname h3{
		background: url(images/text-color-yellow.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.smenu-board p{
	grid-area: smenudescription;
	-ms-grid-column: 1;
	-ms-grid-row: 4;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	text-align: left;
	color: rgba(255,255,255,0.85);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.smenu-board p{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
/* サイドメニュー */
.setmenu-board-space{
	clear: both;
	display: block;
	margin-left:auto;
	margin-right:auto;
	text-align: center;
}

.setmenu-board-space>h2{
	font-size: 1.1rem;
	display: block;
	position: relative;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	margin-top: .3em;
	padding: 0 2em;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	color: rgba(255,255,255,0.85);
	max-width: 100%;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.setmenu-board-space>h2{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.setmenu-board-space>h2:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.setmenu-board-space>h2:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.setmenu-board-space>h2:before{
	left: -.5em;
	transform: rotate(45deg);
}
.setmenu-board-space>h2:after{
	top:.01em;
	right: -.52em;
	transform: rotate(-135deg);
}

.setmenu-board{
	display: inline-grid;
	display: -ms-inline-grid;
	grid-template-rows: 1fr 1fr 1fr 3fr;
	grid-template-columns: 9fr 8fr;
	grid-template-areas: "setmenutitle setmenutitle"
						 "setmenuimage setmenuproduct"
						 "setmenuimage setmenuprice"
						 "setmenuimage setmenudescription";
	-ms-grid-template-rows: 1fr 1fr 1fr 3fr;
	-ms-grid-template-columns: 9fr 8fr;
	justify-content: center;
	align-items: center;
	margin-left: 10px;
	margin-right: 20px;
	max-width: 700px;
}
@media(max-width: 800px) {
	.setmenu-board{
		grid-template-areas: "setmenutitle setmenutitle"
							 "setmenuproduct setmenuproduct"
							 "setmenuimage setmenuprice"
							 "setmenuimage setmenudescription";
	}
}

.setmenu-board-title{
	grid-area: setmenutitle;
	-ms-grid-column: 1;
	-ms-grid-row: 1;
	-ms-grid-column-span: 2;
	letter-spacing: .05em;
	display: inline-block;
	text-align: center;
	width: 90%;
}

.setmenu-board-title h2{
	font-size: 1.1rem;
	display: block;
	position: relative;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	margin-top: .3em;
	padding: 0 2em;
	color: rgba(255,255,255,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.setmenu-board-title h2{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.setmenu-board-title h2:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.setmenu-board-title h2:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.setmenu-board-title h2:before{
	left: -.5em;
	transform: rotate(45deg);
}
.setmenu-board-title h2:after{
	top:.01em;
	right: -.52em;
	transform: rotate(-135deg);
}
.setmenu-board-image{
	grid-area: setmenuimage;
	-ms-grid-column: 1;
	-ms-grid-row: 2;
	-ms-grid-row-span: 3;
}
.setmenu-board-image img{
/*	filter: sepia(50%);*/
	border-radius: 10%;
}


.setmenu-board-productname{
	grid-area: setmenuproduct;
	-ms-grid-column: 2;
	-ms-grid-row: 2;
}
@media(max-width: 800px) {
	.setmenu-board-productname{
		-ms-grid-column: 1;
		-ms-grid-row: 2;
		-ms-grid-column-span: 2;
	}
}

.setmenu-board-price{
	grid-area: setmenuprice;
	-ms-grid-column: 2;
	-ms-grid-row: 3;
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	text-align: right;
	font-size: 1.1em;
	color: rgba(255,255,0,0.85);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.setmenu-board-price{
		background: url(images/text-color-yellow.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.setmenu-board-productname h3{
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	color: rgba(255,255,0,0.85);
	text-align: left;
	font-size: 1.1em;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.setmenu-board-productname h3{
		background: url(images/text-color-yellow.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.setmenu-board p{
	grid-area: setmenudescription;
	-ms-grid-column: 2;
	-ms-grid-row: 4;
	color: rgba(255,255,255,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	text-align: left;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.setmenu-board p{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
/* メニュー２行目 */
.ssetmenu-board{
	display: inline-grid;
	display: -ms-inline-grid;
	grid-template-rows: 1fr 1fr 1fr 3fr;
	grid-template-columns: 8fr 9fr;
	grid-template-areas: "ssetmenutitle       ssetmenutitle" 
						 "ssetmenuproduct     ssetmenuimage"
						 "ssetmenuprice       ssetmenuimage"
						 "ssetmenudescription ssetmenuimage";
	-ms-grid-template-rows: 1fr 1fr 1fr 3fr;
	-ms-grid-template-columns: 8fr 9fr;
	justify-content: center;
	align-items: center;
	margin-bottom: 20px;
	margin-right: 20px;
	max-width: 700px;
}
@media(max-width: 800px) {
	.ssetmenu-board{
		grid-template-areas: "ssetmenutitle       ssetmenutitle" 
							 "ssetmenuproduct     ssetmenuproduct"
							 "ssetmenuprice       ssetmenuimage"
							 "ssetmenudescription ssetmenuimage";
	}
}

.ssetmenu-board-title{
	grid-area: ssetmenutitle;
	-ms-grid-column: 1;
	-ms-grid-row: 1;
	-ms-grid-column-span: 2;
	letter-spacing: .05em;
	display: inline-block;
	text-align: center;
	width: 90%;
}

.ssetmenu-board-title h2{
	font-size: 1.1rem;
	display: block;
	position: relative;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	margin-top: .3em;
	padding: 0 2em;
	color: rgba(255,255,255,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.ssetmenu-board-title h2{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.ssetmenu-board-title h2:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.ssetmenu-board-title h2:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.ssetmenu-board-title h2:before{
	left: -.5em;
	transform: rotate(45deg);
}
.ssetmenu-board-title h2:after{
	top:.01em;
	right: -.52em;
	transform: rotate(-135deg);
}
.ssetmenu-board-image{
	grid-area: ssetmenuimage;
	-ms-grid-column: 2;
	-ms-grid-row: 2;
	-ms-grid-row-span: 3;
}
.ssetmenu-board-image img{
/*	filter: sepia(50%);*/
	border-radius: 10%;
}

.ssetmenu-board-productname{
	grid-area: ssetmenuproduct;
	-ms-grid-column: 1;
	-ms-grid-row: 2;
}
@media(max-width: 800px) {
	.ssetmenu-board-productname{
		-ms-grid-column: 1;
		-ms-grid-row: 2;
		-ms-grid-column-span: 2;
	}
}

.ssetmenu-board-price{
	grid-area: ssetmenuprice;
	-ms-grid-column: 1;
	-ms-grid-row: 3;
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	text-align: right;
	font-size: 1.1em;
	color: rgba(255,255,0,0.85);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.ssetmenu-board-price{
		background: url(images/text-color-yellow.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.ssetmenu-board-productname h3{
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	text-align: left;
	font-size: 1.1em;
	color: rgba(255,255,0,0.85);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.ssetmenu-board-productname h3{
		background: url(images/text-color-yellow.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.ssetmenu-board p{
	grid-area: ssetmenudescription;
	-ms-grid-column: 1;
	-ms-grid-row: 4;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	text-align: left;
	color: rgba(255,255,255,0.85);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.ssetmenu-board p{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}

/* メニュー詳細 */
.dmenu-board{
	display: inline-grid;
	display: -ms-inline-grid;
	grid-template-rows: 1fr 1fr 3fr 1fr;
	grid-template-columns: 9fr 8fr;
	grid-template-areas: "dmenuimage dmenuproduct"
						 "dmenuimage dmenuprice"
						 "dmenuimage dmenudescription"
						 "dmenutitle dmenutitle";
	-ms-grid-template-rows: 1fr 1fr 3fr 1fr;
	-ms-grid-template-columns: 9fr 8fr;
	justify-content: center;
	align-items: center;
	margin-top: 10px;
	margin-left: 10px;
	margin-right: 20px;
	margin-bottom: 10px;
	max-width: 700px;
}
@media(max-width: 800px) {
	.dmenu-board{
		grid-template-areas: "dmenuproduct dmenuproduct"
							 "dmenuimage dmenuprice"
							 "dmenuimage dmenudescription"
							 "dmenutitle dmenutitle";
	}
}


.dmenu-board-title{
	grid-area: dmenutitle;
	-ms-grid-column: 1;
	-ms-grid-row: 1;
	-ms-grid-column-span: 2;
	letter-spacing: .05em;
	display: inline-block;
	text-align: center;
	max-width: 90%;
}

.dmenu-board-title p{
	font-size: 1.0rem;
	display: block;
	position: relative;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	margin-top: .3em;
	padding: 0 2em;
	color: rgba(255,255,255,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.dmenu-board-title p{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.dmenu-board-title p:after{
	position: absolute;
	content: '栄養情報';
	background: rgba(255,140,0,0.9);
	color: #fff;
	left: 0px;
	bottom: 100%;
	border-radius: 5px 5px 0 0;
	padding: 5px 7px 3px;
	font-size: 0.7rem;
	line-height: 1;
	letter-spacing: 0.05em;
}
.dmenu-board-image{
	grid-area: dmenuimage;
	-ms-grid-column: 1;
	-ms-grid-row: 2;
	-ms-grid-row-span: 3;
}
.dmenu-board-image img{
	border-radius: 10%;
}

.dmenu-board-productname{
	grid-area: dmenuproduct;
	-ms-grid-column: 2;
	-ms-grid-row: 2;
}
@media(max-width: 800px) {
	.dmenu-board-productname{
		-ms-grid-column: 1;
		-ms-grid-row: 2;
		-ms-grid-column-span: 2;
	}
}

.dmenu-board-price{
	grid-area: dmenuprice;
	-ms-grid-column: 2;
	-ms-grid-row: 3;
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	text-align: right;
	font-size: 1.1em;
	color: rgba(255,255,0,0.85);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.dmenu-board-price{
		background: url(images/text-color-yellow.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.dmenu-board-productname h1{
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3);
	color: rgba(255,255,0,0.85);
	text-align: left;
	font-size: 1.1em;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.dmenu-board-productname h1{
		background: url(images/text-color-yellow.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.dmenu-board p{
	grid-area: dmenudescription;
	-ms-grid-column: 2;
	-ms-grid-row: 4;
	color: rgba(255,255,255,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
	text-align: left;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.dmenu-board p{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}


.top-contents-board {
	display: inline-block;
	max-width: 95%;
	background-color: rgba(255,255,255,0);
	text-align: center;
	vertical-align: top;
	margin-top: 20px;
}
.menu_paper_fresh {
	max-width: 95%; /* 紙の横幅 100%にすると全幅表示に */
	padding: 15px;
	margin: 0em auto;
	background: rgba(29,84,63,0); /* 紙の色 */
	color: rgba(255,255,255,0.85);/* 文字色 */
	font-weight: bold; /*太字に*/
	word-break: break-all;
}
.menu_paper_fresh p {
	margin: 0; 
	padding: 0;
	font-size: 1.1em;
	text-align: left;
	background: url(images/text-color.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3); 
}
.menu_paper_fresh_tape {
	width: 50%;
	height: 35px;
	margin: -25px auto 0;
	background: rgba(255, 240, 200, 0.3);/* テープの色 */
	transform: rotate(2deg);
	opacity: 0.9;
}
.menu_paper_fresh_subtitle {
	text-align: center;
	font-size: 1.1em!important;
	margin-bottom: 1em!important;
}

.menu_paper_fresh_subtitle h3 {
	background: url(images/text-color-yellow.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3); 
}

.menu_paper_fresh_title {
	text-align: center;
	margin-top: 10px!important;
	clear: both;
	display: inline-block;
	position: relative;
}

.menu_paper_fresh_title h2 {
	background: url(images/text-color-yellow.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	position: relative;
	display: inline-block;
	padding: 0 55px;
	font-size: 1.8em!important;
	font-weight: bold; /*太字に*/
	text-shadow: 8px 8px 8px rgba(255,255,0,0.3); 
}

.freshmsg {
	display: inline-block;
	width: 50%;
}

/*
.menu_paper_fresh_title h2:before {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 50px;
  height: 1px;
  background-color: white;
}

.menu_paper_fresh_title h2:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 50px;
  height: 1px;
  background-color: white;
}

.menu_paper_fresh_title h2:before {
  left:0;
}
.menu_paper_fresh_title h2:after {
  right: 0;
}
*/
/*
.menu_fresh {
	display: inline-block;
	max-width: 95%;
	margin: 10px 10px 10px 10px;
	padding: 15px;
	background: rgba(29,84,63,1);
	background: rgba(102,0,8,1);
	color: rgba(0,0,0,0.85);
	font-weight: normal;
	box-shadow: 4px 4px 4px rgba(0,0,0,0.7);transform:rotate(0deg);
	word-break: break-all;
}
.menu_fresh p {
	display: inline-block;
	margin: 0; 
	padding: 0;
	font-size: 0.9em;
	text-align: left;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	text-orientation: upright;
	color: transparent;
	text-shadow: 3px 3px #fff, 4px 4px 0 #5d6f77, 4px 2px 0 #5d6f77, 2px 4px 0 #5d6f77, 2px 2px 0 #5d6f77;
	color: rgba(255,255,255,0.85);
}
.menu_fresh_tape {
  width: 0;
  height: 0;
  border-left: 30px solid transparent;
  border-right: 30px solid transparent;
  border-top: 30px solid black;
    margin: -50px -40px 0;
    width: 20%;
    height: 100px;
    margin: -70px -80px 0;
    background: rgba(251, 234, 144, 0.5);
    transform: rotate(-0deg);
    opacity: 0.9;
	border-left: 100% solid #F00;
	border-right: 100px solid #F00;
	border-top: 50px solid transparent;
	border-bottom: 50px solid transparent;
}
.menu_fresh_subtitle {
	text-align: center;
	margin-bottom: 1em!important;
	clear: both;
}

.menu_fresh_subtitle h3 {
	color: rgba(255,255,255,0.85);
	font-size: 1.1em!important;
}

.menu_fresh_title {
	text-align: left;
	margin-top: 10px!important;
	clear: both;
	display: inline-block;
	position: relative;
}

.menu_fresh_title h2 {
	color: rgba(255,255,255,0.85);
	position: relative;
	display: inline-block;
	padding: 0 55px;
	font-size: 1.1em!important;
}

.menu_fresh_title h2:before {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 50px;
  height: 1px;
  background-color: rgba(255,255,255,0.85);
}

.menu_fresh_title h2:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 50px;
  height: 1px;
  background-color: rgba(255,255,255,0.85);
}

.menu_fresh_title h2:before {
  left:0;
}
.menu_fresh_title h2:after {
  right: 0;
}
*/

.accessmap{
	position: relative;
	display: block;
	max-width: 100%;
	height: auto;
	font-size: 0.8rem;
	margin: 20px;
}
.accessmap iframe{
	height: 350px;
	width: 550px;
}
.accessmap:after{
	position: absolute;
	content: 'アクセス';
	background: #FF8300;
	color: #fff;
	left: 0px;
	bottom: 100%;
	border-radius: 5px 5px 0 0;
	padding: 5px 7px 3px;
	font-size: 0.7rem;
	line-height: 1;
	letter-spacing: 0.05em;
}
.openday{
	position: relative;
	display: block;
	max-width: 100%;
	height: auto;
	font-size: 0.8rem;
	margin-top: 50px;
}

.opentimetitle{
	position: absolute;
	top: 15px;
	right: 195px;
	max-width: 100%;
/*  border-top: solid 2px #80c8d1;
  border-bottom: solid 2px #80c8d1; */
/*  background: #f4f4f4; 
	background: #f4f4f4; */
  background: url(images/text-color-blue.gif);
  background-size: contain;
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
	line-height: 1.4;
	padding: 0.4em 0.5em;
/*	margin: 2em 0 0.5em;*/
	font-size: 1.0rem;
}
.wordsearch{
	position: absolute;
	top: 15px;
	right: 0;
	width: 100%;
	text-align: left;
	line-height: 1.4;
	padding: 0.4em 0.5em;
	font-size: 1.0rem;
	color: rgba(0,0,0,0.85); 
/*	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);*/
}
/*
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.opentime{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
*/
/*
.opentime:after {
	position: absolute;
	content: '営業時間・定休日';
	left: 0px;
	bottom: 100%;
	border-radius: 5px 5px 0 0;
	padding: 5px 7px 3px;
	font-size: 0.7rem;
	line-height: 1;
	letter-spacing: 0.05em;
}
*/
.header-inner .todayinfo{
	position: absolute;
	top: 0;
	right: 0;
	color: rgba(255,255,255,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3); 
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.header-inner .todayinfo{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
@media(max-width: 600px) {
	.opentime, .todayinfo{
		font-size: 0.8rem;
	}
	.accessmap iframe{
		height: 220px;
		width: 300px;
	}
}
@media(max-width: 400px) {
	.accessmap iframe{
		height: 100px;
		width: 200px;
	}
}

.header-category {
	letter-spacing: .05em;
	display: inline-block;
	text-align: center;
	width: 90%;
}

.header-category h1{
	font-size: 1.1rem;
	display: block;
	position: relative;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	margin-top: .3em;
	padding: 0 2em;
	color: rgba(255,255,255,0.85);
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3);
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.header-category h1{
		background: url(images/text-color.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
	}
}
.header-category h1:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.header-category h1:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 1.05em;
	height: 1.05em;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin: auto; 
}
.header-category h1:before{
	left: -.5em;
	transform: rotate(45deg);
}
.header-category h1:after{
	top:.01em;
	right: -.52em;
	transform: rotate(-135deg);
}

.toptext {
	line-height: 1.5;
	display: inline-block;
	text-decoration: none;
}

.toptext h1 {
	font-size: 1.5rem;
	border-bottom: solid 3px white;
}

.header-nav {
	font-size: 0;
}
 
.header-nav li {
	font-size: 1.0rem;
	display: inline-block;
	margin-right: 1rem;
}
.menu-item-description::before{
	content: '\a';
	white-space: pre;
}
.header-nav li a {
	font-weight: bold;
	display: block;
	text-decoration: none;
	color: #FFF;
}

.header-nav li a:hover {
	opacity: .6;
}
/*ヘッダーメニュー*/
#header-nav {
	display: block !important;
}
.header-nav {
	text-align:center;
	margin: 0 auto;
	padding-right: 10px;
}
.sub_nav {
	font-size: 0.5em;
}

.header-nav ul:after {
	display: block;
	clear: both;
	content: '';
}

.header-nav li {
	display: inline-block;
}

.header-nav li {
	padding: 0px 30px;
	border-left:  #C4C3C3 solid 1px;
}

/*
.menutitle a::before {
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	position: absolute;
	top: 50%;
	right: 1.25rem;
	display: block;
	content: '\f518';
	transform: translateY(-50%);
}
*/
.menu-item .sub-menu {
	position: absolute;
	z-index: 1;
	display: none;
	left: 0px;
	width: auto;
	border: solid 0px;
	background-color: black;
}
.menu .sub-menu {
	display: none;
}

.menu-item .sub-menu li {
	display: block;
	float: none;
	padding: 0;
}

.sidebar-inner .menu .menu-item-has-children:hover .sub-menu {
	display: block;
}
.menu-item .sub-menu li a:before {
	color: #333;
}

.menu-item .sub-menu li a {
	font-size: 1em;
	font-weight: normal;
	margin-left: 10px;
	padding: 10px 30px 10px 10px;
	text-align: left;
	color: rgba(255,255,255,0.85);
}

/* サイドメニュー */
.sidebar-inner {
	position: -webkit-sticky;
	position: sticky;
	top: 0px;
	text-align: center;
}

.navbutton {
	display: none;
}

.sidebar-nav-wrap {
	position: absolute;
	top: 20%;
	right: 0;
	margin-left: 0px;
}
 
.sidebar-nav {
	font-size: 0;
}
 
.sidebar-nav li {
	font-size: .8rem;
}
.sidebar-inner .menu .menu-item a {
	height: auto;
	font-size: 1rem;
	margin-left: 0;
	margin-right: 0;
}
 
.sidebar-inner .menu .menu-item {
	margin:  0;                 /* デフォルトCSS打ち消し */
	font-size:  1rem;           /* 文字サイズ指定 */
	position:  relative;        /* 位置調整 */
	font-weight:  normal;       /* 文字の太さ調整 */
	display:  inline-block;     /* インラインブロックにする */
	background-color: rgba(0,0,0,0);  /* 背景色指定 */
	padding:  5px;             /* 余白指定 */
	margin-bottom: 2px;        /* 周りの余白指定 */
	border-radius:  4px;        /* 角丸指定 */
}

.sidebar-nav li a {
	font-weight: bold;
	display: block;
	text-decoration: none;
	color: #000;
}
 
.sidebar-nav li a:hover {
	opacity: .6;
}
.header-nav-wrap {
	display: inline-block;
	position: relative;
	margin-left: 50px;
}
#searchform{
	position: absolute;
	left: 550px;
	top: -50px;
}

@media(max-width: 700px) {
	.navbutton {
		font-size: 3rem;
		position: absolute;
		z-index: 999;
		top: 0px;
		right: 1.25rem;
		display: block;
		cursor: pointer;
		border: 0;
		background-color: transparent;
		color: white;
	}

	.navbutton:focus {
		outline: 0;
	}

	.site-title-wrap {
		display: block;
		text-align: center;
	}
	
	.header-nav-wrap {
		z-index: 99999;
		position: absolute;
		top: 47px;
		/*ヘッダーの高さと合わせる*/
		right: auto;
		left: 0;
		/* display: none; */
		width: 100%;
		margin-left: 0;
		transform: none;
		background-color: #464646;
		display: none;
	}
/*	.header-nav {
		position: absolute;
		width: 100%;
	}*/
	.header-nav li {
		padding: 0px 30px;
		border-left:  #C4C3C3 solid 0px;
	}
	.header-nav li {
		display: block;
		margin-right: 0;
	}

	.header-nav li a {
		position: relative;
		padding: .8rem 1.25rem;
		color: #fff;
		border-bottom: 1px solid #888;
	}

	.header-nav li a:after {
		font-family: 'Font Awesome 5 Free';
		font-weight: 900;
		position: absolute;
		top: 50%;
		right: 1.25rem;
		display: block;
		content: '\f105';
		transform: translateY(-50%);
	}
	#searchform{
		position: relative;
		display: inline-block;
		left: 0;
		top: 0;
		margin-left: 30px;
		margin-top: 30px;
	}
	.menu-item .sub-menu {
		position: relative;
		z-index: 1;
		display: none;
		left: 0px;
		width: 100%;
		border: solid 1px;
		background-color: #464646;
	}

	.sidebar-nav-wrap {
		z-index: 999;
		top: 500px;
		right: auto;
		left: 0;
		display: none;
		width: 100%;
		margin-left: 0;
		transform: none;
		background-color: #03162f;
	}

	.sidebar-nav li {
		display: block;
		margin-right: 0;
	}

	.sidebar-nav li a {
		position: relative;
		padding: .8rem 1.25rem;
		color: rgba(255,255,255,0.85);
		border-bottom: 1px solid #888;
	}
 /*
  .sidebar-nav li a::after {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    position: absolute;
    top: 50%;
    right: 1.25rem;
    display: block;
    content: '\f518';
    transform: translateY(-50%);
  }
  */
}

@media(max-width: 600px) {
	.site-title a {
		font-size: 2rem;
	}

	.navbutton {
		right: .8rem;
	}

	.sidebar-nav-wrap {
		top: 100px;
	}
 
	.sidebar-nav li a {
		padding: .8rem;
	}

	.sidebar-nav li a::after {
		right: .8rem;
	}
}

/* フッターメニュー */
.adjustspace{
	height: 100px;
}
.footer {
	background: url(images/board-black.png); /* 紙の色 */
	clear: left;
    position:fixed;
    bottom:0;
    left:0;
    width:100%;
}
 
.footer-nav,
.copyright {
	text-align: center;
}
 
.footer-nav {
	font-size: 0;
	margin-bottom: 3rem;
}
 
.footer-nav li {
	font-size: 1rem;
	display: inline-block;
	margin-right: 1.5rem;
}
 
.footer-nav li a {
	text-decoration: none;
	color: rgba(255,255,255,0.85);
}
 
.footer-nav li a:hover {
	opacity: .6;
}
 
.footer-inner .menu .menu-item {
	-ms-writing-mode: lr-tb;
	writing-mode: horizontal-tb;
}
 
.copyright p {
	font-size: 1rem;
	color: rgba(255,255,255,0.85);
}
@media(max-width: 800px) {
	.footer-nav {
		margin-bottom: 1.5rem;
	}

	.footer-nav ul {
		text-align: left;
	}

	.footer-nav li {
		width: 48%;
		margin-right: 4%;
		margin-bottom: 1rem;
	}

	.footer-nav li:nth-of-type(2n) {
		margin-right: 0;
	}
}

/*サイドバーウィジェット*/
.sidebar-wrapper {
	margin-bottom: 2rem;
}
 
.sidebar-title {
	font-size: 1.1rem;
	box-sizing: border-box;
	margin: 0 0 1.2rem;
	padding: .5rem;
	color: #000;
	border-bottom: 4px solid #03162f;
}

/* 記事一覧 */
.article-list {
	margin-bottom: 1rem;
	padding: 1rem;
	border: 1px solid #ddd;
}

.article-list a {
	display: block;
	text-decoration: none;
	color: #333;
}
 
.article-list a:after {
	display: block;
	clear: both;
	content: '';
}

.article-list .img-wrap {
	position: relative;
	line-height: 1;
	float: left;
}
 
.article-list .img-wrap img {
	width: 240px;
	height: 160px;
	max-width="100%"
	object-fit: cover;
}
 
.article-list .img-wrap .cat-data {
	font-size: .75rem;
	position: absolute;
	top: 0;
	right: 0;
	padding: .3rem .5rem;
	color: #fff;
	background-color: #03162f;
}
 
.article-list .text {
	margin-left: 260px;
}
 
.article-list .text h2 {
	font-size: 1.15rem;
	margin-bottom: .5rem;
}
 
.article-list .text .article-date,
.article-list .text .article-author {
	font-size: .75rem;
	font-weight: bold;
	display: inline-block;
	margin-bottom: .5rem;
	color: #888;
}
 
.article-list .text .article-date {
	margin-right: .5rem;
}
 
.article-list .text .article-author i {
	margin-right: .3rem;
}
 
.article-list .text p {
	font-size: .8125rem;
	line-height: 1.7;
}
@media(max-width: 600px) {
  .article-list {
    padding: .5rem;
  }
 
  .article-list .img-wrap img {
    width: 132px;
    height: 88px;
  }
 
  .article-list .img-wrap .cat-data {
    font-size: .6rem;
  }
 
  .article-list .text {
    margin-left: 140px;
    padding: 0;
  }
 
  .article-list .text h2 {
    font-size: 1rem;
    margin-bottom: 0;
  }
 
  .article-list .text p {
    display: none;
  }
 
  .article-list .text .article-date,
  .article-list .text .article-author {
    font-size: .625rem;
    margin-bottom: 0;
  }
 
  .article-list .text .article-date {
    margin-right: .2rem;
  }
}

/* 記事 */
.article-content {
  margin-bottom: 2rem;
}
 
.article-content .article-info {
  margin-bottom: .5rem;
}
 
.article-content .cat-data a {
  font-size: .8rem;
  margin-right: .5rem;
  padding: .1rem .5rem;
  text-decoration: none;
  color: #fff;
  background-color: #03162f;
}
 
.article-content .article-info .article-date,
.article-content .article-info .article-author {
  font-size: .8rem;
  display: inline-block;
  margin-right: .5rem;
  color: #888;
}
 
.article-content .article-info .article-author i {
  margin-right: .3rem;
}
 
.article-content p,
.article-content b,
.article-content table,
.article-content ul,
.article-content ol {
  font-size: 1rem;
  line-height: 1.7;
  letter-spacing: 1px;
}
 
.article-content p,
.article-content img,
.article-content table,
.article-content ul,
.article-content ol {
  margin-bottom: 2rem;
}
 
.article-content h1 {
  font-size: 1.9rem;
  margin: 0 0 2rem;
  letter-spacing: 1px;
}
 
.article-content h2 {
  font-size: 1.7rem;
  margin: 3rem 0 2rem;
  padding: .4rem 0;
  letter-spacing: 1px;
  border-bottom: solid 5px #03162f;
}
 
.article-content h3 {
  font-size: 1.3rem;
  margin: 2.5rem 0 1.8rem;
  padding: 0 1rem;
  letter-spacing: 1px;
  border-left: solid 7px #415671;
  background: transparent;
}
 
.article-content h4 {
  font-size: 1.3rem;
  margin: 2rem 0 1rem;
  letter-spacing: 1px;
}
 
.article-content h5 {
  font-size: 1.1rem;
  margin: 0 0 .3rem;
  letter-spacing: 1px;
}
 
.article-content .article-img {
  margin-bottom: 2rem;
}
 
.article-content .article-img img {
  display: block;
  margin: 0 auto;
}
 
.article-content ul {
  margin-left: 2rem;
  list-style: disc;
}
 
.article-content ol {
  margin-left: 2rem;
  list-style: decimal;
}
 
.article-content table {
  border-collapse: collapse;
}
 
.article-content th,
.article-content td {
  padding: .6rem;
  vertical-align: middle;
  border: 1px solid #ddd;
}
 
.article-content figure {
  max-width: 100%;
}
 
.article-tag {
  text-align: right;
}
 
.article-tag ul {
  font-size: 0;
  margin-bottom: 0;
}
 
.article-tag ul li {
  font-size: .9rem;
  display: inline-block;
  margin-right: .5rem;
  vertical-align: middle;
}
 
.article-tag ul li:last-child {
  margin-right: 0;
}
 
.article-tag ul li a {
  padding: .2rem .5rem;
  text-decoration: none;
  color: #000;
  border: 1px solid #000;
}
@media(max-width: 600px) {
  .article-content h1 {
    font-size: 1.6rem;
  }
 
  .article-content h2 {
    font-size: 1.4rem;
  }
 
  .article-content h3 {
    font-size: 1.1rem;
  }
 
  .article-content h4 {
    font-size: 1.2rem;
  }
}

/* ページネーション */
.pagination {
  margin: 2rem 0;
  text-align: center;
}
 
.pagination ul {
  font-size: 0;
}
 
.pagination ul li {
  font-size: 1rem;
  display: inline-block;
  margin-right: .5rem;
}
 
.pagination ul li:last-child {
  border: 0;
}
 
.pagination ul li a,
.pagination .current {
  display: block;
  padding: .5rem .8rem;
  border: 1px solid #ccc;
}
 
.pagination ul li .prev,
.pagination ul li .next {
  border: 0;
}
 
.pagination ul li a {
  text-decoration: none;
  color: #333;
}
 
.pagination ul li a:hover {
  opacity: .6;
}
 
.pagination .current {
  color: #fff;
  background-color: #03162f;
}


/*YouTube*/
.video-container{
margin: 0px auto;
}

.youtube {
  position:relative;
  width:100%;
  padding-top:56.25%;
  text-align:center;
  vertical-align:middle;
	display: inline-block;
}

.youtube p{
	display: none;
}

.youtube iframe{
  position:absolute;
  top:0;
  left:0;
  right:0;
  width:100%;
  height:100%;
  box-sizing: border-box;
  max-width: 90%;
  margin-right: auto;
  margin-left: auto;
  padding: 0.1rem;
}


/* おすすめメニュー */
.rmd-contents-board {
	display: inline-block;
	max-width: 95%;
	background-color: rgba(255,255,255,0);
	text-align: center;
	vertical-align: top;
}

.menu_paper_rmd {
	max-width: 95%; /* 紙の横幅 100%にすると全幅表示に */
	padding: 15px;
	margin: 0em auto;
	background: rgba(29,84,63,0); /* 紙の色 */
	color: rgba(255,255,255,0.85);/* 文字色 */
	font-weight: bold; /*太字に*/
	word-break: break-all;
}
.menu_paper_rmd p {
	margin: 0; 
	padding: 0;
	font-size: 1.1em;
	text-align: left;
	background: url(images/text-color.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3); 
}
.menu_paper_rmd_tape {
	width: 50%;
	height: 35px;
	margin: -25px auto 0;
	background: rgba(255, 240, 200, 0.3);/* テープの色 */
	transform: rotate(-3deg);
	opacity: 0.9;
}
.menu_paper_rmd_subtitle {
	text-align: center;
	font-size: 1.1em!important;
	margin-bottom: 1em!important;
	background: url(images/text-color.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3); 
}

.menu_paper_rmd_subtitle h3 {
	color: rgba(255,255,255,0.85);/* 文字色 */
	background: url(images/text-color.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3); 
}

.menu_paper_rmd_title {
	text-align: center;
	margin-top: 10px!important;
	clear: both;
	display: inline-block;
	position: relative;
}

.menu_paper_rmd_title h2 {
	color: rgba(255,255,255,0.85);/* 文字色 */
	position: relative;
	display: inline-block;
	padding: 0 55px;
	font-size: 1.1em!important;
	background: url(images/text-color-pink.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	text-shadow: 8px 8px 8px rgba(235,78,128,0.3); 
}
/*
.menu_paper_rmd_title h2:before {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 50px;
  height: 1px;
  background-color: white;
}

.menu_paper_rmd_title h2:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 50px;
  height: 1px;
  background-color: white;
}

.menu_paper_rmd_title h2:before {
  left:0;
}
.menu_paper_rmd_title h2:after {
  right: 0;
}
*/
/* イベント情報 */
.event-contents-board {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	max-width: 33%;
}
.menu_paper_event {
	display: inline-block;
	max-width: 95%; /* 紙の横幅 100%にすると全幅表示に */
	padding: 5px;
	margin: 0.8em 0.8em;
	background: rgba(0,0,0,1);/* 紙の色 */
	background: url(images/board-black.png);/* 紙の色 */
	color: rgba(255,255,255,0.85);/* 文字色 */
	font-weight: bold; /*太字に*/
	box-shadow: 1px 1px 1px rgba(0,0,0,0.1);
	transform:rotate(0deg);
	word-break: break-all;
/*  background: linear-gradient(#ccc 1px, transparent 2px);
  background-size: auto 1.5rem;
*/
	vertical-align: top;
}
.menu_paper_event .img-wrap img{
	height: 80px;
	width: auto;
}

.eventmsg p{
	font-size: 0.7rem;
}

.menu_paper_event_subtitle {
	text-align: center;
	font-size: 0.8em!important;
}

.menu_paper_event_subtitle h3 {
	color: rgba(255,255,255,0.85);/* 文字色 */
}

.menu_paper_event_title {
	text-align: center;
	clear: both;
	display: inline-block;
	position: relative;
}

.menu_paper_event_title h2 {
	color: rgba(255,255,255,0.85);/* 文字色 */
	position: relative;
	display: inline-block;
	padding: 0 5px;
	font-size: 0.8em!important;
}

/* 新着情報 */
.info-contents-board {
	clear: both;
	display: block;
	max-width: 95%;
	left: 0;
	right: 0;
	margin: auto;
}

.menu_paper_info {
	display: inline-block;
	max-width: 95%; /* 紙の横幅 100%にすると全幅表示に */
/*   max-width: 95%;/* 紙の横幅 100%にすると全幅表示に */
	padding: 20px;
	margin: 0.8em 0.8em;
	background: rgba(0,0,0,0);/* 紙の色 */
/*	background: url(images/board-black.png); 紙の色 */
	color: rgba(255,255,255,0.85);/* 文字色 */
	font-weight: bold; /*太字に*/
/*	box-shadow: 1px 1px 1px rgba(0,0,0,0.1);*/
	transform:rotate(0deg);
	word-break: break-all;
/*  background: linear-gradient(#ccc 1px, transparent 2px);
  background-size: auto 1.5rem;
*/
	vertical-align: top;
}
.menu_paper_info p {
	margin: 0; 
	padding: 0;
	font-size: 0.9em;
	text-align: center;
	background: url(images/text-color.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3); 
}
.menu_paper_info_tape {
	width: 20%;
	height: 50px;
	margin: -35px auto 0;
	background: rgba(255, 240, 200, 0.3);/* テープの色 */
	transform: rotate(0deg);
	opacity: 0.9;
}
/*
.menu_paper_info_tape {
	width: 40px;
	height: 40px;
	margin: -35px auto 0;
	background: rgba(255, 255, 255, 1);
	transform: rotate(3deg);
	opacity: 0.9;
	border-radius:  50%;
	font-size: 0.5rem;
	color: rgba(0,0,0,0.85);
	background-image: url(images/103seal.gif);
	background-size: cover;
}
*/
.menu_paper_info_subtitle {
	text-align: center;
	font-size: 1.1em!important;
}

.menu_paper_info_subtitle h3 {
	background: url(images/text-color.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3); 
}

.menu_paper_info_title {
	text-align: center;
	margin-top: 10px!important;
	clear: both;
	display: inline-block;
	position: relative;
}

.menu_paper_info_title h2 {
	position: relative;
	display: inline-block;
	padding: 0 55px;
	font-size: 1.1em!important;
	background: url(images/text-color-blue.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	text-shadow: 8px 8px 8px rgba(0,157,191,0.3); 
}
/*
.menu_paper_info_title h2:before {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 50px;
  height: 1px;
  background-color: white;
}

.menu_paper_info_title h2:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 50px;
  height: 1px;
  background-color: white;
}

.menu_paper_info_title h2:before {
  left:0;
}
.menu_paper_info_title h2:after {
  right: 0;
}
*/
.menu_paper_info_block {
	text-align: left;
}
.menu_paper_info_block p {
	clear: both;
}

/* おすすめ */
/* */
.menu_paper_question {
/*   width: 300px; 紙の横幅 100%にすると全幅表示に */
   max-width: 95%;/* 紙の横幅 100%にすると全幅表示に */
   padding: 15px;
   margin: 2em auto;
   background: rgba(250,250,250,1);/* 紙の色 */
   color: rgba(0,0,0,0.85);/* 文字色 */
   font-weight: bold; /*太字に*/
   box-shadow: 4px 4px 4px rgba(20,20,20,0.8);
   transform:rotate(0deg);
   word-break: break-all;
/*  background: linear-gradient(#ccc 1px, transparent 2px);
  background-size: auto 1.5rem;
*/
}
.menu_paper_question p {
    margin: 0; 
    padding: 0;
    font-size: 1.1em;
    text-align: center;
   font-weight: normal; /*太字に*/
/*  line-height: 2rem;
  margin: 0;*/
}
.menu_paper_question_tape {
    width: 40px;
/*    height: 85px;
    margin: -60px auto 0; */
    height: 40px;
    margin: -35px auto 0;
    background: rgba(255, 255, 255, 1);/* テープの色 */
    transform: rotate(0deg);
    opacity: 0.9;
    border-radius:  50%;        /* 角丸指定 */
    font-size: 0.5rem;
    color: rgba(0,0,0,0.85);/* 文字色 */
    background-image: url(images/103seal.gif);
    background-size: cover;
}
.menu_paper_question_subtitle {
    color: rgba(0,0,0,0.85);/* 文字色 */
    text-align: center;
    font-size: 1.1em!important;
}

.menu_paper_question_subtitle h3 {
    color: rgba(0,0,0,0.85);/* 文字色 */
}

.menu_paper_question_title {
  text-align: center;
  margin-top: 10px!important;
  clear: both;
  display: inline-block;
  position: relative;
  font-size: 1.2em!important;
}

.menu_paper_question_subtitle h2 {
  color: rgba(0,0,0,0.85);/* 文字色 */
  position: relative;
  display: inline-block;
  padding: 0 0px;
  font-size: 1.1em!important;
}
/*
.menu_paper_question_subtitle h2:before {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 50px;
  height: 1px;
  background-color: black;
}

.menu_paper_question_subtitle h2:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 50px;
  height: 1px;
  background-color: black;
}

.menu_paper_question_subtitle h2:before {
  left:0;
}
.menu_paper_question_subtitle h2:after {
  right: 0;
}
*/
.menu_paper_question_block {
    display: inline-block;
    max-width: 90%;
}
.menu_paper_question_block p{
    text-align: left;
}
.menu_paper_question_block p {
    clear: both;
}

.menu_paper_question .img-wrap-question {
	position: relative;
	display: inline-block;
	max-width: 400px;
	height: auto;
	overflow: hidden; /* 不要部分は消す */
}

.menu_paper_question .img-wrap-question:after {
	position: absolute;
    left: 0; top: 0; right: 0; bottom: 0;
    -moz-box-shadow: inset 7px 7px 7px 7px rgb(250,250,250);
    -webkit-box-shadow: inset7px 7px 7px 7px rgb(250,250,250);
    box-shadow: inset 7px 7px 7px 20px rgb(250,250,250);
    content: " ";
}

.menu_paper_question .img-wrap-question img {
/*	margin-left: -90px;  ポジション調整 */
	transform-origin: 0 0;
}

.question-contents-board {
   clear: both;
   display: inline-block;
   width: 100%;
}

.success p{
  text-align="left";
}

/* メニュー一覧 */
.menu_list {
	width: 100%; /* 紙の横幅 100%にすると全幅表示に */
	height: auto;
	padding: 15px;
	margin: 0.5em auto;
	background: rgba(0,0,0,0);/* 紙の色 */
	font-weight: bold; /*太字に*/
	transform:rotate(0deg);
	word-break: break-all;
	display: inline-block;
}
@media(max-width: 600px) {
	.menu_list {
	}
}
.menu_list p {
	margin: 0; 
	padding: 0;
	font-size: 0.9em;
	text-align: center;
	background: url(images/text-color.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3); 
/*  line-height: 2rem;
  margin: 0;*/
}
.menu_list_tape {
	width: 40px;
/*    height: 85px;
    margin: -60px auto 0; */
	height: 40px;
	margin: -35px auto 0;
	background: rgba(255, 255, 255, 1);/* テープの色 */
	transform: rotate(0deg);
	opacity: 0.9;
	border-radius:  50%;        /* 角丸指定 */
	font-size: 0.5rem;
	color: rgba(255,255,255,0.85);/* 文字色 */
	background-image: url(images/103seal.gif);
	background-size: cover;
}
.menu_list_subtitle {
	text-align: center;
	font-size: 1.1em!important;
	display: inline-block;
	width: 40%;
	text-align: left;
}

.menu_list_subtitle h3 {
	background: url(images/text-color.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3); 
	display: inline-block;
}

.menu_list_title {
	text-align: center;
	clear: both;
	display: inline-block;
	position: relative;
	width: 100%;
	text-align: center;
}

.menu_list_title h2 {
	background: url(images/text-color.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3); 
	position: relative;
	display: inline-block;
	padding: 0 0px;
	font-size: 1.1em;
	letter-spacing: 0.05em;
}
/*
.menu_list_title h2:before {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 50px;
  height: 1px;
  background-color: white;
}

.menu_list_title h2:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 50px;
  height: 1px;
  background-color: white;
}

.menu_list_title h2:before {
  left:0;
}
.menu_list_title h2:after {
  right: 0;
}
*/
.menu_list_block {
    text-align: left;
}
.menu_list_block p {
    clear: both;
}

.menu-contents-board {
	display: inline-block;
	vertical-align: top;
	max-width: 1200px;
	width: 100%;
}

.menu-contents {
	display: inline-block;
	text-align: center;
	position: relative;
	margin: 2em 4em;
	padding: 0.5em 1em;
	border: solid 2px;
	border-radius: 8px;
	border-image-source: url(images/border-pink.gif);
	border-image-slice: 2%;
	border-image-repeat: repeat;
	border-image-width: 2px;
}
.menu-contents .menu-category {
    position: absolute;
    display: inline-block;
    top: -23px;
    left: 0px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: rgba(0,0,0,0);
	background: url(images/text-color-pink.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	text-shadow: 8px 8px 8px rgba(235,78,128,0.3); 
	font-weight: bold;
	color: transparent;
}
.menu-contents p {
    margin: 0; 
    padding: 0;
}
#dispmsg{
	display: block;
	margin: 20px;
}

#dispmsg p{
	text-align: center;
}
p.sccess {
	text-align: center;
}

#yoyakumsg{
	display: relative;
	text-align: left;
}

/* ajax表示 */
.more_disp{
  text-align: center;
  width: 20%;
  padding: 12px 16px;
  text-align: center;
  background: #7e7e7e;
  color: #fff;
  margin: 0 auto 20px;
  cursor: pointer;
}

.wrapper {
  height: 10vh;
  position: relative;
}
.balls-guruguru {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 50px;
  height: 50px;
  background-color: rgba(255, 255, 255, 0);;
}
.ball {
  width: 50%;
  height: 20px;
  position: absolute;
  top: calc(50% - 5px);
  transform-origin: 100% 50%;
  left: 0;
}
.ball::before {
  content: '';
  display: block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #333;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.ball-1::before {
  animation: ball-guruguru 1s linear 0s infinite;
}
.ball-2 {
  transform: rotate(45deg);
}
.ball-2::before {
  animation: ball-guruguru 1s linear -0.125s infinite;
}
.ball-3 {
  transform: rotate(90deg);
}
.ball-3::before {
  animation: ball-guruguru 1s linear -0.25s infinite;
}
.ball-4 {
  transform: rotate(135deg);
}
.ball-4::before {
  animation: ball-guruguru 1s linear -0.375s infinite;
}
.ball-5 {
  transform: rotate(180deg);
}
.ball-5::before {
  animation: ball-guruguru 1s linear -0.5s infinite;
}
.ball-6 {
  transform: rotate(225deg);
}
.ball-6::before {
  animation: ball-guruguru 1s linear -0.625s infinite;
}
.ball-7 {
  transform: rotate(270deg);
}
.ball-7::before {
  animation: ball-guruguru 1s linear -0.75s infinite;
}
.ball-8 {
  transform: rotate(315deg);
}
.ball-8::before {
  animation: ball-guruguru 1s linear -0.875s infinite;
}
@keyframes ball-guruguru {
  0% {
    width: 10px;
    height: 10px;
    opacity: 1;
  }
  100% {
    width: 3px;
    height: 3px;
    opacity: .2;
    margin-left: 3.5px;
  }
}

/* コメントフォーム */
#commentform {
  margin-top: 0px;
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
}
@media screen and (max-width: 480px) {
  #commentform {
    margin-top: 0px;
  }
}
.comment-form {
/*  border-top: 1px solid #ddd;
  padding-top: 24px;
  padding-bottom: 24px;*/
  width: 70%;
  align-items: center;
  text-align: left;
  position: relative;
}
@media screen and (max-width: 480px) {
  .comment-form {
    padding-left: 14px;
    padding-right: 14px;
    padding-top: 16px;
    padding-bottom: 16px;
    flex-wrap: wrap;
    vertical-align: top;
  }
}
.commentlabel {
  width: 50%;
  max-width: 50%;
  letter-spacing: 0.05em;
  font-weight: normal;
  font-size: 1.1rem;
  padding-top: 16px;
}
@media screen and (max-width: 480px) {
  .commentlabel {
    max-width: inherit;
    display: flex;
    align-items: center;
    font-size: 1.1rem;
  }
}
.authorinput {
	border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 6px;
  margin-left: 0px;
  height: 48px;
  flex: 1;
  width: 95%;
  max-width: 410px;
  font-size: 1.1rem;
	background: rgba(0, 0, 0, 0.3);
	font-size: 1.1rem;
	color: rgba(255, 255, 255, 1);
}
@media screen and (max-width: 480px) {
  .authorinput {
    margin-left: 0;
    margin-top: 18px;
    height: 40px;
    flex: inherit;
    font-size: 1.1rem;
  }
}
.commenttextarea {
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 6px;
	margin-left: 0px;
	height: 216px;
	width: 95%;
	max-width: 100%;
	background: rgba(0, 0, 0, 0.3);
	font-size: 1.1rem;
	color: rgba(255, 255, 255, 1);
}
@media screen and (max-width: 480px) {
  .commenttextarea {
    margin-left: 0;
    height: 120px;
    flex: inherit;
    font-size: 1.3rem;
  }
}
.form-submit input{
  border-radius: 6px;
  margin-top: 16px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 10px;
  padding-bottom: 10px;
  width: 180px;
  display: block;
  letter-spacing: 0.05em;
  background: #E5E5E5;
  color: #626262;
  font-weight: bold;
  font-size: 1.1rem;
  font-family: 'メイリオ', 'Meiryo', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'Noto Sans Japanese', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
@media screen and (max-width: 480px) {
	.form-submit input {
    margin-top: 3px;
    padding-top: 1px;
    padding-bottom: 1px;
    width: 150px;
    font-size: 1.1rem;
  }
}

#comments-count{
     border-bottom: 1px solid #E5E5E5;
}

.comment-list {
}

.comment-list ul {
    list-style-position: inside;
}

.comment-list li{
     overflow: hidden;
}

#comments-list .even{ /* コメントグループの区切り */
     border-bottom: 1px solid #E5E5E5;
}

.children li {
	list-style-type:none;		/*リストマーカー無しにする*/
}

.comment-list .comment {
}
.comment-reply-title{
	font-size: 0.9rem;
	font-weight: normal;
}
.children { /* 返信コメントの部分 */
     margin-left: 10%;
}

.reply{/* 返信ボタン */
     background-color:#E5E5E5;
     line-height: 20px;
     width: 50px;
     font-size: 10px;
     text-align: center;
     float: right;
     margin-bottom: 2%;
}

.reply a {
     color:#626262;
     display: block;
}

.comment-author{/* アバター */
     width:20%;
     float: left;
}

.comment-author img{
     display: block;
}

span.says{
     display: none;
}

.comment-body{
	clear: both;
	margin-top: 2%;
	overflow: hidden;
	text-align: center;
}

.comment-body p{/* 文章部分 */
	display: inline-block;
	position: relative; 
	margin: 0 0 0 -150px;
	padding: 10px;
	max-width: 250px;
	border-radius: 12px;
	background: #626262;
}

.comment-body p:after{/* 文章部分 */
	content: "";
	display: inline-block;
	position: absolute;
	top: 3px; 
	left: -19px;
	border: 8px solid transparent;
	border-right: 18px solid #626262;
	-webkit-transform: rotate(35deg);
	transform: rotate(35deg);
}

.fn {/* コメント投稿者の名前の部分（デフォルトではイタリックになってる部分） */
	display: block;
	position: absolute;
	font-style: normal;
	clear: both;
	text-align: center;
	margin-top: -30px;
	transform: translateY(29px);
}
.comment-meta{/* コメント投稿日 */
     text-align: right;
}

.comment-meta a{
     color: #626262;
}

.searcharea{
  width          : 290px;              /* BOXの幅               */
  height         : 24px;               /* BOXの高さ             */
  margin         : auto;               /* サンプルを中心に寄せ  */
  letter-spacing : 0.1em;              /* 文字間隔              */
  font-weight    : bold;               /* 太字                  */
  line-height    : 0;                  /* 標準の行高さ          */
}
 
 /* --- テキスト入力欄のSTYLE設定 --- */
.searcharea .searchtext {
  display        : block;              /* ブロック化            */
  float          : left;               /* 横並び                */
  box-sizing     : border-box;         /* 枠線,余白を含んだ長さ */
  height         : 24px;               /* 入力の高さ            */
  width          : 170px;              /* 入力の幅              */
  margin         : 0;                  /* 外余白                */
  padding        : 0 5px;             /* 内余白                */
  border         : 2px solid #ffffff;  /* 枠線　幅,実践,色      */
  color          : #333;               /* 文字色                */
  outline        : 0;                  /* 入力の薄い枠を非表示  */
  font-size      : 12px;               /* フォントサイズ        */
}
 
 /* --- 検索ボタン欄のSTYLE設定 --- */
.searcharea .searchbutton {
  float          : left;               /* 横並び                */
  box-sizing     : border-box;         /* 枠線,余白を含んだ長さ */
  height         : 24px;               /* 入力の高さ            */
  margin         : 0;                  /* 外余白                */
  padding        : 6px 10px;           /* 内余白                */
  border         : none;               /* 枠線　幅,実践,色      */
  background     : #ffffff;            /* ボタンの色            */
  color          : #000;               /* 文字色                */
  cursor         : pointer;            /* カーソル設定          */
  line-height    : 12px;               /* 1行の高さ             */
  font-size      : 12px;               /* フォントサイズ        */
}
 
 /* --- IEの入力エリア右側×消し -------------------------*/
.searchArea .searchText::-ms-clear {
  display        : none;               /* ×を消す              */
}

/* 問合せフォーム */
#contactform {
  margin-left: auto;
  margin-right: auto;
  max-width: 1000px;
}
@media screen and (max-width: 480px) {
  #contactform {
  }
}
.form-item {
  padding-top: 33px;
  padding-bottom: 24px;
  width: 100%;
  display: block;
  align-items: center;
  text-align: left;
  position: relative;
}
@media screen and (max-width: 480px) {
  .form-item {
    padding-left: 14px;
    padding-right: 14px;
    padding-top: 16px;
    padding-bottom: 16px;
    flex-wrap: wrap;
    vertical-align: top;
  }
}
.form-item label {
  width: 100%;
  max-width: 100%;
  letter-spacing: 0.05em;
  font-weight: normal;
  font-size: 1.1rem;
  padding-top: 0px;
  padding-left: 10px;
}
@media screen and (max-width: 480px) {
  .form-item label {
    max-width: inherit;
    display: block;
    align-items: center;
    font-size: 1.1rem;
  }
}
.form-item label.ismsg {
  margin-top: 15px;
  margin-bottom: auto;
}
.form-additem label.ismsg {
  margin-top: 15px;
  margin-bottom: auto;
}
@media screen and (max-width: 480px) {
  .form-item label.ismsg {
    margin-top: 15px;
  }
  .form-additem label.ismsg {
    margin-top: 15px;
  }
}
.form-item-required {
  border-radius: 6px;
  margin-right: 8px;
  padding-top: 2px;
  padding-bottom: 2px;
  width: 48px;
  display: inline-block;
  text-align: center;
  background: rgb(255,0,0);
  color: #fff;
  font-size: 0.9rem;
  position: absolute;
  top: 5px;
  left: 10px;
}
.form-item-unrequired {
  border-radius: 6px;
  margin-right: 8px;
  padding-top: 2px;
  padding-bottom: 2px;
  width: 48px;
  display: block;
  text-align: center;
  background: rgb(0,0,255);
  color: #fff;
  font-size: 0.9rem;
  position: absolute;
  top: 5px;
  left: 10px;
}

@media screen and (max-width: 480px) {
  .form-item-required {
    border-radius: 4px;
    padding-top: 2px;
    padding-bottom: 4px;
    width: 32px;
    font-size:  0.9rem;
	left: 15px;
  }
  .form-item-unrequired {
    border-radius: 4px;
    padding-top: 2px;
    padding-bottom: 4px;
    width: 32px;
    font-size: 0.9rem;
	left: 15px;
  }
}
.form-item-input {
	display: block;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 6px;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	height: 50px;
	max-width: 95%;
	background: rgba(0, 0, 0, 0.3);
	font-size: 1.1rem;
	color: rgba(255, 255, 255, 1);
/*	background: url(images/text-color.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3); */
}
@media screen and (max-width: 480px) {
  .form-item-input {
    margin-left: 0;
    margin-top: 18px;
    height: 40px;
    flex: inherit;
    font-size: 1.1rem;
  }
}
.form-item-textarea {
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 6px;
	margin-left: 0px;
	height: 216px;
	width: 95%;
	max-width: 100%;
	background: #eaedf2;
	background: rgba(0, 0, 0, 0.3);
	font-size: 1.1rem;
	color: rgba(255, 255, 255, 1);
}
@media screen and (max-width: 480px) {
  .form-item-textarea {
    margin-top: 18px;
    margin-left: 0;
    height: 200px;
    flex: inherit;
    font-size: 1.1rem;
  }
}
.form-btn {
  border-radius: 6px;
  margin-top: 32px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 10px;
  padding-bottom: 10px;
  width: 200px;
  display: block;
  letter-spacing: 0.05em;
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
  font-weight: bold;
  font-size: 1.1rem;
  font-family: 'メイリオ', 'Meiryo', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'Noto Sans Japanese', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
@media screen and (max-width: 480px) {
  .form-btn {
    margin-top: 24px;
    padding-top: 8px;
    padding-bottom: 8px;
    width: 160px;
    font-size: 1.1rem;
  }
}

#s-box{
 height: 20px;
	width: 111px;
 padding: 0 10px;
 position: absolute;
 left: 0;
 top: 10px;
 border-radius:2px;
 border:solid 3px #eaeaea;
 outline: 0;
font-size: 0.8rem;
}

#s-btn{
 background-color: gray;
	top: 39px;
 width: 50px;
 height: 25px;
 position: relative;
 left: 85px;
 border-radius: 3px;
 font-size: 0.8rem;
 color: #fff;
}
.searchbox{
	position: absolute;
	top: 10px;
}

@media(max-width: 600px) {
	.fresh-board{
		display: inline-grid;
		display: -ms-inline-grid;
		grid-template-rows: 1fr 1fr 1fr 3fr;
		grid-template-columns: 9fr 8fr;
		grid-template-areas: "freshtitle freshtitle"
							"freshproduct freshproduct"
							"freshimage freshprice"
							"freshimage freshdescription";
		-ms-grid-template-rows: 1fr 1fr 1fr 3fr;
		-ms-grid-template-columns: 9fr 8fr;
		justify-content: center;
		align-items: center;
		margin-left: 10px;
		margin-right: 20px;
		max-width: 700px;
		row-gap: 10px;
	}
	.fresh-board-productname{
		grid-area: freshproduct;
		-ms-grid-column: 1;
		-ms-grid-row: 2;
		-ms-grid-row-span: 2;
	}
	.recommend{
/*		display: flex;*/
		overflow-x: scroll;
		margin: 0;
		padding: 0;
		overflow-scrolling: touch;  /* スクロールを滑らかにする */
		-webkit-overflow-scrolling: touch;  /* スクロールを滑らかにする */
	}
	.recommend .fresh-board{
		min-width: 88%;
		width: 95%;
		margin: 10px;
		padding: 0;
		list-style: none;
	}
/*	.recommend .mainvisual{
		min-width: 88%;
		width: 95%;
		margin: 10px;
		padding: 0;
		list-style: none;
	}*/
	.recommend .rec-board{
		min-width: 88%;
		width: 100%;
		margin: 10px;
		padding: 0;
		list-style: none;
	}
	.recommend .srec-board{
		min-width: 88%;
		width: 100%;
		margin: 10px;
		padding: 0;
		list-style: none;
	}
}

.yoyakukakunin table, td, th{
    border: 1px solid gray;
    text-align: left;
	padding: 5px;
}
#yoyakukakunin{
	display: inline-block;
}

.modal-window {
-webkit-transform: translate(0, 100%);
-moz-transform: translate(0, 100%);
-o-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
transform: translate(0, 100%);
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 999;
opacity: 0;
line-height: 1.3;
display: none;
}
.modal-window:target {
-webkit-transform: translate(0, 0);
-moz-transform: translate(0, 0);
-o-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
opacity: 1;
}
.is-active.modal-window {
display: block;
}
.modal-window:target {
display: block;
}
.modal-window .modal-inner {
position: absolute;
bottom: 120px;
z-index: 20;
margin:0 auto;
width: 100%;
height: 59%;
overflow-x: hidden;
border-radius: 6px;
background: #333;
-webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.6);
box-shadow: 0 0 30px rgba(0, 0, 0, 0.6);
}
 
.modal-window .modal-close {
display: block;
text-indent: -100px;
overflow: hidden;
}
.modal-window .modal-close:before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 10;
background: #fff;
	-moz-opacity: 0.7;
	opacity: 0.7;
}
.modal-window .modal-close:after {
content: '\00d7';
position: absolute;
bottom: 90px;
right: 0;
z-index: 20;
margin:0 auto;
color: white;
background: #333;
border-radius: 6px;
padding: 10px 10px;
text-decoration: none;
text-indent: 0;
}
 
.modal-window {
-webkit-transition: opacity 0.4s;
-o-transition: opacity 0.4s;
transition: opacity 0.4s;
}
 
 
 
/**********************
スマホのフッターメニュー
**********************/
ul.footer_menu {
	 margin: 0 auto;
	 padding: 12px 0;
	 width: 100%;
	 overflow: hidden;
	 display: table;
     text-align: center;
}
 
ul.footer_menu li {
	margin: 0;
	padding: 0;
	display: table-cell;
	vertical-align:middle;
	list-style-type: none;
	font-size: 13px;
    line-height: 15px;
}
 
ul.footer_menu li a i{
	font-size: 24px;
}
 
ul.footer_menu li a {
	border: none;
	display: block;
	color:#000;
	text-align: center;
	text-decoration: none;
}
 
.footer_menu {
	bottom: 0;
	left:0;
    background:#FFFFFF;
	z-index: 9999999999;
	-moz-opacity: 0.9;
	opacity: 0.9;
	padding-bottom: 60px;
}
 
 
/**********************
SNSの部分
***********************/
 
 
.modal-window .modal-inner.sns{
	margin:0 auto;
	text-align:center;
}
.modal-inner ul {
	list-style:none;
}
.modal-inner li {
	list-style:none;
	float:left;
	width:25%;
	margin:3%;
}
.modal-inner li a {
	font-size:150%;
	position:relative;
	display:block;
	padding:10px;
	color:#fff;
	border-radius:6px;
	text-align:center;
	text-decoration: none;
}
.modal-inner li a:hover {
	box-shadow:none;
}

/********************** 
メニューの部分
**********************/
 
.mod li{
  float:none;
  display:block;
  width:100%;
  margin:0;
}
 
.mod li a {
    text-align: center;
    color: white;
    margin: 2%;
    font-size: 14px;
}

.mod li a:after {
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	position: absolute;
	top: 50%;
	right: 1.25rem;
	display: block;
	content: '\f105';
	transform: translateY(-50%);
}
.mod li {
	padding: 0px 0px;
	border-left:  #C4C3C3 solid 0px;
}
.mod li {
	display: block;
	margin-right: 0;
}

.mod li a {
	position: relative;
	padding: .8rem 1.25rem;
	color: #fff;
	border-bottom: 1px solid #888;
}

.productstatus {
	color: rgba(0,157,191,0.85);
	text-shadow: 8px 8px 8px rgba(0,157,191,0.3); 
	text-align: left;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.productstatus {
		background: url(images/text-color-blue.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
		text-shadow: 8px 8px 8px rgba(0,157,191,0.3); 
	}
}
.productstatuspink {
	color: rgba(235,78,128,0.85);
	text-shadow: 8px 8px 8px rgba(235,78,128,0.3); 
	text-align: left;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
	.productstatuspink {
		background: url(images/text-color-pink.gif);
		background-size: contain;
		background-clip: text;
		-webkit-background-clip: text;
		color: transparent;
		text-shadow: 8px 8px 8px rgba(235,78,128,0.3); 
	}
}

#bg_layer {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background: #000;
	opacity: 0.60;
	filter: alpha(opacity=60);
	z-index: 10;
}

#over_layer {
	display: none;
	position: fixed;
	top: 50px;
	z-index: 15;
	width: 80%;
	height: 80%;
}

.close_button {
	display: none;
	position: absolute;
	top: -10px;
	right: 10px;
	cursor: pointer;
	z-index: 20;
}

.close_overLayer {
	z-index: 20;
	font-size: 11px; font-size: 1.1rem;
	color: #FFF;
	cursor: pointer;
}

.full_size_link_width, .full_size_link_height {
	display: none;
}

#over_layer img{
	top: 50px;
	max-width: 85%;
	max-height: 85%;
	z-index: 1000;
}

.form-allowed-tags{
	display: none;
}

#submit{
  border-radius: 6px;
  margin-top: 32px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 10px;
  padding-bottom: 10px;
  width: 200px;
  display: block;
  letter-spacing: 0.05em;
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
  font-weight: bold;
  font-size: 1.1rem;
  font-family: 'メイリオ', 'Meiryo', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'Noto Sans Japanese', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
@media screen and (max-width: 480px) {
  #submit{
    margin-top: 24px;
    padding-top: 8px;
    padding-bottom: 8px;
    width: 160px;
    font-size: 1.1rem;
  }
}


/* 予約フォーム */
#yoyakuform {
  margin-left: auto;
  margin-right: auto;
  max-width: 600px;
}
@media screen and (max-width: 480px) {
  #yoyakuform {
  }
}
.yoyakuform-item {
  padding-top: 33px;
  padding-bottom: 24px;
  width: 70%;
  display: block;
  align-items: center;
  text-align: left;
  position: relative;
}
@media screen and (max-width: 480px) {
  .yoyakuform-item {
    padding-left: 14px;
    padding-right: 14px;
    padding-top: 16px;
    padding-bottom: 16px;
    flex-wrap: wrap;
    vertical-align: top;
  }
}
.yoyakuform-additem {
  padding-top: 33px;
  padding-bottom: 24px;
  width: 70%;
  display: block;
  align-items: center;
  text-align: left;
  position: relative;
  display: none;
}
@media screen and (max-width: 480px) {
  .yoyakuform-additem {
    padding-left: 14px;
    padding-right: 14px;
    padding-top: 16px;
    padding-bottom: 16px;
    flex-wrap: wrap;
    vertical-align: top;
  }
}
.yoyakuform-item label {
  width: 70%;
  max-width: 70%;
  letter-spacing: 0.05em;
  font-weight: normal;
  font-size: 1.1rem;
  padding-top: 0px;
  padding-left: 10px;
}
.yoyakuform-additem label {
  width: 70%;
  max-width: 70%;
  letter-spacing: 0.05em;
  font-weight: normal;
  font-size: 1.1rem;
  padding-top: 0px;
  padding-left: 10px;
}
@media screen and (max-width: 480px) {
  .yoyakuform-item label {
    max-width: inherit;
    display: block;
    align-items: center;
    font-size: 1.1rem;
  }
  .yoyakuform-additem label {
    max-width: inherit;
    display: block;
    align-items: center;
    font-size: 1.1rem;
  }
}
.yoyakuform-item label.ismsg {
  margin-top: 15px;
  margin-bottom: auto;
}
.yoyakuform-additem label.ismsg {
  margin-top: 15px;
  margin-bottom: auto;
}
@media screen and (max-width: 480px) {
  .yoyakuform-item label.ismsg {
    margin-top: 15px;
  }
  .yoyakuform-additem label.ismsg {
    margin-top: 15px;
  }
}
.yoyakuform-item-required {
  border-radius: 6px;
  margin-right: 8px;
  padding-top: 2px;
  padding-bottom: 2px;
  width: 48px;
  display: inline-block;
  text-align: center;
  background: rgb(255,0,0);
  color: #fff;
  font-size: 0.9rem;
  position: absolute;
  top: 5px;
  left: 10px;
}
.yoyakuform-item-unrequired {
  border-radius: 6px;
  margin-right: 8px;
  padding-top: 2px;
  padding-bottom: 2px;
  width: 48px;
  display: block;
  text-align: center;
  background: rgb(0,0,255);
  color: #fff;
  font-size: 0.9rem;
  position: absolute;
  top: 5px;
  left: 10px;
}

@media screen and (max-width: 480px) {
  .yoyakuform-item-required {
    border-radius: 4px;
    padding-top: 2px;
    padding-bottom: 4px;
    width: 32px;
    font-size:  0.9rem;
	left: 15px;
  }
  .yoyakuform-item-unrequired {
    border-radius: 4px;
    padding-top: 2px;
    padding-bottom: 4px;
    width: 32px;
    font-size: 0.9rem;
	left: 15px;
  }
}
.yoyakuform-item-input {
	display: block;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 6px;
	margin-left: 0px;
	width: 100%;
/*	height: 50px;
	max-width: 95%;
	background: rgba(0, 0, 0, 0.3); */
	font-size: 1.1rem;
/*	color: rgba(255, 255, 255, 1);
	background: url(images/text-color.gif);
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	text-shadow: 8px 8px 8px rgba(255,255,255,0.3); */
}
@media screen and (max-width: 480px) {
  .yoyakuform-item-input {
    margin-left: 0;
    margin-top: 18px;
    height: 40px;
    flex: inherit;
    font-size: 1.1rem;
  }
}
.yoyakuform-item-textarea {
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 6px;
	margin-left: 0px;
	height: 108px;
	width: 95%;
	max-width: 100%;
	background: #eaedf2;
/*	background: rgba(0, 0, 0, 0.3); */
	font-size: 1.1rem;
/*	color: rgba(255, 255, 255, 1); */
}
@media screen and (max-width: 480px) {
  .yoyakuform-item-textarea {
    margin-top: 18px;
    margin-left: 0;
    height: 80px;
    flex: inherit;
    font-size: 1.1rem;
  }
}
.yoyakuform-btn {
  border-radius: 6px;
  margin-top: 32px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 10px;
  padding-bottom: 10px;
  width: 200px;
  display: block;
  letter-spacing: 0.05em;
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
  font-weight: bold;
  font-size: 1.1rem;
  font-family: 'メイリオ', 'Meiryo', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'Noto Sans Japanese', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
@media screen and (max-width: 480px) {
  .yoyakuform-btn {
    margin-top: 24px;
    padding-top: 8px;
    padding-bottom: 8px;
    width: 160px;
    font-size: 1.1rem;
  }
}

.swiper-container {
	height: 400px;
    width: 95%;
}
@media screen and (max-width: 480px) {
  .swiper-container {
    height: 500px;
    flex: inherit;
    font-size: 1.1rem;
  }
}

.swiper {
  max-width: 500px;
  margin: 30px 0;
}
 
:root {
  --swiper-navigation-color: #ffffff;
  --swiper-pagination-color: #ffffff;
}