/* 画面幅が1200ピクセル以下の場合にスタイルを適用する条件 */
@media screen and ( max-width:1200px){

  .post-type-archive-series .orange_border {
    margin: 4em 0;
  }
  
  .post-type-archive-series .series_flex_container {
    gap: 2.5em;
  }

}




/* 画面幅が900ピクセル以下の場合にスタイルを適用する条件 */
@media screen and ( max-width:900px){

  .post-type-archive-series .orange_border {
    margin: 3em 0;
  }
  
  .post-type-archive-series .series_flex_container {
      display: grid;
      grid-template-columns: repeat(2, 1fr); /* 2列のグリッドを作成 */
  }

  /* 最後のliの余白スペースを埋めるための要素 */
  .post-type-archive-series .series_flex_container::after {
      content: "";
      grid-column: span 2; /* 2列にわたって配置 */
  }

}










/* 画面幅が600ピクセル以下の場合にスタイルを適用する条件 */
@media screen and ( max-width:600px){

  .post-type-archive-series .inner_wrapper{
    padding: 2.5em 2.5em 10em 2.5em;
  }

  .series_title_box p{
    line-height: 1.25em;
  }

  .post-type-archive-series .series_flex_container {
    display: block;
  }

  .post-type-archive-series .series_flex_container li{
    margin-top: 3em;
  }





 








  

  







}