html { font-size:24pt;
}
@media screen and (min-width:2px) {/* 428px以下のスマホ画面時*/
	html { font-size:20pt
	}
}
@media screen and (min-width:428px) {/* 920px以下のスマホ画面時*/
	html { font-size:24pt
	}
}
body {	color:#000000; background:linear-gradient(0.25turn, #ba0, #ed0, #ed0, #ba0); text-align:center;
	font-family:'メイリオ', 'Meiryo','ＭＳ ゴシック', 'Hiragino Kaku Gothic ProN',sans-serif; margin:0px; padding:0px;
}
header {	color:#000000; padding:0px; margin:0px; width:100%; height:72px; text-align:center; display:flex; position:fixed;
		justify-content:space-between; z-index:60; background-color:#eedd00; border-bottom:2px #777700 groove;
}
h1 {	font-size:1.5rem; margin:2px 8px; color:#ffff66; font-weight:bold; padding:0px; margin:0px;
}
h2 {	font-size:1.5rem; font-weight:bold; padding:10px 0px 16px; margin:0px; line-height:130%;
}
h3 {	font-size:1.5rem; font-weight:bold; padding:20px 0px 16px; margin:0px;
}
h4 {	font-size:1.2rem; font-weight:bold; padding:12px 0px 8px; margin:0px;
}

input[type="button"] {	font-size:0.8rem;
}

@media screen and (max-width: 428px) {/* 428px以下のスマホ画面時*/
	h1 { font-size:0.82rem;
	}
	h2 { font-size:0.82rem;
	}
	h3 { font-size:0.82rem;
	}
	h4 { font-size:0.65rem;
	}
}
@media screen and (max-width: 920px) {/* 920px以下のスマホ画面時*/
	h1 { font-size:1rem;
	}
	h2 { font-size:1rem;
	}
	h3 { font-size:1rem;
	}
	h4 { font-size:0.8rem;
	}
}

small.gid {	color:#ffee55; font-size:1rem;
}

table,td,tr {	margin:0px; border:0px #ffffff solid; text-align:left; vertical-align:top; 
	border-collapse:collapse; border-spacing:0px;
}
table.main {	width:96%; background-color:#ffffff;
}


div,p {	text-align:left; margin:0px; line-height:150%;
}
div.main {	width:100%;  text-align:center; margin:0px; padding:0px;
}


span.arw {	color:#ccccaa;
}

span.ao {	color:#0022bb; font-size:1rem;
}

p.cmnt	{ margin:12px 40px 6px 40px; font-size:1rem;
}
@media screen and (max-width: 920px) {
	p.cmnt { margin:12px 8px; font-size:0.75rem;
	}
	span.ao { color:#0022bb; font-size:0.7rem;
	}
}


img.logo { margin-top:4px; margin-left:calc(50% - 200px); height:60px; width:auto;
}
@media screen and (min-width: 6px) {
	img.logo { margin-top:14px; margin-left:104px; height:38px; width:auto;
	}
}
@media screen and (min-width: 590px) {
	img.logo { margin-top:6px; margin-left:calc(50% - 100px); height:54px; width:auto;
	}
}
@media screen and (min-width: 1000px) {
	img.logo { margin-top:4px; margin-left:calc(50% - 200px); height:60px; width:auto;
	}
}



/* ▼Shopへのリンクボタン */
a.goShop {	display:inline-block; border:1px #999999 solid; border-radius:40px; background-color:#0066cc; color:#ffffff; font-size:1rem;
		padding:3px 12px 0px; margin:4px 12px; text-decoration:none; transition:background-color 0.6s;
}
a.goShop:hover {	 background-color:#ff9966; color:#000000; text-decoration:none; transition:background-color 0.6s;
}

@media screen and (max-width: 560px) {
	a.goShop { border-radius:26px; font-size:0.5rem; padding:1px 6px 0px; margin:4px 4px;
	}
}




/* ▼カテゴリ・タイトル */

