@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    1.0.6
*/

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

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*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){
  /*必要ならばここにコードを書く*/
}

/* ------------------------------------
カラーボックス
------------------------------------ */
.c_box {
	padding: 1em 4%;
	margin: 2em 0 2em;
	border: 2px solid #dddddd;
	border-radius: 0.2em;
}
.c_box.intitle {
	padding-top: 0;
	padding-bottom: 1.4em;
}
.c_box.intitle .box_title {
	position: relative;
	top: -0.85em;
	padding: 0.1em 0.5em;
	background: #6d6d6d;
	color: #ffffff;
	font-weight: bold;
	border-radius: 0.2em;
	display: inline-block;
	vertical-align: bottom;
}
.c_box ul,
.c_box ol { /* カラーボックス内のリストは左側の余白なし */
	padding-left: 4%;
}


/* カラーボックス ピンク */
.c_box.pink_box {
	background: #ffeeee;
	border-color: #ef8786;
	color: #775454;
}
.c_box.pink_box .box_title {
	background: #ef8786;
}

/* カラーボックス グレー */
.c_box.gray_box {
	background: #ececec;
	border-color: #9c9c9c;
	color: #555555;
}
.c_box.gray_box .box_title {
	background: #9c9c9c;
}

/* カラーボックス イエロー */
.c_box.yellow_box {
	background: #fff8d4;
	border-color: #ded647;
	color: #636546;
}
.c_box.yellow_box .box_title {
	background: #ded647;
}