/* Start Header CSS */
.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    box-sizing: border-box;
    display: flex;
    z-index: 96;
    display: flex;
    flex-direction: column;
}
.header::after {
    content: "";
    height: calc(1 * 100vw / 1920);
    width: 100%;
    background: var(--main-gra-nz);
}
.header-pc-grid {
    width: 100%;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: auto 1fr auto;
    grid-template-rows: 1fr;
    min-height: calc(88 * var(--vw-with-scrollbar) / 1920);
    padding: 0 calc(25 * var(--vw-with-scrollbar) / 1920);
    align-items: center;
    background-color: var(--base-color);
}
.header-pc-grid__left-link {
    display: flex;
    align-items: center;
    gap: calc(4 * var(--vw-with-scrollbar) / 1920);
    align-items: center;
}
.header-pc-grid__left-link-icon {
    width: calc(66.51 * var(--vw-with-scrollbar) / 1920);
    height: auto;
}
.header-pc-grid__left-link-text {
    background: var(--main-gra-nz);
    font-weight: 900;
    font-size: clamp(16px, calc(24 * var(--vw-with-scrollbar) / 1920), 99px);
}
.header-pc-grid-right {
    display: flex;
    align-self: stretch;
    align-items: center;
    gap: calc(31 * var(--vw-with-scrollbar) / 1920);
}
.header-pc-grid-right .silver-pill-btn {
    width: calc(189 * var(--vw-with-scrollbar) / 1920);
}
.header-pc-grid-trigger__wrapper {
    display: flex;
    width: calc(88 * var(--vw-with-scrollbar) / 1920);
    aspect-ratio: 1;
    box-sizing: border-box;
    padding: calc(30.5 * var(--vw-with-scrollbar) / 1920)
        calc(16.5 * var(--vw-with-scrollbar) / 1920);
}
.header-pc-grid-trigger {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.header-pc-grid-trigger > div {
    height: calc(3 * 100vw / 1920);
    background: var(--main-gra-nz);
    flex-shrink: 0;
}
.header-pc-grid-nav {
    display: flex;
    flex-direction: row-reverse;
    padding-right: calc(12 * var(--vw-with-scrollbar) / 1920);
    align-items: center;
    justify-content: end;
}
.header-pc-grid-nav-item {
    padding: calc(10.4 * var(--vw-with-scrollbar) / 1920)
        calc(16.3 * var(--vw-with-scrollbar) / 1920);
}
.header-pc-grid-nav-item:nth-child(2) {
    padding-right: calc(10.2 * var(--vw-with-scrollbar) / 1920);
}
.header-pc-grid-nav-item__text {
    font-size: clamp(14px, calc(16 * var(--vw-with-scrollbar) / 1920), 99px);
    color: transparent;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
    background: var(--main-gra-nz);
    line-height: 1;
    font-weight: bold;
}
.header-pc-grid-nav-item--has-sub-menu {
    position: relative;
    padding: calc(10.4 * var(--vw-with-scrollbar) / 1920)
        calc(26.3 * var(--vw-with-scrollbar) / 1920);
}
.header-pc-grid-nav-item--has-sub-menu > a {
    display: flex;
    align-items: center;
    gap: calc(4 * var(--vw-with-scrollbar) / 1920);
}
.header-pc-grid-nav-item--has-sub-menu > a::after {
    content: "";
    width: calc(15 * var(--vw-with-scrollbar) / 1920);
    height: calc(9 * var(--vw-with-scrollbar) / 1920);
    background-image: url(../img/chevron-down.svg);
    background-size: contain;
    background-repeat: no-repeat;
    transition: transform 0.3s ease-in-out;
}
.header-pc-grid-nav-item--has-sub-menu:hover > a::after {
    transform: rotate(180deg);
}
.header-pc-grid-nav-item--has-sub-menu:hover .header-pc-grid-nav-dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
}
.header-pc-grid-nav-dropdown {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    display: flex;
    position: absolute;
    top: 100%;
    right: calc(-4 * var(--vw-with-scrollbar) / 1920);
    width: calc(216 * var(--vw-with-scrollbar) / 1920);
    background: var(--main-gra-nz);
    box-sizing: border-box;
    padding: calc(1 * 100vw / 1920);
    padding-top: 0;
    transition: opacity 0.4s ease-in-out, visibility 0.4s ease-in-out;
}
.header-pc-grid-nav-dropdown ul {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: calc(6 * var(--vw-with-scrollbar) / 1920)
        calc(9 * var(--vw-with-scrollbar) / 1920);
    background-color: var(--base-color);
}
.header-pc-grid-nav-dropdown li {
    padding: calc(10.4 * var(--vw-with-scrollbar) / 1920) 0;
}
.header-pc-grid-nav-dropdown li a {
    font-size: clamp(14px, calc(16 * var(--vw-with-scrollbar) / 1920), 99px);
    color: transparent;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
    background: var(--main-gra-nz);
    line-height: 1;
    font-weight: bold;
}

.header-pc-nav {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    background-color: var(--base-color);
    z-index: 98;
    visibility: hidden;
    pointer-events: none;
    -webkit-mask-image: url('circle-mask.svg');
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: top right;
    -webkit-mask-size: 0 0;

    mask-image: url('../img/circle-mask.svg');
    mask-repeat: no-repeat;
    mask-position: top right;
    mask-size: 0 0;

    transition: mask-size 1s ease, -webkit-mask-size 1s ease, visibility 1s ease-in-out;
}
.header-pc-nav-open .header-pc-nav {
    pointer-events: all;
    visibility: visible;
    -webkit-mask-size: 150vmax 150vmax; /* huge circle to cover screen */
    mask-size: 150vmax 150vmax;
}

.header-pc-nav-inner {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: hidden;
}
.header-pc-nav-open .header-pc-nav-inner {
    overflow-y: scroll;
}
.header-pc-nav-top {
    display: flex;
    justify-content: end;
    align-items: center;
    padding-right: calc(130 * var(--vw-with-scrollbar) / 1920);
    min-height: calc(100 * var(--vw-with-scrollbar) / 1920);
    border-bottom: calc(1 * 100vw / 1920) solid var(--sub-color);
}
.header-pc-nav-trigger {
    position: relative;
    display: flex;
    flex-direction: column;
    height: calc(46.7 * var(--vw-with-scrollbar) / 1920);
    aspect-ratio: 1;
}
.header-pc-nav-trigger::before,
.header-pc-nav-trigger::after {
    position: absolute;
    width: calc(56 * var(--vw-with-scrollbar) / 1920);
    top: 50%;
    left: 50%;
    content: "";
    height: calc(3 * var(--vw-with-scrollbar) / 1920);
    background: var(--main-gra-nz);
    transform-origin: center;
    translate: -50% -50%;
}
.header-pc-nav-trigger::before {
    transform: rotate(45deg);
}
.header-pc-nav-trigger::after {
    transform: rotate(-45deg);
}
.header-pc-nav .back-to-top-btn {
    display: none;
}
.header-pc-nav .grow-in-italic {
    animation: unset;
    transform: scale(1) matrix(1, 0, -0.24, 0.97, 0, 0);
}

.header-sp-grid__left-link-icon {
    width: calc(90 * var(--vw-with-scrollbar) / 1024);
}

@media (max-width: 1070px) {
    .footer-pc-nav-grid {
        grid-template-columns: calc(495 * var(--vw-with-scrollbar) / 1920) 1fr calc(
                545 * var(--vw-with-scrollbar) / 1920
            );
    }
}

@media (max-width: 1024px) {
    .header {
        position: sticky;
        z-index: 99;
    }
    .header::after {
        height: calc(1 * 100vw / 400);
    }
    .header-sp {
        width: 100%;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: calc(20 * 100vw / 400) calc(14 * 100vw / 400);
        background-color: var(--base-color);
    }
    .header-sp-logo {
        font-size: calc(20 * 100vw / 400);
        font-weight: 900;
        background: var(--main-gra-nz);
    }
    .header-sp-trigger {
        position: relative;
        width: calc(31 * 100vw / 400);
        height: calc(23 * 100vw / 400);
        background-color: var(--main-gra-nz);
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        overflow: visible;
        z-index: 99;
    }
    .header-sp-trigger__line {
        position: absolute;
        width: 100%;
        height: calc(3 * 100vw / 400);
        background: var(--main-gra-nz);
        z-index: 99;
    }
    .header-sp-trigger__line:nth-child(1) {
        top: 0;
    }
    .header-sp-trigger__line:nth-child(2) {
        top: 50%;
        translate: 0 -50%;
        transition: opacity 0.3s ease-in-out;
    }
    .header-sp-trigger__line:nth-child(3) {
        bottom: 0;
    }
    .header-sp-trigger__line:nth-child(1),
    .header-sp-trigger__line:nth-child(3) {
        transition: transform 0.3s ease-in-out, background 0.3s ease-in-out;
    }
    .header-sp-nav-open .header-sp-trigger__line:nth-child(2) {
        opacity: 0;
    }
    .header-sp-nav-open .header-sp-trigger__line:nth-child(1) {
        top: 50%;
        translate: 0 -50%;
        background: var(--base-color);
        transform: rotate(45deg);
    }
    .header-sp-nav-open .header-sp-trigger__line:nth-child(3) {
        top: 50%;
        translate: 0 -50%;
        background: var(--base-color);
        transform: rotate(-45deg);
    }
    .header-sp-nav {
        position: fixed;
        inset: 0;
        z-index: 98;
        padding-top: calc(21 * 100vw / 400);
        padding-bottom: calc(23 * 100vw / 400);
        padding-left: calc(24 * 100vw / 400);
        padding-right: calc(24 * 100vw / 400);
        visibility: hidden;
        pointer-events: none;
        opacity: 0;
        transition: visibility 1s cubic-bezier(0.2, 1, 0.21, 1),
            opacity 1s cubic-bezier(0.2, 1, 0.21, 1);
    }
    .header-sp-nav::before {
        background: var(--main-gra-nz);
    }
    .header-sp-nav-decoration {
        position: absolute;
        top: 0;
        right: 0;
        z-index: 2;
        width: calc(61 * 100vw / 400);
        height: calc(60 * 100vw / 400);
        background-image: url(../img/header-sp-nav-overlay.png);
        background-size: contain;
        background-repeat: no-repeat;
    }

    .header-sp-nav-inner {
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
        width: 100%;
        height: 100%;
        overflow-y: scroll;
        box-shadow: 0px 4px 14px rgba(0, 0, 0, 0.25);
        background-color: var(--base-color);
        visibility: hidden;
        transform: scaleX(0);
        opacity: 0;
        transform-origin: right;
        transition: opacity 0.3s 0s,
            transform 1s 0s cubic-bezier(0.2, 1, 0.21, 1), visibility 0.3s 0s;
    }
    .header-sp-nav-top {
        display: flex;
        position: relative;
        overflow: hidden;
        min-height: calc(181 * 100vw / 400);
    }
    .header-sp-nav-top > span {
        position: absolute;
        font-family: var(--font-shippori-antique);
        background: var(--common-title-gra);
        color: transparent;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        -webkit-background-clip: text;
        transform: matrix(1, 0, -0.24, 0.97, 0, 0);
        white-space: nowrap;
        line-height: 0.89;
        letter-spacing: -0.17em;
        font-size: calc(59 * 100vw / 400);
    }
    .header-sp-nav-top > span:nth-child(1) {
        top: calc(-18 * 100vw / 400);
        left: calc(-10 * 100vw / 400);
        font-size: calc(83.13 * 100vw / 400);
        line-height: 1;
        letter-spacing: -0.12em;
    }
    .header-sp-nav-top > span:nth-child(1) > span:nth-child(1) {
        letter-spacing: -0.25em;
    }
    .header-sp-nav-top > span:nth-child(2) {
        top: calc(58 * 100vw / 400);
        left: calc(-6.55 * 100vw / 400);
        width: calc(255 * 100vw / 400);
    }
    .header-sp-nav-top > span:nth-child(3) {
        bottom: calc(10.57 * 100vw / 400);
        left: calc(-6.55 * 100vw / 400);
    }
    .header-sp-nav-top > span:nth-child(2),
    .header-sp-nav-top > span:nth-child(3) {
        height: calc(60 * 100vw / 400);
    }

    .header-sp-nav-content {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        box-sizing: border-box;
        padding: calc(19 * 100vw / 400) calc(10 * 100vw / 400);
        padding-top: 0;
    }

    .header-sp-nav-link-list__wrapper {
        padding: calc(14 * 100vw / 400) 0;
        border-bottom: calc(1 * 100vw / 400) solid var(--sub-color);
    }

    .header-sp-nav .link-list__sublink-list {
        gap: calc(12 * 100vw / 400);
    }

    .header-sp-nav-bottom {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-top: calc(10 * 100vw / 400);
        margin-bottom: calc(19 * 100vw / 400);
        gap: calc(10 * 100vw / 400);
    }

    .header-sp-nav-bottom__logo {
        width: fit-content;
        height: calc(40 * 100vw / 400);
    }
    .header-sp-nav-bottom__logo img {
        width: auto;
        height: 100%;
        object-fit: contain;
    }
    .header-sp-nav-bottom .silver-pill-btn {
        width: 100%;
        max-width: calc(314 * 100vw / 400);
        box-shadow: 0px calc(4 * 100vw / 400) calc(10 * 100vw / 400)
            rgba(0, 0, 0, 0.25);
    }

    .header-sp-nav-open .header-sp-nav {
        visibility: visible;
        pointer-events: all;
        opacity: 1;
    }
    .header-sp-nav-open .header-sp-nav-inner {
        transform: scaleX(1);
        visibility: visible;
        opacity: 1;
    }
    .header-sp-nav-open .header::after {
        display: none;
    }
    .header-sp-nav-open .header-sp {
        pointer-events: none;
        background-color: transparent;
    }
    .header-sp-nav-open .header-sp-logo {
        visibility: hidden;
    }
    .header-sp-nav-open .header-sp-trigger {
        pointer-events: all;
    }
}

/* End Header CSS */
/* Start Footer CSS */
.footer {
    display: flex;
    flex-direction: column;
}
.footer-pc-nav {
    display: flex;
    flex-direction: column;
    background-color: var(--base-color);
}
.footer-pc-nav-grid {
    display: grid;
    grid-template-columns: calc(534 * var(--vw-with-scrollbar) / 1920) 1fr calc(
            534 * var(--vw-with-scrollbar) / 1920
        );
    grid-template-rows: auto;
    border-bottom: calc(1 * var(--vw-with-scrollbar) / 1920) solid
        var(--sub-color);
}
.footer-pc-nav-grid-right {
    background-image: url(../img/footer/footer-nav-img.webp);
    background-size: cover;
    background-repeat: no-repeat;
}
.footer-pc-nav-grid-left {
    height: 100%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: space-between;
    padding-top: calc(50 * var(--vw-with-scrollbar) / 1920);
    padding-left: calc(29 * var(--vw-with-scrollbar) / 1920);
    padding-right: calc(31 * var(--vw-with-scrollbar) / 1920);
    padding-bottom: calc(70 * var(--vw-with-scrollbar) / 1920);
}
.footer-pc-nav-grid-left-link {
    display: flex;
    align-items: center;
    gap: calc(23 * var(--vw-with-scrollbar) / 1920);
}
.footer-pc-nav-grid-left-link__icon {
    width: calc(110 * var(--vw-with-scrollbar) / 1920);
    height: auto;
}
.footer-pc-nav-grid-left-link__text-wrapper {
    display: flex;
}
.footer-pc-nav-grid-left-link__text {
    font-size: calc(32.32 * var(--vw-with-scrollbar) / 1920);
    font-weight: 900;
    background: var(--main-gra-nz);
    line-height: 1.2;
}
.footer-pc-nav-grid-left-contact {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: calc(25 * var(--vw-with-scrollbar) / 1920);
}
.footer-pc-nav-grid-left-contact__text {
    font-size: clamp(14px, calc(16 * var(--vw-with-scrollbar) / 1920), 99px);
    font-weight: 700;
    line-height: 1;
    background: var(--main-gra-nz);
}
.footer-pc-nav-grid-center {
    border-left: calc(1 * var(--vw-with-scrollbar) / 1920) solid transparent;
    border-right: calc(1 * var(--vw-with-scrollbar) / 1920) solid transparent;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto;
    gap: calc(1 * var(--vw-with-scrollbar) / 1920);
    background: var(--main-gra-nz);
}
.footer-pc-nav-grid-item {
    padding: calc(32 * var(--vw-with-scrollbar) / 1920)
        calc(40 * var(--vw-with-scrollbar) / 1920);
    background-color: var(--base-color);
}
.footer-pc-nav-grid-item--tall {
    grid-column: 1;
    grid-row: 3 / 5;
    padding-bottom: calc(122 * var(--vw-with-scrollbar) / 1920);
}
.footer-pc-nav-grid-item:nth-child(1),
.footer-pc-nav-grid-item:nth-child(2) {
    padding: calc(48.5 * var(--vw-with-scrollbar) / 1920)
        calc(40 * var(--vw-with-scrollbar) / 1920);
}
.footer-pc-nav-grid-item:nth-child(1) .link-list::before,
.footer-pc-nav-grid-item:nth-child(2) .link-list::before {
    top: 50%;
    transform: translateY(-50%);
}

.footer-pc-nav-bottom {
    position: relative;
    height: calc(300 * var(--vw-with-scrollbar) / 1920);
    overflow: hidden;
	padding-bottom: 20px;
}
.footer-pc-nav-bottom > * {
    position: absolute;
}
.back-to-top-btn {
    top: calc(33 * var(--vw-with-scrollbar) / 1920);
    right: calc(100 * var(--vw-with-scrollbar) / 1920);
    line-height: 1;
    font-size: calc(36 * var(--vw-with-scrollbar) / 1920);
    font-weight: 700;
    background: var(--main-gra-nz);
}
.footer-pc-nav-bottom span {
    font-family: var(--font-shippori-antique);
    font-size: calc(173.13 * var(--vw-with-scrollbar) / 1920);
    font-weight: normal;
    line-height: 1;
    color: transparent;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
    background: var(--common-title-gra);
    background-size: cover;
    transform: matrix(1, 0, -0.24, 0.97, 0, 0);
}
.footer-pc-nav-bottom > span::before {
    background: transparent;
}
.footer-pc-nav-bottom__top-text {
    top: calc(-8 * var(--vw-with-scrollbar) / 1920);
    left: 0;
    letter-spacing: -0.12em;
}

.footer-pc-nav-bottom__top-text > span {
    letter-spacing: -0.25em;
}

.footer-pc-nav-bottom__bottom-text {
    bottom: calc(-8 * var(--vw-with-scrollbar) / 1920);
    left: calc(20 * var(--vw-with-scrollbar) / 1920);
    white-space: nowrap;
    display: flex;
	padding-bottom: 20px;
}
.footer-pc-nav-bottom__bottom-text > span {
    letter-spacing: -0.11em;
    margin-right: -0.11em;
}
.footer-pc-nav-bottom__bottom-text > span:nth-child(1) {
    width: calc(790 * var(--vw-with-scrollbar) / 1920);
}
.footer-pc-nav-bottom__bottom-text > span:nth-child(2) {
    width: calc(328 * var(--vw-with-scrollbar) / 1920);
}
.footer-pc-nav-bottom__bottom-text > span:nth-child(3) {
    width: calc(944 * var(--vw-with-scrollbar) / 1920);
}

@media (max-width: 1024px) {
    .footer-sp {
        position: relative;
        display: flex;
        flex-direction: column;
        padding: calc(30 * 100vw / 400) calc(24 * 100vw / 400);
        padding-bottom: calc(57 * 100vw / 400);
        overflow: hidden;
        background-color: var(--base-color);
    }
    .footer-sp-top {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: calc(10 * 100vw / 400);
        margin-bottom: calc(20 * 100vw / 400);
    }
    .footer-sp-top-link {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: calc(10 * 100vw / 400);
    }
    .footer-sp-top-link__icon {
        width: calc(125 * 100vw / 400);
        height: auto;
    }
    .footer-sp-top-link__text {
        font-size: calc(24 * 100vw / 400);
        font-weight: 900;
        background: var(--main-gra-nz);
        transform: var(--italic-effect);
    }
    .footer-sp-top__contact {
        font-size: calc(16 * 100vw / 400);
        font-weight: 700;
        background: var(--main-gra-nz);
        text-align: center;
        line-height: 1.1875;
    }
    .footer-sp-site-map {
        display: flex;
        flex-direction: column;
    }
    .footer-sp-site-map__item {
        padding: calc(16 * 100vw / 400) 0;
        border-bottom: calc(1 * 100vw / 400) solid var(--sub-color);
    }
    .footer-sp-bottom-img {
        width: 100%;
        height: auto;
        object-fit: contain;
    }
    .footer-sp-decoration {
        position: absolute;
        left: 0;
        bottom: 0;
        display: flex;
        flex-direction: column;
        align-items: start;
    }
    .footer-sp-decoration > span {
        font-family: var(--font-shippori-antique);
        font-weight: normal;
        line-height: 1;
        color: transparent;
        background-clip: text !important;
        -webkit-background-clip: text !important;
        -webkit-text-fill-color: transparent;
        background: var(--common-title-gra);
        transform: matrix(1, 0, -0.24, 0.97, 0, 0);
    }
    .footer-sp-decoration-top {
        font-size: calc(73.13 * 100vw / 400);
        letter-spacing: -0.12em;
    }
    .footer-sp-decoration-top > span:nth-child(1) {
        letter-spacing: -0.25em;
    }
    .footer-sp-decoration-bottom {
        width: calc(414 * 100vw / 400);
        font-size: calc(57 * 100vw / 400);
        letter-spacing: -0.17em;
        white-space: nowrap;
        line-height: 0.89;
    }
    .footer-sp-decoration-bottom > div {
        display: inline-block;
        -webkit-text-fill-color: #093881;
        color: #093881;
    }
    .footer-sp-contact {
        padding: calc(10 * 100vw / 400) calc(24 * 100vw / 400);
        margin-bottom: calc(30 * 100vw / 400);
    }
}
/* End Footer CSS */
/* Start Footer Contact CSS */
.footer-contact {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
    width: 100%;
    min-height: calc(630 * var(--vw-with-scrollbar) / 1920);
    gap: calc(40 * var(--vw-with-scrollbar) / 1920);
    box-sizing: border-box;
    padding: calc(100 * var(--vw-with-scrollbar) / 1920);
    color: var(--base-color);
}
.footer-contact::before {
    background: var(--main-gra-nz);
}
.footer-contact__divider {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(1 * var(--vw-with-scrollbar) / 1920);
    background-image: var(--silver-texture);
    background-position: top;
}
.footer-contact .section-header {
    padding-bottom: calc(10 * var(--vw-with-scrollbar) / 1920);
}
.footer-contact__msg {
    font-size: calc(40 * var(--vw-with-scrollbar) / 1920);
    font-weight: 700;
}
.footer-contact-info {
    display: flex;
    align-items: end;
    font-size: calc(20 * var(--vw-with-scrollbar) / 1920);
    font-weight: 700;
}
.footer-contact-info > span:nth-child(1) {
    margin-right: calc(32 * var(--vw-with-scrollbar) / 1920);
}
.footer-contact-info > span:nth-child(2) {
    margin-right: calc(8 * var(--vw-with-scrollbar) / 1920);
}
.footer-contact-info > span:nth-child(3) {
    font-size: calc(40 * var(--vw-with-scrollbar) / 1920);
    font-weight: 500;
    height: calc(55 * var(--vw-with-scrollbar) / 1920);
}
.footer-contact-link {
    position: absolute;
    top: calc(92.4 * var(--vw-with-scrollbar) / 1920);
    right: calc(96.38 * var(--vw-with-scrollbar) / 1920);
    width: calc(467.62 * var(--vw-with-scrollbar) / 1920);
    height: calc(430.35 * var(--vw-with-scrollbar) / 1920);
}
.footer-contact-link > * {
    position: absolute;
}
.footer-contact-link__silver-bg,
.footer-contact-link__blue-bg {
    transform: rotate(45deg);
    translate: 70% 0;
    transform-origin: top left;
    border: solid calc(1 * 100vw / 1920) var(--base-color);
    aspect-ratio: 1;
    box-sizing: border-box;
}
.footer-contact-link__silver-bg {
    top: 0;
    left: 0;
    width: calc(294.17 * var(--vw-with-scrollbar) / 1920);
    background-image: var(--silver-texture);
    background-size: cover;
    background-position: center;
}
.footer-contact-link__main {
    top: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(430.45 * var(--vw-with-scrollbar) / 1920);
    aspect-ratio: 1;
    padding-top: calc(44.51 * var(--vw-with-scrollbar) / 1920);
    box-sizing: border-box;
}
.footer-contact-link__main-text {
    position: relative;
    font-size: clamp(16px, calc(32 * var(--vw-with-scrollbar) / 1920), 99px);
    font-weight: 700;
    color: var(--base-color);
    text-align: center;
    line-height: 1.8;
}
.footer-contact-link__blue-bg {
    position: absolute;
    width: calc(304.37 * var(--vw-with-scrollbar) / 1920);
    inset: 0;
    background-color: var(--main-color);
}
@media (max-width: 1024px) {
    .footer-contact {
        min-height: calc(367 * 100vw / 400);
        gap: 0;
        padding: calc(37.03 * 100vw / 400) calc(24 * 100vw / 400);
        justify-content: start;
    }
    .footer-contact__divider {
        height: calc(1 * 100vw / 400);
    }
    .footer-contact .section-header {
        padding-bottom: 0;
    }
    .footer-contact .section-header__title {
        font-size: calc(20 * 100vw / 400);
    }
    .footer-contact__msg {
        font-size: calc(24 * 100vw / 400);
        font-weight: 700;
        padding-bottom: calc(30 * 100vw / 400);
    }
    .footer-contact-info {
        max-width: calc(174 * 100vw / 400);
        display: flex;
        align-items: start;
        font-size: calc(20 * 100vw / 400);
        font-weight: 700;
        line-height: 1;
        flex-wrap: wrap;
    }
    .footer-contact-info > span:nth-child(1) {
        width: 100%;
        font-size: calc(18 * 100vw / 400);
        line-height: 1.8;
        margin-right: calc(32 * 100vw / 400);
        margin-bottom: calc(-5 * 100vw / 400);
    }
    .footer-contact-info > span:nth-child(2) {
        margin-right: calc(8 * 100vw / 400);
    }
    .footer-contact-info > span:nth-child(3) {
        font-size: calc(20 * 100vw / 400);
        height: unset;
    }
    .footer-contact-link {
        top: unset;
        bottom: calc(37.03 * 100vw / 400);
        right: calc(24 * 100vw / 400);
        width: calc(150.63 * 100vw / 400);
        height: calc(138.66 * 100vw / 400);
    }
    .footer-contact-link__silver-bg,
    .footer-contact-link__blue-bg {
        border-width: calc(1 * 100vw / 400);
    }
    .footer-contact-link__silver-bg {
        width: calc(94.76 * 100vw / 400);
    }
    .footer-contact-link__main {
        width: calc(138.66 * 100vw / 400);
        padding-top: calc(5 * 100vw / 400);
    }
    .footer-contact-link__main-text {
        font-size: calc(12 * 100vw / 400);
        line-height: 1.4;
    }
    .footer-contact-link__blue-bg {
        width: calc(98.05 * 100vw / 400);
    }
}
/* End Footer Contact CSS */
/* Start Home Page CSS */
#front-page {
    .hero-section {
        position: relative;
        width: 100%;
        height: calc(968 * var(--vw-with-scrollbar) / 1920);
        max-height: 968px;
        background-image: url(../img/top/hero-bg.webp);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        overflow: hidden;
    }

    .hero-big-title__wrapper-pc {
        top: clamp(0px, calc(158 * var(--vw-with-scrollbar) / 1920), 158px);
        left: calc(100 * var(--vw-with-scrollbar) / 1920);
        width: /*clamp(0px, calc(870 * var(--vw-with-scrollbar) / 1920), 900px);*/max-content;
        display: flex;
        flex-direction: column;
        position: absolute;
        align-items: stretch;
    }

    .hero-big-title {
        position: relative;
        overflow: hidden;
        display: flex;
        align-items: end;
        height: clamp(0px, calc(155 * var(--vw-with-scrollbar) / 1920), 155px);
        padding-left: clamp(
            0px,
            calc(9.7 * var(--vw-with-scrollbar) / 1920),
            9.7px
        );
        justify-content: stretch;
    }

    .hero-big-title__text {
        flex: 1;
        position: relative;
        font-size: clamp(
            0px,
            calc(144 * var(--vw-with-scrollbar) / 1920),
            125px
        );
        line-height: 1.2;
        letter-spacing: 0em;
        z-index: 1;
    }

    .hero-big-title::before {
        background: var(--main-gra-nz);
    }
    .hero-big-title::after {
        background-size: contain;
    }

    .hero-vertical-title__wrapper {
        position: absolute;
        bottom: clamp(0px, calc(179 * var(--vw-with-scrollbar) / 1920), 179px);
        left: calc(100 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        gap: clamp(0px, calc(7 * var(--vw-with-scrollbar) / 1920), 7px);
    }

    .hero-vertical-title {
        width: clamp(0px, calc(82 * var(--vw-with-scrollbar) / 1920), 82px);
        height: clamp(0px, calc(315 * var(--vw-with-scrollbar) / 1920), 315px);
    }
    .hero-vertical-title img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    .hero-bottom-title {
        position: absolute;
        width: clamp(0px, calc(1723 * var(--vw-with-scrollbar) / 1920), 1723px);
        height: clamp(0px, calc(188 * var(--vw-with-scrollbar) / 1920), 188px);
        bottom: 0;
        left: calc(90 * var(--vw-with-scrollbar) / 1920);
    }
    .hero-bottom-title img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    #hero-big-title__text-01-pc {
        letter-spacing: -0.17em;
    }
    #hero-big-title__text-02-pc {
        padding-left: 1rem;
        letter-spacing: -0.1em;
    }

    /* Animation Delay */
    .hero-section .banner-clip {
        animation-duration: 0.25s;
    }
    .hero-section .banner-clip__text {
        animation-duration: 0.25s;
        animation-delay: 0.25s;
    }
    .hero-section .slide-up {
        animation-duration: 0.5s;
        animation-delay: 0.5s;
    }

    /* About section */
    .about-section {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        position: relative;
        overflow: hidden;
    }
    .about-section.texture-bg::before {
        background: linear-gradient(180deg, #004098 0%, #111111 100%);
    }
    .about-top {
        position: relative;
        display: flex;
        flex-direction: column;
        padding-top: calc(103 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(110 * var(--vw-with-scrollbar) / 1920);
        gap: calc(51 * var(--vw-with-scrollbar) / 1920);
        z-index: 1;
    }
    .about-top-banner__wrapper {
        display: flex;
        flex-direction: column;
        align-items: start;
    }
    .about-top-banner {
        display: flex;
        align-items: center;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }
    .about-top-banner--top {
        padding-left: calc(100 * var(--vw-with-scrollbar) / 1920);
        padding-right: calc(70 * var(--vw-with-scrollbar) / 1920);
        background-image: url(../img/top/about-banner-01.svg);
    }
    .about-top-banner--bottom {
        padding-left: calc(85 * var(--vw-with-scrollbar) / 1920);
        padding-right: calc(37 * var(--vw-with-scrollbar) / 1920);
        margin-left: calc(107 * var(--vw-with-scrollbar) / 1920);
        margin-top: calc(-12 * var(--vw-with-scrollbar) / 1920);
        background-image: url(../img/top/about-banner-02.svg);
    }
    .about-top-banner__text {
        font-size: calc(80 * var(--vw-with-scrollbar) / 1920);
        font-weight: 700;
        background: var(--main-gra-nz);
    }

    .about-big-title__wrapper {
        position: absolute;
        top: calc(223 * var(--vw-with-scrollbar) / 1920);
        right: calc(99 * var(--vw-with-scrollbar) / 1920);
        z-index: 1;
    }
    .about-big-title {
        width: calc(571 * var(--vw-with-scrollbar) / 1920);
        height: calc(1045 * var(--vw-with-scrollbar) / 1920);
    }
    .about-big-title g:nth-of-type(2) {
        animation-delay: 0.5s;
    }
    .about-big-title g:nth-of-type(3) {
        animation-delay: 1s;
    }

    .about-message-col {
        display: flex;
        flex-direction: column;
        gap: calc(65 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(100 * var(--vw-with-scrollbar) / 1920);
        max-width: calc(1077 * var(--vw-with-scrollbar) / 1920);
        box-sizing: content-box;
    }
    .about-message-col__item {
        font-weight: 700;
        font-size: clamp(
            16px,
            calc(36 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        color: var(--base-color);
        line-height: 1.8;
    }

    .about-bottom {
        position: relative;
        display: flex;
        flex-direction: column;
        z-index: 1;
        padding-bottom: calc(160 * var(--vw-with-scrollbar) / 1920);
    }
    .about-bottom-bg {
        position: relative;
        height: calc(618 * var(--vw-with-scrollbar) / 1920);
        margin-left: calc(30 * var(--vw-with-scrollbar) / 1920);
        margin-right: calc(30 * var(--vw-with-scrollbar) / 1920);
        margin-bottom: calc(-123 * var(--vw-with-scrollbar) / 1920);
    }
    .about-bottom-bg__gray,
    .about-bottom-bg__main {
        position: absolute;
        inset: 0;
        background-size: contain;
        background-repeat: no-repeat;
    }
    .about-bottom-bg__gray {
        background-image: url(../img/top/about-bottom-gray.webp);
    }
    .about-bottom-bg__main {
        background-image: url(../img/top/about-bottom-main.webp);
    }
    .about-bottom-bg::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        background: linear-gradient(
            180deg,
            rgba(0, 64, 152, 0) -5.43%,
            #004098 51.7%
        );
        height: calc(230 * var(--vw-with-scrollbar) / 1920);
    }
    .about-bottom-inner {
        display: flex;
        flex-direction: column;
        gap: 0;
        z-index: 2;
        padding: 0 calc(100 * var(--vw-with-scrollbar) / 1920);
    }
    .about-bottom-heading {
        display: flex;
        flex-direction: column;
        align-items: start;
        gap: calc(30 * var(--vw-with-scrollbar) / 1920);
        margin-bottom: calc(24 * var(--vw-with-scrollbar) / 1920);
    }
    .about-bottom-heading__big-title {
        width: calc(950 * var(--vw-with-scrollbar) / 1920);
        height: calc(133 * var(--vw-with-scrollbar) / 1920);
    }
    .about-bottom-message__wrapper {
        display: flex;
        margin-bottom: calc(40 * var(--vw-with-scrollbar) / 1920);
    }
    .about-bottom-message {
        color: var(--base-color);
    }
    .about-bottom .link-button {
        align-self: start;
    }

    .business-section {
        display: flex;
        flex-direction: column;
        gap: calc(24 * var(--vw-with-scrollbar) / 1920);
        padding: 0 calc(30 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(160 * var(--vw-with-scrollbar) / 1920);
    }
    .business-heading {
        display: flex;
        flex-direction: column;
        align-items: start;
        color: var(--main-color);
        padding: 0 calc(70 * var(--vw-with-scrollbar) / 1920);
    }
    .business-hero {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: start;
        height: calc(655 * var(--vw-with-scrollbar) / 1920);
        background-image: url(../img/top/top_business_img.webp);
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        overflow: hidden;
        padding-top: calc(190 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(70 * var(--vw-with-scrollbar) / 1920);
        gap: calc(109 * var(--vw-with-scrollbar) / 1920);
        box-sizing: border-box;
    }
    .business-hero-heading {
        display: flex;
        flex-direction: column;
        align-items: start;
        gap: calc(30 * var(--vw-with-scrollbar) / 1920);
    }
    .business-hero-message {
        color: var(--base-color);
    }
    .business-staff-img {
        position: absolute;
        z-index: 3;
        width: calc(750 * var(--vw-with-scrollbar) / 1920);
        height: auto;
        top: calc(70 * var(--vw-with-scrollbar) / 1920);
        right: calc(254 * var(--vw-with-scrollbar) / 1920);
		left: 47%;
		left: clamp(560px, 47%, 47%);
    }
    .business-link {
        position: absolute;
        z-index: 4;
        width: calc(182 * var(--vw-with-scrollbar) / 1920);
        aspect-ratio: 1;
        bottom: calc(24 * var(--vw-with-scrollbar) / 1920);
        right: calc(24 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .business-link .round-link-btn__icon {
        width: calc(69 * var(--vw-with-scrollbar) / 1920);
    }

    .products-section {
        display: flex;
        flex-direction: column;
        padding: 0 calc(30 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(160 * var(--vw-with-scrollbar) / 1920);
    }
    .products-heading {
        display: flex;
        flex-direction: column;
        align-items: start;
        padding: 0 calc(70 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(160 * var(--vw-with-scrollbar) / 1920);
        color: var(--main-color);
    }

    .products-content {
        display: flex;
        flex-direction: column;
    }
    .products-content-grid {
        display: grid;
        height: calc(670 * var(--vw-with-scrollbar) / 1920);
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: 1fr;
        align-items: stretch;
    }
    .products-grid-link {
        width: calc(76 * var(--vw-with-scrollbar) / 1920);
        aspect-ratio: 1;
        bottom: calc(21 * var(--vw-with-scrollbar) / 1920);
        right: calc(24 * var(--vw-with-scrollbar) / 1920);
    }
    .products-grid-link .round-link-btn__icon {
        width: calc(31 * var(--vw-with-scrollbar) / 1920);
    }
    .products-hero {
        position: relative;
        margin-bottom: calc(59 * var(--vw-with-scrollbar) / 1920);
        overflow: hidden;
        background-color: var(--base-color);
    }
    .products-hero::before {
        content: "";
        position: absolute;
        inset: 0;
        background-image: var(--silver-texture);
        background-size: 100% 110%;
        background-position: center;
        opacity: 0.4;
    }
    .products-hero > * {
        position: absolute;
    }
    .products-hero-img {
        top: 0;
        right: calc(49 * var(--vw-with-scrollbar) / 1920);
        width: calc(628 * var(--vw-with-scrollbar) / 1920);
        height: calc(611 * var(--vw-with-scrollbar) / 1920);
        background-image: url(../img/top/products-hero-img.webp);
        background-repeat: no-repeat;
        background-size: contain;
    }
    .products-hero-title {
        top: calc(42 * var(--vw-with-scrollbar) / 1920);
        left: calc(60 * var(--vw-with-scrollbar) / 1920);
        font-size: calc(200 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.04;
        writing-mode: vertical-rl;
        letter-spacing: -0.01em;
    }
    .products-hero-subtitle {
        top: calc(50 * var(--vw-with-scrollbar) / 1920);
        left: calc(255 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        gap: calc(4 * var(--vw-with-scrollbar) / 1920);
        align-items: stretch;
    }
    .products-hero-subtitle::before {
        content: "";
        width: calc(3 * var(--vw-with-scrollbar) / 1920);
        min-height: 100%;
        background-color: var(--main-color);
        margin-top: calc(4.5 * var(--vw-with-scrollbar) / 1920);
        margin-bottom: calc(-4.5 * var(--vw-with-scrollbar) / 1920);
    }
    .products-hero-subtitle__text {
        font-size: calc(24 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        font-weight: 700;
        color: transparent;
        writing-mode: vertical-rl;
        background: var(--main-gra-nz);
        -webkit-background-clip: text;
        background-clip: text;
    }
    .products-hero-msg {
        left: calc(70 * var(--vw-with-scrollbar) / 1920);
        bottom: calc(37 * var(--vw-with-scrollbar) / 1920);
    }

    .manufacters-hero {
        position: relative;
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }
    .manufacters-hero-bg {
        position: absolute;
        inset: 0;
    }
    .manufacters-hero-inner {
        position: relative;
        overflow: hidden;
        z-index: 1;
        flex: 1;
    }
    .manufacters-hero-inner > * {
        position: absolute;
    }
    .manufacters-hero__bubble-tail {
        display: flex;
        z-index: 1;
    }
    .manufacters-hero__bubble-tail::before,
    .manufacters-hero__bubble-tail::after {
        content: "";
        flex: 1;
        border-bottom: calc(59 * var(--vw-with-scrollbar) / 1920) solid white;
    }
    .manufacters-hero__bubble-tail::before {
        border-right: calc(34.5 * var(--vw-with-scrollbar) / 1920) solid
            transparent;
    }
    .manufacters-hero__bubble-tail::after {
        border-left: calc(34.5 * var(--vw-with-scrollbar) / 1920) solid
            transparent;
    }
    .manufacters-hero-title {
        top: calc(13 * var(--vw-with-scrollbar) / 1920);
        left: calc(60 * var(--vw-with-scrollbar) / 1920);
        font-size: calc(180 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.04;
        writing-mode: vertical-rl;
        letter-spacing: -0.105em;
        color: var(--base-color);
        white-space: nowrap;
    }
    .manufacters-hero-title .small-text {
        font-size: calc(140 * var(--vw-with-scrollbar) / 1920);
    }
    .manufacters-hero-subtitle {
        top: calc(50 * var(--vw-with-scrollbar) / 1920);
        left: calc(255 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        gap: calc(4 * var(--vw-with-scrollbar) / 1920);
        align-items: stretch;
    }
    .manufacters-hero-subtitle::before {
        content: "";
        width: calc(3 * var(--vw-with-scrollbar) / 1920);
        min-height: 100%;
        background-color: var(--base-color);
    }
    .manufacters-hero-subtitle__text {
        font-size: calc(24 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        font-weight: 700;
        color: var(--base-color);
        writing-mode: vertical-rl;
    }
    .manufacters-hero-msg {
        left: calc(269 * var(--vw-with-scrollbar) / 1920);
        bottom: calc(37 * var(--vw-with-scrollbar) / 1920);
        color: var(--base-color);
    }
    .manufacters-hero-img {
        top: 0;
        right: calc(62 * var(--vw-with-scrollbar) / 1920);
        width: calc(628 * var(--vw-with-scrollbar) / 1920);
        height: calc(611 * var(--vw-with-scrollbar) / 1920);
        background-image: url(../img/top/manufacters-hero-img.webp);
        background-repeat: no-repeat;
        background-size: contain;
    }
    .partner-section {
        background-color: var(--sub-color);
        color: var(--base-color);
        display: flex;
        flex-direction: column;
        padding: calc(70 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(45 * var(--vw-with-scrollbar) / 1920);
        gap: calc(65 * var(--vw-with-scrollbar) / 1920);
        align-items: center;
    }
    .partner-section-heading {
        display: flex;
        align-items: center;
    }
    .partner-section-heading__icon {
        width: calc(22 * var(--vw-with-scrollbar) / 1920);
        height: calc(12 * var(--vw-with-scrollbar) / 1920);
    }
    .partner-section-heading__icon:nth-child(1) {
        padding-right: calc(4 * var(--vw-with-scrollbar) / 1920);
    }
    .partner-section-heading__icon:nth-child(3) {
        padding-left: calc(10 * var(--vw-with-scrollbar) / 1920);
    }
    .partner-section-heading__text {
        font-style: italic;
        font-size: calc(32 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.8;
        font-weight: bold;
        color: var(--base-color);
    }

    .partner-section-grid {
        width: 100%;
        display: grid;
        column-gap: calc(16 * var(--vw-with-scrollbar) / 1920);
        row-gap: calc(25 * var(--vw-with-scrollbar) / 1920);
        grid-template-columns: repeat(5, 1fr);
        grid-template-rows: repeat(2, auto);
    }

    .partner-section-grid img {
        width: 100%;
        height: auto;
        border: calc(1 * 100vw / 1920) solid #c8c8c8;
        box-sizing: border-box;
        border-radius: calc(2 * 100vw / 1920);
        object-fit: contain;
    }

    .news-section {
        background-color: var(--base-color);
        gap: calc(40 * var(--vw-with-scrollbar) / 1920);
        padding: calc(199 * var(--vw-with-scrollbar) / 1920)
            calc(100 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        flex-direction: column;
    }
    .news-section-heading {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .news-section-heading__title {
        display: flex;
        flex-direction: column;
        align-items: start;
        color: var(--main-color);
    }
    .news-section-content {
        min-height: calc(489 * var(--vw-with-scrollbar) / 1920);
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: 1fr;
        gap: calc(36 * var(--vw-with-scrollbar) / 1920);
    }
    .news-section-content__item {
        display: flex;
        flex-direction: column;
        gap: calc(24.35 * var(--vw-with-scrollbar) / 1920);
        align-items: start;
    }
    .news-section-content__item-img {
        width: 100%;
        height: calc(295 * var(--vw-with-scrollbar) / 1920);
        background-color: #c4c4c4;
        border-radius: calc(2 * var(--vw-with-scrollbar) / 1920);
        overflow: hidden;
    }
    .news-section-content__item-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .news-section-content__item-inner {
        display: flex;
        flex-direction: column;
        gap: calc(12 * var(--vw-with-scrollbar) / 1920);
        width: 100%;
        box-sizing: border-box;
        padding-right: calc(29 * var(--vw-with-scrollbar) / 1920);
        align-items: start;
    }
    .news-section-content__meta-data {
        display: flex;
        align-items: center;
        gap: calc(12 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.825;
        font-weight: bold;
    }
    .news-section-content__category {
        padding: 0 calc(16 * var(--vw-with-scrollbar) / 1920);
        border-radius: calc(2 * var(--vw-with-scrollbar) / 1920);
        color: var(--base-color);
        font-size: clamp(
            16px,
            calc(20 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        overflow: hidden;
    }
    .news-section-content__category::before {
        background: linear-gradient(180deg, #f5f5f5 -37.89%, #004098 25.09%);
    }
    .news-section-content__category span {
        position: relative;
        z-index: 1;
    }
    .news-section-content__date {
        color: var(--main-color);
        font-size: clamp(
            12px,
            calc(14 * var(--vw-with-scrollbar) / 1920),
            99px
        );
    }
    .news-section-content__title {
        font-size: clamp(
            16px,
            calc(20 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        font-weight: 600;
        line-height: 1.8;
    }
    .news-section-content__description {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1.8;
        font-size: clamp(
            12px,
            calc(14 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        font-weight: 500;
        color: #aaaaaa;
    }

    .company-section {
        display: flex;
        flex-direction: column;
    }
    .company-section::before,
    .company-section::after {
        display: none;
    }
    .company-section-top {
        padding: calc(132 * var(--vw-with-scrollbar) / 1920)
            calc(95 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(52 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        align-items: end;
        justify-content: space-between;
    }
    .company-section-top::before {
        background: linear-gradient(180deg, #004098 0%, #004098 100%);
    }
    .company-section-top__heading {
        display: flex;
        flex-direction: column;
        align-items: start;
        gap: calc(40 * var(--vw-with-scrollbar) / 1920);
        color: var(--base-color);
    }
    .company-section-top__title {
        display: flex;
        flex-direction: column;
        align-items: start;
        gap: calc(8 * var(--vw-with-scrollbar) / 1920);
    }
    .company-section-top__title h1 {
        font-family: var(--font-inter);
        font-size: calc(140 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        font-style: italic;
        margin-left: calc(16 * var(--vw-with-scrollbar) / 1920);
    }
    .company-section-grid {
        padding: calc(24 * var(--vw-with-scrollbar) / 1920)
            calc(30 * var(--vw-with-scrollbar) / 1920);
        min-height: calc(754 * var(--vw-with-scrollbar) / 1920);
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: 1fr;
    }
    .company-section-grid::before {
        background: var(--main-gra-nz);
    }
    .company-section-grid-item {
        position: relative;
        display: flex;
        align-items: end;
        justify-content: stretch;
        gap: calc(40 * var(--vw-with-scrollbar) / 1920);
        padding: calc(40 * var(--vw-with-scrollbar) / 1920);
    }
    .company-section-grid-item::before,
    .company-section-grid-item::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 0;
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        transition: opacity 0.4s ease;
    }
    .company-section-grid-item::after {
        opacity: 0;
    }
    .company-section-grid-item:hover::after {
        opacity: 1;
    }
    .company-section-grid-item:nth-child(1)::before {
        background-image: url(../img/top/company-card-img-1-gray.webp);
    }
    .company-section-grid-item:nth-child(1)::after {
        background-image: url(../img/top/company-card-img-1.webp);
    }
    .company-section-grid-item:nth-child(2)::before {
        background-image: url(../img/top/company-card-img-2-gray.webp);
    }
    .company-section-grid-item:nth-child(2)::after {
        background-image: url(../img/top/company-card-img-2.webp);
    }
    .company-section-grid-item:nth-child(3)::before {
        background-image: url(../img/top/company-card-img-3-gray.webp);
    }
    .company-section-grid-item:nth-child(3)::after {
        background-image: url(../img/top/company-card-img-3.webp);
    }
    .company-section-grid-item__wrapper {
        display: flex;
        align-items: end;
        justify-content: space-between;
        width: 100%;
    }
    .company-section-grid-item-heading {
        display: flex;
        flex-direction: column;
        align-items: start;
        position: relative;
        z-index: 1;
        gap: calc(10 * var(--vw-with-scrollbar) / 1920);
    }
    .company-section-grid-item-heading__title {
        height: calc(54 * var(--vw-with-scrollbar) / 1920);
    }
    .company-section-grid-item-heading__subtitle {
        display: flex;
        padding: calc(8 * var(--vw-with-scrollbar) / 1920)
            calc(12 * var(--vw-with-scrollbar) / 1920);
        font-size: calc(40 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        font-weight: 700;
        color: var(--base-color);
        background: var(--main-gra-nz);
    }
    .company-section-grid-item-heading__subtitle span {
        transform: matrix(1, 0, -0.24, 0.97, 0, 0);
    }
    .company-section-grid-item__link-icon {
        width: calc(76 * var(--vw-with-scrollbar) / 1920);
        aspect-ratio: 1;
        position: relative;
        z-index: 1;
    }
    .company-section-grid-item__link-icon .round-link-btn__icon {
        width: calc(31 * var(--vw-with-scrollbar) / 1920);
    }
    .thoughts-section {
        position: relative;
        display: flex;
        flex-direction: column;
        background-color: white;
        min-height: calc(780 * var(--vw-with-scrollbar) / 1920);
        padding-right: calc(92 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(78 * var(--vw-with-scrollbar) / 1920);
        align-items: end;
        justify-content: end;
        box-sizing: border-box;
        overflow: hidden;
    }
    .thoughts-section-inner {
        display: flex;
        flex-direction: column;
        gap: calc(45 * var(--vw-with-scrollbar) / 1920);
        align-items: start;
    }
    .thoughts-section-bg {
        position: absolute;
        top: calc(106 * var(--vw-with-scrollbar) / 1920);
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 0;
        background-image: url(../img/top/thoughts-bg.webp);
        background-size: contain;
    }
    .thoughts-section-img {
        position: absolute;
        top: 0;
        left: calc(131 * var(--vw-with-scrollbar) / 1920);
        z-index: 3;
        background-image: url(../img/top/thoughts-main-img.webp);
        width: calc(907 * var(--vw-with-scrollbar) / 1920);
        height: 100%;
        background-size: contain;
    }
    .thoughts-section-content {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: start;
        gap: calc(10 * var(--vw-with-scrollbar) / 1920);
        z-index: 2;
    }
    .thoughts-section-content__heading {
        display: flex;
        flex-direction: column;
        color: var(--base-color);
    }
    .thoughts-section .white-text-body {
        width: calc(774 * var(--vw-with-scrollbar) / 1920);
    }
    .thoughts-section .link-button {
        min-width: calc(345 * var(--vw-with-scrollbar) / 1920);
        z-index: 4;
    }
    .sdgs-section {
        min-height: calc(697 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(95 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(72 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        align-items: stretch;
        justify-content: end;
        flex-direction: column;
        background-image: url(../img/top/sdgs-bg.webp);
        background-repeat: no-repeat;
        background-size: contain;
        box-sizing: border-box;
        gap: calc(10 * var(--vw-with-scrollbar) / 1920);
    }
    .sdgs-section-heading {
        display: flex;
        flex-direction: column;
        color: var(--base-color);
    }
    .sdgs-section-content {
        display: flex;
        flex-direction: column;
        gap: calc(40 * var(--vw-with-scrollbar) / 1920);
        align-items: start;
        width: calc(1284 * var(--vw-with-scrollbar) / 1920);
    }
    .recruit-section {
        display: flex;
        flex-direction: column;
        background-color: var(--base-color);
    }
    .recruit-section-top {
        display: flex;
        flex-direction: column;
        align-items: start;
        gap: calc(40 * var(--vw-with-scrollbar) / 1920);
        padding: calc(160 * var(--vw-with-scrollbar) / 1920)
            calc(95 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(91 * var(--vw-with-scrollbar) / 1920);
    }
    .recruit-section-top__heading {
        display: flex;
        flex-direction: column;
        align-items: start;
        gap: calc(8 * var(--vw-with-scrollbar) / 1920);
    }
    .recruit-section-top__title-en {
        display: flex;
        padding: calc(10 * var(--vw-with-scrollbar) / 1920)
            calc(28 * var(--vw-with-scrollbar) / 1920);
    }
    .recruit-section-top__title-en-text {
        font-family: var(--font-inter);
        font-size: calc(140 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        font-weight: 700;
        color: transparent;
        -webkit-background-clip: text !important;
        background-clip: text !important;
        -webkit-text-fill-color: transparent;
        background: var(--main-gra-nz);
        background-attachment: fixed;
    }
    .recruit-section .section-header__title-letter {
        background: var(--main-gra-nz);
        color: transparent;
        -webkit-background-clip: text !important;
        background-clip: text !important;
        -webkit-text-fill-color: transparent;
        padding-right: 0.1em;
    }
    .recruit-section .section-header__title > div:not(:first-child) {
        margin-left: -0.1em;
    }
    .recruit-section-top__content {
        display: flex;
        flex-direction: column;
        align-items: start;
        gap: calc(16 * var(--vw-with-scrollbar) / 1920);
    }
    .recruit-section-top__big-title {
        display: flex;
        align-items: center;
        background: var(--main-gra-nz);
        padding: calc(10 * var(--vw-with-scrollbar) / 1920);
        box-sizing: border-box;
        min-height: calc(133 * var(--vw-with-scrollbar) / 1920);
    }
    .recruit-section-top__big-title-text {
        line-height: 1.2;
        font-size: calc(93 * var(--vw-with-scrollbar) / 1920);
    }
    .recruit-section-bottom {
        display: flex;
        flex-direction: column;
        align-items: start;
        background-color: var(--base-color);
        padding: 0 calc(30 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(113 * var(--vw-with-scrollbar) / 1920);
        gap: calc(40 * var(--vw-with-scrollbar) / 1920);
    }
    .recruit-section-bottom-inner {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }

    .recruit-section-hero {
        position: relative;
        overflow: hidden;
        height: calc(595 * var(--vw-with-scrollbar) / 1920);
    }
    .recruit-section-hero > * {
        position: absolute;
    }
    .recruit-section-hero__bg {
        top: calc(21 * var(--vw-with-scrollbar) / 1920);
        left: 0;
        width: 100%;
        height: calc(693 * var(--vw-with-scrollbar) / 1920);
        background-image: url(../img/top/recruit-bg.webp);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
    }
    .recruit-section-hero__marquee-list {
        top: 0;
        left: 0;
        width: 100%;
        display: flex;
        flex-direction: column;
    }

    .recruit-section-hero__marquee-list-item {
        display: flex;
        flex-wrap: nowrap;
        width: 200%;
        margin-bottom: calc(-34 * var(--vw-with-scrollbar) / 1920);
        height: calc(156 * var(--vw-with-scrollbar) / 1920);
    }

    .recruit-section-hero__marquee-list-item > object {
        pointer-events: none;
        min-width: 50%;
        width: 50%;
        height: 100%;
    }

    .recruit-section-hero__marquee-list-item:nth-child(odd) {
        animation: marquee-rtl 20s linear infinite;
    }
    .recruit-section-hero__marquee-list-item:nth-child(even) {
        translate: -50% 0;
        animation: marquee-ltr 20s linear infinite;
    }

    .recruit-section-hero-staff-img {
        top: calc(95 * var(--vw-with-scrollbar) / 1920);
        left: 0;
        width: 100%;
        height: auto;
    }
    .recruit-section-hero-staff-img img {
        width: 100%;
    }

    .recruit-section-hero__big-text {
        display: flex;
        width: 100%;
        text-align: left;
        bottom: calc(-44.44 * var(--vw-with-scrollbar) / 1920);
        left: calc(10 * var(--vw-with-scrollbar) / 1920);
        font-family: var(--font-inter-static);
        font-weight: bold;
        font-size: calc(297 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        letter-spacing: -0.074em;
        white-space: nowrap;
    }
    .recruit-section-hero__big-text > span:first-child {
        position: relative;
        z-index: 1;
        animation: bg-move-ltr 5s steps(10) infinite;
        background-size: 200% 100%;
        background-position: left center;
        width: 100%;
    }
    .recruit-section-hero__big-text-stroke {
        z-index: 0;
        position: absolute;
        inset: 0;
        background: var(--main-gra-nz);
        color: transparent;
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-stroke: calc(5.66 * var(--vw-with-scrollbar) / 1920)
            transparent;
    }

    .recruit-section-link-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: auto;
        min-height: calc(295 * var(--vw-with-scrollbar) / 1920);
    }
    .recruit-section-link-grid-item {
        display: flex;
        padding: calc(78 * var(--vw-with-scrollbar) / 1920)
            calc(40 * var(--vw-with-scrollbar) / 1920);
        border-radius: calc(2 * var(--vw-with-scrollbar) / 1920);
        border-right: calc(1 * var(--vw-with-scrollbar) / 1920) solid
            var(--base-color);
        box-sizing: border-box;
    }
    .recruit-section-link-grid-item__inner {
        width: 100%;
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: start;
    }
    .recruit-section-link-grid-item__title {
        font-family: var(--font-inter-static);
        font-size: calc(71 * var(--vw-with-scrollbar) / 1920);
        font-style: italic;
        font-weight: 700;
        line-height: 1.2;
        color: rgba(200, 200, 200, 0.4);
        -webkit-text-stroke: calc(1 * var(--vw-with-scrollbar) / 1920)
            var(--base-color);
    }
    .recruit-section-link-grid-item__subtitle {
        display: flex;
        padding: calc(8 * var(--vw-with-scrollbar) / 1920);
        background-color: var(--main-gra-nz);
        color: var(--base-color);
        font-size: calc(40 * var(--vw-with-scrollbar) / 1920);
        font-weight: 700;
        line-height: 1;
    }
    .recruit-section-link-grid-item__subtitle > span {
        position: relative;
        z-index: 1;
    }
    .recruit-section-link-grid-item__link {
        position: absolute;
        bottom: 0;
        right: 0;
        width: calc(76 * var(--vw-with-scrollbar) / 1920);
        aspect-ratio: 1;
        z-index: 2;
    }
    .recruit-section-link-grid-item__link .round-link-btn__icon {
        width: calc(31 * var(--vw-with-scrollbar) / 1920);
    }

    /* Animation delay */
    .products-hero-title .zoom-in-text:nth-child(2) {
        animation-delay: 0.3s;
    }

    .manufacters-hero-title .zoom-in-text:nth-child(2) {
        animation-delay: 0.3s;
    }
    .manufacters-hero-title .zoom-in-text:nth-child(3) {
        animation-delay: 0.6s;
    }
    .manufacters-hero-title .zoom-in-text:nth-child(4) {
        animation-delay: 0.9s;
    }
    /* Animation delay */
    .products-hero-title .zoom-in-text:nth-child(2) {
        animation-delay: 0.3s;
    }
}
@media (min-width: 2200px) {
    .business-hero-message {
        font-size: 15px;
    }
}
@media (min-width: 1025px) {
    #front-page {
        .products-hero-subtitle,
        .products-hero-msg,
        .products-grid-link,
        .manufacters-hero-subtitle,
        .manufacters-hero-msg {
            animation-delay: 0.6s !important;
        }
    }
}
@media (max-width: 1024px) {
    body[data-page-id="home"] .header {
        position: fixed;
    }
    #front-page {
        .hero-section {
            height: calc(710 * 100vw / 400);
            max-height: unset;
            background-image: url(../img/top/hero-bg-sp.webp);
        }
        .hero-vertical-title__wrapper {
            bottom: calc(124 * 100vw / 400);
            left: calc(24 * 100vw / 400);
            gap: calc(7 * 100vw / 400);
        }

        .hero-big-title__wrapper-sp {
            position: absolute;
            top: calc(96 * 100vw / 400);
            left: 0;
            display: flex;
            flex-direction: column;
            align-items: start;
        }

        .hero-big-title {
            height: calc(75 * 100vw / 400);
            padding-left: calc(20 * 100vw / 400);
            box-sizing: border-box;
        }

        .hero-big-title__text {
            line-height: 1.4;
            font-size: calc(60 * 100vw / 400);
        }

        .hero-vertical-title {
            width: calc(55 * 100vw / 400);
            height: calc(226 * 100vw / 400);
        }
        .hero-bottom-title {
            position: absolute;
            width: calc(407 * 100vw / 400);
            height: calc(109 * 100vw / 400);
            bottom: 0;
            left: 50%;
            translate: -50% 0;
        }

        #hero-big-title-01-sp {
            width: calc(220 * 100vw / 400);
            letter-spacing: 0;
            margin-bottom: calc(9 * 100vw / 400);
        }
        #hero-big-title-01-sp .hero-big-title__text,
        #hero-big-title-02-sp .hero-big-title__text {
            letter-spacing: 0;
        }
        #hero-big-title-01-sp .hero-big-title__text {
            background-position: top;
        }
        #hero-big-title-02-sp .hero-big-title__text {
            background-position: bottom;
        }
        #hero-big-title-02-sp {
            width: calc(282 * 100vw / 400);
            letter-spacing: -0.34em;
            margin-bottom: calc(12 * 100vw / 400);
        }
        #hero-big-title-03-sp {
            width: calc(376 * 100vw / 400);
        }
        #hero-big-title__text-01-sp {
            letter-spacing: -0.17em;
        }
        #hero-big-title__text-02-sp {
            padding-left: 0.6rem;
            letter-spacing: -0.05em;
        }
        .about-section::after {
            display: none;
        }
        .about-top {
            padding: 0;
            padding-bottom: calc(20 * 100vw / 400);
            gap: 0;
        }
        .about-big-title__wrapper {
            order: 1;
            position: relative;
            top: unset;
            right: unset;
            width: 100%;
            box-sizing: border-box;
            height: auto;
            padding: calc(36 * 100vw / 400) calc(52 * 100vw / 400);
            padding-bottom: calc(66 * 100vw / 400);
        }
        .about-big-title__wrapper::before {
            background: var(--main-gra);
        }
        .about-big-title {
            width: 100%;
            height: auto;
        }
        .about-top-banner__wrapper {
            order: 2;
            gap: calc(15 * 100vw / 400);
        }
        .about-top-banner__text {
            font-size: calc(20 * 100vw / 400);
        }
        .about-top-banner {
            box-sizing: border-box;
            padding-top: calc(8 * 100vw / 400);
            padding-bottom: calc(9 * 100vw / 400);
        }
        .about-top-banner--top {
            width: calc(334 * 100vw / 400);
            padding-left: calc(27 * 100vw / 400);
            padding-right: 0;
            background-image: url(../img/top/about-banner-01-sp.svg);
        }
        .about-top-banner--bottom {
            margin-left: 0;
            padding-left: calc(37 * 100vw / 400);
            padding-right: calc(10 * 100vw / 400);
            align-self: center;
            background-image: url(../img/top/about-banner-02-sp.svg);
        }
        .about-message-col {
            order: 3;
            padding: calc(40 * 100vw / 400) calc(23.5 * 100vw / 400);
            padding-bottom: 0;
            max-width: 100%;
            box-sizing: border-box;
            gap: calc(27 * 100vw / 400);
        }
        .about-message-col__item {
            font-size: calc(18 * 100vw / 400);
            line-height: 1.5;
        }

        .about-bottom {
            position: relative;
            display: flex;
            flex-direction: column;
            padding: 0 calc(23.5 * 100vw / 400);
            padding-bottom: calc(36 * 100vw / 400);
        }
        .about-bottom-bg {
            position: relative;
            margin: 0;
            margin-bottom: calc(-54 * 100vw / 400);
            height: calc(207 * 100vw / 400);
        }
        .about-bottom-bg__gray {
            filter: grayscale();
            background-image: url(../img/top/about-bottom-main-sp.webp);
        }
        .about-bottom-bg__main {
            background-image: url(../img/top/about-bottom-main-sp.webp);
        }
        .about-bottom-bg::after {
            height: calc(80 * 100vw / 400);
        }
        .about-bottom-inner {
            gap: calc(40 * 100vw / 400);
            padding: 0;
        }
        .about-bottom-heading {
            gap: calc(5 * 100vw / 400);
            margin-bottom: 0;
        }
        .about-bottom-heading__big-title {
            width: fit-content;
            height: fit-content;
        }
        .about-bottom-message__wrapper {
            display: flex;
            margin-bottom: calc(10 * 100vw / 400);
        }
        .about-bottom .link-button {
            align-self: stretch;
            gap: 0;
            padding: calc(10 * 100vw / 400) calc(14 * 100vw / 400);
        }
        .about-bottom .link-button__icon {
            width: calc(30 * 100vw / 400);
        }
        .about-bottom .link-button__text {
            font-size: calc(19 * 100vw / 400);
        }

        .business-section {
            padding: 0;
        }
        .business-heading {
            gap: calc(14 * 100vw / 400);
            padding: calc(40 * 100vw / 400) calc(24 * 100vw / 400);
        }
        .business-heading .h2-jp {
            line-height: 1;
        }
        .business-hero {
            height: calc(575 * 100vw / 400);
            background-image: url(../img/top/top_business_img-sp.webp);
            padding-top: calc(71 * 100vw / 400);
            padding-left: calc(24 * 100vw / 400);
            gap: calc(38 * 100vw / 400);
        }
        .business-hero-heading {
            gap: 0;
        }
        .business-hero .section-title {
            max-width: calc(260 * 100vw / 400);
        }
        .business-hero .section-title__inner {
            font-size: calc(60 * 100vw / 400);
            flex-wrap: wrap;
            justify-content: start;
        }
        .business-staff-img {
            width: calc(517 * 100vw / 400);
            top: calc(87 * 100vw / 400);
            left: calc(61 * 100vw / 400);
            right: unset;
        }
        .business-link {
            width: calc(79 * 100vw / 400);
            aspect-ratio: 1;
            bottom: calc(28 * 100vw / 400);
            right: calc(24 * 100vw / 400);
        }
        .business-link .round-link-btn__icon {
            width: calc(31 * 100vw / 400);
        }
        .business-hero-message {
            width: calc(243 * 100vw / 400);
            height: calc(220 * 100vw / 400);
            z-index: 5;
        }

        .products-heading {
            padding: calc(40 * 100vw / 400) calc(24 * 100vw / 400);
            gap: calc(14 * 100vw / 400);
        }
        .products-heading .h2-jp {
            line-height: 1;
        }
        .products-heading .section-header__title {
            font-size: calc(16 * 100vw / 400);
        }

        .products-section {
            padding: 0;
        }
        .products-content {
            padding: 0;
        }
        .products-content-grid {
            display: flex;
            flex-direction: column;
            height: fit-content;
        }
        .products-grid-link {
            width: calc(76 * 100vw / 400);
            bottom: calc(22 * 100vw / 400);
            right: calc(24 * 100vw / 400);
        }
        .products-grid-link .round-link-btn__icon {
            width: calc(31 * 100vw / 400);
        }
        .products-hero {
            height: calc(489 * 100vw / 400);
            margin-bottom: 0;
        }
        .products-hero::before {
            background-size: cover 100%;
        }
        .products-hero-img {
            top: calc(5 * 100vw / 400);
            left: calc(28 * 100vw / 400);
            width: calc(463 * 100vw / 400);
            height: calc(484 * 100vw / 400);
            background-image: url(../img/top/products-hero-img-sp.webp);
        }
        .products-hero-title {
            top: calc(9 * 100vw / 400);
            left: calc(24 * 100vw / 400);
            font-size: calc(100 * 100vw / 400);
            line-height: 1.04;
        }
        .products-hero-subtitle {
            top: calc(21 * 100vw / 400);
            left: calc(133 * 100vw / 400);
            gap: calc(3 * 100vw / 400);
        }
        .products-hero-subtitle::before {
            width: calc(3 * 100vw / 400);
            margin-top: calc(3 * 100vw / 400);
            margin-bottom: calc(-3 * 100vw / 400);
        }
        .products-hero-subtitle__text {
            font-size: calc(24 * 100vw / 400);
            line-height: 1;
            font-weight: 700;
            color: transparent;
        }
        .products-hero-msg {
            left: calc(38 * 100vw / 400);
            bottom: calc(12 * 100vw / 400);
            max-width: calc(202 * 100vw / 400);
            font-size: calc(18 * 100vw / 400);
        }

        .manufacters-hero {
            height: calc(541 * 100vw / 400);
        }
        .manufacters-hero__bubble-tail::before,
        .manufacters-hero__bubble-tail::after {
            border-bottom: calc(37 * 100vw / 400) solid var(--base-color);
        }
        .manufacters-hero__bubble-tail::before {
            border-right: calc(23.5 * 100vw / 400) solid transparent;
        }
        .manufacters-hero__bubble-tail::after {
            border-left: calc(23.5 * 100vw / 400) solid transparent;
        }

        .manufacters-hero .products-grid-link {
            bottom: calc(39 * 100vw / 400);
        }

        .manufacters-hero-img {
            top: calc(22 * 100vw / 400);
            right: calc(74 * 100vw / 400);
            width: calc(386 * 100vw / 400);
            height: calc(390 * 100vw / 400);
            background-image: url(../img/top/manufacters-hero-img-sp.webp);
            background-position: center;
        }
        .manufacters-hero-title {
            top: calc(4 * 100vw / 400);
            left: unset;
            right: calc(53 * 100vw / 400);
            font-size: calc(106 * 100vw / 400);
            line-height: 0.89;
        }
        .manufacters-hero-title .small-text {
            font-size: calc(106 * 100vw / 400);
        }
        .manufacters-hero-subtitle {
            top: calc(16 * 100vw / 400);
            left: unset;
            right: calc(24 * 100vw / 400);
            gap: calc(3 * 100vw / 400);
            min-height: calc(168 * 100vw / 400);
        }
        .manufacters-hero-subtitle::before {
            width: calc(3 * 100vw / 400);
            margin-top: calc(3 * 100vw / 400);
            margin-bottom: calc(-3 * 100vw / 400);
        }
        .manufacters-hero-subtitle__text {
            font-size: calc(24 * 100vw / 400);
            line-height: 1;
            font-weight: 700;
        }
        .manufacters-hero-msg {
            left: calc(19 * 100vw / 400);
            bottom: calc(29 * 100vw / 400);
            max-width: calc(237 * 100vw / 400);
            font-size: calc(18 * 100vw / 400);
        }

        .partner-section {
            padding: calc(34 * 100vw / 400) calc(28 * 100vw / 400);
            gap: calc(15 * 100vw / 400);
        }
        .partner-section-heading__icon {
            width: calc(22 * 100vw / 400);
            height: calc(12 * 100vw / 400);
        }
        .partner-section-heading__icon:nth-child(1) {
            padding-right: calc(4 * 100vw / 400);
        }
        .partner-section-heading__icon:nth-child(3) {
            padding-left: calc(10 * 100vw / 400);
        }
        .partner-section-heading__text {
            font-size: calc(24 * 100vw / 400);
        }

        .partner-section-grid {
            column-gap: calc(8 * 100vw / 400);
            row-gap: calc(16 * 100vw / 400);
            grid-template-columns: repeat(2, 1fr);
            grid-template-rows: repeat(5, auto);
        }
        .partner-section-grid img {
            border-width: calc(1 * 100vw / 400);
            border-radius: calc(2 * 100vw / 400);
        }

        .news-section {
            gap: calc(40 * 100vw / 400);
            padding: calc(40 * 100vw / 400) calc(24 * 100vw / 400);
            background-color: transparent;
        }
        .news-section-content {
            min-height: unset;
            display: flex;
            flex-direction: column;
            gap: calc(33 * 100vw / 400);
        }
        .news-section-content__item {
            gap: calc(24.35 * 100vw / 400);
        }
        .news-section-content__item-img {
            height: calc(166 * 100vw / 400);
            border-radius: calc(2 * 100vw / 400);
        }
        .news-section-content__item-inner {
            gap: calc(10 * 100vw / 400);
            padding-right: 0;
        }
        .news-section-content__meta-data {
            display: flex;
            align-items: center;
            gap: calc(12 * 100vw / 400);
            line-height: 1.825;
            font-weight: bold;
        }
        .news-section-content__category {
            padding: 0 calc(16 * 100vw / 400);
            border-radius: calc(2 * 100vw / 400);
            color: var(--base-color);
            font-size: clamp(16px, calc(20 * 100vw / 400), 99px);
            overflow: hidden;
        }
        .news-section-content__category::before {
            background: linear-gradient(
                180deg,
                #f5f5f5 -37.89%,
                #004098 25.09%
            );
        }
        .news-section-content__date {
            font-size: clamp(12px, calc(14 * 100vw / 400), 99px);
        }
        .news-section-content__title {
            font-size: clamp(16px, calc(20 * 100vw / 400), 99px);
        }
        .news-section-content__description {
            font-size: clamp(12px, calc(14 * 100vw / 400), 99px);
        }
        .news-section .link-button {
            padding: calc(10 * 100vw / 400) calc(27.5 * 100vw / 400);
        }

        .company-section {
            padding: calc(40 * 100vw / 400) calc(24 * 100vw / 400);
            gap: calc(40 * 100vw / 400);
        }

        .company-section::before,
        .company-section::after {
            display: block;
        }

        .company-section::before {
            background: var(--main-gra-nz);
        }

        .company-section-top::before,
        .company-section-top::after,
        .company-section-grid::before,
        .company-section-grid::after {
            display: none;
        }

        .company-section-top {
            padding: 0;
            display: flex;
            flex-direction: column;
            align-items: start;
            background-color: transparent;
        }

        .company-section-top__heading {
            gap: calc(14 * 100vw / 400);
        }
        .company-section-top__title {
            gap: calc(14 * 100vw / 400);
        }
        .company-section-top__title h1 {
            font-size: calc(56 * 100vw / 400);
            line-height: 1;
            font-style: italic;
            font-family: var(--font-inter);
        }
        .company-section .white-body-text {
            max-width: calc(300 * 100vw / 400);
        }

        .company-section-grid {
            padding: 0;
            gap: calc(33 * 100vw / 400);
            background: transparent;
            min-height: unset;
            display: flex;
            flex-direction: column;
        }
        .company-section-grid-item {
            height: calc(428 * 100vw / 400);
            gap: calc(22 * 100vw / 400);
            padding-left: calc(8 * 100vw / 400);
            padding-bottom: calc(8 * 100vw / 400);
            padding-right: calc(25 * 100vw / 400);
        }
        .company-section-grid-item__wrapper {
            max-width: calc(309 * 100vw / 400);
            align-items: center;
        }
        .company-section-grid-item-heading {
            gap: calc(12 * 100vw / 400);
        }
        .company-section-grid-item-heading__title {
            height: calc(32 * 100vw / 400);
        }
        .company-section-grid-item-heading__subtitle {
            padding: calc(8 * 100vw / 400);
            font-size: calc(24 * 100vw / 400);
        }
        .company-section-grid-item-heading__subtitle span {
            transform: matrix(1, 0, -0.24, 0.97, 0, 0);
        }
        .company-section-grid-item__link-icon {
            width: calc(76 * 100vw / 400);
            aspect-ratio: 1;
            position: relative;
            z-index: 1;
        }
        .company-section-grid-item__link-icon .round-link-btn__icon {
            width: calc(31 * 100vw / 400);
        }
        .company-section-grid-item::before,
        .company-section-grid-item::after {
            background-size: cover;
        }
        .company-section .link-button {
            padding: calc(10 * 100vw / 400) calc(31 * 100vw / 400);
        }
		
		.recruit-section-top__title-en-text {
			font-size: calc(56 * 100vw / 400);
		}

        .thoughts-section {
            min-height: calc(585 * 100vw / 400);
            padding: calc(40 * 100vw / 400) calc(24 * 100vw / 400);
            align-items: stretch;
            justify-content: stretch;
        }
        .thoughts-section-inner {
            flex: 1;
            gap: calc(45 * 100vw / 400);
            align-items: stretch;
            justify-content: space-between;
        }
        .thoughts-section-bg {
            inset: 0;
            background-size: contain;
            background-image: url(../img/top/thoughts-bg-sp.webp);
        }
        .thoughts-section-img {
            top: unset;
            bottom: 0;
            left: calc(63 * 100vw / 400);
            background-image: url(../img/top/thoughts-main-img-sp.webp);
            width: calc(408.3 * 100vw / 400);
            height: calc(337.1 * 100vw / 400);
            background-size: contain;
        }
        .thoughts-section-content {
            gap: calc(14 * 100vw / 400);
        }
        .thoughts-section-content .h2-jp {
            font-size: calc(38 * 100vw / 400);
            line-height: 1;
        }
        .thoughts-section-content__heading {
            gap: calc(14 * 100vw / 400);
            flex-direction: column-reverse;
        }
        .thoughts-section .white-text-body {
            max-width: 100%;
            width: 100%;
        }
        .thoughts-section .link-button {
            min-width: 100%;
            padding: calc(10 * 100vw / 400) calc(16 * 100vw / 400);
        }

        .sdgs-section {
            min-height: unset;
            padding: calc(40 * 100vw / 400) calc(24 * 100vw / 400);
            gap: calc(14 * 100vw / 400);
            background-image: url(../img/top/sdgs-bg-sp.webp);
            background-repeat: no-repeat;
            background-size: cover;
        }
        .sdgs-section-heading {
            display: flex;
            flex-direction: column-reverse;
            color: var(--base-color);
            gap: calc(14 * 100vw / 400);
        }
        .sdgs-section-heading .h2-jp {
            font-size: calc(38 * 100vw / 400);
            line-height: 1;
        }
        .sdgs-section-content {
            display: flex;
            flex-direction: column;
            gap: calc(40 * 100vw / 400);
            width: 100%;
        }
        .sdgs-section .link-button {
            width: 100%;
            gap: calc(31 * 100vw / 400);
        }
        .sdgs-section .link-button__text {
            flex: 1;
        }
        .sdgs-section .link-button__text span {
            display: block;
        }
        .sdgs-section .link-button__text span:nth-child(2) {
            text-align: right;
        }

        .recruit-section-top__content {
            gap: calc(5 * 100vw / 400);
            overflow: hidden;
        }
        .recruit-section-top__big-title {
            padding: 0;
        }
        .recruit-section-top__big-title-text {
            line-height: 1.8;
            font-size: calc(24 * 100vw / 400);
            white-space: nowrap;
            min-height: unset;
        }
        .recruit-section-bottom {
            padding: 0;
            gap: 0;
        }
        .recruit-section-hero {
            height: calc(214 * 100vw / 400);
        }

        .recruit-section-hero__bg {
            inset: 0;
            height: 100%;
            background-image: url(../img/top/recruit-bg-sp.webp);
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
        }

        .recruit-section-hero__marquee-list {
            top: calc(-1 * 100vw / 400);
            left: calc(-3 * 100vw / 400);
            width: calc(411 * 100vw / 400);
        }

        .recruit-section-hero__marquee-list-item {
            margin-bottom: 0;
            height: calc(35 * 100vw / 400);
        }

        .recruit-section-hero__marquee-list-item:nth-child(odd) {
            animation: marquee-rtl 10s linear infinite;
        }
        .recruit-section-hero__marquee-list-item:nth-child(even) {
            translate: -50% 0;
            animation: marquee-ltr 10s linear infinite;
        }

        .recruit-section-hero-staff-img {
            inset: 0;
            width: 100%;
            height: 100%;
        }

        .recruit-section-hero__big-text {
            width: calc(405 * 100vw / 400);
            left: unset;
            right: calc(-10 * 100vw / 400);
            bottom: calc(-15 * 100vw / 400);
            font-size: calc(87 * 100vw / 400);
            line-height: 1;
            letter-spacing: 0.13em;
            font-style: normal;
            transform: matrix(1, 0, -0.24, 0.97, 0, 0);
        }
        .recruit-section-hero__big-text > span:first-child {
            animation: bg-move-ltr 5s linear infinite;
            background-size: 200% 100%;
        }
        .recruit-section-hero__big-text-stroke {
            -webkit-text-stroke: calc(3 * 100vw / 400) transparent;
        }
        .recruit-section-hero__big-text > span {
            display: flex;
            flex-direction: column;
        }
        .recruit-section-hero__big-text > span > span:first-child {
            text-align: center;
            margin-bottom: calc(-34 * 100vw / 400);
            margin-left: calc(-15 * 100vw / 400);
        }
        .recruit-section-hero__big-text > span > span:last-child {
            text-align: right;
        }

        .recruit-section-link-grid {
            grid-template-columns: 1fr;
            grid-template-rows: repeat(3, 1fr);
            min-height: calc(492 * 100vw / 400);
        }
        .recruit-section-link-grid-item {
            display: flex;
            padding: calc(24 * 100vw / 400);
            border-radius: calc(2 * 100vw / 400);
            border-right: unset;
            justify-content: center;
            align-items: center;
        }
        .recruit-section-link-grid-item__inner {
            gap: calc(11 * 100vw / 400);
        }
        .recruit-section-link-grid-item__title {
            font-size: calc(40 * 100vw / 400);
            line-height: 1;
            -webkit-text-stroke: calc(1 * 100vw / 400) var(--base-color);
        }
        .recruit-section-link-grid-item__subtitle {
            padding: calc(8 * 100vw / 400);
            font-size: calc(24 * 100vw / 400);
        }
        .recruit-section-link-grid-item__subtitle > span {
            position: relative;
            z-index: 1;
        }
        .recruit-section-link-grid-item__link {
            position: absolute;
            bottom: unset;
            right: 0;
            top: 50%;
            translate: 0 -50%;
            width: calc(52 * 100vw / 400);
        }
        .recruit-section-link-grid-item__link .round-link-btn__icon {
            width: calc(21 * 100vw / 400);
        }
        .recruit-section-bottom__link {
            width: 100%;
            box-sizing: border-box;
            padding: calc(40 * 100vw / 400) calc(24 * 100vw / 400);
            padding-top: calc(33 * 100vw / 400);
        }
        .recruit-section-bottom .link-button {
            padding: calc(10 * 100vw / 400) calc(31 * 100vw / 400);
        }
    }
}
/* TOP Loading */
.loading-overlay {
    display: flex;
    position: fixed;
    inset: 0;
    z-index: 100;
    overflow: visible;
    width: 100%;
    height: 100%;
}
.loading-overlay__part-1 {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    display: flex;
    background-color: var(--base-color);
}
.loading-overlay__part-1-inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 100%;
    height: 100%;
}
.loading-overlay__part-1 .loading-overlay__text:not(:last-child) {
    margin-bottom: calc(-18.69 * var(--vw-with-scrollbar) / 1920);
}
.loading-overlay__text {
    font-family: var(--font-inter-static);
    font-weight: 900;
    font-size: calc(157.68 * var(--vw-with-scrollbar) / 1920);
    line-height: 1;
    letter-spacing: 0.06em;
    transform: var(--italic-effect);
    white-space: nowrap;
    color: var(--base-color);
    -webkit-text-stroke: calc(8 * var(--vw-with-scrollbar) / 1920) transparent;
    background: var(--main-gra-nz);
    background-clip: text;
    -webkit-background-clip: text;
    margin-left: calc(12 * var(--vw-with-scrollbar) / 1920);
}
.loading-overlay__text--highlight {
    color: transparent;
    -webkit-text-stroke-width: 0;
}
.loading-overlay__part-1 .loading-overlay__text {
    opacity: 0;
}
.loading-overlay__part-1.on .loading-overlay__text {
    animation-name: fadeIn;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
}

.loading-overlay__part-2 {
    position: absolute;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--tertiary-color);
    transform: scaleY(0);
    opacity: 0;
}
.loading-overlay__part-2.on {
    transform-origin: bottom;
    animation: scaleUpFadeInMid 0.8s ease-out forwards;
}
.loading-overlay.off .loading-overlay__part-1 {
    display: none;
}
.loading-overlay.off {
    transform-origin: top;
    animation: scaleOut 0.5s ease forwards;
    animation-delay: 0.4s;
}
.loading-overlay.off .loading-overlay__part-2 .loading-overlay__text {
    animation: fadeOut 0.4s ease-out forwards;
}

@media (max-width: 1024px) {
    .loading-overlay__part-1 .loading-overlay__text:not(:last-child) {
        /* margin-bottom: calc(-9.16 * 100vw / 400); */
        margin-bottom: 0;
    }
    .loading-overlay__text {
        font-family: var(--font-inter-static);
        font-size: calc(32.18 * 100vw / 400);
        -webkit-text-stroke: calc(3 * 100vw / 400) transparent;
        margin-left: calc(3 * 100vw / 400);
    }
    .loading-overlay__text--highlight {
        -webkit-text-stroke-width: 0;
    }
}

/* TOP Animation play state */
body[data-page-id="home"] {
    .fade-in,
    .slide-up,
    .blur-fade-up,
    .banner-clip,
    .banner-clip__text,
    .weak-blur-fade-up,
    .fade-in-letter,
    .circle-clip,
    .zoom-in-text,
    .border-heading__h::before,
    .border-heading__h::after,
    .border-heading__v::before,
    .border-heading__v::after {
        animation-play-state: paused;
    }

    .header.top-animation::after {
        transform: scaleX(0);
        transform-origin: left;
        transition: transform 0.5s 1s ease;
    }
    .header.top-animation .header-pc-grid,
    .header.top-animation .header-sp {
        opacity: 0;
        transition: opacity 0.5s 1.5s ease;
        pointer-events: none;
    }
}
body[data-page-id="home"].page-loaded {
    .fade-in,
    .slide-up,
    .blur-fade-up,
    .banner-clip,
    .banner-clip__text,
    .weak-blur-fade-up,
    .fade-in-letter,
    .circle-clip,
    .zoom-in-text,
    .border-heading__h::before,
    .border-heading__h::after,
    .border-heading__v::before,
    .border-heading__v::after {
        animation-play-state: running;
    }

    .header.top-animation::after {
        transform: scaleX(100%);
    }
    .header.top-animation .header-pc-grid,
    .header.top-animation .header-sp {
        opacity: 1;
    }
}
/* End Home Page CSS */
/* Start Feature Page CSS */
#feature-page {
    .sub-page-header__heading {
        width: clamp(0px, calc(1238 * var(--vw-with-scrollbar) / 1920), 1238px);
        width: auto;
        padding-left: clamp(
            0px,
            calc(10 * var(--vw-with-scrollbar) / 1920),
            10px
        );
    }
    .sub-page-header__bg {
        background-image: url(../img/about/about-mv.png);
    }
    .top-section {
        position: relative;
        display: flex;
        flex-direction: column;
    }
    .top-section-hero {
        position: relative;
        display: flex;
        flex-direction: column;
    }
    .top-section-hero__bg {
        position: absolute;
        inset: 0;
        background: var(--main-gra-nz-texture);
        background-size: 100%;
        z-index: -1;
    }
    .top-section-hero-mv {
        position: relative;
        display: flex;
        padding-bottom: calc(143 * var(--vw-with-scrollbar) / 1920);
        overflow: hidden;
    }
    .top-section-hero-mv__bg {
        position: relative;
        width: 100%;
        height: calc(636 * var(--vw-with-scrollbar) / 1920);
        box-sizing: border-box;
    }
    .top-section-hero-mv__bg-img {
        position: absolute;
        inset: 0;
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
    }
    .top-section-hero-mv__bg-img--gray {
        background-image: url(../img/about/about-kv-gray.webp);
    }
    .top-section-hero-mv__bg-img--main {
        background-image: url(../img/about/about-kv.webp);
    }
    .top-section-hero-mv__title {
        position: absolute;
        bottom: calc(64 * var(--vw-with-scrollbar) / 1920);
        left: 50%;
        translate: -50% 0;
        width: calc(1569 * var(--vw-with-scrollbar) / 1920);
        height: calc(215 * var(--vw-with-scrollbar) / 1920);
    }
    .top-section-hero-mv__title object {
        width: 100%;
        height: 100%;
    }
    .top-section-hero-grid {
        display: grid;
        width: 100%;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(2, auto);
    }
    .top-section-hero-grid img {
        width: 100%;
        height: auto;
        object-fit: contain;
    }
    .top-section-message {
        position: relative;
        overflow: hidden;
        height: calc(785 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(133 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(452 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(118 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        box-sizing: border-box;
        gap: calc(70 * var(--vw-with-scrollbar) / 1920);
    }
    .top-section-message__heading {
        display: flex;
        flex-direction: column;
        gap: calc(23 * var(--vw-with-scrollbar) / 1920);
        font-family: var(--font-shippori-antique);
        align-items: start;
    }
    .top-section-message__heading-small {
        margin-left: calc(10 * var(--vw-with-scrollbar) / 1920);
        font-size: calc(70 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.46;
    }
    .top-section-message__heading-large {
        font-size: calc(100 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        margin-bottom: calc(-26 * var(--vw-with-scrollbar) / 1920);
    }
    .top-section-message__heading-large .comma {
        letter-spacing: -0.38em;
    }
    .top-section-message__text {
        font-weight: bold;
        font-size: clamp(
            16px,
            calc(24 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        color: var(--base-color);
        line-height: 2.2;
        margin-left: calc(13 * var(--vw-with-scrollbar) / 1920);
    }
    .top-section-message__logo {
        position: absolute;
        top: 50%;
        left: 50%;
        translate: -50% -50%;
        width: calc(1595 * var(--vw-with-scrollbar) / 1920);
        height: auto;
        mix-blend-mode: multiply;
        opacity: 0.5;
        z-index: -1;
    }
    .top-section-message__bg {
        position: absolute;
        inset: 0;
        background: var(--main-gra-nz-texture);
        background-size: 100%;
        z-index: -2;
    }
    .content-section {
        display: flex;
        flex-direction: column;
        padding: calc(24 * var(--vw-with-scrollbar) / 1920)
            calc(30 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(160 * var(--vw-with-scrollbar) / 1920);
        gap: calc(24 * var(--vw-with-scrollbar) / 1920);
    }
    .content-card {
        box-sizing: border-box;
        padding: calc(1 * 100vw / 1920);
        background: var(--main-gra-nz-texture);
        height: calc(800 * var(--vw-with-scrollbar) / 1920);
    }
    .content-card-inner {
        position: relative;
        width: 100%;
        height: 100%;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: start;
        padding: calc(24 * var(--vw-with-scrollbar) / 1920)
            calc(70 * var(--vw-with-scrollbar) / 1920);
        gap: calc(26 * var(--vw-with-scrollbar) / 1920);
    }
    .content-card-inner__bg {
        position: absolute;
        inset: 0;
    }
    .content-card-inner__bg-img {
        position: absolute;
        inset: 0;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }
    #content-card-1 .content-card-inner__bg-img--gray {
        background-image: url(../img/about/top_business_img_1_gray.webp);
    }
    #content-card-1 .content-card-inner__bg-img--main {
        background-image: url(../img/about/top_business_img_1.webp);
    }
    #content-card-2 .content-card-inner__bg-img--gray {
        background-image: url(../img/about/top_business_img_2_gray.webp);
    }
    #content-card-2 .content-card-inner__bg-img--main {
        background-image: url(../img/about/top_business_img_2.webp);
    }
    #content-card-3 .content-card-inner__bg-img--gray {
        background-image: url(../img/about/top_business_img_3_gray.webp);
    }
    #content-card-3 .content-card-inner__bg-img--main {
        background-image: url(../img/about/top_business_img_3.webp);
    }
    .content-card-section-icon {
        width: calc(261.63 * var(--vw-with-scrollbar) / 1920);
        aspect-ratio: 1;
        box-sizing: border-box;
        position: relative;
        display: flex;
        align-items: start;
        padding-top: calc(91 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(50 * var(--vw-with-scrollbar) / 1920);
        color: var(--main-color);
    }
    .content-card-section-icon .section-header__title-letter-wrapper {
        animation: unset;
        opacity: 1;
    }
    .content-card-section-icon__img {
        position: absolute;
        width: calc(185 * var(--vw-with-scrollbar) / 1920);
        aspect-ratio: 1;
        padding: calc(1 * 100vw / 1920);
        background: var(--main-gra-nz);
        top: 0;
        left: 0;
        transform: rotate(45deg);
        translate: 70% 0;
        transform-origin: top left;
        z-index: 0;
    }
    .content-card-section-icon__img-inner {
        width: 100%;
        height: 100%;
        background: var(--silver-texture);
        background-size: cover;
        background-position: center;
    }
    .content-card-section-icon__inner {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        z-index: 1;
    }
    .content-card-section-icon__title {
        font-family: var(--font-inter);
        font-size: calc(70 * var(--vw-with-scrollbar) / 1920);
        font-weight: bold;
        line-height: 1;
        color: var(--main-color);
    }
    .content-card-section-content {
        display: flex;
        flex-direction: column;
        align-items: start;
        gap: calc(42 * var(--vw-with-scrollbar) / 1920);
    }
    .content-card .section-title::before {
        z-index: 0;
    }
    .content-card .section-title::after {
        z-index: 1;
    }
    .content-card .section-title__inner {
        z-index: 2;
    }
    .content-card__message-wrapper::before,
    .content-card__message-wrapper::after {
        z-index: 0;
    }
    .content-card__message {
        position: relative;
        font-size: clamp(
            16px,
            calc(20 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        font-weight: bold;
        line-height: 1.8;
        color: var(--base-color);
        z-index: 1;
    }
    #content-card-1 .link-button__icon {
        width: calc(31 * var(--vw-with-scrollbar) / 1920);
    }
}
@media (min-width: 1025px) {
    #feature-page {
        #content-card-3 .content-card__message-wrapper {
            max-width: calc(869 * var(--vw-with-scrollbar) / 1920);
        }
        #content-card-1 .link-button {
            padding: calc(10 * var(--vw-with-scrollbar) / 1920)
                calc(54 * var(--vw-with-scrollbar) / 1920);
        }

        .animate-pc .border-heading__h::before {
            animation-delay: 1s !important;
        }
        .animate-pc .border-heading__v::after {
            animation-delay: 1.2s !important;
        }
        .animate-pc .border-heading__h::after {
            animation-delay: 1.4s !important;
        }
        .animate-pc .border-heading__v::before {
            animation-delay: 1.6s !important;
        }
    }
}
@media (max-width: 1024px) {
    #feature-page {
        .sub-page-header__heading {
            width: fit-content;
            padding: 0;
        }
        .sub-page-header__bg {
            background-image: url(../img/about/about-mv-sp.png);
        }
        .top-section__bg {
            position: absolute;
            top: calc(307 * var(--vw-with-scrollbar) / 400);
            bottom: 0;
            width: 100%;
            background: var(--main-gra-nz-texture);
            background-size: 120%;
            z-index: -1;
        }
        .top-section-hero-mv {
            position: relative;
            display: flex;
            padding-bottom: calc(157 * var(--vw-with-scrollbar) / 400);
        }
        .top-section-hero-mv__bg {
            height: calc(307 * var(--vw-with-scrollbar) / 400);
        }
        .top-section-hero-mv__bg-img--main {
            background-image: url(../img/about/about-kv-sp.webp);
        }
        .top-section-hero-mv__bg-img--gray {
            background-image: url(../img/about/about-kv-sp.webp);
            filter: grayscale();
        }
        .top-section-hero-mv__title {
            position: absolute;
            bottom: calc(26 * var(--vw-with-scrollbar) / 400);
            width: calc(369 * var(--vw-with-scrollbar) / 400);
            height: calc(175 * var(--vw-with-scrollbar) / 400);
        }
        .top-section-hero-grid {
            grid-template-columns: repeat(2, 1fr);
            grid-template-rows: repeat(3, auto);
        }
        .top-section-hero-grid img {
            height: calc(90 * var(--vw-with-scrollbar) / 400);
            object-fit: cover;
            object-position: center;
        }
        .top-section-message {
            position: relative;
            overflow: hidden;
            height: calc(704 * var(--vw-with-scrollbar) / 400);
            padding: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(29 * var(--vw-with-scrollbar) / 400);
            justify-content: start;
            gap: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .top-section-message__heading {
            width: 100%;
            gap: calc(30 * var(--vw-with-scrollbar) / 400);
            align-items: center;
        }
        .top-section-message__heading-small {
            font-size: calc(24 * var(--vw-with-scrollbar) / 400);
            line-height: 1;
        }
        .top-section-message__heading-large {
            font-size: calc(60 * var(--vw-with-scrollbar) / 400);
            line-height: 1.2;
            margin: 0;
        }
        .top-section-message__heading-large-sp-wrapper {
            width: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .top-section-message__text {
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
            color: var(--base-color);
            line-height: 1.8;
            margin-left: 0;
        }
        .top-section-message__heading-large .comma {
            letter-spacing: -0.38em;
        }
        .top-section-message__logo {
            width: calc(542 * var(--vw-with-scrollbar) / 400);
        }
        .content-section {
            padding: 0;
            gap: 0;
            padding-top: calc(44 * var(--vw-with-scrollbar) / 400);
        }
        .content-card {
            background: transparent;
            height: fit-content;
            padding: 0;
        }
        .content-card-inner {
            padding: calc(80 * var(--vw-with-scrollbar) / 400) 0;
            align-items: center;
            gap: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .content-card-inner__bg-img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            background-size: cover 100%;
            background-repeat: no-repeat;
            background-position: center;
        }
        #content-card-1 .content-card-inner__bg {
            height: calc(359 * var(--vw-with-scrollbar) / 400);
        }
        #content-card-1 .content-card-inner__bg-img--gray,
        #content-card-1 .content-card-inner__bg-img--main {
            background-image: url(../img/about/top_business_img_1-sp.webp);
        }
        #content-card-2 .content-card-inner__bg {
            height: calc(371 * var(--vw-with-scrollbar) / 400);
        }
        #content-card-2 .content-card-inner__bg-img--gray,
        #content-card-2 .content-card-inner__bg-img--main {
            background-image: url(../img/about/top_business_img_2-sp.webp);
        }
        #content-card-3 .content-card-inner__bg {
            height: calc(315 * var(--vw-with-scrollbar) / 400);
        }
        #content-card-3 .content-card-inner__bg-img--gray,
        #content-card-3 .content-card-inner__bg-img--main {
            background-image: url(../img/about/top_business_img_3-sp.webp);
        }
        #content-card-1 .content-card-inner__bg-img--gray,
        #content-card-2 .content-card-inner__bg-img--gray,
        #content-card-3 .content-card-inner__bg-img--gray {
            filter: grayscale();
        }
        .content-card-inner__filter {
            position: absolute;
            top: calc(40 * var(--vw-with-scrollbar) / 400);
            left: 0;
            right: 0;
            bottom: 0;
            width: 100%;
            background: linear-gradient(
                180deg,
                rgba(0, 64, 152, 0) 0%,
                #082956 35.87%,
                #111111 100%
            );
        }

        .content-card-section-icon .section-header__title {
            font-size: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .content-card-section-icon {
            width: calc(191 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(73 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(28 * var(--vw-with-scrollbar) / 400);
            color: var(--main-color);
        }
        .content-card-section-icon__img {
            width: calc(135.2 * var(--vw-with-scrollbar) / 400);
            padding: calc(1 * 100vw / 400);
        }
        .content-card-section-icon__title {
            font-family: var(--font-inter);
            font-size: calc(50 * 100vw / 400);
            font-weight: bold;
            line-height: 1;
            color: var(--main-color);
        }
        .content-card-section-content {
            width: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: calc(20 * var(--vw-with-scrollbar) / 400);
        }

        .content-card .section-title {
            width: 100vw;
            height: calc(185 * var(--vw-with-scrollbar) / 400);
            padding: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .content-card .section-title__inner {
            font-size: calc(40 * var(--vw-with-scrollbar) / 400);
            box-sizing: border-box;
        }
        .content-card .section-title__letter {
            line-height: 1.313;
        }
        .content-card .border-heading__v::before,
        .content-card .border-heading__v::after {
            width: calc(3 * var(--vw-with-scrollbar) / 400);
        }
        .content-card .border-heading__h::before,
        .content-card .border-heading__h::after {
            height: calc(3 * var(--vw-with-scrollbar) / 400);
        }
        .content-card .border-heading__v::before,
        .content-card .border-heading__v::after,
        .content-card .border-heading__h::before,
        .content-card .border-heading__h::after {
            background-repeat: no-repeat;
            position: relative;
            background-size: 100%;
        }
        .content-card .border-heading__h {
            z-index: 5;
        }
        .content-card .border-heading__v {
            padding: calc(3 * var(--vw-with-scrollbar) / 400) 0;
            z-index: 5;
        }
        .content-card .border-heading__h::before {
            background-image: url(../img/about/border-h-before.png);
        }
        .content-card .border-heading__h::after {
            background-image: url(../img/about/border-h-after.png);
        }
        .content-card .border-heading__v::before {
            background-image: url(../img/about/border-v-before.png);
        }
        .content-card .border-heading__v::after {
            background-image: url(../img/about/border-v-after.png);
        }
        .content-card__message-wrapper {
            margin-top: calc(-50 * var(--vw-with-scrollbar) / 400);
            box-sizing: border-box;
            max-width: calc(352 * var(--vw-with-scrollbar) / 400);
            padding: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(14.5 * var(--vw-with-scrollbar) / 400);
            z-index: 5;
        }
        .content-card__message {
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
        }
        .content-card .link-button {
            width: calc(352 * var(--vw-with-scrollbar) / 400);
            box-sizing: border-box;
            margin-bottom: calc(20 * var(--vw-with-scrollbar) / 400);
            padding: calc(10 * var(--vw-with-scrollbar) / 400)
                calc(33 * var(--vw-with-scrollbar) / 400);
            gap: 0;
        }
        .content-card .link-button__text {
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
        }
        .content-card .link-button__icon {
            width: calc(60 * var(--vw-with-scrollbar) / 400);
        }
        #content-card-1 .link-button__icon {
            width: calc(23 * var(--vw-with-scrollbar) / 400);
        }
    }
}
/* End Feature Page CSS */
/* Star News Page CSS */
#news-page {
    .content-section {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        padding-bottom: calc(72 * var(--vw-with-scrollbar) / 1920);
    }
    .content-section::before {
        background: var(--main-gra-nz);
    }
    .category-section {
        display: flex;
        justify-content: center;
        align-items: center;
        box-sizing: border-box;
        padding: calc(75 * var(--vw-with-scrollbar) / 1920)
            calc(20 * var(--vw-with-scrollbar) / 1920);
        gap: calc(17 * var(--vw-with-scrollbar) / 1920);
    }
    .category-btn {
        position: relative;
        min-width: calc(275 * var(--vw-with-scrollbar) / 1920);
        padding: calc(24 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(25 * var(--vw-with-scrollbar) / 1920);
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: var(--base-color);
    }
    .category-btn::before {
        content: "";
        position: absolute;
        inset: 0;
        background: var(--main-gra-nz-texture);
        background-size: 100%;
        opacity: 0;
        transition: opacity 0.3s;
        z-index: 0;
    }
    .category-btn > span {
        position: relative;
        transition: color 0.4s;
        font-size: clamp(
            16px,
            calc(20 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        font-weight: 500;
        line-height: 1;
        text-align: center;
        color: var(--sub-color);
        z-index: 1;
    }
    .category-btn--active > span {
        color: var(--base-color);
    }
    .category-btn--active::before {
        opacity: 1;
    }
    .content-grid-wrapper {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: calc(75 * var(--vw-with-scrollbar) / 1920);
    }
    .content-grid {
        width: 100%;
        box-sizing: border-box;
        display: grid;
        padding: 0 calc(100 * var(--vw-with-scrollbar) / 1920);
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(3, auto);
        column-gap: calc(36.77 * var(--vw-with-scrollbar) / 1920);
        row-gap: calc(59.26 * var(--vw-with-scrollbar) / 1920);
    }
    .content-grid-item {
        display: flex;
        flex-direction: column;
        min-height: calc(488.74 * var(--vw-with-scrollbar) / 1920);
        color: var(--base-color);
        overflow: hidden;
    }
    .content-grid-item:nth-child(1) {
        align-items: start;
        justify-content: center;
    }
    .content-grid-item__big-title-wrapper {
        position: relative;
        left: calc(24 * var(--vw-with-scrollbar) / 1920);
    }
    .content-grid-item__big-title {
        font-family: var(--font-shippori-antique);
        font-size: calc(66 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.2;
        font-weight: normal;
        letter-spacing: -0.11em;
        transform: var(--italic-effect);
    }
    .no-post-div {
        width: 100%;
        height: calc(800 * var(--vw-with-scrollbar) / 1920);
        color: var(--base-color);
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .no-post-div h1 {
        font-size: calc(50 * var(--vw-with-scrollbar) / 1920);
    }
}
@media (min-width: 1025px) {
    #news-page {
        .sub-page-header__heading {
            min-width: clamp(
                0px,
                calc(554 * var(--vw-with-scrollbar) / 1920),
                554px
            );
        }
        .content-grid-item:nth-child(2),
        .content-grid-item:nth-child(3) {
            transform: translateX(
                calc(-17.66 * var(--vw-with-scrollbar) / 1920)
            );
        }
    }
}
@media (max-width: 1024px) {
    #news-page {
        .content-section {
            padding-bottom: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .category-section {
            padding: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(20 * var(--vw-with-scrollbar) / 400);
            gap: calc(17 * var(--vw-with-scrollbar) / 400);
        }
        .category-btn {
            min-width: calc(150 * var(--vw-with-scrollbar) / 400);
            padding: calc(24 * var(--vw-with-scrollbar) / 400);
            padding-bottom: calc(25 * var(--vw-with-scrollbar) / 400);
        }
        .category-btn > span {
            font-size: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .content-grid-wrapper {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            gap: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .content-grid {
            display: flex;
            flex-direction: column;
            align-items: stretch;
            padding: 0 calc(16 * var(--vw-with-scrollbar) / 400);
            gap: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .content-grid-item {
            display: flex;
            flex-direction: column;
            min-height: fit-content;
        }
        .content-grid-item:nth-child(1) {
            align-items: start;
            justify-content: center;
        }
        .content-grid-item__big-title-wrapper {
            position: relative;
            left: calc(25 * var(--vw-with-scrollbar) / 400);
        }
        .content-grid-item__big-title {
            font-size: calc(44 * var(--vw-with-scrollbar) / 400);
        }
        .no-post-div {
            height: calc(800 * var(--vw-with-scrollbar) / 400);
        }
        .no-post-div h1 {
            font-size: calc(24 * var(--vw-with-scrollbar) / 400);
        }
    }
}
/* End News Page CSS */
/* Start News Detail Page CSS */
#news-detail {
    color: white;

    /* Reuse Style */
    .meta-data {
        display: flex;
        align-items: center;
        gap: calc(10 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
    }
    .meta-data__date {
        font-family: var(--font-inter);
        font-weight: bold;
        font-size: clamp(
            16px,
            calc(26 * var(--vw-with-scrollbar) / 1920),
            99px
        );
    }
    .meta-data__category {
        box-sizing: border-box;
        padding: calc(9 * var(--vw-with-scrollbar) / 1920);
        border: calc(1 * 100vw / 1920) solid white;
        line-height: 1;
        font-size: clamp(
            12px,
            calc(16 * var(--vw-with-scrollbar) / 1920),
            99px
        );
    }
    .content-margin {
        padding: 0 calc(6 * var(--vw-with-scrollbar) / 1920);
    }

    /* Layout Style */

    .news-detail-frame {
        display: flex;
        justify-content: stretch;
        padding-top: calc(64 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(123 * var(--vw-with-scrollbar) / 1920);
    }
    .news-detail-frame-inner {
        width: 100%;
        margin: 0 auto;
        max-width: calc(1000 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: calc(177 * var(--vw-with-scrollbar) / 1920);
    }
    .content-section {
        display: flex;
        flex-direction: column;
        align-items: start;
    }
    .content-section .meta-data {
        margin-bottom: calc(27 * var(--vw-with-scrollbar) / 1920);
    }
    .content-section__title {
        font-size: calc(26 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.23;
        margin-bottom: calc(24 * var(--vw-with-scrollbar) / 1920);
    }
    .content-section__feature-image {
        width: 100%;
        height: auto;
        min-height: calc(554 * var(--vw-with-scrollbar) / 1920);
        object-fit: contain;
        background-color: #d9d9d9;
        margin-bottom: calc(32 * var(--vw-with-scrollbar) / 1920);
    }
    .content-section__post-content {
        width: 100%;
        box-sizing: border-box;
        font-weight: 500;
        font-size: clamp(
            14px,
            calc(16 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        margin-bottom: calc(25 * var(--vw-with-scrollbar) / 1920);
    }
    .content-section__post-content .only-text {
        display: inline-block;
        max-width: calc(612 * var(--vw-with-scrollbar) / 1920);
    }
    .content-section__post-content img {
        width: 100%;
        height: auto;
        margin: calc(32 * var(--vw-with-scrollbar) / 1920) 0;
    }
    .content-section__post-content > *:last-child {
        margin-bottom: 0;
    }
    .back-to-list-btn {
        min-width: calc(244 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.8;
    }
    .silver-btn__text {
        padding-right: calc(10 * var(--vw-with-scrollbar) / 1920);
    }
    .other-news-section {
        padding-top: calc(56 * var(--vw-with-scrollbar) / 1920);
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(2, auto);
        column-gap: calc(85 * var(--vw-with-scrollbar) / 1920);
        row-gap: calc(32 * var(--vw-with-scrollbar) / 1920);
        border-top-width: calc(1 * 100vw / 1920);
        border-top-style: solid;
        border-top-color: var(--base-color);
    }
    .other-news-section-item {
        position: relative;
        overflow: hidden;
        min-height: calc(349 * var(--vw-with-scrollbar) / 1920);
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        gap: calc(12 * var(--vw-with-scrollbar) / 1920);
    }
    .other-news-section-item__img {
        width: 100%;
        height: calc(256 * var(--vw-with-scrollbar) / 1920);
        background-color: #d9d9d9;
    }
    .other-news-section-item__img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .other-news-section-item__inner {
        display: flex;
        flex-direction: column;
        gap: calc(12 * var(--vw-with-scrollbar) / 1920);
        max-width: calc(373 * var(--vw-with-scrollbar) / 1920);
        align-items: start;
    }
    .other-news-section-item__excerpt {
        font-size: clamp(
            12px,
            calc(14 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        color: white;
        font-weight: 500;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1.4;
    }
    .other-news-section-item__decoration {
        position: absolute;
        width: calc(21 * var(--vw-with-scrollbar) / 1920);
        height: auto;
        bottom: calc(25 * var(--vw-with-scrollbar) / 1920);
        right: calc(15 * var(--vw-with-scrollbar) / 1920);
    }
    .loading-text {
        height: calc(1585 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        justify-content: center;
        align-items: center;
    }
}
@media (max-width: 1024px) {
    #news-detail {
        /* Reuse Style */
        .meta-data {
            display: flex;
            align-items: center;
            gap: calc(10 * var(--vw-with-scrollbar) / 400);
            line-height: 1;
        }
        .meta-data__date {
            font-family: var(--font-inter);
            font-weight: bold;
            font-size: calc(26 * var(--vw-with-scrollbar) / 400);
        }
        .meta-data__category {
            box-sizing: border-box;
            padding: calc(9 * var(--vw-with-scrollbar) / 400);
            border: calc(1 * 100vw / 400) solid white;
            line-height: 1;
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
        }
        .content-margin {
            padding: 0;
        }

        /* Layout Style */

        .news-detail-frame {
            display: flex;
            justify-content: stretch;
            padding: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .news-detail-frame-inner {
            margin: 0;
            max-width: unset;
            gap: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .content-section {
            display: flex;
            flex-direction: column;
            align-items: start;
            gap: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .content-section .meta-data {
            margin-bottom: 0;
        }
        .content-section__title {
            line-height: 1.23;
			font-size:calc(18 * var(--vw-with-scrollbar) / 400);
            margin-bottom: 0;
        }
        .content-section__feature-image {
            width: 100%;
            height: auto;
            min-height: fit-content;
            margin-bottom: 0;
        }
        .content-section__post-content {
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
            margin-bottom: 0;
        }
        .content-section__post-content .only-text {
            max-width: 100%;
        }
        .content-section__post-content img {
            width: 100%;
            height: auto;
            margin: calc(40 * var(--vw-with-scrollbar) / 400) 0;
        }
        .content-section__post-content > *:last-child {
            margin-bottom: 0;
        }
        .back-to-list-btn {
            min-width: 100%;
        }
        .content-margin:has(.back-to-list-btn) {
            display: flex;
            width: 100%;
        }
        .silver-btn__text {
            font-size: calc(20 * var(--vw-with-scrollbar) / 400);
            padding-right: calc(10 * var(--vw-with-scrollbar) / 400);
        }
        .other-news-section {
            padding-top: calc(40 * var(--vw-with-scrollbar) / 400);
            display: flex;
            flex-direction: column;
            gap: calc(40 * var(--vw-with-scrollbar) / 400);
            border-top-width: calc(1 * 100vw / 400);
        }
        .other-news-section-item {
            min-height: fit-content;
            gap: calc(12 * var(--vw-with-scrollbar) / 400);
            flex-direction: row;
            align-items: center;
        }
        .other-news-section-item .meta-data {
            gap: calc(8 * var(--vw-with-scrollbar) / 400);
        }
        .other-news-section-item .meta-data__date {
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
        }
        .other-news-section-item .meta-data__category {
            padding: calc(4 * var(--vw-with-scrollbar) / 400)
                calc(8 * var(--vw-with-scrollbar) / 400);
            font-size: calc(12 * var(--vw-with-scrollbar) / 400);
        }
        .other-news-section-item__img {
            width: calc(135 * var(--vw-with-scrollbar) / 400);
            height: calc(94.5 * var(--vw-with-scrollbar) / 400);
            flex-shrink: 0;
        }
        .other-news-section-item__inner {
            gap: calc(12 * var(--vw-with-scrollbar) / 400);
            max-width: 100%;
            align-items: start;
        }
        .other-news-section-item__excerpt {
            font-size: calc(14 * var(--vw-with-scrollbar) / 400);
        }
        .other-news-section-item__decoration {
            position: static;
            align-self: end;
            width: calc(21 * var(--vw-with-scrollbar) / 400);
            height: auto;
            bottom: calc(25 * var(--vw-with-scrollbar) / 400);
            right: calc(15 * var(--vw-with-scrollbar) / 400);
        }
    }
}
/* End News Detail Page CSS */
/* Start About Page CSS */
#about-page {
    .top-section {
        position: relative;
        padding-top: calc(181 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(96 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(128 * var(--vw-with-scrollbar) / 1920);
        box-sizing: border-box;
        gap: calc(58 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        flex-direction: column;
        align-items: start;
        color: var(--base-color);
        background: linear-gradient(
                270deg,
                rgba(0, 64, 152, 0) 0%,
                #004098 59.62%,
                #111111 100%
            ),
            url(../img/about-page/about-page-bg.webp);
        background-size: contain;
        background-repeat: no-repeat;
        overflow: hidden;
    }
    .top-section-title-wrapper {
        transform: var(--italic-effect);
    }
    .top-section-title {
        font-family: var(--font-shippori-antique);
        font-size: calc(70 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        font-weight: normal;
        letter-spacing: -0.11em;
    }
    .top-section-content {
        display: flex;
        flex-direction: column;
        align-items: start;
        font-weight: bold;
    }
    .top-section-content .section-header__icon {
        color: var(--base-color);
    }
    .top-section-content__sub-header {
        font-size: calc(70 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.8;
        margin-bottom: calc(10 * var(--vw-with-scrollbar) / 1920);
    }
    .top-section-content__message {
        font-size:calc(24 * var(--vw-with-scrollbar) / 1920);
    }
    .top-section-content__closing-text {
        align-self: flex-end;
        margin-top: calc(-12 * var(--vw-with-scrollbar) / 1920);
        margin-top: .5em;
        margin-right: calc(30 * var(--vw-with-scrollbar) / 1920);
        font-size: clamp(
            16px,
            calc(30 * var(--vw-with-scrollbar) / 1920),
            99px
        );
    }
    .top-section-content__staff-img {
        position: absolute;
        bottom: 0;
        right: calc(100 * var(--vw-with-scrollbar) / 1920);
        width: calc(803 * var(--vw-with-scrollbar) / 1920);
        height: auto;
    }
    .top-section-decoration-frame {
        display: flex;
        justify-content: flex-end;
        margin-top: calc(-284 * var(--vw-with-scrollbar) / 1920);
        margin-bottom: calc(-400 * var(--vw-with-scrollbar) / 1920);
        overflow: hidden;
    }
    .top-section-decoration {
        position: relative;
        right: calc(-188.44 * var(--vw-with-scrollbar) / 1920);
        width: calc(694 * var(--vw-with-scrollbar) / 1920);
        height: auto;
        z-index: 5;
    }
    .company-section {
        display: grid;
        grid-template-columns: calc(391 * var(--vw-with-scrollbar) / 1920) 1fr;
        grid-auto-rows: minmax(min-content, auto);
        margin-bottom: calc(2 * var(--vw-with-scrollbar) / 1920);
        align-items: stretch;
        color: var(--main-color);
        background-color: var(--base-color);
    }
    .company-section-grid {
        position: relative;
        overflow: visible;
        border-color: var(--main-color);
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        justify-content: end;
    }
    .company-section-grid:nth-of-type(even) {
        border-left-width: calc(1 * 100vw / 1920);
        border-left-style: solid;
    }
    #company-grid-1 {
        padding-top: calc(101 * var(--vw-with-scrollbar) / 1920);
        align-items: end;
    }
    #company-grid-1 .company-section-grid__heading {
        display: flex;
        flex-direction: column;
        align-items: start;
    }
    #company-grid-1 h1 {
        font-size: calc(70 * var(--vw-with-scrollbar) / 1920);
        margin-bottom: calc(-25 * var(--vw-with-scrollbar) / 1920);
    }
    #company-grid-5 {
        height: calc(74 * var(--vw-with-scrollbar) / 1920);
    }
    #company-grid-1::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: calc(-0.5 * 100vw / 1920);
        height: calc(2 * 100vw / 1920);
        background: var(--main-gra-nz);
    }
    #company-grid-2 h1 {
        opacity: 0.2;
        font-family: var(--font-inter);
        font-size: calc(100 * var(--vw-with-scrollbar) / 1920);
        letter-spacing: 0.3em;
        line-height: 1.21;
        margin-bottom: calc(-22 * var(--vw-with-scrollbar) / 1920);
        margin-left: calc(-2 * var(--vw-with-scrollbar) / 1920);
    }
    #company-grid-4 .company-info-list {
        display: flex;
        flex-direction: column;
        width: 100%;
    }
    #company-grid-4 .company-info-list__item {
        display: grid;
        height: calc(80 * var(--vw-with-scrollbar) / 1920);
        grid-template-columns: calc(244 * var(--vw-with-scrollbar) / 1920) 1fr;
        grid-template-rows: 1fr;
        column-gap: calc(10 * var(--vw-with-scrollbar) / 1920);
        align-items: end;
        justify-content: start;
    }
    #company-grid-4 .company-info-list__item:not(:last-child) {
        border-bottom-width: calc(1 * 100vw / 1920);
        border-bottom-style: solid;
        border-color: var(--main-color);
    }
    #company-grid-4 h2 {
        font-size: clamp(
            18px,
            calc(32 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        line-height: 1.1;
    }
    #company-grid-4 span {
        font-size: clamp(
            16px,
            calc(20 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        line-height: 1;
        font-weight: 500;
    }
    #company-grid-4 .company-info-list__item:not(:last-child) span {
        margin-bottom: calc(6 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.25;
    }
    .company-info-list__sub-grid {
        display: flex;
        flex-wrap: wrap;
        justify-content: start;
        row-gap: calc(7 * var(--vw-with-scrollbar) / 1920);
        column-gap: calc(19 * var(--vw-with-scrollbar) / 1920);
        margin-bottom: calc(2 * var(--vw-with-scrollbar) / 1920);
    }
    .company-info-list__break {
        flex-basis: 100%;
        height: 0;
    }
    .history-section {
        display: flex;
        flex-direction: column;
        width: 100%;
        position: relative;
        background: linear-gradient(180deg, #111215 0%, #004098 100%);
        padding-top: calc(108 * var(--vw-with-scrollbar) / 1920);
        overflow: hidden;
    }
    .history-section__bg {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: calc(4251 * var(--vw-with-scrollbar) / 1920);
        object-fit: cover;
        object-position: bottom center;
        mix-blend-mode: multiply;
        z-index: 0;
    }
    .history-section-top {
        position: absolute;
        top: 0;
        right: 20%;
        display: flex;
        justify-content: center;
        /*margin-bottom: calc(60 * var(--vw-with-scrollbar) / 1920);*/
    }
    .history-section-top__bg-text {
        position: absolute;
        top: calc(122 * var(--vw-with-scrollbar) / 1920);
        left: 50%;
        translate: -50% 0;
        min-width: calc(800 * var(--vw-with-scrollbar) / 1920);
        font-family: var(--font-inter);
        font-size: calc(90 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.21;
        letter-spacing: 0.07em;
        font-weight: 900;
        text-align: center;
        background: var(--main-gra-nz);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        transform: var(--italic-effect);
        z-index: 0;
    }
    .history-section-top__header {
        position: relative;
        width: calc(140 * var(--vw-with-scrollbar) / 1920);
        height: calc(450 * var(--vw-with-scrollbar) / 1920);
    }
    .history-section-top__header g:nth-of-type(2) {
        animation-delay: 0.5s;
    }
    .history-section-top__header g:nth-of-type(3) {
        animation-delay: 1s;
    }
    .history-content {
        display: flex;
        flex-direction: column;
        gap: calc(147 * var(--vw-with-scrollbar) / 1920);
        align-items: start;
    }
    .history-content-header {
        position: relative;
        left: calc(87 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        flex-direction: column;
        gap: calc(28 * var(--vw-with-scrollbar) / 1920);
        align-items: start;
    }
    .history-content-header h1 {
        width: calc(623 * var(--vw-with-scrollbar) / 1920);
        text-align: center;
        color: var(--base-color);
        font-family: var(--font-inter);
        font-weight: bold;
        font-size: calc(140 * var(--vw-with-scrollbar) / 1920);
        line-height: 0.75;
        transform: var(--italic-effect);
    }
    .history-content-timeline {
        position: relative;
        left: calc(575 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        flex-direction: column;
        gap: calc(20 * var(--vw-with-scrollbar) / 1920);
        max-width: calc(979 * var(--vw-with-scrollbar) / 1920);
        width: 100%;
        padding-bottom: calc(90 * var(--vw-with-scrollbar) / 1920);
    }
    .history-content-timeline__line-pc-wrapper {
        position: absolute;
        top: 0;
        bottom: 0;
        left: calc(60 * var(--vw-with-scrollbar) / 1920);
        width: calc(4 * var(--vw-with-scrollbar) / 1920);
        z-index: 1;
    }
    .history-content-timeline__line-pc {
        width: 100%;
        height: 100%;
        background-color: var(--base-color);
        background: linear-gradient(
            180deg,
            #f5f5f5 94.43%,
            rgba(143, 143, 143, 0) 100%
        );
        transform-origin: top;
    }
    .history-content-timeline-item {
        position: relative;
        display: flex;
        width: 100%;
        align-items: center;
        gap: calc(70 * var(--vw-with-scrollbar) / 1920);
        z-index: 2;
        animation-duration: 0.3s !important;
    }
    .history-content-timeline-item-circle {
        position: relative;
        z-index: 2;
        width: calc(120 * var(--vw-with-scrollbar) / 1920);
        aspect-ratio: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background-image: url(../img/about-page/silver-sphere.webp);
        background-size: 100%;
        background-repeat: no-repeat;
        color: var(--main-color);
        font-weight: bold;
        line-height: 1;
    }
    .history-content-timeline-item-circle__top-text {
        font-size:
            calc(24 * var(--vw-with-scrollbar) / 1920);
        text-align: center;
    }
    .history-content-timeline-item-circle__divider {
        width: calc(77 * var(--vw-with-scrollbar) / 1920);
        height: calc(2 * var(--vw-with-scrollbar) / 1920);
        margin-top: calc(11 * var(--vw-with-scrollbar) / 1920);
        margin-bottom: calc(10 * var(--vw-with-scrollbar) / 1920);
        background-color: var(--main-color);
    }
    .history-content-timeline-item-circle__bottom-text {
        font-size:
            calc(36 * var(--vw-with-scrollbar) / 1920);
        text-align: center;
    }
    .history-content-timeline-item__text {
        font-size: 
            calc(24 * var(--vw-with-scrollbar) / 1920);
        color: var(--base-color);
        line-height: 1.4;
        font-weight: bold;
    }
    }
    .history-content-decoration {
        display: flex;
        align-items: start;
        margin-top: calc(-505 * var(--vw-with-scrollbar) / 1920);
        margin-bottom: calc(-179 * var(--vw-with-scrollbar) / 1920);
        overflow: hidden;
    }
    .history-content-decoration__item {
        position: relative;
        height: calc(684 * var(--vw-with-scrollbar) / 1920);
        width: auto;
        left: calc(-270 * var(--vw-with-scrollbar) / 1920);
        z-index: 2;
    }
    .access-section {
        display: flex;
        padding-top: calc(68 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(145 * var(--vw-with-scrollbar) / 1920);
        background-color: var(--main-color);
        justify-content: space-between;
    }
    .access-section__map {
        width: calc(1124 * var(--vw-with-scrollbar) / 1920);
        height: calc(680 * var(--vw-with-scrollbar) / 1920);
    }
    .access-content {
        display: flex;
        flex-direction: column;
        align-items: start;
        color: var(--base-color);
    }
    .access-header {
        padding-top: calc(132 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        flex-direction: column;
        align-items: start;
        gap: calc(15 * var(--vw-with-scrollbar) / 1920);
    }
    .access-header .section-header__icon rect {
        fill: var(--base-color);
    }
    .access-header h2 {
        font-size: calc(70 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        font-weight: 700;
    }
    .access-content h1 {
        font-family: var(--font-inter);
        margin-top: calc(-33 * var(--vw-with-scrollbar) / 1920);
        margin-left: calc(17 * var(--vw-with-scrollbar) / 1920);
        margin-bottom: calc(49 * var(--vw-with-scrollbar) / 1920);
        font-family: var(--font-inter);
        font-size: calc(100 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.21;
        letter-spacing: 0.35em;
        opacity: 0.3;
        font-weight: bold;
    }
    .access-content__contact {
        font-weight: bold;
        font-size: clamp(
            16px,
            calc(20 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        line-height: 1.5;
    }
    .access-content__contact h3 {
        font-size: clamp(
            16px,
            calc(24 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        line-height: 2;
    }
    .access-content__contact .tel-number {
        text-decoration: underline;
        text-underline-offset: 0.1em;
        text-decoration-thickness: 0.05em;
    }
}
@media (min-width: 1025px) {
    #about-page {
        #company-grid-4 {
            border-bottom-width: calc(1 * 100vw / 1920);
            border-bottom-style: solid;
        }
        #company-grid-2::before {
            content: "";
            position: absolute;
            left: 0;
            right: calc(196 * var(--vw-with-scrollbar) / 1920);
            bottom: 0;
            height: calc(1 * 100vw / 1920);
            background: var(--main-color);
        }
        #company-grid-3::before {
            content: "";
            position: absolute;
            left: calc(8 * var(--vw-with-scrollbar) / 1920);
            right: 0;
            bottom: 0;
            height: calc(1 * 100vw / 1920);
            background: var(--main-color);
        }
        #company-grid-4 li:nth-child(6) {
            height: calc(100 * var(--vw-with-scrollbar) / 1920);
        }
        #company-grid-4 li:nth-child(7) {
            height: calc(150 * var(--vw-with-scrollbar) / 1920);
        }
    }
}
@media (max-width: 1024px) {
    #about-page {
        .top-section {
            position: relative;
            padding-top: calc(32 * var(--vw-with-scrollbar) / 400);
            padding-left: 0;
            padding-bottom: calc(80 * var(--vw-with-scrollbar) / 400);
            gap: calc(191 * var(--vw-with-scrollbar) / 400);
            background: linear-gradient(270deg, #004098 0%, #111111 100%);
        }
        .top-section::before {
            content: "";
            position: absolute;
            inset: 0;
            background: url(../img/black-bg-20.webp);
            background-size: 100%;
            z-index: 0;
        }
        .top-section-title-wrapper {
            padding-left: calc(32 * var(--vw-with-scrollbar) / 400);
            padding-right: calc(140 * var(--vw-with-scrollbar) / 400);
            transform: unset;
        }
        .top-section-title {
            position: relative;
            font-family: var(--font-shippori-antique);
            font-size: calc(50 * var(--vw-with-scrollbar) / 400);
            line-height: 1.2;
            letter-spacing: -0.11em;
            z-index: 1;
        }
        .top-section-content {
            position: relative;
            padding: 0 calc(24 * var(--vw-with-scrollbar) / 400);
            z-index: 1;
        }
        .top-section-content__sub-header {
            font-size: calc(32 * var(--vw-with-scrollbar) / 400);
            margin-bottom: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .top-section-content__message {
            max-width: 100%;
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
        }
        .top-section-content__closing-text {
            margin: calc(10 * var(--vw-with-scrollbar) / 400) 0;
            font-size: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .top-section-content__staff-img {
            position: absolute;
            bottom: unset;
            right: unset;
            top: calc(114 * var(--vw-with-scrollbar) / 400);
            left: calc(116 * var(--vw-with-scrollbar) / 400);
            width: calc(411.77 * var(--vw-with-scrollbar) / 400);
        }
        .top-section-decoration-frame {
            margin-bottom: calc(-154.8 * var(--vw-with-scrollbar) / 400);
            margin-top: calc(-80 * var(--vw-with-scrollbar) / 400);
        }
        .top-section-decoration {
            position: relative;
            right: calc(-81 * var(--vw-with-scrollbar) / 400);
            width: calc(239 * var(--vw-with-scrollbar) / 400);
        }
        .company-section {
            display: grid;
            grid-template-columns: calc(155 * var(--vw-with-scrollbar) / 400) 1fr;
            margin-bottom: 0;
        }
        .company-section-grid:nth-of-type(even) {
            border-left-width: calc(1 * 100vw / 400);
            border-left-style: solid;
        }
        .company-section-grid:nth-of-type(even):not(:last-child) {
            border-bottom-width: calc(1 * 100vw / 400);
            border-bottom-style: solid;
        }
        #company-grid-1 {
            padding-top: calc(78 * var(--vw-with-scrollbar) / 400);
        }
        #company-grid-1 h1 {
            font-size: calc(32 * var(--vw-with-scrollbar) / 400);
            margin-bottom: calc(-12 * var(--vw-with-scrollbar) / 400);
        }
        #company-grid-5 {
            height: calc(48 * var(--vw-with-scrollbar) / 400);
        }
        #company-grid-1::before {
            left: calc(17 * var(--vw-with-scrollbar) / 400);
            bottom: 0;
            height: calc(1 * 100vw / 400);
        }
        #company-grid-2 h1 {
            font-size: calc(40 * var(--vw-with-scrollbar) / 400);
            letter-spacing: 0.1em;
            line-height: 1.2;
            margin-bottom: calc(-9 * var(--vw-with-scrollbar) / 400);
            margin-left: calc(-1 * var(--vw-with-scrollbar) / 400);
        }
        #company-grid-4 .company-info-list__item {
            padding-top: calc(30 * var(--vw-with-scrollbar) / 400);
            height: fit-content;
            display: flex;
            flex-direction: column;
            gap: calc(15 * var(--vw-with-scrollbar) / 400);
            align-items: start;
        }
        #company-grid-4 .company-info-list__item:not(:last-child) {
            border-bottom-width: calc(1 * 100vw / 400);
        }
        #company-grid-4 h2 {
            font-size: calc(24 * var(--vw-with-scrollbar) / 400);
            line-height: 1;
        }
        #company-grid-4 span {
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
        }
        #company-grid-4 .company-info-list__item:not(:last-child) span {
            margin-bottom: 0;
        }
        .company-info-list__sub-grid {
            max-width: 100%;
            display: flex;
            align-items: start;
            gap: calc(10 * var(--vw-with-scrollbar) / 400);
            margin-bottom: 0;
        }

        .history-section {
            padding-top: calc(63 * var(--vw-with-scrollbar) / 400);
        }
        .history-section-top {
            position: relative;
            right: unset;
            margin-bottom: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .history-section__bg {
            height: calc(2851 * var(--vw-with-scrollbar) / 400);
        }
        .history-section-top__bg-text {
            position: absolute;
            top: 0;
            min-width: calc(238 * var(--vw-with-scrollbar) / 400);
            max-width: calc(238 * var(--vw-with-scrollbar) / 400);
            font-family: var(--font-inter);
            font-size: calc(50 * var(--vw-with-scrollbar) / 400);
            line-height: 1.22;
            padding-left: calc(5 * var(--vw-with-scrollbar) / 400);
        }
        .history-section-top__header {
            position: relative;
            margin-top: calc(27 * var(--vw-with-scrollbar) / 400);
            margin-top: 0;
            padding-right: calc(2 * var(--vw-with-scrollbar) / 400);
            width: calc(158 * var(--vw-with-scrollbar) / 400);
            height: calc(390 * var(--vw-with-scrollbar) / 400);
        }
        .history-content {
            margin-top: -6rem;
            gap: calc(40 * var(--vw-with-scrollbar) / 400);
            box-sizing: border-box;
            padding: 0 calc(25 * var(--vw-with-scrollbar) / 400);
        }
        .history-content-header {
            left: unset;
            align-self: start;
            gap: calc(28 * var(--vw-with-scrollbar) / 400);
        }
        .history-content-header h1 {
            width: calc(250 * var(--vw-with-scrollbar) / 400);
            font-size: calc(56 * var(--vw-with-scrollbar) / 400);
            line-height: 0.75;
        }
        .history-content-timeline {
            left: unset;
            gap: calc(39 * var(--vw-with-scrollbar) / 400);
            max-width: 100%;
            width: 100%;
            box-sizing: border-box;
            padding-bottom: calc(188 * var(--vw-with-scrollbar) / 400);
        }
        .history-content-timeline-item {
            flex-direction: column;
            align-items: center;
            gap: calc(8 * var(--vw-with-scrollbar) / 400);
        }
        .history-content-timeline-item-circle {
            width: calc(126 * var(--vw-with-scrollbar) / 400);
        }
        .history-content-timeline-item-circle__top-text {
            font-size: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .history-content-timeline-item-circle__divider {
            width: calc(77 * var(--vw-with-scrollbar) / 400);
            height: calc(2 * var(--vw-with-scrollbar) / 400);
            margin-top: calc(11 * var(--vw-with-scrollbar) / 400);
            margin-bottom: calc(5 * var(--vw-with-scrollbar) / 400);
        }
        .history-content-timeline-item-circle__bottom-text {
            font-size: calc(24 * var(--vw-with-scrollbar) / 400);
        }
        .history-content-timeline-item__text {
            font-size: calc(20 * var(--vw-with-scrollbar) / 400);
            text-align: center;
        }
        .history-content-timeline
            > .history-content-timeline-item:nth-of-type(1)
            .history-content-timeline-item__text {
            /*opacity: 0.3;*/
        }
        .history-content-timeline__line-sp {
            position: absolute;
            left: 50%;
            translate: -50% 0;
            width: calc(4 * var(--vw-with-scrollbar) / 400);
            opacity: 0.3;
            z-index: 1;
        }
        .history-content-timeline__line-sp > div {
            height: 100%;
            width: 100%;
            background-color: var(--base-color);
            transform-origin: top;
        }
        .history-content-timeline__line-sp--top {
            top: 0;
            height: calc(381 * var(--vw-with-scrollbar) / 400);
        }
        .history-content-timeline__line-sp--bottom {
            bottom: 0;
            height: calc(369 * var(--vw-with-scrollbar) / 400);
        }
        .history-content-decoration {
            margin-top: calc(-158 * var(--vw-with-scrollbar) / 400);
            margin-bottom: calc(-76.73 * var(--vw-with-scrollbar) / 400);
        }
        .history-content-decoration__item {
            width: calc(239 * var(--vw-with-scrollbar) / 400);
            height: auto;
            left: calc(-74 * var(--vw-with-scrollbar) / 400);
        }
        .access-section {
            flex-direction: column;
            gap: calc(29 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(107 * var(--vw-with-scrollbar) / 400);
            padding-left: 0;
            justify-content: start;
            align-items: start;
            position: relative;
        }
        .access-section__map {
            width: 100%;
            box-sizing: border-box;
            height: calc(236 * var(--vw-with-scrollbar) / 400);
            padding: 0 calc(30 * var(--vw-with-scrollbar) / 400);
        }
        .access-header {
            padding-top: 0;
            gap: calc(15 * var(--vw-with-scrollbar) / 400);
            margin-bottom: calc(9 * var(--vw-with-scrollbar) / 400);
        }
        .access-header h2 {
            font-size: calc(32 * var(--vw-with-scrollbar) / 400);
        }
        .access-content {
            padding: 0 calc(33 * var(--vw-with-scrollbar) / 400);
        }
        .access-content h1 {
            position: absolute;
            top: calc(116 * var(--vw-with-scrollbar) / 400);
            right: calc(13 * var(--vw-with-scrollbar) / 400);
            margin: 0;
            font-size: calc(70 * var(--vw-with-scrollbar) / 400);
            line-height: 1.21;
            letter-spacing: 0;
        }
        .access-content__contact {
            font-weight: bold;
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
            line-height: 1.5;
        }
        .access-content__contact h3 {
            font-size: calc(20 * var(--vw-with-scrollbar) / 400);
            line-height: 2;
        }
        .access-content__contact .tel-number {
            text-decoration: underline;
            text-underline-offset: 0.1em;
            text-decoration-thickness: 0.05em;
        }
    }
}
/* End About Page CSS */
/* Start Recruit Page CSS */
body:not(.page-loaded) .staff-picker-content-section * {
    transition: none !important;
}
#recruit-side-content {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: end;
    pointer-events: none;

    .content-col {
        position: sticky;
        top: calc(88 * var(--vw-with-scrollbar) / 1920);
        right: 0;
        margin-top: calc(1160 * var(--vw-with-scrollbar) / 1920);
        width: calc(185 * var(--vw-with-scrollbar) / 1920);
        height: calc(360 * var(--vw-with-scrollbar) / 1920);
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: 1fr 1fr;
        z-index: 2;
    }

    .content-col > a {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: calc(20 * var(--vw-with-scrollbar) / 1920);
        box-shadow: 0px calc(4 * var(--vw-with-scrollbar) / 1920)
            calc(14 * var(--vw-with-scrollbar) / 1920) rgba(0, 0, 0, 0.25);
        pointer-events: all;
    }

    .cta-btn__icon {
        width: calc(25 * var(--vw-with-scrollbar) / 1920);
    }
    .cta-btn__icon svg {
        position: relative;
        left: calc(1 * var(--vw-with-scrollbar) / 1920);
        width: calc(12 * var(--vw-with-scrollbar) / 1920);
    }

    .application-guidelines {
        gap: calc(10 * var(--vw-with-scrollbar) / 1920);
        font-size: calc(24 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        font-weight: bold;
    }

    .entry-form {
        color: var(--main-color);
    }
    .entry-form .cta-btn__text {
        position: relative;
        min-width: calc(131 * var(--vw-with-scrollbar) / 1920);
        font-family: var(--font-shippori-antique);
        font-size: calc(24 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.1;
        background: var(--main-gra-nz);
        transition: background 0.4s ease;
    }
    .entry-form:hover .cta-btn__text {
        background: var(--base-color);
    }
    .entry-form .cta-btn__icon {
        position: absolute;
        right: 0;
        bottom: 0;
        width: calc(25 * var(--vw-with-scrollbar) / 1920);
    }
}

@media (max-width: 1024px) {
    #recruit-side-content {

        .content-col {
            position: fixed;
            /* top: calc(470 * var(--vw-with-scrollbar) / 1024); */

            top: unset;
            bottom: 0;
            margin-top: 0;
            width: calc(240 * var(--vw-with-scrollbar) / 1024);
            height: calc(390 * var(--vw-with-scrollbar) / 1024);
        }

        .content-col > a {
            flex-direction: column;
            font-size: calc(38 * var(--vw-with-scrollbar) / 1024);
        }

        .cta-btn__icon {
            width: calc(50 * var(--vw-with-scrollbar) / 1024);
        }
        .cta-btn__icon svg {
            left: calc(1 * var(--vw-with-scrollbar) / 1024);
            width: calc(22 * var(--vw-with-scrollbar) / 1024);
        }

        .application-guidelines {
            gap: calc(10 * var(--vw-with-scrollbar) / 1024);
            font-size: calc(38 * var(--vw-with-scrollbar) / 1024);
        }

        .entry-form .cta-btn__text {
            min-width: calc(131 * var(--vw-with-scrollbar) / 1920);
            font-size: calc(38 * var(--vw-with-scrollbar) / 1024);
        }
        .entry-form .cta-btn__icon {
            position: relative;
            width: calc(50 * var(--vw-with-scrollbar) / 1024);
            margin: 0 auto;
        }
    }
}

#recruit-page {
    .hero-section {
        padding-top: clamp(
            0px,
            calc(11 * var(--vw-with-scrollbar) / 1920),
            11px
        );
        min-height: clamp(
            0px,
            calc(1223 * var(--vw-with-scrollbar) / 1920),
            1223px
        );
        position: relative;
        overflow: hidden;
        font-family: var(--font-shippori-antique);
        color: white;
        line-height: 1.45;
        white-space: nowrap;
    }
    .hero-bg {
        position: absolute;
        top: clamp(0px, calc(77 * var(--vw-with-scrollbar) / 1920), 77px);
        left: 0;
        width: 100%;
        height: clamp(
            0px,
            calc(1000 * var(--vw-with-scrollbar) / 1920),
            1000px
        );
        background-image: url(../img/recruit/recruit-hero-bg.webp);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }
    .hero-bg > * {
        position: absolute;
        inset: 0;
    }
    .hero-bg__line {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        mix-blend-mode: multiply;
        animation-duration: 0.5s;
    }
    .hero-staff-img {
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: clamp(0px, calc(1923 * var(--vw-with-scrollbar) / 1920), 1923px);
        height: clamp(
            0px,
            calc(1223 * var(--vw-with-scrollbar) / 1920),
            1223px
        );
        object-fit: cover;
    }

    .hero-section .h1-wrapper {
        position: absolute;
        top: clamp(-79px, calc(-79 * var(--vw-with-scrollbar) / 1920), 0px);
        left: 50%;
        width: clamp(0px, calc(1358 * var(--vw-with-scrollbar) / 1920), 1358px);
        transform: translateX(-50%);
    }

    .hero-section h1 {
        font-size: clamp(
            0px,
            calc(522 * var(--vw-with-scrollbar) / 1920),
            522px
        );
        letter-spacing: -0.2em;
        font-weight: 400;
    }

    .hero-section .h2-wrapper {
        position: absolute;
        top: clamp(0px, calc(363 * var(--vw-with-scrollbar) / 1920), 363px);
        left: 50%;
        transform: translateX(-50%);
        margin-left: clamp(0px, calc(-54 * var(--vw-with-scrollbar) / 1920), 54px);
        /* width: calc(2104 * var(--vw-with-scrollbar) / 1920); */
        width: calc(1920 * var(--vw-with-scrollbar) / 1920);
        max-width: 2104px;
    }

    .hero-section h2 {
        font-weight: 400;
        font-size: clamp(
            0px,
            calc(400 * var(--vw-with-scrollbar) / 1920),
            370px
        );
        letter-spacing: -0.1em;
    }

    .hero-section h2 span {
        letter-spacing: -0.28em;
    }

    .hero-section .banner-slide-in {
        position: absolute;
        bottom: clamp(0px, calc(146 * var(--vw-with-scrollbar) / 1920), 146px);
        left: 50%;
        transform: translateX(-50%);
        margin-right: clamp(0px, calc(7 * var(--vw-with-scrollbar) / 1920), 7px);
        width: calc(1864 * var(--vw-with-scrollbar) / 1920);
        max-width: 1864px;
    }

    .hero-section .banner-slide-in__content::before {
        background-color: var(--base-color);
    }

    .hero-section h3 {
        text-align: center;
        font-weight: 400;
        font-size: clamp(
            0px,
            calc(160 * var(--vw-with-scrollbar) / 1920),
            160px
        );
        letter-spacing: -0.17em;
    }

    .hero-msg-section {
        margin-top: calc(-43 * var(--vw-with-scrollbar) / 1920);
        margin-bottom: calc(61 * var(--vw-with-scrollbar) / 1920);
        padding: 0 calc(100 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        flex-direction: column;
    }
    .hero-msg-bubble {
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        background: var(--main-gra-nz-texture);
        background-size: cover;
    }
    .hero-msg-bubble__inner {
        position: relative;
        height: calc(440.5 * var(--vw-with-scrollbar) / 1920);
        overflow: hidden;
    }
    .hero-msg-bubble__inner > * {
        position: absolute;
    }

    .hero-msg-bubble__inner span {
        font-family: var(--font-shippori-antique);
        font-size: calc(150 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.4;
        letter-spacing: -0.11em;
        color: white;
        transform: var(--italic-effect);
    }

    .hero-msg-bubble__inner picture {
        top: calc(-4.5 * var(--vw-with-scrollbar) / 1920);
        left: calc(318 * var(--vw-with-scrollbar) / 1920);
        width: calc(1067 * var(--vw-with-scrollbar) / 1920);
        height: calc(435 * var(--vw-with-scrollbar) / 1920);
    }

    .hero-msg-bubble__inner picture > img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    .hero-msg-bubble__text-pc {
        top: calc(-4.5 * var(--vw-with-scrollbar) / 1920);
        left: calc(533 * var(--vw-with-scrollbar) / 1920);
        width: calc(684 * var(--vw-with-scrollbar) / 1920);
        text-align: center;
    }

    .hero-msg-bubble__tail {
        display: flex;
    }
    .hero-msg-bubble__tail::before,
    .hero-msg-bubble__tail::after {
        content: "";
        flex: 1;
        border-bottom: calc(140 * var(--vw-with-scrollbar) / 1920) solid white;
    }
    .hero-msg-bubble__tail::before {
        border-right: calc(72 * var(--vw-with-scrollbar) / 1920) solid
            transparent;
    }
    .hero-msg-bubble__tail::after {
        border-left: calc(72 * var(--vw-with-scrollbar) / 1920) solid
            transparent;
    }

    .hero-speech-section {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: calc(34 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(257 * var(--vw-with-scrollbar) / 1920);
        padding-right: calc(241 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(95 * var(--vw-with-scrollbar) / 1920);
        box-sizing: border-box;
        color: var(--main-color);
    }
    .hero-speech-section__header {
        display: flex;
        transform: var(--italic-effect);
    }
    .hero-speech-section__header > span {
        font-family: var(--font-shippori-antique);
        font-size: calc(120 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        letter-spacing: -0.11em;
    }
    .hero-speech-section p {
        font-weight: 700;
        font-size: calc(30 * var(--vw-with-scrollbar) / 1920);
        letter-spacing: 0.3em;
        line-break: 1.93;
        text-align: center;
    }
    .staff-picker-section {
        display: flex;
        flex-direction: column;
        align-items: center;
        background-color: var(--base-color);
        padding-top: calc(73 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(47 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(28 * var(--vw-with-scrollbar) / 1920);
        padding-right: calc(28 * var(--vw-with-scrollbar) / 1920);
    }
    .staff-picker-header {
        display: flex;
        flex-direction: column;
        gap: calc(40 * var(--vw-with-scrollbar) / 1920);
        align-items: center;
        padding-bottom: calc(66 * var(--vw-with-scrollbar) / 1920);
    }

    .staff-picker-header span {
        background: var(--main-gra-nz-texture);
        line-height: 1;
        font-family: var(--font-shippori-antique);
        font-size: calc(128 * var(--vw-with-scrollbar) / 1920);
    }

    .staff-picker-header picture {
        height: calc(26 * var(--vw-with-scrollbar) / 1920);
    }

    .staff-picker-header img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    .staff-picker-list__frame {
        width: 100%;
    }

    .staff-picker-list {
        display: grid;
        width: 100%;
        height: calc(592 * var(--vw-with-scrollbar) / 1920);
        grid-template-columns: repeat(4, 1fr);
        grid-template-rows: 1fr;
        gap: calc(24 * var(--vw-with-scrollbar) / 1920);
    }

    .staff-picker-list-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        box-shadow: 0px calc(4 * var(--vw-with-scrollbar) / 1920)
            calc(9 * var(--vw-with-scrollbar) / 1920) rgba(0, 0, 0, 0.25);
        color: white;
        justify-content: end;
        padding-bottom: calc(10 * var(--vw-with-scrollbar) / 1920);
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }
    .staff-picker-list-item h1 {
        font-weight: 400;
        font-family: var(--font-shippori-antique);
        font-size: calc(59 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        letter-spacing: -0.17em;
        transform: var(--italic-effect);
        text-align: center;
        height: calc(130 * var(--vw-with-scrollbar) / 1920);
    }
    .staff-picker-list-item::after {
        content: "";
        width: calc(92 * var(--vw-with-scrollbar) / 1920);
        height: calc(45 * var(--vw-with-scrollbar) / 1920);
        background-image: url(../img/recruit/down-arrow.svg);
        background-size: contain;
    }
    .staff-picker-list-item[data-index="1"] {
        background-image: url(../img/recruit/staff-pick-1.webp);
    }
    .staff-picker-list-item[data-index="2"] {
        background-image: url(../img/recruit/staff-pick-2.webp);
        gap: calc(17 * var(--vw-with-scrollbar) / 1920);
    }
    .staff-picker-list-item[data-index="3"] {
        background-image: url(../img/recruit/staff-pick-3.webp);
        gap: calc(10 * var(--vw-with-scrollbar) / 1920);
    }
    .staff-picker-list-item[data-index="4"] {
        background-image: url(../img/recruit/staff-pick-4.webp);
        gap: calc(21 * var(--vw-with-scrollbar) / 1920);
    }

    .staff-picker-list-item[data-index="2"] h1 {
        height: calc(177 * var(--vw-with-scrollbar) / 1920);
    }
    
    .staff-picker-content-section {
        display: flex;
        flex-direction: column;
        position: relative;
        overflow: hidden;
    }
    .staff-picker-content-top-slide {
        position: relative;
        width: 100%;
        height: calc(810 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        justify-content: end;
        align-items: end;
        color: var(--base-color);
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }

    .staff-picker-content-top-slide__fg-img {
        position: absolute;
        inset: 0;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        /* transition: filter 0.8s ease, opacity 0.8s ease, transform 0.8s ease; */
    }

    #staff-info-slide-1 .staff-picker-content-top-slide {
        background-image: url(../img/recruit/recruit-staff-bg-1.webp);
    }

    #staff-info-slide-2 .staff-picker-content-top-slide {
        background-image: url(../img/recruit/recruit-staff-bg-2.webp);
    }

    #staff-info-slide-3 .staff-picker-content-top-slide {
        background-image: url(../img/recruit/recruit-staff-bg-3.webp);
    }

    #staff-info-slide-4 .staff-picker-content-top-slide {
        background-image: url(../img/recruit/recruit-staff-bg-4.webp);
    }

    #staff-info-slide-1 .staff-picker-content-top-slide__fg-img {
        background-image: url(../img/recruit/recruit-staff-fg-1.webp);
    }

    #staff-info-slide-2 .staff-picker-content-top-slide__fg-img {
        background-image: url(../img/recruit/recruit-staff-fg-2.webp);
    }

    #staff-info-slide-3 .staff-picker-content-top-slide__fg-img {
        background-image: url(../img/recruit/recruit-staff-fg-3.webp);
    }

    #staff-info-slide-4 .staff-picker-content-top-slide__fg-img {
        background-image: url(../img/recruit/recruit-staff-fg-4.webp);
    }

    .staff-picker-content {
        position: absolute;
        top: 0;
        left: 0;
        display: flex;
        flex-direction: column;
        /* Animation */
        transform: translateX(-100%);
        -webkit-transform: translateX(-100%);
        opacity: 0;
        transition: transform 0.5s ease-in-out, opacity 0.5s,
            -webkit-transform 0.5s ease-in-out;
    }

    .staff-picker-content.active {
        position: relative;
        opacity: 1;
        transform: translateX(0);
        -webkit-transform: translateX(0);
    }

    .staff-picker-content-top-info {
        display: flex;
        flex-direction: column;
        gap: calc(26 * var(--vw-with-scrollbar) / 1920);
        padding-right: calc(100 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(50 * var(--vw-with-scrollbar) / 1920);
    }

    .staff-picker-content-top-slide h1 {
        background: var(--main-gra-nz-texture);
        background-size: cover;
        font-family: var(--font-shippori-antique);
        font-weight: 400;
        font-size: calc(60 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        letter-spacing: 0.03em;
        transform: var(--italic-effect);
    }

    .staff-picker-content-top-info__header {
        position: relative;
    }

    .staff-picker-content-top-info__grid {
        width: fit-content;
        position: relative;
        display: grid;
        grid-template-columns: repeat(2, auto);
        grid-template-rows: repeat(4, auto);
        align-items: stretch;
    }

    .staff-picker-content-top-info__grid-item {
        font-size: calc(30 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.4;
        padding: calc(10 * var(--vw-with-scrollbar) / 1920) 0;
        font-weight: 500;
    }

    .staff-picker-content-bottom {
        display: flex;
        flex-direction: column;
        background-image: url(../img/recruit/content-bg.webp);
        background-size: contain;
        min-height: calc(1467 * var(--vw-with-scrollbar) / 1920);
    }
    .staff-picker-content-slide {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(2, auto);
        padding: calc(135 * var(--vw-with-scrollbar) / 1920)
            calc(183 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(133 * var(--vw-with-scrollbar) / 1920);
        column-gap: calc(48 * var(--vw-with-scrollbar) / 1920);
        row-gap: calc(56 * var(--vw-with-scrollbar) / 1920);
        box-sizing: border-box;
    }
    .staff-picker-content-slide-item {
        position: relative;
        display: flex;
        overflow: hidden;
    }
    .staff-picker-content-slide-item__bg {
        position: relative;
        width: 100%;
        height: auto;
        -webkit-clip-path: inset(0 0 100% 0);
        clip-path: inset(0 0 100% 0);
    }

    .staff-picker-content-slide-item__bg img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        transform: scale(1.5);
    }

    .section-animate .staff-picker-content-slide-item__bg {
        animation: clipYDown 0.6s ease forwards;
    }
    .section-animate .staff-picker-content-slide-item__bg img {
        animation: zoomOut 1s ease forwards;
    }

    .staff-picker-content-slide-item__text {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        box-sizing: border-box;
        padding: calc(15.5 * var(--vw-with-scrollbar) / 1920)
            calc(18 * var(--vw-with-scrollbar) / 1920);
        color: var(--base-color);
        font-size: clamp(
            16px,
            calc(24 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        line-height: 1.54;
        font-weight: bold;
    }
    .staff-picker-content-slide-item__text-bg {
        position: absolute;
        z-index: 0;
        inset: 0;
        background: var(--main-gra-nz);
        mix-blend-mode: multiply;
        backdrop-filter: opacity(1);
    }
    .staff-picker-content-slide-item__text p {
        position: relative;
    }
    .staff-picker-content-slide-item__header {
        position: absolute;
        top: 0;
    }

    .staff-picker-content-slide-item__header img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    .staff-content-decoration {
        position: absolute;
        width: calc(696.44 * var(--vw-with-scrollbar) / 1920);
        height: calc(684 * var(--vw-with-scrollbar) / 1920);
        top: calc(405 * var(--vw-with-scrollbar) / 1920);
        left: calc(-293 * var(--vw-with-scrollbar) / 1920);
        z-index: 2;
        object-fit: contain;
    }

    #staff-content-slide-1
        .staff-picker-content-slide-item:nth-child(1)
        .staff-picker-content-slide-item__header {
        width: calc(152 * var(--vw-with-scrollbar) / 1920);
        height: calc(368 * var(--vw-with-scrollbar) / 1920);
        right: calc(25 * var(--vw-with-scrollbar) / 1920);
    }
    #staff-content-slide-1
        .staff-picker-content-slide-item:nth-child(2)
        .staff-picker-content-slide-item__header {
        width: calc(114 * var(--vw-with-scrollbar) / 1920);
        height: calc(279 * var(--vw-with-scrollbar) / 1920);
        right: calc(34 * var(--vw-with-scrollbar) / 1920);
    }
    #staff-content-slide-1
        .staff-picker-content-slide-item:nth-child(3)
        .staff-picker-content-slide-item__header {
        width: calc(112 * var(--vw-with-scrollbar) / 1920);
        height: calc(337 * var(--vw-with-scrollbar) / 1920);
        left: calc(100 * var(--vw-with-scrollbar) / 1920);
    }
    #staff-content-slide-1
        .staff-picker-content-slide-item:nth-child(4)
        .staff-picker-content-slide-item__header {
        width: calc(163 * var(--vw-with-scrollbar) / 1920);
        height: calc(263 * var(--vw-with-scrollbar) / 1920);
        left: calc(85 * var(--vw-with-scrollbar) / 1920);
    }

    #staff-content-slide-2
        .staff-picker-content-slide-item:nth-child(1)
        .staff-picker-content-slide-item__header {
        width: calc(112 * var(--vw-with-scrollbar) / 1920);
        height: calc(321 * var(--vw-with-scrollbar) / 1920);
        left: calc(102 * var(--vw-with-scrollbar) / 1920);
    }
    #staff-content-slide-2
        .staff-picker-content-slide-item:nth-child(2)
        .staff-picker-content-slide-item__header {
        width: calc(108 * var(--vw-with-scrollbar) / 1920);
        height: calc(349 * var(--vw-with-scrollbar) / 1920);
        right: calc(25 * var(--vw-with-scrollbar) / 1920);
    }
    #staff-content-slide-2
        .staff-picker-content-slide-item:nth-child(3)
        .staff-picker-content-slide-item__header {
        width: calc(214 * var(--vw-with-scrollbar) / 1920);
        height: calc(313 * var(--vw-with-scrollbar) / 1920);
        right: calc(34 * var(--vw-with-scrollbar) / 1920);
    }
    #staff-content-slide-2
        .staff-picker-content-slide-item:nth-child(4)
        .staff-picker-content-slide-item__header {
        width: calc(163 * var(--vw-with-scrollbar) / 1920);
        height: calc(300 * var(--vw-with-scrollbar) / 1920);
        right: calc(96 * var(--vw-with-scrollbar) / 1920);
    }

    #staff-content-slide-3
        .staff-picker-content-slide-item:nth-child(1)
        .staff-picker-content-slide-item__header {
        width: calc(112 * var(--vw-with-scrollbar) / 1920);
        height: calc(337 * var(--vw-with-scrollbar) / 1920);
        left: calc(102 * var(--vw-with-scrollbar) / 1920);
    }
    #staff-content-slide-3
        .staff-picker-content-slide-item:nth-child(2)
        .staff-picker-content-slide-item__header {
        width: calc(114 * var(--vw-with-scrollbar) / 1920);
        height: calc(279 * var(--vw-with-scrollbar) / 1920);
        left: calc(117 * var(--vw-with-scrollbar) / 1920);
    }
    #staff-content-slide-3
        .staff-picker-content-slide-item:nth-child(3)
        .staff-picker-content-slide-item__header {
        width: calc(163 * var(--vw-with-scrollbar) / 1920);
        height: calc(240 * var(--vw-with-scrollbar) / 1920);
        left: calc(142 * var(--vw-with-scrollbar) / 1920);
    }
    #staff-content-slide-3
        .staff-picker-content-slide-item:nth-child(4)
        .staff-picker-content-slide-item__header {
        width: calc(108 * var(--vw-with-scrollbar) / 1920);
        height: calc(279 * var(--vw-with-scrollbar) / 1920);
        right: calc(25 * var(--vw-with-scrollbar) / 1920);
    }

    #staff-content-slide-4 {
        padding-right: calc(179 * var(--vw-with-scrollbar) / 1920);
        grid-template-columns: calc(751 * var(--vw-with-scrollbar) / 1920) 1fr;
    }

    #staff-content-slide-4
        .staff-picker-content-slide-item:nth-child(1)
        .staff-picker-content-slide-item__header {
        width: calc(152 * var(--vw-with-scrollbar) / 1920);
        height: calc(393 * var(--vw-with-scrollbar) / 1920);
        right: calc(25 * var(--vw-with-scrollbar) / 1920);
    }
    #staff-content-slide-4
        .staff-picker-content-slide-item:nth-child(2)
        .staff-picker-content-slide-item__header {
        width: calc(113 * var(--vw-with-scrollbar) / 1920);
        height: calc(311 * var(--vw-with-scrollbar) / 1920);
        right: calc(37 * var(--vw-with-scrollbar) / 1920);
    }
    #staff-content-slide-4
        .staff-picker-content-slide-item:nth-child(3)
        .staff-picker-content-slide-item__header {
        width: calc(112 * var(--vw-with-scrollbar) / 1920);
        height: calc(412 * var(--vw-with-scrollbar) / 1920);
        left: calc(99 * var(--vw-with-scrollbar) / 1920);
    }
    #staff-content-slide-4
        .staff-picker-content-slide-item:nth-child(4)
        .staff-picker-content-slide-item__header {
        width: calc(114 * var(--vw-with-scrollbar) / 1920);
        height: calc(279 * var(--vw-with-scrollbar) / 1920);
        right: calc(40 * var(--vw-with-scrollbar) / 1920);
    }

    .card-grid-section {
        display: flex;
        background-color: var(--base-color);
    }
    .card-grid-section-header {
        display: flex;
        padding-top: calc(415 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(153 * var(--vw-with-scrollbar) / 1920);
        padding-right: calc(125 * var(--vw-with-scrollbar) / 1920);
        gap: calc(20 * var(--vw-with-scrollbar) / 1920);
        align-items: top;
    }
    .card-grid-section-header h1 {
        font-family: var(--font-shippori-antique);
        font-weight: 1;
        line-height: 1;
        font-size: calc(100 * var(--vw-with-scrollbar) / 1920);
        writing-mode: vertical-lr;
        text-orientation: upright;
        background: var(--main-gra-nz);
        height: fit-content;
        max-width: calc(97 * var(--vw-with-scrollbar) / 1920);
        letter-spacing: -0.01em;
    }
    .card-grid-section-header h1:nth-child(2) {
        animation-delay: 0.4s;
    }
    .card-grid-section-inner {
        display: grid;
        width: 100%;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(
            4,
            calc(401 * var(--vw-with-scrollbar) / 1920)
        );
        background-color: white;
    }
    .card-grid-section-item__wrapper {
        position: relative;
        perspective: calc(741 * var(--vw-with-scrollbar) / 1920);
    }
    .card-grid-section-item__wrapper:nth-child(even) {
        animation-delay: 0.2s !important;
    }

    .card-grid-section-item {
        position: absolute;
        inset: 0;
        transition: transform 800ms cubic-bezier(0.63, -0.32, 0.4, 1.39);
        backface-visibility: hidden;
    }

    .card-grid-section-item--front {
        border-image-source: var(--main-gra-nz);
        border-image-slice: 1;
        border-style: solid;
        border-left-width: calc(2 * var(--vw-with-scrollbar) / 1920);
        border-bottom-width: calc(2 * var(--vw-with-scrollbar) / 1920);
        border-right-width: 0;
        border-top-width: 0;
        transform: rotateY(0deg);
        background-color: white;
        display: flex;
    }

    .card-grid-section-item--back {
        background: var(--main-gra-nz-texture);
        background-size: cover;
        transform: rotateY(180deg);
    }

    .card-grid-section-item h1 {
        position: absolute;
        margin-top: calc(-12 * var(--vw-with-scrollbar) / 1920);
        top: calc(30 * var(--vw-with-scrollbar) / 1920);
        left: calc(26 * var(--vw-with-scrollbar) / 1920);
        font-size: calc(50 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        transform: matrix(1, 0, -0.11, 0.99, 0, 0);
        font-weight: 500;
    }

    .card-grid-section-item--front h1 {
        color: transparent;
        background-clip: text !important;
        -webkit-background-clip: text !important;
        -webkit-text-fill-color: transparent;
        background: var(--main-gra-nz);
    }

    .card-grid-section-item h2 {
        font-size: calc(50 * var(--vw-with-scrollbar) / 1920);
        padding: calc(3.5 * var(--vw-with-scrollbar) / 1920)
            calc(40 * var(--vw-with-scrollbar) / 1920)
            calc(7.5 * var(--vw-with-scrollbar) / 1920)
            calc(40 * var(--vw-with-scrollbar) / 1920);
        height: fit-content;
        line-height: 1.2;
        font-weight: 500;
    }

    .card-grid-section-item--back {
        color: white;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding-top: calc(48 * var(--vw-with-scrollbar) / 1920);
    }

    .card-grid-section-item--front h2 {
        color: var(--base-color);
        background: var(--main-gra-nz);
    }
    .card-grid-section-item--back h2 {
        width: fit-content;
        background: white;
        text-align: center;
    }
    .card-grid-section-item--back h2 > span {
        background: var(--main-gra-nz-texture);
        background-size: cover;
        color: transparent;
        background-clip: text !important;
        -webkit-background-clip: text !important;
        -webkit-text-fill-color: transparent;
    }

    .card-grid-section-item--back h3 {
        display: inline;
        font-size: calc(80 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        font-weight: 500;
    }
    .card-grid-section-item--back h4 {
        display: inline;
        font-size: calc(60 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        font-weight: 500;
    }
    .card-grid-section-item--back h5 {
        display: inline;
        font-size: calc(30 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        font-weight: 500;
    }

    .card-grid-section-item--back .inner-row {
        display: flex;
        align-items: center;
    }

    .card-grid-section-item__wrapper.flipped {
        .card-grid-section-item--front {
            transform: rotateY(-180deg);
        }
        .card-grid-section-item--back {
            transform: rotateY(0deg);
        }
    }

    .card-grid-section-item img {
        object-fit: contain;
    }

    #card-grid-item-01 .card-grid-section-item--front {
        padding-top: calc(135 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(84 * var(--vw-with-scrollbar) / 1920);
        gap: calc(57 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-01 img {
        width: calc(126 * var(--vw-with-scrollbar) / 1920);
        height: calc(147 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-01 .card-grid-section-item--front h2 {
        margin-top: calc(40 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-02 .card-grid-section-item--front {
        padding-top: calc(151 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(67 * var(--vw-with-scrollbar) / 1920);
        gap: calc(40 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-02 img {
        width: calc(160 * var(--vw-with-scrollbar) / 1920);
        height: calc(132 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-02 .card-grid-section-item--front h2 {
        margin-top: calc(41 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-03 .card-grid-section-item--front {
        padding-top: calc(160 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(73 * var(--vw-with-scrollbar) / 1920);
        gap: calc(51 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-03 img {
        width: calc(178 * var(--vw-with-scrollbar) / 1920);
        height: calc(110 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-03 .card-grid-section-item--front img {
        margin-top: calc(13 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-04 .card-grid-section-item--front {
        padding-top: calc(172 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(83 * var(--vw-with-scrollbar) / 1920);
        gap: calc(57 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-04 img {
        width: calc(127 * var(--vw-with-scrollbar) / 1920);
        height: calc(131 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-04 .card-grid-section-item--front h2 {
        margin-top: calc(17 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-05 .card-grid-section-item--front {
        padding-top: calc(150 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(89 * var(--vw-with-scrollbar) / 1920);
        gap: calc(67 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-05 img {
        width: calc(146 * var(--vw-with-scrollbar) / 1920);
        height: calc(146 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-05 .card-grid-section-item--front h2 {
        margin-top: calc(30 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-06 .card-grid-section-item--front {
        padding-top: calc(157 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(67 * var(--vw-with-scrollbar) / 1920);
        gap: calc(41 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-06 img {
        width: calc(159 * var(--vw-with-scrollbar) / 1920);
        height: calc(127 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-06 .card-grid-section-item--front h2 {
        margin-top: calc(18 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-07 .card-grid-section-item--front {
        padding-top: calc(130 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(100 * var(--vw-with-scrollbar) / 1920);
        gap: calc(78 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-07 img {
        width: calc(125 * var(--vw-with-scrollbar) / 1920);
        height: calc(153 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-07 .card-grid-section-item--front h2 {
        margin-top: calc(25 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-08 .card-grid-section-item--front {
        padding-top: calc(137 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(74 * var(--vw-with-scrollbar) / 1920);
        gap: calc(47 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-08 img {
        width: calc(146 * var(--vw-with-scrollbar) / 1920);
        height: calc(146 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-08 .card-grid-section-item--front h2 {
        margin-top: calc(13 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-01 .card-grid-section-item--back {
        gap: calc(62 * var(--vw-with-scrollbar) / 1920);
    }
    #card-grid-item-01 .card-grid-section-item--back .inner-row {
        gap: calc(77 * var(--vw-with-scrollbar) / 1920);
    }

    #card-grid-item-02 .card-grid-section-item--back {
        gap: calc(62 * var(--vw-with-scrollbar) / 1920);
    }
    #card-grid-item-02 .card-grid-section-item--back .inner-row {
        gap: calc(63 * var(--vw-with-scrollbar) / 1920);
    }
    #card-grid-item-02 .card-grid-section-item--back .info-row {
        display: flex;
        align-items: end;
    }
    #card-grid-item-02 .card-grid-section-item--back .info-col {
        display: flex;
        flex-direction: column;
        align-items: start;
    }
    #card-grid-item-02 .card-grid-section-item--back .info-col:nth-child(3) {
        align-items: end;
    }
    #card-grid-item-02 .card-grid-section-item--back .info-col:nth-child(3) h5 {
        padding-right: calc(28 * var(--vw-with-scrollbar) / 1920);
    }
    #card-grid-item-03 .card-grid-section-item--back {
        gap: calc(82 * var(--vw-with-scrollbar) / 1920);
    }
    #card-grid-item-03 .card-grid-section-item--back .inner-row {
        gap: calc(52 * var(--vw-with-scrollbar) / 1920);
    }
    #card-grid-item-04 .card-grid-section-item--back {
        gap: calc(82 * var(--vw-with-scrollbar) / 1920);
    }
    #card-grid-item-04 .card-grid-section-item--back .inner-row {
        gap: calc(80 * var(--vw-with-scrollbar) / 1920);
    }
    #card-grid-item-05 .card-grid-section-item--back {
        gap: calc(46 * var(--vw-with-scrollbar) / 1920);
    }
    #card-grid-item-05 .card-grid-section-item--back .inner-row {
        gap: calc(67 * var(--vw-with-scrollbar) / 1920);
    }
    #card-grid-item-06 .card-grid-section-item--back {
        gap: calc(59 * var(--vw-with-scrollbar) / 1920);
    }
    #card-grid-item-06 .card-grid-section-item--back .inner-row {
        gap: calc(63 * var(--vw-with-scrollbar) / 1920);
    }
    #card-grid-item-07 .card-grid-section-item--back {
        gap: calc(26 * var(--vw-with-scrollbar) / 1920);
    }
    #card-grid-item-07 .card-grid-section-item--back .inner-row {
        gap: calc(79 * var(--vw-with-scrollbar) / 1920);
    }
    #card-grid-item-08 .card-grid-section-item--back {
        gap: calc(26 * var(--vw-with-scrollbar) / 1920);
    }
    #card-grid-item-08 .card-grid-section-item--back .inner-row {
        gap: calc(70 * var(--vw-with-scrollbar) / 1920);
    }

    .horizontal-slide-header-section {
        display: flex;
        justify-content: center;
        padding-top: calc(83 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(81 * var(--vw-with-scrollbar) / 1920);
    }
    .horizontal-slide-header {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: calc(69 * var(--vw-with-scrollbar) / 1920);
        padding: calc(10 * var(--vw-with-scrollbar) / 1920);
    }
    .horizontal-slide-header h1 {
        font-family: var(--font-shippori-antique);
        font-weight: 400;
        font-size: calc(128 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.1;
        background: var(--main-gra-nz);
    }

    .horizontal-slide-header__content-row {
        display: flex;
        align-items: center;
        gap: calc(10 * var(--vw-with-scrollbar) / 1920);
    }

    .horizontal-slide-header h2 {
        display: flex;
        width: calc(251 * var(--vw-with-scrollbar) / 1920);
        height: calc(58 * var(--vw-with-scrollbar) / 1920);
        justify-content: center;
        align-items: center;
        border-image-source: var(--main-gra-nz);
        border-image-slice: 1;
        border-style: solid;
        border-width: calc(3 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.54;
        font-size: calc(24 * var(--vw-with-scrollbar) / 1920);
        font-weight: 400;
    }
    .horizontal-slide-header h2 > span {
        background-color: var(--main-gra-nz);
    }
    .horizontal-slide-header img {
        width: calc(31 * var(--vw-with-scrollbar) / 1920);
        height: calc(31 * var(--vw-with-scrollbar) / 1920);
        object-fit: contain;
    }
    .horizontal-slide-section {
        position: relative;
        width: 100%;
        /* height: calc(7650 * var(--vw-with-scrollbar) / 1920); */
    }
    .horizontal-slide-sticky-wrapper {
        position: -webkit-sticky;
        position: sticky;
        left: 0;
    }
    .horizontal-slide-content-wrapper {
        width: 100%;
        /* height: calc(815 * var(--vw-with-scrollbar) / 1920); */
        overflow: hidden;
    }
    .horizontal-slide-content {
        width: max-content;
        height: 100%;
        gap: calc(44 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        will-change: transform;
		flex-direction: column;
    }
    .horizontal-slide-content-item {
        height: 100%;
        min-width: calc(1920 * var(--vw-with-scrollbar) / 1920);
        position: relative;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-top: calc(2 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(70 * var(--vw-with-scrollbar) / 1920);
        padding-right: calc(30 * var(--vw-with-scrollbar) / 1920);
        box-sizing: border-box;
		height: calc(815 * var(--vw-with-scrollbar) / 1920);
    }
    .horizontal-slide-content-item::after {
        content: "";
        width: calc(73 * var(--vw-with-scrollbar) / 1920);
        height: calc(241 * var(--vw-with-scrollbar) / 1920);
        background-image: url(../img/recruit/chevron-right-large.svg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
		opacity: 0;
    }
    .horizontal-slide-content-item__col {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: start;
        gap: calc(24 * var(--vw-with-scrollbar) / 1920);
    }
    .horizontal-slide-content-item h1,
    .horizontal-slide-content-item h2 {
        font-family: var(--font-shippori-antique);
        font-weight: 400;
        color: white;
        transform: var(--italic-effect);
        line-height: 1;
        letter-spacing: -0.01em;
    }
    .horizontal-slide-content-item h1 {
        font-size: calc(73.13 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(82 * var(--vw-with-scrollbar) / 1920);
    }
    .horizontal-slide-content-item h2 {
        padding-left: calc(25 * var(--vw-with-scrollbar) / 1920);
        font-size: calc(100 * var(--vw-with-scrollbar) / 1920);
    }
    .horizontal-slide-content-item h2 > span {
        display: block;
    }
    #horizontal-slide-1 {
        background-image: url(../img/recruit/horizontal-slide-01.webp);
    }
    #horizontal-slide-2 {
        background-image: url(../img/recruit/horizontal-slide-02.webp);
    }
    #horizontal-slide-3 {
        background-image: url(../img/recruit/horizontal-slide-03.webp);
    }
    #horizontal-slide-4 {
        background-image: url(../img/recruit/horizontal-slide-04.webp);
    }
    #horizontal-slide-4::after {
        display: none;
    }

    .welfare-section {
        padding-top: calc(108 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(110 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(100 * var(--vw-with-scrollbar) / 1920);
        padding-right: calc(100 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        flex-direction: column;
        gap: calc(50 * var(--vw-with-scrollbar) / 1920);
    }

    .welfare-hero {
        position: relative;
        display: flex;
        justify-content: start;
        align-items: end;
        height: calc(586 * var(--vw-with-scrollbar) / 1920);
    }

    .welfare-hero__bg {
        position: absolute;
        top: 0;
        left: 0;
        bottom: calc(46 * var(--vw-with-scrollbar) / 1920);
        width: 100%;
        background-image: url(../img/recruit/welfare-bg-gray.webp);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

    .welfare-hero__bg::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        background-color: white;
        width: calc(556 * var(--vw-with-scrollbar) / 1920);
        height: calc(101 * var(--vw-with-scrollbar) / 1920);
    }

    .welfare-hero__bg-img {
        position: absolute;
        inset: 0;
        background-image: url(../img/recruit/welfare-bg.webp);
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }

    .welfare-hero-header {
        display: flex;
        align-items: end;
    }

    .welfare-hero-header h1 {
        padding-left: calc(14 * var(--vw-with-scrollbar) / 1920);
        padding-right: calc(24 * var(--vw-with-scrollbar) / 1920);
        font-family: var(--font-shippori-antique);
        font-weight: 400;
        font-size: calc(128 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        background: var(--main-gra-nz);
        letter-spacing: -0.01em;
    }

    .welfare-hero__title {
        width: auto;
        height: calc(22 * var(--vw-with-scrollbar) / 1920);
        object-fit: contain;
    }
    .welfare-hero__title img {
        width: 100%;
        height: 100%;
        background-size: contain;
    }

    .welfare-list {
        display: flex;
        flex-wrap: wrap;
        column-gap: calc(22 * var(--vw-with-scrollbar) / 1920);
        row-gap: calc(11 * var(--vw-with-scrollbar) / 1920);
    }

    .welfare-list li {
        display: flex;
        justify-content: center;
        align-items: center;
        min-width: calc(412 * var(--vw-with-scrollbar) / 1920);
        padding: calc(18 * var(--vw-with-scrollbar) / 1920);
        border: calc(2 * 100vw / 1920) solid black;
        box-sizing: border-box;
        font-size: clamp(
            16px,
            calc(24 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        line-height: 1;
        letter-spacing: -0.01em;
        font-weight: 500;
    }

    .application-guidelines-section {
        display: flex;
        flex-direction: column;
        position: relative;
        background: var(--main-gra-nz-texture);
        background-size: cover;
        padding-top: calc(100 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(80 * var(--vw-with-scrollbar) / 1920);
        gap: calc(79 * var(--vw-with-scrollbar) / 1920);
        align-items: start;
    }
    .application-guidelines-section__bg {
        position: absolute;
        inset: 0;
        background-image: url(../img/recruit/application-guidelines-bg.webp);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        z-index: 0;
        mix-blend-mode: multiply;
    }
    .application-guidelines__header {
        padding: 0 calc(100 * var(--vw-with-scrollbar) / 1920);
        font-size: calc(128 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        color: var(--base-color);
        z-index: 1;
    }
    .application-guidelines__sub-header {
        font-family: var(--font-shippori-antique);
        margin: 0 calc(95 * var(--vw-with-scrollbar) / 1920);
        margin-bottom: calc(-5 * var(--vw-with-scrollbar) / 1920);
        font-size: calc(50 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        font-weight: 400;
        background: var(--silver-texture);
        background-size: cover;
        background-position: center;
        z-index: 1;
    }
    .application-guidelines-grid {
        width: 100%;
        box-sizing: border-box;
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto;
        z-index: 1;
        padding-left: calc(151 * var(--vw-with-scrollbar) / 1920);
        padding-right: calc(205 * var(--vw-with-scrollbar) / 1920);
        column-gap: calc(145 * var(--vw-with-scrollbar) / 1920);
        row-gap: calc(96 * var(--vw-with-scrollbar) / 1920);
    }
    .application-guidelines-grid-item {
        aspect-ratio: 1;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        position: relative;
    }
    #application-guidelines-1 {
        background-image: url(../img/recruit/application-bg-01.webp);
    }
    #application-guidelines-2 {
        background-image: url(../img/recruit/application-bg-02.webp);
    }
    #application-guidelines-3 {
        background-image: url(../img/recruit/application-bg-03.webp);
    }
    #application-guidelines-4 {
        background-image: url(../img/recruit/application-bg-04.png);
    }
    .application-guidelines-grid-item__front {
        position: absolute;
        inset: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: calc(8 * var(--vw-with-scrollbar) / 1920);
        transition: opacity 0.4s ease;
    }
    .application-guidelines-grid-item__front h3,
    .application-guidelines-grid-item__front h2 {
        background: var(--silver-texture);
        background-size: cover;
        background-position: center;
        color: transparent;
        background-clip: text !important;
        -webkit-background-clip: text !important;
        -webkit-text-fill-color: transparent;
        line-height: 1;
    }
    .application-guidelines-grid-item__front h3 {
        margin-right: -1.3em;
        font-size: calc(30 * var(--vw-with-scrollbar) / 1920);
        letter-spacing: 1.3em;
    }
    .application-guidelines-grid-item__front h2 {
        font-size: calc(100 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.1;
        filter: drop-shadow(
            0px calc(4 * var(--vw-with-scrollbar) / 1920)
                calc(10 * var(--vw-with-scrollbar) / 1920) rgba(0, 0, 0, 0.25)
        );
    }
    .application-guidelines-grid-item__hover {
        position: absolute;
        inset: 0;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        opacity: 0;
        transition: opacity 0.4s ease;
        display: flex;
        align-items: end;
        overflow: hidden;
    }
    #application-guidelines-1 .application-guidelines-grid-item__hover {
        background-image: url(../img/recruit/application-fg-01.webp);
    }
    #application-guidelines-2 .application-guidelines-grid-item__hover {
        background-image: url(../img/recruit/application-fg-02.webp);
    }
    #application-guidelines-3 .application-guidelines-grid-item__hover {
        background-image: url(../img/recruit/application-fg-03.webp);
    }
    #application-guidelines-4 .application-guidelines-grid-item__hover {
        background-image: url(../img/recruit/application-fg-04.png);
		background-size: 105%;
    }
    .application-guidelines-grid-item__hover .link-button {
        width: 100%;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: calc(13 * var(--vw-with-scrollbar) / 1920) 0;
        gap: calc(10 * var(--vw-with-scrollbar) / 1920);
        border: none;
    }
    .application-guidelines-grid-item__hover .link-button span {
        font-family: var(--font-inter);
        line-height: 1;
        font-weight: bold;
        color: transparent;
        background-clip: text !important;
        -webkit-background-clip: text !important;
        -webkit-text-fill-color: transparent;
        background: var(--main-gra-nz);
        transition: background 0.4s ease;
    }
    .link-button:hover span {
        background: var(--base-color);
    }
    .application-guidelines-grid-item__hover .link-button h3 {
        display: inline;
        font-size: calc(40 * var(--vw-with-scrollbar) / 1920);
    }
    .application-guidelines-grid-item__hover .link-button h4 {
        display: inline;
        font-size: calc(30 * var(--vw-with-scrollbar) / 1920);
    }
    .application-guidelines-grid-item__hover .link-button svg {
        width: calc(20 * var(--vw-with-scrollbar) / 1920);
    }
    .application-guidelines-grid-item__hover .round-link-btn {
        width: calc(50 * var(--vw-with-scrollbar) / 1920);
    }
    .application-guidelines-grid-item-hover-header {
        position: absolute;
        display: flex;
        flex-direction: column;
        align-items: start;
        box-sizing: border-box;
    }
    .application-guidelines-grid-item-hover-header__text {
        height: calc(100 * var(--vw-with-scrollbar) / 1920);
        transform: rotate(-9.44deg);
        background: var(--silver-texture);
        background-size: cover;
        background-position: center;
        box-sizing: border-box;
        white-space: nowrap;
    }
    #application-guidelines-1
        .application-guidelines-grid-item-hover-header__text {
        height: calc(107 * var(--vw-with-scrollbar) / 1920);
    }
    .application-guidelines-grid-item-hover-header__text--invert {
        background: var(--main-gra-nz-texture);
        background-size: cover;
    }
    .application-guidelines-grid-item-hover-header__text span {
        color: transparent;
        background-clip: text !important;
        -webkit-background-clip: text !important;
        -webkit-text-fill-color: transparent;
        background: var(--main-gra-nz);
        background-size: cover;
        background-position: center;
        font-family: var(--font-shippori-antique);
        font-size: calc(79 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        font-weight: 400;
        letter-spacing: -0.07em;
    }
    .application-guidelines-grid-item-hover-header__text--invert span {
        background: var(--silver-texture);
        background-size: cover;
        background-position: center;
    }
    #application-guidelines-1 .application-guidelines-grid-item-hover-header {
        align-items: center;
        top: calc(210 * var(--vw-with-scrollbar) / 1920);
        left: 50%;
        translate: -50% 0;
    }
    #application-guidelines-1
        .application-guidelines-grid-item-hover-header__text:nth-child(1) {
        min-width: calc(575 * var(--vw-with-scrollbar) / 1920);
        margin-left: calc(53 * var(--vw-with-scrollbar) / 1920);
        margin-bottom: calc(20 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(10 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(32 * var(--vw-with-scrollbar) / 1920);
    }
    #application-guidelines-1
        .application-guidelines-grid-item-hover-header__text:nth-child(2) {
        min-width: calc(419 * var(--vw-with-scrollbar) / 1920);
        margin-bottom: calc(14 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(7 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(21 * var(--vw-with-scrollbar) / 1920);
    }
    #application-guidelines-1
        .application-guidelines-grid-item-hover-header__text:nth-child(3) {
        min-width: calc(260 * var(--vw-with-scrollbar) / 1920);
        margin-left: calc(4 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(6 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(20 * var(--vw-with-scrollbar) / 1920);
    }

    #application-guidelines-2 .application-guidelines-grid-item-hover-header {
        top: calc(313 * var(--vw-with-scrollbar) / 1920);
        left: 50%;
        translate: -50% 0;
    }
    #application-guidelines-2
        .application-guidelines-grid-item-hover-header__text:nth-child(1) {
        min-width: calc(284 * var(--vw-with-scrollbar) / 1920);
        margin-left: calc(53 * var(--vw-with-scrollbar) / 1920);
        margin-bottom: calc(12 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(10 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(32 * var(--vw-with-scrollbar) / 1920);
    }
    #application-guidelines-2
        .application-guidelines-grid-item-hover-header__text:nth-child(2) {
        min-width: calc(500 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(9 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(26 * var(--vw-with-scrollbar) / 1920);
    }

    #application-guidelines-3 .application-guidelines-grid-item-hover-header {
        top: calc(251 * var(--vw-with-scrollbar) / 1920);
        left: calc(-9 * var(--vw-with-scrollbar) / 1920);
    }
    #application-guidelines-3
        .application-guidelines-grid-item-hover-header__text:nth-child(1) {
        min-width: calc(461 * var(--vw-with-scrollbar) / 1920);
        max-width: calc(461 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(4 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(22 * var(--vw-with-scrollbar) / 1920);
    }
    #application-guidelines-3
        .application-guidelines-grid-item-hover-header__text:nth-child(2) {
        min-width: calc(624 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(10 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(16 * var(--vw-with-scrollbar) / 1920);
        margin-left: calc(51 * var(--vw-with-scrollbar) / 1920);
    }
    #application-guidelines-3
        .application-guidelines-grid-item-hover-header__text:nth-child(3) {
        min-width: calc(527 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(10 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(37 * var(--vw-with-scrollbar) / 1920);
        margin-left: calc(218 * var(--vw-with-scrollbar) / 1920);
    }

    #application-guidelines-4 .application-guidelines-grid-item-hover-header {
        top: calc(323 * var(--vw-with-scrollbar) / 1920);
        left: calc(38 * var(--vw-with-scrollbar) / 1920);
    }
    #application-guidelines-4
        .application-guidelines-grid-item-hover-header__text:nth-child(1) {
        min-width: calc(472 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(8 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(12 * var(--vw-with-scrollbar) / 1920);
        margin-bottom: calc(-17.37 * var(--vw-with-scrollbar) / 1920);
    }
    #application-guidelines-4
        .application-guidelines-grid-item-hover-header__text:nth-child(2) {
        min-width: calc(326 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(4 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(13 * var(--vw-with-scrollbar) / 1920);
        margin-left: calc(309 * var(--vw-with-scrollbar) / 1920);
    }
}
@media (max-width: 2100px) {
    #recruit-page {
        .hero-section h2 {
            font-size: clamp(
                0px,
                calc(340 * var(--vw-with-scrollbar) / 1920),
                370px
            );

        }
    }


}
@media (min-width: 1025px) {
    #recruit-page {
        .hero-section.section-animate h1 {
            animation-delay: 0.5s;
        }
        .hero-section.section-animate h2 {
            animation-delay: 0.75s;
        }
        .hero-section.section-animate .banner-slide-in__content {
            transition: transform 0.45s ease 1.05s;
        }
        .hero-section.section-animate .banner-slide-in__content::before {
            transition: transform 0.45s ease 1.55s, opacity 0.45s ease 1.8s;
        }
        .staff-picker-content-top-info__grid-item {
            border-bottom: calc(1 * var(--vw-with-scrollbar) / 1920) solid white;
        }

        .staff-picker-content-top-info__grid
            > .staff-picker-content-top-info__grid-item:nth-last-child(-n + 2) {
            border-bottom: none;
        }

        .staff-picker-content-top-info__grid
            > .staff-picker-content-top-info__grid-item:nth-child(odd) {
            padding-right: calc(26 * var(--vw-with-scrollbar) / 1920);
        }

        #staff-info-slide-2 .staff-picker-content-top-info {
            padding-right: calc(50 * var(--vw-with-scrollbar) / 1920);
            padding-bottom: calc(46 * var(--vw-with-scrollbar) / 1920);
        }

        #staff-content-slide-2
            .staff-picker-content-slide-item:nth-child(3)
            .staff-picker-content-slide-item__text {
            padding-top: calc(19 * var(--vw-with-scrollbar) / 1920);
        }

        #staff-content-slide-2
            .staff-picker-content-slide-item:nth-child(3)
            .staff-picker-content-slide-item__text
            p {
            margin-top: calc(-19 * var(--vw-with-scrollbar) / 1920);
        }

        #staff-content-slide-3
            .staff-picker-content-slide-item:nth-child(2)
            .staff-picker-content-slide-item__text
            p {
            margin-top: calc(-19 * var(--vw-with-scrollbar) / 1920);
        }

        #staff-content-slide-4
            .staff-picker-content-slide-item:nth-child(3)
            .staff-picker-content-slide-item__text {
            padding-left: calc(32 * var(--vw-with-scrollbar) / 1920);
            padding-right: calc(32 * var(--vw-with-scrollbar) / 1920);
            padding-top: calc(28 * var(--vw-with-scrollbar) / 1920);
            padding-bottom: calc(30 * var(--vw-with-scrollbar) / 1920);
        }

        #staff-content-slide-4
            .staff-picker-content-slide-item:nth-child(4)
            .staff-picker-content-slide-item__text {
            padding-left: calc(32 * var(--vw-with-scrollbar) / 1920);
            padding-right: calc(32 * var(--vw-with-scrollbar) / 1920);
            padding-bottom: calc(10 * var(--vw-with-scrollbar) / 1920);
        }

        .application-guidelines-grid-item:hover
            .application-guidelines-grid-item__hover {
            opacity: 1;
        }
        .application-guidelines-grid-item:hover
            .application-guidelines-grid-item__front {
            opacity: 0;
        }
    }
}
@media (max-width: 1024px) {
    #recruit-page {
        .hero-section {
            padding-top: 0;
            min-height: calc(659 * var(--vw-with-scrollbar) / 400);
            margin-bottom: calc(57 * var(--vw-with-scrollbar) / 400);
        }
        .hero-bg {
            inset: 0;
            height: 100%;
            background-size: calc(2045 * var(--vw-with-scrollbar) / 400);
            background-position: left center;
        }
        .hero-bg__line {
            left: 50%;
            translate: -50% 0;
            width: calc(533 * var(--vw-with-scrollbar) / 400);
        }
        .hero-staff-img {
            top: calc(161 * var(--vw-with-scrollbar) / 400);
            width: calc(461 * var(--vw-with-scrollbar) / 400);
            height: calc(293 * var(--vw-with-scrollbar) / 400);
        }
        .hero-section .h1-wrapper {
            top: calc(34 * var(--vw-with-scrollbar) / 400);
            left: calc(-31 * var(--vw-with-scrollbar) / 400);
            width: fit-content;
            transform: unset;
            font-size: calc(192 * var(--vw-with-scrollbar) / 400);
        }
        .hero-section h1 {
            font-size: calc(192 * var(--vw-with-scrollbar) / 400);
        }
        .hero-section .h2-wrapper {
            top: calc(395 * var(--vw-with-scrollbar) / 400);
            left: 50%;
            margin: 0;
            width: fit-content;
        }
        .hero-section h2 {
            width: calc(360 * var(--vw-with-scrollbar) / 400);
            font-size: calc(195 * var(--vw-with-scrollbar) / 400);
            line-height: 0.38;
            letter-spacing: -0.1em;
            text-align: left;
        }
        .hero-section .h3-wrapper {
            position: absolute;
            bottom: calc(34 * var(--vw-with-scrollbar) / 400);
            left: calc(-17 * var(--vw-with-scrollbar) / 400);
        }
        .hero-section h3 {
            line-height: 0.72;
            font-size: calc(110 * var(--vw-with-scrollbar) / 400);
            letter-spacing: -0.29em;
        }

        .hero-section.section-animate {
            .hero-bg {
                animation: bgMoveRTL 25s linear forwards;
            }
            h1 {
                animation-delay: 0.5s;
            }
            h2,
            h3 {
                animation-delay: 0.75s;
            }
        }

        .hero-top-message-sp {
            width: 100%;
            box-sizing: border-box;
            padding: calc(10 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400);
            padding-bottom: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .hero-top-message-sp__text {
            display: block;
            background: var(--main-gra-nz-texture);
            font-family: var(--font-shippori-antique);
            line-height: 1.02;
            letter-spacing: -0.29em;
            font-size: calc(90 * var(--vw-with-scrollbar) / 400);
        }
        .hero-top-message-sp__text::before {
            background: var(--main-gra-nz-texture);
            background-size: cover;
        }

        .hero-msg-section {
            margin: 0;
            padding: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400);
        }
        .hero-msg-bubble__inner {
            height: calc(217 * var(--vw-with-scrollbar) / 400);
        }
        .hero-msg-bubble__tail::before,
        .hero-msg-bubble__tail::after {
            border-bottom-width: calc(46 * var(--vw-with-scrollbar) / 400);
        }
        .hero-msg-bubble__tail::before {
            border-right-width: calc(30 * var(--vw-with-scrollbar) / 400);
        }
        .hero-msg-bubble__tail::after {
            border-left-width: calc(30 * var(--vw-with-scrollbar) / 400);
        }
        .hero-msg-bubble__inner picture {
            top: calc(100 * var(--vw-with-scrollbar) / 400);
            left: calc(14 * var(--vw-with-scrollbar) / 400);
            width: calc(321 * var(--vw-with-scrollbar) / 400);
            height: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .hero-msg-bubble__top-text-sp {
            top: calc(5 * var(--vw-with-scrollbar) / 400);
            left: calc(82 * var(--vw-with-scrollbar) / 400);
        }
        .hero-msg-bubble__bottom-text-sp {
            bottom: calc(17 * var(--vw-with-scrollbar) / 400);
            left: calc(36 * var(--vw-with-scrollbar) / 400);
            white-space: nowrap;
        }
        .hero-msg-bubble__inner span {
            font-size: calc(70 * var(--vw-with-scrollbar) / 400);
        }

        .hero-speech-section {
            gap: calc(20 * var(--vw-with-scrollbar) / 400);
            padding: calc(20 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400);
        }
        .hero-speech-section__header {
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .hero-speech-section__header span {
            font-family: var(--font-shippori-antique);
            font-size: calc(50 * var(--vw-with-scrollbar) / 400);
            line-height: 1.3;
            letter-spacing: -0.11em;
        }
        .hero-speech-section p {
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
            letter-spacing: 0.1em;
            line-height: 1.8;
        }

        .horizontal-slide-header h1 {
            font-size: calc(45 * var(--vw-with-scrollbar) / 400);
        }
        .horizontal-slide-header__content-row {
            flex-direction: column;
            gap: calc(8 * var(--vw-with-scrollbar) / 400);
        }
        .horizontal-slide-header h2 {
            width: 100%;
            height: 100%;
            padding: 0 3rem;
            font-size: calc(24 * var(--vw-with-scrollbar) / 400);
            border-width: calc(3 * var(--vw-with-scrollbar) / 400);
        }
        .horizontal-slide-header img {
            width: calc(20 * var(--vw-with-scrollbar) / 400);
            height: calc(20 * var(--vw-with-scrollbar) / 400);
            transform: rotate(90deg);
        }

        .staff-picker-section {
            padding: 0;
            gap: 0;
            background-color: transparent;
        }
        .staff-picker-header {
            width: 100%;
            box-sizing: border-box;
            gap: calc(24 * var(--vw-with-scrollbar) / 400);
            padding: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400);
        }

        .staff-picker-header span {
            font-size: calc(50 * var(--vw-with-scrollbar) / 400);
        }

        .staff-picker-header picture {
            height: calc(10 * var(--vw-with-scrollbar) / 400);
        }

        .staff-picker-list__frame {
            box-sizing: border-box;
            display: flex;
        }

        .staff-picker-list__frame::after {
            content: "";
            min-width: calc(24 * var(--vw-with-scrollbar) / 400);
        }

        .staff-picker-list {
            box-sizing: border-box;
            height: fit-content;
            padding-top: calc(20 * var(--vw-with-scrollbar) / 400);
            padding-bottom: calc(40 * var(--vw-with-scrollbar) / 400);
            grid-template-columns: repeat(
                4,
                calc(213 * var(--vw-with-scrollbar) / 400)
            );
            grid-template-rows: calc(358 * var(--vw-with-scrollbar) / 400);
            gap: calc(20 * var(--vw-with-scrollbar) / 400);
            overflow-x: scroll;
            padding-inline: calc(24 * var(--vw-with-scrollbar) / 400);
            scroll-padding-inline: calc(24 * var(--vw-with-scrollbar) / 400);
            scroll-snap-type: x mandatory;
        }

        .staff-picker-list-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            box-shadow: 0px calc(4 * var(--vw-with-scrollbar) / 400)
                calc(9 * var(--vw-with-scrollbar) / 400) rgba(0, 0, 0, 0.25);
            color: white;
            justify-content: end;
            padding-bottom: calc(6 * var(--vw-with-scrollbar) / 400);
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
        }
        .staff-picker-list-item h1 {
            font-size: calc(25 * var(--vw-with-scrollbar) / 400);
            height: calc(76.97 * var(--vw-with-scrollbar) / 400);
        }
        .staff-picker-list-item::after {
            content: "";
            width: calc(45 * var(--vw-with-scrollbar) / 400);
            height: calc(27 * var(--vw-with-scrollbar) / 400);
            background-image: url(../img/recruit/down-arrow-sp.svg);
        }
        .staff-picker-list-item[data-index="1"] {
            background-image: url(../img/recruit/staff-pick-1-sp.webp);
            gap: calc(18 * var(--vw-with-scrollbar) / 400);
        }
        .staff-picker-list-item[data-index="2"] {
            background-image: url(../img/recruit/staff-pick-2-sp.webp);
            gap: calc(10 * var(--vw-with-scrollbar) / 400);
        }
        .staff-picker-list-item[data-index="3"] {
            background-image: url(../img/recruit/staff-pick-3-sp.webp);
            gap: calc(1 * var(--vw-with-scrollbar) / 400);
        }
        .staff-picker-list-item[data-index="4"] {
            background-image: url(../img/recruit/staff-pick-4-sp.webp);
            gap: calc(1 * var(--vw-with-scrollbar) / 400);
        }

        .staff-picker-list-item[data-index="1"] h1 {
            height: calc(50 * var(--vw-with-scrollbar) / 400);
        }
        .staff-picker-list-item[data-index="2"] h1 {
            height: calc(76.97 * var(--vw-with-scrollbar) / 400);
        }

        .staff-picker-content-bottom {
            background-size: cover;
        }

        #staff-info-slide-1 .staff-picker-content-top-slide {
            background-image: url(../img/recruit/recruit-staff-bg-1-sp.webp);
        }

        #staff-info-slide-2 .staff-picker-content-top-slide {
            background-image: url(../img/recruit/recruit-staff-bg-2-sp.webp);
        }

        #staff-info-slide-3 .staff-picker-content-top-slide {
            background-image: url(../img/recruit/recruit-staff-bg-3-sp.webp);
        }

        #staff-info-slide-4 .staff-picker-content-top-slide {
            background-image: url(../img/recruit/recruit-staff-bg-4-sp.webp);
        }

        #staff-info-slide-1 .staff-picker-content-top-slide__fg-img {
            background-image: url(../img/recruit/recruit-staff-fg-1-sp.webp);
        }

        #staff-info-slide-2 .staff-picker-content-top-slide__fg-img {
            background-image: url(../img/recruit/recruit-staff-fg-2-sp.webp);
        }

        #staff-info-slide-3 .staff-picker-content-top-slide__fg-img {
            background-image: url(../img/recruit/recruit-staff-fg-3-sp.webp);
        }

        #staff-info-slide-4 .staff-picker-content-top-slide__fg-img {
            background-image: url(../img/recruit/recruit-staff-fg-4-sp.webp);
        }

        .staff-picker-content-top-info__header {
            position: absolute;
            top: calc(33 * var(--vw-with-scrollbar) / 400);
            right: calc(15 * var(--vw-with-scrollbar) / 400);
            display: flex;
            flex-direction: row-reverse;
        }

        .staff-picker-content-top-slide {
            height: calc(878 * var(--vw-with-scrollbar) / 400);
        }

        .staff-picker-content-top-slide h1 {
            padding: 0.5rem;
            text-align: center;
            font-size: calc(40 * var(--vw-with-scrollbar) / 400);
            transform: unset;
            writing-mode: vertical-lr;
            text-orientation: upright;
            min-width: calc(49 * var(--vw-with-scrollbar) / 400);
            background: var(--main-gra-nz-texture);
        }

        .staff-picker-content-top-info {
            width: 100%;
            padding: 0;
        }

        .staff-picker-content-top-info__grid {
            display: flex;
            flex-direction: column;
            width: 100%;
            box-sizing: border-box;
            padding: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400);
            gap: calc(20 * var(--vw-with-scrollbar) / 400);
        }

        .staff-picker-content-top-info__grid-item {
            font-size: calc(24 * var(--vw-with-scrollbar) / 400);
            font-weight: bold;
            line-height: 0.75;
            padding: 0;
        }

        .staff-picker-content-top-info__grid
            > .staff-picker-content-top-info__grid-item:first-child {
            padding-top: calc(10 * var(--vw-with-scrollbar) / 400);
        }

        .staff-picker-content-top-info__grid
            > .staff-picker-content-top-info__grid-item:nth-child(even) {
            padding-bottom: calc(10 * var(--vw-with-scrollbar) / 400);
            border-bottom: calc(1 * var(--vw-with-scrollbar) / 400) solid white;
            font-size: calc(20 * var(--vw-with-scrollbar) / 400);
            font-weight: 500;
        }

        .staff-picker-content-top-info__grid
            > .staff-picker-content-top-info__grid-item:last-child {
            line-height: 1.1;
            max-height: fit-content;
        }

        #staff-info-slide-2 h1,
        #staff-info-slide-3 h1 {
            text-shadow: 0px calc(4 * 100vw / 400) calc(10 * 100vw / 400)
                rgba(0, 0, 0, 0.25);
        }

        .staff-picker-content-slide {
            display: flex;
            flex-direction: column;
            padding: 0;
            gap: 0;
        }
        .staff-picker-content-slide-item {
            min-height: fit-content;
        }
        .staff-picker-content-slide-item__text {
            padding: calc(11 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400);
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
            line-height: 1.8;
        }
        .staff-picker-content-slide-item__bg {
            height: auto;
        }

        #staff-content-slide-1
            .staff-picker-content-slide-item:nth-child(1)
            .staff-picker-content-slide-item__header {
            width: calc(131 * var(--vw-with-scrollbar) / 400);
            height: calc(241 * var(--vw-with-scrollbar) / 400);
            right: calc(13 * var(--vw-with-scrollbar) / 400);
        }
        #staff-content-slide-1
            .staff-picker-content-slide-item:nth-child(2)
            .staff-picker-content-slide-item__header {
            width: calc(87 * var(--vw-with-scrollbar) / 400);
            height: calc(194 * var(--vw-with-scrollbar) / 400);
            right: calc(13 * var(--vw-with-scrollbar) / 400);
        }
        #staff-content-slide-1
            .staff-picker-content-slide-item:nth-child(3)
            .staff-picker-content-slide-item__header {
            width: calc(87 * var(--vw-with-scrollbar) / 400);
            height: calc(229 * var(--vw-with-scrollbar) / 400);
            left: calc(24 * var(--vw-with-scrollbar) / 400);
        }
        #staff-content-slide-1
            .staff-picker-content-slide-item:nth-child(4)
            .staff-picker-content-slide-item__header {
            width: calc(130 * var(--vw-with-scrollbar) / 400);
            height: calc(181 * var(--vw-with-scrollbar) / 400);
            left: calc(24 * var(--vw-with-scrollbar) / 400);
        }

        #staff-content-slide-2
            .staff-picker-content-slide-item:nth-child(1)
            .staff-picker-content-slide-item__header {
            width: calc(87 * var(--vw-with-scrollbar) / 400);
            height: calc(217 * var(--vw-with-scrollbar) / 400);
            left: calc(28 * var(--vw-with-scrollbar) / 400);
        }
        #staff-content-slide-2
            .staff-picker-content-slide-item:nth-child(2)
            .staff-picker-content-slide-item__header {
            width: calc(87 * var(--vw-with-scrollbar) / 400);
            height: calc(240 * var(--vw-with-scrollbar) / 400);
            right: calc(13 * var(--vw-with-scrollbar) / 400);
        }
        #staff-content-slide-2
            .staff-picker-content-slide-item:nth-child(3)
            .staff-picker-content-slide-item__header {
            width: calc(166 * var(--vw-with-scrollbar) / 400);
            height: calc(229 * var(--vw-with-scrollbar) / 400);
            right: calc(23 * var(--vw-with-scrollbar) / 400);
        }
        #staff-content-slide-2
            .staff-picker-content-slide-item:nth-child(4)
            .staff-picker-content-slide-item__header {
            width: calc(130 * var(--vw-with-scrollbar) / 400);
            height: calc(205 * var(--vw-with-scrollbar) / 400);
            right: calc(24 * var(--vw-with-scrollbar) / 400);
        }

        #staff-content-slide-3
            .staff-picker-content-slide-item:nth-child(1)
            .staff-picker-content-slide-item__header {
            width: calc(87 * var(--vw-with-scrollbar) / 400);
            height: calc(217 * var(--vw-with-scrollbar) / 400);
            left: calc(28 * var(--vw-with-scrollbar) / 400);
        }
        #staff-content-slide-3
            .staff-picker-content-slide-item:nth-child(2)
            .staff-picker-content-slide-item__header {
            width: calc(87 * var(--vw-with-scrollbar) / 400);
            height: calc(194 * var(--vw-with-scrollbar) / 400);
            right: unset;
            left: calc(52 * var(--vw-with-scrollbar) / 400);
        }
        #staff-content-slide-3
            .staff-picker-content-slide-item:nth-child(3)
            .staff-picker-content-slide-item__header {
            width: calc(123 * var(--vw-with-scrollbar) / 400);
            height: calc(229 * var(--vw-with-scrollbar) / 400);
            right: unset;
            left: calc(24 * var(--vw-with-scrollbar) / 400);
        }
        #staff-content-slide-3
            .staff-picker-content-slide-item:nth-child(4)
            .staff-picker-content-slide-item__header {
            width: calc(87 * var(--vw-with-scrollbar) / 400);
            height: calc(196 * var(--vw-with-scrollbar) / 400);
            right: calc(25 * var(--vw-with-scrollbar) / 400);
        }

        #staff-content-slide-4 {
            padding-right: 0;
        }

        #staff-content-slide-4
            .staff-picker-content-slide-item:nth-child(1)
            .staff-picker-content-slide-item__header {
            width: calc(131 * var(--vw-with-scrollbar) / 400);
            height: calc(241 * var(--vw-with-scrollbar) / 400);
            right: calc(13 * var(--vw-with-scrollbar) / 400);
        }
        #staff-content-slide-4
            .staff-picker-content-slide-item:nth-child(2)
            .staff-picker-content-slide-item__header {
            width: calc(88 * var(--vw-with-scrollbar) / 400);
            height: calc(218 * var(--vw-with-scrollbar) / 400);
            right: calc(12 * var(--vw-with-scrollbar) / 400);
        }
        #staff-content-slide-4
            .staff-picker-content-slide-item:nth-child(3)
            .staff-picker-content-slide-item__header {
            width: calc(87 * var(--vw-with-scrollbar) / 400);
            height: calc(277 * var(--vw-with-scrollbar) / 400);
            left: calc(24 * var(--vw-with-scrollbar) / 400);
        }
        #staff-content-slide-4
            .staff-picker-content-slide-item:nth-child(4)
            .staff-picker-content-slide-item__header {
            width: calc(87 * var(--vw-with-scrollbar) / 400);
            height: calc(194 * var(--vw-with-scrollbar) / 400);
            right: calc(13 * var(--vw-with-scrollbar) / 400);
        }

        .card-grid-section {
            flex-direction: column;
            align-items: center;
            gap: calc(40 * var(--vw-with-scrollbar) / 400);
        }

        .card-grid-section-header {
            flex-direction: row-reverse;
            padding: calc(35 * var(--vw-with-scrollbar) / 400) 0;
            padding-bottom: 0;
            gap: calc(10 * var(--vw-with-scrollbar) / 400);
        }

        .card-grid-section-header h1 {
            min-height: calc(360 * var(--vw-with-scrollbar) / 400);
            font-size: calc(40 * var(--vw-with-scrollbar) / 400);
            max-width: fit-content;
        }

        .card-grid-section-header h1:nth-child(1) {
            animation-delay: 0.4s;
        }
        .card-grid-section-header h1:nth-child(2) {
            animation-delay: 0s;
        }

        .card-grid-section-inner {
            padding-bottom: calc(40 * var(--vw-with-scrollbar) / 400);
            grid-template-rows: repeat(
                4,
                calc(218 * var(--vw-with-scrollbar) / 400)
            );
        }

        .card-grid-section-item__wrapper {
            perspective: calc(200 * var(--vw-with-scrollbar) / 400);
        }

        .card-grid-section-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 0 !important;
            border-width: calc(0.5 * var(--vw-with-scrollbar) / 400);
        }

        .card-grid-section-item--front {
            padding: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(32 * var(--vw-with-scrollbar) / 400) !important;
            padding-bottom: calc(
                22 * var(--vw-with-scrollbar) / 400
            ) !important;
        }

        .card-grid-section-item h1 {
            position: static;
            margin-top: calc(-6 * var(--vw-with-scrollbar) / 400);
            margin-bottom: calc(-4 * var(--vw-with-scrollbar) / 400);
            font-size: calc(30 * var(--vw-with-scrollbar) / 400);
        }

        .card-grid-section-item h1 {
            margin-bottom: calc(22 * var(--vw-with-scrollbar) / 400);
        }

        .card-grid-section-item--front img {
            margin-bottom: calc(8 * var(--vw-with-scrollbar) / 400);
        }

        .card-grid-section-item h2 {
            width: 100%;
            margin: 0 !important;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
            padding: calc(10 * var(--vw-with-scrollbar) / 400);
            max-height: calc(33 * var(--vw-with-scrollbar) / 400);
            text-align: center;
            box-sizing: border-box;
        }
        .card-grid-section-item__wrapper:nth-child(7)
            .card-grid-section-item--front
            h2,
        .card-grid-section-item__wrapper:nth-child(8)
            .card-grid-section-item--front
            h2 {
            max-height: calc(51 * var(--vw-with-scrollbar) / 400);
        }

        .card-grid-section-item__wrapper:nth-child(1) .card-grid-section-item,
        .card-grid-section-item__wrapper:nth-child(2) .card-grid-section-item {
            border-top-width: calc(1 * var(--vw-with-scrollbar) / 400);
        }
        .card-grid-section-item__wrapper:nth-child(7) .card-grid-section-item,
        .card-grid-section-item__wrapper:nth-child(8) .card-grid-section-item {
            border-bottom-width: calc(1 * var(--vw-with-scrollbar) / 400);
        }

        .card-grid-section-item img {
            width: auto !important;
            height: calc(53 * var(--vw-with-scrollbar) / 400) !important;
        }

        .card-grid-section-item--back {
            border-color: white;
            border-style: solid;
            padding: 0 calc(32 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(12.5 * var(--vw-with-scrollbar) / 400);
            padding-bottom: 0;
        }

        .card-grid-section-item--back .inner-row {
            flex-direction: column;
            align-items: center;
            gap: calc(10 * var(--vw-with-scrollbar) / 400);
        }

        .card-grid-section-item--back span {
            white-space: nowrap;
        }

        .card-grid-section-item--back h2 {
            margin-bottom: calc(10 * var(--vw-with-scrollbar) / 400) !important;
        }

        .card-grid-section-item--back h3 {
            font-size: calc(30 * var(--vw-with-scrollbar) / 400);
        }
        .card-grid-section-item--back h4 {
            font-size: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .card-grid-section-item--back h5 {
            padding: 0 !important;
            margin: calc(-2 * var(--vw-with-scrollbar) / 400) 0;
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
        }

        #card-grid-item-02 .card-grid-section-item--back {
            padding-top: calc(16 * var(--vw-with-scrollbar) / 400) !important;
        }

        #card-grid-item-02 .card-grid-section-item--back h1 {
            margin-bottom: calc(15 * var(--vw-with-scrollbar) / 400) !important;
        }
        #card-grid-item-02 .card-grid-section-item--back h2 {
            margin-bottom: calc(7 * var(--vw-with-scrollbar) / 400) !important;
        }

        #card-grid-item-02 .card-grid-section-item--back .info-col {
            gap: calc(10 * var(--vw-with-scrollbar) / 400);
            align-items: start !important;
        }
        #card-grid-item-02 .card-grid-section-item--back .info-row {
            gap: calc(10 * var(--vw-with-scrollbar) / 400);
        }

        #card-grid-item-02 .card-grid-section-item--back .info-col span {
            display: flex;
            align-items: center;
            max-height: calc(23 * var(--vw-with-scrollbar) / 400);
        }

        #card-grid-item-02 .card-grid-section-item--back h3,
        #card-grid-item-02 .card-grid-section-item--back h4 {
            font-size: calc(31 * var(--vw-with-scrollbar) / 400);
        }

        #h3-separator {
            margin-bottom: calc(1 * var(--vw-with-scrollbar) / 400);
        }

        .card-grid-section-item__wrapper:nth-child(7)
            .card-grid-section-item--back,
        .card-grid-section-item__wrapper:nth-child(8)
            .card-grid-section-item--back {
            padding-left: calc(10 * var(--vw-with-scrollbar) / 400);
            padding-right: calc(10 * var(--vw-with-scrollbar) / 400);
        }
        .card-grid-section-item__wrapper:nth-child(7) h2,
        .card-grid-section-item__wrapper:nth-child(8) h2 {
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
        }

        .horizontal-slide-content-wrapper {
            width: 100%;
            /*height: calc(497 * var(--vw-with-scrollbar) / 400);*/
            padding: calc(40 * var(--vw-with-scrollbar) / 400) 0;
        }

        .horizontal-slide-content {
            gap: calc(26 * var(--vw-with-scrollbar) / 400);
        }

        .horizontal-slide-content-item {
            align-items: start;
            min-width: calc(400 * var(--vw-with-scrollbar) / 400);
            max-width: calc(400 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(134 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(65 * var(--vw-with-scrollbar) / 400);
            padding-right: calc(54.74 * var(--vw-with-scrollbar) / 400);
            box-sizing: border-box;
			height: calc(497 * var(--vw-with-scrollbar) / 400);
        }
        .horizontal-slide-content-item::after {
            display: none;
        }
        .horizontal-slide-content-item__col {
            gap: calc(10 * var(--vw-with-scrollbar) / 400);
        }
        .horizontal-slide-content-item h1,
        .horizontal-slide-content-item h2 {
            transform: matrix(1, 0, -0.08, 1, 0, 0);
        }
        .horizontal-slide-content-item h1 {
            font-size: calc(20 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(19 * var(--vw-with-scrollbar) / 400);
        }
        .horizontal-slide-content-item h2 {
            font-size: calc(44 * var(--vw-with-scrollbar) / 400);
        }
        #horizontal-slide-1 {
            background-image: url(../img/recruit/horizontal-slide-01-sp.webp);
        }
        #horizontal-slide-2 {
            background-image: url(../img/recruit/horizontal-slide-02-sp.webp);
        }
        #horizontal-slide-3 {
            background-image: url(../img/recruit/horizontal-slide-03-sp.webp);
        }
        #horizontal-slide-4 {
            background-image: url(../img/recruit/horizontal-slide-04-sp.webp);
        }

        .welfare-section {
            padding: calc(40 * var(--vw-with-scrollbar) / 400) 0;
            gap: 0;
        }
        .welfare-hero {
            height: calc(143 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(23 * var(--vw-with-scrollbar) / 400);
            padding-bottom: calc(7 * var(--vw-with-scrollbar) / 400);
        }
        .welfare-hero__bg {
            bottom: 0;
            background-image: url(../img/recruit/welfare-bg-gray-sp.webp);
        }
        .welfare-hero__bg-img {
            background-image: url(../img/recruit/welfare-bg-sp.webp);
        }
        .welfare-hero__bg::after {
            width: calc(303 * var(--vw-with-scrollbar) / 400);
            height: calc(45 * var(--vw-with-scrollbar) / 400);
        }
        .welfare-hero-header {
            position: relative;
            gap: calc(16 * var(--vw-with-scrollbar) / 400);
            z-index: 1;
        }
        .welfare-hero-header h1 {
            font-size: calc(32 * var(--vw-with-scrollbar) / 400);
            padding: 0;
        }
        .welfare-hero__title {
            margin-bottom: calc(3 * var(--vw-with-scrollbar) / 400);
            width: calc(122 * var(--vw-with-scrollbar) / 400);
            height: calc(15 * var(--vw-with-scrollbar) / 400);
        }
        .welfare-list {
            padding: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400);
            column-gap: calc(11 * var(--vw-with-scrollbar) / 400);
            row-gap: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .welfare-list li {
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
            padding: calc(8 * var(--vw-with-scrollbar) / 400)
                calc(18 * var(--vw-with-scrollbar) / 400);
            min-width: fit-content;
            border-image-source: var(--main-gra-nz);
            border-image-slice: 1;
            border-width: calc(2 * var(--vw-with-scrollbar) / 400);
            background: var(--main-gra-nz);
            color: transparent;
            background-clip: text !important;
            -webkit-background-clip: text !important;
            -webkit-text-fill-color: transparent;
        }
        .welfare-list li:nth-child(1) {
            order: 1;
        }
        .welfare-list li:nth-child(2) {
            order: 2;
        }
        .welfare-list li:nth-child(3) {
            order: 3;
        }
        .welfare-list li:nth-child(4) {
            order: 4;
        }
        .welfare-list li:nth-child(5) {
            order: 5;
        }
        .welfare-list li:nth-child(6) {
            order: 7;
        }
        .welfare-list li:nth-child(7) {
            order: 6;
        }
        .welfare-list li:nth-child(8) {
            order: 8;
        }
        .welfare-list li:nth-child(9) {
            order: 9;
        }

        .application-guidelines-grid-item__hover {
            display: none;
        }

        .application-guidelines-section {
            padding: 0;
            padding-top: calc(40 * var(--vw-with-scrollbar) / 400);
            gap: 0;
        }
        .application-guidelines__header {
            padding: calc(10 * var(--vw-with-scrollbar) / 400)
                calc(28 * var(--vw-with-scrollbar) / 400);
            font-size: calc(32 * var(--vw-with-scrollbar) / 400);
        }
        .application-guidelines__sub-header {
            margin: 0;
            padding: calc(10 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400);
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
            line-height: 1.8;
        }
        .application-guidelines-grid {
            display: flex;
            flex-direction: column;
            padding: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(49 * var(--vw-with-scrollbar) / 400);
            gap: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        #application-guidelines-1 {
            order: 1;
            background-image: url(../img/recruit/application-bg-01-sp.webp);
        }
        #application-guidelines-2 {
            order: 2;
            background-image: url(../img/recruit/application-bg-02-sp.webp);
        }
        #application-guidelines-3 {
            order: 3;
            background-image: url(../img/recruit/application-bg-03-sp.webp);
        }
        #application-guidelines-4 {
            order: 4;
            background-image: url(../img/recruit/application-bg-04.png);
        }
        #application-guidelines-1 .application-guidelines-grid-item__hover {
            background-image: url(../img/recruit/application-fg-01-sp.webp);
        }
        #application-guidelines-2 .application-guidelines-grid-item__hover {
            background-image: url(../img/recruit/application-fg-02-sp.webp);
        }
        #application-guidelines-3 .application-guidelines-grid-item__hover {
            background-image: url(../img/recruit/application-fg-03-sp.webp);
        }
        #application-guidelines-4 .application-guidelines-grid-item__hover {
            background-image: url(../img/recruit/application-fg-04-sp.webp);
        }
        .application-guidelines-grid-item {
            cursor: pointer;
        }
        .application-guidelines-grid-item__front {
            gap: calc(10 * var(--vw-with-scrollbar) / 400);
        }
        .application-guidelines-grid-item__front h3 {
            font-size: calc(20 * var(--vw-with-scrollbar) / 400);
            letter-spacing: 1.3em;
        }
        .application-guidelines-grid-item__front h2 {
            font-size: calc(70 * var(--vw-with-scrollbar) / 400);
            filter: drop-shadow(
                0px calc(4 * var(--vw-with-scrollbar) / 400)
                    calc(10 * var(--vw-with-scrollbar) / 400)
                    rgba(0, 0, 0, 0.25)
            );
        }
        .application-guidelines-popup {
            display: none;
            position: fixed;
            inset: 0;
            width: 100%;
            height: 100%;
            z-index: 100;
            opacity: 0;
            transition: opacity 0.4s ease;
            overflow-y: scroll;
            overflow-x: hidden;
        }
        .application-guidelines-popup__content {
            width: 100%;
            height: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: calc(17 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400);
            justify-content: end;
            box-sizing: border-box;
            background-size: cover;
            background-position: center;
        }
        .application-guidelines-popup.active {
            display: flex;
            opacity: 1;
        }
        .application-guidelines-popup__close-btn {
            position: relative;
            display: flex;
            gap: calc(5 * var(--vw-with-scrollbar) / 400);
            align-items: center;
            color: white;
        }
        .application-guidelines-popup__close-btn svg {
            width: calc(20 * var(--vw-with-scrollbar) / 400);
            height: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .application-guidelines-popup__close-btn span {
            font-family: var(--font-shippori-antique);
            font-size: calc(20 * var(--vw-with-scrollbar) / 400);
            line-height: 1;
            letter-spacing: -0.07em;
        }
        .application-guidelines-popup .link-button {
            width: 100%;
            border-radius: calc(90 * var(--vw-with-scrollbar) / 400);
            border: none;
            gap: calc(8 * var(--vw-with-scrollbar) / 400);
            padding: calc(13 * var(--vw-with-scrollbar) / 400) 0;
            margin-bottom: calc(14 * var(--vw-with-scrollbar) / 400);
            justify-content: center;
        }
        .application-guidelines-popup .link-button span {
            font-family: var(--font-inter);
            line-height: 1;
            font-weight: bold;
            color: transparent;
            background-clip: text !important;
            -webkit-background-clip: text !important;
            -webkit-text-fill-color: transparent;
            background: var(--main-gra-nz);
            transition: background 0.4s ease;
        }
        .application-guidelines-popup .link-button h3 {
            display: inline;
            font-size: calc(30 * var(--vw-with-scrollbar) / 400);
        }
        .application-guidelines-popup .link-button h4 {
            display: inline;
            font-size: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .application-guidelines-popup .round-link-btn {
            width: calc(50 * var(--vw-with-scrollbar) / 400);
        }
        .application-guidelines-popup .round-link-btn__icon {
            width: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .application-guidelines-popup .link-button:hover span {
            background: var(--base-color);
        }
        .application-guidelines-popup .link-button:hover .link-button__icon {
            color: var(--main-color);
        }
        .application-guidelines-popup[data-popup="new-graduate"] .link-button {
            gap: calc(14 * var(--vw-with-scrollbar) / 400);
        }

        .application-guidelines-popup__header {
            display: flex;
            flex-direction: column;
        }

        .application-guidelines-popup__header-text {
            height: calc(81 * var(--vw-with-scrollbar) / 400);
            background: var(--silver-texture);
            background-size: cover;
            background-position: center;
            box-sizing: border-box;
            white-space: nowrap;
            transform: rotate(-9.44deg);
        }

        .application-guidelines-popup__header-text--inverted {
            height: calc(91 * var(--vw-with-scrollbar) / 400);
            background: var(--main-gra-nz-texture);
            background-size: cover;
        }

        .application-guidelines-popup__header-text span {
            color: transparent;
            background-clip: text !important;
            -webkit-background-clip: text !important;
            -webkit-text-fill-color: transparent;
            background: var(--main-gra-nz);
            font-family: var(--font-shippori-antique);
            line-height: 1;
            letter-spacing: -0.07em;
            font-size: calc(54 * var(--vw-with-scrollbar) / 400);
        }
        .application-guidelines-popup__header-text--inverted span {
            background: var(--silver-texture);
            background-size: cover;
            background-position: center;
        }

        .application-guidelines-popup__bg {
            position: absolute;
            inset: 0;
            z-index: 0;
        }

        .application-guidelines-popup__bg > * {
            position: absolute;
        }

        .application-guidelines-popup__bg-img {
            top: 0;
            left: 50%;
            transform: translateX(-50%);
            height: 100%;
            width: auto;
        }

        .application-guidelines-popup__fg-img {
            inset: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .application-guidelines-popup__bg::after {
            display: block;
            height: 100%;
            content: "";
            inset: 0;
            background-color: #d9d9d9;
            mix-blend-mode: multiply;
        }

        /* .application-guidelines-popup[data-popup="new-graduate"]
            .application-guidelines-popup__content {
            background-image: url(../img/recruit/popup-bg-01.webp);
        }
        .application-guidelines-popup[data-popup="delivery"]
            .application-guidelines-popup__content {
            background-image: url(../img/recruit/popup-bg-02.webp);
        }
        .application-guidelines-popup[data-popup="sales"]
            .application-guidelines-popup__content {
            background-image: url(../img/recruit/popup-bg-04.webp);
        }
        .application-guidelines-popup[data-popup="clerk"]
            .application-guidelines-popup__content {
            background-image: url(../img/recruit/popup-bg-03.webp);
        } */

        .application-guidelines-popup[data-popup="new-graduate"] {
            .application-guidelines-popup__header {
                margin-bottom: calc(45 * var(--vw-with-scrollbar) / 400);
                align-items: center;
            }
            .application-guidelines-popup__header-text:nth-child(1) {
                width: calc(380 * var(--vw-with-scrollbar) / 400);
                padding-top: calc(5 * var(--vw-with-scrollbar) / 400);
                padding-left: calc(17 * var(--vw-with-scrollbar) / 400);
                margin-bottom: calc(12 * var(--vw-with-scrollbar) / 400);
            }
            .application-guidelines-popup__header-text:nth-child(2) {
                min-width: calc(450 * var(--vw-with-scrollbar) / 400);
                padding-top: calc(11 * var(--vw-with-scrollbar) / 400);
                padding-left: calc(79 * var(--vw-with-scrollbar) / 400);
                margin-bottom: calc(14 * var(--vw-with-scrollbar) / 400);
            }
            .application-guidelines-popup__header-text:nth-child(3) {
                width: calc(180 * var(--vw-with-scrollbar) / 400);
                padding-top: calc(6 * var(--vw-with-scrollbar) / 400);
                padding-left: calc(17 * var(--vw-with-scrollbar) / 400);
                height: calc(79 * var(--vw-with-scrollbar) / 400);
            }
        }
        .application-guidelines-popup[data-popup="delivery"] {
            .application-guidelines-popup__header {
                margin-bottom: calc(87 * var(--vw-with-scrollbar) / 400);
                align-items: start;
            }
            .application-guidelines-popup__header-text:nth-child(1) {
                width: calc(450 * var(--vw-with-scrollbar) / 400);
                padding-top: calc(11 * var(--vw-with-scrollbar) / 400);
                padding-left: calc(130 * var(--vw-with-scrollbar) / 400);
                margin-bottom: calc(10 * var(--vw-with-scrollbar) / 400);
            }
            .application-guidelines-popup__header-text:nth-child(2) {
                min-width: calc(364 * var(--vw-with-scrollbar) / 400);
                padding-top: calc(6 * var(--vw-with-scrollbar) / 400);
                padding-left: calc(12 * var(--vw-with-scrollbar) / 400);
                margin-left: calc(46 * var(--vw-with-scrollbar) / 400);
            }
        }
        .application-guidelines-popup[data-popup="sales"] {
            .application-guidelines-popup__header {
                margin-bottom: calc(63 * var(--vw-with-scrollbar) / 400);
                align-items: start;
            }
            .application-guidelines-popup__header-text:nth-child(1) {
                width: calc(364 * var(--vw-with-scrollbar) / 400);
                padding-top: calc(5 * var(--vw-with-scrollbar) / 400);
                padding-left: calc(25 * var(--vw-with-scrollbar) / 400);
                margin-left: calc(35 * var(--vw-with-scrollbar) / 400);
                margin-bottom: calc(14 * var(--vw-with-scrollbar) / 400);
            }
            .application-guidelines-popup__header-text:nth-child(2) {
                min-width: calc(430 * var(--vw-with-scrollbar) / 400);
                max-width: calc(430 * var(--vw-with-scrollbar) / 400);
                padding-top: calc(10 * var(--vw-with-scrollbar) / 400);
                padding-left: calc(17 * var(--vw-with-scrollbar) / 400);
                margin-left: calc(11 * var(--vw-with-scrollbar) / 400);
                margin-bottom: calc(13 * var(--vw-with-scrollbar) / 400);
            }
            .application-guidelines-popup__header-text:nth-child(3) {
                min-width: calc(451 * var(--vw-with-scrollbar) / 400);
                padding-top: calc(11 * var(--vw-with-scrollbar) / 400);
                padding-left: calc(52 * var(--vw-with-scrollbar) / 400);
            }
        }
        .application-guidelines-popup[data-popup="clerk"] {
            .application-guidelines-popup__header {
                margin-bottom: calc(72 * var(--vw-with-scrollbar) / 400);
                align-items: start;
            }
            .application-guidelines-popup__header-text:nth-child(1) {
                width: calc(364 * var(--vw-with-scrollbar) / 400);
                padding-top: calc(6 * var(--vw-with-scrollbar) / 400);
                padding-left: calc(12 * var(--vw-with-scrollbar) / 400);
                margin-left: calc(46 * var(--vw-with-scrollbar) / 400);
                margin-bottom: calc(15 * var(--vw-with-scrollbar) / 400);
            }
            .application-guidelines-popup__header-text:nth-child(2) {
                min-width: calc(451 * var(--vw-with-scrollbar) / 400);
                padding-top: calc(11 * var(--vw-with-scrollbar) / 400);
                padding-left: calc(107 * var(--vw-with-scrollbar) / 400);
            }
        }
    }
}
/* End Recruit Page CSS */
/* Start Single Application Guide Page CSS */
#single-requirement {
    background: var(--main-gra-nz-texture);
    background-size: cover;
    color: var(--base-color);
    padding-bottom: calc(124 * var(--vw-with-scrollbar) / 1920);

    .header-section {
        display: flex;
        padding: calc(50 * var(--vw-with-scrollbar) / 1920);
        gap: calc(40 * var(--vw-with-scrollbar) / 1920);
        align-items: center;
        justify-content: center;
        line-height: 1;
        color: white;
    }
    .header-section__title {
        font-family: var(--font-shippori-antique);
        font-weight: 400;
        font-size: calc(100 * var(--vw-with-scrollbar) / 1920);
    }
    .header-section__role {
        font-size: clamp(
            16px,
            calc(30 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        letter-spacing: 0.5em;
        margin-right: -0.5em;
    }
    .content-table {
        width: 100%;
        border-collapse: collapse;
        table-layout: fixed;
    }
    .content-table td {
        border-width: calc(2 * var(--vw-with-scrollbar) / 1920);
        border-style: solid;
        border-color: var(--base-color);
        box-sizing: border-box;
    }
    .content-table tr td:first-child {
        border-left-width: 0;
    }
    .content-table tr td:last-child {
        border-right-width: 0;
    }
    .decorated-cell {
        width: calc(175 * var(--vw-with-scrollbar) / 1920);
    }
    .field-name-cell {
        width: calc(465 * var(--vw-with-scrollbar) / 1920);
        padding: calc(34 * var(--vw-with-scrollbar) / 1920)
            calc(51 * var(--vw-with-scrollbar) / 1920);
        text-align: end;
        vertical-align: top;
    }
    .content-table h2 {
        font-size: calc(40 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
    }
    .content-table p {
        font-size: clamp(
            16px,
            calc(24 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        line-height: 1.67;
    }
    .content-cell {
        padding: calc(32 * var(--vw-with-scrollbar) / 1920) 0
            calc(36 * var(--vw-with-scrollbar) / 1920)
            calc(59 * var(--vw-with-scrollbar) / 1920);
    }
    .spacer-row {
        height: calc(40 * var(--vw-with-scrollbar) / 1920);
    }
}
@media (min-width: 1025px) {
    #single-requirement {
        .content-table tr:first-child .content-cell {
            padding: calc(36 * var(--vw-with-scrollbar) / 1920)
                calc(8 * var(--vw-with-scrollbar) / 1920)
                calc(34 * var(--vw-with-scrollbar) / 1920)
                calc(51 * var(--vw-with-scrollbar) / 1920);
        }
        .content-table tr:nth-child(5) .content-cell {
            padding-top: calc(26 * var(--vw-with-scrollbar) / 1920);
        }
        .content-table tr:nth-child(7) .content-cell {
            padding-top: calc(34 * var(--vw-with-scrollbar) / 1920);
        }
        .content-table tr:last-child .content-cell {
            padding-top: calc(36 * var(--vw-with-scrollbar) / 1920);
            padding-bottom: calc(57 * var(--vw-with-scrollbar) / 1920);
        }
        .content-table tr:nth-child(3) .field-name-cell {
            padding-top: calc(26 * var(--vw-with-scrollbar) / 1920);
        }
        .content-table tr:nth-child(3) .field-name-cell,
        .content-table tr:nth-child(5) .field-name-cell {
            padding-top: calc(26 * var(--vw-with-scrollbar) / 1920);
        }
        .content-table tr:nth-child(9) .field-name-cell {
            padding-top: calc(29 * var(--vw-with-scrollbar) / 1920);
        }
        .content-table tr:last-child .field-name-cell {
            padding-top: calc(36 * var(--vw-with-scrollbar) / 1920);
        }
    }
}
@media (max-width: 1024px) {
    #single-requirement {
        background-size: 100% cover;
        padding-bottom: 0;

        .header-section {
            padding: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400);
            padding-bottom: calc(20 * var(--vw-with-scrollbar) / 400);
            flex-direction: column-reverse;
            gap: calc(10 * var(--vw-with-scrollbar) / 400);
        }

        .header-section__title {
            font-size: calc(50 * var(--vw-with-scrollbar) / 400);
        }
        .header-section__role {
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
        }

        table,
        tbody,
        tr,
        td {
            width: 100% !important;
            box-sizing: border-box;
        }

        table,
        tbody,
        tr,
        td {
            display: block;
        }

        .content-table tr {
            padding: calc(20 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400) !important;
        }

        .content-table td {
            padding: calc(10 * var(--vw-with-scrollbar) / 400) 0 !important;
            border: none;
        }

        .decorated-cell,
        .spacer-row {
            display: none;
        }
        .content-table .field-name-cell {
            text-align: start;
            border-bottom: calc(1 * var(--vw-with-scrollbar) / 400) solid
                var(--base-color);
        }

        .content-table h2 {
            font-size: calc(24 * var(--vw-with-scrollbar) / 400);
            line-height: 1.67;
        }
        .content-table p {
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
            line-height: 1.8;
        }
    }
}
/* End Single Application Guide Page CSS */

/* CSS Contact form  */
#contact {
    .sub-page-header__bg {
        background-image: url(../img/contact/contact-banner.png);
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        overflow: hidden;
    }
    .top-kv {
        margin-bottom: 8.33333vw;
        position: relative;
        left: 4.16666vw;
        width: 92vw;
    }
    .top-kv__title-pc-overlay {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    .top-kv__title-pc-jp {
        font-family: var(--font-noto-serif-jp);
        font-size: clamp(0px, calc(64 * 100vw / 1920), 64px);
        font-weight: 700;
        color: var(--white-color);
        background: var(--black-color);
        padding: clamp(0px, calc(9 * 100vw / 1920), 9px)
            clamp(0px, calc(20 * 100vw / 1920), 20px)
            clamp(0px, calc(9 * 100vw / 1920), 9px)
            clamp(0px, calc(12 * 100vw / 1920), 12px);
    }
    .top-kv__title-pc-en {
        display: flex;
        font-family: var(--font-syne);
        font-weight: 800;
        font-size: clamp(0px, calc(109 * 100vw / 1920), 110px);
        color: var(--main-color);
        background-color: var(--black-color);
        padding-right: clamp(0px, calc(16 * 100vw / 1920), 16px);
    }
}

.contact-form-section {
    min-height: fit-content;
    padding: 6.14583vw 0 2vw;
    position: relative;
}

.contact-form-section.finish-form {
    padding: 9.30416vw 0;
}

.contact-form-container {
    width: 62.5vw;
    height: fit-content;
    display: flex;
    row-gap: 7.8125vw;
    flex-direction: column;
    margin: auto;
    align-items: center;
}

.contact-form-container .description-row {
    overflow: hidden;
}

.contact-form-section .contact-form-container .description-row p {
    width: fit-content;
    margin: 0 auto;
    text-align: center;
    font-family: var(--font-noto-sans-jp);
    font-style: normal;
    font-weight: 400;
    font-size: 1.09375vw;
    line-height: 2.0833vw;

    color: #000000;
}

.phone-information {
    display: flex;
    gap: 1vw;
    transform: translateY(200%);
}

.phone-information h2 {
    font-family: var(--font-noto-sans-jp);
    font-style: normal;
    font-weight: 500;
    font-size: 1.61458vw;
    line-height: 100%;
    color: #000000;
    margin: 0;
}

.contact-form-section .contact-form-container .information-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2.6041vw 0;
    gap: 2.604166vw;
    width: 26.875vw;
    height: 10.3125vw;
    border: 2px solid #000000;
    border-radius: 1.5625vw;
    margin: 0 auto;
    box-sizing: border-box;
    opacity: 1;
    /* transform: translate(0, 50px); */
    /* transition: 1.5s cubic-bezier(0.08, 0.92, 0.35, 1); */
}

.contact-form-section
    .contact-form-container
    .information-box.section-animate-pc.animate,
.description-row.section-animate-pc.animate .section-text-up__text {
    opacity: 1;
    transform: translate(0, 0);
}

.contact-form-section .contact-form-container .information-box span {
    font-family: var(--font-noto-sans-jp);
    font-style: normal;
    font-weight: 400;
    font-size: 0.83333vw;
    line-height: 100%;
    color: #000000;
}

.time-information {
    font-family: var(--font-noto-sans-jp);
    font-style: normal;
    font-weight: 350;
    font-size: 0.8333vw;
    line-height: 100%;
    color: #000000;
    transform: translateY(200%);
}

.forminator-field {
    display: flex;
    flex-wrap: wrap;
    column-gap: 0;
    justify-content: space-between;
    padding: 0px !important;
    width: 46.875vw;
    margin: 0 auto !important;
}

.forminator-field .forminator-textarea {
    height: 10.41666vw;
}

.forminator-field input,
.forminator-field textarea {
    padding: 0.7291vw 1.0416vw;
    background-color: #f2f2f2;
    border: 1px solid #c4c3c3;
    font-size: 0.99vw !important;
    line-height: 1.35416vw;
    flex: 1;
    max-width: 26.0416vw !important;
    width: 26.0416vw !important;
    min-height: 3.6458vw !important;
    border-radius: 10px !important;
    font-family: var(--font-noto-sans-jp) !important;
}

.forminator-checkbox-label {
    margin-left: 1.5625vw !important;
    margin-top: 0.5vw;
    font-family: var(--font-noto-sans-jp);
    font-style: normal;
    font-weight: 500;
    font-size: 1.09375vw;
    line-height: 100%;
    /* or 21px */
    color: #000000;
}

.forminator-field .zipcode-input-wrapper input {
    padding: 0.7291vw 1.0416vw;
    background-color: #f2f2f2;
    border: 1px solid #c4c3c3;
    font-size: 0.99vw !important;
    line-height: 1.35416vw;
    flex: 1;
    max-width: 10.4166vw !important;
    width: 10.4166vw !important;
    font-family: var(--font-noto-sans-jp) !important;
}

.forminator-label {
    display: flex !important;
    flex-direction: row;
    justify-content: unset;
    white-space: nowrap;
    width: 13.02vw;
    gap: 0.5641vw;
}

.forminator-field-textarea .forminator-label {
    align-items: flex-start;
}

.forminator-error-message {
    width: 100%;
    text-align: left;
    order: 2;
}

.forminator-label .forminator-required,
.forminator-required {
    color: #f3f8fb !important;
    background-image: url("../img/contact/required-background.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 0 0.5208vw;
    display: flex !important;
    align-items: center;
    border-radius: 0.260416vw;
    min-height: 1.9791vw;
    font-size: 0.99vw !important;
    content: "必須" !important;
    font-weight: 400 !important;
    line-height: 100% !important;
    margin-left: 1vw;
    height: fit-content;
    font-family: var(--font-noto-sans-jp) !important;
}

.forminator-field .input-wrapper {
    display: flex;
    align-items: center;
    gap: 11px;
    width: 192px;
}

.forminator-row .hr {
    border-top: 1px solid #dedede;
    margin: 0;
    padding: 0 !important;
}

.forminator-row .hr-big {
    border-top: 4px solid #bbc8d5;
    margin: 0;
    padding: 0 !important;
}

.forminator-pagination-steps {
    width: 100% !important;
    height: 5.50833vw !important;
}

.forminator-pagination-steps,
.forminator-pagination-steps-view {
    align-items: flex-start !important;
    width: 100% !important;
    display: flex !important;
    margin: 0 0 7.8125vw !important;
    gap: 0vw;
}

.forminator-ui.forminator-custom-form[data-design="default"]:not(
        .forminator-size--small
    )
    .forminator-pagination-steps
    .forminator-step {
    width: 19.6875vw !important;
}

.forminator-step {
    flex-direction: column-reverse !important;
    width: 30%;
    height: 5.20833vw !important;
}

.forminator-step-dot {
    font-family: var(--font-noto-sans-jp) !important;
    font-style: normal;
    font-weight: 400;
    font-size: 1.25vw;
    line-height: 100%;
    color: #ffffff;
    border-radius: 0 !important;
    border: 1px solid #000000;
    border-color: #000000 !important;
    color: #ffffff;
    background-color: unset !important;
    width: 19.791vw !important;
    min-height: 5.20833vw !important;
    padding: 1.8vw !important;
    letter-spacing: 1.32px;
}

.forminator-current .forminator-step-dot {
    border: none !important;
    color: #fff;
}

.forminator-break {
    display: none !important;
}

.forminator-pagination-steps .forminator-step-label {
    display: none !important;
}

.forminator-current .forminator-step-dot::before {
    color: #fff;
}

.forminator-current.forminator-step-0 .forminator-step-dot {
    border: none !important;
    color: #000000;
    text-align: center;
    background-color: transparent !important;
    background-image: url("../img/contact/PC_ACTIVE_1.png");
    background-size: 100% 100%;
}

.forminator-current.forminator-step-1 .forminator-step-dot {
    border: none !important;
    color: #000000;
    text-align: center;
    background-image: url("../img/contact/PC_ACTIVE_2.png");
    background-size: 100% 100%;
}

.forminator-current.forminator-step-2 .forminator-step-dot {
    border: none !important;
    color: #000000;
    text-align: center;
    background-image: url("../img/contact/PC_ACTIVE_3.png");
    background-size: 100% 100%;
}

.forminator-step-0 .forminator-step-dot {
    border: none !important;
    color: #000000;
    text-align: center;
    background-color: transparent !important;
    background-image: url("../img/contact/PC_NORMAL_1.png");
    background-size: 100% 100%;
    padding-top: 2vw !important;
}

.forminator-step-1 .forminator-step-dot {
    border: none !important;
    color: #000000;
    text-align: center;
    background-image: url("../img/contact/PC_NORMAL_2.png");
    background-size: 100% 100%;
    padding-top: 2vw !important;
}

.forminator-step-2 .forminator-step-dot {
    border: none !important;
    color: #000000;
    text-align: center;
    background-image: url("../img/contact/PC_NORMAL_3.png");
    background-size: 100% 100%;
    padding-top: 2vw !important;
}

.forminator-step-label {
    width: 114px !important;
    margin-top: 10px;
    font-size: 15px;
    line-height: 30px;
}

.forminator-current .forminator-step-label {
    display: none !important;
}

.forminator-row .forminator-field-address .forminator-row {
    margin-top: 0 !important;
}

.forminator-row {
    margin-top: 2.60416vw !important;
    margin-bottom: 0 !important;
}

.forminator-row .form-zipcode {
    height: 6vw;
}

.form-input-both-line {
    padding: 30px 0px !important;
    border-bottom: 1px solid #dedede;
    border-top: 1px solid #dedede;
}

.form-input-bottom-line {
    padding-bottom: 2.60416vw !important;
    border-bottom: 1px solid #9baec9;
}

.form-input-no-line {
    padding: 0 !important;
    border-bottom: none !important;
}

.input-480 input {
    flex: 0 1 26.04166vw;
}

.input-640 input {
    flex: 0 1 640px;
}

.iti--show-flags {
    display: flex !important;
}

.iti__country-container {
    display: none;
}

.input-140 input {
    flex: 0 1 140px;
}

.survey {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.form-heading {
    padding: 9px 15px !important;
    background-color: #e5eff5;
    margin-top: 70px;
    margin-bottom: 20px;
}

.form-heading .inquiry-title {
    font-size: 16px;
    line-height: 34px;
    font-weight: bold;
}

.form-subheading {
    padding: 0 !important;
}

.form-subheading p {
    font-size: 15px;
    line-height: 30px;
}

.survey .forminator-label {
    width: 210px;
}

.forminator-ui.forminator-custom-form[data-design="default"]
    .forminator-radio
    .forminator-radio-bullet:before {
    width: 15px !important;
    height: 15px !important;
}

.forminator-required {
    margin-top: 0.3vw;
}

/* 
.forminator-ui.forminator-custom-form[data-design=default] .forminator-radio:not(.forminator-radio-inline):first-of-type {
    margin-top: 0 !important;
}

#forminator-field-radio-1-label-1 {
    align-items: end !important;
    margin-top: 0 !important;
}
*/
.survey #forminator-field-radio-1-label-5 {
    margin-left: 230px;
    margin-top: 0px;
}

.form-textarea .forminator-textarea {
    flex: 0 1 650px;
}

.form-textarea:not(.no-ml) .forminator-textarea {
    margin-top: 20px !important;
    margin-left: 245px !important;
}

.mt--40 {
    margin-top: -40px;
}

.forminator-col:not(.survey):not(.form-textarea) .forminator-error-message {
    background-color: unset !important;
    font-size: 0.83333vw !important;
    padding: 0 !important;
    color: #ff0000 !important;
}

.survey .forminator-error-message {
    background-color: unset !important;
    margin-left: 250px !important;
}

.forminator-error-message.email-error {
    display: flex !important;
}

.forminator-error-message.katakana-error-message {
    display: flex !important;
}

.form-textarea .forminator-error-message {
    background-color: unset !important;
    margin-left: 230px !important;
}

.forminator-pagination-footer {
    justify-content: center !important;
    gap: 2.60416vw;
    margin-top: 7.8125vw !important;
}

.forminator-pagination-footer .forminator-button {
    width: 18.75vw !important;
    padding: 1.302vw 2.1354vw !important;
    height: 4.375vw;
    background: #ffffff;
    border: 2px solid #000000 !important;
    margin-top: 0 !important;
    font-size: 1.25vw !important;
    font-family: var(--font-noto-sans-jp) !important;
    color: #000000;
    box-shadow: unset !important;
}

.forminator-response-message.forminator-success {
    background-color: unset !important;
    -webkit-box-shadow: unset !important;
    box-shadow: unset !important;
    text-align: center !important;
}

.form-input-review {
    padding-left: 0 !important;
}

.form-input-review p {
    font-size: 0.99vw;
    line-height: 1.5625vw !important;
    margin-bottom: 0px !important;
    color: #000000;
}

.forminator-design--default #radio-1 .forminator-field .forminator-label {
    line-height: 1.0833vw !important;
}

.forminator-design--default #radio-1 .forminator-field .forminator-required {
    margin-top: -0.2vw;
}

.forminator-design--default .forminator-label {
    font-size: 1.09375vw !important;
    font-family: var(--font-noto-sans-jp) !important;
    font-weight: 500 !important;
    line-height: 2.29166vw !important;
    color: #000000;
}

.forminator-description {
    font-family: var(--font-noto-sans-jp) !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 0.83333vw !important;
    line-height: 100% !important;
    color: #707070 !important;
    margin-top: 1vw !important;
}

.form-phone .forminator-description span {
    display: none;
}

.zipcode-input-wrapper .forminator-description {
    position: absolute;
    left: 0.5vw;
}

.forminator-merge-tags {
    font-size: 15px !important;
    font-weight: 500 !important;
}

.forminator-design--default
    .forminator-pagination-steps
    .forminator-step.forminator-current
    ~ .forminator-step
    .forminator-step-label {
    color: #707f8e !important;
    display: none !important;
}

.company_housing_management_status {
    margin-top: -40px !important;
}

input[type="checkbox"]:checked {
    accent-color: green !important;
}

.name-service {
    border-top: 1px solid #dedede;
    padding: 35px 15px 0 0 !important;
}

.name-service .p1 {
    margin-top: 10px;
}

.forminator-row .forminator-radio-label {
    font-family: var(--font-noto-sans-jp) !important;
    font-weight: 400 !important;
    font-style: normal;
    font-size: 1.09375vw;
    line-height: 100%;
    color: #000000;
    margin-left: 1.0416vw !important;
}

#custom-err {
    font-size: 12px;
    font-family: inherit;
    font-weight: 500;
    color: #e04562;
    margin-left: 30px;
}

.forminator-step-0 .forminator-step-dot::before {
    content: "項目の入力";
    margin-right: 2vw;
}

.forminator-step-1 .forminator-step-dot::before {
    content: "確認画面";
}

.forminator-step-2 .forminator-step-dot::before {
    content: "送信完了";
}

.forminator-break {
    background-color: unset !important;
}

input#forminator-field-name-4_67fb9b0a65068 {
    width: 10.4166vw;
}

.privacy-policy-container {
    display: flex;
    isolation: isolate;
    max-width: 41.6666vw;
    width: 41.6666vw;
    height: 17.70833vw;
    background: #ffffff;
    border: 1px solid #000000;
    margin: 0 auto;
    padding: 0 !important;
}

.privacy-policy-container .forminator-field.forminator-merge-tags {
    flex-direction: column;
    align-items: center;
    gap: 2.60416vw;
    justify-content: unset;

    box-sizing: border-box;

    display: flex !important;
    padding: 2.60416vw !important;
    gap: 2.60416vw !important;
    isolation: isolate !important;

    background: #ffffff !important;

    font-family: var(--font-noto-sans-jp) !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 0.82051vw !important;
    line-height: 150% !important;
    /* or 24px */

    color: #333333 !important;
    flex-wrap: unset;
    overflow-y: auto;
}

.forminator-row
    .privacy-policy-container
    .forminator-field.forminator-merge-tags
    p {
    font-family: var(--font-noto-sans-jp) !important;
    font-style: normal;
    font-weight: 400;
    font-size: 0.83333vw;
    line-height: 150%;
    color: #333333;
}

.privacy-policy-container
    .forminator-field.forminator-merge-tags
    .forminator-label {
    font-family: var(--font-noto-sans-jp) !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 1.25vw !important;
    line-height: 100% !important;
    text-align: center !important;

    color: #333333 !important;
}

.privacy-policy-container
    .forminator-field.forminator-merge-tags
    .forminator-label {
    font-family: var(--font-noto-sans-jp) !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 1.25vw !important;
    line-height: 100% !important;
    text-align: center !important;

    color: #333333 !important;
}

/* Custom scrollbar */
.privacy-policy-container::-webkit-scrollbar {
    width: 8px;
}

.privacy-policy-container::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 5px;
}

.privacy-policy-container::-webkit-scrollbar-thumb {
    background: #d7d6d6;
    border-radius: 5px;
}

.privacy-policy-container::-webkit-scrollbar-thumb:hover {
    background: #c0c0c0;
}

.zipcode-input-wrapper {
    display: flex;
    align-items: center;
    gap: 1vw;
    margin-bottom: 0.625vw;
    width: 26.71875vw;
    position: relative;
}

.zipcode-symbol {
    font-family: var(--font-noto-sans-jp) !important;
    font-style: normal;
    font-weight: 400;
    font-size: 1.25vw;
    line-height: 100%;
    color: #000000;
}

.zipcode-search-button {
    background-color: #000000;
    padding: 0.26041vw 0;
    cursor: pointer;
    width: 12.9375vw;
    height: 2.5vw;
    font-family: var(--font-noto-sans-jp) !important;
    font-style: normal;
    font-weight: 400;
    font-size: 0.98958vw;
    line-height: 1.197916vw;
    color: #ffffff;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border-radius: 0.52083vw;
}

.radio-option-wrapper {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-right: 9.5vw;
}

div#checkbox-1 span.forminator-required {
    margin-right: 1vw;
}

.forminator-row #checkbox-1 .forminator-checkbox {
    margin: 0 auto;
}

.forminator-row #checkbox-1 .forminator-checkbox .forminator-checkbox-box {
    width: 1.0416666vw !important;
    height: 1.0416666vw !important;
    border-color: #333333 !important;
    margin-top: 0.5vw;
    flex: unset;
}

.forminator-button-next::after {
    content: "";
    display: inline-block;
    width: 1.04166vw;
    height: 1.04166vw;
    background-image: url("../img/contact/btn_yaji.png");
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: 1vw;
    position: absolute;
    top: 1.8vw;
}

.forminator-button-submit::after {
    content: "";
    display: inline-block;
    width: 1.04166vw;
    height: 1.04166vw;
    background-image: url("../img/contact/btn_yaji.png");
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: 1vw;
    position: absolute;
    top: 1.7vw;
}

.forminator-button-back::after {
    content: "";
    display: inline-block;
    width: 1.04166vw;
    height: 1.04166vw;
    background-image: url("../img/contact/btn_yaji.png");
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: 1vw;
    rotate: 180deg;
    position: absolute;
    top: 1.7vw;
    left: 3vw;
}

/**
 * End Contact Form
 * */

@media (max-width: 1024px) {
    .pc{
        display: none;
    }
    .forminator-step-0 .forminator-step-dot,
    .forminator-step-1 .forminator-step-dot,
    .forminator-step-2 .forminator-step-dot {
        padding-top: 4.8vw !important;
    }
    .forminator-ui.forminator-custom-form[data-design="default"]
        .forminator-radio
        .forminator-radio-bullet:before {
        width: 2.6666666vw !important;
        height: 2.6666666vw !important;
    }

    .forminator-row #checkbox-1 .forminator-checkbox .forminator-checkbox-box {
        min-width: 5.33333vw !important;
        min-height: 5.33333vw !important;
        border-color: #333333 !important;
    }
    .forminator-field-checkbox.left-error-message .forminator-error-message {
        text-align: center;
        margin-left: 1vw !important;
        margin-top: 0 !important;
    }

    a[href^="tel"] {
        pointer-events: none;
        color: inherit;
    }

    .forminator-button-next::after {
        content: "";
        display: inline-block;
        width: 2vw;
        height: 2vw;
        background-image: url("../img/contact/btn_yaji.png");
        background-size: contain;
        background-repeat: no-repeat;
        margin-left: 3vw;
        position: absolute;
        top: 4.6vw;
    }

    .contact-form-first-section {
        background-image: url("../img/contact/contract-form-banner_phone.jpg") !important;
        min-height: 90.6666vw !important;
    }

    .forminator-field {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        row-gap: 4vw;
        justify-content: space-between;
        padding: 0 !important;
        width: 100%;
    }

    .forminator-field input,
    .forminator-field textarea {
        padding: 0.7291vw 1.0416vw;
        background-color: #f2f2f2;
        border: 1px solid #c4c3c3;
        font-size: 4.26666vw !important;
        line-height: 1.35416vw;
        flex: 1;
        max-width: unset !important;
        width: 100% !important;
        min-height: 11.333333vw !important;
        font-family: var(--font-noto-sans-jp) !important;
    }

    .forminator-field .zipcode-input-wrapper input {
        background-color: #f2f2f2;
        border: 1px solid #f2f7fa;
        font-size: 4.26666vw !important;
        margin-left: 7vw !important;
        max-width: 28.6666vw !important;
        width: 28.6666vw !important;
        height: 9.333333vw !important;
        font-family: var(--font-noto-sans-jp) !important;
    }

    .forminator-label {
        display: flex !important;
        flex-direction: row;
        justify-content: unset;
        align-items: center;
        white-space: nowrap;
        width: fit-content;
        gap: 11px;
    }

    .forminator-field-textarea .forminator-label {
        align-items: center;
    }

    .forminator-error-message {
        width: fit-content;
        text-align: left;
        order: 2;
    }

    .forminator-label .forminator-required,
    .forminator-required {
        color: #f3f8fb !important;
        min-width: 7.7333vw !important;
        height: 6vw !important;
        padding: 2vw 1vw !important;
        border-radius: 0.6666vw !important;
        font-size: 3.2vw !important;
        content: "必須" !important;
        font-weight: 400 !important;
        line-height: 2.133vw !important;
        text-align: center !important;
    }

    .radio-option-wrapper label {
        margin: 2vw 0 !important;
    }

    .forminator-field .input-wrapper {
        display: flex;
        align-items: center;
        gap: 11px;
        width: 192px;
    }

    .forminator-row .hr {
        border-top: 1px solid #dedede;
        margin: 0;
        padding: 0 !important;
    }

    .forminator-row .hr-big {
        border-top: 4px solid #bbc8d5;
        margin: 0;
        padding: 0 !important;
    }

    .forminator-pagination-steps {
        width: 100% !important;
        height: 12.50833vw !important;
    }

    .forminator-pagination-steps,
    .forminator-pagination-steps-view {
        align-items: flex-start !important;
        width: 100% !important;
        display: flex !important;
        margin: 0 0 9.8125vw !important;
        gap: 0;
        justify-content: center;
    }

    .forminator-ui.forminator-custom-form[data-design="default"]:not(
            .forminator-size--small
        )
        .forminator-pagination-steps
        .forminator-step {
        width: 31.6875vw !important;
        height: auto !important;
    }

    .forminator-step.forminator-step .forminator-step-dot {
        width: 100% !important;
        height: 5.20833vw !important;
        margin-right: 0 !important;
    }

    .forminator-step-dot {
        font-family: var(--font-noto-sans-jp) !important;
        font-style: normal;
        font-weight: 400;
        font-size: 3.5333vw;
        line-height: 100%;
        color: #ffffff;
        color: #ffffff;
        /* background-color: unset !important; */
        /* width: 25.791vw !important; */
        min-height: 13.20833vw !important;
        padding: 4.8vw 1.8vw !important;
        letter-spacing: 1.32px;
    }

    .forminator-current .forminator-step-dot {
        border: none !important;
        color: #fff;
    }

    .forminator-step-label {
        width: 114px !important;
        margin-top: 10px;
        font-size: 15px;
        line-height: 30px;
    }

    .forminator-current .forminator-step-label {
        /* color: #C9141E !important; */
        display: none !important;
    }

    .forminator-row {
        margin-bottom: 6.66666vw !important;
    }

    .forminator-row .form-zipcode {
        height: 33vw;
    }

    .form-input-both-line {
        padding: 30px 0px !important;
        border-bottom: 1px solid #dedede;
        border-top: 1px solid #dedede;
    }

    .form-input-bottom-line {
        padding: 0 0 6.6666vw 0 !important;
    }

    .form-input-no-line {
        padding: 0 0 30px 0 !important;
        border-bottom: none !important;
    }

    .input-480 input {
        flex: 0 1 26.04166vw;
    }

    .input-640 input {
        flex: 0 1 640px;
    }

    .iti--show-flags {
        display: flex !important;
    }

    .iti__country-container {
        display: none;
    }

    .input-140 input {
        flex: 0 1 140px;
    }

    .survey {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .form-heading {
        padding: 9px 15px !important;
        background-color: #e5eff5;
        margin-top: 70px;
        margin-bottom: 20px;
    }

    .form-heading .inquiry-title {
        font-size: 16px;
        line-height: 34px;
        font-weight: bold;
    }

    .form-subheading {
        padding: 0 !important;
    }

    .form-subheading p {
        font-size: 15px;
        line-height: 30px;
    }

    .survey .forminator-label {
        width: 210px;
    }

    .forminator-ui.forminator-custom-form[data-design="default"]
        .forminator-radio:not(.forminator-radio-inline):first-of-type {
        margin-top: 0 !important;
    }

    #forminator-field-radio-1-label-1 {
        align-items: end !important;
        margin-top: 0 !important;
    }

    .survey #forminator-field-radio-1-label-5 {
        margin-left: 230px;
        margin-top: 0px;
    }

    .form-textarea .forminator-textarea {
        flex: 0 1 650px;
    }

    .form-textarea:not(.no-ml) .forminator-textarea {
        margin-top: 20px !important;
        margin-left: 245px !important;
    }

    .mt--40 {
        margin-top: -40px;
    }

    .forminator-col:not(.survey):not(.form-textarea) .forminator-error-message {
        background-color: unset !important;
        /* margin-left: 54vw !important; */
        font-size: 3.733333vw !important;
        text-align: left !important;
    }

    .survey .forminator-error-message {
        background-color: unset !important;
        margin-left: 250px !important;
    }

    .form-textarea .forminator-error-message {
        background-color: unset !important;
        margin-left: 230px !important;
    }

    .forminator-pagination-footer {
        justify-content: center !important;
        gap: 2vw;
    }

    .forminator-pagination-footer .forminator-button {
        margin-bottom: 0 !important;
        width: 38vw !important;
        padding: 1.302vw 2.1354vw !important;
        height: 11.2vw !important;
        background: #ffffff;
        border: 2px solid #000000 !important;
        margin-top: 6.770833vw !important;
        font-size: 3.2vw !important;
        font-family: var(--font-noto-sans-jp) !important;
        color: #ffffff;
    }

    .forminator-button-submit::after {
        content: "";
        display: inline-block;
        width: 2.04166vw;
        height: 2.04166vw;
        background-image: url("../img/contact/btn_yaji.png");
        background-size: contain;
        background-repeat: no-repeat;
        margin-left: 3vw;
        position: absolute;
        top: 4.5vw;
    }

    .forminator-button-back::after {
        content: "";
        display: inline-block;
        width: 2.04166vw;
        height: 2.04166vw;
        background-image: url("../img/contact/btn_yaji.png");
        background-size: contain;
        background-repeat: no-repeat;
        margin-left: 1vw;
        rotate: 180deg;
        position: absolute;
        top: 4.5vw;
        left: 3vw;
    }

    .forminator-response-message.forminator-success {
        background-color: unset !important;
        -webkit-box-shadow: unset !important;
        box-shadow: unset !important;
        text-align: center !important;
    }

    .form-input-review {
        padding-left: 0 !important;
    }

    .form-input-review p {
        font-size: 15px !important;
        line-height: 30px !important;
        margin-bottom: 0px !important;
    }

    .forminator-design--default .forminator-label {
        font-size: 4.4vw !important;
        font-family: var(--font-noto-sans-jp) !important;
        font-weight: 500 !important;
        line-height: 4vw !important;
    }

    .input-description-wrapper {
        width: 100% !important;
    }

    .forminator-description {
        font-size: 3.733333vw !important;
        position: unset !important;
        color: #707070 !important;
        pointer-events: none;
        color: inherit;
        margin-top: 2.66666vw !important;
    }

    .forminator-button-next,
    .forminator-button-submit,
    .forminator-button-back {
        color: #000000 !important;
    }

    .forminator-merge-tags {
        font-size: 15px !important;
        font-weight: 500 !important;
    }

    .forminator-design--default
        .forminator-pagination-steps
        .forminator-step.forminator-current
        ~ .forminator-step
        .forminator-step-label {
        color: #707f8e !important;
        display: none !important;
    }

    .company_housing_management_status {
        margin-top: -40px !important;
    }

    input[type="checkbox"]:checked {
        accent-color: green !important;
    }

    .name-service {
        border-top: 1px solid #dedede;
        padding: 35px 15px 0 0 !important;
    }

    .name-service .p1 {
        margin-top: 10px;
    }

    .forminator-row .forminator-radio-label {
        font-family: var(--font-noto-sans-jp) !important;
        font-style: normal;
        font-weight: 400 !important;
        font-size: 3.7333vw;
        line-height: 100% !important;
    }

    #custom-err {
        font-size: 12px;
        font-family: inherit;
        font-weight: 500;
        color: #e04562;
        margin-left: 30px;
    }

    .forminator-step-0 .forminator-step-dot::before {
        content: "項目の入力";
    }

    .forminator-step-1 .forminator-step-dot::before {
        content: "確認画面";
    }

    .forminator-step-2 .forminator-step-dot::before {
        content: "送信完了";
    }

    .forminator-break {
        background-color: unset !important;
    }

    input#forminator-field-name-4_67fb9b0a65068 {
        width: 10.4166vw;
    }

    .privacy-policy-container {
        box-sizing: border-box;
        display: flex;
        padding: 0;
        isolation: isolate;
        max-width: 100%;
        width: 100%;
        height: 60vw;
        background: #ffffff;
        border: 1px solid #000000;
        margin: 0 auto;
        overflow-y: auto;
    }

    .privacy-policy-container .forminator-field.forminator-merge-tags {
        flex-direction: column;
        align-items: center;
        gap: 2.60416vw;
        justify-content: unset;
        box-sizing: border-box;
        display: flex !important;
        padding: 2.60416vw !important;
        gap: 2.60416vw !important;
        isolation: isolate !important;
        background: #ffffff !important;
        font-family: var(--font-noto-sans-jp) !important;
        font-style: normal !important;
        font-weight: 400 !important;
        font-size: 2.133333vw !important;
        line-height: 150% !important;
        color: #333333 !important;
        flex-wrap: unset;
    }

    .privacy-policy-container
        .forminator-field.forminator-merge-tags
        .forminator-label {
        font-family: var(--font-noto-sans-jp) !important;
        font-style: normal !important;
        font-weight: 400 !important;
        font-size: 4.666666vw !important;
        line-height: 100% !important;
        text-align: center !important;

        color: #333333 !important;
    }

    .forminator-row
        .privacy-policy-container
        .forminator-field.forminator-merge-tags
        p {
        font-size: 3.4vw !important;
    }

    /* Custom scrollbar */
    .privacy-policy-container::-webkit-scrollbar {
        width: 8px;
    }

    .privacy-policy-container::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 5px;
    }

    .privacy-policy-container::-webkit-scrollbar-thumb {
        background: #d7d6d6;
        border-radius: 5px;
    }

    .privacy-policy-container::-webkit-scrollbar-thumb:hover {
        background: #c0c0c0;
    }

    .zipcode-input-wrapper {
        display: flex;
        align-items: center;
        gap: 0.5vw;
        margin-bottom: 0.625vw;
        width: 79.083vw;
        position: relative;
    }

    .zipcode-symbol {
        font-family: var(--font-noto-sans-jp) !important;
        font-style: normal;
        font-weight: 400;
        font-size: 5.2vw;
        line-height: 1.51vw;
        color: #000000;
        position: absolute;
        top: 4.6vw;
        left: -1vw;
    }

    .zipcode-search-button {
        background-color: #000000;
        padding: 0.26041vw;
        border: none;
        transition: background-color 0.2s ease;
        width: 44.3333vw;
        height: 8.4vw;
        font-family: var(--font-noto-sans-jp) !important;
        font-style: normal;
        font-weight: 400;
        font-size: 3.53333vw;
        line-height: 1.1979vw;
        color: #ffffff;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        border-radius: 10px;
        position: absolute;
        right: -5vw;
        top: 1.5vw;
    }

    .radio-option-wrapper {
        display: flex;
        flex-direction: column;
        gap: 0.625vw;
    }

    div#checkbox-1 span.forminator-required {
        margin-right: 1vw;
    }

    .forminator-row #checkbox-1 .forminator-checkbox {
        margin: 0;
    }
}

.description-text-pc {
    display: flex;
}

.description-text-phone {
    display: none;
}

/* END CSS Contact form  */

@media (max-width: 1024px) {
    .description-text-pc {
        display: none;
    }

    .description-text-phone {
        display: flex;
    }

    .contact-form-section {
        min-height: fit-content;
        padding: 10.4166vw 3.2vw 20vw;
    }

    .top-kv {
        left: 0 !important;
    }

    .contact-form-container {
        width: 100%;
        min-height: 239.5833vw;
        padding: 0;
        display: flex;
        row-gap: 5vw;
        flex-direction: column;
        box-sizing: border-box;
    }

    .contact-form-section .contact-form-container .description-row p {
        width: 100%;
        font-family: var(--font-noto-sans-jp) !important;
        font-style: normal;
        font-weight: 400;
        font-size: 4.4vw;
        line-height: 180%;
        /* or 34px */
        text-align: left;
        transition: 1.5s cubic-bezier(0.08, 0.92, 0.35, 1);
    }

    .contact-form-section .contact-form-container .information-box {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 6.6666vw 3.2083vw;
        gap: 5.60416vw;
        width: 100%;
        height: fit-content;
        border: 2px solid #000000;
        border-radius: 30px;
        margin: 0 auto;
    }

    .phone-information h2 {
        font-family: var(--font-noto-sans-jp);
        font-style: normal;
        color: #000000;
        font-weight: 500;
        font-size: 6.8vw;
        line-height: 100%;
    }

    .phone-information {
        display: flex;
        gap: 5vw;
    }

    .time-information {
        display: flex;
        gap: 2vw;
        flex-direction: column;
        font-family: var(--font-noto-sans-jp);
        font-style: normal;
        font-weight: 350;
        font-size: 3.2vw;
        line-height: 4vw;
        color: #000000;
    }

    .contact-form-section .contact-form-container .information-box span {
        font-family: var(--font-noto-sans-jp) !important;
        font-style: normal;
        font-weight: 400;
        font-size: 3.13333vw;
        line-height: 100%;

        color: #000000;
    }

    .forminator-ui.forminator-custom-form[data-design="default"]
        .forminator-description
        span {
        display: none;
    }

    .forminator-checkbox-label {
        font-size: 3vw !important;

        font-family: var(--font-noto-sans-jp) !important;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;

        color: #000000;
    }
}

/* Another Contact form  */
.finish-form .contact-form-container {
    width: 62.5vw;
    height: fit-content;
    display: flex;
    row-gap: 7.8125vw;
    flex-direction: column;
    margin: auto;
}

.finish-form {
    display: none;
    flex-direction: column;
    column-gap: 2vw;
}

.contact-form-section .content-form {
    width: fit-content;
    justify-items: center;
    margin: 0 auto;

    display: flex;
    flex-direction: column;
    gap: 7.8125vw;
}

.contact-form-section .content-form img {
    margin: 0 auto;
    width: 8.33333vw;
    height: 10.52083vw;
}

.contact-form-section .content-form .detail-content p {
    text-align: center !important;

    font-family: var(--font-noto-sans-jp) !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 1.09375vw !important;
    line-height: 180% !important;
    text-align: center !important;

    color: #000000;
}

.color-background {
    background: linear-gradient(to bottom, transparent 30%, #1d115a 10%);
    width: 46.82vw;
    height: 16.73vw;
    margin: 0 auto;
}

.left-error-message .forminator-error-message {
    text-align: left;
    margin-top: 2vw !important;
    margin-left: 21vw !important;
    color: #ff0000 !important;
}

.forminator-field-checkbox.left-error-message .forminator-error-message {
    text-align: center;
    margin-left: -5.5vw !important;
    margin-top: 0 !important;
}

.forminator-field .inquiry-title {
    font-size: 0.99vw !important;
    font-family: var(--font-noto-sans-jp) !important;
    font-weight: 400;
    color: #000000;
}
.forminator-design--default .forminator-radio .forminator-radio-bullet {
    width: 1.302083vw !important;
    height: 1.302083vw !important;
    flex: unset !important;
}

@media (max-width: 1024px) {
    .forminator-design--default .forminator-radio .forminator-radio-bullet {
        width: 4.33333vw !important;
        height: 4.33333vw !important;
        flex: unset !important;
    }
    .forminator-field .inquiry-title {
        font-size: 15px !important;
        font-family: var(--font-noto-sans-jp) !important;
        font-weight: 400;
        color: #ffffff;
    }

    .finish-form .contact-form-container {
        row-gap: 10vw;
        padding: 7.8125vw 6.41666vw;
        height: fit-content;
        min-height: fit-content;
        width: 100%;
    }

    .finish-form {
        flex-direction: column;
        column-gap: 2vw;
    }

    .contact-form-section .content-form {
        width: fit-content;
        justify-items: center;
        margin: 0 auto;

        display: flex;
        flex-direction: column;
        gap: 7.8125vw;
    }

    .contact-form-section .content-form img {
        margin: 0 auto;
        width: 16.33333vw;
        height: auto;
    }

    .contact-form-section .content-form .detail-content p {
        text-align: center !important;
        font-family: var(--font-noto-sans-jp) !important;
        font-style: normal !important;
        font-weight: 400 !important;
        font-size: 3vw !important;
        line-height: 180% !important;
        text-align: center !important;
        color: #000000;
    }

    .color-background {
        background: linear-gradient(to bottom, transparent 30%, #1d115a 10%);
        width: 46.82vw;
        height: 16.73vw;
        margin: 0 auto;
    }

    .left-error-message .forminator-error-message {
        text-align: right;
        margin-top: 0vw !important;
        margin-left: 0vw !important;
    }

    .forminator-field-checkbox.left-error-message .forminator-error-message {
        text-align: center;
        margin-left: 0vw !important;
        margin-top: 0 !important;
    }
}

.phone-information,
.time-information {
    transform: unset;
}

/* End Another Contact form  */
/* Start SDGs Page CSS */

@media (min-width: 1025px) {
    #sdgs-page {
        .goals-sdgs {
            position: relative;
            background: var(--main-gra-nz-texture);
        }
        .goals-sdgs-table {
            position: relative;
            width: calc(1025 * var(--vw-with-scrollbar) / 1920);
            height: calc(650 * var(--vw-with-scrollbar) / 1920);
            padding-top: calc(58.72 * var(--vw-with-scrollbar) / 1920);
            padding-bottom: calc(58.72 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(450 * var(--vw-with-scrollbar) / 1920);
        }
        .sdgs-title1 {
            font-family: var(--font-inter-static);
            font-style: normal;
            font-weight: 900;
            font-size: calc(30 * var(--vw-with-scrollbar) / 1920);
            line-height: calc(36 * var(--vw-with-scrollbar) / 1920);
            text-align: center;
            letter-spacing: 0.32em;
            color: transparent;
            -webkit-text-stroke: 1px #f5f5f5;
            transform: matrix(1, 0, -0.24, 0.97, 0, 0) !important;
            padding-bottom: calc(20 * var(--vw-with-scrollbar) / 1920);
        }
        .sdgs1 {
            transform: translateY(-20px);
            opacity: 0;
        }

        .sdgs-title2 {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(70 * var(--vw-with-scrollbar) / 1920);
            line-height: 100%;
            text-align: center;
            letter-spacing: 0.1em;
            color: #f5f5f5;
            padding-bottom: calc(50 * var(--vw-with-scrollbar) / 1920);
            opacity: 0;
            transform: translateY(-20px);
        }
        .sdgs-title2 span {
            font-size: calc(50 * var(--vw-with-scrollbar) / 1920);
            display: inline-block; /* để canh chỉnh dễ hơn */
            margin-left: -0.5em;
        }
        .sdgs-title3 {
            text-align: center;
            padding-bottom: calc(50 * var(--vw-with-scrollbar) / 1920);
            object-fit: cover;
            margin-left: calc(-20 * var(--vw-with-scrollbar) / 1920);
        }
        .title3 {
            width: calc(909 * var(--vw-with-scrollbar) / 1920);
            height: calc(80 * var(--vw-with-scrollbar) / 1920);
        }
        .sdgs-title4 {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(50 * var(--vw-with-scrollbar) / 1920);
            line-height: 180%;
            text-align: center;
            letter-spacing: 0.3em;
            color: #f5f5f5;
            opacity: 0;
            transform: translateY(-20px);
        }
        .sdgs-line {
            text-align: center;
            object-fit: cover;
            padding-bottom: calc(20 * var(--vw-with-scrollbar) / 1920);
            object-position: center;
            opacity: 0;
            transform: translateY(-20px);
        }
        .sdgs-title5 {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(20 * var(--vw-with-scrollbar) / 1920);
            line-height: 180%;
            text-align: center;
            letter-spacing: 0.3em;
            color: #f5f5f5;
        }
        .workplace {
            position: relative;
        }
        .workplace-bg {
            background-image: url(../img/sdgs/workplace-bg1.webp);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            height: calc(607 * var(--vw-with-scrollbar) / 1920);
        }
        .workplace-bg1 {
            background-image: url(../img/sdgs/workplace-bg2.webp);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            height: calc(607 * var(--vw-with-scrollbar) / 1920);
        }
        .workplace-bg2 {
            background-image: url(../img/sdgs/workplace-bg3.webp);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            height: calc(607 * var(--vw-with-scrollbar) / 1920);
        }
        .health-bg2 {
            background-image: url(../img/sdgs/workplace-bg3.webp);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            height: calc(607 * var(--vw-with-scrollbar) / 1920);
        }
        .responsibility-bg2 {
            background-image: url(../img/sdgs/workplace-bg3.webp);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            height: calc(607 * var(--vw-with-scrollbar) / 1920);
        }

        .workplace-tilte {
        }
        .workplace-tilte-col {
            display: flex;
            padding-bottom: calc(7 * var(--vw-with-scrollbar) / 1920);
            gap: calc(19 * var(--vw-with-scrollbar) / 1920);
            height: calc(150 * var(--vw-with-scrollbar) / 1920);
            opacity: 0;
            transform: translateY(-20px);
        }
        .workplace-tilte {
            padding-top: calc(194 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(135 * var(--vw-with-scrollbar) / 1920);
        }
        .workplace-number {
            object-fit: contain;
        }
        .workplace-content {
            width: calc(650 * var(--vw-with-scrollbar) / 1920);
            padding-top: calc(15 * var(--vw-with-scrollbar) / 1920);
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(50 * var(--vw-with-scrollbar) / 1920);
            line-height: 120%;
            background: var(--main-gra-nz);
            -webkit-background-clip: text !important;
            background-clip: text !important;
            -webkit-text-fill-color: transparent;
        }

        .workplace-tilte-down {
            padding-left: calc(155 * var(--vw-with-scrollbar) / 1920) !important;
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(24 * var(--vw-with-scrollbar) / 1920);
            line-height: 180%;
            width: calc(802 * var(--vw-with-scrollbar) / 1920);
            /*background: var(--main-gra-nz);
            -webkit-background-clip: text !important;
            background-clip: text !important;
            -webkit-text-fill-color: transparent;*/
			color: var(--main-color);
        }
        .workplace-index {
            display: flex;
            height: calc(267 * var(--vw-with-scrollbar) / 1920);
            opacity: 0;
            transform: translateY(-20px);
        }
        .workplace-index1 {
            flex: 1;
            background-color: #1b973a;
        }
        .workplace-index2 {
            flex: 1;
            background-color: #e83418;
        }
        .workplace-index3 {
            flex: 1;
            background-color: #970a31;
        }
        .workplace-index1-col {
            position: relative;
            padding-top: calc(20.5 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(35 * var(--vw-with-scrollbar) / 1920);
            padding-right: calc(35 * var(--vw-with-scrollbar) / 1920);

            display: flex;
            gap: calc(15 * var(--vw-with-scrollbar) / 1920);
        }
        .workplace-index1-left {
            background-image: url(../img/sdgs/sticker.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(228 * var(--vw-with-scrollbar) / 1920);
            height: calc(229 * var(--vw-with-scrollbar) / 1920);
        }
        .workplace-index1-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(18 * var(--vw-with-scrollbar) / 1920);
            line-height: 180%;
            width: calc(324 * var(--vw-with-scrollbar) / 1920);
            color: white;
            padding-top: calc(49 * var(--vw-with-scrollbar) / 1920);
        }
        .workplace-index2-col {
            position: relative;
            padding-top: calc(20.5 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(35 * var(--vw-with-scrollbar) / 1920);
            padding-right: calc(35 * var(--vw-with-scrollbar) / 1920);

            display: flex;
            gap: calc(15 * var(--vw-with-scrollbar) / 1920);
        }
        .workplace-index2-left {
            background-image: url(../img/sdgs/sticker1.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(228 * var(--vw-with-scrollbar) / 1920);
            height: calc(229 * var(--vw-with-scrollbar) / 1920);
        }
        .workplace-index2-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(18 * var(--vw-with-scrollbar) / 1920);
            line-height: 180%;
            width: calc(324 * var(--vw-with-scrollbar) / 1920);
            color: white;
            padding-top: calc(49 * var(--vw-with-scrollbar) / 1920);
        }
        .workplace-number svg {
            width: calc(152 * var(--vw-with-scrollbar) / 1920) !important;
            height: calc(150 * var(--vw-with-scrollbar) / 1920) !important;
        }
        .health-number svg {
            width: calc(152 * var(--vw-with-scrollbar) / 1920) !important;
            height: calc(150 * var(--vw-with-scrollbar) / 1920) !important;
        }
        .responsibility-number svg {
            width: calc(152 * var(--vw-with-scrollbar) / 1920) !important;
            height: calc(150 * var(--vw-with-scrollbar) / 1920) !important;
        }
        .workplace-index3-col {
            position: relative;
            padding-top: calc(20.5 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(35 * var(--vw-with-scrollbar) / 1920);
            padding-right: calc(35 * var(--vw-with-scrollbar) / 1920);
            display: flex;
            gap: calc(15 * var(--vw-with-scrollbar) / 1920);
        }
        .workplace-index3-left {
            background-image: url(../img/sdgs/sticker2.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(228 * var(--vw-with-scrollbar) / 1920);
            height: calc(229 * var(--vw-with-scrollbar) / 1920);
        }
        .workplace-index3-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(18 * var(--vw-with-scrollbar) / 1920);
            line-height: 180%;
            width: calc(324 * var(--vw-with-scrollbar) / 1920);
            color: white;
            padding-top: calc(49 * var(--vw-with-scrollbar) / 1920);
        }

        .health {
            position: relative;
        }
        .health-bg {
            background-image: url(../img/sdgs/health-bg1.webp);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            height: calc(607 * var(--vw-with-scrollbar) / 1920);
        }
        .health-bg1 {
            background-image: url(../img/sdgs/health-bg2.webp);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            height: calc(607 * var(--vw-with-scrollbar) / 1920);
        }
        .health-tilte {
        }
        .health-tilte-col {
            display: flex;
            opacity: 0;
            transform: translateY(-20px);
            gap: calc(19 * var(--vw-with-scrollbar) / 1920);
            height: calc(150 * var(--vw-with-scrollbar) / 1920);
        }
        .health-tilte {
            padding-top: calc(194 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(135 * var(--vw-with-scrollbar) / 1920);
        }
        .health-number {
            object-fit: contain;
        }
        .health-content {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(50 * var(--vw-with-scrollbar) / 1920);
            line-height: 120%;
            background: var(--main-gra-nz);
            -webkit-background-clip: text !important;
            background-clip: text !important;
            -webkit-text-fill-color: transparent;
            width: calc(550 * var(--vw-with-scrollbar) / 1920);
            padding-top: calc(15 * var(--vw-with-scrollbar) / 1920);
        }
        .health-tilte-down {
            padding-left: calc(155 * var(--vw-with-scrollbar) / 1920) !important;
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(24 * var(--vw-with-scrollbar) / 1920);
            line-height: 180%;
            width: calc(802 * var(--vw-with-scrollbar) / 1920);
            /*background: var(--main-gra-nz);
            -webkit-background-clip: text !important;
            background-clip: text !important;
            -webkit-text-fill-color: transparent;*/
			color: var(--main-color);
        }
        .health-index {
            display: flex;
            height: calc(267 * var(--vw-with-scrollbar) / 1920);
            opacity: 0;
            transform: translateY(-20px);
        }
        .health-index1 {
            flex: 1;
            background-color: #1b973a;
        }
        .health-index2 {
            flex: 1;
            background-color: #970a31;
        }
        .health-index1-col {
            position: relative;
            padding-top: calc(20.5 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(60 * var(--vw-with-scrollbar) / 1920);
            display: flex;
            gap: calc(30 * var(--vw-with-scrollbar) / 1920);
        }
        .health-index1-left {
            background-image: url(../img/sdgs/sticker.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(228 * var(--vw-with-scrollbar) / 1920);
            height: calc(229 * var(--vw-with-scrollbar) / 1920);
        }
        .health-index1-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(18 * var(--vw-with-scrollbar) / 1920);
            line-height: 180%;
            width: calc(584 * var(--vw-with-scrollbar) / 1920);
            color: white;
            padding-top: calc(65 * var(--vw-with-scrollbar) / 1920);
        }
        .health-index2-col {
            position: relative;
            padding-top: calc(20.5 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(65 * var(--vw-with-scrollbar) / 1920);
            display: flex;
            gap: calc(30 * var(--vw-with-scrollbar) / 1920);
        }
        .health-index2-left {
            background-image: url(../img/sdgs/sticker2.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(228 * var(--vw-with-scrollbar) / 1920);
            height: calc(229 * var(--vw-with-scrollbar) / 1920);
        }
        .health-index2-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(18 * var(--vw-with-scrollbar) / 1920);
            line-height: 180%;
            width: calc(584 * var(--vw-with-scrollbar) / 1920);
            color: white;
            padding-top: calc(81 * var(--vw-with-scrollbar) / 1920);
        }
        .health-index3-col {
            position: relative;
            padding-top: calc(30.5 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(40 * var(--vw-with-scrollbar) / 1920);
            display: flex;
            gap: calc(30 * var(--vw-with-scrollbar) / 1920);
        }
        .health-index3-left {
            background-image: url(../img/sdgs/sticker2.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(206 * var(--vw-with-scrollbar) / 1920);
            height: calc(206 * var(--vw-with-scrollbar) / 1920);
        }
        .health-index3-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(18 * var(--vw-with-scrollbar) / 1920);
            line-height: 180%;
            width: calc(324 * var(--vw-with-scrollbar) / 1920);
            color: white;
            padding-top: calc(49 * var(--vw-with-scrollbar) / 1920);
        }
        .responsibility {
            position: relative;
        }
        .responsibility-bg {
            background-image: url(../img/sdgs/responsibility-bg1.webp);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            height: calc(607 * var(--vw-with-scrollbar) / 1920);
        }
        .responsibility-bg1 {
            background-image: url(../img/sdgs/responsibility-bg2.webp);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            height: calc(607 * var(--vw-with-scrollbar) / 1920);
        }
        .responsibility-tilte {
        }
        .responsibility-tilte-col {
            display: flex;
            opacity: 0;
            transform: translateY(-20px);
            gap: calc(19 * var(--vw-with-scrollbar) / 1920);
            height: calc(150 * var(--vw-with-scrollbar) / 1920);
        }
        .responsibility-tilte {
            padding-top: calc(194 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(135 * var(--vw-with-scrollbar) / 1920);
        }
        .responsibility-number {
            object-fit: contain;
        }
        .responsibility-content {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(50 * var(--vw-with-scrollbar) / 1920);
            line-height: 120%;
            background: var(--main-gra-nz);
            -webkit-background-clip: text !important;
            background-clip: text !important;
            -webkit-text-fill-color: transparent;
            width: calc(760 * var(--vw-with-scrollbar) / 1920);
            padding-top: calc(15 * var(--vw-with-scrollbar) / 1920);
        }
        .responsibility-tilte-down {
            padding-left: calc(155 * var(--vw-with-scrollbar) / 1920) !important;
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(24 * var(--vw-with-scrollbar) / 1920);
            line-height: 180%;
            width: calc(802 * var(--vw-with-scrollbar) / 1920);
            /*background: var(--main-gra-nz);
            -webkit-background-clip: text !important;
            background-clip: text !important;
            -webkit-text-fill-color: transparent;*/
			color: var(--main-color);
        }
        .responsibility-index {
            display: flex;
            height: calc(267 * var(--vw-with-scrollbar) / 1920);
            opacity: 0;
            transform: translateY(-20px);
        }
        .responsibility-index1 {
            flex: 1;
            background-color: #ec6a06;
        }
        .responsibility-index2 {
            flex: 1;
            background-color: #d39206;
        }
        .responsibility-index3 {
            flex: 1;
            background-color: #023067;
        }
        .responsibility-index1-col {
            position: relative;
            padding-top: calc(29 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(30 * var(--vw-with-scrollbar) / 1920);
            display: flex;
            gap: calc(15 * var(--vw-with-scrollbar) / 1920);
        }
        .responsibility-index1-left {
            background-image: url(../img/sdgs/sticker3.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(215 * var(--vw-with-scrollbar) / 1920);
            height: calc(215 * var(--vw-with-scrollbar) / 1920);
        }
        .responsibility-index1-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(18 * var(--vw-with-scrollbar) / 1920);
            line-height: 180%;
            width: calc(341 * var(--vw-with-scrollbar) / 1920);
            color: white;
            padding-top: calc(41.5 * var(--vw-with-scrollbar) / 1920);
        }
        .responsibility-index2-col {
            position: relative;
            padding-top: calc(29 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(30 * var(--vw-with-scrollbar) / 1920);
            display: flex;
            gap: calc(15 * var(--vw-with-scrollbar) / 1920);
        }
        .responsibility-index2-left {
            background-image: url(../img/sdgs/sticker4.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(215 * var(--vw-with-scrollbar) / 1920);
            height: calc(215 * var(--vw-with-scrollbar) / 1920);
        }
        .responsibility-index2-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(18 * var(--vw-with-scrollbar) / 1920);
            line-height: 180%;
            width: calc(341 * var(--vw-with-scrollbar) / 1920);
            color: white;
            padding-top: calc(40.5 * var(--vw-with-scrollbar) / 1920);
        }
        .responsibility-index3-col {
            position: relative;
            padding-top: calc(29 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(30 * var(--vw-with-scrollbar) / 1920);
            display: flex;
            gap: calc(15 * var(--vw-with-scrollbar) / 1920);
        }
        .responsibility-index3-left {
            background-image: url(../img/sdgs/sticker5.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(215 * var(--vw-with-scrollbar) / 1920);
            height: calc(215 * var(--vw-with-scrollbar) / 1920);
        }
        .responsibility-index3-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(18 * var(--vw-with-scrollbar) / 1920);
            line-height: 180%;
            width: calc(341 * var(--vw-with-scrollbar) / 1920);
            color: white;
            padding-top: calc(40.5 * var(--vw-with-scrollbar) / 1920);
        }
        .sustainable {
            position: relative;
            background: var(--base-color);
        }
        .sustainable-table {
            width: calc(1160 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(223 * var(--vw-with-scrollbar) / 1920);
            padding-top: calc(85.5 * var(--vw-with-scrollbar) / 1920);
            padding-bottom: calc(85.5 * var(--vw-with-scrollbar) / 1920);
        }

        .sustainable-title {
            padding-left: calc(290 * var(--vw-with-scrollbar) / 1920);
            padding-bottom: calc(38 * var(--vw-with-scrollbar) / 1920);
        }
        .sustainable-title-img {
            background-image: url(../img/sdgs/sustainable.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            height: calc(111 * var(--vw-with-scrollbar) / 1920);
            width: calc(894 * var(--vw-with-scrollbar) / 1920);
        }
        .sustainable-content {
            padding-left: calc(46.5 * var(--vw-with-scrollbar) / 1920);
            padding-top: calc(49 * var(--vw-with-scrollbar) / 1920);
            padding-bottom: calc(49 * var(--vw-with-scrollbar) / 1920);
            background-color: #ffffff;
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(30 * var(--vw-with-scrollbar) / 1920);
            line-height: 220%;
            color: var(--main-color);
            text-align: center;
            width: calc(1474 * var(--vw-with-scrollbar) / 1920);
        }
        .sustainable-content p:nth-child(2) {
            animation-delay: 0.2s;
        }

        .sustainable-content p:nth-child(3) {
            animation-delay: 0.4s;
        }
        .search {
            position: relative;
            background-color: #ffffff;
        }
        .search-col {
            width: calc(1140 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(390 * var(--vw-with-scrollbar) / 1920);
            padding-top: calc(100 * var(--vw-with-scrollbar) / 1920);
        }
        .search-col-up {
            display: flex;
            height: calc(117 * var(--vw-with-scrollbar) / 1920);
        }
        .search-col-up1 {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 900;
            font-size: calc(72 * var(--vw-with-scrollbar) / 1920);
            line-height: 100%;
            transform: matrix(1, 0, -0.24, 0.97, 0, 0);
            padding-bottom: calc(24.14 * var(--vw-with-scrollbar) / 1920);
            padding-top: calc(23 * var(--vw-with-scrollbar) / 1920);
            background: var(--main-gra-nz);
            -webkit-background-clip: text !important;
            background-clip: text !important;
            -webkit-text-fill-color: transparent;
			opacity: 0;
        	transform: translateY(-20px);
        }
        .search-col-up2 {
            width: calc(60 * var(--vw-with-scrollbar) / 1920);
            width: calc(60 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(36 * var(--vw-with-scrollbar) / 1920);
            padding-top: calc(28 * var(--vw-with-scrollbar) / 1920);
            padding-bottom: calc(29 * var(--vw-with-scrollbar) / 1920);
            padding-right: calc(36 * var(--vw-with-scrollbar) / 1920);
			opacity: 0;
        	transform: translateY(-20px);
        }
        .search-col-up3 {
            background-image: url(../img/sdgs/logo.webp);
            height: calc(117 * var(--vw-with-scrollbar) / 1920);
            width: calc(271 * var(--vw-with-scrollbar) / 1920);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
			opacity: 0;
        	transform: translateY(-20px);
        }
        .search-col-down {
            padding-left: calc(28 * var(--vw-with-scrollbar) / 1920);
            padding-top: calc(49 * var(--vw-with-scrollbar) / 1920);
			opacity: 0;
        	transform: translateY(-20px);
        }
        .search-col-down1 {
            background-color: var(--main-color);
            height: calc(172 * var(--vw-with-scrollbar) / 1920);
            width: calc(1083 * var(--vw-with-scrollbar) / 1920);
            box-shadow: 0px calc(4 * var(--vw-with-scrollbar) / 1920)
                calc(4 * var(--vw-with-scrollbar) / 1920) rgba(0, 0, 0, 0.25);
            border-radius: calc(30 * var(--vw-with-scrollbar) / 1920);
            display: flex;
        }
        .search-col-down1-1 {
            padding-left: calc(51 * var(--vw-with-scrollbar) / 1920);
            padding-top: calc(34 * var(--vw-with-scrollbar) / 1920);
            padding-bottom: calc(27 * var(--vw-with-scrollbar) / 1920);
            padding-right: calc(19 * var(--vw-with-scrollbar) / 1920);
        }
        .search-col-down1-11 {
            background-color: var(--base-color);
            height: calc(111 * var(--vw-with-scrollbar) / 1920);
            width: calc(304 * var(--vw-with-scrollbar) / 1920);
            border-radius: calc(18 * var(--vw-with-scrollbar) / 1920);
        }
        .search-col-down1-img {
            padding-left: calc(57 * var(--vw-with-scrollbar) / 1920);
            padding-top: calc(11 * var(--vw-with-scrollbar) / 1920);
            padding-bottom: calc(57 * var(--vw-with-scrollbar) / 1920);
            padding-right: calc(19 * var(--vw-with-scrollbar) / 1920);
        }
        .search-col-down1-img1 {
            background-image: url(../img/sdgs/logo1.webp);
            height: calc(82 * var(--vw-with-scrollbar) / 1920);
            width: calc(190 * var(--vw-with-scrollbar) / 1920);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
        }
        .search-col-down1-2 {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(50 * var(--vw-with-scrollbar) / 1920);
            line-height: 190%;
            color: white;
            letter-spacing: -0.01em;
            transform: matrix(1, 0, -0.24, 0.97, 0, 0);
            padding-bottom: calc(24.14 * var(--vw-with-scrollbar) / 1920);
            padding-top: calc(23 * var(--vw-with-scrollbar) / 1920);
            transform: matrix(1, 0, -0.24, 0.97, 0, 0);
            padding-top: calc(43 * var(--vw-with-scrollbar) / 1920);
        }
        .search-col-down1-33 {
            padding-top: calc(52 * var(--vw-with-scrollbar) / 1920);
            padding-left: calc(18 * var(--vw-with-scrollbar) / 1920);
        }
        .search-col-down1-3 {
            background-image: url(../img/sdgs/Vector.webp);
            width: calc(22 * var(--vw-with-scrollbar) / 1920);
            height: calc(74 * var(--vw-with-scrollbar) / 1920);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
        }
        .search-col-down1-44 {
            padding-top: calc(52 * var(--vw-with-scrollbar) / 1920);
            padding-right: calc(53 * var(--vw-with-scrollbar) / 1920);
        }
        .search-col-down1-4 {
            background-image: url(../img/sdgs/Vector.webp);
            width: calc(22 * var(--vw-with-scrollbar) / 1920);
            height: calc(74 * var(--vw-with-scrollbar) / 1920);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
        }
        .search-up {
            padding-left: calc(390 * var(--vw-with-scrollbar) / 1920);
            padding-top: calc(69 * var(--vw-with-scrollbar) / 1920);
            padding-bottom: calc(100 * var(--vw-with-scrollbar) / 1920);
            opacity: 0;
            transform: translateY(-20px);
        }
        .search-up-col {
            border-top: 2px solid var(--main-color);
            border-bottom: 2px solid black;
            width: calc(1140 * var(--vw-with-scrollbar) / 1920);
        }
        .line {
            width: calc(732 * var(--vw-with-scrollbar) / 1920);
            margin: auto;
        }
        .search-up-col-title {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 900;
            padding-top: calc(30 * var(--vw-with-scrollbar) / 1920);
            padding-bottom: calc(30 * var(--vw-with-scrollbar) / 1920);
            font-size: calc(72 * var(--vw-with-scrollbar) / 1920);
            line-height: 100%;
            text-align: center;
            background: var(--main-gra-nz);
            -webkit-background-clip: text !important;
            background-clip: text !important;
            -webkit-text-fill-color: transparent;
            transform: matrix(1, 0, -0.24, 0.97, 0, 0);
        }
        .circle-clip {
            animation-duration: 1s !important;
        }
        .circle-clip-test {
            clip-path: circle(0% at center);
        }
        .animate .circle-clip-cus {
            animation: circleClip 1.5s ease-in-out forwards;
        }
        .animate .circle-clip-test {
            animation: circleClip 0.5s ease-in-out forwards;
        }
        .slide-up-test.animate {
            animation: slideUp 0.5s ease-in-out forwards;
        }
   		 .slide-up-cus.animate {
        animation: slideUp 1s ease-in-out forwards;
    	}
    	.slide-up-testt.animate {
        animation: slideUp 0.5s ease-in-out forwards;
    	}
    }
}
@media (max-width: 1024px) {
    #sdgs-page {
        .goals-sdgs {
            position: relative;
            background: var(--main-gra-nz-texture);
        }
        .goals-sdgs-table {
            position: relative;
            width: calc(354 * var(--vw-with-scrollbar) / 400);
            height: calc(526 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(40 * var(--vw-with-scrollbar) / 400);
            padding-bottom: calc(40 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(24 * var(--vw-with-scrollbar) / 400);
        }
        .sdgs-title1 {
            font-family: var(--font-inter-static);
            font-style: normal;
            font-weight: 900;
            font-size: calc(14 * var(--vw-with-scrollbar) / 400);
            line-height: calc(17 * var(--vw-with-scrollbar) / 400);
            text-align: center;
            letter-spacing: 0.32em;
            color: transparent;
            -webkit-text-stroke: 1px #f5f5f5;
            transform: matrix(1, 0, -0.24, 0.97, 0, 0) !important;
            padding-bottom: calc(10 * var(--vw-with-scrollbar) / 400);
            opacity: 0;
        }
        .sdgs-title2 {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(24 * var(--vw-with-scrollbar) / 400);
            line-height: 100%;
            text-align: center;
            letter-spacing: 0.1em;
            color: #f5f5f5;
            padding-bottom: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .sdgs-title2 span {
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
        }
        .sdgs-title3 {
            text-align: center;
            padding-bottom: calc(10 * var(--vw-with-scrollbar) / 400);
        }
        .title3 {
            width: calc(330 * var(--vw-with-scrollbar) / 400);
            height: calc(30 * var(--vw-with-scrollbar) / 400);
        }
        .sdgs-title4 {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            text-align: center;
            letter-spacing: 0.3em;
            color: #f5f5f5;
        }
        .sdgs-line {
            text-align: center;
            object-fit: cover;
            object-position: center;
        }
        .sdgs-title5 {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            text-align: center;
            letter-spacing: 0.3em;
            color: #f5f5f5;
        }
        .workplace-bg {
            background-image: url(../img/sdgs/workplace-bg-sp.webp);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            height: calc(350 * var(--vw-with-scrollbar) / 400);
        }
        .workplace-tilte-col {
            position: relative;
            display: block;
            gap: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .workplace-tilte {
            padding-left: calc(24 * var(--vw-with-scrollbar) / 400);
        }
        .workplace-number {
            object-fit: contain;
            margin-top: -34.5px;
            height: calc(70 * var(--vw-with-scrollbar) / 400);
        }
        .workplace-content {
            padding-top: calc(20 * var(--vw-with-scrollbar) / 400);
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(24 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            background: var(--main-gra-nz);
            -webkit-background-clip: text !important;
            background-clip: text !important;
            -webkit-text-fill-color: transparent;
            width: calc(288 * var(--vw-with-scrollbar) / 400);
        }
        .workplace-tilte-down {
            padding-top: calc(20 * var(--vw-with-scrollbar) / 400);
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            width: calc(352 * var(--vw-with-scrollbar) / 400);
            /*background: var(--main-gra-nz);
            -webkit-background-clip: text !important;
            background-clip: text !important;
            -webkit-text-fill-color: transparent;*/
			color: var(--main-color);
            padding-bottom: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .workplace-index {
            opacity: 0;
            transform: translateY(-20px);
            display: block;
        }
        .workplace-index1 {
            height: calc(234 * var(--vw-with-scrollbar) / 400);
            background-color: #1b973a;
        }
        .workplace-index2 {
            background-color: #e83418;
            height: calc(234 * var(--vw-with-scrollbar) / 400);
        }
        .workplace-index3 {
            background-color: #970a31;
            height: calc(234 * var(--vw-with-scrollbar) / 400);
        }
        .workplace-index1-col {
            position: relative;
            padding-top: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(24 * var(--vw-with-scrollbar) / 400);
            display: flex;
            gap: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(31.5 * var(--vw-with-scrollbar) / 400);
        }

        .workplace-index1-left {
            background-image: url(../img/sdgs/sticker.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(121 * var(--vw-with-scrollbar) / 400);
            height: calc(120 * var(--vw-with-scrollbar) / 400);
            margin-top: calc(31.5 * var(--vw-with-scrollbar) / 400);
        }
        .workplace-index1-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            width: calc(211 * var(--vw-with-scrollbar) / 400);
            color: white;
        }
        .workplace-index2-col {
            position: relative;
            padding-top: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(24 * var(--vw-with-scrollbar) / 400);
            display: flex;
            gap: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(31.5 * var(--vw-with-scrollbar) / 400);
        }
        .workplace-index2-left {
            background-image: url(../img/sdgs/sticker1.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(121 * var(--vw-with-scrollbar) / 400);
            height: calc(120 * var(--vw-with-scrollbar) / 400);
            margin-top: calc(17 * var(--vw-with-scrollbar) / 400);
        }
        .workplace-index2-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            width: calc(211 * var(--vw-with-scrollbar) / 400);
            color: white;
        }
        .workplace-index3-col {
            position: relative;
            padding-top: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(24 * var(--vw-with-scrollbar) / 400);
            display: flex;
            gap: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(31.5 * var(--vw-with-scrollbar) / 400);
        }
        .workplace-index3-left {
            background-image: url(../img/sdgs/sticker2.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(121 * var(--vw-with-scrollbar) / 400);
            height: calc(120 * var(--vw-with-scrollbar) / 400);
            margin-top: calc(17 * var(--vw-with-scrollbar) / 400);
        }
        .workplace-index3-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            width: calc(211 * var(--vw-with-scrollbar) / 400);
            color: white;
        }
        .health-bg {
            background-image: url(../img/sdgs/health-bg-sp.webp);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            height: calc(350 * var(--vw-with-scrollbar) / 400);
        }
        .health-tilte-col {
            position: relative;
            display: block;
            gap: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .health-tilte {
            padding-left: calc(24 * var(--vw-with-scrollbar) / 400);
            opacity: 0;
            transform: translateY(-20px);
        }
        .health-number {
            object-fit: contain;
            margin-top: -34.5px;
            height: calc(70 * var(--vw-with-scrollbar) / 400);
        }
        .health-content {
            padding-top: calc(20 * var(--vw-with-scrollbar) / 400);
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(24 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            background: var(--main-gra-nz);
            -webkit-background-clip: text !important;
            background-clip: text !important;
            -webkit-text-fill-color: transparent;
            width: calc(288 * var(--vw-with-scrollbar) / 400);
        }
        .health-tilte-down {
            padding-top: calc(20 * var(--vw-with-scrollbar) / 400);
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            width: calc(352 * var(--vw-with-scrollbar) / 400);
            /*background: var(--main-gra-nz);
            -webkit-background-clip: text !important;
            background-clip: text !important;
            -webkit-text-fill-color: transparent;*/
			color: var(--main-color);
            padding-bottom: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .health-index {
            display: block;
            opacity: 0;
            transform: translateY(-20px);
        }
        .health-index1 {
            height: calc(234 * var(--vw-with-scrollbar) / 400);
            background-color: #1b973a;
        }
        .health-index2 {
            background-color: #970a31;
            height: calc(234 * var(--vw-with-scrollbar) / 400);
        }

        .health-index1-col {
            position: relative;
            padding-top: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(24 * var(--vw-with-scrollbar) / 400);
            display: flex;
            gap: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(31.5 * var(--vw-with-scrollbar) / 400);
        }

        .health-index1-left {
            background-image: url(../img/sdgs/sticker.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(121 * var(--vw-with-scrollbar) / 400);
            height: calc(120 * var(--vw-with-scrollbar) / 400);
            margin-top: calc(31.5 * var(--vw-with-scrollbar) / 400);
        }
        .health-index1-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            width: calc(211 * var(--vw-with-scrollbar) / 400);
            color: white;
        }
        .health-index2-col {
            position: relative;
            padding-top: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(24 * var(--vw-with-scrollbar) / 400);
            display: flex;
            gap: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(31.5 * var(--vw-with-scrollbar) / 400);
        }
        .health-index2-left {
            background-image: url(../img/sdgs/sticker2.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(121 * var(--vw-with-scrollbar) / 400);
            height: calc(120 * var(--vw-with-scrollbar) / 400);
            margin-top: calc(17 * var(--vw-with-scrollbar) / 400);
        }
        .health-index2-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            width: calc(211 * var(--vw-with-scrollbar) / 400);
            color: white;
        }
        .health-index3-col {
            position: relative;
            padding-top: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(24 * var(--vw-with-scrollbar) / 400);
            display: flex;
            gap: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(31.5 * var(--vw-with-scrollbar) / 400);
        }
        .health-index3-left {
            background-image: url(../img/sdgs/sticker2.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(111 * var(--vw-with-scrollbar) / 400);
            height: calc(111 * var(--vw-with-scrollbar) / 400);
        }
        .health-index3-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            width: calc(211 * var(--vw-with-scrollbar) / 400);
            color: white;
        }
        .responsibility-bg {
            background-image: url(../img/sdgs/sustainable-bg-sp.webp);
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            height: calc(350 * var(--vw-with-scrollbar) / 400);
        }
        .responsibility-tilte-col {
            position: relative;
            display: block;
            gap: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .responsibility-tilte {
            padding-left: calc(24 * var(--vw-with-scrollbar) / 400);
            opacity: 0;
            transform: translateY(-20px);
        }
        .responsibility-number {
            object-fit: contain;
            margin-top: -34.5px;
            height: calc(70 * var(--vw-with-scrollbar) / 400);
        }
        .responsibility-content {
            padding-top: calc(20 * var(--vw-with-scrollbar) / 400);
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(24 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            background: var(--main-gra-nz);
            -webkit-background-clip: text !important;
            background-clip: text !important;
            -webkit-text-fill-color: transparent;
            width: calc(288 * var(--vw-with-scrollbar) / 400);
        }
        .responsibility-tilte-down {
            padding-top: calc(20 * var(--vw-with-scrollbar) / 400);
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            width: calc(352 * var(--vw-with-scrollbar) / 400);
            /*background: var(--main-gra-nz);
            -webkit-background-clip: text !important;
            background-clip: text !important;
            -webkit-text-fill-color: transparent;*/
			color: var(--main-color);
            padding-bottom: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .responsibility-index {
            display: block;
            opacity: 0;
            transform: translateY(-20px);
        }
        .responsibility-index1 {
            height: calc(205 * var(--vw-with-scrollbar) / 400);
            background-color: #ec6a06;
        }
        .responsibility-index2 {
            background-color: #d39206;
            height: calc(205 * var(--vw-with-scrollbar) / 400);
        }
        .responsibility-index3 {
            background-color: #023067;
            height: calc(234 * var(--vw-with-scrollbar) / 400);
        }
        .responsibility-index1-col {
            position: relative;
            padding-top: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(24 * var(--vw-with-scrollbar) / 400);
            display: flex;
            gap: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(31.5 * var(--vw-with-scrollbar) / 400);
        }

        .responsibility-index1-left {
            background-image: url(../img/sdgs/sticker3.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(121 * var(--vw-with-scrollbar) / 400);
            height: calc(120 * var(--vw-with-scrollbar) / 400);
            margin-top: calc(17 * var(--vw-with-scrollbar) / 400);
        }
        .responsibility-index1-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            width: calc(211 * var(--vw-with-scrollbar) / 400);
            color: white;
        }
        .responsibility-index2-col {
            position: relative;
            padding-top: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(24 * var(--vw-with-scrollbar) / 400);
            display: flex;
            gap: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(31.5 * var(--vw-with-scrollbar) / 400);
        }
        .responsibility-index2-left {
            background-image: url(../img/sdgs/sticker4.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(121 * var(--vw-with-scrollbar) / 400);
            height: calc(120 * var(--vw-with-scrollbar) / 400);
            margin-top: calc(17 * var(--vw-with-scrollbar) / 400);
        }
        .responsibility-index2-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            width: calc(211 * var(--vw-with-scrollbar) / 400);
            color: white;
        }
        .responsibility-index3-col {
            position: relative;
            padding-top: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(24 * var(--vw-with-scrollbar) / 400);
            display: flex;
            gap: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(31.5 * var(--vw-with-scrollbar) / 400);
        }
        .responsibility-index3-left {
            background-image: url(../img/sdgs/sticker5.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            width: calc(121 * var(--vw-with-scrollbar) / 400);
            height: calc(120 * var(--vw-with-scrollbar) / 400);
            margin-top: calc(31.5 * var(--vw-with-scrollbar) / 400);
        }
        .responsibility-index3-right {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 500;
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            width: calc(211 * var(--vw-with-scrollbar) / 400);
            color: white;
        }
        .sustainable {
            position: relative;
            background: var(--base-color);
        }
        .sustainable-table {
            width: calc(320 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(40 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(80 * var(--vw-with-scrollbar) / 400);
            padding-bottom: calc(80 * var(--vw-with-scrollbar) / 400);
        }

        .sustainable-title {
            padding-left: calc(0 * var(--vw-with-scrollbar) / 400);
            padding-bottom: calc(30 * var(--vw-with-scrollbar) / 400);
        }
        .sustainable-title-img {
            background-image: url(../img/sdgs/sustainable-sp.webp);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            height: calc(40 * var(--vw-with-scrollbar) / 400);
            width: calc(320 * var(--vw-with-scrollbar) / 400);
        }
        .sustainable-content {
            padding-top: calc(20 * var(--vw-with-scrollbar) / 400);
            padding-bottom: calc(20 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(15 * var(--vw-with-scrollbar) / 400);
            padding-right: calc(15 * var(--vw-with-scrollbar) / 400);
            background-color: #ffffff;
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
            line-height: 180%;
            color: var(--main-color);
            text-align: center;
            width: calc(290 * var(--vw-with-scrollbar) / 400);
        }
        .sustainable-content p:nth-child(2) {
            animation-delay: 0.2s;
        }

        .sustainable-content p:nth-child(3) {
            animation-delay: 0.3s;
        }
        .sustainable-content p:nth-child(4) {
            animation-delay: 0.4s;
        }

        .sustainable-content p:nth-child(5) {
            animation-delay: 0.5s;
        }
        .sustainable-content p:nth-child(6) {
            animation-delay: 0.6s;
        }

        .sustainable-content p:nth-child(7) {
            animation-delay: 0.7s;
        }
        .search {
            position: relative;
            background-color: #ffffff;
        }
        .search-col {
            width: calc(355 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(22.5 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(40 * var(--vw-with-scrollbar) / 400);
            padding-bottom: calc(34 * var(--vw-with-scrollbar) / 400);
            /*opacity: 0;*/
            transform: translateY(-20px);
        }
        .search-col a {
            display: block;
            margin-top: 1rem;
        }
        .search-col-up {
            display: flex;
            padding-bottom: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(40 * var(--vw-with-scrollbar) / 400);
            flex-wrap: wrap;
        }
        .search-col-up1 {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 900;
            font-size: calc(30 * var(--vw-with-scrollbar) / 400);
            line-height: 100%;
            transform: matrix(1, 0, -0.24, 0.97, 0, 0);
            flex: 0 0 100%;
            text-align: center;
            padding-bottom: calc(30 * var(--vw-with-scrollbar) / 400);
			opacity: 0;
        	transform: translateY(-20px);
        }
        .search-col-up2 {
            width: calc(46 * var(--vw-with-scrollbar) / 400);
            text-align: center;
            flex: 0 0 100%;
            padding-bottom: calc(7 * var(--vw-with-scrollbar) / 400);
            width: calc(307 * var(--vw-with-scrollbar) / 400);
			opacity: 0;
        	transform: translateY(-20px);
        }
        .search-col-up3 {
            background-image: url(../img/sdgs/logo-sp.webp);
            height: calc(133 * var(--vw-with-scrollbar) / 400);
            width: calc(307 * var(--vw-with-scrollbar) / 400);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
            text-align: center;
            padding-left: calc(23 * var(--vw-with-scrollbar) / 400);
            background-origin: content-box;
			opacity: 0;
        	transform: translateY(-20px);
        }
        .search-col-down {
        }
        .search-col-down1 {
            background-color: var(--main-color);
            width: 100%;
            height: calc(114 * var(--vw-with-scrollbar) / 400);
            box-shadow: 0px calc(4 * var(--vw-with-scrollbar) / 1920)
                calc(4 * var(--vw-with-scrollbar) / 1920) rgba(0, 0, 0, 0.25);
            border-radius: calc(30 * var(--vw-with-scrollbar) / 1920);
            display: flex;
			/*opacity: 0;*/
        	transform: translateY(-20px);
        }
        .search-col-down1-1 {
            padding-left: calc(35 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(10 * var(--vw-with-scrollbar) / 400);
            padding-right: calc(5 * var(--vw-with-scrollbar) / 400);
            width: calc(243.5 * var(--vw-with-scrollbar) / 400);
            display: flex;
            flex-wrap: wrap;
			/*opacity: 0;
        	transform: translateY(-20px);*/
        }
        .search-col-down1-11 {
            background-color: var(--base-color);
            height: calc(32 * var(--vw-with-scrollbar) / 400);
            width: calc(71 * var(--vw-with-scrollbar) / 400);
            border-radius: calc(5 * var(--vw-with-scrollbar) / 400);
            z-index: 4;
			opacity: 0;
        	transform: translateY(-20px);
        }
        .search-col-down1-img {
            padding-left: calc(11.18 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(5.5 * var(--vw-with-scrollbar) / 400);
            padding-bottom: calc(11.18 * var(--vw-with-scrollbar) / 400);
            padding-right: calc(5.5 * var(--vw-with-scrollbar) / 400);
        }
        .search-col-down1-img1 {
            background-image: url(../img/sdgs/logo1-sp.webp);
            height: calc(21 * var(--vw-with-scrollbar) / 400);
            width: calc(48 * var(--vw-with-scrollbar) / 400);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
        }
        .search-col-down1-2 {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(35 * var(--vw-with-scrollbar) / 400);
            line-height: 110%;
            color: white;
            letter-spacing: -0.01em;
            transform: matrix(1, 0, -0.24, 0.97, 0, 0);
            padding-left: calc(5 * var(--vw-with-scrollbar) / 400);
        }
        .search-col-down1-21 {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 700;
            font-size: calc(35 * var(--vw-with-scrollbar) / 400);
            line-height: 110%;
            color: white;
            letter-spacing: -0.01em;
            transform: matrix(1, 0, -0.24, 0.97, 0, 0);
            width: 100%;
        }

        .search-col-down1-33 {
            padding-top: calc(66 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(9 * var(--vw-with-scrollbar) / 400);
        }
        .search-col-down1-3 {
            background-image: url(../img/sdgs/Vector.webp);
            width: calc(11 * var(--vw-with-scrollbar) / 400);
            height: calc(28 * var(--vw-with-scrollbar) / 400);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
        }
        .search-col-down1-44 {
            padding-top: calc(66 * var(--vw-with-scrollbar) / 400);
        }
        .search-col-down1-4 {
            background-image: url(../img/sdgs/Vector.webp);
            width: calc(11 * var(--vw-with-scrollbar) / 400);
            height: calc(28 * var(--vw-with-scrollbar) / 400);
            background-size: cover; /* ảnh phủ hết div */
            background-position: center; /* căn giữa ảnh */
            background-repeat: no-repeat;
        }
        .search-up {
            padding-left: calc(22.5 * var(--vw-with-scrollbar) / 400);
            padding-bottom: calc(40 * var(--vw-with-scrollbar) / 400);
            opacity: 0;
            transform: translateY(-20px);
        }
        .search-up-col {
            border-top: 1px solid black;
            border-bottom: 1px solid black;
            width: calc(355 * var(--vw-with-scrollbar) / 400);
        }
        .search-up-col-title {
            font-family: var(--font-noto-sans-jp);
            font-style: normal;
            font-weight: 900;
            font-size: calc(24 * var(--vw-with-scrollbar) / 400);
            line-height: 100%;
            text-align: center;
            color: black;
            transform: matrix(1, 0, -0.24, 0.97, 0, 0);
            padding-left: calc(47.1 * var(--vw-with-scrollbar) / 400);
            padding-bottom: calc(30 * var(--vw-with-scrollbar) / 400);
            padding-right: calc(47.1 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(30 * var(--vw-with-scrollbar) / 400);
        }
        .line {
            width: calc(212 * var(--vw-with-scrollbar) / 400);
        }
        .animate .circle-clip-cus {
            animation: circleClip 1s ease-in-out forwards;
        }
        .animate .circle-clip-test {
            animation: circleClip 0.5s ease-in-out forwards;
        }
        .slide-up-test.animate {
            animation: slideUp 0.5s ease-in-out forwards;
        }
        .circle-clip {
            animation-duration: 0.5s !important;
        }
    }
}
/* End SDGs Page CSS */
/* Start Business Page CSS */
#business-page {
    .hero-section {
        display: flex;
        flex-direction: column;
        background: var(--main-gra-nz-texture);
        background-size: cover;
        padding: calc(115.5 * var(--vw-with-scrollbar) / 1920)
            calc(280 * var(--vw-with-scrollbar) / 1920);
        color: var(--base-color);
        align-items: center;
    }
    .hero-section__header-pc-wrapper {
        width: fit-content;
    }
    .hero-section__header-pc {
        font-family: var(--font-shippori-antique);
        font-size: calc(60 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.4;
        color: white;
        text-align: center;
    }
    .hero-section__title {
        margin-top: calc(43 * var(--vw-with-scrollbar) / 1920);
        margin-bottom: calc(31 * var(--vw-with-scrollbar) / 1920);
        background: var(--title-grad-texture);
        background-size: cover;
        border: calc(1 * var(--vw-with-scrollbar) / 1920) solid
            var(--base-color);
        padding: calc(10 * var(--vw-with-scrollbar) / 1920)
            calc(55 * var(--vw-with-scrollbar) / 1920);
        font-size: calc(50 * var(--vw-with-scrollbar) / 1920);
        letter-spacing: 0.2em;
        box-sizing: border-box;
        white-space: nowrap;
        text-align: center;
    }
    .hero-section__text {
		font-weight: 700;
		line-height: 180%;
		font-family: var(--font-noto-sans-jp);
        font-size:calc(20 * var(--vw-with-scrollbar) / 1920);
        text-align: left;
        letter-spacing: 0.3em;
    }
    .hero-section .banner-slide-in__content::before {
        background-color: white;
    }
    .work-tabbar-section {
        display: flex;
        flex-direction: column;
        gap: calc(47 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(50 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(28 * var(--vw-with-scrollbar) / 1920);
    }
    .work-tabbar__heading {
        padding: 0 calc(100 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        flex-direction: column;
        align-items: start;
    }
    .work-tabbar__heading-title {
        background: var(--main-gra-nz);
        font-size: calc(70 * var(--vw-with-scrollbar) / 1920);
    }
    .work-tabbar-controls, .manufacturer-tabbar-controls{
        position: absolute;
        right: max(calc((100vw - 1400px)/2),3%);
    }
    .work-tabbar-controls .prev-tab-btn, .manufacturer-tabbar-controls .prev-tab-btn{
        margin-right: 1rem;
    }
    .work-tabbar-controls img, .manufacturer-tabbar-controls img{
        width: 50px;
        margin-top: 3rem;
    }
    .manufacturer-tabbar-controls img{
        margin-top: 6rem;

    }
    .work-tabbar {
        display: flex;
        flex-wrap: wrap;
        justify-content: left;
        /* align-items: end; */
        gap: 2%;
        padding: 0 calc(97 * var(--vw-with-scrollbar) / 1920);
        /* scroll-padding-inline: 0 calc(97 * var(--vw-with-scrollbar) / 1920); */
        /* scroll-snap-type: x mandatory; */
        /* overflow-x: scroll; */
    }
    .work-tabbar li{
        width: 15%;
        margin-bottom: 15px;
    }
    .work-tabbar-tab {
        position: relative;
        width: 100%;
        height: max(calc(327 * var(--vw-with-scrollbar) / 1920));
        padding: calc(3 * var(--vw-with-scrollbar) / 1920);
        display: flex;
        color: white;
        background-color: var(--base-color);
    }
    .work-tabbar-tab::before {
        position: absolute;
        content: "";
        inset: 0;
        background: var(--main-gra-nz);
        background-size: cover;
        opacity: 1;
        transition: opacity 0.4s ease;
    }
    .work-tabbar-tab::after {
        position: absolute;
        content: "";
        width: calc(36 * var(--vw-with-scrollbar) / 1920);
        height: calc(21 * var(--vw-with-scrollbar) / 1920);
        bottom: calc(17 * var(--vw-with-scrollbar) / 1920);
        left: 50%;
        transform: translateX(-50%);
        background-image: url(../img/business/chevron-down.svg);
        background-size: contain;
        opacity: 0;
        transition: opacity 0.4s ease;
    }
    .work-tabbar-tab__inner {
        position: relative;
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        background-size: contain;
    }
    .work-tabbar-tab__inner::before {
        position: absolute;
        content: "";
        inset: 0;
        background: var(--main-gra-nz-texture);
        background-size: cover;
        mix-blend-mode: multiply;
        opacity: 0;
        transition: opacity 0.4s ease;
        z-index: 0;
        isolation: isolate;
    }

    .work-tabbar-tab__text {
        position: relative;
        font-weight: 500;
        font-size: calc(30 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        text-align: center;
        white-space: normal;
        word-break: normal;
        overflow-wrap: normal;
    }

    .work-tabbar-tab.active::before {
        opacity: 0;
    }
    .work-tabbar-tab.active::after {
        opacity: 1;
    }
    .work-tabbar-tab.active .work-tabbar-tab__inner::before {
        opacity: 1;
    }
    .work-tabbar-content {
        background: var(--main-gra-nz-texture);
        background-size: cover;
        padding: calc(62 * var(--vw-with-scrollbar) / 1920)
            calc(81.5 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(88 * var(--vw-with-scrollbar) / 1920);
        color: var(--base-color);
    }
    .work-tabbar-content-slide {
        width: 100%;
        display: flex;
        flex-direction: column;
        transition: opacity 0.4s ease;
    }
    .work-tabbar-content-slide-info {
        display: flex;
        align-items: center;
        margin-bottom: calc(20 * var(--vw-with-scrollbar) / 1920);
    }
    .work-tabbar-content-slide-info__heading {
        display: flex;
        flex-direction: column;
        align-items: start;
        flex-shrink: 0;
    }
    .work-tabbar-content-slide-info__heading-header {
        font-size: calc(70 * var(--vw-with-scrollbar) / 1920);
    }
    .work-tabbar-content-slide-info__info-list {
        min-height: calc(121 * var(--vw-with-scrollbar) / 1920);
        box-sizing: border-box;
        display: flex;
        align-items: center;
        border: calc(2 * var(--vw-with-scrollbar) / 1920) solid
            var(--base-color);
        padding: calc(18 * var(--vw-with-scrollbar) / 1920)
            calc(48 * var(--vw-with-scrollbar) / 1920);
        margin-left: calc(50 * var(--vw-with-scrollbar) / 1920);
        margin-right: auto;
    }
    .work-tabbar-content-slide-info__info-list-inner {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        column-gap: calc(10 * var(--vw-with-scrollbar) / 1920);
        row-gap: calc(15 * var(--vw-with-scrollbar) / 1920);
    }
    .work-tabbar-content-slide-info__info-list li {
        font-weight: 700;
        font-size: calc(20 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
    }
    .work-tabbar-content .section-header__icon rect {
        fill: var(--base-color);
    }
    .view-dropdown {
        position: relative;
        flex-shrink: 0;
        z-index: 1;
    }
    .view-dropdown-button {
        min-height: calc(121 * var(--vw-with-scrollbar) / 1920);
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: calc(15 * var(--vw-with-scrollbar) / 1920)
            calc(49.5 * var(--vw-with-scrollbar) / 1920);
        gap: calc(8 * var(--vw-with-scrollbar) / 1920);
        color: var(--main-color);
        background-color: var(--base-color);
    }
    .view-dropdown-button__text {
        font-size: clamp(
            12px,
            calc(16 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        font-weight: 500;
        line-height: 1;
    }
    .view-dropdown-button__icon {
        width: calc(14 * var(--vw-with-scrollbar) / 1920);
        min-width: 7px;
        height: auto;
        transition: transform ease-in-out 0.3s;
    }
    .view-dropdown-list {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        box-sizing: border-box;
        padding: calc(20 * var(--vw-with-scrollbar) / 1920)
            calc(49.5 * var(--vw-with-scrollbar) / 1920);
        padding-top: 0;
        background-color: var(--base-color);
        max-height: calc(500 * var(--vw-with-scrollbar) / 1920);
        overflow: auto;
        z-index: 1;
        transition: max-height 0.4s ease;
    }
    .view-dropdown-list__item {
        font-size: clamp(
            10px,
            calc(14 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        font-weight: 350;
        letter-spacing: 0.1em;
        line-height: 1.7;
        color: var(--sub-color);
    }
    .view-dropdown-list::-webkit-scrollbar {
        width: calc(7 * var(--vw-with-scrollbar) / 1920);
    }
    .view-dropdown-list::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: calc(25 * var(--vw-with-scrollbar) / 1920);
    }
    .view-dropdown-list::-webkit-scrollbar-thumb {
        background: #ccc;
        border-radius: calc(25 * var(--vw-with-scrollbar) / 1920);
    }
    .view-dropdown-list.hidden {
        max-height: 0;
        overflow: hidden;
        padding: 0 calc(49.5 * var(--vw-with-scrollbar) / 1920);
    }
    .view-dropdown-button[aria-expanded="true"] .view-dropdown-button__icon {
        transform: rotate(180deg);
    }
    .work-tabbar-content-slide-img {
        position: sticky;
        width: 100%;
        height: auto;
        top: calc(88 * var(--vw-with-scrollbar) / 1920);
    }
    .work-tabbar-content-slide-img img {
        width: 100%;
        height: auto;
        object-fit: cover;
        object-position: center;
    }
    .work-tabbar-content-slide:not(.active) {
        opacity: 0;
    }
    .work-tabbar-content-slide.active {
        opacity: 1;
    }
    .manufacturer-section {
        display: flex;
        flex-direction: column;
        background-color: var(--base-color);
        padding-bottom: calc(100 * var(--vw-with-scrollbar) / 1920);
    }
    .manufacturer-heading {
        display: flex;
        flex-direction: column;
        align-items: start;
        padding: calc(80 * var(--vw-with-scrollbar) / 1920)
            calc(100 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(50 * var(--vw-with-scrollbar) / 1920);
    }
    .manufacturer-heading__title {
        font-size: calc(70 * var(--vw-with-scrollbar) / 1920);
        background: var(--main-gra-nz);
    }
    .manufacturer-content {
        display: flex;
        flex-direction: column;
        gap: calc(30 * var(--vw-with-scrollbar) / 1920);
		overflow: hidden;
    }
    .manufacturer-tabbar {
        display: flex;
        width: 100%;
        flex-wrap: wrap;
        
        gap: calc(28.5 * var(--vw-with-scrollbar) / 1920);
        padding: 0 calc(91 * var(--vw-with-scrollbar) / 1920);
        /* scroll-padding-inline: 0 calc(91 * var(--vw-with-scrollbar) / 1920);
        scroll-snap-type: x mandatory; */
        /* overflow-x: scroll; */
		box-sizing: border-box;
    }
    .manufacturer-tab {
        display: flex;
        flex-direction: column;
        flex-shrink: 0;
        box-sizing: border-box;
        background: var(--main-gra-nz-texture);
        background-size: cover;
        cursor: pointer;
    }
    .manufacturer-tab__inner {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: calc(2 * var(--vw-with-scrollbar) / 1920);
        padding: calc(9 * var(--vw-with-scrollbar) / 1920);
        background-color: white;
        transition: background-color 0.4s ease, padding 0.4s ease;
    }
    .manufacturer-tab__text {
        font-weight: 500;
        font-size: clamp(
            16px,
            calc(24 * var(--vw-with-scrollbar) / 1920),
            99px
        );
        line-height: 1;
        background: var(--main-gra-nz);
        transition: background 0.4s ease;
        text-align: center;
    }
    .manufacturer-tab__tail {
        display: flex;
        z-index: 1;
    }
    .manufacturer-tab__tail::before,
    .manufacturer-tab__tail::after {
        content: "";
        flex: 1;
        border-bottom: calc(16 * var(--vw-with-scrollbar) / 1920) solid
            var(--base-color);
        transition: border-width 0.4s ease;
    }
    .manufacturer-tab.active .manufacturer-tab__inner {
        background-color: transparent;
    }
    .manufacturer-tab.active .manufacturer-tab__text {
        background: white;
    }
    .manufacturer-tab.active .manufacturer-tab__tail::before {
        border-right: calc(9.5 * var(--vw-with-scrollbar) / 1920) solid
            transparent;
    }
    .manufacturer-tab.active .manufacturer-tab__tail::after {
        border-left: calc(9.5 * var(--vw-with-scrollbar) / 1920) solid
            transparent;
    }
    .manufacturer-info {
        display: flex;
        flex-direction: column;
        align-items: start;
        gap: calc(50 * var(--vw-with-scrollbar) / 1920);
        background-color: white;
        padding: calc(70 * var(--vw-with-scrollbar) / 1920)
            calc(241 * var(--vw-with-scrollbar) / 1920);
        padding-right: calc(246 * var(--vw-with-scrollbar) / 1920);
        margin: 0 calc(64.5 * var(--vw-with-scrollbar) / 1920);
    }
    .manufacturer-info__title {
        font-size: calc(70 * var(--vw-with-scrollbar) / 1920);
        line-height: 1.1;
        background: var(--main-gra-nz);
    }
    .manufacturer-info__links {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: calc(20 * var(--vw-with-scrollbar) / 1920)
            calc(14 * var(--vw-with-scrollbar) / 1920);
    }
    .manufacturer-info__empty {
        font-weight: 500;
        font-size: calc(24 * var(--vw-with-scrollbar) / 1920);
        color: var(--sub-color);
    }
    .manufacturer-link {
        display: flex;
        align-items: center;
        box-sizing: border-box;
        gap: calc(20 * var(--vw-with-scrollbar) / 1920);
        padding: calc(23 * var(--vw-with-scrollbar) / 1920)
            calc(17 * var(--vw-with-scrollbar) / 1920);
        border-width: calc(3 * var(--vw-with-scrollbar) / 1920);
        border-style: solid;
        border-color: var(--main-color);
        transition: border-color 0.4s ease, background-color 0.4s ease;
    }
    .manufacturer-link__text {
        font-size: calc(24 * var(--vw-with-scrollbar) / 1920);
        line-height: 1;
        color: transparent;
        background-clip: text !important;
        -webkit-background-clip: text !important;
        -webkit-text-fill-color: transparent;
        background: var(--main-gra-nz);
        transition: background 0.4s ease;
    }
    .manufacturer-link__icon {
        width: calc(15 * var(--vw-with-scrollbar) / 1920);
        height: auto;
    }
    .manufacturer-link__icon path {
        stroke: url(#paint0_linear_7047_2981);
        transition: stroke 0.4s ease;
    }

    .manufacturer-link:hover {
        border-color: white;
        background-color: var(--main-color);
    }
    .manufacturer-link:hover .manufacturer-link__text {
        background: var(--base-color);
    }
    .manufacturer-link:hover .manufacturer-link__icon path {
        stroke: var(--base-color);
    }
}
@media (min-width: 1025px) {
    #business-page {
        .work-tabbar {
            filter: unset !important;
            opacity: 1 !important;
            transform: unset !important;
        }
        .neg-space-20 {
            letter-spacing: -0.2em;
        }
        .work-tabbar-content-slide[data-tab="照明器具"]
            .work-tabbar-content-slide-info__info-list {
            max-width: calc(968 * var(--vw-with-scrollbar) / 1920);
        }
        .work-tabbar-content-slide[data-tab="照明器具"]
            .work-tabbar-content-slide-info {
            padding-right: calc(64 * var(--vw-with-scrollbar) / 1920);
        }
        .work-tabbar-content-slide[data-tab="高・低圧受変電設備"]
            .work-tabbar-content-slide-info__info-list {
            max-width: calc(670 * var(--vw-with-scrollbar) / 1920);
        }
        .work-tabbar-content-slide[data-tab="太陽光発電システム"]
            .work-tabbar-content-slide-info__info-list {
            max-width: calc(688 * var(--vw-with-scrollbar) / 1920);
        }
        .work-tabbar-content-slide[data-tab="太陽光発電システム"]
            .work-tabbar-content-slide-info__info-list {
            max-width: calc(688 * var(--vw-with-scrollbar) / 1920);
        }
        .work-tabbar-content-slide[data-tab="配線・配管管路材"]
            .work-tabbar-content-slide-info__info-list {
            max-width: calc(811 * var(--vw-with-scrollbar) / 1920);
        }
        .work-tabbar-content-slide[data-tab="情報・通信機器OA"]
            .work-tabbar-content-slide-info__info-list {
            max-width: calc(671 * var(--vw-with-scrollbar) / 1920);
        }
        .work-tabbar-content-slide[data-tab="防犯防災機器"]
            .work-tabbar-content-slide-info__info-list {
            max-width: calc(667 * var(--vw-with-scrollbar) / 1920);
        }
        .work-tabbar-content-slide[data-tab="制御機器ＦＡ機器"]
            .work-tabbar-content-slide-info__info-list {
            max-width: calc(641 * var(--vw-with-scrollbar) / 1920);
        }
        .work-tabbar-content-slide[data-tab="電線ケーブル"]
            .work-tabbar-content-slide-info__info-list {
            max-width: calc(841 * var(--vw-with-scrollbar) / 1920);
        }
    }
}
@media (max-width: 1024px) {
    #business-page {
        --work-img-height: 500;

        .hero-section {
            padding: calc(40 * var(--vw-with-scrollbar) / 400) 0;
            align-items: center;
        }
        .hero-section__title {
            border: none;
            font-size: calc(30 * var(--vw-with-scrollbar) / 400);
            padding: 0 calc(20 * var(--vw-with-scrollbar) / 400);
            margin-top: calc(40 * var(--vw-with-scrollbar) / 400);
            margin-bottom: calc(20 * var(--vw-with-scrollbar) / 400);
            letter-spacing: 0;
            white-space: normal;
            background: var(--main-gra-nz-texture);
            background-size: contain;
        }
        .hero-section__text {
            max-width: calc(312 * var(--vw-with-scrollbar) / 400);
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
        }
        .hero-section-header-sp {
            width: calc(280 * var(--vw-with-scrollbar) / 400);
            display: flex;
            flex-direction: column;
            gap: calc(9 * var(--vw-with-scrollbar) / 400);
            font-family: var(--font-shippori-antique);
            font-size: calc(24 * var(--vw-with-scrollbar) / 400);
            line-height: 1.4;
        }
        .hero-section-header-sp__inner {
            position: relative;
            padding-top: calc(8.25 * var(--vw-with-scrollbar) / 400);
            padding-left: calc(38 * var(--vw-with-scrollbar) / 400);
            padding-right: calc(19.77 * var(--vw-with-scrollbar) / 400);
            display: flex;
        }
        .hero-section-header-sp__inner-decoration {
            position: absolute;
        }
        .hero-section-header-sp__inner-decoration--left {
            top: 0;
            left: calc(4 * var(--vw-with-scrollbar) / 400);
        }
        .hero-section-header-sp__inner-decoration--right {
            bottom: 0;
            right: 0;
            width: calc(30 * var(--vw-with-scrollbar) / 400);
        }
        .hero-section-header-sp__inner-text {
            text-align: center;
        }
        .hero-section-header-sp__top-text {
            display: flex;
            justify-content: end;
        }
        .hero-section-header-sp span:first-child {
            text-align: right;
        }
        .work-tabbar-section {
            padding: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400);
            padding-top: calc(30 * var(--vw-with-scrollbar) / 400);
            gap: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .work-tabbar__heading {
            padding: 0;
        }
        .work-tabbar-section .section-header {
            gap: calc(4 * var(--vw-with-scrollbar) / 400);
        }
        .work-tabbar__heading-title {
            font-size: calc(32 * var(--vw-with-scrollbar) / 400);
            line-height: 1.3;
            letter-spacing: 0;
        }
        .work-tabbar {
            overflow: auto;
            padding: 0;
            scroll-padding-inline: 0;
            scroll-snap-type: auto;
            flex-wrap: wrap;
            gap: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .work-tabbar li{ 
            width: fit-content;
            margin-bottom: 0;
        }
        .work-tabbar-tab {
            position: relative;
            width: fit-content;
            height: fit-content;
            padding: calc(9 * var(--vw-with-scrollbar) / 400)
                calc(19 * var(--vw-with-scrollbar) / 400);
            border-width: calc(1 * var(--vw-with-scrollbar) / 400);
            border-style: solid;
            border-image-source: var(--main-gra-nz);
            border-image-slice: 1;
            box-sizing: border-box;
            background: transparent;
        }
        .work-tabbar-tab::before {
            opacity: 0;
        }
        .work-tabbar-tab::after {
            display: none;
        }
        .work-tabbar-tab__inner {
            display: block;
            background-image: unset !important;
        }
        .work-tabbar-tab__inner::before {
            display: none;
        }
        .work-tabbar-tab__text {
            color: transparent;
            background-clip: text !important;
            -webkit-background-clip: text !important;
            -webkit-text-fill-color: transparent;
            background: var(--main-gra-nz);
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
            transition: 0.4s background ease;
            filter: unset !important;
            opacity: 1 !important;
            transform: unset !important;
        }
        .work-tabbar-tab.active::before {
            opacity: 1;
        }
        .work-tabbar-tab.active .work-tabbar-tab__text {
            background: var(--base-color);
        }
        .work-tabbar-content {
            padding: 0;
        }
        .work-tabbar-content-slide-info__wrapper {
            background: var(--main-gra-nz-texture);
            background-size: contain;
        }
        .work-tabbar-content-slide-info {
            display: flex;
            justify-content: space-between;
            align-items: start;
            padding: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400);
            padding-bottom: 0;
            column-gap: 0;
            row-gap: calc(20 * var(--vw-with-scrollbar) / 400);
            margin-bottom: 0;
        }
        .work-tabbar-content-slide-info__heading {
            flex-shrink: 1;
        }
        .work-tabbar-content-slide-info .section-header {
            gap: calc(4 * var(--vw-with-scrollbar) / 400);
        }
        .work-tabbar-content-slide-info__info-list {
            max-width: 100% !important;
            min-height: fit-content;
            border: calc(2 * var(--vw-with-scrollbar) / 400) solid
                var(--base-color);
            padding: calc(28 * var(--vw-with-scrollbar) / 400)
                calc(22 * var(--vw-with-scrollbar) / 400);
            margin: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400);
            margin-top: calc(20 * var(--vw-with-scrollbar) / 400);
        }
        .work-tabbar-content-slide-info__info-list-inner {
            flex-direction: column;
            align-items: start;
            gap: calc(10 * var(--vw-with-scrollbar) / 400);
        }
        .work-tabbar-content-slide-info__info-list li {
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
        }
        .work-tabbar-content-slide-info__info-list li > .break-line {
            line-height: 1.2;
        }
        .work-tabbar-content-slide-info__heading-header {
            font-size: calc(32 * var(--vw-with-scrollbar) / 400);
            line-height: 1.8;
        }
        .view-dropdown {
            margin-left: 0;
            max-width: calc(132 * var(--vw-with-scrollbar) / 400);
        }
        .view-dropdown-button {
            min-height: fit-content;
            flex-direction: column;
            padding: calc(10 * var(--vw-with-scrollbar) / 400);
            gap: calc(8 * var(--vw-with-scrollbar) / 400);
        }
        .view-dropdown-button__text {
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
            line-height: 1.2;
            text-align: center;
        }
        .view-dropdown-button__icon {
            display: block; /* stop acting like inline text */
            width: calc(14 * var(--vw-with-scrollbar) / 400);
            height: auto;
            min-width: 0; /* allow shrink if needed */
            max-width: 100%; /* never overflow parent */
            overflow: hidden; /* safety net for subpixel rounding */
        }
        .view-dropdown-list {
            display: flex;
            flex-direction: column;
            padding: calc(10 * var(--vw-with-scrollbar) / 400);
            padding-top: 0;
            max-height: calc(250 * var(--vw-with-scrollbar) / 400);
        }
        .view-dropdown-list__item {
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
        }
        .view-dropdown-list::-webkit-scrollbar {
            width: calc(7 * var(--vw-with-scrollbar) / 400);
        }
        .view-dropdown-list::-webkit-scrollbar-track {
            border-radius: calc(25 * var(--vw-with-scrollbar) / 400);
        }
        .view-dropdown-list::-webkit-scrollbar-thumb {
            border-radius: calc(25 * var(--vw-with-scrollbar) / 400);
        }
        .work-tabbar-content-slide-img {
            top: calc(63 * var(--vw-with-scrollbar) / 400);
            height: calc(500 * var(--vw-with-scrollbar) / 400);
        }
        .work-tabbar-content-slide-img img {
            height: 100%;
        }
        /* Mobile Padding for last sticky img */
        .work-tabbar-content-slide::after {
            content: "";
            height: calc(
                var(--work-img-height) * var(--vw-with-scrollbar) / 400
            );
        }
        .work-tabbar-content-slide[data-tab="照明器具"]
            .work-tabbar-content-slide-img
            img {
            object-fit: contain;
        }
        .manufacturer-section {
            position: relative;
            /* Compensate for the padding of last img */
            margin-top: calc(
                var(--work-img-height) * var(--vw-with-scrollbar) / 400 * -1
            );
            z-index: 1;
            padding: 0;
        }
        .manufacturer-content {
            gap: 0;
        }
        .manufacturer-heading {
            padding: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400);
            padding-bottom: 0;
        }
        .manufacturer-heading__title {
            font-size: calc(32 * var(--vw-with-scrollbar) / 400);
        }
        .manufacturer-select {
            align-self: stretch;
            display: flex;
            flex-direction: column;
            box-sizing: border-box;
            padding: calc(2 * var(--vw-with-scrollbar) / 400);
            margin: 0 calc(24 * var(--vw-with-scrollbar) / 400);
            margin-bottom: calc(28 * var(--vw-with-scrollbar) / 400);
            background: var(--main-gra-nz-texture);
            background-size: cover;
        }
        .manufacturer-select span {
            font-weight: 500;
            line-height: 1;
            color: transparent;
            background-clip: text !important;
            -webkit-background-clip: text !important;
            -webkit-text-fill-color: transparent;
            background: var(--main-gra-nz);
        }
        .manufacturer-select-btn {
            box-sizing: border-box;
            min-height: calc(44 * var(--vw-with-scrollbar) / 400);
            padding: calc(10 * var(--vw-with-scrollbar) / 400);
            display: flex;
            justify-content: space-between;
            align-items: center;
            background-color: white;
        }
        .manufacturer-select-btn__text {
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
        }
        .manufacturer-select-btn__icon {
            width: calc(21 * var(--vw-with-scrollbar) / 400);
            height: auto;
            object-fit: contain;
            transition: 0.4s transform ease;
        }
        .manufacturer-select-dropdown {
            background-color: white;
            padding: calc(10 * var(--vw-with-scrollbar) / 400);
            max-height: calc(500 * var(--vw-with-scrollbar) / 400);
            transition: max-height 0.4s ease, padding 0.4s ease;
        }
        .manufacturer-select-dropdown__item {
            padding: calc(10 * var(--vw-with-scrollbar) / 400);
            transition: 0.4s background-color ease;
            cursor: pointer;
        }
        .manufacturer-select-dropdown__item-text {
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
        }

        .manufacturer-select-btn[aria-expanded="true"] {
            margin-bottom: calc(1 * var(--vw-with-scrollbar) / 400);
        }
        .manufacturer-select-btn[aria-expanded="true"]
            .manufacturer-select-btn__icon {
            transform: rotate(180deg);
        }
        .manufacturer-select-dropdown.hidden {
            max-height: 0;
            overflow: hidden;
            padding: 0 calc(10 * var(--vw-with-scrollbar) / 400);
        }

        .manufacturer-select-dropdown__item.active,
        .manufacturer-select-dropdown__item:hover {
            background-color: var(--base-color);
        }

        .manufacturer-info {
            gap: calc(30 * var(--vw-with-scrollbar) / 400);
            padding: calc(20 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400);
            padding-bottom: calc(30 * var(--vw-with-scrollbar) / 400);
            margin: 0;
        }
        .manufacturer-info__empty {
            font-size: calc(24 * var(--vw-with-scrollbar) / 400);
        }
        .manufacturer-info__title {
            font-size: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .manufacturer-info__links {
            gap: calc(7 * var(--vw-with-scrollbar) / 400)
                calc(14 * var(--vw-with-scrollbar) / 400);
        }
        .manufacturer-link {
            gap: calc(20 * var(--vw-with-scrollbar) / 400);
            padding: calc(8 * var(--vw-with-scrollbar) / 400)
                calc(18 * var(--vw-with-scrollbar) / 400);
            border-width: calc(2 * var(--vw-with-scrollbar) / 400);
        }
        .manufacturer-link__text {
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
        }
        .manufacturer-link__icon {
            width: calc(13 * var(--vw-with-scrollbar) / 400);
            height: auto;
        }
        .manufacturer-link__icon path {
            stroke: url(#paint0_linear_7164_3036);
        }
        .work-tabbar-controls, .manufacturer-tabbar-controls{
            display: none;
        }
    }
}
/* End Business Page CSS */
/* Start value Page CSS */
.sub-page-header--value.value-header .sub-page-header__bg {
    background-size: cover;
}
#value-page {
    .value-top-header {
        position: relative;
        margin-top: calc(-138 * var(--vw-with-scrollbar) / 1920);
        height: calc((599 + 138) * var(--vw-with-scrollbar) / 1920);
        overflow: hidden;
    }
    .value-top-header-title .banner-slide-in__content::before {
        background-color: white;
    }
    .value-top-header-bg {
        position: absolute;
        top: calc(138 * var(--vw-with-scrollbar) / 1920);
        bottom: 0;
        left: 0;
        width: 100%;
        background: var(--main-gra-nz-texture);
        background-size: cover;
    }
    .value-top-header-title {
        width: calc(476 * var(--vw-with-scrollbar) / 1920);
        font-family: var(--font-shippori-antique);
        font-style: normal;
        font-weight: 400;
        font-size: calc(80 * var(--vw-with-scrollbar) / 1920);
        line-height: 110%;
        letter-spacing: -0.01em;
        color: white;
        /* transform: matrix(1, 0, -0.24, 0.97, 0, 0); */
        margin-left: calc(234 * var(--vw-with-scrollbar) / 1920);
        margin-top: calc(171 * var(--vw-with-scrollbar) / 1920);
    }
    .value-top-header-img {
        position: absolute;
        background-image: url(../img/value/value-top.webp);
        width: calc(956 * var(--vw-with-scrollbar) / 1920);
        height: calc(737 * var(--vw-with-scrollbar) / 1920);
        right: 0;
        bottom: 0;
        background-size: contain;
    }
    .value-top-title {
        width: calc(1180 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(370 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(60 * var(--vw-with-scrollbar) / 1920);
        padding-bottom: calc(30 * var(--vw-with-scrollbar) / 1920);
        font-family: var(--font-noto-sans-jp);
        font-style: normal;
        font-weight: 700;
        font-size: calc(24 * var(--vw-with-scrollbar) / 1920);
        line-height: 200%;
        display: flex;
        flex-direction: column;
        align-items: start;
    }
    .value-top-title p {
        font-weight: bold;
        font-size:calc(24 * var(--vw-with-scrollbar) / 1920);
        color: var(--main-color);
        line-height: 2;
    }
    .our-value-title {
        padding-left: calc(100 * var(--vw-with-scrollbar) / 1920);
        padding-top: calc(100 * var(--vw-with-scrollbar) / 1920);
    }
    .our-value-title-up {
        display: flex;
    }
    .our-value-title-up-sticker {
    }
    .our-value-title-up-til {
        font-family: var(--font-inter);
        font-style: normal;
        font-weight: 700;
        font-size: calc(24 * var(--vw-with-scrollbar) / 1920);
        line-height: calc(29 * var(--vw-with-scrollbar) / 1920);
        transform: matrix(1, 0, -0.24, 0.97, 0, 0);
        color: var(--main-color);
        padding-left: calc(4 * var(--vw-with-scrollbar) / 1920);
    }
    .our-value-title-down {
        font-family: var(--font-noto-sans-jp);
        font-style: normal;
        font-weight: 700;
        font-size: calc(70 * var(--vw-with-scrollbar) / 1920);
        line-height: 180%;
        color: var(--main-color);
    }
    .work-life {
        position: relative;
        display: flex;
        flex-direction: column;
        margin-bottom: calc(116 * var(--vw-with-scrollbar) / 1920);
    }
    .work-life-top-bg {
        width: calc(844 * var(--vw-with-scrollbar) / 1920);
        height: calc(445 * var(--vw-with-scrollbar) / 1920);
        position: relative;
        background-size: contain;
    }
    .work-life-top-til1 {
        font-family: var(--font-noto-sans-jp);
        font-style: normal;
        font-weight: 700;
        /*font-size: calc(24 * var(--vw-with-scrollbar) / 1920);*/
        font-size: calc(20 * var(--vw-with-scrollbar) / 1920);
        line-height: 130%;
        color: var(--base-color);
        text-align: center;
        padding-top: calc(97 * var(--vw-with-scrollbar) / 1920);
    }
    .work-life-top-til2 {
        width: calc(760.5 * var(--vw-with-scrollbar) / 1920);
        font-family: var(--font-noto-sans-jp);
        font-style: normal;
        font-weight: 700;
        /*font-size: calc(110 * var(--vw-with-scrollbar) / 1920);*/
        font-size: calc(80 * var(--vw-with-scrollbar) / 1920);
        line-height: 90%;
        color: var(--base-color);
        letter-spacing: -0.21em;
        text-align: center;
        padding-top: calc(21 * var(--vw-with-scrollbar) / 1920);
        padding-left: calc(33 * var(--vw-with-scrollbar) / 1920);
    }
    .round-link-btn {
        position: absolute;
        right: calc(18 * var(--vw-with-scrollbar) / 1920);
        bottom: calc(15 * var(--vw-with-scrollbar) / 1920);
    }

    .work-life-top {
        width: fit-content;
        margin: auto;
        border-radius: calc(10 * var(--vw-with-scrollbar) / 1920);
        overflow: hidden;
    }

    #work-life-1 {
        margin-top: calc(60 * var(--vw-with-scrollbar) / 1920);
    }

    .background-middle {
        width: 100%;
        left: 0px;
        top: 0;
        bottom: 0;
        /* base */
        background: #f5f5f5;
        position: absolute;
        z-index: -1;
    }

    .value-prop {
        display: flex;
        width: fit-content;
        gap: 1.510416vw;
        margin: 0 auto;
        margin-top: 2.083333vw;
    }

    .value-prop .img-group {
        display: flex;
        flex-direction: column;
        gap: 0.78125vw;
    }
    .value-prop .img-group img {
        width: 100%;
        height: auto;
        object-fit: contain;
    }

    .value-prop .title-group {
        display: flex;
        flex-direction: row;
        gap: 0.78125vw;
        align-items: end;
    }

    .value-prop .text-group {
        display: flex;
        gap: 1.3vw;
        padding-top: calc(6 * var(--vw-with-scrollbar) / 1920);
    }

    .value-prop .text-group-left {
        display: flex;
        gap: 1.3vw;
    }
    .value-prop .text-group-right {
        display: flex;
        gap: 1.3vw;
    }

    .value-prop .big-char {
        font-family: var(--font-noto-sans-jp);
        font-style: normal;
        font-weight: 600;
        font-size: 3.33333vw;
        line-height: 100%;
        font-feature-settings: "vert" on;
    }

    .value-prop .special-line {
        margin-top: calc(-6 * var(--vw-with-scrollbar) / 1920);
        max-width: calc(50 * var(--vw-with-scrollbar) / 1920);
    }

    .value-prop .vertical-text {
        position: relative;
        display: flex;
        flex-direction: row;
        writing-mode: vertical-rl;
        text-orientation: upright;
        white-space: nowrap;
        font-family: var(--font-noto-sans-jp);
        font-style: normal;
        font-weight: 500;
        font-size: 1.25vw;
        line-height: 100%;
        font-feature-settings: "vert" on;
        background: linear-gradient(180deg, #004098 0%, #111111 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        text-fill-color: transparent;
        letter-spacing: 0.4vw;
        align-items: center;
    }

    .value-prop .vertical-text.large-title {
        font-size: 4.1666666vw;
    }

    .value-prop .text-group .vertical-text.orange-text {
        -webkit-text-fill-color: #e46c06 !important;
        background: unset;
    }
    .work-life-top-til1.text-group {
        display: flex;
        margin: auto;
        width: fit-content;
        padding-top: 2.1875vw;
    }
    .vertical-large-title {
        flex-direction: row;
        writing-mode: vertical-rl;
        text-orientation: upright;
        white-space: nowrap;
        font-family: var(--font-noto-sans-jp);
        font-style: normal;
        font-size: 4.1666666vw;
        color: #ffffff;
        position: relative;
        display: flex;
        font-weight: 600;
        line-height: 100%;
        font-feature-settings: "vert" on;
        letter-spacing: 0.6vw;
        align-items: center;
    }
    .last-group .value-prop {
        gap: calc(37 * var(--vw-with-scrollbar) / 1920);
    }

    .last-group.work-life {
        margin-bottom: 0vw;
    }
    .summary-value {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0 calc(103 * var(--vw-with-scrollbar) / 1920);
        padding: calc(60 * var(--vw-with-scrollbar) / 1920);
    }

    .summary-value .gradient-line {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        transform: translateY(-50%);
        height: calc(3 * var(--vw-with-scrollbar) / 1920);
        background: var(--main-gra-nz);
    }

    .summary-value .gradient-header {
        font-family: var(--font-shippori-antique);
        font-size: calc(53.13 * var(--vw-with-scrollbar) / 1920);
        font-weight: 400;
        line-height: 1.5;
        letter-spacing: 0.19em;
        text-align: center;
        background: var(--main-gra-nz);
    }

    .summary-value .banner-slide-in__content::before {
        background: var(--main-gra-nz-texture);
        background-size: contain;
    }

    #work-life-1 .work-life-top-bg {
	    display: flex;
    	flex-direction: column;
    	justify-content: center;
        /*background-image: url(../img/value/work-life-01.webp);*/
        background-image: url(../img/value/work-life-01.png);
    }
    #work-life-1 .work-life-top-til1 {
		padding-top: 0;
    }

    #work-life-2 .work-life-top-bg {
        background-image: url(../img/value/work-life-02.webp);
    }

    #work-life-3 .work-life-top-bg {
        background-image: url(../img/value/work-life-03.webp);
    }

    .work-life-top-bg.circle-clip {
        animation-duration: 0.8s !important;
    }
}
@media (min-width: 1025px) {
    #value-page {
        .animate-pc .circle-clip,
        .animate-pc .slide-fade-in-rtl {
            animation-delay: 0.5s !important;
        }
        #work-life-1 .value-prop {
            width: calc(844 * var(--vw-with-scrollbar) / 1920);
            margin-bottom: calc(136 * var(--vw-with-scrollbar) / 1920);
        }
        #work-life-1 .value-prop .img-group {
            width: calc(199 * var(--vw-with-scrollbar) / 1920);
        }
        #work-life-1 .value-prop .text-group-right {
            gap: calc(8 * var(--vw-with-scrollbar) / 1920);
        }
        #work-life-2 .title-group {
            height: fit-content;
            margin: 0 0 calc(43.5 * var(--vw-with-scrollbar) / 1920) 0;
        }
        #work-life-2 .work-life-top-bg {
            height: calc(469 * var(--vw-with-scrollbar) / 1920);
        }
        #work-life-3 .value-prop {
            margin-bottom: calc(55.28 * var(--vw-with-scrollbar) / 1920);
        }
        #work-life-1 .background-middle {
            top: calc(213 * var(--vw-with-scrollbar) / 1920);
        }
        #work-life-2 .background-middle {
            top: calc(259 * var(--vw-with-scrollbar) / 1920);
        }
        #work-life-3 .background-middle {
            top: calc(222 * var(--vw-with-scrollbar) / 1920);
        }
        #work-life-3 .value-prop .img-group {
            width: calc(170 * var(--vw-with-scrollbar) / 1920);
        }
    }
}
@media (max-width: 1024px) {
    #value-page {
        .value-top-header {
            margin-top: 0;
            height: calc(380 * var(--vw-with-scrollbar) / 400);
        }
        .value-top-header-bg {
            inset: 0;
        }
        .value-top-header-title {
            margin: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(22 * var(--vw-with-scrollbar) / 400);
            width: calc(270 * var(--vw-with-scrollbar) / 400);
            font-size: calc(40 * var(--vw-with-scrollbar) / 400);
            line-height: 1.1;
            letter-spacing: -0.01em;
        }
        .value-top-header-img {
            right: calc(-65 * var(--vw-with-scrollbar) / 400);
            width: calc(366 * var(--vw-with-scrollbar) / 400);
            height: calc(282 * var(--vw-with-scrollbar) / 400);
            background-image: url(../img/value/value-top-sp.webp);
            background-size: contain;
        }
        .value-top-title {
            width: fit-content;
            padding: calc(40 * var(--vw-with-scrollbar) / 400)
                calc(24 * var(--vw-with-scrollbar) / 400);
        }
        .value-top-title p {
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
            line-height: 1.8;
        }
        .our-value-title {
            padding: 0 0 0 calc(24 * var(--vw-with-scrollbar) / 400);
        }
        .our-value-title-down {
            margin-top: calc(14 * var(--vw-with-scrollbar) / 400);
            font-size: calc(32 * var(--vw-with-scrollbar) / 400);
            line-height: 1.2;
            max-width: calc(256 * var(--vw-with-scrollbar) / 400);
        }
        .work-life {
            padding: 0;
            margin: calc(40 * var(--vw-with-scrollbar) / 400) 0 0 0 !important;
        }
        .value-prop {
            display: flex;
            flex-direction: column-reverse;
            align-items: center;
            margin-top: calc(10 * var(--vw-with-scrollbar) / 400);
            padding: 0;
            padding-bottom: calc(40 * var(--vw-with-scrollbar) / 400);
            gap: 0;
        }
        .value-prop .vertical-text {
            font-size: calc(16 * var(--vw-with-scrollbar) / 400);
            letter-spacing: 0.2em;
        }
        .value-prop .text-group {
            padding: 0;
            padding-top: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .value-prop .text-group-left {
            gap: calc(10 * var(--vw-with-scrollbar) / 400);
        }
        .value-prop .text-group-right {
            gap: 0;
        }
        .value-prop .special-line {
            margin-top: 0;
            max-width: unset;
        }
        .value-prop .big-char {
            position: static;
            font-size: calc(50 * var(--vw-with-scrollbar) / 400);
            margin-bottom: calc(5 * var(--vw-with-scrollbar) / 400);
        }
        .value-prop .text-group .vertical-text.orange-text {
            font-size: calc(24 * var(--vw-with-scrollbar) / 400);
            letter-spacing: 0.05em;
        }
        .work-life-top {
            width: 100%;
            max-width: calc(352 * var(--vw-with-scrollbar) / 400);
            height: calc(300 * var(--vw-with-scrollbar) / 400);
            box-sizing: border-box;
            border-radius: 0;
            margin: 0 auto;
        }
        .work-life-top-bg {
            width: 100%;
            height: 100%;
            box-sizing: border-box;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            padding: calc(17 * var(--vw-with-scrollbar) / 400);
            background-size: contain;
        }
        .round-link-btn {
            bottom: calc(5.15 * var(--vw-with-scrollbar) / 400);
            right: calc(8.15 * var(--vw-with-scrollbar) / 400);
        }
        .work-life-top-til1 {
            padding: 0;
            /*font-size: calc(20 * var(--vw-with-scrollbar) / 400);*/
            font-size: calc(18 * var(--vw-with-scrollbar) / 400);
        }
        .work-life-top-til2 {
            width: fit-content;
            padding: 0;
            /*font-size: calc(40 * var(--vw-with-scrollbar) / 400);*/
            font-size: calc(30 * var(--vw-with-scrollbar) / 400);
            line-height: 1;
            letter-spacing: -0.1em;
        }
        .value-prop .img-group {
            flex-direction: row;
            gap: calc(16 * var(--vw-with-scrollbar) / 400);
        }
        .value-prop .img-group img:first-child {
            width: calc(147 * var(--vw-with-scrollbar) / 400);
            height: auto;
        }
        #work-life-1 .value-prop .img-group img:last-child {
            margin-top: calc(20.5 * var(--vw-with-scrollbar) / 400);
            width: calc(176 * var(--vw-with-scrollbar) / 400);
            height: calc(64 * var(--vw-with-scrollbar) / 400);
        }
        .value-prop .title-group {
            margin-top: calc(40 * var(--vw-with-scrollbar) / 400);
            display: flex;
            flex-direction: row-reverse;
            flex-wrap: wrap-reverse;
            justify-content: center;
            align-items: center;
            row-gap: calc(10 * var(--vw-with-scrollbar) / 400);
        }
        .value-prop .vertical-text.large-title {
            letter-spacing: -0.11em;
            line-height: 1.1;
            font-size: calc(40 * var(--vw-with-scrollbar) / 400);
            writing-mode: unset;
            text-orientation: unset;
        }
        #work-life-1 .work-life-top-bg {
            /*background-image: url(../img/value/work-life-01-sp.webp);*/
            background-image: url(../img/value/work-life-01-sp.png);
        }
        #work-life-2 .work-life-top-bg {
            background-image: url(../img/value/work-life-02-sp.webp);
        }
        #work-life-3 .work-life-top-bg {
            background-image: url(../img/value/work-life-03-sp.webp);
        }
        #work-life-1 .value-prop .img-group {
            padding-bottom: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        #work-life-1 .value-prop .text-group {
            gap: calc(16 * var(--vw-with-scrollbar) / 400);
            margin-bottom: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        #work-life-2 .value-prop .text-group {
            gap: calc(30 * var(--vw-with-scrollbar) / 400);
        }
        #work-life-3 .value-prop .text-group {
            gap: calc(24 * var(--vw-with-scrollbar) / 400);
        }
        #work-life-3 .value-prop {
            flex-direction: column;
            gap: calc(10 * var(--vw-with-scrollbar) / 400);
        }
        #work-life-3 .value-prop .img-group img:last-child {
            margin-top: 0;
            aspect-ratio: 1;
            width: calc(159 * var(--vw-with-scrollbar) / 400);
            height: auto;
        }
        .summary-value {
            position: relative;
            display: flex;
            justify-content: center;
            align-items: center;
            margin: 0 calc(34 * var(--vw-with-scrollbar) / 400);
            padding: calc(16 * var(--vw-with-scrollbar) / 400) 0;
            padding-bottom: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .summary-value .banner-slide-in__content::before {
            background: var(--main-gra-nz-texture);
            background-size: cover;
        }
        .summary-value .gradient-line {
            height: calc(3 * var(--vw-with-scrollbar) / 400);
        }
        .summary-value .gradient-header {
            font-size: calc(24 * var(--vw-with-scrollbar) / 400);
            line-height: 1.9;
            letter-spacing: 0.19em;
        }
        .work-life-top-til1.text-group {
            display: flex;
            gap: calc(10 * var(--vw-with-scrollbar) / 400);
            padding-top: 0;
        }
        .vertical-large-title {
            font-size: calc(40 * var(--vw-with-scrollbar) / 400);
        }
        .background-middle {
            top: calc(150 * var(--vw-with-scrollbar) / 400);
        }
    }
}
/* End value Page CSS */