@charset "utf-8";


/* トップページ
---------------------------------------------------*/
@media screen and (min-width: 768px) {
	.boxWrap.ranking.vol { margin-top: 10px;}
	.titleLv2 + .intro { }
	.boxWrap.ranking .update { margin-bottom: 15px; text-align: right; font-weight: bold; }
	.rankingList { margin-top: -20px; }
	.rankingList li { float: left; padding-top: 10px; width: 425px; box-sizing: border-box; border-bottom: 1px solid #c5c5c5; }
	.rankingList li:last-child { border: none; }
	.rankingList li:nth-last-child(2) { border: none; }
	
	.rankingList.best10 li:last-child { border-bottom: 1px solid #c5c5c5!important; }
	.rankingList.best10 li:nth-last-child(2) { border-bottom: 1px solid #c5c5c5!important; }
	

	/*.rankingList li.no01,
	.rankingList li.no02 { border: none; }*/
	.rankingList li.odd { margin-right: 15px; }
	.rankingList li.even { margin-left: 15px; }
	.rankingList table { margin: -5px 0 0 0; width: 100%; }
	.rankingList table tr { }
	.rankingList th { padding: 15px 0; width: 55px; text-align: center; font-weight: bold; }
	.rankingList td { padding-bottom: 8px; }
	.rankingList th.rank { padding: 25px 0 0 0; width: 55px; text-align: center; color: #fff; font-weight: bold; text-shadow: 1px 1px 2px #000000; }
	.rankingList th.no { padding: 18px 0 15px ; background: url(../ranking/images/nobg.png) center center no-repeat; background-size: 40px 40px; }
	.rankingList th.no01 { background: url(../ranking/images/no01.png) center center no-repeat; background-size: 55px 40px; }
	.rankingList th.no02 { background: url(../ranking/images/no02.png) center center no-repeat; background-size: 55px 40px; }
	.rankingList th.no03 { background: url(../ranking/images/no03.png) center center no-repeat; background-size: 55px 40px; }
	.rankingList td.name { padding-left: 15px; text-align: left; font-weight: bold; }
	.rankingList td.point { padding-right: 0; text-align: right; color: #d30000; font-weight: bold; }
	.rankingList tr.no01 { border: none; /* background: rgba(224,198,54,0.4); border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px;*/ }
	.rankingList tr.no02 { border: none; /* background: rgba(224,198,54,0.4); border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px;*/ }
	
	.navRanking  { width: 880px; border-bottom: 4px solid #003fbc; }

	.navRanking li { float: left; }
	.navRanking li.dairy { float: left; margin-right: 2px; }
	.navRanking li.vol { float: right; margin-left: 2px; }
	.navRanking li.active { padding: 20px 30px 17px 20px; width: 100%; text-align: center; background: #003fbc; font-size: 1.6rem; color: #fff; font-weight: bold; line-height: 1.0!important; box-sizing: border-box; border-top-left-radius: 15px; -webkit-border-top-left-radius: 15px; -moz-border-top-left-radius: 15px;border-top-right-radius: 15px; -webkit-border-top-right-radius: 15px; -moz-border-top-right-radius: 15px; }
	.navRanking li.link { position: relative; width: 336px; }
	.navRanking li.active.best100 { width: 100%; }
	.navRanking li.link a { display: block; padding: 20px 30px 17px 20px; text-align: center; background: #759deb; text-decoration: none; font-size: 1.6rem; color: #fff; font-weight: bold; line-height: 1.0!important; box-sizing: border-box; border-top-left-radius: 15px; -webkit-border-top-left-radius: 15px; -moz-border-top-left-radius: 15px;border-top-right-radius: 15px; -webkit-border-top-right-radius: 15px; -moz-border-top-right-radius: 15px;  }
	.navRanking li.link a::after { position: absolute; top: 50%; right: 20px; content: ''; width: 7px; height: 7px; border: 0px; border-top: solid 3px #fff; border-right: solid 3px #fff; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: -5px; }
	
	.navRanking li.link span { display: block; padding: 20px 30px 17px 20px; text-align: center; background: #bdbdbd; text-decoration: none; font-size: 1.6rem; color: #fff; font-weight: bold; line-height: 1.0!important; box-sizing: border-box; border-top-left-radius: 15px; -webkit-border-top-left-radius: 15px; -moz-border-top-left-radius: 15px;border-top-right-radius: 15px; -webkit-border-top-right-radius: 15px; -moz-border-top-right-radius: 15px;  }
	.mente { margin-bottom: 20px; text-align: left!important; font-weight: bold!important; font-size: 1.8rem!important; color: #d30000; }
	.linkRanking { margin-bottom: 20px; }
}
@media screen and (max-width: 767px) {
	.boxWrap.ranking .update { margin: 0 0 10px; text-align: right; font-size: 3.2vw; font-weight: bold; }
	.titleLv2 + .intro { margin-bottom: 10px; }
	.rankingList {  }
	.rankingList li { padding-right: 10px; padding-left: 10px; line-height: 10vw; }
	.rankingList li.no01,
	.rankingList li.no02,
	.rankingList li.no03 { padding: 12px 10px; line-height: 1.6; }
	.rankingList li.even { background: rgba(255,255,255,0.6); }
	.rankingList.bottom li.even {  }
	.rankingList table { margin: 0; width: 100%; }
	.rankingList table tr {  }
	.rankingList th { width: 10vw; text-align: center; font-weight: bold; font-size: 3.2vw; }
	.rankingList td { }
	.rankingList th.rank { width: 10vw; text-align: center; font-size: 3.2vw; font-weight: bold; color: #fff; text-shadow: 1px 1px 2px #000000; }
	.rankingList th.no { padding: 0; background: url(../ranking/images/nobg.png) center center no-repeat; background-size: 7.333333vw 7.333333vw; }
	.rankingList th.no01 { padding-top: 2.66666666vw; background: url(../ranking/images/no01.png) center center no-repeat; background-size: 10vw 7.333333vw; }
	.rankingList th.no02 { padding-top: 2.66666666vw; background: url(../ranking/images/no02.png) center center no-repeat; background-size: 10vw 7.333333vw; }
	.rankingList th.no03 { padding-top: 2.66666666vw; background: url(../ranking/images/no03.png) center center no-repeat; background-size: 10vw 7.333333vw; }
	.rankingList td.name { padding-left: 15px; text-align: left; font-size: 3.2vw; font-weight: bold; }
	.rankingList td.point { text-align: right; font-size: 3.2vw; color: #d30000; font-weight: bold; }
	
	.navRanking  { width: 100%; border-bottom: 4px solid #003fbc; }
	.navRanking li { width: 100%; }
	.navRanking li.dairy { float: left; margin-right: 0.5%; }
	.navRanking li.vol { float: right; margin-left: 0.5%; }
	.navRanking li.active { padding: 12px 0 9px 0; text-align: center; background: #003fbc; font-size: 3.2vw; color: #fff; font-weight: bold; line-height: 1.4; box-sizing: border-box; border-top-left-radius: 15px; -webkit-border-top-left-radius: 15px; -moz-border-top-left-radius: 15px;border-top-right-radius: 15px; -webkit-border-top-right-radius: 15px; -moz-border-top-right-radius: 15px; }
	.navRanking li.link { position: relative; }
	.navRanking li.link a { display: block; padding: 12px 30px 9px 20px; text-align: center; background: #759deb; text-decoration: none; font-size: 3.2vw; color: #fff; font-weight: bold; line-height: 1.4; box-sizing: border-box; border-top-left-radius: 15px; -webkit-border-top-left-radius: 15px; -moz-border-top-left-radius: 15px;border-top-right-radius: 15px; -webkit-border-top-right-radius: 15px; -moz-border-top-right-radius: 15px;  }
	.navRanking li.link a::after { position: absolute; top: 50%; right: 15px; content: ''; width: 7px; height: 7px; border: 0px; border-top: solid 3px #fff; border-right: solid 3px #fff; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: -5px; }
	.navRanking li.active.best100 { margin: 0; width: 100%; }
	
	.mente { font-weight: bold!important; font-size: 4vw!important; color: #d30000; }
	.linkRanking { margin-top: 15px; }
}