@charset "UTF-8";
/* ==========================================================
Name:
    module.css

Description:
    サイトで共通使用する汎用モジュール及びページ固有のスタイルを記述する
    汎用モジュールは、アルファベット降順(A->Z)に記述する
    ページ固有のスタイルは、ディレクトリ名のアルファベット降順(A->Z)、
    ファイル名のアルファベット降順(A->Z)にそれぞれ記述する

Contents:
    module
    page
    utility
========================================================== */
/* ==========================================================
*
*   module
*
========================================================== */
/* ---------------------------------------------
*   loading
--------------------------------------------- */
.loading-container {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 99999;
    background-color: #fff;
}

.loading {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -25px;
    margin-left: -25px;
    width: 50px;
    height: 50px;
    border: 5px solid #1fa987;
    border-right: 5px solid transparent;
    border-radius: 30px;
    -webkit-animation: loading 1s linear infinite;
    animation: loading 1s linear infinite;
}

@-webkit-keyframes loading {
    to {
    }
    from {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
    }
}

@keyframes loading {
    to {
    }
    from {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
    }
}

/* ---------------------------------------------
*   change-landscape
--------------------------------------------- */
.change-landscape {
    display: none;
}

@media screen and (orientation: portrait) {
    .change-landscape {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 9999;
        display: block;
        overflow: hidden;
        background: url(/library/stories/7pj/img/bg.png) 0 0 repeat;
    }
}

.change-landscape__txt {
    position: absolute;
    top: 43.1338%;
    left: 50%;
    width: 74.84375%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.change-landscape__img {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 55%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

/* ---------------------------------------------
*   page
--------------------------------------------- */
.page {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    overflow: hidden;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    text-align: center;
    -webkit-transform-origin: 0 center;
    transform-origin: 0 center;

    -webkit-box-pack: center;
    justify-content: center;
}

.page.current {
    z-index: 2;
    -webkit-transition: -webkit-transform 1s;
    transition: -webkit-transform 1s;
    transition: transform 1s;
    transition: transform 1s, -webkit-transform 1s;
}

.page.prev {
    z-index: 3;
    -webkit-transform: rotateY(-90deg);
    transform: rotateY(-90deg);
}

.page.next {
    z-index: 1;
}

.page.flip-next {
    -webkit-transition: -webkit-transform 1s;
    transition: -webkit-transform 1s;
    transition: transform 1s;
    transition: transform 1s, -webkit-transform 1s;
    -webkit-transform: rotateY(-90deg);
    transform: rotateY(-90deg);
}

.page.flip-prev {
    z-index: 3;
    -webkit-transition: -webkit-transform 1s;
    transition: -webkit-transform 1s;
    transition: transform 1s;
    transition: transform 1s, -webkit-transform 1s;
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
}

.page__inner {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
}

.page__number {
    position: absolute;
    right: 0;
    bottom: 2.34375%;
    width: 12.14789%;
}

.page__number.blinking {
    -webkit-animation: blink .5s ease-in-out infinite alternate;
    animation: blink .5s ease-in-out infinite alternate;
}

@-webkit-keyframes blink {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@keyframes blink {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

/* ---------------------------------------------
*   cover
--------------------------------------------- */
.cover {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
}

@media screen and (min-width: 813px) {
    .cover {
        background-color: #fff;
    }
}

@media screen and (max-width: 812px) {
    .cover {
        background: url(/library/stories/7pj/img/bg.png) 0 0 repeat;
    }
}

.cover__txt {
    position: absolute;
    top: 28.125%;
    left: 50%;
    width: 46.5669%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.cover__btn {
    position: absolute;
    bottom: 28.125%;
    left: 50%;
    width: 11.00352%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

/*  cover-trigger
--------------------------------------------- */
.cover-trigger {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: block;
    margin: 0;
    padding: 0;
    width: 100%;
    outline: none;
    border: none;
    border-radius: 0;
    background: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    text-indent: 0.01px;
    text-overflow: '';
    cursor: pointer;

    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* ---------------------------------------------
*   download
--------------------------------------------- */
.download {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    padding: 5.28169% 3.52113%;
    background: url(/library/stories/7pj/img/bg.png) 0 0 repeat;
    text-align: left;
}

@media screen and (max-width: 812px) {
    .download {
        padding-bottom: 14.43662%;
    }
}

@media screen and (min-width: 813px) {
    .download__ttl {
        margin-bottom: 8.52273%;
    }
}

@media screen and (max-width: 812px) {
    .download__ttl {
        margin-bottom: 4.26136%;
    }
}

.download__body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    padding-left: 11.36364%;

    -webkit-box-align: center;
    align-items: center;
}

.download__img {
    margin-right: 5.34188%;
    width: 36.85897%;
}

.download__contents {
    width: 53.4188%;
}

.download__txt {
    margin-bottom: 10%;
    padding-left: 1.2%;
    width: 91.4%;
}

.download__txt--cs {
    display: inline-block;
    margin-bottom: 0;
    width: 66.39344%;
}

@media screen and (max-width: 812px) {
    .download__txt--cs {
        width: 100%;
    }
}

.download__btn {
    display: inline-block;
    width: 62%;
}

/* ---------------------------------------------
*   totop
--------------------------------------------- */
.totop {
    position: absolute;
    right: 0;
    bottom: 5%;
    left: 0;
    text-align: center;
}

.totop__link {
    display: inline-block;
    width: 31.51408%;
}

/* ---------------------------------------------
*   page-nav
--------------------------------------------- */
.page-nav {
    position: relative;
    margin: 20px auto 0;
    padding-bottom: 80px;
    width: 834px;
}

@media screen and (max-width: 812px) {
    .page-nav {
        display: none;
    }
}

.page-nav__left {
    position: absolute;
    top: 0;
    left: 0;
}

.page-nav__right {
    margin-right: auto;
    margin-left: auto;
    width: 310px;
}

.page-nav__right:after {
    display: block;
    clear: both;
    content: "";
}

.noslide .page-nav__right {
    pointer-events: none;
}

.disable .page-nav__right {
    pointer-events: none;
}

.page-nav__btn {
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
    padding-top: 105px;
    padding-top: 105px;
    height: 0;
    outline: none;
    border: none;
    border-radius: 0;
    background: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    text-indent: 0.01px;
    text-overflow: '';
    cursor: pointer;
    -webkit-transition: background .5s;
    transition: background .5s;

    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.page-nav__btn--cover {
    width: 156px;
    background: url(/library/stories/7pj/img/btn_tocover.png) 0 0 no-repeat;
}

.page-nav__btn--prev {
    float: left;
    width: 135px;
    background: url(/library/stories/7pj/img/btn_prev_on.png) 0 0 no-repeat;
}

.noslide .page-nav__btn--prev {
    background-image: url(/library/stories/7pj/img/btn_prev_off.png);
}

.disable .page-nav__btn--prev {
    background-image: url(/library/stories/7pj/img/btn_prev_off.png);
}

.page-nav__btn--prev[data-prev="none"], .page-nav__btn--prev[data-next="none"] {
    background-image: url(/library/stories/7pj/img/btn_prev_off.png);
    pointer-events: none;
}

.page-nav__btn--next {
    float: right;
    width: 135px;
    background: url(/library/stories/7pj/img/btn_next_on.png) 0 0 no-repeat;
}

.noslide .page-nav__btn--next {
    background-image: url(/library/stories/7pj/img/btn_next_off.png);
}

.disable .page-nav__btn--next {
    background-image: url(/library/stories/7pj/img/btn_next_off.png);
}

.page-nav__btn--next[data-prev="none"], .page-nav__btn--next[data-next="none"] {
    background-image: url(/library/stories/7pj/img/btn_next_off.png);
    pointer-events: none;
}

/* ---------------------------------------------
*   img
--------------------------------------------- */
.img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none;
    width: 100%;
    height: 100%;
    background-position: 0 0;
    background-size: auto 100%;
    background-repeat: no-repeat;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.current .img {
    display: block;
}

.img.loaded {
    display: block;
}

.current .img--s01 {
    -webkit-animation: sprite01 4s steps(16) 0s infinite;
    animation: sprite01 4s steps(16) 0s infinite;
}

@-webkit-keyframes sprite01 {
    to {
        background-position: -13348px 0;
    }
}

@keyframes sprite01 {
    to {
        background-position: -13348px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite01 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 16);
        }
    }
    @keyframes sprite01 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 16);
        }
    }
}

.current .img--s02 {
    -webkit-animation: sprite02 2.75s steps(11) 0s forwards, sprite02_loop 1s steps(4) 2.75s infinite;
    animation: sprite02 2.75s steps(11) 0s forwards, sprite02_loop 1s steps(4) 2.75s infinite;
}

@-webkit-keyframes sprite02 {
    to {
        background-position: -9176.75px 0;
    }
}

@keyframes sprite02 {
    to {
        background-position: -9176.75px 0;
    }
}

@-webkit-keyframes sprite02_loop {
    from {
        background-position: -5839.75px 0;
    }
    to {
        background-position: -9176.75px 0;
    }
}

@keyframes sprite02_loop {
    from {
        background-position: -5839.75px 0;
    }
    to {
        background-position: -9176.75px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite02 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 11);
        }
    }
    @keyframes sprite02 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 11);
        }
    }
    @-webkit-keyframes sprite02_loop {
        from {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 7);
        }
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 11);
        }
    }
    @keyframes sprite02_loop {
        from {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 7);
        }
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 11);
        }
    }
}

