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

/*
  Josh's Custom CSS Reset
  https://www.joshwcomeau.com/css/custom-css-reset/
*/
*,*::before,*::after{box-sizing:border-box}*{margin:0}@media (prefers-reduced-motion:no-preference){html{interpolate-size:allow-keywords}}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}#root,#__next{isolation:isolate}ul,ol{padding: 0;list-style: none;}li{padding: 0;margin: 0;}a{text-decoration: none;}img{width: auto;height: auto;object-fit: cover;}.fa {display: none;}

/************************************
** 基本
************************************/
:root {
	--text: #121212;
	--text-light: #696969;
	--text-light-link: #888888;
	--border: #dedede;
	--search: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIEdlbmVyYXRvcjogU1ZHIFJlcG8gTWl4ZXIgVG9vbHMgLS0+Cjxzdmcgd2lkdGg9IjgwMHB4IiBoZWlnaHQ9IjgwMHB4IiB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+Cg08ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgoNPHBhdGggZD0ibTAgMGgzMnYzMmgtMzJ6Ii8+Cg08cGF0aCBkPSJtMTUgMGM4LjI4NDI3MTIgMCAxNSA2LjcxNTcyODc1IDE1IDE1IDAgMy43ODIzNTk2LTEuMzk5OTQyNCA3LjIzNzc0NTItMy43MDk5NDA3IDkuODc2MjcwMmw1LjM2Njc5NDkgNS4zNjYzNzA1LTEuNDE0MjEzNSAxLjQxNDIxMzUtNS4zNjYzNzA1LTUuMzY2Nzk0OWMtMi42Mzg1MjUgMi4zMDk5OTgzLTYuMDkzOTEwNiAzLjcwOTk0MDctOS44NzYyNzAyIDMuNzA5OTQwNy04LjI4NDI3MTI1IDAtMTUtNi43MTU3Mjg4LTE1LTE1IDAtOC4yODQyNzEyNSA2LjcxNTcyODc1LTE1IDE1LTE1em0wIDJjLTcuMTc5NzAxNzUgMC0xMyA1LjgyMDI5ODI1LTEzIDEzIDAgNy4xNzk3MDE3IDUuODIwMjk4MjUgMTMgMTMgMTMgNy4xNzk3MDE3IDAgMTMtNS44MjAyOTgzIDEzLTEzIDAtNy4xNzk3MDE3NS01LjgyMDI5ODMtMTMtMTMtMTN6IiBmaWxsPSIjMDAwMDAwIiBmaWxsLXJ1bGU9Im5vbnplcm8iLz4KDTwvZz4KDTwvc3ZnPg==);
	--comment: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIEdlbmVyYXRvcjogU1ZHIFJlcG8gTWl4ZXIgVG9vbHMgLS0+Cjxzdmcgd2lkdGg9IjgwMHB4IiBoZWlnaHQ9IjgwMHB4IiB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+Cg08ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgoNPHBhdGggZD0ibTAgMGgzMnYzMmgtMzJ6Ii8+Cg08cGF0aCBkPSJtMzIgMXYyNWgtMjMuOTg3MzM2NzRsLTguMDEyNjYzMjYgNnYtMzF6bS0yIDJoLTI4djI1LjAwNGw1LjM0NjgzOTg1LTQuMDA0aDIyLjY1MzE2MDE1em0tOCA5djJoLTEydi0yeiIgZmlsbD0iIzAwMDAwMCIgZmlsbC1ydWxlPSJub256ZXJvIi8+Cg08L2c+Cg08L3N2Zz4=);
	--post-time: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIEdlbmVyYXRvcjogU1ZHIFJlcG8gTWl4ZXIgVG9vbHMgLS0+Cjxzdmcgd2lkdGg9IjgwMHB4IiBoZWlnaHQ9IjgwMHB4IiB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+Cg08ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgoNPHBhdGggZD0ibTAgMGgzMnYzMmgtMzJ6Ii8+Cg08cGF0aCBkPSJtMTYgNGM3LjczMTk4NjUgMCAxNCA2LjI2ODAxMzUgMTQgMTRzLTYuMjY4MDEzNSAxNC0xNCAxNC0xNC02LjI2ODAxMzUtMTQtMTQgNi4yNjgwMTM1LTE0IDE0LTE0em0wIDJjLTYuNjI3NDE3IDAtMTIgNS4zNzI1ODMtMTIgMTJzNS4zNzI1ODMgMTIgMTIgMTIgMTItNS4zNzI1ODMgMTItMTItNS4zNzI1ODMtMTItMTItMTJ6bTEgNi0uMDAwMTUxIDUuNTg0NTc4MyA0LjgyODU3ODEgNC44Mjk2MzUzLTEuNDE0MjEzNSAxLjQxNDIxMzUtNS40MTQyMTM2LTUuNDExOTQ5M3YtNi40MTY0Nzc4em04LjE3MTU3MjktMTAuMjQyNjQwNjkgNi4zNjM5NjEgNi4zNjM5NjEwMy0xLjQxNDIxMzYgMS40MTQyMTM1Ny02LjM2Mzk2MS02LjM2Mzk2MTAzem0tMTguMzQzMTQ1NzggMCAxLjQxNDIxMzU3IDEuNDE0MjEzNTctNi4zNjM5NjEwMyA2LjM2Mzk2MTAzLTEuNDE0MjEzNTctMS40MTQyMTM1N3oiIGZpbGw9IiMwMDAwMDAiIGZpbGwtcnVsZT0ibm9uemVybyIvPgoNPC9nPgoNPC9zdmc+);
}
body {
	font-family: "Helvetica Neue", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", sans-serif;
	color: var(--text);
}
a {

}
iframe {
	width: 100%;
}
h1 {
	letter-spacing: .04em;
    font-feature-settings: "palt" 1;
}
/************************************
** コンテンツ
************************************/
.container {
	
}
.wrap {
	max-width: 1000px;
	margin: 0 auto;
	padding: 0 2.5rem;
}
.content {

}
.content-in {

}
.main {

}
.side {
	
}


