@charset "utf-8";
/* *******************************************************
 * filename : sub.css
 * description : 서브페이지 CSS
 * date : 2024-01-30
******************************************************** */

/* 공통 */
#container {
  background: #1a1a1a;
  color: #fff;
  letter-spacing: -0.05em;
}

* {
  letter-spacing: -0.05em;
}

.sc-wrap {
  width: 100%;
  max-width: var(--area-box-width);
  margin: 0 auto;
  height: 100%;
  padding: 90px 0;
  box-sizing: border-box;
}

.sc-tit {
  font-size: 55px;
  font-weight: 700;
  text-align: center;
}
.sc-sub-txt {
  font-size: 26px;
  font-weight: 500;
  text-align: center;
}

.sc-tit + .sc-sub-txt {
  margin-top: 50px;
}

/* 풀페이지 내비게이션 */
#fp-nav ul li,
.fp-slidesNav ul li {
  height: auto !important;
}

#fp-nav ul li a,
.fp-slidesNav ul li a {
  height: 38px !important;
}

#fp-nav ul li a.active,
.fp-slidesNav ul li a.active {
 height: 45px;
}

#fp-nav ul li a span, 
.fp-slidesNav ul li a span {
  background: rgba(255,255,255,0.8) !important;
  width: 6px !important;
  height: 6px !important;
}

#fp-nav ul li a.active span,
.fp-slidesNav ul li a.active span, 
#fp-nav ul li:hover a.active span, 
.fp-slidesNav ul li:hover a.active span {
  background: var(--main-color) !important;
  width: 10px !important;
  height: 45px !important;
  border-radius: 5px !important;
  top: 0;
  margin: 0 !important;
  transform: translateX(-50%);
}

/** 서브 내비게이션 */

.sub-nav {
  background: #1e1e1e;
  border-bottom: 1px solid #333;
}



.sub-nav-list {
  width: 100%;
  max-width: var(--area-box-width);
  margin: 0 auto;
  display: flex;
}

.sub-nav-item + .sub-nav-item {margin-left: 105px;}

.sub-nav-item a {
  display: block;
  height: 100%;
  color: inherit;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.2;
  padding: 27px 60px;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
}

.sub-nav-item:hover a,
.sub-nav-item.on a {
  position: relative;
  color: var(--main-color);
  border-bottom: 1px solid var(--main-color);
  font-weight: 600;
  padding-top: 28px;
}

.sub-nav-item:hover a::before,
.sub-nav-item.on a::before {
  content : "";
  display: block;
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 10px;
  height: 6px;
  background: url('/common/images/common/sub_nav_arr.png') no-repeat;
}

/** 기업정보 - 소개 */
.intro .sc-wrap {
  display: flex;
  align-items: center;
}

.bg-introduce {
  background: url('/common/images/content/intro_logo01.png') no-repeat left bottom 18%;
}

.introduce {
  width: 100%;
}

.introduce-tit {
  font-size: 60px;
  font-weight: 600;
  text-align: center;
  margin-top: 30px;
  margin-bottom: 70px;
}

.introduce-tit strong {
  display: block;
  color: var(--main-color);
  font-size: 80px;
  font-weight: 700;
  margin-top: 33px;
}

.introduce-txt {
  font-size: 30px;
  line-height: 1.2;
  text-align: center;
}

.introduce-txt span {
  display: block;
  margin-bottom: 45px;
}

.quality {
  width: 100%;
}

.quality-list {
  margin-top: 100px;
  background: url('/common/images/content/intro_bg03.png') no-repeat center center/contain;
  position: relative;
  padding-top: 23.0143%;
}

.quality-item {
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 25%;
  padding: 15px;
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  transform: translate(-50%,-50%);
}

.quality-item.item01 {
  left: 12%;
}

.quality-item.item02 {
  left: 37.5%;
}

.quality-item.item03 {
  left: 63%;
}

.quality-item.item04 {
  left: 88.5%;
}

.quality-item::before {
  content:"";
  display: block;
  width: 84px;
  height: 84px;
  margin: 0 auto 20px;
}

.quality-item.item01::before {
  background: url('/common/images/content/intro_icon01.png') no-repeat center center/contain;
}

.quality-item.item02::before {
  background: url('/common/images/content/intro_icon02.png') no-repeat center center/contain;
}

.quality-item.item03::before {
  background: url('/common/images/content/intro_icon03.png') no-repeat center center/contain;
}

.quality-item.item04::before {
  background: url('/common/images/content/intro_icon04.png') no-repeat center center/contain;
}

.quality-tit {
  font-size: 25px;
  font-weight: 600;
  margin-bottom: 20px;
}

.quality-txt {
  font-size: 18px;
  line-height: 1.2;
}

.partner {
  width: 100%;
}

.partner-list {
  display: flex;
  flex-wrap: wrap;
  gap: 20.5px;
}

.partner-item {
  width: calc((100% / 8) - 17.9375px);
}

.partner-list.vip {
  margin: 100px 0 20px;
  gap: 50px;
}

.vip .partner-item {
  width: calc((100% / 3) - 33.3333px);
}

.partner-item img {
  width: 100%;
}

.bg-output {
  background: url('/common/images/content/intro_bg01.png') no-repeat left bottom;
}

.output {
  width: 100%;
}

.output-list {
  display: flex;
  justify-content: space-between;
  margin-top: 130px;
}

.output-item {
  display: flex;
  align-items: center;
  justify-content: start;
  flex-direction: column;
  width: 100%;
  max-width: 340px;
  aspect-ratio: 1/1;
  margin: 0 -15px;
  padding-top: 5.5%;
  box-sizing: border-box;
  text-align: center;
  border: 2px solid var(--main-color);
  border-radius: 50%;
}

.output-item:first-child {
  margin-left: 0;
}

.output-item:last-child {
  margin-right: 0;
}

.output-year {
  display: block;
  font-size: 40px;
  font-weight: 600;
  margin-bottom: 35px;
}

.output-txt {
  font-size: 20px;
  line-height: 1.3;
}

.bg-license {
  background: url('/common/images/content/intro_bg02.jpg') no-repeat center center;
}

.license {
  width: 100%;
}

.license-wrap {
  display: flex;
  margin-top: 75px;
}

.license-list {
  width: 50%;
}

.license-item {
  position: relative;
}

.license-tit {
  font-size: 28px;
  font-weight: 600;
  position: absolute;
  top: 0;
  left: 0;
}

.license-box {
  padding-left: 43.75%;
  position: relative;
}

.license-box dl {
  position: relative;
  padding-bottom: 50px;
}

.license-box dl:first-child::before {
  content:"";
  display: block;
  width: 18.2%;
  height: 1px;
  background: #fff;
  position: absolute;
  top: 11px;
  left: -119px;
  transform: translateX(-100%);
  box-sizing: inherit;
}

.license-box dl::after {
  content:"";
  display: block;
  width: 1px;
  background: #fff;
  position: absolute;
  top: 17px;
  bottom: -4px;
  left: -114px;
}

.license-box dl:last-child::after {
  display: none;
}

.license-box dt {
  font-size: 30px;
  font-weight: 600;
  color: var(--main-color);
  position: absolute;
  top: -4px;
  left: 0;
}

.license-box dt::before {
  content:"";
  display: block;
  width: 12px;
  height: 12px;
  border: 3px solid #fff;
  border-radius: 50%;
  position: absolute;
  top: 41%;
  left: -114px;
  left: -174.5%;
  transform: translate(-50%,-50%);
}

.license-box dt::after {
  content:"";
  display: block;
  /* width: 82px; */
  width: 120%;
  height: 1px;
  background: #fff;
  position: absolute;
  top: 14px;
  left: -26px;
  transform: translateX(-100%);
}

.license-box dd {
  font-size: 22px;
  padding-left: 95px;
  line-height: 1.2;
}

.license-box dd + dd {
  margin-top: 20px;
}

.cert-list {
  display: flex;
  width: 100%;
  max-width: 870px;
  justify-content: space-between;
  margin: 50px auto 0;
}

.cert-item img {
  width: 100%;
}

/** 기업정보 - 핵심가치 */

.value .sc-wrap {
  padding: 120px 0;
}

.value-list1 {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  background: url('/common/images/content/value_bg04.png') no-repeat center center/contain;
  width: 100%;
  max-width: 1200px;
  margin: 105px auto 120px;
  aspect-ratio: 1200/413;
}

.value-item1.item1,
.value-item1.item3 {
  width: calc((100% / 3) + 5px);
}

.value-item1.item2 {
  width: calc((100% / 3) - 10px);
}

.value-item1 h3 {
  font-size: 36px;
  font-weight: 600;
  margin-bottom: 30px;
}

.value-item1 h3::before {
  content:"";
  display: block;
  width: 92px;
  height: 80px;
  margin: 0 auto 30px;
}

.value-item1.item1 h3::before {
  background: url('/common/images/content/value_icon01.png') no-repeat center center/contain;
}

.value-item1.item2 h3::before {
  background: url('/common/images/content/value_icon02.png') no-repeat center center/contain;
}

.value-item1.item3 h3::before {
  background: url('/common/images/content/value_icon03.png') no-repeat center center/contain;
}

.value-item1 span {
  font-size: 30px;
  font-weight: 500;
}

.value-item2 {
  display: flex;
  align-items: center;
}

.value-item2:nth-child(2) {
  flex-direction: row-reverse;
  text-align: right;
}

.value-list2-txt {
  width: 50%;
  padding: 10px 10px 10px 0;
  box-sizing: border-box;
}

.value-item2:nth-child(2) .value-list2-txt {
  padding: 10px 0 10px 10px;
}

.value-list2-txt span {
  font-size: 80px;
  font-weight: 600;
  color: var(--main-color);
  display: block;
  margin-bottom: 15px;
}

.value-list2-txt h3 {
  font-size: 50px;
  font-weight: 600;
  margin-bottom: 40px;
}

.value-list2-txt p {
  font-size: 30px;
  color: #c8c8c8;
  line-height: 1.6;
}

.value-list2-img {
  width: 50%;
}

.value-list2-img img{
  width: 100%;
}

/** 기업정보 - 연혁 */

.history-vis {
  display: flex;
  justify-content: center;
  flex-direction: column;
  box-sizing: border-box;
  background: url('/common/images/content/history_bg01.jpg') no-repeat center center/cover;
  margin: 100px 0 0;
  height: 557px;
}

.history-vis p {
  font-size: 40px;
  line-height: 1.5;
  font-weight: 700;
  padding: 0 200px;
  box-sizing: border-box;
}

.history-vis span {
  display: block;
  margin-bottom: 10px;
  font-size: 20px;
  color: var(--main-color);
}

