@charset "utf-8";
/*  
Theme Name: ORIGINAL
Theme URI: 
Description: 
Author: Yuka Kanda
Author URI: http://www.kandayuka.com
Version: 1.0
Tags:  
*/

/* CSS Document */

/*
-------------------------------------------------------
基本スタイルシート
制作者：神田 由香
作成日：2009年8月8日
更新日：2009年8月22日
-------------------------------------------------------
目次：

1. 基本構造
2. 全体のデザイン要素
3. ヘッダー
4. ヘッダーナビゲーション
5. 中央カラム
6. サイドカラム
7. フッター
8. post等のデザイン要素
9. その他 ハックなど

------------------------------------------------------- */
/* 1. 基本構造
------------------------------------------------------- */

* {
	margin: 0;
	padding: 0;
}

body {
	margin: 0;
	padding: 0;
	background: #FFCC00;
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", verdana, arial, sans-serif;
 	font-size: 62.5%;
	line-height: 1.4;
	text-align: center;
}

h1 {
	width: 960px;
	min-height: 14px;
	margin: 0px auto;
	padding: 5px 0px 0px 0px;
	background:	#000000;
	font-size: 1em;
	font-weight: normal;
	line-height: 105%;
	text-align: center;
	color: #FFFFFF;
}

#wrapper {
	width: 952px;
	display: table;
	margin: 0px auto;
	border: 4px solid #000;
	background-color: #fff;
}

#header {
	position: relative;
	z-index: 1;
	left: 0px;
	top: 0px;
	width: 952px;
	height: 436px;
	margin: 0px auto;
	padding: 0;
	background: url(images/epoch/header-bg.jpg) top center no-repeat;
}

#header div.title-img{
	position: absolute;
	z-index: 2;
	left: 123px;
	top: 17px;
}
#header div.book1-img{
	position: absolute;
	z-index: 3;
	left: 49px;
	top: 260px;
	height: 137px;
}
#header div.book2-img{
	position: absolute;
	z-index: 4;
	left: 221px;
	top: 218px;
}
#header div.chara-img{
	position: absolute;
	z-index: 5;
	left: 341px;
	top: 145px;
}
#header div.navi-img{
	position: absolute;
	z-index: 6;
	left: 394px;
	top: 62px;
}
#content-wrapper {
	clear: both;
	width: 892px;
	padding: 30px 30px 0px 30px;
	border-top: 4px solid #000;
	background: #FFFFFF;
}

#maincol, #topcontent {
	overflow: hidden;
	float: left;
	width: 662px;
	margin: 0px 0px 30px 0px;
	padding: 0px;
	text-align: left;
	font-size: 1.4em;
}

#subcol {
	float: right;
	width: 200px;
	margin: 0px;
	padding: 0px;
	text-align: left;
	font-size: 1.2em;
}

#footer {
	clear: both;
	width: 100%;
	margin: 0px;
	padding: 0px;
	background: #663300;
	color: #fff;
	font-size: 1.2em;
}


/* 2. 全体のデザイン要素
------------------------------------------------------- */

p { margin: 0 0 1em; }
img { border: none; vertical-align: top; }
img a:hover { background: none; }
a, a:link, a:visited { color: #333; text-decoration: underline; }
a:hover { color: #990000; }

.floatleft { float: left; }
.floatright { float: right; }
.clearboth { clear: both; margin: 0px; padding: 0px; }
.alignleft { float: left; margin: 5px 8px 5px 0; }
.alignright { float: right; margin: 5px 0 5px 10px; }
.aligncenter, div.aligncenter { margin: 10px auto; text-align: center; display: block; }

img.floatleft { margin: 0px 5px 3px 0px;}
.marginbottom { margin: 0px 0px 15px 0px;}
.marginright { margin: 0px 5px 0px 0px;}
img.alignleft { float: left; margin: 5px 10px 5px 0; }
img.alignright { float: right; margin: 5px 0 5px 10px; }
img.aligncenter { margin: 10px auto; text-align: center; display: block; }
img.paddingtop { clear: both; padding: 20px 0px 0px 0px; }

.font-big { font-size: 1.2em; font-weight: bold;}

div.dotline { clear: both; margin: 0px; padding: 0px; border-bottom: 1px dotted #327ca6;}
div.dotline hr { display: none; margin: 0px; padding: 0px;}

/* 3. ヘッダー
------------------------------------------------------- */



/* 4. ヘッダーナビゲーション
------------------------------------------------------- */



/* 5. 中央カラム
------------------------------------------------------- */

#maincol h2, #maincol h3 { margin: 1em 0px 1em 0px;	line-height: 1.2em;}

#maincol h2 { color: #006600; font-size: 1.6em;}

#maincol h3 {
	margin: 1em auto;
	color: #5f3813;
	font-size: 1.3em;
}

#maincol ul, #maincol ol { display: block; margin-top: 10px; margin-bottom: 25px; margin-left: 15px; margin-right: 25px; }
#maincol ul li, #maincol ol li { margin: 0px 0px 1em 1em;}
#maincol ul li { list-style-type: circle; list-style-position: outside;}
#maincol ol li { list-style-type: decimal; list-style-position: outside;}

#maincol table { width: 480px; margin: 5px auto; }
#maincol table tr td { padding: 10px; }


/* 6. サイドカラム
------------------------------------------------------- */

#subcol a, #subcol a:link, #subcol a:visited {}
#subcol a:hover { }

#subcol ul {
	margin: 10px 0px 30px 0px;
	line-height: 120%;
}

#subcol ul li {
	margin: 0px 0px 5px 0px;
	padding: 0px 0px 5px 0px;
	list-style: none;
	border-bottom: 2px solid #990000;
}

