@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
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/* =========================================
   1. 全体基本色（背景：白、文字：濃茶）
   ========================================= */
body,
.entry-content {
  background-color: #ffffff !important;
  color: #3A2E2E !important;
}


/* =========================================
   2. サイト全体リンク（控えめゴールド）
   ========================================= */
a,
a:visited {
  color: #D6CAA8 !important;
}
a:hover {
  color: #b8ad8e !important;
}


/* =========================================
   3. 公開画面：見出しH2〜H6
   ========================================= */
.entry-content h2 {
  color: #3A2E2E !important;
  border-bottom: 3px solid #D6CAA8;
  padding-bottom: 12px;
  margin: 40px 0 24px;
  font-size: 1.5em;
  font-weight: 600;
}

.entry-content h3 {
  color: #3A2E2E !important;
  border-bottom: 2px solid #D6CAA8;
  padding-bottom: 8px;
  margin: 32px 0 20px;
  font-size: 1.3em;
  font-weight: 600;
}

.entry-content h4 {
  color: #3A2E2E !important;
  border-bottom: 1px solid #D6CAA8;
  padding-bottom: 6px;
  margin: 28px 0 16px;
  font-size: 1.15em;
  font-weight: 600;
}

.entry-content h5 {
  color: #3A2E2E !important;
  margin: 24px 0 12px;
  font-size: 1.05em;
  font-weight: 600;
}

.entry-content h6 {
  color: #3A2E2E !important;
  margin: 20px 0 10px;
  font-size: 1em;
  font-weight: 600;
}


/* =========================================
   4. 編集画面（エディタ）用：H2〜H6強制表示
   ========================================= */
.editor-styles-wrapper h2 {
  color: #3A2E2E !important;
  border-bottom: 3px solid #D6CAA8 !important;
  padding-bottom: 12px !important;
  font-weight: 600 !important;
}

.editor-styles-wrapper h3 {
  color: #3A2E2E !important;
  border-bottom: 2px solid #D6CAA8 !important;
  padding-bottom: 8px !important;
  font-weight: 600 !important;
}

.editor-styles-wrapper h4 {
  color: #3A2E2E !important;
  border-bottom: 1px solid #D6CAA8 !important;
  padding-bottom: 6px !important;
  font-weight: 600 !important;
}

.editor-styles-wrapper h5,
.editor-styles-wrapper h6 {
  color: #3A2E2E !important;
  font-weight: 600 !important;
}


/* =========================================
   5. サイドバー
   ========================================= */
#sidebar .widget {
  background-color: #ffffff;
  padding: 18px 20px;
  margin-bottom: 24px;
  border-radius: 6px;
  box-shadow: 0px 2px 8px rgba(0,0,0,0.06);
}

#sidebar .widget .widget-title {
  color: #2B221E !important;
  border-left: 4px solid #D6CAA8;
  padding-left: 10px;
  font-weight: 600;
}


/* =========================================
   6. ボタン（控えめゴールド）
   ========================================= */
.wp-block-button__link,
.btn,
.more-link {
  background-color: #D6CAA8 !important;
  color: #ffffff !important;
  border-radius: 4px !important;
  padding: 10px 18px !important;
  text-decoration: none !important;
}

.wp-block-button__link:hover,
.btn:hover,
.more-link:hover {
  background-color: #b8ad8e !important;
}
/* 編集画面のH2〜H4を公開画面と同じ階層に近づける */
.editor-styles-wrapper h2 {
  border-bottom: 3px solid #D6CAA8 !important;
  padding-bottom: 6px !important;
  font-weight: 600 !important;
  color: #3A2E2E !important;
}

.editor-styles-wrapper h3 {
  border-bottom: 2px solid #D6CAA8 !important;
  padding-bottom: 4px !important;
  font-weight: 600 !important;
  color: #3A2E2E !important;
}

.editor-styles-wrapper h4 {
  border-bottom: 1px solid #D6CAA8 !important;
  padding-bottom: 3px !important;
  font-weight: 600 !important;
  color: #3A2E2E !important;
}



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

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

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