@charset "utf-8";

/* ===================================================================
css information

File Name  : layout.css
Author     : 
Style Info : 
=================================================================== */

/* 共通
-----------------------------------------------*/

.ranking #container { padding:75px 0 0 0; }

.ranking h2.cmnTtl.type01 { text-align:left; padding:0 0 0 66px; margin-top:15px; line-height:50px; font-size:23px; color:#fff; background:#ea4991; }
.ranking h2.cmnTtl.type01:after { background:URL(../img/ttlIcon_01.png) no-repeat center center; background-size:100% 100%; }

.ranking #areaNav { background:url(../img/nav_bg01.png) repeat left top;
-webkit-border-top-left-radius:10px;
-webkit-border-bottom-right-radius:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-bottomright:10px;
border-top-left-radius:10px;
border-bottom-right-radius:10px;
-webkit-box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.2);
-moz-box-shadow:    0px 1px 5px 0px rgba(0, 0, 0, 0.2);
box-shadow:         0px 1px 5px 0px rgba(0, 0, 0, 0.2);
}
.ranking #areaNav:after { visibility:hidden; display:block; font-size:0; content:"." ; clear:both; height:0; }
.ranking #areaNav li { width:50%; float:left; border-right:1px solid #d3f0ff; border-bottom:1px solid #d3f0ff; text-align:center; vertical-align:middle; }
.ranking #areaNav li:nth-child(2n) { border-right:none; }
.ranking #areaNav li:nth-child(n+7) { border-bottom:none; }
.ranking #areaNav li.active { background:#2f97ce; }
.ranking #areaNav li:first-child.active { -webkit-border-top-left-radius:10px; -moz-border-radius-topleft:10px; border-top-left-radius:10px; }
/*.ranking #areaNav li:last-child.active { -webkit-border-bottom-right-radius:10px; -moz-border-radius-bottomright:10px; border-bottom-right-radius:10px; }*/
.ranking #areaNav li a { display:block; font-size:14px; padding:8px 0; color:#fff; font-weight:bold; text-decoration:none; }

.ranking #shogoInfo { margin:15px auto 0 auto; }
.ranking #shogoInfo > h3 { font-size:15px; line-height:140%; color:#7c5ca4; font-weight:bold; }
.ranking #shogoInfo table { width:100%; margin:8px 0; background:#e1d8ec; font-size:13px; line-height:150%; }
.ranking #shogoInfo table th,
.ranking #shogoInfo table td { padding:4px; text-align:center; border-right:1px solid #fff; vertical-align:middle; } 
.ranking #shogoInfo table th { background:#7c5ca4; color:#fff; font-weight:bold; }
.ranking #shogoInfo table td { font-weight:bold; }
.ranking #shogoInfo table td.fwNml { font-weight:normal !important; } 
.ranking #shogoInfo table span { display:inline-block; font-size:12px; }
.ranking.rnkDtl #shogoInfo table td { width:50%; }
.ranking #shogoInfo > p { line-height:140%; }

.rankWrap { padding:10px 0; } 
.rankWrap > ul li { background:#f5f5f5; border:1px solid #ddd; margin:5px 10px 0 10px; padding:0 0 3px 0; }
.rankWrap > ul li * { font-weight:bold; }
.rankWrap > ul li h3 { display:inline-block; background:url(../img/list_bg01.gif) no-repeat right center; padding:4px 16px 3px 10px; background-size:cover; font-size:21px; color:#fff; }
.rankWrap > ul li h3 span { font-size:14px; }

.rankWrap > ul li .nameWrap { margin-top:8px; padding:0 0 0 10px; }
.rankWrap > ul li .nameWrap:after { visibility:hidden; display:block; font-size:0; content:"." ; clear:both; height:0; }

.rankWrap > ul li .fgrWrap { float:left; width:50px; }
.rankWrap > ul li .fgrWrap figure { position:relative; width:50px; height:50px; }
.rankWrap > ul li .fgrWrap figure img { position:absolute; top:0; left:0; width:50px; height:50px; }

.rankWrap > ul li .name { float:left; width:100%; margin-left:-70px; padding-left:80px; }
.rankWrap > ul li .name h4 { font-size:16px; }
.rankWrap > ul li .name p.degree { display:inline-block; min-width:100%; background:#fff; border:1px solid #5cccdf; padding:1px 8px; margin-top:6px; font-size:13px; color:#009fb9; line-height:140%;
-webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; }

.rankWrap > ul li .rate { padding:0 10px; margin-top:6px; }
.rankWrap > ul li .rate h4 { display: none; }
.rankWrap > ul li .rate p.area { display:block; font-size:11px; color:#444; line-height:150%; font-weight:normal; }
.rankWrap > ul li .rate p.area * { font-weight:normal; }
.rankWrap > ul li .rate > * { display:inline-block; }
.rankWrap > ul li .rate dl dt,
.rankWrap > ul li .rate dl dd { display:inline-block; vertical-align:middle; }
.rankWrap > ul li .rate dl dd { font-size:19px; }
.rankWrap > ul li .rate dl dd.img { position:relative; margin:0 -11px 0 0; }
.rankWrap > ul li .rate dl dd.img img { width:80%; }
.rankWrap > ul li .rate dl dd span { font-size:14px; }

/* index.php
-----------------------------------------------*/
.ranking.rnkTop .alBg { -webkit-border-top-left-radius:0 !important;
-moz-border-radius-topleft:0 !important;
border-top-left-radius:0 !important;
}
.ranking.rnkTop .playDate { font-size: 11px; text-align: right; }

/* detail.php
-----------------------------------------------*/
.ranking.rnkDtl .prefWrap { margin-top:15px; }
.ranking.rnkDtl .prefWrap.shopNone { display:none; }
.ranking.rnkDtl .prefWrap .shopWrap { margin-top:10px; }
.ranking.rnkDtl .prefWrap h3.subTtl01 { font-size:18px; font-weight:bold; padding-left:16px; position:relative; }
.ranking.rnkDtl .prefWrap h3.subTtl01:before { content:''; display:block; background:url(../img/subttl_arw.png) no-repeat left center; width:10px; height:18px; position:absolute; top:0; left:0; background-size:contain; } 
.ranking.rnkDtl .rankWrap { padding-top:0 !important; }
.ranking.rnkDtl .rankWrap > h4 { background:#7c5ca4; padding:5px 10px; color:#fff; font-size:16px; line-height:150%; margin-bottom:10px;
-webkit-border-top-left-radius:10px; -moz-border-radius-topleft:10px; border-top-left-radius:10px; } 
.ranking.rnkDtl .rankWrap > ul li .rate { margin-top:3px; }

.ranking.rnkDtl #backBtn { text-align:center; }
.ranking.rnkDtl #backBtn a { display:inline-block; height:44px; line-height:44px; padding:0 10px; margin-top:15px; background:#60b4e1; font-size:13px; color:#fff; text-decoration:none; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; }