:root {
    /* Colors */
    --colorBlack: #00111f;
    --colorBlackTwo: #111;
    --colorImportant: #e70000;
    --colorAccent: #ff4000;
    --colorOrange: #ff5906;
    --colorShadow: #e0ddda;
    --colorBase: #f9f9f9;
    --colorBorder: #ebeaea;
    --colorGradient: linear-gradient(to bottom, #ff9865, #f42100);
    --familyEn: "Poppins", sans-serif;

    /* Use the most common English font and Japanese Font as the base */
    --familyJp: "Noto Sans JP", sans-serif;

    /* Font Size clamp: https: //min-max-calculator.9elements.com/ */
    --fontMax14Min12: clamp(0.75rem, 0.62rem + 0.38vw, 0.875rem);
    --fontMax16Min14: clamp(0.875rem, 0.745rem + 0.38vw, 1rem);
    --fontMax18Min16: clamp(1rem, 0.87rem + 0.38vw, 1.125rem);
    --fontMax20Min16: clamp(1rem, 0.741rem + 0.75vw, 1.25rem);
    --fontMax24Min18: clamp(1.125rem, 0.736rem + 1.13vw, 1.5rem);
    --fontMax32Min24: clamp(1.5rem, 0.981rem + 1.51vw, 2rem);
    --fontMax40Min28: clamp(1.75rem, 0.972rem + 2.26vw, 2.5rem);
    --fontMax48Min36: clamp(2.25rem, 1.472rem + 2.26vw, 3rem);
}

/* Common */

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 6.25rem;
}

p,
h5,
h4,
h3,
h2,
h1,
a,
dd,
dt,
li,
figcaption,
button,
input,
label,
textarea {
    color: var(--colorBlack);
    font-family: var(--familyJp);
    font-size: var(--fontMax16Min14);
    font-weight: 500;
    letter-spacing: 0.05em;
    line-height: 1.8;
}

.container {
    margin: 0 auto;
    max-width: 67.5rem;
    width: 100%;
}

.orange {
    color: var(--colorOrange);
}

.sectionTitle {
    text-align: center;

    p {
        color: var(--colorAccent);
        font-family: var(--familyEn);
        font-size: var(--fontMax18Min16);
        letter-spacing: 0;
        line-height: 1.4;
    }

    h2 {
        font-size: var(--fontMax48Min36);
        font-weight: 700;
    }
}

.for-sp {
    display: none;
}

a {
    transition: 0.2s;
}

a:hover {
    opacity: 0.8;
}

@media screen and (max-width: 767px) {
    .sectionTitle {
        h2 {
            font-size: 1.625rem;
        }
    }

    .for-sp {
        display: block;
    }
}

/* Header */

.cabHeader {
    background: #fff;
    left: 0;
    padding: 1rem 1.5rem;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10;
}

.cabNavbar {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    max-width: 90rem;
    width: 100%;

    .logo {
        max-width: 11.25rem;
    }

    .cabNavbar__nav ul {
        display: flex;
        gap: 1rem;
    }

    .cabNavbar__nav li a {
        color: var(--colorBlack);
        font-size: 0.875rem;
        font-weight: 700;
    }

    .hamburger {
        background: none;
        border: none;
        cursor: pointer;
        display: none;
        height: 1.25rem;
        margin-left: 1rem;
        position: relative;
        width: 1.625rem;
    }

    .hamburger span {
        background: var(--colorBlack);
        display: block;
        height: 1px;
        left: 0;
        position: absolute;
        transition: 0.3s;
        width: 100%;
    }

    .hamburger span:nth-child(1) {
        top: 0;
    }

    .hamburger.open span:nth-child(1) {
        transform: translate(0px, 9px) rotate(30deg);
    }

    .hamburger span:nth-child(2) {
        top: 50%;
    }

    .hamburger.open span:nth-child(2) {
        opacity: 0;
        transform: translateX(6px);
    }

    .hamburger span:nth-child(3) {
        top: 100%;
    }

    .hamburger.open span:nth-child(3) {
        transform: translate(0px, -11px) rotate(-30deg);
    }
}

