@charset "utf-8";
/*=============================================================

	Date: 2014-10-21
	CSS Document ： MUSIC-STYLE TOPページ
	
	1.Topページヘッダー設定
	2.ギャラリー設定
	3.TOPページ大枠設定
	4.登録サイト数カウント設定
	5.新着グッドデザインサイト設定
	6.ピックアップサイト設定
	7.カテゴリリスト
	8.カテゴリランキング設定
	9. TOP検索設定

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




/* ---------------------------------

	1.TOPページヘッダー設定

--------------------------------- */

div#top_img {
margin:-44px 0 0 0;
text-align:center;
width:100%;
height:300px;
background:url(../img/bg_topimg.jpg) no-repeat top center;
}


div#top_header {
	margin:0 auto;
	padding:0;
	text-align:center;
	width: 100%;
}



div#header_ad{
	width:500px;
	float:left;
	height:30px;
}


/* ---------------------------------

	2.スライドショー設定

--------------------------------- */



div#slide_show{
	width:530px;
	height:447px;
	padding-bottom:20px;
}

div#slide_show a {text-decoration:none;}
div#slide_show a:hover {text-decoration:underline; color:#fff;}




/* ---------------------------------

	3.トップページ大枠設定

--------------------------------- */



div#index_right {
	width:160px;
	float:right;
	text-align:center;
	margin:20px 0 20px 0;
}


div#index_content {
	width:530px;
	float:left;
	text-align:left;
	margin:20px 0 20px 20px;
	}



div#index_left {
	float: left;
	width: 250px;
	text-align:left;
	margin:20px 0 20px 0;
}




/* ---------------------------------

	4.登録サイト数カウント設定

--------------------------------- */



div#total_log{
	width: 160px;
	height:70px;
	display:block;
	margin-top:28px;
	text-align: left;
	background:url(../img/bg_total_log.jpg) no-repeat;
}

.logcount { color:#000; font-weight:bold; font-size:2.2em; font-family: verdana; padding-top:46px; letter-spacing:1px;}





/* ---------------------------------

	5.新着・グッドデザインサイト設定

--------------------------------- */



.puttl_new{
	width:160px;
	height:50px;
	display:block;
	margin-top:50px;
	background:url(../img/sttl_top_newarrived.jpg) no-repeat;
}



.puttl_design{
	width:160px;
	height:50px;
	display:block;
	margin-top:50px;
	background:url(../img/sttl_top_design.jpg) no-repeat;
}



.pu_box_new{ /* pu_ys用 */
	display:block;
	width:160px;
	text-align:left;
	margin-top:15px;
	padding-bottom:10px;
	line-height:1.2em;
	font-size:1.1em;
	font-weight:bold;
}



.pu_box_new img { /* pu_ys用 */
	border:#e1e1e1 1px solid;
	padding:5px;
	display:block;
 }
 
 
.pu_box_new  a:hover img{
  opacity:0.6;
  filter: alpha(opacity=60);
}

 
 
.pu_new_name{ /* pu_ys用 */
	display:block;
	width:160px;
	text-align:left;
	font-weight:bold;
}

 .pu_new_date{ /* pu_ys用 */
	display:block;
	width:160px;
	text-align:left;
	font-size:9px;
	margin:0;
	color:#999;
}





/* ---------------------------------

	6.ピックアップサイト設定

--------------------------------- */


.puttl_recommend{
	width:530px;
	height:55px;
	display:block;
	margin-top:10px;
	background:url(../img/sttl_top_recommended.jpg) no-repeat;
}





.pu_box{ /* pu_ys用 */
	float:right;
	width:500px;
	text-align:left;
	margin:20px 10px 20px 15px;
}


.pu_box img { /* pu_ys用 */
	border:#eaeaea 1px solid;
	padding:5px;
	margin-right:10px;
	float:left;
 }
 


.pu_box a:hover img{
  opacity:0.6;
  filter: alpha(opacity=60);
}



.pu_text{ /* pu_ys用 */
	text-align:left;
	font-size:1.2em;
	line-height:1.2em;
	font-weight:bold;
}



 .pu_date{ /* pu_ys用 */
	text-align:left;
	font-size:10px;
	color:#fff;
	background:#000;
	padding:5px;
	width:140px;
	font-weight:bold;
	margin-bottom:10px;
	-moz-border-radius: 7px;    /* Firefox */
   -webkit-border-radius: 7px; /* Safari,Chrome */
   border-radius: 7px;         /* CSS3 */
   border: 3px #000 solid; 
}


.pu_comment{ /* pu_ys用 */
	text-align:left;
	font-size:0.8em;
	line-height:1.1em;
	font-weight:normal;
}


.pu_more { 
clear:both;
margin:15px 10px 0 15px;
text-align:right;
}


/* ---------------------------------

	7.カテゴリリスト

--------------------------------- */



div#categorylist{
	width:530px;
	padding-top:50px;
	padding-bottom:20px;
	margin-top:30px;
	text-align:left;
	background:url(../img/sttl_top_categories.jpg) no-repeat;
}



