@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){
  /*必要ならばここにコードを書く*/
}


/* サイドバーのデザイン */

#sidebar p {
	padding-top:10px;
	font-size: 0.9em
}

#sidebar .myFace{
	height:200px;
	display: block;
	margin: 0 auto;
}

#sidebar h3{
	font-size: 1em;/*文字サイズ*/
	padding: 7px;/*文字回りの余白（上下左右）*/
	text-align:center;
	display: block;
	border-top: 2px solid #000;/*上線（太さ 実線 色）*/
	border-bottom: 2px solid #000;/*下線（太さ 実線 色）*/
	margin-bottom:1em;
}


#sidebar .myLinkArea{
	font-size:1em;
	line-height:2.3;
	font-weight:bold;
	background-color: #f8f9ff;
	border: dashed 1.5px #4865b2;
	padding: 1em;
	margin: 1.5em 0 2em;
	border-radius: 4px;
}


/* アピールエリアのデザイン */

/* 背景画像をぼかす */
#appeal {
  position: relative;
  overflow: hidden;
}

/* ぼかし用レイヤーを追加 */
#appeal::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: inherit; /* Cocoonはbackground-imageを親で指定しているため */
  background-size: cover;
  background-position: center;
  filter: blur(3px); /* ここでぼかしの強さを調整 */
  transform: scale(1.05); /* ぼかしの端切れ防止 */
  z-index: 0;
}

/* 文字部分を上に */
#appeal .appeal-content {
  position: relative;
  z-index: 1;
}

/* 文字部分はぼかさない（くっきり） */
#appeal .appeal-message,
#appeal .hero_section_main,
#appeal .hero_section_sub {
  filter: none !important;
  backdrop-filter: none !important;
}

#appeal .hero_section_main .main_1{
	font-size:1.8em;
	font-weight:bold;
	color:red;
	margin-right:5px;
}

#appeal .hero_section_main .main_2{
	font-size:1.8em;
	font-weight:bold;
	color:blue;
	margin: 0 5px;
}

#appeal .hero_section_main .main_3{
	font-size:1.8em;
	font-weight:bold;
	color:orange;
	margin-left:5px;
}

#appeal .hero_section_sub{
	padding:10px;
	font-size:1.1em;
	font-weight:bold;
}


/* ショートコードaside用のスタイル */

.my-aside {
  padding: 1em 1.2em;
  border-radius: 2px;
	line-height:2;
}

/* 枠付きタイプ（boader） */
.my-aside-boader {
  border: 1px dashed #4a90e2; /* 点線枠などに変更可 */
  background-color: #f9fbff;
  color: #333;
}