/* CSS Document */

/* 半期ランキング
------------------------------------------------------- */

#ranking-container{
	padding: 0;
	margin-bottom: 20px;
}
#ranking-container h2 img{max-width: 100%; width: 100%; height: auto;}

.ranking_layout{display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap; padding-left: 1%;}

.ranking_layout li{flex: 0 1 32.6%; text-align: center; position: relative; padding: 15px .2%; border-bottom: 1px dashed #f90; border-right: 1px dashed #f90;}
.ranking_layout li p{font-size:14px; line-height: 1.4; margin-top:5px;}
.ranking_layout li:nth-child(n+7){flex: 0 1 24%; text-align: center; position: relative; padding: 15px .4%;}
.ranking_layout li:nth-child(n+7) p{font-size:14px; line-height: 1.4; margin-top:4px;}
.ranking_layout li:nth-child(n+11){flex: 0 1 15%; text-align: center; position: relative; padding: 20px 2.4% 10px;}
.ranking_layout li:nth-child(n+11) img{width: 70px;}
.ranking_layout li:nth-child(n+11) p{font-size:12px; line-height: 1.4; margin-top:4px;}
.ranking_layout li img{width: 100%;}
.ranking_layout li a{display: block;}

	
.ranking_txt_top{
	font-size:22px;
	color: #000;
	font-weight:bold;
	text-align: right;
}

/*numbering
------------------------------------*/

.ranking_layout li:before{
	counter-increment:ranking-nunber;
	content:counters(ranking-nunber,".")"位";
	color: #FFF;
	position:absolute;
	top:18px;
	left: 5px;
	width:57px;
	height:56px;
	font-weight: bold;
	font-size:24px;
	text-shadow:
	-1px -1px 0px #F90,
	1px -1px 0px #F90,
	1px 1px 0px #F90,
	-1px 1px 0px #F90;
	text-align: center;
	line-height:1;
	display:block;
	padding-top: 18px;
    background:url(images/icon_star.png) no-repeat;
	background-size: contain;
	background-position: top 0 left 0;
	font-feature-settings: "palt";
	z-index: 1;
}
.ranking_layout li:nth-child(1):before{
	counter-increment:ranking-nunber;
	content:counters(ranking-nunber,".")"位";
	color: #FFF;
	position:absolute;
	top:20px;
	left: 5px;
	width:63px;
	height:60px;
	font-weight: bold;
	font-size:24px;
	text-shadow:
	-1px -1px 0px #ce9b43,
	1px -1px 0px #ce9b43,
	1px 1px 0px #ce9b43,
	-1px 1px 0px #ce9b43;
	text-align: center;
	line-height:1;
	display:block;
	padding-top: 20px;
    background:url(images/icon_star_t01.png) no-repeat;
	background-size: contain;
	background-position: top 0 left 0;
	font-feature-settings: "palt";
}
.ranking_layout li:nth-child(2):before{
	counter-increment:ranking-nunber;
	content:counters(ranking-nunber,".")"位";
	color: #FFF;
	position:absolute;
	top:20px;
	left: 5px;
	width:63px;
	height:60px;
	font-weight: bold;
	font-size:24px;
	text-shadow:
	-1px -1px 0px #9e9a99,
	1px -1px 0px #9e9a99,
	1px 1px 0px #9e9a99,
	-1px 1px 0px #9e9a99;
	text-align: center;
	line-height:1;
	display:block;
	padding-top: 20px;
    background:url(images/icon_star_t02.png) no-repeat;
	background-size: contain;
	background-position: top 0 left 0;
	font-feature-settings: "palt";
}
.ranking_layout li:nth-child(3):before{
	counter-increment:ranking-nunber;
	content:counters(ranking-nunber,".")"位";
	color: #FFF;
	position:absolute;
	top:20px;
	left: 5px;
	width:63px;
	height:60px;
	font-weight: bold;
	font-size:24px;
	text-shadow:
	-1px -1px 0px #a46f01,
	1px -1px 0px #a46f01,
	1px 1px 0px #a46f01,
	-1px 1px 0px #a46f01;
	text-align: center;
	line-height:1;
	display:block;
	padding-top: 20px;
    background:url(images/icon_star_t03.png) no-repeat;
	background-size: contain;
	background-position: top 0 left 0;
	font-feature-settings: "palt";
}
.ranking_layout li:nth-child(n+11):before{
	counter-increment:ranking-nunber;
	content:counters(ranking-nunber,".")" ";
	color: #FFF;
	position:absolute;
	top:5px;
	left: 5px;
	width:33px;
	height:32px;
	font-weight: bold;
	font-size:16px;
	text-shadow:
	-1px -1px 0px #F90,
	1px -1px 0px #F90,
	1px 1px 0px #F90,
	-1px 1px 0px #F90;
	text-align: center;
	display:block;
	padding-top: 10px;
    background:url(images/icon_star.png) no-repeat;
	background-size: contain;
	background-position: top 0 left 0;
	font-feature-settings: "palt";
	margin-bottom: -15px;
}

.ranking_layout li:nth-child(-n+10){border-right: none;}
.ranking_layout li:nth-child(n+11):nth-child(5n){border-right: none;}

body{counter-reset:ranking-nunber;}