@charset "utf-8";

/*
========================================

For RankingPage
	・Colums
	・Title
	・Trend	
	・Guide
	・TotalPeriod
	
========================================
*/

@import url(../../common/css/common.css);

/* Colums
========================================*/
#mainArea{
padding:0 0 0 16px;
width:653px;
}

#mainArea #main{
padding:0;
width:479px;
float:left;
}

#mainArea #center{
width:160px;
float:right;
}

#mainArea .utility{
margin:0 0 10px 0;
}

#gnavi ul.normalNavi{
background-image:url(../../common/images/navi/gnavi_products_bg.gif);
}

/* Title
========================================*/
.pageTitle h1{
padding:0;
}

.pageTitle .catch{
font-weight:normal;
}

/* Trend
========================================*/
#trend{
margin:0 0 10px 0;
}

#trend .section{
padding:4px 6px 5px 7px;
border-width:0 1px 1px;
border-style:solid;
border-color:#ffdbcb;
background:#fef8f5;
}

#trend .section .moreBtn{
margin:5px 0 0 0;
display:block;
text-align:right;
}

/* Guide
========================================*/
.guide{
width:479px;
}

.guide ul{
margin:0 0 6px 0;
}

.guide ul.other{
margin:0 0 10px 0;
padding:4px 0;
border-top:1px solid #dfdfdf;
background:#f7f7f7;
text-align:right;
}

.guide ul.category li{
margin:0 15px 0 0;
padding:0 0 0 8px;
background:transparent url(../../common/images/ico/icon01.gif) -8px -2144px no-repeat;
display:inline;
}

.guide ul.other li{
margin:0 7px 0 15px;
padding:2px 0 2px 16px;
display:inline;
background-image:url(../../common/images/ico/icon02.gif);
background-repeat:no-repeat;
}

.guide ul.other li.howto{
padding:2px 0 2px 19px;
background-position:-5px -531px;
}

.guide ul.other li.about{
background-position:-5px -454px;
}


/* TotalPeriod
========================================*/
.totalPeriod{
width:479px;
}

.totalPeriod .date{
float:left;
font-weight:bold;
}

.totalPeriod .update{
float:right;
font-size:85%;
}


/*
========================================

For RankingArea
	・TextTab
	・Pager
	・Ranking	
		ランキング
	・Guide
		アクセスランキングトップ5
	・TotalPeriod
	
========================================
*/
/* TextTab
========================================*/
.textTab{
width:479px;
background:transparent url(../images/ranking_top.gif) 0 0 no-repeat;
}

.textTab .inner{
width:462px;
}

.textTab ul{
float:none !important;
}

/* Pager
========================================*/
.pager{
padding:0 0 0 7px;
width:470px;
border-width:0 1px 1px;
border-style:solid;
border-color:#ccc;
background:transparent url(../images/pager_bg.gif) right top repeat-y;
}

.pager ul{
padding:8px 0 0;
width:335px;
float:left;
display:inline-table;
}

/*\*/
.pager ul{
display:block;
}
/**/

.pager ul:after{
content:"";
display:block;
clear:both;
height:1px;
visibility:hidden;
font-size:0;
line-height:0;
}

.pager li{
font-size:100%;
}

.pager a,
.pager span{
float:left;
}

.pager li.front span,
.pager li.front a,
.pager li.prev span,
.pager li.prev a,
.pager li.next span,
.pager li.next a,
.pager li.tail span,
.pager li.tail a{
background:#fff;
margin:4px 2px 0 2px;
padding:3px 4px;
}

.pager p{
width:128px;
float:right;
}

.pager p a{
margin:0;
padding:0;
border:none;
}

/* RankingArea
========================================*/
.rankingArea{
width:479px;
border-bottom:1px solid #ccc;
background:transparent url(../images/ranking_bg.gif) left top repeat-y;
}

.rankingArea #rankingNavi{
padding:3px 0 0 0;
width:146px;
float:left;
}

.rankingArea #rankingNavi ul.btn li{
padding:4px;
text-align:center;
font-size:0;
line-height:0;
}

.rankingArea #rankingNavi .banner{
text-align:center;
}

.rankingArea #rankingNavi .choice{
width:146px;
border-top:1px solid #fff;
border-bottom:1px solid #fff;
}

