 @charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.root_daum_roughmap {width:100% !important; height:clamp(250px, calc( 450 / var(--inner) * 100vw ), 450px) !important;}
.root_daum_roughmap .wrap_map {height:clamp(250px, calc( 450 / var(--inner) * 100vw ), 450px) !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;}

.blocker {z-index: 100;}
.modal {max-width:1200px; width: 100%;}

.bg-gray {background:#fafafa;}
.overhidden {overflow: hidden;}
.subsec-pd {padding: clamp(50px, calc( 150 / var(--inner) * 100vw ), 150px) 0;}

.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);}

.overview-wrap {display: flex;align-items: center;gap: var(--padding-70); overflow: hidden; flex-wrap: wrap;}
.overview-wrap .imgbx {width: clamp(300px, calc( 646 / var(--inner) * 100vw ), 646px);}
.overview-wrap .textbx {flex: 1; display: flex;flex-direction: column;gap: var(--padding-40);letter-spacing: -0.9px;}
.overview-wrap .subtitle {font-size: var(--font-size-32); font-weight: 600;  line-height: 1.5;}
.overview-wrap .subtxt {font-size: var(--font-size-24); line-height: 1.33; color: var(--color-primary);}
.overview-wrap .decbx {display: flex;flex-direction: column;gap: var(--padding-25);}
.overview-wrap .dec {font-size: var(--font-size-18); line-height: 1.55; color: var(--color-body);}

.greet-wrap {display: flex;flex-direction: column;gap: var(--padding-50);}
.greet-wrap .imgbx img {border-radius:24px;}
.greet-wrap .text-contain {display: flex; flex-wrap: wrap; gap:30px; }
.greet-wrap .titlebx {width: clamp(180px, calc( 500 / var(--inner) * 100vw ), 500px); font-size: var(--font-size-32); font-weight: 600; letter-spacing: -0.9px;}
.greet-wrap .textbx {flex: 1; display: flex;flex-direction: column;gap: 18px; letter-spacing: -0.5px;}
.greet-wrap .decbx {display: flex;flex-direction: column;gap: var(--padding-25);} 
.greet-wrap .dec {font-size: var(--font-size-18); line-height: 1.55; color: var(--color-body);}
.greet-wrap .namebx {font-size: var(--font-size-18); font-weight: 600; line-height: 1.55; color: var(--color-body);}
 

.location-area .map {width: 100%; height:clamp(250px, calc( 440 / var(--inner) * 100vw ), 440px) ;}
.location-area .map iframe {width: 100%; height: 100%; }
.loc-head {display: flex; gap: var(--padding-12); margin-bottom: var(--padding-30);}
.loc-head .icn {margin-top: 3px;}
.loc-head img {width: clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px);}
.loc-head .title {font-size: var(--font-size-24); font-weight: 600; line-height: 1.25; letter-spacing: -0.6px; color: var(--color-body);}
.loc-bar .wrap {display: flex; align-items: center;margin-top: var(--padding-30); flex-wrap: wrap; }
.loc-bar .btn {display: flex; align-items: center; justify-content: center; width: 140px; height: clamp(50px, calc( 64 / var(--inner) * 100vw ), 64px); background: var(--color-primary); font-size: var(--font-size-18); font-weight: 600; color: var(--color-white); flex-shrink: 0;}
.loc-bar .list {display: flex; flex-wrap: wrap; gap:10px var(--padding-90); align-items: center;flex: 1; padding-left: var(--padding-60); border: 1px solid #ddd; height: stretch; } 
.loc-bar .item {display: flex; align-items: center; gap: var(--padding-30); font-size: var(--font-size-20); color: var(--color-body);}
.loc-bar .item .label {display: flex; align-items: center; gap: var(--padding-15);}
.loc-bar .item .icn {width: clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); height: clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); margin: 0; flex-shrink: 0;}
.loc-bar .item .icn img {width: 100%; height: 100%; object-fit: contain;}
.loc-bar .tit { font-weight: 500; color: var(--color-dark);}

