@charset "utf-8";

/*---------------------*/
/*------reset-------*/
/*---------------------*/
html {
    overflow-x: hidden;
}

* {
    position: relative;
    margin: 0;
    padding: 0;
    font-size: inherit;
    width: auto;
    height: auto;
    border: none;
    box-sizing: border-box;
    color: inherit;
    font-weight: inherit;
    text-decoration: none;
    list-style-type: none;
    font-family: "Zen Kaku Gothic New", sans-serif;
    transition: opacity .2s;
    color: #474747;
}

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: #F5F1E3;
}

a,
button {
    cursor: pointer;
}

a:hover,
button:hover {
    opacity: .6;
}

img,
svg {
    display: block;
    width: 100%;
    height: auto;
}

/*---------------------*/
/*------variables-------*/
/*---------------------*/

.newTeacher {
    --colorA: #62C0B4;
    --colorB: #35B5D2;
    --profColor: #F4AC92;
    --txtColor: inherit;
}

.midTeacher {
    --colorA: #ED7980;
    --colorB: #FFABCE;
}

.midNurse {
    --colorA: #F18E38;
    --colorB: #F4AC92;
}

.recruiter {
    --profColor: #01AAFF;
    --txtColor: #fff;
}

/*---------------------*/
/*------fonts-------*/
/*---------------------*/
.serif,
.serif * {
    font-family: "Noto Serif JP", serif;
}

.roboto,
.roboto * {
    font-family: "Roboto", sans-serif;
}

/*---------------------*/
/*-------common--------*/
/*---------------------*/
.common__content {
    max-width: 1200px;
    margin-right: auto;
    margin-left: auto;
}

@media only screen and (max-width: 768px) {
    .common__content {
        max-width: 400px;
    }
}

.recruitSpecial__selectionFlow__inner {
    margin-right: 30px;
    margin-left: 30px;
}

.common__inner {
    margin-right: 15px;
    margin-left: 15px;
}

.common__btn {
    display: inline-flex;
    cursor: pointer;
    padding: .8em 36px;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 0 10px #0000002e;
    gap: 1em;
    width: 100%;
    max-width: 318px;
}

.common__btn::after {
    content: "";
    width: 1.2em;
    height: 1.2em;
    background: #000;
    mask: url(../images/svg/arrow.svg) no-repeat center/contain;
    margin-left: auto;
}

.common__pagenateBtn {
    display: inline-block;
    width: 50px;
    height: 50px;
    border-radius: 10px;
    padding: 0;
    background: #fff;
    box-shadow: 0 0 10px #0000002e;
}

.common__pagenateBtn::after {
    content: "";
    width: 1.2em;
    height: 1.2em;
    background: #000;
    mask: url(../images/svg/arrow.svg) no-repeat center/contain;
    margin-left: auto;
    display: block;
    margin: auto;
}

.common__pagenateBtn__prev:after {
    transform: scaleX(-1);
}

.common__ttl {
    display: flex;
    align-items: center;
    font-family: "Noto Serif JP", serif;
    font-size: clamp(16px, 1.66vw, 20px);
    font-weight: 500;
    line-height: 1.8;
    gap: 20px;
    height: 1.8em;
}

.common__ttl::before {
    content: "";
    display: block;
    width: 4em;
    height: 5em;
    background: var(--ttlicon) no-repeat center/contain;
}

.common__ttl::after {
    content: "";
    width: 33%;
    height: 7px;
    margin-left: auto;
    background: url(../images/ttl-stripe-bar.jpg) no-repeat right center/contain;
}

.common__listTtl {
    display: list-item;
    padding-left: 1.2em;
}

.common__listTtl::before {
    content: "";
    position: absolute;
    display: inline-block;
    width: .8em;
    height: .8em;
    background: #FFE7B3;
    border-radius: 30px;
    margin-right: .4em;
    top: .3em;
    left: 0;
}

@media only screen and (max-width: 768px) {
    .common__ttl {
        flex-direction: column;
        height: auto;
    }

    .common__ttl::before {
        content: none;
    }

    .common__ttl::after {
        display: block;
        width: 188px;
        margin: auto;
        background: url(../images/ttl-stripe-bar_sp.jpg) no-repeat right center/contain;
    }
}


/*---------------------*/
/*-------only pc/sp--------*/
/*---------------------*/

@media only screen and (min-width: 769px) {
    .disp__onlySp {
        display: none !important;
    }
}

@media only screen and (max-width: 768px) {
    .disp__onlyPc {
        display: none !important;
    }
}

/*---------------------*/
/*-------header--------*/
/*---------------------*/
.recruitSpecial__header {
    position: fixed;
    width: 100%;
    top: 35px;
    z-index: 9999;
    margin: auto;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__header {
        top: 16px;
    }
}

.recruitSpecial__header__content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    max-width: 1920px;
    margin: auto;
}

/*---------------------*/
/*  gnav
/*---------------------*/
.header__gnavWrapper {
    width: 85%;
    max-width: 1380px;
    background: #FFF;
    border-radius: 30px;
    box-shadow: 0 0 16px #0002;
}

.recruitSpecial__gnav {
    padding: 1.5em 0.5em;
}

.recruitSpecial__gnav__linkList {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}

.recruitSpecial__gnav__linkItem {
    align-content: center;
}

.recruitSpecial__gnav__link {
    display: block;
    font-size: clamp(7px, 0.88vw, 15px);
    color: #000;
    font-weight: 700;
    line-height: 1em;
    transition: color 0.2s, opacity 0.2s;
}

.recruitSpecial__gnav__link:hover {
    color: #0054A7;
    opacity: 1;
}

.header__hamb {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 18px 22px;
    margin-left: auto;
    background: none;
}

@media only screen and (max-width: 768px) {
    :has(.header__hamb.open) {
        overflow-y: hidden;
    }
}

.header__hamb__txt {
    opacity: 1;
    transition: opacity 0.2s;
    font-weight: 600;
    color: #51A7DD;
}

.header__hamb__open {
    position: absolute;
    right: 0;
    left: 0;
    text-align: center;
}

.close .header__hamb__close {
    opacity: 0;
}

.open .header__hamb__open {
    opacity: 0;
}

.header__hamb__figure {
    width: 28px;
    height: 3px;
    border-radius: 10px;
    background: #474747;
    margin: 8px 0;
    border-radius: 20px;
}

.header__hamb__figure::before,
.header__hamb__figure::after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background: #474747;
}

.header__hamb__figure,
.header__hamb__figure::before,
.header__hamb__figure::after {
    transition: all 0.8s;
}

.open .header__hamb__figure {
    transform: rotate(180deg);
    background: transparent;
}

.open .header__hamb__figure::before {
    transform: rotate(135deg);
    top: 0;
}

.open .header__hamb__figure::after {
    transform: rotate(225deg);
    top: 0;
}

.header__hamb__figure::before {
    top: -8px;
}

.header__hamb__figure::after {
    top: 8px;
}

