
body{
    background-color: #ffffff;
    font-family: "Open Sans";
}
body {
    min-width: auto;
}
.hero{
    padding-bottom: 45%;
}

.scroll-toggle:hover{
    cursor: pointer;
    color: #919699;
}
.outer-outer {
    height: 72px;
    position: relative;
    font-size: 13px;
}
.text-\[24px\] {
    font-size: 18px;
}
.mt-\[6px\]{
    margin-top: 15px;
}
.icon {
    width: 60px;
}
.icon-container {
    width: 100%;
}
.mt-\[240px\]{
    margin-top: 35px;
    margin-bottom: 35px;
}
.lunbo-bt{
    margin-top: 5%;
}
.km4{
    max-width: 1200px;
    justify-content: center;
    margin:0 auto;
    background-image: url("/catalog/view/theme/potensic/stylesheet/atom/img/4km-transmission-range.jpg");
    background-size: contain;
}
.easeuse{
    max-width: 1200px;
    justify-content: center;
    margin: 0 auto;
    background-image: url("/catalog/view/theme/potensic/stylesheet/atom/img/ease-to-use.jpg");
    background-size: contain;
}
@media screen and (max-width: 1600px) {
    .km4{
        margin: 2% auto;
    }
    .easeuse{
        margin: 2% auto;
    }
}
.pl-\[58px\]{
    padding-left: 58px;
    padding-right: 58px;
}
.text-\[36px\] {
    font-size: 26px;
}
/*.hero_content {
  width: 100%;
  position: absolute;
  top: 29%;
  left: 30%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}*/
@media screen and (max-width: 1920px) {
    .hero_inline_one-pro .hero_title-4km {
        display: inline-block;
        width: 100%;
        margin-bottom: 14vw;
        padding-right: calc(1.875rem + 10.5 * ((106vw - 20rem) / 29));
        padding-left: calc(1.875rem + 10.5 * ((26vw - 20rem) / 55));
        color: #ffffff;
        text-align: left;
    }
}
@media screen and (max-width: 1645px) {
    .hero_inline_one-pro .hero_title-4km {
        margin-bottom: 14vw;
        padding-right: calc(1.875rem + 10.5 * ((122vw - 20rem) / 29));
        padding-left: calc(1.875rem + 10.5 * ((26vw - 20rem) / 55));
    }
}
@media screen and (max-width: 1500px) {
    .hero_inline_one-pro .hero_title-4km {
        margin-bottom: 20vw;
        padding-right: calc(1.875rem + 10.5 * ((150vw - 20rem) / 29));
        padding-left: calc(1.875rem + 10.5 * ((26vw - 20rem) / 55));
    }
}
@media screen and (max-width: 1308px) {
    .hero_inline_one-pro .hero_title-4km {
        display: inline-block;
        width: 100%;
        margin-bottom: 17vw;
        padding-right: calc(1.875rem + 10.5 * ((95vw - 20rem) / 14));
        padding-left: calc(1.875rem + 10.5 * ((50vw - 20rem) / 55));
        color: #ffffff;
    }
    .hero_inline_one-pro .hero_title-4km h1{
        text-align: left;
        font-size: 22px;
    }
}
@media screen and (max-width: 768px) {
    .hero_inline_one-pro .hero_title-4km {
        margin-bottom: 1vw;
    }
    .hero_inline_one-pro .hero_title-4km h1{
        line-height: 33px;
    }
}

.hero_inline_one-pro .hero_title h1 {
    font-size: 22px;
}
.hero_inline_one-pro .hero_title span {
    font-size: 14px;
    color: #fff;
    letter-spacing: .54px;
    line-height: 30px;
}