#subcol ul li a, #subcol ul li a:link, #subcol ul li a:visited {
	display: block;
	padding-left: 5px;
	text-decoration: none;
	border-left: 3px solid #fff; 
}

#subcol ul li a:hover {
	border-left: 3px solid #990000;
}

#subcol img.banner {
	margin: 0px 0px 10px 0px;
	padding: 0px;
	border: none;
}


#subcol div.wdbox {
	background: url(images/epoch/rss-bg.jpg) repeat-y;
	margin: 0px 0px 20px 0px;
	padding: 0px;
}

#subcol div.wdbox ul.blog {
	width: 170px;
	margin: 0px auto;
	padding: 0px;
}

#subcol div.wdbox ul.blog li.blogtitle {
	background: url(images/epoch/rss.png) no-repeat left top;
	margin: 0px 0px 8px 0px;
	padding: 0px 0px 0px 20px;
	border: none;
}

#subcol div.wdbox ul.blog li.blogtitle2 {
	margin: 8px 0px 0px 0px;
	padding: 2px 0px;
	border: none;
	font-weight: bold;
}

#subcol div.wdbox ul.blog li {
	margin: 0px;
	padding: 5px 0px;
	border-left: none;
	border-bottom: 1px dotted #999;
}

#subcol ul.dynamic {
}

#subcol ul.dynamic li {
	border: none;
}

#subcol div.wdbox a, #subcol div.wdbox a:link, #subcol div.wdbox a:visited, #subcol ul.dynamic a, #subcol ul.dynamic a:link, #subcol ul.dynamic a:visited {
	padding: 0px;
	text-decoration: underline;
	border: none;
	color: #666;
}

#subcol div.wdbox a:hover {
	border: none;
	color: #FF3399;
}

#subcol ul.dynamic a:hover {
	border: none;
	color: #990000;
}


/* 6. 戻る
------------------------------------------------------- */
div.inner-navi {
	clear: both;
	float:left;
	width: 100%;
	height: 72px;
	margin: 0px;
	padding: 30px 0px 0px 0px;
	border-bottom: 4px solid #000;
	background-color: #FFFFFF;
	text-align: right;
}

div.inner-navi ul {
	float: right;
	width: 330px;
	height: 72px;
	list-style:none;
}
div.inner-navi ul li {
	list-style:none;
	float:left;
	width:88px;
	margin-right: 22px;
}

div.inner-navi ul li a{
	display:block;
	width:88px;
	height:72px;
	margin:0px;
	padding: 0px;
}

div.inner-navi a span{display: none;}

div.inner-navi a.top{ background: url(images/epoch/footer-btn-1-top.jpg); }
div.inner-navi a:hover.top{ background-position: 0px -72px;}

div.inner-navi a.up{background: url(images/epoch/footer-btn-2-up.jpg); }
div.inner-navi a:hover.up{ background-position: 0px -72px;}

div.inner-navi a.out{background: url(images/epoch/footer-btn-3-out.jpg); }
div.inner-navi a:hover.out{ background-position: 0px -72px;}


/* 7. フッター
------------------------------------------------------- */

#footer a, #footer a:link, #footer a:visited { color: #ffffff; text-decoration: none; }
#footer a:hover { color: #ed78c8; }

ul#page-navi {
	margin: 0px;
	padding: 10px 0px 0px 0px;
	_margin: 10px auto;
	_padding: 0px;
	list-style-type: none;
}

ul#page-navi li {
	float: left;
	margin: 5px 0px;
	padding: 3px 20px;
	border-right: 1px #ccc solid;
}

