/*
 * ARIEL 初めての方へ固定ページ
 */

.beginner-page {
    --beginner-content-width: var(--sky-content, 520px);
    --beginner-text: #294b49;
    --beginner-deep: #176f69;
    --beginner-turquoise: #239f96;
    --beginner-mint: #eaf8f5;
    --beginner-sky: #eff9fc;
    --beginner-off-white: #f9fffd;
    --beginner-beige: #fcf8ef;
    --beginner-border: #b9ded9;
}

.beginner-page,
.beginner-page * {
    box-sizing: border-box;
}

.beginner-main {
    width: 100%;
    margin: 0;
    padding: 0;
    background: var(--beginner-off-white);
}

.beginner-page.sky-home {
    width: min(100%, var(--beginner-content-width));
    margin-inline: auto;
    overflow: hidden;
    color: var(--beginner-text);
    font-family:
        "Hiragino Maru Gothic ProN",
        "Yu Gothic",
        "Noto Sans JP",
        "Meiryo",
        sans-serif;
    background: var(--beginner-off-white);
}

.beginner-main ~ .site-footer {
    display: none;
}

.beginner-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

.beginner-hero,
.beginner-theme {
    width: 100%;
    margin: 0;
    padding: 0;
}

.beginner-hero {
    background: #dcf6f3;
}

.beginner-hero__image,
.beginner-theme__image {
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    margin: 0;
}

.beginner-intro,
.beginner-closing {
    padding: 42px 22px 46px;
}

.beginner-intro {
    background:
        linear-gradient(
            180deg,
            #f9fffd 0%,
            #eefaf7 100%
        );
    border-bottom: 1px solid #d3ece8;
}

.beginner-closing {
    background:
        linear-gradient(
            180deg,
            #eefaf7 0%,
            #f9fffd 100%
        );
    border-top: 1px solid #d3ece8;
}

.beginner-section__eyebrow {
    margin: 0 0 8px;
    color: #338f88;
    font-size: clamp(0.76rem, 3vw, 0.88rem);
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: 0.13em;
    text-align: center;
}

.beginner-intro h2,
.beginner-closing h2 {
    margin: 0;
    color: var(--beginner-deep);
    font-size: clamp(1.45rem, 6vw, 1.8rem);
    font-weight: 800;
    line-height: 1.5;
    letter-spacing: 0.02em;
    text-align: center;
}

.beginner-prose {
    margin-top: 26px;
    color: var(--beginner-text);
    font-size: clamp(1rem, 4.2vw, 1.08rem);
    line-height: 1.9;
}

.beginner-prose p {
    margin: 0 0 18px;
}

.beginner-prose p:last-child {
    margin-bottom: 0;
}

.beginner-prose strong {
    color: #175f5a;
    font-weight: 800;
}

.beginner-intro__steps {
    display: grid;
    gap: 10px;
    margin: 24px 0;
}

.beginner-intro__steps p {
    margin: 0;
    padding: 13px 15px;
    color: #176f69;
    font-size: clamp(1.02rem, 4.25vw, 1.12rem);
    font-weight: 800;
    line-height: 1.5;
    text-align: center;
    background: #ffffff;
    border: 2px solid #a8d9d3;
    border-radius: 16px;
}

.beginner-prose__closing {
    margin-top: 24px !important;
    padding: 18px;
    color: #175f5a;
    font-weight: 700;
    background: #ffffff;
    border: 2px solid #b9ded9;
    border-radius: 18px;
}

.beginner-theme {
    background: var(--beginner-off-white);
}

.beginner-theme--before {
    background: #f7fcfe;
}

.beginner-theme--privacy {
    background: #fcfbf6;
}

.beginner-theme--after {
    background: #f4fbf9;
}

.beginner-faqs {
    display: grid;
    gap: 18px;
    padding: 30px 16px 42px;
}

.beginner-faq {
    overflow: hidden;
    background: #ffffff;
    border: 2px solid var(--beginner-border);
    border-radius: 20px;
}

.beginner-theme--before .beginner-faq {
    border-color: #b9dce7;
}

.beginner-theme--privacy .beginner-faq {
    border-color: #ddd8c9;
}

.beginner-theme--after .beginner-faq {
    border-color: #b7ddd7;
}

.beginner-faq h3 {
    position: relative;
    margin: 0;
    padding: 17px 17px 17px 48px;
    color: #175f5a;
    font-size: clamp(1.08rem, 4.5vw, 1.22rem);
    font-weight: 800;
    line-height: 1.55;
    background: var(--beginner-mint);
    border-bottom: 1px solid #cce8e4;
}

.beginner-theme--before .beginner-faq h3 {
    background: var(--beginner-sky);
    border-bottom-color: #d4e8ee;
}

.beginner-theme--privacy .beginner-faq h3 {
    background: var(--beginner-beige);
    border-bottom-color: #e5dfd2;
}

.beginner-theme--after .beginner-faq h3 {
    background: #edf9f6;
}

