@charset "Shift_JIS";

/* ----------------------------------------------------------- 
CSS Information	

Site URL:				https://ranking.cosme.net/
File name:		top.css
Created:				2010-03-25 
Last update:		2012-09-12 by kamifukumotos
by Author Style Info: LOTOPκp
----------------------------------------------------------- */ 
/* ----------------------------------------------------------- 
Table of Contents 
 * header modules
 * main modules
----------------------------------------------------------- */


/** header modules ----------------------------------------------------------------**/

/* ranking ΕθU±g ----------------*/
#rnk-top-pup {
	position: relative;
}
/* total-review ------------------------*/

#total-review {
	margin-bottom: 17px;
	padding-top: 12px;
	padding-left: 11px;
}
#total-review h2 {
	float: left;
	width: 383px;
}
#total-review dl {
	display: inline;
	float: left;
	margin-left: 18px;
	padding-top: 2px;
}
#total-review dt {
	margin-bottom: 4px;
	font-weight: bold;
	color: #f94d9b; }
#total-review dd { color: #666; font-size: 95%; }
#total-review dd img{ vertical-align: middle; }
#total-review p {
	float: left;
	margin: 15px 0 0 50px;
	line-height: 1.5;
}
#total-review p a {
	padding-left: 3px;
	color: #333;
	font-weight: bold;
	text-align: center;
}
/* header-ranking ------------------------*/

#header-ranking {
	margin-bottom: 20px;
}

/* category-ranking ------------------------*/

#category-ranking { 
	display: inline;
	float: left;
	width: 126px;
	min-height: 270px;
	margin-left: 11px;
	padding-top: 30px;
	background: url("../../../images/cnt/ranking/bg_category_ranking.png") no-repeat;
}
* html #category-ranking { height: 270px; }
#category-ranking h3{ width: 96px; margin-left: 19px; text-align: center; }
#category-ranking h4{ 
	overflow: hidden;
	display: block;
	height: 0;
	padding-top: 34px;
	line-height: 2;
}
#category-ranking .date {
	overflow: hidden;
	width: 73px;
	height: 17px;
	margin-bottom: 10px;
	margin-left: 29px;
	color: #fff;
	font-size: 83%;
	text-align: center;
	line-height: 20px;
}
#category-ranking .view-more {
	width: 73px;
	margin-left: 29px;
	color: #fff;
	font-size: 83%;
	text-align: center;
}
#category-ranking .view-more a {
	padding-right: 5px;
	background: url("../../../images/cnt/ranking/arrow_white_mini.png") no-repeat right center;
	color: #fff;
	line-height: 1.1;
}
#category-ranking .view-more a { text-decoration: none; }
#category-ranking .view-more a:hover { text-decoration: underline; }


/* popular-ranking ------------------------*/
#popular-ranking {
	float: left;
	width: 435px;
	margin-right: 22px;
	padding-top: 7px;
	background: url("../../../images/cnt/ranking/bg_popular_header.png") no-repeat left top;
}
#popular-ranking .ranking{
	margin-bottom: 7px;
	background: url("../../../images/cnt/ranking/bg_popular_bottom.png") no-repeat left bottom;
}
#popular-ranking .list{
	display: inline;
	float: left;
	width: 142px;
	margin-right: 3px;
	text-align: center;
}
#popular-ranking .rank { margin-bottom: 3px; }
#popular-ranking .pic { 
	margin: 0 6px 5px;
	padding-bottom: 4px;
	border-bottom: 1px dotted #CCC;
}
#popular-ranking .rating { margin: 0 7px 3px; line-height: 15px; }
#popular-ranking .point { 
	margin-bottom: 6px;
	font-size: 83%;
	text-align: center;
}
#popular-ranking .point span { 
	display: inline-block;
	padding: 3px 0 0 17px;
	background:  url("/images/general/common/ranking_icons/ico_csm_point.png") no-repeat 0 0.2em;
}
#popular-ranking .votes { 
	margin: 0 6px 5px;
	padding-bottom: 5px;
	border-bottom: 1px dotted #CCC;
	font-size: 83%;
}
#popular-ranking .votes a { 
	color: #333;
	font-size: 115%;
	font-weight: bold;
}
#popular-ranking .votes a:hover {
	color: #07b0a9;
}
#popular-ranking .name { margin: 0 11px 5px; font-size: 95%; text-align: left; line-height: 1.4; }
#popular-ranking .name span{ color: #999; }
#popular-ranking .name a{ font-weight: bold; text-decoration: none; }
#popular-ranking .name a:hover{ text-decoration: underline; }
#popular-ranking .name a:active{ text-decoration: underline; }
#popular-ranking .name a.brand{ font-weight: normal; }
#popular-ranking .shopping { float: right; margin: 0 15px 11px 16px; _display:inline; }