.cate_title {
	position: fixed;
	top: 4px;
	left: 2px;
	font-family:'メイリオ', 'Meiryo','ＭＳ ゴシック', 'Hiragino Kaku Gothic ProN',sans-serif;
	letter-spacing:1px; font-weight:normal; padding:2px 0px 0px 2px; color:#000000;
	font-size: 0.7rem; line-height:130%;
}
@media screen and (min-width: 6px) {
	.cate_title { position: fixed; top:12px; left:0px; font-size:0.45rem;
	}
}
@media screen and (min-width: 590px) {
	.cate_title { position: fixed; top:6px; left:2px; font-size:0.6rem;
	}
}
@media screen and (min-width: 1000px) {
	.cate_title { position: fixed; top:4px; left:2px; font-size:0.7rem;
	}
}







/* ▼三本線 メニューボタンを右上に表示 */

.menu-btn {
	position: fixed;
	top: 3px;
	right: 6px;
	display: flex;
	height: 60px;
	width: 60px;
	justify-content: center;
	align-items: center;
	border-radius: 10px;
	padding-top: 4px;
	z-index: 90;
	background-color: rgba(0, 0, 32, 0.6);
}
.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {
	content: '';
	display: block;
	height: 4px;
	width: 40px;
	border-radius: 8px;
	background-color: #ffffff;
	position: absolute;
}
.menu-btn span:before {
	bottom: 11px;
}
.menu-btn span:after {
	top: 11px;
}

#menu-btn-check:checked ~ .menu-btn span {
	background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
}
#menu-btn-check:checked ~ .menu-btn span::before {
	bottom: 0;
	transform: rotate(45deg);
}
#menu-btn-check:checked ~ .menu-btn span::after {
	top: 0;
	transform: rotate(-45deg);
}

#menu-btn-check {
	display: none;
}

.menu-moji {
	position: fixed;
	top: 5px;
	right: 5px;
	display: flex;
	height: 16px;
	width: 60px;
	color: #ffffff;
	font-size: 12px;
	justify-content: center;
	align-items: center;
	z-index: 91;
}

/* ▼メニュー表示 */

.menu-content {
	width: 480px;/*メニュー幅*/
	height: 100%;
	position: fixed;
	top: 0;
	left: 100%;/*leftの値を変更してメニューを画面外へ*/
	z-index: 80;
	background-color: rgba(0, 0, 32, 0.85);
	transition: all 0.5s;/*アニメーション設定*/
}
#menu-btn-check:checked ~ .menu-content {
	left: calc(100% - 480px);/*メニューを画面内へ*/
}
.menu-content ul {
	padding: 50px 10px 0;
}
.menu-content ul li {
	border-bottom: solid 1px #ffffff; margin:0px; height:50px;
	list-style: none;
}
.menu-content ul li a {
	display: block;
	width: 100%;
	font-size: 0.8rem;
	box-sizing: border-box;
	color:#ffffff;
	text-decoration: none;
	padding: 8px 15px 10px 0;
	margin: 0px;
	position: relative;
}
.menu-content ul li a::before {
	content: "";
	width: 12px;
	height: 12px;
	border-top: solid 2px #ffffff;
	border-right: solid 2px #ffffff;
	transform: rotate(45deg);
	position: absolute;
	right: 11px;
	top: 14px;
}
.menu-content a:hover {
	color:#44ffff;
}

