@charset "utf-8";


/* ------------------------------
 // 1: Body and Base
------------------------------ */
body {
	margin: 0;
	padding: 0;
	background:url(../images/body_bg.jpg) left top repeat-x;
	background-color:#990033;
	color: #000000;
	line-height: 1.6;
	font-family: 'ＭＳ Ｐゴシック','MS PGothic', 'ヒラギノ Pro W3', Hiragino Kaku Gothic Pro, osaka, 'メイリオ', Meiryo, sans-serif;
	font-size: 12px;
	text-align: center;
}

html>/**/body {
	font-size: 12px; /* Except IE */
}

h1, h2, h3, h4, h5, h6,
div, p, pre, ul, ol, dl, dt, dd,
address, form, blockquote{
	margin: 0;
	padding: 0;
    font-size: 100%; 
    font-weight: normal;
}

table {
	border-collapse: separate;
}

img {
    vertical-align: bottom;
	border: 0px;
}

ul {
	list-style-type: none;
}

p {
	text-align: left;
}

.clearfix:after {
	content: ".";  
	display: block;  
	clear: both;
	height: 0;
	visibility: hidden;
}

.clearfix {
	min-height: 1px;
}

* html .clearfix {
	height: 1px;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/
}

/* ------------------------------
 // 2: Link
------------------------------ */

a:link{
	color: #930;
	text-decoration: underline;
}

a:visited{
	color: #930;
	text-decoration: underline;
}

a:hover{
	color: #C00;
	text-decoration: none;
}

a:active{
	color: #C00;
	text-decoration: none;
}

/* ------------------------------
 // 3: layout
------------------------------ */

#container {
	margin: 0 auto;
	width: 960px;
	background: url(../images/main_bg.jpg) center top repeat-y;
}

/* header */

#header {
	margin: 0px auto;
	width: 940px;
}

#header #flash {
	margin: 0px auto;
	width: 452px;
	float: left;
}

#header #intro {
	margin: 0px auto;
	width: 468px;
	float: left;
}

#header #intro .head_logo {
	background: url(../images/head_logo.gif) left top no-repeat;
	text-indent: -9999px;
	height: 33px;
	margin-top: 10px;
}

#header #intro .head_subtitle {
	background: url(../images/head_subtitle.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 24px;
}

#header #intro h1 {
	background: url(../images/head_title.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 46px;
}

#header #intro h2 {
	background: url(../images/head_author.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 46px;
}

/* point_mouseon */

#point01_moreinfo,
#point02_moreinfo,
#point03_moreinfo {
	width: 370px;
	background: url(../images/point_arrow.gif) center bottom no-repeat;
	padding-bottom: 20px;
	position: absolute;
	text-align: left;
	display: none;
}

div.moreinfo_box{
	background-color: #000000;
	border: solid 3px #990033;
	color: #FFFFFF;
	padding: 15px;
}

#point02_moreinfo p{
	background: url(../images/point02_img.jpg) right top no-repeat;
	padding-right: 70px;
}

#point03_moreinfo p{
	background: url(../images/point03_img.jpg) right top no-repeat;
	padding-right: 150px;
}

/* point01 */

#header #intro .point01 {
	background: url(../images/head_point01_bg.jpg) left top no-repeat;
	height: 210px;
}

#header #intro h3.point01_title {
	background: url(../images/head_point01.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 72px;
}

#header #intro .point01_wrapper {
	width: 255px;
	float: left;
}

#header #intro .point01_txt {
	background: url(../images/head_point01_txt.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 97px;
}

#header #intro .head_nihonshi_btn {
	float: left;
}

/* point02 */

#header #intro .point02 {
	background: url(../images/head_point02_bg.jpg) left top no-repeat;
	width: 228px;
	height: 120px;
	float: left;
}

#header #intro h3.point02_title {
	background: url(../images/head_point02.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 86px;
}

/* point03 */

#header #intro .point03 {
	background: url(../images/head_point03_bg.jpg) left top no-repeat;
	width: 228px;
	height: 120px;
	float: right;
	padding-right: 2px;
}

#header #intro h3.point03_title {
	background: url(../images/head_point03.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 86px;
}

/* head_info */

#header #intro .head_info {
	background: url(../images/head_info_bg.jpg) left top no-repeat;
	height: 79px;
	clear:both;
}

#header #intro .head_info_title{
	float:left;
	width:124px;
}

#header #intro .head_info_btnarea{
	float:left;
	width:334px;
	padding-top:7px;
}

