@charset 'utf-8';
@keyframes fadeIn {
    0% { opacity:0; }
    100% { opacity:1; }
}

/* COLOR FILTER 출처 : https://codepen.io/sosuke/pen/Pjoqqp */

#wrap {  }
div.innerWrap { /*min-width:1240px;*/ max-width:1200px; margin:0 auto;  position: relative; }

#header { position: relative; z-index:2; height:158px; }
#header div.headerTop { height:104px; padding:20px 0;  }
#header div.headerTop  h1 { display:inline-block; margin-right:-5px; width:25% }
#header div.headerTop  h1 a { display: flex; align-items: center; justify-content: space-between; font-weight:700; font-family: 'S-CoreDream-7ExtraBold', sans-serif; font-size:2.25em; letter-spacing: 0.05em; }
#header div.headerTop  h1 a img { display: block; }
#header div.headerTop div.topRight { display:inline-block;  vertical-align: top;  margin-right:-5px; width:74%; text-align:right } 
#header div.headerTop div.topRight div.search { display:inline-block; vertical-align: top;  width:300px; border:1px solid #e5e5e5; height:58px; text-align:left  }
#header div.headerTop div.topRight div.search input { display:inline-block;  border:none; line-height:56px; height:56px; width:240px; vertical-align: top;  }
#header div.headerTop div.topRight div.search a { vertical-align: top;  display:inline-block; width:32px; height:32px; background: url('../images/searchBt.svg') no-repeat;  font-size:0px; text-indent:-1000; margin-top:12px}



#header div#gnb { height:57px;  font-weight: 500; background:#26688d}
#header div#gnb span.subName { display: none; }
#header div#gnb div.navi { width:1200px; height:100%; margin:0 auto}
#header div#gnb div.navi ul.navi { display: flex; align-items: stretch; height:100%; /* margin-left:30px; */  }
#header div#gnb div.navi ul.navi li { display: block; padding:0 40px; line-height:57px; position:relative; }
#header div#gnb div.navi ul.navi a { height:100%; overflow:hidden; position: relative; color:#fff }
#header div#gnb div.navi ul.navi a:hover span {color:#F7F771; } 
#header div#gnb div.navi ul.navi.depth1 > li > a { font-size:1.1em; }
#header div#gnb div.navi ul.navi.depth1 > li > a.selected { font-weight:600; color:#F7F771;}
#header div#gnb div.navi ul.navi.depth1 > li > a::after { content:''; display: block; width:100%; position: absolute; bottom:0; left:0; height:0;  }
#header div#gnb div.navi ul.navi.depth1 > li:hover > a::after,
#header div#gnb div.navi ul.navi.depth1 > li > a.selected::after { height:5px; transition: 0.2s;  }
#header div#gnb div.navi ul.navi div.child {  display: none; color:#FFF; position: absolute; top:57px;  left:-10px; padding:6px 0px;}
#header div#gnb div.navi ul.navi li.selected div.child { display:block; z-index:0; }
#header div#gnb div.navi ul.navi li:hover div.child { display:block; z-index:1; }
#header div#gnb div.navi ul.navi li:hover:nth-child(2) div.child { display:block; z-index:1; }
#header div#gnb div.navi ul.navi div.child ul.naviSub { width:185px; font-weight: 300; font-size:0.9em;  background: #26688d;  padding:0 10px; Border-radius:5px;  }
#header div#gnb div.navi ul.navi div.child ul.naviSub li { padding:0 0; display:block; width:100%; border-top:1px solid #5589a6; text-align:center; line-height:40px;  }
#header div#gnb div.navi ul.navi div.child ul.naviSub li:first-child { border-top:none }
#header div#gnb div.navi ul.navi div.child ul.naviSub a { padding:0 0; transition: background-color 0.3s; text-align:center; line-height:40px; }
#header div#gnb div.navi ul.navi div.child ul.naviSub a span { text-align:center }
#header div#gnb div.navi ul.navi div.child ul.naviSub a.selected,
#header div#gnb div.navi ul.navi div.child ul.naviSub a:hover { border-radius: 5px; transition: background-color 0.3s; }
#header div#gnb div.navi ul.navi li.product div.child ul.navi { display:inline-block; margin-left:36% }
#header div#gnb div.navi ul.navi li.product div.child ul.navi li{ float:left !important;}
#header div#gnb div.navi ul.navi li.product div.child ul.navi li:nth-child(9){ clear:both !important; display:block !important;}

#header div.headerTop div.topRight div.control { position:relative;  display:inline-block; width:38px; vertical-align: top; margin:0px 0 0 8px; }
#header div.headerTop div.topRight div.control button#gnbSwitch { }
#header div.headerTop div.topRight div.control button#gnbSwitch span.sound_only { display: none; }
#header div.headerTop div.topRight  div.control button#gnbSwitch .bar {position:absolute;right:0px; top:0px;width:38px;height:5px;border-radius:3px;background:#26688D;transition:all .2s; }
#header div.headerTop div.topRight  div.control button#gnbSwitch .bar.bar1 {top:12px;}
#header div.headerTop div.topRight  div.control button#gnbSwitch .bar.bar2 {top:24px;}
#header div.headerTop div.topRight  div.control button#gnbSwitch .bar.bar3 {top:36px;}

#header div.global { width:120px; display: none; align-items: center; justify-content: flex-end; }
#header div.global a.language { display: block; padding:0.5em 1.5em; font-size:1.1em; background:#e94638; color:#FFF; border-radius: 5px; }

