@charaset "UTF-8";
/*---------------------
　骨格2 640系
---------------------*/
#main4{
width:820px;
margin-left:10px;
float:left;/*これを入れないとfooterが重なる*/
}
*html #main4{display:inline;}/*IE6バグ用*/


/*---------------------
　waku640系　
---------------------*/

#main4 #waku_top{
		width:820px;
		height:25px;
		background:url(../img/waku/waku_top4.png) no-repeat;
		margin:0px;
}


/*waku_mid設定*/
#main4 #waku_mid{
		width:820px;
		height:auto;
		margin:0px;
}

#main4 #waku_mid{
		background:url(../img/waku/waku_mid4.png) repeat-y;
}
#main4 #waku_btm{
width:820px;
height:20px;
margin-top: 0;
margin-right: 0;
margin-bottom: 10px;
margin-left: 0;
}

#main4 #waku_btm{
background:url(../img/waku/waku_btm4.png) no-repeat;
}
/*---------------------
　H2部　
---------------------*/

.waku_waku{ 
	width:auto;
	height:40px;
	margin:0px 30px 20px 25px;
	padding:3px;
	color:#fff;
	text-align:center;
}

#main4 #waku_mid h2 {
	position:relative;
}

#waku_mid .waku_waku h2{
		width:auto;
		height:37px;
		line-height:42px;
		color:#FFF;
		text-align:center;
		border:solid 1px #fff;
		font-size:20px;
		font-weight:normal;
		background:url(../img/h2/deco01ww.png) no-repeat 1px 1px;
}

#waku_mid h2 a{
	color:#fff;
}

/* IE6-7用上書き指定 */
*html #waku_mid h2 {
		line-height:45px;
}
*:first-child+html #waku_mid h2{padding-top:2px;} /*IE7*/


/*---------------------
　H3部　
---------------------*/

#waku_mid section h3{
		margin:0px 20px 10px 25px;
		font-size:18px;
		font-weight:normal;
		color:firebrick;
		background:url(../img/list/shiori.png) no-repeat left -50%;
		padding-left:38px;
/*	↓結構綺麗です。どこかで使えるかも
	background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#fbe7e9))!important;
	linear-gradient
	background:-webkit-gradient(linear,left top,left bottom,from(#fff),to(#fbe7e9))!important;
	background:-webkit-linear-gradient(top, #fff, #fbe7e9)!important;
	background:   -moz-linear-gradient(top, #fff, #fbe7e9);
	background:     -o-linear-gradient(top, #fff, #fbe7e9);
	background:        linear-gradient(top, #fff, #fbe7e9);
		
*/
}

/*---------------------
　img_cent系　
---------------------*/
#waku_mid img{
	display:block;
}

img.cent{
margin-top: 0px;
margin-right: 30px;
margin-bottom: 5px;
margin-left: 25px;
}

p.img_cap{
	font-size:12px;
	margin:0px 25px 10px 20px;
	text-align:right;
	color:#666;
	line-height:16px;
}

/*---------------------
　H4系　
---------------------*/

#main4 #waku_mid h4 a{
		margin:0px 20px 10px 25px;
		font-size:16px;
		font-weight:normal;
		}		


/*---------------------
　p系　
---------------------*/
p{
	margin:0px 30px 0px 25px;
	padding-bottom:10px;
	line-height:1.8em;
}


#main_boks #waku_mid p:first-child{
		padding-top:15px!important;
		}


#main4 #waku_mid p.tyu{
	font-size:12px;
	text-indent: -1.0rem;
	padding-left: 1.0rem;
	font-size: 12px;
	font-size: 1.2rem;
	color: #999;
	padding-bottom: 5px;
}

/*---------------------
　waku_nai_list（w590=main2）系　
---------------------*/
#waku_mid li{
	list-style-type: none;
	}	

#waku_mid li a{
	color:forestgreen;
	padding-left:14px;
	font-size:14px;
	margin:0px 0px 0px 25px;
	display:block;
	text-decoration:none;
	background-image:url(../img/box_list_grn.gif);
	background-repeat:no-repeat;
	background-position: 0px 4px;
	height:20px;
	line-height:20px;
	}

#waku_mid li a:hover{
	color:#ff0000;
	background-image:url(../img/box_list_red.gif);		
	}

