@charset "UTF-8";
/* ---------- common ---------- */
body{
	background: url("../img/bg.png") repeat;
	font-family: "ヒラギノ角ゴシック", Hiragino Sans, "メイリオ", Meiryo, sans-serif;
	font-size:14px;
	color:#641e00;
}
article{
	width:1200px;
	margin: -30px auto 0;
	text-align: center;
}

article h4{
	display: inline-block;
	font-size:32px;
	font-weight: 900;
	background:#ffff01;
    padding: 5px 150px;
    margin:30px auto;
}
article h4 span{
	display: inline-block;
	line-height: 1.1;
}
article h4 span:before{
content:url("../img/icn_books.png");
padding-right:25px;
vertical-align: 3px;
}
article h4 span:after{
content:url("../img/icn_books.png");
padding-left:25px;
vertical-align: 3px;
}


a:hover{ opacity: 0.8; }

.sp{ display:none; }
.pc{ display:inline; }



/* ---------- header ---------- */
header{
	width:1200px;
	height: 1500px;
	margin:0 auto;
	background: url("../img/bg_kv.png") no-repeat;
	position: relative;
}
header h1{
	display: inline-block;
	padding: 33px 0 0 31px;
}
header .mainCatch{
	display: inline-block;
	position:absolute;
	top: 31px;
    right: 49px;
}
header .subCatch{
	display: inline-block;
	position:absolute;
	top: 1094px;
	left: 30px;
}
header .subCatch p{
	display: inline-block;
}

/* ---------- article ---------- */
.backBg{
	position: fixed;
    background: url(../img/bg_contents.png) no-repeat;
    top: -50px;
    width: 1200px;
    height: 1950px;
    z-index: -10;
}

#mainCopy{
	position: relative;
	font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
	display: block;
    text-align: center;
    color: #720000;
    font-weight: 900;
    font-size: 18px;
    line-height: 1.3;
	padding: 0 0 30px;
    margin: 0 0 120px;
    text-shadow: 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 4px white, 0 0 8px white, 0 0 8px white, 0 0 8px white, 0 0 8px white, 0 0 8px white;
}
#mainCopy:before{
	content:"";
	display:inline-block;
	background:url(../img/line_kv.png) top center no-repeat;
	background-size:100%;
	width:404px;
	height:68px;
	position:absolute;
	top: -90px;
    left: 0;
    right: 0;
    margin: auto;
	z-index: 1;
}
#mainCopy:after{
	content:"";
	display:inline-block;
	background:url(../img/line_kv.png) top center no-repeat;
	background-size:100%;
	width:404px;
	height:68px;
	position:absolute;
	bottom: -60px;
    left: 0;
    right: 0;
    margin: auto;
	z-index: 1;
}


#coment{
    width: 980px;
    margin: 0 auto 40px;
    background: url(../img/bg_coment.png) center center #fff no-repeat;
	box-shadow: 0 0 12px #641e00;
}
#coment .titComent{
	padding-top:34px;
}
#coment .titComent img{
}
#coment .comentTxtBox{
	padding: 25px 15px 0;
}
#coment .comentTxtBox p{
	font-size:18px;
	font-weight:600;
	line-height: 1.6;
}
#coment .comentTxtBox .sign{
    padding: 15px 0 25px;
	font-size: 24px;
}
#coment .comentTxtBox .sign img{
	max-width: 226px;
}


#novel{
    width: 980px;
    margin: 0 auto 40px;
    background:#fff;
	box-shadow: 0 0 12px #641e00;
}
#novel .titNovel{
	padding-top:34px;
}

#novel  .boxL{
    float: left;
}
#novel  .boxR{
    float: right;
}
#novel  .box09{
	margin: 0 auto 50px;
    overflow: auto;
    width: 865px;
}
#novel  .box10{
	margin: 0 auto;
	overflow:auto;
    width: 865px;
	padding-bottom: 40px;
}

#novel  .box09 .shoei,
#novel  .box10 .shoei{
    display: inline-block;
}
#novel  .box09 .txtBox,
#novel  .box10 .txtBox{
    width: 586px;
    text-align: left;
    font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
}
.txtBox .title{
    font-size: 22px;
    font-weight: 600;
    padding: 8px 0 10px;
}
.txtBox .author{
	line-height: 1.3;
    font-weight: 600;
    padding-bottom: 10px;
}
.txtBox .synopsis{
	border-top: 1px solid #641e00;
	line-height: 1.4;
	padding-top:10px;
}
#novel .txtBox .synopsis{
	margin-bottom: 15px;
}

.txtBox .btnDetail{
    width: 235px;
    height: 49px;
}
#novel  .box10 .txtBox .btnDetail{
	float: right;
}
.txtBox .btnDetail a{
	display: inline-block;
	font-size: 18px;
    font-weight: 600;
    color:#ffff01;
    text-align: center;
    box-sizing: border-box;
    background: url(../img/btn_bg_books.png) no-repeat;
    width: 235px;
    height: 49px;
    padding: 16px 0;
}



