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

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

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

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

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

/* 見出しのデザインリセット */
/*H2 */
.entry-content h2{
border:none;
background:none;
padding: 0;
}

/* H3 */
.entry-content h3{
border:none;
background:none;
padding: 0;
}

/* H4 */
.entry-content h4{
border:none;
background:none;
padding: 0;
}

/* H5 */
.entry-content h5{
border:none;
background:none;
padding: 0;
}

/* H6 */
.entry-content h6{
border:none;
background:none;
padding: 0;
}

/* 見出しのデザイン設定 */
/* H2 */
.entry-content h2{
color: #ffffff; /* 文字色 */
font-size: 1.8em; /* 文字サイズ */
background-color: #080835; /* 背景色 */
padding-top:12px; /* 文字と上部の間隔 */
padding-left:8px;/* 文字と左線の間隔 */
padding-bottom:10px;/* 文字と下部の間隔 */
border-left: solid 10px #080835; /* 左側に実線・色*/
margin-bottom: 10px; /* デフォルトより小さめ */
}

/* H3 */
.entry-content h3{
color: #000; /* 文字色 */
font-size: 1.5em; /* 文字サイズ */
background-color: #ebebeb;/* 背景色 */
padding-top:12px; /* 文字と上部の間隔 */
padding-left:8px;/* 文字と左線の間隔 */
padding-bottom:10px;/* 文字と下部の間隔 */
border-left: solid 10px #ebebeb; /* 左側に実線・色*/
margin-bottom: 10px; /* デフォルトより小さめ */
}

/* H4 */
.entry-content h4 {
    color: #000; /* 文字色 */
    font-size: 1.2em; /* 文字サイズ */
    background-color: #ffffff; /* 背景色 */
    padding: 10px 10px 10px 40px; /* 左側にスペースを確保 */
    margin-bottom: 10px; /* デフォルトより小さめ */
    position: relative; /* 擬似要素の配置に必要 */
}

/* H4のオシャレ丸アイコン */
.entry-content h4::before {
    content: "";
    position: absolute;
    left: 10px; /* 左の実線から少し内側 */
    top: 50%;
    transform: translateY(-50%);
    width: 16px; /* 丸のサイズ */
    height: 16px;
    border-radius: 50%; /* 丸くする */
    background: linear-gradient(145deg, #080835, #3a3a8c); /* グラデーション */
    box-shadow: 0 2px 4px rgba(0,0,0,0.3); /* 軽い影で立体感 */
}

/* H5 */
.entry-content h5{
color: #000; /* 文字色 */
font-size: 1.0em; /* 文字サイズ */
padding: 10px;
border-bottom: dotted 3px #080835;/* 下側に点線・色*/
margin-bottom: 10px; /* デフォルトより小さめ */
}

/* H6 */
.entry-content h6{
color: #000; /* 文字色 */
font-size: 1.0em; /* 文字サイズ */
padding: 5px;
border-left: solid 7px #080835; /* 左側に実線・色*/
margin-bottom: 10px; /* デフォルトより小さめ */
}