main{padding:80px 0 0 0 ;}
/* main > section {padding:100px 0; margin: 100px 0; box-sizing: border-box;}
main > section .content_wrapper {width: 100%; max-width: 1440px; margin: 0 auto;} */
h1{font-size: 4.5rem;}
h2{font-size: 5rem; font-weight: 600;}
h3{font-size: 4rem; font-weight: 600;}
h4{font-size: 1.8rem;}

/*animation*/
.aos-all {width: 1000px;max-width: 98%;margin: 10vh auto 0 auto;}
.aos-item {display: inline-block; float: left; width: 33.3333%;height: 300px;padding: 20px;}
.aos-item__inner {position: relative;width: 100%;height: 100%;float: left;background: #1da4e2;line-height: 260px;text-align: center;color: #fff;}

/* 전체 컨테이너: 풀브라우징, 내부 컨텐츠는 max-width 1440px로 제한 */
.container {max-width: 1440px; margin: 0 auto; }
main{padding:0; margin: auto;}
.only-mobile {display: none;}

/* 헤더 영역 */
header {position: relative; width: 100%;  background: #fff; border-bottom: 1px solid #eee;}
.header{padding: 0 30px;}
.header_inner {position: relative; display: flex; height:90px; align-items: center;  justify-content:center;}
.header_inner .logo{position: absolute; left:0;}
.header_inner .logo a{display: block; width:150px; }
.header_inner .logo img{width:100%;}
.header_inner .free_btn{position: absolute; right:0;}

/* 푸터 */
.btn_top {
    position: fixed;
    display: flex;
    align-items: center;
    justify-content: center;
    right: 20px;
    bottom: 20px;
    width:70px; height: 70px;
    color: #fff;
    border-radius:50%;
    cursor: pointer;
    z-index: 1000;
    background:var(--main-color);
}
.btn_top img{width:30px;}

body > footer {background-color: #232323; padding: 0 0 1rem;}
body > footer .footer-bottom {display: flex; margin-top: 0.5rem;   }
body > footer .slogan {border-bottom: 1px solid #4f4f4f; padding: 2rem 16px; display: flex; justify-content: space-between;  gap: 8px;}
body > footer .slogan h2 {font-weight: 500; font-size:3.5rem; color: #b0b0b0; line-height: 100%; display: flex; align-items: center;}
body > footer .slogan img {height: 60px; margin: 0 12px; color: #4f4f4f;}
body > footer .footer-contents {flex: 8; color: #fff; padding: 0.5rem 0 1rem;}
body > footer .term-link {border-bottom: 1px solid #4f4f4f; display: flex; justify-content: space-around; font-size:1.4rem; padding-bottom: 1rem;}
body > footer a {text-decoration: none; border: none; font-size: 1.5rem;}
body > footer:focus {outline: 2px dashed #fff; }
body > footer h2 {padding: 2rem 0; font-weight: 600; font-size: 3.5rem; line-height: 100%; color: #b0b0b0;}
body > footer h3 {font-size: 2rem; line-height: 100%; margin: 0.5rem 0; font-weight: normal; word-break: break-all;}
body > footer p {font-size: 1.5rem;line-height: 100%;}
body > footer p:last-child {font-size: 1.5rem;font-weight: 300;}
body > footer .contact-us h2{font-size: 3rem;line-height: 100%;}
body > footer .contact-us p{font-size: 2.2rem; line-height: 4rem;}
body > footer .contact-us h3{font-size:3rem;line-height: 100%;}
body > footer .contact-us p:last-child {font-size:1.6rem;line-height: 100%; margin-top: 10px;}
body > footer .footer-company-info-wrapper {border-left: 1px solid #4f4f4f; padding: 1rem;  flex: 3.5; color: #b0b0b0;}
body > footer .company-info-item {margin:10px 0; display: flex; gap: 10px; font-size:1.5rem;}
body > footer .company-info-item:first-child {flex-direction: column; }
body > footer .footer-company-info-wrapper .copyright {margin: 2rem 0;}
body > footer .company-info-label {color: #dfdfdf;}
body > footer .footer_copyright { margin: 2rem 0;}
body > footer .family-site-menu-wrap {position: relative; width:100%;}
body > footer .footer-company-info-wrapper .family-site-menu-wrap .btn_family-site-menu {
    position: relative;
    font-size: 1.6rem;
    background-color: #4f4f4f;
    width: 100%;
    text-align: left;
    padding: 0.9rem 0 0.9rem 0.5rem;
    border-radius: 4px;
    color: #fff;
    border: none;
    cursor: pointer;}

body > footer .footer-company-info-wrapper .family-site-menu-wrap .btn_family-site-menu img.active {
    transform: translateY(-50%) rotate(-90deg)}

body > footer .btn_family-site-menu {
    position: relative;
    font-size: 1.5rem;
    background-color: #4f4f4f;
    width: 100%;
    text-align: left;
    padding: 1.2rem 0 1.2rem 1.2rem;
    border-radius: 4px;
    color: #fff;
    border: none;
    cursor: pointer;}
body > footer .btn_family-site-menu:focus { outline: 2px dashed #fff; }
body > footer .btn_family-site-menu img {
    width: 12px;
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%) rotate(90deg);}
body > footer .btn_family-site-menu.active {transform: translateY(-50%) rotate(-90deg); }

body > footer .family-site-menu {
    position: absolute;
    border: 1px solid #4f4f4f;
    background-color: #4f4f4f;
    color: #fff;
    font-size: 1rem;
    bottom: 105%;
    left: 0;
    width: 100%;
    border-radius: 4px;}
.family-site-menu li a { display: block;  padding: 16px; text-decoration: none; font-size: 1.5rem;}
.family-site-menu li a:hover, a:focus { background-color: #fdfdfd; color: #111; }


body > footer select {
    padding: 0.5rem 0 0.5rem 0.2rem;
    font-size: 1rem;
    width: 100%;
    background-color: #4f4f4f;
    border-radius: 4px;
    border: none;
    color: #dfdfdf;
    cursor: pointer;
}

body > footer .ui-selectmenu-button.ui-button {
    padding: 0.5rem 0 0.5rem 0.2rem;
    width: 100%;
    background-color: #4f4f4f;
    font-size: 1rem;
    border-radius: 4px;
    color: #dfdfdf;
    box-sizing: border-box;
    cursor: pointer;
}

/*
footer {background: #1a1a1a;color: #fff; text-align: center; }
.footer_inner {position: relative; display: flex;  height:180px; align-items:center;  justify-content:start;}
.footer_contain{display: flex; align-items: start; gap: 100px;}
.footer_wrap{display: flex; align-items: start; gap: 80px; }
.footer_wrap .logo{align-items: start; margin-left:0;}
.footer_wrap .logo a{display: block; width:180px; }
.footer_wrap .logo img{width:100%;}
.footer_box{display: flex; flex-direction: column; gap: 30px;}
.footer_box .footer_nav{margin-top: 10px;}
.footer_box .footer_nav ul{display: flex; gap:60px;}
.footer_box .footer_nav ul li{font-size: 1.6rem;}
.footer_box .footer_adr{ text-align: left;}

/* 햄버거 버튼 */
.hamburger {display: none; /* 데스크톱에서는 숨김 */ flex-direction: column;justify-content: center; gap: 5px;background: none;border: none;cursor: pointer;}
.hamburger span {display: block;width:26px;height: 3px; margin: 5px 0; background: #1a1a1a; transition: transform 0.4s ease, opacity 0.3s ease;}

/* 기본 PC 스타일 */
.main_nav {display: flex; align-items: center; justify-content: center;}
.main_menu {display: flex; gap:80px; justify-content: center;}
.main_menu02 {position:absolute; right:0; display: flex; gap:10px; justify-content: end; }
.mobile_menu {display: none;}
.btn_demo{font-size:1.6rem; padding:14px 20px; color:#fff; border-radius: 6px; background: linear-gradient(to right, #144DF4, #6524FE);}

/* 메인 네비게이션 */
.main_nav ul {list-style: none; display: flex; }
.main_nav ul li a {text-decoration: none; font-size: 1.8rem; color: #1a1a1a; font-weight: 500;transition: color 0.2s ease;  display: inline-block;}
.main_nav ul.main_menu02 li a {text-decoration: none; font-size: 1.6rem; color: #1a1a1a; font-weight: 500;transition: color 0.2s ease;  display: inline-block;}

.main_nav ul li a:hover {color: var(--main-color); font-weight: 600;}
.free_btn {
    width: 120px;
    overflow: hidden;
    border: none;
    background: var(--main_color);
    padding: 0;
    position: relative;
    border-radius: 35px;
}

.free_btn .slide_wrap {
    width: 100%;
    overflow: hidden;
    padding:10px 0;

}

.free_btn .slide_track {
    display: flex;
    animation: scrollText 5s linear infinite;
}

.free_btn .slide_track .free_txt {
    white-space: nowrap;
    padding-right: 30px; /* 텍스트 간 간격 */
    font-weight: bold;
    font-size: 1.6rem;
    color:#fff;
}

/* 슬라이딩 애니메이션 */
@keyframes scrollText {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-100%);
    }
}

/* 비주얼 섹션 */
.main_visual{position: relative;  background: linear-gradient(to bottom, #EDF4FF, #DBEAFF);}
.main_visual_text {z-index: 2; color:#1a1a1a; padding: 100px 0;}
.main_visual_inner {
    width:100%; margin:0 auto; max-width: 1440px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: center;
    height:600px; /* 추가로 height도 필요할 수 있음 */
}
.main_visual_con{position: relative; text-align: left; height: 100%; background: url(../images/visual_ani.png) no-repeat right bottom; background-size:45%;  }
.main_visual_txt_wrap{position: absolute; left:150px; top:30%;}
.main_visual_txt{}
.main_visual_txt h1 {width:500px; }
.main_visual_txt h1 img{width:100%;}
.main_visual_logo_wrap{}
.txt_gr{color:linear-gradient(98deg, #248CEC 0%, #5D32FC 100%);}
.main_visual_logo{width:250px; margin-bottom:10px;}
.main_visual_logo img{width:100%;}
.main_visual_txt02{font-size:2rem; margin-top:0;}
.visual_sec{padding:80px 0; text-align: center;}
.main_visual_btn{display: flex; gap: 10px;  margin-top: 30px;}
.main_visual_btn button{    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 220px;
    padding: 20px;
    color: #fff;
    font-size: 2rem;
    font-weight: 700;
    border-radius: 1.4rem;}
.main_visual_btn button:nth-child(1){background: linear-gradient(to right, #144DF4, #6524FE);}
.main_visual_btn button:nth-child(2){border:1px solid var(--main-color); color:var(--main-color);  background: #fff;}
.visual_text{font-size:2rem;}

/*주요 서비스 섹션*/
.services{padding: 50px 0 0;}
.services .container{text-align: center;}
.txt_green{color:var(--main-color);}
.services_item_wrap{padding: 30px 0; font-size: 2.5rem; }
.services_item_wrap .icon_fido{width:350px; margin: 0 auto 20px;}
.services_item_wrap .icon_fido img{width:100%;}

/*주요 기능 섹션*/
.features{padding: 100px 0; background: url(../images/features_bg.png) no-repeat center center; background-size:80%;}
.features h3{text-align: center; margin-bottom:60px; color:#000;}
.features .container{}
.features_item_wrap{}
.features_items{display: flex;flex-wrap: wrap;gap:10px; }
.features_item{position: relative; width: calc(25% - 10px); height:210px; padding:20px; border:1px solid #EBEBEB; border-radius: 1.4rem; background: #fff;}
.features_item .icon{position: absolute; left:20px; top:20px; display: flex; align-items: center; justify-content: center; width:70px; height: 70px; border-radius: 1.4rem; }
.features_item .icon img{width:70%;}
.features_item .tit{text-align:left; font-size:2.2rem; line-height: 2.6rem; padding-bottom:10px;  padding-top:80px; font-weight:bold;}
.features_item .con{font-size: 1.6rem; line-height: 2rem;}

/*주요 필요 섹션*/
.points{padding:80px 0; background: #fff;}
.points h3{ }
.points_card .tit{position: absolute; bottom:0; border-bottom-right-radius:12px ; border-bottom-left-radius:12px ; width:100%; height: 156px; color:#fff; font-size:1.8rem; font-weight: 600; padding: 30px; background: rgba(0, 0, 0, 0.3);}
.points_card .tit p{margin-bottom: 10px;}
.points_card .tit h4{font-size:2rem; line-height: 2.8rem;}
.points_card .icon{width:100%;}
.points_card .icon img{width:100%;}
.points_card{position: relative;}
.points_card.bg01{width:100%; height: 500px; background: url(../images/icon_points01.jpeg) no-repeat center bottom; background-size: cover;}
.points_card.bg02{width:100%; height: 500px; background: url(../images/icon_points02.jpeg) no-repeat center bottom; background-size: cover;}
.points_card.bg03{width:100%; height: 500px; background: url(../images/icon_points03.jpeg) no-repeat center bottom; background-size: cover;}
.points_card.bg04{width:100%; height: 500px; background: url(../images/icon_points04.jpeg) no-repeat center bottom; background-size: cover;}
.points_card.bg05{width:100%; height: 500px; background: url(../images/icon_points05.jpeg) no-repeat center bottom; background-size: cover;}
.points_card.bg06{width:100%; height: 500px; background: url(../images/icon_points06.jpeg) no-repeat center bottom; background-size: cover;}
.points_card.bg07{width:100%; height: 500px; background: url(../images/icon_points07.jpeg) no-repeat center bottom; background-size: cover;}
.points_card.bg08{width:100%; height: 500px; background: url(../images/icon_points08.jpeg) no-repeat center bottom; background-size: cover;}
.points_card.bg09{width:100%; height: 500px; background: url(../images/icon_points09.jpeg) no-repeat center bottom; background-size: cover;}
.points_header{display: flex; align-items: end; justify-content: space-between; margin-bottom:50px;}
.swiper-wrapper{}
.swiper {width: 100%; max-width: 1440px; margin: 0 auto; overflow: hidden;}
.swiper-slide {background: #f2f4f6;border-radius: 12px;  height: 180px; display: flex;  align-items: center;   justify-content: center;   font-size: 20px; font-weight: bold;}
.swiper-pagination{display: none;}

/* Swiper 공통 설정 */
.pointsSwiper {
    position: relative;
    width: 100%;
    overflow: hidden; /* 기본값 유지 */
}

/* PC: Swiper 해제하는 코드를 삭제하고 아래처럼 수정 */
@media (min-width: 769px) {
    .pointsSwiper {
        overflow: visible; /* 오른쪽 슬라이드가 살짝 보이게 하려면 필요 */
    }
}

.swiper_page_arrow {display: flex;    align-items: center; justify-content: flex-end; gap: 12px;}

/* 1. 기본 화살표 폰트 제거 */
.swiper_page_arrow .swiper-button-next:after,
.swiper_page_arrow .swiper-button-prev:after {
    display: none !important;
}

/* 2. 공통 버튼 스타일 (이미지 배경 설정) */
.swiper_page_arrow .swiper-button-next,
.swiper_page_arrow .swiper-button-prev {
    position: static;
    width: 50px ;
    height: 50px ;
    margin: 0;
    cursor: pointer;
    background-image: url('../images/swiper_arrow.png'); /* 이미지 경로 확인하세요! */
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain; /* 또는 40px 40px */
}

/* 3. 왼쪽 버튼(Prev)은 이미지를 좌우 반전 시킴 */
.swiper_page_arrow .swiper-button-prev {
    transform: scaleX(-1);
}

/* 4. 호버 효과 (선택사항: 살짝 투명도 조절이나 크기 조절) */
.swiper_page_arrow .swiper-button-next:hover,
.swiper_page_arrow .swiper-button-prev:hover {
    opacity: 0.7;
}

/* 5. 페이지네이션 (점) 스타일 */
.swiper_page_arrow .swiper-pagination {
    position: static;
    width: auto;
    display: flex;
    gap: 8px;
}


/*주요 적용 섹션*/
.application{padding: 80px 0; background: url(../images/application_bg.png); background-size: cover;}
.application h3{margin-bottom:60px; }
.application_items{display: flex; gap:80px; align-items: center; justify-content: space-between;}
.application_item{position: relative; display:flex; gap:20px; justify-content: space-between; flex:2;}
.application_card{display: flex; width:100%; padding: 30px; border:1px solid #C3E9DD; border-radius: 3rem;}
.application_card .tit{width:100%; color:#000; font-size: 2rem; font-weight: 600; }
.application_card .tit h4{font-weight: bold; font-size: 2.2rem; margin: 25px 0 15px;}
.application_card .icon_wrap{display: flex;border-radius: 15px; margin-bottom: 10px; }
.application_card .icon_wrap .icon_img img{width:90%;}
.application_card .icon_wrap .icon_txt {height: 30px; padding: 5px 10px; color:#fff; font-size: 1.4rem; background: var(--main-color); }
.application_card .list{font-size:1.6rem;}
.application_card .list ul li{width:100%; padding: 10px 10px; margin:8px 0; border-radius:6px; background: #fff;}

.application_card:nth-child(1){ background: linear-gradient(to bottom, #DDF1FF, #C6E5FB);}
.application_card:nth-child(2){ background: linear-gradient(to bottom, #DBF5F9, #CDEFF4);}
.application_card:nth-child(3){ background: linear-gradient(to bottom, #DDFBEE, #D2FAE9);}

.application_card:nth-child(1) .icon_wrap .icon_img {display: flex; align-items: center; justify-content: center; width:60px; height:60px; background: #5CAFE9; border-radius: 15px; }
.application_card:nth-child(2) .icon_wrap .icon_img {display: flex; align-items: center; justify-content: center; width:60px; height:60px; background: #6ED3E3; border-radius: 15px; }
.application_card:nth-child(3) .icon_wrap .icon_img {display: flex; align-items: center; justify-content: center; width:60px; height:60px; background: #65CFA3; border-radius: 15px; }

.application_card:nth-child(1) .icon_wrap .icon_txt {height: 30px; padding: 5px 10px; margin-left: 6px; color:#fff; font-size: 1.4rem; border-radius: 4px; background:#5CAFE9; }
.application_card:nth-child(3) .icon_wrap .icon_txt {height: 30px; padding: 5px 10px; margin-left: 6px; color:#fff; font-size: 1.4rem; border-radius: 4px; background:#65CFA3; }

.application_txt02{font-size: 4rem; font-weight: 600; text-align: center; margin-top:80px;}
.application_case_item_wrap{margin-top: 50px;}
.application_case_items{display: flex;  flex-wrap: wrap;}
.application_case_item{display: flex;gap:20px; width: 100%;}
.application_case{
    display: flex;
    flex-direction: column;
    width: calc(50% - 20px); /* 한 줄에 2개 */
    border: 1px solid #C3E9DD;
    border-radius: 3rem;
    background: #fff;
    box-sizing: border-box;
    flex: 2;
}
.application_case:nth-child(1){padding: 30px; color:#000; background: linear-gradient(to bottom, #DDE5FF, #D3DAFF);}
.application_case:nth-child(2){padding: 30px; color:#000; background: linear-gradient(to bottom, #DDE5FF, #D3DAFF);}
.application_case_box{display:flex; gap: 20px;}
.application_case_box > div {width: calc(50% - 10px);}
.application_case_box .tit{}
.application_case_box .tit h4{font-size: 3rem; margin:20px 0 10px; font-weight: bold;}
.application_case_box .list{font-size:1.6rem;}
.application_case_box .list ul li{ padding: 10px 10px; margin:8px 0; border-radius:6px; color:#000; background: #fff;}
.application_case_box .icon_wrap .icon_txt {width:50px; height: 30px; text-align: center; border-radius:6px; padding: 5px 10px; color:#fff; font-size: 1.4rem; background:#7387F6; }
.application_case_box .icon_wrap02{height: 30px;}

/*기술력*/
.skill{padding: 80px 0; }
.skill_state_tb_wrap{ margin-top: 40px;  border:1px solid #cfcfcf; border-radius: 20px;}
.skill_state_tb{width:100%; font-size: 1.6rem;}
.skill_state_tb tr th{padding: 20px 10px; color:#fff; background: #1a1a1a;}
.skill_state_tb tr td{padding: 20px 10px; text-align: center; border-top:1px solid #cfcfcf;}
.skill .state_box{display:inline-block; padding: 6px 20px 6px 50px; border-radius: 6px; background:#ECFDF5 url(../images/icon_check.png) no-repeat 20px center; background-size: 20px; color:#059669;}
.skill .state_box02{display:inline-block; padding: 6px 20px 6px 20px; border-radius: 6px; background:#FEF2F2; color:#DC2626;}
.skill .state_box03{display:inline-block; padding: 6px 20px 6px 20px; border-radius: 6px; background:#e4e4e4; color:#808080;}

/*도입 절차*/
.process{padding:80px 0; }
.process_box {  padding: 50px 20px; font-family: 'Pretendard', sans-serif; max-width: 1440px;  margin: 0 auto;}
.process_list {display: flex;justify-content: space-between;list-style: none; padding: 0;  margin: 0;}
.process_item {  position: relative;  flex: 1;  text-align: center;}

/* 화살표 구현 (마지막 요소 제외) */
.process_item:not(:last-child)::after { content: '→';  position: absolute; top: 75px; right: -10%;  font-size: 24px;  color: var(--process-light-gray);}
.process_step {  font-weight: 800;  color:var(--main-color);  font-size:1.4rem; }
.process_icon_wrap {
    width: 120px;
    height: 120px;
    background-color:#fff;
    border-radius: 35%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    /*box-shadow: 0 10px 20px rgba(0, 98, 223, 0.2);*/
}

.process_icon {width:90px;}
.process_icon img{width:100%;}
.process_title {  font-size:1.8rem;  font-weight: 700;  margin-bottom: 10px;}
.process_desc {  font-size:1.6rem;  color: var(--process-gray);  line-height: 1.5;}
.process_item.status_active .process_step {  color: var(--process-green);}
.process_item.status_active .process_icon_wrap {  background-color: var(--process-green);  box-shadow: 0 10px 20px rgba(0, 168, 107, 0.2);}

/*체험*/
.experience{height:500px; margin:0;  background: url(../images/experience_bg.png) no-repeat center center; background-size:cover;}
.experience .container{display: flex; align-items: center; justify-content: center; padding:100px 0; height:100%; border-radius: 3rem;}
.experience_dec{padding:6px 15px; border-radius:30px; background:#fff; color:#0C46FF; font-size: 14px;}
.experience h3{}
.experience_txt{display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 20px; text-align: center; color:#fff;}
.experience_txt button{display: flex; align-items: center; justify-content: center; gap: 10px; width:220px; padding:20px; color:#fff; font-size:2rem; font-weight:700; border-radius: 1.4rem; }
.experience_txt button:nth-child(1){    background: linear-gradient(to right, #144DF4, #6524FE); border:1px solid #C8D8FF;}
.experience_txt button:nth-child(2){color:var(--main-color); background: #fff; border:1px solid var(--main-color);}
.ft_btn{display: flex; gap: 10px;}

/*서비스소개*/
.sub_visual{position: relative;}
.sub_visual_inner {
    width:100%; margin:30px auto; max-width: 1440px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: center;
    height:500px; /* 추가로 height도 필요할 수 있음 */
    background:#000;
    border-radius: 3rem;
}

.visual_sec{padding:80px 0; text-align: center;}
.sub_visual_con{height: 100%; background: url(../images/sub_visual_txt.png) no-repeat center center; background-size:70%; }
.sub_visual_con_m{display: none; }

/*faq*/
.faq-tabs { margin-top: 15px; margin-bottom: 100px;}
.faq-tab-buttons { display: flex;  gap: 8px; overflow-x: auto;padding-bottom: 4px; margin-bottom:10px;}
.faq-tab-btn {flex: 0 0 auto; white-space: nowrap; padding:10px 30px;margin-bottom: 6px; cursor: pointer;background: #F4F6F8;color:#76787E; border: none;border-bottom: 2px solid transparent; font-size:2rem;border-radius: 30px;}
.faq-tab-btn.active {font-weight: bold;color:var(--main-color); }
.faq-tab-content {display: none;}
.faq-tab-content.active {display: block;}

.ac_area{padding:0;}
.accordion {width: 100%;}
.accordion-item {padding: 0; text-align: left; margin-bottom:-1px; background: #fff; border-radius:0.75rem; }
.accordion-header {display: flex; align-items: center; justify-content: space-between; width: 100%; padding:10px 0;
    border-top: 1px solid #E7EAF0;
    border-bottom: 1px solid #E7EAF0;
    text-align: left; font-size: 1.8rem; line-height:2.2;}
.accordion-header .num{display: inline-block; width:30px; height:30px; margin:0 6px 0 -40px; color:#fff; line-height: 33px; text-align: center; font-size: 1.8rem; border-radius:10px; background: #0a0a0a;}
.accordion-header .arrow {flex-shrink: 0; width:18px; height:18px; -webkit-transform: rotate(0deg); transform: rotate(0deg); transition: all 0.2s ease-in-out;}
.accordion-header .arrow img{width:100%;  -webkit-transform: rotate(0deg); transform: rotate(0deg); transition: all 0.2s ease-in-out; }
.accordion-header .arrow.rotated img{ font-size: 22px; color: var(--main-color); -webkit-transform: rotate(90deg); transform: rotate(90deg); transition: all 0.2s ease-in-out; }
.aco_tit{padding-left:50px ; padding-right:40px; background: url(../images/icon_q.png) no-repeat left top; background-size:40px;}
.aco_con{padding-left:50px ; padding-right:40px; background: url(../images/icon_a.png) no-repeat left top; background-size:40px;}
.accordion-content {display: none; padding:15px 14px 15px; margin-top:-1px;  text-align: left; border-bottom-left-radius:0.75rem;  border-bottom-right-radius: 0.75rem;  background: #f8f8f8; font-size: 1.8rem; line-height:2.2;}
.accordion-item .active { display: block; }

/*공지사항*/
.notice-wrapper{}
.notice-item{padding: 15px 20px; border-radius: 10px;  margin-bottom: 4px;}
.notice-item p{font-size: 1.7rem;}
.notice-view-wrapper{padding-top:100px;}
footer .footer-links {margin: 12px 0;font-size: 14px;}
.notice-wrapper {display: flex; flex-direction: column; gap:0;}
.notice-wrapper .notice-item { display: flex;  flex-direction: column; gap: 5px; padding:30px; cursor: pointer;}
.notice-wrapper p {cursor: pointer; font-size:2.2rem; font-weight: bold;}
.notice-wrapper p:last-child{color:var(--gray700); font-weight: normal; font-size: 1.9rem;}
.notice-pagination-wrapper {display: flex; justify-content: center; align-items: center;  gap: 16px;  padding:50px 0 100px;}
.notice-pagination-wrapper .notice-pagination {display: flex; align-items: center; justify-content: center;  cursor: pointer;}
.notice-pagination li {display: flex;  align-items:center; justify-content: center; min-width: 36px; height: 36px; font-size: 1.2rem;  line-height: 100%; cursor: pointer;}
.notice-pagination .active { background-color: #1a1a1a; color: #fff;  border-radius: 50%; }
.notice-pagination-wrapper button {cursor: pointer; width: 24px; display: flex; align-items: center; justify-content: center; }
.notice-pagination-wrapper i{cursor: pointer; font-size: 2.4rem; display: flex;  align-items: center; justify-content: center;  }
.notice-view-title{cursor: pointer;  font-size: 2.4rem; font-weight: bold; margin-bottom: 5px;}
.notice-view-date{font-size: 1.9rem;  margin-bottom: 5px;}
.notice-view-body{font-size: 1.6rem; line-height: 2.4rem; padding: 20px 0;}
.notice-view-footer { display: flex; flex-direction: row; justify-content: space-between;  box-sizing: border-box; padding:30px 0 100px;}
.notice-view-footer button {font-size: 1.4rem; padding: 16px 24px; border-radius: 12px; background-color: #eeeeee;  font-weight: bold; cursor: pointer;}
.arrow-icon{display: none; width:30px;}
.arrow-icon img{width:100%;}

.pagenation_area_squar{position: relative; width:100%; height:30px; vertical-align: top; margin:10px 0 0; display: inline-block;}
.pagenation_squar {width:400px; height:34px; text-align:center; margin: 0 auto; padding-right: -100px;}
.pagenation_squar ul.list_page li {display:inline-block; margin: 0 0.15em; }
.pagenation_squar ul.list_page li:first-child{margin-left:0;}
.pagenation_squar ul.list_page li a{display: block; padding:0 0.5em; line-height: 2.4em; text-decoration:none; color:#333333; font-size:14px;}
.pagenation_squar ul.list_page li a.active{color:#285cdc; font-weight:800;}
.pagenation_squar ul.list_page li a.btn_tb_back{padding:0 ;}
.pagenation_squar ul.list_page li a.btn_tb_next{padding:0 ;}

/*팝업 데모*/
.pop_wrap {
    position: relative;
    width: 100%;
    height: 100vh;
    padding: 32px 24px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.pop_close {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 28px;
    height: 28px;
    border: none;
    background: none;
    cursor: pointer;
    background: url(../images/icon_x.svg) no-repeat; background-size: 100%;
}
.pop_visual_logo{width:160px; margin-bottom: 20px;}
.pop_visual_logo img{width:100%;}
.pop_close{width:25px;}
.pop_close img{width:100%;}
.pop_card {width: 100%;  text-align: center; font-size: 1.8rem;}
.pop_card .step { display: inline-block;  padding: 4px 10px;  font-size: 12px;  color: #2563eb; background: #eaf0ff;border-radius: 999px;margin-bottom: 16px;}
.pop_card h1 {margin: 0;font-size:3rem; font-weight: 700; color: #111;}
.pop_card .sub { margin-top: 8px; font-size: 1.8rem; color: #444;}
.pop_card .img { margin:0;}
.pop_card .img img { width:300px;}
.pop_card .title {font-size:2.2rem; font-weight: 600;margin-bottom: 6px;}
.pop_card .desc {padding:20px 0; font-size: 1.6rem;}
.pop_card .btn { width:100%; height:48px; border-radius:10px; border:none; background:#3b5cff; color:#fff; font-size:16px; font-weight:600; cursor:pointer; }

.pop_card .panel { margin:50px auto; width:100%; max-width:700px; border-radius:28px; overflow:hidden; border:1px solid #e6eaf2; display:flex; box-shadow:0 20px 40px rgba(0,0,0,0.06); }
.pop_card .left { flex:1.5; padding:48px 40px; background:#0b5cff; color:#fff; display:flex; flex-direction:column; justify-content:space-between; text-align:left; }
.pop_card .left .tip { font-size:13px; opacity:.9; }
.pop_card .left .title { margin-top:12px; font-size:34px; font-weight:800; line-height:1.25; }
.pop_card .left .desc { font-size:14px; line-height:1.6; opacity:.9; }
.pop_card .right { flex:2; padding:30px; background:#fff; }
.pop_card .field { margin-bottom:18px; text-align:left; }
.pop_card .field label { display:block; font-size:14px; margin-bottom:6px; }
.pop_card .field input { width:100%; height:46px; padding:0 14px; border-radius:10px; border:1px solid #dfe3eb; font-size:15px; }
.pop_card .btn { width:200px; height:52px; border-radius:12px; border:none; font-size:16px; font-weight:700; cursor:pointer; }
.pop_card .btn.primary { width:100%;  margin-top: 12px; background: linear-gradient(180deg, #2f6bff, #0b5cff);color: #fff;}
.pop_card .btn.dark {width:100%; margin-top: 12px; background: #000;color: #fff;}

/*login*/
.login_content_area{display: flex; height: 100vh; align-items: center; justify-content: center;}
.login_box{display: flex; justify-content: center;  }
.login_content_area .login_user_box{width:350px;}
.com_info{margin-top:120px; font-size: 1.5rem;}
.com_info .logo{width:140px;}
.com_info .logo img{width:100%;}
.copyright{position: absolute; bottom:10px; left: 50%; transform: translate(-50%, -50%); width:320px; text-align: center; color:#5f5f5f;}

.login_input_box{width:100%; margin-top:30px;}
.login_logo_tit{display: flex; justify-content: center; align-items: center; color:#000; font-weight:bold; font-size:30px; margin-bottom:10px; text-align: left;}
.login_logo_tit .tit_logo{width:200px;}
.login_logo_tit .tit_logo img{width:100%;}

.login_tit{text-align: center; font-weight: 800; font-size:2rem;}
.login_btn{width:100%;  font-weight:600; font-size: 1.4rem; height:50px; line-height: 50px; color:#fff; border:none; border-radius: 0.5rem; text-align: center; background:var(--main-color)}
.login_btn img{width:128px;}
.login_guide_txt{margin-top:30px; line-height:28px; text-align: center;}
.login_guide_txt a{font-size: 1.6rem; color:#000; border-bottom: 1px solid #000;}

.intro_ich_tb{margin:0 0 10px;}
.intro_ich_tb .tit{display: flex; justify-content: space-between; font-size:1.6rem; margin-top:10px; margin-bottom: 10px; }
.intro_ich_tb input{height: 50px; border-radius: 0.5rem;}

.error_txt{padding: 5px 10px; margin-bottom: 10px; font-size:1rem; line-height: 20px; border-radius: 3px; background:var(--error-bg); color:var(--error); }
.save_info_box{display: flex; align-items: center; justify-content: center; margin-top: 20px ; text-align: center;}
.login_select{margin:20px 0 0;}

.wel_code_box{padding:10px 0;}
.wel_code_box input{width:50px; height: 50px; margin: 0 2.5px; font-size: 20px; vertical-align: top; text-indent: 0; text-align: center; border:1px solid var(--gray500); background: #fff; }
.wel_code_box .tit{padding: 15px 0 8px;}
.login_pw{position: relative;}

.qr_txt_wrap{padding:30px 0; text-align: center;}
.qr_time_box .time{color:var(--main-color); font-size: 1.6rem;}
.qr_time_box .icon_check{padding:12px 0;  width:60px; margin: 0 auto; }
.qr_time_box .icon_check img{width:100%;}
.qr_time_box .txt01{font-size: 1.8rem; font-weight: 600;}
.qr_time_box .txt02{padding: 10px 0; font-size: 1.6rem;}

.qr_wrap{padding:50px 0; display: flex; align-items: center; justify-content: center;}
.qr_img{width:130px; }
.qr_img img{width:100%;}

.push_btn{width:100%; margin-bottom: 10px; font-weight:bold; height:50px; line-height: 50px; color:#fff; border:none; border-radius: 0.5rem; text-align: center; background:var(--main-color)}
.qr_btn{width:100%;  font-weight:bold; height:50px; line-height: 50px; color:#fff; border:none; border-radius: 0.5rem; text-align: center; background:var(--main-color)}
.push_btn:hover{text-decoration: underline;}
.qr_btn_line{width:100%;  font-weight:bold; height:50px; font-size: 1.6rem; line-height: 50px; color:var(--main-color); border:none; border-radius: 0.5rem; text-align: center; background:var(--main-light-color)}
.qr_btn_line:hover{text-decoration: underline; font-size: 1.6rem;}

/*회원가입*/
.join_header{width:650px; margin: 0 auto; text-align: center;}
.join_header .logo{width:200px; padding: 50px 0 0;  margin: 0 auto; }
.join_header .logo img{width:100%;}
.join_header_txt{font-size:2rem; padding:10px 0 30px;  font-weight: 800;}
.join_inner{width:650px; margin: 0 auto; padding: 0 0 150px;}
.join_tit_wrap{padding:10px 0; margin:0 0 20px; font-size: 1.6rem; font-weight: 600; }
.join_input_wrap{padding: 0 0 0;}
.join_input_wrap .listbox_wrap{margin-bottom: 15px;}
.input_btn_add_wrap{margin-top: 10px;}
.input_txt_wrap{margin-top: 10px;}
.input_btn_add_wrap button{height: 40px;}
.input_btn_add_wrap button:hover{text-decoration: underline;}
.agree_tit_wrap{padding:30px 0 20px; font-size:1.8rem; text-align: center; }
.agree_list_wrap{padding: 20px; border-radius: 0.75rem; background: var(--gray000); }
.input_field_wrap label, .listbox_wrap label {font-size:1.6rem; font-weight:600; }
.join_pw{position: relative;}
.eyes{position: absolute; top: 36px;  bottom: 0;  right: 10px;  margin: auto 2px; height: 30px; font-size: 22px;  cursor: pointer;}
.join_name_box{display: flex;  gap: 20px;}
.join_name_box .listbox_wrap {width: calc(50% - 10px);box-sizing: border-box; }
.chkbox_item.chkbox_all {font-size:1.6rem;font-weight:700;padding-bottom:0.8rem;border-bottom:1px solid var(--gray600);}
.chkbox_wrap li{font-size: 1.6rem;}
.btn_agree_wrap{width:100%; margin:40px 0; display: flex; justify-content: center;}
.btn_agree_wrap button{padding:4px 25px; border-radius: 0.75rem;}
.btn_agree_wrap button:hover{text-decoration: underline;}
.join_login_box{width:100%; padding:20px 0; font-size: 1.6rem; display: flex; justify-content: center; background: var(--main-light-color);}
.join_login_txt{margin-left: 10px; color:var(--main-color); font-weight: bold;  border-bottom: 1px solid var(--main-color);}

/*error*/
.error_icon{width:60px; height:60px; margin: 0 auto 20px;}
.error_icon img{width:100%;}
.error_tit{font-size: 1.5rem; font-weight:700; text-align: center; padding: 0 0 30px;}
.error_txt_box{padding:20px; font-size:14px; border-radius: 1.4rem; text-align: center; margin-bottom:20px; background: var(--main-light-color);}
.error_txt_box span{display: block; margin-bottom:8px;}

/*버튼*/
.btn_blu{font-size: 1.6rem; line-height: 40px; color:#fff;  border:none; background: var(--main-color);}

/* =========================반응형 스타일========================= */
@media (max-width: 1439px) {
    /* 헤로 섹션에서 이미지와 텍스트가 세로 배치 */
    .hero-inner {flex-direction: column; text-align: center;}
    .hero-text, .hero-image {flex: none;width: 100%;}
    /* 공지사항 */
    .notice-view-wrapper {padding-top:100px;}
    .container {max-width: 100%; margin: 0 auto; }
    main{padding:0; margin: auto;}
    main.submain{padding: 0 30px; max-width: 100%; margin: auto;}
    main.submain_about{padding: 0 0; max-width: 100%; margin: auto;}
    .main_visual{padding:0 30px;}
    .sub_visual {padding:0 30px;}
    .services{padding:60px 30px;}
    .features{padding:60px 30px;}
    .points{padding:60px 30px;}
    .application{padding:60px 30px;}
    .skill{padding:60px 30px;}
    .process{padding:60px 30px;}
    .experience{padding:60px 30px;}
    .contact-us{padding:0 3rem;}
    .main_visual_txt_wrap{position: absolute; left:80px; top:20%;}

}

@media (min-width: 840px) and (max-width: 1024px) {
    /* 공통 폰트 사이즈 조정 */
    h1 { font-size: 3.5rem; line-height: 1.2; }
    h2 { font-size: 3.2rem; }
    h3 { font-size: 2.8rem; }

    .container { padding: 0 40px; }


    /* 헤더/네비게이션 */
    .main_menu { gap: 30px; } /* 메뉴 간격 축소 */
    .main_nav ul li a { font-size: 1.6rem; }
    .header_inner .logo a { width: 130px; }

    /* 비주얼 섹션 */
    .main_visual_txt_wrap { left: 50px; top: 25%; }
    .main_visual_txt h1 { width: 400px; }
    .main_visual_con { background-size: 50%; } /* 배경 이미지 크기 조정 */
    .main_visual_con{position: relative; text-align: left; height:100vh; background: url(../images/visual_ani.png) no-repeat center bottom; background-size:70%; }

    /* 주요 기능 섹션 (4열 -> 2열 배치) */
    .features_item { width: calc(50% - 10px); height: auto; min-height: 200px; }

    /* 주요 적용 섹션 (3열 -> 세로 또는 유동적 배치) */
    .application_items { flex-direction: column; gap: 40px; }
    .application_item { width: 100%; }
    .application_card { padding: 25px; }

    /* 주요 사례 섹션 (2열 유지하되 너비 조정) */
    .application_case { width: calc(50% - 15px); }
    .application_case_box .tit h4 { font-size: 2.4rem; }

    /* 도입 절차 (일렬 배치 유지하되 폰트 및 간격 축소) */
    .process_item:not(:last-child)::after { right: -15%; font-size: 20px; }
    .process_icon_wrap { width: 100px; height: 100px; }
    .process_title { font-size: 1.6rem; }

    /* 기술력 테이블 (가로 스크롤 방지 및 폰트 축소) */
    .skill_state_tb { font-size: 1.4rem; }
    .skill .state_box { padding: 6px 15px 6px 40px; background-position: 12px center; }

    /* 체험 섹션 */
    .experience { height: 450px; }
    .experience h3 { font-size: 3rem; }

    /* 푸터 */
    body > footer .slogan h2 { font-size: 2.5rem; }
    body > footer .footer-bottom { flex-wrap: wrap; }
    body > footer .footer-contents { flex: 100%; margin-bottom: 2rem; }
    body > footer .footer-company-info-wrapper { border-left: none; padding-left: 0; }
}

@media (max-width: 839px) {
    h1 {font-size: 3rem;line-height: 3.6rem; }
    h2 {font-size: 2.8rem; line-height: 3.6rem;}
    h3 {font-size: 2.4rem; line-height: 3.2rem;}
    h4 { font-size: 1.6rem; line-height: 2rem;}

    /* 헤더: 햄버거 버튼 보이기, 네비게이션 숨기기/토글 */
    .hamburger {display: flex;}
    .main_nav {
        display: none; /* 기본 숨김 */
        position: absolute;
        top: 60px;
        right: 0;
        background: #fff;
        border-left: 1px solid #eee;
        border-bottom: 1px solid #eee;
        width: 200px;
        padding: 20px;
    }
    .main_nav.open {display: block; /* 햄버거 클릭 시 보임 */}
    .main_nav ul {flex-direction: column; gap: 10px;}
    .only-pc {display: none;}
    .only-mobile {display: block;}

    /*서브 헤드 영역*/
    .visual_sec{padding: 50px 0;}
    .visual_sec{margin:60px 0 0; }

    /* 메인 네비게이션 모바일 */
    header {position:fixed; top:0; width: 100%; z-index: 9999 !important; background: #fff; border-bottom: 1px solid #eee; height: 70px;}
    .header{padding: 0 ;}
    .main_nav {display: none;}
    .hamburger {display: block;  position: fixed;
        top: 20px;
        right: 20px;
        z-index: 100; }
    .mobile_menu { display: none; position: absolute; top:0; right: 0; padding-top:0; background: white; width:100%; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);z-index:50;}
    .mobile_menu.open {position: fixed; display: block; height: 100vh; }
    .header_inner .logo{position: absolute; left:20px;}
    .header_inner {position: relative; display: flex; padding: 0 20px; height:70px; align-items: center;  justify-content:end;}

    .mobile_menu_area{padding:0; height: 100vh;}
    .mobile_menu .accordion {width: 100%;}
    .mobile_menu .accordion-item {padding: 0; text-align: left; margin-bottom: 10px; background: #fff; border-radius:0.75rem; }
    .mobile_menu .accordion-header {display: flex; align-items: center; justify-content: space-between; width: 100%; padding:10px; margin-bottom:10px; background: #fff; border-radius:0.75rem;  text-align: left; font-size: 1.1rem;}
    .mobile_menu .accordion-header .num{display: inline-block; width:30px; height:30px; margin:0 6px 0 -40px; color:#fff; line-height: 33px; text-align: center; font-size: 14px; border-radius:10px; background: #0a0a0a;}
    .mobile_menu .accordion-header .arrow { width:30px; height: 30px; }
    .mobile_menu .accordion-header .arrow img{width:100%;  -webkit-transform: rotate(0deg); transform: rotate(0deg); transition: all 0.2s ease-in-out; }
    .mobile_menu .accordion-header .arrow.rotated img{ font-size: 22px; color: var(--main-color); -webkit-transform: rotate(90deg); transform: rotate(90deg); transition: all 0.2s ease-in-out; }
    .mobile_menu .aco_tit{font-size: 1.6rem; padding-left:0 ; background: url(../images/icon_q.png) no-repeat left center; background-size:30px ;}
    .mobile_menu .aco_con{padding-left:20px ; background: url(../images/icon_a.png) no-repeat left top; background-size:30px ;}
    .mobile_menu .accordion-content {display: none; padding:20px 0 20px; text-align: left; border-radius: 0.75rem;  background: #f8f8f8; }
    .mobile_menu .accordion-item .active { display: block; }
    .mobile_menu_list{padding:0; height:calc(100vh - 183px);  }
    .mobile_menu_list li{padding:0 0 30px;}
    .mobile_menu_list li:last-child{padding:0 0 0;}
    .mobile_menu_list li a{font-size: 1.6rem;}
    .mobile_menu .container {
        max-height: 80vh;
        overflow-y: auto;
    }
    .mobile_name_box{position: relative; padding:80px 30px 20px; background: var(--main-color);}
    .mobile_logo{width:200px;}
    .mobile_logo img{width:100%;}

    .mobile_main_menu_wrap{position: relative; padding:30px;}
    .mobile_nav_term{position: absolute; bottom:0; width:100%;}
    .mobile_nav_term ul{display: flex; justify-content: space-between; }
    .mobile_nav_term ul li{width:50%; text-align: center;}

    .header_inner .free_btn{position:static; }

    /* 메뉴 열림 상태 (X로 바뀜) */
    .hamburger.active span:nth-child(1) {transform: rotate(45deg) translate(5px, 6px);}
    .hamburger.active span:nth-child(2) {opacity: 0;}
    .hamburger.active span:nth-child(3) {transform: rotate(-45deg) translate(5px, -6px);}

    /* 푸터 */
    .btn_top {
        position: fixed;
        display: flex;
        align-items: center;
        justify-content: center;
        right: 20px;
        bottom: 20px;
        width:50px; height:50px;
        color: #fff;
        border-radius:50%;
        cursor: pointer;
        z-index: 50;
        background:var(--main-color);
    }
    .btn_top img{width:20px;}

    /* 비주얼 섹션 */
    .main_visual{position: relative; padding:0 30px;}
    .main_visual_inner {
        width:100%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        text-align: center;
        height:calc(100vh - 150px); /* 추가로 height도 필요할 수 있음 */
        margin: 60px auto 0;
    }
    .main_visual_con{position: relative; text-align: left; height:100vh; background: url(../images/visual_ani.png) no-repeat center bottom; background-size:80%; }
    .main_visual_txt_wrap{position: absolute;  left: 50%; transform: translateX(-50%); top:15vh; right:auto; width:300px; padding:0 0px;}
    .main_visual_logo{width:180px;}
    .main_visual_txt02{font-size:1.5rem; margin-top:10px;}
    .main_visual_txt h1 {width:250px; }
    .main_visual_txt h1 img{width:100%;}
    .main_visual_btn button{    display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        width: 220px;
        padding:15px;
        color: #fff;
        font-size: 1.4rem;
        font-weight: 700;
        border-radius: 1.4rem;}


    /*주요 서비스 섹션*/
    .services{padding:50px 30px;}
    .services .container{text-align: center;}
    .txt_green{color:var(--main-color);}
    .services_item_wrap{padding: 30px 0; font-size: 1.5rem; }
    .services_item_wrap .icon_fido{width:150px; margin: 0 auto 20px;}
    .services_item_wrap .icon_fido img{width:100%;}

    /*주요 기능 섹션*/
    .features{padding:50px 30px; background: linear-gradient(to bottom, #fff, #DDEAFF);}
    .features h3{margin-bottom:60px; }
    .features .container{}
    .features_item_wrap{}
    .features_items{display: flex; gap:10px; justify-content: space-between; }
    .features_item{position: relative; display:flex; flex-direction: column; justify-content: space-between; width:calc(100% - 5px); height: auto; padding: 30px; border:1px solid var(--gray400); border-radius: 1.4rem; background: #fff;}
    .features_item .icon{position: absolute; left:auto; right:20px; top:20px; display: flex; align-items: center; justify-content: center; width:40px; height: 40px; border-radius: 1.4rem; }
    .features_item .icon img{width:70%;}
    .features_item .tit{padding-top:0px; padding-bottom:15px; text-align:left; font-size:1.8rem; line-height: 2rem;   font-weight:bold;}
    .features_item .con{font-size: 1.4rem; line-height: 2rem;}

    /*주요 필요 섹션*/
    .points h3{margin-bottom:60px; }
    .points_header{display: flex; align-items: end; justify-content: space-between; margin-bottom:0;}
    .points_card .tit{position: absolute; bottom:0; color:#fff; font-size: 1.6rem; font-weight: 600; padding: 30px;}
    .points_card .tit p{margin-bottom: 10px;}
    .points_card .tit h4{font-size:1.8rem; line-height: 2.4rem;}
    .points_card .icon{width:100%;}
    .points_card .icon img{width:100%;}
    .points_card{position: relative;}
    .points_card.bg01{width:100%; height: 400px; background: url(../images/icon_points01.jpeg) no-repeat center bottom; background-size: cover;}
    .points_card.bg02{width:100%; height: 400px; background: url(../images/icon_points02.jpeg) no-repeat center bottom; background-size: cover;}
    .points_card.bg03{width:100%; height: 400px; background: url(../images/icon_points03.jpeg) no-repeat center bottom; background-size: cover;}
    .points_card.bg04{width:100%; height: 400px; background: url(../images/icon_points04.jpeg) no-repeat center bottom; background-size: cover;}
    .points_card.bg05{width:100%; height: 400px; background: url(../images/icon_points05.jpeg) no-repeat center bottom; background-size: cover;}
    .points_card.bg06{width:100%; height: 400px; background: url(../images/icon_points06.jpeg) no-repeat center bottom; background-size: cover;}
    .points_card.bg07{width:100%; height: 400px; background: url(../images/icon_points07.jpeg) no-repeat center bottom; background-size: cover;}
    .points_card.bg08{width:100%; height: 400px; background: url(../images/icon_points08.jpeg) no-repeat center bottom; background-size: cover;}
    .points_card.bg09{width:100%; height: 400px; background: url(../images/icon_points09.jpeg) no-repeat center bottom; background-size: cover;}

    .swiper_page_arrow{display: none;}
    .swiper {width: 100%; max-width: 1440px; margin: 0 auto; overflow: hidden;}
    .swiper-slide {background: #f2f4f6;border-radius: 12px;  height: 180px; display: flex;  align-items: center;   justify-content: center;   font-size: 20px; font-weight: bold;}


    /*도입 절차*/
    .process{padding:50px 30px;}
    .process_box {  padding: 50px 20px; font-family: 'Pretendard', sans-serif; max-width: 1440px;  margin: 0 auto;}
    .process_list{display:flex; flex-direction: column; gap:10px;}
    .process_item {  position: relative;  flex: 1;  text-align: center; padding: 20px 0; border-radius: 20px; border:1px solid #cfcfcf;}
    .process_icon_wrap {
        width: 50px;
        height: 50px;
        background-color: var(--main-light-color);
        border-radius: 35%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 20px;
        /*box-shadow: 0 10px 20px rgba(0, 98, 223, 0.2);*/
    }
    .process_icon {width:40px;}
    .process_icon img{width:100%;}
    .process_item:not(:last-child)::after {display: none;}
    .process_title {  font-size:1.8rem;  font-weight: 700;  margin-bottom:6px;}
    .process_step {  font-weight: 800;  color:var(--main-color);  font-size:1.4rem; margin-bottom:16px;}


    /*주요 적용 섹션*/
    .application{padding: 50px 30px;  }
    .application h3{margin-bottom:60px; }
    .application_items{display: flex; gap:80px; align-items: center; justify-content: space-between;}
    .application_item{position: relative; display:flex; flex-direction: column; gap:20px; justify-content: space-between; flex:2;}
    .application_card{display: flex; width:100%; padding: 30px; border:1px solid #C3E9DD; border-radius: 3rem;}
    .application_card .tit{width:100%; color:#000; font-size: 2rem; font-weight: 600; }
    .application_card .tit h4{font-weight: bold; font-size: 2rem; line-height: 2.5rem; margin: 25px 0 15px;}
    .application_card .icon_wrap{display: flex;border-radius: 15px; margin-bottom: 10px; }
    .application_card .icon_wrap .icon_img img{width:90%;}
    .application_card .icon_wrap .icon_txt {height: 30px; padding: 5px 10px; color:#fff; font-size: 1.4rem; background: var(--main-color); }
    .application_card .list{font-size:1.6rem;}
    .application_card .list ul li{width:100%; padding: 10px 10px; margin:8px 0; font-size: 1.4rem; border-radius:6px; background: #fff;}

    .application_case_item_wrap{margin-top: 50px;}
    .application_case_item{display: flex; flex-direction: column; gap:20px; width: 100%;}
    .application_case{
        display: flex;
        flex-direction: column;
        width: calc(100% - 20px); /* 한 줄에 2개 */
        border: 1px solid #C3E9DD;
        border-radius: 3rem;
        background: #fff;
        box-sizing: border-box;
        flex: 2;
    }
    .application_case:nth-child(1){width:100%; padding: 30px; color:#000; background: linear-gradient(to bottom, #E8EDFF, #D3DAFF);}
    .application_case:nth-child(2){width:100%; padding: 30px; color:#000; background: linear-gradient(to bottom, #E8EDFF, #D3DAFF);}
    .application_case_box{display:flex; flex-direction: column; gap: 20px;}
    .application_case_box > div {width:100%;}
    .application_case_box .tit{}
    .application_case_box .tit h4{font-size: 2.2rem; line-height: 4rem; margin:20px 0 10px; font-weight: bold;}
    .application_case_box .list{font-size:1.6rem;}
    .application_case_box .list ul li{ padding: 10px 10px; margin:8px 0; border-radius:6px; color:#000; background: #fff;}

    .application_case_box .icon_wrap .icon_txt {width:50px; height: 30px; text-align: center; border-radius:6px; padding: 5px 10px; color:#fff; font-size: 1.4rem; background:#7387F6; }
    .application_case_box .icon_wrap:nth-child(2){height: 30px;}
    .application_case_box .tit h4:nth-child(2){margin:0 0 10px;}
    .application_card:nth-child(1) .icon_wrap .icon_img {display: flex; align-items: center; justify-content: center; width:50px; height:50px; background: #5CAFE9; border-radius: 15px; }
    .application_card:nth-child(2) .icon_wrap .icon_img {display: flex; align-items: center; justify-content: center; width:50px; height:50px; background: #6ED3E3; border-radius: 15px; }
    .application_card:nth-child(3) .icon_wrap .icon_img {display: flex; align-items: center; justify-content: center; width:50px; height:50px; background: #65CFA3; border-radius: 15px; }


    /*기술력*/
    .skill{padding: 50px 30px; }
    .skill_state_tb_wrap{width:100%; overflow-x: scroll; margin-top: 40px;  padding:0 0 20px; border:none; border-radius: 0;}
    .skill_state_tb{width:800px; font-size: 1.4rem; border:1px solid #cfcfcf;}
    .skill_state_tb tr th{padding: 10px 10px; color:#fff; background: #1a1a1a;}
    .skill_state_tb tr td{padding: 10px 10px; text-align: center; border-top:1px solid #cfcfcf;}
    .skill .state_box{display:inline-block; padding: 6px 20px 6px 50px; border-radius: 6px; background:#ECFDF5 url(../images/icon_check.png) no-repeat 20px center; background-size: 20px; color:#059669;}
    .skill .state_box02{display:inline-block; padding: 6px 20px 6px 20px; border-radius: 6px; background:#FEF2F2; color:#DC2626;}
    .skill .state_box03{display:inline-block; padding: 6px 20px 6px 20px; border-radius: 6px; background:#e4e4e4; color:#808080;}

    /*도입 절차*/
    .process_txt{text-align: center;}

    /*슬로건 및 로고*/
    .partners{padding:150px 30px;}
    .partners h3{margin-bottom: 60px;}
    .Partners_logosRow{display: flex; flex-direction: column; align-items: center; justify-content: center; gap:50px;}
    .Partners_logosRow img{height:26px;}

    /*체험*/
    .experience{padding: 50px 30px; height:500px;}
    .experience .container{padding: 50px 50px; height:auto; }
    .experience h3{margin-bottom:0; width:250px; line-height: 3.5rem;}
    .experience_txt{display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 20px; text-align: center; color:#fff;}
    .experience_txt p{font-size: 1.4rem;}
    .experience_txt button{display: flex; align-items: center; justify-content: center; gap: 10px; width:150px; padding:15px 25px; color:#fff; font-size:1.5rem; font-weight:700; border-radius: 1.4rem;  background: #000;}
    .experience_txt button .free_icon{width:30px; display: inline-block;}
    .experience_txt button .free_icon img{width:100%;}
    .ft_btn{display: flex; flex-direction: column; gap: 10px;}
    .experience_dec{font-size: 1.2rem; padding:6px 15px; border-radius:30px; }

    /*tab*/
    .faq-tabs { margin-top: 15px;}
    .faq-tab-buttons { display: flex;  gap: 8px; overflow-x: auto;padding-bottom: 4px; margin-bottom:10px;}
    .faq-tab-btn {flex: 0 0 auto; white-space: nowrap; padding: 8px 14px;margin-bottom: 6px; cursor: pointer;background: #F4F6F8;color:#76787E; border: none;border-bottom: 2px solid transparent;font-size: 1.4rem;border-radius: 30px;}
    .faq-tab-btn.active {font-weight: bold;color:var(--main-color); }
    .faq-tab-content {display: none;}
    .faq-tab-content.active {display: block;}
    .visual_text p{padding-top: 20px; font-size: 1.6rem;}
    /*faq*/
    .ac_area{padding:0;}
    .accordion {width: 100%;}
    .accordion-item {padding: 0; text-align: left; margin-bottom:-1px; background: #fff; border-radius:0.75rem; }
    .accordion-header {display: flex; align-items: center; justify-content: space-between; width: 100%; padding:10px 0;
        border-top: 1px solid #E7EAF0;
        border-bottom: 1px solid #E7EAF0;
        text-align: left; font-size: 1.4rem; line-height:1.4;}
    .accordion-header .num{display: inline-block; width:30px; height:30px; margin:0 6px 0 -40px; color:#fff; line-height: 33px; text-align: center; font-size: 14px; border-radius:10px; background: #0a0a0a;}
    .accordion-header .arrow {flex-shrink: 0; width:18px; height:18px; -webkit-transform: rotate(0deg); transform: rotate(0deg); transition: all 0.2s ease-in-out;}
    .accordion-header .arrow img{width:100%;  -webkit-transform: rotate(0deg); transform: rotate(0deg); transition: all 0.2s ease-in-out; }
    .accordion-header .arrow.rotated img{ font-size: 22px; color: var(--main-color); -webkit-transform: rotate(90deg); transform: rotate(90deg); transition: all 0.2s ease-in-out; }
    .aco_tit{padding-left:30px ; padding-right:20px; background: url(../images/icon_q.png) no-repeat left top; background-size:20px;}
    .aco_con{padding-left:30px ; padding-right:20px; background: url(../images/icon_a.png) no-repeat left top; background-size:20px;}
    .accordion-content {display: none; padding:15px 14px 15px; margin-top:-1px;  text-align: left; border-bottom-left-radius:0.75rem;  border-bottom-right-radius: 0.75rem;  background: #f8f8f8; font-size: 1.4rem; line-height: 1.4;}
    .accordion-item .active { display: block; }

    /*데모 팝업*/
    .pop_card h1 {margin: 0;font-size:2.5rem; font-weight: 700; color: #111;}
    .pop_card .sub { margin-top: 8px; font-size: 1.6rem; color: #444;}
    .pop_card .title {font-size:2rem; font-weight: 600;margin-bottom: 6px;}
    .pop_card .panel { margin:20px auto; width:100%; max-width:700px; border-radius:28px; overflow:hidden; border:1px solid #e6eaf2; display:flex;     flex-direction: column; box-shadow:0 20px 40px rgba(0,0,0,0.06); }
    .pop_card .left { flex:1.5; padding:20px 20px; background:#0b5cff; color:#fff; display:flex; flex-direction:column; justify-content:space-between; text-align:left; }
    .pop_card .left .title { margin-top:10px; font-size:20px; font-weight:800; line-height:1.25; }
    .pop_card .left .title br{display:none;}
    .pop_card .desc {padding:0;font-size: 1.6rem; }
    .pop_visual_logo{display: none;}
    .pop_card .left .desc { font-size:12px; line-height:1.6; opacity:.9; }
    .pop_card .left .tip { font-size:12px; opacity:.9; }
    .pop_card .right { flex:2; padding:20px; background:#fff; }
    .pop_card .btn {margin-top: 30px; width:200px; height:52px; border-radius:12px; border:none; font-size:16px; font-weight:700; cursor:pointer; }


    /*공지사항*/
    .notice-wrapper{}
    .notice-item{padding: 15px 20px; border-radius: 10px;  margin-bottom: 4px;}
    .notice-wrapper p {cursor: pointer; font-size:1.8rem; font-weight: bold;}
    .notice-wrapper p:last-child{color:var(--gray700); font-weight: normal; font-size: 1.5rem;}
    .notice-view-date{font-size: 1.5rem;  margin-bottom: 5px;}
    .notice-view-title{cursor: pointer;  font-size: 2rem; font-weight: bold; margin-bottom: 5px;}
    .notice-view-footer button {font-size: 1.4rem;padding: 15px 15px;border-radius: 12px;background-color: #eeeeee;font-weight: bold;cursor: pointer;}

    .join{padding: 0 30px;}
    .join_header{width:100%; margin: 0 auto; text-align: center;}
    .join_header .logo{width:150px; padding: 50px 0 0;  margin: 0 auto; }
    .join_header_txt{font-size:1.3rem; padding:10px 0 30px;  font-weight: 800;}
    .join_inner{width:100%; margin: 0 auto; padding: 0 0 150px;}
    .join_name_box{display:block;}
    .join_name_box .listbox_wrap {width: 100%;box-sizing: border-box; }
    .agree_tit_wrap{padding: 60px 0 0; font-size:1.1rem; text-align: left; padding:50px 0 20px;}
    .agree_tit_wrap br{display: none;}
    .chkbox_item {
        display: flex;
        gap: 10px;
        align-items: center;
        cursor: pointer;
        padding-right:1.5rem;
    }
    .chkbox_wrap.vertical li a span {
        display: block;
        width:10px;
        height:12px;
        padding: 0 0 0 20px;
        background:url(../images/icon_arrow_dwn.svg)no-repeat center center;
        background-size: 80%;
        transform: translateY(-50%) rotate(-90deg);
        /* transition: 0.3s; */
        flex-shrink: 0;
    }
    .intro_ich_tb .tit{display: flex; justify-content: space-between; font-size:1.6rem; margin-top:10px; margin-bottom: 10px; }
    .login_guide_txt a{font-size: 1.6rem; color:#000; border-bottom: 1px solid #000;}
    .login_content_area{width:100%;}
    .login_content_area{display:flex; flex-wrap: wrap; justify-content: center; align-items: center; background: #fff; }
    .login_content_area .login_user_box{padding: 0 30px;}
    .login_logo_tit .tit_logo{width:150px;}


    /*푸터*/
    body > footer h2 {padding:1rem 0; font-weight: 600; font-size: 3.5rem; line-height: 100%; color: #b0b0b0;}
    body > footer .footer-bottom {display: flex; flex-direction: column; margin-top: 0.5rem; padding: 0 16px;}
    .family-site-menu li a { display: block; font-size: 1.4rem;  padding: 16px; text-decoration: none;}
    body > footer .slogan h2 {font-weight: 500; font-size:2rem; color: #b0b0b0; line-height: 100%; display: flex; align-items: center;}
    body > footer .contact-us p{font-size: 2rem; line-height: 4rem;}
    body > footer .contact-us h2{font-size:1.8rem;line-height: 100%;}
    body > footer .contact-us h3{font-size:1.8rem;line-height: 100%;}
    body > footer .contact-us p:last-child {font-size:1.4rem;line-height: 100%; margin-top: 10px;}
    body > footer p {font-size: 1.2rem;line-height: 100%;}
    body > footer .footer-company-info-wrapper {border-left: none; padding: 1rem 0;  flex: 3.5; color: #b0b0b0;}
    body > footer .slogan {border-bottom:none; padding: 2rem 16px; display: flex; justify-content: space-between;  gap: 8px;}
    body > footer .term-link {border-bottom: 1px solid #4f4f4f;  border-top: 1px solid #4f4f4f; display: flex; justify-content: space-around; font-size:1.4rem; padding: 1rem 0; }
    .contact-us{padding:0 0;}

}


