@charset "utf-8";

/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
@media screen and (min-width: 751px), print{
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */

/*================*/
.container {
    --fontsize-base: 10px;
    --width-line-base: 1px;
    --unit-mascot-move: 7px;
}

/*================*/
.container {
}
/*--------*/
.container br.ssize {
    display: none;
}
/*--------*/
.container .txt {
    line-height: 1.0;
    letter-spacing: 0.12em;
}
/*--------*/
section>.inner {
    margin: 0 auto 0 auto;
}

/*================*/
section.visual {
}
/*--------*/
section.visual .area-visual {
    position: relative;
    width: 100%;
    aspect-ratio: 3024/1444;
}
section.visual .area-visual .block-visual {
    position: relative;
    width: 100%;
    height: 100%;
}
section.visual .area-visual .block-visual .each {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    opacity: 0;
    transition-property: opacity;
    transition-duration: 1.3s;
    transition-timing-function: linear;
    opacity: 0;
}
section.visual .area-visual .block-visual .each.act-appear {
    opacity: 1;
}
section.visual .area-visual .block-visual .cell-visual {
    width: 100%;
    height: 100%;
}
section.visual .area-visual .block-visual .cell-visual .figelm {
    width: 100%;
    height: 100%;
}
section.visual .area-visual .block-visual .each.n1 .cell-visual .figelm {
    background-image: url(../img/pic_visual_01_a.png);
}
section.visual .area-visual .block-visual .each.n2 .cell-visual .figelm {
    background-image: url(../img/pic_visual_02_a.png);
}
section.visual .area-visual .block-visual .each.n3 .cell-visual .figelm {
    background-image: url(../img/pic_visual_03_a.png);
}
section.visual .area-visual .block-visual .cell-poem {
    position: absolute;
    left: auto;
    top: 0;
    width: 100%;
    height: 0;
}
section.visual .area-visual .block-visual .each.n1 .cell-poem {
    left: 50.6%;
    margin: 13.4% 0 0 0;
}
section.visual .area-visual .block-visual .each.n2 .cell-poem {
    left: 65.2%;
    margin: 6.8% 0 0 0;
}
section.visual .area-visual .block-visual .each.n3 .cell-poem {
    left: 11.2%;
    margin: 34.4% 0 0 0;
}
section.visual .area-visual .block-visual .cell-poem .cushion {
    width: 35.7%;
    aspect-ratio: 540/64;
}
section.visual .area-visual .block-visual .cell-poem .cushion .figelm {
    filter: drop-shadow(0 0 0.2vw #000);
}
section.visual .area-visual .block-visual .each.n1 .cell-poem .cushion .figelm {
    background-image: url(../img/char_visual_01_a.svg);
}
section.visual .area-visual .block-visual .each.n2 .cell-poem .cushion .figelm {
    background-image: url(../img/char_visual_02_a.svg);
}
section.visual .area-visual .block-visual .each.n3 .cell-poem .cushion .figelm {
    background-image: url(../img/char_visual_03_a.svg);
}
section.visual .area-visual .block-logo {
    position: absolute;
    left: auto;
    top: 0;
    width: 100%;
    height: 0;
}
section.visual .area-visual .block-logo .cushion {
    position: absolute;
    left: 2.5%;
    width: 22.5%;
    aspect-ratio: 148/60;
    margin: 2.5% 0 0 0;
}
section.visual .area-visual .block-logo .cushion .figelm {
    background-image: url(../img/logo_campaign.svg);
}

/*================*/
section.about {
}
section.about>.inner {
    width: min(1000px, 94%);
}
/*----------------*/
section.about .area-title {
}
section.about .area-title .block-illust {
    padding: 65px 0 20px 0;
    text-align: center;
}
section.about .area-title .block-illust .cushion {
    display: inline-block;
    vertical-align: top;
    width: 80px;
    aspect-ratio: 168/168;
}
section.about .area-title .block-illust .cushion .figelm {
    background-image: url(../img/obj_about_title.png);
}
section.about .area-title .block-title {
    padding: 0 0 30px 0;
    text-align: center;
}
section.about .area-title .block-title .txt {
    line-height: 1.5;
    font-size: calc(var(--fontsize-base) * 2.6);
    font-weight: 700;
}
/*----------------*/
section.about .area-note {
    padding: 0 0 70px 0;
    text-align: center;
}
section.about .area-note .txt {
    line-height: 2.6;
    font-size: calc(var(--fontsize-base) * 1.6);
}
/*----------------*/
section.about .area-jump {
}
section.about .area-jump .block-caption {
    text-align: center;
}
section.about .area-jump .block-caption .txt {
    font-size: calc(var(--fontsize-base) * 1.8);
    font-weight: 700;
    color: var(--color-blue-01);
}
section.about .area-jump .block-button {
    padding: 20px 0 95px 0;
    text-align: center;
}
section.about .area-jump .block-button .button-special {
    display: inline-block;
    vertical-align: top;
    width: 400px;
    height: 95px;
}
section.about .area-jump .block-button .button-special .hitelm {
}
section.about .area-jump .block-button .button-special .skin {
    position: relative;
    width: 100%;
    height: 100%;
}
section.about .area-jump .block-button .button-special .lag {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 10px;
}
section.about .area-jump .block-button .button-special .lag .paint {
    display: block;
    width: 100%;
    height: 100%;
    background-image: var(--gradient-01);
}
section.about .area-jump .block-button .button-special .rect {
    position: relative;
    width: 100%;
    height: calc(100% - 10px);
    background-color: var(--color-black);
}
section.about .area-jump .block-button .button-special .rect .edge {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 65px;
    height: 100%;
    padding: 4px 0 0 0;
}
section.about .area-jump .block-button .button-special .rect .edge .mark {
    position: relative;
    width: 20px;
    aspect-ratio: 1/1;
}
section.about .area-jump .block-button .button-special .rect .edge .mark .inlinesvg {
    stroke: var(--color-white);
    stroke-width: 3;
}
section.about .area-jump .block-button .button-special .rect .phrase {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0 0;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
section.about .area-jump .block-button .button-special .rect .phrase .cushion {
    width: 250px;
    aspect-ratio: 248/36;
}
section.about .area-jump .block-button .button-special .rect .phrase .cushion .figelm {
    background-image: url(../img/char_fukushimadestinationcampaign_a.svg);
}
section.about .area-jump .block-button .button-special .pointing {
    position: absolute;
    left: -35px;
    top: 27px;
    width: 0;
    height: 0;
    transform-origin: 50% 50%;
}
section.about .area-jump .block-button .button-special .pointing .cushion {
    width: 50px;
    aspect-ratio: 94/94;
}
section.about .area-jump .block-button .button-special .pointing .cushion .figelm {
    background-image: url(../img/ill_finger.png);
}

/*================*/
section.project {
    background-image: var(--gradient-02);
}
section.project>.inner {
    width: min(860px, 94%);
}
/*----------------*/
section.project .area-title {
}
section.project .area-title .block-char {
    padding: 65px 0 0 0;
    text-align: center;
}
section.project .area-title .block-char .cushion {
    display: inline-block;
    vertical-align: top;
    width: 55px;
    aspect-ratio: 52/12;
}
section.project .area-title .block-char .cushion .figelm {
    background-image: url(../img/char_check.svg);
}
section.project .area-title .block-illust {
    padding: 0 0 20px 0;
    text-align: center;
}
section.project .area-title .block-illust .cushion {
    display: inline-block;
    vertical-align: top;
    width: 45px;
    aspect-ratio: 88/88;
}
section.project .area-title .block-illust .cushion .figelm {
    background-image: url(../img/ill_mascot.png);
}
section.project .area-title .block-title {
    padding: 0 0 25px 0;
    text-align: center;
}
section.project .area-title .block-title .txt {
    font-size: calc(var(--fontsize-base) * 2.5);
    font-weight: 700;
}
/*----------------*/
section.project .area-list {
}
section.project .area-list .block-coming {
    padding: 0 0 50px 0;
}
section.project .area-list .block-coming .cell-coming {
    width: 520px;
    padding: 50px 0 45px 0;
    text-align: center;
    background-color: var(--color-gray-01);
    margin: 0 auto 0 auto;
}
section.project .area-list .block-coming .cell-coming .cusion {
    display: inline-block;
    vertical-align: top;
    width: 220px;
    aspect-ratio: 232/20;
}
section.project .area-list .block-coming .cell-coming .cusion .figelm {
    background-image: url(../img/char_comingsoon_a.svg);
}
section.project .area-list .block-note {
    padding: 0 0 55px 0;
    text-align: center;
}
section.project .area-list .block-note .txt {
    line-height: 1.5;
    font-size: calc(var(--fontsize-base) * 1.6);
}
section.project .area-list .block-list {
    display: flex;
    justify-content: start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 30px 30px;
    padding: 0 0 80px 0;
}
section.project .area-list .block-list .each {
    width: 30.9%;
}
section.project .area-list .block-list .each .hitelm {
}
section.project .area-list .block-list .each .skin {
    position: relative;
}
section.project .area-list .block-list .cell-picture {
    position: relative;
}
section.project .area-list .block-list .cell-picture .divi-shadow {
    position: absolute;
    left: 0;
    top: 0;
    width: calc(100% + 10px);
    height: calc(100% + 10px);
    background-image: var(--gradient-01);
}
section.project .area-list .block-list .cell-picture .divi-picture {
    position: relative;
    width: 100%;
    aspect-ratio: 520/346;
    background-color: var(--color-white);
}
section.project .area-list .block-list .each .cell-picture .divi-picture .figelm {
    background-position: 50% 50%;
    background-size: contain;
}
section.project .area-list .block-list .cell-info {
    padding: 25px 0 0 0;
}
section.project .area-list .block-list .cell-info .divi-title {
    position: relative;
    padding: 0 0 20px 0;
}
section.project .area-list .block-list .cell-info .divi-title .envel-number {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 0 0;
    position: absolute;
    left: 0;
    top: 0;
    width: 40px;
    aspect-ratio: 1/1;
    border-style: solid;
    border-width: calc(var(--width-line-base) * 2);
    border-color: var(--color-black);
    background-color: var(--color-black);
}
section.project .area-list .block-list .cell-info .divi-title .envel-number .cushion {
    width: 20px;
    aspect-ratio: 1/1;
}
section.project .area-list .block-list .cell-info .divi-title .envel-number .cushion .figelm {
}
section.project .area-list .block-list .each.n1 .cell-info .divi-title .envel-number .cushion .figelm {
    background-image: url(../img/char_01_number_w.svg);
}
section.project .area-list .block-list .each.n2 .cell-info .divi-title .envel-number .cushion .figelm {
    background-image: url(../img/char_02_number_w.svg);
}
section.project .area-list .block-list .each.n3 .cell-info .divi-title .envel-number .cushion .figelm {
    background-image: url(../img/char_03_number_w.svg);
}
section.project .area-list .block-list .cell-info .divi-title .envel-title {
    width: calc(100% - 40px);
    padding: 0 0 0 10px;
    margin: 0 0 0 auto;
}
section.project .area-list .block-list .cell-info .divi-title .envel-title .txt {
    line-height: 1.4;
    font-size: calc(var(--fontsize-base) * 1.5);
    font-weight: 700;
}
section.project .area-list .block-list .cell-info .divi-title .envel-pointing {
    position: absolute;
    left: -10px;
    top: 30px;
    width: 0;
    height: 0;
    transform-origin: 50% 50%;
}
section.project .area-list .block-list .cell-info .divi-title .envel-pointing .cushion {
    width: 20px;
    aspect-ratio: 94/94;
}
section.project .area-list .block-list .cell-info .divi-title .envel-pointing .cushion .figelm {
    background-image: url(../img/ill_finger.png);
}
section.project .area-list .block-list .cell-info .divi-note {
    padding: 15px 0 0 0;
    border-style: solid;
    border-width: calc(var(--width-line-base) * 1) 0 0 0;
    border-color: var(--color-black);
}
section.project .area-list .block-list .cell-info .divi-note .txt {
    line-height: 1.9;
    font-size: calc(var(--fontsize-base) * 1.3);
}
/*----------------*/
section.project .area-list.mode-center .block-list {
    justify-content: center;
}
section.project .area-list.mode-only .block-list .cell-info .divi-title .envel-number {
    display: none;
}
section.project .area-list.mode-only .block-list .cell-info .divi-title .envel-title {
    width: 100%;
    padding: 0 0 0 0;
}
section.project .area-list.mode-only .block-list .cell-info .divi-title .envel-pointing {
    display: none;
}
/*----------------*/
section.project .area-jump {
    padding: 0 0 108px 0;
}
section.project .area-jump .block-button {
}
section.project .area-jump .block-button .each {
    padding: 20px 0 0 0;
    text-align: center;
}
section.project .area-jump .block-button .each:nth-of-type(1) {
    padding: 0 0 0 0;
}
section.project .area-jump .block-button .button-simple {
    display: inline-block;
    vertical-align: top;
    width: 400px;
    height: 72px;
}
section.project .area-jump .block-button .button-simple .hitelm {
}
section.project .area-jump .block-button .button-simple .skin {
    position: relative;
    width: 100%;
    height: 100%;
    border-style: solid;
    border-width: calc(var(--width-line-base) * 2);
}
section.project .area-jump .block-button .button-simple.mode-style1 .skin {
    text-indent: -15px;
    border-color: var(--color-black);
    background-color: var(--color-black);
}
section.project .area-jump .block-button .button-simple.mode-style2 .skin {
    border-color: var(--color-jre-01);
    background-color: var(--color-jre-01);
}
section.project .area-jump .block-button .button-simple .edge {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 65px;
    height: 100%;
    padding: 5px 0 0 0;
}
section.project .area-jump .block-button .button-simple .edge .mark {
    position: relative;
    width: 20px;
    aspect-ratio: 1/1;
}
section.project .area-jump .block-button .button-simple .edge .mark .inlinesvg {
    stroke: var(--color-white);
    stroke-width: 3;
}
section.project .area-jump .block-button .button-simple .phrase {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0 0;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
section.project .area-jump .block-button .button-simple .phrase .txt {
    line-height: 1.4;
    font-size: calc(var(--fontsize-base) * 1.6);
    font-weight: 700;
    color: var(--color-white);
}

/*================*/
.layer-bottom {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 0;
}
/*----------------*/
.layer-bottom .area-border {
    position: absolute;
    left: 0;
    top: -10px;
    width: 100%;
    height: 10px;
    background-color: var(--color-black);
}
/*----------------*/
.layer-bottom .area-mascot {
    position: absolute;
    left: 0;
    top: -45px;
    width: 100%;
    padding: 0 0 0 45px;
}
.layer-bottom .area-mascot .block-mascot {
}
.layer-bottom .area-mascot .block-mascot .cushion {
    width: 36px;
    aspect-ratio: 88/88;
}
.layer-bottom .area-mascot .block-mascot .cushion .figelm {
    background-image: url(../img/ill_mascot.png);
}

/*================*/
.myanime-scurry-a {
    animation-name: myanime-scurry-a;
    animation-duration: 4s;
    animation-delay: 0s;
    animation-timing-function: step-end;
    animation-iteration-count: infinite;
    animation-direction: normal;
    animation-fill-mode: forwards;
    transform-origin: 50% 50%;
}
@keyframes myanime-scurry-a {
      0%{transform: translateY(0);}
      4%{transform: translateY(-5px);}
      8%{transform: translateY(0);}
    100%{transform: translateY(0);}
}
.myanime-scurry-b {
    animation-name: myanime-scurry-b;
    animation-duration: 4s;
    animation-delay: 0s;
    animation-timing-function: step-end;
    animation-iteration-count: infinite;
    animation-direction: normal;
    animation-fill-mode: forwards;
    transform-origin: 50% 50%;
}
@keyframes myanime-scurry-b {
      0%{transform: translateY(0);}
     12%{transform: translateY(-5px);}
     16%{transform: translateY(0);}
    100%{transform: translateY(0);}
}
.myanime-scurry-c {
    animation-name: myanime-scurry-c;
    animation-duration: 8s;
    animation-delay: 0s;
    animation-timing-function: step-end;
    animation-iteration-count: infinite;
    animation-direction: normal;
    animation-fill-mode: forwards;
    transform-origin: 50% 50%;
}
@keyframes myanime-scurry-c {
    /* -- */
      0%{transform: translate(                                0,                                 0);}
      2%{transform: translate(                                0,calc(var(--unit-mascot-move) * -2));}
      4%{transform: translate(                                0,                                 0);}
      6%{transform: translate(                                0,calc(var(--unit-mascot-move) * -2));}
      8%{transform: translate(                                0,                                 0);}
    /* -- */
     20%{transform: translate(calc(var(--unit-mascot-move) * 1),calc(var(--unit-mascot-move) * -1));}
     22%{transform: translate(calc(var(--unit-mascot-move) * 2),                                 0);}
    /* -- */
     30%{transform: translate(calc(var(--unit-mascot-move) * 3),calc(var(--unit-mascot-move) * -1));}
     32%{transform: translate(calc(var(--unit-mascot-move) * 4),                                 0);}
    /* -- */
     40%{transform: translate(calc(var(--unit-mascot-move) * 5),calc(var(--unit-mascot-move) * -1));}
     42%{transform: translate(calc(var(--unit-mascot-move) * 6),                                 0);}
    /* -- */
     70%{transform: translate(calc(var(--unit-mascot-move) * 4),                                 0);}
     72%{transform: translate(calc(var(--unit-mascot-move) * 2),                                 0);}
     74%{transform: translate(                                0,                                 0);}
    100%{transform: translate(                                0,                                 0);}
}

/* :::::::::::::::::::::::::::::::::::::::::::::::: */

/*================*/
@media (any-hover: hover){
    section.about .area-jump .block-button .button-special .hitelm:hover .pointing {
        transform: translateX(25px);
    }
    section.project .area-list .block-list .hitelm:hover .cell-info .divi-title .envel-number {
        background-color: var(--color-white);
    }
    section.project .area-list .block-list .hitelm:hover .cell-info .divi-title .envel-title .txt {
        text-decoration: underline;
    }
    section.project .area-list .block-list .hitelm:hover .cell-info .divi-title .envel-pointing .cushion .figelm {
        transform: translateY(-15px);
    }
    section.project .area-list .block-list .each.n1 .hitelm:hover .cell-info .divi-title .envel-number .cushion .figelm {
        background-image: url(../img/char_01_number_b.svg);
    }
    section.project .area-list .block-list .each.n2 .hitelm:hover .cell-info .divi-title .envel-number .cushion .figelm {
        background-image: url(../img/char_02_number_b.svg);
    }
    section.project .area-list .block-list .each.n3 .hitelm:hover .cell-info .divi-title .envel-number .cushion .figelm {
        background-image: url(../img/char_03_number_b.svg);
    }
    section.project .area-jump .block-button .button-simple.mode-style1 .hitelm:hover .skin {
        background-color: var(--color-white);
    }
    section.project .area-jump .block-button .button-simple.mode-style2 .hitelm:hover .skin {
        background-color: var(--color-white);
    }
    section.project .area-jump .block-button .button-simple.mode-style1 .hitelm:hover .edge .mark .inlinesvg {
        stroke: var(--color-black);
    }
    section.project .area-jump .block-button .button-simple.mode-style2 .hitelm:hover .edge .mark .inlinesvg {
        stroke: var(--color-jre-01);
    }
    section.project .area-jump .block-button .button-simple.mode-style1 .hitelm:hover .phrase .txt {
        color: var(--color-black);
    }
    section.project .area-jump .block-button .button-simple.mode-style2 .hitelm:hover .phrase .txt {
        color: var(--color-jre-01);
    }
} /* end of any-hover */

/*================*/
body {
    container-type: inline-size;
}
@container (min-width: 1025px) {
    section.about .area-note {
        text-align: center;
    }
} @container (max-width: 1024px) {
    section.about .area-note {
        text-align: left;
    }
    section.about .area-note .txt br.lsize {
        display: none;
    }
    section.about .area-note .txt br.ssize {
        display: inline;
    }
} /* end of container query */

/* :::::::::::::::::::::::::::::::::::::::::::::::: */


/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
} /* end of media query */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */