/* 共通部分 */
.main-wrap {
    font-family: 'Zen Kaku Gothic New', sans-serif;
}


/* kv
-------------------------------------------------- */
.kv__img {
    background-image: url(/img/recruit/interview/bg_kv_pc.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    height: 43.125vw;
    width: 100%;
    position: relative;
}
.kv__img::before {
    content: '';
    height: 100%;
    width: 100%;
    background-color: #00082F;
    opacity: .8;
    position: absolute;
    left: 0;
    top: 0;
}

/* voice */
.interview-kv-area .kv-voice {
    position: absolute;
    top: 2.6041666vw;
    left: 5.2083333vw;
    width: 19.53125vw;
}

/* kvキャラクター */
.circus-man_imgBox {
    position: absolute;
    top: 6.7708333vw;
    left: 19.7395833vw;
    width: 23.59375vw;
}

/* staffsFile */
.kv__staffsFileWrap {
    position: absolute;
    top: 8.2291666vw;
    right: 8.125vw;
}
.kv__staffsFile {
    width: 43.1770833vw;
}


/* question
-------------------------------------------------- */
/* 質問の設定 */
.question_wrapper {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

.questions {
    /* aspect-ratio: 1/1; */
    border-top: solid .15625vw #000;
    border-left: solid .15625vw #000;
    list-style: none;
    padding: 2.34375vw 3.4895833vw 5.7291666vw;
    text-align: left;
    width: calc(100%/3);
}

.question_wrapper > li:nth-child(3n+1) {
    border-left: none;
}

.questions > h3 {
    height: 3.125vw;
}

.questions > h3 img {
    display: block;
    height: 100%;
    margin: 0 auto;
    width: auto;
}

.question_contents dt {
    border-top: solid .15625vw #000;
    color: #000;
    font-size: 1.3020833vw;
    font-weight: 700;
    line-height: 1.48;
    margin: 2.6041666vw auto 0;
    padding: 1.5625vw 0 0;
}

.question_contents dd {
    background-color: #fff;
    border: solid .15625vw #000;
    color: #000;
    font-size: 0.8333333333333334vw;
    font-weight: 500;
    line-height: 1.875;
    margin: 1.40625vw auto 0;
    padding: 1.3020833vw 2.8125vw 1.0416666vw;
}

/* 質問の背景色設定 */
.background-color_pink {
    background-color: #F0A2C3;
}

.background-color_yellow {
    background-color: #FFF278;
}

.background-color_blue {
    background-color: #90BBFF;
}

.background-color_green {
    background-color: #6BC15F;
}

.background-color_orange {
    background-color: #F2AD71;
}

.background-color_purple {
    background-color: #BFBAFF;
}

/* OMAKE設定 */
.question-comment {
    color: #000;
    font-size: 1.0416666666666665vw;
    line-height: 1.5em;
    text-align: justify;
}

.omake {
    width: calc(100% / 3 * 2);
    padding: 0;
    border-left: solid .15625vw #000;
    list-style: none;

}

.omake-designer {
    grid-row: 3/ 4;
}


.omake-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50%;
    width: 100%;
    text-align: center;

}

.omake-img {
    width: 24.21875%;

}

/* 隠れOMAKE設定 */
.hide {
    height: 50%;

}

.hide_wrapper {
    display: flex;
    height: 100%;
}

.hide-questions {
    background-color: #FFFAC4;
    border-right: solid .15625vw #000;
    list-style: none;
    padding: 1.5625vw 1.8229166vw .5208333vw;
    width: calc( 100% / 4 );
}

@media screen and (min-width:767px) {
    .hide-questions:last-child {
        border-right: none;
    }
}

.hide-questions:first-child {
    background-color: #F2AD71;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    cursor: pointer;
}

.hide-question_contents {
    height: 100%;
    overflow-y: auto;
    -ms-overflow-style: none; /* IE, Edge スクロールバー消去 */
    scrollbar-width: none; /* Firefox スクロールバー消去 */
}
.hide-question_contents::-webkit-scrollbar {
    display: none;
}

.hide-questions img {
    width: 50%;
}

.hide-question_contents dt {
    color: #000;
    font-size: 1.0416666666666665vw;
    font-weight: bold;
    text-align: justify;

}

.hide-question_contents dd {
    color: #000;
    font-size: 0.8333333333333334vw;
    text-align: justify;
    padding-top: 1.5625vw;
    margin-top: auto;
}

/* ホバーで現れる設定 */
.omake-change {
    border-top: solid .15625vw #000;
    height: 50%;
    overflow: hidden;
    position: relative;
    cursor: pointer;
}

.omake-wrapper,
.hide {
    height: 100%;
}

.omake-wrapper {
    transition: top .7s;
    top: 0;
    left: 0;
    position: absolute;
}

.omake-change:hover .omake-wrapper {
    top: -100%;
}

/* 矢印設定 */
.yajirushi-comment_wrapper {
    width: 100%;
    display: flex;
    border-top: solid .15625vw #000;
}

.accordion-wrapper {
    display: none;
}

.question-comment-box {
    border-left: solid .15625vw #000;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50%;
    text-align: justify;
    padding: 0 2.5%;
}

.yajirushi-a-box {
    width: 50%;
}

.yajirushi-a-box img {
    height: 100%;
}

.yajirushi-b-box {
    display: flex;
    height: 50%;
    border-top: solid .15625vw #000;
}

.yajirushi-b-zone {
    border-right: solid .15625vw #000;
    width: calc(100%/4);
}

.yajirushi-b-zone img {
    height: 100%;
    object-fit: cover;
}

.work-life {
    display: flex;
    align-items: center;
    width: calc(100%/4*3);
    padding: 0 4%;
}


/* 各ページ専用
-------------------------------------------------- */
@media screen and (min-width:767px) {
    /* ディレクター兼エンジニア */
    .interview_directorengineer .hide-question_contents dd {
        padding-top: .525vw;
    }
}




/* sp
================================================== */
@media screen and (max-width:766px) {

    .kv__img {
        height: 128vw;
    }

    /* voice */
    .interview-kv-area .kv-voice {
        top: 5.33333vw;
        left: 5.33333vw;
        width: 56.3813333vw;
        z-index: 10;
    }
    
    /* kvキャラクター */
    .circus-man_imgBox {
        top: 14.1333333vw;
        left: 8vw;
        width: 82.4vw;
    }

    /* staffsFile */
    .kv__staffsFileWrap {
        border-left: max(.5333333vw, 2px) solid #000;
        border-right: max(.5333333vw, 2px) solid #000;
        background-color: rgba(0, 8, 47, .8);
        position: initial;
        padding: 5.33333vw 4vw;
    }
    .kv__staffsFile {
        width: 100%;
    }


    /* question
    -------------------------------------------------- */
    .question_wrapper {
        display: initial;
    }

    .questions {
        border-right: none;
        border-left: none;
        border-top: max(.5333333vw, 2px) solid #000;
        padding: 6.666667vw 7.46667vw 8.53333vw;
        width: 100%;
    }

    .questions > h3 {
        height: 10.0266666vw;
    }

    .question_contents dt {
        border-top: solid max(.5333333vw, 2px) #000;
        font-size: 4.26667vw;
        line-height: 1.5;
        padding: 3.46667vw 4vw 0;
        margin-top: 3.36vw;
    }

    .question_contents dd {
        border: solid max(.5333333vw, 2px) #000;
        font-size: 3.73334vw;
        line-height: 1.5;
        margin: 4vw auto 0;
        min-height: 186px;
        padding: 5.33333vw 4vw;
    }

    .question ul .omake {
        border-left: none;
        padding: 0;
        width: 100%;
    }

    .yajirushi-comment_wrapper {
        border-top: max(.5333333vw, 2px) solid #000;
        flex-direction: column;
    }

    .yajirushi-a-box {
        border-right: none;
        height: 50%;
        width: 100%;
    }

    .question-comment-box {
        border-top: max(.5333333vw, 2px) solid #000;
        border-left: none;
        font-size: 4.266667vw;
        font-weight: 500;
        line-height: 1.5;
        padding: 5.33333vw 8vw;
        width: 100%;
    }

    .question-comment {
        font-size: 4.26667vw;
        font-weight: 500;
    }

    .work-life {
        border-top: max(.5333333vw, 2px) solid #000;
        font-size: 4.266667vw;
        font-weight: 500;
        line-height: 1.5;
        padding: 5.33333vw 8vw;
        width: 100%;
    }

    /* 矢印 */
    .yajirushi-b-box {
        border-top: max(.5333333vw, 2px) solid #000;
        flex-direction: column;
    }

    .yajirushi-b-zone,
    .work-life {
        border-right: none;
        width: 100%;
    }

    .omake-wrapper_sp {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 41.0666666vw;
        margin-right: 9.33334vw;
    }

    .accordion-wrapper {
        display: block;
    }

    #accordion-checkbox {
        display: none;
    }

    .accordion-label {
        display: flex;
        justify-content: right;
        align-items: center;
        border-top: solid max(.5333333vw, 2px) #000;
        border-bottom: solid max(.5333333vw, 2px) #000;
        padding: 6.93334vw 0 6.66667vw;
    }

    .accordion-label:after {
        content: "";
        display: block;
        width: 12vw;
        height: 12vw;
        background-image: url("/img/recruit/interview/button-a.png");
        background-size: cover;
        margin-right: 8vw;
    }

    .accordion-btn {
        width: 12%;
        margin-right: 7vw;
    }

    .accordion-content {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        text-align: center;
        background-color: #FFFAC4;
        border-bottom: solid max(0.5333333vw, 2px) #000;
    }

    .accordion-question_contents {
        height: 100%;
        display: flex;
        flex-direction: column;
        gap: 4vw 0;
        padding: 5.33333vw 13.33333vw;
    }

    .accordion-question_contents dt {
        color: #000;
        font-size: 4.26667vw;
        font-weight: bold;
        line-height: 1.3125;
        text-align: center;
    }

    .accordion-question_contents dd {
        color: #000;
        font-size: 3.73334vw;
        text-align: left;
    }

    .accordion-content_wrapper li:last-child {
        padding-bottom: 5.33333vw;
    }
    .accordion-content_wrapper {
        display: none;
    }

    /* アコーディオン展開中にコンテンツを表示 */
    #accordion-checkbox:checked~.accordion-content_wrapper {
        display: block;
    }

    /* アコーディオン展開中にボタンを変更 */
    #accordion-checkbox:checked~.accordion-label:after {
        background-image: url("/img/recruit/interview/button-b.png");
    }
}


