@charset "utf-8";

/*============================
#businessMainVisual
============================*/

#businessMainVisual { --gutter: clamp(1.25rem, 4vw, 3.5rem); position: relative; padding: var(--space-xl) 0 0; overflow: hidden; background: linear-gradient(180deg, var(--color-white) 0%, var(--color-bg) 100%); }
#businessMainVisual::before { content: ""; position: absolute; top: 0; right: 0; width: 48%; height: 72%; background: var(--bg-dots) 0 0 / 1.375rem 1.375rem; mask-image: linear-gradient(200deg, var(--color-black) 0%, transparent 70%); pointer-events: none; }
#businessMainVisual .inner { position: relative; }
#businessMainVisual .grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 27rem); align-items: end; gap: 4rem; margin-top: 3rem; padding-bottom: 3.5rem; }
#businessMainVisual .en { font-family: Inter, sans-serif; font-size: clamp(3.5rem, 2rem + 4.6vw, 6.5rem); font-weight: 500; line-height: 1; letter-spacing: -.025em; color: var(--color-text); }
#businessMainVisual .title { display: flex; align-items: center; gap: var(--space-md); margin-top: 1.75rem; font-size: clamp(1rem, .9rem + .4vw, 1.25rem); font-weight: 700; line-height: 1.6; letter-spacing: .14em; color: var(--color-text); }
#businessMainVisual .title::before { content: ""; flex-shrink: 0; width: 2.5rem; height: 2px; background: var(--grad-main); }
#businessMainVisual .catch { font-size: var(--fs-lg); font-weight: 700; line-height: 1.8; letter-spacing: .04em; color: var(--color-text); }
#businessMainVisual .lead { margin-top: var(--space-sm); font-size: var(--fs-base); line-height: 2; color: var(--color-textSub); }
#businessMainVisual .visual { position: relative; height: clamp(18rem, 30vw, 28rem); margin: 0 0 0 max(var(--gutter), calc((100% - var(--container-width)) / 2 + var(--gutter))); overflow: hidden; }
#businessMainVisual .visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(30, 42, 85, .18) 0%, rgba(51, 170, 221, .12) 60%, rgba(85, 102, 221, .2) 100%); mix-blend-mode: multiply; pointer-events: none; }
#businessMainVisual .image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 15%; }
#businessMainVisual .caption { position: absolute; right: var(--space-sm); bottom: var(--space-sm); z-index: 1; padding: .2rem .6rem; border-radius: .25rem; background: rgba(15, 26, 46, .6); font-size: var(--fs-xxs); line-height: 1.6; color: var(--color-white); }

/*============================
#businessNeeds
============================*/