.sidedrawer {
    background: #fff;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    transform: translateX(100%);
    transition: 0.4s ease-in-out;
    width: 100%;
    z-index: 5;

    .sidedrawer__nav {
        height: 100%;
        padding: 80px 20px;
    }

    ul {
        align-items: center;
        display: flex;
        flex-direction: column;
        gap: 1rem;
        height: 100%;
        justify-content: center;
    }
}

.sidedrawer.open {
    transform: translateX(0);
}

@media screen and (max-height: 500px) {
    .sidedrawer {
        height: calc(100dvh - 4.375rem);
        top: 4.375rem;
        overflow-y: scroll;

        .sidedrawer__nav {
            padding: 0;
        }

        ul {
            display: grid;
            padding: 1.25rem 0;
        }

        li {
            text-align: center;
        }
    }
}

.cabCTA {
    align-items: center;
    background: var(--colorGradient);
    border-radius: 100px;
    color: #fff;
    display: flex;
    flex-direction: column;
    height: 5rem;
    justify-content: center;
    margin: 0 auto;
    max-width: 25rem;
    width: 100%;

    .cabCTA__top {
        align-items: center;
        display: grid;
        gap: 0.25rem;
        grid-template-columns: 0.875rem auto 0.875rem;
    }

    .cabCTA__top .line {
        background: #fff;
        border-radius: 2px;
        display: block;
        height: 14px;
        width: 1px;
    }

    .cabCTA__top .line:nth-child(1) {
        transform: rotate(-45deg) translate(4px, 5px);
        transform-origin: center;
    }

    .cabCTA__top .line:nth-child(3) {
        transform: rotate(45deg) translate(5px, -5px);
    }

    .cabCTA__top .text {
        font-size: 0.875rem;
        font-weight: 700;
    }

    .cabCTA__bottom {
        font-family: var(--familyEn);
        font-size: 2rem;
        letter-spacing: 0.05em;
        line-height: 1.2;
        text-align: center;
    }
}

@media screen and (max-width: 550px) {
    .cabNavbar {
        .logo {
            max-width: 8.75rem;
        }
    }
    .cabCTA {
        .cabCTA__bottom {
            font-size: 1.75rem;
        }
    }
}

