@charset "utf-8";

/* ==========================================================

 commonLayout

========================================================== */
div.content_wrapper {
	background: #FFFFFF; /* ページ全体の背景で変更不可 */
}

/* background設定 */
article.special_content_wrapper {
	background: url(../images/bg.png) repeat;
}
article.precomp {
	background: url(../images/bg_comp.png) repeat;
}

article.special_content_wrapper em,
article.special_content_wrapper strong {
	font-style: normal;
	font-weight: bold;
}
article.special_content_wrapper em {
	color: #E40000;
}
article.special_content_wrapper strong {
	color: #E40000;
}

article.special_content_wrapper section h2 {
	/*background: #000000;*/
	color: #FFFFFF;
	font-size: 18px;
}

/* 関連リンク用ボタンstyle */
div.relevantLinkBtn {
	display: table;
	margin: 0 auto;
}
div.relevantLinkBtn a {
	display: table-cell;
	vertical-align: middle;
	cursor: pointer;
}
div.relevantLinkBtn p {
	color: #FFFFFF;
	font-size: 20px;
	text-align: center;
}
div.relevantLinkBtn p span {
	font-size: 24px;
	font-weight: bold;
}
div.relevantLinkBtn p + p {
	font-size: 24px;
	font-weight: bold;
}

/* 外部リンク */
div.relevantLinkBtn + div.relevantLinkBtn p {
	color: #FFFFFF;
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	padding: 5px 0;
	margin-top: 8px;
	width: 447px;
}
div.relevantLinkBtn + div.relevantLinkBtn a:hover {
	text-decoration: none;
}
div.relevantLinkBtn + div.relevantLinkBtn a:hover p {
}

/* 三角矢印 */
div.relevantLinkBtn p span.arrow {
	display: inline-block;
	border-style: solid;
	border-width: 7px 0 6px 12px;
	border-color: transparent transparent transparent #FFFFFF;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	margin-left: 10px;		
}


/* headerBlock
------------------------------------------------------------- */
section.headerBlock { }

section.headerBlock p.leadText {
	text-align: center;
/* ▼テキスト時のみ追加
	font-size: 18px;
	letter-spacing: 2px;
	background: #FF5500;
	color: #FFFFFF;
	padding: 6px 0 4px;
*/
}
section.headerBlock h1 img {
	width: 770px;
	padding-bottom: 20px;
}
section.headerBlock h1.startHeadLayout img {
	background: url(../images/upperBottom.png) no-repeat bottom center;
}
	section.headerBlock h1 + p {
		color: #333333;
		font-size: 20px;
		font-weight: bold;
	}
	section.headerBlock h1 + p a {
		text-decoration: underline;
	}

/* messageBlock
------------------------------------------------------------- */
section.messageBlock {
	margin: 0 !important;
}
section.messageBlock h2 {
	/* padding: 5px 10px; テキスト時のみ追加 */
}
section.messageBlock div.descriptionArea {
	width: 696px;
	margin: 40px auto 20px;
	padding: 5px 0;
	background: rgba(255,255,255,0.6);
}
	div.descriptionArea div[class^="presentVol"] h2 { position: relative; }
	div.descriptionArea div[class^="presentVol"] h2 span {
		width: auto;
		position: absolute;
	}
		div.descriptionArea div.presentVol1	h2 span {
			top: -45px;
			left: -10px;
		}
		div.descriptionArea div.presentVol2 h2 span {
			top: -45px;
			right: -25px;
		}
		div.descriptionArea div.presentVol2 h2 > img {
			margin: -20px 0 0 -40px;
		}
		div.descriptionArea div.presentVol3 h2 span {
			top: -45px;
			left: -10px;
		}
section.messageBlock div.relevantLinkBtn + div.relevantLinkBtn {
	margin-top: 10px;
}

/* completeBlock
------------------------------------------------------------- */
section.completeBlock {  }
section.completeBlock h2 {
	display: none; /* 基本非表示 */
	/* padding: 5px 10px; テキスト時のみ追加 */
}
section.completeBlock p.thanks {
	margin: 0 auto 10px;
}
section.completeBlock div.relevantLinkBtn + div.relevantLinkBtn {
	margin-top: 10px;
}