.sdy_mnu {margin-bottom:10px;}
.sdy_mnu li{width:auto;float:left;margin-bottom:10px;}





/*---------------------
　イメージボックス
　(w640では、左右のマージが違うためにここに作成)
---------------------*/

#waku_mid .img_box_r{
	margin:5px 30px 10px 10px;/*topの5pxは右のpとのバランス*/
	float:right;
	width:auto;
}

#main_boks #waku_mid .img_box_l{
	margin:0px 20px 10px 20px;/*topの5pxは右のpとのバランス*/
	float:left;
	width:auto;
}


/*---------------------
　水平線(コンテンツページ用)
---------------------*/
hr{
border-style:dashed;
border-width:1px;
margin:5px 25px 15px 20px;
border-color: #fff #fff #666 #fff;
background-color:#fff;
}



/*---------------------
　書籍購入ボタンNEO
---------------------*/

.bok_shops{
	width:auto;
	height:auto;
	position: relative;
	overflow: hidden;
	//border:solid 1px #999;
	//background-color:#efefef;
}
.bok_shops .wp{
	height:auto;
	float: left;
	position: relative;
	left: 55%;
	width:auto;
}
.bok_shops .wp div{
	width:100px;height:30px;
	margin-right:7px;
	position: relative;
	left: -50%;
	float: left;
}
.wp div a{
	display:block;
	width:100px;height:30px;
}
.wp div a:hover{text-decoration:none;}
.bok_shops .wp div:last-child{
	margin-right:0px;
}


.btn_amazon a		{background:url(../books/img/btn/amazon/m/off.png) no-repeat;}
.btn_amazon a:hover	{background:url(../books/img/btn/amazon/m/on.png) no-repeat;}

.btn_kino a			{background:url(../books/img/btn/kino/m/off.png) no-repeat;}
.btn_kino a:hover	{background:url(../books/img/btn/kino/m/on.png) no-repeat;}
.btn_kino img		{display:inline !important;}			

.btn_e-hon a		{background:url(../books/img/btn/e-hon/m/off.png) no-repeat;}
.btn_e-hon a:hover	{background:url(../books/img/btn/e-hon/m/on.png) no-repeat;}

.btn_j-pub a		{background:url(../books/img/btn/j-pub/m/off.png) no-repeat;}
.btn_j-pub a:hover	{background:url(../books/img/btn/j-pub/m/on.png) no-repeat;}

.btn_maruzen a		{background:url(../books/img/btn/maruzen/m/off.png) no-repeat;}
.btn_maruzen a:hover	{background:url(../books/img/btn/maruzen/m/on.png) no-repeat;}

.btn_honto a		{background:url(../books/img/btn/honto/m/off.png) no-repeat;}
.btn_honto a:hover	{background:url(../books/img/btn/honto/m/on.png) no-repeat;}
.btn_honto_ng a		{background:url(../books/img/btn/honto/m/ng.png) no-repeat;}


/*---------------------
　ブックセル
---------------------*/
.bok_cel{
	width:auto;
	height:auto;
	border:solid 1px #ccc;
	margin:10px 25px;
}

/*ie6用*/ 
*html .bok_cel{
	height:410px;
}

/*ie6 ie7用*/ 
.bok_cel{
	/height:410px;}
	
.cel_l{
	
width:293px;
height:80px;
border-right:dashed 1px #ccc;
border-bottom:dashed 1px #ccc;
float:left;

}

.cel_r{
width:293px;
height:80px;
border-bottom:dashed 1px #ccc;
float:right;
}
.cel_l:nth-last-child(2) {border-bottom:none;}
.cel_r:last-child{border-bottom:none;}

.bok_icon{display:block;margin:5px !important;float:left;}
#main4 #waku_mid section .bok_cel h3{
	font-weight:normal;
	color:forestgreen!important;
	margin:5px 0px 0px 65px !important;
	padding-left:0px;
	line-height:20px;
}
#waku_mid .bok_cel p{
	font-size:12px !important;
	color:#666;
	margin:0px 5px 0px 65px !important;
	line-height:18px;
}
/*↓上記のbok_iconとは違うので注意！*/
.bok_icn{
	float:left;
	margin-left:20px;
	margin-right:7px;
}

