@charset "shift_jis";

body {
	margin: 0;
	padding: 0;
	background: #fff;
	font: 90% 'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',Meiryo,メイリオ,Osaka,'MS PGothic',arial,helvetica,sans-serif;
}
a {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
	color: #dd0000 !important;
}
a:link, a:visited {
	color: #0044cc;
}
#head {
	/* background-image: url(bg.jpg); */
	/* background-image: url(logo.png); */
	background: #f36027;
	height: 30px;
	padding: 7px; 20px;
	color: #fff9bd;
}
h1 {
	margin: 0;
	font-size: 125%;
}
#body {
	text-align: center;
	padding: .4em 0;
	background: #fcfae1;
}
.panel {
	margin: 1em auto;
	padding: 0.5em 1em;
	width: 500px;
	font-weight: bold;
	font-size: 110%;
}
.panel span {
	border: 1px solid #ccc;
	margin: 0 1em;
	padding: 4px 8px;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}
#sel-btn {
	width: 440px;
	margin-left: auto;
	padding: 4px;
	background: #fff;
	border: 1px solid #b6b6b6;
}
#sel-btn input[type="button"] {
	/* width: 110px; */
	height: 35px;
	font-size: 85%;
}
#sel-btn .btn {
	margin-right: 1.5em;
}
#calen {
	border-collapse: collapse;
	margin: 1em auto;
	table-layout: fixed;
	width: 910px;
}
#calen th, #calen td {
	width: 130px;
	border: 1px solid #b6b6b6;
	padding: 0px;
}
#calen th {
	background: #eee;
}
#calen td {
	background: #fff;
	height: 80px;
	vertical-align: top;
	text-align: left;
	font-size: 80%;
	color: #666;
	padding: 0 3px;
}
.day {
	font-weight: bold;
	color: #000;
	margin-bottom: 5px;
	text-align: center;
}
#calen td div {
	margin-bottom: 5px;
}
#calen td p {
	margin: 0;
}
/*
.linkbox {
  position: relative;
  width: 120px;
  height: 40px;
  margin: 0;
}
.linkbox a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
*/

/* 予約リスト */
.resv-list {
	border-collapse: collapse;
	width: 80%;
	margin: 6px auto;
}
.resv-list th, .resv-list td {
	border: 1px solid #aaa;
	padding: 1em;
}
.resv-list th {
	background: #ffffcd;
	text-align: left;
}
.resv-list td {
	background: #fff;
}
.detail-ttl {
	width: 80%;
	margin: 10px auto;
	border: 1px solid #f9aa8b;
	padding: 1em;
	color: orange;
	font-weight: bold;
	font-size: 120%;
	text-align: left;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	background: #fff;
}
.detail-com {
	width: 80%;
	margin: 10px auto;
	text-align: left;
}
.detail-com p {
	margin: 1.5em 1em;
}

#list {
	border-collapse: collapse;
	margin: 1em auto;
	table-layout: auto;
}
#list th, #list td {
	border: 1px solid #b6b6b6;
	padding: 5px 10px;
}
#list th {
	background: #eee;
}
#list td {
	background: #fff;
}
#month {
	border-collapse: collapse;
	margin: 1em auto;
	table-layout: auto;
}
#month th, #month td {
	border: 1px solid #b6b6b6;
	padding: 0.5em 1em;
}
#month th {
	background: #eee;
}
.memo {
	width: 80%;
	padding: 1em;
	border: 1px dotted #666;
	margin: 1.5em auto;
	text-align: left;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	background: #fff;
}
#form {
	border-collapse: collapse;
	margin: 1em auto;
	table-layout: auto;
}
#form th, #form td {
	border: 1px solid #b6b6b6;
	padding: 6px 12px;
	text-align: left;
}
#form th {
	background: #f0f0f0;
	width: 160px;
}
#form td {
	text-align: left;
	background: #fff;
}
#form td input[type="text"] {
	padding: 3px;
}
.bigbtn {
	width: 120px;
	height: 32px;
}
.zeusbtn {
	width: 180px;
	height: 32px;
}
.mark-btn {
	border: 1px dotted #ed6800;
	padding: 2em;
	width: 300px;
	margin: 0 auto;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	background: #fff;
}
#err-box {
	width: 500px;
	padding: 1em;
	margin: 1.6em auto;
	border: 1px dotted red;
	background: #ffe0df;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
}
#err-box p {
	color: #dd0000;
}
.back-btn {
	text-align: right;
	margin: 3px;
}
.ta-c {
	text-align: center;
}
.ta-r {
	text-align: right;
}
.ta-l {
	text-align: left;
}
.grn {
	color: green;
	font-size: 90%;
}
.gry {
	color: gray;
}
img.icon {
	vertical-align: middle;
}
.red {
	color: red;
}

/* スマホ用 */
@media only screen and (max-width: 480px) {
	#sel-btn {
		width: 100%;
		padding: 1px;
		margin: 5px auto;
	}
	#sel-btn .btn {
		margin-right: .5em;
	}
	#calen {
		width: 100%;
	}
	#calen th, #calen td {
		width: 14.2%;
		padding: 0;
	}
	#calen td {
		font-size: 90%;
	}
	#list {
		margin: .5em auto;
		width: 96%;
	}
	#list th, #list td {
		padding: 0;
	}
	.detail-ttl, .detail-com {
		width: 100%;
		margin: 0.5em auto;
		padding: 3px;
		font-size: 100%;
	}
	.detail-com p {
		margin: 0.8em;
	}
	.resv-list {
		width: 100%;
		margin: 3px auto;
	}
	.resv-list th, .resv-list td {
		padding: 1px;
	}
	.memo {
		width: 100%;
		padding: 3px;
		margin: 0.5em;
	}
	#form {
		width: 100%;
		margin: .5em;
	}
	#form th, #form td {
		display: block;
		width: 100%;
		padding: 0;
	}
}