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

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

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

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

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

/************************************
****　ここからカスタマイズー全体のバランス
************************************/
.entry-content {/*本文下の空白を削除*/
padding-bottom: 0;
margin-bottom: 0;
}
@media (max-width: 1023px){
article > .entry-content, aritcle > footer.article-footer {/*本文左右の空白*/
padding: 0 20px;
}
}
@media screen and (max-width: 880px){
.page-body {
font-size: 16px;
}
}
@media screen and (max-width: 480px){
.page-body {
font-size: 15px;
}
}
img{
box-shadow: 0px 2px 5px 0 rgba(0,0,0,.2);
}
a {
 -webkit-tap-highlight-color:rgba(0,0,0,0);
}
.body .article {/*本文SNSフォロー下の空白*/
margin-bottom: 0;
}

/*なこラボ
-----------------------------------------------------------------------------*/

.article h1, .article h2, .article h3, .article h4, .article h5, .article h6 {
	line-height: 1.5;
}

.article h1 {
	padding: 0;
	font-size: 32px;
	font-weight: 400;
}

/*media Queries 1030px以下
-----------------------------------------------------------------------------*/
@media screen and (max-width: 1030px){
.article h1 {
	padding: 0 2%;
	font-size: 28px;
}
}

.article h2 {
	position: relative;
	padding: 16px 25px 16px 25px;
	border-radius: 3em .5em 2em .5em/.4em 2em .5em 3em;
	border-bottom: 4px solid #下に重なる背景色;
	border-right: 4px solid #右に重なる背景色;
	background: #背景色;
	color: #文字色;
}

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

.article h3 {
	border: none; /* Cocoon親テーマCSSリセットのため */
	width: 100%;
	position: relative;
	margin: 1.8em 0 1.2em;
	padding: 12px 10px 10px 10px;
}
.article h3:after {
	content: "";
	position: absolute;
	width: 100%;
	height: 5px;
	left: 0;
	background: -webkit-repeating-linear-gradient(135deg, #fff, #fff 3px, #好きな色A 3px, #好きな色A 6px, white 6px, white 9px, #好きな色B 9px, #好きな色B 12px);
	background: repeating-linear-gradient(135deg, #fff, #fff 3px, #好きな色A 3px, #好きな色A 6px, white 6px, white 9px, #好きな色B 9px, #好きな色B 12px);
	bottom: -4px;
}

.article h4 {
	border-top: none; /* Cocoon親テーマCSSリセットのため */
	margin: 1.8em 0 1em;
	border-bottom: solid 2px #好きな色;
}

.article h5 {
	border-bottom: none; /* Cocoon親テーマCSSリセットのため */
	margin: 1.5em 0 1em;
	padding: 0.25em 0.5em; /* 上下 左右の余白 */
	border-left: solid 8px #好きな色;
}

.article h6 {
	border-bottom: none; /* Cocoon親テーマCSSリセットのため */
	margin: 1.5em 0 1em;
	padding: 0.2em 0.5em;
	border-left: solid 4px #好きな色;
}