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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.container.cf {
    max-width: unset;
}

.e-card-title {
    font-weight: 600;
}
/*点滅*/
.text_blink {
    animation: blinking 1s ease-in-out infinite alternate;
}
@keyframes blinking {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
/*カウントダウンタイマーミリ秒*/
.count_mili{
display:inline;
position:absolute;
margin-top:15px;
margin-left:5px;
color:#DD3333
}
/*キラリン*/
/*画像を光らせる*/
.reflection{
/*display:inline-block;*/
position:relative;
overflow:hidden;
}
 
.reflection:after {
content:"";
height:100%;
width:30px;
position:absolute;
top:-180px;
left:0;
background-color: #fff;
opacity:0;
-webkit-transform: rotate(45deg);
-webkit-animation: reflection 3s ease-in-out infinite;
}
/*マーカー*/
.marker_ylw{
background:linear-gradient(transparent 50%, rgba(255, 255, 102) 50%);
}
.marker_blue{
background:linear-gradient(transparent 50%, rgba(102, 204, 255) 50%) ;
}
.marker_pnk{
background:linear-gradient(transparent 50%, rgba(255, 187, 227) 50%) ;
}
.marker_red{
background:linear-gradient(transparent 50%, rgba(255, 198, 185) 50%) ;
}
.marker_anime{
/*background:linear-gradient(transparent 50%, rgba(255, 220, 123) 50%);*/
display: inline;
background-repeat: no-repeat;
background-size: 0% 100%;
transition:background-size 1.5s;
}
/* マーカーが引かれる際に付与するクラス */
.marker_anime.on {
/* 横方向を100%にして、マーカーを引く */
background-size: 100% 100%;
}


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

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

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