@charset "utf-8";
/* *******************************************************
 * filename : sub_style02.css
 * description : 서브디자인_투자정보, 윤리경영 CSS
 * date : 2020-07-14
******************************************************** */

/* 투자정보_재무정보 */
.sub-finance .number-box ul {display: flex; align-items: center; justify-content: center; margin-bottom: 100px;}
.sub-finance .number-box ul li {margin: 0 40px; width: 266px; text-align: center;}
.sub-finance .number-box img {display: block; margin: 0 auto 20px;}
.sub-finance .number-box .num {font-size: 25px;}
.sub-finance .number-box .num span {color:#222; font-size: 56px; font-weight: 700;}
.sub-finance .number-box .title {font-size: 25px; color:#222; font-weight: 400;}
.sub-finance .number-box .title span {font-size: 20px; color:#9d9d9d;}

/* 투자정보_지배구조_이사회 */
.sub-invest03 {width: 1200px; margin: 0 auto;}
.sub-invest03 .thum dl {padding: 57px 45px 45px; color:#222; font-weight: 600;}
.sub-invest03 .thum dt {font-size: 18px;}
.sub-invest03 .thum dd {font-size: 35px;}
.sub-invest03 .info li {display: flex;}
.sub-invest03 .info .list01 {font-size: 20px;}
.sub-invest03 .info .list01 .label {color:#222; font-weight: 500; margin-right: 15px; word-break: keep-all;}
.sub-invest03 .info .list02 {margin-top: 25px; font-size: 17px;}
.sub-invest03 .info .list02  .title {color:#222; font-weight: 500;}
.sub-invest03 .info .list02 li {margin: 11px 0;}
.sub-invest03 .info .list02 li p {line-height: 1.2em; word-break: keep-all;}
.sub-invest03 .info .list02 .label {margin-right: 10px; min-width: 100px;}
.sub-invest03 .info .list02 .label::before {content:''; display: inline-block; width: 5px; height: 5px; margin-right: 10px; border-radius: 50%; background:#222; margin-bottom: 4px;}
.sub-invest03 .ctn01 .box {width: 100%; display: flex; border-top: 1px solid #686868;}
.sub-invest03 .ctn01 .box + .box {margin-top: 55px;}
.sub-invest03 .ctn01 .thum {display: flex; align-items: flex-start; width: 46%;}
.sub-invest03 .ctn01 .info {padding: 53px 45px 0 0; width: 54%;}
.sub-invest03 .ctn01 .info .list01 .label {width: 16%;}
.sub-invest03 .ctn01 .info .list01 .txt {width: 84%;}
.sub-invest03 .ctn02 > ul {display: flex; flex-wrap: wrap;}
.sub-invest03 .ctn02 .box {width: 50%;}
.sub-invest03 .ctn02 .box:nth-child(2n-1) {padding-right: 20px; padding-bottom: 20px;}
.sub-invest03 .ctn02 .box:nth-child(2n) {padding-left: 20px; padding-bottom: 20px;}
.sub-invest03 .ctn02 .box .inner {display: flex; border-top: 1px solid #686868;}
.sub-invest03 .ctn02 .info .list01 .label {width: 20%;}
.sub-invest03 .ctn02 .info .list01 .txt {width: 80%;}
.sub-invest03 .ctn02 .thum dl {padding: 0; padding-top: 5px; text-align: right;}
.sub-invest03 .ctn02 .thum dl dt,
.sub-invest03 .ctn02 .thum dl dd {display: inline-block;}
.sub-invest03 .ctn02 .thum dl dt {font-size: 16px;}
.sub-invest03 .ctn02 .thum dl dd {font-size: 30px;}
.sub-invest03 .ctn02 .info {padding: 25px 0 0 35px; flex: 2;}
.sub-invest03 .ctn02 .info .list01 {font-size: 18px;}
.sub-invest03 .ctn02 .info .list01 p {line-height: 1.2em;}
.sub-invest03 .ctn02 .info .list01 li + li {margin-top: 10px;}
.sub-invest03 .ctn02 .info .list02 {font-size: 16px;}
.sub-invest03 .ctn03 ul {display: flex; justify-content: center;}
.sub-invest03 .ctn03 a {
    width: 300px;
    padding: 10px;
    background-color:#fff;
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-image: url('../images/common/icon-arrow-r-g02.png');
    background-size: 6px;
    border: 1px solid #c9c9c9;
    margin: 2px;
    text-align: center;
    display: block;
    font-weight: 400;
    color:#686868;
}
.sub-invest03 .ctn03 a:hover {color:#fff; background-color:#de0021; background-image: url('../images/common/icon-arrow-r-w.png');}
.sub-invest03 .ctn04 table.type01 th,
.sub-invest03 .ctn04 table.type01 td {padding: 15px;}
.sub-invest03 .ctn04 .ctn-wrap {position: relative; padding-left: 246px;}
.sub-invest03 .ctn04 .year {position: absolute; left:0;}
.sub-invest03 .ctn04 .year a {display: block; border-top: 1px solid #d9d9d9; border-bottom: 1px solid #d9d9d9; padding: 25px 100px 25px 0; font-size: 25px; font-weight: 600;}
.sub-invest03 .ctn04 .year a + a {margin-top: -1px;}
.sub-invest03 .ctn04 .year a.on {color:#de0021; background: url('../images/common/icon-arrow-r-r.png') no-repeat right center; background-size: 6px;}
.sub-invest03 .ctn04 .table-wrap {display: none;}
.sub-invest03 .ctn04 .table-wrap.on {display: block;}

/* 투자정보_공시정보 */
.sub-public .ctn-box {overflow: auto;}

/* 윤리경영공통 */
.sub-ethic-more {width: 100%; height: 200px; display: flex;}
.sub-ethic-more a {
    display: flex; flex: 1;
    height: 100%;
    align-items: center;
    color:#fff; font-size: 25px;
    font-weight: 500;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding: 10px 90px;
}
.sub-ethic-more a span::after {
    content: '';
    display: inline-block;
    width: 53px; height: 53px;
    border: 1px solid #fff;
    background: url('../images/icon/icon-more-w.png') no-repeat center center;
    background-size: 15px;
    margin-left: 25px;
    margin-top: -7px;
    vertical-align: middle;
}
.sub-ethic-more .go01 {background-image: url('../images/img/ethic-img01.jpg'); justify-content: flex-end;}
.sub-ethic-more .go02 {background-image: url('../images/img/ethic-img02.jpg'); justify-content: flex-start;}

/* 윤리경영개요 */
.sub-ethic {width: 1200px; margin: 0 auto;}
.sub-ethic .title-txt {text-align: center; font-size: 25px; color:#222; padding: 0 50px; line-height: 1.5em;}
.sub-ethic .ctn01 {margin-top: 100px;}
.sub-ethic .ctn01 > ul {display: flex; align-items: flex-start; margin-left: -19px; margin-right: -19px;}
.sub-ethic .ctn01 .box {width: 20%; padding: 0 19px; text-align: center;}
.sub-ethic .ctn01 .box p {word-break: keep-all;}
.sub-ethic .ctn01 .icon {
    display: block;
    width: 152px; height: 152px;
    margin: 0 auto 40px;
    border: 11px solid #d6d6d6;
    border-radius: 50%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 101px;
}
.sub-ethic .ctn01 .box .txt {margin-top: -7px; border-top: 1px solid #d6d6d6; padding-top: 23px;}
.sub-ethic .ctn01 .box1 .icon {background-image: url('../images/icon/ethic-icon01.png');}
.sub-ethic .ctn01 .box2 .icon {background-image: url('../images/icon/ethic-icon02.png');}
.sub-ethic .ctn01 .box3 .icon {background-image: url('../images/icon/ethic-icon03.png');}
.sub-ethic .ctn01 .box4 .icon {background-image: url('../images/icon/ethic-icon04.png');}
.sub-ethic .ctn01 .box5 .icon {background-image: url('../images/icon/ethic-icon05.png');}
.sub-ethic .ctn01 .title {font-size: 30px; display: inline-block; line-height:1em; color:#222;}
.sub-ethic .ctn01 .title::after {content: ''; display: inline-block; width: 100%; height: 3px; background:#222;}
.sub-ethic .ctn02 > ul {display: flex; flex-wrap: wrap;}
.sub-ethic .ctn02 p {word-break: keep-all;}
.sub-ethic .ctn02 .box {width: 50%; min-height: 170px;}
.sub-ethic .ctn02 .box:nth-child(2n-1) {padding-right: 48px;}
.sub-ethic .ctn02 .box:nth-child(2n) {padding-left: 48px;}
.sub-ethic .ctn02 .box .inner {
    border-top: 1px solid #d6d6d6;
    padding: 10px 155px 30px 0;
    background-repeat: no-repeat;
    background-position: right 30px top 39px;
    background-size: 52px;
}
.sub-ethic .ctn02 .box1 .inner {background-image: url('../images/icon/ethic-icon06.png');}
.sub-ethic .ctn02 .box2 .inner {background-image: url('../images/icon/ethic-icon07.png');}
.sub-ethic .ctn02 .box3 .inner {background-image: url('../images/icon/ethic-icon08.png');}
.sub-ethic .ctn02 .box4 .inner {background-image: url('../images/icon/ethic-icon09.png');}
.sub-ethic .ctn02 .box5 .inner {background-image: url('../images/icon/ethic-icon10.png');}
.sub-ethic .ctn02 .box6 .inner {background-image: url('../images/icon/ethic-icon11.png');}
.sub-ethic .ctn02 .box7 .inner {background-image: url('../images/icon/ethic-icon12.png');}
.sub-ethic .ctn02 .title {font-size: 25px; font-weight: 600; color:#222;}
.sub-ethic .ctn03 {margin-bottom: 110px;}
.sub-esg-sm .sub-ethic .ctn03 a {
    display: block;
    width: 350px;
    margin: 0 auto 100px;
    padding: 20px;
    color: #fff;
    background: #e0002a url('../images/icon/icon-more-w.png') no-repeat right 30px center;
    background-size: 15px;
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    border: 1px solid #e0002a;
}
.sub-ethic .ctn03 .desc-wrap {display: none;}
.sub-esg-sm .sub-ethic .ctn03 ul {display: block;}
.sub-ethic .ctn03 a.close {background: #fff url('../images/icon/icon-close-r.png') no-repeat right 30px center; background-size: 15px; color:#e0002a;}
.sub-ethic .ctn03 .txt-wrap {width: 100%; padding: 50px; border: 1px solid #d6d6d6; background:#f1f1f1; height: 600px; overflow: auto;}
.sub-ethic .ctn03 .txt-wrap > ul > li + li {margin-top: 50px;}
.sub-ethic .ctn03 .txt-wrap .title01 {color:#222; font-size: 20px; font-weight: 600; position: relative; padding-top: 5px;}
.sub-ethic .ctn03 .txt-wrap .title01::before {content:''; display: block; width: 30px; height: 2px; background: #e0002a; position: absolute; top: 0; left: 0;}
.sub-ethic .ctn03 .txt-wrap .depth02 .title {color:#e0002a; font-weight: 400; font-size: 18px;}
.sub-ethic .ctn03 .txt-wrap .depth02 li {font-size: 16px; position: relative; padding-left: 15px;}
.sub-ethic .ctn03 .txt-wrap .depth03 li::before {content: '-'; position: absolute; left:0; top: 4px;}
.sub-ethic .ctn03 .txt-wrap .txt-box {background:#dedede; padding: 20px; margin-top: 20px;}
.sub-ethic .ctn03 .txt-wrap .txt-box .tit {font-size: 16px; font-weight: 500;}

/* 윤리경영_공정거래자율준수 */
.sub-fair {width: 1200px; margin: 0 auto;}
.sub-fair .ctn01 .ctn {display: flex; flex-wrap: wrap; margin-left: -35px; margin-right: -35px;}
.sub-fair .ctn01 .ctn > li {width: 33.3333%; padding: 30px 35px;}
.sub-fair .ctn01 .ctn .num {font-size: 20px; font-weight: 600; color:#9d9d9d; margin-bottom: 38px;}
.sub-fair .ctn01 .ctn .title {font-size: 40px; color:#222; display: inline-block;}
.sub-fair .ctn01 .ctn .title::after {content: ''; display: block; height: 3px; width: 100%; background:#222; margin-top: 38px;}
.sub-fair .ctn01 .ctn .txt {width: 100%; padding-top: 20px; border-top: 1px solid #d6d6d6; word-break: keep-all;}
.sub-fair .ctn02 .ctn .list {padding: 95px 10px 95px 88px; border-bottom: 1px solid #d6d6d6; display: flex; align-items: center;}
.sub-fair .ctn02 .ctn .list:first-child {border-top: 1px solid #d6d6d6;}
.sub-fair .ctn02 .ctn .list .txt-box {margin-left: 125px; width: 100%;}
.sub-fair .ctn02 .ctn .list .title {font-size: 25px; color:#222; font-weight: 600; margin-bottom: 20px;}
.sub-fair .ctn02 .ctn .list img {width: 10%; margin-left: 43px;}
.sub-fair .ctn02 .list-wrap {display: flex;}
.sub-fair .ctn02 .list-wrap ol {flex: 1;}
    /* 추가 */
.sub-fair .ctn03 .ctn .list {padding: 95px; border-bottom: 1px solid #d6d6d6; display: flex; align-items: center;}
.sub-fair .ctn03 .ctn .list:first-child {border-top: 1px solid #d6d6d6;}
.sub-fair .ctn03 .ctn .list .title {font-size: 25px; color:#222; font-weight: 600; margin-bottom: 20px;}
.sub-fair a.add-btn-red {
    display: block;
    width: 350px;
    margin: 50px auto;
    padding: 20px;
    color: #fff;
    background: #e0002a url('../images/icon/icon-more-w.png') no-repeat right 30px center;
    background-size: 15px;
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    border: 1px solid #e0002a;
}

/* 윤리경영_기업윤리상담센터 */
.sub-ethicCS {width: 1200px; margin: 0 auto;}
.sub-ethicCS .desc {text-align: center;}
.sub-ethicCS .desc .bTitle span {font-weight: 600;}
.sub-ethicCS .desc .txt {font-size: 20px; margin-top: 30px; color:#222;}
.sub-ethicCS .desc .txt span {display: block;}
.sub-ethicCS .ctn01 {margin-top: 100px; padding: 45px 190px 75px 100px; background: url('../images/img/ethicCS-img01.png') no-repeat center bottom;}
.sub-ethicCS .ctn01 .title {font-size: 40px;}
.sub-ethicCS .ctn01 ol {padding-top: 180px;}
.sub-ethicCS .ctn01 ol > li {display: flex;}
.sub-ethicCS .ctn01 ol > li + li {margin-top: 20px;}
.sub-ethicCS .ctn01 .num {font-size: 20px; font-weight: 600; color:#ffffff; opacity: 0.4; margin-right: 45px;}
.sub-ethicCS .ctn01  ol > li p {color:#fff; word-break: keep-all;}
.sub-ethicCS .ctn02 {margin-top: 200px; margin-bottom: 100px;}
.sub-ethicCS .ctn02 .list-wrap {display: flex; flex-wrap: wrap;}
.sub-ethicCS .ctn02 .list {width: 50%;}
.sub-ethicCS .ctn02 .list:nth-child(2n) {padding: 0px 0 0px 50px;}
.sub-ethicCS .ctn02 .list:nth-child(2n-1) {padding: 0px 50px 0px 0;}
.sub-ethicCS .ctn02 .list > .inner {width: 100%; height: 100%; border-top: 1px solid #d6d6d6; padding-top: 55px; padding-left: 54px; display: flex; align-items: flex-start; height: 200px;}
.sub-ethicCS .ctn02 .list img {width: 94px;}
.sub-ethicCS .ctn02 .list .txt-box {margin-left: 48px;}
.sub-ethicCS .ctn02 .list .tit {font-size: 25px; font-weight: 600; color:#222;}

@media(max-width: 1200px) {
    /* 투자정보_재무정보 */
    .sub-finance .number-box .num span {font-size: 30px;}
    .sub-finance .number-box .title {font-size: 20px;}
    .sub-finance .number-box .title span {font-size: 18px;}

    /* 투자정보_지배구조_이사회 */
    .sub-invest03 .thum dl {padding: 30px 30px 20px; word-break: keep-all;}
    .sub-invest03 .thum dt {font-size: 15px;}
    .sub-invest03 .thum dd {font-size: 20px;}
    .sub-invest03 .info .list01 {font-size: 17px;}
    .sub-invest03 .info .list02 {font-size: 15px;}
    .sub-invest03 .ctn01 .thum img {width: 53%;}
    .sub-invest03 .ctn01 .info {padding: 25px 0 0;}
    .sub-invest03 .ctn02 .thum {width: 30%;}
    .sub-invest03 .ctn02 .thum img {width: 100%;}
    .sub-invest03 .ctn02 .thum dl {line-height: 1em;}
    .sub-invest03 .ctn02 .thum dl dt {font-size: 14px;}
    .sub-invest03 .ctn02 .thum dl dd {font-size: 18px; line-height: 1em;}
    .sub-invest03 .ctn02 .info {width: 70%;}
    .sub-invest03 .ctn02 .info .list01 {font-size: 16px;}
    .sub-invest03 .ctn02 .info .list02 {font-size: 14px;}
    .sub-invest03 .info .list02 .label {min-width: 90px;}
    .sub-invest03 .ctn04 .ctn-wrap {padding-left: 170px;}
    .sub-invest03 .ctn04 .year a {font-size: 18px; padding: 20px 70px 20px 0;}

    /* 윤리경영공통 */
    .sub-ethic-more {height: 150px;}
    .sub-ethic-more a {font-size: 20px; padding: 10px 40px;}
    .sub-ethic-more a span::after {width: 40px; height: 40px;}

    /* 윤리경영개요 */
    .sub-ethic .title-txt {font-size: 20px;}
    .sub-ethic .ctn01 .icon {border: 7px solid #d6d6d6; width: 120px; height: 120px; background-size: 75px;}
    .sub-ethic .ctn01 .title {font-size: 23px;}
    .sub-ethic .ctn02 .title {font-size: 20px;}
    .sub-ethic .ctn02 .box:nth-child(2n-1) {padding-right: 30px;}
    .sub-ethic .ctn02 .box:nth-child(2n) {padding-left: 30px;}
    .sub-ethic .ctn02 .box .inner {background-size: 40px; background-position: right top 19px;}
    .sub-ethic .ctn03 a {font-size: 17px;}
    .sub-ethic .ctn03 .txt-wrap .title01 {font-size: 18px;}
    .sub-ethic .ctn03 .txt-wrap .depth02 li {font-size: 15px;}

    /* 윤리경영_공정거래자율준수 */
    .sub-fair .ctn01 .ctn {margin-left: -25px; margin-right: -25px;}
    .sub-fair .ctn01 .ctn > li {padding: 25px; width: 50%;}
    .sub-fair .ctn01 .ctn .num {font-size: 18px; margin-bottom: 15px;}
    .sub-fair .ctn01 .ctn .title {font-size: 25px;}
    .sub-fair .ctn01 .ctn .title::after {margin-top: 20px;}
    .sub-fair .ctn02 .ctn .list {padding: 45px 10px 45px 35px;}
    .sub-fair .ctn02 .ctn .list .title {font-size: 20px;}
    .sub-fair .ctn03 .ctn .list {padding: 45px 10px 45px 35px;}
    .sub-fair .ctn03 .ctn .list .title {font-size: 20px;}
    .sub-fair a.add-btn-red {font-size: 17px;}

    /* 윤리경영_기업윤리상담센터 */
    .sub-ethicCS .desc .txt {font-size: 18px; margin-top: 20px; word-break: keep-all;}
    .sub-ethicCS .ctn01 {margin-top: 70px; background-size: cover;}
    .sub-ethicCS .ctn01 .title {font-size: 35px;}
    .sub-ethicCS .ctn01 ol {padding-top: 128px;}
    .sub-ethicCS .ctn02 {margin-top: 100px;}
    .sub-ethicCS .ctn02 .list > .inner {height: 100%; padding: 40px 5px 40px 40px;}
    .sub-ethicCS .ctn02 .list img {width: 70px;}
    .sub-ethicCS .ctn02 .list .tit {font-size: 20px;}
    .sub-ethicCS .ctn02 .list:nth-child(2n) {padding: 20px 0 20px 30px;}
    .sub-ethicCS .ctn02 .list:nth-child(2n-1) {padding: 20px 30px 20px 0;}
}

@media(max-width: 768px) {
    /* 투자정보_재무정보 */
    .sub-finance .number-box ul {margin-bottom: 30px;}
    .sub-finance .number-box ul li {margin: 0 10px;}
    .sub-finance .number-box img {width: 40px;}
    .sub-finance .number-box .num span {font-size: 18px;}
    .sub-finance .number-box .num {font-size: 13px;}
    .sub-finance .number-box .title {font-size: 14px;}
    .sub-finance .number-box .title span {font-size: 12px;}

    /* 투자정보_지배구조_이사회 */
    .sub-invest03 .thum dl {padding: 0; padding-top: 5px !important;}
    .sub-invest03 .thum dt {line-height: 1em !important;}
    .sub-invest03 .info .list01 {font-size: 14px !important;}
    .sub-invest03 .info .list01 p {line-height: 1.2em !important;}
    .sub-invest03 .info .list01 li + li {margin-top: 10px !important;}
    .sub-invest03 .info .list02 {font-size: 13px !important; margin-top: 15px !important;}
    .sub-invest03 .ctn01 .box + .box {margin-top: 30px;}
    .sub-invest03 .ctn01 .thum {width: 30%; display: block;}
    .sub-invest03 .ctn01 .thum img {width: 100%;}
    .sub-invest03 .ctn01 .info {width: 70%; padding: 15px 0 0 15px;}
    .sub-invest03 .ctn01 .info .list02 li {display: block;}
    .sub-invest03 .ctn01 .info .list02 .txt {padding-left: 15px;}
    .sub-invest03 .ctn02 > ul {display: block;}
    .sub-invest03 .ctn02 .box {width: 100%;}
    .sub-invest03 .ctn02 .thum dl {text-align: left;}
    .sub-invest03 .ctn02 .info .list02 li {display: block;}
    .sub-invest03 .ctn02 .info .list02 .txt {padding-left: 15px;}
    .sub-invest03 .ctn02 .box:nth-child(2n-1) {padding-right: 0;}
    .sub-invest03 .ctn02 .box:nth-child(2n) {padding-left: 0;}
    .sub-invest03 .ctn03 ul {display: block;}
    .sub-invest03 .ctn03 ul li {width: 100%;}
    .sub-invest03 .ctn03 a {width: 100%;}
    .sub-invest03 .ctn04 .ctn-wrap {padding-left: 0;}
    .sub-invest03 .ctn04 .year {position: static; display: flex; margin-bottom: 10px;}
    .sub-invest03 .ctn04 .year a {font-size: 14px; padding: 10px; text-align: center; width: 100%; border-top: 0;}
    .sub-invest03 .ctn01 .info .list01 .label,
    .sub-invest03 .ctn02 .info .list01 .label {width: 25%;}
    .sub-invest03 .ctn01 .info .list01 .txt,
    .sub-invest03 .ctn02 .info .list01 .txt {width: 75%;}

    /* 윤리경영공통 */
    .sub-ethic-more {display: block;height: auto;}
    .sub-ethic-more a {flex: none; width: 100%; padding: 30px 15px; font-size: 16px;}
    .sub-ethic-more .go01,
    .sub-ethic-more .go02 {justify-content: center;}

    /* 윤리경영개요 */
    .sub-ethic .title-txt {font-size: 16px; padding: 0; word-break: keep-all;}
    .sub-ethic .ctn01 {margin-top: 50px;}
    .sub-ethic .ctn01 > ul {flex-wrap: wrap; margin-left: 0; margin-right: 0; justify-content: center;}
    .sub-ethic .ctn01 .box {width: 50%; margin-bottom: 20px;}
    .sub-ethic .ctn01 .icon {background-size: 60px; margin: 0 auto 20px;}
    .sub-ethic .ctn01 .title {font-size: 19px;}
    .sub-ethic .ctn02 .box {width: 100%; min-height: 125px;}
    .sub-ethic .ctn02 .box:nth-child(2n-1) {padding-right: 0;}
    .sub-ethic .ctn02 .box:nth-child(2n) {padding-left: 0;}
    .sub-ethic .ctn02 .title {font-size: 16px;}
    .sub-ethic .ctn02 .box .inner {padding: 10px 75px 31px 0; background-size: 33px;}
    .sub-ethic .ctn03 a {font-size: 15px; width: 250px;}
    .sub-ethic .ctn03 .txt-wrap {padding: 30px;}
    .sub-ethic .ctn03 .txt-wrap .title01 {font-size: 16px;}
    .sub-ethic .ctn03 .txt-wrap .depth02 .title {font-size: 14px;}
    .sub-ethic .ctn03 .txt-wrap .depth02 li {font-size: 13px;}

    /* 윤리경영_공정거래자율준수 */
    .sub-fair .ctn01 .ctn {margin: 0; display: block;}
    .sub-fair .ctn01 .ctn > li {width: 100%;padding: 0 0 20px;}
    .sub-fair .ctn01 .ctn .num {font-size: 13px; margin-bottom: 0;}
    .sub-fair .ctn01 .ctn .title {font-size: 16px;}
    .sub-fair .ctn01 .ctn .title::after {margin-top:7px;}
    .sub-fair .ctn01 .ctn .txt {padding-top: 13px;}
    .sub-fair .ctn02 .ctn .list {display: block; padding: 30px 20px;}
    .sub-fair .ctn02 .ctn .list img {margin-left: 0; display: block; margin: 0 auto 10px; width: 55px;}
    .sub-fair .ctn02 .ctn .list .txt-box {margin-left: 0;}
    .sub-fair .ctn02 .ctn .list .title {font-size: 16px; margin-bottom: 10px;}
    .sub-fair .ctn02 .list-wrap {display: block;}
    .sub-fair .ctn02 .list-wrap ol {flex: none;}
    .sub-fair .ctn03 .ctn .list {display: block; padding: 30px 20px;}
    .sub-fair .ctn03 .ctn .list .title {font-size: 16px; margin-bottom: 10px;}
    .sub-fair a.add-btn-red {font-size: 15px; width: 100%;}

    /* 윤리경영_기업윤리상담센터 */
    .sub-ethicCS .bTitle span {display: block;}
    .sub-ethicCS .desc .txt {font-size: 15px;}
    .sub-ethicCS .desc .txt span {display: inline;}
    .sub-ethicCS .ctn01 {margin-top: 30px; padding: 0 20px 20px; background: url('../images/img/ethicCS-img01.png') no-repeat center top; background-size: cover;}
    .sub-ethicCS .ctn01 .title {font-size: 19px; padding-top: 50px;}
    .sub-ethicCS .ctn01 ol {padding-top: 65px;}
    .sub-ethicCS .ctn01 .num {font-size: 16px; margin-right: 20px;}
    .sub-ethicCS .ctn02 {margin-top: 50px; margin-bottom: 50px;}
    .sub-ethicCS .ctn02 .list-wrap {display: block;}
    .sub-ethicCS .ctn02 .list {width: 100%;}
    .sub-ethicCS .ctn02 .list + .list {margin-top: 15px;}
    .sub-ethicCS .ctn02 .list:nth-child(2n-1),
    .sub-ethicCS .ctn02 .list:nth-child(2n) {padding: 0;}
    .sub-ethicCS .ctn02 .list > .inner {padding :30px;}
    .sub-ethicCS .ctn02 .list img {width: 55px;}
    .sub-ethicCS .ctn02 .list .txt-box {margin-left: 30px;}
    .sub-ethicCS .ctn02 .list .tit {font-size: 15px;}

}


/* 주주현황 */
.sub-shareholder-return .ctn01 .ctn {display: flex; justify-content: space-between;}
.sub-shareholder-return .ctn01 .ctn > div {width: 49%;}
.sub-shareholder-return .ctn01 .box-wrap .box {border: 1px solid #ddd; border-radius: 20px; padding: 60px;}
.sub-shareholder-return .ctn01 .box-wrap .box-1 {overflow: hidden; position: relative; background: #000016;}
.sub-shareholder-return .ctn01 .box-wrap .box-1 .bg {position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #000016 url('../images/img/shareholder-return-img01.jpg') no-repeat center; background-size: cover;}
.sub-shareholder-return .ctn01 .box-wrap .box-1 p {color: #fff; position: relative; z-index: 1;}
.sub-shareholder-return .ctn01 .box-wrap .box-2 {margin-top: 10px;}
.sub-shareholder-return .ctn01 .box-wrap .box-2 p {font-weight: 600;}
.sub-shareholder-return .ctn01 .box-wrap .box-2 ul li {position: relative; padding-left: 10px;}
.sub-shareholder-return .ctn01 .box-wrap .box-2 ul li::before {content: '-'; position: absolute; left: 0; top: 0;}
.sub-shareholder-return .ctn01 .graph {border: 1px solid #ddd; border-radius: 20px; display: flex; align-items: center; justify-content: center; padding: 20px;}
.sub-shareholder-return .ctn01 .graph img {display: block; max-width: 100%;}
@media(max-width: 768px) {
    .sub-shareholder-return .ctn01 .ctn {display: block;}
    .sub-shareholder-return .ctn01 .ctn > div {width: 100%;}
    .sub-shareholder-return .ctn01 .box-wrap .box {padding: 30px;}
    .sub-shareholder-return .ctn01 .graph {margin-top: 10px;}
}

/*  */