@charset "utf-8";

/* ========================== */
/* さな田CSS（Based on 克享） */
/* ========================== */
/* Last Modified: 2023/03/12 19:48 */

.nuc {
	margin: 0.5em auto;
	padding: 0.5em 1.5em;
	border: 3px solid #ccc;
	border-radius: 1em;
	background-color: #eee;
	width: fit-content;
	text-align: center;
}
.nuc p {
	line-height: 1.6;
}

body {
	font-family: "メイリオ",Meiryo,"Hiragino Kaku Gothic ProN","Hiragino Sans",sans-serif;
	margin: 0;
	padding: 0;
	background-color: white;
	color: black;
}

body.menuPage {
	color: black;
	background-color: white;
	background-image: url("/imgs/menuback.png");
}

.sanadaPageCover {
	max-width: 900px;
	margin: 0 auto;
	padding: 0;
}

.contactArea .subtitle,
.kodawarihead,
.oshinaarea h2,
.oshinaguide,
.jpfont {
	font-family: 'Yuji Syuku', serif;	/* Google Fonts */
	transform: rotate(0.03deg);
}

i {
	font-style: normal;
	display: inline-block;
}

/* リンク画像の装飾 */
a img:hover {
	opacity: 0.7;
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* ▼共通装飾（PCファースト）                             */
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

	/* ============ */
	/* ■トップ画像 */
	/* ============ */
	.topheadimage {
		margin: 0;
		padding: 0;
	}
	.topheadimage img {
		max-width: 100%;
		width: auto;
		height: auto;
		display: block;
		margin: auto;
	}

	/* ============ */
	/* ■ヘッダ領域 */
	/* ============ */
	.deepHead {
		margin: 0;
		padding: 0;
		background-color: black;
		color: white;
		border-bottom: 3px double white;
		display: table;
	}
		.deepHead h1,
		.deepHead .headGuide {
			display: table-cell;
			margin: 0;
			padding: 0;
			vertical-align: middle;
		}
		.deepHead .headGuide {
			padding: 0 1em;
		}
		.deepHead h1 a {
			display: block;
		}
		.deepHead h1 img {
			max-width: 240px;
			display: block;
		}

	/* ======== */
	/* ■帯領域 */
	/* ======== */
	.obi {
		margin: 0;
		padding: 0.5em;
		background-color: white;
	}
	.obi .topnewsbox {
		margin: 0;
		padding: 1em 0 0 0;
		text-align: center;
		font-size: 1.35em;
		line-height: 1.5;
		color: white;
	}
		.ctrllink {
			margin: 0;
			font-size: 0.75em;
			text-align: right;
		}
			.ctrllink a {
				color: #ddd;
				text-decoration: none;
			}
			.ctrllink a:hover { text-decoration: underline; }

	/* ============ */
	/* ■トップMAIN */
	/* ============ */
	.topcontents {
		margin: 0;
		padding: 0;
		display: table;
		width: 100%;
	}
		/* メニュー段 */
		.mainmenuarea {
			display: table-cell;
			vertical-align: middle;
			text-align: center;
			min-width: 25%;
			background-image: url('Banner.png');
		}
			/* メニュー */
			.mainmenu {
				margin: 0;
				padding: 1em 0;
			}
			.mainmenu li {
				margin-bottom: 1.2em;
				font-size: 1.4em;
				list-style-type: none;
			}
			.mainmenu li:first-child {
				margin-top: 0.5em;
			}
			.mainmenu a {
				text-decoration: none;
				color: white;
			}
			.mainmenu a:hover { color: #fbe995; }

			/* アクセスカウンタ */
			.counterbox {
				margin: 1em 0;
				padding: 0;
			}
				.counterbox .counter {
					width: auto;
					height: 11px;	/* 元サイズ 98x14 */
				}

		/* 地図段 */
		.maparea {
			display: table-cell;
			background-color: white;
			background-image: url("/nabe.png");
			background-size: cover;
		}

			/* メニューボタン */
			.menubtnbox {
				text-align: center;
				margin: 0;
				padding: 2.5em 0;
			}
				.menubtns {
					margin: 0;
					padding: 1.5em 0;
					list-style-type: none;
				}
					.oneMenuBtnBox {
						display: inline-block;
					}
						.onemenubtn {
							display: block;
						}
							.onemenubtn img {
								width: auto;
								height: 200px;
							}

			/* 動画切り替えタブ */
			/* ▼タブ機能制御用ラジオボタンは非表示 */
			input.tabcheck { display: none; }
			/* ▼タブ(共通装飾＋非選択状態の装飾) */
			.tab {
				display: inline-block;
				vertical-align: top;
				padding: 0;
				margin: 0 0 0 0.75em;
			}
			.tab img {
				display: block;
				border-width: 1px 1px 0 1px; border-style: solid; border-color: white; border-radius: 1em 1em 0 0;
				padding: 3px 3px 5px 3px;
				width: 200px;
				height: auto;
				cursor: pointer;
				opacity: 0.75;
			}
			#tab1 {
				margin-left: 1em;
			}
			.tab.tabbtm {
				border-width: 0 1px 1px 1px; border-radius: 0 0 0.75em 0.75em; margin-top: -1px; z-index: 10;
			}
			.tab:hover img {
				opacity: 1;
			}
			/* ▼チェックが入っているラジオボタンの隣にあるタブの装飾(＝選択状態のタブ) */
			input:checked + .tab {
				z-index: 10;
				border-bottom: 1px solid #701630;
				background-color: transparent;
			}
			input:checked + .tab img {
				opacity: 1;
			}
			input:checked + #tab1 , #tabcheck1:checked ~ #tabbtm1 { position:relative; }
			input:checked + #tab2 , #tabcheck2:checked ~ #tabbtm2 { position:relative; }
			/* ▼タブの中身(共通装飾＋非選択状態の装飾) */
			.tabcontent {
				display: none; border: 1px solid gray; margin-top: -1px; position: relative; z-index: 0;
			}
			/* ▼チェックが入っているラジオボタンに対応するタブの中身を表示する */
			#tabcheck1:checked ~ #tabcontent1,
			#tabcheck2:checked ~ #tabcontent2 { display: block; }

			/* タブ下線 */
			.tabunderline {
				margin-top: -1px;
				border-top: 1px solid white;
				height: 0.75em;
			}

			/* 動画ボックス */
			.moviebox {
				display: block;
				max-width: 800px;
				margin: auto;
				padding: 1em;
			}
				.movie-wrap {
					position: relative;
					padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
					height: 0;
					overflow: hidden;
				}
				.movie-wrap iframe {
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
				}

			/* 地図ボックス */
			.mapbox {
				display: table;
				margin: 0 auto;
				padding: 0;
			}
				.mapimage,
				.mapguide {
					display: table-cell;
					vertical-align: top;
					padding: 1em 0.5em;
					font-size: 0.9em;
				}
				.mapguide.en {
					font-size: 0.8em;
				}

	/* ============== */
	/* ■動的合成領域 */
	/* ============== */
	#contactbox {
		color: black;
		text-align: center;
	}
	#contactbox .qrimage img {
		display: block;
		margin: auto;
		max-width: 100%;
		width: 137px; height: 137px;
	}

		.contactMain {
			margin:0;
			padding:1em;
		}
		.cTitle {
			font-size: 1.2em;
			margin: 1em 0 0;
		}
		.cBody {
			margin: 0 0 1em;
		}
			.cOpenHour {
				font-size: 1.15em;
				text-decoration-line: underline;
				text-decoration-color: #ccc;
			}
			.cReservation {
				color: crimson;
			}
			.cCourse {
				font-weight: bold;
			}
			.cTel,
			.cTel:link,
			.cTel:visited {
				color: crimson;
				text-decoration:none;
			}
			.cTel:hover {
				background-color: #fee;
			}

	/* ============================ */
	/* ■メニューページ内コンテンツ */
	/* ============================ */
	.oshinaarea h2 {
		background-color: #5c0e01;
		color: white;
		margin: 0;
		padding: 0.5em;
	}

	.oshinalist {
		list-style-type: none;
		margin: 1em;
		padding: 1em;
	}
		.oshinalist li {
			background-color: #fff;
			border: 3px dashed #bd3420;
			margin: 1em;
			padding: 1em;
		}
		.oshinalist li::after {
			content: "";
			clear: both;
			display: block;
		}

			/* メニュー写真 */
			.oshinalist img {
				width: 200px;
				float: left;
				margin-right: 1em;
			}

		/* 商品名 */
		.oshinaname {
			color: #bd3420;
		}

		/* 価格 */
		.price {
			display: inline-block;
		}

		/* ガイド文章段落 */
		.oshinaparagraph {
			margin: 1em 2em;
			padding: 0.5em;
			background-color: rgba(255,255,255,0.5);
		}

		/* 画像リスト */
		.imagelist {
			list-style-type: none;
			margin: 1.5em 2.5em;
			padding: 0;
		}
			.imagelist li {
				display: inline-block;
			}
			.imagelist a {
				color: brown;
				text-align: center;
				display: block;
				font-weight: bold;
				text-decoration: none;
				text-shadow: 1px 1px 1px white, -1px 1px 1px white, 1px -1px 1px white, -1px -1px 1px white;
			}
			.imagelist a:hover { color: red; text-decoration: underline; }
			.imagelist img {
				width: 200px;
				display: block;
			}

	/* ========================== */
	/* ■注文フォーム内コンテンツ */
	/* ========================== */
	.contactArea {
		margin: 1em;
		padding: 1em;
		outline: 2px solid white;
		border: 2px #6a0a0b solid;
		background-color: white;
		color: black;
	}
		.subtitle {
			text-align: center;
			color: #6a0a0b;
		}

		.contactArea a {
			color: blue;
		}

		.headNotice {
			font-size: 0.9em;
			text-align: center;
		}

		/* テーブル */
		.contacttable {
			border-collapse: collapse;
			border: 2px #6a0a0b solid;
			margin: 1em auto;
		}
		.contacttable th,
		.contacttable td {
			border: 1px #6a0a0b solid;
			padding: 6px;
			text-align: left;
		}
		.contacttable th {
			background-color: #fde6e6;
			line-height: 1.1;
			font-weight: normal;
		}

			/* 入力欄 */
			.contacttable input {
				font-size: 16px;
			}

			input.zipnumber { width: 5em; }
			input.freetext  { width: 100%; box-sizing: border-box; }
			input.number    { width: 1.8em; }
			.freeinputbox { width: 500px; height: 4em; }

			.inputName { max-width: 12em; }
			.inputMail { max-width: 18em; }
			.inputTel  { max-width: 15em; }

			/* リスト */
			.itemList {
				margin-top: 0.5em;
				margin-bottom: 0.5em;
			}

			/* 注釈 */
			.addressNotice,
			.orderNotice,
			.msgNotice {
				display: inline-block;
				line-height: 1.2;
			}

			.addressNotice {
				font-size: 0.67em;
				color: crimson;
			}
			.orderNotice {
				font-size: 0.75em;
				color: crimson;
			}
			.msgNotice {
				font-size: 0.75em;
				color: #555;
			}

			/* 送信ボタン */
			.contacttable .formbuttons {
				padding: 1em;
				text-align: center;
				background-color: #fef9f9;
			}
			.formbuttons input[type=submit] {
				font-size: 1.25em;
				border: 1px solid gray;
				background-color: #ddd;
				line-height: 1;
				padding: 0.5em 1.5em;
				border-radius: 12px;
				cursor: pointer;
				font-weight: bold;
			}
			.formbuttons input[type=submit]:hover {
				border-color: #6a0a0b;
				background-color: #6a0a0b;
				color: white;
			}

			/* ポリシー */
			.policyBox {
				border: 1px dashed #ddd;
				border-radius: 1em;
				max-width: 700px;
				margin: 3em auto;
				padding: 1em;
				font-size: 0.9em;
				text-align: center;
				background-color: #f5f5f5;
			}

	/* ============ */
	/* ■フッタ領域 */
	/* ============ */
	footer .footerpaper {
		margin: 0;
		padding: 1em;
		font-size: 0.9em;
		/* min-height: 800px; */
		background-image: url("/HPcg222.png");
		background-repeat: no-repeat;
		background-size: 100%;
		background-position: bottom right;
	}
	footer .footerpaper p {
		text-align: center;
	}
	footer .footerpaper p span {
		display: inline-block;
	}
		.accessbox {
			margin: 15em 0 3em;
			font-size: 1.2em;
		}
			.catchcopy {
				margin: 2em 0 3em;
			}
				.catchname {
					font-size: 1.3rem;
					display: inline-block;
				}
			.address .tel {
				margin: 0 1em;
			}
				.address .tel a { color: black; }

		.history {
			font-size: 1em;
			margin: 9em auto 13em;
			padding: 0;
		}
		.history li {
			margin: 0;
			padding: 0;
			list-style-type: none;
			text-align: center;
		}

		.outerlinkbox {
			margin: 2em 0 2em 0;
			padding: 0 18%;
			list-style-type: none;
			text-align: center;
		}
			.outerlinkbox li {
				display: inline-block;
				margin: 0 25px;
			}

		.copyright {
			margin: 0;
			opacity: 0;
		}



