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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/* ヘッダー */
#header-container .header-in {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%; 
  height: 80px;
}

.logo-text a {
  display: flex !important;
  align-items: center;
}

.logo-text a::before {
  content: '';
  display: inline-block;
  width: 60px;
  height: 60px;
  margin-right: 15px;
  background-image: url('/wp-content/uploads/2025/11/193dc268c54a762b786f8ec4db8ea14a.png');
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
}
#header-container {
  height: auto !important;
}

/* ヘッダーメニュー */
#navi a {
    position: relative;
    display: inline-flex;
    align-items: center;
}
#navi .h-menu-home .item-label::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f015";
    display: inline-block;
    margin-right: .4em;
    line-height: 1;
	position: absolute;
	left: 1.0em;
	top: 50%;
    transform: translateY(-50%);
}
#navi .h-menu-top .item-label::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f781";
    display: inline-block;
    margin-right: .4em;
    line-height: 1;
	position: absolute;
	left: 1.0em;
	top: 50%;
    transform: translateY(-50%);
}

/* サイド */
#sidebar .search-edit {
    border-radius: 30px;
}

/* TOP */
/* FRONT */
.bc-front { margin: 0 auto; max-width: 1160px; padding: 28px 18px; }

.bc-block { margin-bottom: 48px; }
.bc-heading {
  position: relative;
  text-align: left;
  color: #333;
  font-weight: 700;
  font-size: 0.9rem;
  letter-spacing: .04em;
  line-height: 1.4;
  margin: 0 0 1.5em;
}

.bc-heading::before {
  content: attr(data-label);
  display: block;
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 1.65rem;
  line-height: 1.5;
  letter-spacing: .02em;
  color: #111;
}

/* グリッド：常に 1 → 2 列（デスクトップでも2列のまま） */
.bc-grid { display: grid; gap: 24px; grid-template-columns: 1fr; }
@media (min-width: 640px){ .bc-grid { grid-template-columns: repeat(2, 1fr); } }

/* 注目枠も2列固定にする（必要なら） */
.bc-grid--feature { grid-template-columns: 1fr; }
@media (min-width: 640px){ .bc-grid--feature { grid-template-columns: repeat(2, 1fr); } }

/* サムネ：16:9・大きめ・角丸 */
.bc-thumb { position: relative; width: 100%; aspect-ratio: 16/9; overflow: hidden; background: #f2f2f2; border-radius: 10px; }
.bc-thumb__img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* メタ行＆タイトルの視認性を確保 */
.bc-meta { display: flex; gap: 10px; align-items: center; margin-top: 10px; font-size: 13px; color: #666; }
.bc-cat {
  background: #607d8b;
  color: #ffffff;
  padding: 2px 8px;
}
.bc-date {
  color: #333333;
  font-weight: bold;
}

.bc-title {
  font-size: clamp(17px, 2vw, 21px);
  line-height: 1.55;
  margin: 8px 0 0;
  font-weight: 700;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* カード基本 */
.bc-card { list-style: none; }
.bc-card__link { display: block; color: inherit; text-decoration: none; }
.bc-card__link:hover .bc-title { text-decoration: underline; }

/* 記事 */
.article h2 {
    position: relative;
    padding: .5em .7em;
    border-radius: 10px;
    background-color: #607d8b;
    color: #fff;
}

.article h2::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 30px;
    width: 0;
    height: 0;
    border: 11px solid transparent;
    border-top: 11px solid #607d8b;
}

article.article h3 {
    all: unset;              /* Cocoonの装飾を完全解除 */
    display: flex;           /* 再設定（unsetで消えるため） */
    align-items: center;
    box-sizing: border-box;  /* 安全のため */
    margin: 1.5em 0 0.8em;   /* 好きな余白を指定 */
    padding: .5em .7em;
    background-color: #f2f2f2;
    color: #333333;
    font-size: 22px;         /* 必要なら維持 */
    font-weight: bold;       /* 必要なら追加 */
}

article.article h3::before {
    display: inline-block;
    width: 5px;
    height: 1.5em;
    margin-right: .5em;
    background-color: #607d8b;
    content: '';
}

/* 目次 */
.article .toc {
    background: #f5f5f5;
    width: 100%;
}
.article .toc .toc-content ul:first-child,
.article .toc .toc-content ol:first-child {
    list-style-position: inside;
    padding: 0;
}
.article #toc ol.toc-list > li:not(:first-child) {
    border-top: 1px solid #cccccc;
    margin-top: 10px;
    padding-top: 10px;
}
.article .toc .toc-title {
    font-weight: bold;
    padding-left: 0;
    text-align: left;
}
.article .toc .toc-title:before {
    color: #607d8b;
    content: "\f03a";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 10px;
}

/* 記事アイキャッチ */
.eye-catch .cat-label {
	top: auto;
	bottom: 1.8em;
}
body.single .article .eye-catch img {
    border-radius: 15px;
    overflow: hidden;
}


.page-promotion-txt {
	background: #fafafa;
	border: 1px solid #cccccc;
	border-radius: 3px;
	color: #333333;
	font-size: 16px;
	padding: 8px 5px;
	text-align: center;
}
iframe {
    width: 100%;
}

/* FA一覧専用テーブルの基本 */
.npb-fa-table {
  border-collapse: collapse;
  width: 100%;
}

/* 年（1列目）をセンタリング */
.npb-fa-table th:first-child,
.npb-fa-table td:first-child {
  text-align: center;
}

/* ランク列（3列目）をセンタリング：ランク列を持つテーブルだけ */
.npb-fa-table.npb-fa-table--with-rank th:nth-child(5),
.npb-fa-table.npb-fa-table--with-rank td:nth-child(5) {
  text-align: center;
}

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

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

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