@charset "shift_jis";

/* =======================================================
	base.css
	*This document validates as CSS level 3
	
	Author: Mamico Tosa
	Last modified: [ 2012/04/12 ]	
	CSS構成: 特集ページ	
	
	-----------------------------------------------------
	■基本骨格
	#contents		970px
	  #main			650px:left
	  #side			220px:right
	
	  #main_728		728px:left
	  #side_222		222px:right
	
======================================================= */

/***************************************
TOC:
=1 : 共通基本項目

=2 : TOPリスティング
=3 : 記事
***************************************/


/* -------------------------------------------------------------	
	　　　　　　1: 基本共通項目	
------------------------------------------------------------- */
#contents { color : #666666 ; }

/* block_650 ----- */
.block_650 {
	width : 650px ;
	overflow : hidden ;
}


/* 特集ナビ ----- */
#sp_nav {
	margin : 30px 0 ;
	width : 650px ;
	overflow : hidden ;
	border-bottom : solid 3px #666666 ;
}
#sp_nav p { float : left ; }
#sp_nav p img { vertical-align : middle ; }
#sp_nav ul { float : right ; }
#sp_nav li {
	display : table-cell ;
	/display : inline ;
	/zoom : 1 ;
	padding-left : 1px ;
}


/* 特集ランキング ----- */
#top_ranking { margin : 20px 0 ; }


/* フリーワード検索 ----- */
#free_search {
	border : solid 5px #3399cc ;
	margin : 20px 0 ;
	width : 640px ;
	overflow : hidden ;
}
#free_search h1 { float : left ; }
#free_search form {
	float : right ;
	width : 350px ;
	margin-top : 23px ;
}
#free_search input[type="search"],
#free_search span input {
	width : 190px ;
	height : 30px ;
}
#free_search img { vertical-align : middle ; }


/* 記事紹介 ---------- */
#magazine {
	margin : 20px 0 ;
	padding : 15px ;
	border : solid 5px #e4e0d6 ;
	width : 610px ;
	overflow : hidden ;
}
#magazine div {
	width : 450px ;
	float : right ;
}
#magazine h1 {
	font-size : 24px ;
	font-size : 2.4rem ;
	font-weight : bold ;
	color : #0099cc ; 
}
#magazine h2 {
	background : url(../img/border_01.gif) repeat-x ;
	margin : 5px 0 ;
	padding-top : 15px ;
	color : #669900 ;
	font-size : 14px ;
	font-size : 1.4rem ;
	font-weight : bold ;
}
#magazine p { line-height : 1.5 ; }
#magazine dl {
	background : #f5f3ef ;
	padding : 10px ;
	margin-top : 10px ;
	line-height : 1.5 ;
}
#magazine dt {
	height : 29px ;
	position : relative ;
}
#magazine dd { margin : -30px 0 0 90px ; }
#magazine div + img {
	padding : 1px ;
	border : solid 1px #cccccc ;
}

/* 他の特集を見る ---------- */
.other_sp {
	margin : -10px 0 20px ;
	text-align : right ;
}
.other_sp a {
	padding-left : 18px ;
	background : url(../img/arrow-trans.png) left -99px no-repeat ;
}


/* サイド ブログバナー ----- */
#s_blog { margin : 15px 0 ; }
#s_blog p { margin-top : 5px ; }


/*													end:基本共通項目
------------------------------------------------------------- */




/* -------------------------------------------------------------	
	　　　　　　2: TOPリスティング
------------------------------------------------------------- */
/* 特集 大 ---------- */
#sp_large {
	width : 660px ;
	margin : 20px -10px 20px 0 ;
	overflow : hidden ;
}
#sp_large li {
	width : 320px ;
	float : left ;
	line-height : 1.3 ;
	margin : 0 10px 0 0 ;
}
#sp_large a { text-decoration : none ; }
#sp_large p {
	padding-left : 13px ;
	background : url(../img/arrow-trans.png) left 4px no-repeat ;
}
#sp_large a p { color : #333333 ; }
#sp_large a:hover p { text-decoration : underline ; }

#sp_large .new:after {
	content : "NEW" ;
	color : #ffffff ;
	background : #3399cc ;
	font-size : 10px ;
	width : 2.5em ;
	display : inline-block ;
	text-align : center ;
	text-decoration : none ;
	margin-left : 2px ;
}


/* リスティング --------- */
/* paging --- */
.paging {
	overflow : hidden ;
	/zoom : 1 ;
	margin : 15px 0 5px ;
}
	/* BORDER */
	.paging {
		background : url(../img/border_01.gif) left top repeat-x ;
		padding-top : 10px ;
	}
	.paging_bottom {
		background : url(../img/border_01.gif) left bottom repeat-x ;
		padding : 0 0 10px ;
	}
	
.paging p {
	float : left ;
	width : 200px ;
}
.paging strong {
	font-size : 16px ;
	font-size : 1.6rem ;
	margin-right : 3px ;
}
.paging ul { float : right ; }
.paging li {
	display : inline ;
	padding : 0 0 0 5px ;
	line-height : 20px ;
	background : url(../img/border_02.gif) left center no-repeat ;
}
.paging li:first-of-type,
.paging li:last-of-type,
.paging li:nth-last-of-type(2),
.paging li:nth-of-type(2),
.paging li:nth-of-type(3) {
	background : none ;
	padding-left : 2px ;
}