/* カルーセル
-------------------------------------------------- */
.scrollImgWrap {
    background-color: #EAEAEA;
    position: relative;
    padding: 13.6vw 0 20.266667vw;
    height: 160.8vw;
}

@media all and (min-width: 767px) {
    .scrollImgWrap {
        height: 32.96875vw;
        padding: 2.6041666vw 0 5.5208333vw;
    }
}


.scrollImgWrap::before {
    content: '';
    border: max(.533333vw, 2px) solid #000;
    position: absolute;
    left: 0;
    top: 76.53333vw;
    width: 100%;
}
@media all and (min-width: 767px) {
    .scrollImgWrap::before {
        border: .15625vw solid #000;
        top: 15.1041666vw;
    }
}

.scrollImg__btnWrap {
    position: absolute;
    bottom: 13.33333vw;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 52vw;
    width: 100%;
    z-index: 10;
}

@media all and (min-width: 767px) {
    .scrollImg__btnWrap {
        gap: 0 2.6041666vw;
        bottom: 2.3958333vw;
        right: 2.6041666vw;
        left: initial;
        width: initial;
    }
}

.swiper-button-prev,
.swiper-button-next {
    background-position: center;
    background-size: calc(100% - 1px);
    background-repeat: no-repeat;
    height: calc(16vw + 1px);
    width: calc(16vw + 1px);
    position: initial;
}