#visual { position:relative;  height:719px;  background: url('../images/bg.svg') no-repeat; background-size:cover }
#visual  div.hiddenImg { display:none; }
#visual div.innerWrap div.robot { position: absolute;  animation: myAnimation1 4s infinite;   animation-direction: alternate; }
@keyframes myAnimation1 {
      0%   {  left: 0%;  top: 30px; }
      25%  { left: 2%;  top: 50px; }
      50%  { left: 0%;  top:  30px; }
      75%  { left: 2%;  top: 50px; }
      100% { left: 0%; top: 30px; }
}
#visual div.innerWrap div.crane {  position: absolute;  animation: myAnimation2 5s infinite;   animation-direction: alternate; }
@keyframes myAnimation2 {
      0%   {  left: 6%;  top: 190px; }
      25%  { left: 4%;  top: 210px; }
      50%  { left: 6%;  top: 190px; }
      75%  { left: 4%;  top: 210px; }
      100% { left: 6%; top: 190px; }
}
#visual div.innerWrap div.machine {   position: absolute;  animation: myAnimation3 7s infinite;   animation-direction: alternate; }
@keyframes myAnimation3 {
      0%   {  left: 46%;  top: 50px; }
      25%  { left: 47.8%;  top: 30px; }
      50%  { left: 46%;  top: 50px; }
      75%  { left: 47.8%;  top: 30px; }
      100% { left: 46%; top: 50px; }
}
#visual div.innerWrap div.data { position: absolute;  animation: myAnimation4 6s infinite;   animation-direction: alternate; }
@keyframes myAnimation4 {
      0%   { right: 9.6%;  top: 30px; }
      25%  { right: 7%;  top: 10px; }
      50%  { right: 9.6%;  top: 30px; }
      75%  { right: 7%;  top: 10px; }
      100% { right: 9.6%; top: 30px; }
}
#visual div.innerWrap div.export { position: absolute;  animation: myAnimation5 7s infinite;   animation-direction: alternate; }
@keyframes myAnimation5 {
      0%   { right: 0%;  top: 220px; }
      25%  { right: 5%;  top: 200px; }
      50%  { right: 0%;  top: 220px; }
      75%  { right: 5%;  top: 200px; }
      100% { right: 0%; top: 220px; }
}
#visual div.innerWrap div.shop {  position: absolute;  animation: myAnimation6 4s infinite;   animation-direction: alternate; }
@keyframes myAnimation6 {
      0%   { right: 0%;  top: 432px; transform: rotate(10deg) }
      25%  { right: 0%;  top: 432px; transform: rotate(0deg) }
      50%  { right: 0%;  top: 432px; transform: rotate(-10deg)  }
      75%  { right: 0%;  top: 432px; transform: rotate(0deg) }
      100% { right: 0%; top: 432px; transform: rotate(10deg) }
}
#visual div.innerWrap div.mold {  position: absolute;  animation: myAnimation7 6s infinite;   animation-direction: alternate; }
@keyframes myAnimation7 {
       0%   { left: 48%;  top: 500px; }
      25%  { left: 50%;  top: 516px; }
      50%  { left: 48%;  top: 500px; }
      75%  { left: 50%;  top: 516px; }
      100% { left: 48%; top: 500px; }
}
#visual div.innerWrap div.vision {  position: absolute;  animation: myAnimation8 6s infinite;   animation-direction: alternate; }
@keyframes myAnimation8 {
       0%   { left: 6.3%;  top: 500px; }
      25%  { left: 4.3%;  top: 516px; }
      50%  { left: 6.3%;  top: 500px; }
      75%  { left: 4.3%;  top: 516px; }
      100% { left: 6.3%; top: 500px; }
}
#visual div.innerWrap div.cable {  position: absolute;  animation: myAnimation9 6s infinite;   animation-direction: alternate; }
@keyframes myAnimation9 {
       0%   { left: 25%;  top: 100px; }
      25%  { left: 25%;  top: 110px; }
      50%  { left: 25%;  top: 100px; }
      75%  { left: 25%;  top: 110px; }
      100% { left: 25%; top: 100px; }
}


.fosl, .row {
  animation-duration: 1.5s;
  animation-name: slidein;
}
.mofont {
  animation-duration: 1s;
  animation-name: slidein2;
}

@keyframes slidein {
  from {
    margin-left: 100%;
    width: 300%
  }

  to {
    margin-left: 0%;
    width: 100%;
  }
}
@keyframes slidein2 {
  from {
    font-size: 1px;

  }

  to {

  }
}



#veyor { clear:both; display:block; min-height:457px; padding-top:54px; }
#veyor div.innerWrap{}
#veyor div.innerWrap div.title{ display:block; font-size:2.6rem; font-weight:bold; letter-spacing:-0.02em; text-align:center; }
#veyor div.innerWrap ul {width:100%; margin-top:20px; }
#veyor div.innerWrap ul li{ display:inline-block;  width:265px; margin-left:1.6%; margin-right:-0.4%  }
#veyor div.innerWrap ul li:first-child { margin-left:0%; }
#veyor div.innerWrap ul li a span.thumb { display: flex; align-items: center; justify-content: flex-end; border:1px solid #e5e5e5; width:100%; height:208px; text-align:center; border-radius: 5px; }
#veyor div.innerWrap ul li a span.thumb img { width:100%; height:auto }
#veyor div.innerWrap ul li a span.desc { display:block; width:100%; text-align:center; margin-top:20px  }
#veyor div.innerWrap ul li a:hover span.thumb { border:1px solid #26688d; }