#item{
    width: 980px;
    margin: 0 auto 40px;
    background:#fff;
	box-shadow: 0 0 12px #641e00;
	padding-bottom: 30px;
}
#item .titItem{
	padding-top:34px;
}
#item h3{
	font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;	
	font-size: 28px;
	padding-top:30px;
	line-height: 1.1;
}
#item .itemList{
	margin: 0 35px;
	font-size: 0;
}
#item .itemList li{
	display:inline-block;
	vertical-align: top;
	background: #c5ac60;
    width: 220px;
	border-top:4px solid #641e00;
	margin: 0 10px 10px 0;
}
#item .itemList li:nth-child(4n){
    margin-right: 0;
}

#item .itemList li .itemName{
	font-size: 24px;
	font-weight: 600;
	font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
	height: 68px;	
    padding: 22px 0;
    box-sizing: border-box;
    background:url("../img/bg_item.png") center center no-repeat;
}
#item .itemList li .itemName.line2{
	font-size: 20px;
    padding: 14px 0;
}

#item .itemList li .image{}
#item .itemList li .description{
	font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
	font-size: 14px;
	color:#000;
	padding: 8px 19px;
    text-align: left;
	line-height: 1.2;
}
#item .itemList li .btn{
    margin-bottom: 10px;
}
#item .itemList li .btn a{
	display:inline-block;
	font-size: 14px;
    background:url("../img/btn_bg_item.png")  center no-repeat;
    width: 181px;
    height:37px;
	font-size: 16px;
    color: #fff;
    font-weight: 600;
    padding-top: 10px;
    box-sizing: border-box;
}


#shortstory{
    width: 980px;
    margin: 0 auto 40px;
    background:#fff;
	box-shadow: 0 0 12px #641e00;
	padding-bottom: 40px;
}
#shortstory .titShortstory{
	padding-top:34px;
}
#shortstory .btn{
	display: inline-block;
    padding-top: 20px;
}


#illust{
    width: 980px;
    margin: 0 auto 40px;
    background:#fff;
	box-shadow: 0 0 12px #641e00;
}
#illust .titIllust{
	padding-top:34px;
}
#illust h3{
	font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
    font-size: 28px;
    padding-top: 30px;
    line-height: 1.1;
}
#illust .img{
	padding: 30px 15px 40px;
}


#message{
    width: 980px;
    margin: 0 auto 60px;
	padding-bottom: 20px;
    background:#fff;
	box-shadow: 0 0 12px #641e00;
}
#message .titMessage{
	padding-top:34px;
}

#message h3{
	display: block;
    text-align: center;
    font-weight: 600;
	font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
    font-size: 28px;
    line-height: 1.1;
    padding-top:30px;
}
#message .tabBox{
    margin: 23px 0 30px;
}
#message .tabBox li{
    display: inline-block;
}
#message .tabBox li a{
    display: inline-block;
    box-sizing: border-box;
}
#message .tabBox li a img{
	max-width: 238px;
}

#message .tabContents{}
#message .tabContents li{
	margin:0 auto 30px;
	width: 866px;
    background: #c6ac61;
    box-sizing: border-box;
    padding: 0 38px 18px;
    border-top:4px solid #641e00;
}
#message .tabContents li .nameBox{
	font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
    font-weight: 600;
	padding-bottom: 6px;
    margin-top: 15px;
	border-bottom: 1px solid #641e00;
}
#message .tabContents li .nameBox .name{
	font-size: 28px;
    font-weight: 900;
}
#message .tabContents li .nameBox .position{
	display: inline-block;
    font-size: 12px;
    background: #641e00;
    color: #fff;
    padding: 2px;
    margin: 4px 0 0;
}
#message .tabContents li .nameBox .works{
    font-weight: 900;
    font-size: 12px;
	line-height: 1.2;
    padding-top: 5px;
}
#message .tabContents li .txtBox{
    margin-top: 18px;
	line-height: 1.5;
    font-weight: 600;
}
#message .tabContents li .works + .txtBox{
    margin-top: 8px;
}


.btnBack{
    text-align: center;
	margin: 56px 0;
}
.btnBack a{
	display: inline-block;
	font-size: 14px;
    font-weight: 600;
    text-align: center;
	line-height: 1.2;
    box-sizing: border-box;
    width: 377px;
    height: 64px;
    padding-top: 16px;
}


/* ---------- footer ---------- */
footer{
    font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
    text-align: center;
	font-size: 14px;
	line-height: 1.3;
	background:#fff;
    border-top: 2px solid #d9c060;
    padding: 15px 0 20px;
}
footer .MFbooks{
	display: inline-block;
    margin-bottom: 5px;
}
footer .copylight{
	padding: 0 5%;
}



