@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-family: 'Kosugi Maru', sans-serif;

/*トップページカスマイズ***************************************/
.toppage{
padding:3em 1em;/*内側余白調整*/
}
.new-entry-cards-date {
  display: block;
}
/*見出し*/
div.title{
       margin:2rem 0;/*外側余白*/
	padding:0;/*内側余白*/
	text-align:center;/*中央寄せ*/
	font-size:2.5rem;/*文字の大きさ*/
	letter-spacing:1px;/*文字間の余白*/
	line-height:1.8;/*行の高さ*/
}

div.title:after{
	display:block;
	font-size:.8rem;
}

div.newpost:after{
	content:'新着記事';
}
div.category:after{
	content:'カテゴリー別の記事';
}
div.popular:after{
	content:'今日、読まれている記事';
}


/***リンクボタン***/
.link-btn{
  display:block;/*ブロック要素にする*/
  margin:1em auto;/*外側余白*/
  padding: 0.7em 2.5em;/*内側余白*/
  text-align: center;/*中央寄せ*/
  text-decoration: none;/*文字装飾なし*/
  border:1px solid #ccc; /*枠線（太さ、種類、色）*/
  font-size:.9em;/*文字の大きさ*/
  color:#666;/*文字色*/
  width:250px;/*ボタンの幅*/
}

/* ウィジェット記事全体*/
.widget-entry-cards.card-large-image .a-wrap {
  max-width: 150%;/*カード幅調整*/
}

/***記事横並べ(flex)***/
.widget-entry-cards.large-thumb{
   display: flex; /* フレックスにする */
   flex-wrap: wrap;
}

/*新着、人気記事サムネイル（大）*/
.new-entry-cards.large-thumb a{
  width:calc(100% / 2);/*pcで横2列に並べる*/
}

.cate .new-entry-cards.large-thumb a,
.popular-entry-cards.large-thumb a{
  width:calc(100% / 3);/*pcで横3列に並べる*/
}

/*834px以下*/
@media screen and (max-width: 834px){
       .new-entry-cards.large-thumb a{
		width:100%;/*スマホで横１列に*/
	}
       .cate .new-entry-cards.large-thumb a,
       .popular-entry-cards.large-thumb a{
	       width:calc(100% / 2);/*スマホで横２列*/	
	}	
}




/**************************
 タブ切り替え
***************************/

/* 親要素で囲みタブの横並びのためflexを指定*/
.tab-wrap {
  display: flex;
  flex-wrap: wrap;
  margin:5px 0;
}


/*タブ(label)のスタイル*/
.tab-label {
  border:1px solid #ccc;
  text-align: center;
  padding: .5em 1em;
  order: -1;
  position: relative;
  z-index: 1;
  cursor: pointer;
  flex: 1;
}

/*タブの間に余白をあける*/
.tab-label:not(:last-of-type) {
  margin-right: 5px;
}

/* タブのコンテンツ部分*/
.tab-content {
  width: 100%;
  height: 0;
  overflow: hidden;
  opacity: 0;
}

/* アクティブなタブ、選択されていることが分かるようにチェックされているradioボタンの隣にあるlabelの背景色を変える*/
.tab-switch:checked+.tab-label {
  color:#347571;/*文字色*/
  background-color:#e6fee2;/*タブの背景色*/
  border:1px solid #e6fee2;/*タブの枠線　太さ　種類　色*/
}

/*吹き出し部分のスタイル*/
.tab-switch:checked+.tab-label:after{
	content: "";
	position: absolute;
	top: 100%;
	left: calc(50% + 5px);
	margin-left: -15px;
	border: 10px solid transparent;
       border-top:10px solid #b5b5ae;/*タブの吹き出し部分*/
	width: 0;
	height: 0;
}

.tab-switch:checked+.tab-label+.tab-content {
  height: auto;
  overflow: auto;
  padding: 20px 0 0 0;
  opacity: 1;
  transition: .5s opacity;
}

