/*
  Skin Name: diy-campingスキン
  Description: diy-campingで採用しているスキンです。
  Skin URI: https://diy-camping.com/
  Author: ばんぞう
  Author URI: https://diy-camping.com/
  Screenshot URI: https://im-cocoon.net/wp-content/uploads/skin-template.png
  Version: 1.0.2
  Priority: 9900000
*/
/*以下にスタイルシートを記入してください*/


/* cocoon設定　文字サイズPC16px モバイル15px・文字の太さ500・行の高さ1.8 行の余白2 */

/* サイトタイトル */

.site-name-text{
	text-shadow:
	#fff 1px 1px 10px, #fff -1px 1px 10px,
    #fff 1px -1px 10px, #fff -1px -1px 10px;				
}

/* 見出し */
.article h2 {
    font-size:1.4em;/*22.4px*/
    padding: 15px 25px;
    background-color: #517d99;
	color:#fff;
	font-weight:700;
	position:relative;
}
.article h2::before{
	content:"";
	position:absolute;
	width:100%;
	height:2px;
	top:-4px;
	left:0;
	border-top:2px solid #517d99;
}
.article h2::after{
	content:"";
	position:absolute;
	width:100%;
	height:2px;
	bottom:-4px;
	left:0;
	border-bottom:2px solid #517d99;
}