#header #intro .head_info_btn_note{
	float:left;
	width:162px;
	margin-right:12px;
}

#header #intro .head_info_btn_calendar{
	float:left;
	width:160px;
}

/* sub */

#header #sub {
	margin: 0px auto;
	width: 880px;
	clear: both;
}

#header #sub .sub_bookinfo{
	margin-top: 15px;
	width: 460px;
	float: left;
}

#header #sub .sub_bookdetail{
	width: 270px;
	float: left;
}

#header #sub .sub_bookdetail dt{
	width: 70px;
	text-align: left;
	float: left;
}

#header #sub .sub_bookdetail dt img{
	border: solid 1px #FFF;
}

#header #sub .sub_bookdetail dd{
	width: 190px;
	text-align: left;
	color: #FFF;
	float: left;
}

#header #sub .sub_btn{
	width: 185px;
	float: left;
}

#header #sub .sub_btn li{
	margin-bottom: 2px;
	text-align:left;
	width: 90px;
	float: left;
}

#header #sub .sub_mobile{
	margin-top: 15px;
	width: 220px;
	float: left;
}

#header #sub .sub_sankousho{
	margin-top: 7px;
	width: 200px;
	float: left;
}

/* blog */
#header #subcontents {
	margin: 0px auto;
	width: 900px;
	clear: both;
}

#subcontents #blog{
	width:420px;
	float:left;
	margin-top:15px;
	}

#subcontents #blog_box{
	background:url(../images/bolg_bg.jpg) top left repeat-y;
	text-align:left;
	}

.blog_title{
	float:left;}

#subcontents #blog_box .infobox{
	height: 370px;
	overflow-y: auto;
}

#subcontents #blog_box .infobox dl{
	margin:0 15px;
	padding:0 0 3px;
}

#subcontents #blog_box .infobox dd{
	padding:4px 0;
	border-bottom:#65001E 1px dotted;
}

#subcontents #blog_box .infobox dd .date{
	color:#FF3300;
	font-weight:bold;
}

#subcontents #blog_box .infobox table{
	margin:0 15px;
	padding:0 0 3px;
	width:93%;
}

#subcontents #blog_box .infobox td{
	padding:9px 0 7px;
	border-bottom:#65001E 1px dotted;
}

#subcontents #blog_box .infobox td .date{
	color:#FF3300;
	font-weight:bold;
	margin-right:13px;
}

/* aboutbook */
#subcontents #aboutbook{
	margin-top: 15px;
	width:465px;
	float:right;
}

#aboutbook .sub_bookinfo{

}

#aboutbook .sub_bookdetail{
	border-bottom:1px solid #BA1B46;
	padding-bottom:10px;
	margin-bottom:10px;
	width:460px;
	float:left;
}

#aboutbook .sub_bookdetail dt{
	width: 70px;
	text-align: left;
	float: left;
}

#aboutbook .sub_bookdetail dt.calendar{
	width: 100px;
}

#aboutbook .sub_bookdetail dt img{
	border: solid 1px #FFF;
}

#aboutbook .sub_bookdetail dd{
	text-align: left;
	color: #FFF;
	float: left;
	width: 390px;
}

#aboutbook .sub_bookdetail dd.calendar{
	width: 360px;
}

#aboutbook .sub_bookdetail .sub_bookdetail_list01{
	float: left;
	width:180px;
}

#aboutbook .sub_bookdetail .sub_bookdetail_list02{

}

#aboutbook .sub_bookdetail .tatiyomi{
	float:right;
	width:192px;
}

ul.kaimono{
	padding-top:10px;
	clear:both;
}

ul.kaimono li{
	display:inline;
	margin-bottom: 2px;
	text-align:left;
	width: 90px;
	float: left;
}
.btn_castle{
	margin-top:15px;
	clear:both;
}

/* contents */

#contents {
	margin: 15px auto 0 auto;
	width: 900px;
	background: url(../images/contents_boxbg.jpg) left bottom repeat-y;
}

#contents #contents_box {
	background: url(../images/contents_boxbottom.jpg) left bottom no-repeat;
	padding-bottom: 30px;
}

/* key */

#contents #key {
	text-align: left;
}

#contents #key .key_l {
	width: 500px;
	float: left;
}

#contents #key .key_r {
	width: 400px;
	float: left;
}


#contents #key .key_read {
	margin-left: 30px;
	margin-bottom: 10px;
	background: url(../images/key_txt.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 75px;
}