#Almight { clear:both; display:block; min-height:606px; background: url('../images/almightBg.png') no-repeat; background-size:cover; padding-top:54px;  }
#Almight div.innerWrap{}
#Almight div.innerWrap div.title{ display:block; font-size:2.6rem; font-weight:bold; letter-spacing:-0.02em; text-align:center; color:#fff  }
#Almight div.innerWrap ul {width:100%; margin-top:20px; }
#Almight div.innerWrap ul li{ display:inline-block;  width:265px; margin-left:1.6%; margin-right:-0.4%; border:1px solid #e5e5e5; border-radius: 5px; background:#fff  }
#Almight div.innerWrap ul li:first-child { margin-left:0%; }
#Almight div.innerWrap ul li a span.thumb { display: flex; align-items: center; justify-content: center;  width:100%; height:260px; text-align:center;  }
#Almight div.innerWrap ul li a span.thumb img { width:100%; height:auto }
#Almight div.innerWrap ul li a span.desc { font-weight:bold; font-size:18px; line-height:57px; display:block; width:100%; text-align:center; margin-top:20px; border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5;   }
#Almight div.innerWrap ul li a span.txt { display:block; font-size:14px; text-align:center; padding:18px 0;  }
#Almight div.innerWrap ul li a span.txt strong { display:block; font-size:18px; font-weight:normal }
#Almight div.innerWrap ul li:hover { border:1px solid #26688d; }

#steel{ display:inline-block;  width:590px }
#steel div.title{ display:block; font-size:2.6rem; font-weight:bold; letter-spacing:-0.02em; text-align:center;   }
#steel div.content { border:1px solid #e5e5e5; border-radius: 5px; }
#steel div.content div { display:inline-block }
#steel div.content div.thumb{ padding:30px 0 0 5px }
#steel div.content div.desc{  vertical-align: top;  margin-top:22px }
#steel div.content div.desc table { width:100% }
#steel div.content div.desc table thead{}
#steel div.content div.desc table thead tr td:nth-child(1){ width:221px;}
#steel div.content div.desc table thead tr td:nth-child(1) span { width:211px }
#steel div.content div.desc table thead tr td:nth-child(2){ width:51px;  }
#steel div.content div.desc table tbody tr td { padding:2px 0; font-size:0.8em }
#steel div.content div.desc table tbody tr:nth-child(1) td { padding:8px 0 3px }
#steel div.content div.desc table tbody tr td:nth-child(2){ text-align:center }
#steel div.content div.desc table thead span{ display:block; padding:10px 0;  background:#650062; color:#fff; font-size:18px; font-weight:bold; text-align:center; border-radius: 5px;  }
#steel div.content div.desc table tbody tr td a:hover { color:#26688d; text-decoration:underline }

#icon { display:inline-block;  vertical-align: top; }
#icon div{ display:inline-block;  vertical-align: top;  width:165px; height:165px;  }
#icon div a { display:block; width:100%; height:100%; border-radius: 85px; text-align:center; padding-top:110px; }
#icon div a span { display:block;  color:#fff; font-size:18px; font-weight:bold }
#icon div.youtube { margin:83px 0 0 40px }
#icon div.youtube a{ background: url('../images/youtub.png') center 35px no-repeat #FF0000; }
#icon div.youtube a:hover{ background: url('../images/youtub.png') center 35px no-repeat #26688d; }
#icon div.pds {  margin:20px 0 0 30px }
#icon div.pds a{ background: url('../images/server-solid.svg') center 30px no-repeat #39AEE5; }
#icon div.pds a:hover{ background: url('../images/server-solid.svg') center 30px no-repeat #26688d; }
#icon div.estimate { margin:73px 0 0 30px }
#icon div.estimate a{ background: url('../images/clipboard-regular.svg') center 30px no-repeat #EA7B41;  }
#icon div.estimate a:hover{ background: url('../images/clipboard-regular.svg') center 30px no-repeat #26688d;  }


#container { position:relative; z-index:1; min-height:730px; }
#wrap.home #container { padding-top:0; }


#visualSub { height:403px; background: url('../images/subVisual01.png') no-repeat; background-size:cover; display: flex; align-items: center; justify-content: flex-end;   }
#visualSub div.innerWrap div { padding:10px; 20px; background-color:rgba(0, 0, 0, 0.68); text-align:center  }
#visualSub div.innerWrap div span { font-size:60px; font-weight:bold;  color:#fff }

#location { height:48px; background:#F5F5F5; }
#location div.innerWrap ul{}
#location div.innerWrap ul li{ display:inline-block; margin-right:-5px; background: url('../images/line.png') 0 1px no-repeat; padding: 0 8px; font-size:14px; }
#location div.innerWrap ul li:first-child { background:none; padding-left:0px }
#location div.innerWrap ul li a { padding-top:14px }
#location div.innerWrap ul li a.home { display:block; width:14px; height:12px; background: url('../images/home.png') no-repeat;  font-size:0px; text-indent:-1000; margin-top:18px  } 
#location div.innerWrap ul li:last-child { font-weight:bold }

#contents { margin-top:42px }
#contents div.innerWrap {}
#contents div.innerWrap div.aside{ display:inline-block; margin-right:-5px; vertical-align: top; margin-right:40px }
#contents div.innerWrap div.content{ display:inline-block; margin-right:-5px; vertical-align: top;  }
#contents div.innerWrap div.aside div.sideMenu { border:1px solid #e5e5e5; border-radius: 5px; width:295px; padding:10px; }
#contents div.innerWrap div.aside div.sideMenu div.title { height:83px; background:#26688D; color:#fff; font-weight:bold; font-size:24px; text-align:center; line-height:83px; border-radius: 5px; }
#contents div.innerWrap div.aside div.sideMenu ul{}
#contents div.innerWrap div.aside div.sideMenu ul li{ display:block; border-bottom:1px solid #e5e5e5; text-align:center; height:62px; padding-top:10px  }
#contents div.innerWrap div.aside div.sideMenu ul li:last-child { border-bottom:none; }
#contents div.innerWrap div.aside div.sideMenu ul li a { display:block; font-size:18px; line-height:44px; width:100%;  }
#contents div.innerWrap div.aside div.sideMenu ul li a:hover { background:#184158; color:#fff; border-radius: 5px; }  
#contents div.innerWrap div.aside div.sideMenu ul li a.on { background:#184158; color:#fff; border-radius: 5px; }  
#contents div.innerWrap div.aside div.youtube { margin-top:20px }
#contents div.innerWrap div.aside div.youtube a{ display:block; line-height:88px; color:#fff; font-weight:bold; font-size:18px; background: url('../images/youtub.png') 32px 22px no-repeat #FF0000; padding-left:116px;  border-radius: 5px; }
#contents div.innerWrap div.aside div.youtube a:hover{ display:block; line-height:88px; color:#fff; font-weight:bold; font-size:18px; background: url('../images/youtub.png') 32px 22px no-repeat #26688D; padding-left:116px;  border-radius: 5px;}
#contents div.innerWrap div.aside div.youtube sup { font-size:10px }
#contents div.innerWrap div.content { width:865px }
#contents div.innerWrap div.content div.title { display:block; width:100%;  font-size:2.8em; font-weight:bold; text-align:center; margin-bottom:20px;  }

/* 제품리스트 */
#contents div.innerWrap div.content div.list {}
#contents div.innerWrap div.content div.list ul {}
#contents div.innerWrap div.content div.list ul li{ display:inline-block; margin-right:-5px; width:264px; margin-bottom:65px; margin-left:36px; }
#contents div.innerWrap div.content div.list ul li:nth-child(1) { margin-left:0px; }
#contents div.innerWrap div.content div.list ul li:nth-child(4) { margin-left:0px; }
#contents div.innerWrap div.content div.list ul li:nth-child(7) { margin-left:0px; }
#contents div.innerWrap div.content div.list ul li:nth-child(10) { margin-left:0px; }
#contents div.innerWrap div.content div.list ul li a span.thumb { display: flex; align-items: center; justify-content: center; width:100%; height:264px; border:1px solid #e5e5e5; border-radius: 5px; }
#contents div.innerWrap div.content div.list ul li a span.desc { display:block; text-align:center; margin-top:18px }
#contents div.innerWrap div.content div.list ul li a:hover span.thumb { display: flex; align-items: center; justify-content: center; width:100%; height:264px; border:1px solid #26688d; }
#contents div.innerWrap div.content div.paging { border-top:1px solid #e5e5e5; margin-top:-20px; padding-top:30px; }
#contents div.innerWrap div.content div.paging ul{ display:block; margin:0 auto; text-align:center; }
#contents div.innerWrap div.content div.paging ul li{ display:inline-block; margin-right:5px; vertical-align: top;  }
#contents div.innerWrap div.content div.paging ul li:last-child{ margin-right:-5px; }
#contents div.innerWrap div.content div.paging ul li a {display: flex; align-items: center; justify-content: center;  border:1px solid #e5e5e5; width:35px; height:35px;  }
#contents div.innerWrap div.content div.paging ul li a:hover { border:1px solid #26688D; color:#26688D;   }

#contents div.innerWrap div.content div.paging1 { margin-top:30px; }
#contents div.innerWrap div.content div.paging1 ul{ display:block; margin:0 auto; text-align:center; }
#contents div.innerWrap div.content div.paging1 ul li{ display:inline-block; margin-right:5px; vertical-align: top;  }
#contents div.innerWrap div.content div.paging1 ul li:last-child{ margin-right:-5px; }
#contents div.innerWrap div.content div.paging1 ul li a {display: flex; align-items: center; justify-content: center;  border:1px solid #e5e5e5; width:35px; height:35px;  }
#contents div.innerWrap div.content div.paging1 ul li a:hover { border:1px solid #26688D; color:#26688D;   }

#contents div.innerWrap div.content div.paging2 { margin-top:0px; border-top:1px solid #e5e5e5; padding-top:30px }
#contents div.innerWrap div.content div.paging2 ul{ display:block; margin:0 auto; text-align:center; }
#contents div.innerWrap div.content div.paging2 ul li{ display:inline-block; margin-right:5px; vertical-align: top;  }
#contents div.innerWrap div.content div.paging2 ul li:last-child{ margin-right:-5px; }
#contents div.innerWrap div.content div.paging2 ul li a {display: flex; align-items: center; justify-content: center;  border:1px solid #e5e5e5; width:35px; height:35px;  }
#contents div.innerWrap div.content div.paging2 ul li a:hover { border:1px solid #26688D; color:#26688D;   }

