@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/




/*全てをまとめて非表示*/
.home.page .entry-title,
.home.page .date-tags,
.home.page .author-info{
  display: none;
}








/* ==========================
   見出しデザイン（公開画面 & エディタ共通）
   ========================== */

/* --- H2 見出し --- */
/* 公開画面用 */
.entry-content h2,
.article h2,
h2 {
  border-bottom: 3px solid #ffa500 !important; /* オレンジのボーダー */
  color: #000 !important; /* 黒文字 */
  padding-bottom: 5px !important;
  margin-bottom: 1.2em !important;
  font-weight: bold !important;
}

/* クラシックエディタ用 */
body#tinymce.wp-editor h2 {
  border-bottom: 3px solid #ffa500 !important;
  color: #000 !important;
  padding-bottom: 5px !important;
  margin-bottom: 1.2em !important;
  font-weight: bold !important;
}

/* --- H3 見出し --- */
/* 公開画面用 */
.entry-content h3,
.article h3,
h3 {
  position: relative !important;
  padding: 1.5rem 2rem !important;
  color: #fff !important;
  border-radius: 10px !important;
  background: #000000 !important;
  font-weight: bold !important;
}

.entry-content h3:after,
.article h3:after,
h3:after {
  position: absolute !important;
  bottom: -9px !important;
  left: 1em !important;
  width: 0 !important;
  height: 0 !important;
  content: '' !important;
  border-width: 10px 10px 0 10px !important;
  border-style: solid !important;
  border-color: #000000 transparent transparent transparent !important;
}

/* クラシックエディタ用 */
body#tinymce.wp-editor h3 {
  position: relative !important;
  padding: 1.5rem 2rem !important;
  color: #fff !important;
  border-radius: 10px !important;
  background: #000000 !important;
  font-weight: bold !important;
}

body#tinymce.wp-editor h3:after {
  position: absolute !important;
  bottom: -9px !important;
  left: 1em !important;
  width: 0 !important;
  height: 0 !important;
  content: '' !important;
  border-width: 10px 10px 0 10px !important;
  border-style: solid !important;
  border-color: #000000 transparent transparent transparent !important;
}

/* --- H4 見出し --- */
/* 公開画面用 */
.entry-content h4,
.article h4,
h4 {
  padding: 0.5rem 2rem !important;
  border-left: 4px solid #00bfff !important;
  color: #000 !important;
  line-height: 1.4 !important;
  font-weight: bold !important;
}

/* クラシックエディタ用 */
body#tinymce.wp-editor h4 {
  padding: 0.5rem 2rem !important;
  border-left: 4px solid #00bfff !important;
  color: #000 !important;
  line-height: 1.4 !important;
  font-weight: bold !important;
}


	


















/* =====================================
   テーブルデザイン（ヘッダー#e6a157／枠線#ccc／背景白）
   ===================================== */

/* ========== フロント（記事本文） ========== */
.entry-content table,
.entry-content .wp-block-table table {
  width: 100%;
  border-collapse: collapse !important;
  border: 1px solid #ccc !important;  /* 枠線を薄めに */
}

.entry-content th,
.entry-content td,
.entry-content .wp-block-table th,
.entry-content .wp-block-table td {
  border: 1px solid #ccc !important;
  padding: 10px 15px;
  text-align: left;
  background-color: #ffffff !important;  /* 白背景 */
  color: #000000 !important;
}

/* ヘッダー部分だけ茶色に */
.entry-content table thead th,
.entry-content .wp-block-table thead th {
  background-color: #e6a157 !important; /* 茶色 */
  color: #ffffff !important;            /* 白文字 */
  border: 1px solid #ccc !important;
}

/* thead がない表でも1行目をヘッダー風に */
.entry-content table.no-thead tr:first-child > * {
  background-color: #e6a157 !important;
  color: #ffffff !important;
  border: 1px solid #ccc !important;
}

/* 偶数行はうっすらグレー */
.entry-content tbody tr:nth-child(even) td {
  background-color: #fafafa !important;
}

/* ========== ブロックエディター（Gutenberg） ========== */
.editor-styles-wrapper table,
.editor-styles-wrapper .wp-block-table table {
  border-collapse: collapse !important;
  border: 1px solid #ccc !important;
}

.editor-styles-wrapper th,
.editor-styles-wrapper td,
.editor-styles-wrapper .wp-block-table th,
.editor-styles-wrapper .wp-block-table td {
  border: 1px solid #ccc !important;
  padding: 10px 15px;
  text-align: left;
  background-color: #ffffff !important;
  color: #000000 !important;
}

.editor-styles-wrapper thead th,
.editor-styles-wrapper .wp-block-table thead th {
  background-color: #e6a157 !important;
  color: #ffffff !important;
  border: 1px solid #ccc !important;
}

/* ========== クラシックエディター（TinyMCE） ========== */
body#tinymce table,
.mce-content-body table {
  border-collapse: collapse !important;
  border: 1px solid #ccc !important;
}

body#tinymce th, body#tinymce td,
.mce-content-body th, .mce-content-body td {
  border: 1px solid #ccc !important;
  padding: 10px 15px;
  text-align: left;
  background-color: #ffffff !important;
  color: #000000 !important;
}

body#tinymce thead th,
.mce-content-body thead th {
  background-color: #e6a157 !important;
  color: #ffffff !important;
  border: 1px solid #ccc !important;
}



























/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}