.cabCTA--header {
    height: 3.5rem;
    margin: unset;
    max-width: 17.9375rem;

    .cabCTA__top .text {
        font-size: 0.75rem;
    }

    .cabCTA__bottom {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 1300px) {
    .cabNavbar {
        .cabNavbar__nav {
            display: none;
        }

        .cabNavbar {
            justify-content: unset;
        }

        .hamburger {
            display: block;
        }
    }

    .cabCTA--header {
        margin-left: auto;
        max-width: 15.875rem;
    }
}

@media screen and (max-width: 550px) {
    .cabCTA--header {
        display: none;
    }
}

/* Main Visual */

.mv {
    display: grid;
    grid-template-columns: 54.1% 45.9%;
    margin-top: 5.5rem;
}

.mv__left {
    align-items: center;
    background: url(../images/cab/img-mv_grid.png) repeat;
    background-size: 9vw;
    display: flex;
    flex-direction: column;
    justify-content: center;

    .mv__lead {
        display: flex;
        flex-direction: column;
        gap: 1.1111vw;
    }

    .mv__leadLabel {
        background: var(--colorBlack);
        border-radius: 110px;
        color: #fff;
        font-size: 1.3889vw;
        font-weight: 900;
        margin: 0 auto;
        padding: 0.4861vw 2.2917vw;
        position: relative;
        width: fit-content;
    }

    .mv__leadLabel::before {
        background: var(--colorBlack);
        bottom: -0.5556vw;
        clip-path: polygon(0 0, 100% 0, 50% 100%);
        content: "";
        display: block;
        height: 0.625vw;
        left: 50%;
        position: absolute;
        transform: translateX(-50%);
        width: 1.3889vw;
    }

    .mv__leadText {
        font-size: 1.3889vw;
        font-weight: 900;
        text-align: center;
    }

    .mv__title {
        font-size: 2.9167vw;
        font-weight: 900;
        margin-top: 2.2222vw;
    }

    .mv__title .titleNumber {
        color: var(--colorOrange);
        display: inline-block;
        font-size: 13.8889vw;
        letter-spacing: 0;
        line-height: 0.6;
        margin-left: 0.2vw;
        transform: translateY(0.4vw);
    }

    .mv__title .percent {
        color: var(--colorOrange);
        display: inline-block;
        font-size: 4.5139vw;
        letter-spacing: -0.02em;
        line-height: 1;
        margin-right: 0.8vw;
        transform: translateY(0.4vw);
    }

    .mv__title .engTitle {
        color: var(--colorOrange);
        display: inline-block;
        font-size: 5vw;
        letter-spacing: -0.02em;
        line-height: 0.8;
        margin-right: 0.6vw;
        transform: translateY(0.4vw);
    }

    .mv__message {
        font-size: 2.2222vw;
        font-weight: 900;
        line-height: 1.45;
        margin-top: 0.8vw;
        text-align: center;
    }

    .mv__message--strong {
        font-size: 2.693vw;
    }
}

@media screen and (max-width: 767px) {
    .mv {
        grid-template-columns: 1fr;
    }

    .mv__left {
        background-size: 17vw;
        gap: 2.6667vw;
        padding: 10.6667vw 3.2vw;

        .mv__lead {
            gap: 2.1333vw;
        }

        .mv__leadLabel {
            font-size: 3.7333vw;
            padding: 0.5333vw 4.2667vw;
        }

        .mv__leadLabel::before {
            bottom: -1.6vw;
            height: 3.2vw;
            width: 6.9333vw;
        }

        .mv__leadText {
            font-size: 3.7333vw;
        }

        .mv__title {
            font-size: 7.4667vw;
            margin-right: 2.1333vw;
        }

        .mv__title .percent {
            font-size: 7.4667vw;
            margin-right: 2.1333vw;
        }

        .mv__title .titleNumber {
            font-size: 17.0667vw;
            margin-left: 2.1333vw;
        }

        .mv__title .engTitle {
            font-size: 8vw;
        }

        .mv__message {
            font-size: 4.2667vw;
        }
    }
}

@media screen and (max-width: 550px) {
    .mv {
        margin-top: 4.5rem;
    }
}

.entryBanner {
    padding: 2.5rem 1.25rem;
}

/* Positions */

.positions {
    overflow: hidden;
    padding: clamp(3.75rem, 7.4074vw, 5rem) 1.25rem;
}

.positionsSwiper,
.positionsSwiper .swiper-wrapper {
    overflow: visible;
}

.swiper-button-next,
.swiper-button-prev {
    background: rgba(0, 17, 31, 0.3);
    border-radius: 50%;
    color: transparent;
    height: 3.625rem;
    width: 3.625rem;
}

.swiper-button-prev {
    left: -40px;
    transform: translateX(-100%);
}

.swiper-button-next {
    right: -40px;
    transform: translateX(100%);
}

.swiper-button-next::before,
.swiper-button-prev::before {
    background: url(../images/cab/icon-chevron_white.png) no-repeat center /
        cover;
    content: "";
    display: block;
    height: 1.5rem;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 1.5rem;
}

.swiper-button-next::before {
    transform: translate(-50%, -50%) scaleX(-1);
}

@media screen and (max-width: 1300px) {
    .swiper-button-prev {
        left: 0;
        transform: translateX(0);
    }

    .swiper-button-next {
        right: 0;
        transform: translateX(0);
    }
}

.positionSlide {
    border: 2px solid #dcdcdc;
    border-radius: 20px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.09);
    height: auto;
    overflow: hidden;
    position: relative;
}

.positions__label {
    background: #fff;
    border-radius: 100px;
    font-size: 0.875rem;
    left: 0.5rem;
    padding: 0.25rem 1rem;
    position: absolute;
    top: 0.5rem;
}

.positions__figcaption {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    padding: 1rem;

    h3 {
        font-size: 1.125rem;
        font-weight: 900;
    }

    h4 {
        color: var(--colorAccent);
        font-size: 1rem;
        font-weight: 700;
    }

    .salary {
        font-size: 1.5rem;
        font-weight: 900;
        line-height: 1;
    }

    p {
        font-size: 0.875rem;
        font-weight: 900;
    }
}

.positions .positions-cabCTA {
    font-size: 1.33rem;
}

@media screen and (max-width: 767px) {
    .positions .positions-cabCTA {
        font-size: 1rem;
    }
}

.number {
    background: var(--colorBase);
    padding: 5rem 1.25rem;
}

