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

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

.saimulp .blue {
	color: #254ae0;
}

.saimulp #footer {
	background-color: #6875cb;
	color: #fff;
}

.header-container, 
.main,  {
  background-color: #ffd6d6;
}

.h3-style01 h3, .h3-style04 h3, .h3-style05 h3, .h3-style06 h3, .h4-style01 h4, .h2-style02 h2, .h2-style08 h2, .h2-style08 h2:before, .h2-style09 h2, .h4-style03 h4 {
    border-color: #6cb8d8!important;
}

.simple-box3 {
    border-color: #ffcd44!important;
}

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

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

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

/* 白抜きボックスのスタイル（切り替え） --------------------------------------------------- */

.blank-box:where(.is-style-blank-1,.is-style-blank-2,.is-style-blank-3,.is-style-blank-4,.is-style-blank-5,.is-style-blank-6,.is-style-blank-7,.is-style-blank-8,.is-style-blank-9,.is-style-blank-10,.is-style-blank-11,.is-style-blank-12,.is-style-blank-13){
	padding:2em!important; /*ボックスの内側余白*/
}

/* スタイル 1: ダブル線の枠線と幅4pxのボックス */
.blank-box.is-style-blank-1 {
	border-radius: 0; /* 角丸をなしに */
	border-width: 4px; /* 枠線の幅を4pxに */
	border-style: double; /* ダブル線の枠線スタイル */
}

/* スタイル 2: 幅1pxのシンプルな枠線 */
.blank-box.is-style-blank-2 {
	border-radius: 0;
	border-width: 1px;
}

/* スタイル 3: 幅2pxのシンプルな枠線 */
.blank-box.is-style-blank-3 {
	border-radius: 0;
	border-width: 5px;
}

/* スタイル 4: 幅1pxの点線スタイル */
.blank-box.is-style-blank-4 {
	border-radius: 0;
	border-width: 1px;
	border-style: dashed; /* 点線の枠線スタイル */
}

/* スタイル 5: 幅2pxの点線スタイル */
.blank-box.is-style-blank-5 {
	border-radius: 0;
	border-width: 2px;
	border-style: dashed;
}

/* スタイル 6: 幅2pxのドット線スタイル */
.blank-box.is-style-blank-6 {
	border-radius: 0;
	border-width: 2px;
	border-style: dotted; /* ドット線の枠線スタイル */
}

/* スタイル 7: 幅4pxのドット線スタイル */
.blank-box.is-style-blank-7 {
	border-radius: 0;
	border-width: 4px;
	border-style: dotted;
}

/* スタイル 8: 右・左・下の枠線なし、上のみ幅5pxの枠線 */
.blank-box.is-style-blank-8 {
	border-radius: 0;
	border-width: 5px;
	border-right: none;
	border-left: none;
	border-bottom: none;
}

/* スタイル 9: 左・上・下の枠線なし、右のみ幅5pxの枠線 */
.blank-box.is-style-blank-9 {
	border-radius: 0;
	border-width: 5px;
	border-right: none;
	border-top: none;
	border-bottom: none;
}

/* スタイル 10: ストライプ背景（斜めの繰り返し線） */
.blank-box.is-style-blank-10 {
	border-radius: 0;
	border-width: 0;
	background-image: repeating-linear-gradient(-45deg, #f2f3f7 0, #f2f3f7 3px, transparent 3px, transparent 6px); /* ストライプパターン */
}

/* スタイル 11: チェックパターンの背景 */
.blank-box.is-style-blank-11 {
	border-radius: 0;
	border-width: 0;
	background-image: linear-gradient(0deg, transparent 19px, #ccc 20px), linear-gradient(90deg, transparent 19px, #ccc 20px); /* チェックパターン */
	background-size: 20px 20px; /* パターンのサイズ設定 */
}

/* スタイル 12: 右上に折り返し効果を追加 */
.blank-box.is-style-blank-12 {
	border-radius: 0;
	border-width: 0;
	position: relative;
}

.blank-box.is-style-blank-12:after {
	position: absolute;
	content: '';
	right: 0px;
	top: 0px;
	border-width: 0 20px 20px 0; /* 三角形の折り返し部分 */
	border-style: solid;
	border-color: #ccc #fff #ccc; /* 三角形の色 */
	box-shadow: -1px 1px 1px rgb(0 0 0 / .15); /* 影の効果 */
}

/* スタイル 13: 外枠の破線を追加 */
.blank-box.is-style-blank-13 {
	border-radius: 0;
	border-width: 0;
	position: relative;
	z-index: 0;
}

.blank-box.is-style-blank-13:before {
	position: absolute;
	border: 2px dashed #fff; /* 破線の太さと色 */
	content: '';
	display: block;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	margin: 5px; /* 内側の余白 */
	z-index: -1;
	border-radius: 3px; /* 破線の角丸設定 */
}