/* ============================================================
   共通スタイル
============================================================ */
/* COMMON */
*    { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background: #FAFAF7;
    font-family: 'Noto Sans JP', sans-serif;
    color: #15181D;
}
::selection { background: rgba(240, 133, 31, .22); }
/* 変数定義 */
:root {
    --accent: #F0851F;
    --teal: #15BFA8;
    --dark: #15181D;
    --light-bg: #FAFAF7;
    --light-border: #ECEAE2;
}
/* ホバー管理 */
[data-hv="hv1"]:hover {
    color: var(--accent, #F0851F) !important;
}
[data-hv="hv2"]:hover {
    background: var(--accent, #F0851F) !important;
    transform: translateY(-1px) !important;
}
[data-hv="hv3"]:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 20px 38px -12px rgba(240, 133, 31, .7) !important;
}
[data-hv="hv4"]:hover {
    border-color: var(--teal, #15BFA8) !important;
    background: rgba(21, 191, 168, .06) !important;
}
[data-hv="hv5"]:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 26px 50px -28px rgba(20, 24, 29, .32) !important;
    border-color: var(--accent, #F0851F) !important;
}
[data-hv="hv6"]:hover {
    gap: 14px !important;
    color: var(--accent, #F0851F) !important;
}
[data-hv="hv7"]:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 26px 50px -28px rgba(20, 24, 29, .32) !important;
    border-color: var(--teal, #15BFA8) !important;
}
[data-hv="hv8"]:hover {
    gap: 14px !important;
    color: var(--teal, #15BFA8) !important;
}
[data-hv="hv9"]:hover {
    gap: 14px !important;
    background: #15181D !important;
    color: #fff !important;
}
[data-hv="hv10"]:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 24px 44px -26px rgba(20, 24, 29, .4) !important;
}
[data-hv="hv11"]:hover {
    transform: translateY(-5px) !important;
    border-color: var(--accent, #F0851F) !important;
    background: #1A1F27 !important;
}
[data-hv="hv12"]:hover {
    transform: translateY(-5px) !important;
    border-color: var(--teal, #15BFA8) !important;
    background: #1A1F27 !important;
}

/* ============================================================
   キーフレーム・アニメーション
============================================================ */
/* ヒーロー */
@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}
@keyframes spinRev {
    to {
        transform: rotate(-360deg);
    }
}
@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(26px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}
@keyframes bob {
    0%,
    100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(7px);
    }
}
@keyframes fadeUpCenter {
    from {
        opacity: 0;
        transform: translateY(26px) translateX(-50%);
    }
    to {
        opacity: 1;
        transform: translateX(-50%);
    }
}
/* マーキー */
@keyframes marquee {
    to {
        transform: translateX(-50%);
    }
}

/* ============================================================
   モバイルメニュー・バーガーメニュー
============================================================ */
[data-burger] {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    width: 44px;
    height: 44px;
    padding: 0;
    margin: -8px;
    background: none;
    border: none;
    cursor: pointer;
}
[data-burger] span {
    width: 24px;
    height: 2px;
    background: #15181D;
    border-radius: 2px;
    transition: transform .3s ease, opacity .2s ease;
}
[data-burger][data-open="true"] span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}
[data-burger][data-open="true"] span:nth-child(2) {
    opacity: 0;
}
[data-burger][data-open="true"] span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}
[data-mobile-menu] {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: opacity .32s ease, transform .32s ease, visibility .32s;
}
[data-mobile-menu][data-open="true"] {
    opacity: 1;
    visibility: visible;
    transform: none;
}
[data-mobile-menu] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 55;
    background: #FAFAF7;
    display: flex;
    flex-direction: column;
    padding: 92px 24px 32px;
}
[data-mobile-menu] nav {
    display: flex;
    flex-direction: column;
}
[data-mobile-menu] nav a {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding: 20px 4px;
    border-bottom: 1px solid #ECEAE2;
    text-decoration: none;
    color: #15181D;
}
[data-mobile-menu] nav a span:first-child {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 27px;
    font-weight: 600;
    letter-spacing: -.01em;
}
[data-mobile-menu] nav a span:last-child {
    font-size: 13px;
    color: #9aa0a6;
}
[data-mobile-menu] nav + a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 28px;
    background: var(--accent,#F0851F);
    color: #fff;
    text-decoration: none;
    font-family: 'Space Grotesk',sans-serif;
    font-weight: 600;
    font-size: 17px;
    padding: 18px;
    border-radius: 14px;
}
[data-mobile-menu] nav + a + div {
    margin-top: auto;
    padding-top: 28px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
[data-mobile-menu] nav + a + div > span {
    font-size: 12px;
    color: #9aa0a6;
}
[data-mobile-menu] nav + a + div > a {
    font-family: 'Space Grotesk',sans-serif;
    font-size: 24px;
    font-weight: 700;
    color: #15181D;
    text-decoration: none;
}

/* ============================================================
   HEADER セクション
============================================================ */
.header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 60;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 44px;
    background: rgba(250, 250, 247, 0.82);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.header__logo {
    display: flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    color: inherit;
}
.header__logo-icon img {
    width: 45px;
    height: 30px;
    vertical-align: middle;
}
.header__logo-text-sub {
    font-size: 13px;
    font-weight: 500;
    color: #5b616a;
    letter-spacing: .02em;
}
.header__logo-text-main {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -.02em;
}
.header__nav {
    position: relative;
    display: flex;
    align-items: center;
    gap: 34px;
}
.header__nav-pill {
    position: absolute;
    top: 50%;
    left: 0;
    height: 34px;
    width: 0;
    margin-top: -17px;
    border-radius: 999px;
    background: #15181D;
    opacity: 0;
    z-index: 0;
    pointer-events: none;
    transition: transform .4s cubic-bezier(.16, 1, .3, 1), width .4s cubic-bezier(.16, 1, .3, 1), opacity .3s ease;
}
.header__nav-link {
    position: relative;
    z-index: 1;
    display: inline-block;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #3a3f47;
    text-decoration: none;
    letter-spacing: .01em;
    padding: 8px 14px;
    margin: -8px -14px;
    transition: color .3s ease;
}
.header__nav-link--active {
    color: #fff;
}
.header__cta {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    text-decoration: none;
    background: #15181D;
    padding: 11px 20px;
    border-radius: 999px;
    transition: background .25s, transform .25s;
}
.header__cta span {
    font-size: 15px;
}

/* ============================================================
   HERO セクション
============================================================ */
.hero {
    position: relative;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 140px 32px 90px;
    overflow: hidden;
    background: radial-gradient(120% 90% at 50% 0%, #ffffff 0%, #F6F4EE 55%, #F1EFE7 100%);
}
.hero__rings {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    z-index: 0;
}
.hero__rings-circle {
    position: absolute;
    border-radius: 50%;
}
.hero__rings-circle--large-dashed {
    width: 980px;
    height: 980px;
    max-width: 150vw;
    max-height: 150vw;
    border: 1px dashed rgba(20, 24, 29, 0.08);
    animation: spin 90s linear infinite;
    animation-play-state: running;
}
.hero__rings-circle--medium {
    width: 720px;
    height: 720px;
    max-width: 108vw;
    max-height: 108vw;
    border: 1px solid rgba(20, 24, 29, 0.06);
}
.hero__rings-circle--medium-gradient {
    width: 720px;
    height: 720px;
    max-width: 108vw;
    max-height: 108vw;
    border: 2px solid transparent;
    border-top-color: var(--accent, #F0851F);
    border-right-color: rgba(240, 133, 31, 0.25);
    animation: spin 16s linear infinite;
    animation-play-state: running;
}
.hero__rings-circle--small-gradient {
    width: 480px;
    height: 480px;
    max-width: 80vw;
    max-height: 80vw;
    border: 2px solid transparent;
    border-bottom-color: var(--teal, #15BFA8);
    border-left-color: rgba(21, 191, 168, 0.22);
    animation: spinRev 11s linear infinite;
    animation-play-state: running;
}
.hero__rings-circle--medium-main {
    width: 720px;
    height: 720px;
    max-width: 108vw;
    max-height: 108vw;
    animation: spin 16s linear infinite;
    animation-play-state: running;
}
.hero__rings-circle--small-main {
    width: 480px;
    height: 480px;
    max-width: 80vw;
    max-height: 80vw;
    animation: spinRev 11s linear infinite;
    animation-play-state: running;
}
.hero__rings-dot {
    position: absolute;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    box-shadow: 0 0 22px 2px rgba(240, 133, 31, .55);
}
.hero__rings-dot--accent {
    background: var(--accent, #F0851F);
    position: absolute;
    top: -7px;
    left: 50%;
    transform: translateX(-50%);
}
.hero__rings-dot--teal {
    background: var(--teal, #15BFA8);
    box-shadow: 0 0 18px 2px rgba(21, 191, 168, .5);
    position: absolute;
    bottom: -6px;
    left: 50%;
    transform: translateX(-50%);
    width: 11px;
    height: 11px;
}
.hero__content {
    position: relative;
    z-index: 1;
    max-width: 1000px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.hero__tagline {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .32em;
    color: var(--accent, #F0851F);
    margin-bottom: 30px;
    animation: fadeUp .8s .05s both;
}
.hero__title {
    margin: 0;
    font-size: clamp(24px, 4vw, 54px);
    line-height: 1.32;
    font-weight: 700;
    letter-spacing: .01em;
    color: #13161B;
}
.hero__char {
    display: inline-block;
    opacity: 0;
    animation: heroCharIn .45s cubic-bezier(.16, 1, .3, 1) both;
}
@keyframes heroCharIn {
    from {
        opacity: 0;
        transform: translateY(16px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}
.hero__title-highlight {
    background: linear-gradient(120deg, var(--accent, #F0851F), var(--teal, #15BFA8));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.hero__title-accent {
    color: var(--accent, #F0851F);
}
.hero__title-teal {
    color: var(--teal, #15BFA8);
}
.hero__subtitle {
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(15px, 2vw, 20px);
    font-weight: 500;
    letter-spacing: .04em;
    color: #6a7079;
    margin: 26px 0 0;
    animation: fadeUp .9s .22s both;
}
.hero__cta-group {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 42px;
    animation: fadeUp .9s .3s both;
}
.hero__cta {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 600;
    font-size: 16px;
    text-decoration: none;
    padding: 17px 34px;
    border-radius: 999px;
    transition: transform .25s, box-shadow .25s;
}
.hero__cta span {
    font-size: 18px;
}
.hero__cta--primary {
    background: var(--accent, #F0851F);
    color: #fff;
    box-shadow: 0 14px 30px -12px rgba(240, 133, 31, .6);
}
.hero__cta--secondary {
    background: #FAFAF7;
    color: #15181D;
    border: 1.5px solid rgba(20, 24, 29, .22);
    transition: border-color .25s, background .25s;
    padding: 17px 30px;
}
.hero__scroll {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    z-index: 1;
    animation: fadeUpCenter 1s .5s both;
}
.hero__scroll-label {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 10px;
    letter-spacing: .28em;
    color: #9aa0a6;
}
.hero__scroll-line {
    width: 1px;
    height: 34px;
    background: linear-gradient(#b9bdc2, transparent);
    animation: bob 1.8s ease-in-out infinite;
}

/* ============================================================
   MARQUEE セクション
============================================================ */
.marquee {
    background: #0E1117;
    color: #fff;
    overflow: hidden;
    padding: 20px 0;
    white-space: nowrap;
}
.marquee__container {
    display: inline-flex;
    align-items: center;
    gap: 0;
    animation: marquee 30s linear infinite;
    will-change: transform;
}
.marquee__group {
    display: inline-flex;
    align-items: center;
}
.marquee__text {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 19px;
    font-weight: 500;
    letter-spacing: .06em;
    padding: 0 28px;
}
.marquee__dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
}
.marquee__dot--accent {
    background: var(--accent, #F0851F);
}
.marquee__dot--teal {
    background: var(--teal, #15BFA8);
}

/* ============================================================
   BUSINESSES セクション
============================================================ */
.businesses {
    position: relative;
    padding: 130px 44px;
    max-width: 1240px;
    margin: 0 auto;
}
.businesses::before {
    content: '';
    position: absolute;
    bottom: -88px;
    left: -200px;
    width: 450px;
    height: 500px;
    background-image: url('../images/logo_xl.png');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.15;
    pointer-events: none;
    z-index: 0;
}
.businesses__header {
    position: relative;
    z-index: 1;
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1), transform .8s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
    margin-bottom: 56px;
}
.businesses__title {
    margin: 0;
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(36px, 5.5vw, 60px);
    font-weight: 700;
    letter-spacing: -.02em;
    display: flex;
    align-items: baseline;
    gap: 18px;
    flex-wrap: wrap;
}
.businesses__title-ja {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: var(--accent, #F0851F);
}
.businesses__description {
    margin: 18px 0 0;
    font-size: 15px;
    line-height: 2;
    color: #5b616a;
}
.businesses__grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.businesses-card {
    position: relative;
    background: #fff;
    border: 1px solid #ECEAE2;
    border-radius: 18px;
    padding: 38px 32px 34px;
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1), transform .35s cubic-bezier(.16, 1, .3, 1), box-shadow .35s, border-color .35s, filter .8s cubic-bezier(.16, 1, .3, 1);
    overflow: hidden;
}
.businesses-card:nth-child(2) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .08s, transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s, border-color .35s, filter .8s cubic-bezier(.16, 1, .3, 1);
}
.businesses-card:nth-child(3) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .16s, transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s, border-color .35s, filter .8s cubic-bezier(.16, 1, .3, 1);
}
.businesses-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--accent, #F0851F), var(--teal, #15BFA8));
}
.businesses-card:nth-child(2)::before {
    background: linear-gradient(90deg, var(--teal, #15BFA8), var(--accent, #F0851F));
}
.businesses-card__icon-group {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 26px;
}
.businesses-card__icon {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    border: 2px solid;
    display: flex;
    align-items: center;
    justify-content: center;
    border-color: var(--accent,#F0851F);
}
.businesses-card__icon > .businesses-card__icon-svg {
    width: 24px;
    height: 24px;
    border: none;
    border-radius: 0;
    background-color: var(--accent, #F0851F);
    mask-size: contain;
    -webkit-mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
}
.businesses-card__icon-svg--system {
    mask-image: url('../images/svg/system.svg');
    -webkit-mask-image: url('../images/svg/system.svg');
}
.businesses-card__icon-svg--call {
    mask-image: url('../images/svg/call.svg');
    -webkit-mask-image: url('../images/svg/call.svg');
}
.businesses-card__icon-svg--travel {
    mask-image: url('../images/svg/travel.svg');
    -webkit-mask-image: url('../images/svg/travel.svg');
}
.businesses-card__icon2 {
    border-color: var(--teal,#15BFA8);
}
.businesses-card__icon2 > .businesses-card__icon-svg {
    background-color: var(--teal, #15BFA8);
}
.businesses-card__number {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 42px;
    font-weight: 700;
    color: #EFEDE5;
    line-height: 1;
}
.businesses-card__title {
    margin: 0 0 12px;
    font-size: 21px;
    font-weight: 700;
}
.businesses-card__description {
    margin: 0 0 24px;
    font-size: 14px;
    line-height: 1.95;
    color: #5b616a;
}
.businesses-card__link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #15181D;
    text-decoration: none;
    transition: gap .25s, color .25s;
}

/* ============================================================
   TOPICS セクション
============================================================ */
.topics {
    background: #F1EFE7;
    padding: 120px 44px;
}
.topics__container {
    max-width: 1240px;
    margin: 0 auto;
}
.topics__header {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1), transform .8s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 50px;
}
.topics__title {
    margin: 0;
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(36px, 5.5vw, 60px);
    font-weight: 700;
    letter-spacing: -.02em;
    display: flex;
    align-items: baseline;
    gap: 18px;
    flex-wrap: wrap;
}
.topics__title-ja {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: var(--accent, #F0851F);
}
.topics__view-all {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: #15181D;
    text-decoration: none;
    padding: 13px 24px;
    border-radius: 999px;
    border: 1.5px solid rgba(20, 24, 29, .18);
    background: #fff;
    transition: gap .25s, background .25s, color .25s;
}
.topics__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
}
.topics-card {
    text-decoration: none;
    color: inherit;
    background: #fff;
    border: 1px solid var(--light-border, #ECEAE2);
    border-radius: 16px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1), transform .35s, box-shadow .35s, border-color .35s, filter .8s cubic-bezier(.16, 1, .3, 1);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
}
.topics-card:nth-child(2) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .07s, transform .35s, box-shadow .35s, filter .8s cubic-bezier(.16, 1, .3, 1);
}
.topics-card:nth-child(3) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .14s, transform .35s, box-shadow .35s, filter .8s cubic-bezier(.16, 1, .3, 1);
}
.topics-card:nth-child(4) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .21s, transform .35s, box-shadow .35s, filter .8s cubic-bezier(.16, 1, .3, 1);
}
.topics-card__image {
    aspect-ratio: 16/10;
    background: repeating-linear-gradient(135deg, #E9E6DD 0 11px, #F2F0E9 11px 22px);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.topics-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.topics-card__content {
    padding: 22px 22px 26px;
    display: flex;
    flex-direction: column;
    gap: 11px;
}
.topics-card__meta {
    display: flex;
    align-items: center;
    gap: 10px;
}
.topics-card__date {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 12px;
    font-weight: 600;
    color: #9aa0a6;
}
.topics-card__tag {
    font-size: 11px;
    font-weight: 700;
    border: 1px solid;
    border-radius: 999px;
    padding: 3px 10px;
}
.topics-card__tag--accent {
    color: var(--accent, #F0851F);
    border-color: var(--accent, #F0851F);
}
.topics-card__tag--teal {
    color: var(--teal, #15BFA8);
    border-color: var(--teal, #15BFA8);
}
.topics-card__title {
    margin: 0;
    font-size: 14.5px;
    font-weight: 500;
    line-height: 1.7;
}

/* ============================================================
   SERVICES セクション
============================================================ */
.services {
    max-width: 1240px;
    margin: 0 auto;
    padding: 130px 44px;
}
.services__header {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1), transform .8s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
    margin-bottom: 64px;
}
.services__title {
    margin: 0;
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(36px, 5.5vw, 60px);
    font-weight: 700;
    letter-spacing: -.02em;
    display: flex;
    align-items: baseline;
    gap: 18px;
    flex-wrap: wrap;
}
.services__title-ja {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: var(--accent, #F0851F);
}
.services__description {
    margin: 18px 0 0;
    font-size: 15px;
    line-height: 2;
    color: #5b616a;
}
.services__row {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1), transform .8s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
    display: grid;
    grid-template-columns: 0.42fr 0.58fr;
    gap: 40px;
    align-items: center;
    margin-bottom: 56px;
}
.services__row:last-child {
    margin-bottom: 0;
}
.services__row--reverse {
    grid-template-columns: 0.58fr 0.42fr;
}
.services__item-text {
    position: relative;
}
.services__item-img {
    aspect-ratio: 16 / 9;
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid #ECEAE2;
    background: repeating-linear-gradient(135deg, #E9E6DD 0 13px, #F2F0E9 13px 26px);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 30px 60px -34px rgba(20, 24, 29, .4);
}
.services__item-img img {
    width: 100%;
}
.services__item-number {
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(72px, 14vw, 130px);
    font-weight: 700;
    color: #F0EEE6;
    line-height: .8;
    display: block;
}
.services__item-title-group {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 18px 0 12px;
}
.services__item-dot {
    width: 9px;
    height: 9px;
    border-radius: 2px;
}
.services__item-dot--accent {
    background: var(--accent, #F0851F);
}
.services__item-dot--teal {
    background: var(--teal, #15BFA8);
}
.services__item-title {
    margin: 0;
    font-size: 26px;
    font-weight: 700;
}
.services__item-description {
    margin: 0 0 22px;
    font-size: 15px;
    line-height: 2;
    color: #5b616a;
}
.services__item-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: #15181D;
    text-decoration: none;
    transition: gap .25s, color .25s;
}

/* ============================================================
   PARTNERS セクション（取引先）
============================================================ */
.partners {
    background: #F1EFE7;
    padding: 100px 0;
    overflow: hidden;
}
.partners__header {
    max-width: 1240px;
    margin: 0 auto 48px;
    padding: 0 44px;
}
.partners__title {
    margin: 0;
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(36px, 5.5vw, 60px);
    font-weight: 700;
    letter-spacing: -.02em;
    display: flex;
    align-items: baseline;
    gap: 18px;
    flex-wrap: wrap;
}
.partners__title-ja {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: var(--accent, #F0851F);
}
.partners__description {
    margin: 18px 0 0;
    font-size: 15px;
    line-height: 2;
    color: #5b616a;
}
.partners__marquee {
    overflow: hidden;
    white-space: nowrap;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.partners__track {
    display: inline-flex;
    align-items: center;
    animation: marquee 50s linear infinite;
    will-change: transform;
}
.partners__group {
    display: inline-flex;
    align-items: center;
    gap: 40px;
    padding-right: 40px;
}
.partners__logo {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 56px;
}
.partners__logo img {
    display: block;
    max-height: 40px;
    max-width: 150px;
    width: auto;
    height: auto;
    object-fit: contain;
    opacity: .85;
    transition: opacity .25s;
}
.partners__logo:hover img {
    opacity: 1;
}
.partners__logo--placeholder {
    display: inline-flex;
    align-items: center;
    height: 56px;
    padding: 0 22px;
    border: 1px dashed rgba(20, 24, 29, .18);
    border-radius: 10px;
    background: rgba(255, 255, 255, .5);
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 13px;
    color: #8a8f98;
    white-space: nowrap;
}

/* ============================================================
   CONTACT セクション
============================================================ */
.contact {
    position: relative;
    background: #0E1117;
    color: #fff;
    padding: 130px 44px;
    overflow: hidden;
}
.contact__decoration {
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.1);
    animation: spin 70s linear infinite;
    animation-play-state: running;
}
.contact__decoration--large {
    top: -180px;
    right: -160px;
    width: 520px;
    height: 520px;
}
.contact__decoration--small {
    top: -120px;
    right: -100px;
    width: 400px;
    height: 400px;
    border: 2px solid transparent;
    border-top-color: rgba(240, 133, 31, .4);
    border-right-color: rgba(21, 191, 168, .3);
    animation: spin 22s linear infinite;
}
.contact__container {
    position: relative;
    max-width: 1100px;
    margin: 0 auto;
    text-align: center;
}
.contact__header {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1), transform .8s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.contact__title {
    margin: 0;
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(40px, 6vw, 68px);
    font-weight: 700;
    letter-spacing: -.02em;
}
.contact__subtitle {
    margin: 14px 0 0;
    font-size: 15px;
    font-weight: 600;
    color: var(--accent, #F0851F);
}
.contact__description {
    margin: 24px auto 56px;
    max-width: 560px;
    font-size: 15px;
    line-height: 2;
    color: #aeb4bc;
}
.contact__cards {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .1s, transform .8s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 22px;
    text-align: left;
}
.contact__cards--single {/*左側の資料ダウンロードのオミット用*/
    display: flex;
    justify-content: center;
}
.contact__cards--single .contact-card {/*左側の資料ダウンロードのオミット用*/
    width: 100%;
    max-width: 645px;
}
.contact-card {
    text-decoration: none;
    color: inherit;
    background: #161A21;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 18px;
    padding: 38px 34px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    transition: transform .35s, border-color .35s, background .35s;
}
.contact-card__label {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .18em;
}
.contact-card__label--accent {
    color: var(--accent, #F0851F);
}
.contact-card__label--teal {
    color: var(--teal, #15BFA8);
}
.contact-card__title {
    margin: 0;
    font-size: 23px;
    font-weight: 700;
    color: #fff;
}
.contact-card__description {
    margin: 0;
    font-size: 14px;
    line-height: 1.95;
    color: #aeb4bc;
}
.contact-card__arrow {
    margin-top: 8px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1.5px solid rgba(255, 255, 255, .2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

/* ============================================================
   FOOTER セクション
============================================================ */
.footer {
    background: #FAFAF7;
    padding: 72px 44px 40px;
    border-top: 1px solid #ECEAE2;
}
.footer__container {
    max-width: 1240px;
    margin: 0 auto;
}
.footer__top {
    display: flex;
    justify-content: space-between;
    gap: 48px;
    flex-wrap: wrap;
    padding-bottom: 48px;
    border-bottom: 1px solid #ECEAE2;
}
.footer__brand {
    max-width: 300px;
}
.footer__brand-header {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 16px;
}
.footer__brand-icon img {
    width: 36px;
    height: 24px;
    vertical-align: middle;
}
.footer__brand-text {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 22px;
    font-weight: 700;
}
.footer__brand-description {
    margin: 0 0 24px;
    font-size: 13px;
    line-height: 1.9;
    color: #7a8089;
}
.footer__social {
    display: flex;
    gap: 10px;
}
.footer__social-icon {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid #DAD7CE;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 600;
    color: #7a8089;
}
.footer__nav-group {
    display: flex;
    gap: 64px;
    flex-wrap: wrap;
}
.footer__nav-section {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.footer__nav-title {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .14em;
    color: #aeb0a6;
}
.footer__nav-link {
    font-size: 13px;
    color: #3a3f47;
    text-decoration: none;
}
.footer__contact-section {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 220px;
}
.footer__contact-title {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .14em;
    color: #aeb0a6;
}
.footer__contact-address {
    margin: 0;
    font-size: 13px;
    line-height: 1.85;
    color: #3a3f47;
}
.footer__contact-phone {
    margin: 6px 0 0;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: #15181D;
}
.footer__contact-phone > a {
    text-decoration: none;
    color: var(--dark, #000);
}
.footer__badges {
    display: flex;
    gap: 10px;
    margin-top: 10px;
}
.footer__badge img {
    width: 64px;
}
.footer__bottom {
    margin: 28px 0 0;
    text-align: center;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 12px;
    color: #a7a59b;
}

/* ============================================================
   ページ共通（下層ページ用）
============================================================ */
/* 1セクションのみの下層ページ：本文とフッターの境界をはっきりさせるための背景色 */
.section-bg-white {
    background: #fff;
}
.page-hero {
    position: relative;
    padding: 122px 44px 54px;
    text-align: center;
    color: #fff;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #0E1117;
}
.page-hero__inner {
    max-width: 820px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}
.page-hero__decoration {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}
.page-hero__title {
    margin: 0;
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(32px, 6vw, 52px);
    font-weight: 700;
    letter-spacing: -.02em;
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
}
.page-hero__title-ja {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: var(--accent, #F0851F);
}

/* セクション共通タイトル（下層ページ） */
.section-title {
    margin: 0 0 56px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(30px, 4.5vw, 46px);
    font-weight: 700;
    letter-spacing: -.02em;
    display: flex;
    align-items: baseline;
    gap: 16px;
    flex-wrap: wrap;
}
.section-title-ja {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: var(--accent, #F0851F);
}

/* ============================================================
   OVERVIEW セクション（会社概要）
============================================================ */
.overview {
    position: relative;
    max-width: 1000px;
    margin: 0 auto;
    padding: 100px 44px;
}
.overview::before {
    content: '';
    position: absolute;
    top: 0px;
    left: -250px;
    width: 600px;
    height: 500px;
    background-image: url('../images/logo_xl.png');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.1;
    pointer-events: none;
    z-index: 0;
}
.overview .section-title,
.overview .overview-table {
    position: relative;
    z-index: 1;
}
.overview-table {
    margin: 0;
    border-top: 1px solid var(--light-border, #ECEAE2);
}
.overview-table__row {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 24px;
    padding: 26px 4px;
    border-bottom: 1px solid var(--light-border, #ECEAE2);
}
.overview-table__row dt {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #8a8f98;
    letter-spacing: .04em;
}
.overview-table__row dd {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.9;
    color: #15181D;
}
.overview-table__row dd p {
    margin: 0 0 10px;
}
.map-embed {
    margin: 0 0 20px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--light-border, #ECEAE2);
    aspect-ratio: 16 / 7;
}
.map-embed iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}
.overview-table__row dd p:last-child {
    margin-bottom: 0;
}
.overview-table__row dd strong {
    font-weight: 700;
}
.overview-table__row dd a {
    color: var(--accent, #F0851F);
    text-decoration: underline;
}
.clients {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.clients__tag {
    display: inline-block;
    padding: 6px 14px;
    border-radius: 999px;
    border: 1px solid var(--light-border, #ECEAE2);
    background: #fff;
    font-size: 12px;
    color: #5b616a;
}

/* ============================================================
   GREETING セクション（代表挨拶）
============================================================ */
.greeting {
    position: relative;
    background: #F1EFE7;
    padding: 100px 44px;
    overflow: hidden;
}
.greeting__container {
    position: relative;
    z-index: 1;
    max-width: 1000px;
    margin: 0 auto;
}
.greeting__body {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 48px;
    align-items: start;
}
.greeting__photo {
    border-radius: 18px;
    background: repeating-linear-gradient(135deg, #E9E6DD 0 11px, #F2F0E9 11px 22px);
    overflow: hidden;
}
.greeting__photo img {
    display: block;
    width: 100%;
    height: auto;
}
.greeting__catch {
    position: relative;
    margin: 0 0 56px;
    font-size: clamp(18px, 2.9vw, 24px);
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: .01em;
    color: #13161B;
    white-space: nowrap;
}
.greeting__catch::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -10px;
    width: 2em;
    height: 3px;
    border-radius: 2px;
    background: linear-gradient(90deg, var(--accent, #F0851F), var(--teal, #15BFA8));
}
.greeting__text p {
    margin: 0 0 20px;
    font-size: 15px;
    line-height: 2.1;
    color: #3a3f47;
}
.greeting__sign {
    margin-top: 28px !important;
    font-weight: 700;
    color: #15181D !important;
}

/* ============================================================
   HISTORY セクション（沿革）
============================================================ */
.history {
    position: relative;
    background: #0E1117;
    color: #fff;
    padding: 120px 44px;
    overflow: hidden;
}
.history__decoration {
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.1);
    animation: spin 70s linear infinite;
    pointer-events: none;
}
.history__decoration--large {
    top: -180px;
    right: -160px;
    width: 520px;
    height: 520px;
}
.history__decoration--small {
    top: -120px;
    right: -100px;
    width: 400px;
    height: 400px;
    border: 2px solid transparent;
    border-top-color: rgba(240, 133, 31, .4);
    border-right-color: rgba(21, 191, 168, .3);
    animation: spin 22s linear infinite;
}
.history__container {
    position: relative;
    z-index: 1;
    max-width: 900px;
    margin: 0 auto;
}
.history .section-title {
    color: #fff;
}
.history__list {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
}
.history__list::before {
    content: '';
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 130px;
    width: 1px;
    background: rgba(255, 255, 255, .14);
}
.history__item {
    position: relative;
    display: grid;
    grid-template-columns: 130px 1fr;
    gap: 32px;
    padding: 0 0 34px 28px;
}
.history__item:last-child {
    padding-bottom: 0;
}
.history__item::before {
    content: '';
    position: absolute;
    left: 126px;
    top: 6px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--accent, #F0851F);
}
.history__date {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: rgba(255, 255, 255, .5);
    padding-top: 1px;
}
.history__text {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.45;
    color: rgba(255, 255, 255, .92);
}

/* ============================================================
   ページヒーロー（ブランドグラデーション・下層ページ共通）
============================================================ */
.page-hero--brand {
    text-align: left;
    overflow: hidden;
    background: linear-gradient(115deg, #103b34 0%, #15181D 42%, #4a2c12 72%, var(--accent, #F0851F) 100%);
}
.page-hero--brand .page-hero__inner {
    margin: 0;
    max-width: 640px;
}
.page-hero--brand .page-hero__title {
    justify-content: flex-start;
}
.page-hero__ring {
    position: absolute;
    top: -140px;
    right: -120px;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .18);
}
.page-hero__eyebrow {
    margin: 0 0 14px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .18em;
    color: rgba(255, 255, 255, .62);
}
.page-hero__subtitle {
    margin: 18px 0 0;
    font-size: 15.5px;
    color: rgba(255, 255, 255, .78);
    line-height: 1.7;
}

/* ============================================================
   INFINI セクション（プロダクト詳細ページ）
============================================================ */
/* OVERVIEW */
.infini-overview {
    position: relative;
    max-width: 1080px;
    margin: 0 auto;
    padding: 100px 44px;
}
.infini-overview::before {
    content: '';
    position: absolute;
    top: 0;
    left: -252px;
    width: 575px;
    height: 575px;
    background-image: url('../images/bg-gold.png');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.25;
    pointer-events: none;
    z-index: 0;
}
.infini-overview .section-title,
.infini-overview .infini-overview__lead,
.infini-overview .infini-overview__stats {
    position: relative;
    z-index: 1;
}
.infini-overview__lead {
    max-width: 760px;
    margin: 0 0 56px;
    font-size: 15px;
    line-height: 2;
    color: #5b616a;
}
.infini-overview__stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.infini-overview__stat {
    position: relative;
    overflow: hidden;
    background: #fff;
    padding: 28px 24px;
    border: 1px solid var(--light-border, #ECEAE2);
    border-radius: 16px;
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1), transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.infini-overview__stats > .infini-overview__stat:nth-child(2) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .07s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.infini-overview__stats > .infini-overview__stat:nth-child(3) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .14s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.infini-overview__stats > .infini-overview__stat:nth-child(4) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .21s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.infini-overview__stat::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--accent, #F0851F), var(--teal, #15BFA8));
}
.infini-overview__stat:nth-child(2n)::before {
    background: linear-gradient(90deg, var(--teal, #15BFA8), var(--accent, #F0851F));
}
.infini-overview__stat-value {
    margin: 0 0 10px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.1;
}
.infini-overview__stat-value small {
    font-size: 14px;
    font-weight: 600;
    margin-left: 2px;
}
.infini-overview__stat-label {
    margin: 0;
    font-size: 12.5px;
    color: #8a8f98;
    letter-spacing: .02em;
}

/* KEY VALUE（共通・下層プロダクト/事業ページ用） */
.svc-value--beige {
    background: #F1EFE7;
}
.svc-value__inner {
    max-width: 1080px;
    margin: 0 auto;
    padding: 100px 44px;
}
.svc-value__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}
.svc-value-card {
    background: #fff;
    border: 1px solid var(--light-border, #ECEAE2);
    border-radius: 18px;
    padding: 36px 30px;
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1), transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.svc-value__grid > .svc-value-card:nth-child(2) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .08s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.svc-value__grid > .svc-value-card:nth-child(3) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .16s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.svc-value-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    margin-bottom: 22px;
    color: var(--dark, #15181D);
}
.svc-value-card__icon svg {
    width: 26px;
    height: 26px;
}
.svc-value-card__icon--square {
    border: 1.6px solid var(--dark, #15181D);
    border-radius: 10px;
}
.svc-value-card__icon--circle {
    border: 1.6px solid var(--teal, #15BFA8);
    border-radius: 50%;
    color: var(--teal, #15BFA8);
}
.svc-value-card__icon--diamond {
    border: 1.6px solid var(--accent, #F0851F);
    border-radius: 10px;
    color: var(--accent, #F0851F);
    transform: rotate(45deg);
}
.svc-value-card__icon--diamond svg {
    transform: rotate(-45deg);
}
.svc-value-card__title {
    margin: 0 0 12px;
    font-size: 18px;
    font-weight: 700;
}
.svc-value-card__text {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.95;
    color: #5b616a;
}

/* CHANNELS（対応チャネル・ダーク帯） */
.infini-channels {
    background: #0E1117;
}
.infini-channels__inner {
    max-width: 1080px;
    margin: 0 auto;
    padding: 80px 44px;
}
.infini-channels__headline {
    margin: 0 0 32px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(20px, 3vw, 28px);
    font-weight: 700;
    color: #fff;
    line-height: 1.5;
}
.infini-channels__headline span {
    color: var(--accent, #F0851F);
}
.infini-channels__headline span.infini-channels__hl--teal {
    color: var(--teal, #15BFA8);
}
.infini-channels__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.infini-channels__tag {
    display: inline-block;
    padding: 9px 20px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, .18);
    font-size: 13px;
    color: rgba(255, 255, 255, .86);
}
.infini-channels__tag--more {
    border-style: dashed;
    color: rgba(255, 255, 255, .5);
}

/* HOW IT WORKS */
.infini-flow {
    background: #F1EFE7;
}
.infini-flow__inner {
    max-width: 1080px;
    margin: 0 auto;
    padding: 100px 44px;
}
.infini-flow__grid {
    display: grid;
    grid-template-columns: 1fr auto 1.15fr auto 1fr;
    align-items: stretch;
    gap: 14px;
}
.infini-flow__step {
    background: #fff;
    border: 1px solid var(--light-border, #ECEAE2);
    border-radius: 16px;
    padding: 30px 26px;
}
.infini-flow__step--core {
    background: #15181D;
    border-color: #15181D;
}
.infini-flow__step-label {
    display: block;
    margin-bottom: 14px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .06em;
    color: var(--accent, #F0851F);
}
.infini-flow__step--core .infini-flow__step-label {
    color: var(--teal, #15BFA8);
}
.infini-flow__step-title {
    margin: 0 0 10px;
    font-size: 17px;
    font-weight: 700;
}
.infini-flow__step--core .infini-flow__step-title {
    color: #fff;
}
.infini-flow__step-text {
    margin: 0;
    font-size: 13px;
    line-height: 1.7;
    color: #5b616a;
}
.infini-flow__step--core .infini-flow__step-text {
    color: rgba(255, 255, 255, .7);
}
.infini-flow__arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 20px;
    color: #c8c4b8;
}

/* FEATURE（ダイナミックパッケージ） */
.infini-feature {
    max-width: 1080px;
    margin: 0 auto;
    padding: 100px 44px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}
.infini-feature__eyebrow {
    margin: 0 0 16px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .14em;
    color: var(--accent, #F0851F);
}
.infini-feature__title {
    margin: 0 0 10px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(24px, 3vw, 30px);
    font-weight: 700;
    letter-spacing: -.01em;
}
.infini-feature__subtitle {
    margin: 0 0 20px;
    font-size: 14.5px;
    font-weight: 700;
    color: var(--teal, #15BFA8);
}
.infini-feature__desc {
    margin: 0;
    font-size: 14.5px;
    line-height: 2;
    color: #5b616a;
}
.infini-feature__shot {
    position: relative;
    aspect-ratio: 4 / 3;
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid var(--light-border, #ECEAE2);
    box-shadow: 0 24px 50px -28px rgba(20, 24, 29, .28);
}
.infini-feature__shot img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* CAPABILITIES */
.infini-capabilities {
    background: #F1EFE7;
}
.infini-capabilities__inner {
    max-width: 1080px;
    margin: 0 auto;
    padding: 100px 44px;
}
.infini-capabilities__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
}
.infini-cap-card {
    background: #fff;
    border: 1px solid var(--light-border, #ECEAE2);
    border-radius: 16px;
    padding: 30px 24px;
}
.infini-cap-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    margin-bottom: 20px;
    border-radius: 50%;
    border: 1.6px solid var(--accent, #F0851F);
    color: var(--accent, #F0851F);
}
.infini-cap-card--teal .infini-cap-card__icon {
    border-color: var(--teal, #15BFA8);
    color: var(--teal, #15BFA8);
}
.infini-cap-card__icon svg {
    width: 20px;
    height: 20px;
}
.infini-cap-card__title {
    margin: 0 0 10px;
    font-size: 15.5px;
    font-weight: 700;
}
.infini-cap-card__text {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.8;
    color: #5b616a;
}

/* SERVICE CTA（共通・下層プロダクト/事業ページ用） */
.svc-cta {
    position: relative;
    background: #0E1117;
    padding: 100px 44px;
    text-align: center;
    overflow: hidden;
}
.svc-cta__inner {
    position: relative;
    z-index: 1;
    max-width: 640px;
    margin: 0 auto;
}
.svc-cta__title {
    margin: 0 0 16px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(24px, 3.4vw, 32px);
    font-weight: 700;
    color: #fff;
}
.svc-cta__text {
    margin: 0 0 34px;
    font-size: 14.5px;
    color: rgba(255, 255, 255, .68);
}
.svc-cta__actions {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}
.svc-cta__btn--outline {
    display: inline-flex;
    align-items: center;
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 600;
    font-size: 16px;
    text-decoration: none;
    padding: 17px 34px;
    border-radius: 999px;
    border: 1.5px solid rgba(255, 255, 255, .34);
    color: #fff;
    transition: border-color .25s, background .25s;
}
.svc-cta__btn--outline:hover {
    border-color: #fff;
    background: rgba(255, 255, 255, .08);
}

/* CAPABILITIES（共通・4カードグリッド／system_development・contact_center_solutions用） */
.svc-capabilities {
    background: #F1EFE7;
}
.svc-capabilities__inner {
    max-width: 1080px;
    margin: 0 auto;
    padding: 100px 44px;
}
.svc-capabilities__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
}
.svc-cap-card {
    background: #fff;
    border: 1px solid var(--light-border, #ECEAE2);
    border-radius: 16px;
    padding: 30px 24px;
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1), transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.svc-capabilities__grid > .svc-cap-card:nth-child(2) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .07s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.svc-capabilities__grid > .svc-cap-card:nth-child(3) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .14s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.svc-capabilities__grid > .svc-cap-card:nth-child(4) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .21s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.svc-cap-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    margin-bottom: 20px;
    border-radius: 50%;
    border: 1.6px solid var(--accent, #F0851F);
    color: var(--accent, #F0851F);
}
.svc-cap-card--teal .svc-cap-card__icon {
    border-color: var(--teal, #15BFA8);
    color: var(--teal, #15BFA8);
}
.svc-cap-card__icon svg {
    width: 20px;
    height: 20px;
}
.svc-cap-card__title {
    margin: 0 0 10px;
    font-size: 15.5px;
    font-weight: 700;
}
.svc-cap-card__text {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.8;
    color: #5b616a;
}

/* ============================================================
   SYSTEM DEVELOPMENT ページ
============================================================ */
/* OVERVIEW */
.sysdev-overview {
    position: relative;
    max-width: 1080px;
    margin: 0 auto;
    padding: 100px 44px;
}
.sysdev-overview::before {
    content: '';
    position: absolute;
    top: 0;
    left: -210px;
    width: 498px;
    height: 498px;
    background-image: url('../images/bg-teal.png');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.25;
    pointer-events: none;
    z-index: 0;
}
.sysdev-overview .section-title,
.sysdev-overview .sysdev-overview__lead,
.sysdev-overview .svc-overview__badges {
    position: relative;
    z-index: 1;
}
.sysdev-overview__lead {
    max-width: 760px;
    margin: 0 0 40px;
    font-size: 15px;
    line-height: 2;
    color: #5b616a;
}
.svc-overview__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}
.svc-overview__badge {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1 1 220px;
    background: #fff;
    padding: 20px 22px;
    border: 1px solid var(--light-border, #ECEAE2);
    border-radius: 14px;
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1), transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.svc-overview__badges > .svc-overview__badge:nth-child(2) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .08s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.svc-overview__badges > .svc-overview__badge:nth-child(3) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .16s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.svc-overview__badge-icon {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1.6px solid var(--accent, #F0851F);
    color: var(--accent, #F0851F);
}
.svc-overview__badge:nth-child(2) .svc-overview__badge-icon {
    border-color: var(--teal, #15BFA8);
    color: var(--teal, #15BFA8);
}
.svc-overview__badge-icon svg {
    width: 20px;
    height: 20px;
}
.svc-overview__badge p {
    margin: 0;
    font-size: 13px;
    line-height: 1.6;
    color: #3a3f47;
}
.svc-overview__badge p small {
    font-size: 11.5px;
    font-weight: 400;
    color: #8a8f98;
}

/* PROCESS（開発の流れ） */
.sysdev-flow {
    background: #F1EFE7;
}
.sysdev-flow__inner {
    max-width: 1080px;
    margin: 0 auto;
    padding: 100px 44px;
}
.sysdev-flow__grid {
    position: relative;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
}
.sysdev-flow__grid::before {
    content: '';
    position: absolute;
    top: 22px;
    left: 10%;
    right: 10%;
    height: 1px;
    background: #ccc;
    z-index: 0;
}
.sysdev-flow__step {
    position: relative;
    z-index: 1;
    text-align: center;
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1), transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.sysdev-flow__grid > .sysdev-flow__step:nth-child(2) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .06s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.sysdev-flow__grid > .sysdev-flow__step:nth-child(3) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .12s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.sysdev-flow__grid > .sysdev-flow__step:nth-child(4) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .18s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.sysdev-flow__grid > .sysdev-flow__step:nth-child(5) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .24s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.sysdev-flow__num {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin: 0 auto 18px;
    border-radius: 50%;
    background: #fff;
    border: 1.6px solid var(--accent, #F0851F);
    color: var(--accent, #F0851F);
    font-family: 'Space Grotesk', sans-serif;
    font-size: 15px;
    font-weight: 700;
}
.sysdev-flow__step:nth-child(2n) .sysdev-flow__num {
    border-color: var(--teal, #15BFA8);
    color: var(--teal, #15BFA8);
}
.sysdev-flow__title {
    margin: 0 0 5px;
    font-size: 15px;
    font-weight: 700;
}
.sysdev-flow__text {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.7;
    color: #5b616a;
}

/* ============================================================
   CONTACT CENTER SOLUTIONS ページ
============================================================ */
/* OVERVIEW */
.ccenter-overview {
    position: relative;
    max-width: 1080px;
    margin: 0 auto;
    padding: 100px 44px;
}
.ccenter-overview::before {
    content: '';
    position: absolute;
    top: 0;
    left: -230px;
    width: 528px;
    height: 528px;
    background-image: url('../images/bg-orange.png');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.25;
    pointer-events: none;
    z-index: 0;
}
.ccenter-overview .section-title,
.ccenter-overview .ccenter-overview__lead,
.ccenter-overview .svc-overview__badges {
    position: relative;
    z-index: 1;
}
.ccenter-overview__lead {
    max-width: 820px;
    margin: 0 0 40px;
    font-size: 15px;
    line-height: 2;
    color: #5b616a;
}

/* PAIN POINTS（こんなお悩み解決） */
.ccenter-pain__inner {
    max-width: 1080px;
    margin: 0 auto;
    padding: 100px 44px;
}
.ccenter-pain__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}
.ccenter-pain-card {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 26px 24px;
    border: 1px solid var(--light-border, #ECEAE2);
    border-radius: 14px;
    background: #fff;
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1), transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.ccenter-pain__grid > .ccenter-pain-card:nth-child(2) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .07s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.ccenter-pain__grid > .ccenter-pain-card:nth-child(3) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .14s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.ccenter-pain__grid > .ccenter-pain-card:nth-child(4) {
    transition: opacity .8s cubic-bezier(.16, 1, .3, 1) .21s, transform .35s cubic-bezier(.16, 1, .3, 1), filter .8s cubic-bezier(.16, 1, .3, 1);
}
.ccenter-pain-card__mark {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--accent, #F0851F);
    color: #fff;
}
.ccenter-pain-card__mark svg {
    width: 16px;
    height: 16px;
}
.ccenter-pain-card:nth-child(2n) .ccenter-pain-card__mark {
    background: var(--teal, #15BFA8);
}
.ccenter-pain-card__text {
    margin: 3px 0 0;
    font-size: 14px;
    line-height: 1.8;
    color: #3a3f47;
}

/* ============================================================
   INQUIRY セクション（お問い合わせフォーム）
============================================================ */
.inquiry {
    position: relative;
    max-width: 720px;
    margin: 0 auto;
    padding: 100px 44px 140px;
    overflow: visible;
}
.inquiry::before {
    content: '';
    position: absolute;
    top: 0px;
    left: -300px;
    width: 600px;
    height: 500px;
    background-image: url('../images/logo_xl.png');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 0.1;
    pointer-events: none;
    z-index: 0;
}
.inquiry__lead,
.inquiry-form,
.form-errors,
.form-success {
    position: relative;
    z-index: 1;
}
.inquiry__lead {
    margin: 0 0 48px;
    font-size: 15px;
    line-height: 2;
    color: #5b616a;
}
.form-errors {
    margin: 0 0 32px;
    padding: 18px 22px;
    background: #FFF4ED;
    border: 1px solid rgba(240, 133, 31, .35);
    border-radius: 12px;
    color: #a24d0a;
    font-size: 13.5px;
    line-height: 1.9;
}
.form-errors ul {
    margin: 0;
    padding-left: 18px;
}
.form-success {
    text-align: center;
    padding: 60px 20px;
    border: 1px solid var(--light-border, #ECEAE2);
    border-radius: 18px;
    background: #fff;
}
.form-success__title {
    margin: 0 0 14px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 24px;
    font-weight: 700;
    color: #15181D;
}
.form-success__text {
    margin: 0 0 30px;
    font-size: 14.5px;
    line-height: 1.9;
    color: #5b616a;
}
.inquiry-form {
    display: flex;
    flex-direction: column;
    gap: 26px;
}
.form-group {
    display: flex;
    flex-direction: column;
    gap: 9px;
}
.form-group label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: #15181D;
    letter-spacing: .02em;
}
.form-required {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--accent, #F0851F);
    color: #fff;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .04em;
}
.form-optional {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    background: #EFEDE5;
    color: #8a8f98;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 10.5px;
    font-weight: 600;
}
.inquiry-form input[type="text"],
.inquiry-form input[type="email"],
.inquiry-form input[type="tel"],
.inquiry-form select,
.inquiry-form textarea {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid var(--light-border, #ECEAE2);
    border-radius: 10px;
    background: #fff;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 14.5px;
    color: #15181D;
    transition: border-color .2s, box-shadow .2s;
}
.inquiry-form input:focus,
.inquiry-form select:focus,
.inquiry-form textarea:focus {
    outline: none;
    border-color: var(--accent, #F0851F);
    box-shadow: 0 0 0 3px rgba(240, 133, 31, .12);
}
.inquiry-form textarea {
    min-height: 170px;
    resize: vertical;
    font-family: inherit;
}
.inquiry-form select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238a8f98' stroke-width='1.5' fill='none' fill-rule='evenodd'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    padding-right: 40px;
}
.form-checkbox {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 20px;
    background: #FAFAF7;
    border: 1px solid var(--light-border, #ECEAE2);
    border-radius: 14px;
    font-size: 13.5px;
    line-height: 1.8;
    color: #5b616a;
    transition: border-color .2s, background .2s;
}
.form-checkbox:has(input:checked) {
    border-color: rgba(21, 191, 168, .35);
    background: linear-gradient(135deg, rgba(240, 133, 31, .07), rgba(21, 191, 168, .07));
}
.form-checkbox input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    flex: none;
    width: 22px;
    height: 22px;
    margin-top: 1px;
    border: 1.5px solid rgba(20, 24, 29, .25);
    border-radius: 7px;
    background: #fff;
    position: relative;
    cursor: pointer;
    transition: background .2s, border-color .2s, transform .15s;
}
.form-checkbox input[type="checkbox"]:hover {
    border-color: var(--accent, #F0851F);
}
.form-checkbox input[type="checkbox"]:active {
    transform: scale(.92);
}
.form-checkbox input[type="checkbox"]:checked {
    background: linear-gradient(135deg, var(--accent, #F0851F), var(--teal, #15BFA8));
    border-color: transparent;
}
.form-checkbox input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    left: 7px;
    top: 3px;
    width: 5px;
    height: 10px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.form-checkbox input[type="checkbox"]:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(240, 133, 31, .25);
}
.form-checkbox a {
    color: var(--accent, #F0851F);
    text-decoration: underline;
    font-weight: 600;
}
.btn-submit {
    align-self: center;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 600;
    font-size: 16px;
    color: #fff;
    background: linear-gradient(135deg, var(--accent, #F0851F), var(--teal, #15BFA8));
    border: none;
    cursor: pointer;
    padding: 17px 40px;
    border-radius: 999px;
    box-shadow: 0 14px 30px -12px rgba(21, 191, 168, .45);
    transition: transform .25s, box-shadow .25s;
}
.btn-submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 20px 38px -12px rgba(21, 191, 168, .55);
}

/* ============================================================
   TOPICS LIST / DETAIL ページ
============================================================ */
.topics-list {
    max-width: 1240px;
    margin: 0 auto;
    padding: 100px 44px 140px;
}
.topics-list__empty {
    text-align: center;
    padding: 60px 20px;
    color: #8a8f98;
    font-size: 14.5px;
}
.topic-detail {
    max-width: 760px;
    margin: 0 auto;
    padding: 100px 44px 140px;
}
.topic-detail__meta {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
}
.topic-detail__title {
    margin: 0 0 36px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(24px, 4vw, 34px);
    font-weight: 700;
    line-height: 1.55;
    letter-spacing: -.01em;
    color: #15181D;
}
.topic-detail__image {
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 44px;
    aspect-ratio: 16 / 9;
    background: repeating-linear-gradient(135deg, #E9E6DD 0 11px, #F2F0E9 11px 22px);
}
.topic-detail__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.topic-detail__body {
    font-size: 15.5px;
    line-height: 2.1;
    color: #3a3f47;
}
.topic-detail__body p {
    margin: 0 0 26px;
}
.topic-detail__body p:last-child {
    margin-bottom: 0;
}
.topic-detail__body a {
    color: var(--accent, #F0851F);
    text-decoration: underline;
}
.topic-detail__back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 56px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: #15181D;
    text-decoration: none;
    transition: gap .25s, color .25s;
}
.topic-detail__back:hover {
    gap: 12px;
    color: var(--accent, #F0851F);
}
.topic-not-found {
    max-width: 600px;
    margin: 0 auto;
    padding: 100px 44px 160px;
    text-align: center;
}
.topic-not-found p {
    font-size: 15px;
    line-height: 2;
    color: #5b616a;
}
.topic-not-found a {
    color: var(--accent, #F0851F);
    font-weight: 600;
}

/* ============================================================
   JOIN US（採用情報）
============================================================ */
.join-us {
    max-width: 1000px;
    margin: 0 auto;
    padding: 100px 44px 140px;
}
.join-us__notice {
    text-align: center;
    padding: 56px 40px;
    border: 1px solid var(--light-border, #ECEAE2);
    border-radius: 18px;
    background: #FAFAF7;
    margin-bottom: 100px;
}
.join-us__notice-title {
    margin: 0 0 16px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: #15181D;
}
.join-us__notice-text {
    margin: 0;
    font-size: 14.5px;
    line-height: 2;
    color: #5b616a;
}
.join-us__lead {
    margin: 0 0 40px;
    font-size: 14.5px;
    line-height: 2;
    color: #5b616a;
}
.join-us__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-bottom: 90px;
}
.recruit-card {
    position: relative;
    background: #fff;
    border: 1px solid var(--light-border, #ECEAE2);
    border-radius: 18px;
    padding: 34px 28px 30px;
}
.recruit-card__badge {
    display: inline-flex;
    align-items: center;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    color: #8a8f98;
    background: #F1EFE7;
    border-radius: 999px;
    padding: 5px 14px;
    margin-bottom: 22px;
}
.recruit-card__title {
    margin: 22px 0 12px;
    font-size: 19px;
    font-weight: 700;
}
.recruit-card__description {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.95;
    color: #5b616a;
}
.join-us__cta {
    text-align: center;
    padding-top: 60px;
    border-top: 1px solid var(--light-border, #ECEAE2);
}
.join-us__cta p {
    margin: 0 0 24px;
    font-size: 14.5px;
    color: #5b616a;
}

/* ============================================================
   POLICY（プライバシーポリシー等・規約系ページ共通）
============================================================ */
.policy {
    max-width: 840px;
    margin: 0 auto;
    padding: 100px 44px 140px;
    font-size: 15px;
    line-height: 2;
    color: #3a3f47;
}
.policy h2 {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: #15181D;
    margin: 56px 0 20px;
}
.policy h2:first-child {
    margin-top: 0;
}
.policy h3 {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: #15181D;
    margin: 40px 0 16px;
}
.policy p {
    margin: 0 0 20px;
}
.policy ul {
    list-style: none;
    margin: 0 0 32px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.policy ul.policy__sublist {
    margin: 16px 0 0;
    padding-left: 4px;
}
.policy ul li p {
    margin: 0;
}
.policy ul li strong {
    display: block;
    color: #15181D;
    font-weight: 700;
    margin-bottom: 4px;
}
.policy a {
    color: var(--accent, #F0851F);
    text-decoration: underline;
}
.policy__updated {
    margin: 40px 0 56px;
    font-size: 14px;
    color: #5b616a;
}
.policy__signature {
    margin: 0;
}
.policy__contact {
    margin: 0 0 56px;
    padding: 28px 32px;
    background: #FAFAF7;
    border: 1px solid var(--light-border, #ECEAE2);
    border-radius: 14px;
    font-size: 14.5px;
    line-height: 1.9;
}
.policy__contact p {
    margin: 0;
}

/* ============================================================
   レスポンシブ対応（画面幅の大きい順にまとめて最後に配置）
============================================================ */
/* タブレット端末向け */
@media (max-width: 1024px) {
    /* タブレット幅ではヘッダーナビに収まりきらないためTopicsのみ非表示（スマホはハンバーガーメニュー側のTopicsで代替） */
    .header__nav-link[data-nav-target="topics"] {
        display: none !important;
    }
    .businesses,
    .topics,
    .partners,
    .services,
    .contact,
    .overview,
    .greeting,
    .history,
    .inquiry,
    .topics-list,
    .topic-detail,
    .join-us,
    .policy,
    .infini-overview,
    .svc-value__inner,
    .infini-channels__inner,
    .infini-flow__inner,
    .infini-feature,
    .infini-capabilities__inner,
    .svc-capabilities__inner,
    .sysdev-overview,
    .sysdev-flow__inner,
    .ccenter-overview,
    .ccenter-pain__inner,
    .svc-cta {
        padding-left: 28px !important;
        padding-right: 28px !important;
    }
    .businesses::before {
        display: none;
    }
    .businesses__grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .topics__grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .services__row {
        grid-template-columns: 1fr !important;
        gap: 26px !important;
    }
    .services__item-img {
        order: 2 !important;
    }
    .services__item-text {
        order: 1 !important;
    }
    .join-us__grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    /* INFINI：タブレット対応 */
    .infini-overview__stats {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .svc-value__grid {
        grid-template-columns: 1fr !important;
    }
    .infini-flow__grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }
    .infini-flow__arrow {
        display: none !important;
    }
    .infini-feature {
        grid-template-columns: 1fr !important;
        gap: 32px !important;
    }
    .infini-capabilities__grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .svc-capabilities__grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    /* SYSTEM DEVELOPMENT：タブレットはPCと同じ横並び5列を維持（幅が足りるため） */
    .sysdev-flow__grid {
        gap: 14px !important;
    }
    /* CONTACT CENTER SOLUTIONS：タブレット対応 */
    .ccenter-pain__grid {
        grid-template-columns: 1fr !important;
    }
}
/* タブレット〜スマホ境目（page-hero__ringのサイズ調整） */
@media (max-width: 768px) {
    .page-hero__ring {
        width: 300px;
        height: 300px;
        top: -100px;
        right: -90px;
    }
}
/* スマートフォン向け */
@media (max-width: 640px) {
    .header {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }
    .header__nav-link {
        display: none !important;
    }
    .header__cta {
        display: none !important;
    }
    [data-burger] {
        display: flex !important;
    }
    .hero {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    /* 下層ページ・TOP各セクション共通：モバイル時の上下左右パディング */
    .businesses,
    .topics,
    .partners,
    .services,
    .contact,
    .overview,
    .greeting,
    .history,
    .inquiry,
    .topics-list,
    .topic-detail,
    .join-us,
    .policy,
    .infini-overview,
    .svc-value__inner,
    .infini-channels__inner,
    .infini-flow__inner,
    .infini-feature,
    .infini-capabilities__inner,
    .svc-capabilities__inner,
    .sysdev-overview,
    .sysdev-flow__inner,
    .ccenter-overview,
    .ccenter-pain__inner,
    .svc-cta {
        padding-top: 78px !important;
        padding-bottom: 78px !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    .businesses::before {
        display: block;
    }
    .businesses__grid {
        grid-template-columns: 1fr !important;
    }
    .topics__grid {
        grid-template-columns: 1fr !important;
    }
    .join-us__grid {
        grid-template-columns: 1fr !important;
    }
    .join-us__notice {
        padding: 40px 24px !important;
    }
    .partners__header {
        padding: 0;
    }
    .contact__cards {
        grid-template-columns: 1fr !important;
    }
    .footer {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    .overview-table__row,
    .greeting__body {
        grid-template-columns: 1fr !important;
    }
    .greeting__photo {
        max-width: 220px;
    }
    .page-hero {
        padding: 140px 20px 60px !important;
    }
    .history__list::before {
        left: 90px;
    }
    .history__item {
        grid-template-columns: 90px 1fr !important;
        padding-left: 20px !important;
    }
    .history__item::before {
        left: 86px;
    }
    /* GREETING（下層ページ・about_us） */
    .greeting__catch {
        white-space: normal;
        font-size: clamp(15px, 4vw, 18px);
        line-height: 1.5;
    }
    .greeting__photo {
        aspect-ratio: 1;
    }
    .greeting__photo img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    /* INFINI（スマートフォン向け） */
    .infini-overview__stats {
        grid-template-columns: 1fr !important;
    }
    .svc-value-card {
        padding: 28px 24px !important;
    }
    .infini-flow__step {
        padding: 24px 22px !important;
    }
    .infini-capabilities__grid {
        grid-template-columns: 1fr !important;
    }
    .svc-cta__actions {
        flex-direction: column;
        align-items: stretch;
    }
    .svc-cta__actions .hero__cta,
    .svc-cta__btn--outline {
        justify-content: center;
    }
    .svc-capabilities__grid {
        grid-template-columns: 1fr !important;
    }
    /* SYSTEM DEVELOPMENT・CONTACT CENTER SOLUTIONS（スマートフォン向け） */
    .svc-overview__badge {
        flex: 1 1 100%;
    }
    /* PROCESS：スマホのみ縦積み（タブレット以上はPCと同じ横並びを維持） */
    .sysdev-flow__grid {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }
    .sysdev-flow__grid::before {
        display: none;
    }
    .sysdev-flow__step {
        display: grid;
        grid-template-columns: auto 1fr;
        column-gap: 12px;
        row-gap: 2px;
        align-items: center;
        text-align: left;
    }
    .sysdev-flow__num {
        grid-row: 1 / 3;
        grid-column: 1;
        margin: 0;
    }
    .sysdev-flow__title {
        grid-column: 2;
        grid-row: 1;
        margin: 0;
    }
    .sysdev-flow__text {
        grid-column: 2;
        grid-row: 2;
    }
    /* CONTACT CENTER SOLUTIONS（スマートフォン向け） */
    .ccenter-pain-card {
        padding: 22px 20px;
    }
}