@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.root_daum_roughmap {width:100% !important; height:clamp(250px, calc( 400 / var(--inner) * 100vw ), 400px) !important;}
.root_daum_roughmap .wrap_map {height:clamp(250px, calc( 400 / var(--inner) * 100vw ), 400px) !important;}
.roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.roughmap_lebel_text:after {content:"세송아이티"; font-size:12px; line-height:15px;}

.bullet-item .bullet-list {position:relative; padding-left:15px; margin-top:10px; line-height:1.3;}
.bullet-item .bullet-list:first-child {margin-top:0;}
.bullet-item .bullet-list::before {position:absolute; content:''; left:0; top:9px; width:3px; height: 3px; background:var(--color-primary); border-radius: 50%;}
.bullet-item .bullet-list.none {padding-left: 0;}
.bullet-item .bullet-list.none::before {display: none;}
.bulletitem2 { padding-left: 0.6em; text-indent: -0.6em;}

.bg-gray {background:#fafafa;}
.overhidden {overflow: hidden;}
.subsec-pd {padding: clamp(50px, calc( 150 / var(--inner) * 100vw ), 150px) 0;}
.subsec-pdt {padding-top: clamp(50px, calc( 120 / var(--inner) * 100vw ), 120px);}

.radiobx {display: flex; flex-wrap: wrap;}
.radiobx .item {display: flex;align-items: center; min-height: clamp(38px, calc( 44 / var(--inner) * 100vw ), 44px);}
.radiobx .item:not(:last-child) {margin-right: clamp(15px, calc( 40 / var(--inner) * 100vw ), 40px);}

.greet-img {margin-bottom:var(--padding-80); text-align: center;}
.greet-img img {width:100%;}
.greet-flx {letter-spacing: -0.5px;}
.greet-flx .title {font-size: var(--font-size-42); font-weight: 600; line-height: 1.2;}
.greet-flx .textwid {max-width:600px; margin-left: auto; padding-top: var(--padding-60);}
.greet-flx .textwid .decbx {display: flex;flex-direction: column;gap:var(--padding-20);}
.greet-flx .textwid .dec {font-size: var(--font-size-18); line-height: 1.66; color: var(--color-body);}
.greet-flx .signbx {display: flex;align-items: center;justify-content: flex-end; gap: 12px; margin-top: var(--padding-80);}
.greet-flx .signbx .txt {font-size: var(--font-size-22); font-weight: 600;}
.greet-flx .signbx img {width: clamp(50px, calc( 86 / var(--inner) * 100vw ), 86px);}

.history-timeline {position:relative;}
.history-timeline .timeline-line {position:absolute; top:0; left:50%; transform:translateX(-50%); width:1px; height:100%; background:#ddd; z-index:1;}
.history-timeline .timeline-item {position:relative; display:flex; justify-content: center;margin-bottom:clamp(60px, calc( 150 / var(--inner) * 100vw ), 150px); z-index:2;}
.history-timeline .timeline-item:last-child {margin-bottom:0;}
.history-timeline .timeline-year { width:calc(50% - clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px));}
.history-timeline .timeline-year .years {color:var(--color-primary); font-size:var(--font-size-50); font-weight:700; line-height:1; letter-spacing:-1.5px; white-space:nowrap;}
.history-timeline .timeline-year .small {display: inline-block; padding-left: 5px; font-size:var(--font-size-28); color: var(--color-body); line-height:1; letter-spacing:-0.6px;}
.history-timeline .timeline-dot {position:absolute; top:0; left:50%; transform:translatex(-50%); width:clamp(8px, calc( 12 / var(--inner) * 100vw ), 12px); height:clamp(8px, calc( 12 / var(--inner) * 100vw ), 12px); background:var(--color-primary); border-radius:50%; z-index:3;}
.history-timeline .timeline-content {color:var(--color-body); letter-spacing:-0.6px; width:calc(50% - clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px));}
.history-timeline .timeline-text-item {display: flex;flex-direction: column;gap:var(--padding-40); margin-top: -5px;}
.history-timeline .timeline-text {display: flex;}
.history-timeline .timeline-text .year {width: clamp(75px, calc( 110 / var(--inner) * 100vw ), 110px); font-size: var(--font-size-28); font-weight: bold;  }
.history-timeline .timeline-text .textbx {flex: 1; font-size: var(--font-size-18); line-height: 1.66; font-weight: 400;}
.history-timeline .timeline-item:nth-child(odd) .timeline-year {text-align:right; padding-right:clamp(25px, calc( 60 / var(--inner) * 100vw ), 60px);}
.history-timeline .timeline-item:nth-child(odd) .timeline-content {text-align:left; padding-left:clamp(25px, calc( 60 / var(--inner) * 100vw ), 60px); order:3;}
.history-timeline .timeline-item:nth-child(even) .timeline-text {flex-direction: row-reverse;}
.history-timeline .timeline-item:nth-child(even) .timeline-year {text-align:left; padding-left:clamp(25px, calc( 60 / var(--inner) * 100vw ), 60px); order:3;}
.history-timeline .timeline-item:nth-child(even) .timeline-content {text-align:right; padding-right:clamp(25px, calc( 60 / var(--inner) * 100vw ), 60px); order:1; }