@media screen and (max-width: 490px) {
	.menu-content {
		width: 300px;
		height: 100%;
		position: fixed;
		top: 0;
		left: 100%;
	}
	#menu-btn-check:checked ~ .menu-content {
		left: calc(100% - 300px);
	}
	.menu-content ul {
		padding: 35px 10px 0;
	}
	.menu-content ul li a {
		font-size: 0.65rem;
		padding: 5px 10px 6px 0px;
	}
}
@media screen and (max-height: 540px) {
	.menu-content {
		width: 300px;
		height: 100%;
		position: fixed;
		top: 0;
		left: 100%;
	}
	.menu-content ul li a {
		font-size: 0.45rem;
		padding: 0px 10px 3px 0px;
	}
	.menu-content ul li a::before {
		width: 10px;
		height: 10px;
		border-top: solid 2px #ffffff;
		border-right: solid 2px #ffffff;
		transform: rotate(45deg);
		position: absolute;
		right: 8px;
		top: 10px;
	}
	#menu-btn-check:checked ~ .menu-content {
		left: calc(100% - 300px);
	}
	.menu-content ul {
		padding: 35px 10px 0;
	}
	.menu-content ul li {
		height:32px;
	}

}








/* ▼TOPに戻るボタン */

#page_top {
	opacity:0.8;
	font-size: 1rem;
	position: fixed;
	bottom: 4px;
	left: 10px;
	z-index: 70;
}

#page_top a {
	opacity: 0.8;
	background-color: rgba(48,48,32,0);
	color: #fff;
	text-align: center;
	text-decoration: none;
	padding: 2px;
}
#page_top a:hover {
	opacity: 1;
	background-color: rgba(0,250,32,0);
	text-decoration: none;
}





.spc {	margin:20px;
}

div.white {	color:#000000; background-color:rgba(255,255,255,0.95); width:94%; text-align:center; padding:0px 0px 16px 0px; margin:2px;
	box-shadow: 0 10px 15px 0 rgba(0, 0, 0, .5); position:relative;
}
div.black {	color:#ffffff; background-color:rgba(0,0,16,0.9); width:94%; text-align:center; padding:0px;
	box-shadow: 0 10px 15px 0 rgba(0, 0, 0, .5); position:relative;
}


div.titlebar {	font-size:1.4rem; background-color:#99ffff; width:100%; margin:0px; padding:10px 0px; color:#000000; text-align:center;
		font-weight:bold; letter-spacing:0.5em; border-bottom:1px #008888 solid;
}
@media screen and (min-width: 10px) {
	div.titlebar { font-size:0.8rem; letter-spacing:0.2em;
	}
}
@media screen and (min-width: 800px) {
	div.titlebar { font-size:1.1rem; letter-spacing:0.3em;
	}
}



div.gray {	color:#000000; background-color:#c0cccc; text-align:center; margin:1px 0px 10px; padding:10px 2px 6px; font-weight:bold;
	background-image:url('./bg_gray.jpg'); background-repeat:repeat;
}
div.orange {	color:#000000; background-color:#ffcc99; text-align:center; margin:1px 0px 10px; padding:10px 2px 6px; font-weight:bold;
	background-image:url('./bg_orange.jpg'); background-repeat:repeat;
}
div.green {	color:#000000; background-color:#aaffbb; text-align:center; margin:1px 0px 10px; padding:10px 2px 6px; font-weight:bold;
	background-image:url('./bg_green.jpg'); background-repeat:repeat;
}
div.red {	color:#000000; background-color:#aaffbb; text-align:center; margin:1px 0px 10px; padding:10px 2px 6px; font-weight:bold;
	background-image:url('./bg_red.jpg'); background-repeat:repeat;
}

div.twit {	color:#ffffff; background-color:#3bbafb; margin:1px 40px 10px; padding:1px; text-align:center; font-size:1.1rem;
}

div.XX {	color:#ffffff; background-color:#000000; margin:1px 40px 10px; padding:1px; text-align:center; font-size:1.1rem;
}

@media screen and (min-width: 10px) {
	div.gray { font-size:0.8rem;
	}
	div.orange { font-size:0.8rem;
	}
	div.green { font-size:0.8rem;
	}
	div.red { font-size:0.8rem;
	}
}
@media screen and (min-width: 800px) {
	div.gray { font-size:1rem;
	}
	div.orange { font-size:1rem;
	}
	div.green { font-size:1rem;
	}
	div.red { font-size:1rem;
	}
}



