@charset "utf-8";
/* CSS Document */

/***************************************

歩行開発研究所　2026

「出版」

     PC　スマホ　共通

****************************************/
/***************************************

配色設定

青	#069
薄水色	#EFF9F5
水色	#CCEDEA
ベージュ#F9F6F0
赤	#E83717
グレー	#404040

****************************************/


/*----------　一覧ページタイトル　------------*/
#title_img{
	background-color:#2A661D;
	background-image:url(../books/img/books_img.png);
	background-repeat:no-repeat;
	background-position:center;
}
/*----------一覧ページ　メインコンテンツ　------------*/
/*本紹介*/
.book_item{
	display:block;
	background-color:#FFF;
	border-radius:20px;
	overflow:hidden;
	text-decoration:none;
}
.book_item:hover{
	background-color:#CCEDEA;
}

#books img{
	box-shadow:3px 3px 8px #bbb;
}
.book_item h3{
	color:#069;
	font-size:1.2em;
}
.book_item p{
	margin-top:1em;
	color:#060606;
}

/*----------各本紹介ページ　タイトル部　------------*/

#book_head{
	align-content:center;
	text-align:center;
	height:90px;
	background-image:url(../books/img/books_img.png);
	background-repeat:no-repeat;
	background-position:center bottom;

}


/*前のページへ戻る*/
.back_page{
	margin-top:1em;
	padding-left:1em;
	background-image:url(../img/arrow_left.png);
	background-repeat:no-repeat;
	background-position:0 center;

}
.back_page a{
	text-decoration:none;
	color:#060606;
}
.back_page a:hover{
	color:#E83717;
}
/*HOME、一覧へ戻る*/

.back_home{
	font-size:0.8em;
	margin-left:2em;
	color:#E83717;

}
.back_home a{
	color:#666;
	text-decoration:none;
}
.back_home a:hover{
	color:#E83717;
}
/*本タイトル部分*/
#book_title{
	text-align:center;
	overflow:hidden;
	padding-bottom:3em;
}
#book_title h1{	
	font-family:mybfont-w4;
	margin:3em 0 3em 0;
	color:#069;
}
#book_title .photo img{
	box-shadow:3px 3px 10px #bbb;
	border:solid 1px #ccc;
}
.auther{
	margin-top:1em;
	font-weight:bold;
}
.isbn{
	margin-top:1em;
	color:#069;
	font-size:0.8em;
}

/*本購買ボタン*/
.koubai{
	margin-top:2em;
	text-align:center;
}
.koubai a{
	display:block;
	margin:auto;

	border:solid 1px #069;
	border-radius:20px;
	padding:0.5em 2em 0.5em 2em;
	text-decoration:none;
	color:#069;
}
.koubai a:hover{
	background-color:#CCEDEA;
}
/*----------各本紹介ページ　詳細部　------------*/
.article{
	padding:2em 0 2em 0;
	margin:auto;
}
.article h3{
	color:#069;
	line-height:2em;
}

.article h4{
	margin-top:2em;
}
.article p{
	line-height:1.6em;
	margin-top:1em;
}
.article ol{
	padding:1em 0 0 2em;
}
.article li{
	line-height:1.6em;
	margin-top:1em;
}

/*リスト書式**/

.books .ul_type1{
	list-style-type:none;
}
.books .ul_type2{
	list-style-type: upper-roman;
	font-weight:bold;
	list-style-position: inside;
/*	font-size:14px;*/
	margin-bottom:2em;
}
.books .ol_type1{
	font-weight:normal;
	margin-left:2em;
}

/****************************

     PC

*****************************/

@media screen and (min-width: 850px){

/*----------一覧ページ　メインコンテンツ　------------*/
.book_item{

	margin:2em;
	padding:2em 3em 2em 2em;

	background-image:url(../img/arrow_right_blue.png);
	background-repeat:no-repeat;
	background-position:right 1.3em center;
}
.book_item:hover{
	background-color:#CCEDEA;
}

#books img{
	float:left;
	margin-right:3em;
}
.book_item h3{
	color:#069;
	font-size:1.2em;
}
.book_item p{
	margin-top:1em;
	color:#060606;
}
/*----------各本紹介ページ　タイトル部　------------*/
#book_title h1{	
	font-size:1.6em;
	letter-spacing:0.1em;
}

#book_title .photo img{
	width:300px;
	height:auto;
}
.koubai a{
	width:50%;
	margin-top:1em;

}

.article{
	width:80%;
}



					}
/****************************

     スマホ

*****************************/

@media screen and (max-width: 849px){

#title_img{
	background-color:#2A661D;
	background-image:url(../books/img/books_img.png);
	background-repeat:no-repeat;
	background-position:60% top;
}
#title_img h1{
	margin-top:5em;
}
/*----------　一覧ページ　メインコンテンツ　------------*/
.book_item{
	margin:1em;
	padding:1em;
}
#books img{
	margin-bottom:1em;
}
.book_item p.photo{
	text-align:center;
}
/*----------各本紹介ページ　タイトル部　------------*/

#book_title h1{
	font-size:1.4em;
	letter-spacing:0em;

}
#book_title .photo{
	padding:1em;
}
#book_title .photo img{
	max-width: 100%;
	width:auto;
	height:auto;
}

.koubai a{
	margin-top:1em;
	width:70%;
}




					}