/* contentBlock
------------------------------------------------------------- */
section.contentBlock {
	text-align: left;
}
section.contentBlock h2 {
	/* padding: 5px 10px; テキスト時のみ追加 */
}

	/* movieArea */
	div.movieArea {
		text-align: center;
		padding: 35px 0;
		background-image:
			url(../images/contentBgTop.png),
			url(../images/contentBgBottom.png);
		background-repeat:
			no-repeat,
			no-repeat;
		background-position:
			top,
			bottom;
	}
	div.movieArea > div {
		background: #FFFFFF;
	}
	div.movieArea > div h2 {
		margin-bottom: 15px;
	}
	div.movieArea div.objectMovie,
	div.movieArea div.memberMovie {
		margin: 10px auto 0;
	}
		/* memberMovie_false */
		div.memberMovie_false {
			position: relative;
		}
		div.memberMovie_false li a:hover {
			text-decoration: none;
		}
		div.memberMovie_false div.btnArea {
			position: absolute;
			top: 90px;
			left: 10px;
			background: #FFFFFF;
			padding: 20px 10px;
			border: #999 solid 1px;
		}
		
	
	/* comingSoon */
	div.comingSoon {
		width: 560px;
		margin: 10px auto 0;
		position: relative;
	}
	div.comingSoon img:nth-child(2) {
		position: absolute;
		top: 0;
		left: 0;
		animation-name: comingSoon;
		-webkit-animation-name: comingSoon;
		animation-duration: 0.15s;
		-webkit-animation-duration: 0.15s;
		animation-iteration-count: infinite;
		-webkit-animation-iteration-count: infinite;
		opacity: 0;
	}
	@keyframes comingSoon {
		0% {
			opacity: 0;
		}
		100% {
			opacity: 1;
		}
	}
	
	/* comicArea */
	div.comicArea {
		margin-top: 20px;
		padding: 35px 0;
		background-image:
			url(../images/contentBgTop.png),
			url(../images/contentBgBottom.png);
		background-repeat:
			no-repeat,
			no-repeat;
		background-position:
			top,
			bottom;
	}
	div.comicArea > div {
		background: #FFFFFF;
	}
	div.comicArea aside { text-align: center; margin-top: 10px; }
	div.comicArea div.comicBox {
		background: #FFFFFF;
		border-radius: 10px;
		margin: 10px 15px 0;
		padding: 20px;
	}
		div.comicBox div.comicDetail { }
		div.comicBox div.comicDetail dl {
			display: table;
			position: relative; /* 立読・購入ボタン用 */
		}
		/* サムネイル */
		div.comicBox div.comicDetail dt.pict {
			display: table-cell;
		}
		div.comicBox div.comicDetail dt.pict figure {
			display: table;
			margin-right: 15px;
		}
		div.comicBox div.comicDetail dt.pict figure a {
			display: table-cell;
		}
		/* 詳細 */
		div.comicBox div.comicDetail dd.detail {
			display: table-cell;
			vertical-align: top;
		}
		div.comicBox div.comicDetail dd.detail figcaption {
			font-size: 18px;
			font-weight: bold;
		}
		div.comicBox div.comicDetail dd.detail p {
			font-size: 15px;
		}
		div.comicBox div.comicDetail dd.detail p.author_name {
		}
		div.comicBox div.comicDetail dd.detail p.intro {
			margin-top: 10px;
			padding-bottom: 40px; /* 立読・購入ボタン用 */
		}
		div.comicBox div.comicDetail dd.btnBox {
			position: absolute;
			bottom: 0px;
			right: 0px;
		}
			dd.btnBox ul::after {
				content: ""; display: block; clear: both;
			}
			dd.btnBox ul li {
				float: left;
				display: table;
			}
			dd.btnBox ul li a {
				font-size: 15px;
				font-weight: bold;
				display: table-cell;
				text-align: center;
				vertical-align: middle;
				padding: 5px 20px;
			}
			/* 立ち読みボタン */
			dd.btnBox ul li.freeBtn { }
			dd.btnBox ul li.freeBtn a {
				background: #DDDDDD;
				color: #333333;
				border: none;
			}
			dd.btnBox ul li.freeBtn a:hover {
				background: #E3E3E3;
				text-decoration: none;
			}
			/* 購入ボタン */
			dd.btnBox ul li.buyBtn {
				margin-left: 5px;
			}
			dd.btnBox ul li.buyBtn span.arrow {
				display: inline-block;
				border-style: solid;
				border-width: 5px 0 6px 7px;
				border-color: transparent transparent transparent #000000;
				-webkit-box-sizing: border-box;
				-moz-box-sizing: border-box;
				-ms-box-sizing: border-box;
				box-sizing: border-box;
				margin-left: 10px;		
			}
			dd.btnBox ul li.buyBtn a {
				background: #CA0A15;
				color: #000000;
				border: none;
			}
			dd.btnBox ul li.buyBtn a:hover {
				background: #B40A12;
				text-decoration: none;
			}