/*제품상세*/
#contents div.innerWrap div.content div.detail {}
#contents div.innerWrap div.content div.detail div.view{ display:inline-block; width:407px; vertical-align: top; margin-right:25px }
#contents div.innerWrap div.content div.detail div.on{ display:block; width:100%; vertical-align: top; margin-right:25px }
#contents div.innerWrap div.content div.detail div.on div.model { border-top:1px solid #666; border-bottom:1px solid #999; padding:2% 0; text-align:center; font-size:18px; font-weight:bold; margin-bottom:20px; background:#f5f5f5   }
#contents div.innerWrap div.content div.detail div.info { display:inline-block; width:426px; vertical-align: top; margin-right:-5px; border-top:1px solid #707070 }
#contents div.innerWrap div.content div.detail div.view div.big { width:100%; height:276px; border:1px solid #e5e5e5; display: flex; align-items: center; justify-content: center; border-radius: 5px; } 
#contents div.innerWrap div.content div.detail div.view div.small { margin-top:10px; }
#contents div.innerWrap div.content div.detail div.view div.small div { display:inline-block; margin-right:5px; vertical-align: top;  }
#contents div.innerWrap div.content div.detail div.view div.small div:nth-child(3) { margin-right:-5px }
#contents div.innerWrap div.content div.detail div.view div.small div:nth-child(6) { margin-right:-5px }
#contents div.innerWrap div.content div.detail div.view div.small div:nth-child(9) { margin-right:-5px }
#contents div.innerWrap div.content div.detail div.view div.small div a span { width:129px; height:84px; border:1px solid #e5e5e5;  display: flex; align-items: center; justify-content: center; border-radius: 5px; }
#contents div.innerWrap div.content div.detail div.view div.small div a:hover span { border:1px solid #26688d }
#contents div.innerWrap div.content div.detail div.info div.title { font-size:18px; font-weight:bold; text-align:center; line-height:54px }
#contents div.innerWrap div.content div.detail div.info table { width:100%; }
#contents div.innerWrap div.content div.detail div.info table tr td { border-top:1px solid #e5e5e5; height:44px; text-align:center;  }
#contents div.innerWrap div.content div.detail div.info table tr td:first-child { border-right:1px solid #e5e5e5; }
#contents div.innerWrap div.content div.detail div.info table tr:last-child td { border-bottom:1px solid #e5e5e5; } 
#contents div.innerWrap div.content div.detail div.info table tr td.extra { border-right:none }
#contents div.innerWrap div.content div.detail div.info table tr td.extraH { height:72px }
#contents div.innerWrap div.content div.detail div.info table tr:nth-child(even) td { background:#F5F5F5 }
#contents div.innerWrap div.content div.detail section { margin-top:60px }
#contents div.innerWrap div.content div.detail section div.title{ display:block; font-size:30px; font-weight:bold; text-align:center;  }
#contents div.innerWrap div.content div.detail section article { border:1px solid #e5e5e5; border-radius: 5px; padding:40px 20px }
#contents div.innerWrap div.content div.detail section article img { text-align:center; margin:0 auto; display: flex; align-items: center; justify-content: center;  min-width:25px; }
#contents div.innerWrap div.content div.detail section article div.unit { font-size:14px; text-align:right; margin-bottom:10px}
#contents div.innerWrap div.content div.detail section article table { width:100%; }
#contents div.innerWrap div.content div.detail section article .extra { margin-top:40px; }
#contents div.innerWrap div.content div.detail section article table tr th { border-left:1px solid #e5e5e5; background:#26688D; color:#fff; font-weight:bold; text-align:center; height:45px }
#contents div.innerWrap div.content div.detail section article table tr th:first-child { border-left:none }
#contents div.innerWrap div.content div.detail section article table tr td { border-left:1px solid #e5e5e5; border-top:1px solid #e5e5e5; text-align:center; height:45px; padding:0 20px }
#contents div.innerWrap div.content div.detail section article table tr td:first-child { border-left:none }
#contents div.innerWrap div.content div.detail section article table tr:last-child td{ border-bottom:1px solid #e5e5e5; }
#contents div.innerWrap div.content div.detail section article table tr td.extra { border-bottom:1px solid #e5e5e5 }
#contents div.innerWrap div.content div.detail section article table tr:nth-child(even) td { background:#F5F5F5 }


/*회사소개*/
#contents div.innerWrap div.content div.greetings {}
#contents div.innerWrap div.content div.greetings div.word{ display:block; padding:60px 30px 0 30px; line-height:24px;   }
#contents div.innerWrap div.content div.greetings div.word p { display:block; margin-bottom:30px; }
#contents div.innerWrap div.content div.greetings div.word p span { font-size:24px; background:#F1F1F1 }
#contents div.innerWrap div.content div.greetings div.name { display:block; font-size:18px;  padding-top:50px; }

#contents div.innerWrap div.content div.history { min-height:500px; background: url('../images/historyBg.png') right top no-repeat  }
#contents div.innerWrap div.content div.history ul { width:595px }
#contents div.innerWrap div.content div.history ul li { border-top:1px solid #e5e5e5; padding:20px 0;  }
#contents div.innerWrap div.content div.history ul li:last-child { border-bottom:1px solid #e5e5e5;}
#contents div.innerWrap div.content div.history ul li span { display:inline-block;  vertical-align: top; margin-right:-5px; }
#contents div.innerWrap div.content div.history ul li span.year { width:98px; height:34px; background:#26688D; color:#fff; border-radius: 5px;; text-align:center; line-height:34px; }
#contents div.innerWrap div.content div.history ul li span.desc { margin-left:20px; line-height:24px; }
#contents div.innerWrap div.content div.history ul li:nth-child(even) { background:#f5f5f5 } 