.numberList__container {
    position: relative;
}

.number__disclaimer {
    bottom: 0;
    font-size: var(--fontMax14Min12);
    position: absolute;
    right: 0;
}

.numberList {
    display: grid;
    gap: 0.875rem;
    grid-template-columns: 1fr 1fr 1fr;
    margin-top: 2.5rem;
}

.numberItem {
    align-items: flex-start;
    aspect-ratio: 1.54 / 1;
    background: #fff;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    justify-content: center;
    overflow: hidden;
    padding: 1.5rem;
    position: relative;
    z-index: 1;

    p {
        color: var(--colorAccent);
        font-weight: 700;
        line-height: 1.4;
    }

    .bigNumber {
        font-family: var(--familyEn);
        font-size: clamp(3.75rem, 0.687rem + 6.39vw, 5rem);
        line-height: 0.8;
    }

    .numberImage {
        position: absolute;
        z-index: -1;
    }

    .numberImage--one,
    .numberImage--two,
    .numberImage--four {
        right: 0;
        top: 0;
        width: 57.14%;
    }

    .numberImage--three {
        right: 7.14%;
        top: 50%;
        transform: translateY(-50%);
        width: 36.57%;
    }

    .numberImage--five {
        right: 6.85%;
        top: 50%;
        transform: translateY(-50%);
        width: 51.14%;
    }
}

.numberItem:last-child {
    p {
        width: 35.2%;
    }
}

@media screen and (max-width: 850px) {
    .numberList {
        grid-template-columns: 1fr 1fr;
    }
}

@media screen and (max-width: 550px) {
    .numberList {
        grid-template-columns: 1fr;
    }
    .number__disclaimer {
        font-size: var(--fontMax14Min12);
        margin-top: 0.5rem;
        text-align: end;
        position: relative;
    }
    .numberItem {
        max-width: 21.875rem;
        place-self: center;
        width: 100%;

        .bigNumber {
            font-size: clamp(3.75rem, 1.458rem + 6.67vw, 5rem);
        }
    }
}

/* Consult */

.consult {
    background: #ff6c23;

    .container {
        padding: 3.75rem 1.25rem 2.5rem;
    }
}

.consult__top {
    aspect-ratio: 930 / 130;
    background: var(--colorBase);
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    display: block;
    height: auto;
    margin: 0 auto 0;
    max-width: 58.125rem;
    transform: translateY(-1px);
    width: 64.5vw;
}

.consult__message {
    display: grid;
    gap: clamp(1.5rem, 3.7037vw, 2.5rem);
    grid-template-columns: 3.5625rem auto 3.5625rem;
    margin: 0 auto;
    width: fit-content;

    .text {
        color: #fff;
        font-size: var(--fontMax18Min16);
        font-weight: 700;
        text-align: center;
    }

    .line {
        display: block;
        height: 3.5625rem;
        position: relative;
        width: 3.5625rem;
    }

    .line::before {
        background: #fff;
        content: "";
        display: block;
        height: 4.375rem;
        left: 50%;
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%) rotate(45deg);
        width: 1px;
    }

    .line:first-child:before {
        transform: translate(-50%, -50%) rotate(-45deg);
    }
}

.consult__card {
    align-items: center;
    background: #fff;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: 2.5rem;
    padding: clamp(2rem, 4.6296vw, 3.125rem);

    .consult__title {
        font-size: var(--fontMax40Min28);
        font-weight: 700;
        text-align: center;
    }

    .consult__cardText {
        font-size: var(--fontMax24Min18);
        font-weight: 700;
        margin-top: 0.625rem;
        text-align: center;
    }

    .cabCTA {
        margin-top: 1.5rem;
        max-width: 25rem;
    }
}

@media screen and (max-width: 767px) {
    .consult__message {
        align-items: center;
        grid-template-columns: 1.625rem auto 26px;

        .line {
            height: 1.625rem;
            width: 1.625rem;
        }
        .line::before {
            height: 1.875rem;
        }
    }
}

@media screen and (max-width: 550px) {
    .consult__card {
        padding: 2rem 1.5rem;

        .consult__title {
            font-size: 1.375rem;
        }

        .consult__cardText {
            font-size: 1rem;
        }
    }
}

/* Strengths */

