@charset "utf-8";
/*
  최초작성 : 박서진
  최초작성일 : 2017.11.30
 */
/* button */
a.down_btn {
    display: inline-block;
    width: 100%;
    max-width: calc(24.3rem / 1.6);
    height: calc(5rem / 1.6);
    line-height: calc(4.6rem / 1.6);
    text-align: center;
    background: #fff;
    border: 2px solid #1b2549;
    color: #1b2549;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

a.down_btn::after {
    display: inline-block;
    font-family: "xeicon";
    font-size: calc(2.2rem / 1.6);
    content: "\eb7c";
    margin-top: calc(0.1rem / 1.6);
}

a.down_btn span {
    display: inline-block;
    font-weight: 700;
    letter-spacing: calc(-0.08rem / 1.6);
    margin-right: calc(1.5rem / 1.6);
    vertical-align: top;
}

a.down_btn:focus,
a.down_btn:hover {
    background: #1b2549;
    color: #fff;
}

/* sub010101 개요  */
.summary-bg {display:inline-block; width:100%; padding-top:548px; margin-top:-300px; background:url('/images/english/contents/summary-bg.jpg') center 0/cover no-repeat}
.summary-top {padding-top:110px; margin-bottom:80px; background:url('/images/english/contents/summary.jpg') center/cover no-repeat}
.summary-top > div {position:relative; width:1440px; margin:auto; height:760px}
.summary-top h2 {position:relative;}
.summary-top h2:after {position:absolute; right:-12%; top:50%; transform:translateY(-50%); width:70%; height:10px; background:#f8f8f8; content:''}
.summary-top .txt {position:absolute; left:0; bottom:0; padding:87px 80px 50px; width:55%; background:#fff;z-index:1}
.summary-top .txt p {margin-top:33px}
.summary-top .slogan {position:absolute; right:0; top:0; padding:131px 0; width:55%; border:10px solid #fff; z-index:0}
.summary-top .slogan p {color:#fff; text-align:center}
.summary-top .slogan p:first-child {font-family: 'Squada One', cursive; text-transform:uppercase; font-size:2.313em}
.summary-top .slogan span {display:block; font-size:2.108em; line-height:0.6}
.summary-top .slogan p:last-child {margin-top:18px}
.summary-info .current {text-align:center; margin-bottom:70px}
.summary-info .current li {position:relative; display:inline-block; width:173px; height:267px; margin:0 23px; vertical-align:top}
.summary-info .current li:first-child {margin-left:0}
.summary-info .current li:last-child {margin-right:0}
.summary-info .current li .img {display:inline-block; width:120px; height:120px; background:url('/images/korean/contents/current01.png') center no-repeat #f3f3f3; border-top-left-radius:50%; border-bottom-right-radius:50%}
.summary-info .current li:nth-of-type(2) > .img {background-image:url('/images/korean/contents/current02.png')}
.summary-info .current li:nth-of-type(3) > .img {background-image:url('/images/korean/contents/current03.png')}
.summary-info .current li:nth-of-type(4) > .img {background-image:url('/images/korean/contents/current04.png')}
.summary-info .current li:nth-of-type(5) > .img {background-image:url('/images/korean/contents/current05.png')}
.summary-info .current li:nth-of-type(6) > .img {background-image:url('/images/korean/contents/current06.png')}
.summary-info .current .txt {margin-top:20px}
.summary-info .current em {color:#888}
.summary-info .current p {font-size:1.1em; font-weight:900}
.summary-info .current div span {position:relative; display:inline-block; margin-top:12px; padding:14px 0 24px; font-size:0.875em; color:#888}
.summary-info .current div span:before {position:absolute; top:0; left:50%; transform:translateX(-50%); width:10px; height:2px; background:#c6c6c6; content:''}
.business-area {text-align:center; margin:-2.3% 0 0 -2.3%;}
.business-area:after {display:block; clear:both; content:''}
.business-area li {display:inline-block; width:400px; margin:1.1% 0 0 1.1%; position:relative;}
.business-area li a {display:inline-block; width:100%; position:relative;}
.business-area li .business-title {display:inline-block; padding-bottom:245px; width:100%; background:url('/images/korean/contents/business01.jpg') center/cover no-repeat}
.business-area li:nth-of-type(2) .business-title {background-image:url('/images/korean/contents/business02.jpg')}
.business-area li:nth-of-type(3) .business-title {background-image:url('/images/korean/contents/business03.jpg')}
.business-area li:nth-of-type(4) .business-title {background-image:url('/images/korean/contents/business04.jpg')}
.business-area li:last-child .business-title {background-image:url('/images/korean/contents/business05.jpg')}
.business-area li h3 {position:relative; padding:22px 34px; font-size:1.3em; color:#fff; z-index:1; text-align:left}
.business-area li h3:before {position:absolute; left:0; top:0; width:8px; height:100%; background:#26315c; content:''; z-index:-1; transition:width .4s}
.business-area li h3:after {position:absolute; left:0; top:0; width:100%; height:100%; background:#000; opacity:.2; content:''; z-index:-2}
.business-area .txt {position:absolute; top:60%; left:50%; transform:translate(-50%, -50%); width:80%; opacity:0; transition:opacity .4s; text-align:left; z-index:10}
.business-area .txt p {font-size:1.2em; color:#fff; line-height:1.1}
.business-area li:after {position:absolute; left:0; top:0; width:100%; height:96%; background:#000; opacity:0; content:''; transition:opacity .4s}
.business-area li:hover::after {opacity:.5}
.business-area li:hover h3:before {width:100%}
.business-area li:hover .txt {opacity:1}

/* sub010102 */
.mission {margin:100px 0}
.mission ul {text-align:center}
.mission ul:after {display:block; clear:both; content:''}
.mission li {position:relative; display:inline-block; width:15vw; height:15vw; vertical-align:middle;}
.mission li:after {position:absolute; left:0; top:0; width:100%; height:100%; background:#26315c; border-radius:40px; transform:rotate(45deg); content:''; z-index:-2}
.mission li div {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%}
.mission p {margin-top:14px; font-family:'Noto'; font-size:1.125em; color:#fff;}
.mission li:nth-of-type(1)::before, .mission li:nth-of-type(3)::before {position:absolute; right:-17px; top:50%; transform:translateY(-50%); color:#fff; font-size:2em; font-family:'xeicon'; content:'\e913'}
.mission li:nth-of-type(3)::before {left:-28px; right:inherit}
.mission li:nth-of-type(2) {width:18vw; height:18vw}
.mission li:nth-of-type(2)::before, .mission li:nth-of-type(2)::after {background:rgba(30, 116, 220, 0.8); content:''; position:absolute; left:0; top:0; width:100%; height:100%; border-radius:40px; transform:rotate(45deg);z-index:-1}
.mission li:nth-of-type(2) p {font-size:1.778em}
.mission li:last-child:after {background:#0095DA;}

.ideology {text-align:center}
.ideology > p {margin-bottom:50px;  font-size:1.750em; serif; font-weight:600}
.ideology2 span.color01, .ideology span.color01 {position:relative; display:inline-block; padding:0 23px;}
.ideology2 span.color01:before, .ideology2 span.color01:after, .ideology span.color01:before, .ideology span.color01:after {position:absolute; left:0; top:0; width:18px; height:14px; background:url('/images/korean/contents/ideology.gif'); content:''}
.ideology2 span.color01:after, .ideology span.color01:after {left:inherit; right:0; transform:rotate(180deg)}
.ideology div {display:inline-block; margin-left:2.8%; width:30.6%}
.ideology div:nth-of-type(1) {margin-left:0}
.ideology div p {font-size:1.125em; color:#333 }
.ideology strong {display:block; font-size:1.444em}
.ideology ul {margin:24px 0 38px}


/* sub010103 연혁 */
.history {overflow:hidden}
.history:nth-of-type(2) {margin-top:92px}
.history .title01 {margin-bottom:0; font-size:1.5em; font-weight:600}
.history > p {text-align:center; margin-bottom:70px; font-size:2em; font-weight:900}
.history .history-img {float:left; width:50%; text-align:center}
.history .history-img > div {width:58.4%; margin:48px auto 0;}
.history .history-img > div:first-of-type {margin-top:0}
.history .history-img .txt {text-align:left; color:#444}
.history .history-img .date {font-family:'Roboto', sans-serif; color:#777; font-size:0.875em}
.history .history-list {position:relative; float:left; padding-top:44px; margin-top:-32px; width:50%}
.history .history-list:after {position:absolute; left:0; top:-12px;  width:2px; height:100%; background:#f3f3f5; content:''}
.history em {font-family:'Roboto', sans-serif;}
.history .history-list > ul > li {position:relative; margin-top:267px; padding-left:56px}
.history:last-child .history-list > ul > li {margin-top:190px}
.history .history-list > ul > li:first-child {margin-top:0}
.history .history-list > ul > li:before {position:absolute; left:-9px; top:10px; width:18px; height:18px; background:#fff; content:''; z-index:1}
.history .history-list > ul > li:after {position:absolute; left:-3px; top:16px; width:8px; height:8px; background:#2277f2; border-radius:50%; content:''; z-index:2}
.history .history-list > ul > li strong {vertical-align:top; font-size:1.750em; font-weight:900;position: absolute;}
.history .history-list > ul > li ul {display:block; padding-left:100px}
.history .history-list > ul > li ul > li {overflow: hidden;}
.history .history-list > ul > li ul span {display:block; float: left; color:#2277f2; font-size:1.5em; font-weight:600; font-style:italic; vertical-align:middle}
.history .history-list > ul > li ul p {display:inline-block; vertical-align:middle; font-size:1.125em; color:#444; line-height: 1.3; padding-top: 4px; padding-left: 30px; width: calc(100% - 28px);}

/* sub010104 ci */
.ci {margin-top:40px}
.ci:after {display:block; clear:both; content:''}
.ci .img {display:inline-block; width:50%; margin-right:4.5%; vertical-align:middle}
.ci .img img {max-width:100%}
.ci .txt {display:inline-block; width:45%; vertical-align:middle}
.ci .txt span {display:block; margin-top:10px}

/* sub010105 찾아오시는 길 */
.contact .title {display:inline-block; width:20%; color:#222; font-size:1.625em; text-align:left; font-weight:900; vertical-align:middle}
.contact .title span {display:block; font-size:0.615em; color:#777; font-family:'Roboto', sans-serif; font-weight:400}
.contact li {overflow:hidden; padding:40px 0 44px; border-bottom:1px solid #e2e2e2}
.contact li:last-child {border-bottom:0}.contact .number {display:inline-block; width:20%; position:relative; padding-left:33px; vertical-align:middle}
.contact .number:before {position:absolute; left:0; top:50%; transform:translateY(-50%); font-family:'icon'; content:'\e904'; color:#2277f2; font-size:1.5em}
.contact .address {display:inline-block; width:44%;  position:relative; padding-left:33px; vertical-align:middle}
.contact .address:before {position:absolute; left:0; top:50%; transform:translateY(-50%); font-family:'icon'; content:'\e913'; color:#2277f2; font-size:2em}
.contact .address span {display:block}
.contact .local {display:inline-block; width:12%;  vertical-align:middle; text-align:right;}
.contact .local > a {position:relative; display:inline-block; padding:11px 20px 11px 42px; border:1px solid #26315c; font-size:0.938em; color:#26315c;  transition:all .4s}
.contact .local > a:before {position:absolute; left:21px; top:50%; transform:translateY(-50%); font-family:'icon'; content:'\e914'; color:#26315c; transition:color .4s; font-size:1.3em}
.contact .local > a:hover {background:#26315c; color:#fff}
.contact .local > a:hover:before {color:#fff}
.map {position:relative; width:100%; height:600px}
.map > div {position:absolute; left:0; top:0; width:100%;}

/* sub0105 사회공헌 */
.social .intro3 {width:67%; margin:20px auto 0}
.social .board-top {margin-top:40px}
.volunteer {overflow:hidden; margin-bottom:40px}
.volunteer li {position:relative; float:left; width:32%; margin: 2.6% 0 2.6% 2%;}
.volunteer li:nth-child(3n+1) {margin-left:0}
.volunteer li:nth-child(-n+3) {margin-top:0}
.volunteer .txt {position:absolute; left:0; bottom:0; padding:15px 0 16px; width:100%; background:rgba(0,0,0,.4)}
.volunteer .txt p {text-align:center; color:#fff; font-size:1.250em}

/* sub010301 뉴스, 공지 */
.notice-img {margin:50px 0 40px; background:#f3f3f5}
.notice-img ul {overflow:hidden; width:1440px; margin:auto; padding:50px 0}
.notice-img li {float:left;margin-left:1.8%;width:23.6%;border: 1px solid #e2e2e2;}
.notice-img li:first-child {margin-left:0}
.notice-img li a {display:inline-block; width:100%}
.notice-img .txt {position:relative;padding: 17px 20px 20px 20px;background:#fff;}
.notice-img .txt:after {position:absolute; left:0; bottom:0; width:0; height:4px; background:#2277f2; content:''; transition:width .6s}
.notice-img .txt .title {display:block;font-size:1.125em;font-weight:600;transition:color .4s;height:54px;line-height: 1.35;letter-spacing: -0.025em;}
.notice-img .txt .date {display:block;margin-top: 8px;font-size:0.875em;color:#777;}
.notice-img li a:hover .txt:after {width:100%}
.notice-img li a:hover .txt .title {color:#2277f2}
.notice-img .img {display:inline-block;width:100%;height:200px;margin-bottom: -4px;}
.notice-img .img img {width:100%; height:100%}


.board-list .notice td {background:#f9f9fb}
.board-list .notice td span {display:inline-block; padding:2px 8px 4px; color:#fff; background:#2277f2; font-weight:900; border-radius:8px}
.board-list .notice td.left {font-weight:900}


/* sub010501 ethics */
.ethics {}
.ethics .intro span {display:inline-block; margin-bottom:18px; font-weight:600}
.ethics h3 {text-align:center; font-size:2em; font-weight:600}
.ethics > div:nth-of-type(2) {margin:42px 0 45px; padding:70px 66px; background:url('/images/english/contents/ethics.jpg') center/cover no-repeat}
.ethics ul {position:relative; padding-left:110px;}
.ethics ul:before {position:absolute; left:0; top:10px; width:82px; height:1px; background:rgba(255, 255, 255, .4); content:''}
.ethics ul li {color:#fff; line-height:1.3; margin:10px 0 }
.ethics .btnWrap div {margin-left:40px;}
.ethics .btnWrap div:nth-of-type(1) {margin-left:0}


/* sub020101 */
.application > span {display:inline-block; margin-bottom:60px}
.application ul {text-align:center;}
.application li {display:inline-block; width:120px; margin:0 30px; vertical-align:top}
.application li:first-child {margin-left:0}
.application li:last-child {margin-right:0}
.application li .img {display:inline-block; width:120px; height:120px; background:url('/images/english/contents/application01.png') center no-repeat #f3f3f3; border-top-left-radius:50%; border-bottom-right-radius:50%}
.application li:nth-of-type(2) > .img {background-image:url('/images/english/contents/application02.png')}
.application li:nth-of-type(3) > .img {background-image:url('/images/english/contents/application03.png')}
.application li:nth-of-type(4) > .img {background-image:url('/images/english/contents/application04.png')}
.application li:nth-of-type(5) > .img {background-image:url('/images/english/contents/application05.png')}
.application li:nth-of-type(6) > .img {background-image:url('/images/english/contents/application06.png')}
.application strong {font-size:1.5em}

/* 환경 사업 개요 */
.environment-info {margin:60px 0; padding:90px 0 60px; background:url('/images/korean/contents/environment-bg.jpg') center/cover no-repeat}
.environment-info > div {position:relative; width:1440px; margin:auto}
.environment-info .environment-info-video,
.environment-info > div:after {position:absolute; right:0; top:-130px; width:480px; aspect-ratio:480 / 380; background-position:right top; background-repeat:no-repeat; content:''}

.environment-info.chemisorbent .environment-info-video,
.environment-info.chemisorbent > div:after {background-image:url('/images/korean/contents/business02.jpg')}
.environment-info.air-filter .environment-info-video,
.environment-info.air-filter > div:after {top:-110px; background-image:url('/images/korean/contents/business03.jpg')}
.environment-info.air .environment-info-video,
.environment-info.air > div:after { background-image:url('/images/korean/contents/business05.jpg')}
.environment-info.greenhouse .environment-info-video,
.environment-info.greenhouse > div:after {background-image:url('/images/korean/contents/business04.jpg')}
.environment-info.monitoring .environment-info-video,
.environment-info.monitoring > div:after {background-image:url('/images/korean/contents/business01.jpg')}


.environment-info div .icon {position:absolute; left:0; top:-125px; display:inline-block; width:72px; height:76px; background:url('/images/korean/contents/environment-icon.png') center no-repeat}
.environment-info div .icon:after {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); font-size:2.8em; font-family:'icon'; content:'\e91d'}
.environment-info h2 {position:relative; padding-bottom:18px; margin-bottom:16px; color:#fff; font-size:2em; font-weight:600}
.environment-info h2:after {position:absolute; left:0; bottom:0; width:14px; height:2px; background:#fff; content:''}
.environment-info p.color02 {font-size:1.250em; font-weight:600}
.environment-info p {color:#fff}
.environment-info .btn {margin-top:28px}
.environment-info .btn a {position:relative; display:inline-block; padding:4px 26px 9px 44px; color:#fff; border:1px solid #fff}
.environment-info .btn a::before {position:absolute; left:22px; top:12px; font-family:'icon'; content:'\e912';}
.environment-info .btn span {vertical-align:middle}

.environment-info.air-filter .icon {top:-100px}

/* sub020102 제품소개 */
.product {text-align:center}
.product p {display:inline-block; width:25%; padding:106px 0; background:url('/images/english/contents/product-bg01.png') center/contain no-repeat; margin-left: -78px; vertical-align:middle}
.product p:first-of-type {margin-left:0}
.product p:nth-of-type(2) {position:relative; width:36%; background-image:url('/images/english/contents/product-bg02.png')}
.product p:nth-of-type(2):before {position:absolute; top:0; left:50%; transform:translateX(-50%); width:48px; height:80px; background:url('/images/english/contents/medal.png') center no-repeat; content:''}
.product p:nth-of-type(3) {background-image:url('/images/english/contents/product-bg03.png')}
.product span {color:#fff; font-family:'Roboto', sans-serif; font-size:2em; font-weight:900}
.product p:nth-of-type(2) span {font-size:1.375em}
.product em {display:block; margin-top:4px}

.environment > p {text-align:center}
.environment > p span {display:block}
.environment-list {margin-bottom:60px}
.environment-list li {margin-bottom:30px}
.environment-list .img {display:inline-block; width:27.8%; margin-right:5%; vertical-align:middle}
.environment-list .txt {position:relative; display:inline-block; width:66%; vertical-align:middle}
.environment-list .txt > div {padding-left:48px;}
.environment-list .txt h3 {margin-bottom:8px; color:#26315c;}
.environment-list .txt h3 span {display:inline-block; margin-right:8px; width:35px; font-family: 'Squada One', cursive; font-size:2em; opacity:.5; font-weight:400; vertical-align:middle}
.environment-list .txt strong {font-size:1.275em; vertical-align:middle}
.environment-list .txt .btn {margin-top:28px}
.environment-list .btn i {transform:rotate(0);}
.environment-list .btn a:hover i:before {color:#fff}

.eco-solution {width:100%; text-align:center}
.eco-solution img {width:100%}

.chemisorbent-list {margin-left:-2.2%}
.chemisorbent-list li {display:inline-block; width:47.6%; margin:38px 0 0 2.2%}
.chemisorbent-list .img {display:inline-block; width:28%; margin-right:3%; vertical-align:middle}
.chemisorbent-list .txt {display:inline-block; width:68%; vertical-align:middle; text-align:justify}
.chemisorbent-list .txt strong {font-size:1.125em; font-weight:600}

.air-filters {margin-bottom:60px}
.air-filters ul {text-align:center; margin-bottom:48px}
.air-filters li {display:inline-block; margin-left:25px}
.air-filters li:first-child {margin-left:0}
.filter-amc {position:relative; width:100%; height:540px; margin:24px auto 0}
.filter-amc:after {position:absolute; left:50%; transform:translateX(-50%); width:340px; height:340px; background:url('/images/korean/contents/amc.jpg') center no-repeat; content:''}
.filter-amc h3 {margin-bottom:30px; font-size:1.375em; color:#fff; width:240px; height:60px; line-height:60px; background:#26315c; text-align:center; border-radius:80px; border-bottom-left-radius:10px}
.filter-amc div {display:inline-block; position:absolute; top:76px; left:50%; transform:translateX(200px); width:360px}
.filter-amc div:after {display:block; content:''; clear:both}
.filter-amc .bul.dot3 {clear:both}
.filter-amc div:first-child {transform:translateX(-560px);}
.filter-amc div:first-child h3 {float:right; background:#2277f2; border-bottom-right-radius:10px; border-bottom-left-radius:80px}


/* sub0202 */
.business-intro:after {display:block; content:''; clear:both}
.business-intro > div {width:47%; float:left}
.business-intro > div:first-child {margin-right:5%}
.business-intro img {width:100%}

.direction:after {display:block; content:''; clear:both}
.direction > div {width:47%; display:inline-block; vertical-align:middle}
.direction > div:first-of-type {margin-right:5%}
.direction img {width:100%;}

.green div {display:inline-block; vertical-align:middle}
.green div:first-of-type {width:26%; margin-right:3%}
.green div:last-of-type {width:70%}
.green div p span {display:block}

/* sub020301 계열회사 */
.subsidiary {}
.subsidiary ul {margin-top:60px; text-align:center}
.subsidiary li {display:inline-block;}
.subsidiary li {display:inline-block; width: 16.9%; margin-left:3%; vertical-align:top}
.subsidiary li:first-child {margin-left:0}
.subsidiary h3 {height:16px}
.subsidiary li .img {display:block; position: relative; width:100%; height:180px; background:url('../../images/english/main/cate-img02.jpg') center/cover no-repeat}
.subsidiary li:nth-child(2) .img {background-image:url('../../images/english/main/cate-img03.jpg')}
.subsidiary li:nth-child(3) .img {background-image:url('../../images/english/main/cate-img04.jpg')}
.subsidiary li:nth-child(4) .img {background-image:url('../../images/english/main/cate-img05.jpg')}
.subsidiary li:nth-child(5) .img {background-image:url('../../images/english/main/cate-img06.jpg')}
.subsidiary .txt {position:relative; padding-top:30px; border:1px solid #e2e2e2; height:330px;}
.subsidiary .txt p {padding:25px 10px 28px; font-size:0.838em;}
.subsidiary .txt span {display:inline-block; position:absolute; bottom:38px; left:50%; transform:translateX(-50%); padding:8px 20px 10px 43px; border:1px solid #26315c; font-size:0.938em; color:#26315c;}
.subsidiary .txt span:before {position:absolute; left:18px; top:50%; transform:translateY(-50%); font-family:'icon'; content:'\e912'; font-size:1.2em}

/* sub0301 */
.talent {text-align:center}
.talent div {display:inline-block; margin-left:-90px; width:30%; vertical-align:top}
.talent div h3 {position:relative; margin-bottom:30px; padding:51px 0 66px; background:url('/images/english/contents/talent-bg01.png') center top no-repeat}
.talent div:first-child {margin-left:0}
.talent div:nth-of-type(2) {margin-top:50px}
.talent div:nth-of-type(2) h3 {background-image:url('/images/english/contents/talent-bg02.png')}
.talent div:nth-of-type(3) h3 {background-image:url('/images/english/contents/talent-bg03.png')}
.talent div h3 span {display:inline-block; padding:90px 10px 0; background:url('/images/english/contents/talent01.png') center top no-repeat; color:#fff; font-size:1.575em; font-weight:600; line-height:1}
.talent div:nth-of-type(2) h3 span {background-image:url('/images/english/contents/talent02.png')}
.talent div:nth-of-type(3) h3 span {background-image:url('/images/english/contents/talent03.png')}
.talent div strong {position:relative; display:block; padding-bottom:20px; margin-bottom:15px; font-size:0.925em}
.talent div strong:after {position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:24px; height:2px; background:#26315c; content:''}
.talent div:nth-of-type(2) strong:after {background:#2277f2}
.talent div:nth-of-type(3) strong:after {background:#2c7156}

/* sub0302 복리후생 */
.benefits {margin-top:42px}
.benefits ul {margin:-2.3% 0 0 -2.3%}
.benefits ul:after {display:block; clear:both; content:''}
.benefits li {float:left; width:31%; margin:2.3% 0 0 2.3%}
.benefits li div {display:inline-block; padding-bottom:245px; margin-bottom:12px; width:100%; background:url('/images/english/contents/benefits01.jpg') center/cover no-repeat}
.benefits li:nth-of-type(2) div {background-image:url('/images/english/contents/benefits02.jpg')}
.benefits li:nth-of-type(3) div {background-image:url('/images/english/contents/benefits03.jpg')}
.benefits li:nth-of-type(4) div {background-image:url('/images/english/contents/benefits04.jpg')}
.benefits li:last-child div {background-image:url('/images/english/contents/benefits05.jpg')}
.benefits li h3 {position:relative; padding:22px 34px; font-size:1.5em; color:#fff}
.benefits li h3:before {position:absolute; left:0; top:0; width:8px; height:100%; background:#2277f2; content:''}

/* sub0303 채용안내 */
.recruit ol {text-align:center; margin:74px 0 94px}
.recruit li {position:relative; display:inline-block; padding-right:50px; margin-right:18px; vertical-align:middle}
.recruit li:after {position:absolute; right:0; top:50%; transform:translateY(-50%); font-family:'xeicon'; content:'\e93e'; color:#b5b5b5; font-size:2em}
.recruit li:last-child {margin-right:0; padding-right:0}
.recruit li:last-child:after {display:none}
.recruit li .txt {position:relative;width:180px; height:180px; background:#2277f2; border-radius:50%}
.recruit li:first-child .txt {background:#383839}
.recruit li:last-child .txt {background:#1b2549}
.recruit li .txt div {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%}
.recruit li .txt strong {display:inline-block; margin-top:25px; font-size:1.425em; color:rgba(255,255,255,.4); font-weight:200}
.recruit li .txt p {font-size:1.225em; color:#fff; line-height:1.2}
.recruit li .txt span {font-size:0.875em; color:#fff; display:inline-block; line-height:1.2; margin-top:5px}
.recruit li:nth-of-type(3) .txt p {margin-top:18px}
.recruit div:nth-of-type(2) {position:relative; margin-bottom:62px; padding:30px 60px; border-top:1px solid #444; border-bottom:1px solid #e2e2e2}
.recruit div:nth-of-type(2):before {position:absolute; right:10%; bottom:0; width:243px; height:163px; background:url('/images/korean/contents/recruit.png') right bottom no-repeat; content:''}
.recruit div:nth-of-type(2):after {display:block; content:''; clear:both}
.recruit div:nth-of-type(2) strong {float:left; margin-right:66px; font-size:1.125em}
.recruit div:nth-of-type(2) .txt {float:left; display:inline-block;}
.recruit .btn01 em:before {top:18px}
.recruit .btn01 em {padding:15px 20px 15px 56px;}



/* sub0401 Q&A */
.qna {margin-top:70px}
.qna .txt {margin-bottom:30px; text-align:center}
.qna .txt p:first-child {font-size:1.250em; font-weight:600}
.qna .txt p:last-child {margin-top:18px; line-height:1.4; font-size:1.750em; font-weight:900}
.qna-form {border-top:1px solid #444}
.qna fieldset > div {margin:20px; padding:0 11px}
.qna textarea {width:100%; height:320px}
.qna .user-info {padding-bottom:31px; border-bottom:1px solid #e2e2e2}
.qna .user-info div {display:inline-block; margin-left:0.5%; width:24.4%; vertical-align:top}
.qna .user-info div:first-child,.qna .user-info div:last-child {margin-left:0}
.qna .user-info div:last-child {margin-top:30px}
.qna .user-info input[type="text"], .qna select {display:block; padding:0 8px; width:100%; height:46px; line-height:46px; border:1px solid #c6c6c6}
.qna .user-info input[type="text"]:first-of-type {margin-bottom:9px}
.qna select {background:#f9f9fb; color:#444}
.qna label {display:block; margin-bottom:2px; font-weight:600}

.qna .agree label {position:relative; display:inline-block; padding-left:44px; vertical-align:middle}
.qna .agree input[type="checkbox"] {position:absolute; z-index:-1; opacity:0}
.qna .agree span {display:inline-block; position:absolute; left:0; top:-4px; width:32px; height:32px; background:#c6c6c6; border-radius:50%; transition:background .3s ease-in-out}
.qna .agree span:after {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); font-family:'xeicon'; content:'\e928'; color:#fff;}
.qna .agree input[type="checkbox"]:checked~span {background:#2277f2}
.qna .agree a {display:inline-block; margin-left:15px; padding:6px 7px 6px 8px; border:1px solid #7c7c7c; border-radius:5px; vertical-align:middle; font-size:0.938em; transition:all .4s ease-in-out}
.qna .agree a:hover {border-color:#2277f2; color:#2277f2}

.qna .btn {display:block; padding-top:30px; text-align:center; border-top:1px solid #e2e2e2}
.qna .btn input {display:inline-block; padding:15px 41px 16px; border:1px solid #2277f2; background:#2277f2; color:#fff; transition:all .4s ease-in-out}
.qna .btn input:hover {background:#fff; color:#2277f2}

/* sub040201 통합검색 전체페이지 */
.search-form {margin-bottom:30px; text-align:center}
.search-form > * {height:60px; line-height:60px}
.search-form input[type="text"] {display:inline-block; padding:0 10px; width:29%; border:4px solid #2277f2; border-right:0}
.search-form button {width:60px; background:#2277f2; vertical-align:middle}
.search-form button i {line-height:60px; color:#fff}
.result-tab {border-top:1px solid #e2e2e2; border-bottom:1px solid #e2e2e2; text-align:center}
.result-tab li {position:relative; display:inline-block; margin-left:15px; padding-left:17px;}
.result-tab li:before {position:absolute; left:0; top:50%; transform:translateY(-50%); width:2px; height:20%; background:#e2e2e2; content:''}
.result-tab li:first-child {margin-left:0; padding-left:0}
.result-tab li:first-child::before {display:none}
.result-tab li a {position:relative; display:inline-block; padding:20px 0 22px; color:#777; transition:color .2s}
.result-tab li a:before {position:absolute; left:0; bottom:-1px; width:100%; height:2px; background:#2277f2; opacity:0; transform:scaleX(0); content:''; transition:transform .25s .2s, opacity .2s}
.result-tab li.active a, .result-tab li a:hover {color:#2277f2}
.result-tab li.active a:before, .result-tab li a:hover:before {opacity:1; transform:scaleX(1);}

.result-content {position:relative; margin-top:60px}
.result-content:first-of-type {margin-top:0}
.result-content .color01 {font-weight:900}
.result-content .title01 {margin-bottom:0}
.result-content > p {margin-bottom:21px; text-align:center}
.result-content .more {position:absolute; right:0; top:60px; display:inline-block; padding:6px; font-size:0.938em; border:1px solid #7c7c7c; border-radius:5px; transition:all .4s}
.result-content .list {border-top:1px solid #444}
.result-content .list li {border-bottom:1px solid #e2e2e2}

.result-content .list a {position:relative; display:block; padding:20px 20px 21px;}
.result-content .list a > * {display:inline-block; vertical-align:middle}
.result-content .list a .round {margin-right:34px; width:90px; height:90px;background:#f3f3f5; border-radius:50%; text-align:center; }
.result-content .list a .round span {display:block; margin-top:50%; transform:translateY(-50%); font-size:0.875em; color:#888; line-height:1}
.result-content .list a .round span em {display:block; font-size:1.571em; font-weight:900; color:#222;}
.result-content .list .txt {width:65%}
.result-content .list .txt strong {display:block; margin-bottom:8px; font-size:1.250em}
.result-content .list .txt > span {display:block; margin-top:18px; font-size:0.875em; color:#777}
.result-content .list .img {position:absolute; right:20px; top:50%; transform:translateY(-50%); width:14.3%}
.result-content .list a:hover strong {text-decoration:underline;}
.result-content .gallery-list li::after {display:none}

/* sub05 에코프로 지이엠, 이노베이션 */
.summary-top.sub .slogan {padding:47px 0; width:55%; margin:auto; position:inherit; left:inherit;}
.summary-top.sub .txt {padding:54px 47px 18px 82px; width:100%; position:inherit;}
.summary-top.sub .txt:after {display:block; content:''; clear:both}
.summary-top.sub .txt h2 {margin-bottom:33px}
.summary-top.sub h2:after {right:0; width:82%}
.summary-top.sub:after {display:block; clear:both; content:''}
.summary-top.sub > div {height:inherit;}


/* sub0501 에코프로 지이엠 */
.summary-top.gem {background-image:url('/images/english/contents/gem-bg.jpg')}
.summary-top.gem .txt p {float:left; width:40%; margin-top:0}
.summary-top.gem .summary-info {float:right; width:55%;}
.summary-top.gem .summary-info .current {margin-bottom:0}
.summary-top.gem .summary-info .current li {width:49%; height:auto; margin:0; text-align:left}
.summary-top.gem .summary-info .current li:after {display:none}
.summary-top.gem .summary-info .img {vertical-align:middle}
.summary-top.gem .summary-info .txt {position:inherit; left:inherit; transform:translateX(0); padding:0; background:none; display:inline-block; width:61%; vertical-align:middle; margin:0 0 0 8px; text-align:left; vertical-align:middle}
.summary-top.gem .current p {width:100%; margin:0; line-height:1.2}
.gem .title01:before {background:#383839}
.title-stock {position:relative; padding-left:42px}
.title-stock:before {position:absolute; left:0; content:'(주)'}

/* sub0502 에코프로 이노베이션 */
.innovation-top {background-image:url('/images/english/contents/innovation-bg.jpg')}
.summary-top.innovation-top h2:after {width:72%}
.summary-top.innovation-top .txt > div {display:inline-block; width:45%; margin-left:5%; vertical-align:top}
.summary-top.innovation-top .txt > div:first-of-type {margin-left:0}
.summary-top.innovation-top .txt > div p:first-child {margin-top:0}
.business-area.innovation {width:calc(100% - 1.1% - 602px); margin:auto}
.innovation li h3 {font-size:1em}
.innovation li h3:before {background:#2c7156}
.innovation li .business-title {background-image:url('/images/english/contents/innovation01.jpg')}
.innovation li:nth-of-type(2) .business-title {background-image:url('/images/english/contents/innovation02.jpg')}
.innovation li:nth-of-type(3) .business-title {background-image:url('/images/english/contents/innovation.jpg')}
.innovation li:nth-of-type(4) .business-title {background-image:url('/images/english/contents/innovation03.jpg')}

.board-search-title, .board-search-word {display:none}

.ap-wrap {position:relative;overflow-x:hidden}
.ap-wrap:before {display:block;content:'';width:calc(100vw - 120px);height:580px;background:url('/images/korean/contents/ap-top.jpg') no-repeat center top/cover;margin:auto}
.ap-wrap .detail-content:after {position:absolute;bottom:-150px;background:url('/images/korean/contents/ap_bg.jpg') no-repeat center bottom/cover;left:50%;transform:translateX(-50%);content:'';width:100vw;height:580px;z-index:-1}
.ap-wrap .txt {padding:60px 0 300px 128px;margin-top:-200px;position:relative;}
.ap-wrap .txt:after {display:block;clear:both;content:''}
.ap-wrap .txt:before {position:absolute;left:0;;width:120%;height:200px;background:#fff;content:'';top:0}
.ap-wrap .txt > * {float:left;position:relative;z-index:1}
.ap-wrap .txt .desc {margin-left:60px;font-size:19px;color:#777;font-weight:300}
.ap-wrap .txt .desc .bold {font-size:24px;color:#222;font-weight:600;margin-bottom:20px;line-height:1.3;}

/* 210224 컨텐츠 추가 */
.em-top {background-image:url('/images/korean/contents/em-bg.jpg')}
.business-area li .business-title.embusin {background-image: url(/images/korean/contents/business06.jpg);}
.subsidiary li .img .new {position: absolute; top: 5px; right: 5px; background: #ff6a00; border-radius: 50%; padding: 13.5px 10px 13.5px 5px; text-align: center; color: #fff; font-size: 15px; font-style: italic; font-weight: 700;}
/* //210224 컨텐츠 추가 */


/* sub010201 CEO 인사말 */
.greeting {margin-top:60px}
.greeting .img {display:inline-block; width:48%; vertical-align:top}
.greeting .txt {display:inline-block; margin-left:2.8%; width:48.6%; color:#444; vertical-align:middle}
.greeting .txt p:nth-of-type(4), .greeting .txt p:nth-of-type(6) {margin-top:28px}
.greeting .txt .sign {margin-top:40px; text-align:right; font-size:1.250em; font-weight:600; color:#777}


@media(max-width:1700px){
.ap-wrap:before {height:500px}
}

@media(max-width:1440px){
  .history .history-list > ul > li {margin-top: 200px;}
  .history:last-child .history-list > ul > li {margin-top: 150px;}
  .history:last-child .history-list > ul > li:first-child {margin-top: 0;}
  .environment-info > div {width:90%}
  .summary-top > div {width:100%}
  .summary-info .current li {margin:0 0 20px 0}
  .history .history-list > ul > li ul {display:block; margin-left:0}
  .history .history-list > ul > li ul li {margin:8px 0}
  .history .history-list > ul > li ul p {width:80%}
  .notice-img ul {width:95%}
  .recruit li {padding-right:0; margin-right:0; width:30%; margin:15px 0}
  .recruit li .txt {left:50%; transform:translateX(-50%);}
  .environment-info .environment-info-video,
  .environment-info > div:after {}
  /* sub05 */
  .summary-top h2:after {display:none}
  .summary-top .txt {left:50%; transform:translateX(-50%); width:90%;}
  .summary-top.sub .txt {padding:28px; width:90%; margin:auto; left:inherit; transform:translateX(0);}
  .summary-top .slogan {width:90%; border:0; margin:auto;left:50%; transform:translateX(-50%); right:inherit;}
  .summary-top.sub .slogan {left:inherit; transform:translateX(0);}
  .summary-top.gem .txt p {width:100%}
  .summary-top.gem .summary-info{margin-top:30px; width:100%}
  .notice-img .txt .title {height:82px}

   .mission li {width:25vw; height:25vw}
  .mission li:nth-of-type(2) {width:30vw; height:30vw}

  .talent div h3 {padding-top:43px; background-size:contain}
    .business-area.innovation {width:90%}
	 .contact .local a {padding:inherit; width:60px; height:60px; border-radius:50%}
  .contact .local a::before {left:50%; transform:translate(-50%, -50%);}
  .contact .local a span {display:none}
	
	.subsidiary .txt p br {display:none}

	.application li {width:25%; margin:10px 0}
	.ap-wrap:before {width:95vw}
  .ap-wrap .txt {padding-left:0;padding-bottom:180px}
}
@media(max-width:1300px){
	.talent div {width:35%}
	.ap-wrap .txt > * {float:none}
	.ap-wrap .txt .desc {margin:50px 0 0}
	.ap-wrap:before {height:405px}
}

@media(max-width:1200px){
  .environment-info .environment-info-video,
  .environment-info > div:after {}
  .product p {display:block; width:100%; margin:20px auto;}
  .product p:nth-of-type(2) {width:100%}
  .qna .user-info div {width:32.4%; margin-bottom:30px; vertical-align:top}
  .qna .user-info div:first-child, .qna .user-info div:last-child {margin-left:0.5%}
  .qna .user-info div:last-child {margin-top:0}
  .talent div {display:block; width:100%; margin:20px auto;}
  .talent div:nth-of-type(2) {margin-top:20px}
  .talent div h3 {padding-top:28px}

  .subsidiary li {width:40%; margin:3% 0 0 3%}
  .subsidiary li:first-child {margin-left:3%;}
  .application li {width:45%}
}


@media(max-width:1025px){
  .bg {padding-top:300px !important}
  .summary-top .slogan {width:90%}
  .summary-info .current li {width:33%}
  .summary-info .current li::after {width:50%; left:50%; transform:translateX(-50%);}
  .business-area li {width:47%}

  /* sub010102 */
  .mission li {display:block; margin:auto;}
  .mission li:nth-of-type(1)::before, .mission li:nth-of-type(2)::before {right:38%; bottom:-8%; top:inherit; transform:translateX(-50%);}
  .mission li:nth-of-type(2)::before {right:41%; transform:rotate(45deg); bottom:0}
  .ideology div {display:block; margin:30px auto; width:100%}
  .ideology div:nth-of-type(1) {margin:0 auto 30px}

  .history .history-img > div {width:80%}

  /* sub010104 */
  .ci {text-align:center}
  .ci .img {width:100%; margin-right:0}
  .ci .txt {margin-top:20px; width:80%; text-align:left}

  /* sub010501 */
  .ethics .btnWrap {width:100%}
  .ethics .btnWrap div {display:block; margin:15px 0}
  .ethics .intro3 {text-align: left;}

  .stock .now-stock ul {float:left; margin-top:20px}

  .notice-img {display:none}


  .direction > div { width:100%}

    .contact .title {width:20%}
  .contact .address {width:58%;}
  .contact .number {width:13%}
  .contact .local {width:7%}

  /* sub0201 */
  .environment-list {text-align:center}
  .environment-list .img {width:100%; margin-right:0}
  .environment-list .txt {margin-top:20px; width:80%}
  .environment-list .txt > div {padding-left:0}
  /* sub020101 */
  .chemisorbent-list li {width:100%; margin-left:0}


  /* sub0302 */
  .benefits li {width:47%}

  .recruit div:nth-of-type(2) {padding-bottom:160px}
  .recruit div:nth-of-type(2):before {right:0}

  .volunteer li {width:48%; margin: 2.6% 0 2.6% 2%;}
  .volunteer li:nth-child(3n+1) {margin-left:2%}
  .volunteer li:nth-child(-n+3) {margin-top:2.6%}


  .qna .user-info div {width:49%}
  .result-content .publication li:nth-child(n+3) {display:none}

  /* sub05 */
  .summary-top.sub .slogan {width:80%}
  .summary-top.gem .summary-info .txt {width:50%}
    .business-area.innovation {width:100%}
}
@media(max-width:768px){
  .history .history-list > ul > li ul {padding-left: 80px;}
  .history .history-list > ul > li {margin-top: 45px !important;}
  .business-area li {width:100%; margin-left:0}
  .mission li {width:250px; height:250px}
  .mission li:nth-of-type(2) {width:300px; height:300px}
  .ci .txt {width:100%}
  .history .history-img {display:none}
  .history .history-list {float:none; margin-top:50px; padding:0 0 0 40px; width:100%}
  .history .history-list:after {left:40px}

  .greeting .img, .greeting .txt {float:none; margin:20px 0; width:100%}
  .contact li {position:relative;}
  .contact .address {display:block; margin-bottom:12px; width:100%}

  .contact .title {width:inherit;}
  .contact .title span {display:none}
  .contact .number {width:inherit; padding-left:21px}
  .contact .local {width:12%; margin-left:12px}

  .stock .now-stock .common-stock {display:block; margin:20px 0 0 0}
  .social .intro3 {width:100%}

  .notice-img li {width:48%}
  .notice-img li:nth-child(n+3) {display:none}
  /* sub020105 */
  .monitor li {width:31.6%}
  /* sub020201 */
  .business-intro > div {float:none; width:100%}
  .green div:first-of-type {width:100%; margin-right:0}
  .green div:last-of-type {width:90%; margin:20px auto;}
  /* sub020301 */
  .subsidiary li {width:80%; margin:3% auto;}
  .subsidiary li:first-child {margin-left:auto;}
  /* sub0302 */
  .benefits li {width:100%; margin-left:0}
  .recruit ol {margin:20px 0}
  .recruit li {width:50%; margin:20px auto}
  .recruit li:after {right:inherit; top:inherit; left:50%; bottom:-35px; transform:translateX(-50%); content:'\e941'}
  .recruit .btn01 {width:462px}
  .recruit .btn01 span {width:70%}
  .recruit .btn01 em {padding:15px 0 15px 15px}

  .qna .agree label {display:block}
  .qna .agree a {margin:25px 0 0 0}
  .result-content .gallery-list li:nth-child(n+3) {display:none}
  .result-content .list .img {display:none}

  /* sub05 */
  .summary-top .slogan span {line-height:.8}
  .summary-top.gem .summary-info .current li {display:block; width:100%; margin:10px 0}
  .summary-top.innovation-top .txt > div {display:block; margin:10px 0; width:100%}

  .ethics ul {padding-left:0}
  .ethics ul:before {display:none}
  .ethics > div:nth-of-type(2) {padding:35px}

  .ap-wrap .txt {padding-bottom:0;margin-top:0;padding-top:20px}
	.ap-wrap .detail-content:after {height:200px;}
	.ap-wrap:before {background-size:cover}

  .subsidiary .txt {height:auto}
  .subsidiary .txt span {position:inherit; left:inherit; bottom:inherit; transform:translate(0); margin-bottom:40px}
}
@media(max-width:515px){
	.recruit .btn01 span {width:100%}
	.recruit .btn01 {width:auto}
	.recruit .btn01 em:before {left:36%}
}

@media(max-width:425px){
  .history .history-list > ul > li ul {padding-left: 70px;}
  .summary-info .current li {width:49%}
  .mission li {width:200px; height:200px}
  .mission li:nth-of-type(2) {width:200px; height:200px}
  .mission p {font-size:0.825em}
  .mission li:nth-of-type(2) p {font-size:1em}
  .mission li:nth-of-type(1)::before, .mission li:nth-of-type(3)::before {display:none}
  .mission li:nth-of-type(2)::before {right:35%}

  .history .history-list {padding-left:10px}
  .history .history-list:after {left:10px}
  .history .history-list > ul > li {padding-left:26px; margin-top:65px}

  .ethics ul {padding-left:0}
  .ethics ul:before {display:none}

  .stock .now-stock li {width:50%;margin-top:20px}
  .stock .now-stock li:nth-child(odd) {padding-left:0;}
  .stock .now-stock li:nth-child(odd)::before {display:none}

  .contact li {padding:30px 0}

  /* sub0201 */
  .environment-list .txt .btn a {width:150px; margin:2px 0}
  .product p {padding:85px 0}
  /* sub020105 */
  .monitor li {width:48.3%}

  .subsidiary li {width:100%}

  .talent div h3 {background-size:contain; padding:15px 0; width:100%}
  .recruit .btnWrap {width:100%;}
  .recruit .btnWrap .btn01 {width:100%}
  .recruit .btn01 em:before {left:32%}


  .volunteer li {width:100%; margin-left:0}
  .volunteer li:nth-child(3n+1) {margin-left:0}
  .qna .user-info div {width:100%}
  .result-content .more {top:40px}
  .result-content .list a {padding:20px 0 21px}
  .result-content .list a .round {margin-right:8px}

  .application li {width:100%}
  .application li strong {display:block}
	
	.ap-wrap .txt br {display:none}
}




/* 공급망정책 */
.supply_bg { height:402px;width:100%; background: url(/ecoprobm/images/korean/contents/supply_bg01.png) no-repeat center center/cover; }
.supply_content { padding:65px 210px;background: #f3f3f5;position: relative; margin-top:-250px;margin-bottom: 45px; }
.supply_content .tit { text-align: center;display:block; margin-bottom:30px; }
.supply_content .mid_tit { font-size:30px;color:#333;font-weight: 500;text-align: center; margin-bottom: 20px; } 
.supply_content .mid_tit i { vertical-align: middle; margin:0 10px; line-height: 130%;}
.supply_content .mid_tit img { vertical-align: middle;  }
.supply_content .bot_t { font-size:20px;text-align: center; margin-bottom:45px; }

.supply_content .supply_box { overflow: hidden; }
.supply_content .supply_box .inner_box { position:relative;width:48%;float:left;margin-left:4%; padding:30px 50px; background: #fff; min-height: 222px; }
.supply_content .supply_box .inner_box:before { width:8px;height:80px;position: absolute;content: "";display:block;top:0;left:0;background: #2277f2; }

.supply_content .supply_box .inner_box p { line-height: 170%; }
.supply_content .supply_box .inner_box:first-of-type { margin-left:0; }

.side_txt { text-align: center;line-height: 170%;color:#444;font-size:16px; }

@media(max-width:1440px){
    .supply_content { padding:50px; }

}

@media(max-width:1150px){
    .supply_content .supply_box .inner_box { float:none;width:100%;margin-left:0;min-height: auto;margin-top:20px; }
    .supply_content .supply_box .inner_box:first-of-type { margin-top:0; }
}


@media(max-width:1000px){
    .supply_content br { display:none !important; }
    .side_txt br { display:none; }
    .supply_content .bot_t { font-size:18px; }
    .supply_content .mid_tit { font-size:24px; }
    .supply_content .mid_tit span img { display:none; }
    .supply_content { padding:50px 20px; }
    .supply_content .supply_box .inner_box { padding:20px 30px; }
    .side_txt { font-size:14px; }
    .supply_bg { height:300px; }
}

.ecoprohn_logo { width: 100%; max-width: 151px; }


/* 210607 온실가스 컨텐츠 추가 */
.group_solution .item_top {
    margin-bottom: 44px;
}
.group_solution .item_top .title {
    height: 90px;
    line-height: 90px;
    color: #fff;
    font-size: 26px;
    font-weight: 500;
    background: #042e7d;
    border-radius: 10px;
    text-align: center;
}
.group_solution .item_top .desc {
    text-align: center;
    padding: 24px 0;
    box-shadow: 0px 4px 2px -2px rgba(245, 182, 214, 1);
}
.group_solution .item_top .desc strong {
    display: block;
    font-size: 24px;
    color: #2277f2;
    line-height: 36px;
}
.group_solution .item_top .desc p {
    font-size: 18px;
    line-height: 27px;
}
.group_solution .group_circle {
    display: table;
    max-width: 1000px;
    table-layout: fixed;
    margin: 0 auto 64px;
}
.group_solution .group_circle > div {
    display: table-cell;
    position: relative;
    vertical-align: top;
    padding: 0 60px;
}
.group_solution .group_circle .item {
    position: relative;
    width: 241px;
    height: 241px;
    border-radius: 50%;
    border: 3px dotted #9197AD;
    text-align: center;
    padding-top: 56px;
    margin: 0 auto;
}
.group_solution .group_circle .item i {
    position: relative;
}
.group_solution .group_circle .item i::after {
    position: absolute;
    width: 270px;
    height: 120px;
    top: -72px;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    z-index: -1;
    content: "";
}
.group_solution .group_circle .item::before {
    position: absolute;
    width: 263px;
    height: 263px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    border: 5px solid #24315D;
    content: "";
    z-index: -1;
}
.group_solution .group_circle .item::after {
    position: absolute;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    border: 5px solid #24315D;
    bottom: -22px;
    left: 50%;
    transform: translateX(-50%);
    content: "";
}
.group_solution .group_circle > div:nth-child(2) .item::after,
.group_solution .group_circle > div:nth-child(2) .item::before,
.group_solution .group_circle > div:nth-child(2) .item { border-color: #1e74dc; }
.group_solution .group_circle > div:nth-child(3) .item::after,
.group_solution .group_circle > div:nth-child(3) .item::before,
.group_solution .group_circle > div:nth-child(3) .item { border-color: #0095da; }
.group_solution .group_circle > div::after {
    position: absolute;
    border: 1px dashed #cfcfcf;
    content: "";
    z-index: -1;
}
.group_solution .group_circle > div:nth-child(1)::after {
    width: 216px;
    bottom: -40px;
    left: 180px;
    transform: rotate(15deg);
}
.group_solution .group_circle > div:nth-child(2)::after {
    width: 58px;
    bottom: -26px;
    left: 152px;
    transform: rotate(90deg);
}
.group_solution .group_circle > div:nth-child(3)::after {
    width: 230px;
    bottom: -41px;
    right: 174px;
    transform: rotate(-15deg);
}
.group_solution .group_circle .item i {
    display: block;
    margin-bottom: 14px;
}
.group_solution .group_circle .item p {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.9px;
    line-height: normal;
    color: #161617;
    padding: 0 2rem;
}
.group_solution .group_circle .item p br {
    display: block;
}
.group_solution .group_circle_desc {
    text-align: center;
    margin-bottom: 50px;
}
.group_solution .group_circle_desc p {
    font-size: 18px;
    color: #747474;
    line-height: 1;
    background: #fff;
}
.group_solution .group_circle_desc strong {
    display: block;
    font-size: 36px;
    letter-spacing: -1.8px;
    color: #2277f2;
}
.group_solution .item_bottom::after {
    display: block;
    clear: both;
    content: "";
}
.group_solution .item_bottom .list {
    position: relative;
    float: left;
    width: 680px;
}
.group_solution .item_bottom .list::after {
    position: absolute;
    width: 230px;
    height: 290px;
    top: 50%;
    right: -42%;
    transform: translateY(-50%);
    background: url("/images/korean/contents/solution_arrow.svg") no-repeat center center/100%;
    content: "";
}
.group_solution .item_bottom .list ul li {
    background: #F6F6F6;
    border-radius: 10px;
    text-align: left;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: -0.9px;
    padding: 28px 28px 28px 80px;
    margin-bottom: 8px;
}
.group_solution .item_bottom .list ul li .item {
    position: relative;
}
.group_solution .item_bottom .list ul li .item i {
    position: absolute;
    font-family: 'Squada One' !important;
    font-size: 30px;
    font-weight: 500;
    color: #24315D;
}
.group_solution .item_bottom .list ul li .item span {
    display: block;
    font-weight: 400;
    padding-left: 42px;
}
.group_solution .item_bottom .list ul li:last-child {
    margin-bottom: 0;
}
.group_solution .item_bottom .desc {
    float: left;
    width: calc(100% - 680px);
    text-align: center;
    margin-top: 56px;
    padding-left: 220px;
}
.group_solution .item_bottom .desc i {
    display: block;
}
.group_solution .item_bottom .desc strong {
    display: block;
    font-size: 30px;
    letter-spacing: -1.3px;
    line-height: 40px;
    color: #2277f2;
    margin-bottom: 8px;
}
.group_solution .item_bottom .desc strong span {
    font-size: 26px;
    color: #161617;
}
.group_solution .item_bottom .desc p {
    font-size: 18px;
}

@media (max-width: 1440px) {
    .group_solution .item_bottom .list {
        width: 40%;
    }
    .group_solution .item_bottom .desc {
        width: 60%;
    }
    .group_solution .item_bottom .list::after {
        right: -60%;
    }
    .group_solution .group_circle {
        width: 100%;
    }
    .group_solution .group_circle > div {
        padding: 0;
    }
    .group_solution .group_circle > div::after {
        content: none;
    }
    .group_solution .item_bottom .list ul li {
        padding: 28px 40px;
    }
}
@media (max-width: 940px) {
    .group_solution .group_circle .item {
        width: 180px;
        height: 180px;
        padding-top: 40px;
    }
    .group_solution .group_circle .item::before {
        width: 202px;
        height: 202px;
    }
    .group_solution .group_circle .item i img {
        height: 40px;
    }
    .group_solution .group_circle .item i::after {
        height: 90px;
    }
    .group_solution .group_circle .item p {
        font-size: 15px;
        line-height: 1.2;
    }
}
@media (max-width: 768px) {
    .group_solution .item_bottom .list,
    .group_solution .item_bottom .desc {
        float: none;
        width: 100%;
        padding-left: 0;
    }
    .group_solution .item_bottom .list {
        padding-bottom: 200px;
    }
    .group_solution .item_bottom .list::after {
        right: inherit;
        top: inherit;
        left: 50%;
        bottom: -50px;
        transform: translateX(-50%) rotate(90deg);
    }
    .group_solution .item_bottom .list ul li {
        padding: 20px
    }
    .group_solution .group_circle {
        margin-bottom: 32px;
    }
    .group_solution .group_circle_desc {
        margin-bottom: 25px;
    }
}
@media (max-width: 700px) {
    .group_solution .group_circle {
        display: block;
        max-width: 100%;
        text-align: center;
    }
    .group_solution .group_circle::after {
        display: block;
        clear: both;
        content: "";
    }
    .group_solution .group_circle > div {
        display: block;
        float: left;
        width: 50%;
        margin-bottom: 40px;
    }
    .group_solution .group_circle > div:last-child {
        width: 100%;
    }
}
@media (max-width: 480px) {
    .group_solution .group_circle > div {
        float: none;
        width: 100%;
    }
    .group_solution .item_bottom .desc i img {
        width: 70px;
    }
    .group_solution .item_bottom .list {
        padding-bottom: 100px;
    }
    .group_solution .item_bottom .list::after {
        width: 100px;
        height: 160px;
    }
}

/* //210607 온실가스 컨텐츠 추가 */

.box1 { display: table; width: calc(100% + 0px); table-layout: fixed; overflow: hidden; border-radius: 45px 0 45px 0; background-color: #f3f3f3; font-size: 22px; line-height: 1.818; }

.box1 > * { display: table-cell; padding-right: 0px; vertical-align: middle; }

.box1 .img { width: 512px; }

.box1 .img img { max-width: 100%; }

.box1 .desc { padding: 0 70px; word-break: keep-all; }

.box1 + .summary-info .current li { width: 200px; margin: 0; max-width: 16%; }

.box1 + .summary-info .current .img { padding-top: 25px; }

.box2 { position: relative; z-index: 0; overflow: hidden; padding: 75px 400px 75px 130px; border-radius: 45px 0 45px 0; font-size: 18px; color: #fff; }

.box2 .img { position: absolute; left: 0; top: 0; z-index: -1; width: 100%; height: 100%; content: ''; }

.box2 .img img { position: absolute; right: 0; top: 0; min-width: 100%; min-height: 100%; }

.box2 li { position: relative; padding-left: 30px; word-break: keep-all; }

.box2 li + li { margin-top: 1rem; }

.box2 li span { position: absolute; left: 0; top: 0; font-weight: 600; color: #c8deff; }

@media (max-width: 1150px) { .box1 .img { width: 45%; }
  .box1 .desc { padding: 0 30px; font-size: 16px; }
  .box2 { padding: 50px 300px 50px 50px; font-size: 16px; }
  .box2 .img img { right: -100px; }
  .list1 li { font-size: 16px; } }

@media (max-width: 1025px) { .box1 + .summary-info .current li { width: 33.333%; max-width: inherit; margin-bottom: 20px; }
  .list1 { margin-bottom: 50px; padding-right: 0; }
  .list1 li { display: block; width: 100%; height: auto; padding: 30px; margin-bottom: 10px; text-align: center; }
  .list1 li::before { width: 100%; border-radius: 1rem; }
  .list1 li::after { right: auto; left: 50%; top: auto; bottom: 0; width: 50%; height: 0; margin: 0 0 0 -25%; padding-top: 50%; border-radius: 1rem; -webkit-transform: translateY(50%) scaleY(0.1) rotate(135deg); transform: translateY(50%) scaleY(0.1) rotate(135deg); } }

@media (max-width: 768px) { .form-textbox, .form-select select, .form-file .txt { font-size: 14px; }
  .table colgroup { display: none; }
  .table th, .table td { display: block; padding: 10px; text-align: left; }
  .box1 .img { display: block; width: 100%; }
  .box1 .img img { width: 100%; }
  .box1 .desc { display: block; padding: 20px; }
  .box2 { padding: 30px 40px; }
  .box2 .img img { right: auto; left: 0; }
  .box3 { padding: 30px; border-radius: 20px 20px 20px 0; }
  .box3 .img img { width: 100px; margin: 0 auto; }
  .box3 .desc { display: block; padding: 0; font-size: 16px; text-align: center; white-space: normal; word-break: keep-all; }
  .box3 .desc strong { font-size: 20px; } }

@media (max-width: 425px) { .filelist img { width: 20px; }
  .box1 + .summary-info .current li { width: 49%; }
  .form2 { padding-right: 0; }
  .form2 button { position: static; margin: 10px auto 0; }
  .tab li i[class*="icon4-"]::before, .tab li.active i[class*="icon4-"]::before { background-size: 2rem; }
  .tab li i.new-icon1::before { font-size: 22px; }
}

/* 환경안정 */
.environmental-safe .intro {margin-bottom:0; padding-bottom:0; border:0}
.environmental-safe .intro span {display:inline-block; margin-bottom:18px; font-weight:600}
.environmental-safe h3 {text-align:center; font-size:2em; font-weight:600}
.environmental-safe > div:nth-of-type(2) {margin:42px 0 30px; padding:70px 66px; background:url('/images/korean/contents/environmenta_safe_bg.jpg') center/cover no-repeat}
.environmental-safe > div:nth-of-type(2) ul {position:relative; padding-left:110px;}
.environmental-safe > div:nth-of-type(2) ul:before {position:absolute; left:0; top:15px; width:82px; height:1px; background:rgba(255, 255, 255, .4); content:''}
.environmental-safe > div:nth-of-type(2) ul li {color:#fff; line-height:1.3; margin:10px 0 }
.environmental-safe > div:nth-of-type(3) ul {text-align:center}
.environmental-safe > div:nth-of-type(3) li {display:inline-block; width:33%; height:265px; height: auto; padding-top:148px; margin-top:43px; background-position:top center; background-repeat:no-repeat}
.environmental-safe > div:nth-of-type(3) li:nth-of-type(1) {background-image:url('/images/korean/contents/safe01.png')}
.environmental-safe > div:nth-of-type(3) li:nth-of-type(2) {background-image:url('/images/korean/contents/safe02.png')}
.environmental-safe > div:nth-of-type(3) li:nth-of-type(3) {background-image:url('/images/korean/contents/safe03.png')}
.environmental-safe > div:nth-of-type(3) li:nth-of-type(4) {background-image:url('/images/korean/contents/safe04.png')}
.environmental-safe > div:nth-of-type(3) li:nth-of-type(5) {background-image:url('/images/korean/contents/safe05.png')}
.environmental-safe > div:nth-of-type(3) li strong {display:block; font-size:1.375em; margin-bottom:12px}

/* responsive */
@media(max-width:1700px){
    .ap-wrap:before {height:500px}
    }
    @media(max-width:1440px){
      .history .history-list > ul > li {margin-top: 170px;}
      .history:last-child .history-list > ul > li {margin-top: 100px;}
      .environment-info > div {width:90%}
      .summary-top > div {width:100%}
      .summary-info .current li {margin:0 0 20px 0}
      .history .history-list > ul > li ul {display:block; margin-left:0}
      .history .history-list > ul > li ul li {margin:8px 0}
      .history .history-list > ul > li ul p {width:80%}
      .notice-img ul {width:95%}
      .notice-img .txt .title {height:82px}
      .recruit li {padding-right:0; margin-right:0; width:30%}
      .recruit li .txt {left:50%; transform:translateX(-50%);}
      .environment-info .environment-info-video,
      .environment-info > div:after {width:30%;background-size:contain;}
      /* sub05 */
      .summary-top h2:after {display:none}
      .summary-top .txt {left:50%; transform:translateX(-50%); width:90%;}
      .summary-top.sub .txt {padding:28px; width:90%; margin:auto; left:inherit; transform:translateX(0);}
      .summary-top .slogan {width:90%; border:0; margin:auto;left:50%; transform:translateX(-50%); right:inherit;}
      .summary-top.sub .slogan {left:inherit; transform:translateX(0);}
      .summary-top.gem .txt p {width:100%}
      .summary-top.gem .summary-info{margin-top:30px; width:100%}
      .talent div h3 {background-size:contain; padding-top:43px}
        
      .mission li {width:25vw; height:25vw}
      .mission li:nth-of-type(2) {width:30vw; height:30vw}
    
      .business-area.innovation {width:90%}
      .ap-wrap:before {width:95vw}
      .ap-wrap .txt {padding-left:0;padding-bottom:180px}
        
      /* 210224 에코프로이엠 추가 */
      .subsidiary .txt p br {display: none;}
      .subsidiary .txt span {width: 100%; bottom: 0;}
      /* //210224 에코프로이엠 추가 */
    }
    @media(max-width:1300px){
        .ap-wrap .txt > * {float:none}
        .ap-wrap .txt .desc {margin:50px 0 0}
        .ap-wrap:before {height:405px}
    }
    @media(max-width:1200px){
      .environment-info .environment-info-video,
      .environment-info > div:after {}
      .talent div {display:block; width:100%; margin:20px auto;}
      .talent div:nth-of-type(2) {margin-top:20px}
      .talent div h3 {padding-top:28px}
      .qna .user-info div {width:32.4%; margin-bottom:30px; vertical-align:top}
      .qna .user-info div:first-child, .qna .user-info div:last-child {margin-left:0.5%}
      .qna .user-info div:last-child {margin-top:0}
        /* sub05 */
      
      .subsidiary li {width:40%; margin:3% 0 0 3%}
      .subsidiary li:first-child {margin-left:3%;}
    
      .environmental-system > ul > li:last-child .txt > div > div > div  {width:45%}
      .subsidiary .info-txt:before {width:95vw}
    
      .subsidiary .txt span {width: auto; bottom: 50px;}
    }
    
    
    @media(max-width:1025px){
      .summary-top .slogan {width:90%}
      .summary-info .current li {width:33%}
      .summary-info .current li::after {width:50%; left:50%; transform:translateX(-50%);}
      .business-area li {width:47%}
    
      /* sub010102 */
      .mission li {display:block; margin:auto;}
      .mission li:nth-of-type(1)::before, .mission li:nth-of-type(3)::before  {left:50%; right:inherit; bottom:-8%; top:inherit; transform:translateX(-50%); font-size:1.2em}
      .mission li:nth-of-type(3)::before {top:0}
      .mission li:nth-of-type(2) p {font-size:1.4em}
      .ideology div {display:block; margin:30px auto; width:100%}
      .ideology div:nth-of-type(1) {margin:0 auto 30px}
    
      .history .history-img > div {width:80%}
    
      /* sub010104 */
      .ci {text-align:center}
      .ci .img {width:100%; margin-right:0}
      .ci .txt {margin-top:20px; width:80%; text-align:left}
    
      /* sub010501 */
      .ethics .intro3 {text-align:left}
      .ethics .btnWrap div {display:block; margin:15px 0}
        
      .environmental-safe .intro3 {text-align:left} 
      .environmental-safe > div:nth-of-type(3) li {width:45%; vertical-align:top}
      .environmental-safe > div:nth-of-type(3) li strong {font-size:1.075em}
      .safe-system div ul li {width:45%; margin-top:5%}
      .safe-system div ul li:nth-of-type(3) {margin-left:0}
    
      .stock .now-stock ul {float:left; margin-top:20px}
    
      .notice-img {display:none}
    
    
    
      .direction > div { width:100%}
    
      .contact a {padding:inherit; width:60px; height:60px; border-radius:50%}
      .contact a::before {left:50%; transform:translate(-50%, -50%);}
      .contact a span {display:none}
      /* sub0201 */
      .environment-list {text-align:center}
      .environment-list .img {width:100%; margin-right:0}
      .environment-list .txt {margin-top:20px; width:80%}
      .environment-list .txt > div {padding-left:0}
      /* sub020101 */
      .chemisorbent-list li {width:100%; margin-left:0}
    
    
      /* sub0302 */
      .benefits li {width:47%}
    
      .recruit div:nth-of-type(2) {padding-bottom:160px}
      .recruit div:nth-of-type(2):before {right:0}
    
      .volunteer li {width:48%; margin: 2.6% 0 2.6% 2%;}
      .volunteer li:nth-child(3n+1) {margin-left:2%}
      .volunteer li:nth-child(-n+3) {margin-top:2.6%}
    
    
      .qna .user-info div {width:49%}
      .result-content .publication li:nth-child(n+3) {display:none}
      /* sub05 */
      .summary-top.sub .slogan {width:80%}
      .summary-top.gem .summary-info .txt {width:50%}
    
      .filter-amc {height:auto}
      .filter-amc:after {top:0}
      .filter-amc div {position:inherit; top:inherit; left:inherit; transform:translateX(0); width:45%; padding-top:380px; vertical-align:top}
      .filter-amc div:first-child {transform:translateX(0); margin-right:9%}
      .business-area.innovation {width:100%}
    }
    
    @media(max-width:768px){
      .history .history-list > ul > li {margin-top: 45px !important;}
      .business-area li {width:100%; margin-left:0}
      .mission li {width:250px; height:250px}
      .mission li:nth-of-type(2) {width:300px; height:300px}
      .ci .txt {width:100%}
      .history .history-img {display:none}
      .history .history-list {float:none; margin-top:50px; padding:0 0 0 40px; width:100%}
      .history .history-list:after {left:40px}
    
      .greeting .img, .greeting .txt {float:none; margin:20px 0; width:100%}
      .contact div {position:relative;padding-bottom:60px}
      .contact li {position:relative;}
      .contact .address {position:absolute; bottom:15px; left:0; width:100%; padding:0}
      .contact .address::before {display:none}
      .contact .title {width:inherit;display:block}
      .contact .title span {display:none}
      .contact .number {width:inherit; padding-left:21px}
      .contact .local {position:absolute; right:33px; top:50%; transform:translateY(-50%);}
    
      .stock .now-stock .common-stock {display:block; margin:20px 0 0 0}
      .social .intro3 {width:100%}
      .ethics > div:nth-of-type(2) {padding:70px 26px}
      .ethics ul {padding-left:0}
      .ethics ul:before {display:none}
    
      .environmental-safe > div:nth-of-type(2) {padding:70px 26px}
      .environmental-safe > div:nth-of-type(2) ul {padding-left:0}
      .environmental-safe > div:nth-of-type(2) ul:before {display:none}
    
      .environmental-system .img, .environmental-system .txt {width:100%}
      .environmental-system .img {margin-bottom:20px}	
    
      /* sub020105 */
      .monitor li {width:31.6%}
      /* sub020201 */
      .business-intro > div {float:none; width:100%}
      .green div:first-of-type {width:100%; margin-right:0}
      .green div:last-of-type {width:90%; margin:20px auto;}
      /* sub020301 */
      .subsidiary li {width:80%; margin:3% auto;}
      .subsidiary li:first-child {margin-left:auto;}
      /* sub0302 */
      .benefits li {width:100%; margin-left:0}
      .recruit ol {margin:20px 0}
      .recruit li {width:50%; margin:20px auto}
      .recruit li:after {right:inherit; top:inherit; left:50%; bottom:-35px; transform:translateX(-50%); content:'\e941'}
    
      .qna .agree label {display:block}
      .qna .agree a {margin:25px 0 0 0}
      .result-content .gallery-list li:nth-child(n+3) {display:none}
      .result-content .list .img {display:none}
      /* sub05 */
      .summary-top .slogan span {line-height:.8}
      .summary-top.gem .summary-info .current li {display:block; width:100%; margin:10px 0}
      .summary-top.innovation-top .txt > div {display:block; margin:10px 0; width:100%}
    
        .environment-list .txt .btn .btn02 {margin:6px 0 0 6px}
    
    .ap-wrap .txt {padding-bottom:0;margin-top:0;padding-top:20px}
    .ap-wrap .detail-content:after {height:200px;}
    .ap-wrap:before {background-size:cover}
    .subsidiary .info-txt {padding:120px 20px;word-break:keep-all}
    .subsidiary .info-txt br {display:none}
    
    /* 210224 에코프로이엠 */
    .summary-top.em-top .txt p {word-break: keep-all;}
    .summary-top.em-top .txt p br {display: none;}
    /* //210224 에코프로이엠 */
    }
    @media(max-width:425px){
      .summary-top .txt {padding:87px 40px 50px}
      .summary-top .slogan {padding:50px 0}
      .summary-info .current li {width:49%}
      .mission li {width:150px; height:150px}
      .mission li:nth-of-type(2) {width:200px; height:200px}
      .mission p {font-size:0.825em}
      .mission li:nth-of-type(2) p {font-size:1em}
      .mission li:nth-of-type(1)::before {right:31%}
      .mission li:nth-of-type(2)::before {right:35%}
    
      .history .history-list {padding-left:10px}
      .history .history-list:after {left:10px}
      .history .history-list > ul > li {padding-left:26px; margin-top:65px}
    
      .environmental-safe > div:nth-of-type(3) li {width:100%}
       .safe-system div ul li {width:100%; margin-left:0}
       .environmental-system > ul > li:last-child .txt > div > div > div {width:100%}
    
      .contact div {padding:20px 0}
      .contact .address {bottom: inherit;left: inherit;position: static;padding-top: 16px;width: 70%;word-break: keep-all;}
      .contact .number {display:block;margin-top:10px}
      /* sub0201 */
      .environment-list .txt .btn a {width:150px; margin:2px 0}
    
      /* sub020105 */
      .monitor li {width:48.3%}
    
      .subsidiary li {width:100%}
    
      .talent div h3 {background-size:contain; padding:15px 0; width:100%}
      .recruit .btnWrap {width:100%;}
      .recruit .btnWrap .btn01 {width:100%}
    
    
      .volunteer li {width:100%; margin-left:0}
      .volunteer li:nth-child(3n+1) {margin-left:0}
      .qna .user-info div {width:100%}
      .result-content .more {top:40px}
      .result-content .list a {padding:20px 0 21px}
      .result-content .list a .round {margin-right:8px}
    
      .filter-amc:after {width:300px; height:300px; background-size:contain}
      .filter-amc div {width:100%; padding:10px;}
      .filter-amc div:first-child {margin:0; padding-top:330px}
      .filter-amc div:first-child h3 {float:inherit}
      .filter-amc div h3 {margin:0 auto 30px}
      .filter-amc ul.bul.dot3 > li {text-align:left}
      .filter-amc ul.bul.dot3 > li:before {left:0}
    
      .ap-wrap .txt br {display:none}
      .subsidiary .info-txt {padding:40px 20px;word-break:keep-all}
    }

    /* 210616 사회공헌 */
.content_tab.sub0306 a div i {
    display: block;
    height: 2.3rem;
    margin: 0 auto 0.3rem;
}
.content_tab.sub0306 a.on::before {
    position: absolute;
    width: 0.75rem;
    height: 0.4rem;
    bottom: -0.05rem;
    left: 50%;
    transform: translateX(-50%);
    background: url("/web/images/icon/sub0306_tab_on.svg") no-repeat center center/cover;
    content: "";
}
.content_tab.sub0306 a div i.icon01 {
    background: url("/web/images/icon/red_sub0306_icon01.svg") no-repeat center center/2.5rem;
}
.content_tab.sub0306 a.on div i.icon01 {
    background: url("/web/images/icon/sub0306_icon01_on.svg") no-repeat center center/2.5rem;
}
.content_tab.sub0306 a div i.icon02 {
    background: url("/web/images/icon/red_sub0306_icon02.svg") no-repeat center center/2.3rem;
}
.content_tab.sub0306 a.on div i.icon02 {
    background: url("/web/images/icon/sub0306_icon02_on.svg") no-repeat center center/2.3rem;
}
.content_tab.sub0306 a div i.icon03 {
    background: url("/web/images/icon/red_sub0306_icon03.svg") no-repeat center center/2.35rem;
}
.content_tab.sub0306 a.on div i.icon03 {
    background: url("/web/images/icon/sub0306_icon03_on.svg") no-repeat center center/2.35rem;
}
.content_tab.sub0306 a div i.icon04 {
    background: url("/web/images/icon/red_sub0306_icon04.svg") no-repeat center center/2.25rem;
}
.content_tab.sub0306 a.on div i.icon04 {
    background: url("/web/images/icon/sub0306_icon04_on.svg") no-repeat center center/2.25rem;
}
.content_tab.sub0306 a div i.icon05 {
    background: url("/web/images/icon/red_sub0306_icon05.svg") no-repeat center center/2.25rem;
}
.content_tab.sub0306 a.on div i.icon05 {
    background: url("/web/images/icon/sub0306_icon05_on.svg") no-repeat center center/2.25rem;
}
.content_tab.sub0306 .tab_txt ul.txt_list li {
    line-height: 1.8;
    padding-left: rem;
    margin-bottom: 1.75rem;
}
.content_tab.sub0306 .tab_txt ul.txt_list li:last-child {
    margin-bottom: 0;
}
.content_tab.sub0306 .tab_txt ul.txt_list li strong {
    display: block;
    position: relative;
    font-size: 1.4rem;
    letter-spacing: -0.06rem;
    padding-left: 1rem;
}
.content_tab.sub0306 .tab_txt ul.txt_list li strong::before {
    position: absolute;
    width: 0.7rem;
    height: 0.7rem;
    background: #fff;
    border: 3px solid #2277f2;
    top: 0.9rem;
    left: 0;
    border-radius: 50%;
    content: "";
}
.content_tab.sub0306 .tab_txt ul.txt_list li strong span {
    color: #2277f2;
}
.content_tab.sub0306 .txt_list > li:before {
    width: 0.5rem;
    height: 0.5rem;
    background: #fff;
    border: 3px solid #2277f2;
    top: 0.8rem;
}
.content_tab.sub0306 .tab_txt ul.txt_list li p {
    font-size: 1.2rem;
    font-weight: 400;
    letter-spacing: -0.045rem;
    color: #656565;
    padding-left: 1rem;
}
.content_tab.sub0306 .photo_gallery {
    margin-top: 2.5rem;
}
.content_tab.sub0306 .photo_gallery > strong {
    display: inline-block;
    position: relative;
    color: #4D4D4D;
    background: #fff;
    padding-right: 1rem;
    margin-bottom: 1rem;
}
.content_tab.sub0306 .photo_gallery > strong::before {
    display: inline-block;
    width: 0.8rem;
    height: 0.7rem;
    vertical-align: middle;
    background: url("/web/images/icon/photo_gallery_icon.svg") no-repeat center center/cover;
    margin-right: 0.4rem;
    content: "";
}
.content_tab.sub0306 .photo_gallery > strong::after {
    position: absolute;
    width: 100vw;
    height: 1px;
    top: 1rem;
    background: #D6D6D6;
    z-index: -1;
    content: "";
}
.content_tab.sub0306 .photo_gallery > strong span {
    display: inline-block;
    vertical-align: middle;
    font-size: 1rem;
    color: #4D4D4D;
}
.content_tab.sub0306 .photo_gallery > .list {
    margin: 0 -0.5rem 3.8rem;
}
.content_tab.sub0306 .photo_gallery > .list > div {
    float: left;
    width: 33.333%;
    padding: 0 0.5rem;
    margin-bottom: 2rem;
}
.content_tab.sub0306 .photo_gallery > .list > div .item p {
    font-size: 1rem;
    letter-spacing: -0.04rem;
    color: #666;
    margin-top: 0.5rem;
}
.board_gall {
    margin: 0 -0.5rem;
}
.board_gall::after {
    display: block;
    clear: both;
    content: "";
}
.board_gall > a {
    display: block;
    float: left;
    width: 33.333%;
    padding: 0 0.5rem;
    margin-bottom: 1rem;
    text-align: center;
}
.board_gall > a .item {
    border: 1px solid #E8E8E8;
}
.board_gall > a:focus .thumb img,
.board_gall > a:hover .thumb img {
    transform: scale(1.2) translate(-42%, -42%);
}
.board_gall > a .thumb {
    position: relative;
    height: 0;
    overflow: hidden;
    padding-top: 63%;
    z-index: 1;
}
.board_gall > a .thumb img {
    position: absolute;
    width: 100%;
    min-height: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}
.board_gall > a .desc {
    padding: 1.5rem 0.5rem;
    background: #fff;
}
.board_gall > a .desc strong {
    display: block;
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: -0.03rem;
    color: #333;
    margin-bottom: 0.4rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.board_gall > a .desc p {
    font-size: 1rem;
    letter-spacing: -0.024rem;
    color: #666;
}
.content_tab.sub0306 .check_list {
    background: #F0F2F5;
    padding: 1.15rem 3.5rem;
    margin-top: 2rem;
}
.content_tab.sub0306 .check_list span {
    display: inline-block;
    position: relative;
    width: 19.5%;
    vertical-align: top;
    font-size: rem;
    font-weight: 500;
    letter-spacing: -0.045rem;
    padding: 0 0.5rem 0 1.2rem;
    margin: 0.5rem 0;
}
.content_tab.sub0306 .check_list span::before {
    position: absolute;
    top: 0.3rem;
    left: 0;
    font-family: 'xeicon';
    font-size: rem;
    content: "\e92e";
    color: #2277f2;
}
.grey_bg .board-form .detail-content {
    margin-bottom: 0;
}
.content_tab.sub0306 + .title01 {
    margin-bottom: 0.6rem;
}
/*콘텐츠 탭*/
.content_tab {
    position: relative;
    padding-top: 10.3rem;
    overflow: hidden;
}
.content_tab a {
    padding: 1.45rem 0.5rem;
    text-align: center;
    display: block;
    position: relative;
    border: 1px solid #d2d2d2;
    color: #646464;
    float: left;
    position: absolute;
    top: 0;
    background: #fff;
    border-left: 0;
    font-size: rem;
    letter-spacing: -0.045rem;
}
.content_tab a.on {
    background: #042e7d;
    color: #fff;
}
.content_tab a:first-of-type {
    border-left: 1px solid #d2d2d2;
    border-radius: 0.75rem 0 0 0.75rem;
}
.content_tab a:last-of-type {
    border-radius: 0 0.75rem 0.75rem 0;
}
.content_tab.tab_col_3 a:nth-of-type(1) {
    left: 0;
}
.content_tab.tab_col_3 a:nth-of-type(2) {
    left: 33.333%;
}
.content_tab.tab_col_3 a:nth-of-type(3) {
    left: 66.666%;
}
.content_tab.tab_col_4 a:nth-of-type(1) {
    left: 0;
}
.content_tab.tab_col_4 a:nth-of-type(2) {
    left: 25%;
}
.content_tab.tab_col_4 a:nth-of-type(3) {
    left: 50%;
}
.content_tab.tab_col_4 a:nth-of-type(4) {
    left: 75%;
}
.content_tab.tab_col_5 a:nth-of-type(1) {
    left: 0;
}
.content_tab.tab_col_5 a:nth-of-type(2) {
    left: 20%;
}
.content_tab.tab_col_5 a:nth-of-type(3) {
    left: 40%;
}
.content_tab.tab_col_5 a:nth-of-type(4) {
    left: 60%;
}
.content_tab.tab_col_5 a:nth-of-type(5) {
    left: 80%;
}
.content_tab.tab_col_3 a {
    width: 33.333%;
}
.content_tab.tab_col_4 a {
    width: 25%;
}
.content_tab.tab_col_5 a {
    width: 20%;
}
.content_tab .tab_txt {
    display: none;
}
.content_tab .tab_txt:first-of-type {
    display: block;
}
.content_tab.sub0306 .photo_gallery > .list img {
    width: 100%;
    max-width: 100%;
}

.detail-content.bottom_gall {
    margin-bottom: 2rem;
}

@media (max-width: 600px) {
    .content_tab.sub0306 .check_list span {
        width: auto;
    }
}
@media (max-width: 500px) {
    .content_tab.tab_col_5.sub0306 a {
        width: 33.333%;
        border-radius: 0 !important;
    }
    .content_tab.tab_col_5.sub0306 a:nth-of-type(2) {
        left: 33.333%;
    }
    .content_tab.tab_col_5.sub0306 a:nth-of-type(3) {
        left: 66.666%;
    }
    .content_tab.tab_col_5.sub0306 a:nth-of-type(4) {
        top: 6.75rem;
        left: 0;
        border-left: 1px solid #d2d2d2;
    }
    .content_tab.tab_col_5.sub0306 a:nth-of-type(5) {
        top: 6.75rem;
        left: 33.333%;
    }
    .content_tab.sub0306 {
        padding-top: 15rem;
    }
    .content_tab.sub0306 .photo_gallery > .list {
        margin-bottom: 1.5rem;
    }
    .content_tab.sub0306 .photo_gallery > .list > div {
        width: 50%;
        margin-bottom: 1rem;
    }
    .board_gall > a {
        width: 50%;
    }
    .content_tab.sub0306 .photo_gallery {
        margin-top: 2.5rem;
    }
    .content_tab.sub0306 .check_list {
        margin-top: 1rem;
    }
    .content_tab.sub0306 .tab_txt ul.txt_list li strong {
        font-size: 1.3rem;
    }
    .content_tab.sub0306 .tab_txt ul.txt_list li p{
        font-size: 1rem;
    }
}
/* //210616 사회공헌 */

/* 220126 수처리사업 콘텐츠 추가 */
.tab li i[class*="icon_water"]::before { width: 100%; height: 100%; content: ''; }
.tab li i.icon_water_1::before { background: url("/images/korean/contents/icon_water_1.png") no-repeat center center; }
.tab li.active i.icon_water_1::before { background: url("/images/korean/contents/icon_water_1_on.png") no-repeat center center; }
.tab li i.icon_water_2::before { background: url("/images/korean/contents/icon_water_2.png") no-repeat center center; }
.tab li.active i.icon_water_2::before { background: url("/images/korean/contents/icon_water_2_on.png") no-repeat center center; }
.tab li i.icon_water_3::before { background: url("/images/korean/contents/icon_water_3.png") no-repeat center center; }
.tab li.active i.icon_water_3::before { background: url("/images/korean/contents/icon_water_3_on.png") no-repeat center center; }

.environment-info.water_system {
  min-height: 385px;
}
.environment-info.water_system.bg1 {
  background-image: url("/images/korean/contents/water_system_bg1.png");
}
.environment-info.water_system.bg2 {
  background-image: url("/images/korean/contents/water_system_bg2.png");
}
.environment-info.water_system.bg3 {
  background-image: url("/images/korean/contents/water_system_bg3.png");
}
.environment-info.water_system > div:after {
  top: -120px;
}
.environment-info.water_system > div.info1:after {
  background-image: url("/images/korean/contents/water_system_info1.png");
}
.environment-info.water_system > div.info2:after {
  background-image: url("/images/korean/contents/water_system_info2.png");
}
.environment-info.water_system > div.info3:after {
  background-image: url("/images/korean/contents/water_system_info3.png");
}
.environment-info.water_system div .icon {
  position: absolute;
  left: 0;
  top: -100px;
  display: inline-block;
  width: 72px;
  height: 76px;
  background: url("/images/korean/contents/water_system_icon.png") center no-repeat;
}
.environment-info.water_system .icon {
  top: -100px;
}
.environment-info.water_system div .icon:after {
  position: absolute;
  width: 47px;
  height: 47px;
  top: 12px;
  left: 12px;
  transform: none;
  content: "";
}
.environment-info.water_system div.info1 .icon:after {
  background: url("/images/korean/contents/water_system_icon_img1.png") center no-repeat;
}
.environment-info.water_system div.info2 .icon:after {
  background: url("/images/korean/contents/water_system_icon_img2.png") center no-repeat;
}
.environment-info.water_system div.info3 .icon:after {
  background: url("/images/korean/contents/water_system_icon_img3.png") center no-repeat;
}
.environment-info.water_system p .point {
  font-size: 20px;
  font-weight: 700;
}

.water_system_list .txt h3 {
  color: #26315c;
  margin-bottom: 16px;
}
.water_system_list .txt h3 span {
    display: inline-block;
    width: 35px;
    font-family: "Squada One", cursive;
    font-size: 2em;
    opacity: 0.5;
    font-weight: 400;
    vertical-align: middle;
    margin-right: 4px;
}
.water_system_list .txt strong {
  font-size: 1.375em;
  vertical-align: middle;
}
.water_system_list .txt > p {
  position: relative;
  padding-left: 14px;
  margin-bottom: 4px;
}
.water_system_list .txt > p::before {
  position: absolute;
  width: 4px;
  height: 4px;
  top: 11px;
  left: 0;
  background: #474C5A;
  content: "";
}
.water_system_list .img {
  border: 1px solid #DFDFDF;
  text-align: center;
  padding: 50px 20px;
  margin: 24px 0 60px;
}
.water_system_list .img img {
  max-width: 100%;
}
.water_system_list .img:last-of-type {
  margin-bottom: 0;
}
/* 반응형 */
@media (max-width: 768px) {
  .environment-info.water_system p br {
    display: none;
  }
  .water_system_list .img {
    padding: 16px;
  }
}
@media (max-width: 425px) {
  .environment-info.water_system p br {
    display: none;
  }
  .tab li i[class*="icon_water"]::before {
    background-size: 30px !important;
  }
}
/* //220126 수처리사업 콘텐츠 추가 */

.table { overflow: hidden; margin: 15px 0; border-top: 2px solid #555; border-bottom: 1px solid #aaa; }

.table table { margin-bottom: -1px; table-layout: fixed; }

.table th { padding: 20px; border-bottom: 1px solid #ddd; font-weight: 600; color: #333; white-space: nowrap; }

.table td { padding: 10px; border-bottom: 1px solid #ddd; }

.agree { text-align: center; }

.agree .item { overflow: hidden; overflow-y: auto; height: 400px; margin-bottom: 25px; padding: 20px 20px 0; border: 1px solid #d9dadb; background-color: #f3f3f3; text-align: left; }

.agree .item::after { display: block; height: 20px; content: ''; }

.agree .form-check { font-weight: 500; color: #333; }

.form1 { width: 1280px; max-width: 100%; margin: 0 auto; }

.form1 .agree { margin-bottom: 75px; }

.form1 .table { margin-bottom: 50px; }

.form2 { overflow: hidden; position: relative; padding-right: 100px; }

.form2 input { float: left; width: calc(50% - 10px); margin-right: 10px; border-radius: 5px; }

.form2 button { position: absolute; right: 0; top: 0; width: 100px; height: 40px; padding: 0; text-align: center; line-height: 37px; }

.box1 { display: table; width: calc(100% + 0px); table-layout: fixed; overflow: hidden; border-radius: 45px 0 45px 0; background-color: #f3f3f3; font-size: 22px; line-height: 1.818; }

.box1 > * { display: table-cell; padding-right: 0px; vertical-align: middle; }

.box1 .img { width: 512px; }

.box1 .img img { max-width: 100%; }

.box1 .desc { padding: 0 70px; word-break: keep-all; }

.box1 + .summary-info .current li { width: 176px; margin: 0; max-width: 16%; height: auto; }

.box1 + .summary-info .current .img { padding-top: 25px; }

.box2 { position: relative; z-index: 0; overflow: hidden; padding: 75px 400px 75px 130px; border-radius: 45px 0 45px 0; font-size: 18px; color: #fff; }

.box2 .img { position: absolute; left: 0; top: 0; z-index: -1; width: 100%; height: 100%; content: ''; }

.box2 .img img { position: absolute; right: 0; top: 0; min-width: 100%; min-height: 100%; }

.box2 li { position: relative; padding-left: 30px; word-break: keep-all; }

.box2 li + li { margin-top: 1rem; }

.box2 li span { position: absolute; left: 0; top: 0; font-weight: 600; color: #c8deff; }

.box3 { width: 1100px; max-width: 100%; margin: 0 auto; padding: 45px; border-radius: 100px 100px 100px 0; border: 1px solid #e4e4e4; text-align: center; }

.box3 .img { display: inline-block; width: 126px; vertical-align: middle; }

.box3 .desc { display: inline-block; margin: 20px 0; padding-left: 40px; font-size: 17px; color: #797979; text-align: left; vertical-align: middle; white-space: nowrap; }

.box3 .desc strong { display: block; font-size: 24px; color: #aa085c; }

.box3 .desc span { display: block; margin-top: 15px; }

.list1 { display: table; width: calc(100% + 50px); table-layout: fixed; width: 100%; margin-bottom: 100px; padding-right: 50px; }

.list1 > * { display: table-cell; padding-right: 50px; vertical-align: top; }

.list1 li { position: relative; height: 205px; padding: 20px 50px 20px 70px; font-size: 18px; color: #fff; word-break: keep-all; }

.list1 li::before { position: absolute; left: 0; top: 0; z-index: -1; width: 100%; height: 100%; content: ''; width: calc(100% - 50px); height: 205px; border-radius: 45px 0 0 45px; opacity: 0.9; }

.list1 li::after { position: absolute; right: -35px; top: 17px; width: 171px; height: 171px; content: ''; border-radius: 45px; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0.9; }

.list1 li:nth-child(1)::before { background-color: #26315c; }

.list1 li:nth-child(1)::after { background: linear-gradient(45deg, rgba(255, 255, 255, 0) 50%, #26315c 50.1%); }

.list1 li:nth-child(2)::before {background-color: #1E74DC;}
.list1 li:nth-child(2)::after {background: linear-gradient(45deg, rgba(255, 255, 255, 0) 50%, #1E74DC 50.1%);}
.list1 li:nth-child(3)::before {background-color: #0095DA;}
.list1 li:nth-child(3)::after {background: linear-gradient(45deg, rgba(255, 255, 255, 0) 50%, #0095DA 50.1%);}

.btn01 em::before { font-family: 'xeicon'; }

.btn01 em.type1::before { content: ''; }

.tab li i[class*="icon4-"]::before { width: 100%; height: 100%; content: ''; }

.tab li i.icon4-1::before { background: url("/images/korean/contents/icon4_1.png") no-repeat center center; }

.tab li.active i.icon4-1::before { background: url("/images/korean/contents/icon4_1_on.png") no-repeat center center; }

.tab li i.icon4-2::before { background: url("/images/korean/contents/icon4_2.png") no-repeat center center; }

.tab li.active i.icon4-2::before { background: url("/images/korean/contents/icon4_2_on.png") no-repeat center center; }

.tab li i.icon4-3::before { background: url("/images/korean/contents/icon4_3.png") no-repeat center center; }

.tab li.active i.icon4-3::before { background: url("/images/korean/contents/icon4_3_on.png") no-repeat center center; }

.tab li i.icon4-4::before { background: url("/images/korean/contents/icon4_4.png") no-repeat center center; }

.tab li.active i.icon4-4::before { background: url("/images/korean/contents/icon4_4_on.png") no-repeat center center; }

.tab li i.new-icon1::before { font-family: 'xeicon'; content: "\ea10"; font-size: 28px; }

.tab li.active i.new-icon1::before { color: #fff; }

.ecoprohn_logo { width: 100%; max-width: 151px; }

.txt-center { text-align: center !important; }

.btn02.icon-no {padding: 14px 27px;}
.btn02.icon-no:before {
  content: none;
}

.form-textbox { max-width: 100%; height: 40px; padding: 0 15px; border: 1px solid #ddd; font-family: "Noto"; font-size: 15px; }
textarea.form-textbox { width: 100% !important; }
.form-select { display: inline-block; max-width: 100%; position: relative; border: 1px solid #ddd; vertical-align: middle; }

.form-select::after { position: absolute; top: 0; right: 0; width: 30px; height: 100%; background-color: #fff; font-family: "xeicon"; color: #999; content: ''; line-height: 40px; }

.form-select select { height: 40px; padding: 0 30px 0 15px; border: 0 none; font-family: "Noto"; font-size: 15px; }

.form-file { display: inline-block; position: relative; max-width: 100%; height: 36px; font-size: 15px; color: #777; vertical-align: middle; line-height: 36px; }

.form-file input { position: absolute; left: 0; top: 0; z-index: 1; width: 80px; height: 100%; opacity: 0; cursor: pointer; }

.form-file input:hover + .txt::before { background-color: #999; color: #fff; }

.form-file .txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; padding-left: 90px; }

.form-file .txt::before { position: absolute; left: 0; top: 0; z-index: 0; width: 80px; height: 100%; border: 1px solid #999; color: #333; content: '첨부파일'; text-align: center; -webkit-transition: all 0.2s; transition: all 0.2s; cursor: pointer; }

.form-check { display: inline-block; position: relative; vertical-align: top; word-break: keep-all; }

.form-check input { position: absolute; opacity: 0; }

.form-check input:focus + label::before { outline: 1px dotted #000; }

.form-check input:checked + label::before { color: #000; }

.form-check label { display: block; padding-left: 28px; }

.form-check label::before { position: absolute; left: 0; top: auto; width: 18px; height: 18px; border: 1px solid #ddd; font-family: "xeicon"; color: transparent; content: ''; text-align: center; -webkit-transition: all 0.2s; transition: all 0.2s; }

.btn.btn02.type1 { border-color: #26315c; background-color: #26315c; color: #fff; }

.btn.btn02.type1:hover, .btn.btn02.type1:focus { background-color: #fff; color: #26315c; }

.btn.icon-no { width: 160px; max-width: 45%; padding-left: 0; padding-right: 0; font-size: 16px; height: 54px; vertical-align: top; text-align: center }

.table_tab_menu ul li,
.org_chart .depth .item strong,
.org_chart .depth .org_col.depth .item strong {
  line-height: 30px;
  padding: 10px 0;
}

.style_210722 .half .item img {
  height: 360px;
}


.sub_top_common.float_clear.group + h4,
.content_tab.tab_col_5.sub0306 + .grey_bg > h4 {
  position: relative;
  padding-top: 20px;
  margin: 60px 0 34px;
  font-size: 1.875em;
  color: #222;
  text-align: center;
  font-weight: 600;
}

.sub_top_common.float_clear.group + h4::before,
.content_tab.tab_col_5.sub0306 + .grey_bg > h4::before {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  width: 22px;
  height: 4px;
  background: #2277f2;
  content: '';
}

/* 220228 사회공헌 게시판 지주사 게시판으로 공통 적용 작업 */
.sub_top_common,
.content_tab,
.grey_bg {
  position: relative;
  max-width: 1440px;
  margin: 0 auto;
}
.right_txt {
  padding-bottom: 34px;
  margin-bottom: 50px;
  border-bottom: 1px solid #e2e2e2;
  text-align: center;
  color: #333;
  font-size: 1.250em;
  font-weight: 600;
}
.right_txt .title {
  display: block;
  color: #222;
  font-size: 1.5em;
  font-weight: 600;
}
.right_txt .title > * {
  display: inline-block;
  vertical-align: middle;
}
.right_txt .title p span {
  color: #2277f2;
}
.right_txt .desc p {
  width: 64%;
  margin: 20px auto 0;
  text-align: center;
  font-size: 0.8em;
  font-weight: 400;
  word-break: keep-all;
}
.right_txt .desc p br {
  display: none;
}

@media (max-width: 1640px) {
  .right_txt,
  .content_tab {
    padding-left: 40px;
    padding-right: 40px;
  }
  .right_txt .desc p {
    width: 100%;
  }
}

@media (max-width: 1280px) {
  .right_txt,
  .content_tab {
    padding-left: 20px;
    padding-right: 20px;
  }
  .depth3-title {
    margin-bottom: 20px;
  }
  .content_tab.sub0306 .tab_txt ul.txt_list li strong {
    font-size: 1.4em;
  }
  .content_tab.sub0306 .tab_txt ul.txt_list li p {
    font-size: 1.2em;
  }
  .content_tab.sub0306 .tab_txt ul.txt_list li strong::before {
    top: 0.65rem;
  }
  .board_gall > a .desc {
    padding: 0.5rem;
  }
  .board_gall > a .desc strong,
  .board_gall > a .desc p{
    font-size: 1em;
    margin-bottom: 0;
  }
  .board {
    word-break: break-all;
  }
  .board .view-list th,
  .board .view-list td {
    padding: 5px;
  }
  .board-article.bottom-content-line {
    padding: 20px 10px;
  }
  .right_txt .desc p {
    font-size: 1em;
  }
}

@media (max-width: 768px) {
  .right_txt,
  .content_tab {
    padding-left: 10px;
    padding-right: 10px;
  }
}
/* //220228 사회공헌 게시판 지주사 게시판으로 공통 적용 작업 */

.sub-visual.sub0106 {
  background-image: url(/images/korean/sub/sub-visual14.jpg);
}

.publication .img a {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 46px;
  height: 46px;
  background: #e2e2e2;
  transition: background .2s;
}

.publication .img a.viewer {
  position: absolute;
  right: 0;
  bottom: 0;
  text-align: center;
  line-height: 46px;
}

.publication .img a.viewer::after {
  font-family: "xeicon";
  font-size: 1.6rem;
  left: 50%;
  content: "\ea34";
  color: #333;
}

.publication .img a.pdf_down {
  position: absolute;
  right: 46px;
  bottom: 0;
  text-align: center;
  line-height: 46px;
  border-right: 1px solid #fafafa;
}

.publication .img a.pdf_down::after {
  font-family: "xeicon";
  font-size: 1.6rem;
  left: 50%;
  content: "\eb7c";
  color: #333;
}


/* 230314_클린룸 캐미컬 필터 신규내용 */
.environment-info.efu .icon:after{content:"";width:1em;aspect-ratio:42 / 40;background:url(/images/korean/contents/businessefu.svg) no-repeat 50% 50%/cover;}
.environment-info.efu > div:after{background-image:url(/images/korean/contents/businessefu.jpg)}
.efu-diagram{}
.efu-diagram-core{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;padding:30px 0;}
.efu-diagram-core>li{display:flex;justify-content:center;align-items:center;margin:-30px -20px;text-align:center;}
.efu-diagram-core>li>span{display:flex;justify-content:center;align-items:center;width:255px;aspect-ratio:1 / 1;border-radius:50%;color:#fff;font-size:30px;font-weight:500;}
.efu-diagram-core>li:nth-child(1)>span{background-color: rgba(3, 46, 124, .9);}
.efu-diagram-core>li:nth-child(2)>span{background-color: rgba(3, 46, 124, .6);}
.efu-diagram-core>li:nth-child(3)>span{background-color: rgba(3, 46, 124, .3);}
.efu-diagram-arrow{margin:10px 0;text-align:center;}
.efu-diagram-arrow>img{width:100%;max-width:283px;}
.efu-diagram-boxs{display:flex;justify-content:center;gap:10px;}
.efu-diagram-box{display:flex;justify-content:center;align-items:center;padding:15px;width:100%;max-width:475px;min-height:82px;border:1px solid #f6b7d8;border-radius:10px;color:#000;font-size:18px;line-hieght:1.3;text-align:center;word-break:keep-all;}
.efu-list{display:flex;flex-wrap:wrap;gap:20px}
.efu-list>li{flex:1 1 calc(100% / 2 - 10px);border:1px solid #dfdfdf;}
.efu-list>li>img{max-width:100%;}

@media(max-width:1023px) {
    .efu-diagram-core{padding:20px 0}
    .efu-diagram-core>li{margin:-20px -15px;}
    .efu-diagram-core>li>span{width:240px;font-size:27px;}
    .efu-diagram-arrow>img{max-width:240px;}
    .efu-diagram-box{font-size:16px;}
}    

@media(max-width:639px) {
    .efu-diagram-core>li>span{width:180px;font-size:24px}
    .efu-list>li{flex-basis:100%;}
    .efu-diagram-arrow>img{max-width:200px}
    .efu-diagram-boxs{flex-direction:column;}
}


/* 협력사 행동강령 */
.ethics.ethics_contuct{}
.ethics.ethics_contuct .intro span {display: inline-block;margin-bottom: 18px;font-weight: 600}
.ethics.ethics_contuct>div:nth-of-type(2) {margin: 42px 0 45px;padding: 70px 66px;background: url(/web/images/contents/ethics_contuct_bg.jpg) center/cover no-repeat}
.ethics.ethics_contuct>div:nth-of-type(2)>ul,
.ethics.ethics_contuct>div:nth-of-type(2)>p{position: relative;padding-left: 0;}
.ethics.ethics_contuct>div:nth-of-type(2)>ul:before,
.ethics.ethics_contuct>div:nth-of-type(2)>p:before{position: absolute;left: 0;top: 10px;width: 82px;height: 1px;background: rgba(255, 255, 255, .4);}
.ethics.ethics_contuct>div:nth-of-type(2)>ul li {color: #fff;line-height: 1.3;margin: 10px 0}
.ethics.ethics_contuct>div:nth-of-type(2)>p{color:#fff;line-hieght:1.3;text-align: center;}
.ethics.ethics_contuct .btnWrap{text-align:center;}
.ethics.ethics_contuct .btnWrap .btn01 b{width:200px}
.ethics.ethics_contuct .btnWrap div {margin-left: 40px;}
.ethics.ethics_contuct .btnWrap div:nth-of-type(1) {margin-left: 0}
.ethics.ethics_contuct .btnWrap .btn em:before {transform: rotate(180deg)}

@media(max-width:1025px) {
    .ethics.ethics_contuct{}
}
@media(max-width:425px) {
    .ethics.ethics_contuct .btnWrap .btn01{width:100%}
    .ethics.ethics_contuct .btnWrap .btn01 span{width:100%}
    .ethics.ethics_contuct .btnWrap .btn01 b{width:100%}
    .ethics.ethics_contuct>div:nth-of-type(2)>ul,
    .ethics.ethics_contuct>div:nth-of-type(2)>p{padding-left: 0}
    .ethics.ethics_contuct>div:nth-of-type(2)>ul,
    .ethics.ethics_contuct>div:nth-of-type(2)>p:before{display: none}
}

/* 240605 연구분야 */
.research-column-group{display:flex;flex-wrap:wrap;}
.research-column-group[data-column="2"]{margin:0 calc(-3.2rem / 1.6);row-gap:calc(3.2rem / 1.6)}
.research-column-group[data-column="2"] .research-column{display:flex;flex-direction:column;padding:0 calc(3.2rem / 1.6);width:calc(100% / 2)}
.research-column-img{margin-top:auto;}
.research-column-img img{max-width:100%}

@media(max-width:1280px) {
    .research-column-group[data-column="2"]{margin:0 calc(-1.6rem / 1.6);row-gap:calc(1.6rem / 1.6)}
    .research-column-group[data-column="2"] .research-column{padding:0 calc(1.6rem / 1.6)}
}

@media(max-width:767px) {
    .research-column-group[data-column="2"]{margin:0 calc(-1rem / 1.4);row-gap:calc(1rem / 1.6)}
    .research-column-group[data-column="2"] .research-column{padding:0 calc(1rem / 1.6)}
}
@media(max-width:479px) {
    .research-column-group[data-column="2"]{margin:0;}
    .research-column-group[data-column="2"] .research-column{padding:0;width:100%;}
}


.direction > div.research_safe{display:flex;flex-direction:column;row-gap:calc(2rem / 1.6);margin:30px 0 0;width:100%;}
.research_safe_item{display:flex;gap:calc(2rem / 1.6) calc(2.8rem / 1.6);align-items:center;}
.research_safe_img{display:flex;flex-shrink:0;gap:calc(1rem / 1.6);align-items:flex-start;}
.research_safe_img img{max-width:100%;}
.research_safe_txt{flex:1;}
.research_safe_txt .title03{margin-top:0;}

@media(max-width:1023px) {
    .research_safe_img{flex:unset;width:45%;}
    .research_safe_txt{flex:unset;width:55%;}
}

@media(max-width:479px) {
    .research_safe_item{flex-direction:column;align-items:stretch;}   
    .research_safe_img{width:100%;}
}


/* 240605 사회공헌 모든 계열사 공통 */
#sub .sociaty+.grey_bg:before{height:1000vh}
.sociaty{margin:0 auto;max-width:1440px;padding-bottom:calc(10rem / 1.6);}
.sociaty h5{color:#2277f2;font-size:calc(2.8rem / 1.6);font-weight:700;}
.sociaty h5+p{margin-top:calc(.5rem / 1.6);color:#333;font-size:calc(2rem / 1.6);}
.sociaty h5+p+.txt_list{margin-top:calc(3rem / 1.6);}
.sociaty-download{margin-top:calc(5rem / 1.6);text-align:center;}
.sociaty a.down_btn{max-width:calc(32rem / 1.6)}

.content_tab.flex_tab{display:flex;flex-wrap:wrap;overflow:visible;margin:1px 0 0 1px;padding-top:0 !important;}
.content_tab.flex_tab .tab_tit:nth-of-type(1n){position:relative;left:auto;margin:-1px 0 0 -1px;border:1px solid #d2d2d2}
.content_tab.flex_tab .tab_tit.on:nth-of-type(1n){border-color:#2277f2}
.content_tab.flex_tab .tab_txt{margin-top:calc(6rem / 1.6);order:999;margin:calc(6rem - 1px) 0 0 -1px;width:calc(100% + 1px);overflow:hidden;}
.content_tab .tab_tit strong{display:block;font-size:calc(1.8rem / 1.6);}
.content_tab .tab_tit strong+p{margin-top:calc(1rem / 1.6);font-size:calc(1.5rem / 1.6);}

@media(max-width:767px) {
    .content_tab .tab_tit strong{display:block;font-size:calc(1.6rem / 1.4);}
    .content_tab .tab_tit strong+p{margin-top:calc(.8rem / 1.4);font-size:calc(1.3rem / 1.4);}
    .sociaty h5{color:#2277f2;font-size:calc(2.2rem / 1.4);font-weight:700;}
    .sociaty h5+p{margin-top:calc(.5rem / 1.4);color:#333;font-size:calc(1.8rem / 1.4);}
    .sociaty h5+p+.txt_list{margin-top:calc(2.5rem / 1.4);}
    .content_tab.flex_tab.tab_col_4 .tab_tit{width:calc(100% / 2)}
    .content_tab.flex_tab.tab_col_4 .tab_tit:nth-of-type(1){border-radius:calc(1rem / 1.4) 0 0 0;}
    .content_tab.flex_tab.tab_col_4 .tab_tit:nth-of-type(2){border-radius:0 calc(1rem / 1.4) 0 0;}
    .content_tab.flex_tab.tab_col_4 .tab_tit:nth-of-type(3){border-radius:0 0 0 calc(1rem / 1.4);}
    .content_tab.flex_tab.tab_col_4 .tab_tit:nth-of-type(4){border-radius:0 0 calc(1rem / 1.4) 0;}
}

.mobile-img-zoom{position:relative;text-align:center;}
.mobile-img-zoom img{max-width:100%;}
.mobile-img-zoom>a{display:none;}

@media(max-width:640px) {
    .mobile-img-zoom>a{display:flex;justify-content:center;align-items:center;position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0, 0, 0, .5);text-align:center;}
    .mobile-img-zoom>a:before{content:"zoom image";color:#fff;font-size:calc(2rem / 1.4);font-weight:700;}
}

.environment-list.column02{display:flex;flex-wrap:wrap;margin:0 -1rem;}
.environment-list.column02>li{padding:0 1rem;width:calc(100% / 2);}

@media(max-width:639px) {
    .environment-list.column02>li{width:100%;}
}



/* 240709_contact Us */

.contact-form{font-size:calc(1.8rem / 1.6);line-height:1.4;font-family:"Noto Sans KR", "Noto";}
.contact-form label{cursor:pointer}
.contact-form-top{display:flex;align-items:flex-start;gap:calc(2.4rem / 1.6);padding:calc(3.2rem / 1.6);border:1px solid #d4d4d4;}
.contact-form-top-icon{flex-shrink:0;width:calc(6rem / 1.6);aspect-ratio:1 / 1;background:url(/images/common/contact-form-top-icon.svg) no-repeat 50% 50%/contain}
.contact-form-top-desc{}
.contact-form-top-desc>strong{color:#222;font-size:calc(2.4rem / 1.6);font-weight:700;}
.contact-form-top-desc>p{margin-top:calc(1.6rem / 1.6);}
.contact-form-field{margin-top:calc(9rem / 1.6);}
.contact-form-field-terms{padding:calc(3.2rem / 1.6);background-color:#f5f5f5;color:#444;}
.contact-form-field-terms>dl{}
.contact-form-field-terms>dl>dt{font-weight:bold;}
.contact-form-field-terms>dl>dd{position:relative;padding-left:calc((.6rem / 1.6) + 4px);font-size:calc(1.6rem / 1.6);}
.contact-form-field-terms>dl>dd:before{content:"";position:absolute;top:calc(1rem / 1.6);left:0;width:4px;aspect-ratio:1 / 1;background-color:#26315c;border-radius:50%;}
.contact-form-field-terms>dl>dt+dd{margin-top:calc(1rem / 1.6);}
.contact-form-field-terms>dl>dd+dt{margin-top:calc(3rem / 1.6);}
.contact-form-field-terms>dl>dd+dd{margin-top:calc(.5rem / 1.6);}
.contact-form-field-terms-agree{display:flex;justify-content:flex-end;align-items:center;gap:calc(2rem / 1.6) calc(3.2rem / 1.6);margin-top:calc(2rem / 1.6)}
.contact-form-field-terms-agree-box{position:relative;overflow:hidden;}
.contact-form-field-terms-agree-box>input[type="radio"]{position:absolute;top:-1px;left:-1px;width:0;height:0;opacity:0;}
.contact-form-field-terms-agree-box>label{position:relative;padding-left:calc(2.4rem / 1.6);color:#616161;}
.contact-form-field-terms-agree-box>label:before{content:"";position:absolute;top:calc(.5rem / 1.6);left:0;width:calc(1.8rem / 1.6);aspect-ratio:1 / 1;border:1px solid #bdbdbd;border-radius:50%;}
.contact-form-field-terms-agree-box>input[type="radio"]:checked+label:before{border-width:calc(.7rem / 1.6);border-color:#2277f2;}

.contact-form-field-table{border-top:2px solid #222;}
.contact-form-field-table tbody th,
.contact-form-field-table tbody td{padding:calc(1.2rem / 1.6) calc(2.4rem / 1.6);border-bottom:1px solid #e0e0e0;text-align:left;}
.contact-form-field-table tbody th{width:calc(22rem / 1.6);background-color:#f5f5f5;color:#222;font-weight:bold;}
.contact-form-field-table tbody td input[type="text"],
.contact-form-field-table tbody td input[type="password"],
.contact-form-field-table tbody td input[type="email"],
.contact-form-field-table tbody td input[type="date"],
.contact-form-field-table tbody td textarea,
.contact-form-field-table tbody td select{padding:0 calc(1.6rem / 1.6);width:100%;height:calc(4.8rem / 1.6);background-color:#fff;border:1px solid #e0e0e0;font-size:calc(1.6rem / 1.6)}
.contact-form-field-table tbody td textarea{padding:calc(1.1rem / 1.6) calc(1.6rem / 1.6);height:calc(28rem / 1.6)}

.contact-form-field-table tbody td input[type="text"]::placeholder{font-family:"Noto Sans KR", "Noto";color:#9e9e9e;font-style:normal}
.contact-form-field-table tbody td input[type="password"]::placeholder{font-family:"Noto Sans KR", "Noto";color:#9e9e9e;font-style:normal}
.contact-form-field-table tbody td input[type="email"]::placeholder{font-family:"Noto Sans KR", "Noto";color:#9e9e9e;font-style:normal}
.contact-form-field-table tbody td input[type="date"]::placeholder{font-family:"Noto Sans KR", "Noto";color:#9e9e9e;font-style:normal}
.contact-form-field-table tbody td textarea::placeholder{font-family:"Noto Sans KR", "Noto";color:#9e9e9e;font-style:normal}

.contact-form-field-button-container{display:flex;justify-content:center;gap:calc(1rem / 1.6);margin-top:calc(5rem / 1.6);}
.contact-form-field-button{display:inline-flex;align-items:center;gap:calc(.75rem / 1.6);padding:0 calc(2rem / 1.6);height:calc(4.4rem / 1.6);font-size:calc(1.6rem / 1.6);line-height:1;}
.contact-form-field-button>i{font-size:calc(1.8rem / 1.6)}
.contact-form-field-button-submit{border:1px solid #26315c;color:#26315c;}

@media(max-width:1279px) {
    .contact-form-field-table tbody th{width:calc(18rem / 1.6)}
}

@media(max-width:767px) {
    .contact-form-field-table tbody tr{display:flex;flex-direction:column;}
    .contact-form-field-table tbody th{width:100%;border-bottom:0;}
}

/* 동영상 modal */
.environment-info{padding:90px 0;min-height:400px;}
.environment-info > div{padding-right:500px;}
.environment-info > div:has(.environment-info-video):after{display:none;}
.enviroment-modal{display:flex;justify-content:center;align-items:center;position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:rgba(0, 0, 0, .6);z-index:999;}
.enviroment-modal-container{padding:calc(2.4rem / 1.6) calc(2.4rem / 1.6);width:calc(100% - 4rem / 1.6);max-width:900px;background-color:#fff;}
.enviroment-modal-title{display:flex;justify-content:space-between;align-items:flex-start;color:#222;}
.enviroment-modal-title>strong{font-size:calc(1.8rem / 1.6);line-height:calc(2.4rem / 1.6)}
.enviroment-modal-close{padding:0;flex-shrink:0;font-size:calc(2.4rem / 1.6);line-height:1;}
.enviroment-modal-video{margin-top:calc(2rem / 1.6);}
.enviroment-modal-video iframe{width:100%;aspect-ratio:852 / 476;}
.environment-info .environment-info-video{z-index:2;}
.environment-info .environment-info-video:after{content:"";position:absolute;top:50%;left:50%;width:82px;aspect-ratio:1 / 1;background:url(/images/common/environment-video-play.svg) no-repeat 50% 50%/contain;transform:translate(-50%, -50%);}

@media(max-width:1440px) {
    .environment-info{min-height:unset;}
    .environment-info > div{padding-right:400px;}
    .environment-info .environment-info-video,
    .environment-info > div:after{width:360px;}
    .environment-info .environment-info-video:after{width:72px;height:72px;}
}

@media(max-width:1200px){
  .environment-info > div{padding-right:360px;}
  .environment-info .environment-info-video,
  .environment-info > div:after {width:320px;}
  .environment-info .environment-info-video:after{width:64px;height:64px;}
}

@media(max-width:767px) {
    .environment-info{padding-bottom:0;}
    .environment-info > div{padding-right:0;}
    .environment-info .environment-info-video,
    .environment-info > div:after {display:block;position:relative;top:40px !important;right:auto !important;margin:0 auto;width:100%;max-width:320px;}
}



.summary-top .slogan{display:none;}
@media(max-width:1440px) {
    .summary-top > div{height:auto;}
    .summary-top .txt{position:relative;}
}




.summary-top[data-update="240910"] .txt{display:flex;flex-wrap:wrap;gap:calc(2.5rem / 1.6) calc(4rem / 1.6);width:100%;}
.summary-top[data-update="240910"]  h2{width:100%;line-height:0;}
.summary-top[data-update="240910"]  h2:after{display:block;right:0;width:calc(100% - 250px)}
.summary-top[data-update="240910"] .txt_desc{width:calc(52.5% - (2rem / 1.6))}
.summary-top[data-update="240910"] .txt_desc p:first-of-type{margin-top:0;}
.summary-top[data-update="240910"] .txt_video{width:calc(47.5% - (2rem / 1.6))}
.summary-top[data-update="240910"] .txt_video iframe{width:100%;height:100%;}

@media(max-width:1440px) {
    .summary-top[data-update="240910"] .txt{padding:60px 60px 40px;width:calc(100% - (4rem / 1.6))}
}

@media(max-width:1280px) {
    .summary-top[data-update="240910"] .txt_desc,
    .summary-top[data-update="240910"] .txt_video{width:calc(50% - (2rem / 1.6))}
}

@media(max-width:1023px) {
    .summary-top[data-update="240910"] .txt_desc,
    .summary-top[data-update="240910"] .txt_video{width:100%;}
    .summary-top[data-update="240910"] .txt_video{aspect-ratio:16 / 9;}
}





/* 공급망정책 */
.supply_bg {
    height: 402px;
    width: 100%;
    background: url(/ecoprobm/images/korean/contents/supply_bg01.png) no-repeat center center/cover;
}
.supply_bg.sustainability{
    background-image:url(/ecoprobm/images/korean/contents/supply_sutainability.jpg);
}

.sustainability_img{
    text-align:center;
}
.sustainability_img img{
    width:100%;max-width:742px;box-shadow:0 .5rem 1.5rem rgba(0, 0, 0, .15);
}

.supply_content {
    padding: 65px 210px;
    background: #f3f3f5;
    position: relative;
    margin-top: -250px;
    margin-bottom: 45px;
}

.supply_content .tit {
    text-align: center;
    display: block;
    margin-bottom: 30px;
}

.supply_content .mid_tit {
    font-size: 30px;
    color: #333;
    font-weight: 500;
    text-align: center;
    margin-bottom: 20px;
}

.supply_content .mid_tit i {
    vertical-align: middle;
    margin: 0 10px;
    line-height: 130%;
}

.supply_content .mid_tit img {
    vertical-align: middle;
}

.supply_content .bot_t {
    font-size: 20px;
    text-align: center;
    margin-bottom: 45px;
    word-break: keep-all;
}

.supply_content .supply_box {
    overflow: hidden;
}

.supply_content .supply_box .inner_box {
    position: relative;
    width: 48%;
    float: left;
    margin-left: 4%;
    padding: 30px 50px;
    background: #fff;
    min-height: 222px;
}

.supply_content .supply_box .inner_box.w100 {
    float: none;
    width: 100% !important;
    min-height: auto;
    padding: 1rem 3rem;
}

.supply_content .supply_box .inner_box.w100 .title {
    display: block;
    font-size: 18px;
    margin-bottom: 0.5rem;
}

.supply_content .supply_box .inner_box:before {
    width: 8px;
    height: 80px;
    position: absolute;
    content: "";
    display: block;
    top: 0;
    left: 0;
    background: #2277f2;
}

.supply_content .supply_box .inner_box p {
    line-height: 170%;
}

.supply_content .supply_box .inner_box:first-of-type {
    margin-left: 0;
}

.side_txt {
    text-align: center;
    line-height: 170%;
    color: #444;
    font-size: 16px;
}

@media (max-width: 1440px) {
    .supply_content {
        padding: 50px;
    }

}

@media (max-width: 1150px) {
    .supply_content .supply_box .inner_box {
        float: none;
        width: 100%;
        margin-left: 0;
        min-height: auto;
        margin-top: 20px;
    }

    .supply_content .supply_box .inner_box:first-of-type {
        margin-top: 0;
    }
}


@media (max-width: 1000px) {
    .supply_content br {
        display: none !important;
    }

    .side_txt br {
        display: none;
    }

    .supply_content .bot_t {
        font-size: 18px;
    }

    .supply_content .mid_tit {
        font-size: 24px;
    }

    .supply_content .mid_tit span img {
        display: none;
    }

    .supply_content {
        padding: 50px 20px;
    }

    .supply_content .supply_box .inner_box {
        padding: 20px 30px;
    }

    .side_txt {
        font-size: 14px;
    }

    .supply_bg {
        height: 300px;
    }
}



/* //220228 사회공헌 게시판 지주사 게시판으로 공통 적용 작업 */
.year_right{text-align:right;}
.hn_chart {
    position: relative;
    padding-left: 110px;
}

.hn_chart.factory {
    padding:0;max-width: 580px;
}

.hn_chart .title {
    position: absolute;
    top: -5px;
    left: 0;
    font-weight: 700;
    font-size: 18px;
}

.hn_chart.long .title {
    top: 0;
    left: -110px;
    font-weight: 500;
}

.hn_chart.factory .title {
    top: 14px;
}

.hn_chart .bar_item {
    position: relative;
}

.hn_chart.year .bar_item {
    margin-bottom: 8px;
}

.hn_chart.year .bar_item:last-child {
    margin-bottom: 0;
}

.hn_chart .bar_item .bar {
    display: inline-block;
    width: 100%;
    background: #f1f1f1;
    max-width: 418px;
    border-radius: 4px;
    height: 32px;
    vertical-align: middle;
    margin-bottom: 8px;
    text-align: left;
}

.hn_chart.year .bar_item .bar {
    margin-right: 14px;
    margin-bottom: 0;
    max-width: calc(100% - 80px);
}

.hn_chart.long .bar_item .bar {
    max-width: 100%;
}

.hn_chart .bar_item .bar span {
    display: inline-block;
    vertical-align: middle;
    font-size: 13px;
    height: 32px;
    line-height: 32px;
    padding: 0 10px;
    border-radius: 4px;
    transition: all 0.3s ease-in-out;
}

.hn_chart .bar_item .bar span.point {
    background: #26315c;
    color: white;
}

.hn_chart.long.green_color .bar_item .bar span.point {
    text-align: right;
    background: #2c7156;
}

.hn_chart.long.red .bar_item .bar span.point {
    text-align: right;
    background: #2277f2;
}

.hn_chart .bar_item .bar .point + span {
    font-size: 14px;
}

.hn_chart .bar_item .bar .point + span.blue {
    font-size: 14px;
}

.hn_chart .bar_item .year {
    display: inline-block;
    vertical-align: revert;
}

.hn_chart .factory_name {
    text-align: center;
    font-size: 0;
    margin-top: 10px;
    border: 1px solid #f2f2f2;
    padding: 10px;
}

.hn_chart .factory_name span {
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
    margin: 0 20px;
}

.hn_chart .factory_name span::before {
    display: inline-block;
    width: 24px;
    height: 24px;
    border-radius: 100%;
    border: 6px solid black;
    background: white;
    content: "";
    vertical-align: middle;
    margin-right: 4px;
}

.hn_chart .factory_name span.factory1::before {
    border-color: #2c7156;
}

.hn_chart .factory_name span.factory2::before {
    border-color: #2277f2;
}

.hn_chart+p{margin-top:20px;margin-left:13%;}
.hn_chart_energy+p{margin-left:14%;}

@media (max-width: 1350px) {
    .org_chart .depth .org_col > div > .item {
        max-width: 300px;
    }
    .org_chart .depth .org_col > div > .item > ul > li {
        max-height: none;
    }

    .hn_chart+p,
    .hn_chart_energy+p{margin:0;text-align:center;}
}

@media (max-width: 1280px) {
    .hn_chart {
        padding-left: 70px;
    }

    .hn_chart.year .bar_item .bar span.point {
        width: 100% !important;
    }

    .hn_chart.text-out .bar_item .bar span.point {
        display: none;
    }

    .hn_chart.long {
        padding-left: 0;
    }

    .hn_chart.long::after {
        display: block;
        clear: both;
        content: "";
    }

    .hn_chart.long .title {
        position: relative;
        top: inherit;
        left: inherit;
        margin-bottom: 4px;
    }

    .hn_chart.long .bar_item {
        float: left;
        width: 49%;
        margin-right: 2%;
    }

    .hn_chart.long .bar_item:nth-child(even) {
        margin-right: 0;
    }

    .hn_chart.long .bar_item .bar span {
        width: auto !important;
    }
}

@media (max-width: 1100px) {
    .org_chart .depth .org_col > div > .item {
        max-width: 260px;
    }
}

@media (max-width: 768px) {
    .style_210722 .half > div {
        width: 100%;
    }

    .hn_chart.factory {
        max-width: 100%;
    }
}

@media (max-width: 500px) {
    .hn_chart {
        padding-left: 0;
    }

    .hn_chart .title {
        position: relative;
        top: inherit;
        left: inherit;
        margin-bottom: 10px;
    }

    .hn_chart.long .bar_item {
        float: none;
        width: 100%;
        margin-right: 0;
    }
}


/* 이사회 */ /* 이사회 - 조직과 목표 */ 
.float-as { color: #777; text-align: right; } 
.float-section ~ .float-section { margin-top: 8.75rem; } 
.float-section h4 { display: block; position: relative; font-weight: 500; font-size: 2.5rem; letter-spacing: -0.125rem; color: #181818; text-align: center; margin-bottom: 3.75rem; } 
.float-section h4::after { display: block; width: 2.6875rem; height: 1.875px; background: #16336A; margin: 0.75rem auto 0; content: ""; } 
.float-section:last-child { margin-bottom: 18.75rem; } 
.float-parent { display:flex;flex-wrap:wrap;position: relative; } 
.float-parent::after { content: ""; display: block; clear: both; } 
.float-parent > .float-item { float: left; text-align: left; width: calc(33.3334% - 4.375rem); margin-top: 42px; margin-right: 4.375rem; letter-spacing: -0.9px; } 
.float-parent > .float-item:nth-of-type(3n) { margin-right: 0; } 
.float-item .item-hd { position: relative; padding: 0 7.5rem 1.25rem 0; border-bottom: 1px solid #dddddd; } 
.float-item .item-hd > strong { font-size: 1.875rem; color: #181818; letter-spacing: -1.5px; } 
.float-item .item-hd > strong > span { font-size: 1.125rem; color: #2277f2; letter-spacing: -0.9px; } 
.float-item .item-hd > .img { position: absolute; right: 0; top: 0.625rem; } 
.float-item .item-hd > .img > img { width: 7.5rem; opacity:0.2} 
.float-item .item-body { margin-top: 1.5rem; } 
.item-body .item-list { color: #444444; } 
.item-body .item-list ~ .item-list { margin-top: 0.625rem; } 
.item-body .item-list ~ .item-list.mt { margin-top: 1.875rem; } 
.item-body .item-list:fir-child { margin-bottom: 0; } 
.item-body .item-list > strong { display: block; font-size: 1.125rem; color: #16336A; margin-bottom: 0.3125rem; } 
.item-body .item-list > ul > li { position: relative; padding-left: 0.625rem; } 
.item-body .item-list > ul > li::before { content: ""; width: 5px; height: 1px; background: #444; position: absolute; left: 0; top: 0.8125rem; } 

@media (max-width: 1026px) { 
    .float-parent > .float-item { width: calc(50% - 2.1875rem); margin-bottom: 3.125rem; } 
    .float-parent > .float-item:nth-of-type(2n) { margin-right: 0; } 
    .float-parent > .float-item:nth-of-type(3n) { margin-right: 4.375rem; } 
} 

@media (max-width: 640px) { 
    .float-parent > .float-item { width: 100%; float: none; margin-right: 0 !important; } 
}


.director-as{color:#777;text-align:right;}
.director-org { position: relative; margin-top:3rem;padding-left: 14.375rem; } 
.director-as+.director-org{margin-top:3rem;}
.director-org *{word-break:keep-all;}
.director-org-box { display: flex; justify-content: center; align-items: center; position: relative; padding: 0 0.625rem 0.0625rem; min-height: 4.5rem; color: #fff; font-size: 1.125rem; font-weight: 700; text-align: center; } 
.director-org-lv01, .director-org-lv02 { display: flex; justify-content: center; position: relative; gap: 2.5rem; } 
.director-org-lv01 > .director-org-box { width: calc((100% / 3) - (2.5rem / 1.5)); background-color: #2277f2; } 
.director-org-lv02 { margin-top: 3.75rem; } 
.director-org-lv02-column { display: flex; flex-direction: column; position: relative; flex: 1; } 
.director-org-lv02-column > .director-org-box { background-color: #137ccf; } 
.director-org-lv03, .director-org-lv04 { position: relative; margin-top: 1.875rem; padding: 1.25rem; border: 1px solid #ddd; } 
.director-org-lv03 { background-color: #f3f3f5; } 
.director-org-lv04 { background-color: #fff; } 
.director-org-lv03 > strong, .director-org-lv04 > strong { display: flex; justify-content: center; align-items: center; position: absolute; top: 50%; right: calc(100% + 3.75rem); padding-bottom: 0.0625rem; width: 6.25rem; aspect-ratio: 1 / 1; color: #fff; border-radius: 50%; font-size: 1.125rem; font-weight: 700; line-height: 1; transform: translateY(-50%); } 
.director-org-lv03 > strong { background-color: #20a754; } 
.director-org-lv04 > strong { background-color: #20938d; } 
.director-org-lv03 > ul > li, .director-org-lv04 > ul > li { position: relative; padding-left: 1.125rem; color: #333; font-size: 1rem; line-height: 1.2;} 
.director-org-lv03 > ul > li:before, .director-org-lv04 > ul > li:before { content: ""; position: absolute; top: 0.71875rem; left: 0; width: 0.625rem; height: 1.25px; background-color: #032e7c; } 
.director-org-lv03 > ul > li + li, .director-org-lv04 > ul > li + li { margin-top: 0.5rem; } 
.director-org-lv01:before { content: ""; position: absolute; top: 100%; left: 50%; width: 1px; height: 1.875rem; background-color: #ddd; } 
.director-org-lv02-column:before { content: ""; position: absolute; top: -1.875rem; left: 50%; width: calc(100% + 2.5rem); height: 1.875rem; border-top: 1px solid #ddd; border-left: 1px solid #ddd; } 
.director-org-lv02-column:last-child:before { width: 0; } 

@media (max-width: 1280px) { 
    .director-org { padding-left: 8.75rem; } 
    .director-org-lv02 { gap: 1.875rem; } 
    .director-org-lv01 > .director-org-box { width: calc((100% / 3) - 1.875rem); } 
    .director-org-lv02-column:before:before{width:calc(100% + 1.875rem)}
    .director-org-lv03 > strong, .director-org-lv04 > strong { right: calc(100% + 2.5rem); } 
} 

@media (max-width: 1023px) { 
    .director-org { padding-left: 0; } 
    .director-org-lv03 > strong, .director-org-lv04 > strong { display: none; } 
    .director-org-lv02-column:before { width: 0; } 
    .director-org-lv01:before { top: 0; height: 100%; } 
    .director-org-lv01 > .director-org-box { width: 100%; } 
    .director-org-lv02 { flex-direction: column; margin-top: 1.875rem; } 
    .director-org-lv02-column { width: 100%; } 
    .director-org-lv03, .director-org-lv04 { margin-top: 0.625rem; height: auto !important; } 
} 



.tab li i.hrm::before{width:100%;height:100%;background:url(/ecoprobm/images/common/hrm-gray.png) no-repeat 50% 50%;}
.tab li.active i.hrm::before{width:100%;height:100%;background:url(/ecoprobm/images/common/hrm-white.png) no-repeat 50% 50%;}
.tab li i.cg::before{width:100%;height:100%;background:url(/ecoprobm/images/common/cg-gray.png) no-repeat 50% 50%;}
.tab li.active i.cg::before{width:100%;height:100%;background:url(/ecoprobm/images/common/cg-white.png) no-repeat 50% 50%;}

.supply_content .supply_content_list>li:has(>i.type02){padding-left:calc(9.2rem / 1.6);}
.supply_content .supply_content_list>li>i.type02{width:calc(8rem / 1.6);height:calc(3.6rem / 1.6);border-radius:calc(3.6rem / 1.6)}


/*테이블*/
.tbl {
    position: relative;
    border-collapse: collapse;
    width: 100%;
    border-top: 2px solid #26315C;
    letter-spacing: -0.8px;
    table-layout: fixed;
    margin-top: 12px;
}

.tbl::after {
    display: block;
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    background: #9e9e9e;
    bottom: 0;
    left: 0;
    z-index: 2;
}

.tbl thead th {
    background: #f5f6f9;
    color: #3e3e3e;
    padding: 0.35rem 1rem;
    border: 1px solid #c6c6c6;
    border-left: 0;
    border-right: 1px solid #d5d5d5;
    text-align: center;
    word-break: keep-all;
    word-wrap: break-word;
}

.tbl thead th p {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.7px;
}

.tbl tbody th {
    background: rgba(38, 49, 92, 0.1);
    padding: 1.2rem;
    border-bottom: 1px solid #c6c6c6;
    border-right: 1px solid #d5d5d5;
    font-weight: 400;
    color: #4f565b;
    text-align: center;
}

.tbl td {
    background: #fff;
    padding: 0.8rem 1.2rem;
    border: 1px solid #c6c6c6;
    border-right: 1px solid #d5d5d5;
    border-left: 0;
    border-top: 0;
    text-align: center;
    font-weight: 300;
    color: #4b4b4b;
    word-break: keep-all;
    word-wrap: break-word;
}

.tbl td:last-child {
    border-right: 0 !important;
}

.tbl tr th:last-child {
    border-right: 0 !important;
}

.tbl td[rowspan]:not(:first-child){border-left:1px solid #c6c6c6;}

.tbl_scroll {
    margin-bottom: 32px;
}

.tbl_scroll:before {
    display: none;
    content: "";
    width: 20px;
    height: 37px;
    position: absolute;
    top: 0;
    right: 23px;
    animation: side 0.7s linear 1s infinite alternate;
    background: url("/images/korean/common/mCont_scroll_ico.png") no-repeat center center;
    background-size: 20px;
}

@media all and (max-width: 767px) {
    .tbl_scroll.on {
        position: relative;
        overflow-x:auto;
        width:100%;
        padding-top: 0;
        /*background: url("/images/korean/common/mCont_scroll_ico_arr.png") no-repeat right 0;*/
        background-size: 68px 40px;
        position: relative;
    }

    .tbl_scroll.on .tbl_wrap {
        overflow-x: auto;
    }

    /*.tbl_scroll.on:before {
        display: block;
    }*/

    .tbl_scroll.on .tbl {
        min-width:1000px;
    }
}

@keyframes side {
    0% {
        transform: translateX(-3px);
    }
    100% {
        transform: translateX(3px);
    }
}

.detail-content:has(.table_tab_menu) .supply_content{margin-top:0;}


.table_tab_menu {
    margin-bottom: 60px;
}

.table_tab_menu ul {
    display: table;
    width: 100%;
    max-width: 718px;
    table-layout: fixed;
    border: 1px solid #9A9A9A;
    margin: 0 auto;
}

.table_tab_menu ul li {
    display: table-cell;
    height: 60px;
    border-left: 1px solid #9A9A9A;
    text-align: center;
    vertical-align: middle;
}

.table_tab_menu ul li.active {
    background: #042e7d;
}

.table_tab_menu ul li:first-child {
    border-left: 0;
}

.table_tab_menu ul li a {
    display: block;
    font-size: 18px;
}

.table_tab_menu ul li a:hover,
.table_tab_menu ul li a:focus {
    text-decoration: underline;
    text-underline-position: under;
}

.table_tab_menu ul li.active a:hover,
.table_tab_menu ul li.active a:focus {
    text-decoration: none;
}

.table_tab_menu ul li.active a {
    color: #fff;
}

@media(max-width:767px) {
        .table_tab_menu {
        padding: 0 20px;
    }

    .table_tab_menu ul li {
        line-height: normal;
    }

    .table_tab_menu ul li a {
        font-size: 16px;
    }
}


/*
.supply_content.type02{margin-top:0;padding:calc(8rem / 1.6);}
.supply_content .supply_content_list{margin:calc(6rem / 1.6) 0;padding:calc(4rem / 1.6);background-color:#fff;}
.supply_content .supply_content_list+*{margin-bottom:0;}
.supply_content .supply_content_list>li{position:relative;padding-top:calc(.7rem / 1.6);padding-left:calc(5.2rem / 1.6);min-height:calc(3.6rem / 1.6);color:#333;font-size:calc(1.6rem / 1.6);line-height:calc(2rem / 1.6);}
.supply_content .supply_content_list>li>i{display:flex;justify-content:center;align-items:center;position:absolute;top:0;left:0;padding-bottom:calc(.15rem / 1.6);width:calc(3.6rem / 1.6);aspect-ratio:1 / 1;background-color:#2277f2;border-radius:50%;color:#fff;font-weight:700;}
.supply_content .supply_content_list>li+li{margin-top:calc(2rem / 1.6);}

@media(max-width:1023px) {
    .supply_content.type02{padding:calc(4rem / 1.6);}
    .supply_content  .supply_content_list{padding:calc(3rem / 1.6);}
}

@media(max-width:767px) {
    .supply_content .supply_content_list{padding:calc(2rem / 1.6);}
    .supply_content .supply_content_list>li{font-size:calc(1.8rem / 1.6);line-height:calc(2.4rem / 1.6);}
}
*/




.supply_content.type02 {
    margin-top: 0;
    padding: calc(8rem / 1.6);
}

.supply_content .supply_content_list {
    margin: calc(6rem / 1.6) 0;
    padding: calc(4rem / 1.6);
    background-color: #fff;
}

.supply_content .supply_content_list + * {
    margin-bottom: 0;
}

.supply_content .supply_content_list > li {
    position: relative;
    padding-top: calc(.7rem / 1.6);
    padding-left: calc(5.2rem / 1.6);
    min-height: calc(3.6rem / 1.6);
    color: #333;
    font-size: calc(1.6rem / 1.6);
    line-height: calc(2rem / 1.6);
}

.supply_content .supply_content_list > li > i {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    padding-bottom: calc(.15rem / 1.6);
    width: calc(3.6rem / 1.6);
    aspect-ratio: 1 / 1;
    background-color: #2277f2;
    border-radius: 50%;
    color: #fff;
    font-weight: 700;
}

.supply_content .supply_content_list > li + li {
    margin-top: calc(2rem / 1.6);
}

.supply_content .supply_content_list > li:has( > i.type02) {
    padding-left: calc(9.2rem / 1.6);
}

.supply_content .supply_content_list > li > i.type02 {
    width: calc(8rem / 1.6);
    height: calc(3.6rem / 1.6);
    border-radius: calc(3.6rem / 1.6)
}

@media (max-width: 1023px) {
    .supply_content.type02 {
        padding: calc(4rem / 1.6);
    }

    .supply_content .supply_content_list {
        padding: calc(3rem / 1.6);
    }
}

@media (max-width: 767px) {
    .supply_content .supply_content_list {
        padding: calc(2rem / 1.6);
    }

    .supply_content .supply_content_list > li {
        font-size: calc(1.8rem / 1.6);
        line-height: calc(2.4rem / 1.6);
    }
}

.supply_toggle {
    display: flex;
    justify-content: flex-end;
    padding-top: calc(2rem / 1.6);
    border-top: 1px solid #ddd;
}

.supply_toggle > button {
    display: flex;
    align-items: center;
    gap: calc(1.6rem / 1.6);
    color: #333;
    font-size: calc(1.6rem / 1.6);
    font-weight: 500;
}

.supply_toggle > button > i {
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(4.5rem / 1.6);
    aspect-ratio: 1 / 1;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 50%;
    font-size: calc(1.8rem / 1.6);
    line-height: 1;
}

:has(.supply_toggle) .btn01 a {
    position: relative;
    padding-right: 60px;
    width: auto;
}

:has(.supply_toggle) .btn01 a em {
    position: absolute;
    top: 0;
    right: 0;
    padding: 0;
    width: 60px;
    height: 100%;
}

:has(.supply_toggle) .btn01 a em:before {
    display: block;
    top: 50%;
    left: 50%;
    transform: rotate(180deg) translate(50%, 50%);
}

:has(.supply_toggle) .btn01 a span {
  font-size: 15px;
}