@charset "utf-8";
.proBg{background-color: #f3f3f3;overflow: hidden;}
.pageContent p.desc{font-size: 20px;line-height: 1.5;margin-bottom: 20px;}
.pageContent p.fz18{font-size: 18px;line-height: 1.3;}
.subTit{position: relative;padding: 100px 0 70px;text-align: center;font-family: 'Gmarket Sans';letter-spacing: -3px;}
.subTit h2{display: block;font-size: 70px;font-weight: 700;padding-right:30px;display: inline-block;position: relative;margin-bottom: 10px;}
.subTit h2::after{display: block;content: '';position: absolute;right: 0;background-color: #f00;width: 20px;height: 6px;border-radius:0 ;animation-name:pickout;  animation-duration: 0.7s;  animation-delay: 1.25s;animation-fill-mode: forwards;opacity: 0;bottom: 70px;}
@keyframes pickout {
0{transform:scale(.5, .9);}
10% {transform: scale(1, 1.5);bottom: 0;opacity: 1;}
100% {transform: scale(1, 1);bottom: 17px;opacity: 1;}
}
.subTit p{line-height: 1.1;font-size: 34px;}
:lang(en) .subTit p{font-family: 'Manrope';letter-spacing: 0;}
.pageContent  .wrapper,
.pageContent.wrapper{max-width: 1200px;}
.pageContent{padding-bottom: 60px;min-height: 500px;}
.pageContent::after{display: block;content: '';clear: both;}
.pageContent.pb0{padding-bottom: 0;}

@media screen and (max-width:1024px) {
.subTit{padding: 50px 0 30px;letter-spacing: -2px;}
.subTit h2{font-size: 50px;}
.subTit p{font-size: 22px;letter-spacing: -1px;}
.pageContent p.desc{font-size: 18px;}
.pageContent p.fz18{font-size: 16px;}

}
@media screen and (max-width:815px) {
.pageContent{padding-bottom: 40px;min-height: 300px;}
}
@media screen and (max-width:500px) {
.subTit{padding: 35px 0 25px;}
.subTit h2{font-size: 35px;}
.subTit p{font-size: 18px;font-weight: 500;opacity: .7;}
}
@media screen and (max-width:340px) {
.subTit h2{font-size: 30px;}
.subTit p{font-size: 16px;}
}

table.classic { border: 0; border-collapse: separate; width: 100%; border-top: solid 2px #000;border-bottom: 1px solid #000;}
table.classic td,
table.classic th { border: 0; border-bottom: solid 1px #e5e5e5; border-left: solid 1px #e5e5e5;color: #000;padding: 12px .5% ; text-align: center; line-height: 1.3; vertical-align: middle;  height: auto ;word-wrap:break-word;word-break: break-all;font-size: 18px;font-family:'Noto Sans KR',sans-serif;}
table.classic thead th { background: #f7f7f9; border-bottom-color: #333;font-weight: 400;mix-blend-mode: multiply;background-blend-mode: multiply;}
table.classic thead th.first { border-left: none; }
table.classic tbody td.first { border-left: none}
table.classic tbody th {font-weight: 400; border-left: none;}
table.classic th.bdr{border-right: solid 1px #e5e5e5;}
table.classic .bdl0{border-left:0}
table.classic th.left { padding-left:10px; text-align:left; }
table.classic td.left,
table.classic tr.left td{padding-left:2.5%; text-align: left;padding-right: 1%; }
table.classic td.va-t{vertical-align: top;}
table.classic.tdLeft tbody td{text-align: left;padding-left: 15px;}
table.classic.fw-n td.left{font-weight: 300;}
table.classic .bdt th,table.classic .bdt td{border-top: 1px solid #000;}
table.classic.center th,
table.classic.center td {text-align: center !important;padding-left: 0 !important;padding-right: 0 !important;}
table.classic.dark thead th {background:#dedfe4;border-left-color: #ccc;border-bottom: none;}
@media screen and (max-width:1024px) {
table.classic td, table.classic th{font-size: 16px;padding-top: 10px;padding-bottom: 10px;line-height: 1.2;}
}
@media screen and (max-width:770px) {
.m_scroll {overflow: scroll}
.m_scroll table.classic{width: 800px;}

}
/*******
brand story
*******/
.subTit2,
.pageTit{font-family: 'Gmarket Sans';line-height: 1.05;font-weight: 300;text-align: center;position: relative;}
.subTit2{font-size: 18px;letter-spacing: -1px;margin-bottom: 40px;}
.pageTit {font-size: 60px;letter-spacing: -2px;margin-bottom: 70px;}
:lang(en) .pageTit {font-size: 50px;letter-spacing: -1px;}
.pageTit b,
.subTit2 b{display: block;font-weight: 700;}
.videoArea{margin:  0 auto 135px;height: 0;position: relative;padding-top: 50.8333%;max-width: 1200px;}
.videoArea iframe{position: absolute;top: 0;left: 0;width: 100%  !important;bottom: 0;height: 100% !important;}
.concepts{overflow: hidden;margin-left: -45px;margin-bottom: 130px;}
.concepts dl{float: left;margin-left: 45px;width:calc(100%/3 - 45px) ;border-top: 3px solid #000;padding-top: 25px;}
.concepts dl dt{font-family: 'Gmarket Sans';letter-spacing: -2px;padding: 0 0 20px;}
:lang(en) .concepts dl dt{font-family: inherit;letter-spacing: 0;}
.concepts dl dt em{font-style: normal;display: block;font-weight: 500;}
.concepts dl b{display: block;}
.concepts dl dt b{font-size: 40px;padding-top: 20px;}
.concepts dl dd{font-size: 18px;letter-spacing: -1px;line-height: 1.15;}
.concepts dl dd b{letter-spacing: 0;font-size: 15px;font-family: 'Gmarket Sans';margin-bottom: 10px;color: #372180;}
.concepts dl dd img{display: block;max-width: 100%;font-size: 0;margin-bottom: 30px;}

.naming{font-family: 'Gmarket Sans';letter-spacing: -2px;padding: 120px 0;position: relative;color: #fff;max-height:910px;}
.naming::before{display: block;position: absolute;content: '';background: #272727 url(../img/content/nmbg.jpg) center 0 no-repeat;top: 0;left: 0;bottom: 0;right: 0;}
.nmBall, .nmBall li,
.nmMath, .nmMath li{list-style-type: none;margin: 0;padding: 0;}
.nmBall,.nmBall li{list-style-type: none;margin: 0;padding: 0;}
.nmBall{display: flex;margin-bottom: 70px;margin-left: -120px;padding-top: 40px;}
.nmBall li{width: calc(100%/3 - 120px);text-align: center;height: 0;position: relative;padding-top: calc(100%/3 - 120px);margin-left: 120px;}
.nmBall li::before{display: block;content: '';border: 1px solid #fff;border-radius:50% ;position: absolute;top: 0;left: 0;width: auto;height: auto;opacity: .4;right: 0;bottom: 0;}
.nmBall li::after{display: block;content: '+';color: #fff;width: 120px;left: -120px;top: 35%;position: absolute;font-size: 100px;font-family: 'Gmarket Sans';}
.nmBall li:nth-child(1):after{display: none;}
.nmBall li:nth-child(3):after{content: '=';}
.nmBall dl{  position: absolute;  left: 50%;  top: 50%;  transform: translate(-50%, -50%);color: #fff;z-index: 1;font-size: 30px;line-height: 1.15;letter-spacing: -1px;width: 100%;}
.nmBall dl dt{font-size: 50px;font-weight: 500;margin-bottom: 15px;}
.nmBall dl dd span{display: block;}
.nmBall dl dt b{font-weight: 700;}
.nmMath li{margin-bottom: 20px;height: 40px;padding-top: 20px;line-height: 1.05;padding-left: 180px;background-color: rgba(255,255,255,.15);color: #fff;font-size: 24px;letter-spacing: -1px;}
.nmMath li b{display: inline-block;width: 245px;vertical-align: middle;font-weight: 500;}
.nmMath li em{font-weight: 700;font-style: normal;}

.with{padding: 140px 0 70px;position: relative;}
.withTxt{position: absolute;display: block;font-size: 195px;opacity: .03;top: 80px;left: calc(50% - 660px);font-family: 'Gmarket Sans';letter-spacing: -4px;font-weight: 700;overflow: hidden;max-width: 1200px;}
.withTxt span{display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;line-height: 1.05;}
.withBall,.withBall li{list-style-type: none;margin: 0;padding: 0;}
.withBall{display: flex;margin-bottom: 70px;margin-left: -60px;text-align: center;}
.withBall li{width: calc(100%/3 - 60px);margin-left: 60px;}
.withBall dl{font-family: 'Gmarket Sans'; line-height: 1;font-size: 0;letter-spacing: -2px}
.withBall dl dt{overflow: hidden;height: 0;position: relative;padding-top: 100%;}
.withBall dl dt::before{display: block;content: '';background-color: #666;background-repeat: no-repeat;background-position: center;border-radius:50% ;position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.withBall dl.with1 dt::before{background-image: url(../img/content/with_1.jpg);}
.withBall dl.with2 dt::before{background-image: url(../img/content/with_2.jpg);}
.withBall dl.with3 dt::before{background-image: url(../img/content/with_3.jpg);}
.withBall dl dt b{position: absolute;  left: 50%;  top: 50%;  transform: translate(-50%, -50%);color: #fff;z-index: 1;line-height: 1.2;;width: 100%;font-size: 40px;font-weight: 700;margin-bottom: 30px;display: block;}
.withBall dl dt b span{display: block;}
.withBall dl dd{font-size: 30px;font-weight: 500;padding-top: 30px;}

@media screen and (max-width:1180px) {
.nmBall{margin-left: -70px;padding-top: 0;}
.nmBall li{width: calc(100%/3 - 70px);margin-left: 70px;padding-top: calc(100%/3 - 70px);}
.nmBall li::after{width: 70px;font-size: 70px;left: -70px;}
.nmBall dl{font-size: calc(20px + (30 - 20) * ((100vw - 320px) / (1200 - 320)));}
.nmBall dl dt{font-size: 1.2em;}
.nmMath li{padding-left: 6%;}
.videoArea,
.concepts {margin-bottom: 70px;}
.with{padding: 70px 0 0;}
.withTxt{font-size: 160px;left: -10px;}
}
@media screen and (max-width:1024px) {
.pageTit {font-size: 50px;margin-bottom: 30px;}
.withTxt{font-size: calc(80px + (120 - 80) * ((100vw - 320px) / (1200 - 320)));}
}
@media screen and (max-width:950px) {
.concepts{margin-left: -25px;}
.concepts dl{margin-left: 25px;width:calc(100%/3 - 25px) ;padding-top: 15px;}
.concepts dl dt b{font-size: 28px;padding-top: 10px;}
.concepts dl dt{padding-bottom: 10px;}
.concepts dl dd img{margin-bottom: 15px;}
.concepts dl dd b{font-size: 14px;}
.naming{max-height: 100%;padding: 6.6% 0;}
.nmBall{margin-bottom: 35px;}
.nmMath li{height: auto;padding: 15px 4%;font-size: 20px;line-height: 1.15;}
.nmMath li b{display: block;width: auto;font-size: 16px;margin-bottom: 5px;}
.withBall{margin-bottom: 0;}
}
@media screen and (max-width:850px) {
.withBall {margin-left: -25px;}
.withBall li{width: calc(100%/3 - 25px);margin-left: 25px;}
.withBall dl{letter-spacing: -1px;}
.withBall dl dt b{font-size:calc(20px + (40 - 20) * ((100vw - 320px) / (1200 - 320))); }
.withBall dl dd{font-size: calc(14px + (30 - 16) * ((100vw - 320px) / (1200 - 320)));padding-top: 7%;}
}
@media screen and (max-width:700px) {
.nmBall{margin-left: -70px;display: block;overflow: hidden;}
.nmBall li{width: calc(100%/2 - 70px);margin-left: 70px;padding-top: calc(100%/2 - 70px);float: left;margin-bottom: 20px;}
.nmBall li:nth-child(3){float: right;}
}
@media screen and (max-width:670px) {
.concepts{margin-left: 0;}
.concepts dl{float: none;width: 100%;margin-left: 0;margin-bottom: 30px;border-top-width: 1px ;}
.concepts dl dd span {display: block;background-color: #e9e9e9;}
}
@media screen and (max-width:500px) {
.nmBall{margin-bottom: 15px;}
.nmBall dl dt{margin-bottom: 4px;}
.pageTit {font-size: 35px;}
.with{padding-top: 40px}
.withBall {margin-left: 0;display: block;}
.withBall li{margin-left: 0;width: 180px;margin:0 auto 20px;}
.withBall dl dt b{font-size:28px}
.withBall dl dd{font-size: 20px;}
}
@media screen and (max-width:340px) {
.pageTit {font-size: 30px;}
.nmBall dl{font-size:16px}
}
/**********
BI
**********/
.biImg{border-top: 2px solid #000;overflow: hidden;display: inline-block;}
.biImg img{font-size: 0;display: block;max-width: 100%;margin-top: -1px;}
.titByCont{overflow: hidden;font-size: 0;line-height: 1.4;margin-bottom: 90px;padding-top: 25px;}
.titByCont dt{width: 220px;float: left;font-weight: 700;font-family: 'Gmarket Sans';font-size: 20px;}
.titByCont dd{margin-left: 220px;font-size: 20px;text-align: justify;}
.byHalf {overflow: hidden;margin-bottom: 100px;}
.byHalf b{font-weight: 700;font-family: 'Gmarket Sans';font-size: 20px;display: block;padding-top: 25px;}
.colorCode{padding: 35px 0;color: #fff;background-color: #210972;text-align: center;font-size: 20px;}
.colorCode dt,.colorCode dd{display: inline-block;vertical-align: middle;}
.colorCode dt{font-family: 'Gmarket Sans';font-weight: 700;padding-right: 50px;}
.colorCode dd span{letter-spacing: -1px;display: inline-block;position: relative;padding-left: 16px;margin-left: 11px;}
.colorCode dd span::before{display: block;content: '';width: 1px;background-color: #fff;height: 14px;left: 0;top: 50%;position: absolute;opacity: .3;margin-top: -7px;}
.colorCode dd i{display: inline-block;vertical-align: middle;width: 6px;}
.colorChart, .colorChart li{list-style-type: none;padding: 0;margin: 0;}
.colorChart{display: table;width: 100%;background-color: #210972;}
.colorChart li{font-size: 17px;text-align: center;display: table-cell;height: 40px;line-height: 39px;color: #fff;position: relative;width: 10%;font-weight: 400;}
.colorChart li::before{display: block;content: '';position: absolute;top: 0;left: 0;right: 0;bottom: 0;background-color: #fff;}
.colorChart li:nth-last-child(1)::before{opacity: .0}
.colorChart li:nth-last-child(2)::before{opacity: .1;}
.colorChart li:nth-last-child(3)::before{opacity: .2;}
.colorChart li:nth-last-child(4)::before{opacity: .3;}
.colorChart li:nth-last-child(5)::before{opacity: .4;}
.colorChart li:nth-last-child(6)::before{opacity: .5;}
.colorChart li:nth-last-child(7)::before{opacity: .6;}
.colorChart li:nth-last-child(8)::before{opacity: .7;}
.colorChart li:nth-last-child(9)::before{opacity: .8;}
.colorChart li:nth-last-child(10)::before{opacity: .9;}
@media screen and (max-width:1240px) {
.byHalf > div {width: 48.33%;}
}
@media screen and (max-width:1024px) {
.titByCont,.byHalf {margin-bottom: 40px;}
.byHalf b,.titByCont{padding-top: 10px;}
.byHalf b,
.titByCont dt,.titByCont dd{font-size: 18px;}
.titByCont dt{width: 170px;}
.titByCont dd{margin-left: 170px;}
}
@media screen and (max-width:900px) {
.colorCode{padding: 25px 0;font-size: 18px;}
.colorCode dt{padding-right: 25px;}
.colorCode dd span{padding-left: 12px;margin-left: 7px}
.colorCode dd i{width: 4px;}
}
@media screen and (max-width:770px) {
.colorCode dt{padding-right: 0;display: block;opacity: .7;text-transform: uppercase;}
.colorCode dd{display: block;padding-top: 25px;}
.colorCode dd b{display: block;margin-bottom: 14px;}
.colorCode dd span{padding: 14px 0 ;margin:0 auto;display: block;}
.colorCode dd span::before{width: 200px;height: 1px;top: 0;margin-top: 0;left: 50%;margin-left: -100px;}
.colorChart li{line-height: 29px;height: 30px;font-size: 14px;width: auto;}
}
@media screen and (max-width:580px) {
.titByCont dt{width: auto;float: none;}
.titByCont dd{margin-left: 0;}
.byHalf > div {width: auto;float: none;margin-bottom: 20px;}
}
@media screen and (max-width:360px) {
.colorChart li{font-size: 12px;}
.byHalf b,
.titByCont dt,.titByCont dd{font-size: 16px;}
}
/*****
story
*******/
.detailTab {position:relative;text-align: center;font-family: 'Gmarket Sans';letter-spacing: -2px;}
.detailTab ul {margin: 0;list-style-type: none;padding: 0;}
.detailTab ul:after {display:block;	clear:both;	content:''}
.detailTab ul li {	margin: 0;list-style-type: none;display: block;float:left;width:33.33%;position: relative;	padding: 0;}
.detailTab ul li a {display:block;font-size: 18px;color: #666;text-align:center;letter-spacing: -1px; font-weight: 300;background:#f8f8f8;line-height:58px;border:solid 1px #ddd;border-left:0;position:relative}
.detailTab ul li a.active {color: #000;font-weight: 500;background:#fff;border-color:#000;border-bottom-color:#fff;border-left:solid 1px #000;margin-left:-1px}
.detailTab ul li:first-child a{border-left:solid 1px #ddd}
.detailTab ul li:first-child  a.active{border-left-color:#000}
.backTle{background-color: #666;line-height: 1.1;font-family: 'Gmarket Sans';letter-spacing: -1.5px;color: #fff;text-align: center;background-repeat: no-repeat;background-position: center;height: 210px;margin: 40px auto ;position: relative;background-image: url(../img/content/story_back.jpg);}
.backTle em{display: block;font-size: 30px;font-style: normal;font-weight: 700;position: absolute;top: 50%;margin-top: -10px;left: 0;right: 0;}
.tab_content{display: none;}
.story dl{margin-bottom: 75px;overflow: hidden;}
.story dt{font-size: 60px;letter-spacing: -1px;font-weight: 700;color:#000;padding-top: 25px;position: relative;width: 20.83%;float: left;;border-top: 4px solid #000;}
.story dd{border-top: 1px solid #333;float: right;width: 75.83%;}
.story dd p{position: relative;padding:30px 0 30px 110px;font-size: 20px;line-height: 1.3;border-bottom: 1px solid #ddd;color: #333;}
.story dd p:last-of-type{border: none;}
.story dd p em{font-style: normal;display: block;position: absolute;top: 30px;left: 0;color: #000;font-weight: 700;font-size: 1.05em;}
@media screen and (max-width:1100px) {
.story dl{margin-bottom: 40px;}
.story dt,.story dd{float: none;width: auto;}
.story dt{padding-top: 18px;font-size: 40px;padding-bottom: 18px;}
.story dd p{padding: 20px 0 20px 80px;font-size: 18px;}
.story dd p em{top: 21px;}
}
@media screen and (max-width:815px) {
.backTle{height: 130px;}
.detailTab ul li a {font-size: 16px;line-height:45px;height: 43px;}
}
@media screen and (max-width:450px) {
.backTle{height: 110px;}
.backTle em{font-size: 55px;font-size:calc(19px + (30 - 19) * ((100vw - 300px) / (1200 - 300)));}
.story dl{margin-bottom: 30px;}
.story dt{padding-top: 12px;font-size: 30px;padding-bottom: 13px;}
.story dd p{padding: 15px 0 15px 75px;font-size: 16px;}
.story dd p em{top: 14px;}
}

/********
재품소개
*********/
#sidebar{position: absolute;top: 230px;left: 0;z-index: 99;}
#nav ul,#nav li {list-style: none;margin: 0;padding: 0;}
#nav li a {font-size: 18px;display: inline-block;padding: 10px 20px  ;line-height: 1.2;text-align: left;position: relative;color: #444;}
#nav li a.active::after{display: block;content: '';background-color: #f00;height: 3px;width: 15px;position: absolute;right: 0;bottom: 16px;}
#nav li a.active {color: #000;font-weight: 500;}
#nav li a:hover{color: #4d2dc4;text-decoration: underline;}
#nav.stick { position: fixed;    top: 100px;    }

.proSector{/* min-height: 620px; */position: relative;z-index: 1;overflow: hidden;transition:.35s ease-out}
.proSector.proBg{background-color: #f3f3f3;}
.proSector#sector0.active{padding-top: 110px;}
.proSector ul,.proSector li,.proSector ol{list-style-type: none;margin: 0;padding: 0;}
.proSector .videoArea{margin-bottom: 20px;}
.proTit{font-family: 'Gmarket Sans';letter-spacing: -2px;margin-bottom: 35px;font-size: 40px;padding-top: 120px;position: relative;z-index: 2;}
.proTit b{display: block;}
.proTit span{display: inline-block;font-weight: 300;position: relative;padding-right: 30px;}
.proTit span::after{display: block;content: '';position: absolute;right: 0;background-color: #f00;width: 20px;height: 6px;bottom: 7px;}
.proTit.fz_lzr{font-size:50px;}
:lang(en) .proTit.fz_lzr{font-size:35px;line-height: 1.1;}
/* proModel */
.modelTab{overflow: hidden;border-radius: 30px 30px 0 0;margin-bottom: 50px;}
.modelTab a{display: block;float: left;width: 50%;text-align: center;font-size: 20px;line-height: 60px;background-color: #f5f5f5;color: #555;}
.modelTab a.on{color: #fff;background-color: #444;font-weight: 500;}
.proModel li{border-bottom: 1px solid #ccc;padding-bottom: 60px;margin-bottom: 60px;position: relative;overflow: hidden;height: 390px;}
.proModel li:last-child{border-bottom: 0;}
.proModel ._img{background-color: #ccc;background-size:cover;background-repeat: no-repeat;background-position:center;width: 50%;height: 390px;float: left;margin-right: 8.33%;position: relative;}
.proModel ._img img{position: absolute;top: -9999px;z-index: -20;}
.proModel ._img .flg{position: absolute;top: 0;right: 20px;text-align: center;width: 70px;height: 30px;padding-top: 30px;border-radius:0 0 10px 10px ;color: #fff;background-color: #493B90;font-weight: normal;font-size: 15px;}
.proModel ._img .flg.type2{background-color: #F71F20;}
:lang(en) .proModel ._img .flg {padding-top: 0;height: 60px;font-size: 0;vertical-align: middle;line-height: 60px;}
:lang(en) .proModel ._img .flg span{display: inline-block;font-size: 14px;line-height: 1;vertical-align: middle;}

.proModel ._tit dt{font-family: 'Gmarket Sans';letter-spacing: -3px;font-size: 50px;margin-bottom: 10px;font-weight: 700;padding-top: 19px;}
.proModel ._tit dd{font-size: 20px;line-height: 1.3;margin-bottom: 40px;}
.proModel ._spec {overflow: hidden;font-size: 18px;}
.proModel ._spec dt{float: left;font-weight: 500;padding-top: 16px;line-height: 1.2;width: 110px;}
.proModel ._spec dd{padding-left: 110px;border-bottom: 1px solid #e5e5e5;text-overflow: ellipsis;white-space: nowrap;line-height: 1.2;padding-top: 16px;padding-bottom: 16px;}

.proComp{position: relative;margin-bottom: 120px;margin-top: -35px;z-index: 1;}
.proComp img{position: relative; max-width: 100%;}

.proTech {counter-reset: item;border-bottom: 4px solid #000;}
.proTech > li {position: relative;border-top: 1px solid #888;padding-top: 70px;padding-bottom: 70px;min-height: 340px;overflow: hidden;}
.proTech > li::after{display: block;content: '';clear: both;}
.proTech > li:first-child{padding-top: 15px;border-top: 0;}
.proTech li dl{width: 410px;float: left;}
.proTech li dl dt{position: relative;font-family: 'Gmarket Sans';letter-spacing: -2px;font-size: 50px;font-weight: 700;padding-top: 70px;margin-bottom: 17px;z-index: 2;}
.proTech li dl dt::before{content: counter(item, decimal-leading-zero) " "; counter-increment: item;color: #f4f4f4;letter-spacing: -4px;font-size: 110px;position: absolute;top: 0;left: 0;z-index: -1;}
.proTech li dl dd{font-size: 20px;line-height: 1.4;letter-spacing: -1px;text-align: justify;}
.proTech .imgArea{position: relative;float: right;}
.proTech .imgArea.tech1{padding-top: 50px;margin-bottom: -40px;}
.proTech .imgArea.tech2{margin-top: -23px;}
.proTech .imgArea.tech3{margin-top: -13px;padding-right: 10%;}
.proTech > li > .order {clear: both;}
.proTech .order {font-size: 0;overflow: visible;padding-top: 35px;position: relative;z-index: 2;}
.proTech .order li{display: inline-block;vertical-align: middle;position: relative;padding-right: 40px;margin-bottom: 10px;}
.proTech .order li::after{display: block;content: '\e154';position: absolute;right: 7px;font-size: 28px;top: 50%;margin-top: -14px;font-family: 'Material Icons';/* foward*/}
.proTech .order li p{display: inline-block;padding: 0 28px;border-radius:2.5em ;font-size: 20px;border: 1px solid #ddd;line-height: 50px;letter-spacing: -1.3px;position: relative;}
.proTech .order li:last-child{padding-right: 0;}
.proTech .order li:last-child::after{display: none;}
.proTech .order li:last-child p{border: none;line-height: 52px;background-color: #111;color: #fff;}
.orders{padding-top: 15px;clear: both;}
.orders::after{display: block;content: '';clear: both;}
.orders p em{font-style: normal;position: absolute;top: -8px;font-size: 15px;left: 25px;display: inline-block;line-height: 1.02;padding: 0 4px;background-color: #fff;font-weight: 400;}

.proTit2{font-size: 24px;position: relative;padding-left: 18px;line-height: 1.1;margin-bottom: 20px;}
.proTit2::before{display: block;content: '';position: absolute;top: 2px;left: 0;width: 10px;height: 20px;border-radius:5px ;background-color: #242b5f;}
.proTit2 span{font-weight: 300;}
.proTit1{font-family: 'Gmarket Sans';letter-spacing: -3px;font-size: 50px;margin-bottom: 20px;}
.proTit3{font-size: 20px;font-weight: 700;margin-bottom: 5px;}

.posmac{position: relative;padding-top: 20px;padding-bottom: 30px;}
.posmac .tips{position: absolute;top: 0;right: 70px;width: 347px;height: 177px;}
.posmac .tips p{position: absolute;font-size: 14px;background-color: #f3f3f3;top: 0;right: 0;display: inline-block;padding:2px 4px;line-height: 1.1;font-family: 'Noto Sans KR';font-weight: 400;}
.posmac .tips p.tip1{top: -4px;right: 105px;}
.posmac .tips p.tip2{top: 22px;right: 70px;}
.posmac .tips p.tip3{top: 48px;right: 42px;}
:lang(en) .posmac .tips p.tip1{right: 75px;top: -15px;}
:lang(en) .posmac .tips p.tip2{right: 30px;}
.proCertis {font-size: 0;display: table;width: 100%;}
.proCertis li{text-align: center;display: table-cell;vertical-align: top;}
.proCertis li:first-child{text-align: left;}
.proCertis li:last-child{text-align: right;}
.proCertis img{max-width: 100%;font-size: 0;line-height: 0;}
.proCerti::after{display: block;content: '';clear: both;}
.proCerti {margin-bottom: 50px;padding-top: 20px;}
.proCerti .frt{width: 58%;}
@media screen and (max-width:1260px) {
.proModel ._img{margin-right: 4%;}
.proTech li dl{width: 34%;}
.proTech .imgArea{width: 64%;text-align: right;}
.proTech .imgArea img{max-width: 100%;}
.proTech .imgArea.tech3{padding-right: 0;}
.proCertis li{padding: 0 5px;}
.proCertis li:first-child{padding-left: 0;}
.proCertis li:last-child{padding-right: 0;}
}
@media screen and (max-width:1200px) {
.proTech li dl,
.proTech .imgArea{float: none;width: auto;text-align: left;}
.proTech .imgArea.tech1{padding-top: 20px;margin-bottom: 0;}
.proTech .imgArea.tech2,
.proTech .imgArea.tech3{margin-top: 20px;}
.proTech .orders .flt,
.proTech .orders .frt{float: none;}
.posmac .tips{right: 0;}
}
@media screen and (max-width:1024px) {
.proTit{padding-top: 80px;font-size: 30px;}
.proTit1{font-size: 36px;}
.proTit3{font-size: 18px;}
.proModel li{height: auto;padding-bottom: 30px;margin-bottom: 30px;}
.proModel ._img{height: 280px;}
.proModel ._tit dt{letter-spacing: -2px;font-size: 40px;padding-top: 10px;}
.proModel ._tit dd{font-size: 18px;line-height: 1.2;margin-bottom: 20px;}
.proModel ._spec {font-size: 16px;}
.proModel ._spec dt{padding-top: 10px;width: 70px;}
.proModel ._spec dd{padding-left:70px;padding-top: 10px;padding-bottom: 10px;}

.proTech .order li p{display: block;padding: 0 15px;font-size: 17px;line-height: 40px;letter-spacing: -1.3px;}

.posmac .tips{position: relative;right: auto;top: auto;margin-top: 40px;}
table.classic.mb100{margin-bottom: 0;}
.proCerti .flt,.proCerti .frt{float: none;}
.proComp{margin-bottom: 60px;}
.pageContent.forPro{padding-top: 50px;}
#nav.stick{top: 60px;background-color: #fff;}
#sidebar{top: 190px;overflow: hidden;width: 100%;background-color: #fff;}
#nav {text-align: center;width: 100%;display: inline-block;-webkit-box-sizing: border-box;box-sizing: border-box;white-space: nowrap;overflow-y: hidden;overflow-x: auto;-webkit-overflow-scrolling: touch;text-align: center;list-style: none;font-size: 0;padding: 0 3%;height: 60px;}
#nav ::-webkit-scrollbar{display:none;}
#nav li{list-style-type: none;margin: 0;padding: 0;position:relative;box-sizing: border-box;display: inline-block;vertical-align: top;height: 100%;}
#nav li a{position:relative;width: 100%;height: 100%;display: flex;flex-wrap: wrap;align-items: center;font-size: 16px;font-weight: 400;padding:0 15px;box-sizing:border-box;letter-spacing:-1px;}
#nav li a.active{ color:#ED1B24; font-weight: 700;}
#nav li a::after{display: block;content: '';position: absolute;bottom: 10px;left: 50%;right: 50%;height: 2px;background-color: #ED1B24;opacity: 0;transition: .25s;width: auto;}
#nav li a:hover::after,
#nav li a.active::after{left: 15px;right: 15px;height: 2px;opacity: 1;width: auto;bottom: 10px;background-color: #ED1B24;}
#nav li + li:before{display: inline-block;content: "";position: absolute;top:50%;left: -1px;width: 1px;height: 10px;background: rgba(0,0,0,0.13);vertical-align: top;transform:translateY(-50%);}
#nav { scrollbar-width: thin;  scrollbar-color: #e8e8e8 transparent;}
#nav::-webkit-scrollbar {  height:5px;}
#nav::-webkit-scrollbar-track {  background: #d8d7d6; }
#nav::-webkit-scrollbar-thumb {  background: #383736;   border-radius:0;}
.proSector.active .wrapper{padding-top: 60px}
.proSector#sector0.active{padding-top: 60px;}
}
@media screen and (max-width:680px) {
.proSector .videoArea{margin-bottom: 0;}
.proModel ._img{height: auto;background: none !important;float: none;margin-right: 0;margin-bottom: 10px;width: auto;}
.proModel ._img img{position: static;z-index: 0;top: 0;width: 100%;}
.proModel li{border-bottom: none;}
.modelTab{margin-bottom: 10px;border-radius:20px 20px 0 0}
.modelTab a{line-height: 45px;font-size: 17px;}
.proComp{margin-top: 0;}

.proTit{padding-top: 50px;font-size: 24px;margin-bottom: 20px;}
.proTit2{font-size: 20px;margin-bottom: 10px;padding-left: 10px;}
.proTit2::before{width: 6px;height: 16px;}
.proTech li dl dt{font-size: 35px;padding-top: 35px;margin-bottom: 10px}
.proTech li dl dt::before{font-size:50px;}
.proTech li dl dd{font-size: 17px;line-height: 1.3}
.proTech > li{padding-bottom: 0;min-height: 100%;padding-top: 20px;}
.proTech .order {padding-top: 15px;}
.proTech .order li{display: block;padding-right: 0;margin-bottom: 0;padding-bottom: 40px;text-align: center;}
.proTech .order li p,.proTech .order li:last-child p{display: block;padding: 10px;font-size: 17px;line-height: 1.2;letter-spacing: -1px;}
.proTech .order li::after{content: '\e154';position: absolute;right: auto;left: 50%;margin-left: -10px;top: auto;margin-top: 0;bottom: 5px;transform:rotate(90deg)}

}
@media screen and (max-width:500px) {
#sidebar{top: 160px;}
.proSector.active .wrapper{padding-top: 90px;}
.proSector#sector0.active{padding-top: 40px;}
}
@media screen and (max-width:380px) {
#nav{height: 45px;}
#nav li a{padding: 0 10px;}
#nav li a:hover::after,
#nav li a.active::after{left: 10px;right: 10px;}
}
@media screen and (max-width:340px) {
#sidebar{top: 140px;}
}

/***********
SDGS
*************/
.sdgLogo{position: relative;padding-top: 25%;height: 0;background: #f3f3f3 ;text-indent: -999em;}
.sdgLogo::before{content: '';position: absolute;top: 0;left: 0;right: 0;bottom: 0;background: #f3f3f3 url(../img/content/sdg.png) center no-repeat;}
.sdgs .proTit2::before{top: 0;}
.sdgs .proTit b{font-weight: 300;}
.sdgs .proTit span{font-weight: 700;}
.sdgs .proTit2{margin-bottom: 5px;}
.sdgHalf {padding-bottom: 100px;}
.sdgHalf > div{width: 48.333%;}
.sdgHalf img{margin: 0;}
.sdgHalf .proTit2{padding-left: 0;}
.sdgHalf .proTit2::before{display: none;}
.sdgHalf img.flt{margin-right: 20px;}
.sdgHalf .blank{height: 100px;}
.sdgBall,.sdgBall li{list-style-type: none;margin: 0;padding: 0;}
.sdgBall{display: flex;margin-left: -80px;padding-top: 20px;}
.sdgBall li{width: calc(100%/4 - 80px);text-align: center;height: 0;position: relative;padding-top: calc(100%/4 - 80px);margin-left: 80px;font-family: 'Gmarket Sans';}
.sdgBall li::before{display: block;content: '';border: 1px solid #ddd;border-radius:50% ;position: absolute;top: 0;left: 0;width: auto;height: auto;right: 0;bottom: 0;}
.sdgBall li::after{display: block;content: '+';color: #999;width: 80px;left: -80px;top: 50%;position: absolute;font-size: 57px;font-family: 'Gmarket Sans';font-weight: 500;margin-top: -30px;}
.sdgBall p{  position: absolute;  left: 50%;  top: 50%;  transform: translate(-50%, -50%);color: #000;z-index: 1;font-size: 30px;line-height: 1.05;letter-spacing: -2px;width: 100%;font-weight: 500;}
.sdgBall p span{display: block;}
.sdgBall li:first-child:after{display: none;}
.sdgBall li:last-child:after{content: '=';}
.sdgBall li:last-child::before{background-color: #009edb;border: none;}
.sdgBall li:last-child p{color: #fff;}

:lang(en) .sdgBall li{font-family: inherit;}
:lang(en) .sdgBall p{letter-spacing: inherit;font-size: 27px;}

.slideArea{position: relative;padding-bottom: 120px;}
.sdgSwiper{position: relative;padding-top: 20px;padding-bottom: 0;max-width: 1200px;margin: 0 auto ;overflow: hidden;}
#sdg_slider {overflow: hidden;margin-left: -45px;}
#sdg_slider img{display: block;font-size: 0;margin-bottom: 20px;max-width: 100%;}
#sdg_slider .swiper-slide{margin-left: 45px;width: calc(100%/3 - 45px) !important;}
.swiper_nav{height: 0;text-align: center;padding-top: 0;position: absolute;top: calc(50% - 70px);right: -70px;left: -70px;}
.swiper_nav .swiper-button-next,
.swiper_nav .swiper-button-prev {background:rgba(0,0,0,.12);width: 50px;height: 50px;text-indent: -999em;font-size: 0;transition:background-color .25s ease-out !important;top: 50%;margin-top: -25px;bottom: auto;border-radius:50% ;display: block;}
.swiper_nav .swiper-button-next{right: 0;}
.swiper_nav .swiper-button-prev {left:  0;}

.swiper_nav .swiper-button-next::after,.swiper_nav .swiper-button-prev::after {display: none;}
.swiper_nav .swiper-button-next::before,.swiper_nav .swiper-button-prev::before {content:'';display:block;position:absolute;border-style:solid;border-color:#fff;border-width:3px 0 0 3px;padding:5px;transform:rotate(-45deg);top:50%;left:50%;margin-top: -7px;margin-left: -5px;transition:all .25s ease-out;opacity:.95;right: auto;}
.swiper_nav .swiper-button-next::before{border-width:0 3px 3px 0;margin-left: -8px;}
.swiper_nav .swiper-button-next:hover,.swiper_nav .swiper-button-prev:hover {background:#111;}
.swiper_nav .swiper-button-next:hover::before, .swiper_nav .swiper-button-prev:hover::before{opacity: 1;border-color: #fff;}
.sdgReport {padding-bottom: 110px;}
.sdgReport .flt{width: 410px;}
.sdgReport .frt{width: 380px;padding-top: 110px;}

.sdgReport .proTit3{font-size: 22px;padding-top: 80px;}
.sdgReport .btns{overflow: hidden;padding-top: 15px;}
.sdgReport .btns a{display: block;float: left;font-family: 'Gmarket Sans';font-weight: 700;letter-spacing: -1px;font-size: 22px;border: 1px solid #bbb;height: 60px;line-height: 62px;width: 188px;box-sizing: border-box;position: relative;margin-left: 10px;padding-left: 21px;}
.sdgReport .btns a::after{display: block;content: '\e2c4';position: absolute;right: 18px;font-size: 37px;top: 10px;font-family: 'Material Symbols Outlined';font-weight: 400;line-height: 1;}
.sdgReport .btns a:first-child{margin-left: 0;}
.sdgReport .btns a.on{color: #fff;background-color: #884dff;border: none;}
.book {position: relative;width: 332px;height: 469px;background-color: #fff;}
.book img{max-width: 100%;margin: 0 auto;}
.book:before {position: absolute; z-index: -1;  content: "";  width: inherit;  height: inherit; background: rgba(0,0,0, .25);
 transform:  scale(95%,95%) rotate(1deg) translateX(21px) translateY(24px) skewX(0deg) skewY(9deg);will-change: transform;backface-visibility: hidden;filter: blur(14px)}

@media screen and (max-width:1200px) {
.slideArea{padding-bottom: 60px;}
#sdg_slider {margin-left: -3.61%;}
#sdg_slider .swiper-slide{margin-left: 3.61%;width: 29.71% !important;}
.sdgSwiper{padding-bottom: 60px;}
.swiper_nav{position: relative;top:auto;right: auto;left: auto;display: block;width: 110px;margin: 0 auto;}
 }
@media screen and (max-width:1024px) {
.sdgLogo::before{background-size: 73% auto}
.sdgBall{margin-left: -40px;}
.sdgBall li{width: calc(100%/4 - 40px);padding-top: calc(100%/4 - 40px);margin-left: 40px;}
.sdgBall li::after{width: 40px;left: -40px;font-size: 40px;margin-top: -20px;}
.sdgBall p{font-size: 23px;}
.proTit.fz_lzr{font-size: 30px;}
.sdgReport .frt{padding-top: 80px;}
}
@media screen and (max-width:850px) {
#sdg_slider {margin-left: -5%;}
#sdg_slider .swiper-slide{margin-left: 5%;width: 45% !important;}

.sdgReport .proTit3{font-size: 16px;padding-top: 20px;}
.sdgReport .btns{padding-top: 0;}
.sdgReport .flt{width: auto;float: none;}
.sdgReport .frt{width: auto;padding-top: 50px;float: none;}
}
@media screen and (max-width:580px) {
.sdgHalf{padding-bottom: 50px;}
.sdgHalf.pt20{padding-top: 0;}
.sdgHalf .blank{height: 0;}
.sdgHalf .flt,.sdgHalf .frt{width: auto;float: none;margin-bottom: 15px;}

.sdgBall{margin-left: -70px;display: block;overflow: hidden;}
.sdgBall li{width: calc(100%/2 - 70px);margin-left: 70px;padding-top: calc(100%/2 - 70px);float: left;margin-bottom: 40px;}
.sdgBall li::after{width: 70px;left: -70px;}
.sdgBall li:nth-child(3)::after{left: 50%;margin-left: -35px;top: -35px;margin-top: 0;}

}

@media screen and (max-width:450px) {
.sdgBall{margin-left: -40px;display: block;overflow: hidden;}
.sdgBall li{width: calc(100%/2 - 40px);margin-left: 40px;padding-top: calc(100%/2 - 40px);float: left;margin-bottom: 40px;}
.sdgBall li::after{width: 40px;left: -40px;}
.sdgBall li:nth-child(3)::after{margin-left: -20px;}
#sdg_slider {margin-left: 0;}
#sdg_slider .swiper-slide{margin-left: 5%;margin-right: 5%;width: 90% !important;}

.sdgReport .btns a{float: none;margin: 0 0 5px 0 ;float: none;width: auto;}
.book {width: auto;height: auto;border: 1px solid #bbb;margin: 0 auto;}
.book:before {display: none;}
.sdgReport .frt{padding-top: 0px;}
}
.opentype .sdgHalf{padding-bottom: 0;}
.opentype .sdgHalf > div{position: relative;}
.opentype .sdgHalf > div > p{position: absolute;bottom: 20px;left: 20px;color: #fff;font-size: 20px;}
.openi{margin-bottom: 30px;display: flex;align-items: center;}
.opentype .openi:last-of-type{margin-bottom: 0;}
.openi dl{margin-left: 40px;}
.openi dt{font-weight: bold;font-size: 24px;margin-bottom: 10px;}
.openi dd p{position: relative;padding-left: 7px;line-height: 1.2;margin-bottom: 5px;font-size: 20px;}
.openi dd p::before{display: block;content: '';width: 3px;height: 3px;top: 10px;left: 0;position: absolute;background-color: #111;border-radius:50% ;}
@media screen and (max-width:820px) {
.pageContent .opentype p.desc br{display: none;}
.openi {align-items: stretch;}
.openi dl{margin-left: 30px;}
.openi dt{font-size: 20px;}
.openi dd p{font-size: 18px;}
}
@media screen and (max-width:520px) {
.openi .i{width: 50%;}
.openi dl{margin-left: 20px;}
.openi dt{font-size: 18px;}
.openi dd p{font-size: 16px;}
}