.stength {
    padding: clamp(3.75rem, 9.2593vw, 6.25rem) 1.25rem;
}

.strenthList {
    display: flex;
    flex-direction: column;
    gap: 4rem;
    margin-top: 4rem;
}

.strengthItem {
    display: grid;
    grid-template-rows: auto;
    justify-content: space-between;
    row-gap: 1.5rem;

    .pointNumber {
        align-items: center;
        border: 1px solid var(--colorAccent);
        border-radius: 100px;
        color: var(--colorAccent);
        display: flex;
        font-family: "Inter", sans-serif;
        font-size: var(--fontMax18Min16);
        font-weight: 700;
        grid-row: 1;
        height: 2.25rem;
        justify-content: center;
        line-height: 1;
        padding: 0 1.875rem;
        width: fit-content;
    }

    .pointTitle {
        font-size: var(--fontMax32Min24);
        font-weight: 700;
        grid-row: 2;
    }

    .pointText {
        color: var(--colorBlackTwo);
        grid-row: 3;
    }

    .pointImage {
        grid-row: span 3;
        place-self: center;
    }
}

.strengthItem:nth-child(odd) {
    grid-template-columns: 64.8% 27.78%;

    .pointTitle,
    .pointText,
    .pointNumber {
        grid-column: 1;
    }

    .pointImage {
        grid-column: 2;
    }
}

.strengthItem:nth-child(even) {
    grid-template-columns: 27.78% 64.8%;

    .pointImage {
        grid-column: 1;
    }

    .pointTitle,
    .pointText,
    .pointNumber {
        grid-column: 2;
    }
}

@media screen and (max-width: 767px) {
    .strengthItem {
        .pointImage {
            grid-row: span 2;
        }
    }

    .strengthItem:nth-child(odd),
    .strengthItem:nth-child(even) {
        .pointText {
            grid-column: span 2;
        }
    }
}

@media screen and (max-width: 550px) {
    .strengthItem:nth-child(odd),
    .strengthItem:nth-child(even) {
        grid-template-columns: 1fr;

        .pointNumber,
        .pointTitle,
        .pointText,
        .pointImage,
        .pointText {
            grid-column: 1;
        }

        .pointNumber {
            height: 2rem;
        }

        .pointTitle {
            font-size: 1.125rem;
            text-align: center;
        }

        .pointImage {
            grid-row: 3;
        }

        .pointText {
            grid-row: 4;
        }

        .pointImage img {
            max-width: 15.625rem;
        }
    }

    .strengthItem:nth-child(2) {
        .pointImage {
            padding: 1rem 0;
        }
    }
}

/* Interview */

.interview {
    background: var(--colorBase);
    padding: clamp(3.75rem, 9.2593vw, 6.25rem) 1.25rem;
}

.interview__list {
    display: flex;
    flex-direction: column;
    gap: 4rem;
    margin-top: 4rem;
}

.interview__item {
    display: grid;
    gap: 1rem 2.5rem;
    grid-template-columns: clamp(8.75rem, 21.25vw, 10.625rem);
    grid-template-rows: auto;
    max-width: 55rem;
    place-self: center;
    width: 100%;

    .interview__image {
        grid-column: 1;
        grid-row: span 2;
    }

    .interview__image img {
        border-radius: 20px;
    }

    .interview__details {
        color: #4d4949;
        font-size: 0.75rem;
        grid-column: 2;
        grid-row: 1;
    }

    .interview__text {
        font-size: 0.875rem;
        grid-column: 2;
        grid-row: 2;
    }
}

@media screen and (max-width: 550px) {
    .interview .sectionTitle {
        h2 {
            font-size: 1.625rem;
        }
    }

    .interview__item {
        display: flex;
        flex-direction: column;

        .interview__image {
            order: 2;
            margin-inline: auto auto;
            width: 60%;
        }

        .interview__details {
            order: 1;
        }

        .interview__text {
            order: 3;
        }
    }
}

.flow {
    padding: clamp(3.75rem, 9.2593vw, 6.25rem) 1.25rem;

    .sectionTitle {
        text-align: start;
    }

    .container {
        display: flex;
        flex-direction: column;
        gap: 2.5rem;
    }
}

.flow__message {
    font-size: var(--fontMax18Min16);
    font-weight: 400;
    letter-spacing: 0.02em;
}

