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

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




/* エントリーカードラベル非表示 */
.entry-card .cat-label{
  display: none;}
/* エントリーカードラベル非表示 */

/*SNSシェアボタン丸く*/
.sns-share-message{
	font-weight: bold; /*太字*/
	color: #875d5b; /*文字色*/}
.sns-share-buttons {
	flex-wrap: nowrap; /*折り返さない*/
	justify-content: center; /*中央寄せ*/}
.sns-share-buttons a {
	border-radius: 50%; /*丸くする*/
	font-size: 20px; /*アイコンのサイズ*/
	margin: 0 10px; /*ボタン同士の間隔*/}
#main .sns-share a {
	width: 40px; /*ボタンの横幅*/
	height: 40px; /*ボタンの高さ*/}
#main .button-caption {
	display: none; /*キャプション非表示*/}
/*SNSシェアボタン丸く*/

/** サイドカテゴリ開始 **/
.widget_categories ul li a{ 
  border-bottom: 1px dashed #CCCCCC; /* 下線の種類 */}
.widget_categories ul li a::before{
  font-family: FontAwesome;
  content: "\f07b"; /* FontAwesomeのユニコード */
  color: #5FB3F5; /* アイコンの色 */
  padding-right: 6px;}
.widget_categories > ul > li > a:first-child{ 
  border-top: none;}
/** サイドカテゴリ終了 **/




/* メインページ見出し */
.article h1 {
	position: relative;
	padding: .5em .85em;
	background-color: #F2F2F2;

	border-radius: 25px;
	border-left:none;
margin:5px 0px 10px 0px;}

.article h2 {
	position: relative;
	padding: .5em .85em;
	background-color: #F2F2F2;

	border-radius: 25px;
	border-left:none;
margin:5px 0px 10px 0px;}

.article h3 {
	position: relative;
	padding: .5em .85em;
	background-color: #F2F2F2;

	border-radius: 25px;
	border-left:none;
margin:5px 0px 10px 0px;}

.article h4 {
	position: relative;
	padding: .5em .85em;
	background-color: #F2F2F2;

	border-radius: 25px;
	border-left:none;
margin:5px 0px 10px 0px;}
/* メインページ見出し */


/* サイドバー見出し */
#sidebar h3  {
	position: relative;
	padding: .5em .85em;
	background-color: #F2F2F2;

	border-radius: 25px;
	border-left:none;
margin:5px 0px 10px 0px;
}
/* サイドバー見出し */




/*カテゴリーページの説明 角丸 */
.category-description {
  background-color: #f7f7f7;
  border-radius: 20px;
  border: 1px solid #ddd;
}
/*カテゴリーページの説明 角丸 */


/* カテゴリー背景 角丸 */
.post-meta{
  margin-bottom: 0.5em;
  text-align:right;
  background-color:#F7F7F7;
  color:#555;
  font-size:16px;
  border-radius: 15px;
}
/* カテゴリー背景 角丸 */


/*メイン部分の枠を 角丸*/
#main {
  border: none;
  border-radius: 20px;
 margin:0px 0px 20px 0px;
}
#sidebar{
  border: none;
  border-radius: 20px;
 margin:0px 0px 20px 0px;}
/*メイン部分の枠を 角丸*/

/* タグを丸枠で囲む */
.tagcloud a {font-size: 16px !important;display: inline-block;margin-bottom: 5px;padding: 1px 10px;text-decoration: none;color: #339999;border-radius: 15px;border: 1px solid #339999;background-color: #fff;}
.tagcloud a:hover {transition: 0.3s;color: #000000;background: #99cccc;}
/* タグを丸枠で囲む */


/* 検索ボックス丸く */
.search-box{margin: 1em;}
.search-edit, input[type="text"] {height: 40px; border-radius: 40px;}
.search-submit{line-height: 0; /* top: 0; */ bottom: 0;}
.search-edit:focus{outline: none; border-color: pink; /* フォーカス時の枠色 */}
/* 検索ボックス丸く */


/* コンテンツ一覧・まとめ角丸 */
a.maru{
  border: 1px solid #339999;
  border-radius: 16px;
  color: #339999;
  padding: 5px 15px;
  text-decoration: none;
  font-size: 14px;
  margin: 5px;
  flex: 1 1 auto;
  display: flex;
  justify-content: space-between;
  transition: all 0.3s ease-in-out;
}
a.maru:hover{transition: 0.3s;color: #000000;background: #99cccc;}
/* コンテンツ一覧・まとめ角丸 */

/* 次のページ丸 */
.pagination-next-link {
  background-color: #49add1;
  color: #fff;
  border: none;
  border-radius: 30px;
  box-shadow: 0 2px 6px 0 rgba(0,0,0,0.2); /*「次のページ」部分の影*/
}
.pagination-next-link:hover {
  background-color: #68caee;
  transition: all 0.5s ease;
  color: #fff;
}
.page-numbers {
  color: #49add1;
  border: 1px solid #49add1;
  border-radius: 50%;
  box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); /*数字部分の影*/
}
.pagination .current {
  background-color: #49add1;
  color: #fff;
}
.page-numbers.dots {
  opacity: 1;
  background: none;
}
.pagination a:hover {
  background-color: #49add1;
  color: #fff;
}
a.prev, a.next {
  display: none;
}
@media screen and (max-width: 480px) {
.page-numbers {
  width: 48px;
  height: 48px;
  line-height: 48px;
}
}
/* 次のページ丸 */















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

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

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