@charset "UTF-8";
/*
 original.css（ファイル名変更可）
 本サイト各ページ用CSS
*/

.d-box-body{
	background-color: #000000;
	width: 100%;
	margin: 1.5% auto 15%;
	padding: 15% 0 10%;
	min-height: 500px;
	-webkit-transform: skewY(-10deg);
	-moz-transform: skewY(-10deg);
	-o-transform: skewY(-10deg);
}

#original.d-area {
	margin: 30px auto 60px;
	font-family: Georgia, "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	transform: rotate(0.05deg);
}


.original-inner .d-box-body .original-overview{
	color: #ffffff;
	-webkit-transform: skewY(10deg);
	-moz-transform: skewY(10deg);
	-o-transform: skewY(10deg);
}

.original-inner h2.d-box-title{
	margin-left: auto;
	margin-right: 6%;
	width: 100%;
	max-width: 296px;
	height: auto;
	max-height: 119px;
	padding-top: calc(119 / 1000 * 100%);
	background-image: url("../images/original/title.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: right;
	overflow: hidden;
	font-size: 0;
	position: relative;
	z-index: 100;
}

.original-overview-box{
	width: 90%;
	margin: 0 auto;
	padding: 1% 0;
	-webkit-transform: skewY(-10deg);
	-moz-transform: skewY(-10deg);
	-o-transform: skewY(-10deg);
	min-height: 300px;
}

#original-2019{
	background-color: #770010;
	margin-bottom: 5%;

}

#original-hulu{
	background-color: #770010;
	margin-bottom: 5%;

}

#original-series{
	background-color: #380000;
}

#original-2019 h3{
	font-size: 3rem;
	color: #f6e093;
	text-align: right;
	font-family: Georgia, "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	transform: rotate(0.05deg);
	border-top: 2px solid #f6e093;
	border-bottom: 2px solid #f6e093;
	line-height: 140%;
	padding: 10px;
}

#original-2019 .original-overview-inner{
	width: 100%;
	margin: 0 auto;
	padding: 5% 0 10% 0;
	display: flex;
	flex-flow: row-reverse wrap;
	align-items: flex-end;
	justify-content: center;
	align-content: flex-end;
}

#original-2019-image{
	width: 48%;
	margin-left: 2%;
}

#original-2019-image img{
	width: 70%;
}

#original-2019-txt{
	width: 48%;
	margin-right: 2%;
	text-align: right;

}

#original-2019-txt h4{
	font-size: 3rem;
}
#original-2019-txt p{
	font-size: 1.4rem;
	color: #f6e093;
}


#original-hulu-txt h4{
	font-size: 3rem;
}
#original-hulu-txt p{
	font-size: 1.4rem;
	color: #f6e093;
}

#original-hulu h3{
	font-size: 2.6rem;
	color: #f6e093;
	text-align: right;
	font-family: Georgia, "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	transform: rotate(0.05deg);
	border-top: 2px solid #f6e093;
	border-bottom: 2px solid #f6e093;
	line-height: 140%;
	padding: 10px;
}

#original-hulu .original-overview-inner{
	width: 100%;
	margin: 0 auto;
	padding: 5% 0 10% 0;
	display: flex;
	flex-flow: row-reverse wrap;
	align-items: flex-end;
	justify-content: center;
	align-content: flex-end;
}

#original-hulu-image{
	width: 48%;
	margin-left: 2%;
}

#original-hulu-image img{
	width: 70%;
}

#original-hulu-txt{
	width: 48%;
	margin-right: 2%;
	text-align: right;

}

#original-hulu-txt h4{
	font-size: 3rem;
}
#original-hulu-txt p{
	font-size: 1.4rem;
	color: #f6e093;
}

.original-overview-inner{
	-webkit-transform: skewY(10deg);
	-moz-transform: skewY(10deg);
	-o-transform: skewY(10deg);
}

#original-series{
	padding: 50px 0 100px 0;
}

#original-series h3#series-txt{
	font-size: 0;
	width: 100%;
	max-width: 570px;
	height: auto;
	max-height: 114px;
	padding-top: calc(114 / 1000 * 100%);
	background-image: url("../images/original/series-txt.jpg");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	overflow: hidden;
	margin: 3% auto;
}

#series-image{
	font-size: 0;
	width: 100%;
	max-width: 608px;
	height: auto;
	max-height: 404px;
	padding-top: calc(404 / 1000 * 100%);
	background-image: url("../images/original/book.jpg");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	overflow: hidden;
	margin: 0 auto;
}

#series-txt{
	margin: 20px 2% 30px;
	text-align: center;
}

#original_profile{
	background-color: #000000;
	width: 80%;
	margin: 0 auto;
	padding: 15px;
}

#original_profile h3{
	font-size: 3rem;
	border-top: 1px solid #ffffff;
	border-bottom: 1px solid #ffffff;
}

#original_profile h3 span{
	font-size: 1.4rem;
}

#original_profile p{
	margin: 20px 0;
}


#original_profile #comment{
	background-color: #ffffff;
	color: #000000;
	padding: 10px;
}

#original_profile #comment h4{
	font-size: 1.8rem;
}

/* ---------------------------------
 SP（〜600px）
--------------------------------- */
@media only screen and (max-width: 600px) {

#original.d-area {
	margin: 0 auto 60px;
}

#original-2019 h3,
#original-hulu h3{
	font-size: 2rem;
	}
#original-2019-image,
#original-hulu-image{
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	padding: 5% 0 2%;
}

#original-2019-image img,
#original-hulu-image img{
	width: 50%;
}

#original-2019-txt,
#original-hulu-txt{
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	text-align: center;

}

#original-2019-txt h4,
#original-hulu-txt h4{
	font-size: 2rem;
}
#original-2019-txt p,
#original-hulu-txt p{
	font-size: 1.4rem;

}

#original-series h3#series-txt{
	padding-top: calc(114 / 570 * 95%);
}
#series-image{
	padding-top: calc(404 / 608 * 95%);
}
	
#original_profile h3{
	font-size: 2rem;
}
#original_profile{
	background-color: #000000;
	width: 95%;
}

	
}

/* ------------------------------------------------------------------
 SP 〜 tablet（〜992px）
------------------------------------------------------------------ */
@media screen and (max-width: 992px) {
}

/* ---------------------------------
 PC（993px〜）
--------------------------------- */
@media screen and (min-width: 993px) {
}