@charset "utf-8";

/*----- キービジュアル */
/* .Keyvisual2024{
    background-image: url(../image2024/interview/bg_keyvisual.jpg);
    background-position: center bottom;
}
.Keyvisual2024__title{
    text-shadow: 5px 5px 20px rgba(51, 51, 51, .3),-5px 5px 20px rgba(51, 51, 51, .3),5px -5px 20px rgba(51, 51, 51, .3),-5px -5px 20px rgba(51, 51, 51, .6);
} */
.Keyvisual2024{
    position: relative;
}
.Keyvisual2024.-movie{
    padding-top: 56.2%;
    height: 0;
}
.Keyvisual2024__inner{
    height: auto;
}
.Interview__keyvisual{
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 2;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    opacity: 1;
    transition: .3s all ease-in-out;
}
.Interview__keyvisual.-movie{
    cursor: pointer;
}
.Interview__keyvisual img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 動画用 */
.Interview__keyvisual.-movie::before{
    content: "";
    display: block;
    width: 100px;
    height: 100px;
    background-image: url(../image2024/interview/icon_interview-movie.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
}
.Interview__keyvisual.-on{
    /* opacity: 0; */
    display: none;
}
.Interview__keyvisual__movie{
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}
.Bread2024{
    z-index: 3;
}
@media screen and (max-width: 680px){

    .Interview__keyvisual.-movie::before{
        width: 12.5vw;
        height: 12.5vw;
    }

}


/*----- ファーストコンテンツ -----*/
.First{
    padding-top: 100px;
    padding-bottom: 100px;
}
.First *{
    color: #333;
}
.First-header{
    margin-bottom: 95px;
    position: relative;
}
.First-header::before{
    content: "";
    display: block;
    width: 82px;
    height: 82px;
    position: absolute;
    right: 0;
    top: 0;
    background: #20ab84;
    clip-path: polygon(30% 0, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%);
    transform: rotate(15deg);
}
.First-header::after{
    content: "NEW";
    width: 82px;
    height: 82px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 700;
    position: absolute;
    right: 0;
    top: 0;
    color: #fff;
}
.First-header-category{
    margin-bottom: 15px;
}
.First-header-category__item{
    font-weight: 700;
    padding: 5px 10px;
    letter-spacing: .1em;
    color: #fff;
    background: #102d3b;
    display: inline-block;
}
.First-header-category__item:not(:last-child){
    margin-right: 10px;
}
.First-header__subtitle{
    font-size: 26px;
    margin-bottom: 10px;
    line-height: 1.4;
    font-weight: 700;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.First-header__title{
    font-size: 50px;
    letter-spacing: .05em;
    line-height: 1.3;
    font-weight: 700;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.First-worries{
    width: calc(100% - 115px);
    transform: translateX(115px);
    padding-top: 50px;
    padding-bottom: 55px;
    margin-bottom: 100px;
    background: #f5f5f5;
}
.First-worries-top{
    width: calc(100% + 115px);
    transform: translateX(-115px);
    padding-right: 75px;
    margin-bottom: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.First-worries-top:not(:has(.First-worries-top__image)){
    width: 100%;
    transform: translateX(0);
}
.First-worries-top__image{
    width: 210px;
    height: 210px;
}
.First-worries-top__image img{
    width: 100%;
}
.First-worries-top__body{
    width: calc(100% - 210px);
    padding-left: 60px;
}
.First-worries-top__tag{
    font-size: 18px;
    letter-spacing: .05em;
    font-weight: 700;
    color: #5096d2;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.First-worries-top__title{
    font-size: 38px;
    margin-bottom: 10px;
    line-height: calc(64 / 38);
    font-weight: 700;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.First-worries-bottom{
    width: 100%;
    padding-left: 90px;
    padding-right: 90px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.First-worries-bottom::before{
    content: "";
    display: block;
    width: 48px;
    height: 42px;
    background-image: url(../image2024/interview/icon_first-worries-bottom-arrow.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    order: 2;
}
.First-worries-bottom-block{
    width: calc((100% - 120px) / 2);
    padding: 25px 30px;
    background: #fff;
    position: relative;
}
.First-worries-bottom-block__tag{
    width: 70px;
    height: 70px;
    border-radius: 50%;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .05em;
    line-height: calc(20 / 16);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    top: 0;
    transform: translate(-46px,-26px)
}
.First-worries-bottom-block.-before{
    order: 1;
}
.First-worries-bottom-block.-after{
    order: 3;
}
.First-worries-bottom-block.-before .First-worries-bottom-block__tag{
    background: #7c7c7c;
}
.First-worries-bottom-block.-after .First-worries-bottom-block__tag{
    background: #5096d2;
}
.First-point{
    width: 100%;
    display: flex;
    align-items: stretch;
    justify-content: space-between;
}
.First-point-content{
    width: 50%;
    padding-right: 75px;
    padding-top: 25px;
    padding-bottom: 45px;
}
.First-point__title{
    width: calc(100% + 50px);
    font-size: 36px;
    margin-bottom: 20px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    color: #102d3b;
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.First-point__title::before{
    content: "";
    display: block;
    width: 47px;
    height: 47px;
    background-image: url(../image2024/interview/icon_first-point.png);
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
}
.First-point__title span{
    width: calc(100% - 47px);
    padding-left: 18px;
    line-height: 1.2;
    display: block;
}
.First-pooint__text{
    margin-bottom: 40px;
}
.First-point-data-wrap{
    border-top: 1px solid #102D3B;
}
.First-point-data{
    width: 100%;
    padding-left: 18px;
    padding-top: 15px;
    padding-bottom: 12px;
    border-bottom: 1px solid #102D3B;
    display: flex;
    align-items: flex-start;
    justify-items: flex-start;
}
.First-point-data__title{
    width: 140px;
    font-size: 18px;
    font-weight: 700;
}
.First-point-data__text{
    width: calc(100% - 140px);
    font-size: 18px;
}
.First-point__movie{
    width: 50%;
    height: 395px;
    position: relative;
}
.First-point__movie__image{
    width: 100%;
    height: 100%;
    z-index: 2;
    position: relative;
    opacity: 1;
    transition: .3s all ease-in-out;
    cursor: pointer;
}
.First-point__movie__image.-on{
    /* opacity: 0; */
    display: none;
}
.First-point__movie__image::before{
    content: "";
    display: block;
    width: 100px;
    height: 100px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-image: url(../image2024/interview/icon_interview-movie.png);
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
}
.First-point__movie__image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.First-point__movie__video{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}
.First-point__slider{
    width: 50%;
}
.First-point__slider-main{
    width: 100%;
    margin-bottom: 10px;
}
.First-point__slider-main__item{
    width: 100%;
}
.First-point__slider-main__item img{
    width: 100%;
    height: 425px;
    object-fit: cover;
}
.First-point__slider-thumb{
    width: 100%;
}
.First-point__slider-thumb__item{
    width: calc((100% - (10px * 4)) / 5);
    opacity: .6;
    transition: .3s all ease-in-out;
}
.First-point__slider-thumb__item:not(:last-child){
    margin-right: 10px;
}
.First-point__slider-thumb__item.swiper-slide-thumb-active{
    opacity: 1;
}
.First-point__slider-thumb__item img{
    width: 100%;
    height: 80px;
    object-fit: cover;
    cursor: pointer;
}
@media screen and (max-width: 680px){

    .First{
        padding-top: 13.333333vw;
        padding-bottom: 13.333333vw;
    }
    .First-header{
        margin-bottom: 7.5vw;
    }
    .First-header::before{
        width: 15vw;
        height: 15vw;
        top: -5vw;
    }
    .First-header::after{
        width: 15vw;
        height: 15vw;
        font-size: 3.5vw;
        top: -5vw;
    }
    .First-header-category{
        margin-bottom: 3.5vw;
    }
    .First-header-category__item{
        padding: 2vw;
        font-size: 3.5vw;
    }
    .First-header-category__item:not(:last-child){
        margin-right: 1.5vw;
    }
    .First-header__subtitle{
        font-size: 4vw;
        margin-bottom: 2.5vw;
    }
    .First-header__title{
        font-size: 5.5vw;
        line-height: calc(60 / 45);
    }
    .First-worries{
        width: 100%;
        transform: translateX(0);
        padding: 5vw;
        margin-bottom: 10vw;
    }
    .First-worries-top{
        width: 100%;
        transform: translateX(0);
        padding-right: 0;
        margin-bottom: 10vw;
        flex-direction: column;
    }
    .First-worries-top__image{
        width: 40%;
        margin-bottom: 3.5vw;
        height: auto;
    }
    .First-worries-top__body{
        width: 100%;
        padding-left: 0;
    }
    .First-worries-top__tag{
        font-size: 3.5vw;
        margin-bottom: 1.5vw;
    }
    .First-worries-top__title{
        font-size: 5vw;
        margin-bottom: 3.5vw;
        line-height: 1.3;
    }
    .First-worries-bottom{
        padding-left: 0;
        padding-right: 0;
        flex-direction: column;
    }
    .First-worries-bottom::before{
        width: 10vw;
        height: 10vw;
        margin-top: 2.5vw;
        margin-bottom: 10vw;
        transform: rotate(90deg);
    }
    .First-worries-bottom-block{
        width: 100%;
        padding: 10vw 5vw 5vw;
    }
    .First-worries-bottom-block__tag{
        width: 15vw;
        height: 15vw;
        font-size: 3.5vw;
        right: 0;
        margin-left: auto;
        margin-right: auto;
        transform: translate(0,-50%);
    }
    .First-worries-bottom-block.-before{
        order: 1;
    }
    .First-worries-bottom-block.-after{
        order: 3;
    }
    .First-point{
        flex-direction: column;
    }
    .First-point-content{
        width: 100%;
        padding-right: 0;
        padding-top: 0;
        padding-bottom: 0;
    }
    .First-point__title{
        width: 100%;
        font-size: 5vw;
        margin-bottom: 3.5vw;
    }
    .First-point__title::before{
        width: 10vw;
        height: 10vw;
    }
    .First-point__title span{
        width: calc(100% - 10vw);
        padding-left: 2.5vw;
    }
    .First-pooint__text{
        margin-bottom: 5vw;
    }
    .First-point-data-wrap{
        margin-bottom: 5vw;
    }
    .First-point-data{
        padding-left: 2.5vw;
        padding-top: 3vw;
        padding-bottom: 3vw;
    }
    .First-point-data__title{
        width: 30%;
        font-size: 3.5vw;
    }
    .First-point-data__text{
        width: 70%;
        font-size: 3.5vw;
    }
    .First-point__movie{
        width: 100%;
        height: 60vw;
    }
    .First-point__movie__image::before{
        width: 12.5vw;
        height: 12.5vw;
    }
    .First-point__slider{
        width: 100%;
    }
    .First-point__slider-main{
        margin-bottom: 2vw;
    }
    .First-point__slider-main__item img{
        height: 60vw;
    }
    .First-point__slider-thumb__item{
        width: calc((100% - (2vw * 4)) / 5);
    }
    .First-point__slider-thumb__item:not(:last-child){
        margin-right: 2vw;
    }
    .First-point__slider-thumb__item img{
        height: 15vw;
    }

}



/*----- インタビューご紹介 -----*/
.Interview{
    padding-top: 85px;
    padding-bottom: 100px;
    background: #f5f5f5;
}
.Interview-movie{
    height: 535px;
    width: 100%;
    margin-bottom: 75px;
    position: relative;
}
.Interview-movie__image{
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 2;
    opacity: 1;
    transition: .3s all ease-in-out;
    cursor: pointer;
}
.Interview-movie__image.-on{
    /* opacity: 0; */
    display: none;
}
.Interview-movie__image::before{
    content: "";
    display: block;
    width: 90px;
    height: 90px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-image: url(../image2024/interview/icon_interview-movie.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}
.Interview-movie__image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.Interview-movie__video{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}
.Interview__title{
    font-size: 52px;
    margin-bottom: 60px;
    color: #333;
}
.Interview__body{
    margin-bottom: 100px;
}
.Interview-block{
    padding: 50px 50px 65px;
}
.Interview-block + .Interview-block{
    margin-top: 55px;
}
.Interview-block__title{
    font-size: 30px;
    margin-bottom: 22px;
    font-weight: 700;
    line-height: 1.3;
    border-bottom: 1px solid;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.Interview-block__title::before{
    content: "Q";
    width: 78px;
    height: 78px;
    font-size: 40px;
    font-weight: 700;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}
.Interview-block__title span{
    width: calc(100% - 78px);
    padding: 10px 0 10px 25px;
}
.Interview-block__subtitle{
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 45px;
    line-height: 1.3;
}
.Interview-block__body{
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}
.Interview-block__image{
    width: 510px;
}
.Interview-block__image img{
    width: 100%;
}
.Interview-block__text{
    width: 100%;
}
.Interview-block__image + .Interview-block__text{
    width: 505px;
}
.Interview-block-movie{
    margin-top: 50px;
    height: 500px;
    position: relative;
}
.Interview-block-movie__image{
    width: 100%;
    height: 100%;
    z-index: 2;
    position: relative;
    cursor: pointer;
    transition: .3s all ease-in-out;
    opacity: 1;
}
.Interview-block-movie__image.-on{
    /* opacity: 0; */
    display: none;
}
.Interview-block-movie__image::before{
    content: "";
    display: block;
    width: 100px;
    height: 100px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-image: url(../image2024/interview/icon_interview-movie.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}
.Interview-block-movie__image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.Interview-block-movie__video{
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}
.Interview-last{
    margin-top: 110px;
}
.Interview__button{
    width: 490px;
}

/*----- 奇数 */
.Interview-block:nth-of-type(odd){
    background: #d8e8f6;
}
.Interview-block:nth-of-type(odd) .Interview-block__title,
.Interview-block:nth-of-type(odd) .Interview-block__subtitle,
.Interview-block:nth-of-type(odd) .Interview-block__text{
    color: #1c5382;
}
.Interview-block:nth-of-type(odd) .Interview-block__title::before{
    background: #1c5382;
}

/*----- 偶数 */
.Interview-block:nth-of-type(even){
    background: #fff;
}
.Interview-block:nth-of-type(even) .Interview-block__title,
.Interview-block:nth-of-type(even) .Interview-block__subtitle,
.Interview-block:nth-of-type(even) .Interview-block__text{
    color: #102d3b;
}
.Interview-block:nth-of-type(even) .Interview-block__title::before{
    background: #102d3b;
}
.Interview-block.-right .Interview-block__body{
    flex-direction: row-reverse;
}

/*----- 画像左配置 */
.Interview-block.-left .Interview-block__body{
    flex-direction: row;
}

/*----- 画像右配置 */
.Interview-block.-right .Interview-block__body{
    flex-direction: row-reverse;
}

/*----- フル */
.Interview-block.-full .Interview-block__body{
    flex-direction: column-reverse;
}
.Interview-block.-full .Interview-block__text{
    width: 100%;
    margin-bottom: 50px;
    padding-left: 15px;
    padding-right: 15px;
}
.Interview-block.-full .Interview-block__image{
    width: 100%;
}

.Interview-last{
    padding: 35px 18px 30px;
    background: #c0ebdf;
}
.Interview-last *{
    color: #333;
}
.Interview-last-top{
    width: 100%;
    margin-bottom: 25px;
    padding-left: 20px;
    padding-right: 40px;
    padding-bottom: 25px;
    border-bottom: 1px dotted #333;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.Interview-last-top__title{
    font-size: 26px;
    line-height: 1.3;
    font-weight: 700;
}
.Interview-last-top__name{
    font-size: 20px;
}
.Interview-last-client{
    width: 100%;
    padding-left: 20px;
    padding-right: 40px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
}
.Interview-last-client__name{
    width: calc((100% - 65px) / 2);
    font-size: 22px;
    font-weight: 700;
    line-height: 1.3;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}
.Interview-last-client__name:not(:nth-last-of-type(-n+2)){
    margin-bottom: 15px;
}
.Interview-last-client__name::before{
    margin-right: 6px;
    content: "●";
}
@media screen and (max-width: 680px){

    .Interview{
        padding-top: 13.333333vw;
        padding-bottom: 13.333333vw;
    }
    .Interview-movie{
        margin-bottom: 5vw;
        height: 53vw;
    }
    .Interview-movie__image::before{
        width: 12.5vw;
        height: 12.5vw;
    }
    .Interview__title{
        font-size: 6vw;
        margin-bottom: 5vw;
    }
    .Interview__body{
        margin-bottom: 7.5vw;
    }
    .Interview-block{
        padding: 5vw;
    }
    .Interview-block + .Interview-block{
        margin-top: 5vw;
    }
    .Interview-block__title{
        font-size: 4vw;
        margin-bottom: 5vw;
    }
    .Interview-block__title::before{
        width: 8.5vw;
        height: 8.5vw;
        font-size: 4vw;
    }
    .Interview-block__title span{
        width: calc(100% - 7.5vw);
        padding: 1.5vw 0 1.5vw 2.5vw;
    }
    .Interview-block__subtitle{
        font-size: 3.5vw;
        margin-bottom: 3.5vw;
    }
    .Interview-block__body,
    .Interview-block.-left .Interview-block__body,
    .Interview-block.-right .Interview-block__body{
        flex-direction: column;
    }
    .Interview-block__text{
        width: 100%;
    }
    .Interview-block__image + .Interview-block__text{
        width: 100%;
    }
    .Interview-block__image{
        width: 100%;
        margin-bottom: 5vw;
    }
    .Interview-block-movie{
        margin-top: 5vw;
        height: 47vw;
    }
    .Interview-block-movie__image::before{
        width: 12.5vw;
        height: 12.5vw;
    }
    .Interview-block.-full .Interview-block__text{
        margin-bottom: 0;
        padding-left: 0;
        padding-right: 0;
    }
    
    .Interview-last{
        margin-top: 7.5vw;
        padding: 5vw;
    }
    .Interview-last-top{
        width: 100%;
        margin-bottom: 3.5vw;
        padding-left: 0;
        padding-right: 0;
        padding-bottom: 3.5vw;
        flex-direction: column;
        align-items: flex-start;
    }
    .Interview-last-top__title{
        font-size: 3.5vw;
        margin-bottom: 1.5vw;
    }
    .Interview-last-top__name{
        font-size: 3.5vw;
    }
    .Interview-last-client{
        padding-left: 0;
        padding-right: 0;
    }
    .Interview-last-client__name{
        width: calc((100% - 3.5vw) / 2);
        font-size: 3.5vw;
    }
    .Interview-last-client__name:not(:nth-last-of-type(-n+2)){
        margin-bottom: 1.5vw;
    }
    .Interview-last-client__name::before{
        margin-right: 1vw;
    }
    .Interview__button{
        width: 100%;
    }

}



/*----- 最近のお客様の声インタビュー -----*/
.Other{
    padding-top: 85px;
    padding-bottom: 100px;
}
.Other__title{
    font-size: 46px;
    margin-bottom: 80px;
}
.Other-block-wrap{
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}
.Other-block{
    width: calc((100% - (30px * 2)) / 3);
}
.Other-block__image{
    width: 100%;
    margin-bottom: 22px;
    position: relative;
}
.Other-block__image a{
    width: 100%;
    display: block;
    position: relative;
    overflow: hidden;
}
.Other-block__image a:hover img{
    transform: scale(1.1);
}
.Other-block__image img{
    width: 100%;
    height: 270px;
    object-fit: cover;
    transition: .3s all ease-in-out;
    position: relative;
    z-index: 2;
}
.Other-block__title{
    font-size: 20px;
    margin-bottom: 15px;
    font-weight: 700;
    line-height: calc(28 / 20);
}
.Other-block__text{
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: 0;
    text-align: right;
    z-index: 2;
    position: relative;
}
.Other-block__text::before{
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    position: absolute;
    left: 0;
    top: 50%;
    z-index: -1;
    background: #102D3B;
}
.Other-block__text span{
    padding-left: 12px;
    display: inline-block;
    background: #fff;
}
/*----- 動画 */
.Other-block.-movie .Other-block__image{
    cursor: pointer;
}
.Other-block.-movie .Other-block__image__inner{
    display: block;
    position: relative;
}
.Other-block.-movie .Other-block__image__inner::before{
    content: "";
    display: block;
    width: 70px;
    height: 70px;
    background-image: url(../image2024/interview/icon_interview-movie.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 3;
}
.Other-block.-movie .Other-block__movie{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}
.Other-block.-movie .Other-block__image__inner.-on{
    /* opacity: 0; */
}
@media screen and (max-width: 680px){

    .Other{
        padding-top: 13.333333vw;
        padding-bottom: 13.333333vw;
    }
    .Other__title{
        font-size: 6vw;
        margin-bottom: 5vw;
    }
    .Other-block-wrap{
        flex-wrap: wrap;
    }
    .Other-block{
        width: 100%;
    }
    .Other-block:not(:last-child){
        margin-bottom: 7.5vw;
    }
    .Other-block__image{
        margin-bottom: 3.5vw;
    }
    .Other-block__image img{
        height: 60vw;
    }
    .Other-block.-movie .Other-block__image__inner::before{
        width: 10vw;
        height: 10vw;
    }
    .Other-block__title{
        font-size: 3.5vw;
        line-height: calc(36 / 24);
        margin-bottom: 2vw;
    }
    .Other-block__text span{
        padding-left: 2.5vw;
    }
    /*----- 動画 */
    .Other-block.-movie .Other-block__image a::before{
        width: 12.5vw;
        height: 12.5vw;
    }

}