#popular-ranking .view-more {
	padding-top: 2px;
	text-align: right;
}
#popular-ranking .view-more a {
	margin-right: 3px;
	padding-right: 15px;
	background: url("/images/cnt/ranking/ico_arw_viewmore.png") no-repeat right center;
	color: #f94d9b;
	font-size: 105%;
	font-weight: bold;
}
#popular-ranking .view-more a:hover {
	color: #fa71af;
}

/* header-hot ------------------------*/
#header-hot { float: left; margin-right: 7px; margin-bottom: 20px; }

/* popular-category popular-effect ------------------------*/
#popular-category{ width: 140px; margin-bottom: 10px; }
#popular-effect{ width: 140px; }
#popular-category h3 a,
#popular-category h3 span,
#popular-effect h3 a,
#popular-effect h3 span {
	overflow: hidden;
	display: block;
	width: 140px;
	height: 0;
	margin-bottom: 4px;
	padding-top: 49px;
	background: url("../../../images/cnt/ranking/sprite_top.png") no-repeat;
	line-height: 2;
}

#popular-category h3 a, #popular-category h3 span { background-position: 0 -56px;}
#popular-category h3 a:hover { background-position: -140px -56px; }

#popular-effect h3 a, #popular-effect h3 span { background-position: 0 -106px;}
#popular-effect h3 a:hover { background-position: -140px -106px; }

#popular-category ul,
#popular-effect ul { line-height: 1.4; font-weight: bold; }

#popular-category li,
#popular-effect li {
	margin-bottom: 6px;
	padding-left: 17px;
	background: url("../../../images/cnt/ranking/bg_popular_list.png") no-repeat left 0.3em;
}

#popular-category .view-more,
#popular-effect .view-more {
	padding-right: 8px;
	background: url("../../../images/general/common/icons/viewmore_ico.png") no-repeat right center;
	text-align: right;
	font-size: 95%;
}

#popular-category .view-more a,
#popular-effect .view-more a{
	color: #555;
}
#popular-category .view-more a:hover,
#popular-effect .view-more a:hover {
	color: #07b0a9;
}

/* trend-check ------------------------*/

#trend-check {
	float: left;
	width: 200px;
	background: url("../../../images/cnt/ranking/bg_trend_check.png") no-repeat left top;
	border-bottom: 1px solid #DCF1EB;
}
#trend-check h3 {
	overflow: hidden;
	display: block;
	width: 200px;
	height: 0;
	padding-top: 40px;
}
#trend-check ul {
	margin: 0 15px;
}
#trend-check li {
	margin-bottom: 12px;
	padding-left: 9px;
	background: url("../../../images/cnt/ranking/arrow_blue_mini.png") no-repeat left center;
	font-size: 105%;
	font-weight: bold;
	line-height: 1.3;
}
#trend-check .view-more a{
	overflow: hidden;
	display: block;
	width: 176px;
	height: 0;
	margin: 0 auto 12px;
	padding-top: 28px;
	background: url("../../../images/cnt/ranking/sprite_top.png") no-repeat;
	line-height: 2;
}

#trend-check .view-more a { background-position: 0 0;}
#trend-check .view-more a:hover { background-position: -176px 0; }


/** main modules ----------------------------------------------------------------**/

/* main modules h3 ------------------------*/

#brand-new h3 a,
#theme h3 a,
#pickup-ranking h3 a { 
	display: block;
	width: 586px;
	height: 31px;
	margin-bottom: 10px;
	padding-right: 23px;
	padding-left: 15px;
	background: url("../../../images/cnt/ranking/sprite_top.png") no-repeat;
}

#brand-new h3 a,
#theme h3 a,
#pickup-ranking h3 a { background-position: 0 -156px; color: #333; text-decoration: none; }

#brand-new h3 a:hover,
#theme h3 a:hover,
#pickup-ranking h3 a:hover { background-position: 0 -187px; color: #F90; text-decoration: underline; }

