@font-face {
    font-weight: 300;
    font-family: 'pre';
    src: url('../fonts/Pretendard-Light.woff2');
}
@font-face {
    font-weight: 400;
    font-family: 'pre';
    src: url('../fonts/Pretendard-Regular.woff2');
}
@font-face {
    font-weight: 500;
    font-family: 'pre';
    src: url('../fonts/Pretendard-Medium.woff2');
}
@font-face {
    font-weight: 600;
    font-family: 'pre';
    src: url('../fonts/Pretendard-SemiBold.woff2');
}
@font-face {
    font-weight: 700;
    font-family: 'pre';
    src: url('../fonts/Pretendard-Bold.woff2');
}


a{text-decoration: none;color: #000;}
*{box-sizing: border-box;margin: 0;padding: 0;font-family: 'pre'}
ul,ol,li{margin: 0;padding: 0;}
li{list-style: none;}
button{background-color: transparent;border: 0;display: flex;color: #000;font-family: 'pre'}
body{overflow-x: hidden;}
input,textarea,select{font-family: 'pre'}
input:focus,
select:focus,
textarea:focus{outline: none;}
.breadcrumb{font-family: 'pre' !important;display: flex;align-items: center;padding-top: 150px;margin: 0 auto 60px auto;max-width: 1200px;width: 100%;;color: #666;;}
.breadcrumb>svg{width: 14px;height: 14px;margin: 0 5px;}
.breadcrumb>span{font-weight: 500;font-family: 'pre';}
.breadcrumb>p{font-family: 'pre';}

nav{height: 100px;border-bottom: 1px solid #e6e6e6;position: fixed;top: 0;left: 0;width: 100%;background-color: #fff;transition: 0.3s;backdrop-filter: blur(0px);z-index: 1;;}
.header-inner{height: 100%;max-width: 1200px;width: 100%;margin: 0 auto;position: relative;display: flex;align-items: center;}
.logo{cursor: pointer;}
.logo>img{display: block;height: 50px;transition: 0.3s;}
.logo>span{font-weight: 500;color: #04C5BC;font-size: 12px;transition: 0.3s;}
nav.on{height: 60px;background-color: rgba(255, 255, 255, 0.5);backdrop-filter: blur(5px);border-bottom: 1px solid transparent;}
nav.on .logo>img{height: 40px;}
nav.on .logo>span{display: none;}

.nav-menu{display: flex;position: absolute;height: 100%;align-items: center;justify-content: center;left: 50%;top: 50%;transform: translate(-50%, -50%);}
.nav-menu>a{display: flex;align-items: center;justify-content: center;padding: 0 20px;font-size: 16px;font-weight: 500;height: 100%;transition: 0.3s;position: relative;}
.nav-menu>a::after{display: block;content: '';position: absolute;bottom: 0;left: 0;background-color: #04C5BC;;height: 0%;width: 100%;z-index: 0;transition: 0.3s;}
.nav-menu>a>span{position: relative;z-index: 1;}
.nav-menu>a:hover{color: #fff;}
.nav-menu>a:hover::after{height: 100%;}
.sub-menu{position: absolute;top: calc(100% - 1px);height: 0;left: 50%;transform: translateX(-50%);width: 100vw;display: flex;align-items: center;justify-content: center;background-color: #04C5BC;overflow: hidden;pointer-events: none;opacity: 1;transition: 0.3s;}
.sub-menu>a{font-size: 16px;height: 100%;display: flex;align-items: center;justify-content: center;padding: 0 20px;font-weight: 500;color: #fff;transition: 0.3s;opacity: 0;}
.sub-menu>a:hover{background-color: rgba(255, 255, 255, 0.2);}

.sub-menu.on{height: 100%;pointer-events: inherit;}
.sub-menu.on>a{opacity: 1;}

.main-banner{width: 100%;aspect-ratio: 19/5;margin-top: 100px;transition: 0.5s 0.2s;transform: translateY(-30px);opacity: 0;filter: blur(2.5px);}
.main-banner.on{filter: blur(0);opacity: 1;transform: translateY(0);}
.main-banner>img{display: block;width: 100%;height: 100%;object-fit: cover;;}
section{padding: 50px 0;}
.section-inner{max-width: 1200px;margin: 0 auto;width: 100%;padding: 0 0px;}


.title-img{width: 500px;height: 500px;border-radius: 20px;overflow: hidden;transition: 0.5s 0.6s;}
.title-img>img{display: block;width: 100%;height: 100%;object-fit: cover;}
.title-img-scan-map{width:350px;height:576px;border-radius: 20px;overflow: hidden;transition: 0.5s 0.6s;margin: 0 auto !important;margin-bottom: 15px !important;}
.title-img-scan-map>img{display: block;width: 100%;height: 100%;object-fit: cover;}
.title-wrap{width: 100%;display: flex;align-items: center;justify-content: space-between;}

.title-wrap-2{align-items: flex-start;justify-content: left;}
.title-wrap-2 .title-img{background-color: rgba(27, 141, 186, 0.1);padding: 40px;margin-right: 40px;}

.section-2-1{margin-top: -250px;background-color: #e7f3f8}
.title-wrap-3{align-items: flex-end;justify-content: right;text-align: right;}
.title-wrap-3 .title-img{background-color: rgba(27, 141, 186, 0.1);padding: 40px;margin-left: 40px;}

.title-wrap-3{}
.title-1{margin-bottom: 60px;}
.title-2{margin-bottom: 40px;transition: 0.5s 0.4s;}
.title-1>span{font-size: 22px;font-weight: 500;color: #04C5BC;margin-bottom: 5px;display: block;transition: 0.5s 0.2s;}
.title-1>p{font-size: 42px;font-weight: 500;transition: 0.5s 0.4s;}
.title-1>p>span{color: #04C5BC;}
.title-2>p{font-size: 32px;font-weight: 500;}
.title-2>p>span{color: #04C5BC;}
.txt{font-size: 22px;line-height: 36px;font-weight: 500;transition: 0.5s 0.6s;}
.txt>span{color: #04C5BC;font-weight: 600;}

.cctv{max-width: 980px;margin: 0 auto;margin-bottom: 60px;transition: 0.5s 0.2s;}
.cctv>img{display: block;width: 100%;height: 100%;object-fit: cover;}
.cctv-txt{font-size: 22px;font-weight: 500;line-height: 36px;text-align: center;transition: 0.5s 0.4s;}
.section-4 .title-2{transition: 0.5s 0.2s;}


.balloon-wrap{width: 500px;height: 500px;position: relative;margin: 0 auto;margin-top: 60px;transition: 0.8s 0.4s;opacity: 0;transform: scale(0.8);}
.ball-small{position: absolute;width: 150px;height: 150px;border-radius: 100%;display: flex;align-items: center;justify-content: center;text-align: center;font-size: 26px;font-weight: 500;color: #fff;line-height: 36px;transform: translate(0, 0);transition: 0.8s 2s;}
.ball-small>p{transition: 0.8s 2s;}
.ball-small:nth-of-type(1){background-color: #6CB644;left: 0;top: 0;}
.ball-small:nth-of-type(2){background-color: #00AC60;right: 0;top: 0;}
.ball-small:nth-of-type(3){background-color: #009F7C;left: 50%;transform: translate(-50%, 0%);bottom: 0;}
section.on .ball-small:nth-of-type(1){left: 50%;top: 50%;transform: translate(-50%, -50%) scale(0.5);background-color: #009094;}
section.on .ball-small:nth-of-type(2){right: 50%;top: 50%;transform: translate(50%, -50%) scale(0.5);background-color: #009094;}
section.on .ball-small:nth-of-type(3){left: 50%;bottom: 50%;transform: translate(-50%, 50%) scale(0.5);background-color: #009094;}
section.on .ball-small>p{opacity: 0;transform: scale(0.5);}
.balloon{width: 0px;height: 0px;position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);background-color: #009094;border-radius: 100%;display: flex;align-items: center;justify-content: center;overflow: hidden;transition: 0.8s 2.7s;;}

.balloon>span{font-size: 26px;font-weight: 500;color: rgba(255, 255, 255, 0.7);position: absolute;text-align: center;line-height: 36px;opacity: 0;transition: 1s 3.1s;}
.balloon>span:nth-of-type(1){left: 25%;top: 25%;}/*20%*/
.balloon>span:nth-of-type(2){right: 25%;top: 25%;}/*20%*/
.balloon>span:nth-of-type(3){left: 50%;transform: translate(-50%, 0%);bottom: 25%;}/*20%*/
.balloon>p{font-size: 46px;font-weight: 500;color: #fff;opacity: 0;transition: 0.5s 3.1s;}

section.on .balloon{width: 100%;height: 100%;}
section.on .balloon>span:nth-of-type(1){left: 20%;top: 20%;opacity: 1;}/*20%*/
section.on .balloon>span:nth-of-type(2){right: 20%;top: 20%;opacity: 1;}/*20%*/
section.on .balloon>span:nth-of-type(3){left: 50%;transform: translate(-50%, 0%);bottom: 15%;opacity: 1;}/*20%*/
section.on .balloon>p{opacity: 1;}
section.on .balloon-wrap{opacity: 1;transform: scale(1);}

.banner-swiper{aspect-ratio: 16/5;overflow: hidden;transition: 0.5s 0.6s;position: relative;}
.swiper-wrapper{width: 100%;height: 100%;;}
.swiper-slide{height: 100%;display: flex;align-items: flex-end;}
.banner-img{height: 100%;width: auto;;}
.banner-img>img{display: block;height: 100%;width: auto;}
.banner-txt{padding-bottom: 20px;}
.banner-txt>span{font-size: 16px;color: #04C5BC;font-weight: 500;margin-bottom: 5px;display: block;}
.banner-txt>p{font-size: 24px;font-weight: 500;margin-bottom: 5px;}
.banner-txt>strong{font-family: 'pre';font-weight: 400;color: #999;font-size: 16px;}
.banner-swiper .swiper-pagination{display: flex;align-items: center;justify-content: center;}
.banner-swiper .swiper-pagination .swiper-pagination-bullet{margin: 0 7.5px;width: 10px;height: 10px;transition: 0.3s;}
.banner-swiper .swiper-pagination .swiper-pagination-bullet-active{width: 12px;height: 12px;background-color: #04C5BC;}

footer{background-color: #04C5BC;padding: 50px 0;}
.footer-inner{max-width: 1200px;width: 100%;margin: 0 auto;}

.section-2{background-color: #e7f3f8;}
.section-5{background-color: #e7f3f8;padding-bottom: 20px;}
.footer-btn{margin-bottom: 40px;font-size: 16px;font-weight: 500;}
.footer-btn>a{color: #fff;margin-right: 40px;}
.footer-info{display: flex;margin-bottom: 20px;color: #fff;}
.footer-info:last-of-type{margin-bottom: 0;}

.flow-wrap-1{display: flex;align-items: flex-start;justify-content: space-around;margin: 0 auto 60px auto;max-width: 768px;width: 100%;position: relative;transition: 0.5s;}
.flow-wrap-2{display: flex;align-items: flex-start;justify-content: center;margin: 0 auto 60px auto;width: 100%;position: relative;transition: 0.5s;}
.flow-arrow{position: absolute;left: 195px;top: 100px;width: calc(100% - 500px);height: auto;}
.flow-arrow>img{display: block;width: 100%;height: auto;position: absolute;top: 50%;transform: translateY(-50%);left: 0;}

.flow-img{width: 200px;height: 200px;overflow: hidden;margin-bottom: 40px;}
.flow-img>img{display: block;width: 100%;height: 100%;object-fit: cover;}
.flow-txt{font-size: 32px;font-weight: 500;color: #000;text-align: center;}
.flow-wrap-2 .flow-txt{font-size: 24px;}
.flow-wrap-2 .flow{margin-right: 40px;}
.flow-wrap-2 .flow:last-of-type{margin-right: 0;}
.sub-flow-wrap{max-width: 640px;width: 100%;margin: 0 auto;;}
.sub-title{margin-bottom: 40px;}
.sub-title>p{margin-bottom: 20px;font-size: 22px;text-align: center;transition: 0.5s 0.2s;line-height: 36px;}
.sub-title-btn{display: flex;align-items: center;justify-content: center;transition: 0.5s 0.4s;}
.sub-title-btn>button{display: flex;align-items: center;justify-content: center;width: 50px;height: 50px;border-radius: 100%;cursor: pointer;}
.sub-title-btn>button>svg{width: 24px;height: 24px;color: #fff;}
.sub-title-btn>button:first-of-type{background-color: #4285F4;margin-right: 40px;}
.sub-title-btn>button:last-of-type{background-color: #000;}
.sub-title>a{display: flex;align-items: center;justify-content: center;border-radius: 100px;padding: 0 10px;font-size: 22px;color: #fff;height: 50px;background-color: #00AC60;max-width: 340px;margin: 0 auto;transition: 0.5s 0.4s;}
.sub-title>a>svg{width: 18px;height: 18px;color: #fff;margin-left: 5px;}
.sub-flow{display: flex;justify-content: center;margin-bottom: 10px;}
.sp{display: flex;align-items: center;justify-content: center;flex-direction: column;height: 60px;width: 100%;border-radius: 100px;font-size: 20px;margin-right: 20px;background-color: #e6e6e6;color: #000;}
.sp:last-of-type{margin-right: 0;}
.sp>span{font-size: 16px;color: #999;}
.sub-flow:first-of-type .sp{background-color: #04C5BC;color: #fff;font-weight: 500;}
.sub-flow:last-of-type .sp{background-color: #04C5BC;color: #fff;font-weight: 500;}
.chevron{margin-bottom: 10px;width: 100%;display: flex;align-items: center;justify-content: center;}
.chevron>svg{height: 24px;width: 24px;color: #999;}

.section-7 .title-1>p{transition: 0.5s;}



.sub-flow-wrap .sub-flow:nth-of-type(1){transition: 0.5s 0.6s;}
.sub-flow-wrap .chevron:nth-of-type(1){transition: 0.5s 0.7s;}
.sub-flow-wrap .sub-flow:nth-of-type(2){transition: 0.5s 0.8s;}
.sub-flow-wrap .chevron:nth-of-type(2){transition: 0.5s 0.9s;}
.sub-flow-wrap .sub-flow:nth-of-type(3){transition: 0.5s 1s;}
.sub-flow-wrap .chevron:nth-of-type(3){transition: 0.5s 1.1s;}
.sub-flow-wrap .sub-flow:nth-of-type(4){transition: 0.5s 1.2s;}
.sub-flow-wrap .chevron:nth-of-type(4){transition: 0.5s 1.3s;}
.sub-flow-wrap .sub-flow:nth-of-type(5){transition: 0.5s 1.4s;}
.sub-flow-wrap .chevron:nth-of-type(5){transition: 0.5s 1.5s;}
.sub-flow-wrap .sub-flow:nth-of-type(6){transition: 0.5s 1.6s;}
.sub-flow-wrap .chevron:nth-of-type(6){transition: 0.5s 1.7s;}
.sub-flow-wrap .sub-flow:nth-of-type(7){transition: 0.5s 1.8s;}
.sub-flow-wrap .chevron:nth-of-type(7){transition: 0.5s 1.9s;}
.sub-flow-wrap .sub-flow:nth-of-type(8){transition: 0.5s 2s;}
.sub-flow-wrap .chevron:nth-of-type(8){transition: 0.5s 2.1s;}
.sub-flow-wrap .sub-flow:nth-of-type(9){transition: 0.5s 2.2s;}
.sub-flow-wrap .chevron:nth-of-type(9){transition: 0.5s 2.3s;}
.sub-flow-wrap .sub-flow:nth-of-type(10){transition: 0.5s 2.4s;}
.sub-flow-wrap .chevron:nth-of-type(10){transition: 0.5s 2.5s;}
.sub-flow-wrap .sub-flow:nth-of-type(11){transition: 0.5s 2.6s;}
.sub-flow-wrap .chevron:nth-of-type(11){transition: 0.5s 2.7s;}
.sub-flow-wrap .sub-flow:nth-of-type(12){transition: 0.5s 2.8s;}
.sub-flow-wrap .chevron:nth-of-type(12){transition: 0.5s 2.9s;}
.sub-flow-wrap .sub-flow:nth-of-type(13){transition: 0.5s 3s;}
.sub-flow-wrap .chevron:nth-of-type(13){transition: 0.5s 3.1s;}
.sub-flow-wrap .sub-flow:nth-of-type(14){transition: 0.5s 3.2s;}
.sub-flow-wrap .chevron:nth-of-type(14){transition: 0.5s 3.3s;}
.sub-flow-wrap .sub-flow:nth-of-type(15){transition: 0.5s 3.4s;}
.sub-flow-wrap .chevron:nth-of-type(15){transition: 0.5s 3.5s;}
.sub-flow-wrap .sub-flow:nth-of-type(16){transition: 0.5s 3.6s;}
.sub-flow-wrap .chevron:nth-of-type(16){transition: 0.5s 3.7s;}
.sub-flow-wrap .sub-flow:nth-of-type(17){transition: 0.5s 3.8s;}

.scroll-y{opacity: 0;transform: translateY(30px);filter: blur(2.5px);}
section.on .scroll-y{opacity: 1;filter: blur(0);transform: translateY(0);}

.scroll-x-left{transform: translateX(30px);filter: blur(2.5px);opacity: 0;}
section.on .scroll-x-left{transform: translateX(0px);filter: blur(0px);opacity: 1;}
.scroll-x-right{transform: translateX(-30px);filter: blur(2.5px);opacity: 0;}
section.on .scroll-x-right{transform: translateX(0px);filter: blur(0px);opacity: 1;}

.side-nav{position: fixed;right: -320px;max-width: 320px;width: 100%;border-left: 1px solid #e6e6e6;height: 100vh;background-color: #fff;top: 0;transition: 0.5s;display: none;}
.side-nav.on{right: 0;}
.nav-btn{width: 32px;height: 26px;top: 50%;transform: translateY(-50%);position: absolute;right: 20px;display: none;}
.line{position: absolute;width: 100%;height: 2px;background-color: #666;border-radius: 100px;transition: 0.5s;}
.line-1{top: 0;right: 0;transform-origin: top right;}
.line-2{top: 50%;transform: translateY(-50%);left: 0;}
.line-3{bottom: 0;right: 0;transform-origin: bottom right;}

.nav-btn.on .line{background-color: #fff;}
.nav-btn.on .line-1{transform: rotate(-45deg);width: 34.5px;;}
.nav-btn.on .line-2{opacity: 0;}
.nav-btn.on .line-3{transform: rotate(45deg);width: 34.5px;;}

.side-nav-title{height: 60px;width: 100%;padding: 0 15px;background-color: #04C5BC;color: #fff;font-size: 18px;font-weight: 500;display: flex;align-items: center;}
.side-btn{display: flex;align-items: center;justify-content: space-between;height: 50px;border-bottom: 1px solid #e6e6e6;width: 100%;padding: 0 15px;font-size: 16px;font-weight: 500;transition: 0.5s;}
.side-btn:hover{background-color: #f7f7f7;padding-left: 20px;}
.side-btn.on{background-color: #f7f7f7;}
.side-btn>svg{width: 18px;height: 18px;transition: 0.5s;}
.side-btn.on>svg{transform: rotate(180deg);}
.side-sub-wrap{background-color: #f7f7f7;overflow: hidden;height: 0;transition: 0.5s;}
.side-sub-wrap>a{display: block;height: 50px;padding: 0 15px;display: flex;align-items: center;font-size: 14px;transition: 0.3s;}
.side-sub-wrap>a:hover{background-color: rgba(255, 255, 255, 0.5);padding-left: 20px;}
.side-sub-wrap-1.on{height: 200px;}
.side-sub-wrap-3.on{height: 100px;}

.title-wrap-left{justify-content: left;align-items: flex-start;}

.title-wrap-left .title{padding-left: 60px;}

.title-w80 {width: 80%;}

.btn-secondary {
    box-shadow: 0px 0px 5px #888
}

.flow-arrow img { z-index: -1; }

/*@media (max-width: 1400px) {
    .section-5{padding-bottom: 160px;}
}*/
@media (max-width: 1200px) {
    .section-2-1{margin-top: -230px;}
    section{padding: 40px 0;}
    /*.section-5{padding-bottom: 150px;}*/
    .balloon-wrap{margin-top: 40px;}
    .section-inner{padding: 0 20px;}
    .header-inner{padding: 0 20px;}
    .nav-menu>a{padding: 0 20px;}
    .nav-menu{width: 100%;}
    .logo>img{height: 40px;}
    .logo>span{font-size: 10px;}
    .breadcrumb{padding: 0 20px;padding-top: 150px;font-size: 14px;margin-bottom: 40px;}
    .title-1>span{font-size: 18px;}
    .title-1>p{font-size: 36px;}
    .txt{font-size: 18px;}
    .title-img{width: 400px;height: 400px;}
    .title-1{margin-bottom: 40px;}
    .title-2>p{font-size: 26px;}
    .title-2{margin-bottom: 20px;}
    .flow-img{width: 150px;height: 150px;}
    .flow-txt{font-size: 18px !important;}
    .cctv-txt{font-size: 18px;}
    .sub-title>p{font-size: 18px;}
    .sub-flow{margin-bottom: 5px;}
    .sp{height: 50px;font-size: 16px;}
    .sp>span{font-size: 14px;}
    .chevron{margin-bottom: 5px;}
    .footer-inner{padding: 0 20px;}
    .footer-btn{font-size: 14px;margin-right: 20px;}
    .footer-btn>a{margin-right: 20px;}
    .footer-info{font-size: 14px;}
    .title-wrap-left .title{padding-left: 40px;}
    .sub-title-btn>button:first-of-type{margin-right: 20px;}
    .sub-title-btn>button{width: 40px;height: 40px;}
    .sub-title-btn>button>svg{width: 18px;height: 18px;}
    .banner-txt>p{font-size: 18px;}
    .banner-txt>span{font-size: 14px;}
    .banner-txt>strong{font-size: 14px;}
    .ball-small{width: 120px;height: 120px;font-size: 22px;line-height: 36px;}
    .balloon>span{font-size: 22px;}
    .balloon>p{font-size: 42px;}
    .balloon-wrap{width: 450px;height: 450px;}
}
@media (max-width: 980px) {
    /*.section-5{padding-bottom: 120px;}*/
    nav{height: 60px;background-color: #fff;}
    .logo>span{display: none;}
    .nav-menu{display: none;}
    .breadcrumb{padding-top: 90px;margin-bottom: 30px;}
    .side-nav{display: block;}
    .nav-btn{display: block;}
    .cctv-txt{font-size: 16px;}
    .title-1>span{font-size: 16px;}
    .title-1>p{font-size: 32px;}
    .txt{font-size: 16px;line-height: 32px;}
    .title-img{width: 400px;height: 400px;}
    .title-1{margin-bottom: 30px;}
    .title-2>p{font-size: 24px;}
    .title-2{margin-bottom: 15px;}
    .title-wrap-left .title{padding-left: 30px;}
    .title-wrap-2 .title-img{margin-right: 30px;}
    .title-wrap-3 .title-img{margin-left: 30px;}
    .flow-img{width: 120px;height: 120px;}
    .title-img{width: 350px;height: 350px;}
    .flow-wrap-2{margin-bottom: 40px;}
    .sub-title>p{font-size: 16px;}
    .sub-title{margin-bottom: 20px;}
    .main-banner{margin-top: 60px;aspect-ratio: 16/8;}

    .ball-small{width: 100px;height: 100px;font-size: 18px;line-height: 26px;}
    .balloon>span{font-size: 18px;}
    .balloon>p{font-size: 36px;}
    .balloon-wrap{width: 350px;height: 350px;}
}
@media (max-width: 890px) {
    .txt{font-size: 14px;}
    .section-2-1{margin-top: 0px;}
}
@media (max-width: 768px) {
    .banner-swiper{aspect-ratio: 16/8;}
    .banner-txt>p{font-size: 16px;}
    .banner-txt>span{font-size: 12px;}
    .banner-txt>strong{font-size: 12px;}
    .swiper-slide{justify-content: center;}
    .sub-title{margin-bottom: 15px;}
    .sp{height: 40px;font-size: 14px;margin-right: 15px;}
    .sp>span{font-size: 12px;}
    .sub-title>p{margin-bottom: 15px;}
    .flow-wrap-2{margin-bottom: 0px;}
    .sub-title-btn>button:first-of-type{margin-right: 15px;}
    section{padding: 30px 0;}
    footer{padding: 30px 0;}
    /*.section-5{padding-bottom: 90px;}*/
    .section-inner{padding: 0 15px;}
    .footer-inner{padding: 0 15px;}
    .footer-info{margin-bottom: 15px;}
    .title-wrap{flex-wrap: wrap;}
    .title-img{margin: 0 auto !important;margin-bottom: 30px;margin-bottom: 15px !important;}
    .title{width: 100%;padding: 0 !important;text-align: center;}
    .txt{font-size: 16px;margin-bottom: 15px;}
    .title-1>p{text-align: center;font-size: 26px;}
    .title-1>span{font-size: 14px;}
    .flow-wrap-2{flex-wrap: wrap;}
    .flow-wrap-2 .flow{width: 50%;margin-right: 0;margin-bottom: 30px;}
    .flow-wrap-2 .flow-img{margin: 0 auto;margin-bottom: 15px;}
    .sub-title>p{font-size: 14px;line-height: 24px;}
    .chevron>svg{width: 18px;height: 18px;}
    .title-1>span{text-align: center;}
    .title-w80 {width: 100%;}
    .section-2{overflow: hidden;}
}
@media (max-width: 640px) {
    .banner-swiper{aspect-ratio: inherit;height: auto;}
    .swiper-slide{flex-wrap: wrap;}
    .footer-info{flex-wrap: wrap;font-size: 14px !important;}
    .banner-txt>p{font-size: 18px;}
    .banner-txt>span{font-size: 14px;}
    .banner-swiper .swiper-pagination .swiper-pagination-bullet-active{width: 10px;height: 10px;}
    .banner-swiper .swiper-pagination .swiper-pagination-bullet{width: 8px;height: 8px;}
    .banner-txt>strong{font-size: 14px;}
    .banner-txt{text-align: center;margin-top: 15px;}
    .banner-img{width: calc(100% - 60px);height: auto;}
    .banner-img>img{width: 100%;height: auto;}
    .footer-info>p{width: 100%;}
    .footer-btn{display: flex;flex-wrap: wrap;margin-bottom: 15px;;}
    .footer-btn>a{margin-right: 0;width: 33.3333%;margin-bottom: 15px;;}

    .flow-arrow { position: static; }
    .flow-arrow img { width: 30%; top: 35%; left: 25%; }
}
@media (max-width: 480px) {
    .sp{height: 40px;font-size: 14px;margin-right: 10px;}
    .sp>span{font-size: 12px;}
    .balloon-wrap{margin-top: 30px;}
    .footer-btn>a{width: 50%;}
    section{padding: 30px 0;}
    .section-inner{padding: 0 15px;}
    /*.section-5{padding-bottom: 60px;}*/
    .txt{font-size: 14px;line-height: 24px;margin-bottom: 15px;}
    .cctv-txt{font-size: 14px;line-height: 24px;}
    .flow-txt{font-size: 16px !important;}
    .title-1>p{font-size: 24px;}
    .title-1>span{font-size: 12px;}
    .breadcrumb{margin-bottom: 0px;font-size: 12px;text-align: center;justify-content: center;}
    .breadcrumb>svg{width: 12px;height: 12px;}
    .title-1{margin-bottom: 15px;}
    .side-btn{font-size: 14px;}
    .ball-small{width: 80px;height: 80px;font-size: 16px;line-height: 24px;}
    .balloon>span{font-size: 16px;}
    .balloon>p{font-size: 26px;}
    .balloon-wrap{width: 320px;height: 320px;}

    .balloon>span:nth-of-type(1){left: 20%;top: 20%;}/*20%*/
    .balloon>span:nth-of-type(2){right: 20%;top: 20%;}/*20%*/
    .balloon>span:nth-of-type(3){left: 50%;transform: translate(-50%, 0%);bottom: 20%;}/*20%*/

    section.on .balloon>span:nth-of-type(1){left: 15%;top: 15%;opacity: 1;}/*20%*/
    section.on .balloon>span:nth-of-type(2){right: 15%;top: 15%;opacity: 1;}/*20%*/
    section.on .balloon>span:nth-of-type(3){left: 50%;transform: translate(-50%, 0%);bottom: 10%;opacity: 1;}/*20%*/
    
    .flow-arrow { position: static; }
    .flow-arrow img { width: 30%; top: 35%; left: 25%; }
}
@media (max-width: 380px) {
    .title-img{width: 100%;aspect-ratio: 4/4;height: auto;}
    .balloon-wrap{width: 320px;height: 320px;}
    .flow-arrow { position: static; }
    .flow-arrow img { width: 30%; top: 35%; left: 25%; z-index: -1; }
}
@media (max-width: 350px) {
    .side-nav{max-width: 100%;width: 100%;right: -100%;}
    .flow-img{width: 100px;height: 100px;}
    .flow-txt{font-size: 14px !important;}
    .txt{font-size: 12px;}
    .title-1>p{font-size: 18px;}
    .cctv-txt{font-size: 12px;}
    .sub-title>p{font-size: 12px;}
    .sub-title-btn>button{width: 32px;height: 32px;}
    .sub-title-btn>button>svg{width: 16px;height: 16px;}
    .sp{height: 32px;font-size: 12px;margin-right: 10px;}
    .sp>span{font-size: 10px;}
    .footer-info{font-size: 12px;}
    .flow-arrow { position: static; }
    .flow-arrow img { width: 30%; top: 35%; left: 25%; }
}