#contents #key p.txt{
	margin-left: 37px;
	margin-bottom: 10px;
	width: 450px;
}

#contents #key h3.key_title {
	background: url(../images/key_title.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 90px;
}

/* key_nihonshi */

#contents #key .key_nihonshi {
	background: url(../images/key_nihonshi_bg.jpg) left top no-repeat;
	margin-top: 20px;
	margin-left: 30px;
	width: 450px;
	height: 210px;
}

#contents #key .key_nihonshi h4{
	background: url(../images/key_nihonshi_txt.jpg) left top no-repeat;
	text-indent: -9999px;
	width: 470px;
	height: 76px;
}

#contents #key .key_nihonshi_btn {
	background: url(../images/key_nihonshi_btn.jpg) left top no-repeat;
	margin: 12px 0 0 24px;
}

/* key_character */

#contents #key .key_character{
	padding-top: 20px;
}

#contents #key .key_character h4{
	background: url(../images/key_character_title.jpg) 30px 0 no-repeat;
	text-indent: -9999px;
	height: 25px;
}

#contents #key .key_character dl{
	margin-top: 20px;
	margin-left: 30px;
}

#contents #key .key_character dl p{
	font-size: 10px;
}

#contents #key .key_character dl .character_name{
	font-size: 12px;
	font-weight: bolder;
}

#contents #key .key_character dt{
	width: 85px;
	text-align: center;
	float: left;
}

#contents #key .key_character dd{
	width: 120px;
	float: left;
}

/* type */

#contents #type {
	margin: 10px auto 0 auto;
	width: 840px;
}

.typebox {
	background-color: #FFF2D9;
	padding: 15px;
	border: solid 1px #FECFAD;
	text-align: left;
	margin-top: 10px;
}

.type_txt{
	border-top:1px dotted #FECAA3;
	margin-top:10px;
	padding-top:5px;
	width:595px;}
	
.type_btn{
	float:right;
}
.type_mark{
	margin-top:-27px;}

/* noteinfo */

#contents #noteinfo {
	margin: 10px auto 0 auto;
	width: 840px;
}

#contents #noteinfo h3.noteinfo_title {
	margin-bottom: 10px;
	background: url(../images/note_title.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 70px;
}

#contents #noteinfo .noteinfo_left  {
	width: 560px;
	float: left;
}

#contents #noteinfo .noteinfo_txt {
	background: url(../images/note_txt.jpg) left top no-repeat;
	text-indent: -9999px;
	height:195px;
	padding-bottom:15px;
}

#contents .noteinfo_mailmag {
	background-color: #FFF2D9;
	padding: 15px 15px 5px 15px;
	border: solid 1px #FECFAD;
	text-align: center;
}

#contents .noteinfo_mailmag img {
	display:block;
	margin:0 auto 10px auto;
}

#contents #noteinfo .noteinfo_img {
	width: 260px;
	text-align: right;
	float: right;
}

/* calendarinfo */

#contents #calendarinfo {
	margin: 10px auto 0 auto;
	width: 840px;
}

#contents #calendarinfo h3.calendarinfo_title {
	margin-bottom: 10px;
	background: url(../images/calendar_title.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 70px;
}

#contents #calendarinfo .calendarinfo_txt {
	background: url(../images/calendar_txt.jpg) left top no-repeat;
	text-indent: -9999px;
	height:220px;
	width:660px;
	float:right;
}

#contents #calendarinfo .calendarinfo_img {
	width: 160px;
	float: left;
}


/* author */

#contents #author {
	margin: 10px auto 0 auto;
	width: 840px;
}

#contents #author h3.author_title {
	margin-bottom: 10px;
	background: url(../images/author_title.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 79px;
}

#contents #author .author_txt {
	margin-top: 10px;
	margin-left: 7px;
	width: 600px;
	padding-bottom: 10px;
	float: left;
}

#contents #author .author_photo {
	width: 220px;
	text-align: center;
	padding-bottom: 10px;
	float: right;
}

#contents .profilebox {
	background-color: #EFEFEF;
	padding: 15px;
	border: solid 1px #CCC;
	text-align: left;
	margin-top: 10px;
}

#contents .author_name,
#contents .illustrator_name,
#contents .production_name {
	font-size: 15px;
	font-weight: bolder;
}

/* illust */

#contents #illust {
	margin: 10px auto 0 auto;
	width: 840px;
}