#brand-new h3 .heading,
#theme h3 .heading,
#pickup-ranking h3 .heading { display: block; float: left; font-weight: bold; line-height: 31px; text-decoration: none; cursor: pointer; }
#brand-new h3 .view-more,
#theme h3 .view-more,
#pickup-ranking h3 .view-more { display: block; float: right; font-size: 95%; line-height: 31px; cursor: pointer; }

/* brand-new ------------------------*/

#brand-new {
	margin-bottom: 10px;
}
#brand-new h3 {
	margin-bottom: 10px;
}
#brand-new ul {
	margin-left: -12px;
}
#brand-new li {
	display: inline;
	float: left;
	width: 115px;
	margin-left: 12px;
	word-break: break-all;
}

/* theme ------------------------*/

#theme h4 {
	margin-bottom: 10px;
	border-top: 1px solid #C7E3DA;
	border-bottom: 1px solid #C7E3DA;
}
#theme .category h4 .clearfix,
#theme .effect h4 .clearfix,
#theme .skin h4 .clearfix,
#theme .generation h4 .clearfix,
#theme .element h4 .clearfix,
#theme .shop h4 .clearfix {
	margin-left: 0px;
}
#theme h4 a {
	display: block;
	padding-left: 5px;
	padding-right: 5px;
	background: #ebf7f3;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	line-height: 23px;
	text-decoration: none;
	overflow: hidden;
}
#theme h4 a span {
	cursor: pointer;
}
#theme h4 .heading {
	float: left;
	color: #333;
	font-weight: bold;
	font-size: 105%;
}
#theme h4 a:hover .heading {
	 color: #07b0a9;
}
#theme h4 .view-more {
	float: right;
	padding-right: 8px;
	background: url("../../../images/general/common/icons/viewmore_ico.png") no-repeat right center;
	line-height: 23px;
	font-size: 95%;
	text-decoration: underline;
}
#theme ul { margin-bottom: 20px; }
#theme li {
	margin-bottom: 2px;
	padding-left: 10px;
	background: url("../../../images/cnt/ranking/icon_ball.png") no-repeat left 0.4em;
}

#theme li a{ font-size: 95%; line-height: 18px; }
#theme li a { text-decoration: none; }
#theme li a:hover { text-decoration: underline; }

/* #theme .category ------------------------*/

#theme .category { margin-bottom: 5px; }
#theme .category h5 { margin-bottom: 7px; }
#theme .category h5 a{ font-weight: bold; color: #333; line-height: 1.2; }
#theme .category h5 a:hover { color: #07b0a9; }

#theme .category .clearfix { margin-left: -5px; }
#theme .category .section { display: inline; float: left; width: 120px; margin-left: 5px; }
#theme .category ul { margin-bottom: 10px; }
#theme .category li { margin-bottom: 4px; padding-left: 10px; background: url("../../../images/cnt/ranking/dot_tree.png") no-repeat left -8px; }
#theme .category li.last { background: url("../../../images/cnt/ranking/dot_tree.png") no-repeat left -62px; }

/* #theme .effect ------------------------*/

#theme .effect {}
#theme .effect .clearfix { margin-left: -5px; }
#theme .effect .section { 
	display: inline;
	float: left;
	width: 120px;
	margin-left: 5px;
}

/* #theme extra ------------------------*/
#theme .skin { float: left; width: 122px; margin-right: 5px; }
#theme .generation { float: left; width: 122px; margin-right: 5px; }
#theme .element { float: left; width: 249px; margin-right: 5px; }
#theme .element ul { float: left; width: 124px;}
#theme .shop { float: left; width: 115px; }

/* pickup-ranking general ------------------------*/
#pickup-ranking { }
#pickup-ranking h4 { margin-bottom: 3px; padding-left: 15px; background: url("../../../images/cnt/ranking/icon_ball_arrow.png") no-repeat left center; }
#pickup-ranking h4 a, #pickup-ranking h4 span { font-size: 105%; font-weight: bold; text-decoration: none; line-height: 1.1; }