.flow__list {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    justify-content: center;

    .flow__item {
        display: flex;
        flex-direction: column;
        max-width: 11.875rem;
        width: 100%;
    }

    .flow__number {
        color: #fff;
        font-family: var(--familyEn);
        /* Max 80px Min 60px */
        font-size: clamp(3.75rem, 2.453rem + 3.77vw, 5rem);
        font-weight: 700;
        line-height: 1.4;
        -webkit-text-fill-color: #fff;
        -webkit-text-stroke-color: var(--colorAccent);
        -webkit-text-stroke-width: 1px;
    }

    .flow__heading {
        color: var(--colorAccent);
        font-size: 1.125rem;
        font-weight: 700;
    }

    .flow__text {
        font-weight: 400;
        letter-spacing: 0.02em;
        margin-top: 1rem;
    }

    @media screen and (max-width: 1145px) {
        margin: 0 auto;
        max-width: 52.5rem;
    }

    @media screen and (max-width: 767px) {
        display: grid;
        grid-template-columns: 1fr 1fr;
        max-width: none;

        .flow__item {
            max-width: none;
        }
    }

    @media screen and (max-width: 550px) {
        display: grid;
        grid-template-columns: 1fr;
    }
}

@media screen and (max-width: 550px) {
    .flow {
        .sectionTitle h2 {
            font-size: 1.5rem;
        }
    }
}

/* FAQ */

.faq {
    background: var(--colorBase);
    padding: 5rem 1.25rem;
}

.faq__list {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    margin-top: 2.5rem;
}

.faq__item {
    .faq__btn {
        align-items: center;
        background: #fff;
        border: none;
        border-radius: 10px;
        display: grid;
        gap: 1rem;
        grid-template-columns: auto 1fr 2.5rem;
        padding: 1rem 1.5rem;
        width: 100%;
    }

    .faq__btnText,
    .faq__q {
        font-weight: 700;
        text-align: left;
    }

    .faq__q {
        font-family: var(--familyEn);
        font-size: var(--fontMax24Min18);
        line-height: 1.4;
    }

    .faq__chevron img {
        transition: 0.2s;
    }

    .faq__body {
        max-height: 0px;
        overflow: hidden;
        transition: max-height 0.3s;
    }

    .faq__answer {
        padding-top: 1rem;
    }

    .faq__answer p,
    .faq__answer li {
        font-size: 0.875rem;
    }
}

.faq__item.closed {
    .faq__chevron img {
        transform: scaleY(-1);
    }
}

/* Entry */

.entry {
    background: #ff6c23;
    padding: clamp(3.75rem, 7.4074vw, 5rem) 1.25rem;

    .sectionTitle {
        h2,
        p {
            color: #fff;
        }
    }
}

.formBox {
    background: #fff;
    border-radius: 20px;
    margin: 2.5rem auto 0;
    max-width: 60rem;
    padding: 2.5rem clamp(2.5rem, 7.4074vw, 5rem);
    width: 100%;

    .formBox__message {
        font-size: 0.875rem;
        font-weight: 400;
        letter-spacing: 0.02em;
        text-align: center;
    }

    hr {
        background: #abaaa6;
        border: none;
        height: 1px;
        margin: 2.25rem 0 2.5rem;
        width: 100%;
    }
}

.contactForm__fieldset {
    border: none;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;

    .formRow {
        display: grid;
        gap: 0.5rem;
        grid-template-columns: clamp(12.5rem, 15rem, 15rem) 1fr;
    }

    label {
        display: flex;
        font-size: 0.875rem;
        gap: 0.5rem;
    }

    .required {
        color: var(--colorImportant);
    }

    input[type="text"],
    input[type="email"],
    input[type="tel"],
    input[type="date"],
    textarea {
        background: #f2f2f2;
        border: none;
        font-size: 0.875rem;
        text-align: left;
        letter-spacing: 0.02em;
        padding: 1rem 1.25rem;
        width: 100%;
    }

    input[type="text"]::placeholder,
    input[type="email"]::placeholder,
    input[type="tel"]::placeholder,
    textarea::placeholder {
        color: #4d4d4d;
    }

    textarea {
        height: 10rem;
        resize: vertical;
    }
}

