@charset "utf-8";

/*
    drone.css 23년 7월 12일(수) 제작 제작자 : 김동영
    수정시 수정사항, 수정자 기입
    예 : 22-12-05 김동영 .main-img-box padding-left:10px에서 15px로 수정

*/

ul {
  padding-left: 0 !important;
  margin-bottom: 0 !important;
}

:is(a, h1, h2, h3, h4, h5, h6, td, th, li, span, strong, dl, dd, div, section, button) {
  font-family: 'Noto Sans KR', sans-serif;
  color: #333;
}

a {
  color: #333 !important;
  text-decoration: none !important;
}

a:hover {
  color: #333 !important;
}

p {
  margin-bottom:0;
}


.sub-header {
  background: url('/image/sub/contents/drone/sub_img.jpg') no-repeat;
  height: 370px;
  padding-top: 120px;
  background-size: 100%;
  text-align: center;
}

.sub-header span {
  color: #f36c2f;
  font-size:1.1rem;
  font-weight: 500;
}

.sub-header h2 {
  font-size:2.4rem;
  color:#fff;
  letter-spacing: -1.5px;1
}

.sub-header p {
  color:#fff;
  font-size:1rem;
  margin-top: 20px;
}

.content-header h2 {
  font-size:40px;
  color: #222;
  font-weight: 300;
  margin-bottom: 40px;
  text-align: center;
  letter-spacing: -1.5px;
  line-height: 60px;
}

.content-header p {
  font-size: 18px;
  color: #222;
  text-align: center;
}

.content-header strong {
  font-weight: bold;
}

.drone-box {
  margin-top: 110px;
}

.content-box1 {
  text-align:center;
  margin-top:75px;

}

.line-box {
  background:#19649e;
  padding-top:85px;
  padding-bottom:45px;
  margin-top:-190px;
}

.line-box p {
  font-size:18px;
  color:#fff;
}

.content-box2 {
  margin-top:110px;
}

.content-box2 h2 {
  font-size:40px;
  color: #222;
  font-weight: 300;
  margin-bottom: 80px;
  text-align: center;
  letter-spacing: -1.5px;
  line-height: 60px;
}

.content-box2 h2 strong {
  font-weight:bold;
}

.content-box2 img {
  width:33px;
  height:33px;
}

.content-box2 .eclispe {
  width:60px;
  height:60px;
  border-radius:50px;
  text-align:center;
  padding:12px 0;

}

.content-box2 .left-col  {
  background:#f0f1f4;

}

.content-box2 .right-col {
  border-top:solid 1px #f0f1f4;
  border-right:solid 1px #f0f1f4;
  border-bottom:solid 1px #f0f1f4;
}

.content-box2 .right-col .eclispe  {
  background:#f0f1f4;

}

.content-box2 .left-col .eclispe {
  background:#fff;

}

.content-box2 .info-box {
  padding:45px;
}

.content-box2 .info-box strong {
  font-size:22px;
  display:block;
  margin-top:30px;
  margin-bottom:20px;

}

.content-box2 .info-box p {
  color:#a1a1a1;
  font-size:18px;
}

.content-box3 {
  margin-top:110px;
  text-align:center;
  background:#e1ecf4;
  padding:95px 0;
}

.content-box3 h3 {
  font-weight:bold;
  font-size:30px;
  line-height:45px;
  margin-bottom:40px;
}

.content-box4 {
  margin-top:110px;

}

.content-box4 h3 {
  font-size:25px;
  font-weight:bold;
  margin-bottom:45px;
}

.content-box4 span {
  color:#868686;
  display:block;
  float:right;
  font-size:15px;
  margin-bottom:61px;
}

.content-box4 img {
  width:100%;
}

.content-box4 .info-box {
  position:relative;
}

.content-box4 .txt-box {
  position:absolute;
  bottom:0;
  background: #00000096;
  width:100%;
  padding:30px;
}

.content-box4 .txt-box h5 {
  color:#fff;
}

.content-box4 .txt-box p {
  color:#fff;
}

.content-box5 {
  margin-top: 150px;
  background: #efeeee;
  padding: 110px 0;
}



.content-box5 img {
  width:100%;
}

.content-box5 h4 {
  font-size:30px;
  font-weight:bold;
  margin-bottom:30px;
}

.content-box5 h4 span {
  font-size:30px;
  font-weight:bold;
  display: inline-block;
  position: relative;
  z-index: 0;
}

.content-box5 h4 span:after {
  position: absolute;
  left: 0;
  bottom: 0;
  content: '';
  width: 100%;
  height: 50%;
  background-color: #cfd9e2;
  z-index: -1;
}

.content-box5 p {
  font-size:18px;
  color:#868686;
}

.content-box5 span {
  font-size:18px;
  color:#222;
}

@media (max-width: 1199px) {
  .sub-header {
    background-size: cover;
  }
  .content-box1 img {
    width:100%;
  }
  .content-box3 img {
    width:100%;
  }
  .content-box4 span {
    margin-top: 50px;
  }
}