@charset "utf-8";

/*indexページのcss*/


/*div構造=======================================================================

#wrapper ┬ #carlogo（下位階層ページでも使うため、common.cssに記載）
		 │	
		 ├	.gNavi_webcatalog（下位階層ページでも使うため、common.cssに記載）
		 │	
		 ├	.gNavi_support（下位階層ページでも使うため、common.cssに記載）
		 │	 
		 └ #index_wrapper ┬ #leftColumn ┬ #news_topics_wrapper ─ #news_topics
						   │			  ├ #mail_community_wrapper
						   │			  ├ #ranking_wrapper ┬ #ranking_grade
						   │			  │				  └ #ranking_color
						   │			  └ #special_wrapper
						   │ 
						   └ #rightColumn
						   
=============================================================================*/





/* div#index_wrapper
===================================================================
=================================================================*/
div#index_wrapper{
	margin:12px;
	background:url(../../image/index_wrapper_bg.gif) right bottom no-repeat;
}




/* div#leftColumn
===================================================================
=================================================================*/

div#leftColumn{
	width:648px;
	float:left;
}

div#leftColumn h2{
	margin-bottom:5px;
}

/* Rtoaster
=========================================*/
#carlogo #rt-personalize-area-a {
     float:right;
     margin:-16px 15px 5px 0;
     text-align:right;
     background: no-repeat 0px 3px;
     font-size: 116%;
     font-weight:bold;
}

#carlogo #rt-personalize-area-a a:link,#carlogo #rt-personalize-area-a a:visited {
     color: #666666;
     text-decoration: underline;
}
#carlogo #rt-personalize-area-a a:hover {
     color: #666666;
     text-decoration: none;
}


/* ニュース＆トピックス
=========================================*/
div#news_topics_wrapper{
	width:365px;
	margin:0 10px 12px 0;
	float:left;
}

div#news_topics{
	width:343px;
	height:206px;
	padding:10px;
	border:1px solid #a0a0a0;
	overflow:auto;
}

#ie5-5only div#news_topics{
	width:365px;
	height:228px;
	padding:10px;
	border:1px solid #a0a0a0;
	overflow:auto;
}

div#news_topics dl dt{
	width:8em;
	padding-bottom:0.6em;
	text-indent:0.8em;
	background:url(../../image/news_topics_bullet.gif) left 7px no-repeat;
	float:left;
	zoom:1;
}

div#news_topics dl dd{
	margin-left:8em;
	padding-bottom:0.6em;
	zoom:1;
}

div#news_topics dl dd a{
	color:#000;	
}

div#news_topics dl dd a:visited{
	color:#660066;	
}

div#news_topics dl dd a:hover{
	color:#d73c3c;
}



/* メールサービス、コミュニティ
=========================================*/
div#mail_community_wrapper{
	width:273px;
	float:left;
	margin-bottom:12px;
}

div#mail_community_wrapper ul.community li img{
	vertical-align:bottom;
}


/* 人気ランキング
=========================================*/
div#ranking_wrapper{
	background:url(../../image/ranking_bg.gif) right bottom no-repeat;
	margin-bottom:15px;
	font-size:78%;
	line-height:1.5;
}

/*グレードランキング*/
div#ranking_grade{
	width:321px;
	padding:5px 0;
	margin-right:6px;
	border-top:1px solid #a0a0a0;
	float:left;
}

div#ranking_grade h3{
	border-bottom:1px dotted #a0a0a0;
	padding:0 0 5px 5px;
	margin-bottom:5px;
}
div#ranking_grade .coming {
	font-size: 12px;
	margin-left: 15px;
}

div#ranking_grade p{
	margin:0 0 5px 7px;
}

div#ranking_grade ol{
	width:181px;
	float:left;
	padding-left:10px;
	margin-right:5px;
}

#ie5-5only div#ranking_grade ol{
	width:191px;
	float:left;
	padding-left:10px;
	margin-right:5px;
}

div#ranking_grade ol li{
	padding-left:20px;
	margin-bottom:0.6em;
}

#ie5-5only div#ranking_grade ol li{
	text-indent:-16px;
}

div#ranking_grade ol li.no01{
	background:url(../../image/no1.gif) left 2px no-repeat;
}

div#ranking_grade ol li.no02{
	background:url(../../image/no2.gif) left 2px no-repeat;
}

div#ranking_grade ol li.no03{
	background:url(../../image/no3.gif) left 2px no-repeat;
}

div#ranking_grade p.grade_photo{
	width:110px;
	float:left;
}

