@charset "utf-8";




.mv_loading_overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #e8e3bb;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.5s ease;
}

.mv_loading_overlay_inner {
    width: 16.3rem;
    margin-top: -7.8rem;
    margin-left: 1rem;
}

@media screen and (min-width: 769px) {
    .mv_loading_overlay_inner {
        width: 30.4rem;
        margin-top: -2.8rem;
        margin-left: -1rem;
    }
}

.mv_loading_overlay_inner svg {
    width: 100%;
    display: block;
}


.mv_title_line1,
.mv_title_line2 {
    opacity: 0;
}


@keyframes mv-title-fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


.mv-title-show .mv_title_line1 {
    animation: mv-title-fadein 0.5s ease forwards;
}

.mv-title-show .mv_title_line2 {
    animation: mv-title-fadein 0.5s ease 0.3s forwards;
}


.mv-title-done .mv_loading_overlay {
    opacity: 0;
    pointer-events: none;
}






@keyframes mv-char-enter-top {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) translateY(-25rem);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) translateY(0);
    }
}


@keyframes mv-char-enter-top-right {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) translate(20rem, -20rem);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) translate(0, 0);
    }
}


@keyframes mv-char-enter-right {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) translateX(30rem);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) translateX(0);
    }
}


@keyframes mv-char-enter-bottom-right {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) translate(20rem, 20rem);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) translate(0, 0);
    }
}


@keyframes mv-char-enter-bottom {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) translateY(25rem);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) translateY(0);
    }
}


@keyframes mv-char-enter-bottom-left {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) translate(-20rem, 20rem);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) translate(0, 0);
    }
}


@keyframes mv-char-enter-left {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) translateX(-30rem);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) translateX(0);
    }
}


@keyframes mv-char-enter-left-leg {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) translateX(-30rem);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) translateX(0);
    }
}


@keyframes mv-char-enter-bottom-right-hand {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) translate(20rem, 20rem);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) translate(0, 0);
    }
}


@keyframes mv-char-enter-top-left {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) translate(-20rem, -20rem);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) translate(0, 0);
    }
}


.mv_characters .mv_char,
.mv_char--cool,
.mv_char--naughty_hand,
.mv_mr_cool_leg {
    opacity: 0;
}


.loaded .mv_characters .mv_char,
.loaded .mv_char--cool,
.loaded .mv_char--naughty_hand,
.loaded .mv_mr_cool_leg {
    animation-duration: 0.8s;
    animation-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
    animation-fill-mode: forwards;
}




.loaded .mv_char--princess,
.loaded .mv_char--strong {
    animation-name: mv-char-enter-top-left;
}


.loaded .mv_char--happy {
    animation-name: mv-char-enter-top;
}


.loaded .mv_char--giggles,
.loaded .mv_char--tickle {
    animation-name: mv-char-enter-top-right;
}


.loaded .mv_char--sparkle,
.loaded .mv_char--curious,
.loaded .mv_char--chatterbox {
    animation-name: mv-char-enter-right;
}


.loaded .mv_char--naughty,
.loaded .mv_char--sunshine {
    animation-name: mv-char-enter-bottom-right;
}


.loaded .mv_char--tall--small,
.loaded .mv_char--hug {
    animation-name: mv-char-enter-bottom;
}


.loaded .mv_char--greedy,
.loaded .mv_char--busy {
    animation-name: mv-char-enter-bottom-left;
}


.loaded .mv_char--bad,
.loaded .mv_char--cool {
    animation-name: mv-char-enter-left;
}


.loaded .mv_mr_cool_leg {
    animation-name: mv-char-enter-left-leg;
}


.loaded .mv_char--naughty_hand {
    animation-name: mv-char-enter-bottom-right-hand;
}


@media screen and (min-width: 769px) {
    
    .loaded .mv_char--splendid {
        animation-name: mv-char-enter-top;
    }

    
    .loaded .mv_char--calm {
        animation-name: mv-char-enter-top-left;
    }

    
    .loaded .mv_char--brave,
    .loaded .mv_char--chatterbox_pc {
        animation-name: mv-char-enter-left;
    }

    
    .loaded .mv_char--dotty {
        animation-name: mv-char-enter-bottom-right;
    }

    

    
    .loaded .mv_char--strong {
        animation-name: mv-char-enter-left;
    }

    
    .loaded .mv_char--busy {
        animation-name: mv-char-enter-bottom-right;
    }

    
    .loaded .mv_char--princess {
        animation-name: mv-char-enter-top-right;
    }

    
    .loaded .mv_char--sunshine {
        animation-name: mv-char-enter-bottom;
    }

    
    .loaded .mv_char--tickle {
        animation-name: mv-char-enter-right;
    }

    
    .loaded .mv_char--bad {
        animation-name: mv-char-enter-bottom-left;
    }

    
    .loaded .mv_char--greedy {
        animation-name: mv-char-enter-left;
    }
}


