@charset "utf-8";

#header { background-color: #000000; }
h2 { color: #000; }
#main { background-color: #ec008d; }
#main .inner {
  background-color: #000000;
  background-image: url(../img/bg_star1.png), url(../img/bg_star2.png);
  background-position: 1% 0%, 99% 0%;
  background-repeat: repeat-y, repeat-y;
  padding: 16px 0;
}
#main a.btn1,
#main a.btn2 {
  background-image: -webkit-linear-gradient(0deg,rgba(236,0,141,1.00) 0%,rgba(252,178,226,1.00) 100%);
  background-image: -moz-linear-gradient(0deg,rgba(236,0,141,1.00) 0%,rgba(252,178,226,1.00) 100%);
  background-image: -o-linear-gradient(0deg,rgba(236,0,141,1.00) 0%,rgba(252,178,226,1.00) 100%);
  background-image: linear-gradient(90deg,rgba(236,0,141,1.00) 0%,rgba(252,178,226,1.00) 100%);
  color: #FFFFFF;
  display: inline-block;
  line-height: 1em;
  text-align: center;
  text-decoration: none;
  margin: auto;
  border-radius: 32px;
}
#main a.btn1 {
  font-size: 3rem;
  padding: 16px 24px;
}
#main a.btn2 {
  font-size: 2rem;
  padding: 16px 24px;
}
#main a {
  opacity: 1.0;
}
#main a:hover {
  opacity: 0.6;
}
#main .font_sh900 {
  font-family: source-han-sans-japanese, sans-serif;
  font-weight: 900;
}
#main .font_sh700 {
  font-family: source-han-sans-japanese, sans-serif;
  font-weight: 700;
}

/* main */
.area_title {}
.area_title .box_img_main {
  margin: 0 0 24px;
}
.area_title h1 {
  margin: 0 0 24px;
  text-align: center;
}
.area_title h2 {
  margin: 0 0 48px;
  text-align: center;
}
.area_title h1 img {
  width: 550px;
}
.area_title h2 img {
  width: 400px;
}
.area_title .box_lead {
  margin: 0 0 48px
}
.area_title .box_lead p {
  color: #FFFFFF;
  font-size: 1.8rem;
  line-height: 2em;
  margin: 0 0 32px;
  text-align: center;
}
.area_title .go_novel {
  margin: 0 0 48px;
  text-align: center;
}
.area_title .share {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 64px;
}
.area_title .share h3 {
  color: #FFFFFF;
  font-family: "trajan-pro-3", serif;
  font-size: 2.4rem;
  line-height: 1em;
  padding: 0 16px;
}
.area_title .share ul {}
.area_title .share ul li {
  display: inline-block;
  list-style-type: none;
  padding: 0 16px;
}
.area_title .share .s_tw img,
.area_title .share .s_line img,
.area_title .share .s_fb img { width: 36px; }