#contents div.innerWrap div.content div.certificate{}
#contents div.innerWrap div.content div.certificate ul {}
#contents div.innerWrap div.content div.certificate ul li{ display:inline-block; margin-right:-5px; width:264px; margin-bottom:65px; margin-left:36px; }
#contents div.innerWrap div.content div.certificate ul li:nth-child(1) { margin-left:0px; }
#contents div.innerWrap div.content div.certificate ul li:nth-child(4) { margin-left:0px; }
#contents div.innerWrap div.content div.certificate ul li:nth-child(7) { margin-left:0px; }
#contents div.innerWrap div.content div.certificate ul li:nth-child(10) { margin-left:0px; }
#contents div.innerWrap div.content div.certificate ul li a span.thumb { display: flex; align-items: center; justify-content: center; width:100%; height:368px; border:1px solid #e5e5e5; border-radius: 5px; }
#contents div.innerWrap div.content div.certificate ul li a span.desc { display:block; text-align:center; margin-top:18px }
#contents div.innerWrap div.content div.certificate ul li a:hover span.thumb { display: flex; align-items: center; justify-content: center; width:100%; height:368px; border:1px solid #26688d; }

#contents div.innerWrap div.content div.location{}
#contents div.innerWrap div.content div.location ul { margin-top:30px }
#contents div.innerWrap div.content div.location ul li { padding:18px 0; border-bottom:1px solid #e5e5e5; padding-left:20px  }
#contents div.innerWrap div.content div.location ul li:first-child { border-top:1px solid #e5e5e5 }
#contents div.innerWrap div.content div.location ul li:nth-child(even) { background:#f5f5f5 } 

/*VISION SYSTEM*/
#contents div.innerWrap div.content div.vision{}
#contents div.innerWrap div.content div.vision ul {}
#contents div.innerWrap div.content div.vision ul li { border:1px solid #e5e5e5; min-height:192px; margin-top:50px; padding:20px; border-radius: 5px;  }
#contents div.innerWrap div.content div.vision ul li:first-child { margin-top:0px }
#contents div.innerWrap div.content div.vision ul li div { width:100%; display:inline-block; margin-right:-5px; }
#contents div.innerWrap div.content div.vision ul li div.thumb { width:251px; height:251px; border-radius: 5px;  }
#contents div.innerWrap div.content div.vision ul li div.thumb span { display: flex; align-items: center; justify-content: center;  }
#contents div.innerWrap div.content div.vision ul li div.thumb img {  border-radius: 5px;  }
#contents div.innerWrap div.content div.vision ul li div.desc { width:545px;  vertical-align: top; margin-left:30px; color:#999 }
#contents div.innerWrap div.content div.vision ul li div.desc span { font-size:30px; font-weight:bold; display:block; margin:20px 0 15px; color:#333  }

/*gallery*/
#contents div.innerWrap div.content div.category { text-align:center; margin-bottom:30px  }
#contents div.innerWrap div.content div.category a { display:inline-block; border:1px solid #e5e5e5; padding:15px 30px; margin-right:5px; border-radius: 5px;  }
#contents div.innerWrap div.content div.category a:hover { background:#26688D; color:#fff; font-weight:bold;  }
#contents div.innerWrap div.content div.category a.select { background:#26688D; color:#fff; font-weight:bold;  } 
#contents div.innerWrap div.content div.category a span { font-size:18px; }
#contents div.innerWrap div.content div.gallery {}
#contents div.innerWrap div.content div.gallery ul {}
#contents div.innerWrap div.content div.gallery ul li{ display:inline-block; margin-right:-5px; width:264px; margin-bottom:65px; margin-left:36px; }
#contents div.innerWrap div.content div.gallery ul li:nth-child(1) { margin-left:0px; }
#contents div.innerWrap div.content div.gallery ul li:nth-child(4) { margin-left:0px; }
#contents div.innerWrap div.content div.gallery ul li:nth-child(7) { margin-left:0px; }
#contents div.innerWrap div.content div.gallery ul li:nth-child(10) { margin-left:0px; }
#contents div.innerWrap div.content div.gallery ul li a span.thumb { display: flex; align-items: center; justify-content: center; width:100%; height:264px; border:1px solid #e5e5e5; border-radius: 5px; }
#contents div.innerWrap div.content div.gallery ul li a span.desc { display:block; text-align:center; margin-top:18px }
#contents div.innerWrap div.content div.gallery ul li a:hover span.thumb { display: flex; align-items: center; justify-content: center; width:100%; height:264px; border:1px solid #26688d; }


#contents div.innerWrap div.content div.galleryView {}
#contents div.innerWrap div.content div.galleryView div.viewTitle { border-top:1px solid #333; border-bottom:1px solid #e5e5e5; padding:20px 0; font-size:20px; text-align:center;  }
#contents div.innerWrap div.content div.galleryView div.viewContent { padding:20px 10px 40px; border-bottom:1px solid #e5e5e5; }
#contents div.innerWrap div.content div.galleryView div.viewContent span { width:100%; display:block;  text-align:center; margin-bottom:20px }
#contents div.innerWrap div.content div.buttonArea { margin-top:20px; width:100%; text-align:center;  }
#contents div.innerWrap div.content div.buttonArea a { display:block;  width:120px; line-height:55px;  font-size:18px; border:1px solid #e5e5e5; border-radius: 5px; margin:0 auto; font-weight:bold }
#contents div.innerWrap div.content div.buttonArea a:hover { background:#26688d; color:#fff; }