.mv-animation-done .mv_mr_cool_leg,
.mv-animation-done .mv_char--naughty_hand {
    animation: none;
    opacity: 1;
}




@keyframes mv-cloud-drift-right {
    0% {
        transform: translateX(calc(-100vw - 100%));
    }
    100% {
        transform: translateX(calc(100vw + 100%));
    }
}


@keyframes mv-cloud-drift-left {
    0% {
        transform: translateX(calc(100vw + 100%));
    }
    100% {
        transform: translateX(calc(-100vw - 100%));
    }
}


@keyframes mv-cloud-float-y1 {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-1.2rem);
    }
}

@keyframes mv-cloud-float-y2 {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-1rem);
    }
}




.mv_bg_cloud--1 .mv_bg_cloud_inner {
    animation-name: mv-cloud-drift-right;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}


.mv_bg_cloud--2 .mv_bg_cloud_inner {
    animation-name: mv-cloud-drift-left;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}


.mv_bg_cloud--1 .mv_bg_cloud_float {
    animation: mv-cloud-float-y1 8s ease-in-out infinite;
}
.mv_bg_cloud--2 .mv_bg_cloud_float {
    animation: mv-cloud-float-y2 8s ease-in-out infinite;
}


.mv_bg_cloud_inner.is-flipped picture {
    display: block;
    transform: scaleX(-1);
}




@keyframes mv-bump-drop {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) translateY(-100%);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) translateY(0);
    }
}


.mv_bump {
    opacity: 0;
}


.loaded .mv_bump {
    animation: mv-bump-drop 0.8s ease-in-out forwards;
}


.mv-animation-done .mv_bump {
    animation: none;
    opacity: 1;
}


@keyframes mv-bump-fall {
    0% {
        transform: translate(-50%, -50%) translateY(0);
        opacity: 1;
    }
    100% {
        transform: translate(-50%, -50%) translateY(150vh);
        opacity: 1;
    }
}

.mv_bump.is-dropping {
    animation: mv-bump-fall 0.8s ease-in forwards !important;
}




@keyframes mv-balloon-float {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) translateY(100%);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) translateY(0);
    }
}


@keyframes mv-balloon-sway-y {
    0%, 100% {
        transform: translate(-50%, -50%) translateY(0);
    }
    50% {
        transform: translate(-50%, -50%) translateY(-0.5rem);
    }
}


@keyframes mv-balloon-sway-y-pc {
    0%, 100% {
        transform: translate(-50%, -50%) translateY(0);
    }
    50% {
        transform: translate(-50%, -50%) translateY(-0.75rem);
    }
}


@keyframes mv-balloon-sway-x {
    0%, 100% {
        transform: translateX(0);
    }
    50% {
        transform: translateX(0.4rem);
    }
}


@keyframes mv-balloon-sway-x-pc {
    0%, 100% {
        transform: translateX(0);
    }
    50% {
        transform: translateX(0.6rem);
    }
}


.mv_balloon {
    opacity: 0;
}


.loaded .mv_balloon {
    animation:
        mv-balloon-float 0.8s ease-in-out forwards,
        mv-balloon-sway-y 3s ease-in-out 0.8s infinite;
}

.loaded .mv_balloon img {
    animation: mv-balloon-sway-x 4s ease-in-out infinite;
}


.mv-animation-done .mv_balloon {
    animation: mv-balloon-sway-y 3s ease-in-out infinite;
    opacity: 1;
}


@media (min-width: 769px) {
    .loaded .mv_balloon {
        animation:
            mv-balloon-float 0.8s ease-in-out forwards,
            mv-balloon-sway-y-pc 3s ease-in-out 0.8s infinite;
    }

    .loaded .mv_balloon img {
        animation: mv-balloon-sway-x-pc 4s ease-in-out infinite;
    }

    .mv-animation-done .mv_balloon {
        animation: mv-balloon-sway-y-pc 3s ease-in-out infinite;
    }
}




@keyframes mv-hot-air-balloon-float {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) translateY(100%);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) translateY(0);
    }
}


