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

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

.video-container {
max-width: 98%;
}
.review-rating .rating-number {
  display: none;
}
/* 見出し */
h1.entry-title {
  font-size: 1.8rem;
  padding: 0.5em 0;/*上下の余白*/

}

.listexpand li {
margin-bottom:10px !important;
}

.entry-content h3 {background-color: #f9fcfc;}


.post-comment-count {color:#20a39e; font-size:0.8em;}

.pagination {display:none;}

.navi-in .menu-header .item-label{
font-size: 14px;
	font-weight: bold;
}

.article h2{
color: #000;
	font-size:1.5rem;
  padding: 1rem 2rem;
  border-top: 3px solid #20a39e;
  border-bottom: 3px solid #20a39e;
background-color: transparent !important;
border-radius: 0 !important;
}


/*グローバルナビメニュー マウスオーバーでアンダーライン*/
#navi .navi-in a:after{
position: absolute;/*線の位置を絶対配置に*/
content: "";/*文字はなし*/
left: 0px;/*線の位置*/
bottom: 1px;/*線の位置*/
height: 1px;/*線の高さ*/
width: 100%;/*幅いっぱいに線を引く*/
background: #20a39e;/*線の色*/
transform: scale(0,1);/*マウスオーバーの前は線を消す*/
transition: 0.3s;/*線が0→100%になるまでの秒数*/
}

#navi .navi-in a:hover:after{
transform: scale(1);/*マウスオーバー後、線を100%出す*/
}

.carousel-entry-card-title{
font-size:0.8em; /*文字サイズ*/
color:#444444; /*文字色*/
}
.slick-dots li button:before{
display:none;
}

/*通知*/
.notice-area {
text-align: center;
padding: 0.2em;
font-size: 0.8em;
font-weight: bold;
}

.comment-btn {border-color:#20a39e;color:#fff;background-color:#20a39e;}

.comment-form .submit {background:#20a39e;}

.widget-entry-cards.large-thumb-on .card-content {background:linear-gradient(180deg, transparent, #000);max-height:50%;}
.widget-entry-card-title {font-size:0.9em;}


/* Cocoon Ad Label */
.ad-area .ad-label {
  font-size: 80% !important;
color:#4d4d4d;
}


/*目次 */
.toc {
	  margin-bottom: 30px;
    border-radius: 3px;
    background-color: #fafafa;
	font-weight:bolder;
	 border-top:solid 10px #20a39e;
	color:#333;
}

.toc-title {
    font-size: 1.2em;
    color: #62665b;
}


.toc-title:before {
    font-family: 'Font Awesome 5 Free';
    content : "\f03a";
    font-size: 1em;
    color: #a3a3a3;
    border-radius: 50%;
    padding: 0.5em;
    margin-right: 0.2em;
}
.toc-content ol li{
    color: #e4af9b;
    margin:0.5em;
}

.toc a{
   color:#62665b;
}

.left100 td:first-child,
.left100 th:first-child {
      width: 100px !important;
    }


/************************************
** ブログカード
************************************/
.blogcard-snippet,
.blogcard-footer {
  display: none;
}
.blogcard-wrap {
  transition: all .3s;
  max-width: 650px;
  margin: 2em auto;
}
.blogcard {
  border:1px solid #eaeaea !important;
  box-shadow: 0 2px 5px rgba(0, 0, 0, .15);
  padding: 10px;
}
.blogcard-wrap:hover {
  background: none;
  transform: translateY(-3px);
  box-shadow: 0px 10px 20px rgba(0, 0, 0, .1);
}
.blogcard-thumbnail {
  margin: 0;
}
.blogcard-thumbnail img {
  display: block;
}
.blogcard-title {
  color: #555;
  letter-spacing: 0.5px;
  font-size: 16px;
  line-height: 1.5;
  margin: 5px 0 0 0;
  height: auto;
  overflow: hidden;
}
.blogcard-content {
  min-height: auto;
  margin-left: 185px;
  padding-right: 6px;
}
.blogcard-label {
  top: -11px;
  left: 9px;
  padding: 3px 0.6em;
  background:#aaa;
  padding: 1px 10px;
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 1px;
}
.blogcard-content:after {
  content: "クリックして読む";
  background: #66c2c3; /* 背景色 */
  display: block;
  text-align: center;
  color: #fff;
  font-weight: 600;
  letter-spacing: 1px;
  width: 180px;
  border-radius: 20px;
  font-size: 13px;
  padding: 1px 0;
  margin-top: 6px;
}
@media screen and (max-width: 834px) {
  .blogcard-content {
    margin-left: 130px;
  }
  .blogcard-title {
    font-size:12px;
    line-height: 1.5;
    height: auto;
    margin:0;
  }
  .blogcard-content:after {
    content: "タップして読む";
  }
  .blogcard-thumbnail{
    width:120px;
  }
}
@media screen and (max-width: 560px) {
  .blogcard-content:after {
    width: 120px;
    font-size: 12px;
  }
  .blogcard-title {
    margin:0;
  }
}
@media screen and (max-width: 320px) {
  .blogcard-thumbnail {
    width: 100px;
  }
  .blogcard-content {
    margin-left: 110px;
  }
  .blogcard-title {
    height: 35px;
  }
}

.main {padding-top: 10px !important;}


.entry-card-title {
	font-size: 20px;
}


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

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

	
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
		h1.entry-title {
font-size:1.4rem;
}
	.article h2{
	font-size:1.5rem;
  padding: 0.7rem 1rem;
  border-top: 3px solid #20a39e;
  border-bottom: 3px solid #20a39e;

}
}
@media screen and (min-width:1023px){
		/**********************************************
** 固定ページの新着記事一覧(new_list)を
** 2カラム表示にする
**********************************************/
.new-entry-cards.fp-new-entry-cards {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
}

.fp-new-entry-cards .new-entry-card-link.a-wrap {
    display: inline-block;
    width: 49.5%;
}
}
