@charset "UTF-8";

@media screen and (max-width:1200px) {

    /* header */
    .header {
        height: 70px;
    }

    .header__logo {
        max-height: 40px;
    }

    .header__nav,
    .nav-btn {
        display: none;
    }

    .toggle-btn {
        display: block;
    }

    .hidden-menu {
        display: block;
    }

    /* mv */
    .mv__image-1,
    .mv__image-2,
    .mv__image-3,
    .mv__image-4 {
        min-width: auto;
    }

    .mv__shapes-pink,
    .mv__shapes-blue,
    .mv__shapes-green {
        min-width: auto;
    }

    .mv__image-4 {
        display: none;
    }

    .mv__text-main,
    .mv__text-sub {
        left: 5%;
    }

    .mv__text-main {
        bottom: 15%;
        width: 70%;
        max-width: 350px;
        min-width: 240px;
    }

    .mv__text-sub {
        bottom: 3%;
        width: 40%;
        max-width: 250px;
        min-width: 200px;
    }

    .mv__image-1 {
        top: 40%;
        left: 50%;
        width: 45%;
        min-width: 200px;
    }

    .mv__image-2 {
        left: 35%;
        width: 30%;
        min-width: 150px;
    }

    .mv__image-3 {
        top: 33%;
        width: 35%;
        min-width: 160px;
    }

    .mv__shapes-pink {
        top: 45%;
        left: 40%;
        width: 25%;
        min-width: 100px;
    }

    .mv__shapes-blue {
        top: 10%;
        left: 25%;
        width: 25%;
        min-width: 80px;
    }

    .mv__shapes-green {
        top: 25%;
        width: 23%;
        min-width: 75px;
    }

    .mv__illust-1 {
        top: 20%;
        left: 70%;
        width: 20%;
        min-width: 100px;
    }

    .mv__illust-2 {
        top: 68%;
        left: 65%;
        width: 22%;
        min-width: 100px;
    }

}

@media screen and (max-width:768px) {

    :root {
        /* font size */
        --default-size: 14px;
        --headline-size: 24px;
        --title-size: 20px;
        --subtitle-size: 16px;
        --sub-size: 12px;
    }

    .tel a {
        pointer-events: auto;
    }

    section {
        margin: 80px auto 0;
    }

    .wrapper {
        max-width: 100%;
        padding: 0 25px;
    }

    .sp-br {
        display: block;
    }

    .headline span::before {
        width: 50px;
        margin-right: 8px;
    }

    /* header */
    .header__inner {
        padding: 0 24px;
    }

    .cta-btn__inner {
        padding: 8px 16px;
    }

    .mail-icon {
        width: 16px;
        height: 16px;
    }

    /* mv */
    .mv {
        height: 95vh;
    }

    /* p-message */
    .p-message__img {
        width: 100%;
        height: 100%;
    }

    .p-message__img img {
        object-fit: cover;
        object-position: right;
    }

    .p-message__headline,
    .p-message__text {
        text-align: left;
    }

    /* introduction */
    .p-introduction__item {
        flex-direction: column;
    }

    .p-introduction__image {
        width: 100%;
        max-width: 100%;
        margin-bottom: 40px;
    }

    .intro-reverse .p-introduction__image {
        width: 100%;
        max-width: 100%;
        margin: 0 0 40px 0;
    }

    /* feature */
    .p-features__inner-item {
        flex-direction: column-reverse;
    }

    .p-features__image,
    .p-features__text {
        width: 100%;
        margin-right: 0;
        margin-left: 0;
    }

    .p-features__text {
        margin-bottom: 40px;
    }

    .features-reverse .p-features__image {
        width: 100%;
        margin-right: 0;
        margin-left: 0;
    }

    /* service */
    .p-service__items {
        flex-direction: column;
    }

    .p-service__image {
        margin-bottom: 40px;
    }

    .p-service__item {
        width: 100%;
    }

    /* access */
    .p-access__items {
        flex-direction: column-reverse;
    }

    .p-access__map {
        width: 100%;
        max-width: 100%;
        margin-right: 0;
        aspect-ratio: 16 / 9;
    }

    .p-access__text {
        width: 100%;
        max-width: 100%;
        margin-bottom: 24px;
    }

    /* contact */
    .contact__buttons {
        flex-direction: column;
    }

    /* footer */
    .footer__items {
        flex-direction: column;
        max-width: 350px;
        margin: 0 auto;
    }

    .footer__logo {
        margin: 0 auto;
        max-width: 140px;
    }

    .footer__info {
        margin: 40px 0;
    }

    footer__menu ul li {
        text-align: left;
    }

    .footer__bottom {
        flex-direction: column;
        gap: 24px;
    }

    /* recruit */
    .l-top {
        height: 200px;
    }

    .l-greeting__headline h2 {
        text-align: left;
    }

    .l-greeting__text p {
        text-align: left;
    }

    .l-concept__items {
        display: grid;
        grid-template-columns: 1fr;
        row-gap: 80px;
    }

    /* require */
    .l-require__table {
        padding: 40px;
    }

    .l-require__list {
        flex-direction: column;
    }

    .l-require__list dt {
        width: 100%;
        padding: 24px 16px;
    }

    .l-require__list dd {
        width: 100%;
        padding: 24px 16px
    }

    /* contact */
    .l-contact__form dl {
        flex-direction: column;
    }

    .l-contact__inner .contact dl dt {
        width: 100%;
    }

    .l-contact__inner .contact dl dd {
        width: 100%;
    }

    .l-contact__form .contact__button input {
        padding: 16px 25%;
    }

    .l-contact__form .required::after {
        right: 0;
    }

    .l-contact__form .optional::after {
        right: 0;
    }
}

@media screen and (max-width:580px) {
    .dd-grid .wpcf7-radio {
        grid-template-columns: 1fr;
    }
}