/* Imported from seo/drafts/ourtime/cm-production-cost @ f4dff00 by scripts/import-draft-post.mjs. Re-import instead of editing. */
.ot {
  --ink: #0B0817; --ink-2: #120D24; --ink-3: #140F2A; --ink-4: #1A1433;
  --paper: #F4F2FA;
  --violet: #7B5CFF; --violet-ui: #6A4CF5; --violet-deep: #5B3EE6; --violet-soft: #9C86FF; --violet-tint: #ECE7FF; --lilac: #C9C0F2;
  --pink: #FF4F9A; --pink-soft: #FF8FC0; --pink-pale: #FFB3D4; --magenta: #C2368A; --plum: #3B2F7A; --indigo: #3B1F9E;
  --f-display: "Archivo", "Zen Kaku Gothic New", system-ui, sans-serif;
  --f-body: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", "Yu Gothic UI", Meiryo, sans-serif;
  --f-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --ease: cubic-bezier(.2, .7, .2, 1);
  --hdr: 68px; --sheet: clamp(24px, 4vw, 48px);
  --gut: 24px; --r: 24px; --r-l: 32px;
  font-family: var(--f-body); font-weight: 500; font-size: 16px; line-height: 1.85; letter-spacing: .02em;
  overflow-x: clip; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; text-size-adjust: 100%;
}
.ot *, .ot *::before, .ot *::after { box-sizing: border-box; }
.ot :is(h1, h2, h3, p, ul, ol, li, dl, dt, dd, figure, blockquote, pre) { margin: 0; padding: 0; }
.ot :is(h1, h2, h3, p, li, dd, td, th) { word-break: auto-phrase; }
.ot :is(h1, h2, h3) { text-wrap: balance; }
.ot p { text-wrap: pretty; }
.ot img { max-width: 100%; height: auto; display: block; }
.ot a { color: inherit; text-underline-offset: 3px; }
.ot :focus-visible { outline: 3px solid var(--pink-pale); outline-offset: 3px; }
.ot .ot-sr { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.ot .ot-skip { position: fixed; left: 12px; top: 12px; z-index: 300; padding: 12px 18px; border-radius: 999px; background: #fff; color: #15102A; font-weight: 700; text-decoration: none; transform: translateY(-160%); }
.ot .ot-skip:focus { transform: none; }
.ot .ot-wrap { max-width: 1280px; margin-inline: auto; padding-inline: var(--gut); }
.ot .ot-eyebrow { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 12px; font-family: var(--f-mono); font-size: 12px; font-weight: 700; line-height: 1.6; letter-spacing: .22em; text-transform: uppercase; color: var(--pink); }
.ot .ot-eyebrow span { font-family: var(--f-body); letter-spacing: .1em; text-transform: none; color: #A9A1CC; }
.ot .ar-sample { background: var(--pink); color: #15102A; font-size: 13px; font-weight: 700; line-height: 1.6; text-align: center; padding: 6px 16px; }
.ot .ot-btn { --h: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: var(--h); padding: 0 28px; border: 0; border-radius: 999px; font: 900 15px/1.2 var(--f-body); letter-spacing: .04em; text-decoration: none; white-space: nowrap; transition: transform .3s var(--ease), background-color .3s, box-shadow .3s; }
.ot .ot-btn:hover { transform: translateY(-2px); }
.ot .ot-btn--violet { background: var(--violet-ui); color: #fff; box-shadow: 0 14px 34px -14px rgba(123, 92, 255, .95); }
.ot .ot-btn--white { background: #fff; color: #15102A; }
.ot .ot-btn--ghost { color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .7); }
.ot .ot-btn--sm { --h: 44px; padding: 0 18px; font-size: 13px; }
.ot .ot-btn--lg { --h: 60px; padding: 0 30px; font-size: 16px; }
.ot .ot-hdr { position: sticky; top: 0; z-index: 50; background: rgba(11, 8, 23, .96); -webkit-backdrop-filter: blur(16px) saturate(140%); backdrop-filter: blur(16px) saturate(140%); border-bottom: 1px solid rgba(201, 192, 242, .12); }
.ot .ot-hdr__in { height: var(--hdr); display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.ot .ot-hdr__logo { display: flex; align-items: center; min-height: 44px; flex: none; }
.ot .ot-hdr__logo img { height: 32px; width: auto; margin-left: calc(32px * -24 / 148); }
.ot .ot-hdr__nav { display: flex; gap: 22px; font-size: 14px; font-weight: 700; }
.ot .ot-hdr__nav a { position: relative; min-width: 44px; padding: 12px 4px; text-align: center; text-decoration: none; color: var(--lilac); }
.ot .ot-hdr__nav a[aria-current] { color: #fff; }
.ot .ot-hdr__nav a[aria-current]::after { content: ""; position: absolute; left: 4px; right: 4px; bottom: 6px; height: 2px; border-radius: 2px; background: var(--pink); }
@media (max-width: 899px) {
.ot .ot-hdr__nav { display: none; }
}
@media (max-width: 360px) {
.ot .ot-hdr__logo img { height: 26px; }
.ot .ot-hdr .ot-btn--sm { padding: 0 12px; font-size: 12px; }
}
.ot .ar-hero { position: relative; padding: clamp(40px, 7vw, 88px) 0 calc(var(--sheet) + clamp(40px, 6vw, 72px)); background: radial-gradient(ellipse 60% 70% at 90% 0%, rgba(123, 92, 255, .38), transparent 70%), radial-gradient(ellipse 50% 60% at 0% 100%, rgba(255, 79, 154, .22), transparent 70%), var(--ink); overflow: hidden; overflow: clip; }
.ot .ar-hero__in { max-width: 880px; margin-inline: auto; padding-inline: var(--gut); }
.ot .ar-crumb ol { display: flex; flex-wrap: wrap; align-items: center; gap: 0 10px; list-style: none; font-size: 13px; color: #A9A1CC; }
.ot .ar-crumb li { display: flex; align-items: center; min-height: 44px; }
.ot .ar-crumb li + li::before { content: "›"; margin-right: 10px; color: #8A84A3; }
.ot .ar-crumb a { color: var(--lilac); text-decoration: none; display: inline-flex; align-items: center; min-height: 44px; }
.ot .ar-media { margin-top: 20px; }
.ot .ar-hero h1 { margin-top: 18px; font-size: clamp(28px, 5vw, 52px); line-height: 1.35; font-weight: 900; letter-spacing: .01em; }
.ot .ar-hero h1 .ar-grad { background: linear-gradient(90deg, var(--violet-soft), var(--pink)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ot .ar-h1sub { display: block; margin-top: 12px; font-size: clamp(17px, 2.4vw, 22px); font-weight: 700; color: var(--lilac); line-height: 1.6; }
.ot .ar-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: 24px; font-size: 14px; color: #C9C0F2; }
.ot .ar-chip { display: inline-flex; align-items: center; min-height: 28px; padding: 0 12px; border-radius: 999px; background: rgba(255, 79, 154, .16); color: var(--pink-pale); font-weight: 700; font-size: 13px; }
.ot .ar-sheet { position: relative; z-index: 1; margin-top: calc(var(--sheet) * -1); border-radius: var(--sheet) var(--sheet) 0 0; background: var(--paper); color: #15102A; padding: clamp(40px, 6vw, 72px) 0 clamp(72px, 9vw, 120px); }
.ot .ar-body { max-width: 760px; margin-inline: auto; padding-inline: var(--gut); font-size: 17px; line-height: 1.95; }
.ot .ar-body > * + *, .ot .ar-sec > * + * { margin-top: 1.25em; }
.ot .ar-body p { color: #2A2440; }
.ot .ar-body strong { font-weight: 900; color: #15102A; background: linear-gradient(transparent 62%, rgba(255, 179, 212, .75) 62%); }
.ot .ar-body a { color: var(--violet-deep); font-weight: 700; text-decoration-thickness: 1.5px; }
.ot .ar-body code { font-family: var(--f-mono); font-size: .9em; }
.ot .ar-sec { margin-top: clamp(64px, 8vw, 96px); scroll-margin-top: calc(var(--hdr) + 16px); }
.ot .ar-num { font-family: var(--f-mono); font-size: 13px; font-weight: 700; letter-spacing: .22em; color: var(--violet-deep); }
.ot .ar-num + h2 { margin-top: 6px; }
.ot .ar-sec h2 { position: relative; padding-bottom: 14px; font-size: clamp(24px, 3.6vw, 32px); line-height: 1.45; font-weight: 900; color: #15102A; border-bottom: 2px solid #15102A; }
.ot .ar-sec h2::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 96px; height: 4px; border-radius: 2px; background: linear-gradient(90deg, var(--violet), var(--pink)); }
.ot .ar-sec h3 { margin-top: 2.2em; padding-left: 18px; position: relative; font-size: clamp(19px, 2.6vw, 22px); line-height: 1.55; font-weight: 900; color: #15102A; }
.ot .ar-sec h3::before { content: ""; position: absolute; left: 0; top: .32em; width: 6px; height: 1.05em; border-radius: 3px; background: linear-gradient(180deg, var(--violet), var(--pink)); }
.ot .ar-list { list-style: none; display: grid; gap: .7em; }
.ot ul.ar-list > li { position: relative; padding-left: 1.4em; }
.ot ul.ar-list > li::before { content: ""; position: absolute; left: .25em; top: .78em; width: 8px; height: 8px; border-radius: 50%; background: var(--violet); }
.ot ol.ar-list { counter-reset: n; }
.ot ol.ar-list > li { position: relative; padding-left: 2.6em; counter-increment: n; min-height: 2em; }
.ot ol.ar-list > li::before { content: counter(n); position: absolute; left: 0; top: .1em; display: grid; place-items: center; width: 1.85em; height: 1.85em; border-radius: 50%; background: linear-gradient(135deg, var(--violet-ui), var(--magenta)); color: #fff; font-family: var(--f-display); font-size: .9em; font-weight: 900; line-height: 1; }
.ot .ar-code { padding: 18px 20px; border-radius: 16px; background: var(--ink-2); color: #F4F2FA; font-family: var(--f-mono), var(--f-body); font-size: 16px; line-height: 1.8; white-space: pre-wrap; word-break: break-word; border-left: 4px solid var(--pink); }
.ot .ar-code code { font-family: var(--f-body); font-weight: 700; font-size: 1em; }
.ot .ar-toc { margin-top: 2.4em; padding: 24px 24px 20px; border-radius: 20px; background: #fff; border: 1px solid #E2DDF0; }
.ot .ar-toc__h { font-weight: 900; font-size: 16px; color: #15102A; }
.ot .ar-toc ol { margin-top: 10px; list-style: none; counter-reset: t; display: grid; gap: 2px; }
.ot .ar-toc li { counter-increment: t; display: flex; gap: 10px; font-size: 15px; line-height: 1.6; }
.ot .ar-toc li::before { content: counter(t, decimal-leading-zero); flex: none; padding-top: 11px; font-family: var(--f-mono); font-size: 12px; font-weight: 700; color: var(--violet-deep); }
.ot .ar-toc a { display: block; padding: 8px 0; color: #2A2440; font-weight: 700; text-decoration: none; }
.ot .ar-toc a:hover { color: var(--violet-deep); text-decoration: underline; }
.ot .ar-sup { display: flex; gap: 16px; align-items: flex-start; padding: 20px; border-radius: 20px; background: #fff; border: 1px solid #E2DDF0; }
.ot .ar-sup__mark { flex: none; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: linear-gradient(135deg, var(--violet-ui), var(--magenta)); color: #fff; font-size: 14px; font-weight: 900; letter-spacing: .06em; }
.ot .ar-sup__dl { display: grid; gap: 4px; min-width: 0; }
.ot .ar-sup__row { display: grid; grid-template-columns: 5.2em minmax(0, 1fr); gap: 8px; font-size: 15px; line-height: 1.7; }
.ot .ar-sup__row dt { font-weight: 900; color: var(--violet-deep); }
.ot .ar-sup__row dd { color: #2A2440; }
@media (max-width: 420px) {
.ot .ar-sup { flex-direction: column; }
.ot .ar-sup__row { grid-template-columns: minmax(0, 1fr); gap: 0; }
.ot .ar-sup__row + .ar-sup__row { margin-top: 6px; }
}
.ot .ar-sec--src .ar-list { font-size: 15px; line-height: 1.8; }
.ot .ar-sec--cta { max-width: none; }
.ot .ot-cta { position: relative; isolation: isolate; overflow: hidden; overflow: clip; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 28px 40px; padding: clamp(32px, 5vw, 56px); border-radius: var(--r-l); background: linear-gradient(120deg, var(--indigo) 0%, var(--violet) 55%, var(--magenta) 100%); color: #fff; }
.ot .ot-cta__txt { flex: 1 1 420px; min-width: 0; }
.ot .ot-cta .ot-eyebrow { color: #FFD3E6; }
.ot .ot-cta .ot-eyebrow span { color: rgba(255, 255, 255, .88); }
.ot .ot-cta__h { margin-top: 14px; font-size: clamp(22px, 3.6vw, 32px); line-height: 1.4; font-weight: 900; color: #fff; border: 0; padding: 0; }
.ot .ot-cta__p { margin-top: 14px; color: #fff !important; font-size: 16px; line-height: 1.9; }
.ot .ot-cta__btns { display: flex; flex-direction: column; gap: 12px; }
.ot .ot-cta__clock { position: absolute; z-index: -1; right: -120px; top: 50%; width: 420px; height: 420px; margin-top: -210px; overflow: hidden; border-radius: 50%; background: rgba(11, 8, 23, .18); }
.ot .ot-cta__clock i { position: absolute; left: 50%; bottom: 50%; width: 9%; height: 58%; margin-left: -4.5%; background: rgba(255, 255, 255, .25); transform-origin: 50% 100%; rotate: 45deg; }
@media (max-width: 600px) {
.ot .ot-cta { padding: 32px 22px; }
.ot .ot-cta__btns { width: 100%; }
.ot .ot-cta .ot-btn { width: 100%; white-space: normal; text-align: center; }
.ot .ot-cta__clock { width: 240px; height: 240px; right: -96px; top: 0; margin-top: -60px; }
}
.ot .ar-sec .ot-cta__h { color: #fff; border: 0; padding: 0; }
.ot .ar-sec .ot-cta__h::after { content: none; }
.ot .ar-body .ot-btn { font-weight: 900; text-decoration: none; }
.ot .ar-body .ot-btn--white { color: #15102A; }
.ot .ar-body .ot-btn--ghost { color: #fff; }
.ot .ar-body .ig { margin-top: 2em; }
.ot .ar-body .ig ul, .ot .ar-body .ig ol, .ot .ar-body .ig dl { list-style: none; margin: 0; padding: 0; }
.ot .ar-body .ig-h { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; font-size: 14px; font-weight: 900; letter-spacing: .06em; color: var(--violet-deep); line-height: 1.5; }
.ot .ar-body .ig-h::before { content: ""; flex: none; width: 22px; height: 4px; border-radius: 2px; background: linear-gradient(90deg, var(--violet), var(--pink)); }
.ot .ar-body .ig-t { font-size: 17px; font-weight: 900; line-height: 1.55; color: #15102A; }
.ot .ar-body .ig-d { margin-top: 6px; font-size: 14px; line-height: 1.75; color: #5C5677; }
.ot .ar-body .ig-nw { white-space: nowrap; }
.ot .ar-body .ig-k { font-size: 13px; font-weight: 900; letter-spacing: .08em; line-height: 1.5; }
.ot .ar-body .ig-x { position: relative; display: grid; grid-template-columns: minmax(var(--track, 0px), 1fr); overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; }
.ot .ar-body .ig-x:focus-visible { outline: 3px solid var(--violet-deep); outline-offset: 2px; border-radius: 14px; }
.ot .ar-body .ig:has(> .ig-x)::after { content: "← 横に動かせます →"; display: none; margin-top: 8px; font-size: 13px; font-weight: 700; line-height: 1.6; text-align: center; color: #4A4466; }
@media (max-width: 659px) {
.ot:not(.has-js) .ar-body .ig:has(> .ig-x)::after { display: block; }
.ot .ar-body .ig-plans { --track: 640px; }
}
.ot.has-js .ar-body .ig:has(> .ig-x.is-over)::after { display: block; }
.ot .ar-body .ig-foot { margin-top: 10px; padding: 10px 14px; border-radius: 12px; background: #ECE7FF; font-size: 14px; font-weight: 700; line-height: 1.7; color: #2A1F66; }
.ot .ar-body .ig-plans .ig-x { border-radius: 20px; background: #fff; border: 1px solid #E2DDF0; }
@media (min-width: 600px) and (max-width: 899px) {
.ot .ar-body .ig-plans thead th { font-size: 17px; padding-inline: 4px; }
}
.ot .ar-body .ig-plans table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.ot .ar-body .ig-plans th, .ot .ar-body .ig-plans td { padding: 14px 6px; text-align: center; vertical-align: middle; border-bottom: 1px solid #ECE8F6; }
.ot .ar-body .ig-plans tbody tr:last-child > * { border-bottom: 0; }
.ot .ar-body .ig-plans thead th { vertical-align: top; background: var(--violet-tint); font-family: var(--f-display); font-size: 19px; font-weight: 900; line-height: 1.25; letter-spacing: 0; color: #15102A; }
.ot .ar-body .ig-plans thead th:first-child { width: 21%; position: sticky; left: 0; z-index: 2; }
.ot .ar-body .ig-plans tbody th { position: sticky; left: 0; z-index: 1; padding-left: 14px; text-align: left; background: #fff; font-size: 18px; font-weight: 900; line-height: 1.35; color: #15102A; }
.ot .ar-body .ig-plans td { font-size: 30px; font-weight: 900; line-height: 1; }
.ot .ar-body .ig-plans .ig-foot { text-align: right; background: transparent; padding: 4px 4px 0; font-weight: 700; color: #4A4466; }
@media (max-width: 599px) {
.ot .ar-body .ig-plans thead th { font-size: 17px; }
.ot .ar-body .ig-plans tbody th { font-size: 16px; padding-left: 10px; }
}
.ot .ar-body .ig-vs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ot .ar-body .ig-vs > .ig-h { grid-column: 1 / -1; margin-bottom: 0; }
.ot .ar-body .ig-col { padding: 20px; border-radius: 20px; background: #fff; border: 1px solid #E2DDF0; }
.ot .ar-body .ig-col__h { font-size: 18px; font-weight: 900; line-height: 1.5; color: #15102A; }
.ot .ar-body .ig-col ul { margin-top: 10px; display: grid; gap: 8px; }
.ot .ar-body .ig-col li { position: relative; padding-left: 22px; font-size: 16px; line-height: 1.7; color: #2A2440; }
.ot .ar-body .ig-col li::before { content: ""; position: absolute; left: 4px; top: .72em; width: 8px; height: 8px; border-radius: 50%; background: var(--violet); }
.ot .ar-body .ig-col--a { background: radial-gradient(ellipse 80% 70% at 100% 0%, rgba(123, 92, 255, .5), transparent 70%), var(--ink-2); border: 0; }
.ot .ar-body .ig-col--a .ig-col__h { color: #fff; }
.ot .ar-body .ig-col--a li { color: #E4DEFF; }
.ot .ar-body .ig-col--a li::before { background: var(--pink-soft); }
.ot .ar-body .ig-col--dim { background: #EEEBF5; }
.ot .ar-body .ig-col--dim .ig-col__h { color: #4A4466; }
.ot .ar-body .ig-col--dim li { color: #4A4466; }
.ot .ar-body .ig-col--dim li::before { background: #8A84A3; }
@media (max-width: 599px) {
.ot .ar-body .ig-vs { gap: 8px; }
.ot .ar-body .ig-col { padding: 14px 12px; border-radius: 16px; }
.ot .ar-body .ig-col__h { font-size: 16px; }
.ot .ar-body .ig-col li { padding-left: 16px; font-size: 15px; }
.ot .ar-body .ig-col li::before { left: 2px; width: 7px; height: 7px; }
}
.ot .ar-body .ig-points ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; counter-reset: p; }
@media (max-width: 719px) {
.ot .ar-body .ig-points ol { grid-template-columns: minmax(0, 1fr); gap: 8px; }
.ot .ar-body .ig-points li { display: grid; grid-template-columns: 52px minmax(0, 1fr); column-gap: 10px; align-items: center; padding: 14px 16px; }
.ot .ar-body .ig-points li::before { grid-row: span 2; }
.ot .ar-body .ig-points .ig-t { margin-top: 0; }
}
.ot .ar-body .ig-points li { counter-increment: p; padding: 20px; border-radius: 20px; background: linear-gradient(135deg, #3B1F9E 0%, #5B3EE6 60%, #A3206E 100%); }
.ot .ar-body .ig-points li::before { content: counter(p, decimal-leading-zero); display: block; font-family: var(--f-display); font-size: 30px; font-weight: 900; line-height: 1; color: rgba(255, 255, 255, .55); }
.ot .ar-body .ig-points .ig-t { margin-top: 10px; color: #fff; }
.ot .ar-body .ig-points .ig-d { color: rgba(255, 255, 255, .92); }
.ot .ar-body .ig-demo__canvas { position: absolute; left: 0; top: 0; width: 1600px; height: 900px; transform-origin: 0 0; font-size: 16px; font-weight: 400; line-height: normal; letter-spacing: normal; text-align: left; word-break: normal; }
.ot .ar-body .ig-demo__alt { padding: 16px; font-size: 14px; line-height: 1.7; color: #C9C0F2; }
.ot .ar-body .ig-loop { --from: calc(30% - .2 * var(--g)); --to: calc(10% - .4 * var(--g)); position: relative; margin-top: 12px; padding: 30px var(--to) 0 var(--from); text-align: center; font-size: 16px; font-weight: 700; line-height: 1.5; color: var(--pink-pale); }
.ot .ar-body .ig-hiw--who .ig-loop { --from: calc(10% - .4 * var(--g)); }
.ot .ar-body .ig-loop::before { content: ""; position: absolute; top: 0; left: var(--from); right: var(--to); height: 22px; border: 2px solid currentColor; border-top: 0; border-radius: 0 0 22px 22px; }
.ot .ar-body .ig-loop::after { content: ""; position: absolute; top: -10px; left: calc(var(--from) - 7px); border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 11px solid currentColor; }
.ot .ar-body .ig-glow { position: absolute; inset: -2px; border-radius: 22px; box-shadow: 0 0 0 3px rgba(156, 134, 255, .95), 0 0 30px rgba(123, 92, 255, .6); opacity: 0; transition: opacity .3s ease; pointer-events: none; }
.ot .ar-body .ig-hiw li.is-human .ig-glow { box-shadow: 0 0 0 3px rgba(255, 79, 154, .9), 0 0 30px rgba(255, 79, 154, .5); }
.ot .ar-body .ig-hiw li.is-on .ig-glow { opacity: .4; }
.ot .ar-body .ig-hiw li.is-now .ig-glow { opacity: 1; }
.ot .ar-body .ig-loop .ig-glow { inset: auto; top: 0; left: var(--from); right: var(--to); height: 22px; border-radius: 0 0 22px 22px; box-shadow: 0 6px 16px rgba(255, 79, 154, .8), inset 0 -2px 0 #fff; }
.ot .ar-body .ig-loop.is-on .ig-glow { opacity: 1; }
.ot .ar-body .ig-cta { padding: 24px 22px; border-radius: 24px; background: linear-gradient(120deg, #3B1F9E 0%, #5B3EE6 55%, #A3206E 100%); }
.ot .ar-body .ig-cta__k { font-family: var(--f-mono); font-size: 13px; font-weight: 700; letter-spacing: .14em; color: #FFD3E6; }
.ot .ar-body .ig-cta__t { margin-top: 6px; font-size: clamp(20px, 3vw, 26px); font-weight: 900; line-height: 1.45; color: #fff; }
.ot .ar-body .ig-cta .ig-cta__d { margin-top: 8px; font-size: 15px; line-height: 1.8; color: rgba(255, 255, 255, .94); }
.ot .ar-body .ig-cta__links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.ot .ar-body .ig-cta__links a { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 24px; border-radius: 999px; font-weight: 900; text-decoration: none; background: #fff; color: #15102A; }
.ot .ar-body .ig-cta__links a + a { background: transparent; color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .75); }
.ot .ar-body .ig-cta__links a::after { content: "→"; margin-left: 8px; }
@media (max-width: 480px) {
.ot .ar-body .ig-cta__links a { flex: 1 1 100%; }
}
.ot .ar-body .ig-chat { padding: 18px 16px 16px; border-radius: 24px; background: #E9E4FA; }
.ot .ar-body .ig-chat ol { display: grid; gap: 14px; }
.ot .ar-body .ig-chat > ol > li { display: grid; column-gap: 8px; align-items: start; min-width: 0; }
.ot .ar-body .ig-chat > ol > li[hidden] { display: none; }
.ot .ar-body .ig-chat .ig-ava { grid-area: ava; display: block; width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.ot .ar-body .ig-chat__name { grid-area: name; font-size: 13px; font-weight: 700; color: #4A4466; margin: 2px 6px 4px; }
.ot .ar-body .ig-chat__bubble { grid-area: bubble; max-width: min(100%, 520px); padding: 12px 16px; border-radius: 20px; font-size: 16px; font-weight: 700; line-height: 1.7; }
.ot .ar-body .ig-chat__me .ig-chat__bubble { background: #6A4CF5; color: #fff; border-bottom-right-radius: 6px; }
.ot .ar-body .ig-chat__ai .ig-chat__bubble { background: #fff; color: #15102A; font-weight: 500; border-bottom-left-radius: 6px; box-shadow: 0 6px 18px -12px rgba(59, 31, 158, .5); }
.ot .ar-body .ig-chat__ai .ig-chat__bubble.is-media { width: min(100%, 520px); padding: 10px; }
.ot .ar-body .ig-chat__bubble.is-media .ig-chat__text, .ot .ar-body .ig-chat__bubble.is-media > .ig-chat__more { padding: 2px 6px 8px; }
.ot .ar-body .ig-chat__bubble.is-media .ig-chat__tag { margin-top: 4px; }
.ot .ar-body .ig-chat__tag { display: inline-block; margin: 0 0 8px 4px; padding: 1px 10px; border-radius: 999px; background: var(--ink-2); color: #fff; font-size: 13px; font-weight: 900; }
.ot .ar-body .ig-chat li:nth-child(4) .ig-chat__tag, .ot .ar-body .ig-chat li:nth-child(6) .ig-chat__tag { background: var(--violet-ui); }
.ot .ar-body .ig-chat li:last-child .ig-chat__tag { background: #C2368A; }
.ot .ar-body .ig-chat .ig-demo__stage { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 12px; background: #0c0a1c; }
.ot .ar-body .ig-chat .ig-foot { margin-top: 12px; background: transparent; padding: 0 4px; font-size: 13px; font-weight: 500; color: #4A4466; }
.ot.has-js .ar-body .ig-chat ol > li > * { transition: opacity .4s ease, transform .45s ease; }
.ot.has-js .ar-body .ig-chat ol > li.is-wait > * { opacity: 0; transform: translateY(12px); }
.ot .ar-body .ig-step__frame { position: relative; height: 600px; overflow-y: auto; padding: 4px 4px 12px; border-radius: 18px; background: rgba(255, 255, 255, .45); cursor: pointer; scrollbar-width: thin; }
@media (max-width: 719px) {
.ot .ar-body .ig-step__frame { height: 56vh; }
}
@media (max-width: 359px) {
.ot .ar-body .ig-step__frame { height: 50vh; }
}
.ot .ar-body .ig-step__frame { overscroll-behavior: auto; }
.ot .ar-body .ig-step__frame:focus-visible { outline: 3px solid var(--violet-deep); outline-offset: 2px; }
.ot .ar-body .ig-step__bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
.ot .ar-body .ig-step__btn { min-height: 44px; padding: 0 16px; border: 0; border-radius: 999px; background: #fff; color: #2A1F66; font: 700 15px/1.2 var(--f-body); box-shadow: inset 0 0 0 1.5px #B3A8DE; cursor: pointer; }
.ot .ar-body .ig-step__btn:disabled { color: #6E6889; box-shadow: inset 0 0 0 1.5px #D5CFEA; cursor: default; }
.ot .ar-body .ig-step__btn--next { margin-left: auto; background: var(--violet-ui); color: #fff; box-shadow: none; padding: 0 22px; }
.ot .ar-body .ig-step__btn:focus-visible { outline: 3px solid #C2368A; outline-offset: 2px; }
.ot .ar-body .ig-step__count { font-size: 15px; font-weight: 700; color: #2A1F66; }
.ot .ar-body .ig-chat__all { margin-top: 12px; }
.ot .ar-body .ig-chat__all > summary { display: inline-flex; align-items: center; min-height: 44px; font-size: 15px; font-weight: 700; color: var(--violet-deep); cursor: pointer; }
.ot .ar-body .ig-chat--all { padding: 8px 0 0; background: none; border-radius: 0; }
@media (max-width: 479px) {
.ot .ar-body .ig-step__btn { padding: 0 12px; font-size: 14px; }
.ot .ar-body .ig-step__btn--next { padding: 0 16px; }
}
.ot .ar-body .ig-evolve .ig-chat__tag { margin: 2px 0 8px 2px; }
.ot .ar-body .ig-evolve li:nth-child(2) .ig-chat__tag { background: var(--violet-ui); }
.ot .ar-body .ig-evolve li:nth-child(3) .ig-chat__tag { background: #C2368A; }
.ot .ar-body .ig-cmtypes td { font-size: 17px; font-weight: 700; line-height: 1.5; color: #15102A; }
@media (max-width: 659px) {
.ot .ar-body .ig-cmtypes { --track: 520px; }
}
.ot .ar-body .ig-factors ul, .ot .ar-body .ig-samples ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.ot .ar-body .ig-factors li, .ot .ar-body .ig-samples li { padding: 16px 12px; border-radius: 18px; background: #fff; border: 1px solid #E2DDF0; text-align: center; }
.ot .ar-body .ig-factors .ig-k { display: grid; place-items: center; width: 34px; height: 34px; margin: 0 auto 8px; border-radius: 50%; background: linear-gradient(135deg, var(--violet-ui), var(--magenta)); color: #fff; font-family: var(--f-display); font-size: 16px; }
.ot .ar-body .ig-factors .ig-t, .ot .ar-body .ig-samples .ig-t { font-size: 17px; }
.ot .ar-body .ig-factors .ig-d, .ot .ar-body .ig-samples .ig-d { margin-top: 4px; font-size: 14px; font-weight: 700; color: #4A4466; }
@media (max-width: 599px) {
.ot .ar-body .ig-factors ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
}
.ot .ar-body .ig-checkgrid ul, .ot .ar-body .ig-checkgrid ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; counter-reset: c; }
.ot .ar-body .ig-checkgrid li { position: relative; display: flex; align-items: center; min-height: 56px; padding: 10px 12px 10px 48px; border-radius: 14px; background: #fff; border: 1px solid #E2DDF0; font-size: 17px; font-weight: 900; line-height: 1.4; color: #15102A; counter-increment: c; }
.ot .ar-body .ig-checkgrid li::before { content: "✓"; position: absolute; left: 12px; top: 50%; display: grid; place-items: center; width: 26px; height: 26px; margin-top: -13px; border-radius: 8px; background: var(--violet-ui); color: #fff; font-size: 15px; font-weight: 900; }
@media (max-width: 599px) {
.ot .ar-body .ig-checkgrid ul, .ot .ar-body .ig-checkgrid ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ot .ar-body .ig-checkgrid li { font-size: 16px; padding-left: 44px; }
}
.ot .ar-body .ig-ytc { display: grid; grid-template-columns: 132px minmax(0, 1fr); align-items: center; overflow: hidden; border-radius: 14px; background: var(--ink-2); color: #fff; text-decoration: none; }
.ot .ar-body .ig-ytc__img { position: relative; display: block; height: 100%; min-height: 84px; overflow: hidden; }
.ot .ar-body .ig-ytc__img img { width: 100%; height: 100%; object-fit: cover; }
.ot .ar-body .ig-ytc__img::after { content: "▶"; position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 36px; height: 36px; margin: -18px 0 0 -18px; padding-left: 3px; border-radius: 50%; background: var(--pink); color: #fff; font-size: 14px; }
.ot .ar-body .ig-ytc__body { display: block; padding: 10px 12px; min-width: 0; }
.ot .ar-body .ig-ytc__k { display: block; font-family: var(--f-mono); font-size: 13px; font-weight: 700; letter-spacing: .06em; color: var(--pink-pale); }
.ot .ar-body .ig-ytc__t { display: block; margin-top: 4px; font-size: 14px; font-weight: 700; line-height: 1.5; color: #fff; }
.ot .ar-body .ig-ytc__d { display: block; margin-top: 4px; font-size: 13px; font-weight: 700; color: #C9C0F2; }
.ot .ar-body .ig-ytc:hover .ig-ytc__t { text-decoration: underline; }
.ot .ar-body .ig-ytc:focus-visible { outline: 3px solid #C2368A; outline-offset: 3px; }
.ot .ar-body .ig-chat__bubble .ig-ytc { margin-top: 2px; }
.ot .ar-body .ig-recs li { padding: 8px; }
@media (max-width: 639px) {
.ot .ar-body .ig.ig-recs > ul { grid-template-columns: minmax(0, 1fr); gap: 8px; }
}
@media (max-width: 359px) {
.ot .ar-body .ig-ytc { grid-template-columns: 104px minmax(0, 1fr); }
}
.ot .ar-body .ig-recs ul { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.ot .ar-body .ig-recs ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ot .ar-body .ig-recs li { padding: 10px; border-radius: 18px; background: #fff; border: 1px solid #E2DDF0; }
.ot .ar-body .ig-faq { display: grid; gap: 10px; }
.ot .ar-body .ig-faq > div { position: relative; padding: 16px 18px 16px 58px; border-radius: 18px; background: #fff; border: 1px solid #E2DDF0; }
.ot .ar-body .ig-faq > div::before { content: "Q"; position: absolute; left: 16px; top: 16px; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--violet-ui); color: #fff; font-family: var(--f-display); font-size: 14px; font-weight: 900; }
.ot .ar-sec .ig-faq h3 { margin: 0; padding: 0; font-size: 17px; line-height: 1.6; }
.ot .ar-sec .ig-faq h3::before { content: none; }
.ot .ar-body .ig-faq p { margin-top: 6px; font-size: 15px; line-height: 1.8; color: #2A2440; }
.ot .ot-foot { position: relative; z-index: 2; margin-top: calc(var(--sheet) * -1); border-radius: var(--sheet) var(--sheet) 0 0; background: var(--ink); padding-block: 72px 40px; box-shadow: 0 -1px 0 rgba(201, 192, 242, .16); }
.ot .ot-foot__top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 40px; }
.ot .ot-foot__brand { flex: 1 1 280px; }
.ot .ot-foot__brand img { height: 56px; width: auto; margin-left: calc(56px * -24 / 148); }
.ot .ot-foot__brand p { margin-top: 16px; font-family: var(--f-display); font-weight: 800; color: var(--lilac); }
.ot .ot-foot__cols { flex: 2 1 480px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr)); gap: 24px; font-size: 14px; }
.ot .ot-foot__col { display: flex; flex-direction: column; }
.ot .ot-foot__col p { margin-bottom: 4px; font-family: var(--f-mono); font-size: 12px; letter-spacing: .2em; color: #8A84A3; }
.ot .ot-foot__col a { display: inline-flex; align-items: center; min-height: 44px; color: var(--lilac); text-decoration: none; }
.ot .ot-foot__bot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-top: 56px; padding-top: 20px; border-top: 1px solid rgba(201, 192, 242, .15); font-family: var(--f-mono); font-size: 12px; letter-spacing: .14em; color: #8A84A3; }
@media (min-width: 900px) {
.ot .ar-body .ig-plans thead th { font-size: 17px; padding-inline: 4px; }
}
.ot .ar-body .ig-gal ul { --gap: 12px; display: flex; gap: var(--gap); margin: -4px 0; padding: 4px 0; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: 0 48px; scrollbar-width: none; }
.ot .ar-body .ig-gal ul::-webkit-scrollbar { display: none; }
.ot .ar-body .ig-gal li { flex: none; scroll-snap-align: start; }
@media (max-width: 659px) {
.ot .ar-body .ig-gal ul { --gap: 10px; }
}
.ot .ar-body .hs-cards.is-r { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 44px), rgba(0, 0, 0, .2)); mask-image: linear-gradient(90deg, #000 calc(100% - 44px), rgba(0, 0, 0, .2)); }
.ot .ar-body .hs-cards.is-l { -webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, .2), #000 44px); mask-image: linear-gradient(90deg, rgba(0, 0, 0, .2), #000 44px); }
.ot .ar-body .hs-cards.is-l.is-r { -webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, .2), #000 44px, #000 calc(100% - 44px), rgba(0, 0, 0, .2)); mask-image: linear-gradient(90deg, rgba(0, 0, 0, .2), #000 44px, #000 calc(100% - 44px), rgba(0, 0, 0, .2)); }
.ot .ar-body .hs-cards:focus-visible { outline: 3px solid var(--violet-deep); outline-offset: -3px; }
@media (hover: hover) and (pointer: fine) {
.ot .ar-body .hs-on { cursor: grab; }
.ot .ar-body .hs-on.is-drag { cursor: grabbing; scroll-snap-type: none; -webkit-user-select: none; user-select: none; }
}
.ot .ar-body .hs-bar { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin-top: 10px; }
.ot .ar-body .hs-bar[hidden] { display: none; }
.ot .ar-body .hs-count { margin-right: auto; font-family: var(--f-mono); font-size: 14px; font-weight: 700; letter-spacing: .04em; line-height: 1.5; color: #4A4466; }
.ot .ar-body .hs-btn { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1.5px solid #B3A8DE; border-radius: 50%; background: #fff; color: var(--violet-deep); font: 900 22px/1 var(--f-body); cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.ot .ar-body .hs-btn:hover:not(:disabled) { background: var(--violet-ui); border-color: var(--violet-ui); color: #fff; }
.ot .ar-body .hs-btn:focus-visible { outline: 3px solid #C2368A; outline-offset: 2px; }
.ot .ar-body .hs-btn:disabled { opacity: .45; cursor: default; }
.ot .ar-body .ig-x + .hs-bar { margin-top: 8px; }
@media (hover: none), (pointer: coarse) {
.ot .ar-body .ig-x + .hs-bar { display: none; }
}
.ot .ar-body .ig-gal li { min-width: 0; padding: 8px 8px 12px; border-radius: 18px; background: #fff; border: 1px solid #E2DDF0; }
.ot .ar-body .ig-gal__v, .ot .ar-body .ig-gal__img { display: block; width: 100%; height: auto; border-radius: 12px; background: #120D24; }
.ot .ar-body .ig-gal__v { aspect-ratio: 9 / 16; object-fit: cover; }
.ot .ar-body .ig-gal__t { margin: 10px 4px 0; font-size: 16px; font-weight: 900; line-height: 1.45; color: #15102A; }
.ot .ar-body .ig-gal__m { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 2px 4px 0; font-size: 13px; font-weight: 700; line-height: 1.6; color: #4A4466; }
.ot .ar-body .ig-gal__own { display: inline-block; padding: 0 8px; border-radius: 999px; background: #FFE0EE; color: #8C1A5C; font-size: 13px; font-weight: 900; line-height: 1.7; }
.ot .ar-body .ig-gal .ig-foot { margin-top: 12px; }
@media (min-width: 660px) {
.ot .ar-body .ig-gal--two ul { max-width: 540px; margin-inline: auto; }
}
.ot .ar-body .ig-gal--pair ul, .ot .ar-body .ig-gal--two ul { display: grid; gap: 10px; margin: 0; padding: 0; overflow: visible; scroll-snap-type: none; align-items: center; }
.ot .ar-body .ig-gal--pair ul > li, .ot .ar-body .ig-gal--two ul > li { width: auto; }
.ot .ar-body .ig-gal--two ul { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.ot .ar-body .ig-loop__btn.is-on::before { width: 12px; height: 16px; margin-left: 0; border: 0; border-left: 4px solid #fff; border-right: 4px solid #fff; }
.ot .ar-body .ig-chat .ig-ava--hf { position: relative; border-radius: 50%; background: linear-gradient(135deg, #3B1F9E, #6A4CF5); }
.ot .ar-body .ig-chat .ig-ava--hf::before { content: "✦"; position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-size: 20px; line-height: 1; }
.ot .ar-body .ig-factors--5 ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.ot .ar-body .ig-factors--5 li { flex: 0 0 calc((100% - 40px) / 5); min-width: 0; }
@media (max-width: 599px) {
.ot .ar-body .ig-factors--5 ul { gap: 8px; }
.ot .ar-body .ig-factors--5 li { flex-basis: calc((100% - 8px) / 2); }
}
.ot .ar-body .ig-cmplans td { font-size: 17px; }
@media (max-width: 659px) {
.ot .ar-body .ig-cmplans { --track: 0px; }
.ot .ar-body .ig-cmplans th, .ot .ar-body .ig-cmplans td { padding: 10px 4px; }
.ot .ar-body .ig-cmplans td { font-size: 14px; }
.ot .ar-body .ig-cmplans thead th { font-size: 15px; }
.ot .ar-body .ig-cmplans tbody th { font-size: 15px; padding-left: 8px; }
}
.ot .ar-thumb { max-width: 760px; margin: 0 auto 8px; padding-inline: var(--gut); }
.ot .ar-thumb img { display: block; width: 100%; height: auto; border-radius: 18px; box-shadow: 0 18px 40px -24px rgba(21, 16, 42, .45); }
.ot .ar-body .ig-eq__row { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 10px; padding: 16px; border-radius: 24px; background: #E9E4FA; }
.ot .ar-body .ig-eq__box { padding: 18px 10px; border-radius: 18px; background: #fff; border: 1px solid #E2DDF0; text-align: center; }
.ot .ar-body .ig-eq__box .ig-k { color: var(--violet-deep); }
.ot .ar-body .ig-eq__box .ig-t { margin-top: 4px; font-size: 22px; line-height: 1.35; }
.ot .ar-body .ig-eq__box .ig-d { margin-top: 4px; font-size: 14px; font-weight: 700; line-height: 1.6; color: #4A4466; }
.ot .ar-body .ig-eq__box--b { border: 1.5px solid #F6B9D3; background: #FFF6FA; }
.ot .ar-body .ig-eq__box--b .ig-k { color: var(--magenta); }
.ot .ar-body .ig-eq__box--sum { border: 0; background: linear-gradient(135deg, #3B1F9E, #5B3EE6 60%, #A3206E); }
.ot .ar-body .ig-eq__box--sum .ig-k { color: rgba(255, 255, 255, .85); }
.ot .ar-body .ig-eq__box--sum .ig-t { color: #fff; }
.ot .ar-body .ig-eq__op { font-family: var(--f-display); font-size: 30px; font-weight: 900; line-height: 1; color: var(--violet-deep); }
@media (max-width: 599px) {
.ot .ar-body .ig-eq__row { gap: 4px; padding: 10px 8px; border-radius: 18px; }
.ot .ar-body .ig-eq__box { padding: 12px 4px; border-radius: 14px; }
.ot .ar-body .ig-eq__box .ig-k { font-size: 13px; letter-spacing: 0; }
.ot .ar-body .ig-eq__box .ig-t { font-size: 16px; }
.ot .ar-body .ig-eq__box .ig-d { font-size: 13px; line-height: 1.5; }
.ot .ar-body .ig-eq__op { font-size: 20px; }
}
.ot .ar-body .ig-gal__p { margin: 8px 4px 0; padding: 4px 6px; border-radius: 10px; background: var(--violet-tint); font-size: 15px; font-weight: 900; line-height: 1.5; color: #2A1F66; text-align: center; }
.ot .ar-body .ig-lpshot { padding: 16px; border-radius: 24px; background: #E9E4FA; }
.ot .ar-body .ig-lpshot figure { max-width: 340px; margin: 0 auto; }
.ot .ar-body .ig-lpshot img { display: block; width: 100%; height: auto; border-radius: 14px; border: 1px solid #D9D2F0; background: #fff; box-shadow: 0 16px 36px -24px rgba(21, 16, 42, .5); }
.ot .ar-body .ig-lpshot figcaption { margin-top: 10px; font-size: 13px; font-weight: 700; line-height: 1.7; color: #4A4466; }
.ot .ar-body .ig-lpshot__pts { display: grid; gap: 10px; }
.ot .ar-body .ig-lpshot__pts li { padding: 12px 14px; border-radius: 14px; background: #fff; border: 1px solid #E2DDF0; }
.ot .ar-body .ig-lpshot__pts .ig-t { font-size: 19px; line-height: 1.4; }
.ot .ar-body .ig-lpshot__pts .ig-d { margin-top: 2px; font-size: 14px; font-weight: 700; line-height: 1.6; color: #4A4466; }
@media (min-width: 660px) {
.ot .ar-body .ig-lpshot--side { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: 20px; align-items: center; }
.ot .ar-body .ig-lpshot--side figure { margin: 0; }
}
@media (max-width: 659px) {
.ot .ar-body .ig-lpshot { padding: 12px; border-radius: 18px; }
.ot .ar-body .ig-lpshot__pts { margin-top: 12px; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.ot .ar-body .ig-lpshot__pts li { padding: 10px 6px; text-align: center; }
.ot .ar-body .ig-lpshot__pts .ig-t { font-size: 15px; }
.ot .ar-body .ig-lpshot__pts .ig-d { font-size: 13px; line-height: 1.5; }
}
.ot .ar-body .ig-factors--6 ul { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 599px) {
.ot .ar-body .ig-factors--6 ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.ot .ar-body .ig-factors--7 ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.ot .ar-body .ig-factors--7 li { flex: 0 0 calc((100% - 30px) / 4); min-width: 0; }
@media (max-width: 599px) {
.ot .ar-body .ig-factors--7 ul { gap: 8px; }
.ot .ar-body .ig-factors--7 li { flex-basis: calc((100% - 8px) / 2); }
}
.ot .ar-body .ig-duo__in { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ot .ar-body .ig-duo__g { padding: 12px; border-radius: 20px; background: #fff; border: 1px solid #E2DDF0; }
.ot .ar-body .ig-duo__h { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 8px; margin-bottom: 10px; }
.ot .ar-body .ig-duo__h .ig-t { font-size: 17px; }
.ot .ar-body .ig-duo__h .ig-d { margin: 0; font-size: 15px; font-weight: 900; color: #2A1F66; }
.ot .ar-body .ig-duo ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.ot .ar-body .ig-duo img { display: block; width: 100%; height: auto; border-radius: 10px; background: #120D24; }
.ot .ar-body .ig-duo__c { margin-top: 10px; padding: 6px 10px; border-radius: 10px; background: var(--violet-tint); font-size: 15px; font-weight: 900; line-height: 1.5; color: #2A1F66; text-align: center; }
@media (max-width: 659px) {
.ot .ar-body .ig-duo__in { grid-template-columns: minmax(0, 1fr); gap: 10px; }
}
.ot .ar-body .ig-fmt ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.ot .ar-body .ig-fmt li { padding: 16px 10px; border-radius: 18px; background: #fff; border: 1px solid #E2DDF0; text-align: center; }
.ot .ar-body .ig-fmt__n { font-family: var(--f-display); font-size: 30px; font-weight: 900; line-height: 1.15; color: var(--violet-deep); }
.ot .ar-body .ig-fmt__n small { margin-left: 2px; font-size: 15px; }
.ot .ar-body .ig-fmt .ig-t { margin-top: 8px; font-size: 16px; line-height: 1.45; }
.ot .ar-body .ig-fmt .ig-d { margin-top: 4px; font-size: 13px; font-weight: 700; color: #4A4466; }
@media (max-width: 599px) {
.ot .ar-body .ig-fmt ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.ot .ar-body .ig-fmt__n { font-size: 24px; }
}
@media (max-width: 599px) {
.ot .ar-body .ig-factors--6 li, .ot .ar-body .ig-factors--7 li, .ot .ar-body .ig-factors--5 li { display: grid; grid-template-columns: 26px minmax(0, 1fr); column-gap: 8px; align-items: center; padding: 10px 8px; border-radius: 14px; text-align: left; }
.ot .ar-body .ig-factors--6 .ig-k, .ot .ar-body .ig-factors--7 .ig-k, .ot .ar-body .ig-factors--5 .ig-k { grid-row: 1 / 3; width: 26px; height: 26px; margin: 0; font-size: 14px; }
.ot .ar-body .ig-factors--6 .ig-t, .ot .ar-body .ig-factors--7 .ig-t, .ot .ar-body .ig-factors--5 .ig-t { font-size: 15px; line-height: 1.4; }
.ot .ar-body .ig-factors--6 .ig-d, .ot .ar-body .ig-factors--7 .ig-d, .ot .ar-body .ig-factors--5 .ig-d { margin-top: 0; font-size: 13px; line-height: 1.45; }
}
.ot .ar-body .ig-fmt--3 ul { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 599px) {
.ot .ar-body .ig-fmt--3 ul { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.ot .ar-body .ig-fmt--3 li { padding: 12px 6px; }
.ot .ar-body .ig-fmt--3 .ig-fmt__n { font-size: 22px; }
.ot .ar-body .ig-fmt--3 .ig-t { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
.ot *, .ot *::before, .ot *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
/* import-draft-post: the site's article column gives the side gutter. */
.ot > .ar-body { padding-inline: 0; }