#businessNeeds { padding: var(--space-section) 0; background: var(--bg-dots) 0 0 / 1.375rem 1.375rem, var(--color-white); }
#businessNeeds .list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-lg); }
#businessNeeds .card { --accent: var(--grad-main); position: relative; overflow: hidden; padding: 2.25rem 2rem 1.75rem; border: 1px solid var(--color-border); border-radius: 1.25rem; background: var(--color-white); box-shadow: var(--shadow-card); }
#businessNeeds .card::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: var(--accent); }
#businessNeeds .card02 { --accent: linear-gradient(120deg, var(--color-indigo) 0%, var(--color-violet) 100%); }
#businessNeeds .card03 { --accent: var(--grad-yellow); }
#businessNeeds .symbol { display: grid; place-content: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; background: var(--accent); box-shadow: 0 12px 20px -12px rgba(30, 42, 85, .6); }
#businessNeeds .icon { width: 1.625rem; height: 1.625rem; fill: none; stroke: var(--color-white); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
#businessNeeds .quote { position: absolute; top: .5rem; right: 1.5rem; font-family: Georgia, serif; font-size: 6rem; line-height: 1; color: var(--color-sky); }
#businessNeeds .title { position: relative; margin-top: var(--space-lg); font-size: var(--fs-xl); font-weight: 700; line-height: 1.6; letter-spacing: .04em; color: var(--color-text); }
#businessNeeds .text { margin-top: var(--space-sm); font-size: var(--fs-base); line-height: 1.9; color: var(--color-textSub); }
#businessNeeds .who { display: flex; align-items: center; gap: var(--space-xs); margin-top: var(--space-lg); padding-top: var(--space-md); border-top: 1px dashed var(--color-border); font-size: var(--fs-sm); line-height: 1.6; color: var(--color-textSub); }
#businessNeeds .whoIcon { display: grid; place-content: center; width: 1.75rem; height: 1.75rem; border-radius: .4rem; background: var(--color-sky); font-weight: 700; color: var(--color-blueDark); }
#businessNeeds .answer { position: relative; margin-top: 4.5rem; padding: 2.75rem var(--space-xl) 2.5rem; border-radius: 1.25rem; background: var(--bg-hexWhite) 0 0 / 3.5rem 6.0625rem repeat, var(--grad-main); text-align: center; color: var(--color-white); box-shadow: 0 30px 50px -30px rgba(85, 102, 221, .9); }
#businessNeeds .arrow { position: absolute; top: -1.5rem; left: 50%; width: 3rem; height: 3rem; border: 3px solid var(--color-blueLight); border-radius: 50%; background: var(--color-white); transform: translateX(-50%); box-shadow: 0 8px 16px -8px rgba(30, 42, 85, .5); }
#businessNeeds .arrow::before { content: ""; position: absolute; top: .6rem; left: 50%; width: .75rem; height: .75rem; border-right: 3px solid var(--color-blueDark); border-bottom: 3px solid var(--color-blueDark); transform: translateX(-50%) rotate(45deg); }
#businessNeeds .label { font-family: Inter, sans-serif; font-size: var(--fs-xs); font-weight: 700; letter-spacing: .26em; color: var(--color-whiteSoft); }
#businessNeeds .message { margin-top: var(--space-xs); font-size: clamp(1.125rem, .9rem + .9vw, 1.5rem); font-weight: 700; line-height: 1.8; letter-spacing: .04em; }
#businessNeeds .card { display: flex; flex-direction: column; }
#businessNeeds .who { margin-top: auto; }
#businessNeeds .text { margin-bottom: var(--space-lg); }

/*============================
#businessComparison
============================*/

#businessComparison { padding: var(--space-section) 0; background: var(--bg-hex) 0 0 / 3.5rem 6.0625rem repeat, var(--grad-soft); }
#businessComparison .board { display: grid; grid-template-columns: minmax(0, 1fr) 4.5rem minmax(0, 1fr); align-items: stretch; }
#businessComparison .panel { overflow: hidden; border-radius: 1.25rem; background: var(--color-white); box-shadow: var(--shadow-card); }
#businessComparison .before { background: var(--color-gray); box-shadow: none; }
#businessComparison .head { padding: .875rem; background: var(--color-grayLine); font-size: var(--fs-base); font-weight: 700; line-height: 1.6; letter-spacing: .3em; text-align: center; color: var(--color-textSub); }
#businessComparison .after .head { background: var(--grad-main); color: var(--color-white); }
#businessComparison .after { outline: 2px solid var(--color-blueLight); outline-offset: -2px; }
#businessComparison .list { padding: var(--space-xs) var(--space-xl); }
#businessComparison .item { display: grid; grid-template-columns: 3.25rem minmax(0, 1fr); align-items: center; gap: 1.25rem; padding: var(--space-lg) 0; border-bottom: 1px dotted var(--color-border); }
#businessComparison .item:last-child { border-bottom: 0; }
#businessComparison .symbol { display: grid; place-content: center; width: 3.25rem; height: 3.25rem; border-radius: 50%; background: var(--color-grayLine); }
#businessComparison .after .symbol { background: var(--color-sky); }
#businessComparison .icon { width: 1.5rem; height: 1.5rem; fill: none; stroke: var(--color-textFaint); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
#businessComparison .after .icon { stroke: var(--color-blueDark); }
#businessComparison .title { display: block; font-size: var(--fs-lg); font-weight: 700; line-height: 1.6; color: var(--color-textSub); }
#businessComparison .after .title { color: var(--color-text); }
#businessComparison .text { display: block; margin-top: .25rem; font-size: var(--fs-md); line-height: 1.8; color: var(--color-textSub); }
#businessComparison .arrow { display: flex; align-items: center; justify-content: center; }
#businessComparison .chevron { width: .875rem; height: .875rem; translate: .075rem 0; border-top: 3px solid var(--color-blueLight); border-right: 3px solid var(--color-blueLight); transform: rotate(45deg); animation: svcBlink 1.6s ease-in-out infinite; }
#businessComparison .chevron:nth-child(2) { translate: -.075rem 0; animation-delay: .2s; }
#businessComparison .chevron:nth-child(3) { translate: -.225rem 0; animation-delay: .4s; }