.cel_l a,.cel_r a{display:block;}
.cel_l a:hover,.cel_r a:hover{text-decoration:none;}

/*---------------------
　ダブル写真
---------------------*/
#waku_mid .img_dbl{
	margin:10px 30px 10px 25px;	/*imgのborder挿入に伴う調整あり*/

}
#waku_mid .img_dbl img,#waku_mid .img_dbl p{
	float:left;
}
#waku_mid .img_dbl img{
	border:solid 1px #ccc;
}

#waku_mid .img_dbl p{
	color:#666;
	text-align:left;
	width:287px;
	margin:0px!important;
}
#waku_mid .img_dbl .r{
	margin-left:11px!important;/*位置をここにしないとpに効かない*/
}

/*---------------------
　3つ写真（こっちを採用）
---------------------*/
#waku_mid div.pict_3{
	width:600px;/*大きめに設定（590だと落ちる）*/
	margin:10px auto;height:auto;
}

#waku_mid div.pict_3 div
{width:190px;float:left;margin:0 10px 3px 0!important;}

#waku_mid div.pict_3 p{
	margin:5px!important;
	font-size:12px!important;
	line-height:16px!important;
}
#waku_mid .pict_3 img{
	border:solid 1px #ccc;
}


/*---------------------
　4つ写真
---------------------*/
#waku_mid div.pict_4
{width:589px;margin:10px auto;height:auto;}

#waku_mid div.pict_4 div
{width:120px;float:left;margin:0 24px 3px 0!important;}

#waku_mid div.pict_4 p{
	margin:3px!important;
	font-size:12px!important;
	line-height:16px!important;
}


/*---------------------
　X枚の写真（pict_x）
---------------------*/
#waku_mid div.pict_x{
	width:620px;
	margin:10px auto 10px 20px;;
	height:auto;
}

#waku_mid div.pict_x div{
	float:left;
	margin:0 10px 10px 0;
}


#waku_mid div.pict_x img{
	border:solid 1px #ccc;
}

#waku_mid div.pict_x p{
	margin:3px!important;
	font-size:12px!important;
	line-height:16px!important;
}

#waku_mid div.x3 div p{
	width:190px;
}
#waku_mid div.x4 div p{
	width:140px;
}
#waku_mid div.x3 div:nth-child(3n){
	margin-right:0px;
}
#waku_mid div.x4 div:nth-child(4n){
	margin-right:0px;
}


/*---------------------
　記事下のおすすめ書籍
---------------------*/

div#bok_recom{
	width:535px;
	height:120px;
	margin:0px auto;
}

#bok_recom div{
	float:left;
	height:115px;
}


#bok_recom .bok{
	width:82px;
	margin:0px;
}
#bok_recom .bok img{
	border:solid 1px #999;
}
#bok_recom .cap{
	width:175px;
	margin-left:8px;
	font-size:12px;
	line-height:16px;
	color:#666;
}
#bok_recom .cap a{
	font-size:14px;
	display:block;
	line-height:20px;
	}


#bok_recom .spc{
	width:5px;
}
/*---------------------
　Neo_table
---------------------*/
.neo_table{
border:solid 1px #999;
border-collapse:collapse;
border-spacing:1px;
/*↑IE未対応*/
/*background-color:#efefef;*/
margin-left:25px;
margin-right:30px;
}

.neo_table thead th{
	text-align:center;color:#333;
}
.neo_table th{
	padding:3px;
	border-right:solid 1px #999;
	border-bottom:solid 1px #999;
	background-color:#efefef;
	font-weight:normal;
	font-size:14px;
	text-align:left;
	background-color:beige;
color:#333;
}

.neo_table td{
	padding:3px;
	border-top:solid 1px #ccc;
	border-right:solid 1px #999;
	border-bottom:solid 1px #999;
	border-left:solid 1px #ccc;
	background-color:#FFF;
	font-size:14px;
color:#333;
}
.neo_table caption{
	text-align:left;
	font-size:14px;
	color:forestgreen;
}

.sep{border-collapse:separate;}
/*↑立体感を出したい場合*/

.neo_table td p.tyu{
	margin: 0px 7px 0px 7px;
	padding-bottom: 10px;
	line-height: 1.8em;
	text-indent:-1em;
	padding-left:1em;
}


