﻿@charset "utf-8";

/* monologue : anytime, anywhere.
	http://www.junkwork.net/
----------------------------------------------- */

/* 基本設定
----------------------------------------------- */

* {
	margin:0;
	padding:0;
	}

body {
	background:#eee url("/img/screen1/background.png");
	color:#003;
	font:100%/1.5 "Trebuchet MS", Arial, sans-serif;
	padding:0 3em;
	}

.boardRes {
	margin:-0.5em 0.5em 0 10%;
	}

.boardMessage .navigation {
	font:bold 90%/1.5 "Trebuchet MS", Arial, sans-serif;
	}

.section {
	margin-left:190px;
	}

.section .section {
	margin-left:0;
	}

.separator {
	border-bottom:1px solid #aaa;
	margin:1.5em 1em;
	}

.storyDisplay, .storyMail, .storyNote {
	background:#ddd;
	border:1px solid #bbb;
	font:95%/1.5  "Bitstream Vera Sans Mono", "Courier New", Courier, monospace;
	margin:1.5em 2em;
	padding:1em 1.5em;
	}

.storyMail .sender {
	text-align:right;
	}

.storyOtherSide {
	border:1px dotted #abc;
	border-width:1px 0;
	margin:1px 0.8em 0;
	padding-top:1em;
	padding-left:10%;
	}

.storyOtherSide+.storyOtherSide {
	border-top:none;
	}

#main {
	background:transparent url("/img/screen1/background-main.png");
	border:1px solid #003;
	border-width:0 1px;
	margin-top:-0.5em;
	padding-bottom:1em;
	}

#information {
	background:transparent url("/img/screen1/background-main.png");
	border:1px solid #003;
	border-width:0 1px 1px;
	margin-top:-1em;
	}

/* アンカー設定
----------------------------------------------- */

a {
	padding:0 0.2em;
	text-decoration:none;
	}

a:link {
	border-bottom:1px dotted #007;
	color:#007;
	}

a:visited {
	border-bottom:1px dotted #789;
	color:#789;
	}

a:hover {
	background:#789;
	border-bottom:1px solid #789;
	color:#eee;
	}

address a:link, address a:visited {
	border:none;
	color:#eee;
	padding:0;
	}

address a:hover {
	border-color:#789;
	}

address span a:link, address span a:visited, address span a:hover, address span a:active {
	color:#cde;
	text-transform:uppercase;
	}

.boardMessage a, .boardRes a {
	font-size:90%;
	}

.navigation a:after, .TBC a:after {
	content:" >>";
	font:bold 90%/1.0 "Trebuchet MS", Arial, sans-serif;
	}

.pictureList li a {
	background:#abc;
	border:none;
	padding:0;
	}

.pictureList li a:hover {
	background:transparent;
	}

#globalNavigation a {
	border:none;
	padding:0.1em 0.5em;
	text-decoration:underline;
	}

#globalNavigation a:link {
	color:#003;
	}

#globalNavigation a:visited {
	color:#336;
	}

#globalNavigation a:hover {
	background:#eee;
	color:#789;
	text-decoration:none;
	}

#globalNavigation li li a:hover {
	background:transparent;
	color:#456;
	}

#globalNavigation li li a:before {
	content:"/ ";
	}

/* 見出し設定
----------------------------------------------- */

h1 {
	background:#eee url("/img/screen1/background-h1.jpg") left top no-repeat;
	border:1px solid #003;
	color:#567;
	float:left;
	font:bold 75%/1.2 Arial, sans-serif;
	height:460px;
	margin-top:2em;
	text-indent:0.5em;
	width:180px;
	}

h2 {
	background:#789;
	color:#eee;
	font:130%/1.2 Arial, sans-serif;
	letter-spacing:-1px;
	margin:0.2em;
	padding-left:0.6em;
	}

h2:first-letter {
	color:#f4a460; /* SandyBrown */
	font-size:120%;
	}

.boardMessage h3, .boardRes h4 {
	border-left:6px double #789;
	border-bottom:1px solid #999;
	color:#345;
	letter-spacing:-1px;
	margin:0 0.5em;
	padding:0.5em 1em;
	}