/*============================
#businessFeatures
============================*/

#businessFeatures { padding: var(--space-section) 0; background: var(--bg-dots) 0 0 / 1.375rem 1.375rem, linear-gradient(180deg, var(--color-white) 0%, var(--color-bg) 100%); }
#businessFeatures .list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-md); }
#businessFeatures .card { padding: 1.375rem 1.5rem; border: 1px solid var(--color-border); border-top: 3px solid transparent; border-image: none; border-radius: 1rem; background: linear-gradient(var(--color-white), var(--color-white)) padding-box, var(--grad-main) border-box; box-shadow: var(--shadow-card); }
#businessFeatures .title { display: flex; align-items: center; gap: .75rem; font-size: var(--fs-lg); font-weight: 700; line-height: 1.5; color: var(--color-text); }
#businessFeatures .num { flex-shrink: 0; display: grid; place-content: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: var(--grad-main); font-family: Inter, sans-serif; font-size: var(--fs-sm); font-weight: 700; color: var(--color-white); }
#businessFeatures .text { margin-top: .5rem; padding-left: 3rem; font-size: var(--fs-md); line-height: 1.8; color: var(--color-textSub); }


/*============================
#businessProcess
============================*/

#businessProcess { position: relative; padding: var(--space-section) 0; overflow: hidden; background: var(--bg-hex) 0 0 / 3.5rem 6.0625rem repeat, var(--grad-soft); }
#businessProcess .overview { display: grid; grid-template-columns: minmax(0, 1fr) 21rem; align-items: center; gap: 4rem; }
#businessProcess .intro .md_secHead { margin-bottom: var(--space-xl); }
#businessProcess .text { font-size: var(--fs-base); line-height: 2.1; color: var(--color-text); }
#businessProcess .em { font-weight: 700; color: var(--color-blueDark); }
#businessProcess .cycle { position: relative; width: 100%; aspect-ratio: 1; margin: 0 auto; }
#businessProcess .ring { position: absolute; inset: 0; width: 100%; height: 100%; }
#businessProcess .track { fill: none; stroke: rgba(85, 102, 221, .2); stroke-width: 2; }
#businessProcess .flow { fill: none; stroke: var(--color-yellow); stroke-width: 4; stroke-linecap: round; transform-origin: 50% 50%; animation: svcSpin 30s linear infinite; }
#businessProcess .core { display: grid; place-content: center; position: absolute; inset: 34%; border-radius: 50%; background: radial-gradient(circle at 30% 25%, var(--color-yellowLight) 0%, var(--color-orange) 100%); font-size: var(--fs-lg); font-weight: 700; line-height: 1.5; text-align: center; color: var(--color-navy); box-shadow: 0 0 0 .75rem rgba(255, 255, 255, .6), 0 20px 40px -16px rgba(245, 166, 35, .8); }
#businessProcess .node { display: grid; justify-items: center; align-content: center; position: absolute; width: 6.25rem; height: 6.25rem; border-radius: 50%; background: var(--color-white); font-size: var(--fs-sm); font-weight: 700; line-height: 1.4; text-align: center; color: var(--color-text); box-shadow: 0 14px 26px -14px rgba(30, 42, 85, .6); transform: translate(-50%, -50%); }
#businessProcess .node01 { top: 8%; left: 50%; }
#businessProcess .node02 { top: 50%; left: 92%; }
#businessProcess .node03 { top: 92%; left: 50%; }
#businessProcess .node04 { top: 50%; left: 8%; }
#businessProcess .nodeSymbol { margin-bottom: .25rem; }
#businessProcess .icon { width: 1.5rem; height: 1.5rem; fill: none; stroke: var(--color-blueDark); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
#businessProcess .chart { display: grid; grid-template-columns: 7.5rem 1.25rem 7.5rem 1.25rem minmax(0, 1fr) 1.25rem 8.5rem; align-items: stretch; margin-top: 3rem; }
#businessProcess .step { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-sm); padding: 1rem .75rem; border: 1px solid var(--color-border); border-radius: 1rem; background: var(--color-white); box-shadow: var(--shadow-card); }
#businessProcess .stepStart { border-color: transparent; background: var(--grad-navy); color: var(--color-white); }
#businessProcess .stepStart .icon { stroke: var(--color-yellow); }
#businessProcess .stepLabel { font-size: var(--fs-sm); font-weight: 700; line-height: 1.6; letter-spacing: .04em; text-align: center; }
#businessProcess .stepGoal { border-color: transparent; background: var(--grad-main); text-align: center; color: var(--color-white); }
#businessProcess .stepGoal .icon { stroke: var(--color-white); }
#businessProcess .stepGoal .stepLabel { font-size: var(--fs-sm); letter-spacing: .04em; writing-mode: horizontal-tb; }
#businessProcess .goal { display: block; margin-bottom: .25rem; font-size: var(--fs-xl); letter-spacing: .1em; }
#businessProcess .arrow { align-self: center; justify-self: center; width: .875rem; height: .875rem; border-top: 3px solid var(--color-blueLight); border-right: 3px solid var(--color-blueLight); transform: rotate(45deg); }
#businessProcess .themes { display: grid; grid-template-columns: var(--space-lg) minmax(0, 1fr) var(--space-lg); padding: 0 0 var(--space-lg); overflow: hidden; border: 2px solid var(--color-blueLight); border-radius: 1.25rem; background: var(--color-white); box-shadow: 0 0 0 .4rem rgba(51, 170, 221, .16), 0 24px 40px -26px rgba(63, 95, 201, .6); }
#businessProcess .themes > * { grid-column: 2; }
#businessProcess .themesHead { grid-column: 1 / -1; padding: .625rem; background: var(--grad-main); font-size: var(--fs-base); font-weight: 700; line-height: 1.6; letter-spacing: .16em; text-align: center; color: var(--color-white); }
#businessProcess .themeList { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; margin-top: .875rem; }
#businessProcess .theme { display: grid; grid-template-columns: 2rem minmax(0, 1fr); align-items: center; gap: .625rem; padding: .5rem .625rem; border: 1px solid var(--color-border); border-radius: .75rem; background: var(--color-bg); }
#businessProcess .themeSymbol { display: grid; place-content: center; width: 2rem; height: 2rem; border-radius: 50%; background: var(--color-sky); }
#businessProcess .themeSymbol .icon { width: 1.25rem; height: 1.25rem; }
#businessProcess .themeName { display: block; font-size: var(--fs-md); font-weight: 700; line-height: 1.4; color: var(--color-text); }
#businessProcess .themeText { display: block; margin-top: .1rem; font-size: var(--fs-xxs); line-height: 1.5; color: var(--color-textSub); }
#businessProcess .themeExtra { border: 1px dashed var(--color-blueLight); background: transparent; }
#businessProcess .plus { display: grid; place-content: center; width: 2rem; height: 2rem; font-size: 1.75rem; font-weight: 700; line-height: 1; color: var(--color-orange); }
#businessProcess .themesNote { margin-top: var(--space-sm); font-size: var(--fs-xs); line-height: 1.6; color: var(--color-blueDark); }
#businessProcess .themesDown { display: block; width: 1.125rem; height: 1.125rem; margin: var(--space-xs) auto 0; border-right: 3px solid var(--color-blueLight); border-bottom: 3px solid var(--color-blueLight); transform: rotate(45deg); }
#businessProcess .themesDesign { margin-top: var(--space-sm); padding: .625rem var(--space-md); border-radius: .75rem; background: var(--grad-yellow); font-size: var(--fs-md); font-weight: 700; line-height: 1.6; text-align: center; color: var(--color-navy); }
@keyframes svcSpin { to { transform: rotate(360deg); } }
@keyframes svcBlink { 0%, 100% { opacity: .25; } 50% { opacity: 1; } }

