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

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

.list-title {
  display: none; /* 文字を非表示 */
}
.list-new-entries::before {
  content: "";
  display: block;
  width: 100%;
  height: 100px; /* 画像の高さ */
  background-image: url('https://nozakichi.com/wp-content/uploads/2025/05/newpost.png');
  background-size: auto 80%;
  background-position: center;
  background-repeat: no-repeat;
  margin:2em 0;
}
.list-category-17::before {
  content: "";
  display: block;
  width: 100%;
  height: 100px; /* 画像の高さ */
  background-image: url('https://nozakichi.com/wp-content/uploads/2025/05/design.png');
  background-size: auto 100%;
  background-position: center;
	background-repeat: no-repeat;
	margin:6em 0 2em;
}
.list-category-18::before {
  content: "";
  display: block;
  width: 100%;
  height: 100px; /* 画像の高さ */
  background-image: url('https://nozakichi.com/wp-content/uploads/2025/05/work.png');
  background-size: auto 100%;
  background-position: center;
	background-repeat: no-repeat;
	margin:6em 0 2em;
}
.list-category-39::before {
  content: "";
  display: block;
  width: 100%;
  height: 100px; /* 画像の高さ */
  background-image: url('https://nozakichi.com/wp-content/uploads/2025/05/blog.png');
  background-size: auto 100%;
  background-position: center;
	background-repeat: no-repeat;
	margin:6em 0 2em;
}
.list-category-72::before {
  content: "";
  display: block;
  width: 100%;
  height: 100px; /* 画像の高さ */
  background-image: url('https://nozakichi.com/wp-content/uploads/2025/05/life.png');
  background-size: auto 100%;
  background-position: center;
	background-repeat: no-repeat;
	margin:6em 0 2em;
}

.ect-vertical-card .entry-card-wrap .entry-card-meta{
	margin-top:0;
}

/*トップのカード*/

.content-top {
  margin: 0;
  padding: 48px 0 16px;
}
.pickup-wrap {
  display: flex;
  justify-content: space-between;
  margin: 0;
  padding: 0;
}
.pickup-item {
  list-style: none;
  width: 24%;
  transition-duration: 0.4s;
}
.pickup-item img {
  width: 100%;
  vertical-align: bottom;
}
.pickup-item:hover {
  transform: translateY(-6px);
}
@media screen and (max-width: 768px){
.content-top {
  padding: 20px 16px 4px 16px;
}
.pickup-item {
  width: 48.5%;
  margin-bottom: 16px;
}
}

/*カテコリー別*/
.list-title{
	letter-spacing: 0.8em;
}

/*数字のリストの時*/

.my-list{
	counter-reset:number;
}
.my-list li { 
   border-bottom:2px dashed;
   border-color:#cdcdcd; /* 線の色 */
   position: relative;
   margin:0.5em 0 !important;
   max-width:500px; /* 横幅 */
   padding: 0 0 0.5em 1.8em;
}
.my-list li:last-child { 
   border:none;
}
.my-list li:before {
   counter-increment: number;
   content: counter(number);
   background-color: #986677; /* 文字背景色 */
   color: #fff !important;/* 文字色 */
   position: absolute;
   font-weight:bold;
   font-size: 14px;
   border-radius: 50%;
   left: 0;
   top:0;
   width: 22px;
   height: 22px;
   line-height: 22px;
   text-align: center;
}

/*ホバー*/
.a-wrap:hover {
	background-color:#f7f4f5;
	transform: scale(1.02);
}

.front-page-type-category .a-wrap:hover{
	background-color:#fff;
}

.ect-3-columns .a-wrap:hover{
	background-color:#fff;
}

/*もっと見るボタン*/
.list-more-button{
	border: solid 1px #986677;
}
.list-more-button-wrap{
	padding-bottom:2em;
	padding-top:1em;
}
.list-more-button-wrap a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  margin: 0 auto;
  padding: 1em 2em;
  width: 250px;
  transition: 0.3s;
	font-size:0.8em;
}

.list-more-button-wrap a::before {
  content: '';
  position: absolute;
  top: calc(50% - 2px);
  right: 1em;
  transform: translateY(calc(-50% - 2px)) rotate(30deg);
  width: 12px;
  height: 1px;
  background-color: #986677;
  transition: 0.3s;
}

.list-more-button-wrap a::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 1em;
  transform: translateY(-50%);
  width: 70px;
  height: 1px;
  background-color: #986677;
  transition: 0.3s;
}

.list-more-button-wrap a:hover {
  text-decoration: none;
  background-color: #F7F4F5;
}

.list-more-button-wrap a:hover::before,
.list-more-button-wrap a:hover::after {
  right: 0.5em;
}

.sidebar .widget_recent_entries ul li, .sidebar .widget_categories ul li a, .sidebar .widget_archive ul li, .sidebar .widget_pages ul li, .sidebar .widget_meta ul li, .sidebar .widget_rss ul li, .sidebar .widget_nav_menu ul li{
	border:none;
}

.widget_categories .children a:before{
	color:#98667799;
}

