body {
    font-family: "yu-mincho-pr6n", sans-serif;
    color: #333333;
}


/* 基本のフェードインとスライドアップ効果 */
.slide-up-fade-in {
    opacity: 0;
    transform: translateY(200px);
    transition: opacity 1s ease-out, transform 1s ease-out;
}

/* アクティブ状態：最終的な表示状態 */
.slide-up-fade-in.active {
    opacity: 1;
    transform: translateY(0);
}

/* スローアニメーション効果 */
.slide-up-fade-in.slow {
    transition: opacity 1.5s ease-out, transform 1.5s ease-out;
}

/* クイックアニメーション効果 */
.slide-up-fade-in.fast {
    transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}

.is-anime.mask {
    -webkit-clip-path: inset(0 100% 0 0);
    clip-path: inset(0 100% 0 0);
    -webkit-transition: 1s ease-in-out;
    transition: 1s ease-in-out;
}

.is-anime.mask.active {
    -webkit-clip-path: inset(0 0 0 0);
    clip-path: inset(0 0 0 0);
}

.is-anime.mask.slow {
    -webkit-transition: 1.5s ease-in-out;
    transition: 1.5s ease-in-out;
}

.is-anime.fade {
    -webkit-filter: blur(20px);
    filter: blur(20px);
    opacity: 0;
    -webkit-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
}

.is-anime.fade.active {
    opacity: 1;
    -webkit-filter: blur(0);
    filter: blur(0);
}

.inner {
    position: relative;
}

.tabbox {
    display: none;
    /* 最初は全て非表示 */
}

.tabbox.active {
    display: block;
    /* アクティブなタブのみ表示 */
}




    a:link {
        color: black
    }



@media screen and (min-width: 1200px) {
    .sp {
        display: none;
    }
}

@media screen and (max-width: 1200px) {
    .pc {
        display: none;
    }
}