@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){
  /*必要ならばここにコードを書く*/
}

 /* ----- 文章を蛍光ペンっぽく ----- */

.keikoup {
background: linear-gradient(transparent 60%, #CCEEFF 50%);
padding-bottom: .0em;
font-weight:bold;
color: #606060;
}

 /* ----- 文章を蛍光ペンっぽく・ピンク系 ----- */

.keikouppink{
background: linear-gradient(transparent 60%, #FFD7E4 50%);
padding-bottom: .0em;
font-weight:bold;
color: #606060;
}



 /* ----- 大きめ見出し角 ----- */

.article h2 {
border: none;
background: #f7adc3;/*背景色*/
color: white;/*文字の色*/
padding: 0.5em;/*文字まわり（上下左右）の余白*/
}



 /* ----- 中見出し ----- */

.article h3 {
color: #404040; /*文字色*/
border-bottom: dashed 2px #f7adc3;
/*線の種類（点線）2px 線色*/
} 



 /* ----- 小見出し ----- */

.article h4 {
position: relative;
padding-left: 1.2em;/*アイコン分のスペース*/
line-height: 1.4;
border-bottom: solid 1px #e0e0e0;
}

h4:before{ font-family: "FontAwesome";
content: "\f00c";/*アイコンのユニコード*/
position: absolute;/*絶対位置*/
font-size: 1em;/*サイズ*/
left: 0;/*アイコンの位置*/
top: 1;/*アイコンの位置*/
color: #f7adc3; /*アイコン色*/
}


 /* ----- 塗りつぶし枠 ----- */

.box3 {
    padding: 2em 1em;
    margin: 2em 0;
    color: #606060;
    background: #FFF0F5;/*背景色*/
}
.box3 p {
    margin: 0; 
    padding: 0;
}


 /* ----- 本文の色変更　----- */

.entry-content {
  color: #606060;
}



/* ---- サイドバーのタイトル見出し　----- */
#sidebar h3 {
border: none;
background: #f7adc3;/*背景色*/
color: white;/*文字の色*/
padding: 0.5em;/*文字まわり（上下左右）の余白*/
}



/* ---- タグ　----- */
.tagcloud a {
    display: inline-block;
    margin-bottom: 5px;
    padding: 6px 12px;
    text-decoration: none;
    border-radius: 0.5em;
    border: 1px solid #e6e6e6;
    background: #FFF;
}

.tagcloud a:hover {
    transition: 0.3s;
    background: #EFEFEF;
}



/* 二重枠 */

.box2 {
    padding: 2em 1em;
    margin: 2em 0;
    border: double 5px #fc8eac;
}
.box2 p {
    margin: 0; 
    padding: 0.2em;

}

/* 塗りつぶし枠 黄色 */

.box22 {
    padding: 2em 1em;
    margin: 2em 0;
    color: #606060;
    background: #ffffe0;/*背景色*/
}
.box22 p {
    margin: 0; 
    padding: 0;
}

/* ボタン　*/

.btn-square {
  display: inline-block;
  padding: 0.5em 1em;
  text-decoration: none;
  background: #fc8eac;/*ボタン色*/
  color: #FFF;
  border-bottom: solid 4px #e8a2b5;
  border-radius: 3px;
}
.btn-square:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(4px);
  transform: translateY(4px);/*下に動く*/
  border-bottom: none;/*線を消す*/
}


/*広告 */

.koukoku {
    padding: 0.5em 1em;
    margin: 2em 0;
    color: #606060;
    background: #f5f5f5;/*背景色*/
}
.koukoku p {
    margin: 0; 
    padding: 0;
}



/* パンくずリスト */
.breadcrumb{
  margin-bottom: 20px;
  color: #777;
  font-size:13px;
}

.breadcrumb .sp{
  margin:0 10px;
}

.breadcrumb a{
  text-decoration:none;
	color:#777;
	margin-left: 2px;
}

/* サイトタイトルの対策 */

.site-title-img {
  width: 100%;
  height: 100%;
  aspect-ratio: 107 / 7;
}

/* サムネイルのサイズ*/

.entry-card-thumb img {
  width: 100%;
  height: auto;
  object-fit: contain;
  background-color: #fff;
}