/************************************
** ヘッダー
************************************/
.header {
	margin: 4rem 0 1.5rem;
}
.header-in {
	display: flex;
    justify-content: center;
}
.site-fixed-logo-image {
	display: none;
}
.site-logo-image {
	max-height: 5rem;
}

/************************************
** モバイルヘッダー
************************************/

/************************************
** ヘッダー検索
************************************/
.header-search {
	display: flex;
    justify-content: center;
	margin: 1.5rem auto;
}
.search-box {
	border: 1px solid var(--border);
	display: flex;
    align-items: center;
	width: 20rem;
    border-radius: .5rem;
}
.search-box input {
	border: none;
	padding: 0 1rem;
	height: 2.5rem;
	width: 100%;
	border-radius: .5rem;
}
.search-submit {
	padding: 0;
	margin: 0;
	background: none;
	border: none;
	display: flex;
	align-items: center;
    justify-content: center;
	height: 2.5rem;
	padding: 0 .75rem;
	cursor: pointer;
}
.search-submit:before {
    content: "";
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
    background-color: var(--text);
    -webkit-mask-image: var(--search);
    mask-image: var(--search);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    mask-position: center center;
    -webkit-mask-size: 1.5rem;
    mask-size: 1.5rem;
}
/************************************
** ヘッダーナビ
************************************/
.navi-in {
	position: relative;
}
/* .navi-in:after {
	content: "";
	position: absolute;
	right: 2.5rem;
	top: 0;
	width: 4rem;
	height: 100%;
	background: linear-gradient(to right, rgba(255, 255, 255, 0), #fff);
} */
.menu-header {
	display: flex;
	gap: .5rem;
	/*justify-content: center;
	overflow-x: auto;
    scroll-snap-type: x mandatory; */
	overflow-x: scroll;
    overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	padding: 0 0 .5rem;
}
.menu-header::-webkit-scrollbar {
	height: .75rem;
}
.menu-header::-webkit-scrollbar-thumb {
	background: var(--border);
	border-radius: 0rem;
}
.menu-header li {
	display: flex;
    align-items: center;
    flex-shrink: 0;	
}
.menu-header li a {
    display: flex;
    padding: .5rem .875rem;
    border: 1px solid var(--border);
    border-radius: 2rem;
    flex-wrap: nowrap;
    color: var(--text);
    line-height: 1;
    font-weight: 700;
    color: var(--text);
    align-items: center;
}
.menu-header li:first-child a {
	background: var(--text);
	border: none;
    color: #fff;
}
/************************************
** メイン
************************************/