div#categorylist_01ct { background:url(../img/bg_topct01.jpg) no-repeat; float:left; margin:20px 0 20px 0; min-height:120px;}
div#categorylist_02ct { background:url(../img/bg_topct02.jpg) no-repeat; float:right; margin:20px 0 20px 30px; min-height:120px;}
div#categorylist_03ct { background:url(../img/bg_topct03.jpg) no-repeat; float:left; margin:20px 0 20px 0;  min-height:120px;}
div#categorylist_04ct { background:url(../img/bg_topct04.jpg) no-repeat; float:left; margin:20px 0 20px 30px;  min-height:120px;}
div#categorylist_05ct { background:url(../img/bg_topct05.jpg) no-repeat; float:left; margin:20px 0 20px 0px;  min-height:120px;}
div#categorylist_06ct { background:url(../img/bg_topct06.jpg) no-repeat; float:left; margin:20px 0 20px 30px;  min-height:120px;}
div#categorylist_07ct { background:url(../img/bg_topct07.jpg) no-repeat; float:left; margin:20px 0 20px 0;  min-height:120px;}
div#categorylist_08ct { background:url(../img/bg_topct08.jpg) no-repeat; float:left; margin:20px 0 20px 30px;  min-height:120px;}
div#categorylist_09ct { background:url(../img/bg_topct09.jpg) no-repeat; float:left; margin:20px 0 20px 0;  min-height:120px;}
div#categorylist_10ct { background:url(../img/bg_topct10.jpg) no-repeat; float:left; margin:20px 0 20px 30px;  min-height:120px;}
div#categorylist_11ct { background:url(../img/bg_topct11.jpg) no-repeat; float:left; margin:20px 0 20px 0;  min-height:120px;}
div#categorylist_12ct { background:url(../img/bg_topct12.jpg) no-repeat; float:left; margin:20px 0 20px 30px;  min-height:120px;}
div#categorylist_13ct { background:url(../img/bg_topct13.jpg) no-repeat; float:left; margin:20px 0 20px 0;  min-height:120px;}
div#categorylist_14ct { background:url(../img/bg_topct14.jpg) no-repeat; float:left; margin:20px 0 20px 30px;  min-height:120px;}
div#categorylist_15ct { background:url(../img/bg_topct15.jpg) no-repeat; float:left; margin:20px 0 20px 0;  min-height:120px;}




div#categorylist dl{
clear:both;
	width:250px;
	display:inline-block;
	margin:0;
	padding:0;
}


div#categorylist  dt{
	width:250px;
	margin:15px 0 0 10px;
	padding-bottom:5px;
	font-size:1.5em;
	font-weight:bold;
	text-align:left;
}


div#categorylist  dd{
	width:250px;
	margin:5px 0 0 10px;
	padding-bottom:5px;
	font-size:0.9em;
	line-height:1.6em;
	text-align:left;
}

div#categorylist  dd a:link{ text-decoration:none;}
div#categorylist  dd a:hover{ text-decoration:underline;}



div#categorylist .ctpu a:link{ color:#000; padding:2px; background:#FDEB26; font-size:1.2em; line-height:1.8em; font-weight:bold; text-decoration:none;}
div#categorylist .ctpu a:hover{ color:#000; padding:2px; background:#FDEB26; font-size:1.2em;font-weight:bold; text-decoration:none;}
div#categorylist .ctpu a:visited{ color:#000; padding:2px; background:#FDEB26; font-size:1.2em; font-weight:bold; text-decoration:none;}



/* ---------------------------------

	8.カテゴリランキング設定

--------------------------------- */

div#top_categpry_ranking{
	width:250px;
	background : url(../img/bg_side_bottom.jpg) no-repeat bottom;
	padding-bottom:3px;
	margin-top:10px;
}


div#top_categpry_ranking .ttl {background:url(../img/sttl_top_ct_ranking.jpg) no-repeat top; padding-top:50px;}

div#top_categpry_ranking dl { border-bottom:1px solid #e1e1e1; background: url(../img/bg_top_ctranking.jpg) repeat-y;  display:block; height:120px; clear:both;}
div#top_categpry_ranking dl a:hover { background: url(../img/bg_top_ctranking_hover.jpg) repeat-y;  display:block; height:120px; clear:both;}
div#top_categpry_ranking dt{ float:left; width:80px; text-align:center; margin-top:10px;}
div#top_categpry_ranking dd{ float:left; margin:10px 0 0px 5px; width:160px; text-align:left; font-size:0.9em; line-height:1.3em;}


.top_rank_ttl{font-size:14px; font-weight:bold; line-height:1.6em;}






/* ---------------------------------

	9.TOP検索

--------------------------------- */

div#top_search{
width:250px;
height:123px;
display:block;
padding-top:60px;
padding-left:-25px;
background:url(../img/bg_top_search.jpg) no-repeat;
margin:0 0 -30px 0;
}






/* ---------------------------------

	10.新着カテゴリ

--------------------------------- */

.top_newct_box { width:80px; margin:15px 32px 0 0; display:block; float:left; font-size:0.8em; text-align:center; line-height:1.2em;} 
.top_newct_box_r { width:80px; margin:15px 0 0 0; display:block; float:right; font-size:0.8em; text-align:center; line-height:1.2em;} 


.top_newct_box a:hover img{
  opacity:0.6;
  filter: alpha(opacity=60);
}


.top_newct_box_r  a:hover img{
  opacity:0.6;
  filter: alpha(opacity=60);
}