.location-infowrap {display: flex;flex-direction: column;gap: var(--padding-80 ); margin-top: var(--padding-40);}
.map-grid {display: grid;grid-template-columns: repeat(2, 1fr); gap: 20px;}
.grid-item {display: flex;  gap: var(--padding-30);}
.grid-item .location-icn {margin-top: 5px;}
.location-icn {width:clamp(20px, calc( 32 / var(--inner) * 100vw ), 32px); height:clamp(20px, calc( 32 / var(--inner) * 100vw ), 32px); }
.location-block {flex: 1; letter-spacing: -0.5px;}
.location-block-tit {margin-bottom: var(--padding-25); font-size: var(--font-size-30); font-weight: 600;}
.location-address .flx {display: flex; font-size: var(--font-size-18); font-weight: 500; color: var(--color-body);}
.location-address .name {width:50px; font-weight: 600;}
.location-address .dec {flex: 1;}
.location-address .dec.ty2 {font-size: var(--font-size-24); color:#242424; font-weight: 600;}
.location-transportation {display: flex;flex-direction: column;gap:var(--padding-30);}
.transportation-item {display: flex; flex-wrap: wrap; letter-spacing: -0.5px;}
.transportation-item .title {width: clamp(50px, calc( 80 / var(--inner) * 100vw ), 80px); font-size: var(--font-size-18); font-weight: 500;}
.transportation-item .transportationbx {flex: 1; display: flex;flex-direction: column;gap:var(--padding-20);}
.transportation-item .box-item {display: flex; align-items: center; gap: var(--padding-24); font-size:var(--font-size-18);}
.transportation-item .number {display: inline-flex;align-items: center;justify-content: center; width:clamp(80px, calc( 130 / var(--inner) * 100vw ), 130px); height: clamp(30px, calc( 45 / var(--inner) * 100vw ), 45px); border: 1px solid #ddd;}
.transportation-item .num {font-weight: 700; line-height: 1;}
.transportation-item .num.color-1 {color: #63BF60;}
.transportation-item .num.color-2 {color: #519FEF;}
.transportation-item .num.color-3 {color: #F75248;}
.transportation-item .num.color-4 {color: #009F49;}
.transportation-item .text {flex: 1; font-weight: 500; color: var(--color-body);}

.intitle-wrap .in-title {margin-bottom: var(--padding-60); font-size: var(--font-size-36); font-weight: 600; letter-spacing: -0.9px;}
.business-dev-list {display:flex; flex-direction:column; gap:var(--padding-60);}
.business-dev-item {display:flex; align-items:center; flex-wrap: wrap; gap:var(--padding-60);}
.business-dev-img {width:clamp(300px, calc( 600 / var(--inner) * 100vw ), 600px);  flex-shrink:0; }
.business-dev-img img {width:100%; overflow:hidden; border-radius:var(--border-radius-32);}
.business-dev-text {flex:1; letter-spacing: -0.5px;}
.business-dev-icn {display: block; margin-bottom: var(--padding-16);}
.business-dev-icn img {width:clamp(25px, calc( 42 / var(--inner) * 100vw ), 42px);}
.business-dev-tit { font-size:var(--font-size-28); font-weight:700; line-height:1.14;}
.business-dev-desc {margin-top: var(--padding-30); color:var(--color-body); font-size:var(--font-size-20);  line-height:1.5;}
.business-dev-item:nth-child(even) {flex-direction:row-reverse;}
.business-dev-item:nth-child(even) .business-dev-text {padding-left: var(--padding-60);}

.customer-grid {display: grid; grid-template-columns: repeat(6, 1fr); gap: var(--padding-24);}
.customer-grid .customer-img {display: flex;align-items: center;justify-content: center;padding:var(--padding-30) ; height:clamp(50px, calc( 90 / var(--inner) * 100vw ), 90px); border: 1px solid #ddd; }
.customer-grid .customer-img img {height: 100%; object-fit: scale-down;}
.customer-grid.ty2 {grid-template-columns: repeat(3, 1fr);}

.sub2_2 .intitle-wrap .in-title {margin-bottom:clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px);}