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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/*リストデザイン変更*/
.myulstyle ul{
border: solid 2px #e95295;
border-radius:5px;
padding:0.5em 1em 0.5em 2.3em;
position:relative;
}
.myulstyle ul li{
line-height:1.5;
padding:0.5em 0;
list-style-type:none!important;
}
.myulstyle ul li:before{
font-family:"Font Awesome 5 free";
content:"\f138";/*アイコンの種類*/
position:absolute;
left:0.2em;/*左端からアイコンまでの距離*/
color:#e95295;/*アイコン色*/
}

.myolstyle ol{
counter-reset:number;/*数字をリセット*/
list-style-type:none!important;/*数字を一旦消す*/
padding:0.5em;
background:#ffffff
}
.myolstyle ol li{
position:relative;
padding-left:30px;
line-height:1.5em;
padding:0.5em 0.5em 0.5em 30px;
}
.myolstyle ol li:before{
/*以下数字をつける*/
position:absolute;
counter-increment:number;
content:counter(number);
/*以下数字のデザインを変える*/
display:inline-block;
background:#e95295;
color:white;
font-family:'Avenir','Arial Black','Arial',sans-serif;
font-weight:bold;
font-size:15px;
border-radius:50%;
left:0;
width:25px;
height:25px;
line-height:25px;
text-align:center;
/*以下中央寄せのため*/
top:50%;
-webkit-transform:translateY(-50%);
transform:translateY(-50%);
}

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

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

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