@media all and (min-width: 767px) {
    .swiper-button-prev,
    .swiper-button-next {
        height: calc(4.9479166vw + 1px);
        width: calc(4.9479166vw + 1px);
    }
}

.swiper-button-prev::after,
.swiper-button-next::after {
    display: none;
}

.swiper-button-prev {
    background-image: url(/img/recruit/interview/btn_re.svg);
}

.swiper-button-next {
    background-image: url(/img/recruit/interview/btn_ne.svg);
}

.swiper-button-prev:hover {
    background-image: url(/img/recruit/interview/btn_re_hov.svg);
}

.swiper-button-next:hover {
    background-image: url(/img/recruit/interview/btn_ne_hov.svg);
}

.swiper-button-prev:hover,
.swiper-button-next:hover {
    cursor: pointer;
}


/* インタビュー 
-------------------------------------------------- */
.recruit .interview-link-area__ttl {
    color: #000;
    font-size: 4.266667vw;
    font-weight: 500;
    line-height: 1.5;
    text-align: left;
    padding: 5.3333333vw 7.46667vw 5.0666666vw;
}

@media all and (min-width: 767px) {
    .recruit .interview-link-area__ttl {
        font-size: 1.30208vw;
        line-height: 1.44;
        padding: .78125vw 1.5625vw;
        padding: .78125vw 1.40625vw .7291666vw;
        text-align: left;
    }
}