/*============================
#businessFlow
============================*/

#businessFlow { padding: var(--space-section) 0; background: var(--bg-dots) 0 0 / 1.375rem 1.375rem, var(--color-white); }
#businessFlow .list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3rem; }
#businessFlow .item { --accent: var(--color-blueLight); position: relative; padding: var(--space-lg) 1.25rem; border-top: 4px solid var(--accent); border-radius: 1rem; background: var(--color-white); box-shadow: var(--shadow-card); }
#businessFlow .item:nth-child(2) { --accent: var(--color-blue); }
#businessFlow .item:nth-child(3) { --accent: var(--color-indigo); }
#businessFlow .item:nth-child(4) { --accent: var(--color-yellow); }
#businessFlow .item:not(:last-child)::after { content: ""; position: absolute; top: 50%; right: -1.85rem; z-index: 1; width: .6rem; height: .6rem; border-top: 2px solid var(--color-indigo); border-right: 2px solid var(--color-indigo); transform: translateY(-50%) rotate(45deg); }
#businessFlow .num { display: block; font-family: Inter, sans-serif; font-size: var(--fs-xs); font-weight: 700; letter-spacing: .16em; color: var(--accent); }
#businessFlow .title { display: block; margin-top: var(--space-xs); font-size: 1.125rem; font-weight: 700; line-height: 1.6; color: var(--color-text); }
#businessFlow .text { display: block; margin-top: var(--space-xs); font-size: 1rem; line-height: 1.8; color: var(--color-textSub); }

