/* 1024以下 アニメーション不適用 */


/* 1025以上 アニメーション適用 */
@media screen and (min-width: 1025px) {

	/* Default
    --------------------------------------------- */

    /* set */
    #about.is_anime,
    #network.is_anime,
    #internet.is_anime,
    #security.is_anime,
    #cloud.is_anime,
    #phone_mobile.is_anime,
    #solution.is_anime,
    #pressrelease.is_anime,
    #info.is_anime,
    #company.is_anime,
    #about.is_anime *,
    #network.is_anime *,
    #internet.is_anime *,
    #security.is_anime *,
    #cloud.is_anime *,
    #phone_mobile.is_anime *,
    #solution.is_anime *,
    #newsrelease.is_anime *,
    #info.is_anime *,
    #maintenance.is_anime *,
    #company.is_anime * {
        animation-fill-mode: forwards;
        will-change: transform, opacity;
    }

    /* common */
    .sec .top-ttl,
    .sec .top-sub_ttl,
    .sec .service-list li,
    #newsrelease .news-list dl,
    #info .news-list dl,
    #maintenance .news-list dl {
        opacity:0;
        transform: translateY(30px);
    }

    /* about */
    #about .txtC,
    #about .btn-normal {
        opacity:0;
        transform: translateY(30px);
    }

    #network,
    #security,
    #phone_mobile,
    #company {
        transform: translateX(100%);
    }

    /* internet */
    #internet,
    #cloud,
    #solution,
    #company {/*20220127#company追加*/
        transform: translateX(-100%);
    }



	/* animation
    --------------------------------------------- */

    /* about */
    #about.is_anime .top-ttl,
    #about.is_anime .top-sub_ttl,
    #about.is_anime .txtC,
    #about.is_anime .btn-normal {
        animation:  anm_opacity 500ms ease forwards,
                    anm_transY 500ms ease forwards;
    }
    #about.is_anime .top-ttl {
        animation-delay: 1s;
    }
    #about.is_anime .top-sub_ttl {
        animation-delay: 1.2s;
    }
    #about.is_anime .txtC {
        animation-delay: 1.3s;
    }
    #about.is_anime .btn-normal {
        animation-delay: 1.4s;
    }

    /* service type01 */
    #network.is_anime,
    #security.is_anime,
    #phone_mobile.is_anime,
    #company.is_anime {
        animation:  anm_service_type01 500ms ease 0.5s forwards;
    }

    #network.is_anime .top-ttl,
    #network.is_anime .top-sub_ttl,
    #security.is_anime .top-ttl,
    #security.is_anime .top-sub_ttl,
    #phone_mobile.is_anime .top-ttl,
    #phone_mobile.is_anime .top-sub_ttl,
    #company.is_anime .top-ttl,
    #company.is_anime .top-sub_ttl {
        animation:  anm_opacity 500ms ease forwards,
                    anm_transY 500ms ease forwards;
    }

    #network.is_anime .top-ttl,
    #security.is_anime .top-ttl,
    #phone_mobile.is_anime .top-ttl,
    #company.is_anime .top-ttl {
        animation-delay: 0.9s;
    }

    #network.is_anime .top-sub_ttl,
    #security.is_anime .top-sub_ttl,
    #phone_mobile.is_anime .top-sub_ttl,
    #company.is_anime .top-sub_ttl {
        animation-delay: 1s;
    }

    #network.is_anime .service-list li,
    #security.is_anime .service-list li,
    #phone_mobile.is_anime .service-list li,
    #company.is_anime .service-list li {
        animation:  anm_servicelist 500ms ease 1.1s forwards;
    }



    /* service type02 */
    #internet.is_anime,
    #cloud.is_anime,
    #solution.is_anime,
    #company.is_anime {/*20220127#company追加*/
        animation:  anm_service_type02 500ms ease 0.5s forwards;
    }

    #internet.is_anime .top-ttl,
    #internet.is_anime .top-sub_ttl,
    #cloud.is_anime .top-ttl,
    #cloud.is_anime .top-sub_ttl,
    #solution.is_anime .top-ttl,
    #solution.is_anime .top-sub_ttl {
        animation:  anm_opacity 500ms ease forwards,
                    anm_transY 500ms ease forwards;
    }

    #internet.is_anime .top-ttl,
    #cloud.is_anime .top-ttl,
    #solution.is_anime .top-ttl {
        animation-delay: 0.9s;
    }

    #internet.is_anime .top-sub_ttl,
    #cloud.is_anime .top-sub_ttl,
    #solution.is_anime .top-sub_ttl {
        animation-delay: 1s;
    }

    #internet.is_anime .service-list li,
    #cloud.is_anime .service-list li,
    #solution.is_anime .service-list li {
        animation:  anm_servicelist 500ms ease 1.1s forwards;
    }


    /* newsrelease & info & maintenance */
    #maintenance.is_anime .top-ttl,
    #maintenance.is_anime .top-sub_ttl,
    #newsrelease.is_anime .top-ttl,
    #newsrelease.is_anime .top-sub_ttl,
    #info.is_anime .top-ttl,
    #info.is_anime .top-sub_ttl {
        animation:  anm_opacity 500ms ease forwards,
                    anm_transY 500ms ease forwards;
    }
    #maintenance.is_anime .top-ttl,
    #newsrelease.is_anime .top-ttl,
    #info.is_anime .top-ttl {
        animation-delay: 600ms;
    }
    #maintenance.is_anime .top-sub_ttl,
    #newsrelease.is_anime .top-sub_ttl,
    #info.is_anime .top-sub_ttl {
        animation-delay: 700ms;
    }
    #maintenance.is_anime .news-list dl,
    #newsrelease.is_anime .news-list dl,
    #info.is_anime .news-list dl {
        animation:  anm_newslist 500ms ease 800ms forwards;
    }

}


/* keyframes
--------------------------------------------- */

@keyframes anm_opacity {
    100% {
        opacity: 100;
    }
}
@keyframes anm_transY {
    100% {
        transform: translateY(0);
    }
}

@keyframes anm_service_type01 {
    100% {
        opacity: 100;
        transform: translateX(0);
    }
}

@keyframes anm_service_type02 {
    100% {
        opacity: 100;
        transform: translateX(0);
    }
}

@keyframes anm_servicelist {
    100% {
        opacity: 100;
        transform: translateY(0);
    }
}

@keyframes anm_newslist {
    100% {
        opacity: 100;
        transform: translateY(0);
    }
}