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

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



.article h1 {
  display: block;
  font-size: 22px;
  color: #333;
  padding-bottom: 6px;
  border-bottom: 4px solid transparent;
  border-image: linear-gradient(to right, #4aa3a3, #6fc2c2);
  border-image-slice: 1;
}


.article h2 {
  padding: 0.5em; /*文字周りの余白*/
  color: #2d4d3a; /* 深みのあるグリーン文字 */
  font-size: 18px; /*文字サイズ*/
  background: #f5fbf7; /* 淡いグリーン系の背景 */
  border-left: solid 5px #4aa3a3; /* 左線：青緑アクセント */
  border-bottom: solid 2px #c9e3db; /* 下線：やわらかいグリーングレー */
  margin-left: 0px;
  margin-right: 0px;
}

.article h3 {
padding: 0.5em;/*文字周りの余白*/
color: #2d6665;/*文字色*/
font-size: 18px; /*文字サイズ*/
background: #fffaf4;/*背景色*/
border-left: solid 5px #97bd22;/*左線（実線 太さ 色）*/
border-bottom: solid 2px #d7d7d7;/*下線*/
margin-left: 0px;
margin-right: 0px;
}



/*サイドバーデザイン*/

.sidebar h3 {
    background: none; /*背景色を解除*/
    padding: 0; /*余白をなしに*/
    font-size: 16px; /*文字サイズを小さく*/
    letter-spacing: 2px; /*文字の間隔を少し広く*/
}
.sidebar h3:first-letter {
    font-size: 1.5em; /*最初の文字を1.5文字分に大きく*/
}
.sidebar h3:after { /*グラデーションのラインを引く*/
    content:"";
    display:block;
    height:1px;
    width:100%;
    background: -webkit-linear-gradient(left, #40bfa0 0%,#fef785 82%,#f37b7b 100%);
    background: linear-gradient(to right, #40bfa0 0%,#fef785 82%,#f37b7b 100%);
}

/*サイドバーデザインここまで*/


/*サイドバーのカテゴリー*/

.widget_categories ul li a { /*親カテゴリ用のコード*/
    color: #333;
    text-decoration: none;
    padding: 6px 0;
    display: block;
    padding-right: 4px;
    padding-left: 4px;
    border-top: 1px dotted #ccc; /*上部にボーダーを引く*/
}
.widget_categories ul li a::before { /*親カテゴリのアイコン*/
    font-family: FontAwesome;
    content: "\f0da";
    padding-right: 10px;
}
.widget_categories > ul > li > a:first-child { 
    border-top: none; /*最初の親カテゴリは上部ボーダーを消す*/
}
.widget_categories > ul > li > a:last-child {
    border-bottom: 1px dotted #ccc; /*最後の親カテゴリは下部ボーダーを引く*/
}
.widget_categories ul li a .post-count { /*記事数用のコード*/
    display: block;
    float: right;
    background: #ededed;
    padding: 0 1em;
    font-size: 14px;
    margin-top: .3em;
    border-radius: 4px;
}
.widget_categories ul li a:hover { /*親子共通マウスホバー時*/
    background: none;
    transition: 0.5s;
    color: #72c7e6;
}
.widget_categories ul li a:hover .post-count { /*記事数のマウスホバー時*/
    background: #72c7e6;
    color: #fff;
    transition: 0.5s;
}
.widget_categories ul li ul { /*子カテゴリのボックス*/
    padding-top: 20px;
    border-bottom: 1px dotted #ccc;
}
.widget_categories ul li ul li a { /*子カテゴリ用のコード*/
    color: #333;
    text-decoration: none;
    padding: 0 4px 0 4px;
    display: block;
    border: none;
}
.widget_categories ul li ul li a::before { /*子カテゴリのアイコン*/
    font-family: FontAwesome;
    content: "・";
    padding: 0;
}

/*サイドバーのカテゴリーここまで*/


/* カテゴリウィジットをマウスオーバーで展開 */
.widget_categories ul li  a + ul {
	display:none;
}
.widget_categories ul li:hover ul {
	display:block;
}
/* カテゴリウィジットをマウスオーバーで展開-ここまで */


/*YT-umekomi*/
.flxmv01 {
    position: relative;
    max-width: 100%;
    padding-top: 56.25%;
}
.flxmv01 iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

/*TV-kihoninfo*/
.tvkihoninfo dl{
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 20px;
    margin-left: 0;
    padding-top: 0;
    padding-right: 0;
    padding-bottom: 0;
    padding-left: 0;
    zoom: 100%;
}

.tvkihoninfo dt{
    float: left;
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 0;
    margin-left: 0;
    text-align: left;
	font-size:16px;
    font-weight: bold;
    width: 174px !important;
    padding-top: 10px;
    padding-right: 0;
    padding-bottom: 10px;
    padding-left: 25px;
    background-image : url(https://www.clovertv.com/wp-content/uploads/ptmark001.png);
    background-position: 5px 17px;
    background-repeat: no-repeat;
    background-color: #fdffee;
	color:#007f34;
    border-bottom-width: 1px;
    border-bottom-style: dashed;
    border-bottom-color: #bed7b0;
	}

.tvkihoninfo dd{
	font-size:16px;
	margin-top : 0px;
	margin-bottom : 0px;
	overflow: visible;
	padding-top: 10px;
	padding-left: 10px;
	padding-bottom: 10px;
    margin-left : 175px;
    border-bottom-width: 1px;
    border-bottom-style: dashed;
    border-bottom-color: #bed7b0;
}

/*hr-none-0px*/
hr{
border:none;
height:0px;
}

/*tv-livstrm-videoリンクの枠を白色*/
.tvwaku01 td,
.tvwaku01 tr {
  border: 1px solid transparent;
}

.tvwakuline01 {
	border-bottom-width: 1px;
	border-bottom-color: #000000;
}

/*固定ページのタイトルを消す例*/
#post-270 h1.entry-title{
	display:none;
}

/*サイドバー新着記事装飾*/
.widget_new_entries ul li, .widget_new_popular ul li, .widget_popular_ranking ul li {
    clear: left;
    float: none;
    margin-bottom: 10px;
    overflow: auto;
    border-bottom: 1px solid #ccc;
}
.widget_new_entries ul li img, .widget_new_popular ul li img, .widget_popular_ranking ul li img {
    border: medium none;
    display: inline;
    float: left;
    margin-top: 3px;
    margin-right: 8px;
    width: 75px;
    height: 75px;
    margin-bottom: 10px;
    box-shadow: 2px 2px 5px #ccc;
}
.widget_new_entries a, .widget_new_popular a, .widget_popular_ranking a, .wpp-list a, .article-list .entry-title a {
    text-decoration: none;
    font-size: 90%;
}
/*サイドバー新着記事装飾ここまで*/


/*モバ非表示*/
.mobilenone{
  display:block;
}
@media (max-width: 800px) {
.mobilenone{
  display: none;
}
}
/*モバ非表示ここまで*/



/*行間の変更　初期設定は1.75、mgn 1.5em 0。ｍmarginは段落の間隔。上下の余白が1.5em分、左右は0で余白なし*/

.entry-content p {
line-height: 1.75;
margin: 1.5em 0;
}

/*行間の変更ここまで*/



/*縦型カード (2列) をふわっと浮かせるアレンジ*/
.ect-vertical-card .entry-card-wrap{
	background-color:#fff;
	border-radius:5px;
	margin-bottom:20px;
	transition-duration:.4s;
}
.ect-vertical-card .entry-card-wrap:hover{
	transform:translateY(-2px);
	box-shadow:0 8px 18px -5px rgba(85,85,85,75);
}
.ect-vertical-card .entry-card-wrap .entry-card-thumb{
	margin-bottom:5px;
}
.home main, .archive main{
	background:0 0;
}

/*縦型カード (2列) をふわっと浮かせるアレンジ　ここまで*/




/*固定ページ -トップページ - 更新日 非表示 */

.post-270 .date-tags {
display: none;
}

/*固定ページ -トップページ - 更新日 非表示 ここまで */



/*各ページの目次　ここから*/

/* ===== Modern TOC – green minimal card (fixed) ===== */
:root{
  --toc-accent: #4aa3a3;
  --toc-text:   #2d4d3a;
  --toc-muted:  #7a8a83;
  --toc-bg:     #f5fbf7;
  --toc-border: #cfe4dd;
  --toc-hover:  #e7f4ef;
}

/* 代表的なTOCコンテナを一括指定 */
#toc_container, .toc, .toc-container, .ez-toc-container {
  /* 1) 幅の安全化：親を絶対に超えない */
  width: min(70%, 860px);     /* PCでは70%か860pxの小さい方 */
  max-width: 100%;            /* デバイス幅を超えない保険 */

  /* 2) パディング＋ボーダーも幅計算に含める（はみ出し予防） */
  box-sizing: border-box;

  margin: 1rem auto;
  font-size: 15px;
  color: var(--toc-text);
  background: var(--toc-bg);
  border: 1px solid var(--toc-border);
  border-radius: 12px;
  padding: 12px 14px;

  /* 3) 内部で一瞬はみ出しても外へは出さない（モバイル揺れ止め） */
  overflow-x: clip;

  box-shadow: 0 4px 14px rgba(0,0,0,.05);
}

/* タイトル行 */
#toc_container .toc_title, 
.toc .toc-title, 
.ez-toc-title, 
.toc__title {
  display: flex; align-items: center; gap: .6em;
  font-weight: 700;
  font-size: 16px;
  margin: 0 0 .4rem 0;
  color: var(--toc-text);
}

/* タイトル左のアクセントドット */
#toc_container .toc_title::before,
.toc .toc-title::before,
.ez-toc-title::before,
.toc__title::before{
  content:"";
  display:inline-block;
  width:8px; height:8px;
  border-radius: 999px;
  background: var(--toc-accent);
}

/* リスト（番号付き・入れ子対応） */
#toc_container ul, .toc ul, .ez-toc-list, .toc-list {
  list-style: none; margin: .4rem 0 0 0; padding: 0;
  counter-reset: toc-counter;
}
#toc_container li, .toc li, .ez-toc-list li, .toc-list li{
  position: relative;
  padding: .38rem .4rem .38rem 2.6rem;
  border-radius: 8px;
}