/*============================
#businessExamples
============================*/

#businessExamples { position: relative; padding: var(--space-section) 0; overflow: hidden; background: radial-gradient(60% 50% at 90% 0%, rgba(51, 170, 221, .35) 0%, transparent 70%), radial-gradient(50% 45% at 0% 100%, rgba(138, 108, 240, .3) 0%, transparent 70%), var(--grad-navy); color: var(--color-white); }
#businessExamples .deco { position: absolute; inset: 0; background: var(--bg-hexWhite) 0 0 / 3.5rem 6.0625rem repeat; pointer-events: none; }
#businessExamples .md_container { position: relative; }
#businessExamples .md_secLabel { color: var(--color-yellow); }
#businessExamples .md_secNum { background: var(--grad-yellow); color: var(--color-navy); }
#businessExamples .md_title { color: var(--color-white); }
#businessExamples .list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.75rem; }
#businessExamples .card { --accent: var(--color-blueLight); --accentGrad: var(--grad-main); position: relative; overflow: hidden; padding: var(--space-xl); border: 1px solid var(--color-glassLine); border-radius: 1.25rem; background: var(--color-glass); }
#businessExamples .card::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: var(--accentGrad); }
#businessExamples .card02 { --accent: var(--color-teal); --accentGrad: linear-gradient(120deg, var(--color-blueLight) 0%, var(--color-teal) 100%); }
#businessExamples .card03 { --accent: var(--color-yellow); --accentGrad: var(--grad-yellow); }
#businessExamples .card04 { --accent: var(--color-violet); --accentGrad: linear-gradient(120deg, var(--color-indigo) 0%, var(--color-violet) 100%); }
#businessExamples .head { display: flex; align-items: center; gap: 1.25rem; }
#businessExamples .num { background: var(--accentGrad); -webkit-background-clip: text; background-clip: text; font-family: Inter, sans-serif; font-size: 3rem; font-weight: 700; line-height: 1; color: transparent; }
#businessExamples .tag { font-family: Inter, sans-serif; font-size: var(--fs-xxs); font-weight: 700; letter-spacing: .18em; color: var(--accent); }
#businessExamples .title { margin-top: .25rem; font-size: var(--fs-xl); font-weight: 700; line-height: 1.5; color: var(--color-white); }
#businessExamples .case { margin-top: 1.25rem; padding: .875rem var(--space-md); border-radius: .75rem; background: var(--color-glass); font-size: var(--fs-md); line-height: 1.8; color: var(--color-whiteSoft); }
#businessExamples .caseLabel { display: inline-block; margin-right: var(--space-sm); padding: .1rem .6rem; border-radius: 999px; background: var(--color-yellow); font-size: var(--fs-xxs); font-weight: 700; line-height: 1.6; color: var(--color-navy); }
#businessExamples .other { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--space-sm); margin-top: 2.5rem; }
#businessExamples .docLink { margin-top: 2.5rem; text-align: center; }
#businessExamples .docLink .link { display: inline-flex; align-items: center; gap: .5rem; font-size: var(--fs-md); font-weight: 700; color: var(--color-yellow); text-decoration: none; }
#businessExamples .docLink .arrow { font-family: Inter, sans-serif; transition: transform .25s; }
#businessExamples .docLink .link:hover .arrow { transform: translateY(3px); }
#businessExamples .docLink + .other { margin-top: 1.75rem; }
#businessExamples .otherLabel { margin-right: var(--space-xs); font-size: var(--fs-md); color: var(--color-whiteSoft); }
#businessExamples .otherList { display: flex; flex-wrap: wrap; gap: var(--space-xs); }
#businessExamples .otherItem { padding: .3rem .9rem; border: 1px solid rgba(255, 255, 255, .3); border-radius: 999px; font-size: var(--fs-sm); line-height: 1.6; color: var(--color-white); }
#businessExamples .card { display: flex; flex-direction: column; }

