@font-face {
    font-family: 'Noto Sans';
    font-style: normal;
    font-weight: 400;
    src: url('/user_data/packages/2023_design/assets/fonts/notosan/noto-sans-v25-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('/user_data/packages/2023_design/assets/fonts/notosan/noto-sans-v25-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/user_data/packages/2023_design/assets/fonts/notosan/noto-sans-v25-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('/user_data/packages/2023_design/assets/fonts/notosan/noto-sans-v25-latin-regular.woff') format('woff'), /* Modern Browsers */ url('/user_data/packages/2023_design/assets/fonts/notosan/noto-sans-v25-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('/user_data/packages/2023_design/assets/fonts/notosan/noto-sans-v25-latin-regular.svg#NotoSans') format('svg'); /* Legacy iOS */
}

/* Noto Sans JP — html/user_data/packages/2023_design/assets/fonts/Noto_Sans_JP/ (see README.txt) */
@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('/user_data/packages/2023_design/assets/fonts/Noto_Sans_JP/NotoSansJP-VariableFont_wght.ttf') format('truetype-variations'),
    url('/user_data/packages/2023_design/assets/fonts/Noto_Sans_JP/NotoSansJP-VariableFont_wght.ttf') format('truetype');
}

@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 100;
    font-display: swap;
    src: url('/user_data/packages/2023_design/assets/fonts/Noto_Sans_JP/static/NotoSansJP-Thin.ttf') format('truetype');
}

@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 200;
    font-display: swap;
    src: url('/user_data/packages/2023_design/assets/fonts/Noto_Sans_JP/static/NotoSansJP-ExtraLight.ttf') format('truetype');
}

@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url('/user_data/packages/2023_design/assets/fonts/Noto_Sans_JP/static/NotoSansJP-Light.ttf') format('truetype');
}

@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('/user_data/packages/2023_design/assets/fonts/Noto_Sans_JP/static/NotoSansJP-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('/user_data/packages/2023_design/assets/fonts/Noto_Sans_JP/static/NotoSansJP-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('/user_data/packages/2023_design/assets/fonts/Noto_Sans_JP/static/NotoSansJP-SemiBold.ttf') format('truetype');
}

@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('/user_data/packages/2023_design/assets/fonts/Noto_Sans_JP/static/NotoSansJP-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url('/user_data/packages/2023_design/assets/fonts/Noto_Sans_JP/static/NotoSansJP-ExtraBold.ttf') format('truetype');
}

@font-face {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: url('/user_data/packages/2023_design/assets/fonts/Noto_Sans_JP/static/NotoSansJP-Black.ttf') format('truetype');
}

@font-face {
    font-family: Hiragino;
    font-style: normal;
    font-weight: 100;
    src: url('https://xqnm4cq1.user.webaccel.jp/user_data/packages/2023_design/assets/fonts/HiraKakuProN-W1-AlphaNum-01.otf'); /* Safari, Android, iOS */
}

@font-face {
    font-family: Hiragino;
    font-style: normal;
    font-weight: 300;
    src: url('https://xqnm4cq1.user.webaccel.jp/user_data/packages/2023_design/assets/fonts/HiraKakuProN-W3-AlphaNum-01.otf'); /* Safari, Android, iOS */
}

@font-face {
    font-family: Hiragino;
    font-style: normal;
    font-weight: 500;
    /*src: url('/user_data/packages/2023_design/assets/fonts/fonts/HiraKakuProN-W1-AlphaNum-01.eot'); !* IE9 Compat Modes *!*/
    /*src: url('/user_data/packages/2023_design/assets/fonts/HiraKakuProN-W1-AlphaNum-01.woff2') format('woff2'); !* Super Modern Browsers *!*/
    /*src: url('/user_data/packages/2023_design/assets/fonts/HiraKakuProN-W1-AlphaNum-01.woff') format('woff'); !* Pretty Modern Browsers *!*/
    /*src: url('/user_data/packages/2023_design/assetsfonts/HiraKakuProN-W1-AlphaNum-01.ttf')  format('truetype'); !* Safari, Android, iOS *!*/
    src: url('https://xqnm4cq1.user.webaccel.jp/user_data/packages/2023_design/assets/fonts/HiraKakuProN-W5-AlphaNum-01.otf'); /* Safari, Android, iOS */
}

@font-face {
    font-family: Hiragino;
    font-style: normal;
    font-weight: 700;

    src: url('https://xqnm4cq1.user.webaccel.jp/user_data/packages/2023_design/assets/fonts/HiraKakuStdN-W7-AlphaNum-01.otf'); /* Safari, Android, iOS */
}

@font-face {
    font-family: Hiragino;
    font-style: normal;
    font-weight: 800;

    src: url('/user_data/packages/2023_design/assets/fonts/fonts/HiraKakuProN-W5-AlphaNum-01.eot'); /* IE9 Compat Modes */
    src: url('/user_data/packages/2023_design/assets/fonts/HiraKakuProN-W5-AlphaNum-01.woff2') format('woff2'); /* Super Modern Browsers */
    src: url('/user_data/packages/2023_design/assets/fonts/HiraKakuProN-W5-AlphaNum-01.woff') format('woff'); /* Pretty Modern Browsers */
    src: url('/user_data/packages/2023_design/assetsfonts/HiraKakuProN-W5-AlphaNum-01.ttf') format('truetype'); /* Safari, Android, iOS */
    src: url('/user_data/packages/2023_design/assets/fonts/HiraKakuStdN-W8-AlphaNum-01.otf'); /* Safari, Android, iOS */
}

.site-anhtt-staffing-solutions .wrap-dh {
    background-image: url(../img/houjin/cover.webp);
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    text-align: center;
    height: 12vw;
    flex-direction: column;
    margin-top: -1px;
}

.site-anhtt-staffing-solutions .wrap-dh p, .site-anhtt-staffing-solutions .wrap-dh h1 {
    margin: 0;
    color: #000;
    font-size: 24px;
    width: 100%;
    font-weight: 300;
}

.site-anhtt-staffing-solutions .wrap-dh h1 {
    line-height: 1.6;
}

.site-anhtt-staffing-solutions .wrap-dh p.span, .site-anhtt-staffing-solutions .wrap-dh h1 span.span {
    margin: 0;
    color: #000;
    font-size: 36px;
}

.site-anhtt-staffing-solutions .wrap-dh h1 span.span {
    width: 100%;
    display: block;
    line-height: 38px;
}

.m-b-30 {
    margin-bottom: 30px;
}


body * {
    font-family: "Noto Sans JP";
}

@media (min-width: 765.01px) {
    #content {
        padding-bottom: 0;
    }
    .site-header {
        background-color: #fff;
        position: relative;
    }

    .site-header .sha-nav .w-right .tele-number-top {
        font-size: 24px;
        font-weight: 700;
        padding-left: 4px;
        color: #FF6E35;
        -webkit-text-stroke-width: 0;
        margin-bottom: 0;
        letter-spacing: 2%;
        font-family: 'Hiragino';
    }

    .sha-right.header-nav-li .header-nav-li-ele {
        padding-top: 12px;
    }

    .sha-right.header-nav-li {
        border-right-width: 0;
        padding-left: 0;
        padding-right: 0;
    }

    .site-header .sha-container {
        max-width: 1200px;
        padding: 0 32px;
        margin: 0 auto
    }

    .site-header .sha-nav .logo {
        width: 300px;
        padding-bottom: 17px;
        padding-top: 23px;
    }

    .site-header .sha-nav .w-right .working-time-top {
        font-size: 16px;
        text-align: left;
        font-weight: 500;
        line-height: 1;
        padding-left: 33px;
        color: #FF6E35;
        margin-right: 0;
        margin-top: 4px;
        font-family: 'Hiragino';

    }

    .header-nav-li-ele > a {
        display: flex;
        align-items: center;
        margin-bottom: 2px;
    }

    .site-header .sha-nav .w-right .icon-hd-top {
        margin-bottom: 0;
    }

    .banner img {
        width: 100%;
        height: auto;
    }

    .sha-container.banner-sha-container {
        max-width: none;
        padding: 0;
    }

    /* Flow layout + responsive overrides (loads after style.css) */
    /* Pharma LP — layout-first (flex/grid). Decorative hero layer uses one absolute wrapper only. */
    :root {
        --color-yellow: #ffd341;
        --color-yellow-deep: #ffd240;
        --color-yellow-soft: #fff5c5;
        --color-orange: #ff6d35;
        --color-orange-dark: #fe8238;
        --color-orange-mid: #ed8617;
        --color-green: #21c65b;
        --color-text: #303030;
        --color-text-muted: #494949;
        --color-gray: #EBEBEB;
        --color-white: #ffffff;
        --color-badge: #ffe66e;
        --color-border-warm: #ffb497;
        --radius-sm: 16px;
        --radius-md: 24px;
        --font-sans: "Noto Sans JP", sans-serif;
        --font-num: "Roboto", var(--font-sans);
        --space-page: 32px;
        --content-max: 1200px;
    }

    .skip-link {
        position: absolute;
        left: -9999px;
        top: 0;
        width: 1px;
        height: 1px;
        overflow: hidden;
        z-index: 10000;
    }

    .skip-link:focus {
        position: fixed;
        left: 16px;
        top: 16px;
        width: auto;
        height: auto;
        padding: 12px 16px;
        background: var(--color-green);
        color: var(--color-white);
        font-weight: 700;
        border-radius: 8px;
        overflow: visible;
    }

    body {
        color: var(--color-text);
        line-height: 1.5;
    }

    .site > main {
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
    }

    section.top-btns {
        padding: 53px 0 58px 0;
    }
    section.top-btns.top-btns2 {
        padding: 74px 0 74px 0;
    }

    .actions-btns {
        display: flex;
        justify-content: center;
        flex-wrap: nowrap;
        align-items: flex-start;
        gap: 45px;
    }

    .actions-btns > div {
        width: auto;
        flex: 0 0 auto;
        text-align: center;
    }

    .actions-btns > .left p,
    .actions-btns > .right p {
        margin: 0 0 10px;
        color: #262626;
        font-size: 18px;
        line-height: 1;
        font-weight: 700;
        letter-spacing: 10%;
    }

    .actions-btns > .left p::before, .actions-btns > .right p::before {
        content: "\\";
        display: inline-block;
        margin-right: 14px;
        line-height: 1;
        transform: rotate(-5deg);
    }

    .actions-btns > .left p::after, .actions-btns > .right p::after {
        content: "/";
        display: inline-block;
        margin-left: 14px;
        line-height: 1;
        transform: rotate(5deg);
    }

    .left-primary-body,
    .right-warning-body {
        width: 382px;
        height: 80px;
        font-size: 20px;
        font-weight: bold;
        line-height: 1;
        letter-spacing: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        white-space: nowrap;
        position: relative;
        padding: 0;
        border: none;
        border-radius: 0;
        background: none;
        margin-bottom: 0;
    }

    .left-primary-body *, .right-warning-body * {
        background-color: transparent;
    }

    .left-primary-body span, .right-warning-body span {
        padding-bottom: 2px;
    }

    .stat-card {
        flex: 1 1 240px;
        max-width: 320px;
        margin: 0;
        padding: 24px 20px;
        background: var(--color-white);
        border-radius: var(--radius-sm);
        border: 2px solid var(--color-border-warm);
        box-shadow: 0 2px 8px rgba(48, 48, 48, 0.06);
        text-align: center;
    }

    .stat-card__value {
        margin: 0 0 8px;
        font-family: var(--font-num);
        font-weight: 700;
        color: var(--color-orange);
        line-height: 1.2;
    }

    .stat-card__num {
        font-size: 40px;
        letter-spacing: 0.04em;
    }

    /* ----- Quiz ----- */
    .quiz {
        background: var(--color-yellow-deep);
        padding: 42px 0 55px 0;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .quiz__audience {
        margin: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
    }

    .quiz__audience-text {
        font-weight: 700;
        font-size: 24px;
        color: var(--color-orange);
        letter-spacing: 0.1em;
        paint-order: stroke fill;
        margin-bottom: 8px;
    }

    .quiz__audience-text::before {
        content: "\\";
        display: inline-block;
        margin-right: 15px;
        line-height: 1;
        transform: rotate(-10deg);
        -webkit-text-stroke: 1px #ff804f;
    }

    .quiz__audience-text::after {
        content: "/";
        display: inline-block;
        margin-left: 15px;
        line-height: 1;
        transform: rotate(10deg);
        -webkit-text-stroke: 1px #ff804f;
    }

    .quiz__card {
        width: 100%;
        max-width: 586px;
        background: var(--color-white);
        border-radius: 32px;
        overflow: hidden;
        box-sizing: border-box;
    }

    .quiz__card-head {
        background: var(--color-orange-dark);
        padding: 18px 16px;
        text-align: center;
    }

    .quiz__card-title {
        margin: 0;
        font-size: 24px;
        font-weight: 700;
        color: #fefffe;
        letter-spacing: 0.1em;
    }

    .quiz__body {
        padding: 37px 24px 29px 42px;
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .quiz__question {
        margin: 0;
        font-size: 26px;
        font-weight: 700;
        text-align: center;
        line-height: 30px;
        letter-spacing: 0.08em;
        margin-bottom: 8px;
    }

    .quiz__q-label {
        margin-right: 4px;
    }

    .quiz__hint {
        margin: 0;
        font-size: 16px;
        font-weight: 500;
        text-align: center;
        color: var(--color-text);
        margin-bottom: 30px;
    }

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

    .quiz__option {
        width: 100%;
        padding: 6px 0;
        border: none;
        border-radius: var(--radius-sm);
        background: #EBEBEB;
        font-family: inherit;
        font-size: 20px;
        font-weight: 700;
        color: var(--color-text);
        text-align: center;
        cursor: pointer;
        line-height: 48px;
        transition: background 0.15s ease, transform 0.1s ease;
    }

    .quiz__option:hover {
        background: #d9d9d9;
        color: #303030;
    }

    .quiz__option:active {
        transform: scale(0.99);
    }

    /* Disabled: inherit uses parent, not resting button styles; repeat base tokens for :hover/:focus/:active. */
    .quiz__option:disabled,
    .quiz__option:disabled:hover,
    .quiz__option:disabled:focus,
    .quiz__option:disabled:focus-visible,
    .quiz__option:disabled:active {
        background: var(--color-gray);
        color: var(--color-text);
        transform: none;
        cursor: not-allowed;
    }

    .quiz__progress {
        display: flex;
        justify-content: center;
        gap: 54px;
        margin-top: 38px;
    }

    .quiz__dot {
        width: 16px;
        height: 16px;
        border-radius: 55px;
        background: var(--color-gray);
        margin-bottom: 0;
    }

    .quiz__dot--navigable {
        cursor: pointer;
    }

    .quiz__dot--on {
        background: var(--color-yellow);
    }

    .quiz__next {
        align-self: center;
        min-width: 240px;
        padding: 14px 32px;
        border: none;
        border-radius: var(--radius-sm);
        background: var(--color-gray);
        font-family: inherit;
        font-size: 20px;
        font-weight: 700;
        cursor: pointer;
        margin-top: 33px;
    }

    .quiz__next--inactive:hover,
    .quiz__next--inactive:focus,
    .quiz__next--inactive:focus-visible,
    .quiz__next--inactive:active {
        background: var(--color-gray);
        color: #303030;
        transform: none;
        filter: none;
        min-width: 240px;
        padding: 14px 32px;
        border: none;
        border-radius: var(--radius-sm);
        background: var(--color-gray);
        font-family: inherit;
        font-size: 20px;
        font-weight: 700;
        margin-top: 33px;
        height: unset;
        line-height: unset;
    }

    .quiz__next:hover {
        background: #d9d9d9;
        color: #303030;
    }


    .quiz__next[aria-invalid="true"] {
        /*outline: 2px solid var(--color-orange);*/
        /*outline-offset: 2px;*/
    }

    .quiz__options[aria-invalid="true"] {
        /*border-radius: var(--radius-sm);*/
        /*outline: 2px dashed var(--color-orange);*/
        /*outline-offset: 4px;*/
    }

    .quiz__slides {
        position: relative;
    }

    .quiz__slide[hidden] {
        display: none !important;
    }

    .quiz__option--selected {
        background: #FE8238;
        color: #fff;
    }

    .quiz__option--selected:hover,
    .quiz__option--selected:focus {
        background: #FE8238;
        color: #fff;
    }

    .quiz--result {
        background: #FFF5C5;
        padding: 50px 0;
    }

    #diagnosis-quiz.quiz--result .quiz__audience {
        display: none;
    }

    /* ----- Diagnosis result ----- */
    .quiz-result-group[hidden] {
        display: none !important;
    }

    .quiz-result-group:not([hidden]) {
        width: 100%;
        max-width: 1000px;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 16px;
    }

    .quiz-result__eyebrow {
        margin: 0 0 1rem;
        font-size: 24px;
        font-weight: 700;
        color: var(--color-text);
        text-align: center;
        line-height: 48px;
        position: relative;
        z-index: 1;
    }

    article.quiz-result.result-card[hidden] {
        display: none !important;
    }

    article.quiz-result.result-card:not([hidden]) {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0;
    }

    .quiz-result__lead {
        text-align: center;
    }

    .quiz-result__accent {
        color: #e85a2a;
    }

    .result-card__summary {
        margin: 0.5em 0 0;
        font-size: 15px;
        font-weight: 500;
        line-height: 1.55;
        text-align: center;
        color: var(--color-text-muted);
    }

    .quiz-result__footer {
        margin-top: 4px;
    }

    .result-card__inner {
        width: 100%;
        box-sizing: border-box;
        padding: 64px 44px 40px;
        background: var(--color-white);
        border-radius: 20px;
        box-shadow: 0 8px 28px rgba(48, 48, 48, 0.08);
        position: relative;
        margin-top: 30px;
    }

    .result-card__pill {
        margin: 0 auto;
        position: absolute;
        top: -35px;
        margin-bottom: -18px;
        padding: 0 0;
        min-height: 70px;
        border-radius: 24px;
        background: #ffd54f;
        font-size: 40px;
        font-weight: 700;
        color: var(--color-text);
        text-align: center;
        line-height: 70px;
        width: max-content;
        left: 50%;
        transform: translate(-50%, 0);
        letter-spacing: 10%;
        min-width: 512px;
    }
    .result-card__pill span{
        font-size: 28px;
        margin-bottom: 0;
        letter-spacing: 16%;
        font-weight: 700
    }

    .result-card__lead {
        margin: 0;
        font-size: 25px;
        font-weight: 700;
        text-align: center;
        line-height: 36px;
        color: var(--color-text);
        letter-spacing: 8%;
    }

    .result-card__lead span {
        font-weight: inherit;
    }

    .result-card__accent {
        color: #FF6E35;
        font-weight: 700;
        font-size: 25px;
    }

    .result-card__row {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        align-items: flex-end;
        column-gap: 50px;
        margin-top: 16px;
    }

    .result-card__points {
        background: #fef7e0;
        border-radius: 16px;
        padding: 48px 20px 25px 21px;
        position: relative;
        min-width: 515px;
    }

    .result-card__points-cap {
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%, -50%);
        margin: 0;
        padding: 6px 20px;
        border-radius: 999px;
        background: #ffd54f;
        font-size: 28px;
        font-weight: 800;
        letter-spacing: 16%;
        color: var(--color-text);
        width: 141px;
        height: 44px;
        line-height: 32px;
        text-align: center;
        font-family: 'Roboto';
    }


    #diagnosis-result-one_off_combination .result-card__points {
        min-width: 430px;
        padding: 48px 15px 25px 40px;
    }
    #diagnosis-result-one_off_combination .result-card__row {
        margin-top: 20px;
    }
    #diagnosis-result-one_off_combination .result-card__inner {
        padding-right: 31px;
        padding-bottom: 39px;
        padding-left: 33px;
    }
    #diagnosis-result-one_off_repeat .result-card__pill{
        letter-spacing: 7%;
    }

    #diagnosis-result-one_off_repeat .result-card__row{
        margin-top: 13px;
    }
    #diagnosis-result-one_off_repeat .result-card__inner{
        padding-right: 39px;
        padding-bottom: 40px;
    }
    #diagnosis-result-one_off_short_no_overtime .result-card__pill {
        width: 640px;
    }
    #diagnosis-result-one_off_short_no_overtime .result-card__row {
        column-gap: 44px;
    }

    #diagnosis-result-one_off_short_no_overtime .result-card__pill span.another-letterspacing {
        letter-spacing: -5px;
        font-size: unset;
        margin-left: -8px;
    }
    #diagnosis-result-one_off_remote .result-card__pill{
        width: 566px;
        letter-spacing: 14%;
    }
    #diagnosis-result-one_off_remote .result-card__inner{
        padding-right: 28px;
        padding-bottom: 35px;
    }

    #diagnosis-result-one_off_urgent .result-card__pill{
        width: 555px;
        letter-spacing: 16%;
    }
    #diagnosis-result-one_off_urgent .result-card__inner{
        padding: 64px 35px 35px 44px;
    }

    #diagnosis-result-one_off_urgent .result-card__row{
        margin-top: 42px;
        column-gap: 55px;
    }

    #diagnosis-result-regular_short_term .result-card__row{
        column-gap: 53px;
    }

    #diagnosis-result-regular_short_term .result-card__pill{
        width: 566px;
        letter-spacing: 13%;
    }
    #diagnosis-result-regular_short_term .result-card__inner{
        padding-right: 18px;
        padding-bottom: 39px;
    }

    #diagnosis-result-regular_long_term .result-card__row{
        column-gap: 16px;
        margin-top: 43px;
    }

    #diagnosis-result-regular_long_term .result-card__pill{
        width: 566px;
        letter-spacing: 16%;
    }
    #diagnosis-result-regular_long_term .result-card__inner{
        padding-right: 16px;
        padding-bottom: 35px;
    }
    #diagnosis-result-regular_long_term .result-card__points{
        padding-left: 17px;
    }


    #diagnosis-result-regular_short_no_overtime .result-card__row{
        column-gap: 53px;
        margin-top: 13px;
    }

    #diagnosis-result-regular_short_no_overtime .result-card__pill{
        width: 734px;
        letter-spacing: 10%;
    }
    #diagnosis-result-regular_short_no_overtime .result-card__inner{
        padding-right: 19px;
        padding-bottom: 35px;
    }
    #diagnosis-result-regular_short_no_overtime .result-card__points{
        padding-left: 17px;
        padding-right: 7px;
    }
    #diagnosis-result-regular_short_no_overtime .result-card__pill span.another-letterspacing {
        letter-spacing: -5px;
        font-size: unset;
        margin-left: -8px;
    }
    #diagnosis-result-regular_short_no_overtime .result-card__points-item {
        letter-spacing: 4%;
    }



    #diagnosis-result-regular_remote .result-card__row{
        column-gap: 53px;
        margin-top: -10px;
    }

    #diagnosis-result-regular_remote .result-card__pill{
        width: 596px;
        letter-spacing: 13%;
    }
    #diagnosis-result-regular_remote .result-card__inner{
        padding-right: 30px;
        padding-bottom: 39px;
    }
    #diagnosis-result-regular_remote .result-card__points{
        padding-left: 17px;
        padding-right: 7px;
    }
    #diagnosis-result-regular_remote .result-card__points-item {
        letter-spacing: 4%;
    }


    .result-card__points-list {
        margin: 0;
        padding: 0;
        list-style: none;
        display: flex;
        flex-direction: column;
        gap: 13px;
    }

    .result-card__points-item {
        display: flex;
        align-items: center;
        gap: 8.5px;
        font-size: 22px;
        font-weight: 700;
        line-height: 1;
        color: var(--color-text);
        font-family: 'Noto Sans JP';
    }
    .result-card__points-item img {
        width: 20px;
        height: 20px;
    }


    .result-card__persona {
        display: flex;
        flex-direction: column;
        gap: 12px;
        width: 100%;
        min-width: 0;
    }

    .result-card__speech {
        margin: 0;
        padding: 12px 14px;
        background: #fff9c4;
        border-radius: 14px;
        font-size: 15px;
        font-weight: 600;
        line-height: 1.5;
        color: var(--color-text);
        position: relative;
    }

    .result-card__figure {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-end;
        gap: 12px;
    }

    .result-card__illu {
        width: 100%;
        height: auto;
        flex-shrink: 0;
    }

    .result-card__bio {
        flex: 1 1 160px;
        min-width: 0;
        border-radius: 12px;
        overflow: hidden;
        border: 1px solid rgba(48, 48, 48, 0.08);
    }

    .result-card__bio-cap {
        margin: 0;
        padding: 8px 12px;
        background: #ffd54f;
        font-size: 13px;
        font-weight: 800;
        color: var(--color-text);
    }

    .result-card__bio-text {
        margin: 0;
        padding: 10px 12px;
        background: #fef7e0;
        font-size: 13px;
        font-weight: 600;
        line-height: 1.45;
        color: var(--color-text);
    }

    .result-card__cta-line {
        margin: 0;
        font-size: 20px;
        font-weight: 700;
        text-align: center;
        color: var(--color-text);
        line-height: 32px;
        margin-top: 36px;
        margin-bottom: 9px;
        letter-spacing: 8%;
    }

    .result-card__cta-slash {
        color: var(--color-text-muted);
        font-weight: 600;
    }

    .result-card__cta-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: unset;
        padding: 16px 14px;
        border-radius: 16px;
        background: #21C65B;
        color: #fff;
        font-size: 24px;
        font-weight: 700;
        text-decoration: none;
        text-align: center;
        line-height: 1;
        box-shadow: 0 4px 14px rgba(40, 199, 111, 0.35);
        transition: filter 0.15s ease, transform 0.1s ease;
        height: 80px;
        letter-spacing: 6%;
        margin-bottom: 0;
    }

    .result-card__cta-btn:hover {
        filter: brightness(1.05);
        color: #fff;
        text-decoration: none;
    }

    .result-card__cta-btn:active {
        transform: scale(0.99);
    }

    /* ----- Merits ----- */
    .merits {
        background: var(--color-yellow-soft);
        padding: 47px 10px 57px 10px;
    }
    .merits__title {
        margin: 0 auto 52px;
        max-width: 320px;
        text-align: center;
        font-size: 26px;
        font-weight: 700;
        line-height: 30px;
        color: var(--color-text);
        letter-spacing: 8%;
    }
    .merits__list {
        list-style: none;
        margin: 0 auto;
        padding: 0;
        display: flex;
        flex-wrap: nowrap;
        justify-content: center;
        gap: 40px;
        max-width: 1040px;
    }

    .merit-card {
        flex: 1 1 280px;
        max-width: 320px;
        margin: 0;
        padding: 38px 0 0 0;
        background: var(--color-white);
        border-radius: var(--radius-sm);
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 3px;
        box-shadow: 0 2px 12px rgba(48, 48, 48, 0.06);
    }

    .merit-card__badge {
        margin-top: -64px;
        margin-bottom: 8px;
        padding: 9px 19px;
        background: var(--color-badge);
        border-radius: 23px;
        font-family: 'Roboto';
        font-weight: 700;
        font-size: 28px;
        letter-spacing: 8%;
        color: var(--color-text);
    }

    .merit-card__text {
        margin: 0;
        font-size: 22px;
        font-weight: 700;
        line-height: 1.45;
    }

    .merit-card__img {
        width: 90%;
        height: auto;
        margin-top: auto;
    }

    /* 765px–1200px: three equal columns, tighter gap (flex + flex-basis was uneven) */
    @media (max-width: 890px) {
        .merit-card__text {
            font-size: 18px;
        }

        .merit-card__img {
            width: 70%;
            height: auto;
            margin-top: auto;
        }
    }
    .merit-card__img.point-1{
        max-width: 219px;
        margin-bottom: -2px;
    }

    .merit-card__img.point-2{
        max-width: 285px;
        margin-bottom: 11px;
    }

    .merit-card__img.point-3{
        max-width: 193px;
    }

    /* ----- Voices ----- */
    .voices {
        background: var(--color-gray);
        padding: 43px 10px 45px 10px;
    }

    .voices__title {
        margin: 0 auto 42px;
        text-align: center;
        font-size: 28px;
        font-weight: 700;
        letter-spacing: 8%;
        line-height: 30px;
    }

    .voices__grid {
        max-width: 1040px;
        margin: 0 auto;
        display: flex;
        flex-wrap: nowrap;
        justify-content: space-between;
        gap: 10px;
        align-items: stretch;
    }

    .voice-card {
        margin: 0;
        padding: 0;
        flex: 1 1 0;
        min-width: unset;
        max-width: 320px;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        align-self: stretch;
        min-height: 0;
    }

    .voice-card__avatar {
        width: 102px;
        height: 102px;
        border-radius: 50%;
        overflow: hidden;
        margin-bottom: -60px;
        z-index: 1;
        flex-shrink: 0;
    }
    @media (max-width: 890px) {
        .voice-card__quote p {
            margin: 0;
            font-size: 17px;
            font-weight: 700;
            line-height: 26px;
            letter-spacing: 2%;
        }
        .voice-card__quote p.voice-card__meta {
            font-size: 16px;
        }
    }
    .voice-card__avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .voice-card__quote {
        margin: 0;
        width: 100%;
        max-width: 320px;
        padding: 67px 20px 16px;
        background: var(--color-white);
        border-radius: var(--radius-sm);
        box-shadow: 0 2px 8px rgba(48, 48, 48, 0.06);
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
        min-height: 0;
    }

    .voice-card__quote > p:not(.voice-card__meta) {
        flex: 1 1 auto;
    }

    .voice-card__quote p {
        margin: 0;
        font-size: 20px;
        font-weight: 700;
        line-height: 26px;
        letter-spacing: 4%;
    }

    .voice-card__quote p.voice-card__meta {
        font-size: 20px;
        font-weight: 500;
        line-height: 1;
        letter-spacing: 0;
        margin-bottom: 15px;
        text-align: center;
        font-family: Hiragino, sans-serif;
    }

    /* ----- CTA pair ----- */
    .cta-pair {
        display: grid;
        grid-template-columns: 1fr;
        gap: 48px;
        padding: 40px 0;
    }

    @media (min-width: 900px) {
        .cta-pair {
            grid-template-columns: 1fr 1fr;
            align-items: start;
        }
    }

    .cta-pair__col {
        display: flex;
        flex-direction: column;
        gap: 20px;
        align-items: center;
    }

    .cta-block {
        width: 100%;
        max-width: 382px;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
    }

    .cta-block__line {
        margin: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        font-size: 18px;
        font-weight: 700;
        letter-spacing: 0.1em;
        color: var(--color-text);
    }

    .btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        max-width: 382px;
        min-height: 80px;
        padding: 12px 24px;
        border-radius: var(--radius-sm);
        font-family: inherit;
        font-size: 24px;
        font-weight: 700;
        text-align: center;
        letter-spacing: 0.08em;
        cursor: pointer;
        border: none;
        box-sizing: border-box;
        transition: filter 0.15s ease, transform 0.1s ease;
    }

    a.btn {
        text-decoration: none;
    }

    .btn:focus-visible {
        outline: 3px solid #4a90e2;
        outline-offset: 2px;
    }

    .btn--line {
        background: var(--color-green);
        color: var(--color-white);
        background: var(--color-green);
        color: var(--color-white);
        border-radius: 16px;
        font-size: 24px;
        font-weight: 700;
        line-height: 30px;
        letter-spacing: 6%;
    }

    .btn--line:hover {
        filter: brightness(1.05);
        color: #fff;
    }

    .btn--diagnosis {
        display: inline-flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        color: var(--color-white);
        gap: 20px;
        padding-inline: 28px 20px;
        background-size: 100% 100%;
        background-repeat: no-repeat;
        background-position: center;
    }

    .btn--diagnosis-a {
    }

    .btn--diagnosis-b {
    }

    .btn--diagnosis::after {
        content: "";
        width: 48px;
        height: 48px;
        flex-shrink: 0;
        background-color: var(--color-white);
        background-size: 19px 21px;
        background-position: center;
        background-repeat: no-repeat;
        border-radius: 50%;
    }

    .btn--diagnosis-b::after {
    }

    .btn--faq {
        margin-top: 26px;
        margin-bottom: 0;
        line-height: 56px;
    }

    /* ----- FAQ ----- */
    .faq {
        background: var(--color-gray);
        padding: 64px 0 57px 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0px;
    }

    .faq__heading {
        margin: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0;
        text-align: center;
    }

    .faq__heading-en {
        font-family: var(--font-num);
        font-weight: 800;
        font-size: 36px;
        color: #fdc713;
        letter-spacing: 8%;
        margin-bottom: 8px;
        line-height: 30px;
        -webkit-text-stroke: 0.4px;
    }

    .faq__heading-ja {
        font-size: 28px;
        font-weight: 700;
        color: var(--color-text);
        margin-bottom: 51px;
    }

    .faq-item {
        width: min(902px, 100%);
        border-radius: var(--radius-sm);
        overflow: hidden;
        background: var(--color-white);
        margin-bottom: 30px;
    }

    .faq-item__q {
        list-style: none;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 26px;
        padding: 16px 34px 16px 20px;
        background: var(--color-yellow);
        font-weight: 700;
        font-size: 22px;
        line-height: 1.45;
    }
    .faq-item__q span.question-text{
        margin-bottom: 0;
        font-size: 22px;
        line-height: 30px;
        font-weight: 700;
    }

    .faq-item__q:focus-visible {
        outline: 3px solid #4a90e2;
        outline-offset: 2px;
    }

    .faq-item__q::-webkit-details-marker {
        display: none;
    }

    .faq-item__q::after {
        content: "";
        margin-left: auto;
        flex-shrink: 0;
        margin-top: 4px;
        width: 30px;
        height: 30px;
        border: none;
        background: url("/user_data/packages/2023_design/assets/img/diagnosis/plus_black.png") no-repeat center / contain;
        transition: background-image 0.2s ease;
    }

    .faq-item[open] .faq-item__q::after {
        background-image: url("/user_data/packages/2023_design/assets/img/diagnosis/minus_black.png");
        margin-top: 4px;
        width: 30px;
        height: 5px;
    }

    .faq-item__q-mark {
        flex-shrink: 0;
        width: 48px;
        height: 48px;
        border-radius: 50%;
        background: var(--color-white);
        color: var(--color-text-muted);
        font-size: 34px;
        font-weight: 700;
        display: grid;
        place-items: center;
        line-height: 1;
        margin-bottom: 0;
        font-family: 'Hiragino';
    }

    .faq-item__a {
        display: flex;
        gap: 16px;
        padding: 30px 20px;
        align-items: center;
    }

    .faq-item__a-mark {
        flex-shrink: 0;
        width: 48px;
        height: 48px;
        border-radius: 50%;
        background: var(--color-yellow);
        color: var(--color-white);
        font-size: 34px;
        font-weight: 700;
        display: grid;
        place-items: center;
        line-height: 1;
        margin-bottom: 0;
        font-family: 'Hiragino';
    }

    .faq-item__a p {
        margin: 0;
        flex: 1;
        font-size: 22px;
        font-weight: 500;
        line-height: 1.55;
    }

    /* ----- Footer ----- */
    .site-footer {
        margin-top: auto;
        margin-inline: calc(-1 * var(--space-page));
        padding-bottom: 0;
    }

    .site-footer__img {
        display: block;
        width: 100%;
        max-width: var(--content-max);
        margin: 0 auto;
        height: auto;
    }
    footer {
        padding: 65px 0 0;
    }
    footer .footer-bg-bottom {
        border-bottom: 20px solid #ffdc3c;
    }

    @media (max-width: 1050px) {
        .result-card__row {
            grid-template-columns: minmax(0, 60fr) minmax(0, 40fr) !important;
            column-gap: 3% !important;
        }

        .result-card__points {
            min-width: 0 !important;
            max-width: none !important;
            width: 100%;
            box-sizing: border-box;
        }

        .result-card__persona {
            min-width: 0 !important;
            width: 100%;
            max-width: none;
            box-sizing: border-box;
        }
    }
    @media (max-width: 900px) {
        .result-card__row {
            grid-template-columns: minmax(0, 50fr) minmax(0, 50fr) !important;
            column-gap: 3% !important;
        }

        .result-card__points {
            min-width: 0 !important;
            max-width: none !important;
            width: 100%;
            box-sizing: border-box;
            padding: 35px 15px 20px 20px !important;
        }

        .result-card__persona {
            min-width: 0 !important;
            width: 100%;
            max-width: none;
            box-sizing: border-box;
        }
        .result-card__points-item {
            display: flex;
            align-items: center;
            gap: 8.5px;
            font-size: 20px;
            font-weight: 700;
            line-height: 1;
            color: var(--color-text);
        }
    }
    @media (max-width: 820px) {
        .result-card__row {
            grid-template-columns: minmax(0, 45fr) minmax(0, 65fr) !important;
            column-gap: 3% !important;
        }
        .result-card__points-item {
            display: flex;
            align-items: center;
            gap: 8.5px;
            font-size: 18px;
            font-weight: 700;
            line-height: 1;
            color: var(--color-text);
        }

        .result-card__points {
            min-width: 0 !important;
            max-width: none !important;
            width: 100%;
            box-sizing: border-box;
            padding: 35px 15px 20px 20px !important;
        }

        .result-card__persona {
            min-width: 0 !important;
            width: 100%;
            max-width: none;
            box-sizing: border-box;
        }
    }
    .sha-container h2.quiz__card-title {
        margin: 0;
        font-weight: 700;
        color: #fefffe;
        letter-spacing: 0.1em;
        border-bottom-width: 0 !important;
        font-size: 24px !important;
    }
    .pc-inline {
        display: inline !important;
    }
}

.loading-modal {
    display: none;
}

.loading-modal .modal-dialog {
    height: 400px;
    background: #fff;
    top: 20%;
}

.loading-modal .modal-dialog .modal-content {
    width: 100%;
    height: 100%;
}

.loading-modal .middle {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
}

.loading-modal .bar {
    width: 10px;
    height: 70px;
    background: #fff;
    display: inline-block;
    transform-origin: bottom center;
    border-top-right-radius: 20px;
    border-top-left-radius: 20px;
    animation: diagnosis-loader 1.2s linear infinite;
}

.loading-modal .bar1 {
    animation-delay: 0.1s;
}

.loading-modal .bar2 {
    animation-delay: 0.2s;
}

.loading-modal .bar3 {
    animation-delay: 0.3s;
}

.loading-modal .bar4 {
    animation-delay: 0.4s;
}

.loading-modal .bar5 {
    animation-delay: 0.5s;
}

.loading-modal .bar6 {
    animation-delay: 0.6s;
}

.loading-modal .bar7 {
    animation-delay: 0.7s;
}

.loading-modal .bar8 {
    animation-delay: 0.8s;
}

@keyframes diagnosis-loader {
    0% {
        transform: scaleY(0.1);
        background: none;
    }

    50% {
        transform: scaleY(1);
        background: yellowgreen;
    }

    100% {
        transform: scaleY(0.1);
        background: transparent;
    }
}