@keyframes mv-hot-air-balloon-sway-y {
    0%, 100% {
        transform: translate(-50%, -50%) translateY(0);
    }
    50% {
        transform: translate(-50%, -50%) translateY(-0.7rem);
    }
}


@keyframes mv-hot-air-balloon-sway-y-pc {
    0%, 100% {
        transform: translate(-50%, -50%) translateY(0);
    }
    50% {
        transform: translate(-50%, -50%) translateY(-1rem);
    }
}


@keyframes mv-hot-air-balloon-sway-x {
    0%, 100% {
        transform: translateX(0);
    }
    50% {
        transform: translateX(0.6rem);
    }
}


@keyframes mv-hot-air-balloon-sway-x-pc {
    0%, 100% {
        transform: translateX(0);
    }
    50% {
        transform: translateX(0.9rem);
    }
}


.mv_hot_air_balloon {
    opacity: 0;
}


.loaded .mv_hot_air_balloon {
    animation:
        mv-hot-air-balloon-float 0.8s ease-in-out forwards,
        mv-hot-air-balloon-sway-y 4s ease-in-out 0.8s infinite;
}

.loaded .mv_hot_air_balloon_inner {
    animation: mv-hot-air-balloon-sway-x 5s ease-in-out infinite;
}


.mv-animation-done .mv_hot_air_balloon {
    animation: mv-hot-air-balloon-sway-y 4s ease-in-out infinite;
    opacity: 1;
}


@media (min-width: 769px) {
    .loaded .mv_hot_air_balloon {
        animation:
            mv-hot-air-balloon-float 0.8s ease-in-out forwards,
            mv-hot-air-balloon-sway-y-pc 4s ease-in-out 0.8s infinite;
    }

    .loaded .mv_hot_air_balloon_inner {
        animation: mv-hot-air-balloon-sway-x-pc 5s ease-in-out infinite;
    }

    .mv-animation-done .mv_hot_air_balloon {
        animation: mv-hot-air-balloon-sway-y-pc 4s ease-in-out infinite;
    }
}




@keyframes mv-m-note-swing {
    0%, 10% {
        transform: translate(-50%, -50%) rotateZ(12deg);
    }
    15%, 25% {
        transform: translate(-50%, -50%) rotateZ(-12deg);
    }
    30%, 100% {
        transform: translate(-50%, -50%) rotateZ(12deg);
    }
}


.mv_m_note {
    opacity: 0;
}


.loaded .mv_m_note {
    animation: mv-m-note-swing 1s steps(1) infinite;
    opacity: 1;
}




.mv-animation-done .mv_characters .mv_char,
.mv-animation-done .mv_char--cool {
    opacity: 1;
}




@keyframes concept-cloud-drift-left-sp {
    0% {
        transform: translate(var(--anim-x), var(--anim-y)) translateX(0);
    }
    100% {
        transform: translate(var(--anim-x), var(--anim-y)) translateX(-30rem);
    }
}


@keyframes concept-cloud-drift-right-pc {
    0% {
        transform: translate(
            calc(var(--base-x) + var(--offset-x) + var(--anim-x)),
            calc(var(--base-y) + var(--offset-y) + var(--anim-y))
        ) translateX(0);
    }
    100% {
        transform: translate(
            calc(var(--base-x) + var(--offset-x) + var(--anim-x)),
            calc(var(--base-y) + var(--offset-y) + var(--anim-y))
        ) translateX(40rem);
    }
}


@keyframes concept-cloud2-drift-right-pc {
    0% {
        transform: translate(
            calc(var(--base-x) + var(--offset-x) + var(--anim-x)),
            calc(var(--base-y) + var(--offset-y) + var(--anim-y))
        ) translateX(0);
    }
    100% {
        transform: translate(
            calc(var(--base-x) + var(--offset-x) + var(--anim-x)),
            calc(var(--base-y) + var(--offset-y) + var(--anim-y))
        ) translateX(40rem);
    }
}


.concept.is-animated .concept_cloud {
    animation: concept-cloud-drift-left-sp 100s linear infinite;
}


@media (min-width: 769px) {
    .concept.is-animated .concept_cloud {
        animation: concept-cloud-drift-right-pc 200s linear infinite;
    }

    .concept.is-animated .concept_cloud2_pc {
        animation: concept-cloud2-drift-right-pc 200s linear infinite;
    }
}