.rankingArea #rankingNavi .choice dt a{
display:block;
width:123px;
padding:7px 12px 7px 5px; 
border-left-width:6px;
border-left-style:solid;
background-color:#fff;
background-image:url(../../common/images/ico/icon01.gif);
background-repeat:no-repeat;
font-weight:bold;
color:#4a4a4a;
}

.rankingArea #rankingNavi .choice dd{
padding:0;
border-top:1px solid #fff;
border-left-width:3px;
border-left-style:solid;
}

.rankingArea #rankingNavi .choice dd dd{
padding:0;
border:none;
}

.rankingArea #rankingNavi .choice dd dt a{
padding:6px 0 3px 22px;
width:121px;
border:none;
background-color:#f7f7f7;
}

.rankingArea #rankingNavi .choice li{
padding:0 5px;
}

.rankingArea #rankingNavi #chooseUsage dt a,
.rankingArea #rankingNavi #chooseUsage dd{
border-left-color:#00bf59;
background-position:123px -548px;
}

.rankingArea #rankingNavi #chooseUsage dt.open a,
.rankingArea #rankingNavi #chooseUsage dd{
background-position:123px -1261px;
}

.rankingArea #rankingNavi #chooseUsage dd dt a{
background-position:2px -549px;
}

.rankingArea #rankingNavi #chooseMaker dt a,
.rankingArea #rankingNavi #chooseMaker dd{
border-left-color:#0096bf;
background-position:123px -1185px;
}

.rankingArea #rankingNavi #chooseMaker dt.open a{
background-position:123px -472px;
}

.rankingArea #rankingNavi #chooseMaker dd dt a{
background-position:2px -473px;
}

.rankingArea #rankingNavi #chooseSpec dt a,
.rankingArea #rankingNavi #chooseSpec dd{
border-left-color:#0006bf;
background-position:123px -396px;
}

.rankingArea #rankingNavi #chooseSpec dt.open a{
background-position:123px -2270px;
}

.rankingArea #rankingNavi #chooseSpec dd dt a{
background-position:2px -1109px;
}

.rankingArea #rankingNavi #chooseSpec dd dt.open a{
background-position:2px -396px;
}

.rankingArea #rankingNavi #choosePrice{
margin:0 0 10px 0;
}

.rankingArea #rankingNavi #choosePrice dt a,
.rankingArea #rankingNavi #choosePrice dd{
border-left-color:#bf00bd;
background-position:123px -1031px;
}

.rankingArea #rankingNavi #choosePrice dt.open a{
background-position:123px -318px;
}

.rankingArea #rankingNavi #choosePrice dd dt a{
background-position:123px -1031px;
}

/*------ Hover ------*/
.rankingArea #rankingNavi #chooseUsage .hover{
background-color:#00bf59;
}

.rankingArea #rankingNavi #chooseMaker .hover{
background-color:#0096bf;
}

.rankingArea #rankingNavi #chooseSpec .hover{
background-color:#0006bf;
}

.rankingArea #rankingNavi #choosePrice .hover{
background-color:#bf00bd;
}

/*------ Active ------*/
.rankingArea #rankingNavi #chooseUsage .ac{
color:#00bf59;
}

.rankingArea #rankingNavi #chooseMaker .ac{
color:#0096bf;
}

.rankingArea #rankingNavi #chooseSpec .ac{
color:#0006bf;
}

.rankingArea #rankingNavi #choosePrice .ac{
color:#bf00bd;
}

.rankingArea #rankingNavi .hover,
.rankingArea #rankingNavi .hover .ac{
color:#fff !important;
}


.rankingArea #rankingNavi th,
.rankingArea #rankingNavi td{
padding:0 0 3px 0;
vertical-align:top;
}

.rankingArea #rankingNavi th{
width:1.5em;
text-align:left;
}

.rankingArea #rankingNavi .choice th,
.rankingArea #rankingNavi .choice td{
padding:4px 0 3px 0;
}

.rankingArea #rankingNavi .choice .close{
display:none;
}

.rankingArea #rankingNavi #largeCategory{
margin:0 0 18px 0;
width:146px;
border-top:1px solid #fff;
background:#fff;
}