ul#page-navi li.last {
	border-right: none;
} 

#footer .thanks {
	clear: both;
	width: 910px;
	margin: 0px auto;
	padding: 5px;
	border-top: 1px solid #000;
	text-align: left;
	font-size: 0.95em;
	color: #000;
}

#footer .thanks a, #footer .thanks a:link, #footer .thanks a:visited { color: #000; text-decoration: underline; }
#footer .thanks a:hover { color: #fff; }

#footer p.copyright {
	margin: 10px auto 3px auto;
	font-family: "Arial Black", Osaka, "ヒラギノ角ゴ Pro W3", verdana, arial, sans-serif;
	font-size: 1em;
	text-align: center;
	color: #fff;
	letter-spacing: 1px;
}


/* 8. post等のデザイン要素
------------------------------------------------------- */

#maincol .storycontent {
	clear: both;
	width: 642px;
	margin: 10px auto 30px auto;
}

#maincol .storycontent p { margin: 0px 0px 2em 0px; line-height: 1.9em; }

#maincol .storycontent blockquote { clear: both; width: 85%; margin: 0px auto 18px auto; padding: 18px 18px 0px 18px; border: 1px solid #ccc; background: #CCFFFF; color: #5f3813; }

#maincol h2.storytitle{
	clear: both;
	width: 642px;
	margin: 0px 0px 0px 0px;
	padding: 0px 10px 3px 10px;
	border-bottom: 3px dotted #777;
	color: #990000;
	font-size: 1.85em;
}

#maincol a, #maincol a:link, #maincol a:visited{ color: #333; text-decoration: underline;}
#maincol a:active, #maincol a:hover{ color: #990000;}

#maincol h2.storytitle a, #maincol h2.storytitle a:link, #maincol h2.storytitle a:visited { text-decoration: none;}

#maincol .postdata {
	clear: both;
	float: right;
	width: 300px;
	margin: 0px 0px 30px 0px;
	padding: 10px;
	border-bottom: 3px dotted #777;
	color: #666;
	font-size: 0.95em;
	text-align: left;
}

#maincol .postdata p {
	margin: 0px;
}

#maincol .postdata a, #maincol .postdata a:link, #maincol .postdata a:visited{ color: #666; text-decoration: underline;}
#maincol .postdata a:active, #maincol .postdata a:hover{ color: #333;}

#maincol #epocher {
	clear: both;
	width: 620px;
	margin: 10px auto 50px auto;
	padding: 0px;
	border-bottom: 3px dotted #777;
	font-size: 0.95em;
	text-align: left;
}

#maincol #epocher h3 {
	width: 480px;
	height:	26px;
	margin: 0px 0px 10px 0px;
	padding: 10px 0px 0px 140px;
	background: url(images/epoch/epocher.jpg) top left no-repeat;
	border-bottom: 3px dotted #777;
	color: #33ccff;
	text-align: left;
}

#maincol #epocher p {
	padding: 0px 10px;
	color: #666;
}

#maincol #commentpost {
	clear: both;
	width: 600px;
	margin: 0px auto 10px auto;
	padding: 10px;
	border: 3px solid #333;
	background: url(images/epoch/comment-bg.jpg) repeat top left;
	text-align: center;
}

#maincol #commentpost .commentform {
	clear: both;
	width: 420px;
	margin: 0px auto;
	padding: 0px;
	text-align: left;
}

#maincol #comments {
	clear: both;
	width: 596px;
	margin: 10px auto;
	padding: 10px;
	text-align: left;
}
	
#maincol #comments h3 {
	color: #990000;
}

#maincol .storycontent .wp-caption {
  border: 1px solid #ddd;
  text-align: center;
  background-color: #f3f3f3;

  padding-top: 4px;

  /* optional rounded corners for browsers that support it */

  -moz-border-radius: 3px;

  -khtml-border-radius: 3px;

  -webkit-border-radius: 3px;
  border-radius: 3px;
  }

#maincol .storycontent .wp-caption p.wp-caption-text {
  font-size: 10px;
  line-height: 12px;
  padding: 0 4px 5px;
  margin: 0px;
  color: #111;
  text-align: center;
  }

#extrastuff {
	clear: both;
	margin: 0px 0px 10px 10px;
}

ol#commentlist {
	clear: both;
	margin: 5px auto 0px 20px;
	padding: 0px;
	color: #5f3813;
	text-align: left;
}

ol#commentlist li {
	margin: 0px;
	padding: 10px 0px 0px 0px;
	list-style: inside decimal;
	border-bottom: 1px dotted #2e2e2e;
}
ol#commentlist img.avatar {
	float: left;
	margin: 0px 10px 10px 0px;
}