/* 出版社キャンペーン */
div.camPrBox {
	width: 96%;
	margin: 0 auto;
	text-align: center;
}

/* 原作者サイン色紙 */
div.signBox {
	width: 96%;
	margin: 15px auto 0;
	font-size: 14px;
	background: #FFEAEB;
	padding: 10px;
}

div.signBig {
	display: none;
}
div.signBigBody{
	position: fixed;
	z-index: 10000;
	background: #000;
	width: 510px;
	left: 50%;
	top: 50%;
	height: 530px;
}
div.screenBk{
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	height: 100%;
	width: 100%;
	background: #000;
	opacity: 0.9;
	filter: alpha(opacity=90);
	-moz-opacity: 0.90;
}
p.zoomText,
.close {
	cursor: pointer;
}

div.signBox figure {
	margin-top: 10px;
}
div.signBox figure img {
	width: auto;
	margin: 0 auto;
	display: block;
}
div.signBox p.zoomText {
	margin-top: 3px;
	text-align: center;
}
div.signBigBody p.close {
	color: #FFFFFF;
}

/* presentBlock
------------------------------------------------------------- */
section.presentBlock {
	margin-top: 50px !important;
}
section.presentBlock::after {
	content: "";
	display: block;
	clear: both;
}
section.presentBlock h2 {
	/* padding: 5px 10px; テキスト時のみ追加 */
}
	div.presentBox {
		width: 696px;
		margin: 60px auto 0;
		padding: 5px 0;
		background: rgba(255,255,255,0.6);
	}
	section.end div.presentBox {
		margin: 10px auto 0;
	}

	div.presentBox h3 { position: relative; }
	div.presentBox h3 span {
		width: auto;
		position: absolute;
	}
	span.move {
		overflow: hidden;
	}
		section.presentVol1	h3 span {
			top: -45px;
			left: -10px;
		}
		section.presentVol1	h3 span + span {
			top: -45px;
			left: auto;
			right: -10px;
		}
		section.presentVol2 h3 span {
			top: -45px;
			right: -25px;
		}
		section.presentVol2 h3 > img {
			margin: -20px 0 0 -40px;
		}
		section.end h3 > img {
			margin: 0;
		}
		section.presentVol3 h3 span {
			top: -45px;
			left: -10px;
		}
	div.presentBox div.entryDetail {
		margin-top: -6px;
		padding: 20px 0 30px;
	}
	div.presentBox div.empty {
		padding: 0;
		height: 20px;
	}
		section.presentVol2 div.empty {
			padding: 0;
			height: 0;
		}
	div.presentBox div.entryDetail > p {
		font-size: 20px;
		color: #E95504;
		font-weight: bold;
		margin-top: -10px;
		line-height: 1 !important;
	}
	div.presentBox div.entryDetail > p * {
		font-size: 14px;
		font-weight: normal;
		color: #E95504;
		line-height: 1 !important;
	}
	div.presentBox div.entryDetail dl {
		font-size: 14px;
		text-align: left;
		display: table;
		margin: 15px 0 0 100px;
	}

	div.presentBox div.entryDetail dt {
		font-weight: bold;
		display: table-cell;
		padding-right: 15px;
	}
	div.presentBox div.entryDetail dt::after {
		display: inline-block;
		margin-left: 15px;
		content: "：";
	}
	div.presentBox div.entryDetail dd {
		display: table-cell;
	}
	
	/* vol1 */
	section.presentVol1 div.entryDetail > p {
		text-align: right;
		margin-right: 15px
	}
	section.presentVol1 ul.entry {
		margin-top: 5px;
	}
	
	/* vol2 */
	section.presentVol2 div.entryDetail > p {
		text-align: left;
		margin-left: 25px;
	}
	section.presentVol2 ul.entry {
		margin-top: 5px;
	}

	/* vol3 */
	section.presentVol3 div.entryDetail > p {
		text-align: left;
		margin-left: 25px;
	}
	section.presentVol3 ul.entry {
		margin-top: 5px;
	}

