@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* SWELLメインビジュアル テキストアニメーション用 */

/* アニメーション前の状態 */
/* メインテキスト（1文字ずつ） */
.mv_title .item {
    display: inline-block; /* transformを適用するため */
    opacity: 0;
    transform: translateY(0.7em);
    will-change: opacity, transform;
}
/* サブテキスト（1行ずつ） */
.mv_txt .mv_txt_line {
    display: block; /* 1行ずつなのでblock */
    opacity: 0;
    transform: translateY(20px);
    will-change: opacity, transform;
}

/* アニメーション実行後の状態（.activeクラスが付与されたとき） */
/* メインテキスト（1文字ずつ） */
.mv_title .item.active {
    opacity: 1;
    transform: translateY(0);
    transition: all 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
}
/* サブテキスト（1行ずつ） */
.mv_txt .mv_txt_line.active {
    opacity: 1;
    transform: translateY(0);
    transition: all 1.2s cubic-bezier(0.23, 1, 0.32, 1);
}