/* radioボタンは仕組みだけ利用するため非表示に、トップページヘッダーまわり非表示*/
.tab-switch,
.home .article-header,
.home .article-footer{
  display: none;
}
/* 新着記事投稿日を表示させる */ 
.new-entry-card-date{
  display: block;
}}
/*人気記事投稿日を表示させる*/ 
.popular-entry-card-date{
  display: block;
}
/*関連記事投稿日を表示させる*/ 
.widget-related-entry-card-date{
  display: block;
}
/*aside人気記事投稿日を表示させる*/ 
.popular_entries-2-date{
  display: block;
}
/*固定ページ右上投稿日を非表示*/ 
.page .date-tags{
  display: none;
}
/* 見出しのデザインリセット */ 
/*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;
}

/* 見出しのデザイン設定 */
/* H2 */
.entry-content h2{
color: #ffffff;/* 文字色 */
font-size: 2.0em;/* 文字サイズ */
background-color: #E6fee2;/* 背景色 */
padding-top:20px;/* 文字と上部の間隔 */
padding-left:10px;/* 文字と左線の間隔 */
padding-bottom:20px;/* 文字と下部の間隔 */
border-left: solid 10px #347571;/* 左側に実線・色*/
}
h3 {
  position: relative;
  padding: 1rem .5rem;
}