/*エントリーカード系*/
.entry-card-snippet, .related-entry-card-snippet{
	font-size:0.9em;
	margin-top:1em;
}

.front-page-type-category .entry-card-snippet{
	display:none;
}

.ect-tile-card-3 .entry-card-snippet{
	display:none;
}

.entry-card-wrap{
	/* margin:1em; */
}

.entry-card-title, .related-entry-card-title{
	margin-top:0.3em;
}

.card-thumb img {
	border-radius:8px;
}

.eye-catch img{
	border-radius:12px;
}

.blogcard-thumbnail img{
	border-radius:8px;
}

.rect-vertical-card .related-entry-card-title{
	font-size:0.8em;
}

/* ⑭次のページリンクを消す */
.pagination-next {
	display: none;
}

/*アピールエリア*/

.appeal{
	background-size: auto 100%;
}

/*ヘッダー*/

.navi-in > ul{
	letter-spacing: 0.18em;
}


/*プロフィール*/
.nwa .author-box .author-content{
	padding:0;
}

.index-tab-buttons .index-tab-button{
	border:none;
	background:#F4F4F4;
}

.index-tab-buttons{
	margin-top:0;
}

.blogcard-footer {
	display:none;
}

/*検索*/
.search-edit, input[type="text"]{
	font-size:0.9em;
}

.navi-in a{
	font-size:0.9em;
}

.navi-in > ul .sub-menu{
  background: none;
}


/*TOPカテゴリー別のタブ*/
#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:#b5a0a8;
	border:none;
}

.index-tab-buttons .index-tab-button{
	padding:8px 16px;
}

/*目次*/
.toc{
	border: 3px solid #d49b9f26;
	padding: 2em 3em;
	width: 100%;
}

.toc-list > li a {
	margin-top:10px;
	display:block;
	 margin-left: 10px;
} 

.toc-list > li li a {
  font-weight: normal;
  font-size: 95%;
	margin-top:0;
}
 
.toc-list > li li ::before {
  content: '';
  width: 5px;
  height: 5px;
  display: inline-block;
  left: -15px;
  border-radius: 100%;
  background: #cdcdcd;
  position: relative;
  margin-bottom: 2px;
}

.article .toc-list > li li {
  list-style: none;
}

/*見出し*/
.article h4{
	font-size:1em;
}

/*本の紹介リンク*/
.booklink-box, .kaerebalink-box, .tomarebalink-box, .product-item-box{
	box-shadow:0px 1px 3px rgb(0 0 0 / 10%);
	border:1px solid #F6F4F5;
}

.kaerebalink-link1 a, .booklink-link2 a, .tomarebalink-link1 a, .product-item-buttons a{
	padding:8px 32px;
}


/*タグ*/
.archive-title .fa-tags::before { 
  content: "#";
  margin-right: -6px;
}

.tag-caption .fa-tag {
    display: none;
}

#footer .tagcloud a, .tagcloud a {
    background: #F6F4F5;
    border: none;
    border-radius: 20px; /*角の丸み*/
    color: #555; /*文字色*/
    display: inline-block;
    padding: 3px 10px;
    text-decoration: none;
    margin: 2px;
    flex: 1 1 auto;
    display: flex;
    justify-content: space-between;
}

#footer .tagcloud a{
	background: #ede6e9;
}

.tagcloud a .tag-caption::before {
    content: "#"; /*アイコンの変更*/
    padding-right: 3px;
}
#footer .tagcloud a:hover,
.tagcloud a:hover { /*マウスホバー時*/
    background: #986677;
    border: none;
    color: #fff;
    transition: 0.5s; /*アニメーションの時間*/
}

/*カテゴリー・タグのアイキャッチ非表示*/

.tag-content .eye-catch img {
	display:none;
}
.category-content .eye-catch {
	display:none;
}

/*ブログカード*/
.blogcard-title{
	margin-top:0.4em;
}

.widget-entry-cards .widget-entry-card-content{
	font-size:13px;
	padding-top:0.3em;
}

/*カテゴリー*/
.widget_categories ul li ul li a { /*子カテゴリ用のコード*/
	font-size:0.95em;
	padding: 0 4px 4px 4px;
}

.sidebar .widget_categories ul li ul li  a:before{
    font-family: FontAwesome;
    content: "\f105";
	top:0;
}

/*見出しボックス*/
.label-box-label{
	font-size: 1.1em;
	color: #986677;
}

/*TOPへ戻る*/
.page-top{
display:none;
}

.widget-entry-cards.ranking-visible .card-thumb::before{
	border-radius:50%;
}

/*youtubeのサイズ変更*/
.video-container {
max-width: 100%;
margin: 0px auto;
}

/*フッター　ウィジェット*/

#footer h3 {
    margin-bottom: 1.3em;
}

.footer-widgets{
	border-bottom: 1px solid #986677
}

.footer-widgets .footer-title{
	border-bottom: 1px solid #986677;
    padding:5px;
	font-weight: normal;
    font-size: 1.1em;
	margin-bottom:20px;
}

