.subContWrap * {box-sizing:border-box;word-break:break-all;white-space:normal} .ir {overflow:hidden;display:block;position:absolute !important;left:0;top:0;z-index:-1;border:0;width:1px;height:1px;clip:rect(1px, 1px, 1px, 1px);text-indent:-9999px} .subContWrap input, textarea {-webkit-appearance:none;-webkit-border-radius:0;border-radius:0} .subContWrap a:hover {color:inherit} .moShow {display:block !important} .pcShow {display:none !important} .mainWrap * {box-sizing:border-box} .subContWrap img {margin:0} .subContWrap table {width:100%;table-layout:fixed} .subContWrap table th, .subContWrap table td {border-spacing:0;border-collapse:collapse;word-wrap:break-word;vertical-align:middle;border:0} .subContWrap caption {margin:0;width:0;height:0;text-indent:-9999px;} .subContWrap input::placeholder {color:#444;font-weight:300} .subContWrap input:-webkit-input-placeholder {color:#444;font-weight:300} .subContWrap input::-webkit-input-placeholder {color:#444;font-weight:300} .subContWrap input::-moz-placeholder {color:#444;font-weight:300} .subContWrap input:-moz-placeholder {color:#444;font-weight:300} .subContWrap .tc {text-align:center !important} .subContWrap .tr {text-align:right !important} .subContWrap .tl {text-align:left !important} .subContWrap .fcBk1 {color:#222 !important} .subContWrap .fcBk2 {color:#444 !important} .subContWrap .fcBl1 {color:#137fd2 !important} .subContWrap .fcBl2 {color:#003586 !important} .subContWrap .fcRd1 {color:#f24724 !important} .subContWrap .fw400 {font-weight:400 !important} .subContWrap .fw500 {font-weight:500 !important} .subContWrap .fs12 {font-size:12px !important} .subContWrap .fs18 {font-size:18px !important} .subContWrap .inrGap0 {padding-left:0 !important;padding-right:0 !important} .subContWrap .ellipsis {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .subContWrap .mgt0 {margin-top:0 !important} .subContWrap .mgt5 {margin-top:5px !important} .subContWrap .mgt10 {margin-top:10px !important} .subContWrap .mgt15 {margin-top:15px !important} .subContWrap .mgt20 {margin-top:20px !important} .subContWrap .mgt25 {margin-top:25px !important} .subContWrap .mgt35 {margin-top:35px !important} .subContWrap .mgt1020 {margin-top:10px !important} .subContWrap .mgt2540 {margin-top:25px !important} .subContWrap .mgt1530 {margin-top:15px !important} .subContWrap .mgt1855 {margin-top:18px !important} .subContWrap .mgt2035 {margin-top:20px !important} .subContWrap .mgt2555 {margin-top:25px !important} .subContWrap .mgt3040 {margin-top:30px !important} .subContWrap .mgt3552 {margin-top:35px !important} .subContWrap .mgt2026 {margin-top:20px !important} .subContWrap .mgl2426 {margin-left:24px !important} .subContWrap .mgl1025 {margin-left:10px !important} .subContWrap {position:relative;/* padding-top:30px */} .subContWrap .subContInner {padding:0 20px} .subContWrap .subContInner .subTit1 {margin-top:0;font-size:30px;font-weight:500;color:#222} .subContWrap .subTxt1 {margin-top:5px !important;font-size:14px} .subContWrap .copyBox {position:relative;margin-top:30px;padding-right:95px} .subContWrap .copyBox .copyTxt {position:relative;font-size:22px;font-weight:700;line-height:1.5;letter-spacing:-0.7px;z-index:1} .subContWrap .subCopyTxt {font-size:16px;font-weight:500} .subContWrap .copyBox .copyImg {position:absolute;right:0} .subContWrap .copyBox .copyImg.share1 {top:8px;width:83.5px;height:84.5px} .subContWrap .copyBox .copyImg.share4 {top:8px;width:110px;height:110px} .subContWrap .copyBox .copyImg.share5 {top:8px;width:125px;height:88.5px} .subContWrap .copyBox .copyImg.history1 {top:8px;width:158px;height:136px} .subContWrap .copyBox .copyImg.history2 {top:8px;width:130px;height:121px} .subContWrap .copyBox .copyImg.business1 {top:25px;width:103.5px;height:86px} .subContWrap .copyBox .copyImg.socialvalue {top:33px;width:101px;height:135.5px} .subContWrap .copyBox .copyImg.committee {top:10px;width:119.5px;height:143px} .subContWrap .copyBox.information1 {padding-right:130px} .subContWrap .copyBox.information1 .copyImg {top:7px;right:0;width:125px;height:90px} .subContWrap .copyBox.information2 {padding-right:155px} .subContWrap .copyBox.information2 .copyImg {top:7px;right:0;width:112px;height:100px} .subContWrap .imgContBox1 {margin-top:35px} .subContWrap .subDesc1 {margin-top:25px;position:relative;font-size:14px;color:#222;line-height:1.5} .subContWrap .copyBox + .subDesc1 {margin-top:30px} .subContWrap .subCopyTxt + .subDesc1.ty1 {margin-top:12px} .subContWrap .subDesc1.ty1 {margin-top:20px} .subContWrap .subDesc1 + .subDesc1 {margin-top:22px} .subContWrap .subDesc2 {margin-top:11px;font-size:12px} .subContWrap .subDesc3 {margin:8px 0 0 24px;font-size:14px;line-height:1.5} .subContWrap .imgTxtShareHead {margin-top:10px;text-align:right} .subContWrap .imgTxtShareHead img {width:138px} /* title */ .subContWrap .subTit2 {position:relative;margin:30px 0 0 0;padding-left:0;font-size:16px;font-weight:500;letter-spacing:-0.6px} .subContWrap .subTit2:before {display:none} .subContWrap .subTit2.bulSquare {padding-left:23px} .subContWrap .subTit2.bulSquare:before {content:'';display:block;position:absolute;left:0;top:6px;width:14px;height:14px;background:url('../images/bullet_big.png') no-repeat center / 100% auto} .subContWrap .subTit3 {position:relative;margin:23px 0 0 0;font-size:14px;font-weight:400} .subContWrap .subTit3.bulArr {padding-left:23px} .subContWrap p.subTit3.bulArr {color:#222;line-height:1.5} .subContWrap .subTit3.bulArr:before {content:'';display:block;position:absolute;left:0;top:5px;width:12px;height:12px;background:url('../images/bullet_small.png') no-repeat center / 100% auto} .subContWrap .subTit2 + p.subTit3 {margin-top:12px} .subContWrap .subTit2 + .dotList {margin-top:7px} .subContWrap p.subTit3 + .dotList {margin-top:8px} .subContWrap .dotList + p.subTit3 {margin-top:14px} .subContWrap .filterWrap {margin-top:43px;-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:space-between;-moz-justify-content:space-between;-ms-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;} .subContWrap .imgContBox2 {margin-top:15px} /* select */ .subContWrap .selectBox {display:inline-block;position:relative;z-index:1} .subContWrap .selectBox .btnSelect {position:relative;width:100%;height:27px;padding:0 20px 0 4px;color:#444;font-size:12px;font-weight:400;text-align:left;background:#fff;border:1px solid #ddd} .subContWrap .selectBox .btnSelect:after {content:'';display:block;position:absolute;right:7px;top:40%;transform:translateY(-50%) rotate(45deg);width:6px;height:6px;border:solid #303030;border-width:0 1px 1px 0} .subContWrap .selectBox.on .btnSelect {border-bottom-color:#fff} .subContWrap .selectBox.on .btnSelect:after {top:60%;transform:translateY(-50%) rotate(-135deg)} .subContWrap .selectBox .selectOption {display:none;position:absolute;top:27px;width:100%;border:solid #ddd;border-width:0 1px 1px 1px;background:#fff} .subContWrap .selectBox.on .selectOption {display:block} .subContWrap .selectBox .selectOption > li > button {padding:0 4px;width:100%;height:27px;color:#444;font-size:12px;text-align:left} .subContWrap .inpBox input {width:100%;height:27px;padding:0 4px 2px;color:#444;font-size:12px;border:1px solid #ddd} .subContWrap .inpSrch {position:relative;padding-right:48px} .subContWrap .inpSrch .btnSrch {position:absolute;right:0;top:0;width:43px;height:27px;color:#fff;font-size:12px;font-weight:500;background:#003586;border:1px solid #002763;border-radius:3px} .subContWrap .filterWrap .selectBox {width:28%} .subContWrap .filterWrap .inpSrch {width:calc(100% - 5px - 28%)} /* table col type */ .subContWrap .tblColTyp {margin-top:20px} .subContWrap .tblColTyp thead th {height:38px;font-size:14px;color:#222;font-weight:500;border-top:2px solid #003586;border-bottom:1px solid #e5e5e5;background:#f7f8f8} .subContWrap .tblColTyp thead th + th {border-left:1px solid #ddd} .subContWrap .tblColTyp tbody td {padding:10px;font-size:14px;color:#444;border-bottom:1px solid #e5e5e5} .subContWrap .tblColTyp tbody td + td {border-left:1px solid #ddd} .subContWrap .tblImgTit {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-align-items:center;-moz-align-items:center;-ms-align-items:center;-o-align-items:center;align-items:center;margin:0 -10px} .subContWrap .tblImgTit .img {margin-right:15px;width:100px;height:55px;overflow:hidden;background:#ddd} .subContWrap .tblImgTit .tit {width:calc(100% - 115px)} /* table col type2 */ .subContWrap .tblColTyp2 {margin-top:37px;border:solid #ddd;border-width:1px 0 1px 1px} .subContWrap .tblColTyp2 th {height:34px;color:#222;font-weight:400;background:#f5f5f5;border-top:1px solid #ddd} .subContWrap .tblColTyp2 th, .subContWrap .tblColTyp2 td {border-right:1px solid #ddd} .subContWrap .tblColTyp2 tr:first-of-type th {border-top:0} .subContWrap .tblColTyp2 td {min-height:34px;padding:6px 15px 7px;color:#444;border-top:1px solid #ddd} .subContWrap .tblColTyp2.tblSm {margin-top:12px} .subContWrap .tblColTyp2.tblSm th {padding:6px 10px 7px;font-size:12px} .subContWrap .tblColTyp2.tblSm td {padding:11px 12px 12px;font-size:12px;line-height:1.5} .subContWrap .tblColTyp2.tblSm + .bulRefer {margin-top:17px} /* table row type */ .subContWrap .tblRowTyp {margin-top:12px;border:1px solid #ddd} .subContWrap .tblRowTyp th:not(:first-child), .subContWrap .tblRowTyp td:not(:first-child) {border-left:1px solid #ddd} .subContWrap .tblRowTyp tr:not(:first-of-type) th, .subContWrap .tblRowTyp tr:not(:first-of-type) td {border-top:1px solid #ddd} .subContWrap .tblRowTyp th {padding:0 8px;color:#222;font-size:14px;font-weight:400;background:#f5f5f5;text-align:left;} .subContWrap .tblRowTyp.tblSm th {padding:10px 10px 13px;color:#222;font-size:12px;font-weight:500} .subContWrap .tblRowTyp.tblSm td {padding:10px 10px 13px;color:#444;font-size:12px} .subContWrap .tblRowTyp.tblSm .dotList {margin-top:6px} .subContWrap .tblRowTyp.tblSm .dotList.typSm > li + li {margin-top:2px} /* table col + row type */ .subContWrap .tblColRowTyp {margin-top:13px;border:1px solid #ddd} .subContWrap .tblColRowTyp thead th {padding:8px 0 10px;height:auto;font-size:12px;font-weight:500;color:#222;background:#f5f5f5} .subContWrap .tblColRowTyp thead th + th {border-left:1px solid #ddd} .subContWrap .tblColRowTyp tbody th, .subContWrap .tblColRowTyp tbody td {padding:10px;height:auto;font-size:12px;border-top:1px solid #ddd;background:#fff} .subContWrap .tblColRowTyp tbody th {color:#222;font-weight:500} .subContWrap .tblColRowTyp tbody th + td {border-left:1px solid #ddd} /* paging */ .subContWrap .paging {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;justify-content:center;margin-top:30px;color:#444;font-size:14px} .subContWrap .paging > a {margin:0 3px;width:25px;height:25px;border:1px solid #e5e5e5;border-radius:3px;} .subContWrap .paging > .first {background:url('../images/board_arrow_first.png') no-repeat center / 10px auto} .subContWrap .paging > .prev {background:url('../images/board_arrow_prev.png') no-repeat center / 6px auto} .subContWrap .paging > .next {background:url('../images/board_arrow_prev.png') no-repeat center / 6px auto;transform:rotate(180deg)} .subContWrap .paging > .last {background:url('../images/board_arrow_first.png') no-repeat center / 10px auto;transform:rotate(180deg)} .subContWrap .paging > .first.on {background:#137fd2 url('../images/board_arrow_first_white.png') no-repeat center / 10px auto} .subContWrap .paging > .prev.on {background:#137fd2 url('../images/board_arrow_prev_white.png') no-repeat center / 6px auto} .subContWrap .paging > .next.on {background:#137fd2 url('../images/board_arrow_prev_white.png') no-repeat center / 6px auto} .subContWrap .paging > .last.on {background:#137fd2 url('../images/board_arrow_first_white.png') tno-repeat center / 10px auto} .subContWrap .paging .pagingNum {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;} .subContWrap .paging .pagingNum li {margin:0 3px;} .subContWrap .paging .pagingNum li a {display:block;width:25px;height:25px;font-size:14px;color:#444;border:1px solid #e5e5e5;border-radius:3px;text-align:center;line-height:23px} .subContWrap .paging a.on {background:#137fd2;border-color:#0c6db8;color:#fff !important} /* bullet text */ .subContWrap .dotList {margin-left:4px;margin-top:12px} .subContWrap .dotList > li {position:relative;padding-left:20px} .subContWrap .dotList > li:before {content:'';display:block;position:absolute;left:0;top:9px;width:4px;height:4px;border-radius:50%;background:#666;line-height:1.5} .subContWrap .dotList > li + li {margin-top:15px} .subContWrap .dotList.typSm > li {padding-left:7px;font-size:12px} .subContWrap .dotList.typSm > li:before {top:9px;width:2px;height:2px;} .subContWrap .dotList.typSm > li + li {margin-top:18px} .subContWrap .dotList .dashList.typSm {margin-top:13px;margin-left:0} .subContWrap .dotList .dashList.typSm > li {line-height:1.5} .subContWrap .dotList .dashList.typSm > li:before {width:5px;top:9px} .subContWrap .dotList .dashList.typSm > li + li {margin-top:13px} .subContWrap .dashList {margin-top:10px} .subContWrap .dashList > li {position:relative;padding-left:7px;} .subContWrap .dashList > li:before {content:'';display:block;position:absolute;left:0;top:11px;width:4px;height:1px;background:#444} .subContWrap .dashList > li + li {margin-top:5px} .subContWrap .dashList.typSm {margin-top:3px;margin-left:3px} .subContWrap .dashList.typSm > li {padding-left:9px;font-size:12px} .subContWrap .dashList.typSm > li:before {width:4px;top:10px} .subContWrap .dashList.typSm > li + li {margin-top:0} .subContWrap .arrList {margin-left:3px;margin-top:13px} .subContWrap .arrList > li {position:relative;padding-left:20px;color:#222;line-height:1.5} .subContWrap .arrList > li:before {content:'';display:block;position:absolute;left:0;top:7px;width:4.5px;height:6.5px;background:url('../images/bullet_arrow_blue.png') no-repeat center / 100% auto} .subContWrap .arrList > li + li {margin-top:12px} .subContWrap .numList {margin-top:8px;} .subContWrap .numList li {position:relative;padding-left:14px} .subContWrap .numList li > span {position:absolute;left:0;top:0} .subContWrap .numList li + li {margin-top:5px} .subContWrap .circleNumList {margin-top:12px} .subContWrap .circleNumList > li {position:relative;padding-left:17px;color:#222} .subContWrap .circleNumList > li + li {margin-top:22px} .subContWrap .circleNumList > li > span {position:absolute;left:0;top:0} .subContWrap .circleNumList > li > .dashList {margin-top:6px;margin-left:-3px;color:#444} .subContWrap .circleNumList > li > .dashList > li + li {margin-top:6px} .subContWrap .bulRefer {position:relative;padding-left:15px} .subContWrap .bulRefer:before {content:'※';display:block;position:absolute;left:0;top:0} .subContWrap .bulRefer + .bulRefer {margin-top:5px} .subContWrap .bulRefer.typSm {font-size:12px} .subContWrap .bulStar {position:relative;padding-left:7px} .subContWrap .bulStar:before {content:'*';display:block;position:absolute;left:0;top:1px} /* button */ .subContWrap .btnListMore {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:space-between;-moz-justify-content:space-between;-ms-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;margin-top:20px;height:50px;border:1px solid #222;background:#444} .subContWrap .btnListMore .btnPrev {width:58px;height:48px;background:url('../images/icon_list_prev_w.png') no-repeat center / 28px auto} .subContWrap .btnListMore .btnNext {width:58px;height:48px;background:url('../images/icon_list_next_w.png') no-repeat center / 28px auto} .subContWrap .btnListMore .btnList {width:58px;height:48px;background:url('../images/icon_list_bar_w.png') no-repeat center / 25px auto} .subContWrap .btnArr {margin-top:16px;display:inline-block;height:27px;font-size:12px;line-height:24px;padding:0 16px 0 14px;border:1px solid #ddd;border-radius:20px;letter-spacing:-0.5px;white-space:nowrap} .subContWrap .btnArr:hover {color:#222} .subContWrap .btnArr span {padding-right:20px;position:relative} .subContWrap .btnArr span:after {content:'';display:block;position:absolute;right:0;top:53%;transform:translateY(-50%) rotate(45deg);width:6px;height:6px;border:solid #444;border-width:1px 1px 0 0;} .subContWrap .btnArr + .btnArr {margin-left:10px} .subContWrap .btnWrap.flex {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;justify-content:center;} .subContWrap .btnWrap.flex.flexR {-webkit-justify-content:flex-end;-ms-justify-content:flex-end;-o-justify-content:flex-end;-moz-justify-content:flex-end;justify-content:flex-end} .subContWrap .btnWrap.flex button + button {margin-left:10px} .subContWrap .btnType1 {padding:0 11px;height:32px;color:#222;font-size:14px;background:#ccc;border:1px solid #939393;border-radius:3px} .subContWrap .btnType2 {padding:0 11px;height:32px;color:#fff;font-size:14px;background:#003586;border:1px solid #002866;border-radius:3px} /* tab */ .subContWrap .tabWrap {margin-top:35px} .subContWrap .tabWrap .tabList {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;-moz-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;} .subContWrap .tabWrap .tabList > li {-webkit-flex:1;-ms-flex:1;-moz-flex:1;-o-flex:1;flex:1;-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;justify-content:center;-webkit-align-items:center;-moz-align-items:center;-ms-align-items:center;-o-align-items:center;align-items:center;border:1px solid #ddd;} .subContWrap .tabWrap .tabList > li + li {margin-left:-1px} .subContWrap .tabWrap .tabList > li + li.on {margin-left:0} .subContWrap .tabWrap .tabList a {width:100%;padding:4px 0 5px;font-size:12px;text-align:center;color:#222;word-break:break-all;white-space:normal} .subContWrap .tabWrap .tabList > li.on {background:#003586;border-color:#002866;z-index:1} .subContWrap .tabWrap .tabList > li.on a {color:#fff;font-weight:500} .subContWrap .tabCont {display:none;padding-top:27px} .subContWrap .tabCont.on {display:block} .subContWrap .tabWrap.ty3 .tabList > li {-webkit-flex:none;-moz-flex:none;-ms-flex:none;-o-flex:none;flex:none;width:50%;margin-top:-1px} .subContWrap .tabWrap.ty3 .tabList > li:nth-child(2n) {margin-left:-1px} .subContWrap .tabWrap.ty3 .tabList > li + li {margin-left:0} .subContWrap .tabWrap.ty4 {margin-top:20px} .subContWrap .tabWrap.ty4 .tabList {margin:1px -3px 0 1px} .subContWrap .tabWrap.ty4 .tabList > li {-webkit-flex:none;-moz-flex:none;-ms-flex:none;-o-flex:none;flex:none;width:33.33%;margin-top:-1px;margin-left:-1px} .subContWrap .tabWrap.ty4 .tabList > li + li.on {margin-left:-1px} .subContWrap .shareFundBox {margin-top:17px;padding:15px 10px 18px ;border:1px solid #ddd} .subContWrap .shareFundBox li {padding-left:105px;background-repeat:no-repeat;background-size:95px;background-position:left 5px} .subContWrap .shareFundBox li + li {margin-top:25px} .subContWrap .shareFundBox .fund01 {background-image:url('../images/img_share_fund01.png')} .subContWrap .shareFundBox .fund02 {background-image:url('../images/img_share_fund02.png')} .subContWrap .shareFundBox .tit {font-weight:500;color:#222} .subContWrap .shareFundBox .txt {margin-top:4px;color:#666} .subContWrap .shareFundBox .txt strong {font-weight:400} .subContWrap .download {color:#137fd2;font-weight:500} .subContWrap .download > a {color:#137fd2;font-weight:500} .subContWrap .boxGray {margin-top:34px;padding:15px 19px;color:#222;background:#f7f7f7;} .subContWrap .boxGray p {line-height:1.5} .subContWrap .boxGray + .subTit2 {margin-top:25px} /* 사회공헌 활동 */ .subContWrap .attachFile {padding-left:23px;background:url('../images/icon_file.png') no-repeat left 3px / 17.5px auto} .subContWrap .attachFile + .attachFile {margin-top:7px} .subContWrap .studyDetail {margin:5px 0} .subContWrap .studyDetail > li {padding-left:13px} .subContWrap .studyDetail > li:before {width:6px} .subContWrap .studyDetail > li + li {margin-top:8px} /* 인재채용 */ .subContWrap .imgRecruit1 {margin-top:25px} .subContWrap .imgRecruit2 {margin-top:17px} .subContWrap .imgRecruit3 {margin-top:17px} .subContWrap .imgRecruit4 {margin-top:37px} /* CI 소개 */ .subContWrap .imgCi1 {position:relative;margin-top:17px} .subContWrap .imgCi1 .btnArr {position:absolute;bottom:20px;left:50%;transform:translateX(-50%);margin-top:0} /* 캐릭터 소개 */ .subContWrap .imgCharacter1 {position:relative;margin-top:17px} .subContWrap .imgCharacter1 .btnArr {position:absolute;bottom:20px;left:50%;transform:translateX(-50%);margin-top:0} .subContWrap .characterList {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;-moz-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;-webkit-justify-content:space-between;-ms-justify-content:space-between;-moz-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;margin-top:2px} .subContWrap .characterList li {width:calc((100% - 15px) / 2);margin-top:15px} .subContWrap .characterList li > a {display:block} .subContWrap .characterList li > a img {display:block} /* 열린경영 - 경영정보 */ .subContWrap .txtName {margin-top:20px;font-size:12px;font-weight:500} .subContWrap .txtName strong {font-size:18px;color:#444;;font-weight:500} .subContWrap .roundBoxGray {margin-top:12px;padding:9px 15px 11px;background:#f5f5f5;border-radius:10px} .subContWrap .imgBusiness1 {margin-top:12px} .subContWrap .imgBusiness2 {margin-top:12px} .subContWrap .imgBusiness3 {margin-top:4px} .subContWrap .imgBusiness4 {margin-top:12px} .subContWrap .imgBusiness5 {margin-top:12px} .subContWrap .imgBusiness6 {margin-top:13px} .subContWrap .imgBusiness7 {margin-top:12px} .subContWrap .imgBusiness7 + .subTit3 {margin-top:35px} .subContWrap .roundBoxWhList {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;-moz-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;-webkit-justify-content:space-between;-ms-justify-content:space-between;-moz-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;} .subContWrap .roundBoxWh {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;-moz-flex-direction:column;-o-flex-direction:column;flex-direction:column;-webkit-justify-content:center;-ms-justify-content:center;-moz-justify-content:center;-o-justify-content:center;justify-content:center;margin-top:15px;width:100%;height:95px;padding:0 13px;border:1px solid #ddd;border-radius:10px} .subContWrap .roundBoxWh .tit {color:#222} .subContWrap .roundBoxWh .dotList {margin:6px 0 0 2px} .subContWrap .roundBoxWh .dotList > li {padding-left:8px} .subContWrap .roundBoxWh .dotList > li:before {top:8px;width:2px;height:2px} .subContWrap .roundBoxWhList.typ2 {margin-top:-3px} .subContWrap .roundBoxWhList.typ2 .roundBoxWh {width:calc((100% - 15px) / 2);height:60px;text-align:center} .subContWrap .roundBoxGray + .subTit2 {margin-top:24px} .subContWrap .subTit3.titBtn {display:inline-block} .subContWrap .subTit3.titBtn .btnDownload {position:absolute;right:-27px;top:-5px;padding:0;width:30px;height:30px;background:url('../images/icon_download_mo.png') no-repeat center / 14.5px auto} .subContWrap .subTitWrap {position:relative;margin-top:36px} .subContWrap .subTitWrap .selectBox {position:absolute;right:0;top:58%;transform:translateY(-50%)} .subContWrap .selYear {width:93px} .subContWrap .btnDownloadR {padding:0 44px 0 14px;height:27px;font-size:12px;color:#444;border:1px solid #ddd;border-radius:20px;letter-spacing:-1.2px;background:url('../images/icon_download_mo.png') no-repeat calc(100% - 15px) center / 14.5px auto} .subContWrap .btnDownloadR + .subTit2 {margin-top:15px} .subContWrap .faqList {margin-left:23px;margin-top:7px} .subContWrap .faqList > li {font-weight:500} .subContWrap .faqList > li .dashList > li {font-weight:400} .subContWrap .strategyList {margin:5px 0} .subContWrap .strategyList > li + li {margin-top:5px} .subContWrap .tblColRowTyp .dashList.typSm.mgt0 li {margin-top:0} /* 열린경영 - 경영공시 */ .subContWrap .bnrAlioList {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-justify-content:space-between;-ms-justify-content:space-between;-moz-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;margin-top:22px} .subContWrap .bnrAlioList .btnBnrAlio {width:calc((100% - 10px) / 2);height:35px} .subContWrap .bnrAlioList .btnBnrAlio img {width:100%} .subContWrap .listColTyp {margin-top:17px;} .subContWrap .listColTyp ul {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-moz-flex-wrap:wrap;-ms-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;border:solid #aaa;border-width:0 1px 1px 1px} .subContWrap .listColTyp ul li {display:table;width:50%;height:50px;text-align:center;border-top:1px solid #aaa;color:#222} .subContWrap .listColTyp ul li:nth-child(2n) {border-left:1px solid #aaa} .subContWrap .listColTyp ul li a {display:table-cell;vertical-align:middle;} .subContWrap .listColTyp ul li a:hover {color:#222} .subContWrap .listColTyp ul li:nth-child(4n + 1) {background:#f9fcff} .subContWrap .listColTyp ul li:nth-child(4n + 2) {background:#f9fcff} .subContWrap .tblColTyp2.tblSm.tblCsDay td {padding:12px 19px 13px} /* 정보공개 */ .subContWrap .imginformation1 {margin-top:17px} .subContWrap .adminTit {display:block;margin:0 10px} .subContWrap .tblColTyp tbody td.tblLinkTit {padding:0 20px;text-align:left} .subContWrap .btnUpLoad {margin-top:10px;width:67px;height:32px;color:#fff;font-size:14px;border-radius:3px;background:#003586;border:1px solid #002866} .subContWrap .filterWrap.selColWrap {display:block;margin-top:13px} .subContWrap .selecBoxWrap {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex} .subContWrap .selecBoxWrap .selectBox {width:calc((100% - 5px) / 2)} .subContWrap .selecBoxWrap .selectBox + .selectBox {margin-left:5px} .subContWrap .selecBoxWrap.col3 .selectBox {width:calc((100% - 10px) / 3)} .subContWrap .filterWrap.selColWrap .inpSrch {display:block;width:100%;margin-top:5px} .subContWrap [class^="graphBox"] {margin-top:15px;border:1px solid #ddd} /* .subContWrap .graphBox1 {height:232px} */ /* .subContWrap .graphBox1 #chart1 {padding: 15px 15px 15px 15px;} */ /* .subContWrap .graphDiv {display:flex; justify-content: space-between} .subContWrap .graphBox2 {width:430px} */ .subContWrap .graphBox2 #chart2 {padding-top: 10px;} /* .subContWrap .graphBox3 {width:430px} */ .subContWrap .graphBox3 #chart3 {padding-top: 10px;} .subContWrap .imgBnrBox {margin-top:17px} .subContWrap .imgBnrBox + .selColWrap {margin-top:40px} .subContWrap .iframArea {margin-top:40px} .subContWrap .tblSelWrap .selectBox {width:100%} .subContWrap .tblSelWrap .selectBox .btnSelect {height:30px;padding:0 30px 0 9px;font-size:14px} .subContWrap .tblSelWrap .selectBox .btnSelect:after {right:10px} .subContWrap .tblSelWrap .selectBox .selectOption > li > button {height:30px;font-size:14px;padding:0 9px} .subContWrap .tblInpBox input {padding:0 9px;width:100%;height:30px;border:1px solid #ddd;color:#444;font-weight:400} .subContWrap .tblEmailBox:after {content:'';display:block;clear:both;} .subContWrap .tblEmailBox input {padding:0 9px;height:30px;border:1px solid #ddd} .subContWrap .tblEmailBox input:first-of-type {width:calc(100% - 17px);} .subContWrap .tblEmailBox input:last-of-type {margin-top:5px;float:left;width:calc((100% - 5px) / 2);} .subContWrap .tblEmailBox .selectBox {margin-top:5px;float:right;width:calc((100% - 5px) / 2)} .subContWrap .tblTxtArea textarea {width:100%;height:150px;padding:9px;border:1px solid #ddd;font-size:14px;color:#444} .subContWrap .tblInpFile {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:space-between;-ms-justify-content:space-between;-o-justify-content:space-between;-moz-justify-content:space-between;justify-content:space-between;-webkit-align-items:center;-moz-align-items:center;-o-align-items:center;-ms-align-items:center;align-items:center;} .subContWrap .tblInpFile input {width:calc(100% - 67px)} .subContWrap .tblInpFile input[type="file"] {width:calc(100% - 100px)} .subContWrap .tblRowTyp input[type="text"]:read-only {background:#bbb} .subContWrap .tblInpFile .btnUpLoad {margin-top:0;width:72px;height:30px;font-size:12px;background:#137fd2;border-color:#0f6db6} .subContWrap .tblInpFile div .btnDel {margin-top:10px;margin-left:10px; width:66px;height:30px;font-size:12px;color:#fff;background:#555;border-radius:5px} .subContWrap .tblPw .inpTxt {display:none} .subContWrap .tblRowTyp.ty2 th, .subContWrap .tblRowTyp.ty2 td {padding:14px 10px 15px} .subContWrap .brdBtm {margin-bottom:15px;padding-bottom:10px;border-bottom:2px solid #003586} /* 설문조사 팝업 */ .subPopWrap {position:fixed;left:50%;top:50%;transform:translate(-50%, -50%);width:calc(100% - 40px);padding:0 0 15px 0;border:1px solid #aaa} .subPopWrap .popTit {padding:22px 0 23px;color:#222;font-size:14px;text-align:center;background:#f7f7f7} .subPopWrap .surveyWrap {margin:15px;padding:12px 14px 15px;height:70vh;overflow-y:auto;border:1px solid #d5d5d5} .subPopWrap .surveyWrap .surveyQ {padding-left:14px;position:relative;font-size:14px;color:#222} .subPopWrap .surveyWrap .surveyQ:not(:first-of-type) {margin-top:23px} .subPopWrap .surveyWrap .surveyQ span {position:absolute;left:0;top:0} .subPopWrap .surveyWrap .surveyA {margin:7px 14px} .subPopWrap .surveyWrap .surveyRdoList li + li {margin-top:7px} .subPopWrap .surveyWrap .rdoBox input[type="radio"] {border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px} .subPopWrap .surveyWrap .rdoBox input[type="radio"] + label {position:relative;display:block;padding-left:20px;font-size:14px;color:#444;} .subPopWrap .surveyWrap .rdoBox input[type="radio"] + label:before {content:'';display:block;position:absolute;left:0;top:3px;width:15px;height:15px;overflow:hidden;background:url('../images/icon_radio.png') no-repeat;background-position:0 0;background-size:100% auto} .subPopWrap .surveyWrap .rdoBox input[type="radio"]:checked + label:before {background-position:0 -15px} .subPopWrap .surveyWrap .surveyA .inpBox {margin-top:10px} @media all and (min-width:1024px) { .moShow {display:none !important} .pcShow {display:block !important} /* .subContWrap {padding-top:28px} */ .subContWrap .subContInner {padding:0} .subContWrap input::placeholder {color:#666} .subContWrap input:-webkit-input-placeholder {color:#666} .subContWrap input::-webkit-input-placeholder {color:#666} .subContWrap input::-moz-placeholder {color:#666} .subContWrap input:-moz-placeholder {color:#666} .subContWrap .mgt1020 {margin-top:20px !important} .subContWrap .mgt2540 {margin-top:40px !important} .subContWrap .mgt1530 {margin-top:30px !important} .subContWrap .mgt1855 {margin-top:55px !important} .subContWrap .mgt2026 {margin-top:26px !important} .subContWrap .mgt3552 {margin-top:52px !important} .subContWrap .mgt2035 {margin-top:35px !important} .subContWrap .mgt2555 {margin-top:55px !important} .subContWrap .mgl2426 {margin-left:26px !important} .subContWrap .mgt3040 {margin-top:40px !important} .subContWrap .pcMgt0 {margin-top:0px !important} .subContWrap .pcMgt10 {margin-top:10px !important} .subContWrap .pcMgt15 {margin-top:15px !important} .subContWrap .pcMgt20 {margin-top:20px !important} .subContWrap .pcMgt25 {margin-top:25px !important} .subContWrap .pcMgt30 {margin-top:15px !important} .subContWrap .pcFs18 {font-size:18px !important} .subContWrap .subContInner .subTit1 {font-size:40px} .subContWrap .subTxt1 {margin-top:1px;font-size:18px} .subContWrap .copyBox {margin-top:43px;padding-right:170px} .subContWrap .copyBox .copyTxt {font-size:30px;letter-spacing:-1px;} .subContWrap .subCopyTxt {font-size:30px} .subContWrap .copyBox .copyImg.share1 {top:-17px;width:167px;height:169px} .subContWrap .copyBox .copyImg.share4 {top:-57px;width:220px;height:220px} .subContWrap .copyBox .copyImg.share5 {top:-20 px;width:250px;height:177px} .subContWrap .copyBox .copyImg.history1 {top:7px;width:316px;height:272px} .subContWrap .copyBox .copyImg.history2 {top:8px;width:260px;height:242px} .subContWrap .copyBox .copyImg.business1 {top:8px;width:207px;height:172px} .subContWrap .copyBox .copyImg.socialvalue {top:-110px;width:202px;height:271px} .subContWrap .copyBox .copyImg.committee {top:-110px;width:239px;height:286px} .subContWrap .copyBox.information1 {padding-right:280px} .subContWrap .copyBox.information1 .copyImg {top:-33px;width:278px;height:200px} .subContWrap .copyBox.information2 {padding-right:235px} .subContWrap .copyBox.information2 .copyImg {top:7px;right:0;width:224px;height:200px} .subContWrap .imgContBox1 {margin-top:52px} .subContWrap .subDesc1 {margin-top:35px;font-size:18px} .subContWrap .copyBox + .subDesc1 {margin-top:48px} .subContWrap .subCopyTxt + .subDesc1.ty1 {margin-top:28px} .subContWrap .copyBox + .subDesc1.ty1 {margin-top:27px} .subContWrap .subDesc1 + .subDesc1 {margin-top:27px} .subContWrap .subDesc2 {font-size:18px} .subContWrap .subDesc3 {margin:10px 0 0 26px;font-size:18px} .subContWrap .imgTxtShareHead {margin-top:36px} .subContWrap .imgTxtShareHead img {width:276px} /* title */ .subContWrap .subTit2 {margin:46px 0 0 0;font-size:24px} .subContWrap .subTit2.bulSquare {padding-left:27px} .subContWrap .subTit2.bulSquare:before {top:10px;width:18px;height:18px} .subContWrap .subTit3 {margin:29px 0 0 0;font-size:20px} .subContWrap .subTit3.bulArr {padding-left:27px} .subContWrap p.subTit3.bulArr {line-height:1.4} .subContWrap .subTit3.bulArr:before {top:7px;width:16px;height:16px;} .subContWrap .subTit3.fzSm {font-size:18px} .subContWrap .subTit3.fzSm:before {top:5px} .subContWrap .subTit2 + p.subTit3 {margin-top:20px} .subContWrap .subTit2 + .dotList {margin-top:10px} .subContWrap .subTit2 + .dotList > li + li {margin-top:22px} .subContWrap p.subTit3 + .dotList {margin-top:11px} .subContWrap .dotList + p.subTit3 {margin-top:32px} .subContWrap .imgContBox2 {margin-top:34px} /* select */ .subContWrap .selectBox .btnSelect {padding:0 25px 2px 9px;height:32px;color:#666;font-size:14px} .subContWrap .selectBox .btnSelect:after {border-color:#555} .subContWrap .inpSrch {padding-right:73px} .subContWrap .inpBox input {padding:0 10px 2px;height:32px;color:#666;font-size:14px} .subContWrap .inpSrch .btnSrch {width:68px;height:32px;font-size:16px;font-weight:500;line-height:30px;border-radius:5px} .subContWrap .selectBox .btnSelect:after {width:6px;height:6px;right:10px;top:42%} .subContWrap .selectBox .selectOption > li > button {font-size:14px;color:#666;height:32px;padding:0 9px} .subContWrap .filterWrap {margin-top:53px;-webkit-justify-content:flex-end;-ms-justify-content:flex-end;-o-justify-content:flex-end;-moz-justify-content:flex-end;justify-content:flex-end;} .subContWrap .filterWrap .selectBox {width:103px} .subContWrap .filterWrap .selectBox2 {width:170px} .subContWrap .filterWrap .inpSrch {margin-left:5px;width:373px} /* table col type */ .subContWrap .tblColTyp thead th {height:44px;font-size:16px} .subContWrap .tblColTyp tbody td {padding:9px 0;font-size:16px;text-align:center} .subContWrap .tblImgTit {margin:0;padding:0 20px} .subContWrap .tblImgTit .img {margin-right:30px;width:140px;height:77px} .subContWrap .tblImgTit .tit {width:calc(100% - 170px);text-align:left} /* table col type2 */ .subContWrap .tblColTyp2.tblSm {margin-top:25px} .subContWrap .tblColTyp2.tblSm th {padding:11px 10px 12px ;font-size:16px} .subContWrap .tblColTyp2.tblSm td {padding:25px 19px 26px;font-size:16px} .subContWrap .tblColTyp2.tblSm + .bulRefer {margin-top:17px} /* table row type */ .subContWrap .tblRowTyp {margin-top:53px} .subContWrap .tblRowTyp.tblSm {margin-top:27px} .subContWrap .tblRowTyp th {padding:7px 10px 9px;height:auto;font-weight:400;font-size:16px;text-align:left} .subContWrap .tblRowTyp.tblSm th, .subContWrap .tblRowTyp.tblSm td {font-size:16px;padding:20px 19px 25px} .subContWrap .tblRowTyp td {padding:8px 10px} .subContWrap .tblRowTyp .dashList {margin:5px 0} .subContWrap .tblRowTyp.tblSm .dotList {margin-top:4px} .subContWrap .tblRowTyp.tblSm .dotList.typSm > li {line-height:1.5} .subContWrap .tblRowTyp.tblSm .dotList.typSm > li + li {margin-top:0} /* table col + row type */ .subContWrap .tblColRowTyp {margin-top:25px} .subContWrap .tblColRowTyp thead th {padding:11px 0 12px;font-size:16px} .subContWrap .tblColRowTyp tbody th, .subContWrap .tblColRowTyp tbody td {padding:24px 14px;font-size:16px;} [class^="tbl"] col.w88 {width:88px !important} [class^="tbl"] col.w90 {width:90px !important} [class^="tbl"] col.w105 {width:105px !important} [class^="tbl"] col.w110 {width:110px !important} [class^="tbl"] col.w130 {width:130px !important} [class^="tbl"] col.w135 {width:135px !important} [class^="tbl"] col.w150 {width:150px !important} [class^="tbl"] col.w160 {width:160px !important} [class^="tbl"] col.w170 {width:170px !important} [class^="tbl"] col.w180 {width:180px !important} [class^="tbl"] col.w240 {width:240px !important} [class^="tbl"] col.w250 {width:250px !important} [class^="tbl"] col.w260 {width:260px !important} [class^="tbl"] col.w355 {width:355px !important} /* bullet text */ .subContWrap .dotList {margin-left:6px;margin-top:10px} .subContWrap .dotList > li:before {top:12px} .subContWrap .dotList > li + li {margin-top:11px} .subContWrap .dotList.typSm > li {padding-left:8px;font-size:16px} .subContWrap .dotList.typSm > li:before {top:13px;width:3px;height:3px} .subContWrap .dotList.typSm > li + li {margin-top:22px} .subContWrap .dotList .dashList.typSm {margin-top:12px;margin-left:2px} .subContWrap .dotList .dashList.typSm > li {padding-left:15px;font-size:16px} .subContWrap .dotList .dashList.typSm > li:before {width:6px;top:12px} .subContWrap .dotList .dashList.typSm > li + li {margin-top:11px} .subContWrap .dashList {margin-left:2px} .subContWrap .dashList > li {padding-left:8px;} .subContWrap .dashList > li:before {top:15px;width:5px} .subContWrap .dashList > li + li {margin-top:6px} .subContWrap .dashList.typSm {margin-top:0;margin-left:5px} .subContWrap .dashList.typSm > li {padding-left:8px;font-size:16px} .subContWrap .dashList.typSm > li:before {width:5px;top:13px} .subContWrap .dashList.typSm > li + li {margin-top:0} .subContWrap .arrList {margin-left:4px;margin-top:27px} .subContWrap .arrList > li {padding-left:22px;} .subContWrap .arrList > li:before {top:10px;width:7px;height:10px;} .subContWrap .arrList > li + li {margin-top:30px} .subContWrap .numList {margin-top:11px} .subContWrap .numList li {padding-left:17px} .subContWrap .numList li + li {margin-top:6px} .subContWrap .circleNumList {margin-top:9px;margin-left:27px} .subContWrap .circleNumList > li {padding-left:23px} .subContWrap .circleNumList > li + li {margin-top:26px} .subContWrap .circleNumList > li > span {top:1px} .subContWrap .circleNumList > li > .dashList {margin-top:6px;margin-left:-3px;color:#444} .subContWrap .circleNumList > li > .dashList > li + li {margin-top:2px} .subContWrap .bulRefer {padding-left:20px;line-height:1.5} .subContWrap .bulRefer.typSm {font-size:16px} .subContWrap .bulStar {padding-left:10px;line-height:1.5} .subContWrap .bulStar:before {left:0;top:1px} /* paging */ .subContWrap .paging {margin-top:60px} .subContWrap .paging > a {width:31px;height:31px;background-size:auto 13px} .subContWrap .paging > .first {background-size:12px auto} .subContWrap .paging > .prev {background-size:7px auto} .subContWrap .paging > .next {background-size:7px auto} .subContWrap .paging > .last {background-size:12px auto} .subContWrap .paging .pagingNum li a {width:31px;height:31px;line-height:29px} /* button */ .subContWrap .btnArr {margin-top:20px;height:36px;font-size:16px;line-height:33px;padding:0 22px 0 20px;border:1px solid #d5d5d5;letter-spacing:-1px} .subContWrap .btnArr span {padding-right:25px} .subContWrap .btnArr span:after {width:7px;height:7px;border:solid #222;border-width:1px 1px 0 0;} .subContWrap .btnWrap .btnArr {margin-top:36px;letter-spacing:-0.7px;} .subContWrap .btnWrap .btnArr:hover {background-color: #137fd2;color: white;} .subContWrap .btnType1 {padding:0 15px;height:42px;font-size:18px;border-radius:5px} .subContWrap .btnType2 {padding:0 15px;height:42px;font-size:18px;border-radius:5px} /* tab */ .subContWrap .tabWrap {margin-top:53px} .subContWrap .tabWrap .tabList a {padding:7px 0 9px;font-size:16px;} .subContWrap .tabCont {padding-top:52px} .subContWrap .tabWrap.ty3 .tabList > li {width:33.33%} .subContWrap .tabWrap.ty3 .tabList > li:nth-child(2n + 1) {margin-left:-1px} .subContWrap .tabWrap.ty4 .tabList {margin:0 -5px 0 1px} .subContWrap .tabWrap.ty4 .tabList > li {margin-top:0;margin-left:-1px;width:calc(100% / 6)} .subContWrap .tabWrap.ty4 .tabList > li + li.on {margin-left:0} .subContWrap .tabWrap.ty4 .tabList > li.on {margin-left:0} .subContWrap .moreList {margin-top:20px;border:1px solid #ddd} .subContWrap .moreList li {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;height:40px;font-size:16px;} .subContWrap .moreList li + li {border-top:1px solid #ddd} .subContWrap .moreList li .tit {width:150px;color:#fff;background:#444;border-right:1px solid #ddd;text-align:center;line-height:38px} .subContWrap .moreList li .txt {width:calc(100% - 150px);padding:3px 10px;} .subContWrap .moreList li .txt a:hover {border-bottom:1px solid #444} .subContWrap .shareFundBox {margin-top:15px;padding:20px 50px 30px 20px} .subContWrap .shareFundBox li {padding-left:240px;background-size:190px;background-position:left 0;line-height:1.3} .subContWrap .shareFundBox li + li {margin-top:42px} .subContWrap .shareFundBox .txt {margin-top:9px;line-height:1.5} .subContWrap .shareFundBox .fund01 {padding:48px 0 30px 240px} .subContWrap .boxGray {margin-top:51px;padding:24px;text-align:center} .subContWrap .boxGray p {line-height:1.5} .subContWrap .boxGray + .subTit2 {margin-top:53px} /* 사회공헌 활동 */ .subContWrap .attachFile {padding-left:33px;background-size:25px auto;background-position:left 5px} .subContWrap .attachFile + .attachFile {margin-top:3px} .subContWrap .studyDetail > li {padding-left:15px} .subContWrap .studyDetail > li:before {width:6px;top:14px} .subContWrap .studyDetail > li + li {margin-top:10px} /* 인재채용 */ .subContWrap .imgRecruit1 {margin-top:35px} .subContWrap .imgRecruit4 {margin-top:53px} /* CI 소개 */ .subContWrap .imgCi1 {margin-top:15px} .subContWrap .imgCi1 .btnArr {bottom:40px} /* 캐릭터 소개 */ .subContWrap .imgCharacter1 {margin-top:15px} .subContWrap .imgCharacter1 .btnArr {bottom:40px} .subContWrap .characterList {margin-top:15px} .subContWrap .characterList li {width:calc((100% - 80px) / 3);margin-top:0} /* 열린경영 - 경영정보 */ .subContWrap .txtName {margin-top:40px;font-size:18px} .subContWrap .txtName strong {font-size:28px} .subContWrap .roundBoxGray {margin-top:16px;padding:8px 28px 9px;border-radius:15px} .subContWrap .imgBusiness1 {margin-top:12px} .subContWrap .imgBusiness2 {margin-top:25px} .subContWrap .imgBusiness3 {width:712px;margin:4px auto 0} .subContWrap .imgBusiness4 {margin-top:14px} .subContWrap .imgBusiness5 {margin-top:14px} .subContWrap .imgBusiness6 {margin-top:26px} .subContWrap .imgBusiness7 {margin-top:26px} .subContWrap .imgBusiness7 + .subTit3 {margin-top:60px} .subContWrap .roundBoxWhList {margin-top:-5px} .subContWrap .roundBoxWh {margin-top:20px;width:calc((100% - 20px) / 2);height:130px;padding:0 29px;border-radius:15px} .subContWrap .roundBoxWh .tit {color:#222} .subContWrap .roundBoxWh .dotList {margin:8px 0 0 2px} .subContWrap .roundBoxWh .dotList > li {padding-left:10px} .subContWrap .roundBoxWh .dotList > li:before {top:12px;width:4px;height:4px} .subContWrap .roundBoxWhList.typ2 {margin-top:-5px} .subContWrap .roundBoxWhList.typ2 .roundBoxWh {width:calc((100% - 60px) / 4);height:90px} .subContWrap .roundBoxWhList.typ2 .roundBoxWh p {line-height:1.4} .subContWrap .roundBoxWhList + .subTit3 {margin-top:53px} .subContWrap .roundBoxGray + .subTit2 {margin-top:53px} .subContWrap .subDesc2 + .btnWrap .btnArr {margin-top:14px} .subContWrap .subTit3.titBtn .btnDownload {right:-35px;top:0;width:30px;height:30px;background:url('../images/icon_download_pc.png') no-repeat center / 21px auto} .subContWrap .subTitWrap {margin-top:45px} .subContWrap .subTitWrap .selectBox {top:55%} .subContWrap .selYear {width:83px} .subContWrap .btnDownloadR {margin-top:8px;padding:0 60px 0 18px;height:36px;font-size:16px;letter-spacing:-1.5px;background:url('../images/icon_download_pc.png') no-repeat calc(100% - 20px) 7px / 21px auto} .subContWrap .btnDownloadR + .subTit2 {margin-top:32px} .subContWrap .faqList {margin-left:27px;margin-top:8px} .subContWrap .faqList > li {font-weight:500} .subContWrap .faqList > li .dashList > li {font-weight:400} .subContWrap .strategyList > li + li {margin-top:7px} .subContWrap .underLine {position:relative;display:inline-block} .subContWrap .underLine:before {content:'';display:block;position:absolute;bottom:-6px;width:100%;height:1px;background:#727272} /* 열린경영 - 경영공시 */ .subContWrap .bnrAlioList {margin-top:0;display:block;position:absolute;right:0;top:-120px} .subContWrap .bnrAlioList .btnBnrAlio {display:block;width:196px;height:60px} .subContWrap .bnrAlioList .btnBnrAlio + .btnBnrAlio {margin-top:10px} .subContWrap .bnrAlioList + .subTit2 {margin-top:70px} .subContWrap .listColTyp {margin-top:37px;padding:40px 19px;border:1px solid #ddd} .subContWrap .listColTyp ul li {width:25%;height:80px;} .subContWrap .listColTyp ul li:not(:nth-child(4n + 1)) {border-left:1px solid #aaa} .subContWrap .listColTyp ul li a {font-size:16px} .subContWrap .listColTyp ul li:nth-child(4n + 1) {background:#fff} .subContWrap .listColTyp ul li:nth-child(4n + 2) {background:#fff} .subContWrap .listColTyp ul li:nth-child(8n + 1) {background:#f9fcff} .subContWrap .listColTyp ul li:nth-child(8n + 2) {background:#f9fcff} .subContWrap .listColTyp ul li:nth-child(8n + 3) {background:#f9fcff} .subContWrap .listColTyp ul li:nth-child(8n + 4) {background:#f9fcff} /* 정보공개 */ .subContWrap .imginformation1 {margin-top:34px} .subContWrap .adminTit {margin:0 38px} .subContWrap .tblColTyp tbody td.tblLinkTit {padding:0 28px} .subContWrap .btnUpLoad {margin-top:20px;width:90px;height:42px;font-size:18px;border-radius:5px} .subContWrap .filterWrap.selColWrap {margin-top:8px;-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex} .subContWrap .selecBoxWrap {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex} .subContWrap .selecBoxWrap .selectBox:first-of-type {width:132px} .subContWrap .selecBoxWrap .selectBox:last-of-type {width:102px} .subContWrap .selecBoxWrap .selectBox + .selectBox {margin-left:5px} .subContWrap .selecBoxWrap.col3 .selectBox {width:82px} .subContWrap .selecBoxWrap.col3 .selectBox:last-of-type {width:105px} .subContWrap .filterWrap.selColWrap .inpSrch {margin-top:0;width:auto;margin-top:0} .subContWrap .filterWrap.selColWrap .inpSrch input {width:300px} /* .subContWrap .graphBox1 {height:342px} */ .subContWrap .graphBox1 #chart1 {padding: 15px 15px 15px 15px;} /* .subContWrap .graphBox2 {height:470px} */ .subContWrap .graphBox2 #chart2 {padding-top: 10px;} /* .subContWrap .graphBox3 {height:480px} */ .subContWrap .graphBox3 #chart3 {padding-top: 10px;} .subContWrap .imgBnrBox {margin-top:35px} .subContWrap .imgBnrBox + .selColWrap {margin-top:60px} .subContWrap .iframArea {margin-top:60px} .subContWrap .tblRowTyp.ty2 th, .subContWrap .tblRowTyp.ty2 td {padding:15px 20px;font-size:18px} .subContWrap .tblSelWrap .selectBox .btnSelect {height:50px;padding:0 40px 0 20px;font-size:16px;color:#444} .subContWrap .tblSelWrap .selectBox .btnSelect:after {right:23px;width:8px;height:8px} .subContWrap .tblSelWrap .selectBox .selectOption {top:50px} .subContWrap .tblSelWrap .selectBox .selectOption > li > button {padding:0 20px;height:50px;font-size:16px} .subContWrap .tblInpBox input {height:50px;padding:0 20px;font-size:16px} .subContWrap .tblEmailBox {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-align-items:center;-moz-align-items:center;-o-align-items:center;-ms-align-items:center;align-items:center;} .subContWrap .tblEmailBox input {padding:0 20px;margin-top:0 !important;width:252px !important;height:50px;font-size:16px} .subContWrap .tblEmailBox input:last-of-type {float:none} .subContWrap .tblEmailBox .emailDot {margin:0 10px;line-height:50px} .subContWrap .tblEmailBox .selectBox {float:none;margin-left:13px;margin-top:0;width:146px} .subContWrap .tblTxtArea textarea {height:170px;font-size:16px;padding:20px} .subContWrap .tblInpFile input {width:calc(100% - 104px)} .subContWrap .tblInpFile input[type="file"] {width:400px;} .subContWrap .tblInpFile .btnUpLoad {width:86px;height:42px;font-size:16px} .subContWrap .tblInpFile div .btnDel {margin-top:0;margin-left:10px; width:66px;height:30px;font-size:12px;color:#fff;background:#555;border-radius:5px} .subContWrap .tblPw input {width:220px} .subContWrap .tblPw .inpTxt {display:inline-block;margin-left:15px;color:#f24724} .subContWrap .tblRowTyp.ty2.tblData th, .subContWrap .tblRowTyp.ty2.tblData td {padding:27px 20px} .subContWrap .brdBtm {font-size:20px;padding-bottom:12px;margin:54px 0 20px} /* 설문조사 팝업 */ .subPopWrap {position:static;width:100%;padding:20px 0 40px;transform:none} .subPopWrap .popTit {padding:27px 0;font-size:18px} .subPopWrap .surveyWrap {margin:40px;padding:31px 39px;height:55vh} .subPopWrap .surveyWrap .surveyQ {padding-left:15px;font-size:16px} .subPopWrap .surveyWrap .surveyQ:not(:first-of-type) {margin-top:50px} .subPopWrap .surveyWrap .surveyQ span {position:absolute;left:0;top:0} .subPopWrap .surveyWrap .surveyA {margin:10px 16px} .subPopWrap .surveyWrap .surveyRdoList li + li {margin-top:15px} .subPopWrap .surveyWrap .rdoBox input[type="radio"] + label {padding-left:27px;font-size:16px} .subPopWrap .surveyWrap .rdoBox input[type="radio"] + label:before {top:4px;width:19px;height:19px} .subPopWrap .surveyWrap .rdoBox input[type="radio"]:checked + label:before {background-position:0 -19px} .subPopWrap .surveyWrap .surveyA .inpBox {margin-top:12px} .subPopWrap .surveyWrap .surveyA .inpBox input {height:36px} .subContWrap .graphDiv {display:flex; justify-content: space-between} .subContWrap .graphBox2 {width:430px} .subContWrap .graphBox3 {width:430px} } .subContWrap * {box-sizing:border-box;word-break:break-all;white-space:normal} .ir {overflow:hidden;display:block;position:absolute !important;left:0;top:0;z-index:-1;border:0;width:1px;height:1px;clip:rect(1px, 1px, 1px, 1px);text-indent:-9999px} .subContWrap input, textarea {-webkit-appearance:none;-webkit-border-radius:0;border-radius:0} .subContWrap a:hover {color:inherit} .moShow {display:block !important} .pcShow {display:none !important} .mainWrap * {box-sizing:border-box} .subContWrap img {margin:0} .subContWrap table {width:100%;table-layout:fixed} .subContWrap table th, .subContWrap table td {border-spacing:0;border-collapse:collapse;word-wrap:break-word;vertical-align:middle;border:0} .subContWrap caption {margin:0;width:0;height:0;text-indent:-9999px;} .subContWrap input::placeholder {color:#444;font-weight:300} .subContWrap input:-webkit-input-placeholder {color:#444;font-weight:300} .subContWrap input::-webkit-input-placeholder {color:#444;font-weight:300} .subContWrap input::-moz-placeholder {color:#444;font-weight:300} .subContWrap input:-moz-placeholder {color:#444;font-weight:300} .subContWrap .tc {text-align:center !important} .subContWrap .tr {text-align:right !important} .subContWrap .tl {text-align:left !important} .subContWrap .fcBk1 {color:#222 !important} .subContWrap .fcBk2 {color:#444 !important} .subContWrap .fcBl1 {color:#137fd2 !important} .subContWrap .fcBl2 {color:#003586 !important} .subContWrap .fcRd1 {color:#f24724 !important} .subContWrap .fw400 {font-weight:400 !important} .subContWrap .fw500 {font-weight:500 !important} .subContWrap .fs12 {font-size:12px !important} .subContWrap .fs18 {font-size:18px !important} .subContWrap .inrGap0 {padding-left:0 !important;padding-right:0 !important} .subContWrap .ellipsis {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .subContWrap .mgt0 {margin-top:0 !important} .subContWrap .mgt5 {margin-top:5px !important} .subContWrap .mgt10 {margin-top:10px !important} .subContWrap .mgt15 {margin-top:15px !important} .subContWrap .mgt20 {margin-top:20px !important} .subContWrap .mgt25 {margin-top:25px !important} .subContWrap .mgt35 {margin-top:35px !important} .subContWrap .mgt1020 {margin-top:10px !important} .subContWrap .mgt2540 {margin-top:25px !important} .subContWrap .mgt1530 {margin-top:15px !important} .subContWrap .mgt1855 {margin-top:18px !important} .subContWrap .mgt2035 {margin-top:20px !important} .subContWrap .mgt2555 {margin-top:25px !important} .subContWrap .mgt3040 {margin-top:30px !important} .subContWrap .mgt3552 {margin-top:35px !important} .subContWrap .mgt2026 {margin-top:20px !important} .subContWrap .mgl2426 {margin-left:24px !important} .subContWrap .mgl1025 {margin-left:10px !important} .subContWrap {position:relative;/* padding-top:30px */} .subContWrap .subContInner {padding:0 20px} .subContWrap .subContInner .subTit1 {margin-top:0;font-size:30px;font-weight:500;color:#222} .subContWrap .subTxt1 {margin-top:5px !important;font-size:14px} .subContWrap .copyBox {position:relative;margin-top:30px;padding-right:95px} .subContWrap .copyBox .copyTxt {position:relative;font-size:22px;font-weight:700;line-height:1.5;letter-spacing:-0.7px;z-index:1} .subContWrap .subCopyTxt {font-size:16px;font-weight:500} .subContWrap .copyBox .copyImg {position:absolute;right:0} .subContWrap .copyBox .copyImg.share1 {top:8px;width:83.5px;height:84.5px} .subContWrap .copyBox .copyImg.share4 {top:8px;width:110px;height:110px} .subContWrap .copyBox .copyImg.share5 {top:8px;width:125px;height:88.5px} .subContWrap .copyBox .copyImg.history1 {top:8px;width:158px;height:136px} .subContWrap .copyBox .copyImg.history2 {top:8px;width:130px;height:121px} .subContWrap .copyBox .copyImg.business1 {top:25px;width:103.5px;height:86px} .subContWrap .copyBox .copyImg.socialvalue {top:33px;width:101px;height:135.5px} .subContWrap .copyBox .copyImg.committee {top:10px;width:119.5px;height:143px} .subContWrap .copyBox.information1 {padding-right:130px} .subContWrap .copyBox.information1 .copyImg {top:7px;right:0;width:125px;height:90px} .subContWrap .copyBox.information2 {padding-right:155px} .subContWrap .copyBox.information2 .copyImg {top:7px;right:0;width:112px;height:100px} .subContWrap .imgContBox1 {margin-top:35px} .subContWrap .subDesc1 {margin-top:25px;position:relative;font-size:14px;color:#222;line-height:1.5} .subContWrap .copyBox + .subDesc1 {margin-top:30px} .subContWrap .subCopyTxt + .subDesc1.ty1 {margin-top:12px} .subContWrap .subDesc1.ty1 {margin-top:20px} .subContWrap .subDesc1 + .subDesc1 {margin-top:22px} .subContWrap .subDesc2 {margin-top:11px;font-size:12px} .subContWrap .subDesc3 {margin:8px 0 0 24px;font-size:14px;line-height:1.5} .subContWrap .imgTxtShareHead {margin-top:10px;text-align:right} .subContWrap .imgTxtShareHead img {width:138px} /* title */ .subContWrap .subTit2 {position:relative;margin:30px 0 0 0;padding-left:0;font-size:16px;font-weight:500;letter-spacing:-0.6px} .subContWrap .subTit2:before {display:none} .subContWrap .subTit2.bulSquare {padding-left:23px} .subContWrap .subTit2.bulSquare:before {content:'';display:block;position:absolute;left:0;top:6px;width:14px;height:14px;background:url('../images/bullet_big.png') no-repeat center / 100% auto} .subContWrap .subTit3 {position:relative;margin:23px 0 0 0;font-size:14px;font-weight:400} .subContWrap .subTit3.bulArr {padding-left:23px} .subContWrap p.subTit3.bulArr {color:#222;line-height:1.5} .subContWrap .subTit3.bulArr:before {content:'';display:block;position:absolute;left:0;top:5px;width:12px;height:12px;background:url('../images/bullet_small.png') no-repeat center / 100% auto} .subContWrap .subTit2 + p.subTit3 {margin-top:12px} .subContWrap .subTit2 + .dotList {margin-top:7px} .subContWrap p.subTit3 + .dotList {margin-top:8px} .subContWrap .dotList + p.subTit3 {margin-top:14px} .subContWrap .filterWrap {margin-top:43px;-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:space-between;-moz-justify-content:space-between;-ms-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;} .subContWrap .imgContBox2 {margin-top:15px} /* select */ .subContWrap .selectBox {display:inline-block;position:relative;z-index:1} .subContWrap .selectBox .btnSelect {position:relative;width:100%;height:27px;padding:0 20px 0 4px;color:#444;font-size:12px;font-weight:400;text-align:left;background:#fff;border:1px solid #ddd} .subContWrap .selectBox .btnSelect:after {content:'';display:block;position:absolute;right:7px;top:40%;transform:translateY(-50%) rotate(45deg);width:6px;height:6px;border:solid #303030;border-width:0 1px 1px 0} .subContWrap .selectBox.on .btnSelect {border-bottom-color:#fff} .subContWrap .selectBox.on .btnSelect:after {top:60%;transform:translateY(-50%) rotate(-135deg)} .subContWrap .selectBox .selectOption {display:none;position:absolute;top:27px;width:100%;border:solid #ddd;border-width:0 1px 1px 1px;background:#fff} .subContWrap .selectBox.on .selectOption {display:block} .subContWrap .selectBox .selectOption > li > button {padding:0 4px;width:100%;height:27px;color:#444;font-size:12px;text-align:left} .subContWrap .inpBox input {width:100%;height:27px;padding:0 4px 2px;color:#444;font-size:12px;border:1px solid #ddd} .subContWrap .inpSrch {position:relative;padding-right:48px} .subContWrap .inpSrch .btnSrch {position:absolute;right:0;top:0;width:43px;height:27px;color:#fff;font-size:12px;font-weight:500;background:#003586;border:1px solid #002763;border-radius:3px} .subContWrap .filterWrap .selectBox {width:28%} .subContWrap .filterWrap .inpSrch {width:calc(100% - 5px - 28%)} /* table col type */ .subContWrap .tblColTyp {margin-top:20px} .subContWrap .tblColTyp thead th {height:38px;font-size:14px;color:#222;font-weight:500;border-top:2px solid #003586;border-bottom:1px solid #e5e5e5;background:#f7f8f8} .subContWrap .tblColTyp thead th + th {border-left:1px solid #ddd} .subContWrap .tblColTyp tbody td {padding:10px;font-size:14px;color:#444;border-bottom:1px solid #e5e5e5} .subContWrap .tblColTyp tbody td + td {border-left:1px solid #ddd} .subContWrap .tblImgTit {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-align-items:center;-moz-align-items:center;-ms-align-items:center;-o-align-items:center;align-items:center;margin:0 -10px} .subContWrap .tblImgTit .img {margin-right:15px;width:100px;height:55px;overflow:hidden;background:#ddd} .subContWrap .tblImgTit .tit {width:calc(100% - 115px)} /* table col type2 */ .subContWrap .tblColTyp2 {margin-top:37px;border:solid #ddd;border-width:1px 0 1px 1px} .subContWrap .tblColTyp2 th {height:34px;color:#222;font-weight:400;background:#f5f5f5;border-top:1px solid #ddd} .subContWrap .tblColTyp2 th, .subContWrap .tblColTyp2 td {border-right:1px solid #ddd} .subContWrap .tblColTyp2 tr:first-of-type th {border-top:0} .subContWrap .tblColTyp2 td {min-height:34px;padding:6px 15px 7px;color:#444;border-top:1px solid #ddd} .subContWrap .tblColTyp2.tblSm {margin-top:12px} .subContWrap .tblColTyp2.tblSm th {padding:6px 10px 7px;font-size:12px} .subContWrap .tblColTyp2.tblSm td {padding:11px 12px 12px;font-size:12px;line-height:1.5} .subContWrap .tblColTyp2.tblSm + .bulRefer {margin-top:17px} /* table row type */ .subContWrap .tblRowTyp {margin-top:12px;border:1px solid #ddd} .subContWrap .tblRowTyp th:not(:first-child), .subContWrap .tblRowTyp td:not(:first-child) {border-left:1px solid #ddd} .subContWrap .tblRowTyp tr:not(:first-of-type) th, .subContWrap .tblRowTyp tr:not(:first-of-type) td {border-top:1px solid #ddd} .subContWrap .tblRowTyp th {padding:0 8px;color:#222;font-size:14px;font-weight:400;background:#f5f5f5;text-align:left;} .subContWrap .tblRowTyp.tblSm th {padding:10px 10px 13px;color:#222;font-size:12px;font-weight:500} .subContWrap .tblRowTyp.tblSm td {padding:10px 10px 13px;color:#444;font-size:12px} .subContWrap .tblRowTyp.tblSm .dotList {margin-top:6px} .subContWrap .tblRowTyp.tblSm .dotList.typSm > li + li {margin-top:2px} /* table col + row type */ .subContWrap .tblColRowTyp {margin-top:13px;border:1px solid #ddd} .subContWrap .tblColRowTyp thead th {padding:8px 0 10px;height:auto;font-size:12px;font-weight:500;color:#222;background:#f5f5f5} .subContWrap .tblColRowTyp thead th + th {border-left:1px solid #ddd} .subContWrap .tblColRowTyp tbody th, .subContWrap .tblColRowTyp tbody td {padding:10px;height:auto;font-size:12px;border-top:1px solid #ddd;background:#fff} .subContWrap .tblColRowTyp tbody th {color:#222;font-weight:500} .subContWrap .tblColRowTyp tbody th + td {border-left:1px solid #ddd} /* paging */ .subContWrap .paging {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;justify-content:center;margin-top:30px;color:#444;font-size:14px} .subContWrap .paging > a {margin:0 3px;width:25px;height:25px;border:1px solid #e5e5e5;border-radius:3px;} .subContWrap .paging > .first {background:url('../images/board_arrow_first.png') no-repeat center / 10px auto} .subContWrap .paging > .prev {background:url('../images/board_arrow_prev.png') no-repeat center / 6px auto} .subContWrap .paging > .next {background:url('../images/board_arrow_prev.png') no-repeat center / 6px auto;transform:rotate(180deg)} .subContWrap .paging > .last {background:url('../images/board_arrow_first.png') no-repeat center / 10px auto;transform:rotate(180deg)} .subContWrap .paging > .first.on {background:#137fd2 url('../images/board_arrow_first_white.png') no-repeat center / 10px auto} .subContWrap .paging > .prev.on {background:#137fd2 url('../images/board_arrow_prev_white.png') no-repeat center / 6px auto} .subContWrap .paging > .next.on {background:#137fd2 url('../images/board_arrow_prev_white.png') no-repeat center / 6px auto} .subContWrap .paging > .last.on {background:#137fd2 url('../images/board_arrow_first_white.png') tno-repeat center / 10px auto} .subContWrap .paging .pagingNum {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;} .subContWrap .paging .pagingNum li {margin:0 3px;} .subContWrap .paging .pagingNum li a {display:block;width:25px;height:25px;font-size:14px;color:#444;border:1px solid #e5e5e5;border-radius:3px;text-align:center;line-height:23px} .subContWrap .paging a.on {background:#137fd2;border-color:#0c6db8;color:#fff !important} /* bullet text */ .subContWrap .dotList {margin-left:4px;margin-top:12px} .subContWrap .dotList > li {position:relative;padding-left:20px} .subContWrap .dotList > li:before {content:'';display:block;position:absolute;left:0;top:9px;width:4px;height:4px;border-radius:50%;background:#666;line-height:1.5} .subContWrap .dotList > li + li {margin-top:15px} .subContWrap .dotList.typSm > li {padding-left:7px;font-size:12px} .subContWrap .dotList.typSm > li:before {top:9px;width:2px;height:2px;} .subContWrap .dotList.typSm > li + li {margin-top:18px} .subContWrap .dotList .dashList.typSm {margin-top:13px;margin-left:0} .subContWrap .dotList .dashList.typSm > li {line-height:1.5} .subContWrap .dotList .dashList.typSm > li:before {width:5px;top:9px} .subContWrap .dotList .dashList.typSm > li + li {margin-top:13px} .subContWrap .dashList {margin-top:10px} .subContWrap .dashList > li {position:relative;padding-left:7px;} .subContWrap .dashList > li:before {content:'';display:block;position:absolute;left:0;top:11px;width:4px;height:1px;background:#444} .subContWrap .dashList > li + li {margin-top:5px} .subContWrap .dashList.typSm {margin-top:3px;margin-left:3px} .subContWrap .dashList.typSm > li {padding-left:9px;font-size:12px} .subContWrap .dashList.typSm > li:before {width:4px;top:10px} .subContWrap .dashList.typSm > li + li {margin-top:0} .subContWrap .arrList {margin-left:3px;margin-top:13px} .subContWrap .arrList > li {position:relative;padding-left:20px;color:#222;line-height:1.5} .subContWrap .arrList > li:before {content:'';display:block;position:absolute;left:0;top:7px;width:4.5px;height:6.5px;background:url('../images/bullet_arrow_blue.png') no-repeat center / 100% auto} .subContWrap .arrList > li + li {margin-top:12px} .subContWrap .numList {margin-top:8px;} .subContWrap .numList li {position:relative;padding-left:14px} .subContWrap .numList li > span {position:absolute;left:0;top:0} .subContWrap .numList li + li {margin-top:5px} .subContWrap .circleNumList {margin-top:12px} .subContWrap .circleNumList > li {position:relative;padding-left:17px;color:#222} .subContWrap .circleNumList > li + li {margin-top:22px} .subContWrap .circleNumList > li > span {position:absolute;left:0;top:0} .subContWrap .circleNumList > li > .dashList {margin-top:6px;margin-left:-3px;color:#444} .subContWrap .circleNumList > li > .dashList > li + li {margin-top:6px} .subContWrap .bulRefer {position:relative;padding-left:15px} .subContWrap .bulRefer:before {content:'※';display:block;position:absolute;left:0;top:0} .subContWrap .bulRefer + .bulRefer {margin-top:5px} .subContWrap .bulRefer.typSm {font-size:12px} .subContWrap .bulStar {position:relative;padding-left:7px} .subContWrap .bulStar:before {content:'*';display:block;position:absolute;left:0;top:1px} /* button */ .subContWrap .btnListMore {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:space-between;-moz-justify-content:space-between;-ms-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;margin-top:20px;height:50px;border:1px solid #222;background:#444} .subContWrap .btnListMore .btnPrev {width:58px;height:48px;background:url('../images/icon_list_prev_w.png') no-repeat center / 28px auto} .subContWrap .btnListMore .btnNext {width:58px;height:48px;background:url('../images/icon_list_next_w.png') no-repeat center / 28px auto} .subContWrap .btnListMore .btnList {width:58px;height:48px;background:url('../images/icon_list_bar_w.png') no-repeat center / 25px auto} .subContWrap .btnArr {margin-top:16px;display:inline-block;height:27px;font-size:12px;line-height:24px;padding:0 16px 0 14px;border:1px solid #ddd;border-radius:20px;letter-spacing:-0.5px;white-space:nowrap} .subContWrap .btnArr:hover {color:#222} .subContWrap .btnArr span {padding-right:20px;position:relative} .subContWrap .btnArr span:after {content:'';display:block;position:absolute;right:0;top:53%;transform:translateY(-50%) rotate(45deg);width:6px;height:6px;border:solid #444;border-width:1px 1px 0 0;} .subContWrap .btnArr + .btnArr {margin-left:10px} .subContWrap .btnWrap.flex {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;justify-content:center;} .subContWrap .btnWrap.flex.flexR {-webkit-justify-content:flex-end;-ms-justify-content:flex-end;-o-justify-content:flex-end;-moz-justify-content:flex-end;justify-content:flex-end} .subContWrap .btnWrap.flex button + button {margin-left:10px} .subContWrap .btnType1 {padding:0 11px;height:32px;color:#222;font-size:14px;background:#ccc;border:1px solid #939393;border-radius:3px} .subContWrap .btnType2 {padding:0 11px;height:32px;color:#fff;font-size:14px;background:#003586;border:1px solid #002866;border-radius:3px} /* tab */ .subContWrap .tabWrap {margin-top:35px} .subContWrap .tabWrap .tabList {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;-moz-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;} .subContWrap .tabWrap .tabList > li {-webkit-flex:1;-ms-flex:1;-moz-flex:1;-o-flex:1;flex:1;-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;justify-content:center;-webkit-align-items:center;-moz-align-items:center;-ms-align-items:center;-o-align-items:center;align-items:center;border:1px solid #ddd;} .subContWrap .tabWrap .tabList > li + li {margin-left:-1px} .subContWrap .tabWrap .tabList > li + li.on {margin-left:0} .subContWrap .tabWrap .tabList a {width:100%;padding:4px 0 5px;font-size:12px;text-align:center;color:#222;word-break:break-all;white-space:normal} .subContWrap .tabWrap .tabList > li.on {background:#003586;border-color:#002866;z-index:1} .subContWrap .tabWrap .tabList > li.on a {color:#fff;font-weight:500} .subContWrap .tabCont {display:none;padding-top:27px} .subContWrap .tabCont.on {display:block} .subContWrap .tabWrap.ty3 .tabList > li {-webkit-flex:none;-moz-flex:none;-ms-flex:none;-o-flex:none;flex:none;width:50%;margin-top:-1px} .subContWrap .tabWrap.ty3 .tabList > li:nth-child(2n) {margin-left:-1px} .subContWrap .tabWrap.ty3 .tabList > li + li {margin-left:0} .subContWrap .tabWrap.ty4 {margin-top:20px} .subContWrap .tabWrap.ty4 .tabList {margin:1px -3px 0 1px} .subContWrap .tabWrap.ty4 .tabList > li {-webkit-flex:none;-moz-flex:none;-ms-flex:none;-o-flex:none;flex:none;width:33.33%;margin-top:-1px;margin-left:-1px} .subContWrap .tabWrap.ty4 .tabList > li + li.on {margin-left:-1px} .subContWrap .shareFundBox {margin-top:17px;padding:15px 10px 18px ;border:1px solid #ddd} .subContWrap .shareFundBox li {padding-left:105px;background-repeat:no-repeat;background-size:95px;background-position:left 5px} .subContWrap .shareFundBox li + li {margin-top:25px} .subContWrap .shareFundBox .fund01 {background-image:url('../images/img_share_fund01.png')} .subContWrap .shareFundBox .fund02 {background-image:url('../images/img_share_fund02.png')} .subContWrap .shareFundBox .tit {font-weight:500;color:#222} .subContWrap .shareFundBox .txt {margin-top:4px;color:#666} .subContWrap .shareFundBox .txt strong {font-weight:400} .subContWrap .download {color:#137fd2;font-weight:500} .subContWrap .download > a{color:#137fd2;font-weight:500} .subContWrap .boxGray {margin-top:34px;padding:15px 19px;color:#222;background:#f7f7f7;} .subContWrap .boxGray p {line-height:1.5} .subContWrap .boxGray + .subTit2 {margin-top:25px} /* 사회공헌 활동 */ .subContWrap .attachFile {padding-left:23px;background:url('../images/icon_file.png') no-repeat left 3px / 17.5px auto} .subContWrap .attachFile + .attachFile {margin-top:7px} .subContWrap .studyDetail {margin:5px 0} .subContWrap .studyDetail > li {padding-left:13px} .subContWrap .studyDetail > li:before {width:6px} .subContWrap .studyDetail > li + li {margin-top:8px} /* 인재채용 */ .subContWrap .imgRecruit1 {margin-top:25px} .subContWrap .imgRecruit2 {margin-top:17px} .subContWrap .imgRecruit3 {margin-top:17px} .subContWrap .imgRecruit4 {margin-top:37px} /* CI 소개 */ .subContWrap .imgCi1 {position:relative;margin-top:17px} .subContWrap .imgCi1 .btnArr {position:absolute;bottom:20px;left:50%;transform:translateX(-50%);margin-top:0} /* 캐릭터 소개 */ .subContWrap .imgCharacter1 {position:relative;margin-top:17px} .subContWrap .imgCharacter1 .btnArr {position:absolute;bottom:20px;left:50%;transform:translateX(-50%);margin-top:0} .subContWrap .characterList {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;-moz-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;-webkit-justify-content:space-between;-ms-justify-content:space-between;-moz-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;margin-top:2px} .subContWrap .characterList li {width:calc((100% - 15px) / 2);margin-top:15px} .subContWrap .characterList li > a {display:block} .subContWrap .characterList li > a img {display:block} /* 열린경영 - 경영정보 */ .subContWrap .txtName {margin-top:20px;font-size:12px;font-weight:500} .subContWrap .txtName strong {font-size:18px;color:#444;;font-weight:500} .subContWrap .roundBoxGray {margin-top:12px;padding:9px 15px 11px;background:#f5f5f5;border-radius:10px} .subContWrap .imgBusiness1 {margin-top:12px} .subContWrap .imgBusiness2 {margin-top:12px} .subContWrap .imgBusiness3 {margin-top:4px} .subContWrap .imgBusiness4 {margin-top:12px} .subContWrap .imgBusiness5 {margin-top:12px} .subContWrap .imgBusiness6 {margin-top:13px} .subContWrap .imgBusiness7 {margin-top:12px} .subContWrap .imgBusiness7 + .subTit3 {margin-top:35px} .subContWrap .roundBoxWhList {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;-moz-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;-webkit-justify-content:space-between;-ms-justify-content:space-between;-moz-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;} .subContWrap .roundBoxWh {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;-moz-flex-direction:column;-o-flex-direction:column;flex-direction:column;-webkit-justify-content:center;-ms-justify-content:center;-moz-justify-content:center;-o-justify-content:center;justify-content:center;margin-top:15px;width:100%;height:95px;padding:0 13px;border:1px solid #ddd;border-radius:10px} .subContWrap .roundBoxWh .tit {color:#222} .subContWrap .roundBoxWh .dotList {margin:6px 0 0 2px} .subContWrap .roundBoxWh .dotList > li {padding-left:8px} .subContWrap .roundBoxWh .dotList > li:before {top:8px;width:2px;height:2px} .subContWrap .roundBoxWhList.typ2 {margin-top:-3px} .subContWrap .roundBoxWhList.typ2 .roundBoxWh {width:calc((100% - 15px) / 2);height:60px;text-align:center} .subContWrap .roundBoxGray + .subTit2 {margin-top:24px} .subContWrap .subTit3.titBtn {display:inline-block} .subContWrap .subTit3.titBtn .btnDownload {position:absolute;right:-27px;top:-5px;padding:0;width:30px;height:30px;background:url('../images/icon_download_mo.png') no-repeat center / 14.5px auto} .subContWrap .subTitWrap {position:relative;margin-top:36px} .subContWrap .subTitWrap .selectBox {position:absolute;right:0;top:58%;transform:translateY(-50%)} .subContWrap .selYear {width:93px} .subContWrap .btnDownloadR {padding:0 44px 0 14px;height:27px;font-size:12px;color:#444;border:1px solid #ddd;border-radius:20px;letter-spacing:-1.2px;background:url('../images/icon_download_mo.png') no-repeat calc(100% - 15px) center / 14.5px auto} .subContWrap .btnDownloadR + .subTit2 {margin-top:15px} .subContWrap .faqList {margin-left:23px;margin-top:7px} .subContWrap .faqList > li {font-weight:500} .subContWrap .faqList > li .dashList > li {font-weight:400} .subContWrap .strategyList {margin:5px 0} .subContWrap .strategyList > li + li {margin-top:5px} .subContWrap .tblColRowTyp .dashList.typSm.mgt0 li {margin-top:0} /* 열린경영 - 경영공시 */ .subContWrap .bnrAlioList {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-justify-content:space-between;-ms-justify-content:space-between;-moz-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;margin-top:22px} .subContWrap .bnrAlioList .btnBnrAlio {width:calc((100% - 10px) / 2);height:35px} .subContWrap .bnrAlioList .btnBnrAlio img {width:100%} .subContWrap .listColTyp {margin-top:17px;} .subContWrap .listColTyp ul {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-moz-flex-wrap:wrap;-ms-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;border:solid #aaa;border-width:0 1px 1px 1px} .subContWrap .listColTyp ul li {display:table;width:50%;height:50px;text-align:center;border-top:1px solid #aaa;color:#222} .subContWrap .listColTyp ul li:nth-child(2n) {border-left:1px solid #aaa} .subContWrap .listColTyp ul li a {display:table-cell;vertical-align:middle;} .subContWrap .listColTyp ul li a:hover {color:#222} .subContWrap .listColTyp ul li:nth-child(4n + 1) {background:#f9fcff} .subContWrap .listColTyp ul li:nth-child(4n + 2) {background:#f9fcff} .subContWrap .tblColTyp2.tblSm.tblCsDay td {padding:12px 19px 13px} /* 정보공개 */ .subContWrap .imginformation1 {margin-top:17px} .subContWrap .adminTit {display:block;margin:0 10px} .subContWrap .tblColTyp tbody td.tblLinkTit {padding:0 20px;text-align:left} .subContWrap .btnUpLoad {margin-top:10px;width:67px;height:32px;color:#fff;font-size:14px;border-radius:3px;background:#003586;border:1px solid #002866} .subContWrap .filterWrap.selColWrap {display:block;margin-top:13px} .subContWrap .selecBoxWrap {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex} .subContWrap .selecBoxWrap .selectBox {width:calc((100% - 5px) / 2)} .subContWrap .selecBoxWrap .selectBox + .selectBox {margin-left:5px} .subContWrap .selecBoxWrap.col3 .selectBox {width:calc((100% - 10px) / 3)} .subContWrap .filterWrap.selColWrap .inpSrch {display:block;width:100%;margin-top:5px} .subContWrap [class^="graphBox"] {margin-top:15px;border:1px solid #ddd} /* .subContWrap .graphBox1 {height:232px} */ /* .subContWrap .graphBox1 #chart1 {padding: 15px 15px 15px 15px;} */ /* .subContWrap .graphDiv {display:flex; justify-content: space-between} .subContWrap .graphBox2 {width:430px} */ .subContWrap .graphBox2 #chart2 {padding-top: 10px;} /* .subContWrap .graphBox3 {width:430px} */ .subContWrap .graphBox3 #chart3 {padding-top: 10px;} .subContWrap .imgBnrBox {margin-top:17px} .subContWrap .imgBnrBox + .selColWrap {margin-top:40px} .subContWrap .iframArea {margin-top:40px} .subContWrap .tblSelWrap .selectBox {width:100%} .subContWrap .tblSelWrap .selectBox .btnSelect {height:30px;padding:0 30px 0 9px;font-size:14px} .subContWrap .tblSelWrap .selectBox .btnSelect:after {right:10px} .subContWrap .tblSelWrap .selectBox .selectOption > li > button {height:30px;font-size:14px;padding:0 9px} .subContWrap .tblInpBox input {padding:0 9px;width:100%;height:30px;border:1px solid #ddd;color:#444;font-weight:400} .subContWrap .tblEmailBox:after {content:'';display:block;clear:both;} .subContWrap .tblEmailBox input {padding:0 9px;height:30px;border:1px solid #ddd} .subContWrap .tblEmailBox input:first-of-type {width:calc(100% - 17px);} .subContWrap .tblEmailBox input:last-of-type {margin-top:5px;float:left;width:calc((100% - 5px) / 2);} .subContWrap .tblEmailBox .selectBox {margin-top:5px;float:right;width:calc((100% - 5px) / 2)} .subContWrap .tblTxtArea textarea {width:100%;height:150px;padding:9px;border:1px solid #ddd;font-size:14px;color:#444} .subContWrap .tblInpFile {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:space-between;-ms-justify-content:space-between;-o-justify-content:space-between;-moz-justify-content:space-between;justify-content:space-between;-webkit-align-items:center;-moz-align-items:center;-o-align-items:center;-ms-align-items:center;align-items:center;} .subContWrap .tblInpFile input {width:calc(100% - 67px)} .subContWrap .tblInpFile input[type="file"] {width:calc(100% - 100px)} .subContWrap .tblRowTyp input[type="text"]:read-only {background:#bbb} .subContWrap .tblInpFile .btnUpLoad {margin-top:0;width:72px;height:30px;font-size:12px;background:#137fd2;border-color:#0f6db6} .subContWrap .tblInpFile div .btnDel {margin-top:10px;margin-left:10px; width:66px;height:30px;font-size:12px;color:#fff;background:#555;border-radius:5px} .subContWrap .tblPw .inpTxt {display:none} .subContWrap .tblRowTyp.ty2 th, .subContWrap .tblRowTyp.ty2 td {padding:14px 10px 15px} .subContWrap .brdBtm {margin-bottom:15px;padding-bottom:10px;border-bottom:2px solid #003586} /* 설문조사 팝업 */ .subPopWrap {position:fixed;left:50%;top:50%;transform:translate(-50%, -50%);width:calc(100% - 40px);padding:0 0 15px 0;border:1px solid #aaa} .subPopWrap .popTit {padding:22px 0 23px;color:#222;font-size:14px;text-align:center;background:#f7f7f7} .subPopWrap .surveyWrap {margin:15px;padding:12px 14px 15px;height:70vh;overflow-y:auto;border:1px solid #d5d5d5} .subPopWrap .surveyWrap .surveyQ {padding-left:14px;position:relative;font-size:14px;color:#222} .subPopWrap .surveyWrap .surveyQ:not(:first-of-type) {margin-top:23px} .subPopWrap .surveyWrap .surveyQ span {position:absolute;left:0;top:0} .subPopWrap .surveyWrap .surveyA {margin:7px 14px} .subPopWrap .surveyWrap .surveyRdoList li + li {margin-top:7px} .subPopWrap .surveyWrap .rdoBox input[type="radio"] {border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px} .subPopWrap .surveyWrap .rdoBox input[type="radio"] + label {position:relative;display:block;padding-left:20px;font-size:14px;color:#444;} .subPopWrap .surveyWrap .rdoBox input[type="radio"] + label:before {content:'';display:block;position:absolute;left:0;top:3px;width:15px;height:15px;overflow:hidden;background:url('../images/icon_radio.png') no-repeat;background-position:0 0;background-size:100% auto} .subPopWrap .surveyWrap .rdoBox input[type="radio"]:checked + label:before {background-position:0 -15px} .subPopWrap .surveyWrap .surveyA .inpBox {margin-top:10px} @media all and (min-width:1024px) { .moShow {display:none !important} .pcShow {display:block !important} /* .subContWrap {padding-top:28px} */ .subContWrap .subContInner {padding:0} .subContWrap input::placeholder {color:#666} .subContWrap input:-webkit-input-placeholder {color:#666} .subContWrap input::-webkit-input-placeholder {color:#666} .subContWrap input::-moz-placeholder {color:#666} .subContWrap input:-moz-placeholder {color:#666} .subContWrap .mgt1020 {margin-top:20px !important} .subContWrap .mgt2540 {margin-top:40px !important} .subContWrap .mgt1530 {margin-top:30px !important} .subContWrap .mgt1855 {margin-top:55px !important} .subContWrap .mgt2026 {margin-top:26px !important} .subContWrap .mgt3552 {margin-top:52px !important} .subContWrap .mgt2035 {margin-top:35px !important} .subContWrap .mgt2555 {margin-top:55px !important} .subContWrap .mgl2426 {margin-left:26px !important} .subContWrap .mgt3040 {margin-top:40px !important} .subContWrap .pcMgt0 {margin-top:0px !important} .subContWrap .pcMgt10 {margin-top:10px !important} .subContWrap .pcMgt15 {margin-top:15px !important} .subContWrap .pcMgt20 {margin-top:20px !important} .subContWrap .pcMgt25 {margin-top:25px !important} .subContWrap .pcMgt30 {margin-top:15px !important} .subContWrap .pcFs18 {font-size:18px !important} .subContWrap .subContInner .subTit1 {font-size:40px} .subContWrap .subTxt1 {margin-top:1px;font-size:18px} .subContWrap .copyBox {margin-top:43px;padding-right:170px} .subContWrap .copyBox .copyTxt {font-size:30px;letter-spacing:-1px;} .subContWrap .subCopyTxt {font-size:30px} .subContWrap .copyBox .copyImg.share1 {top:-17px;width:167px;height:169px} .subContWrap .copyBox .copyImg.share4 {top:-57px;width:220px;height:220px} .subContWrap .copyBox .copyImg.share5 {top:-20 px;width:250px;height:177px} .subContWrap .copyBox .copyImg.history1 {top:7px;width:316px;height:272px} .subContWrap .copyBox .copyImg.history2 {top:8px;width:260px;height:242px} .subContWrap .copyBox .copyImg.business1 {top:8px;width:207px;height:172px} .subContWrap .copyBox .copyImg.socialvalue {top:-110px;width:202px;height:271px} .subContWrap .copyBox .copyImg.committee {top:-110px;width:239px;height:286px} .subContWrap .copyBox.information1 {padding-right:280px} .subContWrap .copyBox.information1 .copyImg {top:-33px;width:278px;height:200px} .subContWrap .copyBox.information2 {padding-right:235px} .subContWrap .copyBox.information2 .copyImg {top:7px;right:0;width:224px;height:200px} .subContWrap .imgContBox1 {margin-top:52px} .subContWrap .subDesc1 {margin-top:35px;font-size:18px} .subContWrap .copyBox + .subDesc1 {margin-top:48px} .subContWrap .subCopyTxt + .subDesc1.ty1 {margin-top:28px} .subContWrap .copyBox + .subDesc1.ty1 {margin-top:27px} .subContWrap .subDesc1 + .subDesc1 {margin-top:27px} .subContWrap .subDesc2 {font-size:18px} .subContWrap .subDesc3 {margin:10px 0 0 26px;font-size:18px} .subContWrap .imgTxtShareHead {margin-top:36px} .subContWrap .imgTxtShareHead img {width:276px} /* title */ .subContWrap .subTit2 {margin:46px 0 0 0;font-size:24px} .subContWrap .subTit2.bulSquare {padding-left:27px} .subContWrap .subTit2.bulSquare:before {top:10px;width:18px;height:18px} .subContWrap .subTit3 {margin:29px 0 0 0;font-size:20px} .subContWrap .subTit3.bulArr {padding-left:27px} .subContWrap p.subTit3.bulArr {line-height:1.4} .subContWrap .subTit3.bulArr:before {top:7px;width:16px;height:16px;} .subContWrap .subTit3.fzSm {font-size:18px} .subContWrap .subTit3.fzSm:before {top:5px} .subContWrap .subTit2 + p.subTit3 {margin-top:20px} .subContWrap .subTit2 + .dotList {margin-top:10px} .subContWrap .subTit2 + .dotList > li + li {margin-top:22px} .subContWrap p.subTit3 + .dotList {margin-top:11px} .subContWrap .dotList + p.subTit3 {margin-top:32px} .subContWrap .imgContBox2 {margin-top:34px} /* select */ .subContWrap .selectBox .btnSelect {padding:0 25px 2px 9px;height:32px;color:#666;font-size:14px} .subContWrap .selectBox .btnSelect:after {border-color:#555} .subContWrap .inpSrch {padding-right:73px} .subContWrap .inpBox input {padding:0 10px 2px;height:32px;color:#666;font-size:14px} .subContWrap .inpSrch .btnSrch {width:68px;height:32px;font-size:16px;font-weight:500;line-height:30px;border-radius:5px} .subContWrap .selectBox .btnSelect:after {width:6px;height:6px;right:10px;top:42%} .subContWrap .selectBox .selectOption > li > button {font-size:14px;color:#666;height:32px;padding:0 9px} .subContWrap .filterWrap {margin-top:53px;-webkit-justify-content:flex-end;-ms-justify-content:flex-end;-o-justify-content:flex-end;-moz-justify-content:flex-end;justify-content:flex-end;} .subContWrap .filterWrap .selectBox {width:103px} .subContWrap .filterWrap .selectBox2 {width:170px} .subContWrap .filterWrap .inpSrch {margin-left:5px;width:373px} /* table col type */ .subContWrap .tblColTyp thead th {height:44px;font-size:16px} .subContWrap .tblColTyp tbody td {padding:9px 0;font-size:16px;text-align:center} .subContWrap .tblImgTit {margin:0;padding:0 20px} .subContWrap .tblImgTit .img {margin-right:30px;width:140px;height:77px} .subContWrap .tblImgTit .tit {width:calc(100% - 170px);text-align:left} /* table col type2 */ .subContWrap .tblColTyp2.tblSm {margin-top:25px} .subContWrap .tblColTyp2.tblSm th {padding:11px 10px 12px ;font-size:16px} .subContWrap .tblColTyp2.tblSm td {padding:25px 19px 26px;font-size:16px} .subContWrap .tblColTyp2.tblSm + .bulRefer {margin-top:17px} /* table row type */ .subContWrap .tblRowTyp {margin-top:53px} .subContWrap .tblRowTyp.tblSm {margin-top:27px} .subContWrap .tblRowTyp th {padding:7px 10px 9px;height:auto;font-weight:400;font-size:16px;text-align:left} .subContWrap .tblRowTyp.tblSm th, .subContWrap .tblRowTyp.tblSm td {font-size:16px;padding:20px 19px 25px} .subContWrap .tblRowTyp td {padding:8px 10px} .subContWrap .tblRowTyp .dashList {margin:5px 0} .subContWrap .tblRowTyp.tblSm .dotList {margin-top:4px} .subContWrap .tblRowTyp.tblSm .dotList.typSm > li {line-height:1.5} .subContWrap .tblRowTyp.tblSm .dotList.typSm > li + li {margin-top:0} /* table col + row type */ .subContWrap .tblColRowTyp {margin-top:25px} .subContWrap .tblColRowTyp thead th {padding:11px 0 12px;font-size:16px} .subContWrap .tblColRowTyp tbody th, .subContWrap .tblColRowTyp tbody td {padding:24px 14px;font-size:16px;} [class^="tbl"] col.w88 {width:88px !important} [class^="tbl"] col.w90 {width:90px !important} [class^="tbl"] col.w105 {width:105px !important} [class^="tbl"] col.w110 {width:110px !important} [class^="tbl"] col.w130 {width:130px !important} [class^="tbl"] col.w135 {width:135px !important} [class^="tbl"] col.w150 {width:150px !important} [class^="tbl"] col.w160 {width:160px !important} [class^="tbl"] col.w170 {width:170px !important} [class^="tbl"] col.w180 {width:180px !important} [class^="tbl"] col.w240 {width:240px !important} [class^="tbl"] col.w250 {width:250px !important} [class^="tbl"] col.w260 {width:260px !important} [class^="tbl"] col.w355 {width:355px !important} /* bullet text */ .subContWrap .dotList {margin-left:6px;margin-top:10px} .subContWrap .dotList > li:before {top:12px} .subContWrap .dotList > li + li {margin-top:11px} .subContWrap .dotList.typSm > li {padding-left:8px;font-size:16px} .subContWrap .dotList.typSm > li:before {top:13px;width:3px;height:3px} .subContWrap .dotList.typSm > li + li {margin-top:22px} .subContWrap .dotList .dashList.typSm {margin-top:12px;margin-left:2px} .subContWrap .dotList .dashList.typSm > li {padding-left:15px;font-size:16px} .subContWrap .dotList .dashList.typSm > li:before {width:6px;top:12px} .subContWrap .dotList .dashList.typSm > li + li {margin-top:11px} .subContWrap .dashList {margin-left:2px} .subContWrap .dashList > li {padding-left:8px;} .subContWrap .dashList > li:before {top:15px;width:5px} .subContWrap .dashList > li + li {margin-top:6px} .subContWrap .dashList.typSm {margin-top:0;margin-left:5px} .subContWrap .dashList.typSm > li {padding-left:8px;font-size:16px} .subContWrap .dashList.typSm > li:before {width:5px;top:13px} .subContWrap .dashList.typSm > li + li {margin-top:0} .subContWrap .arrList {margin-left:4px;margin-top:27px} .subContWrap .arrList > li {padding-left:22px;} .subContWrap .arrList > li:before {top:10px;width:7px;height:10px;} .subContWrap .arrList > li + li {margin-top:30px} .subContWrap .numList {margin-top:11px} .subContWrap .numList li {padding-left:17px} .subContWrap .numList li + li {margin-top:6px} .subContWrap .circleNumList {margin-top:9px;margin-left:27px} .subContWrap .circleNumList > li {padding-left:23px} .subContWrap .circleNumList > li + li {margin-top:26px} .subContWrap .circleNumList > li > span {top:1px} .subContWrap .circleNumList > li > .dashList {margin-top:6px;margin-left:-3px;color:#444} .subContWrap .circleNumList > li > .dashList > li + li {margin-top:2px} .subContWrap .bulRefer {padding-left:20px;line-height:1.5} .subContWrap .bulRefer.typSm {font-size:16px} .subContWrap .bulStar {padding-left:10px;line-height:1.5} .subContWrap .bulStar:before {left:0;top:1px} /* paging */ .subContWrap .paging {margin-top:60px} .subContWrap .paging > a {width:31px;height:31px;background-size:auto 13px} .subContWrap .paging > .first {background-size:12px auto} .subContWrap .paging > .prev {background-size:7px auto} .subContWrap .paging > .next {background-size:7px auto} .subContWrap .paging > .last {background-size:12px auto} .subContWrap .paging .pagingNum li a {width:31px;height:31px;line-height:29px} /* button */ .subContWrap .btnArr {margin-top:20px;height:36px;font-size:16px;line-height:33px;padding:0 22px 0 20px;border:1px solid #d5d5d5;letter-spacing:-1px} .subContWrap .btnArr span {padding-right:25px} .subContWrap .btnArr span:after {width:7px;height:7px;border:solid #222;border-width:1px 1px 0 0;} .subContWrap .btnWrap .btnArr {margin-top:36px;letter-spacing:-0.7px;} .subContWrap .btnWrap .btnArr:hover {background-color: #137fd2;color: white;} .subContWrap .btnType1 {padding:0 15px;height:42px;font-size:18px;border-radius:5px} .subContWrap .btnType2 {padding:0 15px;height:42px;font-size:18px;border-radius:5px} /* tab */ .subContWrap .tabWrap {margin-top:53px} .subContWrap .tabWrap .tabList a {padding:7px 0 9px;font-size:16px;} .subContWrap .tabCont {padding-top:52px} .subContWrap .tabWrap.ty3 .tabList > li {width:33.33%} .subContWrap .tabWrap.ty3 .tabList > li:nth-child(2n + 1) {margin-left:-1px} .subContWrap .tabWrap.ty4 .tabList {margin:0 -5px 0 1px} .subContWrap .tabWrap.ty4 .tabList > li {margin-top:0;margin-left:-1px;width:calc(100% / 6)} .subContWrap .tabWrap.ty4 .tabList > li + li.on {margin-left:0} .subContWrap .tabWrap.ty4 .tabList > li.on {margin-left:0} .subContWrap .moreList {margin-top:20px;border:1px solid #ddd} .subContWrap .moreList li {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;height:40px;font-size:16px;} .subContWrap .moreList li + li {border-top:1px solid #ddd} .subContWrap .moreList li .tit {width:150px;color:#fff;background:#444;border-right:1px solid #ddd;text-align:center;line-height:38px} .subContWrap .moreList li .txt {width:calc(100% - 150px);padding:3px 10px;} .subContWrap .moreList li .txt a:hover {border-bottom:1px solid #444} .subContWrap .shareFundBox {margin-top:15px;padding:20px 50px 30px 20px} .subContWrap .shareFundBox li {padding-left:240px;background-size:190px;background-position:left 0;line-height:1.3} .subContWrap .shareFundBox li + li {margin-top:42px} .subContWrap .shareFundBox .txt {margin-top:9px;line-height:1.5} .subContWrap .shareFundBox .fund01 {padding:48px 0 30px 240px} .subContWrap .boxGray {margin-top:51px;padding:24px;text-align:center} .subContWrap .boxGray p {line-height:1.5} .subContWrap .boxGray + .subTit2 {margin-top:53px} /* 사회공헌 활동 */ .subContWrap .attachFile {padding-left:33px;background-size:25px auto;background-position:left 5px} .subContWrap .attachFile + .attachFile {margin-top:3px} .subContWrap .studyDetail > li {padding-left:15px} .subContWrap .studyDetail > li:before {width:6px;top:14px} .subContWrap .studyDetail > li + li {margin-top:10px} /* 인재채용 */ .subContWrap .imgRecruit1 {margin-top:35px} .subContWrap .imgRecruit4 {margin-top:53px} /* CI 소개 */ .subContWrap .imgCi1 {margin-top:15px} .subContWrap .imgCi1 .btnArr {bottom:40px} /* 캐릭터 소개 */ .subContWrap .imgCharacter1 {margin-top:15px} .subContWrap .imgCharacter1 .btnArr {bottom:40px} .subContWrap .characterList {margin-top:15px} .subContWrap .characterList li {width:calc((100% - 80px) / 3);margin-top:0} /* 열린경영 - 경영정보 */ .subContWrap .txtName {margin-top:40px;font-size:18px} .subContWrap .txtName strong {font-size:28px} .subContWrap .roundBoxGray {margin-top:16px;padding:8px 28px 9px;border-radius:15px} .subContWrap .imgBusiness1 {margin-top:12px} .subContWrap .imgBusiness2 {margin-top:25px} .subContWrap .imgBusiness3 {width:712px;margin:4px auto 0} .subContWrap .imgBusiness4 {margin-top:14px} .subContWrap .imgBusiness5 {margin-top:14px} .subContWrap .imgBusiness6 {margin-top:26px} .subContWrap .imgBusiness7 {margin-top:26px} .subContWrap .imgBusiness7 + .subTit3 {margin-top:60px} .subContWrap .roundBoxWhList {margin-top:-5px} .subContWrap .roundBoxWh {margin-top:20px;width:calc((100% - 20px) / 2);height:130px;padding:0 29px;border-radius:15px} .subContWrap .roundBoxWh .tit {color:#222} .subContWrap .roundBoxWh .dotList {margin:8px 0 0 2px} .subContWrap .roundBoxWh .dotList > li {padding-left:10px} .subContWrap .roundBoxWh .dotList > li:before {top:12px;width:4px;height:4px} .subContWrap .roundBoxWhList.typ2 {margin-top:-5px} .subContWrap .roundBoxWhList.typ2 .roundBoxWh {width:calc((100% - 60px) / 4);height:90px} .subContWrap .roundBoxWhList.typ2 .roundBoxWh p {line-height:1.4} .subContWrap .roundBoxWhList + .subTit3 {margin-top:53px} .subContWrap .roundBoxGray + .subTit2 {margin-top:53px} .subContWrap .subDesc2 + .btnWrap .btnArr {margin-top:14px} .subContWrap .subTit3.titBtn .btnDownload {right:-35px;top:0;width:30px;height:30px;background:url('../images/icon_download_pc.png') no-repeat center / 21px auto} .subContWrap .subTitWrap {margin-top:45px} .subContWrap .subTitWrap .selectBox {top:55%} .subContWrap .selYear {width:83px} .subContWrap .btnDownloadR {margin-top:8px;padding:0 60px 0 18px;height:36px;font-size:16px;letter-spacing:-1.5px;background:url('../images/icon_download_pc.png') no-repeat calc(100% - 20px) 7px / 21px auto} .subContWrap .btnDownloadR + .subTit2 {margin-top:32px} .subContWrap .faqList {margin-left:27px;margin-top:8px} .subContWrap .faqList > li {font-weight:500} .subContWrap .faqList > li .dashList > li {font-weight:400} .subContWrap .strategyList > li + li {margin-top:7px} .subContWrap .underLine {position:relative;display:inline-block} .subContWrap .underLine:before {content:'';display:block;position:absolute;bottom:-6px;width:100%;height:1px;background:#727272} /* 열린경영 - 경영공시 */ .subContWrap .bnrAlioList {margin-top:0;display:block;position:absolute;right:0;top:-120px} .subContWrap .bnrAlioList .btnBnrAlio {display:block;width:196px;height:60px} .subContWrap .bnrAlioList .btnBnrAlio + .btnBnrAlio {margin-top:10px} .subContWrap .bnrAlioList + .subTit2 {margin-top:70px} .subContWrap .listColTyp {margin-top:37px;padding:40px 19px;border:1px solid #ddd} .subContWrap .listColTyp ul li {width:25%;height:80px;} .subContWrap .listColTyp ul li:not(:nth-child(4n + 1)) {border-left:1px solid #aaa} .subContWrap .listColTyp ul li a {font-size:16px} .subContWrap .listColTyp ul li:nth-child(4n + 1) {background:#fff} .subContWrap .listColTyp ul li:nth-child(4n + 2) {background:#fff} .subContWrap .listColTyp ul li:nth-child(8n + 1) {background:#f9fcff} .subContWrap .listColTyp ul li:nth-child(8n + 2) {background:#f9fcff} .subContWrap .listColTyp ul li:nth-child(8n + 3) {background:#f9fcff} .subContWrap .listColTyp ul li:nth-child(8n + 4) {background:#f9fcff} /* 정보공개 */ .subContWrap .imginformation1 {margin-top:34px} .subContWrap .adminTit {margin:0 38px} .subContWrap .tblColTyp tbody td.tblLinkTit {padding:0 28px} .subContWrap .btnUpLoad {margin-top:20px;width:90px;height:42px;font-size:18px;border-radius:5px} .subContWrap .filterWrap.selColWrap {margin-top:8px;-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex} .subContWrap .selecBoxWrap {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex} .subContWrap .selecBoxWrap .selectBox:first-of-type {width:132px} .subContWrap .selecBoxWrap .selectBox:last-of-type {width:102px} .subContWrap .selecBoxWrap .selectBox + .selectBox {margin-left:5px} .subContWrap .selecBoxWrap.col3 .selectBox {width:82px} .subContWrap .selecBoxWrap.col3 .selectBox:last-of-type {width:105px} .subContWrap .filterWrap.selColWrap .inpSrch {margin-top:0;width:auto;margin-top:0} .subContWrap .filterWrap.selColWrap .inpSrch input {width:300px} /* .subContWrap .graphBox1 {height:342px} */ .subContWrap .graphBox1 #chart1 {padding: 15px 15px 15px 15px;} /* .subContWrap .graphBox2 {height:470px} */ .subContWrap .graphBox2 #chart2 {padding-top: 10px;} /* .subContWrap .graphBox3 {height:480px} */ .subContWrap .graphBox3 #chart3 {padding-top: 10px;} .subContWrap .imgBnrBox {margin-top:35px} .subContWrap .imgBnrBox + .selColWrap {margin-top:60px} .subContWrap .iframArea {margin-top:60px} .subContWrap .tblRowTyp.ty2 th, .subContWrap .tblRowTyp.ty2 td {padding:15px 20px;font-size:18px} .subContWrap .tblSelWrap .selectBox .btnSelect {height:50px;padding:0 40px 0 20px;font-size:16px;color:#444} .subContWrap .tblSelWrap .selectBox .btnSelect:after {right:23px;width:8px;height:8px} .subContWrap .tblSelWrap .selectBox .selectOption {top:50px} .subContWrap .tblSelWrap .selectBox .selectOption > li > button {padding:0 20px;height:50px;font-size:16px} .subContWrap .tblInpBox input {height:50px;padding:0 20px;font-size:16px} .subContWrap .tblEmailBox {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-align-items:center;-moz-align-items:center;-o-align-items:center;-ms-align-items:center;align-items:center;} .subContWrap .tblEmailBox input {padding:0 20px;margin-top:0 !important;width:252px !important;height:50px;font-size:16px} .subContWrap .tblEmailBox input:last-of-type {float:none} .subContWrap .tblEmailBox .emailDot {margin:0 10px;line-height:50px} .subContWrap .tblEmailBox .selectBox {float:none;margin-left:13px;margin-top:0;width:146px} .subContWrap .tblTxtArea textarea {height:170px;font-size:16px;padding:20px} .subContWrap .tblInpFile input {width:calc(100% - 104px)} .subContWrap .tblInpFile input[type="file"] {width:400px;} .subContWrap .tblInpFile .btnUpLoad {width:86px;height:42px;font-size:16px} .subContWrap .tblInpFile div .btnDel {margin-top:0;margin-left:10px; width:66px;height:30px;font-size:12px;color:#fff;background:#555;border-radius:5px} .subContWrap .tblPw input {width:220px} .subContWrap .tblPw .inpTxt {display:inline-block;margin-left:15px;color:#f24724} .subContWrap .tblRowTyp.ty2.tblData th, .subContWrap .tblRowTyp.ty2.tblData td {padding:27px 20px} .subContWrap .brdBtm {font-size:20px;padding-bottom:12px;margin:54px 0 20px} /* 설문조사 팝업 */ .subPopWrap {position:static;width:100%;padding:20px 0 40px;transform:none} .subPopWrap .popTit {padding:27px 0;font-size:18px} .subPopWrap .surveyWrap {margin:40px;padding:31px 39px;height:55vh} .subPopWrap .surveyWrap .surveyQ {padding-left:15px;font-size:16px} .subPopWrap .surveyWrap .surveyQ:not(:first-of-type) {margin-top:50px} .subPopWrap .surveyWrap .surveyQ span {position:absolute;left:0;top:0} .subPopWrap .surveyWrap .surveyA {margin:10px 16px} .subPopWrap .surveyWrap .surveyRdoList li + li {margin-top:15px} .subPopWrap .surveyWrap .rdoBox input[type="radio"] + label {padding-left:27px;font-size:16px} .subPopWrap .surveyWrap .rdoBox input[type="radio"] + label:before {top:4px;width:19px;height:19px} .subPopWrap .surveyWrap .rdoBox input[type="radio"]:checked + label:before {background-position:0 -19px} .subPopWrap .surveyWrap .surveyA .inpBox {margin-top:12px} .subPopWrap .surveyWrap .surveyA .inpBox input {height:36px} .subContWrap .graphDiv {display:flex; justify-content: space-between} .subContWrap .graphBox2 {width:430px} .subContWrap .graphBox3 {width:430px} } .subContWrap * {box-sizing:border-box;word-break:break-all;white-space:normal} .ir {overflow:hidden;display:block;position:absolute !important;left:0;top:0;z-index:-1;border:0;width:1px;height:1px;clip:rect(1px, 1px, 1px, 1px);text-indent:-9999px} .subContWrap input, textarea {-webkit-appearance:none;-webkit-border-radius:0;border-radius:0} .subContWrap a:hover {color:inherit} .moShow {display:block !important} .pcShow {display:none !important} .mainWrap * {box-sizing:border-box} .subContWrap img {margin:0} .subContWrap table {width:100%;table-layout:fixed} .subContWrap table th, .subContWrap table td {border-spacing:0;border-collapse:collapse;word-wrap:break-word;vertical-align:middle;border:0} .subContWrap caption {margin:0;width:0;height:0;text-indent:-9999px;} .subContWrap input::placeholder {color:#444;font-weight:300} .subContWrap input:-webkit-input-placeholder {color:#444;font-weight:300} .subContWrap input::-webkit-input-placeholder {color:#444;font-weight:300} .subContWrap input::-moz-placeholder {color:#444;font-weight:300} .subContWrap input:-moz-placeholder {color:#444;font-weight:300} .subContWrap .tc {text-align:center !important} .subContWrap .tr {text-align:right !important} .subContWrap .tl {text-align:left !important} .subContWrap .fcBk1 {color:#222 !important} .subContWrap .fcBk2 {color:#444 !important} .subContWrap .fcBl1 {color:#137fd2 !important} .subContWrap .fcBl2 {color:#003586 !important} .subContWrap .fcRd1 {color:#f24724 !important} .subContWrap .fw400 {font-weight:400 !important} .subContWrap .fw500 {font-weight:500 !important} .subContWrap .fs12 {font-size:12px !important} .subContWrap .fs18 {font-size:18px !important} .subContWrap .inrGap0 {padding-left:0 !important;padding-right:0 !important} .subContWrap .ellipsis {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .subContWrap .mgt0 {margin-top:0 !important} .subContWrap .mgt5 {margin-top:5px !important} .subContWrap .mgt10 {margin-top:10px !important} .subContWrap .mgt15 {margin-top:15px !important} .subContWrap .mgt20 {margin-top:20px !important} .subContWrap .mgt25 {margin-top:25px !important} .subContWrap .mgt35 {margin-top:35px !important} .subContWrap .mgt1020 {margin-top:10px !important} .subContWrap .mgt2540 {margin-top:25px !important} .subContWrap .mgt1530 {margin-top:15px !important} .subContWrap .mgt1855 {margin-top:18px !important} .subContWrap .mgt2035 {margin-top:20px !important} .subContWrap .mgt2555 {margin-top:25px !important} .subContWrap .mgt3040 {margin-top:30px !important} .subContWrap .mgt3552 {margin-top:35px !important} .subContWrap .mgt2026 {margin-top:20px !important} .subContWrap .mgl2426 {margin-left:24px !important} .subContWrap .mgl1025 {margin-left:10px !important} .subContWrap {position:relative;/* padding-top:30px */} .subContWrap .subContInner {padding:0 20px} .subContWrap .subContInner .subTit1 {margin-top:0;font-size:30px;font-weight:500;color:#222} .subContWrap .subTxt1 {margin-top:5px !important;font-size:14px} .subContWrap .copyBox {position:relative;margin-top:30px;padding-right:95px} .subContWrap .copyBox .copyTxt {position:relative;font-size:22px;font-weight:700;line-height:1.5;letter-spacing:-0.7px;z-index:1} .subContWrap .subCopyTxt {font-size:16px;font-weight:500} .subContWrap .copyBox .copyImg {position:absolute;right:0} .subContWrap .copyBox .copyImg.share1 {top:8px;width:83.5px;height:84.5px} .subContWrap .copyBox .copyImg.share4 {top:8px;width:110px;height:110px} .subContWrap .copyBox .copyImg.share5 {top:8px;width:125px;height:88.5px} .subContWrap .copyBox .copyImg.history1 {top:8px;width:158px;height:136px} .subContWrap .copyBox .copyImg.history2 {top:8px;width:130px;height:121px} .subContWrap .copyBox .copyImg.business1 {top:25px;width:103.5px;height:86px} .subContWrap .copyBox .copyImg.socialvalue {top:33px;width:101px;height:135.5px} .subContWrap .copyBox .copyImg.committee {top:10px;width:119.5px;height:143px} .subContWrap .copyBox.information1 {padding-right:130px} .subContWrap .copyBox.information1 .copyImg {top:7px;right:0;width:125px;height:90px} .subContWrap .copyBox.information2 {padding-right:155px} .subContWrap .copyBox.information2 .copyImg {top:7px;right:0;width:112px;height:100px} .subContWrap .imgContBox1 {margin-top:35px} .subContWrap .subDesc1 {margin-top:25px;position:relative;font-size:14px;color:#222;line-height:1.5} .subContWrap .copyBox + .subDesc1 {margin-top:30px} .subContWrap .subCopyTxt + .subDesc1.ty1 {margin-top:12px} .subContWrap .subDesc1.ty1 {margin-top:20px} .subContWrap .subDesc1 + .subDesc1 {margin-top:22px} .subContWrap .subDesc2 {margin-top:11px;font-size:12px} .subContWrap .subDesc3 {margin:8px 0 0 24px;font-size:14px;line-height:1.5} .subContWrap .imgTxtShareHead {margin-top:10px;text-align:right} .subContWrap .imgTxtShareHead img {width:138px} /* title */ .subContWrap .subTit2 {position:relative;margin:30px 0 0 0;padding-left:0;font-size:16px;font-weight:500;letter-spacing:-0.6px} .subContWrap .subTit2:before {display:none} .subContWrap .subTit2.bulSquare {padding-left:23px} .subContWrap .subTit2.bulSquare:before {content:'';display:block;position:absolute;left:0;top:6px;width:14px;height:14px;background:url('../images/bullet_big.png') no-repeat center / 100% auto} .subContWrap .subTit3 {position:relative;margin:23px 0 0 0;font-size:14px;font-weight:400} .subContWrap .subTit3.bulArr {padding-left:23px} .subContWrap p.subTit3.bulArr {color:#222;line-height:1.5} .subContWrap .subTit3.bulArr:before {content:'';display:block;position:absolute;left:0;top:5px;width:12px;height:12px;background:url('../images/bullet_small.png') no-repeat center / 100% auto} .subContWrap .subTit2 + p.subTit3 {margin-top:12px} .subContWrap .subTit2 + .dotList {margin-top:7px} .subContWrap p.subTit3 + .dotList {margin-top:8px} .subContWrap .dotList + p.subTit3 {margin-top:14px} .subContWrap .filterWrap {margin-top:43px;-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:space-between;-moz-justify-content:space-between;-ms-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;} .subContWrap .imgContBox2 {margin-top:15px} /* select */ .subContWrap .selectBox {display:inline-block;position:relative;z-index:1} .subContWrap .selectBox .btnSelect {position:relative;width:100%;height:27px;padding:0 20px 0 4px;color:#444;font-size:12px;font-weight:400;text-align:left;background:#fff;border:1px solid #ddd} .subContWrap .selectBox .btnSelect:after {content:'';display:block;position:absolute;right:7px;top:40%;transform:translateY(-50%) rotate(45deg);width:6px;height:6px;border:solid #303030;border-width:0 1px 1px 0} .subContWrap .selectBox.on .btnSelect {border-bottom-color:#fff} .subContWrap .selectBox.on .btnSelect:after {top:60%;transform:translateY(-50%) rotate(-135deg)} .subContWrap .selectBox .selectOption {display:none;position:absolute;top:27px;width:100%;border:solid #ddd;border-width:0 1px 1px 1px;background:#fff} .subContWrap .selectBox.on .selectOption {display:block} .subContWrap .selectBox .selectOption > li > button {padding:0 4px;width:100%;height:27px;color:#444;font-size:12px;text-align:left} .subContWrap .inpBox input {width:100%;height:27px;padding:0 4px 2px;color:#444;font-size:12px;border:1px solid #ddd} .subContWrap .inpSrch {position:relative;padding-right:48px} .subContWrap .inpSrch .btnSrch {position:absolute;right:0;top:0;width:43px;height:27px;color:#fff;font-size:12px;font-weight:500;background:#003586;border:1px solid #002763;border-radius:3px} .subContWrap .filterWrap .selectBox {width:28%} .subContWrap .filterWrap .inpSrch {width:calc(100% - 5px - 28%)} /* table col type */ .subContWrap .tblColTyp {margin-top:20px} .subContWrap .tblColTyp thead th {height:38px;font-size:14px;color:#222;font-weight:500;border-top:2px solid #003586;border-bottom:1px solid #e5e5e5;background:#f7f8f8} .subContWrap .tblColTyp thead th + th {border-left:1px solid #ddd} .subContWrap .tblColTyp tbody td {padding:10px;font-size:14px;color:#444;border-bottom:1px solid #e5e5e5} .subContWrap .tblColTyp tbody td + td {border-left:1px solid #ddd} .subContWrap .tblImgTit {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-align-items:center;-moz-align-items:center;-ms-align-items:center;-o-align-items:center;align-items:center;margin:0 -10px} .subContWrap .tblImgTit .img {margin-right:15px;width:100px;height:55px;overflow:hidden;background:#ddd} .subContWrap .tblImgTit .tit {width:calc(100% - 115px)} /* table col type2 */ .subContWrap .tblColTyp2 {margin-top:37px;border:solid #ddd;border-width:1px 0 1px 1px} .subContWrap .tblColTyp2 th {height:34px;color:#222;font-weight:400;background:#f5f5f5;border-top:1px solid #ddd} .subContWrap .tblColTyp2 th, .subContWrap .tblColTyp2 td {border-right:1px solid #ddd} .subContWrap .tblColTyp2 tr:first-of-type th {border-top:0} .subContWrap .tblColTyp2 td {min-height:34px;padding:6px 15px 7px;color:#444;border-top:1px solid #ddd} .subContWrap .tblColTyp2.tblSm {margin-top:12px} .subContWrap .tblColTyp2.tblSm th {padding:6px 10px 7px;font-size:12px} .subContWrap .tblColTyp2.tblSm td {padding:11px 12px 12px;font-size:12px;line-height:1.5} .subContWrap .tblColTyp2.tblSm + .bulRefer {margin-top:17px} /* table row type */ .subContWrap .tblRowTyp {margin-top:12px;border:1px solid #ddd} .subContWrap .tblRowTyp th:not(:first-child), .subContWrap .tblRowTyp td:not(:first-child) {border-left:1px solid #ddd} .subContWrap .tblRowTyp tr:not(:first-of-type) th, .subContWrap .tblRowTyp tr:not(:first-of-type) td {border-top:1px solid #ddd} .subContWrap .tblRowTyp th {padding:0 8px;color:#222;font-size:14px;font-weight:400;background:#f5f5f5;text-align:left;} .subContWrap .tblRowTyp.tblSm th {padding:10px 10px 13px;color:#222;font-size:12px;font-weight:500} .subContWrap .tblRowTyp.tblSm td {padding:10px 10px 13px;color:#444;font-size:12px} .subContWrap .tblRowTyp.tblSm .dotList {margin-top:6px} .subContWrap .tblRowTyp.tblSm .dotList.typSm > li + li {margin-top:2px} /* table col + row type */ .subContWrap .tblColRowTyp {margin-top:13px;border:1px solid #ddd} .subContWrap .tblColRowTyp thead th {padding:8px 0 10px;height:auto;font-size:12px;font-weight:500;color:#222;background:#f5f5f5} .subContWrap .tblColRowTyp thead th + th {border-left:1px solid #ddd} .subContWrap .tblColRowTyp tbody th, .subContWrap .tblColRowTyp tbody td {padding:10px;height:auto;font-size:12px;border-top:1px solid #ddd;background:#fff} .subContWrap .tblColRowTyp tbody th {color:#222;font-weight:500} .subContWrap .tblColRowTyp tbody th + td {border-left:1px solid #ddd} /* paging */ .subContWrap .paging {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;justify-content:center;margin-top:30px;color:#444;font-size:14px} .subContWrap .paging > a {margin:0 3px;width:25px;height:25px;border:1px solid #e5e5e5;border-radius:3px;} .subContWrap .paging > .first {background:url('../images/board_arrow_first.png') no-repeat center / 10px auto} .subContWrap .paging > .prev {background:url('../images/board_arrow_prev.png') no-repeat center / 6px auto} .subContWrap .paging > .next {background:url('../images/board_arrow_prev.png') no-repeat center / 6px auto;transform:rotate(180deg)} .subContWrap .paging > .last {background:url('../images/board_arrow_first.png') no-repeat center / 10px auto;transform:rotate(180deg)} .subContWrap .paging > .first.on {background:#137fd2 url('../images/board_arrow_first_white.png') no-repeat center / 10px auto} .subContWrap .paging > .prev.on {background:#137fd2 url('../images/board_arrow_prev_white.png') no-repeat center / 6px auto} .subContWrap .paging > .next.on {background:#137fd2 url('../images/board_arrow_prev_white.png') no-repeat center / 6px auto} .subContWrap .paging > .last.on {background:#137fd2 url('../images/board_arrow_first_white.png') tno-repeat center / 10px auto} .subContWrap .paging .pagingNum {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;} .subContWrap .paging .pagingNum li {margin:0 3px;} .subContWrap .paging .pagingNum li a {display:block;width:25px;height:25px;font-size:14px;color:#444;border:1px solid #e5e5e5;border-radius:3px;text-align:center;line-height:23px} .subContWrap .paging a.on {background:#137fd2;border-color:#0c6db8;color:#fff !important} /* bullet text */ .subContWrap .dotList {margin-left:4px;margin-top:12px} .subContWrap .dotList > li {position:relative;padding-left:20px} .subContWrap .dotList > li:before {content:'';display:block;position:absolute;left:0;top:9px;width:4px;height:4px;border-radius:50%;background:#666;line-height:1.5} .subContWrap .dotList > li + li {margin-top:15px} .subContWrap .dotList.typSm > li {padding-left:7px;font-size:12px} .subContWrap .dotList.typSm > li:before {top:9px;width:2px;height:2px;} .subContWrap .dotList.typSm > li + li {margin-top:18px} .subContWrap .dotList .dashList.typSm {margin-top:13px;margin-left:0} .subContWrap .dotList .dashList.typSm > li {line-height:1.5} .subContWrap .dotList .dashList.typSm > li:before {width:5px;top:9px} .subContWrap .dotList .dashList.typSm > li + li {margin-top:13px} .subContWrap .dashList {margin-top:10px} .subContWrap .dashList > li {position:relative;padding-left:7px;} .subContWrap .dashList > li:before {content:'';display:block;position:absolute;left:0;top:11px;width:4px;height:1px;background:#444} .subContWrap .dashList > li + li {margin-top:5px} .subContWrap .dashList.typSm {margin-top:3px;margin-left:3px} .subContWrap .dashList.typSm > li {padding-left:9px;font-size:12px} .subContWrap .dashList.typSm > li:before {width:4px;top:10px} .subContWrap .dashList.typSm > li + li {margin-top:0} .subContWrap .arrList {margin-left:3px;margin-top:13px} .subContWrap .arrList > li {position:relative;padding-left:20px;color:#222;line-height:1.5} .subContWrap .arrList > li:before {content:'';display:block;position:absolute;left:0;top:7px;width:4.5px;height:6.5px;background:url('../images/bullet_arrow_blue.png') no-repeat center / 100% auto} .subContWrap .arrList > li + li {margin-top:12px} .subContWrap .numList {margin-top:8px;} .subContWrap .numList li {position:relative;padding-left:14px} .subContWrap .numList li > span {position:absolute;left:0;top:0} .subContWrap .numList li + li {margin-top:5px} .subContWrap .circleNumList {margin-top:12px} .subContWrap .circleNumList > li {position:relative;padding-left:17px;color:#222} .subContWrap .circleNumList > li + li {margin-top:22px} .subContWrap .circleNumList > li > span {position:absolute;left:0;top:0} .subContWrap .circleNumList > li > .dashList {margin-top:6px;margin-left:-3px;color:#444} .subContWrap .circleNumList > li > .dashList > li + li {margin-top:6px} .subContWrap .bulRefer {position:relative;padding-left:15px} .subContWrap .bulRefer:before {content:'※';display:block;position:absolute;left:0;top:0} .subContWrap .bulRefer + .bulRefer {margin-top:5px} .subContWrap .bulRefer.typSm {font-size:12px} .subContWrap .bulStar {position:relative;padding-left:7px} .subContWrap .bulStar:before {content:'*';display:block;position:absolute;left:0;top:1px} /* button */ .subContWrap .btnListMore {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:space-between;-moz-justify-content:space-between;-ms-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;margin-top:20px;height:50px;border:1px solid #222;background:#444} .subContWrap .btnListMore .btnPrev {width:58px;height:48px;background:url('../images/icon_list_prev_w.png') no-repeat center / 28px auto} .subContWrap .btnListMore .btnNext {width:58px;height:48px;background:url('../images/icon_list_next_w.png') no-repeat center / 28px auto} .subContWrap .btnListMore .btnList {width:58px;height:48px;background:url('../images/icon_list_bar_w.png') no-repeat center / 25px auto} .subContWrap .btnArr {margin-top:16px;display:inline-block;height:27px;font-size:12px;line-height:24px;padding:0 16px 0 14px;border:1px solid #ddd;border-radius:20px;letter-spacing:-0.5px;white-space:nowrap} .subContWrap .btnArr:hover {color:#222} .subContWrap .btnArr span {padding-right:20px;position:relative} .subContWrap .btnArr span:after {content:'';display:block;position:absolute;right:0;top:53%;transform:translateY(-50%) rotate(45deg);width:6px;height:6px;border:solid #444;border-width:1px 1px 0 0;} .subContWrap .btnArr + .btnArr {margin-left:10px} .subContWrap .btnWrap.flex {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;justify-content:center;} .subContWrap .btnWrap.flex.flexR {-webkit-justify-content:flex-end;-ms-justify-content:flex-end;-o-justify-content:flex-end;-moz-justify-content:flex-end;justify-content:flex-end} .subContWrap .btnWrap.flex button + button {margin-left:10px} .subContWrap .btnType1 {padding:0 11px;height:32px;color:#222;font-size:14px;background:#ccc;border:1px solid #939393;border-radius:3px} .subContWrap .btnType2 {padding:0 11px;height:32px;color:#fff;font-size:14px;background:#003586;border:1px solid #002866;border-radius:3px} /* tab */ .subContWrap .tabWrap {margin-top:35px} .subContWrap .tabWrap .tabList {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;-moz-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;} .subContWrap .tabWrap .tabList > li {-webkit-flex:1;-ms-flex:1;-moz-flex:1;-o-flex:1;flex:1;-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;justify-content:center;-webkit-align-items:center;-moz-align-items:center;-ms-align-items:center;-o-align-items:center;align-items:center;border:1px solid #ddd;} .subContWrap .tabWrap .tabList > li + li {margin-left:-1px} .subContWrap .tabWrap .tabList > li + li.on {margin-left:0} .subContWrap .tabWrap .tabList a {width:100%;padding:4px 0 5px;font-size:12px;text-align:center;color:#222;word-break:break-all;white-space:normal} .subContWrap .tabWrap .tabList > li.on {background:#003586;border-color:#002866;z-index:1} .subContWrap .tabWrap .tabList > li.on a {color:#fff;font-weight:500} .subContWrap .tabCont {display:none;padding-top:27px} .subContWrap .tabCont.on {display:block} .subContWrap .tabWrap.ty3 .tabList > li {-webkit-flex:none;-moz-flex:none;-ms-flex:none;-o-flex:none;flex:none;width:50%;margin-top:-1px} .subContWrap .tabWrap.ty3 .tabList > li:nth-child(2n) {margin-left:-1px} .subContWrap .tabWrap.ty3 .tabList > li + li {margin-left:0} .subContWrap .tabWrap.ty4 {margin-top:20px} .subContWrap .tabWrap.ty4 .tabList {margin:1px -3px 0 1px} .subContWrap .tabWrap.ty4 .tabList > li {-webkit-flex:none;-moz-flex:none;-ms-flex:none;-o-flex:none;flex:none;width:33.33%;margin-top:-1px;margin-left:-1px} .subContWrap .tabWrap.ty4 .tabList > li + li.on {margin-left:-1px} .subContWrap .shareFundBox {margin-top:17px;padding:15px 10px 18px ;border:1px solid #ddd} .subContWrap .shareFundBox li {padding-left:105px;background-repeat:no-repeat;background-size:95px;background-position:left 5px} .subContWrap .shareFundBox li + li {margin-top:25px} .subContWrap .shareFundBox .fund01 {background-image:url('../images/img_share_fund01.png')} .subContWrap .shareFundBox .fund02 {background-image:url('../images/img_share_fund02.png')} .subContWrap .shareFundBox .tit {font-weight:500;color:#222} .subContWrap .shareFundBox .txt {margin-top:4px;color:#666} .subContWrap .shareFundBox .txt strong {font-weight:400} .subContWrap .download {color:#137fd2;font-weight:500} .subContWrap .download > a{color:#137fd2;font-weight:500} .subContWrap .boxGray {margin-top:34px;padding:15px 19px;color:#222;background:#f7f7f7;} .subContWrap .boxGray p {line-height:1.5} .subContWrap .boxGray + .subTit2 {margin-top:25px} /* 사회공헌 활동 */ .subContWrap .attachFile {padding-left:23px;background:url('../images/icon_file.png') no-repeat left 3px / 17.5px auto} .subContWrap .attachFile + .attachFile {margin-top:7px} .subContWrap .studyDetail {margin:5px 0} .subContWrap .studyDetail > li {padding-left:13px} .subContWrap .studyDetail > li:before {width:6px} .subContWrap .studyDetail > li + li {margin-top:8px} /* 인재채용 */ .subContWrap .imgRecruit1 {margin-top:25px} .subContWrap .imgRecruit2 {margin-top:17px} .subContWrap .imgRecruit3 {margin-top:17px} .subContWrap .imgRecruit4 {margin-top:37px} /* CI 소개 */ .subContWrap .imgCi1 {position:relative;margin-top:17px} .subContWrap .imgCi1 .btnArr {position:absolute;bottom:20px;left:50%;transform:translateX(-50%);margin-top:0} /* 캐릭터 소개 */ .subContWrap .imgCharacter1 {position:relative;margin-top:17px} .subContWrap .imgCharacter1 .btnArr {position:absolute;bottom:20px;left:50%;transform:translateX(-50%);margin-top:0} .subContWrap .characterList {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;-moz-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;-webkit-justify-content:space-between;-ms-justify-content:space-between;-moz-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;margin-top:2px} .subContWrap .characterList li {width:calc((100% - 15px) / 2);margin-top:15px} .subContWrap .characterList li > a {display:block} .subContWrap .characterList li > a img {display:block} /* 열린경영 - 경영정보 */ .subContWrap .txtName {margin-top:20px;font-size:12px;font-weight:500} .subContWrap .txtName strong {font-size:18px;color:#444;;font-weight:500} .subContWrap .roundBoxGray {margin-top:12px;padding:9px 15px 11px;background:#f5f5f5;border-radius:10px} .subContWrap .imgBusiness1 {margin-top:12px} .subContWrap .imgBusiness2 {margin-top:12px} .subContWrap .imgBusiness3 {margin-top:4px} .subContWrap .imgBusiness4 {margin-top:12px} .subContWrap .imgBusiness5 {margin-top:12px} .subContWrap .imgBusiness6 {margin-top:13px} .subContWrap .imgBusiness7 {margin-top:12px} .subContWrap .imgBusiness7 + .subTit3 {margin-top:35px} .subContWrap .roundBoxWhList {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;-moz-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;-webkit-justify-content:space-between;-ms-justify-content:space-between;-moz-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;} .subContWrap .roundBoxWh {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;-moz-flex-direction:column;-o-flex-direction:column;flex-direction:column;-webkit-justify-content:center;-ms-justify-content:center;-moz-justify-content:center;-o-justify-content:center;justify-content:center;margin-top:15px;width:100%;height:95px;padding:0 13px;border:1px solid #ddd;border-radius:10px} .subContWrap .roundBoxWh .tit {color:#222} .subContWrap .roundBoxWh .dotList {margin:6px 0 0 2px} .subContWrap .roundBoxWh .dotList > li {padding-left:8px} .subContWrap .roundBoxWh .dotList > li:before {top:8px;width:2px;height:2px} .subContWrap .roundBoxWhList.typ2 {margin-top:-3px} .subContWrap .roundBoxWhList.typ2 .roundBoxWh {width:calc((100% - 15px) / 2);height:60px;text-align:center} .subContWrap .roundBoxGray + .subTit2 {margin-top:24px} .subContWrap .subTit3.titBtn {display:inline-block} .subContWrap .subTit3.titBtn .btnDownload {position:absolute;right:-27px;top:-5px;padding:0;width:30px;height:30px;background:url('../images/icon_download_mo.png') no-repeat center / 14.5px auto} .subContWrap .subTitWrap {position:relative;margin-top:36px} .subContWrap .subTitWrap .selectBox {position:absolute;right:0;top:58%;transform:translateY(-50%)} .subContWrap .selYear {width:93px} .subContWrap .btnDownloadR {padding:0 44px 0 14px;height:27px;font-size:12px;color:#444;border:1px solid #ddd;border-radius:20px;letter-spacing:-1.2px;background:url('../images/icon_download_mo.png') no-repeat calc(100% - 15px) center / 14.5px auto} .subContWrap .btnDownloadR + .subTit2 {margin-top:15px} .subContWrap .faqList {margin-left:23px;margin-top:7px} .subContWrap .faqList > li {font-weight:500} .subContWrap .faqList > li .dashList > li {font-weight:400} .subContWrap .strategyList {margin:5px 0} .subContWrap .strategyList > li + li {margin-top:5px} .subContWrap .tblColRowTyp .dashList.typSm.mgt0 li {margin-top:0} /* 열린경영 - 경영공시 */ .subContWrap .bnrAlioList {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-justify-content:space-between;-ms-justify-content:space-between;-moz-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;margin-top:22px} .subContWrap .bnrAlioList .btnBnrAlio {width:calc((100% - 10px) / 2);height:35px} .subContWrap .bnrAlioList .btnBnrAlio img {width:100%} .subContWrap .listColTyp {margin-top:17px;} .subContWrap .listColTyp ul {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-moz-flex-wrap:wrap;-ms-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;border:solid #aaa;border-width:0 1px 1px 1px} .subContWrap .listColTyp ul li {display:table;width:50%;height:50px;text-align:center;border-top:1px solid #aaa;color:#222} .subContWrap .listColTyp ul li:nth-child(2n) {border-left:1px solid #aaa} .subContWrap .listColTyp ul li a {display:table-cell;vertical-align:middle;} .subContWrap .listColTyp ul li a:hover {color:#222} .subContWrap .listColTyp ul li:nth-child(4n + 1) {background:#f9fcff} .subContWrap .listColTyp ul li:nth-child(4n + 2) {background:#f9fcff} .subContWrap .tblColTyp2.tblSm.tblCsDay td {padding:12px 19px 13px} /* 정보공개 */ .subContWrap .imginformation1 {margin-top:17px} .subContWrap .adminTit {display:block;margin:0 10px} .subContWrap .tblColTyp tbody td.tblLinkTit {padding:0 20px;text-align:left} .subContWrap .btnUpLoad {margin-top:10px;width:67px;height:32px;color:#fff;font-size:14px;border-radius:3px;background:#003586;border:1px solid #002866} .subContWrap .filterWrap.selColWrap {display:block;margin-top:13px} .subContWrap .selecBoxWrap {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex} .subContWrap .selecBoxWrap .selectBox {width:calc((100% - 5px) / 2)} .subContWrap .selecBoxWrap .selectBox + .selectBox {margin-left:5px} .subContWrap .selecBoxWrap.col3 .selectBox {width:calc((100% - 10px) / 3)} .subContWrap .filterWrap.selColWrap .inpSrch {display:block;width:100%;margin-top:5px} .subContWrap [class^="graphBox"] {margin-top:15px;border:1px solid #ddd} /* .subContWrap .graphBox1 {height:232px} */ /* .subContWrap .graphBox1 #chart1 {padding: 15px 15px 15px 15px;} */ /* .subContWrap .graphDiv {display:flex; justify-content: space-between} .subContWrap .graphBox2 {width:430px} */ .subContWrap .graphBox2 #chart2 {padding-top: 10px;} /* .subContWrap .graphBox3 {width:430px} */ .subContWrap .graphBox3 #chart3 {padding-top: 10px;} .subContWrap .imgBnrBox {margin-top:17px} .subContWrap .imgBnrBox + .selColWrap {margin-top:40px} .subContWrap .iframArea {margin-top:40px} .subContWrap .tblSelWrap .selectBox {width:100%} .subContWrap .tblSelWrap .selectBox .btnSelect {height:30px;padding:0 30px 0 9px;font-size:14px} .subContWrap .tblSelWrap .selectBox .btnSelect:after {right:10px} .subContWrap .tblSelWrap .selectBox .selectOption > li > button {height:30px;font-size:14px;padding:0 9px} .subContWrap .tblInpBox input {padding:0 9px;width:100%;height:30px;border:1px solid #ddd;color:#444;font-weight:400} .subContWrap .tblEmailBox:after {content:'';display:block;clear:both;} .subContWrap .tblEmailBox input {padding:0 9px;height:30px;border:1px solid #ddd} .subContWrap .tblEmailBox input:first-of-type {width:calc(100% - 17px);} .subContWrap .tblEmailBox input:last-of-type {margin-top:5px;float:left;width:calc((100% - 5px) / 2);} .subContWrap .tblEmailBox .selectBox {margin-top:5px;float:right;width:calc((100% - 5px) / 2)} .subContWrap .tblTxtArea textarea {width:100%;height:150px;padding:9px;border:1px solid #ddd;font-size:14px;color:#444} .subContWrap .tblInpFile {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:space-between;-ms-justify-content:space-between;-o-justify-content:space-between;-moz-justify-content:space-between;justify-content:space-between;-webkit-align-items:center;-moz-align-items:center;-o-align-items:center;-ms-align-items:center;align-items:center;} .subContWrap .tblInpFile input {width:calc(100% - 67px)} .subContWrap .tblInpFile input[type="file"] {width:calc(100% - 100px)} .subContWrap .tblRowTyp input[type="text"]:read-only {background:#bbb} .subContWrap .tblInpFile .btnUpLoad {margin-top:0;width:72px;height:30px;font-size:12px;background:#137fd2;border-color:#0f6db6} .subContWrap .tblInpFile div .btnDel {margin-top:10px;margin-left:10px; width:66px;height:30px;font-size:12px;color:#fff;background:#555;border-radius:5px} .subContWrap .tblPw .inpTxt {display:none} .subContWrap .tblRowTyp.ty2 th, .subContWrap .tblRowTyp.ty2 td {padding:14px 10px 15px} .subContWrap .brdBtm {margin-bottom:15px;padding-bottom:10px;border-bottom:2px solid #003586} /* 설문조사 팝업 */ .subPopWrap {position:fixed;left:50%;top:50%;transform:translate(-50%, -50%);width:calc(100% - 40px);padding:0 0 15px 0;border:1px solid #aaa} .subPopWrap .popTit {padding:22px 0 23px;color:#222;font-size:14px;text-align:center;background:#f7f7f7} .subPopWrap .surveyWrap {margin:15px;padding:12px 14px 15px;height:70vh;overflow-y:auto;border:1px solid #d5d5d5} .subPopWrap .surveyWrap .surveyQ {padding-left:14px;position:relative;font-size:14px;color:#222} .subPopWrap .surveyWrap .surveyQ:not(:first-of-type) {margin-top:23px} .subPopWrap .surveyWrap .surveyQ span {position:absolute;left:0;top:0} .subPopWrap .surveyWrap .surveyA {margin:7px 14px} .subPopWrap .surveyWrap .surveyRdoList li + li {margin-top:7px} .subPopWrap .surveyWrap .rdoBox input[type="radio"] {border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px} .subPopWrap .surveyWrap .rdoBox input[type="radio"] + label {position:relative;display:block;padding-left:20px;font-size:14px;color:#444;} .subPopWrap .surveyWrap .rdoBox input[type="radio"] + label:before {content:'';display:block;position:absolute;left:0;top:3px;width:15px;height:15px;overflow:hidden;background:url('../images/icon_radio.png') no-repeat;background-position:0 0;background-size:100% auto} .subPopWrap .surveyWrap .rdoBox input[type="radio"]:checked + label:before {background-position:0 -15px} .subPopWrap .surveyWrap .surveyA .inpBox {margin-top:10px} @media all and (min-width:1024px) { .moShow {display:none !important} .pcShow {display:block !important} /* .subContWrap {padding-top:28px} */ .subContWrap .subContInner {padding:0} .subContWrap input::placeholder {color:#666} .subContWrap input:-webkit-input-placeholder {color:#666} .subContWrap input::-webkit-input-placeholder {color:#666} .subContWrap input::-moz-placeholder {color:#666} .subContWrap input:-moz-placeholder {color:#666} .subContWrap .mgt1020 {margin-top:20px !important} .subContWrap .mgt2540 {margin-top:40px !important} .subContWrap .mgt1530 {margin-top:30px !important} .subContWrap .mgt1855 {margin-top:55px !important} .subContWrap .mgt2026 {margin-top:26px !important} .subContWrap .mgt3552 {margin-top:52px !important} .subContWrap .mgt2035 {margin-top:35px !important} .subContWrap .mgt2555 {margin-top:55px !important} .subContWrap .mgl2426 {margin-left:26px !important} .subContWrap .mgt3040 {margin-top:40px !important} .subContWrap .pcMgt0 {margin-top:0px !important} .subContWrap .pcMgt10 {margin-top:10px !important} .subContWrap .pcMgt15 {margin-top:15px !important} .subContWrap .pcMgt20 {margin-top:20px !important} .subContWrap .pcMgt25 {margin-top:25px !important} .subContWrap .pcMgt30 {margin-top:15px !important} .subContWrap .pcFs18 {font-size:18px !important} .subContWrap .subContInner .subTit1 {font-size:40px} .subContWrap .subTxt1 {margin-top:1px;font-size:18px} .subContWrap .copyBox {margin-top:43px;padding-right:170px} .subContWrap .copyBox .copyTxt {font-size:30px;letter-spacing:-1px;} .subContWrap .subCopyTxt {font-size:30px} .subContWrap .copyBox .copyImg.share1 {top:-17px;width:167px;height:169px} .subContWrap .copyBox .copyImg.share4 {top:-57px;width:220px;height:220px} .subContWrap .copyBox .copyImg.share5 {top:-20 px;width:250px;height:177px} .subContWrap .copyBox .copyImg.history1 {top:7px;width:316px;height:272px} .subContWrap .copyBox .copyImg.history2 {top:8px;width:260px;height:242px} .subContWrap .copyBox .copyImg.business1 {top:8px;width:207px;height:172px} .subContWrap .copyBox .copyImg.socialvalue {top:-110px;width:202px;height:271px} .subContWrap .copyBox .copyImg.committee {top:-110px;width:239px;height:286px} .subContWrap .copyBox.information1 {padding-right:280px} .subContWrap .copyBox.information1 .copyImg {top:-33px;width:278px;height:200px} .subContWrap .copyBox.information2 {padding-right:235px} .subContWrap .copyBox.information2 .copyImg {top:7px;right:0;width:224px;height:200px} .subContWrap .imgContBox1 {margin-top:52px} .subContWrap .subDesc1 {margin-top:35px;font-size:18px} .subContWrap .copyBox + .subDesc1 {margin-top:48px} .subContWrap .subCopyTxt + .subDesc1.ty1 {margin-top:28px} .subContWrap .copyBox + .subDesc1.ty1 {margin-top:27px} .subContWrap .subDesc1 + .subDesc1 {margin-top:27px} .subContWrap .subDesc2 {font-size:18px} .subContWrap .subDesc3 {margin:10px 0 0 26px;font-size:18px} .subContWrap .imgTxtShareHead {margin-top:36px} .subContWrap .imgTxtShareHead img {width:276px} /* title */ .subContWrap .subTit2 {margin:46px 0 0 0;font-size:24px} .subContWrap .subTit2.bulSquare {padding-left:27px} .subContWrap .subTit2.bulSquare:before {top:10px;width:18px;height:18px} .subContWrap .subTit3 {margin:29px 0 0 0;font-size:20px} .subContWrap .subTit3.bulArr {padding-left:27px} .subContWrap p.subTit3.bulArr {line-height:1.4} .subContWrap .subTit3.bulArr:before {top:7px;width:16px;height:16px;} .subContWrap .subTit3.fzSm {font-size:18px} .subContWrap .subTit3.fzSm:before {top:5px} .subContWrap .subTit2 + p.subTit3 {margin-top:20px} .subContWrap .subTit2 + .dotList {margin-top:10px} .subContWrap .subTit2 + .dotList > li + li {margin-top:22px} .subContWrap p.subTit3 + .dotList {margin-top:11px} .subContWrap .dotList + p.subTit3 {margin-top:32px} .subContWrap .imgContBox2 {margin-top:34px} /* select */ .subContWrap .selectBox .btnSelect {padding:0 25px 2px 9px;height:32px;color:#666;font-size:14px} .subContWrap .selectBox .btnSelect:after {border-color:#555} .subContWrap .inpSrch {padding-right:73px} .subContWrap .inpBox input {padding:0 10px 2px;height:32px;color:#666;font-size:14px} .subContWrap .inpSrch .btnSrch {width:68px;height:32px;font-size:16px;font-weight:500;line-height:30px;border-radius:5px} .subContWrap .selectBox .btnSelect:after {width:6px;height:6px;right:10px;top:42%} .subContWrap .selectBox .selectOption > li > button {font-size:14px;color:#666;height:32px;padding:0 9px} .subContWrap .filterWrap {margin-top:53px;-webkit-justify-content:flex-end;-ms-justify-content:flex-end;-o-justify-content:flex-end;-moz-justify-content:flex-end;justify-content:flex-end;} .subContWrap .filterWrap .selectBox {width:103px} .subContWrap .filterWrap .selectBox2 {width:170px} .subContWrap .filterWrap .inpSrch {margin-left:5px;width:373px} /* table col type */ .subContWrap .tblColTyp thead th {height:44px;font-size:16px} .subContWrap .tblColTyp tbody td {padding:9px 0;font-size:16px;text-align:center} .subContWrap .tblImgTit {margin:0;padding:0 20px} .subContWrap .tblImgTit .img {margin-right:30px;width:140px;height:77px} .subContWrap .tblImgTit .tit {width:calc(100% - 170px);text-align:left} /* table col type2 */ .subContWrap .tblColTyp2.tblSm {margin-top:25px} .subContWrap .tblColTyp2.tblSm th {padding:11px 10px 12px ;font-size:16px} .subContWrap .tblColTyp2.tblSm td {padding:25px 19px 26px;font-size:16px} .subContWrap .tblColTyp2.tblSm + .bulRefer {margin-top:17px} /* table row type */ .subContWrap .tblRowTyp {margin-top:53px} .subContWrap .tblRowTyp.tblSm {margin-top:27px} .subContWrap .tblRowTyp th {padding:7px 10px 9px;height:auto;font-weight:400;font-size:16px;text-align:left} .subContWrap .tblRowTyp.tblSm th, .subContWrap .tblRowTyp.tblSm td {font-size:16px;padding:20px 19px 25px} .subContWrap .tblRowTyp td {padding:8px 10px} .subContWrap .tblRowTyp .dashList {margin:5px 0} .subContWrap .tblRowTyp.tblSm .dotList {margin-top:4px} .subContWrap .tblRowTyp.tblSm .dotList.typSm > li {line-height:1.5} .subContWrap .tblRowTyp.tblSm .dotList.typSm > li + li {margin-top:0} /* table col + row type */ .subContWrap .tblColRowTyp {margin-top:25px} .subContWrap .tblColRowTyp thead th {padding:11px 0 12px;font-size:16px} .subContWrap .tblColRowTyp tbody th, .subContWrap .tblColRowTyp tbody td {padding:24px 14px;font-size:16px;} [class^="tbl"] col.w88 {width:88px !important} [class^="tbl"] col.w90 {width:90px !important} [class^="tbl"] col.w105 {width:105px !important} [class^="tbl"] col.w110 {width:110px !important} [class^="tbl"] col.w130 {width:130px !important} [class^="tbl"] col.w135 {width:135px !important} [class^="tbl"] col.w150 {width:150px !important} [class^="tbl"] col.w160 {width:160px !important} [class^="tbl"] col.w170 {width:170px !important} [class^="tbl"] col.w180 {width:180px !important} [class^="tbl"] col.w240 {width:240px !important} [class^="tbl"] col.w250 {width:250px !important} [class^="tbl"] col.w260 {width:260px !important} [class^="tbl"] col.w355 {width:355px !important} /* bullet text */ .subContWrap .dotList {margin-left:6px;margin-top:10px} .subContWrap .dotList > li:before {top:12px} .subContWrap .dotList > li + li {margin-top:11px} .subContWrap .dotList.typSm > li {padding-left:8px;font-size:16px} .subContWrap .dotList.typSm > li:before {top:13px;width:3px;height:3px} .subContWrap .dotList.typSm > li + li {margin-top:22px} .subContWrap .dotList .dashList.typSm {margin-top:12px;margin-left:2px} .subContWrap .dotList .dashList.typSm > li {padding-left:15px;font-size:16px} .subContWrap .dotList .dashList.typSm > li:before {width:6px;top:12px} .subContWrap .dotList .dashList.typSm > li + li {margin-top:11px} .subContWrap .dashList {margin-left:2px} .subContWrap .dashList > li {padding-left:8px;} .subContWrap .dashList > li:before {top:15px;width:5px} .subContWrap .dashList > li + li {margin-top:6px} .subContWrap .dashList.typSm {margin-top:0;margin-left:5px} .subContWrap .dashList.typSm > li {padding-left:8px;font-size:16px} .subContWrap .dashList.typSm > li:before {width:5px;top:13px} .subContWrap .dashList.typSm > li + li {margin-top:0} .subContWrap .arrList {margin-left:4px;margin-top:27px} .subContWrap .arrList > li {padding-left:22px;} .subContWrap .arrList > li:before {top:10px;width:7px;height:10px;} .subContWrap .arrList > li + li {margin-top:30px} .subContWrap .numList {margin-top:11px} .subContWrap .numList li {padding-left:17px} .subContWrap .numList li + li {margin-top:6px} .subContWrap .circleNumList {margin-top:9px;margin-left:27px} .subContWrap .circleNumList > li {padding-left:23px} .subContWrap .circleNumList > li + li {margin-top:26px} .subContWrap .circleNumList > li > span {top:1px} .subContWrap .circleNumList > li > .dashList {margin-top:6px;margin-left:-3px;color:#444} .subContWrap .circleNumList > li > .dashList > li + li {margin-top:2px} .subContWrap .bulRefer {padding-left:20px;line-height:1.5} .subContWrap .bulRefer.typSm {font-size:16px} .subContWrap .bulStar {padding-left:10px;line-height:1.5} .subContWrap .bulStar:before {left:0;top:1px} /* paging */ .subContWrap .paging {margin-top:60px} .subContWrap .paging > a {width:31px;height:31px;background-size:auto 13px} .subContWrap .paging > .first {background-size:12px auto} .subContWrap .paging > .prev {background-size:7px auto} .subContWrap .paging > .next {background-size:7px auto} .subContWrap .paging > .last {background-size:12px auto} .subContWrap .paging .pagingNum li a {width:31px;height:31px;line-height:29px} /* button */ .subContWrap .btnArr {margin-top:20px;height:36px;font-size:16px;line-height:33px;padding:0 22px 0 20px;border:1px solid #d5d5d5;letter-spacing:-1px} .subContWrap .btnArr span {padding-right:25px} .subContWrap .btnArr span:after {width:7px;height:7px;border:solid #222;border-width:1px 1px 0 0;} .subContWrap .btnWrap .btnArr {margin-top:36px;letter-spacing:-0.7px;} .subContWrap .btnWrap .btnArr:hover {background-color: #137fd2;color: white;} .subContWrap .btnType1 {padding:0 15px;height:42px;font-size:18px;border-radius:5px} .subContWrap .btnType2 {padding:0 15px;height:42px;font-size:18px;border-radius:5px} /* tab */ .subContWrap .tabWrap {margin-top:53px} .subContWrap .tabWrap .tabList a {padding:7px 0 9px;font-size:16px;} .subContWrap .tabCont {padding-top:52px} .subContWrap .tabWrap.ty3 .tabList > li {width:33.33%} .subContWrap .tabWrap.ty3 .tabList > li:nth-child(2n + 1) {margin-left:-1px} .subContWrap .tabWrap.ty4 .tabList {margin:0 -5px 0 1px} .subContWrap .tabWrap.ty4 .tabList > li {margin-top:0;margin-left:-1px;width:calc(100% / 6)} .subContWrap .tabWrap.ty4 .tabList > li + li.on {margin-left:0} .subContWrap .tabWrap.ty4 .tabList > li.on {margin-left:0} .subContWrap .moreList {margin-top:20px;border:1px solid #ddd} .subContWrap .moreList li {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;height:40px;font-size:16px;} .subContWrap .moreList li + li {border-top:1px solid #ddd} .subContWrap .moreList li .tit {width:150px;color:#fff;background:#444;border-right:1px solid #ddd;text-align:center;line-height:38px} .subContWrap .moreList li .txt {width:calc(100% - 150px);padding:3px 10px;} .subContWrap .moreList li .txt a:hover {border-bottom:1px solid #444} .subContWrap .shareFundBox {margin-top:15px;padding:20px 50px 30px 20px} .subContWrap .shareFundBox li {padding-left:240px;background-size:190px;background-position:left 0;line-height:1.3} .subContWrap .shareFundBox li + li {margin-top:42px} .subContWrap .shareFundBox .txt {margin-top:9px;line-height:1.5} .subContWrap .shareFundBox .fund01 {padding:48px 0 30px 240px} .subContWrap .boxGray {margin-top:51px;padding:24px;text-align:center} .subContWrap .boxGray p {line-height:1.5} .subContWrap .boxGray + .subTit2 {margin-top:53px} /* 사회공헌 활동 */ .subContWrap .attachFile {padding-left:33px;background-size:25px auto;background-position:left 5px} .subContWrap .attachFile + .attachFile {margin-top:3px} .subContWrap .studyDetail > li {padding-left:15px} .subContWrap .studyDetail > li:before {width:6px;top:14px} .subContWrap .studyDetail > li + li {margin-top:10px} /* 인재채용 */ .subContWrap .imgRecruit1 {margin-top:35px} .subContWrap .imgRecruit4 {margin-top:53px} /* CI 소개 */ .subContWrap .imgCi1 {margin-top:15px} .subContWrap .imgCi1 .btnArr {bottom:40px} /* 캐릭터 소개 */ .subContWrap .imgCharacter1 {margin-top:15px} .subContWrap .imgCharacter1 .btnArr {bottom:40px} .subContWrap .characterList {margin-top:15px} .subContWrap .characterList li {width:calc((100% - 80px) / 3);margin-top:0} /* 열린경영 - 경영정보 */ .subContWrap .txtName {margin-top:40px;font-size:18px} .subContWrap .txtName strong {font-size:28px} .subContWrap .roundBoxGray {margin-top:16px;padding:8px 28px 9px;border-radius:15px} .subContWrap .imgBusiness1 {margin-top:12px} .subContWrap .imgBusiness2 {margin-top:25px} .subContWrap .imgBusiness3 {width:712px;margin:4px auto 0} .subContWrap .imgBusiness4 {margin-top:14px} .subContWrap .imgBusiness5 {margin-top:14px} .subContWrap .imgBusiness6 {margin-top:26px} .subContWrap .imgBusiness7 {margin-top:26px} .subContWrap .imgBusiness7 + .subTit3 {margin-top:60px} .subContWrap .roundBoxWhList {margin-top:-5px} .subContWrap .roundBoxWh {margin-top:20px;width:calc((100% - 20px) / 2);height:130px;padding:0 29px;border-radius:15px} .subContWrap .roundBoxWh .tit {color:#222} .subContWrap .roundBoxWh .dotList {margin:8px 0 0 2px} .subContWrap .roundBoxWh .dotList > li {padding-left:10px} .subContWrap .roundBoxWh .dotList > li:before {top:12px;width:4px;height:4px} .subContWrap .roundBoxWhList.typ2 {margin-top:-5px} .subContWrap .roundBoxWhList.typ2 .roundBoxWh {width:calc((100% - 60px) / 4);height:90px} .subContWrap .roundBoxWhList.typ2 .roundBoxWh p {line-height:1.4} .subContWrap .roundBoxWhList + .subTit3 {margin-top:53px} .subContWrap .roundBoxGray + .subTit2 {margin-top:53px} .subContWrap .subDesc2 + .btnWrap .btnArr {margin-top:14px} .subContWrap .subTit3.titBtn .btnDownload {right:-35px;top:0;width:30px;height:30px;background:url('../images/icon_download_pc.png') no-repeat center / 21px auto} .subContWrap .subTitWrap {margin-top:45px} .subContWrap .subTitWrap .selectBox {top:55%} .subContWrap .selYear {width:83px} .subContWrap .btnDownloadR {margin-top:8px;padding:0 60px 0 18px;height:36px;font-size:16px;letter-spacing:-1.5px;background:url('../images/icon_download_pc.png') no-repeat calc(100% - 20px) 7px / 21px auto} .subContWrap .btnDownloadR + .subTit2 {margin-top:32px} .subContWrap .faqList {margin-left:27px;margin-top:8px} .subContWrap .faqList > li {font-weight:500} .subContWrap .faqList > li .dashList > li {font-weight:400} .subContWrap .strategyList > li + li {margin-top:7px} .subContWrap .underLine {position:relative;display:inline-block} .subContWrap .underLine:before {content:'';display:block;position:absolute;bottom:-6px;width:100%;height:1px;background:#727272} /* 열린경영 - 경영공시 */ .subContWrap .bnrAlioList {margin-top:0;display:block;position:absolute;right:0;top:-120px} .subContWrap .bnrAlioList .btnBnrAlio {display:block;width:196px;height:60px} .subContWrap .bnrAlioList .btnBnrAlio + .btnBnrAlio {margin-top:10px} .subContWrap .bnrAlioList + .subTit2 {margin-top:70px} .subContWrap .listColTyp {margin-top:37px;padding:40px 19px;border:1px solid #ddd} .subContWrap .listColTyp ul li {width:25%;height:80px;} .subContWrap .listColTyp ul li:not(:nth-child(4n + 1)) {border-left:1px solid #aaa} .subContWrap .listColTyp ul li a {font-size:16px} .subContWrap .listColTyp ul li:nth-child(4n + 1) {background:#fff} .subContWrap .listColTyp ul li:nth-child(4n + 2) {background:#fff} .subContWrap .listColTyp ul li:nth-child(8n + 1) {background:#f9fcff} .subContWrap .listColTyp ul li:nth-child(8n + 2) {background:#f9fcff} .subContWrap .listColTyp ul li:nth-child(8n + 3) {background:#f9fcff} .subContWrap .listColTyp ul li:nth-child(8n + 4) {background:#f9fcff} /* 정보공개 */ .subContWrap .imginformation1 {margin-top:34px} .subContWrap .adminTit {margin:0 38px} .subContWrap .tblColTyp tbody td.tblLinkTit {padding:0 28px} .subContWrap .btnUpLoad {margin-top:20px;width:90px;height:42px;font-size:18px;border-radius:5px} .subContWrap .filterWrap.selColWrap {margin-top:8px;-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex} .subContWrap .selecBoxWrap {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex} .subContWrap .selecBoxWrap .selectBox:first-of-type {width:132px} .subContWrap .selecBoxWrap .selectBox:last-of-type {width:102px} .subContWrap .selecBoxWrap .selectBox + .selectBox {margin-left:5px} .subContWrap .selecBoxWrap.col3 .selectBox {width:82px} .subContWrap .selecBoxWrap.col3 .selectBox:last-of-type {width:105px} .subContWrap .filterWrap.selColWrap .inpSrch {margin-top:0;width:auto;margin-top:0} .subContWrap .filterWrap.selColWrap .inpSrch input {width:300px} /* .subContWrap .graphBox1 {height:342px} */ .subContWrap .graphBox1 #chart1 {padding: 15px 15px 15px 15px;} /* .subContWrap .graphBox2 {height:470px} */ .subContWrap .graphBox2 #chart2 {padding-top: 10px;} /* .subContWrap .graphBox3 {height:480px} */ .subContWrap .graphBox3 #chart3 {padding-top: 10px;} .subContWrap .imgBnrBox {margin-top:35px} .subContWrap .imgBnrBox + .selColWrap {margin-top:60px} .subContWrap .iframArea {margin-top:60px} .subContWrap .tblRowTyp.ty2 th, .subContWrap .tblRowTyp.ty2 td {padding:15px 20px;font-size:18px} .subContWrap .tblSelWrap .selectBox .btnSelect {height:50px;padding:0 40px 0 20px;font-size:16px;color:#444} .subContWrap .tblSelWrap .selectBox .btnSelect:after {right:23px;width:8px;height:8px} .subContWrap .tblSelWrap .selectBox .selectOption {top:50px} .subContWrap .tblSelWrap .selectBox .selectOption > li > button {padding:0 20px;height:50px;font-size:16px} .subContWrap .tblInpBox input {height:50px;padding:0 20px;font-size:16px} .subContWrap .tblEmailBox {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-align-items:center;-moz-align-items:center;-o-align-items:center;-ms-align-items:center;align-items:center;} .subContWrap .tblEmailBox input {padding:0 20px;margin-top:0 !important;width:252px !important;height:50px;font-size:16px} .subContWrap .tblEmailBox input:last-of-type {float:none} .subContWrap .tblEmailBox .emailDot {margin:0 10px;line-height:50px} .subContWrap .tblEmailBox .selectBox {float:none;margin-left:13px;margin-top:0;width:146px} .subContWrap .tblTxtArea textarea {height:170px;font-size:16px;padding:20px} .subContWrap .tblInpFile input {width:calc(100% - 104px)} .subContWrap .tblInpFile input[type="file"] {width:400px;} .subContWrap .tblInpFile .btnUpLoad {width:86px;height:42px;font-size:16px} .subContWrap .tblInpFile div .btnDel {margin-top:0;margin-left:10px; width:66px;height:30px;font-size:12px;color:#fff;background:#555;border-radius:5px} .subContWrap .tblPw input {width:220px} .subContWrap .tblPw .inpTxt {display:inline-block;margin-left:15px;color:#f24724} .subContWrap .tblRowTyp.ty2.tblData th, .subContWrap .tblRowTyp.ty2.tblData td {padding:27px 20px} .subContWrap .brdBtm {font-size:20px;padding-bottom:12px;margin:54px 0 20px} /* 설문조사 팝업 */ .subPopWrap {position:static;width:100%;padding:20px 0 40px;transform:none} .subPopWrap .popTit {padding:27px 0;font-size:18px} .subPopWrap .surveyWrap {margin:40px;padding:31px 39px;height:55vh} .subPopWrap .surveyWrap .surveyQ {padding-left:15px;font-size:16px} .subPopWrap .surveyWrap .surveyQ:not(:first-of-type) {margin-top:50px} .subPopWrap .surveyWrap .surveyQ span {position:absolute;left:0;top:0} .subPopWrap .surveyWrap .surveyA {margin:10px 16px} .subPopWrap .surveyWrap .surveyRdoList li + li {margin-top:15px} .subPopWrap .surveyWrap .rdoBox input[type="radio"] + label {padding-left:27px;font-size:16px} .subPopWrap .surveyWrap .rdoBox input[type="radio"] + label:before {top:4px;width:19px;height:19px} .subPopWrap .surveyWrap .rdoBox input[type="radio"]:checked + label:before {background-position:0 -19px} .subPopWrap .surveyWrap .surveyA .inpBox {margin-top:12px} .subPopWrap .surveyWrap .surveyA .inpBox input {height:36px} .subContWrap .graphDiv {display:flex; justify-content: space-between} .subContWrap .graphBox2 {width:430px} .subContWrap .graphBox3 {width:430px} } .subContWrap * {box-sizing:border-box;word-break:break-all;white-space:normal} .ir {overflow:hidden;display:block;position:absolute !important;left:0;top:0;z-index:-1;border:0;width:1px;height:1px;clip:rect(1px, 1px, 1px, 1px);text-indent:-9999px} .subContWrap input, textarea {-webkit-appearance:none;-webkit-border-radius:0;border-radius:0} .subContWrap a:hover {color:inherit} .moShow {display:block !important} .pcShow {display:none !important} .mainWrap * {box-sizing:border-box} .subContWrap img {margin:0} .subContWrap table {width:100%;table-layout:fixed} .subContWrap table th, .subContWrap table td {border-spacing:0;border-collapse:collapse;word-wrap:break-word;vertical-align:middle;border:0} .subContWrap caption {margin:0;width:0;height:0;text-indent:-9999px;} .subContWrap input::placeholder {color:#444;font-weight:300} .subContWrap input:-webkit-input-placeholder {color:#444;font-weight:300} .subContWrap input::-webkit-input-placeholder {color:#444;font-weight:300} .subContWrap input::-moz-placeholder {color:#444;font-weight:300} .subContWrap input:-moz-placeholder {color:#444;font-weight:300} .subContWrap .tc {text-align:center !important} .subContWrap .tr {text-align:right !important} .subContWrap .tl {text-align:left !important} .subContWrap .fcBk1 {color:#222 !important} .subContWrap .fcBk2 {color:#444 !important} .subContWrap .fcBl1 {color:#137fd2 !important} .subContWrap .fcBl2 {color:#003586 !important} .subContWrap .fcRd1 {color:#f24724 !important} .subContWrap .fw400 {font-weight:400 !important} .subContWrap .fw500 {font-weight:500 !important} .subContWrap .fs12 {font-size:12px !important} .subContWrap .fs18 {font-size:18px !important} .subContWrap .inrGap0 {padding-left:0 !important;padding-right:0 !important} .subContWrap .ellipsis {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .subContWrap .mgt0 {margin-top:0 !important} .subContWrap .mgt5 {margin-top:5px !important} .subContWrap .mgt10 {margin-top:10px !important} .subContWrap .mgt15 {margin-top:15px !important} .subContWrap .mgt20 {margin-top:20px !important} .subContWrap .mgt25 {margin-top:25px !important} .subContWrap .mgt35 {margin-top:35px !important} .subContWrap .mgt1020 {margin-top:10px !important} .subContWrap .mgt2540 {margin-top:25px !important} .subContWrap .mgt1530 {margin-top:15px !important} .subContWrap .mgt1855 {margin-top:18px !important} .subContWrap .mgt2035 {margin-top:20px !important} .subContWrap .mgt2555 {margin-top:25px !important} .subContWrap .mgt3040 {margin-top:30px !important} .subContWrap .mgt3552 {margin-top:35px !important} .subContWrap .mgt2026 {margin-top:20px !important} .subContWrap .mgl2426 {margin-left:24px !important} .subContWrap .mgl1025 {margin-left:10px !important} .subContWrap {position:relative;/* padding-top:30px */} .subContWrap .subContInner {padding:0 20px} .subContWrap .subContInner .subTit1 {margin-top:0;font-size:30px;font-weight:500;color:#222} .subContWrap .subTxt1 {margin-top:5px !important;font-size:14px} .subContWrap .copyBox {position:relative;margin-top:30px;padding-right:95px} .subContWrap .copyBox .copyTxt {position:relative;font-size:22px;font-weight:700;line-height:1.5;letter-spacing:-0.7px;z-index:1} .subContWrap .subCopyTxt {font-size:16px;font-weight:500} .subContWrap .copyBox .copyImg {position:absolute;right:0} .subContWrap .copyBox .copyImg.share1 {top:8px;width:83.5px;height:84.5px} .subContWrap .copyBox .copyImg.share4 {top:8px;width:110px;height:110px} .subContWrap .copyBox .copyImg.share5 {top:8px;width:125px;height:88.5px} .subContWrap .copyBox .copyImg.history1 {top:8px;width:158px;height:136px} .subContWrap .copyBox .copyImg.history2 {top:8px;width:130px;height:121px} .subContWrap .copyBox .copyImg.business1 {top:25px;width:103.5px;height:86px} .subContWrap .copyBox .copyImg.socialvalue {top:33px;width:101px;height:135.5px} .subContWrap .copyBox .copyImg.committee {top:10px;width:119.5px;height:143px} .subContWrap .copyBox.information1 {padding-right:130px} .subContWrap .copyBox.information1 .copyImg {top:7px;right:0;width:125px;height:90px} .subContWrap .copyBox.information2 {padding-right:155px} .subContWrap .copyBox.information2 .copyImg {top:7px;right:0;width:112px;height:100px} .subContWrap .imgContBox1 {margin-top:35px} .subContWrap .subDesc1 {margin-top:25px;position:relative;font-size:14px;color:#222;line-height:1.5} .subContWrap .copyBox + .subDesc1 {margin-top:30px} .subContWrap .subCopyTxt + .subDesc1.ty1 {margin-top:12px} .subContWrap .subDesc1.ty1 {margin-top:20px} .subContWrap .subDesc1 + .subDesc1 {margin-top:22px} .subContWrap .subDesc2 {margin-top:11px;font-size:12px} .subContWrap .subDesc3 {margin:8px 0 0 24px;font-size:14px;line-height:1.5} .subContWrap .imgTxtShareHead {margin-top:10px;text-align:right} .subContWrap .imgTxtShareHead img {width:138px} /* title */ .subContWrap .subTit2 {position:relative;margin:30px 0 0 0;padding-left:0;font-size:16px;font-weight:500;letter-spacing:-0.6px} .subContWrap .subTit2:before {display:none} .subContWrap .subTit2.bulSquare {padding-left:23px} .subContWrap .subTit2.bulSquare:before {content:'';display:block;position:absolute;left:0;top:6px;width:14px;height:14px;background:url('../images/bullet_big.png') no-repeat center / 100% auto} .subContWrap .subTit3 {position:relative;margin:23px 0 0 0;font-size:14px;font-weight:400} .subContWrap .subTit3.bulArr {padding-left:23px} .subContWrap p.subTit3.bulArr {color:#222;line-height:1.5} .subContWrap .subTit3.bulArr:before {content:'';display:block;position:absolute;left:0;top:5px;width:12px;height:12px;background:url('../images/bullet_small.png') no-repeat center / 100% auto} .subContWrap .subTit2 + p.subTit3 {margin-top:12px} .subContWrap .subTit2 + .dotList {margin-top:7px} .subContWrap p.subTit3 + .dotList {margin-top:8px} .subContWrap .dotList + p.subTit3 {margin-top:14px} .subContWrap .filterWrap {margin-top:43px;-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:space-between;-moz-justify-content:space-between;-ms-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;} .subContWrap .imgContBox2 {margin-top:15px} /* select */ .subContWrap .selectBox {display:inline-block;position:relative;z-index:1} .subContWrap .selectBox .btnSelect {position:relative;width:100%;height:27px;padding:0 20px 0 4px;color:#444;font-size:12px;font-weight:400;text-align:left;background:#fff;border:1px solid #ddd} .subContWrap .selectBox .btnSelect:after {content:'';display:block;position:absolute;right:7px;top:40%;transform:translateY(-50%) rotate(45deg);width:6px;height:6px;border:solid #303030;border-width:0 1px 1px 0} .subContWrap .selectBox.on .btnSelect {border-bottom-color:#fff} .subContWrap .selectBox.on .btnSelect:after {top:60%;transform:translateY(-50%) rotate(-135deg)} .subContWrap .selectBox .selectOption {display:none;position:absolute;top:27px;width:100%;border:solid #ddd;border-width:0 1px 1px 1px;background:#fff} .subContWrap .selectBox.on .selectOption {display:block} .subContWrap .selectBox .selectOption > li > button {padding:0 4px;width:100%;height:27px;color:#444;font-size:12px;text-align:left} .subContWrap .inpBox input {width:100%;height:27px;padding:0 4px 2px;color:#444;font-size:12px;border:1px solid #ddd} .subContWrap .inpSrch {position:relative;padding-right:48px} .subContWrap .inpSrch .btnSrch {position:absolute;right:0;top:0;width:43px;height:27px;color:#fff;font-size:12px;font-weight:500;background:#003586;border:1px solid #002763;border-radius:3px} .subContWrap .filterWrap .selectBox {width:28%} .subContWrap .filterWrap .inpSrch {width:calc(100% - 5px - 28%)} /* table col type */ .subContWrap .tblColTyp {margin-top:20px} .subContWrap .tblColTyp thead th {height:38px;font-size:14px;color:#222;font-weight:500;border-top:2px solid #003586;border-bottom:1px solid #e5e5e5;background:#f7f8f8} .subContWrap .tblColTyp thead th + th {border-left:1px solid #ddd} .subContWrap .tblColTyp tbody td {padding:10px;font-size:14px;color:#444;border-bottom:1px solid #e5e5e5} .subContWrap .tblColTyp tbody td + td {border-left:1px solid #ddd} .subContWrap .tblImgTit {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-align-items:center;-moz-align-items:center;-ms-align-items:center;-o-align-items:center;align-items:center;margin:0 -10px} .subContWrap .tblImgTit .img {margin-right:15px;width:100px;height:55px;overflow:hidden;background:#ddd} .subContWrap .tblImgTit .tit {width:calc(100% - 115px)} /* table col type2 */ .subContWrap .tblColTyp2 {margin-top:37px;border:solid #ddd;border-width:1px 0 1px 1px} .subContWrap .tblColTyp2 th {height:34px;color:#222;font-weight:400;background:#f5f5f5;border-top:1px solid #ddd} .subContWrap .tblColTyp2 th, .subContWrap .tblColTyp2 td {border-right:1px solid #ddd} .subContWrap .tblColTyp2 tr:first-of-type th {border-top:0} .subContWrap .tblColTyp2 td {min-height:34px;padding:6px 15px 7px;color:#444;border-top:1px solid #ddd} .subContWrap .tblColTyp2.tblSm {margin-top:12px} .subContWrap .tblColTyp2.tblSm th {padding:6px 10px 7px;font-size:12px} .subContWrap .tblColTyp2.tblSm td {padding:11px 12px 12px;font-size:12px;line-height:1.5} .subContWrap .tblColTyp2.tblSm + .bulRefer {margin-top:17px} /* table row type */ .subContWrap .tblRowTyp {margin-top:12px;border:1px solid #ddd} .subContWrap .tblRowTyp th:not(:first-child), .subContWrap .tblRowTyp td:not(:first-child) {border-left:1px solid #ddd} .subContWrap .tblRowTyp tr:not(:first-of-type) th, .subContWrap .tblRowTyp tr:not(:first-of-type) td {border-top:1px solid #ddd} .subContWrap .tblRowTyp th {padding:0 8px;color:#222;font-size:14px;font-weight:400;background:#f5f5f5;text-align:left;} .subContWrap .tblRowTyp.tblSm th {padding:10px 10px 13px;color:#222;font-size:12px;font-weight:500} .subContWrap .tblRowTyp.tblSm td {padding:10px 10px 13px;color:#444;font-size:12px} .subContWrap .tblRowTyp.tblSm .dotList {margin-top:6px} .subContWrap .tblRowTyp.tblSm .dotList.typSm > li + li {margin-top:2px} /* table col + row type */ .subContWrap .tblColRowTyp {margin-top:13px;border:1px solid #ddd} .subContWrap .tblColRowTyp thead th {padding:8px 0 10px;height:auto;font-size:12px;font-weight:500;color:#222;background:#f5f5f5} .subContWrap .tblColRowTyp thead th + th {border-left:1px solid #ddd} .subContWrap .tblColRowTyp tbody th, .subContWrap .tblColRowTyp tbody td {padding:10px;height:auto;font-size:12px;border-top:1px solid #ddd;background:#fff} .subContWrap .tblColRowTyp tbody th {color:#222;font-weight:500} .subContWrap .tblColRowTyp tbody th + td {border-left:1px solid #ddd} /* paging */ .subContWrap .paging {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;justify-content:center;margin-top:30px;color:#444;font-size:14px} .subContWrap .paging > a {margin:0 3px;width:25px;height:25px;border:1px solid #e5e5e5;border-radius:3px;} .subContWrap .paging > .first {background:url('../images/board_arrow_first.png') no-repeat center / 10px auto} .subContWrap .paging > .prev {background:url('../images/board_arrow_prev.png') no-repeat center / 6px auto} .subContWrap .paging > .next {background:url('../images/board_arrow_prev.png') no-repeat center / 6px auto;transform:rotate(180deg)} .subContWrap .paging > .last {background:url('../images/board_arrow_first.png') no-repeat center / 10px auto;transform:rotate(180deg)} .subContWrap .paging > .first.on {background:#137fd2 url('../images/board_arrow_first_white.png') no-repeat center / 10px auto} .subContWrap .paging > .prev.on {background:#137fd2 url('../images/board_arrow_prev_white.png') no-repeat center / 6px auto} .subContWrap .paging > .next.on {background:#137fd2 url('../images/board_arrow_prev_white.png') no-repeat center / 6px auto} .subContWrap .paging > .last.on {background:#137fd2 url('../images/board_arrow_first_white.png') tno-repeat center / 10px auto} .subContWrap .paging .pagingNum {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;} .subContWrap .paging .pagingNum li {margin:0 3px;} .subContWrap .paging .pagingNum li a {display:block;width:25px;height:25px;font-size:14px;color:#444;border:1px solid #e5e5e5;border-radius:3px;text-align:center;line-height:23px} .subContWrap .paging a.on {background:#137fd2;border-color:#0c6db8;color:#fff !important} /* bullet text */ .subContWrap .dotList {margin-left:4px;margin-top:12px} .subContWrap .dotList > li {position:relative;padding-left:20px} .subContWrap .dotList > li:before {content:'';display:block;position:absolute;left:0;top:9px;width:4px;height:4px;border-radius:50%;background:#666;line-height:1.5} .subContWrap .dotList > li + li {margin-top:15px} .subContWrap .dotList.typSm > li {padding-left:7px;font-size:12px} .subContWrap .dotList.typSm > li:before {top:9px;width:2px;height:2px;} .subContWrap .dotList.typSm > li + li {margin-top:18px} .subContWrap .dotList .dashList.typSm {margin-top:13px;margin-left:0} .subContWrap .dotList .dashList.typSm > li {line-height:1.5} .subContWrap .dotList .dashList.typSm > li:before {width:5px;top:9px} .subContWrap .dotList .dashList.typSm > li + li {margin-top:13px} .subContWrap .dashList {margin-top:10px} .subContWrap .dashList > li {position:relative;padding-left:7px;} .subContWrap .dashList > li:before {content:'';display:block;position:absolute;left:0;top:11px;width:4px;height:1px;background:#444} .subContWrap .dashList > li + li {margin-top:5px} .subContWrap .dashList.typSm {margin-top:3px;margin-left:3px} .subContWrap .dashList.typSm > li {padding-left:9px;font-size:12px} .subContWrap .dashList.typSm > li:before {width:4px;top:10px} .subContWrap .dashList.typSm > li + li {margin-top:0} .subContWrap .arrList {margin-left:3px;margin-top:13px} .subContWrap .arrList > li {position:relative;padding-left:20px;color:#222;line-height:1.5} .subContWrap .arrList > li:before {content:'';display:block;position:absolute;left:0;top:7px;width:4.5px;height:6.5px;background:url('../images/bullet_arrow_blue.png') no-repeat center / 100% auto} .subContWrap .arrList > li + li {margin-top:12px} .subContWrap .numList {margin-top:8px;} .subContWrap .numList li {position:relative;padding-left:14px} .subContWrap .numList li > span {position:absolute;left:0;top:0} .subContWrap .numList li + li {margin-top:5px} .subContWrap .circleNumList {margin-top:12px} .subContWrap .circleNumList > li {position:relative;padding-left:17px;color:#222} .subContWrap .circleNumList > li + li {margin-top:22px} .subContWrap .circleNumList > li > span {position:absolute;left:0;top:0} .subContWrap .circleNumList > li > .dashList {margin-top:6px;margin-left:-3px;color:#444} .subContWrap .circleNumList > li > .dashList > li + li {margin-top:6px} .subContWrap .bulRefer {position:relative;padding-left:15px} .subContWrap .bulRefer:before {content:'※';display:block;position:absolute;left:0;top:0} .subContWrap .bulRefer + .bulRefer {margin-top:5px} .subContWrap .bulRefer.typSm {font-size:12px} .subContWrap .bulStar {position:relative;padding-left:7px} .subContWrap .bulStar:before {content:'*';display:block;position:absolute;left:0;top:1px} /* button */ .subContWrap .btnListMore {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:space-between;-moz-justify-content:space-between;-ms-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;margin-top:20px;height:50px;border:1px solid #222;background:#444} .subContWrap .btnListMore .btnPrev {width:58px;height:48px;background:url('../images/icon_list_prev_w.png') no-repeat center / 28px auto} .subContWrap .btnListMore .btnNext {width:58px;height:48px;background:url('../images/icon_list_next_w.png') no-repeat center / 28px auto} .subContWrap .btnListMore .btnList {width:58px;height:48px;background:url('../images/icon_list_bar_w.png') no-repeat center / 25px auto} .subContWrap .btnArr {margin-top:16px;display:inline-block;height:27px;font-size:12px;line-height:24px;padding:0 16px 0 14px;border:1px solid #ddd;border-radius:20px;letter-spacing:-0.5px;white-space:nowrap} .subContWrap .btnArr:hover {color:#222} .subContWrap .btnArr span {padding-right:20px;position:relative} .subContWrap .btnArr span:after {content:'';display:block;position:absolute;right:0;top:53%;transform:translateY(-50%) rotate(45deg);width:6px;height:6px;border:solid #444;border-width:1px 1px 0 0;} .subContWrap .btnArr + .btnArr {margin-left:10px} .subContWrap .btnWrap.flex {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;justify-content:center;} .subContWrap .btnWrap.flex.flexR {-webkit-justify-content:flex-end;-ms-justify-content:flex-end;-o-justify-content:flex-end;-moz-justify-content:flex-end;justify-content:flex-end} .subContWrap .btnWrap.flex button + button {margin-left:10px} .subContWrap .btnType1 {padding:0 11px;height:32px;color:#222;font-size:14px;background:#ccc;border:1px solid #939393;border-radius:3px} .subContWrap .btnType2 {padding:0 11px;height:32px;color:#fff;font-size:14px;background:#003586;border:1px solid #002866;border-radius:3px} /* tab */ .subContWrap .tabWrap {margin-top:35px} .subContWrap .tabWrap .tabList {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;-moz-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;} .subContWrap .tabWrap .tabList > li {-webkit-flex:1;-ms-flex:1;-moz-flex:1;-o-flex:1;flex:1;-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;-o-justify-content:center;justify-content:center;-webkit-align-items:center;-moz-align-items:center;-ms-align-items:center;-o-align-items:center;align-items:center;border:1px solid #ddd;} .subContWrap .tabWrap .tabList > li + li {margin-left:-1px} .subContWrap .tabWrap .tabList > li + li.on {margin-left:0} .subContWrap .tabWrap .tabList a {width:100%;padding:4px 0 5px;font-size:12px;text-align:center;color:#222;word-break:break-all;white-space:normal} .subContWrap .tabWrap .tabList > li.on {background:#003586;border-color:#002866;z-index:1} .subContWrap .tabWrap .tabList > li.on a {color:#fff;font-weight:500} .subContWrap .tabCont {display:none;padding-top:27px} .subContWrap .tabCont.on {display:block} .subContWrap .tabWrap.ty3 .tabList > li {-webkit-flex:none;-moz-flex:none;-ms-flex:none;-o-flex:none;flex:none;width:50%;margin-top:-1px} .subContWrap .tabWrap.ty3 .tabList > li:nth-child(2n) {margin-left:-1px} .subContWrap .tabWrap.ty3 .tabList > li + li {margin-left:0} .subContWrap .tabWrap.ty4 {margin-top:20px} .subContWrap .tabWrap.ty4 .tabList {margin:1px -3px 0 1px} .subContWrap .tabWrap.ty4 .tabList > li {-webkit-flex:none;-moz-flex:none;-ms-flex:none;-o-flex:none;flex:none;width:33.33%;margin-top:-1px;margin-left:-1px} .subContWrap .tabWrap.ty4 .tabList > li + li.on {margin-left:-1px} .subContWrap .shareFundBox {margin-top:17px;padding:15px 10px 18px ;border:1px solid #ddd} .subContWrap .shareFundBox li {padding-left:105px;background-repeat:no-repeat;background-size:95px;background-position:left 5px} .subContWrap .shareFundBox li + li {margin-top:25px} .subContWrap .shareFundBox .fund01 {background-image:url('../images/img_share_fund01.png')} .subContWrap .shareFundBox .fund02 {background-image:url('../images/img_share_fund02.png')} .subContWrap .shareFundBox .tit {font-weight:500;color:#222} .subContWrap .shareFundBox .txt {margin-top:4px;color:#666} .subContWrap .shareFundBox .txt strong {font-weight:400} .subContWrap .download {color:#137fd2;font-weight:500} .subContWrap .download > a{color:#137fd2;font-weight:500} .subContWrap .boxGray {margin-top:34px;padding:15px 19px;color:#222;background:#f7f7f7;} .subContWrap .boxGray p {line-height:1.5} .subContWrap .boxGray + .subTit2 {margin-top:25px} /* 사회공헌 활동 */ .subContWrap .attachFile {padding-left:23px;background:url('../images/icon_file.png') no-repeat left 3px / 17.5px auto} .subContWrap .attachFile + .attachFile {margin-top:7px} .subContWrap .studyDetail {margin:5px 0} .subContWrap .studyDetail > li {padding-left:13px} .subContWrap .studyDetail > li:before {width:6px} .subContWrap .studyDetail > li + li {margin-top:8px} /* 인재채용 */ .subContWrap .imgRecruit1 {margin-top:25px} .subContWrap .imgRecruit2 {margin-top:17px} .subContWrap .imgRecruit3 {margin-top:17px} .subContWrap .imgRecruit4 {margin-top:37px} /* CI 소개 */ .subContWrap .imgCi1 {position:relative;margin-top:17px} .subContWrap .imgCi1 .btnArr {position:absolute;bottom:20px;left:50%;transform:translateX(-50%);margin-top:0} /* 캐릭터 소개 */ .subContWrap .imgCharacter1 {position:relative;margin-top:17px} .subContWrap .imgCharacter1 .btnArr {position:absolute;bottom:20px;left:50%;transform:translateX(-50%);margin-top:0} .subContWrap .characterList {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;-moz-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;-webkit-justify-content:space-between;-ms-justify-content:space-between;-moz-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;margin-top:2px} .subContWrap .characterList li {width:calc((100% - 15px) / 2);margin-top:15px} .subContWrap .characterList li > a {display:block} .subContWrap .characterList li > a img {display:block} /* 열린경영 - 경영정보 */ .subContWrap .txtName {margin-top:20px;font-size:12px;font-weight:500} .subContWrap .txtName strong {font-size:18px;color:#444;;font-weight:500} .subContWrap .roundBoxGray {margin-top:12px;padding:9px 15px 11px;background:#f5f5f5;border-radius:10px} .subContWrap .imgBusiness1 {margin-top:12px} .subContWrap .imgBusiness2 {margin-top:12px} .subContWrap .imgBusiness3 {margin-top:4px} .subContWrap .imgBusiness4 {margin-top:12px} .subContWrap .imgBusiness5 {margin-top:12px} .subContWrap .imgBusiness6 {margin-top:13px} .subContWrap .imgBusiness7 {margin-top:12px} .subContWrap .imgBusiness7 + .subTit3 {margin-top:35px} .subContWrap .roundBoxWhList {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;-moz-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;-webkit-justify-content:space-between;-ms-justify-content:space-between;-moz-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;} .subContWrap .roundBoxWh {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;-moz-flex-direction:column;-o-flex-direction:column;flex-direction:column;-webkit-justify-content:center;-ms-justify-content:center;-moz-justify-content:center;-o-justify-content:center;justify-content:center;margin-top:15px;width:100%;height:95px;padding:0 13px;border:1px solid #ddd;border-radius:10px} .subContWrap .roundBoxWh .tit {color:#222} .subContWrap .roundBoxWh .dotList {margin:6px 0 0 2px} .subContWrap .roundBoxWh .dotList > li {padding-left:8px} .subContWrap .roundBoxWh .dotList > li:before {top:8px;width:2px;height:2px} .subContWrap .roundBoxWhList.typ2 {margin-top:-3px} .subContWrap .roundBoxWhList.typ2 .roundBoxWh {width:calc((100% - 15px) / 2);height:60px;text-align:center} .subContWrap .roundBoxGray + .subTit2 {margin-top:24px} .subContWrap .subTit3.titBtn {display:inline-block} .subContWrap .subTit3.titBtn .btnDownload {position:absolute;right:-27px;top:-5px;padding:0;width:30px;height:30px;background:url('../images/icon_download_mo.png') no-repeat center / 14.5px auto} .subContWrap .subTitWrap {position:relative;margin-top:36px} .subContWrap .subTitWrap .selectBox {position:absolute;right:0;top:58%;transform:translateY(-50%)} .subContWrap .selYear {width:93px} .subContWrap .btnDownloadR {padding:0 44px 0 14px;height:27px;font-size:12px;color:#444;border:1px solid #ddd;border-radius:20px;letter-spacing:-1.2px;background:url('../images/icon_download_mo.png') no-repeat calc(100% - 15px) center / 14.5px auto} .subContWrap .btnDownloadR + .subTit2 {margin-top:15px} .subContWrap .faqList {margin-left:23px;margin-top:7px} .subContWrap .faqList > li {font-weight:500} .subContWrap .faqList > li .dashList > li {font-weight:400} .subContWrap .strategyList {margin:5px 0} .subContWrap .strategyList > li + li {margin-top:5px} .subContWrap .tblColRowTyp .dashList.typSm.mgt0 li {margin-top:0} /* 열린경영 - 경영공시 */ .subContWrap .bnrAlioList {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-justify-content:space-between;-ms-justify-content:space-between;-moz-justify-content:space-between;-o-justify-content:space-between;justify-content:space-between;margin-top:22px} .subContWrap .bnrAlioList .btnBnrAlio {width:calc((100% - 10px) / 2);height:35px} .subContWrap .bnrAlioList .btnBnrAlio img {width:100%} .subContWrap .listColTyp {margin-top:17px;} .subContWrap .listColTyp ul {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;-moz-flex-direction:row;-o-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-moz-flex-wrap:wrap;-ms-flex-wrap:wrap;-o-flex-wrap:wrap;flex-wrap:wrap;border:solid #aaa;border-width:0 1px 1px 1px} .subContWrap .listColTyp ul li {display:table;width:50%;height:50px;text-align:center;border-top:1px solid #aaa;color:#222} .subContWrap .listColTyp ul li:nth-child(2n) {border-left:1px solid #aaa} .subContWrap .listColTyp ul li a {display:table-cell;vertical-align:middle;} .subContWrap .listColTyp ul li a:hover {color:#222} .subContWrap .listColTyp ul li:nth-child(4n + 1) {background:#f9fcff} .subContWrap .listColTyp ul li:nth-child(4n + 2) {background:#f9fcff} .subContWrap .tblColTyp2.tblSm.tblCsDay td {padding:12px 19px 13px} /* 정보공개 */ .subContWrap .imginformation1 {margin-top:17px} .subContWrap .adminTit {display:block;margin:0 10px} .subContWrap .tblColTyp tbody td.tblLinkTit {padding:0 20px;text-align:left} .subContWrap .btnUpLoad {margin-top:10px;width:67px;height:32px;color:#fff;font-size:14px;border-radius:3px;background:#003586;border:1px solid #002866} .subContWrap .filterWrap.selColWrap {display:block;margin-top:13px} .subContWrap .selecBoxWrap {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex} .subContWrap .selecBoxWrap .selectBox {width:calc((100% - 5px) / 2)} .subContWrap .selecBoxWrap .selectBox + .selectBox {margin-left:5px} .subContWrap .selecBoxWrap.col3 .selectBox {width:calc((100% - 10px) / 3)} .subContWrap .filterWrap.selColWrap .inpSrch {display:block;width:100%;margin-top:5px} .subContWrap [class^="graphBox"] {margin-top:15px;border:1px solid #ddd} /* .subContWrap .graphBox1 {height:232px} */ /* .subContWrap .graphBox1 #chart1 {padding: 15px 15px 15px 15px;} */ /* .subContWrap .graphDiv {display:flex; justify-content: space-between} .subContWrap .graphBox2 {width:430px} */ .subContWrap .graphBox2 #chart2 {padding-top: 10px;} /* .subContWrap .graphBox3 {width:430px} */ .subContWrap .graphBox3 #chart3 {padding-top: 10px;} .subContWrap .imgBnrBox {margin-top:17px} .subContWrap .imgBnrBox + .selColWrap {margin-top:40px} .subContWrap .iframArea {margin-top:40px} .subContWrap .tblSelWrap .selectBox {width:100%} .subContWrap .tblSelWrap .selectBox .btnSelect {height:30px;padding:0 30px 0 9px;font-size:14px} .subContWrap .tblSelWrap .selectBox .btnSelect:after {right:10px} .subContWrap .tblSelWrap .selectBox .selectOption > li > button {height:30px;font-size:14px;padding:0 9px} .subContWrap .tblInpBox input {padding:0 9px;width:100%;height:30px;border:1px solid #ddd;color:#444;font-weight:400} .subContWrap .tblEmailBox:after {content:'';display:block;clear:both;} .subContWrap .tblEmailBox input {padding:0 9px;height:30px;border:1px solid #ddd} .subContWrap .tblEmailBox input:first-of-type {width:calc(100% - 17px);} .subContWrap .tblEmailBox input:last-of-type {margin-top:5px;float:left;width:calc((100% - 5px) / 2);} .subContWrap .tblEmailBox .selectBox {margin-top:5px;float:right;width:calc((100% - 5px) / 2)} .subContWrap .tblTxtArea textarea {width:100%;height:150px;padding:9px;border:1px solid #ddd;font-size:14px;color:#444} .subContWrap .tblInpFile {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;-webkit-justify-content:space-between;-ms-justify-content:space-between;-o-justify-content:space-between;-moz-justify-content:space-between;justify-content:space-between;-webkit-align-items:center;-moz-align-items:center;-o-align-items:center;-ms-align-items:center;align-items:center;} .subContWrap .tblInpFile input {width:calc(100% - 67px)} .subContWrap .tblInpFile input[type="file"] {width:calc(100% - 100px)} .subContWrap .tblRowTyp input[type="text"]:read-only {background:#bbb} .subContWrap .tblInpFile .btnUpLoad {margin-top:0;width:72px;height:30px;font-size:12px;background:#137fd2;border-color:#0f6db6} .subContWrap .tblInpFile div .btnDel {margin-top:10px;margin-left:10px; width:66px;height:30px;font-size:12px;color:#fff;background:#555;border-radius:5px} .subContWrap .tblPw .inpTxt {display:none} .subContWrap .tblRowTyp.ty2 th, .subContWrap .tblRowTyp.ty2 td {padding:14px 10px 15px} .subContWrap .brdBtm {margin-bottom:15px;padding-bottom:10px;border-bottom:2px solid #003586} /* 설문조사 팝업 */ .subPopWrap {position:fixed;left:50%;top:50%;transform:translate(-50%, -50%);width:calc(100% - 40px);padding:0 0 15px 0;border:1px solid #aaa} .subPopWrap .popTit {padding:22px 0 23px;color:#222;font-size:14px;text-align:center;background:#f7f7f7} .subPopWrap .surveyWrap {margin:15px;padding:12px 14px 15px;height:70vh;overflow-y:auto;border:1px solid #d5d5d5} .subPopWrap .surveyWrap .surveyQ {padding-left:14px;position:relative;font-size:14px;color:#222} .subPopWrap .surveyWrap .surveyQ:not(:first-of-type) {margin-top:23px} .subPopWrap .surveyWrap .surveyQ span {position:absolute;left:0;top:0} .subPopWrap .surveyWrap .surveyA {margin:7px 14px} .subPopWrap .surveyWrap .surveyRdoList li + li {margin-top:7px} .subPopWrap .surveyWrap .rdoBox input[type="radio"] {border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px} .subPopWrap .surveyWrap .rdoBox input[type="radio"] + label {position:relative;display:block;padding-left:20px;font-size:14px;color:#444;} .subPopWrap .surveyWrap .rdoBox input[type="radio"] + label:before {content:'';display:block;position:absolute;left:0;top:3px;width:15px;height:15px;overflow:hidden;background:url('../images/icon_radio.png') no-repeat;background-position:0 0;background-size:100% auto} .subPopWrap .surveyWrap .rdoBox input[type="radio"]:checked + label:before {background-position:0 -15px} .subPopWrap .surveyWrap .surveyA .inpBox {margin-top:10px} @media all and (min-width:1024px) { .moShow {display:none !important} .pcShow {display:block !important} /* .subContWrap {padding-top:28px} */ .subContWrap .subContInner {padding:0} .subContWrap input::placeholder {color:#666} .subContWrap input:-webkit-input-placeholder {color:#666} .subContWrap input::-webkit-input-placeholder {color:#666} .subContWrap input::-moz-placeholder {color:#666} .subContWrap input:-moz-placeholder {color:#666} .subContWrap .mgt1020 {margin-top:20px !important} .subContWrap .mgt2540 {margin-top:40px !important} .subContWrap .mgt1530 {margin-top:30px !important} .subContWrap .mgt1855 {margin-top:55px !important} .subContWrap .mgt2026 {margin-top:26px !important} .subContWrap .mgt3552 {margin-top:52px !important} .subContWrap .mgt2035 {margin-top:35px !important} .subContWrap .mgt2555 {margin-top:55px !important} .subContWrap .mgl2426 {margin-left:26px !important} .subContWrap .mgt3040 {margin-top:40px !important} .subContWrap .pcMgt0 {margin-top:0px !important} .subContWrap .pcMgt10 {margin-top:10px !important} .subContWrap .pcMgt15 {margin-top:15px !important} .subContWrap .pcMgt20 {margin-top:20px !important} .subContWrap .pcMgt25 {margin-top:25px !important} .subContWrap .pcMgt30 {margin-top:15px !important} .subContWrap .pcFs18 {font-size:18px !important} .subContWrap .subContInner .subTit1 {font-size:40px} .subContWrap .subTxt1 {margin-top:1px;font-size:18px} .subContWrap .copyBox {margin-top:43px;padding-right:170px} .subContWrap .copyBox .copyTxt {font-size:30px;letter-spacing:-1px;} .subContWrap .subCopyTxt {font-size:30px} .subContWrap .copyBox .copyImg.share1 {top:-17px;width:167px;height:169px} .subContWrap .copyBox .copyImg.share4 {top:-27px;width:220px;height:220px} .subContWrap .copyBox .copyImg.share5 {top:-25px; right:-15px; width:250px;height:177px} .subContWrap .copyBox .copyImg.history1 {top:7px;width:316px;height:272px} .subContWrap .copyBox .copyImg.history2 {top:8px;width:260px;height:242px} .subContWrap .copyBox .copyImg.business1 {top:8px;width:310px;height:172px} .subContWrap .copyBox .copyImg.socialvalue {top:-110px;width:202px;height:271px} .subContWrap .copyBox .copyImg.committee {top:-110px;width:239px;height:286px} .subContWrap .copyBox.information1 {padding-right:280px} .subContWrap .copyBox.information1 .copyImg {top:-33px;width:278px;height:200px} .subContWrap .copyBox.information2 {padding-right:235px} .subContWrap .copyBox.information2 .copyImg {top:7px;right:0;width:224px;height:200px} .subContWrap .imgContBox1 {margin-top:52px} .subContWrap .subDesc1 {margin-top:35px;font-size:18px} .subContWrap .copyBox + .subDesc1 {margin-top:48px} .subContWrap .subCopyTxt + .subDesc1.ty1 {margin-top:28px} .subContWrap .copyBox + .subDesc1.ty1 {margin-top:27px} .subContWrap .subDesc1 + .subDesc1 {margin-top:27px} .subContWrap .subDesc2 {font-size:18px} .subContWrap .subDesc3 {margin:10px 0 0 26px;font-size:18px} .subContWrap .imgTxtShareHead {margin-top:36px} .subContWrap .imgTxtShareHead img {width:276px} /* title */ .subContWrap .subTit2 {margin:46px 0 0 0;font-size:24px} .subContWrap .subTit2.bulSquare {padding-left:27px} .subContWrap .subTit2.bulSquare:before {top:10px;width:18px;height:18px} .subContWrap .subTit3 {margin:29px 0 0 0;font-size:20px} .subContWrap .subTit3.bulArr {padding-left:27px} .subContWrap p.subTit3.bulArr {line-height:1.4} .subContWrap .subTit3.bulArr:before {top:7px;width:16px;height:16px;} .subContWrap .subTit3.fzSm {font-size:18px} .subContWrap .subTit3.fzSm:before {top:5px} .subContWrap .subTit2 + p.subTit3 {margin-top:20px} .subContWrap .subTit2 + .dotList {margin-top:10px} .subContWrap .subTit2 + .dotList > li + li {margin-top:22px} .subContWrap p.subTit3 + .dotList {margin-top:11px} .subContWrap .dotList + p.subTit3 {margin-top:32px} .subContWrap .imgContBox2 {margin-top:34px} /* select */ .subContWrap .selectBox .btnSelect {padding:0 25px 2px 9px;height:32px;color:#666;font-size:14px} .subContWrap .selectBox .btnSelect:after {border-color:#555} .subContWrap .inpSrch {padding-right:73px} .subContWrap .inpBox input {padding:0 10px 2px;height:32px;color:#666;font-size:14px} .subContWrap .inpSrch .btnSrch {width:68px;height:32px;font-size:16px;font-weight:500;line-height:30px;border-radius:5px} .subContWrap .selectBox .btnSelect:after {width:6px;height:6px;right:10px;top:42%} .subContWrap .selectBox .selectOption > li > button {font-size:14px;color:#666;height:32px;padding:0 9px} .subContWrap .filterWrap {margin-top:53px;-webkit-justify-content:flex-end;-ms-justify-content:flex-end;-o-justify-content:flex-end;-moz-justify-content:flex-end;justify-content:flex-end;} .subContWrap .filterWrap .selectBox {width:103px} .subContWrap .filterWrap .selectBox2 {width:170px} .subContWrap .filterWrap .inpSrch {margin-left:5px;width:373px} /* table col type */ .subContWrap .tblColTyp thead th {height:44px;font-size:16px} .subContWrap .tblColTyp tbody td {padding:9px 0;font-size:16px;text-align:center} .subContWrap .tblImgTit {margin:0;padding:0 20px} .subContWrap .tblImgTit .img {margin-right:30px;width:140px;height:77px} .subContWrap .tblImgTit .tit {width:calc(100% - 170px);text-align:left} /* table col type2 */ .subContWrap .tblColTyp2.tblSm {margin-top:25px} .subContWrap .tblColTyp2.tblSm th {padding:11px 10px 12px ;font-size:16px} .subContWrap .tblColTyp2.tblSm td {padding:25px 19px 26px;font-size:16px} .subContWrap .tblColTyp2.tblSm + .bulRefer {margin-top:17px} /* table row type */ .subContWrap .tblRowTyp {margin-top:53px} .subContWrap .tblRowTyp.tblSm {margin-top:27px} .subContWrap .tblRowTyp th {padding:7px 10px 9px;height:auto;font-weight:400;font-size:16px;text-align:left} .subContWrap .tblRowTyp.tblSm th, .subContWrap .tblRowTyp.tblSm td {font-size:16px;padding:20px 19px 25px} .subContWrap .tblRowTyp td {padding:8px 10px} .subContWrap .tblRowTyp .dashList {margin:5px 0} .subContWrap .tblRowTyp.tblSm .dotList {margin-top:4px} .subContWrap .tblRowTyp.tblSm .dotList.typSm > li {line-height:1.5} .subContWrap .tblRowTyp.tblSm .dotList.typSm > li + li {margin-top:0} /* table col + row type */ .subContWrap .tblColRowTyp {margin-top:25px} .subContWrap .tblColRowTyp thead th {padding:11px 0 12px;font-size:16px} .subContWrap .tblColRowTyp tbody th, .subContWrap .tblColRowTyp tbody td {padding:24px 14px;font-size:16px;} [class^="tbl"] col.w88 {width:88px !important} [class^="tbl"] col.w90 {width:90px !important} [class^="tbl"] col.w105 {width:105px !important} [class^="tbl"] col.w110 {width:110px !important} [class^="tbl"] col.w130 {width:130px !important} [class^="tbl"] col.w135 {width:135px !important} [class^="tbl"] col.w150 {width:150px !important} [class^="tbl"] col.w160 {width:160px !important} [class^="tbl"] col.w170 {width:170px !important} [class^="tbl"] col.w180 {width:180px !important} [class^="tbl"] col.w240 {width:240px !important} [class^="tbl"] col.w250 {width:250px !important} [class^="tbl"] col.w260 {width:260px !important} [class^="tbl"] col.w355 {width:355px !important} /* bullet text */ .subContWrap .dotList {margin-left:6px;margin-top:10px} .subContWrap .dotList > li:before {top:12px} .subContWrap .dotList > li + li {margin-top:11px} .subContWrap .dotList.typSm > li {padding-left:8px;font-size:16px} .subContWrap .dotList.typSm > li:before {top:13px;width:3px;height:3px} .subContWrap .dotList.typSm > li + li {margin-top:22px} .subContWrap .dotList .dashList.typSm {margin-top:12px;margin-left:2px} .subContWrap .dotList .dashList.typSm > li {padding-left:15px;font-size:16px} .subContWrap .dotList .dashList.typSm > li:before {width:6px;top:12px} .subContWrap .dotList .dashList.typSm > li + li {margin-top:11px} .subContWrap .dashList {margin-left:2px} .subContWrap .dashList > li {padding-left:8px;} .subContWrap .dashList > li:before {top:15px;width:5px} .subContWrap .dashList > li + li {margin-top:6px} .subContWrap .dashList.typSm {margin-top:0;margin-left:5px} .subContWrap .dashList.typSm > li {padding-left:8px;font-size:16px} .subContWrap .dashList.typSm > li:before {width:5px;top:13px} .subContWrap .dashList.typSm > li + li {margin-top:0} .subContWrap .arrList {margin-left:4px;margin-top:27px} .subContWrap .arrList > li {padding-left:22px;} .subContWrap .arrList > li:before {top:10px;width:7px;height:10px;} .subContWrap .arrList > li + li {margin-top:30px} .subContWrap .numList {margin-top:11px} .subContWrap .numList li {padding-left:17px} .subContWrap .numList li + li {margin-top:6px} .subContWrap .circleNumList {margin-top:9px;margin-left:27px} .subContWrap .circleNumList > li {padding-left:23px} .subContWrap .circleNumList > li + li {margin-top:26px} .subContWrap .circleNumList > li > span {top:1px} .subContWrap .circleNumList > li > .dashList {margin-top:6px;margin-left:-3px;color:#444} .subContWrap .circleNumList > li > .dashList > li + li {margin-top:2px} .subContWrap .bulRefer {padding-left:20px;line-height:1.5} .subContWrap .bulRefer.typSm {font-size:16px} .subContWrap .bulStar {padding-left:10px;line-height:1.5} .subContWrap .bulStar:before {left:0;top:1px} /* paging */ .subContWrap .paging {margin-top:60px} .subContWrap .paging > a {width:31px;height:31px;background-size:auto 13px} .subContWrap .paging > .first {background-size:12px auto} .subContWrap .paging > .prev {background-size:7px auto} .subContWrap .paging > .next {background-size:7px auto} .subContWrap .paging > .last {background-size:12px auto} .subContWrap .paging .pagingNum li a {width:31px;height:31px;line-height:29px} /* button */ .subContWrap .btnArr {margin-top:20px;height:36px;font-size:16px;line-height:33px;padding:0 22px 0 20px;border:1px solid #d5d5d5;letter-spacing:-1px} .subContWrap .btnArr span {padding-right:25px} .subContWrap .btnArr span:after {width:7px;height:7px;border:solid #222;border-width:1px 1px 0 0;} .subContWrap .btnWrap .btnArr {margin-top:36px;letter-spacing:-0.7px;} .subContWrap .btnWrap .btnArr:hover {background-color: #137fd2;color: white;} .subContWrap .btnType1 {padding:0 15px;height:42px;font-size:18px;border-radius:5px} .subContWrap .btnType2 {padding:0 15px;height:42px;font-size:18px;border-radius:5px} /* tab */ .subContWrap .tabWrap {margin-top:53px} .subContWrap .tabWrap .tabList a {padding:7px 0 9px;font-size:16px;} .subContWrap .tabCont {padding-top:52px} .subContWrap .tabWrap.ty3 .tabList > li {width:33.33%} .subContWrap .tabWrap.ty3 .tabList > li:nth-child(2n + 1) {margin-left:-1px} .subContWrap .tabWrap.ty4 .tabList {margin:0 -5px 0 1px} .subContWrap .tabWrap.ty4 .tabList > li {margin-top:0;margin-left:-1px;width:calc(100% / 6)} .subContWrap .tabWrap.ty4 .tabList > li + li.on {margin-left:0} .subContWrap .tabWrap.ty4 .tabList > li.on {margin-left:0} .subContWrap .moreList {margin-top:20px;border:1px solid #ddd} .subContWrap .moreList li {-webkit-display:flex;-moz-display:flex;-ms-display:flex;-o-display:flex;display:flex;height:40px;font-size:16px;} .subContWrap .moreList li + li {border-top:1px solid #ddd} .subContWrap .moreList li .tit {width:150px;color:#fff;background:#444;border-right:1px solid #ddd;text-align:center;line-height:38px} .subContWrap .moreList li .txt {width:calc(100% - 150px);padding:3px 10px;} .subContWrap .moreList li .txt a:hover {border-bottom:1px solid #444} .subContWrap .shareFundBox {margin-top:15px;padding:20px 50px 30px 20px} .subContWrap .shareFundBox li {padding-left:240px;background-size:190px;background-position:left 0;line-height:1.3} .subContWrap .shareFundBox li + li {margin-top:42px} .subContWrap .shareFundBox .txt {margin-top:9px;line-height:1.5} .subContWrap .shareFundBox .fund01, .subContWrap .shareFundBox .fund02 {padding:45px 0 45px 240px; background-size: 130px; background-position: 30px 30px;} .subContWrap .boxGray {margin-top:51px;padding:24px;text-align:center} .subContWrap .boxGray p {line-height:1.5} .subContWrap .boxGray + .subTit2 {margin-top:53px} /* 사회공헌 활동 */ .subContWrap .attachFile {padding-left:33px;background-size:25px auto;background-position:left 5px} .subContWrap .attachFile + .attachFile {margin-top:3px} .subContWrap .studyDetail > li {padding-left:15px} .subContWrap .studyDetail > li:before {width:6px;top:14px} .subContWrap .studyDetail > li + li {margin-top:10px} /* 인재채용 */ .subContWrap .imgRecruit1 {margin-top:35px} .subContWrap .imgRecruit4 {margin-top:53px} /* CI 소개 */ .subContWrap .imgCi1 {margin-top:15px} .subContWrap .imgCi1 .btnArr {bottom:40px} /* 캐릭터 소개 */ .subContWrap .imgCharacter1 {margin-top:15px} .subContWrap .imgCharacter1 .btnArr {bottom:40px} .subContWrap .characterList {margin-top:15px} .subContWrap .characterList li {width:calc((100% - 80px) / 3);margin-top:0} /* 열린경영 - 경영정보 */ .subContWrap .txtName {margin-top:40px;font-size:18px} .subContWrap .txtName strong {font-size:28px} .subContWrap .roundBoxGray {margin-top:16px;padding:8px 28px 9px;border-radius:15px} .subContWrap .imgBusiness1 {margin-top:12px} .subContWrap .imgBusiness2 {margin-top:25px} .subContWrap .imgBusiness3 {width:712px;margin:4px auto 0} .subContWrap .imgBusiness4 {margin-top:14px} .subContWrap .imgBusiness5 {margin-top:14px} .subContWrap .imgBusiness6 {margin-top:26px} .subContWrap .imgBusiness7 {margin-top:26px} .subContWrap .imgBusiness7 + .subTit3 {margin-top:60px} .subContWrap .roundBoxWhList {margin-top:-5px} .subContWrap .roundBoxWh {margin-top:20px;width:calc((100% - 20px) / 2);height:130px;padding:0 29px;border-radius:15px} .subContWrap .roundBoxWh .tit {color:#222} .subContWrap .roundBoxWh .dotList {margin:8px 0 0 2px} .subContWrap .roundBoxWh .dotList > li {padding-left:10px} .subContWrap .roundBoxWh .dotList > li:before {top:12px;width:4px;height:4px} .subContWrap .roundBoxWhList.typ2 {margin-top:-5px} .subContWrap .roundBoxWhList.typ2 .roundBoxWh {width:calc((100% - 60px) / 4);height:90px} .subContWrap .roundBoxWhList.typ2 .roundBoxWh p {line-height:1.4} .subContWrap .roundBoxWhList + .subTit3 {margin-top:53px} .subContWrap .roundBoxGray + .subTit2 {margin-top:53px} .subContWrap .subDesc2 + .btnWrap .btnArr {margin-top:14px} .subContWrap .subTit3.titBtn .btnDownload {right:-35px;top:0;width:30px;height:30px;background:url('../images/icon_download_pc.png') no-repeat center / 21px auto} .subContWrap .subTitWrap {margin-top:45px} .subContWrap .subTitWrap .selectBox {top:55%} .subContWrap .selYear {width:83px} .subContWrap .btnDownloadR {margin-top:8px;padding:0 60px 0 18px;height:36px;font-size:16px;letter-spacing:-1.5px;background:url('../images/icon_download_pc.png') no-repeat calc(100% - 20px) 7px / 21px auto} .subContWrap .btnDownloadR + .subTit2 {margin-top:32px} .subContWrap .faqList {margin-left:27px;margin-top:8px} .subContWrap .faqList > li {font-weight:500} .subContWrap .faqList > li .dashList > li {font-weight:400} .subContWrap .strategyList > li + li {margin-top:7px} .subContWrap .underLine {position:relative;display:inline-block} .subContWrap .underLine:before {content:'';display:block;position:absolute;bottom:-6px;width:100%;height:1px;background:#727272} /* 열린경영 - 경영공시 */ .subContWrap .bnrAlioList {margin-top:0;display:block;position:absolute;right:0;top:-120px} .subContWrap .bnrAlioList .btnBnrAlio {display:block;width:196px;height:60px} .subContWrap .bnrAlioList .btnBnrAlio + .btnBnrAlio {margin-top:10px} .subContWrap .bnrAlioList + .subTit2 {margin-top:70px} .subContWrap .listColTyp {margin-top:37px;padding:40px 19px;border:1px solid #ddd} .subContWrap .listColTyp ul li {width:25%;height:80px;} .subContWrap .listColTyp ul li:not(:nth-child(4n + 1)) {border-left:1px solid #aaa} .subContWrap .listColTyp ul li a {font-size:16px} .subContWrap .listColTyp ul li:nth-child(4n + 1) {background:#fff} .subContWrap .listColTyp ul li:nth-child(4n + 2) {background:#fff} .subContWrap .listColTyp ul li:nth-child(8n + 1) {background:#f9fcff} .subContWrap .listColTyp ul li:nth-child(8n + 2) {background:#f9fcff} .subContWrap .listColTyp ul li:nth-child(8n + 3) {background:#f9fcff} .subContWrap .listColTyp ul li:nth-child(8n + 4) {background:#f9fcff} /* 정보공개 */ .subContWrap .imginformation1 {margin-top:34px} .subContWrap .adminTit {margin:0 38px} .subContWrap .tblColTyp tbody td.tblLinkTit {padding:0 28px} .subContWrap .btnUpLoad {margin-top:20px;width:90px;height:42px;font-size:18px;border-radius:5px} .subContWrap .filterWrap.selColWrap {margin-top:8px;-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex} .subContWrap .selecBoxWrap {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex} .subContWrap .selecBoxWrap .selectBox:first-of-type {width:132px} .subContWrap .selecBoxWrap .selectBox:last-of-type {width:102px} .subContWrap .selecBoxWrap .selectBox + .selectBox {margin-left:5px} .subContWrap .selecBoxWrap.col3 .selectBox {width:82px} .subContWrap .selecBoxWrap.col3 .selectBox:last-of-type {width:105px} .subContWrap .filterWrap.selColWrap .inpSrch {margin-top:0;width:auto;margin-top:0} .subContWrap .filterWrap.selColWrap .inpSrch input {width:300px} /* .subContWrap .graphBox1 {height:342px} */ .subContWrap .graphBox1 #chart1 {padding: 15px 15px 15px 15px;} /* .subContWrap .graphBox2 {height:470px} */ .subContWrap .graphBox2 #chart2 {padding-top: 10px;} /* .subContWrap .graphBox3 {height:480px} */ .subContWrap .graphBox3 #chart3 {padding-top: 10px;} .subContWrap .imgBnrBox {margin-top:35px} .subContWrap .imgBnrBox + .selColWrap {margin-top:60px} .subContWrap .iframArea {margin-top:60px} .subContWrap .tblRowTyp.ty2 th, .subContWrap .tblRowTyp.ty2 td {padding:15px 20px;font-size:18px} .subContWrap .tblSelWrap .selectBox .btnSelect {height:50px;padding:0 40px 0 20px;font-size:16px;color:#444} .subContWrap .tblSelWrap .selectBox .btnSelect:after {right:23px;width:8px;height:8px} .subContWrap .tblSelWrap .selectBox .selectOption {top:50px} .subContWrap .tblSelWrap .selectBox .selectOption > li > button {padding:0 20px;height:50px;font-size:16px} .subContWrap .tblInpBox input {height:50px;padding:0 20px;font-size:16px} .subContWrap .tblEmailBox {-webkit-display:flex;-ms-display:flex;-moz-display:flex;-o-display:flex;display:flex;-webkit-align-items:center;-moz-align-items:center;-o-align-items:center;-ms-align-items:center;align-items:center;} .subContWrap .tblEmailBox input {padding:0 20px;margin-top:0 !important;width:252px !important;height:50px;font-size:16px} .subContWrap .tblEmailBox input:last-of-type {float:none} .subContWrap .tblEmailBox .emailDot {margin:0 10px;line-height:50px} .subContWrap .tblEmailBox .selectBox {float:none;margin-left:13px;margin-top:0;width:146px} .subContWrap .tblTxtArea textarea {height:170px;font-size:16px;padding:20px} .subContWrap .tblInpFile input {width:calc(100% - 104px)} .subContWrap .tblInpFile input[type="file"] {width:400px;} .subContWrap .tblInpFile .btnUpLoad {width:86px;height:42px;font-size:16px} .subContWrap .tblInpFile div .btnDel {margin-top:0;margin-left:10px; width:66px;height:30px;font-size:12px;color:#fff;background:#555;border-radius:5px} .subContWrap .tblPw input {width:220px} .subContWrap .tblPw .inpTxt {display:inline-block;margin-left:15px;color:#f24724} .subContWrap .tblRowTyp.ty2.tblData th, .subContWrap .tblRowTyp.ty2.tblData td {padding:27px 20px} .subContWrap .brdBtm {font-size:20px;padding-bottom:12px;margin:54px 0 20px} /* 설문조사 팝업 */ .subPopWrap {position:static;width:100%;padding:20px 0 40px;transform:none} .subPopWrap .popTit {padding:27px 0;font-size:18px} .subPopWrap .surveyWrap {margin:40px;padding:31px 39px;height:55vh} .subPopWrap .surveyWrap .surveyQ {padding-left:15px;font-size:16px} .subPopWrap .surveyWrap .surveyQ:not(:first-of-type) {margin-top:50px} .subPopWrap .surveyWrap .surveyQ span {position:absolute;left:0;top:0} .subPopWrap .surveyWrap .surveyA {margin:10px 16px} .subPopWrap .surveyWrap .surveyRdoList li + li {margin-top:15px} .subPopWrap .surveyWrap .rdoBox input[type="radio"] + label {padding-left:27px;font-size:16px} .subPopWrap .surveyWrap .rdoBox input[type="radio"] + label:before {top:4px;width:19px;height:19px} .subPopWrap .surveyWrap .rdoBox input[type="radio"]:checked + label:before {background-position:0 -19px} .subPopWrap .surveyWrap .surveyA .inpBox {margin-top:12px} .subPopWrap .surveyWrap .surveyA .inpBox input {height:36px} .subContWrap .graphDiv {display:flex; justify-content: space-between} .subContWrap .graphBox2 {width:430px} .subContWrap .graphBox3 {width:430px} } /**************************************************** /*ESG컨텐츠추가*/ /****************************************************/ /*1.경영이란*/ .esg_composition_img { max-width: 890px; text-align: center;} .esg_composition p { font-size: 24px; letter-spacing: -1px; text-align: center;} .esg_slogan { text-align: center; padding: 20px; } /*2.경영추진체계**************************************** /*경영추진체계기본*/ .esgSystemAR { padding:0 0 0 80px; margin-top: 20px} .esgSystemAR > div { position: relative; border: 1px solid #979797; margin-bottom: 5px } .esgSystemAR .h4_esg { position: absolute; left: -80px; top: -1px; width: 80px; height: -webkit-fill-available; display: flex; justify-content: center; align-items: center; font-weight: 500; border: 1px solid #979797; margin-bottom:-1px ; } .esgSystemAR .h4_esg::after { content: ''; position: absolute; background-image: url(../images/contents_location.png); background-repeat: no-repeat; background-size: contain; width: 19px; height: 19px; right: -19px; top: 50%; margin-top: -10px; } .esgSystemAR ul li { font-size:16px; letter-spacing: -1.3px; display:flex; gap: 1; } .esgSystemAR ul li span:first-child { padding-right: 4px;} /* IE 10 and above */ /* IE에서 숫자정렬 맞춤 */ @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .esgSystemAR ul li span:first-child { padding-right: 4px; padding-top: 2px; } } /*ESG비전*/ .esgGride1 { display: flex;} .esgGride1 div { display: flex; flex-direction: column; justify-content: center; width: 100%;} .esgGride1 .esgSystemAR_header { font-size:22px; font-weight:600;text-align: center; color: #0e8add; } .esgGride1 .esgSystemAR_header_info { font-size:20px; font-weight:400;text-align: center } /*ESG전략*/ .esgGride2 { display: flex; text-align: center } .esgGride2 .h5_esg { font-size: 23px;color: #fff;font-weight:700; padding: 10px 10px 5px; margin: 0 } .esgGride2 div { display: flex; text-align: center; flex-direction: column; justify-content: center; } .esgGride2 p { padding:5px; font-size:18px; line-height:22px; color: #fff; } /*전략방향*/ .esgGride3 { display: flex; border: none !important;} .esgGride3 div ul { display: flex; height: 100%; padding: 3px; border: 1px solid #979797; margin:0 1px; margin-block-start: 0; } .esgGride3 div ul li {justify-content: center; font-size: 16px; padding: 10px; margin: 1px; text-align: center; border: 1px solid #fff; width: 100%; align-items: center; } /*전략과제*/ .esgGride4 { display: flex; padding: 5px 5px 8px 5px; background-color: #fbfbfb } .esgGride4 div { display: flex;} .esgGride4 div ul { height: 100%; padding: 3px; border: 1px solid #c4c4c4; margin: 1px } .esgGride4 div ul li { font-size: 14px; padding:3px; text-align: left } /*중장기로드맵*/ .esgGride5 { display: flex; padding: 5px; } .esgGride5 div { display: flex; flex-direction: column;} .esgGride5 div ul { display: block; height: 100%; padding:8px; border: 1px solid #c4c4c4;margin: 1px;} .esgGride5 div ul li {font-size: 14px; padding:3px; text-align: left } .esgGride5 div p { text-align: center; margin-bottom: 10px;} .esgGride5 div p span:first-child { font-weight: 400; /*color: #0e8add;*/ display: block;} .esgGride5_year { font-size: 20px; font-weight: 600; } .esgGride5_title { font-size: 18px; font-weight: 500; line-height: 18px; } /*추진조직*/ .esgGride6 { display: flex; } .esgGride6 div { font-size: 16px; align-items: center; padding: 15px; text-align: center; display: flex; justify-content: center;} .opacitybg_ep { background-color: #dbecdf } .opacitybg_sp { background-color: #ffeae3 } .opacitybg_cg { background-color: #e4f2ff } .bgcolor_ep {background-color: #2c9470!important;} .bgcolor_sp {background-color: #ec5f18 !important;} .bgcolor_cg { background-color: #3c75df !important } .border_ep { border-color: #28b182 !important;} .border_sp { border-color: #ff805a !important;} .border_cg { border-color: #3c75df !important;} .color_ep {color: #0b8157 !important;} .color_sp {color: #fb4e1a !important;} .color_cg { color: #3c75df !important;} /*모바일*/ @media screen and (max-width: 850px) { .esgSystemAR { padding:0 10px} .esgSystemAR > div { border:none; margin-bottom:20px } .esgSystemAR .h4_esg { top: 0; left: 0; width: 100%; padding: 10px; font-size: 16px; font-weight: 600; } .esgSystemAR .h4_esg br { display: none;} .esgSystemAR .h4_esg::after {transform: rotate(90deg); top: 50px; width:25px; height: 25px; left: 50%; margin-left: -10px;} /*비전*/ .esgGride1 .esgSystemAR_header { font-size:20px; letter-spacing: -3px; } .esgGride1 .esgSystemAR_header_info { font-size:16px; letter-spacing: -.5px;} /*전략*/ .esgGride2 br { display: none } .esgGride2 .h5_esg { font-size: 18px; letter-spacing: -0.6px; word-break: keep-all; word-break: break-word;} .esgGride2 p { font-size: 13px; letter-spacing: -1px; line-height: 17px;} /*전략방향*/ .esgGride3 div ul { display:block;} .esgGride3 div ul li { padding: 5px;font-size: 13px;} /*전략과제*/ .esgGride4 { padding:0 } .esgGride4 div {padding:0; display: block; word-break: keep-all; word-break: break-word;} .esgGride4 div ul { height: auto; border:none;} .esgGride4 div ul li { font-size: 12px; letter-spacing: -2px;} /*중장기로드맵*/ .esgGride5 div { display: block;} .esgGride5 div ul {height: 100%; padding:0; border: none; margin: 0;} .esgGride5 div ul li { font-size: 12px; letter-spacing: -1px } .esgGride5 p { min-height:55px; word-break: keep-all; word-break: break-word; } .esgGride5_year, .esgGride5_title { font-size:14px; letter-spacing: -1px } .esgGride6 div {display: flex; font-size:12px; align-items: flex-start; word-break: keep-all; word-break: break-word;} .esgGride6 div br { display: none;} .epGride, .spGride, .cgGride { width:100% } .esgGride1 { display: block; padding-top:70px } .esgGride5 { padding-top:60px } .esgGride2, .esgGride3, .esgGride4 { padding-top:50px} .esgGride6 { padding-top:50px} /*가로로 나뉘는 div 크기를 동일하게 유지하기위한 class*/ .grid_h100, .grid_h120, .grid_h180, .grid_h200 { height: auto !important;} /*ul 그룹의 갯수를 100% 에 맞추기위한 class */ .grid_w50 { width:100% !important } .grid_w33 { width:100% !important } } /*경영추진체계//**************************************************************/ /*3.경영공시*/ .esg_linkGroup { display: flex; flex-direction: row; padding: 30px 0;} .esg_linkGroup b { font-size: 23px;line-height:30px;} .esg_linkGroup div { background-color:#fff; margin:5px; border-top-left-radius:30px; display: flex; align-items: stretch; flex-direction:column;} .esg_linkGroup_header {background-color:#fff; border-top:solid 3px; width: 100%; height:90px; font-size: 20px; display: flex; flex-direction: column; align-items: center; justify-content: center } .esg_linkGroup_header span:first-child { font-weight:600; font-size: 25px } .esg_linkGroup_list { border-bottom-right-radius:30px; border-style: solid; border-width: 1px; border-color:#ddd; padding:30px; min-height: 270px; font-size:14px; background-color:#fff } .esg_linkGroup_list li { border-bottom: 1px solid transparent;} .esg_linkGroup_list li:hover { border-bottom: 1px solid #585858; font-weight: normal;} /*모바일*/ @media screen and (max-width: 850px) { .esg_linkGroup {flex-direction: column;} .esg_linkGroup_header { width: auto; height: auto; font-size:16px; line-height:24px; padding: 7px; align-items: left;} .esg_linkGroup_header span:first-child { font-size:22px } .esg_linkGroup_list { min-height:auto;} } /*4.경영실천다짐*/ .promiseAR { padding:20px; border: 1px solid #ddd; margin-top: 20px } .promiseHeader { text-align:center; font-family: "Nanum Myeongjo" } .promiseHeader .title { font-size: 30px; font-weight: 800; line-height: 70px; border-bottom: 2px slategray solid; width: 300px; margin: 0 auto; } .promiseHeader .headerinfo { padding: 50px 0; font-size: 20px; font-weight: 600;} .promiseGroup { background: url(../images/esg_resolution.jpg) no-repeat; background-position: center bottom; padding-bottom: 300px } .promiseList { padding-bottom: 20px; display: flex; align-items: center; font-size: 16px; width: 650px; margin:20px auto; align-content: flex-start; border-bottom: dashed 1px #137fd2; } .promise_one { min-width: 60px; min-height: 60px; border-radius: 50%; background-color:#137fd2; color: #fff; display: flex; justify-content: center; align-items: center; margin: 20px; line-height:60px; font-weight: 700 } .promise_txt { letter-spacing: -1px; } .promiseFooter { font-size: 16px; text-align: center;} .promiseFooter .data { padding-bottom: 10px !important; font-size: 19px; font-weight: 100; letter-spacing: 2px } .promiseFooter .sign { font-family: 'Nanum Myeongjo'; font-weight: 100; font-size: 20px; padding: 3px; margin-top: 10px; color:#fff;background-color: #7a7a7a } @media screen and (max-width: 1040px) { .promiseGroup { margin: 20px; background-size:550px; padding-bottom: 150px } .promiseList { width: 100% } .promiseHeader .title { font-size: 25px; width: 100%;} .promiseHeader .headerinfo {font-size: 18px; letter-spacing:-1px} } /*5.비전목표********************************/ /*비전*/ .esg_visionBox {display: flex; flex-direction:row; justify-content: center; padding: 30px 0;} .esg_visionBox div {display: flex; flex-direction: column;text-align:center; border-radius: 50%;padding: 20px; margin:5px;} .esg_visionBox div .esg_vision {background-color: #fff; width:160px; height:160px } .esg_visionBox div .esg_vision h5 {font-size: 30px; font-weight: 600; padding: 0; margin:0; } .esg_visionBox div .esg_vision h5::before { background-image: none;} .esg_visionBox div .esg_vision p {justify-content: center; border-top: 1px solid #979797; padding:5px; font-size:16px;} /*추진과제*/ .esg_task { display: flex; height:280px ; padding-top: 20px; } .esg_taskGroup { width: 50%; margin: 2px; display: block; border: 1px solid #137fd2 } .esg_taskGroup h5 { background-color:#002866; color: #fff; padding: 7px 0 7px 20px;margin-top: 0;} .esg_taskGroup h5::before { background-image: none;} .esg_taskGroup > ul { height:100px; margin-block-start:0; } .esg_taskGroup > ul > li { display: flex; flex-direction:column; justify-content: center; height:calc(100% / 2); margin: 10px; padding: 15px; position: relative } .esg_taskGroup > ul > li:first-child { border-bottom: 1px solid #3c75df;} .esg_taskGroup > ul.esg_tesk1 { font-size: 18px;} .esg_taskGroup > ul.esg_tesk1 > li::after { content: ''; position: absolute; background-image: url(../images/contents_location.png); background-repeat: no-repeat; background-size: contain; width:25px; height: 25px; right: -30px; top: 50%; margin-top: -8px; } /*환경로드맵*/ .esg_loadmapGroup {display: flex; flex-direction:row; padding: 30px 0;} .esg_loadmapGroup div {margin:2px; background-color:#fff; width: 33.2%; display: flex; flex-direction:column; border: 1px solid #002866;} .esg_loadmapGroup_header {padding: 20px 0; font-size: 20px; width: 100%;text-align: center; margin-block-start: 0; margin-block-end: 0; margin-inline-start: 0px} .esg_loadmapGroup_header span:first-child { font-weight:600; font-size: 25px } .esg_loadmapGroup_list { padding:30px; min-height:100px; font-size:14px; background-color:#fff } .esg_loadmapGroup_list li { border-bottom: 1px solid transparent;} @media screen and (max-width: 850px) { .esg_visionBox { flex-direction: column; } .esg_visionBox div { display:block; border-radius: 0; margin: 0; padding:5px; width: 100%;height:auto; margin-bottom: 10px;} .esg_visionBox div .esg_vision {background-color: #fff;width: 100%; height: auto;padding: 0; margin: 0} .esg_visionBox div .esg_vision h5 {font-size: 22px } .esg_task { height:auto; padding-top: 10px;} .esg_task div { width: 100%;} .esg_taskGroup > ul { height:auto } .esg_taskGroup > ul > li { height: 170px; word-wrap: break-word;} .esg_taskGroup > ul.esg_tesk1 { font-size:14px;} .esg_loadmapGroup {flex-direction: column;} .esg_loadmapGroup div { border:none; flex-direction: row; width: 100% } .esg_loadmapGroup_header { font-size: 18px; width:22%; text-align: left; background-color: #fff; border-top: solid 3px; word-wrap: break-word;} .esg_loadmapGroup_list { width: 78%; padding : 0 20px; min-height:auto; margin-top: 15px;} } /*20230908문서진위확인*/ .paperCheck_info { border-radius: 0; padding:40px 20px; background: url(../images/paperinfo_bg.png) no-repeat; background-position: right bottom; } .stepinfo { border-top: 3px solid #e0e0e0; border-radius: 3px; width: 100%; padding:20px 0; margin-top:30px; } .stepinfo p { font-weight: bold; color: #555555;} .stepinfo ul { padding: 10px 0 0 5px;} .stepinfo ul li { list-style: none; line-height:22px; } .paperformAR { margin-bottom: 40px;} .systemCheck { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; } .systemlist { text-align: center; padding:20px; align-items: center; } .systemlist label img { width: auto; margin: 0 0 0 0; display: block;} .paperCheckForm { width: auto; box-sizing: border-box;border-collapse: collapse;} .paperCheckForm td, th { border: 1px solid #ddd; padding: 20px 40px; } .paperCheckForm th {border-top: 1px solid #ddd; background-color: #f7f7f7; width: 20%; } .paperCheckForm td { box-sizing: border-box;} .paperNum { display: flex; align-items: center; justify-content: space-around;} .paperNum input { width: 100%; text-align: center; height: 44px; margin:0 4px;} .paperNum input::placeholder { color: #aaa !important; opacity: 1 } .paperCheck_OK { background-color: #0084ff; color: #fff !important; height: 80px; font-size: 20px; width: 100%; align-items: center; display: flex; justify-content: center; margin-top: 10px; } .paperCheck_OK:hover {background-color: #00028a;} .paperCheck_OK:visited { background-color: unset; color: unset;} @media screen and (max-width: 988px){ .paperCheck_info { background:none; background-position: right bottom; } } @media screen and (min-width: 1024px) { .stepinfo {font-size:15px;} } @media screen and (max-width:550px) { .paperCheckForm td, th { padding:5px !important;} } /**************************************************** /*공단소개-중장기경영혁신체계*/ /****************************************************/ /*중장기 경영전략 체계기본*/ .hrdkManagementAR { margin-top: 20px} .hrdkManagementAR > div { padding:0 0 0 90px; position: relative; border-top: 1px solid #979797; } .hrdkManagementAR .h4_hrdkM { position: absolute; left: 0px; top: -1px; width: 90px; height: -webkit-fill-available; display: flex; justify-content: center; align-items: center; font-weight: 600; font-size: 16px; /* border-top: 1px solid #979797; */ margin-bottom: -1px; letter-spacing: -1px; color: #525252; } .hrdkManagementAR .h4_hrdkM::after { content: ''; position: absolute; background-image: url(../images/contents_location.png); background-repeat: no-repeat; background-size: contain; width: 19px; height: 19px; right: -19px; top: 48%; margin-top: -10px; } /* .hrdkManagementAR ul {max-width: 99.9%;} */ .hrdkManagementAR ul li { font-size:16px; letter-spacing: -1.3px; display:flex; gap: 1; } .hrdkManagementAR ul li span:first-child { letter-spacing: -0.5px; padding-right: 4px; font-weight: 500; font-size: 13px;} .hrdkManagementAR ul li span.num { letter-spacing: -0.5px; padding-right: 4px; min-width:27px; font-weight: 500; font-size: 13px;} /* IE 10 and above */ /*li 속성오류 보종 */ @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .hrdkManagementAR ul li { display: block !important; } } /*1.설립목적*/ .hrdkMGride1 { display: flex;} .hrdkMGride1 div { display: flex; flex-direction: column; justify-content: center; width: 100%;} .hrdkMSystemAR_header { font-size:20px; font-weight:500;text-align: center; color:#000; background-color: #f2f8fe; } /*20250224 미션,비전추가*/ .hrdkMGride_mission { display: flex;} .hrdkMGride_mission div { display: flex; flex-direction: column; justify-content: center; width: 100%; min-height: 60px;} .hrdkMGride_mission_header { font-size:18px; font-weight:500;text-align: center; color: #000; } .hrdkMGride_vision { display: flex;} .hrdkMGride_vision div { display: flex; flex-direction: column; justify-content: center; width: 100%;} .hrdkMGride_vision_header { font-size:18px; font-weight:500;text-align: center; color:#000; min-height: 60px; } /*20250224 핵심가치,경영방침*/ .hrdkMGride_point { display:inline-flex; flex-direction: row; width: 100%; padding: 10px 0 !important; gap:2px} .hrdkMGride_point_group1, .hrdkMGride_point_group2 { text-align: center; width: 50%; position: relative;padding-right: 15px;} .hrdkMGride_point_group2 { border-left: 1px solid #b7b7b7;} .hrdkMGride_point_box { display: flex;flex-direction: row;align-items: center;justify-content:space-around;padding-left: 90px;height: 100%; font-size: 15px;} .point_circle { width: 80px; height: 80px; border-radius: 50%; color: #fff; display: flex; align-items: center; justify-content: center;} /*2.가치체계*/ .hrdkMGride2 { display: flex; text-align: center; } .hrdkMGride2 div { display: flex; align-items: center; justify-content: center;} .hrdkMGride2 div img { display: inline-block; width: 100%; padding: 13px 0; margin-top: 0 !important;} /*3.중장기경영목표*/ .hrdkMGride3 { display: flex; text-align: center; } .hrdkMGride3 .h5_hrdkM { font-size:16 px;color: #fff;font-weight: 500; margin: 0; height: 60px; align-items: center; display: flex; padding: 0 0 0 0; } .hrdkMGride3 div { display: flex; justify-content: center; flex-direction: column; align-items: center;} .hrdkMGride3 p { padding:5px; font-size:18px; line-height:22px; color: #fff; } /* .hrdkMGride3 p:last-child { border-top: 1px solid #fff; font-size:16px;padding-bottom: 18px;} */ /*20250225 ESG경영전략 추가*/ .hrdkMGride_esg { display: flex; border-bottom: 1px solid #979797; } .hrdkMGride_esg p { text-align: center; letter-spacing: 0; line-height: 35px; font-size: 14px; font-weight: bold; margin: 3px; color: #fff; } .hrdkMGride_esg p:last-child { border: none; color: #666;} /*20250225 추가 사업전략및 기능전략 구분라인속성*/ .hrdkMGrid_linegroup { display: inline-flex;align-items: end;margin: 10px 0;width: 100%; font-size: 14px; border-top:none !important; border-bottom:none !important; box-sizing: border-box;} .hrdkMGrid_line1 { width: 75%;height: 40px; text-align: center;align-items: center;display: flex;justify-content: center;background-color: #eeeeee; border: 1px solid #818181;} .hrdkMGrid_line2 { width: 25%;height: 40px; text-align: center;align-items: center;display: flex;justify-content: center;background-color: #818181; color: #fff; border: 1px solid #575757; margin-left: 1px;} /*4.전략묙표*/ .hrdkMGride4 { display: flex; border: none !important;} .hrdkMGride4 p { text-align: center; line-height: 35px; font-size: 14px; font-weight: bold; margin: 3px; border: 1px solid #000; } /*.hrdkMGride4 div ul { display: flex; height: 100%; padding:0 3px; border: 1px solid #979797; border-bottom: none; margin:0 1px; margin-block-start: 0; } */ .hrdkMGride4 div ul li { font-size: 16px; font-weight: 500;color: #000; padding: 10px;width: 100%; margin: 1px; justify-content: center; text-align: left; box-sizing: border-box; } .hrdkMGride4 div ul li strong {color: #000; padding-right: 5px;} /*5.전략과제, 6.실행과제, 7.성과지표*/ .hrdkMGride5, .hrdkMGride6, .hrdkMGride7 { display: flex; padding: 4px 0 8px 0; } .hrdkMGride5 div, .hrdkMGride6 div, .hrdkMGride7 div { display: flex;} .hrdkMGride5 div ul , .hrdkMGride6 div ul , .hrdkMGride7 div ul { background-color: #fbfbfb; height: 100%; padding:10px; border: 1px solid #c4c4c4; margin: 1px; width: 100%;} .hrdkMGride5 div ul li, .hrdkMGride6 div ul li, .hrdkMGride7 div ul li { font-size: 14px; padding:3px; text-align: left } /*8.모니터링환류*/ .hrdkMGride8 { display: flex; text-align: center; padding: 5px 0; } .hrdkMGride8 div ul { display: block; height: 100%; padding:10px; border: 1px solid #c4c4c4;margin: 1px;} .hrdkMGride8 div ul li { font-size: 14px; padding:3px; text-align: left } .hrdkMGride8 div p { text-align: center; margin-bottom: 10px;} .hrdkMGride8 div p span:first-child { font-weight: 400; /*color: #0e8add;*/ display: block;} /*모바일*/ @media screen and (max-width: 850px) { .hrdkManagementAR { padding:0 15px; margin-top: 20px} .hrdkManagementAR div { border: none;} .hrdkManagementAR > div { padding:60px 0 0 0; } .hrdkManagementAR .h4_hrdkM { display: block; width: 100% !important; padding: 10px 0 120px 0 !important; font-size: 16px; font-weight: 600; text-align: center; left: 0; } .hrdkManagementAR .h4_hrdkM br { display: none !important;} .hrdkManagementAR .h4_hrdkM::after {transform: rotate(90deg) !important; top: 50px; width:20px; height: 20px; left: 50%; margin-left: -10px;} .hrdkMGride1, .hrdkMGride2, .hrdkMGride3, .hrdkMGride4, .hrdkMGride5, .hrdkMGride6, .hrdkMGride7, .hrdkMGride8, .hrdkMGride_esg { padding-top:60px } .hrdkMGride_point { display:inline-flex; flex-direction: column; } .hrdkMGride_point_box { padding:60px 0 0 0;} .hrdkMGride_point_group1, .hrdkMGride_point_group2 {width:100%;} .hrdkMGride_point_group2 { border-left:none;} /*1.설립목적*/ .hrdkMGride1 .hrdkMSystemAR_header { font-size:16px; padding: 15px; } .hrdkMGride_mission_header { font-size:14px; padding: 15px;} .hrdkMGride_vision_header { font-size:14px; padding: 15px;} /*3.중장기경영목표*/ .hrdkMGride3 .h5_hrdkM {font-size: 14px;line-height:15px; height: 90px; white-space: break-spaces;word-break: keep-all;} /* .hrdkMGride3 p:last-child {font-size: 12px; border-top:none;letter-spacing: -1px;} */ .hrdkMGride4 div ul { align-items: flex-start;} .hrdkMGride4 div ul li, .hrdkMGride5 div ul li { flex-direction: column; font-size: 13px;} .hrdkMGride5 div ul li, .hrdkMGride6 div ul li, .hrdkMGride7 div ul li, .hrdkMGride8 div ul li { font-size: 13px; padding:3px; text-align: left } .hrdkMGride4 p { text-align: center;height: 50px; font-size: 13px; } /*20250225 ESG경영전략 추가*/ .hrdkMGride_esg { display: flex; } .hrdkMGride_esg p { text-align: center;line-height:20px; font-size: 14px; font-weight: bold; margin: 3px; color: #fff; } .hrdkMGride_esg p:last-child { border: none; color: #666;} .hrdkMGride8.grid_h160 { height: auto;} } /*모바일END*/ /*공통*/ .bgcolor_hrdkM1 { background-color: #705daf} .bgcolor_hrdkM3 { background-color: #383eb3;} .bgcolor_hrdkM2 { background-color: #3c75df} .bgcolor_hrdkM4 { background-color: #427298;} .opacitybg_hrdkM1 { background-color: #f4f0ff; margin: 1px;} .opacitybg_hrdkM2 { background-color: #e9f0fd; margin: 1px;} .opacitybg_hrdkM3 { background-color: #e7e9ff; margin: 1px;} .opacitybg_hrdkM4 { background-color: #e5eaef; margin: 1px;} .border_hrdkM1 { border-color: #705daf !important;} .border_hrdkM2 { border-color: #3c75df !important;} .border_hrdkM3 { border-color: #383eb3 !important;} .border_hrdkM4 { border-color: #83aaca !important;} .color_hrdkM1 { color: #9d8fca !important;} .color_hrdkM2 { color: #0a8dfd !important;} .color_hrdkM3 { color: #383eb3 !important;} .color_hrdkM4 { color: #83aaca !important;} /*세로로 나뉘는 div 크기를 동일하게 유지하기위한 class*/ .hrdkM_Gridecolor1 { width: 25% } .hrdkM_Gridecolor2 { width: 25% } .hrdkM_Gridecolor3 { width: 25% } .hrdkM_Gridecolor4 { width: 25% } /*******************************************************/ /*기업규제애로신고,시민의견제시 백그라운드**/ /*******************************************************/ .mobileCheck_company { position: relative; margin: 50px auto; width:416px; height:377px; background-image: url(../images/mobileCheck_company_notxt.png); background-repeat: no-repeat; } .mobileCheck_comment { position: relative; margin: 50px auto; width:416px; height:377px; background-image: url(../images/mobileCheck_comment_notxt.png); background-repeat: no-repeat; } .mobileCheck_txt { color: #fff; font-weight: bold; font-size:25px; line-height: 1.25em; letter-spacing: -1px; padding: 7rem 0 0 4rem;} .colorY { color: #FFCC00;} .mobileCheck_btn { position: absolute; left:-60px; bottom: 35px; width:315px; padding: 0; margin: 0; } .mobileCheck_btn > img { border: 0;} #agree_area .graybox2 input { margin-top: 24px;} @media screen and (max-width:450px) { .mobileCheck_company, .mobileCheck_comment { width: 100%; min-width: 350px; background-size: 100%;} .mobileCheck_txt { font-size: 20px; padding: 5rem 0 0 4rem;} .mobileCheck_btn { bottom: 100px;} } /*******************************************************/ /*공단소개>HRDK소개>주요수상내역 관련 속성**/ /*******************************************************/ .awrdHeader { /* padding-bottom: 20px; */ background-color: #534eae; color: #fff; font-weight: 500; border-radius: 11px; padding: 45px 150px 45px 45px; letter-spacing: -0.5px; position: relative; font-size: 1.15em;} .awrd_characterBg{ background: url(/design5/images/awrd/awrd_character.png) no-repeat; background-position: 0 0; right: 0; bottom: 0px; width: 215px; position: absolute; height: 178px; background-size: 211px; } .awrdGroup { display:block; min-height:120px; padding:15px 0; border-bottom: 1px #000 dashed; display:flex;} .awrdGroup:last-child {border-bottom:none;} .awrdthumb { position: relative; min-width: 230px; position:relative; border: 1px solid #b9b9b9; border-radius: 5px; overflow: hidden; display: flex; justify-content: center; align-items: center;} .thumbnail > img { margin-top: 0 !important; } .awrdthumb_zoom { position:absolute; right: 10px; bottom:5px; font-size:22px; color: #fff; z-index: 92;} .awrdthumb_zoombg { position: absolute; right: -40px; bottom: -40px; background-color: #5a5a5a; width: 80px; height: 80px;transform: rotate( 45deg );z-index: 91} .awrdContents { padding: 20px;} .awrdthumb:hover { opacity: .8; filter: grayscale(1);} .awrdtitle { font-size: 18px; line-height: 25px; font-weight: bold; color: rgba(40, 40, 175, 0.712); padding-bottom: 20px; display: flex;} .awrdtxt { font-size: 18px; font-weight: normal; color: #888888; padding: 0 0 0 20px;} .awrdblt { display: block; min-width: 24px; height: 24px; font-weight: normal; line-height: 22px; text-align: center; border-radius: 50%; background-color: #2448ac; color:#fff; margin-right:5px;} @media screen and (max-width: 850px) { .awrdGroup { display: flex; flex-wrap: wrap;} .awrdthumb { min-width:100%; min-height: 150px; } } @media screen and (max-width: 670px) { .awrd_characterBg{ width: 149px;height: 127px; background-size: 150px;} } @media screen and (max-width: 450px) { .awrdHeader {padding:25px 150px 25px 45px} } /*******************************************************/ /*공단소개>HRDK소개>주요수상내역 뱃지디자인활용 재구성******/ /*******************************************************/ #awrdpop { max-width:600px; border: 1px solid #000; } #awrdoverlay { z-index: 1000; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0 0 0/ 0.6);display: flex; justify-content: center; align-items: center; } #awrdoverlay.hidden { display: none;} #close-btn { float: right; font-size: 28px; color: white; background-color: transparent; border: none; padding: 2rem; position: fixed; top: 8px; right: 16px; } .awrdcard_header { width: 100%; min-height: 180px; background-image: url('/design5/images/awrd/awrdtop_bg2.png'); background-position: right 20px bottom 0; background-repeat: no-repeat; padding: 0 20px; background-size:340px; box-sizing: border-box;} .awrdcard_header_title {padding-top: 50px; font-size: 16px; line-height: 1.5em; } .awrdcard_title_year {font-size: 30px; font-weight: 700; color: #074fad; letter-spacing: -1.8px; display: block; line-height: 1.5em; } .awrdcard_title_point {font-size: 25px; font-weight: 600; color: #0f2a47; letter-spacing: -2px; padding-right:5px; } .awrd_color1 {background-image: url(/design5/images/awrd/awrd_badge.png); background-repeat: no-repeat; background-size: cover; background-color: #003172;} /*국무총리상이상-기술사뱃지칼라*/ .awrd_color2 {background-image: url(/design5/images/awrd/awrd_badge_w.png); background-repeat: no-repeat; background-size: cover; background-color: #0067da;} /*장관상-기사뱃지칼라*/ .awrd_color3 {background-image: url(/design5/images/awrd/awrd_badge.png); background-repeat: no-repeat; background-size: cover; background-color: #5616cc;} /*국제대회-기능장뱃지칼라*/ .awrd_color4 {background-image: url(/design5/images/awrd/awrd_badge.png); background-repeat: no-repeat; background-size: cover; background-color: #5d6464;} /*기본*/ .awrdcard_group { display: flex; flex-wrap: wrap;} .awrd-card { background-color: #fff; border-radius: 15px; width: 280px; height: 370px; perspective: 1000px; margin: 20px 8px; display: flex; align-items: center; justify-content: center;} .awrd-card-inner { position: relative; width: 100%; height: 100%; text-align: center; transition: transform 0.6s; transform-style: preserve-3d; box-sizing: border-box;} .awrd-card:hover .awrd-card-inner { transform: rotateY(180deg);} .awrd-card-front, .awrd-card-back { position: absolute; width: 100%; height: 100%; padding:10px 8px; box-sizing: border-box; border:1px solid #e1e1e1; border-radius: 30px; -webkit-backface-visibility: hidden; backface-visibility: hidden;} .awrd-card-front { background-color: #f9f9f9; width: 100%; padding:20px 10px 10px} .awrd-card-back { background-color: #dfdfdf; transform: rotateY(180deg); box-sizing: border-box; padding:10px !important; display: flex; justify-content: center; align-items: center;} .awrd-card-badge { position: relative; width: 210px; height: 210px; border-radius: 50%; display: flex; justify-content: center; margin:0 auto; align-items: center; } .awrd-card-info { font-size: 12px; color: #fff;font-weight: 600;position: absolute;top:40px;text-align: center;} .awrd-card-title { padding: 20px 45px; font-size:14px; /*font-family: 'Godo';*/ line-height: 1.25em;color: #fff; font-weight: 500; margin: 0 auto; } .awrd-card-text { font-size: 14px; letter-spacing: -0.05em; line-height: 1.25em; padding:15px;} .awrd-card-back > .awrd-card-text { font-size:16px; color: #5f5f5f; letter-spacing: -0.05em; line-height: 1.25em; padding:25px;} .awrd-card-back-img { border: 2px solid #ffffff; border-radius:25px; width: 100%; height:330px; margin-top: 0 !important;} @media screen and (max-width:1000px) { .awrdcard_header {background-position: center bottom 0; background-size:250px; } .awrdcard_header_title {text-align: center; padding-top:20px; padding-bottom:150px;margin-bottom:0} .awrdcard_group { display: flex; flex-wrap: wrap; justify-content: center;} .awrd-card { width:48%; min-width: 230px; height:350px; margin:5px 8px;} .awrd-card-badge { width:100%; height: 210px; border-radius: 50%;} .awrd-card-info { top:33px;font-size:11px;} .awrd-card-text { padding:10px 0 0;} .awrd-card-back-img { height: 300px; } } @media screen and (max-width:600px) { .awrd-card { width:100%; height:345px; margin:5px 8px;} .awrd-card-badge { width:200px; height:200px; border-radius: 50%;} } /**************************************************************************** /*HRDK ESG / G(Governance)지배구조/ 윤리인권 / 경영소개 / 전략체계도 */ /***************************************************************************/ /*설립목적*/ .esg_governanceAR { padding:0 0 0 90px; margin-top: 20px} .esg_governanceAR > div { position: relative; border-top: 1px solid #979797; } .esg_governanceAR .h4_esgG { position: absolute; left: -90px; top: -1px; width: 90px; height: -webkit-fill-available; display: flex; justify-content: center; align-items: center; font-weight: 600; font-size: 16px; border-top: 1px solid #979797; margin-bottom: -1px; letter-spacing: -1px; color: #525252; } .esg_governanceAR .h4_esgG::after { content: ''; position: absolute; background-image: url(../images/contents_location.png); background-repeat: no-repeat; background-size: contain; width: 19px; height: 19px; right: -19px; top: 48%; margin-top: -10px; } .esg_governanceAR ul li { font-size:16px; letter-spacing: -1.3px; gap: 1; } .esg_governanceAR ul li span:first-child { letter-spacing: -0.5px; padding-right: 4px; font-weight: 500; font-size: 13px;} .esg_governanceAR ul li span.num { letter-spacing: -0.5px; padding-right: 4px; min-width:27px; font-weight: 500; font-size: 13px;} /* IE 10 and above */ /*li 속성오류 보종 */ @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .esg_governanceAR ul li { display: block !important; } } /*1.비전*/ .esgG_gride1 { display: flex;} .esgG_gride1 div { display: flex; flex-direction: column; justify-content: center; width: 100%;} .esg_governanceAR_header { font-size:22px; font-weight:500; text-align: center; color:#606060; background-color: #f2f8fe; } /*2.추진목표*/ .esgG_gride2 { display: flex; text-align: center; } .esgG_gride2 div { display: flex; align-items: center; justify-content: center;} .esgG_gride2_header { width: 100%; font-size:18px; font-weight:500; text-align: center; color:#606060; background-color:#fbf8ee; } /*3.중장기로드맵*/ .esgG_gride3 { display: flex; padding: 5px 0; } .esgG_gride3 div { display: flex; flex-direction: column;} .esgG_gride3 div ul { display: block; height: 100%; padding:8px; border: 1px solid #c4c4c4;margin: 1px;} .esgG_gride3 div ul li {font-size: 14px; padding:3px; text-align: center } .esgG_gride3 div p { text-align: center; padding:5px 0; background-color: #f7f7f7; border: 1px solid #afadad; margin: 1px 1px -2px 1px;} .esgG_gride3 div p span:first-child { font-weight: 400; /*color: #0e8add;*/ display: block;} .esgG_gride3_year { font-size: 18px; font-weight:700; } .esgG_gride3_title { font-size: 16px; font-weight: 500; line-height: 18px; } /*4.전략묙표*/ .esgG_gride4 { display: flex; padding: 5px 0; } .esgG_gride4 div { display: flex; flex-direction: column;} .esgG_gride4 div ul { display: block; height: 100%; padding:8px; border: 1px solid #c4c4c4; margin: 1px;} .esgG_gride4 div ul li { font-size: 14px; padding:3px; text-align: center; } .esgG_gride4 div ul li strong {color: #000;} /*5.중점추진과제*/ .esgG_gride5 { display: flex; padding: 5px 0; } .esgG_gride5 div { display: flex; flex-direction: column;} .esgG_gride5 div ul { display: block; height: 100%; padding:8px; border: 1px solid #c4c4c4;margin: 1px;} .esgG_gride5 div ul li {font-size: 14px; padding:3px; text-align: center } /*6.점검의결*/ .esgG_gride6 { display: flex; padding: 5px 0; } .esgG_gride6 div { display: flex; flex-direction: column;} .esgG_gride6 div ul { display: block; height: 100%; padding:8px; border: 1px solid #c4c4c4; margin: 1px;} .esgG_gride6 div ul li { font-size: 14px; padding:3px; text-align: center; } .esgG_gride6 div p { text-align: center; font-size: 15px; letter-spacing: -0.8px; font-weight: 600; padding: 10px; margin: 1px 1px -2px 1px; border: 1px solid #888888; } /*7.운영규범*/ .esgG_gride7 { display: flex; padding: 5px 0; } .esgG_gride7 div { display: flex; flex-direction: column;} .esgG_gride7 div ul { display: block; height: 100%; padding:8px; border: 1px solid #c4c4c4; margin: 1px;} .esgG_gride7 div ul li { font-size: 14px; padding:3px; text-align: center; } .esgG_gride7 div ul li strong {color: #000;} /*8.실행조직*/ .esgG_gride8 { display: flex; padding: 5px 0; } .esgG_gride8_table { width: 100%; display: flex; align-items: center; } .esgG_gride8_table th { background-color: #e7e7e7; font-size: 14px; font-weight: bold; height: 38px; border-top: 1px solid #d3d3d3 !important; border-top: none; padding:5px } .esgG_gride8_table td { padding: 5px; } /*9.모니터링환류*/ .esgG_gride9 { display: flex; text-align: center; padding: 5px 0; } .esgG_gride9 .grid25p {border: 1px solid #888; margin: 1px; } .esgG_gride9_dt { font-weight: bold; font-size: 15px; padding: 3px;} .esgG_gride9 div ul { display: block; height: 100%; padding:8px; margin: 1px;} .esgG_gride9 div ul li { font-size: 14px; padding:3px; text-align: center } /*모바일*/ @media screen and (max-width: 850px) { .esg_governanceAR { padding:0 15px; margin-top: 20px} .esg_governanceAR div { border: none;} .esg_governanceAR .h4_esgG { display: block; width: 100% !important; padding: 10px 0 30px 0 !important; font-size: 16px; font-weight: 600; text-align: center; left: 0; } .esg_governanceAR .h4_esgG br { display: none !important;} .esg_governanceAR .h4_esgG::after {transform: rotate(90deg) !important; top: 50px; width:20px; height: 20px; left: 50%; margin-left: -10px;} .esgG_gride1, .esgG_gride2, .esgG_gride3, .esgG_gride4, .esgG_gride5, .esgG_gride6, .esgG_gride7, .esgG_gride8, .esgG_gride9 { padding-top:60px } /* .esgG_gride6 div p { min-height: 60px; font-size: 14px;} */ .esgG_gride1 .hrdkMSystemAR_header { font-size:16px; letter-spacing: -3px; padding: 15px; } .esgG_gride3 .h5_esgG {font-size: 15px;line-height:15px; height: 90px; white-space: break-spaces;word-break: keep-all;} .esgG_gride3 p:last-child {font-size: 12px; border-top:none;letter-spacing: -1px;} .esgG_gride3 div ul { align-items: flex-start;} .esgG_gride3 div ul li, .esgG_gride3 div ul li { flex-direction: column;} .esgG_gride3.grid_h160 { height: auto;} .grid_h130 { height: auto !important;} .esgG_gride9 { word-break: break-all;} .esgG_gride8_table td { font-size: 14px; } .esgG_gride5.grid_h80 { height: 100px !important;} } @media screen and (max-width: 450px) { .esgG_gride6 { display: block;} /* .esgG_gride6 div p { min-height: 23px;} */ } /*모바일END*/ /*********************************************************************/ /*HRDK 창업 및 경제활성화 지원센터 신설 (수출수주지원단+특허활용지원센터)**/ /********************************************************************/ .export_header { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; margin-top: 30px; } .export_h3 { padding :0 0 0 0 !important; margin:65px 0 0 10px !important; height: 45px; text-align: center; width: 100%;} .export_h3::before { background-image: none !important;} .export_h3 img { width: auto; margin-top:0 !important} .export_header > div { width:375px; height:369px; margin: 10px; position: relative; } .export_hrdk_group { background: url(/design5/images/community/export_bg_hrdk.png) no-repeat;} .export_119_group { background: url(/design5/images/community/export_bg_119.png) no-repeat;} .export_grouptxt { position: relative; padding: 30px 30px 30px 45px; text-align: center; } .export_mobileCheck_btn { position: absolute; left:75px; bottom:65px; width:65%; margin: 0;box-sizing:border-box; border-radius: 35px; border: 8px solid #66cad9; background-color: #fff; } .export_mobileCheck_btn:hover { border: 8px solid #1d277c; } .export_mobileCheck_btn a { width: 100%; font-size:18px; letter-spacing:-0.07em ; padding:8px; font-weight: bold; display: flex; align-items: center; justify-content: center;} .export_mobileCheck_btn a img { margin-top: 0; width: auto;} .onestop { display: flex; justify-content: center; width: 220px; margin: 0 auto; flex-wrap: wrap;} .onestop li { width:40%; border-radius: 20px; border: 1px solid #666; background-color: #fff; font-weight: bold; font-size: 14px; text-align: center; margin:3px 5px; padding: 5px;} .export_infograph { padding: 40px 0;} .export_content { font-size: 18px; line-height: 1.35em; text-align: center; padding: 30px 0;} .export_content_point { font-size: 28px; font-weight:normal; line-height: 2em;} .export_grid_group { display: flex; align-items: top; justify-content: space-between; flex-wrap: wrap; padding: 20px 0;} .export_grid_group > div { width: calc(100%/3 - 8px); min-height: 250px; margin: 3px; border: 1px solid #666; border-radius: 8px; text-align: center; letter-spacing: -0.75px; background: linear-gradient( #32a9bb 5%, #ffffff 5%) } .export_grid_group > div > p { line-height: 1.15em !important; } .export_grid_h4 { padding:80px 0 10px 0 !important; font-size:25px !important; font-weight: bold; color: #32a9bb !important; background-position: center 15px; background-repeat: no-repeat } .export_grid_h4::before { background-image: none !important; } .export_grid01 { background-image: url(/design5/images/community/export_iconbg_01.png); } .export_grid02 { background-image: url(/design5/images/community/export_iconbg_02.png); } .export_grid03 { background-image: url(/design5/images/community/export_iconbg_03.png); } .export_endinfo { background: url(/design5/images/community/export_point_bg.png) no-repeat center 30px; padding: 100px 0 60px; margin: 30px 0; text-align: center; } .export_endinfo:hover { background-color: aliceblue; border-radius: 10px;} .export_infograph_m { max-width:470px; margin: 0 auto;} .export_character { position: absolute; right: -70px; bottom:17px; max-width:128px ; } .export_character_sp { position: absolute; right: -70px; bottom:-40px; max-width:129px; } @media screen and (max-width:480px) { .export_hrdk_group { background: linear-gradient( #fff 60px, #136dd2 60px); border: 1px solid #c1c1c1; border-radius: 10px;} .export_119_group { background: linear-gradient( #fff 60px, #f5f5f5 60px); border: 1px solid #c1c1c1; border-radius: 10px;} .export_h3 { padding: 20px 0 0 0 !important; margin: 0 0 0 0 !important; height: 45px; text-align: center; width: 100%; } .export_h3::before { background-image: none !important;} .export_header > div { height: auto !important; } .export_mobileCheck_btn{ position: unset; margin: 0 auto 10px; } .export_grouptxt { padding-bottom: 15px; } .export_character { display: none; } .export_infograph { padding: 0;} .export_character_sp { position: absolute; left:33%; bottom:-165px; max-width:129px; } .export_content_sp { margin-top: 150px;} } /*20241122 특허활용지원센터 컨텐츠추가*/ .patent_content { font-size: 18px; line-height: 1.35em; text-align: center; padding: 30px 0;} .patent_content_point { font-size: 28px; font-weight:normal; line-height: 2em;} .patent_body { background-color: #f5f5f5; border: 1px solid #c1c1c1; padding:40px 20px; border-radius: 5px; margin-top: 50px;} .patent_hrdk { background: url(/design5/images/community/patent_tophrdk.png) no-repeat center top; height:100px; margin-top: -80px; } .patent_body > h3 { text-align: center; font-size: 28px; font-weight: normal; padding-left:0; margin-top:0; } .patent_body > h3::before{ background-image: none; } .patent_grid_group { display: flex; align-items: top; justify-content: space-between; flex-wrap: wrap; padding: 20px 0; font-size: 16px; } .patent_grid_group > div { width: calc(100%/3 - 8px); min-height: 330px; margin: 3px; border: 1px solid #bfbfbf; border-radius: 8px; text-align: center; letter-spacing: -0.75px; background: linear-gradient( #4aa6db 5%, #ffffff 5%); display: flex ; flex-direction: column; align-items: center; } .patent_ul { display: flex; flex-direction: column; } .patent_ul > li { padding:2px; display:flex; align-items:center } .li_num { width: 18px; height: 18px; text-align: center; font-size: 13px; border-radius: 50%; color: #fff; background-color: #666; display: block; margin-right:5px; line-height: 18px; margin-top:3px; } .patent_grid_h4 > span { display: block; line-height: 16px; font-weight: bold; font-size: 22px; } .patent_grid_h4 { padding:10px 0 90px 0 !important; font-size:25px !important; font-weight: bold; color: #181818 !important; background-position: center 85px; background-repeat: no-repeat } .patent_grid_h4::before { background-image: none !important; } .patent_grid01 { background-image: url(/design5/images/community/patent_iconbg_01.png); } .patent_grid02 { background-image: url(/design5/images/community/patent_iconbg_02.png); } .patent_grid03 { background-image: url(/design5/images/community/patent_iconbg_03.png); } /*컨설팅신청서 다운로드버튼영역*/ .patent_download { padding: 30px 0; margin:0; text-align: center; display: flex; align-items: center; justify-content: center; flex-direction: column;} .patent_download_icon { width: 50px; height: 50px; border-radius: 50%; background-color: #df0d0d; margin-bottom: 15px; display: flex; align-items: center; justify-content: center;} .patent_download_icon > img { margin-top: 0;} @media screen and (max-width:680px) { .patent_content_sp { margin-top: 150px;} .patent_grid_group { display: flex; flex-direction: column; padding: 20px 0; font-size: 16px; } .patent_grid_group > div { width: calc(100%/1 - 8px) } } /*********************************************************************/ /*공공기관 협력 ICT 관련 직무 가이드**/ /********************************************************************/ .ict_header { background: url(/design5/images/ictguide/ict_character_bg.png) no-repeat right bottom; padding: 40px 20px 20px; text-align: left; letter-spacing: -1px; } .ict_chartbody { display: flex; flex-wrap: wrap;justify-content:space-between; margin-top: 30px; position: relative; } .ict_chartinfo { position: absolute; right: 0; font-size: 15px; padding-bottom: 5px;} .ict_chartgrid { background: linear-gradient( #e6e6e6 50px, #fff 50px); border: 1px solid #d7d7d7; border-radius: 10px; width:calc(100%/2 - 12px); margin: 30px 0; min-height: 290px; } .chart { text-align: center; padding:30px 20px;} .chart > img { width: auto; height: auto; margin-top:0} .ict_chartgrid_h4 { font-size:17px !important; font-weight: bold; letter-spacing: -1px; margin:12px !important; padding-left:10px !important } .ict_chartgrid_h4::before { background-image: none !important; } /*직무면접과 시험문제 질의와 답변*/ .ict_qnabody { display: flex; flex-wrap: wrap; margin-top: 40px; } .ict_qna { box-sizing: border-box; width: 100%;} .ict_q, .ict_a { border-width: 1px; border-style:dashed;padding: 30px; position: relative; display: flex; margin: 10px; } .ict_q { width: 75%; border-radius:70px; border-color: #b1cde3; background-color: #f5f5f5; box-sizing: border-box;} .ict_a { width: 85%; border-radius:90px; border-color: #cac2c1; background-color: #f7ebeb; margin-inline-start:15%; box-sizing: border-box;} .ict_q > h4 { background: url(/design5/images/ictguide/ict_question_icon.png) no-repeat 0 0; padding: 40px 0 0 160px; height: 150px; box-sizing: border-box; position: absolute; top: -30px; left: -10px; font-size: 24px; font-weight: bold; color: #2054ca; } .ict_a > h4 { background: url(/design5/images/ictguide/ict_reply_icon.png) no-repeat right top; padding: 100px 160px 0 0; height: 150px; position: absolute; top: -85px; right: -20px; color: #555555; box-sizing: border-box; } .ict_q > h4, .ict_a > h4 { margin-bottom:0; margin-top:0; font-weight: bold; font-size: 24px } .ict_q > h4::before, .ict_a > h4::before { background-image: none !important;} .ict_q > p, .ict_a > p { line-height: 20px; font-size: 16px; letter-spacing: -1px;} .ict_q_txt { padding: 20px 0 0 120px;} .ict_a_txt { padding: 30px 30px 20px;} /*현업담당자의 조언*/ .ict_advicebody { display: flex; flex-wrap: wrap; margin-top:55px; } .ict_advice { box-sizing: border-box; width: 100%; position: relative; padding-inline-start:80px; box-sizing: border-box; margin-bottom: 25px;} .ict_advice > h4 { padding:50px 0 0 180px; height: 150px; box-sizing: border-box; position: absolute; top: -60px; left: 0; font-size: 24px; font-weight: bold; } .ict_advice > h4::before { background-image: none !important;} .ict_advice_content { width: 100%; padding: 50px 20px 20px 80px; box-sizing: border-box; border-radius: 10px; border-width: 1px; border-style: solid;} .ict_advice_dl { display: flex; align-items: start; padding: 20px; width: 100%; box-sizing: border-box; font-size: 16px;} .ict_advice_dl > dt { width: 30%; border-radius: 20px; padding: 5px 20px; text-align: left; margin-right: 10px; font-weight: 600; border: 1px dashed #cacaca; background-color: #fff;} .ict_advice_dl > dd { width: 70%; } /*매니져아이콘*/ .ict_manager1 { background: url(/design5/images/ictguide/manager1.png) no-repeat 0 0;} .ict_manager2 { background: url(/design5/images/ictguide/manager2.png) no-repeat 0 0;} .ict_manager3 { background: url(/design5/images/ictguide/manager3.png) no-repeat 0 0;} .ict_manager4 { background: url(/design5/images/ictguide/manager4.png) no-repeat 0 0;} /*담당자조언박스속성*/ .ict_advice1 {background-color: #f9f6ff; border-color: #c7c7c7;} .ict_advice2 {background-color: #ffffff; border-color: #c75440;} .ict_advice3 {background-color: #f2f6ff; border-color: #4844af;} .ict_advice4 {background-color: #ffffff; border-color: #5ea85f;} @media screen and (max-width:680px) { .chart { padding: 0;} .chart > img { width: 100%;} .ict_header { background-position: center bottom; padding-bottom: 180px; } .ict_chartgrid { width:calc(100%/1 - 12px); } .ict_q, .ict_a { width: 100%; margin: 10px 0;} .ict_a { margin-inline-start:0;} .ict_q > h4 { background-size:90px; padding:35px 0 0 100px; height: 90px;} .ict_a > h4 { background-size:90px; padding:45px 100px 0 0; top: -38px; right: 6px; height: 90px; } .ict_q_txt { padding: 20px 0 0 63px;} .ict_advice > h4 { padding:50px 0 0 120px !important; background-size: 90px;} .ict_advice_content { padding: 50px 10px 10px 20px !important;} .ict_advice_dl { display: flex; flex-direction: column; box-sizing: border-box;} .ict_advice_dl > dt { width: 100% !important; margin-right:0; box-sizing: border-box;} .ict_advice_dl > dd { width: 100% !important; padding: 0 20px; box-sizing: border-box; } } /*HRDK 발자취 EBOOK*/ .hrdk_ebookHeader { padding: 40px 0; text-align: center; margin: 0 auto;} .hrdk_ebookHeader > span {display: block;} .hrdk_ebookBg { position: relative; background: url(/design5/images/hrdk_ebookBg.jpg) no-repeat left top; width: 100%; height:530px ;} .hrdk_ebook_go { width: 162px; height: 162px; border-radius: 50%; cursor: pointer; background-image:linear-gradient(to bottom,#333333 60%, #0067da 40%); color: #fff; display: flex; flex-direction:column; justify-content: end; align-items: center; position: absolute; right: 50px; bottom: 20px; } .hrdk_ebook_go:hover { background-image:linear-gradient(to bottom,#333333 60%, #6d00da 40%); } .ebook_go > a { color: #fff; font-weight: bold; line-height: 80px; } @media screen and (max-width:680px) { .hrdk_ebookBg { background-size: contain; height: 300px;} .hrdk_ebook_go { left: 50%; margin-left: -80px; } } /*************************************************************************/ /* 사업소개-외국인고용지원-외국인근로자지원-EPS-TOPIK-기능시험 / 컨텐츠테이블속성 */ /************************************************************************/ .epsTable1 th {padding:8px !important; } .epsTable1 td {padding:5px !important; } .epsTable1 th.th_2dept { background-color: #f6f6f6; border-top: 1px solid #727272; font-size: 0.95em; } .td_topline {border-top: 2px solid #137fd2;} .eps_dlDepth { display: flex; padding-left: 15px; font-size: 14px; } .eps_dlDepth > dt { padding-right: 10px; min-width: 45px;}