.form__confirm {
    cursor: pointer;
    margin: 2.5rem auto 0;
    width: fit-content;

    label,
    a {
        font-size: 0.875rem;
        font-weight: 400;
        letter-spacing: 0.02em;
    }

    a {
        text-decoration: underline;
        text-underline-offset: 2px;
    }

    .required {
        color: var(--colorImportant);
    }
}

.form__submit {
    border: none;
    margin-top: 2.5rem;
}

@media screen and (max-width: 767px) {
    .contactForm__fieldset {
        .formRow {
            grid-template-columns: 1fr;
        }
    }
}

@media screen and (max-width: 550px) {
    .formBox {
        padding: 2.5rem 1.5rem;
    }

    .entry {
        .sectionTitle {
            h2 {
                font-size: 1.5rem;
            }
        }
    }
}

/* Company */

.company {
    padding: clamp(3.75rem, 9.2593vw, 6.25rem) 1.25rem;
}

.company__details {
    display: grid;
    grid-template-columns: clamp(8.75rem, 22.2222vw, 15rem) 1fr;
    margin: 3.75rem auto 0;
    width: fit-content;

    dt,
    dd {
        padding: 1rem 0;
    }

    dt {
        font-size: 0.875rem;
        font-weight: 700;
        grid-column: 1;
    }

    dt:first-child {
        padding-top: 0;
    }

    dd {
        font-size: 0.875rem;
        grid-column: 2;
    }
}

@media screen and (max-width: 767px) {
    .company__details {
        display: flex;
        flex-direction: column;

        dt {
            padding-bottom: 0.2rem;
        }

        dd {
            padding-top: 0;
        }
    }
}

/* Footer */

.cabFooter {
    background: var(--colorBlack);
    padding: 5rem clamp(2.5rem, 7.4074vw, 5rem);

    .cabFooter__container {
        display: flex;
        justify-content: space-between;
        margin: 0 auto;
        max-width: 80rem;
        width: 100%;
    }

    .cabFooter__logo img {
        max-width: 6.25rem;
    }

    .cabFooter__links {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .privacyPolicy {
        color: #fff;
        font-size: 0.75rem;
        font-weight: 700;
    }

    .copywrite {
        color: #fff;
        font-family: "Open Sans", sans-serif;
        font-size: 0.625rem;
    }

    @media screen and (max-width: 550px) {
        .cabFooter__container {
            flex-direction: column;
            gap: 1rem;
        }
        .cabFooter__links {
            gap: 0.5rem;
        }
    }
}

/* お問い合わせ 確認画面 */
.moveButton__column {
  display: flex;
  justify-content: space-between;
  gap: 30px;
  align-items: flex-end;
  flex-wrap: wrap;
  margin-top: 20px;
}
.form__confirmInner {
  margin: 200px auto 0;
  max-width: 600px;
  padding: 20px;
}
.form__confirmWrap {
  margin: 0 auto 200px;
}
.terms {
  display: none;
}
.backButton {
  width: 260px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #000;
  background: #fff;
  border: 1px solid #000;
  transition: 0.3s;
  font-weight: 500;
}
.backButton:hover {
  background: #000;
  color: #fff;
}
.submitButton {
  width: 260px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center; 
  color: #fff;
  background: #000;
  transition: 0.3s;
  border: 1px solid #000;
  font-weight: 500;
}
.submitButton:hover {
  background: #fff;
  color: #000;
}
/* お問い合わせ 完了画面 */
.completeForm {
display: grid;
height: 100vh;
grid-template-rows: 1fr auto;
}
.completeTextWrap {
  max-width: 500px;
  width: 100%;
  margin: auto;
  text-align: center;
  padding-inline: 20px;
  padding-block: 20vh;
  min-height: calc(100% - 484px);
}
.completeText {
  font-size: 18px;
  font-weight: 500;
}
.complete__backButton {
  border: 1px solid #000;
  background: #fff;
  color:#000;
  width: 150px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: 0.3s;
  margin: 40px auto 0;
  font-weight: 500;
}
.complete__backButton:hover {
  background: #000;
  color: #fff;
}

.completeTextWrap + .cabFooter {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.font-semibold {
    font-weight: 600;
}

.text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem;
}

.mb-4 {
    margin-bottom: 1rem;
}

.font-medium {
    font-weight: 500;
}