@charset "UTF-8";
@media screen and (max-width: 767px) {
 #manga .mainimg-sec {
  padding: 20px 0;
 }
}
#manga .mainimg-sec .mainimg-bg {
 background: url("../img/common/ttl_bg001.png") repeat-x left top 30px;
 padding-bottom: 15px;
}
@media screen and (max-width: 767px) {
 #manga .mainimg-sec .mainimg-bg {
  margin-bottom: 4.347826087%;
  padding: 4.347826087% 0 4.347826087%;
  background: url("../img/common/sp/ttl_bg001.png") repeat-x left top 0;
 }
}
#manga .mainimg-sec .mainimg-ttl .mainimg-heading {
 margin-top: -10px;
 text-align: center;
}
@media screen and (max-width: 767px) {
 #manga .mainimg-sec .mainimg-ttl .mainimg-heading {
  width: 100%;
  margin: 0 auto;
 }
}

/*　トップ　*/
.idx {
 margin-bottom: 50px;
}
.idx .mainimg-sec {
 padding: 20px 0 40px;
 background-color: #efe6ff;
}
.idx .mainimg-sec .mainimg-ttl {
 position: relative;
}
.idx .mainimg-sec .mainimg-ttl p {
 position: absolute;
 top: 0;
 left: 0;
}
.idx .mainimg-sec .mainimg-heading {
 width: 51.3333333333%;
 margin-left: 30%;
}
@media screen and (max-width: 767px) {
 .idx .mainimg-sec .mainimg-heading {
  margin-left: 0;
 }
}
.idx .manga-list {
 padding-bottom: 55px;
 background-color: #efe6ff;
}
.idx .manga-list ul {
 display: flex;
 justify-content: center;
 flex-wrap: wrap;
}
@media screen and (max-width: 980px) {
 .idx .manga-list ul {
  display: block;
 }
}
.idx .manga-list ul li {
 width: 31.5%;
 margin-right: 2.5%;
 margin-bottom: 25px;
 padding: 15px 15px 20px;
 background-color: #fff;
 background-position: right top;
 background-repeat: no-repeat;
}
@media screen and (max-width: 980px) {
 .idx .manga-list ul li {
  width: 100%;
  margin-right: 0;
 }
}
.idx .manga-list ul li div {
 display: flex;
 justify-content: space-between;
 margin-bottom: 15px;
}
@media screen and (max-width: 980px) {
 .idx .manga-list ul li div {
  align-items: center;
 }
}
.idx .manga-list ul li figure {
 width: 44.2528735632%;
}
.idx .manga-list ul li dl {
 width: 54.5977011494%;
}
.idx .manga-list ul li dl dt {
 margin-bottom: 15px;
 text-align: center;
}
.idx .manga-list ul li dl dd {
 font-size: 1.7rem;
 text-align: center;
}
@media screen and (max-width: 767px) {
 .idx .manga-list ul li dl dd {
  font-size: 1.5rem;
  text-align: center;
 }
}
.idx .manga-list ul li p {
 width: 54.0229885057%;
 margin: 0 auto;
 border-radius: 40px;
}
.idx .manga-list ul li p a {
 display: block;
 padding: 5px 10px;
 text-decoration: none;
 background-position: right 20px center;
 background-repeat: no-repeat;
 text-align: center;
 font-size: 1.6rem;
 font-weight: normal;
}
@media screen and (max-width: 767px) {
 .idx .manga-list ul li p a {
  font-size: 1.4rem;
 }
}
.idx .manga-list ul li:nth-child(3n) {
 margin-right: 0;
}
.idx .manga-list ul li:nth-child(1) {
 background-image: url("../img/manga/idx/type_a_i001.png");
}
.idx .manga-list ul li:nth-child(1) p {
 border: 1px solid #215ec3;
}
.idx .manga-list ul li:nth-child(1) p a {
 background-image: url("../img/manga/idx/type_a_i002.png");
}
.idx .manga-list ul li:nth-child(2) {
 background-image: url("../img/manga/idx/type_b_i001.png");
}
.idx .manga-list ul li:nth-child(2) p {
 border: 1px solid #006e00;
}
.idx .manga-list ul li:nth-child(2) p a {
 background-image: url("../img/manga/idx/type_b_i002.png");
}
.idx .manga-list ul li:nth-child(3) {
 background-image: url("../img/manga/idx/type_c_i001.png");
}
.idx .manga-list ul li:nth-child(3) p {
 border: 1px solid #1a1c71;
}
.idx .manga-list ul li:nth-child(3) p a {
 background-image: url("../img/manga/idx/type_c_i002.png");
}
.idx .manga-list ul li:nth-child(4) {
 background-image: url("../img/manga/idx/type_d_i001.png");
}
.idx .manga-list ul li:nth-child(4) p {
 border: 1px solid #820200;
}
.idx .manga-list ul li:nth-child(4) p a {
 background-image: url("../img/manga/idx/type_d_i002.png");
}
.idx .manga-list ul li:nth-child(5) {
 background-image: url("../img/manga/idx/type_e_i001.png");
}
.idx .manga-list ul li:nth-child(5) p {
 border: 1px solid #6723a7;
}
.idx .manga-list ul li:nth-child(5) p a {
 background-image: url("../img/manga/idx/type_e_i002.png");
}