.footer-widgets .custom-html-widget img{
	border-radius: 8px;
}

/*フッター　カテゴリー*/

.footer-widgets .widget-entry-cards .widget-entry-card-content{
	font-size:14px;
}

#footer .footer-widgets .widget_categories ul li ul li a { /*子カテゴリ用のコード*/
	font-size:0.9em;
	padding: 0 0 4px 16px;
}

#footer .footer-widgets .widget_categories ul li ul li  a:before{
    font-family: FontAwesome;
    content: "\f105";
	top:0;
}

#footer .widget_categories ul li {
	border:none;
}


#footer .cat-item a:before{
	color: #986677;
}

#footer a:hover{
	background:none;
	color:#986677;
}

/*アフィリエイトリンクボタン*/
.btn-wrap.has-ex-a-background-color>a{
	box-shadow: 0 2px 5px rgba(0, 0, 0, .2);
	border:none;
}

.btn-wrap.has-ex-a-background-color>a:hover{
	transform: translate(0, 3px);
	
}

/*テーブル*/

/*--- ヘッダーセル(th) ---*/
.entry-content th {
	padding: 0.8em .6em; /* 余白（上下　左右） */
	background-color: #f0ebed; /* 背景色 */
	letter-spacing: 0.1em; /* 文字の間隔 */
	font-size: 0.9em;
	border: 1px solid #ccc;
}

/*--- ヘッダーセル以外のセル(td) ---*/
.entry-content td {
    padding: 0.8em 0.8em; /* 余白（上下　左右） */
	font-size: 0.9em;
	border: 1px solid #ccc;
}

.entry-content tr td:nth-child(1){
	background-color: #f0ebed;
}

/*サイドバー PR*/
#custom_html-2 .textwidget{
	text-align:center;
}

/*アプリーチ*/
.appreach {
  text-align: left;
  padding: 10px;
  border: 1px solid #7C7C7C;
  overflow: hidden;
}
.appreach:after {
  content: "";
  display: block;
  clear: both;
}
.appreach p {
  margin: 0;
}
.appreach a:after {
  display: none;
}
.appreach__icon {
  float: left;
  border-radius: 10%;
  overflow: hidden;
  margin: 0 3% 0 0 !important;
  width: 25% !important;
  height: auto !important;
  max-width: 120px !important;
}
.appreach__detail {
  display: inline-block;
  font-size: 20px;
  line-height: 1.5;
  width: 72%;
  max-width: 72%;
}
.appreach__detail:after {
  content: "";
  display: block;
  clear: both;
}
.appreach__name {
  font-size: 16px;
  line-height: 1.5em !important;
  max-height: 3em;
  overflow: hidden;
}
.appreach__info {
  font-size: 12px !important;
}
.appreach__developper, .appreach__price {
  margin-right: 0.5em;
}
.appreach__posted a {
  margin-left: 0.5em;
}
.appreach__links {
  float: left;
  height: 40px;
  margin-top: 8px;
  white-space: nowrap;
}
.appreach__aslink img {
  margin-right: 10px;
  height: 40px;
  width: 135px;
}
.appreach__gplink img {
  height: 40px;
  width: 134.5px;
}
.appreach__star {
  position: relative;
  font-size: 14px !important;
  height: 1.5em;
  width: 5em;
}
.appreach__star__base {
  position: absolute;
  color: #737373;
}
.appreach__star__evaluate {
  position: absolute;
  color: #ffc107;
  overflow: hidden;
  white-space: nowrap;
}


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

@media screen and (min-width:700px) {
    /*　画面サイズが1024pxからはここを読み込む　*/
	.blogcard-thumbnail {
	width: 200px;
	}
}

/*1280px以下*/
@media screen and (max-width: 1280px){
  /*必要ならばここにコードを書く*/
	.entry-card-content{
		margin-left:0 ;
	}
}

/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
	.entry-card-content{
		margin-left:0;
	}
	.entry-card, .related-entry-card {
	margin:1em;
	}
/*見出しボックス*/
.label-box-label{
	font-size: 1em;
	}
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	.blogcard-title{
		font-size:1em;
		line-height:1.3em;
	}
	.blogcard-snippet {
		display:none;
	}
	.blogcard{
		padding-bottom:10px;
	}
	.blogcard-thumbnail{
		width:180px;
	}
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
	
	.logo-header img{
		width:310px;
	}
	.cat-label{
		display:none;
	}
	.entry-card-title, .related-entry-card-title{
		font-size:0.8em;
	}
	.entry-card, .related-entry-card {
	margin:0.2em;
	}
	.toc{
		padding:2em;
	}
	.appeal-content{
		padding:0 1em;
	}
	.index-tab-buttons .index-tab-button{
		padding:8px 16px
	}

	.entry-card, .related-entry-card{
		display:block;
	}
	.ect-entry-card .card-thumb, .rect-entry-card .card-thumb, .ect-big-card-first .card-thumb{
		width:100%;
	}

	.blogcard-thumbnail{
		width:120px;
	}
	
	
}