@charset "utf-8";

.ms-wrap{height:610px;}
.s-left{height:100%;}
.s-right{height:100%;}

/*sub-top*/
#sub-top{width:100%; height:100%; position:relative; overflow:hidden; transition:all 0.4s;}
.sub-top{width:100%;height:100%;background-size:cover !important;}
.sub-top1{background:url(../../images/theme/sub/sub_top1.jpg)no-repeat;}
.sub-top2{background:url(../../images/theme/sub/sub_top2.jpg)no-repeat;}
.sub-top3{background:url(../../images/theme/sub/sub_top3.jpg)no-repeat;}
.sub-top4{background:url(../../images/theme/sub/sub_top4.jpg)no-repeat;}
.sub-top5{background:url(../../images/theme/sub/sub_top5.jpg)no-repeat;}

.s-top-title{position:absolute; top:38%; left:12.6%;z-index:1; width:100%;}
.s-top-title h1{font-size:50px; color:#fff;font-weight:400;line-height:1;margin-bottom:25px;}
.s-top-title span{font-size:25px;color:#fff;font-weight:300;line-height:1;display:inline-block;}

/*sub-nav*/
#sub-nav{width:100%; padding-left:135px; height:60px; box-sizing:border-box;}
#sub-nav > ul{display:block; /* width:calc(100% - 135px);   */border-bottom:1px solid #eee;height:100%;}
#sub-nav > ul > li{float:left; width:253px; position:relative; border-right:1px solid #eee; box-sizing:border-box;}
#sub-nav > ul > li:nth-of-type(2){width:236px;}
#sub-nav > ul > li > a{line-height:60px; padding:0 30px; box-sizing:border-box;}

#sub-nav .nav-home{width:58px; border-left:1px solid #eee;}
#sub-nav .nav-home a{font-size:21px; display:block; color:#555; text-align:center; padding:0;font-weight:200;}
#sub-nav .nav-home a:before{content:'';}
#sub-nav .nav-menu > a{font-size:16px; color:#555; display:block; cursor:pointer; position:relative; white-space:nowrap; word-break:normal; overflow:hidden; text-overflow:ellipsis;}
#sub-nav .nav-menu > a:before{content: "\e936"; font-family: 'xeicon'; color:#555; position:absolute; font-size:20px; top:0; right:20px; transition:all 0.4s;}
#sub-nav .nav-menu.nav-active > a:before{transform:rotate(180deg);}

#sub-nav .nav-menu ul{display:none; position:absolute; z-index:777; background:#fff; border:1px solid #eee; width:100%; margin-left:-1px; padding:8px 0;top:100%;left:0;}
#sub-nav .nav-menu ul li a{font-size:15px; font-weight:200; color:#555;/*  line-height:40px; padding:0 20px; */ display:block;transition:all 0.4s;/*  white-space:nowrap; text-overflow:ellipsis; word-break:normal; overflow:hidden; */line-height:22px; padding:8px 20px 8px 30px;}
#sub-nav .nav-menu ul li a:hover{color:#003365;font-weight:400;}

#sub-nav .nav-menu ul li.selected a{position:relative;color:#003365;font-weight:400;}
#sub-nav .nav-menu ul li.selected a:before{position:absolute;content:'\e929';font-size:20px;right:20px;font-family:'xeicon';color:#003365;}
/* #sub-nav .no-nav-menu a{cursor:default;}
#sub-nav .no-nav-menu a::before{content:'';} */

/* 공통 */
#section{overflow:hidden;width:100%;}
.s-section{padding-bottom:200px;box-sizing:border-box;width:100%;}
.section-wrap{width:100%; max-width:1200px; margin:0 auto;box-sizing:border-box;}
.contents.conBox{margin-bottom:105px;}
.contents.conBox2{margin-bottom:110px;}

.s-title{padding:100px 3% 80px;}
.s-title h2{font-size:40px;font-weight:400;text-align:center;line-height:1;}

.ss-title{margin-bottom:60px;position:relative;z-index:1;}
.ss-title h3{font-size:36px;font-weight:500;letter-spacing:-0.02em;line-height:1;position:relative;z-index:2;padding-bottom:5px;}
.ss-title h3:before{position:absolute;content:'';background:url(../../images/theme/sub/index.jpg)no-repeat center center;width:73px;height:10px;bottom:0;left:0;z-index:-1;}

.w-block, .wm-block, .ws-block{display:block;}
.color-b{color:#003365;}
.color-r{color:#e60012;}
.color3{color:#333;}
.bold400{font-weight:400;}
.bold500{font-weight:500;}
.fadeInUp, .fadeInRight, .fadeInLeft{animation-duration:1.2s;}
.fadeIn{animation-duration:2.0s;}

/* 대표인사말 */
.intro{position:relative;margin-bottom:110px;z-index:10;}
.intro.gr-intro:before{position:absolute;content:'';width:0%;transition:all 1.5s ease-out;height:2px;right:45.75%;top:47%;background:linear-gradient(to right, #003365, #e60012);}
.intro.gr-intro.active:before{right:0%;width:45.75%;}
.intro h1{font-size:50px;line-height:1;letter-spacing:-0.02em;padding-bottom:28px;font-weight:500;}
.intro h1.last{padding-bottom:0;}

.scrollMotion{display:flex; height:594px;} 
.scrollMotion .imgCont{position:relative; width:55.2%;}
.scrollMotion .imgCont .img{position:absolute; top:0; right:0; width:700px; height:100%; overflow:hidden; transition:all 1.5s ease-out;}
.scrollMotion .imgCont .img img{position:absolute; top:0; right:0;}
.scrollMotion:nth-child(even) .imgCont .img{left:0;}
.scrollMotion:nth-child(even) .imgCont .img img{left:0;}
.scrollMotion.active .imgCont .img{width:100%;}

.greetings{overflow:hidden;}
.greetings .txt{width:63.25%; background:#fff; padding:58px 0 108px 70px; box-sizing:border-box; float:right; margin-top:-475px; position:relative; transition:all 0.4s;}
.greetings .txt h3{font-size:35px; font-weight:500; color:#333; line-height:1.17;margin-bottom:28px;}
.greetings .txt p{font-size:18px;font-weight:200;color:#555;line-height:1.83;margin-bottom:56px;}
.box{display:block;height:52px;}
.ceo{font-size:18px;color:#555;font-weight:200;line-height:1;float:right;}
.ceo span{font-size:23px;color:#333;font-weight:500;letter-spacing:0.36em;display:inline-block;margin-left:24px;}

/* 비전 */
.s-section#sub1-2{padding-bottom:0;}
.v-year{margin-bottom:58px;line-height:0;}
.vision{width:100%;position:relative;background:url(../../images/theme/sub/vs_bg.jpg)no-repeat center center;background-size:cover;padding-top:195px;padding-bottom:186px;}
.vision:before{z-index:0;position:absolute;content:'MTEK POWER LIGHT';font-size:260px;font-weight:600;color:#f0f2f2;left:-960px;top:-193px;line-height:1;z-index:0;animation:slide 40s linear infinite;white-space:nowrap;}
@keyframes slide{
    0%  {transform: translateX(100%);}
	100% {transform: translateX(-70%);}
  
}
.vs-slide{padding-top:67px;}
.vs-slide .contents h2{font-size:74px;line-height:1;font-weight:600;color:#fff;display:table;position:relative;padding-top:66px;}
.vs-slide .contents h2:before{position:absolute;content:'';background:url(../../images/theme/sub/vs_icon01.png)no-repeat center center;width:96px;height:105px;right:-128px;top:0;}
.vs-slide .contents.c02 h2:before{background:url(../../images/theme/sub/vs_icon02.png)no-repeat center center;right:-119px;width:87px;}
.vs-slide .contents.c03 h2:before{background:url(../../images/theme/sub/vs_icon03.png)no-repeat center center;right:-159px;width:127px;}
.vs-slide .contents img{margin:26px 0 29px 204px;}
.vs-slide .contents p{font-size:22px;color:#fff;font-weight:300;line-height:1.5;}

.vs-slide .slick-dots{bottom:auto;top:0;left:0;width:auto;}
.vs-slide .slick-dots li{width:35px;height:25px;margin:0 29px 0 0;}
.vs-slide .slick-dots li:before{position:absolute;content:'01';font-size:30px;color:#fff;left:0%;top:50%;transform:translate(0%, -50%);font-weight:500;opacity:0.4;}
.vs-slide .slick-dots li:nth-of-type(2):before{content:'02';}
.vs-slide .slick-dots li:nth-of-type(3):before{content:'03';}
.vs-slide .slick-dots li.slick-active:before{opacity:1;}
.vs-slide .slick-dots li button{display:none;}

/* 연혁 및 현황 */
.s-section#sub1-3{padding-bottom:0;}
.history{position:relative;width:100%;padding-bottom:55px;overflow:hidden;}
.history:before{position:absolute;content:'';background:#eee;left:50%;top:0;transform:translateX(-50%);width:1px;height:0%;}
.history.active:before{height:100%;transition:4s 0.1s;}
.history:after{position:absolute;content:'';background:#eee;left:50%;transform:translateX(-50%);width:7px;height:7px;border-radius:50%;top:0;}
.ht{display:flex;}
.ht .title, .ht .contents{width:50%;}
.ht .title{position:relative;}
.ht .title .intro{padding-bottom:24px;}
.ht .title .intro:before{position:absolute;content:'';height:1px;width:0%;right:0;bottom:12px;background:#003365;}
.ht .title .intro.active:before{width:200%;transition:2s 0.3s;}
.ht .title .intro:after{position:absolute;content:'';width:26px;height:26px;background:url(../../images/theme/sub/ht_dot.png)no-repeat center center;bottom:0;right:-12.5px;}
.ht .contents{padding-bottom:106px;}
.ht .ht-list{padding-top:31px;padding-left:65px;margin-bottom:29px;}
.ht .ht-list .year{font-size:40px;font-weight:500;line-height:1;}
.ht .ht-list ul{margin-top:20px;padding-left:10px;}
.ht .ht-list ul li{font-size:17px;font-weight:200;line-height:1.35;color:#555;position:relative;padding:7px 0;padding-left:46px;}
.ht .ht-list ul li span{font-weight:500;color:#333;position:absolute;left:0;top:10px;}

.ht.right .title{order:2;}
.ht.right .title .intro:before{right:auto;left:0;transition:2s 0.3s;}
.ht.right .title .intro:after{left:-13.5px;}
.ht.right .title .intro h1{text-align:right;}
.ht.right .contents{order:1;}
.ht.right .ht-list{padding-left:0;padding-right:65px;}
.ht.right .ht-list .year{text-align:right;}
.ht.right .ht-list ul li{padding-left:0;padding-right:46px;text-align:right;}
.ht.right .ht-list ul li span{left:auto;right:0;}

.company{width:100%;padding:80px 0 200px;background:#fafafa;}
.outline{text-align:center;height:229px;margin-left:-1px;cursor:pointer;position:relative;}
.outline.left{margin-left:0;}
.outline.bottom{margin-top:-1px;}
.outline .front, .outline .back{width:100%;height:100%;border:1px solid #eee;box-sizing:border-box;backface-visibility:hidden;-webkit-backface-visibility: hidden;
-webkit-transition: -webkit-transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
  transition: -webkit-transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
  -o-transition: transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
  transition: transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
  transition: transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1), -webkit-transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
}
.outline .front{background:#fff;
   -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);}
.outline .back{position:absolute;top:0;left:0;background:#003365;
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);}
.outline:hover .front, .outline:hover .back{-webkit-transition: -webkit-transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
 transition: -webkit-transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
  -o-transition: transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
   transition: transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
  transition: transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1), -webkit-transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
}
.outline:hover .front{-webkit-transform: rotateY(-180deg);
  transform: rotateY(-180deg);}
  .outline:hover .back{-webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);}

.outline img{margin-bottom:23px;margin-top:56px;}
.outline h4{font-size:18px;font-weight:400;line-height:1;margin-bottom:13px;}
.outline p{font-size:18px;font-weight:300;line-height:1.27;}
.outline .back h4, .outline .back p{color:#fff ;}
.outline .back p a.white{color:#fff;}

.outline.last .inner{position:relative;width:100%;height:100%;}
.outline.last .inner:before{position:absolute;content:'';background:url(../../images/theme/sub/mtek.png)no-repeat center center;width:237px;height:73px;right:0;bottom:0;z-index:2;}
.outline.last .back .inner:before{opacity:0.5;}

/* 조직도 */
.s-section#sub1-4{padding-bottom:0;}
.orz{padding-bottom:90px;}
.ceo-wrap{padding:10px;box-sizing:border-box;}
.orz-ceo{background:#003365;height:225px;width:225px;border-radius:50%;position:relative;margin:0 auto;display:flex;align-items:center;justify-content:center;}
.orz-ceo:before{position:absolute;width:242px;height:242px;content:'';border-radius:50%;border:1px solid #003365;top:50%;left:50%;transform:translate(-50%,-50%);}
.orz-ceo:after{position:absolute;width:164px;height:62px;content:'';top:50%;left:50%;transform:translate(-50%,-50%);background:url(../../images/theme/sub/mtek02.png)no-repeat center center;z-index:0;}
.orz-ceo h4{font-size:34px;color:#fff;font-weight:400;letter-spacing:0.06em;position:relative;z-index:1;}

.mtek-team{position:relative;padding-top:105px;}
.mk-team .team-wrap{width:96.67%;margin:0 auto;padding-top:30px;position:relative;}
.mk-team2 .team-wrap{width:93.33%;}
.h-line{width:62.5%;left:25%;height:1px;background:url(../../images/theme/sub/line.gif)repeat-x;position:absolute;}
.h-line2{width:50.17%;}
.v-line{position:absolute;width:1px;left:50%;transform:translateX(-50%);height:100%;background:url(../../images/theme/sub/line.gif)repeat-y center;top:0px;z-index:-1;}
.v-line2{height:20%;}
.v-line3{height:12%;}

.team-title{width:100%;box-sizing:border-box;background:#003365;position:relative;}
.team-title h4{font-size:20px;font-weight:400;color:#fff;text-align:center;line-height:64px;padding:0 20px;position:relative;}

.team-wrap ul li{background:#fff;font-size:17px;line-height:55px;font-weight:200;color:#555;text-align:center;width:100%;border:1px solid #ccc;padding:0 10px;box-sizing:border-box;margin:15px 0;}
.team-wrap ul li:first-child{margin-top:45px;}
.team-wrap ul li:last-child{margin-bottom:0px;}

.role-wrap{padding-top:20px;width:100%;position:relative;}
.position{position:relative;}
.team-wrap ul.role{width:96.55%;margin:0 auto;}
.team-wrap ul.role li:first-child{margin-top:24px;}

.people{background:#fff;border:1px solid #eee;height:209px;width:100%;max-width:1100px;margin:0 auto;text-align:center;box-sizing:border-box;}
.people img{margin-top:36px;margin-bottom:17px;}
.people p{font-size:21px;font-weight:400;line-height:1.28;}

/* 협력사 */
.cp-com{display:block;position:relative;width:97%;border:1px solid #eee;margin:0 auto 35px;}
.cp-com.last{margin-bottom:0;}
.cp-com .inner{position:relative;height:100%;width:100%;box-sizing:border-box;padding:15px;margin:0 auto;}
.cp-com .imgBg{width:100%;height:163px;background:#fafafa;display:flex;align-items:center;justify-content:center;margin-bottom:9px;}
.cp-com h3{font-size:22px;font-weight:400;position:relative;line-height:1.27;padding:7px 0 7px 30px;}
.cp-com h3:before{position:absolute;content:'';width:4px;height:4px;background:#003365;left:16px;top:20px;}

/* hover시 외곽선 effect */
.cp-com:before, .cp-com:after,
.cp-com .inner:after, .cp-com .inner:before {transition:all 0.6s ease; display:block; content:''; position:absolute; background:#003365; z-index:100;}

.cp-com:before {top:0; left:0; right:100%; height:1px; }
.cp-com:after {top:0; right:0; bottom:100%; width:1px; }

.cp-com:hover:before{/* transition-delay:0s; */ right:0; /* -webkit-transition-delay:0s; */}
.cp-com:hover:after {/* transition-delay:0.3s; */ bottom:0; /* -webkit-transition-delay:0.3s; */}

.cp-com .inner:after {bottom:0; right:0; left:100%; height:1px;}
.cp-com .inner:before {bottom:0; left:0; top:100%; width:1px;}

.cp-com .inner:hover:after {/* transition-delay:0.6s; */ left:0; /* -webkit-transition-delay:0.6s; */}
.cp-com .inner:hover:before {/* transition-delay:0.9s; */ top:0; /* -webkit-transition-delay:0.9s; */}

/* 오시는길 */
.root_daum_roughmap{width:100% !important; border:0 !important; padding:0 !important; border-radius:0 !important;max-width:500px;}
.root_daum_roughmap .wrap_controllers{border:1px solid #ccc !important;}
.directions .contents{margin-top:-170px;display:flex;}
.directions .info, .directions .mtekMap{width:50%;float:left;box-sizing:border-box;}
.directions .info{padding:141px 20px 0 40px;}
.directions .ss-title{margin-bottom:25px;}
.directions .info ul li{font-size:20px;font-weight:200;color:#333;line-height:1.4;}
.directions .info ul li~li{padding:6px 0;}
.directions .info ul li:first-child{margin-bottom:8px;}

.mtekMap{padding-left:42px;}
#dt-1.contents{order:1;}
#dt-1 .mtekMap{order:2;}
#dt-2.contents{margin-top:0;}
#dt-2 .mtekMap{padding-left:58px;}

/* R&D */
#sub2-1{position:relative;}
#sub2-1:before{position:absolute;content:'';background:#fafafa;bottom:0;left:0;width:100%;height:623px;z-index:-1;}
.intro.intro2{margin-bottom:50px;}
.intro.intro2 p{margin-top:7px;font-size:17px;line-height:1.64;font-weight:200;color:#333;}

#rnd{padding:14px 0 79px;margin-left:10px;}
#rnd.swiper-container{overflow:visible;}
#rnd .swiper-slide{opacity:0.3;}
#rnd .swiper-slide.swiper-slide-active, #rnd .swiper-slide.swiper-slide-active+.swiper-slide, #rnd .swiper-slide.swiper-slide-active+.swiper-slide+.swiper-slide{opacity:1;}
#rnd .rd{/* width:95%; */margin:0 auto;}
#rnd .rd .imgBox{line-height:0;}
#rnd .rd .imgBox img{width:100%;}
/* #rnd .rd .imgBox img{width:100%;} */
#rnd .rd h4{font-size:20px;font-weight:400;color:#555;line-height:1;text-align:center;padding:31px 10px;position:relative;}
#rnd .rd h4:before{position:absolute;content:'\e93f';font-family:'xeicon';font-size:20px;color:#003365;right:-21px;font-weight:bold;top:50%;transform:translateY(-50%);}
#rnd .rd.last h4:before{content:'';}
#rnd .rd h4 span{font-weight:500;color:#003365;margin-right:10px;display:inline-block;}
#rnd.swiper-container-horizontal > .swiper-scrollbar{height:3px;background:#eee;;border-radius:0;bottom:0;}
#rnd .swiper-scrollbar-drag{border-radius:0;background:#003365;}

.rd-bg{width:100%;height:405px;background:url(../../images/theme/sub/rd_bg.jpg)no-repeat center center;background-attachment:fixed;background-size:cover;margin:140px 0;}

.circleBox{overflow:hidden;padding:35px 0;display:flex;justify-content:center;}
.circleBox .circle{text-align:center;width:347px;height:347px;border-radius:50%;float:left;display:flex;justify-content:center;align-items:center;}
.circleBox .circle#circle01{background:#dde7f0;margin-right:-19px;}
.circleBox .circle#circle02{background:#9eb2c4;margin-left:-19px;}
.circleBox .circle h2{font-size:23px;color:#fff;font-weight:500;line-height:1.52;}

.modelBox{padding-top:13px;}
.modelBox .model{text-align:center;}
.modelBox .model .imgBox{height:236px;;display:flex;justify-content:center;align-items:center;}
.modelBox  .model img{margin-bottom:25px;}
.modelBox  .model h3{font-size:24px;line-height:1;font-weight:500;color:#555;}

/* 에너지 */
#sub3-1.s-section{padding-bottom:0;}
#tab-menu{margin-bottom:75px;text-align:center;width:100%;line-height:0;}
#tab-button{overflow:hidden;display:inline-block;width:100%;}
#tab-menu ul li{float:left;width:20%;border-bottom:2px solid #eee;box-sizing:border-box;}
#tab-menu ul li a{font-size:23px;font-weight:400;line-height:1.43;color:#555;display:block;width:100%;letter-spacing:0.007em;padding:0 8px 16px 8px;text-align:center;}
#tab-menu .selected{position:relative;border-bottom:2px solid #003365;}
#tab-menu .selected a{color:#154174;font-weight:500;}
#tab-select{display:none;}

#tab-menu.tab-menu2 ul li{width:33.33%;}

.ss-title p{font-size:17px;color:#333;line-height:1.58;font-weight:200;padding:20px 0 5px;}
.eng{padding-bottom:200px;}
.eng .prd#prd1{padding:37px 0 0 20px;}
.eng .prd#prd2{padding:137px 0 0 34px;}
.eng .prd#prd7{padding:15px 0 0 119px;}
.eng .prd#prd8{padding:84px 0 0 84px;}
.eng table{border-top:2px solid #003365;border-bottom:1px solid #333 ;width:100%;border-collapse:collapse;}
.eng table tr th, .eng table tr td{word-break:break-all;font-size:16px;color:#333;line-height:1.37;padding:16px 8px;text-align:center;border-bottom:1px solid #f7f9fa;box-sizing:border-box;}
.eng table tr:last-child th, .eng table tr:last-child td{border-bottom:0;}
.eng table tr th{background:rgba(0, 51, 101, 0.2);font-weight:500;}
.eng table tr td{font-weight:200;}

.eng#tab2{padding-bottom:0;}
.eng#tab2 .imgBox{text-align:center;}
.eng#tab2 .company h3, .stf#tab1 .company h3{font-size:29px;text-align:center;font-weight:500;line-height:1;margin-bottom:60px;}
.eng#tab2 .company .imgBox, .stf#tab1 .company .imgBox{border:1px solid #eee;line-height:0;}
.eng#tab2 .company .imgBox img{width:100%;}

.eng#tab3{padding-bottom:0;}
.eng#tab3 .imgBox, .stf#tab3 .company .imgBox{border:1px solid #eee;line-height:0;}
.eng#tab3 .height{display:block;height:15px;}
.eng#tab3 .company .imgBox{margin:0 auto;width:97%;/* background:url(../../images/theme/sub/prd_bg.jpg)no-repeat center center; */background:#fff;background-size:cover;}
.eng#tab3 .company .imgBox.top{margin-bottom:15px;}
 .eng#tab3 .company .imgBox img, .eng#tab5 .imgBox#prd6 img{width:100%;}

.eng#tab4 .prd{text-align:center;}
.eng#tab4 .prd img{width:80%;}
.eng#tab4 .prd h4{font-size:20px;font-weight:500;line-height:1;padding:25px 0 8px;display:table;margin:0 auto;}

/* ict솔루션 */
#sub3-2.s-section{padding-bottom:0;}
.stf{padding-bottom:200px;}
.ss-title h3 span{font-size:22px;font-weight:400;color:#555;}
.stf .imgBox{line-height:0;}
.stf#tab1 .imgBox#prd9 img, .stf#tab1 .company .imgBox img, .stf#tab2 .imgBox2 img, .stf#tab3 .imgBox#prd11 img, .stf#tab3 .company .imgBox img{width:100%;}
.stf#tab1 .imgBox h4{font-size:20px;font-weight:500;line-height:60px;background:#eee;width:100%;text-align:center;}
.stf#tab1 .company, .ems .company{padding-bottom:90px;}
 .stf#tab1 .imgBox2,  .stf#tab2 .imgBox2{text-align:center;}
.stf#tab1 .imgBox2 img{width:48%;margin:0 1%;}
.stf#tab1 .imgBox2 h4{background:none;}

.feature{position:relative;padding:42px 0 0 15px;}
.feature:before{position:absolute;content:'';width:154px;height:2px;background:#003365;left:-158px;top:64px;}
.feature li{font-size:17px;color:#333;line-height:1.58;font-weight:200;padding:8px 0 8px 0;}

.stf#tab2, .stf#tab3{padding-bottom:0;}
.stf#tab2 .imgBox2{margin:1%;}
.stf#tab2 .prd#prd10{padding-left:196px;}
.feature2{padding:20px 40px 20px 30px; border:1px solid #003365;margin-top:40px;}
.feature2 li{font-size:17px;color:#333;line-height:1.58;font-weight:200;padding:8px 0 8px 20px;position:relative;}
.feature2 li:before{position:absolute;content:'';width:4px;height:4px;background:#003365;left:0px;top:20px;}

/* xems솔루션 */
.ems .prd img{width:100%;}
.ems .txtBox{width:98%;margin:0 auto;background:#ccd6e0;}
.ems .txtBox.tb2{background:#a3b5c7;}
.ems .txtBox.tb3{background:#829bb3;}
.ems .txtBox.tb4{background:#6886a3;}
.ems .txtBox h4{line-height:50px;color:#fff;text-align:center;font-size:18px;font-weight:300;}
.ems .txtBox p{min-height:108px;line-height:1.35;text-align:center;font-size:17px;font-weight:200;background:#fff;padding:30px 20px;box-sizing:border-box;border:1px solid #eee;}

.circleBox2{overflow:hidden;padding:35px 0;display:table;width:100%;text-align:center;line-height:0;font-size:0;}
.circleBox2 .circle2{margin:-15px;text-align:center;width:280px;height:280px;border-radius:50%;display:inline-table;background:#aed0d4;position:relative;}
.circleBox2 .circle2.light{background:#9ec7cb;}
.circleBox2 .circle2 ul{padding:0 20px;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:100%;box-sizing:border-box;}
.circleBox2 .circle2 ul h4{font-size:20px;line-height:1;font-weight:400;color:#fff;margin-bottom:15px;}
.circleBox2 .circle2 ul li{font-size:17px;line-height:1.38;font-weight:200;padding:3px 0px 3px 13px;position:relative;color:#fff;display:table;margin:0 auto;}
.circleBox2 .circle2 ul li:before{position:absolute;content:'';width:5px;height:1px;background:#fff;left:0;top:14px;}

/* 채용안내 */
.recruit .imgBox{margin-bottom:62px;line-height:0;}
.recruit .imgBox img{width:100%;}
.recruit .txt{font-size:24px;font-weight:400;line-height:1.58;text-align:center;}

.step{width:92.5%;position:relative;height:370px;display:flex;justify-content:center;align-items:center;text-align:center;background:url(../../images/theme/sub/circle.png)no-repeat center center;background-size:contain;}
.step.center{margin:0 auto;}
.step.right{float:right;}
.step:after{position:absolute;content:'\e93f';font-family:'xeicon';right:-34px;top:50%;transform:translateY(-50%);color:#003365;font-weight:bold;font-size:23px;}
.step .inner{position:relative;}
.step img{margin-bottom:31px;}
.step h4{font-size:20px;font-weight:500;color:#003365;line-height:1;margin-bottom:21px;}
.step p{font-size:20px;font-weight:400;line-height:1;}

.dcm{border-top:1px solid #333;padding-top:46px;}
.dcm h3{float:left;width:12.5%;font-size:25px;font-weight:500;line-height:26px;position:relative;padding-left:21px;box-sizing:border-box;}
.dcm h3:before{position:absolute;content:'';background:url(../../images/theme/sub/index.png)no-repeat;left:0;top:0;width:8px;height:26px;}
.dcm p{float:left;width:87.5%;font-size:20px;font-weight:400;line-height:26px;}

/* 복리후생 */
.welfare table{border-collapse:collapse;width:100%;border-top:2px solid #003365;}
.welfare table tr th{background:#003364;font-size:16px;font-weight:400;color:#fff;letter-spacing:0.06em;line-height:50px;border-right:1px solid #fff;box-sizing:border-box;border-bottom:1px solid rgba(0, 51, 101, 0.4);}
.welfare table tr th:last-child{border-right:none;}
.welfare table tr td{padding:20px 0;font-size:16px;font-weight:500;color:#333;border-right:1px solid rgba(0, 51, 101, 0.4);border-bottom:1px solid rgba(0, 51, 101, 0.4);box-sizing:border-box;}
.welfare table tr td:first-child{background:rgba(0, 51, 101, 0.13);line-height:1.56;padding-left:28px;}
.welfare table tr td:last-child{border-right:none;}
.welfare table tr:last-child td{border-bottom:1px solid #333;}
.welfare table tr td >ul{padding:20px 0 20px 33px;}
.welfare table tr td >ul> li{padding:6px 0;}
.welfare table tr td ul li{font-size:16px;color:#555;font-weight:200;line-height:1.5;padding:6px 16px;position:relative;}
.welfare table tr td ul li span.number{position:absolute;top:7.5px;left:0;}
.welfare table tr td ul li ul li{padding-left:21px;}

@media all and (max-width:1366px){
	#sub-nav{padding-left:100px;}
}

@media all and (max-width:1199px){
		.section-wrap{padding:0 3%;}
	.greetings .section-wrap{padding:0;}
	#sub-nav{padding-left:90px;}
	
	.intro.gr-intro::before{top:17%;}
	.greetings .txt{width:74.25%;}
	.greetings .txt p{margin-bottom:47px;}
	.box{height:29px;}
	
	.vision{padding-top:155px;padding-bottom:150px;}
	
	.outline#outline4{margin-left:0;margin-top:-1px;}
	.outline#outline5{margin-left:-1px;}
	.outline#outline7{margin-left:0;}
	
	.cp-com .imgBg.full img{width:100%;}
	.cp-com h3{font-size:20px;}
	
	.directions .contents{margin-top:-108px;}
	.mtekMap{padding-left:10px;}
	#dt-2 .mtekMap{padding-left:10px;}
	.directions .info{padding:89px 20px 0 20px;}
	
	.eng .prd#prd1{padding:37px 0 0 0px;}
	.eng .prd#prd2{padding:137px 0 0 0px;}
	.eng .prd#prd7{padding:15px 0 0 0px;text-align:center;}
	.eng .prd#prd8{padding:84px 0 0 0px;text-align:center;}
	.eng#tab3 .prd#prd4 img, .eng .imgBox#prd5 img, .ems .imgBox#prd12 img, .ems .imgBox#prd13 img{width:100%;}
	
	.stf#tab2 .prd#prd10{padding-left:8%;}
	.feature::before{width:127px;left:-130px;}
	.circleBox2{padding:15px 0;}
	.circleBox2 .circle2{width:250px;height:250px;}
	
	.recruit .txt{font-size:22px;}
	.step{height:340px;}
	.step img{width:72%;margin-bottom:15px;}
	.step h4{font-size:19px;margin-bottom:10px;}
	.step p{font-size:19px;}
	.dcm h3{width:18.5%;}
	.dcm p{width:81.5%;}
	
	.welfare table tr td > ul{padding:20px 0 20px 24px;}
	
	.w-block{display:inline-block;}
}

@media all and (max-width:1068px){
	.eng .prd#prd1 img, .eng .prd#prd2 img{width:100%;} 
}

@media all and (max-width:890px){
	.scrollMotion .imgCont{width:100%;}
	/* .scrollMotion .imgCont .img{width:100%;} */
	.scrollMotion .imgCont .img img{width:100%;}
	.greetings .txt{width:88%;margin-top:-370px;padding:58px 30px 108px 60px;}
	
	.eng .imgBox#prd3 img{width:100%;}
} 

@media all and (max-width:767px){
	.ms-wrap{height:525px;}
	.s-top-title h1{font-size:43px;margin-bottom:13px;}
	.s-top-title span{font-size:21px;}
	#sub-nav{padding-left:0px;height:55px;}
	#sub-nav > ul > li{width:227px;}
	#sub-nav > ul > li:nth-of-type(2){width:210px;}
	#sub-nav > ul > li > a{line-height:55px;padding:0 20px;}
	#sub-nav .nav-menu ul li a{padding:6px 20px 6px 20px;}
	
	.s-section{padding-bottom:170px;}
	.s-title{padding:75px 3% 60px;}
	.s-title h2{font-size:34px;}
	
	.intro{margin-bottom:85px;}
	.intro h1{font-size:41px;padding-bottom:18px;}
	.greetings .txt{padding:40px 25px 60px 45px;}
	.greetings .txt h3{font-size:28px;margin-bottom:15px;}
	.greetings .txt p{font-size:16px;margin-bottom:32px;}
	.box{height:13px;}
	.ceo{font-size:16px;}
	.ceo span{font-size:20px;}
	
	.v-year{width:30%;min-width:167px;margin-bottom:28px;}
	.v-year img{width:100%;}
	.vision:before{font-size:185px;top:-134px;}
	.vs-slide{padding-top:30px;}
	.vs-slide .contents h2{font-size:55px;padding-top:72px;}
	.vs-slide .contents h2::before{height:78px;width:79px;background-size:contain;right:-91px !important;}
	.vs-slide .contents.c02 h2::before{width:65px;background-size:contain;}
	.vs-slide .contents.c03 h2::before{width:94px;background-size:contain;right:-112px !important;}
	.vs-slide .contents img{margin:23px 0 27px 60px;height:41px;}
	.vs-slide .contents.c02 img{margin-right:23px 0 27px 100px;}
	.vs-slide .contents.c03 img{margin:23px 0 27px 244px;}
	.vs-slide .contents p{font-size:19px;}
	.vs-slide .slick-dots li{margin:0 17px 0 0 ;}
	.vs-slide .slick-dots li::before{font-size:24px;}
	
	.history::before{left:35px;transform:none;}
	.history::after{left:32px;transform:none;}
	.ht{display:block;}
	.ht .title, .ht .contents{width:100%;}
	.ht .title{padding-left:47px;box-sizing:border-box;}
	.ht .contents{padding-bottom:65px;}
	.ht .title .intro{padding-bottom:30px;margin-bottom:20px;}
	.ht .title .intro::before{right:auto !important;left:-30px !important;}
	.ht .title .intro::after{right:auto;left:-45px !important;}
	.ht .ht-list{padding-top:20px;padding-left:56px !important;margin-bottom:23px;}
	.ht .ht-list .year{font-size:36px;}
	.ht .ht-list ul{margin-top:12px;}
	.ht .ht-list ul li{font-size:16px;padding-left:35px !important;}
	
	.ht.right .title .intro h1, .ht.right .ht-list .year{text-align:left;}
	 .ht.right .ht-list{padding-right:0;}
	.ht.right .ht-list ul li{padding-right:0;text-align:left;}
	.ht.right .ht-list ul li span{left:0px;right:auto;}
	
	.company{padding:70px 0 170px}
	.ss-title{margin-bottom:50px;}
	.ss-title h3{font-size:29px;}
	.ss-title h3::before{background-size:contain;width:57px;height:7px;}
	.outline#outline1, .outline#outline3, .outline#outline5, .outline#outline7{margin-left:0;}
	.outline#outline2, .outline#outline4, .outline#outline6, .outline#outline8{margin-left:-1px;} 
	.outline#outline3, .outline#outline4, .outline#outline5, .outline#outline6, .outline#outline7, .outline#outline8{margin-top:-1px;}
	
	.orz{padding-bottom:85px;}
	.orz-ceo{width:190px;height:190px;}
	.orz-ceo::before{width:205px;height:205px;}
	.orz-ceo::after{width:133px;height:50px;background-size:contain;}
	.orz-ceo h4{font-size:28px;}
	.mtek-team{padding-top:54px;}
	.people p{font-size:19px;}

	.cp-com{margin-bottom:25px;}
	
	.root_daum_roughmap{max-width:100%;}
	.root_daum_roughmap .wrap_map{height:387px !important;}
	.directions .contents{display:block;margin-top:0;}
	.contents.conBox, .contents.conBox2{margin-bottom:85px;}
	.directions .info, .directions .mtekMap{width:100%;}
	.mtekMap{padding-left:0 !important;}
	.directions .ss-title{margin-bottom:18px;}
	.directions .info{padding:47px 20px 0 20px}
	.directions .info ul li{font-size:18px;}
	.directions .info ul li ~ li{padding:3px 0;}
	.directions .info ul li:first-child{margin-bottom:5px;}
	
	.intro.intro2 p{margin-top:0;}
	
	#tab-menu{margin-bottom:55px;position:relative;}
	#tab-menu:before{content: "\e943"; font-family: 'xeicon'; font-size:19px; color:#555; position:absolute; top:50%; right:30px; width:0; transform:translateY(-50%);}
	#tab-button{display:none;}
	select::-ms-expand {display: none;}
	select:focus {outline: none;}
	select{width:100%; height:auto; line-height:normal; font-family:inherit; padding:7px 10px 6px; border:0; /* opacity:0; filter:alpha(opacity=0);  */-webkit-appearance: none;  /* 네이티브 외형 감추기 */ -moz-appearance: none; appearance: none; box-sizing:border-box; color:#555; font-size:19px;}
	#tab-select{display:block; width:100%; height:55px; background:rgba(0, 51, 101, 0.01); padding:10px; box-sizing:border-box; color:#444; border:1px solid #003365;}
	
	.ss-title p{padding:14px 0 5px;}
	.prd{text-align:center;}
	.eng .prd#prd1 img, .eng .prd#prd2 img{width:auto;}
	.eng .prd#prd1, .eng .prd#prd2, .eng .prd#prd4, .eng .prd#prd7, .eng .prd#prd8, .stf#tab2 .prd#prd10{padding:0 0 55px 0px;}
	.eng#tab2 .company h3, .stf#tab1 .company h3{font-size:24px;margin-bottom:48px;}
	.eng .imgBox#prd5, .eng .e-t-wrap, .eng .imgBox#prd6, .stf#tab1 .company .imgBox, .stf#tab3 .imgBox#prd11, .stf#tab3 .company .imgBox, .ems .prd, .welfare .w-table{overflow:auto;cursor:move;}
	.eng .imgBox#prd5 img, .eng .e-t-wrap table, .eng .imgBox#prd6 img, .stf#tab1 .company .imgBox img, .stf#tab3 .imgBox#prd11 img, .stf#tab3 .company .imgBox img, .ems .prd img, .welfare .w-table table{min-width:768px;}
	.eng#tab3 .company .imgBox{margin-bottom:15px !important;}
	.eng#tab3 .company .imgBox.last{margin-bottom:0 !important;}
	.eng#tab4 .prd h4{font-size:18px;}
	
	.stf#tab1 .imgBox h4{font-size:18px;line-height:50px;}
	.stf#tab1 .imgBox2 img{width:83%;margin:1.5% 1%;}
	.feature{padding:0;}
	.feature::before{left:0;top:-4px;width:50px;}
	.feature2{padding:15px 30px 15px 25px;}
	.feature2 li{padding:8px 0 8px 15px;}
	
	.ems .txtBox.tb1, .ems .txtBox.tb2{margin-bottom:18px;}
	
	.recruit .imgBox{margin-bottom:55px;}
	.recruit .txt{font-size:20px;}
	.step{margin:0 auto 30px !important;float:none !important;width:330px;height:330px;}
	.step.right{margin-bottom:0;}
	.step:after{right:auto;left:50%;transform:translate(-50%, 0);top:auto;bottom:-26px;;content:'\e942';}
	.step.right:after{content:'';}
	.step img{width:auto;}
	
	.dcm{padding-top:40px;}
	.dcm h3{width:100%;font-size:22px;margin-bottom:13px;}
	.dcm h3::before{background-size:contain;width:7px;height:24px;}
	.dcm p{width:100%;font-size:18px;}
	
	.welfare table tr td:first-child{padding-left:17px;}
	.welfare table tr td > ul{padding:10px 0 10px 20px;}
	.welfare table tr td ul li{padding:4px 16px;}
	.welfare table tr td ul li span.number{top:5.5px;}
	
	#rnd{margin-left:0;padding:0 0 46px;}
	#rnd .rd h4{font-size:18px;padding:22px 10px;}
	#rnd .rd h4::before{right:21px;}
	.rd-bg{margin:85px 0;height:335px;}
	.circleBox{padding:5px 0 55px;}
	.circleBox .circle{width:250px;height:250px;}
	.circleBox .circle#circle01{margin-right:-11px;}
	.circleBox .circle#circle02{margin-left:-11px;}
	.circleBox .circle h2{font-size:19px;}
	.modelBox .model#model1, .modelBox .model#model2{margin-bottom:15px;}
	/* .modelBox .model#model3 .imgBox, .modelBox .model#model4 .imgBox{height:154px;} */
	.modelBox .model h3{font-size:22px;}
	
	
	.wm-block{display:inline-block;}
	
	body{-webkit-text-size-adjust: 100%;}/* 사파리 오류*/
}

@media all and (max-width:525px){
	.ms-wrap{height:410px;}
	.s-top-title h1{font-size:35px;}
	.s-top-title span{font-size:19px;}
	
	#sub-nav{height:50px;}
	#sub-nav > ul > li > a{line-height:50px;}
	#sub-nav .nav-menu > a{font-size:15px;}
	#sub-nav .nav-home{width:53px;}
	#sub-nav .nav-home a{font-size:20px;}
	#sub-nav .nav-menu ul li a{font-size:14px;padding:4px 20px 4px 20px;}
	
	.s-section{padding-bottom:140px;}
	.s-title{padding:70px 3% 60px;}
	.s-title h2{font-size:29px;}
	
	.intro{margin-bottom:55px;}
	.intro.gr-intro.active::before{width:31.75%;}
	.intro h1{font-size:30px;padding-bottom:14px;letter-spacing:-0.06em;}
	.greetings .txt{margin-top:-423px;padding:33px 21px 38px 34px;width:91%;}
	.greetings .txt h3{font-size:22px;}
	.greetings .txt p{font-size:15px;margin-bottom:16px;}
	.box{height:10px;}
	.ceo{font-size:15px;}
	.ceo span{font-size:18px;margin-left:17px;}
	
	.vision{padding-top:99px;padding-bottom:107px;}
	.vision:before{font-size:113px;top:-84px;}
	.vs-slide .contents h2{font-size:43px;padding-top:58px;}
	.vs-slide .contents h2::before{height:59px;width:54px;right:-63px !important;}
	.vs-slide .contents.c02 h2::before{width:49px;}
	.vs-slide .contents.c03 h2::before{width:71px;right:-36px !important;}
	.vs-slide .contents img{height:30px;margin:16px 0 18px 60px !important;}
	.vs-slide .contents.c03 img{margin:16px 0 18px 173px !important;}
	.vs-slide .contents p{font-size:17px;}
	
	.vs-slide .slick-dots li{margin:0 11px 0 0;}
	.vs-slide .slick-dots li:before{font-size:21px;}
	
	.history{padding-bottom:40px;}
	.history::before{left:6%;}
	.history::after{left:5.3%;}
	.ht .contents{padding-bottom:34px;}
	.ht .title .intro{margin-bottom:13px;}
	.ht .title .intro::before{left:-38px !important;}
	.ht .title .intro::after{left:-48px !important;}
	.ht .ht-list .year{font-size:29px;}
	.ht .ht-list{padding-top:14px;padding-left:54px !important;margin-bottom:13px;}
	.ht .ht-list ul li{font-size:15px;padding:4px 0;padding-left:32px !important;}
	.ht .ht-list ul li span{top:4px;}
	
	.company{padding:55px 0 140px}
	.ss-title{margin-bottom:45px;}
	.ss-title h3{font-size:25px;letter-spacing:-0.03em;}
	.outline{margin-left:0 !important;height:210px;}
	.outline#outline2{margin-top:-1px;}
	.outline img{margin-bottom:16px;margin-top:50px;}
	.outline h4{font-size:16px;margin-bottom:10px;}
	.outline p{font-size:16px;}
	
	.orz{padding-bottom:55px;}
	.team-title h4{font-size:18px;line-height:53px;}
	.mk-team .team-wrap{padding-top:20px;}
	.role-wrap{padding-top:3px;}
	.team-wrap ul li:first-child{margin-top:27px;}
	.team-wrap ul li{font-size:16px;line-height:46px;margin:11px 0;}
	.people{height:200px;}
	.people img{margin-top:34px;margin-bottom:9px;}
	.people p{font-size:18px;}
	
	.cp-com{margin-bottom:15px;}
	.cp-com .inner{padding:12px;}
	.cp-com .imgBg{height:155px;}
	.cp-com h3{font-size:18px;}
	
	.contents.conBox, .contents.conBox2{margin-bottom:55px;}
	.root_daum_roughmap .wrap_map{height:321px !important;}
	.directions .info{padding:28px 15px 0 15px;}
	.directions .info ul li{font-size:16px;}
	.directions .info ul li ~ li{padding:2px 0;}
	.directions .info ul li:first-child{line-height:1.2;}
	
	#tab-menu{margin-bottom:45px;}
	#tab-select{height:47px;}
	select{font-size:17px;}
	
	.ss-title p{font-size:16px;padding:14px 0 0px}
	.eng .prd#prd1, .eng .prd#prd2, .eng .prd#prd4,  .eng .prd#prd7, .eng .prd#prd8{padding:0 0 40px 0px}
	.eng table tr th, .eng table tr td{font-size:15px;padding:12px 4px;}
	table.table tr th, table.table tr td{display:block;}
	.eng#tab2 .company h3, .stf#tab1 .company h3{font-size:21px;margin-bottom:34px;}
	.eng .prd#prd4 img{width:100%;}
	.eng#tab3 .company .imgBox{margin-bottom:9px !important;}
	
	.stf#tab1 .imgBox h4{font-size:17px;line-height:45px;}
	.stf#tab1 .imgBox2 img{width:91%;}
	.feature li{font-size:16px;padding:6px 0;}
	.feature2{padding:12px 25px 12px 20px;}
	.feature2 li{font-size:16px;padding:5px 0 5px 15px;line-height:1.38;}
	.feature2 li::before{top:17px;}
	
	.ems .txtBox.tb1, .ems .txtBox.tb2, .ems .txtBox.tb3{margin-bottom:13px;}
	.ems .txtBox h4{font-size:17px;line-height:45px;}
	.ems .txtBox p{font-size:16px;min-height:93px;}
	.circleBox2 .circle2{height:230px;width:230px;}
	.circleBox2 .circle2 ul h4{font-size:18px;margin-bottom:6px;}
	.circleBox2 .circle2 ul li{font-size:15px;padding:1px 0px 1px 10px;}
	.circleBox2 .circle2 ul li::before{top:11px;}
	
	.recruit .imgBox{margin-bottom:40px;}
	.recruit .txt{font-size:17px;}
	.dcm{padding-top:34px;}
	.dcm h3{font-size:21px;padding-left:18px;}
	.dcm h3::before{width:6px;height:20px;}
	.dcm p{font-size:17px;}
	
	.welfare table tr th{font-size:15px;line-height:45px;}
	.welfare table tr td{padding:12px 0;}
	.welfare table tr td:first-child{padding-left:13px;}
	.welfare table tr td ul li{font-size:15px;padding:2px 16px;}
	.welfare table tr td ul li span.number{top:2.5px;}
	
	#rnd{padding:0 0 26px;}
	.rd-bg{margin:55px 0;height:285px;background-attachment:scroll;}
	.circleBox{display:block;}
	.circleBox .circle{float:none;margin:0 auto !important;}
	.circleBox .circle#circle01{margin-bottom:-30px !important;}
	.modelBox .model{margin-bottom:30px !important;}
	.modelBox .model#model4{margin-bottom:0 !important;;}
	.modelBox .model .imgBox{height:auto;}
	.modelBox .model img{margin-bottom:20px;}
	.modelBox .model h3{font-size:20px;}
	
	.ws-block{display:inline-block;}
}

@media all and (max-width:360px){
	
}