@charset "UTF-8";
/* ==========================================================
Name:
    module.css

Description:
    サイトで共通使用する汎用モジュール及びページ固有のスタイルを記述する
    汎用モジュールは、アルファベット降順(A->Z)に記述する
    ページ固有のスタイルは、ディレクトリ名のアルファベット降順(A->Z)、
    ファイル名のアルファベット降順(A->Z)にそれぞれ記述する

Contents:
    module
    page
    utility
    ========================================================== */
/* ==========================================================
*
*   module
*
========================================================== */
/* ---------------------------------------------
*   hover opacity
--------------------------------------------- */
.hover-opacity {
    -webkit-transition: opacity 300ms;
    transition: opacity 300ms;
}

.hover-opacity:hover {
    opacity: 0.8;
}

/* ---------------------------------------------
*   wrap
--------------------------------------------- */
#wrap {
    position: relative;
    z-index: 1;
}

/* ---------------------------------------------
*   js-contents-fade
--------------------------------------------- */
.js-contents-fade {
    opacity: 0;
}

/*.ie11 .js-contents-fade {
    opacity: 1;
    }*/

    .js-contents-fade--show {
        opacity: 1;
        -webkit-transition-duration: 1s;
        transition-duration: 1s;
        -webkit-transition-property: opacity;
        transition-property: opacity;
    }

/* ---------------------------------------------
*   impression-list
--------------------------------------------- */
.impression-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    margin-right: auto;
    margin-left: auto;
    width: 1180px;

    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    justify-content: space-between;
}

@media screen and (max-width: 1240px) {
    .impression-list {
        width: auto;
    }
}

@media screen and (max-width: 738px) {
    .impression-list {
        display: block;
    }
}

.impression-list__item {
    position: relative;
    margin-bottom: 18px;
    padding-top: 265px;
    width: 380px;
    background-repeat: no-repeat;
}

@media screen and (max-width: 1240px) {
    .impression-list__item {
        padding-top: 21.37097vw;
        width: 30.64516vw;
    }
}

@media screen and (max-width: 738px) {
    .impression-list__item {
        margin-right: auto;
        margin-bottom: 3.12297vw;
        margin-left: auto;
        padding-top: 46.58426vw;
        width: 66.9486%;
    }
}

.impression-list__item--1 {
    background-image: url(../img/thumbnail_1.jpg);
    background-size: cover;
}

@media screen and (max-width: 738px) {
    .impression-list__item--1 {
        background-image: url(../img/sp/thumbnail_1.jpg);
    }
}

.impression-list__item--2 {
    background-image: url(../img/thumbnail_2.jpg);
    background-size: cover;
}

@media screen and (max-width: 738px) {
    .impression-list__item--2 {
        background-image: url(../img/sp/thumbnail_2.jpg);
    }
}

.impression-list__item--2 .impression-list__item-frame-name {
    right: 14px;
    left: auto;
    text-align: right;
}

@media screen and (max-width: 1240px) {
    .impression-list__item--2 .impression-list__item-frame-name {
        right: 1.12903vw;
    }
}

@media screen and (max-width: 738px) {
    .impression-list__item--2 .impression-list__item-frame-name {
        right: 3.25309vw;
    }
}

.impression-list__item--3 {
    background-image: url(../img/thumbnail_3.jpg);
    background-size: cover;
}

@media screen and (max-width: 738px) {
    .impression-list__item--3 {
        background-image: url(../img/sp/thumbnail_3.jpg);
    }
}

.impression-list__item--4 {
    background-image: url(../img/thumbnail_4.jpg);
    background-size: cover;
}

@media screen and (max-width: 738px) {
    .impression-list__item--4 {
        background-image: url(../img/sp/thumbnail_4.jpg);
    }
}

.impression-list__item--4 .impression-list__item-frame-name {
    top: 13px;
    right: 14px;
    bottom: auto;
    left: auto;
    text-align: right;
}

@media screen and (max-width: 1240px) {
    .impression-list__item--4 .impression-list__item-frame-name {
        top: 1.04839vw;
        right: 1.12903vw;
    }
}

@media screen and (max-width: 738px) {
    .impression-list__item--4 .impression-list__item-frame-name {
        top: 3.25309vw;
        right: 3.25309vw;
    }
}

.impression-list__item--5 {
    background-image: url(../img/thumbnail_5.jpg);
    background-size: cover;
}

@media screen and (max-width: 738px) {
    .impression-list__item--5 {
        background-image: url(../img/sp/thumbnail_5.jpg);
    }
}

.impression-list__item--6 {
    background-image: url(../img/thumbnail_6.jpg);
    background-size: cover;
}

@media screen and (max-width: 738px) {
    .impression-list__item--6 {
        background-image: url(../img/sp/thumbnail_6.jpg);
    }
}

