@charset "utf-8";
/* Standalone popup-style pages: sokushu/doga0X.html, setsumeiX.html, panel01/*.html */

body.panel-page {
  margin: 0;
  padding: 30px 16px;
  background: #ffffff;
  color: #333333;
  font-family: "Yu Gothic Medium", "YuGothic", "Hiragino Kaku Gothic ProN",
    "Hiragino Kaku Gothic Pro", "Meiryo", "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-align: center;
}

.panel-title {
  max-width: 600px;
  width: 100%;
  height: auto;
  margin: 0 auto 20px;
}

.panel-video {
  max-width: 800px;
  width: 100%;
  aspect-ratio: 16 / 9;
  margin: 0 auto;
  position: relative;
  background: #000;
}
.panel-video iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.panel-caption {
  margin-top: 14px;
  font-size: 15px;
}

.panel-close {
  margin-top: 26px;
  font-size: 16px;
}
.panel-close a {
  color: #333333;
  text-decoration: underline;
  cursor: pointer;
}

/* ---------- Panel hub page (panel01/index.html) ---------- */
.panel-hub-title { max-width: 700px; width: 100%; height: auto; margin: 0 auto 24px; }

.panel-hub-nav {
  max-width: 800px;
  margin: 0 auto 30px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.panel-hub-nav a { display: block; }
.panel-hub-nav img { width: 100%; height: auto; }

.panel-hub-divider { max-width: 900px; margin: 30px auto; border: 0; border-top: 1px solid #ddd; }

.panel-section-title { max-width: 700px; width: 100%; height: auto; margin: 0 auto 20px; }

.panel-download {
  margin: 20px auto 6px;
}
.panel-download img { display: inline-block; }
.panel-download-size { margin: 0 0 24px; font-size: 14px; color: #555; }

.panel-chapter-grid {
  max-width: 900px;
  margin: 0 auto 10px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
@media (min-width: 700px) {
  .panel-chapter-grid { grid-template-columns: 1fr 1fr 1fr; }
}
.panel-chapter-grid a, .panel-chapter-grid span.no-link {
  display: block;
}
.panel-chapter-grid img { width: 100%; height: auto; }

.panel-freebie { margin: 30px auto; }