@charset "utf-8";


/**************************************************50
 * menu
 **************************************************/
#menu{
}
.menu_category{
	border-top: 1px solid #000000;
	border-bottom: 1px solid #000000;
	color: #333333;
	text-align: center;
}
.menu_subcategory{
	text-align: center;
}
.menu_subcategory_remarks{
	text-align: center;
}
.menu_subcategory span{
	border-bottom: 3px double #000000;
	color: #333333;
}
#menu .wrap{
}
#menu .wrap > div{
}
@media screen and (max-width:767px){
	#menu{
		margin-bottom: 12.5%;
	}
	.menu_category{
		font-size: 150%;
		margin-bottom: 6.25%;
		padding: 0 3.125%;
	}
	.menu_subcategory{
		font-size: 125%;
		line-height: 1.667;
		margin-bottom: 3.125%;
		padding: 0 3.125%;
	}
	.menu_subcategory_remarks{
		margin-top: -1.5625%;
		margin-bottom: 3.125%;
		padding: 0 3.125%;
	}
	#menu .wrap{
	}
	#menu .wrap > div{
	}
	#menu .wrap > div[id]{
		margin-bottom: 6.25%;
	}
}
@media screen and (min-width:768px){
	#menu{
		margin-bottom: 100px;
	}
	.menu_category{
		font-size: 200%;
		margin-bottom: 50px;
	}
	.menu_subcategory{
		font-size: 150%;
		line-height: 1.334;
		margin-bottom: 50px;
	}
	.menu_subcategory_remarks{
		margin-top: -30px;
		margin-bottom: 50px;
	}
	#menu .wrap{
	}
	#menu .wrap > div[id]{
		margin-bottom: 50px;
	}
}


/**************************************************50
 * subcategories
 **************************************************/
.subcategories{
}
.subcategories a{
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	display: inline-block;
	font-size: 75%;
	height: 2.5em;
	position: relative;
	text-align: center;
	text-decoration: none;
	transition: opacity 0.2s ease-out 0s;
	vertical-align: top;
}
.subcategories a:hover{
	opacity: 0.7;
}
.subcategories a:after{
	content: "\F09D6";
	font-family: "Material Design Icons";
	font-size: 175%;
	line-height: 1;
	position: absolute;
	top: 50%;
	right: 0;
	-ms-transform: translate(0%, -50%);
	-webkit-transform: translate(0%, -50%);
	transform: translate(0%, -50%);
}
.subcategories a span{
	line-height: 1.2;
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: -webkit-calc(100% - 4em);
	width: calc(100% - 4em);
}
@media screen and (max-width:319px){
	.subcategories{
		text-align: center;
	}
	.subcategories a{
		width: 75%;
	}
}
@media screen and (min-width:320px){
	.subcategories{
		text-align: left;
	}
}
@media screen and (min-width:320px) and (max-width:639px){
	.subcategories a{
		width: -webkit-calc(100% / 2);
		width: calc(100% / 2);
	}
}
@media screen and (min-width:640px) and (max-width:767px){
	.subcategories a{
		width: -webkit-calc(100% / 3);
		width: calc(100% / 3);
	}
}
@media screen and (max-width:767px){
	.subcategories{
		margin-bottom: 3.125%;
		padding: 0 3.215%;
	}
	.subcategories a{
		font-size: 62.5%;
	}
}
@media screen and (min-width:768px){
	.subcategories{
		margin-bottom: 50px;
	}
	.subcategories a{
		font-size: 75%;
	}
}
@media screen and (min-width:768px) and (max-width:939px){
	.subcategories a{
		width: -webkit-calc(100% / 3);
		width: calc(100% / 3);
	}
}
@media screen and (min-width:940px) and (max-width:1023px){
	.subcategories a{
		width: -webkit-calc(100% / 4);
		width: calc(100% / 4);
	}
}
@media screen and (min-width:1024px) and (max-width:1199px){
	.subcategories a{
		width: -webkit-calc(100% / 4);
		width: calc(100% / 4);
	}
}
@media screen and (min-width:1200px) and (max-width:1279px){
	.subcategories a{
		width: -webkit-calc(100% / 5);
		width: calc(100% / 5);
	}
}
@media screen and (min-width:1280px){
	.subcategories a{
		width: -webkit-calc(100% / 5);
		width: calc(100% / 5);
	}
}