h3:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 6px;
  content: '';
  border-radius: 2px;
  background-image: -webkit-gradient(linear, right top, left top, from(#2af598), to(#009efd));
  background-image: -webkit-linear-gradient(right, #2af598 0%, #009efd 100%);
  background-image: linear-gradient(to left, #2af598 0%, #009efd 100%);
}
/* H3 */
/*.entry-content h3{
color: #000; /* 文字色 */
/*font-size: 1.5em; /* 文字サイズ */
/*background-color: #1bc5b4;/* 背景色 */
/*padding: 10px;
/*border-left: solid 10px #347571; /* 左側に実線・色*/
}*/

/* H4 */
.entry-content h4{
color: #000; /* 文字色 */
font-size: 1.2em; /* 文字サイズ */
padding: 10px;
border-top: solid 3px #347571;/* 上側に実線・色 */
border-bottom: solid 3px #347571;/* 下側に実線・色*/
/*border-bottom: dotted 3px #347571;/* 下側に点線・色*/
}

/* H5 */
.entry-content h5{
color: #000; /* 文字色 */
font-size: 1.0em; /* 文字サイズ */
padding: 10px;
border-bottom: dotted 3px #347571;/* 下側に点線・色*/
}

/* H6 */
.entry-content h6{
color: #000; /* 文字色 */
font-size: 1.0em; /* 文字サイズ */
padding: 5px;
border-left: solid 7px #347571; /* 左側に実線・色*/
}
/************************************
****　サイドバー
************************************/
#sidebar>.widget{
border-radius:10px;
}
.widget_search{
padding:0;
}
span.fas.fa-search::before{
color:#1bc5b4;/*検索マーク色変更はこちら*/
}
.sidebar h3{
color:#7b7b7b;
border-radius: 0%;
border-bottom:3px dotted;
border-color:#347571;/*タイトル下のライン色変更はこちら*/
padding-bottom:0.3em;
margin-top:-0.5em;
margin-bottom:1em;
}
.widget_recent_entries ul li a, .widget_categories ul li a, .widget_archive ul li a, .widget_pages ul li a, .widget_meta ul li a, .widget_rss ul li a, .widget_nav_menu ul li a {
background-color:#ffffff;
margin: 6px 0;
padding: 4px 10px;
border-radius:20px;
transition: 0.4s
}
.widget_recent_entries ul li a:hover, .widget_categories ul li a:hover, .widget_archive ul li a:hover, .widget_pages ul li a:hover, .widget_meta ul li a:hover, .widget_rss ul li a:hover, .widget_nav_menu ul li a:hover{
background-color:#1bc5b4;/*マウスオーバー時の背景色変更はこちら*/
color:#fff!important;
}
.tagcloud a{
background-color:#ffffff;
}
.tagcloud a:hover{
background-color:#1bc5b4;/*マウスオーバー時の背景色変更はこちら*/
color:#fff!important;
transition: 0.4s ;
}
.nwa .recommended.rcs-card-margin a {
margin: 0 0 1em;
width: 90%;
}
/*新着記事抜粋文字色ー黒*/
.widget-entry-cards .widget-entry-card-content{
color: #000;/*黒*/
	
}
.popular-entry-cards .widget-entry-cards-content{
color: #000;/*黒*/
}
/* プロフィール全体 */
.nwa .author-box {
	border: none;
	padding:0 20px;
}
	

/* アイコン */
.nwa .author-box .author-thumb{
	width: 110px;
}
.nwa .author-box .author-thumb img{
	box-shadow: 0 1px 3px rgba(0,0,0,.18)
}

/* 下側 */
.nwa .author-box .author-content {
	padding: 1em 0;
}


/* 名前 */
.author-box .author-name {
	margin-bottom: 1em;
}
.author-box .author-content .author-name a{
	color: #347571 ; /* 文と同じ色リンク色にしない */
	font-size: 1.2em;
	font-weight: normal; /* 太字にしない */
	text-decoration: none; /* 下線をなくす */
	letter-spacing: 0.2em; /* 字間を広く */
}

/* プロフィール文 */
.author-description{
	margin-bottom: 16px;
}
.author-description p{
	margin: 0 0 0.5em 0;
	text-align: left;
	line-height: 1.5;
}

/* SNSボタン */
.author-follows{
	padding: 12px 0;
	background-color: #bdede8 /* お好きな色*/ ;
}
.author-follows::before{
	content: 'Follow Me';
	color: #fff;
	font-family: お好きなフォント(設定する場合);
	letter-spacing: 0.2em; /* 字間を広く */
}
.author-box .sns-follow-buttons a.follow-button{
	width: 40px;
	height: 40px;
	margin: 6px 10px 2px 2px;
	border-radius: 20px;
	color: #fff;
	border-color: #fff;
	font-size: 24px;
	line-height: 1.6;
}
.author-box a.follow-button span::before {
	font-size: 22px;
}

/* SNSボタン マウスオーバーしたとき */
.author-box .sns-follow-buttons a.follow-button:hover{
	background-color: transparent;
	opacity: 0.6; /* 薄く */
	transform: scale(1.1); /* 1.1倍の大きさに */
}
/*記事一覧アイキャッチ画像の角丸め*/
.ect-entry-card img{border-radius: 10px;}

/* アイキャッチ画像内のカテゴリラベルをつける*/
/* カテゴリ開始 */
.cat-label {
    background-color: #1bc5b4;
    border: 0px!important;
    top: 0em;
    left: 0em;
}
.eye-catch .cat-label {
    padding: 0px 10px;
    padding-left: 20px;
    padding-right: 20px;
    text-align: center;
    opacity: 0.9;
    top: 0em;
    left: 0em;
    font-size: 13px;
    min-width: 120px;
}
.eye-catch .cat-label:before {
    font-family: "fontawesome";
    content: "\f08d";
    color: #fff;
    display: inline-block;
    margin-right: .5em;
    transform: rotate(-20deg);
    -moz-transform: rotate(-20deg);
    -webkit-transform: rotate(-20deg);
}
/* カテゴリ終了*/

/**サイドバーのカテゴリにアイコンをつける**/
/*親カテゴリのカスタマイズ*/
.widget_categories ul li a{
border-bottom: 1px dashed #CCCCCC; /* 下線の種類 */
}
.widget_categories ul li a::before{
font-family: "Font Awesome 5 Free";
content: "\f138"; /* FontAwesomeのユニコード */ 
color: #00BCD4; / *アイコンの色 */
padding-right: 6px; 
font-weight: 900; /*アイコンの太さ*/
}
.widget_categories > ul > li > a:first-child{
border-top: none;
}
/*子カテゴリのカスタマイズ*/
.widget_categories ul li ul li a::before{
font-family: "Font Awesome 5 Free";
content: "\f0da"; /* FontAwesomeのユニコード */ 
color: #00BCD4; / *アイコンの色 */ 
padding-right: 6px; 
font-weight: 900; /*アイコンの太さ*/
}

/**********************************************
** 固定ページの新着記事一覧(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%;
}
.page .new-entry-cards {
	display: flex;
	flex-wrap: wrap;
}

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

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
/* 追記CSS */
}
/* フッター背景*/
#footer {
	background-image: url( http://52.199.23.116/wp-content/uploads/2023/04/footer_bg02.png );
	background-size: cover;
}
@media screen and (min-width: 1024px) {
	#footer {
		background-position: 0 15%;/* 位置調整：左上から0　上から15% */
		height: 200px;
	}
}
/* トップページのみヘッダー・フッターを非表示 */
.home #header,
.home #footer,
.home .header-container,
.home .footer-container {
  display: none !important;
}