@charset 'UTF-8';

/** |READ ME| **************************************************************************************

detail_pc.css
Ver.201802

----------------------------------------------------------------------------------------------------

01. 書籍ヘッダ
0x. テキスト
0x. テーブル
0x. 書籍検索
0x. レコメンド

************************************************************************************** |READ ME| **/





/** |01. 書籍ヘッダ| >> *************************************************************** >> START **/


.contents .body .header {
	position: relative;
	width: 1080px;
}


	/** [書影] >> +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ >> START **/

	.contents .body .header .cover {
		background-color: #f4f4f5;
		float: left;
		height: 320px;
		overflow: hidden;
		position: relative;
		width: 380px;
	}

		.contents .body .header .cover img {
			bottom: 0;
			height: auto;
			left: 0;
			margin: auto;
			max-height: 280px;
			position: absolute;
			right: 0;
			top: 0;
			width: auto;
		}


	/** [書籍情報] >> +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ >> START **/

	.contents .body .header .label {
		float: right;
		width: 346px;
	}


		/* シェア */
		.contents .body .header .label .share {
			font-size: 0;
			text-align: right;
		}

			.contents .body .header .label .share li {
				display: inline-block;
				padding-left: 10px;
			}

				.contents .body .header .label .share a {
					background: no-repeat 50% 50%;
					background-size: 30px 25px;
					display: block;
					height: 25px;
					overflow: hidden;
					text-indent: 100%;
					width: 30px;
				}

				.contents .body .header .label .share a:hover {opacity: 0.6;}

				.contents .body .header .label .share .fb {background-image: url(/common/img/bdy_ico_facebook.gif);}
				.contents .body .header .label .share .tw {background-image: url(/common/img/bdy_ico_twitter.gif);}
				.contents .body .header .label .share .ln {background-image: url(/common/img/bdy_ico_line.gif);}
				.contents .body .header .label .share .ml {background-image: url(/common/img/bdy_ico_mail.gif);}


		/* タイプ */
		.contents .body .header .label .type {
			font-size: 14px;
			padding-top: 28px;
		}


		/* タイトル */
		.contents .body .header .label .title {
			font-size: 20px;
			line-height: 1.2;
			padding-top: 16px;
		}


		/* 著者 */
		.contents .body .header .label .author {
			font-size: 0;
			padding-top: 14px;
		}

			.contents .body .header .label .author li {
				display: inline-block;
				font-size: 14px;
				line-height: 1.2;
			}

			.contents .body .header .label .author li::after {content: '、';}

			.contents .body .header .label .author li:last-of-type::after {content: normal;}


		/* 言語 */
		.contents .body .header .label .language {
			font-size: 0;
			padding-top: 16px;
		}

			.contents .body .header .label .language li {
				background-color: #7f8283;
				color: #fff;
				display: inline-block;
				font-size: 14px;
				margin: 6px 6px 0 0;
				padding: 8px 12px 6px;
			}


		/* その他情報 */
		.contents .body .header .label .data {margin-top: 22px;}

			.contents .body .header .label .data th,
			.contents .body .header .label .data td {
				line-height: 1.88;
				vertical-align: top;
			}

			.contents .body .header .label .data th {
				font-family: 'UD新ゴ L', sans-serif;
				font-weight: normal;
				padding-right: 1em;
				text-align: left;
				white-space: nowrap;
			}

			.contents .body .header .label .data td {width: 100%;}


		/* ISBN */
		.contents .body .header .label .isbn {font-size: 0;}

			.contents .body .header .label .isbn dt,
			.contents .body .header .label .isbn dd {
				display: inline-block;
				font-size: 16px;
				line-height: 1.88;
			}

				.contents .body .header .label .isbn dt::after {content: '：';}


		/* 発行日 */
		.contents .body .header .label .issue {line-height: 1.88;}


		/* イベント */
		.contents .body .header .label .event {line-height: 1.88;}


	/** [書籍情報] >> +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ >> START **/

	.contents .body .header .status {
		bottom: 0;
		left: 0;
		position: relative;
		text-align: center;
		width: 380px;
	}


		/* 在庫あり */
		.contents .body .header .status .store {font-size: 0;}

			.contents .body .header .status .store li {
				display: inline-block;
				font-size: 14px;
				padding-top: 14px;
				width: 190px;
			}

				.contents .body .header .status .store a,
				.contents .body .header .status .store .nis {
					border: 1px solid;
					-moz-box-sizing: border-box;
					-webkit-box-sizing: border-box;
					box-sizing: border-box;
					display: block;
					padding: 6px 0;
					text-align: center;
					width: 184px;
					text-decoration: none;
				}

				.contents .body .header .status .store a {
					border-color: #4aa6c3;
					color: #4aa6c3;
				}

				.contents .body .header .status .store .nis {
					border-color: #d4d5d6;
					color: #7f8283;
				}

					.contents .body .header .status .store .nis span {
						font-size: 11px;
						letter-spacing: -0.1em;
					}

				.contents .body .header .status .store li:nth-of-type(2n) a,
				.contents .body .header .status .store li:nth-of-type(2n) span {margin-left: auto;}

				.contents .body .header .status .store a:hover {
					background-color: #4aa6c3;
					color: #fff;
				}


		/* 近日発売/在庫なし */
		.contents .body .header .status .coming,
		.contents .body .header .status .soldout {
			border: 1px solid #d4d5d6;
			color: #7f8283;
			display: inline-block;
			margin-top: 14px;
			padding: 6px;
			width: 184px;
		}