@media screen and (max-width: 768px) {
    .outer-outer {
        height: 45px;

    }
    /*body {
      max-width: 768px;
      margin: auto;
    }

    .outer-outer {
      height: auto;
    }

    .hero_two_more {
      min-height: 258px;
    }

    .hero-swiper {
      min-height: 438px;
    }*/

    .easeuse {
        max-width: 1200px;
        justify-content: center;
        background-image: url("/catalog/view/theme/potensic/stylesheet/atom/img/ease-to-use.png");
        background-size: cover;
        margin: 14% 0 14% 0;
    }

    .km4 {
        max-width: 1200px;
        justify-content: center;
        background-image: url("/catalog/view/theme/potensic/stylesheet/atom/img/4km-transmission-range.jpg");
        background-size: cover;
        margin: 14% 0 14% 0;
    }
    .mt-\[240px\]{
        margin-top: 0px;
    }
    .hero_title h1 {
        font-size: 2.6em;
    }

    .md\:mt-\[140px\] {
        margin-top: 0px;
    }

    .md\:text-\[16px\] {
        font-size: 0.9em;
        text-align: center;
        line-height: 1.6;
        margin: 0;
        color: #000;
    }

    .text-\[36px\] {
        font-size: 19px;
        margin: 15px 0 5px 0;
    }

    .md\:items-center {
        padding: 0 2vw 0 2vw;
    }

    .text-\[24px\] {
        font-size: 14px;
        line-height: 22px;
    }

    .section_heading--top {
        padding: 5vw 5vw 0 5vw;
    }

    .hero_two_more .section_heading--top {
        text-align: center;
    }

}

  
  .hero_content_ease {
      top: 83%;
  }
.swiper-container {
    padding-bottom:60px;
}
.swiper-wrapper{
}
.swiper-slide1 {
    width:978px;
    transition-timing-function:linear;
}
@media only screen and (max-width:1200px){
    .swiper-slide1 {
        width:770px;
    }
}
@media only screen and (max-width:980px){
    .swiper-slide1 {
        width:471px;
    }
}
@media only screen and (max-height:480px){
    .swiper-slide1 {
        width:471px;
    }
}
.swiper-slide1 img{
    width:100%;
    border-radius: 4px;
}
.swiper-slide1 .title{
    position:absolute;
    /*transform:rotate(90deg);*/
    transform-origin:left bottom;
    left:43%;
    bottom:18px;
    font-size:17px;
    color: #ffffff;
}
.swiper-button-next, .swiper-button-prev{
    width:86px;
    height:112px;
    background-size:86px 112px;
    margin-top:-56px;
    outline:none;}
.swiper-button-next{
    background-image:url(img/cursor-next.png);}
.swiper-button-prev{
    background-image:url(img/cursor-prev.png);}
.swiper-pagination-bullet{
    background:none;
    opacity:1;
    margin:0 6px !important;
    width:9px;
    height:9px;
    position:relative;
    outline:none;
    vertical-align:middle;}
.swiper-pagination-bullet span{
    width:3px;
    height:3px;
    background:#CCC;
    display:block;
    border-radius:50%;
    margin-top:3px;
    margin-left:3px;
}
.swiper-pagination-bullet i{
    background:#ccc;
    height:1px;
    width:20px;
    position:absolute;
    top:4px;
    transform-origin:left;
    z-index:3;
    transition-timing-function:linear;
}
.swiper-pagination-bullet-active span,.swiper-pagination-bullet:hover span{
    width:9px;
    height:9px;
    margin-top:0;
    margin-left:0;
    background:#000;
    position:relative;
    z-index:1;
}
.swiper-pagination-bullet-active span{
    background: #FF4512;
    z-index: 5;
}
.swiper-pagination-bullet-active i{
    animation:middle 6s;
}
.swiper-pagination-bullet:first-child.swiper-pagination-bullet-active i{
    animation:first 6s;
}
.swiper-pagination-bullet:last-child.swiper-pagination-bullet-active i{
    animation:last 6s;
}
@keyframes first{
    0% {transform:scaleX(0.5);left:0px;}/*091*/
    100% {transform:scaleX(1);left:2px;} /*0915*/
}
@keyframes last{
    0% {transform:scaleX(0.7);left:-10px;}/*1090*/
    20% {transform:scaleX(0.3);left:2px;} /*090*/
    100% {transform:scaleX(0.3);left:0px;} /*090*/
}
@keyframes middle{
    0% {transform:scaleX(0.7);left:-10px;}/*1091*/
    20% {transform:scaleX(0.45);left:2px;}/*092*/
    100% {transform:scaleX(1);left:2px;} /*0913*/
}
.swiper-slide1 {
    transform: scale(0.8);
}
.swiper-slide-active,.swiper-slide-duplicate-active{
    transform: scale(1);
}
.hero-swiper{
    min-height: 900px;
}