.design-wrap { display: flex; flex-direction: column; gap: var(--padding-80); }
.design-wrap .topimg { border-radius: 16px; overflow: hidden; }
.spectblbx {width: 100%; overflow-x: auto;}
.design-wrap .spectbl { width: 100%; border-collapse: collapse; border-top: 2px solid var(--color-primary); table-layout: fixed; }
.design-wrap .spectbl th,
.design-wrap .spectbl td {border-bottom: 1px solid #ddd;}
.design-wrap .spectbl th { padding: var(--padding-20); font-size: var(--font-size-18); line-height: 1.33; letter-spacing: -0.03em; text-align: left; color: #121212; background: rgba(62, 129, 229, 0.04); border-right: 1px solid #ddd; vertical-align: middle; }
.design-wrap .spectbl td { padding: var(--padding-20); font-size: var(--font-size-18); line-height: 1.33; letter-spacing: -0.03em; color: var(--color-body);  vertical-align: middle; }

.unify-contain {overflow-x: auto;}
.unify-wrap { display: flex; flex-direction: column; gap: var(--padding-50); }
.unify-wrap .topban { display: grid; grid-template-columns: 1fr; grid-template-rows: auto; width: 100%; align-items: center; justify-items: stretch; }
.unify-wrap .topban .img { grid-column: 1; grid-row: 1; width: 100%; margin: 0; }
.unify-wrap .topban .img img { display: block; width: 100%; aspect-ratio: 1400 / 100; object-fit: cover; }
.unify-wrap .arrowtit { grid-column: 1; grid-row: 1; align-self: center; justify-self: center; position: relative; z-index: 1; margin: 0; padding: 0 var(--padding-20); font-size: var(--font-size-28); line-height: 1.33; letter-spacing: -0.03em; text-align: center; color: var(--color-white); }
.unify-wrap .flow { display: flex; flex-wrap: nowrap; align-items: flex-start; gap: var(--padding-60); width: 100%; }
.unify-wrap .col { display: flex; flex-direction: column; gap: var(--padding-50); width: calc((100% - 4 * var(--padding-20)) / 5); }
.unify-wrap .tit { display: flex; align-items: center; justify-content: center; min-height: 88px; padding: var(--padding-20); background: var(--color-primary); border-radius: 8px; text-align: center; }
.unify-wrap .tit-one { min-height: 88px; }
.unify-wrap .tit .txt { font-size: var(--font-size-18); font-weight: 600; line-height: 1.33; letter-spacing: -0.03em; color: var(--color-white); }
.unify-wrap .list { display: flex; flex-direction: column; gap: var(--padding-30); margin: 0; padding: 0; list-style: none; }
.unify-wrap .card { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--padding-10); margin: 0; padding: var(--padding-20); background: var(--color-white); border: 1px solid var(--color-primary); border-radius: 8px; box-sizing: border-box; }
.unify-wrap .card.dim { border-color: #888; }
.unify-wrap .card .icn { width: 24px; height: 24px; margin: 0; flex-shrink: 0; }
.unify-wrap .card .icn img { display: block; width: 100%; height: 100%; object-fit: contain; }
.unify-wrap .card .txt { margin: 0; font-size: var(--font-size-18); line-height: 1.33; letter-spacing: -0.03em; text-align: center; color: #121212; }

.commsection {padding: var(--padding-100) 0;}
.commsection_1 {background:url(../images/sub/talent-bg.jpg) no-repeat top left; background-size: cover;}
.commsection {display: flex;flex-direction: column;gap: var(--padding-120);}
.commsection .toptext {display: flex;flex-direction: column; gap:var(--padding-60); text-align: center;}
.commsection .toptext .title {font-size: var(--font-size-32); line-height: 1.5; letter-spacing: -0.5px; font-weight: 400;}
.commflxWrap {display: flex;flex-direction: column;gap: var(--padding-100);}
.commflxWrap .flxsec {display: flex; align-items: center; flex-wrap: wrap; gap: var(--padding-100);}
.flxsec .imgbx {width: clamp(300px, calc( 720 / var(--inner) * 100vw ), 720px);}
.flxsec .textbx {flex: 1;  letter-spacing: -0.5px;}
.flxsec .textbx .num {display: block; margin-bottom: clamp(-30px, calc( -30 / var(--inner) * 100vw ), -15px); font-size: var(--font-size-120); color: rgba(62, 129, 229, 0.08); line-height: 1; font-weight: bold;}
.flxsec .textbx .indecbx {display: flex;flex-direction: column; gap: var(--padding-30);}
.flxsec .textbx .tit {font-size: var(--font-size-32);  letter-spacing: -0.5px; font-weight: 600; color: var(--color-primary);}
.flxsec .textbx .dec {font-size: var(--font-size-18); line-height: 1.55; color: var(--color-body);}
.commflxWrap .flxsec:nth-child(even) {flex-direction: row-reverse;} 
.commflxWrap .flxsec:nth-child(even) .textbx {text-align: right;}

.jop-wrap .title {margin-bottom: var(--padding-60); font-size:var(--font-size-32); font-weight: bold; line-height: 1.5; letter-spacing: -0.5px; text-align: center;}
.jop-wrap .current {margin-bottom: var(--padding-30); font-size:var(--font-size-24); font-weight: 400; line-height: 1.58; letter-spacing: -0.5px;}
.jop-wrap .openlist { display: flex; flex-direction: column; gap: var(--padding-30); margin-top: var(--padding-30); }
.jop-wrap .openitem { display: flex; align-items: center; justify-content: space-between; gap: var(--padding-20); padding: var(--padding-40); background: var(--color-white); border: 1px solid #ddd; border-radius: 16px; box-sizing: border-box; text-decoration: none; color: inherit; transition: border-color 0.2s ease, box-shadow 0.2s ease; }
.jop-wrap .openitem:hover { border-color: var(--color-primary); box-shadow: 0 4px 24px rgba(62, 129, 229, 0.08); }
.jop-wrap .openitem:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 3px; }
.jop-wrap .openitem .cont { display: flex; align-items: flex-start; gap: var(--padding-20); padding-left: clamp(15px, calc( 25 / var(--inner) * 100vw ), 25px); flex: 1; min-width: 0; position: relative;}
.jop-wrap .openitem .cont::before {position: absolute; content: ''; left: 0; top: 0; width: clamp(4px, calc( 6 / var(--inner) * 100vw ), 6px); height: auto; aspect-ratio: 6 / 24; margin-top: 4px; background:url(../images/sub/openings-dot.svg) no-repeat center center; background-size: contain; }
.jop-wrap .openitem .body { display: flex; flex-direction: column; gap: var(--padding-25); min-width: 0; flex: 1; }
.jop-wrap .openitem .tit { margin: 0; font-size: var(--font-size-22); font-weight: 700; letter-spacing: -0.03em; color: #121212; word-break: break-word; }
.jop-wrap .openitem .meta { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--padding-20) var(--padding-40); }
.jop-wrap .openitem .cell { display: flex; flex-direction: column; gap: var(--padding-20); width: 144px; max-width: 100%; }
.jop-wrap .openitem .lab { font-size: var(--font-size-16); font-weight: 600; letter-spacing: -0.03em; color: var(--color-body); word-break: break-all;}
.jop-wrap .openitem .val { font-size: var(--font-size-16); letter-spacing: -0.03em; color: var(--color-body); word-break: break-all;}
.jop-wrap .openitem .arr { flex-shrink: 0; width: clamp(20px, calc( 24 / var(--inner) * 100vw ), 24px); height: clamp(20px, calc( 24 / var(--inner) * 100vw ), 24px); margin: 0; }
.jop-wrap .openitem .arr img { display: block; width: 100%; height: 100%; object-fit: contain; }

.jobpop {  padding: var(--padding-60); }
.jobpop .toptext {display: flex;flex-direction: column;gap: var(--padding-60);}
.jobpop .maintit { margin: 0; font-size: var(--font-size-32); font-weight: 700; line-height: 1.5; letter-spacing: -0.03em; color: #121212; }
.jobpop .intro { margin: 0; font-size: var(--font-size-18); line-height: 1.67; letter-spacing: -0.03em; color: #121212; }
.jobpop .detail { display: flex; flex-direction: column; gap: var(--padding-40); width: 100%; margin-top: var(--padding-60);}
.jobpop .sec { display: flex; flex-direction: column; gap: var(--padding-12);}
.jobpop .stit { margin: 0; font-size: var(--font-size-18); font-weight: 600; line-height: 1.67; letter-spacing: -0.03em; color: var(--color-primary); }
.jobpop .list { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; }
.jobpop .list .item { display: flex; align-items: flex-start; gap: 6px; font-size: var(--font-size-16); line-height: 1.875; letter-spacing: -0.03em; color: var(--color-body); }
.jobpop .list .item::before { content: ''; flex-shrink: 0; width: 4px; height: 4px; margin-top: 12px; border-radius: 50%; background: var(--color-body); }
.link-wrap {display: flex; flex-wrap: wrap; gap: var(--padding-20); margin-top: var(--padding-50); padding-top: var(--padding-50); border-top: 1px solid #ddd;}
.link-wrap .linkitem {display: flex;align-items: center;justify-content: center;padding: 0 20px; width: clamp(140px, calc( 200 / var(--inner) * 100vw ), 200px); height:clamp(42px, calc( 54 / var(--inner) * 100vw ), 54px); font-weight: 600; color: #999; border-radius: 60px; background: #F3F3F3; letter-spacing: -0.6px; line-height:1; border: 0; pointer-events: none; cursor: default;}
.link-wrap .linkitem.active {background: var(--color-primary); color: #fff; pointer-events: auto; cursor: pointer;}

.open-ban { position: relative; margin-top: var(--padding-100);  padding: var(--padding-50) var(--padding-20); border-radius: 16px; overflow: hidden;  background: url(../images/sub/openings-banner.jpg) no-repeat center center; background-size: cover;}
.open-ban .bancont { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--padding-20); box-sizing: border-box; text-align: center; }
.open-ban .tit {font-size: var(--font-size-32); font-weight: 700; line-height: 1.5; letter-spacing: -0.03em; color: var(--color-white); }
.open-ban .rule {display: block; width: 1px; height: 30px; background: var(--color-white); flex-shrink: 0; }
.open-ban .desc {font-size: var(--font-size-18); line-height: 1.67; letter-spacing: -0.03em; color: var(--color-white); }