.title {
	background:url(../img/img_toptitlebg.jpg) center center no-repeat;
	background-color:transparent;
	background-size:cover;
	padding:64px 5px;
}
.title h1{
	background-color:transparent;
	padding:0;
	line-height:1;
	width:87vw;
	margin:0 auto;
}
.title h1 img{
	width:100%;
}
.title p{
	text-align:center;
	color:#cfbb8d;
	line-height:2;
	font-size:12px;
	margin-top:12px;
}

#menulist_top{
	margin:20px 15px 0 15px;
	display:flex;
	flex-wrap: wrap;
	background-color:#fff;
}
#menulist_top ul {
    display: none;/**/
		width:100%;
}
#menulist_top ul li{
	width:50%;
	height:120px;
	float:left;
}
#menulist_top ul li a{
	color:#d5bc77;
	font-size:12px;
/*	font-weight:bold;*/
	display:block;
	width:100%;
	height:100%;
	box-sizing:border-box;
	background:url(../img/img_ranking_category.png) center center no-repeat;
	background-size:90%;

	text-align:center;
	display:inline-flex;
	align-items: center;
	justify-content:center;
	padding:0 38px;
}
#menulist_top .category:nth-of-type(1){	order: 1;}
#menulist_top ul:nth-of-type(1){	order: 3;}
#menulist_top .category:nth-of-type(2){	order: 2;}
#menulist_top ul:nth-of-type(2){	order: 4;}
#menulist_top .category:nth-of-type(3){	order: 5;}
#menulist_top ul:nth-of-type(3){	order: 7;}
#menulist_top .category:nth-of-type(4){	order: 6;}
#menulist_top ul:nth-of-type(4){	order: 8;}
#menulist_top .category:nth-of-type(5){	order: 9;}
#menulist_top ul:nth-of-type(5){	order: 11;}
#menulist_top .category:nth-of-type(6){	order: 10;}
#menulist_top ul:nth-of-type(6){	order: 12;}
#menulist_top .category:nth-of-type(7){	order: 13;}
#menulist_top ul:nth-of-type(7){	order: 15;}
#menulist_top .category:nth-of-type(8){	order: 14;}
#menulist_top ul:nth-of-type(8){	order: 16;}

#menulist_top .category {
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
	width:50%;
	height:100px;
	font-size:12px;
	font-weight:bold;
	color:#fff;
	box-sizing:border-box;
	display:inline-flex;
	align-items: flex-end;
	justify-content:center;
	position:relative;
	z-index:0;
	overflow:hidden;
	cursor:pointer;
}
#menulist_top .category>span{
	background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 100%);
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.6) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.6) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#99000000',GradientType=0 );
	text-align:center;
	width: 100%;
	height: 30%;
	padding: 0px 10px 10px 10px;
	line-height: 100%;
	display: flex;
	align-items: flex-end;
	justify-content: center;
}
#menulist_top .category.active::before{
	content:"";
	width:10px;
	height:10px;
	background-color:#fff;
	position:absolute;
	left:50%;
	bottom:-5px;
	margin-left:-5px;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
#menulist_top .category.active::after{
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-color:#fe4f00;
	z-index:-1;
	opacity:0.5;
}

.updatelog{
	margin:0 15px;
}
.updatelog h2{
	font-size:15px;
	text-align:center;
	margin-top:30px;
	padding:0px 0 46px 0;
	position:relative;
}
.updatelog h2:after{
	content:"";
	width:30px;
	height:1px;
	background-color:#fe4f00;
	position:absolute;
	left:50%;
	top:40px;
	margin-left:-15px;
}
.updatelog .iframe{
	width:100%;
	height:225px;
	overflow:auto;
	-webkit-overflow-scrolling:touch;
	display: inline-block;
}
.updatelog .iframe iframe{
	width:100%;
	height:100%;
	border:none;
	display:block;
}
.upjouhou {
	background-color:#fff;
	padding:23px;
}
.upjouhou li{
	font-size:12px;
	display:flex;
	padding-bottom:10px;
}
.upjouhou li .date{
	font-weight:bold;
	padding-right:1em;
}

@media (min-width: 769px) {
.title h1{
	width:90%;
	max-width:650px;
}
.title p{
	font-size:14px;
}
#menulist_top{
	margin:40px 40px 0px 40px;
}

#menulist_top ul li{
	width:25%;
	height:180px;
}
#menulist_top ul li a{
	font-size:16px;
	padding:0 50px;
}
#menulist_top .category:nth-of-type(1){	order: 1;}
#menulist_top ul:nth-of-type(1){	order: 4;}
#menulist_top .category:nth-of-type(2){	order: 2;}
#menulist_top ul:nth-of-type(2){	order: 5;}
#menulist_top .category:nth-of-type(3){	order: 3;}
#menulist_top ul:nth-of-type(3){	order: 6;}
#menulist_top .category:nth-of-type(4){	order: 7;}
#menulist_top ul:nth-of-type(4){	order: 10;}
#menulist_top .category:nth-of-type(5){	order: 8;}
#menulist_top ul:nth-of-type(5){	order: 11;}
#menulist_top .category:nth-of-type(6){	order: 9;}
#menulist_top ul:nth-of-type(6){	order: 12;}
#menulist_top .category:nth-of-type(7){	order: 13;}
#menulist_top ul:nth-of-type(7){	order: 15;}
#menulist_top .category:nth-of-type(8){	order: 14;}
#menulist_top ul:nth-of-type(8){	order: 16;}

#menulist_top .category {
	width:33.333333333%;
	height:180px;
	font-size:14px;
}
#menulist_top .category>span{
	padding-bottom:16px;
}
#menulist_top .category:hover::before{/* same css again for :hover.for iOS */
	content:"";
	width:10px;
	height:10px;
	background-color:#fff;
	position:absolute;
	left:50%;
	bottom:-5px;
	margin-left:-5px;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
#menulist_top .category:hover::after{/* same css again for :hover.for iOS */
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-color:#fe4f00;
	z-index:-1;
	opacity:0.5;
}


.updatelog{
	margin:0 40px;
}
.updatelog h2{
	font-size:18px;
	margin-top:40px;
	padding-bottom:58px;
}
.updatelog h2:after{
	top:50px;
}
.updatelog .iframe{
	height:280px;
}
.upjouhou {
	padding:50px;
}
.upjouhou li{
	font-size:14px;
	padding-bottom:20px;
}

}