/* area_anime */
.area_anime,
.area_manga {
  background-color: #FFFFFF;
  border-radius: 32px;
  color: #000000;
  margin: 0 48px 48px;
  padding: 48px 32px;
}
.area_anime .box_fl_op {
  display: flex;
  justify-content: space-around;
  margin: 0 0 32px;
}
.area_anime .box_fl_op .box_op_cover {
  flex-basis: 360px;
}
.area_anime .box_fl_op .box_op_cover img { width: 100%; }
.area_anime .box_fl_op .box_op_summary {
  flex-basis: 360px;
  text-align: center;
}
.area_anime .box_fl_op .box_op_summary h1 {
  font-size: 2.8rem;
  line-height: 1.2em;
  margin: 0 0 8px;
}
.area_anime .box_fl_op .box_op_summary h1 img {
  display: block;
  margin: 0 0 8px;
  width: 100%;
}
.area_anime .box_fl_op .box_op_summary h1 .subtitle {
  display: block;
  margin: 0 0 4px;
  font-size: 1.6rem;
  line-height: 1.2em;
  text-shadow: 0px 0px 0px;
}
.area_anime .box_fl_op .box_op_summary p {
  font-size: 1.6rem;
  line-height: 1.5em;
  margin: 0 0 8px;
}
.area_anime .box_fl_op .box_op_summary p a {
  color: #5B9BD5;
}
.area_anime .box_anime {
  background-image: url(../img/line_star.svg);
  background-position: center top;
  background-repeat: repeat-x;
  background-size: 20% auto;
  padding: 64px 0 0;
}
.area_anime .box_anime .box_fl_anime {
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.area_anime .box_anime .box_anime_img {
  flex-basis: 300px;
}
.area_anime .box_anime .box_anime_img img {
  width: 100%;
}
.area_anime .box_anime .box_anime_newest {
  flex-basis: 420px;
}
.area_anime .box_anime .box_anime_newest h1 {
  font-size: 3.6rem;
  line-height: 1.2em;
  margin: 0 0 24px;
  text-align: center;
}
.area_anime .box_anime .box_anime_newest h2 {
  margin: 0 0 24px;
  text-align: center;
}
.area_anime .box_anime .box_anime_newest h2 img {
  width: 280px;
}
.area_anime .box_anime .box_anime_newest .go_animeofficial {
  margin: 0 0 8px;
  text-align: center;
}
.area_anime .box_anime .box_anime_newest .go_animetw {
  text-align: center;
}

/* area_manga */
.area_manga {}
.area_manga h1 {
  margin: 0 0 16px;
  text-align: center;
}
.area_manga h1 img {
  width: 90%;
}
.area_manga h2 {
  margin: 0 0 8px;
  text-align: center;
}
.area_manga h2 img {
  width: 480px;
}
.area_manga h3 {
  font-size: 2rem;
  line-height: 1.5em;
  margin: 0 0 32px;
  text-align: center;
}
.area_manga .box_fl_serial_link {
  display: flex;
  margin: 0 0 24px;
}
.area_manga .box_fl_serial_link dl {
  display: flex;
  align-items: center;
  justify-content: center;
}
.area_manga .box_fl_serial_link dl dt {
  flex-basis: 24%;
  padding: 0 8px;
}
.area_manga .box_fl_serial_link dl dt img { width: 100%; }
.area_manga .box_fl_serial_link dl dd {
  flex-basis: 58%;
  font-size: 1.8rem;
  line-height: 1.3em;
  padding: 0 8px 0 30px;
  background-image: url(../img/cursor.svg);
  background-repeat: no-repeat;
  background-size: 24px auto;
  background-position: left center;
}
.area_manga .box_fl_serial_link dl dd strong {
  color: #ec008d;
}
.area_manga .manga_notice {
  color: #555555;
  font-size: 1.4rem;
  line-height: 1.5em;
  margin: 0 0 24px;
  padding: 0;
  text-align: center;
}
.area_manga .box_fl_manga_comics .box_fl_comics {
  background-image: url(../img/line_star.svg), url(../img/line_star.svg);
  background-position: center top, center bottom;
  background-repeat: repeat-x, repeat-x;
  background-size: 20% auto, 20% auto;
  display: flex;
  align-items: center;
  justify-content: space-around;
  margin: 0 0 32px;
  padding: 56px 0;
}
.area_manga .box_fl_manga_comics .box_fl_comics .box_comics_cover {
  flex-basis: 34%;
}
.area_manga .box_fl_manga_comics .box_fl_comics .box_comics_cover img {
  box-shadow: 3px 3px 10px rgba(236,0,141,0.50);
  width: 100%;
}
.area_manga .box_fl_manga_comics .box_comics_summary {
  flex-basis: 56%;
  text-align: center;
}
.area_manga .box_fl_manga_comics .box_comics_summary .catch {
  background-color: #7030A0;
  color: #FFFFFF;
  font-size: 2rem;
  line-height: 1.5em;
  padding: 4px 8px 8px;
  margin: 0 0 16px;
}
.area_manga .box_fl_manga_comics .box_comics_summary h3 {
  margin: 0 0 16px;
  text-align: center;
}
.area_manga .box_fl_manga_comics .box_comics_summary h3 img {
  width: 80%;
}
.area_manga .box_manga_newest {}
.area_manga .box_manga_newest h3 {
  margin: 0 0 16px;
  text-align: center;
}
.area_manga .box_manga_newest h3 img {
  width: 50%;
}
.area_manga .box_manga_newest p {
  font-size: 1.6rem;
  line-height: 1.2em;
  margin: 0 0 24px;
  text-align: center;
}
.area_manga .box_manga_newest .box_fl_manga_link {
  display: flex;
  justify-content: space-around;
}

.marker1 {
  background: linear-gradient(transparent 55%, rgba(236,0,141,0.40) 55%);
}

/* footer */
#footer {
  border-top: 1px solid #FFFFFF;
}
#footer .cr_o {
  padding-top: 1em;
}

/* inview */
.zoom {
  transform: scale(0, 0);
  -webkit-transform: scale(0, 0);
  transition: .8s;
}
.zoom_tg {
  transform: scale(1, 1);
  -webkit-transform: scale(1, 1);
  transition: .8s;
}
.upfadein {
  opacity: 0;
  transform: translate(0,60px); 
  -webkit-transform: translate(0,60px);
  transition: .6s;
}
.upfadein_tg {
  opacity: 1.0;
  transform: translate(0,0); 
  -webkit-transform: translate(0,0);
  transition: .6s;
}