.boardMessage h3 {
	font:100%/1.2 Osaka, "Trebuchet MS", Arial, sans-serif;
	}

.boardRes h4 {
	border-bottom-style:dotted;
	font:100%/1.0 Osaka, "Trebuchet MS", Arial, sans-serif;
	}

.boardMessage h3:first-letter, .boardRes h4:first-letter {
	color:#933;
	}

.daysDate {
	border-bottom:1px dotted #567;
	color:#567;
	font:bold 100%/1.0 "Trebuchet MS", Arial, sans-serif;
	margin:0 0.5em;
	padding:0.5em 1em 0;
	}

.linkCategory {
	border-bottom:3px double #789;
	color:#336;
	font-size:100%;
	letter-spacing:0.1em;
	margin:0 2em;
	text-indent:0.8em;
	}

.memorandumTitle {
	font:bold 100% "Trebuchet MS", Arial, sans-serif;
	margin:1em 2.5em 0;
	text-align:right;
	}

.storyDate {
	color:#345;
	font:bold 100%/1.3 "Trebuchet MS", Arial, sans-serif;
	margin:1em 0.8em;
	text-indent:0.5em;
	}

.storyDate:before {
	content:"― ";
	}

.storyDate .characterName {
	border-bottom:1px solid #ccc;
	display:block;
	padding-bottom:0.5em;
	text-indent:3em;
	}

.storyDate .characterName:before {
	content:"» ";
	}

.storyOtherSide h4 {
	color:#345;
	font:bold 100%/1.3 "Trebuchet MS", Arial, sans-serif;
	margin:0.5em 0 0 -1.5em;
	}

.storyOtherSide h4:before {
	content:"< ";
	}

.storyOtherSide h4:after {
	content:" >";
	}

.storyTitle {
	border-left:5px double #789;
	border-bottom:1px solid #ccc;
	color:#567;
	font:bold 100%/1.2 Osaka, "Trebuchet MS", Arial, sans-serif;
	letter-spacing:0.1em;
	margin:0 0.3em;
	padding:1em 0.5em 0.3em 1em;
	}

.storyTitle:first-letter {
	color:#003;
	font-size:110%;
	}

.trickTitle {
	color:#999;
	font:100% "Trebuchet MS", Arial, sans-serif;
	margin:0 1em;
	text-align:right;
	}

#aboutAuthor h3, #aboutContents h3 {
	background-color:#abc;
	border:1px solid #567;
	border-bottom-style:dotted;
	color:#567;
	font:bold 100%/1.4 "Trebuchet MS", Arial, sans-serif;
	margin:1em 1.5em 0;
	padding:0.3em 1em 0.1em;
	}

#globalNavigation h2, #information h2 {
	display:none;
	}

#mainHeading {
	padding-top:1.5em;
	white-space:nowrap;
	}

#outlineMonologue h3, #outlineOtherStories h3, #outlineProjectK h3, #outlineSameOldStory h3, #outlineSite h3, #otherStoriesList h3, #projectKList h3, #sameOldStoryList h3, #updateHistory h3 {
	background:#9ab;
	color:#cde;
	font:120% Arial, sans-serif;
	margin:0 5px;
	padding:0.5em 1em 0.1em;
	}

#outlineMonologue h3:first-letter, #outlineOtherStories h3:first-letter, #outlineProjectK h3:first-letter, #outlineSameOldStory h3:first-letter, #outlineSite h3:first-letter, #otherStoriesList h3:first-letter, #projectKList h3:first-letter, #sameOldStoryList h3:first-letter, #updateHistory h3:first-letter {
	color:#eee;
	}

#subtitle {
	display:block;
	text-indent:1em;
	}

/* 本文設定
----------------------------------------------- */

abbr {
	border-bottom:1px dotted #003;
	cursor:help;
	}

abbr:hover {
	border-color:#99c;
	}

address {
	background:#789;
	color:#eee;
	font:bold 100% "Trebuchet MS", Arial, sans-serif;
	margin:0 0.3em;
	padding:1em 1em 3em;
	text-align:right;
	}

address script {
	display:none;
	}