.current .img--s03 {
    -webkit-animation: sprite03 2s steps(8) 0s infinite;
    animation: sprite03 2s steps(8) 0s infinite;
}

@-webkit-keyframes sprite03 {
    to {
        background-position: -6674px 0;
    }
}

@keyframes sprite03 {
    to {
        background-position: -6674px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite03 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 8);
        }
    }
    @keyframes sprite03 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 8);
        }
    }
}

.current .img--s04 {
    -webkit-animation: sprite04 3.75s steps(15) 0s forwards, sprite04_loop 0.5s steps(2) 3.75s infinite;
    animation: sprite04 3.75s steps(15) 0s forwards, sprite04_loop 0.5s steps(2) 3.75s infinite;
}

@-webkit-keyframes sprite04 {
    to {
        background-position: -12513.75px 0;
    }
}

@keyframes sprite04 {
    to {
        background-position: -12513.75px 0;
    }
}

@-webkit-keyframes sprite04_loop {
    from {
        background-position: -10845.25px 0;
    }
    to {
        background-position: -12513.75px 0;
    }
}

@keyframes sprite04_loop {
    from {
        background-position: -10845.25px 0;
    }
    to {
        background-position: -12513.75px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite04 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 15);
        }
    }
    @keyframes sprite04 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 15);
        }
    }
    @-webkit-keyframes sprite04_loop {
        from {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 13);
        }
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 15);
        }
    }
    @keyframes sprite04_loop {
        from {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 13);
        }
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 15);
        }
    }
}

.current .img--s05-1 {
    -webkit-animation: sprite05_1 3.25s steps(13) 0s forwards, sprite05_1_loop 1s steps(4) 3.25s infinite;
    animation: sprite05_1 3.25s steps(13) 0s forwards, sprite05_1_loop 1s steps(4) 3.25s infinite;
}

@-webkit-keyframes sprite05_1 {
    to {
        background-position: -10845.25px 0;
    }
}

@keyframes sprite05_1 {
    to {
        background-position: -10845.25px 0;
    }
}

@-webkit-keyframes sprite05_1_loop {
    from {
        background-position: -7508.25px 0;
    }
    to {
        background-position: -10845.25px 0;
    }
}

@keyframes sprite05_1_loop {
    from {
        background-position: -7508.25px 0;
    }
    to {
        background-position: -10845.25px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite05_1 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 13);
        }
    }
    @keyframes sprite05_1 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 13);
        }
    }
    @-webkit-keyframes sprite05_1_loop {
        from {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 9);
        }
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 13);
        }
    }
    @keyframes sprite05_1_loop {
        from {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 9);
        }
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 13);
        }
    }
}

.current .img--s05-2 {
    -webkit-animation: sprite05_2 2.5s steps(10) 0s forwards, sprite05_2_loop 1s steps(4) 2.5s infinite;
    animation: sprite05_2 2.5s steps(10) 0s forwards, sprite05_2_loop 1s steps(4) 2.5s infinite;
}

@-webkit-keyframes sprite05_2 {
    to {
        background-position: -8342.5px 0;
    }
}

@keyframes sprite05_2 {
    to {
        background-position: -8342.5px 0;
    }
}

@-webkit-keyframes sprite05_2_loop {
    from {
        background-position: -5005.5px 0;
    }
    to {
        background-position: -8342.5px 0;
    }
}

@keyframes sprite05_2_loop {
    from {
        background-position: -5005.5px 0;
    }
    to {
        background-position: -8342.5px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite05_2 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 10);
        }
    }
    @keyframes sprite05_2 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 10);
        }
    }
    @-webkit-keyframes sprite05_2_loop {
        from {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 6);
        }
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 10);
        }
    }
    @keyframes sprite05_2_loop {
        from {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 6);
        }
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 10);
        }
    }
}

.current .img--s06 {
    -webkit-animation: sprite06 5.25s steps(21) 0s forwards, sprite06_loop 1.5s steps(6) 5.25s infinite;
    animation: sprite06 5.25s steps(21) 0s forwards, sprite06_loop 1.5s steps(6) 5.25s infinite;
}

@-webkit-keyframes sprite06 {
    to {
        background-position: -17519.25px 0;
    }
}

@keyframes sprite06 {
    to {
        background-position: -17519.25px 0;
    }
}

@-webkit-keyframes sprite06_loop {
    from {
        background-position: -12513.75px 0;
    }
    to {
        background-position: -17519.25px 0;
    }
}

@keyframes sprite06_loop {
    from {
        background-position: -12513.75px 0;
    }
    to {
        background-position: -17519.25px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite06 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 21);
        }
    }
    @keyframes sprite06 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 21);
        }
    }
    @-webkit-keyframes sprite06_loop {
        from {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 15);
        }
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 21);
        }
    }
    @keyframes sprite06_loop {
        from {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 15);
        }
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 21);
        }
    }
}

.current .img--s07 {
    -webkit-animation: sprite07 3.25s steps(13) 0s forwards, sprite07_loop 1s steps(4) 3.25s infinite;
    animation: sprite07 3.25s steps(13) 0s forwards, sprite07_loop 1s steps(4) 3.25s infinite;
}

@-webkit-keyframes sprite07 {
    to {
        background-position: -10845.25px 0;
    }
}

@keyframes sprite07 {
    to {
        background-position: -10845.25px 0;
    }
}

@-webkit-keyframes sprite07_loop {
    from {
        background-position: -7508.25px 0;
    }
    to {
        background-position: -10845.25px 0;
    }
}

@keyframes sprite07_loop {
    from {
        background-position: -7508.25px 0;
    }
    to {
        background-position: -10845.25px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite07 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 13);
        }
    }
    @keyframes sprite07 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 13);
        }
    }
    @-webkit-keyframes sprite07_loop {
        from {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 9);
        }
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 13);
        }
    }
    @keyframes sprite07_loop {
        from {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 9);
        }
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 13);
        }
    }
}

.current .img--s08-1 {
    -webkit-animation: sprite08_1 1s steps(4) 0s infinite;
    animation: sprite08_1 1s steps(4) 0s infinite;
}

@-webkit-keyframes sprite08_1 {
    to {
        background-position: -3337px 0;
    }
}

@keyframes sprite08_1 {
    to {
        background-position: -3337px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite08_1 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 4);
        }
    }
    @keyframes sprite08_1 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 4);
        }
    }
}

.current .img--s08-2 {
    -webkit-animation: sprite08_2 1.25s steps(5) 0s infinite;
    animation: sprite08_2 1.25s steps(5) 0s infinite;
}

@-webkit-keyframes sprite08_2 {
    to {
        background-position: -4171.25px 0;
    }
}

@keyframes sprite08_2 {
    to {
        background-position: -4171.25px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite08_2 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 5);
        }
    }
    @keyframes sprite08_2 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 5);
        }
    }
}

.current .img--s08-3 {
    -webkit-animation: sprite08_3 1.25s steps(5) 0s infinite;
    animation: sprite08_3 1.25s steps(5) 0s infinite;
}

@-webkit-keyframes sprite08_3 {
    to {
        background-position: -4171.25px 0;
    }
}

@keyframes sprite08_3 {
    to {
        background-position: -4171.25px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite08_3 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 5);
        }
    }
    @keyframes sprite08_3 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 5);
        }
    }
}

.current .img--s08-4 {
    -webkit-animation: sprite08_4 1.25s steps(5) 0s infinite;
    animation: sprite08_4 1.25s steps(5) 0s infinite;
}

@-webkit-keyframes sprite08_4 {
    to {
        background-position: -4171.25px 0;
    }
}

@keyframes sprite08_4 {
    to {
        background-position: -4171.25px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite08_4 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 5);
        }
    }
    @keyframes sprite08_4 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 5);
        }
    }
}

.current .img--s08-5 {
    -webkit-animation: sprite08_5 2s steps(8) 0s infinite;
    animation: sprite08_5 2s steps(8) 0s infinite;
}

@-webkit-keyframes sprite08_5 {
    to {
        background-position: -6674px 0;
    }
}