/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* ▼モバイル版：スマートフォン・タブレット用上書き       */
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
@media all and (max-width: 800px) {

	/* ======== */
	/* ■帯領域 */
	/* ======== */
	.obi {
		padding: 1.25em;
	}
	.obi .topnewsbox {
		font-size: 1.1em;
	}

	/* ============ */
	/* ■トップMAIN */
	/* ============ */
	.topcontents {
		display: block;
	}
		/* メニュー段 */
		.mainmenuarea {
			display: block;
		}
			/* メニュー */
			.mainmenu li {
				display: inline-block;
				min-width: 5.5em;
				margin: 0.5em 0;
			}

			/* アクセスカウンタ */
			.counterbox {
				margin: 0.2em 0 1em 0;
				padding: 0;
			}
				.counterbox .counter {
					width: auto;
					height: 10px;
				}

		/* 地図段 */
		.maparea {
			display: block;
		}

			/* メニューボタン */
			.menubtnbox {
				padding: 1.25em 0;
			}
							.onemenubtn img {
								height: 150px;
							}

			/* 地図ボックス */
			.mapbox {
			}
				.mapimage,
				.mapguide {
					font-size: 0.75em;
				}

			/* 動画切り替えタブ */
			.tab img {
				width: 150px;
				opacity: 0.7;
			}

			/* 動画ボックス */
			.moviebox {
				padding: 0.5em;
			}

	/* ============== */
	/* ■動的合成領域 */
	/* ============== */
	#contactbox .qrimage img {
		width: 110px; height: 110px;
	}

	/* ============ */
	/* ■フッタ領域 */
	/* ============ */
	footer .footerpaper {
		font-size: 0.85rem;
		background-size: contain;
	}
		.accessbox {
			margin: 31vw 0 6vw;	/* 画面幅800pxに対して250px */
			font-size: 0.9em;
		}
			.catchcopy {
				margin: 20vw 0 0;
			}
				.catchname {
					font-size: 1rem;
				}
				.outerlinkbox li {
					margin: 0 10px;
				}
				.outerlinkbox li img {
					width: 150px;
					height: auto;
				}

		.history {
			margin: 15vw auto 20vw;	/* 画面幅800pxに対して144pxと208px */
		}

}