blockquote {
	border-bottom:1px solid #ccc;
	border-left:0.5em solid #789;
	font-size:95%;
	color:#333;
	margin:1em 1.5em;
	padding:0.1em 0;
	}

blockquote:before, blockquote:after {
	color:#666;
	display:block;
	font:italic bold 90% "Trebuchet MS", Arial, sans-serif;
	margin:0 1em;
	}

blockquote[title]:before {
	content:attr(title);
	}

blockquote[cite]:after {
	content:'Quoted from "'attr(cite)'"';
	text-align:right;
	}

blockquote[cite="urn:isbn:408782537X"] li {
	list-style:upper-alpha;
	}

blockquote p {
	margin:0.5em 1em 0.5em 1.5em;
	}

blockquote[cite="http://www1.bb-i.net/~fireforge/die/dri2.htm"] p, blockquote[cite="urn:isbn:4101098409"] p {
	margin-left:1.5em;
	text-indent:0;
	}

blockquote p+p {
	margin-top:1em;
	}

code {
	color:#333;
	font:100%  "Bitstream Vera Sans Mono", Courier, monospace;
	}

del, del * {
	color:#666;
	text-decoration:line-through;
	}

em {
	color:#933;
	font:bold 100% "Trebuchet MS", Arial, sans-serif;
	}

img {
	border:none;
	}

ins {
	border-bottom:1px dotted #999;
	text-decoration:none;
	}

kbd {
	background:#fff;
	border:2px outset #333;
	color:#333;
	font:bold 100% "Courier New", Courier, monospace;
	padding:0 0.3em;
	text-transform:capitalize;
	}

p {
	margin:1em 1.5em;
	text-indent:1.5em;
	text-align:justify;
	_text-justify:inter-ideograph;
	}

pre {
	border-left:0.5em solid #abc;
	border-bottom:1px solid #abc;
	margin-left:-1em;
	padding:0.1em 0 0.1em 0.5em;
	}

q {
	color:#666;
	}

q:before {
	content:"“";
	}

q:after {
	content:"”";
	}

.boardMessage p, .boardRes p {
	margin-left:2.5em;
	text-indent:0;
	}

.EOS, .TBC { /* EOS = End Of Story */ /* TBC = To Be Continued */
	border-bottom:1px solid #999;
	margin:1em 0.8em;
	padding:0 1em 0.5em;
	text-align:right;
	}

.EOS:before {
	content:"< ";
	}

.EOS:after {
	content:" >";
	}

.history img {
	border:1px solid #003;
	}

.l {
	display:block;
	}

.storyCount {
	color:#c33;
	font:bold 100%/1.5 "Trebuchet MS", Arial, sans-serif;
	}

.storyDisplay p, .storyMail p {
	margin:0;
	text-indent:0;
	}

.storyDisplay p+p, .storyMail p+p, .storyNote p+p {
	margin-top:1em;
	}

.storyDisplay .parenthesis, .storyMail .parenthesis {
	display:none;
	}

.storyDisplay .note+p, .storyDisplay p+.note {
	border-top:1px solid #ccc;
	padding-top:1em;
	}

.verse {
	margin:1em 2.5em;
	text-indent:0;
	}

.verse+.verse {
	margin-top:1.3em;
	}

.words {
	margin:1em 2em;
	text-indent:0;
	}

#aboutLinkList img {
	margin:0.3em 0.1em 0.1em;
	vertical-align:middle;
	}

#aprilBookImage {
	border:none;
	float:left;
	margin:0.5em 1.5em;
	}

#messageSubmit {
	margin-top:-1em;
	text-align:right;
	}

/* リスト設定
----------------------------------------------- */

dl, ol, ul {
	margin:1em 3em;
	}

dt {
	font:bold 100%/1.5 "Trebuchet MS", Arial, sans-serif;
	}

dd {
	margin-left:2em;
	text-align:justify;
	_text-justify:inter-ideograph;
	}

ul {
	list-style:square outside;
	}

.appendixList li {
	list-style:none outside;
	word-spacing:0.1em;
	}