#contents #illust h3.illust_title {
	margin-bottom: 10px;
	background: url(../images/illust_title.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 79px;
}

#contents #illust .illust_img {
	width: 200px;
	text-align: center;
	padding-bottom: 10px;
	float: left;
}

#contents #illust .illust_txt {
	margin-top: 10px;
	padding-right: 20px;
	width: 600px;
	padding-bottom: 10px;
	float: right;
}

/* shiro */

#contents #shiro {
	margin: 10px auto 0 auto;
	width: 840px;
}

#contents #shiro h3.shiro_title {
	margin-bottom: 10px;
	background: url(../images/shiro_title.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 79px;
}

#contents .shirobox {
	background-color: #EFEFEF;
	padding: 15px;
	border: solid 1px #CCC;
	text-align: left;
	overflow:hidden;
}

.shiraisi{
	float:left;
	margin:0px 10px 0px 0px;}


/* Twitter */

#twitter {
	margin: 15px auto 0 auto;
	width: 880px;
}

#twitter .twitter_txt {
	width: 440px;
	float: left;
}

#twitter .twitter_asuka {
	width: 435px;
	float: right;
}


/* bookinfo */

#bookinfo {
	margin: 15px auto 0 auto;
	background-color: #6D0024;
}

#bookinfo_contents{
	margin: 0 auto;
	padding-top:15px;
	width: 880px;
}

#bookinfo .bookinfo_wrapper {
	padding: 15px 0 5px 50px;
	width: 500px;
	float:left;
	border-right:1px solid #88002D;
}

#bookinfo .bookinfo_wrapper dt {
	width: 100px;
	text-align: left;
	float: left;
}

#bookinfo .bookinfo_wrapper dt.calendar {
	width: 120px;
}

#bookinfo .bookinfo_wrapper dt img {
	border: solid 1px #FFF;
}

#bookinfo .bookinfo_wrapper dd {
	width:400px;
	float:right;
}

#bookinfo .bookinfo_wrapper dd.calendar {
	width:380px;
}


#bookinfo .info_bookdetail01 {
	text-align: left;
	color: #FFF;
	float: left;
	margin-right:7px;
}

#bookinfo .info_btn {
	width: 190px;
	text-align: left;
	color: #FFF;
	float: left;
}

#bookinfo .info_btn li {
	margin-bottom: 2px;
	text-align:left;
	width: 90px;
	float: left;
}

#bookinfo .topbtn {
	margin: 0 auto;
	width: 860px;
	text-align: right;
}

.sub_mobile{
	float:right;
	padding:15px 120px 0 0;
}

#contents .pagetop {
	clear:both;
	margin: 0 auto;
	background: url(../images/arrow_pagetop.gif) 752px 17px no-repeat;
	padding:10px 3px 0 15px;
	width: 822px;
	text-align: right;
}

/* footer */

#footer {
	margin: 0 auto;
	background-color: #000000;
	padding: 15px;
}

#footer .foot_wrapper{
	margin: 0 auto;
	width: 900px;
}

#footer .foot_logo a{
	margin-top: -25px;
	background: url(../images/foot_logo.jpg) left top no-repeat;
	text-indent: -9999px;
	display:block;
	width: 170px;
	height: 30px;
}

#footer .copyright {
	color: #FFF;
	text-align: right;
}


/* ------------------------------
 // 4: check_rec
------------------------------ */

body.rec_body {
	margin: 0;
	padding: 0;
	background:url(../images/rec_body_bg.jpg) left top repeat-x;
	background-color:#990033;
	color: #000000;
	line-height: 1.6;
	font-family: 'ＭＳ Ｐゴシック','MS PGothic', 'ヒラギノ Pro W3', Hiragino Kaku Gothic Pro, osaka, 'メイリオ', Meiryo, sans-serif;
	font-size: 12px;
	text-align: center;
}

/* rec_contents */

#contents.rec_contents {
	margin: 0px auto 0 auto;
	width: 900px;
	background: url(../images/contents_boxbg.jpg) left bottom repeat-y;
}

/* rec_head */

#rec_header {
	margin: 0px auto 0 auto;
	width: 840px;
}

#rec_header .rec_logo {
	background: url(../images/rec_logo.jpg) left top no-repeat;
	height: 40px;
}

#rec_header .rec_logo a{
	background: url(../images/rec_logo.jpg) right top no-repeat;
	text-indent: -9999px;
	display:block;
	height: 40px;
	width: 60px;
	float: right;
}

#rec_header .rec_title {
	background: url(../images/rec_head.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 144px;
	clear: both;
}

#rec_header .rec_head_wrapper{
	margin: 0px auto 0 auto;
	width: 840px;	
}

#rec_header .rec_intro{
	width: 450px;
	float: left;
}

#rec_header .rec_intro01{
	margin-top: 15px;
	background: url(../images/rec_intro01.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 60px;
}

#rec_header .rec_intro02{
	background: url(../images/rec_intro02.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 125px;
}

#rec_header .rec_intro03{
	margin-top: 20px;
	background: url(../images/rec_intro03.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 30px;
}

#rec_header .rec_bookinfo{
	margin-top: 20px;
	padding: 15px 0 15px 15px;
	width: 310px;
	border: solid 2px #CCB5B3;
	float: right;
}

#rec_header .rec_bookinfo dt{
	width: 95px;
	text-align: left;
	float: left;
}

#rec_header .rec_bookinfo dt img{
	border: solid 1px #333333;
}

#rec_header .rec_bookinfo dd{
	width: 215px;
	text-align: left;
	float: left;
}

#rec_header .rec_bookinfo_btn li{
	margin-top: 10px;
	width: 150px;
	text-align: left;
	float: left;
}

#rec_header .rec_main_btn {
	padding-top: 5px;
	text-align: left;
}

/* rec_character */

#contents .rec_character h3{
	background: url(../images/rec_chara_title.jpg) left top no-repeat;
	text-indent: -9999px;
	height: 35px;
	margin-top: 20px;
	margin-left: 30px;
}

#contents .rec_character dl{
	margin-top: 20px;
	margin-left: 30px;
}

#contents .rec_character dl p{
	font-size: 10px;
}

#contents .rec_character dl .character_name{
	font-size: 12px;
	font-weight: bolder;
}

#contents .rec_character dt{
	width: 85px;
	text-align: center;
	float: left;
}

#contents .rec_character dd{
	width: 120px;
	float: left;
	padding-bottom: 15px;
}

/* rec_check */

#contents .rec_check {
	padding-top: 25px;
	margin: 0 auto 0 auto;
	background: url(../images/rec_check_bg.jpg) left top no-repeat;
	width: 840px;
	height: 235px;
}

#contents .rec_check_box {
	margin: 0 auto;
	background: url(../images/rec_check_box.jpg) left top no-repeat;
	width: 450px;
	height: 209px;
}

#contents .rec_check_box h3{
	background: url(../images/rec_check_title.jpg) left top no-repeat;
	height: 59px;
	text-indent: -9999px;
}

#contents dl.rec_check_q{
	margin: 20px auto 0 auto;
	width: 370px;
	height: 70px;
	font-size: 14px;
}

#contents dl.rec_check_q dt{
	width: 40px;
	text-align: right;
	float: left;
}

#contents dl.rec_check_q dd{
	width: 320px;
	text-align: left;
	float: right;
}

/* rec_hinomoto */

#contents dl.rec_box {
	margin-top: 10px;
	margin-right: 8px;
	width: 270px;
	float:left;
}

#contents dt.rec_bookcover {
	width: 130px;
	text-align: left;
	float:left;
}

#contents dt.rec_bookcover img {
	border: solid 1px #333;
}

#contents dd.rec_ex {
	width: 135px;
	font-size: 10px;
	text-align: left;
	float: right;
}

#contents .rec_hinomoto,
#contents .rec_sengoku,
#contents .rec_narano,
#contents .rec_edo {
	margin: 20px auto 0 auto;
	width: 840px;
}

#contents .rec_hinomoto h4 {
	background: url(../images/rec_hinomoto_title.jpg) left top no-repeat;
	height: 53px;
	text-indent: -9999px;	
}

#contents .rec_sengoku h4 {
	background: url(../images/rec_sengoku_title.jpg) left top no-repeat;
	height: 53px;
	text-indent: -9999px;	
}

#contents .rec_narano h4 {
	background: url(../images/rec_narano_title.jpg) left top no-repeat;
	height: 53px;
	text-indent: -9999px;	
}

#contents .rec_edo h4 {
	background: url(../images/rec_edo_title.jpg) left top no-repeat;
	height: 53px;
	text-indent: -9999px;	
}

#rec_backToTop .topbtn {
	padding-top: 7px;
}

#rec_backToTop .topbtn {
	margin: 0 auto;
	width: 860px;
	text-align: right;
}