@media screen and (max-width: 850px) {
    .hero-swiper{
        min-height: 535px;
    }
}
#siteHeaderSearch .search-input {
    padding-left: 30px;
}
input[type='checkbox'] {
    position: unset;
}
.bar {
    position: absolute;
    top: 40%;
    left: 48%;
    width: 100px;
    height: 48px;
    background: url('/image/technology/camtele/1591083579(1).jpg') no-repeat;
    /*background-size: cover;*/
    background-position: center center;
    display: inline-block;
    transition: 1.3s all cubic-bezier(1, 1, 1, 1);
    border: 2px solid #ef5621;
    box-sizing: border-box;
}
.section_heading--top-d-m img{
    opacity: 0.3;
}

.bar.active {
    top: 14%;
    left: 11%;
    width: 80%;
    height: 60%;
    margin-top: 0;
    opacity: 1;
}
.fl-768{
    background-image: url('/image/technology/camtele/lucency.jpg');
    padding-bottom: 58%;
}
.resizeImg_before{
    max-width: none;
    width: 869px;
    height: 579px;
}
.resizeImg_after{
    max-width: none;
    width: 869px;
    height: 579px;
    opacity: 0.47;
}
.content-feat{
    display: none;
}
.drone-height{
    min-height: 370px;
}
.dis-none-12{
    display: none;
}
@media screen and (max-width:768px){
    .align-center{
        margin-top: 1.5%;
    }
    .dis-none-11{
        visibility: hidden;
    }
    .dis-none-12{
        display: inline;
    }
    .drone-height{
        min-height: 210px;
    }
    .md\:mt-\[140px\] {
        margin-top: 10%;
        margin-bottom: 10%;
    }
    .bt-140{
        margin-top: 5%;
    }
    .text-\[36px\] {
        font-size: 19px;
        margin: 15px 0 12px 0;
    }
    .content-feat{
        display: block;
    }
    #content{
        display: none;
    }
    .fl-768{
        background-image: url('/image/technology/camtele/fl-768.jpg');
        background-size: contain;
        padding-bottom: 58%;
    }
    .fl-this-768{
        display: none;
    }

}

  
  .scroll-toggle:hover{
      cursor: pointer;
      color: #919699;
  }
.news-button {
    background: #fff;
    color: #333;
    font-weight: 700;
    border: 1px solid #fff;
    margin-left: -4px;
}
.take-with-you{
    line-height: 28px;
    margin-top: 1%;
    font-size: 17px;
}
@media (max-width: 768px) {
    .container {
        width: inherit;
    }
    .icon-item {
        width: 33%;
    }
    .take-with-you{
        line-height: 22px;
        margin-top: 1%;
        font-size: 13px;
    }
    .hero_inline_one-pro .hero_title-easy{
        margin-bottom: 20.8vw;
    }
    .hero_title-easy span {
        font-size: 14px!important;
        line-height: 25px;
    }
}
@media screen and (min-width: 769px) {
    .icon-item {
        width: 32%;
    }
}
@media screen and (min-width: 769px) {
    .icon-item:nth-child(4) {
        margin-top: 48px;
    }
}
@media screen and (max-width: 986px) {
    .hero-swiper {
        min-height: 720px;
    }
}
@media screen and (max-width: 768px) {
    .hero-swiper {
        min-height: 540px;
    }
}
