@charset "UTF-8";
/*
Theme Name: WING-AFFINGER5 Child
Template: affinger5
Description: ver20180831以上対応
Version: 20180831
*/

/* SyntaxHighliterのエリアのパディングを設定 */
.syntaxhighlighter table {
  margin: 10px 0 !important;
}

/* HTML表示結果エリア */
div.html-result, p.html-result {
  border: 1px solid #000;
  padding: 10px;
}

/* シリーズ記事一覧 */
div.series-contents {
  margin: 20px 0;
  border: 1px solid #039BE5;
  padding: 10px;
}
div.series-contents ul {
  margin-bottom: 0 !important;
}

/* キャプションのセンタリング */
.wp-block-image figcaption {
  text-align: center;
}

/* <h2>タグの上のスペースを大きくする(ただし記事一覧は20pxのまま) */
.h2modoki, .post h2:nth-of-type(n+2):not(.st-css-no) {
  margin-top: 60px;
}
.post .series-contents h2:not(.st-css-no) {
  margin-top: 20px;
}

/* <h3>の下の横線が30%になっていてデザインが変なので100%にする */
.h3modoki::after,
.post h3:not(.st-css-no):not(.st-matome):not(.rankh3):not(#reply-title)::after {
  width: 100% !important;
}

/* オリジナルのテーブルのデザイン */
div.my-table {
  text-align: center;
}
div.my-table table {
  width: 100%;
}
div.my-table table th {
  background-color: #eee !important;
}
div.my-table table td {
  text-align: left;
}
div.my-table table th.nowrap,
div.my-table table td.nowrap {
  white-space: nowrap;
}
div.my-table table.nowrap th,
div.my-table table.nowrap td {
  white-space: nowrap;
}
div.my-table table td.center {
  text-align: center;
}
div.my-table table.center td {
  text-align: center;
}

/* すごい目次 */
#st_toc_container {
  margin-top: 20px;
}
#st_toc_container .st_toc_list li a {
    border-bottom: 1px dotted #ccc !important;
}

/* 連載記事ページネーション */
.series-pagination {
  margin: 20px 0;
  border: 1px solid #039BE5;
  padding: 10px;
}

/* コード用フォント(バックスラッシュを表示するなど) */
.code-char {
  font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important;
}

/*media Queries スマートフォンとタブレットサイズ（959px以下）で適応したいCSS - スマホ・タブレット
---------------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 959px) {

}

/*media Queries タブレットサイズ（600px～959px）のみで適応したいCSS -タブレットのみ
---------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 600px) and (max-width: 959px) {


}

/*media Queries タブレット（600px）以上で適応したいCSS -タブレット・PC
---------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 600px) {


}

/*media Queries PCサイズ（960px）以上で適応したいCSS - PCのみ
---------------------------------------------------------------------------------------------------*/
@media print, screen and (min-width: 960px) {

    /* サイトトップに表示するオススメ記事 */
    #recommended-articles .recommended-articles-wrap {
      max-width: 1060px;
      margin:0 auto;
    }
    #recommended-articles h3 {
      margin-bottom: 5px;
    }
    #recommended-articles li {
      max-width: 350px;
      list-style-type: none;
    }
    #recommended-articles li a {
      display: block;
      text-decoration: none;
    }
    #recommended-articles .caption {
      text-align: center;
    }

}

/*media Queries スマホサイズ（599px）以下で適応したいCSS - スマホのみ
---------------------------------------------------------------------------------------------------*/
@media print, screen and (max-width: 599px) {

  /* 目次の幅を広げる */
  .entry-content #st_toc_container:not(.st_toc_contracted):not(.only-toc) {
      padding: 20px 10px;
  }

}