/*============================
#businessContract
============================*/

#businessContract { padding: var(--space-section) 0; background: var(--bg-dots) 0 0 / 1.375rem 1.375rem, var(--color-bg); }
#businessContract .list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.75rem; }
#businessContract .card { overflow: hidden; padding-bottom: var(--space-xl); border: 1px solid var(--color-border); border-radius: 1.25rem; background: var(--color-white); text-align: center; box-shadow: var(--shadow-card); }
#businessContract .head { display: flex; align-items: center; justify-content: center; gap: var(--space-sm); padding: .5rem var(--space-md); background: linear-gradient(90deg, var(--color-blueDark) 0%, var(--color-blue) 100%); font-size: var(--fs-lg); font-weight: 700; line-height: 1.5; letter-spacing: .3em; color: var(--color-white); }
#businessContract .cardYellow .head { background: var(--grad-yellow); color: var(--color-white); }
#businessContract .symbol { display: grid; place-content: center; width: 2rem; height: 2rem; border-radius: 50%; background: var(--color-white); }
#businessContract .icon { width: 1.125rem; height: 1.125rem; fill: none; stroke: var(--color-blueDark); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
#businessContract .cardYellow .icon { stroke: var(--color-orange); }
#businessContract .lead { margin-top: 1.75rem; padding: 0 var(--space-xl); font-size: var(--fs-lg); font-weight: 700; line-height: 1.9; color: var(--color-text); }
#businessContract .note { margin: 1.25rem var(--space-xl) 0; padding-top: 1.25rem; border-top: 1px dotted var(--color-border); font-size: var(--fs-base); line-height: 1.8; color: var(--color-textSub); }

/*============================
#businessDocument
============================*/