/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* ▼モバイル版：スマートフォン専用上書き                 */
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
@media all and (max-width: 450px) {

	.pc-only { display: none; }

	/* ============ */
	/* ■ヘッダ領域 */
	/* ============ */
	.deepHead {
		display: block;
	}
		.deepHead h1,
		.deepHead .headGuide {
			display: block;
		}
		.deepHead .headGuide {
			padding: 1em;
			font-size: 0.85em;
		}
		.deepHead h1 a {
			display: block;
		}
		.deepHead h1 img {
			max-width: 100%;
		}

	/* ============ */
	/* ■トップMAIN */
	/* ============ */
			/* 動画切り替えタブ */
			.tab img {
				width: 120px;
				opacity: 0.9;
			}

			/* タブ下線 */
			.tabunderline {
				height: 0.4em;
			}

	/* ============================ */
	/* ■メニューページ内コンテンツ */
	/* ============================ */
	.oshinalist {
		margin: 0.5em;
		padding: 0.5em;
	}
		.oshinalist li {
			margin: 0 0 1.5em 0;
			padding: 0.5em;
			font-size: 0.9em;
		}

			/* メニュー写真 */
			.oshinalist img {
				width: 150px;
			}

			.oshinaguide {
				clear: left;
			}

		/* ガイド文章段落 */
		.oshinaparagraph {
			margin: 1em;
			font-size: 0.85em;
		}

		/* 画像リスト */
		.imagelist {
			margin: 1.5em 0;
			text-align: center;
		}
			.imagelist a {
				font-size: 0.85em;
			}
			.imagelist img {
				width: 150px;
			}

	/* ========================== */
	/* ■注文フォーム内コンテンツ */
	/* ========================== */
	.contactArea {
		margin: 0.5em;
		padding: 0.5em;
	}
		.headNotice {
			font-size: 0.8em;
		}

		/* テーブル */
		.contacttable th,
		.contacttable td {
			padding: 6px 3px;
			text-align: left;
		}
		.contacttable th {
			font-size: 0.85em;
		}

			/* 入力欄 */
			.freeinputbox { min-width: 210px; width: 100%; box-sizing: border-box;  }

			/* ポリシー */
			.policyBox {
				margin: 3em 0.25em;
				padding: 0.75em;
				font-size: 0.8em;
			}

	/* ============== */
	/* ■動的合成領域 */
	/* ============== */
	#contactbox .qrimage {
		display: none;
	}

	/* ============ */
	/* ■フッタ領域 */
	/* ============ */
	footer .footerpaper {
		padding-bottom: 0.33em;
		padding-right: 50px;
	}
		.accessbox {
			margin: 100px 0 8vw;
			font-size: 0.8em;
		}
			.catchcopy {
				margin: 1em 0 0;
			}

		.history {
			margin: 8vw auto 20vw;
			font-size: 0.7em;
		}

		.outerlinkbox {
			padding: 0;
		}
			.outerlinkbox li {
				margin: 0 5px;
			}
			.outerlinkbox li img {
				width: 100px;
				height: auto;
			}

		.copyright {
			display: none;
		}

}