.history-tab-box {
  position: relative;
}

.history-tab-list {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  transform: translateY(-100%);
  display: flex;
  padding: 0 200px;
  box-sizing: border-box;
  border-top: 2px solid rgba(255,255,255,0.5);
  overflow-x: auto;
}

.history-tab-item button {
  color: rgba(255,255,255,0.5);
  font-size: 20px;
  font-weight: 700;
  padding: 40px 30px;
  box-sizing: border-box;
}

.history-tab-item.on button {
  color: rgba(255,255,255,1);
  position: relative;
}

.history-tab-item.on button::before {
  content:"";
  width: 100%;
  height: 2px;
  background: #fff;
  position: absolute;
  top: -2px;
  left: 0;
}

.history-tab-item.on button::after {
  content:"";
  width: 11px;
  height: 7px;
  background: url('/common/images/content/history_tab_arr.png');
  position: absolute;
  top: -1px;
  left: 50%;
  transform: translateX(-50%)
}

.history-panel-list {
  padding: 120px 0 70px;
  min-height: 460px;
  background: url('/common/images/content/history_logo01.png') no-repeat left bottom;
}

.history-panel-item {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  display: none;
}

.history-panel-item.on {
  display: block;
  display: flex;
}

.history-panel-item h3 {
  width: 100%;
  max-width: 890px;
  font-size: 65px;
  font-weight: 700;
  position: relative;
}

.history-panel-item h3::before {
 content:"";
 width: calc(100% - 403px);
 height: 2px;
 background: rgba(255,255,255,0.5);
 position: absolute;
 top: 32px;
 right: 68px;
 left: 335px;
}

.history-panel-item h3::after {
  content:"";
  width: 4px;
  height: 4px;
  border-radius: 50%;
  border: 3px solid rgba(255,255,255,0.5);
  position: absolute;
  top: 27.5px;
  right: 58px;
}

.history-panel-item h3 span {
  color: var(--main-color);
}

.history-panel-item dl {
  margin-top: 20px;
  flex-shrink: 0;
}

.history-panel-item dt {
  font-size: 25px;
  font-weight: 500;
  margin-bottom: 18px;
}

.history-panel-item dd {
  font-size: 20px;
  color: #c8c8c8;
}

.history-panel-item dd + dd {
  margin-top: 18px;
}

/** 기업정보 - 찾아오시는길 */
.map .sc-wrap {
  padding-top: 120px;
}

.sc-map-tit {
  font-size: 50px;
  font-weight: 600;
  padding-bottom: 100px;
  border-bottom: 2px solid #c8c8c8;
  line-height: 1.5;
}

.sc-map-tit span {
  color: var(--main-color);
}

.address_box {
  padding: 50px 0;
}

.address,
.tel {
  font-size: 25px;
  display: flex;
  line-height: 1.2;
}

.address {
  margin-bottom: 30px;
}

.address span,
.tel span {
  font-size: 30px;
  color: var(--main-color);
  font-weight: 600;
  margin-right: 40px;
  margin-top: -3px;
}

.map-img {
  width: 100%;
}

.subway-box {
  margin-top: 50px;
}

.subway {
  font-size: 30px;
  font-weight: 600;
  margin-bottom: 30px;
}

.subway-item {
  display: flex;
  align-items: center;
  font-size: 20px;
}

.subway-item + .subway-item {
  margin-top: 20px;
}

.subway-item img {
  margin-right: 10px;
}

.subway-item .arr {
  display: block;
  width: 33px;
  height: 13px;
  background: url('/common/images/content/map_arr01.png') no-repeat center center/contain;
  margin: 0 15px;
}

.subway-item span {
  display: flex;
  align-items: center;
}


/** 사업분야 - 웹서비스 */
.web .sc-wrap {
  padding-top: 170px;
  padding-bottom: 170px;
}

/* .service-area01 {
  margin-bottom: 170px;
} */

.service-area01,
.service-area03 {
  width: 100%;
  max-width: var(--area-box-width);
  margin: 0 auto;
}

.service-tit {
  font-size: 60px;
  font-weight: 600;
  margin-top: 170px;
  margin-bottom: 60px;
}

.network-tit {
  font-size: 60px;
  font-weight: 600;
  text-align: left;
}

.network-tit span,
.service-tit span {
  color: var(--main-color);
}

.service-desc {
  font-size: 20px;
  line-height: 1.4
}

.service-list {
  display: flex;
  flex-wrap: wrap;
  position: relative;
  justify-content: center;
  margin-top: 60px;
}

.service-list::before {
  content:"";
  width: 100%;
  max-width: 1365px;
  height: 101px;
  position: absolute; 
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  background: url('/common/images/content/web_bg04.png') no-repeat top center/contain;
}

.service-item {
  width: calc((100% / 3) - 110px);
  /* width: 16vw; */
  font-size: 22px;
  font-weight: 600;
  background: url('/common/images/content/web_bg02.png') no-repeat top center/contain;
  display: flex;
  align-items: end;
  justify-content: center;
  max-width: 291px;
  aspect-ratio: 291/199;
  margin-right: 10.3125%;
  margin-bottom: 10px;
  text-align: center;
}

.service-item.item03 {
  margin-right: 0;
}

.service-item.bottom {
  width: calc((100% / 4) - 105px);
  background: url('/common/images/content/web_bg03.png') no-repeat bottom center/contain;
  margin-right: 9.0625%;
  margin-top: 20px;
  margin-bottom: 0;
  align-items: center;
  aspect-ratio: 1/1;
}

.service-item.bottom.item04 {
  background: url('/common/images/content/web_bg10.png') no-repeat bottom center/contain;
}

.service-item.bottom.item07 {
  margin-right: 0;
  background: url('/common/images/content/web_bg11.png') no-repeat bottom center/contain;
}

.service-item p::before {
  content:"";
  width: 67px;
  height: 67px;
  display: block;
  margin: 0 auto 30px;
}

.service-item.item01 p::before {
  background: url('/common/images/content/web_icon01.png') no-repeat center center/contain;
}
.service-item.item02 p::before {
  background: url('/common/images/content/web_icon02.png') no-repeat center center/contain;
}
.service-item.item03 p::before {
  background: url('/common/images/content/web_icon03.png') no-repeat center center/contain;
}
.service-item.item04 p::before {
  background: url('/common/images/content/web_icon04.png') no-repeat center center/contain;
}
.service-item.item05 p::before {
  background: url('/common/images/content/web_icon05.png') no-repeat center center/contain;
}
.service-item.item06 p::before {
  background: url('/common/images/content/web_icon06.png') no-repeat center center/contain;
}
.service-item.item07 p::before {
  background: url('/common/images/content/web_icon07.png') no-repeat center center/contain;
}

.service-tit02 {
  font-size: 32px;
  font-weight: 500;
  text-align: center;
}

.service-tit02 span {
  font-size: 45px;
  font-weight: 600;
  position: relative;
  z-index: 1;
}

.service-tit02 span::after {
  content:"";
  position: absolute;
  top: 6px;
  left: 0;
  width: 100%;
  bottom: 7px;
  background: var(--main-color);
  z-index: -1;
}

.service-desc02 {
  font-size: 20px;
  line-height: 1.5;
  font-weight: 500;
}

.service-desc03 {
  font-size: 30px;
  font-weight: 500;
  margin: 180px 0 80px;
  position: relative;
}

.service-desc03::before {
  content:"";
  width: 2px;
  height: 90px;
  background: #fff;
  position: absolute;
  top: -48px;
  left: 50%;
  transform: translate(-50%, -100%);
}

.service-desc03 span {
  font-size: 40px;
  font-weight: 600;
  position: relative;
  z-index: 1;
}

.service-desc03 span::after {
  content:"";
  position: absolute;
  top: 6px;
  left: 0;
  width: 100%;
  bottom: 7px;
  background: var(--main-color);
  z-index: -1;
}

.service-area02 {
  padding: 170px 0 240px;
}

.bg-service01 {
  background: url('/common/images/content/web_bg01.png') no-repeat bottom center/cover;
}

.service-area-inner {
  width: 100%;
  max-width: var(--area-box-width);
  margin: 0 auto;
}

.service-list02 {
  display: flex;
  justify-content: space-between;
}

.service-item02 {
  /* width: calc(100% / 3); */
  text-align: center;
  
}



.service-item02 h4 {
  font-size: 144px;
  font-weight: 600;
  margin-top: 200px;
  margin-bottom: 140px;
  position: relative;
  z-index: 1;
}

.service-item02 h4::after {
  content:"";
  width: 100%;
  max-width: 303px;
  aspect-ratio: 1/1;
  background: var(--main-color);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  border-radius: 50%;
  z-index: -1;
}

.service-item02 p {
  font-size: 30px;
  font-weight: 500;
}

.service-item02 span {
  font-size: 20px;
  font-weight: 500;
  color: #c8c8c8;
  display: block;
  margin-top: 10px;
}


.service-area03 {
  padding: 170px 0;
  display: flex;
}

.service-tit03 {
  text-align: left;
  font-size: 50px;
}

.service-tit03 span {
  color: var(--main-color);
}

.service-tit04 {
  font-size: 30px;
  font-weight: 600;
}

.left-box {
  margin-right: 80px;
  width: 35.75%;
  flex-shrink: 0;
}

.service-img01 {
  margin-top: 85px;
  width: 100%;
  max-width: 572px;
}

.right-box {
  width: calc(64.25% - 80px);
}

.jener-service-list {
  display: flex;
  flex-wrap: wrap;
  margin: 30px 0;
  justify-content: space-between;
  gap: 20px;
}

.jener-service-item {
  width: calc((100% / 3) - 13.3333px);
  border: 1px solid #939393;
  border-radius: 20px;
  box-sizing: border-box;
  padding: 40px 25px;
}

.jener-service-item span {
  font-size: 25px;
  font-weight: 600;
  color: var(--main-color);
  position: relative;
}

.jener-service-item span::after {
  content:"";
  width: 100%;
  height: 2px;
  position: absolute; 
  left: 0;
  bottom: -1px;
  background: var(--main-color);
}

.jener-service-item p {
  font-size: 16px;
  color: #c8c8c8;
  line-height: 1.5;
  margin-top: 25px;
}

.service-img02 {
  margin-top: 30px;
  width: 100%;
  max-width: 948px;
}



.service-area04 {
  padding: 170px 0 220px;
}

.service-area04,
.service-area04 .service-tit03 {
  text-align: center;
}

.bg-service02 {
  background: url('/common/images/content/web_bg05.jpg') no-repeat center center/cover;
}

.service-area04 .service-tit03 {
  margin-bottom: 35px;
}

