@charset "utf-8";

/*---------------------------------------------------
	Title: index.css
	Description:index.html用CSS定義ファイル
----------------------------------------------------*/

/* IMPORT RESET */

/* IMPORT 12 COLUMN RESPONSIVE GS */
@import url("responsive.gs.12col.css");



/**************************************************************/
/* container */

#container {
	border-left:30px solid #191919;	
	padding:197px 4.3% 0 4.3%;
	font-size:14px;
}


/**************************************************************/
/* main */

#main {
	max-width:920px;
	/*width:100%;*/
	padding:0 0 40px 0;
}

#main h1{
	background: url(../imgs/h1.jpg) no-repeat top left;
	width:512px;
	height:0;
	padding:98px 0 0 0;
	overflow:hidden;
	
}

#main .gnavi{
	margin:20px 0 181px 8px;
	border-left:1px dotted #000;
	overflow:hidden;
}

#main .gnavi li{
	float:left;
	border-right:1px dotted #000;
	padding:0 1px;
}

* html #main .gnavi .profile{
	width:86px;
}

* html #main .gnavi .blog {
	width:43px;
}

* html #main .gnavi .literary{
	width:32px;
}

#main .gnavi li a{
	padding:0 24px;
	height:16px;
	display:block;

}

#main .gnavi li a:hover{
	background: url(../imgs/gnavi_hover_bg.gif) repeat top left;
}

#main .gnavi li a span{
	height:16px;
	display:block;
	cursor:pointer;
}

#main .gnavi .profile a span{
	background: url(../imgs/gnavi_profile.gif) no-repeat top left;
	width:86px;
}

#main .gnavi .blog a span{
	background: url(../imgs/gnavi_blog.gif) no-repeat top left;
	width:43px;
}


#main .gnavi .literary a span{
	background: url(../imgs/gnavi_literary.gif) no-repeat top left;
	width:32px;

}


#main .bnr{
	font-size:16px;
	margin:0 0 78px 0;
}

#main .bnr p{
	margin:0 0 3px 0;	
}

#main .bnr img{
	max-width:100%;
	width:auto;	
}

#main .bnr div{
	margin-bottom:15px;
}

#main h2{
	/*font-family: 'ヒラギノ明朝 Pro W3' ;*/
	font-family: 'ヒラギノ明朝 W3 JIS2004' ;
	border-bottom:2px solid #333333;
	font-size:24px;
	margin:0 0 34px 0;
}

#main .book_list{
	overflow:hidden;
	margin:0 0 53px 0;
}

#main .book_list li{
	/*width:33%;*/
	padding:0 20px;
	box-sizing:border-box;
	/*float:left;*/
	border-right:1px solid #CCCCCC;
	/*background:#fcc;*/
}

#main .book_list li:nth-child(3n) {
	border-right:none;
}

#main .book_list li .image{
	text-align:center;
	margin:0 auto;
	margin-bottom:16px;
	height:204px;
}

#main .book_list li .image img{
	height:100%;
	width:auto;	
}

#main .book_list li h3{
	font-size:16px;
	margin:0 0 7px 0;
}

#main .book_list li h3 a{
	text-decoration:none;
	color:#333;
}


#main .book_list li p{
	margin:0 0 6px 0;	
}



#main .book_list li .small{
	font-size:12px;	
}

#main .book_list li .btn{
	margin:9px 0 0 0;
	display:inline-block;
}

#main .book_list li .btn img{
	width:127px;	
}


@media screen and ( min-width : 768px ) {
	
.no-pc{
	display:none;	
}

}



@media screen and ( max-width : 767px ) {
	
.no-sp{
	display:none;	
}
	
#container {
	border-width:1em;	
	padding:107px 4.3% 0 4.3%;
}

#main {
	
	width:100%;
	padding:0;
}
	
#main h1{
	width:78.75%;
	background: url(../imgs/h1.jpg) no-repeat top left;
	background-size:100% auto;
	height:0;
	padding:15% 0 0 0;
	margin:0 0 0 2.5%;
	overflow:hidden;
}

#main h2{
	margin:0;
}


#main .gnavi{
	margin:16px 0 92px 3.125%;
	border-left:1px dotted #000;
	overflow:hidden;
}

#main .gnavi li a{
	padding:0 16px;
	height:12px;
	display:block;
}

#main .gnavi li a span{
	height:12px;
}

#main .gnavi .profile a span{
	background: url(../imgs/gnavi_profile.gif) no-repeat top left;
	background-size:auto 100%;
	width:64.5px;
}

#main .gnavi .blog a span{
	background: url(../imgs/gnavi_blog.gif) no-repeat top left;
	background-size:auto 100%;
	width:32px;
}


#main .gnavi .literary a span{
	background: url(../imgs/gnavi_literary.gif) no-repeat top left;
	background-size:auto 100%;
	width:27px;

}


#main .bnr{
	font-size:12px;
	margin:0 0 38px 0;
}


#main .book_list{
	overflow:hidden;
	margin:0 0 52px 0;
	font-size:11px;
}

#main .book_list li{
	padding:24px 0.7%;
	box-sizing:border-box;
	border-right:0;
	border-bottom:1px solid #CCCCCC;
}

#main .book_list li:last-child{
	border-bottom:none;
}

#main .book_list li .image{
	text-align:left;
	height:127px;
	float:left;
	margin:0.25em 6% 0 0;
}

#main .book_list li .text{
	overflow:hidden;	
}



#main .book_list li h3{
	font-size:12px;
	margin:0 0 7px 0;
}


#main .book_list li p{
	margin:0 0 4px 0;	
}



#main .book_list li .small{
	font-size:9px;	
}

#main .book_list li .btn{
	margin:9px 0 0 0;
	display:inline-block;
	width:50%;
}

#main .book_list li .btn img{
	max-width:100%;
	width:auto;
}


	
}