@import "/special/css/courselist.css";

.prcourtesy{
	float:right;
	margin:0 0 10px 10px;
}


#str_contents .name{
	background:#e2eaf8;
	border-bottom:1px solid #ccc;
	overflow:hidden;
	zoom:1;
}
#str_contents .name h3{
	margin:5px 10px;
	font-size:14px;
	float:left;
	border:none;
}
#str_contents .name h3 img{
	margin-right:5px;
}
#str_contents .name h3 span{
	font-size:12px;
}
#str_contents .name p.acc{
	margin:7px 10px;
	color:#666;
	clear:both;
}
#str_contents .name p.acc img{
	margin:0 10px;
	vertical-align:middle;
}
#str_contents .example h4{
	padding:3px 0 0 6px;
	margin: 0 0 10px 0;
	border-left:4px solid #eb4055;
	font-weight:bold;
}


#str_contents ul.playstyle{
	margin:5px 0;
	float:right;
}
#str_contents ul.playstyle li{
	margin-left:5px;
	display:inline;
}

#str_contents .btn{
	text-align:right;
}

/** ページレイアウト **/
/** ヘッダーエリア **/

/*rank01*/
#rank01{
	margin:0 0 20px;
	border:1px solid #ccc;
	overflow:hidden;
	zoom:1;
}

#rank01 .name ul{
	margin:10px;
}
/*example*/
#rank01 .example{
	width:334px;
	margin:10px 10px 10px 0;
	_margin:10px 5px 10px 0;
	float:right;
}
#rank01 .example .exampletext{
	min-height:320px;
}
#rank01 .example p{
	margin-bottom:10px;
}
#rank01 .example .coment{
	margin-bottom:10px;
	padding:10px;
	border-radius: 5px;         /* CSS3 */
   -moz-border-radius: 5px;    /* Firefox */
   -webkit-border-radius: 5px; /* Safari,Chrome */
	border:1px solid #ccc;
	background:#f1f1f1;
}
#rank01 .example .coment h4{
	padding:0;
	border:none;
	color:#EB4055;
}
#rank01 .example .coment p{
	margin-bottom:1px;
}
#rank01 .example .btn{
	text-align:right;
}

#rank01 #sideshows{
	width:400px;
	height:370px;
	margin:10px 0 10px 10px;
	padding:0;
}


/** secondrank **/
#secondrank{
	margin:0 0 20px;
	overflow:hidden;
	zoom:1;
}
#secondrank .rank02{
	float:left;
}
#secondrank .rank03{
	float:right;
}
#secondrank .course{
	width:375px;
	border:1px solid #ccc;
}

#secondrank .course .name{
	margin:0 0 10px;
	padding:5px 0;
}
#secondrank .course .images{
	width:330px;
	height:250px;
	margin: 0 0 10px 20px;
	display:block;
}

#secondrank .course .example{
	width:350px;
	margin: 0 auto 10px;
	display:block;
}
#secondrank .course .example p.text{
	height:9em;
}
#secondrank .course .example p.text03{
	height:6em;
}
#secondrank .course .example p.text04{
	height:6em;
}


/** best10 **/


#str_contents #best10 .course{
	width:768px;
	margin-bottom:10px;
	border:1px solid #ccc;
	overflow:hidden;
}
#str_contents #best10 .name p.acc{
	margin:7px 10px;
	_margin:7px 5px;
	color:#666;
	clear:none;
	float:right;
}
#str_contents #best10 .images{
	width:120px;
	margin:10px 0 10px 10px;
	_margin:10px 0 10px 5px;
	float:left;
}
#str_contents #best10 .example{
	width:610px;
	margin:10px 10px 10px 0;
	_margin:10px 5px 10px 0;
	float:right;
}

/** best100 **/
#best100 dl {
	width:770px;
	border-top:1px solid #ccc;
	border-right:1px solid #ccc;
	overflow:hidden;
}

#best100 dt{
	width:50px;
	padding:5px 0;
	background:#E2E9F9;
	text-align:center;
	font-weight:bold;
	float:left;
	border-bottom:1px solid #ccc;
	border-left:1px solid #ccc;
}
#best100 dd{
	width:324px;
	padding:5px;
	float:left;
	border-bottom:1px solid #ccc;
}

@media screen and (-webkit-min-device-pixel-ratio:0){
#best100 dd{
	letter-spacing:-0.1em;
}
}