/* リスト */
.recruit .interview-link-area__list {
    border-top: max(.5333333vw, 2px) solid #000;
}

@media all and (min-width: 767px) {
    .recruit .interview-link-area__list {
        border-top: .15625vw solid #000;
        display: flex;
        flex-wrap: wrap;
    }
}

.recruit .interview-link-area__list li {
    border-bottom: max(.5333333vw, 2px) solid #000;
}

@media all and (min-width: 767px) {
    .recruit .interview-link-area__list li {
        border-bottom: .15625vw solid #000;
        border-right: .15625vw solid #000;
        width: 33.33333%;
        min-height: 13.90625vw;
    }

    .recruit .interview-link-area__list li:nth-child(3n+3) {
        border-right: none;
    }
}

.recruit .interview-link-area__list li a {
    color: #000;
    display: block;
    padding: 7.466667vw 0;
    height: 100%;
}

@media all and (min-width: 767px) {
    .recruit .interview-link-area__list li a {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
}

/* 各職種別 */
.recruit .interview-link-area__list .interview-link-area__front a {
    padding: 7.466667vw 0 6.9333333vw;
}

.recruit .interview-link-area__list .interview-link-area__directorEnsineer a {
    padding: 7.466667vw 0 4.5333333vw;
}

@media all and (min-width: 767px) {
    .recruit .interview-link-area__list .interview-link-area__director a {
        gap: 0 .5208333vw;
        padding: 1.7708333vw 1.71875vw 1.8229166vw 1.9791666vw;
    }

    .recruit .interview-link-area__list .interview-link-area__front a {
        gap: 0 .5208333vw;
        padding: 1.7708333vw 1.9270833vw 2.4479166vw 1.9270833vw
    }

    .recruit .interview-link-area__list .interview-link-area__directorEnsineer a {
        gap: 0 .5208333vw;
        padding: 2.2916666vw 1.875vw 2.34375vw 2.0833333vw;

    }

    .recruit .interview-link-area__list .interview-link-area__designer a {
        gap: 0 .5208333vw;
        padding: 2.3958333vw 1.0416666vw 2.6041666vw 2.0833333vw;
    }
}

.recruit .interview-link-area__list li a:hover {
    opacity: 1;
}

.recruit .interview-link-area__director {
    background-color: #BFBAFF;
}

.recruit .interview-link-area__front {
    background-color: #C1E4F5;
}

.recruit .interview-link-area__directorEnsineer {
    background-color: #F68652;

}

.recruit .interview-link-area__designer {
    background-color: #F0A2C3;
}

/* タイトル */
.recruit .interview-link-area__list .ttlWrap {
    padding: 0 7.46667vw;
}

@media all and (min-width: 767px) {
    .recruit .interview-link-area__list .ttlWrap {
        padding: 0;
        position: relative;
    }
}

@media all and (min-width: 767px) {
    .recruit .interview-link-area__director .ttlWrap {
        margin-top: 1.0416666vw;
        width: 100%;
    }

    .recruit .interview-link-area__front .ttlWrap {
        margin-top: .7291666vw;
    }

    .recruit .interview-link-area__designer .ttlWrap {
        margin-top: 1.0416666vw;
    }
}

.recruit .interview-link-area__list .ttl {
    display: table;
    border-bottom: max(.5333333vw, 2px) solid #000;
    padding-bottom: 3.7333333vw;
}

@media all and (min-width: 767px) {
    .recruit .interview-link-area__list .ttl {
        border-bottom: .1041666vw solid #000;
        display: flex;
        flex-direction: column;
        padding-bottom: .5208333vw;
    }
}

.recruit .interview-link-area__list .ttl .en {
    display: block;
    font-size: 6.13333vw;
    font-weight: 600;
    line-height: 1;
    text-align: left;
    letter-spacing: -.01em;
}

@media all and (min-width: 767px) {
    .recruit .interview-link-area__list .ttl .en {
        display: inherit;
        font-size: max(.9375vw, 10px);
        line-height: 1;
        letter-spacing: -.01em;
    }
}

.recruit .interview-link-area__list .ttl .jp {
    display: block;
    font-size: 4.266667vw;
    font-weight: 500;
    line-height: 1;
    text-align: left;
    margin-top: 2.66667vw;
}

@media all and (min-width: 767px) {
    .recruit .interview-link-area__list .ttl .jp {
        display: inherit;
        font-size: max(.7291666vw, 10px);
        line-height: 1.428571428;
        margin-top: .2604166vw;
    }
}

.recruit .interview-link-area__list .period {
    font-size: 4.266667vw;
    font-weight: 500;
    line-height: 1;
    text-align: left;
    margin-top: 2.66667vw;
}

@media all and (min-width: 767px) {
    .recruit .interview-link-area__list .period {
        font-size: max(.7291666vw, 10px);
        line-height: 1.428571428;
        margin-top: .5208333vw;
    }
}

/* アニメーション */
@keyframes bound {

    /** 開始時は１倍の大きさ */
    from {
        transform: scale(1);
    }

    /** 0%～25%にかけて1.15倍する */
    25% {
        transform: scale(1.15);
    }

    /** 25%～50%にかけて0.95倍する */
    50% {
        transform: scale(0.95);
    }

    /** 50%～75%にかけて1.05倍する */
    75% {
        transform: scale(1.05);
    }

    /** 終了時は元の大きさに戻す */
    to {
        transform: scale(1);
    }
}

@media all and (min-width: 767px) {
    .recruit .interview-link-area__list li:hover .message__balloon {
        -webkit-animation: bound 1s ease-in;
        -moz-animation: bound 1s ease-in;
        animation: bound 1s ease-in;
    }
}

/* メッセージ */
.recruit .interview-link-area__list .message {
    position: relative;
}

.recruit .interview-link-area__list .message__txt {
    font-size: 5.6vw;
    font-weight: 700;
    line-height: 1.57143;
    text-align: center;
    position: relative;
    z-index: 100;
}

.recruit .interview-link-area__list .message__balloon {
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

@media all and (min-width: 767px) {
    .recruit .interview-link-area__list .message__txt {
        font-size: 1.1458333vw;
        line-height: 1.59090909;
        white-space: nowrap;
    }
}


/* インタビューメッセージ
-------------------------------------------------- */
/* director */
.recruit .interview-link-area__director .message {
    margin: 8vw auto 0;
    min-width: 84vw;
}

.recruit .interview-link-area__director .message__txt {
    padding: 10.66667vw 1em;
}

.recruit .interview-link-area__director .message__balloon {
    background-image: url(/img/recruit/top/bg_balloon_01.svg);
}

/* front */
.recruit .interview-link-area__front .message {
    margin: 2.66667vw auto 0;
    min-width: 86.4vw;
}

.recruit .interview-link-area__front .message__txt {
    padding: 15.2vw 0 11.65333vw;
}

.recruit .interview-link-area__front .message__balloon {
    background-image: url(/img/recruit/top/bg_balloon_02.svg);
}

/* directorEnsineer */
.recruit .interview-link-area__directorEnsineer .message {
    margin: 3.2vw auto 0;
    min-width: 85.70934vw;
}

.recruit .interview-link-area__directorEnsineer .message__txt {
    padding: 14.7733vw 0 14.08vw;
}

.recruit .interview-link-area__directorEnsineer .message__balloon {
    background-image: url(/img/recruit/top/bg_balloon_03.svg);
}

/* designer */
.recruit .interview-link-area__designer .message {
    margin: 4.5333333vw 0 0;
    min-width: 95.2vw;
}

.recruit .interview-link-area__designer .message__txt {
    padding: 7.14667vw 0 7.14667vw;
}

.recruit .interview-link-area__designer .message__balloon {
    background-image: url(/img/recruit/top/bg_balloon_04.svg);
}

@media all and (min-width: 767px) {

    /* director */
    .recruit .interview-link-area__director .message {
        margin: 0;
        min-width: initial;
    }

    .recruit .interview-link-area__director .message__txt {
        padding: 3.2291666vw 4.0625vw 3.2291666vw 4.4791666vw;
    }

    .recruit .interview-link-area__director .message__balloon {
        background-image: url(/img/recruit/interview/bg_balloon_01_pc.svg);
    }

    /* front */
    .recruit .interview-link-area__front .message {
        margin: 0;
        min-width: initial;
    }

    .recruit .interview-link-area__front .message__txt {
        padding: 3.2291666vw 1.5625vw 2.7604166vw 1.3020833vw;
    }

    .recruit .interview-link-area__front .message__balloon {
        background-image: url(/img/recruit/interview/bg_balloon_02_pc.svg);
    }

    /* directorEnsineer */
    .recruit .interview-link-area__directorEnsineer .message {
        margin: 0;
        min-width: initial;
    }

    .recruit .interview-link-area__directorEnsineer .message__txt {
        padding: 2.6041666vw 2.0833333vw;
    }

    .recruit .interview-link-area__directorEnsineer .message__balloon {
        background-image: url(/img/recruit/interview/bg_balloon_03_pc.svg);
    }

    /* designer */
    .recruit .interview-link-area__designer .message {
        margin: 0;
        min-width: initial;
    }

    .recruit .interview-link-area__designer .message__txt {
        padding: 1.9270833vw 3.0208333vw 1.5104166vw 3.0208333vw;
    }

    .recruit .interview-link-area__designer .message__balloon {
        background-image: url(/img/recruit/interview/bg_balloon_04_pc.svg);
    }
}


/* スクロール白 */
.scrollTextWrap.white {
    border-top: max(.5333333vw, 2px) solid #000;
}
@media all and (min-width: 767px) {
    .scrollTextWrap.white {
        border-top: solid .15625vw #000;
    }
}

/* 募集職種 */
.sec_openPositions {
    border-bottom: max(.5333333vw, 2px) solid #000;
}
@media all and (min-width: 767px) {
    .sec_openPositions {
        border-bottom: solid .15625vw #000;
    }
}