/**************************************************50
 * menu_list
 **************************************************/
.menu_list{
	text-align: left;
}
.menu_list > li{
	border-bottom: 1px solid #000000;
	display: inline-block;
	line-height: 1.5;
	padding-bottom: 0.5em;
	position: relative;
	vertical-align: top;
}
.menu_list > li picture{
	margin-bottom: 0.5em;
}
.menu_list > li picture img{
	width: 100%
}
.menu_list > li h3,
.menu_list > li h4{
}
.menu_list > li [class^="shop_label_"]{
	margin-bottom: 0.25em;
}
.menu_list > li p{
}
.menu_list > li .menu_price{
	color: #FF0000;
	margin-top: 0.125em;
	text-align: right;
}
.menu_list > li img[src$="recommend.svg"]{
	position: absolute;
	top: 0;
	right: 0;
	-ms-transform: translate(25%, -25%);
	-webkit-transform: translate(25%, -25%);
	transform: translate(25%, -25%);
	width: 30.6%;
	z-index: 1;
}
@media screen and (max-width:479px){
	.menu_list > li{
		margin-left: 6.25%;
		width: 87.5%;
	}
}
@media screen and (min-width:480px) and (max-width:767px){
	.menu_list > li{
		margin-left: 3.125%;
		width: -webkit-calc((100%  - (3.125% * 3)) / 2);
		width: calc((100%  - (3.125% * 3)) / 2);
	}
}
@media screen and (max-width:767px){
	.menu_list{
		margin-bottom: 3.125%;
	}
	.menu_list > li{
		margin-bottom: 3.125%;
	}
	.menu_list > li picture{
	}
	.menu_list > li picture img{
	}
	.menu_list > li h3,
	.menu_list > li h4{
	}
	.menu_list > li [class^="shop_label_"]{
		font-size: 62.5%;
	}
	.menu_list > li p{
	}
	.menu_list > li p:not(.menu_price){
		font-size: 62.5%;
	}
	.menu_list > li .menu_price{
		font-size: 112.5%;
	}
}
@media screen and (min-width:768px){
	.menu_list{
		margin: 0 auto 20px;
	}
	.menu_list > li{
		margin-bottom: 30px;
	}
	.menu_list > li picture{
	}
	.menu_list > li picture img{
	}
	.menu_list > li h3,
	.menu_list > li h4{
	}
	.menu_list > li [class^="shop_label_"]{
		font-size: 75%;
	}
	.menu_list > li p{
	}
	.menu_list > li p:not(.menu_price){
		font-size: 75%;
	}
	.menu_list > li .menu_price{
		font-size: 125%;
	}
}
@media screen and (min-width:768px) and (max-width:939px){
	.menu_list{
		width: 728px;
	}
	.menu_list > li{
		width: 232px;
	}
	.menu_list > li:not(:nth-child(3n+1)){
		margin-left: 16px;
	}
}
@media screen and (min-width:940px) and (max-width:1023px){
	.menu_list{
		width: 890px;
	}
	.menu_list > li{
		width: 276px;
	}
	.menu_list > li:not(:nth-child(3n+1)){
		margin-left: 31px;
	}
}
@media screen and (min-width:1024px) and (max-width:1199px){
	.menu_list{
		width: 964px;
	}
	.menu_list > li{
		width: 300px;
	}
	.menu_list > li:not(:nth-child(3n+1)){
		margin-left: 32px;
	}
}
@media screen and (min-width:1200px) and (max-width:1279px){
	.menu_list{
		width: 1150px;
	}
	.menu_list > li{
		width: 268px;
	}
	.menu_list > li:not(:nth-child(4n+1)){
		margin-left: 26px;
	}
}
@media screen and (min-width:1280px){
	.menu_list > li{
		margin-left: 16px;
		width: 268px;
	}
	.menu_list > li:not(:nth-child(4n+1)){
		margin-left: 32px;
	}
}