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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.article h2 {
  font-size: 20px !important;/*文字のサイズ*/
  border-bottom: 2px solid #E07487;/*下線*/
  color: #323232;
  padding-bottom: .5em;
  padding-left: .5em;
  border-top: none;
  background: #ffffff;
}

.article h3 {
  padding: 0.4em;
  color: #000;
  font-size: 12.5pt;
  background: #ffffff;
  border-left: solid 4px #E07487;
  border-top: none;
  border-right: none;
  border-bottom: none;
}

.article h4 {
	border-color:#f27398;
}

.box2-pink{
	margin: 2em auto; /* ボックスの余白 */
	border-radius:4px; /* ボックス角丸 */
	max-width:800px; /* ボックス横幅 */
	border:1px solid #f27398; /* ボックス線 */
	padding: 5.5em 1em 0em; /* ボックス内側余白 */
	position:relative; /* 配置に関するもの(ここを基準に) */
}
.box2-pink .box-title {
	background: #f27398; /* タイトル背景色 */
	color: #fff; /* タイトル文字色 */
	font-weight: bold; /* タイトル文字の太さ */
	font-size: 20px;/* タイトル文字の大きさ */
	padding: 0 5px;/* タイトル周りの余白 */
	text-align: center;	/* タイトル中央寄せ */
	border-radius: 4px 4px 0px 0px;	/* タイトル角丸 */
	position:absolute;	/* 配置に関するもの(ここを動かす) */
	top:0;	/*上から(0px)に配置 */
	left:0; /*左から(0px)に配置 */
	width:100%;/*横幅最大幅 */
}
.box2-pink p {
	margin: 0;/* 文字の余白リセット */
	padding: 0; /* 文字の内側余白リセット*/
}

.is-style-blank-box-pink {
	border:2px solid #f27398; /* ボックス線 */
}

/*目次のカスタマイズ*/
.toc {
	width:100%;
}

/************************************
**　　サイドバー
************************************/
#sidebar>.widget{
	border-radius:10px;
}

.widget_search{
	padding:0;
}
span.fas.fa-search::before{
	color:#F7947F;/*検索マーク色変更はこちら*/
}

.sidebar h3{
	color:#333333;
	border-radius: 0%;
	border-bottom:3px dotted;
	border-color:#f27398;
	padding-bottom:0.3em;
	margin-top:-0.5em;
	margin-bottom:1em;
	background-color:#fff;
}

.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:#FFFFFF;
	color:#F7947F!important;
}

.tagcloud a{
	background-color:#FFFFFF;
}

.tagcloud a:hover{
	background-color:#FFFFFF;
	color:#F7947F!important;
	transition: 0.4s ;
}

.nwa .recommended.rcs-card-margin a {
	margin: 0 0 2em;
	width: 90%;
}

/*人気記事を浮き上がらせる*/
.sidebar a.popular-entry-card-link.a-wrap:hover { /*マウスオン時*/
	background-color: #f2f2f2; /*背景色*/
	-webkit-transform: translateY(-2px);
	-ms-transform: translateY(-2px);
	transform: translateY(-2px);
	box-shadow: 0 10px 20px -5px #f2f2f2; /*影の色*/
}

/*人気記事の余白*/
.sidebar a.popular-entry-card-link.a-wrap{
	margin-bottom: 16px;
}

/*media Queries 1030px以下
-----------------------------------------------------------------------------*/
@media screen and (max-width: 1030px){
.article h2 {
	padding: 10px 0.8em;
}
}

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

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

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