@keyframes concept-hot-air-balloon-sway-y {
    0%, 100% {
        transform: translate(
            calc(var(--base-x) + var(--offset-x) + var(--anim-x)),
            calc(var(--base-y) + var(--offset-y) + var(--anim-y))
        ) translateY(0);
    }
    50% {
        transform: translate(
            calc(var(--base-x) + var(--offset-x) + var(--anim-x)),
            calc(var(--base-y) + var(--offset-y) + var(--anim-y))
        ) translateY(-1.2rem);
    }
}


@keyframes concept-balloon-sway-x {
    0%, 100% {
        transform: translateX(0);
    }
    50% {
        transform: translateX(0.75rem);
    }
}


@keyframes concept-balloon2-sway-y {
    0%, 100% {
        transform: translate(
            calc(var(--base-x) + var(--offset-x) + var(--anim-x)),
            calc(var(--base-y) + var(--offset-y) + var(--anim-y))
        ) translateY(0);
    }
    50% {
        transform: translate(
            calc(var(--base-x) + var(--offset-x) + var(--anim-x)),
            calc(var(--base-y) + var(--offset-y) + var(--anim-y))
        ) translateY(-0.9rem);
    }
}


@media (min-width: 769px) {
    .concept.is-animated .concept_hot_air_balloon_pc {
        animation: concept-hot-air-balloon-sway-y 4s ease-in-out infinite;
    }

    .concept.is-animated .concept_hot_air_balloon_pc_inner {
        animation: concept-balloon-sway-x 5s ease-in-out infinite;
    }

    .concept.is-animated .concept_balloon2_pc {
        animation: concept-balloon2-sway-y 3s ease-in-out infinite;
    }

    .concept.is-animated .concept_balloon2_pc_inner {
        animation: concept-balloon-sway-x 4s ease-in-out infinite;
    }
}


@keyframes concept-cloud-float-y1 {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-1.2rem);
    }
}

@keyframes concept-cloud-float-y2 {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-1rem);
    }
}

.concept.is-animated .concept_cloud .concept_cloud_inner {
    animation: concept-cloud-float-y1 20s ease-in-out infinite;
}

.concept.is-animated .concept_cloud2_pc .concept_cloud_inner {
    animation: concept-cloud-float-y2 20s ease-in-out infinite;
}




@keyframes news-sunshine-float-y {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-0.7rem);
    }
}


@keyframes news-sunshine-float-y-pc {
    0%, 100% {
        transform: translateX(-50%) translateY(0);
    }
    50% {
        transform: translateX(-50%) translateY(-1rem);
    }
}


@keyframes news-sunshine-float-x {
    0%, 100% {
        transform: translateX(0);
    }
    50% {
        transform: translateX(0.4rem);
    }
}


@keyframes news-sunshine-float-x-pc {
    0%, 100% {
        transform: translateX(0);
    }
    50% {
        transform: translateX(0.6rem);
    }
}

.news_deco_little_miss_sunshine_wrap {
    animation: news-sunshine-float-y 3s ease-in-out infinite;
}

.news_deco_little_miss_sunshine_wrap_inner {
    animation: news-sunshine-float-x 4s ease-in-out infinite;
}

.news_deco_bird {
    animation: news-sunshine-float-y 2.5s ease-in-out infinite;
}

.news_deco_bird_inner {
    animation: news-sunshine-float-x 3.5s ease-in-out infinite;
}


@keyframes news-bird-float-y-pc {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-1rem);
    }
}

@media (min-width: 769px) {
    .news_deco_little_miss_sunshine_wrap {
        animation: news-sunshine-float-y-pc 3.5s ease-in-out infinite;
    }

    .news_deco_little_miss_sunshine_wrap_inner {
        animation: news-sunshine-float-x-pc 4s ease-in-out infinite;
    }

    .news_deco_bird {
        animation: news-bird-float-y-pc 2.5s ease-in-out infinite;
    }

    .news_deco_bird_inner {
        animation: news-sunshine-float-x-pc 3.5s ease-in-out infinite;
    }
}




.news .news_deco.news_deco_newspaper {
    opacity: 0;
    transform: translateY(-10rem);
    transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}


.news.is-visible .news_deco.news_deco_newspaper {
    opacity: 1;
    transform: translateY(0);
}




   .concept_bg,.concept_inner,.concept_totop{
    transition: .3s;
   }

.concept.is-hidden .concept_bg > * {
    opacity: 0 !important;
}

.concept.is-hidden .concept_inner {
    opacity: 0!important;

}

.concept.is-hidden.is-animated .concept_totop {
    opacity: 0!important;

}