/*common*/ #container .bg {width: 100%; height: 400px; box-sizing: border-box; padding-top: 135px; position: relative} #container .bg .tit {font-size: 50px; font-weight: 600; width: 100%; text-align: center; color: #fff; min-width: 1280px} #container .navi {width: 100%; height: 50px; background: rgba(0,0,0,0.5); position: absolute; left: 0; bottom: 0px; z-index: 1} #container .navi ul {zoom : 1; border-left: 1px solid rgba(255,255,255,0.2); } #container .navi ul:after {clear: both; content: ''; display: block} #container .navi ul>li {float: left; border-right: 1px solid rgba(255,255,255,0.2);} #container .navi .home {width: 50px; height: 50px; } #container .navi .home>a {display: inline-block; width: 100%; height: 100%; background-position: -146px -206px} #container .navi ul .menu {width: 250px; height: 100%; position: relative; float: left} #container .navi .menu:after {width: 10px; height: 7px; position: absolute; right: 30px; top: 21px; display: inline-block; content: ''; background: url(/img/w_arrow.png) no-repeat } #container .navi ul .menu.active:after {background: url(/img/w_arrow_up.png) no-repeat} #container .navi .menu>a {font-size: 16px; display: inline-block; line-height: 50px; padding-left: 30px; color: #fff; width: 100%; height: 100%; cursor: pointer} #container .navi .menu>a:hover, #container .navi .menu>a:focus, #container .navi .menu>a:active {text-decoration: none} #container .navi .menu-list {position: absolute; top: 50px; left: 0; background-color: #3b414b; padding: 20px 30px; width: 100%; box-sizing: border-box; display: none} #container .navi .menu-list>li {margin-bottom: 13px; float: none; border-right: none} #container .navi .menu-list>li>a {font-size: 16px; color: #fff; display: inline-block; width: auto; padding-bottom: 4px; box-sizing: border-box; height: 28px} #container .navi .menu-list>li>a:hover, #container .navi .menu-list>li>a:active, #container .navi .menu-list>li>a:focus, #container .navi .menu-list>li.active>a {font-weight: 600; text-decoration: none; border-bottom: 1px solid #007dc4} #container .navi .menu-list>li>a:last-child {margin-bottom: 0} #container section {padding-top: 99px; position: relative} #container .tit {font-size: 36px; font-weight: 600; width: 100%; text-align: center; letter-spacing: -2px; margin-bottom: 50px; } #container section>.tit {min-width: 1280px} .tabs.tab02>li{width: 50%} .tabs.tab03>li{width: 399px} .tabs.tab04>li{width: 25%} @keyframes fadeIn{ 0% {opacity: 0} 100% {opacity: 1} } @keyframes fadeOut{ 0% {opacity: 1} 100% {opacity: 0} } .tab_area [id^="tab_content"] {display: none; position: relative; } .tab_area [id^="tab_content"].active {display: block} /*-------------------회사정보-----------------*/ /*회사 소개*/ #container .comp .name {font-size: 40px; font-weight: 300; position: relative; width: 365px; line-height: 1; height: 42px; margin: 63px auto 0; text-align: center} #container .comp .name:before {content: ''; display: inline-block; position: absolute; left: 0; top: 5px; width: 35px; height: 29px; background: url(/img/lt.png) no-repeat;} #container .comp .name:after {content: ''; display: inline-block; position: absolute; right: 0; top: 5px; width: 35px; height: 29px; background: url(/img/gt.png) no-repeat;} #container .comp .c_exp {width: 100%; text-align: center; margin-top: 31px; font-size: 18px} #container .comp .wrap_box {margin-top: 47px; margin-bottom: 97px} #container .comp .wrap_box p {width: 100%; text-align: center} #container .comp .center {width: 100%; height: 430px; background: url(/img/b_Img.jpg) no-repeat 50% top; box-sizing: border-box; padding-top: 86px} #container .comp .center .name {color: #fff; width: 805px; height: 120px; line-height: 1.5; margin-top: 0; font-weight: 500; letter-spacing: -2px} #container .comp .center .name:before {background: url(/img/w_lt.png) no-repeat; top: 13px} #container .comp .center .name:after {background: url(/img/w_gt.png) no-repeat; top: 13px} #container .comp .center .exp {font-size: 19px; color: #fff; width: 100%; text-align: center; margin-top: 25px; font-weight: 300; letter-spacing: -0.5px} #container .comp .center + article {padding: 90px 0 150px;} #container .comp .secTit {margin-bottom: 40px} #container .comp .wrap_link {width: 100%; zoom : 1;} #container .comp .wrap_link:after {content: ''; display: block; clear: both} #container .comp .wrap_link>a {width: 33%; height: 300px; float: left; cursor: pointer; box-sizing: border-box; padding-top: 80px} #container .comp .wrap_link>a:hover, #container .comp .wrap_link:active, #container .comp .wrap_link:focus {text-decoration: none} #container .comp .wrap_link>a>p {width: 100%; text-align: center; color: #fff} #container .comp .wrap_link>a .tit {font-size: 26px; font-weight: 500;} #container .comp .wrap_link>a .eng {font-size: 20px; font-family: "Lato"; margin-top: 12px} #container .comp .wrap_link .l01 {background: url(/img/link01.png) no-repeat 50% top} #container .comp .wrap_link .l02 {background: url(/img/link02.png) no-repeat 50% top} #container .comp .wrap_link .l03 {background: url(/img/link03.png) no-repeat 50% top} #container .comp .wrap_link .l04 {background: url(/img/link04.png) no-repeat 50% top} #container .comp .wrap_link .l05 {background: url(/img/link03.png) no-repeat 50% top} #container .comp .wrap_link .l06 {background: url(/img/link06.png) no-repeat 80% top} /*CEO 인사말*/ #container .comp .layout {zoom : 1} #container .comp .layout:after {clear: both; content: ''; display: block} #container .comp .intro {font-size: 36px; font-weight: 300; line-height: 1.5; margin-top: 104px; float: right; width: 650px; margin-bottom: 58px; letter-spacing: -2px; margin-left: 50%; transform: translateX(-40%);} #container .comp .ceoImg {width: 776px; height: 740px; background: url(/img/ceo.png) no-repeat; position: absolute; top: 117px; left: -13px; display: none;} #container .comp .intro>span {font-weight: 600} #container .comp .intro .fs_50 {font-size: 50px; font-weight: normal} #container .comp .bottom.half {height: 540px; padding-top: 45px} #container .comp .bottom .c_txt {font-size: 16px; float: right; width: 650px; margin-left: 50%; transform: translateX(-40%);} #container .comp .bottom .c_txt>p {margin-bottom: 10px; line-height: 1.65} #container .comp .bottom .c_txt .c_txt_last{font-weight: 500;} /*19.07.15 추가*/ #container .comp .bottom .c_txt>p>span {word-break: keep-all} /*연혁*/ #container .tabs {width: 100%; height: 50px; zoom : 1; box-sizing: border-box; margin-top: 46px} #container .tabs:after {clear: both; content: ''; display: block} #container .tabs>li {height: 50px; float: left; border-right: 1px solid #3c414b; box-sizing: border-box; border-top: 1px solid #3c414b; border-bottom: 1px solid #3c414b;} #container .tabs>li:first-child {border-left: 1px solid #3c414b} #container .tabs>li>a {display: inline-block; width: 100%; height: 100%; font-size: 18px; color: #3b414b; text-align: center; line-height: 50px; cursor: pointer; letter-spacing: 0.2px} #container .tabs>li.active {background-color: #3b414b} #container .tabs>li.active>a {font-weight: 600; color: #fff} #container .tabs>li>a:hover, #container .tabs>li>a:active, #container .tabs>li>a:focus {text-decoration: none; } #container .tab_area {margin-top: 92px; width: 100%; position: relative} #container .comp .tab_area {padding-bottom: 150px} #container .tab_area .line {width: 100%; zoom : 1; margin-bottom: 69px} #container .tab_area #tab_content1 .line:first-child {margin-bottom: 50px} #container .tab_area .line:first-child .year:after {top: 23px} #container .tab_area .line:first-child .cont {padding-top: 14px} #container .tab_area .line:after {clear: both; content: ''; display: block} #container .tab_area .year {float: left; font-size: 60px; color: #007dc4; font-family: "Lato"; width: 191px; position: relative; font-weight: 900; padding-left: 77px; line-height: 1} #container .tab_area .year:after {display: inline-block; content: ''; width: 13px; height: 13px; background: url(/img/point.png) no-repeat; position: absolute; top: 26px; right: 2px; background-color: #fff; z-index: 1} #container .tab_area .cont {float: left; margin-left: 44px; padding-top: 17px} #container .tab_area .cont .list {position: relative; font-size: 18px; padding-left: 45px; margin-top: 2px;} #container .tab_area .cont p.list {line-height: 1.8} #container .tab_area .cont .list .month {position: absolute; left: 0; font-weight: 600} #container .tab_area .cont ul>li {margin-bottom: 13px} #container .tab_area .cont ul>li:last-child {margin-bottom: 0} #container .tab_area .cont ul>li.br {line-height: 1.65} #container .tab_area .cont .award {width: 900px; height: 50px; background-color: #f4f4f4; box-sizing: border-box; padding-left: 17px; line-height: 50px; font-size: 18px; font-weight: 500; margin-bottom: 10px; letter-spacing: -0.3px; margin-left: -14px} #container .tab_area .line .cont .list + .award, #container .tab_area .line .cont>ul + .award {margin-top: 29px} #container .tab_area .line .cont .list.line-2 + .award {margin-top: 20px} #container .tab_area .line .cont>ul.br + .award {margin-top: 23px} #container .tab_area .cont .award:last-child {margin-bottom: 0} #container .tab_area .cont .award .icon {width: 25px; height: 26px; background-position: 0 -452px; margin: 11px 14px 0 0;} #container .tab_area .cont .award .ad {font-weight: 300; font-size: 16px; margin-left: 10px; letter-spacing: -0.7px} #container .tab_area .v-line {width: 1px; height: 2000px; background-color: #007dc4; position: absolute; top: 36px; left: 259px} #container .tab_area #tab_content3 .v-line {height: 3000px} /*비전*/ #container .comp .v_box {width: 100%; height: 80px; box-sizing: border-box; border: 4px solid #007dc4; text-align: center; line-height: 72px; font-size: 20px; margin-bottom: 94px; margin-top: 28px} #container .comp .v_img {width: 1548px; height: 234px; margin: 30px auto 0; background: url(/img/vision.png) no-repeat; position: relative; margin-bottom: 150px} /*환경경영*/ #container .comp .e_img {height: 890px; display: block; margin: 90px auto 0; background: url(/img/enviroment.jpg) no-repeat 50% top; display: none;} #container .comp .e_img.pc_hide {display: none} #container .comp .e_bottom {height: auto; padding: 90px 0 150px; background-color: #f4f4f4} #container .comp .e_box {width: 100%; height: auto; box-sizing: border-box; background-color: #fff; font-size: 22px; padding: 21px 110px 23px; text-align: center; word-break: keep-all; letter-spacing: -0.5px; margin-top: -7px} #container .comp .e_box>span {font-weight: 600} #container .comp .e_box:last-child {padding: 27px 60px 25px} #container .comp .e_list {margin: 37px 0 46px 106px;} #container .comp .e_list>li {font-size: 18px; margin-bottom: 13px; position: relative; padding-left: 39px; box-sizing: border-box} #container .comp .e_list>li:last-child {margin-bottom: 0} #container .comp .e_list>li .num {display: inline-block; width: 24px; height: 24px; border: 1px solid #007dc4; border-radius: 50%; text-align: center; vertical-align: bottom; font-family: "Lato","맑은 고딕"; font-weight: 600; color: #007dc4; box-sizing: border-box; padding-right: 2px; line-height: 22px; position: absolute; left: 0; top: 3px} /*오시는 길*/ #container .bg.comp {background: url(/img/company.jpg) no-repeat 50% top} #container .map {width: 100%; height: 500px; background: url(/img/map.png) no-repeat; z-index: 0; box-sizing: border-box} #daumRoughmapContainer1561360072520 {margin-top: 48px} #container .comp .bottom {height: 515px; background-color: #f4f4f4; box-sizing: border-box; } #container .comp .address {width: 1200px; height: 150px; box-sizing: border-box; padding-top: 30px; background-color: #fff; min-width: 1200px; z-index: 5; margin-top: -70px; margin-bottom: 40px} #container .comp .address .m_list {width: 760px; zoom : 1; margin: 0 auto} #container .comp .address .m_list:first-child {margin-bottom: 25px} #container .comp .address .m_list:after {clear: both; content: ''; display: block} #container .comp .address .m_list p {float: left; font-size: 18px} #container .comp .address .m_list .th {font-weight: 600; color: #007dc4; width: 89px; margin-right: 20px} #container .comp .address .m_list .th .icon1 {width: 31px; height: 33px; background-position: -157px -72px; margin-right: 10px} #container .comp .address .m_list .th .icon2 {width: 32px; height: 32px; background-position: -196px -72px; margin-right: 10px} #container .comp .address .m_list ul {float: left} #container .comp .address .m_list ul>li {position: relative; font-size: 18px; margin-right: 43px; display: inline-block; vertical-align: top} #container .comp .address .m_list ul>li>span {margin-right: 7px} #container .comp .address .m_list ul>li:first-child:after {position: absolute; width: 2px; height: 12px; right: -23px; top: 9px; display: inline-block; content: ''; background-color: #c7c7c7} #container .comp .bottom.infos div[class^='box'] {width: 373px; height: 250px; margin-right: 40px; float: left; background-color: #fff; position: relative;} #container .comp .bottom.infos div[class^='box']:last-child {margin-right: 0} #container .comp .bottom.infos div[class^='box'] .icon {display: block} #container .comp .bottom.infos .box01 .icon {width: 65px; height: 85px; background-position: 0 -271px; margin: 48px auto 0;} #container .comp .bottom.infos .box02 .icon {width: 80px; height: 72px; background-position: -72px -271px; margin: 54px auto 0;} #container .comp .bottom.infos .box03 .icon {width: 62px; height: 73px; background-position: -157px -271px; margin: 53px auto 0; } #container .comp .bottom.infos div[class^='box'] p {width: 100%; text-align: center; position: absolute; font-size: 18px;} #container .comp .bottom.infos div[class^='box'] .txt {width: 100%; text-align: center; position: absolute; font-size: 18px; font-weight: 600; color: #007dc4; bottom: 72px} #container .comp .bottom.infos div[class^='box'] .addr {bottom: 34px; font-family: "Lato","sans"; font-weight: 600; letter-spacing: -0.5px} /*------------------투자 정보-----------------*/ #container .bg.fund {background: url(/img/fund.jpg) no-repeat 50% top} #container .bg.fund {background: url(/img/fund.jpg) no-repeat 50% top} /*이사회 및 위원회*/ #container .fund .cate {margin-top: 59px} #container .cate>span {font-weight: 300} #container .fund .j_box {min-height: 420px; padding: 0 0 0 30px; height: auto;} #container .fund .j_box>.th {width: 150px; padding-top: 23px;} #container .fund .j_box>.th>p {font-size: 16px} #container .fund .j_box>.th>p>span {font-size: 20px; font-weight: 600; margin-right: 4px} #container .fund .j_box>.th .period {font-size: 14px; font-family: "Lato"; margin-top: 6px; letter-spacing: -0.1px} #container .fund .j_box .cont {width: 399px} #container .fund .j_box .cont .detail {height: auto !important; padding: 25px 0 21px 20px; box-sizing: border-box;} #container .fund .j_box .cont .detail:nth-child(2) {padding: 23px 0 23px 20px} #container .fund .j_box .cont .detail .th {width: 131px; margin-right: 0} #container .fund .j_box .cont .detail .txt {width: 230px;} #container .j_box .cont .detail.line-2 {padding: 21px 0 24px 20px } #container .j_box .cont .detail.line-2 .txt {line-height: 1.4} #container .fund .bottom {width: 100%; height: auto; padding: 90px 0 150px; background-color: #f4f4f4} #container .fund .bottom .layout {zoom : 1} #container .fund .bottom .layout:after {clear: both; content: ''; display: block} #container .fund .bottom .wrap_j {float: left; margin-right: 39px} #container .fund .bottom .wrap_j:last-child {margin-right: 0; margin-bottom: 50px} #container .fund .bottom .wrap_j .cate {margin-top: 0} #container .fund .bottom .j_box {background-color: #fff; margin-right: 0} #container .fund .bottom .wrap_j:last-child .j_box {margin-right: 0} #container .fund .bottom .j_box .cont .detail {border-bottom-color: #f4f4f4} #container .fund .outside {width: 100%; padding: 90px 0 150px} #container .fund .outside table:nth-of-type(1){padding-bottom: 100px;} #container .fund .caption {font-size: 26px; font-weight: 600; width: 100%; text-align: center; letter-spacing: -1.4px} #container .fund table {margin-top: 34px; width: 100%; border-top: 2px solid #000} #container .fund table td, #container .fund table th {height: 61px; box-sizing: border-box; border-bottom: 1px solid #c7c7c7} #container .fund table th {font-size: 18px; padding: 8px 0; } #container .fund table td {font-size: 16px; text-align: center; padding: 18px 0} #container .fund table td.date {font-size: 16px; color: #c7c7c7; font-weight: 500; letter-spacing: -0.5px} /*주주 총회*/ #container .fund table.stock th {height: 81px} #container .fund table.stock td {padding: 9px 0} #container .fund table.stock td.ta_l {padding-left: 20px} #container .fund table.stock td.ta_l.pl50 {padding-left: 50px} /*주식 공시정보*/ #container .fund .s_exp {width: 100%; text-align: center; font-size: 18px; } #container .fund .graph {width: 100%; height: 537px; margin-bottom: 50px; margin-top: 18px} #container .fund table#stockInfo {margin-bottom: 80px} #container .fund table#stockInfo th {position: relative; font-size: 16px; text-align: left; padding-left: 40px} #container .fund table#stockInfo th:after {position: absolute; width: 2px; height: 12px; background-color: #c7c7c7; content: ''; display: inline-block; top: 24px; right: 3px;} #container .fund table#stockInfo td {text-align: left; padding-left: 16px; word-break: keep-all} #container .fund table td .up {width: 28px; height: 16px; background: url(/img/up.png) no-repeat; overflow: hidden; line-height: 99999; display: inline-block; background-size: cover; margin-right: 5px} #container .fund table td .down {width: 28px; height: 16px; background: url(/img/down.png) no-repeat; overflow: hidden; line-height: 99999; background-size: cover; display: inline-block; background-size: cover; margin-right: 5px} #container .fund table td .bohab {width: 26px; height: 3px; background-color: #c7c7c7; display: inline-block; line-height: 9999; overflow: hidden} #container .fund ul.stock {margin-bottom: 40px; margin-top: 0} #container .fund ul.stock:after {clear: both; content: ''; display: block} #contianer .fund ul.stock>li>a {display: inline-block; width: 100%; height: 100%; font-size: 16px; color: #3b414b; text-align: center; line-height: 48px; cursor: pointer} #container .fund ul.stock>li.active>a {font-weight: 400} #container .fund .stock + .tab_area { margin-top: 0; margin-bottom: 100px} #container .fund table td.date {font-size: 12px} /*관련 규정*/ #container .fund .tab_area {margin-top: 102px} #container .fund .tabs.tab02>li {width: 33.3%} #container .fund .tab_area h3 {width: 100%; height: 50px; background-color: #f4f4f4; line-height: 50px; text-align: center; font-size: 18px; font-weight: 600} #container .fund .tab_area h4 {font-size: 16px; font-weight: 400; text-align: left; margin-bottom: 6px; color: #000} #container .fund .tab_area .border_box {border-bottom: 1px solid #c7c7c7; padding: 25px 39px 26px; font-size: 16px} #container .fund .tab_area .border_box>ul {margin-top: 17px} #container .fund .tab_area .border_box ul>li {margin-bottom: 5px} #container .fund .tab_area .border_box.bb0 {border-bottom: none} #container .fund .tab_area .border_box ul>li>ul {padding-left: 15px; margin-top: 10px; margin-bottom: 15px} /*재무 배당 정보*/ #container .fund .caption.first {margin-top: 58px; margin-bottom: 27px} #container .fund h4 {width: 100%; text-align: center; font-size: 18px; color: #007dc4; margin-bottom: 15px; font-weight: 600} #container .fund h4 + .m_overflow>table {margin-top: 13px; margin-bottom: 75px} #container .fund h4 + .m_overflow:last-child>table {margin-bottom: 100px} #container .fund h4 + .m_overflow>table th {font-size: 16px; height: auto} #container .fund h4 + .m_overflow>table th>span {font-weight: 400} #container .fund h4 + .m_overflow>table tr:first-child>th {border-right: 1px solid #c7c7c7; } #container .fund h4 + .m_overflow>table tr:last-child>th {position: relative; } #container .fund h4 + .m_overflow>table tr:last-child>th:after {position: absolute; content: ''; display: inline-block; background-color: #c7c7c7; width: 2px; height: 12px; top: 23px; right: -1px} #container .fund h4 + .m_overflow>table tr:last-child>th:nth-child(3n+3) {border-right: 1px solid #c7c7c7} #container .fund h4 + .m_overflow>table tr:last-child>th:nth-child(3n+3):after {display: none} #container .fund h4 + .m_overflow>table tr>th:last-child {border-right: none !important} #container .fund h4 + .m_overflow>table#cash_flow tr:last-child>th:nth-child(2n+2) {border-right: 1px solid #c7c7c7} #container .fund h4 + .m_overflow>table#cash_flow tr:last-child>th:nth-child(2n+2):after {display: none} #container .fund table#tradedPrice_day td.ta_l {padding-left: 44px} #container .fund table#tradedPrice_day td.ta_l>span {margin-right: 7px} #container .fund table#disInfo td.ta_l>a {font-weight: 600} /*------------------사업영역------------------*/ #container .bg.bis {background: url(/img/business.jpg) no-repeat 50% top} /*디지털 컨택센터*/ #container .bis .t_exp {font-size: 23px; width: 100%; text-align: center; margin-top: 37px; line-height: 1.7} #container .bis .secTit {margin-bottom: 0} #container .wrap_business {width: 100%; height: 640px; box-sizing: border-box; padding-top: 93px; margin-top: 92px; position: relative} #container .digital .wrap_business {background: url(/img/digital_01.png) 50% top} #container .wrap_business .secTit {color: #fff} #container .wrap_business .line {width: 100%; height: 1px; background-color: #fff; margin-top: 87px/*position: absolute; left: 40px; top: 125px*/} #container .wrap_business .m_slider {position: absolute; left: 40px; top: 77px} #container .wrap_business .m_slider>li {position: absolute; font-size: 16px; color: #fff; width: 350px; word-break: keep-all; letter-spacing: -0.8px} #container .wrap_business .m_slider>li>span {font-size: 18px; color: #fff; font-weight: 600; position: absolute; top: -111px; width: 100%; text-align: center; } #container .wrap_business .m_slider>li>span.long {top: -271px} #container .wrap_business .m_slider>li>span:after {width: 13px; height: 52px; background: url(/img/chain01.png) no-repeat; position: absolute; display: inline-block; content: ''; top: 43px; left: 50%; margin-left: -7px; z-index: 5} #container .wrap_business .m_slider>li>span.long:after {height: 213px; background: url(/img/chain02.png) no-repeat} #container .wrap_business .m_slider .s01 {left: 15px; top: 110px} #container .wrap_business .m_slider .s01>span {margin-left: -4px} #container .wrap_business .m_slider .s02 {left: 288px; top: 270px} #container .wrap_business .m_slider .s02>span {margin-left: -5px} #container .wrap_business .m_slider .s03 {left: 579px; top: 110px} #container .wrap_business .m_slider .s03>span {margin-left: -12px} #container .wrap_business .m_slider .s04 {left: 836px; top: 270px; width: 351px} #container .wrap_business .m_slider .s04>span {margin-left: 2px} #container .wrap_business .wrap_btn {display: none} #container .wrap_solution {width: 100%; height: 490px; background: url(/img/digi_02.jpg) no-repeat 50% top; position: relative} #container .wrap_solution .solution>div {width: 100%; height: 100%; box-sizing: border-box; padding-top: 76px; height: 490px} #container .wrap_solution .solution>div p {color: #fff; margin-left: 280px} #container .wrap_solution .solution>div .chapter {font-family: "Lato","serif"; font-size: 26px; letter-spacing: 0.4px; font-weight: 600;} #container .wrap_solution .solution>div .chapter>span {font-weight: 100} #container .wrap_solution .solution>div .tit {font-size: 40px; font-weight: 500; margin-top: 7px; text-align: left; letter-spacing: -2px;} #container .wrap_solution .solution>div .exp {font-size: 22px; margin-top: 31px; line-height: 1.45; font-weight: 500; width: 776px; word-break: keep-all; width: 852px; letter-spacing: -0.5px} #container .wrap_solution .indicator {width: 200px; height: 490px; background-color: rgba(0,0,0,0.3); box-sizing: border-box; padding-top: 36px; position: absolute; left: 40px; top: 0} #container .wrap_solution .indicator>a {display: none} #container .wrap_solution .indicator ul>li {width: 100%; height: 50px; line-height: 50px; padding-left: 40px; font-size: 16px; color: #fff; box-sizing: border-box; cursor: pointer} #container .wrap_solution .indicator ul>li.active, #container .wrap_solution .indicator>li:hover, #container .wrap_solution .indicator>li:focus, #container .wrap_solution .indicator>li:active {background-color: #fff; color: #007dc4; font-weight: 600} #container .wrap_solution .solution .slide-number {position: absolute; bottom: 77px; font-size: 20px; font-family: "Lato"; color: #fff; width: auto; margin-left: 280px; letter-spacing: 1.5px; font-weight: 200} #container .wrap_solution .solution .slide-number>span {font-weight: 700} /* 20240327 S */ #container .solution .wrap_solution{background: url(/img/digi_03.jpg) no-repeat 50% top;} .eng #container .wrap_good{padding: 90px 0 50px;} #container .solution .wrap_good img{margin: 40px auto;} /* 20240327 E */ #container .wrap_good {width: 100%; height: 683px; box-sizing: border-box; background-color: #f4f4f4; padding-top: 90px} #container .wrap_good .wrap_box {margin-top: 33px} #container .wrap_good div[class^="box0"] {width: 579px; height: 190px; box-sizing: border-box; background-color: #fff; padding: 35px 45px 39px 133px; margin-right: 40px; margin-bottom: 40px; position: relative; display: inline-block} #container .wrap_good div[class^="box0"]:nth-child(2n+2) {margin-right: 0} #container .wrap_good div[class^="box0"] .icon {position: absolute} #container .wrap_good .box01 .icon {width: 57px; height: 67px; background-position: -469px 0; top: 60px; left: 36px} #container .wrap_good .box02 .icon {width: 66px; height: 67px; background-position: -469px -72px; top: 59px; left: 33px} #container .wrap_good .box03 .icon {width: 71px; height: 64px; background-position: -469px -144px; top: 61px; left: 32px} #container .wrap_good .box04 .icon {width: 70px; height: 67px; background-position: -469px -213px; top: 60px; left: 31px} #container .wrap_good .wrap_box div[class^='box']>p {font-style: normal; position: relative; bottom: auto; font-family: "Noto Sans Korean"; word-break: keep-all;} #container .wrap_good .wrap_box .g_tit {font-size: 18px; font-weight: 600; color: #007dc4; margin-bottom: 10px} #container .wrap_good .wrap_box .g_exp {font-size: 16px; font-weight: normal} #container .wrap_aco {padding: 94px 0 150px} #container .wrap_aco .accodian {margin-top: 55px} #container .wrap_aco .accodian .acc_btn {display: none} #container .wrap_aco .accodian .acc_cont div[class*='r'] {width: 185px; height: 55px; margin-right: 63px; display: inline-block; vertical-align: top; margin-bottom: 54px} #container .wrap_aco .accodian .acc_cont div[class*='r']:nth-child(5n+5) {margin-right: 0} #container .wrap_aco .accodian .acc_cont div[class*='r']:last-child {margin-right: 0} #container .wrap_aco .accodian .r01 {background: url(/img/digital/01.jpg) no-repeat} #container .wrap_aco .accodian .r02 {background: url(/img/digital/02.jpg) no-repeat} #container .wrap_aco .accodian .r03 {background: url(/img/digital/03.jpg) no-repeat} #container .wrap_aco .accodian .r04 {background: url(/img/digital/04.jpg) no-repeat} #container .wrap_aco .accodian .r05 {background: url(/img/digital/05.jpg) no-repeat} #container .wrap_aco .accodian .r06 {background: url(/img/digital/06.jpg) no-repeat} #container .wrap_aco .accodian .r07 {background: url(/img/digital/07.jpg) no-repeat} #container .wrap_aco .accodian .r08 {background: url(/img/digital/08.jpg) no-repeat} #container .wrap_aco .accodian .r09 {background: url(/img/digital/09.jpg) no-repeat} #container .wrap_aco .accodian .r10 {background: url(/img/digital/010.jpg) no-repeat} #container .wrap_aco .accodian .r11 {background: url(/img/digital/011.jpg) no-repeat} #container .wrap_aco .accodian .r12 {background: url(/img/digital/012.jpg) no-repeat} #container .wrap_aco .accodian .r13 {background: url(/img/digital/013.jpg) no-repeat} #container .wrap_aco .accodian .r14 {background: url(/img/digital/014.jpg) no-repeat} #container .wrap_aco .accodian .r15 {background: url(/img/digital/015.jpg) no-repeat} #container .wrap_aco .accodian .r16 {background: url(/img/digital/016.jpg) no-repeat} #container .wrap_aco .accodian .r17 {background: url(/img/digital/017.jpg) no-repeat} #container .wrap_aco .accodian .r18 {background: url(/img/digital/018.jpg) no-repeat} #container .wrap_aco .accodian .r19 {background: url(/img/digital/019.jpg) no-repeat} #container .wrap_aco .accodian .r20 {background: url(/img/digital/020.jpg) no-repeat} #container .wrap_aco .accodian .r21 {background: url(/img/digital/021.jpg) no-repeat} #container .wrap_aco .accodian .r22 {background: url(/img/digital/022.jpg) no-repeat} #container .wrap_aco .accodian .r23 {background: url(/img/digital/023.jpg) no-repeat} #container .wrap_aco .accodian .r24 {background: url(/img/digital/024.jpg) no-repeat} #container .wrap_aco .accodian .r25 {background: url(/img/digital/025.jpg) no-repeat} #container .wrap_aco .accodian .r26 {background: url(/img/digital/026.jpg) no-repeat} #container .wrap_aco .accodian .r27 {background: url(/img/digital/027.jpg) no-repeat} #container .wrap_aco .accodian .r28 {background: url(/img/digital/028.jpg) no-repeat} #container .wrap_aco .accodian .r29 {background: url(/img/digital/029.jpg) no-repeat} #container .wrap_aco .accodian .r30 {background: url(/img/digital/030.jpg) no-repeat} #container .wrap_aco .accodian .r31 {background: url(/img/digital/031.jpg) no-repeat} #container .wrap_aco .accodian .r32 {background: url(/img/digital/032.jpg) no-repeat} #container .wrap_aco .accodian .r33 {background: url(/img/digital/033.jpg) no-repeat} #container .wrap_aco .accodian .r34 {background: url(/img/digital/034.jpg) no-repeat} #container .wrap_aco .accodian .r35 {background: url(/img/digital/035.jpg) no-repeat} #container .wrap_aco .accodian .r36 {background: url(/img/digital/036.jpg) no-repeat} #container .wrap_aco .accodian .r37 {background: url(/img/digital/037.jpg) no-repeat} #container .wrap_aco .accodian .r38 {background: url(/img/digital/038.jpg) no-repeat} #container .wrap_aco .accodian .r39 {background: url(/img/digital/039.jpg) no-repeat} #container .wrap_aco .accodian .r40 {background: url(/img/digital/040.jpg) no-repeat} #container .wrap_aco .accodian .r41 {background: url(/img/digital/041.jpg) no-repeat} #container .wrap_aco .accodian .r42 {background: url(/img/digital/042.jpg) no-repeat} #container .wrap_aco .accodian .r43 {background: url(/img/digital/043.jpg) no-repeat} #container .wrap_aco .accodian .r44 {background: url(/img/digital/044.jpg) no-repeat} #container .wrap_aco .accodian .r45 {background: url(/img/digital/045.jpg) no-repeat} #container .wrap_aco .accodian .r46 {background: url(/img/digital/046.jpg) no-repeat} #container .wrap_aco .accodian .r47 {background: url(/img/digital/047.jpg) no-repeat} #container .wrap_aco .accodian .r48 {background: url(/img/digital/048.jpg) no-repeat} #container .wrap_aco .accodian .r49 {background: url(/img/digital/049.jpg) no-repeat} #container .wrap_aco .accodian .r50 {background: url(/img/digital/050.jpg) no-repeat} #container .wrap_aco .accodian .r51 {background: url(/img/digital/051.jpg) no-repeat} #container .wrap_aco .accodian .r52 {background: url(/img/digital/052.jpg) no-repeat} #container .wrap_aco .accodian .r53 {background: url(/img/digital/053.jpg) no-repeat} #container .wrap_aco .accodian .r54 {background: url(/img/digital/054.jpg) no-repeat} #container .wrap_aco .accodian .r55 {background: url(/img/digital/055.jpg) no-repeat} #container .wrap_aco .accodian .r56 {background: url(/img/digital/056.jpg) no-repeat} #container .wrap_aco .accodian .r57 {background: url(/img/digital/057.jpg) no-repeat} #container .wrap_aco .accodian .r58 {background: url(/img/digital/058.jpg) no-repeat} #container .wrap_aco .accodian .r59 {background: url(/img/digital/059.jpg) no-repeat} #container .wrap_aco .accodian .r60 {background: url(/img/digital/060.jpg) no-repeat} #container .wrap_aco .accodian .r61 {background: url(/img/digital/061.jpg) no-repeat} #container .wrap_aco .accodian .r62 {background: url(/img/digital/062.jpg) no-repeat} #container .wrap_aco .accodian .r63 {background: url(/img/ai/06.png) no-repeat} #container .wrap_aco .accodian .r64 {background: url(/img/ai/07.png) no-repeat} #container .wrap_aco .accodian .r65 {background: url(/img/ai/08.png) no-repeat; padding-right: 65px;} #container .wrap_aco .accodian .r66 {background: url(/img/ai/09.png) no-repeat; padding-right: 65px;} #container .bis .floating_btn {width: 100%; height: 0; position: fixed; bottom: 0; margin: auto; z-index: 5; min-width: 1280px} #container .bis .floating_btn.off {position: absolute} #container .bis .floating_inner {position: absolute; bottom: 50px; right: 40px} #container .bis .floating_btn.off .floating_inner {bottom: 50px} #container .bis .floating_inner2 {position: absolute; bottom: 130px; right: 40px} #container .bis .floating_btn.off .floating_inner2 {bottom: 130px} #container .bis .btn_ask {width: 70px; height: 70px; border: 3px solid #007dc4; font-size: 14px; padding-top: 42px; box-sizing: border-box; background-color: #fff; text-align: center; color: #007dc4; display: inline-block} #container .bis .btn_ask:before {content: ''; display: inline-block; position: absolute; width: 32px; height: 28px; background: url(/img/sp_com.png) -90px -626px; top: 10px; left: 19px;} #container .bis .btn_ask:hover, #container .bis .btn_ask:focus, #container .bis .btn_ask:active {text-decoration: none; background-color: #007dc4; color: #fff;} #container .bis .btn_ask:hover:before, #container .bis .btn_ask:focus:before, #container .bis .btn_ask:active:before {background-position: -90px -659px} #container .bis .btn_news {width: 70px; height: 70px; border: 3px solid #007dc4; font-size: 14px; padding-top: 32px; box-sizing: border-box; background-color: #fff; text-align: center; color: #007dc4; display: inline-block; line-height: 1} #container .bis .btn_news:before {content: ''; display: inline-block; position: absolute; width: 32px; height: 28px; background: url(/img/sp_com.png) 2px -647px; top: 10px; left: 19px;} #container .bis .btn_news:hover, #container .bis .btn_news:focus, #container .bis .btn_news:active {text-decoration: none; background-color: #007dc4; color: #fff;} #container .bis .btn_news:hover:before, #container .bis .btn_news:focus:before, #container .bis .btn_news:active:before {background-position: 2px -671px} /*인공지능 커뮤니케이션*/ #container .ai>.layout {text-align: center} #container .ai .wrap_business {background: url(/img/ai_01.png) no-repeat 50% top; margin-top: 100px} #container .ai .wrap_business .m_slider .s01 {width: 342px; left: 16px} #container .ai .wrap_business .m_slider .s02 {width: 359px; left: 288px} #container .ai .wrap_business .m_slider .s02>span {margin-left: -9px} #container .ai .wrap_business .m_slider .s03 {width: 400px; left: 580px} #container .ai .wrap_business .m_slider .s03>span {margin-left: -40px} #container .ai .wrap_business .m_slider .s04 {width: 368px; left: 838px} #container .ai .wrap_business .m_slider .s04>span {margin-left: -7px} #container .ai .wrap_solution {background: url(/img/ai_02.png) no-repeat 50% top; height: 470px} #container .ai .wrap_solution .indicator {height: 470px} #container .ai .wrap_solution .solution>div {padding-top: 73px} #container .ai .wrap_solution .solution>div .exp {width: 703px} #container .ai .wrap_good {height: 704px} #container .ai .wrap_good .box01, #container .ai .wrap_good .box02 {height: 210px} #container .ai .wrap_good .box03, #container .ai .wrap_good .box04 {height: 190px} #container .ai .wrap_good .box01 .icon {width: 71px; height: 64px; background-position: -469px -144px; top: 73px; left: 32px} #container .ai .wrap_good .box02 .icon {width: 67px; height: 71px; background-position: -469px -287px; top: 71px; left: 34px} #container .ai .wrap_good .box03 .icon {width: 66px; height: 67px; background-position: -469px -72px; top: 62px; left: 33px} #container .ai .wrap_good .box04 .icon {width: 70px; height: 67px; background-position: -469px -213px; top: 62px; left: 31px} #container .ai .wrap_aco.ref {padding-bottom: 53px} #container .ai .wrap_aco .accodian {margin-top: 61px} #container .ai .wrap_aco .accodian .acc_cont {width: 70%; text-align: center; margin: auto;} #container .ai .wrap_aco .acc_cont .r01 {background: url(/img/ai/01.jpg) no-repeat 50% top} #container .ai .wrap_aco .acc_cont .r02 {background: url(/img/ai/02.jpg) no-repeat 50% top} #container .wrap_aco.partner {width: 100%; background-color: #f4f4f4; padding: 94px 0 100px} #container .ai .wrap_aco.partner .acc_cont .r01 {background: url(/img/ai/03.jpg) no-repeat 50% top} #container .ai .wrap_aco.partner .acc_cont .r02 {background: url(/img/ai/04.jpg) no-repeat 50% top} #container .ai .wrap_aco.partner .acc_cont .r03 {background: url(/img/ai/10.png) no-repeat 50% top; margin-right: 65px !important;} /*19.07.15 추가*/ #container .ai .btn_go {width: 250px; height: 50px; box-sizing: border-box; border: 3px solid #000; display: inline-block; line-height: 42px; font-size: 16px; font-weight: 600; margin-right: 17px; color: #000; } #container .ai .btn_go:last-child {margin-right: 0} #container .ai .btn_go>span {width: 24px; height: 10px; background-position: -29px -128px; position: absolute; right: 20px; top: 17px} #container .ai .btn_go:hover {color: #fff; background-color: #000} #container .ai .btn_go:hover>span {background-position: 0 -128px} /*popup*/ .mfp-iframe-holder .mfp-content {min-width: 1000px} .mfp-close-btn-in .mfp-close {display: inline-block; overflow: hidden; line-height: 99999; background: url(/img/close.png) no-repeat 98% top; width: 20px; height: 20px; right: 0; opacity: 1} /*iframe*/ #container .ai .ai_video {margin-top: 70px; display: block; width: 100%; height: 562px} #container .ai .ai_video iframe {width: 100%; height: 100%;} /*커뮤니케이션 클라우드*/ #container .cloud .wrap_business {background: url(/img/cloud_01.png) no-repeat 50% top; height: 540px; margin-top: 93px} #container .cloud .wrap_business .m_slider .s01 {width: 450px} #container .cloud .wrap_business .m_slider .s01>span {margin-left: -54px} #container .cloud .wrap_business .m_slider .s02 {width: 510px; left: 582px; top: 165px} #container .cloud .wrap_business .m_slider .s02>span {top: -165px; margin-left: -95px} #container .cloud .wrap_business .m_slider .s02>span:after {height: 95px} #container .cloud .wrap_solution {background: url(/img/cloud_02.jpg) no-repeat 50% top; height: 570px} /*#container .cloud .wrap_solution .bx-viewport {height: 570px !important}*/ #container .cloud .wrap_solution .indicator {height: 570px} #container .cloud .wrap_solution .solution .slide-number {bottom: 54px} #container .cloud .wrap_solution .solution>div {height: 570px} #container .cloud .wrap_solution .solution>div .exp {width: 895px} #container .cloud .wrap_service {width: 100%; height: 696px; padding-top: 91px; box-sizing: border-box} #container .cloud .wrap_service .services {margin-top: 46px; zoom : 1} #container .cloud .wrap_service .services:after {clear: both; content: ''; display: block} #container .cloud .wrap_service .service {width: 556px; float: left; margin-right: 44px; height: 117px;} #container .cloud .wrap_service .service.mb {margin-bottom: 23px} #container .cloud .wrap_service .service:nth-child(2n+2) {margin-right: 0} #container .cloud .wrap_service .service>p {display: inline-block; vertical-align: top} #container .cloud .wrap_service .service .th {width: 120px; margin-right: 32px; text-align: left; font-size: 18px; font-weight: 600; color: #007dc4; word-break: keep-all} #container .cloud .wrap_service .service .exp {font-size: 16px; line-height: 1.6; width: 366px; word-break: keep-all; margin-top: 3px} #container .cloud .wrap_good .box01 .icon {width: 60px; height: 62px; background-position: -469px -361px; top: 64px; left: 33px} #container .cloud .wrap_good .box02 .icon {width: 58px; height: 61px; background-position: -469px -428px; top: 65px; left: 37px} #container .cloud .wrap_good .box04 .icon {width: 66px; height: 67px; background-position: -469px -72px; top: 59px; left: 33px} #container .cloud .wrap_aco {padding-bottom: 59px} #container .cloud .wrap_aco .accodian .r01 {background: url(/img/cloud/01.jpg) no-repeat 50% top} #container .cloud .wrap_aco .accodian .r02 {background: url(/img/cloud/02.jpg) no-repeat 50% top} #container .cloud .wrap_aco .accodian .r03 {background: url(/img/cloud/03.jpg) no-repeat 50% top} #container .cloud .wrap_aco .accodian .r04 {background: url(/img/cloud/04.jpg) no-repeat 50% top} #container .cloud .wrap_aco .accodian .r05 {background: url(/img/cloud/05.jpg) no-repeat 50% top} #container .cloud .wrap_aco .accodian .r06 {background: url(/img/cloud/06.jpg) no-repeat 50% top} #container .cloud .wrap_aco .accodian .r07 {background: url(/img/cloud/07.jpg) no-repeat 50% top} #container .cloud .wrap_aco .accodian .r08 {background: url(/img/cloud/08.jpg) no-repeat 50% top} #container .cloud .wrap_aco .accodian .r09 {background: url(/img/cloud/09.jpg) no-repeat 50% top} #container .cloud .wrap_aco .accodian .r10 {background: url(/img/cloud/010.jpg) no-repeat 50% top} #container .cloud .wrap_aco .accodian .r11 {background: url(/img/cloud/011.jpg) no-repeat 50% top} #container .cloud .wrap_aco .accodian .r12 {background: url(/img/cloud/012.jpg) no-repeat 50% top} #container .cloud .wrap_aco .accodian .r13 {background: url(/img/cloud/013.jpg) no-repeat 50% top} #container .cloud .wrap_aco.partner {padding-bottom: 108px} #container .cloud .wrap_aco.partner .accodian .r01 {background: url(/img/cloud/014.jpg) no-repeat 50% top} #container .cloud .wrap_aco.partner .accodian .r02 {background: url(/img/cloud/015.jpg) no-repeat 50% top} #container .cloud .wrap_aco.partner .accodian .r03 {background: url(/img/cloud/016.jpg) no-repeat 50% top} #container .cloud .wrap_aco.partner .accodian .r04 {background: url(/img/cloud/017.jpg) no-repeat 50% top} #container .cloud .wrap_aco.partner .accodian .r05 {background: url(/img/cloud/018.jpg) no-repeat 50% top} /*19.07.15 추가*/ #container .cloud>.layout {text-align: center} #container .cloud .btn_go {width: 250px; height: 50px; box-sizing: border-box; border: 3px solid #000; display: inline-block; line-height: 42px; font-size: 16px; font-weight: 600; margin-top: 39px !important; color: #000; margin-right: 17px} #container .cloud .btn_go>span {width: 24px; height: 10px; background-position: -29px -128px; position: absolute; right: 20px; top: 17px} #container .cloud .btn_go:hover {color: #fff; background-color: #000} #container .cloud .btn_go:hover>span {background-position: 0 -128px} /*모바일*/ #container .mobile .wrap_solution {background: url(/img/mob.png) no-repeat 50% top; height: 645px} #container .mobile .wrap_solution {margin-top: 91px; height: 645px} #container .mobile .wrap_solution .solution>div {height: 645px} #container .mobile .wrap_solution .solution .slide-number {bottom: 77px} #container .mobile .wrap_solution .solution>div .exp {width: 860px} #container .mobile .wrap_solution .indicator {height: 645px} #container .mobile .wrap_solution .indicator ul>li {height: 44px; line-height: 44px} #container .mobile .wrap_good {height: 625px} #container .mobile .wrap_good div[class^="box0"] {height: 160px} #container .mobile .wrap_good .box01 .icon {width: 66px; height: 66px; background-position: -396px -428px; top: 47px; left: 31px} #container .mobile .wrap_good .box02 .icon {width: 64px; height: 63px; background-position: -396px -499px; top: 49px; left: 34px} #container .mobile .wrap_good .box03 .icon {width: 66px; height: 67px; background-position: -469px -72px; top: 47px; left: 31px} #container .mobile .wrap_aco {padding-bottom: 59px} #container .mobile .wrap_aco .accodian {width: 100%; text-align: center;} #container .mobile .wrap_aco .accodian .r01 {background: url(/img/mobile/01.jpg) no-repeat 50% top} #container .mobile .wrap_aco .accodian .r02 {background: url(/img/mobile/02.jpg) no-repeat 50% top} #container .mobile .wrap_aco .accodian .r03 {background: url(/img/mobile/03.jpg) no-repeat 50% top} #container .mobile .wrap_aco .accodian .r04 {background: url(/img/mobile/04.jpg) no-repeat 50% top} #container .mobile .wrap_aco .accodian .r05 {background: url(/img/mobile/05.jpg) no-repeat 50% top} #container .mobile .wrap_aco.partner {padding : 90px 0 109px} #container .mobile .wrap_aco.partner .accodian {width: 100%; text-align: center; } #container .mobile .wrap_aco.partner .accodian .r01 {background: url(/img/mobile/06.jpg) no-repeat 50% top} #container .mobile .wrap_aco.partner .accodian .r02 {background: url(/img/mobile/07.jpg) no-repeat 50% top} #container .mobile .wrap_aco.partner .accodian .r03 {background: url(/img/mobile/08.jpg) no-repeat 50% top} /* 클라우드 솔루션(23.02 추가) */ #container .solution .wrap_business {background: url(/img/solution_01.png) no-repeat 50% top;} #container .solution .wrap_business .line {display: none;} #container .solution .wrap_business .m_slider {position: relative; left: auto; top: auto;} #container .solution .wrap_business .m_slider>li {width: auto;} #container .solution .wrap_business .m_slider>li>span {font-size: 22px;} #container .solution .wrap_business .m_slider>li>span:after {margin-left: 0; height: 149px; background: url(/img/chain02.png) no-repeat;} #container .solution .wrap_business .m_slider .s01 {left: -200px; top: 80px; text-align: right;} #container .solution .wrap_business .m_slider .s01>span {top: 50px; left: 646px; margin-left: 0; width: auto;} #container .solution .wrap_business .m_slider .s01>span:after {top: -91px; left: -95px; transform: rotate(90deg); height: 110px;} #container .solution .wrap_business .m_slider .s02 {right: -153px; left: auto; top: 96px;} #container .solution .wrap_business .m_slider .s02>span {top: 14px; left: -458px; margin-left: 0;} #container .solution .wrap_business .m_slider .s02>span:after {top: -73px; left: auto; right: 25px; height: 147px; transform: rotate(-90deg);} #container .solution .wrap_business .m_slider .s03 {left: 50%; top: 320px; margin-left: 240px; width: 450px;} #container .solution .wrap_business .m_slider .s03>span {top: -30px; left: -50%; margin-left: -239px;} #container .solution .wrap_business .m_slider .s03>span:after {top: -20px; left: auto; right: 58px; height: 123px; transform: rotate(-90deg);} #container .solution .wrap_solution .indicator ul>li {padding-left: 30px;} #container .solution .wrap_solution .indicator ul>li:last-child {font-size: 13px;} #container .solution .wrap_good {padding-bottom: 90px; height: auto;} #container .solution .wrap_good .wrap_box {margin-bottom: 70px;} #container .solution .wrap_good div[class^="box0"] {padding: 85px 45px 30px 125px; height: 230px;} #container .solution .wrap_good .wrap_box .g_question {position: absolute !important; top: 30px; left: 125px; font-size: 16px;; word-break: keep-all;} #container .solution .wrap_good .wrap_box .g_tit {margin-bottom: 0;} #container .solution .wrap_good .box01 .icon {top: 27px; left: 36px; width: 57px; height: 68px; background-position: -396px 0;} #container .solution .wrap_good .box02 .icon {top: 34px; left: 28px; width: 71px; height: 68px; background-position: -469px -144px;} #container .solution .wrap_good .box03 .icon {top: 22px; left: 39px; width: 57px; height: 77px; background-position: -396px -206px;} #container .solution .wrap_good .box04 .icon {top: 30px; left: 37px; width: 58px; height: 68px; background-position: -469px 0;} #container .solution .wrap_good img {display: block; margin: 40px auto 0;} #container .solution .wrap_good img:nth-of-type(1) {margin-bottom: 100px;} #container .solution .wrap_good .secExp {margin: 35px 0 20px; text-align: center; font-size: 36px;} #container .solution .wrap_good .secExp .cl_o {color: #ea5504;} #container .solution .wrap_good .secExp .cl_b {color: #0093d4;} /*----------------------PR-------------------*/ /*공지사항*/ #container .bg.pr {background: url(/img/pr.jpg) no-repeat 50% top} #container .board {margin-top: 47px; border-top: 2px solid #000; width: 100%} #container .board .th {font-size: 18px; font-weight: 600; padding: 16px 0 19px; text-align: center; border-bottom: 1px solid #c7c7c7; zoom : 1; height: 61px; box-sizing: border-box} #container .board .th:after {clear: both; content: ''; display: block} #container .board .th>p {float: left; width: 22%} #container .board .th>p:first-child {width: 78%} #container .board .b_list {width: 100%; border-bottom: 1px solid #c7c7c7; padding: 17px 0; zoom : 1; height: 61px; box-sizing: border-box} #container .board .b_list:after {clear: both; content: ''; display: block} #container .board .b_list>p {font-size: 18px; float: left; color: #c7c7c7; text-align: center; width: 22%} #container .board .th.admin>p {width: 13%} #container .board .th.admin>p:first-child {width: 74%} #container .board .b_list.admin>p {width: 13%} #container .board .b_list>p:first-child {width: 78%} #container .board .b_list.no-list>p {width: 100%} #container .board .b_list.admin>p:first-child {width: 13%} #container .board .b_list.admin>p:first-child {width: 74% } #container .board .b_list>p>a {font-size: 18px; font-weight: 500; color: #000; display: inline-block; width: 100%; overflow: hidden; white-space: nowrap; text-align: left; padding-left: 40px; text-overflow: ellipsis; box-sizing: border-box} #container .board .b_list.top>p>a {color: #007dc4} #container .board .b_list.invisible {background-color: #f4f4f4} #container .pager {width: 100%; text-align: center; margin-top: 41px} #container .pager a {display: inline-block; width: 50px; height: 50px; text-align: center; line-height: 50px; font-size: 16px; margin-left: -3px } #container .pager a.active {background-color: #f4f4f4; color: #0064b0; font-weight: 600; margin-left: -3px} #container .pager a:hover{text-decoration: none; background-color: #f4f4f4; color: #0064b0; font-weight: 600} #container .pager .prev {background-position: -5px -212px; margin-right: 37px} #container .pager .next {background-position: -76px -212px; margin-left: 37px} #container .select {width: 877px; height: 48px; border: 1px solid #cbcbcb; position: relative; margin: 70px auto 0;} #container .select .sch {width: 178px; height: 48px; box-sizing: border-box; padding: 13px 28px; font-size: 16px; border: none; border-right: 1px solid #cbcbcb; background: url(/img/b_arrow.png) no-repeat 83% 50%; display: inline-block; position: relative} #container .select .sch.active {background: url(/img/b_arrow_up.png) no-repeat 83% 50%} #container .select .sch-list {position: absolute; left: -1px; top: 48px; border: 1px solid #c7c7c7; width: 100%; vertical-align: top; display: none} #container .select .sch-list>li {border-bottom: 1px solid #c7c7c7; padding: 13px 28px; box-sizing: border-box; width: 100%} #container .select .sch-list>li:last-child {border-bottom: none} #container .select input {width: 70%; padding-left: 10px; font-size: 16px; border: none; height: 100%; vertical-align: top} #container .select .btn_sch {position: absolute; width: 48px; height: 48px; background-position: -307px -271px; right: 0px; top: 0px} #container .viewPage {margin-top: 47px; width: 100%; border-top: 2px solid #000} #container .viewPage>div {border-bottom: 1px solid #c7c7c7; width: 100%; box-sizing: border-box} #container .viewPage .titleArea {padding: 23px 40px 20px; } #container .viewPage .titleArea .tit {font-size: 24px; width: 100%; text-align: center; font-weight: 600} #container .viewPage .titleArea ul {width: 100%; text-align: center; margin-top: 15px} #container .viewPage .titleArea ul>li {padding: 0 20px; position: relative; font-size: 18px; color: #c7c7c7; font-weight: 500; display: inline-block} #container .viewPage .titleArea ul>li:after {content: ''; display: inline-block; width: 2px; height: 12px; right: -2px; top: 8px; background-color: #c7c7c7; position: absolute} #container .viewPage .titleArea ul>li:last-child:after {display: none} #container .viewPage .contArea {padding: 35px 40px 222px} #container .viewPage .contArea .cont {font-size: 16px} /*#container .viewPage .contArea .cont img {width: 100% !important}*/ #container .viewPage .fileArea {padding: 15px 40px; } #container .viewPage .fileArea .file {display: block; font-size: 16px; margin-bottom: 12px} #container .viewPage .fileArea .file:last-child {margin-bottom: 0} #container .viewPage .fileArea .file>span {width: 20px; height: 18px; background-position: -238px -232px; margin: 5px 12px 0 0;} #container .listBtn {width: 100%; text-align: left; margin-top: 40px; position: relative} #container .listBtn>a{width: 150px; height: 50px; display: inline-block; line-height: 50px; font-size: 16px; background-color: #f4f4f4; text-align: center} #container .listBtn>a>span {display: inline-block; height: 100%} #container .listBtn>a:hover, #container .listBtn>a:focus, #container .listBtn>a:active {text-decoration: none} #container .listBtn .prev {margin-right: 10px} #container .listBtn .prev .sp_com {width: 24px; height: 10px; background-position: -18px -232px; margin: 20px 22px 0 0;} #container .listBtn .next .sp_com {width: 24px; height: 10px; background-position: -91px -232px; margin: 20px 0 0 22px;} #container .listBtn .m_Non {display: inline-block} #container .listBtn .go_list {background-color: #3b414b; color: #fff; position: absolute; right: 0; top: 0} #container .listBtn .modify {background-color: #3b414b; color: #fff; position: absolute; right: 160px; top: 0} #container .listBtn .delete {background-color: #3b414b; color: #fff; position: absolute; right: 320px; top: 0} #container .writePage {margin-top: 47px; width: 100%; border-top: 2px solid #000} #container .writePage>div {zoom : 1; padding: 17px 0 16px; width: 100%; box-sizing: border-box; border-bottom: 1px solid #c7c7c7; height: 61px; } #container .writePage>div:after {clear: both; content: ''; display: block} #container .writePage>div>div {float: left; } #container .writePage .th {font-size: 16px; font-weight: 600; padding: 0 40px; box-sizing: border-box; width: 140px; position: relative} #container .writePage .th:after {position: absolute; width: 2px; height: 12px; background-color: #c7c7c7; right: -2px; top: 50%; margin-top: -5px; display: inline-block; content: ''} #container .writePage>div>div:last-child {padding: 0 40px 0 22px; box-sizing: border-box} /*체크박스*/ .checkbox-container {position: relative;} .checkbox-container input[type="checkbox"] {position: absolute; width: 1px; height: 1px; padding: 0; margin-right: 12px; overflow: hidden; clip:rect(0,0,0,0); border: 0} .checkbox-container input[type="checkbox"] + label {display: inline-block; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; font-size: 16px} .checkbox-container input[type="checkbox"] + label:before {content: ' '; display: inline-block; width: 20px; height: 20px; line-height: 18px; margin: 0 12px 0 0; text-align: center; vertical-align: top; border: 3px solid #c7c7c7;} .checkbox-container input[type="checkbox"] + label:active:before, .checkbox-container input[type="checkbox"]:checked + label:active:before {border-color: #007dc4; color: #007dc4} .checkbox-container input[type="checkbox"]:checked + label:before {/*content: '\2713';*/ color: #007dc4; text-shadow: 1px 1px white; border-color: #007dc4; font-weight: 900; background: url(/img/ck.png) no-repeat 2px 5px} #container .writePage .title, #container .writePage .date, #container .writePage .period {padding: 10px 0} #container .writePage .title .th, #container .writePage .date .th, #container .writePage .period .th {margin-top: 7px} #container .writePage .title .th+div{width: 88%} #container .writePage .title input {width: 100%; height: 40px; border: 1px solid #c7c7c7; padding-left: 10px; box-sizing: border-box; font-size: 16px} #container .writePage .period input {width: 200px; height: 40px; border: 1px solid #c7c7c7; padding-left: 10px; box-sizing: border-box; font-size: 16px; background-color: #f4f4f4} #container .writePage .date .calender{width: 200px; height: 40px; border: 1px solid #c7c7c7; box-sizing: border-box; position: relative; font-size: 16px; background-color: #f4f4f4; line-height: 18px} #container .writePage .date .calender>input {border: none; background-color: #f4f4f4; line-height: 1; display: inline-block; width: 100%; height: 100%; box-sizing: border-box; padding-left: 10px} /*#container .writePage .date .calender>span {width: 22px; height: 20px; background-position: -269px -206px; position: absolute; right: 9px; top: 10px}*/ #container .writePage .date .calender>img {position: absolute; right: 9px; top: 9px} #container .writePage div.editor {padding: 10px 40px; height: auto} #container .writePage div.editor>textarea{border: 1px solid #c7c7c7; width: 100%; height: 483px; text-align: left; padding: 25px 30px; box-sizing: border-box; font-size: 16px} #container .writePage .file {position: relative; height: auto; padding: 16px 0} #container .writePage .file .th+div {padding-left: 20px} #container .writePage .file .filelist {margin-bottom: 10px} #container .writePage .file .filelist:last-child{margin-bottom: 0;} #container .writePage .filelist #thumTag {display: inline-block; margin-top: 5px} #container .writePage .filelist #thumTag + .delete {margin-left: 5px; margin-top: 3px} #container .writePage .filelist>input {margin-right: 10px; width: 700px; box-sizing: border-box; border: 1px solid #c7c7c7; font-size: 16px; background-color: #f4f4f4} #container .writePage .filelist>input:last-child {margin-bottom: 0} #container .writePage .filelist>span {width: 30px; height: 30px; background-color: #f4f4f4; cursor: pointer} #container .writePage .filelist .plus {width: 30px; height: 30px; margin-right: 10px; background-position: -352px -206px; } #container .writePage .filelist .delete {background-position: -307px -206px; margin-left: -1px} #container .writePage .file .exp {position: absolute; color: #0e84c7; font-size: 16px; top: 17px; right: 40px} #container .writePage .file .plus {width: 30px; height: 30px; margin-right: 10px; background-position: -351px -206px; background-color: #c7c7c7; position: absolute; right: -2px} #container .writeBtn {width: 100%; margin-top: 40px; text-align: center} #container .writeBtn>a {display: inline-block; width: 150px; height: 50px; margin-right: 10px; font-size: 16px; background-color: #c7c7c7; text-align: center; line-height: 50px; cursor: pointer} #container .writeBtn>a:last-child {margin-right: 0} #container .writeBtn .btn_save {background-color: #3b414b; color: #fff} #container .writeBtn>a:hover, #container .writeBtn>a:active, #container .writeBtn>a:focus {text-decoration: none} .cke_chrome {width: 100% !important} /*언론보도*/ #container .wrap_listBox{margin-top: 47px; border-top: 2px solid #000} #container .listBox {width: 100%; box-sizing: border-box; padding: 40px 20px; border-bottom: 1px solid #c7c7c7; zoom : 1} #container .listBox:after {clear: both; content: ''; display: block} #container .listBox img[class*='thum'] {width: 375px; height: 250px; background-color: #f1f1f2; margin-right: 38px; float: left} #container .listBox .thum01 {background: url(/img/p_thum01.png) no-repeat;} #container .listBox .thum02 {background: url(/img/p_thum02.png) no-repeat;} #container .listBox .thum03 {background: url(/img/p_thum03.png) no-repeat;} #container .listBox .textArea {width: 740px; position: relative; float: left} #container .listBox .tit {width: 100%; height: 70px; overflow: hidden; font-size: 24px; font-weight: 600; text-align: left; text-overflow: ellipsis; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; word-wrap: break-word} #container .listBox .cont {font-size: 16px; margin-top: 26px; height: 77px; overflow: hidden; width: 543px; text-overflow: ellipsis; -webkit-line-clamp: 3; display: -webkit-box; -webkit-box-orient: vertical; word-wrap: break-word } #container .listBox ul {margin-top: 45px;} #container .listBox ul>li {font-size: 18px; font-weight: 500; display: inline-block; position: relative; color: #c7c7c7; letter-spacing: 0px; } #container .listBox ul>li:first-child {margin-right: 40px} #container .listBox.admin ul>li:first-child:after {content: ''; display: inline-block; width: 2px; height: 12px; background-color: #c7c7c7; position: absolute; right: -22px; top: 8px} #container .listBox .btn_detail {display: inline-block; width: 170px; height: 50px; background-color: #f4f4f4; font-size: 16px; text-align: center; line-height: 50px; position: absolute; right: -7px; bottom: -5px; cursor: pointer} #container .listBox .btn_detail:hover, #container .listBox .btn_detail:active, #container .listBox .btn_detail:focus {text-decoration: none} /*-------------------채용정보-----------------*/ #container .bg.rec {background: url(/img/recruit.jpg) no-repeat 50% top} /*인재상*/ #container .rec.pb0 {padding-bottom: 0} #container .rec .s_tit {font-size: 20px; margin-top: 43px; width: 100%; text-align: center} #container .rec .img_tit {font-size: 26px; font-weight: 600; width: 100%; text-align: center; margin-top: 78px} #container .rec .v_img {width: 1130px; height: 660px; background: url(/img/value.jpg) no-repeat 50% top; margin: 35px auto 100px} #container .rec .bottom {background-color: #f4f4f4; height: 514px; padding-top: 100px; box-sizing: border-box} #container .rec .bottom .subV {width: 270px; margin-right: 37px; display: inline-block; vertical-align: top} #container .rec .bottom .subV:last-child {margin-right: 0} #container .rec .bottom .subV div[class^='box'] {width: 100%; height: 200px; background-color: #fff;; box-sizing: border-box; padding-top: 36px} #container .rec .bottom .subV div[class^='box']>span {margin: 0 auto; display: block} #container .rec .bottom .subV p {text-align: center; width: 100%} #container .rec .bottom .subV .box01 .icon {width: 70px; height: 80px; background-position: -307px -559px} #container .rec .bottom .subV .box02 .icon {width: 85px; height: 80px; background-position: -396px -564px} #container .rec .bottom .subV .box03 .icon {width: 61px; height: 80px; background-position: -486px -564px} #container .rec .bottom .subV .box04 .icon {width: 60px; height: 80px; background-position: -307px -452px} #container .rec .bottom .subV .value {margin-top: 12px; font-size: 24px; font-weight: 700; font-family: "Lato","맑은 고딕"; letter-spacing: 0px} #container .rec .bottom .subV .exp {margin-top: 16px; font-size: 16px; line-height: 1.6} /*인사교육제도*/ #container .rank {margin: 79px 0 100px} #container .rank p {width: 100%; text-align: center} #container .secTit {font-size: 26px; font-weight: 600; margin-bottom: 32px; width: 100%; text-align: center} #container .rank div[class^='box'] {width: 372px; height: 275px; box-sizing: border-box; display: inline-block; margin-right: 39px; padding: 25px 0; background-color: #f4f4f4; vertical-align: top} #container .rank>div:last-child {margin-right: 0} #container .rank div[class^='box'] .icon {display: block} #container .rank .box01 .icon {width: 86px; height: 87px; background-position: 0px -361px; margin: 0 auto} #container .rank .box02 .icon {width: 86px; height: 84px; background-position: -88px -361px; margin: 3px auto 10px} #container .rank .box03 .icon {width: 95px; height: 73px; background-position: -196px -361px; margin: 10px auto 10px} #container .rank div[class^="box"] .m_cont {display: inline-block; width: 100%} #container .rank div[class^='box'] .tit {margin-top: 21px; color: #007dc4; font-size: 18px; font-weight: 600; margin-bottom: 10px;} #container .rank div[class^='box'] .exp {font-size: 16px; margin-top: 10px; box-sizing: border-box; padding: 0 64px; word-break: keep-all} #container .rank div[class^='box'].box03 .tit {margin-top: 25px } #container .reward {width: 100%; height: 418px; background: url(/img/wantEdu.png) no-repeat 50% top; padding-top: 91px; box-sizing: border-box} #container .reward .box {width: 580px; margin-right: 37px; display: inline-block; vertical-align: top} #container .reward .box:last-child {margin-right: 0} #container .reward .box .tit {width: 100%; height: 80px; text-align: center; line-height: 80px; font-size: 20px; color: #007dc4; font-weight: 600; background-color: #fff; letter-spacing: -0.5px} #container .reward .box .tit>span {font-family: "Lato","sans"; margin-left: 10px; font-weight: 900; color: #000} #container .reward .box .exp {padding-top: 24px; width: 100%; text-align: center; font-size: 18px} #container .edu {padding: 91px 0 60px} #container .edu .layout {zoom : 1} #container .edu .layout:after {clear: both; content: ''; display: block} #container .edu div[class^='box'] {float: left; width: 374px; height: 190px; box-sizing: border-box; padding: 35px 0 0 135px; background-color: #f4f4f4; position: relative; margin: 0 39px 40px 0; } #container .edu div[class^='box']:nth-child(3n+4) {margin-right: 0} #container .edu div[class^='box'] .icon {position: absolute; } #container .edu .box01 .icon {width: 57px; height: 67px; background-position: -396px 0; left: 38px; top: 60px} #container .edu .box02 .icon {width: 44px; height: 57px; background-position: -396px -72px; top: 65px; left: 45px} #container .edu .box03 .icon {width: 63px; height: 64px; background-position: -396px -133px; top: 62px; left: 36px} #container .edu .box04 .icon {width: 48px; height: 76px; background-position: -396px -206px; top: 56px; left: 43px; } #container .edu .box05 .icon {width: 50px; height: 67px; background-position: -396px -287px; top: 60px; left: 40px} #container .edu .box06 .icon {width: 67px; height: 42px; background-position: -396px -361px; top: 73px; left: 34px} #container .edu div[class^='box'] .tit {font-size: 18px; color: #007dc4; font-weight: 600; margin-bottom: 10px; text-align: left} #container .edu div[class^='box'] .exp {font-size: 16px; } #container .welfare {width: 100%; background-color: #f4f4f4; padding: 91px 0 150px} #container .welfare .wrap_wel {zoom : 1; margin-top: 1px} #container .welfare .wrap_wel:after {clear: both; content: ''; display: block; } #container .welfare .wrap_wel>div {float: left; margin-right: 39px; position: relative; background-color: #fff; width: 374px; height: 226px; box-sizing: border-box; padding: 37px 0 0 135px; } #container .welfare .wrap_wel>div:last-child {margin-right: 0} #container .welfare div[class^='wel'] .icon {position: absolute; top: 61px} #container .welfare .wel01 .icon {width: 72px; height: 71px; background-position: 0 -564px; left: 32px} #container .welfare .wel02 .icon {width: 60px; height: 60px; background-position: -91px -564px; left: 39px} #container .welfare .wel03 .icon {width: 75px; height: 51px; background-position: -157px -564px; left: 29px} #container .welfare div[class^='wel'] .tit {font-size: 18px; color: #007dc4; font-weight: 600; margin-bottom: 8px; text-align: left; letter-spacing: -0.7px} #container .welfare div[class^='wel'] ul>li {font-size: 16px; position: relative; padding-left: 10px; box-sizing: border-box } #container .welfare div[class^='wel'] ul>li:before {content: ''; display: inline-block; width: 5px; height: 2px; background-color: #000; position: absolute; left: -2px; top: 10px} #container .welfare .harmony {margin-top: 40px; width: 100%; background-color: #fff; padding: 43px 40px 11px 40px; zoom : 1; box-sizing: border-box} #container .welfare .harmony:after {clear: both; content: ''; display: block} #container .welfare .harmony .tit {font-size: 18px; color: #007dc4; font-weight: 600; margin-bottom: 25px; letter-spacing: -0.5px} #container .welfare .harmony .h_box {float: left; margin-right: 40px; width: 540px} #container .welfare .harmony .h_box:nth-child(2n+1) {margin-right: 0} #container .welfare .harmony .h_box .box {width: 100%; height: 60px; line-height: 60px; font-size: 16px; font-weight: 800; font-family: "Lato"; text-align: center; background-color: #f4f4f4; letter-spacing: -0.5px} #container .welfare .harmony .h_box .box>span {font-family: 'Noto Sans Korean', '맑은 고딕'; font-weight: 700} #container .welfare .harmony .h_box .exp {font-size: 16px; height: 73px; width: 100%; text-align: center; padding-top: 16px; box-sizing: border-box; letter-spacing: -0.5px} /*직무소개*/ #container .cate {font-size: 26px; font-weight: 600; margin: 57px 0 36px; width: 100%; text-align: center} #container .j_box {width: 580px; height: 202px; box-sizing: border-box; padding: 25px 0 0 31px; margin: 0 37px 40px 0; zoom :1; display: inline-block; vertical-align: top; background-color: #f4f4f4} #container .j_box:after {clear: both; content: ''; display: block} #container .j_box:nth-child(2n+1) {margin-right: 0} #container .j_box>div {float: left} #container .j_box>.th {width: 137px;} #container .j_box .th>p {font-size: 18px; color: #007dc4; font-weight: 700; } #container .j_box .cont {width: 390px} #container .j_box .cont .detail {border-bottom: 2px solid #fff; padding-left: 20px; height: 76px; width: 100%} #container .j_box .cont .detail:last-child {border-bottom: none; padding-top: 23px} #container .j_box .cont .detail>p {display: inline-block; vertical-align: top; font-size: 16px} #container .j_box .cont .detail .th {margin-right: 18px; font-weight: 600; } #container .j_box .cont .detail .txt {width: 274px; letter-spacing: -0.8px} #container .rec .bottom.long {height: 757px} #container .rec .bottom .cate {margin-top: 0; margin-bottom: 39px} #container .rec .bottom .j_box {background-color: #fff} #container .rec .bottom .j_box {margin-right: 37px} #container .rec .bottom .j_box:nth-child(2n+1) {margin-right: 0} #container .rec .bottom .j_box .cont .detail {border-bottom-color: #f4f4f4} #container .rec .bottom .j_box .cont .detail .th>p {line-height: 1.45} /*채용 프로세스*/ #container .rec .wrap_process {width: 100%; height: 440px; box-sizing: border-box; padding: 35px 40px 40px; margin-bottom: 40px; background-color: #f4f4f4} #container .rec .secTit.proc {margin: 58px 0 30px} #container .rec .wrap_process>p {width: 100%; text-align: center} #container .rec .boxTit {font-size: 18px; font-weight: 600; color: #007dc4; width: 100%; text-align: center} #container .rec .wrap_process .re_exp {font-size: 16px; margin-top: 40px; letter-spacing: -0.5px} #container .rec .wrap_process .chart {margin-top: 37px; width: 100%; height: 237px; background-color: #fff; position: relative; zoom : 1; padding-top: 40px; box-sizing: border-box; text-align: center} #container .rec .wrap_process .chart div[class^='step'] { display: inline-block; vertical-align: top; margin-left: 23px; width: 128px} #container .rec .wrap_process .chart div[class^='step']:first-child {margin-left: 0} #container .rec .wrap_process .chart .step02 {margin-left: 20px !important; } #container .rec .wrap_process .chart div[class^='step'] .icon {width: 92px; height: 92px; border: 4px solid #007dc4; border-radius: 50%; position: relative; z-index: 1; background-color: #fff; margin: 0 auto} #container .rec .wrap_process .chart div[class^='step'] p {width: 100%; text-align: center; font-size: 16px; margin-top: 13px} #container .rec .wrap_process .chart div[class^='step'] p>span {font-weight: 600; color: #007dc4} #container .rec .wrap_process .chart .step01 .icon>span{width: 40px; height: 55px; background-position: -540px 0px; margin-top: 18px} #container .rec .wrap_process .chart .step02 .icon>span {width: 52px; height: 57px; background-position: -540px -60px; margin-top: 17px; margin-left: 6px} #container .rec .wrap_process .chart .step03 .icon>span {width: 59px; height: 59px; background-position: -540px -121px; margin-top: 17px} #container .rec .wrap_process .chart .step04 .icon>span {width: 49px; height: 46px; background-position: -540px -185px; margin-top: 23px} #container .rec .wrap_process .chart .step05 .icon>span {width: 47px; height: 49px; background-position: -540px -234px; margin-top: 21px} #container .rec .wrap_process .chart .line {width: 1000px; height: 1px; background-color: #007dc4; border-top: 3px solid #f4f4f4; border-bottom: 3px solid #f4f4f4; position: absolute; top: 87px; left: 60px; z-index: 0} #container .rec .wrap_info {width: 100%; zoom : 1; margin-bottom: 40px} #container .rec .wrap_info:after {clear: both; content: ''; display: block} #container .rec .wrap_info>div {float: left;} #container .rec .wrap_info .submit {margin-right: 40px; width: 580px; height: 390px; background-color: #f4f4f4; padding: 35px 39px; box-sizing: border-box} #container .rec .wrap_info .boxTit {margin-bottom: 37px} #container .rec .wrap_info .txt {font-size: 16px} #container .rec .wrap_info .submit .txt {font-size: 16px; width: 100%; padding-left: 93px; box-sizing: border-box; position: relative; margin-bottom: 15px} #container .rec .wrap_info .submit ul {padding-left: 93px; margin-top: 7px; font-size: 16px} #container .rec .wrap_info .submit ul>li {line-height: 1.6; position: relative; padding-left: 12px} #container .rec .wrap_info .submit ul>li>span {position: absolute; left: 0} #container .rec .wrap_info .txt .th {position: absolute; left: 0; font-weight: 600} #container .rec .wrap_info .result, #container .rec .wrap_info .how {padding: 35px 64px; box-sizing: border-box} #container .rec .wrap_info .result {background-color: #f4f4f4; height: 190px; width: 580px; margin-bottom: 40px;} #container .rec .wrap_info .how {background-color: #f4f4f4; width: 580px; height: 160px; } #container .rec .wrap_info .result .txt, #container .rec .wrap_info .how .txt {text-align: center; word-break: keep-all} #container .rec .ask {width: 100%; height: 70px; background-color: #f4f4f4; margin-bottom: 100px} #container .rec .ask p {width: 100%; text-align: center; font-size: 16px; font-family: "Lato"; height: 100%; line-height: 70px; font-weight: 600; letter-spacing: -0.5px; margin-left: -12px} #container .rec .ask p .sp_com {width: 36px; height: 36px; background-position: -90px -452px; margin-right: 10px; margin-top: 17px} #container .rec .ask p .cl_b {font-weight: 600; margin-right: 20px; font-family: "Noto Sans Korean"} /*채용공고*/ #container .wrap_Rlist {width: 100%; margin-top: 48px} #container .wrap_Rlist .r_list:last-child{display: none;}/*20200811수*/ #container .wrap_Rlist>div:last-child {margin-bottom: 0 !important} #container .wrap_Rlist .r_list {width: 100%; border: 1px solid #c7c7c7; height: 100px; box-sizing: border-box; position: relative; zoom : 1; margin-bottom: 20px; display: inline-block} #container .wrap_Rlist .r_list:hover, #container .wrap_Rlist .r_list:active, #container .wrap_Rlist .r_list:focus {border: 3px solid #007dc4} #container .wrap_Rlist .r_list:after {clear: both; content: ''; display: block} #container .r_list>p {float: left; line-height: 100px;} #container .wrap_Rlist .r_list:hover>p, #container .wrap_Rlist .r_list:active>p, #container .wrap_Rlist .r_list:focus>p {line-height: 96px} #container .r_list .d-day {margin-right: 10px; font-size: 34px; font-weight: 300; color: #007dc4; letter-spacing: -0.5px; width: 125px; padding-left: 35px;} #container .wrap_Rlist .r_list:hover .d-day, #container .wrap_Rlist .r_list:active .d-day, #container .wrap_Rlist .r_list:focus .d-day {padding-left: 33px} #container .r_list .tit {font-size: 24px; width: 640px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; text-align: left} #container .r_list.no-list .tit {width: 100%; text-align: center} #container .r_list ul {position: absolute; right: 40px; top: 37px} #container .wrap_Rlist .r_list:hover ul, #container .wrap_Rlist .r_list:active ul, #container .wrap_Rlist .r_list:focus ul {top: 35px; right: 38px} #container .r_list ul>li {display: inline-block; position: relative; font-size: 18px; font-weight: 500; color: #c7c7c7; letter-spacing: -0.1px} #container .r_list ul .view {margin-left: 40px} #container .r_list ul .view:before {content: ''; display: inline-block; width: 2px; height: 12px; background-color: #c7c7c7; position: absolute; left: -19px; top: 8px} #container .wrap_Rlist .r_list.end {background-color: #f4f4f4; border: #f4f4f4} #container .wrap_Rlist .r_list.end>p {color: #c7c7c7} #container .wrap_Rlist .r_list.end:hover>p, #container .wrap_Rlist .r_list.end:active>p, #container .wrap_Rlist .r_list.end:focus>p {line-height: 100px} #container .wrap_Rlist .r_list.end .d-day {font-size: 34px; font-family: "Noto Sans Korean"; } #container .wrap_Rlist .r_list.end:hover .d-day, #container .wrap_Rlist .r_list.end:active .d-day, #container .wrap_Rlist .r_list.end:focus .d-day {padding-left: 35px} #container .wrap_Rlist .r_list.end:hover ul, #container .wrap_Rlist .r_list.end:active ul, #container .wrap_Rlist .r_list.end:focus ul {top: 37px; right: 40px} #container .viewPage .titleArea .d-day {font-size: 40px; font-family: "Lato","sans"; width: 100%; text-align: center; color: #007dc4; font-weight: 300; line-height: 1; margin-bottom: 7px} #container .viewPage .titleArea .d-day.end {font-family: "Noto Sans Korean"} #container .rec .writePage .period .wrap_pInput {position: relative; display: inline-block} #container .rec .writePage .period .wrap_pInput button {position: absolute; right: 9px; top: 9px} /*faq*/ #container .wrap_faq {margin-top: 47px; width: 100%; border-top: 2px solid #000} #container .wrap_faq div[class^='fqa']>div>span {position: absolute; left: 39px; top: 16px; font-family: "Lato","sans"; color: #007dc4; font-size: 18px; font-weight: 900} #container .wrap_faq .quest {font-size: 18px; font-weight: 600; border-bottom: 1px solid #c7c7c7; padding: 17px 92px 19px 74px; position: relative; height: 61px; box-sizing: border-box; cursor: pointer} #container .wrap_faq .quest>p {width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap} #container .wrap_faq .quest .arrow {width: 60px; height: 60px; background-position: -157px -499px; top: 0px; right: 13px; left: auto; cursor: pointer} #container .wrap_faq .anws {padding: 17px 40px 19px; position: relative; background-color: #f4f4f4; border-bottom: 1px solid #c7c7c7; width: 100%; box-sizing: border-box; display: none; zoom : 1} #container .wrap_faq .fqa .anws:after {clear: both; content: ''; display: block} #container .wrap_faq .fqa .anws>span {float: left; position: relative; top: auto; left: auto; margin-right: 22px} #container .wrap_faq .fqa .anws .a_cont {float: left; width: 95%} #container .wrap_faq .anws dt {font-weight: 600; font-size: 16px} #container .wrap_faq .anws dd {font-size: 16px; margin-bottom: 15px} #container .wrap_faq .anws p {font-size: 16px} #container .wrap_faq .fqa.active .quest .arrow, #container .wrap_faq .fqa_info.active .quest .arrow {background-position: -91px -499px} #container .wrap_faq div[class*='fqa'] .anws .btnM {position: relative; height: 50px; width: 100%} #container .wrap_faq div[class*='fqa'] .anws .btn_modify {position: absolute; width: 170px; height: 50px; background-color: #c7c7c7; line-height: 50px; text-align: center; display: inline-block; bottom: 10px; right: -21px; cursor: pointer} #container .wrap_faq div[class*='fqa'] .anws .btn_modify:hover, #container .wrap_faq div[class*='fqa'] .anws .btn_modify:active, #container .wrap_faq div[class*='fqa'] .anws .btn_modify:focus {text-decoration: none} /*-------고객의 소리----------*/ #container .bg.cst {background: url(/img/customer.jpg) no-repeat 50% top; } #container .cst .navi .menu:after {display: none} #container section.cst {padding: 99px 0 0 } #container .cst p[class^='exp'] {width: 640px; font-size: 40px; font-weight: 300; margin: 55px auto 0; position: relative; text-align: center; letter-spacing: -2px} #container .cst p[class^='exp']:before {width: 35px; height: 29px; content: ''; display: inline-block; background: url(/img/lt.png) no-repeat; position: absolute; left: 0; top: 12px} #container .cst p[class^='exp']:after {width: 35px; height: 29px; content: ''; display: inline-block; background: url(/img/gt.png) no-repeat; position: absolute; right: 0; top: 12px} #container .cst .s_exp {font-size: 18px; margin-top: 22px; width: 100%; text-align: center} #container .cst .info {border-top: 2px solid #000; padding: 17px 0; width: 100%; text-align: center; font-size: 18px; font-weight: 600; margin-top: 46px} #container .cst .infoArea {width: 100%; border: 1px solid #c7c7c7; box-sizing: border-box; height: 302px; padding: 18px 40px; font-size: 16px; background-color: #f4f4f4; overflow-y: auto; margin-bottom: 28px; } #container .cst .infoArea .sq {margin-bottom: 25px} #container .cst .infoArea .sq:before {width: 13px; height: 13px; background-color: #000; content: ''; display: inline-block; margin-right: 4px} #container .cst .infoArea dd, #container .cst dl {margin-bottom: 25px} #container .cst .infoArea dl dd table {margin-top: 30px; width: 100%; text-align: center;} #container .cst .infoArea dl dd table thead {border-top: 2px solid #000;} #container .cst .infoArea dl dd table th {padding: 8px 0; border-bottom: 1px solid #c7c7c7; border-right: 1px solid #c7c7c7; font-size: 18px;} #container .cst .infoArea dl dd table td {padding: 18px 0; font-size: 16px; border-bottom: 1px solid #c7c7c7; border-right: 1px solid #c7c7c7;} #container .cst .infoArea dl dd table th:last-child, #container .cst .infoArea dl dd table td:last-child {border-right: none;} #container .cst label {width: 100%; text-align: center; display: inline-block; font-size: 16px} #container .cst #ck {width: 22px; height: 22px; margin-right: 11px; vertical-align: bottom; display: inline-block} #container .cst #ck+span {font-size: 16px; vertical-align: top} #container .cst .bottom {width: 100%; background-color: #f4f4f4; box-sizing: border-box; padding: 64px 0; margin-top: 55px;} #container .cst .bottom .layout>p {text-align: right; font-size: 16px} #container .cst .bottom span {color: #007dc4; vertical-align: middle; display: inline-block; margin: 3px 10px 0 -1px} #container .cst .writePage {margin-top: 10px} #container .cst .writePage>div {padding: 10px 5px} #container .cst .writePage .cont {height: auto} #container .cst .writePage .th {width: 210px; text-align: left; font-weight: 600; margin-top: 8px; font-size: 18px; padding: 0 35px} #container .cst .writePage .tit input {font-size: 14px; font-weight: normal} #container .cst .bottom span {margin: 0 11px 0 0px} #container .cst .writePage .th:after {top: 13px; right: 3px} /* #container .cst .writePage .phone .th {padding: 0 0 0 52px} */ #container .cst .writePage .cont textarea {width: 100%; height: 160px; resize: none; border: 1px solid #c7c7c7; padding: 10px; box-sizing: border-box} #container .cst .writePage>div>div:last-child {width: 80%; padding: 0 0 0 17px} #container .cst .writePage>div>div:last-child>input {width: 100%; height: 40px; border: 1px solid #c7c7c7; box-sizing: border-box; padding-left: 10px} #container .cst .writePage .secu {height: auto} #container .cst .writePage .secu>div:last-child {zoom : 1} #container .cst .writePage .secu>div:last-child:after {clear: both; content: ''; display: block} #container .cst .writePage .secu img {width: 280px; height: 90px; float: left; margin-right: 10px} #container .cst .wrap_txt {float: left; width: 642px} #container .cst .writePage .secu {zoom : 1} #container .cst .writePage .secu:after {clear: both; content: ''; display: block} #container .cst .writePage .secu .wrap_sec {zoom : 1} #container .cst .writePage .secu .wrap_sec:after {clear: both; content: ''; display: block} #container .cst .writePage .secu .wrap_sec:first-child {margin-bottom: 10px} #container .cst .writePage .secu .wrap_sec>a, #container .cst .writePage .secu .wrap_sec .guide {float: left;} #container .cst .writePage .secu .wrap_sec>a {width: 40px; height: 40px; background-color: #c7c7c7; margin-right: 20px} #container .cst .writePage .secu .wrap_sec .btn_replay {background-position: -196px -452px} #container .cst .writePage .secu .wrap_sec .guide {font-size: 16px; margin-top: 5px} #container .cst .writePage .secu input {/*width: 576px !important*/ width: 100%; height: 40px; box-sizing: border-box; padding-left: 10px; border: 1px solid #c7c7c7} #container .cst .wrap_btn {padding: 50px 0 150px; margin-top: 28px; width: 100%; background-color: #f4f4f4;} #container .cst .btn_send {width: 170px; height: 50px; margin: 0 auto; background-color: #007dc4; text-align: center; line-height: 50px; font-size: 16px; font-weight: 500; display: block; cursor: pointer; color: #fff} #container .cst .btn_send:hover, #container .cst .bottom .btn_send:active, #container .cst .bottom .btn_send:focus {text-decoration: none} #container .cst p.exp02 {width: 616px } #container .cst .bottom.mt40 {margin-top: 40px; padding: 40px 0 150px} #container .cst .bottom .layout {zoom : 1} #container .cst .bottom .layout:after {clear: both; content: ''; display: block} #container .cst .bottom div[class^='box'] {width: 373px; height: 250px; margin-right: 40px; float: left; background-color: #fff; position: relative} #container .cst .bottom div[class^='box']:last-child {margin-right: 0} #container .cst .bottom div[class^='box'] .icon {display: block} #container .cst .bottom .box01 .icon {width: 65px; height: 85px; background-position: 0 -271px; margin: 48px auto 0} #container .cst .bottom .box02 .icon {width: 80px; height: 72px; background-position: -72px -271px; margin: 54px auto 0} #container .cst .bottom .box03 .icon {width: 62px; height: 73px; background-position: -157px -271px; margin: 53px auto 0} #container .cst .bottom div[class^='box'] p {width: 100%; text-align: center; position: absolute; font-size: 18px; font-weight: 400} #container .cst .bottom div[class^='box'] .txt {color: #007dc4; bottom: 71px} #container .cst .bottom div[class^='box'] .addr {bottom: 38px; font-family: "Lato","sans"} /*19.08.06 추가*/ #container .cst [type="radio"]:checked, [type="radio"]:not(:checked) {position: absolute; left: -9999px;} #container .cst [type="radio"]:checked + label, #container .cst [type="radio"]:not(:checked) + label {position: relative; padding-left: 22px; cursor: pointer; line-height: 20px; display: inline-block; color: #000; padding-top: 2px} #container .cst [type="radio"]:checked + label:before, #container .cst [type="radio"]:not(:checked) + label:before { content: ''; position: absolute; left: 0; top: 0; width: 26px; height: 26px; border: 3px solid #ddd; border-radius: 100%; background: #fff; box-sizing: border-box;} #container .cst [type="radio"]:checked + label:before, #container .cst [type="radio"]:checked + label:before {border-color: #007dc4} #container .cst [type="radio"]:checked + label:after, #container .cst [type="radio"]:not(:checked) + label:after { content: ''; width: 10px; height: 10px; background: #007dc4; position: absolute; top: 8px; left: 8px; border-radius: 100%; } #container .cst [type="radio"]:not(:checked) + label:after {opacity: 0;} #container .cst [type="radio"]:checked + label:after { opacity: 1;} #container .cst .bottom .radio p {display: inline-block; vertical-align: baseline; width: auto; margin-right: 50px; margin-top: 7px} #container .cst .bottom .radio p>input {font-size: 16px} /*개인정보처리방침*/ #container .wrap_faq .fqa_info .quest {padding: 17px 40px 19px} #container .wrap_faq .fqa_info .anws {font-size: 16px; overflow-y: scroll; position: relative; max-height: 610px; display: none} #container .wrap_faq .fqa_info .scroll {height: auto} #container .wrap_faq .fqa_info.active .anws {display: block} #container .wrap_faq .fqa_info .anws .scroll {position: relative} #container .wrap_faq .fqa_info .anws p {margin-bottom: 30px;} #container .wrap_faq .fqa_info .anws .sq {margin-top: 20px; position: relative; margin-bottom: 25px} #container .wrap_faq .fqa_info .anws .sq:before {width: 14px; height: 14px; background-color: #000; content: ''; display: inline-block; margin-right: 5px} #container .wrap_faq .fqa_info .anws ul {margin-bottom: 20px} #container .wrap_faq .fqa_info .anws dl {margin-bottom: 25px} #container .wrap_faq .fqa_info .anws dt {margin-bottom: 10px; font-weight: normal} #container .wrap_faq .fqa_info .anws dd {margin-bottom: 5px} #container .wrap_faq .fqa_info .anws dd.mb25 {margin-bottom: 25px} #container .wrap_faq .fqa_info .anws .btn_modify {right: 0 !important} /*----------영문----------*/ /*회사소개*/ .eng #container .comp .center .name {width: 970px; line-height: 1.4; letter-spacing: -1px} .eng #container .comp .wrap_link>a {padding-top: 134px} .eng #container .comp .wrap_link>a .eng {margin-top: 0; font-size: 30px; font-weight: 600} /*ceo 인사말*/ .eng #container .comp .intro {line-height: 1.4; letter-spacing: -1px} /*비전*/ .eng #container .comp .v_box {padding: 23px 70px; height: auto; line-height: 1.5} .eng #container .comp .v_img {width: 270px; height: 234px; background: url(/img/e_vision.png) no-repeat;} /*사업영역*/ .eng #container .digital .wrap_business {height: 730px; background: url(/img/e_digital.png) no-repeat} .eng #container .digital .wrap_business .m_slider .s02, .eng #container .digital .wrap_business .m_slider .s04 {top: 350px} .eng #container .digital .wrap_business .m_slider>li>span.long {top: -352px} .eng #container .digital .wrap_business .m_slider>li>span.long:after {height: 298px; background: url(/img/e_chain02.png) no-repeat} .eng #container .wrap_solution {height: 530px; background-size: cover} .eng #container .mobile .wrap_solution {height: 686px} .eng #container .wrap_solution .solution .slide-number {bottom: 0} .eng #container .wrap_solution .indicator {height: 530px} .eng #container .mobile .wrap_solution .indicator {height: 686px} .eng #container .wrap_good {padding: 90px 0 60px; height: auto} .eng #container .wrap_good div[class^="box0"] {height: 235px} .eng #container .wrap_good {padding: 48px 0 50px} .eng #container .wrap_solution .indicator ul>li {padding: 13px 0 13px 40px; height: auto; line-height: 1.5} .eng #container .bis .wrap_good .wrap_box div[class^='box']>p {width: auto} .eng #container .cloud .btn_go.first {width: 350px} .eng #container .cloud .wrap_service {height: auto} .eng #container .cloud .wrap_service .service {height: 145px} @media screen and (max-width : 640px){ /*common*/ #container .bg {display: none} #container section {padding-top: 0px} #container .tit {font-size: 22px} .pb150 {padding-bottom: 75px} .layout.m_pd0 {padding: 0} body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,legend,textarea,p,th,td,input,select,button {line-height: 1.4} .tabs.tab02>li{width: 50%} .tabs.tab03>li{width: 399px} .tabs.tab04>li{width: 25%} #container section>.tit {min-width: auto; height: 65px; line-height: 65px; letter-spacing: -0.5px} /*------회사소개------*/ /*회사소개*/ #container .comp .name {font-size: 19px; margin-top: 0px; height: auto; width: 100%} #container .comp .name:before {width: 19px; height: 15px; background: url(/img/m_lt.png) no-repeat; background-size: contain; left: 54px; top: 0} #container .comp .name:after {width: 17px; height: 15px; background: url(/img/m_gt.png) no-repeat; background-size: contain; right: 54px; top: 0px} #container .comp .c_exp {margin-top: 15px; font-size: 14px} #container .comp .wrap_box {margin: 15px 0 50px } #container .comp .wrap_box p {width: auto; text-align: left} #container .comp .center {background-size: cover; padding-top: 35px; height: auto; padding-bottom: 30px;} #container .comp .center .name {width: 100%; font-size: 19px; height: auto} #container .comp .center .name:before {background-size: contain; top: 5px; left: 25px} #container .comp .center .name:after {background-size: contain; right: 26px; top: 5px} #container .comp .center .exp {font-size: 14px; margin-top: 15px} #container .comp .center + article {padding: 50px 0 75px} #container .comp .secTit {margin-bottom: 18px} #container .comp .wrap_link>a {position: relative; display: flex; justify-content: center; align-items: center; padding-top: 0; height: 180px; width: 33%;} #container .comp .wrap_link .l01 {background: url(/img/m_link01.jpg) no-repeat 50% top; background-size: cover} #container .comp .wrap_link .l02 {background: url(/img/m_link02.jpg) no-repeat 50% top; background-size: cover} #container .comp .wrap_link .l03 {background: url(/img/m_link03.jpg) no-repeat 50% top; background-size: cover} #container .comp .wrap_link .l04 {background: url(/img/m_link04.jpg) no-repeat 50% top; background-size: cover} #container .comp .wrap_link .l05 {background: url(/img/m_link03.jpg) no-repeat 50% top; background-size: cover} /* #container .comp .wrap_link>a .tit {margin-bottom: 0; font-size: 17px; word-break: keep-all;} */ #container .comp .wrap_link>a .tit {font-size: 17px; word-break: keep-all;} #container .comp .wrap_link>a .eng {position: absolute; left: 0; bottom: 40px; font-size: 14px} /*ceo 인사말*/ /*#container .comp .bottom.half {height: 440px}*/ #container .comp .ceoImg {width: 186px; height: 155px; background: url(/img/m_ceo.png) no-repeat; background-size: cover; top: 1px; left: -1px} #container .comp .wrap_intro {width: 171px; /*margin: 11px 0 11px 126px;*/ margin-left: 50%; padding-bottom: 25px; float: left; } #container .comp .wrap_intro .intro {font-size: 17px; float: left; margin: 0; width: auto; } #container .comp .wrap_intro .c_name {margin-top: 27px; font-size: 10px; font-weight: 500;; position: absolute; bottom: -30px} #container .comp .wrap_intro .c_name .sign {width: 42px; height: 21px; background: url(/img/m_sign.png) no-repeat; background-size: cover; margin-left: 8px; display: inline-block; line-height: 999999; overflow: hidden; vertical-align: text-bottom} #container .comp .bottom .c_txt {width: 100%; font-size: 14px; /*margin-top: 12px;*/ transform: translateX(10px)} #container .comp .bottom .c_txt>p {margin-bottom: 5px; line-height: 1.65} /*연혁*/ #container .tab_area .v-line {display: none} #container .tabs {height: 35px; margin-top: 15px} #container .tabs>li {width: 33.3%; height: 100%; } #container .tabs>li>a {font-size: 14px; line-height: 35px} #container .fund .tabs>li:last-child>a {font-size: 13px; line-height: 1.3;} #container .tab_area {margin-top: 35px;} #container .comp .tab_area {padding-bottom: 75px} #container .tab_area .line, #container .tab_area #tab_content1 .line:first-child {margin-bottom: 30px} #container .tab_area .year {padding: 0; float: none; width: auto; font-size: 36px} #container .tab_area .year:after {display: none} #container .tab_area .cont {margin-top: 10px; float: none; width: 100%; margin-left: 0 } #container .tab_area .cont {padding: 0 !important} #container .tab_area .cont .list {font-size: 14px; padding-left: 37px} #container .tab_area .cont ul>li {margin-bottom: 6px} #container .tab_area .cont .award {width: 100%; margin-left: 0; height: auto; font-size: 14px; position: relative; min-height: 45px; padding: 12px 10px 14px 37px; line-height: 1.4} #container .tab_area .cont .award.line-2 {line-height: 1.4; /*padding: 14px 10px 12px 37px*/} #container .tab_area .cont .award.line-3 {line-height: 1.4; /*padding: 14px 10px 18px 37px*/} #container .tab_area .line .cont .list + .award, #container .tab_area .line .cont>ul + .award {margin-top: 15px} #container .tab_area .line .cont .list.line-2 + .award {margin-top: 11px} #container .tab_area .cont .award .ad {font-size: 12px; display: block; margin-left: 0; margin-top: 5px} #container .tab_area .cont .award .icon {position: absolute; top: 15px; left: 10px; margin: 0; width: 18px; height: 19px; background-position: -100px 0} /*비전*/ #container .secTit {font-size: 18px; margin-bottom: 18px} /*#container .comp .secTit.mt60 {margin-top: 31px }*/ #container section>.tit + .layout>.secTit {margin-top: 13px} #container .comp .v_box {margin-top: 17px; margin-bottom: 50px; border-width: 4px; line-height: 1.6; font-size: 16px; padding: 14px 24px; height: auto; word-break: keep-all} #container .comp .v_img {width: 320px; height: 328px; background-size: contain; background: url(/img/m_vision.png) no-repeat 50% top; background-size: cover; padding-bottom: 0; margin: 17px auto 75px} /*환경경영*/ #container .comp .e_img {height: auto; margin-top: 16px; max-height: 500px; background: url(/img/m_enviroment.jpg) no-repeat 50% top; width: 100%; background-size: cover} #container .comp .e_img:after {content: ''; display: block; padding-bottom: 120%} #container .comp .e_bottom {padding: 47px 0 75px} #container .comp .e_box {padding: 23px 19px 25px; font-size: 14px; margin-top: 1px} #container .comp .e_box:last-child {padding: 23px 7px 25px} #container .comp .e_list {margin: 20px 0 18px} #container .comp .e_list>li {font-size: 13px; margin-bottom: 9px; padding-left: 30px} #container .comp .e_list>li .num {font-size: 13px; width: 20px; height: 20px; line-height: 18px; top: 0} /*오시는 길*/ #container .map {height: 302px; margin-top: 0} #container .comp .address {width: 100%; height: auto; min-width: auto; padding: 14px 0px; margin-top: -15px; margin-bottom: 15px} #container .comp .address .m_list {width: 100%} #container .comp .address .m_list:first-child {margin-bottom: 30px} #container .comp .address .m_list p {font-size: 14px; float: none; padding: 0 15px} #container .comp .address .m_list .th + p {line-height: 1.6} #container .comp .address .m_list ul {float: none; padding-left: 15px; } #container .comp .address .m_list ul>li {margin-right: 20px; font-size: 14px} #container .comp .address .m_list ul>li:first-child:after {height: 8px; right: -14px; top: 6px} #container .comp .bottom {height: auto; padding-bottom: 75px} #container .comp .bottom.infos div[class^='box'] {width: 100%; margin-right: 0; float: none; margin-bottom: 15px; height: 70px; box-sizing: border-box; zoom : 1; padding: 14px; } #container .comp .bottom.infos div[class^='box']:after {clear: both; content: ''; display: block} #container .comp .bottom.infos div[class^='box']:last-child {margin-bottom: 0} #container .comp .bottom.infos div[class^='box'] .m_cont {float: left; width: 75%; } #container .comp .bottom.infos .box01 .m_cont {margin-left: 20px} #container .comp .bottom.infos .box02 .m_cont {margin-left: 18px} #container .comp .bottom.infos .box03 .m_cont {margin-left: 21px} #container .comp .bottom.infos div[class^='box'] .icon {float: left} #container .comp .bottom.infos .box01 .icon {width: 24px; height: 31px; background-position: -238px -287px; margin-top: 5px; margin-left: 3px} #container .comp .bottom.infos .box02 .icon {width: 29px; height: 26px; background-position: -238px -322px; margin-top: 8px} #container .comp .bottom.infos .box03 .icon {width: 23px; height: 26px; background-position: -238px -353px; margin-top: 7px; margin-left: 3px} #container .comp .bottom.infos div[class^='box'] p {font-size: 14px !important} #container .comp .bottom.infos div[class^='box'] .txt {position: relative; bottom: auto; text-align: left} #container .comp .bottom.infos div[class^='box'] .addr {position: relative; bottom: auto; margin-top: 3px; text-align: left; font-weight: 500} #container .comp .address .m_list .th {margin-bottom: 8px} #container .comp .address .m_list .th .icon1 {width: 23px; height: 24px; background-position: -126px 0; margin-left: 4px; margin-top: -4px} #container .comp .address .m_list .th .icon2 {width: 23px; height: 23px; background-position: -154px 0px; margin-left: 3px; margin-top: -2px} /*------투자정보--------*/ /*이사회 및 위원회*/ #container .fund .cate {margin: 12px 0 18px} #container .fund .j_box {height: auto; padding: 14px 5px; min-height: 370px;} #container .fund .j_box>.th {padding-top: 0} #container .fund .j_box>.th>p>span {font-size: 18px} #container .fund .j_box>.th .period {font-size: 14px; margin-top: 2px} #container .fund .j_box .cont {width: 100%} #container .fund .j_box .cont .detail {padding: 5px;} #container .fund .j_box .cont .detail:nth-child(2) {padding: 5px} #container .fund .j_box.mb100 {margin-bottom: 50px !important} #container .fund .bottom {padding: 47px 0 75px} #container .fund .bottom.pb0 {padding-bottom: 50px !important} #container .fund .bottom .wrap_j {float: none; margin-right: 0} #container .fund .bottom .j_box {margin-bottom: 23px} #container .fund .outside {padding: 47px 0 75px} #container .fund .caption {font-size: 19px} /* #container .fund table {margin-top: 18px; margin-bottom: 50px;} */ #container .fund table {margin-top: 18px; margin-bottom: 20px;} #container .fund table td, #container .fund table th {font-size: 12px; height: auto !important; } #container .fund table td {padding: 9px 2px;} #container .fund table td:first-of-type{font-size: 12px !important;} #container .fund .outside table td {word-break: break-all} #container .fund table#tradedPrice_day td.ta_l {padding-left: 5px} /*주주 총회*/ #container .fund table.stock td {padding: 9px 2px} #container .fund table.stock td.ta_l {padding-left: 5px} #container .fund table.stock td.ta_l.pl50 {padding-left: 5px} #container .fund .m_overflow {width: 100%; overflow-x: scroll} #container .fund table.stock {width: 600px} /*관련 규정*/ #container .fund .tab_area {margin-top: 35px} #container .fund .tab_area h3 {height: 40px; line-height: 40px; font-size: 18px} #container .fund .tab_area .border_box {padding: 14px 5px; font-size: 14px} #container .fund .tab_area h4 {font-size: 14px} #container .fund .tab_area .border_box ul>li>ul {padding-left: 10px} /*주식공시정보*/ #container .fund .graph {height: 300px; margin-bottom: 25px} #container .fund .s_exp {font-size: 14px; margin-top: 6px} #container .fund table#stockInfo {margin-bottom: 50px} #container .fund table#stockInfo th {font-size: 12px; padding-left: 5px} #container .fund table#stockInfo th:after {right: -11px; height: 8px; top: 14px} #container .fund .stock + .tab_area {margin-bottom: 50px} #container .fund table#disInfo td.ta_l {padding-left: 10px} #container .fund ul.stock {margin-bottom: 25px} #container .tabs.tab04 {height: 70px} #container .tab04>li {width: 50%; height: 50%} #container .tab04>li:nth-child(3) {border-left: 1px solid #3c414b; border-top: none} #container .tab04>li:nth-child(4) {border-top: none} #container .fund table td .down {width: 14px; height: 8px} #container .fund table td .up {width: 14px; height: 8px} #container .fund table td .bohab {width: 14px; height: 8px} #container .fund #tradedPrice_day {width: 410px} /*재무배당정보*/ #container .fund .caption.first {margin-top: 13px; margin-bottom: 18px} #container .fund h4 {font-size: 16px; margin-bottom: 5px; margin-top: 6px} #container .fund h4 + .m_overflow>table {margin-top: 14px; margin-bottom: 25px} #container .fund h4 + .m_overflow>table th {font-size: 14px} #container .fund h4 + .m_overflow>table tr:last-child>th {font-size: 5px} #container .fund h4 + .m_overflow>table tr:last-child>th:after {height: 6px; } /*07.10 추가*/ #container .fund h4 + .m_overflow {width: 100%; overflow-x: scroll} #container .fund h4 + .m_overflow>table {width: 650px} #container .fund h4 + .m_overflow:last-child>table {margin-bottom: 50px} /*---------사업영역--------*/ /*디지털*/ #container .bis .t_exp {font-size: 16px; line-height: 1.5; margin-top: -3px; letter-spacing: -0.9px; word-break: keep-all;} #container .bis .wrap_business {margin-top: 44px; padding-top: 47px; height: 360px;} #container .digital .wrap_business {background: url(/img/m_di.jpg) no-repeat 50% top; background-size: cover} #container .bis .wrap_business>.layout {padding: 0 35px} #container .wrap_business .secTit {margin-bottom: 27px} #container .wrap_business .line {width: 100%; margin-top: 62px} #container .wrap_business .bx-wrapper {margin-top: -37px} #container .wrap_business .bx-wrapper .bx-viewport {height: 100% !important} #container .wrap_business .m_slider {left: 0; top: 0} #container .wrap_business .m_slider>li {width: 100%; height: 100%; font-size: 14px; left: auto !important; top: auto !important; margin-top: 85px;} #container .wrap_business .m_slider>li>span, #container .wrap_business .m_slider>li>span.long {font-size: 15px; margin-left: 0 !important; top: -84px} #container .wrap_business .m_slider>li>span:after, #container .wrap_business .m_slider>li>span.long:after {width:14px; height: 41px; background: url(/img/m_chain.png) no-repeat; background-size: contain; top: 28px} #container .wrap_business .wrap_btn {display: block} #container .wrap_business .wrap_btn>button {position: absolute; top: 70px; width: 35px; height: 35px; background-color: rgba(0,0,0,0.5)} #container .wrap_business .wrap_btn .btn_prev {left: 0; background-position: -12px -26px} #container .wrap_business .wrap_btn .btn_next {right: 0; background-position: -50px -26px} #container .wrap_solution {height: auto; background: url(/img/m_digi_02.jpg) no-repeat 50% top} #container .wrap_solution>.layout {padding: 0} #container .wrap_solution .bx-wrapper {height: auto !important} #container .wrap_solution .solution>div {padding-top: 0px; height: auto} #container .wrap_solution .solution>div p {margin-left: 0; width: 100%; padding: 0 15px; box-sizing: border-box} #container .wrap_solution .solution>div .chapter {font-size: 16px; padding: 28px 15px } #container .wrap_solution .solution .m_cont {width: 100%; background-color: #3b414b; padding: 14px 0 69px;} #container .wrap_solution .solution>div .tit {font-size: 20px; margin-top: 0} #container .wrap_solution .solution>div .exp {font-size: 14px; margin-top: 15px; width: 100%} #container .wrap_solution .solution .slide-number {font-size: 12px; letter-spacing: 0.5px; margin-left: 15px; bottom: 11px;} #container .wrap_solution .indicator {width: 160px; height: 35px !important; right: 15px; top: 20px; left: auto; padding-top: 0; background: none} #container .wrap_solution .indicator>a {display: block; font-size: 14px; font-weight: 600; display: inline-block; width: 100%; height: 100%; padding-left: 15px; line-height: 33px; box-sizing: border-box; color: #fff; position: relative; background-color: rgba(0,0,0,0.3)} #container .wrap_solution .indicator>a:after {content: ''; border-top: 4px solid #fff; border-left: 4px solid transparent; border-right: 4px solid transparent; position: absolute; right: 15px; top: 15px} #container .wrap_solution .indicator>a.active {background-color: rgba(0,0,0,1)} #container .wrap_solution .indicator>a.active:after {border-top: none; border-bottom: 4px solid #fff} #container .wrap_solution .indicator>a:hover, #container .wrap_solution .indicator>a:focus, #container .wrap_solution .indicator>a:active {text-decoration: none} #container .wrap_solution .indicator ul {padding-top: 13px; background-color: #fff; height: 222px; box-sizing: border-box; display: none; z-index: 50; position: relative} #container .wrap_solution .indicator ul>li {padding: 0 15px; font-size: 14px; margin-bottom: 6px; color: #000; height: auto; line-height: 1.4} #container .wrap_good {padding-top: 48px; height: auto; padding-bottom: 50px} #container .wrap_good .secTit {margin-bottom: 0px} #container .wrap_good .wrap_box {margin-top: 18px} #container .wrap_good div[class^="box0"] {width: 100%; padding: 23px 20px 21px 77px; height: auto !important; margin-right: 0; margin-bottom: 15px} #container .wrap_good div[class^="box0"] .icon {margin-top: 0 !important} #container .wrap_good .box01 .icon {width: 38px; height: 44px; background-position: 0 -114px; top: 25px; left: 19px} #container .wrap_good .box02 .icon {width: 44px; height: 44px; background-position: -42px -114px; top: 25px; left: 17px} #container .wrap_good .box03 .icon {width: 48px; height: 42px; background-position: -89px -114px; top: 26px; left: 16px} #container .wrap_good .box04 .icon {width: 46px; height: 44px; background-position: -139px -114px; top: 26px; left: 16px} #container .wrap_good .wrap_box .g_tit {font-size: 14px; margin-bottom: 5px; left: auto; margin-top: 0} #container .wrap_good .wrap_box .g_exp {font-size: 14px; left: auto; margin-top: 0; line-height: 1.5} #container .wrap_aco {padding: 48px 0 75px} #container .wrap_aco .accodian {margin-top: 16px} #container .wrap_aco .accodian .acc_btn {display: block; width: 100%; height: 35px; text-align: center; line-height: 31px; font-size: 13px; border: 2px solid #000} #container .wrap_aco .accodian .acc_btn>span {width: 9px; height: 5px; background-position: -100px -93px; margin-left: 9px; margin-top: 14px} #container .wrap_aco .accodian .acc_btn.active>span {background-position: -114px -93px} #container .wrap_aco .accodian .acc_cont {width: 100%; display: none} #container .wrap_aco .accodian .acc_cont div[class*='r'] {width: 30%; height: 30px; margin-right: 9px; margin-bottom: 20px; background-size: contain; background-position: 50% top} #container .wrap_aco .accodian .acc_cont div[class*='r']:nth-child(3n+3) {margin-right: 0 !important} #container .wrap_aco .accodian .acc_cont div[class*='r']:nth-child(5n+5) {margin-right: 9px} #container .bis .floating_btn {min-width: auto} #container .bis .floating_btn.off {position: absolute} #container .bis .floating_inner {bottom: 25px; right: 15px} #container .bis .floating_inner2 {bottom: 75px; right: 15px;} #container .bis .floating_btn.off .floating_inner {bottom: 25px} #container .bis .floating_btn.off .floating_inner2 {bottom: 75px;} #container .bis .btn_ask {width: 40px; height: 40px; padding: 0;} #container .bis .btn_ask:before {background: url(/img/m_sp_com.png) -369px -211px; background-size: 400px 450px; width: 24px; height: 19px; left: 9px; top: 10px} #container .bis .btn_ask:hover:before, #container .bis .btn_ask:focus:before, #container .bis .btn_ask:active:before {background-position: -369px -235px} #container .bis .btn_news {width: 40px; height: 40px; padding: 0;} #container .bis .btn_news:before {background: url(/img/icon_news.png) no-repeat; background-size: contain; width: 24px; height: 20px; left: 8px; top: 11px} #container .bis .btn_news:hover:before, #container .bis .btn_news:focus:before, #container .bis .btn_news:active:before {background: url(/img/icon_news2.png) no-repeat} /*인공지능*/ #container .ai .t_exp {margin-top: -3px} #container .ai .wrap_business {background-size: cover; margin-top: 50px} #container .ai .wrap_business .m_slider>li>span, #container .ai .wrap_business .m_slider>li>span.long {top: -86px} #container .ai .wrap_business .m_slider>li>span:after, #container .ai .wrap_business .m_slider>li>span.long:after {top: 31px} #container .ai .wrap_solution {background-size: contain; height: auto} /* #container .ai .wrap_solution .indicator ul {height: 142px} */ #container .ai .wrap_solution .solution>div {padding-top: 0px} #container .ai .wrap_solution .solution>div .exp {width: 100%; margin-top: 11px} #container .ai .wrap_good {height: auto; padding-top: 47px} #container .wrap_good div[class^="box0"] {left: auto; top: auto; margin-top: 0; padding: 23px 20px 19px 77px } #container .ai .wrap_good .box01 .icon {width: 47px; height: 47px; background-position: -89px -114px; top: 25px; left: 16px;} #container .ai .wrap_good .box02 .icon {width: 48px; height: 46px; background-position: -190px -114px; top: 25px; left: 16px;} #container .ai .wrap_good .box03 .icon {width: 44px; height: 44px; background-position: -43px -114px; top: 25px; left: 17px;} #container .ai .wrap_good .box04 .icon {width: 46px; height: 44px; background-position: -139px -114px; top: 25px; left: 16px;} #container .ai .wrap_aco.ref {padding-bottom: 51px} #container .ai .wrap_aco .accodian {margin-top: 16px} #container .ai .wrap_aco.partner {padding: 46px 0 75px} #container .ai .wrap_aco.partner .acc_cont div[class*='r'] {background-size: cover; background-position: 50% top} #container .ai .btn_go {width: 180px; height: 35px; font-size: 13px; line-height: 31px; border-width: 2px; padding-left: 11px; margin: 27px auto 0 !important; display: block} #container .ai .btn_go.popup-youtube {margin-top: 15px !important} #container .ai .btn_go>span {width: 12px; height: 9px; right: 10px; top: 12px; background-position: -179px -40px} #container .ai .btn_go:hover>span {background-position: -62px -40px} /*popup*/ .mfp-container {padding-left: 0 !important; padding-right: 0 !important} .mfp-iframe-holder .mfp-content {min-width: auto; height: 180px} .mfp-close-btn-in .mfp-close {background: url(/img/m_close.png) no-repeat 98% top; background-size: cover; right: 15px; top: -35px} /*iframe*/ #container .ai .ai_video {position: relative; width: 100%; height: auto; margin: 35px auto 0} #container .ai .ai_video:before {content: ''; display: block; padding-top: 56%;} #container .ai .ai_video iframe {position: absolute; top: 0; right: 0; bottom: 0; left: 0;} /*클라우드*/ #container .cloud .wrap_business {background-size: cover; margin-top: 50px; height: 393px} #container .cloud .wrap_business .m_slider .s02>span {top: -83px} #container .cloud .wrap_solution {height: auto; background-size: contain; background-position: 50% -11px} #container .cloud .wrap_solution .solution .slide-number {bottom: 11px} #container .cloud .wrap_solution .indicator {height: 35px} #container .cloud .wrap_solution .indicator ul {height: 74px} #container .cloud .wrap_solution .solution>div {height: auto } #container .cloud .wrap_solution .solution>div .exp {width: 100%} #container .cloud .wrap_service {padding: 30px 0 27px; height: auto} #container .cloud .wrap_service .services {margin-top: 14px} #container .cloud .wrap_service .service {width: 100%; float: none; margin-right: 0; height: auto; margin-bottom: 20px } #container .cloud .wrap_service .service.mb {margin-bottom: 20px} #container .cloud .wrap_service .service>p {display: block} #container .cloud .wrap_service .service .th {width: 100%; font-size: 13px; margin-right: 0; margin-bottom: 8px} #container .cloud .wrap_service .service .exp {font-size: 13px; width: 100%; margin-top: 0; line-height: 1.54} #container .cloud .wrap_good div[class^="box0"] {padding: 23px 20px 24px 77px} #container .cloud .wrap_good .box01 .icon {width: 40px; height: 41px; background-position: -42px -163px; top: 25px; left: 19px} #container .cloud .wrap_good .box02 .icon {width: 39px; height: 41px; background-position: -88px -163px; left: 19px; top: 27px} #container .cloud .wrap_good .box04 .icon {width: 44px; height: 44px; background-position: -43px -114px; top: 25px; left: 17px} #container .cloud .wrap_good .wrap_box .g_tit {margin-bottom: 3px} #container .cloud .wrap_aco {padding-bottom: 49px} #container .cloud .wrap_aco.partner {padding: 48px 0 75px} #container .cloud .wrap_aco.partner .accodian .r01 {background-size: cover} #container .cloud .wrap_aco.partner .accodian .r02 {background-size: cover} #container .cloud .wrap_aco.partner .accodian .r03 {background-size: cover} #container .cloud .wrap_aco.partner .accodian .r04 {background-size: cover} #container .cloud .wrap_aco.partner .accodian .r05 {background-size: cover} #container .cloud .btn_go {width: 180px; height: 35px; font-size: 13px; line-height: 31px; border-width: 2px; padding-left: 11px; margin: 15px auto 0 !important} #container .cloud .btn_go.popup-youtube {margin-top: 15px !important} #container .cloud .btn_go>span {width: 12px; height: 9px; right: 10px; top: 13px; background-position: -179px -40px} #container .cloud .btn_go:hover>span {background-position: -62px -40px} /*모바일*/ #container .mobile.bis .t_exp { margin-top: -4px; line-height: 1.5} #container .mobile .wrap_solution {height: auto; margin-top: 47px} #container .mobile .wrap_solution .solution>div {height: auto} #container .mobile .wrap_solution .solution>div .exp {margin-top: 7px; width: 100%} #container .mobile .wrap_solution .solution .slide-number {bottom: 11px} #container .mobile .wrap_solution .indicator {height: 35px} #container .mobile .wrap_solution .indicator ul {height: 342px} #container .mobile .wrap_solution .indicator ul>li {height: auto; line-height: 1.4} #container .mobile .wrap_good {height: auto} #container .mobile .wrap_good div[class^="box0"] {padding: 23px 12px 22px 77px} #container .mobile .wrap_good .box01 .icon {width: 44px; height: 44px; background-position: -139px -163px; top: 25px; left: 17px} #container .mobile .wrap_good .box02 .icon {width: 43px; height: 42px; background-position: -190px -163px; top: 25px; left: 17px} #container .mobile .wrap_good .box03 .icon {width: 44px; height: 44px; background-position: -43px -114px; top: 25px; left: 17px} #container .mobile .wrap_good .wrap_box .g_tit {margin-bottom: 3px} #container .mobile .wrap_aco {padding-bottom: 50px} #container .mobile .wrap_aco.partner {padding: 46px 0 75px} #container .mobile .wrap_aco.partner .accodian .r01 {background-size: cover} #container .mobile .wrap_aco.partner .accodian .r02 {background-size: cover} #container .mobile .wrap_aco.partner .accodian .r03 {background-size: cover} /* 클라우드 솔루션(23.02 추가) */ #container .solution .wrap_business {background: url(/img/m_solution01.png) no-repeat 50% top; background-size: cover;} #container .solution .wrap_business .line {display: block;} #container .solution .wrap_business .m_slider li>span {top: -84px !important; left: 0 !important; width: 100% !important; font-size: 15px !important;} #container .solution .wrap_business .m_slider li>span:after {top: 29px !important; left: 50% !important; margin-left: -4px; height: 41px !important; transform: rotate(0) !important;} #container .solution .wrap_business .m_slider .s01 {text-align: left;} #container .solution .wrap_business .m_slider .s02 {right: auto} #container .solution .wrap_business .m_slider .s03 {margin-left: 0} #container .solution .wrap_solution .indicator {width: 200px;} #container .solution .wrap_solution .indicator ul>li {padding: 0 15px;} #container .solution .wrap_solution .indicator>a {font-size: 13px;} #container .solution .wrap_good div[class^="box0"] {padding: 65px 20px 20px 24%;} #container .solution .wrap_good .box02 {padding-top: 85px !important;} #container .solution .wrap_good .box01 .icon {top: 23px; left: 6%; width: 41.5px; height: 48.5px; background-position: -316px 0;} #container .solution .wrap_good .box02 .icon {top: 22.5px; left: 5.3%; width: 47.5px; height: 43px; background-position: -89.5px -114px;} #container .solution .wrap_good .box03 .icon {top: 20px; left: 7.5%; width: 36px; height: 54.5px; background-position: -316px -148px;} #container .solution .wrap_good .box04 .icon {top: 25px; left: 5%; width: 38px; height: 45px; background-position: 0 -114px;} #container .solution .wrap_good .wrap_box .g_question {top: 20px; left: 24%; padding-right: 20px; font-size: 13px; font-weight: normal;} #container .solution .wrap_good img {margin-top: 20px; width: 100%;} #container .solution .wrap_good img:nth-of-type(1) {margin-bottom: 50px;} #container .solution .wrap_good .secExp {margin-top: 20px; font-size: 20px;} /*--------PR---------*/ /*공지사항*/ #container .board {margin-top: 0px} #container .board .th {display: none} #container .board .b_list {padding: 15px 5px; position: relative; height: auto} #container .board .b_list>p, #container .board .b_list.admin>p {float: none; font-size: 14px; display: inline-block; width: auto;} #container .board .b_list>p:first-child, #container .board .b_list.admin>p:first-child {width: 100%; margin-bottom: 9px} #container .board .b_list.no-list>p {margin-bottom: 0} #container .board .b_list>p>a, #container .board .b_list.admin>p>a {font-size: 16px; padding-left: 0; width: 100%; max-height: 43px; white-space: normal; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; word-wrap: break-word} #container .board .b_list .date {position: relative; margin-right: 23px;} #container .board .b_list.admin .date:after {position: absolute; content: ''; width: 2px; height: 9px; background-color: #c7c7c7; display: inline-block; right: -15px; top: 5px} #container .board .b_list .view>span {display: inline-block !important; margin-right: 6px} #container .pager {margin-top: 25px} #container .pager a {width: 35px; height: 35px; line-height: 35px; font-size: 12px} #container .pager .prev {background-position: -130px -26px; margin-right: 19px} #container .pager .next {background-position: -167px -26px; margin-left: 19px} #container .select {width: 100%; margin-top: 40px; height: 33px} #container .select .sch {width: 84px; height: 33px; background: url(/img/m_b_arrow.png) no-repeat 85% 54%; padding: 7px 11px; font-size: 14px; background-size: 13%} #container .select .sch>li>a {font-size: 14px; line-height: 14px} #container .select .sch-list {top: 33px} #container .select .sch-list>li {padding: 9px 11px} #container .select input {width: 63%} #container .select .btn_sch {width: 33px; height: 33px; background-position: -205PX -26px; right: 0px; top: 0px} #container .viewPage {margin-top: 0px} #container .viewPage .titleArea {padding: 15px 5px} #container .viewPage .titleArea .tit {font-size: 17px;} #container .viewPage .titleArea ul {margin-top: 9px} #container .viewPage .titleArea ul>li {font-size: 12px; padding: 0 15px} #container .viewPage .titleArea ul>li:after {top: 5px; right: -3px} #container .viewPage .contArea {padding: 12px 5px 100px} #container .viewPage .contArea .cont {font-size: 14px; word-break: break-all;} #container .viewPage .contArea .cont img {width: 100% !important} #container .viewPage .contArea .cont table {width: 100%} #container .viewPage .contArea>p {font-size: 12px} #container .viewPage .fileArea {padding: 13px 5px} #container .viewPage .fileArea>a {font-size: 12px} #container .viewPage .fileArea .file>span {width: 19px; height: 16px; background-position: -25px -93px; margin-right: 8px} #container .listBtn {margin-top: 25px} #container .listBtn>a {width: 35px; height: 35px; position: absolute} #container .listBtn .prev {left: 0} #container .listBtn .next {left: 45px} #container .listBtn .next.no-prev {left: 0} #container .listBtn>a>span {width: 35px !important; height: 35px !important; margin: 0 !important} #container .listBtn .prev .sp_com {background-position: -130px -26px} #container .listBtn .next .sp_com {background-position: -168px -26px} #container .listBtn .m_Non {display: none} #container .listBtn .go_list {width: 100px; height: 35px; line-height: 35px; font-size: 12px} #container .listBtn .modify, #container .listBtn .delete {width: 100%; height: 35px; line-height: 35px; font-size: 12px; position: relative; margin-bottom: 5px} #container .listBtn .modify {right: 0; margin-top: 50px} #container .listBtn .delete {right: 0} #container .writePage {margin-top: 0} #container .writePage>div {padding: 10px 0; height: auto} #container .writePage>div>div {float: none;} #container .writePage .th {padding: 0 10px 0 0; width: auto; margin-bottom: 5px} #container .writePage .th:after {display: none} #container .writePage>div>div:last-child {padding: 0} #container .writePage input[id*='ck'] {width: 15px; height: 15px; vertical-align: middle; margin-right: 5px} #container .writePage input[id*='ck']+span {vertical-align: middle} #container .writePage .title .th+div {width: 100%} #container .writePage .date .calender {width: 100%} #container .writePage div.editor {padding: 10px 0} #container .writePage .file .th+div {padding: 0} #container .writePage .filelist {margin-bottom: 10px} #container .writePage .filelist>input {width: 98.5%;} #container .writePage .file .exp {font-size: 12px; right: 0; top: 18px} #container .writeBtn {margin-top: 25px} #container .writeBtn>a {width: 31%; margin-right: 5px; height: 40px; line-height: 40px; font-weight: 14px} #container .writePage .file .plus {top: 25px; background-position: -168px -64px; width: 29px; height: 29px} #container .writePage .filelist .delete {width: 15px; height: 15px; background-position: -77px 0; margin-top: 4px; margin-left: 5px} #container .writePage .filelist #thumTag + .delete {margin-left: 8px; margin-top: 9px} /*19.07.04 추가*/ #container .listBtn .next .m_Non.no-prev {left: 0} /*언론보도*/ #container .wrap_listBox {margin-top: 0px; } #container .listBox {padding: 25px 5px 21px} #container .listBox>div {float: none} #container .listBox div[class*='thum'] {width: 100%; height: 185px;} /*#container .listBox .thum01, #container .listBox .thum02, #container .listBox .thum03 {background: url(/img/m_p_thum.png) no-repeat; background-size: cover}*/ #container .listBox img[class*='thum'] {width: 100%; height: auto} #container .listBox .textArea {margin-top: 13px; width: 100%} #container .listBox .tit {font-size: 16px; width: 100%; height: auto} #container .listBox .cont {display: none} #container .listBox ul {margin-top: 8px;} #container .listBox ul>li {font-size: 14px} #container .listBox ul>li:first-child {margin-right: 24px;} #container .listBox ul>li:first-child:after {right: -14px; height: 9px; top: 4px} #container .listBox .btn_detail {display: none} /*----------채용정보-----------*/ /*인재상*/ #container .rec .s_tit {margin-top: 8px; font-size: 16px} #container .rec .img_tit {font-size: 18px; margin-top: 30px} #container .rec .v_img {width: 100%; height: 290px; margin: 27px auto 50px; background: url(/img/m_value.png) no-repeat 50% top; background-size: contain} #container .rec .bottom {padding-top: 50px; height: auto; padding-bottom: 75px} #container .rec .bottom .subV {width: calc((100% - 23px) / 2); margin-right: 20px;} #container .rec .bottom .subV:nth-child(2n+2) {margin-right: 0} #container .rec .bottom .subV:nth-child(3), #container .rec .bottom .subV:nth-child(4) {margin-top: 27px} #container .rec .bottom .subV div[class^="box"] {height: 135px; padding-top: 15px} #container .rec .bottom .subV .box01 .icon {width: 49px; height: 54px; background-position: 0 -338px} #container .rec .bottom .subV .box02 .icon {width: 60px; height: 54px; background-position: -60px -338px} #container .rec .bottom .subV .box03 .icon {width: 42px; height: 54px; background-position: -126px -338px} #container .rec .bottom .subV .box04 .icon {width: 42px; height: 54px; background-position: -179px -338px} #container .rec .bottom .subV .value {font-size: 16px; margin-top: 13px; line-height: 1.2} #container .rec .bottom .subV .exp {font-size: 14px; margin-top: 11px; letter-spacing: -1.8px;} /*인사교육제도*/ #container .rank {margin: 30px 0 50px} #container .rank .secTit {margin-bottom: 18px;} #container .rank div[class^='box'] {display: block; width: 100%; height: auto; margin-right: 0; padding: 20px; margin-bottom: 5px; box-sizing: border-box; height: auto !important; zoom : 1} #container .rank div[class^='box']:after {clear: both; content: ''; display: block} #container .rank div[class^='box']:last-child {height: 173px; margin-bottom: 0} #container .rank div[class^='box'] .tit {font-size: 14px; margin-top: -2px !important; text-align: left; } #container .rank div[class^='box'] .exp {margin-top: 6px; font-size: 14px; text-align: left; padding: 0; letter-spacing: -1.8px} #container .rank div[class^='box'] .icon {float: left; } #container .rank .box01 .icon {width: 38px; height: 37px; background-position: -228px -207px} #container .rank .box02 .icon {width: 37px; height: 37px; background-position: -273px -207px; margin-top: -2px; margin-left: 1px} #container .rank .box03 .icon {width: 42px; height: 34px; background-position: -228px -246px; margin-bottom: 0; margin-top: 3px; } #container .rank div[class^="box"] .m_cont {width: 65%; float: left; margin-left: 20px} #container .rank div[class^="box"].box03 .m_cont {margin-left: 18px} #container .reward {padding-top: 50px; height: 500px; background-size: cover;} #container .reward .box {width: 100%; margin-right: 0; display: block; margin-bottom: 30px} #container .reward .box:last-child {margin-bottom: 0} #container .reward .box .tit {height: 40px; line-height: 40px; font-size: 16px} #container .reward .box .exp {padding-top: 10px; font-size: 14px} #container .rank .box02 .tit {margin-top: 9px !important} #container .edu {padding: 47px 0 50px} #container .edu div[class^='box'] {float: none; width: 100%; height: auto; padding: 23px 20px 19px 77px; margin-bottom: 15px} #container .edu div[class^='box'] .tit {font-size: 14px; margin-bottom: 5px} #container .edu div[class^='box'] .exp {font-size: 14px; line-height: 1.5} #container .edu div[class^='box'].box01 .icon {width: 41px; height: 48px; background-position: -316px 0; top: 27px; left: 19px !important} #container .edu div[class^='box'].box02 .icon {width: 32px; height: 42px; background-position: -316px -52px; top: 26px; left: 23px} #container .edu div[class^='box'].box03 .icon {width: 45px; height: 46px; background-position: -316px -98px; top: 26px; left: 17px} #container .edu div[class^='box'].box04 .icon {width: 35px; height: 54px; background-position: -316px -148px; top: 25px; left: 22px} #container .edu div[class^='box'].box05 .icon {width: 36px; height: 46px; background-position: -316px -207px; top: 25px; left: 21px} #container .edu div[class^='box'].box06 .icon {width: 48px; height: 30px; background-position: -316px -259px; top: 26px; left: 15px} #container .welfare {padding: 47px 0 75px} #container .welfare .wrap_wel>div {width: 100%; float: none; margin-right: 0; margin-bottom: 15px; padding: 14px 5px 14px 78px; height: auto} #container .welfare div[class^='wel'] .icon {top: 17px} #container .welfare .wel01 .icon {width: 45px; height: 46px; background-position: 0 -287px; left: 16px} #container .welfare .wel02 .icon {width: 39px; height: 39px; background-position: -50px -287px; left: 20px} #container .welfare .wel03 .icon {width: 48px; height: 33px; background-position: -100px -287px; top: 19px !important; left: 15px} #container .welfare div[class^='wel'] .tit {font-size: 14px} #container .welfare div[class^='wel'] ul>li {font-size: 14px;} #container .welfare div[class^='wel'] ul>li:before {top: 8px} #container .welfare .harmony {padding: 14px 5px; margin-top: 25px} #container .welfare .harmony .tit {font-size: 16px} #container .welfare .harmony .h_box {float: none; width: 100%} #container .welfare .harmony .h_box .box {height: 40px; line-height: 40px; font-size: 14px;} #container .welfare .harmony .h_box .exp {font-size: 14px; padding: 15px 0; height: auto} /*직무소개*/ #container .rec .bottom.long {height: auto} #container .cate {margin: 13px 0 18px; font-size: 18px} #container .rec .bottom .cate {margin-bottom: 18px} #container .j_box {width: 100%; height: auto; padding: 14px 5px; display: block; margin-bottom: 25px} #container .j_box>div {float: none} #container .j_box>.th {width: auto; margin-bottom: 10px;} #container .j_box .cont {width: 100%} #container .j_box .cont .detail {padding: 5px; height: auto; box-sizing: border-box} #container .j_box .th>p {font-size: 16px; padding-left: 5px} #container .j_box .cont .detail>p {font-size: 14px;} #container .j_box .cont .detail .txt {width: auto;} #container .j_box .cont .detail:last-child {padding-top: 10px} #container .j_box.mb100 {margin-bottom: 50px !important} /*채용 프로세스*/ #container .rec .secTit.proc {margin: 25px 0 15px} #container .rec .boxTit {font-size: 16px} #container .rec .wrap_process {height: auto; padding: 22px 15px 15px; margin-bottom: 15px} #container .rec .wrap_process .re_exp {margin-top: 16px; font-size: 14px} #container .rec .wrap_process .chart {margin-top: 17px; height: auto; /*padding: 15px 43px*/; padding: 0} /*19.07.15 추가*/ #container .rec .chart .m_wrap {max-width: 285px; margin: 0px auto; padding: 14px 0 23px} #container .rec .wrap_process .chart div[class^='step'] {margin-left: 15px; width: auto;} #container .rec .wrap_process .chart .m_wrap div[class^='step'] {width: 70px} #container .rec .wrap_process .chart .m_wrap div[class^='step'] {margin-left: 0} #container .rec .wrap_process .chart .step02 {margin-left: 0px !important} #container .rec .wrap_process .chart div[class^="step"].step04 {margin-left: 0 !important} #container .rec .wrap_process .chart .step04, #container .rec .wrap_process .chart .step05 {margin-top: 24px} #container .rec .wrap_process .chart div[class^='step'] .icon {width: 50px; height: 50px; border-width: 2px; box-sizing: border-box} #container .rec .wrap_process .chart .step01 .icon>span {width: 20px; height: 28px; background-position: -369px 0; margin-top: 9px} #container .rec .wrap_process .chart .step02 .icon>span {width: 27px; height: 29px; background-position: -369px -32px; margin-top: 8px; margin-left: 0} #container .rec .wrap_process .chart .step03 .icon>span {width: 30px; height: 30px; background-position: -369px -64px; margin-top: 8px} #container .rec .wrap_process .chart .step04 .icon>span {width: 25px; height: 23px; background-position: -369px -126px; margin-top: 11px} #container .rec .wrap_process .chart .step05 .icon>span {width: 24px; height: 25px; background-position: -369px -160px; margin-top: 10px} #container .rec .wrap_process .chart .step02 .icon {margin-left: 22px} #container .rec .wrap_process .chart div[class^='step'] p {font-size: 13px; margin-top: 9px} #container .rec .wrap_process.senior .chart {padding: 0 15px} #container .rec .senior .chart .m_wrap {max-width: 175px} #container .rec .wrap_process.senior .step02 {margin-left: 1px !important} #container .rec .wrap_process .chart .line {width: 100%; left: 0; top: 37px} #container .rec .wrap_process .chart .line.pc_hide {top: 168px} #container .rec .wrap_info {margin-bottom: 15px} #container .rec .wrap_info>div {float: none;} #container .rec .wrap_info .boxTit {margin-bottom: 14px} #container .rec .wrap_info .submit {margin-bottom: 15px; width: 100%; padding: 22px 19px; height: auto} #container .rec .wrap_info .txt {font-size: 14px} #container .rec .wrap_info .submit .txt {font-size: 14px; padding-left: 0; margin-bottom: 11px; line-height: 1.6} #container .rec .wrap_info .txt .th {display: block; position: relative; margin-bottom: 3px} #container .rec .wrap_info .submit ul {font-size: 13px; padding-left: 0;} #container .rec .wrap_info .result, #container .rec .wrap_info .how {width: 100%; height: auto; padding: 21px 23px 25px; margin-bottom: 15px} #container .rec .ask {margin-bottom: 50px; height: 45px;} #container .rec .ask p {line-height: 45px; font-size: 15px} #container .rec .ask p .sp_com {width: 23px; height: 24px; background-position: -369px -160px; margin-right: 4px; margin-top: 11px} #container .rec .ask p .cl_b {margin-right: 10px} /*채용공고*/ #container .wrap_Rlist {margin-top: 0px} #container .wrap_Rlist .r_list {padding: 13px 15px; margin-bottom: 15px; height: 142px} #container .wrap_Rlist .r_list.no-list {height: auto} #container .r_list>p {float: none} #container .r_list .d-day {font-size: 24px; line-height: normal; padding: 0} #container .r_list .tit {font-size: 16px; width: 100%; height: 47px; white-space: normal; line-height: normal; margin-top: 5px} #container .wrap_Rlist .r_list.no-list .tit {height: auto} #container .r_list ul {right: auto; left: 15px; top: auto; bottom: 13px} #container .r_list ul>li {font-size: 14px} #container .r_list ul .view {margin-left: 21px} #container .r_list ul .view:before {height: 9px; left: -12px; top: 5px} #container .wrap_Rlist .r_list.end .d-day {font-size: 24px} #container .wrap_Rlist .r_list.end .tit {margin-top: 5px} #container .wrap_Rlist .r_list.end ul {top: auto; bottom: 13px} #container .wrap_Rlist .r_list:hover, #container .wrap_Rlist .r_list:active, #container .wrap_Rlist .r_list:focus {padding: 9px 13px; text-decoration: none} #container .wrap_Rlist .r_list.end:hover .d-day, #container .wrap_Rlist .r_list.end:active .d-day, #container .wrap_Rlist .r_list.end:focus .d-day {padding-left: 0} #container .wrap_Rlist .r_list.end:hover>p, #container .wrap_Rlist .r_list.end:active>p, #container .wrap_Rlist .r_list.end:focus>p {line-height: normal} #container .wrap_Rlist .r_list.end:hover ul, #container .wrap_Rlist .r_list.end:active ul, #container .wrap_Rlist .r_list.end:focus ul {left: 13px; bottom: 11px; top: auto} #container .wrap_Rlist .r_list.end:hover, #container .wrap_Rlist .r_list.end:focus, #container .wrap_Rlist .r_list.end:active {padding: 13px 15px} #container .wrap_Rlist .r_list.end:hover .tit, #container .wrap_Rlist .r_list.end:focus .tit, #container .wrap_Rlist .r_list.end:active .tit {margin-top: 5px} #container .wrap_Rlist .r_list.end:hover ul, #container .wrap_Rlist .r_list.end:focus ul, #container .wrap_Rlist .r_list.end:active ul {left: 15px; bottom: 13px} #container .wrap_Rlist .r_list:hover>p, #container .wrap_Rlist .r_list:active>p, #container .wrap_Rlist .r_list:focus>p {line-height: inherit} #container .wrap_Rlist .r_list:hover .d-day, #container .wrap_Rlist .r_list:active .d-day, #container .wrap_Rlist .r_list:focus .d-day {padding-left: 0} #container .wrap_Rlist .r_list:hover .tit, #container .wrap_Rlist .r_list:focus .tit, #container .wrap_Rlist .r_list:active .tit {margin-top: 2px; line-height: 1.5} #container .wrap_Rlist .r_list:hover ul, #container .wrap_Rlist .r_list:active ul, #container .wrap_Rlist .r_list:focus ul {right: auto; left: 13px; bottom: 11px; top: auto} #container .viewPage .titleArea .d-day {font-size: 25px; margin-bottom: 5px} #container .wrap_faq {margin-top: 0px} #container .wrap_faq div[class^='fqa']>div {padding: 15px 31px; height: auto} #container .wrap_faq div[class^='fqa']>div>span {font-size: 16px; left: 10px; top: 14px} #container .wrap_faq .quest>p {font-size: 16px; width: 91%} #container .wrap_faq div[class^='fqa'] .anws {padding: 15px 10px} #container .wrap_faq .fqa .anws>span {margin-right: 10px} #container .wrap_faq .fqa .anws .a_cont {width: 90%} #container .wrap_faq .anws dt,#container .wrap_faq .anws dd,#container .wrap_faq .anws p{font-size: 14px} #container .wrap_faq .anws dd {margin-bottom: 8px} #container .wrap_faq .quest .arrow {width: 15px; height: 9px; background-position: -61px -93px; right: 15px; top: 20px} #container .wrap_faq div[class^='fqa'].active .quest .arrow {background-position: -79px -93px} /*19.07.04 수정*/ #container .wrap_faq div[class*='fqa'] .anws .btn_modify {width: 100px; height: 40px; line-height: 40px; right: 0px} #container .rec .writePage .period .wrap_pInput {width: 48%} #container .writePage .period input {width :100%} /*--------고객의 소리----------*/ #container section.cst {padding: 0} #container .cst p[class^='exp'] {font-size: 17px; width: 100%; margin-top: 50px; line-height: 1.5; letter-spacing: -0.3px; padding: 0 15px; box-sizing: border-box;} #container .cst p[class^='exp']:before {width: 17px; height: 14px; background: url(/img/m_lt.png) no-repeat; background-size: cover; left: 15px; top: 3px} #container .cst p[class^='exp']:after {width: 17px; height: 14px; background: url(/img/m_gt.png) no-repeat; background-size: cover; right: 15px; top: 3px} #container .cst .s_exp {font-size: 14px; margin-top: 13px; line-height: 1.6; padding: 0 15px; box-sizing: border-box;} #container .cst .info {margin-top: 21px; padding: 16px 0; font-size: 16px} #container .cst .infoArea {background: none; border-right: none; border-left: none; padding: 12px 6px; font-size: 14px; margin-bottom: 15px; height: 189px} #container .cst .infoArea dl dd table {margin-top: 18px;} #container .cst .infoArea dl dd table th {font-size: 12px;} #container .cst .infoArea dl dd table td {padding: 9px 2px; font-size: 12px;} #container .cst #ck {width: 20px; height: 20px; margin-right: 10px} #container .cst #ck+span {font-size: 12px} #container .cst .bottom {padding: 31px 0 71px} #container .cst .bottom .box01 {padding-top: 25px} #container .cst .bottom .box01 .icon {width: 55px; height: 72px; background-position: 0 -212px; margin-top: 0;} #container .cst .bottom .box02 {padding-top: 30px} #container .cst .bottom .box02 .icon {width: 67px; height: 60px; background-position: -61px -212px; margin-top: 0;} #container .cst .bottom .box03 {padding-top: 29px} #container .cst .bottom .box03 .icon {width: 52px; height: 61px; background-position: -139px -212px; margin-top: 0;} #container .cst .bottom span {margin: 1px 5px 0 -1px} #container .cst .bottom .layout>p {font-size: 11px} #container .cst .writePage {margin-top: 2px} #container .cst .writePage>div {padding: 7px 5px 10px; height: 77px; box-sizing: border-box} #container .cst .writePage .th {font-size: 12px; padding: 0; margin-top: 0; margin-bottom: 4px} #container .cst .writePage>div>div:last-child {padding: 0; width: 100%} #container .cst .writePage>div>div:last-child>input {height: 34px; margin-top: 2px; -webkit-appearance: none; -webkit-border-radius: 0;} #container .cst .writePage .cont textarea {height: 153px; -webkit-appearance: none; -webkit-border-radius: 0;} #container .cst .writePage .phone .th {padding: 0;} #container .cst .wrap_btn {padding: 25px 0 50px; margin-top: 0;} #container .cst .btn_send {margin: 0 auto; width: 150px; height: 35px; line-height: 35px; font-size: 12px} #container .cst .checkbox-container {margin-bottom: 15px} #container .cst .writePage .secu img {width: 100%; margin-bottom: 10px; height: 80px} #container .cst .wrap_txt {float: none; width: 100%} #container .cst .writePage .secu .wrap_sec>a {margin-right: 10px; width: 35px; height: 35px} #container .cst .writePage .secu .wrap_sec .btn_replay {background-position: 0px -160px; margin-right: 10px} #container .cst .writePage .secu .wrap_sec .guide {font-size: 12px; margin-top: 7px} #container .cst .writePage .secu input {width: 100% !important; -webkit-appearance: none; -webkit-border-radius: 0;} #container .cst .bottom div[class^='box'] {width: 100%; margin-right: 0; float: none; margin-bottom: 15px; height: 70px; box-sizing: border-box; zoom: 1; padding: 14px;} #container .cst .bottom div[class^='box'] .icon {float: left} #container .cst .bottom .box01 .icon {width: 24px; height: 31px; background-position: -238px -287px; margin-top: 5px; margin-left: 3px;} #container .cst .bottom .box02 .icon {width: 29px; height: 26px; background-position: -238px -322px; margin-top: 8px;} #container .cst .bottom .box03 .icon {width: 23px; height: 26px; background-position: -238px -353px; margin-top: 7px ; margin-left: 3px;} #container .cst .bottom div[class^='box'] .m_cont {float: left; width: 80%} #container .cst .bottom .box01 .m_cont {margin-left: 20px} #container .cst .bottom .box02 .m_cont {margin-left: 18px} #container .cst .bottom .box03 .m_cont {margin-left: 21px} #container .cst .bottom div[class^='box'] p {font-size: 14px; } #container .cst .bottom div[class^='box'] .txt {position: relative; bottom: auto; text-align: left} #container .cst .bottom div[class^='box'] .addr {position: relative; bottom: auto; margin-top: 3px; text-align: left; font-weight: 500} #container .cst .bottom.mt40 {padding: 19px 0 70px; margin-top: 50px} /*19.08.05 추가*/ #container .cst .writePage .category {height: auto} #container .cst .bottom .radio p {width: 100%; height: 35px} #container .cst [type="radio"]:checked + label:after, [type="radio"]:not(:checked) + label:after {display: none} #container .cst .bottom .radio label {overflow: hidden; box-sizing: border-box; height: 35px; line-height: 31px; text-align: left} #container .cst .bottom [type="radio"]:checked + label {line-height: 28px} #container .cst [type="radio"]:checked + label:before, #container .cst [type="radio"]:not(:checked) + label:before {width: 100%; box-sizing: border-box; border-radius: 0; height: 35px; border-width: 1px } #container .cst [type="radio"]:checked + label:before {border-width: 2px} #container .cst #choice1:checked + label:before, #container .cst #choice1:not(:checked) + label:before {content: '디지털 컨택센터'; padding-left: 11px} #container .cst #choice2:checked + label:before, #container .cst #choice2:not(:checked) + label:before {content: '인공지능 커뮤니케이션'; padding-left: 11px} #container .cst #choice3:checked + label:before, #container .cst #choice3:not(:checked) + label:before {content: '커뮤니케이션 클라우드'; padding-left: 11px} #container .cst #choice4:checked + label:before, #container .cst #choice4:not(:checked) + label:before {content: '모바일 솔루션'; padding-left: 11px} #container .cst #choice5:checked + label:before, #container .cst #choice5:not(:checked) + label:before {content: '기타문의'; padding-left: 11px} /*개인정보처리방침*/ #container .wrap_faq .fqa_info .quest {height: auto; padding: 15px 10px} #container .wrap_faq .fqa_info .anws {font-size: 12px} #container .wrap_faq .fqa_info .anws .btn_modify {bottom: -39px; width: 100px; height: 35px; line-height: 35px; right: -13px} #container .wrap_faq .fqa_info.active .anws {padding: 15px 10px} #container .cst .checkbox-container input[type="checkbox"] + label:before {width: 19px; height: 19px; margin-right: 9px; margin-left: -5px} #container .cst .checkbox-container input[type="checkbox"]:checked + label:before {background: url(/img/m_ck.jpg) no-repeat 2px 5px; background-size: 80%} #container .cst label {font-size: 14px} #container .cst label>span {display: inline-block; margin-top: 2px} #container .personal_manager{margin-top: 30px;;} /*------영문------*/ /*회사소개*/ .eng #container .comp .center {padding: 35px 0; height: auto; } .eng #container .comp .center .name {width: 100%} .eng #container .comp .center .exp {letter-spacing: -1px} .eng #container .comp .wrap_link>a {padding-top: 0px} .eng #container .comp .wrap_link>a .eng {position: relative; bottom: auto; font-size: 13px} /*ceo*/ .eng #container .comp .bottom.half {height: auto} /*비전*/ .eng #container .comp .v_box {padding: 16px 25px} .eng #container .comp .v_img {width: 180px; height: 157px; background: url(/img/e_m_vision.png) no-repeat; background-size: cover} /*사업영역*/ .eng #container .digital .wrap_business .m_slider>li>span.long {top: -84px} .eng #container .digital .wrap_business .m_slider>li>span.long:after {height: 41px; background: url(/img/m_chain.png) no-repeat; background-size: contain} .eng #container .bis .wrap_business {height: 445px; background: url(/img/m_di.jpg) no-repeat 50% top;} .eng #container .wrap_solution, .eng #container .mobile .wrap_solution {height: auto} .eng #container .wrap_solution .solution .m_cont {padding-bottom: 50px} #container .wrap_solution .indicator ul {padding: 13px 0; height: auto} .eng #container .wrap_solution .indicator ul>li {padding: 0 16px} .eng #container .digital .wrap_solution .indicator {width: 180px} .eng #container .ai .wrap_solution .indicator {width: 237px} .eng #container .wrap_solution .solution .slide-number {bottom: 11px} .eng #container .cloud .btn_go {margin-top: 15px !important; width: 250px !important;} .eng #container .cloud .wrap_service .service {height: auto} .eng #container .bis.solution .wrap_business{height: 360px; background: url(/img/m_solution01.png) no-repeat 50% top; background-size: cover;} .eng #container .solution .wrap_solution{background-size: contain;} } @media screen and (max-width : 357px){ #container .j_box .cont .detail.line-2 .txt {margin-top: 3px} } .border_box>#asterisk{ border-collapse: collapse; overflow-x: scroll; } .border_box>#asterisk>p{ padding-top: 25px; font-weight: 500; padding-left: 40px; } .border_box>#asterisk #asteriskTable{ border: 1px solid #333; } .border_box>#asterisk #asteriskTable .asterisk_title{ background-color: #f4f4f4; } .asterisk_title td{ border: 1px solid #c7c7c7; } .border_box>#asterisk #asteriskTable .asterisk_cont_01{ text-align: left; font-weight: bold; padding-left: 20px; border-left: 1px solid #c7c7c7; } .border_box>#asterisk #asteriskTable .asterisk_cont td{ text-align: center; border: 1px solid #c7c7c7; } .border_box>#asterisk #asteriskTable .asterisk_cont td:first-of-type{ text-align: left; padding-left: 40px; }