@use "global" as *;

.wpcf7-form-control-wrap {
    width: 100%;
    @include mq(md) {
        max-width: rem(714);
        margin-left: auto;
    }
}
.p-form__birth .wpcf7-form-control-wrap {
    width: auto;
    @include mq(md) {
        margin: 0;
    }
}
.wpcf7-list-item {
    margin: 0;
}
.wpcf7-not-valid-tip {
    font-size: rem(16);
    white-space: nowrap;
    font-weight: 500;
}
.p-form__radiobutton .wpcf7-not-valid-tip,
.p-form__check .wpcf7-not-valid-tip {
    margin-left: 0;
}
.wpcf7 form .wpcf7-response-output {
    display: none;
}
.wpcf7-spinner {
    display: none;
}
.p-form__check .wpcf7-list-item-label {
    font-size: rem(16);
    font-weight: 500;
    letter-spacing: .1em;
    position: relative;
    margin-left: rem(27);
    margin-right: rem(3);
    @include mq(md) {
        margin-right: rem(23);
    }
}
.p-form__check--list .wpcf7-list-item-label {
    @include mq(md) {
        font-size: rem(14);
    }
}
.p-form__check .wpcf7-list-item-label:before {
    content: '';
    background: #FFF;
    border: 1px solid #D9D9D9;
    border-radius: 50%;
    display: block;
    position: absolute;
    top: rem(4);
    left: rem(-27);
    width: rem(16);
    height: rem(16);
}
.p-form__check .wpcf7-list-item-label:after {
    content: '';
    background: #D9D9D9;
    border-radius: 50%;
    display: block;
    opacity: 0;
    position: absolute;
    top: rem(12);
    left: rem(-23);
    transform: translateY(-50%);
    width: rem(8);
    height: rem(8);
    transition: .3s ease;
}
input[type=checkbox]:checked + .wpcf7-list-item-label:after {
    opacity: 1;
}

input[type=checkbox]:checked + .wpcf7-list-item-label:before {
    // border-color: $black;
}

.wpcf7-form-control.wpcf7-radio.p-form__radio {
    display: flex;
    flex-direction: column;
    row-gap: rem(15);
    @include mq(md) {
        flex-direction: row;
        flex-wrap: wrap;
        column-gap: rem(36);
    }
}

.wpcf7-form-control.wpcf7-radio.p-form__radio--category {
    @include mq(md) {
        column-gap: rem(15);
    }
}

.wpcf7-form-control.wpcf7-radio.p-form__radioDay {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: rem(9) rem(20);
    width: 100%;
    max-width: rem(238);
    @include mq(md) {
        display: flex;
        max-width: none;
        column-gap: rem(16.5);
    }
}

.p-form__wrap--capabilities .wpcf7-list-item.last::after {
    content: " ※ご記入ください。";
    font-size: rem(15);
    @include mq(md) {
        font-size: rem(18);
    }
}