/*PDS*/
#contents div.innerWrap div.content div.count { margin-bottom:10px }
#contents div.innerWrap div.content div.list dl{}
#contents div.innerWrap div.content div.list dl dt{ display:inline-block; margin-right:-5px; line-height:56px; background:#26688D; color:#fff; font-weight:bold; border-top:1px solid #333 }
#contents div.innerWrap div.content div.list dl dd{ display:inline-block; margin-right:-5px; line-height:56px; border-top:1px solid #e5e5e5;  vertical-align: top;  }
#contents div.innerWrap div.content div.list dl dt:nth-child(1) { width:10%;  text-align:center }
#contents div.innerWrap div.content div.list dl dt:nth-child(2) { width:63%;  text-align:center }
#contents div.innerWrap div.content div.list dl dt:nth-child(3) { width:13%;  text-align:center }
#contents div.innerWrap div.content div.list dl dt:nth-child(4) { width:14%;  text-align:center }
#contents div.innerWrap div.content div.list dl dd:nth-child(1) { width:10%;  text-align:center }
#contents div.innerWrap div.content div.list dl dd:nth-child(2) { width:63%;  text-align:left; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
#contents div.innerWrap div.content div.list dl dd:nth-child(2):hover { color:#26688d; text-decoration: underline; }
#contents div.innerWrap div.content div.list dl dd:nth-child(3) { width:13%;  text-align:center }
#contents div.innerWrap div.content div.list dl dd:nth-child(4) { width:14%;  text-align:center }
#contents div.innerWrap div.content div.list dl:nth-child(odd) dd { background:#f8f8f8 }


/*inquiry*/
#contents div.innerWrap div.content div.key { margin-bottom:10px }
#contents div.innerWrap div.content div.inquiry {}
#contents div.innerWrap div.content div.inquiry div.keyArea {margin-bottom:10px}
#contents div.innerWrap div.content div.inquiry span.key { color:#FF0000; font-size:18px }
#contents div.innerWrap div.content div.inquiry ul {}
#contents div.innerWrap div.content div.inquiry ul li{ display:block; border-bottom:1px solid #e5e5e5; line-height:87px; }
#contents div.innerWrap div.content div.inquiry ul li:first-child { border-top:1px solid #333 }
#contents div.innerWrap div.content div.inquiry ul li:nth-child(even) { background:#f8f8f8 }
#contents div.innerWrap div.content div.inquiry ul li span.title{ width:16%; display:inline-block; margin-right:-5px;  padding-left:30px;  vertical-align: top; }
#contents div.innerWrap div.content div.inquiry ul li span.value{ width:84%; display:inline-block; margin-right:-5px;  padding: 0 20px 0 30px  }
#contents div.innerWrap div.content div.inquiry ul li span.value input { border-radius: 5px;  padding:5px  }
#contents div.innerWrap div.content div.inquiry ul li span.value input#bSubject { width:100% }
#contents div.innerWrap div.content div.inquiry ul li span.value input#bName { width:20% }
#contents div.innerWrap div.content div.inquiry ul li span.value input#bCorp { width:30% }
#contents div.innerWrap div.content div.inquiry ul li span.value input#bPhone { width:40% }
#contents div.innerWrap div.content div.inquiry ul li span.value input#bEmail { width:50% }
#contents div.innerWrap div.content div.inquiry ul li span.value input#bFile { width:80% }
#contents div.innerWrap div.content div.inquiry ul li span.value textarea { width:100%; margin-top:20px }
#contents div.innerWrap div.content div.inquiry ul li span.value span.desc { margin-left:10px }

#contents div.innerWrap div.content div.inquiry div.item { margin-top:30px }
#contents div.innerWrap div.content div.inquiry div.item div.agreement div.content{ border:1px solid #e5e5e5;  height:200px; overflow-y: scroll; padding:1em }
#contents div.innerWrap div.content div.inquiry div.item div.agreement div.agree { display: flex;  align-items: center;  justify-content: flex-end; }

#contents div.innerWrap div.content div.inquiry div.control { display: flex; align-items: center; justify-content: center;  border-top:1px solid #e5e5e5;  padding-top:30px }
#contents div.innerWrap div.content div.inquiry div.control button { background:#26688d; color:#fff; width:120px; line-height:55px; text-align:center; border-radius: 5px;  }

/*ETC*/
#contents div.innerWrap div.content div.stipulation {}
#contents div.innerWrap div.content div.stipulation h5 { font-size:22px; margin:20px 0}
#contents div.innerWrap div.content div.stipulation h6 { font-size:18px; margin:20px 0}
#contents div.innerWrap div.content div.stipulation p { line-height:24px; }

#contents div.innerWrap div.content div.privacy p { line-height:24px; }


/*RESULT*/
#contents div.innerWrap div.content div.result {}
#contents div.innerWrap div.content div.result div.search{ display: flex; justify-content: space-between;  align-items: center; position: relative;width: 100%; border-bottom: 2px solid rgba(25, 61, 113, 0.5); } 
#contents div.innerWrap div.content div.result div.search input { width: 100%; height: 72px; padding-left: 0; background-color: transparent; border: 0; font-size: 36px; line-height: 42px; outline: none; }
#contents div.innerWrap div.content div.result div.search button { width: 56px; height: 56px; margin: 0 0 0 0;  background: url(../images/searchBt.svg) no-repeat center center;  font-size: 0; text-indent: -999rem; line-height: 0;}