.system-list {
  display: flex;
  margin-top: 140px;
  justify-content: space-between;
  position: relative;
}

.system-list::before {
  content:"";
  height: 2px;
  width: 50px;
  width: 190px;
  background: #fff;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(-100%,-50%);
}

.system-list::after {
  content:"";
  height: 2px;
  width: 50px;
  width: 190px;
  background: #fff;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translate(100%,-50%);
}

.system-item {
  width: calc(100% / 3);
  max-width: 412px;
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1/1;
}

.system-item.item01 {
  background: url('/common/images/content/web_bg06.png') no-repeat center center/contain;
}

.system-item.item02 {
  background: url('/common/images/content/web_bg07.png') no-repeat center center/contain;
  margin: 0 15px;
  position: relative;
}

.system-item.item02::before {
  content:"";
  height: 2px;
  width: 50px;
  width: 190px;
  background: #fff;
  position: absolute;
  top: 50%;
  left: 0;
  left: 405px;
  transform: translateY(-50%);
}

.system-item.item02::after {
  content:"";
  height: 2px;
  width: 50px;
  width: 190px;
  background: #fff;
  position: absolute;
  top: 50%;
  right: 0;
  right: 404px;
  transform: translateY(-50%);
}

.system-item.item03 {
  background: url('/common/images/content/web_bg08.png') no-repeat center center/contain;
}

.system-item p {
  font-size: 25px;
  font-weight: 600;
  transform: translateY(-25px);
}

.system-item p::before {
  content:"";
  width: 126px;
  height: 120px;
  display: block;
  margin: 0 auto 40px;
}

.system-item.item01 p::before {
  background: url('/common/images/content/web_icon09.png') no-repeat center center/contain;
}
.system-item.item02 p::before {
  background: url('/common/images/content/web_icon10.png') no-repeat center center/contain;
}
.system-item.item03 p::before {
  background: url('/common/images/content/web_icon11.png') no-repeat center center/contain;
}

.bg-service03 {
  background: url('/common/images/content/web_bg09.jpg') no-repeat center center/cover;
}

.system-item02 {
  display: flex;
  min-height: 60px;
}

.system-item02 + .system-item02 {
  margin-top: 40px;
  position: relative;
}


.system-item02 p {
  font-size: 22px;
  font-weight: 500;
  border: 2px solid var(--main-color);
  border-radius: 30px;
  width: 18.2539%;
  margin-right: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 10px;
  box-sizing: border-box;
}

.system-list02-sub {
  display: flex;
  width: 100%;
}

.system-item02 + .system-item02 p::before {
  content: "";
  width: 25px;
  height: 25px;
  background: url('/common/images/content/web_icon12.png') no-repeat center center/cover;
  position: absolute;
  top: -34px;
  left: 50%;
  transform: translateX(-50%);
}


.system-item02-sub {
  width: calc((100% / 3) - 3vw);
  border: 1px solid #fff;
  font-size: 20px;
  line-height: 1.2;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  background: #1a1a1a;
  padding: 10px;
  box-sizing: border-box;
  z-index: 10;
}

.system-item02-sub + .system-item02-sub {
  margin-left: 80px;
  margin-left: 4.5vw;
}

.system-item02-sub + .system-item02-sub::before {
  content:"";
  width: 23%;
  width: 4.6vw;
  height: 2px;
  background: #fff;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(-100%,-50%);
  z-index: -1;
}




/** 사업분야 - 망연계 */


.network-tit  + .service-desc {
  text-align: left;
  margin: 50px 0 80px;
}
.network-list {
  min-height: 870px;
  display: flex;
}

.bg_network01 {
  background: url('/common/images/content/network_bg01.jpg') no-repeat center center/cover;
}

.network-item {
  padding: 16vw 10px 0;
  width: calc(100% / 3);
  box-sizing: border-box;
}

.network-item + .network-item  {
  border-left: 1px solid rgba(255,255,255,0.2);
  box-sizing: border-box;
}

.network-item .num {
  font-size: 30px;
  color: var(--main-color);
  font-weight: 700;
}

.network-item .kor {
  font-size: 28px;
  line-height: 1.28;
  font-weight: 600;
  margin: 60px 0 50px;
}

.network-item .eng {
  color: #c8c8c8;
  font-size: 18px;
  line-height: 2;
}

.network-desc {
  font-size: 25px;
  font-weight: 500;

}

.network-desc.line01 {
  margin-bottom: 25px;
}

.network-desc.line02 {
  margin-bottom: 165px;
}

.network-desc.line01::before {
  content:"";
  width: 76px;
  height: 100px;
  background: url('/common/images/content/network_icon04.png') no-repeat center center/contain;
  display: block;
  margin: 0 auto 30px;
}

.system-item.network01 p::before {
  background: url('/common/images/content/network_icon01.png') no-repeat center center/contain;
}
.system-item.network02 p::before {
  background: url('/common/images/content/network_icon02.png') no-repeat center center/contain;
}
.system-item.network03 p::before {
  background: url('/common/images/content/network_icon03.png') no-repeat center center/contain;
}

.system-item.network01 p,
.system-item.network02 p,
.system-item.network03 p {
  transform: translateY(-10px);
}

.service-tit03.security {
  margin-bottom: 80px;
}

.security-list {
  display: flex;
  justify-content: space-between;
}

.security-item {
  max-width: 381px;
  margin-right: 20px;
}

.security-item:last-child {
  margin-right: 0;
}

.security-link {
  font-size: 25px;
  color: #fff;
  font-weight: 500;
  display: block;
  display: flex;
  min-height: 50px;
  align-items: center;
  padding: 10px 20px;
  box-sizing: border-box;
  position: relative;
  margin-top: 30px;
}

.security-link:hover {
  color: var(--main-color);
}

.security-link::after {
  content:"";
  min-width: 50px;
  height: 100%;
  aspect-ratio: 1/1;
  border: 1px solid #fff;
  border-radius: 25px;
  position: absolute;
  top: 0;
  right: 0;
}

.security-link:hover::after{
  width: 100%;
  border-color: var(--main-color);
}

.security-link span {
  font-size: 18px;
  margin-left: 5px;
}

.security-link i {
  width: 81px;
  height: 13px;
  background: url('/common/images/content/network_arr_off.png') no-repeat center center/contain;
  display: block;
  position: absolute;
  top: 50%;
  right: 25px;
  transform: translateY(-50%);
}

.security-link:hover i {
  width: 18px;
  height: 13px;
  background: url('/common/images/content/network_arr_on.png') no-repeat center center/contain;
}

.security-item img {
  width: 100%;
}


/** 사업분야 - 전산유지보수 */

.data-list {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  margin-top: 80px;
}

.data-item {
  width: calc(50% - 20px);
  aspect-ratio: 779/251;
  padding: 35px;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  flex-direction: column;
}

.data-item.item01 {
  background: url('/common/images/content/data_bg01.png') no-repeat center center/contain;
}

.data-item.item02 {
  background: url('/common/images/content/data_bg02.png') no-repeat center center/contain;
}

.data-item.item03 {
  background: url('/common/images/content/data_bg03.png') no-repeat center center/contain;
}

.data-item.item04 {
  background: url('/common/images/content/data_bg04.png') no-repeat center center/contain;
}

.data-item .num {
  font-size: 30px;
  color: var(--main-color);
  font-weight: 600;
}

.data-item .tit {
  font-size: 30px;
  font-weight: 600;
  margin: 20px 0;
}

.data-item .tit span {
  color: var(--main-color);
}

.data-item p {
  font-size: 20px;
}

.data-area01 {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
}

.performance-top {
  text-align: center;
  padding: 165px 0 80px;
  box-sizing: border-box;
  border-bottom: 2px solid rgba(255,255,255,0.2);
  margin-bottom: 80px;
}

.performance-top .service-tit03 {
  text-align: center;
  margin-top: 10px;
  line-height: 1.2;
}

.performance-top .service-desc02 {
  font-size: 20px;
}

.performance-top .service-desc02 span {
  font-size: 30px;
}

.jener-service-list.data {
  margin: 40px 0 80px;
  gap: 40px;
}

.jener-service-list.data .jener-service-item {
  width: calc(25% - 30px);
  min-height: 180px;
}

.cert-list02 {
  display: flex;
  justify-content: space-between;
  padding-bottom: 80px;
  border-bottom: 1px solid rgba(255,255,255,0.2);
}

.cert-item02 {
  width: calc((100% / 3) - 133.3333px);
}

.cert-item02 img {
  width: 100%;
}

.cert-item02 p {
  text-align: center;
  font-size: 20px;
  margin-top: 20px;
  line-height: 1.2;
}

/** 사업분야 - 인빌쇼핑 */

.invil .sc-wrap {
  padding-top: 170px;
  padding-bottom: 170px;
}

.invil-top {
  display: flex;
  justify-content: space-between;
}

.invil-top-txt {
  flex-shrink: 0;
  margin-right: 40px;
}

.invil-top-txt span {
  font-size: 30px;
  color: var(--main-color);
}

.invil-top-txt h2 {
  font-size: 70px;
  color: var(--main-color);
  font-weight: 600;
  letter-spacing: 0;
  margin: 20px 0;
}

.invil-top-txt p {
  font-size: 50px;
  letter-spacing: 0.15em;
  margin-bottom: 125px;
}

.invil-link {
  display: block;
  font-size: 30px;
  color: #fff;
  width: 100%;
  max-width: 525px;
  height: 100px;
  padding: 10px;
  padding-left: 16.1904%;
  box-sizing: border-box;
  position: relative;
  display: flex;
  align-items: center;
  border-radius: 50px;
  border: 1px solid #fff;
}

.invil-link:hover {
  background: var(--main-color);
  border: 1px solid var(--main-color);
}

.invil-link::after {
  content:"";
  width: 81px;
  height: 13px;
  background: url('/common/images/content/invil_arr01.png') no-repeat center center/contain;
  position: absolute;
  top: 50%;
  right: 11.4285%;
  transform: translateY(-50%);
}

.invil-img {
  width: 100%;
}

.invil-txt01 {
  text-align: center;
  font-size: 28px;
  line-height: 1.7;
  margin-top: 30px;
}

.invil-txt02-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  background: url('/common/images/content/invil_bg01.png') no-repeat center center/contain;
  height: 1165px;
}

.invil-txt02 {
  font-size: 50px;
  line-height: 1.4;
  text-align: center;
  font-weight: 600;
}

.invil-txt02 span {
  font-size: 70px;
  color: var(--main-color);
  font-weight: 700;
}