@keyframes sprite08_5 {
    to {
        background-position: -6674px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite08_5 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 8);
        }
    }
    @keyframes sprite08_5 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 8);
        }
    }
}

.current .img--s09 {
    -webkit-animation: sprite09 2.25s steps(9) 0s forwards, sprite09_loop 1s steps(4) 2.25s infinite;
    animation: sprite09 2.25s steps(9) 0s forwards, sprite09_loop 1s steps(4) 2.25s infinite;
}

@-webkit-keyframes sprite09 {
    to {
        background-position: -7508.25px 0;
    }
}

@keyframes sprite09 {
    to {
        background-position: -7508.25px 0;
    }
}

@-webkit-keyframes sprite09_loop {
    from {
        background-position: -4171.25px 0;
    }
    to {
        background-position: -7508.25px 0;
    }
}

@keyframes sprite09_loop {
    from {
        background-position: -4171.25px 0;
    }
    to {
        background-position: -7508.25px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite09 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 9);
        }
    }
    @keyframes sprite09 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 9);
        }
    }
    @-webkit-keyframes sprite09_loop {
        from {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 5);
        }
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 9);
        }
    }
    @keyframes sprite09_loop {
        from {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 5);
        }
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 9);
        }
    }
}

.current .img--s10 {
    -webkit-animation: sprite10 1.75s steps(7) 0s infinite;
    animation: sprite10 1.75s steps(7) 0s infinite;
}

@-webkit-keyframes sprite10 {
    to {
        background-position: -5839.75px 0;
    }
}

@keyframes sprite10 {
    to {
        background-position: -5839.75px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite10 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 7);
        }
    }
    @keyframes sprite10 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 7);
        }
    }
}

.current .img--s11 {
    -webkit-animation: sprite11 3.25s steps(13) 0s infinite;
    animation: sprite11 3.25s steps(13) 0s infinite;
}

@-webkit-keyframes sprite11 {
    to {
        background-position: -10845.25px 0;
    }
}

@keyframes sprite11 {
    to {
        background-position: -10845.25px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite11 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 13);
        }
    }
    @keyframes sprite11 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 13);
        }
    }
}

.current .img--s12 {
    -webkit-animation: sprite12 3.25s steps(13) 0s infinite;
    animation: sprite12 3.25s steps(13) 0s infinite;
}

@-webkit-keyframes sprite12 {
    to {
        background-position: -10845.25px 0;
    }
}

@keyframes sprite12 {
    to {
        background-position: -10845.25px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite12 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 13);
        }
    }
    @keyframes sprite12 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 13);
        }
    }
}

.current .img--s13 {
    -webkit-animation: sprite13 3.25s steps(13) 0s infinite;
    animation: sprite13 3.25s steps(13) 0s infinite;
}

@-webkit-keyframes sprite13 {
    to {
        background-position: -10845.25px 0;
    }
}

@keyframes sprite13 {
    to {
        background-position: -10845.25px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite13 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 13);
        }
    }
    @keyframes sprite13 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 13);
        }
    }
}

.current .img--s14 {
    -webkit-animation: sprite14 4.5s steps(18) 0s forwards, sprite14_loop 1.75s steps(7) 4.5s infinite;
    animation: sprite14 4.5s steps(18) 0s forwards, sprite14_loop 1.75s steps(7) 4.5s infinite;
}

@-webkit-keyframes sprite14 {
    to {
        background-position: -15016.5px 0;
    }
}

@keyframes sprite14 {
    to {
        background-position: -15016.5px 0;
    }
}

@-webkit-keyframes sprite14_loop {
    from {
        background-position: -9176.75px 0;
    }
    to {
        background-position: -15016.5px 0;
    }
}

@keyframes sprite14_loop {
    from {
        background-position: -9176.75px 0;
    }
    to {
        background-position: -15016.5px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite14 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 18);
        }
    }
    @keyframes sprite14 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 18);
        }
    }
    @-webkit-keyframes sprite14_loop {
        from {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 11);
        }
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 18);
        }
    }
    @keyframes sprite14_loop {
        from {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 11);
        }
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 18);
        }
    }
}

.current .img--s15 {
    -webkit-animation: sprite15 2.25s steps(9) 0s infinite;
    animation: sprite15 2.25s steps(9) 0s infinite;
}

@-webkit-keyframes sprite15 {
    to {
        background-position: -7508.25px 0;
    }
}

@keyframes sprite15 {
    to {
        background-position: -7508.25px 0;
    }
}

@media screen and (max-width: 812px) {
    @-webkit-keyframes sprite15 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 9);
        }
    }
    @keyframes sprite15 {
        to {
            background-position-x: calc((var(--vh, 1vh) * 100 + 1px) * -1.775 * 9);
        }
    }
}