/* 行頭の丸数字（カウンタ） */
#toc_container li::before, .toc li::before, .ez-toc-list li::before{
  counter-increment: toc-counter;
  content: counter(toc-counter);
  position: absolute; left: .6rem; top: 50%; transform: translateY(-50%);
  width: 1.35rem; height: 1.35rem; line-height: 1.35rem; text-align: center;
  font-size: .78rem; font-weight: 700;
  color: var(--toc-accent);
  background: #ffffff;
  border: 1px solid var(--toc-border);
  border-radius: 999px;
}

/* リンク（長い単語/URLが折り返されず押し広げるのを防ぐ） */
#toc_container a, .toc a, .ez-toc-list a {
  color: var(--toc-text); text-decoration: none;
  display: block;
  overflow-wrap: anywhere;    /* ★ はみ出し防止の肝 */
  word-break: normal;         /* anywhere優先で自然折返し */
}
#toc_container a:hover, .toc a:hover, .ez-toc-list a:hover {
  background: var(--toc-hover);
  border-radius: 6px;
}

/* 階層（サブ項目） */
#toc_container ul ul li,
.toc ul ul li,
.ez-toc-list ul li {
  padding-left: 2.8rem;
  opacity: .92;
  font-size: 14px;
}

/* スマホは全幅＆余白調整（厳密に揺れを止める） */
@media (max-width: 768px){
  #toc_container, .toc, .toc-container, .ez-toc-container {
    width: 100%;
    max-width: 100%;
    padding: 10px 12px;

    /* モバイルの横揺れ最終停止スイッチ */
    overflow-x: clip;
  }
}

/* 現在見出しハイライト用（任意） */
.toc-active a { 
  background: var(--toc-hover);
  border-left: 3px solid var(--toc-accent);
  border-radius: 6px;
  padding-left: .5rem;
}

/* ページ全体のスムーススクロール（そのままでOK） */
html { scroll-behavior: smooth; }


/*各ページの目次　ここまで*/


/* リンクの下線を消す */
a {
  text-decoration: none;
  color: #1a73e8; /* 一般的なリンクカラー（Googleブルー） */
  transition: color 0.2s ease;
}

/* マウスが乗ったときの変色 */
a:hover {
  color: #0c47a1; /* やや濃い青：自然で広く使われているホバー色 */
}

/* リンクの下線消し＆マウス乗ったとき　ここまで */























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

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

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