#pickup-ranking dl { margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px dotted #CCC; }
*:first-child+html #pickup-ranking dl { padding-bottom: 10px; } 
#pickup-ranking dt { float: left; width: 64px; margin-right: 2px; text-align: center; font-weight: bold; font-size: 125%; }
#pickup-ranking dt p { margin-bottom: 5px; }
#pickup-ranking dt p span{ padding-left: 2px; font-size: 80%; }
#pickup-ranking dd.pic { float: left; width: 70px; margin-right: 10px; }
#pickup-ranking dd.summary { float: left; width: 156px; }
#pickup-ranking dd.summary-wide { float: left; width: 236px; }
#pickup-ranking dd .brand { display: block; margin-bottom: 3px; font-size: 95%; line-height: 1.3; }
#pickup-ranking dd .brand img { padding-left: 2px; vertical-align: middle; }
#pickup-ranking dd .item { display: block; margin-bottom: 6px; line-height: 1.3; font-weight: bold; }
#pickup-ranking dd .item img { padding-left: 2px; vertical-align: middle; }
#pickup-ranking dd .item a { text-decoration: none; }
#pickup-ranking dd .item a:hover { text-decoration: underline; }
#pickup-ranking dd .category { display: block; margin-bottom: 9px; font-size: 95%; color: #999; }
#pickup-ranking dd .category a { padding: 0 2px; color: #555; line-height: 1.2; }
#pickup-ranking dd .category a:hover { color: #07b0a9; }
#pickup-ranking dd .shop { text-align: right; }
#pickup-ranking dd.review { float: left; width: 236px; }
#pickup-ranking dd .title { font-size: 105%; font-weight: bold; }
#pickup-ranking dd .title a { text-decoration: none; }
#pickup-ranking dd .title a:hover { text-decoration: underline; }
#pickup-ranking dd .num { color: #555; font-size: 95%; }
#pickup-ranking dd .desc {
	padding-top: 5px;
	font-size: 95%;
	line-height: 1.3;
	word-wrap: break-word;      /* IE 5+ */
}
#pickup-ranking dd .desc img { padding: 0 3px; vertical-align: middle; }
#pickup-ranking dd .desc a { text-decoration: none; }
#pickup-ranking dd .desc a:hover { text-decoration: underline; }
#pickup-ranking .inner { padding-top: 19px; background: url("../../../images/cnt/ranking/bg_top_pickup.png") no-repeat top; }

/* pickup-ranking ------------------------*/
#pickup-ranking .wrap {
	margin-bottom: 30px;
}
#pickup-ranking .generation {
	float: left;
	width: 302px;
	margin-right: 19px;}
#pickup-ranking .skin {
	float: left;
	width: 302px;
}
#pickup-ranking .chieco {
	float: left;
	width: 302px;
	margin-right: 19px;
}
#pickup-ranking .chieco h5 { margin-bottom: 4px; font-size: 95%; line-height: 1.2; }
#pickup-ranking .chieco h5 img { padding: 0 3px; vertical-align: top; }
#pickup-ranking .chieco .title { line-height: 1.2; }
#pickup-ranking .chieco a:hover .title {
	text-decoration:underline;
}
#pickup-ranking .chieco .review a {
	display: block;
	text-decoration: none;
	cursor: pointer;
}
#pickup-ranking .chieco .review .desc {
	display: inline-block;
	color: #333;
}
#pickup-ranking .chieco .desc span {
	padding-right: 8px;
	background: url("../../../images/general/common/icons/viewmore_ico.png") no-repeat right center;
	text-decoration: underline;
}
#pickup-ranking .chieco .review a:link .desc span {
	color: #068681;
}
#pickup-ranking .chieco .review a:visited .desc span {
	color: #709293;
}
#pickup-ranking .chieco .review a:hover .desc span {
	color: #07b0a9;
}
#pickup-ranking .chieco .review a:active .desc span {
	color: #07b0a9;
}
#pickup-ranking .sales { float: left; width:302px; }
#pickup-ranking .sales h5 { margin-bottom:4px; font-weight:bold; line-height:1.2; }
#pickup-ranking .sales h5 span { padding-right:5px; font-size:95%; font-weight:normal; }

#pickup-ranking .generation .view-more,
#pickup-ranking .skin .view-more,
#pickup-ranking .chieco .view-more,
#pickup-ranking .sales .view-more {
	text-align:right;
	font-size: 95%;
}
#pickup-ranking .chieco .view-more a {
	padding-left: 3px;
	font-size: 95%;
}
#pickup-ranking .generation .view-more a,
#pickup-ranking .skin .view-more a,
#pickup-ranking .chieco .view-more a,
#pickup-ranking .sales .view-more a {
	padding-right: 8px;
	background: url("../../../images/general/common/icons/viewmore_ico.png") no-repeat right center;
	color: #555;
}
#pickup-ranking .generation .view-more a:hover,
#pickup-ranking .skin .view-more a:hover,
#pickup-ranking .chieco .view-more a:hover,
#pickup-ranking .sales .view-more a:hover {
	color: #07b0a9;
}