/* ▼グラデーション ボタン  */
a.go {	display:block; position:relative; font-size:1.2rem; color:#000000; text-decoration:none; font-weight:bold;
	 padding:24px 0px 24px 0px; margin:0px; z-index:0;
}
a.go:before {
	content:"";
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	bottom:0;
	z-index:-1;
	transition:0.5s;
	background:linear-gradient(180deg, rgba(220, 254, 254, 1), rgba(60, 190, 200, 1));
}
a.go:after{
	content:"";
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	bottom:0;
	z-index:-2;
	background:linear-gradient(180deg, rgba(254, 254, 238, 1), rgba(254, 230, 90, 1));
}
a.go:hover:before{
	opacity:0;
}

@media screen and (min-width: 10px) {
	a.go { font-size:0.55rem;
	}
}
@media screen and (min-width: 685px) {
	a.go { font-size:1rem;
	}
}
@media screen and (min-width: 1024px) {
	a.go { font-size:1.2rem;
	}
}


div.menubar {	background-color:#dddddd; width:100%; margin:70px 0px 0px 0px; padding:0px; color:#000000; text-align:center;
		position:fixed; z-index:70; border-bottom:1px #777777 solid; box-shadow:0px 2px 6px 4px rgba(0, 0, 0, .2);
}
table.vmenu {	width:100%;  margin:0px; padding:0px;
}
td.vmenu {	width:20%; padding:0px; margin:0px; border-left:1px #777777 solid; border-right:1px #777777 solid; text-align:center;
}

img.item {	border:1px #dd0011 solid; margin:8px 32px; padding:8px;}





/* ▼各店舗の情報のカラー文字  */

b.green {	color:#080;
}
b.green2 {	color:#fff; background-color:#080; display:inline-block; padding:0.15em 0.4em 0em; border-radius:0.6em; line-height:1.1em;
}
b.red{	color:#c00;
}
b.red2 {	color:#fff; background-color:#c00; display:inline-block; padding:0.15em 0.4em 0em; border-radius:0.6em; line-height:1.1em;
}
b.blue {	color:#00d;
}
b.blue2 {	color:#fff; background-color:#00d; display:inline-block; padding:0.15em 0.4em 0em; border-radius:0.6em; line-height:1.1em;
}
input[type=radio] { width:1.2em; height:1.2em;
}







div.subcont {	width:100%; background:linear-gradient(0.25turn, #cb0, #ed0, #ed0, #cb0); text-align:center; margin:0px; padding:0px; 
	background-image:url(./bg2.jpg); background-position:center top; background-repeat:no-repeat;
	-moz-background-size:100% auto; background-size:100% auto;
}




td {	margin:0px;
}
td.menu {	width:200px; background-color:#ff9933; color:#ffffff; margin:0px; padding:0px;
}
td.waku {	border:1px #ddddd0 solide; padding:8px;
}
td.footer {	 background-color:#666000; color:#ffffff; margin:0px; padding:6px; text-align:center;
}
th {	background-color:#bbffcc; color:#000033; margin:0px; padding:6px; text-align:center;
}

div.footer {	 background-color:#888000; color:#ffffff; margin:0px; padding:6px; text-align:center; font-size:0.6rem;
}
@media screen and (max-width: 428px) {
	div.footer { font-size:0.4rem;
	}
}
@media screen and (max-width: 920px) {
	div.footer { font-size:0.5rem;
	}
}

div.right {	margin:10px;
}
p.item {	margin:0px; padding:6px 0px; background-color:#bbffcc; color:#000033; text-align:center;
}
p.parts {	margin:8px;
}


div.cont {	margin:16px 0px; padding:8px 20px 16px; width:90%; line-height:180%;
	border-left:#999999 4px solid;	border-top:#cccccc 1px solid;
}
div.bun {	padding:10px 30px;
}

div.waku {	margin:20px; border:1px #d0d0d0 solid;
}
td.waku {	border:1px #d0d0d0 solid; padding:0px;
}

img {	margin:0px; padding:0px; border:0px #ffffff solid;
}