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

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

@font-face {
  font-family: 'inknut-antiqua';
  font-style: NORMAL_OR_ITALIC;
  font-weight: NUMERIC_WEIGHT_VALUE;
  src: url(InknutAntiqua-Regular.ttf) format('ttf');
}


/* スマホ表示で投稿一覧を2列にするカスタマイズ */
@media screen and (max-width: 599px) {
  /* リスト全体をフレックスボックス化 */
  #list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  /* 各カードの幅を48%（2列）にする */
  .entry-card-wrap {
    width: 48% !important;
    margin-bottom: 15px !important;
    /* grayish特有の枠線などが邪魔な場合は調整が必要ですが一旦これで */
  }

  /* 2列だと狭いので、スマホでは「説明文（抜粋）」を非表示にする */
  /* 写真を大きく見せたい場合に有効です */
  .entry-card-snippet {
    display: none;
  }
  
  /* スマホでのカード内の余白を少し詰める（写真優先のため） */
  .entry-card-content {
    padding: 8px 5px !important;
  }
  
  /* タイトルの文字サイズを少し小さくしてバランスを取る */
  .entry-card-title {
    font-size: 14px !important;
    line-height: 1.4;
  }
}
/* PC・スマホ共通：サムネイルを強制的に正方形にする */
.entry-card-thumb.card-thumb {
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
  display: block !important;
}

.entry-card-thumb.card-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
/* スマホ表示でサムネイルを強制的に正方形にする改善版 */
@media screen and (max-width: 599px) {
  /* 画像の外枠を正方形に固定 */
  .entry-card-thumb.card-thumb {
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
    display: block !important;
  }
  /* 中の画像を枠いっぱいに広げて切り抜き */
  .entry-card-thumb.card-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important; /* 歪ませずに中央で切り抜き */
    position: relative !important;
  }
}

/* 記事に枠をつける */
.ect-vertical-card .entry-card-wrap {
  max-width: 100%;
  box-shadow: 0 2px 4px rgb(0 0 0 / 25%);
  border-radius: 3px;
}
.entry-card {
  position: relative;
  overflow: hidden;
  }
/* カテゴリーラベル非表示 */
.entry-card .cat-label{
display: none;
}

/*グローバルメニューのフォントサイズ等変更*/
.navi-in .menu-header .item-label{
font-size:small;
}

/*見出し初期化*/
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6
{
padding: 0;
margin: 0;
background:none;
border-collapse: separate;
border-spacing: 0;
border-top: none;
border-right: none;
border-bottom: none;
border-left: none;
line-height: normal;
position:relative;
}
/*grayish見出しデザインリセット*/
.article h3,
.article h4,
.article h5,
.article h6 {
	background-color:transparent;/*背景色を消す*/
	border:none;/*上下左右の枠線を消す*/
	padding:0;/*余白を消す*/
}
.article h3::before {
	border: none;/*上下左右の枠線を消す*/
}
.article h4::before {
	content: none;/*チェックマークを消す*/
}

/*見出しデザインを変える場合はこれより下に記載してください*/

/*H1は記事ページのタイトルデザイン*/
/*H2は変えない!*/




/*H5は左寄せ矢印*/
/*見出し矢印→*/
.article h5 {
	font-size:small;
	font-family: "Inknut Antiqua", serif;
	font-weight: 300;
	font-style: normal;
	position: relative;
	padding-left: 25px;/*横余白サイズ*/
	padding-right: 25px;/*横余白サイズ*/
	text-align:right;
}
.article h5:before,
.article h5:after {
	position: absolute;
	content: '';
	right: 0;
	bottom: 0; 
}
.article h5:before {
	right: 0;
	width: 15px;/*三角形の横サイズ*/
	height: 15px;/*三角形の縦サイズ*/
	background-color: #c8c8c8;/*三角形の色*/
	clip-path: polygon(	0% 0%, 0% 100%, 100% 100%);/*三角形を指定*/

}
.article h5:after {
	right: 15px;
	width: calc(40% - 15px);/*ライン全体の長さ：100%のラインから三角の15px分をマイナスする*/
	border-bottom: solid 4px #c8c8c8;/*ラインの指定*/
}
/*H6は見出し矢印←*/
.article h6 {
	font-size:small;
	font-family: "Inknut Antiqua", serif;
	font-weight: 300;
	font-style: normal;
	position: relative;
	padding-left: 25px;
	right: 0;
}
.article h6:before,
.article h6:after {
  position: absolute;
  content: '';
	right: 0;
  bottom: 0;
}
.article h6:before {
	right: 0;
  left: 0;
  width: 15px;/*三角形の横サイズ*/
  height: 15px;/*三角形の縦サイズ*/
  background-color: #c8c8c8;/*三角形の色*/
  clip-path: polygon(100% 0%, 100% 100%, 0% 100%);/*三角形を指定*/
}
.article h6:after {
  left: 15px;
  width: calc(40% - 15px);/*ライン全体の長さ：100%のラインから三角の15px分をマイナスする*/
  border-bottom: solid 4px #c8c8c8;/*ラインの指定*/
}


.inknut-antiqua-light {
  font-family: "Inknut Antiqua", serif;
  font-weight: 300;
  font-style: normal;
}
.inknut-antiqua-regular {
  font-family: "Inknut Antiqua", serif;
  font-weight: 400;
  font-style: normal;
}
.inknut-antiqua-medium {
  font-family: "Inknut Antiqua", serif;
  font-weight: 500;
  font-style: normal;
}
.inknut-antiqua-semibold {
  font-family: "Inknut Antiqua", serif;
  font-weight: 600;
  font-style: normal;
}
.inknut-antiqua-bold {
  font-family: "Inknut Antiqua", serif;
  font-weight: 700;
  font-style: normal;
}
.inknut-antiqua-extrabold {
  font-family: "Inknut Antiqua", serif;
  font-weight: 800;
  font-style: normal;
}
.inknut-antiqua-black {
  font-family: "Inknut Antiqua", serif;
  font-weight: 900;
  font-style: normal;
}

/*コメント非表示*/
.su-posts-default-loop .su-post-comments-link { display:none; }