/*カラーランキング*/
div#ranking_color{
	width:321px;
	padding:5px 0;
	border-top:1px solid #a0a0a0;
	float:left;
}

div#ranking_color h3{
	border-bottom:1px dotted #a0a0a0;
	padding:0 0 5px 5px;
	margin-bottom:5px;
}

div#ranking_color .coming {
	font-size: 12px;
	margin-left: 15px;
}

div#ranking_color p{
	margin:0 0 5px 7px;
}

div#ranking_color ol{
	padding-left:10px;
}

div#ranking_color ol li{
	padding-left:20px;
	margin-bottom:0.6em;
}

div#ranking_color ol li.no01{
	background:url(../../image/no1.gif) left 2px no-repeat;
}

div#ranking_color ol li.no02{
	background:url(../../image/no2.gif) left 2px no-repeat;
}

div#ranking_color ol li.no03{
	background:url(../../image/no3.gif) left 2px no-repeat;
}


div#ranking_color ol li dl dt{
	float:left;
	width:161px;
	margin-right:10px;
}


div#ranking_color ol li dl dd img{
	border:1px solid #a0a0a0;
}


/* スペシャルコンテンツ
=========================================*/
div#special_wrapper{
	background:#bacdcb;
	clear:both;
	padding:0 10px;
}

div#special_wrapper h2{
	position:relative;
	left:0;
	top:-5px;
}



div#special_wrapper ul{
	float:left;
	margin-right:-18px;
}

div#special_wrapper ul li{
	float:left;
	width:200px;
	margin-right:14px;
	padding-bottom:10px;
}

div#special_wrapper ul li img{
	vertical-align:bottom;
}

div#special_wrapper ul li a img{
	filter:alpha(opacity=100); 
    -moz-opacity: 1.0; 
    opacity: 1.0;
}

div#special_wrapper ul li a:hover img{
	filter:alpha(opacity=70); 
    -moz-opacity: 0.7; 
    opacity: 0.7;
}
div#leftColumn .taikan_101206 {
	padding-top: 3px;
}
div#leftColumn .taikan_101206 a:hover img {
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}
div#leftColumn .taikan_101206 a img{
	filter:alpha(opacity=100);
	-moz-opacity: 1.0;
	opacity: 1.0;
}




/* div#rightColumn
===================================================================
=================================================================*/
div#rightColumn{
	width:218px;
	padding:10px 0;
	background:url(../../image/leftColumn_topbg.gif) top no-repeat;
	float:right;
}

div#rightColumn h2{
	margin:0 0 7px 8px;
}

/* ■インフォメーション
=========================================*/
ul#infomation{
	margin-bottom:10px;
	border-bottom:1px solid #fff;
	padding:0 8px 10px;
}

ul#infomation li{
	margin-bottom:7px;
	background:url(../../image/infomation_bullet.gif) 7px 5px no-repeat;
	padding-left:18px;
}

ul#infomation li a{
	color:#000;
}

ul#infomation li a:visited{
	color:#660066;
}

ul#infomation li a:hover{
	color:#d73c3c;
}


/* ■関連情報
=========================================*/
ul#kanren{
	padding:0 0 7px 8px;
	margin:0 -6px 10px 0;
	margin-bottom:10px;
	border-bottom:1px solid #fff;
}

ul#kanren li{
	width:98px;
	float:left;
	margin-right:6px;
	margin-bottom:4px;
}

ul#kanren li img{
	vertical-align:bottom;
}

ul#kanren li a img{
	border:1px solid #a19fa2;
	filter:alpha(opacity=100); 
    -moz-opacity: 1.0; 
    opacity: 1.0;
}

ul#kanren li a:visited img{
	border:1px solid #a19fa2;
}

ul#kanren li a:hover img{
	border:1px solid #cc0000;
	filter:alpha(opacity=70); 
    -moz-opacity: 0.7; 
    opacity: 0.7;
}


/* ■携帯サイト
=========================================*/
dl#keitai{
	padding:0 8px;
	font-size:78%;
	line-height:1.5;
}

dl#keitai dt{
	width:66px;
	float:left;
}

dl#keitai dd{
	margin-left:66px;
}

dl#keitai dd p.copy{
	padding-top:3px;
}







/* ツールチップ
=========================================*/

.js_tooltipContent{
	position:absolute;
	z-index:100;
	background:#000;
	color: #fff;
	width:180px;
	padding: 10px;
	display:none;
	text-align:left;
}