@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 h2,
.article h3,
.article h4,
.article h5,
.article h6 {
   margin: 3em 0 1em;/*上、左右、下方向*/
} 

.tagline {
	text-align: left;
	margin-top: -200px;
		margin-left: 70px;
}

.logo-text {
	text-align: left;
	margin-left: 70px;
	margin-top: -30px;
}

.sidebar h3 {
  position: relative;
  padding-left: 25px;
	background: #ffffff;
	color: #000000;
}

.sidebar h3:before {
  position: absolute;
  content: '';
  bottom: 5px;
  left: 0;
  width: 0;
  height: 0;
  border: none;
  border-left: solid 15px transparent;
  border-bottom: solid 15px #00aeba;
}

.sidebar h3:after {
  position: absolute;
  content: '';
  bottom: 5px;
  left: 10px;
  width: 100%;
  border-bottom: solid 3px #00aeba;
}

.navi-in > ul li {
    height: 45px;
    line-height: 45px;
	font-weight: normal;
}

.navi-in > ul li:hover > ul > li {
    height: 45px;
	font-weight: normal;
}

.cat-label, .mobile-menu-buttons, .mobile-menu-buttons .menu-button > a, .navi-menu-content, .navi-menu-content a, .go-to-top-button, #submit {
    background-color: #00aeba;
}

.article h2 {
	padding: 0.5rem 0.5rem;
  border-left: 5px solid #00aeba;
	border-bottom: 2px solid #00aeba;
  background: #FFFAFA;
	color: #000;
}

.article h3 {
	font-size: 20px;
	padding: 0.5rem 0.5rem;
	  border-left: 0px;
	border-bottom: 2px solid #00aeba;
	color: #000;
}

.article h4 {
	font-size: 19px;
	padding: 0.7rem 0.7rem;
	border-bottom: 2px dotted #00aeba;
	color: #000;
}

/* 目次全体デザイン */
.toc{
    background:#FFFFFF; /* 目次全体の背景色を変える場合はここを変更 */
    border:none;
    display:block;
    border-top:5px solid;
    border-top-color:#00aeba;
    box-shadow: 0 2px 2px rgba(0,0,0,0.2);
    padding: 20px 25px;
	max-width:500px;/*外枠の最大幅を指定*/
}
/* 目次の文字指定 */
.toc-title {
    text-align:left;
    margin: 0 20px 20px -10px;
    padding-left: -20px;
    font-size: 18px;
    font-weight: 700;
    color: #1e73be; /* 目次の文字色を変える場合はここを変更 */
}
/* 目次のアイコン設定 */
.toc-title:before {
    top: 0;
    left: -45px;
    width: 50px;
    height: 50px;
    font-family: "Font Awesome 5 Free";
    content : "\f0ca"; /* アイコンを変える場合はここを変更 */
    font-size:12px;
	font-weight: bold;
    margin-right:5px;
    color:#FFF; /* アイコンの色を変える場合はここを変更 */
    background-color:#00aeba; /* アイコンの背景色を変える場合はここを変更 */
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    padding:14px;
}
/* 目次のデザインカスタマイズ */
.toc-content ol {
    padding: 0 0.5em;
    position: relative;
}
.toc-content ol li {
    line-height: 1.5;
    padding: 0.7em 0 0.5em 1.4em;
    border-bottom: dashed 1px silver;
    list-style-type: none!important;
}
/* 目次の各節の先頭にあるアイコンを設定 */
.toc-content ol li:before {
    font-family: "Font Awesome 5 Free";
    content: "\f138"; /* アイコンを変える場合はここを変更 */
	font-weight: bold;
    position: absolute;
    left : 0.5em;
    color: #00aeba; /* 色を変える場合はここを変更 */
}
.toc-content ol li:last-of-type {
    border-bottom: none;
}
.toc-content .toc-list li {
    font-weight:700; /* h2のみ太文字に */
}
.toc-content .toc-list li li {
    font-weight:normal; /* h3以降の文字サイズを普通に */
}


/* トップページの「カテゴリごと」のタイトル変更 */
.list-title-in{
	color: #fff;/*文字の色*/
	font-size: 18px;/*文字の大きさ*/
	background: #00aeba;
	width: 100%;
	height: 40px;
	line-height:40px;
}

.list-title-in:before, .list-title-in:after {
	background-color: #00aeba;/*線の色*/
	top: 40%;/*線の高さ*/
}

/************************************
** もっと見るボタンの変更
************************************/

.list-more-button {
	background: #00aeba; /* ボタンの背景色を藍色に変更しています */
	color: #fff; /* 文字色を変更 */
	border: none; /* ボタンの外枠を消しています */
}
.list-more-button:hover { /* クラス名の隣に:hoverをつけると、カーソルがあたった時の挙動を変更できます */
	background: #fff;
	color: #00aeba;
	border: none;
}

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

.logo-text {
	text-align: left;
	margin-top: -30px;
	margin-left: 20px;
}
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
.tagline {
	text-align: left;
	margin-top: 20px;
		margin-left: 20px;
}

.logo-text {
	text-align: left;
	margin-top: -30px;
	margin-left: 20px;
}
}

/************************************
** タブ切り替えのタブの色変更
************************************/

#index-tab-1:checked ~ .index-tab-buttons .index-tab-button[for="index-tab-1"],
#index-tab-2:checked ~ .index-tab-buttons .index-tab-button[for="index-tab-2"],
#index-tab-3:checked ~ .index-tab-buttons .index-tab-button[for="index-tab-3"],
#index-tab-4:checked ~ .index-tab-buttons .index-tab-button[for="index-tab-4"] {
  background: none #1e73be ;
  border: 1px solid #1e73be ;
  color: #fff;
  font-weight: 700;
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
			.tagline {
	text-align: left;
	margin-top: 20px;
		margin-left: 20px;
}

