@charset "utf-8"; @import url('swiper.min.css'); @import url('jquery.fullPage.css'); @import url("animations.css"); @import url('base.css'); @import url('layout.css'); @import url('https://fonts.googleapis.com/css?family=Roboto:400,300,100,500,700'); @import url('jquery-ui.css'); /************************************************ index ************************************************/ .opacity{ opacity:0;} #mainCon{ position:relative; z-index:2; } .index-slide{ position:relative; top:0; left:0; bottom:0; overflow:hidden;} .index-slide .embed-responsive-item, .index-slide #player{ position:absolute; top:0; left:0; width:100%; height:auto;} .index-slide .swiper-slide img{ width:100%; display:block;} .index-slide .swiper-pagination{ position:relative; bottom:auto; left:auto; display:inline-block; margin:0 0 0 12px; vertical-align:middle;} .index-slide .swiper-pagination .swiper-pagination-bullet{ width:58px; height:4px; background-color:#eee; border-radius:0; margin:0 4px; opacity:1;} .index-slide .swiper-pagination .swiper-pagination-bullet-active{ background-color:#e0002a;} .index-slide .pag{ position:absolute; bottom:50px; left:0; width:100%; margin-left:0; text-align:center; z-index:5;} .index-slide .copy-bx{ position:absolute; top:0; left:0; width:100%; bottom:0; display:table; text-align:center; color:#fff; z-index:99; background:rgba(0,0,0,0.5);} .index-slide .copy-bx .inbx{ display:table-cell; vertical-align:middle; } .index-slide .copy-bx .inbx p{ color:#fff; font-size:32px;} .index-slide .copy-bx .inbx p strong{ font-size:64px;} .index-slide .copy-bx .inbx .mv-ico01{ margin-top:80px;} .index-slide .copy-bx .inbx .mv-ico01 li{ display:inline-block; opacity:0; vertical-align:top;} .index-slide .copy-bx .inbx .mv-ico01 li+li{ margin-left:90px;} .index-slide .copy-bx .inbx .mv-ico01 li a{ display:block;} .index-slide .copy-bx .inbx .mv-ico01 li a img{ width:auto; height:auto;} .index-slide .copy-bx .inbx .mv-ico01 li a:hover span{ opacity:1; } .index-slide .copy-bx .inbx .mv-ico01 li a{ transition:all .5s ease;} .index-slide .copy-bx .inbx .mv-ico01 li a:hover{ transform: rotateY(-360deg);} .index-slide .main-link { position: absolute; width: 100%; bottom: 10%; left: 50%; transform: translateX(-50%); } .index-slide .main-link ul { overflow:hidden; } .index-slide .main-link ul li { display: inline-block; margin-right: 30px; } .index-slide .main-link ul li a { font-size: 18px; font-weight: bold; color: #ffffff; } .index-slide .main-link ul li:hover a { color: #d90331; } #menu{ position:fixed; top:50%; right:25px; z-index:99; overflow:hidden;} /* #menu>li:not(:first-of-type) {margin-top:10px;} */ /* #menu>li a{ position:relative; display:block; width:150px; line-height:26px; height:26px; font-size:13px; color:#fff; text-align:center;} */ /* #menu>li a:after{ content:""; position:absolute; width:7px; height:7px; top:50%; left:50%; margin:-3px 0 0 -3px; display:block; background-color:#ddd; border-radius:50%; } */ /* #menu>li.active a, #menu>li:hover a{ color:#e00529; text-decoration:none; font-size:16px; text-indent:0; font-weight:600;} */ /* #menu>li.active a:after{ display:none;} */ /* #menu>li:first-child{ display:none;} */ #menu>li a{ position:relative; display:block; width:120px; line-height:26px; height:26px; text-indent:-9999px; text-align:center;} #menu>li a:after{ content:""; position:absolute; width:7px; height:7px; top:50%; left:50%; margin:-3px 0 0 -3px; display:block; background-color:#ddd; border-radius:50%; } #menu>li.active a{ color:#e00529; text-decoration:none; font-size:12px; text-indent:0; font-weight:600;} #menu>li.active a:after{ display:none;} #mainCon .section.section01{ overflow:hidden;} #mainCon .section02 .fp-tableCell, #mainCon .section03 .fp-tableCell, #mainCon .section04 .fp-tableCell{ padding-top:110px;} #mainCon .tit-area{ text-align:center; margin:0 0 40px 0; opacity:0;} #mainCon .tit-area>h2{ font-size:50px; color:#121212; font-weight:600; margin:0 0 15px 0; line-height:1;} #mainCon .tit-area>p{ color:#121212; font-size:20px;} #mainCon .section02{ background-color:#f9f9fb;} #mainCon .section02 .m-cor{ width:1200px; margin:0 auto;} #mainCon .section02 .m-cor .left{ width:825px; float:left; opacity:0;} #mainCon .section02 .m-cor .right{ width:345px; float:right; opacity:0;} #mainCon .section02 .m-cor .left .item{ position:relative; width:298px; height:259px; float:left; padding:20px 0 0 0; background-color:#fff; border:#e9e9e9 1px solid; border-bottom:none; border-left:none;} #mainCon .section02 .m-cor .left .item h3{ text-align:center; color:#e10b27; font-size:24px; line-height: 1.2;} #mainCon .section02 .m-cor .left .item h3>span{ color:#666; font-size:14px;} #mainCon .section02 .m-cor .left .item .tbx{ position:absolute; bottom:35px; left:0; width:100%; text-align:center; font-size:16px; color:#888;} #mainCon .section02 .m-cor .left .item .tbx strong{ font-size:55px; color:#333; font-weight:400; line-height:1;} #mainCon .section02 .m-cor .left .item .tbx2 { position: absolute; bottom: 0; right: 20px; color: #888; font-size: 12px; } #mainCon .section02 .m-cor .left .item:after{ content:""; position:absolute; top:-1px; left:-1px; right:-1px; bottom:-1px; border:#e00529 0 solid; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;} #mainCon .section02 .m-cor .left .item:hover:after{ border:#e00529 4px solid;} #mainCon .section02 .m-cor .left .item.item0101, #mainCon .section02 .m-cor .left .item.item0104{ border-left:#e9e9e9 1px solid; } #mainCon .section02 .m-cor .left .item.item0104, #mainCon .section02 .m-cor .left .item.item0105{ border-bottom:#e9e9e9 1px solid; } #mainCon .section02 .m-cor .left .item.item0102{ width:210px;} #mainCon .section02 .m-cor .left .item.item0103{ width:210px;} #mainCon .section02 .m-cor .left .item.item0104{ width:405px;} #mainCon .section02 .m-cor .left .item.item0105{ width:526px;} #mainCon .section02 .m-cor .left .item.item0101{ background:#fff url(../images/index/main_sprites.png) 50% 100% no-repeat;background-position: -1184px 0;}/*mc01*/ #mainCon .section02 .m-cor .left .item.item0102:before{ content:""; position:absolute; top:80px; left:50%; margin-left:-35px; width:70px; height:50px; display:block; background:#fff url(../images/index/main_sprites.png) 50% 100% no-repeat;background-position: -677px -624px ; width: 70px; height: 50px;} #mainCon .section02 .m-cor .left .item.item0103:before{ content:""; position:absolute; top:85px; left:50%; margin-left:-35px; width:70px; height:50px; display:block; background:#fff url(../images/index/main_sprites.png) 50% 100% no-repeat;background-position: -672px -490px ; width: 70px; height: 50px; } #mainCon .section02 .m-cor .left .item.item0104:before{ content:""; position:absolute; top:20px; left:50%; margin-left:-35px; width:70px; height:50px; display:block; background:#fff url(../images/index/main_sprites.png) 50% 100% no-repeat;background-position: -675px -549px ; width: 70px; height: 50px; } #mainCon .section02 .m-cor .left .item.item0105{ background:#fff url(../images/index/main_sprites.png) 50% 100% no-repeat;background-position: 0 -481px ;}/*mc05*/ #mainCon .section02 .m-cor .left .item.item0103 .tbx{ overflow:hidden;} #mainCon .section02 .m-cor .left .item.item0103 .tbx li{ float:left; display:block; width:50%; font-size:15px;} #mainCon .section02 .m-cor .left .item.item0103 .tbx li em{ display:block; font-size:38px; color:#333;} #mainCon .section02 .m-cor .left .item.item0105 .tbx{ overflow:hidden; padding:0 30px;} #mainCon .section02 .m-cor .left .item.item0105 .tbx li{ float:left; display:block; width:50%; font-size:15px;} #mainCon .section02 .m-cor .left .item.item0105 .tbx li:first-child { width: 100%; } #mainCon .section02 .m-cor .left .item.item0105 .tbx li em{ display:inline-block; font-size:38px; color:#333; margin-left: 10px; } #mainCon .section02 .m-cor .right .item{ position:relative; display:block; height:173px; padding:24px 28px; color:#fff; font-size:16px;} #mainCon .section02 .m-cor .right .item span{ display:block; } #mainCon .section02 .m-cor .right .item:after{ content:""; position:absolute; top:145px; right:32px; width:94px; height:82px; display:block;} #mainCon .section02 .m-cor .right .item .tit{ font-size:24px; font-weight:600; margin:0 0 10px 0; line-height: 1.2;} #mainCon .section02 .m-cor .right .item.item0201{ background-color:#3b4559;} #mainCon .section02 .m-cor .right .item.item0202{ background-color:#e00529;} #mainCon .section02 .m-cor .right .item.item0203{ background-color:#ea8216;} #mainCon .section02 .m-cor .right .item.item0201:after{ background:url(../images/index/main_sprites.png) 50% 50% no-repeat; background-size:100%;background-position: -809px -606px ; width: 94px; height: 82px; }/* mc0201 */ #mainCon .section02 .m-cor .right .item.item0202:after{ background:url(../images/index/main_sprites.png) 50% 50% no-repeat; background-size:100%;background-position: -829px -496px ; width: 94px; height: 82px; }/* mc0202 */ #mainCon .section02 .m-cor .right .item.item0201:hover{ background-color:#192742;} #mainCon .section02 .m-cor .right .item.item0202:hover{ background-color:#a8001c;} #mainCon .section02 .m-cor .right .item:hover .tbx{ font-weight:600;} #mainCon .section02 .m-cor .left .item.item0104 ul { font-size: 14px; position: relative; padding-left: 25px; padding-top: 50px; padding-right:5px; } #mainCon .section02 .m-cor .left .item.item0104 ul li { margin-bottom: 8px; } #mainCon .section02 .m-cor { width: 1054px; font-family: 'Pretendard Variable', 'Nanum Gothic', sans-serif; } #mainCon .section02 .m-cor * { font-family: inherit; } #mainCon .section02 .m-cor-inner { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; line-height: 1; } #mainCon .section02 .m-cor-item { position: relative; padding: 30px; background-color: #fff; height: 224px; opacity: 0; } #mainCon .section02 .m-cor-item h3 { font-size: 18px; margin-bottom: 5px; } #mainCon .section02 .m-cor-item .cor-icon { position: absolute; bottom: 22px; right: 30px; } #mainCon .section02 .m-cor-item .stats { font-size: 16px; } #mainCon .section02 .m-cor-item .stats strong { font-size: 56px; font-weight: 500; color: #da0028; } #mainCon .section02 .m-cor-item .caption { position: absolute; left: 30px; bottom: 30px; font-size: 12px; } #mainCon .section02 .m-cor-item.ceo *, #mainCon .section02 .m-cor-item.link * { color: #fff; } #mainCon .section02 .m-cor-item.ceo { display: flex; flex-direction: column; justify-content: space-between; background-image: url(../images/index/cor_img_ceo.jpg); background-size: cover; background-position: center; } #mainCon .section02 .m-cor-item.ceo .ceo-txt { font-size: 15px; } #mainCon .section02 .m-cor-item.ceo .ceo-txt em { display: block; margin-bottom: 4px; font-size: 20px; font-weight: 600; line-height: 1.2; } #mainCon .section02 .m-cor-item.business { grid-column: 1 / span 2; } #mainCon .section02 .m-cor-item.business .business-item-wrap { display: flex; gap: 10px; margin-top: 20px; } #mainCon .section02 .m-cor-item.business .business-item { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 20px 20px 15px; font-size: 16px; background-color: #eaeaea; border-radius: 4px; text-align: center; } #mainCon .section02 .m-cor-item.link p { margin-top: 20px; font-size: 16px; line-height: 1.3; } #mainCon .section02 .m-cor-item.link.sustain { background-color: #da0028; } #mainCon .section02 .m-cor-item.link.recruit { background-color: #e67525; } /*#mainCon .section03{ background:url(../images/index/bg_section03.jpg) 50% 0 no-repeat; background-size:cover;} #mainCon .section03 .tit-area>h2, #mainCon .section03 .tit-area>p{ color:#fff;} #mainCon .section03 .creat-bx{ width:1200px; margin:0 auto; text-align: center;} #mainCon .section03 .creat-bx .item{ position:relative; width:277px; height:475px; display:inline-block; color:#fff; overflow:hidden; opacity:0; text-align:left;} #mainCon .section03 .creat-bx .item:before{ content:""; position:absolute; top:475px; left:0; width:100%; height:475px; background-color:rgba(200,0,0,0.9); display:block; z-index:1; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out; } #mainCon .section03 .creat-bx .item:hover:before, #mainCon .section03 .creat-bx .item:focus:before{ top:0;} #mainCon .section03 .creat-bx .item .tbx{ position:absolute; top:0; left:0; width:100%; height:475px; font-size:14px; padding:50px 34px 0; display:block; margin:0; z-index:2;} #mainCon .section03 .creat-bx .item .tit{ font-size:28px; line-height:1; display:block; margin:0 0 15px 0;} #mainCon .section03 .creat-bx .item .lst{ position:absolute; top:270px; left:-277px; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;} #mainCon .section03 .creat-bx .item .lst>i{ display:block; font-size:16px; } #mainCon .section03 .creat-bx .item .lst>i:before{ content:""; width:6px; height:2px; background-color:#fff; display:inline-block; margin:0 5px 0 0; vertical-align:middle;} #mainCon .section03 .creat-bx .item:hover .lst, #mainCon .section03 .creat-bx .item:focus .lst{ left:34px;} #mainCon .section03 .creat-bx .item .lst>i+i{ margin-top:20px;} #mainCon .section03 .creat-bx .item+.item{ margin-left:30px;} #mainCon .section03 .creat-bx .item.item01{ background:url(../images/index/creat_img01.jpg) 50% 50% no-repeat;} #mainCon .section03 .creat-bx .item.item02{ background:url(../images/index/creat_img02.jpg) 50% 50% no-repeat;} #mainCon .section03 .creat-bx .item.item03{ background:url(../images/index/creat_img03.jpg) 50% 50% no-repeat;} #mainCon .section03 .creat-bx .item.item04{ background:url(../images/index/creat_img04.jpg) 50% 50% no-repeat;}*/ #mainCon .section03{ background:url(../images/index/bg_section03.jpg) 50% 0 no-repeat; background-size:cover;} #mainCon .section03 .tit-area>h2, #mainCon .section03 .tit-area>p{ color:#fff;} #mainCon .section03 .creat-bx{ width:891px; margin:0 auto; overflow:hidden; } #mainCon .section03 .creat-bx .item{ position:relative; width:277px; height:475px; display:block; float:left; color:#fff; overflow:hidden; opacity:0;} #mainCon .section03 .creat-bx .item:before{ content:""; position:absolute; top:475px; left:0; width:100%; height:475px; background-color:rgba(200,0,0,0.9); display:block; z-index:1; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out; } #mainCon .section03 .creat-bx .item:hover:before, #mainCon .section03 .creat-bx .item:focus:before{ top:0;} #mainCon .section03 .creat-bx .item .tbx{ position:absolute; top:0; left:0; width:100%; height:475px; font-size:14px; padding:50px 24px 0; display:block; margin:0; z-index:2;} #mainCon .section03 .creat-bx .item .tit{ font-size:28px; line-height:1; display:block; margin:0 0 15px 0;} #mainCon .section03 .creat-bx .item .lst{ position:absolute; top:270px; left:-277px; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;} #mainCon .section03 .creat-bx .item .lst>i{ display:block; font-size:16px; } #mainCon .section03 .creat-bx .item .lst>i:before{ content:""; width:6px; height:2px; background-color:#fff; display:inline-block; margin:0 5px 0 0; vertical-align:middle;} #mainCon .section03 .creat-bx .item:hover .lst, #mainCon .section03 .creat-bx .item:focus .lst{ left:34px;} #mainCon .section03 .creat-bx .item .lst>i+i{ margin-top:10px;} #mainCon .section03 .creat-bx .item+.item{ margin-left:30px;} #mainCon .section03 .creat-bx .item.item01{ background:url(../images/index/main_sprites.png) no-repeat;background-position: 0 0; width: 277px; height: 475px; } #mainCon .section03 .creat-bx .item.item02{ background:url(../images/index/main_sprites.png) no-repeat;background-position: -890px 0; width: 277px; height: 475px; } #mainCon .section03 .creat-bx .item.item03{ background:url(../images/index/main_sprites.png) no-repeat;background-position: -596px 0; width: 277px; height: 475px; } #mainCon .section03 .creat-bx .item.item04{ background:url(../images/index/main_sprites.png) no-repeat;background-position: -295px 0; width: 277px; height: 475px; } #mainCon .m-comm{ position:relative; width:1200px; margin:0 auto; overflow:hidden;padding-bottom:100px;} #mainCon .m-comm .left{ float:left; width:794px; overflow:hidden; margin:0;opacity:0;} #mainCon .m-comm .ir-bx{ position:relative; width:440px; height:280px; background-color:#f4f5f9; margin:0 0 20px 0; float:left; } #mainCon .m-comm .ir-bx:after{ position:absolute; top:127px; left:104px; width:230px; height:177px; background:url(../images/index/ir_img.png); display:block;} #mainCon .m-comm h3{ position:absolute; top:40px; left:40px; line-height:1; font-size:30px; color:#333; z-index:9;} #mainCon .m-comm .ir-bx .stock{ height:237px; border-bottom:#e0e0e0 2px solid; text-align:right; font-size:14px; color:#888; padding:40px 0 0; margin:0 40px;} #mainCon .m-comm .ir-bx .stock .tbx{ font-size:16px; color:#121212; margin:0 0 5px 0;} #mainCon .m-comm .ir-bx .stock .tbx span{ position:relative; display:inline-block; } #mainCon .m-comm .ir-bx .stock .tbx span+span{ margin:0 0 0 18px; padding:0 0 0 19px;} #mainCon .m-comm .ir-bx .stock .tbx span+span:before{ content:""; position:absolute; width:1px; height:10px; background-color:#121212; display:block; top:50%; left:0; margin-top:-5px; } #mainCon .m-comm .ir-bx .stock>strong{ display:block; margin-top:50px; font-size:70px; color:#333;} #mainCon .m-comm .ir-bx ul{ text-align:right; margin:33px 40px 0;} #mainCon .m-comm .ir-bx ul li{ position:relative; display:inline-block; padding:0 50px 0 0; text-align:left;} #mainCon .m-comm .ir-bx ul li+li{ margin-left:40px;} #mainCon .m-comm .ir-bx ul li .name{ font-size:14px; color:#8d8d8d; font-weight:600; display:block; } #mainCon .m-comm .ir-bx ul li .num{ font-size:20px; color:#333; display:block; } #mainCon .m-comm .ir-bx ul li em{ position:absolute; top:12px; right:0;} #mainCon .m-comm .item{ position:relative; display:block; float:left; width:386px; height:280px; margin:0; padding:150px 0 0 0;} #mainCon .m-comm .item.life{ background:url(../images/index/comm_img02.png) 50% 0 no-repeat;/* background-position: -983px -498px ; width: 386px; height: 150px; */}/* comm_img02 */ #mainCon .m-comm .item.pr{ margin:0 0 0 22px; background:url(../images/index/comm_img03.png)/* 50% 0 no-repeat;background-position: -980px -657px ; width: 386px; height: 150px; */}/* comm_img03 */ #mainCon .m-comm .item .tbx{ padding:34px 0 0 38px; height:130px; color:#fff; display:block;} #mainCon .m-comm .item .tbx strong{ display:block; font-size:22px; margin:0 0 10px 0;} #mainCon .m-comm .item .tbx em{ display:block; opacity:.8;} #mainCon .m-comm .item.life .tbx{ background-color:#e00529;} #mainCon .m-comm .item.pr .tbx{ background-color:#3b4559;} #mainCon .m-comm .item:hover em{ text-decoration:underline;} #mainCon .m-comm .item:after{ content:""; position:absolute; top:0; left:0; right:0; bottom:0; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;} #mainCon .m-comm .item.life:after{ border:#e00529 0 solid;} #mainCon .m-comm .item.pr:after{ border:#3b4559 0 solid;} #mainCon .m-comm .item.life:hover:after{ border:#e00529 5px solid;} #mainCon .m-comm .item.pr:hover:after{ border:#3b4559 5px solid;} #mainCon .m-comm .news-bx{ position:relative; float:left; width:902px; height:280px; border:#e5e5e5 1px solid; padding:38px 36px 0;opacity:0; overflow:hidden;} #mainCon .m-comm .news-bx>h3{ position:relative; top:auto; left:auto; font-size:30px; color:#333; font-weight:600; line-height:1; padding:0 0 25px 0;} #mainCon .m-comm .news-bx ul li{ padding-bottom:20px;} #mainCon .m-comm .news-bx ul li img{ display:none;} #mainCon .m-comm .news-bx ul li+li{ padding-top: 20px; border-top: #e5e5e5 2px solid;} #mainCon .m-comm .news-bx ul li strong{ font-size:20px; display:-webkit-box; word-wrap:break-word; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis;height:56px; padding-right: 80px; } #mainCon .m-comm .news-bx ul li span{ margin:25px 0; display:block; height:50px;} #mainCon .m-comm .news-bx ul li em{ color:#414141; font-size:14px; display:block; position: absolute; right: 0; bottom: 0;} #mainCon .m-comm .news-bx ul li a{ display:block; position: relative;} #mainCon .m-comm .news-bx ul li a:hover *{ color:#e00529;} #mainCon .m-comm .news-bx .btMore{ position:absolute; top:-2px; right:-2px; width:30px; height:30px; background:#e0002a url(../images/index/blt_plus.png) 50% 50% no-repeat; text-indent:-9999px; display:block;} #mainCon .m-comm .media-bx { overflow: hidden; opacity: 0; } #mainCon .m-comm .media-bx > div { width: calc(50% - 7.5px); float: left; } #mainCon .m-comm .media-bx > div + div { margin-left: 15px; } #mainCon .m-comm .media-bx .img-wrap a { position: relative; display: block; width: 100%; height: 100%; } #mainCon .m-comm .media-bx .img-wrap .thum { position: relative; display: block; padding-bottom: 56%; } #mainCon .m-comm .media-bx .img-wrap .thum::after { content: ""; display: block; position: absolute; left: 0; top: 0; width: 40px; height: 40px; background: url(../images/common/icon_video.png) no-repeat center/cover; } #mainCon .m-comm .media-bx .img-wrap .thum img { position: absolute; left: 0; top: 50%; width: 100%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } #mainCon .m-comm .social-bx { position: relative; width: 280px; height: 280px; padding:38px 36px 0; background-color: #3c4459; float: left; opacity: 0; overflow: hidden; } #mainCon .m-comm .social-bx h3 { position: relative; top: auto; left: auto; color: #ffffff; padding-bottom: 60px; } #mainCon .m-comm .social-bx ul { overflow: hidden; } #mainCon .m-comm .social-bx ul li { width: 33.3333%; float: left; text-align: center; color: #ffffff; font-size: 14px; } #mainCon .m-comm .social-bx ul li img { margin-bottom: 20px; } #mainCon .m-comm .bottom-comm { overflow: hidden; margin-top: 20px; } #mainCon .m-comm .bottom-comm > div { opacity: 0; } #mainCon .m-comm .bottom-comm > div + div { margin-left: 18px; } #mainCon .m-comm .bottom-comm h3 { font-size: 26px; } /* ul */ ul.ul-list01 li{ padding:0 0 0 12px; text-indent:-12px;} ul.ul-list01 li:before{ content:""; width:2px; height:2px; background-color:#333; display:inline-block; border-radius:50%; margin:0 10px 0 0; vertical-align:middle;} ul.ul-list01 li+li{ margin-top:5px; } ul.ul-list02 li{ padding:0 0 0 12px; text-indent:-12px;} ul.ul-list02 li:before{ content:""; width:4px; height:4px; background-color:#e0072a; display:inline-block; margin:0 8px 0 0; vertical-align:middle;} ul.ul-list02 li+li{ margin-top:5px; } /* tab */ .tab li{ float:left;} .tab li a{ position:relative; line-height:68px; display:block; text-align:center; font-size:16px; color:#555; font-weight:600;} .tab li.active a{ color:#e00529;} .tab li a:before{ content:""; position:absolute; top:50%; left:0; margin-top:-8px; width:1px; height:16px; background-color:#e5e5e5; display:block;} .tab li:first-child a:before{ display:none;} .tab li a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:0px; background-color:#e00529; display:block; opacity:0; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;} .tab li a:hover:after, .tab li.active a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:3px; background-color:#e00529; display:block; opacity:1;} /* search-bx */ .sch-form{ margin:-40px 0 60px 0;} .sch-form p{ text-align:center; font-size:16px;} .sch-form .bx{ position:relative; width:580px; margin:0 auto 20px; border:#ccc 1px solid; padding:0 90px 0 0;} .sch-form .bx .input{ height:60px; line-height:60px; border:none; width:100%; display:block; background-color:transparent; padding:0 25px; font-size:16px;} .sch-form .bx .bt-sch{ position:absolute; top:0; right:0; width:90px; height:60px; background:url(../images/common/icon_search2.png) 50% 50% no-repeat; display:block; text-indent:-9999px;} .search-bx{ width:1200px; margin:0 auto; border:#e8ecf2 1px solid; background-color:#fff; padding:0 0 80px 0;} .search-bx .tab{ overflow:hidden; border-bottom:#e5e5e5 1px solid;} .search-bx .tab li{ float:left; width:25%;} .search-bx .tab li a{ position:relative; line-height:68px; display:block; text-align:center; font-size:16px; color:#555; font-weight:600;} .search-bx .tab li.active a{ color:#e00529;} .search-bx .tab li a:before{ content:""; position:absolute; top:50%; left:0; margin-top:-8px; width:1px; height:16px; background-color:#e5e5e5; display:block;} .search-bx .tab li:first-child a:before{ display:none;} .search-bx .tab li a:hover:after, .search-bx .tab li.active a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:3px; background-color:#e00529; display:block; } .search-bx .tc{ padding:25px 49px 0;} .result-list .item{ border-bottom:#eee 1px solid;} .result-list .item a{ display:block; padding:20px 0; } .result-list .item:first-child a{ padding-top:0;} .result-list .item a:hover{ text-decoration:underline;} .result-list .item span{ display:block;} .result-list .item .tit{ font-size:18px; color:#333; font-weight:600; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; margin:0 0 10px 0;} .result-list .item .tit strong{ color:#e00529;} .result-list .item .tbx{ height:44px;} .result-list .item .tbx em{ color:#e00529;} .result-list .item.noTxt{ padding:0 0 70px 0; font-size:20px; color:#333; font-weight:600; text-align:center; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; } .result-list .item.noTxt:before{ content:""; width:75px; height:65px; display:block; margin:0 auto 20px; background:url(../images/common/icon_exc.png) 50% 0 no-repeat; } /************************************************ corp ************************************************/ .corp-wr{ position:relative; background-color:#fff; padding:80px 50px;} .corp-wr .tx01{ width: 60%; font-size:19px; color:#333; margin:0 0 120px 0; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .corp-wr .tx01 strong{ display:block; font-size:33px; margin:25px 0 0 0; line-height:1.2; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .corp-wr .tx01 strong em{ color:#e00529;} .corp-wr .thum{ position:absolute; top:104px; right:70px;} .corp-wr dl dt{ font-size:24px; color:#333; font-weight:600; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .corp-wr dl dd{ font-size:16px; margin-top:20px;} .corp-wr dl dd img{ margin-top:30px;} .corp-wr dl+dl{ margin-top:70px;} .corp-wr02{ position:relative; background-color:#fff; padding:80px 50px; border-top:#e8ecf2 1px solid;} .corp-wr02 h3{ font-size:24px; color:#333; line-height:1; font-weight:600;} .corp-wr02 .tab{ overflow:hidden; margin:50px 0 100px -28px;} .corp-wr02 .tab>a{ position:relative; float:left; border-bottom:#ccc 1px solid; font-weight:600; font-size:18px; color:#333; display:block; line-height:60px; margin:0 0 20px 28px; width:254px; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .corp-wr02 .tab>a:after{ content:""; position:absolute; top:50%; right:0; display:block; margin-top:-1px; width:11px; height:1px; background-color:#ccc;} .corp-wr02 .tab>a.active, .corp-wr02 .tab>a:hover{ color:#e00529; border-bottom:#e00529 1px solid;} .corp-wr02 .tab>a.active:after, .corp-wr02 .tab>a:hover:after{ background-color:#e00529;} .corp-wr02 .tab>a.active:before, .corp-wr02 .tab>a:hover:before{ content:""; position:absolute; top:50%; right:5px; display:block; margin-top:-6px; width:1px; height:11px; background-color:#e00529;} .corp-wr02 .tab>a>span { font-size: 14px; font-weight: 500; } .corp-wr02 .tc{ position:relative; padding:0 452px 0 0; min-height:300px;} .corp-wr02 .tc .photo{ position:absolute; top:0; right:0; width: 400px; height: 300px;} .corp-wr02 .tc h4{ font-size:24px; color:#333; margin:0 0 20px 0;} .corp-wr02 .tc h4 > span { font-size: 18px; } .corp-wr02 .tc .tbx{ font-size:16px; color:#333;} .corp-wr02 .tc .btn-box{ margin-top:60px;} .corp-wr02 .tc .btn-box p { width: 500px; font-size: 11px; font-weight: bold; margin-top: 5px; } .corp-wr02 .tc .btn-box+.btn-box { margin-top:20px;} .corp-wr02 .tc .btn-box a { min-width: 250px; padding:0; } .corp-wr02 .tc .btn-box a:after{ content:""; width:15px; height:15px; background:url(../images/common/blt_link.png) 50% 50% no-repeat; display:inline-block; vertical-align:middle; margin:0 0 0 10px;} .corp-wr03{ margin-top:60px; margin-bottom:60px; } .corp-wr03 .page-tit{ margin:0 0 40px 0; text-transform:uppercase;} .corp-wr03 .map{ min-height:532px; background-color:#666;} .corp-wr03 .map img{ display:block;} .corp-wr03 .loc-tx{ background-color:#fff; border:#e8ecf2 1px solid; border-top:none; padding:80px 50px;} .corp-wr03 .loc-tx dl{ padding:0 0 0 78px; font-size:16px; background:url(../images/corp/ic_subway.png) 0 0 no-repeat;} .corp-wr03 .loc-tx dl:first-child{ background:url(../images/corp/ic_loc.png) 0 0 no-repeat;} .corp-wr03 .loc-tx dl+dl{ margin-top:35px;} .corp-wr03 .loc-tx dl dt{ font-size:20px; font-weight:600; color:#333; margin:0 0 10px 0; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .ceo-bx{ width:1200px; margin: 0 auto; background-color:#fff; padding:0; overflow: hidden; position: relative; padding: 80px; } /* .ceo-bx .hd{ position:relative; padding:60px 40px 20px; } .ceo-bx .hd .tx01{ color:#333; font-size:38px; font-weight:600; margin:0 0 20px; letter-spacing:0; line-height: 1.2;} .ceo-bx .hd .tx02{ color:#e00529; font-size:22px; font-weight:600;} .ceo-bx .hd .photo{ position:absolute; top:-1px; right:0;} .ceo-bx .tbx{ margin:0; border-top:#e8ecf2 1px solid; padding:20px 40px 50px; } .ceo-bx .tbx .tx01{ color:#333; font-size:20px; font-weight:600; margin:0 0 20px 0;} .ceo-bx .tbx p{ font-size:16px;} .ceo-bx .tbx p+p{ margin-top:20px;} .ceo-bx > div { float: left; } .ceo-bx .left { width: 40%; position:absolute; left: 0; bottom: 0; } .ceo-bx .left img { display: block; margin: 0 auto; } .ceo-bx .right { float: right; width: 60%; } .ceo-bx .sign { text-align: right; } */ .ceo-bx > .img-wrap { position: relative; } .ceo-bx > .img-wrap img { vertical-align: top; } .ceo-bx > .img-wrap > .tbx { position: absolute; left: 120px; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .ceo-bx > .img-wrap > .tbx > .tx01 { position: relative; padding: 40px 0; margin-bottom: 10px; } .ceo-bx > .img-wrap > .tbx > .tx01::after { content: ""; position: absolute; left: 0; top: 0; width: 31px; height: 25px; background:url(../images/corp/img_ceo_deco.png) no-repeat center/cover; } .ceo-bx > .img-wrap > .tbx > .tx01::before { content: ""; position: absolute; left: 0; bottom: 0; width: 31px; height: 25px; background:url(../images/corp/img_ceo_deco.png) no-repeat center/cover; transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); } .ceo-bx > .img-wrap > .tbx p { font-size: 24px; color: #eeeeee; } .ceo-bx > .img-wrap > .tbx > .tx02 { color: #eeeeee; } .ceo-bx > .img-wrap > .tbx > .tx02 strong { font-size: 24px; margin-left: 16px; } .ceo-bx > .btn-box a:after { content: ""; width: 15px; height: 15px; background: url(../images/common/blt_link.png) 50% 50% no-repeat; display: inline-block; vertical-align: middle; margin: 0 0 0 10px; } .history-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid;} .history-bx .tab{ border-bottom:#e5e5e5 1px solid;} .history-bx .tab:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .history-bx .tab li{ float:left; width:16.6%;} .history-bx .tab li a{ position:relative; line-height:68px; display:block; text-align:center; font-size:16px; color:#555; font-weight:600;} .history-bx .tab li.active a{ color:#e00529;} .history-bx .tab li a:before{ content:""; position:absolute; top:50%; left:0; margin-top:-8px; width:1px; height:16px; background-color:#e5e5e5; display:block;} .history-bx .tab li:first-child a:before{ display:none;} .history-bx .tab li a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:0px; background-color:#e00529; display:block; opacity:0; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;} .history-bx .tab li.active a:after, .history-bx .tab li a:hover:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:3px; background-color:#e00529; display:block; opacity:1;} .history-bx .tc{ position:relative; padding:80px 50px 80px 360px; overflow:hidden;} .history-bx .tc .his-tit{ position:absolute; top:80px; left:90px;} .history-bx .tc .his-tit h4{ margin:0 0 20px 0;} .history-bx .tc .his-tit p{ font-size:16px; color:#666;} .history-bx .tc .his-tx{ position:relative; padding:0 0 30px 117px;} .history-bx .tc .his-tx h5{ position:absolute; top:0; left:0; } .history-bx .tc .his-tx li{ position:relative; font-size:16px; color:#333; padding:0 0 0 45px;} .history-bx .tc .his-tx li+li{ margin-top:10px;} .history-bx .tc .his-tx li .month{ position:absolute; top:0; left:0; color:#e00529; font-weight:600; display:inline-block; width:45px;} .history-bx .tc .his-tx li .img{ margin-top:5px;} .history-bx .tc .his-tx+.his-tx{ padding-top:30px; border-top:#dedede 1px solid;} .history-bx .tc .his-tx+.his-tx h5{ top:30px; } .vision-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:50px 49px 100px;} .vision-bx .tx01{ font-size:19px; color:#333; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .vision-bx .tx01 strong{ display:block; font-size:28px;} .vision-bx .thum{ margin:50px 0 0 0;} .vision-bx .thum img{ display:block;} .vision-bx .tx02{ margin:30px 0 0 0; font-size:16px;} .vision-bx .tx02 img{ float:right; margin:0 25px 0 50px;} .vision-bx h4{ margin:70px 0 20px; font-size:24px; color:#121212;} .vision-bx .prvethum{ position:relative;} .vision-bx .prvethum img{ display:block;} .vision-bx .prvethum a{ display:block; } .vision-bx .prvethum a:before{ content:""; position:absolute; top:0; left:0; right:0; bottom:0; width:100%; background-color:rgba(0,0,0,0.42); } .vision-bx .prvethum a:after{ content:""; position:absolute; top:50%; left:50%; margin:-42px 0 0 -42px; width:83px; height:83px; display:block; background:url(../images/common/icon_play.png) 50% 50% no-repeat;} .vision-bx .prvethum .mov{ display:none;} .vision-bx .prvethum .mov .mov-if{ width:1100px; height:562px;} .ci-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:50px 49px;} .ci-bx>h4{ margin:0 0 30px 0; line-height:1; color:#121212; font-size:24px; font-weight:600; opacity:0;} .ci-bx>div+h4{ margin-top:80px;} .ci-bx .ci-b01{ position:relative; padding:0 0 0 383px; font-size:16px;} .ci-bx .ci-b01 .img{ position:absolute; top:0; left:0;} .ci-bx .ci-b02{ overflow:hidden;} .ci-bx .ci-b02>dl{ float:right; width:538px;} .ci-bx .ci-b02>dl:first-child{ float:left;} .ci-bx .ci-b02>dl img{ display:block;} .ci-bx .ci-b02>dl>dd{ font-size:16px;} .ci-bx .ci-b02>dl>dd strong{ display:block; margin:15px 0; font-size:18px; color:#333; line-height:1;} .ci-bx .ci-b03{ font-size:16px;} .ci-bx .ci-b03 .img{ overflow:hidden; margin:0 0 15px 0; } .ci-bx .ci-b03 .img img{ float:right;} .ci-bx .ci-b03 .img img:first-child{ float:left;} .ci-bx .ci-b04{ border:#d5d5d5 1px solid; display:table; width:100%; padding:50px;} .ci-bx .ci-b04 dl{ display:table-cell; } .ci-bx .ci-b04 dl dt img{ display:block; margin:0 auto 30px;} .ci-bx .ci-b04 dl dd{ font-size:16px; padding:0 50px;} .ci-bx .ci-b04 dl dd strong{ display:block; font-size:18px; color:#333; margin:0 0 10px 0;} .global-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:50px 0 0;} .global-bx .tx01{ margin:0 49px; font-size:16px;} .global-bx .map{ margin:70px 0 0 0;} .global-bx .map img{ display:block;} .global-bx2{ width:1200px; margin:80px auto 0; background-color:#fff; border:#e8ecf2 1px solid; padding:0;} .global-bx2 .tab{ border-bottom:#e5e5e5 1px solid;} .global-bx2 .tab:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .global-bx2 .tab li{ float:left; width:50%;} .global-bx2 .tab li a{ position:relative; line-height:68px; display:block; text-align:center; font-size:16px; color:#555; font-weight:600;} .global-bx2 .tab li.active a{ color:#e00529;} .global-bx2 .tab li a:before{ content:""; position:absolute; top:50%; left:0; margin-top:-8px; width:1px; height:16px; background-color:#e5e5e5; display:block;} .global-bx2 .tab li:first-child a:before{ display:none;} .global-bx2 .tab li a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:0px; background-color:#e00529; display:block; opacity:0; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;} .global-bx2 .tab li.active a:after, .global-bx2 .tab li a:hover:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:3px; background-color:#e00529; display:block; opacity:1;} .global-bx2 .tc{ position:relative; padding:60px 49px 100px; overflow:hidden;} .org-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:50px 49px 100px;} .org-bx .tx01 , .org-bx .tx02{ color:#333; font-size: 16px; } .org-bx h4{ margin:50px 0 10px; font-size:24px; color:#121212;} .org-bx h4:first-child{ margin-top:0;} .org-bx .org-thum{ background:url(../images/corp/org_img01.jpg) 50% 0 no-repeat; height:480px; border:#ebebeb 1px solid; margin:10px 0 0 0; } .org-bx .global-link{ overflow:hidden; margin:0 0 0 -2%;} .org-bx .global-link a{ position:relative; display:block; width:48%; border:#ebebeb 1px solid; height:80px; line-height:80px; font-size:16px; color:#333; font-weight:600; float:left; margin:20px 0 0 2%; padding:0 30px;} /* 20200519 줄바꿈 길이 수정 */ .org-bx .global-link .line-break { line-height: 30px; padding-top: 10px; } .org-bx .global-link a:before{ content:""; width:3px; height:3px; background-color:#333; display:inline-block; vertical-align:middle; margin:0 6px 0 0;} .org-bx .global-link a:after{ content:""; position:absolute; top:50%; right:20px; margin-top:-15px;width:29px; height:29px; background:url(../images/common/icon_dw.png) 50% 50% no-repeat; display:block; border:#d6d6d6 1px solid; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out; } .org-bx .global-link a:hover{ color:#e00529; border:#e00529 1px solid;} .org-bx .global-link a:hover:before{ background-color:#e00529; } .org-bx .global-link a:hover:after{ background:url(../images/common/icon_dw_on.png) 50% 50% no-repeat; border:#e00529 1px solid;} .org-bx h5{ margin:50px 0 0 0; font-size:20px; color:#121212;} .org-bx .tab{ overflow:hidden; margin:130px 0 50px -28px;} .org-bx .tab>a{ position:relative; float:left; border-bottom:#ccc 1px solid; font-weight:600; font-size:18px; color:#333; display:block; line-height:60px; margin:0 0 20px 28px; width:calc(50% - 28px); font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .org-bx .tab>a:after{ content:""; position:absolute; top:50%; right:0; display:block; margin-top:-1px; width:11px; height:1px; background-color:#ccc;} .org-bx .tab>a.active, .org-bx .tab>a:hover{ color:#e00529; border-bottom:#e00529 1px solid;} .org-bx .tab>a.active:after, .org-bx .tab>a:hover:after{ background-color:#e00529;} .org-bx .tab>a.active:before, .org-bx .tab>a:hover:before{ content:""; position:absolute; top:50%; right:5px; display:block; margin-top:-6px; width:1px; height:11px; background-color:#e00529;} .org-bx .tc{ position:relative; min-height:300px;} .org-bx .org-people{ margin:0 0 0 -2%; overflow:hidden;} .org-bx .org-people>dl{ position:relative; float:left; width:48%; margin:20px 0 0 2%; background-color:#f9fafc; padding:40px 40px 0 188px; height:340px;} .org-bx .org-people>dl dt{ line-height:1; padding:0 0 10px 0; border-bottom:#666 1px solid; font-size:18px; font-weight:600; color:#333; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .org-bx .org-people>dl dt span { padding-left: 10px; font-size: 14px; color: #333333; font-weight: 400; } .org-bx .org-people .photo{ position:absolute; top:40px; left:40px; width: 120px; height: 145px; } .org-bx .org-people .photo > img { width: 100%; height: 100%; } .org-bx .org-people .state{ margin:10px 0;} .org-bx .org-people .state li strong{ font-size:14px; display:inline-block; width:60px;} .org-bx .org-people .ul-list01 li+li{ margin-top:3px;} .org-bx .sel-wrap .select { line-height: 36px; height: 36px; } .org-bx .tx03 { padding: 64px 50px; background-color: #f9fafc; } .org-bx .tx03 ul li { padding-top: 8px; padding-bottom: 4px; overflow: hidden; border-bottom: 1px solid #e9eaea; } .org-bx .tx03 ul li > span { float: left; font-size: 16px; } .org-bx .tx03 ul li > span.left { width: 176px; font-weight: 600; } .org-bx .tx03 ul li > span.right { width: calc(100% - 176px); } .org-bx .tx03 ul li > span a { display: inline-block; padding-right: 28px; position: relative; } .org-bx .tx03 ul li > span a::after { content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); width: 20px; height: 20px; background-image: url(../images/common/icon_dw_on.png); background-repeat: no-repeat; background-position: center; background-size: 10px; border: 1px solid #d40330; } .org-bx .bx-more{ position:relative; background-color:#f9fafc; padding:100px 10px 20px 40px; font-size:14px; text-align:left; display:none;} .org-bx .bx-more .tbx{ height:272px; overflow-y:auto; padding:40px; background-color: #ffffff; } .org-bx table.data tr td.l { padding-left: 18px; padding-right: 18px; } .org-bx .bx-more .tbx table.data tr td.l { padding-left: 56px; padding-right: 40px; } .org-bx .bx-more .bt-close{ position:absolute; top:30px; left:50%; margin:0 0 0 -24px; background:#d7dae0 url(../images/common/icon_x.png) 50% 50% no-repeat; text-indent:-9999px; border-radius:50%; width:48px; height:48px; display:block;} .org-bx .org-box { width: 100%; overflow: hidden; } .org-bx .org-box.half { width: calc(50% - 2%); float: left; margin-right: 2%; } .org-bx .org-box.half .org-people>dl { width: 100%; } .dbl-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:50px 49px 100px;} .dbl-bx .tx01{ color:#333; margin-bottom: 30px; font-size: 16px; } .dbl-bx .img { margin-bottom: 80px; } .dbl-bx h4{ margin:50px 0 20px; font-size:24px; color:#121212;} .dbl-bx h4:first-child{ margin-top:0;} .dbl-bx .box-line { padding: 50px; border: 1px solid #ebebeb; } .dbl-bx .box-line h3 { font-weight: bold; font-size: 18px; margin-bottom: 20px; } .dbl-bx .box-line h3::before { content: ''; display: inline-block; width: 4px; height: 4px; background: #000000; margin-right:8px; vertical-align: middle; } .dbl-bx .box-line p { font-size: 14px; margin-bottom: 30px; } .dbl-bx .box-line .img { margin-bottom: 0; } .dbl-bx .box-line span { display: block; margin-bottom: 50px; } .manage-bx { width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:50px 49px 100px; font-size: 16px; letter-spacing: -0.4px; } .manage-bx h4 { font-size: 24px; color: #121212; margin-bottom: 30px; } .manage-bx .tab{ overflow:hidden; margin:130px 0 50px -28px;} .manage-bx .tab>a{ position:relative; float:left; border-bottom:#ccc 1px solid; font-weight:600; font-size:18px; color:#333; display:block; line-height:60px; margin:0 0 20px 28px; width:336px; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .manage-bx .tab>a:after{ content:""; position:absolute; top:50%; right:0; display:block; margin-top:-1px; width:11px; height:1px; background-color:#ccc;} .manage-bx .tab>a.active, .manage-bx .tab>a:hover{ color:#e00529; border-bottom:#e00529 1px solid;} .manage-bx .tab>a.active:after, .manage-bx .tab>a:hover:after{ background-color:#e00529;} .manage-bx .tab>a.active:before, .manage-bx .tab>a:hover:before{ content:""; position:absolute; top:50%; right:5px; display:block; margin-top:-6px; width:1px; height:11px; background-color:#e00529;} .manage-bx .tc{ position:relative; min-height:300px;} .manage-bx .item-info { overflow: hidden; margin-bottom: 15px; } .manage-bx .manage-item p { font-size: 14px; } .manage-bx .item-info .item { float: left; display: block; min-height: 160px; border: #cccccc 1px solid; padding: 28px 16px; border-top: #FF793D 3px solid; background-color: #fff; width: calc( 25% - 20px ); font-size: 14px; text-align: center; } .manage-bx .item-info .item span { display: block; font-weight: 600; font-size: 18px; } .manage-bx .item-info .item + .item { margin-left: 20px; } .manage-bx .tbx02 { border:#dedede 1px solid; line-height:70px; height:70px; text-align:center; font-size:20px; color:#333; font-weight:600; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; margin:0 0 25px 0;} .manage-bx .bx-more{ position:relative; background-color:#f9fafc; padding:100px 10px 20px 40px; font-size:14px; text-align:left; display:none;} .manage-bx .bx-more dl , .manage-bx .bx-more dt , .manage-bx .bx-more dd { color: #565656; } .manage-bx .bx-more dt { font-weight: 600; } .manage-bx .bx-more dl { margin-bottom: 30px; } .manage-bx .bx-more .tbx{ height:240px; overflow-y:auto; padding:0 30px 0 0;} .manage-bx .bx-more .bt-close{ position:absolute; top:30px; left:50%; margin:0 0 0 -24px; background:#d7dae0 url(../images/common/icon_x.png) 50% 50% no-repeat; text-indent:-9999px; border-radius:50%; width:48px; height:48px; display:block;} .manage-bx table.data .font14 { font-size: 14px !important; } .manage-bx table.data .font16 { font-size: 16px !important; } .manage-bx table.data .font18 { font-size: 18px !important; } .manage-bx table.data .font20 { font-size: 20px !important; } .manage-bx table.data .bold { font-weight: 600 !important; } .manage-bx table.data .btn-box { padding-left: 0; margin-top: 20px; } .manage-bx table.data .btn-box a:after { content: ""; width: 15px; height: 15px; background: url(../images/common/blt_link.png) 50% 50% no-repeat; display: inline-block; vertical-align: middle; margin: 0 0 0 10px; } .manage-bx.human .ta-r { text-align: right; } .manage-bx.human h4 { font-size: 28px; } .manage-bx.human .csm-tw { margin-top: 30px; } .manage-bx.human .csm-tw .tab>a { width: 22%; } .manage-bx.human .rule-wrap { overflow: hidden; } .manage-bx.human .rule-wrap li { float: left; width: 50%; height: 243px; padding: 30px 80px 0 27px; overflow: hidden; border-bottom: 1px solid #d6d6d6; } .manage-bx.human .rule-wrap li:nth-child(odd) { border-right: 1px solid #d6d6d6; } .manage-bx.human .rule-wrap li:nth-child(n+7) { border-bottom: none; } .manage-bx.human .rule-wrap li > div { float: left; } .manage-bx.human .rule-wrap li .img-wrap { width: 16%; } .manage-bx.human .rule-wrap li .txt-wrap { width: 84%; } .manage-bx.human .rule-wrap li .txt-wrap p { font-size: 18px; font-weight: bold; color: #2c2c2c; margin-bottom: 7px; } .manage-bx.human .rule-wrap li .txt-wrap span { font-size: 14px; color: #676767; } .manage-bx.human .csm-tw .tc#tc2 .icon-box { overflow: hidden; background-color: #f9fafc; padding: 47px 52px; margin-top: 35px; } .manage-bx.human .csm-tw .tc#tc2 .icon-box > li { width: calc(33.333% - 23px); height: 495px; margin-right: 34px; border: 1px solid #d5d5d5; float: left; padding: 38px; background-color: #fff; } .manage-bx.human .csm-tw .tc#tc2 .icon-box > li:last-child { margin-right: 0; } .manage-bx.human .csm-tw .tc#tc2 .icon-box > li::before { content: ""; display: block; width: 65px; height: 65px; background-repeat: no-repeat; margin: 0 auto; } .manage-bx.human .csm-tw .tc#tc2 .icon-box > li:nth-child(1)::before { background-image: url(../images/corp/human_manage_icon10.png); } .manage-bx.human .csm-tw .tc#tc2 .icon-box > li:nth-child(2)::before { background-image: url(../images/corp/human_manage_icon11.jpg); } .manage-bx.human .csm-tw .tc#tc2 .icon-box > li:nth-child(3)::before { background-image: url(../images/corp/human_manage_icon12.jpg); } .manage-bx.human .csm-tw .tc#tc2 .icon-box > li > strong { margin-top: 25px; margin-bottom: 15px; font-size: 18px; font-weight: bold; color: #e21335; text-align: center; display: block; height: 60px; line-height: 60px; } .manage-bx.human .csm-tw .tc#tc2 .icon-box > li > strong.lh2 { line-height: unset;} .manage-bx.human .csm-tw .tc#tc2 .icon-box > li > ul > li { font-size: 15px; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; } .manage-bx.human .ch-wrap { border: 1px solid #d5d5d5; height: 68px; line-height: 68px; padding-left: 40px; } .manage-bx.human .ch-wrap p { display: inline-block; font-size: 18px; font-weight: bold; color: #e21335; margin-right: 30px; } .manage-bx.human .ch-wrap span { display: inline-block; } .manage-bx.human .ch-wrap span > img { vertical-align: middle; } .manage-bx.human .proc-box { max-width: 1104px; width: 100%; height: 151px; background-color: #f9fafc; padding: 30px 26px; overflow: auto; } .manage-bx.human .proc-box li { position: relative; float: left; width: 169px; height: 76px; line-height: 76px; border: 1px solid #d5d5d5; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; background-color: #fff; text-align: center; margin-right: 40px; font-weight: bold; } .manage-bx.human .proc-box li.lh2 { line-height: unset; padding: 12px 0; } .manage-bx.human .proc-box li.lh3 { line-height: 1.2; padding: 10px 0; } .manage-bx.human .proc-box li::after { content: ""; display: inline-block; width: 33px; height: 24px; background-image: url(../images/corp/human_manage_icon13.png); background-repeat: no-repeat; background-size: 33px 24px; position: absolute; top: 50%; right: -33px; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .manage-bx.human .proc-box li:last-child::after { content: none; } .manage-bx.human .csm-tw .tc#tc3>div img { margin: 0; } .manage-bx.human .csm-tw .tc#tc3>div+div { margin-top: 122px; } .manage-bx.human .csm-tw .tc#tc3>div dl { top: 0; } .manage-bx.human .csm-tw .tc#tc3>div dl dt { border-bottom: 0; padding-bottom: 0; padding-left: 34px; font-size: 28px; color: #121212; } .manage-bx.human .csm-tw .tc#tc3>div dl dd { padding-left: 34px; } .manage-bx.human .csm-tw .tc#tc3>div.right dl dt { padding-left: 0; } .manage-bx.human .csm-tw .tc#tc3>div.right dl dd { padding: 0; } .manage-bx.human .csm-tw .tc#tc4 .plan-box { overflow: hidden; } .manage-bx.human .csm-tw .tc#tc4 .plan-box dl { float: left; width: calc(33.333% - 23px); border: 1px solid #dbdbdb; position: static; padding: 0; margin-right: 34px; } .manage-bx.human .csm-tw .tc#tc4 .plan-box dl:last-child { margin-right: 0; } .manage-bx.human .csm-tw .tc#tc4 .plan-box dt { line-height: 47px; height: 47px; color: #fff; text-align: center; font-size: 20px; font-weight: bold; font-family: 'Nanum Square' ,'돋움',Dotum, Gulim, serif; background-color: #ff783c; padding: 0; border-bottom: 0; } .manage-bx.human .csm-tw .tc#tc4 .plan-box dd { padding: 0 30px; height: 290px; } .manage-bx.human .csm-tw .tc#tc4 .plan-box dd li:first-child { font-size: 18px; font-weight: bold; color: #df022a; text-indent: inherit; padding: 0; } .manage-bx.human .csm-tw .tc#tc4 .plan-box dd li:first-child::before { content: none; } .manage-bx.human .csm-tw .tc#tc4 .plan-box dd li { font-size: 15px; } .manage-bx.human .csm-tw .tc#tc4 table.data tbody tr.bg-ffe9df th, .manage-bx.human .csm-tw .tc#tc4 table.data tbody tr.bg-ffe9df td { background-color: #ffe9df; } .manage-bx.human .csm-tw .tc#tc4 table.data tbody tr.bg-ffe9df th { border-bottom: 1px solid #acacac; } .manage-bx.human .csm-tw .tc#tc4 table.data tbody tr.bg-ffe9df td:nth-child(2) { border-left: none; } .manage-bx.human .csm-tw .tc#tc4 table.data tbody th { border-bottom: 1px solid #e1e3e6; } .manage-bx.human .csm-tw .tc#tc4 table.data tbody tr:last-child th { border-bottom: 1px solid #acacac; } .csm01-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:50px; font-size:16px;} .csm01-bx .tx01 strong{ display:block; font-size:33px; margin:0 0 20px 0; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .csm01-bx .tx02{ margin:50px 0 0 0; position:relative; padding:0 580px 0 0; min-height:365px;} .csm01-bx .tx02 h4{ margin:0 0 30px 0; font-size:24px;} .csm01-bx .tx02 img{ position:absolute; top:0; right:0; } .csm01-bx .tx02 strong{ display:block; font-size:20px; color:#e00529; margin:0 0 15px 0;} .csm-tw{ margin:80px 0 0 0;} .csm-tw .tab{ overflow:hidden; margin:50px 0 60px -27px;} .csm-tw .tab>a{ position:relative; float:left; border-bottom:#ccc 1px solid; font-weight:600; font-size:18px; color:#333; display:block; line-height:60px; margin:0 0 20px 27px; width:30%; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; height: 70px; line-height: 70px; } .csm-tw .tab>a.lh2 { line-height: unset; } .csm-tw .tab>a:after{ content:""; position:absolute; top:50%; right:0; display:block; margin-top:-1px; width:11px; height:1px; background-color:#ccc;} .csm-tw .tab>a.active, .csm-tw .tab>a:hover{ color:#e00529; border-bottom:#e00529 1px solid;} .csm-tw .tab>a.active:after, .csm-tw .tab>a:hover:after{ background-color:#e00529;} .csm-tw .tab>a.active:before, .csm-tw .tab>a:hover:before{ content:""; position:absolute; top:50%; right:5px; display:block; margin-top:-6px; width:1px; height:11px; background-color:#e00529;} .csm-tw .tc{ position:relative; padding:0 0 60px 0;} .csm-tw .tc h4{ color:#121212; font-size:24px; margin:0 0 25px 0;} .csm-tw .tc>div{ position:relative; } .csm-tw .tc>div:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .csm-tw .tc>div+div{ margin-top:120px;} .csm-tw .tc>div dl{ position:absolute; top:100px; left:0; padding:0 0 0 410px;} .csm-tw .tc>div dl.tn { top: 0; } .csm-tw .tc>div dl dt{ padding:0 0 15px 144px; font-size:20px; color:#333; border-bottom:#ccc 1px solid; font-weight:600; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .csm-tw .tc>div dl dd{ padding:0 40px 0 144px; margin-top:20px;} .csm-tw .tc>div.right img{ float:right; margin:0 40px 0 0;} .csm-tw .tc>div.right dl{ position:absolute; top:100px; left:0; padding:0 440px 0 0;} .csm-tw .tc>div.right dl dt{ padding:0 160px 15px 0; } .csm-tw .tc>div.right dl dd{ padding:0 160px 0 0;} .csm-tw .tc#tc3>div img{ margin:-6px 0 0 -8px;} .csm02-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:0 0 50px 0; font-size:16px;} .csm02-bx .tab{ border-bottom:#e5e5e5 1px solid; margin:0;} .csm02-bx .tab:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .csm02-bx .tab li{ float:left; width:25%;} .csm02-bx .tab li a{ position:relative; line-height:68px; display:block; text-align:center; font-size:16px; color:#555; font-weight:600;} .csm02-bx .tab li.active a{ color:#e00529;} .csm02-bx .tab li a:before{ content:""; position:absolute; top:50%; left:0; margin-top:-8px; width:1px; height:16px; background-color:#e5e5e5; display:block;} .csm02-bx .tab li:first-child a:before{ display:none;} .csm02-bx .tab li a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:0px; background-color:#e00529; display:block; opacity:0; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;} .csm02-bx .tab li a:hover:after, .csm02-bx .tab li.active a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:3px; background-color:#e00529; display:block; opacity:1;} .csm02-bx .tc{ position:relative; padding:60px 49px 80px 49px; overflow:hidden;} .csm02-bx .tc h4{ font-size:24px; color:#121212; margin:0 0 20px 0; } .csm02-bx .tc .tx0102{ margin:50px 0 0 0;} .csm02-bx .tc .tx0102 dt{ color:#333; font-weight:600; margin:0 0 20px 0;} .csm02-bx .tc .tx0102 p{ margin-top:50px; text-align:right; font-size:14px;} .csm02-bx .tc .tx0202{ position:relative; margin:70px 0 0 0;} .csm02-bx .tc .tx0202 dl{ width:314px; background:#f9fafc url(../images/corp/dot_v.png) 0 0 repeat-y;} .csm02-bx .tc .tx0202 dl dt{ line-height:74px; height:74px; color:#fff; text-align:center; font-size:18px; font-weight:400; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; background-color:#ff783c;} .csm02-bx .tc .tx0202 dl dd{ background:url(../images/corp/dot_v.png) 100% 0 repeat-y;} .csm02-bx .tc .tx0202 dl dd>ul{ height:680px; padding:25px 30px 0; background:url(../images/corp/dot_h.png) 100% 100% repeat-x; font-size:14px;} .csm02-bx .tc .tx0202 dl dd>ul li+li{ margin-top:8px;} .csm02-bx .tc .tx0202 dl.cnt{ margin:0 auto; background:#f9fafc url(../images/corp/dot_v_red.png) 0 0 repeat-y;} .csm02-bx .tc .tx0202 dl.cnt dt{ background-color:#e00529;} .csm02-bx .tc .tx0202 dl.cnt dd{ background:url(../images/corp/dot_v_red.png) 100% 0 repeat-y;} .csm02-bx .tc .tx0202 dl.cnt dd>ul{ background:url(../images/corp/dot_h_red.png) 100% 100% repeat-x;} .csm02-bx .tc .tx0202 dl.left{ position:absolute; top:0; left:0;} .csm02-bx .tc .tx0202 dl.right{ position:absolute; top:0; right:0;} .csm02-bx .tc .tx0202 dl.left:after{ content:""; position:absolute; top:50%; right:-60px; width:60px; height:12px; display:block; background:url(../images/corp/aw_r.png) 50% 50% no-repeat;} .csm02-bx .tc .tx0202 dl.right:after{ content:""; position:absolute; top:50%; left:-60px; width:60px; height:12px; display:block; background:url(../images/corp/aw_l.png) 50% 50% no-repeat;} .csm02-bx .tc .tx0301+.tx0301{ margin-top:80px;} .csm02-bx .tc .tx0301 h5{ font-size:24px; color:#121212; margin:0 0 20px 0; } .csm02-bx .tc .tx0301 .global-link{ overflow:hidden; margin:25px 0 0 -2%;} .csm02-bx .tc .tx0301 .global-link a{ position:relative; display:block; width:48%; border:#ebebeb 1px solid; height:70px; line-height:70px; font-size:18px; color:#333; font-weight:600; float:left; margin:20px 0 0 2%; padding:0 30px;} .csm02-bx .tc .tx0301 .global-link a:before{ content:""; width:3px; height:3px; background-color:#333; display:inline-block; vertical-align:middle; margin:0 6px 0 0;} .csm02-bx .tc .tx0301 .global-link a:after{ content:""; position:absolute; top:50%; right:20px; margin-top:-15px;width:29px; height:29px; background:url(../images/common/icon_dw.png) 50% 50% no-repeat; display:block; border:#d6d6d6 1px solid; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out; } .csm02-bx .tc .tx0301 .global-link a:hover{ color:#e00529; border:#e00529 1px solid;} .csm02-bx .tc .tx0301 .global-link a:hover:before{ background-color:#e00529; } .csm02-bx .tc .tx0301 .global-link a:hover:after{ background:url(../images/common/icon_dw_on.png) 50% 50% no-repeat; border:#e00529 1px solid;} .csm02-bx .tc .tx0401 .tx0401-1{ position:relative; margin:35px auto 0; width:840px; text-align:center; padding:0 0 0 106px;} .csm02-bx .tc .tx0401 .tx0401-1:before{ content:""; position:absolute; top:50%; left:0; width:100%; background-color:#ccc; height:1px; display:block; } .csm02-bx .tc .tx0401 .tx0401-1:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .csm02-bx .tc .tx0401 .tx0401-1 li{ position:relative; float:left; margin:0 0 0 60px;} .csm02-bx .tc .tx0401 .tx0401-1 li:first-child{ margin:0;} .csm02-bx .tc .tx0401 .tx0401-1 li:after{ content:""; position:absolute; top:50%; left:-36px; margin-top:-6px; width:13px; height:13px; display:block; border:#fff 3px solid; background-color:#e00529;} .csm02-bx .tc .tx0401 .tx0401-1 li:first-child:after{ content:""; position:absolute; top:50%; left:-106px; margin-top:-6px; width:13px; height:13px; display:block; border:#fff 3px solid; background-color:#ccc;} .csm02-bx .tc .tx0401 .tx0401-1 li:last-child:before{ content:""; position:absolute; top:50%; right:-106px; margin-top:-6px; width:13px; height:13px; display:block; border:#fff 3px solid; background-color:#ccc;} .csm02-bx .tc .tx0401 .tx0401-1 a{ width:170px; height:170px; line-height:170px; text-align:center; display:block; font-size:18px; font-weight:600; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; border:#ff783c 2px solid; border-radius:50%; background-color:#fff;} .csm02-bx .tc .tx0402, .csm02-bx .tc .tx0403, .csm02-bx .tc .tx0404{ margin:80px 0 0 0;} .csm02-bx .tc .tx0402 h5, .csm02-bx .tc .tx0403 h5, .csm02-bx .tc .tx0404 h5{ font-size:24px; color:#121212; margin:0 0 20px 0; } .csm02-bx .tc .tx0402>dl dt{ position:relative; border:#ccc 1px solid; margin-top:10px; padding:0 30px; } .csm02-bx .tc .tx0402>dl dt:after{ content:""; position:absolute; top:50%; right:30px; margin-top:-5px; width:19px; height:10px; display:block; background:url(../images/corp/blt_down.png) 50% 50% no-repeat;} .csm02-bx .tc .tx0402>dl dt button{ line-height:72px; height:72px; padding:0 40px 0 0; font-size:18px; color:#333; font-weight:600; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; display:block; width:100%; text-align:left; cursor:pointer;} .csm02-bx .tc .tx0402>dl dt.active{ border-bottom:none;} .csm02-bx .tc .tx0402>dl dt.active:after{ content:""; background:url(../images/corp/blt_up.png) 50% 50% no-repeat; } .csm02-bx .tc .tx0402>dl dt.active button{ color:#e00529; border-bottom:#e00529 1px solid;} .csm02-bx .tc .tx0402>dl dd{ border:#ccc 1px solid; border-top:none; padding:30px;} .csm02-bx .tc .tx0403>ul{ margin:0 0 0 -16px; overflow:hidden;} .csm02-bx .tc .tx0403>ul>li{ position:relative; float:left; width:355px; height:225px; border:#ccc 1px solid; margin:0 0 16px 16px; padding:116px 0 0 0; } .csm02-bx .tc .tx0403>ul>li:before{ content:""; position:absolute; top:20px; left:50%; margin:0 0 0 -40px; display:block; width:80px; height:80px; background-repeat:no-repeat; } .csm02-bx .tc .tx0403>ul>li.m1:before{ background-image:url(../images/corp/csm02_t04_ic1.gif);} .csm02-bx .tc .tx0403>ul>li.m2:before{ background-image:url(../images/corp/csm02_t04_ic2.gif);} .csm02-bx .tc .tx0403>ul>li.m3:before{ background-image:url(../images/corp/csm02_t04_ic3.gif);} .csm02-bx .tc .tx0403>ul>li.m4:before{ background-image:url(../images/corp/csm02_t04_ic4.gif);} .csm02-bx .tc .tx0403>ul>li.m5:before{ background-image:url(../images/corp/csm02_t04_ic5.gif);} .csm02-bx .tc .tx0403>ul>li.m6:before{ background-image:url(../images/corp/csm02_t04_ic6.gif);} .csm02-bx .tc .tx0403>ul>li.m7:before{ background-image:url(../images/corp/csm02_t04_ic7.gif);} .csm02-bx .tc .tx0403>ul>li.m8:before{ background-image:url(../images/corp/csm02_t04_ic8.gif);} .csm02-bx .tc .tx0403>ul>li.m9:before{ background-image:url(../images/corp/csm02_t04_ic9.gif);} .csm02-bx .tc .tx0403>ul>li.m10:before{ background-image:url(../images/corp/csm02_t04_ic10.gif);} .csm02-bx .tc .tx0403>ul>li strong{ color:#e00529; display:block; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; font-size:18px; text-align:center;} .csm02-bx .tc .tx0403>ul>li>ul{ padding:10px 0 0 40px;} .csm02-bx .tc .tx0403>ul>li>ul>li{ font-size:14px;} .csm02-bx .tc .tx0403>ul>li>ul>li+li{ margin-top:5px;} .csm02-bx .tc .tx0404 dl dt{ color:#333; font-size:20px; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; font-weight:600;} .csm02-bx .tc .tx0404 dl dd{ overflow:hidden;} .csm02-bx .tc .tx0404 dl dd ul{ width:50%; float:left;} .csm02-bx .tc .tx0404 dl dd ul:first-child{ padding:0 60px 0 0;} .csm02-bx .tc .tx0404 dl dd ul li{ text-indent:-16px; padding:0 0 0 16px;} .csm02-bx .tc .tx0501.box-line { border: 1px solid #dedede; padding: 50px; margin-bottom: 75px; } .csm02-bx .tc .mb8 { margin-bottom: 8px; } .csm02-bx .tc .mb25 { margin-bottom: 25px; } .csm02-bx .tc .mb40 { margin-bottom: 40px; } .csm02-bx .tc .mb70 { margin-bottom: 70px; } .csm02-bx .tc .tx0501 p { font-size: 14px; } .csm02-bx .tc .tx0501 dl dd { font-size: 18px; } .csm02-bx .tc .tx0501 .bull { padding-left: 14px; font-weight: bold; } .csm02-bx .tc .tx0501 .bull dd { position: relative; margin-bottom: 10px; } .csm02-bx .tc .tx0501 .bull dd:last-child { margin-bottom: 0; } .csm02-bx .tc .tx0501 .bull dd::before { content: ''; position: absolute; width: 4px; height: 4px; background: #000; left: -12px; top: 12px; } .csm02-bx .tc .tx0501 .bull.none dd::before { content: none; } .csm02-bx .tc .tx0501 .bull.none dd { font-size: 14px; color: #333333; font-weight: 400; } .csm02-bx .tc .tx0501 .bull.type2 dd { font-weight: 400; font-size: 16px; margin-bottom: 0; } .csm02-bx .tc .tx0501 .bull.type2 dd::before { width: 2px; height: 2px; left: -14px; top: 10px; } .csm02-bx .tc .tx0501 .img-2 { margin-top: 25px; margin-bottom: 8px; } .csm01-bx.climate p, .csm01-bx.climate span, .csm01-bx.climate strong { color: #121212; } .csm01-bx.climate h4 { margin-top: 80px; font-size: 28px; font-weight: 700; color: #607628; } .csm01-bx.climate strong { display: block; font-size: 20px; font-weight: 700; margin-top: 50px; margin-bottom: 30px; } .csm01-bx.climate strong.tit { margin-top: 0; padding-left: 20px; } .csm01-bx.climate p { font-size: 16px; letter-spacing: -0.64px; word-break: keep-all; } .csm01-bx.climate p.font14 { font-size: 14px; } .csm01-bx.climate p > span.sup { font-size: 14px; } .csm01-bx.climate .bd-bx { border: 2px solid #ebebeb; padding: 52px 55px 70px; margin-top: 32px; } .csm01-bx.climate .bd-bx.w-caption { overflow-x: auto; } .csm01-bx.climate .bd-bx.w-caption .bd-bx-inner { overflow-x: initial; min-width: 990px; } .csm01-bx.climate .bd-bx.w-caption > div .caption { position: absolute; right: 20px; bottom: 24px; } .csm01-bx.climate .list-wrap { overflow: hidden; margin-top: 78px; } .csm01-bx.climate .list-wrap li { float: left; width: 471px; height: 195px; background-color: #f9fafc; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; padding: 32px 39px 45px; background-image: url(../images/corp/climate_img03.png); background-repeat: no-repeat; background-position: right 39px center; } .csm01-bx.climate .list-wrap li:last-child { margin-left: 29px; background-image: url(../images/corp/climate_img04.png); } .csm01-bx.climate .list-wrap li > p { font-size: 20px; font-weight: 800; margin-bottom: 24px; } .csm01-bx.climate .list-wrap li > div > p { font-size: 18px; line-height: 22px; } .csm01-bx.climate .list-wrap li > div > p:first-child { font-weight: 700; } .csm01-bx.climate .list-wrap li > div > p > span { color: #d90832; } .csm01-bx.climate .bc-bx { padding: 51px 49px; background-color: #f9fafc; margin: 30px 0; } .csm01-bx.climate .bc-bx > p { font-weight: 400; margin-bottom: 24px; font-size: 14px; } .csm01-bx.climate .bc-bx .scenario-bx { border: 1px solid #d5d5d5; background-color: #fff; } .csm01-bx.climate .bc-bx .scenario-bx > li { position: relative; padding: 30px 55px; } .csm01-bx.climate .bc-bx .scenario-bx > li + li { border-top: 1px solid #d5d5d5; } .csm01-bx.climate .bc-bx .scenario-bx > li > p { font-weight: bold; } .csm01-bx.climate .bc-bx .scenario-bx li > strong { position: absolute; top: 50%; left: 55px; transform: translateY(-50%); width: 72px; height: 72px; line-height: 72px; text-align: center; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; font-size: 22px; font-weight: 700; color: #fff; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); margin: 0; } .csm01-bx.climate .bc-bx .scenario-bx li:nth-child(2) > strong { background-color: #c60513; } .csm01-bx.climate .bc-bx .scenario-bx li:nth-child(3) > strong { background-color: #e2943c; } .csm01-bx.climate .bc-bx .scenario-bx li:nth-child(4) > strong { background-color: #3e7819; } .csm01-bx.climate .bc-bx .scenario-bx > li > ul { padding-left: 113px; } .csm01-bx.climate .bc-bx .scenario-bx > li > ul > li { position: relative; padding-left: 8px; font-size: 14px; color: #000; letter-spacing: -0.64px; word-break: keep-all; } .csm01-bx.climate .bc-bx .scenario-bx > li > ul > li::before { content: ""; display: inline-block; width: 2px; height: 2px; background-color: #5e5e5e; position: absolute; top: 11px; left: 0; } .csm02-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:0 0 50px 0; font-size:16px; overflow:hidden;} .csm02-bx .tab{ border-bottom:#e5e5e5 1px solid; margin:0;} .csm02-bx .tab:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .csm02-bx .tab li{ float:left; width:20%;} .csm02-bx .tab li a{ position:relative; line-height:68px; display:block; text-align:center; font-size:16px; color:#555; font-weight:600;} .csm02-bx .tab.font24 li a { font-size: 24px;} .csm02-bx .tab li.active a{ color:#e00529;} .csm02-bx .tab li a:before{ content:""; position:absolute; top:50%; left:0; margin-top:-8px; width:1px; height:16px; background-color:#e5e5e5; display:block;} .csm02-bx .tab li:first-child a:before{ display:none;} .csm02-bx .tab li a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:0px; background-color:#e00529; display:block; opacity:0; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;} .csm02-bx .tab li a:hover:after, .csm02-bx .tab li.active a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:3px; background-color:#e00529; display:block; opacity:1;} .csm02-bx .tc{ position:relative; padding:60px 49px 80px 49px; overflow:hidden;} .csm02-bx .tc h4{ font-size:24px; color:#121212; margin:0 0 20px 0; } .csm02-bx .new-tit { padding: 30px 49px 0; } .csm02-bx .new-tit strong { font-size: 24px; } .csm02-bx .con-list li { float: right; width: 48%; } .csm02-bx .con-list li.tit { margin-top: 30px; } .csm02-bx .con-list li:nth-child(odd) { float: left; clear: both; } .csm02-bx .tc .con-list h4 { color: #e00529; margin-bottom: 10px; margin-top: 40px; font-size: 20px; } .csm02-bx .tc .con-list h4:first-child { margin-top: 0;} .csm02-bx .tc .con-list h4:before { content: ''; width: 16px; height: 16px; display:inline-block; background: #e00529; margin-right:8px; vertical-align: unset; } .csm02-bx .tc .con-list .tx0102, .csm02-bx .tc .con-right .tx0102 { margin: 10px 0; } .csm02-bx .tc .con-list .tx0102 dt { margin: 10px 0 0 0; } .csm02-bx .tc .con-list .tx0102 dd { margin-top: 10px; } .ethic-wr{ position:relative; background-color:#fff; padding:80px 50px;} .ethic-wr .tx01{ padding-right: 400px; font-size:19px; color:#333; margin:0 0 120px 0; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .ethic-wr .tx01 strong{ display:block; font-size:33px; margin:25px 0 0 0; line-height:1.2; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .ethic-wr .tx01 strong em{ color:#e00529;} .ethic-wr .thum{ position:absolute; top:80px; right:70px;} .ethic-wr dl dt{ font-size:24px; color:#333; font-weight:600; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .ethic-wr dl dd{ font-size:16px; margin-top:20px;} .ethic-wr dl dd img{ margin-top:30px;} .ethic-wr dl+dl{ margin-top:70px;} .ethic01-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:40px 49px 100px; } .ethic01-bx h4{ font-size:24px; color:#121212; margin:80px 0 20px 0; } .ethic01-bx h4.mb0{ margin-bottom: 0; } .ethic01-bx .creat-info { overflow: hidden; margin-bottom: 96px; } .ethic01-bx .creat-info .item { position: relative; float: left; display: block; border: #cccccc 1px solid; padding: 10px 0; border-top: #FF793D 3px solid; background-color: #fff; width: calc( 33.3333% - 20px ); height: 104px; margin-top: 20px; font-size: 16px; text-align: center; } .ethic01-bx .creat-info .item p { position: absolute; left: 0; top: 50%; width: 100%; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); } .ethic01-bx .creat-info .item span { display: block; font-weight: 600; font-size: 20px; } .ethic01-bx .creat-info .item + .item { margin-left: 20px; } .ethic01-bx .creat-info .item:nth-child(4n) { margin-left: 0px; } .ethic01-bx .tx01 { margin-bottom: 28px; } .ethic01-bx .tx02 { overflow: hidden; background-color: #f9fafc; padding: 63px 70px; margin-bottom: 128px; } .ethic01-bx .tx02 .fl-l { float: left; } .ethic01-bx .tx02 .fl-r { float: right; width: calc( 100% - 548px ); } .ethic01-bx .tx02 dl { font-size: 16px; margin-bottom: 56px; } .ethic01-bx .tx02 dl dt { font-weight: 600; margin-bottom: 10px; } .ethic01-bx .tx02 dl dd { line-height: 26px; position: relative; padding-left: 9px; } .ethic01-bx .tx02 dl dd:before { content: "·"; position: absolute; left: 0; top: 0; } .ethic01-bx .tx03 { margin-bottom: 28px; } .ethic01-bx .tx03 span { color: #d90432; font-weight: 600; } .ethic01-bx .tx04 { overflow: hidden; } .ethic01-bx .tx04 dl { float: left; width: calc( 33.333% - 20px ); margin-top: 20px; border: 1px solid #dedede; } .ethic01-bx .tx04 dl + dl { margin-left: 20px; } .ethic01-bx .tx04 dl:nth-child(4), .ethic01-bx .tx04 dl:nth-child(7) { margin-left: 0px; } .ethic01-bx .tx04 dt { position: relative; background-color: #f97b42; height: 72px; text-align: center; font-weight: 600; } .ethic01-bx .tx04 dt p { position: absolute; left: 0; top: 50%; width: 100%; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); color: #fff; } .ethic01-bx .tx04 dd { font-size: 13px; height: 260px; padding: 17px 20px; word-break: keep-all; } .ethic01-bx .tx05, .double .tx05{ border:#dedede 1px solid; line-height:70px; height:70px; text-align:center; font-size:20px; color:#333; font-weight:600; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; margin:0 0 50px 0;} .ethic01-bx .tx06{ overflow:hidden;} .ethic01-bx .tx06 li{ position:relative; width:25%; float:left; padding:100px 0 0 0; height:210px; border-left:#dedede 1px solid; text-align:center; font-size:14px;} .ethic01-bx .tx06 li:first-child{ border-left:none;} .ethic01-bx .tx06 li strong{ display:block; font-size:18px; color:#333; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .ethic01-bx .tx06 li:before{ content:""; position:absolute; top:0; left:50%; margin-left:-43px; width:86px; height:80px; display:block; background-repeat:no-repeat;} .ethic01-bx .tx06 li.m1:before{ background-image:url(../images/corp/ethic01_ic0101.gif);} .ethic01-bx .tx06 li.m2:before{ background-image:url(../images/corp/ethic01_ic0102.gif);} .ethic01-bx .tx06 li.m3:before{ background-image:url(../images/corp/ethic01_ic0103.gif);} .ethic01-bx .tx06 li.m4:before{ background-image:url(../images/corp/ethic01_ic0104.gif);} .ethic01-bx .tx07{ overflow:hidden;} .ethic01-bx .tx07 li{ position:relative; width:50%; float:left; padding:10px 0 0 90px; height:100px; border-left:#dedede 1px solid; font-size:14px;} .ethic01-bx .tx07 li strong{ display:block; font-size:18px; color:#333; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .ethic01-bx .tx07 li.m1, .ethic01-bx .tx07 li.m2{ border-bottom:#dedede 1px solid;} .ethic01-bx .tx07 li.m1, .ethic01-bx .tx07 li.m3{ border-left:none;} .ethic01-bx .tx07 li.m3, .ethic01-bx .tx07 li.m4{ padding-top:25px;} .ethic01-bx .tx07 li:before{ content:""; position:absolute; top:10px; left:26px;width:40px; height:40px; display:block; background-repeat:no-repeat;} .ethic01-bx .tx07 li.m1:before{ background-image:url(../images/corp/ethic01_ic0201.gif);} .ethic01-bx .tx07 li.m2:before{ background-image:url(../images/corp/ethic01_ic0202.gif);} .ethic01-bx .tx07 li.m3:before{ background-image:url(../images/corp/ethic01_ic0203.gif); top:25px;} .ethic01-bx .tx07 li.m4:before{ background-image:url(../images/corp/ethic01_ic0204.gif); top:25px;} .ethic01-bx .bx-more{ position:relative; background-color:#f9fafc; padding:100px 10px 20px 40px; font-size:14px; text-align:left; display:none;} .ethic01-bx .bx-more .tbx{ height:240px; overflow-y:auto; padding:0 30px 0 0;} .ethic01-bx .bx-more .tit { font-size: 20px; font-weight: 700; color: #121212; } .ethic01-bx .bx-more .tbx table tr td.ta-l { text-align: left; } .ethic01-bx .bx-more .tbx table tr td.bold { font-weight: bold; } .ethic01-bx .bx-more .tbx table tr td .desc { display: inline-block; padding-left: 10px; text-align: left; font-weight: 400; } .ethic01-bx .bx-more .tbx dl.typ1{ display:table; width:100%; margin:30px 0 0 0;} .ethic01-bx .bx-more .tbx dl.typ1 dt{ display:table-cell; width:88px; font-size:16px; font-weight:600; vertical-align:top;} .ethic01-bx .bx-more .tbx dl.typ2 dt{ display:block; margin:30px 0 10px; font-size:16px; font-weight:600;} .ethic01-bx .bx-more .tbx dl.typ2 dd { display: block; font-weight: 700; margin-bottom: 12px; } .ethic01-bx .bx-more .tbx dl.typ2 dd > span { font-weight: 400; padding-left: 16px; } .ethic01-bx .bx-more .tbx .tbx-con { display: none; } .ethic01-bx .bx-more .tbx .tbx-con.active { display: block; } .ethic01-bx .bx-more .bt-close{ position:absolute; top:30px; left:50%; margin:0 0 0 -24px; background:#d7dae0 url(../images/common/icon_x.png) 50% 50% no-repeat; text-indent:-9999px; border-radius:50%; width:48px; height:48px; display:block;} .ethic02-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:40px 49px 100px; } .ethic02-bx h4{ font-size:24px; color:#121212; margin:0 0 20px 0; } .ethic02-bx .policy-list { padding: 50px 35px 65px 40px; background-color: #f9fafc; margin-top: 32px; } .ethic02-bx .policy-list > ul > li { position: relative; margin-bottom: 12px; } .ethic02-bx .policy-list > ul > li > span { display: inline-block; width: 24px; height: 24px; line-height: 24px; background-color: #e0062a; text-align: center; border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; font-size: 13px; font-weight: bold; color: #fff; position: absolute; top: 0; left: 0; } .ethic02-bx .policy-list > ul > li > p { padding-left: 35px; font-weight: bold; } .ethic02-bx .policy-list .sign { text-align: right; margin-top: 60px; } .ethic02-bx .policy-list .sign span { font-weight: bold; } .ethic02-bx .subtit{ font-size: 18px; margin-bottom: 96px; font-weight: 600; } .ethic02-bx .subtit.font20 { font-size: 20px; } .ethic02-bx .tx01{ margin-bottom: 86px; color:#333; font-size:16px; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .ethic02-bx .tx01 .btn { width: 301px; padding: 0; } .ethic02-bx .tx02{ margin:10px 0 0 0; overflow:hidden; border: 1px solid #dedede; padding: 39px 25px 39px 37px; } .ethic02-bx .tx02 li{ position:relative; float:left; width:50%; margin:20px 0 0 0; font-size:16px; padding:0 0 0 100px;} .ethic02-bx .tx02 li strong{ position:absolute; top:0; left:0; display:inline-block; padding:0 0 0 35px;} .ethic02-bx .tx02 li strong:before{ content:""; position:absolute; top:50%; left:0; margin-top:-11px; width:22px; height:22px; display:block; background-repeat:no-repeat; } .ethic02-bx .tx02 li.m1 strong:before{ background-image:url(../images/corp/ethic02_ic01.gif);} .ethic02-bx .tx02 li.m2 strong:before{ background-image:url(../images/corp/ethic02_ic02.gif);} .ethic02-bx .tx02 li.m3 strong:before{ background-image:url(../images/corp/ethic02_ic03.gif);} .ethic02-bx .tx02 li.m4 strong:before{ background-image:url(../images/corp/ethic02_ic04.gif);} .ethic02-bx .tx02 li.m4 { width: 100%; } .ethic02-bx .tx03{ margin:100px 0 0 0; overflow: hidden; } .ethic02-bx .tx03 ul { border: 1px solid #dedede; font-size: 18px; padding: 60px 70px 70px; } .ethic02-bx .tx03 ul li { font-weight: 600; text-indent: 0; } .ethic02-bx .tx03 ul li .list-num { position: relative; display: inline-block; border-radius: 50%; width: 36px; height: 36px; background-color: #da0431; color: #ffffff; text-align: center; font-size: 18px; line-height: 36px; margin-top: -5px; vertical-align: top; } .ethic02-bx .tx03 ul li .list-num::after { content: ""; position: absolute; left: 50%; top: 100%; width: 2px; height: 200%; background-color: #dedede; transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); } .ethic02-bx .tx03 ul li:last-child .list-num::after { display: none; } .ethic02-bx .tx03 ul li p { display: inline-block; width: calc( 100% - 36px ); padding-left: 18px; vertical-align: middle; margin-bottom: 16px; } .ethic02-bx .tx03 ul li::before { display: none; } .ethic02-bx .tx03 ul strong{ color:#c8092e; } .ethic02-bx .tx05, .double .tx05{ border:#dedede 1px solid; line-height:70px; height:70px; text-align:center; font-size:20px; color:#333; font-weight:600; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; margin:0 0 50px 0;} .ethic02-bx .tx06{ overflow:hidden;} .ethic02-bx .tx06 li{ position:relative; width:25%; float:left; padding:100px 0 0 0; height:210px; border-left:#dedede 1px solid; text-align:center; font-size:14px;} .ethic02-bx .tx06 li:first-child{ border-left:none;} .ethic02-bx .tx06 li strong{ display:block; font-size:18px; color:#333; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .ethic02-bx .tx06 li:before{ content:""; position:absolute; top:0; left:50%; margin-left:-43px; width:86px; height:80px; display:block; background-repeat:no-repeat;} .ethic02-bx .tx06 li.m1:before{ background-image:url(../images/corp/ethic01_ic0101.gif);} .ethic02-bx .tx06 li.m2:before{ background-image:url(../images/corp/ethic01_ic0102.gif);} .ethic02-bx .tx06 li.m3:before{ background-image:url(../images/corp/ethic01_ic0103.gif);} .ethic02-bx .tx06 li.m4:before{ background-image:url(../images/corp/ethic01_ic0104.gif);} .ethic02-bx .tx07{ overflow:hidden;} .ethic02-bx .tx07 li{ position:relative; width:50%; float:left; padding:10px 0 0 90px; height:100px; border-left:#dedede 1px solid; font-size:14px;} .ethic02-bx .tx07 li strong{ display:block; font-size:18px; color:#333; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .ethic02-bx .tx07 li.m1, .ethic02-bx .tx07 li.m2, .ethic02-bx .tx07 li.m5{ border-bottom:#dedede 1px solid;} .ethic02-bx .tx07 li.m1, .ethic02-bx .tx07 li.m3{ border-left:none;} .ethic02-bx .tx07 li.m3, .ethic02-bx .tx07 li.m4{ padding-top:25px;} .ethic02-bx .tx07 li:before{ content:""; position:absolute; top:10px; left:26px;width:40px; height:40px; display:block; background-repeat:no-repeat;} .ethic02-bx .tx07 li.m1:before{ background-image:url(../images/corp/ethic01_ic0201.gif);} .ethic02-bx .tx07 li.m2:before{ background-image:url(../images/corp/ethic01_ic0202.gif);} .ethic02-bx .tx07 li.m3:before{ background-image:url(../images/corp/ethic01_ic0203.gif); top:25px;} .ethic02-bx .tx07 li.m4:before{ background-image:url(../images/corp/ethic01_ic0204.gif); top:25px;} .ethic02-bx .tx07 li.m5:before{ background-image:url(../images/corp/ethic01_ic0205.gif);} .ethic02-bx .bx-more{ position:relative; background-color:#f9fafc; padding:100px 10px 20px 40px; font-size:14px; text-align:left; display:none;} .ethic02-bx .bx-more .tbx{ height:240px; overflow-y:auto; padding:0 30px 0 0;} .ethic02-bx .bx-more .tit { font-size: 20px; font-weight: 700; color: #121212; } .ethic02-bx .bx-more .tbx table tr td.ta-l { text-align: left; } .ethic02-bx .bx-more .tbx table tr td.bold { font-weight: bold; } .ethic02-bx .bx-more .tbx table tr td .desc { display: inline-block; padding-left: 10px; text-align: left; font-weight: 400; } .ethic02-bx .bx-more .tbx dl.typ1{ display:table; width:100%; margin:30px 0 0 0;} .ethic02-bx .bx-more .tbx dl.typ1 dt{ display:table-cell; width:88px; font-size:16px; font-weight:600; vertical-align:top;} .ethic02-bx .bx-more .tbx dl.typ2 dt{ display:block; margin:30px 0 10px; font-size:16px; font-weight:600;} .ethic02-bx .bx-more .tbx dl.typ2 dd { display: block; font-weight: 700; margin-bottom: 12px; } .ethic02-bx .bx-more .tbx dl.typ2 dd > span { font-weight: 400; padding-left: 16px; } .ethic02-bx .bx-more .bt-close{ position:absolute; top:30px; left:50%; margin:0 0 0 -24px; background:#d7dae0 url(../images/common/icon_x.png) 50% 50% no-repeat; text-indent:-9999px; border-radius:50%; width:48px; height:48px; display:block;} .recruit-wr{ position:relative; background-color:#fff; padding:80px 49px; border:#e8ecf2 1px solid;} .recruit-wr .tx01{ position:relative; font-size:19px; color:#333; margin:0 0 120px 0; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .recruit-wr .tx01 strong{ display:block; font-size:33px; margin:25px 0 0 0; line-height:1.2; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .recruit-wr .tx01 strong em{ color:#e00529;} .recruit-wr .tx01 .thum{ position:absolute; top:0; right:70px;} .recruit-wr .tx02{ position:relative; padding:0 540px 0 0; min-height:362px;} .recruit-wr .tx02 h4{ font-size:24px; color:#333; font-weight:600; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .recruit-wr .tx02 div{ font-size:16px; margin-top:20px;} .recruit-wr .tx02 div .img{ position:absolute; top:0; right:0;} .recruit-wr .tx03{ position:relative; padding:0; margin:80px 0 0 0;} .recruit-wr .tx03 h4{ font-size:24px; color:#333; font-weight:600; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; margin:0 0 20px;} .recruit-wr .tx03 h5{ font-size:20px; color:#333; font-weight:600; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; margin:30px 0 10px;} .recruit-wr .tx04{ font-size:16px; } .recruit-wr .tx04 p{ font-size:14px;} .recruit01-wr{ position:relative; background-color:#fff; padding:80px 49px; border:#e8ecf2 1px solid;} .recruit01-wr .tx01{ position:relative; font-size:24px; color:#333; padding:45px 0; line-height:1.5; margin:0; text-align:center; font-weight:600; border:#dedede 1px solid; background-color:#fbfcfd; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .recruit01-wr .tx01>p{ font-size:16px; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; color:#333; } .recruit01-wr .tx01:after{ content:""; position:absolute; bottom:16px; left:50%; margin-left:-7px; border:#fff 4px solid; width:15px; height:15px; display:block; background-color:#e00529; } .recruit01-wr .tx02{ position:relative; text-align:center; margin:70px 0 0; padding:0 0 60px 0;} .recruit01-wr .tx02:before{ content:""; position:absolute; top:0; left:261px; width:578px; height:1px; background-color:#ccc; display:block;} .recruit01-wr .tx02:after{ content:""; position:absolute; bottom:0; left:261px; width:578px; height:20px; border:#ccc 1px solid; border-top:none; display:block;} .recruit01-wr .tx02 li{ position:relative; display:inline-block; margin:0 22px; padding:36px 0 0 0;} .recruit01-wr .tx02 li:before{ content:""; position:absolute; top:0; left:50%; width:1px; height:21px; background-color:#ccc; display:block; } .recruit01-wr .tx02 li:nth-child(2):before{ height:108px; top:-86px;} .recruit01-wr .tx02 li strong{ width:241px; height:265px; background:url(../images/corp/recruit01_img01.png) 50% 0 no-repeat; display:block; text-align:center; padding:154px 0 0 0; color:#121212; font-size:20px; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .recruit01-wr .tx02 li span{ font-size:14px; display:block;} .recruit01-wr .tx02 li:nth-child(2) strong{ background:url(../images/corp/recruit01_img02.png) 50% 0 no-repeat;} .recruit01-wr .tx02 li:nth-child(3) strong{ background:url(../images/corp/recruit01_img03.png) 50% 0 no-repeat;} .recruit01-wr h4{ color:#121212; font-size:24px;} .recruit01-wr .tx03{ position:relative; width:848px; margin:0 auto; padding:92px 0 0 0; height:690px;} .recruit01-wr .tx03:before{ content:""; position:absolute; display:block; top:129px; left:50%; margin-left:-2px; width:7px; height:7px; background-color:#e00529; z-index:7;} .recruit01-wr .tx03 dl{ position:absolute; top:92px; width:380px;} .recruit01-wr .tx03 dl.tx0301{ left:0;} .recruit01-wr .tx03 dl.tx0301:before{ content:""; position:absolute; background-color:#ccc; height:1px; width:90px; display:block; top:40px; left:380px;} .recruit01-wr .tx03 dl.tx0302{ right:0;} .recruit01-wr .tx03 dl.tx0302:before{ content:""; position:absolute; background-color:#ccc; height:125px; width:1px; display:block; top:-93px; left:-43px;} .recruit01-wr .tx03 dl dt{ height:96px; background-color:#ff783c; color:#fff; padding:20px 0 0 0; font-size:20px; text-align:center; font-weight:600; margin:0 0 35px 0;} .recruit01-wr .tx03 dl dt:before{ content:""; width:34px; height:24px; margin:0 auto 6px; display:block; background-repeat:no-repeat; background-position:50% 50%;} .recruit01-wr .tx03 dl dd{ position:relative; border:#ccc 1px solid;} .recruit01-wr .tx03 dl dd+dd{ margin-top:20px;} .recruit01-wr .tx03 dl dd.m1:before{ content:""; position:absolute; width:7px; height:7px; background-color:#ccc; display:block; top:-27px; left:50%; margin:0 0 0 -3px;} .recruit01-wr .tx03 dl dd:after{ content:""; position:absolute; width:1px; height:20px; top:-21px; left:50%; background-color:#ccc; display:block;} .recruit01-wr .tx03 dl.tx0301 dt:before{ background-image:url(../images/corp/recruit01_img04.png);} .recruit01-wr .tx03 dl.tx0302 dt:before{ background-image:url(../images/corp/recruit01_img05.png);} .recruit01-wr .tx03 dl.tx0301 dd{ height:141px;} .recruit01-wr .tx03 dl.tx0301 dd strong{ height:48px; border-bottom:#ccc 1px solid; line-height:48px; font-size:18px; color:#333; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; display:block; text-align:center; background-color:#f9fafc;} .recruit01-wr .tx03 dl.tx0301 dd div{ padding:25px 0 0 0; text-align:center;} .recruit01-wr .tx03 dl.tx0302 dd{ padding:30px 25px; background-color:#f9fafc;} .recruit01-wr .tx03 dl.tx0302 dd ul li{ text-indent:-15px; padding:0 0 0 15px;} .recruit01-wr .tx03 dl.tx0302 dd ul li+li{ margin-top:5px;} .recruit02-wr{ position:relative; background-color:#fff; padding:50px 49px 100px; border:#e8ecf2 1px solid;} .recruit02-wr h4{ color:#121212; font-size:24px; margin:0;} .recruit02-wr .process{ position:relative; height:190px; margin:30px 0 0 0; background-color:#f9fafc;} .recruit02-wr .process:before{ content:""; position:absolute; top:87px; left:30px; right:30px; display:block; background-color:#ccc; height:1px;} .recruit02-wr .process li{ position:absolute; top:38px; width:70px; text-align:center;} .recruit02-wr .process li:before{ content:""; position:absolute; top:42px; left:50%; margin-left:-6px; width:13px; height:13px; border:#f9fafc 3px solid; background-color:#e00529; display:block;} .recruit02-wr .process li:nth-child(1){ left:65px;} .recruit02-wr .process li:nth-child(2){ left:245px;} .recruit02-wr .process li:nth-child(3){ left:425px;} .recruit02-wr .process li:nth-child(4){ left:605px;} .recruit02-wr .process li:nth-child(5){ left:785px;} .recruit02-wr .process li:nth-child(6){ left:965px;} .recruit02-wr .process li i{ display:block; text-align:center; margin:0 0 45px 0;} .recruit02-wr .process li span{ display:block; text-align:center; font-size:16px;} .recruit02-wr .process02{ margin:0; padding:0 0 55px 0; border-bottom:#ccc 1px solid;} .recruit02-wr .process02:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .recruit02-wr .process02 dl{ position:relative; margin:60px 0 0 0; padding:45px 0 0 200px; float:left; width:50%;} .recruit02-wr .process02 dl:before{ content:""; position:absolute; top:0; left:0; width:172px; height:172px; display:block;} .recruit02-wr .process02 dl:nth-child(1):before{ background:url(../images/corp/recruit02_ic01.png) 50% 50% no-repeat;} .recruit02-wr .process02 dl:nth-child(2):before{ background:url(../images/corp/recruit02_ic02.png) 50% 50% no-repeat;} .recruit02-wr .process02 dl:nth-child(3):before{ background:url(../images/corp/recruit02_ic03.png) 50% 50% no-repeat;} .recruit02-wr .process02 dl:nth-child(4):before{ background:url(../images/corp/recruit02_ic04.png) 50% 50% no-repeat;} .recruit02-wr .process02 dl:nth-child(5):before{ background:url(../images/corp/recruit02_ic05.png) 50% 50% no-repeat;} .recruit02-wr .process02 dl:nth-child(6):before{ background:url(../images/corp/recruit02_ic06.png) 50% 50% no-repeat;} .recruit02-wr .process02 dl:nth-child(odd){ clear:both;} .recruit02-wr .process02 dl dt{ font-size:20px; color:#333; margin:0 0 10px 0; font-weight:600; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; line-height:22px;} .recruit02-wr .process02 dl dt i{ display:inline-block; margin:0 4px 0 0; vertical-align:middle;} .recruit02-wr .process02 dl ul{ margin:30px 0 0 0;} .recruit02-wr .process02 dl ul li+li{ margin:10px 0 0 0;} .recruit02-wr .process02 dl ul li{ padding:0 0 0 10px;} .recruit02-wr .process02 dl ul li strong{ margin:0 0 0 -10px; display:block;} .recruit02-wr .process02 dl ul li strong:before{ content:""; width:2px; height:2px; background-color:#333; display:inline-block; vertical-align:middle; margin:0 7px 0 0;} .recruit02-wr .process02 dl .mail{ color:#e00529;} .recruit02-wr .recruit-mail{ margin:10px 0 0 0; } .recruit02-wr .recruit-mail:before{ content:""; display:inline-block; vertical-align:middle; margin:0 8px 0 0; width:17px; height:17px; background:url(../images/common/icon_exc2.png) 50% 50% no-repeat;} .recruit02-wr .btn-box{ margin-top:20px;} .recruit03-wr{ position:relative; background-color:#fff; padding:50px 49px 100px; border:#e8ecf2 1px solid;} .recruit03-wr h4{ color:#121212; font-size:24px; margin:0 0 20px 0;} .recruit03-wr .tx01{ margin:0 0 80px 0; font-size:16px;} .recruit03-wr .tx01 .thum{ margin:50px 0 0 0;} .recruit03-wr .tx02{ font-size:16px;} .recruit03-wr .tx02>ul{ margin:10px 0 0 -16px; overflow:hidden;} .recruit03-wr .tx02>ul>li{ margin:17px 0 0 16px; padding:18px 0 0 0; width:356px; height:245px; float:left; border:#dedede 1px solid;} .recruit03-wr .tx02>ul>li:nth-child(4), .recruit03-wr .tx02>ul>li:nth-child(5), .recruit03-wr .tx02>ul>li:nth-child(6){ height:268px;} .recruit03-wr .tx02>ul>li:before{ content:""; width:90px; height:80px; margin:0 auto; display:block;} .recruit03-wr .tx02>ul>li:nth-child(1):before{ background:url(../images/corp/recruit03_ic1.png) 50% 50% no-repeat;} .recruit03-wr .tx02>ul>li:nth-child(2):before{ background:url(../images/corp/recruit03_ic2.png) 50% 50% no-repeat;} .recruit03-wr .tx02>ul>li:nth-child(3):before{ background:url(../images/corp/recruit03_ic3.png) 50% 50% no-repeat;} .recruit03-wr .tx02>ul>li:nth-child(4):before{ background:url(../images/corp/recruit03_ic4.png) 50% 50% no-repeat;} .recruit03-wr .tx02>ul>li:nth-child(5):before{ background:url(../images/corp/recruit03_ic5.png) 50% 50% no-repeat;} .recruit03-wr .tx02>ul>li:nth-child(6):before{ background:url(../images/corp/recruit03_ic6.png) 50% 50% no-repeat;} .recruit03-wr .tx02>ul>li strong{ display:block; text-align:center; font-size:18px; color:#e00529;} .recruit03-wr .tx02>ul>li ul{ padding:10px 0 0 95px;} .recruit03-wr .tx02>ul>li ul li{ font-size:14px;} .recruit03-wr .tx02>ul>li ul li+li{ margin-top:5px;} /************************************************ creation ************************************************/ .rnd-bx{ width:1200px; margin:0 auto; padding:0 0 100px 0; background-color:#fff; border:#e8ecf2 1px solid; } .rnd-bx:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .rnd-bx>div>img{ display:block;} .rnd-bx .tBx{ position:relative; padding:60px 49px 70px; font-size:16px; color:#222; } .rnd-bx .tBx h4{ color:#121212; font-weight:600; margin:0 0 30px 0; line-height:1; font-size:34px;} .rnd-bx .rnd-tx01{ float:left; width:525px; margin:0 0 0 49px;} .rnd-bx .rnd-tx01 h5, .rnd-bx .rnd-tx02 h5{ font-size:24px; color:#121212; margin:0 0 30px 0;} .rnd-bx .rnd-tx01 ul li{ position:relative; border-bottom:#e6eaed 1px solid; padding:20px 0 20px 85px; font-size:16px;} .rnd-bx .rnd-tx01 ul li i{ position:absolute; top:15px; left:10px; font-size:20px; color:#e00529; font-weight:bold; } .rnd-bx .rnd-tx02{ float:right; width:525px; margin:0 49px 0 0;} .rnd-bx .rnd-tx02 .grp{ position:relative; height:395px;} .rnd-bx .rnd-tx02 .grp:before{ content:""; position:absolute; top:194px; left:0; width:100%; display:block; height:2px; background-color:#ccc;} .rnd-bx .rnd-tx02 .grp>span{ position:absolute; width:64px; font-size:13px; display:inline-block; right:0; padding:0 5px; line-height:1.4; text-align:right; color:#666;} .rnd-bx .rnd-tx02 .grp>span.cost{ top:50%; margin-top:-30px;} .rnd-bx .rnd-tx02 .grp>span.per{ top:50%; margin-top:10px;} .rnd-bx .rnd-tx02 .grp>dl{ position:absolute; width:81px; height:395px;} .rnd-bx .rnd-tx02 .grp>dl.m1{ top:0; left:85px;} .rnd-bx .rnd-tx02 .grp>dl.m2{ top:0; left:216px;} .rnd-bx .rnd-tx02 .grp>dl.m3{ top:0; left:344px;} .rnd-bx .rnd-tx02 .grp>dl dt{ position:absolute; top:50%; left:0; color:#121212; margin-top:-10px; text-align:center; width:81px; font-size:34px; font-family:Lucida Grande; z-index:2;} .rnd-bx .rnd-tx02 .grp>dl dd{ width:81px; height:395px;} .rnd-bx .rnd-tx02 .grp>dl dd p{ position:absolute; width:81px; } .rnd-bx .rnd-tx02 .grp>dl dd p em{ position:absolute; top:-9999px; left:-9999px;} .rnd-bx .rnd-tx02 .grp>dl dd p.cost{ bottom:200px; background:url(../images/creat/rnd_grp01.png) 50% 0 no-repeat;} .rnd-bx .rnd-tx02 .grp>dl dd p.cost span{ position:absolute; bottom:10px; left:0; width:100%; display:block; font-size:18px; color:#fff; text-align:center; letter-spacing:-0.05em;} .rnd-bx .rnd-tx02 .grp>dl dd p.cost span strong{ font-size:34px; letter-spacing:-0.1em; font-weight:400; } .rnd-bx .rnd-tx02 .grp>dl dd p.per{ top:196px; background:url(../images/creat/rnd_grp03.png) 50% 100% no-repeat; } .rnd-bx .rnd-tx02 .grp>dl dd p.per span{ position:absolute; bottom:-50px; left:0; width:100%; display:block; color:#888; font-size:18px; text-align:center;} .rnd-bx .rnd-tx02 .grp>dl dd p.per span strong{ font-size:28px; letter-spacing:-0.1em;} .rnd-bx .rnd-tx02 .grp>dl.m1 dd p.cost{ height:152px; background:url(../images/creat/rnd_grp02.png) 50% 0 no-repeat;} .rnd-bx .rnd-tx02 .grp>dl.m1 dd p.per{ height:57px;} .rnd-bx .rnd-tx02 .grp>dl.m2 dd p.cost{ height:113px; background:url(../images/creat/rnd_grp02.png) 50% 0 no-repeat;} .rnd-bx .rnd-tx02 .grp>dl.m2 dd p.per{ height:106px;} .rnd-bx .rnd-tx02 .grp>dl.m3 dd p.cost{ height:194px;} .rnd-bx .rnd-tx02 .grp>dl.m3 dd p.per{ height:154px;} .rnd-bx2{ width:1200px; margin:80px auto 0; background-color:#fff; border:#e8ecf2 1px solid; padding:0 0 100px; overflow: hidden; } .rnd-bx2 .tab{ overflow:hidden; border-bottom:#e5e5e5 1px solid;} .rnd-bx2 .tab li{ float:left; width:50%;} .rnd-bx2 .tab li a{ position:relative; line-height:68px; display:block; text-align:center; font-size:16px; color:#555; font-weight:600;} .rnd-bx2 .tab li.active a{ color:#e00529;} .rnd-bx2 .tab li a:before{ content:""; position:absolute; top:50%; left:0; margin-top:-8px; width:1px; height:16px; background-color:#e5e5e5; display:block;} .rnd-bx2 .tab li:first-child a:before{ display:none;} .rnd-bx2 .tab li a:hover:after, .rnd-bx2 .tab li.active a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:3px; background-color:#e00529; display:block; } .rnd-bx2 .tc{ padding:60px 49px 0;} .rnd-bx2 .tx01{ font-size:16px;} .rnd-bx2 h5{ margin:70px 0 0 0; color:#121212; font-size:24px;} .rnd-bx2 .tx02:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .rnd-bx2 .tx02 li{ margin:30px 0 0 0; width:48%; float:right; font-size:16px;} .rnd-bx2 .tx02 li strong{ display:block; color:#e00529; font-size:20px; margin:0 0 10px 0;} .rnd-bx2 .tx02 li:nth-child(odd){ clear:both; float:left;} .mobility-bx{ width:1200px; margin:0 auto; padding:0 0 100px 0; background-color:#fff; border:#e8ecf2 1px solid; } .mobility-bx>div>img{ display:block;} .mobility-bx .tBx{ position:relative; padding:60px 49px 70px; font-size:16px; color:#222; } .link .link-bx { padding:0px 49px; } .link .link-bx ul { overflow: hidden; background: #eff1f3; padding: 0 100px; } .link .link-bx ul li { width: 33.3333%; text-align: center; float: left; padding: 30px 0; } .link .link-bx ul li a{ display: inline-block; color: #5d6a7a; font-size: 16px; vertical-align: middle; } .link .link-bx ul li img { margin-right: 9px; } .link .link-bx ul li span { position: relative; top: -20px; } .mobility-bx.link .link-bx ul li { width: 50%; } .semiconductor-bx.link .link-bx ul { padding: 0 20px; } .semiconductor-bx.link .link-bx ul li { width: 50%; } .eco-bx.link .link-bx ul li { width: 50%; } .eco-bx{ width:1200px; margin:0 auto; padding:0 0 100px 0; background-color:#fff; border:#e8ecf2 1px solid; } .eco-bx>div>img{ display:block;} .eco-bx .tBx{ position:relative; padding:60px 49px 70px; font-size:16px; color:#222; } .semiconductor-bx{ width:1200px; margin:0 auto; padding:0 0 100px 0; background-color:#fff; border:#e8ecf2 1px solid; } .semiconductor-bx>div>img{ display:block;} .semiconductor-bx .tBx{ position:relative; padding:60px 49px 70px; font-size:16px; color:#222; } .film-bx{ width:1200px; margin:0 auto;} .film-bx>div>img{ display:block;} .film-bx .tBx{ position:relative; padding:60px 50px 80px; background-color:#fff; font-size:16px; color:#222; border:#e8ecf2 1px solid; border-top:none; border-bottom:none;} .film-bx .tBx h4{ color:#121212; font-weight:600; margin:0 0 30px 0; line-height:1; font-size:34px;} .film-bx .tBx:after{ content:""; position:absolute; bottom:0; left:50px; display:block; background-color:#e4e4e5; height:1px; width:1100px; } .film-bx .film_img{ overflow:hidden; background-color:#fff; border:#e8ecf2 1px solid; border-top:none;} .film-bx .film_img img{ margin-left:-41px; width:1280px; max-width:1280px; height:800px;} .film-m02{ margin:0 0 -100px; padding:0 0 210px 0; background:url(../images/creat/film_bg.png) 0 100% no-repeat; padding:80px 0 215px;} .film-m02 .tx01{ display:table; width:1200px; margin:0 auto; font-size:16px; color:#111;} .film-m02 .tx01 dt{ width:360px; display:table-cell; vertical-align:top; font-size:24px; font-weight:600; color:#333; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .film-m02 .tx02{ width:1200px; margin:80px auto 65px; } .film-m02 .tx02:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .film-m02 .tx02 li{ position:relative; float:left; width:585px; margin:0 0 30px 0;} .film-m02 .tx02 li .thum{ display:block;} .film-m02 .tx02 li .thum img{ display:block;} .film-m02 .tx02 li:nth-child(2){ float:right;} .film-m02 .tx02 li:nth-child(4){ background:#fff; width:615px;} .film-m02 .tx02 li:nth-child(4) .thum{ float:right;} .film-m02 .tx02 li>h4{ position:absolute; top:30px; lefT:40px; color:#333; font-size:22px;} .film-m02 .tx02 li div span{ position:absolute; color:#333; font-size:24px; font-weight:600; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .film-m02 .tx02 li div span strong{ font-size:60px; line-height:1; letter-spacing:-0.05em;font-weight:400; font-family:Lucida Grande;} .film-m02 .tx02 li div span em{ display:block; color:#e00529; font-size:18px;} .film-m02 .tx02 li div span.p-cnt01{ top:180px; left:342px; } .film-m02 .tx02 li div span.p-cnt021{ top:96px; left:270px; } .film-m02 .tx02 li div span.p-cnt022{ top:96px; left:458px; } .film-m02 .tx02 li div span.p-cnt023{ top:220px; left:270px; } .film-m02 .tx02 li div span.p-cnt024{ top:220px; left:458px; } .film-m02 .tx03{ width:1200px; margin:120px auto 0; text-align:right;} .film-m02 .tx03 li{ display:inline-block; width:300px; text-align:left; vertical-align:top;} .film-m02 .tx03 li h4{ color:#111; font-size:30px; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .film-m02 .tx03 li h4 span{ color:#e00529; font-size:40px;} .film-m02 .tx03 li h4 span strong{ font-size:80px; font-weight:400; } .film-m02 .tx03 li div{ font-size:16px; color:#111; line-height:2;} .chem-bx{ width:1200px; margin:0 auto; background-color:#fff;} .chem-bx>div>img{ display:block;} .chem-bx .tBx{ position:relative; padding:60px 50px 80px; background-color:#fff; font-size:16px; color:#222; border:#e8ecf2 1px solid; border-top:none; border-bottom:none;} .chem-bx .tBx h4{ color:#121212; font-weight:600; margin:0 0 30px 0; line-height:1; font-size:34px;} .chem-bx .tBx:after{ content:""; position:absolute; bottom:0; left:50px; display:block; background-color:#e4e4e5; height:1px; width:1100px; } .chem-bx>h4{ background-color:#fff; color:#121212; font-weight:600; padding:80px 49px 0; line-height:1; font-size:24px; border:#e8ecf2 1px solid; border-top:none; border-bottom:none;} .chem-bx .chem_img{ overflow:hidden; background-color:#fff; border:#e8ecf2 1px solid; border-top:none;} .chem-bx .chem_img img{ width:100%; max-width:100%; height:auto;} /* jj */ .chem-m02{ margin:0 0 -100px; padding:0 0 210px 0;/* background:url(../images/creat/chem_bg.png) 0 100% no-repeat;*/ padding:80px 0 215px;} .chem-m02 .tx01{ display:table; width:1200px; margin:0 auto; font-size:16px; color:#111;} .chem-m02 .tx01 dt{ width:360px; display:table-cell; vertical-align:top; font-size:24px; font-weight:600; color:#333; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .chem-m02 .tx02{ width:1200px; margin:80px auto 65px; } .chem-m02 .tx02:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .chem-m02 .tx02 li{ position:relative; float:left; width:585px; margin:0 0 30px 0;} .chem-m02 .tx02 li .thum{ display:block;} .chem-m02 .tx02 li .thum img{ display:block;} .chem-m02 .tx02 li:nth-child(2){ float:right;} .chem-m02 .tx02 li:nth-child(4){ background:#fff; width:615px;} .chem-m02 .tx02 li>h4{ position:absolute; top:30px; lefT:40px; color:#333; font-size:22px;} .chem-m02 .tx02 li div span{ position:absolute; color:#333; font-size:24px; font-weight:600; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .chem-m02 .tx02 li div span strong{ font-size:60px; line-height:1; letter-spacing:-0.05em;font-weight:400; font-family:Lucida Grande;} .chem-m02 .tx02 li div span em{ display:block; color:#e00529; font-size:16px; text-transform:uppercase; color:#888; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .chem-m02 .tx02 li div span.p-cnt01{ top:145px; left:342px; } .chem-m02 .tx02 li div span.p-cnt02{ top:145px; left:920px; } .chem-m02 .tx02 li div span:before{ content:""; position:absolute; top:-20px; left:-257px; width:156px; height:113px; display:block; background:url(../images/creat/chem_chart03.jpg) 50% 50% no-repeat; } .chem-m02 .tx02 li:nth-child(3){ width:100%; height:334px; border:#e8ecf2 1px solid; background-color:#fff;} .chem-m02 .tx03{ width:1200px; margin:120px auto 0; text-align:right;} .chem-m02 .tx03 li{ display:inline-block; width:300px; text-align:left; vertical-align:top;} .chem-m02 .tx03 li h4{ color:#111; font-size:30px; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .chem-m02 .tx03 li h4 span{ color:#e00529; font-size:40px;} .chem-m02 .tx03 li h4 span strong{ font-size:80px; font-weight:400; } .chem-m02 .tx03 li div{ font-size:16px; color:#111; line-height:2;} .electron-bx{ width:1200px; margin:0 auto;} .electron-bx>div>img{ display:block;} .electron-bx .tBx{ position:relative; padding:60px 50px 80px; background-color:#fff; font-size:16px; color:#222; border:#e8ecf2 1px solid; border-top:none; border-bottom:none;} .electron-bx .tBx h4{ color:#121212; font-weight:600; margin:0 0 30px 0; line-height:1; font-size:34px;} .electron-bx .tBx:after{ content:""; position:absolute; bottom:0; left:50px; display:block; background-color:#e4e4e5; height:1px; width:1100px; } .electron-bx .electron_img{ overflow:hidden; background-color:#fff; border:#e8ecf2 1px solid; border-top:none;} .electron-bx .electron_img img{ margin-left:-41px; width:1280px; max-width:1280px; height:800px;} .electron-m02{ margin:0 0 -100px; padding:0 0 210px 0; padding:80px 0 100px;} .electron-m02 .tx01{ display:table; width:1200px; margin:0 auto; font-size:16px; color:#111;} .electron-m02 .tx01 dt{ width:360px; display:table-cell; vertical-align:top; font-size:24px; font-weight:600; color:#333; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .contents.creation{ width:1200px; margin:0 auto;} .contents.creation>.inner{ background-color:#fff; padding:60px 50px; border:#e8ecf2 1px solid; } .contents.creation .creat-tit{ display:block; width:100%; padding:0;} .contents.creation .creat-tit h4{ display:block; font-size:33px; color:#333; line-height:1.2; margin:0 0 30px 0; font-weight:400;} .contents.creation .creat-tit .tbx{ display:block; vertical-align:top; font-size:16px; color:#333;} .contents.creation .creat-tit .tbx .lg{ font-size:20px; font-weight:600; color:#333; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; margin:30px 0 10px;} .contents.creation h4.h4-tit{ font-size:24px; color:#333; font-weight:600; line-height:1; margin:80px 0 25px;} .contents.creation .decs { margin-top: 15px; font-size: 15px; } .contents.creation .btn-wrap.link a { margin-top: 16px; width: calc(33% - 10px); } .contents.creation .btn-wrap.link a + a { margin-left: 16px; } .contents.creation .btn-wrap.link a:nth-child(3n+1) { margin-left: 0; } .creat-case{ padding:0px; margin:-20px 0 0 -1.5%; text-align:center;} .creat-case:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .creat-case>.item{ display:inline-block; width: 352px; text-align:center; margin:20px 0 0 1.5%; float:left;} .creat-case>.item span{ display:block; text-align:center;} .creat-case>.item .thum{ border:#e2e2e2 1px solid; width: 352px; height: 264px; } .creat-case>.item .thum img{ display:block; width: 100%; height: 100%; } .creat-case>.item .tbx{ font-size:16px; color:#333; margin-top:10px; text-align:left;} .creat-use{ margin:-9px 0 0 -1%;} .creat-use:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .creat-use>.item{ float:left; display:table; background-color:#fff; width:24%; height:84px; margin:9px 0 0 1%;} .creat-use>.item>span{ display:table-cell; width:100%; height:82px; border:#dedede 1px solid; text-align:center; vertical-align:middle; font-size:18px; color:#333; font-weight:600;} .creat-use.big>.item>span {height:150px; padding:5px 10px;} .creat-use.img .item {display:block;height:430px;text-align:center;} .creat-use.img .item span:first-of-type {display:block;line-height:82px;} .creat-use.img .item .img-bx {display:flex; justify-content:center; align-items:center; height:calc(100% - 82px); border:0;} .creat-use.img .item img {vertical-align: middle;} .creat-cert{ padding:0; background:#fff; text-align:left; margin:0 0 0 -15px;} .creat-cert:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .creat-cert .item{ display:block; width:70px; height:62px; margin:10px 0 10px 15px; float:left;} .creat-cert .item .thum{ display:block; width:70px;} .creat-cert .item .tbx{ display:table-cell; vertical-align:middle; font-size:20px; color:#333; text-align:left; padding:0 14px;} .creat-pack{ padding:0; background:#fff; text-align:left; } .creat-pack:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .creat-pack .item{ display:table; width:100%; height:62px; margin:10px 0; float:left;} .creat-pack .item .thum{ display:table-cell; width:70px;} .creat-pack .item .tbx{ display:table-cell; vertical-align:middle; font-size:20px; color:#333; text-align:left; padding:0 14px;} .creat-video > .item { width: 64%; display: inline-block; } .creat-video.iframe { height: 390px; } .creat-video.iframe iframe { margin-top: -22px; } /************************************************ bbs ************************************************/ table.data{ width:100%; border-collapse:collapse; *border-collapse:collapse; border-spacing:0px; clear:both; table-layout:auto; border-top:#333 2px solid; background-color:#fff;} table.data thead th{ border-bottom:#e1e3e6 1px solid; border-left:#e1e3e6 1px solid; padding:15px 10px; color:#333; font-size:15px; font-weight:400; vertical-align:middle; text-align:center; background-color:#eceef1;} table.data tbody td{ border-bottom:#e1e3e6 1px solid; border-left:#e1e3e6 1px solid; padding:15px 10px; color:#333; font-size:15px; vertical-align:middle; text-align:center;} table.data .brdL-n{ border-left:none;} table.data .l{ padding-left:20px;} table.data .cost{ text-align:right; padding-right:30px;} table.data .total td{ background-color:#f9fafc; font-weight:600;} table.data tr:last-child td{ border-bottom:#acacac 1px solid;} table.list{ width:100%; border-collapse:separate; *border-collapse:collapse; border-spacing:0px; clear:both; table-layout:fixed; border-top:#333 2px solid; background-color:#fff;} table.list thead th{ border-bottom:#c8cace 1px solid; padding:15px 0; color:#333; font-size:15px; font-weight:400; vertical-align:middle; text-align:center;} table.list tbody td{ border-bottom:#eee 1px solid; padding:15px 0; color:#333; font-size:15px; vertical-align:middle; text-align:center;} table.list tbody td.subject{ text-align:left;} table.list tbody td.subject a:hover{ text-decoration:underline;} .faq-bx{ border-top:#3b3b3b 1px solid; border-bottom:#3b3b3b 1px solid; padding:0 0 1px 0;} .faq-bx>dt{ position:relative; padding:18px 30px 18px 50px; color:#333; font-size:16px; border-top:#d5d5d5 1px solid;} .faq-bx>dt:first-child{ border-top:none;} .faq-bx>dt>a{ display:block; color:#333; font-size:16px;} .faq-bx>dt>strong{ position:absolute; top:18px; left:20px; color:#e0002a; font-size:24px; line-height:1;} .faq-bx>dt.active>a{ color:#e00529;} .faq-bx>dt:after{ content:""; width:10px; height:6px; position:absolute; top:50%; right:20px; margin-top:-3px; display:block; background:url(../images/common/blt_down_s.png);} .faq-bx>dt.active:after{ background:url(../images/common/blt_up_s.png) 50% 50% no-repeat;} .faq-bx>dd{ display:none; position:relative; z-index:2; background-color:#f9fafc; padding:25px 40px; font-size:16px; color:#333; margin-bottom:-1px;} /* paging */ div.paging{ text-align:center; padding:0; margin:35px 0 0 0; position:relative; clear:both;} div.paging a, div.paging span{ display:inline-block; width:32px; height:32px; line-height:32px; text-align:center; margin:0; vertical-align:middle;} div.paging a:hover, div.paging a.on{ color:#c3121e; font-weight:600;} div.paging .direction{ position:relative; text-indent:-9999px; border:#dbdbdb 1px solid; } div.paging .direction:hover{ border:#dedede 1px solid; z-index:2;} div.paging .direction.first{ background:#fff url(../images/common/paging_first.png) 50% 50% no-repeat;} div.paging .direction.prev{ background:#fff url(../images/common/paging_prev.png) 50% 50% no-repeat; margin-right:20px;} div.paging .direction.next{ background:#fff url(../images/common/paging_next.png) 50% 50% no-repeat; margin-left:20px;} div.paging .direction.last{ background:#fff url(../images/common/paging_last.png) 50% 50% no-repeat;} /* /paging */ /* view-tbl */ .view-tbl{ border:#e8ecf2 1px solid; border-top:#333 2px solid; background-color:#fff;} .view-tbl .hd{ padding:30px 50px 35px; border-bottom:#e8ecf2 1px solid;} .view-tbl .hd .tit{ font-size:26px; color:#333;} .view-tbl .hd .hd-tx{ margin-top:10px; font-size:13px;} .view-tbl .hd .hd-tx span{ display:inline-block;} .view-tbl .hd .hd-tx span strong{ font-weight:400; color:#333; display:inline-block; margin-right:10px;} .view-tbl .hd .hd-tx span+span{ margin-left:25px;} .view-tbl .hd .hd-tx span+span{ margin-left:25px;} .view-tbl .hd .hd-tx span.file{ float:right;} .view-tbl .hd .hd-tx span.file a{ position:relative; display:inline-block; padding:0 32px 0 0;} .view-tbl .hd .hd-tx span.file a:after{ content: ""; position: absolute; top: 50%; right: 0; margin-top: -9px; width: 18px; height: 18px; background: url(../images/common/icon_dw_sm_on.png) 50% 50% no-repeat; display: block; border: #e0002a 1px solid;} .view-tbl .con{ padding:35px 50px 60px; font-size:16px;} .view-tbl .con .gallery-top, .view-tbl .con .gallery-thumbs { position: relative } .view-tbl .con .gallery-top .swiper-slide { position: relative; text-align: center; height: 613px; } .view-tbl .con .gallery-top .swiper-slide img { position: absolute; left: 50%; top: 50%; height: 100%; transform: translate(-50% , -50%); -webkit-transform: translate(-50% , -50%); -moz-transform: translate(-50% , -50%); -ms-transform: translate(-50% , -50%); -o-transform: translate(-50% , -50%); } .view-tbl .con .gallery-top .swiper-slide .dw-img { position: absolute; right: 20px; bottom: 20px; width: 60px; height: 60px; background-color: rgba(255,255,255,0.4); background-image: url(../images/common/icon_dw02.png); background-position: center; background-repeat: no-repeat; } .view-tbl .con .gallery-thumbs { margin-top: 35px; } .view-tbl .con .gallery-thumbs .swiper-slide button { display: block; width: 100%; } .view-tbl .con .gallery-thumbs .swiper-button-next , .view-tbl .con .gallery-thumbs .swiper-button-prev { width: 23px; height: 23px; margin-top: 0; background-image: none; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .view-tbl .con .gallery-thumbs .swiper-button-next::after , .view-tbl .con .gallery-thumbs .swiper-button-prev::after { content: ""; position: absolute; left: 0; top: 50%; width: 23px; height: 23px; border-style: solid; border-width: 3px 3px 0 0; border-color: #000000; } .view-tbl .con .gallery-thumbs .swiper-button-next::after { transform: translateY(-50%) rotate(45deg); -webkit-transform: translateY(-50%) rotate(45deg); -moz-transform: translateY(-50%) rotate(45deg); -ms-transform: translateY(-50%) rotate(45deg); -o-transform: translateY(-50%) rotate(45deg); } .view-tbl .con .gallery-thumbs .swiper-button-prev::after { transform: translateY(-50%) rotate(-135deg); -webkit-transform: translateY(-50%) rotate(-135deg); -moz-transform: translateY(-50%) rotate(-135deg); -ms-transform: translateY(-50%) rotate(-135deg); -o-transform: translateY(-50%) rotate(-135deg); } .view-tbl .con .gallery-thumbs .swiper-button-next { right: 70px; } .view-tbl .con .gallery-thumbs .swiper-button-prev { left: 70px; } .view-tbl .con .gallery-thumbs .swiper-container { margin: 0 auto; max-width: 868px; height: 116px; } .view-tbl .con .gallery-thumbs .swiper-container .swiper-slide { opacity: 0.4; cursor: pointer; } .view-tbl .con .gallery-thumbs .swiper-container .swiper-slide.clicked { opacity: 1; } .view-tbl .con .btn-wrap { margin-top: 40px; } .view-tbl .con .btn-wrap .dw-all { position: relative; display: block; border: #ccc 1px solid; line-height: 72px; height: 72px; padding: 0 40px 0 30px; font-size: 18px; color: #333; font-weight: 600; width: 310px; text-align: left; margin: 0 auto; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .view-tbl .con .btn-wrap .dw-all::after { content: ""; position: absolute; top: 50%; right: 30px; margin-top: -7px; width: 13px; height: 15px; display: block; background: url(../images/common/icon_dw.png) 50% 50% no-repeat; transform: translateX(-50%); } .view-tbl .con .btn-wrap .dw-all:hover { color: #ec4949; border: #ec4949 1px solid; } .view-tbl .con .btn-wrap .dw-all:hover::after { background: url(../images/common/icon_dw_on.png) 50% 50% no-repeat; } .view-tbl .con .gallery-thumbs .swiper-button-next:hover::after , .view-tbl .con .gallery-thumbs .swiper-button-prev:hover::after { border-color: #df022b; } /* 이전글/다음글 */ .viewBottomList ul{ display:block; width:100%;} .viewBottomList .viewBottomPrev{display:block; padding:0 10px 0 150px; height:58px; line-height:58px; position:relative; border-top:#e8ecf2 1px solid;} .viewBottomList .viewBottomNext{display:block; padding:0 10px 0 150px; height:58px; line-height:58px; position:relative; border-top:#e8ecf2 1px solid;} .viewBottomList .orderPrev{ vertical-align:middle; position:absolute; top:0; left:0; width:150px; line-height:58px; padding-left:30px; font-size:14px; color:#333;} .viewBottomList .orderNext{ vertical-align:middle; position:absolute; top:0; left:0; width:150px; line-height:58px; padding-left:30px; padding-right:0; font-size:14px; color:#333;} .viewBottomList .orderPrev:after{ content:""; position:absolute; top:0; right:35px; display:block; width:10px; height:58px; background:url(../images/common/blt_arr_up.png) 50% 50% no-repeat;} .viewBottomList .orderNext:after{ content:""; position:absolute; top:0; right:35px; display:block; width:10px; height:58px; background:url(../images/common/blt_arr_down.png) 50% 50% no-repeat;} .viewBottomList a{ text-overflow:ellipsis; overflow:hidden; display:block; white-space:nowrap; height:58px; line-height:58px;} .viewBottomList .viewBottomPrev:hover a, .viewBottomList .viewBottomNext:hover a{ color:#222; text-decoration:underline;} /* list-typ01 */ .list-typ01:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .list-typ01 .item{ position:relative;} .list-typ01 .item .thum{ display:table-cell; width:206px; overflow:hidden;} .list-typ01 .item .thum img{ display:block; width:206px; height:130px; transition:all .3s ease;} .list-typ01 .item .tbx{ border:#e8ecf2 1px solid; border-left:none; display:table-cell; height:130px; padding:25px 130px 0 40px; vertical-align:top;} .list-typ01 .item.no-img .tbx{ border-left:#e8ecf2 1px solid;} .list-typ01 .item .tbx .date{ position:absolute; width:130px; top:50%; right:0; margin-top:-0.5em; text-align:center; display:block; font-size:13px; } .list-typ01 .item .tbx .tit{ display:block; color:#333; font-size:16px;} .list-typ01 .item .tbx .txt{ display:block; font-size:14px; margin:10px 0 0 0; height:48px; overflow:hidden;} .list-typ01 .item a{ display:table; padding:0; width:100%; background-color:#fff;} .list-typ01 .item+.item{ margin-top:10px;} .list-typ01 .item a:hover .thum img{ transform:scale(1.1);} .list-typ01 .item a:hover .tbx .tit, .list-typ01 .item a:hover .tbx .txt{ text-decoration:underline;} .list-typ01.gallery{ margin:-27px 0 0 -27px;} .list-typ01.gallery .item{ width:382px; margin:27px 0 0 27px; float:left;} .list-typ01.gallery .item a{ display:block;} .list-typ01.gallery .item+.item{ margin-top:27px;} .list-typ01.gallery .item .thum{ display:block; width:100%; height:auto;} .list-typ01.gallery .item .thum img{ width:100%; height:auto;} .list-typ01.gallery .item .tbx{ display:block; height:auto; padding:28px; border:#e8ecf2 1px solid; border-top:none; } .list-typ01.gallery .item.no-img .tbx{ border-top:#e8ecf2 1px solid;} .list-typ01.gallery .item .tbx .date{ position:relative; width:100%; top:auto; right:auto; margin-top:20px; text-align:left; display:block; font-size:13px; } .list-typ01.gallery .item .tbx .tit.ellipsis { overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.2em; height: 2.4em; } .list-typ01.fixed .item .thum { position: relative; } .list-typ01.gallery.fixed .item .thum { padding-bottom: 56.25%; } .list-typ01.fixed .item .thum::after { content: ""; position: absolute; left: 0; top: 0; width: 40px; height: 40px; background-repeat: no-repeat; background-position: center; background-size: 40px; } .list-typ01.fixed .item .thum.thum-video::after { background-image: url(../images/common/icon_video.png); } .list-typ01.fixed .item .thum.thum-img::after { background-image: url(../images/common/icon_thumb.png); } .list-typ01.fixed .item .thum img{ position: absolute; left: 0; top: 50%; width: 100%; height: auto; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .list-typ01.fixed .item a:hover .thum img{ transform: translateY(-50%) scale(1.1); -webkit-transform: translateY(-50%) scale(1.1); -moz-transform: translateY(-50%) scale(1.1); -ms-transform: translateY(-50%) scale(1.1); -o-transform: translateY(-50%) scale(1.1); } .bntMore{ margin:30px 0 0 0;} .bntMore a{ width:50px; height:50px; display:block; margin:0 auto; background:#e00529 url('../images/common/blt_down.png') 50% 50% no-repeat; text-indent:-9999px;} /* div-tab */ .div-tab{ margin:0 0 40px; border:#e5e5e5 1px solid; background-color:#fff;} .div-tab ul:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .div-tab ul li{ float:left; width:33.3%;} .div-tab.tab4 ul li{ float:left; width:25.0%;} .div-tab ul li a{ position:relative; display:block; font-size:16px; color:#555; line-height:70px; text-align:center; font-weight:600;} .div-tab ul li.active a{ color:#e00529;} .div-tab ul li.active a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:3px; background-color:#e00529; display:block; } .div-tab ul li+li a:before{ content:""; position:absolute; width:1px; height:16px; top:50%; left:0; margin-top:-8px; background-color:#e5e5e5; display:block;} /* tbl-hd */ .tbl-hd{ position:relative; margin:0 0 15px 0;} .tbl-hd:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .tbl-hd .bbs-ic [class^="typ-"], .tbl-hd .bbs-ic [class*="typ-"]{ width:36px; height:36px; display:inline-block; border:#ccc 1px solid; background-repeat:no-repeat; background-position:50% 50%; background-color:#fff; text-indent:-9999px; cursor:pointer;} .tbl-hd .bbs-ic .typ-list{ background-image:url('../images/common/blt_bbs02.png');} .tbl-hd .bbs-ic .typ-gallery{ background-image:url('../images/common/blt_bbs01.png'); margin-left:4px;} .tbl-hd .bbs-ic .typ-list.on{ border-color:#e00529; background-image:url('../images/common/blt_bbs02_on.png');} .tbl-hd .bbs-ic .typ-gallery.on{ border-color:#e00529; background-image:url('../images/common/blt_bbs01_on.png');} .tbl-hd .right{ position:absolute; top:0; right:0;} .tbl-hd .sch-grp{ position:relative; width:260px; display:block; border:#b5b5b5 1px solid; padding:0 34px 0 105px; background-color:#fff;} .tbl-hd .sch-grp select.select{ position:absolute; top:0; left:0; display:inline-block; height:34px; line-height:34px; padding:0 25px 0 10px; min-width:104px; width:104px; border:none; border-radius:0; vertical-align:middle; box-sizing:border-box; -webkit-appearance:none; -moz-appearance:none; appearance:none; -webkit-rtl-ordering:logical; color:#666; font-size:13px; background:#fff url('../images/common/blt_select.png') no-repeat right center;} .tbl-hd .sch-grp select.select::-ms-expand{display:none;} .tbl-hd .sch-grp .input{ border:none; height:34px; width:100%;} .tbl-hd .sch-grp .btSch{ position:absolute; top:50%; right:0; margin-top:-17px; text-indent:-9999px; width:34px; height:34px; display:block; background:url('../images/common/blt_search.png') no-repeat 50% 50%;} /* bpopup */ .bPopup{ display: none; width:860px; background-color:#fff; position:absolute; top:0; z-index:10;} .bPopup .pop-tit{ font-size:20px; padding:0 30px; color:#fff; line-height:60px; height:60px; margin:0; background-color:#e00529; } /* .bPopup .pop-con{ padding:40px 30px;} */ .bPopup .bt-close{ position:absolute; top:17px; right:17px; text-indent:-9999px; width:28px; height:28px; background:#333 url(../images/common/bt_close.png) 50% 50% no-repeat; cursor:pointer;} .bPopup.open { display:block; } .bg_shadow { width:100%; height:100%; background: rgba(0,0,0,.8); position:absolute; top:0; z-index:100; } .dwLst{ border-top:#333 2px solid;} .dwLst li{ position:relative; border-bottom:#ccc 1px solid; display:table; width:100%;} .dwLst li .tit{ display:table-cell; width:180px; text-align:center; border-right:#ccc 1px solid; } .dwLst li a{ display:table-cell; position:relative; line-height:60px; padding:0 70px 0 36px;} .dwLst li a:before{ content:""; position:absolute; top:50%; left:16px; margin-top:-8px;width:13px; height:17px; background:url(../images/common/icon_page.png) 50% 50% no-repeat; display:block; } .dwLst li a:after{ content:""; position:absolute; top:50%; right:20px; margin-top:-15px;width:29px; height:29px; background:url(../images/common/icon_dw.png) 50% 50% no-repeat; display:block; border:#d6d6d6 1px solid; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out; } .dwLst li a:hover{ color:#e00529;} .dwLst li a:hover:after{ background:url(../images/common/icon_dw_on.png) 50% 50% no-repeat; display:block; border:#e00529 1px solid;} /* pr-bx */ .pr-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:50px 49px 55px; } .pr-bx h4{ font-size:24px; color:#121212; margin:80px 0 20px 0; } .pr-bx h4+.sub-tx{ margin:0; font-size:16px; color:#333;} .pr-bx .mov-list{ margin:0 0 0 -22px; outline: 0;} .pr-bx .mov-list:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .pr-bx .mov-list .item{ position:relative; float:left; width:352px; height:200px; margin:22px 0 0 22px;} .pr-bx .mov-list .item a{ display:block;} .pr-bx .mov-list .item span{ display:block;} .pr-bx .mov-list .item .thum{ width:100%; height:200px; overflow:hidden;} .pr-bx .mov-list .item .thum:after{ content:""; position:absolute; top:0; right:0; bottom:0; left:0; opacity:0.6; background-color:#000; width:100%; } .pr-bx .mov-list .item .thum:before{ content:""; position:absolute; bottom:25px; right:26px; background:url(../images/common/blt_play.png) 50% 50% no-repeat; display:block; width:32px; height:37px; z-index:9;} .pr-bx .mov-list .item .tbx{ position:absolute; padding:25px 68px 25px 25px; bottom:0; left:0; width:100%; color:#fff; font-size:18px; z-index:9; text-overflow:ellipsis; overflow:hidden; display:block; white-space:nowrap; } .pr-bx .mov-list .item .thum{ overflow:hidden;} .pr-bx .mov-list .item a .thum img{ display:block; transition:all .3s ease;} .pr-bx .mov-list .item a:hover .thum img{ transform:scale(1.1); -webkit-transform:scale(1.1); -moz-transform:scale(1.1); -ms-transform:scale(1.1); -o-transform:scale(1.1); } .pr-bx .ych-list{ margin: 0 0 0 -20px;} .pr-bx .ych-list .h4-tit { margin: 0 0 40px 20px; font-size: 20px; } .pr-bx .ych-list:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .pr-bx .ych-list .item{ position: relative; float: left; margin: 0 0 20px 20px; width: calc(33.333% - 34px); } .pr-bx .ych-list .item + .item { margin-left: 41px; } .pr-bx .ych-list .item:nth-child(5n) { margin-left: 20px; } .pr-bx .ych-list .item span{ display:block;} .pr-bx .ych-list .item .thum{ border: 1px solid #d3d3d4; background-color: #f9fafc; height: 400px; position: relative; } .pr-bx .ych-list .item .thum img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 232px; height: 285px; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); } .pr-bx .ych-list .item .thum img.col { width: 285px; height: 204px; } .pr-bx .ych-list .item .dw-tit { display: block; width: 100%; font-size: 18px; margin-bottom: 15px; } .pr-bx .ych-list .item .thx .dw-list { margin-top: 17px; } .pr-bx .ych-list .item .thx .dw-list > li { width: 106px; height: 39px; border: 1px solid #ccc; } .pr-bx .ych-list .item .thx .dw-list > li + li { margin-left: 10px; margin-bottom: 0; } .pr-bx .ych-list .item .thx .dw-list > li > a { display: block; width: 100%; height: 100%; line-height: 39px; text-align: center; font-weight: bold; } .pr-bx .dw-list > li > a::after { content: ""; width: 14px; height: 15px; display: inline-block; background: url(../images/common/icon_dw.png) no-repeat center/contain; margin-left: 30px; vertical-align: sub; } .pr-bx .bch-list{ margin:20px 0 0 -20px;} .pr-bx .bch-list:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .pr-bx .bch-list .item{ float:left; width:260px; margin:0 0 0 20px;} .pr-bx .bch-list .item span{ display:block;} .pr-bx .bch-list .item .thum{ position:relative; margin:0 0 16px 0; border: 1px solid #d3d3d4; } .pr-bx .bch-list .item .thum:before{ content:""; position:absolute; top:55%; right:0; left:0; bottom:0; display:block; background-image: linear-gradient(180deg, rgba(0,0,0,0.00) 0%, rgba(0,0,0,0.60) 67%); width:100%; } .pr-bx .bch-list .item .thum img{ display:block;} .pr-bx .bch-list .item .thum strong{ display:inline-block; position:absolute; top:45px; left:30px; color:#fff; font-size:18px; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .pr-bx .bch-list .item .thum em{ display:block; color:#fff; position:absolute; bottom:48px; left:30px; font-size:18px; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; font-weight:600;} .pr-bx .bch-list .item .thum em:after{ content:""; position:absolute; top:-20px; left:0; width:23px; height:2px; background-color:#fff; display:block; } .pr-bx .bch-list .item .tbx a{ border:#d3d3d4 1px solid; position:relative; display:block; height:50px; line-height:50px; font-size:16px; width:100%; text-align:center;} .pr-bx .bch-list .item .tbx a:before{ content:""; width:15px; height:15px; display:inline-block; vertical-align:middle; margin:0 5px 0 0;} .pr-bx .bch-list .item .tbx a.dw:before{ background:url(../images/common/icon_dw.png) 50% 50% no-repeat; } .pr-bx .bch-list .item .tbx a.pdf:before{ background:url(../images/common/icon_link.png) 50% 50% no-repeat; } .pr-bx .bch-list .item .tbx a:hover{ border:#e00529 1px solid; color:#e00529;} .pr-bx .bch-list .item .tbx a.dw:hover:before{ background:url(../images/common/icon_dw_on.png) 50% 50% no-repeat; } .pr-bx .bch-list .item .tbx a.pdf:hover:before{ background:url(../images/common/icon_link_on.png) 50% 50% no-repeat; } .pr-bx .bch-list .item .tbx a.pdf:after{ content:""; position:absolute; top:50%; left:0; margin-top:-8px; width:1px; height:15px; background-color:#ccc; display:block;} .pr-bx .pdf-cmt{ margin:60px 0 0 0;} .pr-bx .pdf-cmt>p{ position:relative; margin:0 0 15px 0; padding:0 0 0 26px;} .pr-bx .pdf-cmt>p:before{ content:""; position:absolute; width:13px; height:17px; left:0; top:50%; margin-top:-8px; display:block; background:url(../images/common/icon_page.png) 50% 50% no-repeat;} .pr-bx + .pr-bx { margin-top: 40px; } .pr-bx .tc { position: relative; padding: 0 0 251px 530px; } .pr-bx .tc .h4-tit { margin-top: 0; font-size: 24px; } .pr-bx .tbx { font-size: 16px; border-top: 1px solid #e8ecf2; padding-top: 20px; } .pr-bx .photo { position: absolute; top: 0; left: 0; width: 480px; height: 480px; background-color: #f9fafc; border: 1px solid #e8ecf2; } .pr-bx .photo > img { width: 300px; height: 368px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); object-fit: contain; } .pr-bx .photo > img.col { width: 368px; height: 300px; } .pr-bx .dw-list { position: relative; margin-top: 85px; } .pr-bx .dw-list::after { content:""; display: block; clear: both; } .pr-bx .dw-list > li { position: relative; float: left; margin-bottom: 20px; } .pr-bx .dw-list > li + li { margin-left: 20px; } .pr-bx .dw-list > li:nth-child(2n + 1){ margin-left: 0; margin-bottom: 0; } .pr-bx .dw-list > li > div { width: 275px; } .pr-bx .dw-list > li > div { border-bottom: 0 none; border-color: #ec4949; } .pr-bx .dw-list > li > div > a { position: relative; display: block; border: #ccc 1px solid; line-height: 56px; height: 56px; padding: 0 30px; font-size: 18px; color: #333; font-weight: 600; display: block; width: 100%; text-align: left; } .pr-bx .dw-list > li > div > a::after { content: ""; position: absolute; top: 50%; right: 30px; margin-top: -7px; width: 13px; height: 15px; display: block; background:url(../images/common/icon_dw.png) 50% 50% no-repeat; transform: translateX(-50%); } .pr-bx .dw-list > li > div > a:hover { color: #ec4949; border:#ec4949 1px solid; } .pr-bx .dw-list > li > div > a:hover::after { background:url(../images/common/icon_dw_on.png) 50% 50% no-repeat; } .pr-bx .tc.type2 { padding: 0; border-top: 1px solid #e8ecf2; overflow: hidden; } .pr-bx .tc.type2 > .hf-w.fl-l { width: 44%; float: left; } .pr-bx .tc.type2 > .hf-w.fl-r { width: 56%; float: right; padding-left: 45px; } .pop-mov{ width:1000px; top:50%!important; margin-top:-330px !important;} .pop-mov .pop-con{ padding:40px 50px;} .pop-mov .pop-con .tbx{ margin-top:20px; background-color:#f9fafc; border:#ebebeb 1px solid; padding:30px; height:145px; overflow-y:auto;} .pop-mov .mov-if{ width:900px; height:512px;} /* fin-bx */ .fin-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:0 0 100px; } .fin-bx .iframe-wrap { padding: 60px 20px; } .fin-bx .iframe-wrap > iframe { width: 100%; height: 1280px; } .fin-bx .tab{ border-bottom:#e5e5e5 1px solid;} .fin-bx .tab:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .fin-bx .tab li{ float:left; width:50%;} .fin-bx .tab li a{ position:relative; line-height:68px; display:block; text-align:center; font-size:16px; color:#555; font-weight:600;} .fin-bx .tab li.active a{ color:#e00529;} .fin-bx .tab li a:before{ content:""; position:absolute; top:50%; left:0; margin-top:-8px; width:1px; height:16px; background-color:#e5e5e5; display:block;} .fin-bx .tab li:first-child a:before{ display:none;} .fin-bx .tab li a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:0px; background-color:#e00529; display:block; opacity:0; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;} .fin-bx .tab li a:hover:after, .fin-bx .tab li.active a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:3px; background-color:#e00529; display:block; opacity:1;} .fin-bx .tc{ padding:60px 49px 0;} .fin-bx .tc .bum{ text-align:right; margin:0 0 10px 0;} /* stock-bx */ .stock-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:0 0 100px; } .stock-bx .tab{ border-bottom:#e5e5e5 1px solid;} .stock-bx .tab:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .stock-bx .tab li{ float:left; width:25%;} .stock-bx .tab li a{ position:relative; line-height:68px; display:block; text-align:center; font-size:16px; color:#555; font-weight:600;} .stock-bx .tab li.active a{ color:#e00529;} .stock-bx .tab li a:before{ content:""; position:absolute; top:50%; left:0; margin-top:-8px; width:1px; height:16px; background-color:#e5e5e5; display:block;} .stock-bx .tab li:first-child a:before{ display:none;} .stock-bx .tab li a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:0px; background-color:#e00529; display:block; opacity:0; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;} .stock-bx .tab li a:hover:after, .stock-bx .tab li.active a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:3px; background-color:#e00529; display:block; opacity:1;} .stock-bx .tc{ padding:60px 0 0; width:700px; margin:0 auto;} .stock-bx .tc .bum{ text-align:right; margin:0 0 10px 0;} /* ir-bx */ .ir-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding: 100px 0; overflow:hidden;} .ir-bx p { font-size: 16px; font-weight: bold; color: #121212; text-align: center; } .ir-bx .tab{ border-bottom:#e5e5e5 1px solid;} .ir-bx .tab:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .ir-bx .tab li{ float:left; width:50%;} .ir-bx .tab li a{ position:relative; line-height:68px; display:block; text-align:center; font-size:16px; color:#555; font-weight:600;} .ir-bx .tab li.active a{ color:#e00529;} .ir-bx .tab li a:before{ content:""; position:absolute; top:50%; left:0; margin-top:-8px; width:1px; height:16px; background-color:#e5e5e5; display:block;} .ir-bx .tab li:first-child a:before{ display:none;} .ir-bx .tab li a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:0px; background-color:#e00529; display:block; opacity:0; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;} .ir-bx .tab li a:hover:after, .ir-bx .tab li.active a:after{ content:""; position:absolute; bottom:-1px; left:0; width:100%; height:3px; background-color:#e00529; display:block; opacity:1;} .ir-bx .tc{ padding:60px 49px 0;} .ir-bx .tc .bum{ text-align:right; margin:0 0 10px 0;} /* dis-bx */ .dis-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:50px 49px 100px; text-align:center;} .dis-bx .dis-rule{ border-top:#ccc 1px solid; margin:40px 0 0 0; padding:40px 0 0 0;} .dis-bx .dis-rule h4{ font-size:20px; color:#333; margin:0; text-align:left;} .dis-bx .dis-rule .btn-box{ margin-top:15px;} /************************************************ career ************************************************/ /* career-wr */ .career-wr { width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:70px 50px 100px; } .career-wr h4 { font-size: 22px; } .career-wr .tx01 { font-size: 19px; color: #333; margin: 0 0 40px 0; font-family: 'Nanum Square' ,'돋움',Dotum, Gulim, serif; } .career-wr .tx01 strong { display: block; font-size: 33px; line-height: 1.2; font-family: 'Nanum Square' ,'돋움',Dotum, Gulim, serif; } .career-wr .tx03 { margin-top: 80px; } .career-wr .tx03 ul { overflow: hidden; border: 1px solid #dedede; padding: 60px 90px; } .career-wr .tx03 ul li { float: left; width: 33%; text-align: center; } .career-wr .tx03 ul li + li { border-left: 1px solid #dedede; } .career-wr .tx03 ul li > div > strong { font-size: 18px; font-weight: 800; } .career-wr .tx03 ul li .btn-box { margin-top: 30px; } .career-swiper { overflow: hidden; position: relative; } /* .career-wr .career-btn-prev, .career-btn-next { background-repeat: no-repeat; background-size: contain; background-position: center; width: 20px; height: 20px; position: absolute; top: 50%; transform: translateY(-50%); z-index: 1; cursor: pointer; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .career-wr .career-btn-prev { background-image: url(../images/common/paging_prev.png); left: 0; } .career-wr .career-btn-next { background-image: url(../images/common/paging_next.png); right: 0; } */ .career-swiper .txt-img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); width: 100%; height: 100%; z-index: 1; } /* peo-bx */ .peo-bx { width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:70px 50px 100px; } .peo-bx .color-red { color: #e0012a; font-weight: 800; } .peo-bx .color-orange { color: #ee7d08; font-weight: 800; } .peo-bx .tx01 { font-size: 30px; font-weight: 700; background-color: #f2f5f8; border: 2px solid #dedede; font-family: 'Nanum Square' ,'돋움',Dotum, Gulim, serif; padding: 60px; } .peo-bx ul { padding-top: 20px; overflow: hidden; } .peo-bx ul li { padding: 80px 0 100px; overflow: hidden; } .peo-bx ul li + li { border-top: 1px solid #dedede; } .peo-bx ul li > div { float: left; width: 400px; height: 300px; } .peo-bx ul li > div > .hashtag > span { display: block; font-size: 17px; font-weight: bold; color: rgb(255,122,0); margin: 3px 0; } .peo-bx ul li > .image-wrap { border: 1px solid #dedede;} .peo-bx ul li > .image-wrap > img { width: 100%; height: 100%; } .peo-bx ul li > div + div { float: right; margin-left: 55px; } .peo-bx ul li.right > div:first-child, .peo-bx ul li.left > div + div { width: calc(100% - 455px); } .peo-bx ul li > div > div [class*="fam-"] + [class*="fam-"] { margin-left: 40px; font-size: 26px; font-weight: 800; font-family: 'Nanum Square' ,'돋움',Dotum, Gulim, serif; position: relative; } .peo-bx ul li > div > div [class*="fam-"] + [class*="fam-"]::before { content: ""; display: block; width: 1px; height: 24px; background-color: #dedede; position: absolute; top: 0; left: -17px; } .peo-bx ul li > div > div > a.fam-icon > img { vertical-align: sub;} .peo-bx ul li > div > div + div { margin-top: 30px; } .peo-bx ul li > div > div:nth-child(2) { font-size: 18px; line-height: 1.55; } .peo-bx ul li .btn-box .btn-lg { width: 250px; padding: 0; } .peo-bx ul li .btn-box .btn-orange { margin-left: 6px; background-color: #ee800a; color: #ffffff; border: 1px solid #ee800a; } .peo-bx .img-wrap { position: relative; width: 100%; height: 500px; background-image: url(../../../asset/kor/images/career/car02_img7.jpg); background-repeat: no-repeat; background-position: center; } .peo-bx .tx03 { color: #000; font-size: 34px; font-weight: 800; line-height: 1.23; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); text-align: center; } /* life-bx */ .life-bx { width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:70px 50px 100px; } .life-bx .color-ffffff { color: #ffffff; } .life-bx [class*="tx"] ul li a { position: relative; } .life-bx [class*="tx"] ul li a .dim-wrap { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; transition: all 0.2s; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; -o-transition: all 0.2s; } .life-bx [class*="tx"] ul li a:hover .dim-wrap { background-color: rgba(0,0,0,.6);} /* .life-bx [class*="tx"] ul li a:hover > img { filter: blur(10px); -webkit-filter: blur(10px); } */ .life-bx [class*="tx"] ul li a:hover .life-blur-cont .btn { display: none; } .life-bx [class*="tx"] ul li a:hover .life-blur-cont p { display: block; } .life-bx [class*="tx"] ul li a.temp-lg:hover .life-blur-cont strong { font-size: 30px; color: #fff; } .life-bx [class*="tx"] ul li a.temp-md:hover .life-blur-cont strong { font-size: 20px; color: #fff; } .life-bx .tx01 strong { font-size: 30px; font-family: 'Nanum Square' ,'돋움',Dotum, Gulim, serif; } .life-bx .tx01 p { font-size: 18px; line-height: 1.55; margin-bottom: 85px; } .life-bx h4 { font-size: 24px; color: #121212; } .life-bx a { width: 100%; height: 100%; display: block; position: relative; overflow: hidden; border-radius: 32px; -webkit-border-radius: 32px; -moz-border-radius: 32px; -ms-border-radius: 32px; -o-border-radius: 32px; } .life-bx a.small-heigt { max-height: 207px; } .life-bx [class*="temp"] > img { width: 100%; height: 100%; object-fit: cover; transition: all 0.25s; -webkit-transition: all 0.25s; -moz-transition: all 0.25s; -ms-transition: all 0.25s; -o-transition: all 0.25s; } .life-bx a.temp-lg { width: 542px; height: 485px; } .life-bx a.temp-md { width: 541px; height: 233px; } .life-bx a.temp-lg .life-blur-cont strong { font-size: 40px; } .life-bx a.temp-md .life-blur-cont strong { font-size: 30px; } .life-bx a .life-blur-cont strong { display: block; margin-bottom: 5px; transition: all 0.25s; -webkit-transition: all 0.25s; -moz-transition: all 0.25s; -ms-transition: all 0.25s; -o-transition: all 0.25s; } .life-bx a .life-blur-cont .btn > img { max-width: 100%; height: 100%; } .life-bx a .life-blur-cont p { display: none; color: #fff; } .life-bx ul { margin-top: 25px; overflow: hidden; } .life-bx ul > li { float: left; } .life-bx ul > li + li { margin-left: 14px; } .life-bx ul li a + a { margin-top: 20px; } .life-bx ul li .life-blur-cont { position: absolute; padding: 20px; top: 0; font-size: 18px; line-height: 1.55; color: #000000; word-break: keep-all; } .life-bx ul li .life-blur-cont.pos-l { left: 0; text-align: left; } .life-bx ul li .life-blur-cont.pos-r { right: 0; text-align: right; } .map-wrap { margin: 27px 0 72px; } .company-wrap { overflow: hidden; margin-left: 73px; position: relative; } .company-wrap h4.color-e00529 { color: #e00529; } .company-wrap .company-list .list-wrap { overflow: hidden; padding: 30px 0 40px; } .company-wrap .company-list .list-wrap .img-wrap { float: left; max-width: 400px; width: 100%; height: 300px; } .company-wrap .company-list .list-wrap .txt-box { float: right; max-width: 625px; width: 100%; padding-left: 63px; } .company-wrap .company-list .list-wrap .txt-box .title { display: block; font-size: 26px; margin-bottom: 27px; } .company-wrap .company-list .list-wrap .txt-box .desc { font-size: 18px; word-break: keep-all; } .company-wrap .company-btn-prev, .company-btn-next { background-repeat: no-repeat; background-size: 39px 39px; background-position: center; width: 39px; height: 39px; position: absolute; bottom: 0; z-index: 1; cursor: pointer; } .company-wrap .company-btn-prev { background-image: url(../images/career/car04_ic_l_off.jpg); left: 465px; } .company-wrap .company-btn-next { background-image: url(../images/career/car04_ic_r_off.jpg); left: 508px; } .company-wrap .company-btn-prev:hover { background-image: url(../images/career/car04_ic_l_on.jpg); } .company-wrap .company-btn-next:hover { background-image: url(../images/career/car04_ic_r_on.jpg); } /* career */ .careers-wrap .color-e00529 { color: #e00529; font-weight: bold; } .careers-wrap .search-wrap { padding: 52px 50px 54px; background-color: #fff; border: 1px solid #bbbcbc; overflow: hidden; } .careers-wrap .search-wrap .left { float: left; overflow: hidden; } .careers-wrap .search-wrap .left > div { float: left; margin-right: 10px; } .careers-wrap .search-wrap .left > div select { width: 208px; height: 44px; border: 1px solid #e6e6e6; font-size: 16px; font-weight: bold; padding-left: 17px; padding-right: 37px; appearance: none; background-image: url(../images/common/blt_select0.png); background-repeat: no-repeat; background-position: right center; -moz-appearance:none; /* Firefox */ -webkit-appearance:none; /* Safari and Chrome */ appearance:none; } .careers-wrap .search-wrap .left > div select::-ms-expand { display: none; } .careers-wrap .search-wrap .right { float: right; } .careers-wrap .search-wrap .right button { width: 160px; height: 50px; color: #ffffff; font-size: 16px; font-weight: bold; float: left; } .careers-wrap .search-wrap .right .search-btn { background-color: #e00529; margin-right: 6px; } .careers-wrap .search-wrap .right .search-btn::before { content: ""; display: inline-block; width: 17px; height: 17px; background-image: url(../images/common/icon_search_w.png); background-repeat: no-repeat; vertical-align: middle; margin-right: 12px; } .careers-wrap .search-wrap .right .reset-btn { background-color: #a0a0a0; } .careers-wrap .careers-list-wrap { padding-top: 78px; } .careers-wrap .careers-list-wrap .notice { font-size: 18px; font-weight: bold; } .careers-wrap .careers-list-wrap ul { padding: 27px 0 56px; } .careers-wrap .careers-list-wrap ul::after { content: ""; display: block; clear: both; } .careers-wrap .careers-list-wrap ul .list-item { float: left; width: calc(33% - 14px); background-color: #ffffff; border: 1px solid #e8ecf2; margin-right: 27px; transition: all 0.35s ease; -webkit-transition: all 0.35s ease; -moz-transition: all 0.35s ease; -ms-transition: all 0.35s ease; -o-transition: all 0.35s ease; } .careers-wrap .careers-list-wrap ul .list-item:hover { box-shadow: 0 14px 20px 12px rgb(0 0 0 / 10%); } .careers-wrap .careers-list-wrap ul .list-item:nth-child(3n) { margin-right: 0; } .careers-wrap .careers-list-wrap ul .list-item:nth-child(n+4) { margin-top: 28px; } .careers-wrap .careers-list-wrap ul .list-item a { display: block; width: 100%; height: 100%; padding: 38px; } .careers-wrap .careers-list-wrap ul .list-item a .title { font-size: 16px; } .careers-wrap .careers-list-wrap ul .list-item a p { height: 50px; font-weight: bold; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .careers-wrap .careers-list-wrap ul .list-item a .info { margin: 15px 0; } .careers-wrap .careers-list-wrap ul .list-item a .info span::after { content: "|"; display: inline-block; margin: 0 15px;} .careers-wrap .careers-list-wrap ul .list-item a .info span:last-child::after { display: none; } .careers-wrap .careers-list-wrap ul .list-item a .date .d-day { display: inline-block; width: 96px; height: 27px; line-height: 27px; background-color: #a0a0a0; text-align: center; color: #ffffff; margin-right: 12px; } .careers-wrap .careers-list-wrap ul .list-item a .date .period { font-size: 14px; } .careers-wrap .careers-list-wrap .more-btn { display: block; width: 50px; height: 50px; background-color: #e00529; margin: 0 auto; } /************************************************ footer ************************************************/ /* privacy-bx */ .privacy-bx{ width:1200px; margin:0 auto; background-color:#fff; border:#e8ecf2 1px solid; padding:50px 49px 100px; } .privacy-bx .tbx{ border-top:#ccc 1px solid; margin:10px 0 0 0; padding:35px 0 0 0;} .privacy-bx .tbx dl dt{ margin:25px 0 10px; color:#333; font-weight:600;} .privacy-bx .tbx dd dl {padding:0 50px;} .privacy-bx .tbx dd dl dt {position:relative;} .privacy-bx .tbx dd dl dt:before {content:'-'; display:inline-block; margin:0 10px 0 0; vertical-align:middle;} /* sitemap-bx */ .sitemap-bx{ width:1100px; margin:0 auto; padding:50px 0; } .sitemap-bx a:hover{ color:#e00529;} .sitemap-bx>ul>li{ position:relative; border-top:#666 3px solid; padding:25px 0 0 350px;} .sitemap-bx>ul>li>strong{ position:absolute; top:25px; left:0; font-size:24px; color:#121212; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; display:block; width:350px; line-height:1;} .sitemap-bx>ul>li>ul:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .sitemap-bx>ul>li>ul>li{ width:25%; float:left;} .sitemap-bx>ul>li>ul>li>a{ display:block; line-height:1; font-size:18px; color:#121212; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; font-weight:600; margin:0 0 20px 0;} .sitemap-bx>ul>li>ul>li>ul>li>a{ display:block; line-height:1; font-size:16px; color:#121212; padding:8px 0;} .sitemap-bx>ul>li+li{ margin-top:76px;} /* error-bx */ .error-bx{ position:absolute; top:50%; left:50%; margin:-303px 0 0 -530px; width:1060px;} .error-bx h1.logo{ position:relative; width:104px;} .error-bx h1.logo a{ display:block; background:url(../images/common/logo.png) 50% 50% no-repeat; height:61px; text-indent:-9999px;} .error-bx .tbx{ background-color:#f3f5f8; margin:24px 0 0 0; padding:70px 0; text-align:center;} .error-bx .tbx .txLg{ font-size:24px; color:#333; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; margin:0 0 30px 0;} .error-bx .tbx .txLg:before{ content:""; background:url(../images/common/icon_error.png) 50% 50% no-repeat; width:100px; height:86px; margin:0 auto 36px; display:block;} .error-bx .tbx .tx01{ font-size:16px; color:#333; margin:0 0 15px 0;} /* pop-noti */ .pop-noti{ margin:0; width:640px; background-color:#fff; left:50%; margin-left:-370px; top:10%;} .pop-noti .pop-con{ /* padding:2px 40px 40px 40px; */ border:none;} .pop-noti .pop-con>h2{ padding:0; margin:0; line-height:1; font-size:24px; color:#333; text-align:center; font-weight:bold; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;} .pop-noti .pop-con>.hd-tx{ font-size:13px; margin-top: 26px; margin-bottom:40px; line-height: 1.7;} .pop-noti .pop-con>.pop-txt {border:1px solid #E1E1E1; padding:30px 40px 25px 40px; position:relative; margin-bottom:24px; } .pop-noti .pop-con>.pop-txt > span{position: absolute; display:block; font-size:14px; font-weight: bold; left:50%; margin-left:-60px; width:120px; text-align:center; background:#fff; padding: 10px 0; top:-20px;} .pop-noti .pop-con>.pop-txt table th, .pop-noti .pop-con>.pop-txt table td { text-align: left; vertical-align:top; padding:2px 0;} .pop-noti .pop-con > .txt-bottom { text-align:center; font-size:14px;} .pop-noti .pop-con > .txt-bottom p:nth-child(1) { margin-bottom:8px; } .pop-noti .pop-con > .txt-bottom p:nth-child(2) { margin-bottom:4px; font-weight:bold;} .pop-noti .pop-con > .txt-bottom p:nth-child(3) { margin-bottom:16px; color:#5E5E5E;} .pop-noti .pop-con > .txt-bottom p:nth-child(4) { font-size:18px; font-weight:bold;} .pop-noti .pop-con>ul{ line-height:1.6; font-size:16px;} .pop-noti .pop-con>ul>li{ line-height:1.6; padding-left:50px;} .pop-noti .pop-con>ul>li>strong{ margin-left:-50px;} .pop-noti .pop-con>ul>li>ul{ margin-left:-40px;} .pop-noti .pop-con>ul>li>ul>li{ padding-left:10px;} .pop-noti .pop-con>ul>li>ul>li>strong{ margin-left:-10px;} .pop-noti .pop-con>ul>li>ul>li:first-child{ padding-left:85px;} .pop-noti .pop-con>ul>li>ul>li:first-child>strong{ margin-left:-85px;} .pop-noti .pop-bot{ position:relative; padding:20px 15px; background-color: #ebebeb; color:#fff; border-top: 4px solid #E0062A;} .pop-noti .pop-bot .bt-close{ position:absolute; top:50%; right:15px; margin-top:-8px; width:28px; height:28px; display:block; background: url(../../../images/common/icon_pop_close.png) center no-repeat; } .bPopup .pop-con { height:80vh; overflow-y:auto; background-color: #ffffff; } .bPopup .pop-con .btn-wrap { padding: 30px 0; text-align: center; } .bPopup .pop-con .btn-wrap a { display: inline-block; width: 220px; } /* 171127 추가 */ table.data .bgRed{ background-color:#fff6f7;} table.data .brdB{ border-bottom:#acacac 1px solid !important;} .row-grp h5{ margin:0 0 10px 0;} .row-grp:after{content:'';display:block;clear:both;height:0px;visibility:hidden;} .row-grp .row{ width:49%; float:right; } .row-grp .row:first-child{ float:left; } /************************************************ 20190619 추가 jj ************************************************/ .corp-wr .vision-box {margin-top: 30px;text-align:center;} .corp-wr .vision-box strong { display:inline-block; width:380px; margin:0 38px; padding:5px 10px 10px; background:#ff783c; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; color:#fff; font-size:22px; } .corp-wr .vision-box strong:before { content: ''; display:block; width:50px; height:50px; margin:0 auto; background:url(/images/skcinc/vision/img_about03.png)no-repeat;} .corp-wr .vision-box strong:nth-of-type(1):before {background-position:0 0;} .corp-wr .vision-box strong:nth-of-type(2):before {background-position:0 -50px;} .corp-wr .vision-box ul {margin-top:20px;} .corp-wr .vision-box ul li {display:inline-block; width:120px; height:120px; margin-right:45px; border-radius:50%; background:#303a4d; font-size:20px; line-height:120px; color:#fff; vertical-align:middle; } .corp-wr .vision-box ul li:last-of-type {margin:0;} .tool-box { display: table; width:100%; margin-bottom:20px; padding:25px 35px; border: 1px solid #ccc;} .tool-box dt { display:table-cell; width:25%; font-size:24px; padding: 15px 0; border-right:1px solid #ccc; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; font-weight:bold;} .tool-box dt:before {content:'';display:inline-block; width: 60px; height:60px; margin:-10px 20px 0 0; background:url(/images/business/tool/ico_tool.png)no-repeat; vertical-align:middle; } .tool-box:nth-of-type(1) dt:before {background-position:0 0;} .tool-box:nth-of-type(2) dt:before {background-position:0 -60px;} .tool-box:nth-of-type(3) dt:before {background-position:0 -120px;} .tool-box dd {display:table-cell; width:70%; padding-left:50px;vertical-align: middle;} .tool-box dd .field.group > div {display:inline-block;width:48%;} .tool-box dd .field.group > div label { display:inline-block; width:100px; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; font-size:16px; } .tool-box dd .field.group > div input {width:calc(100% - 110px);} .tool-result:after {content:''; display: block; clear: both;} .tool-result li {float:left;width:47%; margin:5px; padding:6px 20px; background:#f3f5f8; text-align:right; font-size:13px; } .tool-result li span {margin-right:20px;} .tool-calc {background:url(/images/business/tool/img_tool01.jpg)no-repeat 0 0 #fff;} .tool-calc:after {content:''; display: block; clear: both;} .tool-calc .left {float: left; width: 50%;} .tool-calc .left p {font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; font-size:16px;} .tool-calc .left .btn-box {margin-top:200px;} .tool-calc .calc-box {padding-left:40px;} .tool-calc .calc-box strong {display:block; padding:10px; background:#e10529; text-align:center;} .tool-calc .calc-box strong span {color:#fff; font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif; font-size:22px; font-weight:bold;} .tool-calc .calc-box strong span:before {content:''; display:inline-block;width:60px; height:60px;background:url(/images/business/tool/ico_tool.png)no-repeat 0 -180px;vertical-align: middle;} .tool-calc .calc-box .box {padding:25px 45px; box-shadow: 0 0 0 1px #ccc inset; background-color:#fff; } .tool-calc .calc-box .box li {text-indent:0; margin-bottom:10px;} .tool-calc .calc-box .box li label {display:inline-block; width:80px;} .tool-calc .calc-box .box li label + input {width:calc(100% - 100px);} .csm02-bx .tc.contact .tx0403>ul>li {height:245px;padding-top:90px;} .csm02-bx .tc.contact .tx0403>ul>li:before {content: "";display: block;position: absolute;top: 20px;left: 50%;margin: 0 0 0 -30px;width: 60px;height: 60px;} .csm02-bx .tc.contact .tx0403>ul>li.m1:before {background:url(../images/contact/ico-contact01.png) no-repeat 0 0;} .csm02-bx .tc.contact .tx0403>ul>li.m2:before {background:url(../images/contact/ico-contact01.png) no-repeat 0 -60px;} .csm02-bx .tc.contact .tx0403>ul>li.m3:before {background:url(../images/contact/ico-contact01.png) no-repeat 0 -120px;} .form-box {margin-top:40px; padding:50px 20px; border-top:2px solid #333;} .form-box dl {margin-bottom:10px;} .form-box dl:after {content: ''; display:block; clear: both;} .form-box dl dt {float:left;width:20%;} .form-box dl dt label:before{content: "";width: 2px;height: 2px;background-color: #333;display: inline-block;border-radius: 50%;margin: 0 10px 0 0;vertical-align: middle;} .form-box dl dd {float:left; width:calc(100% - 20%);} .form-box .double dt {width:20%;} .form-box .double dt ~ dt {padding-left:20px;} .form-box .double dd {width:30%;} .form-box dl dd input, .form-box dl dd select {width:317px;} .full {width:100% !important;} .form-box dl dd textarea {width:100%;height:95px; resize:none;} .form-box .last {margin-top:30px; padding:20px 20px 30px; background:#f3f5f8; border-top:1px solid #eee; border-bottom:1px solid #ccc;} .form-box .last p {margin:15px 0; font-size:18px;} .double:after {content: ''; display:block; clear: both;} .double .tx01 {float: left; width:47%; margin:30px 10px;} .double > div:after {content: '';display:block; clear: both;} .elect:after {content: ''; display:block; clear: both;} .elect .left {float: left;} .elect .left:nth-of-type(1) {width:350px;} .elect .left .img-list {margin-top:20px;} .elect .left .img-list ul {display:inline-block;vertical-align: middle;} .elect .left .img-list ul li {margin:5px 0;} .elect .left .img-list img {vertical-align: middle;} .elect .left:nth-of-type(2) {width: 60%; margin-left:30px;} .w-70x30 {margin-top:50px;} .w-70x30:after {content: ''; display:block; clear: both;} .w-70x30 .left {float:left;width:70%; vertical-align: top;} .w-70x30 .left:nth-of-type(2) {width:30%;} .pct-box ul li {display:inline-block; width:48%; margin-right:15px; text-align: center;vertical-align: top;} .pct-box ul li strong {display:block;width:100%;padding:20px;background:#666;font-size:18px; color:#fff;} .pct-box ul li .img {padding:20px; background:url(/images/common/dot_v.png) 0 100% repeat-y , url(/images/common/dot_v.png) 100% 0 repeat-y , url(/images/common/dot_h.png) 100% 100% repeat-x #f9fafc; } .pct-box ul li .img p {margin-top:20px;height:45px;} .pct-box ul li.red strong {background-color:#e00529;} .pct-box ul li.red > div { background:url(/images/common/dot_v_red.png) 0 100% repeat-y , url(/images/common/dot_v_red.png) 100% 0 repeat-y , url(/images/common/dot_h_red.png) 100% 100% repeat-x;} .chip h4 {position:relative; margin-top:0; padding-right:300px;font-family:'Nanum Square' ,'돋움',Dotum, Gulim, serif;font-size:34px; } .chip h4 span {color: #a7cf46;} .chip h4 .logo {position:absolute; top:0; right:0;} .printing-cont {margin-top:50px;} .printing-cont .box {display: inline-block; width:535px; margin-top:20px; padding:40px 30px;background:#f9fafc;vertical-align: top;} .printing-cont .box:nth-of-type(1) {margin-right:18px;} .printing-cont .box:not(.full) {min-height:300px;} .printing-cont .box dt {padding-bottom:20px; border-bottom:1px solid #666; font-size:20px;color:#e00529;font-weight:bold;} .printing-cont .box dd {margin-top:20px;} .printing-cont .box .ul-list01 li em {font-weight:bold;} .printing-cont.img .box {min-height:150px;} .printing-cont.img .box .img-list img {width:330px;} .printing-cont.img .box .img-list img:not(:last-of-type) {margin-right:15px;} .suft-box {position:relative;} .suft-box .pct-box {position:relative;padding-left:75px;} .suft-box .pct-box:before {content:'';position:absolute; top:0; left:380px;width:30px; height:100%; background:url(/images/business/petfilm/img_app_packaging04.png)no-repeat 0 0; background-size:100%; border-radius:10px; } .suft-box .pct-box li {display:block; width:290px;} .suft-box .pct-box li.btm {margin-top:168px;} .suft-box .pct-box .list-box{padding:25px 30px;background-color:#f9fafc;} .suft-box .pct-box .list-box p {padding:18px 10px; border:1px solid #ccc; background:#fff; font-size:16px;} .suft-box .pct-box .list-box p:not(:last-of-type) {margin-bottom:10px;} .suft-box .pct-box .circle-list {position:absolute;top:120px;right:150px;} .suft-box .orange {position:absolute; bottom:230px; left:0; width:100%;} .suft-box .orange ul li {display:inline-block;} .suft-box .orange ul li.text {width:25px; font-size:17px;color:#000;transform:rotate(90deg);vertical-align:top;} .suft-box .orange ul li.text:first-of-type {margin-right:5px;} .suft-box .orange ul li:not(.text) {width:290px;margin-right:10px; padding:25px 10px; background-color:#ff783c; color:#fff; font-size:18px; text-align: center;} .suft-box .orange ul li.first:not(.text) {margin:0 50px 0 40px} .org-bx.link a:after{background:url(/images/common/ico-link.png)no-repeat 0 0; } /* .org-bx a:hover:after{background:url(/images/common/ico-linkon.png)no-repeat 0 0; } */ .txt-desc {background:#ffece7; font-weight:bold;} .creat-pack.double:after {content: '';display: block; clear: both;} .creat-pack.double .left-box {display: inline-block; width:25%;border-top:1px solid #acacac;border-bottom:1px solid #acacac;text-align: center;} .creat-pack.double .left-box > * {display:block; width:100%; padding:20px 10px; border-top:1px solid #eee;} .creat-pack.double:last-of-type .left-box > * {min-height:14px; padding:.4em 10px;} .creat-pack.double .left-box span {padding:0;} .creat-pack.double .left-box > *:first-child {border-top:0;} .creat-pack.double .left-box + .data {width:70%; float:right;} .pcr-box {min-height:200px; margin-top:80px; background:url(/images/solutions/img_pcr02.jpg)no-repeat right bottom;} .pcr-box h4 {font-size:24px; font-weight:bold;} .pcr-box p {margin-top:30px; padding-right:320px; line-height:1.7;} .global-link.img a {overflow:hidden; width:350px;height:375px;} .global-link.img a:after {top:18px; margin-top:0;} .global-link.img a img {display: block; position:absolute; left:0;bottom:0; width:100%; border-top:1px solid #ebebeb;transition: border 0.3s ease-in-out;} .global-link.img a:hover img {border-top-color:#e00529;} .code-box {margin-top:20px;} .code-box p {margin-bottom:10px; font-size:18px; font-weight:bold; } .code-box #captcha {display:inline-block; margin-right:10px; vertical-align:top;} .code-box #captcha + input {margin-top:5px;}