/*!
 * services.css
 */

 /* services */
 .services .inside-link {
   width: 600px;
   margin: 150px auto 0;
 }
 .services .inside-link ul {
   display: flex;
   justify-content: space-between;
 }
 .services .inside-link li {
   padding: 0px 20px;
   border: 1px solid #0d2937;
   text-align: center;
 }
 .services .inside-link li a {
   width: 100%;
   padding: 8px 0;
   display: block;
   color: #0d2937;
 }
 .services .inside-link li a i {
   margin-right: 10px;
 }
 .services section h2 {
   padding-bottom: 10px;
   font-size: 2.2rem;
   color: #fff;
 }
 .services table {
  width: 100%;
  margin-top: 75px;
}
.services table tr {
  border-top: 1px solid #0d2937;
  border-bottom: 1px solid #0d2937;
}
.services table td {
  padding: 30px 0;
}
.services table td:first-child {
  width: 30%;
  text-align: center;
  background-color: #eeeeee;
}
.services table td:last-child {
  padding-left: 40px;
}
.services table td ul + ul {
  margin-top: 20px;
}
.services section .small-content {
   width: 750px;
   margin: -115px auto 0;
   padding-top: 100px;
   background-color: #fff;
 }
.services section h3 {
  margin-bottom: 70px;
  font-size: 2.2rem;
 }
.services section h3 + p {
  padding: 0 80px;
  text-align: center;
}
.services .design ul {
  margin-top: 100px;
  margin-bottom: 140px;
}
.services .design > div:first-child {
   height: 550px;
   background: url("../images/services/bg_ design_img.jpg") no-repeat;
   display: flex;
   justify-content: center;
   align-items: center;
}
.services .design > div:last-child {
  padding: 70px 0 100px;
  background-color: #eeeeee;
}
.services .design div .flow {
  padding-left: 0;
  padding-right: 0;
}
.services .design div .flow ul li {
  width: calc(20% - 20px);
  margin-right: 20px;
  position: relative;
}
.services .design div .flow ul .fa {
  display: block;
}
.services .design div .flow ul .fa-caret:before {
  content: "\f0da";
  position: absolute;
  bottom: 135px;
  right: -18px;
  font-size: 4rem;
}
.services .design div .flow ul li:last-child {
  margin-right: 0;
}
.services .design div .flow ul li p {
  margin-top: 30px;
  text-align: center;
}

.services .mechanical > div:first-child {
  height: 550px;
  background: url("../images/services/bg_mechanical_img.jpg") no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
}
.services .mechanical ul {
  margin-top: 100px;
}
.services .mechanical .btn {
  margin-top: 100px;
}

.services .about-factory > div:first-child {
  height: 550px;
  background: url("../images/services/bg_factory_img.jpg") no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
}
.services .about-factory ul {
  margin-top: 100px;
}
.services .about-factory table {
  margin-bottom: 100px;
}
.services .about-factory table + div {
  margin-bottom: 100px;
}
.services .about-factory .single-image,
.services .about-factory .image-group {
  margin-top: 100px;
}
.services .about-factory .single-image p {
  max-width: 750px;
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .services section .small-content {
    width: auto;
    margin: 0 auto;
  }
  .services .design div .flow ul {
    width: 80%;
    margin: 0 auto 30px;
    display: block;
  }
  .services .design div:last-child .flow ul li {
    width: 100%;
    margin-right: 0;
    margin-bottom: 30px;
  }
  .services .design div .flow ul .fa-caret:before {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .services section h3 + p {
    padding: 0;
  }
  .services .inside-link {
    display: none;
  }
  .services section > div:first-child {
    height: auto!important;
    margin-bottom: 50px;
    background-size: 100%!important;
  }
  .services section > .container,
  .services .design > div:last-child > div {
    padding-left: 15px;
    padding-right: 15px;
  }
  .services section h2 {
    padding-top: 50px;
  }
  .services section .small-content,
  .services .inside-link {
    width: 100%;
  }
  .services section .small-content {
    margin: 0 auto;
    padding: 0 15px;
  }
  .services table td:first-child {
    padding: 0 15px;
  }
  .services .about-factory ul {
    margin-bottom: 100px;
  }
}
@media screen and (max-width: 468px) {
  .services section h2 {
    padding-top: 20px;
  }
  .services .design div .flow ul {
    width: 100%;
  }
}