:root {
    --gutter: 8.3333vw;
    --column-width: calc(100% - (var(--gutter) * 2));
    --font8: 2.2222vw;
    --font9: 2.5vw;
    --font10: 2.7777vw;
    --font12: 3.3333vw;
    --font14: 3.8888vw;
    --font15: 4.1666vw;
    --font16: 4.4444vw;
    --font18: 5vw;
    --font20: 5.5555vw;
    --font24: 6.6666vw;
    --font30: 8.3333vw;
    --font36: 10vw;
    --font40: 11.1111vw;
    --font72: 6.6666vw;
    --font80: 11.1111vw;
    --gap15: 4.1666vw;
    --gap20: 5.5555vw;
    --gap40: 11.1111vw;
    --gap60: 16.6666vw;
    --gap100: 27.7777vw;
    --gap120: 33.3333vw;
}
*{margin: 0; padding: 0;}
.esg-page a{color: #808080; text-decoration: none;}
#esg-hero{width:60%; position: absolute; right: 0; top: 0;}
.esg-aside{position: fixed; bottom: 40px; left: calc(((100% - (20px * (12 - 1))) / 12) + 20px); display: block; flex-direction: column; z-index: 8;}
.esg-tab{position: relative; z-index: 9;}
.esg-nav{position: absolute; bottom: calc(45vh - 90px); min-width: 180px;}
.esg-nav li{position: relative; margin-left: 17px; display: flex; align-items: center; overflow: hidden;}
.esg-nav .nav-dot{display: block; left: 0px; width: 5px;height: 5px; border-radius: 100%; background-color: #d1064a; position: absolute; transition: all 0.3s ease; top:8px; opacity: 0;  transform: translateY(20px);}
.esg-nav li.on a, .esg-nav li:hover a{color: #d1064a;}
.esg-nav li.on::before{display: block;}
.esg-nav li:not(li:last-child){margin-bottom: 20px;}
.esg-nav li a{display: inline-block; transform: translateY(120%); transition: transform 0.5s ease-out, opacity 0.5s ease-out; opacity: 0;}
.esg-nav.show li a{transform: translateY(0); opacity: 1;}
.esg-nav li:nth-child(1) a{transition: transform 0.3s ease-out, opacity 0.3s ease-out;}
.esg-nav li:nth-child(2) a{transition: transform 0.4s ease-out, opacity 0.4s ease-out;}
.esg-nav li:nth-child(3) a{transition: transform 0.5s ease-out, opacity 0.5s ease-out;}
.esg-nav li:nth-child(4) a{transition: transform 0.6s ease-out, opacity 0.6s ease-out;}
.esg-nav li:nth-child(5) a{transition: transform 0.7s ease-out, opacity 0.7s ease-out;}
.esg-nav.show .nav-dot{opacity: 1; transform: translateY(0px);}

.esg-url{transition:opacity 0.5s ease-out; opacity: 0;}
.esg-url.show{opacity: 1;}
.esg-url a{width: 60px; height: 60px; background-color: #fff; border: 1px solid #cdcdcd; border-radius: 100%; font-size: 48px; color: #1b1b1b; display: flex; align-items: center; justify-content: center; margin-bottom: 12px; box-sizing: border-box;}
.esg-url li{position: relative; cursor: pointer;}
.esg-url li a{transition: ease 0.2s color;}
.esg-url li img{transition: ease 0.2s opacity;  position: absolute; width: 100%; height: 100%; left: 0; top: 0;}
.esg-url li img.hover{opacity: 0; z-index: 1;}
.esg-url li.on a{border: 0; background-size: 100% 100%; color:#fff;}
.esg-url li.on img{opacity: 1;}
.esg-url li:last-child a{margin-bottom: 0;}
.esg-url li:hover a{color: #fff;}
.esg-url li:hover img{opacity: 1;}

.esg-cont {position: relative; padding-left: calc(((100% - (20px * 9)) / 10) * 3 + (20px * 3));color: #808080;}
.esg-cont{font-size: 15px;}
.esg-img-cont{width: 100%; margin-bottom:40px;}
.esg-img-cont img{width: 100%; display: block;}

.esg-detail-view{font-size: 1.5vw; color: #fff; margin-top: 400px;}
.esg-detail-view ul{display: flex;}
.esg-detail-view li{width: 100%; margin-right: 20px; position: relative; width: calc((100% - 40px) / 3); display: flex; align-items: center; overflow: hidden; border-radius: 5px;}
.esg-detail-view li:last-child{margin-right: 0;}
.esg-detail-view strong{font-size: 3vw;}
.esg-detail-view li a{width: 100%; height: 100%; position: relative; left: 0; top: 0; display: flex; align-items: center;}
.esg-detail-view span{color: #fff; line-height: 1.1; box-sizing: border-box; display: block; padding-left: 1.8vw; position: absolute;}
.esg-detail-view li img{display: block; width: 100%; transform: scale(1); transition: transform 0.5s ease;}
.esg-detail-view li:hover img{transform: scale(1.2);}

.esg-dataroom-cont{display:flex; flex-direction: column; opacity:1;}
.esg-dataroom-cont .box{flex:1; position:relative; padding:60px 50px; transition:all 0.5s ease; overflow:hidden;}
.esg-dataroom-cont .tit_box{position:relative; font-size:34px; font-family: 'calibre'; font-weight:600; line-height:1; transition:opacity 0.5s ease;}
.esg-dataroom-cont .tit_box:before{content:""; display:block; position:absolute; top:-10px; left:0; width:25px; height:2px; background:#d2074a;}
.esg-dataroom-cont .txt_box{margin-top:15px; font-size:13px; color:#808080;}

.esg-dataroom-cont .download-catalogue{display:none; margin-top:120px;}
.esg-dataroom-cont .download-catalogue li{width:61px; opacity:0;}
.esg-dataroom-cont .download-catalogue li a{display:block; position:relative;}
.esg-dataroom-cont .download-catalogue li svg{width:100%;}
.esg-dataroom-cont .download-catalogue li+li{margin-left:50px;}
.esg-dataroom-cont .download-catalogue .c-name{display:block; position:absolute; bottom:-2em; left:50%; text-align: center; color:#2f3139; font-weight:700; transform:translateX(-50%)}

.esg-dataroom-cont .dataroom01{background:url(/asset/img/bg-dataroom02.png) no-repeat bottom right;}
.esg-dataroom-cont .dataroom02{display:flex; flex-direction: column; align-items: flex-start; text-align:right;}
.esg-dataroom-cont .dataroom02 .tit_box{font-family: 'nanumSquare'; font-size:24px; font-weight:400;}
.esg-dataroom-cont .dataroom02 .tit_box:before{top:-20px; left:initial; right:0;}

.esg-dataroom-cont .download-report{display:none; margin-top:0; text-align:right;}
.esg-dataroom-cont .download-report li{display:inline-block;}
.esg-dataroom-cont .download-report .thumb{display:block; position:relative; width:100%; border-radius:10px; box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.1); transition:transform 0.3s ease; overflow:hidden;}
.esg-dataroom-cont .download-report .thumb:before{content:""; display:block; width:100%; height:0; padding-bottom:125%;}
.esg-dataroom-cont .download-report .thumb img{position:absolute; top:0; left:0; width:100%; height:100%;}
.esg-dataroom-cont .download-report .c-name{position:absolute; bottom:-40px; left:50%; font-size:11px; font-family: 'calibre'; font-weight:600; color:#1b1b1b; white-space: nowrap; transform:translateX(-50%); line-height: 1.2;}
.esg-dataroom-cont .download-report li:hover .thumb{transform:scale(1.1);}

/* @media screen and (max-width:1320px){
  .esg-dataroom-cont .download-report{width:100%;}
  .esg-dataroom-cont .download-report li{width:calc((100% - 210px) / 3);}
  .esg-dataroom-cont .download-report .thumb{width:100%;}
} */

/* svg animation */
.esg-dataroom-cont .download-catalogue li a .outline,
.esg-dataroom-cont .download-catalogue li a .book,
.esg-dataroom-cont .download-catalogue li a .innerline{transition:all 0.3s ease;}
.esg-dataroom-cont .download-catalogue li a:hover .book{transform:translate(-9px, 7px);}
.esg-dataroom-cont .download-catalogue li a:hover .outline{stroke-dashoffset: 0;}
.esg-dataroom-cont .download-catalogue li a:hover .innerline{opacity:1;}
.esg-dataroom-cont .download-catalogue.ie li a .book{transform:translate(-9px, 7px) !important;}
.esg-dataroom-cont .download-catalogue.ie li a .outline{stroke-dashoffset: 0 !important;}
.esg-dataroom-cont .download-catalogue.ie li a .innerline{opacity:1 !important;}

/* click event */
.esg-dataroom-cont .box.opened{flex:3;}
.esg-dataroom-cont .box.opened .download-catalogue{display:flex;}
.esg-dataroom-cont .box.opened .download-report{display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; width: 100%; grid-gap: 80px 40px; max-width: 700px;}
.esg-dataroom-cont .box.closed{background-color:#d2074a;}
.esg-dataroom-cont .box.closed .tit_box:before{background:#1b1b1b;}
.esg-dataroom-cont .dataroom01.closed{background-image:url(/asset/img/bg-dataroom02_close.png);}
.esg-dataroom-cont .dataroom02.closed{background-image:url(/asset/img/bg-dataroom03_close.png);}
.esg-dataroom-cont .box.closed .txt_box{opacity:0;}
@media (max-width:1024px) {
    .mob_hide{display: none!important;}
    .esg-dataroom-cont .box.opened .download-report{grid-gap: 10vw; padding: 0; min-height: 80vw; grid-template-columns: 1fr 1fr;}
    .esg-page a{display: flex; flex-direction: column; align-items: center;}
    .esg-dataroom-cont .box{padding: 4vw;}
    .esg-dataroom-cont .download-report .c-name{padding-top: 3vw; position: relative; bottom: unset; left: 0; font-size: 3.333vw; transform: translateX(-0%);}
}

.esg-btn-section{
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
    grid-gap: 20px;
    position: relative;
}
.esg-btn-section div{
    display: flex;
    position: relative;
    align-items: center;
}
.esg-btn-section img{
    position:relative;
    display: block;
    width: 100%;
    filter: opacity(0.5) grayscale(1);
    transition: filter ease 0.3s;
}
.esg-btn-section .on img, .esg-btn-section div:hover img{filter: opacity(1) grayscale(0)!important;}
.esg-btn-section a{
    left: 0;
    position: absolute;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: left;
    padding-left: 40px;
    box-sizing: border-box;
    color: #fff;
    font-size: 24px;
    line-height: 1;
}
.esg-btn-section a strong{font-size: 36px;}
.esg-tab-list{display: flex; width: 100%; margin: 40px 0 160px; z-index: 9;}
.esg-tab-list li{font-size: 18px; color: #1b1b1b; text-align: center; border: 1px solid #808080; display: block; width: 100%; border-right: 0; cursor: pointer; display: flex; justify-content: center; align-items: center; transition: ease 0.3s color, ease 0.3s background-color;}
.esg-tab-list li a{width: 100%; box-sizing: border-box; height: 64px; display: flex; justify-content: center; align-items: center; line-height: 1.3;}

.esg-tab-list li:last-child{border-right: 1px solid #808080;}
.esg-tab-list li:hover a{color:#fff;}
.esg-tab-list li:hover{background-color: #d1064a; color: #fff;}

.esg-article{font-size: 15px;}
.esg-article + .esg-article{ margin-top: 120px;}
.esg-title{font-size: 18px; color: #d1064a; margin-bottom: 40px;}
.esg-title-1{font-size: 18px; color:#d1064a; padding-bottom: 8px; border-bottom: 1px solid #d1064a; width: 100%; display: block; margin-bottom: 40px;}
.esg-title-2{font-size: 15px; color:#1b1b1b; margin-bottom: 12px;}
.esg-desc-1{display: block; margin-bottom: 40px; color: #808080; line-height: 1.73;}
.esg-desc-2{display: block; margin-bottom: 20px; color: #808080; line-height: 1.73;}
.esg-desc-3{color: #1b1b1b; font-size: 12px;}

@media (max-width:1024px){
    .anchor + .anchor{margin-top: 30vw;}
    .esg-url{display: none;}
    .esg-article{font-size: var(--font10);}
    .esg-cont{padding: 0;}
    .esg-detail-view .title{font-size: 21px; color: #d1064a; margin-bottom: 32px; position: relative; left: 0; top: 0;}
    .esg-detail-view{font-size: 4.5vw;}
    .esg-detail-view strong{font-size: 8vw;}
    .esg-detail-view ul{flex-direction: column;}
    .esg-detail-view ul li{width: 50%; margin-bottom: 4.444vw; margin-right: 0;}
    .esg-detail-view span{padding-left: 5vw;}
    .esg-btn-section{display: none;}
    .esg-tab-list{overflow-x: scroll; width: unset; max-width: 100%; left: 0; top: 13.8888vw; position: fixed; white-space: nowrap; box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.06); background-color: #fff; margin: 0; display: none;}
    .esg-aside{z-index: 8; width: 100%; max-width: unset; min-width: 100%; left: 0; top: 13.8888vw; position: fixed; white-space: nowrap; box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.06); background-color: #fff; margin: 0; bottom: unset; display: block; padding-left: 0;}
    .esg-nav{width: unset; max-width: unset; min-width: 100%; left: 0; /* top: 13.8888vw; */ position: relative; white-space: nowrap; margin: 0; bottom: unset; display: none; padding-left: 0; overflow-y: hidden;}
    .esg-nav::-webkit-scrollbar{display: none;}
    .esg-nav.show{display: flex;}
    .esg-nav li{padding: 10px 20px; margin: 0 !important;; overflow: unset; font-size: var(--font14);}
    .esg-nav .nav-dot{display: none;}
    .esg-nav li a{transform: translateY(0)!important; opacity: 1!important;}
    .esg-tab-list li{border: 0!important; padding: 10px 20px; width: unset;}
    .esg-tab-list li br{display: none;}
    .esg-tab-list li:hover{ background-color: #fff;}
    .esg-tab-list li:hover a{color: #d1064a; font-weight: bold;}
    .esg-tab-list li.on a{color: #d1064a; font-weight: bold;}
}

.esg-sec1 ,.esg-sec2 ,.esg-sec3 ,.esg-sec4{
    /*min-height: 1000px;
    border: 10px solid;*/
    box-sizing: border-box;
}
.esg-flex-box.esg-list ul li{text-align: left; position: relative; list-style: none;}
.esg-flex-box.esg-list ul li::before{content: '';display: block; width: 4px; height: 4px; position: absolute; left: -10px; top: 8px; border-radius: 100%; background-color: #1b1b1b;}
.esg-flex-box.esg-list > li{justify-content: flex-start; padding: 16px 16px 16px 28px;}
.esg-flex-box.esg-list ul li + li{margin-top: 6px;}
.esg-page .tbl-data thead th{color:#1b1b1b;}
@media (min-width:1025px){
.anchor + .anchor{margin-top: 200px;}
.esg-cont .about-sec-tit {position: absolute; top: 0; left: 0; z-index: -1;}
.esg-cont .about-sec-tit.show{z-index:0;}
.esg-cont .about-sec-tit span {display: block; position: fixed; top: 100px; font-size: 48px; color: #d2074a; font-family: 'calibre'; line-height: 1.2;}
.esg-cont .about-sec-tit.show span { /*background: rgba(250,250,250,.8); box-shadow: 0 0 10px 20px rgba(250,250,250,1);*/}
.esg-cont .about-sec-tit span strong { display: block; margin-top: -10px; padding-bottom: 00px;overflow: hidden; font-weight: 300;}
.esg-cont .about-sec-tit span i { display: inline-block; transform: translateY(120%); font-style: unset; line-height: 1;}
.esg-cont .about-sec-tit.show i { transform: translateY(0%); transition: transform 0.5s ease-out, opacity 0.5s ease-out; opacity: 1;}
}
@media (max-width:1024px){
    .esg-cont .about-sec-tit i{font-size:4.444vw; color: #d2074a; margin-bottom: 20px; font-style: unset; display: inline-block;}
    .esg-title-1{margin-bottom: 6.666vw; font-size: var(--font14);}
    .esg-title-2{margin-bottom: 8px; font-size: var(--font10);}
    .esg-desc-1{margin-bottom: 3.3333vw; font-size: var(--font10);}
    .esg-desc-2{font-size: var(--font10);}
    .esg-desc-3{font-size: var(--font8);}
    .esg-img-cont{margin-bottom: 13.3232vw;}
}
@media (min-width:1025px){
.esg-flex-half{display: flex; align-items: center;}
.esg-flex-half > *{width: calc(50% - 20px); margin-bottom: 0;}
.esg-flex-half > *.width40{width:40%;}
.esg-flex-half > *:first-child{margin-right: 40px;}
.esg-flex-quarter{display: flex;align-items: center;}
.esg-flex-quarter > *{margin-bottom: 0;}
.esg-flex-quarter > *:first-child{margin-right: 40px;}
.esg-flex-quarter .esg-quarter-type1{width: calc(75% - 40px); display: inline-block;}
.esg-flex-quarter .esg-quarter-type2{display: block; width: 50%;}
.check_icon li{display: flex; color: #1b1b1b;}
.check_icon li::before{content: '✓'; display: inline-block;padding-right: 10px; color: #d2074a; font-weight: bolder;}
.check_icon li + li{margin-top: 10px;}
.esg-social-list li{display: flex;}
.esg-flex-box{display: flex; margin-bottom: 40px;}
.esg-flex-box > *{width: 100%;margin-right: 20px; border: 1px solid #1b1b1b; background-color: #fff; height: unset; display: flex; justify-content: center; align-items: center; font-weight: bold; color: #1b1b1b; text-align: center; padding: 16px;}
.esg-flex-box > *:last-child{margin-right: 0px;}
.esg-flex-box.circle{width: 100%; padding: 0 40px; box-sizing: border-box; margin:0 auto 40px; }
.esg-flex-box.circle > *{margin-right: 40px; border-radius: 100%; position: relative; height: unset; }
.esg-flex-box.circle > *:last-child{margin-right: 0px;}
.esg-flex-box.circle > *::before{content: ''; position: relative; width: 100%; height: 0; padding-top: 100%;}
.esg-flex-box.circle > * span{position: absolute;}
.esg-flex-btn .esg-flex-box li{cursor: pointer; width: 50%; transition: ease 0.3s width;}
.esg-flex-btn .esg-flex-box li.on{width: 100%;}
.esg-flex-btn .esg-flex-list li:not(.on){display: none;}
.esg-flex-btn .esg-flex-list li.on{display: block;}


}
@media (max-width:1024px){
    .esg-flex-btn .esg-flex-box li{cursor: pointer; width: 50%; transition: ease 0.3s width;}
.esg-flex-btn .esg-flex-box li.on{width: 100%;}
.esg-flex-btn .esg-flex-list li:not(.on){display: none;}
.esg-flex-btn .esg-flex-list li.on{display: block;}
    .esg-flex-half{display: block;}
    .esg-flex-half > *{width: 100%;}
    .esg-flex-half > *:first-child{margin-bottom: 3.3333vw;}
    .esg-flex-quarter{display: flex;align-items: center; flex-direction: column;}
    .esg-flex-quarter > *{margin-bottom: 0; width: 100%;}
    .esg-flex-quarter > *:first-child{margin-bottom: 4.444vw; margin-right: 0;}
    .esg-flex-quarter .esg-quarter-type1{width: 100%; display: inline-block;}
    .esg-flex-quarter .esg-quarter-type2{display: block; width: 100%;}
    .check_icon li{display: flex; color: #1b1b1b;}
    .check_icon li::before{content: '✓'; display: inline-block;padding-right: 10px; color: #d2074a; font-weight: bolder;}
    .check_icon li + li{margin-top: 2vw;}
    .esg-social-list li{display: flex;}
    .esg-flex-box{display: flex; margin-bottom: 40px;}
    .esg-flex-box > *{width: 100%;margin-right: 20px; border: 1px solid #1b1b1b; background-color: #fff; height: 80px; display: flex; justify-content: center; align-items: center; font-weight: bold; color: #1b1b1b; text-align: center;}
    .esg-flex-box > *:last-child{margin-right: 0px;}
    .esg-detail-view{margin-top: 40vw;}
    .esg-detail-view li a{display: flex; align-items: flex-start; justify-content: center;}
    .esg-flex-box.circle > *{margin-right: 20px; border-radius: 100%; position: relative; height: unset; }
    .esg-flex-box.circle > *:last-child{margin-right: 0px;}
    .esg-flex-box.circle > *::before{content: ''; position: relative; width: 100%; height: 0; padding-top: 100%;}
    .esg-flex-box.circle > * span{position: absolute;}
    .esg-flex-box.esg-list > li{}
    .esg-flex-box.esg-list ul li{position: relative; list-style: none;}
    .esg-flex-box.esg-list ul li::before{content: '';display: block; width: 4px; height: 4px; position: absolute; left: -2vw; top: 1.4vw; border-radius: 100%; background-color: #1b1b1b;}
}
.tbl-data.type01.esg-table col:nth-of-type(1){width: 12%!important;}
/* .tbl-data ul.type01 li { list-style-type: disc; list-style-position: outside; margin-left: 20px; } */
.tbl-data ul.type01 {
  list-style-position: inside;
  padding: 0;
  margin: 0 auto;
  width: fit-content; 
}

.tbl-data ul.type01 li {
  position: relative;
  padding-left: 1em;
  text-align: left;
}

.tbl-data ul.type01 li::before {
  content: "·";
  position: absolute;
  left: 0;
  top: 0;
  font-size: 1.1em;
  line-height: 1.5;
  color: #808080;
}


.esg-page .page-title-box.fixed{height: unset!important;}
.esg-page .page-title-box.fixed .fixedEle{position: relative!important; top: 0!important;}
.esg-flex-30{display: flex; align-items: flex-start;}
.esg-flex-30 > *:first-child{width: 70%; margin-right: 40px;}
.esg-flex-30 > *:last-child{width: calc(30% - 40px);}
.esg-page a.esg-btn-link{padding: 16px; border-radius: 4px; text-align: right;left: 100%; transform: translateX(-100%); margin-top: 40px; color: #fff; background-color: #d1064a; font-weight: bold; position: relative; display: inline-block;}

@media (min-width:1025px){
    :lang(en) .esg-nav{font-size:16px; min-width:22vw; line-height: 1.3;}
    :lang(en) .esg-nav li{height:25.5px; overflow: unset;}
    :lang(en) .esg-cont .about-sec-tit span{font-size: 2vw;}
    :lang(en) .esg-tab-list li{font-size: 14px;}
    :lang(en) .en_half{width: 60%; margin:auto;}
    :lang(en) .esg-dataroom-cont .download-report .c-name{font-size: 18px; bottom:-56px;}
}
@media (max-width:1024px){
    :lang(en) .esg-title-1{line-height: 1.3;}
    :lang(en) .esg-cont .about-sec-tit strong i{margin-bottom:0;}
    :lang(en) .esg-cont .about-sec-tit strong + strong > i{margin-bottom:20px}
    :lang(en) .esg-cont .about-sec-tit strong, :lang(en) .esg-cont .about-sec-tit strong i{display: block; line-height: 1.3;}
    :lang(en) .esg-flex-box{display: grid; grid-template-columns: 1fr 1fr; margin-bottom: 40px; justify-items: center; grid-gap: 10px;}
    :lang(en) .esg-flex-btn .esg-flex-box li{margin-right: 0; width: 100%; transition: ease all 0.3s; padding: 0 6px;}
    :lang(en) .esg-flex-btn .esg-flex-box li.on{background-color: #d1064a; color: #fff; border-color: #d1064a;}
}
:lang(en) .esg-social-list li span{min-width: 16px;}


/* 정도경영 */
.mng-dl-btn{display: flex; justify-content: flex-end; align-items: center;}
.mng-dl-btn a{display: flex; align-items:center; border: 1px solid #1b1b1b; border-radius: 14px; padding: 8px 10px;}
.mng-dl-btn a:last-child{margin-left: 12px;}
.mng-dl-btn a img{width: 12px; margin-left: 8px;}
.mng-list-wrap{position: relative; margin-top: 20px;}
.mng-list{margin-bottom:12px; background-color: #fff; font-size: 18px; color: #1b1b1b; position: relative; width: 100%; padding: 16px 27px 16px 32px; box-sizing: border-box; display: block;}
.mng-list .mng-list-title{cursor: pointer; display: flex; align-items: center; justify-content: space-between; padding-bottom: 0px;}
.mng-list .mng-list-title img{width: 15px; display: block;}
.mng-list .mng-list-title.active img{transform: rotate(180deg);}
.mng-list .mng-p{margin-top:20px; display:none; overflow: hidden; width: 100%!important; position: relative;  font-size: 15px; line-height: 26px; color: #808080;}
.mng-list .mng-p.active{height: unset;}
.mng-list .mng-p b{color: #1b1b1b; font-weight: 500;}

.mng-grid{display: grid; grid-template-columns: 1fr 1fr; max-width: 1200px;}
.mng-grid li{border-bottom: solid 1px #1b1b1b; list-style: none; position: relative;}
.mng-grid li:nth-child(odd){padding: 32px 46px 32px 0px;}
.mng-grid li:nth-child(even){padding: 32px 0 32px 22px;}
.mng-grid li:nth-child(even)::before{left: 0; content: ''; background-color: #1b1b1b; position: absolute; display: block; width: 0.5px; height: calc(100% - 24px); top: 50%; transform: translateY(-50%);}

.mng-grid li span{font-weight: bold; color: #1b1b1b; font-size: 15px; display: block; margin-bottom: 8px;}
.mng-grid li p{color: #808080; font-size: 15px;}

#canvas-container{width: 60%; height: 50vh;  position: absolute; right: 0; top: 0;}
#canvas-container canvas{width: 100%!important;}
@media(max-width:1024px){
  .mng-grid{display: block;}
  .mng-grid li:nth-child(odd){padding: 16px 0px;}
  .mng-grid li:nth-child(even){padding: 16px 0px;}
  .mng-grid li:nth-child(even)::before{content: none;}
  .mng-grid li:last-child{border-bottom: 0;}

  .mng-list{padding: 16px 20px; font-size: var(--font12);}
  .mng-list .mng-p{ font-size: var(--font10); line-height: 1.8;}
  .mng-dl-btn{margin-bottom: 20px;}
  .mng-dl-btn a{flex-direction: row; padding: 4px 10px;}

  .page-title-box .page-title.mng-title{font-size: 7vw;}
  .mng-grid li p, .mng-grid li span{var(--font10);}
  #canvas-container{width: 200%; height:60vh; transform: scale(.5); top: -5%; right: -50%;}
  .mm-half{margin-top: 60px!important;}
  #esg-hero{width:60%; top:0%;}
}