/* 1024px以下 ※スマホ・タブレット用表示 */
@media screen and (max-width:1024px){
	.pc{ display:none; }
	.sp{ display:inline; }

	article{
		width: auto;
		margin: 0;
	}
	article h4{
		font-size: 24px;
		padding: 4px 20px;
		margin: 15px auto;
	}
	article h4 span:before,
	article h4 span:after{
		vertical-align: 1px;
	}
	
	img{ width:100%; }

	header {}
	
	footer {}
}

/* スマホ縦向き用 */
@media screen and (max-width:640px){
	article{
		width:100%;
		}
	header{
		width:100%;
		background-size:100%;
		height: 520px;
		}
	header h1{
		padding: 3% 0 0 4%;
		width: 55%;
	}
	header .mainCatch{
		width: 21%;
		top: 2%;
		right: 3%;
	}
	header .subCatch{
		width: 46%;
		top: 68%;
		left: 4%;
	}
	header .subCatch p{
		width: 48%;
	}
	header .btnDasoku{
		width: 90%;
		bottom: auto;
		top: 24%;
	}
	header .mainCopy{
		padding: 90% 0 20% 0;
		margin: 0 20px;
		font-size: 16px;
	}
		
	.backBg{
	    background-size:100%;
	    top: 0;
	    width: 100%;
	    height: 100%;
	}
	
	#mainCopy{
		width: 90%;
		margin: 0 auto;
	}
	#mainCopy:before{
		width: 90%;
    	max-width: 404px;
		top: -6%;
	}
	#mainCopy:after{
		width: 90%;
    	max-width: 404px;
	}

	
	#coment{
		width: 90%;
		margin-top: 15%;
 	   box-sizing: border-box;
	}
	#coment .titComent{
		padding-top: 20px;
	}
	.comentInner .comentTxtBox p{
		font-size: 16px;
	}
	.comentInner:before,
	.comentInner:after,
	.novelInner:before,
	.novelInner:after{
		height: 8%;
	}
	.comentInner .comentTxtBox{
		width: 85%;
		margin: 0 auto;
	}
	.comentInner .comentTxtBox .sign{
		padding-bottom:20px;
	}
	.comentInner .comentTxtBox .sign img{
		width: 70%;
	}

	#novel{
		width: 90%;
	}
	#novel .titNovel{
		padding-top:20px;
	}
	#novel h3{
		padding: 4px 30px;
		font-size: 24px;
	}
	#novel .boxL,
	#novel .boxR{
		float: none;
	}
	#novel .box09,
	#novel .box10{
		width: 100%;
		padding-bottom: 20px;
		margin-bottom: 0;
	}
	#novel .box09 .txtBox,
	#novel .box10 .txtBox{
		width: 85%;
		margin:0 auto;
	}
	.txtBox .title{
		padding-top: 20px;
		line-height: 1.2;
	}
	.txtBox .author{
		padding-bottom: 13px;
	}
	#novel .box09 .txtBox .synopsis{
		padding-top: 13px;
	}
	.txtBox .btnDetail{
		margin: 0 auto;
	}
	#novel .centerLine{
		margin: 28px 5%;
	}
	#novel .box10 .txtBox .btnDetail{
		float: none;
	}
	
	
	#item{
		width: 90%;
	}
	#item .titItem{
		padding-top:20px;
	}
	#item h3{
		font-size: 24px;
		padding: 15px 15px 0;
	}
	#item .itemList{
		margin: 0 15px;
	}
	#item .itemList li{
		width: 45%;
	}
	#item .itemList li .itemName{
		height: 52px;
		font-size: 20px;
		padding: 18px 0;
	}
	#item .itemList li .itemName.line2{
		font-size: 14px;
		padding: 14px 0;
	}
	#item .itemList li:nth-child(2n){
		margin-right: 0;
	}
	#item .itemList li .image{
		width: 90%;
		margin: 0 auto;
	}
	#item .itemList li .description{
		padding: 8px 7%;
	}
	#item .itemList li .btn a{
		width: 85%;
		font-size: 14px;
		border-radius:30px;
	}
	


	#shortstory{
		width: 90%;
		padding-bottom: 20px;
	}
	#shortstory .titShortstory{
		padding-top:20px;
	}
	#shortstory .btn{
		padding: 10px 10px 0;
	}


	#illust{
		width: 90%;
	}
	#illust .titIllust{
		padding-top:20px;
	}
	#illust h3{
		font-size: 24px;
	}
	#illust .img{
		padding-bottom:20px;
	}
	
	
	#message{
		width: 90%;
	}
	#message .titMessage{
		padding-top:20px;
	}
	#message h3{
		margin: 0 5%;
	}
	#message .tabBox li{
		width: 44%;
		margin: 4px 2px;
	}
	#message .tabContents li{
		width: 90%;
		padding: 0 15px 18px;
		margin-bottom: 15px;
	}
	#message .tabContents li .nameBox .position{
		font-size: 10px;
	}
	#message .tabContents li .txtBox{
		font-size: 12px;
		line-height: 1.5;
	}

	.btnBack a{
		width: 90%;
		background-size: 100%;
		padding: 3.5% 0;
	}



}