/** |01. 書籍ヘッダ| << ***************************************************************** << END **/





/** |0x. テキスト| >> ***************************************************************** >> START **/


.contents .body .text {
	border-top: 1px solid #d4d5d6;
	margin-top: 42px;
}

	.contents .body .text p {
		line-height: 1.88;
		padding-top: 36px;
	}


/** |0x. テキスト| << ******************************************************************* << END **/





/** |0x. テーブル| >> ***************************************************************** >> START **/


.contents .body .table {margin-top: 36px;}

	.contents .body .table th,
	.contents .body .table td {
		line-height: 1.88;
		vertical-align: top;
	}

	.contents .body .table th {
		font-weight: normal;
		text-align: left;
	}

	.contents .body .table td {padding-left: 1em;}


/** |0x. テーブル| << ******************************************************************* << END **/





/** |0x. 書籍検索| >> ***************************************************************** >> START **/


.contents .body .search {
	border-top: 1px solid #d4d5d6;
	margin-top: 36px;
}

	.contents .body .search .method {
		font-size: 0;
		padding-top: 44px;
	}

	.contents .body .search .method:first-of-type {padding-top: 34px;}

		.contents .body .search .method dt,
		.contents .body .search .method dd {font-size: 16px;}

		.contents .body .search .method dt {padding-bottom: 6px;}

		.contents .body .search .method dd {
			display: inline-block;
			padding-top: 8px;
		}

		.contents .body .search .method dd::after {content: '、';}
		.contents .body .search .method dd:last-of-type::after {content: normal;}


/** |0x. 書籍検索| << ******************************************************************* << END **/





/** |0x. レコメンド| >> *************************************************************** >> START **/


.contents .body .recommend {
	border-top: 1px solid #d4d5d6;
	margin-top: 36px;
	padding-top: 44px;
	width: 1080px;
}

	.contents .body .recommend .title {
		font-size: 18px;
		padding-bottom: 10px;
	}

	.contents .body .recommend .candidate {
		float: left;
		margin-left: 32px;
		padding-top: 20px;
		width: 246px;
	}

	.contents .body .recommend .candidate:first-of-type {margin-left: 0;}

		.contents .body .recommend .candidate dt {
			background-color: #f4f4f5;
			height: 160px;
			text-align: center;
			width: 246px;
		}

			.contents .body .recommend .candidate dt a {
				display: block;
				height: 100%;
				position: relative;
			}

				.contents .body .recommend .candidate dt img {
					bottom: 0;
					height: auto;
					left: 0;
					margin: auto;
					max-height: 140px;
					position: absolute;
					right: 0;
					top: 0;
					width: auto;
				}

		.contents .body .recommend .candidate dd {
			line-height: 1.88;
			padding-top: 10px;
		}


/** |0x. レコメンド| << ***************************************************************** << END **/