.full-size-box {
	clear: both;
	width: 95%;
	margin: 0px auto 20px auto;
	padding: 5px 0px 0px 0px;
	border-bottom: 3px solid #dbd196;
	text-align: left;
}

.full-size-box2 {
	clear: both;
	width: 95%;
	margin: 0px auto 20px auto;
	padding: 5px 5px 0px 5px;
	background: #b5e2ee;
	border: 3px solid #327ca6;
	text-align: left;
}

#nextprevious {
	clear: both;
	width: 100%;
	margin: 0px auto;
	font-size: 0.85em;
}

#nextprevious .previous-post {
	float: left;
	width: 300px;
	margin: 0px 0px 30px 0px;
	text-align: left;
}

#nextprevious .next-post {
	float: right;
	width: 300px;
	margin: 0px 0px 30px 0px;
	text-align: right;
}


/* 9. トップページ
------------------------------------------------------- */

#topcontent {
	font-size: 1.2em;
	color: #444;
}

#topcontent h2 {
	margin: 0px 0px 1em 0px;
	font-size: 1.3em;
	color: #990000;
}

#topcontent p.message {
	line-height: 160%;
	color: #990000;
}

#topcontent .leftbox {
	clear: both;
	float: left;
	width: 300px;
	margin: 20px 20px 0px 0px;
	padding: 5px;
	border: 2px solid #ccc;
	background: #EBEBEB;
}

#topcontent .rightbox {
	float: right;
	width: 310px;
	margin: 20px 0px 0px 0px;
	padding: 5px;
}

#topcontent .leftbox h3 {
	margin: 0px 0px 15px 0px;
	padding: 0px 0px 0px 18px;
	border-bottom: 2px solid #ccc;
	background: url(images/epoch/top-icon-story.gif) top left no-repeat;
	font-size: 1.15em;
	font-weight: normal;
	color: #666;
}

#topcontent .leftbox ul li {
	margin-bottom: 15px;
	padding-bottom: 15px;
	border-bottom: 1px solid #ccc;
	line-height: 1.8em;
	color: 666;
}

#topcontent .leftbox ul li.last {
	margin-bottom: 0px;
	border-bottom: none;
}

#topcontent .rightbox dl.epocher {
	width: 290px;
	margin: 20px 0px 20px 0px;
	padding: 5px;
	background: #B5DBFB;
	border-bottom: 5px solid #2fcbff;
}

#topcontent .rightbox dl.epocher dt {
	border-bottom: 3px dotted #2fcbff;
	text-align: right;
}

#topcontent .rightbox dl.epocher dd {
	margin: 5px 0px 0px 5px;
	color: #09F;
}

#topcontent .rightbox dl.epocher a, #topcontent .rightbox dl.epocher a:link, #topcontent .rightbox dl.epocher a:visited{ color: #09f; text-decoration: underline;}
#topcontent .rightbox dl.epocher a:active, #topcontent .rightbox dl.epocher a:hover{ color: #333;}

#topcontent .rightbox dl.mailform {
	width: 290px;
	margin: 20px 0px 20px 0px;
	padding: 5px;
	background: #fc0;
	border-bottom: 5px solid #ff3;
}

#topcontent .rightbox dl.mailform dt {
	border-bottom: 3px dotted #ff3;
	text-align: right;
}

#topcontent .rightbox dl.mailform dd {
	margin: 5px 0px 0px 5px;
}

#topcontent .rightbox dl.mailform dd input {
	width: 150px;
	border: 1px solid #777;
}

#topcontent .rightbox dl.mailform dd textarea {
	width: 278px;
	height: 80px;
	border: 1px solid #777;
}

#topcontent .rightbox dl.mailform dd input.post {
	width: 80px;
	margin: 0px 0px 0px 95px;
	border: 1px solid #777;
}


/* 10. その他
------------------------------------------------------- */
* html img.iepngfix {	/* PNGファイルをIE6で透過にします */
	border: none;
	behavior: url(http://webdirection.jp/wp-content/themes/original-v2/images/iepngfix/iepngfix.htc);
	vertical-align: bottom;
}

a:hover img.linkselect {	/* 画像マウスオンでフィルタをかけます */
	filter: alpha (opacity=60) ;
	-moz-opacity: 0.60;
	opacity: 0.60;
}


.clearfix:after{	/* ブロック要素のバグを回避します */
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix{
	display: inline-block;
}

	/* Hides from IE-mac \*/
	* html .clearfix { height: 1%; }
	.clearfix {display: block; }
	/* End hide from IE-mac */