﻿/* ゲームブック用ページのスタイルシートを記述します */
/* マージン（ボックスの外側の余白）・パティング（ボックスの内側の余白） */


/* ---------------------------- */
/* ▼各出版社　掲載作品リスト　 */
/* ---------------------------- */

div.BookList {		/* 左右に分けるflexコンテナ */
	display: flex;
	flex-flow: row-reverse nowrap;
	width: 710px;

	margin: 0px -5px;
	padding: 0px;
	overflow: hidden;

	background-color: #FFFFFF;
}

div.TitleList {		/* 右側のflexアイテム（タイトルリスト） */
	border-left: 5px solid #FFFFFF;

	width: 445px;

	margin-right: 0px;
	padding-left: 10px;
	overflow: hidden;

	background-color: #FFFFFF;
}
div.TitleList p {	/* リスト内　個々の作品タイトル表示枠 */
	border-left: 5px solid #CCCCCC;

	width: 405px;

	margin: 5px 0px 10px auto;
	padding-left: 5px;
	overflow: hidden;

	background-color: #FFFFFF;
}
div.TitleList p[class="No"] {	/* リスト内　個々の作品タイトル表示枠 所有していない物 文字色薄 */
	color: #888888;
}
/*　#C0F0FC;薄青　#C0F0CC;薄緑　#FCF000;黄色　#F8C8FF;薄桃　#C8C8FF;薄紫　#FCC00C;橙　*/
div.TitleList p[class="1"] {	/* リスト内　個々の作品タイトル表示枠 シリーズ色分け１（薄桃）*/
	border-color: #F0C0F0;
}
div.TitleList p[class="2"] {	/* リスト内　個々の作品タイトル表示枠 シリーズ色分け２ （緑）*/
	border-color: #80F080;
}
div.TitleList p[class="3"] {	/* リスト内　個々の作品タイトル表示枠 シリーズ色分け３ （薄橙） */
	border-color: #FFC08F;
}
div.TitleList p[class="4"] {	/* リスト内　個々の作品タイトル表示枠 シリーズ色分け４ （薄紫） */
	border-color: #C8C8FF;
}

div.TitleList p span {	/* リスト内　個々の作品タイトル表示枠　英文表示領域 */
	margin-left: 5px;
	font-style: italic;
	font-size: 9pt; line-height: 1.5em;
}


div.content {		/* 左側のflexアイテム（出版社＞シリーズ一覧） */
	width: 250px;
	margin: 0px;
	padding: 0px;
	border-right: 0px solid #FFFFFF;
	overflow: hidden;

	background-color: #FFFCFC;
}
div.content ul {	/* 左側のflexアイテム（出版社＞シリーズ一覧　親リスト設定） */
	margin: 0;
	padding: 0;
	padding-left: 5px;
	border: none;
	background: none;
	font-weight: normal;
	list-style-type: "■";
	
}
div.content > ul > li {	/* 左側のflexアイテム（出版社＞シリーズ一覧　親リスト設定） */
	margin-top: 5px;
}
div.content li ul {	/* 左側のflexアイテム（出版社＞シリーズ一覧　子リスト設定） */
	list-style-type: "┗ ";
	padding-left: 10px;
	
}


/* ---------------------------- */
/* ▼個々の作品紹介　基本情報枠 */
/* ---------------------------- */

table.BasicList {
	border: 0px #000000 solid;
	border-collapse: collapse;
	border-spacing: 0px;
	background-color: #FFFFFF;

	margin: 0px; padding: 0px;
	margin-left:auto; margin-right: auto;

}
/* ------------------------Ver.1　上部にカバー前面、下に一覧表---- */
/*
table.BasicList tr {
	height: 40px;
}
table.BasicList tr:nth-of-type(1)  {
	height: 270px;
}
table.BasicList tr:nth-of-type(1) td {
	border: 0px #FFFFFF solid;
	text-align: center;
}
table.BasicList tr:nth-of-type(1) td img {
	height: 320px;
}

table.BasicList tr td {
	border: 1px #000000 solid;
	background-color: #FFFFFF;

	width: 164px;	※150くらいでもイイ感じ

	margin: 0px; padding: 5px;
	
	font-size: 10pt; line-height: 1.5em;
	text-align: left;
}
table.BasicList tr td:nth-of-type(3) {
	width: 128px;
}
table.BasicList tr td:nth-of-type(4) {
	width: 200px;
}

table.BasicList tr td[colspan="4"] > span {
	margin-left: 5px;
	font-size: 10pt; line-height: 1.5em;
	font-style: italic;
}
table.BasicList tr:last-of-type {
	height: 1px;
}
table.BasicList tr:last-of-type td {
	border: 1px #FFFFFF solid;
	text-align: center;
	height: 1px;
}
*/
/* ------------------------Ver.1　ここまで---- */