/* sp_list */
#sp_list { margin : 20px 0 ; }
#listing {
	margin : 20px -10px 5px 0 ;
	letter-spacing : -0.40em ;
}
#listing li {
	letter-spacing : normal ;
	vertical-align : top ;
	display : inline-block ;
	/display : inline ;
	/zoom : 1 ;
	width : 210px ;
	margin : 0 10px 15px 0 ;
	line-height : 1.3 ;
}
#listing a { text-decoration : none ; }
#listing p {
	margin-top : 2px ;
	padding-left : 13px ;
	color : #333333 ;
	background : url(../img/arrow-trans.png) left 1px no-repeat ;
}
#listing a:hover p { text-decoration : underline ; }

/*													end:TOPリスティング
------------------------------------------------------------- */




/* -------------------------------------------------------------	
	　　　　　　3: 記事
------------------------------------------------------------- */
/* タイトル画像エリア ---------- */
#sp_hgroup {}
#sp_hgroup h2 { margin : 10px 0 0 ; }


/* 特集記事エリア ---------- */
#sp_block {
	margin : 20px 0 ;
	color : #98855f ;
	line-height : 1.5 ;
}
#sp_block h1 {
	background : url(../img/arrow-trans.png) left -48px no-repeat ;
	padding : 0 0 3px 20px ;
	margin-bottom : 15px ;
	border-bottom : solid 1px #cccccc ;
}

#sp_block article {
	margin : 20px 0 ;
	width : 100% ;
	overflow : hidden ;
}
#sp_block h2 { margin : 0.5em 0 ; } 
strong.title {
	font-size : 14px ;
	font-size : 1.4rem ;
	color : #669900 ;
	display : block ;
	margin : 0.5em 0 ;
}
.sp_bt {
	margin : 0.5em 0 0 ;
	background : #ffffff url(../img/border_01.gif) left top repeat-x ;
	padding-top : 10px ;
	text-align : center ;
}

/* パターン1・2 共通 --- */
.pattern_01 div,
.pattern_02 div { width : 400px ; }
.pattern_01 .sub_con,
.pattern_02 .sub_con { width : 230px ; }
.pattern_01 .sub_con li,
.pattern_02 .sub_con li { margin-bottom : 1em ; }
.pattern_01 .sub_con p,
.pattern_02 .sub_con p { margin-top : 0.5em ; }

/* パターン1 */
.pattern_01 div { float : left ; }
.pattern_01 .sub_con { float : right ; }

/* パターン2 */
.pattern_02 div { float : right ; }
.pattern_02 .sub_con { float : left ; }


/* パターン3 */
#sp_block article.pattern_03 {
	width : 670px ;
	margin-right : -20px ;
}
.pattern_03 ul{ letter-spacing : -0.40em ; }
.pattern_03 li {
	letter-spacing : normal ;
	vertical-align : top ;
	width : 315px ;
	margin : 0 20px 10px 0 ;
	display : inline-block ;
	/display : inline ;
	/zoom : 1 ;
}


/* パターン4 */
#sp_block article.pattern_04 {
	width : 666px ;
	margin-right : -18px ;
}
.pattern_04 ul{ letter-spacing : -0.40em ; }
.pattern_04 li {
	letter-spacing : normal ;
	vertical-align : top ;
	width : 204px ;
	margin : 0 18px 10px 0 ;
	display : inline-block ;
	/display : inline ;
	/zoom : 1 ;
}


/* パターン5・6 共通 --- */
.pattern_05 div,
.pattern_06 div { width : 220px ; }
.pattern_05 ul,
.pattern_06 ul { width : 410px ; }
.pattern_05 li,
.pattern_06 li {
	display : table-cell ;
	/display : inline ;
	/zoom : 1 ;
	padding-right : 1px ;
}

/* パターン5 */
.pattern_05 div { float : right ; }
.pattern_05 ul { float : left ; }

/* パターン6 */
.pattern_06 div { float : left ; }
.pattern_06 ul { float : right ; }


/* パターン7 */
.pattern_07 p { margin : 1em 0 0 ; }


/* パターン8・9 共通 --- */
.pattern_08 div,
.pattern_09 div { width : 230px ; }
.pattern_08 span,
.pattern_09 span { display : block ; }

/* パターン8 */
.pattern_08 div { float : right ; }
.pattern_08 span { float : left ; }

/* パターン9 */
.pattern_09 div { float : left ; }
.pattern_09 span { float : right ; }


/* パターン10 */
.pattern_10 {
	background : #f4ffdf ;
	padding : 10px ;
	width : 630px !important ;
}
.pattern_10 p:first-child {
	heigt : 30px ;
	line-height : 30px ;
	background : url(../img/p_10.gif) left top no-repeat ;
	font-size : 14px ;
	font-size : 1.4rem ;
	font-weight : bold ;
	color : #ffffff ;
	padding : 0 10px ;
	margin-bottom : 15px ;
}
#sp_block .pattern_10 h1 {
	background : none ;
	border : none ;
	padding : 0 ;
	margin-bottom : 0.5em ;
}
.pattern_10 div {
	width : 420px ;
	float : left ;
}
.pattern_10 span { float : right ; }


/* パターン11 */
.pattern_11 {
	width : 650px ;
	margin : 20px 0 ;
	background : #cccccc ;
}
.pattern_11 th,
.pattern_11 td {
	vertical-align : top ;
	padding : 5px 10px ;
	text-align : left ;
}
.pattern_11 th {
	width : 180px ;
	background : #3b5998 ;
	color : #ffffff ;
}
.pattern_11 td { color : #666666 ; }
.pattern_11 tr:nth-child(odd) td { background : #ffffe8 ; } /* 奇数 */
.pattern_11 tr:nth-child(even) td { background : #fffff0 ; } /* 偶数 */

/*													end:記事
------------------------------------------------------------- */