@charset "UTF-8";

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

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

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


/*画像左寄せ、文字回り込み設定;*/
img.alignleft,
.wp-caption.alignleft{
max-width: 45%;
	height: auto;
	display: block;
	float: left;
	margin: 0 13px 0 0;
}

/*画像右寄せ、文字回り込み設定;*/
img.alignright,
.wp-caption.alignright{
max-width: 40%;
	height: auto;
	display: block;
	float: right;
	margin: 0 0 0 6px;
}


/*飾り枠水色（男性）ver*/
.box14 {
    padding: 0.2em 0.5em;
    margin: 2em 0;
    background: #d6ebff;
    box-shadow: 0px 0px 0px 10px #d6ebff;
    border: dashed 2px white;
}
.box14 p {
text-align:center;
margin: 0; 
padding-top: 10px;
padding-bottom: 10px;
}

/*飾り枠ピンク15（センター）ver*/
.box15 {
    padding: 0.2em 0.5em;
    margin: 2em 0;
    background: #ffeaea;
    box-shadow: 0px 0px 0px 10px #ffeaea;
    border: dashed 2px #ffc3c3;
    border-radius: 8px;
}
.box15 p {
text-align:center;
margin: 0; 
padding-top: 10px;
padding-bottom: 10px;
}

/*飾り枠ピンク16（普通）ver*/
.box16 {
    padding: 0.2em 0.5em;
    margin: 2em 0;
    background: #ffeaea;
    box-shadow: 0px 0px 0px 10px #ffeaea;
    border: dashed 2px #ffc3c3;
    border-radius: 8px;
}
.box16 p {
margin: 0; 
padding-top: 10px;
padding-bottom: 10px;
}

.article ul {
	position: relative;
	padding: 0.5em 1em 0.5em 2.3em;
	margin:2em 0;
	background:#fff4ea;	
	box-shadow: 0 0 0 10px #fff4ea;
	border: dashed 3px #ffdbb7;
	border-radius: 3px;
}
.article ul li {
	line-height: 1.7;
	padding:0.6em 0.6em 0.6em 15px;
	color:#454545;
	list-style-type: none!important;
	text-shadow: 1px 1px 1px #fff;
}
.article ul li:before {
	position: absolute;
	font-family: FontAwesome;
	content:"\f046";
	font-size: 1.5em;
	font-weight: 700;
	color:#ff6347;
	line-height: 0.8em;
	left:18px;
	text-shadow: 1px 1px 1px #fff;
}
.article ul li ul {
	padding: 0.5em 1em 0.5em 2.3em;
	margin: 0.5em 0;
	border:none;
	border-radius: 0px;
}
.article ul.snsb {
	padding: 10px;
	margin:2em 0 ;
}
.article ul.snsp {
	padding: 0;
	margin:1em 0 ;
}
.article ul.snsb li {
	line-height: 1;
	padding:0;
	color:#454545;
	list-style-type: none!important;
	text-shadow: none;
}
.article ul.snsb li:before ,
.article ul.snsp li:before {
	content:"";
}
.article ol {
	counter-reset: number;
	list-style: none!important;
	padding:0.5em 1em;
	border:solid 2px #ffb107;
	border-radius: 10px;
}
.article ol li {
	position: relative;
	border-bottom: dashed 1px #dcdcdc;
	padding:0.5em 0.5em 0.5em 30px;
	line-height: 1.5em;
}
.article ol li ol {
	border:none;
	border-radius: 0px;
}
.article ol li:last-of-type {
	border-bottom: none;
}
.article ol li::before {
	position:absolute;
	left:0;
	top:5px;
	counter-increment: number;
	content:counter(number);

	display: inline-block;
	background: #ffb107;
	color:#fff;
	font-family: 'Avenir','Arial Black','Arial',sans-serif;
	font-weight: bold;
	font-size: 16px;
	line-height:27px;
	border-radius: 50%;
	width: 25px;
	height:25px;
	text-align: center;
	text-shadow: -1px -1px 1px rgba(0,0,0,0.1);
}