@media screen and (max-width: 1660px) {
  .value .sc-wrap,
  .sc-wrap {
    padding: 90px var(--area-padding);
  }

  .history .sc-wrap {
    padding: 90px 0;
  }


  .history-tab-box {
    padding: 0 var(--area-padding);
  }
  .map .sc-wrap {
    padding-top: 90px;
  }
  .invil .sc-wrap,
  .web .sc-wrap {
    padding-top: 90px;
    padding-bottom: 90px;
  }

  .data-area01,
  .service-area01, .service-area03,
  .service-area-inner {
    padding: 0 var(--area-padding);
    box-sizing: border-box;
  }

  .service-item02 h4 {
    font-size: 120px;
  }

  .service-item02 h4::after {
    max-width: 200px;
  }

  .jener-service-item p br {
    display: none;
  }
  .system-list::before,
  .system-list::after,
  .system-item::before,
  .system-item::after {
    display: none;
  }

}

  
@media screen and (max-width: 1280px) {
  /** 타블렛 가로, 노트북 */

  /** 서브 내비게이션 */
  .sub-nav-item + .sub-nav-item {
    margin-left: 0;
  }
  
  .sc-tit {
    font-size: 50px;
  }

  .sc-sub-txt {
    font-size: 24px;
  }

  /** 기업정보 - 소개 */

  .bg-introduce {
    background: url('/common/images/content/intro_logo01.png') no-repeat left 30px bottom 18%;
    background-size: 60%;
  }

  .introduce-tit {
    font-size: 50px;
    margin: 0 0 55px;
  }

  .introduce-tit strong {
    font-size: 64px;
    margin-top: 25px;
  }

  .introduce-txt {
    font-size: 24px;
  }

  .introduce-txt span {
    margin-bottom: 35px;
  }

  .quality-list {
    background: none;
    display: flex;
    flex-wrap: wrap;
    max-width: 660px;
    margin: 0 auto;
    justify-content: space-between;
    padding-top: 100px;
  }

  .quality-item {
    position: relative;
    transform: unset;
    width: calc(50% - 27.5px);
    max-width: 300px;
    aspect-ratio: 1/1;
  }

  .quality-item::before {
    width: 60px;
    height: 60px;
    margin-bottom: 15px;
  }

  .quality-item.item01 {
    background: url('/common/images/content/intro_mo_bg_01.png') no-repeat center center/contain;
    margin-bottom: 55px;
    left: unset;
    order: 1;
    margin-right: 55px;
  }

  .quality-item.item01::after {
    content:"";
    width: 46px;
    height: 20px;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translate(100%,-50%);
    background: url('/common/images/content/intro_mo_line_01.png') no-repeat center center/contain;
  }

  .quality-item.item02 {
    background: url('/common/images/content/intro_mo_bg_02.png') no-repeat center center/contain;
    margin-bottom: 55px;
    left: unset;
    order: 2;
  }

  .quality-item.item02::after {
    content:"";
    width: 20px;
    height: 46px;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%,100%);
    background: url('/common/images/content/intro_mo_line_02.png') no-repeat center center/contain;
  }

  .quality-item.item03 {
    background: url('/common/images/content/intro_mo_bg_03.png') no-repeat center center/contain;
    left: unset;
    order: 4; 
  }

  .quality-item.item03::after {
    content:"";
    width: 46px;
    height: 20px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(-100%,-50%);
    background: url('/common/images/content/intro_mo_line_03.png') no-repeat center center/contain;
  }

  .quality-item.item04 {
    background: url('/common/images/content/intro_mo_bg_04.png') no-repeat center center/contain;
    left: unset;
    order: 3;
    margin-right: 55px;
  }

  .quality-tit {
    font-size: 22px;
    margin-bottom: 15px;
  }

  .quality-txt {
    font-size: 16px;
  }

  .partner-item {
    width: calc((100% / 5) - 16.4px);
  }

  .output-year {
    font-size: 34px;
    margin-bottom: 20px;
  }

  .output-txt {
    font-size: 18px;
  }

  .license-wrap {
    flex-direction: column;
  }
  
  .license-list {
    width: 100%;
  }

  .license-tit {
    font-size: 24px;
    top: 2px;
  }
  
  .license-box {
    padding-left: 330px;
  }

  .license-box dl:first-child::before {
    width: 70px;
    top: 14px;
  }

  .license-box dl::after {
    top: 22px;
    bottom: -5px;
  }

  .license-box dt {
    font-size: 26px;
    top: -1px;
  }

  .license-box dt::before {
    top: 56%;
    left: -197.5%;
  }

  .license-box dt::after {
    left: -36px;
  }

  .license-box dd {
    font-size: 20px;
  }

  /** 기업정보 - 핵심가치 */

  .value-list1 {
    margin: 90px auto 90px;
  }

  .value-item1 h3 {
    font-size: 32px;
    margin-bottom: 20px;
  }

  .value-item1 h3::before {
    width: 75px;
    height: 63px;
    margin-bottom: 20px;
  }

  .value-item1 span {
    font-size: 26px;
  }

  .value-list2-txt span {
    font-size: 60px;
  }

  .value-list2-txt h3 {
    font-size: 45px;
    margin-bottom: 20px;
  }

  .value-list2-txt p {
    font-size: 24px;
  }

  .value-list2-txt p br {
    display: none;
  }

  /** 기업정보 - 연혁 */
  .history-vis p {
    font-size: 34px;
    padding: 0 var(--area-padding);
  }

  .history-vis span {
    font-size: 18px;
  }

  .history-tab-list {
    padding: 0;
  }

  .history-tab-item button {
    padding: 30px 20px;
  }

  .history-panel-item h3 {
    font-size: 55px;
  }

  .history-panel-item dt {
    font-size: 22px;
  }

  .history-panel-item dd {
    font-size: 18px;
  }

  /** 기업정보 - 찾아오시는길 */
  .sc-map-tit {
    font-size: 45px;
    padding-bottom: 80px;
  }

  .address, .tel {
    font-size: 22px;
  }

  .address {
    margin-bottom: 20px;
  }

  .address span, .tel span {
    font-size: 27px;
    margin-top: -1px;
  }

  .subway {
    font-size: 26px;
    margin-bottom: 25px;
  }

  .subway-item {
    font-size: 18px;
  }

  .subway-item img {
    width: 95px;
  }
  .network-tit,
  .service-tit {
    font-size: 55px;
  }

  .service-desc {
    font-size: 18px;
  }


  .service-list::before {
    display: none;
  }

  .service-item {
    aspect-ratio: 1/1;
    align-items: center;
    font-size: 20px;
  }

  .service-item.bottom {
    width: calc((100% / 3) - 110px);
    margin-right: 10.3125%;
    margin-top: 0;
  }
  .service-item.bottom.item04 {
    background: url('/common/images/content/web_bg02.png') no-repeat top center/contain;
  }
  .service-item.bottom.item05 {
    background: url('/common/images/content/web_bg02.png') no-repeat top center/contain;
  }
  .service-item.bottom.item06 {
    margin-right: 0;
    background: url('/common/images/content/web_bg02.png') no-repeat top center/contain;
  }
  .service-item.bottom.item07 {
    background: url('/common/images/content/web_bg02.png') no-repeat top center/contain;
  }

  .service-item p::before {
    width: 50px;
    height: 50px;
  }

  .service-tit02 {
    font-size: 30px;
  }

  .service-tit02 span {
    font-size: 40px;
  }

  .service-item02 h4 {
    font-size: 80px;
  }

  .service-item02 p {
    font-size: 25px;
  }

  .service-item02 span {
    font-size: 18px;
    margin-top: 5px;
  }

  .service-area03 {
    flex-direction: column;
  }

  .service-tit03 {
    font-size: 45px;
  }

  .left-box {
    width: 100%;
    margin-top: 90px;
    margin-right: 0;
  }

  .right-box {
    width: 100%;
    margin-top: 90px;
  }

  .service-tit04 {
    font-size: 26px;
  }

  .service-desc02 {
    font-size: 18px;
  }

  .system-item p {
    font-size: 22px;
    transform: translateY(-10px);
  }

  .system-item p::before {
    width: 80px;
    height: 80px;
    margin: 0 auto 20px;
  }
  
  .service-desc03 {
    font-size: 28px;
  }

  .service-desc03 span {
    font-size: 36px;
  }

  .system-item02 p {
    margin-right: 30px;
    font-size: 20px;
  }

  .system-item02-sub {
    font-size: 18px;
  }

  .network-item .num {
    font-size: 28px;
  }

  .network-item .kor {
    font-size: 26px;
    margin: 30px 0;
  }

  .network-item .eng {
    font-size: 16px;
  }

  .network-item br {
    display: none;
  }

  .network-desc {
    font-size: 22px;
  }

  .security-list {
    flex-wrap: wrap;
    justify-content: center;
    
  }
  .security-item {
    width: calc(50% - 15px);
    margin-right: 30px;
  }

  .security-item:nth-child(2n) {
    margin-right: 0;
  }

  .security-link {
    font-size: 22px;
    min-height: 40px;
  }

  .security-link::after {
    min-width: 40px;
  }

  .security-link span {
    font-size: 16px;
  }

  .security-link i {
    right: 20px;
  }

  .data-item {
    width: 100%;
    max-width: 780px;
  }

  .data-item .num {
    font-size: 28px;
  }

  .data-item .tit {
    font-size: 28px;
  }

  .data-item p {
    font-size: 18px;
  }

  .data-list {
    flex-direction: column;
  }

  .performance-top .service-desc02 {
    font-size: 18px;
  }
  
  .performance-top .service-desc02 span {
    font-size: 28px;
  }

  .cert-item02 {
    width: calc((100% / 3) - 30px);
  }

  .invil-top-txt span {
    font-size: 26px;
  }

  .invil-top-txt h2 {
    font-size: 63px;
  }

  .invil-top-txt p {
    font-size: 45px;
  }

  .invil-link {
    font-size: 28px;
    padding-left: 11.4285%;
  }

  .invil-txt01 {
    font-size: 24px;
  }

  .invil-txt01 br {
    display: none;
  }

  .invil-txt02 {
    font-size: 42px;
  }

  .invil-txt02 br {
    display: none;
  }

  .invil-txt02 span {
    font-size: 62px;
   
  }

}

@media screen and (max-width: 1000px) {
  .invil-top {
    flex-direction: column;
  }

  .invil-img {
    margin-top: 80px;
    max-width: 600px;
  }
}

@media screen and (max-width: 875px) {
  .service-item,
  .service-item.bottom {
    width: calc(50% - 10px);
    margin-right: 20px;
    font-size: 18px;
  }
  .service-item.item03 {
    margin-right: 20px;
  }
  .service-item:nth-child(2n){
    margin-right: 0;
  }

 
}

