@CHARSET "UTF-8";

*, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
* {font-family: 'Noto Sans KR', sans-serif;}

body {font-family: 'Noto Sans KR', sans-serif;}
body {margin: 0px; padding: 0px;  line-height: 1.2; letter-spacing: -0.5px !important; color:#333333; font-size: 0.875em;}
ul, ol, dl, li {list-style: none; padding:0; margin:0}
dt, dd {margin:0;padding:0}
a {text-decoration: none; color:#333333}
a:HOVER {color:#007ab3}
p {padding:0;margin:0}
figure {margin:0;padding:0}
figcaption {margin:10px 0;}
img {border:0; max-width: 100%;}
em {font-style: normal; font-weight:bold; color:#007ab3; margin: 0 3px;}
button, select {cursor: pointer; border-radius: 0;}
input[type=text] {border-radius: 0;}
input[type=radio],
input[type=checkbox] {vertical-align: middle;}
h1,h2,h3,h4 {margin:0;font-size:105%; font-family: 'NanumSquare' !important;}

/* IE8 이하를 위해 선언*/
aricle,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary {display:block;}

.vsh {visibility: hidden;}
.dpn {display:none !important;}
.dpb {display:block !important;}
.tac {text-align: center !important;}
.tal {text-align: left !important;}
.tar {text-align: right !important;}
.br0 {border-right: 0 !important;}

.useN {display: none !important;}

.wbka {word-break: keep-all !important;}

.cfff {color: #ffffff !important;}
.c666 {color: #666666 !important;}

.text-em1 {color: #00abd4; font-weight: 500;}
.text-em2 {color: #222222; font-weight: 500;}
.text-em3 {color: #111111; font-weight: 500;}
.text-em4 {color: #999999; font-weight: 400; font-size: 14px;}
.text-size12 {font-size: 12px !important;}
.text-size14 {font-size: 14px !important;}
.text-size15 {font-size: 15px !important;}
.text-size16 {font-size: 16px !important;}

.fw400 {font-weight: 400 !important;}
.fw500 {font-weight: 500 !important;}

.mb0 {margin-bottom: 0 !important;}
.mb5 {margin-bottom: 5px !important;}
.mb8 {margin-bottom: 8px !important;}
.mb10 {margin-bottom: 10px !important;}
.mb15 {margin-bottom: 15px !important;}
.mb20 {margin-bottom: 20px !important;}
.mb30 {margin-bottom: 30px !important;}
.mb35 {margin-bottom: 35px !important;}
.mb40 {margin-bottom: 40px !important;}
.mb50 {margin-bottom: 50px !important;}
.mb60 {margin-bottom: 60px !important;}
.mb70 {margin-bottom: 70px !important;}

.ml0 {margin-left: 0 !important;}
.ml5 {margin-left: 5px !important;}
.ml6 {margin-left: 6px !important;}
.ml15 {margin-left: 15px !important;}

.pl0 {padding-left: 0 !important;}

.psa {position: absolute;}
.csp {cursor: pointer;}

.no-select {-webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;}


/* header */
.header-wrap { position: fixed; width: 100%; min-width: 1440px; height: 90px; color: white; z-index: 999; border-bottom: 1px solid rgba(255,255,255,0.3); }
.header-wrap.type1, .header-wrap.type3 { background-color: transparent; color: #ffffff; }
.header-wrap.type1 *, .header-wrap.type3 * {color: #ffffff;}
.header-wrap.type2 { background-color: #ffffff; color: #000000; box-shadow: 0 1px 20px rgba(0,0,0,0.2);}
.header-wrap.type2 * {color: #000000;}
.header-wrap > .header-outer > .header {display: table; width: 100%; height: 90px;}
.header-wrap > .header-outer > .header .logo {background: url('../img/img_logo.png?v20221101') no-repeat; background-size: auto 100px; width: 250px; height: 42px; display: block; margin-top: -15px;}
.header-wrap.type1 > .header-outer > .header .logo,
.header-wrap.type3 > .header-outer > .header .logo{background-position: 0 0;}
.header-wrap.type2 > .header-outer > .header .logo {background-position: 0 -50px;}
.header-wrap > .header-outer > .header .logo:hover {cursor: pointer;}
.header-wrap > .header-outer > .header > div {display: table-cell; vertical-align: middle; position: relative;}
.header-wrap > .header-outer > .header > div.site-title {padding-left: 30px; width: 300px;}
.header-wrap > .header-outer > .header > div.gnb-wrap { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 1200px; height: 100%; z-index: 1;}
.header-wrap > .header-outer > .header > div.gnb-wrap > ul {position: absolute; top: 50%; left: 50%; transform: translate(-40%, -50%); width: 100%; height: 100%;}
.header-wrap > .header-outer > .header > div.gnb-wrap > ul > li {float: left; margin-right: 80px; width: 200px; text-align: center; height: 100%;}
.header-wrap > .header-outer > .header > div.gnb-wrap > ul > li+li+li {margin-right: 55px;}
.header-wrap > .header-outer > .header > div.gnb-wrap > ul > li:LAST-CHILD {margin: 0;}
.header-wrap > .header-outer > .header > div.gnb-wrap > ul > li > div {color: #333333; height: 90px; position: relative;}
.header-wrap > .header-outer > .header > div.gnb-wrap > ul > li > div:hover {cursor: pointer;}
.header-wrap > .header-outer > .header > div.gnb-wrap > ul > li > div.on {border-bottom: 2px solid #00abd4; color: #00abd4;}
.header-wrap > .header-outer > .header > div.gnb-wrap > ul > li > div.on * {color: #00abd4;}
.header-wrap > .header-outer > .header > div.gnb-wrap > ul > li > div.on2 {border-bottom: 2px solid #00abd4; color: #00abd4;}
.header-wrap > .header-outer > .header > div.gnb-wrap > ul > li > div.on2 * {color: #00abd4;}
.header-wrap > .header-outer > .header > div.gnb-wrap > ul > li > div > span {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; font-size: 18px;}
.header-wrap > .header-outer > .header > div.gnb-wrap > ul > li > div > span:hover {color: #00abd4;}
.header-wrap > .header-outer > .header > div.gnb-wrap > ul > li.gnb-active > div {border-bottom: 2px solid #00abd4; color: #00abd4;}
.header-wrap > .header-outer > .header > div.gnb-wrap > ul > li.gnb-active > div * {color: #00abd4;}
.header-wrap.type3 > .header-outer > .header > div.gnb-wrap > ul > li.gnb-active > div {border-bottom: 2px solid #ffffff; color: #ffffff;}
.header-wrap.type3 > .header-outer > .header > div.gnb-wrap > ul > li.gnb-active > div * {color: #ffffff;}
.header-wrap > .header-outer > .header > div.search {text-align: right; padding-right: 20px; width: 300px;}
.header-wrap > .header-outer > .header > div.search > form > div {position: relative;}
.header-wrap > .header-outer > .header > div.search > form > div > input {width: 270px; height: 50px; padding: 5px 55px 5px 20px; box-sizing: border-box; border: 1px solid #ffffff; color: #ffffff; background-color: transparent;}
.header-wrap > .header-outer > .header > div.search > form > div > .icon {display: inline-block; background: url(../img/icon_search.png?v20221101) no-repeat; width: 30px; height: 30px; position: absolute; right: 20px; top: 50%; transform: translateY(-50%);}
.header-wrap > .header-outer > .header > div.search > form > div > .icon:hover {cursor: pointer;}
.header-wrap.type2 > .header-outer > .header > div.search > form > div > input {border: 1px solid #dddddd; color: #333333; background-color: #ffffff;}
.header-wrap.type2 > .header-outer > .header > div.search > form > div > .icon {background-position: -50px 0;}
.header-wrap > .header-outer > .header > .sitemap-btn {width: 90px; height: 100%; background-color: #00abd4; text-align: center; cursor: pointer; z-index: 999;}
.header-wrap > .header-outer > .header > .sitemap-btn > .icon {display: inline-block; background: url(../img/icon_menu.png?v20221101) no-repeat; width: 30px; height: 30px;}
.header-wrap > .header-outer > .header > #sitemap-btn-open > .icon {background-position: 0 0;}
.header-wrap > .header-outer > .header-bottom {display: table; width: 100%; height: 300px; background-color: #ffffff; position: relative; border-top: 1px solid #dddddd; border-bottom: 1px solid #dddddd;}
.header-wrap > .header-outer > .header-bottom > div { position: absolute; top: 140px; left: 50%; transform: translate(-40%, -50%); width: 1200px;}
.header-wrap > .header-outer > .header-bottom > div > div {float: left; margin-right: 80px; width: 200px;}
.header-wrap > .header-outer > .header-bottom > div > div+div+div {margin-right: 56px;}
.header-wrap > .header-outer > .header-bottom > div > div+div+div+div {margin-right: 55px;}
.header-wrap > .header-outer > .header-bottom > div > div:LAST-CHILD {margin: 0;}
.header-wrap > .header-outer > .header-bottom > div > div> ul > li.gnb-depth2 {text-align: center; margin-bottom: 25px;}
.header-wrap > .header-outer > .header-bottom > div > div> ul > li.gnb-depth2 > a {font-size: 16px;color:#333333; display: inline-block; width: 100%;}
.header-wrap > .header-outer > .header-bottom > div > div> ul > li.gnb-depth2:hover > a {color: #00abd4; cursor: pointer;}
.header-wrap > .header-outer > .header-bottom > div > div> ul > li.gnb-depth2.on > a {color: #00abd4;}
/*헤더 언어변경버튼 추가*/
.language-btn {width: 140px; padding-right: 20px; z-index: 999;}
.language-btn button {width: 100%; height: 40px; border-radius: 20px; border: 1px solid #ffffff; background: none; font-size: 13px;}
.language-btn button:hover {box-shadow: 0 5px 25px rgba(0,0,0,0.2); cursor: pointer;}
.language-btn button span {background: url(../img/icon_languagebtn.png) no-repeat; background-size: 25px 50px; width: 15px; height: 15px; margin-right: 10px; display: inline-block; vertical-align: middle;}
.language-btn button.white {border: 1px solid #00abd4; color: #00abd4;}
.language-btn button.white span {background-position: 0 -25px;}

/* footer */
.footer-wrap {width: 100%; min-width: 1440px; height: auto; background-color: #444444; position: relative; clear: both;}
.footer-wrap > .footer-outer {width: 100%;}
.footer-wrap > .footer-outer > .footer {width: 100%;}
.footer-wrap > .footer-outer > .footer > .top {width: 100%; height: 60px; border-bottom: 1px solid #606060; padding: 10px 0; background-color: #333333;}
.footer-wrap > .footer-outer > .footer > .top > .footer-util {position:relative; width:1200px; height: 40px; margin:auto; text-align: left;}
.footer-wrap.menu > .footer-outer > .footer > .top > .footer-util {width: 1440px;} /* 메인은 1440 템플릿은 1200 */
.footer-wrap > .footer-outer > .footer > .top > .footer-util > nav {display: inline-block; padding-top: 10px;}
.footer-wrap > .footer-outer > .footer > .top > .footer-util > nav * {font-style: normal; font-size: 14px; color: #aaaaaa;}
.footer-wrap > .footer-outer > .footer > .top > .footer-util > nav > ul > li {display: inline-block; padding:0 18px; border-left:1px solid #cccccc}
.footer-wrap > .footer-outer > .footer > .top > .footer-util > nav > ul > li:FIRST-CHILD {border:0; padding-left:0}
.footer-wrap > .footer-outer > .footer > .top > .footer-util > nav > ul > li a {text-decoration: none;}
.footer-wrap > .footer-outer > .footer > .top > .footer-util > .family-site {position:absolute ; top:0; right:0; width:195px; height:100%; text-align: left; }
.footer-wrap > .footer-outer > .footer > .top > .footer-util > .family-site > .btn-family-site {width:100%; height:100%;background: transparent; border:0px; text-align:left; padding:0 20px; color:#fff; border: 1px solid #585858; position: relative;}
.footer-wrap > .footer-outer > .footer > .top > .footer-util > .family-site > .btn-family-site:HOVER {cursor: pointer;}
.footer-wrap > .footer-outer > .footer > .top > .footer-util > .family-site > .btn-family-site > .icon {background: url(../img/icon_familysite_01.png?v20221101) no-repeat 50% 50% / contain; width: 8px; height: 6px; display: inline-block; position: absolute; right: 20px; top: 45%;}
.footer-wrap > .footer-outer > .footer > .top > .footer-util > .family-site > .btn-family-site.area-expanded > .icon {background-image: url(../img/icon_familysite_02.png?v20221101);}
.footer-wrap > .footer-outer > .footer > .top > .footer-util > .family-site > ul {position: absolute; bottom: 100%; z-index: 9000; width: 195px; border: 1px solid #999999; background-color: #444444; text-align: left; border-bottom: 0;}
.footer-wrap > .footer-outer > .footer > .top > .footer-util > .family-site > ul > li {height: 40px; background-color: #444444; border-bottom: 1px solid #585858; padding: 10px 20px;}
.footer-wrap > .footer-outer > .footer > .top > .footer-util > .family-site > ul > li:LAST-CHILD {border-bottom: 0;}
.footer-wrap > .footer-outer > .footer > .top > .footer-util > .family-site > ul > li:HOVER {background-color: #333333; cursor: pointer;}
.footer-wrap > .footer-outer > .footer > .top > .footer-util > .family-site > ul > li > span {display:inline-block; white-space: nowrap;font-size: 13px; color:#ffffff; vertical-align: middle;}
.footer-wrap > .footer-outer > .footer > .bottom {height: auto; min-height: 140px; background-color: #444444;}
.footer-wrap > .footer-outer > .footer > .bottom * {font-style: normal; font-size: 14px; color: #aaaaaa;}
.footer-wrap > .footer-outer > .footer > .bottom >.footer-address {position:relative; width:1200px; margin:28px auto; margin-bottom: 0;}
.footer-wrap.menu > .footer-outer > .footer > .bottom >.footer-address {width: 1440px;}
.footer-wrap > .footer-outer > .footer > .bottom >.footer-address > div {display: table-cell; vertical-align: top; text-align: left;}
.footer-wrap > .footer-outer > .footer > .bottom >.footer-address > div+div {padding-left: 40px;}
.footer-wrap > .footer-outer > .footer > .bottom >.footer-address > div+div > div {margin-bottom: 15px;}
.footer-wrap > .footer-outer > .footer > .bottom >.footer-address > div+div > .copyright {margin: 0;}
.footer-wrap > .footer-outer > .footer > .bottom >.footer-address > div > .logo {background: url('../img/img_logo.png?v20221101') no-repeat; background-size: auto 100px; width: 250px; height: 42px; display: block;}

/* sitemap */
#sitemap { position: fixed; top:-200%; left:0; width: 100%; min-width: 800px; height: 100%; background-color: #fff; z-index: 9999; border-bottom: 1px solid #666666; transition:.2s linear;}
#sitemap.on {top:0;}
#sitemap > div {background: url(../img/bg_sitemap.png?v20221101); width: 100%; height: 100%; background-size: cover;}
#sitemap > div > #sitemap-btn-close {width: 90px; height: 90px; background-color: #00abd4; position: absolute; top: 0; right: 0; text-align: center; cursor: pointer;}
#sitemap > div > #sitemap-btn-close > .icon {display: inline-block; background: url(../img/icon_menu.png?v20221101) no-repeat; width: 30px; height: 30px; background-position: 0 -50px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}


#sitemap > div > #sitemap-list {width: 1440px; margin: auto; height: 100%;}
#sitemap > div > #sitemap-list > ul {display: table; width: 100%; height: 100%; table-layout: fixed;}
#sitemap > div > #sitemap-list > ul > li {display: table-cell; vertical-align: middle; padding-bottom: 150px;}
#sitemap > div > #sitemap-list > ul > li > div {height: 200px;}

#sitemap > div > #sitemap-list > ul > li > div > .depth1 {font-size: 30px; color: #00abd4; padding-bottom: 40px; border-bottom: 2px solid #dddddd; width: 280px; margin-bottom: 20px; text-align: center;}
#sitemap > div > #sitemap-list > ul > li > div > .depth2 {font-size: 18px; width: 100%; max-width:280px; text-align: center;}
#sitemap > div > #sitemap-list > ul > li > div > .depth2 > ul > li {padding: 20px 0;}
#sitemap > div > #sitemap-list > ul > li > div > .depth2 > ul > li > a {color: #666666;}
#sitemap > div > #sitemap-list > ul > li > div > .depth2 > ul > li > a:hover {color: #222222;}
#sitemap > div > #sitemap-list > ul > li > div > .depth2 > ul > li > a > i {background: url(../img/icon_link_menu_01.png?v20221101) no-repeat 50% 50% / contain; background-size: 14px; display: inline-block; height: 14px; width: 14px; margin-left: 5px; vertical-align: middle;}
#sitemap > div > #sitemap-list > ul > li > div > .depth2 > ul > li > a:hover > i {background-image: url(../img/icon_link_menu_02.png?v20221101);}

@media (max-width: 1440px) {
	.sitemap > div {background-size: 1440px 100%;}
}

/* ESG 등급 폰트 - 등급별 색 지정 */
/* :root { */
/* 	--esg-grd-color-S: #5668de; */
/* 	--esg-grd-color-AP: #00abd4; */
/* 	--esg-grd-color-A: #3fc8e9; */
/* 	--esg-grd-color-BP: #08c886; */
/* 	--esg-grd-color-B: #59db9c; */
/* 	--esg-grd-color-C: #efbe48; */
/* 	--esg-grd-color-D: #ee876b; */
/* 	--esg-grd-color: #999999; */
/* } */
/* .grd-font {font-family: TmoneyRoundWind; font-weight: bold; font-size: 23px; color: #999999;} */
/* .grd-font.kcgs[data-value="S"], */
/* .grd-font.kesg[data-value="S"], */
/* .grd-font.msci[data-value="AAA"] {color: var(--esg-grd-color-S);} */
/* .grd-font.kcgs[data-value="A+"], */
/* .grd-font.kesg[data-value="A+"], */
/* .grd-font.msci[data-value="AA"] {color: var(--esg-grd-color-AP);} */
/* .grd-font.kcgs[data-value="A"], */
/* .grd-font.kesg[data-value="A"], */
/* .grd-font.msci[data-value="A"] {color: var(--esg-grd-color-A);} */
/* .grd-font.kcgs[data-value="B+"], */
/* .grd-font.kesg[data-value="B+"], */
/* .grd-font.msci[data-value="BBB"] {color: var(--esg-grd-color-BP);} */
/* .grd-font.kcgs[data-value="B"], */
/* .grd-font.kesg[data-value="B"], */
/* .grd-font.msci[data-value="BB"] {color: var(--esg-grd-color-B);} */
/* .grd-font.kcgs[data-value="C"], */
/* .grd-font.kesg[data-value="C"], */
/* .grd-font.msci[data-value="B"] {color: var(--esg-grd-color-C);} */
/* .grd-font.kcgs[data-value="D"], */
/* .grd-font.kesg[data-value="D"], */
/* .grd-font.msci[data-value="CCC"] {color: var(--esg-grd-color-D);} */
/* .grd-font.kcgs[data-value="-"], */
/* .grd-font.kesg[data-value="-"], */
/* .grd-font.kesg[data-value="-"] {color: var(--esg-grd-color);} */

/* .grd-font.moodys[data-value^="9"], */
/* .grd-font.moodys[data-value^="8"], */
/* .grd-font.moodys[data-value^="7"], */
/* .grd-font.moodys[data-value^="6"] {color: var(--esg-grd-color-AP);} 60점 이상(Advanced) */
/* .grd-font.moodys[data-value^="5"] {color: var(--esg-grd-color-BP);} 50 ~ 59점(Robust) */
/* .grd-font.moodys[data-value^="4"], */
/* .grd-font.moodys[data-value^="3"] {color: var(--esg-grd-color-C);} 30 ~ 49점(Limited) */
/* .grd-font.moodys[data-value^="2"], */
/* .grd-font.moodys[data-value^="1"], */
/* .grd-font.moodys[data-value="9"], */
/* .grd-font.moodys[data-value="8"], */
/* .grd-font.moodys[data-value="7"], */
/* .grd-font.moodys[data-value="6"], */
/* .grd-font.moodys[data-value="5"], */
/* .grd-font.moodys[data-value="4"], */
/* .grd-font.moodys[data-value="3"], */
/* .grd-font.moodys[data-value="2"], */
/* .grd-font.moodys[data-value="1"] {color: var(--esg-grd-color-D);} 29점 이하(Weak) */
/* .grd-font.moodys[data-value="100"] {color: var(--esg-grd-color-S);} 100점 */

/* .grd-font.sp {color: #333333;} */
/* .grd-font.sp[data-value="-"] {color: #999999;} */


/* 등급별이 아닌 회사별로 색 지정하는 것으로 변경 */
.grd-font {font-family: TmoneyRoundWind; font-weight: bold !important; font-size: 25px; color: #999999;}
.grd-font.kcgs {color: #0d77f6;}
.grd-font.kesg {color: #9ad08e;}
.grd-font.sv {color: #6faefd;}
.grd-font.moodys {color: #7b5dfa;}
.grd-font.msci {color: #23deea;}
.grd-font.sp {color: #f98cc2;}
.grd-font[data-value="-"] {color: #999999; font-weight: 400 !important;}
/* .pc_vw .grd-font, .pc_vw2 .grd-font {font-size: 23px !important;} */
/* .mo_vw .grd-font, .mo_vw2 .grd-font {font-size: 20px !important;} */


@media screen and (max-width:1440px){
	.grd-font:not(.no-size) {font-size: 24px !important;}
}
@media screen and (max-width:1200px){
	.grd-font:not(.no-size) {font-size: 22px !important;}
}
@media screen and (max-width:1023px){
	.grd-font:not(.no-size) {font-size: 20px !important;}
}
@media screen and (max-width:834px){
	.grd-font:not(.no-size) {font-size: 18px !important;}
}
@media screen and (max-width: 767px){
	.grd-font:not(.no-size) {font-size: 16px !important;}
}
