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

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




/*　特定の製品 解説　のタグをグレーに変更　20241005　*/
.tag-link-390{
	background:#bbbbbb;
}


/*　分野のタグをグレーに変更　20240114　*/

.tag-link-291,.tag-link-292,.tag-link-293,
.tag-link-290,.tag-link-294,.tag-link-295,.tag-link-296,.tag-link-297,.tag-link-298,
.tag-link-299,.tag-link-300,.tag-link-301,.tag-link-302,.tag-link-303,.tag-link-304{
	background:#dddddd;
}

/*　おすすめ度のタグをグレーに変更　20240114　*/

.tag-link-169,.tag-link-185,.tag-link-170,.tag-link-171,.tag-link-172,.tag-link-173,.tag-link-174,
.tag-link-175,.tag-link-176,.tag-link-177,.tag-link-178,.tag-link-179,
.tag-link-180,.tag-link-181,.tag-link-182,.tag-link-183,.tag-link-184{
	background:#dddddd;
}

/*　進捗度のタグをグレーに変更　20240114　*/

.tag-link-158,.tag-link-159,.tag-link-160,.tag-link-161,.tag-link-162,.tag-link-163,
.tag-link-164,.tag-link-165,.tag-link-166,.tag-link-167,.tag-link-168{
	background:#dddddd;
}

/*　shortのタグをダークグレーに変更　20250119　*/

.tag-link-411{
	background:#bbbbbb;
}








/* 印刷時に上と左に余白 20240623 */

@media print {
    @page {
        margin-top: 3cm; /* 上部に1cmの余白を指定 */
        margin-left: 2cm; /* 左側に1cmの余白を指定 */
    }
}



/* Wordpressで本文の左に隙間をあけたい 20240623 */

.entry-content p {
    margin-left: 24px; /* 左側の隙間のサイズを調整 */
}

/* 目次の左側に隙間を追加 */
.toc {
    margin-left: 40px;
}






/*　タグのマークを消す　20231008　*/

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






/*　カスタムタクソノミー実験　20231007　*/

/*.percent-tag{
/*	background:red;
/*}






/*  Cocoonの目次をカスタマイズ  unity-right  20240624  */

.toc {
  display: block;
  padding: 30px;
  max-width: 400px;
  border: 1.2px #999 solid !important;
 }


.toc-title {
  position: relative;
  padding: 10px 0;
  background: #ddd;
  color: #333;
  font-weight: bold;
 }


.toc .toc-content {
  padding: 15px 20px;
 }


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


.toc-list > li li ::before {
  content: '';
  width: 5px;
  height: 5px;
  display: inline-block;
  left: -22px;
  border-radius: 100%;
  background: #cdcdcd;
  position: relative;
  margin-bottom: 2px;
 }


.toc-list > li li a {
  font-weight: normal;
  font-size: 90%;
  color: #999;
  margin-left: -6px;
 }











/*　見出しのCSSを解除　20240618　*/


/* 「デザインリセット用のコード」 */
/*H2 */
.entry-content h2{
border:none;
background:none;
padding: 0;
}

/* H3 */
.entry-content h3{
border:none;
background:none;
padding: 0;
}

/* H4 */
.entry-content h4{
border:none;
background:none;
padding: 0;
}

/* H5 */
.entry-content h5{
border:none;
background:none;
padding: 0;
}

/* H6 */
.entry-content h6{
border:none;
background:none;
padding: 0;
}






/*　見出しのCSSを設定　20240618　*/



.article h2 {
	font-size: 24px;
	background: #777;
	color: #fff;
	border-bottom: 2px solid #222;
	padding: 1.4rem 1.5rem;
	border-left: solid 6px #333;
	}


.article h3 {
	font-size: 20px;
	background: #ddd;
	border-bottom: 1px solid #666;
	padding: 0.8rem 1.5rem;
	border-left: solid 6px #9499e0;
	margin-right: 8%;
	margin-left: 6px;
	}


.article h4 {
	font-size: 18px;
	background: #eee;
	border-bottom: 1px solid #999;
	padding: 0.5rem 1.5rem;
	border-left: solid 6px #b7e5c5;
	margin-right: 16%;
	margin-left: 12px;
	}


.article h5 {
	font-size: 17px;
	background: #f6f6f6;
	border-bottom: 1px solid #bbb;
	padding: 0.4rem 1.5rem;
	border-left: solid 6px #dee2a3;
	margin-right: 24%;
	margin-left: 16px;
	}


.article h6 {
	font-size: 16px;
	background: #fafafa;
	border-bottom: 1px solid #ccc;
	padding: 0.3rem 1.5rem;
	border-left: solid 6px #d8bc79;
	margin-right: 30%;
	margin-left: 20px;
	}