@media screen and (max-width: 768px) {
  /** 모바일 가로, 타블렛 세로 */

  /** 서브 내비게이션 */

  .sub-nav-list {
    flex-wrap: wrap;
  }

  .sub-nav-item {
    width: 50%;
  }
  .sub-nav-item a {
    font-size: 18px;
    padding: 20px 10px;
    text-align: center;
  }

  .sc-tit {
    font-size: 30px;
  }

  .sc-sub-txt {
    font-size: 18px;
  }

  /** 기업정보 - 소개 */
  .bg-introduce {
    background-size: 80%;
  }

  .introduce-tit {
    font-size: 36px;
    margin: 0 0 50px;
  }

  .introduce-tit strong {
    font-size: 50px;
    margin-top: 20px;
  }

  .introduce-txt {
    font-size: 18px;
  }

  .introduce-txt span {
    margin-bottom: 30px;
  }

  .introduce-txt br {
    display: none;
  }

  .quality-list {
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: center;
  }

  .quality-item {
    width: 100%;
  }

  .quality-item.item01 {
    margin-right: 0;
    background: url('/common/images/content/intro_mo_bg_01-2.png') no-repeat center center/contain;
  }

  .quality-item.item01::after {
    width: 20px;
    height: 46px;
    top: unset;
    bottom: 0;
    left: 50%;
    right: unset;
    transform: translate(-50%,100%);
    background: url('/common/images/content/intro_mo_line_02.png') no-repeat center center/contain;
  }

  .quality-item.item02 {
    background: url('/common/images/content/intro_mo_bg_02-2.png') no-repeat center center/contain;
  }

  .quality-item.item03 {
    order: 3;
    margin-bottom: 55px;
  }

  .quality-item.item03::after {
    width: 20px;
    height: 46px;
    top: unset;
    bottom: 0;
    left: 50%;
    right: unset;
    transform: translate(-50%,100%);
    background: url('/common/images/content/intro_mo_line_02.png') no-repeat center center/contain;
  }

  .quality-item.item04 {
    order: 4;
    margin-right: 0;
    background: url('/common/images/content/intro_mo_bg_04-2.png') no-repeat center center/contain;
  }

  .quality-tit {
    font-size: 20px;
  }

  .quality-txt {
    font-size: 15px;
  }

  .partner-item {
    width: calc((100% / 4) - 15.375px);
  }

  .partner-list.vip {
    gap: 20px; 
  }

  .vip .partner-item {
    width: calc((100% / 3) - 13.3333px);
  }

  .output-list {
    flex-wrap: wrap;
    justify-content: center;
  }

  .output-item {
    width: calc(100% / 3);
    padding-top: 9.5%;
  }

  .output-year {
    font-size: 26px;
    margin-bottom: 10px;
  }

  .output-txt {
    font-size: 16px;
  }

  .license-item {
    margin-bottom: 40px;
  }

  .license-tit {
    position: static;
    font-size: 20px;
    margin-bottom: 20px;
  }

  .license-box {
    padding-left: 0;
  }

  .license-box dl {
    padding-bottom: 10px;
  }

  .license-box dt {
    font-size: 22px;
  }

  .license-box dd {
    padding-left: 70px;
    font-size: 16px;
  }

  .license-box dd + dd {
    margin-top: 10px;
  }

  .cert-list {
    flex-wrap: wrap;
    max-width: 350px;
    margin: 50px 0 0;
  }

  .cert-item {
    width: calc(50% - 10px);
    text-align: left;
    margin-bottom: 20px;
  }

  /** 기업정보 - 핵심가치 */ 
  .value-item1 h3::before {
    width: 60px;
    height: 48px;
    margin-bottom: 10px;
  }

  .value-item1 h3 {
    font-size: 20px;
    margin-bottom: 10px;
  }

  .value-item1 span {
    font-size: 18px;
  }
  
  .value-list2-txt span {
    font-size: 36px; 
    margin-bottom: 10px;
  }

  .value-list2-txt h3 {
    font-size: 28px;
    margin-bottom: 10px;
  }

  .value-list2-txt p {
    font-size: 16px;
  }
  
  /** 기업정보 - 연혁 */
  .history-vis {
    height: 400px;
  }

  .history-vis p {
    font-size: 30px;
  }

  .history-tab-item button {
    padding: 20px 15px;
    font-size: 16px;
  }

  .history-panel-list {
    background-size: contain;
    min-height: 350px;
  }

  .history-panel-item.on {
    flex-direction: column;
  }

  .history-panel-item h3 {
    font-size: 40px;
  }

  .history-panel-item h3::before,
  .history-panel-item h3::after {
    display: none;
  }

  .history-panel-item dl {
    margin-top: 40px;
  }
  
  .history-panel-item dt {
    font-size: 18px;
  }

  .history-panel-item dd {
    font-size: 16px;
  }
  .history-panel-item dd + dd {
    margin-top: 15px;
  }

  /** 기업정보 - 찾아오시는길 */ 
  .sc-map-tit {
    font-size: 30px;
  }

  .address_box {
    padding: 30px 0;
  }

  .address, .tel {
    font-size: 18px;
  }

  .address span, .tel span {
    font-size: 20px;
    margin-right: 20px;
  }

  .subway {
    font-size: 18px;
  }

  .subway-item {
    flex-direction: column;
    align-items: start;
    font-size: 16px;
  }

  .subway-item + .subway-item {
    margin-top: 35px;
  }

  .subway-item span {
    flex-direction: column;
    align-items: start;
  }

  .subway-item .arr {
    margin: 10px 0;
  }

  .subway-item img {
    margin-bottom: 15px;
    width: 80px;
  }
  
  .network-tit,
  .service-tit {
    font-size: 35px;
  }

  .service-desc {
    font-size: 16px;
  }

  .service-area02 {
    padding: 100px 0 150px;
  }

  .service-tit02 {
    font-size: 26px;
  }

  .service-tit02 span {
    font-size: 35px;
  }

  .service-list02 {
    flex-direction: column;
  }

  .service-item02 h4 {
    font-size: 65px;
    margin-top: 100px;
    margin-bottom: 70px;
  }

  .service-item02 p {
    font-size: 22px;
  }

  .service-item02 span {
    font-size: 16px;
  }

  .service-item02 h4::after {
    max-width: 150px;
  }

  .service-tit03 {
    font-size: 35px;
  }

  .service-desc02 {
    font-size: 16px;
  }
  
  .service-tit04 {
    font-size: 22px;
  }

  .jener-service-item {
    width: 100%;
    padding: 20px 25px;
  }

  .jener-service-item p {
    margin-top: 15px;
  }

  .jener-service-item span {
    font-size: 20px;
  }

  .service-area04 {
    padding: 100px 0;
  }

  .system-list {
    flex-direction: column;
    align-items: center;
    margin-top: 90px;
  }

  .system-item {
    width: 100%;
    max-width: 250px;
  }
  

  .system-item + .system-item {
    margin-top: 50px;
  }

  .system-item p {
    font-size: 18px;
  }

  .system-item p::before {
    width: 60px;
    height: 60px;
  }

  .service-desc03 {
    font-size: 25px;
  }

  .service-desc03 span {
    font-size: 30px;
  }

  .system-item02 {
    flex-direction: column;
  }

  .system-item02 p {
    width: 50%;
    margin: 0 auto 20px;
    font-size: 18px;
  }

  .system-item02-sub {
    font-size: 16px;
  }

  .network-list {
    flex-direction: column;
  }

  .network-item {
    width: 100%;
    padding: 16vw 30px 16vw;
  }

  .network-item + .network-item {
    border-left: none;
    border-top: 1px solid rgba(255,255,255,0.2);
  }

  .network-item .num {
    font-size: 26px;
  }

  .network-item .kor {
    font-size: 24px;
  }

  .network-desc {
    font-size: 20px;
  }

  .network-desc.line01::before {
    width: 55px;
  }

  .security-item {
    width: 100%;
    margin-right: 0;
  }

  .security-item + .security-item {
    margin-top: 50px;
  }

  .security-item img {
    max-width: 250px;
  }

  .security-link {
    font-size: 20px;
  }

  .data-list {
    gap: 20px;
  }

  .data-item {
    padding: 10px 25px;
  }

  .data-item .num {
    font-size: 20px;
  }

  .data-item .tit {
    font-size: 20px;
    margin: 10px 0;
  }

  .data-item p {
    font-size: 14px;
    line-height: 1.2;
  }

  .performance-top .service-desc02 span {
    display: block;
  }

  .jener-service-list.data {
    gap: 20px;
  }

  .jener-service-list.data .jener-service-item {
    width: calc(50% - 10px);
    min-height: 130px;
  }

  .cert-item02 p {
    font-size: 16px;
    margin-top: 10px;
  }

  .invil-top-txt {
    margin-right: 0;
  }

  .invil-top-txt span {
    font-size: 22px;
  }

  .invil-top-txt h2 {
    font-size: 50px;
  }

  .invil-top-txt p {
    font-size: 36px;
  }

  .invil-link {
    font-size: 24px;
    height: 80px;
    /* padding-left: 11.4285%; */
  }

  .invil-txt01 {
    font-size: 20px;
  }

  .invil-txt02-wrap {
    height: 800px;
  }

  .invil-txt02 {
    font-size: 30px;
  }

  .invil-txt02 span {
    font-size: 40px;
  }
}

@media screen and (max-width: 640px) {
  /** 기업정보 - 소개 */
  .output-list {
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: center;
    margin-top: 90px;
  }

  .output-item {
    width: 100%;
    max-width: 250px;
    padding-top: 0;
    align-items: center;
    justify-content: center;
    margin: 0;
  }

  .output-item + .output-item {
    margin-top: 20px;
  }

  
}

@media screen and (max-width: 480px) {
  /** 모바일 세로 */

  /** 기업정보 - 소개 */
  .partner-item {
    width: calc((100% / 2) - 10.25px);
  }

  .vip .partner-item {
    width: 100%;
  }

  /** 기업정보 - 핵심가치 */
  .value-list1 {
    flex-direction: column;
    background: none;
  }

  .value-item1.item1,.value-item1.item2, .value-item1.item3 {
    width: 100%;
    max-width: 250px;
    border: 2px solid var(--main-color);
    border-radius: 50%;
    aspect-ratio: 1/1;
    display: flex;
    justify-content: center;
    flex-direction: column;
  }

  .value-item1.item2 {
    border: 2px solid #a383f5;
  }

  .value-item1 + .value-item1 {
    margin-top: 20px;
  }

  .value-item2 + .value-item2 {
    margin-top: 40px;
  }

  .value-item2, .value-item2:nth-child(2) {
    flex-direction: column;
  }

  .value-item2:nth-child(2) {
    text-align: left;
  }

  .value-list2-txt {
    width: 100%;
    padding: 0;
  }

  .value-item2:nth-child(2) .value-list2-txt {
    padding: 0;
  }

  .value-list2-img {
    width: 100%;
    margin-top:20px;                        
  }

  .service-item p::before {
    margin-bottom: 15px;
    width: 40px;
    height: 40px;
  }

  .security-link i {
    width: 30px;
    background: url('/common/images/content/network_arr_mo_off.png') no-repeat center center/contain;
  }

  .jener-service-list.data .jener-service-item {
    width: 100%;
    min-height: 110px;
  }

  .cert-list02 {
    flex-direction: column;
  }

  .cert-item02 {
    width: 100%;
    max-width: 200px;
    margin: 0 auto;
  }

  .cert-item02 + .cert-item02 {
    margin-top: 30px;
  }

  .invil-link::after {
    width: 30px;
    background: url('/common/images/content/network_arr_mo_off.png') no-repeat center center/contain;
  }
}