.rankingArea #rankingNavi #largeCategory li{
width:146px;
border-bottom:1px solid #fff;
}

.rankingArea #rankingNavi #largeCategory li a{
display:block;
width:123px;
padding:7px 12px 7px 5px; 
border-left:6px solid #d2d2d2;
font-weight:bold;
}


.rankingArea #ranking{
width:331px;
float:right;
}

.rankingArea #ranking .adbanner{
margin:0;
padding:4px 0;
text-align:center;
border-bottom:1px solid #f1f1f1;
}

#main .rankingArea #ranking .section{
margin:0;
width:330px;
border-bottom:1px solid #f1f1f1;
clear:none;
}

.rankingArea #ranking .section td{
padding:5px 0;
}

.rankingArea #ranking .section td td{
padding:0;
}

.rankingArea #ranking .section .check{
background:#f5f5f5;
text-align:center;
}

.rankingArea #ranking .ac,
.rankingArea #ranking .hover{
background-color:#ecfcdf;
}

.rankingArea #ranking .section .imageSec{
width:100px;
float:left;
}

.rankingArea #ranking .section .rank{
padding:0 0 0 4px;
text-align:left;
}

.rankingArea #ranking .section .lastWeek{
padding:0 4px 0 0;
text-align:right;
}

.rankingArea #ranking .section .lastWeek img{
}

.rankingArea #ranking .section .lastWeek span{
display:block;
color:#8c8c8c;
font-size:85%;
}

.rankingArea #ranking .section .productInfo{
padding:0 6px 0 0;
width:198px;
float:right;
}

.rankingArea #ranking .section .productInfo h2{
margin:0 0 8px 0;
padding:0;
border:none;
background:none;
font-size:100%;
color:#474747;
}

.rankingArea #ranking .section .productInfo h2 span{
display:block;
}

.rankingArea #ranking .section .productInfo .maker{
font-weight:normal;
}

.rankingArea #ranking .section .productInfo .productTitle{
font-weight:bold;
font-size:116%;
}

.rankingArea #ranking .section .productInfo .type{
font-weight:normal;
}

.rankingArea #ranking .section .productInfo ul{
margin:0 0 3px 0;
}

.rankingArea #ranking .section .productInfo li{
}

.rankingArea #ranking .section .productInfo .marketPrice .price{
font-weight:bold;
color:#c00;
}

.rankingArea #ranking .section .productInfo .marketPrice .label{
font-size:85%;
}

.rankingArea #ranking .section .productInfo .releaseDate{
font-size:85%;
}

.rankingArea #ranking .section .productInfo .userWriting{
padding:2px 0 0 0;
float:left;
font-size:85%;
}

.rankingArea #ranking .section .productInfo .userWriting a{
padding:2px 0 2px 12px;
background:transparent url(../../common/images/ico/icon01.gif) -5px -2074px no-repeat;
}

.rankingArea #ranking .section .productInfo .shopBtn{
float:right;
}

.rankingArea #ranking .currentitem{
padding:10px 10px 8px;
width:310px;
border-bottom:1px solid #f1f1f1;
}

.rankingArea #ranking .currentitem dt{
margin:0 0 4px 0;
font-weight:bold;
}








/*------ 1クリック,関連ジャンル ------*/
.rankingArea #rankingNavi .module01{
margin:0 auto 10px;
width:118px;
border:1px solid #d4d4d4;
background:#fff;
}

.rankingArea #rankingNavi .module01 h2{
margin:0 0 6px;
padding:0;
border:none;
background:none;
font-size:100%;
}

.rankingArea #rankingNavi .module01 dl{
padding:0;
}

.rankingArea #rankingNavi .module01 h2,
.rankingArea #rankingNavi .module01 .btn,
.rankingArea #rankingNavi .module01 .result{
float:none;
}

.rankingArea #rankingNavi #oneClick .btn{
width:102px;
text-align:center;
}

.rankingArea #rankingNavi .module01 dt,
.rankingArea #rankingNavi .module01 li{
margin:0 0 3px 0;
}

.rankingArea #rankingNavi #relatedGenre li{
padding:0 0 0 9px;
background:transparent url(../../common/images/ico/icon01.gif) -6px -1491px no-repeat;
}