
/* main common */


        .main_visual { height: 100vh; width: 100%; overflow-x: hidden; position: relative; }
        .main_visual .swiper { width: 100%; height: 100%; }
        .main_visual .swiper-slide { background-position: center; background-size: cover; display: flex; align-items: center; justify-content: center; }
        .main_visual .swiper-slide:nth-child(1n) { background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../img/main_banner_img01.jpg); }
        .main_visual .swiper-slide:nth-child(2n) { background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../img/main_banner_img02.jpg); }
        .main_visual .swiper-slide.video-slide, .main_visual .swiper-slide.youtube-slide { background-image: none; }
        .main_visual .swiper-slide .visual-tit { color: #fff; text-align: center; position: relative; z-index: 2; padding: 0 20px; }
        .main_visual .swiper-slide .title { font-weight: 500; line-height: 1.2; font-size: 3vw; margin-bottom: 20px; }
        .main_visual .swiper-slide .description { font-size: 0.9vw; color: #fff; opacity: 0.8 }
        .video-background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
        .video-slide::before, .youtube-slide::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 1; }
        .main_visual .nav-and-scroll { position: absolute; bottom: 50px; right: 150px; display: flex; align-items: center; z-index: 100; }
        .main_visual .nav-buttons { display: flex; margin-right: 10px; }
        .main_visual .swiper-button-next, .main_visual .swiper-button-prev { position: relative; width: 80px; height: 80px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.2); background-color: transparent; transition: all ease 0.3s; margin: 0 5px; }
        .main_visual .swiper-button-prev { background: url('../img/main_arrow01.png') no-repeat center; }
        .main_visual .swiper-button-next { background: url('../img/main_arrow02.png') no-repeat center; }
        .main_visual .swiper-button-prev::after, .main_visual .swiper-button-next::after { content: ''; }
        .main_visual .swiper-button-prev:hover, .main_visual .swiper-button-next:hover { border-color: #fff; }
        .main_visual .scroll_move { width: 80px; height: 80px; display: flex; justify-content: center; align-items: center; border-radius: 50%; background-color: rgba(255, 255, 255, 0.2); animation: moveUpDown 2s infinite; }
        .main_visual .scroll_move .scroll_icon { font-size: 30px; color: #fff; line-height: 1; animation: bounce_frames 0.5s alternate infinite cubic-bezier(0.5, 0.05, 1, 0.5); }
        @keyframes moveUpDown { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
        @keyframes bounce_frames { from { transform: translateY(0); } to { transform: translateY(5px); } }

        /* 애니메이션 스타일 */
        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translate3d(0, 40px, 0);
            }
            to {
                opacity: 1;
                transform: translate3d(0, 0, 0);
            }
        }

        .main_visual .swiper-slide .title,
        .main_visual .swiper-slide .description {
            opacity: 0;
            animation-duration: 1s;
            animation-fill-mode: both;
        }

        .main_visual .swiper-slide-active .title {
            animation-name: fadeInUp;
            animation-delay: 0.5s;
        }

        .main_visual .swiper-slide-active .description {
            animation-name: fadeInUp;
            animation-delay: 1s;
        }

        @media screen and (max-width: 768px) {
            .main_visual .swiper-slide .title { font-size: 8vw; }
            .main_visual .swiper-slide .description { font-size: 3.5vw; word-break: keep-all; line-height: 1.65 }
            .main_visual .nav-and-scroll { bottom: 10px; right: 10px; }
            .main_visual .swiper-button-next, .main_visual .swiper-button-prev, .main_visual .scroll_move { width: 50px; height: 50px; }
            .main_visual .scroll_move .scroll_icon { font-size: 16px; }
        }

        @media screen and (max-width: 480px) {
            .main_visual .nav-buttons { display: none}
        }

    
    .section01 { padding: 150px 0; padding-bottom: 50px}
    .section01 .inner { width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; }
    .section01 .left { width: 59%; }
    .section01 .main-right { width: 100%; }
    .section01 .right-box {width: 59%; }

    /* 테스크탑 (가로 해상도가 1200px 보다 작은 화면에 적용) */
    @media (max-width: 1500px) {
        .section01 .right-box {
            width: 100%;
        }
      }

    

    .section01 .left .photo img { width: 100%; border-radius: 1.2em }
    .section01 .owl-dots{position:absolute;width:100%;text-align:center;margin:0 auto;bottom:50px}
    .section01 .owl-dots .owl-dot{background-color:#ddd;width:30px;height:5px;display:inline-block;margin-left:10px;border:0}
    .section01 .owl-dots .owl-dot.active { background-color: #e20000;}
    .section01 .owl-nav {position: absolute;right: 0; bottom: 0;}
    .section01 .owl-nav i {font-size: 30px;}
    .section01 .owl-next,.section01 .owl-prev{font-size:0;width:64px;height:64px;background-color:#fff;display:inline-block;border:0}
   
    .section01 .right { width: 40%; justify-content: center; align-items: center;}
    .section01 .right .txt { display: flex; flex-direction: column; font-weight: 500; color: #000; padding: 30px; background: aliceblue; border-radius: 1.2rem; margin-bottom: 20px;position: relative}
    .section01 .right .description { font-size: 18px; margin-bottom: 30px; font-weight: 600}
    .section01 .right .txt h2 { font-size: 35px; font-weight: bold; letter-spacing: -1px; }
    .section01 .right .txt p { font-size: 16px; color: #555;line-height: 1.65; }
    .section01 .right .top { clear: both; margin-top: 70px}
    .section01 .right .bottom { /*display: flex;*/ justify-content: space-between; max-width: 850px; margin-top: 20px }
    .section01 .right .bottom h5{ font-size: 18px;}     
    .section01 .right .bottom p {font-size: 16px; color: #555;  line-height: 1.65; flex: 1; margin: 10px 0;margin-left: 10px;}
    .section01 .right .bottom p:last-child { margin-right: 0}
    .section01 .more_section{ position: relative; overflow: hidden; color: #777; font-size: 16px; font-weight: 500; line-height: 1.65; margin-top: 35px }
    .section01 .more_section .top_cont { display: flex; align-items: flex-end; justify-content: space-between; padding: 0; margin: 0 auto; }
    .section01 .more_section .view_btn { width: 212px; height: 75px; border: 1px solid #1161af; border-radius: 40px; background-color: #fff }
    .section01 .more_section .view_btn a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding-left: 45px; font-size: 22px; font-weight: 700; line-height: 2.1; transition: all .3s; position: relative; }
    .section01 .more_section .view_btn a:before { content: ''; position: absolute; left: 14px; top: 10px; width: 52px; height: 52px; background: #1161af; border-radius: 30px; transition: all .2s; z-index: -1; }
    .section01 .more_section .view_btn a:hover:before { width: 100%; height: 100%; left: 0; top: 0; border-radius: 50px; }
    .section01 .more_section .view_btn a:hover { color: #fff; }
    .section01 .more_section .view_btn a span {position: absolute; top: 15px; left: 30px; color: #1161af;transition: all .3s;}
    .section01 .more_section .view_btn a:hover span { left: 35px; color: #fff }
    .section01 .more_section .view_btn a:hover {background: #1161af;border-radius: 40px;}
    
    .section01 .main-step {background-color: #1161af; color: #fff; padding: 14px; position: absolute; left: -5px; font-size: 16px; letter-spacing: 2px; border-top-right-radius: 25px; border-bottom-right-radius: 25px}
    .section01 .main-number-wrap {margin-top: 30px;border-top: 1px solid #fff; padding-top: 30px;}
    .section01 .main-number-wrap h3{font-size: 24px;font-weight: bold; letter-spacing: -1px; }
    .section01 .main-number-wrap p{font-size: 16px;}
    .section01 .main-number-search {position: relative; padding: 10px 10px 10px 30px; height: 74px; border: 1px solid #1161af; border-radius: 40px; margin: 20px 0px 30px 0px; background-color: #fff;}	
    .section01 .search-txt {float: left; padding: 0; background: none; border: none; outline: none; color: #000; font-size: 22px; line-height: 2.5; width: 80%;}
    .section01 .search-btn { color: #fff; float: right; width: 80px; height: 74px;  border-radius: 0px 40px 40px 0px;  background: #1161af;    display: flex;  align-items: center;  justify-content: center;  font-size: x-large; border: 0;  position: absolute;  right: 0;  top: 0;}



    .section01 .q_right { width: 100%; margin-top: 80px} 
    .section01 .q_right h3 { font-size: 20px; font-weight: 500; color: #555; padding-bottom: 20px; margin-left: 30px}
    .section01 .q_right h2 { font-size: 35px; font-weight: bold; color: #000; margin-left: 30px}
    .section01 .q_right .in-quiry { padding: 30px 0 0}
    .section01 .q_right .in-quiry ul li { float:left; width:32%; margin:0;  transition: all .2s}
    .section01 .q_right .in-quiry ul li:nth-child(3n+1) { margin-left:0}
    .section01 .q_right .in-quiry ul li a { margin: auto; display: block; text-align:center; color:#000;-webkit-transition: all .2s ease-out;-moz-transition: all .2s ease-out; -ms-transition: all .2s ease-out; -o-transition: all .2s ease-out; transition: all .2s ease-out;}
    .section01 .q_right .in-quiry ul li:hover {transform:translateY(-25px)}
    .section01 .q_right .in-quiry i { font-size:45px; color:#1161af; padding: 30px; border: 1px solid #1161af; border-radius: 50%;}
    .section01 .q_right .in-quiry p { display:block; padding-top:10px; font-size: 18px; color: #333; font-weight: 600}

    .section01 .m_user_wrap { background-color: #fff; border-top: 1px solid #1161af;  border-bottom: 1px solid #1161af; padding: 10px; width: 300px}
    .section01 .m_user_wrap h5 {font-size:18px}
    @media screen and (max-width: 768px) {
    .section01 .more_section .top_cont { flex-direction: column; align-items: flex-start }
    .section01 .m_user_wrap { width: 400px; margin-bottom: 20px}		
    }





    .section02 {position: relative; padding: 0;  background-image: url(../img/business_01.jpg); background-repeat: no-repeat; background-position: center center;background-size: cover; margin-top: 80px;transition: background-image 0.5s ease-iout; }
    .section02 .tl_change{  background-image: url(../img/business_01.jpg); background-repeat:no-repeat;background-position:center center;background-size:cover; margin-top:80px; transition: background-image 0.5s ease-in-out; /* 부드러운 전환 효과 추가 */}
    .section02 ul { position: relative; display:flex; flex-wrap:wrap; justify-content: space-between;}
    .section02 ul > li { width:25%; display:flex}
    .section02 ul > li > .wrapper{position:relative;width:100%; height:900px; background-color: rgba(0,0,0,0.3); padding:80px; border-left: 1px solid rgba(255, 255, 255, 0.3); display: flex; align-items: center; transition: background-color 0.3s ease; /* 부드러운 전환 효과 추가 */}
    .section02 ul > li:first-child>.wrapper {border-left:0}
    .section02 ul > li >.wrapper > .box { margin:0 auto }
    .section02 ul i {display:block;width:62px;height:60px; font-size:52px; margin:0 auto; color:#fff}

    .section02 ul h5{font-size:25px; color:#fff;margin:25px 0;text-align:center; font-weight:500; letter-spacing: 3px; word-break: keep-all}
    .section02 ul p{font-size:18px;line-height:1.6;text-align:left;color:#fff; opacity:0.8;  word-break: keep-all}
    .section02 ul .arrow{position:relative;width:40px;height:14px;margin:33px auto 0;opacity:0}
    .section02 ul .arrow:before{content:"";display:block;position:absolute;left:0;top:4px;width:39px;height:2px;background:#fff}
    .section02 ul .arrow:after{content:"";display:block;position:absolute;right:0;width:7px;height:7px;border-right:2px solid #fff;border-bottom:2px solid #fff;-ms-transform:rotate(-45deg);transform:rotate(-45deg)}
    .section02 ul>li>.wrapper:hover{background-color: rgba(0,0,0,0.8); color: #fff}
    .section02 ul>li>.wrapper:hover .arrow,.section02 ul>li>.wrapper:hover p{opacity:1}
    .section02 ul h5:hover{color:#fff}
    .section02 ul p:hover{color:#fff}

    .section02 .tl_row{padding-bottom:50px; position: absolute}
    .section02 .tl_row .col-12{float:left;position:relative;width:100%}
    .section02 .tl_row .col-12:last-child { padding-left: 90px;padding-top: 10px}
    .section02 .tl_row h2{ max-width:400px; font-size:35px;font-weight:bold;line-height:59px;letter-spacing:3px;color: #fff}
    .section02 .tl_row p{font-size:18px;line-height:1.6;color:#fff; opacity:0.8; max-width:400px; word-break:keep-all}
    .section02 .tl_row p:before{content:"";display:block;position:absolute;top:36px;left:-20px;width:60px;height:3px;background:#fff}

@media (max-width: 1500px) {
    .section01 .inner { display: block}
    .section01 .left {width: 100%}
    .section01 .main-right {width: 100%}

    .section01 .right {width: 100%; justify-content: flex-start;}
    .section01 .right .txt { padding-top: 50px}
    .section01 .right .txt h2 {
        font-size: 50px;
    }

    .section01 .right .txt p {
        font-size: 18px;
    }

    .section01 .right .bottom {
        flex-direction: column;
    }

    .section01 .right .bottom p {
        margin-bottom: 20px;
    }

    .section01 .right .bottom p:last-child {
        margin-bottom: 0;
    }
}


@media (max-width: 768px) {
    .section01 .right .txt h2 { font-size: 32px}
}


@media all and (max-width: 576px) { 
    .section01 { padding: 100px 0 50px}
	.section01 .right .txt {padding-top: 30px;}
    .section01 .more_section .view_btn {width: 170px; height: 55px;border: 1px solid #1465f4; border-radius: 40px;}
    .section01 .more_section .view_btn a { padding-left: 44px; font-size: 16px;  }
    .section01 .more_section .view_btn a:before { width: 32px; height: 32px}
    .section01 .more_section .view_btn a span {top: 10px; left: 24px;}
    .section01 .main-number-search {height: 53px; }		
    .section01 .search-btn { width: 53px; height: 52px; font-size: 16px}	
    .section01 .search-txt { font-size: 16px; line-height: 2;}	
	.section01 .q_right { width: 100%; margin-top: 50px} 
    .section01 .q_right h3 { font-size: 20px; margin-left: 0px}
    .section01 .q_right h2 { font-size: 32px; margin-left: 0px}	
}


@media all and (max-width: 576px) { 
    .section02{padding: 0}
	.section02 ul h2 { font-size: 19px}
    .section02 ul p { font-size: 13px; line-height: 1.65 }
	.section02 ul > li {width: 100% }
    .section02 ul > li >.wrapper { height: auto; padding: 30px 25px; border-left:0; border-bottom:1px solid #666 }
	.section02 ul > li:last-child>.wrapper { border-bottom:0} 
	.section02 .tl_row{padding-bottom:50px; position: relative}
    .section02 .tl_row .col-12{width:100%}
	.section02 .tl_row .col-12:last-child{padding:0 20px}
	.section02 .tl_row h2{font-size:28px;line-height:34px;text-align:center; max-width:none}
	.section02 .tl_row p{font-size:15px;padding:10px; text-align: center;  max-width:none}
	.section02 .tl_row p:before{display:none}
}



@media all and (min-width: 577px) and (max-width:992px) {  
	.section02 .tl_row{padding-bottom:50px; position: relative}
    .section02 .tl_row .col-12{width:100%}
	.section02 .tl_row .col-12:last-child{padding:0 20px}
	.section02 .tl_row h2{font-size:28px;line-height:34px;text-align:center; max-width:none}
	.section02 .tl_row p{font-size:15px;padding:10px; text-align: center; max-width:none}
	.section02 .tl_row p:before{display:none}
	.section02 ul { border-top: 1px solid #6a6865;border-left: 1px solid #6a6865}
	.section02 ul > li { width: 50%}
	.section02 ul > li:nth-child(2n+1) {clear: both;}
	.section02 ul > li >.wrapper{height:300px;border-top:0;border-left:0;padding:20px 25px}
	.section02 ul .arrow {display: none }
	.section02 ul .ic { -ms-transform: scale(0.75);transform: scale(0.75);}
	.section02 ul h2 { font-size: 21px;margin: 2px 0 15px}
	.section02 ul p { font-size: 13.5px;line-height: 21px}
	
	
}


@media all and (min-width: 993px) and (max-width:1200px) {  
	
	.section02 ul > li >.wrapper{height:430px;padding:30px}
	.section02 ul h2{font-size:24px;margin:18px 0}
	.section02 ul p{font-size:14px;line-height:23px}
	.section02 .tl_row h3{font-size:36px;line-height:48px}
	.section02 .tl_row p{font-size:16.5px}
	.section02 .tl_row .col-6:last-child{padding-left:80px;padding-top:26px}
	.section02 .tl_row p.bar:before{top:8px;left:-75px;width:50px;height:3px}
}




    
    .section03 .s1_text_box {padding: 150px 0 100px;}
    .section03 .s1_text_box h2 {font-size: 48px;}
    .section03 .s1_text_box p {font-size: 18px; line-height: 1.6; color:#555; padding-top: 20px; max-width:475px; word-break:keep-all}
    .section03 .s1_img_wrap {display: flex; justify-content: center;gap: 2%;}
    .section03 .s1_img_wrap img {width: 100%;}
    .section03 .s1_img_box01 {width: 100%;display: flex;flex-direction: column;align-items: center;gap: 3%;}
    .section03 .s1_img_box02 {width: 100%;padding: 60px 0;}
    .section03 .s1_img_box03 {width: 100%;}

@media all and (max-width:768px) {
	.section03 .s1_img_wrap {flex-wrap: wrap;}
    .section03 .s1_img_box01 > img:first-child {padding-bottom: 60px;}
    .section03 .s1_text_box h2 {font-size: 32px;}
}

    .section03 .s2_wrap {width: 100%;height: 840px;background-color: #f2f2f9;position: relative;margin-bottom: 400px;}
    .section03 .s2_wrap > .inner {display: flex;flex-wrap: wrap;justify-content: center;gap: 3%;padding-top: 135px;}
    .section03 .s2_text_wrap {width: 31%; margin-top:10%}
    .section03 .s2_text_wrap h2 {font-size: 48px;font-weight: 600; letter-spacing:-1px}
    .section03 .s2_text_wrap p {font-size: 17px; line-height: 1.6; padding-top: 20px; color:#555; word-break:keep-all}
    .section03 .s2_img_wrap {display: flex; align-items: center; flex-wrap: wrap; max-width: 887px; gap: 30px;}
    .section03 .s2_img_box { width: 100%;display: flex; justify-content: space-between;}

@media all and (max-width:1404px) {
	.section03 .s2_wrap {margin-bottom: 60%;}
    .section03 .s2_text_wrap {width: 100%;max-width: 887px;padding-bottom: 30px;}
    .section03 .s2_img_wrap img:first-child {width: 100%;}
    .section03 .s2_img_box {width: 100%;display: flex;justify-content: space-between;}
    .section03 .s2_img_box img:first-child {width: 33%;}
    .section03 .s2_img_box img:last-child {width: 63%;}
}

@media all and (max-width:768px) {
    .section03 .s1_text_box {padding: 50px 0 50px;}
	.section03 .s2_text_wrap h2 {font-size: 38px;}
    
}
/* s2 {{{*/
	

    /* s3 {{{ */
    .section03 { padding-bottom: 150px}
    .section03 .s3_wrap {height: 420px; background: #000; width:100%;  position: relative;margin-bottom: 300px;}
    .section03 .s3_wrap > .inner {display: flex;flex-wrap: wrap;align-content: center;justify-content: center; align-items: center;}
    .section03 .s3_wrap img {width: 45%; padding-bottom: 15%;}
    .section03 .s3_text_wrap {color: #fff; width:55%}
    .section03 .s3_text_wrap h2 {font-size: 48px;}
    .section03 .s3_text_wrap p {font-size: 17px;color: #fff; opacity:0.8; line-height: 1.6;padding-top:20px;}
    .section03 .s3_text_wrap .more a  {display:block; width:190px; font-size:14px;  color:#fff; line-height:40px; margin-top:20px; padding:0px 40px 0 0; transition: all 0.2s; background-image:url(../img/w_arrow_latest.png); background-repeat:no-repeat; background-position: 80px center;}
    .section03 .s3_text_wrap .more a:hover {padding:0px 12px; transition: all 0.3s;}
    .section03 .s3_wrap .photo { width:45%; margin-top:-150px; position:relative}
    .section03 .s3_wrap .photo img { width:90%}

@media all and (max-width:830px) {
	.section03 .s3_wrap {height: auto;padding-bottom: 100px;}
}

@media all and (max-width:768px) {
	.section03 .s3_text_wrap h2 {font-size: 38px;}
	.section03 .s3_text_wrap, .s3_wrap .photo {width:100%} 
}

@media all and (max-width:576px) {
    .section03 { padding-bottom: 50px}
}


    .section04 { padding: 150px 0; background-color: #f8f8fa}
    .section04 span { font-size:18px; font-weight:400; color:#555; text-align: left}
    .section04 h2 { font-size:48px; letter-spacing:-1px;  padding:10px 0 50px 0}
    .section04 .text-center { text-align: center}

@media all and (max-width: 768px) {
    .section04 { width:100%; padding:50px 0}
    .section04 h2 { font-size: 32px}
}



.section05 {width: 100%; padding: 150px 0}
.section05 .inner {display: flex;justify-content: space-between;}
.section05 .banner_area { width: 48%; height: 377px;padding: 62px; color: white; position: relative;}
.section05 .banner_area h3 { font-size: 18px;line-height: 1.65;}
.section05 .banner_area h2 { font-size: 30px; padding-top: 20px }
.section05 .button { position: absolute; bottom: 60px; right: 60px; width: 170px; height: 50px; border-radius: 25px; overflow: hidden; }
.section05 .button a { display: block; width: 100%; height: 100%; text-decoration: none; position: relative; }
.section05 .button span { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; font-size: 17px; font-weight: 600; transition: transform 0.3s ease; }
.section05 .button .default { background-color: white; color: black; transform: translateY(0); }
.section05 .button .hover { background-color: black; color: white; transform: translateY(100%); }
.section05 .button a:hover .default { transform: translateY(-100%); }
.section05 .button a:hover .hover { transform: translateY(0); }



@media (max-width: 768px) {
    .section05 {
        padding: 80px 0;
    }

    .section05 .banner_area {
        padding: 30px;
    }

    .section05 .banner_area h3 {
        font-size: 14px;
    }

    .section05 .banner_area h2 {
        font-size: 20px;
    }

    .section05 .button {
        width: 130px;
        height: 45px;
        line-height: 45px;
        font-size: 14px;
    }
}


@media all and (max-width: 576px) { 
    .section05 .inner { display: block}
    .section05 .banner_area { width: 100%; display: block; margin-bottom: 20px}
}

/*section06*/

    .section06 { width: 100%; padding: 50px 0}
    .section06 .inner { display: flex; justify-content: space-between;}
    .section06 .tit-left { width: 30%}
    .section06 .tit-right { width: 70%}
    .section06 .left-tit h2 { font-size: 50px; font-weight: bold; max-width: 300px;margin-top: 40px}
    .section06 .left-tit .more_section{ position: relative; overflow: hidden; color: #777; font-size: 16px; font-weight: 500; line-height: 1.65; margin-top: 50px }
    .section06 .left-tit .more_section .top_cont { display: flex; align-items: flex-end; justify-content: space-between; padding: 0; margin: 0 auto; }
    .section06 .left-tit .more_section .view_btn { width: 212px; height: 75px; border: 1px solid #1161af; border-radius: 40px; }
    .section06 .left-tit .more_section .view_btn a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding-left: 74px; font-size: 18px; font-weight: 700; line-height: 2.1; transition: all .3s; position: relative; }
    .section06 .left-tit .more_section .view_btn a:before { content: ''; position: absolute; left: 14px; top: 10px; width: 52px; height: 52px; background: #1161af; border-radius: 30px; transition: all .2s; z-index: -1; }
    .section06 .left-tit .more_section .view_btn a:hover:before { width: 100%; height: 100%; left: 0; top: 0; border-radius: 50px; }
    .section06 .left-tit .more_section .view_btn a:hover { color: #fff; }
    .section06 .left-tit .more_section .view_btn a span {position: absolute; top: 17px; left: 30px; color: #fff;transition: all .3s;}
    .section06 .left-tit .more_section .view_btn a:hover span { left: 45px; }
    

    



    .section06 .tab_header ul {display: flex; flex-direction: row; flex-wrap: nowrap; align-content: center; justify-content: space-evenly; padding:0;}
    .section06 .tab_header ul li { list-style:none; background: #fff; position: relative; cursor: pointer; font-size:18px; font-weight: 400; color: #666666; padding: 22px 0; text-align: center; width: 33.33%;  border:1px solid #e5e5e5;  border-right:0;  border-left:1px solid #e5e5e5;  transition: background 0.5s ease, color 0.5s ease;  z-index: 3;}

    .section06 .tab_header ul li:last-child { border-right: 1px solid #e5e5e5;}
    .section06 .tab_header ul li.on { overflow: hidden; font-size:18px; font-weight: 400; color: #fff; background: #1161af; z-index: 2;}
    .section06 .tab_body { max-width: 1600px; margin: 0 auto; padding: 0 20px; padding-top: 20px;}


    .section06 .tab_body ul {}
    .section06 .tab_body > ul > li {display: none;}
    .section06 .tab_body > ul > li.on {display: block}
    .section06 .tab_body .tab-con {display: flex;}	
	.section06 .tab_body .tab-con .left-tit {width:30%} 
	.section06 .tab_body .tab-con .right-con {width:70%} 

/*    .section06 .tab_body .left-tit { width:30%; margin-bottom:20px}
    .section06 .tab_body .right-con  { width:70%; }*/


@media all and (max-width: 768px) { 
	.section06 {padding: 50px 0}
    .section06 .inner { display: block}
    .section06 .tit-left { width: 100%}
    .section06 .tit-right { width: 100%}
	.section06 .tab_body {width: 100%}	
	.section06 .tab_body .tab-con {flex-direction: column}	
	.section06 .tab_body .tab-con .left-tit {width:100%	} 
	.section06 .tab_body .tab-con .right-con {width:100%} 	
	
}

@media all and (max-width: 576px) {
    .section06 {padding:  0}
    .section06 .left-tit h2 { font-size: 32px; margin-top: 20px}
    .section06 .left-tit .more_section .view_btn {width: 170px; height: 55px;border: 1px solid #1465f4; border-radius: 40px;}
    .section06 .left-tit .more_section .view_btn a { padding-left: 44px; font-size: 16px;  }
    .section06 .left-tit .more_section .view_btn a:before { width: 32px; height: 32px}
    .section06 .left-tit .more_section .view_btn a span {top: 10px; left: 24px;}
    .section06 .left-tit .more_section { margin-top: 30px;}	
	.section06 .tab_body .left-tit { width:100%; margin-bottom:20px}
    .section06 .tab_body .right-con { width:100%; }
}

/*section06*/



/* main case */
.section07 .max-inner{max-width:1570px; width:100%; margin:0 auto;}
.section07 .sec-title p.sub-tit{font-size:18px; color:#0460d9; font-weight:600; margin-bottom:20px;}
.section07 .sec-title h2{font-size:48px; color:#222; line-height:1.3; font-weight:600;}
.section07 .case-cont{  margin:140px 0;}
.section07 .case-cont .sec-title{display:flex; justify-content:space-between; align-items:end;}
.section07 .case-cont .max-inner{margin-bottom:60px;}
.section07 .case-cont .swiper-slide{ cursor: pointer; overflow:hidden; transform: rotate(.001deg);}
.section07 .case-cont .case-cont{position:relative;}
.section07 .case-cont .case-cont .slide-txt { position: absolute; width: 100%; left: 0; right: 0; padding: 30px; transition: all 0.5s; bottom: -100%; background-color: #fff; }
.section07 .case-cont .case-cont .slide-txt h3{font-size: 16px; color: #0460d9; font-weight: 500; margin-bottom:15px;}
.section07 .case-cont .case-cont .slide-txt h3 em{display: block; font-size: 22px; font-weight: 700; color: #222; margin-top: 10px; font-style: normal}
.section07 .case-cont .case-cont .slide-txt ul li{font-size:18px; color:#666; margin-bottom:5px;}
.section07 .case-cont .case-cont .slide-img{overflow:hidden; position:relative; padding-bottom:148%;}
.section07 .case-cont .case-cont .slide-img img{transition:all .6s linear; position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.section07 .case-cont .swiper-slide:hover .slide-img img{transform: scale(1.1);}
.section07 .case-cont .swiper-slide:hover .slide-txt{bottom:0;}
.section07 .case-cont .swiper{overflow:hidden;}

.section07 .view_btn a{display:flex; align-items:center; gap:10px;}
.section07 .view_btn a .view_arrow{width:50px; height:50px; border:1px solid #fff; border-radius:50%; display:flex; justify-content:center; align-items:center; position:relative;}
.section07 .view_btn a .view_arrow::after{content:''; width:0; height:0; background-color:#141517; border-radius:50%; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); transition:width 0.2s linear, height 0.2s linear;}
.section07 .view_btn a .view_arrow::before{content:''; width:0; height:0; background-color:#fff; border-radius:50%; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); transition:width 0.2s linear, height 0.2s linear;}
.section07 .view_btn a p{font-size:18px; color:#fff; font-weight:bold; position:relative;}
.section07 .view_btn a p::after{content:''; width:0; height:1px; background-color:#fff; position:absolute; right:0; bottom:0; transition:width 0.2s linear;}
.section07 .view_btn a:hover .view_arrow::after{width:5px; height:5px;}
.section07 .view_btn a:hover .view_arrow::before{width:100%; height:100%;}
.section07 .view_btn a:hover p::after{width:100%; left:0;}
.section07 .view_btn.blue a .view_arrow{border-color:#0460d9;}
.section07 .view_btn.blue a .view_arrow::after{background-color:#fff;}
.section07 .view_btn.blue a .view_arrow::before{background-color:#0460d9;}
.section07 .view_btn.blue a p{color:#222;} 
.section07 .view_btn.blue a p::after{background-color:#222;}

.section07 .case-cont .pagination-container {width:90%; max-width:1570px; margin:0 auto; margin-top:80px; z-index: 2; position:relative; justify-content:space-between; align-items:center;}
.section07 .case-cont .swiper-pagination2 {position: relative; width:100%; height: 1px; background:#ddd; z-index:2; }
.section07 .case-cont .swiper-pagination-progressbar-fill {background: #0460d9;}


@media screen and (max-width: 768px) {
    .section07 .view_btn a .view_arrow { width: 40px; height: 40px; }
    .section04 .view_btn a p { font-size: 16px; }
    .section04 .case-cont { margin: 60px 0; height: auto; }
    .section07 .case-cont .sec-title { flex-wrap: wrap; }
    .section07 .case-cont .left { width: 100%; margin-bottom: 20px; }
    .section07 .case-cont .right { width: 100%; }
    .section07 .sec-title p.sub-tit { margin-bottom: 10px; font-size: 16px; }
    .section07 .sec-title h2 { font-size: 32px}
    .section07 .case-cont .case-cont .slide-img { padding-bottom: 120%; }
    .section07 .case-cont .case-cont .slide-txt { bottom: 0; position: relative; }
    .section07 .case-cont .case-cont .slide-txt ul li { font-size: 16px; }
    .section07 .case-cont .case-cont .slide-txt h3 { font-size: 16px; margin-bottom: 15px; }
    .section07 .case-cont .case-cont .slide-txt h3 em { font-size: 18px; }
    .section07 .case-cont .pagination-container { width: 90%; margin-top: 40px; }
    .section07 .case-cont .swiper { padding: 0 5%; }
    
}






    .section08 { width: 100%; padding: 50px 0}
    .section08 .inner { display: flex; justify-content: space-between;}
    .section08 .left {width: 60%;}
    .section08 .right { width: 40%} 
    .section08 h3 { font-size: 20px; font-weight: 500; color: #555; padding-bottom: 20px}
    .section08 h2 { font-size: 32px; font-weight: bold; color: #000}

    .section08 .right .in-quiry { padding: 50px 0}
    .section08 .right .in-quiry ul li { float:left; width:32%; margin:0;  transition: all .2s}
    .section08 .right .in-quiry ul li:nth-child(3n+1) { margin-left:0}
    .section08 .right .in-quiry ul li a { margin: auto; display: block; text-align:center; color:#000;-webkit-transition: all .2s ease-out;-moz-transition: all .2s ease-out; -ms-transition: all .2s ease-out; -o-transition: all .2s ease-out; transition: all .2s ease-out;}
    .section08 .right .in-quiry ul li:hover {transform:translateY(-25px)}
    .section08 .right .in-quiry i { font-size:45px; color:#1161af; padding: 30px; border: 1px solid #1161af; border-radius: 50%;}
    .section08 .right .in-quiry p { display:block; padding-top:10px; font-size: 18px; color: #333; font-weight: 600}

    .section08 .main-number-search {position: relative; padding: 10px 10px 10px 30px; height: 80px; border: 1px solid #1161af; border-radius: 40px; margin: 70px 50px 30px 0px;}	
    .section08 .search-txt {float: left; padding: 0; background: none; border: none; outline: none; color: #000; font-size: 24px; line-height: 2.5; width: 80%;}
    .section08 .search-btn { color: #fff; float: right; width: 140px; height: 80px;  border-radius: 0px 40px 40px 0px;  background: #1161af;    display: flex;  align-items: center;  justify-content: center;  font-size: x-large; border: 0;  position: absolute;  right: 0;  top: 0;}


/*    .section08 .right { width: 50%} 
    .section08 .right ul li { float:left; width:18%; margin-left:2.5%;  transition: all .2s}
    .section08 .right ul li:nth-child(5n+1) { margin-left:0}
    .section08 .right ul li a { margin: auto; display: block; text-align:center; color:#000;-webkit-transition: all .2s ease-out;-moz-transition: all .2s ease-out; -ms-transition: all .2s ease-out; -o-transition: all .2s ease-out; transition: all .2s ease-out;}
    .section08 .right ul li:hover {transform:translateY(-25px)}
    .section08 .right i { font-size:45px; color:#1161af; padding: 30px; border: 1px solid #1161af; border-radius: 50%;}
    .section08 .right p { display:block; padding-top:10px; font-size: 18px; color: #333; font-weight: 600}*/

@media screen and (max-width: 768px) {
	.section08 .inner { display: block}
    .section08 .left { width:100%; margin-bottom:20px}
    .section08 .right  { width:100%; }	
    .section08 .left h2 { font-size: 32px;}
	.section08 .main-number-search {padding: 10px 0px 10px 30px; margin: 70px 0px;}	
    .section08 .search-txt {font-size: 16px; line-height: 3.6; width: 70%;}	
	.section08 .search-btn { width: 100px; height: 80px; font-size: x-large;}	
    .section08 .right ul li { width:50%; margin-left:0; margin-bottom: 20px; padding: 20px 0}
	.section08 .right ul li:nth-child(2n+1) { margin-left:0}
	.section08 .right ul li { width:50%; background-size:cover}
}

@media all and (max-width: 576px) { 
    .section08 { padding: 50px 0}
    .section08 .inner { display: block}
    .section08 .left { width:100%; margin-bottom:20px}
    .section08 .right  { width:100%; }
	.section08 .main-number-search {padding: 10px 0px 10px 30px; margin: 70px 0px;}	
    .section08 .search-txt {font-size: 16px; line-height: 3.6; width: 70%;}	
	.section08 .search-btn { width: 100px; height: 80px; font-size: x-large;}
}



    .section09{ width: 100%;  position:relative; height:725px; background-image: linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ),url(../img/bg.jpg);background-position:center;background-size:cover; }
    .section09 .inner{display:flex;align-items:center;max-width:1580px;height:100%;margin:0 auto}
    .section09 .tit_area{font-size:19px;font-weight:600;color:#fff;}
    .section09 .tit_area span{display:block;font-size:20px;font-weight:600;color:#fff}
    .section09 .tit_area h2 {margin:20px 0 30px;font-size:52px;font-weight:700}
    .section09 .tit_area p {white-space:pre-line; font-size:18px; opacity: 0.8; line-height: 1.65;  }
    .section09 ul{display:flex;width:50%;height:100%;margin-left:auto}
    .section09 ul li{position:relative;width:50%}
    .section09 ul li i { font-size: 50px; opacity: 1}
    .section09 ul li:before{opacity:0;display:block;content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:#079692;transition:all .3s}
    .section09 ul li:hover:before{opacity:.85}
    .section09 ul li+li{border-right:1px solid rgba(255,255,255,0.2)}
    .section09 ul li a{position:relative;display:flex;flex-flow:column;justify-content:center;align-items:flex-start;height:100%;padding:0 58px;border-left:1px solid rgba(255,255,255,0.2);color:rgba(255,255,255,0.5);word-break:keep-all; font-size: 18px; line-height: 1.65}
    .section09 ul li p{margin:70px 0 20px;font-size:24px;font-weight:600;color:#fff}

@media (max-width: 768px) {
    .section09 {
        height: auto;
        padding: 20px 0;
    }

    .section09 .inner {
        flex-direction: column;
        padding: 20px;
    }

    .section09 .tit_area h2 {
        font-size: 32px;
    }

    .section09 ul {
        flex-direction: column;
        width: 100%;
        padding-top: 20px
    }

    .section09 ul li {
        width: 100%;
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }

    .section09 ul li:last-child {
        border-bottom: none;
    }

    .section09 ul li a {
        padding: 20px 10px; border-left:0
    }

    .section09 ul li p {
        margin: 10px 0;
        font-size: 20px;
    }
}




