@charset "utf-8";



.sp-title {font-size: 0px;}
.sp-label {font-size:50px; color:#333; text-transform: capitalize;}
.sp-label b{display: block; font-size: 20px; color: #0045FF;}
.sp-label b::after{display: none;}
.biz-service-ls .service-item .service-item-tit {font-size:0px !important;}
.biz-service-ls .service-item .service-item-tit .label {font-size:26px; line-height: 1.3;}
.biz-service-ls .service-item .bullet-item-ls .ls li {font-size: 15px;}
.result-content .content .desc-cont .item .wrap .desc strong {font-weight: 500;}

.location-content {
  .loca-content .loca-info {grid-template-columns: 1fr;}
}
.manhole-remote-content {
  .history-ls {flex-direction:column; gap:1rem}
}
.esco-content {
  .content3 .thumb-ls .ls .txt-cont .desc {line-height: 1.4;font-size: 15px !important; display: block;}
}
.greeting-content{
  .thumb-cont{margin-top: auto; height: 736px;}
  .thumb-cont .logo{margin: 0 32px 20px 0;}
}
.history-content{
  .his-section .content .his-desc .item .desc-cont li:before{transform: initial; top: 12px;}
  .his-section:nth-child(2) .content:before{height: calc(100% - 170px);}
}
.solar-power-plant-content{
  .sp-label{text-transform: initial;}
}


@media screen and (min-width:1400px){

  .mp-title {font-size: 34px;}
  .biz-area .content .item .mp-head {padding-inline: 60px;}
  .connect .quick_card__item .cont {flex-direction: column; align-items: flex-start; gap: 1rem;}
  .connect .link-btn {margin-left: auto;}
  .footer-col-body address {font-size: 17px;}
  .radar-item .item .inner .txt-box .txt .desc {font-size: 15px;}
  #iot .card-ls .card .tit-point {font-size: 16px;}
  .bullet-item-ls .item .ls li {font-size: 15px;}
  .bullet-icon-ls .txt {font-size: 15px;}

  .biz-area-content {
    .section-tit {font-size: 25px;}
    .tit-sml {font-size: 21px;}
    .desc {font-size: 16px;}
    .section-tit small {font-size: 18px;}
  }
  .landslide-detection-content {
    .content1 .floating-img img {width: 200px;}
    .radar-item .item1 { --hover-width: 416px; --hover-height: 110px; }
    .radar-item .item2 { --hover-width: 288px; --hover-height: 130px; }
    .radar-item .item3 { --hover-width: 312px; --hover-height: 130px; }
    .radar-item .item4 { --hover-width: 294px; --hover-height: 150px; }
  }
  .monitoring-diagram-content .menu-list .item .desc li {font-size: 16px;}

  .smart-agriculture-content {
    .section-tit {font-size: 23px;}
    .thumb-ls .item .tit {line-height: 1.4;font-size: 16px;}
    .radar-item .item1 { --hover-width: 380px; --hover-height: 110px; }
    .radar-item .item2 { --hover-width: 330px; --hover-height: 154px; }
    .radar-item .item3 { --hover-width: 390px; --hover-height: 127px; left:726px;}
    .radar-item .item4 { --hover-width: 333px; --hover-height: 127px; }
    .radar-item .item5 { --hover-width: 346px; --hover-height: 128px; top:277px;}
    .radar-item .item6 { --hover-width: 400px; --hover-height: 128px; left:400px;}
  }
  .smart-city-content {
    .section-tit {font-size: 23px;}
    .content1 .radar-item .item1 { --hover-width: 329px; --hover-height: 131px; }
    .content1 .radar-item .item2 { --hover-width: 310px; --hover-height: 131px; }
    .content1 .radar-item .item3 { --hover-width: 271px; --hover-height: 101px;  top: 258px;}
    .content1 .radar-item .item4 { --hover-width: 330px; --hover-height: 127px; }
    .content1 .radar-item .item5 { --hover-width: 368px; --hover-height: 150px; }
    .content1 .radar-item .item6 { --hover-width: 365px; --hover-height: 101px; }
    .content1 .radar-item .item7 { --hover-width: 330px; --hover-height: 130px; }
    .content1 .radar-item .item8 { --hover-width: 423px; --hover-height: 125px; }
    .content1 .radar-item .item9 { --hover-width: 340px; --hover-height: 172px; }
    .content1 .radar-item .item10 { --hover-width: 346px; --hover-height: 157px; }
    .content1 .radar-item .item11 { --hover-width: 368px; --hover-height: 155px; }
    .content1 .radar-item .item12 { --hover-width: 333px; --hover-height: 127px; }
    .content1 .radar-item .item13 { --hover-width: 328px; --hover-height: 109px; }
    .content1 .radar-item .item14 { --hover-width: 409px; --hover-height: 153px; }
    .content1 .radar-item .center { --hover-width: 427px; --hover-height: 156px; }
    .feature-icon-ls .icon-ls li .txt {font-size: 15px;}

    .content3 .radar-item .item1 { --hover-width: 393px; --hover-height: 154px;}
    .content3 .radar-item .item2 { --hover-width: 373px; --hover-height: 108px;}
    .content3 .radar-item .item3 { --hover-width: 320px; --hover-height: 138px;}
    .content3 .radar-item .item4 { --hover-width: 334px; --hover-height: 138px;}
  }
  .smart-industry-content {
    .bullet-item-ls {width: 100%;}
    .content3 .noti {font-size: 13px; line-height: 1.3;}
    .bullet-item-ls .item .ls li {line-height: 1.5;}
    .content3 .item .wrap {padding-bottom: 2rem; min-height: 280px;}
    .content3 .prod-feature .feat li {font-size: 13px;}
  }
  .smart-metering-content {
    .content1 .radar-item .item1 { --hover-width: 447px; --hover-height: 180px;}
    .content1 .radar-item .item2 { --hover-width: 375px; --hover-height: 136px;}
    .content1 .radar-item .item3 { --hover-width: 348px; --hover-height: 140px;}
  }
  .overview-content {
    .vision-card .head .typo {font-size: 32px;}
    .vision-card .head .txt-cont .tit {font-size: 19px;}
  }
  .greeting-content {
    .text-cont .typo {font-size: 32px; padding-bottom: 40px;}
  }
  .history-content {
    .his-section .banner .inner .tit {font-size: 32px;}
    .his-section .banner .inner .desc {font-size: 18px;}
    .his-section:nth-child(3) .content:before {height:calc(100% - 72px);}
    
  }
  .optical-network-content {
    .biz-service-ls .service-item .bullet-item-ls .sub-tit {font-size: 18px; line-height: 1.4;}
  }
  .wireless-network-content {
    .section-tit {font-size: 22px;}
  }
  .electric-infrastructure-content {
    .section-tit {font-size: 22px;}
  }
  .business-development-content {
    .wwd-ls .item .text-cont .label {font-size: 20px;}
    .biz-service-ls .service-item .bullet-item-ls .sub-tit {font-size: 18px;}
  }
 
  
}

@media screen and (max-width:1399px){
  .section-tit {line-height: 1.5;}
  .company .mp-head {width: 100%;}
  .intro-hero .intro-hero-title {font-size: 54px;}
  .sp-label {font-size: 38px;}
  .dot {margin-top: .5rem;}
  .bullet-item-ls .item .ls li {line-height: 1.5;}
  .bullet-icon-ls .txt {font-size: 14px; line-height: 1.4;}
  .card-ls .card {min-height: 260px;}
  .hl-diagram > li .inner .cont .key {font-size: 15px;}
  .result-content .content:not(:nth-child(1)):before {height: calc(100% - 80px);}

  .history-content {
    .his-section .content .his-head .typo {font-size: 19px;}
    .his-section .content:before {height: calc(100% - 112px);}
    .his-section:nth-child(2) .content:before{height: calc(100% - 155px);}
    .his-section:nth-child(3) .content:before{height: calc(100% - 110px);}
    .his-section .banner .inner .tit {font-size: 24px; line-height: 1.3;}
    .his-section .content .his-desc .item .desc-cont li:before{top: 10px;}

  }
  .overview-content {
    .vision-card .head .typo {font-size: 27px;}
    .vision-card .head .txt-cont .tit {font-size: 18px;}
  }
  .greeting-content {
    .container {flex-direction: column-reverse; gap: 2rem;}
    .text-cont {width: 100%;} 
    .thumb-cont {width: 100%; height: 100px; display: flex; flex-direction: row; background: #f9f9f9;}
    .thumb-cont img {width: 200px;}
    .thumb-cont .logo {margin: 20px;}
  }
  .smart-industry-content {
    .content3 .wrapper {flex-direction: column; gap: 4rem;}
  }
  .oversea-performance-content {
    .biz-intro .content {gap: 2rem;}
    .content1 .map {width: 250px;}
  }
}
@media screen and (max-width:767px){
  .sp-head {padding-bottom: 26px;}
  .sp-label {font-size: 32px;}
  .sp-label b{font-size: 16px;}
  .mp-desc {font-size: 14px;}
  .intro-hero .intro-hero-title {font-size: 40px;}
  .company .comp-list .item {align-items: center; justify-content: center;}
  .biz-area .content .item .mp-head .mp-title {padding-bottom: 8px;}
  .bullet-item-ls .item .tit-point {font-size: 17px; line-height: 1.4;}
  .card-ls .card {min-height: auto;}
  .card-ls .card:nth-child(2) .thumb {margin-top: 0px;}
  .card-ls .card:not(:nth-child(2)) .thumb {margin-top: -10px;}
  .biz-service-ls .service-item .service-item-tit .label {font-size: 22px; }
  .biz-service-ls .service-item .service-item-content {padding-top: 0;}
  .biz-service-ls .service-item .bullet-item-ls .sub-tit {font-size: 16px;}

  .biz-area-content {
    .sp-label {font-size: 27px; line-height: 1.3;}
    .section-tit small {padding: 0;}
    .tit-sml {font-size: 17px;}
  }
  .overview-content {
    .vision-card .head .typo {font-size: 22px;}
  }
  #ceo-message {
    .sp-head {padding-bottom: 40px;}
    .text-cont .ceo-sign span {font-size: 16px;}
  }
  #history .nav-btn .btn {padding: .5rem 0;}
  .history-content {
    padding-top: 50px;
    .his-section .banner .inner .tit {font-size: 20px;}
    .his-section .content .his-desc .item .desc-cont li:before{top: 9px;}
    .his-section .content:before{height: calc(100% - 270px);}
    .his-section:nth-child(2) .content:before{height: calc(100% - 325px);}
    .his-section:nth-child(3) .content:before{height: calc(100% - 240px);}
  }
  .manhole-remote-content {
    .history-ls li .desc {line-height: 1.4;}
  }
  .smart-agriculture-content {
    .thumb-ls .item .tit {font-size: 14px;}
  }
  .smart-industry-content {
    .content3 .bullet-item-ls .item .tit-point {flex-direction: column; gap: .2rem; align-items: flex-start;}
    .content3 .noti {position: static; display: block;}
    .content3 .prod-feature .feat li {line-height: 1.4;}
  }
  .oversea-performance-content {
    .content1 .wrap:not(:last-child) {padding-bottom: 30px;}
    .biz-intro .content {gap: 1rem;}
    .content1 .map {width: 250px;}
    .tit-sml {padding-bottom: 10px;}
    .gray-board.shadow .info .tit {line-height: 1.4;}
    .gray-board.shadow .info .desc strong {line-height: 1.4; display: block;}
  }
  .innovation-product{
    .bg-gray .container img{content: url(../images/business-area/iot/landslide-content2-img-en.png);}
  }
}

@media screen and (max-width:399px){
  .nav-btn .btn {font-size: 13px;}
  #ceo-message {
    .text-cont .ceo-sign span {font-size: 14px;}
    .thumb-cont img:not(.logo) {width: 160px;}
  }
}