.beginner-faq h3::before {
    position: absolute;
    top: 1.48em;
    left: 18px;
    width: 15px;
    height: 15px;
    background: var(--beginner-turquoise);
    border-radius: 50%;
    content: "";
    transform: translateY(-50%);
}

.beginner-theme--before .beginner-faq h3::before {
    background: #55a9c1;
}

.beginner-theme--privacy .beginner-faq h3::before {
    background: #9c9178;
}

.beginner-faq__body {
    padding: 20px 19px 22px;
    color: #365957;
    font-size: clamp(1rem, 4.15vw, 1.08rem);
    line-height: 1.9;
}

.beginner-faq__body p {
    margin: 0 0 16px;
}

.beginner-faq__body p:last-child {
    margin-bottom: 0;
}

.beginner-faq__body strong {
    color: #175f5a;
    font-weight: 800;
}

.beginner-closing__message {
    margin: 26px 0 !important;
    padding: 18px 14px;
    color: #126f69;
    font-size: clamp(1.12rem, 4.7vw, 1.28rem);
    font-weight: 800;
    line-height: 1.65;
    text-align: center;
    background: #ffffff;
    border: 2px solid #9fd7d0;
    border-radius: 18px;
}

@media (max-width: 360px) {
    .beginner-intro,
    .beginner-closing {
        padding-right: 18px;
        padding-left: 18px;
    }

    .beginner-faqs {
        padding-right: 13px;
        padding-left: 13px;
    }

    .beginner-faq h3 {
        padding-right: 14px;
        padding-left: 43px;
    }

    .beginner-faq h3::before {
        left: 15px;
    }

    .beginner-faq__body {
        padding-right: 16px;
        padding-left: 16px;
    }
}

/* ARIEL BEGINNER TEXT SAND BG V2 START 20260807 */

/*
 * Approved sand background.
 *
 * Applied only to:
 * - introduction section
 * - four FAQ outer areas
 *
 * Excluded:
 * - approved visual images
 * - FAQ cards themselves
 * - closing visual
 * - shared LINE CTA
 * - shared footer
 *
 * Existing spacing is unchanged.
 */

.beginner-intro,
.beginner-faqs {
    background-color: #fbf7ef;
    background-image:
        url("/wp-content/themes/ariel-recruit-official/assets/images/sky/beginner-text-sand-bg.webp?v=c2f355ca");
    background-repeat: repeat-y;
    background-position: center top;
    background-size: 100% auto;
}

.beginner-faq {
    background-color: #ffffff;
    background-image: none;
}

/* ARIEL BEGINNER TEXT SAND BG V2 END 20260807 */


/* ARIEL BEGINNER CLOSING VISUAL V1 START 20260807 */

.beginner-closing.beginner-closing--visual {
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: visible;
    background: transparent;
    border: 0;
}

.beginner-closing--visual .beginner-closing__image {
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    max-height: none;
    margin: 0;
}

/*
 * Approved image: 1024 × 1536px.
 * No fixed height, crop, squeeze,
 * or aspect-ratio modification.
 */

/* ARIEL BEGINNER CLOSING VISUAL V1 END 20260807 */


/* ARIEL BEGINNER APPLICATION LINK V1 START 20260812 */

.beginner-application-link {
    padding: 28px 18px 30px;
    text-align: center;
    background: #f1fbf8;
    border-top: 1px solid #c8e8e1;
}

.beginner-application-link__eyebrow {
    margin: 0 0 7px;
    color: #278f87;
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: 0.14em;
}

.beginner-application-link h2 {
    margin: 0;
    color: #185f59;
    font-size: clamp(1.25rem, 5.3vw, 1.5rem);
    font-weight: 800;
    line-height: 1.55;
}

.beginner-application-link__text {
    margin: 12px 0 0;
    color: #486764;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.8;
}

.beginner-application-link__button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 56px;
    margin: 20px auto 0;
    padding: 11px 18px;
    color: #ffffff;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
    background: #249d93;
    border: 2px solid #ffffff;
    border-radius: 999px;
}

.beginner-application-link__button:focus-visible {
    outline: 3px solid #176f69;
    outline-offset: 3px;
}

/* ARIEL BEGINNER APPLICATION LINK V1 END 20260812 */


/* ARIEL BEGINNER RELATED LINKS V1 START 20260812 */

.beginner-related-link {
    margin: 20px 0 0 !important;
}

.beginner-related-link a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 52px;
    padding: 11px 15px;
    color: #176f69;
    font-size: 0.98rem;
    font-weight: 800;
    line-height: 1.55;
    text-align: center;
    text-decoration: none;
    background: #f2fbf9;
    border: 2px solid #a8d9d3;
    border-radius: 14px;
}

.beginner-related-link a::after {
    margin-left: 7px;
    content: "›";
    font-size: 1.25em;
    line-height: 1;
}

.beginner-related-link a:focus-visible {
    outline: 3px solid #176f69;
    outline-offset: 3px;
}

/* ARIEL BEGINNER RELATED LINKS V1 END 20260812 */