.logo-text {
	text-align: left;
	margin-top: -30px;
	margin-left: 20px;
}


}
/* ↑ 上の @media（480px以下）の閉じ括弧が元から抜けていたため補う（2026-10-23） */

/************************************
** Cocoon 2.9 への更新で変わった見た目を、旧版（2.4.2.4）に戻す調整
** 2026-10-23 世阿弥Entertainment
** 新版の指定のほうが優先度が高い箇所があるため、ここでは !important を使う
************************************/

/* タイトル・抜粋・メニューの行数制限（「…」での省略）をやめ、旧版どおり全文表示 */
.entry-card-title,
.related-entry-card-title,
.widget-entry-card-title,
.prev-post-title,
.next-post-title,
.menu-caption {
  display: block !important;
  -webkit-line-clamp: unset !important;
  overflow: visible !important;
  max-height: none !important;
}
.related-entry-card-snippet {
  display: block !important;
  -webkit-line-clamp: unset !important;
  max-height: 7.8em !important;
  margin-bottom: 0 !important;
}
.item-label {
  overflow: visible !important;
}

/* スマホのグローバルメニューで、子メニューありの「▾」を表示 */
#navi .navi-in > .menu-mobile .has-sub {
  display: block !important;
}

/* サイト名の左右余白（新版で 1em 追加）をなくす */
.site-name-text-link {
  padding: 0 !important;
}
.footer {
  padding: 8px !important;
}

/* 本文エリアの上下余白（新版で広がった分を戻す） */
.main {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

/* 旧版は 1280px 以下で割合レイアウトに切り替わっていた（新版は 1255px 以下）。旧版の境目に合わせる */
@media screen and (max-width: 1280px) {
  .wrap {
    width: auto;
  }
  .main,
  .sidebar,
  .sidebar-left .main,
  .sidebar-left .sidebar {
    margin: 0 .5%;
  }
  .main {
    width: 67.4%;
  }
  .sidebar {
    padding: 1.5%;
    width: 30%;
  }
  .entry-card-thumb {
    width: 38%;
  }
  .entry-card-content {
    margin-left: 40%;
  }
}

/* 記事一覧（新版の flex＋gap を旧版の積み重ねに戻す） */
.list {
  display: block !important;
  margin-bottom: 0 !important;
}
.list > .a-wrap {
  margin-bottom: 3% !important;
}
/* 関連記事（旧版も横並びの flex。カードの中身の並びと間隔を戻す） */
.related-list {
  gap: normal !important;
  margin-bottom: 0 !important;
}
.related-list > .a-wrap {
  margin-bottom: 3% !important;
}
.related-entry-card,
.related-entry-card-content {
  display: block !important;
}
.related-entry-card-content {
  padding-bottom: 1.2em !important;
}
.related-entry-card-meta {
  padding-top: 0 !important;
}
.card-thumb,
.widget-entry-card-thumb {
  margin-bottom: 0 !important;
}
.related-entry-card-thumb {
  margin-top: 0 !important;
  margin-right: 0 !important;
}
.entry-card-title,
.related-entry-card-title {
  margin-bottom: 5px !important;
}
.cat-label {
  font-size: 11px;
}
.entry-categories {
  display: inline-block !important;
}

/* カルーセル */
.carousel-entry-card-title {
  margin-bottom: 0 !important;
  max-height: 3.2em !important;
}
.carousel .slick-track {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.carousel-entry-card-wrap.a-wrap {
  margin-left: 3px !important;
  margin-right: 3px !important;
}

/* SNS シェアボタン */
.sns-share {
  margin: 24px 0 !important;
}
.sns-share-buttons {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* 検索フォーム（入力欄の文字 18px、サイドバーの検索ボタンの余白） */
.search-edit,
.wp-block-search__input,
.sidebar select {
  font-size: 18px !important;
}
.wp-block-search__button {
  padding: 5.25px 1.4px !important;
  border-width: 0 !important;
  min-width: 60px !important;
}

/* 本文中のブロック */
.blank-box {
  padding: 1.2em 1em !important;
}
.tab-caption-box-content {
  margin-top: -3px !important;
}
.tab-caption-box-label {
  display: inline-block !important;
}
.entry-content .wp-block-columns {
  gap: 2em !important;
}
@media screen and (max-width: 834px) {
  .main {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }
  /* 検索メニュー内の検索フォーム */
  #search-menu-content .search-box {
    font-size: 19px !important;
    line-height: 1.4 !important;
    margin: 1em 0 2em !important;
  }
  #search-menu-content .search-edit {
    font-size: 16px !important;
  }
}

/* タブレット幅で開くメニュー（ドロワー・サイドバー）の文字サイズ */
@media screen and (min-width: 481px) and (max-width: 834px) {
  .menu-drawer {
    font-size: 19px !important;
    line-height: 1.4 !important;
    padding-left: 19px !important;
    padding-right: 19px !important;
  }
  .menu-close-button {
    font-size: 38px !important;
    line-height: 1.4 !important;
  }
  .menu-close-button .fa-times {
    font-size: 38px !important;
    line-height: 38px !important;
  }
}

@media screen and (max-width: 480px) {
  .ect-entry-card .a-wrap:not(.ec-big-card-first) .card-thumb {
    margin-bottom: 6px !important;
  }
  .cat-label {
    font-size: 10px;
  }
  .related-entry-card-meta {
    margin-top: 2px !important;
  }
  .common-icon-box {
    padding: 26px 6px 6px !important;
  }
}