.mobile-mode { display:none; } .m480-mode { display:none; } /************************************************** 서브페이지 공통 *****************************************************************/ #sub-container {background: rgb(255, 255, 255); width:100%; position: relative; z-index: 4;} .locationWrap {width:100%;height:45px;margin:0 auto;padding:0;border-top:1px solid #dedede;border-bottom:1px solid #dedede;position:relative;z-index:101; background:#fff } .location {width:1100px;margin:0 auto;} .location > li > a {line-height:46px;} .location > li a {padding:0 10px;line-height:45px;font-size:14px;} .location > li span{line-height:46px;color:#acacac;} .location > li {float:left;height:100%;border-right:1px solid #dedede;} .location > li.home {width:50px;border-left:1px solid #dedede;} .location > li.home a {display:block; padding:0;text-indent:-9999px;background-image:url(../../img/home.png);background-repeat:no-repeat; background-position:center center;} .location > li.home a:hover {background-image:url(../../img/home_on.png);} .location .locDep {position:relative;} .location .locDep ul {display:none;position:absolute;width:100%;left:-1px;top:47px;border:1px solid #dedede;border-top:none;background-color: #fff;} .location .locDep ul li {border-bottom:1px solid #dedede; } .location .locDep ul li:last-child {border-bottom:none;} .location .locDep {min-width:250px} /*.location .locDep > a {background-image:url(../../img/loc_arrow.png);background-repeat:no-repeat;background-position:right center;background-origin:content-box;color:#acacac;} .location .locDep:hover > a {color:#333;background-image:url(../../img/loc_arrow_on.png);} .location > li.locDep:last-child > a {background-image:url(../../img/loc_arrow_on.png);color:#333;} */ .location .locDep a {color:#acacac;} .location .locDep a.home:hover {color:#333;} .location .locDep a.first:hover {color:#333;} .Dissolution{ overflow:hidden; position:relative; width:100%;margin:0 auto; padding:0px 0 0px 0;} .Dissolution .container { width:1100px; margin:0 auto; padding:0px 0 0px 0; } .Dissolution .title-warp { margin:0; padding:0px 0 80px 0;} .Dissolution .title-warp .title-box { margin: 0; padding:0; text-align:center} .Dissolution .title-warp .title-box .title { font-size: 34px; position: relative; margin:0; padding:0 0 0px 0; } .Dissolution .title-warp .title-box .line { position: relative; margin:0; padding:0 0 20px 0; color: #b8b8b8;} .Dissolution .title-warp .title-box .line:before { content: ''; position: absolute; height: 1px; background-color: #d7d7d7; width: 400px; bottom: -4px; left: 50%; transform: translate(-50%, -50%);} .Dissolution .title-warp .title-box .line-mf { width: 40px; height: 5px; margin: 0 auto; background:red } .Dissolution .title-warp .title-box .toptitle { font-weight: 400; font-size: 16px; text-transform: uppercase; color: #858585; margin:0; padding:0 0 0px 0; } .Dissolution .title-warp .title-box .subtitle { position: relative; margin:0; padding:20px 0 0px 0; } .Dissolution h1 { font-size: 36px; padding:0 0 8px 0; } .Dissolution h2 {font-size:24px; padding:0 0 8px 0; } .Dissolution h3 {font-size:22px; padding:0 0 8px 0; } .Dissolution h4 {font-size:20px; padding:0 0 8px 0; } .Dissolution h5 {font-size:18px; padding:0 0 8px 0; } .Dissolution h6 {font-size:17px; padding:0 0 8px 0; } .Dissolution .h7 {font-size:16px; padding:0 0 8px 0; } .Dissolution p.text { margin:0;padding-bottom:15px; } .Dissolution p.text2 { margin:0;padding-bottom:0px; } .Dissolution .m-top20 {margin-top:20px} .Dissolution .m-top80 {margin-top:80px} .Dissolution .img-right {float:right;margin-left:2em;margin-bottom:1em; margin-top:10px} .Dissolution .img-left {float:left;margin-right:2em;margin-bottom:1em; margin-top:10px} .Dissolution .img-center {margin:0; padding:20px 0; text-align:center;} .Dissolution img.width400 {width:400px} .Dissolution img.width700 {width:700px} .Dissolution i {padding:0 10px 0 0; } .Dissolution ul.list-type2 {list-style-type: none;width:100%;padding: 0; padding-bottom: 7px; } .Dissolution ul.list-type2>li {position: relative;width:100%; padding-bottom: 0px; } .Dissolution ul.list-type2>li>p {padding-left:10px;margin-bottom:0;line-height:23px;} .Dissolution .list-warp>ul.list-type2>li>p {padding-left:15px;margin-bottom:0;line-height:23px;} .Dissolution ul.list-type2>li:before{position: absolute;display: inline-block;vertical-align: middle;margin:0; padding: 10px; line-height:5px;} .Dissolution ul.list-type2>li::before{content: "•"; color:#818181;} .Dissolution .container { width:1100px; margin:0 auto; padding:0px 0 0px 0; } .Dissolution .title-warp { margin:0; padding:0px 0 80px 0;} .Dissolution .title-warp .title-box { margin: 0; padding:0; text-align:center} .Dissolution .title-warp .title-box .title { font-size: 34px; position: relative; margin:0; padding:0 0 0px 0; } .Dissolution .title-warp .title-box .line { position: relative; margin:0; padding:0 0 20px 0; color: #b8b8b8;} .Dissolution .title-warp .title-box .line:before { content: ''; position: absolute; height: 1px; background-color: #d7d7d7; width: 400px; bottom: -4px; left: 50%; transform: translate(-50%, -50%);} .Dissolution .title-warp .title-box .line-mf { width: 40px; height: 5px; margin: 0 auto; background:red } .Dissolution .title-warp .title-box .toptitle { font-weight: 400; font-size: 16px; text-transform: uppercase; color: #858585; margin:0; padding:0 0 0px 0; } .Dissolution .title-warp .title-box .subtitle { position: relative; margin:0; padding:20px 0 0px 0; } .Dissolution h1 { font-size: 36px; padding:0 0 8px 0; } .Dissolution h2 {font-size:24px; padding:0 0 8px 0; } .Dissolution h3 {font-size:22px; padding:0 0 8px 0; } .Dissolution h4 {font-size:20px; padding:0 0 8px 0; } .Dissolution h5 {font-size:18px; padding:0 0 8px 0; } .Dissolution h6 {font-size:17px; padding:0 0 8px 0; } .Dissolution .h7 {font-size:16px; padding:0 0 8px 0; } .Dissolution p.text { margin:0;padding-bottom:15px; } .Dissolution p.text2 { margin:0;padding-bottom:0px; } .Dissolution .m-top20 {margin-top:20px} .Dissolution .m-top80 {margin-top:80px} .Dissolution .img-right {float:right;margin-left:2em;margin-bottom:1em; margin-top:10px} .Dissolution .img-left {float:left;margin-right:2em;margin-bottom:1em; margin-top:10px} .Dissolution .img-center {margin:0; padding:20px 0; text-align:center;} .Dissolution img.width400 {width:400px} .Dissolution img.width700 {width:700px} .Dissolution i {padding:0 10px 0 0; } .Dissolution ul.list-type2 {list-style-type: none;width:100%;padding: 0; padding-bottom: 7px; } .Dissolution ul.list-type2>li {position: relative;width:100%; padding-bottom: 0px; } .Dissolution ul.list-type2>li>p {padding-left:10px;margin-bottom:0;line-height:23px;} .Dissolution .list-warp>ul.list-type2>li>p {padding-left:15px;margin-bottom:0;line-height:23px;} .Dissolution ul.list-type2>li:before{position: absolute;display: inline-block;vertical-align: middle;margin:0; padding: 10px; line-height:5px;} .Dissolution ul.list-type2>li::before{content: "•"; color:#818181;} /******* 서브페이지 타이틀 공통 **************/ #page-title {width:100%; margin:0 auto; text-align:center; overflow:hidden; padding:0px 0 40px 0px;} #page-title .line {width:2px; height:50px;margin:0 auto; text-align:center;background:red} #page-title .title {font-size:40px;font-weight:700;} .subTitle {width:100%; margin:0 auto; text-align:center; overflow:hidden; padding:40px 0 0px 0px;} .subTitle .title {font-size:40px;font-weight:500; padding:30px 0 10px 0px; line-height:55px;} .subTitle .text {font-size:25px;font-weight:300; padding:0px 0 20px 0px; } .subTitle .Tline {width:500px; height:2px; margin:0 auto; padding: 0 30px 0 0;text-align:center;background:#ededed} .subTitle .Bline {width:2px; height:40px;margin:0 auto; text-align:center;background:red} .Small-paragraph {width:100%;margin:0 auto; text-align:center;} .Small-paragraph .paragraph {width:1100px; margin:0 auto; padding:70px 0 50px 0;text-align:center;} .Small-paragraph .paragraph p.title {margin:0 auto; padding:0px 0 30px 0;font-size:28px; font-weight:400; line-height:40px;} .Small-paragraph .paragraph .text { width:80%; margin:0 auto; text-align:center; font-size:20px;font-weight:300; line-height:30px;} /******* 서브페이지 About Us **************/ #sub-greeting {position:relative; width:100%; overflow:hidden} #sub-greeting:before{position:absolute; top:0px; left:0px; content:""; width:100%; height:230px; background-color:#ececec;} #sub-greeting #Inner {margin:0 auto;padding:0; text-align:center; width:1100px; } #sub-greeting #Inner .left-con {position:relative; float:left; width:20%; height:310px; margin:0; padding:0px; text-align:center;} #sub-greeting #Inner .left-img { margin:0;padding:0px; } #sub-greeting #Inner .left-img img {width:100%; padding-top:30px;} #sub-greeting #Inner .left-img .sign img {width:100%; margin:0px 0 10px 0;} #sub-greeting #Inner .left-con .sign {margin:0 auto;padding:0px;} #sub-greeting #Inner .left-con .sign .ceo-name { color:#3a3a3a; font-size:20px; font-weight:300; letter-spacing:-0.5px; margin:0;} #sub-greeting #Inner .left-con .sign .ceo-en-name {color:#535252; font-size:15px; font-weight:300; margin-bottom:50px;} #sub-greeting #Inner .right-con {float:left; width:80%;} #sub-greeting #Inner .right-inner { margin display:block; position:relative; font-size:15px; padding:30px 0 30px 0px; margin:0 auto; text-align:center; } #sub-greeting #Inner .right-con .right-inner:before{position:absolute; top:40px; left:50px;display:inline-block; content:""; width:94px; height:3px; background-color:#fff;} #sub-greeting #Inner .right-con .sub-tit{ margin:0px 0px 0px 160px;padding:0; font-size:15px; text-align:left;} #sub-greeting #Inner .right-con .greetings-tit {font-size:43px; width:100%;font-weight:300; letter-spacing:-1.0px; padding:30px 0 0 0; line-height:50px;} #sub-greeting #Inner .right-con .greetings-tit b {font-weight:700;} #sub-greeting #Inner .right-con .greetings-tit2 {font-size:35px; width:100%;font-weight:100; letter-spacing:-1.0px; text-align:center; padding:0px 0px 0 0px ;} #sub-greeting #Inner .right-con .greetings-txt {font-size:20px; width:100%;line-height:30px; font-weight:300; letter-spacing:-0.5px; padding:20px 0 0px 0; } #sub-greeting #Inner .right-con .greetings {margin:0 auto; padding:70px 0 50px 0; width:90%; text-align:left;} #sub-greeting #Inner .right-con .greetings p.title {margin:0 auto; padding:0px 0 50px 0; width:100%; font-size:25px; padding-bottom:40px; line-height:1.3; text-align:center;} #sub-greeting #Inner .right-con .greetings .text {text-align:left; } /******* 서브페이지 슬로건 공통 **************/ #sub-Slogan {position:relative; width:100%; overflow:hidden} #sub-Slogan:before{position:absolute; top:0px; left:0px; content:""; width:100%; height:255px; background-color:#ececec;} #sub-Slogan #Inner {position:relative; margin:0 auto;padding:0; text-align:center; width:1100px; } #sub-Slogan #Inner .left-con {position:absolute; right:0; width:20%; margin:0;padding:0px; text-align:center;} #sub-Slogan #Inner .left-img { margin:0;padding:0px; } #sub-Slogan #Inner .left-img img {width:100%; padding-top:30px;} #sub-Slogan #Inner .left-img .sign img {width:100%; margin:0px 0 10px 0;} #sub-Slogan #Inner .left-con .sign {margin:0;padding:0px;} #sub-Slogan #Inner .left-con .sign .ceo-name { color:#3a3a3a; font-size:20px; font-weight:300; letter-spacing:-0.5px; margin:0;} #sub-Slogan #Inner .left-con .sign .ceo-en-name {color:#535252; font-size:15px; font-weight:300; margin-bottom:20px;} #sub-Slogan #Inner .right-con {float:left; width:100%;} #sub-Slogan #Inner .right-inner { margin display:block; position:relative; font-size:15px; padding:30px 0 30px 0px; margin:0 auto; text-align:center; } #sub-Slogan #Inner .right-con .right-inner:before{position:absolute; top:40px; left:50px;display:inline-block; content:""; width:94px; height:3px; background-color:#fff;} #sub-Slogan #Inner .right-con .sub-tit{ margin:0px 0px 0px 160px;padding:0; font-size:15px; text-align:left;} #sub-Slogan #Inner .right-con .greetings-tit {font-size:45px; font-weight:300; letter-spacing:-2.0px; padding:35px 0 0 0; margin:0 100px 0 0} #sub-Slogan #Inner .right-con .greetings-tit b {font-weight:700;} #sub-Slogan #Inner .right-con .greetings-txt {font-size:20px; line-height:30px; font-weight:300; letter-spacing:-0.5px; padding:20px 0 0px 0; margin:0 100px 0 0} #sub-Slogan #Inner .right-con .greetings {margin:0 auto; padding:90px 0 40px 0; width:80%; text-align:center;} #sub-Slogan #Inner .right-con .greetings .title-warp {margin:0 auto; width:100%; text-align:center; padding:0px 0 20px 0;} #sub-Slogan #Inner .right-con .greetings .title-warp span.top-img img {width:30px; margin:0 0 10px 0} #sub-Slogan #Inner .right-con .greetings .title-warp span.bottom-img img {width:30px;margin:10px 0px 0 0} #sub-Slogan #Inner .right-con .greetings .title-warp p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:28px; line-height:45px; text-align:center;} #sub-Slogan #Inner .right-con .greetings .text {margin:0 auto; width:100%; padding:0px 0 0px 0; text-align:center;font-size:18px;font-weight:300; line-height:30px;} #sub-Slogan #Inner .right-con .greetings .text2 {margin:0 auto; width:100%; padding:0px 0 0px 0; text-align:center;font-size:18px;font-weight:300; line-height:30px;} /******* aboutus.php Advantage**************/ #Advantagecon {width:100%;margin:0 auto; padding:20px 0 50px 0;background-repeat:no-repeat;background-position:center top; background:#fbfbfb; } #Advantagecon .Advantage {overflow:hidden;width:1100px;margin:0 auto;padding:0;} .Advantage .line_obj {position:relative;width:100%;overflow:hidden;margin:0 auto;padding:0;} .Advantage .line_obj li {float:left;position:relative;width:24.3%; margin:0 auto;} .Advantage .line_obj li.obj01{ margin:0px 10px 0 0; padding-top:50px; } .Advantage .line_obj li.obj02{ margin:0 10px 0 0; padding-top:90px} .Advantage .line_obj li.obj03{margin:0 10px 0 0; padding-top:30px} .Advantage .line_obj li.obj04{ margin:0 0px 0 0; padding-top:100px} .Advantage .line_obj .txt{width:90%;margin:0 auto;text-align:center;} .Advantage .line_obj .thumb {text-align:center;} .Advantage .line_obj .thumb img{width:70%} .Advantage .line_obj .txt01{font-size:24px;font-weight:400;color:#333;line-height:36px; padding:20px 0 10px 0;} .Advantage .line_obj .txt02{font-size:15px;line-height:20px;} /******* aboutus.php VISION & MISSION**************/ #vision-warp {width:100%; overflow:hidden; margin:0 auto; padding:90px 0 70px 0; background:#fbfbfb;} .vision-con {width:1100px; height:600px; margin:0 auto; padding:0; text-align:center;} .vision-con h3 {font-size:40px; font-weight:700;margin:0 0 20px 0} .vision-con > p{font-size: 25px;line-height: 30px; margin:0 0 50px 0} .vision {position:relative; width:100%; margin:0 auto; text-align:center;} .vision .con {position:absolute;width:286px;height:285px;background-repeat:no-repeat;background-size:cover;transition:all .4s .4s ease-in-out;-webkit-transition:all .4s .4s ease-in-out} .vision .con img {width:30px;} .vision .con.vision{background-image:url(../../img/bg_vision.png);left:50%;margin-left:-143px;} .vision .con.mission{background-image:url(../../img/bg_mission.png);right:50%;margin-right:-143px;} .vision .con.target{background-image:url(../../img/bg_target.png);left:50%;margin-left:-143px;} .vision.on .con.vision{margin-left:-263px;} .vision.on .con.mission{margin-right:-263px;} .vision.on .con.target{margin-top:220px;} .vision .con .txt_box{opacity:0;position:absolute;width:100%;text-align:center;top:50%;color:#fff; transform:translateY(-50%);-webkit-transform:translateY(-50%);transition:all .4s .8s ease-in-out;-webkit-transition:all .4s .8s ease-in-out} .vision.on .con .txt_box{opacity:1;} .vision .con .txt_box span{display:block;font-size:30px;line-height:16px;font-weight:bold;margin-top:20px;} .vision .con .txt_box p{font-size:50px;line-height:50px;font-weight:500;} .vision .con .tabtext{opacity:0;top:43%;width:320px;font-size:20px; font-weight:500; line-height:25px;position:absolute;background-repeat:no-repeat;box-sizing:border-box; transform:translateY(-50%);-webkit-transform:translateY(-50%); transition:all .4s 1.2s ease-in-out;-webkit-transition:all .4s 1.2s ease-in-out} .vision .con.target .tabtext1, .vision .con.target .tabtext2{text-align:left; opacity:0;top:60%;width:350px;font-size:15px; font-weight:300; line-height:20px;position:absolute;background-repeat:no-repeat;box-sizing:border-box; transform:translateY(-50%);-webkit-transform:translateY(-50%); transition:all .4s 1.2s ease-in-out;-webkit-transition:all .4s 1.2s ease-in-out} .vision .con.target p span{font-size:20px;font-weight:500;} .vision.on .con .tabtext1, .vision.on .con .tabtext2 {opacity:1;} .vision .con.vision .tabtext{padding:0 80px 0 0;background-image:url(../../img/v_bar.png);background-position:right center;right:250px;} .vision .con.mission .tabtext{padding:0 0px 0 80px;background-image:url(../../img/v_bar2.png);background-position:left center;left:250px;} .vision .con.target .tabtext1{padding:0 80px 0 0px;;background-image:url(../../img/v_bar.png);background-position:right center;right:250px;bottom:20px} .vision .con.target .tabtext2{padding:0 0px 0 90px;;background-image:url(../../img/v_bar2.png);background-position:left center;left:250px;bottom:20px} /******* 서브페이지 컨텐츠 공통 **************/ .sub-con {margin:0 auto; padding:50px 0 50px 0; text-align:center; width:100%; overflow:hidden; } .sub-con .sub-warp { width:1100px; margin:0 auto; padding:0px 0 0px 0; overflow:hidden;} .sub-con .sub-warp .con-Limg { float:left; width:40%; margin:0 auto; padding:0px 0 0px 0; text-align:left; } .sub-con .sub-warp .con-Rimg { float:left; width:40%; margin:0 auto; padding:0px 0 0px 0; text-align:right; } .sub-con .sub-warp img {width:90%; height:auto;} .sub-con .sub-warp p.title {margin:0 auto; padding:0px 0 50px 0; width:100%; font-size:25px; font-weight:500; line-height:1.3; } .sub-con .sub-warp .con-inner {float:left; margin:0 auto; padding:0px 10px 0px 10px; width:58%; text-align:left; } .sub-con .con-inner ul {margin:0px 0px 0 30px ;list-style:url(../../img/list-icon.png)} .sub-con .con-inner li {width:100%; padding: 5px 0 5px 0 } .sub-con .con-inner ul li p.litit {margin:0 auto; padding:0px 0 0px 0; font-size:20px; line-height:1.5; } .sub-con .con-inner ul li p.litext {margin:0 auto; padding:5px 0 10px 0; line-height:1.5; } .sub-con .con-inner ul li p.litext {margin:0 auto; padding:5px 0 10px 0; line-height:1.5; } .sub-con .con-inner ul li ul {margin:0px 0px 20px 30px ;list-style:url(../../img/list-icon2.png)} .sub-con .con-inner ul li ul li{width:100%; padding: 5px 0 5px 0; font-size:15px; line-height:1.3;} .sub-con .con-inner ul li ul li p.litext {margin:0 auto; padding:5px 0 10px 0; font-size:15px; line-height:1.3; } .sub-con .con-inner p.title {margin:0 auto; padding:0px 0 30px 0; width:100%; font-size:25px; font-weight:500; line-height:1.3; } .sub-con .con-inner p.text {margin:0 auto; padding:0px 0 20px 0; width:100%; } .sub-con .sub-warp .con-inner2 {margin:0 auto; padding:0px 10px 0px 10px; width:99%; text-align:left; } .sub-con .con-inner2 p.title {margin:0 auto; padding:0px 0 30px 0; width:100%; font-size:25px; font-weight:500; line-height:1.3; } .sub-con .con-inner2 p.text {margin:0 auto; padding:0px 0 20px 0; width:100%; } .sub-con .con-inner ul.app-ul {margin:0px 0px 0 0px ;list-style:none; } .sub-con .con-inner ul.app-ul li {position:relative;height:200px;width:30%; float:left; border: 1px solid #DDD; margin:0 auto; text-align:center;} .sub-con .con-inner ul.app-ul li div {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);width:90%;margin:0 auto; } .sub-con .con-inner ul.app-ul li.arrow {width:3%;padding:4px; border: 0px solid #DDD;background:#ffffff;} .sub-con .con-inner ul.app-ul li.arrow .aw { padding:0px 0 0 0} .sub-con .con-inner>ul.app-ul>li:first-child {background:#f2f2f2;} .sub-con .con-inner>ul.app-ul>li:nth-child(3) {background:#fdfdfd;} .sub-con .con-inner>ul.app-ul>li:last-child {background:#f2f2f2;} .sub-con .con-inner3 {margin:0 auto; padding:30px 0 0px 0; text-align:center; width:100%; overflow:hidden; } .sub-con .con-inner3 ul {margin:0px 0px 0 0px ;list-style:none;} .sub-con .con-inner3 li { position:relative;height:150px;width:15%; float:left; border: 1px solid #DDD; margin:0 auto; text-align:center; overflow:hidden; } .sub-con .con-inner3 li div {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);width:90%;margin:0 auto; } .sub-con .con-inner3 li.arrow {width:1%;padding:4px; border: 0px solid #DDD;background:#ffffff;} .sub-con .con-inner3 li.arrow .aw { padding:0px 0 0 0} .sub-con .sub-warp .con-inner2 {margin:0 auto; padding:0px 10px 0px 10px; width:99%; text-align:left; } .sub-con .con-inner2 ul {margin:0px 0px 0 30px ;list-style:url(../../img/list-icon.png)} .sub-con .con-inner2 li {width:100%; padding: 5px 0 5px 0 } .sub-con .con-inner2 ul li p.litit {margin:0 auto; padding:0px 0 0px 0; font-size:20px; line-height:1.5; } .sub-con .con-inner2 ul li p.litext {margin:0 auto; padding:5px 0 10px 0; line-height:1.5; } .sub-con .con-inner2 ul li ul {margin:0px 0px 20px 30px ;list-style:url(../../img/list-icon2.png)} .sub-con .con-inner2 ul li ul li{width:100%; padding: 5px 0 5px 0; font-size:15px; line-height:1.3;} .sub-con .con-inner2 ul li ul li p.litext {margin:0 auto; padding:5px 0 10px 0; font-size:15px; line-height:1.3; } .sub-con .con-inner2 p.title {margin:0 auto; padding:0px 0 30px 0; width:100%; font-size:25px; font-weight:500; line-height:1.3; } .sub-con .con-inner2 p.text {margin:0 auto; padding:0px 0 20px 0; width:100%; } .sub-con .con-inner3 {margin:0 auto; padding:30px 0 0px 0; text-align:center; width:100%; overflow:hidden; } .sub-con .con-inner3 ul {margin:30px 0px 0 0px ;list-style:none;} .sub-con .con-inner3 li { position:relative;height:180px;width:15%; float:left; border: 1px solid #DDD; margin:0 auto; text-align:center; overflow:hidden; } .sub-con .con-inner3 li div {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);width:90%;margin:0 auto; } .sub-con .con-inner3 li.arrow {width:1%;padding:4px; border: 0px solid #DDD;background:#ffffff;} .sub-con .con-inner3 li.arrow .aw { padding:0px 0 0 0} .sub-con .con-inner3>ul>li:first-child {background:#f2f2f2;} .sub-con .con-inner3>ul>li:nth-child(3) {background:#fdfdfd;} .sub-con .con-inner3>ul>li:nth-child(5) {background:#f2f2f2;} .sub-con .con-inner3>ul>li:nth-child(7) {background:#fdfdfd;} .sub-con .con-inner3>ul>li:nth-child(9) {background:#f2f2f2;} .sub-con .con-inner3>ul>li:last-child {background:#fdfdfd;} .sub-con .con-inner3 {margin:0 auto; padding:30px 0 0px 0; text-align:center; width:100%; overflow:hidden; } .sub-con .con-inner3 ul.Inv-ul {margin:0px 0px 0 0px ;list-style:none;} .sub-con .con-inner3 ul.Inv-ul li { position:relative;height:150px;width:15%; float:left; border: 1px solid #DDD; margin:0 auto; text-align:center; overflow:hidden; } .sub-con .con-inner3 ul.Inv-ul li div {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);width:100%;margin:0 auto; } .sub-con .con-inner3 ul.Inv-ul li div ul li {margin:0 auto; height:42px; padding:0px 0 0px 0; text-align:center; width:100%; } .sub-con .con-inner3 ul.Inv-ul li div ul li.arrow {width:1%; height:10px; padding:0px; border: 0px solid #DDD;background:#ffffff;} .sub-con .con-inner3 ul.Inv-ul li.arrow {width:5%;padding:4px; border: 0px solid #DDD;background:#ffffff;} .sub-con .con-inner3 ul.Inv-ul li.arrow .aw { padding:0px 0 0 0} .sub-con .con-inner3>ul.Inv-ul>li:first-child {background:#f2f2f2;} .sub-con .con-inner3>ul.Inv-ul>li:nth-child(3) {background:#fdfdfd;} .sub-con .con-inner3>ul.Inv-ul>li:last-child {background:#f2f2f2;} .col-md-91 {-ms-flex:0 0 91.66666%; flex:0 0 91.66666%; width:91.66666%} .row { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .sub-con .sub-warp .con-ul {float:left; margin:0 auto; padding:0px 10px 0px 10px; width:58%; text-align:left; } .sub-con .con-ul ul.check-list {list-style:none; padding:0;} .sub-con .con-ul ul.check-list li{margin-bottom: 10px;} .sub-con .con-ul ul.check-list li i{ margin-right: 10px; font-size: 14px !important;} .sub-con .con-ul ul.check-list li .maker { margin-right: 8px; font-weight:bold;} .sub-con .con-ul ul.check-list2 {list-style:none; margin:5px 0 0 20px; padding:0px; } .sub-con .con-ul ul.check-list2 li {width:100%; margin-bottom: 0px; padding: 0px 0 2px 0; } #table1 {display: table; width: 100%; margin:0 auto; text-align:center;} #table1 .row {display: table-row; width: 100%;} #table1 .row-img {display: table-row; width: 100%; } #table1 .cell {display: table-cell; border-bottom: 1px solid #DDD; border-right: 1px solid #DDD;font-size:13px;} #table1 .col1 { width: 10%; display:table-cell; vertical-align:middle;padding: 10px;font-weight:500; border-left: 1px solid #DDD;} #table1 .col2 {width: 29%; padding: 15px 15px 15px 20px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto;} #table1 .col3 {width: 29%; padding: 15px 15px 15px 20px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto;} #table1 .col4 {width: 29%; padding: 15px 15px 15px 20px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto; } #table1 .first { border-top: 2px solid #DDD; background:#f7f7f7;font-weight:bold; margin:0 auto;text-align:center;} #table2 {display: table; width: 100%; margin:0 auto; text-align:center;} #table2 .row {display: table-row; width: 100%;} #table2 .row-img {display: table-row; width: 100%; } #table2 .cell {display: table-cell; border-bottom: 1px solid #DDD; border-right: 1px solid #DDD;font-size:13px;} #table2 .col1 { width: 10%; display:table-cell; vertical-align:middle;padding: 10px;font-weight:500; border-left: 1px solid #DDD;background:#f7f7f7;} #table2 .col2 {width: 29%; padding: 15px 15px 15px 20px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto; text-align:left;} #table2 .col3 {width: 29%; padding: 15px 15px 15px 20px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto;} #table2 .col4 {width: 29%; padding: 15px 15px 15px 20px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto; } #table2 .first { border-top: 1px solid #1269ca; font-weight:bold; margin:0 auto;} #table3-warp {width: 100%; margin:0 auto; padding:0;text-align:center;} #table3-warp p { margin:0 auto; padding:30px 30px 20px 0;text-align:right;} #table3-warp .table3-first {width: 49%; margin:0 auto; text-align:center; float:left;} #table3-warp .table3-second {width: 49.5%; margin:0 auto; text-align:center; float:right;} #table3 {display: table; width: 100%; margin:0 auto; text-align:center; float:left} #table3 .row {display: table-row; width: 100%;} #table3 .row-img {display: table-row; width: 100%; } #table3 .cell {display: table-cell; border-bottom: 1px solid #DDD; border-right: 1px solid #DDD;font-size:13px;} #table3 .col1 { width: 80%; display:table-cell; vertical-align:middle;padding: 10px;border-left: 1px solid #DDD;} #table3 .col2 {width: 20%; padding: 15px 15px 15px 20px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto; background:#f7f7f7;} #table3 .col3 {width: 29%; padding: 15px 15px 15px 20px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto;} #table3 .col4 {width: 29%; padding: 15px 15px 15px 20px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto; } #table3 .first { border-top: 1px solid #DDD; margin:0 auto;text-align:center;} #table4 {display: table; width: 100%; margin:0 auto; text-align:left;} #table4 .row {display: table-row; width: 100%;} #table4 .row-img {display: table-row; width: 100%; } #table4 .cell {display: table-cell; border-bottom: 1px solid #DDD; border-right: 1px solid #DDD;font-size:13px;} #table4 .col1 { width: 15%; display:table-cell; vertical-align:middle;padding: 10px;font-weight:500; border-left: 1px solid #DDD; text-align:center;} #table4 .col2 {width: 29%; padding: 15px 15px 15px 20px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto;} #table4 .col3 {width: 29%; padding: 15px 15px 15px 20px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto;} #table4 .col4 {width: 29%; padding: 15px 15px 15px 20px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto; } #table4 .first { border-top: 2px solid #DDD; background:#f7f7f7;font-weight:bold; margin:0 auto;text-align:center;} #table5 {display: table; width: 100%; margin:0 auto; text-align:center;} #table5 .row {display: table-row; width: 100%;} #table5 .row-img {display: table-row; width: 100%; } #table5 .cell {display: table-cell; border-bottom: 1px solid #DDD; border-right: 1px solid #DDD;font-size:13px;} #table5 .col1 { width: 10%; display:table-cell; vertical-align:middle;padding: 10px;font-weight:500; border-left: 1px solid #DDD;} #table5 .col2 {width: 29%; padding: 15px 15px 15px 20px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto;} #table5 .col3 {width: 29%; padding: 15px 15px 15px 20px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto;} #table5 .col4 {width: 29%; padding: 15px 15px 15px 20px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto; } #table5 .first { border-top: 2px solid #DDD; background:#f7f7f7;font-weight:bold; margin:0 auto;text-align:center;} .text-con2 {position:relative; overflow:hidden; width: 100%; margin: 0 auto; padding: 30px 0 30px 0 ; text-align:center; } .text-con2 .con2-warp {width:90%;overflow:hidden;border: 1px solid #DDD;margin:0 auto; text-align:center;} .text-con2 .con2-warp .table-title {width:100%;height:50px;background:#e5e5e5;border: 1px solid #DDD;margin:0 auto; text-align:center;line-height:50px; font-weight:400;} .text-con2 p {width:90%;font-size:14px;margin:0 auto; text-align:center;padding:20px 0 0 0;} #table6 {width: 100%; margin:0 auto; text-align:center; } #table6 .cell {width: 49.9%; float:left; padding: 0px; font-size:14px; font-weight:300; margin:0 auto;} #table6 .first { border-right: 1px solid #DDD; margin:0 auto;text-align:center;} #table6 .cell ol {list-style:decimal;margin:0 0 0 30px;text-align:left;padding: 30px;} #table6 .cell ol li {width:100%;text-align:left; line-height:30px;} .text-con {position:relative; overflow:hidden; width: 100%; margin: 0 auto; padding: 0 0 0px 0 ; text-align:left; } .text-con p.sub-title {font-size:20px;font-weight:bold;color:#3a445a; margin:0 0 0px 0; line-height:0px;} .text-con p.sub-title i {font-size:17px;color:#4c5569} .text-con p.Item-title {font-size:25px;font-weight:bold;color:#3a445a; margin:0; padding:0 0 20px 0; letter-spacing:-1px;} .text-con p.Item-title i {font-size:20px; color:#d86b00} .text-con p.title {font-size:20px;font-weight:bold;color:#485675; margin:0 0 10px 0 !important; } .text-con p.title i {font-size:14px;color:#0082fb } .sub-con div .img_zoom{ -webkit-transform:scale(1.0); /* ũ�� */ -moz-transform:scale(1.0); /* FireFox */ -o-transform:scale(1.0); /* Opera */ transform:scale(1.0); transition: transform .45s; -o-transition: transform .45s; -moz-transition: transform .45s; -webkit-transition: transform .45s; } .sub-con div:hover .img_zoom { -webkit-transform:scale(1.05); /* ũ�� */ -moz-transform:scale(1.05); /* FireFox */ -o-transform:scale(1.05); /* Opera */ transform:scale(1.05); transition: transform .55s; -o-transition: transform .55s; -moz-transition: transform .55s; -webkit-transition: transform .55s; } /******* ul ***************/ ul.list-type1 li { list-style: none; position: relative; padding: 3px 0 2px 25px;} ul.list-type1 li::before { position: absolute; top: 3px; left: 0;} ul.list-type1>li:first-child::before{content: "①";} ul.list-type1>li:nth-child(2)::before{content: "②";} ul.list-type1>li:nth-child(3)::before{content: "③";} ul.list-type1>li:nth-child(4)::before{content: "④";} ul.list-type1>li:nth-child(5)::before{content: "⑤";} ul.list-type1>li:nth-child(6)::before{content: "⑥";} ul.list-type1>li:nth-child(7)::before{content: "⑦";} ul.list-type1>li:nth-child(8)::before{content: "⑧";} ul.list-type1>li:nth-child(9)::before{content: "⑨";} ul.list-type1>li:nth-child(10)::before{content: "⑩";} ul.list-type1>li:nth-child(11)::before{content: "⑪";} ul.list-type1>li:nth-child(12)::before{content: "⑫";} ul.list-type1>li:nth-child(13)::before{content: "⑬";} ul.list-type1>li:nth-child(14)::before{content: "⑭";} ul.list-type2 li { list-style: none; position: relative; padding: 3px 0 0px 12px;} ul.list-type2 li::before { content: '•'; position: absolute; top: 1px; left: 0;} /******* qna search ***************/ #search-area .sub-con {margin:0 auto; padding:50px 0 50px 0; text-align:center; width:100%; overflow:hidden; } #search-area .sub-con .sub-warp { width:1000px; margin:0 auto; padding:0px 0 0px 0; overflow:hidden;} #search .question {padding: 0px;background: white; transition: all 0.5s ease; margin-bottom: 0px; border: 1px solid #DDD; border-top: 0px solid #DDD; text-align:left;} #search UL.list-warp {border-top: 1px solid #DDD;} #search .question:hover { background-color: #47c1fc;} #search .question .faqAnswer { display: none; padding: 20px 40px; font-weight: 200; font-size: 16px;color: #080808;} #search .question .faqAnswer p{padding: 0px 0px 10px 0; } #search .question .faqAnswer p.blue {color: #529aeb; } .faqAnswer UL {position: relative;padding:0 0px 0 0} .faqAnswer UL { margin:0px 0 0 0px ; display: flex; align-items: center; flex-wrap: wrap;} .faqAnswer ul li {width:100%;} .faqAnswer UL li ul{ margin:0px 0 0 0px ; display: flex; align-items: center; flex-wrap: wrap;} #search .question.open { border-bottom: 1px solid #DDD;margin: 0px 0 0px 0;background-color: #f8f8f8; -webkit-box-shadow: 0px 0px 17px -1px rgba(0,0,0,0.13); -moz-box-shadow: 0px 0px 17px -1px rgba(0,0,0,0.13); box-shadow: 0px 0px 17px -1px rgba(0,0,0,0.13); } #search .question .click.open{ border-radius: 0px; margin: 0px; color: white; background-color: #0695dd;} #search .question .click.open i {color: white;} #search .question .click.open h4{ color: white;font-weight: 300; } #search .question h4 { margin: 0px; padding: 10px 10px 10px 0; color: black; font-weight: 200; font-size: 16px; } #search .question .click {cursor: pointer; border-radius: 6px; margin: 0px; padding: 0px; color: black; font-weight: 400; font-size: 16px; } #search .question .icon {width:5%;margin:0; padding:0;} #search .question .title {width:90%;margin:0; padding:0;} #search .question .right {width:5%;margin:0; padding:0;text-align:right;} #search .question i { line-height:48px;padding:0px 0px 0 15px;color: #5bc7fb; font-size: 24px;} #search .question .right i{line-height:48px;padding:0px 15px 0 0px;color: #9d9d9d; font-size: 20px;} #search .question i.off { display:none} #search .question:hover h4 { color: white;} #search .question:hover i { color: white;} .search-con {margin:0 auto; padding:50px 0 50px 0; text-align:center; width:100%; overflow:hidden; } .search-con .search-warp { width:1000px; margin:0 auto; padding:0px 0 0px 0; overflow:hidden;} .search-con .search-warp .con-Limg { float:left; width:40%; margin:0 auto; padding:0px 0 0px 0; text-align:left; } .search-con .search-warp .con-Rimg { float:left; width:40%; margin:0 auto; padding:0px 0 0px 0; text-align:right; } .search-con .search-warp img {width:90%; height:auto;} .search-con .search-warp p.title {margin:0 auto; padding:0px 0 50px 0; width:100%; font-size:25px; font-weight:500; line-height:1.3; } .question .row { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .search-input { width:1000px; margin:0 auto; padding:0px 0 0px 0; overflow:hidden;text-align:right;} .search-input .form-search{display:block;width:84%;padding:10px 10px 10px 50px; font-size:1rem;color:#55595c;background-color:#fff;background-image:none;border:1px solid #ccc;} .search-input .form-search::-ms-expand{background-color:transparent;border:0} .search-input .form-search:focus{border-color:#66afe9;outline:0} .search-input .form-search::-webkit-input-placeholder{color:#999;opacity:1} .search-input .form-search::-moz-placeholder{color:#999;opacity:1} .search-input .form-search:-ms-input-placeholder{color:#999;opacity:1} .search-input .form-search::placeholder{color:#999;opacity:1} .search-input input[type=text]::-ms-clear { display: none;} .searchclear {position: absolute; right: 15px;top: 0px; bottom: 0; width: 20px;height: 100%; margin: auto; font-size: 1.6rem; cursor: pointer; color: #ccc;} .searchclear:hover i { color:red;} .search-icon { position: absolute;left: 0px; top: 0px; bottom: 0; width: 40px; height: 100%; margin: auto; font-size: 1.3rem; background-color: #5bc7fb;} .search-icon i {padding:10px;color: #fff; } .highlight { font-weight:400; color:red} .search-input .myHead {position: relative;width:40%; margin:0 0 30px 0;float: right;overflow:hidden;} /******* contact us 회사정보 ***************/ .Contact-con {margin:0 auto; padding:30px 0 20px 0; text-align:center; width:100%; overflow:hidden; } .Contact-con .Contact-warp {width:1100px; margin:0 auto; padding:0px 0 0px 0; overflow:hidden;} .Contact-con .Contact-warp .con-Limg { position:relative;float:left; width:100%; height:150px; margin:0 0 30px 0; padding:0px 0 30px 0; text-align:center; background: url("../../img/contactus-m01.jpg") no-repeat ; background-size: cover; } .Contact-con .Contact-warp .con-Limg .title {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; font-size:28px;font-weight:500; line-height:50px; color: rgb(255, 255, 255); text-shadow:5px 6px 14px rgba(0, 0, 0, 0.4); margin:0;} .Contact-con .Contact-warp p.title {margin:0 auto; padding:0px 0 30px 0; width:100%; font-size:23px; font-weight:400; line-height:1.3; } .Contact-con .Contact-warp .con-inner {float:left; margin:0 auto; padding:0px 0px 0px 0px; width:100%; text-align:left; } .Contact-con .con-inner ul {width:100%; overflow:hidden; margin:10px 0 0 0px } .Contact-con .con-inner li {width:100%; padding: 3px 0 3px 0 } .Contact-con .con-inner p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:20px; font-weight:500; line-height:20px; } .Contact-con .con-inner p.text {margin:0 auto; padding:0px 0 50px 0; width:100%; padding-bottom:0px; } .Contact-con .Contact-warp .con-inner2 {margin:0 auto; padding:0px 0px 0px 0px; width:100%; text-align:left; } .Contact-con .con-inner2 p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:20px; font-weight:500; line-height:20px; } .Contact-con .con-inner2 p.text {margin:0 auto; padding:0px 0 50px 0; width:100%; padding-bottom:0px; } /******* contact us 구글맵 ***************/ .map-warp {width:100%; padding:80px 0 50px 0;} .map {width:1100px; height:500px; margin:0 auto; text-align:center;} /*********************************** @media screen and (max-width: 1100px) ***********************************/ @media only screen and (max-width:1100px) { .location {width:100%;margin:0 auto;} /******* 서브페이지 타이틀 공통 **************/ #page-title {width:100%; margin:0 auto; text-align:center; padding:0px 0 30px 0px;} #page-title .line {width:2px; height:30px;margin:0 auto; text-align:center;background:red} #page-title .title {font-size:40px;font-weight:700;} .Small-paragraph {width:100%;margin:0 auto; text-align:center;} .Small-paragraph .paragraph {width:1100px; margin:0 auto; padding:70px 0 50px 0;text-align:center;} .Small-paragraph .paragraph p.title {margin:0 auto; padding:0px 0 30px 0;font-size:28px; font-weight:400; line-height:40px;} .Small-paragraph .paragraph .text { width:80%; margin:0 auto; text-align:center; font-size:20px;font-weight:300; line-height:30px;} /******* 서브페이지 About Us **************/ #sub-greeting {position:relative; width:100%; overflow:hidden} #sub-greeting:before{position:absolute; top:0px; left:0px; content:""; width:100%; height:255px;background-color:#ececec;} #sub-greeting #Inner {margin:0 auto;padding:0; text-align:center; width:95%; } #sub-greeting #Inner .left-con {position:absolute; float:right; width:17%; margin:0;padding:0px; top:-20px; right:30px; text-align:center;} #sub-greeting #Inner .left-img { margin:0 0px 0 0;padding:0 0px 0 0;} #sub-greeting #Inner .left-img img {width:100%; padding-top:50px; } #sub-greeting #Inner .left-img .sign img {width:100%; margin:0px 0 10px 0;} #sub-greeting #Inner .left-con .sign {display:none;margin:0;padding:0px;} #sub-greeting #Inner .left-con .sign .ceo-name { color:#3a3a3a; font-size:20px; font-weight:300; letter-spacing:-0.5px; margin:0;} #sub-greeting #Inner .left-con .sign .ceo-en-name {color:#535252; font-size:15px; font-weight:300; margin-bottom:20px;} #sub-greeting #Inner .right-con {float:left; width:100%;} #sub-greeting #Inner .right-inner { margin display:block; position:relative; font-size:15px; padding:30px 0 30px 0px; margin:0 auto; text-align:center; } #sub-greeting #Inner .right-con .right-inner:before{position:absolute; top:40px; left:50px;display:inline-block; content:""; width:94px; height:3px; background-color:#fff;} #sub-greeting #Inner .right-con .sub-tit{ margin:0px 0px 0px 160px;padding:0; font-size:15px; text-align:left;} #sub-greeting #Inner .right-con .greetings-tit {font-size:40px; width:100%;font-weight:300; letter-spacing:-2.0px; text-align:center; padding:35px 0px 0 0px ;} #sub-greeting #Inner .right-con .greetings-tit b {font-weight:700;} #sub-greeting #Inner .right-con .greetings-tit2 {font-size:30px; width:100%;font-weight:100; letter-spacing:-2.0px; text-align:center; padding:0px 0px 0 0px ;} #sub-greeting #Inner .right-con .greetings-txt {font-size:20px; width:100%;line-height:30px; font-weight:300; letter-spacing:-0.5px; text-align:center; padding:20px 0 0px 0px; } #sub-greeting #Inner .right-con .greetings {margin:0 auto; padding:70px 0 50px 0; width:90%; text-align:left;} #sub-greeting #Inner .right-con .greetings p.title {margin:0 auto; padding:0px 0 50px 0; width:100%; font-size:25px; padding-bottom:40px; line-height:1.3; text-align:center;} #sub-greeting #Inner .right-con .greetings .text { text-align:center;} /******* aboutus.php Advantage**************/ #Advantagecon {width:100%;margin:0 auto; padding:20px 0 50px 0;background-repeat:no-repeat;background-position:center top; background:#fbfbfb; } #Advantagecon .Advantage {overflow:hidden;width:95%;margin:0 auto;padding:0;} .Advantage .line_obj {position:relative;width:100%;overflow:hidden;margin:0 auto;padding:0;} .Advantage .line_obj li {float:left;position:relative;width:24%; margin:0 auto;} .Advantage .line_obj li.obj01{ margin:0px 10px 0 0; padding-top:50px} .Advantage .line_obj li.obj02{ margin:0 10px 0 0; padding-top:90px} .Advantage .line_obj li.obj03{margin:0 10px 0 0; padding-top:30px} .Advantage .line_obj li.obj04{ margin:0 0px 0 0; padding-top:100px} .Advantage .line_obj .txt{width:95%;text-align:center;} .Advantage .line_obj .thumb {text-align:center} .Advantage .line_obj .txt01{font-size:22px;font-weight:400;color:#333;line-height:25px; padding:20px 0 10px 0;} .Advantage .line_obj .txt02{font-size:15px;} /******* aboutus.php VISION & MISSION**************/ #vision-warp {width:100%; overflow:hidden; margin:0 auto; padding:80px 0 0px 0; background:#fbfbfb;} .vision-con {width:95%; height:550px; margin:0 auto; padding:0; text-align:center;} .vision-con h3 {font-size:40px; font-weight:700;margin:0 0 20px 0} .vision-con > p{font-size: 25px;line-height: 30px; margin:0 0 50px 0} .vision {position:relative; width:100%; margin:0 auto; text-align:center;} .vision .con {position:absolute;width:230px;height:230px;background-repeat:no-repeat;background-size:cover;transition:all .4s .4s ease-in-out;-webkit-transition:all .4s .4s ease-in-out} .vision .con img {width:30px;} .vision .con.vision{background-image:url(../../img/bg_vision.png);left:50%;margin-left:-115px;} .vision .con.mission{background-image:url(../../img/bg_mission.png);right:50%;margin-right:-115px;} .vision .con.target{background-image:url(../../img/bg_target.png);left:50%;margin-left:-115px;} .vision.on .con.vision{margin-left:-220px;} .vision.on .con.mission{margin-right:-220px;} .vision.on .con.target{margin-top:180px;} .vision .con .txt_box{opacity:0;position:absolute;width:100%;text-align:center;top:50%;color:#fff; transform:translateY(-50%);-webkit-transform:translateY(-50%);transition:all .4s .8s ease-in-out;-webkit-transition:all .4s .8s ease-in-out} .vision.on .con .txt_box{opacity:1;} .vision .con .txt_box span{display:block;font-size:30px;line-height:16px;font-weight:bold;margin-top:20px;} .vision .con .txt_box p{font-size:50px;line-height:50px;font-weight:500;} .vision .con .tabtext{opacity:0;top:43%;width:300px;font-size:20px; font-weight:500; line-height:25px;position:absolute;background-repeat:no-repeat;box-sizing:border-box; transform:translateY(-50%);-webkit-transform:translateY(-50%); transition:all .4s 1.2s ease-in-out;-webkit-transition:all .4s 1.2s ease-in-out} .vision .con.target .tabtext1, .vision .con.target .tabtext2{text-align:left; opacity:0;top:60%;width:430px;font-size:15px; font-weight:300; line-height:20px;position:absolute;background-repeat:no-repeat;box-sizing:border-box; transform:translateY(-50%);-webkit-transform:translateY(-50%); transition:all .4s 1.2s ease-in-out;-webkit-transition:all .4s 1.2s ease-in-out} .vision .con.target p span{font-size:20px;font-weight:500;} .vision.on .con .tabtext1, .vision.on .con .tabtext2 {opacity:1;} .vision .con.vision .tabtext{padding:0 80px 0 0;background-image:url(../../img/v_bar.png);background-position:right center;right:200px;} .vision .con.mission .tabtext{padding:0 0px 0 80px;background-image:url(../../img/v_bar2.png);background-position:left center;left:200px;} .vision .con.target .tabtext1{padding:0 50px 0 0px;;background-image:url(../../img/v_bar.png);background-position:right center;right:180px;bottom:20px} .vision .con.target .tabtext2{padding:0 0px 0 90px;;background-image:url(../../img/v_bar2.png);background-position:left center;left:180px;bottom:20px} /******* 서브페이지 슬로건 공통 **************/ #sub-Slogan {position:relative; width:100%; overflow:hidden} #sub-Slogan:before{position:absolute; top:0px; left:0px; content:""; width:100%; height:255px; background-color:#ececec;} #sub-Slogan #Inner {margin:0 auto;padding:0; text-align:center; width:95%; overflow:hidden} #sub-Slogan #Inner .left-con {position:absolute; float:left; width:20%; margin:0; padding:0px; top:30px;text-align:center; } #sub-Slogan #Inner .left-img { margin:0;padding:0px; } #sub-Slogan #Inner .left-img img {width:100%; padding-top:30px;} #sub-Slogan #Inner .left-img .sign img {width:100%; margin:0px 0 10px 0;} #sub-Slogan #Inner .left-con .sign {margin:0;padding:0px;} #sub-Slogan #Inner .left-con .sign .ceo-name { color:#3a3a3a; font-size:20px; font-weight:300; letter-spacing:-0.5px; margin:0;} #sub-Slogan #Inner .left-con .sign .ceo-en-name {color:#535252; font-size:15px; font-weight:300; margin-bottom:20px;} #sub-Slogan #Inner .right-con {float:left; width:100%;} #sub-Slogan #Inner .right-inner { width:90%; display:block; position:relative; font-size:15px; padding:30px 0 30px 0px; margin:0 auto; text-align:center; } #sub-Slogan #Inner .right-con .right-inner:before{position:absolute; top:40px; left:50px;display:inline-block; content:""; width:94px; height:3px; background-color:#fff;} #sub-Slogan #Inner .right-con .sub-tit{ margin:0px 0px 0px 160px;padding:0; font-size:15px; text-align:left;} #sub-Slogan #Inner .right-con .greetings-tit {font-size:43px; font-weight:300; letter-spacing:-2.0px; padding:40px 0 0 0;} #sub-Slogan #Inner .right-con .greetings-tit b {font-weight:700;} #sub-Slogan #Inner .right-con .greetings-txt {font-size:20px; line-height:30px; font-weight:300; letter-spacing:-0.5px; padding:20px 0 0px 0; } #sub-Slogan #Inner .right-con .greetings {margin:0 auto; padding:70px 0 50px 0; width:90%; text-align:left;} #sub-Slogan #Inner .right-con .greetings .title-warp p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:28px; line-height:45px; text-align:center;} #sub-Slogan #Inner .right-con .greetings .text {margin:0 auto; width:100%; padding:0px 0 0px 0; text-align:center;font-size:19px;font-weight:300; line-height:30px;} #sub-Slogan #Inner .right-con .greetings .text2 {margin:0 auto; width:100%; padding:0px 0 0px 0; text-align:center;font-size:18px;font-weight:300; line-height:30px;} /******* 서브페이지 컨텐츠 공통 **************/ .sub-con {margin:0 auto; padding:50px 0 50px 0; text-align:center; width:100%; overflow:hidden; } .sub-con .sub-warp { width:95%; margin:0 auto; padding:0px 0 0px 0; overflow:hidden;} .sub-con .sub-warp .con-Limg { float:left; width:38%; margin:0 auto; padding:0px 0 0px 0; text-align:left; } .sub-con .sub-warp .con-Rimg { float:left; width:38%; margin:0 auto; padding:0px 0 0px 0; text-align:right; } .sub-con .sub-warp img {width:90%; height:auto;} .sub-con .sub-warp p.title {margin:0 auto; padding:0px 0 50px 0; width:100%; font-size:25px; font-weight:500; line-height:1.3; } .sub-con .sub-warp .con-inner {float:left; margin:0 auto; padding:0px 10px 0px 10px; width:58%; text-align:left; } .sub-con .con-inner ul {margin:0px 0px 0 30px ;list-style:url(../../img/list-icon.png)} .sub-con .con-inner li {width:100%; padding: 2px 0 2px 0 } .sub-con .con-inner p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:22px; font-weight:500; line-height:1.3; } .sub-con .con-inner p.text {margin:0 auto; padding:0px 0 20px 0; width:100%; } .sub-con .sub-warp .con-inner2 {margin:0 auto; padding:0px 10px 0px 10px; width:99%; text-align:left; } .sub-con .con-inner2 p.title {margin:0 auto; padding:0px 0 30px 0; width:100%; font-size:22px; font-weight:500; line-height:1.3; } .sub-con .con-inner2 p.text {margin:0 auto; padding:0px 0 20px 0; width:100%; } .sub-con .con-inner ul.app-ul {margin:0px 0px 0 0px ;list-style:none; } .sub-con .con-inner ul.app-ul li {position:relative;height:170px;width:30%; float:left; border: 1px solid #DDD; margin:0 auto; text-align:center;} .sub-con .con-inner ul.app-ul li div {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);width:90%;margin:0 auto; } /*.sub-con .con-inner ul.app-ul li i {-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);transform: rotate(180deg);}*/ .sub-con .con-inner ul.app-ul li.arrow {width:3%;padding:4px; border: 0px solid #DDD;background:#ffffff;} .sub-con .con-inner ul.app-ul li.arrow .aw { padding:0px 0 0 0} .sub-con .con-inner>ul.app-ul>li:first-child {background:#f2f2f2;} .sub-con .con-inner>ul.app-ul>li:nth-child(3) {background:#fdfdfd;} .sub-con .con-inner>ul.app-ul>li:last-child {background:#f2f2f2;} .sub-con .con-inner3 {margin:0 auto; padding:30px 0 0px 0; text-align:center; width:100%; overflow:hidden; } .sub-con .con-inner3 ul {margin:0px 0px 0 0px ;list-style:none;} .sub-con .con-inner3 li { position:relative;height:230px;width:14.5%; float:left; border: 1px solid #DDD; margin:0 auto; text-align:center; overflow:hidden; } .sub-con .con-inner3 li div {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);width:90%;margin:0 auto; } .sub-con .con-inner3 li.arrow {width:1%;padding:4px; border: 0px solid #DDD;background:#ffffff;} .sub-con .con-inner3 li.arrow .aw { padding:0px 0 0 0} /*.sub-con .con-inner3 li i {-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);transform: rotate(180deg);}*/ #table1 {display: table; width: 100%; margin:0 auto; text-align:center;} #table1 .row {display: table-row; width: 100%;} #table1 .row-img {display: table-row; width: 100%; } #table1 .cell {display: table-cell; border-bottom: 1px solid #DDD; border-right: 1px solid #DDD;font-size:13px;} #table1 .col1 { width: 10%; display:table-cell; vertical-align:middle;padding: 10px;font-weight:bold; border-left: 1px solid #DDD;} #table1 .col2 {width: 29%; padding: 10px 10px 10px 15px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto;} #table1 .col3 {width: 29%; padding: 10px 10px 10px 15px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto;} #table1 .col4 {width: 29%; padding: 10px 10px 10px 15px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto; } #table1 .first { border-top: 2px solid #DDD; background:#f7f7f7;font-weight:bold; margin:0 auto;text-align:center;} .Contact-con {margin:0 auto; padding:30px 0 20px 0; text-align:center; width:100%; overflow:hidden; } .Contact-con .Contact-warp {width:90%; margin:0 auto; padding:0px 0 0px 0; overflow:hidden;} .Contact-con .Contact-warp .con-Limg { position:relative;float:left; width:100%; height:150px; margin:0 0 30px 0; padding:0px 0 30px 0; text-align:center; background: url("../../img/contactus-m01.jpg") no-repeat ; background-size: cover; } .Contact-con .Contact-warp .con-Limg .title {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; font-size:35px;font-weight:500; color: rgb(255, 255, 255); text-shadow:5px 6px 14px rgba(0, 0, 0, 0.4); margin:0;} .Contact-con .Contact-warp p.title {margin:0 auto; padding:0px 0 30px 0; width:100%; font-size:23px; font-weight:400; line-height:1.3; } .Contact-con .Contact-warp .con-inner {float:left; margin:0 auto; padding:0px 0px 0px 0px; width:100%; text-align:left; } .Contact-con .con-inner ul {width:100%; overflow:hidden; margin:10px 0 0 0px } .Contact-con .con-inner li {width:100%; padding: 3px 0 3px 0 } .Contact-con .con-inner p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:20px; font-weight:500; line-height:20px; } .Contact-con .con-inner p.text {margin:0 auto; padding:0px 0 50px 0; width:100%; padding-bottom:0px; } .Contact-con .Contact-warp .con-inner2 {margin:0 auto; padding:0px 0px 0px 0px; width:100%; text-align:left; } .Contact-con .con-inner2 p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:20px; font-weight:500; line-height:20px; } .Contact-con .con-inner2 p.text {margin:0 auto; padding:0px 0 50px 0; width:100%; padding-bottom:0px; } /******* contact us 구글맵 ***************/ .map-warp {width:100%; padding:80px 0 50px 0;} .map {width:95%; height:500px; margin:0 auto; text-align:center;} } /*********************************** @media screen and (max-width: 980px) ***********************************/ @media only screen and (max-width:980px) { .pc-mode { display:none } .mobile-mode { display:inline-block } .m480-mode { display:none; } /******* 서브페이지 타이틀 공통 **************/ #page-title {width:100%; margin:0 auto; text-align:center; padding:0px 0 30px 0px;} #page-title .line {width:2px; height:30px;margin:0 auto; text-align:center;background:red} #page-title .title {font-size:40px;font-weight:700;} .subTitle {width:90%; margin:0 auto; text-align:center; overflow:hidden; padding:40px 0 0px 0px;} .subTitle .title {font-size:40px;font-weight:500; padding:30px 0 10px 0px;} .subTitle .text {font-size:25px;font-weight:300; padding:0px 0 20px 0px; } .subTitle .Tline {width:500px; height:2px; margin:0 auto; padding: 0 30px 0 0;text-align:center;background:#ededed} .subTitle .Bline {width:2px; height:40px;margin:0 auto; text-align:center;background:red} .Small-paragraph {width:100%;margin:0 auto; text-align:center;} .Small-paragraph .paragraph {width:100%; margin:0 auto; padding:70px 0 50px 0;text-align:center;} .Small-paragraph .paragraph p.title {margin:0 auto; padding:0px 0 30px 0;font-size:28px; font-weight:400; line-height:40px;} .Small-paragraph .paragraph .text { width:80%; margin:0 auto; text-align:center; font-size:18px;font-weight:300; line-height:30px;} /******* qna search ***************/ #search-area .sub-con {margin:0 auto; padding:50px 0px 50px 0px; text-align:center; width:100%; overflow:hidden; } #search-area .sub-con .sub-warp { width:95%; margin:0 auto; padding:0px 0 0px 0; overflow:hidden;} #search .question .icon {width:5%;margin:0; padding:0;} #search .question .title {width:90%;margin:0; padding:0;} #search .question .right {width:5%;margin:0; padding:0;text-align:right;} #search .question i { line-height:48px;padding:0px 0px 0 15px;color: #5bc7fb; font-size: 24px;} #search .question .right i{line-height:48px;padding:0px 15px 0 0px;color: #9d9d9d; font-size: 20px;} #search .question i.off { display:none} #search .question:hover h4 { color: white;} #search .question:hover i { color: white;} #search .question .icon {width:10%;margin:0; padding:0;} #search .question .title {width:80%;margin:0; padding:0;} #search .question .right {width:10%;margin:0; padding:0;text-align:right;} #search .question i { line-height:48px;padding:0px 0px 0 15px;color: #5bc7fb; font-size: 24px;} #search .question .right i{line-height:48px;padding:0px 15px 0 0px;color: #9d9d9d; font-size: 20px;} #search .question i.off { display:none} #search .question:hover h4 { color: white;} #search .question:hover i { color: white;} .search-input { width:100%; margin:0 auto; padding:0px 0 0px 0; overflow:hidden;} .search-input .form-search{display:block;width:63%;padding:10px 10px 10px 50px;float:left; font-size:1rem;color:#55595c;background-color:#fff;background-image:none;border:1px solid #ccc;} .search-input { width:100%; margin:0 auto; padding:0px 0 0px 0; overflow:hidden;text-align:right;} .search-input .form-search{display:block;width:73%;padding:10px 10px 10px 50px; font-size:1rem;color:#55595c;background-color:#fff;background-image:none;border:1px solid #ccc;} .search-input .myHead {position: relative;width:50%; margin:0 0 30px 0;float: right;overflow:hidden;} /******* Dissolution/Liquidation 해산/청산**************/ .Dissolution { overflow:hidden; position:relative; width:100%; margin:0 auto; padding:0px 0 0px 0;} .Dissolution .container { width:95%; margin:0 auto; padding:0px 10px 0px 10px; } .Dissolution .title-warp { margin:0; padding:0px 0 50px 0;} .Dissolution .title-warp .title-box { margin: 0; padding:0; text-align:center} .Dissolution .title-warp .title-box .title { font-size: 28px; position: relative; margin:0; padding:0 0 0px 0; line-height:30px;} .Dissolution .title-warp .title-box .line { position: relative; margin:0; padding:0 0 20px 0; color: #b8b8b8;} .Dissolution .title-warp .title-box .line:before { content: ''; position: absolute; height: 1px; background-color: #d7d7d7; width: 400px; bottom: -4px; left: 50%; transform: translate(-50%, -50%);} .Dissolution .title-warp .title-box .line-mf { width: 40px; height: 5px; margin: 0 auto; background:red } .Dissolution .title-warp .title-box .toptitle { font-weight: 400; font-size: 16px; text-transform: uppercase; color: #858585; margin:0; padding:0 0 0px 0; } .Dissolution .title-warp .title-box .subtitle { position: relative; margin:0; padding:20px 0 0px 0; } .Dissolution h1 { font-size: 36px; padding:0 0 8px 0; } .Dissolution h2 {font-size:24px; padding:0 0 8px 0; } .Dissolution h3 {font-size:22px; padding:0 0 8px 0; } .Dissolution h4 {font-size:20px; padding:0 0 8px 0; } .Dissolution h5 {font-size:18px; padding:0 0 8px 0; } .Dissolution h6 {font-size:17px; padding:0 0 8px 0; } .Dissolution .h7 {font-size:16px; padding:0 0 8px 0; } .Dissolution p { width:100%; margin:0; padding:0px; } .Dissolution p.text { margin:0;padding-bottom:15px; } .Dissolution p.text2 { margin:0;padding-bottom:0px; } .Dissolution .m-top20 {margin-top:20px} .Dissolution .m-top80 {margin-top:80px} .Dissolution .img-right {float:right;margin-left:0em;margin-bottom:1em; margin-top:10px} .Dissolution .img-left {float:left;margin-right:0em;margin-bottom:1em; margin-top:10px} .Dissolution .img-center {margin:0; padding:20px 0; text-align:center;} .Dissolution img.width400 {width:100%} .Dissolution img.width700 {width:100%} .Dissolution i {padding:0 10px 0 0; } .Dissolution ul.list-type2 {list-style-type: none;width:98%;padding: 0; padding-bottom: 7px; } .Dissolution ul.list-type2>li {position: relative;width:100%; padding-bottom: 0px; } .Dissolution ul.list-type2>li>p {padding-left:10px;margin-bottom:0;line-height:23px;} .Dissolution .list-warp>ul.list-type2>li>p {padding-left:15px;margin-bottom:0;line-height:23px;} .Dissolution ul.list-type2>li:before{position: absolute;display: inline-block;vertical-align: middle;margin:0; padding: 10px; line-height:5px;} .Dissolution ul.list-type2>li::before{content: "•"; color:#818181;} /******* 서브페이지 About Us **************/ #sub-greeting {position:relative; width:100%; overflow:hidden} #sub-greeting:before{position:absolute; top:0px; left:0px; content:""; width:100%; height:250px; background-color:#ececec;} #sub-greeting #Inner {margin:0 auto;padding:0; text-align:center; width:95%; } #sub-greeting #Inner .right-con {float:left; width:100%;} #sub-greeting #Inner .right-inner { margin display:block; position:relative; font-size:15px; padding:30px 0 30px 0px; margin:0 auto; text-align:center; } #sub-greeting #Inner .right-con .right-inner:before{position:absolute; top:40px; left:50px;display:inline-block; content:""; width:94px; height:3px; background-color:#fff;} #sub-greeting #Inner .right-con .sub-tit{ margin:0px 0px 0px 160px;padding:0; font-size:15px; text-align:left;} #sub-greeting #Inner .right-con .greetings-tit {font-size:45px; width:100%;font-weight:300; letter-spacing:-1.0px;text-align:center; padding:25px 0 0 0 ;} #sub-greeting #Inner .right-con .greetings-tit b {font-weight:700;} #sub-greeting #Inner .right-con .greetings-tit2 {font-size:35px; width:100%;font-weight:100; letter-spacing:-1.0px; text-align:center; padding:8px 0px 0 0px ;} #sub-greeting #Inner .right-con .greetings-txt {font-size:20px; width:100%;line-height:30px; font-weight:300; letter-spacing:-0.5px;text-align:center; padding:20px 0 0px 0; } #sub-greeting #Inner .right-con .greetings {margin:0 auto; padding:70px 0 50px 0; width:90%; text-align:left;} #sub-greeting #Inner .right-con .greetings p.title {margin:0 auto; padding:0px 0 40px 0; width:100%; font-size:30px; font-weight:400;line-height:1.3; text-align:center;} #sub-greeting #Inner .right-con .greetings .text {text-align:center;} #sub-greeting #Inner .right-con .mobile-img {position:relative; width:100%; height:250px; margin:20px 0 0 0; background: url("../../img/aboutus-m01.jpg") no-repeat ; background-size: cover; } #sub-greeting #Inner .right-con .mobile-img img {width:100%; margin:0px 0 0 0;} #sub-greeting #Inner .right-con .mobile-img .title {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; font-size:30px;font-weight:500; line-height:55px;color: rgb(255, 255, 255); text-shadow:5px 6px 14px rgba(0, 0, 0, 0.4); margin:0;} /******* VISION & MISSION**************/ #vision-warp {width:100%; overflow:hidden; margin:0 auto; padding:30px 0 0px 0; background:#fbfbfb;} .vision-con {width:100%; height:500px; margin:0 auto; padding:0; text-align:center;} .vision-con h3 {font-size:40px; font-weight:700;margin:0 0 20px 0} .vision-con > p{font-size: 25px;line-height: 30px; margin:0 0 50px 0} .vision {position:relative; width:100%; margin:0 auto; text-align:center;} .vision .m-con {position:absolute; width:33%;height:250px;background-repeat:no-repeat;background-size:60%;background-position: center;} .vision .m-con img {width:30px;} .vision .m-con.vision{background-image:url(../../img/bg_vision.png);left:25%;margin-left:0px;} .vision .m-con.mission{background-image:url(../../img/bg_mission.png);right:25%;margin-right:0px;} .vision .m-con.target{background-image:url(../../img/bg_target.png);left:33%;margin-left:0px;} .vision .m-con.vision{margin-left:0px;} .vision .m-con.mission{margin-right:0px; margin-top:0px;} .vision .m-con.target{margin-left:0px; margin-top:150px;} .vision .m-con .txt_box{position:absolute;width:100%;text-align:center;top:40%;color:#fff;} .vision .m-con .txt_box span{display:block;font-size:30px;line-height:16px;font-weight:bold;margin-top:25px;} .vision .m-con .txt_box p{font-size:40px;line-height:50px;font-weight:500;} .vision .m-con .tabtext{top:30%;width:100%;font-size:20px; font-weight:500; line-height:25px;position:absolute;background-repeat:no-repeat;box-sizing:border-box;} .vision .m-con.target .tabtext1, .vision .m-con.target .tabtext2{text-align:left;top:50%;width:350px;font-size:15px; font-weight:300; line-height:20px;position:absolute;background-repeat:no-repeat;box-sizing:border-box;} .vision .m-con.target p span{font-size:20px;font-weight:500;} .vision .m-con.vision .tabtext{padding:0 80px 0 0;background-image:url(../../img/v_bar.png);background-position:right center;right:230px;} .vision .m-con.mission .tabtext{padding:0 0px 0 80px;background-image:url(../../img/v_bar2.png);background-position:left center;left:230px;} .vision .m-con.target .tabtext1{padding:0 100px 0 0px;;background-image:url(../../img/v_bar.png);background-position:right center;right:180px;bottom:0px} .vision .m-con.target .tabtext2{padding:0 0px 0 100px;;background-image:url(../../img/v_bar2.png);background-position:left center;left:180px;bottom:0px} /******* 서브페이지 슬로건 공통 **************/ #sub-Slogan {position:relative; width:100%; overflow:hidden} #sub-Slogan:before{position:absolute; top:0px; left:0px; content:""; width:100%; height:220px; background-color:#ececec;} #sub-Slogan #Inner {position:relative; margin:0 auto;padding:0; text-align:center; width:100%; } #sub-Slogan #Inner .right-con {float:left; width:100%;margin:0 auto;padding:0px 0 0 0} #sub-Slogan #Inner .right-inner {display:block; position:relative; font-size:15px; padding:30px 0 30px 0px; margin:0 auto; text-align:center; } #sub-Slogan #Inner .right-con .right-inner:before{position:absolute; top:40px; left:0px;display:inline-block; content:""; width:50px; height:3px; background-color:#fff;} #sub-Slogan #Inner .right-con .sub-tit{ margin:0px 0px 0px 70px;padding:0; font-size:14px; text-align:left;} #sub-Slogan #Inner .right-con .greetings-tit {font-size:43px; width:100%;font-weight:300; letter-spacing:-2.0px; padding:15px 0 0 0;} #sub-Slogan #Inner .right-con .greetings-tit b {font-weight:700;} #sub-Slogan #Inner .right-con .greetings-txt {font-size:20px; width:100%;line-height:25px; font-weight:300; letter-spacing:-0.5px; padding:10px 0 0px 0; } #sub-Slogan #Inner .right-con .greetings {margin:0 auto; padding:70px 0 0px 0; width:90%; text-align:center;} #sub-Slogan #Inner .right-con .greetings .title-warp span.top-img img {width:30px; margin:0px 0 10px 0} #sub-Slogan #Inner .right-con .greetings .title-warp span.bottom-img img {width:30px;margin:10px 0px 0 0} #sub-Slogan #Inner .right-con .greetings .title-warp p.title {margin:0 auto; padding:0px 0 0px 0; width:100%; font-size:34px; font-weight:500; line-height:45px; text-align:center;} #sub-Slogan #Inner .right-con .greetings .text {margin:0 auto; width:100%; padding:0px 0 20px 0; text-align:center;font-size:19px;font-weight:300; line-height:30px;} #sub-Slogan #Inner .right-con .greetings .text2 {margin:0 auto; width:100%; padding:20px 0 40px 0; text-align:center;font-size:18px;font-weight:300; line-height:30px;} #table1 {display: table; width: 99%; margin:0 auto; text-align:center;} .Contact-con {margin:0 auto; padding:30px 0 20px 0; text-align:center; width:100%; overflow:hidden; } .Contact-con .Contact-warp {width:90%; margin:0 auto; padding:0px 0 0px 0; overflow:hidden;} .Contact-con .Contact-warp .con-Limg { position:relative;float:left; width:100%; height:150px; margin:0 0 30px 0; padding:0px 0 30px 0; text-align:center; background: url("../../img/contactus-m01.jpg") no-repeat ; background-size: cover; } .Contact-con .Contact-warp .con-Limg .title {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; font-size:26px;font-weight:500; color: rgb(255, 255, 255); text-shadow:5px 6px 14px rgba(0, 0, 0, 0.4); margin:0;} .Contact-con .Contact-warp p.title {margin:0 auto; padding:0px 0 30px 0; width:100%; font-size:23px; font-weight:400; line-height:1.3; } .Contact-con .Contact-warp .con-inner {float:left; margin:0 auto; padding:0px 0px 0px 0px; width:100%; text-align:left; } .Contact-con .con-inner ul {width:100%; overflow:hidden; margin:10px 0 0 0px } .Contact-con .con-inner li {width:100%; padding: 3px 0 3px 0 } .Contact-con .con-inner p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:20px; font-weight:500; line-height:20px; } .Contact-con .con-inner p.text {margin:0 auto; padding:0px 0 50px 0; width:100%; padding-bottom:0px; } .Contact-con .Contact-warp .con-inner2 {margin:0 auto; padding:0px 0px 0px 0px; width:100%; text-align:left; } .Contact-con .con-inner2 p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:20px; font-weight:500; line-height:20px; } .Contact-con .con-inner2 p.text {margin:0 auto; padding:0px 0 50px 0; width:100%; padding-bottom:0px; } .sub-con .con-inner ul.app-ul {margin:0px 0px 0 0px ;list-style:none; } .sub-con .con-inner ul.app-ul li {position:relative;height:170px;width:29%; float:left; border: 1px solid #DDD; margin:0 auto; text-align:center;} .sub-con .con-inner ul.app-ul li div {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);width:90%;margin:0 auto; } /*.sub-con .con-inner ul.app-ul li i {-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);transform: rotate(180deg);}*/ .sub-con .con-inner ul.app-ul li.arrow {width:3%;padding:4px; border: 0px solid #DDD;background:#ffffff;} .sub-con .con-inner ul.app-ul li.arrow .aw { padding:0px 0 0 0} .sub-con .con-inner>ul.app-ul>li:first-child {background:#f2f2f2;} .sub-con .con-inner>ul.app-ul>li:nth-child(3) {background:#fdfdfd;} .sub-con .con-inner>ul.app-ul>li:last-child {background:#f2f2f2;} .sub-con .con-inner3 {margin:0 auto; padding:30px 0 0px 0; text-align:center; width:100%; overflow:hidden; } .sub-con .con-inner3 ul {margin:0px 0px 0 0px ;list-style:none;} .sub-con .con-inner3 li { position:relative;height:250px;width:14.8%; float:left; border: 1px solid #DDD; margin:0 auto; text-align:center; overflow:hidden; } .sub-con .con-inner3 li div {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);width:90%;margin:0 auto; } .sub-con .con-inner3 li.arrow {width:1%;padding:4px; border: 0px solid #DDD;background:#ffffff;} .sub-con .con-inner3 li.arrow .aw { padding:0px 0 0 0} /*.sub-con .con-inner3 li i {-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);transform: rotate(180deg);}*/ .text-con2 {position:relative; overflow:hidden; width: 100%; margin: 0 auto; padding: 30px 0 30px 0 ; text-align:center; } .text-con2 .con2-warp {width:99%;overflow:hidden;border: 1px solid #DDD;margin:0 auto; text-align:center;} .text-con2 .con2-warp .table-title {width:100%;height:50px;background:#e5e5e5;border: 1px solid #DDD;margin:0 auto; text-align:center;line-height:50px; font-weight:400;} .text-con2 p {width:90%;font-size:12px;margin:0 auto; text-align:center;padding:20px 0 0 0;} #table6 {width: 100%; margin:0 auto; text-align:center; } #table6 .cell {width: 49.5%; display:table-cell;float:left; padding: 0px; font-size:14px; font-weight:300; margin:0 auto;display:} #table6 .first { border-right: 1px solid #DDD; margin:0 auto;text-align:center;} #table6 .cell ol {list-style:decimal;margin:20px 10px 0px 40px;text-align:left;padding: 0px;} #table6 .cell ol.bottom {list-style:decimal;margin:0px 10px 20px 40px;text-align:left;padding: 0px;} #table6 .cell ol li {width:100%;text-align:left; line-height:25px;} } /*********************************** @media screen and (max-width: 768px) ***********************************/ @media only screen and (max-width:768px) { .pc-mode { display:none } .mobile-mode { display:inline-block } .m480-mode { display:none; } /******* 서브페이지 타이틀 공통 **************/ #page-title {width:100%; margin:0 auto; text-align:center; padding:0px 0 30px 0px;} #page-title .line {width:2px; height:30px;margin:0 auto; text-align:center;background:red} #page-title .title {font-size:38px;font-weight:700;} .subTitle {width:95%; margin:0 auto; text-align:center; overflow:hidden; padding:40px 0 0px 0px;} .subTitle .title {font-size:35px;font-weight:500; padding:30px 0 10px 0px; line-height:50px;} .subTitle .text {font-size:22px;font-weight:300; padding:0px 0 20px 0px; } .subTitle .Tline {width:500px; height:2px; margin:0 auto; padding: 0 30px 0 0;text-align:center;background:#ededed} .subTitle .Bline {width:2px; height:40px;margin:0 auto; text-align:center;background:red} .Small-paragraph {width:100%;margin:0 auto; text-align:center;} .Small-paragraph .paragraph {width:90%; margin:0 auto; padding:70px 0 50px 0;text-align:center;} .Small-paragraph .paragraph p.title {margin:0 auto; padding:0px 0 30px 0;font-size:28px; font-weight:400; line-height:40px;} .Small-paragraph .paragraph .text { width:80%; margin:0 auto; text-align:center; font-size:18px;font-weight:300; line-height:30px;} /******* 서브페이지 컨텐츠 공통 **************/ .sub-con {margin:0 auto; padding:30px 0 20px 0; text-align:center; width:100%; overflow:hidden; } .sub-con .sub-warp { width:90%; margin:0 auto; padding:0px 0 0px 0; overflow:hidden;} .sub-con .sub-warp .con-Limg { float:left; width:100%; margin:0 auto; padding:0px 0 30px 0; text-align:center; } .sub-con .sub-warp .con-Rimg { float:left; width:100%; margin:0 auto; padding:0px 0 0px 0; text-align:center; } .sub-con .sub-warp img {width:100%; height:300px;} .sub-con .sub-warp p.title {margin:0 auto; padding:0px 0 50px 0; width:100%; font-size:25px; font-weight:500; line-height:1.3; } .sub-con .sub-warp .con-inner {float:left; margin:0 auto; padding:0px 0px 0px 0px; width:100%; text-align:left; } .sub-con .con-inner ul {margin:20px 0px 0 30px ;list-style:url(../../img/list-icon.png)} .sub-con .con-inner li {width:100%; padding: 3px 0 3px 0 } .sub-con .con-inner p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:20px; font-weight:500; line-height:20px; } .sub-con .con-inner p.text {margin:0 auto; padding:0px 0 0px 0; width:100%;p } .sub-con .sub-warp .con-inner2 {margin:0 auto; padding:0px 0px 0px 0px; width:100%; text-align:left; } .sub-con .con-inner2 p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:20px; font-weight:500; line-height:20px; } .sub-con .con-inner2 p.text {margin:0 auto; padding:0px 0 0px 0; width:100%;} .sub-con .con-inner ul.app-ul {margin:0px 0px 0 0px ;list-style:none; } .sub-con .con-inner ul.app-ul li {position:relative;height:170px;width:29%; float:left; border: 1px solid #DDD; margin:0 auto; text-align:center;} .sub-con .con-inner ul.app-ul li div {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);width:90%;margin:0 auto; } /*.sub-con .con-inner ul.app-ul li i {-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);transform: rotate(180deg);}*/ .sub-con .con-inner ul.app-ul li.arrow {width:3%;padding:4px; border: 0px solid #DDD;background:#ffffff;} .sub-con .con-inner ul.app-ul li.arrow .aw { padding:0px 0 0 0} .sub-con .con-inner>ul.app-ul>li:first-child {background:#f2f2f2;} .sub-con .con-inner>ul.app-ul>li:nth-child(3) {background:#fdfdfd;} .sub-con .con-inner>ul.app-ul>li:last-child {background:#f2f2f2;} .sub-con .con-inner3 {margin:0 auto; padding:30px 0 0px 0; text-align:center; width:100%; overflow:hidden; } .sub-con .con-inner3 ul {margin:0px 0px 0 0px ;list-style:none;} .sub-con .con-inner3 li { position:relative;height:200px;width:30%; float:left; border: 1px solid #DDD; margin:0 auto; text-align:center; overflow:hidden; } .sub-con .con-inner3 li div {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);width:90%;margin:0 auto; } .sub-con .con-inner3 li.arrow {width:1%;padding:4px; border: 0px solid #DDD;background:#ffffff;} .sub-con .con-inner3 li.arrow .aw { padding:0px 0 0 0} /*.sub-con .con-inner3 li i {-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);transform: rotate(180deg);}*/ /******* 서브페이지 About Us **************/ #sub-greeting {position:relative; width:100%; overflow:hidden} #sub-greeting:before{position:absolute; top:0px; left:0px; content:""; width:100%; height:230px; background-color:#ececec;} #sub-greeting #Inner {margin:0 auto;padding:0; text-align:center; width:95%; } #sub-greeting #Inner .right-con {float:left; width:100%;} #sub-greeting #Inner .right-inner { margin display:block; position:relative; font-size:15px; padding:30px 0 30px 0px; margin:0 auto; text-align:center; } #sub-greeting #Inner .right-con .right-inner:before{position:absolute; top:40px; left:50px;display:inline-block; content:""; width:94px; height:3px; background-color:#fff;} #sub-greeting #Inner .right-con .sub-tit{ margin:0px 0px 0px 160px;padding:0; font-size:15px; text-align:left;} #sub-greeting #Inner .right-con .greetings-tit {font-size:34px; width:100%;font-weight:300; letter-spacing:-1.0px;text-align:center; padding:25px 0 0 0 ;} #sub-greeting #Inner .right-con .greetings-tit b {font-weight:700;} #sub-greeting #Inner .right-con .greetings-tit2 {font-size:30px; width:100%;font-weight:100; letter-spacing:-1.0px; text-align:center; padding:0px 0px 0 0px ;} #sub-greeting #Inner .right-con .greetings-txt {font-size:18px; width:100%;line-height:25px; font-weight:300; letter-spacing:-0.5px;text-align:center; padding:20px 0 0px 0; } #sub-greeting #Inner .right-con .greetings {margin:0 auto; padding:50px 0 30px 0; width:100%; text-align:left;} #sub-greeting #Inner .right-con .greetings p.title {margin:0 auto; padding:0px 0 40px 0; width:100%; font-size:25px; font-weight:400;line-height:1.3; text-align:center;} #sub-greeting #Inner .right-con .greetings .text { text-align:center;} #sub-greeting #Inner .right-con .mobile-img {position:relative; width:100%; height:250px; margin:20px 0 0 0; background: url("../../img/aboutus-m01.jpg") no-repeat ; background-size: cover; } #sub-greeting #Inner .right-con .mobile-img img {width:100%; margin:0px 0 0 0;} #sub-greeting #Inner .right-con .mobile-img .title {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; font-size:25px;font-weight:500; color: rgb(255, 255, 255); text-shadow:5px 6px 14px rgba(0, 0, 0, 0.4); margin:0;} /******* aboutus.php Advantage**************/ #Advantagecon {width:100%;margin:0 auto; padding:0px 0 60px 0;background-repeat:no-repeat;background-position:center top; background:#fbfbfb; } #Advantagecon .Advantage {overflow:hidden;width:95%;margin:0 auto;padding:0;} .Advantage .line_obj {position:relative;width:100%;overflow:hidden;margin:0 auto;padding:0;} .Advantage .line_obj li {float:left;position:relative;width:49%; margin:0 auto; } .Advantage .line_obj li.obj01{ margin:0px 10px 0 0; padding-top:50px} .Advantage .line_obj li.obj02{ margin:0 0px 0 0; padding-top:50px} .Advantage .line_obj li.obj03{margin:0 10px 0 0; padding-top:50px} .Advantage .line_obj li.obj04{ margin:0 0px 0 0; padding-top:50px} .Advantage .line_obj .txt{width:100%;text-align:center;} .Advantage .line_obj .thumb {text-align:center} .Advantage .line_obj .thumb img{width:50%} .Advantage .line_obj .txt01{font-size:22px;font-weight:400;color:#333;line-height:36px; padding:20px 0 10px 0;} .Advantage .line_obj .txt02{font-size:15px; padding:0px 20px 0px 20px;} /******* VISION & MISSION**************/ #vision-warp {width:100%; overflow:hidden; margin:0 auto; padding:30px 0 0px 0; background:#fbfbfb;} .vision-con {width:80%; height:980px; margin:0 auto; padding:0; text-align:center;} .vision-con h3 {font-size:40px; font-weight:700;margin:0 0 20px 0} .vision-con > p{font-size: 25px;line-height: 30px; margin:0 0 50px 0} .vision {position:relative; width:100%; margin:0 auto; text-align:center;} .vision .m-con {position:relative; width:100%;height:250px;background-repeat:no-repeat;background-size:35%;background-position: center left;} .vision .m-con img {width:30px;} .vision .m-con.vision{background-image:url(../../img/bg_vision.png);left:0%;margin-left:0px;} .vision .m-con.mission{background-image:url(../../img/bg_mission.png);left:0%;margin-right:0px;} .vision .m-con.target{background-image:url(../../img/bg_target.png);left:0%;margin-left:0px;} .vision .m-con.vision{margin-left:0px;} .vision .m-con.mission{margin-right:0px; margin-top:0px;} .vision .m-con.target{margin-left:0px; margin-top:0px;} .vision .m-con .txt_box{position:absolute;width:35%;text-align:center;top:38%;color:#fff;} .vision .m-con .txt_box span{display:block;font-size:30px;line-height:16px;font-weight:bold;margin-top:25px;} .vision .m-con .txt_box p{font-size:45px;line-height:50px;font-weight:500;} .vision .m-con .tabtext{top:40%;width:100%;font-size:20px; font-weight:500; line-height:25px;position:absolute;background-repeat:no-repeat;box-sizing:border-box;} .vision .m-con.target .tabtext1, .vision .m-con.target .tabtext2{text-align:left;top:10%;width:400px;font-size:15px; font-weight:300; line-height:20px;position:absolute;background-repeat:no-repeat;box-sizing:border-box;} .vision .m-con.target p span{font-size:20px;font-weight:500;} .vision .m-con.vision .tabtext{padding:0 80px 0 0;background-image:url(../../img/v_bar2.png);background-position:left center;left:200px;} .vision .m-con.mission .tabtext{padding:0 80px 0 0px;background-image:url(../../img/v_bar2.png);background-position:left center;left:200px;} .vision .m-con.target .tabtext1{padding:0 0px 0 90px;;background-image:url();background-position:right center;left:200px;bottom:0px} .vision .m-con.target .tabtext2{padding:200px 0px 0 90px;;background-image:url(../../img/v_bar2.png);background-position:left center;left:200px;bottom:30px} /******* 서브페이지 슬로건 공통 **************/ #sub-Slogan {position:relative; width:100%; overflow:hidden} #sub-Slogan:before{position:absolute; top:0px; left:0px; content:""; width:100%; height:210px; background-color:#ececec;} #sub-Slogan #Inner {position:relative; margin:0 auto;padding:0; text-align:center; width:100%; } #sub-Slogan #Inner .right-con {float:left; width:100%;margin:0 auto;padding:0px 0 0 0} #sub-Slogan #Inner .right-inner {display:block; position:relative; font-size:15px; padding:30px 0 30px 0px; margin:0 auto; text-align:center; } #sub-Slogan #Inner .right-con .right-inner:before{position:absolute; top:40px; left:0px;display:inline-block; content:""; width:50px; height:3px; background-color:#fff;} #sub-Slogan #Inner .right-con .sub-tit{ margin:0px 0px 0px 70px;padding:0; font-size:14px; text-align:left;} #sub-Slogan #Inner .right-con .greetings-tit {font-size:43px; width:100%;font-weight:300; letter-spacing:-2.0px; padding:15px 0 0 0;} #sub-Slogan #Inner .right-con .greetings-tit b {font-weight:700;} #sub-Slogan #Inner .right-con .greetings-txt {font-size:20px; width:100%;line-height:25px; font-weight:300; letter-spacing:-0.5px; padding:10px 0 0px 0; } #sub-Slogan #Inner .right-con .greetings {margin:0 auto; padding:70px 0 0px 0; width:90%; text-align:center;} #sub-Slogan #Inner .right-con .greetings .title-warp span.top-img img {width:30px; margin:0px 0 10px 0} #sub-Slogan #Inner .right-con .greetings .title-warp span.bottom-img img {width:30px;margin:10px 0px 0 0} #sub-Slogan #Inner .right-con .greetings .title-warp p.title {margin:0 auto; padding:0px 0 0px 0; width:100%; font-size:35px; line-height:50px; font-weight:400;text-align:center;} #sub-Slogan #Inner .right-con .greetings .text {margin:0 auto; width:100%; padding:10px 0 30px 0; text-align:center;font-size:17px;font-weight:300; line-height:30px;} #sub-Slogan #Inner .right-con .greetings .text2 {margin:0 auto; width:100%; padding:0px 0 30px 0; text-align:center;font-size:17px;font-weight:300; line-height:30px;} #table1 {display: table; width: 99%; margin:0 auto; text-align:center;} .Contact-con {margin:0 auto; padding:30px 0 20px 0; text-align:center; width:100%; overflow:hidden; } .Contact-con .Contact-warp {width:90%; margin:0 auto; padding:0px 0 0px 0; overflow:hidden;} .Contact-con .Contact-warp .con-Limg { position:relative;float:left; width:100%; height:150px; margin:0 0 30px 0; padding:0px 0 30px 0; text-align:center; background: url("../../img/contactus-m01.jpg") no-repeat ; background-size: cover; } .Contact-con .Contact-warp .con-Limg .title {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; font-size:25px;font-weight:500; color: rgb(255, 255, 255); text-shadow:5px 6px 14px rgba(0, 0, 0, 0.4); margin:0;} .Contact-con .Contact-warp p.title {margin:0 auto; padding:0px 0 30px 0; width:100%; font-size:23px; font-weight:400; line-height:1.3; } .Contact-con .Contact-warp .con-inner {float:left; margin:0 auto; padding:0px 0px 0px 0px; width:100%; text-align:left; } .Contact-con .con-inner ul {width:100%; overflow:hidden; margin:10px 0 0 0px } .Contact-con .con-inner li {width:100%; padding: 3px 0 3px 0 } .Contact-con .con-inner p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:20px; font-weight:500; line-height:20px; } .Contact-con .con-inner p.text {margin:0 auto; padding:0px 0 50px 0; width:100%; padding-bottom:0px; } .Contact-con .Contact-warp .con-inner2 {margin:0 auto; padding:0px 0px 0px 0px; width:100%; text-align:left; } .Contact-con .con-inner2 p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:20px; font-weight:500; line-height:20px; } .Contact-con .con-inner2 p.text {margin:0 auto; padding:0px 0 50px 0; width:100%; padding-bottom:0px; } .text-con2 {position:relative; overflow:hidden; width: 100%; margin: 0 auto; padding: 30px 0 30px 0 ; text-align:center; } .text-con2 .con2-warp {width:99%;overflow:hidden;border: 1px solid #DDD;margin:0 auto; text-align:center;} .text-con2 .con2-warp .table-title {width:100%;height:50px;background:#e5e5e5;border: 1px solid #DDD;margin:0 auto; text-align:center;line-height:50px; font-weight:400;} .text-con2 p {width:90%;font-size:12px;margin:0 auto; text-align:center;padding:20px 0 0 0;} #table6 {width: 100%; margin:0 auto; text-align:center; } #table6 .cell {width: 100%; display:table-cell;float:left; padding: 0px; font-size:14px; font-weight:300; margin:0 auto;display:} #table6 .first { border-right: 1px solid #DDD; margin:0 auto;text-align:center;} #table6 .cell ol {list-style:decimal;margin:20px 10px 0px 40px;text-align:left;padding: 0px;} #table6 .cell ol.bottom {list-style:decimal;margin:0px 10px 20px 40px;text-align:left;padding: 0px;} #table6 .cell ol li {width:100%;text-align:left; line-height:25px;} #table2 {display: table; width: 100%; margin:0 auto; text-align:center;} #table2 .row {display: table-row; width: 100%;} #table2 .row-img {display: table-row; width: 100%; } #table2 .cell {display: table-cell; border-bottom: 1px solid #DDD; border-right: 1px solid #DDD;font-size:13px;} #table2 .col1 { width: 10%; display:table-cell; vertical-align:middle;padding: 10px;font-weight:bold; border-left: 1px solid #DDD;background:#f7f7f7;} #table2 .col2 {width: 29%; padding: 10px 10px 10px 15px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto; text-align:left;} #table2 .col3 {width: 29%; padding: 10px 10px 10px 15px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto;} #table2 .col4 {width: 29%; padding: 10px 10px 10px 15px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto; } #table2 .first { border-top: 1px solid #1269ca; font-weight:bold; margin:0 auto;} #table4 {display: table; width: 100%; margin:20px auto; text-align:left;} /******* contact us 구글맵 ***************/ .map-warp {width:100%; margin:0 auto; padding:30px 0 50px 0;} .map {width:90%; height:400px; margin:0 auto; text-align:center;} } /*********************************** @media screen and (max-width: 480px) ***********************************/ @media only screen and (max-width:480px) { .pc-mode { display:none } .mobile-mode { display:inline-block } .m480-mode { display:inline-block } /******* 서브페이지 타이틀 공통 **************/ #page-title {width:100%; margin:0 auto; text-align:center; padding:0px 0 30px 0px;} #page-title .line {width:2px; height:20px;margin:0 auto; text-align:center;background:red} #page-title .title {font-size:26px;font-weight:700;padding:10px 0 0 0} .subTitle {width:90%; margin:0 auto; text-align:center; padding:20px 0 0px 0px;} .subTitle .title {font-size:28px;font-weight:700; padding:30px 0 10px 0px; letter-spacing:0px; line-height:38px;} .subTitle .text {font-size:18px;font-weight:300; padding:0px 0 10px 0px; line-height:25px;} .subTitle .Tline {width:300px; height:2px; margin:0 auto; padding: 0;text-align:center;background:#ededed} .subTitle .Bline {width:2px; height:30px;margin:0 auto; text-align:center;background:red} .Small-paragraph {width:100%;margin:0 auto; text-align:center;} .Small-paragraph .paragraph {width:90%; margin:0 auto; padding:70px 0 50px 0;text-align:center;} .Small-paragraph .paragraph p.title {margin:0 auto; padding:0px 0 30px 0;font-size:25px; font-weight:400; line-height:33px;} .Small-paragraph .paragraph .text { width:100%; margin:0 auto; text-align:center; font-size:16px;font-weight:300; line-height:25px;} /******* 서브페이지 슬로건 공통 **************/ #sub-Slogan {position:relative; width:100%; overflow:hidden} #sub-Slogan:before{position:absolute; top:0px; left:0px; content:""; width:100%; height:190px; background-color:#ececec;} #sub-Slogan #Inner {position:relative; margin:0 auto;padding:0; text-align:center; width:100%; } #sub-Slogan #Inner .right-con {float:left; width:100%;margin:0 auto;padding:0} #sub-Slogan #Inner .right-inner { margin display:block; position:relative; font-size:15px; padding:30px 0 30px 0px; margin:0 auto; text-align:center; } #sub-Slogan #Inner .right-con .right-inner:before{position:absolute; top:40px; left:0px;display:inline-block; content:""; width:50px; height:3px; background-color:#fff;} #sub-Slogan #Inner .right-con .sub-tit{ margin:0px 0px 0px 70px;padding:0; font-size:14px; text-align:left;} #sub-Slogan #Inner .right-con .greetings-tit {font-size:32px; width:100%;font-weight:300; letter-spacing:0px; padding:15px 0 15px 0;} #sub-Slogan #Inner .right-con .greetings-tit b {font-weight:700;} #sub-Slogan #Inner .right-con .greetings-txt {font-size:17px; width:100%;line-height:25px; font-weight:300; letter-spacing:-0.5px; padding:0px 0 0px 0; } #sub-Slogan #Inner .right-con .greetings {margin:0 auto; padding:20px 0 0px 0; width:90%; text-align:center;} #sub-Slogan #Inner .right-con .greetings .title-warp span.top-img img {width:30px; margin:0 0 10px 0} #sub-Slogan #Inner .right-con .greetings .title-warp span.bottom-img img {width:30px;margin:10px 0px 0 0} #sub-Slogan #Inner .right-con .greetings .title-warp p.title {margin:0 auto; padding:0px 0 0px 0; width:100%; font-size:24px; line-height:35px; font-weight:400;text-align:center;} #sub-Slogan #Inner .right-con .greetings .text {margin:0 auto; width:100%; padding:10px 0 0px 0; text-align:center;font-size:16px;font-weight:300; line-height:22px;} #sub-Slogan #Inner .right-con .greetings .text2 {margin:0 auto; width:100%; padding:0px 0 0px 0; text-align:center;font-size:16px;font-weight:300; line-height:22px;} /****************************************** 서브페이지 About Us ******************************************************/ /******* greeting**************/ #sub-greeting {position:relative; width:100%; margin:0 auto;padding:0; overflow:hidden} #sub-greeting:before{position:absolute; top:0px; left:0px; content:""; width:100%; height:170px; background-color:#ececec;} #sub-greeting #Inner {margin:0 auto;padding:0; text-align:center; width:100%; } #sub-greeting #Inner .right-con {float:left; width:100%;margin:0 auto;padding:0} #sub-greeting #Inner .right-inner { margin display:block; position:relative; font-size:15px; padding:20px 0 30px 0px; margin:0 auto; text-align:center; } #sub-greeting #Inner .right-con .right-inner:before{position:absolute; top:28px; left:0px;display:inline-block; content:""; width:50px; height:3px; background-color:#fff;} #sub-greeting #Inner .right-con .sub-tit{ margin:0px 0px 0px 60px;padding:0; font-size:12px; text-align:left;} #sub-greeting #Inner .right-con .greetings-tit {font-size:25px; width:100%;font-weight:300; letter-spacing:-1.5px; padding:20px 0 0px 0;line-height:30px;} #sub-greeting #Inner .right-con .greetings-tit b {font-weight:700;} #sub-greeting #Inner .right-con .greetings-tit2 {font-size:23px; width:100%;font-weight:100; letter-spacing:-1.5px; text-align:center; padding:8px 0px 0 0px ;} #sub-greeting #Inner .right-con .greetings-txt {font-size:16px; width:100%;line-height:20px; font-weight:300; letter-spacing:-0.5px; padding:20px 0 0px 0; } #sub-greeting #Inner .right-con .greetings {margin:0 auto; padding:30px 0px 0px 0px; width:90%; text-align:center;} #sub-greeting #Inner .right-con .greetings p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:24px; font-weight:400; line-height:30px; text-align:center;} #sub-greeting #Inner .right-con .greetings .text {text-align:left;} #sub-greeting #Inner .right-con .mobile-img {width:100%; height:150px; margin:20px 0 0 0; background: url("../../img/aboutus-m01.jpg") no-repeat ; background-size: cover; } #sub-greeting #Inner .right-con .mobile-img img {width:100%; margin:0px 0 0 0;} #sub-greeting #Inner .right-con .mobile-img .title {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:80%;line-height:25px; font-size:20px;font-weight:500; color: rgb(255, 255, 255); text-shadow:5px 6px 14px rgba(0, 0, 0, 0.4); margin:0;} /******* aboutus.php Advantage**************/ #Advantagecon {width:100%;margin:0 auto; padding:0px 0 30px 0;background-repeat:no-repeat;background-position:center top; background:#fbfbfb; } #Advantagecon .Advantage {overflow:hidden;width:95%;margin:0 auto;padding:0;} .Advantage .line_obj {position:relative;width:100%;overflow:hidden;margin:0 auto;padding:0;} .Advantage .line_obj li {float:left;position:relative;width:100%; margin:0 auto; } .Advantage .line_obj li.obj01{ margin:0px 0px 0 0; padding-top:30px} .Advantage .line_obj li.obj02{ margin:0 0px 0 0; padding-top:30px} .Advantage .line_obj li.obj03{margin:0 0px 0 0; padding-top:30px} .Advantage .line_obj li.obj04{ margin:0 0px 0 0; padding-top:30px} .Advantage .line_obj .txt{width:90%;margin:0 auto;text-align:center;} .Advantage .line_obj .thumb {text-align:center} .Advantage .line_obj .thumb img{width:50%} .Advantage .line_obj .txt01{font-size:22px;font-weight:700;color:#333;line-height:30px; padding:20px 0 10px 0;} .Advantage .line_obj .txt02{font-size:15px; padding:0px 20px 0px 20px;} /******* VISION & MISSION**************/ #vision-warp {width:100%; overflow:hidden; margin:0 auto; padding:30px 0 30px 0; background:#fbfbfb;} .vision-con {width:100%; height:1200px; margin:0 auto; padding:0; text-align:center;} .vision-con h3 {font-size:40px; font-weight:700;margin:0 0 20px 0} .vision-con > p{font-size: 25px;line-height: 30px; margin:0 0 50px 0} .vision {position:relative; width:90%; margin:0 auto; text-align:center;} .vision .m-con {position:absolute; width:100%;height:250px;background-repeat:no-repeat;background-size:60%;background-position: center;} .vision .m-con img {width:30px;} .vision .m-con.vision{background-image:url(../../img/bg_vision.png);left:0%;margin-left:0px;} .vision .m-con.mission{background-image:url(../../img/bg_mission.png);right:0%;margin-right:0px;} .vision .m-con.target{background-image:url(../../img/bg_target.png);left:0%;margin-left:0px;} .vision .m-con.vision{margin-left:0px;} .vision .m-con.mission{margin-right:0px; margin-top:310px;} .vision .m-con.target{margin-left:0px; margin-top:650px;} .vision .m-con .txt_box{position:absolute;width:100%;text-align:center;top:40%;color:#fff;} .vision .m-con .txt_box span{display:block;font-size:30px;line-height:16px;font-weight:bold;margin-top:25px;} .vision .m-con .txt_box p{font-size:45px;line-height:50px;font-weight:500;} .vision .m-con .tabtext{top:50%;width:100%;font-size:20px; font-weight:500; line-height:25px;position:absolute;background-repeat:no-repeat;box-sizing:border-box;} .vision .m-con .tabtext span{width:90%;} .vision .m-con.target .tabtext1, .vision .m-con.target .tabtext2{text-align:left;top:40%;width:100%;font-size:15px; font-weight:300; line-height:20px;position:absolute;background-repeat:no-repeat;box-sizing:border-box;} .vision .m-con.target p span{font-size:20px;font-weight:500;} .vision .m-con.vision .tabtext{padding:130px 0px 0 0;background-image:url(../../img/v_bar2_m.png);background-position:center 90px;left:0px;} .vision .m-con.mission .tabtext{padding:130px 0px 0 0px;background-image:url(../../img/v_bar2_m.png);background-position:center 90px;left:0px;} .vision .m-con.target .tabtext1{padding:170px 20px 0 20px;;background-image:url(../../img/v_bar2_m.png);background-position:center 120px;left:0px;bottom:-10px} .vision .m-con.target .tabtext2{padding:310px 20px 0 20px;;background-image:url();background-position:center bottom;left:0px;bottom:0px} /****************************************** 서브페이지 Our Service ******************************************************/ /******* 서브페이지 컨텐츠 공통 **************/ .sub-con {margin:0 auto; padding:30px 0 20px 0; text-align:center; width:100%; overflow:hidden; } .sub-con .sub-warp { width:90%; margin:0 auto; padding:0px 0 0px 0; overflow:hidden;} .sub-con .sub-warp .con-Limg { float:left; width:100%; margin:0 auto; padding:0px 0 30px 0; text-align:center; } .sub-con .sub-warp .con-Rimg { float:left; width:100%; margin:0 auto; padding:0px 0 0px 0; text-align:center; } .sub-con .sub-warp img {width:100%; height:250px;} .sub-con .sub-warp p.title {margin:0 auto; padding:0px 0 50px 0; width:100%; font-size:25px; font-weight:500; line-height:1.3; } .sub-con .sub-warp .con-inner {float:left; margin:0 auto; padding:0px 0px 0px 0px; width:100%; text-align:left; } .sub-con .con-inner ul {margin:0px 0px 0 30px ;list-style:url(../../img/list-icon.png)} .sub-con .con-inner li {width:99%; padding: 3px 0 0px 0px } .sub-con .con-inner ul li p.litit {margin:0 auto; padding:0px 0 0px 0; font-size:16px; line-height:1.3; } .sub-con .con-inner ul li p.litext {margin:0 auto; padding:5px 0 10px 0; line-height:1.5; } .sub-con .con-inner p.title {margin:0 auto; padding:0px 0 10px 0; width:100%; font-size:20px; font-weight:700; line-height:28px; } .sub-con .con-inner p.text {margin:0 auto; padding:0px 0 10px 0; width:100%; line-height:20px;} .sub-con .sub-warp .con-inner2 {margin:0 auto; padding:0px 0px 0px 0px; width:100%; text-align:left; } .sub-con .con-inner2 ul li p.litit {margin:0 auto; padding:0px 0 0px 0; font-size:16px; line-height:1.3; } .sub-con .con-inner2 ul li p.litext {margin:0 auto; padding:5px 0 10px 0; line-height:1.5; } .sub-con .con-inner2 p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:20px; font-weight:700; line-height:28px; } .sub-con .con-inner2 p.text {margin:0 auto; padding:0px 0 20px 0; width:100%; } .sub-con .con-inner3 {margin:0 auto; padding:20px 0 0px 0; text-align:center; width:90%; overflow:hidden; } .sub-con .con-inner3 ul {margin:0px 0px 0 0px ;list-style:none;} .sub-con .con-inner3 li { position:relative; height:80px; width:99%; float:left; border: 1px solid #DDD; margin:0 auto; text-align:center;padding:0px} .sub-con .con-inner3 li div {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);width:90%;margin:0 auto; padding:50px 50px 50px 50px;} .sub-con .con-inner3 li.arrow {width:100%;height:30px; padding:0px; border: 0px solid #DDD;background:#ffffff;} .sub-con .con-inner3 li.arrow .aw { padding:0px 0 0 0} .sub-con .con-inner3 li i {-webkit-transform: rotate(90deg);-moz-transform: rotate(90deg);transform: rotate(90deg);} .sub-con .con-inner3>ul>li:first-child {background:#f2f2f2;} .sub-con .con-inner3>ul>li:nth-child(3) {background:#fdfdfd;} .sub-con .con-inner3>ul>li:nth-child(5) {background:#f2f2f2;} .sub-con .con-inner3>ul>li:nth-child(7) {background:#fdfdfd;} .sub-con .con-inner3>ul>li:nth-child(9) {background:#f2f2f2;} .sub-con .con-inner3>ul>li:last-child {background:#fdfdfd;} .sub-con .con-inner ul.app-ul {margin:0px 0px 0 0px ;list-style:none; } .sub-con .con-inner ul.app-ul li {position:relative;height:80px;width:99%; float:left; border: 1px solid #DDD; margin:0 auto; text-align:center;padding:0px} .sub-con .con-inner ul.app-ul li div {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);width:90%;margin:0 auto; } .sub-con .con-inner ul.app-ul li.arrow {width:100%;height:30px;padding:4px; border: 0px solid #DDD;background:#ffffff;} .sub-con .con-inner ul.app-ul li.arrow .aw { padding:0px 0 0 0} .sub-con .con-inner li i {-webkit-transform: rotate(90deg);-moz-transform: rotate(90deg);transform: rotate(90deg);} .sub-con .con-inner>ul.app-ul>li:first-child {background:#f2f2f2;} .sub-con .con-inner>ul.app-ul>li:nth-child(3) {background:#fdfdfd;} .sub-con .con-inner>ul.app-ul>li:last-child {background:#f2f2f2;} #table1 {display: table; width: 100%; margin:0 auto; text-align:center; padding:0px 0 0 0} #table1 .row {display: table-row; width: 100%;} #table1 .row-img {display: table-row; width: 100%; } #table1 .cell {display: table-cell; border-bottom: 1px solid #DDD; border-right: 1px solid #DDD;font-size:13px;} #table1 .col1 { width: 10%; display:table-cell; vertical-align:middle;line-height:15px; padding: 10px;font-weight:bold; border-left: 1px solid #DDD;} #table1 .col2 {width: 29%; padding: 10px 10px 10px 10px; line-height:15px; display:table-cell; vertical-align:middle;margin:0 auto;} #table1 .col3 {width: 29%; padding: 10px 10px 10px 10px; line-height:15px; display:table-cell; vertical-align:middle;margin:0 auto;} #table1 .col4 {width: 29%; padding: 10px 10px 10px 10px; line-height:15px; display:table-cell; vertical-align:middle;margin:0 auto; } #table1 .first { border-top: 2px solid #DDD; background:#f7f7f7;font-weight:bold; margin:0 auto;text-align:center;} #table4 {display: table; width: 100%; margin:0 auto; padding: 0px;text-align:left;} #table4 .row {display: table-row; width: 100%; margin:0 auto; padding: 0px; word-break: break-all;} #table4 .row-img {display: table-row; width: 100%; } #table4 .cell {display: table-cell; margin:0 auto; padding: 0px;line-height:15px; border-bottom: 1px solid #DDD; border-right: 1px solid #DDD;font-size:12px;} #table4 .col1 { width: 10%; display:table-cell; vertical-align:middle;padding: 5px;font-weight:500; border-left: 1px solid #DDD; text-align:center;} #table4 .col2 {width: 10%; padding: 10px 5px 10px 5px; line-height:15px; display:table-cell; vertical-align:middle;margin:0 auto;} #table4 .col3 {width: 20%; padding: 10px 5px 10px 5px; line-height:15px; display:table-cell; vertical-align:middle;margin:0 auto;} #table4 .col4 {width: 10%; padding: 10px 5px 10px 5px; line-height:15px; display:table-cell; vertical-align:middle;margin:0 auto; } #table4 .first { border-top: 2px solid #DDD; background:#f7f7f7;font-weight:bold; margin:0 auto;text-align:center;} #table5 {display: table; width: 100%; margin:0 auto; padding: 0px;text-align:left;} #table5 .row {display: table-row; width: 100%; margin:0 auto; padding: 0px; word-break: break-all;} #table5 .row-img {display: table-row; width: 100%; } #table5 .cell {display: table-cell; margin:0 auto; padding: 0px;line-height:15px; border-bottom: 1px solid #DDD; border-right: 1px solid #DDD;font-size:12px;} #table5 .col1 { width: 10%; display:table-cell; vertical-align:middle;padding: 5px;font-weight:500; border-left: 1px solid #DDD; text-align:center;} #table5 .col2 {width: 20%; padding: 10px 5px 10px 5px; line-height:15px; display:table-cell; vertical-align:middle;margin:0 auto;} #table5 .col3 {width: 20%; padding: 10px 5px 10px 5px; line-height:15px; display:table-cell; vertical-align:middle;margin:0 auto;} #table5 .col4 {width: 10%; padding: 10px 5px 10px 5px; line-height:15px; display:table-cell; vertical-align:middle;margin:0 auto; } #table5 .first { border-top: 2px solid #DDD; background:#f7f7f7;font-weight:bold; margin:0 auto;text-align:center;} #table3-warp {width: 100%; margin:0 auto; padding:0;text-align:center;} #table3-warp p { margin:0 auto; padding:30px 30px 20px 0;text-align:right;} #table3-warp .table3-first {width: 100%; margin:0 auto; text-align:center; float:left;} #table3-warp .table3-second {width: 100%; margin:0 auto; text-align:center; float:right;} #table3 {display: table; width: 100%; margin:0 auto; text-align:center; float:left} #table3 .row {display: table-row; width: 100%;} #table3 .row-img {display: table-row; width: 100%; } #table3 .cell {display: table-cell; border-bottom: 1px solid #DDD; border-right: 1px solid #DDD;font-size:13px;} #table3 .col1 { width: 80%; display:table-cell; vertical-align:middle;padding: 10px;border-left: 1px solid #DDD;} #table3 .col2 {width: 20%; padding: 5px 5px 5px 5px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto; background:#f7f7f7;} #table3 .col3 {width: 29%; padding: 5px 5px 5px 5px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto;} #table3 .col4 {width: 29%; padding: 5px 5px 5px 5px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto; } #table3 .first { border-top: 1px solid #DDD; margin:0 auto;text-align:center;} .text-con2 {position:relative; overflow:hidden; width: 100%; margin: 0 auto; padding: 30px 0 30px 0 ; text-align:center; } .text-con2 .con2-warp {width:99%;overflow:hidden;border: 1px solid #DDD;margin:0 auto; text-align:center;} .text-con2 .con2-warp .table-title {width:100%;height:50px;background:#e5e5e5;border: 1px solid #DDD;margin:0 auto; text-align:center;line-height:50px; font-weight:400;} .text-con2 p {width:90%;font-size:12px;margin:0 auto; text-align:center;padding:20px 0 0 0;} #table6 {width: 100%; margin:0 auto; text-align:center; } #table6 .cell {width: 100%; display:table-cell;float:left; padding: 0px; font-size:14px; font-weight:300; margin:0 auto;display:} #table6 .first { border-right: 1px solid #DDD; margin:0 auto;text-align:center;} #table6 .cell ol {list-style:decimal;margin:20px 10px 0px 40px;text-align:left;padding: 0px;} #table6 .cell ol.bottom {list-style:decimal;margin:0px 10px 20px 40px;text-align:left;padding: 0px;} #table6 .cell ol li {width:100%;text-align:left; line-height:25px;} /****************************************** 서브페이지 Contact Us ******************************************************/ /******* contact us 구글맵 ***************/ .map-warp {width:100%; margin:0 auto; padding:30px 0 50px 0;} .map {width:90%; height:400px; margin:0 auto; text-align:center;} .Contact-con {margin:0 auto; padding:30px 0 20px 0; text-align:center; width:100%; overflow:hidden; } .Contact-con .Contact-warp { width:100%; margin:0 auto; padding:0px 0 0px 0; overflow:hidden;} .Contact-con .Contact-warp .con-Limg { position:relative;float:left; width:100%; height:100px; margin:0 0 30px 0; padding:0px 0 30px 0; text-align:center; background: url("../../img/contactus-m01.jpg") no-repeat ; background-size: cover; } .Contact-con .Contact-warp .con-Limg .title {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:90%; font-size:16px;font-weight:500; line-height:25px; color: rgb(255, 255, 255); text-shadow:5px 6px 14px rgba(0, 0, 0, 0.4); margin:0;} .Contact-con .Contact-warp p.title {margin:0 auto; padding:0px 0 30px 0; width:100%; font-size:23px; font-weight:400; line-height:1.3; } .Contact-con .Contact-warp .con-inner {float:left; margin:0 auto; padding:0px 0px 0px 0px; width:100%; text-align:left; } .Contact-con .con-inner ul {width:100%; overflow:hidden; margin:10px 0 0 0px } .Contact-con .con-inner li {width:100%; padding: 3px 0 3px 0 } .Contact-con .con-inner p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:20px; font-weight:500; line-height:20px; } .Contact-con .con-inner p.text {margin:0 auto; padding:0px 0 50px 0; width:100%; font-size:16px; padding-bottom:0px; line-height:22px; } .Contact-con .Contact-warp .con-inner2 {margin:0 auto; padding:0px 0px 0px 0px; width:100%; text-align:left; } .Contact-con .con-inner2 p.title {margin:0 auto; padding:0px 0 20px 0; width:100%; font-size:20px; font-weight:500; line-height:20px; } .Contact-con .con-inner2 p.text {margin:0 auto; padding:0px 0 50px 0; width:100%; font-size:16px; padding-bottom:0px; line-height:22px; } #table2 {display: table; width: 100%; margin:0 auto; text-align:center;} #table2 .row {display: table-row; width: 100%;} #table2 .row-img {display: table-row; width: 100%; } #table2 .cell {display: table-cell; border-bottom: 1px solid #DDD; border-right: 1px solid #DDD;font-size:13px;} #table2 .col1 { width: 10%; display:table-cell; vertical-align:middle;padding: 10px;font-weight:bold; border-left: 1px solid #DDD;background:#f7f7f7;} #table2 .col2 {width: 29%; padding: 10px 10px 10px 15px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto; text-align:left;} #table2 .col3 {width: 29%; padding: 10px 10px 10px 15px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto;} #table2 .col4 {width: 29%; padding: 10px 10px 10px 15px; line-height:20px; display:table-cell; vertical-align:middle;margin:0 auto; } #table2 .first { border-top: 1px solid #1269ca; font-weight:bold; margin:0 auto;} } /******* 네트워크 슬라이드 베너***************/ #network { position: relative; width:100%;margin:0 auto; text-align:center; padding:40px 0 50px 0; } #network h3 {width:1100px; margin:0px auto; text-align:center; padding:20px 0 20px 0; line-height:40px; font-size:35px;font-weight: 700; border: 1px solid rgba(207, 215, 255, 0.5) ; background:#f9f9f9;} #network h3 span {color:#ff7e00; font-size:28px;} #network .network {width:1100px; margin:0 auto; text-align:center; overflow: hidden; padding:30px 0 0 0} #network .network ul.network-list { width:100%;overflow: hidden; } #network .network ul.network-list li {width: 23%; float:left; overflow: hidden; padding: 10px 10px; } #network .network ul.network-list li.empty {} #network .network ul.network-list li.empty .item{background:#f8f8f8;height:200px} #network .network .item { width: 100%; overflow: hidden; padding: 0 0px; } #network .network .item .imgTitle { width: 100%;} #network .network .item .imgTitle img { height: auto; width: 100%;} #network .network .item .text-warp {width:100%;overflow:hidden;margin: 0;text-align: center;padding:0 0px 20px 0px; } #network .network .item p.country { font-size: 16px; font-weight: bold; margin: 0;text-align: center; background-color: #e2e2e2; padding:10px 0 10px 0;} #network .network .item p.companyname { font-size: 18px; margin:0; font-weight: 700; margin: 0;text-align: center;padding:10px 0 10px 0; line-height:25px;} #network .network ul li ul.text {width:90%; margin:0 0px 0 0; padding:0 0px 0 10px;} #network .network ul li ul.text li{ position: relative;width:90%; margin:0 auto; padding:3px 0 0px 0; font-size:13px; text-align:left; letter-spacing: 0.5px; padding-left: 30px; /*이미지 나올공간 왼쪽 여백 띄워주기*/ /* background:url('../../img/list-icon2.png') no-repeat 0 10px; */ } #network .network .item ul li span{ position: absolute; left: 18px; top: 1px; padding:0px 0px 0px 0px; font-size:14px;} #network .network .item li a {font-weight: 500;} #network .network .item ul li .xi-li2 { position: absolute; left: 0px; top: 5px; font-size:16px; text-align: left; color:#5296d0;} #network .network .item .img_zoom{ -webkit-transform:scale(1.0); /* ũ�� */ -moz-transform:scale(1.0); /* FireFox */ -o-transform:scale(1.0); /* Opera */ transform:scale(1.0); transition: transform .45s; -o-transition: transform .45s; -moz-transition: transform .45s; -webkit-transition: transform .45s; } #network .network .item:hover .img_zoom { -webkit-transform:scale(1.05); /* ũ�� */ -moz-transform:scale(1.05); /* FireFox */ -o-transform:scale(1.05); /* Opera */ transform:scale(1.05); transition: transform .55s; -o-transition: transform .55s; -moz-transition: transform .55s; -webkit-transition: transform .55s; } @media only screen and (max-width:980px) { #network h3 {width:90%; margin:0px auto; text-align:center; padding:20px 0 20px 0; line-height:40px; font-size:35px;font-weight: 700; border: 1px solid rgba(207, 215, 255, 0.5) ; background:#f9f9f9;} #network h3 span {color:#ff7e00; font-size:28px;} #network .network {width:90%; margin:0 auto; text-align:center; overflow: hidden; padding:30px 0 0 0} #network .network ul.network-list li { width: 30%; } #network .network ul.network-list li.empty {display:none;} } @media only screen and (max-width:768px) { #network h3 {width:90%; margin:0px auto; text-align:center; padding:20px 0 20px 0; line-height:40px; font-size:35px;font-weight: 700; border: 1px solid rgba(207, 215, 255, 0.5) ; background:#f9f9f9;} #network h3 span {color:#ff7e00; font-size:28px;} #network .network ul.network-list li { width: 45%; } #network .network .item { width: 100%; overflow: hidden; padding: 0 0px; } #network .network .item .imgTitle { width: 100%;} #network .network .item .imgTitle img { height: auto; width: 100%;} #network .network .item .text-warp {width:100%;overflow:hidden;margin: 0;text-align: center;padding:0 0px 20px 0px; } #network .network .item p.country { font-size: 18px; font-weight: bold; margin: 0;text-align: center; background-color: #e2e2e2; padding:10px 0 10px 0;} #network .network .item p.companyname { font-size: 20px; margin:0; font-weight: 700; margin: 0;text-align: center;padding:10px 0 10px 0;} } @media screen and (max-width:480px) { #network { position: relative; width:100%;margin:0 auto; text-align:center; padding:40px 0 50px 0; } #network h3 {width:90%; margin:0px auto; text-align:center; padding:20px 0 20px 0; line-height:40px; font-size:28px;font-weight: 700; border: 1px solid rgba(207, 215, 255, 0.5) ; background:#f9f9f9;} #network h3 span {color:#ff7e00; font-size:24px;} #network .network {width:90%; margin:0 auto; text-align:center; overflow: hidden; } #network .network ul.network-list { width:100%;overflow: hidden; } #network .network ul.network-list li {width: 100%; float:left; overflow: hidden; padding: 0px 0px; } #network .network ul.network-list li.empty {} #network .network ul.network-list li.empty .item{background:#f8f8f8;height:200px} #network .network .item { width: 100%; overflow: hidden; padding: 0 0px; } #network .network .item .imgTitle { width: 100%;} #network .network .item .imgTitle img { height: auto; width: 100%;} #network .network .item .text-warp {width:100%;overflow:hidden;margin: 0;text-align: center;padding:0 0px 20px 0px; } #network .network .item p.country { font-size: 18px; font-weight: bold; margin: 0;text-align: center; background-color: #e2e2e2; padding:20px 0 20px 0;} #network .network .item p.companyname { font-size: 24px; margin:0; font-weight: 700; margin: 0;text-align: center;padding:15px 0 15px 0;} #network .network ul li ul.text {width:90%; margin:0 0px 0 0; padding:0 0px 0 10px;} #network .network ul li ul.text li{ position: relative;width:90%; margin:0 auto; padding:3px 0 0px 0; font-size:14px; text-align:left; letter-spacing: 0.5px; padding-left: 30px; /*이미지 나올공간 왼쪽 여백 띄워주기*/ /* background:url('../../img/list-icon2.png') no-repeat 0 10px; */ } #network .network .item ul li span{ position: absolute; left: 18px; top: 1px; padding:0px 0px 0px 0px; font-size:14px;} #network .network .item li a {font-weight: 700;} #network .network .item ul li .xi-li2 { position: absolute; left: 0px; top: 5px; font-size:16px; text-align: left; color:#5296d0;} }