@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:10px; margin-top:13px; line-height:1.3; font-size: clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); color: #505050;}
.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:#505050; border-radius: 50%;}
.bullet-item .bullet-list.none {padding-left: 0;}
.bullet-item .bullet-list.none::before {display: none;}

.bg-gray {background:#f8f8f8;}
.subsec-pd {padding: clamp(60px, calc( 140 / var(--inner) * 100vw ), 140px) 0;}

.content-wrap {margin-top: clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px);}
.content-wrap2 {margin-top: clamp(60px, calc( 140 / var(--inner) * 100vw ), 140px);}
.content-wrap3 + .content-wrap3 {margin-top: clamp(70px, calc( 180 / var(--inner) * 100vw ), 180px);}

.arrowflx .number {display: inline-block; padding-left:22px; background-size:10px auto;}
.arrowflx.up .number {background: url(../images/main/arrow-top.png) no-repeat left center; color: #e60012;}
.arrowflx.down .number {background: url(../images/main/arrow-bottom.png) no-repeat left center; color: #1e8bd1;}

.tab-wrap {margin-bottom:  clamp(30px, calc( 100 / var(--inner) * 100vw ), 100px); }
.tab-wrap.type2 {margin-bottom:  clamp(25px, calc( 60 / var(--inner) * 100vw ), 60px); }
.tab-wrap .tablist {display: flex; overflow-x: auto; margin: -2px;}
.tab-wrap .tabitem {padding: 2px;}
.tab-wrap .tablink {display: inline-flex; align-items: center; justify-content: center; padding: 0  clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); height:  clamp(34px, calc( 58 / var(--inner) * 100vw ), 58px); border-radius:29px; font-weight: 600; font-size: clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); white-space: nowrap;}
.tab-wrap .tablink.active {background:var(--color-primary); color:#fff;}
.tab-wrap .tablink:hover:not(.active) {background: #f4f4f4;}
.tab-wrap .tabs {display: flex; margin: -2px;}
.tab-wrap .tab {padding: 2px;}
.tab-wrap .tab.active .tablink {background:var(--color-primary); color:#fff; border-radius:29px;}
.tab-wrap .tablink:hover:not(.active) .tablink {background: #f4f4f4;}

.inquiry-tit {margin-bottom: clamp(30px, calc( 90 / var(--inner) * 100vw ), 90px); font-size:  clamp(18px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: 500;line-height: 1.57; }
.form-wrap .btn-pack.large {padding: 0 clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px); min-width: clamp(180px, calc( 225 / var(--inner) * 100vw ), 225px); height: clamp(52px, calc( 68 / var(--inner) * 100vw ), 68px); line-height: clamp(50px, calc( 66 / var(--inner) * 100vw ), 66px); border-color: #2c2c2c; background: #fff url(../images/common/btn-circle.png) no-repeat right clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px) center; background-size:clamp(22px, calc( 32 / var(--inner) * 100vw ), 32px) auto; color: #2c2c2c; text-align: left; font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px);}

.disclosure-wid {max-width: 700px; width: 100%; margin: 0 auto;}
.disclosure-wid .tab-wrap {margin-bottom: clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px);}
.disclosure-frame iframe {width: 100%; height: 100%;}

.textbgbx {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; margin-bottom: 35px;}
.textbg {padding-left:26px; position: relative; font-size: 24px; font-weight: 600;}
.textbg:after {position: absolute; content: ''; left: 0; top: 50%; transform: translateY(-50%); width: 10px; height: 10px; background:var(--color-primary);}
.textbgbx .date {font-weight: 500; color: #a8a8a8; }

.stock-topfix {border-top: 2px solid #2c2c2c; display: flex; flex-wrap: wrap;}
.stock-topfix .leftbx {flex: 1 0 50%; max-width: 50%;}
.stock-topfix .leftbx .inner {padding: clamp(30px, calc( 70 / var(--inner) * 100vw ), 70px) clamp(25px, calc( 80 / var(--inner) * 100vw ), 80px); background: #fafafa; border: 2px solid #2c2c2c; border-top: 0;}
.stock-topfix .topstock {display: flex; align-items: flex-end; justify-content: space-between;}
.stock-topfix .topstock .badge {display: inline-flex; align-items: center; justify-content: center; padding: 0  clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px); background: #2c2c2c; color: #fff; font-size:  clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 600; border-radius: 24px; height:  clamp(38px, calc( 48 / var(--inner) * 100vw ), 48px);}
.stock-topfix .pricebx {display: flex; align-items: flex-end;line-height: 1;}
.stock-topfix .pricebx .price {font-size: clamp(34px, calc( 68 / var(--inner) * 100vw ), 68px); font-weight: 500; }
.stock-topfix .pricebx .change {display: inline-block; padding-left: 8px; padding-bottom: clamp(2px, calc( 8 / var(--inner) * 100vw ), 8px); font-size: clamp(18px, calc( 30 / var(--inner) * 100vw ), 30px); font-weight: 600; }
.stock-topfix .bottomstock {display: flex; align-items: flex-end; justify-content: space-between; margin-top:  clamp(25px, calc( 40 / var(--inner) * 100vw ), 40px); padding: clamp(18px, calc( 25 / var(--inner) * 100vw ), 25px)  clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); background: #fff; border-radius: 37px; border: 1px solid #eee;}

.stock-topfix .rightbx {flex: 1 0 auto; width: 1%; padding-left:  clamp(15px, calc( 95 / var(--inner) * 100vw ), 95px);}
.stock-topfix .inner {height: 100%;}
.stock-topfix .stock-item {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; padding: clamp(18px, calc( 36 / var(--inner) * 100vw ), 36px) 0; border-bottom: 1px solid #dfdfdf;}
.stock-topfix .namebx {display: flex; align-items: center;}
.stock-topfix .namebx .name {flex: 1 0  clamp(70px, calc( 100 / var(--inner) * 100vw ), 100px); max-width:  clamp(70px, calc( 100 / var(--inner) * 100vw ), 100px); font-weight: 600; color: #676767;}
.stock-topfix .namebx .num {flex: 1 0 auto; width: 1%; font-size:  clamp(18px, calc( 32 / var(--inner) * 100vw ), 32px); font-weight: 600;}
.stock-item .arrowflx .number {font-size: clamp(12px, calc( 14 / var(--inner) * 100vw ), 14px);}

.tblbx {border-top:2px solid #2c2c2c;}
.tblbx + .tblbx {margin-top:clamp(20px, calc( 50 / var(--inner) * 100vw ), 50px);}
.stock-table th {background-color:#fafafa; font-weight:600; font-size:clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); border-bottom:1px solid #ddd; letter-spacing: -0.5px;}
.stock-table td {font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); color:#505050; border-bottom:1px solid #ddd;}
.stock-table th,
.stock-table td {padding:clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px) clamp(8px, calc( 20 / var(--inner) * 100vw ), 20px); text-align: center;}
.stock-table .text-gray {color:#a8a8a8;}	
.tblbx.type2 .stock-table th {font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px);}
.tblbx.type2 .stock-table th:not(:last-child),
.tblbx.type2 .stock-table td:not(:last-child) {border-right:1px solid #ddd;}
.stock-table .bg2 {background: #2c2c2c; color: #fff;}
.tblbx.type2 .stock-table th {font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px);}
.tblbx .list .item {line-height: 1.5;}
.tblbx .list .item + .item {margin-top: 10px;}
.tblbx .list .item.type2 + .item.type2 {margin-top: clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px);}
.tblbx .list .flxWrap {align-items: center;}
.tblbx .list .badge {display: inline-flex; align-items: center; justify-content: center; padding:0 12px; margin-right: clamp(3px, calc( 6 / var(--inner) * 100vw ), 6px); border-radius: 14px; color: #fff; height: clamp(26px, calc( 29 / var(--inner) * 100vw ), 29px); font-size: clamp(12px, calc( 14 / var(--inner) * 100vw ), 14px); font-weight: 500;}
.tblbx .list .badge.color1 {background: #121212;}
.tblbx .list .badge.color2 {background: var(--color-primary);}
.tblbx .list .badgetext {padding-left: clamp(3px, calc( 6 / var(--inner) * 100vw ), 6px);}

.tab-content .stock-table th {font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px);}
.tab-content .stock-table th:not(:last-child) ,
.tab-content .stock-table td:not(:last-child) {border-right: 1px solid #ddd;}

.overview .flxWrap {margin: 0 -40px;}
.overview .commpd {padding: 0 40px;}
.overview .leftbx {flex: 1 0 50%; max-width: 50%; }
.overview .bottomtext {position: absolute; bottom: 0; left: 0; width: 100%; color: #a8a8a8; font-size: clamp(12px, calc( 14 / var(--inner) * 100vw ), 14px); line-height: 1.8;}
.overview .bottomtext:not(:first-child) {margin-top: 8px;}
.overview .rightbx {flex: 1 0 auto; width: 1%; }
.overview .inner {position: relative; height: 100%;}
.overview .viewtitle {display: flex; align-items: center; margin-bottom:clamp(25px, calc( 55 / var(--inner) * 100vw ), 55px); font-size: clamp(19px, calc( 38 / var(--inner) * 100vw ), 38px); font-weight: 600; color: #121212;}
.overview .viewtitle .badge {display: inline-flex; align-items: center; justify-content: center; margin-left:clamp(10px, calc( 15 / var(--inner) * 100vw ), 15px); padding: 0  15px; background: linear-gradient(90deg,#b90006 0%,#230003 100%); color: #fff; font-size:  clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 600; border-radius: 18px; height:  clamp(32px, calc( 35 / var(--inner) * 100vw ), 35px);}

.overview .chartbox {padding: clamp(30px, calc( 50 / var(--inner) * 100vw ), 50px) clamp(20px, calc( 50 / var(--inner) * 100vw ), 50px); border: 1px solid #ddd; text-align: center; height: 100%;}
.chart-wrapper { max-width:  clamp(300px, calc( 480 / var(--inner) * 100vw ), 480px); width: 100%;  height:  clamp(300px, calc( 480 / var(--inner) * 100vw ), 480px); margin: 0 auto; position: relative;}
.chartinner { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; }
.chartinner .center-text p { font-size: clamp(18px, calc( 32 / var(--inner) * 100vw ), 32px); line-height: 1.2; letter-spacing: -0.5px;}
.chartinner .center-text .border {text-decoration: underline;}
.chartinner .center-text .date {display: inline-block; padding-top: clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px); font-size: clamp(12px, calc( 16 / var(--inner) * 100vw ), 16px); color: #a8a8a8; }

#aumChartLegend { margin-top: clamp(25px, calc( 60 / var(--inner) * 100vw ), 60px); }
#aumChartLegend ul { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; list-style: none; padding: 0; margin: 0; }
#aumChartLegend li { display: flex; align-items: center; margin: 5px clamp(8px, calc( 15 / var(--inner) * 100vw ), 15px); font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); letter-spacing: -0.5px; font-weight: 600;}

.overview .stock-table th {padding: clamp(15px, calc( 28 / var(--inner) * 100vw ), 28px) 5px; font-size:  clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px);}
.overview .stock-table td {padding: clamp(18px, calc( 36 / var(--inner) * 100vw ), 36px) 5px;}
.overview .stock-table .total {padding: clamp(20px, calc( 42 / var(--inner) * 100vw ), 42px) 5px; font-weight: 600;background: #fafafa; color: #2c2c2c;}

.portfolio-wrap .leftbx {flex: 1 0 440px; max-width: 440px; margin-right:clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px);}
.portfolio-wrap .rightbx {flex: 1 0 auto; width: 1%;}
.portfolio-wrap .rightimage img {width: 100%;}
.portfolio-wrap .leftbx .title {font-size:clamp(34px, calc( 68 / var(--inner) * 100vw ), 68px); font-weight: 500; background: linear-gradient(90deg,#b90006 0%,#230003 100%); background-position: left; -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.portfolio-wrap .righttxt-item {padding: clamp(20px, calc( 38 / var(--inner) * 100vw ), 38px) 0; border-bottom: 2px dashed #dfdfdf;}
.portfolio-wrap .righttxt-item .text {padding-left: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); position: relative; font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); color: #505050;}
.portfolio-wrap .righttxt-item .text::before {position: absolute; content: ''; left: 0; top:clamp(7px, calc( 9 / var(--inner) * 100vw ), 9px); width: clamp(6px, calc( 10 / var(--inner) * 100vw ), 10px); height: clamp(6px, calc( 10 / var(--inner) * 100vw ), 10px); background:#121212;}
.portfolio-wrap .lasttext {margin-top: clamp(15px, calc( 28 / var(--inner) * 100vw ), 28px); color: #a8a8a8; font-size: clamp(12px, calc( 14 / var(--inner) * 100vw ), 14px);}

.portfolio-wrap .leftbx .inner {padding: clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px) clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); height: 100%; text-align: center;}
.portfolio-wrap .leftbx .inner.bg {background: #f4f4f4;}
.portfolio-wrap .rightbx img {width: 100%;}
.portfolio-wrap .chart-list {display: flex; justify-content: center; flex-wrap: wrap; padding-top: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px);}
.portfolio-wrap .chart-item {display: flex; align-items: center; padding: 5px 11px;}
.portfolio-wrap .chart-item .square {display: inline-block; margin-right: 10px; width: clamp(10px, calc( 12 / var(--inner) * 100vw ), 12px); height: clamp(10px, calc( 12 / var(--inner) * 100vw ), 12px);}
.portfolio-wrap .chart-item .square.bg1 {background: #ca3742;}
.portfolio-wrap .chart-item .square.bg2 {background: #ff7800;}
.portfolio-wrap .chart-item .square.bg3 {background: #fcbf49;}
.portfolio-wrap .chart-item .name {font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 600; }
.portfolio-wrap .chart-border {margin-top: clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); padding:10px clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); position: relative; background: #fff; border-radius:20px;}
.portfolio-wrap .chart-border:after,
.portfolio-wrap .chart-border:before {position: absolute; content: ''; top: 50%; transform: translateY(-50%); width:clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); height: clamp(6px, calc( 8 / var(--inner) * 100vw ), 8px); background: url(../images/sub/dot-border.png) no-repeat; background-size:contain;}
.portfolio-wrap .chart-border:after {left: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px);}
.portfolio-wrap .chart-border:before {right: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px);}
.portfolio-wrap .chart-border span {display: inline-block; padding: 0 clamp(8px, calc( 12 / var(--inner) * 100vw ), 12px);}
.portfolio-wrap .chart-border .text {font-weight: 600;}
.portfolio-wrap .chart-border .number {font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: bold; color:var(--color-primary);}

.contitbx {margin-bottom: clamp(25px, calc( 55 / var(--inner) * 100vw ), 55px);position:relative;}
.contitbx .contit {display: flex; align-items: center;  font-size: clamp(20px, calc( 38 / var(--inner) * 100vw ), 38px); font-weight: 600;color: #121212;}
.contitbx .subcontit {font-size: clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight: 600;color: #121212;}
.contitbx .small {display:inline-flex;align-items:cneter;padding-left: clamp(10px, calc( 26 / var(--inner) * 100vw ), 26px); font-size: clamp(14px, calc( 16 / var(--inner) * 100vw ), 16px); color:#a8a8a8;}	
.contitbx .position {position:absolute; right:0; top:50%; transform:translatey(-50%); font-size: clamp(14px, calc( 16 / var(--inner) * 100vw ), 16px); color:#a8a8a8;}
.contitbx .badge {display: inline-flex; align-items: center; justify-content: center; margin-left:clamp(10px, calc( 15 / var(--inner) * 100vw ), 15px); padding: 0  15px; background: linear-gradient(90deg,#b90006 0%,#230003 100%); color: #fff; font-size:  clamp(13px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 600; border-radius: 18px; height:  clamp(30px, calc( 35 / var(--inner) * 100vw ), 35px);}
.contitbx .badge.black {background:#121212;}
.contitbx.type2 .badge {margin-left:0;margin-bottom:clamp(12px, calc( 30 / var(--inner) * 100vw ), 30px);}
.portfolio-wrap .stock-table th {padding:clamp(12px, calc( 22 / var(--inner) * 100vw ), 22px) clamp(20px, calc( 50 / var(--inner) * 100vw ), 50px); border-right: 1px solid #ddd;}
.portfolio-wrap .stock-table td {padding:clamp(12px, calc( 22 / var(--inner) * 100vw ), 22px) clamp(10px, calc( 30 / var(--inner) * 100vw ), 30px);}

.states-list {display: flex; flex-wrap: wrap; margin:5px;}
.states-item {flex: 1 0 33.33%; max-width: 33.33%; padding: 5px;}
.states-item .inner {padding: clamp(25px, calc( 50 / var(--inner) * 100vw ), 50px) clamp(18px, calc( 38 / var(--inner) * 100vw ), 38px); height: 100%; min-height:clamp(300px, calc( 424 / var(--inner) * 100vw ), 424px); color: #fff;}
.states-item .inner.bg1 {background: url(../images/sub/port-bg1.jpg) no-repeat 50% 50% /cover;}
.states-item .inner.bg2 {background: url(../images/sub/port-bg2.jpg) no-repeat 50% 50% /cover;}
.states-item .inner.bg3 {background: url(../images/sub/port-bg3.jpg) no-repeat 50% 50% /cover;}
.states-item .inner.bg4 {background: url(../images/sub/port-bg4.jpg) no-repeat 50% 50% /cover;}
.states-item .small {display: block; margin-bottom:clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px);  font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: bold; color: #cccccc;}
.states-item .num {font-size: clamp(28px, calc( 68 / var(--inner) * 100vw ), 68px); font-weight: 800; line-height: 1;}
.states-item .number {display: block; margin-top: 9px; font-size: clamp(16px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: 800; color: rgba(255, 255, 255, 0.5);}
.states-item .inlist + .inlist {margin-top:clamp(20px, calc( 44 / var(--inner) * 100vw ), 44px);}
.states-item .inlist .badge { display: inline-flex; align-items: center; justify-content: center; padding:0 15px; border-radius:17px; min-width: clamp(65px, calc( 70 / var(--inner) * 100vw ), 70px); height: clamp(30px, calc( 34 / var(--inner) * 100vw ), 34px); font-weight: 600; border: 2px solid #fb7600; background: linear-gradient(90deg, #fb7600, #ca3742); -webkit-background-clip: text; background-clip: text; color: transparent; line-height: 1;}
.states-item .inlist .intxt {margin-top: clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px); font-size: clamp(18px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: 800;}
.states-item .text {font-size: clamp(22px, calc( 38 / var(--inner) * 100vw ), 38px); font-weight: 800;}

.buttons.type2 .btn-pack.large {padding: 0 clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px); padding-right:  clamp(50px, calc( 90 / var(--inner) * 100vw ), 90px); min-width: clamp(180px, calc( 225 / var(--inner) * 100vw ), 225px); height: clamp(52px, calc( 68 / var(--inner) * 100vw ), 68px); line-height: clamp(50px, calc( 66 / var(--inner) * 100vw ), 66px); border-color: #2c2c2c; background: #fff url(../images/common/btn-circle.png) no-repeat right clamp(20px, calc( 30 / var(--inner) * 100vw ), 30px) center; background-size:clamp(22px, calc( 32 / var(--inner) * 100vw ), 32px) auto; color: #2c2c2c; text-align: left; font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px);}


/* 포트폴리오 상세페이지 */
.area-wrapper {background: #f4f4f4; border-top: 1px solid #ddd;}
.area-wrapper .contain {max-width: 1780px !important;}
.area-wrapper .toparea {display: flex; align-items: center; flex-wrap: wrap; padding:clamp(20px, calc( 34 / var(--inner) * 100vw ), 34px) 0 ; border-bottom: 2px dashed #cccccc;}
.area-wrapper .iconbx {flex: 1 0 clamp(100px, calc( 160 / var(--inner) * 100vw ), 160px); max-width: clamp(95px, calc( 160 / var(--inner) * 100vw ), 160px); padding-left: clamp(20px, calc( 35 / var(--inner) * 100vw ), 35px); font-size:clamp(18px, calc( 22 / var(--inner) * 100vw ), 22px); font-weight: 600; background: url(../images/sub/area-icn.png) no-repeat left center; background-size: clamp(14px, calc( 24 / var(--inner) * 100vw ), 24px) auto;}
.area-wrapper .buttonbx {flex: 1 0 auto; width: 1%;}
.area-wrapper .areabtn-list {display: flex; margin: -5px; overflow-x: auto;}
.areabtn-list .areabtn-item {flex: 1; padding: 5px;}
.areabtn-list .areabtn-item .link {display: inline-flex; align-items: center; justify-content: center; border-radius: 23px; background: #fff; font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 500; height: clamp(32px, calc( 47 / var(--inner) * 100vw ), 47px); min-width: clamp(70px, calc( 110 / var(--inner) * 100vw ), 110px);}
.areabtn-list .areabtn-item .link.active {background: #121212; color: #fff;}
.area-wrapper .slideWrap {padding:clamp(25px, calc( 48 / var(--inner) * 100vw ), 48px) 0;}
.slidecont {position:relative; padding-right:clamp(10px, calc( 100 / var(--inner) * 100vw ), 100px); padding-left:clamp(10px, calc( 100 / var(--inner) * 100vw ), 100px); }
.slidecont .ginner {display:block;}
.slidecont .ginner .image {position:relative; padding-bottom:91.5%; overflow:hidden; }
.slidecont .ginner .image img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; height:auto; max-width:100%; min-height:100%; object-fit : cover;}
.slidecont .ginner .textbx {padding:clamp(10px, calc( 14 / var(--inner) * 100vw ), 14px) 0; position: relative; text-align:center; background: #fff;}
.slidecont .ginner .title {font-size:clamp(13px, calc( 16 / var(--inner) * 100vw ), 16px); font-weight:600; display:-webkit-box; -webkit-box-orient: vertical; overflow: hidden; -webkit-line-clamp:1;}
.slidecont .swiper {padding-bottom: 10px;}
.slidecont .swiper-slide.active .image:after {content:""; position:absolute; top:0; left:0; right:0; bottom:0; border: clamp(2px, calc( 4 / var(--inner) * 100vw ), 4px) solid var(--color-primary);}
.slidecont .swiper-slide.active .textbx {background:var(--color-primary); color: #fff;}
.slidecont .swiper-slide.active .textbx:after {  content: '';  position: absolute;  left: 50%;  bottom: -10px;  transform: translateX(-50%);  width: 0; height: 0; border-left: 7px solid transparent;  border-right: 7px solid transparent;  border-top: 10px solid var(--color-primary);}
.slideWrap .btn-arrow {margin-top:0; top:50%; transform: translateY(-50%); width:clamp(30px, calc( 80 / var(--inner) * 100vw ), 80px); height:clamp(30px, calc( 80 / var(--inner) * 100vw ), 80px); border:1px solid #eeeeee; transition: all 0.3s; background: #fff;}
.slideWrap .btn-arrow::after {display: none;}
.slideWrap .btn-arrow svg {width: clamp(14px, calc( 50 / var(--inner) * 100vw ), 50px); height: clamp(14px, calc( 50 / var(--inner) * 100vw ), 50px); color: #121212;}
.slideWrap .swiper-button-next {right:clamp(2px, calc( 10 / var(--inner) * 100vw ), 10px);}
.slideWrap .swiper-button-prev {left:clamp(2px, calc( 10 / var(--inner) * 100vw ), 10px);}
.slideWrap .btn-arrow:hover {background:var(--color-primary); border-color:var(--color-primary);}
.slideWrap .btn-arrow:hover svg {color: #fff;}

.areatxtbx {margin-bottom: clamp(30px, calc( 75 / var(--inner) * 100vw ), 75px);}
.areatxtbx .maintxt {display: flex; align-items: center; font-size: clamp(22px, calc( 38 / var(--inner) * 100vw ), 38px); font-weight: 600;}
.areatxtbx .badge {display: inline-flex; align-items: center; justify-content: center; padding:0 12px; margin-right:clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px); height: clamp(28px, calc( 35 / var(--inner) * 100vw ), 35px); line-height: 1; font-weight: 600; background:var(--color-primary); color: #fff; font-size: clamp(14px, calc( 16 / var(--inner) * 100vw ), 16px);}
.areatxtbx.type2 {margin-bottom:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px);}
.areatxtbx .subtxt {padding-left:clamp(20px, calc( 26 / var(--inner) * 100vw ), 26px); position: relative; font-size:24px; font-weight: 600;}
.areatxtbx .subtxt:after {position: absolute; content: ''; left: 0; top: 50%; transform: translateY(-50%); width: 10px; height: 10px; background:var(--color-primary);}

.areaflxwrap .imgbx {flex: 1 0 690px; max-width: 690px; margin-right: 20px;}
.areaflxwrap .images {position:relative; padding-bottom:63.76%; overflow:hidden;}
.areaflxwrap .images img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; height:auto; max-width:100%; min-height:100%;object-fit : cover;}
.areaflxwrap .imginfobx {flex: 1 0 auto; width: 1%;}
.areaflxwrap .stock-table th, 
.areaflxwrap .stock-table td {padding: clamp(16px, calc( 30 / var(--inner) * 100vw ), 30px) clamp(12px, calc( 25 / var(--inner) * 100vw ), 25px); text-align: left;}


/*제품관리 에디터용*/
.area-tblbx .text-left.pro table{ font-size: clamp(14px, calc(18 / var(--inner) * 100vw), 18px);    border-bottom:1px solid #ddd;    border-left-width: 0;    border-right-width: 0;}
.area-tblbx .text-left.pro table td {padding: clamp(16px, calc( 30 / var(--inner) * 100vw ), 30px) clamp(12px, calc( 25 / var(--inner) * 100vw ), 25px) !important;  border-left-width: 0  !important;    border-right-width: 0  !important; background-color: #fafafa; text-align: left  !important; font-weight: bold;}

.area-tblbx .pro table tr td:last-child {     background-color: white; font-weight: normal; text-align: left  !important;}
 
/*제품관리 에디터용 끝 */
.location #map {height:clamp(300px, calc( 600 / var(--inner) * 100vw ), 600px);}
.area-tblbx .tblbx table {width:100% !important;}
.area-tblbx .tblbx table th,
.area-tblbx .tblbx table td {padding:clamp(12px, calc( 20 / var(--inner) * 100vw ), 20px) clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px)  !important;font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px) !important; line-height:1.6; text-align:center !important;}


/* 디자인페이지 */
.point-wrap {position: relative;}
.point-wrap .toptextbx {position: absolute; left: 0; top: 0;}
.point-wrap .toptextbx .num {display:flex; align-items: center; justify-content: center; width: clamp(30px, calc( 40 / var(--inner) * 100vw ), 40px);height: clamp(30px, calc( 40 / var(--inner) * 100vw ), 40px); background:var(--color-primary); color: #fff; font-size:clamp(16px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight:800;}
.point-wrap .toptextbx .title {margin-top: clamp(25px, calc( 70 / var(--inner) * 100vw ), 70px); font-size: clamp(22px, calc( 42 / var(--inner) * 100vw ), 42px); font-weight: 600; line-height: 1.52;}
.point-wrap .flxWrap {align-items: flex-end;}
.point-wrap .imgbx {flex: 1 0 30%; max-width: 30%;margin-left:clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px);}
.point-wrap .textbx {flex: 1 0 auto; width: 1%;}
.point-wrap .text-list {display: flex; flex-wrap: wrap; margin:-5px;}
.point-wrap .text-item {flex: 1 0 50%; max-width: 50%; padding: 5px;}
.point-wrap .text-item .inner {padding:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px) clamp(15px, calc( 40 / var(--inner) * 100vw ), 40px); background: #f4f4f4; height: 100%;} 
.point-wrap .text-item .square {display: block; width:10px; height: 10px; background:var(--color-primary);}
.point-wrap .text-item .text {margin-top:clamp(15px, calc( 32 / var(--inner) * 100vw ), 32px); font-size: clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 500; line-height: 1.7;}
.point-wrap .text-item.wid-33 {flex: 1 0 33.33%; max-width: 33.33%;}

.point-wrap.reverse .toptextbx {left: initial; right: 0; text-align: right;}
.point-wrap.reverse .flxWrap {flex-direction: row-reverse;}
.point-wrap.reverse .imgbx {margin-right: clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px); margin-left: 0;}
.point-wrap.reverse .toptextbx .num {margin-left: auto;}

.asset-flxwrap {display: flex; flex-wrap: wrap; overflow: hidden;}
.asset-flxwrap .imgbx {flex: 1 0 42%; max-width:42%;margin-right: clamp(15px, calc( 110 / var(--inner) * 100vw ), 110px);}
.asset-flxwrap .textbx {flex: 1 0 auto; width: 1%; padding-top: clamp(25px, calc( 55 / var(--inner) * 100vw ), 55px); position: relative; border-top: 2px solid #dfdfdf;}
.asset-flxwrap .textbx:after {position: absolute; content: ''; left: 0; top: -2px; width: 40px; height: 2px; background: var(--color-primary);}
.asset-flxwrap .titlebx {display: flex; align-items: flex-end; justify-content: space-between;}
.asset-flxwrap .titlebx .title {font-size: clamp(20px, calc( 38 / var(--inner) * 100vw ), 38px); font-weight: 600;}
.asset-flxwrap .titlebx .btn-blank {font-size: clamp(13px, calc( 15 / var(--inner) * 100vw ), 15px); color: #187bd6;}
.asset-flxwrap .infowidwrap {padding-top: clamp(30px, calc( 75 / var(--inner) * 100vw ), 75px);}
.asset-flxwrap .companyinfo-list + .companyinfo-list {padding-top: clamp(20px, calc( 53 / var(--inner) * 100vw ), 53px);}
.asset-flxwrap .companyinfo-list {display: flex; flex-wrap: wrap; margin: -5px;}
.asset-flxwrap .companyinfo-item {flex: 1 0 50%; max-width: 50%; padding: 5px;}
.asset-flxwrap .companyinfo-item.wid-100 {flex: 1 0 100%; max-width: 100%;}
.asset-flxwrap .companyinfo-item .intit {margin-bottom:clamp(15px, calc( 22 / var(--inner) * 100vw ), 22px); font-size: clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 600; color: var(--color-primary);}
.asset-flxwrap .companyinfo-item .bigtit {font-size:clamp(18px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight: bold;}
.asset-flxwrap .companyinfo-item .smalltit {display: inline-block; padding-left:5px; font-size: clamp(14px, calc( 16 / var(--inner) * 100vw ), 16px); color: #a8a8a8;}
.asset-flxwrap .bullet-list .small {display: block; padding-top: 10px; font-size: clamp(14px, calc( 16 / var(--inner) * 100vw ), 16px); color: #a8a8a8; font-weight: bold;} 
.asset-flxwrap .tel-infowrap {display: flex; flex-wrap: wrap;}
.asset-flxwrap .tel-list {display: flex; margin-right: clamp(20px, calc( 45 / var(--inner) * 100vw ), 45px); font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 600;}
.asset-flxwrap .tel-list:last-child {padding-right: 0;}
.asset-flxwrap .tel-list .name {margin-right: 8px; color: #a8a8a8;}
.asset-flxwrap .linkwrap {display: flex;}
.asset-flxwrap .linkwrap .linkitem {margin-right: 8px;}
.asset-flxwrap .linkwrap .btn-link {display: inline-flex; align-items: center; justify-content: space-between; padding: 0 24px; background: #fff; border: 1px solid #333; border-radius: 26px; height: clamp(42px, calc( 52 / var(--inner) * 100vw ), 52px);}
.asset-flxwrap .linkwrap .text {margin-right: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); padding-left: clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight: 600; position: relative;}
.asset-flxwrap .linkwrap .text:after {position: absolute; content: ''; left: 0; top: 50%; transform: translateY(-50%); width: clamp(5px, calc( 8 / var(--inner) * 100vw ), 8px); height: clamp(5px, calc( 8 / var(--inner) * 100vw ), 8px); background: #dfdfdf; border-radius: 50%;} 
.asset-flxwrap .linkwrap img {width: clamp(10px, calc( 12 / var(--inner) * 100vw ), 12px);}

.business-area {padding: clamp(60px, calc( 140 / var(--inner) * 100vw ), 140px) 0;}

.result-text {margin-bottom:clamp(40px, calc( 90 / var(--inner) * 100vw ), 90px); font-size: clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); line-height: 1.7; color: #505050;} 
.result-text .lasttext {padding-top:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); font-size: clamp(12px, calc( 14 / var(--inner) * 100vw ), 14px); color: #a8a8a8;}

.whiteinner {padding:clamp(40px, calc( 80 / var(--inner) * 100vw ), 80px) clamp(20px, calc( 80 / var(--inner) * 100vw ), 80px); background: #fff;}
.whiteinner .flxWrap {align-items: center; justify-content: center;}
.whiteinner .imgbx {flex: 1 0 35%; max-width: 35%; margin-right:clamp(20px, calc( 120 / var(--inner) * 100vw ), 120px); margin-left: clamp(10px, calc( 70 / var(--inner) * 100vw ), 70px);}
.whiteinner .textbx {flex: 1 0 auto; width: 1%;}
.whiteinner .textbx .title {font-size: clamp(22px, calc( 42 / var(--inner) * 100vw ), 42px); font-weight: 800;}
.whiteinner .squre-list {display: flex;flex-wrap: wrap; margin: -15px; padding-top:clamp(25px, calc( 45 / var(--inner) * 100vw ), 45px);}
.whiteinner .squre-item {display: flex; align-items: center; padding: 15px;}
.whiteinner .squre-item .squre {display: inline-block; align-items: center; justify-content: center; margin-right:10px; width:clamp(10px, calc( 12 / var(--inner) * 100vw ), 12px); height: clamp(10px, calc( 12 / var(--inner) * 100vw ), 12px);}
.whiteinner .squre-item .squre.color1 {background: #ca3742;}
.whiteinner .squre-item .squre.color2 {background: #003049;}
.whiteinner .squre-item .squre.color3 {background: #12836f;}
.whiteinner .squre-item .squre.color4 {background: #fcbf49;}
.whiteinner .squre-item .squre.color5 {background: #ff7800;}
.whiteinner .squre-item .squre.color6 {background: #984d0a;}
.whiteinner .squre-item .name {font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight: 600;}

.tabtitbx {margin-bottom:clamp(20px, calc( 45 / var(--inner) * 100vw ), 45px);}
.tabtitbx .maintit {font-size:clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight: 600;}
.tabtitbx .subtit {padding-top: 15px; font-size: clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); color: #505050;}
.tabcontxt-list {display: flex; flex-wrap: wrap; margin:-5px;}
.tabcontxt-item {flex: 1 0 20%; max-width: 20%; padding: 5px;}
.tabcontxt-item .inner {padding:clamp(20px, calc( 35 / var(--inner) * 100vw ), 35px) clamp(15px, calc( 28 / var(--inner) * 100vw ), 28px);background: #fff; height: 100%;}
.tabcontxt-item .intitle {font-size: clamp(16px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight: bold;  background: linear-gradient(90deg,#b90006 0%,#230003 100%); background-position: left;  -webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.tabcontxt-item .desc {padding-top:clamp(18px, calc( 27 / var(--inner) * 100vw ), 27px); color: #505050; line-height: 1.75;}


.resultsub .sublist + .sublist {margion-top:clamp(10px, calc( 15 / var(--inner) * 100vw ), 15px);}
.resultsub .sublist {font-size:clamp(12px, calc( 14 / var(--inner) * 100vw ), 14px); color:#a8a8a8; line-height:2;}


.subsec-pd3 {padding:clamp(70px, calc( 180 / var(--inner) * 100vw ), 180px) 0;}
.sub1sec1 {padding:clamp(70px, calc( 180 / var(--inner) * 100vw ), 180px) 0; border-top:1px solid #ddd ;}
.subsectitbx .cate {display:block;font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight:500;color:#ccc;}
.subsectitbx .subsectit {padding-top:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px);font-size:clamp(22px, calc( 42 / var(--inner) * 100vw ), 42px); font-weight:600; line-height:1.52;}
.subsec1_1-list {display:flex; justify-content: center; padding-top:clamp(50px, calc( 120 / var(--inner) * 100vw ), 120px); padding-bottom:clamp(30px, calc( 70 / var(--inner) * 100vw ), 70px); margin:-10px;}
.subsec1_1-item {padding:10px;}
.subsec1_1-item:nth-child(2) {transform: translateY(clamp(30px, calc( 70 / var(--inner) * 100vw ), 70px));}
.subsec1_1-item .inner {position: relative;}
.subsec1_1-item .tit {position: absolute; font-size: clamp(18px, calc( 38 / var(--inner) * 100vw ), 38px); font-weight: bold;color: #fff; line-height:1.42;}
.subsec1_1-item:nth-child(1) .tit {left: clamp(15px, calc( 48 / var(--inner) * 100vw ), 48px); top: clamp(20px, calc( 57 / var(--inner) * 100vw ), 57px);}
.subsec1_1-item:nth-child(2) .tit {left: 50%; bottom: clamp(15px, calc( 80 / var(--inner) * 100vw ), 80px); transform: translateX(-50%); text-align: center;}

.sub1sec1 .subsectext {padding:clamp(40px, calc( 100 / var(--inner) * 100vw ), 100px) 0 clamp(70px, calc( 180 / var(--inner) * 100vw ), 180px);font-size:clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight:500; line-height:1.6;}
.subsec1_1-textbx {padding-top:clamp(40px, calc( 100 / var(--inner) * 100vw ), 100px);}
.textbgcolor {font-size:clamp(20px, calc( 38 / var(--inner) * 100vw ), 38px); font-weight:600; background:linear-gradient(90deg,#b90006 0%,#230003 100%); background-position: left; -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.subsec1_1-textbx .decbx {padding-top:clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px);}
.subsec1_1-textbx .decbx .dec {font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px);color:#505050;line-height:1.7;}
.subsec1_1-textbx .decbx .dec + .dec {padding-top:clamp(15px, calc( 35 / var(--inner) * 100vw ), 35px);}
.sub1sec2 {position:relative; background:url(../images/sub/com-bg1.jpg) no-repeat 50% 50% / cover;height:clamp(400px, calc( 938 / var(--inner) * 100vw ), 938px);}
.sub1sec2 .sec2logo {position:absolute; left:50%; top:55%; transform: translate(-50%, -50%); width:clamp(280px, calc( 871 / var(--inner) * 100vw ), 871px);height:clamp(77px, calc( 239 / var(--inner) * 100vw ), 239px);}
.sub1sec3 .toptext .text {font-size:clamp(22px, calc( 48 / var(--inner) * 100vw ), 48px); font-weight:600;letter-spacing:clamp(12px, calc( 38 / var(--inner) * 100vw ), 38px); text-align:center;}
.sub1sec3 .toptext .line {margin:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px) 0 ; width:100%; height:1px; background:#dfdfdf;}

.subsec1_3-list + .subsec1_3-list {padding-top:clamp(30px, calc( 70 / var(--inner) * 100vw ), 70px);}
.subsec1_3-list {display:flex;justify-content:center; flex-wrap:wrap;margin:-50px;}
.subsec1_3-item {flex:1 0 33.33%; max-width:33.33%; padding:50px;}
.subsec1_3-item.wid-100 {flex:1 0 100%; max-width:100%;}
.subsec1_3-list .inner {padding:clamp(18px, calc( 30 / var(--inner) * 100vw ), 30px) 0; border-top:2px solid #2c2c2c;}
.subsec1_3-list .title {margin-bottom:clamp(18px, calc( 32 / var(--inner) * 100vw ), 32px); font-size:clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight:600;color:var(--color-primary);}
.subsec1_3-list .desc {font-size:clamp(18px, calc( 28 / var(--inner) * 100vw ), 28px);font-weight:bold;}
.subsec1_3-logolist {display:flex;flex-wrap:wrap; margin:-5px;}
.subsec1_3-logoitem {flex:1 0 20%; max-width:20%; padding:5px;}
.subsec1_3-logoitem .name {padding-top:clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px); font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight:600;}

.subsec1_3_2-list + .subsec1_3_2-list {padding-top:5px;}
.subsec1_3_2-list {display:flex; flex-wrap:wrap;margin:-5px;}
.subsec1_3_2-item {flex:1 0 50%; max-width:50%; padding:5px;}
.subsec1_3_2-item.wid-100 {flex:1 0 100%; max-width:100%; }
.subsec1_3_2-item .inner {display:flex; align-items:center;padding:clamp(20px, calc( 38 / var(--inner) * 100vw ), 38px) clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); background:#f8f8f8; font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px);font-weight:600; }
.subsec1_3_2-item .title {flex:1 0 clamp(90px, calc( 130 / var(--inner) * 100vw ), 130px); max-width:clamp(90px, calc( 130 / var(--inner) * 100vw ), 130px); color:#878787;}
.subsec1_3_2-item .text {flex:1 0 auto; width:1%;display:flex; align-items:center;}
.subsec1_3_2-item .badge {display:inline-flex;align-items:center;justify-content:center;margin-right:clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px); padding:0 10px; min-width:clamp(75px, calc( 100 / var(--inner) * 100vw ), 100px); height:clamp(34px, calc( 44 / var(--inner) * 100vw ), 44px); background:var(--color-primary); color:#fff; border-radius:22px;line-height:1;}

.history-timeline {display:block; position:relative; }
.timeline-row + .timeline-row {margin-top: clamp(40px, calc( 80 / var(--inner) * 100vw ), 80px);}
.timeline-row {display:flex; position:relative; align-items:flex-start; justify-content:space-between;}
.timeline-dashed {display:block; position:absolute; top:5px; left:0; right:0; height:1px; border-top:1px dashed #d9d9d9; z-index:0;}
.timeline-item {display:block; position:relative; flex:1; min-width:120px; text-align:left; z-index:1; }
.timeline-dot {display:block; position:relative; width:10px; height:10px; margin-bottom:25px; margin-left:2px; background:var(--color-primary);}
.timeline-date {display:block; position:relative; margin-bottom:20px; padding-right: 12px;  font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); color:var(--color-primary); font-weight:600;}
.timeline-desc {display:block; position:relative; padding-right: 12px; font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight:600; line-height:1.55;}
.timeline-sub {display:inline-block; position:relative; font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); color:#bdbdbd; font-weight:500;}

@media (max-width: 1024px) {
  .timeline-row {flex-wrap:wrap;}
  .timeline-item {min-width:33.33%; width:48%; margin-bottom:40px;}
  .timeline-dot {width:8px; height:8px; margin-bottom:18px;}
}
@media (max-width: 640px) {
  .timeline-item {min-width:50%; width:100%; margin-bottom:30px;}
  .timeline-dot {width:7px; height:7px; margin-bottom:12px;}
}

.graph-list {display: flex; flex-wrap: wrap; margin:0 -5px;}
.graph-item {flex:1 0 33.33%; max-width: 33.33%; padding:0 5px;padding-bottom:clamp(90px, calc( 200 / var(--inner) * 100vw ), 200px);}
.graph-item .bgbox {position: relative;}
.graph-item .bgimg img {width: 100%;}
.graph-item .animimg {position: absolute; right: 40px; bottom: -24%;}
.animimg {opacity:0; transform:translateY(100px); transition:opacity 1.2s cubic-bezier(0.22,1,0.36,1), transform 1.2s cubic-bezier(0.22,1,0.36,1);}
.animimg.active {opacity:1; transform:translateY(0);}
.graph-wrap .lasttext {margin-top:clamp(30px, calc( 100 / var(--inner) * 100vw ), 100px); font-size:clamp(12px, calc( 14 / var(--inner) * 100vw ), 14px); color:#a8a8a8; line-height:2.28;}

.sub3sec1 .toptext .title {font-size:clamp(24px, calc( 42 / var(--inner) * 100vw ), 42px); font-weight:600; line-height:1.5;}
.sub3sec1 .toptext .desc {padding-top:clamp(20px, calc( 35 / var(--inner) * 100vw ), 35px); font-size:clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight:500;}

.dottext {display:flex;align-items:center; margin-bottom:clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px);padding-bottom:clamp(12px, calc( 24 / var(--inner) * 100vw ), 24px);border-bottom:1px solid #eeeeee;}
.dottext .num {display:inline-flex;align-items:center;justify-content:center; margin-right:clamp(10px, calc( 24 / var(--inner) * 100vw ), 24px); width:clamp(30px, calc( 40 / var(--inner) * 100vw ), 40px); height:clamp(30px, calc( 40 / var(--inner) * 100vw ), 40px); background:var(--color-primary); color:#fff; font-size:clamp(14px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight:800; line-height:1;}
.dottext .num.black {background:#121212;}
.dottext .text {font-size:clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight:600;}

.sub3sec1-list {display:flex; flex-wrap:wrap; margin:-10px;}
.sub3sec1-item {flex:1 0 33.33%; max-width:33.33%; padding:10px;}
.sub3sec1-item .inner {padding:clamp(30px, calc( 55 / var(--inner) * 100vw ), 55px) clamp(20px, calc( 50 / var(--inner) * 100vw ), 50px); background:#f8f8f8; height:100%;} 
.sub3sec1-item .tit {margin-bottom:clamp(15px, calc( 25 / var(--inner) * 100vw ), 25px); font-size:clamp(22px, calc( 42 / var(--inner) * 100vw ), 42px); font-weight:800;background:linear-gradient(90deg,#b90006 0%,#230003 100%); background-position: left; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 40% 60%;}
.sub3sec1-item .desc {font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight:500;line-height:1.7;}
.sub3sec1-item .line {margin:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px) 0 clamp(15px, calc( 25 / var(--inner) * 100vw ), 25px); width:100%; height:1px; border-bottom:1px dashed #ccc;}
.sub3sec1-item .bullet .list {font-size:clamp(15px, calc( 15 / var(--inner) * 100vw ), 15px); color:#505050; line-height:2;}

.coreadd-list {display:flex;flex-wrap:wrap;margin:-40px;}
.coreadd-item {flex:1 0 50%; max-width:50%; padding:40px;}
.coreadd-item .head {padding-bottom:clamp(15px, calc( 15 / var(--inner) * 100vw ), 15px);}
.coreadd-item .head .title {margin-bottom:clamp(18px, calc( 30 / var(--inner) * 100vw ), 30px);padding-bottom:clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); border-bottom:2px solid #2c2c2c; font-size:clamp(22px, calc( 42 / var(--inner) * 100vw ), 42px); font-weight:800;}
.coreadd-item .inwid-list {display:flex;flex-wrap:wrap; margin: -7px;}
.coreadd-item .inwid-item {flex:1 0 50%; max-width:50%;padding: 7px;}
.coreadd-item .inwid-item .tit {margin-bottom:clamp(15px, calc( 26 / var(--inner) * 100vw ), 26px); font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight:800;}
.coreadd-item.left .inwid-item .tit {color:var(--color-primary);}
.coreadd-item.right .inwid-item .tit {color:#003049;}
.coreadd-item .inwid-item .list {font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px);line-height:2;color:#505050;}
.coreadd-item .inwid-item .list.border {color:#2c2c2c;font-weight:600;text-decoration:underline;}

.subm-tit {margin-bottom:clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px);padding-bottom:clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); border-bottom:2px solid #2c2c2c; font-size:clamp(22px, calc( 42 / var(--inner) * 100vw ), 42px); font-weight:800;}
.arrow-wrap {padding-bottom:clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px);background:url(../images/sub/oper-bg.png) no-repeat bottom center / contain; background-size:auto clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px);}
.arrow-wrap .inner {display:flex;flex-wrap:wrap; align-items:center; border:1px solid #dfdfdf;}
.arrow-wrap .inner .commbox {flex:1 0 50%; max-width:50%;}
.arrow-wrap .inner .iamges {padding:clamp(25px, calc( 50 / var(--inner) * 100vw ), 50px) 10px; text-align:center;}
.arrow-wrap .arrowcad-item {padding:clamp(25px, calc( 60 / var(--inner) * 100vw ), 60px) clamp(15px, calc( 55 / var(--inner) * 100vw ), 55px);}
.arrow-wrap .arrowcad-item .tit {margin-bottom:clamp(15px, calc( 35 / var(--inner) * 100vw ), 35px); font-size:clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight:600;}
.arrowcad-item.up .tit {color:#003049;}
.arrowcad-item.down .tit {color:var(--color-primary);}
.arrowcad-item.up {background:#f0f3f5;}
.arrowcad-item.down {background:#fbf7f7;}
.arrowcad-item .inlist {display:flex;flex-wrap:wrap;margin:-5px;}
.arrowcad-item .initem {flex:1 0 33.33%; max-width:33.33%; padding:5px;}
.arrowcad-item .ininner {display:flex;align-items:center;justify-content:center; position:relative; background:#fff; color:#505050;height:clamp(60px, calc( 89 / var(--inner) * 100vw ), 89px);text-align:center;}
.arrowcad-item .ininner:after {position:absolute;content:''; left:50%; top:-5px; transform:translatex(-50%); width:10px; height:10px;}
.arrowcad-item.up .ininner:after {background:#003049;}
.arrowcad-item.down .ininner:after {background:var(--color-primary);}
.arrow-down {margin-top:clamp(25px, calc( 40/ var(--inner) * 100vw ), 40px);}
.arrow-down .inner {padding:clamp(30px, calc( 70 / var(--inner) * 100vw ), 70px) 10px; border:1px solid #dfdfdf;}

.color-gray {color:#a8a8a8;}

.visionicn-list {display:flex;flex-wrap:wrap;margin:-10px;background:url(../images/sub/oper-arro4.png) no-repeat;background-size:auto  11px;background-position:bottom 30% center;}
.visionicn-item {flex:1 0 14.28%; max-width:14.28%; padding:10px; text-align:center;}
.visionicn-item .icn {display:flex;align-items:center;justify-content:center;height:clamp(120px, calc( 176 / var(--inner) * 100vw ), 176px);}
.visionicn-item .icn img {width:clamp(40px, calc( 64 / var(--inner) * 100vw ), 64px);}
.visionicn-item:nth-child(odd) .icn {border:1px solid #121212;}
.visionicn-item:nth-child(even) .icn {border:1px solid var(--color-primary);}
.visionicn-item .dotbx {margin-top:clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px);}
.visionicn-item .dot {display:inline-block; width:10px; height:10px; margin:0 auto;}
.visionicn-item:nth-child(odd) .dot {background:#121212;}
.visionicn-item:nth-child(even) .dot {background:var(--color-primary);}
.visionicn-item .name {padding-top:clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px); font-size:clamp(14px, calc( 18 / var(--inner) * 100vw ), 18px);line-height:1.66;font-weight:600;}

.addcore-list {display:flex;justify-content:center;flex-wrap:wrap;margin:-10px;}
.addcore-item {flex:1 0 50%; max-width:50%; padding:10px;}
.addcore-item .inner {padding:clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px) clamp(20px, calc( 60 / var(--inner) * 100vw ), 60px); background:#f8f8f8;height:100%;}
.addcore-item .icntitle {display:flex;align-items:center;margin-bottom:clamp(25px, calc( 40 / var(--inner) * 100vw ), 40px); font-size:clamp(18px, calc( 32 / var(--inner) * 100vw ), 32px);font-weight:800;}
.addcore-item .icntitle img {margin-right:clamp(10px, calc( 18 / var(--inner) * 100vw ), 18px); height:clamp(25px, calc( 48 / var(--inner) * 100vw ), 48px);}
.addcore-item .textlist + .textlist {margin-top:6px;}
.addcore-item .bullet-item {padding:clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px) clamp(15px, calc( 38 / var(--inner) * 100vw ), 38px); background:#fff;}
.addcore-item .bullet-list {padding-left:clamp(20px, calc( 24 / var(--inner) * 100vw ), 24px); font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px);}
.addcore-item .bullet-list:before {width:clamp(4px, calc( 8 / var(--inner) * 100vw ), 8px);height:clamp(4px, calc( 8 / var(--inner) * 100vw ), 8px); top:clamp(8px, calc( 10 / var(--inner) * 100vw ), 10px); background:#ccc;}

.quantity-list {display:flex;justify-content:center;flex-wrap:wrap;margin:-10px;}
.quantity-item {flex:1 0 25%; max-width:25%; padding:10px;}
.quantity-item .text {margin-top:clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); padding-left:clamp(18px, calc( 25 / var(--inner) * 100vw ), 25px);font-size:clamp(18px, calc( 32 / var(--inner) * 100vw ), 32px); position:relative; font-weight:800;}
.quantity-item .text:after {position:absolute; content:''; left:0;top:clamp(10px, calc( 14 / var(--inner) * 100vw ), 14px); width:clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px); height:clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px); background:var(--color-primary);}

.growth-wrap {padding-bottom:clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px); text-align:center; background:url(../images/sub/oper-arrow2.png) no-repeat bottom center /contain; background-size:auto clamp(100px, calc( 200 / var(--inner) * 100vw ), 200px); }
.growth-wrap .small {display:block;margin-bottom:clamp(15px, calc( 35 / var(--inner) * 100vw ), 35px);font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight:500;color:var(--color-primary);}
.growth-wrap .textbx {display:flex;justify-content:center;align-items:center;font-size:clamp(18px, calc( 36 / var(--inner) * 100vw ), 36px);font-weight:600;}
.growth-wrap .textbx:lang(en) {font-size:clamp(18px, calc( 34 / var(--inner) * 100vw ), 34px);}
.growth-wrap .textbx .text:lang(en) {flex:1 0 48%; max-width:48%;padding:0 10px;}
.growth-wrap .plus {margin:0 clamp(10px, calc( 15 / var(--inner) * 100vw ), 15px);}
.growth-wrap .plus img {width:clamp(25px, calc( 32 / var(--inner) * 100vw ), 32px);}

.goals-list {display:flex;justify-content:center;flex-wrap:wrap;margin:-10px;}
.goals-item {flex:1 0 50%;max-width:50%; padding:10px;}
.goals-item .inner {display:flex;align-items:center; padding:clamp(25px, calc( 50 / var(--inner) * 100vw ), 50px); background-color:#f8f8f8;background-image:url(../images/sub/oper-arrow3.png) ; background-repeat:no-repeat; background-position:right -25px top; background-size:auto clamp(100px, calc( 211 / var(--inner) * 100vw ), 211px); height:100%;} 
.goals-item .icn {margin-right:clamp(15px, calc( 40 / var(--inner) * 100vw ), 40px);flex:1 0 clamp(90px, calc( 160 / var(--inner) * 100vw ), 160px); max-width:clamp(90px, calc( 160 / var(--inner) * 100vw ), 160px);}
.goals-item .icn  img {width:clamp(80px, calc( 160 / var(--inner) * 100vw ), 160px);}
.goals-item .textbx {flex:1 0 auto; width:1%;}
.goals-item .textbx span {display:block;}
.goals-item .txt1 {margin-bottom:clamp(10px, calc( 15 / var(--inner) * 100vw ), 15px); font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight:600; color:var(--color-primary);}
.goals-item .txt2 {font-size:clamp(18px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight:bold;}

/* 영문 */
.subsec1_3_2-item .inner:lang(en) {flex-wrap: wrap;}
.subsec1_3_2-item .title:lang(en) {flex:1 0 100%; max-width: 100%; margin-bottom: 10px;}
.point-wrap .toptextbx .title:lang(en) {margin-top: clamp(20px, calc( 50 / var(--inner) * 100vw ), 50px); font-size: clamp(20px, calc( 36 / var(--inner) * 100vw ), 36px);}
.point-wrap .text-item .inner:lang(en) {padding: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px);}
.point-wrap .text-item .text:lang(en) {margin-top: clamp(15px, calc( 28 / var(--inner) * 100vw ), 28px); font-size: clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px);}
.sub3sec1-item .tit:lang(en) {background-size: auto;}
.coreadd-item .head:lang(en) {height: 400px;}
.view-nav .title:lang(en) {word-break:break-all;}
.area-wrapper .iconbx:lang(en) {flex:1 0 clamp(140px, calc( 200 / var(--inner) * 100vw ), 200px); max-width: clamp(140px, calc( 200 / var(--inner) * 100vw ), 200px); }
.graph-item .animimg:lang(en) {bottom:-34.5%;}