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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/* 見出しのデザインリセット */
/*H2 */
.entry-content h2{
border:none;
background:none;
padding: 0;
}

/* H3 */

.article h3{
border-top:none;
border-bottom:none;
border-left:none;
border-right: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;
}

.article h2 {
  font-size: 20px !important;/*文字のサイズ*/
  border-top: 2px solid #7B86C6;/*上線*/
  border-bottom: 2px solid #7B86C6;/*下線*/
  color: #323232;
  padding: .5em 0;
  margin-bottom: 15px;
}

.article h3 {
  position: relative;
  padding: 0.25em 0;
}
.article h3:after {
  content: "";
  display: block;
  height: 4px;
  background: -webkit-linear-gradient(to right, rgb(230, 90, 90), transparent);
  background: linear-gradient(to right, rgb(230, 90, 90), transparent);
}

.article h4 {
  font-size: 20px !important;/*文字のサイズ*/
  position: relative;
  color: #323232;
  padding-left: 1.3em;
  line-height: .7em;
  margin-bottom: 15px;
  border-top: none;
  border-bottom: none;
}

.article h4:before {
  font-family: "Font Awesome 5 Free";
  content: "\f058";
  position: absolute;
  font-size: 1em;
  left: 0;
  top: 0;
  font-weight: 500;
  color: #E07487;
  line-height: 1.6em;
}

/* 目次の編集 
.toc-title {
    font-weight: bold;
}
 
.toc {
	background: #f4f5f7;
	border: 5px solid;
	color: #0693cd;
	font-size: 16px;
}
 
.toc a {
	color: #0693cd;
}
*/

/**目次**/
.toc {
  display: block;
  padding: 0px;
  max-width: 600px;
  border: 1.2px #708090 solid !important;
  font-family: 'Noto Sans JP', sans-serif;
}
.toc-title {
  position: relative;
  padding: 10px 0;
  background: #708090;
  color: #fff;
  font-weight: bold;
}
.toc .toc-content {
  padding: 15px 20px;
  background-color: #ffffff;
}
.toc-list > li li a {
  font-weight: normal;
  font-size: 95%;
  color: #696969;
  margin-left: 0px;
}

/* テーブルの編集 */
/* 見出しセルの文字色・背景色・枠線設定 */
.entry-content th {
	color: #ffffff;
	background-color: #3cb371;/* 目次の編集 前「#3cb371」*/
	border: solid 1px #a1e6c0;
}
/* 見出し以外のセルの枠線設定 */
.entry-content td {
	border: solid 1px #a1e6c0;
}
/* 奇数行の背景色 */
.entry-content tr:nth-child(odd) td {
	background-color: #ffffff;
}
/* 偶数行の背景色 */
.entry-content tr:nth-child(even) td {
	background-color: #f0fff0;/* 目次の編集 前「#f0fff0」*/
}

/*---------------------------------
リストの点を画像に変更
.entry-content ul {
  list-style: none;
}

.entry-content ul li {
  position: relative;
  line-height:1.8;
  padding-left: 0.5em;
  padding-right: 0.5em;
}

.entry-content ul li:before {
  content: url( https://kaso-comfylife.com/wp-content/uploads/2022/10/22984039-e1665484738369.png );
  position: absolute;
  left: -100em;
  top: -0.1em;
}
--------------------------------*/

/************************************
** 拡張スタイル「タブボックス」のデザインをスタイリッシュにする
************************************/

/*枠組み*/
.blank-box.bb-tab {
	position: relative; /*要素の配置*/
	padding: 2.2em 1.2em 1em; /*内側の余白*/
	border-width: 2px; /*線の太さ*/
	border-radius: 0; /*丸み*/
	font-size: .9375em; /*文字の大きさ*/
}

/*ラベル*/
.blank-box.bb-tab .bb-label {
	position: absolute; /*要素の配置*/
	top: 0; /*上からの距離*/
	left: 0; /*左からの距離*/
	border-radius: 0; /*丸み*/
	font-style: italic; /*文字のスタイル*/
	font-size: .833333em; /*文字の大きさ*/
}

/*ブロックエディター用*/
.blank-box.bb-tab::before {
	position: absolute; /*要素の配置*/
	top: 0; /*上からの距離*/
	left: 0; /*左からの距離*/
	border-radius: 0; /*丸み*/
	font-style: italic; /*文字のスタイル*/
	font-size: .833333em; /*文字の大きさ*/
}

/************************************
** タブ見出しボックス（Cocoon 汎用ブロック）のデザインをスタイリッシュにする
************************************/

/*枠組み*/
.tab-caption-box {
	position: relative; /*要素の配置*/
	margin-top: 2em; /*上の余白*/
	margin-right: 2%; /*右の余白*/
	margin-left: 2%; /*左の余白*/
}

/*ラベル*/
.tab-caption-box-label {
	position: absolute; /*要素の配置*/
	top: 0; /*上からの距離*/
	left: 0; /*左からの距離*/
	border-radius: 0; /*丸み*/
	font-size: .833333em; /*文字の大きさ*/
}

/*コンテンツ*/
.tab-caption-box-content {
	padding: 2.2em 1.2em 1em; /*内側の余白*/
	border-width: 3px; /*線の太さ*/
	border-radius: 0; /*丸み*/
	font-size: .9375em; /*文字の大きさ*/
}

/*横幅 440px 以下に適用される*/
@media screen and (max-width: 440px){
	/*枠組み*/
	.tab-caption-box {
		margin-right: 0; /*右の余白*/
		margin-left: 0; /*左の余白*/
	}
}

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

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

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