.article h3 {
    border-left: none;
    border-right: none;
    border-top: none;
    border-bottom: none;
    font-size: 1.3125em;/*21px*/
	font-weight:700;
	color:#365466;
    padding: 0 0.5em 0.5em;
	position:relative;
}
.article h3::before {
    content: "";
    width: 100%;
    height: 2px;
	background: repeating-linear-gradient(90deg, #517d99 0%,  #517d99 29.3%, rgba(150,150,150,.2) 29.3%, rgba(150,150,150,.2) 100%);
    position:absolute;
	bottom:-3px;
	left:-0.1em;
}

/* サイドバー見出し */
.sidebar h2, .sidebar h3 {
    background-color: #fff;
    padding: 0;
    margin:  0 0 1em 0;
    border-radius: 0;
	position:relative;
}
.sidebar h2::before,
.sidebar h3::before {
    content: "";
    width: 100%;
    height: 2px;
	background: repeating-linear-gradient(90deg, #517d99 0%,  #517d99 29.3%, rgba(150,150,150,.2) 29.3%, rgba(150,150,150,.2) 100%);
    position:absolute;
	bottom:-3px;
	left:-0.1em;
}

/* ステマ規制対応PR表記 */
.pr-label-s {
    position: absolute;
    top: 0;
    left: 0;
	text-align:center;
    border: none;
	width:100%;
	padding:1.2em 1em 0.5em 1em;
}

/* キャプション */
figcaption{
	font-size:1em;
	color:#555;
}
.wp-block-image figcaption{margin-top:0.3em;!important}


/* リスト */
.article ul li, .article ol li{
	margin:0.8em 0;
	line-height:1.3;
}

/* アイコンリスト（タイトルボックスと使用するためpadding調整） */
.wp-block-cocoon-blocks-iconlist-box.blank-box{padding:0 0 1em 0;}

/* エントリーカード　*/
.entry-card-snippet, .related-entry-card-snippet, {
  font-size: 15px;
  max-height: 7.8em;
  line-height: 1.45;
  overflow: hidden;
}
.sidebar .widget-entry-card{font-size: 15px;}

/* ボタン中 */
.btn-m, .btn-wrap.btn-wrap-m > a{
	padding: 9px 50px;
}

/* 目次 */
.toc{
	display:block;
	background: #f7f7f7;
	background: repeating-linear-gradient(135deg, #f9f9f9, #f9f9f9 2px, #fff 0, #fff 4px);
	border:1px solid #f3f3f3;
	border-top:3px solid #517d99;
	padding:1em 2.2em 2em 2.2em;
}

/* フレックスアイテム */
.mod-flex{
	display:flex;
	flex-wrap:wrap;
}

/* ギャラリー */
.wp-block-gallery.has-nested-images figure.wp-block-image figcaption{
	background: #000;
	padding:8px;
	line-height:1.35;
}

/* 吹き出し */
div.speech-balloon{
	border:1px solid #93d2f0 !important;
	background:#e2f6ff !important;
}
.speech-balloon::before{
	border-right-width:11px;
	border-right-color:#93d2f0;
	top:13px;
	left:-11px;
	border-top: 8px solid transparent;
	border-bottom: 8px solid transparent;
}
.speech-balloon::after{
	border-right-color:#e2f6ff;
	border-right-width:10px;
	top:14px;
	left:-10px;
	border-top: 7px solid transparent;
	border-bottom: 7px solid transparent;
}
.speech-person{line-height:1.15;}
.speech-name{font-size:0.7em;}

/* 記事内著者紹介 */
.incnt-author{
	border:1px solid #ccc;
	border-top:3px solid #517d99;
	padding:1.6em 2em 1em 2em;
}
body .incnt-author .speech-wrap{margin-bottom:0.8em;}
body .incnt-author > ul{
	padding-left:1em;
	margin-bottom:0.5em;
	color:#444;
}
body .incnt-author > ul li{margin:0.35em 0;}


/* ステップブロック */
.block-step {counter-reset:step;}
.block-step__item {
	position:relative;
	margin-bottom:0!important;
	padding:0 1em 2em 84px;
}
.block-step__item::before {
	position:absolute;
	top:0;
	left:29px;
	display:block;
	width:0;
	height:100%;
	border-left:1px dashed #999;
	content:"";
}
.block-step__item:last-child::before {content:none}
.block-step__number {
	position:absolute;
	top:0;
	left:0;
	display:flex;
	flex-direction:column;
	justify-content:center;
	box-sizing:content-box;
	width:60px;
	height:60px;
	color:#fff;
	line-height:1;
	text-align:center;
}
.block-step__number .__label {
	display:block;
	padding-top:3px;
	padding-bottom:3px;
	font-size:12px;
}
.block-step__number::after {
	display:block;
	font-size:24px;
	content:counter(step);
	counter-increment:step;
}
.block-step__number {
	border-radius:50%;
	color: #fff;
	background-color:#59b98d;
}
.block-step__title {
	font-size:1.125em;
	font-weight:bold;
	padding-top:1em;
	margin-bottom:0.5em;
}
.block-step .block-step__body ul{margin-bottom:0;}


/* Contact Form 7 */
.wpcf7{
	background: #f7f7f7;
	background: repeating-linear-gradient(135deg, #fafafa, #fafafa 2px, #fff 0, #fff 4px);
}
.wpcf7 form{
	margin:0 3em 3em 3em;
	padding-top:1em;
}
.article .wpcf7 form p{margin-bottom:1em;}
.wpcf7 input[type="submit"]{
	-webkit-appearance: none;
	border: none;
	border-radius:5px;
	background-color: #517d99;
	color: #fff;
	width:200px;
	display:block;
	margin:0 auto 0 auto;
}
.wpcf7 .hissu{
	font-size:0.8em;
	color:#F20000;
}
	
/* サイドバー著者紹介（プロフィール） */
.author-box .author-name{
	font-size:15px;
	font-weight:normal;
}
.author-box .author-name a{
	color:#333;
	text-decoration:none;
}
.nwa .author-box .author-content{padding:0;}
.author-box p{
	font-size:15px;
	line-height:1.6;
}

/* サイドバーカテゴリー */
.widget_categories ul li a{
  line-height: 1.45;
  font-size: 15px;
  border-bottom: 1px solid #e1e1e1;
}
.widget_categories ul li a::before{
  font-family: "Font Awesome 5 Free";
  content: "\f07b";
  color: #aaa;
  padding-right: 10px;
  font-weight: 700;
}
.widget_categories > ul > li > a:first-child{ 
  border-top: none;
}


/* 文字サイズ変更 */

.f11em{font-size:1.1em;}
.f12em{font-size:1.2em;}
.f14em{font-size:1.4em;}
.f16em{font-size:1.6em;}
.f18em{font-size:1.8em;}
.f20em{font-size:2em;}

.f11em-b{font-size:1.1em; font-weight:bold;}
.f12em-b{font-size:1.2em; font-weight:bold;}
.f14em-b{font-size:1.4em; font-weight:bold;}
.f16em-b{font-size:1.6em; font-weight:bold;}
.f18em-b{font-size:1.8em; font-weight:bold;}
.f20em-b{font-size:2em; font-weight:bold;}

/* 文字装飾 */
.u-line{text-decoration:underline;}

/* 文字揃え */
.al-l{text-align:left;}
.al-r{text-align:right;}
.al-c{text-align:center;}

/* Rinkerプラグイン */
div.yyi-rinker-contents{line-height:1.65;!important}

/* reCAPTCHA */
.grecaptcha-badge { visibility: hidden; }

/* 強制変更 */

.padding-0{padding:0!important;}
.margin-0{margin:0!important;}

/*- PCのみ表示 -*/
@media (max-width: 767px) {
  .u-only-pc {
    display: none !important;
  }
}

/*- SPのみ表示 -*/
@media (min-width: 768px) {
  .u-only-sp {
    display: none !important;
  }
}


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

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

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

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

 .article h2 {
     font-size:1.2em;/*18px*/
     padding: 0.8em 1em;
 }
 .article h3 {font-size: 1.1333em;}/*17px*/
	
 .article p{line-height:1.65;}/* PCはCocoon設定で変更 */
	
 .mod-flex{flex-direction:column;}

  /* 目次 */
 .toc{padding:1em 1.3em;}
	
  /* 記事内著者紹介 */
 .incnt-author{padding:1.5em 1em 1em 1em;}
	
	/* ステップブロック */
 .block-step__item {padding:0 0 1em 58px;}
 .block-step__item::before {left:23px;}
 .block-step__number {
	width:48px;
	height:48px;
 }
 .block-step__number .__label {
	padding-top:0;
	padding-bottom:2px;
	font-size:10px;
 }
 .block-step__number::after {font-size:20px;}
 .block-step__title {padding-top:0.6em;}
	
  /* Contact Form 7 */
 .wpcf7 form{
	margin:0 1em 2em 1em;
	padding-top:2em;
 }
	
}