/** 국민소통 **/ /* 국민소통 공통 */ .sub-innovation-top { position: relative; margin-top: 50px; padding: 50px 40px; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;} .sub-innovation-top::before { content: ''; position: absolute; top: -1px; left: 0; width: 220px; height: 1px; background-color: var(--primary-color);} .sub-innovation-top::after { content: ''; position: absolute; top: 0; left: 0; width: 1px; height: 250px; background-color: var(--primary-color);} .sub-innovation-top > .tit { color: #121212; font-size: 1.2rem;} .sub-innovation-top > .tit span { color: var(--primary-color);} .sub-innovation-top > .txt { color: #121212; font-size: 1rem;} .sub-innovation-top > .tit + .txt { padding-top: 10px;} .tit + .sub-innovation-common-bx{margin-top: 40px;} .txt + .sub-innovation-common-bx{margin-top: 40px;} .sub-innovation-common-bx { position: relative; display: flex; justify-content: space-between; align-items: center; min-height: 230px; /* margin-top: 40px; */ padding: 50px 0px; background-color: #f5f5f5; color: #121212; font-size: 18px; overflow: hidden; z-index: 0;} .sub-innovation-common-bx::before { content: ''; position: absolute; right: 0; bottom: -150px; width: 380px; height: 380px; background: url(/images/contents/img-ci02-logo.svg) 50% / contain no-repeat; opacity: 0.03; z-index: -1;} .sub-innovation-common-bx > div{padding:0 50px;} .sub-innovation-common-bx > div:first-child { width: 65%; } /* .sub-innovation-common-bx > div:last-child { width: 32%; text-align: center;} */ .sub-innovation-common-bx h5 { font-size: 1.3rem;} .sub-innovation-common-bx h5 span { font-weight: 400;} .sub-innovation-common-bx p { font-size: 1rem; } .sub-innovation-common-bx h5 + p { padding-top: 15px;} .sub-opinion01-cover { display: flex; justify-content: center; align-items: center; width: 160px; height: 160px; margin: 0 auto; background-color: #fff; border-radius: 50%;} .sub-cover-linkbx{display:flex;} .sub-cover-linkbx a{display:inline-block;height:100%;margin:5px 0;padding:50px 15px 20px;background-color: #fff;} a.wbx{display:inline-block;height:100%;margin:5px 0;padding:50px 15px 20px;background-color: #fff;} .sub-cover-linkbx a + a{margin-left:10px;} .information-bx{display:flex;border:1px solid #ddd;} .information-bx > div{width:50%;padding:40px;} .information-bx > div + div {border-left:1px solid #ddd;} .board-bottom-btn { display: flex; justify-content: center; align-items: center;} .board-bottom-btn a { display: block; width: 160px; height: 60px; line-height: 60px; margin: 0 5px; text-align: center;} .board-bottom-btn .cancel-btn { color: #999; border: 1px solid #ccc;} .board-bottom-btn .register-btn { color: #fff; background-color: var(--primary-color);} .write-btn-box{display: flex; justify-content: space-between; align-items: center;padding:30px;border:1px solid #ddd;} .write-btn-box p{font-family:var(--font-s-core);} .st-tbl{display:flex;width:100%;font-size:14px;border:1px solid #D5D5D5;} .st-tbl dl{display:table;width:50%;} .st-tbl dl > *{display:table-cell;padding:10px 20px;} .st-tbl dt{font-weight:500;background:#F6F6F6;} .tab-wrap{} .tab-wrap .tab-contents > div{display:none;} .tab-wrap .tab-contents{margin-top:50px;} .tab-wrap .tab-head {background:#F8F8F8;} .tab-wrap .tab-head.tab-bglight {background:#fff;} .tab-wrap .tab-head li{border:1px solid #D9D9D9;} .tab-wrap .tab-head li a{ display: flex; width:100%;height: 100%;min-height: 40px; padding:5px; align-items: center;justify-content: center;line-height:1.4;text-align:center;cursor:pointer;} .tab-wrap .tab-head li.active a{ color: #fff; } .tab-head-df {display:flex;} .fwrap-half{flex-wrap: wrap;} .tab-head-df li{position:relative;width:50%;height:3em;margin-bottom:-1px;display:flex;align-items: center;justify-content: center;text-align:center;} .tab-head-df li.active{color:var(--primary-color);font-weight:500;background:#fff;} .tab-head-df li.active a{color:var(--primary-color) !important;} .tab-head-df li a:hover{text-decoration:none;} .tab-head-df li.active:before{content:'';position:absolute;top:-1px;left:-1px;right:-1px;bottom:0;border:1px solid var(--primary-color);} .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(2), .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(2) ~ li {width: calc(100% / 2);} .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(3), .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(3) ~ li {width: calc(100% / 3);} .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(4), .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(4) ~ li {width: calc(100% / 4);} .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(5), .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(5) ~ li {width: calc(100% / 5);} .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(6), .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(6) ~ li {width: calc(100% / 6);} .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(7), .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(7) ~ li {width: calc(100% / 7);} .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(8), .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(8) ~ li {width: calc(100% / 8);} .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(9), .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(9) ~ li {width: calc(100% / 9);} .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(10), .tab-head-df:not(.fwrap-half) li:first-child:nth-last-child(10) ~ li {width: calc(100% / 10);font-size:15px;line-height:1.4;} .tab-head-df-free{display:flex;} .tab-head-df-free li.active{color:#fff;background:#7A7A7A;border-color:#7A7A7A;} .tab-head-df-free li:first-child:nth-last-child(2), .tab-head-df-free li:first-child:nth-last-child(2) ~ li {width: calc(100% / 2);} .tab-head-df-free li:first-child:nth-last-child(3), .tab-head-df-free li:first-child:nth-last-child(3) ~ li {width: calc(100% / 3);} .tab-head-df-free li:first-child:nth-last-child(4), .tab-head-df-free li:first-child:nth-last-child(4) ~ li {width: calc(100% / 4);} .tab-head-df-free li:first-child:nth-last-child(5), .tab-head-df-free li:first-child:nth-last-child(5) ~ li {width: calc(100% / 5);} .tab-head-df-free li:first-child:nth-last-child(6), .tab-head-df-free li:first-child:nth-last-child(6) ~ li {width: calc(100% / 6);} .tab-head-df-free li:first-child:nth-last-child(7), .tab-head-df-free li:first-child:nth-last-child(7) ~ li {width: calc(100% / 7);} .tab-head-df-free li:first-child:nth-last-child(8), .tab-head-df-free li:first-child:nth-last-child(8) ~ li {width: calc(100% / 8);} .tab-head-df-free li:first-child:nth-last-child(9), .tab-head-df-free li:first-child:nth-last-child(9) ~ li {width: calc(100% / 9);} .tab-head-df-free li:first-child:nth-last-child(10), .tab-head-df-free li:first-child:nth-last-child(10) ~ li {width: calc(100% / 10);} .tab-wrap .tab-head.tab-head-df > li.active{display:flex;} .tab-wrap .tab-head > li.active, .tab-wrap .tab-contents > div.active{display:block;} /* 열린혁신 소통광장 */ .sub-open01-wrap { position: relative;} .sub-open01-wrap::before { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 77%; background-color: #f5f5f5; z-index: -1;} .sub-open01-bx { margin-top: 50px; padding: 60px 0; } .sub-open01-bx > p { font-size: 1.2rem;} .sub-open01-bx ul { display: flex; flex-wrap: wrap; justify-content: space-between; padding-top: 40px;} .sub-open01-bx .item { width: calc((100% / 3) - 10px);} .sub-open01-bx .item .item-bx { position: relative; padding: 40px 35px; background-color: #fff; border: 1px solid #ddd; box-shadow: 4px 4px 10px rgba(0,0,0,0.1); transition: all .3s;} .sub-open01-bx .item .item-bx::before { content: ''; position: absolute; top: 0; left: 0; width:0; height: 2px; background-color: var(--primary-color); transition: all .2s .45s;} .sub-open01-bx .item .item-bx::after { content: ''; position: absolute; top: 0; right: 0; width: 2px; height: 0; background-color: var(--primary-color); transition: all .2s .3s;} .sub-open01-bx .item-bx > div::before { content: ''; position: absolute; bottom: 0; right: 0; width:0; height: 2px; background-color: var(--primary-color); transition: all .2s .15s;} .sub-open01-bx .item-bx > div::after { content: ''; position: absolute; bottom: 0; left: 0; width: 2px; height: 0; background-color: var(--primary-color); transition: all .2s;} .sub-open01-bx .item p { color: #000; } .sub-open01-bx .item p.badge{font-size: 1.5em;} .sub-open01-bx .item p:not(.badge){padding-top:5px;font-size: 1em;line-height:1.5;} .sub-open01-bx .item .txt-shortcut { display: inline-block; margin-top: 10px; font-size: 0.9rem; z-index: 1; transition: all .3s;} .sub-open01-bx .item .icon { padding-top: 25px; text-align: right;} .sub-open01-bx .item .ir { width: 90px; height: 90px; opacity: 0.2; transition: all .3s;} .sub-open01-bx .item:nth-child(1) .ir { background: url(/images/contents/ico-open01.png) 50% no-repeat;} .sub-open01-bx .item:nth-child(2) .ir { background: url(/images/contents/ico-open02.png) 50% no-repeat;} .sub-open01-bx .item:nth-child(3) .ir { background: url(/images/contents/ico-open03.png) 50% no-repeat;} .sub-open01-bx .item:hover > div::before { opacity: 1;} .sub-open01-bx .item:hover .txt-shortcut { color: var(--primary-color);} .sub-open01-bx .item:hover .ir { opacity: 1;} .sub-open01-bx .item:hover .item-bx::before { width: 100%; transition: all .15s;} .sub-open01-bx .item:hover .item-bx::after { height: 100%; transition: all .15s .15s;} .sub-open01-bx .item:hover .item-bx > div::before { width: 100%; transition: all .15s .3s;} .sub-open01-bx .item:hover .item-bx > div::after { height: 100%; transition: all .15s .45s;} /* 안전보건 소통광장 */ .sub-safety04-bx {} .sub-safety04-bx ul { display: flex;} .sub-safety04-bx li { width:50%;max-width: 160px; } .sub-safety04-bx li a { display: block; height: 50px; line-height: 50px; padding: 0 10px; background: #666 url(/images/common/btn-arrow.png) calc(100% - 10px) 50% no-repeat; color: #fff; font-weight: 500;} .sub-safety04-bx li:first-child a { margin-right: 10px; background-color: var(--primary-color);} /* 혁신아이디어제안 */ .sub-opinion02-bx .sub-opinion02-cont { display: flex; align-items: flex-end; padding-top: 20px;} .sub-opinion02-bx .sub-opinion02-cont a { display: block; width: 350px; height: 55px; line-height: 55px; padding: 0 25px; background: var(--primary-color) url(/images/common/btn-arrow.png) calc(100% - 25px) 50% no-repeat; color: #fff; font-size: 0.9rem; border-radius: 5px;} .sub-opinion02-bx .sub-opinion02-cont p { padding-left: 20px; font-size: 0.9rem;} /* 칭찬합시다 */ .sub-write-bx { padding-bottom: 40px; border-bottom: 1px solid #ddd;} .sub-write-bx ul {} .sub-write-bx .item { display: flex; } .sub-write-bx .item + .item { padding-top: 20px;} .sub-write-bx .item .tit { width: 250px; font-size: 18px;} .sub-write-bx .item .txt { width: calc(100% - 250px);} .sub-write-bx .item .txt > input, .sub-write-bx .item .txt > textarea, .sub-write-bx .item .txt > select { padding: 0 20px; border-color: #ddd;} .sub-write-bx .item .txt input { width: 100%; height: 48px; font-size: 14px;} .sub-write-bx .item .txt select { width: 50%; height: 48px; font-size: 14px;} .sub-write-bx .item .txt textarea { width: 100%; min-height: 180px; padding: 20px; resize: none;} .sub-write-bx .item .file-bx { position: relative; display: flex; justify-content: space-between; padding: 0; margin-bottom:4px;} .sub-write-bx .item input[type="file"] { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); border: 0;} .sub-write-bx .item .txt .file-name { display: inline-block; width: calc(100% - 110px); height: 50px; padding: 0 20px; color: #666; border: 1px solid #ddd;} .sub-write-bx .item label { display: inline-block; width: 100px; height: 50px; line-height: 50px; background-color: #666; color: #fff; font-size: 0.9rem; text-align: center; cursor: pointer; border-radius: 5px;} .sub-write-bx .item .file-bx button { position: absolute; top: 50%; right: 20px; transform: translateY(-50%); width: 15px; height: 15px;} .sub-write-bx .item .file-bx button::before, .sub-write-bx .item .file-bx button::after { content: ''; position: absolute; top: 0; left: 0; width: 1px; height: 12px; background-color: #000; border-radius: 5px;} .sub-write-bx .item .file-bx button::before { transform: rotate(-45deg);} .sub-write-bx .item .file-bx button::after { transform: rotate(45deg);} .sub-write-bx .item .file p { padding-top: 15px; color: #666; font-size: 0.9rem;} /* POLA 기업성장응답센터 */ .sub-growth01-bx { padding: 50px 40px;} .sub-growth01-bx > div:first-child { padding: 0;} .sub-growth01-bx ul {} .sub-growth01-bx .item { display: flex; padding-bottom: 10px; color: #121212; font-size: 1rem;} .sub-growth01-bx dl { display: flex;} .sub-growth01-bx dt { position: relative; padding-left: 15px; font-weight: 700;} .sub-growth01-bx dt::before { content: ''; position: absolute; top: 8px; left: 0; width: 6px; height: 6px; background-color: var(--primary-color); border-radius: 50%;} .sub-growth01-bx dd { padding-left: 5px;} .sub-growth01-bx .list dl { display: block;} .sub-growth01-bx .list dt { padding-bottom: 10px;} .sub-growth01-bx .list dd { padding-left: 15px;} .sub-growth01-bx .anchor { color: var(--primary-color); text-decoration: underline;} .sub-growth01-bx .etc { font-size: 0.8rem;} .sub-growth01-cover {} .sub-growth01-cover a { display: block; max-width: 300px; margin: 0 auto; padding: 15px; background: var(--primary-color) url(/images/common/btn-arrow.png) calc(100% - 15px) 50% no-repeat; color: #fff; font-weight: bold; text-align: left;} .sub-growth02-bx {} .sub-growth02-bx ol { display: flex;} .sub-growth02-bx .item { position: relative; width: 25%; height: 305px; text-align: center;} .sub-growth02-bx .item:nth-child(1) > div{background: url(/images/contents/img-growth02-01.png) 50% / contain no-repeat;} .sub-growth02-bx .item:nth-child(2) > div{background: url(/images/contents/img-growth02-02.png) 50% / contain no-repeat;} .sub-growth02-bx .item:nth-child(3) > div{background: url(/images/contents/img-growth02-03.png) 50% / contain no-repeat;} .sub-growth02-bx .item:nth-child(4) > div{background: url(/images/contents/img-growth02-04.png) 50% / contain no-repeat;} .sub-growth02-bx .item > div { height: 100%; padding-right: 35px; width: 100%;overflow: hidden; } .sub-growth02-bx .item .item-tit { display: flex; flex-direction: column; justify-content: center; align-items: center; height: calc(100% - 160px); padding-top: 60px;} .sub-growth02-bx .sub-growth02-icon {} .sub-growth02-bx .sub-growth02-icon .ir { display: inline-block; width: 50px; height: 50px; } .sub-growth02-bx .item:nth-child(1) .sub-growth02-icon .ir { background: url(/images/contents/ico-growth02-01.png) 50% / contain no-repeat;} .sub-growth02-bx .item:nth-child(2) .sub-growth02-icon .ir { background: url(/images/contents/ico-growth02-02.png) 50% / contain no-repeat;} .sub-growth02-bx .item:nth-child(3) .sub-growth02-icon .ir { background: url(/images/contents/ico-growth02-03.png) 50% / contain no-repeat;} .sub-growth02-bx .item:nth-child(4) .sub-growth02-icon .ir { background: url(/images/contents/ico-growth02-04.png) 50% / contain no-repeat;} .sub-growth02-bx .item-tit h4 { color: #FFA367; font-size: 1.2rem;} .sub-growth02-bx .item-tit p { padding-top: 5px; color: #757575; font-size: 0.9rem; font-weight: bold;} .sub-growth02-bx .item-txt { position: absolute; bottom: 0; left: 3%; right: 13%; height: 110px; padding: 20px 0 0; background-color: #f5f5f5;z-index:-1;border-radius:0 0 40px 40px;} /*.sub-growth02-bx .item-txt::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #f5f5f5; border-bottom-left-radius: 35px; border-bottom-right-radius: 35px; z-index: -2;}*/ .sub-growth02-bx .item-txt > * { color: #000; font-weight: bold; z-index: 1;} .sub-growth02-bx .item-txt .txt01 { font-size: 0.9rem;} .sub-growth02-bx .item-txt .txt02 { font-size: 0.7rem;} .sub-growth02-bx .item dl { display: flex; } .sub-growth02-bx .item:nth-child(2) dl { justify-content: center; } .sub-growth02-bx .item:nth-child(2) dl div { padding-left: 5%;} .sub-growth02-bx .item:nth-child(2) dd { text-align: left;} .sub-growth02-bx .item:nth-child(3) dl { padding: 0 5px 0 20px; align-items: center;} .sub-growth02-bx .item:nth-child(3) dl + dl { padding-top: 5px;} .sub-growth02-bx .item:nth-child(3) dd { padding-left: 3px;} .sub-growth02-bx .item:nth-child(4) { padding-right: 0;} .sub-growth02-bx .item:nth-child(4) .item-txt { padding: 20px 25px; right: 7%; text-align: left;} .sub-growth02-bx .item:nth-child(4) li + li { padding-top: 5px;} .sub-growth03-btn-bx { padding-top: 60px;} .sub-growth03-btn-bx ul { display: flex; justify-content: flex-end;} .sub-growth03-btn-bx li { } .sub-growth03-btn-bx li + li { margin-left: 15px; } .sub-growth03-btn-bx li a { display: block; width: 290px; height: 60px; line-height: 60px; padding: 0 20px; background: url(../../images/common/btn-arrow.png) calc(100% - 20px) 50% no-repeat; color: #fff; font-weight: bold;} .sub-growth03-btn-bx li:first-child a { background-color: var(--primary-color);} .sub-growth03-btn-bx li:last-child a { background-color: #666;} .sub-growth04-bx { display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 70px 0; border: 10px solid #ddd;} .sub-growth04-bx h4 { padding-top: 40px; color: #121212; font-size: 1.2rem; text-align: center;} .sub-growth04-bx h4 span { color: var(--primary-color); font-weight: bold;} .sub-growth04-bx ul { padding-top: 45px;} .sub-growth04-bx li { font-size: 0.9rem; color: #121212; text-decoration: underline;} .sub-growth04-bx li + li { padding-top: 20px; font-size: 0.9rem;} .sub-growth04-bx li span { color: var(--primary-color); text-decoration: underline;} .sub-growth05-wrap p { color: #121212; font-weight: 0.9rem;} .sub-growth05-bx { padding-top: 60px;} .sub-growth05-bx ul { display: flex;} .sub-growth05-bx li + li { margin-left: 15px;} .sub-growth05-bx li a { display: block; width: 290px; height: 60px; line-height: 60px; padding: 0 20px; background: #666 url(/images/common/btn-arrow.png) calc(100% - 20px) 50% no-repeat; color: #fff; font-weight: bold;} .sub-growth05-bx li:first-child a { background-color: var(--primary-color);} /** ESG경영 **/ /** POLA 소식 **/ /* 보도 해명자료 */ .boardPress table { border-top: 2px solid #999;} /* 사회책임경영 */ /** POLA 소개 **/ /* 인사말 */ .sub-greeting-inner{display:flex;justify-content: space-between;} .sub-greeting01-wrap {width:56%} .sub-greeting01-bx { } .sub-greeting01-bx h4 { position: relative; padding: 45px 0;} .sub-greeting01-bx h4::before, .sub-greeting01-bx h4::after { content: ''; position: absolute; left: 0; width: 20px; height: 18px; background: url(../../images/contents/ico-quote.png) 50% no-repeat;} .sub-greeting01-bx h4::before { top: 0;} .sub-greeting01-bx h4::after { bottom: 0; transform: rotate(180deg);} .sub-greeting01-bx p { padding: 1em 0 0 0; color: #000; } .sub-greeting02-wrap {} .sub-greeting02-cover-bg { position: relative; text-align: center;} .sub-greeting02-cover { text-align: center;} .greeting02-ceo {padding: 10px 0; color: #333; text-align:right;} .greeting02-ceo span { font-size: 1rem;} .greeting02-ceo p { font-size: 2rem; font-weight: bold;} .sub-greeting02-txt { color: #000;} .sub-greeting02-txt .txt { } .sub-greeting02-txt ol { padding-top: 80px; list-style: none;} .sub-greeting02-txt ol li + li { padding-top: 30px;} .sub-greeting02-txt ol li b { font-size: 1rem;} .sub-greeting02-txt p { padding-top: 50px;} .sub-greeting02-txt p + p { } .sub-greeting02-txt .ceo-name { margin-left: 20px; vertical-align: bottom;} /* 역대 기관장 */ .sub-generation-bx { padding-top: 80px;} .sub-generation-bx ul { display: flex; flex-wrap: wrap; margin: 0 -10px;} .sub-generation-bx .item { width: 25%; padding: 0 10px 40px; text-align: center;} .sub-generation-bx .item > div { padding: 20px 30px; background: url(../../images/contents/ico-generation-item.png) 0 100% no-repeat; border: 1px solid #ddd; transition: all .3s;} .sub-generation-bx .item > div:hover { border-color: var(--primary-color); box-shadow: 0 0 20px 0 rgba(0,0,0,0.2);} .sub-generation-bx .generation-tit { height: 50px; line-height: 50px; background-color: var(--primary-color); color: #fff; font-size: 0.9rem;} .sub-generation-bx .generation-cover { padding-top: 20px;} .sub-generation-bx .generation-txt { padding-top: 10px;} .sub-generation-bx .generation-txt .name { color: #000; font-size: 1rem; font-weight: 700;} .sub-generation-bx .generation-txt .date { padding-top: 5px; color: #666; font-size: 0.9rem;} /* 기관연혁 */ .sub-history-tit { display: flex; justify-content: space-between; align-items: flex-end;} .sub-history-tit p { padding-top: 40px;} .sub-history-tit a { display: flex; justify-content: space-between; align-items: center; width: 350px; height: 50px; line-height: 50px; padding: 0 25px; color: var(--primary-color); border: 1px solid var(--primary-color); transition: all .3s;} .sub-history-tit a:hover { background-color: var(--primary-color); color: #fff;} .sub-history-tit a:hover path { fill: #fff; } .sub-history-tab { padding-top: 80px;} .sub-history-tab ul { display: flex; } .sub-history-tab ul li { width: 20%; color: #666; border-bottom: 1px solid #ddd; text-align: center;} .sub-history-tab ul li button { width: 100%; height: 80px; font-size: 1rem; } .sub-history-tab ul li.active { border-bottom: 4px solid var(--primary-color); } .sub-history-tab ul li.active button { color: var(--primary-color); font-weight: bold;} .sub-history-bx { padding-top: 60px;} .sub-history-bx ul {} .sub-history-bx .item { display: none;} .sub-history-bx .item:first-child { display: block;} .sub-history-bx .item > div { display: flex;} .sub-history-bx .history-cover { } .sub-history-bx .history-cover .period { position: relative; width: 260px; height: 150px; line-height: 150px; margin-top: -75px; background-color: var(--primary-color); color: #fff; font-size: 3rem; font-weight: bold; text-align: center; box-shadow: 4px 4px 10px 0 rgba(0,0,0,0.2);} .sub-history-bx .history-list { padding-left: 75px;} .sub-history-bx .history-list ul { position: relative;} .sub-history-bx .history-list ul::before { content: ''; position: absolute; top: 10px; left: 5px; transform: translateX(-50%); width: 1px; height: calc(100% - 20px); background-color: #ddd;} .sub-history-bx .history-list li { position: relative; display: flex; padding-left: 35px;} .sub-history-bx .history-list li::before { content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 10px; height: 10px; background-color: #ddd; border-radius: 50%;} .sub-history-bx .history-list li:first-child:before { background-color: var(--primary-color);} .sub-history-bx .history-list li + li { margin-top: 60px;} .sub-history-bx .history-list li .year { display: inline-block; width: 200px; color: #121212; font-size: 1rem; font-weight: bold;} .sub-history-bx .history-list li .txt { font-size: 0.9rem; } /* 자료실 */ .data-nav-tab { padding: 60px 0;} .data-nav-tab ul { display: flex;} .data-nav-tab .item { width: calc(100% / 6);} .data-nav-tab .item a { display: block; height: 60px; line-height: 60px; text-align: center; border: 1px solid #ddd; border-bottom-color: var(--primary-color); border-right: 0;} .data-nav-tab .item:last-child a { border-right: 1px solid #ddd;} .data-nav-tab .item.active a { color: var(--primary-color); border: 1px solid var(--primary-color); border-bottom: 0;} .data-nav-tab .item.active + .item a { border-left: 0;} .sub-data-01 { margin-top: 0;} /* 기관 홍보물 */ .sub-promotion01-wrap {} /* 기관 영상 */ .sub-video01-wrap {} /* 전문자료 */ .sub-dataroom01-wrap {} /* 수상·인증 */ .sub-certification01-wrap {} /* 협력 기관·기업 */ .sub-partner01-wrap {} /* 기관 상징 */ .sub-ci-cont { padding: 40px 0; /*background-color: #f5f5f5;*/ text-align: center;} .sub-ci-cont.white { background-color: transparent;} .sub-ci01-wrap .colorGray6 { font-size: 0.9rem;} .sub-ci02-wrap .sub-ci-cont ul { display: flex; justify-content: center;} .sub-ci02-wrap .sub-ci-cont .item { display: flex; justify-content: center; align-items: center; width: 460px; height: 240px; margin: 0 10px; background-color: #fff; border: 1px solid #ddd; border-radius: 20px; box-shadow: 4px 4px 10px 0 rgba(0,0,0,0.1);} .sub-ci02-wrap .sub-ci-cont .item:last-child img { width: 300px; } .sub-ci03-wrap {} .sub-ci03-wrap .sub-ci-cont > ul { width: 80%; margin: 0 auto;} .sub-ci03-wrap .item { display: flex; justify-content: space-between; align-items: flex-start;} .sub-ci03-wrap .item + .item { padding-top: 80px;} .sub-ci03-wrap .item > div { width: 80%; } .sub-ci03-wrap .item ul { display: flex; } .sub-ci03-wrap .item li { width: calc(100% / 3); padding: 30px 0;} .sub-ci03-wrap .item .txt { padding-top: 10px; font-size: 14px;} .sub-ci03-wrap .item .logo-list { border: 1px solid #ddd;} .sub-ci03-wrap .item .logo-list.gradient { background: linear-gradient( 90deg, #000000 15%, #A9ABAE 43%, #A7A9AC);} .sub-ci03-wrap .item .logo-list.bg li:nth-child(1) { background-color: #E50012;} .sub-ci03-wrap .item .logo-list.bg li:nth-child(2) { background-color: #9A7F53;} .sub-ci03-wrap .item .logo-list.bg li:nth-child(3) { background-color: #8F8F92;} .sub-ci04-wrap .sub-ci-cont { } .sub-ci04-wrap .sub-ci-cont ul { width: 80%; margin: 0 auto;} .sub-ci04-wrap .sub-ci-cont .item { display: flex; justify-content: space-between; align-items: flex-start;} .sub-ci04-wrap .sub-ci-cont .item + .item { padding-top: 40px;} .sub-ci04-wrap .sub-ci-cont .sub-ci-item-tit { width: 20%; text-align: left;} .sub-ci04-wrap .sub-ci-cont .item p { } .sub-ci04-wrap .sub-ci-item-cont { display: flex; justify-content: center; align-items: center; width: 70%; height: 150px; background-color: #fff; border: 1px solid #ddd; border-radius: 20px; box-shadow: 4px 4px 10px 0 rgba(0,0,0,0.1);} .sub-ci04-wrap .sub-ci-item-cont img { min-width: 300px;} .sub-ci05-wrap { } .sub-ci05-wrap .sub-ci-cont { } .sub-ci05-wrap .sub-ci-cont ul { display: flex; } .sub-ci05-wrap .sub-ci-cont .item + .item { padding-left: 10px;} .sub-ci05-wrap .sub-ci-cont .item a { display: block; width: 350px; height: 50px; line-height: 50px; padding: 0 15px; background: url(/images/common/ico-download-light.svg) calc(100% - 15px) 50% no-repeat; color: #fff; font-size: 0.9rem; font-weight: bold; text-align: left;} .sub-ci05-wrap .sub-ci-cont .item:nth-child(1) a { background-color: var(--primary-color);} .sub-ci05-wrap .sub-ci-cont .item:nth-child(2) a { background-color: #666;} /* 오시는 길 */ .sub-location-tab { padding-top: 80px;} .sub-location-tab ul { display: flex;} .sub-location-tab .item { width: calc(100% / 7);} .sub-location-tab .item button { width: 100%; height: 60px; font-size: 1rem; border: 1px solid #ddd; border-bottom-color: var(--primary-color); border-right: 0;} .sub-location-tab .item:last-child button { border-right: 1px solid #ddd;} .sub-location-tab .item.active button { color: var(--primary-color); font-weight: bold; border: 1px solid var(--primary-color); border-bottom-color: transparent;} .sub-location-tab .item.active + .item button { border-left: 0;} .sub-location-bx { padding-top: 40px;} .sub-location-bx .item { height: 0; visibility: hidden;} .sub-location-bx .item .sub-location-cont + .sub-location-cont { padding-top: 80px; } .sub-location-cont ul { margin-top: 20px;} .sub-location-cont li { display: flex;align-items: center;margin-bottom: 20px;justify-content: space-between;} .sub-location-cont li + li { margin-top: 15px;} .sub-location-cont h5 { color: #000; padding-right: 20px;} .sub-location-cont .txt { font-size: 0.9rem;} .sub-location-cont .txt::before {content: '';display: inline-block;width: 4px;height: 4px;margin: -4px 10px 0 0;background-color: #000;border-radius: 50%;vertical-align: middle;} .sub-location-cont .btn-directions { display:inline-block;margin-left:10px;padding:6px 10px;border:1px solid #ddd; font-weight: 500;} .sub-location-cont .btn-directions .ico_map {vertical-align: middle; margin: -4px 10px 0 0;} .sub-location-bx .sub-location-cont04 { padding-top: 20px;} .sub-location-cont .subway_badge { display: inline-block; width: 20px; height: 20px; line-height: 20px; margin: 0 2px; color: #fff; border-radius: 50%; font-size: 18px; text-align: center; letter-spacing: 0;} .sub-location-cont .subway_1 { background-color: #0052A4; } .sub-location-cont .subway_2 { background-color: #00A84D; } .sub-location-cont .subway_3 { background-color: #EF7C1C; } .sub-location-cont .subway_4 { background-color: #00A5DE; } .sub-location-cont .bus_badge { display: inline-block; width: 30px; height: 20px; line-height: 20px; margin: 0 5px; color: #fff; border-radius: 3px; font-size: 12px; font-weight: 400; text-align: center; letter-spacing: 0; vertical-align: text-bottom;} .sub-location-cont .bus_blue { background-color: #3D5BAB; } .sub-location-cont .bus_green { background-color: #47AF1B; } .sub-location-cont .bus_red { background-color: #DF121A; } .sub-location-cont01 { padding-top: 40px;} .sub-location-bx .board-contents th + th { border-left: 1px solid #e5e5e5; } .sub-location-bx .board-contents td + td { border-left: 1px solid #e5e5e5; } .sub-location-bx{margin:20px 0 0;font-size:16px;} .tbl-noblock{table-layout:fixed;border-top:1px solid #000;border-bottom:1px solid #000;text-align:center;white-space:nowrap;} .tbl-noblock thead th{padding:20px 10px;color:#333;font-weight:500;background:#f5f5f5;} .tbl-noblock tbody td{padding:20px 10px;color:#666;border-top:1px solid #e5e5e5;} .bottom-common-bx > .inner { width:1300px;max-width:calc(100% - 40px);margin: 40px auto; padding: 0; border: 1px solid #d5d5d5;} .responsibility-bx { display: flex; height: 50px; line-height: 50px; font-size: 0.7rem;} .responsibility-bx .tit { width: 180px; background-color: var(--primary-color); color: #fff; text-align: center;} .responsibility-bx .info { padding: 0 20px; color: #666;} .evaluation-bx { text-align: center;} .evaluation-bx p { padding: 15px 20px; background-color: #F6F6F6; font-size: 0.7rem; text-align: left;} .evaluation-bx > div { width: 80%; margin: 20px auto;} .evaluation-bx ul { display: flex; margin: 0 -30px;} .evaluation-bx .item { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 20%; padding: 0 30px; text-align: center;} .evaluation-bx .item label { margin-top: 5px; padding-left: 18px; font-size: 0.9rem;} .evaluation-bx .item label::before { top: 4px; width: 14px; height: 14px;} .evaluation-bx .item input[type="radio"]:checked + label:after { top: 8px; width: 8px; height: 8px;} .evaluation-bx button { width: 140px; height: 35px; margin: 20px auto 0; background-color: #686868; color: #fff; border-radius: 4px; font-weight: bold;} .evaluation-bx button .ir { width: 19px; height: 11px; margin-right: 2px; background: url(../../images/common/ico-comment.png) 50% no-repeat;} /* 경영혁신 전략 */ .txt-goal.txt-goal-01 dd{width: calc(100% - 120px); margin-left: 40px;} .txt-goal.txt-goal-01 dd::before{width:30px;left: -50px;} .sub-vision01-02-list h4 { min-width: 110px; color: #000; font-size: 20px;} .sub-vision01-02-list ul { position: relative; display: flex; justify-content: space-between; width: calc(100% - 120px); margin-left: 40px; } .sub-vision01-02-list ul::before { content: ''; position: absolute; top: 50%; left: -50px; transform: translateY(-50%); width:30px; height: 1px; background-image: linear-gradient(90deg, #666, #666 75%, transparent 75%, transparent 100%); background-size: 4px 1px;} .sub-vision01-02-wrap .sub-vision-way-list { display: flex; align-items: center; padding: 20px 0;} .sub-vision01-02-wrap .sub-vision-way-item { width: calc(25% - 10px); height: 70px; padding:5px;color: #000; font-size: 0.9rem; text-align: center; border: 1px solid #000;} .sub-vision01-02-wrap .sub-vision-project-list { display: flex; align-items: center;} .sub-vision01-02-wrap .sub-vision-project-item { width: calc(25% - 10px); border: 1px solid #ddd;} .sub-vision01-02-wrap .sub-vision-project-item ol { padding: 0 10px;} .sub-vision01-02-wrap .sub-vision-project-item ol li { display: flex; align-items: flex-start; padding: 20px 0; font-size: 0.8rem; border-bottom: 1px dashed #ddd;} .sub-vision01-02-wrap .sub-vision-project-item ol li:last-child { border-bottom: 0;} .sub-vision01-02-wrap .sub-vision-project-item .num { display: inline-block; padding-right: 5px; color: var(--primary-color); } .sub-vision01-03-tab { padding-bottom: 60px;} .sub-vision01-03-tab ul { display: flex;} .sub-vision01-03-tab li { width: 25%;} .sub-vision01-03-tab li button { width: 100%; height: 60px; color: #121212; background-color: #f5f5f5; font-size: 0.9rem; font-weight: 300; border-left: 1px solid #ddd;} .sub-vision01-03-tab li:first-child button { border-left: 0;} .sub-vision01-03-tab li.active button { color: var(--primary-color); background-color: #fff; font-weight: bold; border: 1px solid; box-shadow: 0 4px 4px rgba(0,0,0,0.2);} .sub-vision01-03-tab li.active + li > button{ border-left: 0;} .sub-vision01-03-cont { display: none;} .sub-vision01-03-cont h4 { color: var(--primary-color); font-size: 1.2rem;} .sub-vision01-03-list { padding-top: 40px; ;} .sub-vision01-03-item { padding-bottom: 30px; border-top: 2px solid #FF6501} .sub-vision01-03-item .sub-vision-item-top { padding: 30px 35px;} .sub-vision01-03-item .sub-vision-item-top strong { color: #000; font-size: 1rem;} .sub-vision01-03-item .sub-vision-item-top strong .num { padding-right: 5px; color: var(--primary-color); } .sub-vision01-03-item .sub-vision-item-top p { padding-top: 5px; padding-left: 22px; color: #666; font-size: 0.8rem;} .sub-vision01-03-item .sub-vision-item-cont {} .sub-vision01-03-item .sub-vision-item-cont ul { border-top: 2px solid #ddd;} .sub-vision01-03-item .sub-vision-item-cont li { display: flex; border-bottom: 1px solid #ddd;} .sub-vision01-03-item .sub-vision-item-cont .tit { display: flex; justify-content: center; align-items: center; width: 300px; padding: 20px 0; background-color: #f2f2f2; text-align: center;} .sub-vision01-03-item .sub-vision-item-cont .tit em { color: #000; font-size: 0.9rem; font-weight: bold;} .sub-vision01-03-item .sub-vision-item-cont .txt { display: flex; flex-direction: column; justify-content: center; width: calc(100% - 300px); padding: 20px 40px; } .sub-vision01-03-item .sub-vision-item-cont p { position: relative; padding-left: 18px; font-size: 0.9rem; font-weight: 400;} .sub-vision01-03-item .sub-vision-item-cont p::before { content: ''; position: absolute; top: 7px; left: 0; width: 0px; height: 0px; border-bottom: calc( 6px * 1.732 ) solid #FF6501; border-left: 6px solid transparent; border-right: 6px solid transparent; transform: rotate(90deg);} .sub-vision01-03-item .sub-vision-item-cont p + p {margin-top: 3px;} .sub-vision01-03-item .sub-vision-item-cont li.quarter .tit { width: 25%;} .sub-vision01-03-item .sub-vision-item-cont li.quarter .tit + .tit { border-left: 1px solid #ddd;} /* 신고 · 제보센터 */ .sub-report-top-bx { display: flex; padding: 50px; border: 4px solid #ddd;} .report-top-cover { width: 30%; text-align: center;} .report-top-txt { width: 70%;} .report-top-txt p { padding-top: 20px; font-size: 0.9rem;} .report-top-btn { margin-top: 20px;} .report-top-btn ul { display: flex; justify-content: space-between;} .report-top-btn .item { width: calc((100% / 3) - 5px); } .report-top-btn .item a { display: block; height: 50px; line-height: 50px; padding: 0 20px; background: url(../../images/common/btn-arrow.png) calc(100% - 20px) 50% no-repeat; color: #fff; font-size: 14px; border-radius: 99px;} .report-top-btn .item:nth-child(1) a { background-color: #E50012;} .report-top-btn .item:nth-child(2) a { background-color: #EA7D4E;} .report-top-btn .item:nth-child(3) a { background-color: #E50012;} .sub-report02-btn-bx { display: flex; justify-content: center; margin-top: 50px;} .sub-report02-btn-bx a { display: block; width: 350px; height: 55px; line-height: 55px; margin: 0 5px; padding: 0 30px; color: #fff; background: url(../../images/common/btn-arrow.png) calc(100% - 30px) 50% no-repeat; font-size: 0.9rem; border-radius: 5px; } .sub-report02-btn-bx .receipt-btn { background-color: var(--primary-color);} .sub-report02-btn-bx .check-btn { background-color: #666;} .sub-report02-bx { padding-bottom: 70px; border-bottom: 1px solid #ddd;} .sub-report02-bx > div { margin: 0 auto;} .sub-report02-bx ul { display: flex; margin: 0 -30px;justify-content: center;} .sub-report02-bx .item { width: calc(100% / 3); max-width:303px; padding: 0 30px;} .sub-report02-bx .item:first-child:nth-last-child(2), .sub-report02-bx .item:first-child:nth-last-child(2) ~ .item {width: calc(100% / 2);} .sub-report02-bx .item:first-child:nth-last-child(3), .sub-report02-bx .item:first-child:nth-last-child(3) ~ .item {width: calc(100% / 3);} .sub-report02-bx .item:first-child:nth-last-child(4), .sub-report02-bx .item:first-child:nth-last-child(4) ~ .item {width: calc(100% / 4);} .sub-report02-bx .item > div { position: relative; aspect-ratio: 1/1; background-color: #f5f5f5; border-radius: 50%;} .sub-report02-bx .item .num { position: absolute; top: 0; left: 20px; width: 50px; height: 50px; line-height: 50px; background-color: var(--primary-color); color: #fff; font-size: 0.9rem; font-weight: bold; text-align: center; border-radius: 50%;} .sub-report02-bx .item .cont { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100%;} .sub-report02-bx .item .ir { width: 105px; height: 100px;} .sub-report02-bx .item:nth-child(1) .ir { background: url(../../images/contents/ico-report02-01.png) 50% no-repeat;} .sub-report02-bx .item:nth-child(2) .ir { background: url(../../images/contents/ico-report02-02.png) 50% no-repeat;} .sub-report02-bx .item:nth-child(3) .ir { background: url(../../images/contents/ico-report02-03.png) 50% no-repeat;} .sub-report02-bx.sub-report02-bx-dv4 .item:nth-child(3) .ir { background: url(../../images/contents/ico-report02-04.png) 50% no-repeat;} .sub-report02-bx.sub-report02-bx-dv4 .item:nth-child(4) .ir { background: url(../../images/contents/ico-report02-03.png) 50% no-repeat;} .sub-report02-bx .item .txt { padding-top: 20px; font-weight: 500; text-align: center; line-height:1.4;} .bx-bottom-border .con-list01 , .bx-bottom-border .shortcut-link-txt {margin-left:25px;} .sub-report02-wrap .bx-bottom-border{padding-bottom:50px;} .sub-report02-wrap .bx-bottom-border + .bx-bottom-border{padding-top:50px;} .notify-figure-img{padding:40px;text-align:center;border:1px solid #ddd;} .process-figure-img{padding:40px;text-align:center;border:1px solid #ddd;background:#fafafa;} .sub-report05-bx{min-height:50px;text-align:center;border:1px solid #ddd;background: #fafafa;} .sub-report05-bx p{color:#666;font-family: var(--font-s-core);} .sub-report05-bx::before {bottom: -100px;width: 300px;height: 300px;} .sub-report05-01-bx::before {display:none;} .sub-report02-tab { } .sub-report02-tab ul { display: flex; } .sub-report02-tab .item { width: calc(100% / 3); } .sub-report02-tab .item.active { } .sub-report02-tab .item a { display: block; height: 60px; line-height: 60px; color: #121212; background-color: #f5f5f5; text-align: center;} .sub-report02-tab .item.active a {position: relative; color: var(--primary-color); font-weight: bold;background-color: #fff; } .sub-report02-tab .item.active a:before{content:'';position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid var(--primary-color);} @media screen and (max-width: 1024px) { /* 1024px 이하 */ /* 역대 기관장 */ .sub-generation-bx { padding-top: 40px;} .sub-generation-bx ul { margin: 0 -5px;} .sub-generation-bx .item { padding: 0 5px 10px;} .sub-generation-bx .item > div { padding: 10px;} } @media screen and (max-width: 800px) { /* 역대 기관장 */ .sub-generation-bx .item { width: 50%;} }