.header__hamb__linkList {
    margin-top: 36px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.header__hamb__link {
    color: #fff;
    background: linear-gradient(to right, var(--colorB), var(--colorA));
}

.header__hamb__link::after {
    background: #fff;
}

@media only screen and (max-width: 768px) {
    .header__gnavWrapper {
        position: fixed;
        overflow: hidden;
        margin: 10px;
        width: 140px;
        height: 60px;
        top: 0;
        right: 0;
        transition: all 0.5s;
        transform-origin: right top;
        display: flex;
        flex-direction: column;
    }

    .header__gnavWrapper:has(.open) {
        width: 355px;
        height: calc(100% - 20px);
        max-height: max-content;
    }

    .header__gnavWrapper::before,
    .header__gnavWrapper::after {
        content: "";
        position: absolute;
        width: 100%;
        height: 20px;
        z-index: 1;
    }

    .header__gnavWrapper::before {
        top: 60px;
        background: linear-gradient(#fff 20%, transparent);
    }

    .header__gnavWrapper::after {
        bottom: 0;
        background: linear-gradient(transparent, #fff 80%);
    }

    .recruitSpecial__gnav {
        opacity: 0;
        transition: opacity 0.3s;
        overflow-y: scroll;
        padding: 0 30px 40px;
    }

    .recruitSpecial__gnav__linkList {
        flex-direction: column;
        text-align: left;
        align-items: stretch;
    }

    .open+.recruitSpecial__gnav {
        opacity: 1;
    }

    .recruitSpecial__gnav__link {
        font-size: 22px;
        line-height: 2.4;
        white-space: nowrap;
    }
}


/*---------------------*/
/*  mv
/*---------------------*/
.mv__wrapper {
    padding: clamp(0px, 12vw, 226px) 0 120px;
}

.mv__wrapper::after {
    content: "";
    position: absolute;
    display: block;
    width: clamp(400px, 30vw, 595px);
    right: 5%;
    bottom: -2%;
    z-index: 1;
    height: 500px;
    background: url(../images/mv-illust02.png) no-repeat bottom/contain;
}

.mv__top {
    max-width: 100vw;
    overflow-x: hidden;
    align-content: center;
    height: clamp(0px, 30vw, 589px);
}

.mv__imgWrapper {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    align-content: center;
}

.mv__imgs {
    width: 100%;
    max-width: 1920px;
    margin: auto;
    display: flex;
    justify-content: right;
    gap: clamp(0px, 2vw, 40px);
}

.mv__img {
    width: 45%;
}

.mv__img img {
    overflow: hidden;
    border-radius: 20px;
}

.mv__img01 {
    margin-top: 10%;
}

.mv__img01::before {
    content: "";
    display: block;
    position: absolute;
    width: 28%;
    height: 38%;
    background: url(../images/mv-illust01.png) no-repeat center/contain;
    z-index: 1;
    top: -35%;
    right: 0;
}

.mv__img02 {
    margin-bottom: 10%;
}

.mv__copyTxt {
    width: 100%;
    max-width: 1920px;
    font-size: clamp(60px, 9.37vw, 180px);
    mix-blend-mode: difference;
    margin: auto;
    line-height: 1.6;
}

.mv__copyTxt01,
.mv__copyTxt02 {
    font-weight: 500;
    white-space: nowrap;
    display: block;
    width: 100%;
    color: #d9d9d9cc;
}

.mv__copyTxt01 {
    left: -.1em;
}

.mv__copyTxt02 {
    text-align: right;
    right: -.75em;
}

.mv__bottom {
    width: clamp(0px, 85.9vw, 1650px);
    margin: auto;
}

.mv__txt {
    margin-top: 46px;
    font-size: clamp(14px, 1.83vw, 22px);
    line-height: 2.2;
    letter-spacing: .2em;
    z-index: 2;
    font-weight: 500;
}

@media only screen and (max-width: 768px) {
    .mv__wrapper {
        padding-top: 84px;
        padding-bottom: 141px;
    }

    .mv__top {
        aspect-ratio: none;
        padding: 0;
        height: auto;
    }

    .mv__img01::before {
        width: 80px;
        height: 86px;
        top: inherit;
        right: -65px;
        bottom: -10px;
    }

    .mv__wrapper::after {
        width: 100%;
        right: 0;
        bottom: -10px;
        background: url(../images/mv-illust02_sp.png) no-repeat bottom/326px;
    }

    .mv__imgWrapper {
        position: inherit;
    }

    .mv__imgs {
        flex-direction: column;
        gap: 20vw;
        margin-top: 17.5%;
    }

    .mv__img {
        width: 85%;
        margin: 0;
    }

    .mv__img01 {
        margin-left: calc(-40vw / 7.5);
    }

    .mv__img02 {
        margin-right: calc(-40vw / 7.5);
        margin-left: auto;
    }

    .mv__copyTxt {
        font-size: 18.6vw;
        display: flex;
        flex-direction: column;
        gap: 25vw;
        position: absolute;
        top: 0;
    }

    .mv__copyTxt01,
    .mv__copyTxt02 {
        left: 0;
        right: 0;
        text-align: left;
    }

    .mv__txt {
        font-size: 14px;
        line-height: 1.9;
        margin-top: 24px;
    }
}

/*---------------------*/
/*  reason
/*---------------------*/
.recruitSpecial__reason {
    background: linear-gradient(to bottom, #fff, transparent 470px);
    --ttlicon: url(../images/ttl-icon_reasons.png);
    padding-top: 100px;
}

.recruitSpecial__copy {
    font-size: clamp(24px, 5vw, 60px);
    font-weight: 500;
    margin-top: 80px;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__reason {
        padding-top: 76px;
    }

    .recruitSpecial__copy {
        font-size: 24px;
        line-height: 1.4;
        margin-top: 50px;
    }
}

.recruitSpecial__reason__description {
    margin-top: 57px;
    font-size: clamp(14px, 1.83vw, 22px);
    line-height: 2.2;
    letter-spacing: .2em;
    width: 72.8%;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__reason__description {
        width: 100%;
        margin-top: 21px;
        font-size: 14px;
        line-height: 2.2;
    }
}

.recruitSpecial__reason__description__em {
    background: #fff;
}

.recruitSpecial__boxList {
    margin-top: 64px;
    display: grid;
    grid-template-columns: repeat(3, calc(95% / 3));
    gap: 2.5% clamp(16px, 2.5vw, 30px);
    align-items: stretch;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__boxList {
        grid-template-columns: 100%;
        gap: 20px;

    }
}


.recruitSpecial__boxItem {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: max-content;
    gap: 26px 20px;
    counter-increment: recruitSpecial__boxItem 1;
    border-radius: 20px;
    background: #fff;
    padding: 20px;
    padding-bottom: 32px;
}

.recruitSpecial__boxItem:first-of-type,
.recruitSpecial__boxItem:nth-of-type(7) {
    background: #FFE7B3;
}

.recruitSpecial__boxItem:nth-of-type(2),
.recruitSpecial__boxItem:nth-of-type(8) {
    background: #FFC1CB;
}

.recruitSpecial__boxItem:nth-of-type(3),
.recruitSpecial__boxItem:nth-of-type(9) {
    background: #B5E4D5;
}

.recruitSpecial__boxItem:nth-of-type(4) {
    background: #D3BCE8;
}

.recruitSpecial__boxItem:nth-of-type(5) {
    background: #C5E8F2;
}

.recruitSpecial__boxItem:nth-of-type(6) {
    background: #FFC4A6;
}

.recruitSpecial__boxItem:nth-child(1)::after {
    content: "";
    display: block;
    position: absolute;
    bottom: -5%;
    right: 10%;
    width: 10%;
    height: 20%;
    background: url(../images/reason-illust01.png)no-repeat bottom center/contain;
}

.recruitSpecial__boxItem:nth-child(5)::after {
    content: "";
    display: block;
    position: absolute;
    bottom: -4%;
    left: 5%;
    width: 13%;
    height: 25%;
    background: url(../images/reason-illust02.png)no-repeat bottom center/contain;
}

.recruitSpecial__boxItem:nth-child(8)::after {
    content: "";
    display: block;
    position: absolute;
    bottom: -10%;
    right: 7%;
    width: 15%;
    height: 25%;
    background: url(../images/reason-illust03.png)no-repeat bottom center/contain;
}

.recruitSpecial__boxImg {
    grid-column: 1/3;
    aspect-ratio: 35/20;
    border-radius: 20px;
    overflow: hidden;
}

.recruitSpecial__boxIndex {
    font-weight: 600;
    font-size: 14px;
    text-align: center;
    display: block;
    line-height: 1.8;
    color: #fff;
}

.recruitSpecial__boxIndex::before {
    content: "0" counter(recruitSpecial__boxItem);
    font-size: clamp(20px, 4.16vw, 50px);
    display: block;
    line-height: 1;
}

.recruitSpecial__boxTtl {
    font-size: clamp(16px, 2.15vw, 26px);
    font-weight: 500;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__boxTtl {
        font-size: 26px;

    }

    .recruitSpecial__boxIndex::before {
        font-size: 50px;
    }

    .recruitSpecial__boxItem:nth-child(1)::after,
    .recruitSpecial__boxItem:nth-child(5)::after,
    .recruitSpecial__boxItem:nth-child(8)::after {
        content: none;
    }
}

.recruitSpecial__boxTxt {
    margin-top: 10px;
    font-size: 16px;
    line-height: 1.7;
}

.reasons__btmIllust__wrapper {
    width: 100%;
    bottom: -15px;
    z-index: 1;
    margin-top: 10%;
}

.reasons__btmIllust {
    width: 250px;
    margin: auto;
}

@media only screen and (max-width: 768px) {
    .reasons__btmIllust {
        width: 167px;
    }
}



/*---------------------*/
/*  numbers
/*---------------------*/
.recruitSpecial__numbers {
    background: #fff;
    --ttlicon: url(../images/ttl-icon_number.png);
    padding-top: 120px;
}

.recruitSpecial__numbersList {
    display: grid;
    gap: 20px;
    margin-top: 100px;
}

@media only screen and (max-width: 768px) {

    .recruitSpecial__numbers {
        padding-top: 64px;
    }

    .recruitSpecial__numbersList {
        display: flex;
        flex-direction: column;
        margin-top: 53px;
        gap: 10px;
    }
}

.recruitSpecial__numbersItem {
    background: #F6F6F6;
    border-radius: 30px;
    padding: 30px 45px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 20px;
}

.recruitSpecial__numbersItem:nth-child(1) {
    grid-column: 1/4;
    grid-row: 1/5;
}

.recruitSpecial__numbersItem:nth-child(2) {
    grid-column: 4/7;
    grid-row: 1/3;
}

.recruitSpecial__numbersItem:nth-child(3) {
    grid-column: 4/7;
    grid-row: 3/5;
}

.recruitSpecial__numbersItem:nth-child(4) {
    grid-column: 1/4;
    grid-row: 5/8;
}

.recruitSpecial__numbersItem:nth-child(5) {
    grid-column: 4/7;
    grid-row: 5/8;
}

.recruitSpecial__numbersItem:nth-child(6) {
    grid-column: 1/7;
    grid-row: 8/10;
}

.recruitSpecial__numbersItem:nth-child(7) {
    grid-column: 1/3;
    grid-row: 10/12;
}

.recruitSpecial__numbersItem:nth-child(8) {
    grid-column: 3/5;
    grid-row: 10/12;
}

.recruitSpecial__numbersItem:nth-child(9) {
    grid-column: 5/7;
    grid-row: 10/12;
}

.recruitSpecial__numbersItem-title {
    font-size: clamp(26px, 3vw, 36px);
    font-weight: 500;
}

.recruitSpecial__numbersItem__txt {
    font-size: clamp(14px, 1.5vw, 18px);
    line-height: 1.7;
    text-align: center;
}

.recruitSpecial__numbersItem-date {
    font-size: clamp(12px, 1.16vw, 14px);
    text-align: center;
}

.recruitSpecial__numbersItem-image {
    max-width: 880px;
    margin: auto;
}

.from .recruitSpecial__numbersItem-image {
    margin-top: -25%;
    margin-bottom: -20%;
}


@media only screen and (max-width: 768px) {

    .recruitSpecial__numbersItem {
        padding: 20px 26px;
    }

    .from .recruitSpecial__numbersItem-image {
        overflow-y: hidden;
        overflow-x: scroll;
        margin-top: -65%;
        margin-bottom: -50%;
    }

    .from .recruitSpecial__numbersItem-image img {
        width: 200%;
    }

    .swipeIcon__wrapper {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        align-content: center;
        text-align: center;
        pointer-events: none;
    }

    .swipeIcon {
        display: inline-block;
        background: url(../images/svg/swiperarrow.svg) no-repeat center 30%/70%, #D9D9D980;
        width: 150px;
        align-content: center;
        height: 150px;
        border-radius: 1000px;
        box-shadow: 0 0 5px #00000059;
        opacity: .7;
        transition: opacity .5s;
        /* フェードアウトのトランジション */
    }

    .swipeIcon__hand {
        width: 40%;
        height: auto;
        margin: auto;
        opacity: 1;
        animation: swipeAnimation 1.5s ease-in-out infinite;
        /* アニメーションを適用 */
    }

    @keyframes swipeAnimation {
        0% {
            transform: translateX(-80%);
            /* 左から流れる */
            opacity: 0;
            /* 初期状態は透明 */
        }

        50% {
            opacity: 1;
            /* 完全に表示 */
        }

        100% {
            transform: translateX(80%);
            /* 右へ流れる */
            opacity: 0;
            /* 最後は透明 */
        }
    }

    .from:has(:hover) .swipeIcon__wrapper,
    .from:has(:active) .swipeIcon__wrapper,
    .from:has(:focus) .swipeIcon__wrapper {
        opacity: 0;
        /* ホバー、タップ、クリック、ドラッグ、スワイプ時に非表示 */
    }
}

.from .recruitSpecial__numbersItem-date {
    text-align: right;
}


.numbers__btmIllust__wrapper {
    width: 100%;
    bottom: -15px;
    z-index: 1;
    margin-top: 10%;
}

.numbers__btmIllust {
    width: 167px;
    margin-left: auto;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__numbersItem__txt {
        text-align: left;
    }

    .numbers__btmIllust {
        width: 120px;
    }
}

/*---------------------*/
/*  voice
/*---------------------*/
.recruitSpecial__voices {
    --ttlicon: url(../images/ttl-icon_voices.png);
    padding-top: 126px;
    padding-bottom: 326px;
    padding-bottom: clamp(100px, 27vw, 326px);
}

.recruitSpecial__voices__inner {
    margin-right: 15px;
    margin-left: 15px;
}

.recruitSpecial__voiceSwitcher {
    display: flex;
    margin-top: 106px;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__voices {
        padding-top: 54px;
        padding-bottom: 120px;
        width: 100vw;
        overflow-x: hidden;
    }

    .recruitSpecial__voices__inner {
        margin: 0;
    }

    .recruitSpecial__voiceSwitcher {
        display: block;
        margin-top: 0;
    }
}

.recruitSpecial__voiceList {
    display: flex;
    flex-direction: column;
}


.recruitSpecial__voiceContent {
    flex-grow: 1;
    margin-left: -10%;
    display: flex;
    flex-direction: column;
    gap: 10px;
    border-radius: 20px;
    background: #fff;
    overflow: hidden;
}

.recruitSpecial__voice {
    opacity: 0;
    transition: all .6s ease;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    padding-left: 20%;
    align-content: center;
    counter-increment: recruitSpecial__voice 1;
    left: 60px;
    top: 30px;
}


.recruitSpecial__voice.current {
    /* アクティブな要素は表示 */
    opacity: 1;
    left: 0;
    top: 0;

    pointer-events: all;
}

.recruitSpecial__voiceList__item.hidden {
    height: 0;
    opacity: 0;
}

.recruitSpecial__voice__copyBtn {
    appearance: none;
    background: transparent;
    border: none;
    display: inline;
    font-size: clamp(26px, 3vw, 36px);
    line-height: 1.6;
    text-align: left;
    margin-top: 10px;
    pointer-events: none;
}


.recruitSpecial__voice.current .recruitSpecial__voice__copyBtn {
    z-index: 1;
    pointer-events: all;
}

.recruitSpecial__voice__copyBtn__small {
    display: flex;
    align-items: center;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    text-decoration: underline;
    gap: .3em;
    margin-top: 20px;

    font-family: "Zen Kaku Gothic New", sans-serif;
}

.recruitSpecial__voice__copyBtn__small::after {
    content: "";
    display: block;
    width: .7em;
    height: .7em;
    background: linear-gradient(transparent calc(100% - 3px), #0054A7 0), linear-gradient(to right, transparent calc(100% - 3px), #0054A7 0);
    transform: rotate(-45deg);
}

.recruitSpecial__voice__profile {
    margin-top: 45px;
}

.recruitSpecial__voice__role {
    font-size: 18px;
    line-height: 1.7;
}

.recruitSpecial__voice__name {
    font-size: 20px;
    line-height: 1.7;
    margin-top: 6px;
}

.recruitSpecial__voiceNavigation {
    position: absolute;
    height: 50px;
    bottom: 8%;
    right: 50%;
    z-index: 2;
    display: flex;
    gap: 16px;
}

.recruitSpecial__voice__index {
    display: flex;
    gap: .5em;
    color: #A880F8;
    font-size: 20px;
    font-weight: 600;
}

.recruitSpecial__voice__index::after {
    content: "0" counter(recruitSpecial__voice);
    display: block;
}


.recruitSpecial__voiceListWrapper {
    aspect-ratio: 5/3;
    width: 55%;
    height: 33%;
    z-index: 1;
}


@media only screen and (max-width: 768px) {
    .recruitSpecial__voiceListWrapper {
        aspect-ratio: 449/717;
        width: 120%;
        height: 100%;
        margin-left: -10%;
        pointer-events: none;
        overflow: visible;
        top: 30px;
    }

    .recruitSpecial__voice__copyBtn {
        margin-top: 0;
    }

    .recruitSpecial__voice__name {
        margin-top: 0;
    }

    .recruitSpecial__voice.current {
        opacity: 1;
        left: 0;
        top: 0;
        pointer-events: all;
        bottom: 0;
        right: 0;
        padding: 44px;
        padding-top: 65%;
    }

    .recruitSpecial__voice__profile {
        margin-top: 29px;
    }
}

.recruitSpecial__voiceListWrapper::before {
    content: "";
    height: 100%;
    width: 60%;
    border-radius: 1000px;
    display: block;
    position: absolute;
    left: 10%;
    right: 30%;
    border: 5px #fff dashed;
}

.recruitSpecial__voiceList {
    position: absolute;
    width: 100%;
    height: 100%;
}

.recruitSpecial__voiceList__item {
    position: absolute;
    aspect-ratio: 1/1;
    transition: transform 1s, left 0.8s, top 0.8s, right 0.8s, bottom 0.8s, width 0.8s, opacity .2s;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 0;
}

.recruitSpecial__voiceList__item.current {
    width: 70%;
    right: 0;
    top: -10%;
    bottom: 10%;
    left: 30%;
    z-index: 1;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__voiceList {
        overflow-x: hidden;
        pointer-events: none;
    }

    .recruitSpecial__voiceList__item {
        pointer-events: all;
    }

    .recruitSpecial__voiceList__item.current {
        top: 0;
        left: 15%;
        right: 15%;
    }

}

.recruitSpecial__voiceList__item:not(.current) {
    left: 0;
    width: 20%;
    right: 80%;
}

.recruitSpecial__voiceList__item:not(.current):hover {
    opacity: .6;
}

.recruitSpecial__voiceList__item.passive01 {
    top: 0;
    bottom: calc(200%/3);
}

.recruitSpecial__voiceList__item.passive02 {
    top: calc(100%/3);
    bottom: calc(100%/3);
}

.recruitSpecial__voiceList__item.passive03 {
    top: calc(200%/3);
    bottom: 0;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__voiceNavigation {
        gap: calc(100% - 140px);
        justify-content: center;
        width: 100vw;
        max-width: 400px;
        left: 50%;
        transform: translateX(-50%);
        top: 20%;
        pointer-events: all;
    }

    .recruitSpecial__voiceListWrapper::before {
        content: none;
    }

    .recruitSpecial__voiceList__item:not(.current) {
        width: 32%;
        left: inherit;
        right: inherit;
        top: 78%;
    }

    .recruitSpecial__voiceList__item.passive01 {
        left: 0%;
        right: 68%;
    }

    .recruitSpecial__voiceList__item.passive02 {
        right: 34%;
        left: 34%;
    }

    .recruitSpecial__voiceList__item.passive03 {
        right: 0%;
        left: 68%;
    }

    .recruitSpecial__voiceContent {
        aspect-ratio: 375/600;
        width: 100%;
        top: 0;
        margin: auto;
        position: absolute;
        margin-top: 66px;
    }

    .recruitSpecial__voice {
        padding: 0;
        padding-top: 70%;
    }
}


/*---------------------*/
/*  voice - モーダル
/*---------------------*/


.voices__modal.close {
    opacity: 0;
    pointer-events: none;
}

/*モーダルが開いている時はスクロール無効*/
:has(.voices__modal.open) {
    overflow-y: hidden;
}

.voices__modal {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10000;
    backdrop-filter: blur(2px);
    align-content: center;
    width: 100vw;
}

.voices__modal__bg {
    background: #0004;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.voices__modal__contentWrapper {
    display: flex;
    gap: 50px;
    justify-content: center;
    align-items: center;
}


.voices__modal__content {
    width: 1000px;
    min-height: 645px;

    background: #fff;
    border-radius: 10px;
    overflow-x: hidden;
    overflow-y: scroll;
    border: 5px solid #fff;
    border-left: none;
}

/* Webkit系ブラウザ（Chrome, Safariなど）用のカスタムスタイル */
.voices__modal__content {
    padding-right: 15px;
    /* 右側に余白を追加 */
    padding-top: 5px;
    /* 上側に余白を追加 */
    padding-bottom: 5px;
    /* 下側に余白を追加 */
}

.voices__modal__content::-webkit-scrollbar {
    right: 5px;
    /* スクロールバーの位置 */
    width: 8px;
    /* スクロールバーの幅 */
}

.voices__modal__content::-webkit-scrollbar-thumb {
    background-color: darkgrey;
    /* スクロールバーの色 */
    border-radius: 10px;
    /* スクロールバーの角を丸くする */
}

.voices__modal__content::-webkit-scrollbar-track {
    background: none;
    /* スクロールバーのトラックの色 */
}

@media only screen and (max-width: 768px) {
    .voices__modal__contentWrapper {
        display: grid;
        grid-template-columns: repeat(2, 50px);
        grid-template-rows: 70vh 50px;
        justify-content: space-between;
        gap: 20px;
        margin: auto;
        width: 90vw;
        max-width: 512px;
    }

    .voices__modal__content {
        width: 100%;
        grid-column: 1/3;
        grid-row: 1/2;
        min-height: 0;
        height: 100%;
        overflow-y: scroll;
    }
}

.voices__modal__closeBtn {
    position: sticky;
    display: flex;
    margin-left: auto;
    font-weight: 700;
    font-size: clamp(14px, 1.5vw, 18px);
    background: none;
    gap: .5em;
    align-items: center;
    top: 1em;
    right: 1em;
    z-index: 1;
    text-shadow: 0 0 .5em #fff, 0 0 .5em #fff, 0 0 .5em #fff, 0 0 .5em #fff, 0 0 .5em #fff, 0 0 .5em #fff;
}

.voices__modal__closeBtn::after {
    content: "";
    display: inline-block;
    width: .8em;
    height: .8em;
    background: linear-gradient(to right, transparent calc(50% - 1px), #ccc 0, #ccc calc(50% + 1px), transparent 0),
        linear-gradient(to bottom, transparent calc(50% - 1px), #ccc 0, #ccc calc(50% + 1px), transparent 0);
    transform: rotate(45deg);
}

.recruitSpecial__modalVoice {
    counter-increment: recruitSpecial__modalVoice 1;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    transition: all 1s ease;
    opacity: 1;
}


.recruitSpecial__modalVoice:not(.current) {
    pointer-events: none;
    opacity: 0;
    --slideWidth: 100%;
}

.recruitSpecial__modalVoice.passive01,
.recruitSpecial__modalVoice.passive02 {
    left: var(--slideWidth);
    right: calc(-1*var(--slideWidth));
}

.recruitSpecial__modalVoice.passive03 {
    left: calc(-1*var(--slideWidth));
    right: var(--slideWidth);
}

.voices__modal__columnWrapper {
    display: grid;
    grid-template-columns: 396fr 439fr;
    gap: clamp(16px, 2.6vw, 32px) clamp(16px, 3.5vw, 42px);
    margin-top: 40px;
    padding: 20px clamp(15px, 5vw, 60px) 40px;
}


.voices__modal__textContent {
    grid-column: 1/2;
}

.voices__modal__index {
    display: flex;
    gap: .5em;
    color: #A880F8;
    font-size: 20px;
    font-weight: 600;
}

.voices__modal__index::after {
    content: "0" counter(recruitSpecial__modalVoice);
    display: block;
}

.voices__modal__copy {
    display: inline-block;
    display: inline;
    font-size: clamp(26px, 2.66vw, 32px);
    white-space: nowrap;
    line-height: 1.6;
    text-align: left;
    margin-top: 10px;
}

.voices__modal__interview {
    font-size: 18px;
    font-size: clamp(14px, 1.5vw, 18px);
    line-height: 1.7;
    font-weight: 500;
}

.voices__modal__role {
    margin-top: 36px;
    font-size: 18px;
    font-size: clamp(14px, 1.5vw, 18px);
    line-height: 1.7;
    font-weight: 500;
}

.voices__modal__name {
    font-size: clamp(18px, 2vw, 24px);
    line-height: 1.7;
    font-weight: 500;
}

.voices__modal__tenure {
    font-size: .8em;
    margin-left: .5em;
}

.voices__modal__mediaContent {
    grid-column: 2/3;
    grid-row: 1/3;
}




.voices__modal__movie {
    aspect-ratio: 16/9;
    width: 100%;
    background: url(../images/voice-movie-comingsoon.jpg) no-repeat center/cover;
    border-radius: 10px;
}

.voices__modal__imgs {
    display: flex;
    gap: 19px;
    margin-top: 19px;
}

.voices__modal__img {
    aspect-ratio: 210/132;
    width: 100%;
    grid-row: 2/3;
    background: #ccc;
    border-radius: 10px;
    overflow: hidden;
}

@media only screen and (max-width: 768px) {
    .voices__modal__columnWrapper {
        display: block;
        padding-top: 0;
    }

    .voices__modal__interview {
        font-size: 14px;
        margin-top: 20px;
    }

    .voices__modal__role {
        margin-top: 27px;
        font-size: 18px;
    }

    .voices__modal__name {
        font-size: 24px;
    }

    .voices__modal__mediaContent {
        margin-top: 40px;
    }

    .voices__modal__tenure {
        display: block;
        margin-left: 0;
    }

    .voices__modal__imgs {
        gap: 13px;
        margin-top: 13px;
    }
}

/*---------------------*/
/*  座談会
/*---------------------*/
.recruitSpecial__discussion__head {
    display: block;
    background: #FFC1CB;
}

.recruitSpecial__discussion__head::before {
    content: "";
    display: block;
    width: 100%;
    height: 500px;
    bottom: 0;
    position: absolute;
    background: url(../images/discussiton-ttlBg.png) no-repeat center bottom;
    background-size: 1500px;
}

@media only screen and (max-width: 1200px) {
    .recruitSpecial__discussion__head::before {
        background-size: 125%;
    }
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__discussion__head {
        height: 150px;
    }

    .recruitSpecial__discussion__head::before {
        background: url(../images/discussiton-ttlBg_sp.png) no-repeat center bottom;
        background-size: 477px;
    }
}

.recruitSpecial__discussion__headImg {
    width: 60%;
    margin: auto;
    top: clamp(-108px, -9vw, -9vw);
    margin-bottom: clamp(-108px, -9vw, -9vw);
    padding-bottom: 64px;
}

.recruitSpecial__discussion__headImg::before {
    content: "";
    display: block;
    width: 100px;
    height: 100px;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    background: linear-gradient(to right, transparent calc(50% - 1.5px), #fff 0, #fff calc(50% + 1.5px), transparent 0),
        linear-gradient(transparent calc(50% - 1.5px), #fff 0, #fff calc(50% + 1.5px), transparent 0);
    top: 60px;
}

.recruitSpecial__discussion__ttl {
    color: #fff;
    text-align: center;
    font-size: clamp(20px, 5.833vw, 70px);
    padding: 1.5em;
    line-height: 1.8;
    --strokeColor: #FFC1CB;
    text-shadow: 0.075em 0 0 var(--strokeColor), -0.075em 0 0 var(--strokeColor), 0 0.075em 0 var(--strokeColor), 0 -0.075em 0 var(--strokeColor), 0.05em 0.05em 0 var(--strokeColor), -0.05em -0.05em 0 var(--strokeColor), 0.05em -0.05em 0 var(--strokeColor), -0.05em 0.05em 0 var(--strokeColor), 0.035em 0.075em 0 var(--strokeColor), -0.035em -0.075em 0 var(--strokeColor), 0.075em -0.035em 0 var(--strokeColor), -0.075em 0.035em 0 var(--strokeColor), 0.075em 0.035em 0 var(--strokeColor), -0.075em -0.035em 0 var(--strokeColor), 0.035em -0.075em 0 var(--strokeColor), -0.035em 0.075em 0 var(--strokeColor), 0.065em 0.025em 0 var(--strokeColor), -0.065em -0.025em 0 var(--strokeColor), 0.025em -0.065em 0 var(--strokeColor), -0.025em 0.065em 0 var(--strokeColor), 0.025em 0.065em 0 var(--strokeColor), -0.025em -0.065em 0 var(--strokeColor), 0.065em -0.025em 0 var(--strokeColor), -0.065em 0.025em 0 var(--strokeColor);
}

.recruitSpecial__discussion__content {
    background: #F6F6F6;
}

.recruitSpecial__discussion__columnWrapper {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0 3.3%;
    padding-bottom: 116px;
    max-width: 1120px;
    margin: auto;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__discussion__columnWrapper {
        display: block;
        padding-bottom: 65px;
    }

    .recruitSpecial__discussion__contentWrapper {
        width: 100vw;
        overflow-x: hidden;
    }

    .recruitSpecial__discussion__headImg {
        width: 104.8%;
        top: 0;
        padding: 30px 0 40px;
        margin: auto;
        margin-left: -2.4%;
    }

    .recruitSpecial__discussion__ttl {
        width: 100%;
        position: absolute;
        padding: 0;
        bottom: -.5em;
        line-height: 1;
        z-index: 1;
        font-size: 40px;
    }

    .recruitSpecial__discussion__headImg::before {
        width: 60px;
        height: 60px;
        top: 60px;
    }
}

.recruitSpecial__talk__profile {
    display: block;
    height: max-content;
    position: sticky;
    top: 140px;
    background: #fff;
    border-radius: 10px;
    padding: 8%;
    width: auto;
}


@media only screen and (max-width: 768px) {
    .recruitSpecial__talk__profile {
        position: inherit;
        top: 0;
    }
}


.recruitSpecial__discuss__main {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.recruitSpecial__talk__profile__title {
    text-align: center;
    line-height: 1;
    position: absolute;
    right: 0;
    left: 0;
    top: -.5em;
    color: #A880F8;
    font-size: 20px;
    font-weight: 600;
}

.recruitSpecial__discussion__question {
    font-size: 26px;
    line-height: 1.6;
    background: linear-gradient(to bottom, transparent 60%, #fff 0);
    display: flex;
    gap: .5em;
    align-items: center;
    color: #01AAFF;
    font-weight: 700;
    width: max-content;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__discuss__main {
        gap: 20px;
    }

    .recruitSpecial__discussion__question {
        font-size: 18px;
    }

    .recruitSpecial__discussion__item+.recruitSpecial__discussion__item {
        margin-top: 20px;
    }
}

.recruitSpecial__discussion__question::before {
    content: "Q";
    font-family: "Roboto", sans-serif;
}

.recruitSpecial__discussion__script {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 20px;
    margin-top: 30px;
}

.discussion__name {
    grid-column: 1/2;
    width: clamp(52px, 7.33vw, 88px);
    padding: .5em;
    text-align: center;
    font-size: clamp(10px, 1.16vw, 14px);
    font-weight: 500;
    border-radius: 7px;
    height: max-content;
    background: var(--profColor);
    color: var(--txtColor);
}

.discussion__em {
    background: linear-gradient(to bottom, transparent 15%, #B0EAFF 0, #B0EAFF 90%, transparent 0);
}

.recruitSpecial__discussion__p {
    font-size: clamp(14px, 1.5vw, 18px);
    line-height: 1.7;
    font-weight: 500;
}

.recruitSpecial__discussion__copy {
    font-size: clamp(20px, 2.33vw, 28px);
    font-weight: 600;
    background: #fff;
    padding: calc(.8em + 16px) 1.5em .8em;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__discussion__script {
        gap: 14px 20px;
    }

    .recruitSpecial__discussion__copy {
        margin-top: 30px;
        font-size: 20px;
    }
}

.recruitSpecial__discussion__copy::before {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    right: 0;
    left: 0;
    height: 16px;
    background: linear-gradient(140deg, #F4AC92 10%, #FED52B 0, #FED52B 20%, #B0EAFF 0, #B0EAFF 50%, #FED52B 0, #FED52B 53%, #F4AC92 0, #F4AC92 80%, #FED52B 0);
}

.recruitSpecial__discussion__profImg {
    background: var(--profColor);
    display: block;
    aspect-ratio: 1 / 1;
    width: 32%;
}

.recruitSpecial__talk__profile__item {
    display: flex;
    gap: 8%;
    align-items: center;
}

.recruitSpecial__talk__profile__row {
    display: block;
}

.recruitSpecial__talk__profile__list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.recruitSpecial__talk__profile__role {
    font-size: clamp(12px, 1.16vw, 14px);
    line-height: 1.7;
    font-weight: 500;
    color: var(--profColor);
}

.recruitSpecial__talk__profile__name {
    font-size: clamp(14px, 1.5vw, 18px);
    line-height: 1.7;
    font-weight: 500;
}

.recruitSpecial__talk__profile__suffix {

    font-size: clamp(12px, 1.16vw, 14px);
    line-height: 1.7;
    font-weight: 500;
}


@media only screen and (max-width: 768px) {
    .recruitSpecial__talk__profile {
        width: auto;
        padding: 40px 18px;
    }

    .recruitSpecial__talk__profile__list {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 12px 10px;
    }

    .recruitSpecial__talk__profile__item {
        gap: 6px;
    }

    .recruitSpecial__discussion__profImg {
        width: 46px;
        height: 46px;
    }

    .recruitSpecial__talk__profile__role,
    .recruitSpecial__talk__profile__suffix {
        font-size: 12px;
    }

    .recruitSpecial__talk__profile__name {
        font-size: 14px;
        white-space: nowrap;
    }
}

/*---------------------*/
/*  採用担当者からのメッセージ
/*---------------------*/
.recruitSpecial__recruiter__message {
    background: #fff;
    padding-top: 96px;
    padding-bottom: 146px;
}

.recruitSpecial__message__ttl {
    font-size: clamp(18px, 2.66vw, 32px);
    line-height: 1.8;
    font-weight: 500;
    justify-content: center;
    display: flex;
    align-items: center;
    gap: 1em;
}

.recruitSpecial__message__ttl::before,
.recruitSpecial__message__ttl::after {
    content: "";
    display: block;
    width: 1.5em;
    height: 2em;
    background: url(../images/ttl-icon_message.png)no-repeat center/contain;
}

.recruiter__messageList {
    max-width: 1000px;
    margin: auto;
    padding: 80px 0;

}

.recruiter__messageItem {
    display: flex;
    align-items: center;
    margin: -80px 0;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__recruiter__message {
        padding-top: 50px;
        padding-bottom: 56px;
    }

    .recruiter__messageList {
        padding: 0;
    }

    .recruitSpecial__message__ttl {
        gap: 5px;
    }

    .recruiter__messageItem {
        margin: auto;
        margin-top: 30px;
        display: block;
    }
}

.recruiter__messageItem:nth-child(even) .recruiterImg {
    order: 1;
    margin: 0;
    margin-left: -75px;
}

.recruiterImg {
    width: 40%;
    margin-right: -75px;
}

.recruiter__messageTxt {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    width: 60%;
    z-index: 1;
    gap: 25px;
    margin-top: 5em;
}

@media only screen and (max-width: 768px) {
    .recruiter__messageTxt {
        width: 100%;
        font-size: 14px;
        margin: 0;
    }

    .recruiterImg {
        margin: 0 auto !important;
        width: 100%;
        max-width: 200px;
    }
}

.recruiter__message {
    font-size: clamp(14px, 1.5vw, 18px);
    line-height: 1.7;
}


.recruiter__name {
    order: 1;
    font-size: clamp(18px, 2vw, 24px);
    background: #fff;
    width: max-content;
    padding: 0 .5em;
}

@media only screen and (max-width: 768px) {
    .recruiter__messageTxt {
        width: 100%;
        font-size: 14px;
    }

    .recruiter__name {
        order: 0;
        margin: auto;
        margin-top: -1em;
    }
}



/*---------------------*/
/*  採用担当者からのメッセージ
/*---------------------*/
.recruitSpecial__schedule {
    padding-top: 100px;
    padding-bottom: 140px;
}

.recruitSpecial__schedule__inner {
    margin-left: 20px;
    margin-right: 40px;
}

.recruitSpecial__schedule__bg {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: 50%;
    background: #fff;
    z-index: 1;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__schedule {
        padding-top: 48px;
        padding-bottom: 0;
    }

    .recruitSpecial__schedule__inner {
        margin: 0;
    }

    .recruitSpecial__schedule__bg {
        display: none;
    }
}

.recruitSpecial__schedule__bg .stickyWrapper {
    position: sticky;
    top: 0;
    width: 100%;
    height: 100vh;
}

.recruitSpecial__schedule__bg__loop {
    position: absolute;
    width: 100%;
    height: 100%;
}

.recruitSpecial__schedule__bg__loopItem {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    transition: all .6s;
}

.recruitSpecial__schedule__bg__loopItem:not(.current) {
    opacity: 0;
}

.recruitSpecial__schedule__bg__loopItem>img {
    height: 100%;
    object-fit: cover;
}

.recruitSpecial__schedule__bg__buttons {
    position: absolute;
    left: 20px;
    bottom: 20px;
    z-index: 1;
}

.recruitSpecial__schedule__main {
    width: 50%;
}

@media only screen and (max-width: 768px) {

    .recruitSpecial__schedule__main {
        width: 100%;
    }
}

.recruitSpecial__schedule__ttl {
    font-weight: 600;
    line-height: 1.8;
    color: #FFB6C1;
    font-size: clamp(20px, 2.83vw, 34px);
}

.recruitSpecial__schedule__subtitle {
    font-weight: 600;
    font-size: 21px;
    margin-top: 18px;
    display: flex;
    align-items: center;
    gap: .5em;
    height: 1em;
}


.recruitSpecial__schedule__subtitle::before {
    content: "";
    display: block;
    width: 1.5em;
    height: 3em;
    background: url(../images/ttl-icon_schedule.png) no-repeat center/contain;
}

.recruitSpecial__schedule__list {
    margin-top: 100px;
}

.recruitSpecial__schedule__item {
    counter-increment: recruitSpecial__schedule__item 1;
    margin-left: 10px;
    border-left: 2px solid transparent;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__schedule__list {
        margin-top: 65px;
        margin-left: 0;
        padding: 0;
    }

    .recruitSpecial__schedule__item {
        border: none;
        padding: 0;
        margin: 0;
    }
}


.recruitSpecial__schedule__item:not(:last-child) {
    border-left: #FFB6C1 2px solid;
    padding-bottom: clamp(40px, 5vw, 60px);
}


.recruitSpecial__schedule__textContent {
    padding-left: clamp(16px, 2.5vw, 30px);
}

.recruitSpecial__schedule__textContent::before {
    content: "";
    display: block;
    font-size: 20px;
    width: 1em;
    height: 1em;
    border-radius: 50px;
    background: #FFB6C1;
    position: absolute;
    left: calc(-.5em - 1px);
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__schedule__item:not(:last-child) {
        border-left: none;

    }

    .recruitSpecial__schedule__textContent::before {
        font-size: 13px;
    }

    .recruitSpecial__schedule__textContent {
        margin-left: 30px;
        margin-right: 25px;
    }
}

.recruitSpecial__schedule__itemTitle {
    font-size: clamp(24px, 2.83vw, 34px);
    font-weight: 700;
    color: #FFB6C1;
    line-height: 1;
    top: -.25em;
    margin-bottom: -.25em;
}


.recruitSpecial__schedule__itemTitle::before {
    content: "0" counter(recruitSpecial__schedule__item);
    font-family: "Roboto", sans-serif;
    font-size: clamp(30px, 3.3vw, 40px);
    font-weight: 600;
    margin-right: clamp(8px, 1.66vw, 20px);
}

.recruitSpecial__schedule__itemDescription {
    font-size: clamp(16px, 1.66vw, 20px);
    font-weight: 700;
    line-height: 1.8;
    margin-top: clamp(18px, 2vw, 24px);
}

.recruitSpecial__schedule__img {
    margin-top: 18px;
}



/*---------------------*/
/*  よくある質問
/*---------------------*/
.recruitSpecial__faq {
    --ttlicon: url(../images/ttl-icon_faq.png);
    padding-top: 100px;
    background: linear-gradient(to bottom, #FFF, transparent 922px);
}


.recruitSpecial__faqList {
    --openContentHeight: 0px;
    padding-bottom: var(--openContentHeight);
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 40px;
    transition: padding-bottom .5s ease;
    margin-top: 90px;
}


.recruitSpecial__faqItem {
    border-top: 1px solid #01AAFF;
    top: 0;
    transition: all .5s ease;
}

.recruitSpecial__faqItem__toggle {
    background: none;
    border: none;
    height: 90px;
    font-size: clamp(16px, 1.66vw, 20px);
    font-weight: 700;
    cursor: pointer;
    width: 100%;
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 40px;
}

.recruitSpecial__faqItem__toggle::before,
.recruitSpecial__faqItem__toggle::after {
    content: "";
    position: absolute;
    display: block;
    width: 24px;
    height: 24px;
    --iconColor: #01AAFF;
    transition: all .6s;
    right: 0;
}


.recruitSpecial__faqItem__toggle::before {
    background: linear-gradient(to right, transparent 40%, var(--iconColor) 0, var(--iconColor) 60%, transparent 0) no-repeat center/contain;
}

.recruitSpecial__faqItem__toggle::after {
    background: linear-gradient(to bottom, transparent 40%, var(--iconColor) 0, var(--iconColor) 60%, transparent 0) no-repeat center/contain
}

.recruitSpecial__faqItem.open .recruitSpecial__faqItem__toggle::before {
    transform: rotate(270deg);
}

.recruitSpecial__faqItem.open .recruitSpecial__faqItem__toggle::after {
    transform: rotate(360deg);
}

.recruitSpecial__faqItem__content {
    height: 0;
    opacity: 0;
    transition: all 0.3s ease;
    margin-right: 40px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}


@media only screen and (max-width: 768px) {
    .recruitSpecial__faq {
        background: none;
    }

    .recruitSpecial__faqList {
        display: block;
        margin-top: 63px;
    }

    .recruitSpecial__faqItem__toggle {
        height: auto;
        padding: 1.2em 0;
    }

    .recruitSpecial__faqItem__content {
        margin-right: 0;
    }

    .open .recruitSpecial__faqItem__content {
        height: var(--openContentHeight);
    }

    .recruitSpecial__faqItem:last-of-type {
        border-bottom: 1px solid #01AAFF;
    }
}

.recruitSpecial__faqItem.open .recruitSpecial__faqItem__content {
    opacity: 1;
}

.recruitSpecial__faqItem:nth-child(odd).open~.recruitSpecial__faqItem:nth-child(odd),
.recruitSpecial__faqItem:nth-child(even).open~.recruitSpecial__faqItem:nth-child(even) {
    top: var(--openContentHeight);
}


.recruitSpecial__faqItem__txt {
    font-size: clamp(14px, 1.5vw, 18px);
    font-weight: 500;
    line-height: 1.7;
}

.recruitSpecial__faqItem__linkList {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.recruitSpecial__faqItem__linkItem {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.recruitSpecial__faqItem__link {
    font-weight: 700;
    color: #fff;
    background: linear-gradient(to right, var(--colorB), var(--colorA));
}

.recruitSpecial__faqItem__link::after {
    background: #fff;
}

.recruitSpecial__faqItem__flowList {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.recruitSpecial__faqItem__flowItem {

    background: #fff;
    padding: .8em 1.5em;
    border-radius: 10px;
}

.recruitSpecial__faqItem__flowTtl {
    color: #ED7980;
    font-weight: 700;
    font-size: 18px;
    padding-bottom: 5px;
    border-bottom: 1px solid #ED7980;
}

.recruitSpecial__faqItem__flowTxt {
    margin-top: 5px;
    line-height: 1.7;
    font-size: clamp(14px, 1.33vw, 16px);
}

.recruitSpecial__faqItem__flowItem:not(:last-child)::after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    height: 16px;
    background: #fff;
    clip-path: polygon(calc(50% - 15px) 0, calc(50% + 15px) 0, 50% 100%);
    bottom: -16px;
}


.faq__btmIllust__wrapper {
    width: 100%;
    bottom: -15px;
    z-index: 1;
    margin-top: 10%;
}

.faq__btmIllust {
    width: 250px;
    margin-left: auto;
}


@media only screen and (max-width: 768px) {
    .faq__btmIllust {
        width: 137px;
        margin: auto;
    }

    .recruitSpecial__faqList {
        display: block;
        padding-bottom: 0;
    }

    .recruitSpecial__faqItem:nth-child(odd).open~.recruitSpecial__faqItem:nth-child(odd),
    .recruitSpecial__faqItem:nth-child(even).open~.recruitSpecial__faqItem:nth-child(even) {
        top: 0;
    }

    .recruitSpecial__faqItem.open~.recruitSpecial__faqItem {
        top: 0;
    }

    .recruitSpecial__faqItem__linkList {
        grid-template-columns: auto;
    }
}

/*---------------------*/
/*  募集要項
/*---------------------*/


.recruitSpecial__jobListing {
    background: #fff;
    --ttlicon: url(../images/ttl-icon_job-listing.png);
    padding-top: 100px;
    padding-bottom: 150px;
}

.recruitSpecial__jobListing__jobListing {
    margin-top: 84px;
}

.recruitSpecial__jobListing__tabs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__jobListing {
        padding-top: 64px;
    }


    .recruitSpecial__jobListing__jobListing {
        margin-top: 32px;
    }

    .recruitSpecial__jobListing__tabs {
        gap: 6px;
    }
}

.recruitSpecial__header__logo {
    width: 15%;
}

.recruitSpecial__jobListing__tabHeader {
    background: #fff;
    border-radius: 30px 30px 0 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__header__logo {
        width: 188px;
    }

    .recruitSpecial__jobListing__tabHeader {
        border-radius: 10px 10px 0 0;
    }
}

.recruitSpecial__jobListing__tabHeader__content {
    padding: 10px 34px 12px;
    border: 0px solid #F6F6F6;
    border-right-width: 2px;
    border-left-width: 2px;
    margin: auto;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.recruitSpecial__jobListing__img {
    order: -1;
}

.recruitSpecial__jobListing__tabHeader:has(.active) {
    background: #F6F6F6;
}

.recruitSpecial__jobListing__tabContentWrapper {
    background: #F6F6F6;
    padding: 30px 0 100px;
    border-radius: 0 0 30px 30px;
}

.recruitSpecial__jobListing__tabInner {
    margin-right: 15px;
    margin-left: 15px;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__jobListing__tabInner {
        margin-right: 20px;
        margin-left: 20px;
    }

    .recruitSpecial__jobListing__tabContentWrapper {
        border-radius: 0;
        padding-top: 16px;
        padding-bottom: 66px;
    }

    .recruitSpecial__jobListing__tabHeader__content {
        width: 100%;
        padding: .5em;
        padding-bottom: 1em;
    }

    .recruitSpecial__jobListing {
        padding-bottom: 74px;
    }
}

.recruitSpecial__jobListing__title {
    font-weight: bold;
    font-size: 36px;
    font-size: clamp(16px, 3vw, 36px);
    text-align: center;
    color: var(--colorA);
}


@media only screen and (max-width: 768px) {
    .recruitSpecial__jobListing__title {
        font-size: 16px;
    }
}

.recruitSpecial__jobListing__btns {
    display: grid;
    grid-template-columns: 1fr;
    margin-top: 20px;
}

.recruitSpecial__jobListing__tabButton {
    margin-bottom: 10px;
    font-size: clamp(12px, 1.5vw, 18px);
}

.recruitSpecial__jobListing__tabContent {
    display: none;
    width: 100%;
    max-width: 900px;
    margin: auto;
}

.recruitSpecial__jobListing__description {
    font-size: clamp(14px, 1.33vw, 16px);
    margin-top: 30px;
    font-weight: 500px;
}

.recruitSpecial__jobListing__tabContent.active {
    display: block;
}

.recruitSpecial__jobListing__entryLink {
    color: #fff;
    background: linear-gradient(to right, var(--colorB), var(--colorA));
    display: flex;
    margin: auto;
    font-size: clamp(12px, 1.5vw, 18px);
}

.recruitSpecial__jobListing__entryLink::after {
    background: #fff;
}

.jobListing__row {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 0 40px;
    padding: 24px 0;
}

.jobListing__row::after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    height: 3px;
    width: 100%;
    grid-column: 1/3;
    background: linear-gradient(to right, #01AAFF 20%, transparent 0), linear-gradient(to bottom, transparent 1px, #01AAFF 0, #01AAFF 2px, transparent 0);
}

.jobListing__row:last-of-type::after {
    content: none;
}

.jobListing__head {
    font-weight: 500;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__jobListing__tabHeader * {
        position: static;
    }

    .recruitSpecial__jobListing__tabButton {
        background: none;
        padding: 0;
        margin: 0;
        border-radius: 0;
        box-shadow: none;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
    }

    .recruitSpecial__jobListing__description {
        margin-top: 0;
    }

    .recruitSpecial__jobListing__tabArrow {
        position: absolute;
        width: 100%;
        height: 10px;
        bottom: 18px;
    }

    .recruitSpecial__jobListing__tabArrow svg {
        width: 20px;
        margin: auto;
    }

    .recruitSpecial__jobListing__tabButton::after {
        content: none;
    }

    .jobListing__row {
        display: block;
    }

    .jobListing__data {
        margin-top: 4px;
    }

    .jobListing__row::after {
        background: linear-gradient(to right, #01AAFF 30%, transparent 0), linear-gradient(to bottom, transparent 1px, #01AAFF 0, #01AAFF 2px, transparent 0);
        margin-top: 20px;
    }

    .jobListing__cell {
        font-size: 14px;
    }
}

.jobListing__row:last-of-type .jobListing__head,
.jobListing__row:last-of-type .jobListing__data {
    border: none;
    padding-bottom: 0;
}

.jobListing__data__columnWrapper {
    display: grid;
    grid-template-columns: auto auto;
    grid-template-rows: auto auto;
}

@media only screen and (max-width: 768px) {
    .jobListing__head {
        font-size: 16px;
    }

    .jobListing__data__columnWrapper {
        display: flex;
        flex-direction: column;
        gap: 1.6em;
    }
}

.jobListing__data__areaTtl {
    font-weight: 700;
}

.jobListing__data__areaTtl:not(:first-child) {
    margin-top: 1.6em;

}

.jobListing__data__columnWrapper>div:first-child {
    grid-row: 1/3;
}

.recruitSpecial__jobListing__entryLink__last {
    margin-top: 100px;
}

.jobListing__data__areaList {
    font-size: clamp(14px, 1.33vw, 16px);
    line-height: 1.6;
}

.jobListing__noteTxt {
    font-size: .8em;
    font-weight: 400;
}

.jobListing__map {
    margin-top: 25px;
    pointer-events: none;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__jobListing__entryLink__last {
        margin-top: 22px;
        font-size: 18px;
    }

    .jobListing__map {
        width: calc(100% + 30px);
        margin: 25px -15px 0;
        pointer-events: all;
    }

    .jobListing__map__modal {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        align-content: center;
        opacity: 0;
        transition: all .5s;
        z-index: 10000;
        pointer-events: none;
        backdrop-filter: blur(2px);
        overflow-x: scroll;
    }

    .jobListing__map__modal__bg {
        position: absolute;
        top: 0;
        bottom: 0;
        width: 100%;
        background: #0008;
    }

    .jobListing__map__modal.open {
        opacity: 1;
        pointer-events: all;
    }

    .jobListing__map__modal__img {
        width: 100%;
        overflow: scroll;
        aspect-ratio: 1/1;
    }

    .jobListing__map__modal__img img {
        width: 1200px;
    }

    .jobListing__map__modalBtn {
        margin: auto;
        font-weight: 500;
        font-size: 14px;
        display: flex;
        align-items: center;
        background: none;
        gap: .5em;
        margin-top: 10px;
    }

    .jobListing__map__modalBtn::after {
        content: "";
        display: block;
        width: 1.2em;
        height: 1.2em;
        background: linear-gradient(90deg, transparent 43%, #01AAFF 0, #01AAFF 57%, transparent 0), linear-gradient(transparent 43%, #01AAFF 0, #01AAFF 57%, transparent 0), #fff;
        border: .7em #fff solid;
        display: block;
        border-radius: 100px;
    }

    .jobListing__map__closeBtn {
        color: #fff;
    }

    .jobListing__map__closeBtn::after {
        transform: rotate(45deg);
    }
}

:has(.jobListing__map__modal.open) {
    overflow-y: hidden;
}


/*---------------------*/
/*  選考の流れ
/*---------------------*/

.recruitSpecial__selectionFlow {
    --ttlicon: url(../images/ttl-icon_selection-flow.png);
    padding-top: 150px;
    padding-bottom: 160px;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__selectionFlow {
        padding-top: 54px;
        padding-bottom: 76px;
        background: none;
    }
}

.recruitSpecial__selectionFlowList {
    display: grid;
    grid-template-columns: 1fr 45px 1fr 45px 1fr;
    gap: clamp(36px, 4.16vw, 50px);
    align-items: center;
    margin-top: 90px;
}


@media only screen and (max-width: 768px) {
    .recruitSpecial__selectionFlowList {
        display: flex;
        flex-direction: column;
        gap: 0;
        margin-top: 35px;
    }
}


.recruitSpecial__selectionFlow__Arrow {
    stroke: #000;
}

.recruitSpecial__selectionFlow__step {
    counter-increment: recruitSpecial__selectionFlow__step 1;
    display: grid;
    align-items: stretch;
    grid-template-rows: clamp(100px, 12vw, 126px) max-content max-content;
    gap: 20px;
    height: 100%;
}

.recruitSpecial__selectionFlow__step__header {
    text-align: center;
}

.recruitSpecial__selectionFlow__index {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.8;
    color: #01AAFF;
}

.recruitSpecial__selectionFlow__index::after {
    content: counter(recruitSpecial__selectionFlow__step);
}

.recruitSpecial__selectionFlowTtl {
    font-size: clamp(26px, 3vw, 36px);
    font-weight: 700;
}

.recruitSpecial__selectionFlowImg {
    width: 90%;
    margin: auto;
}

.recruitSpecial__selectionFlow__ttl__small {
    font-size: 26px;
    display: block;
}

.recruitSpecial__selectionFlowTxt {
    font-size: clamp(14px, 1.5vw, 18px);
    line-height: 1.7;
    font-weight: 500;
}

.recruitSpecial__selectionFlow * {
    position: static;
}

#selectionFlow>div>div>div>div:nth-child(3)>figure::before {
    content: "";
    position: absolute;
    display: block;
    left: 0;
    right: 0;
    height: 105px;
    background: #F6F6F6;
    z-index: -1;
    top: 50%;
}


@media only screen and (max-width: 768px) {
    .recruitSpecial__selectionFlow__Arrow {
        transform: rotate(90deg);
        margin-top: 48px;
        margin-bottom: 32px;
    }

    .recruitSpecial__selectionFlow__step {

        grid-template-rows: repeat(3, max-content);
    }

    #selectionFlow>div>div>div>div:nth-child(3)>figure::before {
        content: none;
    }
}

/*---------------------*/
/*  園見学について
/*---------------------*/

.recruitSpecial__visit {
    background: #B0EAFF;
    padding-top: 52px;
    padding-bottom: calc(132px + 100px);
    /*見かけ上の余白＋footerと重なる分の100px*/
}

.recruitSpecial__visit::before {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: url(../images/selectionFlow__bg01.png) no-repeat top center/cover;
    opacity: .6;
    mix-blend-mode: overlay;
}

.recruitSpecial__visit__ttl {
    text-align: center;
    font-size: clamp(18px, 2.66vw, 32px);
    line-height: 1.8;
}

.recruitSpecial__visit__ttl::before {
    content: "";
    display: block;
    right: 20%;
    left: 20%;
    height: 2em;
    background: url(../images/visit-ttl-img.png)no-repeat top center/contain;
    margin-bottom: 7px;
}

.recruitSpecial__visit__content {
    max-width: 1080px;
}

.recruitSpecial__visit__btn {
    font-size: clamp(16px, 2vw, 24px);
    color: #fff;
    background: linear-gradient(to right, var(--colorB), var(--colorA));
}

.recruitSpecial__visit__btn::after {
    background: #fff;
}


.recruitSpecial__visit__infoList {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 60px;
    margin-top: 52px;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__visit {
        padding-bottom: calc(175px + 60px);
        /*見かけ上の余白＋footerと重なる分の60px*/
    }

    .recruitSpecial__visit::before {
        background-size: 2540px;
    }

    .recruitSpecial__visit__content {
        max-width: 400px;
    }

    .recruitSpecial__visit__ttl::before {
        height: 3em;
    }

    .recruitSpecial__visit__btn {
        width: 295px;
    }

    .recruitSpecial__visit__infoList {
        display: flex;
        flex-flow: row wrap-reverse;
        justify-content: center;
        gap: 15px;
        margin-top: 20px;
    }
}

.recruitSpecial__visit__infoItem {
    background: #01AAFF;
    aspect-ratio: 1/1;
    border-radius: 1000px;
    text-align: center;
    align-content: center;
}

@media only screen and (max-width: 768px) {
    .recruitSpecial__visit__infoItem {
        display: inline-block;
        width: calc(50% - 7.5px);
    }

    .recruitSpecial__visit__infoItem:first-child {
        order: 2;
        margin-bottom: -15px;
    }
}

.recruitSpecial__visit__info__txt {
    font-size: 34px;
    font-weight: 700;
    color: #FEDC5E;
}

.recruitSpecial__visit__info__note {
    display: block;
    color: #fff;
    margin-top: 2em;
    --strokeColor: #01AAFF;
    text-shadow: 0.091em 0 0 var(--strokeColor), -0.091em 0 0 var(--strokeColor), 0 0.091em 0 var(--strokeColor), 0 -0.091em 0 var(--strokeColor), 0.061em 0.061em 0 var(--strokeColor), -0.061em -0.061em 0 var(--strokeColor), 0.061em -0.061em 0 var(--strokeColor), -0.061em 0.061em 0 var(--strokeColor), 0.042em 0.091em 0 var(--strokeColor), -0.042em -0.091em 0 var(--strokeColor), 0.091em -0.042em 0 var(--strokeColor), -0.091em 0.042em 0 var(--strokeColor), 0.091em 0.042em 0 var(--strokeColor), -0.091em -0.042em 0 var(--strokeColor), 0.042em -0.091em 0 var(--strokeColor), -0.042em 0.091em 0 var(--strokeColor), 0.079em 0.030em 0 var(--strokeColor), -0.079em -0.030em 0 var(--strokeColor), 0.030em -0.079em 0 var(--strokeColor), -0.030em 0.079em 0 var(--strokeColor), 0.030em 0.079em 0 var(--strokeColor), -0.030em -0.079em 0 var(--strokeColor), 0.079em -0.030em 0 var(--strokeColor), -0.079em 0.030em 0 var(--strokeColor);
}

.recruitSpecial__visit__info__note * {
    color: #fff;

}


@media only screen and (max-width: 768px) {
    .recruitSpecial__visit__info__txt {
        font-size: 20px;
    }

    .recruitSpecial__visit__info__note {
        margin-top: 1em;
        font-size: 14px;
        width: 100%;
        position: absolute;
        text-align: center;
        line-height: 1.6;
    }
}

.recruitSpecial__visit__discription {
    margin: auto;
    width: max-content;
    max-width: 100%;
}


.recruitSpecial__visit__txt {
    margin: 40px 0;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.7;
}


@media only screen and (max-width: 768px) {
    .recruitSpecial__visit__discription {
        width: calc(100% - 50px);
        margin: 0 25px;
    }

    .recruitSpecial__visit__txt {
        font-size: 16px;
        margin-bottom: 55px;
    }
}

.recruitSpecial__visit__linkList {
    display: flex;
    gap: 30px;

}

@media only screen and (max-width: 768px) {
    .recruitSpecial__visit__linkList {
        flex-direction: column;
        gap: 18px;
        width: max-content;
        margin: auto;
    }
}


/*---------------------*/
/*  フッター
/*---------------------*/

.recruitSpecial__footer {
    background: #fff;
    border-radius: 100px 100px 0 0;
    padding-top: 75px;
    margin-top: -100px;
    width: 100%;
}

.recruitSpecial__footer__top {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}


.recruitSpecial__footer__logo {
    display: block;
    width: 36%;
    margin-left: 12%;
}

.recruitSpecial__footer__illust {
    width: 37%;
    margin-top: -30%;
    margin-left: auto;
    margin-bottom: -2%;
}

.recruitSpecial__footer__snsIcon {
    width: 34px;
    height: 34px;
}

.recruitSpecial__footer__sns {
    display: flex;
    gap: 10px;
    margin-top: 42px;
    justify-content: center;
}

.recruitSpecial__footer__snsLink {
    width: 330px;
    box-shadow: 0 0 10px #0000002e;
    font-size: 16px;
    font-weight: 700;
    gap: .5em;
    padding: 1em 1.5em;
}

.recruitSpecial__sitemap {
    margin: 73px auto 0;
}

.recruitSpecial__sitemap__linkList {
    justify-content: center;
    display: flex;
    gap: 0 2em;
    flex-wrap: wrap;
    max-width: 920px;
    margin: auto;
}

.recruitSpecial__sitemap__link {
    font-size: 16px;
    font-weight: 700;
    line-height: 2.4;
}


.recruitSpecial__footer__pagetopBtn {
    position: absolute;
    right: 56px;
    bottom: 75px;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.8;
}

.recruitSpecial__footer__copyright {
    background: #F6F6F6;
    height: 60px;
    font-size: 14px;
    font-weight: 700;
    align-content: center;
    text-align: center;
    margin-top: 80px;
    border-top: 1px solid #000;
}


@media only screen and (max-width: 768px) {
    .recruitSpecial__footer {
        border-radius: 60px 60px 0 0;
        padding-top: 0;
        margin-top: -60px;
    }

    .recruitSpecial__footer__top {
        flex-direction: column;
        width: 220px;
        margin: auto;
        gap: 32px;
    }

    .recruitSpecial__footer__logo {
        width: 100%;
    }

    .recruitSpecial__footer__illust {
        width: 205px;
        order: -1;
        margin: -100px auto 0;
    }

    .recruitSpecial__sitemap {
        margin-top: 64px;
    }

    .recruitSpecial__sitemap__linkList {
        flex-direction: column;
        gap: 18px;
        text-align: center;
    }

    .recruitSpecial__sitemap__link {
        font-size: 20px;
        line-height: 1.6;
    }

    .recruitSpecial__footer__sns {
        flex-direction: column;
        gap: 20px;
        align-items: center;
        margin-top: 50px;
    }

    .recruitSpecial__footer__pagetopBtn {
        position: relative;
        right: inherit;
        bottom: inherit;
        margin: auto;
        width: max-content;
        display: block;
        margin-top: 50px;
    }

    .recruitSpecial__footer__copyright {
        margin-top: 4px;
        font-size: clamp(10px, 2.5vw, 12px);
        height: 100px;
        padding-bottom: 40px;
    }

}

/*---------------------*/
/*  fixed
/*---------------------*/
.footer__fixedContent {
    opacity: 0;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    align-content: center;
    transition: opacity .5s ease;
    pointer-events: none;
    z-index: 9998;
}

.footer__fixedContent.visible {
    opacity: 1;
    pointer-events: all;
}

.footer__fixed__txt {
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    left: -2.6em;
    text-align: center;
    writing-mode: vertical-rl;
    text-orientation: upright;
    background: #FFDBB0;
    color: #fff;
    height: max-content;
    margin: auto;
    padding: 1em .3em;
    border-radius: 100px;
    letter-spacing: .2em;
    font-size: clamp(16px, 1.25vw, 24px);
}

.footer__fixed__txt::before {
    content: "";
    position: absolute;
    display: block;
    right: -.8em;
    height: 100%;
    top: 0;
    width: .8em;
    bottom: 0;
    background: #FFDBB0;
    clip-path: polygon(0 calc(50% - .5em), 100% 50%, 0 calc(50% + .5em));
}

.footer__fixed__linkList {
    display: flex;
    writing-mode: vertical-rl;
    /* 縦書きの方向を右から左に設定 */
    text-orientation: upright;
    /* 文字の向きを直立に設定 */
    gap: 10px;
}



.footer__fixed__link {
    padding: 1em .5em;
    font-size: clamp(16px, 1.55vw, 30px);
    border-radius: 20px 0 0 20px;
    color: #fff;
    border: solid #000;
    border-width: 4px 0 4px 4px;
    letter-spacing: .3em;
    display: flex;
    gap: .2em;
}

.footer__fixed__link__new {
    background: #62C0B4;
}

.footer__fixed__link__new::before {
    content: "";
    display: block;
    background: url(../images/fixed-icon01.png) no-repeat center/contain;
    width: 1.5em;
    height: 1.5em;
}

.footer__fixed__link__mid {
    background: #ED7980;
}

.footer__fixed__link__mid::before {
    content: "";
    display: block;
    background: url(../images/fixed-icon02.png) no-repeat center/contain;
    width: 1.5em;
    height: 1.5em;
}


@media only screen and (max-width: 768px) {

    .footer__fixedContent {
        width: 100vw;
        top: inherit;
        left: 0;
    }

    .footer__fixed__linkList {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        writing-mode: horizontal-tb;
        text-orientation: sideways;
        gap: 5px;
    }

    .footer__fixed__link {
        font-size: 20px;
        gap: 8px;
        justify-content: center;
        border-radius: 0;
        border: none;
        border-top: 2px solid #000;
        padding: 4px 0;
    }

    .footer__fixed__link__new {
        border-right: 2px solid #000;
        border-radius: 0 20px 0 0;
    }

    .footer__fixed__link__mid {
        border-left: 2px solid #000;
        border-radius: 20px 0 0 0;
    }
}