.boardHeader, .boardResHeader {
	float:right;
	margin:-1.5em 1.5em 0 0;
	position:relative;
	word-spacing:1px;
	}

.boardHeader li, .boardResHeader li {
	color:#567;
	display:inline;
	font:85%/1.2 "Trebuchet MS", Arial, sans-serif;
	letter-spacing:-1px;
	list-style:none outside;
	}

.boardHeader li+li:before, .boardResHeader li+li:before {
	content:"wrote; at ";
	font:95%/1.2 "Trebuchet MS", Arial, sans-serif;
	}

.diaryList dt {
	border-bottom:3px double #abc;
	padding-left:0.5em;
	}

.diaryList dd {
	border-left:0.5em solid #abc;
	padding:0.3em 0;
	padding-left:1em;
	}

.diaryList dd+dt {
	margin-top:1em;
	}

.diaryList li {
	display:inline;
	list-style:none outside;
	}

.diaryList ul {
	margin:0.3em 0 0.3em 2em;
	}

.diaryList ul li {
	display:list-item;
	list-style:square outside;
	}

.history {
	margin:0;
	}

.history dt {
	font-style:italic;
	margin-left:1em;
	}

.history dd+dt {
	border-top:1px dotted #abc;
	margin-top:1.5em;
	margin-right:1em;
	padding-top:1em;
	}

.linkList {
	border-left:0.5em solid #abc;
	border-bottom:1px solid #eee;
	margin-top:0;
	padding:0.3em 1.5em;
	}

.linkList li {
	font-weight:bold;
	list-style:none outside;
	}

.navigation {
	line-height:1.6;
	margin:1em 1.5em;
	}

.navigation li {
	list-style:none;
	text-align:right;
	}

.pictureList li {
	display:inline;
	list-style:none outside;
	}

.storyCategoryList dd+dt, .storyInfoList dd+dt {
	margin-top:0.5em;
	}

.storyHeader {
	margin:0;
	position:absolute;
	top:4em;
	right:6.5%;
	}

.storyHeader li {
	color:#789;
	font:bold 80%/0.9 "Trebuchet MS", Arial, sans-serif;
	letter-spacing:-1px;
	list-style:none outside;
	padding-left:1em;
	}

.storyHeader li:first-child {
	margin-left:-0.3em;
	}

.storyHeader li:first-child:first-letter {
	color:#567;
	font:bold 110%/0.9 "Trebuchet MS", Arial, sans-serif;
	}

.storyInfoList dd {
	text-indent:1.5em;
	}

.storyList dl {
	margin:0 0 1em;
	}

.storyList dl dt {
	font:100%/1 "Trebuchet MS", Arial, sans-serif;
	margin:0 0 0.5em;
	}

.storyList dl dd {
	text-indent:0.8em;
	}

.storyList li {
	line-height:1.7;
	list-style:none outside;
	word-spacing:0.1em;
	}

.storyMail dt {
	float:left;
	font:bold 100% "Trebuchet MS", Arial, sans-serif;
	text-align:right;
	width:4em;
	}

.storyMail dt:after {
	color:#666;
	content:" :";
	}

.storyMail dd {
	margin-left:4.5em;
	}

.storyMail ul {
	margin:1em;
	}

.storyMeaningList dt {
	color:#345;
	}

.storyMeaningList dd {
	margin-left:3em;
	}

.storyMeaningList ol {
	list-style:decimal outside;
	margin:0;
	}

.storyMeaningList ol ol {
	list-style:lower-alpha outside;
	margin-left:1.5em;
	}

.time {
	margin:1em 2em;
	}

.time li {
	background:transparent;
	border:none;
	border-left:0.5em solid #abc;
	font:90%/1.5 "Trebuchet MS", Arial, sans-serif;
	list-style:none outside;
	margin:0.2em;
	padding:0.5em 1em;
	}

#aboutAuthor dl, #aboutContents dl {
	background-color:#ddd;
	border:1px solid #567;
	border-top:none;
	margin:0 1.5em 1em;
	padding:0.5em 2em;
	}

#aboutAuthor dt {
	float:left;
	position:relative;
	text-align:right;
	width:4.5em;
	}