/* 문하영 서브페이지 css 추가 */
/* 상품소개 - 망연계솔루션IEUM */
.sub_top_wrap{}
.sub_bg{background: url(/common/images/content/introduce/background.jpg) top center no-repeat; width: 100%; height: 600px; position: absolute; top: 0; left: 0;}
.sub_top_box{margin:190px auto;}
.sub_top_box ul{margin-bottom: 60px;}
.sub_top_box li{color: #939393; display: inline-block; font-size: 16px;}
.sub_top_box li.last{color: #fff;}
.sub_top_box p{margin-bottom: 26px; color: #7a13f0; font-size: 20px; font-weight: 400;}
.sub_top_box h2{color: #fff; font-size: 65px; font-weight: bold;}
.sub_content_wrap{padding: 150px 0 70px;}
.sub_content_wrap h4{text-align: center; color: #fff; font-weight: bold; font-size: 30px; margin-bottom: 90px;}
.sub_content_wrap h4 p{font-size: 50px; display: inline-block; margin-right: 8px;}
.sub_content_wrap span{color: #7a13f0;}
.product_box{position: relative; background: url(/common/images/content/introduce/ieum/background01.jpg) top center no-repeat; padding: 150px 100px; margin-bottom: 350px;}
.product_title h5{font-size: 40px; font-weight: bold; margin-bottom: 40px;}
.product_title p{font-size: 30px; font-weight: 400; line-height: 1.3;}
.product_title div{margin-top: 50px; clear: both;}
.sub_content_wrap a.btn_more_animation:before {left: 207px;}
.sub_content_wrap a.btn_more_animation:hover:before {left: 0;}
.sub_content_wrap a.btn_more_animation:hover{width: 260px;}
.sub_content_wrap a.btn_more_animation:hover:before{width: 260px;}
.product_img{position: absolute; right: 0; top: 500px;}
.sub_content_title{font-size: 50px; font-weight: 600; margin: 120px auto 80px; text-align: center;}
.sub_content_title span{color: #7a13f0;}
.sub_content_tab .tabs{width:100%; text-align: center;}
.sub_content_tab .tabs li{display: inline-block; width: 121px; height: 61px; line-height: 61px; cursor: pointer; font-size: 20px; color: #c8c8c8;}
.sub_content_tab .tabs li.active{background-color: #7a13f0; color: #fff; border-radius: 30px;}
.tab_product_img{width: 100%; text-align: center; margin: 90px 0 20px;}
.table{display: table; width:100%; border-top:2px solid #535353;}
.row {display: table-row;}
.row .cell:nth-child(2n-1){width:10%;}
.row .cell:nth-child(2n){width:40%;}
.row .cell:nth-child(3){border-left:1px solid #535353;}
.cell{display: table-cell; padding: 20px 60px; border-bottom:1px solid #535353;}
.cell p{vertical-align: middle; font-size: 20px; color: #c8c8c8; font-weight: 200; line-height: 1.2;}
.cell p.th{font-weight: 500;}
.tab_diagram_img{background-color: #fff; padding: 50px; text-align: center;}
.sub_content_box_back{background: url(/common/images/content/introduce/ieum/background02.jpg) no-repeat; padding: 10px 0;}
.sub_content_box{margin-top: 150px;}
.ieum_icon_wrap{display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap;}
.ieum_icon_wrap li{width:20%; justify-content: center; align-items: center; display: flex; flex-flow: column; margin-bottom: 50px;}
.ieum_icon_wrap li div{display: flex; justify-content: center; align-items: center; background-color: rgba(255,255,255,.2); border-radius: 50%; width: 200px; height: 200px; text-align: center;}
.ieum_icon_wrap p{color: #fff; font-size: 25px; font-weight: 500; margin-top: 30px; text-align: center; height: 50px;}
.point_content_wrap{overflow: hidden; margin-bottom: 100px;}
.point_content_box{float: left; width: 33.333%; box-sizing: border-box; text-align: center; border-right: 1px solid #333;}
.point_content_box:first-child{border-left: 1px solid #333;}
.point_img{width: 100%; text-align: center;}
.point_num{font-size: 40px; font-weight: bold; text-align: center; color: #7a13f0; width: 100%; margin: 20px auto;}
.point_title{font-size: 24px; font-weight: 700; text-align: center; color: #fff; width: 100%;}
.point_txt{width:70%; margin: 20px auto;}
.point_txt li{font-size: 20px; font-weight: 300; color: #c8c8c8; margin-bottom: 15px; position: relative; padding-left:20px; text-align: left; letter-spacing: -.5px;}
.point_txt li:after{content: ''; position: absolute; top: 50%; left: 0; width:4px; height:4px; background-color: #7a13f0; border-radius: 50%; transform: translateY(-50%);}
.point_txt .important{color: #7a13f0;}
.partner_content_title{color: #7a13f0; border: 2px solid #7a13f0; text-align: center; padding: 5px; border-radius: 60px; background-color: transparent; min-width:265px; display: inline-block; font-size: 30px; margin-bottom: 50px;}
.partner_content_logo{display: flex; justify-content: stretch; align-items: center; flex-flow: wrap; margin-bottom: 90px;}
.partner_content_logo li {margin-bottom: 40px; padding: 0 10px; text-align: center;}
.partner_content_logo li img{vertical-align: middle;}

@media all and (max-width:1600px){
  .sub_bg{height:300px;}
  .sub_top_box{margin: 0; height:300px; padding: 100px 20px 50px;}
  .sub_top_box ul{margin-bottom: 30px;}
  .sub_top_box p{margin-bottom: 10px;}
  .sub_top_box h2{font-size: 35px;}
  .product_box{padding: 50px; margin-bottom: 250px;}
  .product_title h5{font-size: 30px;}
  .product_title p{font-size: 20px;}
  .product_img{top: 250px; right: 30px;}
  .product_img img{width: 700px;}
  .sub_content_title{font-size: 35px; margin: 100px auto 50px;}
  .ieum_icon_wrap p{font-size: 20px;}
  .ieum_icon_wrap{justify-content: start;}
  .sub_content_wrap{padding-top: 70px;}
  .sub_content_wrap h4{font-size: 30px; margin-bottom: 70px;}
  .sub_content_wrap h4 p{font-size: 30px;}
}

@media all and (max-width:1200px){
  .table_ieum .row .cell:nth-child(2n-1){width: 130px;}
  .row .cell:nth-child(2n-1){width:5%;}
  .row .cell:nth-child(2n){width: 45%;}
  .cell{padding: 20px;}
  .tab_product_img img{width: 50%;}
  .ieum_icon_wrap li{width: 25%; margin-bottom: 20px;}
  .ieum_icon_wrap li div{width: 150px; height: 150px;}
  .ieum_icon_wrap li div img{width: 80px;}
  .ieum_icon_wrap p{height: 30px;}
  .product_img{position: initial; text-align: right;}
  .product_box{padding-bottom: 0; margin-bottom: 0;}
  .product_title div{margin-top:20px;}
  .product_img{margin-top: 30px;}
  .product_img img{width: 500px; transition: .5s;}
  .point_title{font-size: 20px;}
  .point_txt{width: 90%;}
  .point_txt li{font-size: 17px;}
  .point_content_box{width:32.666%; margin-right:1%;}
  .point_content_box:last-child{margin-right: 0;}
  .partner_content_title{min-width: auto; font-size: 20px; height:40px; line-height: 37px; padding: 0 20px;}
  .partner_content_logo li{margin-bottom: 0; height:50px; box-sizing: border-box;}
  .partner_content_logo li img{height: 30px; max-width: 100%;}
  .point_content_box{border-right: 0;}
  .point_content_box:first-child{border-left: 0;}
}

@media all and (max-width:768px){
  .product_title h5{margin-bottom: 30px; font-size: 25px;}
  .product_title p{font-size: 17px;}
  .sub_content_wrap{padding: 70px 0 50px;}
  .sub_content_wrap h4{font-size: 20px;}
  .sub_content_wrap h4 p{display: block; line-height: 1.3; font-size: 30px;}
  .cell p{font-size: 17px;}
  .ieum_icon_wrap li div{width: 100px; height: 100px;}
  .ieum_icon_wrap li div img{width: 50px;}
  .ieum_icon_wrap p{font-size: 15px;}
  .sub_content_wrap a.btn_more_animation:before {left: 175px;}
  .product_box{margin-bottom: 100px;}
  .sub_content_title{font-size: 25px; margin: 30px auto 50px;}
  .point_content_box{width: 100%; float: initial;}
  .point_content_box{border-bottom: 1px solid #333; padding: 20px;}
  .point_title, .point_num{text-align: left; display: inline-block; width: auto; vertical-align: middle;}
  .point_num{margin-right: 5px;}
  .point_txt li{margin-bottom: 5px; line-height: 1.2;}
  .sub_content_title span{display: block; line-height: 1.2; font-size: 35px;}
  .product_img img{width: 100%;}
  .partner_content_title{margin-bottom: 30px; font-size: 17px;}
  .point_content_wrap{margin-bottom: 70px;}
  .row{width: 100%; display:block;}
  .row .cell{float: left; box-sizing: border-box; height:auto;}
  .row .cell:nth-child(2n-1){width: 30%;}
  .row .cell:nth-child(2n){width: 70%;}
  .cell{padding: 10px;}
  .row .cell:nth-child(3){border-left: 0;}
}

@media all and (max-width:500px){
  .sub_content_wrap{padding-top: 50px;}
  .sub_content_wrap h4{margin-bottom: 50px;}
  .sub_content_title{margin-bottom: 30px;}
  .product_box{padding: 30px 20px; margin-bottom: 70px;}
  .product_title h5{font-size: 20px;}
  .sub_content_tab .tabs li{height:40px; line-height: 40px; width:80px; font-size: 20px;}
  .row:nth-child(4) .cell:nth-child(-n+2){height:70px;}
  .tab_product_img{margin-top: 50px;}
  .ieum_icon_wrap li div{width: 85px; height: 85px;}
  .ieum_icon_wrap p{margin-top: 20px;}
  .sub_content_box{margin-top:70px}
  .sub_content_box_back{margin-bottom: 50px;}
}

/* 상품소개 - 아파트망분리솔루션 */
.table3 .row .cell{width:33.333%;}
.table3 .row .cell:nth-child(1){width: 24%;}
.table3 .row .cell:nth-child(2){width: 38%;}
.table3 .row .cell:nth-child(3){width: 38%; border-left:0;}
.diagram_content_wrap{margin-bottom: 250px;}
.diagram_box_wrap div{margin-top: 70px;}
.diagram_box_wrap .mobile{display: none;}
.diagram_box{display: flex; justify-content: space-between; align-items: center; box-sizing: border-box;}
.tab_text_box{color: #c8c8c8; font-size: 30px; text-align: center; margin: 60px auto;}
.sub_content_tab{margin-bottom: 200px;}
.wallpad_box_wrap{display: flex; justify-content: space-between; align-items: center; margin-bottom: 35px;}
.wallpad_box_title{color: #fff; font-size: 22px; font-weight: 400; text-align: center; width: 100%; background-color: #787878; height: 50px; line-height: 50px;}
.wallpad_box_content{border: 2px solid #787878; margin-top: 10px; height: 500px;}
.wallpad_box_content ul{height: 100%; display: flex; flex-direction: column; justify-content: center; padding: 0 30px;}
.wallpad_box_content li{color: #fff; font-size: 18px; margin-bottom: 20px;}
.wallpad_box_content li p{color: #7a13f0; display: inline-block; margin-right: 5px;}
.wallpad_box_content li:last-child{margin-bottom: 0;}
.wallpad_box_img{border: 2px solid #787878; margin-top: 10px; height: 500px; display: flex; align-items: center; justify-content: center;}
.product_box2 a.btn_more_animation:before{left: 223px;}
.product_box2 a.btn_more_animation:hover:before{left: 0;}
.wallpad_box_wrap3{position: relative; width: 100%;}
.wallpad_box_wrap3 .wallpad_box{width:49%; text-align: center;}
.wallpad_box_txt{font-size: 22px; margin-top: 15px; line-height: 1.3;}
.wallpad_box_txt span{font-size: 30px; color: #7a13f0; display: block; font-weight: bold;}
.wallpad_box_wrap2 .wallpad_box:first-child{width:35%; margin-right: 2%;}
.wallpad_box_wrap2 .wallpad_box:last-child{width: 63%;}
.wallpad_box_wrap3 .wallpad_box:first-child{margin-right: 2%;}
.wallpad_box_wrap3 .wallpad_box_content{height: 210px; padding: 20px 0 0;}
.tab_product_img2{display: flex; justify-content: center; align-items: center; width: 100%;;}
.tab_product_img2 img{padding: 0 10px;}
.wallpad_box_wrap3:after{content: 'VS'; font-size: 100px; color: #7a13f0; font-weight: bold; top: 50%; left: 50%; transform: translate(-50%, -50%); position: absolute;}

@media all and (max-width:1600px){
  .table3 .row{display: table-row;}
  .table3 .row:nth-child(3) .cell, .table3 .row:nth-child(4) .cell{height: 62px;}
  .tab_text_box{font-size: 20px;}
}

@media all and (max-width:1280px){
  .wallpad_box_wrap2, .wallpad_box_wrap3{flex-direction: column;}
  .wallpad_box_wrap2 .wallpad_box:first-child, .wallpad_box_wrap2 .wallpad_box:last-child{width: 100%; margin-right: 0;}
  .wallpad_box_wrap3 .wallpad_box{width: 100%; margin-right: 0;}
  .wallpad_box_content{height: auto; padding: 30px 10px; margin-bottom: 30px;}
  .wallpad_box_wrap3 .wallpad_box_content{height: auto; padding: 20px 30px;}
  .wallpad_box_wrap3:after{top: 45.1%; font-size: 50px; color: #fff;}
  .wallpad_box_wrap3 .wallpad_box_content{margin-bottom: 60px;}
  .wallpad_box_wrap3 .wallpad_box:first-child{margin-right: 0;}
  .wallpad_box_wrap3{margin-top: 100px;}
  .wallpad_box_img{height: auto;}
  .sub_content_tab{margin-bottom: 70px;}
  .diagram_box_wrap div{text-align: center;}
  .diagram_box_wrap .mobile{display: inline-block;}
  .diagram_box_wrap .pc{display: none;}
  .diagram_content_wrap{margin-bottom: 70px;}
}

@media all and (max-width:768px){
  .sub_content_wrap .product_box2 a.btn_more_animation:before {left: 186px;}
  .sub_content_wrap .product_box2 a.btn_more_animation:hover:before{left: 0;}
  .table3 .row:nth-child(3) .cell{height: 90px;}
  .wallpad_box_title{font-size: 17px;}
  .wallpad_box_txt{font-size: 17px;}
  .wallpad_box_txt span{font-size: 20px;}
  .wallpad_box_content li{font-size: 17px;}
}

@media all and (max-width:530px){
  .wallpad_box_wrap3:after{top: 43.2%;}
}

/* 상품소개 - cctv */
.product_box3{background: url(/common/images/content/introduce/cctv/background.jpg) top center no-repeat;}
.product_img2{top: 240px; right: 20px;}
.wallpad_box_wrap4{margin-bottom: 200px;}
.wallpad_box_wrap4 .wallpad_box_img, .wallpad_box_content2{height:662px;}
.wallpad_box_wrap4 .wallpad_box{width:32.555%; margin-right: 1%;}
.wallpad_box_wrap4 .wallpad_box:last-child{margin-right: 0;}
.product_box3 a.btn_more_animation:before{left: 225px;}
.product_box3 a.btn_more_animation:hover:before{left: 0; width: 330px;}
.product_box3 a.btn_more_animation:hover{width:330px;}

@media all and (max-width:1280px){
  .wallpad_box_wrap4{margin-bottom: 100px; flex-wrap: wrap;}
  .wallpad_box_wrap4 .wallpad_box{width: 49.5%;}
  .wallpad_box_wrap4 .wallpad_box:nth-child(2){margin-right: 0;}
  .wallpad_box_wrap4 .wallpad_box:last-child{width: 100%; margin-top: 30px;}
  .wallpad_box_content ul{padding: 0;}
  .wallpad_box_content .list_wrap li{margin-bottom: 10px;}
  .wallpad_box_content .list_wrap li br{display: none;}
  .wallpad_box_wrap4 .wallpad_box_img, .wallpad_box_content2{height: auto;}
}

@media all and (max-width:768px){
  .product_box3 a.btn_more_animation:before {left: 186px;}
  .product_box3 a.btn_more_animation:hover:before{left: 0;}
  .wallpad_box_content .list_wrap li{font-size: 15px;}
  .wallpad_box_content .list_wrap li:after{top: 7px;}
}

/* 상품소개 - disk */
.product_box4{background: url(/common/images/content/introduce/disk/background01.jpg) top center no-repeat;}
.product_box4 a.btn_more_animation:before{left: 260px;}
.product_box4 a.btn_more_animation:hover:before{left: 0; width: 330px;}
.product_box4 a.btn_more_animation:hover{width:330px;}
.product_img3{top: 200px; right: 20px;}
.list_wrap{position: relative;}
.list_wrap li{padding-left: 25px; position: relative; margin-bottom: 35px; line-height: 1.5;}
.list_wrap li:after{content: ''; position: absolute; top: 10px; left: 0; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background-color: #7a13f0;}
.sub_content_title2{text-align: left; line-height: 1.3;}
.storage_text{width:100%; color: #c8c8c8; font-size: 30px; line-height: 1.3; text-align: center; padding: 30px 20px; border: 2px solid #7a13f0; border-radius: 30px;}
.storage_box{display: flex; justify-content: space-between;}
.storage_box div:last-child{padding-left: 40px;}
.storage_box p{font-size: 40px; font-weight: bold; margin-bottom:30px;}
.storage_box .list_wrap li{font-size: 22px; font-weight: 400;}
.storage_list > li{border-bottom: 1px solid #333; display: flex; justify-content: space-between; align-items: center; padding: 50px 0;}
.storage_list > li:last-child{border-bottom: 0;}
.storage_list_wrap{width: 100%; margin-top: 150px;}
.storage_list_icon{text-align: center; border: 2px solid #7a13f0; border-radius: 50%; width: 130px; height: 130px; display: flex; align-items: center; justify-content: center; min-width: 130px;}
.storage_list_title{font-size: 35px; font-weight: 600; text-align: left; width:25%; line-height: 1.5;}
.storage_list_txt{font-size: 22px; font-weight: 300; line-height: 1.4; width:60%;}
.table{width: 100%; table-layout: fixed;}
.table thead th{font-size: 30px; font-weight: 600; height: 50px;}
.table th{color: #c8c8c8; font-size: 23px; text-align: center; border-right: 1px solid #535353; border-bottom: 1px solid #535353; height: 50px; font-weight: 300; padding: 20px; min-width: 290px;}
.table td{color: #c8c8c8; font-size: 23px; text-align: center; border-right: 1px solid #535353; border-bottom: 1px solid #535353; padding: 20px; font-weight: 300; line-height: 1.3;}
.table td:last-child, .table th:last-child{border-right: 0;}
.table_small_txt td{font-size: 20px;}
.table_small_txt small{display: block; clear: both; margin-top: 5px;}
.disk_table_Wrap, .nas_content_wrap{margin-bottom: 150px;}

@media(max-width:1600px){
  .product_img3{top: 50px;}
  .product_img3 img{height: 400px; width: auto;}
}
@media(max-width:1280px){
  .storage_text{font-size: 20px; text-align: left;}
  .storage_text br{display: none;}
  .sub_content_title2{margin-top: 70px; margin-bottom: 20px; font-size: 30px;}
  .storage_box p{font-size: 25px;}
  .storage_box .list_wrap li{font-size: 17px; margin-bottom: 15px;}
  .storage_list_wrap{margin-top: 70px;}
  .storage_list_title{font-size: 23px; padding: 0 20px;}
  .storage_list_title br{display: none;}
  .storage_list_txt{font-size: 17px;}
  .storage_list_txt .list_wrap li{margin-bottom: 15px;}
  .table thead th{font-size: 20px;}
  .table th, .table td{font-size: 17px; padding: 20px 5px;}
}

@media(max-width:1000px){
  .storage_box{flex-direction: column;}
  .storage_box > div:first-child{text-align: center; margin-bottom: 70px;}
  .storage_box img{width: 70%;}
  .storage_box div:last-child{padding-left: 0;}
}

@media all and (max-width:768px){
  .product_box4 a.btn_more_animation:before {left: 215px;}
  .product_box4 a.btn_more_animation:hover:before{left: 0;}
  .product_img3 img{height: auto;}
  .disk_content_wrap, .nas_content_wrap{overflow: hidden; margin-bottom: 70px;}
  .disk_table_wrap{width: 100%; overflow-x: scroll;}
  .table{width: 800px;}
  .storage_list > li{flex-direction: column; padding: 30px 20px; border-bottom: 1px solid #333;}
  .storage_list_title{width: 100%; text-align: center; margin: 10px 0;}
  .storage_list_title br{display: none;}
  .storage_list_txt{width: 100%;}
}

/* 채용안내 */
.sub_bg_info{background: url(/common/images/content/employment/background.jpg) top center no-repeat;}
.about_title_wrap{margin-bottom: 75px; text-align: left;}
.about_title_wrap h4{color: #fff; font-size: 60px; font-weight: 600; margin-bottom: 30px; text-align: left;}
.about_title_wrap p{color: #fff; font-size: 22px; font-weight: 200; line-height: 1.4;}
.about_content_wrap > p{color: #7a13f0; font-size: 25px; font-weight: bold; margin-bottom: 20px;}
.about_content_wrap h5{font-size: 40px; font-weight: 600;}
.info_img_wrap{display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; width: 100%; margin-top: 60px;}
.info_img_wrap li{width:21.25%; margin-right: 5%; margin-bottom: 50px; text-align: center; border: 2px solid #939393; border-radius: 25px; padding: 80px 30px;}
.info_img_wrap li:nth-child(4n){margin-right: 0;}
.info_img_wrap p{font-size: 22px; color: #ffffff; font-weight: 300; margin-top: 30px; height: 40px;}
.about_content_wrap{margin-bottom: 90px;}
.about_tab_wrap .tabs{text-align: left;}
.about_tab_wrap .tabs li{text-align: center;}
.about_tab_wrap ul{margin-top: 70px; width: 100%;}
.info_img_wrap2 li{border: 0; margin-right: 0;}
.info_img_wrap2 li:nth-child(2n-1){width: 20%; margin-right: 0;}
.info_img_wrap2 li:nth-child(2n){width: 20%; padding: 0;}
.about_tab_wrap .list_wrap li{font-size: 18px; margin-bottom: 10px;}
.about_tab_wrap ul.list_wrap{margin-top: 0;}
.info_img_wrap2 li div:first-child{font-size: 20px; margin-bottom: 20px; width: 260px; font-weight: 600;}
.info_img_wrap2 li div:first-child span{color: #7a13f0;}
.info_img_wrap2 li div:nth-child(2){border: 2px solid #939393; border-radius: 50%; width: 260px; height: 260px; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.info_img_wrap2 p{margin-top: 20px; height: auto;}
.about_tab_wrap .info_img_wrap2{margin-top: 0;}
.tab_content .info_img_wrap p{height: auto;}

@media(max-width:1600px){
  .info_img_wrap2 li:nth-child(2n-1), .info_img_wrap2 li:nth-child(2n){width: auto;}
  .info_img_wrap2 li{padding: 50px 0;}
}

@media(max-width:1280px){
  .info_img_wrap li{padding: 50px 20px;}
  .info_img_wrap li img{width: 50px;}
  .info_img_wrap p{font-size: 17px;}
  .about_tab_wrap .info_img_wrap2{margin-top: 30px;}
  .info_img_wrap2 li:nth-child(2n-1){width: 33%; border: 2px solid #939393;}
  .info_img_wrap2 li:nth-child(2n){display: none;}
  .info_img_wrap2 li div:first-child{width: 100%;}
  .info_img_wrap2 li div:nth-child(2){width: 100%; border-radius: 0; border: 0; height: auto;}
}
@media(max-width:768px){
  .about_title_wrap p{font-size: 17px;}
  .about_content_wrap h5{font-size: 30px;}
  .info_img_wrap li{padding: 20px; margin-bottom: 20px; width:49%; margin-right: 2%;}
  .info_img_wrap li:nth-child(2n){margin-right: 0;}
  .info_img_wrap p{margin-top: 10px; line-height: 1.1;}
  .info_img_wrap{margin-top: 30px;}
  .about_tab_wrap .tabs{margin-top: 30px;}
  .about_content_wrap{margin-bottom: 50px;}
  .about_tab_wrap ul{margin-top: 40px;}
  .about_tab_wrap .tabs li{font-size: 17px;}
  .about_tab_wrap .list_wrap li{font-size: 15px;}
  .about_tab_wrap .list_wrap li:after{top: 6px;}
  .info_img_wrap2 li:nth-child(2n-1) div, .tab_content .info_img_wrap p{font-size: 14px;}
}

/* 고객센터 */
.sub_bg_service{background: url(/common/images/content/support/background.jpg) top center no-repeat;}
.service_title_wrap h4{color: #fff; font-size: 50px; font-weight: 600; text-align: left;}
.service_title_wrap h4 span{color: #7a13f0;}
.service_content_wrap{border-top: 2px solid #fff; padding-top: 70px; background: url(/common/images/content/support/logo.png) right bottom no-repeat;}
.text_icon{position: relative; padding-left: 20px; font-size: 30px;}
.text_icon:after{position: absolute; content: ''; left: 0; top: 15px; width: 5px; height: 5px; background-color: #fff; border-radius: 50%;}
.tel_number_wrap{margin-bottom: 70px;}
.tel_txt_big{font-size: 50px; font-weight: bold; margin-top: 30px;}
.tel_txt{font-size: 30px; margin-top: 30px;}
.tel_txt_small{font-size: 25px; margin-top: 30px; line-height: 2;}

@media(max-width:1280px){
  .service_title_wrap h4{font-size: 35px;}
}

@media(max-width:768px){
  .service_title_wrap h4{font-size: 25px;}  
  .text_icon{font-size: 20px;}
  .tel_txt_big, .tel_txt, .tel_txt_small{font-size: 20px; margin-top: 15px; line-height: 1.3; padding-left: 20px;}
  .text_icon:after{top: 10px;}
  .tel_number_wrap{margin-bottom: 40px;}
  .service_content_wrap{padding-top: 50px; background-position: 50% 50%;}
}

/* 취합 후 추가 css */
html.fp-enabled #container.intro{background-color: #1a1a1a;}
.partner{margin-top: 20px;}
.sub_bg_company{background: url(/common/images/content/company/background.jpg) top center no-repeat;}
.sub_bg_business{background: url(/common/images/content/business/background.jpg) top center no-repeat;}
@media(min-width:1200px){
  .history-tab-list{overflow-y: hidden;}
}

/* 20240213 서버 올린 후 추가 css */
.partner_content_logo li img:hover{filter: invert(1); transition: .5s;}

/****** 20240214 추가 ******/
/* 사업분야 - 인빌쇼핑 */
.invil-txt02-wrap{background: none; height: auto;}
.invil-img02-wrap{text-align: center; margin-top: 60px;}
.invil-line-wrap{height: 360px; text-align: center; margin: 60px 0;}
.invil-line{border: 1px solid #fff; display: inline-block; width: 1px; height:360px;}
.invil-top-txt{padding-top: 70px;}
.invil-link:hover{transition: .5s;}
.invil .sc-wrap{padding-bottom: 0;}

@media(max-width: 1600px){
  .invil-top-txt{padding-top: 0;}
  .invil-top{align-items: center;}
}
@media(max-width: 768px){
  nav.sub-nav{height: auto;}
  .sub-nav-item:hover a, .sub-nav-item.on a{padding-top: 20px; padding-bottom: 19px;}
}

/* 상품소개 - 소개 */
.intro .section #footer{padding: 80px 0;}

/* 기업정보 - 연혁 */
.history-tab-list{border-top: 0;}
.history-tab-box:before {border-top: 2px solid rgba(255,255,255,0.5); position: absolute; width: 100%; height: 1px; content: ''; top: -104px; left: 0;}
.history-tab-item.on button::before{top: 0;}
.history-tab-item.on button::after{top: 1px;}
@media(max-width:1280px){
  .history-tab-box:before{top: -84px;}
}
@media(max-width:768px){
  .history-tab-box:before{top: -59px;}
}

/* 사업분야 - 망연계 */
.security-link:hover{transition: .5s;}

/* 사업분야- 전산유지보수 */
.web{padding-bottom: 160px;}

/* 상품소개 - 망연계솔루션 */
.point_txt li.important{font-weight: 600;}

/* 상품소개 - 아파트 망분리 */
.wallpad .tab_product_img2{padding: 0 50px;}
.wallpad .tab_product_img2 img{width: 685px;}
.wallpad .tab_product_img2 img:first-child{margin-right: 50px;}
.wallpad .wallpad_box_content li{margin-bottom: 50px;}
.wallpad .wallpad_box_content li:last-child{margin-bottom: 0;}
@media(max-width:768px){
  .wallpad .wallpad_box_content li{margin-bottom: 20px;}
}

/* 상품소개 - cctv */
.cctv .wallpad_box_content li{margin-bottom: 50px;}
.cctv .wallpad_box_content li:last-child{margin-bottom: 0;}
@media(max-width:768px){
  .cctv .wallpad_box_content li{margin-bottom: 20px;}
}

/* 고객지원 - 고객센터 */
@media(max-width: 768px){
  .service_content_wrap{background-size: 50%; background-position: right bottom;}
}

/****** 20240216 추가 ******/
.tab_diagram_img{background: transparent; width: 1500px;}
.tab_diagram_img img{width: 100%;}
@media (max-width: 1400px) {
  .wallpad .tab_product_img2 img:first-child{margin-right:10px;}
  .wallpad .tab_product_img2 img{width: 50%;}
}
@media (max-width: 768px) {
  .service-area04{margin-top: 100px;}
  .scroll_table_wrap768{overflow-x: scroll;}
}
@media (max-width: 470px) {
  .sub-nav-item a{font-size: 15px;}
  .scroll_table_wrap{overflow-x: scroll;}
  .table_ieum{width:500px;}
  .table_ieum .row .cell:nth-child(2n-1){width:130px;}
  .row .cell:nth-child(2n){width:370px;}
}
@media (max-width: 375px) {
  /* 아이폰 미니 */

}

/*20240417 서브페이지 url 추가*/
.partner_content_logo li{cursor: pointer;}