@charset "UTF-8";

article { box-sizing: border-box; }
article img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;/* 画像下のスペースを消す */
}
article.collection {
  background-color: #fff;
}
/**
 * ***************************************
 * トップバナー
 * ***************************************
 */
.topbanner {
	margin-bottom: 2rem;
}
.topbanner h1{
	margin-bottom: 1rem;
}
.topbanner p{
	font-size: 1.5rem;
    line-height: 1.2;
	text-align: center;
	width: 90%;
	margin: 0 auto 0.5rem;
}
.camPeriod {color: #c60000; font-size: 1rem!important; font-weight: bold;}
.camPeriod span {font-size: .8rem;}
/**
 * ***************************************
 * ストーリー
 * ***************************************
 */
.prologue {width: 90%; margin: 0 auto; }
.prologue p {
    background: url(https://c.mangaplaza.com/common/special/20240308-tosir/images/img0-left.png) left top no-repeat, url(https://c.mangaplaza.com/common/special/20240308-tosir/images/img0-right.png) right bottom no-repeat;
    padding: 2rem;
    color: #bb6ea9;
    font-size: 1.2rem;
    font-weight: bold;
    line-height: 1.5rem;
    text-align: center;
}
.story {
    background-color: #ffeaf2;
	margin-bottom: 2rem;
}
.story .gradation {background: linear-gradient(#ffffff, #ffeaf2); height: 3rem; }
.story p { 
    width: 90%;
    margin: 0 auto 2rem;
    color: #bb6ea9;
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 1.8rem;
}
.story .textLeft { text-align: left; padding-right: 3rem;}
.story .textRight { text-align: right; padding-left: 3rem;}
.story .textCenter { text-align: center;}
.story .image { text-align: center; }
.story .copyright {
    text-align: center!important;
    font-size: 0.8rem!important;
	color: #636363!important;
    padding-bottom: 0.5rem;
}
/**
 * ***************************************
 * タイトル詳細
 * ***************************************
 */
.detail { width: 90%; margin: 0 auto 2rem; }
.mangaDetail img {
  width: 100%;
  height: auto;
  vertical-align: bottom;/* 画像下のスペースを消す */
}
.mangaDetail {
	width: 45%;
	margin: 0px auto;
	margin-bottom: 1rem;
}
.cover {}
.cover p {color: #000; background: #ffa904; font-weight: bold; padding: 0.2rem; text-align: center}
.title {
	text-align: center;
	margin-bottom: 1rem;
}
.title h2 {
	font-size: 1.8rem;
	margin-bottom: 0.6rem;
	line-height: 2.3rem;
	text-decoration: underline;
}
.title h3 {
	margin-top: 0.5rem;
	font-size: 1.2rem;
}
.btnBox a {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  position: relative;
  width: 60%;
  height: 3em;
  margin: 10px auto;
  border-radius: 1.5em;
  font-size: 1.1em;
  font-weight: bold;
  line-height: 3em;
  text-align: center;
}
.btnBox .btnWhite {
  border: 1px solid #C7C7C7;
  background: #fff;
}
.authorName, .genreBlock {
	margin-bottom: 0.6rem;
}
.authorName a,
.genreBlock a{
    -webkit-font-feature-settings: "palt";
    font-feature-settings: "palt";
    font-size: 1.3rem;
	line-height: 1.8rem;
	text-decoration: underline;
}
.genreBlock a {margin-right: 1rem;}
.genreBlock a:before {content:"#";}

.disArea {width:90%;max-width:990px;padding:0.5rem 0.5rem 0.2rem;margin:2rem auto;border:solid 1px #fff;line-height: 1.3;}
.disArea a {text-decoration: underline;}

.mangaInfo .saleBlock {
    display: inline-block;
    padding: 0.3rem;
    background: #c60000;
    color: #fff;
    font-size: 1.2rem;
}

.endArea {width:90%;max-width:990px;margin: 0 auto 1rem;}
.endTitle {text-align: left;font-weight: bold;font-size: 1.5rem;line-height: 1.7rem;margin-bottom: 1rem}
.endtxt {text-align: left;font-size: 1.5rem;line-height: 1.7rem;}

.resArea * {-webkit-box-sizing: border-box;box-sizing: border-box;}
.resArea p{margin-bottom: 0.5rem}
.linkArea {display: grid;grid-template-columns: repeat(3, 1fr);grid-template-rows: 1fr;grid-column-gap: 10px;grid-row-gap: 10px;}
.endlinkArea {display: grid;grid-template-columns: repeat(2, 1fr);grid-template-rows: 1fr;grid-column-gap: 10px;grid-row-gap: 10px;}
@media screen and (max-width: 550px) {
	.linkArea {grid-template-columns: 1fr;}
	.endlinkArea {grid-template-columns: 1fr;}
}
.linkArea .btnBlock a,
.endlinkArea .btnBlock a{-webkit-font-feature-settings: "palt";display: block;padding: 1rem 1.6rem;border-radius: 2rem;background: #fff;color: #000;font-feature-settings: "palt";font-size: 1.1rem;font-weight: bold;text-align: center;}
.linkArea .btnBlock a span,
.endlinkArea .btnBlock a span{display: inline-block;}
.linkArea .btnBlock a:hover,
.endlinkArea .btnBlock a:hover{opacity: .7;}
.color_rd {color: #f00;}
.w_b {font-weight: bold;}