/************************************
** メイン-記事リスト
************************************/
.list-title,.archive-title {
	font-size: 1.5rem;
	text-align: center;
	margin:4rem 0 1.5rem;
	
}
.list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2.5rem;
}
.list .entry-card.e-card {
	display: grid;
	align-items: center;
}
.list .entry-card-thumb {
	position: relative;
	overflow: hidden;
}

.list .entry-card-content {
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--border);
}
.list .entry-card-thumb-image {
	border-radius: 0rem;
	transition: transform .5s;
	position: relative;
}
.list .entry-card-wrap:hover .entry-card-thumb-image {
    transform: scale(1.1);
}
.list .entry-card-wrap:hover .entry-card-thumb-image:after {
    background-color: var(--text);
    border-radius: 10px;
    bottom: 0;
    content: '';
    left: 0;
    opacity: .2;
    position: absolute;
    right: 0;
    top: 0;
}
.list .cat-label {
	display: none;   
}

.entry-card-title {
	font-size: 1.125rem;
	margin: 1.5rem 0;
	color: var(--text);
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
	letter-spacing: .05em;
    font-feature-settings: "palt" 1;
}
.list  .entry-card-meta {
	display: flex;
	font-size: .75rem;
	flex-direction: row-reverse;
    justify-content: space-between;
	align-items: center;
}
.entry-card-categorys span {
    color: var(--text);
    font-weight: 400;
    border: 1px solid var(--border);
    padding: .25rem .75rem;
	border-radius: 1rem;
	display: inline-block;
}
.entry-card-info {
	color: var(--text-light);
	display: flex;
    align-items: center;
}
.entry-date {
	margin-right: .75rem;
	display: flex;
    align-items: center;
}

.post-comment-count {
	display: flex;
    align-items: center;
}
.post-comment-count:before {
    content: "";
    display: inline-block;
    width: .75rem;
    height: .75rem;
    background-color: var(--text-light);
    -webkit-mask-image: var(--comment);
    mask-image: var(--comment);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    mask-position: center center;
    -webkit-mask-size: .75rem;
    mask-size: .75rem;
	margin-right: .25rem;
}
/************************************
** ページ移管
************************************/

/************************************
** 記事ヘッダー
************************************/

/************************************
** 記事内RSS
************************************/

/************************************
** 記事本文
************************************/

/************************************
** 記事下カテゴリーとタグとSNS
************************************/

/************************************
** 関連記事
************************************/

/************************************
** コメント
************************************/

/************************************
** 前後の記事
************************************/

/************************************
** コメント下部RSSフィード
************************************/

/************************************
** パンくず
************************************/


/************************************
** サイドバー
************************************/

/************************************
** モバイルサイドバー
************************************/


/************************************
** RSSフィード（フッター上）
************************************/

/************************************
** 上に戻るボタン
************************************/

/************************************
** フッター
************************************/

/************************************
** モバイルメニュー
************************************/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/

/*1023px以下*/
@media screen and (max-width: 1023px){
	
}

/*834px以下*/
@media screen and (max-width: 834px){

}

/*480px以下*/
@media screen and (max-width: 480px){

}