@charset "utf-8";

/*-------------  スライドマーカー ---------------*/
/* アニメーション前のスタイル */
.js-marker {
	display: inline;
	position: relative;
	background-image: linear-gradient(90deg,  #e333217d,  #e333217d); /* 単色の場合は同じ色、グラデーションさせる場合は別々の色 */
	background-repeat: no-repeat;
	background-position: bottom left;
	background-size: 0 50%; /* '30%'の部分にマーカーの太さを記入 */
	transition: all 1s ease-in-out; /* マーカーを引く速度を調整 */
	font-weight: bold; /* ついでに太字にしたい場合 */
}
  
/* アニメーション発火時 */
.js-marker.inview {
background-size: 100% 50%; /* '30%'の部分は上で設定した太さに合わせる */
}