#contents div.innerWrap div.content div.result div.search-trigger { display: flex; flex-wrap: wrap; width: calc(100% + 4px);  padding: 25px 0 0;}
#contents div.innerWrap div.content div.result div.search-trigger button {width: calc(100% / 4 - 5px); height: 47px; margin: 5px 5px 0 0; background-color: #EDEFF3;border-radius: 5px; color: #8C94A3;font-weight: 500;font-size: 14px;  line-height: 20px;}
#contents div.innerWrap div.content div.result div.search-trigger button:focus {background-color: #fff; border: 1px solid #1C3E70;  color: #1C3E70;}
#contents div.innerWrap div.content div.result div.search-trigger button.on {background-color: #fff; border: 1px solid #1C3E70;  color: #1C3E70;}


#contents div.innerWrap div.content div.result div.tabpanel { }
#contents div.innerWrap div.content div.result div.tabpanel div.flex-tit { display: flex; align-items: baseline; padding: 60px 0 59px;}
#contents div.innerWrap div.content div.result div.tabpanel div.flex-tit h2.tit { font-size: 30px; line-height: 42px;}
#contents div.innerWrap div.content div.result div.tabpanel div.flex-tit span.total { display: flex; margin-left: 20px; font-weight: 500; font-size: 14px; line-height: 20px;}

#contents div.innerWrap div.content div.result div.board_data-type {}
#contents div.innerWrap div.content div.result div.board_data-type table { width:100%; border: 0;border-top: 1px solid #193d71;border-bottom: 1px solid #e5e5e5;background-color: transparent; border-collapse: collapse;}
#contents div.innerWrap div.content div.result div.board_data-type table thead th { height:60px; }
#contents div.innerWrap div.content div.result div.board_data-type table tbody td {height: 60px;   text-align: center;  border-top: 1px solid #e5e5e5;}


HTML CSSResult Skip Results Iframe
EDIT ON
/* CSS style sheet */

* {
    margin:0;
    padding:0;
}

ul, li { list-style: none; }

a { text-decoration: none; }

#layerPopup {
    display: none;
}

#layerPopup + label {
    display:inline-block;
    padding: 7px 14px;
    background:#333;
    color:#fff;
}

#layer_bg {
    display:none;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.5);
}

#layer_bg > #popup {
    position:absolute;
    padding:15px;
    box-sizing:border-box;
    border-radius:15px; 
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    width:300px;
    height:200px;
    background:#fff;
    box-shadow: 7px 7px 5px rgba(0,0,0,0.2); 
}

#layer_bg > #popup > h2 {
    margin-bottom:25px;
}

#layer_bg > #popup > h2 > label {
    float: right;
}

#layerPopup:checked + label + #layer_bg {
    display:block;
}



/*푸터*/
#footer { position: relative; clear:both; margin-top:70px }
#footer div.footerMenu  { background:#EEEEEE; height:auto }
#footer div.footerMenu div.innerWrap a { display:inline-block; line-height:54px; margin-right:5px }
#footer div.footerMenu div.innerWrap a span { font-size:18px; color:#333; }
#footer div.footerMenu div.innerWrap a:hover span { font-size:18px; color:#26688d;}
#footer div.footerMenu div.innerWrap div.iconArea { float:right; margin-top:12px }
#footer div.footerMenu div.innerWrap div.iconArea a { display:inline-block; height:28px;  }
#footer div.footerMenu div.innerWrap div.iconArea a span {  font-size:0px; text-indent:-1000;  }
#footer div.footerMenu div.innerWrap div.iconArea a.youtube { width:42px; background: url('../images/youtube_.png') no-repeat  }
#footer div.footerMenu div.innerWrap div.iconArea a.blog { width:42px; background: url('../images/blog.png') no-repeat  }
#footer div.footerMenu div.innerWrap div.iconArea a.topGo { width:60px; background: url('../images/top.png') no-repeat  }
#footer div.innerWrap div.customer{ font-size:2.2em;  font-weight:bold; margin-top:50px  }
#footer div.innerWrap div.customer span { display:block; font-size:22px; font-weight:normal; margin:20px 0  40px }
#footer div.innerWrap div.info { font-size:18px; color:#999 }
#footer div.innerWrap div.info span { display:inline-block; margin-right:15px }
#footer div.innerWrap div.copyright { display:block; font-size:18px; color:#999; margin-top:20px; padding-bottom:60px  }


@keyframes subVisual {
    0% { opacity: 0; }
    100% { opacity: 1; }
}



#aside { width:292px; }
#aside h2 { height:120px; display: flex; align-items: center; justify-content: center; background: #003DAD; color:#FFF; font-size:2em; font-weight:600; }
#aside div.navi ul li { border:1px solid #DDD; border-top:0; }
#aside div.navi ul li.selected { border-color:#6a8aff;}
#aside div.navi ul li a { display: flex; padding:1em; font-size:0.9em; align-items: center; justify-content: space-between; }
#aside div.navi ul li a.selected, #aside div.navi ul li a:hover { background: #6a8aff; color:#FFF; }
#aside div.navi ul li a::after { content:''; display: block; width:1em; height:1em; background: url('../images/common/ico.plus.svg') no-repeat center / contain;  }
#aside div.navi ul li a.selected::after, #aside div.navi ul li a:hover::after { background-image: url('../images/common/ico.minus_FFFFFF.svg'); }


@keyframes loading1 {
    0% { transform: scale(0); }
    100% { transform: scale(1); }
}
@keyframes loading2 {
    0% { transform: translate(0, 0); }
    100% { transform: translate(24px, 0); }
}
@keyframes loading3 {
    0% { transform: scale(1); }
    100% { transform: scale(0); }
}