/*　ストーリー　*/
.story {
 margin-bottom: 50px;
}
.story .mainimg-sec {
 padding: 20px 0 40px;
}
.story .mainimg-sec .mainimg-ttl {
 position: relative;
}
.story .mainimg-sec .story-back {
 position: absolute;
 top: 50px;
 left: 0;
 width: 15%;
 line-height: 1;
}
@media screen and (max-width: 980px) {
 .story .mainimg-sec .story-back {
  top: -10px;
  width: 23.3333333333%;
 }
}
@media screen and (max-width: 767px) {
 .story .mainimg-sec .story-back {
  position: static;
  width: 53.3333333333%;
  margin: 30px auto 0;
 }
}
.story .mainimg-sec .story-back a {
 display: block;
 text-decoration: none;
 font-weight: normal;
 padding: 15px 5px;
 background-image: url("../img/common/back_i002.png");
 background-repeat: no-repeat;
 font-size: 1.6rem;
 background-position: left 15px center;
 text-align: center;
 color: #fff;
 border-radius: 40px;
}
@media screen and (max-width: 767px) {
 .story .mainimg-sec .story-back a {
  font-size: 1.4rem;
 }
}
.story .mainimg-sec .mainimg-heading {
 margin: 0 auto;
}
.story .story-top {
 margin-bottom: 35px;
}
.story .story-top .story-top-box {
 position: relative;
 display: flex;
 justify-content: center;
 align-items: center;
}
.story .story-top .story-top-heading {
 margin: 0 70px;
 text-align: center;
}
@media screen and (max-width: 767px) {
 .story .story-top .story-top-heading {
  margin: 0 20px;
 }
}
.story .story-top .story-top-btn {
 width: 16%;
}
@media screen and (max-width: 980px) {
 .story .story-top .story-top-btn {
  width: 24.1666666667%;
 }
}
@media screen and (max-width: 767px) {
 .story .story-top .story-top-btn {
  width: 42.0289855072%;
 }
}
.story .story-top .story-top-btn a {
 display: block;
 text-decoration: none;
 padding: 10px 15px;
 background-color: #fff;
 font-size: 1.8rem;
 text-align: center;
 border-radius: 40px;
}
@media screen and (max-width: 767px) {
 .story .story-top .story-top-btn a {
  font-size: 1rem;
 }
}
.story .story-top .story-top-btn.story-top-prev a {
 background-position: left 15px center;
 background-repeat: no-repeat;
 font-weight: normal;
}
@media screen and (max-width: 767px) {
 .story .story-top .story-top-btn.story-top-prev a {
  background-position: left 5px center;
 }
}
.story .story-top .story-top-btn.story-top-next a {
 background-position: right 15px center;
 background-repeat: no-repeat;
 font-weight: normal;
}
@media screen and (max-width: 767px) {
 .story .story-top .story-top-btn.story-top-next a {
  background-position: right 5px center;
 }
}
.story .story-main {
 margin-bottom: 60px;
}
.story .story-main .story-main-heading {
 margin-bottom: 40px;
 font-size: 3rem;
 text-align: center;
 font-weight: 700;
}
@media screen and (max-width: 767px) {
 .story .story-main .story-main-heading {
  font-size: 1.7rem;
 }
}
.story .story-main .story-main-box {
 position: relative;
 width: 52.5%;
 margin: 0 auto;
}
@media screen and (max-width: 767px) {
 .story .story-main .story-main-box {
  width: 90%;
 }
}
.story .story-main .story-main-box li {
 background-color: #fff;
 padding: 18px;
}
@media screen and (max-width: 767px) {
 .story .story-main .story-main-box li.story-main-pic {
  display: flex !important;
  align-items: center;
 }
}
.story .story-main .story-main-box .story-main-box-ttl {
 display: flex;
 align-items: center;
 justify-content: center;
 margin-bottom: 20px;
}
.story .story-main .story-main-box .story-main-box-ttl .story-main-box-heading {
 margin-left: 10px;
 background: linear-gradient(transparent 60%, #fffa14 60%);
 font-size: 1.625rem;
}
@media screen and (max-width: 767px) {
 .story .story-main .story-main-box .story-main-box-ttl .story-main-box-heading {
  font-size: 1rem;
 }
}
.story .story-main .story-main-box .lifestyle-point-list {
 display: flex;
 flex-wrap: wrap;
}
.story .story-main .story-main-box .lifestyle-point-list .lifestyle-point-list-con {
 width: 46.9696969697%;
 margin-right: 5.0505050505%;
 margin-bottom: 20px;
 background-color: #f1f3f6;
 border-radius: 10px;
 -webkit-border-radius: 10px;
 -moz-border-radius: 10px;
}
.story .story-main .story-main-box .lifestyle-point-list .lifestyle-point-list-con:nth-child(2n) {
 margin-right: 0;
}
.story .story-main .story-main-box .lifestyle-point-list .lifestyle-point-list-con .lifestyle-point-list-heading {
 padding: 5px;
 background-color: #ff7d00;
 font-size: 1.25rem;
 text-align: center;
 font-weight: 500;
 color: #fff;
 -webkit-border-top-left-radius: 10px;
 -webkit-border-top-right-radius: 10px;
 -moz-border-radius-topleft: 10px;
 -moz-border-radius-topright: 10px;
}
@media screen and (max-width: 767px) {
 .story .story-main .story-main-box .lifestyle-point-list .lifestyle-point-list-con .lifestyle-point-list-heading {
  font-size: 0.875rem;
 }
}
.story .story-main .story-main-box .lifestyle-point-list .lifestyle-point-list-con .lifestyle-point-list-box {
 padding: 30px 25px 15px;
}
@media screen and (max-width: 767px) {
 .story .story-main .story-main-box .lifestyle-point-list .lifestyle-point-list-con .lifestyle-point-list-box {
  padding: 15px 10px 15px;
 }
}
.story .story-main .story-main-box .lifestyle-point-list .lifestyle-point-list-con .lifestyle-point-list-fig {
 display: flex;
 align-items: center;
 justify-content: center;
 margin-bottom: 20px;
}
.story .story-main .story-main-box .lifestyle-point-list .lifestyle-point-list-con .lifestyle-point-list-lead {
 font-weight: 400;
 font-size: 1.8rem;
}
.story .story-main .story-main-box .lifestyle-point-list .lifestyle-point-list-con .lifestyle-point-list-lead sup {
 vertical-align: top;
 font-size: 0.625rem;
}
.story .story-main .story-main-box .lifestyle-point-list .lifestyle-point-list-con .lifestyle-point-list-lead small {
 font-size: 0.6875rem;
}
.story .story-main .story-main-box .lifestyle-point-list .lifestyle-point-list-con .lifestyle-point-list-txt {
 margin-top: 15px;
 padding-top: 15px;
 border-top: 1px solid #fff;
 font-size: 0.6875rem;
 font-weight: 400;
 text-align: center;
}
.story .story-main .story-main-box .slide-btn {
 position: absolute;
 top: 50%;
 margin-top: -40px;
 cursor: pointer;
}
@media screen and (max-width: 767px) {
 .story .story-main .story-main-box .slide-btn {
  width: 40px;
  margin-top: -20px;
 }
}
.story .story-main .story-main-box .slide-btn:hover {
 opacity: 0.7;
}
.story .story-main .story-main-box .slide-btn.slide-prev {
 left: -80px;
}
@media screen and (max-width: 767px) {
 .story .story-main .story-main-box .slide-btn.slide-prev {
  left: -20px;
 }
}
.story .story-main .story-main-box .slide-btn.slide-next {
 right: -80px;
}
@media screen and (max-width: 767px) {
 .story .story-main .story-main-box .slide-btn.slide-next {
  right: -20px;
 }
}
.story .story-nav ul {
 display: flex;
 justify-content: center;
 flex-wrap: wrap;
}
.story .story-nav ul li {
 width: 31.5%;
 margin-right: 2.5%;
 margin-bottom: 25px;
 padding: 15px;
 background-color: #fff;
 background-position: right top;
 background-repeat: no-repeat;
}
@media screen and (max-width: 980px) {
 .story .story-nav ul li {
  width: 100%;
  margin-right: 0;
 }
}
.story .story-nav ul li a {
 display: flex;
 justify-content: space-between;
 text-decoration: none;
}
@media screen and (max-width: 980px) {
 .story .story-nav ul li a {
  align-items: center;
 }
}
.story .story-nav ul li a:hover {
 opacity: 0.7;
}
.story .story-nav ul li figure {
 width: 44.2528735632%;
}
.story .story-nav ul li dl {
 width: 54.5977011494%;
}
.story .story-nav ul li dl dt {
 margin-bottom: 15px;
 text-align: center;
}
.story .story-nav ul li dl dd {
 font-size: 1.6rem;
 font-weight: normal;
 text-align: center;
}
@media screen and (max-width: 767px) {
 .story .story-nav ul li dl dd {
  font-size: 1.4rem;
  font-weight: normal;
  text-align: center;
 }
}
.story .story-nav ul li:nth-child(3n) {
 margin-right: 0;
}
.story .story-nav ul li:nth-child(1) {
 background-image: url("../img/manga/idx/type_a_i001.png");
}
.story .story-nav ul li:nth-child(1):hover {
 border: 3px solid #215ec3;
}
.story .story-nav ul li:nth-child(1) p {
 border: 1px solid #215ec3;
}
.story .story-nav ul li:nth-child(1) p a {
 background-image: url("../img/manga/idx/type_a_i002.png");
}
.story .story-nav ul li:nth-child(2) {
 background-image: url("../img/manga/idx/type_b_i001.png");
}
.story .story-nav ul li:nth-child(2):hover {
 border: 3px solid #006e00;
}
.story .story-nav ul li:nth-child(2) p {
 border: 1px solid #006e00;
}
.story .story-nav ul li:nth-child(2) p a {
 background-image: url("../img/manga/idx/type_b_i002.png");
}
.story .story-nav ul li:nth-child(3) {
 background-image: url("../img/manga/idx/type_c_i001.png");
}
.story .story-nav ul li:nth-child(3):hover {
 border: 3px solid #1a1c71;
}
.story .story-nav ul li:nth-child(3) p {
 border: 1px solid #1a1c71;
}
.story .story-nav ul li:nth-child(3) p a {
 background-image: url("../img/manga/idx/type_c_i002.png");
}
.story .story-nav ul li:nth-child(4) {
 background-image: url("../img/manga/idx/type_d_i001.png");
}
.story .story-nav ul li:nth-child(4):hover {
 border: 3px solid #820200;
}
.story .story-nav ul li:nth-child(4) p {
 border: 1px solid #820200;
}
.story .story-nav ul li:nth-child(4) p a {
 background-image: url("../img/manga/idx/type_d_i002.png");
}
.story .story-nav ul li:nth-child(5) {
 background-image: url("../img/manga/idx/type_e_i001.png");
}
.story .story-nav ul li:nth-child(5):hover {
 border: 3px solid #6723a7;
}
.story .story-nav ul li:nth-child(5) p {
 border: 1px solid #6723a7;
}
.story .story-nav ul li:nth-child(5) p a {
 background-image: url("../img/manga/idx/type_e_i002.png");
}

.story_a {
 background-color: #d9f6fa;
}
.story_a .mainimg-sec .story-back a {
 background-color: #215ec3;
}
@media screen and (max-width: 500px) {
 .story_a .story-top .story-top-heading {
  width: 23%;
 }
}
@media screen and (max-width: 767px) {
 .story_a .story-top .story-top-btn {
  width: 36.231884058%;
 }
}
@media screen and (max-width: 500px) {
 .story_a .story-top .story-top-btn {
  width: 32.6086956522%;
 }
}
.story_a .story-top .story-top-btn a {
 border: 1px solid #215ec3;
}
.story_a .story-top .story-top-btn.story-top-prev a {
 background-image: url("../img/manga/story_a/arrow_i001.png");
}
.story_a .story-top .story-top-btn.story-top-next {
 margin-right: -16%;
}
@media screen and (max-width: 767px) {
 .story_a .story-top .story-top-btn.story-top-next {
  margin-right: -32%;
 }
}
.story_a .story-top .story-top-btn.story-top-next a {
 background-image: url("../img/manga/story_a/arrow_i002.png");
}
.story_a .story-nav ul li.active {
 border: 3px solid #215ec3;
}

.story_b {
 background-color: #f9fad2;
}
.story_b .mainimg-sec .story-back a {
 background-color: #006e00;
}
.story_b .story-top .story-top-btn a {
 border: 1px solid #006e00;
}
.story_b .story-top .story-top-btn.story-top-prev a {
 background-image: url("../img/manga/story_b/arrow_i001.png");
}
.story_b .story-top .story-top-btn.story-top-next a {
 background-image: url("../img/manga/story_b/arrow_i002.png");
}
.story_b .story-nav ul li.active {
 border: 3px solid #006e00;
}

.story_c {
 background-color: #e0ecfa;
}
.story_c .mainimg-sec .story-back a {
 background-color: #1a1c71;
}
.story_c .story-top .story-top-btn a {
 border: 1px solid #1a1c71;
}
.story_c .story-top .story-top-btn.story-top-prev a {
 background-image: url("../img/manga/story_c/arrow_i001.png");
}
.story_c .story-top .story-top-btn.story-top-next a {
 background-image: url("../img/manga/story_c/arrow_i002.png");
}
.story_c .story-nav ul li.active {
 border: 3px solid #1a1c71;
}

.story_d {
 background-color: #ffebda;
}
.story_d .mainimg-sec .story-back a {
 background-color: #820200;
}
.story_d .story-top .story-top-btn a {
 border: 1px solid #820200;
}
.story_d .story-top .story-top-btn.story-top-prev a {
 background-image: url("../img/manga/story_d/arrow_i001.png");
}
.story_d .story-top .story-top-btn.story-top-next a {
 background-image: url("../img/manga/story_d/arrow_i002.png");
}
.story_d .story-nav ul li.active {
 border: 3px solid #820200;
}

.story_e {
 background-color: #ffeef8;
}
.story_e .mainimg-sec .story-back a {
 background-color: #6723a7;
}
@media screen and (max-width: 500px) {
 .story_e .story-top .story-top-heading {
  width: 23%;
 }
}
@media screen and (max-width: 767px) {
 .story_e .story-top .story-top-btn {
  width: 36.231884058%;
 }
}
@media screen and (max-width: 500px) {
 .story_e .story-top .story-top-btn {
  width: 32.6086956522%;
 }
}
.story_e .story-top .story-top-btn a {
 border: 1px solid #6723a7;
}
.story_e .story-top .story-top-btn.story-top-prev {
 margin-left: -16%;
}
@media screen and (max-width: 767px) {
 .story_e .story-top .story-top-btn.story-top-prev {
  margin-left: -32%;
 }
}
.story_e .story-top .story-top-btn.story-top-prev a {
 background-image: url("../img/manga/story_e/arrow_i001.png");
}
.story_e .story-top .story-top-btn.story-top-next a {
 background-image: url("../img/manga/story_e/arrow_i002.png");
}
.story_e .story-nav ul li.active {
 border: 3px solid #6723a7;
}

/*# sourceMappingURL=manga.css.map */