.impression-list__item-frame-movie {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.impression-list__item-frame-label {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-top: 1px;
    padding-right: 11px;
    padding-left: 20px;
    height: 35px;
    background-color: #ffdb00;
    color: #000;
    font-size: 35px;
    font-family: 'DIN Pro CondLight';
    line-height: 1;
}

@media screen and (max-width: 738px) {
    .impression-list__item-frame-label {
        padding-top: 0.13012vw;
        padding-right: 1.95185vw;
        padding-left: 3.77358vw;
        height: 5.85556vw;
        font-size: 6.11581vw;
    }
}

.impression-list__item-frame-label:after {
    position: absolute;
    top: 0;
    right: -25px;
    width: 0;
    height: 0;
    border-width: 35px 25px 0 0;
    border-style: solid;
    border-color: #ffdb00 transparent transparent transparent;
    content: "";
}

@media screen and (max-width: 738px) {
    .impression-list__item-frame-label:after {
        right: -4.48926vw;
        border-width: 5.85556vw 4.55433vw 0 0;
    }
}

.impression-list__item-frame-label--green {
    background-color: #4baf4a;
    color: #fff;
}

.impression-list__item-frame-label--green:after {
    border-color: #4baf4a transparent transparent transparent;
}

.impression-list__item-frame-name {
    position: absolute;
    bottom: 7px;
    left: 14px;
    color: #ffdb00;
    font-size: 31px;
    font-family: 'DIN Condensed Bold';
    line-height: 1;
}

.impression-list__item-frame-name--green {
    color: #4baf4a;
}

@media screen and (max-width: 1240px) {
    .impression-list__item-frame-name {
        bottom: 0.56452vw;
        left: 1.12903vw;
        font-size: 1.875vw;
    }
}

@media screen and (max-width: 738px) {
    .impression-list__item-frame-name {
        bottom: 1.30124vw;
        left: 3.25309vw;
        font-size: 5.49772vw;
        line-height: 1.1;
    }
}

/* ---------------------------------------------
*   correct-contents （SP only contents）
--------------------------------------------- */
.correct-contents {
    margin-bottom: 17.61518vw;
}

.correct-contents__slide {
    padding-right: 5.22876%;
    padding-left: 5.22876%;
    margin-top: 3.125vw;
}

.correct-contents__title {
    position: relative;
    top: -.94851vw;
    z-index: 1;
    width: 93.56369%;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 6.30081vw;
}

.correct-contents__list {
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-right: 5.22876%;
    padding-left: 5.22876%;
    margin-bottom: 4.74255vw;
}

.correct-contents__list-item {
    width: 50%;
}

.correct-contents__list-item--1 {}

.correct-contents__list-item--1 .correct-contents__list-item-image {
    width: 84.0876%;
}

.correct-contents__list-item--1 .correct-contents__list-item-text {}

.correct-contents__list-item--2 {}

.correct-contents__list-item--2 .correct-contents__list-item-image {
    width: 71.24080%;
}

.correct-contents__list-item--1 .correct-contents__list-item-text {}

.correct-contents__list-item-image {
    margin-bottom: 1.35501vw;
}

.correct-contents__list-item-text {
    text-align: center;
    line-height: 1.3;
    font-size: 3.66013vw;
}

.correct-contents__link {
    display: block;
    width: 66.9486%;
    margin-right: auto;
    margin-bottom: 1.08401vw;
    margin-left: auto;
}

.correct-contents__caption {
    text-align: center;
    font-size: 3.79404vw;
}

/* ---------------------------------------------
*   comparison
--------------------------------------------- */
.comparison {
    margin-top: 35px;
    padding-bottom: 15px;
}

@media screen and (max-width: 738px) {
    .comparison {
        margin-top: 13.98829vw;
        margin-bottom: 13.98829vw;
        padding-bottom: 0;
    }
}

.comparison__head {
    margin-bottom: 25px;
}

@media screen and (max-width: 738px) {
    .comparison__head {
        margin-bottom: 3.25309vw;
    }
}

.comparison__ttl {
    text-align: center;
    letter-spacing: .1em;
    font-weight: bold;
    font-size: 36px;
    line-height: 1.5;
}

@media screen and (max-width: 738px) {
    .comparison__ttl {
        font-size: 5.85556vw;
    }
}

.comparison__ttl-txt--bottom {
    color: #ffdb00;
}

.comparison__frame {
    position: relative;
    margin-right: auto;
    margin-left: auto;
    padding-top: 265px;
    width: 380px;
    background-image: url(../img/thumbnail_7.jpg);
    background-size: cover;
    background-repeat: no-repeat;
}

@media screen and (max-width: 1240px) {
    .comparison__frame {
        padding-top: 21.37097vw;
        width: 30.64516vw;
    }
}

@media screen and (max-width: 738px) {
    .comparison__frame {
        margin-right: auto;
        margin-left: auto;
        padding-top: 46.58426vw;
        width: 66.9486%;
        background-image: url(../img/sp/thumbnail_7.jpg);
    }
}

.comparison__movie {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

/* ---------------------------------------------
*   interview-content
--------------------------------------------- */
.interview-content {
    position: relative;
    margin-right: auto;
    margin-left: auto;
    width: 1142px;
}

@media screen and (max-width: 1240px) {
    .interview-content {
        margin-bottom: 5.53025vw;
        width: 89.52505vw;
    }
}

.interview-content__bg {
    overflow: hidden;
    padding-top: 354px;
    height: 0;
    background: url(../img/img_interview.jpg) 0 0 no-repeat;
    background-size: 100%;
}

@media screen and (max-width: 1240px) {
    .interview-content__bg {
        padding-top: 31%;
    }
}

@media screen and (max-width: 738px) {
    .interview-content__bg {
        padding-top: 121.4704vw;
        background-image: url(../img/sp/img_interview.jpg);
    }
}

.interview-content__link {
    position: absolute;
    bottom: 40px;
    left: 50.3%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    -ms-flex-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 216px;
    height: 45px;
    border: 2px solid #ffdb00;
    color: #ffdb00;
    font-weight: bold;
    font-size: 16px;
    line-height: 1;
    -webkit-transition: opacity 300ms;
    transition: opacity 300ms;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);

    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
}

.interview-content__link:hover {
    opacity: 0.8;
}

.ios .interview-content__link:hover,
.android .interview-content__link:hover {
    opacity: 1;
}

@media screen and (max-width: 1240px) {
    .interview-content__link {
        bottom: 11.3%;
        width: 19%;
        height: 3.63vw;
    }
}

@media screen and (max-width: 738px) {
    .interview-content__link {
        bottom: 5.85556vw;
        left: 52%;
        width: 38.71178vw;
        height: 9.75927vw;
        border-width: 0.32531vw;
        font-size: 3.25309vw;
    }
}

/* ---------------------------------------------
*   keyvisual
--------------------------------------------- */
.keyvisual {
    position: relative;
    overflow: hidden;
}

.keyvisual:before {
    position: absolute;
    top: 0;
    right: -50%;
    bottom: 0;
    left: -50%;
    background-color: #000;
    content: "";
    -webkit-transform: rotate(-15.35deg) translateY(-20.3%);
    transform: rotate(-15.35deg) translateY(-20.3%);
}

@media screen and (max-width: 738px) {
    .keyvisual:before {
        display: none;
    }
}

.keyvisual__bg {
    position: relative;
    overflow: hidden;
    padding-top: 1304px;
    height: 0;
    background-image: url(../img/img_keyvisual.png);
    background-position: 50% 0;
    background-size: auto 100%;
    background-repeat: no-repeat;
}

@media screen and (max-width: 1500px) {
    .keyvisual__bg {
        padding-top: 86.93333vw;
    }
}

@media screen and (max-width: 738px) {
    .keyvisual__bg {
        padding-top: 176.18738vw;
        background-image: url(../img/sp/img_keyvisual.png);
    }
}

.keyvisual__link {
    position: absolute;
    top: 637px;
    left: 50%;
    width: 260px;
    height: 59.5327102805px;
    transform: translateX(-50%);
    -webkit-transition: opacity 300ms;
    transition: opacity 300ms;
    margin-left: 68px;
    display: block;
}

.keyvisual__link:hover {
    opacity: 0.7;
}

@media screen and (max-width: 1500px) {
    .keyvisual__link {
        top: 42.46667vw;
        width: 17.33333vw;
        height: 3.96885vw;
        margin-left: 4.53333vw;
    }
}

@media screen and (max-width: 738px) {
    .keyvisual__link {
        top: 44.03794vw;
        width: 93.22493vw;
        height: 27.10027vw;
        margin-left: 0;
    }
}

.keyvisual__movie {
    position: absolute;
    top: 500px;
    left: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    margin-left: -530px;

    -webkit-box-align: center;
    align-items: center;
}

@media screen and (max-width: 1240px) {
    .keyvisual__movie {
        top: 40.32258vw;
        left: 7.66129vw;
        margin-left: 0;
    }
}

@media screen and (max-width: 738px) {
    .keyvisual__movie {
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
    .keyvisual__movie .movie-play {
        width: 23px;
        height: 23px;
        border: 1px solid #fff;
    }
    .keyvisual__movie .movie-play__icon {
        font-size: 10px !important;
    }
}

.keyvisual__text {
    font-size: 50px;
    font-family: 'DIN Condensed Bold';
}

@media screen and (max-width: 1240px) {
    .keyvisual__text {
        font-size: 4.03226vw;
    }
}

@media screen and (max-width: 738px) {
    .keyvisual__text {
        font-size: 6.50618vw;
    }
}

.keyvisual__text-movie {
    position: relative;
    top: 6px;
}

@media screen and (max-width: 1240px) {
    .keyvisual__text-movie {
        top: 0.48387vw;
    }
}

.keyvisual__caption {
    position: absolute;
    top: 697px;
    left: 50%;
    font-size: 15px;
    font-weight: bold;
    transform: translateX(-50%);
    margin-left: 68px;
    display: block;
}

@media screen and (max-width: 1500px) {
    .keyvisual__caption {
        top: 46.46667vw;
        font-size: 1vw;
        margin-left: 4.53333vw;
    }
}

.windows .keyvisual__text-movie {
    position: static;
}

/* ---------------------------------------------
*   lineup-section
--------------------------------------------- */
@media screen and (max-width: 738px) {
    .lineup-section {
        margin-top: 5.20494vw;
    }
}

.lineup-section__head {
    margin-bottom: 40px;
}

@media screen and (max-width: 738px) {
    .lineup-section__head {
        margin-bottom: 5.20494vw;
        padding-right: 5.10735%;
        padding-left: 5.10735%;
    }
}

.lineup-section__ttl {
    position: relative;
    text-align: center;
    font-size: 40px;
    font-family: 'DIN Condensed Bold';
    line-height: 1;
}

@media screen and (max-width: 738px) {
    .lineup-section__ttl {
        font-size: 5.20494vw;
    }
}

.lineup-section__ttl:before, .lineup-section__ttl:after {
    position: absolute;
    top: 40%;
    display: block;
    height: 2px;
    background-color: rgba(255, 255, 255, 0.5);
    content: "";
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

@media screen and (max-width: 738px) {
    .lineup-section__ttl:before, .lineup-section__ttl:after {
        min-height: 1px;
        height: 0.26025vw;
    }
}

.lineup-section__ttl--m:before, .lineup-section__ttl--m:after {
    width: calc(50% - 53px);
}

@media screen and (max-width: 738px) {
    .lineup-section__ttl--m:before, .lineup-section__ttl--m:after {
        width: calc(50% - 7vw);
    }
}

.lineup-section__ttl--w:before, .lineup-section__ttl--w:after {
    width: calc(50% - 75px);
}

@media screen and (max-width: 738px) {
    .lineup-section__ttl--w:before, .lineup-section__ttl--w:after {
        width: calc(50% - 9.8125vw);
    }
}

.lineup-section__ttl:before {
    left: 0;
}

.lineup-section__ttl:after {
    right: 0;
}

.lineup-section__ttl__txt {
    display: inline-block;
}

.lineup-section__ttl__txt--m {
    width: 106px;
}

@media screen and (max-width: 738px) {
    .lineup-section__ttl__txt--m {
        width: 10vw;
    }
}

.lineup-section__ttl__txt--w {
    width: 150px;
}

@media screen and (max-width: 738px) {
    .lineup-section__ttl__txt--w {
        width: 15.625vw;
    }
}

/* ---------------------------------------------
*   lineup-list
--------------------------------------------- */
.lineup-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    margin-bottom: 100px;

    -webkit-box-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

@media screen and (max-width: 1240px) {
    .lineup-list {
        margin-bottom: 8.06452vw;
    }
}

@media screen and (max-width: 738px) {
    .lineup-list {
        -ms-flex-pack: center;
        margin-bottom: 9.62915vw;
        padding: 0 3.90371vw;

        -webkit-box-pack: center;
        justify-content: center;
    }
    .lineup-list:first-of-type .lineup-list__item:nth-of-type(1),
    .lineup-list:first-of-type .lineup-list__item:nth-of-type(2) {
        margin-bottom: 9.62915vw;
    }
}

.lineup-list__item {
    width: calc(100% / 3);
    text-align: center;
}

@media screen and (max-width: 738px) {
    .lineup-list__item {
        width: 50%;
    }
}

.lineup-list__item img {
    width: 336px;
}

@media screen and (max-width: 1240px) {
    .lineup-list__item img {
        width: 27.09677vw;
    }
}

@media screen and (max-width: 738px) {
    .lineup-list__item img {
        width: 43.72154vw;
    }
}

.lineup-list__item-image {
    margin-bottom: 28px;
    text-align: center;
}

@media screen and (max-width: 1240px) {
    .lineup-list__item-image {
        margin-bottom: 2.25806vw;
    }
}

.lineup-list__item-frame {
    position: relative;
    display: inline-block;
    text-align: left;
}

.lineup-list__item-title {
    position: relative;
    top: 5px;
    color: #ffdb00;
    letter-spacing: .035em;
    font-size: 38px;
    font-family: 'DIN Condensed Bold';
}

@media screen and (max-width: 1240px) {
    .lineup-list__item-title {
        top: 0.40323vw;
        font-size: 3.10484vw;
    }
}

@media screen and (max-width: 738px) {
    .lineup-list__item-title {
        font-size: 5.98569vw;
        line-height: 1;
    }
}

.lineup-list__item-type {
    margin-bottom: 15px;
    font-size: 50px;
    font-family: 'DIN Pro CondLight';
}

@media screen and (max-width: 1240px) {
    .lineup-list__item-type {
        margin-bottom: 1.20968vw;
        font-size: 4.03226vw;
    }
}

@media screen and (max-width: 738px) {
    .lineup-list__item-type {
        font-size: 7.80742vw;
        line-height: 1;
    }
}

.lineup-list__item-type-limited {
    position: relative;
    top: -2px;
    margin-left: 3px;
    font-size: 24px;
    font-family: "Noto Sans Japanese", sans-serif;
}

@media screen and (max-width: 1240px) {
    .lineup-list__item-type-limited {
        top: -0.16129vw;
        margin-left: 0.24194vw;
        font-size: 1.93548vw;
    }
}

@media screen and (max-width: 738px) {
    .lineup-list__item-type-limited {
        font-size: 3.77358vw;
    }
}

.lineup-list__item-link {
    display: block;
    padding: 13px 0;
    width: 217px;
    border: 1px solid #ffdb00;
    color: #ffdb00;
    text-align: center;
    font-size: 15px;
}

@media screen and (max-width: 1240px) {
    .lineup-list__item-link {
        padding: 0.92742vw 0;
        width: 17.54032vw;
        font-size: 1.25vw;
    }
}

@media screen and (max-width: 738px) {
    .lineup-list__item-link {
        padding: 1.56148vw 0;
        width: 35.13338vw;
        font-size: 2.53741vw;
        font-family: 'Noto Sans Japanese Bold';
    }
}

.windows .lineup-list__item-title {
    margin-bottom: 7px;
}

@media screen and (max-width: 1240px) {
    .windows .lineup-list__item-title {
        margin-bottom: 0.56452vw;
    }
}

/* ---------------------------------------------
*   movie
--------------------------------------------- */
.movie-play {
    position: relative;
    display: inline-block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-right: 10px;
    margin-left: auto;
    width: 60px;
    height: 60px;
    border: 2px solid #fff;
    border-radius: 50%;
    color: #fff;
    vertical-align: top;
    cursor: pointer;
    -webkit-transition: all 0.35s ease-in;
    transition: all 0.35s ease-in;
    -webkit-animation: ScaleDownSP 1s ease-out infinite;
    animation: ScaleDownSP 1s ease-out infinite;
}

@media screen and (max-width: 1240px) {
    .movie-play {
        margin-right: 0.80645vw;
        width: 3.62903vw;
        height: 3.62903vw;
    }
}

@media screen and (max-width: 738px) {
    .movie-play {
        width: 9.76562vw;
        height: 9.76562vw;
    }
}

@media screen and (max-width: 460px) {
    .movie-play {
        width: 50px;
        height: 50px;
    }
}

.movie-play:hover {
    -webkit-animation: ScaleDownStop 1s ease-out 1 forwards;
    animation: ScaleDownStop 1s ease-out 1 forwards;
}

.movie-play__icon {
    position: absolute;
    top: 50%;
    left: 53%;
    font-size: 26px !important;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

@media screen and (max-width: 1240px) {
    .movie-play__icon {
        font-size: 1.6vw !important;
    }
}

@media screen and (max-width: 738px) {
    .movie-play__icon {
        font-size: 4.1vw !important;
    }
}

.movie-play--none:hover {
    cursor: auto;
    -webkit-animation: ScaleDownSP 1s ease-out infinite;
    animation: ScaleDownSP 1s ease-out infinite;
}

/* ---------------------------------------------
*   yu2fvl
--------------------------------------------- */
.yu2fvl {
    top: 0;
    z-index: 9999;
}

.yu2fvl-iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

.yu2fvl-overlay {
    z-index: 9998;
    background: #000;
}

.yu2fvl-close {
    margin: 0;
    padding: 0;
    width: 100%;
    outline: 0;
    border: 0;
    background: none;
    color: #fff;
    text-align: right;
    font-size: 40px;
    cursor: pointer;
}

@media screen and (max-width: 500px) {
    .yu2fvl {
        top: 3px;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        z-index: 9999;
        margin: auto !important;
        min-width: 300px !important;
        min-height: 202.5px !important;
    }
}

@-webkit-keyframes ScaleDown {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    15% {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
    }
    30% {
        -webkit-transform: scale(1.02);
        transform: scale(1.02);
    }
    60% {
        -webkit-transform: scale(0.99);
        transform: scale(0.99);
    }
    85% {
        -webkit-transform: scale(1.01);
        transform: scale(1.01);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes ScaleDown {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    15% {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
    }
    30% {
        -webkit-transform: scale(1.02);
        transform: scale(1.02);
    }
    60% {
        -webkit-transform: scale(0.99);
        transform: scale(0.99);
    }
    85% {
        -webkit-transform: scale(1.01);
        transform: scale(1.01);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-webkit-keyframes ScaleDownSP {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    15% {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
    }
    85% {
        -webkit-transform: scale(1.02);
        transform: scale(1.02);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes ScaleDownSP {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    15% {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
    }
    85% {
        -webkit-transform: scale(1.02);
        transform: scale(1.02);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-webkit-keyframes ScaleDownStop {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    100% {
        -webkit-transform: scale(1.08);
        transform: scale(1.08);
    }
}

@keyframes ScaleDownStop {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    100% {
        -webkit-transform: scale(1.08);
        transform: scale(1.08);
    }
}

@-webkit-keyframes ScaleDown {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    15% {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
    }
    30% {
        -webkit-transform: scale(1.02);
        transform: scale(1.02);
    }
    60% {
        -webkit-transform: scale(0.99);
        transform: scale(0.99);
    }
    85% {
        -webkit-transform: scale(1.01);
        transform: scale(1.01);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes ScaleDown {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    15% {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
    }
    30% {
        -webkit-transform: scale(1.02);
        transform: scale(1.02);
    }
    60% {
        -webkit-transform: scale(0.99);
        transform: scale(0.99);
    }
    85% {
        -webkit-transform: scale(1.01);
        transform: scale(1.01);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-webkit-keyframes ScaleDownSP {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    15% {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
    }
    85% {
        -webkit-transform: scale(1.02);
        transform: scale(1.02);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes ScaleDownSP {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    15% {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
    }
    85% {
        -webkit-transform: scale(1.02);
        transform: scale(1.02);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-webkit-keyframes ScaleDownStop {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    100% {
        -webkit-transform: scale(1.08);
        transform: scale(1.08);
    }
}

@keyframes ScaleDownStop {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    100% {
        -webkit-transform: scale(1.08);
        transform: scale(1.08);
    }
}

@-webkit-keyframes sdb {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@keyframes sdb {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

/* ---------------------------------------------
*   page-title
--------------------------------------------- */
/* ---------------------------------------------
*   section
--------------------------------------------- */
.section--1 {
    margin-top: -60px;
    margin-bottom: 105px;
}

@media screen and (max-width: 1240px) {
    .section--1 {
        margin-top: -4.83871vw;
        margin-bottom: 8.46774vw;
    }
}

@media screen and (max-width: 738px) {
    .section--1 {
        margin-top: 0;
    }
}

.section--lineup {
    margin-top: -176px;
}

@media screen and (max-width: 1240px) {
    .section--lineup {
        margin-top: -14.19355vw;
    }
}

@media screen and (max-width: 738px) {
    .section--lineup {
        margin-top: 0;
        padding-bottom: 10.40989vw;
    }
}

.section__title {
    margin-bottom: 23px;
    color: #ffdb00;
    text-align: center;
    font-size: 60px;
    font-family: 'DIN Condensed Bold';
}

@media screen and (max-width: 1240px) {
    .section__title {
        margin-bottom: 1.85484vw;
        font-size: 4.83871vw;
    }
}

@media screen and (max-width: 738px) {
    .section__title {
        font-size: 9.10865vw;
    }
}

.section__title--lineup {
    margin-bottom: 77px;
}

@media screen and (max-width: 1240px) {
    .section__title--lineup {
        margin-bottom: 6.20968vw;
    }
}

@media screen and (max-width: 738px) {
    .section__title--lineup {
        margin-bottom: 0.52049vw;
    }
}

/* ---------------------------------------------
*   technology-area
--------------------------------------------- */
.technology-area {
    position: relative;
}

.technology-area__title {
    position: absolute;
    top: 773px;
    right: 50px;
    z-index: 1;
    overflow: hidden;
    padding-top: 130px;
    width: 337px;
    height: 0;
    background-image: url(../img/logo_flash.png);
    background-position: 0 0;
    background-size: 100% auto;
    background-repeat: no-repeat;
}

@media screen and (max-width: 1240px) {
    .technology-area__title {
        top: 62.33871vw;
        right: 4.03226vw;
        padding-top: 10.48387vw;
        width: 27.17742vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-area__title {
        top: 29.14769vw;
        right: 4.16396vw;
        padding-top: 20.36435vw;
        width: 53.1555vw;
        background-image: url(../img/sp/logo_flash.png);
    }
}

/* ---------------------------------------------
*   technology-section
--------------------------------------------- */
.technology-section--1 {
    position: relative;
    height: 840px;
    background: url(../img/img_content1.png) 50% 50% no-repeat;
    background-size: auto 100%;
}

@media screen and (max-width: 1240px) {
    .technology-section--1 {
        height: 67.74194vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section--1 {
        height: 249.51204vw;
        background: url(../img/sp/img_content1.png) 50% 50% no-repeat;
        background-size: auto 100%;
    }
}

.technology-section--1 .technology-section-inner {
    top: 377px;
    left: 47px;
}

@media screen and (max-width: 1240px) {
    .technology-section--1 .technology-section-inner {
        top: 30.40323vw;
        left: 3.79032vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section--1 .technology-section-inner {
        top: 128.82238vw;
        left: 4.55433vw;
    }
}

.technology-section--2 {
    position: relative;
    height: 594px;
    background: url(../img/img_content2.png) 50% 50% no-repeat;
    background-size: auto 100%;
}

@media screen and (max-width: 1240px) {
    .technology-section--2 {
        height: 47.90323vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section--2 {
        height: 134.80807vw;
        background: url(../img/sp/img_content2.png) 50% 50% no-repeat;
        background-size: auto 100%;
    }
}

.technology-section--2 .technology-section-inner {
    top: 306px;
    right: 58px;
}

@media screen and (max-width: 1240px) {
    .technology-section--2 .technology-section-inner {
        top: 24.67742vw;
        right: 4.67742vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section--2 .technology-section-inner {
        top: 28.6272vw;
        right: auto;
        left: 4.55433vw;
    }
}

.technology-section--3 {
    position: relative;
    height: 660px;
    background: url(../img/img_content3.png) 50% 50% no-repeat;
    background-size: auto 100%;
}

@media screen and (max-width: 1240px) {
    .technology-section--3 {
        height: 53.22581vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section--3 {
        height: 161.80872vw;
        background: url(../img/sp/img_content3.png) 50% 50% no-repeat;
        background-size: auto 100%;
    }
}

.technology-section--3 .technology-section-inner {
    top: 296px;
    left: 47px;
}

@media screen and (max-width: 1240px) {
    .technology-section--3 .technology-section-inner {
        top: 23.87097vw;
        left: 3.79032vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section--3 .technology-section-inner {
        top: 32.01041vw;
        left: 4.55433vw;
    }
}

.technology-section--4 {
    position: relative;
    height: 1077px;
    background: url(../img/img_content4.png) 50% 50% no-repeat;
    background-size: auto 100%;
}

@media screen and (max-width: 1240px) {
    .technology-section--4 {
        height: 86.85484vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section--4 {
        height: 190.43591vw;
        background: url(../img/sp/img_content4.png) 50% 50% no-repeat;
        background-size: auto 100%;
    }
}

.technology-section--4 .technology-section-inner {
    top: 305px;
    right: 58px;
}

@media screen and (max-width: 1240px) {
    .technology-section--4 .technology-section-inner {
        top: 24.59677vw;
        right: 4.67742vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section--4 .technology-section-inner {
        top: 68.44502vw;
        right: auto;
        left: 4.55433vw;
    }
}

.technology-section__guide {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    -ms-flex-align: center;
    margin-bottom: 30px;

    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    justify-content: space-between;
}

@media screen and (max-width: 1240px) {
    .technology-section__guide {
        margin-bottom: 2.41935vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section__guide {
        margin-bottom: 4.03383vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section__guide--one {
        -ms-flex-pack: start;

        -webkit-box-pack: start;
        justify-content: start;
    }
}

@media screen and (max-width: 738px) {
    .technology-section__guide--one .technology-section__guide-left {
        margin-right: 7.80742vw;
    }
}

.technology-section__guide--one .technology-section__guide-arrow {
    width: 242px;
}

@media screen and (max-width: 1240px) {
    .technology-section__guide--one .technology-section__guide-arrow {
        width: 19.51613vw;
    }
}

.technology-section__guide--one .technology-section__guide-logo:first-child {
    margin-right: 0;
}

.technology-section__guide-left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;

    -webkit-box-align: center;
    align-items: center;
}

.technology-section__guide-right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.technology-section__guide-text {
    position: relative;
    top: 4px;
    color: #4baf4a;
    letter-spacing: .05em;
    font-size: 29px;
    font-family: 'DIN Condensed Bold';
}

@media screen and (max-width: 1240px) {
    .technology-section__guide-text {
        top: 0.32258vw;
        font-size: 2.33871vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section__guide-text {
        top: 0.78074vw;
        font-size: 6.50618vw;
    }
}

.technology-section__guide-arrow {
    position: relative;
    display: block;
    margin-left: 5px;
    width: 60px;
    height: 2px;
    background-color: rgba(75, 175, 74, 0.5);
}

@media screen and (max-width: 1240px) {
    .technology-section__guide-arrow {
        margin-left: 0.40323vw;
        width: 4.83871vw;
        height: 0.16129vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section__guide-arrow {
        display: none;
    }
}

.technology-section__guide-arrow:before {
    position: absolute;
    top: 50%;
    right: 0;
    display: block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #4baf4a;
    content: "";
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

@media screen and (max-width: 1240px) {
    .technology-section__guide-arrow:before {
        width: 0.48387vw;
        height: 0.48387vw;
    }
}

.technology-section__guide-logo {
    position: relative;
    background-color: rgba(75, 175, 74, 0.35);
}

.technology-section__guide-logo:before {
    position: absolute;
    display: block;
    margin-top: auto;
    margin-bottom: auto;
    content: "";
}

.technology-section__guide-logo:first-child {
    margin-right: 20px;
}

@media screen and (max-width: 1240px) {
    .technology-section__guide-logo:first-child {
        margin-right: 1.6129vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section__guide-logo:first-child {
        margin-right: 4.55433vw;
    }
}

.technology-section__guide-logo--driver:before {
    top: 12px;
    bottom: 0;
    left: -13px;
    width: 41px;
    height: 55px;
    background: url(../img/icon_1.png) 50% 50% no-repeat;
    background-size: 100% 100%;
}

@media screen and (max-width: 1240px) {
    .technology-section__guide-logo--driver:before {
        top: 0.96774vw;
        left: -1.04839vw;
        width: 3.34677vw;
        height: 4.47581vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section__guide-logo--driver:before {
        top: 3.25309vw;
        left: -4.68445vw;
        width: 8.06766vw;
        height: 10.60507vw;
    }
}

.technology-section__guide-logo--fairwaywoods:before {
    top: 12px;
    bottom: 0;
    left: -13px;
    width: 37px;
    height: 55px;
    background: url(../img/icon_2.png) 50% 50% no-repeat;
    background-size: 100% 100%;
}

@media screen and (max-width: 1240px) {
    .technology-section__guide-logo--fairwaywoods:before {
        top: 0.96774vw;
        left: -1.04839vw;
        width: 2.98387vw;
        height: 4.47581vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section__guide-logo--fairwaywoods:before {
        top: 3.25309vw;
        left: -2.92778vw;
        width: 7.09174vw;
        height: 10.60507vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section__guide-logo--fairwaywoods .technology-section__guide-logo-text {
        padding-left: 5.72544vw;
    }
}

.technology-section__guide-logo-text {
    padding: 7px 10px 7px 30px;
    letter-spacing: .01em;
    font-size: 26px;
    font-family: 'DIN Pro CondLight';
}

@media screen and (max-width: 1240px) {
    .technology-section__guide-logo-text {
        padding: 0.56452vw 0.80645vw 0.56452vw 2.41935vw;
        font-size: 2.09677vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section__guide-logo-text {
        padding: 0.06506vw 1.62655vw 0 3.90371vw;
        font-size: 5.07482vw;
    }
}

.technology-section__title {
    margin-bottom: 42px;
    color: #ffdb00;
    font-size: 30px;
    line-height: 1.5;
}

.technology-section__title--mg {
    margin-bottom: 30px;
}

@media screen and (max-width: 1240px) {
    .technology-section__title--mg {
        margin-bottom: 2.41935vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section__title--mg {
        margin-bottom: 3.90371vw;
    }
}

@media screen and (max-width: 1240px) {
    .technology-section__title {
        margin-bottom: 3.3871vw;
        font-size: 2.41935vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section__title {
        margin-bottom: 3.90371vw;
        font-size: 5.85556vw;
        line-height: 1.4;
    }
}

.technology-section__text {
    font-size: 17.5px;
    line-height: 1.7;
}

@media screen and (max-width: 1240px) {
    .technology-section__text {
        font-size: 1.41129vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section__text {
        font-size: 3.90371vw;
    }
}

.technology-section__text--mg {
    margin-bottom: 15px;
}

@media screen and (max-width: 1240px) {
    .technology-section__text--mg {
        margin-bottom: 1.20968vw;
    }
}

.technology-section__note {
    padding-left: 1em;
    text-indent: -1em;
    font-size: 13px;
    line-height: 1.5;
}

@media screen and (max-width: 1240px) {
    .technology-section__note {
        font-size: 1.04839vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section__note {
        font-size: 3.12297vw;
    }
}

.technology-section-inner {
    position: absolute;
    width: 495px;
    text-align: justify;
}

@media screen and (max-width: 1240px) {
    .technology-section-inner {
        width: 39.91935vw;
    }
}

@media screen and (max-width: 738px) {
    .technology-section-inner {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 89.7853%;
    }
}

/* ---------------------------------------------
*   js-modal-youtube
--------------------------------------------- */
.js-modal-youtube {
    display: block;
    outline: none;
}

/* ---------------------------------------------
*   fadeInUp
--------------------------------------------- */
[data-fadein],
[data-fadein2] {
    opacity: 0;
}

@-webkit-keyframes fadeInUp {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
}

.animated,
.animated2 {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;

    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.animated2 {
    -webkit-animation-delay: .5s;
    animation-delay: .5s;
}

.animated.infinite,
.animated2.infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

/*  <hr> tag as anchor target
--------------------------------------------- */
hr[id^="anchor"] {
    display: block;
    margin: 0;
    margin-top: -70px;
    padding: 0;
    padding-top: 70px;
    width: auto;
    height: 0;
    border: 0;
}

@media screen and (max-width: 738px) {
    hr[id^="anchor"] {
        margin-top: 0;
        padding-top: 0;
    }
}

/* ---------------------------------------------
*   opening-layer
--------------------------------------------- */
.opening-layer {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 0;
    height: 100vh;
    background-color: #000;
    opacity: 0;
    -webkit-transition: opacity 1s cubic-bezier(0.19, 1, 0.22, 1);
    transition: opacity 1s cubic-bezier(0.19, 1, 0.22, 1);
}

.opening-layer.movie-start {
    opacity: 1;
}

.opening-layer__movie {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 1;
    min-width: 100%;
    min-height: 100%;
    width: 100%;
    height: 100%;
}

.ie11 .opening-layer__movie--all {
    display: none;
}

.opening-layer__movie--ie {
    display: none;
}

.ie11 .opening-layer__movie--ie {
    display: block;
}

.opening-layer__control {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
}

.opening-layer.event-movie-end {
    opacity: 0;
}

.opening-layer__skip {
    position: absolute;
    bottom: 80px;
    left: 40px;
    display: inline-block;
    padding: 9px 25px;
    color: #ffdb00;
    text-align: center;
    font-weight: bold;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
}

.opening-layer__skip-icon {
    display: inline-block;
    margin-right: .3em;
    width: 30px;
}

@media screen and (min-width: 739px) {
    .opening-layer__skip-icon img[src$=".svg"] {
        width: 100%;
    }
}

.opening-layer__sound {
    position: absolute;
    bottom: 80px;
    left: 30px;
    padding: 10px;
    color: #fff;
    font-size: 1.28rem;
    opacity: .75;
    cursor: pointer;
}

.opening-layer__sound .fa-volume-up {
    display: none;
}

.opening-layer__sound.js-playing .fa-volume-off {
    display: none;
}

.opening-layer__sound.js-playing .fa-volume-up {
    display: inline;
}

/* ---------------------------------------------
*   loading
--------------------------------------------- */
#loader-bg {
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 9999;
    width: 100%;
    height: 100%;
    background: #000;
}

#loader {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 50%;
    z-index: 2;
    margin-left: -270px;
    width: 400px;
    color: #fff;
    text-align: center;
}

@media screen and (max-width: 738px) {
    #loader {
        margin-left: -65%;
        width: 100%;
    }
}

#page {
    position: relative;
}

#loderWrap {
    position: fixed;
    top: 0;
    width: 100vw;
    height: 100vh;
    background: #FFFFFF;
}

#loderWrap #loder {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 5px;
}

.lodaer-logo {
    position: absolute;
    top: 50%;
    right: 0;
    left: 0;
    opacity: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-animation: sdbh 4s 0s infinite;
    animation: sdbh 4s 0s infinite;
}

@-webkit-keyframes sdbh {
    0% {
        opacity: 1;
    }
    10% {
        opacity: 0;
    }
    20% {
        opacity: 1;
    }
    30% {
        opacity: 0;
    }
    35% {
        opacity: 1;
    }
    40% {
        opacity: 0;
    }
    45% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    55% {
        opacity: 1;
    }
    60% {
        opacity: 0;
    }
    62.5% {
        opacity: 1;
    }
    65% {
        opacity: 0;
    }
    67.5% {
        opacity: 1;
    }
    70% {
        opacity: 0;
    }
    72.5% {
        opacity: 1;
    }
    75% {
        opacity: 0;
    }
    77.5% {
        opacity: 1;
    }
    80% {
        opacity: 0;
    }
    82.5% {
        opacity: 1;
    }
    85% {
        opacity: 0;
    }
    87.5% {
        opacity: 1;
    }
    90% {
        opacity: 0;
    }
    91% {
        opacity: 1;
    }
    92% {
        opacity: 0;
    }
    93% {
        opacity: 1;
    }
    94% {
        opacity: 0;
    }
    95% {
        opacity: 1;
    }
    96% {
        opacity: 0;
    }
    97% {
        opacity: 1;
    }
    98% {
        opacity: 0;
    }
    99% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@keyframes sdbh {
    0% {
        opacity: 1;
    }
    10% {
        opacity: 0;
    }
    20% {
        opacity: 1;
    }
    30% {
        opacity: 0;
    }
    35% {
        opacity: 1;
    }
    40% {
        opacity: 0;
    }
    45% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    55% {
        opacity: 1;
    }
    60% {
        opacity: 0;
    }
    62.5% {
        opacity: 1;
    }
    65% {
        opacity: 0;
    }
    67.5% {
        opacity: 1;
    }
    70% {
        opacity: 0;
    }
    72.5% {
        opacity: 1;
    }
    75% {
        opacity: 0;
    }
    77.5% {
        opacity: 1;
    }
    80% {
        opacity: 0;
    }
    82.5% {
        opacity: 1;
    }
    85% {
        opacity: 0;
    }
    87.5% {
        opacity: 1;
    }
    90% {
        opacity: 0;
    }
    91% {
        opacity: 1;
    }
    92% {
        opacity: 0;
    }
    93% {
        opacity: 1;
    }
    94% {
        opacity: 0;
    }
    95% {
        opacity: 1;
    }
    96% {
        opacity: 0;
    }
    97% {
        opacity: 1;
    }
    98% {
        opacity: 0;
    }
    99% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

/* ---------------------------------------------
*   three-anime
--------------------------------------------- */
.three-anime {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: 100vh;
    outline: 0;
    background: url(../img/bg.gif) center no-repeat;
    background-size: cover;
}

@media screen and (max-width: 738px) {
    .three-anime {
        background-image: url(../img/sp/bg.gif);
    }
}

.three-anime:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    content: "";
}

@media screen and (min-width: 739px) {
    .pc-hide {
        display: none !important;
    }
}

@media screen and (max-width: 738px) {
    .sp-hide {
        display: none !important;
    }
}