@charset "utf-8";

/* Common */
.txtL {text-align:left!important;}
.cont_inner {max-width:1670px;width:100%;margin:0 auto;padding:0 30px;box-sizing: border-box;}
.container #contents>.headLine1.noLine {padding-bottom:0;}
.container #contents>.headLine1.noLine::before {display:none;}
.container #contents>.headLine1 .baseBtn {position:absolute;right:20px;bottom:45px;}
.txtAlert{display:block;width:100%;font-size:1.8rem;line-height:3rem;letter-spacing:0;color:#777;padding-left:22px;background:url(../../assets/images/common/icon_txtAlert.svg) no-repeat left top 7px/15px auto;}

/* 프로필 */
.topInfoArea {position:relative;height:565px;margin-top:-50px;background:url(../../assets/images/cont/president/profile_bg1.png) no-repeat center;background-size: cover;}
.topInfoArea .imgArea {max-width: 947px;margin: 0 auto;padding-top: 75px;padding-left:20px;padding-right: 20px;}
.topInfoArea .titArea {position: absolute;top: 175px;left: calc(50% + 100px);}
.topInfoArea .titArea .tit {font-size:10.6rem;letter-spacing: -1rem;color:#fff;}
.topInfoArea .titArea .tit_c {font-size:4.3rem;color:#fff;}

.profile {max-width:915px;width:100%;margin:0 auto;}
.profile .tabWrap {display: flex;margin: 140px 0 60px;}
.profile .tabWrap>li {display: flex;align-items: center;justify-content: center;width: 50%;height: 60px;background-color: #fff;border: 1px solid #D5D5D5;cursor: pointer;}
.profile .tabWrap>li.on {background-color: #011131;border: 1px solid #011131;}
.profile .tabWrap>li:first-child {border-right: none;}
.profile .tabWrap>li span {font-size: 2rem;font-weight: 500;}
.profile .tabWrap>li.on span {color: #fff;}
.profile .titFirst {padding:15px 0 35px;border-top:1px solid #000;font-weight: 700;letter-spacing: -2px}
.profile .txtBody1 {font-size:1.7rem;font-weight: 400;line-height:3.4rem;word-break: break-all;}
.profile .txtBody1+.txtBody1 {margin-top: 35px;}
.profile .txtBody2 {font-size:1.7rem;line-height:3.4rem;word-break: break-all;}
.profile .historyList .history_tit {position:relative;margin-bottom:17px;font-size: 4.8rem;font-weight:700;letter-spacing: -1px;} 
.profile .historyList .history_tit:before {content:'';position:absolute;left:-41px;top:50%;margin-top:-6.5px;display:block;width:13px;height:13px;background:#AF8E65;border-radius: 50%;}
.profile .historyList+.historyList {margin-top:85px}
.profile .historyList ul>li {position:relative;padding-left:190px;}
.profile .historyList ul>li+li {margin-top:20px;}
.profile .historyList ul>li .date {position:absolute;top:5px;left:0;font-size:1.8rem;font-weight:600;}
.profile .historyList.shorts ul>li {padding-left:102px;}
.profile .historyWrap {position:relative;padding-left:35px;}
.profile .historyWrap:before {content:'';position:absolute;left:0;top:25px;display:block;width:1px;height:calc(100% - 25px);background:#D5D5D5;}
.profile .historyWrap.type2 {padding-left:0;}
.profile .historyWrap.type2:before {display:none;}
.profile .historyWrap.type2 .historyList ul>li {padding-left:80px;}
.profile .division:last-child .historyWrap:before {top:10px;}

/* 용산시대 */
.typeTab article.open_office_layout {max-width:1256px;}
.open_office .division {border-bottom:none;}
.open_office .division+.division {padding-top:116px;}
.open_office .division:nth-child(2) {max-width:1216px;width:100%;margin:0 auto;}
.open_office .bottomContArea {margin-top:60px;}
.open_office .txtBody1+.headLine3 {padding-top:20px;}
.open_office .headLine3 {line-height:4.6rem;}
.open_office .headLine3+.txtBody2 {margin-top:10px;}

.open_office .office_tit {width:100%;margin:0 auto;font-size:3.2rem;letter-spacing:normal;line-height: 6.8rem;font-weight:500;text-align: center;}
.open_office .office_tit span {display: block;font-size: 4.8rem;line-height: 4.8rem;font-weight: 700;}
.open_office .office_tit .mbBr {display: none;}
.open_office .fullImgArea {width: calc(100% + 394px);margin-left: -197px;margin-top:75px;} 
.open_office .fullImgArea+p {padding-top:82px;}
.open_office .txtWrap {max-width:1216px;width:100%;margin:0 auto;padding-top: 50px;}
.open_office .topTxt {font-size:2.4rem;font-weight:500;line-height:4rem;letter-spacing:inherit;word-break: keep-all;}
.open_office .officeInfo_top {display: block;padding-bottom: 100px;text-align: center;}
.open_office .officeInfo_top p {font-size: 3.2rem;font-weight: bold;}
.open_office .officeInfo {position:relative;height:448px;display:flex;justify-content:space-between;font-size:0;}
.open_office .officeInfo+.officeInfo {margin-top:160px;}
.open_office .officeInfo>div {display:inline-block;vertical-align:top;}
.open_office .officeInfo .txtWrap {display:flex;flex-direction:column;justify-content:center;position:relative;max-width:calc(100% - 751px);width:100%;padding-right:30px;}
.open_office .officeInfo .txtWrap .headLine3 {padding-bottom:10px;line-height: 4.3rem;letter-spacing:-0.5px;word-break: keep-all;}
.open_office .officeInfo .txtWrap .txtBody3 {padding-top:10px;line-height: 2.8rem;}
.open_office .officeInfo .txtWrap .txtBody3:nth-child(1) {padding-top: 0;}
.open_office .officeInfo .txtWrap .line {width:1px;height:100%;background:#AF8E65;}
.open_office .officeInfo .imgWrap {max-width:751px;width:100%;border-radius:10px;margin-top:0;background-image:url(../../assets/images/cont/office/office_n_img1.png);background-repeat:no-repeat;background-size:cover;background-position:center center;}
.open_office .officeInfo:nth-child(2) .imgWrap {background-image:url(../../assets/images/cont/office/office_n_img1.png);}
.open_office .officeInfo:nth-child(3) .imgWrap {background-image:url(../../assets/images/cont/office/office_n_img2.png);}
.open_office .officeInfo:nth-child(3) .txtWrap {left:24px;padding-right:0;padding-left: 30px;}
.open_office .officeInfo:nth-child(4) .imgWrap {background-image:url(../../assets/images/cont/office/office_n_img3.png);}
.open_office .officeInfo:nth-child(4) .txtWrap {left: 0;padding-right: 30px;}

/* 조직도 */
.organization .division {font-size:0;}
.organization .division>div {display:inline-block;vertical-align:top;text-align:center;}
.organization .leftArea {width:100%;}
.organization .rightArea {display:block;max-width:496px;width:100%;margin:0 auto;margin-top:100px;padding-left:0;}
.organization strong {position:relative;display:inline-block;max-width:220px;width:100%;height:64px;border-radius:7px;background-color:#00205C;}
.organization strong::before {content:'';position:absolute;top:64px;left:calc(50% - .5px);width:1px;height:406px;background:#D5D5D5;}
.organization .rightArea strong {max-width:418px;padding:0 10px;}
.organization .rightArea strong::before {height:24px;}
.organization strong span {color:#fff;line-height:64px;}
.organization .chart li.bgGold {background-color:#AF8E65;border:none;}
.organization .chart li.bgGold span {color:#fff;}
.organization .chart li.bgGray {background-color:#555B65;border:none;}
.organization .chart li.bgGray span {color:#fff;}
.organization .chartList li {position:relative;display:flex;align-items:center;max-width:240px;width:100%;height:auto;min-height:70px;padding:10px;background-color:#F7F7F7;border:1px solid #D5D5D5;border-radius:3px;}
.organization .chartList li+li {margin-top:10px;}
.organization .chartList li span {display:block;line-height:normal;font-size:1.5rem;} 
.organization .chartList li span.txtBody4 {color:#777;}
.organization .chartList .tit::before {content:'';position:absolute;top:-24px;left:calc(50% - .5px);width:1px;height:24px;background:#D5D5D5;}
.organization .chartList:not(:last-child) .tit::after {content:'';position:absolute;top:-24px;left:calc(50% - .5px);width:calc(100% + 17px);height:1px;background:#D5D5D5;}
.organization .chart1 {max-width:1123px;width:100%;margin:0 auto;margin-top:50px;text-align:left;}
.organization .chart1 .chartList {display:inline-table;vertical-align:top;box-sizing:border-box;text-align:center;}
.organization .chart1 .chartList ul:first-child .tit::after {content:'';position:absolute;top:-24px;left:calc(50% - .5px);width:calc(100% + 15px);height:1px;background:#D5D5D5;}
.organization .chart1 .chartList:nth-child(1) {position:relative;padding-right:32px;}
.organization .chart1 .chartList:nth-child(1)::before {content:'';position:absolute;top:-24px;left:calc(50% - 16px);width:calc(100% - 86px);height:1px;background:#d5d5d5;}
.organization .chart1 .chartList:nth-child(1) ul  {max-width:530px;width:100%;}
.organization .chart1 .chartList:nth-child(1) ul li {position:relative;display:inline-flex;vertical-align:top;}
.organization .chart1 .chartList:nth-child(1) ul li:nth-child(odd)::before {content:'';position:absolute;bottom:34px;right:-26px;width:1px;height:calc(100% + 12px);background:#d5d5d5;}
.organization .chart1 .chartList:nth-child(1) ul li:nth-child(1)::before {height:calc(100% - 9px);}
.organization .chart1 .chartList:nth-child(1) ul li:nth-child(odd)::after {content:'';position:absolute;bottom:calc(50% - .5px);right:-51px;width:51px;height:1px;background:#d5d5d5;}
.organization .chart1 .chartList:nth-child(1) ul li+li {margin-top:0;}
.organization .chart1 .chartList:nth-child(1) ul li:nth-child(n+3) {margin-top:10px;}
.organization .chart1 .chartList:nth-child(1) ul li:nth-child(even) {margin-left:50px;}
.organization .chart1 .chartList:nth-child(1) ul li:last-child {border: none;background: none;}
.organization .chart1 .chartList:nth-child(1) ul li:nth-child(7)::after {right: -26px;width: 26px;z-index: -1;} 
.organization .chart1 .chartList:nth-child(2) {padding-left:17px;}
.organization .chart1 .chartList:nth-child(2) ul {display:inline-block;vertical-align:top;width:calc(50% - 15px);margin-left:15px;}
.organization .chart2 {width:calc(100% + 15px);margin-top:70px;margin-left:-15px;font-size:0;}
.organization .chart2 .chartList {display:inline-block;vertical-align:top;width:calc(16.6666% - 15px);margin-left:15px;}
.organization .chart2 .chartList li {width:100%;min-height:90px;}
.organization .chart3 {width:calc(100% + 15px);margin-top:48px;margin-left:-15px;font-size:0;}
.organization .chart3 .chartList {display:inline-block;vertical-align:top;width:calc(50% - 15px);margin-left:15px;}
.organization .chart3 .chartList li {width:100%;min-height:70px;padding:0 10px;}


@media screen and (max-width: 1800px) {
.typeTab article.open_office_layout {margin-left:300px;}
.open_office .fullImgArea {margin-left:-340px;}
.open_office .officeInfo .txtWrap {max-width:calc(100% - 550px);}
.open_office .officeInfo .imgWrap {max-width:550px;}
}

@media screen and (max-width: 1600px) {
    /* 프로필 */
    .topInfoArea .titArea .tit {font-size: 8.2rem;;}
    .topInfoArea .titArea .tit_c {font-size: 3rem;}

    /* 용산시대 */
    /* .container #contents>.headLine1 .baseBtn.type2 {position:relative;right:0;bottom:0;display:block;margin:0 auto;margin-top:25px;}
    .container #contents>.headLine1 .baseBtn.type2 .base {padding:13px 20px 15px 20px;} */
    
    .typeTab article.open_office_layout {padding-left:20px;}
    .open_office .bottomContArea .division:nth-child(1) {padding-bottom: 0;}
    .open_office br {display:none;}
    .open_office .mbBr {display:block;}
    .open_office .office_tit {line-height:4.8rem;}
    .open_office .office_tit span {line-height:6rem;}

    /* 조직도 */
    .organization .chart1 {max-width:100%;}
    .organization .chart1 .chartList {width:50%;}
    .organization .chart1 .chartList:nth-child(1) ul {width:calc(100% + 35px);margin-left:-35px;}
    .organization .chart1 .chartList:nth-child(1) ul li {width:calc(50% - 35px);margin-left:35px;}
    .organization .chart1 .chartList:nth-child(1) ul li:nth-child(even) {margin-left:35px;}
    .organization .chart1 .chartList:nth-child(1) ul li:nth-child(odd)::before {right:-19.5px;}
    .organization .chart1 .chartList:nth-child(2) {max-width:438px;width:calc(50% + 35px);margin-left:-35px;float:right;padding-left:48px;}
    .organization .chart1 .chartList:nth-child(2) ul {width:calc(50% - 35px);margin-left:35px;}
    .organization .chart1 .chartList:nth-child(2) ul li {width:100%;}
    .organization .chart1 .chartList ul .tit::after {content:'';position:absolute;top:-24px;right:calc(50% - .5px);width:calc(100% + 50px);height:1px;background:#D5D5D5;}
    .organization .chart1 .chartList ul:first-child .tit::after {left:auto;right:calc(50% - .5px); width:calc(100% + 50px);}
    .organization .chart1 .chartList:nth-child(1)::before {left:auto;right:0;width:calc(100% - 178px);}
    .organization .chart1 .chartList:nth-child(2) {position:relative;}
    .organization .chart1 .chartList:nth-child(2)::before {content:'';position:absolute;top:-24px;left:-118px;width:calc(100% + 38px);height:1px;background:#d5d5d5;}
    .organization .chart1 .chartList ul:first-child .tit::after {display:none;}
    .organization .chart1 .chartList ul .tit::after {display:none;}
    .organization .chartList:nth-child(3) .tit::after {display:none;}
    .organization .chartList:nth-child(5) .tit::before {top:-167px;height:167px;}
    .organization .chart2 .chartList {width:calc(33.3333% - 15px);}
    .organization .chart2 .chartList:nth-child(n+4) {margin-top:50px;}
    .organization .chart1 .chartList:nth-child(1) ul li:nth-child(7)::after {right: -19px;z-index: -1;} 
}

@media screen and (max-width: 1400px) {
    .division br {display:none;}
    .division .mbBr {display:block;}

    .open_office .officeInfo {height: 370px;}
    .open_office .officeInfo .imgWrap {max-width:400px;}
    .open_office .officeInfo .txtWrap {max-width:calc(100% - 400px);}
    .open_office .officeInfo .txtWrap .headLine3 {font-size:2.6rem;line-height:4rem;}
    .open_office .officeInfo .txtWrap .txtBody3 {line-height:2.4rem;}
}

@media screen and (max-width: 1260px) {
    .open_office .officeInfo .txtWrap .txtBody3 {word-break:keep-all;}
    .open_office .officeInfo .txtWrap .txtBody3 br {display:none;}

    .organization strong::before {height:80px;}
    .organization .chart1 .chartList:nth-child(2)::before {left:-171px;width:calc(100% + 91px);}
    .organization .leftArea {width:100%;}
    .organization .leftArea strong::before {height:318px;}
    .organization .rightArea {width:100%;margin-top:50px;padding-left:0;}
    .organization .chart3 {margin-top:103px;}

    .topInfoArea .titArea {right:10%;left:auto;}
}

@media screen and (max-width: 1200px) {
	.topInfoArea {position:relative;height:565px;margin-top:-50px;background:url(../../assets/images/cont/president/m_bg3.png) no-repeat center;background-size: cover;}
    .typeTab article.open_office_layout {max-width:100%;padding:0 20px;margin:0 auto;}
    .open_office .division+.division {padding-top: 56px;}

    .open_office .office_tit {padding-left:0;word-break: keep-all;}
    .open_office .fullImgArea {width: calc(100% + 200px);margin-left: -100px;margin-top: 80px;}
    .open_office .officeInfo_top {padding-bottom: 50px;text-align: left;}
    .open_office .officeInfo_top br {display: none;}
    .open_office .officeInfo {display:grid;height:auto;}
    .open_office .officeInfo+.officeInfo {margin-top:110px;}
    .open_office .officeInfo .txtWrap {order:-1;padding-top: 0;}
    .open_office .officeInfo:nth-child(3) .imgWrap {order:inherit;}
    .open_office .officeInfo .imgWrap {max-width: 100%;height:400px;}
    .open_office .officeInfo .txtWrap {max-width: 100%;padding-right: 0;padding-bottom: 25px;}
    .open_office .officeInfo:nth-child(3) .txtWrap {left: 0;padding-left: 0;}
    .open_office .officeInfo .txtWrap .headLine3 .mbBr {display:none;}
    .open_office .officeInfo .txtWrap .headLine3 .mbBr2 {display:block;}
    .open_office .officeInfo .txtWrap .line {height:100px;}
}

@media screen and (max-width: 1041px) {
    /* .container #contents>.headLine1 .baseBtn {position:relative;right:0;bottom:0;display:block;margin:0 auto;margin-top:25px;} */

    .topInfoArea {height:440px;}
    .topInfoArea .titArea {padding-left:300px;}
    .topInfoArea .imgArea {position:absolute;bottom:-50px;left:0;}
    .topInfoArea .imgArea img {height:350px;}

	.profile .tabWrap { margin: 120px 0 60px; }
    .profile .historyWrap:before {left:11px;}
    .profile .historyList .history_tit:before {left:-30px;}
    .profile .historyList ul>li {padding-left:230px;}
    .profile .historyList.shorts ul>li {padding-left:120px;}
    .profile .historyWrap.type2 .historyList ul>li {padding-left:90px;}
}

@media screen and (max-width: 900px) {
    .organization .leftArea strong::before {height:1308px;}
    .organization .chartList li {width:calc(50% - 15px);padding:5px;}
    .organization .chart1 .chartList {width:100%;}
    .organization .chart1 .chartList:nth-child(1) {padding-right:0;}
    .organization .chart1 .chartList:nth-child(1)::before {display:none;}
    .organization .chart1 .chartList:nth-child(1) ul {max-width:100%;width:calc(100% + 15px);margin-left:-7.5px;font-size:0;}
    .organization .chart1 .chartList:nth-child(1) ul li {width:calc(50% - 15px);margin-left:15px;}
    .organization .chart1 .chartList:nth-child(1) ul li:nth-child(even) {margin-left:15px;}
    .organization .chart1 .chartList:nth-child(1) ul li:nth-child(odd)::before {display:none;}
    .organization .chart1 .chartList:nth-child(2) {float:inherit;max-width:100%;width:calc(100% + 15px);margin-left:-7.5px;margin-top:50px;padding-left:0;}
    .organization .chart1 .chartList:nth-child(2)::before {display:none;}
    .organization .chart1 .chartList:nth-child(2) ul {width:calc(50% - 15px);margin-left:15px;}
    .organization .chart1 .chartList:nth-child(2) ul li {width:100%;margin-left:0;}
    .organization .chart1 .chartList ul .tit::after {display:block;width:calc(100% + 15px);}
    .organization .chartList:nth-child(5) .tit::before {top:-24px;height:24px;}
    .organization .chartList:nth-child(odd) .tit::after {display:none;}
    .organization .chartList:nth-child(even) .tit::after {content:'';position:absolute;top:-24px;left:auto;right:calc(50% - .5px);width:calc(100% + 15px);height:1px;background:#D5D5D5;}
    .organization .chart2 .chartList {width:calc(50% - 15px);}
    .organization .chart2 .chartList:nth-child(n+3) {margin-top:50px;}
}

@media screen and (max-width: 767px) {
    .topInfoArea {height:220px;margin-top:-20px;}
    .topInfoArea .imgArea img {height:200px;}
    .topInfoArea .titArea {padding-left:0;right:auto;left:192px;top:85px;}
    .topInfoArea .titArea .tit {font-size: 4.2rem;letter-spacing: 0;}
    .topInfoArea .titArea .tit_c {font-size: 1.8rem;}

    .profile .historyList {margin-top:20px;}
    .profile .historyList .history_tit {font-size:3.2rem}
    .profile .historyList ul>li {padding-left:0 !important}
    .profile .historyList ul>li+li {margin-top:20px;}
    .profile .historyList ul>li .date {position:relative;top:0;padding-bottom:10px;}
    .profile .historyList+.historyList {margin-top:60px;}
    .profile .historyWrap.type2 .historyList ul>li {padding-left:0 !important}

    .open_office .division:nth-child(1) {padding-bottom: 135px;}
    .open_office .division+.division {padding-top:110px;}
    .open_office .office_tit {font-size: 2.2rem;line-height:3.2rem;letter-spacing:0;}
    .open_office .office_tit span {font-size: 2.8rem;line-height:3.8rem;}
    .open_office .fullImgArea {width: calc(100% + 40px);margin-left: -20px;margin-top: 30px;}
    .open_office .fullImgArea+p {padding-top:40px;}
    .open_office .topTxt {font-size: 1.8rem;line-height: 3rem;letter-spacing:0;}
    .open_office .officeInfo .txtWrap .line {height: 42px;}
    .open_office .officeInfo .txtWrap .headLine3 {font-size:2.4rem;line-height:3.4rem;}
    .open_office .officeInfo .txtWrap .txtBody3 {font-size: 1.6rem; line-height:2.8rem;}
    .open_office .officeInfo .txtWrap .headLine3 .mbBr {display: none;}
}

@media screen and (max-width: 500px) {
    .open_office .office_tit .mbBr {display: block;}
    .open_office .officeInfo .imgWrap {height: 210px;}
}

@media screen and (max-width: 480px) {
    .topInfoArea .titArea {left:170px;}
    .topInfoArea .titArea .tit {font-size: 3.4rem;margin-bottom: 1rem;letter-spacing: -.05rem;}
    
}
