@charset "utf-8";

.greeting {display:flex; gap:0 65px;}
.greeting .col-l {width:40%;}
.greeting .col-r {flex:1;}
.greeting .col-r .top {margin-bottom:35px;}
.greeting .col-r .top p {font-size:var(--font-size-28); line-height:1.43em; font-weight:600; color:#2c2c2c; letter-spacing:-.03em;}
.greeting .col-r .top p span {color: var(--color-primary);}
.greeting .col-r .mid p {font-size: var(--font-size-18); margin-bottom:25px; line-height:1.8em;}
.greeting .col-r .mid p:last-child {margin-bottom:0;}
.greeting .col-r .bot {margin-top:60px;}
.greeting .col-r .bot p {font-size:var(--font-size-18); color:#242424; font-weight:500; letter-spacing:-.03em;}
.greeting .col-r .bot p img {margin:-15px 0 0 35px; vertical-align:middle;}

.vision-img {text-align: center;}

.history-top h2 {font-size: var(--font-size-50); letter-spacing: -.01em; line-height: 1.2em; color: var(--color-primary);}
.history-top p {margin: 15px 0 45px; font-size: var(--font-size-24); font-weight: 600; letter-spacing: -.01em; line-height: 1.2em; color: #242424;}
.history .wrap {display: flex;}
.history .since {border-bottom: 1px solid #ddd; padding: 40px; display: flex; align-items: center; justify-content: center; width: 21%; margin-right: 38px; text-align: center;}
.history .since p {font-size: var(--font-size-24); font-weight: 700; letter-spacing: -.01em; line-height: 1.2em; color: #242424;}
.history .since p span {font-size: var(--font-size-20);}
.history .list {padding: 40px; flex:1 1 auto; min-width:0; width:1%; border-bottom: 1px solid #ddd;}
.history .list .group {position: relative; padding-left: 20px;  display: flex;}
.history .list .group::before {content: ''; position: absolute; left: 0; top: 17px; width: 5px; height: 5px; border-radius: 100%; background-color: var(--color-primary);}
.history .list .year {margin-right: 10px; font-size: var(--font-size-18); font-weight: 600; letter-spacing: -.01em; line-height: 2.22em; color: #242424;}
.history .list ul li {font-size: var(--font-size-18); letter-spacing: -.01em; line-height: 2.22em;}
.history .etc {font-size: var(--font-size-18); letter-spacing: -.01em; line-height: 2.22em; color: var(--color-primary);}
.history .wrap:first-child .since {border-top: 2px solid #242424;}
.history .wrap:first-child .list {border-top: 2px solid #242424;}
.org-img {text-align: center;}


.root_daum_roughmap .cont,
.root_daum_roughmap .wrap_controllers,
.root_daum_roughmap .border1,
.root_daum_roughmap .border2,
.root_daum_roughmap .border3,
.root_daum_roughmap .border4 {display: none;}
.direct ul {display:flex; border:1px solid #ddd; border-top: 0;}
.direct ul li {position:relative; overflow:hidden; display:flex; align-items:center; justify-content: center; width:33.33%; padding:0 50px; height:200px; border-left:1px dashed #ddd;}
.direct ul li:first-child {border:0;}
.direct ul li .box {text-align: center;}
.direct ul li .box .tt {margin-top: 20px; font-size:var(--font-size-16); letter-spacing:-.03em; line-height:1.2em; font-weight:600; color:var(--color-primary);}
.direct ul li .box .tt2 {margin-top:15px; font-size:var(--font-size-20); letter-spacing:-.03em; line-height:1.2em; font-weight:600;}

.product ul {display: flex; flex-wrap: wrap; margin: -15px;}
.product li {padding: 15px;}

.ess li,
.distribution li {width: 50%;}
.electric li:nth-child(-n + 3) {width: 33.33%;}
.electric li:nth-child(n + 4) {width: 50%;}
.etc li {width: 33.33%;}

.esg-top h2 {margin: 60px 0 20px; font-size: var(--font-size-32); font-weight: 500; letter-spacing: -.03em; line-height: 1.2em; color: #000;}
.esg-top h2 span {font-weight: 700; color: var(--color-primary);}
.esg-top p {margin-bottom: 35px; font-size: var(--font-size-20); font-weight: 500; letter-spacing: -.03em; line-height: 1.6em; color: #000;}

.esg ol {border-top: 2px solid #242424;}
.esg ol li {display: flex; align-items: center; padding: 40px 0; border-bottom: 1px dashed #ddd;}
.esg ol .num {margin-right: 30px; display: inline-flex; align-items: center; justify-content: center; width: 60px; height: 60px; font-size: var(--font-size-24); font-weight: 700; letter-spacing: -.03em; color: #fff; border-radius: 100%; background-color: var(--color-primary);}
.esg ol .tt {font-size: var(--font-size-24); font-weight: 600; letter-spacing: -.03em; color: #242424; line-height: 1.2em;}
.esg .btn-wrap ul {margin:60px 0 0 0; display: flex; justify-content: center;}
.esg .btn-wrap li {padding: 0 15px;}
.esg .btn-wrap a {display: inline-flex; align-items: center; justify-content: center; min-width:260px; height: 70px; font-size: var(--font-size-20); font-weight: 600; letter-spacing: -.03em; border-radius: 8px; color: #fff; }
.esg .btn-wrap a span {margin-left: 20px;}
.esg .btn-wrap .btn01 a {background-color: var(--color-primary);}
.esg .btn-wrap .btn02 a {background-color: #898989;}
.esg .btn-wrap .btn03 a {background-color: #505050;}

.anonymity-top {text-align: center;}
.anonymity-top h2 {font-size: var(--font-size-28); font-weight: 500; letter-spacing: -.03em; line-height: 1.2em; color: #000;}
.anonymity-top h2 span {font-weight: 700; color: var(--color-primary);}
.anonymity-top p {padding-top: 45px; margin-top: 25px; position: relative; font-size: var(--font-size-20); font-weight: 500; letter-spacing: -.03em; line-height: 1.6em;}
.anonymity-top p::before {content: ''; position: absolute; left: 50%; transform: translateX(-50%); top: 0; width: 18px; height: 18px; background-image: url(/images/sub/biz-ico4.png); background-repeat: no-repeat; background-size: contain;}

.anonymity {margin: 60px 0 100px;}
.anonymity .items {display: flex;}
.anonymity .item {width: 50%; text-align: center; padding: 0 20px;}
.anonymity .item h3 {margin: 35px 0 25px; padding-bottom: 30px; position: relative; font-size: var(--font-size-24); font-weight: 600; letter-spacing: -.03em; line-height: 1.2em; color: #242424;}
.anonymity .item h3::before {content: ''; position: absolute; left: 50%; transform: translateX(-50%); bottom: 0; width: 60px; height: 3px; background-color: var(--color-primary);}
.anonymity .item p {font-size: var(--font-size-18); letter-spacing: -.03em; line-height: 1.67em;}
.anonymity .item .etc {color: var(--color-primary);}

.anonymity-btm {background-color: #f8f8f8; padding: clamp(50px, calc( 65 / var(--inner) * 100vw ), 65px) 0 clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px); display: none;}
.anonymity-btm .form-agree h3 {position: relative; padding-left: 30px;}
.anonymity-btm .form-agree h3::before {content: ''; position: absolute; width: 21px; height: 21px; background-image: url(/images/sub/doc-ico.png); left: 0; top: 50%; transform: translateY(-50%); background-repeat: no-repeat; background-size: contain;}
.anonymity-btm .form-agree .scroll-box {background: #fff; padding: 20px; border-radius: 8px; line-height: 1.63em; color: #454545;}
.anonymity-btm .form-agree .check {text-align: left;}
.anonymity-btm .board-form dl {margin-bottom: 45px;}
.anonymity-btm .board-form dt {margin-bottom: 15px; font-size: var(--font-size-18); font-weight: 600; letter-spacing: 0; line-height: 1.2em; color: #242424;}
.anonymity-btm .board-form dt span {color: var(--color-primary);}
.anonymity-btm .board-form dd p {font-size: var(--font-size-16); letter-spacing: 0; line-height: 1.2em; color: var(--color-primary);}
.anonymity-btm .board-form dd .tt {margin-top: 15px;}
.anonymity-btm .board-form .wrap01 dd {display: flex; align-items: center;}
.anonymity-btm .board-form .input {border-radius: 4px; height: 55px;}

.anonymity-btm .w50 {display: flex; margin: 0 -30px;}
.anonymity-btm .w50 dl {width: 50%; padding: 0 30px;}
.anonymity-btm .board-form .wrap01 dd .check {margin-left: 20px;}
.anonymity-btm .btn {min-width: 200px; height: 70px; border-radius: 8px; padding: 0 30px; line-height: 68px; font-size: var(--font-size-22); font-weight: 600;}
.anonymity-btm .btn.cancel {border: 1px solid #686868; color: #686868;}

.certi ul {display: flex; flex-wrap: wrap; margin:0 -14px -80px;}
.certi li {width: 25%; padding: 0 14px; margin-bottom: 80px; text-align: center;}
.certi .img img {width: 100%; height: 100%;}
.certi p {margin-top: 30px; display: inline-flex; align-items: center; justify-content: center; padding: 0 17px; min-width: 210px; height: 34px; font-size: var(--font-size-20); font-weight: 500; letter-spacing: -.03em; line-height: 1.2em; color: #fff; border-radius: 17px; background-color: var(--color-primary);}
.patent ul {margin: 0; justify-content: center;}
.premier ul {margin:-20px -30px; justify-content: center;}
.patent li {width: auto; margin: 0;}
.premier li {width: auto;padding: 20px 30px; margin: 0;}