@charset "utf-8";
@import url('//fonts.googleapis.com/css2?family=Zilla+Slab:wght@300;400;500;700&display=swap');
@font-face {
    font-family: 'Noto Sans';
    font-style: normal;
    font-weight: 100;
    src: local('Noto Sans Thin'), local('NotoSans-Thin'),
    url(NotoSansKR-Thin-Hestia.eot),
    url(NotoSansKR-Thin-Hestia.eot#iefix) format('embedded-opentype'),
    url(NotoSansKR-Thin-Hestia.woff) format('woff'),
    url(NotoSansKR-Thin-Hestia.otf) format('opentype');
}

@font-face {
    font-family: 'Noto Sans';
    font-style: normal;
    font-weight: 300;
    src: local('Noto Sans Light'), local('NotoSans-Light'),
    url(NotoSansKR-Light-Hestia.eot),
    url(NotoSansKR-Light-Hestia.eot#iefix) format('embedded-opentype'),
    url(NotoSansKR-Light-Hestia.woff) format('woff'),
    url(NotoSansKR-Light-Hestia.otf) format('opentype');
}

@font-face {
    font-family: 'Noto Sans';
    font-style: normal;
    font-weight: 400;
    src: local('Noto Sans Regular'), local('NotoSans-Regular'),
    url(NotoSansKR-Regular-Hestia.eot),
    url(NotoSansKR-Regular-Hestia.eot#iefix) format('embedded-opentype'),
    url(NotoSansKR-Regular-Hestia.woff) format('woff'),
    url(NotoSansKR-Regular-Hestia.otf) format('opentype');
}

@font-face {
    font-family: 'Noto Sans Korean';
    font-style: normal;
    font-weight: 500;
    src: local('Noto Sans Medium'), local('NotoSans-Medium'),
    url(../../../gh/theeluwin/NotoSansKR-Hestia-master/fonts/eot/NotoSansKR-Medium-Hestia.eot),
    url(../../../gh/theeluwin/NotoSansKR-Hestia-master/fonts/eot/NotoSansKR-Medium-Hestia.eot#iefix) format('embedded-opentype'),
    url(../../../gh/theeluwin/NotoSansKR-Hestia-master/fonts/woff/NotoSansKR-Medium-Hestia.woff) format('woff'),
    url(../../../gh/theeluwin/NotoSansKR-Hestia-master/fonts/otf/NotoSansKR-Medium-Hestia.otf) format('opentype');
}

@font-face {
    font-family: 'Noto Sans';
    font-style: normal;
    font-weight: 700;
    src: local('Noto Sans Bold'), local('NotoSans-Bold'),
    url(NotoSansKR-Bold-Hestia.eot),
    url(NotoSansKR-Bold-Hestia.eot#iefix) format('embedded-opentype'),
    url(NotoSansKR-Bold-Hestia.woff) format('woff'),
    url(NotoSansKR-Bold-Hestia.otf) format('opentype');
}


/**********************************************************************************************************************************/
/**********************************************************************************************************************************/
/****************************************************    BASE   **********************************************************/
/**********************************************************************************************************************************/
/**********************************************************************************************************************************/


*{-webkit-text-size-adjust:none; margin:0; padding:0; font-family:'Noto Sans', sans-serif, HelveticalNeue-Light,AppleSDGothicNeo; -webkit-tap-highlight-color:rgba(0,0,0,0); }
strong,h1,h2,h3,h4,h5,h6	{ font-family:'Noto Sans',sans-serif; font-weight:700; letter-spacing: -0.05em;  }
html{height:100%;}
html.popOpen {overflow:hidden; }
body{margin:0; padding:0; min-width:1280px; -webkit-text-size-adjust:100%; height:100%; position:relative; font-size:19px; line-height:30px; font-weight:400; color:#666; letter-spacing: -0.025em; }
body.main{min-width:1280px;}


body .en,
body .en *		{font-family: 'Zilla Slab', serif; letter-spacing:0; }
body .kr,
body .kr *		{font-family:'Noto Sans',sans-serif; }


@media screen and (max-width: 691px) {
body		{font-size:14px; }
}

.onlydesktop,
.desktoponly{
    display: none;
}

p,h1,h2,h3,h4,h5,h6,menu,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select,img{margin:0;padding:0;-webkit-text-size-adjust: 100%; vertical-align:top}
table,th,td{vertical-align:middle; text-align:center; }
button,select,input,label {cursor:pointer;font-size:14px; box-sizing: border-box; appearance: none;}
hr, legend, caption {display:none; }

@media screen and (max-width: 691px) {
button,select,input[type=radio],input[type=checkbox],label,textarea {cursor:pointer;font-size:14px; border-radius:0;-webkit-appearance:none}
}

/* ---[ reset html5 element ]---------------- */
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display: block;}

ul,ol {list-style:none;margin:0px;padding:0px;}
em {font-style:normal;}
fieldset,img {border:0 none;  }
/* .hidden {visibility:hidden;width:2px; height:2px; overflow:hidden; position:absolute;left:-1000px;} */ /* 2022-09-01 접근성 */
.hidden{display: block !important; position: absolute !important; overflow: hidden !important; margin: -1px !important; padding: 0 !important; width: 1px !important; height: 1px !important; border: 0 !important; clip: rect(0 0 0 0) !important; clip: rect(0, 0, 0, 0) !important;} /* 2022-09-01 접근성 */
.m_hidden {visibility:hidden; width:2px; height:2px; overflow:hidden; position:absolute;left:-10000px; margin:0 !important; }
.nohidden {visibility:visible !important; width:auto; height:auto; overflow:hidden;   position:relative; left:0;}
.nohidden2 {visibility:visible !important; width:auto; height:auto; overflow:hidden;  position:relative;left:0;}

table {border-collapse:collapse;border-spacing:0; }/*margin-top:10px;*/
table caption {width:0;height:0;font-size:0;line-height:0;overflow:hidden;visibility:hidden;}
table tr td span{white-space: normal;}
table tr td img{vertical-align:middle; }

/* ---[ links ]------------------------------- */
a  { box-sizing:border-box; }
a img {border: none;}
a:link,a:visited {text-decoration: none;color:#666; font-family:inherit}
a:hover {text-decoration:underline;}

button{position:relative;margin:0;padding:0;border:0;background:#fff;cursor:pointer;vertical-align:middle;  box-sizing:border-box;  }

.clear{clear:both;height:0;line-height:0;font-size:0;}
.mob_clear {clear: both;}

/* clear */
.clearfix{*zoom: 1;} /* for IE 6/7 */
.clearfix:after{content:"";display:block;height:0;clear:both;visibility:hidden;}

.hide {  position: absolute;  width: 1px;  height: 1px;  padding: 0;  margin: -1px;  overflow: hidden;  clip: rect(0, 0, 0, 0);  border: 0;}

/*
a	{-webkit-transition: all 300ms linear;-moz-transition: all 300ms linear;-o-transition: all 300ms linear;-ms-transition: all 300ms linear;transition: all 300ms linear;}
select	{-webkit-transition: all 300ms linear;-moz-transition: all 300ms linear;-o-transition: all 300ms linear;-ms-transition: all 300ms linear;transition: all 300ms linear;}
input	{-webkit-transition: all 300ms linear;-moz-transition: all 300ms linear;-o-transition: all 300ms linear;-ms-transition: all 300ms linear;transition: all 300ms linear;}
*/


/**********************************************************************************************************************************/
/**********************************************************************************************************************************/
/****************************************************    COMMON    **********************************************************/
/**********************************************************************************************************************************/
/**********************************************************************************************************************************/

/****************************
**********  color  **********
*****************************/
/* Main color */
.mainGreen {color:#21847c} /* 사이트 내 페이지 메인 포인트 컬러(텍스트, 탭 등) */
.darkGreen {color:#3a6261} /* 사이트 내 페이지 보조컬러(GNB line 등) */

/* Point color */
.pntCol_1 {color:#e22000} /* 사이트 내 강조가 필요한 부분(경고문구 등) */
.pntCol_2 {color:#d2c297} /* 사이트 내 페이지 보조컬러 (인포그래픽 등) */
.pntCol_3  {color:#9a895d} /* 사이트 내 페이지 보조컬러 (ESG 텍스트컬러) */

/* color */
.black	{color:#000} /* 사이트 내의 공통 포인트 컬러 (기본 버튼, 배너 등) */
.brown	{color:#7f6c66} /* 보도자료 태그 */
.green	{color:#537a7c}

/* gray color */
.gray		{color:#999}
.gray_line	{color:#ccc} /* 사이트 내 기본 라인컬러 */
.lightGrey	{color:#eee}
.backGrey	{color:#f6f6f6} /* 사이트 내 기본 BG컬러 */

/* text color */
.txtBlack	{color:#111} /* 사이트 내의 타이틀 이나 강조되는 텍스트에 사용  */
.txtDarkGray{color:#333} /* 사이트 내의 타이틀 이나 강조되는 텍스트에 사용  */
.txtGray	{color:#666} /* 사이트 내 본문 텍스트 컬러  */
.white		{color:#fff} /* 사이트 내 진한 BG 위의 텍스트 컬러  */


/****************************
**********  button  **********
*****************************/
/* MAIN 버튼 */
#container .btnL		{display:inline-block; min-width:270px; padding:0 120px; height:80px; line-height:80px; font-size:20px; background:#111; color:#fff; vertical-align: middle; }
#container .btnL.pnt	{background:#9a895d}
#container .btnL.white	{background:#fff; color:#111; border:2px soliod #111; }

#container .btnL:focus,
#container .btnL:hover{background: #21847c; color: #ffffff; text-decoration: none;}
#container .btnL.white:focus,
#container .btnL.white:hover{border: 2px solid #21847c;}

/* SUB 버튼 */
#container .btnS		{display:inline-block; min-width:70px; padding:0 18px; height:40px; line-height:38px; font-size:15px; background:#fff; color:#111; border:2px solid #000; box-sizing: border-box; }
#container .btnS:focus,
#container .btnS:hover{background: #21847c; border: 2px solid #21847c; color: #ffffff; text-decoration: none;}

/* 라인 */
#container .lineBtn	{display:inline-block; border-bottom:1px solid #000; font-size:15px; padding:0 0 3px; letter-spacing:-0.25;   }
#container .lineBtn:focus,
#container .lineBtn:hover{border-bottom: 1px solid #21847c; color: #21847c;}

/* download 버튼 */
#container .downBtn	{display:inline-block; border:2px solid #000; height:54px; line-height:54px; font-weight:500; padding:0 54px 0 20px; letter-spacing:-0.25; background:url(https://www.ehyundai.com/images/group/ko/ico_btn_down.pnh) no-repeat 0 50%;   }
#container .downBtn:focus,
#container .downBtn:hover{background: #21847c; border: 2px solid #21847c; color: #ffffff; text-decoration: none;}

.formFsrch   {position:relative}
.formFsrch input  {position:absolute; left:0; top:0; opacity:0; }

/****************************
**********  form  **********
*****************************/

input.customInput                  {padding-left:15px; border:0; background:#f7f7f7; }
.customInput label {position:relative;}
.customInput input[type=radio]     {position:absolute;top:50%;width:20px !important;height:20px !important;margin-top:-10px;background-color:transparent !important;}
.customInput input[type=radio] + span  {display:inline-block; padding-left:25px;  background:url(../../../images/group/ko/radio_off.png) no-repeat 0 50% ;}
.customInput input[type=radio]:checked  + span  {background:url(../../../images/group/ko/radio_on.png) no-repeat 0 50% ;}
.customInput input[type=checkbox]:checked  {background:url(../../../images/group/ko/radio_on.png) no-repeat 0 50% ;}
select                {min-width:100px; padding:0 26px 0 15px; background:url(../../../images/group/ko/select_bul.png) no-repeat 100% 50% ; }
select.customSelect                {min-width:100px; padding:0 26px 0 15px; border:0; background:url(../../../images/group/ko/select_bul.png) no-repeat 100% 50% #f7f7f7; }

input[type=text],input[type=password],select    {height:46px;    }
select::-ms-expand { display: none; }


/********************************************************************************************************************** ************/
/**********************************************************************************************************************************/
/****************************************************    MAIN    **********************************************************/
/**********************************************************************************************************************************/
/**********************************************************************************************************************************/

.mainContents{width: 100%; overflow: hidden;}
.mainVisualWrap{overflow: hidden;  position: relative; z-index:1; height: 100vh;  -webkit-transform-style: preserve-3d;  transform-style: preserve-3d;}
.mainVisualWrap .mainVisualList{position: relative; height: 100%;}
.mainVisualWrap .mainVisualList li{position:absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: .5s; text-align: center;}
.mainVisualWrap .mainVisualList li:after{content: ""; display: inline-block; height: 66%; vertical-align: middle;}
.mainVisualWrap .mainVisualList li.on{z-index:1; opacity: 1;}
.mainVisualWrap .mainVisualList li.visual01{background:url(../../../images/group/ko/mainVisual01.jpg) no-repeat center; background-size: cover;}
.mainVisualWrap .mainVisualList li.visual02{background:url(../../../images/group/ko/mainVisual02.jpg) no-repeat center; background-size: cover;}
.mainVisualWrap .mainVisualList li.visual03{background:url(../../../images/group/ko/mainVisual03.jpg) no-repeat center; background-size: cover;}

.mainVisualWrap .mainVisualList li .parallaxTxtWrap{display: inline-block; vertical-align: middle; font-size: 65px; line-height: 80px; font-weight: 500; color: #ffffff;}
.mainVisualWrap .mainVisualList li .parallaxTxtWrap .parallaxTxt{transition: .5s;}
.mainVisualWrap .mainVisualList li .parallaxTxtWrap .parallaxTxt.en + .parallaxTxt{font-weight: 400;}
.mainVisualWrap .mainVisualList li .parallaxTxtWrap .parallaxTxt.line2{transition-delay: .2s;}

.mainVisualControl{position: absolute; left: 50%; bottom: 140px; width: 500px; margin-left: -250px; font-size: 0; z-index: 1;}
.mainVisualControl .mainVisualDot{display: inline-block; overflow: hidden;}
.mainVisualControl .mainVisualDot li{float: left; margin-left: 40px;}
.mainVisualControl .mainVisualDot li:first-child{float: left; margin-left: 0;}
.mainVisualControl .mainVisualDot li a{position: relative; display: block; width: 120px; padding-bottom: 20px; color: #ffffff; font-size: 15px;}
.mainVisualControl .mainVisualDot li a:after{content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: #ffffff; opacity: .3;}
.mainVisualControl .mainVisualDot li a .sProgressBar{position: absolute; left: 0; bottom: 0; width: 0; height: 1px; background: #ffffff; transition: 0s;}
.mainVisualControl .mainVisualBtn{display: inline-block; width: 20px; height: 20px; margin-left: 25px;}
.mainVisualControl .mainVisualBtn.stop{background:url(../../../images/group/ko/mainVisual_stop.png) no-repeat center center;}
.mainVisualControl .mainVisualBtn.start{background:url(../../../images/group/ko/mainVisual_start.png) no-repeat center center;}

.parallaxTxtWrap .parallaxTxt{transition: .3s; transform:translateY(60px); opacity: 0; font-weight: 600; overflow: hidden;}
.scroll_ON .parallaxTxtWrap .parallaxTxt, .on .parallaxTxtWrap .parallaxTxt{transform:translateY(0); opacity: 1;}
.scroll_ON .parallaxTxtWrap .parallaxTxt.line2, .on .parallaxTxtWrap .parallaxTxt.line2{transition-delay: .1s;}
.scroll_ON .parallaxTxtWrap .parallaxTxt.line3, .on .parallaxTxtWrap .parallaxTxt.line3{transition-delay: .2s;}
.scroll_ON .parallaxTxtWrap .parallaxTxt.line4, .on .parallaxTxtWrap .parallaxTxt.line4{transition-delay: .3s;}
.parallaxTxtWrap .parallaxTxt.en{font-size: 70px; line-height: 90px;}

.mainVisualProgress{position: absolute; bottom: 0; left: 0; width: 100%; height: 10px; z-index: 1;}
.mainVisualProgress .progressPer{height: 100%; background: #237c62; transition: 1s;}

.parallaxList{min-width: 1440px;}
.parallaxImg{position: relative; width: 100%; height: 100vh;}
.parallaxImg .parallaxBgWrap{position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; clip: rect(0, auto, auto, 0);}
.parallaxImg .parallaxBgWrap [class^="parallaxImg0"]{position: fixed; top: 0; left: 0; width: 100%; min-width: 1440px; height: 100%; overflow: auto}
.parallaxImg .parallaxImg01{background:url(../../../images/group/ko/main_parallax_img01.jpg) no-repeat center center / cover;}
.parallaxImg .parallaxImg02{background:url(../../../images/group/ko/main_parallax_img02.jpg) no-repeat center center / cover;}
.parallaxImg .parallaxImg03{background:url(../../../images/group/ko/main_parallax_img03.jpg) no-repeat center center / cover;}
.parallaxImg .parallaxImg04{background:url(../../../images/group/ko/main_parallax_img04.jpg) no-repeat center center / cover;}
.parallaxImg .parallaxImg05{background:url(../../../images/group/ko/main_parallax_img05.jpg) no-repeat center center / cover;}
.parallaxImg .parallaxImg06{background:url(../../../images/group/ko/main_parallax_img06.jpg) no-repeat center center / cover;}
.parallaxImg .parallaxImg07{background:url(../../../images/group/ko/main_parallax_img07.jpg) no-repeat center center / cover;}
.parallaxImg .parallaxImg08{background:url(../../../images/group/ko/main_parallax_img08.jpg) no-repeat center center / cover;}
.parallaxImg .parallaxImg09{background:url(../../../images/group/ko/main_parallax_img09.jpg) no-repeat center center / cover;}
.parallaxImg .txt{position: fixed; top: 0; left: 0; width: 100%; min-width: 1440px; height: 100%; zoom: 1; font-size: 130px; line-height: 130px; overflow:auto; text-align: center; font-weight: 700; color: #ffffff;}
.parallaxImg .txt:after{content: ""; display: inline-block; height: 100%; vertical-align: middle;}
.parallaxImg .txt span{display: inline-block; vertical-align: middle; letter-spacing: -0.025em;}
.parallaxImg .txt span.kr{font-size: 42px; line-height: 60px;}
.parallaxImg.normalImg01{overflow: hidden;}
.parallaxImg.normalImg01:before{content: ""; display: block; width: 100%; height: 100%; background:url(../../../images/group/ko/main_normal_img01.jpg) no-repeat center center / cover; transition: .7s;}
.parallaxImg.normalImg01.scroll_ON:before{transform: scale(1.15);}
.parallaxImg.normalImg02{overflow: hidden; width: 100%; height:100vh; background:url(../../../images/group/ko/main_normal_img02_v2.jpg) no-repeat center center / cover; }
.parallaxImg.normalImg02 .noticeArea{max-width:1440px;  margin:10% auto 0; text-align:center;}
.parallaxImg.normalImg02 .noticeTitle{line-height:60px; color:#fff; font-size:80px; font-weight:700;}
.parallaxImg.normalImg02 .noticeCont{margin-top:117px;}
.parallaxImg.normalImg02 .noticeCont li{display:inline-block; width:320px; padding-top:180px; transform: translateY(60px); opacity: 0;transition: .7s;}
.parallaxImg.normalImg02 .noticeCont li + li{margin-left:46px;}
.parallaxImg.normalImg02 .noticeCont li.box1{background:url('../../../images/group/ko/main_notice_img01.jpg') no-repeat top;}
.parallaxImg.normalImg02 .noticeCont li.box2{background:url('../../../images/group/ko/main_notice_img02.jpg') no-repeat top;}
.parallaxImg.normalImg02 .noticeCont li.box3{background:url('../../../images/group/ko/main_notice_img03.jpg') no-repeat top;}
.parallaxImg.normalImg02 .noticeCont li > div{text-align:left;padding:45px 26px 40px 39px;background-color:rgba(255,255,255,0.9);}
.parallaxImg.normalImg02 .noticeCont li dl{color:#111;}
.parallaxImg.normalImg02 .noticeCont li dl dt{line-height:25px; font-size:21px; font-weight:700;}
.parallaxImg.normalImg02 .noticeCont li dl dd{min-height:90px; margin-top:20px; line-height:30px; letter-spacing:-.5px; font-size:17px;}
.parallaxImg.normalImg02 .noticeCont li > div a{display:inline-block; margin-top:39px; padding:4px 28px 5px;vertical-align:top; color:#111; font-size:15px; font-weight:700; border:1px solid #111;}
.parallaxImg.normalImg02 .noticeCont li > div a:hover{color:#fff;border:1px solid #21847c;background-color:#21847c;text-decoration:inherit;}
.parallaxImg.normalImg02.scroll_ON_end .noticeCont li{transform:translateY(60px);opacity:0;}
.parallaxImg.normalImg02.scroll_ON .noticeCont li{transform:translateY(0);opacity:1;}
.parallaxImg.normalImg02.scroll_ON .noticeCont .box2{transition-delay:.2s}
.parallaxImg.normalImg02.scroll_ON .noticeCont .box3{transition-delay:.4s}

.esgKeywordWrap{padding: 223px 0 249px; background: #ffffff; transition: .5s;}
.esgKeywordWrap > dl{width: 1440px; margin: auto; color: #333333; font-weight: 300;}
.esgKeywordWrap > dl:after{content: ""; display: block; clear: both;}
.esgKeywordWrap > dl dt{float: left;}
.esgKeywordWrap > dl dd{float: left;}
.esgKeywordWrap .keywordTit{margin-bottom: 170px;}
.esgKeywordWrap .keywordTit dt{margin-top:-17px; font-size: 80px; line-height: 45px; font-weight: 700;}
.esgKeywordWrap .keywordTit dt > a{display:block;padding:47px 0;color:#111;}
.esgKeywordWrap .keywordTit dt > a:hover{text-decoration:none;cursor: url(../../../images/group/ko/keyword_list_cursor.png), url(https://www.ehyundai.com/images/group/ko/keyword_list_cursor.cur) 64 64, auto;}
.esgKeywordWrap .keywordTit dd{margin-left:184px; font-size: 38px; line-height: 60px;}
.esgKeywordWrap .keywordTit dd .parallaxTxtWrap .parallaxTxt{font-weight: 300;}

.esgKeywordWrap{cursor: url(../../../images/group/ko/keyword_list_cursor.png), url(https://www.ehyundai.com/images/group/ko/keyword_list_cursor.cur) 64 64, auto;}
.esgKeywordWrap .esgKeywordList{width: 1440px; margin: auto;}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn{position: relative; width: 900px; height: 760px; padding-top: 52px; box-sizing: border-box;}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li{margin-top: 20px;}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li:first-child{margin-top: 0;}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li > a{position: relative; display: block; height: 150px; padding-left: 100px; padding-top:30px; font-size: 90px; line-height: 120px; font-weight: 500; color: #999999; font-family: 'Zilla Slab', serif; cursor: url(../../../images/group/ko/keyword_list_cursor.png), url(https://www.ehyundai.com/images/group/ko/keyword_list_cursor.cur) 64 64, auto;}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li > a:hover{text-decoration: none;}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li > a:before{content: ""; position: absolute; left: 0; top: 50%; width: 100px; height: 2px; margin-top: 14px; background: #4d4d4d; transition: .3s; transform: rotate(-45deg);}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li .esgKeywordImg{position: absolute; left: 900px; top: 0; width: 780px; height: 760px; transition: .3s; opacity: 0;}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li .esgKeywordImg:before{content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background:url(../../../images/group/ko/esg_keyword_bg.png) no-repeat 0 0;}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li .esgKeywordImg img{width: 100%; height: 100%;}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li .esgKeywordImg .parallaxTxtWrap{position: absolute; left: 50px; bottom: 65px;}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li .esgKeywordImg .parallaxTxtWrap .parallaxTxt{font-size: 46px; line-height: 56px; color: #ffffff; font-weight: 700;}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li .esgKeywordImg .parallaxTxtWrap .name{margin-top: 25px; font-size: 24px; color: #ffffff; font-weight: 500;}

.esgKeywordWrap .esgKeywordList .esgKeywordBtn li.first .esgKeywordImg{opacity: 1;}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li.first .esgKeywordImg:before{opacity: 0;}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li.first .esgKeywordImg .parallaxTxtWrap{opacity: 0;}

.esgKeywordWrap .esgKeywordList .esgKeywordBtn li.on > a{color: #404040;}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li.on > a:before{transform: rotate(0);}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li.on .esgKeywordImg{z-index: 1; opacity: 1;}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li.on .esgKeywordImg:before{opacity: 1;}
.esgKeywordWrap .esgKeywordList .esgKeywordBtn li.on .esgKeywordImg .parallaxTxtWrap{opacity: 1;}

.spotlightToday{width: 1440px; margin: auto; padding: 210px 0 280px;}
.spotlightToday > h3{text-align: center; font-size: 90px; line-height: 60px; font-weight: 500; color: #333333;}
.spotlightToday .spotlightList{position: relative;width: 1280px; margin: auto;}
.spotlightToday .spotlightList:after{content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 380px; background:url(../../../images/group/ko/spotlight_today_bg.png) repeat-x 0 bottom;}
.spotlightToday .spotlightList li a{position: relative; display: table; table-layout: fixed; width: 100%; padding: 110px 0 65px; border-bottom: 1px solid #cccccc; text-decoration: none;}
.spotlightToday .spotlightList li a:after{content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: 1px; background: #111111; transition: 1.5s;}
.spotlightToday .spotlightList li a:hover:after{width: 100%;}
.spotlightToday .spotlightList li a > span{display: table-cell;}
.spotlightToday .spotlightList li a .img{width: 250px; vertical-align: middle;}
.spotlightToday .spotlightList li a .img img{width:250px;height:150px;object-fit: cover;}
.spotlightToday .spotlightList li a .tit{width: 1030px; padding: 0 35px; font-size: 40px; font-weight: 700; line-height: 55px; color: #111111; box-sizing: border-box;}
.spotlightToday .spotlightList li a .tit .date{display: block; margin-top: 20px; font-size: 19px; font-weight: 500; color: #848484;}
.spotlightToday .spotlightList li a .logo{width: 160px; text-align: center; vertical-align: middle;}
.spotlightToday .spotlightList li a .logo img{max-width: 100%;}

.normalImgWrap .normalImgBox{height: 821px; background:url(../../../images/group/ko/main_normal_img01.jpg) no-repeat center; background-size: cover;}
.normalImgWrap .parallaxTxtWrap{padding: 260px 0; text-align: center; font-size: 65px; line-height: 100px; color: #333333;}

.hStoryWrap{padding: 120px 0 220px; background: #f6f6f6;}
.hStoryWrap .hStoryInner{position: relative; width: 1280px; margin: auto; overflow: hidden;}
.hStoryWrap .hStoryInner > h3{margin-bottom: 20px; color: #111111; letter-spacing: 0.01em; font-family: 'Zilla Slab', serif; font-size: 20px; font-weight: 600;}
.hStoryWrap .hStoryInner .controlBox{position: absolute; /*top: 110px;*/ right: 0; height: 110px; padding-top: 60px; padding-bottom: 10px; box-sizing: border-box; background: #f6f6f6; font-size: 0; z-index: 1;}
.hStoryWrap .hStoryInner .controlBox a{display: inline-block; width: 30px; height: 30px; margin-left: 10px; vertical-align: top;}
.hStoryWrap .hStoryInner .controlBox a.prev{font-size: 0; background: url("../../../images/group/ko/board_paging_prev.png") no-repeat center center;}
.hStoryWrap .hStoryInner .controlBox a.next{font-size: 0; background: url("../../../images/group/ko/board_paging_next.png") no-repeat center center;}
.hStoryWrap .hStoryInner .controlBox .countSlide{display: inline-block; margin-left: 10px; line-height: 30px; font-size: 16px; color: #666666; vertical-align: top;}
.hStoryWrap .hStoryInner .hStoryList{position: relative; width: 6400px; }
.hStoryWrap .hStoryInner .hStoryList li{float: left; width: 1280px;}
.hStoryWrap .hStoryInner .hStoryList li .tit{margin-bottom: 40px; padding-right: 250px;}
.hStoryWrap .hStoryInner .hStoryList li .tit a{height: 100px; font-size: 40px; font-weight: 700; line-height: 50px; color: #001411; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.hStoryWrap .hStoryInner .hStoryList li .tit a:hover,
.hStoryWrap .hStoryInner .hStoryList li .tit a:focus{text-decoration: none;}
.hStoryWrap .hStoryInner .hStoryList li .detail{width: 1280px; height: 720px; text-align: center; overflow: hidden;}
.hStoryWrap .hStoryInner .hStoryList li .detail a{display: block;}
.hStoryWrap .hStoryInner .hStoryList li .detail img{max-width: 100%;}

.mainLinkBtn{text-align: center;}
.mainLinkBtn .more{display: inline-block; padding: 0 45px; border: 2px solid #000000; line-height: 56px; color: #111111;}
.mainLinkBtn .more:focus,
.mainLinkBtn .more:hover{background: #21847c; text-decoration: none; color: #ffffff; border: 2px solid #21847c;}
.mainLinkBtn .more.sns{margin-top: 60px;}

/* 메인 - 그룹소개 */
.scrollTxt{position:absolute;bottom:40px;left:50%;z-index:3;transform:translateX(-50%);color:#fff;font-size:13px;font-weight:700;}
.scrollTxt:before{position:absolute;bottom:0;left:50%;width:12px;height:12px;margin-left:-6px;border-top:1px solid #fff;border-right:1px solid #fff;transform:rotate(135deg);-webkit-animation: arrowDown alternate .6s ease-in infinite;-moz-animation: arrowDown alternate .6s ease-in infinite;-ms-animation: arrowDown alternate .6s ease-in infinite;animation: arrowDown alternate .6s ease-in infinite;content:""}
@-webkit-keyframes arrowDown {
  0% {
    bottom: -5px;
  }
  100% {
    bottom: -16px;
  }
}
@-moz-keyframes arrowDown {
  0% {
    bottom: -5px;
  }
  100% {
    bottom: -16px;
  }
}
@-ms-keyframes arrowDown {
  0% {
    bottom: -5px;
  }
  100% {
    bottom: -16px;
  }
}
@keyframes arrowDown {
  0% {
    bottom: -5px;
  }
  100% {
    bottom: -16px;
  }
}

.groupLinkIco{position:absolute;top:50%;left:50%;z-index:2;display:flex;transform: translateX(-50%);}
.groupLinkIco li + li{margin-left:50px;}
.groupLinkIco li a{display:inline-flex;align-items:center;width:160px;height:160px;text-align:center;color:#fff;background-color:rgba(0,0,0,.6);border-radius:100%;}
.groupLinkIco li a:hover{text-decoration: inherit;}
.groupLinkIco li a span{width:100%;padding-top:55px;font-size:20px;font-weight:700;}
.groupLinkIco li.ico1 a span{background:url('../../../images/group/ko/main_group_ico01.png') no-repeat top center;}
.groupLinkIco li.ico2 a span{background:url('../../../images/group/ko/main_group_ico02.png') no-repeat top center;}
.groupLinkIco li.ico3 a span{background:url('../../../images/group/ko/main_group_ico03.png') no-repeat top center;}

/* 메인 - 사업분야 컨텐츠 */
.businessAreasWrap{position:relative;min-width: 1440px;height:100vh;overflow:hidden;padding-bottom:0 !important}
.businessAreasTit{position:absolute;z-index:4;top:50%;transform: translateY(-165%);margin-right:259px;color:#fff;line-height:80px;font-size:80px;font-weight:700;}
.businessAreasControl{overflow:hidden;position:relative;display:flex;height:100%;background-color:#000;align-items: center;justify-content:center;padding-right:688px;}
.businessAreasControl ul{display:flex;flex-wrap:wrap;width:570px;margin-top:140px;}
.businessAreasControl ul li{margin:30px 0 0 30px;}
.businessAreasControl ul li:nth-child(3n+1){margin-left:0;}
.businessAreasControl li > a{position: relative; display: block; width: 170px; height:80px; z-index:3; padding:13px 17px; line-height: 26px; color: #ffffff; font-size: 18px; border:1px solid #fff;text-decoration:none;}
.businessAreasControl li > a .name{position: relative; z-index:2}
.businessAreasControl li > a .bg{position: absolute; left: 0; bottom: 0; width: 100%; height: 0; background: #e8e9eb; transition: ease .7s all;}
.businessAreasControl li.on > a .bg{height: 100%;}
.businessAreasControl li.on > a{color:#111;}
.businessAreasControl li > a:hover .bg{height: 100%;}
.businessAreasControl li > a:hover{color:#000;}
.businessAreasControl li .parallaxBgWrap{position: absolute; bottom:0; left:0; width: 100%; height: 0; visibility: hidden; transition: .8s;}
.businessAreasControl li .parallaxBgWrap [class^="parallaxImg0"]{height:100%;}
.businessAreasControl li .parallaxBgWrap [class^="parallaxImg0"]:before{position:absolute;left:0;bottom:0;z-index:3;width:100%;height:100%;opacity: .6;background-color:rgba(0,0,0,0.5);content:"";}
.businessAreasControl li.on .parallaxBgWrap{visibility: visible; z-index:2;  height: 100vh;}
.businessAreasControl li .parallaxImg01{background:url(../../../images/group/ko/main_parallax_img01.jpg) no-repeat center center / cover;}
.businessAreasControl li .parallaxImg02{background:url(../../../images/group/ko/main_parallax_img02.jpg) no-repeat center center / cover;}
.businessAreasControl li .parallaxImg03{background:url(../../../images/group/ko/main_parallax_img03.jpg) no-repeat center center / cover;}
.businessAreasControl li .parallaxImg04{background:url(../../../images/group/ko/main_parallax_img04.jpg) no-repeat center center / cover;}
.businessAreasControl li .parallaxImg05{background:url(../../../images/group/ko/main_parallax_img05.jpg) no-repeat center center / cover;}
.businessAreasControl li .parallaxImg06{background:url(../../../images/group/ko/main_parallax_img06.jpg) no-repeat center center / cover;}
.businessAreasControl li .parallaxImg07{background:url(../../../images/group/ko/main_parallax_img07.jpg) no-repeat center center / cover;}
.businessAreasControl li .parallaxImg08{background:url(../../../images/group/ko/main_parallax_img08.jpg) no-repeat center center / cover;}
.businessAreasControl li .parallaxImg09{background:url(../../../images/group/ko/main_parallax_img09.jpg) no-repeat center center / cover;}
.businessAreasControl li .parallaxBgWrap .txt{ overflow:hidden;; position: absolute; top: 50%; left: 60%; transform: translateY(-24%); z-index:4; zoom: 1; opacity: 0; transition: .5s; font-size: 130px; line-height: 130px; text-align: left; font-weight: 700; color: #ffffff;}
.businessAreasControl li .parallaxBgWrap .txt:after{content: ""; display: inline-block; height: 100%; vertical-align: middle;}
.businessAreasControl li .parallaxBgWrap .txt span{display: inline-block; vertical-align: top; letter-spacing: -0.025em;}
.businessAreasControl li .parallaxBgWrap .txt span > a{display:block;color:#fff;font-size:40px;text-decoration: none;}
.businessAreasControl li .parallaxBgWrap .txt span > a + a{margin-top:5px;}
.businessAreasControl li .parallaxBgWrap .txt span .titLink{margin-bottom:53px;line-height:57px;font-size:60px;}
.businessAreasControl li .parallaxBgWrap .txt .businessAreasTit{display:block;margin-bottom:24px;color:#fff;font-size:80px;}
.businessAreasControl li .parallaxBgWrap .txt span.kr{font-size: 42px; line-height: 60px;}
.businessAreasControl li .parallaxBgWrap .txt span.kr a{display:block;vertical-align:top;color:#fff;}
.businessAreasControl li.on .parallaxBgWrap .txt{opacity: 1; }

/***************************z*******************************************************************************************************/
/**********************************************************************************************************************************/
/****************************************************    LAYOUT    **********************************************************/
/**********************************************************************************************************************************/
/**********************************************************************************************************************************/

#skipNavi   {position: absolute;  margin: 0 auto;  width: 100%;  list-style: none;  font-size: 1.15em;  top: -10.5em;  left: 0;  z-index: 999;}
#skipNavi a:focus, #skipNavi a:active {  position: absolute;  padding-top: 0.5em;  width: 100%;  height: 2em;  top: 10.5em;  z-index: 999;  text-align: center;  color: #fff;  background: #333;  overflow: visible;  clip: unset;}


html, body  {height:100%; }
section   {width:1280px; margin:0 auto; }

section.pos  {position:relative; }


#container    {overflow:hidden; padding-bottom:200px; position: relative; z-index: 10; }
.GI ~ #container    {padding-bottom:0; }
#container section    {  background:#fff; position:relative; z-index:19;  }
#container section.GN    {margin-top:150px; }
#container section.ESG    {margin-top:150px; }
#container section.ESG.tab2    {margin-top:215px; }
#container section.CO    {margin-top:143px; }

.ieWarning { position: fixed; width: 100%; background: #111; box-sizing: border-box; z-index: 32; display:none}
.ieWarning > div { position: relative; max-width: 1440px; margin:auto; padding: 15px 39px; box-sizing: border-box;}
.ieWarning p { padding-right: 30px; color: #fff; font-size: 19px; line-height: 30px; font-weight: 700;}
.ieWarning button { position: absolute; top: 50%; right: 30px; width: 30px; height: 30px; transform: translateY(-50%); background: url('../../../images/group/ko/bg_ie_close.png') no-repeat center center; }

#lnbWrap    {position:relative; width:100%; min-height:60px; z-index:20;  }
#lnbWrap .pos    {z-index:30;  background:#fff;  }
.scroll_ON #lnbWrap .pos    {position:fixed; top:0px; background:#fff; transition: transform .4s;   }
.scroll_ON #lnbWrap .pos.type2 {top: 30px; }
.scroll_UP .scroll_ON + div #lnbWrap .pos    {position:fixed; top:-30px; transform: translateY(150px);  background:#fff;  }
.scroll_UP .scroll_ON + div #lnbWrap .type2 { transform: translateY(120px);  -ms-transform: translateY(150px); }
.scroll_UP .scroll_ON #lnbWrap .pos    { transform: translateY(150px);   }
.scroll_UP .scroll_ON #lnbWrap .pos    { transform : translateY(120px); }
#lnbWrap .pos   {width:100%; min-width:1280px}
#lnbWrap .pos:before    {content:""; width:100%; height:1px; background:#ccc; position:absolute; top:59px; left:0; }
#lnbWrap ul.left_nav    {position:relative; margin:0 auto; display:flex; height:60px; justify-content: center;   }
#lnbWrap ul.left_nav li    {height:60px; padding:0 25px }
#lnbWrap ul.left_nav li a.dep1    {float:left; display:block; padding:20px 0; color:#666; line-height:1.2}
#lnbWrap ul.left_nav li a:hover    {color:#21847c; text-decoration: none;}
#lnbWrap ul.left_nav li.active > a.dep1    {color:#21847c; padding-bottom:16px; border-bottom:2px solid #3a6261; box-sizing: border-box; }
#lnbWrap ul.left_nav li.active ul.sub_menu  {display:flex; }
#lnbWrap ul.left_nav li ul.sub_menu    {display:none; position:absolute; left:0; top:120px; width:100%; overflow:hidden; justify-content: center }

#lnbWrap ul.left_nav li ul.sub_menu li  { position: relative; padding:0 50px; }
#lnbWrap ul.left_nav li ul.sub_menu li a {font-size:19px; font-weight: 700; color:#111; }
#lnbWrap ul.left_nav li ul.sub_menu li.active a {color:#21847c; border-bottom:5px solid #21847c; padding-bottom:11px;   }
#lnbWrap ul.left_nav li ul.sub_menu li:first-child::after { position: absolute; content: ""; display: block; margin-top: -23px; width: 2px; height: 17px; top: 50%; right: -1px; background:#eee; }

#lnbWrap fieldset    {position:absolute; right:0; top:0; width:300px; height:60px; }
#lnbWrap fieldset .btnSearch    {position:absolute; bottom:0; right:0; width:52px; height:52px; background:url(../../../images/group/ko/ico_btn_search.jpg) no-repeat 50% 50%;  }
#lnbWrap fieldset .search    {position:absolute; right:0; bottom:0; width:300px; overflow: hidden; transition: width .3s;}
/*#lnbWrap fieldset .on + form .search    {width:300px; }*/
#lnbWrap fieldset .search input[type=text]    {width:300px; height:52px; border:0; border-bottom:2px solid #333; padding-left:20px; box-sizing: border-box; }

#headerWrap {position:fixed; top: 0px; width:100%; height:120px; z-index:31;   }
#headerWrap.type2 { top: 30px; }
.header       {position:relative; width:100%; max-width:1440px; margin:0 auto; height:120px;    }
#headerWrap.scroll_ON       {border-bottom:1px solid #eee; top: -151px; transition: transform .4s; background:#fff; }
#headerWrap.scroll_ON.type2{top:-151px}
body.main #headerWrap.scroll_ON{top:0;border:0;background:transparent;}
/* #headerWrap:before {content:''; position:absolute; width:100%; height:100%; top:-100%; left:0; background:#fff; transition: transform .4s;  } */
.scroll_UP #headerWrap.scroll_ON       {transform: translateY(150.6px); transition: .4s; }
.scroll_UP body.main #headerWrap.scroll_ON{transform: translateY(0);}
/* .scroll_UP #headerWrap.type2:before { transform: translateY(100%); } */
.scroll_UP #headerWrap.scroll_ON:before   {transform: translateY(100%); }
.header .logoWrap       {position:absolute; z-index:5;  left:0; top:42px; }
.header .utils{position: relative; z-index: 3;}
.header.on .utils{z-index: 5;}
/*.header .utils:after    {content:""; position:absolute;  width:1px; height:15px; right:101px; top:53px; background:rgba(255,255,255,0.3) }*/
.header.on .utils:after    {display: none;}
.header .utils .localization  {position:absolute; z-index:3; right:123px; top:38px; box-sizing: border-box;  }
.header .utils .localization ul  {overflow:hidden; width:45px; height:45px; display:flex; flex:1 1 1; flex-flow:row nowrap; border-radius:45px;  border:rgba(255,255,255,0.3) 1px solid; background:rgba(0,0,0,0.1); transition:  width .3s; box-sizing: border-box;  }
.scroll_ON .header .utils .localization ul  {background:#f7f7f7;}
.scroll_ON .header.on .utils .localization ul  {background-color:rgba(0,0,0,0.1); background-image:url(../../../images/group/ko/ico_lang.png) no-repeat 12px 50% #fff;;}
.header .utils .localization ul li a { display:block; width:20px; height:20px; line-height:17px; text-align: center; font-size:15px; font-weight: 500; color:#fff; box-sizing: border-box; margin: 12.5px; }/* 2022-09-01 접근성 */

.header .utils .localization ul li:last-of-type a{margin-right: 25px;}
.scroll_ON .header .utils .localization ul li a {color:#111;}
.scroll_ON .header.on .utils .localization ul li.on a {color:#fff;}
.header .utils .localization ul:hover   {width:195px; border:0; padding-left:34px; border:1px solid #fff; background:url(../../../images/group/ko/ico_lang.png) no-repeat 12px 50% #fff;   }
.scroll_ON .header.on .utils .localization ul:hover   {color: #111;}
.scroll_ON .header.on .utils .localization ul:hover li.on  a {color: #111;}
.scroll_ON .header .utils .localization ul:hover   {background-color: #f7f7f7;}
.header .utils .localization ul:hover li a  {color:#111;  }

.header .utils #gnbOpen   {position:absolute; z-index:3;  position:absolute;  right:0; top:0;  top:20px; right:0; width:80px; height:80px; background:url(../../../images/group/ko/gnbBtn_b.png) no-repeat 0 0; }
.header .utils #gnbOpen > span{display:inline-block;padding-top:24px;vertical-align:top;color:#fff;font-size:11px;}
.header.on .utils #gnbOpen   {display: none;}
.header .gnb       {visibility: hidden;left: 0; top: 0; position:fixed; z-index:2;  top:0; width:0; height:0; overflow:hidden; transition: width .0001s .7s, height 0.0001s .7s; }
.header .gnb:before       {content:""; position:absolute; z-index:2;  top:0;   background:#1a1d25; width:80px; height:80px;  border-radius:50%; transition: .7s; opacity:0;  }
.header .gnb:before       {left:50%; margin-left:640px; top:20px;  }
.header .gnb.on:before       {display:block; transform: scale(50) translateX(-20%); opacity:1; }
.header .gnb.on       {visibility: visible;z-index:4; width:100%; height:150vh; transition: width .0001s 0s, height 0.0001s 0s;}

@media screen and (max-width: 1440px) {
  .header .gnb:before       {left:auto; right:0; margin-left:0; top:20px;  }
}


.header .gnb .gnbBody       {position:relative; z-index:2; width:100%; max-width:1440px; margin:0 auto; }
.header .gnb .gnbBody ul       { opacity: 0;  transition: opacity .3s .1s ; }
.header .gnb.on .gnbBody ul       {opacity: 1;}
.header .gnb .gnbBody #gnbClose   {position:absolute; z-index:20; top:20px; right:0; width:80px; height:80px; background:url(../../../images/group/ko/gnbBtn_close.png) no-repeat 0 0; }
.header .gnb ul.fix     {width:1020px; margin:0 auto ; padding:170px  0 0; display:flex; }
.header .gnb ul li.depth1    {margin-left:56px; } /* 2023-03-03 수정 */
.header .gnb ul li a   {color:#fff; text-decoration: none;}
.header .gnb ul li a.dep1   {font-size:32px; font-weight: 700; display:block; margin-bottom:60px; letter-spacing: -.25; }
.header .gnb ul li a.dep2   {font-size:20px; }
.header .gnb ul li ul.sub_menu li  {height:46px; }


.logoWrap h1.logo a   {display:block; width:126px; height:58px; background:url(../../../images/group/ko/logo_w.png) no-repeat 0 0;  }
.on .logoWrap h1.logo a   {display:block; width:126px; height:58px; background:url(../../../images/group/ko/logo_w.png) no-repeat 0 0;}
.scroll_ON .on .logoWrap h1.logo a   {display:block; width:126px; height:58px; background:url(../../../images/group/ko/logo_w.png) no-repeat 0 0;}
.scroll_ON .logoWrap h1.logo a   {background:url(../../../images/group/ko/logo_b.png) no-repeat 0 0;  }
.scroll_ON .header .utils #gnbOpen   {background:url(../../../images/group/ko/gnbBtn_w.png) no-repeat 0 0; }
.scroll_ON .header .utils #gnbOpen > span{color:#111;}
.scroll_ON #lnbWrap ul.left_nav li ul.sub_menu {display:none !important;}

/*
html  {overflow:hidden}
body  { height: 100vh;  overflow-x: hidden;  overflow-y: auto;  -webkit-perspective: 300px;  perspective: 300px;}
*/

.headerVisual       { overflow: hidden;  position: relative; z-index:1; height: 100vh;  -webkit-transform-style: preserve-3d;  transform-style: preserve-3d; }
.headerVisual .visual   {  position: absolute;  width:100%; height:100%;  -webkit-transform: translateZ(-300px) scale(2);  transform: translateZ(-300px) scale(1);}
/*.headerVisual .visual .img {  text-align: center;  position: absolute; width:100%; height:100%;  left: 50%;  top: 50%;  transform: translate(-50%, -50%); }*/
.headerVisual .visual .img   {height:100%; background:url(../../../images/group/ko/subVisual_GN.jpg) no-repeat 0 0 fixed; background-size: cover;}
.headerVisual.GN .visual  .img   {background-image:url(../../../images/group/ko/subVisual_GN.jpg); }
.headerVisual.CO .visual  .img   {background-image:url(https://www.ehyundai.com/images/group/ko/subVisual_CO.png); }
.headerVisual.ETH .visual  .img   {background-image:url(../../../images/group/ko/subVisual_ETH.jpg); }
.headerVisual.ESG .visual  .img   {background-image:url(../../../images/group/ko/subVisual_ETH.jpg); }
.headerVisual.GI .visual  .img   {background-image:url(../../../images/group/ko/subVisual_GI.jpg); }

section.headerTitle       {position:fixed; z-index:10; top:50%; transform:translateY(-50%); color:#fff; width:100%; text-align: center;}
section.headerTitle h2      {opacity:0; transform: translateY(50px);  font-size:75px; font-weight: 700; transition:.6s; line-height: 80px;}
section.headerTitle p       {opacity:0; transform: translateY(30px); margin-top:40px; font-size:22px; font-weight: 400;  transition:.8s .3s; line-height: 35px;}
.load section.headerTitle h2    ,
.load section.headerTitle p         {opacity:1; transform: translateY(0px); letter-spacing: -0.025em;}

.popupLayerWrap {position: fixed; overflow:auto; left:0; top:0; width:100%; height:100%; box-sizing:border-box; padding:100px; z-index: 49; display:flex; align-content: center; display:none; }
.popupLayerWrap .popBody { width: 1140px; padding: 116px 70px 120px; background: #fff;  position: relative;  margin:auto;  z-index: 50; opacity: 0; transform: translateY(100px); transition: .5s; }
.popupLayerWrap.show .popBody {opacity: 1; transform: translateY(0);}
.popupLayerWrap .popBg {  position:fixed;  top: 0;  left: 0;  width: calc(100% - 17px);  height: 100%;  background: rgba(0,0,0,0.5);  z-index: 49; opacity: 0; transition: .5s; }
.popupLayerWrap.show  .popBg {  opacity: 1;}

.stayFix     {position:relative; }


/**********************************************************************************************************************************/
/**********************************************************************************************************************************/
/****************************************************    CONSTENTS    **********************************************************/
/**********************************************************************************************************************************/
/*********************************************************************************************************************************/

/* 사업개요  */
.pageTopMent      {padding-bottom:80px;  }
.pageTopMent em      {font-size:56px; letter-spacing: -0.5; line-height:70px; color:#000;  letter-spacing: -0.115em; }
.pageTopMent p      {color:#111; margin-top:58px;  }
.businessOverview h3.en span  { font-size: 24px;; font-family:'Noto Sans', sans-serif; font-weight: 400;}
.businessOverview .businessList  {position:relative; width:400px; margin:0 auto; margin-top:75px; }
.businessOverview .businessList + .businessList   {margin-top:200px;}
.businessOverview img.infoVisual  {position:absolute; opacity:0; right:0; transform: translateX(-100px); transition: 1s; opacity: 0;   }
.businessOverview img.infoVisual.scroll_ON  {opacity:1; transform: translateX(0%); opacity: 1;}
.businessOverview .right img.infoVisual  {left:0; right:auto; transform: translateX(100px); }
.businessOverview .right img.infoVisual.scroll_ON  {transform: translateX(0%);}
.businessOverview h3  {width: 550px; margin: 110px auto 0; padding-left: 50px; font-size:30px; font-weight: 400; color:#9a895d; } /* 2023-03-03 수정 */
.businessOverview .businessList + h3  {margin-top:140px;  }
.businessOverview .businessList > h4  {position:absolute; left:50%; top:0; margin:0 auto; height:430px; width:1280px;  display:flex; align-items: center; font-family: 'Zilla Slab', serif;  font-size: 90px; color:#111; justify-content: center; text-align: center; line-height:90px; transition: 1s .5s; transform: translateX(-50%) translateY(50px); opacity:0; letter-spacing: 0; }
.businessOverview .businessList > h4.scroll_ON  {transform: translateX(-50%) translateY(0); opacity:1;  }
.businessOverview .businessList > dl {position:relative; padding:493px 0 0; }
.businessOverview .businessList > dl + dl { margin-top:150px; }
.businessOverview .businessList > dl > dt {font-size:40px; color:#111; font-weight: 700; }
.businessOverview .businessList > dl > dd  {font-size:24px; color:#111; }
.businessOverview .businessList > dl > dd.info {margin-top:28px; }
.businessOverview .businessList > dl > dd.info > p {margin-bottom:18px; letter-spacing: -0.05em;}
.businessOverview .businessList > dl > dd.btns {width: 500px; margin-top:60px; }
.businessOverview .businessList > dl > dd.btns > a {margin-right:3px; }
.businessOverview .businessList > dl > dd.btns > a:first-child {margin-bottom:8px; }

/* 상세 상단 */
.headerVisual.GNV       {  height: 600px; }
.headerVisual.GNV ~ #container {background: #ffffff;}
.headerVisual.GNV .visual   { width:110%; height:110%; lefT:-5%; top:-5%; background: url(../../../images/group/ko/sample_1.jpg) no-repeat 50% 50% fixed; background-size: cover;; filter: blur(6px);-webkit-filter: blur(10px); transform: none; }
.headerVisual.GNV .visual .img   { height: 100%; background: #000; opacity:.5}
.headerVisual.GNV section.headerTitle {position:fixed; z-index:1; top:175px; left:50%; transform:translateX(-50%); color:#fff; width:1280px; padding:0 160px; text-align: center; box-sizing:border-box;}
.headerVisual.GNV section.headerTitle h2      {line-height:62px; font-size:50px; font-weight: 400; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.headerVisual.GNV section.headerTitle p.name      {margin-top:41px; font-size: 24px;; }
.headerVisual.GNV section.headerTitle p.date      {margin-top:4px; font-size:19px; transition:.8s .6s; }
.headerVisual.GNV section.headerTitle .tagList    {margin-top:50px; transition:.8s .9s; opacity:0; transform: translateY(30px); }
.load .headerVisual.GNV section.headerTitle .tagList    {opacity:1; transform: translateY(0px);}

.headerVisual.GNV section.headerTitle .tagList a  {position:relative; display:inline-block; line-height:30px; padding:0 10px; margin:0 4px 0 3px; color:#fff; }
.headerVisual.GNV section.headerTitle .tagList a:before  {content:""; position:absolute; left:0; width:100%; height:100%; background:#000; opacity:.6 }
.headerVisual.GNV section.headerTitle .tagList a span  {position:relative; z-index: 2; font-size:13px; }
.viewShareBtnsWrap {position:fixed; width:100%;  max-width:1440px; top:0px; left:50%; transform: translateX(-50%); z-index:20;  box-sizing: border-box; }
.viewShareBtns {position:absolute; right:80px; top:150px; }
.viewShareBtns ul{position: relative; margin-right: 40px;}
.viewShareBtns ul:after{content: ""; display: block; clear: both;}
.viewShareBtns ul li{float: left; margin-left: 5px; transition:.8s;}
.viewShareBtns ul li:first-child{transform: translateX(120px);}
.viewShareBtns ul li:first-child + li{transform: translateX(80px);}
.viewShareBtns ul li:first-child + li + li{transform: translateX(40px);}
.viewShareBtns ul.on li:first-child{transform: translateX(0);}
.viewShareBtns ul.on li:first-child + li{transform: translateX(0);}
.viewShareBtns ul.on li:first-child + li + li{transform: translateX(0);}
.viewShareBtns ul li button {width:35px; height:35px; transition: .0001s .8s;}
.viewShareBtns ul.on li button {opacity: 1; transition: .0001s .001s;}
.viewShareBtns button.sns_1 {opacity: 0; background:url(../../../images/group/ko/sns_kakao.png) no-repeat 0 0; }
.viewShareBtns button.sns_2 {opacity: 0; background:url(../../../images/group/ko/sns_facebook.png) no-repeat 0 0; }
.viewShareBtns button.sns_3 {opacity: 0; background:url(../../../images/group/ko/sns_url.png) no-repeat 0 0; }
.viewShareBtns button.sns_3 + .copyBox{right: -40px;}
.viewShareBtns .snsOpen {position: absolute; right: 0; top: 0; width:35px; height:35px; background:url(../../../images/group/ko/sns_btn.png) no-repeat 0 0; z-index: 1;}
.viewShareBtns .copyBox{display: none; position: absolute; top: 55px; right: 0; width: 330px; padding: 20px 30px 30px; background: #ffffff; border: 1px solid #000000; box-sizing: border-box;}
.viewShareBtns .copyBox.on{display: block;}
.viewShareBtns .copyBox p{overflow: hidden; line-height: 30px; font-size: 15px; color: #333333}
.viewShareBtns .copyBox p:first-child{margin-bottom: 15px;}
.viewShareBtns .copyBox .dragTxt{padding: 15px 20px; background: #f6f6f6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.viewShareBtns .copyBox .close{position: absolute; top: 13px; right: 13px; width: 16px; height: 16px; font-size: 0; text-indent: -9999px; background:url(../../../images/group/ko/drag_box_close.png) no-repeat;}

.newsDetail   {margin:0 auto; width:1280px; }
.newsDetail .newsImg   { width: 100%; padding:150px 0 0; text-align: center;   }
.newsDetail .newsImg img { width: 60%; }
.newsDetail .newsContents   {padding:80px 160px; border-bottom:1px solid #eee; line-height:30px;   }
.newsDetail .newsBtns   {margin-top:60px; text-align: center;}

/* 게시판 상새 버튼 */
.newsDetail .detailBtns {margin-top:60px; text-align: center;}

/* 그룹소개 */
section.GI       {padding-top:140px; }
.gi_intro .introTop       {text-align: center; padding-bottom:103px; }
.gi_intro .introTop em    {display:block; font-size:50px; letter-spacing: -0.1em; color:#111111; transform: translateY(100px); opacity: 0; transition: .5s;}
.gi_intro .introTop div   {margin-top:70px; line-height:30px; transform: translateY(100px); opacity: 0; transition: .5s .4s; }
.gi_intro .introTop.scroll_ON em    {transform: translateY(0); opacity: 1;}
.gi_intro .introTop.scroll_ON div   {transform: translateY(0); opacity: 1; }

.gi_intro.visualBg_1        {position:relative; z-index:2; height:100vh; min-height:1000px; background:#f6f6f6 url(../../../images/group/ko/gi_01_img_1_1.png) no-repeat 50% 50% ; }
/*
.gi_intro.visualBg_1 .visualBg_1_1     {position:absolute; left:0; top:0; width:100%; height:100%; background: url(../../../images/group/ko/gi_01_img_1_1.jpg) no-repeat 50% 50% ; background-size: cover; opacity:0; transition: opacity 1s;}
*/
.step_1 .gi_intro .visualBg_1_1,
.step_2 .gi_intro .visualBg_1_1,
.step_3 .gi_intro .visualBg_1_1,
.step_4 .gi_intro .visualBg_1_1,
.step_5 .gi_intro .visualBg_1_1        {opacity:1; }

#container section.groupInfo  { background:transparent;   }
/*.groupInfo_ment01   {width:100%; max-width:1180px; margin:0 auto; padding:240px 0 0; color:#fff; }
.groupInfo_ment01 em  {font-size:50px; line-height:70px; display:block; margin-bottom:80px; opacity:0; transform: translateY(100px);  }
.groupInfo_ment01 p  {font-size:19px; line-height:30px; margin-top:40px; opacity:0;  transform: translateY(100px);  }
.groupInfo_ment01 em  {transition: .6s  .5s; }
.groupInfo_ment01 p  {transition: .6s .8s; }*/
.step_2  .groupInfo_ment01 em,
.step_2  .groupInfo_ment01 em,
.step_3  .groupInfo_ment01 em,
.step_4  .groupInfo_ment01 em,
.step_5  .groupInfo_ment01 em  {opacity:1;  transform: translateY(0);}
.step_3  .groupInfo_ment01 p,
.step_4  .groupInfo_ment01 p,
.step_5  .groupInfo_ment01 p {opacity:1; transform: translateY(0); }


.groupInfo_ment02       {font-size:50px; line-height:70px; padding:170px 0 125px; color:#111; text-align: center;  letter-spacing: -0.1em; }
.groupInfo_ment02 p         {opacity:0; transform: translateY(100px); transition: .6s;  }
.groupInfo_ment02 strong    {opacity:0; transform: translateY(100px); transition: .6s .2s; display:block;  }
.groupInfo_ment02 div       {opacity:0; transform: translateY(100px); transition: .6s .6s;  margin-top:70px; }
.groupInfo_ment02.scroll_ON p       {opacity:1; transform: translateY(0);}
.groupInfo_ment02.scroll_ON strong  {opacity:1; transform: translateY(0);}
.groupInfo_ment02.scroll_ON div     {opacity:1; transform: translateY(0); }

.gi_intro.visualBg_2        {position:absolute; width:100%; z-index:2;clip: rect(0, auto, auto, 0); height:100vh; min-height:1000px; background: url(../../../images/group/ko/gi_01_bg_2.jpg) no-repeat 50% 50% fixed; background-size: cover;}
.gi_intro.visualBg_2:after{content: ""; position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: 0; transition: 0.8s;}
.gi_intro.visualBg_3        {position:absolute; width:100%; z-index:2; clip: rect(0, auto, auto, 0); height:100vh; min-height:1000px; background: url(../../../images/group/ko/gi_01_bg_3.jpg) no-repeat 50% 50% fixed; background-size: cover;}
.gi_intro.visualBg_3:after{content: ""; position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: 0; transition: 0.8s;}

.stay_ON .gi_intro      {position:fixed; width:100%; top:60px; }
.stay_ON_end .gi_intro      {position:absolute; width:100%; bottom:0; }
.groupInfo_ceo          {overflow: hidden; padding:160px 0 0; display:flex; align-items: center; justify-content: space-between;}
.groupInfo_ceo .ceo          {position:fixed; width:550px; right:50%; top:50%; margin-top:-295px; transform: translateY(200px); opacity: 0; transition: 1s;}
.groupInfo_ceo.right .ceo          {left:50%; transform: translateY(200px); opacity: 0;}
.groupInfo_ceo .ceoMent p{transform: translateY(100px); opacity: 0;}
.groupInfo_ceo.right .ceoMent p    {transform: translateY(100px); opacity: 0;}
.groupInfo_ceo .ceoMent p    {transform: translateY(100px); opacity: 0;}
.groupInfo_ceo .ceoMent      {position:fixed; color:#fff; width:570px; height:590px; display:flex; left:50%; top:50%; margin-top:-295px; padding:0 60px;  }
.groupInfo_ceo .ceoMent div      {margin:auto 0;}
.groupInfo_ceo.right  .ceoMent      {right:50%; left:auto; }
.groupInfo_ceo .ceoMent p + p    {margin-top:35px; }
.groupInfo_ceo .ceoMent p      {transition: .6s ; }
.groupInfo_ceo .ceoMent p:nth-child(2) {transition: .6s .2s; }
.groupInfo_ceo .ceoMent p:nth-child(3) {transition: .6s .4s; }
.groupInfo_ceo .ceoMent p:nth-child(4) {transition: .6s .6s; }

.step_0 .visualBg_2:after,
.step_0 .visualBg_3:after{opacity: 0;}
.step_1 .visualBg_2:after,
.step_1 .visualBg_3:after,
.step_2 .visualBg_2:after,
.step_2 .visualBg_3:after,
.step_3 .visualBg_2:after,
.step_3 .visualBg_3:after,
.step_4 .visualBg_2:after,
.step_4 .visualBg_3:after,
.step_5 .visualBg_2:after,
.step_5 .visualBg_3:after{opacity: .5;}
.step_2 .groupInfo_ceo .ceo,
.step_2 .groupInfo_ceo.right .ceo     {opacity:1; transform:  translateX(0) translateY(0);}
.step_3 .groupInfo_ceo .ceo,
.step_4 .groupInfo_ceo .ceo,
.step_5 .groupInfo_ceo .ceo          {opacity:1; transform: translateY(0);}
.step_3 .groupInfo_ceo .ceoMent  p,
.step_4 .groupInfo_ceo .ceoMent  p,
.step_5 .groupInfo_ceo .ceoMent  p      {opacity:1; transform: translateY(0);}


.gi_intro.ciContents {background-color: #f6f6f6; height:1200px; position:relative; z-index: 1;}
.ciInfo             {padding:153px 0 0;}
.ciInfo .stit       {font-size:50px; height:130px; color:#111; text-align: center; letter-spacing: -0.05em; opacity:0; transform: translateY(50px); transition: .6s; }
.ciInfo.scroll_ON .stit       {opacity:1; transform: translateY(0);}
.ciInfo .ciInfoTab       {position:relative; text-align: center; }
.ciInfo .ciInfoTab button      { }
.ciInfo .ciInfoTab button.tabPrev      {display:inline-block; margin-top:7px; vertical-align: top; width:13px; height:17px; background:url(../../../images/group/ko/tab_btn_l.png) no-repeat 0 0;  }
.ciInfo .ciInfoTab button.tabNext      {display:inline-block; margin-top:7px; vertical-align: top; width:13px; height:17px; background:url(../../../images/group/ko/tab_btn_r.png) no-repeat 0 0;  }
.ciInfo .ciInfoTab ul      {display:inline-block; vertical-align: top;}
.ciInfo .ciInfoTab li.citab    {float:left; }
.ciInfo .ciInfoTab li.citab button.tabBtn     {height:43px; font-size:19px; background-color: transparent; position:relative; margin:0 50px 0 51px; padding-bottom:12px;  font-weight: 700; color:#111; border-bottom:5px solid #f6f6f6;  }
/*
.ciInfo .ciInfoTab li.citab button.tabBtn     {opacity:0; transform: translateY(50px); transition: .6s;   }
.ciInfo .ciInfoTab li.citab:nth-child(2) button.tabBtn     {transition: .6s .2s;   }
.ciInfo .ciInfoTab li.citab:nth-child(3) button.tabBtn     {transition: .6s .4s;   }
.ciInfo .ciInfoTab li.citab:nth-child(4) button.tabBtn     {transition: .6s .6s;   }
.ciInfo .ciInfoTab li.citab:nth-child(5) button.tabBtn     {transition: .6s .8s;   }
.ciInfo.scroll_ON .ciInfoTab li.citab button.tabBtn     {opacity:1; transform: translateY(0);  }
*/
.ciInfo .ciInfoTab li.citab.on button.tabBtn  {border-bottom:5px solid #21847c; color:#21847c; }
.ciInfo .ciInfoTab li.citab:first-child button.tabBtn::before {display:none; }
.ciInfo .ciInfoTab li.citab button.tabBtn::before     {content:''; width:2px; height:17px; background:#ccc; position:absolute; left:-50px; top:9px; }
.ciInfo .ciInfoTab li.citab .tabCont          {position:absolute; left:0; top:90px; width:100%; text-align: center;}
.ciInfo .ciInfoTab li.citab.on .tabCont .ciImg     {opacity:1; transform: translateY(0); }
.ciInfo .ciInfoTab li.citab.on .tabCont .ciMent     {opacity:1; transform: translateY(0); }
.ciInfo .ciInfoTab li.citab .tabCont .ciImg    {overflow: hidden; opacity:0; /*transform: translateY(100px); transition: .4s;*/ }
.ciInfo .ciInfoTab li.citab .tabCont .ciImg  img  { opacity: 0;}
.ciInfo .ciInfoTab li.citab.on .tabCont .ciImg img  {transform: translateY(0); opacity: 1; }
.ciInfo .ciInfoTab li.citab .tabCont .ciMent  {width:800px; height:161px; margin:0 auto; padding-top:15px; line-height:30px; opacity:0; /*transform: translateY(100px); transition: .4s;*/ }
#container .ciInfo .downBtn	{ position:relative; height:54px; line-height:48px; font-weight:400; margin:0 7px 0 7px; padding:0 54px 0 20px; letter-spacing:-0.025em; background:none; color:#333;  }
#container .ciInfo .downBtn:after	{content:""; position:absolute; right:18px; top:16px; width:16px; height:19px; background:url(../../../images/group/ko/ico_btn_down.png) no-repeat; }
#container .ciInfo .downBtn:hover,
#container .ciInfo .downBtn:focus{border: 2px solid #111111;}
/*#container .ciInfo .downBtn:hover,
#container .ciInfo .downBtn:focus{background: #21847c; color: #ffffff; border: 2px solid #21847c;}
#container .ciInfo .downBtn:hover:after,
#container .ciInfo .downBtn:focus:after{background:url(../../../images/group/ko/ico_btn_down_h.png) no-repeat; }*/

/* 비전 2030 */
.GI.visionThrophy{padding-top: 140px; padding-bottom: 200px; width: 100%;}
.visionIntroTxt{text-align: center; font-size: 50px; line-height: 70px; color: #111111;}
.visionIntroTxt em{display: block; font-size: 30px; line-height: 90px; transform: translateY(100px); opacity: 0; transition: .5s;}
.visionIntroTxt p{transform: translateY(100px); opacity: 0; transition: .5s .4s;}
.visionIntroTxt.scroll_ON em{transform: translateY(0); opacity: 1;}
.visionIntroTxt.scroll_ON p{transform: translateY(0); opacity: 1;}

.throphyBoxWrap{width: 1280px; margin: auto; margin-top: 100px;}
.throphyBoxWrap .throphyBoxList{position: relative; width: 1280px; height: 811px; margin: auto; padding-left: 230px; background:url(../../../images/group/ko/vision_throphy.png) no-repeat 230px 0; box-sizing: border-box;}
.throphyBoxWrap .throphyBoxList > li{width: 600px; text-align: center; box-sizing: border-box;}
.throphyBoxWrap .throphyBoxList > li.line1{height: 115px;}
.throphyBoxWrap .throphyBoxList > li.line2{height: 166px;}
.throphyBoxWrap .throphyBoxList > li.line3{height: 188px;}
.throphyBoxWrap .throphyBoxList > li.line4{height: 120px; margin-top: 77px;}
.throphyBoxWrap .throphyBoxList > li.line5{height: 85px;}
.throphyBoxWrap .throphyBoxList > li.line6{height: 60px;}
.throphyBoxWrap .throphyBoxList > li > a{display: block; height: 100%; font-size: 24px; color: #111111; box-sizing: border-box;}
.throphyBoxWrap .throphyBoxList > li > a:after{content: ""; display: block; width: 41px; height: 41px; margin: auto; margin-top: 5px; background: url(../../../images/group/ko/throphy_plus.png) no-repeat center; box-sizing: content-box; transition: .3s; transform: rotate(0); animation:blink 1s ease-in-out infinite alternate;}
@keyframes blink{
    0% {opacity:.3;}
    100% {opacity:1;}
}
.throphyBoxWrap .throphyBoxList > li.on > a:after{background: url(../../../images/group/ko/throphy_hover_plus.png) no-repeat center; transform: rotate(-225deg); animation:none;}
.throphyBoxWrap .throphyBoxList > li.line1 > a{padding-top: 25px;}
.throphyBoxWrap .throphyBoxList > li.line2 > a{padding-top: 50px;}
.throphyBoxWrap .throphyBoxList > li.line3 > a{padding-top: 55px;}
.throphyBoxWrap .throphyBoxList > li.line4 > a{padding-top: 35px;}
.throphyBoxWrap .throphyBoxList > li.line5 > p{padding-top: 26px; font-size: 24px; color: #111111;}
.throphyBoxWrap .throphyBoxList > li.line5 > p img{margin-top: -4px; vertical-align: middle;}
.throphyBoxWrap .throphyBoxList > li.line6 > p{padding-top: 13px; font-size: 30px; color: #ffffff; font-weight: 500;}
.throphyBoxWrap .throphyBoxList > li .throphyBoxDetail{position: absolute; right: 35px; top: 175px; width: 380px; padding: 60px 60px 40px; visibility: hidden; border: 1px solid #cccccc; text-align: left; transform: scale(0.8); opacity: 0; transition: .5s; box-sizing: border-box;}
.throphyBoxWrap .throphyBoxList > li.on .throphyBoxDetail{visibility: visible;}
.throphyBoxWrap .throphyBoxList > li.on a + .throphyBoxDetail{transform: scale(1); opacity: 1;}
.throphyBoxDetail dl{padding-bottom: 30px; margin-bottom: 40px; border-bottom: 1px solid #cccccc;}
.throphyBoxDetail dl dt{margin-bottom: 20px; font-size: 30px; font-weight: 700; color: #9a895d;}
.throphyBoxDetail dl dd{font-size: 20px; line-height: 30px; color: #333333;}
.throphyBoxDetail em.en{color: #111111;}
.throphyBoxDetail em{font-weight: 700; color: #666666;}
.throphyBoxDetail .dotList li{position: relative; margin-top: 8px; padding-left: 10px; line-height: 30px;}
.throphyBoxDetail .dotList li:before{content: ""; position: absolute; top: 12px; left: 0; width: 4px; height: 4px; background: #3a6261;}
.throphyBoxDetail .dotList li .txt{margin-top: 0;}
.throphyBoxDetail .txt{margin-top: 10px; line-height: 30px; color: #666666}
.throphyBoxDetail .txt span{font-weight: bold; color: #21847c;}

.visionTitWrap{width: 1280px; margin: auto; margin-top: 120px;}
.visionTitWrap > h4{margin-bottom: 20px; font-size: 30px; line-height: 40px; color: #111111;}
.visionTitWrap > p{margin-bottom: 50px; line-height: 30px; color: #666666;}

.businessGoalList{overflow: hidden;}
.businessGoalList > li{float: left; width: 50%; height: 352px; border-top: 1px solid #ffffff; box-sizing: border-box;}
.businessGoalList > li:nth-child(even){border-left: 1px solid #ffffff;}
.businessGoalList > li.list01{background: url(../../../images/group/ko/goal_list_bg01.jpg) no-repeat 0 0;background-size:cover;}
.businessGoalList > li.list02{background: url(../../../images/group/ko/goal_list_bg02.jpg) no-repeat 0 0;background-size:cover;}
.businessGoalList > li.list03{background: url(../../../images/group/ko/goal_list_bg03.jpg) no-repeat 0 0;background-size:cover;}
.businessGoalList > li.list04{background: url(../../../images/group/ko/goal_list_bg04.jpg) no-repeat 0 0;background-size:cover;}
.businessGoalList > li .listInner{float: left; width: 330px; padding-left: 220px; color: #ffffff;}
.businessGoalList > li:nth-child(odd) .listInner{float: right; padding-right: 220px; padding-left: 0;}
.businessGoalList > li .listInner .goalTit{position: relative; margin-bottom: 35px; margin-top: 70px; padding-bottom: 35px; text-align: center;}
.businessGoalList > li .listInner .goalTit:after{content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; opacity: .5; background: #ffffff;}
.businessGoalList > li .listInner .goalTit dt{margin-bottom: 15px; font-size: 40px; font-weight: 700;}
.businessGoalList > li .listInner .goalTit dd{font-size: 19px;}
.businessGoalList > li .listInner .goalTxtList li{position: relative; margin-bottom: 10px; padding-left: 12px; font-size: 15px;}
.businessGoalList > li .listInner .goalTxtList li:before{content: ""; position: absolute; left: 0; top: 12px; width: 4px; height: 4px; background: #ffffff;}

.visionCont{width: 1280px; margin: auto;}
.businessDirectWrap{padding: 80px 0; background: #f8f8f8;}
.businessDirectWrap .businessDirectList{text-align: center; background: url(../../../images/group/ko/business_direct_bg.png) no-repeat center 0; font-size: 0;}
.businessDirectWrap .businessDirectList > li{position: relative; display: inline-block; width: 295px; padding: 100px 0 110px;}
.businessDirectWrap .businessDirectList > li > p{color: #ffffff;}
.businessDirectWrap .businessDirectList > li > p.en{margin-bottom: 10px; font-size: 34px; font-weight: 700;}
.businessDirectWrap .businessDirectList .directInnerList{position: absolute; top: -3px; left: 100%; width: 220px; padding-left: 25px; text-align: left;}
.businessDirectWrap .businessDirectList > li:first-child .directInnerList{left: auto; right: 100%; padding-left: 0; padding-right: 25px; text-align: right;}
.businessDirectWrap .businessDirectList .directInnerList li{position: relative; margin-top: 70px;}
.businessDirectWrap .businessDirectList .directInnerList li:before{content: ""; position: absolute; top: 5px; left: -40px; width: 7px; height: 7px; background: #21847c; border-radius: 7px;}
.businessDirectWrap .businessDirectList > li:first-child .directInnerList li:before{left: auto; right: -40px;}
.businessDirectWrap .businessDirectList .directInnerList li dl dt{margin-bottom: 10px; font-size: 19px; font-weight: 700; color: #21847c;}
.businessDirectWrap .businessDirectList .directInnerList li dl dd{font-size: 19px; color: #333333; line-height: 30px;}

.valuePracticeList{overflow: hidden;}
.valuePracticeList > li{float: left; width: 312px; height: 600px; margin-left: 10px; padding: 55px 40px; border: 1px solid #cccccc; /*transform: translateY(100px); opacity: 0; transition: .5s;*/ box-sizing: border-box;}
/*.valuePracticeList.scroll_ON > li{transform: translateY(0); opacity: 1;}*/
.valuePracticeList > li:first-child{margin-left: 0;}
.valuePracticeList > li:before{content: ""; display: block; height: 82px; padding-bottom: 60px;}
/*.valuePracticeList > li.list02{transition-delay: 0.3s;}
.valuePracticeList > li.list03{transition-delay: 0.6s;}
.valuePracticeList > li.list04{transition-delay: 0.9s;}*/
.valuePracticeList > li.list01:before{background: url(../../../images/group/ko/value_practice_ico01.png) no-repeat 0 0;}
.valuePracticeList > li.list02:before{background: url(../../../images/group/ko/value_practice_ico02.png) no-repeat 0 0;}
.valuePracticeList > li.list03:before{background: url(../../../images/group/ko/value_practice_ico03.png) no-repeat 0 0;}
.valuePracticeList > li.list04:before{background: url(../../../images/group/ko/value_practice_ico04.png) no-repeat 0 0;}
.valuePracticeList > li p{font-size: 30px;}
.valuePracticeList > li p.en{margin-bottom: 25px; color: #111111; font-weight: 700;}

.valuePracticeList > li ul li{position: relative; padding-left: 10px; line-height: 30px; color: #666666;}
.valuePracticeList > li ul li:before{content: ""; position: absolute; left: 0; top: 14px; width: 4px; height: 4px; margin-top: -2px; background: #3a6261;}

/* 2021-11-30 추가 : S */
.valuePracticeList > li.type2 {width:635px; height:307px; margin-left:0;  margin-top:10px; padding:50px 10px; font-size:0; }
.valuePracticeList > li.type2:nth-of-type(2n) {margin-left:10px; }
.valuePracticeList > li.type2:before {display: none;}
.valuePracticeList > li.type2 .left_tit {display:inline-block; vertical-align:middle; width:50%; border-right:1px solid #ccc; text-align:center; box-sizing: border-box;}
.valuePracticeList > li.type2 .left_tit:before {content: ""; display: block; height: 82px; margin-bottom:30px; }
.valuePracticeList > li.type2.list05 .left_tit:before {background: url(../../../images/group/ko/value_practice_ico05.png) no-repeat center center;}
.valuePracticeList > li.type2.list06 .left_tit:before {background: url(../../../images/group/ko/value_practice_ico06.png) no-repeat center center;}
.valuePracticeList > li.type2 p {font-size:30px; }
.valuePracticeList > li.type2 p.en {margin-bottom: 25px; color: #111111; font-weight: 700;}
.valuePracticeList > li.type2 ul {display:inline-block; vertical-align:middle; width:50%; padding-left:30px; box-sizing:border-box;  }
.valuePracticeList > li.type2 ul li {position: relative; padding-left: 10px; line-height: 30px; color: #666666; font-size:18px; word-break:keep-all; }
/* 2021-11-30 추가 : E */

.visionCenterTxt{padding: 140px 0 100px; text-align: center;}
.visionCenterTxt p{font-size: 50px; line-height: 70px; color: #111111; transform: translateY(100px); opacity: 0; transition: .5s;}
.visionCenterTxt span{display: block; margin-top: 30px; font-size: 19px; line-height: 30px; transform: translateY(100px); opacity: 0; transition: .5s .4s;}
.visionCenterTxt.scroll_ON p{transform: translateY(0); opacity: 1;}
.visionCenterTxt.scroll_ON span{transform: translateY(0); opacity: 1;}

.portfolioWrap .bgBox{padding: 90px 0 75px; background: #f8f8f8;}
.portfolioWrap .bgBox > ul{text-align: center; background: url(../../../images/group/ko/portfolio_wrap_bg2.png) no-repeat center 0; font-size: 0;}
.portfolioWrap .bgBox > ul > li{display: inline-block; width: 270px;}
.portfolioWrap .bgBox > ul > li > p{height: 310px; margin-bottom: 30px; padding-top: 123px; font-size: 30px; font-weight: 700; line-height: 40px; color: #30323a; box-sizing: border-box;}
.portfolioWrap .bgBox > ul > li.last{width: 300px; margin-left: 120px;}
.portfolioWrap .bgBox > ul > li.last > p{padding-top: 140px; color: #ffffff;}
.portfolioWrap .bgBox > ul > li ul{margin: 0 -20px;}
.portfolioWrap .bgBox > ul > li ul li{font-size: 19px; line-height: 30px; color: #111111;}
.portfolioWrap .bgBox > ul > li ul li:before{content: ""; display: inline-block; width: 4px; height: 4px; margin-right: 7px; margin-top: -3px; background: #3a6261; vertical-align: middle;}

.portfolioWrap .bdBox{margin-top: 60px; padding: 80px 0 76px; border: 1px solid #cccccc; text-align: center;}
.portfolioWrap .bdBox .bdTxt {margin-top: 33px; padding:0 40px 0 78px; text-align: left; overflow: hidden;}
.portfolioWrap .bdBox .bdTxt > li {float: left;}
.portfolioWrap .bdBox .bdTxt > li:last-child {float: right;}
.portfolioWrap .bdBox .bdtSub {float: left;}
.portfolioWrap .bdBox .bdtSub > li {display: flex; height: 24px;}
.portfolioWrap .bdBox .bdtSub p {width: 82px; font-size: 15px; font-weight: 700; color: #333;}
.portfolioWrap .bdBox .bdtSub span {font-size: 15px; color: #666; letter-spacing: -0.05em;}

/* 연혁 */

section.gi_history     {padding:0; }

.historyContent     {position:relative; padding-bottom:200px; }
.historyContent .visual     {position:absolute; top:0; width:1110px; height:calc(100vh - 60px);  margin-left:-320px; color:#fff  }
.historyContent .visual .hisInfoTit{position:absolute;bottom:58vh;right:0;}
.historyContent .visual h3    {width:790px; margin-top: 51px; font-family: 'Zilla Slab', serif; letter-spacing:0;  font-size:100px; }
.historyContent .visual .hisInfoTit > p     {width:790px; font-size:30px;  }
.historyContent .visual span     {display: block;width:790px; margin-top:30px; font-size:28px; font-weight: 700; line-height: 80px; color: #d2c297; letter-spacing: 0;}
.historyContent .visual .bg {position:absolute; bottom:0; left:0; width:1110px; height:0; overflow:hidden; transition: height 1s; }
.historyContent .visual .bg .img {position:absolute; bottom:0; left:0; width:1110px; height:100%;  }
.historyContent .history_ON .visual .bg     {z-index:1; height:100%;  }
.historyContent .begining .visual  .bg     {z-index:1; height:100%; }
.scroll_ON .historyContent .visual     {position:fixed; top:60px;  }
.scroll_ON .historyContent.stay2_ON_end .visual     {position:absolute; top:auto; bottom:0;   }
.scroll_UP .scroll_ON + .scroll_ON .historyContent.stay2_ON_end  .visual {position:absolute; top:auto; bottom:0; transform: translateY(0);  }

.historyContent .his_01 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_1.png) no-repeat 0 0;}
.historyContent .his_02 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_1_1.png) no-repeat 0 0;}
.historyContent .his_03 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_2.png) no-repeat 0 0;}
.historyContent .his_04 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_2_1.png) no-repeat 0 0;}
.historyContent .his_05 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_3.png) no-repeat 0 0;}
.historyContent .his_06 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_3_1.png) no-repeat 0 0;}
.historyContent .his_07 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_3_2.png) no-repeat 0 0;}
.historyContent .his_08 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_3_3.png) no-repeat 0 0;}
.historyContent .his_09 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_3_4.png) no-repeat 0 0;}
.historyContent .his_10 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_4.png) no-repeat 0 0;}
.historyContent .his_11 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_4_1.png) no-repeat 0 0;}
.historyContent .his_12 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_4_2.png) no-repeat 0 0;}
.historyContent .his_13 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_4_3.png) no-repeat 0 0;}
.historyContent .his_14 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_4_4.png) no-repeat 0 0;}
.historyContent .his_15 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_5.png) no-repeat 0 0;}
.historyContent .his_16 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_5_1.png) no-repeat 0 0;}
.historyContent .his_17 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_5_2.png) no-repeat 0 0;}
.historyContent .his_18 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_5_3.png) no-repeat 0 0;}
.historyContent .his_19 .visual .bg .img{background: url(../../../images/group/ko/gi_02_img_5_4.png) no-repeat 0 0;}
.historyContent dl     {padding-left:860px;  }
.historyContent dl dt  {padding-top:143px; color:#21847c; font-size:36px; font-weight:700; padding-bottom:13px;  }
.historyContent dl dd  {padding-top:37px; }
.historyContent dl dd span  {letter-spacing: -0.025em;  }
.historyContent dl dd em    {margin-top:3px; display:block; letter-spacing: -0.025em;   }
.historyContent dl dd strong{font-size:24px; display:block; margin-top:0; font-weight: 700; color:#111; letter-spacing: -0.025em; }
.historyContent dl dd strong > span, .historyContent dl dd p > span {vertical-align: top; font-size:15px; font-weight: 400; color:#666; letter-spacing: -0.025em; }
.historyContent dl dd p{font-size:20px; color:#111; margin-top:5px; letter-spacing: -0.025em; }
.scroll_ON .historyContent .historyTab {position:fixed; top:50%; left:50%; margin-left:-640px; transform: translateY(7.1%);}
.scroll_ON .historyContent .historyTab.displayDown {position:fixed; top:auto; bottom:0;}
.scroll_ON .historyContent .historyBook {position:fixed; bottom:50%; transform: translateY(1140%);}
.scroll_ON .historyContent .historyBook.displayDown {position:fixed; bottom:50px; transform:inherit;}
.scroll_ON .historyContent.stay2_ON_end .historyTab   ,
.scroll_UP .scroll_ON + .scroll_ON .historyContent.stay2_ON_end  .historyTab {position:absolute; top:auto; bottom:0; left:0; margin:0; }
.scroll_ON .historyContent.stay2_ON_end .historyBook,
.scroll_UP .scroll_ON + .scroll_ON .historyContent.stay2_ON_end .historyBook { position:absolute; top:auto; }
.historyContent ul.historyTab {position:absolute; top:631px; width:200px; padding:26px 0 0 32px;  background:#21847c; height:369px; z-index:10; box-sizing: border-box;  }
.historyContent ul.historyTab li    {height:43px; position:relative }
.historyContent ul.historyTab li a {display:block; font-size:19px; color:#fff; font-family: 'Zilla Slab', serif; letter-spacing:0; transition: .4s; }
.historyContent ul.historyTab li:before {content:''; width:0px;  height:2px; background:#fff; position:absolute; right:94%; top:15px; transition: .4s;transform: translateX(-10px); }

.historyContent ul.historyTab li.on a {transform: translateX(24px); }

.historyContent ul.historyTab li.on:before {width:56px; transform: translateX(0); }

.historyContent .historyBook {position: absolute; bottom: 49px; left: 50%; margin-left: -320px; font-size: 19px; font-weight: 700; color: #fff; overflow: hidden; z-index: 10; overflow: hidden; }
.historyContent .historyBook > p {float: left; padding-right: 17px; position: relative;}
.historyContent .historyBook > p::after {position: absolute; top: 11px; right: 0; display: block; content:""; width: 1px; height: 10px; background: #fff;}
.historyContent .historyBook > li, .historyContent .visual ul > p {float: left;}
.historyContent .historyBook > li { position: relative; padding: 0 11px 0 16px;}
.historyContent .historyBook > li:nth-child(3) { padding: 0;}
.historyContent .historyBook > li::after { position: absolute; display: block; content: ""; bottom: 0; left: 16px; width: 88.8px; height: 1px; background: #fff; opacity: 0; }
.historyContent .historyBook > li:nth-child(3)::after { display: none; }
.historyContent .historyBook a {position: relative; display: block; vertical-align: top; font-weight: 400; color: #fff;}
.historyContent .historyBook a:hover { text-decoration: none; }
.historyContent .historyBook > li a:hover::after { position: absolute; display: block; content: ""; bottom: 0; left: 0; width: 100%; height: 1px; background: #fff;}


/* 지배구조 */
.governance h4  {margin-top:140px; height:75px; font-size:30px; color:#111;}
.governance .esgTitles h4{height: auto; margin-bottom: 20px;}
.governance ol.goverList .dep_1  {color:#111; font-size:24px; font-weight: 700;}
.governance ol.goverList .dep_1 em  {position:absolute; left:-110px; margin-top:-20px; font-size:80px; color:#d2c297; font-weight: 700; line-height:100%; font-family: 'Zilla Slab', serif; letter-spacing:0;    }
.governance ol.goverList.director .dep_1 em  {color:#537a7c; }
.governance ol.goverList .dep_2  {color:#111; font-size:19px; color:#666; line-height:30px; }
.governance ol.goverList > li  {position:relative; padding:40px 0; margin-left:110px; min-height:160px; box-sizing: border-box;  }
.governance ol.goverList > li + li  { border-top:1px solid #7a7a7a; }
.governance ol.goverList > li > ol  {margin-top:20px; }
.governance ol.goverList > li > ol > li {padding-left:30px;}
.governance ol.goverList > li > ol > li > ol  {background:#f7f7f7; padding:25px 30px; margin-top:20px; margin-bottom:20px;  }
.governance ol.goverList > li > ol > li > ol > li {line-height: 30px;}
.governance ul.friendlyPolicy_img {margin-top:10px; display: flex; justify-content: space-between; margin-top:80px; }
.governance ul.friendlyPolicy_img li        {width:420px; padding-top:360px; text-align: center; color:#111; font-size:24px; font-weight: 700; }
.governance ul.friendlyPolicy_img li.img_1 {background: url(../../../images/group/ko/esg_09_img_1.jpg) no-repeat 0 0;}
.governance ul.friendlyPolicy_img li.img_2 {background: url(../../../images/group/ko/esg_09_img_2.jpg) no-repeat 0 0}
.governance ul.friendlyPolicy_img li.img_3 {background: url(../../../images/group/ko/esg_09_img_3.jpg) no-repeat 0 0}

/* 사회공헌 */
.governance .donate     {position:relative}
.governance .donate .visual     {position:absolute; top:0; right:50%; margin-right:130px; width:830px; height:1000px; text-align: right; background: url(../../../images/group/ko/esg08_top_bg.jpg) no-repeat 0 0;  }
.governance .donate .visual:after{content: ""; display: inline-block; height: 100%; vertical-align: middle;}
.governance .donate .visual div  {display: inline-block; margin-left:auto; color:#fff; width:510px; text-align: left; vertical-align: middle;}
.governance .donate .visual div em  {font-size:40px; line-height: 55px; }
.governance .donate .visual div p  {margin-top:30px; width:390px; line-height:30px;  }
.governance .donate .visual div > dl {margin-top: 30px; overflow: hidden;}
.governance .donate .visual div > dl dt, .governance .donate .visual div > dl dd { float: left; }
.governance .donate .visual div > dl dt {position: relative; display: block; margin-top: 0; padding-right: 17px; width: auto; font-weight: 700; }
.governance .donate .visual div > dl dt::after {position: absolute; display: block; content: ""; top: 11px; right: 0; width: 1px; height: 10px; background: #fff;}
.governance .donate .visual div dd {position: relative;}
.governance .donate .visual div dd::after {position: relative; content: ""; display: block; bottom: 0; left: 17px; width:98px; height: 1px; background: #fff; opacity: 0; }
.governance .donate .visual div dd:hover::after {opacity: 1;}
.governance .donate .visual div > dl a { position: relative; padding: 0 17px; color: #fff; text-decoration: none;}
.governance .donate.stay2_ON .visual     {position:fixed; top:60px; }
.governance .donate .donateList {display:flex; margin-left:620px; width:740px; padding-top: 80px; justify-content: space-between; }
.governance .donate .donateList ul{width:320px;  }
.governance .donate .donateList ul li{padding-bottom:75px; text-align: center;}
.governance .donate .donateList ul li img{display:block; margin-bottom:25px; }

.scroll_ON .donate.stay2_ON_end .visual     {position:absolute; top:auto; bottom:0;   }
.scroll_UP .scroll_ON + .scroll_ON .donate.stay2_ON_end  .visual {position:absolute; top:auto; bottom:0; transform: translateY(0);  }

.esgGovernance .governance .esgTitle    {padding:140px 0 0; margin-bottom:55px;  }

.governance .business {display:flex; margin-top: 50px; flex-wrap: wrap; justify-content: space-between;}
.governance .business dl {width:420px; height:320px; border:1px solid #ccc; margin-bottom:10px; box-sizing: border-box; padding:50px 39px;}
.governance .business dl:nth-child(-n+3) {height:286px; }
.governance .business dl dt {color:#111; font-size:30px; font-weight: 700; height:65px; }
.governance .business dl dd {padding:25px 0 0; border-top:1px solid #ccc; line-height:30px; letter-spacing: -0.025em; }

.governance .donationList{margin-top: 50px; background: #f8f8f8;}
.governance .donationList ul{overflow: hidden; padding: 70px 65px;}
.governance .donationList ul li{float: left; width: 50%; text-align: center; border-left: 1px solid #cccccc; box-sizing: border-box;}
.governance .donationList ul li:first-child{border-left: 0;}
.governance .donationList ul li dl dt{margin-bottom: 20px; font-size: 19px; line-height: 29px; color: #333333;}
.governance .donationList ul li dl dd{font-size: 40px; color: #333333; line-height: 70px;}
.governance .donationList ul li dl dd em{font-weight: 700; font-size: 70px; color: #21847c;}
.governance .donationImg{margin-top: 50px;}
.governance .donationImg img{width: 100%;}

.governance .ethContents .esgTitles h4 .titIn{font-size: 19px; color: #111111;}

.foundationWrap{position: relative; margin-top: 150px; background: #ffffff; z-index: 19;}

.foundationBg{height: 678px; background: url(../../../images/group/ko/foundation_bg.jpg) no-repeat center / cover}
.governance .squadTabCont .business{width: 1280px; margin: 80px auto auto;}
.governance .squadTabCont .business dl{height: 390px;}
.governance .squadTabCont .business dl:nth-child(-n+3){height: 390px;}
.governance .squadTabCont .business .first{padding-left: 0; padding-top: 90px; border: 0;}
.governance .squadTabCont .business .first dt{height: auto; font-size: 40px; font-weight: 400; color: #333333;}
.governance .squadTabCont .business .first dd{padding-top: 30px; border-top: 0; color: #333333;}
.governance .squadTabCont .business .first dd em{font-weight: 700;}

.governance .squadTab               {margin-bottom:75px; text-align: center; }
.governance .squadTab ul            {display:inline-block; overflow: hidden;}
.governance .squadTab ul li         {float:left; }
.governance .squadTab ul li a       {display:block; width:220px; height:56px; line-height:55px;  border:1px solid #eee; box-sizing: border-box; text-decoration: none; }
.governance .squadTab ul li a.on    {border:0; background:#21847c; color:#fff;  }

.governance .squad .memberList       {height:850px; }
.governance .squad .memberList ul.mem_slide       {display:flex; flex-wrap: nowrap; transition: transform .6s; }
.governance .squad .memberList ul.mem_slide.end     {transform: translateX(-100%);}
.governance .squad .memberList ul.mem_slide li.items    {margin-left:80px; position:relative}
.governance .squad .memberList ul.mem_slide li.items:nth-child(even)    {margin-top:100px; }
.governance .squad .memberList ul.mem_slide li.items:first-child  {margin-left:0;}
.governance .squad .memberList ul.mem_slide .member img { }
.governance .squad .memberList ul.mem_slide .member strong {display:block; padding:40px 0 0; height:55px; font-size:30px; color:#111; font-weight: 400; }
.governance .squad .memberList ul.mem_slide .member ul  { }
.governance .squad .memberList ul.mem_slide .member ul li {position:relative; padding-left:10px; height:25px;  }
.governance .squad .memberList ul.mem_slide .member ul li:before {content:''; position:absolute; left:0; top:13px; width:4px; height:4px; background:#3a6261;  }
/* 2022-09-01 접근성 [S] */
.governance .squad .memberList ul.mem_slide li:hover .layer{opacity:1; }
.governance .squad .memberList ul.mem_slide li.on .layer{opacity: 1; } 
.governance .squad .memberList ul.mem_slide li:focus .layer{opacity:1;}
.governance .squad .memberList ul.mem_slide .layer{position:absolute; opacity: 0; width:100%; height:480px; left:0; top:0; box-sizing: border-box; overflow-y: auto; transition: opacity .4s }
/* 2022-09-01 접근성 [E] */
.governance .squad .memberList ul.mem_slide .layer .bgCont{position:relative; padding-top:80px;}
.governance .squad .memberList ul.mem_slide .layer .bgCont:before  {position:absolute; content:''; width:100%; min-height:480px; left:0; top:0;  bottom:0; background:#27454e scroll; opacity:.8;   }
.governance .squad .memberList ul.mem_slide .layer strong  {position:relative; display:block; margin:0 40px;  color:#fff; font-size:15px; font-weight: 700; letter-spacing: 0; }
.governance .squad .memberList ul.mem_slide .layer ul +  strong  {border-top:1px solid rgba(255, 255, 255, .4); padding-top:25px  }
.governance .squad .memberList ul.mem_slide .layer ul      {position:relative; margin:0 40px; padding:15px 0 25px; color:#fff; font-size:15px; }
.governance .squad .memberList ul.mem_slide .layer ul li   {position:relative; padding-left:10px; }
.governance .squad .memberList ul.mem_slide .layer ul li:before   {content:''; width:4px; height:4px; position:absolute; left:0; top:8px; background:#fff; }
.governance .squad .memberList ul.mem_slide .layer ul li   {line-height:25px;}
.governance .squad .controlbox       {overflow: hidden; padding:70px 0 0;}
.governance .squad .controlbox .bar       {width:90%; float:left; position:relative; height:5px; border-bottom:2px solid #eee; margin-top:13px;  }
.governance .squad .controlbox .bar .line {width:50%; display:block; height:5px; margin-top:2px; background:#21847c; transition: width .6s; }
.governance .squad .controlbox .pager     {float:right; }
.governance .squad .end + .controlbox .bar .line   {width:100%;}
.governance .squad .controlbox .pager button     {overflow: hidden; width:11px; height:17px; background:url(../../../images/group/ko/esg08_paging_l.jpg); text-indent: -2000px;; }
.governance .squad .controlbox .pager button.prev     { background:url(../../../images/group/ko/esg08_paging_l.jpg); }
.governance .squad .controlbox .pager button.next     { background:url(../../../images/group/ko/esg08_paging_r.jpg); }
.governance .squad .controlbox .pager span     {display:inline-block; vertical-align: middle; padding:0 20px;}


.awards.list1{width: 1280px; margin: auto}
.awards .visual                 {position:absolute; width:590px; right:50%; top:60px; margin-right:108px; padding:40px 0 0; }
.awards .visual strong          {display:block; font-size:40px; color:#21847c; padding:80px 0 0;  }
.awards .visual span            {display:block; font-size:19px; color:#111; margin-top:28px; letter-spacing: -0.05em;  }
.awards .visual img            {margin-top:35px; }
.awards .foundation .visual img            {margin-top:200px; }
.awards .stay2_ON .visual           {position:fixed;  }
.awards .stay2_ON_end .visual        {position:absolute; top:auto; bottom:0;  }
.awards .awardsList dl dt              {position: relative; padding:80px 0 0; color:#21847c; font-size:40px; font-weight: 700}
.awards .awardsList dl dt:before{content: ""; position: absolute; top: 87px; left: -148px; width: 20px; height: 20px; background:url(../../../images/group/ko/awards_list_dot.png) no-repeat; z-index: 1;}
.awards .awardsList dl dt:after{content: ""; position: absolute; top: 95px; left: -148px; width: 90px; height: 2px; background: #bcdad7;}
.awards .domestic .awardsList dl dt:before{right: -131px; left: auto;}
.awards .domestic .awardsList dl dt:after{right: -120px; left: auto;}
.awards .awardsList dl:nth-child(n + 3) dt:after{background: #f6f6f6;}
.awards .awardsList dl dd              {font-size:15px; color:#111; margin-top:15px; }
.awards .awardsList dl dd ul li        {position:relative; padding:0 0 0 10px; line-height:25px; font-size:15px;   }
.awards .awardsList dl dd ul li:before {content:''; position:absolute; width:4px; height:4px; background:#3a6261; left:0; top:10px;}
.awards .international          {position:relative;  }
.awards .international .visual  {text-align: right;}
.awards .international .awardsList  {position: relative; margin-left:660px; padding-left:140px;}
.awards .international .awardsList .awardsProgress .bg{content: ""; position: absolute; left: 0; top: 95px; width: 3px; height: 850px; background: #f6f6f6;}
.awards .international .awardsList .awardsProgress .move{content: ""; position: absolute; left: 0; top: 95px; width: 3px; max-height: 850px; height: 0; background: #21847c;}
.awards .domestic       {position:relative;  margin-top:100px; }
.awards .domestic .visual   {text-align: left; left:50%; right:auto; top:60px; margin-left:108px; }
.awards .domestic.stay2_ON_end .visual  {top:auto; bottom:0;  }
.awards .domestic .awardsList  {position: relative; padding-right:122px; text-align: right; width:540px; }
.awards .domestic .awardsList .awardsProgress .bg{content: ""; position: absolute; right: 0; top: 95px; width: 3px; height: 1675px; background: #f6f6f6;}
.awards .domestic .awardsList .awardsProgress .move{content: ""; position: absolute; right: 0; top: 95px; width: 3px; max-height: 1675px; height: 0; background: #21847c;}
.awards .domestic .awardsList dl dd ul li        {padding:0 10px 0 0 ; }
.awards .domestic .awardsList dl dd ul li:before {left:auto; right:0;  }
.awards .foundation          {position:relative;  }
.awards .foundation .visual  {text-align: right;}
.awards .foundation .awardsList  {position: relative; margin-left:660px; padding-left:140px;}
.awards .foundation .awardsList .awardsProgress .bg{content: ""; position: absolute; left: 0; top: 95px; width: 3px; height: 2025px; background: #f6f6f6;}
.awards .foundation .awardsList .awardsProgress .move{content: ""; position: absolute; left: 0; top: 95px; width: 3px; max-height: 2025px; height: 0; background: #21847c;}


/*********************************************************************************************************************************/

/* 윤리경영신고센터 */
.ethContents.ETH{margin-top:215px;}
/*
.reportTop .reportFormBox{overflow:hidden;}
.reportTop .reportFormBox .txt{float:left; padding-left: 15px; font-size:30px; line-height: 42px; letter-spacing: -0.025em; color:#000000;}
.reportTop .reportFormBox .txt span{font-size:48px; color:#21847c;}
.reportTop .reportFormBox form{float:right; margin-top: -11px; border-bottom:2px solid #333333;}
.reportTop .reportFormBox form > input{width:243px; height:52px; padding:20px; font-size: 15PX; border:0;}
.reportTop .reportFormBox form > button{width:52px; height:52px; font-size:0; background: url("../../../images/group/ko/search_btn_ico.png") no-repeat center center;}
*/

.reportBox .reportBoardTbl{width:100%; margin-top:45px; border-top:2px solid #111111; border-bottom:2px solid #111111;}
.reportBox .reportBoardTbl .alLeft{text-align:left;}
.reportBox .reportBoardTbl thead th{padding:22px 26px; background:#f6f6f6; line-height: 26px; font-weight: normal; color: #333333; text-align:center;}
.reportBox .reportBoardTbl tbody td{padding:16px 25px; border-top: 0.5px dashed #111111;}
.reportBox .reportBoardTbl tbody .topLine td{border-top:2px solid #111111;}
.reportBox .reportBoardTbl tbody tr:first-child td{border-top:0;}
.reportBox .reportBoardTbl tbody td a{display:inline-block; width:740px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; vertical-align: middle;}
.reportBox .reportBoardTbl tbody td.file{position: relative;}
.reportBox .reportBoardTbl tbody td.file:before{content: ""; position: absolute; top: 50%; left: 10px; width:7px; height:15px; margin-top: -7px; font-size:0; background: url("../../../images/group/ko/board_file_ico.png") no-repeat center center;}
.reportBox .reportBoardTbl tbody td > span{color: #333333;}
.reportBox .reportBoardTbl tbody td > span:after{display:inline-block; width: 11px; height: 7px; margin-top: -3px; margin-left: 15px; line-height: 20px; vertical-align: middle;}
.reportBox .reportBoardTbl tbody td > span.prev:after{content: ""; background: url("../../../images/group/ko/board_detail_prev.png") no-repeat center center;}
.reportBox .reportBoardTbl tbody td > span.next:after{content: ""; background: url("../../../images/group/ko/board_detail_next.png") no-repeat center center;}

.boardPagingBtn{margin-top:70px; text-align: center;}
.boardPagingBtn .pagingList{display: inline-block; overflow: hidden; padding-bottom: 6px;}
.boardPagingBtn .pagingList li{float: left; margin:0 7px;}
.boardPagingBtn .pagingList li a{display:inline-block; width: 20px; height: 20px; line-height: 20px; vertical-align: middle; font-size: 16px;}
.boardPagingBtn .pagingList li a.prev{font-size: 0; background: url("../../../images/group/ko/board_paging_prev.png") no-repeat center center;}
.boardPagingBtn .pagingList li a.next{font-size: 0; background: url("../../../images/group/ko/board_paging_next.png") no-repeat center center;}
.boardPagingBtn .pagingList li a.on{position:relative; color: #21847c;}
.boardPagingBtn .pagingList li a.on:after{content:""; position:absolute; bottom: -6px; left: 50%; width: 8px; height: 2px; margin-left: -4px; background: #21847c;}

.reportQna{text-align: left;}
.reportQna dl{margin-bottom: 40px; padding: 10px 0; line-height: 27px;}
.reportQna .title {font-size:20px; font-weight : bold;  border-bottom:3px solid #eeeeee;  padding-bottom: 15px;}
.reportQna dl dt{margin-bottom: 35px; color: #333333;}
.reportQna dl.qnaFile{margin-bottom: 0; padding-top: 30px; overflow: hidden;}
.reportQna dl.qnaFile dt{position: relative; float: left; margin-bottom: 0; padding-left: 20px;}
.reportQna dl.qnaFile dt:before{content: ""; position: absolute; top: 50%; left: 0; width:7px; height:15px; margin-top: -7px; font-size:0; background: url("../../../images/group/ko/board_file_ico.png") no-repeat center center;}
.reportQna dl.qnaFile dd{position: relative; float: left; margin-left: 20px; padding-left: 20px; font-size: 0;}
.reportQna dl.qnaFile dd:before{content: ""; position: absolute; top: 50%; left: 0; width: 1px; height: 10px; margin-top: -5px; background: #e5e5e5;}
.reportQna dl.qnaFile dd a{width: auto; font-size: 15px; vertical-align: middle;}

.reportListBtn{margin-top: 60px; text-align: center;}

/* 소비자보호 */
.esgTitWrap{margin-bottom: 50px;}
.esgTitWrap > h4{font-size: 30px; line-height: 40px; font-weight: 700; color: #111111;}
.esgTitWrap > h4 span{font-size: 24px; line-height: 40px; font-weight: 400; color: #666666;}

.esgCustomerOpinion{margin-bottom: 140px; margin-top: 60px; padding-top: 210px; text-align: center;}
.esgCustomerOpinion .img{margin-top: -210px;}
.esgCustomerOpinion dl{margin-top: -220px; padding-top: 300px; padding-bottom: 70px; letter-spacing: -0.05em; background: #f8f8f8}
.esgCustomerOpinion dl dt{margin-bottom: 15px; font-size: 30px; line-height: 40px; color: #111111;}
.esgCustomerOpinion dl dd{line-height: 30px; color: #666666;}

.esgCertifyList{overflow: hidden; margin-top: 50px;}
.esgCertifyList > li{float: left; width: calc((100% - 20px) / 3); height: 690px; margin-left: 10px; padding: 70px 50px 50px; border: 1px solid #cccccc; box-sizing: border-box;}
.esgCertifyList > li:first-child{margin-left: 0;}
.esgCertifyList > li[class^="list"]{height: 705px;}
.esgCertifyList > li dl{letter-spacing: -0.02em;}
.esgCertifyList > li[class^="list"] dl dt:before{content: ""; display: block; height: 84px; margin-bottom: 25px;}
.esgCertifyList > li.list01 dl dt{background: url("../../../images/group/ko/esg_certify_ico01.png") no-repeat 0 0;}
.esgCertifyList > li.list02 dl dt{background: url("../../../images/group/ko/esg_certify_ico02.png") no-repeat 0 0;}
.esgCertifyList > li.list03 dl dt{background: url("../../../images/group/ko/esg_certify_ico03.png") no-repeat 0 0;}
.esgCertifyList > li dl dt{margin-right: -20px; font-size: 30px; line-height: 40px; font-weight: 500; color: #111111;}
.esgCertifyList > li dl dt span{font-size: 24px; font-weight: 300; color: #666666}
.esgCertifyList > li dl dd{margin-top: 35px; padding-top: 35px; font-size: 19px; line-height: 30px; letter-spacing: -0.05em; color: #666666; border-top: 1px solid #cccccc;}
.esgCertifyList > li dl dd > span{display: block; padding-left: 9px; text-indent: -9px; font-size: 15px; line-height: 30px; color: #999999;}
.esgCertifyList > li dl dd ul{padding-left: 12px;}
.esgCertifyList > li dl dd ul li{position: relative;}
.esgCertifyList > li dl dd ul li:before{content: ""; position: absolute; top: 13px; left: -12px; width: 4px; height: 4px; background: #3a6261;}
.esgCertifyList > li dl dd .certiMark { margin-top: 27px;}
.esgCertifyList > li dl dd .certiMark img { margin-right: 10px;}
.esgCertifyList > li dl dd .certiMark .confirm3_1 { height:70px; width:70px;}

/*************** esg ***********************/
/* 01_01 */
.esgOperation .scroll_ON > h3,
.esgOperation .scroll_ON > h4,
.esgOperation .scroll_ON > p,
.esgOperation .scroll_ON li,
.esgOperation + .fairActivity div.scroll_ON > h3,
.esgOperation + .fairActivity div.scroll_ON > p {
  opacity: 1;
  transform: translateY(0);
}
.esgTitle.scroll_ON > h3,
.esgTitle.scroll_ON > h4,
.esgTitle.scroll_ON > p {
  opacity: 1;
  transform: translateY(0);
}
.esgTitle {
  text-align: center;
  margin-bottom: 195px;
}
.esgTitle > h3 {
  font-size: 50px;
  font-weight: 400;
  line-height: 50px;
  color: #111;
  margin-bottom: 41px;
  opacity: 0;
  transform: translateY(30%);
  transition: 0.6s;
}
.esgTitle > p {
  font-size: 19px;
  color: #333;
  line-height: 30px;
  letter-spacing: -0.05em;
  opacity: 0;
  transform: translateY(30%);
  transition: 0.8s;
  transition-delay: 0.3s;
}
.esgTitle > p + p {
  transition-delay: 1.4s;
}
.esgTitles > h4 {
  font-size: 30px;
  line-height: 30px;
  color: #111;
  opacity: 0;
  transform: translateY(30%);
  transition: 0.6s;
}
.esgTitles > h4 .titIn {
  font-size: 24px;
  line-height: 40px;
  letter-spacing: -0.05em;
  color: #666666;
  font-weight: 400;
}

.esgTitles > p {
  font-size: 17px;
  line-height: 30px;
  color: #666;
  opacity: 0;
  word-break: keep-all;
  transform: translateY(30%);
  transition: 0.8s;
  transition-delay: 0.3s;
}
.esgOperation .esgTitles > h4 {
  margin: 0 0 23px;
}

.esgOperation .esgCycle { position: relative; width: 1280px; height: 900px; padding: 57px 0; margin: 0 auto; text-align: center; border: 1px solid #ccc; box-sizing: border-box; letter-spacing: -0.05em; background: url("../../../images/group/ko/esg_01_01_cycle.png") no-repeat center center; }
.esgOperation .esgCycle .esgcTxt p {font-size: 24px; font-weight: 700; color: #000;}
.esgOperation .esgCycle .esgcTxt span {font-size: 19px;font-weight: 500; color: #111}
.esgOperation .esgCycle > .ecycleMid {width: 854px; margin: 0 auto; overflow: hidden;}
.esgOperation .esgCycle > .ecycleMid > li {width: 100%; font-size: 28px; font-weight: 700; color: #fff;}
.esgOperation .esgCycle > .ecycleMid li > p {margin: 118px 0 0; }
.esgOperation .esgCycle > .ecycleMid li:last-child > p {margin: 0 0 120px; }
.esgOperation .esgCycle > .ecycleMid .ecycleC {margin: 166px auto; font-size: 40px; color: #000;}
.esgOperation .esgCycle > .ecycleMid li > span {position: absolute; top: 50%; left: 188px; transform: translateY(-50%); font-size: 22px; font-weight: 600; line-height: 35px; color: #111;}
.esgOperation .esgCycle > .ecycleMid li:last-child > span {left: auto; right: 235px;}

.esgOperation .esgGoal {width: 1280px; margin: 60px auto 118px; padding: 150px 0 130px; background: #f6f6f6; letter-spacing: -0.05em;}
.esgOperation .esgGoal .en { margin-bottom: 39px; font-size: 80px; font-weight: 700; line-height: 49px; color: #333;}
.esgOperation .esgGoal .en > span { font-size: 45px; }
.esgOperation .esgGoal dl {width: 780px; height: 320px; margin: 0 220px 0 280px; color: #111; background: url("../../../images/group/ko/esg_01_01_goal1.png") no-repeat center right;}
.esgOperation .esgGoal dl:nth-child(2) {background-image: url("../../../images/group/ko/esg_01_01_goal2.png"); margin: 60px 220px 60px 280px;}
.esgOperation .esgGoal dl:last-child {background-image: url("../../../images/group/ko/esg_01_01_goal3.png");}
.esgOperation .esgGoal dl:nth-child(2) .en, .esgOperation .esgGoal dl:last-child .en {margin-bottom: 24px; padding-top: 10px; line-height: 80px; }
.esgOperation .esgGoal dl strong { font-size: 32px; line-height: 40px; letter-spacing: -0.05em; }
.esgOperation .esgGoal dl p { margin: 23px 0 26px; font-size: 24px; line-height: 35px; }
.esgOperation .esgGoal dl span { font-size: 19px; line-height: 30px;}

/* 2023-05-10 수정 */
.esgOperation .esgPropSystem {width: 1280px;  margin: 118px auto 0; }
.esgOperation .esgPropSystem > .esgPropsbox { margin-top: 60px; text-align: center; }
.esgOperation .esgPropSystem > div > p { position: relative; padding-bottom: 19px; }
.esgOperation .esgPropSystem > div > p::before { position: absolute; display: block; bottom: 0; left: 0; content: ""; width: 100%; height: 270px; background: #f8f8f8; border: 1px solid #ccc; box-sizing: border-box; z-index: -1 }
.esgOperation .esgPropSystem ul { text-align: left; margin: 50px 0 0 235px;}
.esgOperation .esgPropSystem ul > p {  margin-bottom: 11px; font-size: 24px; font-weight: 700; line-height: 40px; color: #111; }
.esgOperation .esgPropSystem ul > li { position: relative; padding-left: 13px; font-size: 19px; line-height: 30px; color: #333; letter-spacing: -0.05em; }
.esgOperation .esgPropSystem ul > li::before { position: absolute; top: 14px; left: 1px; content: ""; display: block; width: 4px; height: 4px; background: #3a6261; }
.esgOperation .esgDirec {width: 1280px; margin: 0 auto;}
.esgOperation .esgDirec > ul {
  margin-top: 55px;
  overflow: hidden;
  text-align: center;
}
.esgOperation .esgDirec > ul li {
  width: 420px;
  height: 420px;
  float: left;
  border: 1px solid #ccc;
  box-sizing: border-box;
}
.esgOperation .esgDirec > ul li:nth-child(2) {
  margin: 0 10px;
}
.esgOperation .esgDirec > ul p {
  margin: 115px 0 24px;
  padding-top: 125px;
  font-size: 50px;
  font-weight: bold;
  color: #333;
  background: url("../../../images/group/ko/esg_01_01_clear.png") no-repeat top center;
}
.esgOperation .esgDirec li:nth-child(2) > p {
  background-image: url("../../../images/group/ko/esg_01_01_clean.png");
}
.esgOperation .esgDirec li:last-child > p {
  background-image: url("../../../images/group/ko/esg_01_01_compliant.png");
}
.esgOperation .esgDirec > ul span {
  font-size: 24px;
  line-height: 40px;
  color: #001411;
}
/* 02_01 */
.esgOperation .environList {
  overflow: hidden;
}
.esgOperation .environList > li.scroll_ON h4 {
  opacity: 1;
}
.esgOperation .environList h4 {
  position: absolute;
  z-index:10;
  width:100%; height:100%;
  top: 0;
  left: 0;
  opacity: 0;
  transition: .8s;
  background: url("../../../images/group/ko/esg_02_01_campain_txt.png") no-repeat center top 520px fixed;
}
.esgOperation .environList > li div.scroll_ON > img {
  transform: translateY(-10%) scale(1.2);
  opacity: 1;
}
.esgOperation .environList > li div.scroll_ON + p {
  transform: translateY(0);
  opacity: 1;
}
.esgOperation .environList > li div > img {
  transform: translateY(50%) scale(1.3);
  opacity: 0;
  transition: 1.5s cubic-bezier(0,.88,.56,.64);
}
.esgOperation .environList > li {
  position:relative;
  overflow: hidden;
  padding-bottom: 201px;
  height: 1329px;
}
.esgOperation .environList > li div {
  overflow: hidden;
}
.esgOperation .environList > li > p {
  line-height: 30px;
  letter-spacing: -0.05em;
  transform: translateY(100%);
  opacity: 0;
  transition: 1s;
}
.esgOperation .environList > .enListcampain .enImg1 {
  width: 504px;
  height: 597px;
  margin: 0 0 99px 50px;
}
.esgOperation .environList > .enListcampain .enImg2 {
  width: 505px;
  height: 493px;
  margin: -153px 50px 0 0;
  float: right;
}
.esgOperation .environList > .enListcampain p {
  margin-left: 140px;
}
.esgOperation .environList > .enListcampain .enImg3 {
  width: 444px;
  height: 550px;
  margin: 23px 0 0 140px;
}
.esgOperation .environList > .enListeco > h4 {
  background-image: url("../../../images/group/ko/esg_02_01_eco_txt.png");
}
.esgOperation .environList > .enListeco {
  height: 1237px;
  padding-bottom: 233px;
}
.esgOperation .environList > .enListeco .enImg1,
.esgOperation .environList > .enListeco .enImg2 {
  float: right;
}
.esgOperation .environList > .enListeco .enImg1 {
  width: 737px;
  height: 501px;
  margin-right: 137px;
}
.esgOperation .environList > .enListeco .enImg2 {
  width: 477px;
  height: 568px;
  margin: -71px 50px 0 0;
}
.esgOperation .environList > .enListeco .enImg3 {
  width: 444px;
  height: 550px;
  margin-left: 100px;
}
.esgOperation .environList > .enListeco p {
  margin: 680px 0 23px 100px;
 }
 .esgOperation .environList > .enListclimate > h4 {
  background-image: url("../../../images/group/ko/esg_02_01_climate_txt.png");
}
.esgOperation .environList > .enListclimate {
  height: 1217px;
  padding-bottom: 135px;
}
.esgOperation .environList > .enListclimate .enImg1,
.esgOperation .environList > .enListclimate .enImg3 {
  float: left;
}
.esgOperation .environList > .enListclimate .enImg1 {
  width: 483px;
  height: 501px;
}
.esgOperation .environList > .enListclimate .enImg2 {
  width: 874px;
  height: 481px;
  float: right;
  margin-top: -134px;
}
.esgOperation .environList > .enListclimate .enImg3 {
  width: 444px;
  height: 550px;
  margin: -230px 0 0 30px;
}
.esgOperation .environList > .enListclimate p {
  margin: 891px 0 0 510px;
}
.esgOperation .environList > .enListworkplace > h4 {
  background-image: url("../../../images/group/ko/esg_02_01_workplace_txt.png");
}
.esgOperation .environList > .enListworkplace {
  height: 1410px;
  padding-bottom: 0;
}
.esgOperation .environList > .enListworkplace .enImg1,
.esgOperation .environList > .enListworkplace .enImg3 {
  float: right;
}
.esgOperation .environList > .enListworkplace .enImg1 {
  width: 483px;
  height: 501px;
}
.esgOperation .environList > .enListworkplace .enImg2 {
  width: 642px;
  height: 481px;
  margin-top: 367px;
}
.esgOperation .environList > .enListworkplace .enImg3 {
  width: 444px;
  height: 550px;
  margin: -90px 121px 0 0;
}
.esgOperation .environList > .enListworkplace >  p {
  margin: 42px 0 0 105px;
}


/* 03_01 */
.esgOperation .esgHuman .esgTitles {
  margin: 150px 0 53px;
}
.esgOperation .esgHlist {
  overflow: hidden;
  word-break: keep-all;
}
.esgOperation .esgHlist > p {
  text-align: center;
  margin: 17px 0 40px;
  font-size: 40px;
  font-weight: 300;
  line-height: 40px;
  color: #111;
  letter-spacing: -0.05em;
}
.esgOperation .esgHlist > dl {
  float: left;
  width: 420px;
  height: 695px;
  padding: 56px 58px 83px;
  border: 1px solid #ccc;
  box-sizing: border-box;
}
.esgOperation .esgHlist > dl:nth-child(3) {
  margin: 0 10px;
}
.esgOperation .esgHlist > dl dt {
  padding-top: 107px;
  margin-bottom: 50px;
  font-size: 50px;
  font-weight: bold;
  line-height: 50px;
  color: #111;
  background: url("../../../images/group/ko/esg_03_01_action.png") no-repeat top left;
}
.esgOperation .esgHlist > dl:nth-child(3) dt {
  background-image: url("../../../images/group/ko/esg_03_01_change.png");
}
.esgOperation .esgHlist > dl:last-child dt {
  background-image: url("../../../images/group/ko/esg_03_01_develop.png");
}
.esgOperation .esgHlist > dl p {
  margin-bottom: 41px;
  font-size: 24px;
  line-height: 35px;
  color: #111;
}
.esgOperation .esgHlist > dl span {
  line-height: 30px;
  letter-spacing: -0.05em;
  color: #666;
}
.esgOperation .esgEdu .esgTitles {
  margin: 118px 0 53px;
}
.esgOperation .esgElist {
  overflow: hidden;
}
.esgOperation .esgElist > dl {
  float: left;
  width: 240px;
  padding: 71px 21px 50px 50px;
  margin-right: 12px;
  background: #f7f7f7;
}
.esgOperation .esgElist > dl:last-child {
  margin-right: 0;
}
.esgOperation .esgElist > dl dt {
  font-size: 40px;
  font-weight: bold;
  line-height: 50px;
  color: #9a895d;
}
.esgOperation .esgElist > dl dd:nth-child(2) {
  margin-bottom: 33px;
}
.esgOperation .esgElist > dl dd:nth-child(2) > p {
  margin: 43px 0 17px;
  font-size: 35px;
  line-height: 40px;
  color: #333;
}
.esgOperation .esgElist > dl dd > span {
  line-height: 30px;
  color: #333;
}
.esgOperation .esgElist > dl dd strong {
  color: #21847c;
  letter-spacing: 0px;
}
.esgOperation .esgElist dd:last-child > p {
  padding-top: 35px;
  font-size: 15px;
  line-height: 25px;
  color: #666;
  border-top: 1px solid #7a7a7a;
  box-sizing: border-box;
}

/* 03_02 */
.esgOperation .gwpTitle > h3 {
  line-height: 60px;
}
.esgOperation.gwpVisual {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 636px;
  background: url("../../../images/group/ko/esg_03_02_visual_img.png") no-repeat left top / cover;
}
#container > section:nth-child(3) {
  background: rgba(255,255,255,0);
}
.esgOperation .gwpContents {
  margin-top: -84px;
}
.esgOperation .gwpContents dl {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.esgOperation .gwpContents dl.scroll_ON .gwpTxt {
  transform: translateY(0);
}
.esgOperation .gwpContents .gwpTxt {
  width: 547px;
  padding-left: 130px;
  transform: translateY(50%);
  transition: 0.8s;
}
.esgOperation .gwpContents .gwpTxt > p {
  margin-bottom: 41px;
  font-size: 30px;
  line-height: 30px;
  font-weight: 700;
  color: #111;
}
.esgOperation .gwpContents .gwpTxt > span {
  line-height: 30px;
}
.esgOperation .gwpContents dl.scroll_ON img {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.esgOperation .gwpContents .gwpImg img {
  opacity: 0;
  transform: translateY(50%) scale(0.6);
  transition: 1s cubic-bezier(0,.88,.56,.64);
  transition-delay: 0.3s;
}
.esgOperation .gwpSupport {
  position: relative;
  margin: 52px 0 239px;
}
.esgOperation dl.scroll_ON::after {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition-delay: 0.9s;
}
.esgOperation .gwpSupport::after {
  position: absolute;
  bottom: -180px;
  left: 130px;
  content: "";
  display: block;
  width: 311px;
  height: 318px;
  background: url("../../../images/group/ko/esg_03_02_support_img2.png") no-repeat center center;
  opacity: 0;
  transform: translateY(50%) scale(0.6);
  transition: 1s cubic-bezier(0,.88,.56,.64);
  z-index: 2;
}
.esgOperation .gwpFamily {
  position: relative;
  margin-bottom: 239px;
}
.esgOperation .gwpFamily::after {
  position: absolute;
  bottom: -327px;
  right: 45px;
  content: "";
  display: block;
  width: 333px;
  height: 408px;
  background: url("../../../images/group/ko/esg_03_02_family_img2.png") no-repeat center center;
  opacity: 0;
  transform: translateY(50%) scale(0.6);
  transition: 1s cubic-bezier(0,.88,.56,.64);
  z-index: 2;
}
/* 05_01 */
.esgOperation .esgCirculatio > p {
  margin-bottom: 55px;
  text-align: center;
  font-size: 30px;
  font-weight: 700;
  line-height: 35px;
  color: #21847c;
  letter-spacing: -0.05em;
}
.esgOperation .esgScale {
  position: relative;
  height: 471px;
}
.esgOperation .esgScale::after {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  content: "";
  display: block;
  width: 592px;
  height: 210px;
  background: url("../../../images/group/ko/esg_05_01_scale.png") no-repeat center center;
}
.esgOperation .esgScale > ul {
  margin: 0 auto;
  width: 893px;
  overflow: hidden;
}
.esgOperation .esgScale > ul li {
  position: relative;
  float: left;
  margin-top: 92px;
  width: 193px;
  height: 193px;
  font-size: 24px;
  color: #111;
  display: flex;
  text-align: center;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  line-height: 30px;
  border: 5px solid #e2e2e2;
  box-sizing: border-box;
  border-radius: 50%;
  word-break: keep-all;
}
.esgOperation .esgScale > ul li::after {
  position: absolute;
  top: 50%;
  right: -63px;
  transform: translateY(-50%);
  content: "";
  display: block;
  width: 60px;
  height: 7px;
  background: url("../../../images/group/ko/esg_05_01_lineleft.png") no-repeat center center;
  z-index: 5;
}
.esgOperation .esgScale > ul li:last-child::after {
  background-image: url("../../../images/group/ko/esg_05_01_lineright.png");
  right: auto;
  left: -63px;
}
.esgOperation .esgScale > ul .scaleCenter {
  margin: 0 53px;
  width: 401px;
  height: 401px;
  padding-top: 111px;
  justify-content: flex-start;
  align-items: center;
  background: #f8f8f8;
  border: none;
}
.esgOperation .esgScale > ul .scaleCenter::after {
  display: none;
}
.esgOperation .esgScale .scaleCenter > p {
  font-size: 30px;
  line-height: 40px;
  color: #111;
}
.esgOperation .esgScale > ul .scaleCenter > p:last-child {
  font-weight: 700;
}
#container .fairActivity {
  width: 100%;
  background: #f8f8f8;
}
.esgOperation + .fairActivity {
  margin: 150px 0;
  padding: 145px 0 143px;
}
.esgOperation + .fairActivity > div {
  width: 1280px;
  margin: 0 auto;
  text-align: center;
}
.esgOperation + .fairActivity > div .esgTitles {
  margin-bottom: 53px;
}
.esgOperation + .fairActivity > div .esgTitles h4 {
  padding-bottom: 22px;
}
.esgOperation + .fairActivity > div > ul {
  margin: 50px 0 0 164px;
  overflow: hidden;
  letter-spacing: -0.05em;
}
.esgOperation + .fairActivity > div > ul > li {
  float: left;
  position: relative;
  margin-right: 328px;
}
.esgOperation + .fairActivity > div > ul > li::before {
  position: absolute;
  top: 50%;
  right: -163px;
  transform: translateY(-50%);
  content: "";
  display: block;
  width: 1px;
  height: 94px;
  background: #999;
}
.esgOperation + .fairActivity > div > ul > li:last-child {
  margin-right: 0;
}
.esgOperation + .fairActivity > div > ul > li:last-child::before {
  display: none;
}
.esgOperation + .fairActivity ul li > p {
  font-size: 24px;
  font-weight: 700;
  line-height: 40px;
  color: #000011;
}
.esgOperation + .fairActivity .fairsList {
  margin-top: 19px;
}
.esgOperation + .fairActivity .fairsList > li span {
  position: relative;
  padding-left: 13px;
  line-height: 30px;
  color: #333;
}
.esgOperation + .fairActivity .fairsList > li span::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  display: block;
  content: "";
  width: 4px;
  height: 4px;
  background: #3a6261;
}
.esgOperation .growActlist {
  overflow: hidden;
  margin: 53px 0 120px;
}

/* 2021-09-09 수정 */
.esgOperation .growActlist > li {
  padding: 29px 49px;
  float: left;
  margin-right: 12px;
  width: 311px;
  height: 262px;
  border: 1px solid #ccc;
  box-sizing: border-box;
}
.esgOperation .growActlist > li:last-child {
  margin-right: 0;
}
.esgOperation .growActlist > li p {
  position: relative;
  padding-bottom: 46px;
  font-size: 24px;
  color: #111;
  font-weight: 700;
  line-height: 40px;
}
.esgOperation .growActlist > li p::after {
  position: absolute;
  bottom: 21px;
  left: 1px;
  display: block;
  content: "";
  width: 30px;
  height: 2px;
  background: #9a895d;
}
.esgOperation .growActlist > li span {
  line-height: 30px;
  letter-spacing: -0.05em;
}
.esgOperation .companyUplist {
  margin: 53px 0 118px;
  overflow: hidden;
}
.esgOperation .companyUplist > li {
  float: left;
  padding-top: 96px;
  text-align: center;
  width: 420px;
  height: 304px;
  background: #f7f7f7;
}
.esgOperation .companyUplist > li:nth-child(2) {
  margin: 0 10px;
}
.esgOperation .companyUplist > li p {
  position: relative;
  padding-bottom: 58px;
  font-size: 54px;
  font-weight: bold;
  color: #9a895d;
}
.esgOperation .companyUplist > li:last-child p {
  padding-bottom: 65px;
}
.esgOperation .companyUplist > li p::after {
  position: absolute;
  bottom: 23px;
  left: 50%;
  transform: translateX(-50%);
  content: "";
  display: block;
  width: 30px;
  height: 2px;
  background: #9a895d;
}
.esgOperation .companyUplist > li span {
  color: #111;
  line-height: 30px;
  letter-spacing: -0.05em;
}
.esgOperation .localEconomy > .localList {
  overflow: hidden;
  margin-top: 53px;
}
.esgOperation .localEconomy > .localList > .localList1 {
  padding-left: 50px;
  float: left;
}
.esgOperation .localEconomy > .localList > .localList2 {
  padding: 117px 50px 0 0;
  float: right;
}
.esgOperation .localEconomy > .localList > li > p {
  position: relative;
  margin-top: 20px;
  padding-bottom: 46px;
  font-size: 24px;
  font-weight: 700;
  color: #111;
  line-height: 40px;
}
.esgOperation .localEconomy > .localList > .localList2 > p {
  padding-bottom: 42px;
}
.esgOperation .localEconomy > .localList > li > p::after {
  position: absolute;
  left: 0;
  bottom: 22px;
  width: 30px;
  height: 2px;
  content: "";
  display: block;
  background: #9a895d;
}
.esgOperation .localEconomy > .localList > .localList2 > p::after {
  bottom: 19px;
}
.esgOperation .localEconomy > .localList > li span {
  line-height: 30px;
  letter-spacing: -0.05em;
}
.esgOperation .localEconomy > .localList .localListsub {
  overflow: hidden;
}
.esgOperation .localEconomy > .localList .localListsub p {
  float: left;
  width: 108px;
  font-weight: 700;
  line-height: 40px;
}
.esgOperation .localEconomy > .localList .localListsub span {
  line-height: 40px;
}


/***************** popupLayerWrap *****************/
.CompanyOverviewPop {
  color: #111;
}
.CompanyOverviewPop .popTop {
  overflow: hidden;
  padding-bottom: 60px;
  border-bottom: 2px solid #000;
  box-sizing: border-box;
}
.CompanyOverviewPop .popTop > div {
  height: 180px;
}
.CompanyOverviewPop .ptopTitle {
  float: left;
}
.CompanyOverviewPop .ptopTitle > h4 {
  font-size: 56px;
  font-weight: 700;
  line-height: 56px;
  letter-spacing: -0.025em;
  margin-bottom: 53px;
}
.CompanyOverviewPop .ptopTitle > p {
  font-size: 30px;
  line-height: 40px;
  letter-spacing: -0.025em;
}
.CompanyOverviewPop .ptopInfo {
  float: right;
  width: 370px;
  margin-top: 5px;
}
.CompanyOverviewPop .ptopInfo > ul {
  margin-top: 31px;
  font-size: 15px;
  line-height: 30px;
  color: #666;
}
.CompanyOverviewPop .ptopInfot > ul {
  margin-top: 61px;
}
.CompanyOverviewPop .ptopInfo > ul li {
  display: flex;
  word-break: keep-all;
}
.CompanyOverviewPop .ptopInfo > ul p {
  width: 75px;
}
.CompanyOverviewPop .ptopInfo > ul span {
  display: block;
  width: 295px;
}
.CompanyOverviewPop .popMid {
  margin-top: 52px;
}
.CompanyOverviewPop .popMid > p {
  word-break: keep-all;
  font-size: 19px;
  line-height: 30px;
  color: #333;
}
.CompanyOverviewPop .popMid > dl {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
}
.CompanyOverviewPop .popMid > .coIntro {
  margin-top: 69px;
 }
.CompanyOverviewPop .popMid > .coStatus {
  margin-top: 20px;
}
.CompanyOverviewPop .popMid > dl dt {
  width: 100%;
  margin-bottom: 19px;
  font-size: 24px;
  line-height: 30px;
  font-weight: 700;
}
.CompanyOverviewPop .popMid > .coStatus dt {
  margin-bottom: 21px;
}
.CompanyOverviewPop .coIntro ul > li {
  position: relative;
  padding-left: 8px;
  font-size: 15px;
  line-height: 28px;
  color: #666;
}
.CompanyOverviewPop .coIntro ul > li::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "-";
  display: block;
  color: #666;
}
.CompanyOverviewPop .popMid > .coInfo dd {
  width: 356px;
  margin-bottom: 28px;
  padding: 0 20px 0 10px;
  word-break: keep-all;
}
.CompanyOverviewPop > .popMid > .coInfo .coinfoMar {
  padding: 0 0 0 10px;
}
.CompanyOverviewPop .popMid > .coInfo .coIfull {
  width: 1000px;
}
.CompanyOverviewPop .popMid > .coInfo dd > p {
  position: relative;
  margin-bottom: 8px;
  font-size: 19px;
  line-height: 30px;
  color: #333;
}
.CompanyOverviewPop .popMid > .coInfo dd > p::before {
  position: absolute;
  top: 16px; /* 2023-01-04 수정 */
  left: -10px;
  transform: translateY(-50%);
  content: "";
  display: block;
  width: 4px;
  height: 4px;
  background: #3a6261;
}
.CompanyOverviewPop .popMid > .coInfo dd > span {
  display: block;
  font-size: 15px;
  line-height: 28px;
  color: #666;
}

/* 2023-01-04 추가 [S] */

.CompanyOverviewPop .popMid > .coInfo dd > .dotList{
  display: block;
  font-size: 15px;
  line-height: 28px;
  color: #666;
}

.CompanyOverviewPop .popMid > .coInfo dd > .dotList>li:before{
  position: absolute;
  top: 0px;
  left: 0;
  content: "·";
  display: block;
  color: #666;
  transform: none;
}

/* 2023-01-04 추가 [E] */

.CompanyOverviewPop .popMid > .coStatus dd > p {
  margin-bottom: 10px;
}
.CompanyOverviewPop .popMid > .coStatus dd > span {
  line-height: 25px;
}
.CompanyOverviewPop .popMid > .coBrand {
  margin-top: 22px;
}
.CompanyOverviewPop .popMid > .coBrand dt {
  margin-bottom: 27px;
}
.CompanyOverviewPop .popMid > .coBrand dd {
  margin-right: 18px;
  width: 368px;
  word-break: keep-all;
}
.CompanyOverviewPop .popMid > .coBrand .pbrandrm {
  margin-right: 0;
}
.CompanyOverviewPop .popMid > .coBrand dd > p {
  width: 368px;
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #eee;
  box-sizing: border-box;
}
.CompanyOverviewPop .popMid > .coBrand dd > span {
  display: block;
  padding: 16px 0;
  font-size: 13px;
  color: #666;
  line-height: 20px;
}
.CompanyOverviewPop .popMid > .coBrandR dd > span {
  height: 60px;
}
.CompanyOverviewPop .popMid > .coBrandH dd > span {
  height: 45px;
}
.CompanyOverviewPop .popMid > .coBrand .brandTxt {
  font-size: 24px;
  font-weight: 500;
}
.CompanyOverviewPop .ptxtMar {
  margin-bottom: 30px;
}
.CompanyOverviewPop .pinfoMar {
  margin-bottom: 35px;
}
.CompanyOverviewPop .popMid > .coBrand .popBrandone {
  width: 100%;
}
.CompanyOverviewPop .popEz > .ptopInfo {
  height: 210px;
}
.CompanyOverviewPop .popNews {
  overflow: hidden;
  margin-top: 35px;
}
.CompanyOverviewPop > .popnewsS {
  margin-top: 21px;
}
.CompanyOverviewPop > .popnewsR {
  margin-top: 15px;
}
.CompanyOverviewPop > .popnewsI {
  margin-top: 20px;
}
.CompanyOverviewPop .popNews > p {
  margin-bottom: 27px;
  font-size: 24px;
  font-weight: 700;
  line-height: 30px;
  color: #111;
}
.CompanyOverviewPop .popNews > ul {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.CompanyOverviewPop .popNews > ul > li {
  width: 370px;
}
.CompanyOverviewPop .popNews > ul > li img {
  width: 100%;
  height: 230px;
  object-fit: cover;
}
.CompanyOverviewPop .popNews > ul p {
  width: 370px;
  margin: 20px 0 5px;
  font-size: 19px;
  line-height: 25px;
  color: #000;
  letter-spacing: -0.05em;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.CompanyOverviewPop .popNews > ul span {
  font-size: 14px;
  line-height: 14px;
  color: #666;
}
.CompanyOverviewPop > .companypopClose {
  position: absolute;
  top: 29px;
  right: 40px;
  content: "";
  display: block;
  width: 21px;
  height: 21px;
  background: url("../../../images/group/ko/co_01_01_pop_close.png") no-repeat center center;
}


/************** ethContents *************************/

/** 04_01 **/
.ethContents .scroll_ON > h3,
.ethContents .scroll_ON > h4,
.ethContents .scroll_ON > p,
.ethContents .scroll_ON > ul > li {
  opacity: 1;
  transform: translateY(0);
}
.ethContents .ethicsInfo {
  overflow: hidden;
}
.ethContents > .ethTitle {
  margin-bottom: 0;
}
.ethContents .ethicsInfo > .esgTitles {
  margin-bottom: 72px;
}
.ethContents .ethicsInfo .esgTitles > h4 {
  margin-bottom: 22px;
}

/* 2022-09-06 추가 [S] */
.ethContents .ethicsInfo .esgTitles > h4.title_btn{display: inline-block;}
.ethContents .ethicsInfo .esgTitles > h4.title_btn >.ciBtns{display: inline-block; vertical-align: text-bottom; margin-left: 10px;}
#container .ethContents .ethicsInfo .esgTitles > h4.title_btn >.ciBtns > .downBtn{ border: 2px solid #000; font-size: 15px; color: #333; height: auto; line-height: normal; padding-top: 7px; padding-bottom: 7px;}
#container .ethContents .ethicsInfo .esgTitles > h4.title_btn >.ciBtns > .downBtn:hover{background-color: transparent;}
#container .ethContents .ethicsInfo .esgTitles > h4.title_btn >.ciBtns > .downBtn::after{content:""; position:absolute; right:18px; top:50%; transform: translateY(-50%); width:14px; height:15px; background:url(../../../images/group/ko/ico_btn_down.png) no-repeat; }
/* 2022-09-06 추가 [E] */

.ethContents .ethicsInfo > ul {
  position: relative;
  float: left;
  width: 584px;
  padding-left: 50px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.ethContents .ethicsInfo > ul li {
  width: 260px;
  padding-bottom: 55px;
}
.ethContents .ethicsInfo > ul li:hover strong {
  color: rgba(210, 194, 151, 0.3);
  transition: 0.3s;
}
.ethContents .ethicsInfo > ul li:hover .ethicsImg {
  opacity: 1;
}
.ethContents .ethicsInfo > ul p {
  position: relative;
  padding-bottom: 54px;
  font-size: 24px;
  line-height: 24px;
  color: #111;
  font-weight: 700;
}
.ethContents .ethicsInfo > ul p::after {
  position: absolute;
  top: 52px;
  left: 2px;
  content: "";
  display: block;
  width: 30px;
  height: 2px;
  background: #9a895d;
}
.ethContents .ethicsInfo > ul span {
  line-height: 30px;
  letter-spacing: -0.05em;
}
.ethContents .ethicsInfo > ul strong {
  position: absolute;
  margin: 30px 0 0 97px;
  font-size: 150px;
  line-height: 150px;
  color: rgba(210, 194, 151, 0);
  z-index: -1;
  transition: 0.3s;
  letter-spacing: -0.025em;
}
.ethContents .ethicsInfo > ul .ethicsImg {
  position: absolute;
  top: 0;
  right: -650px;
  transition: 0.5s;
  opacity: 0;
}
.ethContents .ethicsInfo > ul li:first-child::before {
  position: absolute;
  top: 0;
  right: -650px;
  content: "";
  display: block;
  width: 470px;
  height: 520px;
  background: url("../../../images/group/ko/eth_04_01_ethics_img1.png") no-repeat center center;
}
.ethContents .ethicsAct {
  letter-spacing: -0.05em;
}
.ethContents .ethicsAct .esgTitles {
  margin: 92px 0 80px;
}
.ethContents .ethicsAct > .actList {
  overflow: hidden;
}
.ethContents .ethicsAct > .actList > li {
  float: left;
  width: 420px;
  height: 320px;
  margin-right: 10px;
  padding: 50px 0 60px 60px;
  border: 1px solid #ccc;
  box-sizing: border-box;
}
.ethContents .ethicsAct > .actList > li:last-child {
  margin-right: 0;
}
.ethContents .ethicsAct > .actList p {
  margin-bottom: 12px;
  padding-top: 112px;
  font-size: 24px;
  font-weight: 700;
  line-height: 40px;
  color: #111;
  background: url("../../../images/group/ko/eth_04_01_ethics_icon1.png") no-repeat top left;
}
.ethContents .ethicsAct > .actList li:nth-child(2) p {
  background-image: url("../../../images/group/ko/eth_04_01_ethics_icon2.png");
}
.ethContents .ethicsAct > .actList li:last-child p {
  background-image: url("../../../images/group/ko/eth_04_01_ethics_icon3.png");
}
.ethContents .ethicsAct .actListsub > .square {
  padding-left: 12px;
  margin-right: 0;
  line-height: 30px;
  letter-spacing: -0.05em;
}
.ethContents .ethicsRule .esgTitles {
  margin: 148px 0 79px;
}
.ethContents .ethicsRule > .ethicsRlist {
  overflow: hidden;
}
.ethContents .ethicsRule > .ethicsRlist > li {
  float: left;
  margin-right: 10px;
  width: 420px;
  height: 320px;
  text-align: center;
  background: url("../../../images/group/ko/eth_04_01_ethics_rule_img1.png") no-repeat center center / 100%;
  overflow: hidden;
  transition: background 0.9s;
}
.ethContents .ethicsRule > .ethicsRlist > li:hover {
  background-size: 120%;
}
.ethContents .ethicsRule > .ethicsRlist > li:nth-child(2) {
  background-image: url("../../../images/group/ko/eth_04_01_ethics_rule_img2.png");
}
.ethContents .ethicsRule > .ethicsRlist > li:last-child {
  background-image: url("../../../images/group/ko/eth_04_01_ethics_rule_img3.png");
  margin-right: 0;
}
.ethContents .ethicsRule > .ethicsRlist a {
  margin: 0 auto;
  width: 420px;
  height: 320px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.ethContents .ethicsRule > .ethicsRlist a:hover {
  text-decoration: none;
}
.ethContents .ethicsRule > .ethicsRlist span {
  padding-top: 47px;
  font-size: 30px;
  line-height: 30px;
  color: #fff;
  background: url("../../../images/group/ko/eth_04_01_ethics_download.png") no-repeat center top;
}


/** 04_02_01 **/
.ethContents .tipDoing {
  color: #333;
  letter-spacing: -0.05em;
}
.ethContents div.scroll_ON > h4, .ethContents div.scroll_ON > h4, .ethContents div.scroll_ON > h4,
.ethContents div.scroll_ON > p {
  opacity: 1;
  transform: translateY(0);
}
.ethContents .tipDoing > h4, .ethContents .tipPeople > h4, .ethContents .tipProgram > h4 {
  font-size: 30px;
  line-height: 30px;
  padding-bottom: 30px;
  color: #333;
  opacity: 0;
  transform: translateY(30%);
  transition: 0.3s;
  transition-delay: 0.6s;
  letter-spacing: -0.05em;
}
.ethContents .tipDoing > p, .ethContents .tipProgram > p {
  line-height: 15px;
  color: #666;
  margin-bottom: 61px;
  letter-spacing: -0.05em;
  opacity: 0;
  transform: translateY(30%);
  transition: 0.3s;
  transition-delay: 0.8s;
}
.ethContents .tipDoing > .tipScroll {
  height: 357px;
  padding: 12px 0 0 49px;
  border: 1px solid #ccc;
  box-sizing: border-box;
}
.ethContents .tipDoing > .tipScroll li {
  margin-top: 30px;
  font-weight: 700;
  line-height: 30px;
}
.ethContents .tipDoing > .tipScroll li > span {
  font-weight: 400;
  display: block;
}
.ethContents .tipDoing > .tipRadio {
  overflow: hidden;
}
.ethContents .tipDoing > .tipRadio > li {
  display: block;
  width: 640px;
  height: 91px;
  line-height: 88px;
  float: left;
  text-align: center;
  border: 1px solid #ccc;
  border-top: none;
  box-sizing: border-box;
}
.ethContents .tipDoing > .tipRadio > li:last-child {
  border-left: none;
}
.ethContents .tipDoing > .tipRadio label span {
  padding-left: 30px;
  font-size: 19px;
}
.ethContents .tipDoing > .tipBtn {
  width: 953px;
  margin: 52px auto;
}
.ethContents .tipDoing > .tipBtn > p {
  line-height: 30px;
  text-align: center;
  margin-bottom: 53px;
}
.ethContents .tipDoing > .tipBtn > ul {
  overflow: hidden;
}
.ethContents .tipDoing > .tipBtn li {
  float: left;
  margin-right: 16px;
}
.ethContents .tipDoing > .tipBtn .tipResult {
  margin-right: 0;
}
#container .ethContents .tipDoing > .tipBtn .btnL {
  width: 307px;
  padding: 0;
  color: #fff;
  text-align: center;
}
#container .ethContents .tipDoing > .tipBtn .tipResult > .btnL {
  background: #9a895d;
}
#container .ethContents .tipDoing > .tipBtn .tipResult > .btnL:hover,
#container .ethContents .tipDoing > .tipBtn .tipResult > .btnL:focus {
  background: #21847c;
}
.ethContents .tipDoing > .tipCustom {
  height: 96px;
  background: #f7f7f7;
  letter-spacing: -0.025em;
}
.ethContents .tipDoing > .tipCustom .btnS {
  margin-top: 6px;
  color: #000;
  background: #f7f7f7;
}
.ethContents .tipDoing > .tipCustom {
  padding: 44px 100px 0 49px;
  overflow: hidden;
}
.ethContents .tipDoing > .tipCustom > ul {
  float: left;
}
.ethContents .tipBullet {
  position: relative;
  font-size: 15px;
  font-weight: 300;
  color: #666;
  line-height: 26px;
  padding-left: 15px;
}
.ethContents .tipBullet::before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  content: "※";
  color: #666;
}
.ethContents .tipDoing > .tipCustom > a {
  float: right;
}
.ethContents .tipPeople {
  margin-top: 122px;
}
.ethContents .tipPeople > h4 {
  padding-bottom: 49px;
}
.ethContents .tipPeople .tippList {
  width: 1050px;
  padding-left: 60px;
  height: 108px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-wrap: wrap;
}
.ethContents .square {
  position: relative;
  color: #333;
  line-height: 36px;
  margin-right: 220px;
  padding-left: 13px;
  letter-spacing: -0.05em;
}
.ethContents .square::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  display: block;
  width: 4px;
  height: 4px;
  content: "";
  background: #3a6261;
}
.ethContents .tipPeople .tippList > .pListm {
  margin-right: 0;
}
.ethContents .tipPeople .tippNoti {
  height: 149px;
  margin-top: 50px;
  padding: 43px 0 0 49px;
  background: #f7f7f7;
}
.ethContents .tipPeople .tippNoti > .tipBullet {
  line-height: 26px;
  padding-left: 19px;
}
.ethContents .tipProgram {
  margin-top: 118px;
}
.ethContents .tipProgram .tipProlist {
  overflow: hidden;
}
.ethContents .tipProgram > .tipProlist > li {
  float: left;
  width: 420px;
  height: 290px;
  padding: 39px 50px 0 50px;
  word-break: keep-all;
  border: 1px solid #ccc;
  box-sizing: border-box;
}
.ethContents .tipProgram > .tipProlist > li > span {
  padding-left: 12px;
  font-size: 24px;
  font-weight: 700;
  color: #111;
  line-height: 40px;
}
.ethContents .tipProgram > .tipProlist > li:nth-child(2) {
  margin: 0 10px;
}
.ethContents .tipProgram .tipProsub {
  margin-top: 10px;
}
.ethContents .tipProgram .tipProsub > .square {
  margin-right: 0;
  padding-left: 13px;
  line-height: 30px;
}
.ethContents .tipProgram .tipProsub > .square::before {
  top: 30px;
  transform: translateY(-16px);

}
.ethContents .tipProgram .tipProsub > li:first-child {
  margin-bottom: 7px;
}
.ethContents .tipProgram .tipProcont {
  margin-top: 60px;
  padding: 44px 0 0 48px;
  height: 124px;
  background: #f7f7f7;
}
.ethContents .tipProgram .tipProcont > .tipBullet {
  padding-left: 19px;
}
.ethContents .tipProgram .tipProcont li {
  overflow : hidden;
}
.ethContents .tipProgram .tipProcont li > p {
  float: left;
  width: 90px;
}

/** 04_02_02 **/
.ethContents .esgTitle li {
  font-size: 21px;
  color: #333;
  line-height: 35px;
  opacity: 0;
  transform: translateY(30%);
  transition: 0.8s;
  transition-delay: 0.3s;
  letter-spacing: -0.05em;
}
.ethContents .realnameForm h3 {
  margin-bottom: 31px;
}
.ethContents .bbsMainform > p, .ethContents .bbsAddform > p {
  padding-bottom: 30px;
  font-size: 19px;
  line-height: 17px;
  color: #666;
  letter-spacing: -0.05em;
}
.ethContents .bbsMainform > .formPw {
  padding: 20px 20px 22px;
}
.ethContents .bbsMainform span, .ethContents .bbsAddform span {
  font-size: 19px;
  color: #e22000;
}
.ethContents .bbsMainform > dl, .ethContents .bbsAddform > dl {
  width: 1280px;
  padding: 20px 20px;
  border-top: 1px solid #ccc;
  box-sizing: border-box;
}
.ethContents .bbsMainform > dl dt {
  float: left;
  width: 210px;
  line-height: 46px;
}
.ethContents .bbsMainform > dl dt label {
  font-size: 20px;
  line-height: 30px;
  color: #333;
}
.ethContents .bbsMainform > dl dd input {
  height: 46px;
  font-size: 19px;
  color: #000;
  background: #f6f6f6;
  border: none;
  box-sizing: border-box;
}
.ethContents .bbsMainform > dl dd input:focus {
  outline: 1px solid #111111;
}
.ethContents .bbsMainform > .formName, .ethContents .bbsMainform > .formTitle,
.ethContents .bbsAddform > .addformIssue
{
  border-color: #111;
  border-width: 2px;
}
.ethContents .bbsMainform > dl dd select.customSelect {
  font-size: 19px;
  color: #000;
}
.ethContents .bbsMainform > dl dd select.customSelect:focus {
  outline: 1px solid #111111;
}
.ethContents .bbsMainform > dl dd input::placeholder {
  color: #000;
}
.ethContents .bbsMainform > dl dd textarea::placeholder {
  font-size: 15px;
  font-weight: 300;
  color: #666;
}
.ethContents .bbsMainform > .formResult input {
  height: auto;
}
.ethContents .bbsMainform > .formName dd input.customInput,
.ethContents .bbsMainform > .formPw dd input.customInput,
.ethContents .bbsMainform > .formPwc dd input.customInput,
.ethContents .bbsMainform > .formRelaname dd input.customInput

{
  width: 500px;
}
.ethContents .bbsMainform > .formPhone dd input.customInput
{
  width: 190px;
}
.ethContents .bbsMainform > .formMail dd input.customInput,
.ethContents .bbsMainform > dl dd input.customInput
{

  width: 230px;
}
.ethContents .bbsMainform > .formTitle dd input.customInput {
  width: 1030px;
}
.ethContents .bbsMainform > dl dd > ul {
  margin-left: 219px;
  margin-top: 14px;
}
.ethContents .bbsMainform > .formFile .form_wrap ul li {
  position: relative;
  padding-left: 13px;
  font-size: 15px;
  font-weight: 300;
  color: #666;
  line-height: 26px;
}
.ethContents .bbsMainform > .formFile .form_wrap ul li::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "-";
  color: #666
}
.ethContents .bbsMainform > .formResult {
  padding: 15px 20px;
}
.ethContents .bbsMainform > .formResult dt {
  line-height: 30px;
}
.ethContents .bbsMainform > .formResult label {
  appearance: auto;
  margin-right: 80px;
}
.ethContents .bbsMainform > .formResult label > input, .ethContents .bbsAddform > dl label > input {
  width: 30px;
  height: 30px;
  vertical-align: baseline;
}
.ethContents .bbsMainform > .formResult label > span, .ethContents .bbsAddform > dl dd span {
  font-size: 19px;
  color: #333;
  line-height: 30px;
}
.ethContents .bbsMainform > .formPhone input:nth-child(2) {
  margin: 0 7px;
}
.ethContents .bbsMainform > .formPhone input::-webkit-outer-spin-button,
.ethContents .bbsMainform > .formPhone input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
.ethContents .bbsMainform > .formMail span {
  font-size: 19px;
  padding: 0 10px;
  color: #000;
}
.ethContents .bbsMainform > .formMail dd input {
  vertical-align: middle;
}
.ethContents .bbsMainform > .formContents dd textarea {
  width: 1030px;
  height: 350px;
  padding: 24px 30px 0 30px;
  font-size: 19px;
  word-break: keep-all;
  overflow-y: scroll;
  background: #f6f6f6;
  border: none;
  box-sizing: border-box;
}
.ethContents .bbsMainform > .formContents dd textarea::placeholder {
  font-size: 19px;
}
.ethContents .bbsMainform > .formContents dd textarea:focus {
  outline: 1px solid #111111;
}
.ethContents .bbsMainform > .formMail input.customInput {
  margin-right: 7px;
}
/* 22-07-29 수정 [S] */
.ethContents .bbsMainform > .formFile input.customInput {
  width: 900px;
}

.ethContents .bbsMainform .formFile {
  display: flex;
  padding: 20px 20px 15px;
  border-bottom: 2px solid #111;
  box-sizing: border-box;
}

.ethContents .bbsMainform .formFile .require{
  width : 210px;
}
.ethContents .bbsMainform .formFile .require label{
  font-size: 20px;
}
.ethContents .bbsMainform .formFile .form_wrap .form_contents{
  display: flex;
  align-items: center;
  margin-bottom : 15px;
  position : relative;
}

.ethContents .bbsMainform .formFile .form_wrap .form_contents .formFsrch input{
  width : 95px;
  height : 45px;
}

.ethContents .bbsMainform .formFile .form_wrap .form_contents .formFdelete{
  position : absolute;
  left: 850px;
}
#container .ethContents .bbsMainform > .formFile .btnS {
  padding: 0;
  width: 95px;
  height: 46px;
  text-align: center;
  font-size: 15px;
  line-height:44px;
  color: #000;
  float: right;
}
/* 22-07-29 수정 [E] */
#container .ethContents .bbsMainform > .formFile .btnS:hover,
#container .ethContents .bbsMainform > .formFile .btnS:focus {
  color: #ffffff;
}
.ethContents .bbsAddform {
  letter-spacing: -0.05em;
}
.bbsAddform .esgTitles {
  margin: 119px 0 37.5px;
}
.bbsAddform .esgTitles > h4 {
  margin-bottom: 67px;
}
.ethContents .bbsAddform > dl {
  padding: 24px 20px 30px;
}
.ethContents .bbsAddform > .addformKnow {
  padding: 24px 20px 4px;
}
.ethContents .bbsAddform > .addformLong {
  padding: 26px 20px 23px;
}
.ethContents .bbsAddform > dl dt > label {
  font-size: 19px;
  color: #000;
}
.ethContents .bbsAddform > dl .aformRadio {
  margin: 20px 0 0 10px;
}
.ethContents .bbsAddform > dl .aformRadio label {
  margin:0  75px 20px 0;
}
.ethContents .bbsAddform > .addformKnow .aformRadio span {
  margin-bottom: 20px;
}
.ethContents .bbsAddform > dl dd > input {
  width: 1220px;
  margin: 15px 0 0 10px;
  outline: 0;
}
.ethContents .bbsAddform > dl dd > input:focus {
  outline: 1px solid #111111;
}
.ethContents .bbsForm > .bbsMainform > .formContents {
  border-top: none;
  padding: 0 20px 20px;
}
.ethContents .bbsForm > .bbsMainform > .formContents dt {
  margin-top: 20px;
}
.ethContents .bbsFormbtn {
  text-align: center;
  margin-top: 100px;
}
.ethContents .bbsFormbtn > a {
  color: #fff;
}
.ethContents .bbsFormbtn > .save {
  margin-right: 9px;
}
#container .ethContents .bbsFormbtn > .cancel {
  color: #111;
  background: #fff;
  border: 1px solid #111;
}
#container .ethContents .bbsFormbtn > .cancel:hover,
#container .ethContents .bbsFormbtn > .cancel:focus{
  color: #ffffff;
  background: #21847c;
  border: 1px solid #21847c;
}
.ethContents .bbsAddform > dl:last-child {
  padding: 27px 20px 24px;
  border-bottom: 2px solid #111;
  box-sizing: border-box;
}
.ethContents .anonymousForm {
  display: none;
}
/* 04_02_03 */
.ethContents .tipComplete {
  text-align: center;
}
.ethContents .tipComplete > h3 {
  font-size: 30px;
  line-height: 44px;
  font-weight: 400;
  color: #111;
  letter-spacing: -0.05em;
}
.ethContents .tipComplete > ul {
  height: 111px;
  margin: 142px 0 100px;
  background: #f7f7f7;
  padding: 28px 0;
}
.ethContents .tipComplete > ul li {
  line-height: 36px;
  color: #333;
  letter-spacing: -0.05em;
}
.ethContents .tipComplete > ul li > a {
  color: #333;
}

/* 04_02_04_01 */
.ethContents > .tipCheck {
  text-align: center;
}
.ethContents > .tipCheck > h3 {
  font-size: 50px;
  line-height: 50px;
  font-weight: 400;
  color: #111;
}
.ethContents > .tipCheck > ul {
  margin: 31px 0 145px;
}
.ethContents > .tipCheck li {
  font-size: 19px;
  line-height: 30px;
  color: #333;
  letter-spacing: -0.05em;
}
.tipLogin {
  width: 504px;
  margin: 0 auto;
  overflow: hidden;
}
.tipLogin > ul {
  float: left;
}
.tipLogin > ul input {
  width: 350px;
  outline: 0;
}
.tipLogin > ul input:focus {
  border: 1px solid #000;
  padding-left: 14px;
}
.tipLogin > ul li:first-child {
  margin-bottom: 20px;
}
.ethContents .tipLogin button {
  float: right;
  width: 134px;
  height: 112px;
  font-size: 20px;
  color: #fff;
  background: #111;
}


/************* groupNews*******************/
.groupNews .newsTop {
  overflow: hidden;
}
.groupNews .gnTitle > p {
  float: left;
  font-size: 30px;
  font-weight: 400;
  color: #000;
  line-height: 1;
  letter-spacing: -0.03em;
}
.groupNews .gnTitle > p > span {
  font-size: 42px;
  color: #21847c;
}
.groupNews .newsTop > form {
  float: right;
}
.groupNews .newsBox .nodata {
  width: 100%;
  padding: 115px 0;
  text-align: center;
}
.groupNews .newsBox .nodata > span {
  padding-top: 120px;
  text-align: center;
  font-size: 24px;
  line-height: 30px;
  color: #111;
}
.groupNews .newsBox > ul {
  display: flex;
  flex-wrap: wrap;
  /* justify-content: space-between; */
  align-items: flex-start;
  letter-spacing: -0.05em;
}
.groupNews .newsBox .newsList {
  width: 400px;
  margin-top: 80px;
  margin-left: 40px;
}
.groupNews .newsBox .newsList:first-child,
.groupNews .newsBox .newsList:nth-child(3n + 1) {
  margin-left:0;
}
.groupNews .newsBox .newsList .newsImg {display:block; position:relative; width:400px; height:280px; overflow: hidden; text-align: center; }
.groupNews .newsBox .newsList .newsImg .img {display:block; margin:0 auto; width:400px; height:280px; object-fit: cover; overflow: hidden;width:70%; opacity: 0;  transform: translateY(100%);  transition: all 1s cubic-bezier(0.215, 0.61, 0.355, 1), opacity .5s; background: no-repeat 50% 50%; }
.groupNews .newsBox .newsList.scroll_ON .newsImg .img {width:100%; transform: translateY(0);  opacity: 1; }
.groupNews .newsBox .newsList.scroll_ON .newsImg:hover .img {  transform: scale(1.2) translateY(0)}
.groupNews .newsBox .newsList img {  display:block; margin:0 auto;  width:70%;  opacity:0;  transform: scale(1) translateY(100%);  transition:  all 1s 0s cubic-bezier(0.215, 0.61, 0.355, 1), opacity .5s; height: 280px; object-fit: cover;}
.groupNews .newsBox .newsList.scroll_ON .newsImg:hover img {  transform: scale(1.2) translateY(0);}
.groupNews .newsBox .newsList.scroll_ON img {  width:100%;   opacity:1;  transform: scale(1) translateY(0);}
.groupNews.viewNone .newsBox .newsList .newsImg:hover img {  transform: scale(1) translateY(0);}
.groupNews.viewNone .newsBox .newsList > a{cursor: default;}

.groupNews .newsList > a{
  display: block;
  text-decoration: none;
}
.groupNews .newsList > a > .groupTag {
  display: block;
  margin: 12px 0 3px;
  color: #3a6261;
}
.groupNews .newsList > a > .tit {
  display: block;
  width: 320px;
  height: 60px;
  word-break: keep-all;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  line-height: 30px;
  font-size: 24px;
  color: #111;
  letter-spacing: -0.05em;
}
.groupNews .newsList > a > .newsDate {
  display: block;
  font-size: 15px;
  color: #666;
  margin-top: 12px;
  padding-bottom: 11px;
  border-bottom: 1px solid #ccc;
  box-sizing: border-box;
}
.groupNews .newsList > .newsTag {
  overflow: hidden;
  width: 320px;
  height: 56px;
}
.groupNews .newsList > .newsTag li {
  float: left;
  line-height: 15px;
  margin-right: 24px;
  margin-top: 11px;
}
.groupNews .newsList > .newsTag a {
  text-decoration: none;
  font-size: 15px;
  color: #7f6c66;
  letter-spacing: -0.025em;
}

.newsMore,
.contentsMore {
  margin-top: 80px;
  text-align: center;
 }
.newsMore .more {
  display: block;
  margin: 0 auto;
  padding: 0;
  text-align: center;
  width: 90px;
  min-width: 80px;
  color: #000;
}


/************** groupSocial ****************/
.groupSocial > div:first-child > .socialMain {
  overflow: hidden;
}
.groupSocial .smainLeft {
  float: left;
}
.groupSocial .smainLeft .socialVideo {
  width: 840px; height: 472px;
}
.groupSocial .socialVideo img {
  width: 100%;
  height: 100%;
}

.groupSocial .smainRight {
  width: 320px;
  padding: 0 60px;
  float: right;
  word-break: keep-all;
}
.groupSocial .smainRight > p {
  margin-top: 41px;
  font-size: 30px;
  color: #000;
  letter-spacing: -1px;
  line-height: 40px;
}
.groupSocial .smainRight > span {
  display: block;
  margin: 26px 0 53px;
  color: #333;
  line-height: 30px;
}
.groupSocial .smainList {
  margin-top: 72px;
  padding-bottom: 80px;
}
.groupSocial .socialList .nodata {
  width: 100%;
  height: 275px;
  padding-top: 115px;
  margin-right: 0;
  text-align: center;
}
.groupSocial .socialList .nodata > span {
  padding-top: 120px;
  text-align: center;
  font-size: 24px;
  line-height: 30px;
  color: #111;
}
.groupSocial .smainList > ul, .groupSocial .socialList {
  overflow: hidden;
}
.groupSocial .smainList li, .groupSocial .socialList > li {
  float: left;
  width: 400px;
  height: 230px;
  position: relative;
  margin-right: 40px;
  overflow: hidden;
}
.groupSocial .smainList li:nth-child(3n), .groupSocial .socialList > li:nth-child(3n) {
  margin-right: 0;
}
.groupSocial .smainList li a, .groupSocial .socialList > li a {
  display: block;
  transform: translateY(100%);
  transition: all 1s 0s cubic-bezier(0.215, 0.61, 0.355, 1), opacity .5s;
}
.groupSocial .smainList li.scroll_ON a, .groupSocial .socialList > li.scroll_ON a {
  transform: translateY(0);
  text-align: center;
}
.groupSocial .smainList li a img, .groupSocial .socialList > li a img {
  width: 70%;
  margin: auto;
  opacity: 0;
  transform: scale(1) translateY(100%);
  transition: all 1s 0s cubic-bezier(0.215, 0.61, 0.355, 1), opacity .5s;
}
.groupSocial .smainList li.scroll_ON a img, .groupSocial .socialList > li.scroll_ON a img {
  width: 100%;
  opacity: 1;
  transform: scale(1) translateY(0);
}
/*.groupSocial ul > .socialLast {
  margin-right: 0;
}*/
.groupSocial .smainList li > a:hover > span,
.groupSocial .socialList > li > a:hover > span,
.groupSocial .smainList li > a:focus > span,
.groupSocial .socialList > li > a:focus > span {
  visibility: visible;
  transform: translateY(0);
  transition: 0.5s;
}
.groupSocial .smainList li > a:focus:after,
.groupSocial .socialList li > a:focus:after{
  box-sizing: border-box;
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  bottom:0;
  right:0;
  border: 3px solid black;
  z-index: 10;
  content:""
}
.groupSocial .smainList li a > span, .groupSocial .socialList li a > span {
  display: block;
  width: 400px;
  height: 110px;
  position: absolute;
  top: 0;
  bottom: 0;
  transform: translateY(100%);
  padding: 60px 0;
  text-align: center;
  font-size: 24px;
  line-height: 35px;
  color: #fff;
  background: rgba(0,0,0,0.8);
  visibility: hidden;
  transition: 0.5s;
}
.groupSocial .socialBox {
  padding-top: 73px;
  padding-bottom: 60px;
  border-top:1px solid #999;
}
.groupSocial .socialBox:last-child {
  padding-bottom: 0px;
}
.groupSocial .socialBox > h4 {
  text-align: center;
  font-size: 30px;
  font-weight: 400;
  color: #000;
  line-height: 40px;
  letter-spacing: -0.025em;
}
.groupSocial .socialBox > .socialList {
  margin-top: -6px;
}
.groupSocial .socialBox li {
  margin-top: 40px;
}
.groupSocial .socialBox > a {
  display: block;
  margin: 0 auto;
  padding: 0;
  text-align: center;
  width: 80px;
  min-width: 80px;
  color: #000;
}
.groupSocial .socialBox:last-child > a {
  margin: 0 auto 120px;
}
.groupSocial .contentsMore {
  margin-top: 40px;
}
.socialPopup {
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  align-content: center;
  box-sizing: border-box;
  z-index: 99;
}
.socialPopup > .popVideo {
  width: 841px;
  height: 559px;
  padding: 70px 60px 60px;
  background: #fff;
  position: relative;
  top: 50%;
  left: 50%;
  transform: translateX(-50%);
  z-index: 50;
  margin-top: -279.5px;
}
.popBg {
  position: fixed;
  top: 0;
  left: 0;
  width: calc(100% - 17px);
  height: 100%;
  background: rgba(0,0,0,0.5);
  z-index: 49;
}
.socialPopup > .popVideo > .txt {
  margin-top: 23px;
  font-size: 24px;
  line-height: 30px;
  height:65px; overflow: auto;
  color: #111;
}
.socialPopup > .popVideo a {
  position: absolute;
  top: 30px;
  right: 40px;
  display: block;
  width: 21px;
  height: 21px;
  background: url("../../../images/group/ko/social_popup_close.png") no-repeat center center / 21px auto;
}


/******* groupSearch *******/
.groupNews .gnsrchBtn {
  position: relative;
  width: 460px;
  height: 66px;
  margin: 0 auto;
  border-bottom: 6px solid #000;
  box-sizing: border-box;
}
.groupNews .gnsrchBtn > button {
  position: absolute;
  right: 0;
  top: 0;
  width: 50px;
  height: 66px;
  background: url("../../../images/group/ko/gn_04_01_srchbtn.png") no-repeat right 9px;
}
.groupNews .gnsrchBtn > input {
  width: 400px;
  height: 48px;
  font-size: 24px;
  font-weight: 700;
  color: #000;
  border: none;
  outline: none;
}
.groupNews .gnsrchBtn > input::placeholder {
  color: #000;
}
.groupNews .gnsrchBtn > input:focus {
  border: 1px solid #111;
}
.groupNews .gnsrchTitle > p {
  padding-bottom: 23px;
  border-bottom: 2px solid #000;
  box-sizing: border-box;
  font-size: 30px;
  line-height: 30px;
  color: #000;}
.groupNews .gnsrchList .newsBox {
  margin-top: -20px;
}
.groupNews .gnsrchList {
  margin-top: 118px;
}
.groupNews .gnsrchList .socialBox {
  padding: 26px 0 0;
  border: none;
}
.groupNews .gnsrchList:nth-child(2) {
  margin-top: 78px;
}
.groupNews .gnsrchList .contentsMore {
  margin-top: 80px;
}

.groupNews .gnsrchList.viewNone .newsBox li a{cursor:default;}
.groupNews .gnsrchList.viewNone .newsBox li a:hover .newsImg img{transform: scale(1);}

/******** HR Cont  *****************/
.esgOperation.HR {margin-top:215px;}
.headerVisual.HR .visual .img {background-image: url('../../../images/group/ko/subVisual_HR.jpg');}
#lnbWrap ul.left_nav li.linkIco a{position:relative;}
#lnbWrap ul.left_nav li.linkIco a:before{position:absolute;top:50%;right:-20px;width:12px;height:12px;margin-top:-6px;background: url('../../../images/group/ko/ico_submenu_link.jpg') no-repeat center center;content:"";}

/***    footer    ***********/
.footerWrap {
  width: 100%;
  background: #3e3e3e;
  position:relative;
  z-index:10;
}
.footer {
  width: 1280px;
  margin: 0 auto;
  padding: 117px 0 55px;
  overflow: hidden;
}
.footer, .footer a {
  color: #fff;
}
.footer a:hover { text-decoration: none; }
.footer > .footLogo img {
  display: block;
  margin-bottom: 62px;
}
.footer > .footLeft {
  display: inline-block;
  width: 1056px;
  vertical-align: top;
}
.footer .footList {
  overflow: hidden;
  margin-bottom: 73px;
}
.footer .footList > li {
  float: left;
  margin-right: 65px;
}
.footer .footList > li > a {
  font-size: 25px;
  font-weight: bold;
}
.footer .fListSub {
  margin-top: 14px;
}
.footer .fListSub > li a {
  display: block;
  line-height: 33px;
}
.footer > .footRight {
  width: 220px;
  display: inline-block;
  vertical-align: top;
}
.footer .footInfo {
  padding-bottom: 35px;
  border-bottom: 1px solid #252525;
}
.footer .footInfo > li {
  line-height: 40px;
}
.footer .footInfo > li a {
  padding-left: 3px;
  display: block;
}
.footer .footSite > div {
  position: relative;
}
.footer .footSite > div.open .dropDown ,
.footer .footSite.focus > div .dropDown {
  opacity: 1;
  visibility: visible;
}
.footer .footSite > div.open p > a {
  background-image: url("../../../images/group/ko/foot_form_arrowup.png");
}
.footer .footSite p > a {
  display: block;
  padding: 0 20px 0 26px;
  width: 220px;
  height: 45px;
  line-height: 39px;
  letter-spacing: 0;
  font-size: 16px;
  background-color: #3e3e3e;
  border: 2px solid #252525;
  color: #fff;
  background: url("../../../images/group/ko/foot_form_arrow.png") no-repeat 189px center / 12px auto;
}
.footer .footSite .dropDown {
  position: absolute;
  left: 0;
  bottom: 45px;
  width: 220px;
  height: 355px;
  padding: 13px 0;
  background: #fff;
  overflow-y: scroll;
  opacity: 0;
  visibility: hidden;
}
.footer .footSite .dropDown > li a {
  display: block;
  padding: 0 15px 0 27px;
  line-height: 40px;
  color: #999;
}
.footer .footSite .dropDown > li:hover a {
  color: #111;
}
/*.footer .footMark {
  margin-top: 43px;
}*/
/* 접근성 마크 획득 후 삭제 처리 */
.footer .footMark li + li{
  margin-top: 20px;
}
.footer .footMark .markMid {
  margin: 20px 0 25px;
}
.footer .footMark a {
  font-size: 15px;
  display: block;
}

.footer .footMark .markMid a > * {
  display: inline-block;  
  vertical-align: middle;
  line-height: 1.4;
}
.footer .footMark img {
  margin-right: 17px;
  vertical-align: middle;
}
.footer .footMark span {
  vertical-align: middle;
}
.footer .footSns {
  margin: 99px 0 25px;
  overflow: hidden;
}
.footer .footSns > li {
  float: left;
  margin-right: 14px;
}
.footer .footSns .fbIcon > a, .footer .footSns .ytIcon > a {
  display: block;
  width: 38px;
  height: 38px;
  background: url("../../../images/group/ko/foot_icon_facebook.png") no-repeat center center;
}
.footer .footSns .ytIcon > a {
  background-image: url("../../../images/group/ko/foot_icon_youtube.png");
}
.footer .footForm option {
  color: #000;
}
.footer .footCompany > ul {
  width: 800px;
  padding-top: 36px;
  font-size: 15px;
  font-weight: 300;
  border-top: 1px solid #252525;
}
.footer .footCompany li {
  line-height: 30px;
  letter-spacing: 0;
}
.top_btn{position: fixed; right: 60px; bottom: 60px; z-index: 32;}
.top_btn.btm{position: absolute; right: 60px; top: -103px; z-index: 32;}
.top_btn.on{z-index: 30;}
.top_btn .top{display: block; width: 43px; height: 43px; font-size: 0; text-indent: -9999px; background:#111 url("../../../images/group/ko/top_btn.png") no-repeat center center;}
.linkIco a{position:relative;padding-right:22px;}
.linkIco a:before{position:absolute;top:7px;right:0;width:12px;height:12px;background:url("../../../images/group/ko/bg_link_ico_common.png") no-repeat center center;content:"";}
.fListSub .linkIco a:before{top:9px;}

/* 그룹소식  계열사 더보기 */
.groupNews .newsTop{overflow:inherit;display:flex;width:100%;justify-content:space-between;}
.groupSelect{position:relative;min-width:150px;}
.groupSelect a{color:#000;font-size:14px;}
.groupSelect a:hover{text-decoration:none;}
.groupSelect > a{position:relative;z-index:3;display:block;margin:1px 0 0 1px;padding:0 14px;line-height:42px;background-color:#f7f7f7;}
.groupSelect > a:after{position:absolute;top:50%;right:10px;width:8px;height:8px;margin-top:-8px;transform: rotate(135deg);border-top:1px solid #111;border-right:1px solid #111;content:"";}
.groupSelect > a.active:after{margin-top:-4px;transform: rotate(315deg);}
.groupSelect ul{display:none;position:absolute;top:0;padding-top:44px;z-index:2;width:100%;transition: ease .5s all;background-color:#fff;border:1px solid #111;}
.groupSelect ul li a{display:block;padding:2px 10px;line-height:30px;}
.groupSelect ul li a:hover{background-color:#f5f5f5}
.groupSelect > a.active + ul{display:block;}

/* 2021-10-15 그룹사 추가건 */
.groupAdarea .groupAd + .groupAd {margin-top:80px;}
.groupAdarea .groupAd p {color:#333; font-size:30px;}
.groupAdarea .groupAd p em {font-size:42px; color:#0f9a6f;}
.groupAdarea .groupAd > ul {position: relative; margin-top:85px;}
.groupAdarea .groupAd > ul:after {display: block; clear: both; content: "";}
.groupAdarea .groupAd > ul > li {float: left; margin-right: 30px;}
.groupAdarea .groupAd > ul > li:nth-child(3n) {margin-right:0;}
.groupAdarea .groupAd > ul > li:nth-child(n+4) {margin-top:30px;}/* 2022-07-06 추가 */
.layerArea {display: none; align-items: center; justify-content: center; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 2000; padding: 5.55555555556%; box-sizing: border-box; z-index: 1000;}
.layerArea:before {content: ""; position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0, 0, 0, 0.6);} 
.layerArea .image {position: relative; padding:85px 40px 45px; background: #fff; box-sizing: border-box; z-index: 100;}
.layerArea .image .layerClose {position: absolute; top:30px; right:30px; width:21px; height:21px; background:url("../../../images/group/ko/close_btn.png") no-repeat center center; background-size:cover; text-indent: -9999px;}

.advertise em {line-height: initial; margin-top:20px;}
.advertise .videoArea {width:100%; max-height: 720px; height: 720px; margin-top:110px;}
.advertise .introTop > .text {margin-top:0; transition: .5s}
.advertise .introTop > em {transition: .5s .4s;}



/* 2023-04-28 esg 추가 [S] */
section.w-full   {width:100%; margin:0 auto;}

.esgOperation .esgGoal.ko {width: 100%; height: 1537px; margin: 0 auto; background: url("../../../images/group/ko/esg_01_01_goal_ko.png") no-repeat center center; background-color: none; position: relative; margin: 200px 0; padding: unset;}
.esgOperation .esgGoal.ko ul {width: 900px; color: #111; display: flex; align-items: center; justify-content: space-between; text-align: center; position: absolute; top: 100px; left: 50%; transform: translateX(-50%); margin-left: 146px;}
.esgOperation .esgGoal.ko ul:nth-child(1) li:nth-child(3) {margin-top:80px;}
.esgOperation .esgGoal.ko ul:nth-child(2) {top: 698px;}
.esgOperation .esgGoal.ko ul:nth-child(2) li:nth-child(3) {margin-top: 74px;}
.esgOperation .esgGoal.ko ul:last-child {top: 1297px;}
.esgOperation .esgGoal.ko ul strong { font-size: 30px; line-height: 40px; letter-spacing: -0.025em; }
.esgOperation .esgGoal.ko ul p { margin-top: 20px; margin-bottom: 0; font-size: 24px; line-height: 35px;}
.esgOperation .esgGoal.ko ul span { font-size: 19px; line-height: 30px;}
.esgOperation .esgGoal.ko ul li .en, .esgOperation .esgGoal.ko ul li .en span {font-size: 40px; font-weight: 600; color: #538881;}
.esgOperation .esgGoal.ko ul li .en span {color: #000000;}
.esgOperation .esgGoal.ko ul li:nth-child(1) {width: 270px;}
.esgOperation .esgGoal.ko ul li:nth-child(2) {width: 250px; padding: 0 48px;}
.esgOperation .esgGoal.ko ul li:nth-child(3) {width: 273px;}
.esgOperation .esgGoal.ko ul:nth-child(2) li .en {color: #e5866d;}
.esgOperation .esgGoal.ko ul:last-child li .en {color: #8b6b59;}

.businessDirectWrap .businessDirectList > li > p.ko{font-size: 19px; line-height: 40px;}

.valuePracticeList > li p.ko {
  margin-bottom: 35px; 
  padding-bottom: 45px; 
  color: #333333; 
  border-bottom: 1px solid #cccccc;
}
.valuePracticeList > li.type2 p.ko {
  margin-bottom:0; 
  padding-bottom:0; 
  color: #333333; 
  border-bottom:0 none; 
}
.esgOperation .environList.ko {
  width: 1845px;
  margin: 0 auto;
  position: relative;
  padding: unset !important;
}
.esgOperation .environList.ko h4 {
  background: unset !important;
  background-image: unset !important;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: auto !important;
  height: auto !important;
}
.esgOperation .environList.ko p {
  position: absolute;
  margin: unset !important;
}
.esgOperation .environList.ko p em {
  display: block;
  font-size: 19px;
  font-weight: 600;
  color: #666666;
  letter-spacing: -0.05em;
  padding-bottom: 8px;
  line-height: 1;
}
.esgOperation .environList.ko p span{
  display: block;
  font-size: 19px;
  font-weight: 400;
  line-height: 32px;
  color: #666666;
}

.esgOperation .environList.ko .enListcampain {
  height: 1106px;
  margin-bottom: 175px !important;
}
.esgOperation .environList.ko .enListcampain::before {
  content: '';
  background: url("../../../images/group/ko/esg_down_bg_01.png") no-repeat;
  background-size: cover;
  position: absolute;
  top: 0;
  right: 550px;
  width: 658px;
  height: 1106px;
}

.esgOperation .environList.ko .enListcampain .txt-01 {bottom: 160px; left: 286px;}
.esgOperation .environList.ko .enListcampain .txt-02 {bottom: 127px; right: 570px;}

.esgOperation .environList.ko > .enListeco p {margin: unset !important;}

.esgOperation .environList.ko .enListeco {height: 1430px; margin-bottom: 278px;}
.esgOperation .environList.ko .enListeco::before {
  content: '';
  background: url("../../../images/group/ko/esg_down_bg_02.png") no-repeat;
  background-size: cover;
  position: absolute;
  top: 275px;
  right: 486px;
  width: 470px;
  height: 1072px;
}
.esgOperation .environList.ko .enListclimate {height: 1013px; margin-bottom: 73px;}
.esgOperation .environList.ko .enListclimate::before {
  content: '';
  background: url("../../../images/group/ko/esg_up_bg_01.png") no-repeat;
  background-size: cover;
  position: absolute;
  top: 165px;
  left: 188px;
  width: 1421px;
  height: 852px;
}
.esgOperation .environList.ko .enListclimate .txt-01 {bottom: 210px; left: 516px;}
.esgOperation .environList.ko .enListclimate h4 {top: 0;}
.esgOperation .environList.ko .enListclimate .enImg1 {
  top: 103px;
  right: 217px;
  width: 1120px;
  height: 622px;
}

.esgOperation .environList.ko .enListworkplace {height: 1140px;}
.esgOperation .environList.ko .enListworkplace::before {
  content: '';
  background: url("../../../images/group/ko/esg_up_bg_02.png") no-repeat;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 333px;
  width: 965px;
  height: 1138px;
}
.esgOperation .environList.ko .enListworkplace h4 {top: 130px;}
.esgOperation .environList.ko .enListworkplace .txt-01 {bottom: 298px; left: 320px;}
.esgOperation .environList.ko .enListworkplace .enImg1 {
  top: 298px;
  left: 300px;
  width: 642px;
  height: 481px;
}
.esgOperation .environList.ko .enListworkplace .enImg2 {
  top: 538px;
  right: 383px;
  width: 581px;
  height: 550px;
}

.esgOperation .environList.ko .enListcampain h4 {top: 100px;}
.esgOperation .environList.ko .enListeco h4 {top: 493px;}

.esgOperation .environList.ko .enListeco .txt-01 {top: 650px; left: 268px;}
.esgOperation .environList.ko .enListeco .txt-02 {bottom: 390px; right: 290px;}
.esgOperation .environList.ko .enListeco .txt-03 {bottom: 0; left: 268px;}
.esgOperation .environList.ko .enListeco .enImg1 {
  top: 0;
  left: 0;
  width: 694px;
  height: 633px;
}
.esgOperation .environList.ko .enListeco .enImg2 {
  top: 363px;
  right: 200px;
  width: 578px;
  height: 568px;
  z-index: 1;
}
.esgOperation .environList.ko .enListeco .enImg3 {
  top: 800px;
  left: 268px;
  width: 871px;
  height: 522px;
}

.esgOperation .environList.ko .enImg {position: absolute; margin: unset !important;}
.esgOperation .environList.ko .enListcampain .enImg1 {
  top: 45px;
  left: 246px;
  width: 563px;
  height: 408px;
  z-index: 1;
}
.esgOperation .environList.ko .enListcampain .enImg1 img {width: 100%;}
.esgOperation .environList.ko > li div.scroll_ON > img {transform: translateY(0%) scale(1);}
.esgOperation .environList.ko .enListcampain .enImg2 {
  top: 400px;
  left: 53px;
  width: 600px;
  height: 400px;
}
.esgOperation .environList.ko .enListcampain .enImg3 {
  top: 400px;
  right: 217px;
  width: 607px;
  height: 493px;
}

.esgOperation .environList.ko > li {padding-bottom: unset;}

.esgOperation .esgEchart {
  position: relative;
  padding-bottom: 470px;
  width: 1280px;
  margin: 0 auto;
}
.esgOperation .esgEchart .title {
  position: absolute;
  top: 33px; left: 605px;
  font-size: 32px;
  font-weight: 600;
  line-height: 30px;
  letter-spacing: -0.05em;
  color: #111111;
}

.esgGovernance.w-full .esgloadmap {
  width: 100%;
  max-width: 2208px;
  height: 816px;
  margin: 0 auto;
  background: url(../../../images/group/ko/esg08_top_img1_ko.png) no-repeat center center;
  position: relative;
}

.esgGovernance.w-full .esgloadmap h4 {
  font-size: 30px;
  line-height: 35px;
  letter-spacing: -0.05em;
  color: #111;
  position: absolute;
  top: 29px;
  left: 600px;
}
.esgGovernance.w-full .esgloadmap-contents {
  max-width: 1280px;
  margin: 0 auto;
  height: 100%;
  position: relative;
}
.esgGovernance.w-full .esgloadmap-contents p {
  font-size: 24px;
  font-weight: 400;
  line-height: 35px;
  letter-spacing: -0.05em;
  color: #757575;
  text-align: center;
}
.esgGovernance.w-full .esgloadmap-contents .bold {
  font-size: 24px;
  font-weight: 600;
  line-height: 35px;
  letter-spacing: -0.05em;
  color: #757575;
}
.esgGovernance.w-full .esgloadmap-contents .top {
  position: absolute;
  top: 250px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 420px;
  width: 100%;
  margin-left: -5px;
}
.esgGovernance.w-full .esgloadmap-contents .top .box2 p,
.esgGovernance.w-full .esgloadmap-contents .top .box2 .bold {color: #ffffff;}

.esgGovernance.w-full .esgloadmap-contents .btm {
  position: absolute;
  top: 550px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 372px;
  width: 100%;
  margin-left: 10px;
}
.esgGovernance.w-full .esgloadmap-contents .btm .box2 .bold {color: #e5866d;}
.esgGovernance.w-full .esgloadmap-contents .box1,
.esgGovernance.w-full .esgloadmap-contents .box2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.esgGovernance.w-full .esgloadmap-contents .top .box1,
.esgGovernance.w-full .esgloadmap-contents .top .box2 {gap: 50px;}
.esgGovernance.w-full .esgloadmap-contents .btm .box1 {gap: 30px;}
.esgGovernance.w-full .esgloadmap-contents .btm .box2 {gap: 43px;}

.esgGovernance.w-full .governance {
  max-width: 1280px;
  margin: 0 auto;
}

.foundationWrap.ko .esgTitle.fixChk {margin-bottom: 50px;}

.governance .business.ko dl dd {
  font-size: 17px;
  line-height: 30px;
}

.esgresponsibilitylist.ko {
  position: relative;
  width: 1618px;
  margin: 197px auto 0;
}
.esgresponsibilitylist.ko h4 {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  opacity: 0;
  transition: 1.5s cubic-bezier(0,.88,.56,.64);
}
.esgresponsibilitylist.ko li.fixChk.scroll_ON h4 {opacity: 1;}
.esgresponsibilitylist.ko .enImg {
  position: absolute;
  overflow: hidden;
}
.esgresponsibilitylist.ko .enImg img {
  transform: translateY(50%) scale(1.3);
  opacity: 0;
  transition: 1.5s cubic-bezier(0,.88,.56,.64);
}
.esgresponsibilitylist.ko .enImg.scroll_ON img {
  transform: translateY(0%) scale(1);
  opacity: 1;
}
.esgresponsibilitylist.ko p {position: absolute;}
.esgresponsibilitylist.ko p em {
  display: block;
  font-size: 19px;
  font-weight: 600;
  color: #111111;
  letter-spacing: -0.05em;
  padding-bottom: 8px;
  line-height: 1;
}
.esgresponsibilitylist.ko p span {
  display: block;
  font-size: 19px;
  font-weight: 400;
  line-height: 32px;
  color: #666666;
}

.esgresponsibilitylist.ko .childitem {
  position: relative;
  width: 100%;
  height: 2150px;
}
.esgresponsibilitylist.ko .teenageritem {
  position: relative;
  width: 100%;
  height: 1435px;
  margin-top: 254px;
}
.esgresponsibilitylist.ko .underprivilegeditem {
  position: relative;
  width: 100%;
  height: 2180px;
  margin-top: 190px;
}

.esgresponsibilitylist.ko .childitem h4 {top: 60px;}
.esgresponsibilitylist.ko .childitem .enImg1 {top: 0; left: 148px;}
.esgresponsibilitylist.ko .childitem .enImg2 {top: 426px; right: 0;}
.esgresponsibilitylist.ko .childitem .enImg3 {top: 1038px; left: 0;}
.esgresponsibilitylist.ko .childitem .enImg4 {bottom: 115px; right: 110px;}
.esgresponsibilitylist.ko .childitem .txt-01 {top: 707px; left: 148px;}
.esgresponsibilitylist.ko .childitem .txt-02 {top: 1030px; right: 372px;}
.esgresponsibilitylist.ko .childitem .txt-03 {bottom: 320px; left: 148px;}
.esgresponsibilitylist.ko .childitem .txt-04 {bottom: 0; right: 110px;}

.esgresponsibilitylist.ko .teenageritem .enImg1 {top: 0; left: 70px;}
.esgresponsibilitylist.ko .teenageritem .enImg2 {top: 170px; right: 190px;}
.esgresponsibilitylist.ko .teenageritem .enImg3 {top: 482px; right: 110px;}
.esgresponsibilitylist.ko .teenageritem .enImg4 {bottom: 115px; right: 190px;}
.esgresponsibilitylist.ko .teenageritem .txt-01 {top: 650px; left: 148px;}
.esgresponsibilitylist.ko .teenageritem .txt-02 {bottom: 0; right: 358px;}

.esgresponsibilitylist.ko .underprivilegeditem h4 {top: 60px;}
.esgresponsibilitylist.ko .underprivilegeditem .enImg1 {top: 0; left: 148px;}
.esgresponsibilitylist.ko .underprivilegeditem .enImg2 {top: 426px; right: 0;}
.esgresponsibilitylist.ko .underprivilegeditem .enImg3 {bottom: 465px; left: 0;}
.esgresponsibilitylist.ko .underprivilegeditem .enImg4 {bottom: 138px; right: 110px;}
.esgresponsibilitylist.ko .underprivilegeditem .txt-01 {top: 704px; left: 148px;}
.esgresponsibilitylist.ko .underprivilegeditem .txt-02 {top: 1038px; right: 214px;}
.esgresponsibilitylist.ko .underprivilegeditem .txt-03 {bottom: 348px; left: 150px;}
.esgresponsibilitylist.ko .underprivilegeditem .txt-04 {bottom: 0; right: 169px;}

.awards.ko .foundation .awardsList .awardsProgress .bg{height: 2293px;}
.awards.ko .foundation .awardsList .awardsProgress .move {max-height: 2292px;}
.awards.ko .international .awardsList .awardsProgress .bg {height: 867px;}
.awards.ko .international .awardsList .awardsProgress .move {max-height: 868px;}

/* 2023-04-28 esg 추가 [E] */


/* 2023-05-31 esg 수정 [S] */
.governance .squad .memberList ul.mem_slide .member ul li {font-size: 15px; line-height: 25px; letter-spacing: -0.05em; color: #111111;}
.governance .squad .memberList ul.mem_slide .member ul li:before {top: 11px;}
.governance .squad .memberList ul.mem_slide .layer ul li {font-size: 15px; line-height: 25px; letter-spacing: -0.05em;}
.governance .squad .memberList ul.mem_slide .layer ul {margin: 0 32px;}
.awards.ko .international .awardsList .awardsProgress .bg {max-height: 860px;}
.awards.ko .international .awardsList .awardsProgress .move {max-height: 860px;}
.awards.ko .domestic .awardsList .awardsProgress .bg {height: 2109px;}
.awards.ko .domestic .awardsList .awardsProgress .move {height: 2109px; max-height: 2109px;}
/* 2023-05-31 esg 수정 [E] */