/* /// 공통 /// */ .header_on .hamburger-inner, .header_on .hamburger-inner:after, .header_on .hamburger-inner:before {background-color:#000} /* /// COMMERCE /// */ /*210322 추가*/ #fullpage .seBox2 div.swiper-slide dl .btn_more{font-family:'Montserrat-Bold'; font-size:15px; line-height: 24px; text-decoration: underline;} /* /// PAYMENT /// */ .hamburger__icon:before, .hamburger__icon:after { background-color:#000; } /* section1 */ .solutionConBox .visualBox:before {background:rgba(0,0,0,0.6)} .solutionConBox .seBox1 {text-align:center;padding:110px 0 120px} .solutionConBox .seBox1 h2 {font-family:'Montserrat-Bold';font-size: 44px;line-height:60px;margin-bottom:12px;text-align:center;} .solutionConBox .seBox1 p {font-weight:300;margin-bottom:60px;font-size:20px;line-height:34px;} .solutionConBox .seBox1 a.btn {background-color:#f53024;margin-bottom:120px;text-align:left;} .solutionConBox .seBox1 div.swiper-slide {width:100%;max-width:1200px;margin:0 auto;overflow:hidden} .solutionConBox .seBox1 div.swiper-slide dl {width:340px;height:340px;box-sizing:border-box;border:1px solid #e1e1e1;background:#fff;text-align:center;padding:170px 20px 0;margin:0 auto;} .solutionConBox .seBox1 div.swiper-slide dl dt {font-size: 24px;font-weight:600;line-height:30px;margin-bottom:10px;} .solutionConBox .seBox1 div.swiper-slide dl dd {font-weight:300;font-size:15px} .solutionConBox .seBox1 div.swiper-slide dl.box1 {background:url(../../images/solutions/payment_sec1_img1.svg) center 80px no-repeat;background-size:52.8px;} .solutionConBox .seBox1 div.swiper-slide dl.box2 {background:url(../../images/solutions/payment_sec1_img2.svg) center 80px no-repeat;background-size:73.9px} .solutionConBox .seBox1 div.swiper-slide dl.box3 {background:url(../../images/solutions/payment_sec1_img3.svg) center 80px no-repeat;background-size:60px} /* section2 */ .solutionConBox .seBox2 {text-align:center} .solutionConBox .seBox2 .visual {display:block;margin:0 auto 110px;width:auto;height:500px;max-width:100%;background:url(../../images/solutions/payment_sec2_img1.png) top center no-repeat} .solutionConBox .seBox2 h2 {font-size:44px;font-family:'Montserrat-Bold';margin-bottom:20px} .solutionConBox .seBox2 p {font-size:18px;line-height:30px;margin-bottom:50px} .solutionConBox .seBox2 img {display:block;width:100%;margin:0 auto 63.7px;max-width:1200px;} .solutionConBox ul.logoList {width:100%;max-width:1200px;margin:0 auto 120px;text-align:left;font-size:0} .solutionConBox ul.logoList li {display:inline-block;box-sizing:border-box;border:1px solid #c2c2c2;width:23%;height:auto;text-align:center;margin:0 2.666% 2.666% 0;} .solutionConBox ul.logoList li:nth-child(4n) {margin-right:0} .solutionConBox ul.logoList li img {display:block;width:100%;margin:0} /*210319 logoListShort 추가*/ .solutionConBox ul.logoListShort {width:100%;max-width:1200px;margin:0 auto;text-align:left;font-size:0} .solutionConBox ul.logoListShort li {display:inline-block;box-sizing:border-box;border:1px solid #c2c2c2;width:23%;height:auto;text-align:center;margin:0 2.666% 2.666% 0;} .solutionConBox ul.logoListShort li:nth-child(4n) {margin-right:0} .solutionConBox ul.logoListShort li img {display:block;width:100%;margin:0} /*210319 logoListShort 추가 end*/ /* section3 */ .solutionConBox .topVisualBox {width:100%;height:500px;position:relative} .solutionConBox .topVisualBox .center {width:100%;max-width:1200px;margin:0 auto;overflow:hidden;position:relative;height:500px;box-sizing:border-box;padding:119px 0 0 57px} .solutionConBox .topVisualBox .center p {font-family:'Montserrat-Bold';font-size:35px;line-height:48px;margin-bottom:61px;position:relative} .solutionConBox .topVisualBox .center p:before {content:"";display:block;width:19.5px;height:1px;background-color:#000;position:absolute;top:125px;left:0} .solutionConBox .topVisualBox .center dl dt {font-weight:300px;font-size:19px;} .solutionConBox .topVisualBox .center dl dd {font-size:20px;color:#999} .solutionConBox .txtBox {width:100%;max-width:1200px;margin:0 auto;box-sizing:border-box;padding:60px;position:relative;z-index:2;top:-93px;left:0;background:#fff;} .solutionConBox .txtBox h2 {font-size:34px;line-height:60px;font-family:'Montserrat-Regular';margin-bottom:48px} .solutionConBox .txtBox h2 span {display:block;font-size:44px;font-family:'Spoqa Han Sans Neo'} .solutionConBox .txtBox h2 b {display:block;font-weight:600;font-size:44px;font-family:'Spoqa Han Sans Neo'} .solutionConBox .txtBox a.btn {background-color:#000;margin:0 0 54px 0} .solutionConBox .txtBox p {font-size:20px;line-height:34px;color:#666;margin-bottom:83px} .solutionConBox .imgList {font-size:0;width:100%;text-align:center} .solutionConBox .imgList li {display:inline-block;margin-left:30px;position:relative;width:340px;height:340px;overflow:hidden} .solutionConBox .imgList li img {display:block;margin:0 auto;position:absolute;top:50%;left:50%;width: auto;max-width: none; transform:translate3d(-50%,-50%,0); -webkit-transform:translate3d(-50%,-50%,0); -ms-transform:translate3d(-50%,-50%,0); transition:transform .2s linear; -webkit-transition:transform .2s linear; -ms-transition:transform .2s linear;} .solutionConBox .imgList li:hover img { transform:translate3d(-50%,-50%,0) scale(1.1); -webkit-transform:translate3d(-50%,-50%,0) scale(1.1); -ms-transform:translate3d(-50%,-50%,0) scale(1.1); transition:transform .2s linear; -webkit-transition:transform .2s linear; -ms-transition:transform .2s linear; } .solutionConBox .imgList li:first-child {margin-left:0} .solutionConBox .seBox3 .topVisualBox {background:url(../../images/solutions/payment_sec3_visual.png) top center no-repeat} .solutionConBox .seBox4 .topVisualBox {background:#eee1d5;/*color:#fff*/} .solutionConBox .seBox4 .topVisualBox .center {position:relative} .solutionConBox .seBox4 .gifBox {position:absolute;top:46px;right:51px} .solutionConBox .seBox5 .topVisualBox {background:url(../../images/solutions/payment_sec5_visual.jpg) top center no-repeat} /*.solutionConBox .seBox5 .logoList li {width:255px;margin:0px 20px 20px 0}*/ .solutionConBox .seBox6 .topVisualBox {background:url(../../images/solutions/payment_sec6_visual.jpg) top center no-repeat;background-position:cover} .solutionConBox .seBox6 .imgList {margin-bottom:120px} .solutionConBox .seBox6 .youtubeBox {width:100%;position:relative;padding-bottom: 56.25%;overflow: hidden;} .solutionConBox .seBox6 .youtubeBox iframe {position: absolute;top:0;left:0;width:100%;height:100%;} .solutionConBox .seBox7 {background:#f5f5f5;padding:99px 0 248px;text-align:center} .solutionConBox .seBox7 h2 {font-family:'Montserrat-Bold';font-size:44px;line-height:54px;margin-bottom:109px} .solutionConBox .seBox7 div {width:100%;max-width:1200px;margin:0 auto} .solutionConBox .seBox7 div ul {width:100%;height:auto;font-size:0;overflow:hidden} .solutionConBox .seBox7 div ul li {display:block;float:left;width:33.333%;font-size:15px;line-height:24px;text-align:Center;box-sizing:border-box;padding:0 20px} .solutionConBox .seBox7 div ul li div {position:relative;width:340px;height:340px;overflow:hidden} .solutionConBox .seBox7 div ul li div img {display:block;margin:0 auto;position:absolute;top:50%;left:50%;width: auto;max-width: none; transform:translate3d(-50%,-50%,0); -webkit-transform:translate3d(-50%,-50%,0); -ms-transform:translate3d(-50%,-50%,0); transition:transform .2s linear; -webkit-transition:transform .2s linear; -ms-transition:transform .2s linear;} .solutionConBox .seBox7 div ul li:hover div img { transform:translate3d(-50%,-50%,0) scale(1.1); -webkit-transform:translate3d(-50%,-50%,0) scale(1.1); -ms-transform:translate3d(-50%,-50%,0) scale(1.1); transition:transform .2s linear; -webkit-transition:transform .2s linear; -ms-transition:transform .2s linear; } .solutionConBox .seBox7 div ul li p {font-family:'Montserrat-Bold';font-size:24px;line-height:35px;margin:35px 0 12px} .solutionConBox .seBox7 a.btn {background-color:#000;text-align:left;margin:26px auto 0} /*21-11-30 추가*/ .solutionConBox .seBox8 .topVisualBox {background:url(../../images/solutions/payment_sec8_visual.jpg) top center no-repeat;background-position:cover} .solutionConBox .seBox8 .imgList {margin-bottom:120px} .solutionConBox .seBox9 .topVisualBox {background:url(../../images/solutions/payment_sec9_visual.jpg) top center no-repeat;background-position:cover} .solutionConBox .seBox9 .imgList {margin-bottom:120px} /*21-11-30 추가 end*/ /*2302 추가*/ .solutionConBox .seBox10 .topVisualBox {background:url(../../images/solutions/payment_sec10_visual.jpg) top center no-repeat;background-position:cover} .solutionConBox .seBox10 .imgList {margin-bottom:120px} .solutionConBox .seBox10 .imgList li {width:200px; height: 280px; margin-left: 20px;} .solutionConBox .seBox10 .imgList li:first-child {margin-left: 0;} /*2302 추가 end*/ /* API */ .solutionConBox .seBox1 .logoList {margin-top:120px} #API_box .txtBox h2 {line-height:60px;font-size:44px;font-family:'Montserrat-Light'} #API_box .seBox5 .topVisualBox {background:url(../../images/solutions/API_sec1_visual.png) top center no-repeat;background-position:cover;background-color:none} #API_box .seBox6 .topVisualBox {background:url(../../images/solutions/API_sec2_visual.jpg) top center no-repeat;background-position:cover} #API_box .seBox1 div.swiper-slide dl.box1 {background:url(../../images/solutions/API_sec1_img1.png) center 72px no-repeat;background-size:74px;} #API_box .seBox1 div.swiper-slide dl.box2 {background:url(../../images/solutions/API_sec1_img2.png) center 87px no-repeat;background-size:73.5px} #API_box .seBox1 div.swiper-slide dl.box3 {background:url(../../images/solutions/API_sec1_img3.png) center 82px no-repeat;background-size:56px} #API_box .seBox8 {padding-bottom:0;overflow:hidden;} #API_box .seBox8 .topVisualBox {background:url(../../images/solutions/API_sec8_visual.jpg) top center no-repeat;background-position:cover} #API_box .seBox8 .colorBox {font-size:0;float:left;padding-top:55px} #API_box .seBox8 .colorBox span {display:inline-block;width:80px;height:80px;border-radius:14px;margin-right:10px} #API_box .seBox8 .colorBox span.gBox {background-color:#c8e4a9} #API_box .seBox8 .colorBox span.rBox {background-color:#c7102e} #API_box .seBox8 .colorBox span.bBox {background-color:#3851a2} #API_box .seBox8 .imgList li {height:auto;overflow:inherit} #API_box .seBox8 .imgList li div {width:340px;height:340px;overflow:hidden;position:relative;margin-bottom:30px} #API_box .seBox8 .imgList li dl {font-size:20px;color:#666;line-height:30px;text-align:center} #API_box .seBox8 .imgList li dl dt {font-weight:bold;} /*21-11-30 추가*/ #API_box .seBox9 .topVisualBox {background:url(../../images/solutions/API_sec9_visual.jpg) top center no-repeat;background-position:cover;background-color:none} /*21-11-30 추가 end*/ /*2302 추가*/ #API_box .seBox11 .topVisualBox {background:url(../../images/solutions/API_sec10_visual.jpg) top center no-repeat;background-position:cover;background-color:none} /*2302 추가 end*/ /* /// work /// */ #CS_common .textBox {padding-top:325px;box-sizing:Border-box;height:980px;} #CS_common .textBox dl dt {font-size:22px;line-height:30px;margin-bottom:10px;font-weight:normal} #CS_common .textBox dl dd {font-weight:normal;font-size:52px;line-height:70px;font-family:"Spoqa Han Sans Neo";} #CS_common .textBox dl dd b {display:block;} #CS_common .textBox dl dd p {font-size:52px;line-height:70px;margin-top:0;font-weight:normal;font-family:"Spoqa Han Sans Neo";} #workBox:before {background:rgba(0,0,0,0.6)} .workConBox .pc_none{display: none;} .workConBox .mo_none{display: block;} .visualBox .textBox span {display:block;position:Absolute;bottom:50px;left:0;width:100%;text-align:Center;font-weight:600;padding-bottom:60px; background:url(../../images/work/scrollDown_arrow.svg) center 35px no-repeat;background-size:20px;} .workConBox .seBox1 {width:100%;max-width:1200px;margin:0 auto;padding:100px 0 110px} .workConBox .seBox1 .projectBox {width:100%;height:Auto;overflow:hidden;margin-bottom:100px} .workConBox .seBox1 .projectBox ul.list {float:left;font-size:18px;line-height:30px;} .workConBox .seBox1 .projectBox ul.list li:first-child {font-weight:bold;margin-bottom:20px;} .workConBox .seBox1 .projectBox ul.list li span {display:inline-block;width:90px;color:#999;} .workConBox .seBox1 table{display: inline-block;} .workConBox .seBox1 thead th{font-size:18px;line-height:30px;font-weight:600; text-align: left;vertical-align: top;color:#000;padding-bottom:15px;} .workConBox .seBox1 tbody th{width: 100px; font-size:18px;line-height:30px;text-align: left;vertical-align: top;color:#999;} .workConBox .seBox1 td{font-size:18px;line-height:30px;text-align: left;} .workConBox .seBox1 .projectBox ul.logo {float:right;font-size:0;display:table;table-layout:fixed;margin-top:14px} .workConBox .seBox1 .projectBox ul.logo li {display:table-cell;width:130px;height:120px;padding-right:10px;text-align:Center;vertical-align:middle;position:Relative} .workConBox .seBox1 .projectBox ul.logo li:before {content:"";display:block;width:120px;height:120px;position:Absolute;top:0;left:0} .workConBox .seBox1 .projectBox ul.logo li:last-child {padding-right:0} .workConBox .seBox1 .projectBox ul.logo li img {width: 100%; margin:0 auto;} .workConBox .seBox1 dl dt {font-size:44px;line-height:55px;margin-bottom:30px} .workConBox .seBox1 dl dd {font-size:20px;line-height:30px;} .workConBox .seBox1 dl dd img {display:block;width:auto;max-width:100%;margin:0 auto;margin-top:70px;} .workConBox .seBox1 .imgBox span.web_view {display:block;font-size:44px;line-height:55px;margin-bottom:70px} .workConBox .seBox1 .imgBox span.m_view {display:none} .workConBox .seBox1 .imgBox img {display:block;width:Auto;max-width:100%;margin:0 auto;} .workConBox .seBox2 {background-color:#1d1d1d;padding:100px 0 170px;overflow:hidden} .workConBox .seBox2 .title, .workConBox .seBox2 .conBox {width:100%;max-width:1200px;margin:0 auto;} .workConBox .seBox2 .title {font-size:90px;line-height:100px;font-weight:300;margin-bottom:50px} .workConBox .seBox2 .conBox dl {float:left;} .workConBox .seBox2 .conBox dl dt {font-size:24px;line-height:30px;color:#ffe300;margin-bottom:20px} .workConBox .seBox2 .conBox dl dd {color:#fff;font-size:20px;line-height:30px;} .workConBox .seBox2 .conBox dl dd.first {margin-bottom:30px} .workConBox .seBox2 .conBox dl dd ul {margin-top:14px} .workConBox .seBox2 .conBox dl dd ul li {position:Relative;font-size:20px;line-height:30px;padding-left:15px;font-weight:300;} .workConBox .seBox2 .conBox dl dd ul li:before {content:"·";display:block;position:Absolute;top:0;left:0} .workConBox .seBox2 .conBox img {display:block;float:right;display:block;} .workConBox .seBox3 {clear:both;width:100%;max-width:1200px;margin:0 auto;padding:111px 0 180px} .workConBox .seBox3 dl {margin-bottom:70px} .workConBox .seBox3 dl dt {font-size:44px;line-height:55px;margin-bottom:30px;font-weight:300} .workConBox .seBox3 dl dd {font-size:20px;line-height:30px;} .workConBox .seBox3 img {display:block;width:auto;max-width:100%;margin:0 auto} .workConBox .seBox4 {position:relative;width:100%;margin:0 auto;box-sizing:border-box;padding:90px 0 180px} .workConBox .seBox4:before {content:"";display:block;width:100%;height:540px;background-color:#1d1d1d;position:Absolute;top:0;left:0;z-index:-1} .workConBox .seBox4 dl dt{font-size:44px;line-height:55px;margin-bottom:30px} .workConBox .seBox4 dl dd {font-size:20px;line-height:30px;} .workConBox .seBox4 dl dd img {display:block;max-width:1200px;margin:70px auto 0;} .workConBox .seBox4 dl.last {color:#000;margin-top:110px} .workConBox .seBox4 .imgbox img:first-child {margin-bottom:50px;display:block} .workConBox .seBox5 {position:relative;width:100%;margin:0 auto;box-sizing:border-box;padding:110px 0 180px} .workConBox .seBox5:before {content:"";display:block;width:100%;height:540px;background-color:#f5f5f5;position:Absolute;top:0;left:0;z-index:-1} .workConBox .seBox5 dl {font-size:44px;line-height:55px;color: #000;} .workConBox .seBox5 dl dt {margin-bottom:30px;} .workConBox .seBox5 dl dd {font-size:20px;line-height:30px;} .workConBox .seBox5 img {display:block;max-width:1080px;margin:0 auto;margin-top:70px;} .workConBox .seBox5 .last {margin-top:70px;} .workConBox .seBox5 .VisualBanner{width:100%; height:400px;margin-top: 200px;} .workConBox .seBox5 .VisualBanner:before{content:"";display:block;width:100%;height:400px;background:url(../../images/work/CS07_img_03.png) top right no-repeat;background-size:cover;position:absolute;left:0;z-index:-1} .workConBox .seBox5 .VisualBanner p{width: 1200px;margin: 0 auto;padding: 170px 0;font-size: 44px;font-weight: 600;line-height: 55px;color: #fff;} .workConBox .seBox6 {position:relative;width:100%;margin:0 auto;box-sizing:border-box;padding:90px 0 180px} .workConBox .seBox6:before {content:"";display:block;width:100%;height:540px;background-color:#f5f5f5;position:absolute;top:0;left:0;z-index:-1} .workConBox .seBox6.BG_long:before {content: "";display: block;width: 100%;height: 800px;background-color: #f5f5f5;position: absolute;top: 0;left: 0;z-index: -1} .workConBox .seBox6 dl {font-size:44px;line-height:55px;color: #000;} .workConBox .seBox6 dl dd {font-size:20px;line-height:30px;} .workConBox .seBox6 img {display:block;max-width:1080px;margin:0 auto;margin-top:70px;} .workConBox .seBox7 {position:relative;width:100%;margin:0 auto;box-sizing:border-box;padding-bottom: 200px;} .workConBox .seBox7 p{font-size:44px;line-height:55px;color: #000;} .workConBox .seBox7 dl {font-size:30px;line-height:40px;color: #000;} .workConBox .seBox7 dl dd img{display: block; width: auto; max-width:1080px;margin:70px auto 0;} .workConBox .seBox8 dl {font-size:44px;line-height:55px;color: #000;padding-bottom:200px;} .workConBox .seBox8 dl dt {margin-bottom:30px;} .workConBox .seBox8 dl dd img {display: block; width: auto; max-width: 100%;margin:70px auto 0;} .workConBox .seBox8 .VisualBanner{width:100%; height:400px;} .workConBox .seBox8 .VisualBanner:before{content:"";display:block;width:100%;height:400px;background:url(../../images/work/CS06_img_05.png) top right no-repeat;background-size:cover;position:absolute;left:0;z-index:-1} /*21-11-30 추가*/ .workConBox .seBox9 {position:relative;width:100%;margin:0 auto;box-sizing:border-box;padding:90px 0 180px} .workConBox .seBox9:before {content:"";display:block;width:100%;height:2220px;background-color:#1d1d1d;position:Absolute;top:0;left:0;z-index:-1} .workConBox .seBox9 dl dt{font-size:44px;line-height:55px;margin-bottom:30px} .workConBox .seBox9 dl dd {font-size:20px;line-height:30px;} .workConBox .seBox9 dl dd img {display:block;max-width:1200px;margin:70px auto 0;} .workConBox .seBox9 dl.last {color:#000;margin-top:110px} .workConBox .seBox9 .imgbox img:first-child {margin-bottom:50px;display:block} .workConBox .BG_Lightblue:before{height:620px;background-color:#ECF8FE;} /*21-11-30 추가 end*/ .workConBox .PD_top{margin-top:70px;} .workConBox .PD_top_big{margin-top:120px;} .workConBox .PD_top_small {margin-top: 40px;} .workConBox .FontBlack{color:#000;} .workConBox .BG_yellow:before{background-color: #FFF9F3;} .workConBox .BG_blue:before{background-color: #ECF8FE;} .workConBox .BG_full:before{height:1400px;} /*210326 전체보기 버튼 추가*/ .workConBox .seBoxBtn {position:relative;width:100%;margin:0 auto;box-sizing:border-box;padding:100px 0;} .workConBox .seBoxBtn:before {content:"";display:block;width:100%;height:300px;background-color:#f5f5f5;position:Absolute;top:0;left:0;z-index:-1} .workConBox .btn_list {display:block;width:270px;height:100px;margin:0 auto;font-weight:600;font-size:24px;line-height:34px;background-color: #fff;border:1px solid #000;text-align:center;box-sizing:border-box;padding-top:32px;} /*210326 전체보기 버튼 추가 end*/ .workConBox .orderBox, .workConBox .deliveryBox {position:Relative;padding-bottom:119px} .workConBox .orderBox:before, .workConBox .deliveryBox:before {content:"";display:block;width:100%;height:540px;position:Absolute;top:0;left:0;z-index:-1} .workConBox .deliveryInfo01:before {background-color:#f2f5ff;} .workConBox .deliveryInfo02:before {background-color:#f2f5de;} .workConBox .deliveryInfo03:before {background-color:#f8eee2;} .workConBox .deliveryInfo01, .workConBox .deliveryInfo02, .workConBox .deliveryInfo03 {padding:110px 0 120px} .workConBox .orderBox, .workConBox .deliveryBox p {width:100%;max-width:1200px;margin:0 auto 60px;font-size:44px;line-height:55px} .workConBox .orderBox p b, .workConBox .deliveryBox p b {display:block} .workConBox .orderBox img, .workConBox .deliveryBox img {display:block;width:auto;max-width:100%;margin:0 auto} .workConBox .orderBox .sliderBox {width:100%;max-width:1200px;margin:70px auto 0;box-sizing:border-box;overflow:hidden;position:relative;} .workConBox .orderBox .sliderBox .slick-list {width:100%;max-width:980px;margin:0 auto;overflow:hidden} .workConBox .orderBox .sliderBox .slick-dots {text-align:center;height:12px;margin-top:40px} .workConBox .orderBox .sliderBox .slick-dots li {display:inline-block;margin:0 5px} .workConBox .orderBox .sliderBox .slick-dots li button {border:0;font-size:0;vertical-align:top;background-color:rgba(0,0,0,.1);width:12px;height:12px;border-radius:0} .workConBox .orderBox .sliderBox .slick-dots li.slick-active button {background-color:rgba(0,0,0,1)} .workConBox .orderBox .sliderBox .slick-arrow {position:Absolute;top:50%;margin-top:-21px} .workConBox .orderBox .sliderBox .slick-prev {display:block;left:0;font-size:21px;border:0;background:transparent;color:#000} .workConBox .orderBox .sliderBox .slick-next {display:block;right:0;font-size:21px;border:0;background:transparent;color:#000} /* /// about /// */ .aboutConBox .seBox1 {text-align:Center;padding:126px 0} .aboutConBox .seBox1 h2 {font-family:'Montserrat-Bold';font-size:44px;line-height:55px;margin-bottom:24px} .aboutConBox .seBox1 p {font-size:24px;line-height:32px;margin-bottom:18px} .aboutConBox .seBox1 span {display:block;color:#666;font-size:16px;line-height:30px;font-weight:300} .aboutConBox .seBox2 {background:#000;} .aboutConBox .seBox2 .videoVisual {width:100%;height:800px;position:relative;overflow:hidden;background:url(../../images/about/video_bg.png) top center no-repeat;} .aboutConBox .seBox2 .videoVisual #videobcg {position: absolute;top:0;left:0px;min-width: 100%;min-height: 100%;width:100%;height: auto;z-index:1;overflow: hidden;} .aboutConBox .seBox2 h2 {width:100%;max-width:1200px;margin:0 auto;font-family:'Montserrat-Bold';line-height:50px;position:relative;top:-72px;font-size:44px;color:#fff;z-index:1} .aboutConBox .seBox2 ul {width:100%;max-width:1200px;margin:0 auto;box-sizing:border-box;font-size:0;padding:37px 0px 90px 100px } .aboutConBox .seBox2 ul li {width:50%;display:inline-block;color:#fff;font-weight:300;font-size:16px;line-height:24px;min-height:240px} .aboutConBox .seBox2 ul li img {margin-bottom:15px} .aboutConBox .seBox2 ul li p {font-size:20px;line-height:26px;margin-bottom:21px;color:#fff} .aboutConBox .seBox3 {background:#f5f5f5;text-align:center;padding:111px 0 120px} .aboutConBox .seBox3 h2 {font-family:'Montserrat-Bold';font-size:44px;line-height:55px;margin-bottom:49px} .aboutConBox .seBox3 ul li {width:100%;max-width:340px;float:left;margin-left:90px;text-align:center;height:360px;box-sizing:border-box} .aboutConBox .seBox3 ul li div {background-color:#fff;padding:63px 0} .aboutConBox .seBox3 ul li:first-child {margin-left:0} .aboutConBox .seBox3 ul li b {font-family:'Montserrat-Bold';font-size:50px;margin-bottom:34px;display:block;color:#f53024} .aboutConBox .seBox3 ul li dl dt {font-weight:bold;font-size:24px;line-height:24px;margin-bottom:24px} .aboutConBox .seBox3 ul li dl dt span {display:block;color:#999;font-size:14px;font-weight:normal} .aboutConBox .seBox3 ul li dl dd {} .aboutConBox .seBox4 {width:100%;max-width:1200px;margin:0 auto;overflow:hidden;padding-top:110px} .aboutConBox .seBox4 h2 {font-family:'Montserrat-Bold';font-size:44px;line-height:55px;margin-bottom:49px;text-align:Center} .aboutConBox .seBox4 .historyBox {width:100%;} .aboutConBox .seBox4 .historyBox ul li span.title {display:none} /*2302 수정*/ .aboutConBox .seBox4 .historyBox .con div {min-width:525px;max-width:50%;width:100%;float:left;height:610px; padding-bottom: 50px;} /*2302 수정 end*/ .aboutConBox .seBox4 .historyBox .con div figure {margin-bottom:54px} .aboutConBox .seBox4 .historyBox .con div figure img {width:100%;max-width:525px;box-sizing:border-box;border:1px solid #e1e1e1;} .aboutConBox .seBox4 .historyBox .con div p {font-family:'Montserrat-Bold';font-size:30px;padding-bottom:13px;border-bottom:1px solid #999;margin-bottom:15px;max-width:525px} .aboutConBox .seBox4 .historyBox .con div ul{line-height:30px} .aboutConBox .seBox5 {background:#f5f5f5;text-align:center;padding:110px 0 60px;overflow:hidden} .aboutConBox .seBox5 h2 {font-family:'Montserrat-Bold';font-size:44px;line-height:55px;margin-bottom:73px;text-align:Center} .aboutConBox .seBox5 ul {width:100%;max-width:1290px;margin:0 auto;} .aboutConBox .seBox5 ul li {float:left;text-align:center;width:25%;margin-bottom:55px;box-sizing:border-box;padding:0 1%} .aboutConBox .seBox5 ul li div {margin-bottom:30px;width:auto;max-width:280px;height:280px;position:relative;overflow:hidden} /*21-11-30 수정*/ .aboutConBox .seBox5 ul li div img {display:block;margin:0 auto;position:absolute;top:50%;left:50%;width:280px;max-width: none; transform:translate3d(-50%,-50%,0); -webkit-transform:translate3d(-50%,-50%,0); -ms-transform:translate3d(-50%,-50%,0); transition:transform .2s linear; -webkit-transition:transform .2s linear; -ms-transition:transform .2s linear;} /*21-11-30 수정 end*/ .aboutConBox .seBox5 ul li a:hover div img { transform:translate3d(-50%,-50%,0) scale(1.1); -webkit-transform:translate3d(-50%,-50%,0) scale(1.1); -ms-transform:translate3d(-50%,-50%,0) scale(1.1); transition:transform .2s linear; -webkit-transition:transform .2s linear; -ms-transition:transform .2s linear; } .aboutConBox .seBox5 ul li p {font-size:24px;line-height:35px;margin-bottom:10px;text-align:center;font-weight:bold;} .aboutConBox .seBox5 ul li span {display:block;width:auto;max-width:340px;margin:0 auto;} /*210326 about 지도 추가*/ .aboutConBox .seBox6{margin-top:140px;} .aboutConBox .seBox6 h2 {font-family:'Montserrat-Bold';font-size:44px;line-height:55px;margin-bottom:14px;width:100%;max-width:1200px;margin:0 auto; text-align: center;} .aboutConBox .seBox6 p {width:100%;max-width:1200px;margin:0 auto;font-size:20px;line-height:30px;margin-bottom:57px; text-align: center;} .aboutConBox .seBox6 .locationMap {width:100%;height:500px} .aboutConBox .seBox6 .locationMap iframe {width:100%;height:500px} /*210326 추가 end*/ /* /// recruitConBox /// */ .recruitConBox .visualBox:before {background:rgba(0,0,0,0.6)} .recruitConBox .seBox1 {padding:111px 0 77px;width:100%;max-width:1200px;margin:0 auto} .recruitConBox .seBox1 h2 {font-family:'Montserrat-Bold';font-size:44px;margin-bottom:15px;line-height:55px} .recruitConBox .seBox1 h2 + p {font-size:18px;line-height:26px;margin-bottom:85px} .recruitConBox .seBox1 ol {width:100%;overflow:hidden} .recruitConBox .seBox1 ol li {width:30%;float:left;margin-right:5%;height:248px;position:relative} .recruitConBox .seBox1 ol li:nth-child(3n) {margin-right:0} .recruitConBox .seBox1 ol li b {font-family:'Montserrat-Regular';font-size:40px;color:#e1e1e1;display:block;border-bottom:1px solid #e1e1e1;padding-bottom:18px;margin-bottom:18px} .recruitConBox .seBox1 ol li p {font-size:24px;line-height:30px;padding-right:30px;margin-bottom:30px} .recruitConBox .seBox1 ol li span {display:block;font-family:'Montserrat-Light';font-size:15px;position:absolute;bottom:46px;left:0;color:#999999} .recruitConBox .seBox2 {background:#000;} .recruitConBox .seBox2 h2 {font-family:'Montserrat-Bold';font-size:44px;margin-bottom:15px;line-height:55px;color:#fff;width:100%;max-width:1200px;margin:0 auto;padding:90px 0} .recruitConBox .seBox2 div.web_view {width:100%;max-width:1200px;margin:0 auto;overflow:hidden;} .recruitConBox .seBox2 div dl {width:33.333%;float:left;color:#fff;height:380px;box-sizing:border-box;padding-top:72px} .recruitConBox .seBox2 div dl.list1 {background:url(../../images/recruit/secBox2_icon1.png) left 16px no-repeat;} .recruitConBox .seBox2 div dl.list2 {background:url(../../images/recruit/secBox2_icon2.png) left 0 no-repeat;} .recruitConBox .seBox2 div dl.list3 {background:url(../../images/recruit/secBox2_icon3.png) left 0 no-repeat;} .recruitConBox .seBox2 div dl.list4 {background:url(../../images/recruit/secBox2_icon4.png) left 18.4px no-repeat;} .recruitConBox .seBox2 div dl.list5 {background:url(../../images/recruit/secBox2_icon5.png) left 0 no-repeat;} .recruitConBox .seBox2 div dl.list6 {background:url(../../images/recruit/secBox2_icon6.png) left 19px no-repeat;} .recruitConBox .seBox2 div dl.list7 {background:url(../../images/recruit/secBox2_icon7.png) left 11px no-repeat;} .recruitConBox .seBox2 div dl.list8 {background:url(../../images/recruit/secBox2_icon8.png) left 0 no-repeat;} .recruitConBox .seBox2 div dl dt {font-size:24px;line-height:26px;margin-bottom:10px} .recruitConBox .seBox2 div dl dd {font-size:15px;line-height:24px} .recruitConBox .seBox3 {padding:99px 0 0 0;width:100%} .recruitConBox .seBox3 h2 {font-family:'Montserrat-Bold';font-size:44px;line-height:55px;width:100%;max-width:1200px;margin:0 auto 14px} .recruitConBox .seBox3 p {font-size:18px;line-height:26px;width:100%;max-width:1200px;margin:0 auto 60px} .recruitConBox .seBox3 div {width:100%;overflow:hidden;max-width:1290px;margin:0 auto;font-size:0;text-align:center} .recruitConBox .seBox3 div dl {width:100%;max-width:340px;height:340px;box-sizing:border-box;display:inline-block;border:1px solid #e1e1e1;text-align:center;margin:0px 45px 90px 45px;text-align:center;padding-top:172.4px;} .recruitConBox .seBox3 div dl dt {font-weight:600;font-size:21px;line-height:26px;margin-bottom:19.6px;} .recruitConBox .seBox3 div dl dd {font-size:14px;line-height:20px;} .recruitConBox .seBox3 div dl.list1 {background:url(../../images/recruit/seBox_icon1.png) center 58.8px no-repeat;} .recruitConBox .seBox3 div dl.list2 {background:url(../../images/recruit/seBox_icon2.png) center 52.8px no-repeat;} .recruitConBox .seBox3 div dl.list3 {background:url(../../images/recruit/seBox_icon3.png) center 65.8px no-repeat;} .recruitConBox .seBox3 div dl.list4 {background:url(../../images/recruit/seBox_icon4.png) center 65px no-repeat;} .recruitConBox .seBox3 div dl.list5 {background:url(../../images/recruit/seBox_icon5.png) center 65px no-repeat;} .recruitConBox .seBox3 div dl.list6 {background:url(../../images/recruit/seBox_icon6.png) center 78px no-repeat;} .recruitConBox .seBox3 div dl.list7 {background:url(../../images/recruit/seBox_icon7.png) center 64px no-repeat;} .recruitConBox .seBox3 div dl.list8 {background:url(../../images/recruit/seBox_icon8.png) center 64px no-repeat;} .recruitConBox .seBox3 div dl.list9 {background:url(../../images/recruit/seBox_icon9.png) center 64px no-repeat;} .recruitConBox .seBox4 .topVisualBox {background:url(../../images/recruit/seBox4_visual.png) top center no-repeat;background-size:1960px;width:100%;height:500px} .recruitConBox .seBox4 .txtBox {width:100%;max-width:1200px;margin:0 auto;box-sizing:border-box;padding:60px 0;position:relative;z-index:2;top:-93px;left:0;background:#fff;} .recruitConBox .seBox4 .txtBox dl {line-height:60px;margin-bottom:143px;padding-left:60px} .recruitConBox .seBox4 .txtBox dl dt {font-size:34px;} .recruitConBox .seBox4 .txtBox dl dd {font-size:44px;font-weight:600;} .recruitConBox .seBox4 .txtBox .stepList {width:100%;margin-bottom:77px} .recruitConBox .seBox4 .txtBox .stepList td {width:25%;text-align:center;vertical-align:middle;position:relative;box-sizing:border-box;padding:30px 3.4%} .recruitConBox .seBox4 .txtBox .stepList td img {display:block;width:100%} .recruitConBox .seBox4 .txtBox .stepList td b {position:absolute;top:0;left:0;display:block;width:100%;height:100%;} .recruitConBox .seBox4 .txtBox .stepList td b div {display:table;vertical-align:middle;width:100%;height:100%} .recruitConBox .seBox4 .txtBox .stepList td b div span {display:table-cell;vertical-align:middle;font-size:24px} .recruitConBox .seBox4 .txtBox .stepList td b div span .sub_txt {display: inline;font-size:18px;font-weight: 300;} .recruitConBox .seBox4 .txtBox .chk_Info {box-sizing:border-box;padding:0 60px;margin-bottom:60px} .recruitConBox .seBox4 .txtBox .chk_Info p {font-weight:600;font-size:30px;line-height:45px;padding-bottom:11.5px;border-bottom:1px solid #e1e1e1;margin-bottom:14.5px} .recruitConBox .seBox4 .txtBox .chk_Info span {display:inline-block;position:relative;padding-right:30px} .recruitConBox .seBox4 .txtBox .chk_Info span:after {display:block;width:1px;height:30px;background:#999;position:Absolute;top:8px;right:15px;content:"";} .recruitConBox .seBox4 .txtBox .chk_Info ul {line-height:30px} .recruitConBox .seBox4 .txtBox .chk_Info ul li {color:#999;position:relative;padding-left:10px} .recruitConBox .seBox4 .txtBox .chk_Info ul li:before {display:block;position:absolute;top:15px;left:0;content:"";width:5px;height:1px;background:#999;} .recruitConBox .blankBox {width:100%;max-width:1080px;margin:0 auto;box-sizing:border-box;border:1px solid #707070;height:868px} /* 210326 recruit 지도부분 제외 .recruitConBox .seBox5 h2 {font-family:'Montserrat-Bold';font-size:44px;line-height:55px;margin-bottom:14px;width:100%;max-width:1080px;margin:0 auto; 6px} .recruitConBox .seBox5 p {width:100%;max-width:1080px;margin:0 auto;font-size:20px;line-height:30px;margin-bottom:57px;} .recruitConBox .seBox5 .locationMap {width:100%;height:500px} .recruitConBox .seBox5 .locationMap iframe {width:100%;height:500px}*/ /* /// counselingBox /// */ .counselingBox {text-align:center;background:#000;color:#fff;clear:both;padding:73px 0 82px;position:relative;z-index:1} .counselingBox h2 {font-size:36px;line-height:48px;margin-bottom:12px} .counselingBox p {font-family:'Montserrat-Regular';font-size:0} .counselingBox p a {color:#fff;display:inline-block;font-size:16px;position:relative} .counselingBox p a:first-child {padding-right:15px;} .counselingBox p a:first-child:before {content:"";display:block;position:absolute;top:5px;right:7.5px;width:1px;height:15px;background:#fff;} /* /// BOARD - 전자공시 /// */ .noticeConBox .seBox1 {width:100%;max-width:1200px;margin:0 auto;padding:112px 0;box-sizing:border-box;} .noticeConBox h2 {font-weight:600;font-size:44px;line-height:55px;margin-bottom:9px;text-align:center} .noticeConBox p {font-size:20px;line-height:34px;margin-bottom:118px;text-align:center} .noticeList {min-width: 0;border-top:2px solid #707070;margin-bottom:60.5px;} .noticeList .line {border-bottom:1px solid #dbdbdb;display: flex;font-size:24px;line-height:34px;font-weight:normal} .noticeList .line.top {font-weight:bold;text-align:center} .noticeList .line.top .title, .noticeList .line.top .date {padding-top:43px;padding-bottom:42.5px} .noticeList .title {text-overflow: ellipsis;white-space: nowrap;overflow: hidden;padding:32.5px 0 30px 59.5px;box-sizing:border-box;width:70%} .noticeList .date {flex-shrink: 0;text-align:center;padding:32.5px 0 30px;width:30%} .noticeConBox .noticePaging {text-align:center;font-size:0} .noticeConBox .noticePaging a {display:inline-block;width:50px;height:50px;text-align:center;line-height:50px;font-family:'Montserrat-Bold';position:relative;vertical-align:top;font-size:24px;} .noticeConBox .noticePaging a.prev {background:url(../../images/inc/pagingPrev.png) center center no-repeat;margin-right:20px} .noticeConBox .noticePaging a.next {background:url(../../images/inc/pagingNext.png) center center no-repeat;margin-left:20px} .noticeConBox .noticePaging a:before {display:none;content:"";position:absolute;bottom:-2px;left:0;width:100%;height:2px;background-color:#000;} .noticeConBox .noticePaging a.active:before {display:block} .noticeConBox .noticeview {border-top:2px solid #707070;font-size:24px;line-height:34px;} .noticeConBox .noticeview .title {box-sizing:border-box;padding:23.5px 59.5px 21.5px;border-bottom:1px solid #dbdbdb} .noticeConBox .noticeview .title span {display:block;color:#999} .noticeConBox .noticeview .file {border-bottom:1px solid #dbdbdb;box-sizing:border-box;padding:32.5px 59.5px;font-size:24px;line-height:34px} .noticeConBox .noticeview .file a {font-weight:bold;margin-left:10px} .noticeConBox .noticeview .textBox {width:100%;height:Auto;box-sizing:border-box;padding:63.5px 59px;font-size:24px;line-height:34px;border-bottom:1px solid #dbdbdb;margin-bottom:61.5px} .noticeConBox .prevNextList {width:100%;box-sizing:border-box;padding:0 60.5px 0 59.5px;position:relative} .noticeConBox .prevNextList ul {padding-top:11px} .noticeConBox .prevNextList ul li {line-height:36px} .noticeConBox .prevNextList ul li span {font-weight:bold;margin-right:15px;line-height:28px} .noticeConBox .prevNextList a.go_list {display:block;width:270px;height:100px;position:absolute;top:0;right:0;font-weight:600;font-size:24px;line-height:34px;border:1px solid #000;text-align:center;box-sizing:border-box;padding-top:32px} /* /// term /// */ /*210322 추가*/ .termBox{position:relative;max-width:1200px;margin:0 auto;padding: 100px 0;} .termBox h1{font-size:36px;padding-bottom: 20px; margin-bottom: 50px;border-bottom: 1px solid #c2c2c2;} .termBox h2{font-size:28px;padding:20px 0 10px 0;} .termBox p{font-size:16px;line-height:26px;} .termBox select{width:300px;padding: .8em .8em;font-family: inherit; font-size:16px;background: url(../../images/inc/btn_arrow_down.png) no-repeat 95% 50%; border: 1px solid #999; border-radius: 0px; -webkit-appearance: none; -moz-appearance: none; appearance: none;margin-bottom: 50px;} .termBox table.memberinfo2_area{width: 100%;margin:50px 0;padding-right: 10px;border-left: 1px solid #c2c2c2;} .termBox table.memberinfo2_area th{text-align: center;height: 50px;border-top: 1px solid #c2c2c2;border-right: 1px solid #c2c2c2;border-bottom: 1px solid #c2c2c2;font-size: 16px;font-weight: 700;background-color: #f5f5f5;} .termBox table.memberinfo2_area td{text-align: left; height: 50px; border-right: 1px solid #c2c2c2;border-bottom: 1px solid #c2c2c2;padding: 10px;} .termBox table.memberinfo2_area .first{width:40%;} /* /// mediaQuery - mobile /// */ @media screen and (min-width: 280px) and (max-width:1199px) { /* /// PAYMENT /// */ /* 공통 */ .solutionConBox .topVisualBox {height:200px;background-size:cover;} .solutionConBox .topVisualBox .center p, .solutionConBox .topVisualBox .center dl {display:none} .solutionConBox .txtBox {top:-40px;width:94%;width : -webkit-calc(100% - 30px); width : -moz-calc(100% - 30px); width : calc(100% - 30px); margin:0;padding:26.5px 0 0 30px} .solutionConBox .txtBox h2 {font-size:14px;line-height:20px;margin-bottom:21px} .solutionConBox .txtBox h2 span,.solutionConBox .txtBox h2 b {font-size:20px;line-height:28px} .solutionConBox .txtBox a.btn {margin-bottom:27px} .solutionConBox .txtBox p {font-size:14px;line-height:20px;margin-bottom:42px;} .solutionConBox .imgList li {width:31.10%;margin-left:3.34%;height:auto} .solutionConBox .imgList li img {width:100%;position:relative;top:0;left:0; transform:translate3d(0,0,0); -webkit-transform:translate3d(0,0,0); -ms-transform:translate3d(0,0,0); transition:transform .2s linear; -webkit-transition:transform .2s linear; -ms-transition:transform .2s linear; } .solutionConBox .imgList li:hover img { transform:translate3d(0,0,0) scale(1); -webkit-transform:translate3d(0,0,0) scale(1); -ms-transform:translate3d(0,0,0) scale(1); transition:transform .2s linear; -webkit-transition:transform .2s linear; -ms-transition:transform .2s linear; } /* section1 */ .solutionConBox .visualBox {background:url(../../images/solutions/payment_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .solutionConBox .seBox1 {text-align:left;padding:54.5px 0 60px} .solutionConBox .seBox1 h2 {font-family:'Montserrat-Bold';font-size:20px;line-height:22px;margin-bottom:5px;text-align:left} .solutionConBox .seBox1 p {font-weight:normal;margin-bottom:40px;font-size:14px;line-height:20px} .solutionConBox .seBox1 a.btn {margin:0 0 30px 0;text-align:left} .solutionConBox .swiper-container {width:100%;margin:0 auto;box-sizing:border-box;padding:0 20px} .solutionConBox .section div.swiper-slide {margin:0;box-sizing:border-box;padding:0 7px;} .solutionConBox .seBox1 div.swiper-slide dl {opacity:1;width:100%;padding-top:119.5px;height:270px} .solutionConBox .seBox1 div.swiper-slide dl dt {font-size:16px;line-height:17px} .solutionConBox .seBox1 div.swiper-slide dl dd {} .solutionConBox .seBox1 div.swiper-slide dl.box1 {background:url(../../images/solutions/payment_sec1_img1.svg) center 44px no-repeat;background-size:35px;} .solutionConBox .seBox1 div.swiper-slide dl.box2 {background:url(../../images/solutions/payment_sec1_img2.svg) center 44px no-repeat;background-size:38.6px} .solutionConBox .seBox1 div.swiper-slide dl.box3 {background:url(../../images/solutions/payment_sec1_img3.svg) center 44px no-repeat;background-size:38px} /* section2 */ .solutionConBox .seBox2 {text-align:left} .solutionConBox .seBox2 .visual {display:block;margin:0 auto 23.5px;height:200px;width:auto;max-width:100%;background:url(../../images/solutions/payment_sec2_img1.png) top center no-repeat;background-size:cover} .solutionConBox .seBox2 h2 {font-size:20px;line-height:17.5px;margin-bottom:10px} .solutionConBox .seBox2 p {font-size:14px;line-height:20px;margin-bottom:25.5px} .solutionConBox .seBox2 img {width:100%;margin:0 auto 24.9px;} .solutionConBox ul.logoList {width:100%;max-width:1200px;margin:0 auto 60px;text-align:left;font-size:0} /*210319 width 수정*/ .solutionConBox ul.logoList li {width:32.2%;margin:0 1% 1% 0;height:auto} /*210319 width 수정 end*/ .solutionConBox ul.logoList li:nth-child(3n) {margin:0 0 1% 0} .solutionConBox ul.logoList li:nth-child(4n) {margin:0 1% 1% 0} /*210319 logoListShort 추가*/ .solutionConBox ul.logoListShort {width:100%;margin:0 auto;text-align:left;font-size:0;} .solutionConBox ul.logoListShort li {width:32.2%;margin:0 1% 1% 0;height:auto;} .solutionConBox ul.logoListShort li:nth-child(3n) {margin:0 0 1% 0;} .solutionConBox ul.logoListShort li:nth-child(4n) {margin:0 1% 1% 0;} /*210319 logoListShort 추가 end*/ /* section3 */ .solutionConBox .seBox3 .topVisualBox {background-size:cover} /* section4 */ .solutionConBox .seBox4 .gifBox {right:30px;bottom:0;top:33px} .solutionConBox .seBox4 .gifBox img {width:219px;} /* section5 */ .solutionConBox .seBox5 .topVisualBox {background-size:cover} /* section6 */ .solutionConBox .seBox6 .topVisualBox {background-size:cover} .solutionConBox .seBox6 .imgList {margin-bottom:30px} .solutionConBox .seBox7 {padding:44.5px 30px 0 30px} .solutionConBox .seBox7 h2 {text-align:left;text-align:left;font-size:20px;line-height:24.5px;margin-bottom:25px} .solutionConBox .seBox7 div ul li {width:100%;padding:0;font-size:14px;line-height:20px;margin-bottom:60px} .solutionConBox .seBox7 div ul li div img {position:relative;top:0;left:0;max-width:100% transform:translate3d(0,0,0); -webkit-transform:translate3d(0,0,0); -ms-transform:translate3d(0,0,0); } .solutionConBox .seBox7 div ul li:hover div img { transform:translate3d(0,0,0) scale(1); -webkit-transform:translate3d(0,0,0) scale(1); -ms-transform:translate3d(0,0,0) scale(1); } .solutionConBox .seBox7 div ul li p {margin:26px 0 8px;font-size:16px;line-height:19.5px} /*21-11-30 추가*/ /* section8 */ .solutionConBox .seBox8 .topVisualBox {background-size:cover;} .solutionConBox .seBox8 .imgList {margin-bottom:30px;} /* section9 */ .solutionConBox .seBox9 .topVisualBox {background-size:cover;} .solutionConBox .seBox9 .imgList {margin-bottom:30px;} /*21-11-30 추가 end*/ /*2302 추가*/ .solutionConBox .seBox10 .topVisualBox {background-size:cover;} .solutionConBox .seBox10 .imgList {margin-bottom:30px;} .solutionConBox .seBox10 .imgList li{width:18.5%; height: auto; margin-left:1.5%;} /*2302 추가 end*/ /* /// API /// */ #API_box .seBox5 .topVisualBox, #API_box .seBox6 .topVisualBox, #API_box .seBox8 .topVisualBox {background-size:cover} #API_box .txtBox h2 {font-size:20px;line-height:24.5px;} #API_box .seBox1 .logoList {margin-top:60px;box-sizing:border-box;padding:0 30px} #API_box .seBox1 div.swiper-slide dl.box1 {background-size:44px;background-position:center 44px} #API_box .seBox1 div.swiper-slide dl.box2 {background-size:44px;background-position:center 44px} #API_box .seBox1 div.swiper-slide dl.box3 {background-size:44px;background-position:center 44px} #API_box .seBox8 .imgList li {height:auto;overflow:inherit;float:left;} #API_box .seBox8 .imgList li div {width:auto;height:auto;margin-bottom:15px} #API_box .seBox8 .imgList li dl {font-size:14px;color:#666;line-height:20px;text-align:center} #API_box .seBox8 .imgList li dl dt {font-weight:bold;} /*21-11-30 추가*/ #API_box .seBox9 .topVisualBox {background-size:cover} /*21-11-30 추가 end*/ /*2302 추가*/ #API_box .seBox11 .topVisualBox {background-size:cover} /*2302 추가 end*/ /* /// recruit /// */ .recruitConBox .visualBox {background:url(../../images/recruit/recruit_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .recruitConBox .seBox1 {padding:54.5px 30px;box-sizing:border-box} .recruitConBox .seBox1 h2 {font-size:20px;line-height:22px;margin-bottom:22.5px} .recruitConBox .seBox1 h2 + p {font-size:14px;line-height:20px;margin-bottom:39.5px} .recruitConBox .seBox1 ol li {margin-right:3%;width:48.5%;height:188px} .recruitConBox .seBox1 ol li:nth-child(3n) {margin-right:3%} .recruitConBox .seBox1 ol li:nth-child(even) {margin-right:0} .recruitConBox .seBox1 ol li b {font-size:22px;line-height:17.5px;} .recruitConBox .seBox1 ol li p {font-size:15px;line-height:20px;letter-spacing:-.75px} .recruitConBox .seBox1 ol li span {font-size:12px;line-height:15px;bottom:26.5px} .recruitConBox .seBox2 {padding:55.5px 0 60px} .recruitConBox .seBox2 h2, .recruitConBox .seBox3 h2 {font-size:20px;line-height:22px;margin-bottom:22.5px;padding:0 0 0 30px} .recruitConBox .swiper-container {box-sizing:border-box;padding:0 20px} .recruitConBox .seBox2 div dl {font-size:14px;line-height:20px;letter-spacing:-.7px} .recruitConBox .seBox2 div dl dt {font-size:16px;line-height:23.5px;letter-spacing:-.8px;font-weight:bold;} .recruitConBox .seBox2 .m_view div.swiper-slide {padding:0 7px;box-sizing:border-box;} .recruitConBox .seBox2 .m_view div dl.list1, .recruitConBox .seBox2 .m_view div dl.list2, .recruitConBox .seBox2 .m_view div dl.list3, .recruitConBox .seBox2 .m_view div dl.list4, .recruitConBox .seBox2 .m_view div dl.list5, .recruitConBox .seBox2 .m_view div dl.list6, .recruitConBox .seBox2 .m_view div dl.list7, .recruitConBox .seBox2 .m_view div dl.list8, .recruitConBox .seBox2 .m_view div dl.list9 { background-color:#fff; background-position: center 56.5px; padding:125px 10% 0 10%; } .recruitConBox .seBox2 .m_view div dl.list1 {background-size:60px} .recruitConBox .seBox2 .m_view div dl.list2 {background-size:57px} .recruitConBox .seBox2 .m_view div dl.list3 {background-size:27px} .recruitConBox .seBox2 .m_view div dl.list4 {background-size:60px} .recruitConBox .seBox2 .m_view div dl.list5 {background-size:31px} .recruitConBox .seBox2 .m_view div dl.list6 {background-size:60px} .recruitConBox .seBox2 .m_view div dl.list7 {background-size:60px} .recruitConBox .seBox2 .m_view div dl.list8 {background-size:57px} .recruitConBox .seBox2 .m_view div dl {box-sizing:border-box;border:1px solid #e1e1e1;width:100%;height:340px;color:#000;text-align:center} .recruitConBox .seBox3 {padding:54.5px 0;} .recruitConBox .seBox3 p {font-size:14px;line-height:20px;letter-spacing:-.7px;box-sizing:border-box;padding:0 30px;margin-bottom:20px} .recruitConBox .seBox3 div {box-sizing:border-box;padding:0 30px} .recruitConBox .seBox3 div dl {margin:0 auto 15px;text-align:center;display:block;max-width:100%;height:220px;padding-top:103px;font-size:14px;line-height:40px} .recruitConBox .seBox3 div dl.list1 {background-size:34.5px;background-position:center 38.9px} .recruitConBox .seBox3 div dl.list2 {background-size:30px;background-position:center 28.5px} .recruitConBox .seBox3 div dl.list3 {background-size:34.5px;background-position:center 41.5px} .recruitConBox .seBox3 div dl.list4 {background-size:26.5px;background-position:center 40.7px} .recruitConBox .seBox3 div dl.list5 {background-size:30px;background-position:center 40.7px} .recruitConBox .seBox3 div dl.list6 {background-size:34.5px;background-position:center 53.7px} .recruitConBox .seBox3 div dl.list7 {background-size:29px;background-position:center 39.5px} .recruitConBox .seBox3 div dl.list8 {background-size:41px;background-position:center 39.5px} .recruitConBox .seBox3 div dl.list9 {background-size:26.5px;background-position:center 38.9px} .recruitConBox .seBox3 div dl dt {font-size:16px;line-height:23.5px;margin-bottom:9.8px} .recruitConBox .seBox4 .topVisualBox {height: 440px; background-position-y: 100%;background-position-x: 48%;} .recruitConBox .seBox4 .txtBox { top:-40.5px;width:94%; width : -webkit-calc(100% - 30px); width : -moz-calc(100% - 30px); width : calc(100% - 30px); margin:0;padding:26.5px 0 0 30px } .recruitConBox .seBox4 .txtBox dl {margin-bottom:20.5px} .recruitConBox .seBox4 .txtBox dl dt {font-size:14px;line-height:25px;} .recruitConBox .seBox4 .txtBox dl dd {font-size:20px;line-height:25px} .recruitConBox .seBox4 .txtBox dl {padding-left:0} .recruitConBox .seBox4 .txtBox .stepList {margin-bottom:40px} .recruitConBox .seBox4 .txtBox .stepList td {padding:15px 1.7%} .recruitConBox .seBox4 .txtBox .stepList td b div span {font-size:11px;position:relative;top:1px} .recruitConBox .seBox4 .txtBox .stepList td b div span .sub_txt{font-size:8px;} .recruitConBox .seBox4 .txtBox .chk_Info {padding:0} .recruitConBox .seBox4 .txtBox .chk_Info p {font-size:15px;line-height:18px;padding-bottom:18px;margin-bottom:16px} .recruitConBox .seBox4 .txtBox .chk_Info span:after {height:15px;top:0px} .recruitConBox .seBox4 .txtBox .chk_Info ul li {font-size:14px;line-height:20px;padding-left:25px;} .recruitConBox .seBox4 .txtBox .chk_Info ul li:before {top:8px} .recruitConBox .blankBox {height:434px} /* 210326 recruit 지도부분 제외 처리 .recruitConBox .seBox5 h2 {box-sizing:border-box;padding:0 30px;font-size:20px;line-height:22px;margin-bottom:23px} .recruitConBox .seBox5 p {box-sizing:border-box;padding:0 30px;font-size:14px;line-height:20px;letter-spacing:-.7px;margin-bottom:23px} .recruitConBox .seBox5 .locationMap , .recruitConBox .seBox5 .locationMap iframe {height:250px} */ /* /// counselingBox /// */ .counselingBox {padding:52.5px 30px;} .counselingBox h2 {text-align:left;font-size:20px;line-height:25px;} .counselingBox p {text-align:left;font-size:14px;line-height:20px} .counselingBox p a {display:block;width:auto;font-size:14px;line-height:20px;} .counselingBox p a:first-child:before {display:none;} /* /// BOARD - 전자공시 /// */ .noticeConBox .visualBox .textBox dl dd {line-height:25px} .noticeConBox .visualBox .textBox dl dd b {font-size:25px;letter-spacing:-0.5px} .noticeConBox .visualBox {background:url(../../images/about/about_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .noticeConBox .seBox1 {padding:52px 30px;} .noticeConBox h2 {font-size:20px;line-height:22px;margin-bottom:7.5px;text-align:left} .noticeConBox p {font-size:14px;line-height:20px;margin-bottom:38px;text-align:left} .noticeList .line.top .title, .noticeList .line.top .date {padding:26.5px 0 21px 0;font-size:12px;line-height:15px} .noticeList .line {font-size:12px;line-height:32px} .noticeList .title, .noticeList .date {padding:9px 0 7px} .noticeConBox .noticePaging a {width:25px;height:25px;line-height:25px;font-size:12px} .noticeConBox .noticePaging a.prev {background-size:25px;margin-right:10px} .noticeConBox .noticePaging a.next {background-size:25px;margin-left:10px} .noticeConBox .noticeview .title {padding:12.5px 0 12px;font-size:12px;line-height:17px;} .noticeConBox .noticeview .file {padding:16px 0;font-size:12px;line-height:17px;} .noticeConBox .noticeview .textBox {padding:31.75px 0;font-size:12px;line-height:17px;margin-bottom:26px;} .noticeConBox .prevNextList {padding:0;} .noticeConBox .prevNextList ul {padding:0;margin-bottom:27.5px;} .noticeConBox .prevNextList ul li {font-size:12px;line-height:17px;} .noticeConBox .prevNextList ul li span {line-height:17px} .noticeConBox .prevNextList a.go_list {width:100%;position:relative;top:0;left:0;height:50px;padding-top:15px;font-size:12px;line-height:17px} /* ABOUT */ .aboutConBox .visualBox {background:url(../../images/about/about_visual.png) top center no-repeat;background-size:cover;background-position-x: 87%;width:100%;height:100vh} .aboutConBox .seBox1 {text-align:left;padding:54.5px 30px} .aboutConBox .seBox1 h2 {font-size:20px;line-height:22px;margin-bottom:22.5px} .aboutConBox .seBox1 p {font-size:16px;line-height:20px} .aboutConBox .seBox1 span {font-size:14px;line-height:20px;letter-spacing:-.7px} .aboutConBox .seBox2 .videoVisual {height:250px;} .aboutConBox .seBox2 .videoVisual #videobcg {display:none;position:relative;} .aboutConBox .seBox2 h2 {padding:0 30px;font-size:22px;line-height:25px;top:-36px;} .aboutConBox .seBox2 ul {padding:15px 30px 0} .aboutConBox .seBox2 ul li {display:block;width:100%;font-size:14px;line-height:20px;letter-spacing:-.7px;min-height:auto;padding-bottom:49.5px} .aboutConBox .seBox2 ul li p {font-size:16px;line-height:23.5px;margin-bottom:10px;letter-spacing:-.8px} .aboutConBox .seBox3 {padding:54px 0 60px;} .aboutConBox .seBox3 h2 {font-size:22px;line-height:25px;margin-bottom:24.5px;text-align:left;margin-left:30px;} .aboutConBox .seBox3 .swiper-container {width: 100%;margin: 0 auto;box-sizing: border-box;padding: 0 20px;} .aboutConBox .seBox3 ul.swiper-slide {margin:0;box-sizing:border-box;padding:0 7px;} .aboutConBox .seBox3 ul li {max-width:100%;margin-left:0;padding:0 7px;height:250px} .aboutConBox .seBox3 ul li div {padding:32px 0 15px} .aboutConBox .seBox3 ul li b {font-size:25px;line-height:27px;margin-bottom:36px} .aboutConBox .seBox3 ul li dl {margin-bottom:9px} .aboutConBox .seBox3 ul li dl dt {font-size:16px;line-height:18px;} .aboutConBox .seBox3 ul li dl dt span {font-size:10px;} .aboutConBox .seBox3 ul li dl dd {font-size:14px;line-height:20px} .aboutConBox .seBox4 {padding:54px 0 0 0} .aboutConBox .seBox4 h2 {font-size:22px;line-height:25px;margin-bottom:25px;text-align:left;box-sizing:border-box;padding-left:30px} .aboutConBox .seBox4 .historyBox > ul {border-top:2px solid #000;border-bottom:1px solid #e1e1e1} .aboutConBox .seBox4 .historyBox > ul li:first-child {border-top:0} .aboutConBox .seBox4 .historyBox > ul li span {position:relative;} .aboutConBox .seBox4 .historyBox > ul li span:before {position:absolute;top:27px;right:30px; content:"";display:block;width:15px;height:15px;background:url(../../images/about/accordion_arrow.jpg) center center no-repeat;background-size:15px; transform:rotate(180deg); -webkit-transform:rotate(180deg); -ms-transform:rotate(180deg); transition:transform .2s linear; -webkit-transition:transform .2s linear; -ms-transition:transform .2s linear; } .aboutConBox .seBox4 .historyBox > ul li.is-active span:before { transform:rotate(0deg); -webkit-transform:rotate(0deg); -ms-transform:rotate(0deg); } .aboutConBox .seBox4 .historyBox > ul li span.title {display:block;box-sizing:border-box;padding:21px 0 22px 30px;font-size:20px;line-height:23px;border-top:1px solid #e1e1e1;} .aboutConBox .seBox4 .historyBox > ul li:first-child span.title {border-top:0} .aboutConBox .seBox4 .historyBox > ul li .con {box-sizing:border-box;width:auto;max-width:100%;width:100%;padding:30px 30px 0 30px;border-top:1px solid #e1e1e1} .aboutConBox .seBox4 .historyBox .con {display:none} .aboutConBox .seBox4 .historyBox .con div {min-width:auto;max-width:100%;float:none;height:auto;padding-bottom:15.5px;margin-bottom:30px;} .aboutConBox .seBox4 .historyBox .con div figure {margin-bottom:26px;font-size:0} .aboutConBox .seBox4 .historyBox .con div figure img {display:block;margin:0 auto;} .aboutConBox .seBox4 .historyBox .con div p {font-size:20px;line-height:25px;padding:0;border:0;margin-bottom:14px} .aboutConBox .seBox4 .historyBox .con div ul li{font-size:14px;line-height:20px} .aboutConBox .seBox5 {padding:54px 30px 57.5px;} .aboutConBox .seBox5 h2 {font-size:22px;line-height:25px;text-align:left;margin-bottom:24.5px} .aboutConBox .seBox5 ul li {width:50%;box-sizing:border-box;margin-bottom: 30px;} .aboutConBox .seBox5 ul li:nth-child(odd) {padding:0 2.9% 0 0} .aboutConBox .seBox5 ul li:nth-child(even) {padding:0 0 0 2.9%} .aboutConBox .seBox5 ul li div {margin-bottom:12px;margin:0 auto 12px;} .aboutConBox .seBox5 ul li p {font-size:12px;line-height:17.5px} .aboutConBox .seBox5 ul li span {font-size:10px;line-height:12px;overflow: hidden; text-overflow: ellipsis; display:-webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } .aboutConBox .seBox5 ul li div {width:100%;height:auto} .aboutConBox .seBox5 ul li div img {top:0;left:0;position:relative;width:100%; transform:translate3d(0,0,0); -webkit-transform:translate3d(0,0,0); -ms-transform:translate3d(0,0,0); } .aboutConBox .seBox5 ul li a:hover div img { transform:translate3d(0,0,0) scale(1.0); -webkit-transform:translate3d(0,0,0) scale(1.0); -ms-transform:translate3d(0,0,0) scale(1.0); } /*210326 about 지도 부분 추가*/ .aboutConBox .seBox6{margin-top:60px;} .aboutConBox .seBox6 h2 {box-sizing:border-box;padding:0 30px;font-size:20px;line-height:22px;margin-bottom:10px;text-align: left;} .aboutConBox .seBox6 p {box-sizing:border-box;padding:0 30px;font-size:14px;line-height:20px;letter-spacing:-.7px;margin-bottom:23px;text-align: left;} .aboutConBox .seBox6 .locationMap , .recruitConBox .seBox6 .locationMap iframe {height:250px; overflow: hidden;} /*210326 지도 부분 추가 end*/ /* /// WORK /// */ #workBox {width:100%;height:100vh} #workBox .slick-track {left:50%;margin-left:-960px;} #workBox .slick-initialized .slick-slide {width:auto;height:100vh;display:block;margin:0 auto;left:50%;} .CS01_visual {background:url(../../images/work/CS01_visual.png) no-repeat;background-size: cover;background-position-x:63%;width: 100%;height: 100vh;} .CS02_visual {background:url(../../images/work/CS02_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS03_visual {background:url(../../images/work/CS03_visual.png) no-repeat;background-size: cover;background-position-x: 68%;width: 100%;height: 100vh;} .CS04_visual {background:url(../../images/work/CS04_visual.png) no-repeat;background-size: cover;background-position-x: 94%;width: 100%;height: 100vh;} .CS05_visual {background:url(../../images/work/CS05_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS06_visual {background:url(../../images/work/CS06_visual.png) no-repeat;background-size: cover;background-position-x: 55%;width: 100%;height: 100vh;} .CS07_visual {background:url(../../images/work/CS07_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS08_visual {background:url(../../images/work/CS08_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS09_visual {background:url(../../images/work/CS09_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS10_visual {background:url(../../images/work/CS10_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS11_visual {background:url(../../images/work/CS11_visual.png) no-repeat;background-size: cover;background-position-x: 62%;width: 100%;height: 100vh;} .CS12_visual {background:url(../../images/work/CS12_visual.png) no-repeat;background-size: cover;background-position-x: 55%;width: 100%;height: 100vh;} .CS13_visual {background:url(../../images/work/CS13_visual.png) no-repeat;background-size: cover;background-position-x: 55%;width: 100%;height: 100vh;} .CS14_visual {background:url(../../images/work/CS14_visual.png) no-repeat;background-size: cover;background-position-x: 65%;width: 100%;height: 100vh;} .CS15_visual {background:url(../../images/work/CS15_visual.png) no-repeat;background-size: cover;background-position-x: 70%;width: 100%;height: 100vh;} .CS16_visual {background:url(../../images/work/CS16_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS17_visual {background:url(../../images/work/CS17_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS18_visual {background:url(../../images/work/CS18_visual.png) no-repeat;background-size: cover;background-position-x: 70%;width: 100%;height: 100vh;} .CS19_visual {background:url(../../images/work/CS19_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS20_visual {background:url(../../images/work/CS20_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS21_visual {background:url(../../images/work/CS21_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS22_visual {background:url(../../images/work/CS22_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS23_visual {background:url(../../images/work/CS23_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS24_visual {background:url(../../images/work/CS24_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS25_visual {background:url(../../images/work/CS25_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS26_visual {background:url(../../images/work/CS26_visual.png) top center no-repeat;background-size:cover;background-position-x: 55%;width:100%;height:100vh} .CS27_visual {background:url(../../images/work/CS27_visual.png) top center no-repeat;background-size:cover;background-position-x: 75%;width:100%;height:100vh} .CS28_visual {background:url(../../images/work/CS28_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS29_visual {background:url(../../images/work/CS29_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS30_visual {background:url(../../images/work/CS30_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS31_visual {background:url(../../images/work/CS31_visual.png) top center no-repeat;background-size:cover;width:100%;height:100vh} .CS32_visual {background:url(../../images/work/CS32_visual.png) top center no-repeat;background-size:cover;background-position-x: 65%;width:100%;height:100vh} .CS33_visual {background: url(../../images/work/CS33_visual.png) top center no-repeat; background-size: cover; width: 100%; height: 100vh} .CS34_visual {background: url(../../images/work/CS34_visual.png) top center no-repeat; background-size: cover; background-position-x: 62%; width: 100%; height: 100vh} .CS35_visual {background: url(../../images/work/CS35_visual.png) top center no-repeat; background-size: cover; background-position-x: 20%; width: 100%; height: 100vh} .CS36_visual {background: url(../../images/work/CS36_visual.png) top center no-repeat; background-size: cover; width: 100%; height: 100vh} .CS37_visual {background: url(../../images/work/CS37_visual.png) top center no-repeat; background-size: cover; background-position-x: 5%; width: 100%; height: 100vh} .CS38_visual {background: url(../../images/work/CS38_visual.png) top center no-repeat;background-size: cover;background-position-x: 67%;width: 100%; height: 100vh} .CS39_visual {background: url(../../images/work/CS39_visual.png) top center no-repeat;background-size: cover;background-position-x: 65%;width: 100%; height: 100vh} .CS40_visual {background: url(../../images/work/CS40_visual.png) top center no-repeat;background-size: cover;background-position-x: 5%;width: 100%; height: 100vh} .CS41_visual {background: url(../../images/work/CS41_visual.png) top center no-repeat;background-size: cover;width: 100%;height: 100vh} .CS42_visual {background: url(../../images/work/CS42_visual.png) top center no-repeat;background-size: cover;width: 100%;height: 100vh} .CS43_visual {background: url(../../images/work/CS43_visual.png) top center no-repeat;background-size: cover;background-position-x: 66%;background-position-y: 97%;width: 100%;height: 100vh} .CS44_visual {background: url(../../images/work/CS44_visual.png) top center no-repeat;background-size: cover;background-position-x:58%;width: 100%;height: 100vh} .CS45_visual {background: url(../../images/work/CS45_visual.gif) top center no-repeat;background-size: cover;background-position-x:67%;width: 100%;height: 100vh} .CS46_visual {background: url(../../images/work/CS46_visual.gif) top center no-repeat;background-size: cover;background-position-x:72%;width: 100%;height: 100vh} .CS47_visual {background: url(../../images/work/CS47_visual.png) top center no-repeat;background-size: cover;background-position-x:62%;width: 100%;height: 100vh} .CS48_visual {background: url(../../images/work/CS48_visual.png) top center no-repeat;background-size: cover;background-position-x:75%;width: 100%;height: 100vh} .CS49_visual {background: url(../../images/work/CS49_visual.png) top center no-repeat;background-size: cover;background-position-x:62%;width: 100%;height: 100vh} .CS50_visual {background: url(../../images/work/CS50_visual.png) top center no-repeat;background-size: cover;background-position-x:72%;width: 100%;height: 100vh} .CS51_visual {background: url(../../images/work/CS51_visual.png) top center no-repeat;background-size: cover;background-position-x:55%;width: 100%;height: 100vh} .CS52_visual {background: url(../../images/work/CS52_visual.png) top center no-repeat;background-size: cover;background-position-x:55%;width: 100%;height: 100vh} .CS53_visual {background: url(../../images/work/CS53_visual.png) top center no-repeat;background-size: cover;background-position-x:55%;width: 100%;height: 100vh} .CS54_visual {background: url(../../images/work/CS54_visual.png) top center no-repeat;background-size: cover;background-position-x:55%;width: 100%;height: 100vh} #CS_common .textBox, #CS02_text .textBox, #CS03_text .textBox {height: 100%;padding-top:0;} #CS_common .textBox dl dt, #CS02_text .textBox dl dt, #CS03_text .textBox dl dt {font-size:14px;line-height:15px} #CS_common .textBox dl dd, #CS02_text .textBox dl dd, #CS03_text .textBox dl dd {font-size:27px;line-height:36px;} #CS_common .textBox dl dd p, #CS02_text .textBox dl dd p, #CS03_text .textBox dl dd p {font-size:27px;line-height:36px} .visualBox .textBox span {font-size:14px;line-height:15px;font-weight:normal;background-size:10px;background-position:center 24.5px;bottom:35px;padding-bottom:0;height:35px;} .workConBox .pc_none{display: block;} .workConBox .mo_none{display: none;} .workConBox .seBox1 {padding:55px 30px;box-sizing:border-box;} .workConBox .seBox1 .projectBox {margin-bottom:55px} .workConBox .seBox1 thead th{font-size:14px;line-height:23.5px;padding-bottom:10px;} .workConBox .seBox1 tbody th{width:70px; font-size:14px;line-height:23.5px;} .workConBox .seBox1 tbody td{font-size:14px;line-height:23.5px;} .workConBox .seBox1 .projectBox ul.logo {float:none;margin-top:25px} .workConBox .seBox1 .projectBox ul.logo li {width:90px;} .workConBox .seBox1 dl dt {font-size:27px;line-height:36px;margin-bottom:20px;} .workConBox .seBox1 dl dd {font-size:14px;line-height:23.5px;} .workConBox .seBox1 dl dd img{margin-top: 40px;} .workConBox .seBox1 .imgBox span.web_view {display:none} .workConBox .seBox1 .imgBox span.m_view {display:block;font-size:22px;line-height:24.5px;margin-bottom:35px} .workConBox .seBox2 {box-sizing:border-box;padding:35px 30px 55px;} .workConBox .seBox2 .title {font-size:45px;line-height:50px;margin-bottom:35px;background:url(../../images/work/CS01_seBox2_img.png) right center no-repeat;background-size:70px;padding:20px 0} .workConBox .seBox2 .title span {display:block} .workConBox .seBox2 .conBox img {display:none;} .workConBox .seBox2 .conBox dl dt {font-size:16px;line-height:30px;margin-bottom:15px} .workConBox .seBox2 .conBox dl dd {font-size:14px;line-height:20px} .workConBox .seBox2 .conBox dl dd ul {margin-top:5px} .workConBox .seBox2 .conBox dl dd ul li {font-size:14px;line-height:20px} .workConBox .seBox3 {box-sizing:border-box;padding:55px 30px} .workConBox .seBox3 dl {margin-bottom:35px} .workConBox .seBox3 dl dt {font-size:22px;line-height:27.5px;margin-bottom:15px} .workConBox .seBox3 dl dd {font-size:14px;line-height:20px} .workConBox .seBox4 {box-sizing:border-box;padding:55px 30px;} .workConBox .seBox4:before {height:240px;} .workConBox .seBox4 dl dt {font-size:22px;line-height:27.5px;margin-bottom:15px} .workConBox .seBox4 dl dd {font-size:14px;line-height:20px} .workConBox .seBox4 dl dd img{margin:30px auto 0;} .workConBox .seBox4 dl.last{margin-top:40px;} .workConBox .seBox5 {box-sizing:border-box;padding:55px 30px;} .workConBox .seBox5:before {height:400px;} .workConBox .seBox5 dl {font-size:27px;line-height:36px;margin-bottom:35px;} .workConBox .seBox5 dl dt {margin-bottom:20px;} .workConBox .seBox5 dl dd {font-size:14px;line-height:20px;} .workConBox .seBox5 dl dd img{width: 100%; margin-top:40px;} .workConBox .seBox5 dl.last {margin-top:55px;} .workConBox .seBox5 img{width: 100%; margin-top:40px;} .workConBox .seBox5 .last {margin-top:40px;} .workConBox .seBox5 .VisualBanner{width:100%;height:100%;margin-top: 100px;} .workConBox .seBox5 .VisualBanner:before{height:120px;} .workConBox .seBox5 .VisualBanner p{padding:42px 0;font-size: 27px;font-weight: 600;line-height: 36px;} .workConBox .seBox6 {box-sizing:border-box;padding:55px 30px;} .workConBox .seBox6:before {height:300px;} .workConBox .seBox6 dl {font-size:27px;line-height:36px;margin-bottom:35px} .workConBox .seBox6 dl dd {font-size:14px;line-height:20px;} .workConBox .seBox6 dl dd img{width: 100%; margin-top:40px;} .workConBox .seBox6 dl.last {margin-top:55px;} .workConBox .seBox6 img{width: 100%; margin-top:40px;} .workConBox .seBox7 {box-sizing:border-box;padding:55px 30px;} .workConBox .seBox7 p{font-size:27px;line-height:36px;} .workConBox .seBox7 dl {font-size:20px;line-height:30px;} .workConBox .seBox7 dl dd img{width: 100%; margin-top:20px;} .workConBox .seBox8 {box-sizing:border-box;padding:30px;} .workConBox .seBox8 dl {font-size:27px;line-height:36px;padding-bottom:100px;} .workConBox .seBox8 dl dt {margin-bottom:30px;} .workConBox .seBox8 dl dd img {margin-top:20px;} .workConBox .seBox8 .VisualBanner{height:120px;} .workConBox .seBox8 .VisualBanner:before{height:120px;} /*21-11-30 추가*/ .workConBox .seBox9 {box-sizing:border-box;padding:20px 30px;} .workConBox .seBox9:before {height:1000px;} .workConBox .seBox9 dl dt {font-size:27px;line-height:36px;margin-bottom:15px} .workConBox .seBox9 dl dd {font-size:14px;line-height:20px} .workConBox .seBox9 dl dd img{width: 100%;margin:30px auto 0;} .workConBox .seBox9 dl.last{margin-top:40px;} .workConBox .BG_Lightblue:before{height:440px;} /*21-11-30 추가 end*/ .workConBox .BG_short:before{height:220px;} .workConBox .PD_top{margin-top:40px;} .workConBox .PD_top_big{margin-top:60px;} .workConBox .orderBox, .workConBox .deliveryBox {box-sizing:border-box;padding:0 30px} .workConBox .orderBox p, .workConBox .deliveryBox p {font-size:22px;line-height:27.5px;margin-bottom:25px} .workConBox .orderBox .sliderBox {margin:30px auto;} .workConBox .orderBox .sliderBox .slick-next, .workConBox .orderBox .sliderBox .slick-prev {display:none;font-size:0;width:0;height:0} .workConBox .orderBox .sliderBox .slick-dots {margin-top:15px;} .workConBox .orderBox .sliderBox .slick-dots li button {width:6px;height:6px} .workConBox .deliveryInfo01:before, .workConBox .deliveryInfo02:before, .workConBox .deliveryInfo03:before {height:220px} .workConBox .deliveryInfo01 p, .workConBox .deliveryInfo02 p, .workConBox .deliveryInfo03 p {padding-top:55px} .workConBox .deliveryInfo01 img, .workConBox .deliveryInfo02 img, .workConBox .deliveryInfo03 img {margin-bottom:55px} /*210326 전체보기 추가*/ .workConBox .seBoxBtn{padding:55px 30px;} .workConBox .seBoxBtn:before{height:160px;} .workConBox .btn_list{width:100%;position:relative;top:0;left:0;height:50px;padding-top:15px;font-size:12px;line-height:17px;} /*210326 추가 end*/ /* /// term /// */ .termBox{padding:54.5px 30px;} .termBox h1{font-size:26px;padding-bottom:10px; margin-bottom:20px;} .termBox h2{font-size:14px;padding:10px 0 5px 0;} .termBox p{font-size:13px;line-height:20px;} .termBox select{width:300px;padding: .8em .8em;font-size:13px;margin-bottom:20px;} .termBox table.memberinfo2_area{max-width: 100%;width: 100%; margin: 20px 0;padding-right:0;} .termBox table.memberinfo2_area th{width:25%;font-size:12px;} .termBox table.memberinfo2_area td{font-size:12px;} } /* /// mediaQuery - tablet /// */ @media screen and (min-width: 320px) and (max-width:1023px) { .aboutConBox .seBox2 .videoVisual video {display:none;} .aboutConBox .seBox2 .videoVisual {background:url(../../images/about/video_bg.jpg) top center no-repeat;background-size:cover} } @media screen and (min-width: 721px) and (max-width:1199px) { /* PAYMENT */ .solutionConBox .seBox7 div ul li:first-child {margin-left:0} .solutionConBox .seBox7 div ul li {width:32%;margin-left:2%} .solutionConBox .seBox7 div ul li div {width:100%;height:auto;} .solutionConBox .seBox7 div ul li div img {position:relative;top:0;left:0;max-width:100%;width:100%; transform:translate3d(0,0,0); -webkit-transform:translate3d(0,0,0); -ms-transform:translate3d(0,0,0); } .solutionConBox .seBox7 div ul li:hover div img { transform:translate3d(0,0,0) scale(1); -webkit-transform:translate3d(0,0,0) scale(1); -ms-transform:translate3d(0,0,0) scale(1); } /* RECRUIT */ .recruitConBox .seBox1 ol li {width:32%;margin-right:2%} .recruitConBox .seBox1 ol li:nth-child(even) {margin-right:2%} .recruitConBox .seBox1 ol li:nth-child(3n) {margin-right:0} .recruitConBox .seBox2 .web_view {display:block;box-sizing:border-box;padding:0 30px} .recruitConBox .seBox2 .m_view {display:none} .recruitConBox .seBox3 div {max-width:721px;text-align:left} .recruitConBox .seBox3 div dl {width:49%;margin-right:2%;display:inline-block;margin-bottom:2%} .recruitConBox .seBox3 div dl:nth-child(even) {margin-right:0} /* ABOUT */ .aboutConBox .seBox2 ul li {width:50%;display:inline-block} }