@charset "UTF-8";
/* ----- reset ----- */
html, body { margin: 0; padding: 0; font-size: 62.5%; /* font-size 1em = 10px */ line-height: 1; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

h1, h2, h3, h4, h5, h6, p, dl, dt, dd, ol, ul, li, figure, iframe, img, table, th, td { margin: 0; padding: 0; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }

/*
p{
	text-align: justify;
	text-justify: inter-ideograph;
}
*/
ul, ol, li { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

img { max-width: 100%; vertical-align: middle; border: 0; }

em { font-style: normal; }

/* ----- contents ----- */
body { color: #fff; font-family: serif; font-size: 16px; background: url(./img/bg_top.png) no-repeat center top, url(./img/bg.jpg) repeat 0 0; }
@media (max-width: 960px) { body { background-size: 170% auto, 300px; } }

.container { padding: 0 16px; }

/* header */
.header { position: relative; margin-bottom: 28px; padding-top: 60px; text-align: center; }
@media (max-width: 960px) { .header { margin-bottom: 2.9%; padding-top: 6%; } }
.header .topText { margin-bottom: 20px; color: #ffef40; font-size: 50px; line-height: 1.5; }
.header .topText span { display: block; font-size: .72em; }
@media (max-width: 960px) { .header .topText { margin-bottom: 3%; font-size: 5.4vw; } }
.header .logo { margin-bottom: 9px; }
.header .logo img { width: 100%; max-width: 1010px; }
.header .catch img { width: 100%; max-width: 687px; }
@media (max-width: 960px) { .header .catch img { width: 71.56%; } }
.header .photo { max-width: 712px; width: 100%; margin: 0 auto; }
.header .photo div { position: relative; padding-top: 84.26%; }
.header .photo div img { position: absolute; top: 0; left: 0; z-index: 9999; width: 100%; height: 100%; }
.header .photo div::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(./img/main_visual.jpg) no-repeat 0 0; background-size: cover; }
@media print { .header .photo div::after { opacity: 0; } }

.commentLink { margin: 40px auto 48px; margin-bottom: 48px; }
.commentLink p:first-of-type { font-family: "リュウミン EB-KL"; font-size: 30px; text-align: center; line-height: 1.33; }
.commentLink p:first-of-type em:first-of-type { color: #ff7ab9; }
.commentLink p:first-of-type em:last-of-type { color: #1dd2ff; }
.commentLink p:first-of-type span { font-size: 1.2em; }
.commentLink p:last-of-type { width: 240px; margin: 20px auto 0; }

/* 放送日時 */
.broadcast { width: 100%; max-width: 928px; padding: 22px 0 18px; margin: 0 auto 82px; box-sizing: border-box; background: url(./img/broadcast_bg.png) repeat 0 0/7px; }
@media (max-width: 960px) { .broadcast { margin-bottom: 9%; } }
@media (max-width: 768px) { .broadcast { padding: 12px; } }
.broadcast ul { display: table; width: 100%; }
@media (max-width: 768px) { .broadcast ul { display: block; } }
.broadcast li { display: table-cell; vertical-align: middle; width: 50%; padding: 4px 0; text-align: center; box-sizing: border-box; }
@media (max-width: 768px) { .broadcast li { display: block; width: 100%; padding: 0; } }
.broadcast .season1 { border-right: 1px solid #20201d; }
.broadcast .season1 img { width: 86.3%; max-width: 400px; }
@media (max-width: 768px) { .broadcast .season1 { padding-bottom: 12px; margin-bottom: 12px; border-right: 0; border-bottom: 2px solid #20201d; }
  .broadcast .season1 img { width: 100%; } }
.broadcast .season2 { border-left: 1px solid #20201d; }
.broadcast .season2 img { width: 86.3%; max-width: 400px; }
.broadcast .season2 a { display: block; margin-top: 20px; }
.broadcast .season2 a img { width: 278px; }
@media (max-width: 768px) { .broadcast .season2 { border-left: 0; }
  .broadcast .season2 img { width: 100%; }
  .broadcast .season2 a img { width: 100%; max-width: 278px; } }

/* コミカライズ */
.comic figure { margin-top: 12px; text-align: center; }

/* イントロ */
.intro { background: url(./img/intro_bg.png) no-repeat center top/960px auto; }
@media (max-width: 768px) { .intro { background-size: 100% auto; } }
.intro .sectionTitle { margin-bottom: 62px; }
@media (max-width: 960px) { .intro .sectionTitle { margin-bottom: 6.4%; } }
.intro .introHead { width: 100%; max-width: 805px; margin: 0 auto 50px; }
.intro .introHead::after { content: ""; display: block; width: 300px; height: 1px; margin: 65px auto 0; background-color: #fff; }
@media (max-width: 960px) { .intro .introHead { margin-bottom: 5.2%; }
  .intro .introHead::after { margin-top: 6%; } }
@media (max-width: 768px) { .intro .introHead::after { width: 50%; opacity: .6; } }
.intro .introTitle { text-align: center; }
.intro .introTitle img { width: 100%; max-width: 643px; }
.intro .textBox p { margin: 1.8em 0; }

/* topics */
.topics .sectionTitle { margin-bottom: 50px; }
@media (max-width: 960px) { .topics .sectionTitle { margin-bottom: 5%; } }
.topics .topicsBox { margin-top: 55px; }
@media (max-width: 960px) { .topics .topicsBox { margin-top: 5.5%; } }
.topics .topicsHead { margin-bottom: 30px; text-align: center; }
.topics .topicsHead img { width: 100%; }
@media (max-width: 960px) { .topics .topicsHead { margin-bottom: 3%; } }
.topics .topicsHead2 { margin-bottom: 8px; font-size: 24px; font-family: serif; }
@media (max-width: 768px) { .topics .topicsHead2 { font-size: 20px; font-feature-settings: 'palt'; } }

.commentBox { width: 100%; max-width: 705px; padding: 30px; margin: 25px auto 0; box-sizing: border-box; font-family: serif; font-size: 16px; line-height: 1.875; background: #000 url(./img/comment_bg.png) no-repeat right top/482px auto; box-shadow: 0 0 3px 0 rgba(0, 213, 190, 0.3); }
@media (max-width: 960px) { .commentBox { margin-top: 2.5%; } }
@media (max-width: 768px) { .commentBox { padding: 16px 10px; background-size: 50% auto; } }
.commentBox .commentName { width: 100%; max-width: 300px; margin-bottom: 30px; }
@media (max-width: 960px) { .commentBox .commentName { margin-bottom: 3%; } }
.commentBox .profile { margin-top: 3%; padding: 15px 20px; background: url(./img/bg.jpg) repeat 0 0; }
@media (max-width: 768px) { .commentBox .profile { padding: 10px; } }

/* staff */
.staff .sectionTitle { margin-bottom: 55px; }
@media (max-width: 960px) { .staff .sectionTitle { margin-bottom: 5.5%; } }
.staff .staffInner { display: table; margin: 0 auto; }
@media (max-width: 768px) { .staff .staffInner { display: block; } }
.staff dl { display: table; font-family: serif; font-size: 16px; line-height: 2.25; }
@media (max-width: 768px) { .staff dl { display: block; } }
.staff dt { display: table-cell; padding-right: 20px; }
@media (max-width: 768px) { .staff dt { display: block; } }
.staff dd { display: table-cell; }
.staff dd li { display: inline-block; padding-right: 1em; }
.staff dd .db li { display: block; }
@media (max-width: 768px) { .staff dd { display: block; padding-left: 2em; }
  .staff dd li { display: block; } }

/* footer */
.footer { margin-top: 90px; padding-bottom: 30px; font-family: serif; }
@media (max-width: 960px) { .footer { margin-top: 9%; } }
.footer .copy { margin-top: 20px; font-size: 10px; text-align: center; }
@media (max-width: 960px) { .footer .copy { margin-top: 4%; } }

.footerBnr { display: flex; justify-content: center; }
.footerBnr li { width: 100%; max-width: 370px; margin: 0 14px; }
@media (max-width: 425px) { .footerBnr { display: block; }
  .footerBnr li { margin: 0; }
  .footerBnr li:not(:last-of-type) { margin-bottom: 14px; } }

.footerLink { margin-top: 70px; display: flex; justify-content: center; flex-wrap: nowrap; font-size: 13px; }
@media (max-width: 960px) { .footerLink { margin-top: 7%; } }
.footerLink li { white-space: nowrap; }
.footerLink li:not(:last-of-type) a::after { content: "|"; padding: 0 10px; }
@media (max-width: 768px) { .footerLink li:not(:last-of-type) a::after { display: none; padding: 0; } }
.footerLink a { display: block; color: #fff; text-decoration: none; }
@media (max-width: 768px) { .footerLink { display: block; }
  .footerLink li { margin-bottom: 8px; }
  .footerLink a { padding: 4px 0; } }

/* ----- common class ----- */
.textBox { width: 100%; max-width: 705px; margin: 0 auto; font-size: 16px; line-height: 1.875; }

.section { margin-top: 80px; }
@media (max-width: 960px) { .section { margin-top: 8%; } }

.sectionTitle { width: 330px; margin-right: auto; margin-left: auto; }
@media (max-width: 768px) { .sectionTitle { width: 80%; } }

.c-yellow { color: #ffef40 !important; }

@media (min-width: 768px) { .hover { transition: all .3s ease-in; }
  .hover:hover { opacity: .8; } }
.db-sp { display: none; }

@media (max-width: 768px) { .db-pc { display: none; }
  .db-sp { display: block; } }
.mt0 { margin-top: 0 !important; }

.mt10 { margin-top: 10px !important; }

.mt15 { margin-top: 15px !important; }

.mt20 { margin-top: 20px !important; }

.mt25 { margin-top: 25px !important; }

.mt30 { margin-top: 30px !important; }

.mt35 { margin-top: 35px !important; }

.mt40 { margin-top: 40px !important; }

.mt45 { margin-top: 45px !important; }

.mt50 { margin-top: 50px !important; }

.mt60 { margin-top: 60px !important; }

.mt64 { margin-top: 64px !important; }

.mt70 { margin-top: 70px !important; }

.mt80 { margin-top: 80px !important; }

.mb0 { margin-bottom: 0 !important; }

.mb10 { margin-bottom: 10px !important; }

.mb15 { margin-bottom: 15px !important; }

.mb20 { margin-bottom: 20px !important; }

.mb25 { margin-bottom: 25px !important; }

.mb30 { margin-bottom: 30px !important; }

.mb35 { margin-bottom: 35px !important; }

.mb40 { margin-bottom: 40px !important; }

.mb45 { margin-bottom: 45px !important; }

.mb50 { margin-bottom: 50px !important; }

.mb60 { margin-bottom: 60px !important; }

.mb64 { margin-bottom: 64px !important; }

.mb70 { margin-bottom: 70px !important; }

.mb80 { margin-bottom: 80px !important; }

@media screen and (max-width: 768px) { .mt10 { margin-top: 1.5% !important; }
  .mt15 { margin-top: 2.3% !important; }
  .mt20 { margin-top: 3.1% !important; }
  .mt25 { margin-top: 3.9% !important; }
  .mt30 { margin-top: 4.6% !important; }
  .mt35 { margin-top: 5.4% !important; }
  .mt40 { margin-top: 6.2% !important; }
  .mt45 { margin-top: 7% !important; }
  .mt50 { margin-top: 7.8% !important; }
  .mt60 { margin-top: 9.3% !important; }
  .mt64 { margin-top: 10% !important; }
  .mt70 { margin-top: 10.9% !important; }
  .mt80 { margin-top: 12.5% !important; }
  .mb10 { margin-bottom: 1.5% !important; }
  .mb15 { margin-bottom: 2.3% !important; }
  .mb20 { margin-bottom: 3.1% !important; }
  .mb25 { margin-bottom: 3.9% !important; }
  .mb30 { margin-bottom: 4.6% !important; }
  .mb35 { margin-bottom: 5.4% !important; }
  .mb40 { margin-bottom: 6.2% !important; }
  .mb45 { margin-bottom: 7% !important; }
  .mb50 { margin-bottom: 7.8% !important; }
  .mb60 { margin-bottom: 9.3% !important; }
  .mb64 { margin-bottom: 10% !important; }
  .mb70 { margin-bottom: 10.9% !important; }
  .mb80 { margin-bottom: 12.5% !important; } }
/* ----- 追加ページ ----- */
.comment .photo { max-width: 928px; }
.comment .section.topics { margin-top: 0; }
.comment .topicsHead { color: #30d8f6; font-size: 24px; line-height: 1.6; font-family: "リュウミン B-KL"; }
.comment .topicsBox .textBox span { font-size: 1.25em; }
.comment .topicsBox .textBox span.p { color: #ff49db; }
.comment .topicsBox .textBox span.b { color: #8abcff; }
.comment .commentBox { overflow: hidden; }
.comment .commentBox .commentName { max-width: none; margin-bottom: 24px; font-family: "リュウミン B-KL"; font-size: 24px; line-height: 1; }
@media (max-width: 768px) { .comment .commentBox .commentName { font-size: 20px; margin-bottom: 16px; } }
.comment .commentBox img { float: right; width: 232px; margin-top: -50px; margin-left: 24px; }
@media (max-width: 768px) { .comment .commentBox img { width: 120px; margin-top: 0; margin-left: 8px; } }

.backBtn a { display: block; width: 260px; margin: 20px auto 0; padding: 12px 0; color: #425098; font-family: "リュウミン B-KL"; text-align: center; text-decoration: none; background-color: #f5f5f5; }

/*# sourceMappingURL=style.css.map */