@charset "utf-8";

/*===========================================================
画像と重なっている文字の色変更用
===========================================================*/

/*
 * 画像と重なった部分の文字色をJavaScriptで変更する対象クラス
 *
 * --text-color
 *   画像に重なっていない通常部分の文字色
 *
 * --text-color-on-image
 *   画像に重なっている部分の文字色
 *
 * 色を変更したい場合は、この2つだけ変更すればOKです。
 *
 * 例：
 * --text-color: #333;
 * --text-color-on-image: #fff;
 *
 * JavaScript実行後は文字色を透明にし、
 * background-clip: text で背景色を文字色として表示する。
 *
 * color はJavaScript実行前や、
 * JavaScriptが動かなかった場合の初期文字色として使用する。
 */
.js-img-text-color {
    --text-color: var(--black);
    --text-color-on-image: #fff;

    color: var(--text-color);
}


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:414px) {


/*===========================================================

===========================================================*/



} /* min-width: 414px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:544px) {


/*===========================================================

===========================================================*/



} /* min-width: 544px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:768px) {


/*===========================================================

===========================================================*/



} /* min-width: 768px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:1024px) {


/*===========================================================

===========================================================*/



} /* min-width: 1024px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:1200px) {


/*===========================================================

===========================================================*/



} /* min-width: 1200px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:1440px) {


/*===========================================================

===========================================================*/



} /* min-width: 1440px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:1620px) {



} /* min-width: 1620px ここまで */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */