/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties {
    @supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))) {

        *,
        :before,
        :after,
        ::backdrop {
            --tw-translate-x: 0;
            --tw-translate-y: 0;
            --tw-translate-z: 0;
            --tw-rotate-x: initial;
            --tw-rotate-y: initial;
            --tw-rotate-z: initial;
            --tw-skew-x: initial;
            --tw-skew-y: initial;
            --tw-border-style: solid;
            --tw-leading: initial;
            --tw-font-weight: initial;
            --tw-tracking: initial;
            --tw-outline-style: solid
        }
    }
}

@layer preflight {

    *,
    :after,
    :before,
    ::backdrop {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }

    ::file-selector-button {
        box-sizing: border-box;
        border: 0 solid;
        margin: 0;
        padding: 0
    }

    html,
    :host {
        -webkit-text-size-adjust: 100%;
        tab-size: 4;
        line-height: 1.5;
        font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
        font-feature-settings: var(--default-font-feature-settings, normal);
        font-variation-settings: var(--default-font-variation-settings, normal);
        -webkit-tap-highlight-color: transparent
    }

    hr {
        height: 0;
        color: inherit;
        border-top-width: 1px
    }

    abbr:where([title]) {
        text-decoration: underline dotted
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-size: inherit;
        font-weight: inherit
    }

    a {
        color: inherit;
        -webkit-text-decoration: inherit;
        -webkit-text-decoration: inherit;
        -webkit-text-decoration: inherit;
        text-decoration: inherit
    }

    b,
    strong {
        font-weight: bolder
    }

    code,
    kbd,
    samp,
    pre {
        font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
        font-feature-settings: var(--default-mono-font-feature-settings, normal);
        font-variation-settings: var(--default-mono-font-variation-settings, normal);
        font-size: 1em
    }

    small {
        font-size: 80%
    }

    sub,
    sup {
        vertical-align: baseline;
        font-size: 75%;
        line-height: 0;
        position: relative
    }

    sub {
        bottom: -.25em
    }

    sup {
        top: -.5em
    }

    table {
        text-indent: 0;
        border-color: inherit;
        border-collapse: collapse
    }

    :-moz-focusring:where(:not(iframe)) {
        outline: auto
    }

    progress {
        vertical-align: baseline
    }

    summary {
        display: list-item
    }

    ol,
    ul,
    menu {
        list-style: none
    }

    img,
    svg,
    video,
    canvas,
    audio,
    iframe,
    embed,
    object {
        vertical-align: middle;
        display: block
    }

    img,
    video {
        max-width: 100%;
        height: auto
    }

    button,
    input,
    select,
    optgroup,
    textarea {
        font: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        letter-spacing: inherit;
        color: inherit;
        opacity: 1;
        background-color: #0000;
        border-radius: 0
    }

    ::file-selector-button {
        font: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        letter-spacing: inherit;
        color: inherit;
        opacity: 1;
        background-color: #0000;
        border-radius: 0
    }

    :where(select:is([multiple], [size])) optgroup {
        font-weight: bolder
    }

    :where(select:is([multiple], [size])) optgroup option {
        padding-inline-start: 20px
    }

    ::file-selector-button {
        margin-inline-end: 4px
    }

    ::placeholder {
        opacity: 1
    }

    @supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) {
        ::placeholder {
            color: currentColor
        }

        @supports (color:color-mix(in lab, red, red)) {
            ::placeholder {
                color: color-mix(in oklab, currentcolor 50%, transparent)
            }
        }
    }

    textarea {
        resize: vertical
    }

    ::-webkit-search-decoration {
        -webkit-appearance: none
    }

    ::-webkit-date-and-time-value {
        min-height: 1lh;
        text-align: inherit
    }

    ::-webkit-datetime-edit {
        display: inline-flex
    }

    ::-webkit-datetime-edit-fields-wrapper {
        padding: 0
    }

    ::-webkit-datetime-edit {
        padding-block: 0
    }

    ::-webkit-datetime-edit-year-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-month-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-day-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-hour-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-minute-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-second-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-millisecond-field {
        padding-block: 0
    }

    ::-webkit-datetime-edit-meridiem-field {
        padding-block: 0
    }

    ::-webkit-calendar-picker-indicator {
        line-height: 1
    }

    :-moz-ui-invalid {
        box-shadow: none
    }

    button,
    input:where([type=button], [type=reset], [type=submit]) {
        appearance: button
    }

    ::file-selector-button {
        appearance: button
    }

    ::-webkit-inner-spin-button {
        height: auto
    }

    ::-webkit-outer-spin-button {
        height: auto
    }

    [hidden]:where(:not([hidden=until-found])) {
        display: none !important
    }
}

@layer theme;

@layer base {
    :root {
        --breakpoint-xs: 480px;
        --breakpoint-sm: 640px;
        --breakpoint-md: 768px;
        --breakpoint-ml: 860px;
        --breakpoint-lg: 1024px;
        --breakpoint-xml: 1100px;
        --breakpoint-xl: 1280px;
        --breakpoint-2xl: 1330px;
        --inner-slim: 800px;
        --inner-base: 1000px;
        --inner-wide: 1200px;
        --vw: 100vw;
        --font-size-body: 1.6rem;
        --line-height-body: 2;
        --tracking-default: 0em;
        --gutter: var(--spacing-gutter)
    }

    html {
        font-size: calc(.166667em * 1vw / 1px)
    }

    @media (width>=768px) {
        html {
            font-size: .625em
        }
    }

    body {
        font-size: var(--font-size-body);
        line-height: var(--line-height-body);
        color: var(--color-body)
    }

    body:has(.l-wrapper.is-modal-open) {
        overflow: hidden
    }

    @media (width>=768px) {
        body {
            min-width: 1180px
        }
    }

    :where(*) {
        letter-spacing: var(--tracking-default);
        outline-color: var(--color-primary);
        border-style: solid;
        border-width: 0
    }

    input,
    select,
    option,
    textarea,
    button {
        box-sizing: border-box;
        font-size: var(--font-size-body);
        line-height: var(--line-height-body);
        color: var(--color-body);
        letter-spacing: var(--tracking-default)
    }

    img {
        vertical-align: bottom;
        max-width: 100%;
        height: auto;
        image-rendering: smooth;
        display: inline-block
    }

    svg {
        width: 100%
    }

    :where(button, [type=button], [type=reset], [type=submit]) {
        touch-action: manipulation;
        background: 0 0;
        border: none;
        padding: 0
    }

    :any-link,
    button,
    [type=button],
    [type=reset],
    [type=submit],
    label[for],
    select,
    summary,
    [role=tab],
    [role=button] {
        cursor: pointer
    }

    :focus:not(:focus-visible) {
        outline: none
    }

    i:has(>svg) {
        line-height: 0
    }

    a:not([class]) {
        color: inherit
    }

    [class*=hover\:] {
        transition-duration: .3s
    }
}

@layer layout {
    .l-wrapper {
        overflow: clip
    }

    @media (width>=768px) {
        .l-header {
            width: 100%;
            min-width: 118rem;
            max-width: 139.4rem;
            translate: calc(-1 * var(--scroll-x)) 0;
            justify-content: center;
            top: 2.2rem;
            left: 0
        }

        .l-header__logo {
            z-index: 2;
            flex: 0 0 30rem;
            width: 30rem;
            position: relative
        }

        .l-header__button {
            display: none
        }

        .l-header__menu {
            flex: 0 auto;
            display: block
        }
    }

    @media (width>=768px) and (width<1280px) {
        .l-header {
            flex-wrap: wrap
        }

        .l-header__menu {
            background-color: #fff;
            border-radius: 100vmax;
            min-height: 6.45rem;
            margin-top: -2rem;
            padding: 2rem
        }
    }

    @media (width>=1180px) {
        .l-header {
            left: 50%;
            translate: -50%
        }
    }

    @media (width>=1280px) {
        .l-header {
            justify-content: flex-end;
            height: 6.45rem;
            padding-right: 4.4rem
        }

        .l-header:after {
            z-index: 0;
            content: "";
            background-color: #fff;
            border-radius: 100vmax;
            position: absolute;
            inset: 0 0 0 5rem
        }

        .l-header__logo {
            flex: 0 0 30rem;
            width: 30rem;
            padding: 0;
            position: absolute;
            top: -.1rem;
            left: 0
        }
    }

    @media (width>=1390px) {
        .l-header__logo {
            flex: 0 0 40.1rem;
            width: 40.1rem;
            top: -1.2rem
        }
    }

    @media (width<768px) {
        .l-header {
            height: 4rem;
            position: absolute;
            inset: 5.6rem 1rem auto
        }

        .l-header.is-fixed {
            position: fixed;
            top: 1.5rem
        }

        .l-header:after {
            z-index: 0;
            content: "";
            background-color: #fff;
            border-radius: 100vmax;
            position: absolute;
            inset: 0 0 0 5rem
        }

        .l-header__logo {
            top: -.7rem;
            left: -.2rem
        }

        .l-header__button {
            flex: 0 0 2.6rem;
            align-self: center;
            margin-right: 1.5rem
        }
    }

    @media screen and (width<=767.98px) {
        footer {
            font-size: 14px
        }

        footer .inner {
            min-width: 100%;
            max-width: 100%
        }

        .ftCont {
            display: block
        }

        .ft_menu_wrap {
            display: none
        }

        .ft_info {
            width: 100%
        }

        .ft_logo {
            text-align: center
        }

        .ft_logo img {
            margin: 0 auto;
            display: block
        }

        .ft_info h3 {
            text-align: center
        }

        .ft_info span {
            text-align: center;
            margin-top: 10px;
            display: block
        }

        .ft_ad {
            text-align: center
        }

        .ft_ad p {
            text-align: left;
            display: inline-block
        }

        ul.ft_sns {
            justify-content: center
        }

        .ftLinks {
            flex-direction: column;
            margin-top: 35px
        }

        .ftLinks a {
            text-align: center;
            margin-bottom: 10px
        }

        ul.ft_sns li {
            margin-right: 20px
        }
    }

    .l-header {
        z-index: 100;
        justify-content: flex-end;
        height: 4rem;
        display: flex;
        position: fixed
    }

    .l-header__logo {
        z-index: 1;
        flex: 0 0 25.2rem;
        width: 25.2rem;
        line-height: 0;
        position: absolute
    }

    .l-header__menu {
        z-index: 1;
        display: none;
        position: relative
    }

    .l-header__button {
        z-index: 1;
        position: relative
    }

    @media (width>=768px) {
        .l-header {
            width: 100%;
            min-width: 118rem;
            max-width: 139.4rem;
            translate: calc(-1 * var(--scroll-x)) 0;
            justify-content: center;
            top: 2.2rem;
            left: 0
        }

        .l-header__logo {
            z-index: 2;
            flex: 0 0 30rem;
            width: 30rem;
            position: relative
        }

        .l-header__button {
            display: none
        }

        .l-header__menu {
            flex: 0 auto;
            display: block
        }
    }

    @media (width>=768px) and (width<1280px) {
        .l-header {
            flex-wrap: wrap
        }

        .l-header__menu {
            background-color: #fff;
            border-radius: 100vmax;
            min-height: 6.45rem;
            margin-top: -2rem;
            padding: 2rem
        }
    }

    @media (width>=1180px) {
        .l-header {
            left: 50%;
            translate: -50%
        }
    }

    @media (width>=1280px) {
        .l-header {
            justify-content: flex-end;
            height: 6.45rem;
            padding-right: 4.4rem
        }

        .l-header:after {
            z-index: 0;
            content: "";
            background-color: #fff;
            border-radius: 100vmax;
            position: absolute;
            inset: 0 0 0 5rem
        }

        .l-header__logo {
            flex: 0 0 30rem;
            width: 30rem;
            padding: 0;
            position: absolute;
            top: -.1rem;
            left: 0
        }
    }

    @media (width>=1390px) {
        .l-header__logo {
            flex: 0 0 40.1rem;
            width: 40.1rem;
            top: -1.2rem
        }
    }

    @media (width<768px) {
        .l-header {
            height: 4rem;
            position: absolute;
            inset: 5.6rem 1rem auto
        }

        .l-header.is-fixed {
            position: fixed;
            top: 1.5rem
        }

        .l-header:after {
            z-index: 0;
            content: "";
            background-color: #fff;
            border-radius: 100vmax;
            position: absolute;
            inset: 0 0 0 5rem
        }

        .l-header__logo {
            top: -.7rem;
            left: -.2rem
        }

        .l-header__button {
            flex: 0 0 2.6rem;
            align-self: center;
            margin-right: 1.5rem
        }
    }

    .l-nav {
        background-color: #fff;
        border-radius: 0 0 2rem 2rem;
        padding: 4rem 0 1rem;
        position: absolute;
        inset: 2rem 0 auto
    }

    @media (width>=768px) {
        .l-nav {
            display: none
        }
    }

    footer {
        background: #1c2445;
        width: 100%;
        line-height: 1.6
    }

    footer * {
        font-family: var(--font-sans)
    }

    footer .mt30 {
        margin-top: 30px !important
    }

    footer img {
        vertical-align: baseline;
        display: inline-block
    }

    footer .inner {
        min-width: 1080px;
        max-width: 1224px;
        margin: 0 auto;
        padding: 50px 0 25px
    }

    .ftCont {
        justify-content: space-between;
        display: flex
    }

    .ft_info {
        width: 220px
    }

    .ft_menu_wrap {
        width: calc(100% - 240px)
    }

    .ft_menu_wrap>div {
        width: 25%;
        max-width: 25%
    }

    .ft_logo img {
        width: 113px;
        height: 86px
    }

    .ft_info h3 {
        color: #fff;
        margin-top: 20px;
        margin-bottom: 5px;
        padding-left: 0;
        font-size: 125%;
        font-weight: 600
    }

    .ft_info h3:before,
    .ft_info h3:after {
        content: none
    }

    .ft_info span {
        color: #fff;
        margin-top: -5px;
        font-size: 87.5%;
        display: block
    }

    .ft_ad {
        margin: 25px 0
    }

    .ft_ad p {
        color: #fff;
        padding: 2px 0;
        font-size: 100%
    }

    ul.ft_sns {
        display: flex
    }

    ul.ft_sns li {
        margin-right: 15px
    }

    ul.ft_sns li:last-child {
        margin-right: 0
    }

    ul.ft_sns li a img {
        width: 40px;
        height: 40px
    }

    .ft_menu_wrap {
        display: flex
    }

    .ft_menu_wrap>div {
        padding: 0 12px
    }

    .ft_menu_wrap>div>p {
        color: #fff;
        margin-bottom: 10px;
        font-size: 100%;
        font-weight: 500
    }

    .ft_menu_wrap>div>a {
        color: #fff;
        margin-bottom: 10px;
        font-size: 100%;
        font-weight: 500;
        display: block
    }

    ul.ft_menu li a {
        color: #fff;
        margin-bottom: 8px;
        padding-left: 16px;
        font-size: 81.25%;
        display: block;
        position: relative
    }

    ul.ft_menu li a:before {
        content: "";
        background: #fff;
        width: 8px;
        height: 1px;
        display: block;
        position: absolute;
        top: 9px;
        left: 0
    }

    .ftLinks {
        justify-content: center;
        margin-top: 80px;
        margin-bottom: 20px;
        display: flex
    }

    .ftLinks a {
        color: #fff;
        padding: 0 17px;
        font-size: 100%
    }

    .ftCopy {
        color: #fff6;
        text-align: center;
        font-size: 75%;
        line-height: normal
    }

    @media screen and (width<=767.98px) {
        footer {
            font-size: 14px
        }

        footer .inner {
            min-width: 100%;
            max-width: 100%
        }

        .ftCont {
            display: block
        }

        .ft_menu_wrap {
            display: none
        }

        .ft_info {
            width: 100%
        }

        .ft_logo {
            text-align: center
        }

        .ft_logo img {
            margin: 0 auto;
            display: block
        }

        .ft_info h3 {
            text-align: center
        }

        .ft_info span {
            text-align: center;
            margin-top: 10px;
            display: block
        }

        .ft_ad {
            text-align: center
        }

        .ft_ad p {
            text-align: left;
            display: inline-block
        }

        ul.ft_sns {
            justify-content: center
        }

        .ftLinks {
            flex-direction: column;
            margin-top: 35px
        }

        .ftLinks a {
            text-align: center;
            margin-bottom: 10px
        }

        ul.ft_sns li {
            margin-right: 20px
        }
    }
}

@layer jslibrary {
    [data-simplebar] {
        flex-flow: column wrap;
        place-content: flex-start;
        align-items: flex-start;
        position: relative
    }

    .simplebar-wrapper {
        width: inherit;
        height: inherit;
        max-width: inherit;
        max-height: inherit;
        overflow: hidden
    }

    .simplebar-mask {
        direction: inherit;
        z-index: 0;
        margin: 0;
        padding: 0;
        position: absolute;
        inset: 0;
        overflow: hidden;
        width: auto !important;
        height: auto !important
    }

    .simplebar-offset {
        -webkit-overflow-scrolling: touch;
        margin: 0;
        padding: 0;
        position: absolute;
        inset: 0;
        direction: inherit !important;
        box-sizing: inherit !important;
        resize: none !important
    }

    .simplebar-content-wrapper {
        direction: inherit;
        scrollbar-width: none;
        -ms-overflow-style: none;
        width: auto;
        max-width: 100%;
        height: 100%;
        max-height: 100%;
        display: block;
        position: relative;
        overflow: auto;
        box-sizing: border-box !important
    }

    .simplebar-content-wrapper::-webkit-scrollbar {
        width: 0;
        height: 0;
        display: none
    }

    .simplebar-hide-scrollbar::-webkit-scrollbar {
        width: 0;
        height: 0;
        display: none
    }

    .simplebar-content:after,
    .simplebar-content:before {
        content: " ";
        display: table
    }

    .simplebar-placeholder {
        pointer-events: none;
        width: 100%;
        max-width: 100%;
        max-height: 100%
    }

    .simplebar-height-auto-observer-wrapper {
        float: left;
        z-index: -1;
        pointer-events: none;
        flex-grow: inherit;
        flex-shrink: 0;
        flex-basis: 0;
        width: 100%;
        max-width: 1px;
        height: 100%;
        max-height: 1px;
        margin: 0;
        padding: 0;
        position: relative;
        overflow: hidden;
        box-sizing: inherit !important
    }

    .simplebar-height-auto-observer {
        box-sizing: inherit;
        opacity: 0;
        pointer-events: none;
        z-index: -1;
        width: 1000%;
        min-width: 1px;
        height: 1000%;
        min-height: 1px;
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        overflow: hidden
    }

    .simplebar-track {
        z-index: 1;
        pointer-events: none;
        position: absolute;
        bottom: 0;
        right: 0;
        overflow: hidden
    }

    [data-simplebar].simplebar-dragging,
    [data-simplebar].simplebar-dragging .simplebar-content {
        pointer-events: none;
        -webkit-touch-callout: none;
        user-select: none;
        -khtml-user-select: none
    }

    [data-simplebar].simplebar-dragging .simplebar-track {
        pointer-events: all
    }

    .simplebar-scrollbar {
        min-height: 10px;
        position: absolute;
        left: 0;
        right: 0
    }

    .simplebar-scrollbar:before {
        content: "";
        opacity: 0;
        background: #000;
        border-radius: 7px;
        transition: opacity .2s linear .5s;
        position: absolute;
        left: 2px;
        right: 2px
    }

    .simplebar-scrollbar.simplebar-visible:before {
        opacity: .5;
        transition-duration: 0s;
        transition-delay: 0s
    }

    .simplebar-track.simplebar-vertical {
        width: 11px;
        top: 0
    }

    .simplebar-scrollbar:before {
        inset: 2px
    }

    .simplebar-track.simplebar-horizontal {
        height: 11px;
        left: 0
    }

    .simplebar-track.simplebar-horizontal .simplebar-scrollbar {
        width: auto;
        min-width: 10px;
        min-height: 0;
        inset: 0 auto 0 0
    }

    [data-simplebar-direction=rtl] .simplebar-track.simplebar-vertical {
        left: 0;
        right: auto
    }

    .simplebar-dummy-scrollbar-size {
        opacity: 0;
        visibility: hidden;
        direction: rtl;
        width: 500px;
        height: 500px;
        position: fixed;
        overflow: scroll hidden;
        -ms-overflow-style: scrollbar !important
    }

    .simplebar-dummy-scrollbar-size>div {
        width: 200%;
        height: 200%;
        margin: 10px 0
    }

    .simplebar-hide-scrollbar {
        visibility: hidden;
        scrollbar-width: none;
        -ms-overflow-style: none;
        position: fixed;
        left: 0;
        overflow-y: scroll
    }
}

@layer components {
    .c-h2 {
        font-family: var(--font-rounded);
        letter-spacing: .02em;
        font-size: 2.4rem;
        font-weight: 800;
        line-height: 1.0625
    }

    @media (width>=768px) {
        .c-h2 {
            font-size: 4rem
        }
    }

    .c-board {
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAADNSURBVGhD7ZjBDYMwFEPJDOzBNl2yTANz0BlohcQlEkKWLUrax5VPiP2cH0hZP1fX8FUQ8GV6cQLj/NokPYb+EmkIqG2GgBg8IkSExMjU5UTINNB+PE7AnpE4AAJEw+LlcQLsxCKj9gk8p2WtP333GByZcaf60ryA9C8li/jvFnE6QqKBdnm8jdozEgdAgGhYvDxOgDYqMoIApxJiZDiVODOMLnTmUHU/3oXE99vlCLAtNAeAABvZ3SLEPiASiS9iCEBAdODn2qipX378DbfmMFQnPx0kAAAAAElFTkSuQmCC) 50%/2.4rem 2.4rem;
        padding: 1.5rem 2rem 2.5rem;
        position: relative
    }

    .c-board__close {
        width: 3rem;
        height: 3rem;
        font-family: var(--font-rounded);
        color: #fff;
        background-color: #fda26b;
        border-radius: 50%;
        justify-content: center;
        align-items: center;
        margin-left: auto;
        font-size: 2.6rem;
        display: flex;
        rotate: 45deg
    }

    @media (any-hover:hover) {
        .c-board__close {
            transition: opacity .3s ease-in-out
        }

        .c-board__close:hover {
            opacity: .6
        }
    }

    .c-board__heading {
        justify-content: center;
        align-items: center;
        gap: 0 1rem;
        padding-bottom: 2rem;
        display: flex
    }

    .c-board__heading>i {
        flex: 0 0 4rem
    }

    .c-board__heading>span {
        font-family: var(--font-rounded);
        color: var(--color-green);
        text-align: center;
        font-size: 2.8rem;
        font-weight: 800;
        line-height: 1.14286
    }

    .c-board__container {
        border: .2rem solid var(--color-orange);
        background-color: #fff;
        max-width: 92rem;
        margin-inline: auto;
        padding: 2rem;
        line-height: 1.71429
    }

    .c-board__container a {
        color: var(--color-orange);
        text-decoration: underline
    }

    @media (any-hover:hover) {
        .c-board__container a:hover {
            text-decoration: none
        }
    }

    .c-board__container table {
        margin-top: 3rem
    }

    .c-board__container table th,
    .c-board__container table td {
        border: 1px solid #3e3e3e;
        padding: 1.2rem 2rem;
        font-size: 1.4rem;
        font-weight: 500;
        line-height: 1.71429
    }

    @media (width>=768px) {
        .c-board__heading {
            gap: 0 1.6rem
        }

        .c-board__heading>i {
            flex: 0 0 4.5rem
        }

        .c-board__heading>span {
            font-size: 4rem
        }

        .c-board__container {
            padding: 4rem;
            line-height: 1.75
        }
    }

    @media (width<768px) {
        .c-board__heading {
            margin-top: 1rem
        }
    }

    .c-dia-board {
        --board-color: var(--color-orange);
        max-width: 83rem;
        margin-inline: auto
    }

    .c-dia-board.-navy {
        --board-color: var(--color-navy)
    }

    .c-dia-board__close {
        width: 4rem;
        height: 4rem;
        font-family: var(--font-rounded);
        color: var(--board-color);
        background-color: var(--color-yellow);
        border-radius: 50%;
        justify-content: center;
        align-items: center;
        margin-left: auto;
        font-size: 3.2rem;
        display: flex;
        rotate: 45deg
    }

    @media (any-hover:hover) {
        .c-dia-board__close {
            transition: opacity .3s ease-in-out
        }

        .c-dia-board__close:hover {
            opacity: .6
        }
    }

    .c-dia-board__hdr {
        justify-content: space-between;
        display: flex
    }

    .c-dia-board__ttl {
        font-family: var(--font-rounded);
        color: #fff;
        background-color: var(--board-color);
        clip-path: polygon(0% 0%, calc(100% - 2.4rem) 0%, 100% 100%, 0% 100%);
        border-top-left-radius: 4rem;
        gap: 0 2rem;
        padding: .8rem 2.5rem .8rem 3rem;
        font-size: 2rem;
        display: flex
    }

    .c-dia-board__bdy {
        position: relative
    }

    .c-dia-board__bdy:before {
        z-index: 0;
        content: "";
        background-color: var(--color-orange);
        width: 10rem;
        height: 10rem;
        position: absolute;
        top: 0;
        left: 0
    }

    .c-dia-board__bdy:is(.c-dia-board.-navy *):before {
        background-color: var(--color-navy)
    }

    .c-dia-board__in {
        z-index: 1;
        border: .3rem solid var(--color-orange);
        background: #ffc7b3 url(/freelancelaw_2026/assets/bg-diagnosis-modal.png) 100% 0/cover;
        border-radius: 2rem;
        padding: 2rem;
        position: relative
    }

    .c-dia-board__in:is(.c-dia-board.-navy *) {
        border-color: var(--color-navy);
        background-color: #50bee7
    }

    .c-dia-board__fin {
        z-index: 1;
        aspect-ratio: 827/423;
        border: .3rem solid var(--color-orange);
        background: #ffc7b3 url(/freelancelaw_2026/assets/bg-diagnosis-modal02.png) 50%/cover;
        border-radius: 2rem;
        padding-top: .8rem;
        position: relative
    }

    .c-dia-board__fin:is(.c-dia-board.-navy *) {
        border-color: var(--color-navy);
        background-color: #50bee7
    }

    .c-dia-board__fin p {
        font-family: var(--font-rounded);
        color: var(--color-orange);
        text-align: center;
        font-size: 2.4rem;
        font-weight: 800
    }

    @media (width>=768px) {
        .c-dia-board__in {
            border-width: .6rem;
            border-radius: 4rem;
            padding: 4rem
        }

        .c-dia-board__ttl {
            clip-path: polygon(0% 0%, calc(100% - 3.4rem) 0%, 100% 100%, 0% 100%);
            border-top-left-radius: 100vmax;
            padding: 1.2rem 5.5rem 1.2rem 5rem;
            font-size: 2.8rem
        }

        .c-dia-board__fin {
            padding-top: 1.8rem
        }

        .c-dia-board__fin p {
            font-size: 5.4rem
        }
    }

    @media (width<768px) {
        .c-dia-board {
            margin-inline: .5rem
        }

        .c-dia-board__ttl {
            flex-direction: column;
            line-height: 1.3
        }
    }

    .c-movie-board {
        max-width: 80rem;
        margin-inline: auto
    }

    .c-movie-board iframe {
        width: 100%
    }

    .c-movie-board__close {
        width: 3rem;
        height: 3rem;
        font-family: var(--font-rounded);
        color: #fff;
        background-color: #fda26b;
        border-radius: 50%;
        justify-content: center;
        align-items: center;
        margin-bottom: 2rem;
        margin-left: auto;
        font-size: 2.6rem;
        display: flex;
        rotate: 45deg
    }

    @media (any-hover:hover) {
        .c-movie-board__close {
            transition: opacity .3s ease-in-out
        }

        .c-movie-board__close:hover {
            opacity: .6
        }
    }

    .c-modal {
        z-index: 999;
        justify-content: center;
        align-items: center;
        padding-block: 3rem;
        display: flex;
        position: fixed;
        inset: 0
    }

    .c-modal__overlay {
        z-index: 0;
        background: #3d3d3dcc;
        position: absolute;
        inset: 0
    }

    .c-modal__wrapper {
        z-index: 1;
        -webkit-overflow-scrolling: touch;
        flex: auto;
        max-width: 100rem;
        max-height: calc(100vh - 6rem);
        position: relative;
        overflow: auto
    }

    .c-modal__wrapper .simplebar-track {
        background-color: #e1e1e1;
        border-radius: 100vmax
    }

    .c-modal__wrapper .simplebar-track.simplebar-horizontal {
        height: .8rem
    }

    .c-modal__wrapper .simplebar-track.simplebar-vertical {
        width: .8rem
    }

    .c-modal__wrapper .simplebar-scrollbar:before {
        background-color: var(--color-orange);
        opacity: 1;
        inset: 0
    }

    @media (width>=768px) {
        .c-modal {
            padding-block: 8rem
        }

        .c-modal__wrapper {
            max-height: calc(100vh - 16rem)
        }

        .c-modal__inner {
            min-width: 100rem
        }
    }

    @media (width<768px) {
        .c-modal__wrapper {
            overflow: hidden auto
        }
    }

    .c-rounded-txt {
        font-family: var(--font-rounded);
        font-weight: 800
    }

    .c-outdent {
        --outdent: 1em;
        padding-left: var(--outdent);
        text-indent: calc(-1 * var(--outdent))
    }

    .c-slim-inner {
        width: min(100% - var(--section-gutter) * 2, var(--inner-slim));
        --section-gutter: var(--gutter);
        margin-inline: auto
    }

    .c-inner {
        width: min(100% - var(--section-gutter) * 2, var(--inner-base));
        --section-gutter: var(--gutter);
        margin-inline: auto
    }

    .c-wide-inner {
        width: min(100% - var(--section-gutter) * 2, var(--inner-wide));
        --section-gutter: var(--gutter);
        margin-inline: auto
    }

    [data-gutter=fill]:is(.c-slim-inner, .c-inner, .c-wide-inner) {
        --section-gutter: 0px
    }

    @media (width>=768px) {
        [data-gutter-pc=fill]:is(.c-slim-inner, .c-inner, .c-wide-inner) {
            --section-gutter: 0px
        }
    }

    @media (width<768px) {
        [data-gutter-mobile=fill]:is(.c-slim-inner, .c-inner, .c-wide-inner) {
            --section-gutter: 0px
        }
    }

    .c-stack {
        flex-direction: column;
        display: flex
    }

    .c-hdr-menu {
        justify-content: space-around;
        align-items: center;
        gap: 0 3.2rem;
        height: 100%;
        display: flex
    }

    .c-hdr-menu__item {
        text-align: center;
        flex: 0 auto;
        font-size: 1.5rem;
        font-weight: 800;
        line-height: 1.35
    }

    .c-hdr-menu__item+.c-hdr-menu__item {
        position: relative
    }

    .c-hdr-menu__item+.c-hdr-menu__item:before {
        content: "";
        background-color: #707070;
        width: .1rem;
        height: 2.4rem;
        position: absolute;
        top: 50%;
        left: -1.5rem;
        translate: 0 -50%
    }

    .c-hdr-menu__item a {
        transition-property: color;
        transition-duration: .3s
    }

    @media (any-hover:hover) {
        .c-hdr-menu__item a:hover {
            color: #008d46
        }
    }

    .c-nav-menu__item {
        text-align: center;
        font-size: 1.8rem;
        line-height: 1.625
    }

    .c-nav-menu__item a {
        color: #008d46;
        justify-content: center;
        align-items: center;
        height: 6.5rem;
        font-weight: 800;
        display: flex
    }

    .c-nav-menu__item+.c-nav-menu__item {
        border-top: .3rem solid #ffd6c7
    }

    .c-toggle {
        flex-direction: column;
        justify-content: space-between;
        width: 2.6rem;
        height: 1.7rem;
        display: flex
    }

    .c-toggle>i {
        background-color: #394842;
        flex: 0 0 .2rem;
        width: 100%;
        height: .2rem;
        transition-duration: .3s
    }

    .c-toggle.is-open>i:first-child {
        translate: 0 .75rem;
        rotate: -45deg
    }

    .c-toggle.is-open>i:nth-child(2) {
        scale: 0
    }

    .c-toggle.is-open>i:nth-child(3) {
        translate: 0 -.75rem;
        rotate: 45deg
    }

    .c-news-unit {
        flex-direction: column;
        gap: .5rem 0;
        display: flex
    }

    .c-news-unit ._date {
        color: var(--color-orange);
        font-size: 1.4rem;
        font-weight: 800
    }

    .c-news-unit ._link {
        align-self: center;
        font-size: 1.4rem;
        font-weight: 500;
        line-height: 1.42857
    }

    @media (width>=768px) {
        .c-news-unit {
            flex-direction: row;
            gap: 0 1.5rem
        }

        .c-news-unit ._date {
            letter-spacing: .02em;
            flex: 0 0 8.5rem
        }
    }

    .c-movie-card {
        --radius: 1.6rem;
        border-radius: var(--radius);
        border: .3rem solid #fff
    }

    .c-movie-card__hdr {
        background-color: var(--color-orange);
        border-radius: calc(var(--radius) - .5rem) calc(var(--radius) - .5rem) 0 0;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        gap: .5rem 0;
        padding: .9rem .5rem .8rem;
        display: flex
    }

    .c-movie-card__label {
        flex: none
    }

    .c-movie-card__ttl {
        font-family: var(--font-rounded);
        color: #fff;
        text-align: center;
        flex: 0 auto;
        font-size: 1.7rem;
        font-weight: 800;
        line-height: 1.29412
    }

    .c-movie-card__btn {
        border-radius: 0 0 calc(var(--radius) - .5rem) calc(var(--radius) - .5rem);
        display: block;
        overflow: hidden
    }

    .c-movie-card__thumb {
        justify-content: center;
        align-items: center;
        display: flex;
        position: relative
    }

    .c-movie-card__thumb:before {
        content: "";
        opacity: .15;
        background-color: #394842;
        position: absolute;
        inset: 0
    }

    .c-movie-card__icon {
        z-index: 2;
        color: #fff;
        font-size: 6rem;
        position: absolute
    }

    @media (width>=768px) {
        .c-movie-card {
            --radius: 2rem;
            border: .6rem solid #fff
        }

        .c-movie-card__hdr {
            gap: .6rem 1.6rem;
            padding: 1.5rem .5rem
        }

        .c-movie-card__ttl {
            letter-spacing: .03em;
            font-size: 3rem;
            line-height: 1.16667
        }

        .c-movie-card__thumb {
            margin-inline: -.6rem
        }

        .c-movie-card__icon {
            font-size: 10.5rem
        }
    }

    .c-download-card {
        grid-template-rows: subgrid;
        border: .2rem solid var(--color-green);
        border-radius: 2rem;
        grid-row: span 3;
        gap: 0;
        padding: 1.3rem 1.3rem 1.2rem;
        display: grid
    }

    .c-download-card__heading {
        color: var(--color-green);
        text-align: center;
        justify-content: center;
        align-items: center;
        padding-bottom: 1.5rem;
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 1.5;
        display: flex
    }

    .c-download-card__txt {
        padding-bottom: 1.6rem;
        font-size: 1.2rem;
        font-weight: 500;
        line-height: 1.5
    }

    .c-download-card__btn {
        background-color: var(--color-green);
        border-radius: 100vmax;
        align-items: center;
        height: 3.3rem;
        padding-inline: .8rem;
        display: flex
    }

    @media (any-hover:hover) {
        .c-download-card__btn {
            transition: opacity .3s ease-in-out
        }

        .c-download-card__btn:hover {
            opacity: .6
        }
    }

    .c-download-card__btn ._text {
        font-family: var(--font-rounded);
        color: #fff;
        text-align: center;
        flex: auto;
        font-size: 1.2rem;
        font-weight: 800
    }

    .c-download-card__btn ._icon {
        width: 2rem;
        height: 2rem;
        color: var(--color-green);
        background-color: #fff;
        border-radius: 50%;
        flex: 0 0 2rem;
        justify-content: center;
        align-items: center;
        font-size: 1rem;
        display: flex
    }

    @media (width>=768px) {
        .c-download-card {
            padding: 1.8rem
        }

        .c-download-card__heading {
            padding-bottom: 1.5rem;
            font-size: 1.8rem
        }

        .c-download-card__txt {
            padding-bottom: 1.1rem;
            font-size: 1.4rem;
            line-height: 1.57143
        }

        .c-download-card__btn {
            height: 4.8rem;
            padding-inline: 1.1rem
        }

        .c-download-card__btn ._text {
            font-size: 1.4rem
        }

        .c-download-card__btn ._icon {
            flex: 0 0 3rem;
            height: 3rem;
            font-size: 1.4rem
        }
    }

    @media (width<768px) {
        .c-download-card__heading {
            justify-content: center;
            align-items: center;
            line-height: 1.5;
            display: flex
        }
    }

    .c-check-card {
        background-color: #fff;
        border: .3rem solid #e96732;
        border-radius: 1.6rem;
        padding: 1.7rem 1.6rem 0
    }

    .c-check-card__btn {
        cursor: pointer;
        align-items: flex-start;
        gap: 0 1rem;
        padding-bottom: 1.5rem;
        display: flex
    }

    .c-check-card__btn ._icon {
        background-color: #efefef;
        border: .2rem solid #c9c9c9;
        flex: 0 0 2.4rem;
        width: 2.4rem;
        height: 2.4rem;
        margin-top: .5rem
    }

    .c-check-card__btn ._icon.is-open {
        background: #faf788 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAJaSURBVHhe7Zg9WsJAEIZ3UsRSKRRLbmDkAsINvIFYiJZ6AvEEWmIsiCfQG6gXgHgDS7ERSygybuDJQ4gBMZn8rDups5P53v3mB0Bo/oDm+gUDYAdoToBLQHMDcBPkEuAS0JwAl4DmBuApwCXAJaA5AS4BzQ3AU0DJEvg4saydO9elcK9SAD5b1tbENHrSt4cC0TUn2Kw47igNCKUADNv1h6n44EFxVbX7HS0ADE/rPSm0FRaLKC527f7NvwcQJ14IfDXH2Pj3JZCleN85pe4B7+36OYC4XrA4ii9z4tXS3nwQs7QAPs6sFqLs+AtFL74AvQbVCCytA/ISX0oAeYonATBbTuBJAFgyoFO97R8nHUv+hoeGMYieN8Brbnfd56RxV51L3QPkctKRrfRyvpwk29Cm4mEKciucMIB3vNN1nSzEkzjgBwA/6h/X1KLEkwCYlsAGSHvC3mLHxhEgNn/r2EWKJwHgB0kKwT833oABCKhFxl3qHX/dkkndA8IfGrb3HVnDR9GPx9VxpHnOjyDeV+1Ba10Bad8jBeAnsw6EsognK4HoLcTO8tlLjjn2LkJjs7CbDz5M7oAg8FIIiKPoqEPEl1170Ehr5yTnMwPgJzPr8Maz3BM2lydH87M2ifjMSiCczGoIxYrPBYD/kfgxWbz43AAEEMYmPALAAdW/OUltHz6XaQ+IS/DzzKpVuu4bRfIUMXIHQJE0ZQwGQElTxVjsABVvjTJndgAlTRVjsQNUvDXKnNkBlDRVjMUOUPHWKHNmB1DSVDEWO0DFW6PMmR1ASVPFWNo74BtVKw5Qaw6YCQAAAABJRU5ErkJggg==) 50%/cover no-repeat;
        border-color: #faf788
    }

    .c-check-card__btn ._text {
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 1.375
    }

    .c-check-card__cts {
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAGCAYAAADDl76dAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAACESURBVBhXY/zfnyDAwMhZz8DwP4CBgVGAgYFhAcP/742MhQs+ANkkA8b//RkTGBgZ81F0/v8/kbFwRgHJpgE1MP6fkPkeSINchgw+MBZMFyTPwP6MD0AX8qO58CPQheiWEGU+yMsNQAOBYYgEKPEyyBhwODIwAiMFzFsAdF0DUc7BoggAHTopB86bWDAAAAAASUVORK5CYII=) 0 0/1rem .3rem repeat-x;
        padding-block: 1.6rem 2rem
    }

    .c-check-card__prose h3 {
        font-size: 1.4rem;
        font-weight: 500;
        line-height: 1.57143
    }

    .c-check-card__prose h3 b {
        color: var(--color-orange);
        font-weight: 700
    }

    .c-check-card__prose p {
        margin-bottom: .8rem;
        font-size: 1.2rem;
        font-weight: 500;
        line-height: 1.66667
    }

    .c-check-card__prose ol,
    .c-check-card__prose ul {
        background-color: #f2f2f2;
        width: fit-content;
        padding: 1rem
    }

    .c-check-card__prose ol li,
    .c-check-card__prose ul li {
        font-size: 1.2rem;
        font-weight: 700;
        line-height: 1.66667
    }

    .c-check-card__prose ol>li {
        text-indent: -1.5em;
        padding-left: 1.5em
    }

    .c-check-card__prose small {
        font-size: 1rem;
        line-height: 1.4;
        display: block
    }

    .c-check-card__prose table {
        margin-top: 3rem
    }

    .c-check-card__prose table {
        margin-top: 3rem
    }

    .c-check-card__prose table th,
    .c-check-card__prose table td {
        border: 1px solid #3e3e3e;
        padding: 1.2rem 2rem;
        font-size: 1.4rem;
        font-weight: 500;
        line-height: 1.71429
    }


    @media (width>=768px) {
        .c-check-card {
            border: .4rem solid #e96732;
            border-radius: 2rem;
            padding: 2.6rem 2.6rem 0
        }

        .c-check-card__btn {
            gap: 0 2rem;
            padding-bottom: 2.4rem
        }

        .c-check-card__btn ._icon {
            flex: 0 0 3.2rem;
            width: 3.2rem;
            height: 3.2rem;
            margin-top: 0
        }

        .c-check-card__btn ._text {
            font-size: 2rem
        }

        .c-check-card__cts {
            margin-left: 5.2rem;
            padding-block: 3.1rem 2.8rem
        }

        .c-check-card__prose h3 {
            font-size: 1.8rem;
            line-height: 1.77778
        }

        .c-check-card__prose p {
            margin-bottom: 1.1rem;
            font-size: 1.6rem;
            line-height: 2
        }

        .c-check-card__prose ol,
        .c-check-card__prose ul {
            margin-block: 1.1rem;
            padding: 1.8rem 2rem 1.4rem
        }

        .c-check-card__prose ol li,
        .c-check-card__prose ul li {
            font-size: 1.6rem;
            line-height: 2
        }

        .c-check-card__prose small {
            margin-top: 2rem;
            font-size: 1.2rem
        }
    }

    @media (width<768px) {
        .c-check-card__prose h3 {
            padding-bottom: 1.2rem
        }

        .c-check-card__prose ol,
        .c-check-card__prose ul {
            flex-direction: column;
            gap: .5rem 0;
            margin-block: .8rem;
            display: flex
        }
    }

    .c-faq-card {
        border: .4rem solid var(--color-green);
        background-color: #fff;
        border-radius: .8rem
    }

    .c-faq-card__q {
        background-color: var(--color-green);
        align-items: center;
        gap: 0 1rem;
        width: 100%;
        padding: 1.6rem 1rem 2rem;
        display: flex
    }

    .c-faq-card__q ._icon {
        width: 3rem;
        height: 3rem;
        font-family: var(--font-latin);
        color: var(--color-green);
        background-color: #fff;
        border-radius: 50%;
        flex: 0 0 3rem;
        justify-content: center;
        align-items: center;
        font-size: 2.4rem;
        font-weight: 900;
        display: flex
    }

    .c-faq-card__q ._txt {
        color: #fff;
        text-align: left;
        flex: auto;
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 1.4375
    }

    .c-faq-card__q ._toggle {
        flex: 0 0 1.8rem;
        justify-content: center;
        align-items: center;
        width: 1.8rem;
        height: 1.8rem;
        display: flex;
        position: relative
    }

    .c-faq-card__q ._toggle:before,
    .c-faq-card__q ._toggle:after {
        content: "";
        background-color: #fff;
        border-radius: 100vmax;
        width: 100%;
        height: .2rem;
        position: absolute
    }

    .c-faq-card__q ._toggle:not(.is-open):after {
        rotate: 90deg
    }

    .c-faq-card__a {
        gap: 0 1rem;
        width: 100%;
        padding: 2.5rem 1.5rem 1.2rem;
        display: flex
    }

    .c-faq-card__a ._icon {
        width: 3rem;
        height: 3rem;
        font-family: var(--font-latin);
        color: #fff;
        background-color: var(--color-orange);
        border-radius: 50%;
        flex: 0 0 3rem;
        justify-content: center;
        align-items: center;
        font-size: 2.4rem;
        font-weight: 900;
        display: flex
    }

    .c-faq-card__a ._cts {
        font-size: 1.4rem;
        font-weight: 500;
        line-height: 1.71429
    }

    .c-faq-card__a ._cts small {
        margin-block-start: .5em;
        display: block
    }

    .c-faq-card__a a {
        color: var(--color-orange);
        text-decoration: underline
    }

    @media (any-hover:hover) {
        .c-faq-card__a a:hover {
            text-decoration: none
        }
    }

    @media (width>=768px) {
        .c-faq-card__q {
            gap: 0 2rem;
            padding: 1.3rem 2.4rem
        }

        .c-faq-card__q ._icon {
            flex: 0 0 4rem;
            width: 4rem;
            height: 4rem;
            font-size: 2.4rem
        }

        .c-faq-card__q ._txt {
            font-size: 2rem;
            line-height: 1.6
        }

        .c-faq-card__a {
            gap: 0 2rem;
            padding: 1.8rem 2.4rem
        }

        .c-faq-card__a ._icon {
            flex: 0 0 4rem;
            width: 4rem;
            height: 4rem;
            font-size: 2.4rem
        }

        .c-faq-card__a ._cts {
            font-size: 1.6rem;
            line-height: 1.875
        }
    }

    .c-label {
        font-family: var(--font-rounded);
        color: var(--color-orange);
        text-align: center;
        background-color: #fff;
        border-radius: 100vmax;
        justify-content: center;
        align-items: center;
        padding: .5rem 1rem;
        font-size: 1.2rem;
        font-weight: 800;
        line-height: 1;
        display: flex
    }

    @media (width>=768px) {
        .c-label {
            padding: 1rem 2rem;
            font-size: 1.8rem
        }
    }

    .c-btn {
        border: .4rem solid #fff;
        border-radius: 100vmax;
        justify-content: center;
        align-items: center;
        display: flex
    }

    @media (any-hover:hover) {
        .c-btn {
            transition: opacity .3s ease-in-out
        }

        .c-btn:hover {
            opacity: .6
        }
    }

    .c-btn ._text {
        font-family: var(--font-rounded);
        color: #fff;
        text-align: center;
        letter-spacing: .03em;
        font-size: 1.8rem;
        font-weight: 800;
        line-height: 1.33333
    }

    @media (width>=768px) {
        .c-btn ._text {
            font-size: 2.2rem;
            line-height: 1.36364
        }
    }

    .c-download-btn {
        background-color: var(--color-green);
        border: .4rem solid #fff;
        border-radius: 100vmax;
        align-items: center;
        padding-inline: 2.5rem 1.5rem;
        display: flex
    }

    @media (any-hover:hover) {
        .c-download-btn {
            transition: opacity .3s ease-in-out
        }

        .c-download-btn:hover {
            opacity: .6
        }
    }

    .c-download-btn ._text {
        font-family: var(--font-rounded);
        color: #fff;
        letter-spacing: -.02em;
        flex: auto;
        font-size: 1.5rem;
        font-weight: 800;
        line-height: 1.33333
    }

    .c-download-btn ._icon {
        width: 3.6rem;
        height: 3.6rem;
        color: var(--color-green);
        background-color: #fff;
        border-radius: 50%;
        flex: 0 0 3.6rem;
        justify-content: center;
        align-items: center;
        font-size: 1.8rem;
        display: flex
    }

    @media (width>=768px) {
        .c-download-btn {
            padding-inline: 2rem
        }

        .c-download-btn ._text {
            text-align: center;
            letter-spacing: .03em;
            font-size: 2.2rem;
            line-height: 1.36364
        }

        .c-download-btn ._icon {
            flex: 0 0 4rem;
            width: 4rem;
            height: 4rem
        }
    }

    .c-choce-btn {
        width: 100%;
        height: 4rem;
        font-family: var(--font-rounded);
        color: #fff;
        border-radius: 100vmax;
        justify-content: center;
        align-items: center;
        font-size: 2rem;
        font-weight: 800;
        display: flex
    }

    @media (any-hover:hover) {
        .c-choce-btn {
            transition: opacity .3s ease-in-out
        }

        .c-choce-btn:hover {
            opacity: .6
        }
    }

    @media (width>=768px) {
        .c-choce-btn {
            height: 6.3rem;
            font-size: 3.1rem
        }
    }

    .c-next-btn {
        width: 100%;
        font-family: var(--font-rounded);
        color: #fff;
        border-radius: 100vmax;
        justify-content: space-between;
        align-items: center;
        padding-inline: 2rem;
        font-size: 1.8rem;
        font-weight: 800;
        display: flex
    }

    @media (any-hover:hover) {
        .c-next-btn {
            transition: opacity .3s ease-in-out
        }

        .c-next-btn:hover {
            opacity: .6
        }
    }

    @media (width>=768px) {
        .c-next-btn {
            font-size: 2rem
        }
    }

    .c-check-group {
        background-color: var(--color-yellow);
        border: .2rem solid var(--color-green);
        padding-block: 1.8rem 1.7rem;
        position: relative
    }

    .c-check-group__icon {
        width: 6.8rem;
        position: absolute;
        bottom: -3.1rem;
        left: -1.2rem
    }

    .c-check-group__text {
        font-family: var(--font-rounded);
        color: var(--color-green);
        text-align: center;
        font-size: 1.6rem;
        font-weight: 800;
        line-height: 1.5
    }

    @media (width>=768px) {
        .c-check-group {
            padding-block: 1.2rem
        }

        .c-check-group__text {
            text-align: center;
            font-size: 2.4rem
        }

        .c-check-group__icon {
            width: 9.2rem;
            bottom: -1.4rem;
            left: 1.5rem
        }
    }

    .c-careful-group {
        flex-direction: column;
        gap: 1.7rem 0;
        display: flex;
        position: relative
    }

    .c-careful-group:before {
        content: "";
        background-color: var(--color-orange);
        width: .4rem;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 3.3rem
    }

    .c-careful-group__header {
        color: var(--color-orange);
        font-size: 1.8rem;
        font-weight: 700
    }

    .c-careful-group__header02 {
        width: fit-content;
        font-size: 1.8rem;
        font-weight: 700;
        position: relative
    }

    .c-careful-group__header02 span {
        z-index: 1;
        position: relative
    }

    .c-careful-group__header02 span:nth-child(2) {
        z-index: 0;
        color: #0000;
        -webkit-text-stroke: .6rem #fefde7;
        paint-order: stroke fill;
        white-space: nowrap;
        position: absolute;
        inset: 0
    }

    .c-careful-group__item {
        z-index: 1;
        background-color: #ffe2cd;
        position: relative
    }

    .c-careful-group__item02 {
        z-index: 1;
        position: relative
    }

    @media (any-hover:hover) {
        .c-careful-group__btn {
            transition: opacity .3s ease-in-out
        }

        .c-careful-group__btn:hover {
            opacity: .6
        }
    }

    @media (width>=768px) {
        .c-careful-group {
            gap: 3rem 0
        }

        .c-careful-group:before {
            width: .6rem;
            left: 9.9rem
        }

        .c-careful-group__header {
            text-align: center;
            align-self: center;
            margin-block: -1rem;
            font-size: 3.2rem;
            line-height: 1.25
        }

        .c-careful-group__header02 {
            text-align: center;
            align-self: center;
            margin-block: -1rem;
            margin-inline: auto;
            font-size: 2rem;
            line-height: 1.2
        }

        .c-careful-group__item,
        .c-careful-group__item02 {
            grid-template-columns: 21.1rem 1fr;
            display: grid
        }

        .c-careful-group__item {
            padding-block: 3rem
        }

        .c-careful-group__cts {
            grid-template-columns: 1fr 1fr;
            gap: 1rem;
            padding-right: 2rem;
            display: grid
        }
    }

    @media (width<768px) {
        .c-careful-group__item {
            padding: .8rem .8rem 2rem
        }

        .c-careful-group__header {
            padding-bottom: .8rem;
            padding-left: .9rem
        }

        .c-careful-group__header02 {
            margin-bottom: .8rem;
            margin-left: .9rem
        }

        .c-careful-group__cts {
            flex-direction: column;
            gap: .8rem;
            display: flex
        }
    }
}

@layer features {
    .hero {
        z-index: 1;
        background-color: var(--color-movie-bg);
        position: relative
    }

    .hero__ellipse {
        z-index: 10;
        pointer-events: none;
        background-color: var(--color-movie-bg);
        position: absolute;
        inset: auto 0 0
    }

    .hero__inner {
        z-index: 0;
        background-color: #fff;
        padding-bottom: 10.4rem;
        position: relative
    }

    .hero__news {
        max-height: 31rem;
        padding-right: 2rem
    }

    .hero__news .simplebar-track.simplebar-vertical {
        background-color: #f0f0f0;
        border-radius: .4rem;
        width: .8rem
    }

    .hero__news .simplebar-scrollbar:before {
        background-color: var(--color-orange);
        opacity: 1;
        inset: 0
    }

    .hero__cloud01,
    .hero__cloud02 {
        z-index: 20;
        position: absolute
    }

    .hero__item01,
    .hero__item02 {
        display: none
    }

    @media (width>=768px) {

        .hero:before,
        .hero:after {
            z-index: 1;
            content: "";
            background: url(/freelancelaw_2026/assets/screen-message.jpg) 0 0/4rem repeat-y;
            width: 4.2rem;
            animation: 20s linear infinite markey;
            position: absolute;
            top: 0;
            bottom: 0
        }

        .hero:before {
            border-right: .2rem solid #fff;
            left: 0
        }

        .hero:after {
            border-left: .2rem solid #fff;
            animation-direction: reverse;
            right: 0
        }

        .hero__ellipse {
            height: 22rem;
            mask: radial-gradient(79% 100% at 50% 0, #0000 99.8%, #000 100%)
        }

        .hero__ellipse:before {
            content: "";
            background-color: #fff;
            border-radius: 50%;
            width: 37.1rem;
            height: 37.1rem;
            position: absolute;
            bottom: 1.2rem;
            right: calc(50% + 29.5rem)
        }

        .hero__cloud01 {
            width: 21rem;
            bottom: -2.5rem;
            right: calc(50% + 47.5rem)
        }

        .hero__cloud02 {
            width: 31.4rem;
            bottom: -13.4rem;
            left: calc(50% + 49.9rem)
        }

        .hero__inner {
            padding-bottom: 5.3rem
        }

        .hero__news {
            max-height: 10.8rem;
            padding-right: 0
        }

        .hero__item01 {
            z-index: 30;
            pointer-events: none;
            width: 16.6rem;
            display: block;
            position: absolute;
            bottom: 2.7rem;
            right: calc(50% + 52rem)
        }

        .hero__item02 {
            z-index: 30;
            pointer-events: none;
            width: 13.8rem;
            display: block;
            position: absolute;
            bottom: 11.7rem;
            left: calc(50% + 53.5rem)
        }
    }

    @media (width<768px) {
        .hero:before {
            content: "";
            background: url(/freelancelaw_2026/assets/screen-message-mobile1005.jpg) 0 0/auto 3.6rem repeat-x;
            border-bottom: .2rem solid #fff;
            width: 100%;
            height: 3.8rem;
            animation: 10s linear infinite markey-h;
            display: block
        }

        .hero__ellipse {
            height: 13.5rem;
            mask: radial-gradient(79% 100% at 50% 0, #0000 99.8%, #000 100%)
        }

        .hero__ellipse:before {
            content: "";
            background-color: #fff;
            border-radius: 50%;
            width: 37.1rem;
            height: 37.1rem;
            position: absolute;
            bottom: 1.2rem;
            right: calc(50% + 29.5rem)
        }

        .hero__cloud01,
        .hero__cloud02 {
            display: none
        }
    }

    .movies {
        background-color: var(--color-movie-bg);
        padding-block: 5.1rem 4.3rem;
        position: relative
    }

    .movies:after {
        z-index: 1;
        content: "";
        background: url(/freelancelaw_2026/assets/movie-bg-mobile.png) bottom/100% no-repeat;
        position: absolute;
        inset: 0
    }

    .movies__hgrp>p {
        color: var(--color-orange);
        text-align: center;
        letter-spacing: .03em;
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 1.625
    }

    .movies__cloud01,
    .movies__cloud02,
    .movies__cloud03,
    .movies__cloud04,
    .movies__cloud05,
    .movies__cloud06,
    .movies__cloud07 {
        z-index: 0;
        position: absolute
    }

    .movies__cloud08 {
        z-index: 0;
        width: 48.6rem;
        max-width: none;
        position: absolute;
        top: -5.3rem;
        left: -9.5rem
    }

    .movies__cloud09 {
        z-index: 0;
        width: 20.6rem;
        max-width: none;
        position: absolute;
        top: 31.4rem;
        right: -3.6rem
    }

    .movies__cloud010 {
        z-index: 0;
        width: 71.6rem;
        max-width: none;
        position: absolute;
        top: 72rem;
        left: -21.5rem
    }

    @media (width>=768px) {
        .movies {
            padding-block: 10.9rem 12.1rem
        }

        .movies:after {
            background-image: url(/freelancelaw_2026/assets/movie-bg.png)
        }

        .movies__hgrp {
            position: relative
        }

        .movies__hgrp>h2 {
            width: 112.8rem;
            translate: -2.1rem
        }

        .movies__hgrp>p {
            font-size: 2.2rem;
            line-height: 1.63636;
            position: absolute;
            bottom: 9.3rem;
            left: 50%;
            translate: -50%
        }

        .movies__cloud08,
        .movies__cloud09,
        .movies__cloud010 {
            display: none
        }

        .movies__cloud01 {
            width: 36.9rem;
            top: 105.5rem;
            right: calc(50% + 52.5rem)
        }

        .movies__cloud02 {
            width: 36.9rem;
            top: 160rem;
            left: calc(50% + 43rem)
        }

        .movies__cloud03 {
            width: 28.9rem;
            top: 229.3rem;
            right: calc(50% + 62.2rem)
        }

        .movies__cloud04 {
            width: 36.9rem;
            top: 240.1rem;
            left: calc(50% + 59.5rem)
        }

        .movies__cloud05 {
            width: 23rem;
            top: 269.5rem;
            left: calc(50% + 43rem)
        }

        .movies__cloud06 {
            width: 36.9rem;
            bottom: 30rem;
            right: calc(50% + 35rem)
        }

        .movies__cloud07 {
            width: 36.9rem;
            bottom: 4rem;
            left: calc(50% + 33rem)
        }
    }

    @media (width<768px) {
        .movies {
            z-index: 2
        }

        .movies__hgrp {
            z-index: 2;
            position: relative
        }

        .movies__hgrp>p {
            letter-spacing: 0;
            padding-top: 2rem
        }

        .movies__cloud01,
        .movies__cloud02,
        .movies__cloud03,
        .movies__cloud04,
        .movies__cloud05,
        .movies__cloud06,
        .movies__cloud07 {
            display: none
        }
    }

    .purpose {
        background-image: url(/freelancelaw_2026/assets/purpose-bg-wave.png), url(/freelancelaw_2026/assets/purpose-bg.jpg);
        background-position: bottom, top;
        background-repeat: repeat-x, repeat;
        background-size: 100rem, 21.1rem;
        padding-block: 2.3rem 7rem
    }

    .purpose__hgrp h2 {
        text-align: center
    }

    .purpose__hgrp h2 img {
        width: 100%
    }

    .purpose__hgrp p {
        color: var(--color-green);
        text-align: center;
        margin-top: 2.1rem;
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 1.625
    }

    @media (width>=768px) {
        .purpose {
            background-size: 160rem, 21.1rem;
            padding-block: 13.4rem 11rem
        }

        .purpose__hgrp h2 img {
            width: 79.6rem
        }

        .purpose__hgrp p {
            letter-spacing: .03em;
            margin-top: 3rem;
            font-size: 2.2rem;
            line-height: 1.63636
        }
    }

    .purpose-about {
        border: .4rem solid var(--color-green);
        background-color: #fff;
        border-radius: 1.6rem;
        margin-top: 3.7rem
    }

    .purpose-about__btn {
        align-items: center;
        width: 100%;
        display: flex
    }

    .purpose-about__btn ._text {
        font-family: var(--font-rounded);
        color: var(--color-green);
        text-align: left;
        letter-spacing: .03em;
        flex: auto;
        font-size: 2rem;
        font-weight: 800;
        line-height: 1.33333
    }

    .purpose-about__btn ._icon {
        background-color: #bce577;
        border-radius: 50%;
        flex: none;
        justify-content: center;
        align-items: center;
        width: 2.4rem;
        height: 2.4rem;
        display: flex;
        position: relative
    }

    .purpose-about__btn ._icon:before,
    .purpose-about__btn ._icon:after {
        content: "";
        background-color: #fff;
        border-radius: .5rem;
        width: 2rem;
        height: .2rem;
        position: absolute
    }

    .purpose-about__btn ._icon:not(.is-open):after {
        rotate: 90deg
    }

    @media (width>=768px) {
        .purpose-about {
            border-width: .6rem;
            border-radius: 2rem;
            margin-top: 5.8rem;
            padding-inline: 3.4rem
        }

        .purpose-about__in {
            padding-block: 1.8rem 3.5rem
        }

        .purpose-about__btn {
            padding-block: 2.3rem
        }

        .purpose-about__btn ._text {
            text-align: center;
            letter-spacing: 0;
            font-size: 3.2rem
        }

        .purpose-about__btn ._icon {
            flex: 0 0 4rem;
            width: 4rem;
            height: 4rem
        }

        .purpose-about__btn ._icon:before,
        .purpose-about__btn ._icon:after {
            width: 2.6rem;
            height: .5rem
        }
    }

    @media (width<768px) {
        .purpose-about__btn {
            padding: 1.6rem 2rem 1.6rem 1.6rem
        }

        .purpose-about__in {
            padding-block: 2.3rem 3.5rem;
            padding-inline: 1.7rem
        }
    }

    .purpose-case {
        border: .4rem solid var(--color-green);
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAADNSURBVGhD7ZjBDYMwFEPJDOzBNl2yTANz0BlohcQlEkKWLUrax5VPiP2cH0hZP1fX8FUQ8GV6cQLj/NokPYb+EmkIqG2GgBg8IkSExMjU5UTINNB+PE7AnpE4AAJEw+LlcQLsxCKj9gk8p2WtP333GByZcaf60ryA9C8li/jvFnE6QqKBdnm8jdozEgdAgGhYvDxOgDYqMoIApxJiZDiVODOMLnTmUHU/3oXE99vlCLAtNAeAABvZ3SLEPiASiS9iCEBAdODn2qipX378DbfmMFQnPx0kAAAAAElFTkSuQmCC) 50%/2.4rem 2.4rem;
        border-radius: 1.6rem 1.6rem 0 0;
        overflow: hidden
    }

    .purpose-case__heading {
        width: fit-content;
        color: var(--color-green);
        text-align: center;
        letter-spacing: .03em;
        white-space: nowrap;
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAARCAYAAADKZhx3AAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAGYSURBVEhLxZRNUsJAEIXfYJWwM0fgBmajxJXcQI4AG5GVcALxBLLjZ0O4ATeQJeoGboA3wJ1YRcY34ScQM5ORwrJXqUx3f/26e0bgn0yg6z2QPYNYTnH7NvmzOnpX1wgCF0I4iiHQ8WQEkxMetFAdD45SQN918JW7h0SZ+fK7OWPg7dGIzhXUxrODC+heliBFn9pChXHTgekn5wxsEO7/Gt7xCAxVas0AXseslNvDLaAJM9YUaANX81zkntKUbggCbc+HkCXO4szcUtnC3Usj0SeEZp+ZwzXmkHgna8gRzsXWsVuo84eq2GAMygSPe9euU7ghsMWgvD5QfjB3iSMbRYp3vVebyHmmqee9B68eUNRtbZRWTtdQxkQWKd786124CDKsLBVubk54Smh2UURlMo87/wQrj2PAJQbIfdaToAqRDI7gqu3nFtL2XRS0Ni6b4vTgTVTba7I89Z5bGJdIyDKqr8M053SwytD28kxY5xdVJM2esxTwcbrwda21m7GpXDX/5YnDa+VwCdXSzA550+0Up/XtgPNvWimJvH3qYfwAAAAASUVORK5CYII=) bottom/1.5rem repeat-x;
        margin-inline: auto;
        font-size: 1.6rem;
        font-weight: 700
    }

    .purpose-case__heading b {
        color: var(--color-orange);
        letter-spacing: .03em;
        font-size: 2rem
    }

    @media (width>=768px) {
        .purpose-case {
            border-radius: 2rem 2rem 0 0
        }

        .purpose-case__heading {
            font-size: 2rem
        }

        .purpose-case__heading b {
            font-size: 2.4rem
        }
    }

    .purpose-contents {
        border: .4rem solid var(--color-orange);
        background-color: #fefde7;
        border-radius: 1.6rem;
        padding: 3rem 1.6rem 2.6rem
    }

    .purpose-contents__copy {
        color: var(--color-orange);
        text-align: center;
        margin-top: 2.4rem;
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 1.5
    }

    .purpose-contents__btns {
        aspect-ratio: 295/428;
        margin-top: 1.2rem;
        position: relative
    }

    .purpose-contents__btns>button {
        position: absolute
    }

    @media (any-hover:hover) {
        .purpose-contents__btns>button {
            transition: opacity .3s ease-in-out
        }

        .purpose-contents__btns>button:hover {
            opacity: .6
        }
    }

    .purpose-contents__btns .-btn01 {
        top: 0
    }

    .purpose-contents__btns .-btn01,
    .purpose-contents__btns .-btn02,
    .purpose-contents__btns .-btn04,
    .purpose-contents__btns .-btn06 {
        left: 0
    }

    .purpose-contents__btns .-btn03,
    .purpose-contents__btns .-btn05,
    .purpose-contents__btns .-btn07 {
        right: 0
    }

    @media (width>=768px) {
        .purpose-contents {
            border-width: .6rem;
            border-radius: 2rem;
            padding: 6rem 3rem 5rem
        }

        .purpose-contents__copy {
            letter-spacing: .03em;
            margin-top: 2.6rem;
            font-size: 2rem;
            line-height: 1.6
        }

        .purpose-contents__btns {
            aspect-ratio: 928/822;
            margin-top: 3.6rem
        }

        .purpose-contents__btns .-btn04,
        .purpose-contents__btns .-btn05,
        .purpose-contents__btns .-btn06,
        .purpose-contents__btns .-btn07 {
            width: 48.867%
        }

        .purpose-contents__btns .-btn01 {
            clip-path: polygon(0% 0%, 83.2% 0%, 100% 100%, 0% 100%);
            width: 62%;
            top: 0
        }

        .purpose-contents__btns .-btn02 {
            clip-path: polygon(0% 0%, 85.8% 0%, 100% 100%, 0% 100%);
            width: 73.9%;
            top: 25.5%
        }

        .purpose-contents__btns .-btn03 {
            clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 46.6% 100%);
            width: 46.7%;
            top: 0%
        }

        .purpose-contents__btns .-btn04,
        .purpose-contents__btns .-btn05 {
            bottom: 25.5%
        }

        .purpose-contents__btns .-btn06,
        .purpose-contents__btns .-btn07 {
            bottom: 0
        }
    }

    @media (width<768px) {
        .purpose-contents__btns .-btn01 {
            clip-path: polygon(0% 0%, 83.2% 0%, 100% 100%, 0% 100%);
            width: 62%
        }

        .purpose-contents__btns .-btn02 {
            clip-path: polygon(0% 0%, 85.8% 0%, 100% 100%, 0% 100%);
            width: 73.9%;
            top: 16%
        }

        .purpose-contents__btns .-btn03 {
            clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 46.6% 100%);
            width: 46.7%
        }

        .purpose-contents__btns .-btn04,
        .purpose-contents__btns .-btn05,
        .purpose-contents__btns .-btn06,
        .purpose-contents__btns .-btn07 {
            left: 0;
            right: 0
        }

        .purpose-contents__btns .-btn04 {
            bottom: 52%
        }

        .purpose-contents__btns .-btn05 {
            bottom: 34.5%
        }

        .purpose-contents__btns .-btn06 {
            bottom: 17%
        }

        .purpose-contents__btns .-btn07 {
            bottom: 0
        }
    }

    .purpose-chart {
        border: .4rem solid var(--color-orange);
        background-color: #fefde7;
        border-radius: 1.6rem;
        margin-top: 7.5rem;
        padding-bottom: 3.1rem
    }

    .purpose-chart__header {
        margin-bottom: -2.4rem;
        translate: 0 -5rem
    }

    @media (width>=768px) {
        .purpose-chart {
            border-width: .6rem;
            border-radius: 2rem;
            margin-top: 10.2rem;
            padding: 0 3rem 5rem
        }

        .purpose-chart__header {
            margin-bottom: .8rem;
            translate: 0 -3rem
        }
    }

    .purpose-careful {
        border: .4rem solid var(--color-orange);
        background-color: #fefde7;
        border-radius: 1.6rem;
        margin-top: 8.5rem
    }

    .purpose-careful__header {
        margin-bottom: -4rem;
        translate: 0 -7rem
    }

    @media (width>=768px) {
        .purpose-careful {
            border-width: .6rem;
            border-radius: 2rem;
            margin-top: 13.2rem;
            padding: 0 3rem 2.5rem
        }

        .purpose-careful__header {
            margin-bottom: -2.1rem;
            translate: 0 -6rem
        }
    }

    @media (width<768px) {
        .purpose-careful {
            padding-bottom: 3.3rem
        }

        .purpose-careful__header {
            margin-inline: -1.5rem
        }
    }

    .download {
        padding-block: 2.5rem 0
    }

    .download__heading {
        font-family: var(--font-rounded);
        color: var(--color-green);
        text-align: center;
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAL4AAAAICAYAAABH50X1AAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAD5SURBVFhH7ZjBEYJADEWTCsRO6EDRBixERy/qVY96lT7sQLEjrSBmRwV2Rpgcsl78ewN28rN/HpCESdf8epiR8JKJcr3MhKgi5n1ZrKvwPNWCLnxOwZaFKw6bWPj8LQFhLlLBD93Gcfjsh7+VK15cjuGrPuqQvp0mm7FfWk0k6EauwmcnyKxcBfC1sulcdwV/6JRTFAa6kR3w2QkyK1e94IvIo5xuM6eczOBD18/xPhD+2WeUOjFjKDmc3jlryeEkV4ex6qK5bTmPJtMPQ2uT6af4imTV1QlmvXmlv76cmQd666YQ7FJNdD6HfScJ3R+MjXVyB59bPj8Bd6yIGGSAWukAAAAASUVORK5CYII=) bottom/9.5rem no-repeat;
        margin-bottom: 2.8rem;
        padding-bottom: 1.9rem;
        font-size: 3.2rem;
        font-weight: 800;
        position: relative
    }

    .download__chara {
        width: 10.1rem
    }

    @media (width>=768px) {
        .download {
            padding-block: 11.6rem 0
        }

        .download__heading {
            background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQwAAAAMCAYAAACX+4MnAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAGpSURBVGhD7dpRTsJAEAbgmSjPwk28gRYuoCewPguJvpQz0BdNwGfLCfQCULgBN7E+o1mnxWJNKCw7GwnJ3ycgs8vka2fSbpepctylgxs2HDLRef6zIVoYNslz0B9X4w71Gfnp5OEHP50AkfQGovv0sflplq/y5XLThNI4ZqfcuH4KHjLtH7qMR34uar9j4Ac/X/VbNIzuNE7rmkVJnTeNUTsKdPRuo5Gfm1s5Cn7w81W/3JvEodxnvFiRGroddqLEKtZTEPLTQcIPfmsBD/XLvWk8kwkvLFnnw3a08bHFcvzeYchvb7I/A+AHv4qAun7zhvEuEzYtWTNpGC3LWC9hyE/HCD/4VQTU9cvdySBj5jMbVmPMx6jTt20uNlPujEF+O4m2BsAPfqWAj/rFI4nueiLc8usA4Xdcflj01J0vwqKiDhB+x+VXvFa17PLqBRNXGuTnKrcaBz/4iYCX+l1v3PoyyzeZtO5tyfyEG1eH3LiF/Nwv+nzjFvzg56N+i4ZRHj+3h6EsjhRbw2UxdCH7w5P/3ntRd2qRn/tFX9xprPbc4Pw6MsKP6BsXTVMrIUuOZgAAAABJRU5ErkJggg==);
            background-size: 13.4rem;
            margin-bottom: 3.6rem;
            padding-bottom: 1.8rem;
            font-size: 4.8rem
        }

        .download__chara {
            width: 18.5rem;
            position: absolute;
            top: -6.5rem;
            right: 0
        }
    }

    @media (width<768px) {
        .download__heading {
            line-height: 1.25
        }

        .download__chara {
            margin-inline: auto;
            display: block
        }
    }

    .diagnosis {
        padding-block: 8rem
    }

    .diagnosis__heading {
        font-family: var(--font-rounded);
        color: var(--color-green);
        text-align: center;
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAL4AAAAICAYAAABH50X1AAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAD5SURBVFhH7ZjBEYJADEWTCsRO6EDRBixERy/qVY96lT7sQLEjrSBmRwV2Rpgcsl78ewN28rN/HpCESdf8epiR8JKJcr3MhKgi5n1ZrKvwPNWCLnxOwZaFKw6bWPj8LQFhLlLBD93Gcfjsh7+VK15cjuGrPuqQvp0mm7FfWk0k6EauwmcnyKxcBfC1sulcdwV/6JRTFAa6kR3w2QkyK1e94IvIo5xuM6eczOBD18/xPhD+2WeUOjFjKDmc3jlryeEkV4ex6qK5bTmPJtMPQ2uT6af4imTV1QlmvXmlv76cmQd666YQ7FJNdD6HfScJ3R+MjXVyB59bPj8Bd6yIGGSAWukAAAAASUVORK5CYII=) bottom/9.5rem no-repeat;
        margin-bottom: 2.7rem;
        padding-bottom: 2rem;
        font-size: 3.2rem;
        font-weight: 800;
        position: relative
    }

    @media (width>=768px) {
        .diagnosis {
            padding-block: 10.9rem 8.8rem
        }

        .diagnosis__heading {
            background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQwAAAAMCAYAAACX+4MnAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAGpSURBVGhD7dpRTsJAEAbgmSjPwk28gRYuoCewPguJvpQz0BdNwGfLCfQCULgBN7E+o1mnxWJNKCw7GwnJ3ycgs8vka2fSbpepctylgxs2HDLRef6zIVoYNslz0B9X4w71Gfnp5OEHP50AkfQGovv0sflplq/y5XLThNI4ZqfcuH4KHjLtH7qMR34uar9j4Ac/X/VbNIzuNE7rmkVJnTeNUTsKdPRuo5Gfm1s5Cn7w81W/3JvEodxnvFiRGroddqLEKtZTEPLTQcIPfmsBD/XLvWk8kwkvLFnnw3a08bHFcvzeYchvb7I/A+AHv4qAun7zhvEuEzYtWTNpGC3LWC9hyE/HCD/4VQTU9cvdySBj5jMbVmPMx6jTt20uNlPujEF+O4m2BsAPfqWAj/rFI4nueiLc8usA4Xdcflj01J0vwqKiDhB+x+VXvFa17PLqBRNXGuTnKrcaBz/4iYCX+l1v3PoyyzeZtO5tyfyEG1eH3LiF/Nwv+nzjFvzg56N+i4ZRHj+3h6EsjhRbw2UxdCH7w5P/3ntRd2qRn/tFX9xprPbc4Pw6MsKP6BsXTVMrIUuOZgAAAABJRU5ErkJggg==);
            background-size: 13.4rem;
            margin-bottom: 5.7rem;
            padding-bottom: 1.8rem;
            font-size: 4.8rem
        }
    }

    @media (width<768px) {
        .diagnosis__heading {
            line-height: 1.25
        }
    }

    .check {
        background-image: url(/freelancelaw_2026/assets/check-bg-wave.png), url(/freelancelaw_2026/assets/check-bg.png);
        background-position: 0 100%, top;
        background-repeat: repeat-x, repeat;
        background-size: 100rem, 21.1rem;
        padding-block: 8.3rem 4.7rem
    }

    @media (width>=768px) {
        .check {
            background-size: 160rem, 21.1rem;
            padding-block: 11.1rem 9.5rem
        }
    }

    .faq {
        z-index: 0;
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAADNSURBVGhD7ZjBDYMwFEPJDOzBNl2yTANz0BlohcQlEkKWLUrax5VPiP2cH0hZP1fX8FUQ8GV6cQLj/NokPYb+EmkIqG2GgBg8IkSExMjU5UTINNB+PE7AnpE4AAJEw+LlcQLsxCKj9gk8p2WtP333GByZcaf60ryA9C8li/jvFnE6QqKBdnm8jdozEgdAgGhYvDxOgDYqMoIApxJiZDiVODOMLnTmUHU/3oXE99vlCLAtNAeAABvZ3SLEPiASiS9iCEBAdODn2qipX378DbfmMFQnPx0kAAAAAElFTkSuQmCC) 0 0/1.5rem 1.5rem;
        padding-block: 7.1rem 13.5rem;
        position: relative;
        overflow: hidden
    }

    .faq__heading {
        text-align: center;
        padding-bottom: 3.9rem
    }

    .faq:after {
        content: "";
        clip-path: ellipse(50% 50%);
        background-color: #fef569;
        width: 112.1rem;
        height: 94.4rem;
        position: absolute;
        bottom: -91.7rem;
        left: 50%;
        translate: -50%
    }

    @media (width>=768px) {
        .faq {
            background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAADNSURBVGhD7ZjBDYMwFEPJDOzBNl2yTANz0BlohcQlEkKWLUrax5VPiP2cH0hZP1fX8FUQ8GV6cQLj/NokPYb+EmkIqG2GgBg8IkSExMjU5UTINNB+PE7AnpE4AAJEw+LlcQLsxCKj9gk8p2WtP333GByZcaf60ryA9C8li/jvFnE6QqKBdnm8jdozEgdAgGhYvDxOgDYqMoIApxJiZDiVODOMLnTmUHU/3oXE99vlCLAtNAeAABvZ3SLEPiASiS9iCEBAdODn2qipX378DbfmMFQnPx0kAAAAAElFTkSuQmCC) 0 0/2.4rem 2.4rem;
            padding-block: 15.1rem 18.5rem
        }

        .faq:after {
            width: 237.2rem;
            height: 107.8rem;
            bottom: -92.9rem
        }

        .faq__heading {
            padding-bottom: 5.3rem
        }
    }

    .more {
        z-index: 1;
        background-color: #fef569;
        padding-block: 5.5rem 5.7rem;
        position: relative
    }

    .more__cloud01,
    .more__cloud02,
    .more__cloud03,
    .more__cloud04 {
        z-index: 0;
        position: absolute
    }

    .more__cloud01 {
        width: 18.1rem;
        top: -13rem;
        right: calc(50% + 8rem)
    }

    .more__cloud02 {
        width: 18.4rem;
        top: -8.2rem;
        left: calc(50% + 7.4rem)
    }

    .more__cloud03 {
        width: 23.2rem;
        top: 23.2rem;
        right: calc(50% + 2.5rem)
    }

    .more__cloud04 {
        width: 14.6rem;
        top: 12.7rem;
        left: calc(50% + 11.2rem)
    }

    @media (width>=768px) {
        .more {
            padding-block: 1.5rem 12rem
        }

        .more__cloud01 {
            width: 28.8rem;
            top: -12.2rem;
            right: calc(50% + 64.8rem)
        }

        .more__cloud02 {
            width: 36.9rem;
            top: -1.5rem;
            left: calc(50% + 56.9rem)
        }

        .more__cloud03 {
            width: 36.9rem;
            top: 28rem;
            right: calc(50% + 37.6rem)
        }

        .more__cloud04 {
            width: 23rem;
            top: 28rem;
            left: calc(50% + 40.5rem)
        }
    }
}

@layer utilities {
    .collapse {
        visibility: collapse
    }

    .relative {
        position: relative
    }

    .static {
        position: static
    }

    .z-10 {
        z-index: 10
    }

    .mx-14 {
        margin-inline: calc(var(--spacing) * 14)
    }

    .mx-auto {
        margin-inline: auto
    }

    .mt-12 {
        margin-top: calc(var(--spacing) * 12)
    }

    .mt-20 {
        margin-top: calc(var(--spacing) * 20)
    }

    .mt-24 {
        margin-top: calc(var(--spacing) * 24)
    }

    .mt-28 {
        margin-top: calc(var(--spacing) * 28)
    }

    .mt-30 {
        margin-top: calc(var(--spacing) * 30)
    }

    .mt-35 {
        margin-top: calc(var(--spacing) * 35)
    }

    .mt-40 {
        margin-top: calc(var(--spacing) * 40)
    }

    .mt-42 {
        margin-top: calc(var(--spacing) * 42)
    }

    .mt-45 {
        margin-top: calc(var(--spacing) * 45)
    }

    .mt-56 {
        margin-top: calc(var(--spacing) * 56)
    }

    .mb-20 {
        margin-bottom: calc(var(--spacing) * 20)
    }

    .mb-23 {
        margin-bottom: calc(var(--spacing) * 23)
    }

    .mb-38 {
        margin-bottom: calc(var(--spacing) * 38)
    }

    .mb-40 {
        margin-bottom: calc(var(--spacing) * 40)
    }

    .block {
        display: block
    }

    .flex {
        display: flex
    }

    .grid {
        display: grid
    }

    .hidden {
        display: none
    }

    .table {
        display: table
    }

    .aspect-video {
        aspect-ratio: var(--aspect-video)
    }

    .h-57 {
        height: calc(var(--spacing) * 57)
    }

    .h-80 {
        height: calc(var(--spacing) * 80)
    }

    .min-h-72 {
        min-height: calc(var(--spacing) * 72)
    }

    .min-h-88 {
        min-height: calc(var(--spacing) * 88)
    }

    .w-30 {
        width: calc(var(--spacing) * 30)
    }

    .w-32 {
        width: calc(var(--spacing) * 32)
    }

    .w-78 {
        width: calc(var(--spacing) * 78)
    }

    .w-128 {
        width: calc(var(--spacing) * 128)
    }

    .w-132 {
        width: calc(var(--spacing) * 132)
    }

    .w-140 {
        width: calc(var(--spacing) * 140)
    }

    .w-145 {
        width: calc(var(--spacing) * 145)
    }

    .w-200 {
        width: calc(var(--spacing) * 200)
    }

    .w-211 {
        width: calc(var(--spacing) * 211)
    }

    .w-213 {
        width: calc(var(--spacing) * 213)
    }

    .w-218 {
        width: calc(var(--spacing) * 218)
    }

    .w-250 {
        width: calc(var(--spacing) * 250)
    }

    .w-271 {
        width: calc(var(--spacing) * 271)
    }

    .w-290 {
        width: calc(var(--spacing) * 290)
    }

    .w-458 {
        width: calc(var(--spacing) * 458)
    }

    .w-711 {
        width: calc(var(--spacing) * 711)
    }

    .w-781 {
        width: calc(var(--spacing) * 781)
    }

    .w-full {
        width: 100%
    }

    .max-w-100 {
        max-width: calc(var(--spacing) * 100)
    }

    .max-w-300 {
        max-width: calc(var(--spacing) * 300)
    }

    .max-w-447 {
        max-width: calc(var(--spacing) * 447)
    }

    .max-w-490 {
        max-width: calc(var(--spacing) * 490)
    }

    .max-w-840 {
        max-width: calc(var(--spacing) * 840)
    }

    .max-w-none {
        max-width: none
    }

    .shrink-0 {
        flex-shrink: 0
    }

    .-translate-x-10 {
        --tw-translate-x: calc(var(--spacing) * -10);
        translate: var(--tw-translate-x) var(--tw-translate-y)
    }

    .transform {
        transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, )
    }

    .resize {
        resize: both
    }

    .scrollbar-none {
        scrollbar-width: none
    }

    .grid-cols-1 {
        grid-template-columns: repeat(1, minmax(0, 1fr))
    }

    .grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .flex-wrap {
        flex-wrap: wrap
    }

    .items-center {
        align-items: center
    }

    .justify-center {
        justify-content: center
    }

    .gap-15 {
        gap: calc(var(--spacing) * 15)
    }

    .gap-20 {
        gap: calc(var(--spacing) * 20)
    }

    .gap-x-9 {
        column-gap: calc(var(--spacing) * 9)
    }

    .gap-x-12 {
        column-gap: calc(var(--spacing) * 12)
    }

    .gap-x-17 {
        column-gap: calc(var(--spacing) * 17)
    }

    .gap-x-20 {
        column-gap: calc(var(--spacing) * 20)
    }

    .gap-x-24 {
        column-gap: calc(var(--spacing) * 24)
    }

    .gap-x-30 {
        column-gap: calc(var(--spacing) * 30)
    }

    .gap-x-36 {
        column-gap: calc(var(--spacing) * 36)
    }

    .gap-x-39 {
        column-gap: calc(var(--spacing) * 39)
    }

    .gap-x-40 {
        column-gap: calc(var(--spacing) * 40)
    }

    .gap-x-54 {
        column-gap: calc(var(--spacing) * 54)
    }

    .gap-x-55 {
        column-gap: calc(var(--spacing) * 55)
    }

    .gap-x-60 {
        column-gap: calc(var(--spacing) * 60)
    }

    .gap-x-70 {
        column-gap: calc(var(--spacing) * 70)
    }

    .gap-x-80 {
        column-gap: calc(var(--spacing) * 80)
    }

    .gap-y-8 {
        row-gap: calc(var(--spacing) * 8)
    }

    .gap-y-10 {
        row-gap: calc(var(--spacing) * 10)
    }

    .gap-y-11 {
        row-gap: calc(var(--spacing) * 11)
    }

    .gap-y-15 {
        row-gap: calc(var(--spacing) * 15)
    }

    .gap-y-16 {
        row-gap: calc(var(--spacing) * 16)
    }

    .gap-y-20 {
        row-gap: calc(var(--spacing) * 20)
    }

    .gap-y-30 {
        row-gap: calc(var(--spacing) * 30)
    }

    .gap-y-36 {
        row-gap: calc(var(--spacing) * 36)
    }

    .gap-y-40 {
        row-gap: calc(var(--spacing) * 40)
    }

    .self-end {
        align-self: flex-end
    }

    .border {
        border-style: var(--tw-border-style);
        border-width: 1px
    }

    .bg-\[\#EEF8FF\] {
        background-color: #eef8ff
    }

    .bg-\[\#FEFDE7\] {
        background-color: #fefde7
    }

    .bg-green {
        background-color: var(--color-green)
    }

    .bg-navy {
        background-color: var(--color-navy)
    }

    .bg-orange {
        background-color: var(--color-orange)
    }

    .px-16 {
        padding-inline: calc(var(--spacing) * 16)
    }

    .px-gutter {
        padding-inline: var(--spacing-gutter)
    }

    .py-11 {
        padding-block: calc(var(--spacing) * 11)
    }

    .py-45 {
        padding-block: calc(var(--spacing) * 45)
    }

    .pt-22 {
        padding-top: calc(var(--spacing) * 22)
    }

    .pt-24 {
        padding-top: calc(var(--spacing) * 24)
    }

    .pt-27 {
        padding-top: calc(var(--spacing) * 27)
    }

    .pt-58 {
        padding-top: calc(var(--spacing) * 58)
    }

    .pb-2 {
        padding-bottom: calc(var(--spacing) * 2)
    }

    .pb-17 {
        padding-bottom: calc(var(--spacing) * 17)
    }

    .text-center {
        text-align: center
    }

    .text-16 {
        font-size: var(--text-16)
    }

    .text-18 {
        font-size: var(--text-18)
    }

    .text-22 {
        font-size: var(--text-22)
    }

    .text-24 {
        font-size: var(--text-24)
    }

    .text-32 {
        font-size: var(--text-32)
    }

    .leading-\[1\.0625\] {
        --tw-leading: 1.0625;
        line-height: 1.0625
    }

    .leading-\[1\.4444\] {
        --tw-leading: 1.4444;
        line-height: 1.4444
    }

    .leading-none {
        --tw-leading: 1;
        line-height: 1
    }

    .leading-normal {
        --tw-leading: var(--leading-normal);
        line-height: var(--leading-normal)
    }

    .font-bold {
        --tw-font-weight: var(--font-weight-bold);
        font-weight: var(--font-weight-bold)
    }

    .tracking-normal {
        --tw-tracking: var(--tracking-normal);
        letter-spacing: var(--tracking-normal)
    }

    .text-navy {
        color: var(--color-navy)
    }

    .text-orange {
        color: var(--color-orange)
    }

    .text-white {
        color: var(--color-white)
    }

    .underline {
        text-decoration-line: underline
    }

    .outline {
        outline-style: var(--tw-outline-style);
        outline-width: 1px
    }

    .transition {
        transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
        transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
        transition-duration: var(--tw-duration, var(--default-transition-duration))
    }

    @media (hover:hover) {
        .hover\:no-underline:hover {
            text-decoration-line: none
        }

        .hover\:opacity-70:hover {
            opacity: .7
        }
    }

    @media not all and (width>=768px) {
        .max-md\:-mx-3 {
            margin-inline: calc(var(--spacing) * -3)
        }

        .max-md\:mx-16 {
            margin-inline: calc(var(--spacing) * 16)
        }

        .max-md\:mx-auto {
            margin-inline: auto
        }

        .max-md\:-mt-22 {
            margin-top: calc(var(--spacing) * -22)
        }

        .max-md\:mt-30 {
            margin-top: calc(var(--spacing) * 30)
        }

        .max-md\:hidden {
            display: none
        }

        .max-md\:w-115 {
            width: calc(var(--spacing) * 115)
        }

        .max-md\:w-129 {
            width: calc(var(--spacing) * 129)
        }

        .max-md\:w-170 {
            width: calc(var(--spacing) * 170)
        }

        .max-md\:w-183 {
            width: calc(var(--spacing) * 183)
        }

        .max-md\:w-184 {
            width: calc(var(--spacing) * 184)
        }

        .max-md\:w-226 {
            width: calc(var(--spacing) * 226)
        }

        .max-md\:w-229 {
            width: calc(var(--spacing) * 229)
        }

        .max-md\:flex-col {
            flex-direction: column
        }

        .max-md\:px-16 {
            padding-inline: calc(var(--spacing) * 16)
        }

        .max-md\:px-gutter {
            padding-inline: var(--spacing-gutter)
        }

        .max-md\:text-center {
            text-align: center
        }
    }

    @media (width>=768px) {
        .md\:absolute {
            position: absolute
        }

        .md\:top-84 {
            top: calc(var(--spacing) * 84)
        }

        .md\:right-40 {
            right: calc(var(--spacing) * 40)
        }

        .md\:mx-40 {
            margin-inline: calc(var(--spacing) * 40)
        }

        .md\:mt-28 {
            margin-top: calc(var(--spacing) * 28)
        }

        .md\:mt-30 {
            margin-top: calc(var(--spacing) * 30)
        }

        .md\:mt-33 {
            margin-top: calc(var(--spacing) * 33)
        }

        .md\:mt-40 {
            margin-top: calc(var(--spacing) * 40)
        }

        .md\:mt-56 {
            margin-top: calc(var(--spacing) * 56)
        }

        .md\:mt-60 {
            margin-top: calc(var(--spacing) * 60)
        }

        .md\:mt-67 {
            margin-top: calc(var(--spacing) * 67)
        }

        .md\:mt-80 {
            margin-top: calc(var(--spacing) * 80)
        }

        .md\:mb-26 {
            margin-bottom: calc(var(--spacing) * 26)
        }

        .md\:mb-30 {
            margin-bottom: calc(var(--spacing) * 30)
        }

        .md\:mb-50 {
            margin-bottom: calc(var(--spacing) * 50)
        }

        .md\:mb-60 {
            margin-bottom: calc(var(--spacing) * 60)
        }

        .md\:hidden {
            display: none
        }

        .md\:h-88 {
            height: calc(var(--spacing) * 88)
        }

        .md\:min-h-80 {
            min-height: calc(var(--spacing) * 80)
        }

        .md\:w-138 {
            width: calc(var(--spacing) * 138)
        }

        .md\:w-254 {
            width: calc(var(--spacing) * 254)
        }

        .md\:w-264 {
            width: calc(var(--spacing) * 264)
        }

        .md\:max-w-190 {
            max-width: calc(var(--spacing) * 190)
        }

        .md\:max-w-498 {
            max-width: calc(var(--spacing) * 498)
        }

        .md\:grid-cols-2 {
            grid-template-columns: repeat(2, minmax(0, 1fr))
        }

        .md\:grid-cols-3 {
            grid-template-columns: repeat(3, minmax(0, 1fr))
        }

        .md\:grid-cols-4 {
            grid-template-columns: repeat(4, minmax(0, 1fr))
        }

        .md\:grid-cols-\[1fr_14\.5rem\] {
            grid-template-columns: 1fr 14.5rem
        }

        .md\:grid-cols-\[1fr_14rem\] {
            grid-template-columns: 1fr 14rem
        }

        .md\:grid-cols-\[1fr_16\.5rem\] {
            grid-template-columns: 1fr 16.5rem
        }

        .md\:grid-cols-\[1fr_18\.1rem\] {
            grid-template-columns: 1fr 18.1rem
        }

        .md\:grid-cols-\[1fr_21\.1rem\] {
            grid-template-columns: 1fr 21.1rem
        }

        .md\:grid-cols-\[1fr_21\.3rem\] {
            grid-template-columns: 1fr 21.3rem
        }

        .md\:grid-cols-\[1fr_21\.8rem\] {
            grid-template-columns: 1fr 21.8rem
        }

        .md\:grid-cols-\[1fr_22\.9rem\] {
            grid-template-columns: 1fr 22.9rem
        }

        .md\:grid-cols-\[1fr_25\.3rem\] {
            grid-template-columns: 1fr 25.3rem
        }

        .md\:grid-cols-\[1fr_26\.3rem\] {
            grid-template-columns: 1fr 26.3rem
        }

        .md\:grid-cols-\[1fr_30\.1rem\] {
            grid-template-columns: 1fr 30.1rem
        }

        .md\:gap-20 {
            gap: calc(var(--spacing) * 20)
        }

        .md\:gap-x-12 {
            column-gap: calc(var(--spacing) * 12)
        }

        .md\:gap-x-24 {
            column-gap: calc(var(--spacing) * 24)
        }

        .md\:gap-x-50 {
            column-gap: calc(var(--spacing) * 50)
        }

        .md\:gap-y-8 {
            row-gap: calc(var(--spacing) * 8)
        }

        .md\:gap-y-16 {
            row-gap: calc(var(--spacing) * 16)
        }

        .md\:self-end {
            align-self: flex-end
        }

        .md\:p-33 {
            padding: calc(var(--spacing) * 33)
        }

        .md\:py-13 {
            padding-block: calc(var(--spacing) * 13)
        }

        .md\:py-80 {
            padding-block: calc(var(--spacing) * 80)
        }

        .md\:pt-53 {
            padding-top: calc(var(--spacing) * 53)
        }

        .md\:pt-118 {
            padding-top: calc(var(--spacing) * 118)
        }

        .md\:pr-8 {
            padding-right: calc(var(--spacing) * 8)
        }

        .md\:pr-15 {
            padding-right: calc(var(--spacing) * 15)
        }

        .md\:pr-20 {
            padding-right: calc(var(--spacing) * 20)
        }

        .md\:pr-40 {
            padding-right: calc(var(--spacing) * 40)
        }

        .md\:pr-44 {
            padding-right: calc(var(--spacing) * 44)
        }

        .md\:pr-55 {
            padding-right: calc(var(--spacing) * 55)
        }

        .md\:pr-65 {
            padding-right: calc(var(--spacing) * 65)
        }

        .md\:pb-50 {
            padding-bottom: calc(var(--spacing) * 50)
        }

        .md\:pb-73 {
            padding-bottom: calc(var(--spacing) * 73)
        }

        .md\:text-18 {
            font-size: var(--text-18)
        }

        .md\:text-22 {
            font-size: var(--text-22)
        }

        .md\:text-26 {
            font-size: var(--text-26)
        }

        .md\:text-27 {
            font-size: var(--text-27)
        }

        .md\:text-28 {
            font-size: var(--text-28)
        }

        .md\:text-40 {
            font-size: var(--text-40)
        }

        .md\:tracking-normal {
            --tw-tracking: var(--tracking-normal);
            letter-spacing: var(--tracking-normal)
        }
    }

    .object-cover-full {
        object-fit: cover;
        width: 100%;
        height: 100%
    }

    .object-contain-full {
        object-fit: contain;
        width: 100%;
        height: 100%
    }
}

:root,
:host {
    --breakpoint-xs: 480px;
    --font-sans: "Noto Sans JP", sans-serif;
    --font-latin: "Roboto", sans-serif;
    --font-rounded: "M PLUS Rounded 1c", sans-serif;
    --font-mono: ui-monospace, sfmono-regular, menlo, monaco, monospace;
    --color-primary: #fe6001;
    --color-body: #3e3e3e;
    --color-white: #fff;
    --color-orange: #fe6001;
    --color-green: #009838;
    --color-yellow: #fced63;
    --color-movie-bg: #faf788;
    --color-navy: #2445a6;
    --spacing-gutter: 2rem;
    --spacing: .1rem;
    --leading-normal: 1.625;
    --tracking-normal: .03em;
    --text-16: 1.6rem;
    --text-18: 1.8rem;
    --text-22: 2.2rem;
    --text-24: 2.4rem;
    --text-26: 2.6rem;
    --text-27: 2.7rem;
    --text-28: 2.8rem;
    --text-32: 3.2rem;
    --text-40: 4rem;
    --font-weight-bold: 700;
    --aspect-video: 16 / 9;
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono)
}

@property --tw-translate-x {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-translate-y {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-translate-z {
    syntax: "*";
    inherits: false;
    initial-value: 0
}

@property --tw-rotate-x {
    syntax: "*";
    inherits: false
}

@property --tw-rotate-y {
    syntax: "*";
    inherits: false
}

@property --tw-rotate-z {
    syntax: "*";
    inherits: false
}

@property --tw-skew-x {
    syntax: "*";
    inherits: false
}

@property --tw-skew-y {
    syntax: "*";
    inherits: false
}

@property --tw-border-style {
    syntax: "*";
    inherits: false;
    initial-value: solid
}

@property --tw-leading {
    syntax: "*";
    inherits: false
}

@property --tw-font-weight {
    syntax: "*";
    inherits: false
}

@property --tw-tracking {
    syntax: "*";
    inherits: false
}

@property --tw-outline-style {
    syntax: "*";
    inherits: false;
    initial-value: solid
}

@keyframes markey {
    0% {
        background-position: 0 0
    }

    to {
        background-position: 0 100%
    }
}

@keyframes markey-h {
    0% {
        background-position: 0 0
    }

    to {
        background-position: 100% 0
    }
}

/*$vite$:1*/


