 @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;}

#sub .input {border: 1px solid #ddd; background-color: transparent; color: #fff;}
#sub .input option {color: #000; background-color: #fff;}
.bg-gray {background:#fafafa;}
.overhidden {overflow: hidden;}
.subsec-pd {padding: clamp(50px, calc( 160 / var(--inner) * 100vw ), 160px) 0;}

.subsectitbx {padding-bottom: clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px); letter-spacing: -0.5px;}
.subsectitbx .subsec-tit {font-size:clamp(22px, calc( 56 / var(--inner) * 100vw ), 56px); line-height: 1.14;}
.subsectitbx .subsec-dec {padding-top: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); line-height: 1.4; font-family: var(--font-inter);}

.sub1_1imglist {display: flex; flex-wrap: wrap; margin:-10px;}
.sub1_1imgitem {flex: 1 0 33.333%; max-width: 33.333%; padding: 10px;}

.sub1_3 .flxWrap {align-items: center;}
.sub1_3 .imgbx {flex: 1 0 58%; max-width: 58%;}
.sub1_3 .textbx {flex: 1 0 auto; width: 1%; padding-right: 20px;}
.sub1_3 .textbx .subsectitbx {padding-bottom: 0;}

.brandtopinfo {margin-bottom: clamp(60px, calc( 160  / var(--inner) * 100vw ), 160px);}
.brandtopinfo .imgbx {flex:1 0 43%; max-width: 43%; margin-right: clamp(20px, calc( 140 / var(--inner) * 100vw ), 140px);}
.brandtopinfo .textbx {flex:1 0 auto; width: 1%; letter-spacing: -0.5px;}
.brandtopinfo .inner {display: flex; flex-direction: column; justify-content: space-between; height: 100%;}
.brandtopinfo .title {margin-bottom: clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px); padding-bottom: clamp(15px, calc( 26 / var(--inner) * 100vw ), 26px); font-size: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); font-weight: bold; border-bottom: 1px solid #ddd; }
.brandtopinfo .tit {margin-bottom: clamp(16px, calc( 32 / var(--inner) * 100vw ), 32px); font-size:clamp(16px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight: bold; color: var(--color-primary);}
.brandtopinfo .dec {line-height: 1.5;}
.brandtopinfo .dec + .dec {padding-top: clamp(15px, calc( 24 / var(--inner) * 100vw ), 24px);}
.brandtopinfo .bottomtxt {margin-top:50px; margin-bottom: 25px; padding-bottom: clamp(16px, calc( 30 / var(--inner) * 100vw ), 30px); border-bottom: 1px solid #ddd;line-height:1.6;}

.subimglist  + .subimglist  {padding-top: 10px;}
.subimglist {display: flex; flex-wrap: wrap; margin:-10px;}
.subimgitem {flex: 1 0 33.33%; max-width: 33.33%; padding: 10px;}
.subimgitem.wid-50 {flex: 1 0 50%; max-width: 50%;}
.subimgitem.onlywid-50 {flex: 1 0 50%; max-width: 50% !important;}
.subimgitem.wid-25 {flex: 1 0 25%; max-width: 25%;}
.subimgitem.wid-100 {flex: 1 0 100%; max-width: 100%; text-align: center;}
.subimglist.updown .subimgitem:nth-child(even) {transform: translateY(clamp(30px, calc( 130 / var(--inner) * 100vw ), 130px));}
.subimglist.updown {padding-bottom: clamp(30px, calc( 130 / var(--inner) * 100vw ), 130px);}

/* 레이아웃 그리드사용*/
.subimglist.layout {display: grid; grid-template-columns: repeat(4, 1fr); gap:20px; margin: 0;}
.subimglist.layout .subimgitem {flex: none; max-width: none; padding: 0;}
.subimglist.layout1 .subimgitem:nth-child(3) {grid-column: span 2;}
.subimglist.layout2 .subimgitem:nth-child(11) {grid-column: span 2;}

.imgfix {display: flex; flex-wrap: wrap; align-items: flex-end; margin:-10px;}
.imgfix .box1 {flex: 1 0 25.3%; max-width: 25.3%; padding: 10px;}
.imgfix .box2 {flex: 1 0 auto; width: 1%; padding: 10px;}

.buttons .cen .btn-pack.bdrs {min-width:clamp(130px, calc( 210 / var(--inner) * 100vw ), 210px); height: clamp(40px, calc( 64 / var(--inner) * 100vw ), 64px); line-height: clamp(38px, calc( 62 / var(--inner) * 100vw ), 62px); border-radius: 32px; font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px);}