/* Product editor fragment. All rules are isolated from Enfold and the home page. */


.jtom-mes-product { --mp-ink:#06283d; --mp-blue:#006ea6; --mp-lime:#b7d100; --mp-line:#cedadf; color:var(--mp-ink); background:#fff; font-family:Arial,"Pretendard","Noto Sans KR","Malgun Gothic",sans-serif; line-height:1.7; word-break:keep-all; width:100vw; max-width:100vw; margin-left:calc(50% - 50vw); overflow:clip; }
.jtom-mes-product *, .jtom-mes-product *::before, .jtom-mes-product *::after { box-sizing:border-box; }
.jtom-mes-product h1,.jtom-mes-product h2,.jtom-mes-product h3,.jtom-mes-product p,.jtom-mes-product ul { margin:0; padding:0; color:inherit; }
.jtom-mes-product ul { list-style:none; }
.jtom-mes-product a { color:inherit; text-decoration:none; }
.jtom-mes-product [id] { scroll-margin-top:120px; }
.jtom-mes-product .mp-shell { max-width:1240px; width:calc(100% - 80px); margin:auto; }
.jtom-mes-product .mp-hero,.jtom-mes-product .mp-section--pale,.jtom-mes-product .mp-consult,.jtom-mes-product .mp-navigation { box-shadow:0 0 0 100vmax var(--mp-band); clip-path:inset(0 -100vmax); background:var(--mp-band); }
.jtom-mes-product .mp-hero { --mp-band:#06283d; color:#fff; padding:120px 0 0; }
.jtom-mes-product .mp-breadcrumb { font-size:10px; letter-spacing:.13em; color:#b1c5cd; }
.jtom-mes-product .mp-breadcrumb span { margin:0 12px; color:#658391; }
.jtom-mes-product .mp-hero-grid { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(440px,.95fr); align-items:center; gap:80px; padding:72px 0 80px; }
.jtom-mes-product .mp-eyebrow { display:flex; align-items:center; gap:12px; font-size:10px; font-weight:700; letter-spacing:.16em; margin-bottom:22px; }
.jtom-mes-product .mp-eyebrow::before { content:''; width:7px; height:7px; flex-shrink:0; background:var(--mp-lime); }
.jtom-mes-product h1,#top .jtom-mes-product h1 { color:#fff !important; font-size:clamp(56px,6.5vw,90px); font-weight:400; letter-spacing:-.065em; line-height:1; text-transform:none; }
.jtom-mes-product h1 em { color:#65c8ee; font-style:normal; }
.jtom-mes-product h2,#top .jtom-mes-product h2 { color:var(--mp-ink) !important; font-size:clamp(32px,3.7vw,48px); font-weight:500; letter-spacing:-.045em; line-height:1.3; text-transform:none; }
.jtom-mes-product .mp-hero h2,#top .jtom-mes-product .mp-hero h2 { color:#fff !important; font-size:26px; margin:28px 0 16px; }
.jtom-mes-product .mp-lead { color:#bfd0d8; font-size:15px; max-width:500px; }
.jtom-mes-product .mp-button { display:inline-flex; align-items:center; justify-content:space-between; gap:35px; min-height:56px; padding:14px 25px; background:var(--mp-ink); color:#fff; border:1px solid transparent; font-size:15px; font-weight:700; transition:background .25s,transform .25s; }
.jtom-mes-product .mp-cta,.jtom-mes-product .mp-consult-action { margin:0; }
.jtom-mes-product .mp-button--lime { background:var(--mp-lime); color:var(--mp-ink) !important; margin-top:30px; }
.jtom-mes-product .mp-button:hover { background:var(--mp-blue); color:#fff !important; transform:translateY(-2px); }
.jtom-mes-product a:focus-visible,.jtom-mes-product summary:focus-visible { outline:3px solid #009bd8; outline-offset:5px; }
.jtom-mes-product .mp-blueprint { border:1px solid #49616e; background:repeating-linear-gradient(0deg,transparent 0 31px,#ffffff04 31px 32px),repeating-linear-gradient(90deg,transparent 0 31px,#ffffff04 31px 32px); padding:25px; }
.jtom-mes-product .mp-blueprint-head,.jtom-mes-product .mp-blueprint-foot { display:flex; justify-content:space-between; font-size:9px; letter-spacing:.12em; color:#b1c5cd; gap:15px; }
.jtom-mes-product .mp-blueprint-head { padding-bottom:28px; }
.jtom-mes-product .mp-blueprint-foot { padding-top:28px; }
.jtom-mes-product .mp-blueprint-row { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.jtom-mes-product .mp-blueprint-row span { border:1px solid #49616e; background:#16394b; padding:15px 7px; text-align:center; font-size:12px; }
.jtom-mes-product .mp-connector { height:38px; width:1px; margin:auto; background:#49616e; position:relative; }
.jtom-mes-product .mp-connector i { position:absolute; top:0; left:-2px; width:5px; height:10px; background:var(--mp-lime); }
.jtom-mes-product .mp-core { padding:32px 15px; text-align:center; border:1px solid #65c8ee; background:#0d354a; }
.jtom-mes-product .mp-core-kicker { font-size:8px; letter-spacing:.14em; color:#a7dced; }
.jtom-mes-product .mp-core-brand { display:block; font-size:39px; font-weight:400; letter-spacing:-.04em; }
.jtom-mes-product .mp-core b { color:var(--mp-lime); font-weight:400; }
.jtom-mes-product .mp-core-copy { font-size:12px; color:#bfd0d8; }
.jtom-mes-product .mp-hero-caption { padding:22px 0; border-top:1px solid #49616e; display:flex; justify-content:space-between; gap:20px; font-size:10px; letter-spacing:.06em; color:#bfd0d8; }
.jtom-mes-product .mp-hero-caption a { color:#fff; }
.jtom-mes-product .mp-navigation { --mp-band:#f0f4f2; }
.jtom-mes-product .mp-navigation .mp-shell { display:flex; }
.jtom-mes-product .mp-navigation a { flex:1; padding:21px 12px; text-align:center; border-left:1px solid var(--mp-line); font-size:18px; transition:background .2s; color: #004881; }
.jtom-mes-product .mp-navigation a:last-child { border-right:1px solid var(--mp-line); }
.jtom-mes-product .mp-navigation a:hover { background:#deebea; }
.jtom-mes-product .mp-section { padding:105px 0; }
.jtom-mes-product .mp-section--pale { --mp-band:#f4f6f3; }
.jtom-mes-product .mp-overview-grid,.jtom-mes-product .mp-faq-grid { display:grid; grid-template-columns:1fr 1.25fr; gap:100px; }
.jtom-mes-product .mp-description { margin-top:24px; font-size:16px; color:#536d7b; }
.jtom-mes-product .mp-outcomes article { display:flex; gap:30px; padding:27px 0; border-top:1px solid var(--mp-line); }
.jtom-mes-product .mp-outcomes article:last-child { border-bottom:1px solid var(--mp-line); }
.jtom-mes-product .mp-outcome-index { flex:0 0 auto; min-width:20px; font-size:18px; color:var(--mp-blue); padding-top:5px; }
.jtom-mes-product h3,#top .jtom-mes-product h3 { color:var(--mp-ink) !important; font-size:21px; font-weight:500; letter-spacing:-.025em; }
.jtom-mes-product .mp-outcomes p { font-size:15px; color:#536d7b; margin-top:8px; }
.jtom-mes-product .mp-heading { display:grid; grid-template-columns:1.3fr 1fr; gap:90px; align-items:end; margin-bottom:55px; }
.jtom-mes-product .mp-heading > p { font-size:16px; color:#536d7b; max-width:440px; }
.jtom-mes-product .mp-capabilities { display:grid; grid-template-columns:.8fr 1.5fr; gap:80px; border-top:1px solid var(--mp-ink); padding-top:30px; }
.jtom-mes-product .mp-feature-aside { padding:25px 0; }
.jtom-mes-product .mp-platform-label { font-size:10px; letter-spacing:.15em; }
.jtom-mes-product .mp-feature-wordmark { display:block; font-size:clamp(40px,4.5vw,64px); line-height:1.05; font-weight:400; letter-spacing:-.04em; margin:25px 0; }
.jtom-mes-product .mp-feature-aside em { color:var(--mp-blue); font-style:normal; }
.jtom-mes-product .mp-feature-aside p { font-size:14px; color:#536d7b; }
.jtom-mes-product .mp-feature-aside .mp-text-link { margin-top:30px; }
.jtom-mes-product .mp-feature-aside a { display:inline-block; border-bottom:1px solid var(--mp-blue); font-size:20px; }
.jtom-mes-product .mp-accordions details { border-bottom:1px solid #bfcdd3; }
.jtom-mes-product .mp-accordions summary { list-style:none; display:flex; gap:22px; align-items:center; padding:25px 6px; cursor:pointer; font-size:18px; line-height:1.5; font-weight:500; }
.jtom-mes-product summary::-webkit-details-marker { display:none; }
.jtom-mes-product summary > span { font-size:18px; color:var(--mp-blue); }
.jtom-mes-product summary i { width:14px; height:14px; position:relative; margin-left:auto; flex-shrink:0; }
.jtom-mes-product summary i::before,.jtom-mes-product summary i::after { content:''; position:absolute; top:6px; left:0; width:14px; height:1px; background:currentColor; transition:transform .25s; }
.jtom-mes-product summary i::after { transform:rotate(90deg); }
.jtom-mes-product details[open] summary i::after { transform:rotate(0); }
.jtom-mes-product details[open] summary { color:var(--mp-blue); }
.jtom-mes-product .mp-detail { padding:0 6px 28px; color:#536d7b; font-size:15px; }
.jtom-mes-product .mp-detail ul { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.jtom-mes-product .mp-detail li { padding:5px 10px; border:1px solid #ccd9dd; font-size:14px; }
.jtom-mes-product .mp-integration { display:grid; grid-template-columns:1fr 40px 1.05fr 40px 1fr; gap:18px; align-items:center; padding:38px; border:1px solid var(--mp-line); }
.jtom-mes-product .mp-integration h3 { font-size:16px; margin-bottom:18px; }
.jtom-mes-product .mp-sources li { display:flex; justify-content:space-between; gap:10px; padding:12px 0; border-top:1px solid var(--mp-line); font-size:13px; }
.jtom-mes-product .mp-sources span { font-size:11px; color:#536d7b; }
.jtom-mes-product .mp-arrow { color:var(--mp-blue); font-size:24px; text-align:center; }
.jtom-mes-product .mp-hub { text-align:center; background:#06283d; padding:45px 15px; color:#fff; }
.jtom-mes-product .mp-hub-kicker { font-size:9px; color:#b1c5cd; letter-spacing:.1em; }
.jtom-mes-product .mp-hub-brand { display:block; font-size:28px; font-weight:400; color:var(--mp-lime); margin:12px 0; }
.jtom-mes-product .mp-hub p { font-size:12px; }
.jtom-mes-product .mp-destination p { font-size:13px; color:#536d7b; margin-top:14px; }
.jtom-mes-product .mp-destination b { display:block; color:var(--mp-ink); font-weight:500; }
.jtom-mes-product .mp-note { color:#536d7b; font-size:12px; margin-top:17px; }
.jtom-mes-product .mp-consult { --mp-band:#cacbc2; padding:75px 0; }
.jtom-mes-product .mp-consult .mp-eyebrow::before { background:var(--mp-ink); }
.jtom-mes-product .mp-consult-grid { display:flex; justify-content:space-between; align-items:center; gap:40px; }
.jtom-mes-product .mp-consult p:last-child { font-size:15px; margin-top:20px; }
.jtom-mes-product .mp-consult-action,.jtom-mes-product .mp-consult .mp-button { flex-shrink:0; }
.jtom-mes-product .mes-reveal { transition:opacity .7s,translate .8s cubic-bezier(.2,.7,.2,1); }
.jtom-mes-product .mes-reveal-pending { opacity:0; translate:0 22px; }
.jtom-mes-product .mes-in-view .mp-connector i { animation:mp-data-flow 1.4s ease-in-out 3; }
.jtom-mes-product details[open] .mp-detail { animation:mp-detail-in .3s ease; }
.jtom-mes-product .mes-reading-progress { position:fixed; inset:0 0 auto; height:3px; background:var(--mp-lime); z-index:1000; transform-origin:left; pointer-events:none; }
@keyframes mp-data-flow { from { transform:translateY(0); opacity:0; } 30% { opacity:1; } to { transform:translateY(28px); opacity:0; } }
@keyframes mp-detail-in { from { opacity:0; transform:translateY(7px); } to { opacity:1; transform:translateY(0); } }
@media (max-width:1050px) {
 .jtom-mes-product .mp-hero-grid,.jtom-mes-product .mp-overview-grid,.jtom-mes-product .mp-heading,.jtom-mes-product .mp-faq-grid,.jtom-mes-product .mp-capabilities { gap:40px; }
 .jtom-mes-product .mp-integration { padding:25px; grid-template-columns:1fr; }
 .jtom-mes-product .mp-arrow { transform:rotate(90deg); }
}
@media (max-width:760px) {
 .jtom-mes-product .mp-shell { width:calc(100% - 40px); }
 .jtom-mes-product .mp-hero-grid,.jtom-mes-product .mp-overview-grid,.jtom-mes-product .mp-heading,.jtom-mes-product .mp-faq-grid,.jtom-mes-product .mp-capabilities { grid-template-columns:1fr; }
 .jtom-mes-product .mp-hero-grid { padding:55px 0; gap:50px; }
 .jtom-mes-product h1 { font-size:clamp(48px,11vw,76px); }
 .jtom-mes-product .mp-section { padding:65px 0; }
 .jtom-mes-product .mp-hero-caption { flex-wrap:wrap; }
 .jtom-mes-product .mp-feature-wordmark { font-size:48px; }
 .jtom-mes-product .mp-heading { margin-bottom:30px; }
 .jtom-mes-product .mp-blueprint { padding:18px; }
 .jtom-mes-product .mp-navigation .mp-shell { display:grid; grid-template-columns:repeat(2,1fr); }
 .jtom-mes-product .mp-navigation a { border-bottom:1px solid var(--mp-line); }
 .jtom-mes-product .mp-accordions summary { font-size:16px; gap:13px; }
 .jtom-mes-product .mp-consult-grid { flex-direction:column; align-items:flex-start; }
}
@media (prefers-reduced-motion:reduce) {
 .jtom-mes-product *, .jtom-mes-product *::before,.jtom-mes-product *::after { animation:none !important; transition:none !important; }
 .jtom-mes-product .mes-reveal-pending { opacity:1; translate:none; }
}