/* ---------------------------------------------
*   txt
--------------------------------------------- */
.txt {
    position: absolute;
    margin-right: 50px;
    margin-left: -50px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    text-align: center;
    opacity: 0;
    -webkit-transition: .5s;
    transition: .5s;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    pointer-events: none;

    -moz-user-select: -moz-none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.txt img {
    pointer-events: none;

    -moz-user-select: -moz-none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.txt.show {
    margin-right: 0;
    margin-left: 0;
    opacity: 1;
}

.txt--1 {
    bottom: 7.8125%;
    left: 4.40141%;
    width: 34.41901%;
}

.txt--2 {
    bottom: 7.8125%;
    left: 4.40141%;
    width: 24.64789%;
}

.txt--3 {
    bottom: 7.8125%;
    left: 17.16549%;
    width: 30.72183%;
}

.txt--4 {
    bottom: 7.8125%;
    left: 17.16549%;
    width: 30.10563%;
}

.txt--5 {
    bottom: 7.8125%;
    left: 11.8838%;
    width: 50.70423%;
}

.txt--6 {
    right: 27.72887%;
    bottom: 24.21875%;
    width: 15.22887%;
}

.txt--7 {
    bottom: 7.8125%;
    left: 50%;
    width: 60.21127%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--8 {
    bottom: 7.8125%;
    left: 4.40141%;
    width: 39.7007%;
}

.txt--9-1 {
    top: 10.9375%;
    left: 14.52465%;
    width: 45.86268%;
}

.txt--9-2 {
    right: 16.72535%;
    bottom: 7.03125%;
    width: 32.30634%;
}

.txt--11 {
    top: 9.375%;
    left: 50%;
    width: 50.08803%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--12 {
    top: 9.375%;
    left: 50%;
    width: 69.10211%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--13 {
    top: 6.25%;
    left: 50%;
    width: 52.99296%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--14 {
    top: 6.25%;
    left: 50%;
    width: 68.75%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--15 {
    top: 9.375%;
    left: 50%;
    width: 45.24648%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--16-1 {
    top: 5.46875%;
    left: 50%;
    width: 76.67254%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--16-2 {
    bottom: 10.9375%;
    left: 10.56338%;
    width: 25.96831%;
}

.txt--17 {
    bottom: 5.46875%;
    left: 50%;
    width: 34.85915%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--18-1 {
    top: 3.90625%;
    left: 3.08099%;
    width: 37.23592%;
}

.txt--18-2 {
    bottom: 3.125%;
    left: 1.76056%;
    width: 35.2993%;
}

.txt--19-1 {
    top: 31.25%;
    left: 17.60563%;
    width: 24.55986%;
}

.txt--19-2 {
    top: 20.3125%;
    right: 10.56338%;
    width: 20.33451%;
}

.txt--20 {
    top: 4.6875%;
    left: 1.76056%;
    width: 38.1162%;
}

.txt--21-1 {
    top: 14.0625%;
    left: 11.8838%;
    width: 41.81338%;
}

.txt--21-2 {
    top: 20.3125%;
    right: 12.32394%;
    width: 16.28521%;
}

.txt--22 {
    top: 4.6875%;
    left: 2.64085%;
    width: 39.08451%;
}

.txt--23-1 {
    top: 7.03125%;
    left: 50%;
    width: 56.77817%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--23-2 {
    bottom: 6.25%;
    left: 50%;
    width: 55.01761%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s2-1 {
    top: 7.03125%;
    left: 3.96127%;
    width: 65.14085%;
}

.txt--s2-2 {
    top: 7.03125%;
    left: 3.96127%;
    width: 57.57042%;
}

.txt--s2-3-1 {
    top: 7.03125%;
    left: 3.96127%;
    width: 68.1338%;
}

.txt--s2-3-2 {
    bottom: 6.25%;
    left: 3.96127%;
    width: 41.5493%;
}

.txt--s2-4-1 {
    top: 6.25%;
    left: 42.25352%;
    width: 18.1338%;
}

.txt--s2-4-2 {
    bottom: 7.03125%;
    left: 3.96127%;
    width: 60.2993%;
}

.txt--s2-5-1 {
    top: 41.40625%;
    left: 26.40845%;
    width: 26.32042%;
}

.txt--s2-5-2 {
    bottom: 7.03125%;
    left: 3.96127%;
    width: 69.98239%;
}

.txt--s2-6 {
    top: 7.03125%;
    left: 50%;
    width: 50.08803%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s2-7 {
    top: 7.03125%;
    left: 50%;
    width: 61.79577%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s2-8 {
    top: 7.03125%;
    left: 50%;
    width: 54.48944%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s2-9 {
    top: 7.03125%;
    left: 50%;
    width: 63.46831%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s2-10 {
    top: 7.03125%;
    left: 50%;
    width: 70.33451%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s2-11-1 {
    top: 3.125%;
    left: 50%;
    width: 76.67254%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s2-11-2 {
    bottom: 11.71875%;
    left: 18.04577%;
    width: 18.04577%;
}

.txt--s2-12 {
    right: 7.92254%;
    bottom: 10.9375%;
    width: 40.40493%;
}

.txt--s2-13-1 {
    top: 3.90625%;
    left: 2.64085%;
    width: 40.3169%;
}

.txt--s2-13-2 {
    bottom: 7.03125%;
    left: 3.96127%;
    width: 45.9507%;
}

.txt--s2-14-1 {
    top: 33.59375%;
    left: 8.80282%;
    width: 24.55986%;
}

.txt--s2-14-2 {
    top: 10.15625%;
    right: 5.72183%;
    width: 19.45423%;
}

.txt--s2-15 {
    top: 7.03125%;
    left: 3.96127%;
    z-index: 99999;
    width: 65.75704%;
}

.txt--s2-16 {
    bottom: 7.03125%;
    left: 3.96127%;
    width: 42.42958%;
}

.txt--s2-17-1 {
    top: 7.03125%;
    left: 50%;
    width: 57.13028%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s2-17-2 {
    bottom: 7.03125%;
    left: 50%;
    width: 62.58803%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s3-1 {
    top: 6.25%;
    left: 4.13732%;
    width: 55.36972%;
}

.txt--s3-2 {
    bottom: 7.03125%;
    left: 3.96127%;
    width: 55.89789%;
}

.txt--s3-3 {
    bottom: 7.8125%;
    left: 3.96127%;
    width: 51.84859%;
}

.txt--s3-4 {
    top: 7.8125%;
    right: 4.40141%;
    width: 46.83099%;
}

.txt--s3-5 {
    bottom: 5.46875%;
    left: 3.96127%;
    width: 39.34859%;
}

.txt--s3-6-1 {
    top: 6.25%;
    left: 3.96127%;
    width: 39.52465%;
}

.txt--s3-6-2 {
    bottom: 6.25%;
    left: 3.52113%;
    width: 75.70423%;
}

.txt--s3-7-1 {
    top: 7.8125%;
    left: 4.84155%;
    width: 55.89789%;
}

.txt--s3-7-2 {
    bottom: 6.25%;
    left: 3.96127%;
    width: 48.76761%;
}

.txt--s3-8 {
    top: 7.03125%;
    left: 50%;
    width: 50.08803%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s3-9 {
    top: 7.03125%;
    left: 50%;
    width: 87.32394%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s3-10 {
    top: 7.03125%;
    left: 50%;
    width: 54.40141%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s3-11 {
    top: 7.03125%;
    left: 50%;
    width: 58.01056%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s3-12 {
    top: 7.03125%;
    left: 50%;
    width: 58.89085%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s3-13-1 {
    top: 3.90625%;
    left: 50%;
    width: 76.67254%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s3-13-2 {
    bottom: 11.71875%;
    left: 10.56338%;
    width: 25.96831%;
}

.txt--s3-14 {
    right: 7.92254%;
    bottom: 10.15625%;
    width: 40.40493%;
}

.txt--s3-15-1 {
    top: 3.90625%;
    left: 2.64085%;
    width: 40.3169%;
}

.txt--s3-15-2 {
    bottom: 7.8125%;
    left: 3.96127%;
    width: 68.04577%;
}

.txt--s3-16-1 {
    top: 27.34375%;
    left: 8.80282%;
    width: 24.55986%;
}

.txt--s3-16-2 {
    top: 14.0625%;
    right: 7.48239%;
    width: 19.45423%;
}

.txt--s3-17-1 {
    top: 7.8125%;
    left: 3.96127%;
    width: 57.65845%;
}

.txt--s3-17-2 {
    bottom: 6.25%;
    left: 3.96127%;
    width: 48.15141%;
}

.txt--s3-18 {
    bottom: 6.25%;
    left: 6.16197%;
    width: 76.23239%;
}

.txt--s3-19-1 {
    top: 7.03125%;
    left: 50%;
    width: 57.13028%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s3-19-2 {
    bottom: 7.03125%;
    left: 50%;
    width: 66.19718%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s4-1-1 {
    top: 6.25%;
    left: 4.22535%;
    width: 63.46831%;
}

.txt--s4-1-2 {
    bottom: 7.03125%;
    left: 4.22535%;
    width: 36.53169%;
}

.txt--s4-2 {
    bottom: 6.25%;
    left: 4.22535%;
    width: 41.28521%;
}

.txt--s4-3 {
    top: 25%;
    left: 4.22535%;
    width: 42.16549%;
}

.txt--s4-4-1 {
    top: 7.03125%;
    left: 4.22535%;
    width: 73.32746%;
}

.txt--s4-4-2 {
    bottom: 9.375%;
    left: 4.22535%;
    width: 81.07394%;
}

.txt--s4-5-1 {
    top: 6.25%;
    left: 3.96127%;
    width: 65.9331%;
}

.txt--s4-5-2 {
    bottom: 6.25%;
    left: 3.96127%;
    width: 65.9331%;
}

.txt--s4-6 {
    bottom: 7.5%;
    left: 4.22535%;
    width: 72.97535%;
}

.txt--s4-9-1 {
    top: 7.8125%;
    left: 7.74648%;
    width: 22.00704%;
}

.txt--s4-9-2 {
    bottom: 7.03125%;
    left: 8.97887%;
    width: 79.0493%;
}

.txt--s4-10 {
    bottom: 6.25%;
    left: 9.50704%;
    width: 78.96127%;
}

.txt--s4-11 {
    top: 6.5625%;
    left: 13.20423%;
    width: 74.29577%;
}

.txt--s4-12 {
    top: 6.5625%;
    left: 5.80986%;
    width: 88.82042%;
}

.txt--s4-13 {
    top: 6.5625%;
    left: 8.80282%;
    width: 82.83451%;
}

.txt--s4-14-1 {
    top: 3.90625%;
    left: 50%;
    width: 76.58451%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s4-14-2 {
    bottom: 10.9375%;
    left: 10.56338%;
    width: 25.96831%;
}

.txt--s4-15-1 {
    right: 8.09859%;
    bottom: 10.9375%;
    width: 39.7007%;
}

.txt--s4-16-1-1 {
    top: 4.0625%;
    left: 2.64085%;
    width: 40.3169%;
}

.txt--s4-16-1-2 {
    bottom: 8.75%;
    left: 50%;
    width: 80.45775%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s4-17-1-1 {
    top: 27.1875%;
    left: 3.96127%;
    width: 24.55986%;
}

.txt--s4-17-1-2 {
    top: 14.0625%;
    right: 18.66197%;
    width: 19.45423%;
}

.txt--s4-15-2-1 {
    top: 7.03125%;
    left: 3.96127%;
    width: 58.18662%;
}

.txt--s4-15-2-2 {
    bottom: 9.0625%;
    left: 3.96127%;
    width: 72.71127%;
}

.txt--s4-16-2-1 {
    top: 6.5625%;
    left: 3.96127%;
    width: 62.85211%;
}

.txt--s4-16-2-2 {
    bottom: 8.125%;
    left: 3.96127%;
    width: 72.7993%;
}

.txt--s4-17-2-1 {
    top: 6.25%;
    left: 3.96127%;
    width: 88.02817%;
}

.txt--s4-17-2-2 {
    bottom: 7.1875%;
    left: 3.96127%;
    width: 61.53169%;
}

.txt--s4-18-1 {
    top: 6.5625%;
    left: 50%;
    width: 56.42606%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.txt--s4-18-2 {
    bottom: 6.25%;
    left: 18.48592%;
    width: 69.71831%;
}

/* ---------------------------------------------
*   select
--------------------------------------------- */
.select {
    position: absolute;
    width: 100%;
    height: 100%;
}

@media screen and (min-width: 813px) {
    .select {
        top: 50%;
        left: 50%;
        max-width: 1136px;
        max-height: 640px;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
}

@media screen and (max-width: 812px) {
    .select {
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }
}

.select__item {
    position: absolute;
    right: 50%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.select__item--1 {
    top: 22%;
}

@media screen and (min-width: 813px) {
    .select__item--1 {
        width: 18.04577%;
        height: 45%;
        -webkit-transform: translateX(-67%);
        transform: translateX(-67%);
    }
}

@media screen and (max-width: 812px) {
    .select__item--1 {
        width: calc(var(--vh, 1vh) * 30);
        height: calc(var(--vh, 1vh) * 41);
        -webkit-transform: translateX(calc(var(--vh, 1vh) * -21));
        transform: translateX(calc(var(--vh, 1vh) * -21));
    }
}

@media screen and (min-width: 813px) {
    .select__item--2 {
        top: 22%;
        width: 18.04577%;
        height: 45%;
        -webkit-transform: translateX(44%);
        transform: translateX(44%);
    }
}

@media screen and (max-width: 812px) {
    .select__item--2 {
        top: 27%;
        width: calc(var(--vh, 1vh) * 26);
        height: calc(var(--vh, 1vh) * 34);
        -webkit-transform: translateX(calc(var(--vh, 1vh) * 13));
        transform: translateX(calc(var(--vh, 1vh) * 13));
    }
}

@media screen and (min-width: 813px) {
    .select__item--3 {
        top: 22%;
        width: 18.04577%;
        height: 45%;
        -webkit-transform: translateX(160%);
        transform: translateX(160%);
    }
}

@media screen and (max-width: 812px) {
    .select__item--3 {
        top: 29%;
        width: calc(var(--vh, 1vh) * 28);
        height: calc(var(--vh, 1vh) * 31);
        -webkit-transform: translateX(calc(var(--vh, 1vh) * 50.5));
        transform: translateX(calc(var(--vh, 1vh) * 50.5));
    }
}

@media screen and (min-width: 813px) {
    .select__item--s2-1 {
        top: 23%;
        width: 18.04577%;
        height: 37%;
        -webkit-transform: translateX(-91%);
        transform: translateX(-91%);
    }
}

@media screen and (max-width: 812px) {
    .select__item--s2-1 {
        top: 25%;
        width: calc(var(--vh, 1vh) * 30);
        height: calc(var(--vh, 1vh) * 34);
        -webkit-transform: translateX(calc(var(--vh, 1vh) * -30));
        transform: translateX(calc(var(--vh, 1vh) * -30));
    }
}

@media screen and (min-width: 813px) {
    .select__item--s2-2 {
        top: 23%;
        width: 18.04577%;
        height: 37%;
        -webkit-transform: translateX(52%);
        transform: translateX(52%);
    }
}

@media screen and (max-width: 812px) {
    .select__item--s2-2 {
        top: 25%;
        width: calc(var(--vh, 1vh) * 30);
        height: calc(var(--vh, 1vh) * 34);
        -webkit-transform: translateX(calc(var(--vh, 1vh) * 16));
        transform: translateX(calc(var(--vh, 1vh) * 16));
    }
}

@media screen and (min-width: 813px) {
    .select__item--s2-3 {
        top: 23%;
        width: 18.04577%;
        height: 37%;
        -webkit-transform: translateX(189%);
        transform: translateX(189%);
    }
}

@media screen and (max-width: 812px) {
    .select__item--s2-3 {
        top: 25%;
        width: calc(var(--vh, 1vh) * 30);
        height: calc(var(--vh, 1vh) * 34);
        -webkit-transform: translateX(calc(var(--vh, 1vh) * 60));
        transform: translateX(calc(var(--vh, 1vh) * 60));
    }
}

@media screen and (min-width: 813px) {
    .select__item--s3-1 {
        top: 23%;
        width: 18.04577%;
        height: 37%;
        -webkit-transform: translateX(-125%);
        transform: translateX(-125%);
    }
}

@media screen and (max-width: 812px) {
    .select__item--s3-1 {
        top: 25%;
        width: calc(var(--vh, 1vh) * 30);
        height: calc(var(--vh, 1vh) * 34);
        -webkit-transform: translateX(calc(var(--vh, 1vh) * -41));
        transform: translateX(calc(var(--vh, 1vh) * -41));
    }
}

@media screen and (min-width: 813px) {
    .select__item--s3-2 {
        top: 23%;
        width: 18.04577%;
        height: 37%;
        -webkit-transform: translateX(49%);
        transform: translateX(49%);
    }
}

@media screen and (max-width: 812px) {
    .select__item--s3-2 {
        top: 25%;
        width: calc(var(--vh, 1vh) * 30);
        height: calc(var(--vh, 1vh) * 34);
        -webkit-transform: translateX(calc(var(--vh, 1vh) * 16));
        transform: translateX(calc(var(--vh, 1vh) * 16));
    }
}

@media screen and (min-width: 813px) {
    .select__item--s3-3 {
        top: 23%;
        width: 18.04577%;
        height: 37%;
        -webkit-transform: translateX(225%);
        transform: translateX(225%);
    }
}

@media screen and (max-width: 812px) {
    .select__item--s3-3 {
        top: 25%;
        width: calc(var(--vh, 1vh) * 30);
        height: calc(var(--vh, 1vh) * 34);
        -webkit-transform: translateX(calc(var(--vh, 1vh) * 70));
        transform: translateX(calc(var(--vh, 1vh) * 70));
    }
}

@media screen and (min-width: 813px) {
    .select__item--s4-1 {
        top: 16%;
        width: 18.04577%;
        height: 37%;
        -webkit-transform: translateX(-98%);
        transform: translateX(-98%);
    }
}

@media screen and (max-width: 812px) {
    .select__item--s4-1 {
        top: 17%;
        width: calc(var(--vh, 1vh) * 30);
        height: calc(var(--vh, 1vh) * 34);
        -webkit-transform: translateX(calc(var(--vh, 1vh) * -32));
        transform: translateX(calc(var(--vh, 1vh) * -32));
    }
}

@media screen and (min-width: 813px) {
    .select__item--s4-2 {
        top: 16%;
        width: 18.04577%;
        height: 37%;
        -webkit-transform: translateX(51%);
        transform: translateX(51%);
    }
}

@media screen and (max-width: 812px) {
    .select__item--s4-2 {
        top: 17%;
        width: calc(var(--vh, 1vh) * 30);
        height: calc(var(--vh, 1vh) * 34);
        -webkit-transform: translateX(calc(var(--vh, 1vh) * 16));
        transform: translateX(calc(var(--vh, 1vh) * 16));
    }
}

@media screen and (min-width: 813px) {
    .select__item--s4-3 {
        top: 16%;
        width: 18.04577%;
        height: 37%;
        -webkit-transform: translateX(204%);
        transform: translateX(204%);
    }
}

@media screen and (max-width: 812px) {
    .select__item--s4-3 {
        top: 17%;
        width: calc(var(--vh, 1vh) * 30);
        height: calc(var(--vh, 1vh) * 34);
        -webkit-transform: translateX(calc(var(--vh, 1vh) * 65));
        transform: translateX(calc(var(--vh, 1vh) * 65));
    }
}

.select__btn {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: block;
    margin: 0;
    padding: 0;
    width: 100%;
    outline: none;
    border: none;
    border-radius: 0;
    background: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    text-indent: 0.01px;
    text-overflow: '';
    cursor: pointer;

    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.select__matching {
    position: absolute;
    top: 50%;
    left: 50%;
    opacity: 0;
    -webkit-transition: opacity .3s;
    transition: opacity .3s;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.select__matching.show {
    opacity: 1;
}

.select__matching--correct {
    width: 87.31707%;
}

.select__matching--incorrect {
    width: 80%;
}

/* ---------------------------------------------
*   pagetop
--------------------------------------------- */
.pagetop-outer {
    position: relative;
}

.pagetop {
    position: absolute;
    right: 32px;
    bottom: 43px;
    z-index: 99999;
    -webkit-transition: -webkit-transform 2s ease;
    transition: -webkit-transform 2s ease;
    transition: transform 2s ease;
    transition: transform 2s ease, -webkit-transform 2s ease;
    -webkit-transform: translateX(150%);
    transform: translateX(150%);
}

@media screen and (max-width: 812px) {
    .pagetop {
        right: 4.375vw;
        bottom: 6.25vw;
    }
}

.is-show .pagetop {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

.is-fixed .pagetop {
    position: fixed;
}

.pagetop__link {
    display: inline-block;
    width: 121px;
    -webkit-animation: yearold_totop_a 4s linear infinite both;
    animation: yearold_totop_a 4s linear infinite both;
}

@media screen and (max-width: 812px) {
    .pagetop__link {
        width: 18.90625vw;
    }
}

@-webkit-keyframes yearold_totop_a {
    0% {
        -webkit-transform: translateX(-10px) rotate(-1deg);
        transform: translateX(-10px) rotate(-1deg);
    }
    40% {
        -webkit-transform: translateX(8px) rotate(1deg);
        transform: translateX(8px) rotate(1deg);
    }
    50% {
        -webkit-transform: translateX(10px) rotate(1deg);
        transform: translateX(10px) rotate(1deg);
    }
    90% {
        -webkit-transform: translateX(-8px) rotate(-1deg);
        transform: translateX(-8px) rotate(-1deg);
    }
    100% {
        -webkit-transform: translateX(-10px) rotate(-1deg);
        transform: translateX(-10px) rotate(-1deg);
    }
}

@keyframes yearold_totop_a {
    0% {
        -webkit-transform: translateX(-10px) rotate(-1deg);
        transform: translateX(-10px) rotate(-1deg);
    }
    40% {
        -webkit-transform: translateX(8px) rotate(1deg);
        transform: translateX(8px) rotate(1deg);
    }
    50% {
        -webkit-transform: translateX(10px) rotate(1deg);
        transform: translateX(10px) rotate(1deg);
    }
    90% {
        -webkit-transform: translateX(-8px) rotate(-1deg);
        transform: translateX(-8px) rotate(-1deg);
    }
    100% {
        -webkit-transform: translateX(-10px) rotate(-1deg);
        transform: translateX(-10px) rotate(-1deg);
    }
}

.pagetop__link img {
    width: 100%;
    -webkit-animation: yearold_totop_img 1s ease infinite alternate both;
    animation: yearold_totop_img 1s ease infinite alternate both;
}

@-webkit-keyframes yearold_totop_img {
    0% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes yearold_totop_img {
    0% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

/* ---------------------------------------------
*   progressbar
--------------------------------------------- */
.progressbar {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 99999;
    display: none;
    width: 100%;
    height: 2.5%;
    background-color: #bfbfbf;
}

.progressbar__bar {
    width: 0;
    height: 100%;
    background: repeating-linear-gradient(-45deg, #de4873, #de4873 8px, #e4688b 0, #e4688b 16px);
    -webkit-transition-property: width;
    transition-property: width;
}

/* ---------------------------------------------
*   float
--------------------------------------------- */
.float {
    position: absolute;
    z-index: 99999;
    -webkit-transition: -webkit-transform 2s ease;
    transition: -webkit-transform 2s ease;
    transition: transform 2s ease;
    transition: transform 2s ease, -webkit-transform 2s ease;
    -webkit-transform: translateX(150%);
    transform: translateX(150%);
    -webkit-animation: yearold_totop_a 4s linear infinite both;
    animation: yearold_totop_a 4s linear infinite both;
}

.float--s2-1 {
    bottom: 5.46875%;
    left: 23.32746%;
    width: 53.08099%;
}

.float--s2-2 {
    right: -1.58451%;
    bottom: 18.75%;
    width: 34.41901%;
}

.float img {
    -webkit-animation: yearold_totop_img 1s ease infinite alternate both;
    animation: yearold_totop_img 1s ease infinite alternate both;
}

@keyframes yearold_totop_img {
    0% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

/* ---------------------------------------------
*   fade
--------------------------------------------- */
.fade--01 {
    background: url(/library/stories/7pj/img/sprite3/s06-1.png) 0 0 no-repeat;
    background-size: 100%;
    opacity: 1;
}

.current .fade--01 {
    -webkit-animation: fadeOut 2s linear infinite;
    animation: fadeOut 2s linear infinite;
}

.fade--02 {
    background: url(/library/stories/7pj/img/sprite3/s06-2.png) 0 0 no-repeat;
    background-size: 100%;
    opacity: 0;
}

.current .fade--02 {
    -webkit-animation: fadeIn 2s linear infinite;
    animation: fadeIn 2s linear infinite;
}

@-webkit-keyframes fadeOut {
    0% {
        opacity: 1;
    }
    90% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1;
    }
    90% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    90% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    90% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}

/* ==========================================================
*
*   page
*
========================================================== */
/* ---------------------------------------------
*   index-head
--------------------------------------------- */
.index-head {
    margin-top: -57px;
    margin-bottom: 33px;
}

@media screen and (max-width: 812px) {
    .index-head {
        margin-top: 10px;
        margin-bottom: 4.84375vw;
    }
}

.index-head__container {
    text-align: center;
}

@media screen and (max-width: 812px) {
    .index-head__ttl {
        display: inline-block;
        width: 83.4375%;
    }
    .index-head__ttl img {
        width: 100%;
    }
}

/* ---------------------------------------------
*   index-img
--------------------------------------------- */
.index-img {
    margin-bottom: 28px;
}

@media screen and (max-width: 812px) {
    .index-img {
        margin-bottom: 9.375vw;
    }
}

.index-img__container {
    text-align: center;
}

.index-img__item {
    padding-right: 101px;
}

@media screen and (max-width: 812px) {
    .index-img__item {
        display: inline-block;
        padding-right: 4.6875vw;
        width: 59.84375vw;
    }
}

/* ---------------------------------------------
*   index-lead
--------------------------------------------- */
.index-lead {
    margin-bottom: 58px;
}

@media screen and (max-width: 812px) {
    .index-lead {
        margin-bottom: 7.03125vw;
    }
}

.index-lead__txt {
    text-align: center;
}

.index-lead__line {
    display: inline-block;
    margin-bottom: 20px;
    padding-bottom: 10px;
    background: url(/library/stories/7pj/img/index/bd_color.png) 50% 100% repeat-x;
    letter-spacing: 0.06em;
    font-weight: bold;
    font-size: 2rem;
    line-height: 1;
}

@media screen and (max-width: 812px) {
    .index-lead__line {
        margin-bottom: 4.0625vw;
        padding-bottom: 2.5vw;
        font-size: 2.8rem;
    }
}

/* ---------------------------------------------
*   index-story
--------------------------------------------- */
.index-story {
    padding-bottom: 90px;
}

@media screen and (max-width: 812px) {
    .index-story {
        padding-bottom: 39.0625vw;
    }
}

.index-story__container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    margin-right: auto;
    margin-left: auto;
    width: 833px;

    -webkit-box-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

@media screen and (max-width: 812px) {
    .index-story__container {
        display: block;
        width: auto;
    }
}

/*  index-story-sec
--------------------------------------------- */
.index-story-sec {
    width: 237px;
    text-align: center;
}

@media screen and (max-width: 812px) {
    .index-story-sec {
        margin-top: 15.625%;
        margin-right: auto;
        margin-left: auto;
        width: 100%;
    }
    .index-story-sec:first-of-type {
        margin-top: 0;
    }
}

.index-story-sec__ttl {
    position: relative;
    z-index: 1;
    height: 55px;
}

@media screen and (max-width: 812px) {
    .index-story-sec__ttl {
        height: 10.3125vw;
    }
}

.index-story-sec__ttl img {
    height: 100%;
}

.index-story-sec__img {
    position: relative;
    margin-top: -7px;
}

@media screen and (max-width: 812px) {
    .index-story-sec__img {
        margin-top: 0;
        margin-right: auto;
        margin-left: auto;
        width: 55.78125vw;
    }
}

.index-story-sec__img--2 {
    margin-top: -35px;
}

@media screen and (max-width: 812px) {
    .index-story-sec__img--2 {
        margin-top: -5.9375vw;
    }
}

.index-story-sec__img--3 {
    margin-top: 9px;
    width: 97%;
}

@media screen and (max-width: 812px) {
    .index-story-sec__img--3 {
        width: 54.53125vw;
    }
}

.index-story-sec__txt {
    position: relative;
    top: -10px;
    display: inline-block;
}

@media screen and (max-width: 812px) {
    .index-story-sec__txt {
        position: static;
    }
}

.index-story-sec__txt--1 {
    width: 219px;
}

@media screen and (max-width: 812px) {
    .index-story-sec__txt--1 {
        width: 59.84375vw;
    }
}

.index-story-sec__txt--2 {
    width: 229px;
}

@media screen and (max-width: 812px) {
    .index-story-sec__txt--2 {
        width: 62.5vw;
    }
}

.index-story-sec__txt--3 {
    top: 8px;
    width: 202px;
}

@media screen and (max-width: 812px) {
    .index-story-sec__txt--3 {
        margin-top: 3.90625vw;
        width: 55.46875vw;
    }
}

.index-story-sec__txt--4 {
    width: 235px;
}

@media screen and (max-width: 812px) {
    .index-story-sec__txt--4 {
        width: 64.53125vw;
    }
}

.index-story-sec__txt--cs {
    width: 170px;
}

@media screen and (max-width: 812px) {
    .index-story-sec__txt--cs {
        width: 47.1875vw;
    }
}

.index-story-sec__link {
    position: absolute;
    bottom: 20px;
    left: -40px;
    width: 109px;
}

@media screen and (max-width: 812px) {
    .index-story-sec__link {
        bottom: 4.6875vw;
        left: -8.75vw;
        width: 25.625vw;
    }
}

@media screen and (min-width: 813px) {
    .index-story-sec__link {
        -webkit-transition: opacity 300ms;
        transition: opacity 300ms;
    }
    .index-story-sec__link:hover {
        opacity: 0.8;
    }
}

.index-story-sec__link--3 {
    bottom: 2px;
}

/* ==========================================================
*
*   utility
*
========================================================== */
/* ---------------------------------------------
*   margin-top
--------------------------------------------- */
.mgt-pc--0 {
    margin-top: 0 !important;
}

.mgt-pc--5 {
    margin-top: 5px !important;
}

.mgt-pc--10 {
    margin-top: 10px !important;
}

.mgt-pc--15 {
    margin-top: 15px !important;
}

.mgt-pc--20 {
    margin-top: 20px !important;
}

.mgt-pc--25 {
    margin-top: 25px !important;
}

.mgt-pc--30 {
    margin-top: 30px !important;
}

.mgt-pc--35 {
    margin-top: 35px !important;
}

.mgt-pc--40 {
    margin-top: 40px !important;
}

.mgt-pc--45 {
    margin-top: 45px !important;
}

.mgt-pc--50 {
    margin-top: 50px !important;
}

.mgt-pc--55 {
    margin-top: 55px !important;
}

.mgt-pc--60 {
    margin-top: 60px !important;
}

.mgt-pc--65 {
    margin-top: 65px !important;
}

.mgt-pc--70 {
    margin-top: 70px !important;
}

.mgt-pc--75 {
    margin-top: 75px !important;
}

.mgt-pc--80 {
    margin-top: 80px !important;
}

.mgt-pc--85 {
    margin-top: 85px !important;
}

.mgt-pc--90 {
    margin-top: 90px !important;
}

.mgt-pc--95 {
    margin-top: 95px !important;
}

.mgt-pc--100 {
    margin-top: 100px !important;
}

.mgt-pc--105 {
    margin-top: 105px !important;
}

.mgt-pc--110 {
    margin-top: 110px !important;
}

.mgt-pc--115 {
    margin-top: 115px !important;
}

.mgt-pc--120 {
    margin-top: 120px !important;
}

.mgt-pc--125 {
    margin-top: 125px !important;
}

.mgt-pc--130 {
    margin-top: 130px !important;
}

.mgt-pc--135 {
    margin-top: 135px !important;
}

.mgt-pc--140 {
    margin-top: 140px !important;
}

.mgt-pc--145 {
    margin-top: 145px !important;
}

.mgt-pc--150 {
    margin-top: 150px !important;
}

.mgt-pc--155 {
    margin-top: 155px !important;
}

.mgt-pc--160 {
    margin-top: 160px !important;
}

.mgt-pc--165 {
    margin-top: 165px !important;
}

.mgt-pc--170 {
    margin-top: 170px !important;
}

.mgt-pc--175 {
    margin-top: 175px !important;
}

.mgt-pc--180 {
    margin-top: 180px !important;
}

.mgt-pc--185 {
    margin-top: 185px !important;
}

.mgt-pc--190 {
    margin-top: 190px !important;
}

.mgt-pc--195 {
    margin-top: 195px !important;
}

.mgt-pc--200 {
    margin-top: 200px !important;
}

.mgt-pc--205 {
    margin-top: 205px !important;
}

.mgt-pc--210 {
    margin-top: 210px !important;
}

.mgt-pc--215 {
    margin-top: 215px !important;
}

.mgt-pc--220 {
    margin-top: 220px !important;
}

.mgt-pc--225 {
    margin-top: 225px !important;
}

.mgt-pc--230 {
    margin-top: 230px !important;
}

.mgt-pc--235 {
    margin-top: 235px !important;
}

.mgt-pc--240 {
    margin-top: 240px !important;
}

.mgt-pc--245 {
    margin-top: 245px !important;
}

.mgt-pc--250 {
    margin-top: 250px !important;
}

@media screen and (max-width: 812px) {
    .mgt-sp--0 {
        margin-top: 0 !important;
    }
    .mgt-sp--5 {
        margin-top: 0.78125vw !important;
    }
    .mgt-sp--10 {
        margin-top: 1.5625vw !important;
    }
    .mgt-sp--15 {
        margin-top: 2.34375vw !important;
    }
    .mgt-sp--20 {
        margin-top: 3.125vw !important;
    }
    .mgt-sp--25 {
        margin-top: 3.90625vw !important;
    }
    .mgt-sp--30 {
        margin-top: 4.6875vw !important;
    }
    .mgt-sp--35 {
        margin-top: 5.46875vw !important;
    }
    .mgt-sp--40 {
        margin-top: 6.25vw !important;
    }
    .mgt-sp--45 {
        margin-top: 7.03125vw !important;
    }
    .mgt-sp--50 {
        margin-top: 7.8125vw !important;
    }
    .mgt-sp--55 {
        margin-top: 8.59375vw !important;
    }
    .mgt-sp--60 {
        margin-top: 9.375vw !important;
    }
    .mgt-sp--65 {
        margin-top: 10.15625vw !important;
    }
    .mgt-sp--70 {
        margin-top: 10.9375vw !important;
    }
    .mgt-sp--75 {
        margin-top: 11.71875vw !important;
    }
    .mgt-sp--80 {
        margin-top: 12.5vw !important;
    }
    .mgt-sp--85 {
        margin-top: 13.28125vw !important;
    }
    .mgt-sp--90 {
        margin-top: 14.0625vw !important;
    }
    .mgt-sp--95 {
        margin-top: 14.84375vw !important;
    }
    .mgt-sp--100 {
        margin-top: 15.625vw !important;
    }
    .mgt-sp--105 {
        margin-top: 16.40625vw !important;
    }
    .mgt-sp--110 {
        margin-top: 17.1875vw !important;
    }
    .mgt-sp--115 {
        margin-top: 17.96875vw !important;
    }
    .mgt-sp--120 {
        margin-top: 18.75vw !important;
    }
    .mgt-sp--125 {
        margin-top: 19.53125vw !important;
    }
    .mgt-sp--130 {
        margin-top: 20.3125vw !important;
    }
    .mgt-sp--135 {
        margin-top: 21.09375vw !important;
    }
    .mgt-sp--140 {
        margin-top: 21.875vw !important;
    }
    .mgt-sp--145 {
        margin-top: 22.65625vw !important;
    }
    .mgt-sp--150 {
        margin-top: 23.4375vw !important;
    }
    .mgt-sp--155 {
        margin-top: 24.21875vw !important;
    }
    .mgt-sp--160 {
        margin-top: 25vw !important;
    }
    .mgt-sp--165 {
        margin-top: 25.78125vw !important;
    }
    .mgt-sp--170 {
        margin-top: 26.5625vw !important;
    }
    .mgt-sp--175 {
        margin-top: 27.34375vw !important;
    }
    .mgt-sp--180 {
        margin-top: 28.125vw !important;
    }
    .mgt-sp--185 {
        margin-top: 28.90625vw !important;
    }
    .mgt-sp--190 {
        margin-top: 29.6875vw !important;
    }
    .mgt-sp--195 {
        margin-top: 30.46875vw !important;
    }
    .mgt-sp--200 {
        margin-top: 31.25vw !important;
    }
    .mgt-sp--205 {
        margin-top: 32.03125vw !important;
    }
    .mgt-sp--210 {
        margin-top: 32.8125vw !important;
    }
    .mgt-sp--215 {
        margin-top: 33.59375vw !important;
    }
    .mgt-sp--220 {
        margin-top: 34.375vw !important;
    }
    .mgt-sp--225 {
        margin-top: 35.15625vw !important;
    }
    .mgt-sp--230 {
        margin-top: 35.9375vw !important;
    }
    .mgt-sp--235 {
        margin-top: 36.71875vw !important;
    }
    .mgt-sp--240 {
        margin-top: 37.5vw !important;
    }
    .mgt-sp--245 {
        margin-top: 38.28125vw !important;
    }
    .mgt-sp--250 {
        margin-top: 39.0625vw !important;
    }
}

/* ---------------------------------------------
*   margin-bottom
--------------------------------------------- */
.mgb-pc--0 {
    margin-bottom: 0 !important;
}

.mgb-pc--5 {
    margin-bottom: 5px !important;
}

.mgb-pc--10 {
    margin-bottom: 10px !important;
}

.mgb-pc--15 {
    margin-bottom: 15px !important;
}

.mgb-pc--20 {
    margin-bottom: 20px !important;
}

.mgb-pc--25 {
    margin-bottom: 25px !important;
}

.mgb-pc--30 {
    margin-bottom: 30px !important;
}

.mgb-pc--35 {
    margin-bottom: 35px !important;
}

.mgb-pc--40 {
    margin-bottom: 40px !important;
}

.mgb-pc--45 {
    margin-bottom: 45px !important;
}

.mgb-pc--50 {
    margin-bottom: 50px !important;
}

.mgb-pc--55 {
    margin-bottom: 55px !important;
}

.mgb-pc--60 {
    margin-bottom: 60px !important;
}

.mgb-pc--65 {
    margin-bottom: 65px !important;
}

.mgb-pc--70 {
    margin-bottom: 70px !important;
}

.mgb-pc--75 {
    margin-bottom: 75px !important;
}

.mgb-pc--80 {
    margin-bottom: 80px !important;
}

.mgb-pc--85 {
    margin-bottom: 85px !important;
}

.mgb-pc--90 {
    margin-bottom: 90px !important;
}

.mgb-pc--95 {
    margin-bottom: 95px !important;
}

.mgb-pc--100 {
    margin-bottom: 100px !important;
}

.mgb-pc--105 {
    margin-bottom: 105px !important;
}

.mgb-pc--110 {
    margin-bottom: 110px !important;
}

.mgb-pc--115 {
    margin-bottom: 115px !important;
}

.mgb-pc--120 {
    margin-bottom: 120px !important;
}

.mgb-pc--125 {
    margin-bottom: 125px !important;
}

.mgb-pc--130 {
    margin-bottom: 130px !important;
}

.mgb-pc--135 {
    margin-bottom: 135px !important;
}

.mgb-pc--140 {
    margin-bottom: 140px !important;
}

.mgb-pc--145 {
    margin-bottom: 145px !important;
}

.mgb-pc--150 {
    margin-bottom: 150px !important;
}

.mgb-pc--155 {
    margin-bottom: 155px !important;
}

.mgb-pc--160 {
    margin-bottom: 160px !important;
}

.mgb-pc--165 {
    margin-bottom: 165px !important;
}

.mgb-pc--170 {
    margin-bottom: 170px !important;
}

.mgb-pc--175 {
    margin-bottom: 175px !important;
}

.mgb-pc--180 {
    margin-bottom: 180px !important;
}

.mgb-pc--185 {
    margin-bottom: 185px !important;
}

.mgb-pc--190 {
    margin-bottom: 190px !important;
}

.mgb-pc--195 {
    margin-bottom: 195px !important;
}

.mgb-pc--200 {
    margin-bottom: 200px !important;
}

.mgb-pc--205 {
    margin-bottom: 205px !important;
}

.mgb-pc--210 {
    margin-bottom: 210px !important;
}

.mgb-pc--215 {
    margin-bottom: 215px !important;
}

.mgb-pc--220 {
    margin-bottom: 220px !important;
}

.mgb-pc--225 {
    margin-bottom: 225px !important;
}

.mgb-pc--230 {
    margin-bottom: 230px !important;
}

.mgb-pc--235 {
    margin-bottom: 235px !important;
}

.mgb-pc--240 {
    margin-bottom: 240px !important;
}

.mgb-pc--245 {
    margin-bottom: 245px !important;
}

.mgb-pc--250 {
    margin-bottom: 250px !important;
}

@media screen and (max-width: 812px) {
    .mgb-sp--0 {
        margin-bottom: 0 !important;
    }
    .mgb-sp--5 {
        margin-bottom: 0.78125vw !important;
    }
    .mgb-sp--10 {
        margin-bottom: 1.5625vw !important;
    }
    .mgb-sp--15 {
        margin-bottom: 2.34375vw !important;
    }
    .mgb-sp--20 {
        margin-bottom: 3.125vw !important;
    }
    .mgb-sp--25 {
        margin-bottom: 3.90625vw !important;
    }
    .mgb-sp--30 {
        margin-bottom: 4.6875vw !important;
    }
    .mgb-sp--35 {
        margin-bottom: 5.46875vw !important;
    }
    .mgb-sp--40 {
        margin-bottom: 6.25vw !important;
    }
    .mgb-sp--45 {
        margin-bottom: 7.03125vw !important;
    }
    .mgb-sp--50 {
        margin-bottom: 7.8125vw !important;
    }
    .mgb-sp--55 {
        margin-bottom: 8.59375vw !important;
    }
    .mgb-sp--60 {
        margin-bottom: 9.375vw !important;
    }
    .mgb-sp--65 {
        margin-bottom: 10.15625vw !important;
    }
    .mgb-sp--70 {
        margin-bottom: 10.9375vw !important;
    }
    .mgb-sp--75 {
        margin-bottom: 11.71875vw !important;
    }
    .mgb-sp--80 {
        margin-bottom: 12.5vw !important;
    }
    .mgb-sp--85 {
        margin-bottom: 13.28125vw !important;
    }
    .mgb-sp--90 {
        margin-bottom: 14.0625vw !important;
    }
    .mgb-sp--95 {
        margin-bottom: 14.84375vw !important;
    }
    .mgb-sp--100 {
        margin-bottom: 15.625vw !important;
    }
    .mgb-sp--105 {
        margin-bottom: 16.40625vw !important;
    }
    .mgb-sp--110 {
        margin-bottom: 17.1875vw !important;
    }
    .mgb-sp--115 {
        margin-bottom: 17.96875vw !important;
    }
    .mgb-sp--120 {
        margin-bottom: 18.75vw !important;
    }
    .mgb-sp--125 {
        margin-bottom: 19.53125vw !important;
    }
    .mgb-sp--130 {
        margin-bottom: 20.3125vw !important;
    }
    .mgb-sp--135 {
        margin-bottom: 21.09375vw !important;
    }
    .mgb-sp--140 {
        margin-bottom: 21.875vw !important;
    }
    .mgb-sp--145 {
        margin-bottom: 22.65625vw !important;
    }
    .mgb-sp--150 {
        margin-bottom: 23.4375vw !important;
    }
    .mgb-sp--155 {
        margin-bottom: 24.21875vw !important;
    }
    .mgb-sp--160 {
        margin-bottom: 25vw !important;
    }
    .mgb-sp--165 {
        margin-bottom: 25.78125vw !important;
    }
    .mgb-sp--170 {
        margin-bottom: 26.5625vw !important;
    }
    .mgb-sp--175 {
        margin-bottom: 27.34375vw !important;
    }
    .mgb-sp--180 {
        margin-bottom: 28.125vw !important;
    }
    .mgb-sp--185 {
        margin-bottom: 28.90625vw !important;
    }
    .mgb-sp--190 {
        margin-bottom: 29.6875vw !important;
    }
    .mgb-sp--195 {
        margin-bottom: 30.46875vw !important;
    }
    .mgb-sp--200 {
        margin-bottom: 31.25vw !important;
    }
    .mgb-sp--205 {
        margin-bottom: 32.03125vw !important;
    }
    .mgb-sp--210 {
        margin-bottom: 32.8125vw !important;
    }
    .mgb-sp--215 {
        margin-bottom: 33.59375vw !important;
    }
    .mgb-sp--220 {
        margin-bottom: 34.375vw !important;
    }
    .mgb-sp--225 {
        margin-bottom: 35.15625vw !important;
    }
    .mgb-sp--230 {
        margin-bottom: 35.9375vw !important;
    }
    .mgb-sp--235 {
        margin-bottom: 36.71875vw !important;
    }
    .mgb-sp--240 {
        margin-bottom: 37.5vw !important;
    }
    .mgb-sp--245 {
        margin-bottom: 38.28125vw !important;
    }
    .mgb-sp--250 {
        margin-bottom: 39.0625vw !important;
    }
}

@media screen and (min-width: 813px) {
    .pc-hide {
        display: none !important;
    }
}

@media screen and (max-width: 812px) {
    .sp-hide {
        display: none !important;
    }
}

.term__textLink:hover{
		text-decoration: underline;
		color: #009944;
	}
	.mod-icon-pdf {
    white-space: nowrap;
    text-indent: 110%;
    overflow: hidden;
    display: inline-block;
    height: 16px;
    width: 16px;
    margin-left: 3px;
    background: url(/library/default/img/parts/icon_pdf_bg01.png) no-repeat left top;
    vertical-align: text-bottom;
    background-position: center;
}
.mod-icon-window {
    white-space: nowrap;
    text-indent: 110%;
    overflow: hidden;
    display: inline-block;
		aspect-ratio: 9 / 12;
    height: 1em;
    width: auto;
    margin-left: 3px;
    background: url(/library/default/img/parts/icon_window_bg01.png) no-repeat left top;
		background-size: 0.7em;
		background-position: center;
    vertical-align: text-bottom;
}