#aboutAuthor dt:after {
	content:" :";
	}

#aboutAuthor dd {
	margin-left:4.8em;
	}

#aboutContents dd {
	margin:0.1em 0 0.1em 2.5em;
	}

#aboutContents dl dl {
	border:none;
	margin:0 1em;
	padding:0;
	}

#aboutLinkList {
	margin:1.5em 3em;
	}

#aboutLinkList abbr[title]:after {
	content:" [" attr(title) "]";
	font:80%/1.0 "Trebuchet MS", Arial, sans-serif;
	}

#bookInformation {
	border:1px dotted #003;
	padding:0.5em 1em;
	margin-left:180px;
	}

#deleteList {
	list-style:none outside;
	margin:0.5em 1.5em;
	text-align:right;
	}

#deleteList li {
	display:inline;
	}

#globalNavigation ul {
	background:transparent;
	float:right;
	margin:0 0 0.5em;
	padding:0 1em;
	position:relative;
	text-align:right;
	z-index:1;
	}

#globalNavigation li {
	display:inline;
	font:bold 90%/1.5 "Trebuchet MS", Arial, sans-serif;
	list-style:none outside;
	margin:0 0.3em;
	}

#globalNavigation ul ul {
	display:none;
	text-align:left;
	}

#information ul {
	display:none;
	}

#outlineMonologue dl[title]:before, #updateHistory dl[title]:before {
	content:attr(title);
	display:block;
	font:italic bold 90% Arial, sans-serif;
	margin:0 1em 0.5em;
	}

#outlineMonologue dl, #updateHistory dl {
	border:1px solid #789;
	margin:1em;
	padding:1em 0.3em;
	_margin:1em; /* Underscore Hack http://wellstyled.com/css-underscore-hack.html */
	_width:auto;
	}

#outlineMonologue dl+dl, #updateHistory dl+dl {
	margin-top:2em;
	}

#outlineMonologue dt, #updateHistory dt {
	clear:left;
	float:left;
	position:relative;
	width:6em;
	}

#outlineMonologue dt, #outlineMonologue dd, #updateHistory dt, #updateHistory dd {
	padding:0.1em 0.5em;
	}

#outlineMonologue dt:first-letter, #updateHistory dt:first-letter {
	color:#900;
	}

#outlineMonologue dt:hover:after, #updateHistory dt:hover:after {
	content:"";
	}

#outlineMonologue dd, #updateHistory dd {
	border-left:3px solid #f4a460;
	margin:1px 0 1px 7.5em;
	}

#outlineMonologue ul {
	list-style:none;
	margin:0.5em 1.5em;
	}

#postList dt {
	float:left;
	font:bold 100%/1.4 "Trebuchet MS", Arial, sans-serif;
	margin-right:1em;
	position:relative;
	text-align:right;
	width:10%;
	}

#postList dd {
	margin:0;
	}

#updateHistoryList {
	background-color:#ddd;
	border:1px solid #567;
	height:9em;
	margin:1em 3%;
	overflow:auto;
	padding:0.5em 1.5em;
	}

#updateHistoryList dt {
	color:#567;
	text-indent:0.5em;
	}

#updateHistoryList dd {
	margin:0 0 0.5em;
	padding-left:2em;
	}

#updateHistoryList dd+dt {
	border-top:1px solid #789;
	padding-top:0.5em;
	}

/* フォーム設定
----------------------------------------------- */

input, textarea {
	font:95% "Trebuchet MS", Arial, sans-serif;
	}

textarea.input {
	width:expression((this.parentNode.offsetWidth*0.7)+'px'); /* WinIE で入力時にテキストエリア横伸び対策 */
	}

.input {
	border:1px solid #333;
	margin:0.1em;
	padding:0.1em;
	width:80%;
	}

.submit {
	background:#fff;
	border:1px solid #333;
	}

[type="checkbox"] {
	margin-right:0.5em;
	}

[type="password"], [type="submit"] {
	border:1px solid #333;
	color:#333;
	font:bold 85% "Trebuchet MS", Arial, sans-serif;
	padding:0 0.3em;
	width:8.5em;
	}