/* ------------------------Ver.2　左ににカバー表紙、右に一覧表---- */
table.BasicList tr {
	height: 15px;
}
table.BasicList tr td {		/*　１セルの幅　*/
	border: 0px #888888 solid;
	border-left: 1px #888888 solid;
	background-color: #FFFFFF;

	width: 440px;	/*　426まで　*/

	margin: 0px; padding: 0px;
	padding-left: 10px;

	font-size: 10pt; line-height: 1.2em;
	text-align: left;
}

table.BasicList tr:nth-of-type(1) td:nth-of-type(1) {
	width: 235px;
	padding: 4px;
	padding-right: 10px;
	border: 0px #000000 solid;
	text-align: center;
	vertical-align: top;
}
table.BasicList tr:nth-of-type(1) td img {
	height: 320px;
	border: 1px #cccccc solid;
	
}
table.BasicList tr:nth-of-type(n+4) td {
	font-size: 9pt; line-height: 1.2em;
}

table.BasicList tr td span {
	margin-left: 2ex;
	font-size: 9pt; line-height: 1.5em;
	font-style: italic;
}
table.BasicList tr td span.sub {
	margin-left: 0px;
	font-size: 9pt; line-height: 1.2em;
}

/* ------------------------Ver.2　ここまで---- */


/* ▼個々の作品紹介　攻略・コメント情報枠 */



/* ---------------------------- */
/* ▼個々の作品紹介　ギャラリー */
/* ---------------------------- */

figure {
	background-color: #FFFFFF;
	margin: 0px; padding: 0px;
	margin-left: auto; margin-right: auto;
	text-align: center;
}
figcaption {
	text-align: center;
}
figure img {


}

/* ---------------------------- */
/* ▼個々の作品紹介　謎解 */
/* ---------------------------- */

div.Riddle {
	border: 0px #000000 solid;
	margin: 5px; padding: 0px;
	margin-left: 10px;
	clear: both;
}
div.Riddle > img{
	border: 0px #000000 solid;
	margin: 0px; padding-right: 10px;
	float: left;
}
div.Riddle > a > img{
	border: 0px #000000 solid;
	margin: 0px; padding-right: 10px;
	float: left;
}
div.Riddle div{
	background-color: #FFFFFF;

}
details > div > img:nth-of-type(1){
	border: 0px #000000 solid;
	margin: 0px; padding-right: 10px;
	float: left;
}

/* ---------------------------- */
/* ▼個々の作品紹介　フローチャート */
/* ---------------------------- */

div.grid-FlowArea {
	display: grid;
	grid-template-columns: 300px 100px 300px;	/* 列の幅 */
	grid-template-rows: 500px 15px 500px;	/* 行の幅（高さ） */
	grid-gap: 0px;

	border: 0px #000000 solid;

	margin: 0px; padding: 0px;
	margin-top: 15px;
	font-size: 10pt; line-height: 1.5em;

}
/* 高さstart / 幅start / 高さend / 幅end の順 */

div.grid-FlowArea > div {

	font-size: 10pt; line-height: 1.5em;

}

div.grid-FlowArea div div {
	border: 2px #000000 solid;
	background-color: #F0FFF0;

	margin: 0px; padding: 0px;
	padding-top: 3px; padding-bottom: 3px;

	width: 268px;

	text-align: center;
}
div.grid-FlowArea div div div {
	border: 1px #000000 solid;
	background-color: #FFFFFF;

	margin: 3px; padding: 5px;
	padding-left: 8px;

	width: 247px;

	text-align: left;
}