/*　印刷の設定 （親テーマからまるごとコピー）　20240618　*/


@media print {
  /************************************
  ** 印刷用スタイル
  ************************************/
  #container {
    font-size: 11pt;
  }
  #container .header-container,
  #container .ad-area,
  #container .pager-links,
  #container .under-entry-content,
  #container .breadcrumb-category,
  #container .entry-footer,
  #container .sidebar,
  #container .footer,
  #container #admin-panel,
  #container #go-to-top,
  #container .go-to-top-button,
  #container #fb-root,
  #container .mobile-menu-buttons,
  #container .toc,
  #container .sns-share,
  #container .widget,
  #container #notice-area-wrap,
  #container #notice-area,
  #container #appeal,
  #container .recommended,
  #container #carousel,
  #container #go-to-top {
    display: none !important;
  }
  #container .content-in {
    display: block;
  }
  #container .main,
  #container .content,
  #container .wrap {
    width: auto;
    margin: 0;
    float: none;
    padding: 0;
    border: none;
    overflow-wrap: normal;
  }
  #container .main {
    width: 100% !important;
  }
	#container h1 {
    background-color: transparent;
    border-width: 0;
    padding: 0;
    margin: 10px 0;
    color: #333;


}
  #container h2,
  #container h3,
  #container h4,
  #container h5,
  #container h6 {


	  
  }
  #container h1 {
    font-size: 21.5pt;
  }


  #container h2 {
    background: #ddd;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #666;
	border-right: 1px solid #aaa;
	  
    font-size: 17pt;
	padding: 1.4rem 1.5rem;
	border-left: solid 6px #555;
  }


  #container h3 {
    background: #ddd;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #666;
	border-right: 1px solid #aaa;
	  
    font-size: 15pt;
	padding: 0.8rem 1.5rem;
	border-left: solid 6px #9499e0;
	margin-right: 8%;
	margin-left: 6px;
  }


  #container h4 {
    background: #ddd;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #666;
	border-right: 1px solid #aaa;
	  
    font-size: 13pt;
	padding: 0.5rem 1.5rem;
	border-left: solid 6px #b7e5c5;
	margin-right: 16%;
	margin-left: 12px;
}


	#container h5 {
    background: #ddd;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #666;
	border-right: 1px solid #aaa;
	  
    font-size: 12pt;
	padding: 0.4rem 1.5rem;
	border-left: solid 6px #dee2a3;
	margin-right: 24%;
	margin-left: 16px;
}


  #container .article h6 {
    background: #ddd;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #666;
	border-right: 1px solid #aaa;
	  
    font-size: 11pt;
	padding: 0.3rem 1.5rem;
	border-left: solid 6px #d8bc79;
	margin-right: 30%;
	margin-left: 20px;
}


  #wpadminbar,
  #go-to-top,
  #admin-panel {
    display: none !important;
  }
  body {
    background-image: none !important;
  }
}
/************************************
** ソースコード
************************************/
pre {
  background-color: var(--cocoon-xx-thin-color);
  border: 1px solid var(--cocoon-thin-color);
  overflow: auto;
  padding: 10px;
}

.is-code-row-number-enable pre.hljs,
.is-code-row-number-enable pre.hljs * {
  line-height: 1.6 !important;
}

.is-code-row-number-enable pre.hljs,
.is-code-row-number-enable pre.hljs#highlight-demo {
  border: none;
  position: relative;
  padding: 0.4em 1em 0.4em 3em;
}

.is-code-row-number-enable pre.hljs::before {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  display: block;
  width: 3em;
  box-sizing: border-box;
  color: #777;
  text-align: center;
  padding: 0.4em 0;
}










/* Cravel:内部ブログカードデザイン調整 */
.internal-blogcard-wrap {
	width: unset!important;
}
.internal-blogcard-wrap .blogcard-tax {
  padding-bottom: 0.5rem;
}
.internal-blogcard-wrap .blogcard-tax .cat-link {
	margin-bottom: 0.2rem;
}
.internal-blogcard-wrap .blogcard-content {
  max-height: 200px;
}
.internal-blogcard-wrap .blogcard-thumbnail {
    width: 200px;
}
@media screen and (max-width: 1023px){
  .internal-blogcard-wrap .blogcard-thumbnail {
    width: 200px;
  }
}
@media screen and (max-width: 834px){
  .internal-blogcard-wrap .blogcard-thumbnail {
    width: 160px;
  }
  .internal-blogcard-wrap .internal-blogcard-title {
	margin-bottom: 0.5rem;
  }
}
@media screen and (max-width: 480px){
  .internal-blogcard-wrap .blogcard-thumbnail {
    width: 120px;
  }
}






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

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

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