@charset "utf-8";
.sec-tit p {margin-top: var(--space-24); font-size: var(--font-size-20); font-weight: 400; line-height: 1.7em;}
.root_daum_roughmap .wrap_map, .root_daum_roughmap, .direction-map iframe {width: 100% !important; height: 100% !important;}

.company-layout-cnt .group {display: flex; gap: 25px clamp(35px, calc(50 / var(--inner) * 100vw), 80px);}
.company-layout-cnt .group:not(:last-child) {margin-bottom: var(--space-80);}
.company-layout-logo {display: flex; justify-content: center; align-items: center; width: 50%; padding: 20px; background: url('/images/sub/bg-layout-logo.jpg') no-repeat center center / cover;}
.company-layout-txt {padding: var(--space-40) 0;}
.company-layout-head .tag {margin-bottom: 10px; font-weight: 500; color: #a8a8a8;}
.company-layout-head h3 {margin-bottom: var(--space-24); font-size: var(--font-size-40); font-weight: 600; line-height: 1.35em; color: var(--dark-color);}
.company-layout-head p {font-size: var(--font-size-20); line-height: 1.7em;}
.company-layout-body {margin-top: var(--space-40); font-size: var(--font-size-18); line-height: 1.6667em; color: #676767;}
.company-layout-body h4 {display: flex; margin-bottom: 10px; font-size: var(--font-size-16); font-weight: 500; line-height: 1.5em;}
.company-partner-cards {display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-40);}
.company-partner-card {position: relative; display: flex; flex-direction: column; border-radius: var(--radius-16); overflow: hidden;}
.company-partner-card:after {content: ''; position: absolute; inset: 0; border-radius: var(--radius-16); border: 1px solid #eee; pointer-events: none;}
.company-partner-head {display: flex; align-items: stretch; min-height: 88px;}
.company-partner-brand {display: flex; align-items: center; justify-content: center; padding: var(--space-24) 48px; font-size: var(--font-size-24); font-weight: 600; line-height: 1.6667em; letter-spacing: -0.02em; white-space: nowrap;}
.company-partner-card--netson .company-partner-brand {background: #fff200; color: #121212;}
.company-partner-card--netcon .company-partner-brand,
.company-partner-card--netson .company-partner-brand2 {background: #ee2d29; color: #fff;}
.company-partner-inquiry {display: flex; flex: 1; align-items: center; justify-content: center; gap: var(--space-16); padding: var(--space-24) var(--space-34); background: #f6f6f6; font-size: var(--font-size-18); font-weight: 500; line-height: 1.6667em; letter-spacing: -0.03em; color: #505050; text-align: center;}
.company-partner-inquiry a {font-size: var(--font-size-20); font-weight: 600; line-height: 1.7em; letter-spacing: -0.03em; color: #2c2c2c; text-decoration: none;}
.company-partner-body {display: flex; flex: 1; align-items: center; justify-content: center; min-height: 292px; padding: var(--space-34) 16px;}
.company-partner-logo {width: calc(269px * 1.67 * 0.8); max-width: calc(269px * 1.67 * 0.8); aspect-ratio: 269/60; object-fit: contain;}
.company-partner-distributors {display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; width: 100%;}
.company-partner-distributors li {display: flex; flex-direction: column; align-items: center; text-align: center;}
.company-partner-thumb {display: flex; align-items: center; justify-content: center; width: 100%; aspect-ratio: 216/96; margin-bottom: var(--space-30);}
.company-partner-thumb img {max-width: 100%; max-height: 100%; object-fit: contain;}
.company-partner-distributors p {margin-bottom: 0; font-size: var(--font-size-16); font-weight: 500; line-height: 1.5em; color: #676767;}
.company-partner-distributors a {font-size: var(--font-size-20); font-weight: 600; line-height: 1.7em; color: #2c2c2c; text-decoration: none;}
.company-partner-overseas {display: flex; align-items: center; gap: 12px; margin-top: 30px; font-size: var(--font-size-18); font-weight: 500; line-height: 1.6667em; letter-spacing: -0.02em; color: #2c2c2c;}
.company-partner-overseas span {display: flex; align-items: center; gap: 8px; color: #676767;}
.company-partner-overseas span:before {content: ''; width: 8px; height: 8px; border-radius: 500px; background: #ccc;}
.company-partner-overseas a {color: #2c2c2c; text-decoration: none;}
.direction-map {height: clamp(250px, calc(480 / var(--inner) * 100vw), 480px); margin-bottom: var(--space-50);}

.direction-body {display: flex; justify-content: space-between; gap: 20px 35px; margin-bottom: var(--space-40);}
.page-direction .icon {display: flex; margin-bottom: var(--space-40); width: fit-content; padding: var(--space-16); background: var(--dark-color); border-radius: 100%;}
.direction-boxes {display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px;}
.direction-box {padding: var(--space-40); border-radius: var(--radius-16); border: 1px solid #EEE; font-weight: 500; color: #878787;}
.transport-info {display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-40); padding: var(--space-40); border-radius: var(--radius-16); background: #F6F6F6;}
.page-direction .transport-info .icon {background: var(--primary-color); margin-bottom: var(--space-20);}
.transport-info h5 {margin: 0 0 8px;}
.transport-info li {display: flex; gap: 8px; align-items: center;}
.subway-line {display: flex; justify-content: center; align-items: center; width: 24px; height: 24px; border-radius: 100%; background: #843BD2; font-size: var(--font-size-14); line-height: 1.1143em; font-weight: 700; color:#fff;}
.input-wrap {display: flex; flex-wrap: wrap; gap: 8px var(--space-30);}

/* product */
#container.container-product {display:flex; width:100%; max-width:1460px; padding-top: var(--space-80); padding-left:var(--container-space); padding-right:var(--container-space); margin:0 auto;}

#pnb {width:240px; margin-right:clamp(20px, calc(80 / var(--inner) * 100vw), 80px); margin-bottom:50px;}
.pnb {border-radius: 8px; border: 1px solid #eee; border: 1px solid #eee; overflow: hidden; background: #FAFAFA;}
.pnb > ul > li:not(:last-child) {border-bottom:1px solid #eee;}
.pnb > ul > li > a {display:flex; justify-content:space-between; align-items:center; padding:var(--space-20) var(--space-24); color:#a8a8a8; font-size:var(--font-size-18); font-weight:500; line-height:1.33em;}
.pnb > ul > li > a:after {content:""; width:20px; height:20px; margin-left:8px; background:url("/images/common/pnb-arrow.svg") 50% 50% no-repeat; background-size:contain; transition:.2s; opacity: 0; transform: translateY(20px);}
.pnb > ul > li > a:hover {color:var(--dark-color);}
.pnb > ul > li > a:hover::after {transform:translateY(0); opacity: 1;}
.pnb > ul > li.active > a {color:var(--dark-color); background: var(--primary-color); font-weight:700;}
.pnb > ul > li.active > a:after {opacity: 1; transform: translateY(0);}
.pnb .submenu {padding:13px 20px; background:#fafafa; border-top:2px solid var(--primary-color);}
.pnb .submenu ul li {padding:6px 0;}
.pnb .submenu ul li a {position:relative; display:block; padding:0 0 0 12px; color:#505050; font-size:15px; line-height:1.33em;}
.pnb .submenu ul li a:before {content:""; position:absolute; top:6px; left:0; width:4px; height:4px; background:#ccc;}
.pnb .submenu ul li a:hover,
.pnb .submenu ul li.active a {color:var(--primary-color);}

.pnb-m {display:none;}
.pnb-m .depth1 ul {display:flex; width: max-content; min-width: 100%;}
.pnb-m .depth1 ul li {flex:1 1 auto; width: auto; text-align:center; border:1px solid #ddd; border-left:0;}
.pnb-m .depth1 ul li:last-child {border-right:0;}
.pnb-m .depth1 ul li a {display:flex; flex-direction:column; justify-content:center; align-items:center; width:100%; height:var(--lnb-height); padding:0 15px; color:#505050; font-size:16px; font-weight:500; line-height:1.2em; letter-spacing:-.03em;}
.pnb-m .depth1 ul li.active {background:var(--primary-color); border-color:var(--primary-color);}
.pnb-m .depth1 ul li.active a {color:var(--dark-color);}
.pnb-m .depth2 {padding:15px 5px; background:#fafafa; border-bottom:1px solid #ddd;}
.pnb-m .depth2 ul {display:flex;}
.pnb-m .depth2 ul li {width:auto; padding:0 15px;}
.pnb-m .depth2 ul li a {position:relative; display:block; padding:0 0 0 12px; color:#505050; font-size:14px; line-height:1.33em;}
.pnb-m .depth2 ul li a:before {content:""; position:absolute; top:6px; left:0; width:4px; height:4px; background:#ccc;}
.pnb-m .depth2 ul li.active a {color:var(--primary-color);}
.container-product #contArea {flex:1 1 auto; min-width:0; width:1%; padding: 0;}

@media (max-width: 640px) {
	.pnb-m .depth1 ul li a {height:45px; font-size:15px;}
	.pnb-m .depth2 {padding:13px 5px;}
	.pnb-m .depth2 ul li {width:auto; padding:0 10px;}
	.pnb-m .depth2 ul li a {position:relative; display:block; padding:0 0 0 12px; color:#505050; font-size:14px; line-height:1.33em;}
}

/* solution - poe */
.page-solution-poe {display: flex; flex-direction: column; gap: clamp(60px, calc(100 / var(--inner) * 100vw), 100px);}
.poe-hero {display: flex; flex-direction: column; gap: clamp(40px, calc(100 / var(--inner) * 100vw), 100px);}
.poe-hero-head {display: flex; flex-direction: column; align-items: center; gap: var(--space-24); text-align: center;}
.poe-hero-head h3 {display: flex; flex-direction: column; align-items: center; margin: 0;}
.poe-hero-title {font-size: clamp(28px, calc(48 / var(--inner) * 100vw), 48px); font-weight: 600; line-height: 1.4167em; letter-spacing: -0.02em; color: #2c2c2c;}
.poe-hero-title--gradient {background: linear-gradient(90deg, #fff200 0%, #ee2d29 100%); -webkit-background-clip: text; background-clip: text; color: transparent;}
.poe-hero-head p {margin: 0; font-size: var(--font-size-20); font-weight: 400; line-height: 1.7em; letter-spacing: -0.03em; color: #505050;}
.poe-hero-visual {display: flex; align-items: center; justify-content: center; width: 100%; padding: clamp(30px, calc(80 / var(--inner) * 100vw), 130px) 20px; border-radius: var(--radius-16); background: #f6f6f6; overflow: hidden;}
.poe-hero-visual img {width: 100%; max-width: 880px; height: auto; aspect-ratio: 880/160;object-fit: contain;}
.poe-point-list {display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;}
.poe-point-item {display: flex; flex-direction: column; align-items: center; gap: var(--space-20); padding: var(--space-40) 16px; border: 1px solid #eee; border-radius: var(--radius-16);}
.poe-point-icon {display: flex; align-items: center; justify-content: center; width: clamp(72px, calc(100 / var(--inner) * 100vw), 100px); height: clamp(72px, calc(100 / var(--inner) * 100vw), 100px); border-radius: 500px; background: #fff200;}
.poe-point-icon img {width: 46px; height: 46px; object-fit: contain;}
.poe-point-item strong {font-size: var(--font-size-24); font-weight: 600; line-height: 1.6667em; letter-spacing: -0.02em; color: #2c2c2c; text-align: center;}
.poe-sec-tit {margin: 0 0 var(--space-40); font-size: clamp(26px, calc(38 / var(--inner) * 100vw), 38px); font-weight: 600; line-height: 1.3684em; letter-spacing: -0.02em; color: #2c2c2c;}
.poe-sec-tit em {font-style: normal; color: #ee2d29;}
.poe-use-grid {display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;}
.poe-use-card {position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: clamp(260px, calc(360 / var(--inner) * 100vw), 360px); border-radius: var(--radius-16); overflow: hidden;}
.poe-use-bg {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: var(--radius-16);}
.poe-use-icon {position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 72px; height: 72px; margin: var(--space-24); border-radius: 10px; background: #121212;}
.poe-use-icon img {width: 46px; height: 46px; object-fit: contain;}
.poe-use-foot {position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: var(--space-24); background: rgba(0, 0, 0, 0.28);}
.poe-use-foot strong {font-size: clamp(22px, calc(28 / var(--inner) * 100vw), 28px); font-weight: 600; line-height: 1.5em; letter-spacing: -0.02em; color: #fff; white-space: nowrap;}
.poe-use-tags {display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px;}
.poe-use-tags span {display: inline-flex; align-items: center; justify-content: center; padding: 8px 12px; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 500px; background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(12px); font-size: 15px; font-weight: 500; line-height: 1.0667em; letter-spacing: -0.02em; color: #fff; white-space: nowrap;}
.poe-check-list {display: flex; flex-direction: column;}
.poe-check-list li {display: flex; align-items: center; gap: 20px; padding: 44px 0; border-top: 1px solid #eee;}
.poe-check-list li:last-child {padding-bottom: 0;}
.poe-check-num {display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 34px; height: 34px; border-radius: 500px; background: #fff200; font-size: var(--font-size-14); font-weight: 600; line-height: 1.1429em; letter-spacing: -0.02em; color: #2c2c2c;}
.poe-check-list strong {flex-shrink: 0; width: clamp(180px, calc(360 / var(--inner) * 100vw), 360px); font-size: var(--font-size-24); font-weight: 600; line-height: 1.6667em; letter-spacing: -0.02em; color: #2c2c2c;}
.poe-check-list p {flex: 1; margin: 0; min-width: 0; font-size: var(--font-size-20); font-weight: 400; line-height: 1.7em; letter-spacing: -0.02em; color: #505050;}
.poe-feature-grid {display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;}
.poe-feature-grid li {display: flex; flex-direction: column; gap: 12px; padding: var(--space-34); border: 1px solid #eee; border-radius: var(--radius-16); background: #fff;}
.poe-feature-grid strong {display: flex; align-items: center; gap: 12px; font-size: var(--font-size-24); font-weight: 600; line-height: 1.6667em; letter-spacing: -0.02em; color: #2c2c2c;}
.poe-feature-dot {flex-shrink: 0; width: 6px; height: 6px; border-radius: 500px; background: #ee2d29;}
.poe-feature-grid p {margin: 0; font-size: var(--font-size-18); font-weight: 400; line-height: 1.6667em; letter-spacing: -0.02em; color: #676767;}

/* solution - differ */
.page-solution-differ {display: flex; flex-direction: column; gap: clamp(60px, calc(100 / var(--inner) * 100vw), 100px);}
.differ-hero {display: flex; flex-direction: column; gap: clamp(40px, calc(100 / var(--inner) * 100vw), 100px);}
.differ-hero-head {display: flex; flex-direction: column; align-items: center; gap: var(--space-24); text-align: center;}
.differ-hero-head h3 {display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin: 0;}
.differ-hero-title {font-size: clamp(28px, calc(48 / var(--inner) * 100vw), 48px); font-weight: 600; line-height: 1.4167em; letter-spacing: -0.02em; color: #2c2c2c;}
.differ-hero-title--gradient {background: linear-gradient(90deg, #fff200 0%, #ee2d29 100%); -webkit-background-clip: text; background-clip: text; color: transparent;}
.differ-hero-head p {margin: 0; font-size: var(--font-size-20); font-weight: 400; line-height: 1.7em; letter-spacing: -0.03em; color: #505050;}
.differ-compare {display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, calc(40 / var(--inner) * 100vw), 40px);}
.differ-col--poe {padding-right: clamp(24px, calc(40 / var(--inner) * 100vw), 40px); border-right: 1px dashed #ccc;}
.differ-col {display: flex; flex-direction: column; gap: 16px;}
.differ-visual {display: flex; flex-direction: column; align-items: center; justify-content: center; gap: clamp(20px, calc(48 / var(--inner) * 100vw), 58px); width: 100%; padding:var(--space-60) 15px; border-radius: var(--radius-16); background: #f6f6f6; overflow: hidden;}
.differ-badge {display: inline-flex; align-items: center; justify-content: center; padding: 10px 24px; border-radius: 500px; background: #fff; font-size: clamp(18px, calc(22 / var(--inner) * 100vw), 22px); font-weight: 600; line-height: 1.6364em; letter-spacing: -0.02em;}
.differ-badge--poe {border: 1px solid #ee2d29; color: #ee2d29;}
.differ-badge--normal {border: 1px solid #dfdfdf; color: #676767;}
.differ-visual img {width: auto; max-width: 80%; height: auto; max-height: 100px; object-fit: contain;}
.differ-feat-grid {display: grid; grid-template-columns: 1fr 1fr; gap: 16px;}
.differ-feat-grid li {display: flex; align-items: center; gap: 20px; padding: var(--space-34); border: 1px solid #eee; border-radius: var(--radius-16);}
.differ-feat-icon {display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: clamp(64px, calc(100 / var(--inner) * 100vw), 100px); height: clamp(64px, calc(100 / var(--inner) * 100vw), 100px); border-radius: 500px;}
.differ-col--poe .differ-feat-icon {background: #fff200;}
.differ-col--normal .differ-feat-icon {background: #121212;}
.differ-feat-icon img {width: 46px; height: 46px; object-fit: contain;}
.differ-feat-txt {display: flex; flex-direction: column; gap: 4px; min-width: 0;}
.differ-feat-txt strong {font-size: clamp(18px, calc(22 / var(--inner) * 100vw), 22px); font-weight: 600; line-height: 1.6364em; letter-spacing: -0.02em; color: #2c2c2c;}
.differ-feat-txt span {font-size: var(--font-size-16); font-weight: 400; line-height: 1.5em; letter-spacing: -0.02em; color: #505050;}
.differ-table-wrap {width: 100%; overflow-x: auto; border-top: 1px solid #2c2c2c;}
.differ-table {width: 100%; min-width: 720px; border-collapse: collapse; table-layout: fixed;}
.differ-table th, .differ-table td {padding: var(--space-24); border-bottom: 1px solid #dfdfdf; border-right: 1px solid #dfdfdf; font-size: var(--font-size-18); letter-spacing: -0.02em; vertical-align: middle; text-align: left;}
.differ-table th:last-child, .differ-table td:last-child {border-right: 0;}
.differ-table thead th {font-weight: 500; line-height: 1.7em; text-align: center;}
.differ-table thead th:first-child {width: 240px; background: #f8f8f8; color: #878787;}
.differ-th-poe {background: #fff200; color: #2c2c2c;}
.differ-th-normal {background: #121212; color: #fff;}
.differ-table tbody th {width: 240px; background: #f8f8f8; font-weight: 600; line-height: 1.6667em; color: #2c2c2c; text-align: center;}
.differ-table tbody td {font-weight: 500; line-height: 1.6667em; color: #2c2c2c;}
.differ-table tbody td:last-child {font-weight: 400; color: #676767;}
.differ-summary {display: flex; align-items: center; gap: 10px; margin-top: var(--space-40); padding: var(--space-34); border-radius: var(--radius-16); background: #f6f6f6;}
.differ-summary-tit {display: flex; align-items: center; gap: 10px; flex-shrink: 0; width: 160px;}
.differ-summary-tit img {width: 20px; height: 20px;}
.differ-summary-tit strong {font-size: var(--font-size-24); font-weight: 600; line-height: 1.6667em; letter-spacing: -0.02em; color: #2c2c2c;}
.differ-summary p {margin: 0; font-size: var(--font-size-18); font-weight: 400; line-height: 1.6667em; letter-spacing: -0.02em; color: #676767;}

/* solution - l2l3 */
.page-solution-l2l3 {display: flex; flex-direction: column; gap: clamp(60px, calc(100 / var(--inner) * 100vw), 100px);}
.l2l3-hero {display: flex; flex-direction: column; gap: clamp(40px, calc(100 / var(--inner) * 100vw), 100px);}
.l2l3-hero-head {display: flex; flex-direction: column; align-items: center; gap: var(--space-24); text-align: center;}
.l2l3-hero-head h3 {display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin: 0; font-size: clamp(28px, calc(48 / var(--inner) * 100vw), 48px); font-weight: 600; line-height: 1.4167em; letter-spacing: -0.02em;}
.l2l3-title-l2 {color: #ee2d29;}
.l2l3-title-vs {color: #878787;}
.l2l3-title-l3 {color: #5b0503;}
.l2l3-hero-sub {margin: 0; font-size: var(--font-size-24); font-weight: 500; line-height: 1.6667em; letter-spacing: -0.03em; color: #2c2c2c;}
.l2l3-hero-desc {margin: 0; font-size: var(--font-size-20); font-weight: 400; line-height: 1.7em; letter-spacing: -0.03em; color: #505050;}
.l2l3-compare {display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, calc(40 / var(--inner) * 100vw), 40px);}
.l2l3-col--l2 {padding-right: clamp(24px, calc(40 / var(--inner) * 100vw), 40px); border-right: 1px dashed #ccc;}
.l2l3-col {display: flex; flex-direction: column; gap: 16px;}
.l2l3-visual {display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-40); width: 100%; padding: var(--space-40) 15px; border-radius: var(--radius-16); background: #f6f6f6; overflow: hidden;}
.l2l3-badge {display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 10px 24px; border-radius: 500px; background: #fff;}
.l2l3-badge--l2 {border: 1px solid #ee2d29; color: #ee2d29;}
.l2l3-badge--l3 {border: 1px solid #5b0503; color: #5b0503;}
.l2l3-badge strong {font-size: clamp(18px, calc(22 / var(--inner) * 100vw), 22px); font-weight: 600; line-height: 1.6364em; letter-spacing: -0.02em;}
.l2l3-badge span {font-size: var(--font-size-16); font-weight: 500; line-height: 1.5em; letter-spacing: -0.02em;}
.l2l3-visual > img {width: auto; max-width: 90%; height: auto; max-height: 80px; object-fit: contain;}
.l2l3-model {display: inline-flex; align-items: center; justify-content: center; padding: 10px 24px; border: 1px solid #eee; border-radius: 500px; background: #fff; font-size: var(--font-size-16); font-weight: 500; line-height: 1.5em; letter-spacing: -0.02em; color: #505050;}
.l2l3-feat-grid {display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;}
.l2l3-feat-grid li {display: flex; flex-direction: column; align-items: center; gap: var(--space-20); padding: var(--space-34) 12px; border: 1px solid #eee; border-radius: var(--radius-16); text-align: center;}
.l2l3-feat-icon {display: flex; align-items: center; justify-content: center; width: clamp(64px, calc(100 / var(--inner) * 100vw), 100px); height: clamp(64px, calc(100 / var(--inner) * 100vw), 100px); border-radius: 500px;}
.l2l3-col--l2 .l2l3-feat-icon {background: #ffeded;}
.l2l3-col--l3 .l2l3-feat-icon {background: #f2ebeb;}
.l2l3-feat-icon img {width: 46px; height: 46px; object-fit: contain;}
.l2l3-feat-grid strong {font-size: clamp(18px, calc(22 / var(--inner) * 100vw), 22px); font-weight: 600; line-height: 1.6364em; letter-spacing: -0.02em; color: #2c2c2c;}
.l2l3-feat-grid span {font-size: var(--font-size-16); font-weight: 400; line-height: 1.5em; letter-spacing: -0.02em; color: #505050;}
.l2l3-th-l2 {background: #ee2d29 !important; color: #fff !important;}
.l2l3-th-l3 {background: #5b0503 !important; color: #fff !important;}
.l2l3-table tbody td {font-weight: 400; color: #2c2c2c;}
.l2l3-table tbody td:last-child {font-weight: 400; color: #2c2c2c;}
.l2l3-fit {display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, calc(40 / var(--inner) * 100vw), 40px);}
.l2l3-fit-col--l2 {padding-right: clamp(24px, calc(40 / var(--inner) * 100vw), 40px); border-right: 1px dashed #ccc;}
.l2l3-fit-col {display: flex; flex-direction: column; gap: var(--space-20);}
.l2l3-fit-col h4 {display: flex; align-items: center; gap: 10px; margin: 0; font-size: var(--font-size-24); font-weight: 600; line-height: 1.6667em; letter-spacing: -0.02em; color: #2c2c2c;}
.l2l3-fit-col h4 img {width: 20px; height: 20px;}
.l2l3-fit-card {display: flex; align-items: center; gap: clamp(20px, calc(40 / var(--inner) * 100vw), 40px); padding: var(--space-40) var(--space-34); border: 1px solid #eee; border-radius: var(--radius-16); background: #fff;}
.l2l3-fit-diagram {flex: 1; min-width: 0;}
.l2l3-fit-diagram img {display: block; width: 100%; height: auto;}
.l2l3-fit-list {display: flex; flex: 1; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; min-width: 0;}
.l2l3-fit-list li {display: flex; align-items: center; gap: 8px; font-size: var(--font-size-18); font-weight: 400; line-height: 1.6667em; letter-spacing: -0.02em; color: #2c2c2c;}
.l2l3-fit-list li:before {content: ''; flex-shrink: 0; width: 6px; height: 6px; border-radius: 500px;}
.l2l3-fit-col--l2 .l2l3-fit-list li:before {background: #ee2d29;}
.l2l3-fit-col--l3 .l2l3-fit-list li:before {background: #5b0503;}

/* solution - watch */
.page-solution-watch {display: flex; flex-direction: column; gap: clamp(60px, calc(100 / var(--inner) * 100vw), 100px);}
.watch-hero {display: flex; flex-direction: column; gap: clamp(40px, calc(100 / var(--inner) * 100vw), 100px);}
.watch-hero-head {display: flex; flex-direction: column; align-items: center; gap: var(--space-24); text-align: center;}
.watch-hero-head h3 {display: flex; flex-wrap: wrap; align-items: center; justify-content: center; margin: 0;}
.watch-hero-title {font-size: clamp(28px, calc(48 / var(--inner) * 100vw), 48px); font-weight: 600; line-height: 1.4167em; letter-spacing: -0.02em; color: #2c2c2c;}
.watch-hero-title--gradient {background: linear-gradient(90deg, #fff200 0%, #ee2d29 100%); -webkit-background-clip: text; background-clip: text; color: transparent;}
.watch-hero-sub {margin: 0; font-size: var(--font-size-24); font-weight: 500; line-height: 1.6667em; letter-spacing: -0.03em; color: #2c2c2c;}
.watch-hero-desc {margin: 0; font-size: var(--font-size-20); font-weight: 400; line-height: 1.7em; letter-spacing: -0.03em; color: #505050;}
.watch-hero-visual {display: flex; align-items: center; justify-content: center; width: 100%; padding: clamp(30px, calc(150 / var(--inner) * 100vw), 130px) 15px; border-radius: var(--radius-16); background: #f6f6f6; overflow: hidden;}
.watch-hero-visual img {width: min(100%, 898px); height: auto; object-fit: contain;}
.watch-point-list {display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 0; padding: 0; list-style: none;}
.watch-point-list li {display: flex; align-items: center; justify-content: center; padding: var(--space-40) 16px; border: 1px solid #eee; border-radius: var(--radius-16); font-size: var(--font-size-24); font-weight: 600; line-height: 1.6667em; letter-spacing: -0.02em; color: #2c2c2c; text-align: center;}
.watch-step-list {display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; padding: 0; list-style: none; border-radius: var(--radius-16); background: #f6f6f6; overflow: hidden;}
.watch-step-list li {position: relative; display: flex; flex-direction: column; align-items: center; gap: 30px; padding: 70px 16px 50px; text-align: center;}
.watch-step-list li:not(:last-child) {border-right: 1px solid #dfdfdf;}
.watch-step-list li:not(:last-child):after {content: ''; position: absolute; top: 50%; right: -18px; z-index: 1; width: 36px; height: 36px; border: 1px solid #dfdfdf; border-radius: 500px; background: #fff url('/images/sub/watch/watch-arrow.svg') center / 12px no-repeat; transform: translateY(-50%);}
.watch-step-icon {display: flex; align-items: center; justify-content: center; width: 64px; height: 64px;}
.watch-step-icon img {width: 62px; height: 62px; object-fit: contain;}
.watch-step-txt {display: flex; flex-direction: column; align-items: center; gap: 4px;}
.watch-step-num {font-size: var(--font-size-16); font-weight: 500; line-height: 1.5em; letter-spacing: -0.02em; color: #ee2d29;}
.watch-step-list strong {font-size: var(--font-size-24); font-weight: 600; line-height: 1.6667em; letter-spacing: -0.02em; color: #505050;}
.watch-step-list p {margin: 0; font-size: var(--font-size-18); font-weight: 400; line-height: 1.6667em; letter-spacing: -0.02em; color: #505050;}
.watch-use-grid {display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 0; padding: 0; list-style: none;}
.watch-use-card {position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: clamp(260px, calc(420 / var(--inner) * 100vw), 420px); border-radius: var(--radius-16); overflow: hidden;}
.watch-use-bg {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: var(--radius-16);}
.watch-use-foot {position: relative; z-index: 1; display: flex; align-items: flex-end; padding: var(--space-24); background: rgba(0, 0, 0, 0.28);}
.watch-use-foot strong {font-size: var(--font-size-24); font-weight: 600; line-height: 1.6667em; letter-spacing: -0.02em; color: #fff;}

.company-partner-card--netcon .company-partner-body {min-height:0; padding:10px 12px; align-items:flex-start;}
.company-partner-card--netcon .company-partner-distributors {row-gap:8px;}
.company-partner-card--netcon .company-partner-thumb {margin-bottom:0;}