/**********************************************************
*
* シリーズページCSS
*
************************************************************/
#series-page .series-promotion-area {
  border-top: 2px solid var(--cl-dark-gray);
  margin-top: 30px;
  padding-top: 20px;
  display: flex;
  gap: 15px 30px;
  justify-content: center;
  flex-wrap: wrap;
}
#series-page .series-promotion-area .series-promotion-heading {
  width: 100%;
}
#series-page .series-promotion-area .series-promotion-heading h3 {
  font-size: 2rem;
  font-weight: bold;
  color: var(--cl-dark-gray);
}

#series-page .iframe-wrapper {
  flex: 1;
  text-align: center;
  width: 100%;
}
#series-page .iframe-wrapper:has(img) {
  display: block !important;
}
#series-page .iframe-wrapper iframe {
  width: 100%;
  max-width: 700px;
}
#series-page .instagram-contents-area {
  display: none;
}
#series-page .instagram-contents-area:has(.instagram-media.instagram-media-rendered) {
  display: flex;
  justify-content: center;
}
#series-page .instagram-contents-area .instagram-media {
  border-radius: 10px !important;
  position: sticky;
  top: calc((100% - 91svh) / 2);
  height: 91svh;
  width: 400px !important;
  display: none;
}

/*** 1250px ↓ ***/
@media screen and (max-width: 1250px) {
}

/*** 1100px ↓  ***/
@media screen and (max-width: 1100px) {
}

/*** 900px ↓  ***/
@media screen and (max-width: 900px) {
  #series-page .iframe-wrapper {
    flex: unset;
  }
  #series-page .instagram-contents-area {
    width: 100%;
  }
  #series-page .instagram-contents-area .instagram-media {
    width: 100% !important;
    height: 95svh;
    position: static;
  }
}

/*** 850px ↓ ***/
@media screen and (max-width: 850px) {
}

/*** 767px ↓ ***/
@media screen and (max-width: 767px) {
}

/*** 680px ↓ ***/
@media screen and (max-width: 680px) {
  #series-page .series-promotion-area {
    margin-left: -20px;
    margin-right: -20px;
  }
  #series-page .series-promotion-area .series-promotion-heading {
    padding: 0 20px;
  }
  #series-page .instagram-contents-area .instagram-media {
    border-radius: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
  }
}

/*** 500px ↓ ***/
@media screen and (max-width: 500px) {
}