@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.root_daum_roughmap {width:100% !important; height:420px !important;}
.root_daum_roughmap .wrap_map {height:420px !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-1); border-radius: 50%;}

.bg-gray {background:#fafafa;}

.aboutwrap {overflow: hidden;}
.abflx {display: flex; flex-wrap: wrap;}
.abflx.type1 {position: relative;margin-bottom: -80px;z-index: 5;}
.abflx.type2 {align-items: flex-end;}
.abflx .textbx2 {flex: 1 0 auto; width: 1%;letter-spacing: -0.4px;}
.abflx.type1 .imgbx {flex: 1 0 850px; max-width: 850px;}
.abflx.type2 .imgbx {flex: 1 0 800px; max-width: 800px;}
.abflx .flxtit { font-size:clamp(26px, calc( 48 / var(--inner) * 100vw ), 48px); font-weight: bold;}
.abflx .line {margin:clamp(15px, calc( 26 / var(--inner) * 100vw ), 26px) 0 clamp(18px, calc( 32 / var(--inner) * 100vw ), 32px); width: 1px; height: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px);background: #242424;}
.textbx2 .flxtit2 {font-size: clamp(20px, calc( 32 / var(--inner) * 100vw ), 32px); font-weight: 400;line-height: 1.25;}
.textbx2 .flxtit2 .size2 {font-size: clamp(18px, calc( 28 / var(--inner) * 100vw ), 28px);}
.textbx2 .flxtit2 + .flxdec {padding-top:10px; }
.textbx2 .flxdec {font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); line-height: 1.45;color: #454545;}
.textbx2 .flxdec + .flxdec {padding-top: clamp(10px, calc( 14 / var(--inner) * 100vw ), 14px);}
.textbx2 .flxWrap {align-items: center;}
.textbx2 .titbx {flex: 1 0 clamp(120px, calc( 188 / var(--inner) * 100vw ), 188px); max-width: clamp(120px, calc( 188 / var(--inner) * 100vw ), 188px);padding-left: clamp(16px, calc( 58 / var(--inner) * 100vw ), 58px);}
.textbx2 .titbx .tit {font-size:clamp(26px, calc( 36 / var(--inner) * 100vw ), 36px); font-weight: bold;}
.textbx2 .titbx .small {display: block;font-size: clamp(14px, calc( 16 / var(--inner) * 100vw ), 16px);color: #454545;}
.textbx2 .pinfobx {flex: 1 0 auto; width: 1%;padding-left:clamp(16px, calc( 58 / var(--inner) * 100vw ), 58px);border-left: 1px solid #242424;font-family: var(--font1);}
.pinfobx .pinfolist + .pinfolist {padding-top: clamp(15px, calc( 34 / var(--inner) * 100vw ), 34px);}
.pinfobx .pinfolist {display: flex;flex-wrap: wrap;align-items: center;}
.pinfobx .job {flex: 1 0 clamp(170px, calc( 226 / var(--inner) * 100vw ), 226px); max-width: clamp(170px, calc( 226 / var(--inner) * 100vw ), 226px); font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px);font-weight: 600;}
.pinfobx .name {flex: 1 0 auto; width: 1%; color: #454545;}
.incontent + .incontent {padding-top: clamp(40px, calc( 80 / var(--inner) * 100vw ), 80px);}
.inconitem {display: flex;align-items: flex-end;flex-wrap: wrap; position: relative; margin: -4px;}
.inconlist {padding: 4px;flex: 1 0 auto; width: 1%;}
.inconlist:nth-child(1) {flex: 1 0 624px;max-width: 624px;}
.inconlist.text {position: absolute;top: 0;width: 100%;}
.inconlist .textbx2 {max-width: 54%;width: 100%;margin-left: auto;}

.viewFlx {display: flex;flex-wrap: wrap;padding-bottom: 8px;}
.viewFlx .textbx {flex: 1 0 auto; width: 1%;padding-right: 20px;}
.viewFlx .imgbx {flex: 10 900px; max-width: 900px;}
.viewFlx .imgbx .img {position:relative; padding-bottom:58.44%; overflow:hidden;}
.viewFlx .imgbx .img img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; height:auto; max-width:100%; min-height:100%;}



.viewFlx .name {font-size: clamp(22px, calc( 40 / var(--inner) * 100vw ), 40px); font-weight: 800; line-height:1.1;letter-spacing:clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px);}
.viewFlx .korname {display: block;padding-top: 5px; font-size: clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight: 600;}
.viewFlx  .date {display: block; padding-top:clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); color: #454545;}
.viewFlx .text {padding-top: clamp(19px, calc( 28 / var(--inner) * 100vw ), 28px); font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); color: #454545;line-height: 1.6;}
.viewFlx .decitem {margin-top: clamp(19px, calc( 28 / var(--inner) * 100vw ), 28px);padding: clamp(14px, calc( 25 / var(--inner) * 100vw ), 25px) 0;position:relative;box-shadow: 0 -0.5px 0 #242424, 0 0.5px 0 #242424;}
/*.viewFlx .decitem:before,*/
/*.viewFlx .decitem:after {position:absolute;content:'';left:0;width:100%;height:0.5px;background:#242424;}*/
/*.viewFlx .decitem:before {bottom:0;}*/
/*.viewFlx .decitem:after {top:0;}*/
.viewFlx .declist {display: flex;font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); color: #454545;}
.viewFlx .tit {flex:1 0 clamp(50px, calc( 70 / var(--inner) * 100vw ), 70px); max-width: clamp(50px, calc( 70 / var(--inner) * 100vw ), 70px);}
.viewFlx .dec {flex: 1 0 auto; width: 1%;}
.viewFlx .declist + .declist {padding-top: clamp(7px, calc( 15 / var(--inner) * 100vw ), 15px);}
.viewFlx .declist.youtube {padding-top: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px);}
.pjimgitem {display: flex;flex-wrap: wrap;margin: -4px;}
.pjimgitem+.pjimgitem {padding-top: 4px;}
.pjimglist {padding: 4px;flex:1 0 100%;max-width:100%;}
.pjimglist .images {position:relative; padding-bottom:66.66%; overflow:hidden;}
.pjimglist .images img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; height:auto; max-width:100%; min-height:100%;}
.viewinfo {z-index: 1000;}
.viewinfo.activefix {padding: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); position: fixed; top: 50px; width: 31.5%; background: #fff;transition: all 0.3s;box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;}
.pjimgitem.type2 .pjimglist {flex: 1 0 50%; max-width: 50%;}
.pjimgitem.type2 .pjimglist .images {position:relative; padding-bottom:150%; overflow:hidden;}
.pjimgitem.type2 .pjimglist .images img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; height:auto; max-width:100%; min-height:100%;}


.declist .btn-youtube {display: flex; align-items:center; color:#454545;}
.declist .btn-youtube .yname {display:inline-block;padding-left:clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px);font-size:clamp(14px, calc( 16 / var(--inner) * 100vw ), 16px);}
.declist .btn-youtube img {width:clamp(18px, calc( 32 / var(--inner) * 100vw ), 32px); }