/* ▼モバイル版：極小調節 */
@media all and (max-width: 350px) {

	footer .footerpaper {
		font-size: 0.7em;
	}

}

/* ＝＝＝＝＝＝＝＝＝＝＝ */
/* ▼スクリプト用スタイル */
/* ＝＝＝＝＝＝＝＝＝＝＝ */
.dynamicframe {
	display: none;
}


/* ======================= */
/* ■埋め込みツール等用CSS */
/* ======================= */
/* ―――――――――――― */
/* ★ループスライダー用CSS  */
/* ―――――――――――― */
/* ▼loopSlider  */
.loopSliderWrap { top: 0; left: 0; overflow: hidden; position: absolute; text-align: center; }
.loopSliderWrap p { margin:0; padding: 0; }
.loopSlider { margin: 0 auto; width: 100%; height: 120px; text-align: left; position: relative; overflow: hidden; }
.loopSlider ul { height: 120px; float: left; overflow: hidden; }
.loopSlider ul li { padding: 0; float: left; display: inline; overflow: hidden; border: 0px solid #eeeeee; box-sizing: border-box; }
.loopSlider ul li img { display: block; }
.loopSlider * { margin: 0; padding: 0; }
.loopSliderWrap:after { content: ""; display: none; clear: none; }

.loopBoxTitle { font-size: 1em;  color: #d8abac; }
.loopBoxGuide { font-size: 0.9em; color: #d8abac; }

/* 真田紐 */
.sanadahimo {
	height: 22px;
	background-image: url("/sanadahimo.png");
	background-size: contain;
}