/*
	section.presentVol2 div.entryDetail ul {
		display: table;
		margin: 20px auto 0;
	}
	section.presentVol2 div.entryDetail ul li {
		width: 50%;
		display: table-cell;
		padding: 0 15px;
	}
*/
	
	/* 終了時 */
	section.end div.presentBox {
		background: none;
	}
	
	/* btnArea
	------------------------------------------------------------- */
	div.btnArea {
		margin-top: 20px;
	}
	div.btnArea > p {
		font-size: 18px;
		font-weight: bold;
		color: #333333;
	}
	
	/* entryArea 応募ボタン
	------------------------------------------------------------- */
	ul.entry {
		display: table;
		width: 696px;
		margin: 10px auto 0;
	}
	/* プレゼント1 -応募1つ- */
	section.presentVol1 ul.entry li {
		width: 50%;
		display: table-cell;
		text-align: center;
	}
	section.presentVol2 ul.entry li {
		width: 50%;
		display: table-cell;
		text-align: center;
	}
	/* プレゼント2 -応募2つ- */
	section.presentVol3 ul.entry li {
		width: 33%;
		display: table-cell;
		text-align: center;
	}
	
	ul.entry li a {
		display: inline-block;
		cursor: pointer;
	}
	ul.entry li a img {
		width: auto;
	}
	
	/* nonMember 非会員時
	------------------------------------------------------------- */
	ul.nonMember {
		display: table;
		width: 696px;
		margin: 10px auto 0;
	}
	ul.nonMember li {
		width: 50%;
		display: table-cell;
		vertical-align: middle;
		text-align: center;
	}
	ul.nonMember li a {
		display: inline-block;
	}
	ul.nonMember li a img {
		width: auto;
	}
	
/* outlineBlock
------------------------------------------------------------- */
section.outlineBlock {
	text-align: left;
	padding: 35px 0;
	background-image:
		url(../images/contentBgTop.png),
		url(../images/contentBgBottom.png);
	background-repeat:
		no-repeat,
		no-repeat;
	background-position:
		top,
		bottom;
}
section.outlineBlock h2 {
	/* padding: 5px 10px;  テキスト時のみ追加 */
	/* display: none; */
}
section.outlineBlock div.bgBox {
	background: #FFFFFF;
	padding: 10px 20px;
}
section.outlineBlock a {
	text-decoration: underline;
}
section.outlineBlock > div.bgBox section + section {
	margin-top: 10px;
}
section.outlineBlock > div.bgBox section h3 {
	color: #000000;
	font-size: 20px;
	font-weight: bold;
	border-bottom: #000000 solid 2px;
	margin-bottom: 10px;
}
section.outlineBlock > div.bgBox section dt {
	font-size: 14px;
	font-weight: bold;
}

section.outlineBlock > div.bgBox section.outline01 { }
section.outlineBlock > div.bgBox section.outline02 { }
section.outlineBlock > div.bgBox section.outline02 li + li {
	margin-top: 10px;
}
section.outlineBlock > div.bgBox section.outline03 { }
section.outlineBlock > div.bgBox section.outline04 { }

/* リストの記号 */
section.outlineBlock > div.bgBox ul.attention li::before { content: "※"; }
section.outlineBlock > div.bgBox ul.list li::before { content: "・"; }

section.outlineBlock > div.bgBox ul.attention li::before,
section.outlineBlock > div.bgBox ul.list li::before {
	display: inline-block;
	text-indent: -1.2em;
}

section.outlineBlock > div.bgBox ul.attention li { margin-left: 1.2em; }
section.outlineBlock > div.bgBox ul.list li { margin-left: 2.4em; }

/* snsBlock
------------------------------------------------------------- */
/* snsボタンの背景 */
aside.snsBlock {
	background: #FFFFFF;
}