#businessDocument { padding: 0 0 var(--space-section); background: var(--bg-dots) 0 0 / 1.375rem 1.375rem, var(--color-bg); }
#businessDocument .box { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); align-items: center; gap: 3.5rem; padding: 3.5rem; border-radius: 1.25rem; background: var(--bg-hexWhite) 0 0 / 3.5rem 6.0625rem repeat, var(--grad-navy); box-shadow: 0 30px 60px -36px rgba(30, 42, 85, .6); color: var(--color-white); }
#businessDocument .md_secLabel { color: var(--color-yellow); }
#businessDocument .md_secNum { background: var(--grad-yellow); color: var(--color-navy); }
#businessDocument .title { margin-top: 1.25rem; font-size: clamp(1.375rem, 1rem + 1vw, 1.875rem); font-weight: 700; line-height: 1.6; letter-spacing: .04em; }
#businessDocument .text { margin-top: 1.25rem; font-size: var(--fs-base); line-height: 2; color: var(--color-textOnBlue); }
#businessDocument .buttons { margin-top: 2rem; }
#businessDocument .md_btn { min-width: 16rem; justify-content: center; padding: 1rem 2rem; font-size: var(--fs-base); }
#businessDocument .sub { padding: 2rem; border: 1px solid rgba(255, 255, 255, .18); border-radius: 1rem; background: rgba(255, 255, 255, .06); }
#businessDocument .subTitle { font-size: var(--fs-sm); font-weight: 700; letter-spacing: .12em; color: var(--color-yellow); }
#businessDocument .points { margin-top: 1rem; padding: 0; list-style: none; }
#businessDocument .point { position: relative; padding: .75rem 0 .75rem 1.75rem; border-bottom: 1px dashed rgba(255, 255, 255, .2); font-size: var(--fs-md); font-weight: 500; line-height: 1.7; }
#businessDocument .point:last-child { border-bottom: 0; }
#businessDocument .point::before { content: ""; position: absolute; top: 1.1rem; left: .25rem; width: .75rem; height: .4rem; border-bottom: 2px solid var(--color-yellow); border-left: 2px solid var(--color-yellow); transform: rotate(-45deg); }

/*============================
#businessFaq
============================*/

#businessFaq { padding: var(--space-section) 0; background: var(--color-white); }
#businessFaq .list { display: grid; gap: .875rem; }
#businessFaq .item { border: 1px solid var(--color-border); border-radius: 1rem; background: var(--color-white); box-shadow: 0 14px 24px -22px rgba(30, 42, 85, .5); transition: border-color .25s, box-shadow .25s; }
#businessFaq .item[open] { border-color: var(--color-blueLight); box-shadow: 0 20px 34px -24px rgba(51, 170, 221, .8); }
#businessFaq .question { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr) 1rem; align-items: center; gap: var(--space-md); padding: 1.25rem var(--space-lg); font-size: var(--fs-lg); font-weight: 700; line-height: 1.6; color: var(--color-text); list-style: none; cursor: pointer; }
#businessFaq .question::after { content: ""; width: 1rem; height: 1rem; background: linear-gradient(var(--color-blueDark), var(--color-blueDark)) center / 100% 2px no-repeat, linear-gradient(var(--color-blueDark), var(--color-blueDark)) center / 2px 100% no-repeat; transition: transform .3s; }
#businessFaq .item[open] .question::after { transform: rotate(45deg); }
#businessFaq .qMark { display: grid; place-content: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--grad-main); font-family: Inter, sans-serif; font-size: var(--fs-base); font-weight: 700; color: var(--color-white); }
#businessFaq .aMark { background: var(--grad-yellow); color: var(--color-navy); }
#businessFaq .answer { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); gap: var(--space-md); padding: 0 var(--space-lg) var(--space-lg); }
#businessFaq .text { padding-top: .35rem; font-size: var(--fs-base); line-height: 2; color: var(--color-textSub); }
#businessFaq .strong { margin-right: .25em; font-weight: 700; color: var(--color-text); }