@charset "UTF-8";


.block-container-section {
    padding: 0!important;
}

#magazine {
  font-feature-settings: "palt";
  color: #2d2d2d;
}

.inBlock_XS {
  overflow: hidden;
  max-width: 25.5em;
  padding: 0 1.5em;
}

/* --------------------
   Header
-------------------- */
.articleHeader {
    margin-bottom: 0;
}
/* --------------------
   #intro
-------------------- */
#intro .inBlock_XS {
  background: #f38a4d;
  color: #FFF;
  text-align: center;
}
/* --------------------
   #toc
-------------------- */
#toc .inBlock_XS {
  background: url(../img/toc__bg.png) no-repeat center top / cover;
  text-align: center;
}
#toc .inBlock_XS > .cont {
  background: #FFF;
  overflow: hidden;
}
#toc ul {
  background: #f38a4d;
  border-radius: 3px;
  margin: 0 1em 1em;
  padding: 1em 1em 0;
  overflow: hidden;
}
#toc ul li {
  background: #FFF;
  border-radius: 3px;
  padding: 2px;
  margin-bottom: 1em;
}
#toc ul li a {
  display: block;
}


/* --------------------
   .cont-header
-------------------- */
.cont-header {
   color: #fff;
}
.cont-header .txtArea {
   padding: 1em 1em 2.5em;
}
.cont-header .btnBox {
  text-align: center;
}
.cont-header .btnBox p {
  margin: 1.5em 0 .5em;
}
.cont-header .buyBtn {
   background: #fff;
   border-color: #fff;
}
.cont-header .buyBtn:hover {
   opacity: .5;
}

/* --------------------
   #cont1
-------------------- */
#cont1 .inBlock_XS {
  background: #cfe6ac;
}
#cont1 .card {
  border-bottom: .25em dotted #cfe6ac;
}

#cont1 .cont-header .txtArea {
  background: #a0cd5a;
}
#cont1 .cont-header .buyBtn {
  color: #a0cd5a;
}

#cont1 .card .matomegaiBox + p {
  color: #00b200;
}
#cont1 .card .buyBtn {
  background: #00b200;
  border-color: #00b200;
}
#cont1 .card .buyBtn:hover {
  color: #00b200;
  background-color: #fff;
  border-color: #00b200;
}

/* --------------------
   #cont2
-------------------- */
#cont2 .inBlock_XS {
  background: #ffdbdb;
}
#cont2 .card {
  border-bottom: .25em dotted #ffdbdb;
}

#cont2 .cont-header .txtArea {
  background: #ffa2a2;
}
#cont2 .cont-header .buyBtn {
  color: #ffa2a2;
}

#cont2 .card .matomegaiBox + p {
  color: #ff7777;
}
#cont2 .card .buyBtn {
  background: #ff7777;
  border-color: #ff7777;
}
#cont2 .card .buyBtn:hover {
  color: #ff7777;
  background-color: #fff;
  border-color: #ff7777;
}

/* --------------------
   #cont3
-------------------- */
#cont3 .inBlock_XS {
  background: #ffffbe;
}
#cont3 .card {
  border-bottom: .25em dotted #ffffbe;
}

#cont3 .cont-header .txtArea {
  background: #eecd86;
}
#cont3 .cont-header .buyBtn {
  color: #eecd86;
}

#cont3 .card .matomegaiBox + p {
  color: #ba832e;
}
#cont3 .card .buyBtn {
  background: #ba832e;
  border-color: #ba832e;
}
#cont3 .card .buyBtn:hover {
  color: #ba832e;
  background-color: #fff;
  border-color: #ba832e;
}


/* --------------------
   #cont4
-------------------- */
#cont4 .inBlock_XS {
  background: #c9d0dd;
}
#cont4 .card {
  border-bottom: .25em dotted #c9d0dd;
}

#cont4 .cont-header .txtArea {
  background: #a7b0c2;
}
#cont4 .cont-header .buyBtn {
  color: #a7b0c2;
}

#cont4 .card .matomegaiBox + p {
  color: #627292;
}
#cont4 .card .buyBtn {
  background: #627292;
  border-color: #627292;
}
#cont4 .card .buyBtn:hover {
  color: #627292;
  background-color: #fff;
  border-color: #627292;
}


/* --------------------
   .card
-------------------- */
.card {
  max-width: 22.5em;
  font-weight: 500;
}
.card:last-child {
   border-bottom: none !important;
}

.card .card_body {
  padding-bottom: .5em;
  overflow: hidden;
}
.card .txtBox {
  margin-top: 0;
  padding: 0 .25em;
}
.card .priceBox .price .num {
  font-size: 2em;
}


.card .matomegaiBox {
  margin-right: 1em;
  margin-left: 1em;
}
.card .matomegaiBox > div {
  flex-basis: 100%;
  padding: 0 .5em;
}
.card .matomegaiBox > div.box3 .off {
  background: #ee5903;
}
.card .matomegaiBox > div.box3 .price {
  color: #ee5903;
}
.card .matomegaiBox > div.box6 .price {
  color: #c82d2d;
}
.card .matomegaiBox .off {
  flex-direction: column;
  height: 4em;
}
.card .matomegaiBox .off span {
  font-size: .8em;
  margin-bottom: .5em;
  display: block;
}
.card .matomegaiBox .price {
  margin: 1em 0 0;
}
.card .matomegaiBox .price .num {
  font-size: 1.75em;
}
.card .matomegaiBox .only {
  margin-bottom: .5em;
  display: block;
}
.card .matomegaiBox + p {
  text-align: center;
  line-height: 1.5;
  margin: 2em 0 .5em;
}

.card .subscription {
   color: #00a33d;
   font-weight: 500;
}
