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: 1280px; margin: 0 auto;} */
h1{font-size: 4.5rem;}
h2{font-size: 5rem;}
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 1280px로 제한 */
.container {max-width: 1280px; margin: 0 auto; }
main{padding:0; margin: auto;}

/* 헤더 영역 */
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:space-between}
.header_inner .logo{}
.header_inner .logo a{display: block; width:170px;}
.header_inner .logo img{width:100%;}     

/* 푸터 */
.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 {padding: 0 0 1rem; background: #232323;}
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: 5; color: #fff; padding: 0.5rem 1rem 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;}
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: 1px 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;
    }

/* 햄버거 버튼 */
.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: end;}
.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;}

/* 메인 네비게이션 */
.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 {
  padding-right: 30px; /* 텍스트 간 간격 */
  font-weight: bold;
  font-size: 1.6rem;
  color:#fff;
}

/* 슬라이딩 애니메이션 */
@keyframes scrollText {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

/*tab 기본*/
.tab-buttons { display: flex; justify-content: center;}
.tab-btn {cursor: pointer; }
.tab-btn.active {}
.tab-contents {margin-top:30px;}
.tab-content {display: none; }
.tab-content.active {display: block; }

/* 비주얼 섹션 */
.main_visual{position: relative;  background:var(--main-light-color);}
.main_visual_text {z-index: 2; color:#1a1a1a; padding: 100px 0;}
.main_visual_inner {
   width:90%; margin:0 auto; max-width: 1280px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  text-align: center;
  height:800px; /* 추가로 height도 필요할 수 있음 */
  
}
.main_visual_con{position: relative; text-align: left; height: 100%; background: url(../images/visual_ani.png) no-repeat 50px bottom; background-size:100%; }
.main_visual_txt_wrap{position: absolute; left:0; top:30%;}
.main_visual_icon{position: absolute; right:0; bottom:-10px; text-align: right;}
.main_visual_icon img{width:80%; }
.main_visual_txt{}
.main_visual_txt h1 {font-size:6rem; color:#1a1a1a; line-height: 6.5rem; font-weight: bold; }
.main_visual_txt02{margin-top: 20px; font-size:2rem; } 
.main_visual_logo_wrap{display: flex; align-items:center;}
.main_visual_logo{width:250px;}
.main_visual_logo img{width:100%;}
.visual_text p{padding:20px 0 0; font-size: 1.8rem; line-height: 1.8;}
.main_visual_btn{display: flex; gap: 16px;}
.main_visual_btn button{display: flex; align-items: center;  gap: 10px; margin-top: 30px; color:#fff; border-radius: 40px; padding:15px 30px; font-size: 2rem; font-weight: 600; background: #1a1a1a;}
.main_visual_btn button .dw_logo{width:36px; display: inline-block;}
.main_visual_btn button .dw_logo img{width:100%;}

/*주요 서비스 섹션*/
.services{padding: 100px 0; background: #fff;}
.services .tit{display: flex; align-items: center; justify-content: center;}
.services .tit_s{text-align: center; margin-top:10px; font-size: 2rem;} 
.service_logo{width:780px; display: inline-block; vertical-align: top; }
.service_logo img{width:100%;}
.service_logo_m{display: none;}

.services_item_wrap{margin-top: 60px;}
.services_items{display: flex;  flex-wrap: wrap; justify-content: center;  gap:35px; margin-bottom:35px;}
.services_item{flex: 0 0 calc(33.333% - 35px);  padding: 30px; border-radius: 20px; border:1px solid #D9EAFF;}
.services_items .icon{width:90px; margin: 0 auto 20px;}
.services_items .icon img{width:100%;}
.services_items .tit{text-align: center; font-size: 2.1rem; line-height: 2.1;   font-weight:600;}
.services_items .con{text-align: center; font-size: 1.6rem; line-height: 1.5;   font-weight:normal;}

/*요금제 섹션*/
.tariff{padding: 100px 0; background:#E6F1FF;}
.tariff .tit{text-align: center;}
.tariff h3{margin-bottom:60px; color:var(--main-color);}
.tariff .container{}
.tariff_item_wrap{}
.tariff_items{display: flex; gap: 40px; justify-content: space-between;}
.tariff_item{position: relative; display:flex; flex-direction: column; justify-content: space-between; flex: 1; height: 290px; padding: 30px; border:1px solid #C3E9DD; border-radius: 1.4rem; background: #fff;}
.tariff_item .icon{position: absolute; right:30px; bottom:30px; display: flex; align-items: center; justify-content: center; width:70px; height:70px; border-radius: 1.4rem; background: var(--main-light-color);}
.tariff_item .icon img{width:100%;}
.tariff_item .tit{text-align:left; font-size: 2rem; line-height: 2.6rem;   font-weight:normal;}
.tariff_tab{width:900px; margin: 0 auto; }
.tariff_tab .tab-buttons { display: flex; justify-content: center; }
.tariff_tab .tab-btn {width:50%; padding:25px 0; font-size: 2.3rem; font-weight: 600;  border-bottom: 4px solid #BFDBFB; background:#E6F1FF; color:#BFDBFB; cursor: pointer; white-space: nowrap;}
.tariff_tab .tab-btn.active {color:#006FF4; border-color: #006ff4; }
.card_wrap{width:900px; margin: 0 auto; display: flex; gap: 20px;}
.card_box{position: relative; width:450px; padding:30px 30px 50px; text-align: center; border-radius: 20px;  background: #fff;}
.card_box .tit{font-size: 2.5rem; margin: 20px 0; font-weight: 600;}
.card_box .pay{font-size: 2.5rem; margin: 20px 0; font-weight: 600;}
.card_box .info_wrap{position: relative;  margin-top:20px;}
.card_box .info_tit{position: absolute; top:20px; left: 50%; transform: translate(-50%, -50%); font-size: 1.5rem;  padding:8px 0; min-width: 250px;  margin-bottom:10px; border-radius: 20px; color:#fff; background: #006ff4; }
.card_box .con_box{width:250px; margin: 0 auto;}
.card_box ul {display: inline-block; padding:40px  0 30px; border-radius: 20px; margin-top: 20px; }
.card_box ul li{width:250px; padding:10px 10px; text-align:left; border-bottom: 1px dotted #999;}
.card_box ul li i{margin-right: 10px;}
.best_icon{position: absolute; left: 30px; top:30px; width:80px; height: 80px; color: #fff; font-size: 18px; font-weight: bold;
  display: flex; align-items: center; justify-content: center; border-radius: 50%;; background: url(../images/icon_bset.png); background-size: 80px; }

/*후기 섹션*/
.review{padding: 100px 0; background: #F4F6F8;}
.review .tit{text-align: center;}
.review .tit br{display: none;}
.review .tit_s{text-align: center; margin:10px 0 50px; font-size: 2rem;}
.review_items{display: flex; gap:80px; align-items: center; justify-content: space-between;}
.review_item{position: relative; display:flex; flex-direction: column; gap:10px; justify-content: space-between; flex:2;}
.review-slider { position: relative; max-width:1100px; margin: auto; overflow: hidden; }
.slider-track { display: flex; transition: transform 0.5s ease; }
.slide { flex: 0 0 33.33%; box-sizing: border-box; padding: 8px; }
.review-card {
  border: 1px solid #e0e0e0; border-radius: 8px; padding:20px;
  background: #fff; font-family: 'Noto Sans KR', sans-serif;}
.review-header { display: flex; align-items: center; margin-bottom: 8px; }
.profile-image { width: 40px; height: 40px; border-radius: 50%; background: #ccc; margin-right: 8px; }
.profile-info .name { font-weight: bold; font-size: 1.6rem; color: #5d5d5d; }
.profile-info .desc { font-size: 1.3rem; color: #666; }
.stars { color: #f5b50a; font-size: 1.6rem; margin:8px 0; }
.review-text { font-size: 1.4rem; color: #333; line-height: 1.4; }
.controls { position: absolute; top: 50%; width: 100%; display: flex; justify-content: space-between; transform: translateY(-50%); }
.controls button {width:40px; }
.controls .prev{-webkit-transform: rotate(-180deg); transform: rotate(180deg);}
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0,0,0,0); overflow: hidden; }
.down_tit{margin-top: 50px; text-align: center; font-size:2.8rem; font-weight: 600;}

.down_btn_wrap{display: flex; justify-content: center; gap: 16px;}
.down_btn_wrap button{display: flex; align-items: center;  gap: 10px; margin-top: 30px; border:2px solid #000; border-radius: 6px; padding: 20px 30px; font-size: 2rem; font-weight: 600; background: #fff;}
.down_btn_wrap button .dw_logo{width:36px; display: inline-block;}
.down_btn_wrap button .dw_logo img{width:100%;}

/*1분 고객센터*/
.partners{padding:150px 0 0; background: #fff;}
.partners .tit{text-align: center;}
.partners .tit_s{text-align: center; margin-bottom: 50px;  font-size: 2rem;}
.customer_box{}
.customer_box .tab-buttons { display: flex; justify-content: center; gap: 15px;}
.customer_box .tab-btn {cursor: pointer; width:200px; border-radius: 50px; padding: 20px 30px; font-size: 1.8rem; font-weight: 500; border:1px solid #707070;}
.customer_box .tab-btn.active {background: #006FF4; border:1px solid #006FF4; color:#fff;}
.customer_box .tab-contents {margin-top:50px;}
.customer_box .tab-content {display: none; }
.customer_box .tab-content.active {display: block; }

/*faq*/
.faq-tabs {position: relative; margin-top: 15px; padding:0 0 150px;}
.faq-tab-buttons {display: flex;  gap: 8px; overflow-x: auto;padding-bottom: 4px; margin-bottom: 15px; background: #fff;}
.faq-tab-btn {flex: 0 0 auto;  padding:14px 30px;margin-bottom: 6px; cursor: pointer;background: #F4F6F8;color:#76787E; border: none;border-bottom: 2px solid transparent;font-size: 1.7rem;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;}
.more_btn_wrap{display: flex; justify-content: center; margin-top: 50px;}
#load-more-btn{font-size:1.6rem; border-radius: 50px; padding: 15px 50px; border:1px solid #000; background: #fff;}

.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:20px 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; font-size: 1.6rem;}
.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.6rem; line-height: 1.6;}
.accordion-item .active { display: block; }

/*소개*/
.experience{height:900px; background: #006FF4; /*background-image: linear-gradient(to bottom, #0F9F6E, #E6F6F1);*/}
.experience .container{padding:100px 0; height:900px; 
  background-image:url(../images/footer_ani.png); background-size:60%;
  background-position: center bottom;
  background-repeat: no-repeat;}
.experience h3{margin-bottom: 60px;}
.experience_txt{display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 20px; text-align: center; color:#fff;}
.experience_txt .tit_s{font-size: 2rem;}
.experience_txt .tit_s br:nth-of-type(2){display: none;}

.footer_logo_icon{width:190px;}
.footer_logo_icon img{width:100%;}

/*공지사항*/
.sub_visual_tit{padding: 100px 0; text-align: center;}
.notice-wrapper{padding:15px 0 0;}
.notice_wrap{position: relative; padding:0 0 200px; }
.notice-item{display: flex;  width: 100%; cursor: pointer; padding:30px; margin-top: -1px; text-align: left; border-top:1px solid #E7EAF0; border-bottom:1px solid #E7EAF0;}
.text-wrapper{width: 100%; display: flex;  justify-content: space-between;  font-size: 1.65rem; line-height: 2.3rem; font-weight:normal;}
.text-wrapper .cate_label{display: inline-block; text-align: center; padding-right: 20px; border-radius: 20px; font-size: 1.8rem; line-height:2.4rem; color:#000;font-weight: normal; }
.notice-title{font-size: 1.8rem; line-height:1.8;  display: flex; align-items: center;}

.text-wrapper p:nth-child(2){margin-top:4px; font-size: 1.8rem;}
.arrow-icon{width:30px;}
.arrow-icon img{width:100%;}
.notice-pagination-wrapper {display: flex; justify-content: center;align-items: center;gap: 16px; padding: 0; margin-top:80px;}
.notice-pagination-wrapper .notice-pagination {display: flex; gap: 8px; cursor: pointer;}
.notice-pagination-wrapper .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-wrapper .notice-pagination li.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;background: #fff;border:none;}
.notice-pagination-wrapper button i { font-size:20px!important;}
.notice-view-wrapper{padding:150px 30px 0;}
.notice-view-footer{padding:50px 30px 150px; display: flex; justify-content: space-between;}
.notice-view-footer button{background:#fff; color:#000; padding:10px; border-radius: 6px; border:1px solid #707070; font-size: 1.4rem;}
.notice-view-title-box{width: 100%; padding:15px; margin-top: -1px; text-align: left; border-top:1px solid #fff; border-bottom:1px solid #E7EAF0;}
.notice-view-title{font-size: 3rem; line-height:2.4; font-weight: 700;}
.notice-view-cate{margin:0 0 4px 0; font-size:1.7rem;}
.notice-view-date{padding:0 0 30px; font-size: 1.7rem; line-height: 1.7;}
.notice-view-body{padding:20px 0; font-size: 1.7rem; line-height: 1.7;}
.arrow-icon{display: none;}

.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 ;}

/*약관*/
.terms{padding: 100px 0;}
.terms .header_area .tit{font-size: 5rem; text-align: center;} 

/*개인정보처리방침 탭*/
.privacy_tab{margin-top: 50px;}
.privacy_tab .tab-buttons{display: flex; gap: 10px;}
.privacy_tab .tab-buttons button{padding:15px 40px; border-radius: 30px; font-size: 1.6rem; border:1px solid #000}
.privacy_tab .tab-buttons button.active{background: #000; color:#fff;}
.privacy_tab .tab-contents{margin-top: 0!important;}

/*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: 1279px) {
  /* 헤더: 햄버거 버튼 보이기, 네비게이션 숨기기/토글 */
  .hamburger {display: flex;}
  .hamburger span {display: block;width:26px;height: 3px; margin: 5px 0; background: #1a1a1a; transition: transform 0.4s ease, opacity 0.3s ease;}
  .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;}

  /*서브 헤드 영역*/
  .visual_sec{margin:0 0 30px; }

  /* 메인 네비게이션 모바일 */
  header {position:fixed; top:0; width: 100%; z-index: 60; 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:101; }
  .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:100;}
  .mobile_menu.mobile_open {position: fixed; display: block; height: 100vh; }
  .header_inner .logo{position: absolute; top:18px; left:20px;}
  .header_inner .logo a{display: block; width:130px;}
  .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:150px;} 
  .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; }

  .main_visual_inner {
   width:100%; margin:0 auto; max-width: 1280px; padding: 0 50px;
  display: flex;
  justify-content: space-between;
  text-align: center;
  height:800px; /* 추가로 height도 필요할 수 있음 */
 
}
  .main_visual_con{position: relative; text-align: left; height: 100%; background: url(../images/visual_ani.png) no-repeat 50px bottom; background-size:100%; }
  .main_visual_txt_wrap{position: absolute; left:0; top:30%;}
  .main_visual_icon{position: absolute; right:0; bottom:-10px; text-align: right;}
  .main_visual_icon img{width:70%; }

  /* 메뉴 열림 상태 (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);}

  /*주요 서비스 섹션*/
  .services_item_wrap{margin-top: 60px;}
  .services_items{display: flex;  flex-wrap: wrap; justify-content: center;  gap:35px; margin-bottom:35px; padding: 0 10px;}
  .services_item{flex: 0 0 calc(50% - 35px);  padding: 30px; border-radius: 20px; border:1px solid #D9EAFF;}
  .services_items .icon{width:90px; margin: 0 auto 20px;}
  .services_items .icon img{width:100%;}
  .services_items .tit{text-align: center; font-size: 2.1rem; line-height: 2.1;   font-weight:600;}
  .services_items .con{text-align: center; font-size: 1.6rem; line-height: 1.5;   font-weight:normal;}

  /*요금제 섹션*/
  .tariff_tab{width:100%; margin: 0 auto; padding: 0 100px;}
  .card_wrap{width:100%; margin: 0 auto; display: flex; gap: 20px;}
  .card_box{width:50%; padding:30px 0 50px; text-align: center; border-radius: 20px;  background: #fff;}


  /*faq*/
  .faq-tabs {position: relative; margin-top: 15px; padding:0 80px 100px;;}


  /*후기 섹션*/
  .controls {position: absolute;top: 50%;width: 100%;display: flex;justify-content: space-between;transform: translateY(-50%);padding: 0 50px;}
  .review-slider { position: relative; max-width:800px; margin: auto; overflow: hidden; }
  .slider-track { display: flex; transition: transform 0.5s ease; }
  .slide { flex: 0 0 50%; box-sizing: border-box; padding: 8px; }
  .review-card {
    border: 1px solid #e0e0e0; border-radius: 8px; padding:20px;
    background: #fff; font-family: 'Noto Sans KR', sans-serif;}

  /*공지사항*/
  .notice-wrapper{padding:15px 30px 0;}
  .notice_wrap{position: relative; }
  .notice-pagination-wrapper {position: absolute;  left: 50%; bottom:80px; transform: translateX(-50%); display: flex; justify-content: center;align-items: center;gap: 16px; padding: 0; margin-top: 30px;}

  
  /* 푸터 */
  .btn_top {
    position: fixed;
    display: flex;
    align-items: center;
    justify-content: center;
    right: 20px;
    bottom: 30px;
    width:50px; height:50px; 
    color: #fff;
    border-radius:50%;
    cursor: pointer;
    z-index: 50;
    background:var(--main-color);
  }
  .btn_top img{width:20px;}
}

@media (max-width: 1098px) {

  /* 비주얼 섹션 */
  .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:750px; /* 추가로 height도 필요할 수 있음 */
    background:var(--main-light-color);
    border-radius: 3rem;
    margin:70px auto 0;
  }
  .main_visual_con{position: static; display:flex; flex-direction: column; justify-content: space-between; align-items: center; text-align:center; height: 100%; background: url(../images/visual_ani.png) no-repeat 50px bottom; background-size:100%; }
  .main_visual_txt_wrap{position: static; /* absolute 해제 */ top: auto; left: auto;   width:450px; padding:80px 0 0;}
  .main_visual_txt h1 {font-size:4rem; line-height: 1.2; font-weight: bold; }
  .main_visual_txt02{margin-top:10px; font-size:1.6rem; } 

  .main_visual_btn{display: flex; justify-content: center; gap:8px; margin-top: 20px;}
  .main_visual_btn button{display: flex; justify-content: center; align-items: center;  gap:10px; margin-top:0; color:#fff; border-radius: 40px; padding:10px 20px; font-size: 1.5rem; font-weight: 600; background: #1a1a1a;}
  .main_visual_btn button .dw_logo{width:26px; display: inline-block;}
  .main_visual_btn button .dw_logo img{width:100%;}
  .main_visual_icon{position:static; right:0; bottom:-10px; text-align:center;}
  .main_visual_icon img{width:370px; margin-top:22px;}

  .service_logo{display:none;}
  .service_logo_m{display: block;}
  .service_logo_m img{width:380px;}

  .best_icon{position: absolute; left: 15px; top:15px; width:50px; height:50px; color: #fff; font-size: 18px; font-weight: bold;
  display: flex; align-items: center; justify-content: center; border-radius: 50%;; background: url(../images/icon_bset.png); background-size:50px; }

}  

@media (max-width: 768px) {
  h1 {font-size: 3rem; line-height:1.6; }
  h2 {font-size: 2.8rem; line-height: 1.6;}
  h3 {font-size: 2.5rem; line-height: 1.4; margin-bottom:10px;}
  h4 { font-size: 1.6rem; line-height: 2rem;}


  /* 비주얼 섹션 */
  .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:640px; /* 추가로 height도 필요할 수 있음 */
    background:var(--main-light-color);
    border-radius: 3rem;
    margin:70px auto 0;
  }
  .main_visual_con{position: static; display:flex; flex-direction: column; justify-content: space-between; align-items: center; text-align:center; height: 100%; background: url(../images/visual_ani.png) no-repeat 50px bottom; background-size:100%; }
  .main_visual_txt_wrap{position: static; /* absolute 해제 */ top: auto; left: auto;   width:300px; padding:80px 0 0;}
  .main_visual_txt h1 {font-size:3rem; line-height: 1.2; font-weight: bold; }
  .main_visual_txt02{margin-top:10px; font-size:1.4rem; } 

  .main_visual_btn{display: flex; gap:8px; margin-top: 20px;}
  .main_visual_btn button{display: flex; justify-content: center; align-items: center;  gap:10px; width:150px; margin-top:0; color:#fff; border-radius: 40px; padding:10px 0; font-size: 1.3rem; font-weight: 600; background: #1a1a1a;}
  .main_visual_btn button .dw_logo{width:26px; display: inline-block;}
  .main_visual_btn button .dw_logo img{width:100%;}
  .main_visual_icon{position:static; right:0; bottom:-10px; text-align:center;}
  .main_visual_icon img{width:280px; margin-top:22px;}



  /*주요 서비스 섹션*/
  .services{padding:80px 30px;}
  .services .container{display: block; }
  .services .tit_s{text-align: center; margin-top:10px; font-size: 1.6rem;} 
  .service_logo{display: none; }
  .service_logo_m{display: block; text-align: center;}
  .service_logo_m img{width:90%; }
  .services_items{display:flex; flex-direction: column; gap:20px; width:100%; margin:30px 0 0 0; padding: 0;}
  .services_item{ display: flex; flex-direction: column; flex-wrap: wrap; gap:15px;align-items: center;}
  .services_item .icon{width:50px; margin: 0;}
  .services_item .icon img{width:100%;}
  .services_item .tit{text-align: left; font-size:1.9rem; font-weight: 700; line-height: 2rem; }
  .services_items .con{text-align: center; font-size: 1.5rem; line-height: 1.5;   font-weight:normal;}
  .services_items .con br{display: none;}

  /*요금제 섹션*/
  .tariff{padding:80px 30px; background:#E6F1FF;}
  .tariff .tit{text-align: center;}
  .tariff h3{margin-bottom:40px; color:var(--main-color);}
  .tariff .container{}
  .tariff_item_wrap{}
  .tariff_items{display: flex; gap: 40px; justify-content: space-between;}
  .tariff_item{position: relative; display:flex; flex-direction: column; justify-content: space-between; flex: 1; height: 290px; padding: 30px; border:1px solid #C3E9DD; border-radius: 1.4rem; background: #fff;}
  .tariff_item .icon{position: absolute; right:30px; bottom:30px; display: flex; align-items: center; justify-content: center; width:70px; height:70px; border-radius: 1.4rem; background: var(--main-light-color);}
  .tariff_item .icon img{width:100%;}
  .tariff_item .tit{text-align:left; font-size: 2rem; line-height: 2.6rem;   font-weight:normal;}
  .tariff_tab{width:100%; margin: 0 auto; padding: 0; }
  .tariff_tab .tab-buttons { display: flex; justify-content: center; }
  .tariff_tab .tab-btn {width:50%; padding:15px 0; font-size: 1.7rem; font-weight: 600;  border-bottom: 4px solid #BFDBFB; background:#E6F1FF; color:#BFDBFB; cursor: pointer;}
  .tariff_tab .tab-btn.active {color:#006FF4; border-color: #006ff4; }

  .card_wrap{width:100%; margin: 0 auto; display: flex; flex-direction: column;  gap: 20px;}
  .card_box{width:100%; padding:30px 0 50px; text-align: center; border-radius: 20px;  background: #fff;}
  .card_box .tit{font-size: 2.2rem; margin: 20px 0; font-weight: 600;}
  .card_box .pay{font-size: 2.2rem; margin: 20px 0; font-weight: 600;}
  .card_box .info_wrap{position: relative;  margin-top:20px;}
  .card_box .info_tit{position: absolute; top:20px; left: 50%; transform: translate(-50%, -50%); font-size: 1.4rem;  padding:8px 0; min-width: 240px;  margin-bottom:10px; border-radius: 20px; color:#fff; background: #006ff4; }
  .card_box ul {display: inline-block; padding:40px 0 0; min-width:100%;  border-radius: 20px; margin-top: 20px; border:1px solid #fff; }
  .card_box ul li{padding: 4px 0; text-align: center; font-size: 1.5rem;}
  .card_box ul li i{margin-right: 5px;}
  .card_box .con_box{width:220px; margin: 0 auto;}

  /*후기 섹션*/
  .review{padding: 100px 0; background: #F4F6F8}
  .review .tit{text-align: center;}
  .review .tit br{display:block;}
  .review .tit_s{text-align: center; margin:10px 0 50px; font-size: 1.6rem; padding: 0 30px;}
  .review_item_wrap{padding: 0;}
  .review_items{display: flex; gap:0; align-items: center; justify-content: space-between; }
  .review_item{position: relative; width:100%; display:flex; flex-direction: column; gap:10px; justify-content: space-between; flex:2;}
  .review-slider { position: relative; width:100%;  margin: auto; overflow: hidden; padding: 0 40px;}
  .slider-track { display: flex;  transition: transform 0.5s ease; }
  .slide {width:240px; flex: 0 0 100%; box-sizing: border-box; padding:0; }
  .review-card {min-height: 240px; margin: 0 10px;  border: 1px solid #e0e0e0; border-radius: 8px; padding:20px; background: #fff; font-family: 'Noto Sans KR', sans-serif;}
  .review-header { display: flex; align-items: center; margin-bottom: 8px; }
  .profile-image { width: 40px; height: 40px; border-radius: 50%; background: #ccc; margin-right: 8px; }
  .profile-info .name { font-weight: bold; font-size: 1.6rem; }
  .profile-info .desc { font-size: 1.3rem; color: #666; }
  .stars { color: #f5b50a; font-size: 1.6rem; margin:8px 0; }
  .review-text {width:100%; font-size: 1.4rem; color: #333; line-height: 1.4; }


  .controls { position: absolute; top: 50%; width: 100%; display: flex; justify-content: space-between; transform: translateY(-50%); padding: 0 30px;}
  .controls button {width:40px; }
  .controls .prev{-webkit-transform: rotate(-180deg); transform: rotate(180deg);}
  .sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0,0,0,0); overflow: hidden; }
  .down_tit{margin-top: 50px; text-align: center; font-size:2.5rem; line-height: 1.4; font-weight: 600;}

  .down_btn_wrap{padding: 0 70px; display: flex; justify-content: center; gap:10px; flex-direction: column; margin-top:50px; }
  .down_btn_wrap button{display: flex; align-items: center; justify-content: center;  gap: 10px; margin-top:0; border:1px solid #000; border-radius: 6px; padding: 15px 20px; font-size: 1.7rem; font-weight: 600; background: #fff;}
  .down_btn_wrap button .dw_logo{width:25px; display: inline-block;}
  .down_btn_wrap button .dw_logo img{width:100%;}

  /*1분 고객센터*/
  .partners{padding:80px 0 0;}
  .partners .tit{text-align: center;}
  .partners .tit_s{text-align: center; margin-bottom: 50px;  font-size:1.6rem;}
  .customer_box{}
  .customer_box .tab-buttons { display: flex; justify-content: center; gap: 15px; padding:0 20px;}
  .customer_box .tab-btn {cursor: pointer; width:200px; border-radius: 50px; padding:15px 20px; font-size: 1.5rem; font-weight: 500; border:1px solid #707070;}
  .customer_box .tab-btn.active {background: #006FF4; border:1px solid #006FF4; color:#fff;}
  .customer_box .tab-contents {margin-top:30px;}
  .customer_box .tab-content {display: none; }
  .customer_box .tab-content.active {display: block; }

  /*공지사항*/
  .notice-wrapper{}
  .notice_wrap{position: relative;  }
  .notice-item{display: flex; flex-direction: column; padding: 15px 0; margin-bottom:0;}
  .notice-wrapper p {cursor: pointer; font-size:1.7rem; line-height: 1.4; font-weight: bold;}
  .notice-wrapper p:last-child{font-weight: normal; font-size: 1.4rem;}
  .notice-view-title{cursor: pointer;  font-size: 1.7rem; line-height: 1.4; font-weight: bold; margin-bottom: 5px;}
  .notice-view-footer button {font-size: 1.3rem;padding: 10px 15px;border-radius: 12px; background-color: #fff;font-weight: bold;cursor: pointer;}
  .text-wrapper{width: 100%; display: flex;  flex-direction: column;  justify-content: space-between;  font-size: 1.65rem; line-height: 2.3rem; font-weight:normal;}
  .notice-title{font-size: 1.7rem; line-height:1.7;  display: flex; flex-direction: column; align-items: flex-start;}
  .text-wrapper .cate_label{display: inline-block; text-align: center; padding-right: 20px; border-radius: 20px; font-size: 1.4rem; line-height:2.2; color:#000;font-weight: normal; }
  .notice-pagination-wrapper {position: absolute;  left: 50%; bottom:80px; transform: translateX(-50%); display: flex; justify-content: center;align-items: center;gap: 16px; padding: 0; margin-top: 30px;}
  .notice-view-wrapper{padding: 100px 30px;}
  .notice-view-footer{padding:50px 30px 50px; display: flex; justify-content: space-between;}
  .notice-view-cate{margin:0 0 4px 0; font-size:1.4rem;}
  .notice-view-date{font-size: 1.4rem;  margin-bottom: 5px; padding:0 0 10px;}
  .notice-view-body{padding:20px 0; font-size: 1.5rem; line-height: 1.4;}
  .sub_visual_tit{padding: 100px 0 30px; text-align: center;}
  .visual_text p{padding:20px 0 0; font-size: 1.5rem; line-height: 1.5;}

  /*faq*/
  .faq-tabs {position: relative; margin-top: 15px; padding:0 20px 150px;}
  .faq-tab-buttons {display: flex;  gap: 8px; overflow-x: auto;padding-bottom: 4px; margin-bottom: 15px; background: #fff;}
  .faq-tab-btn {flex: 0 0 auto;  padding:14px 30px;margin-bottom: 6px; cursor: pointer;background: #F4F6F8;color:#76787E; border: none;border-bottom: 2px solid transparent;font-size: 1.7rem;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;}
  .more_btn_wrap{display: flex; justify-content: center; margin-top: 50px;}
  #load-more-btn{font-size:1.5rem; border-radius: 50px; padding: 15px 40px; border:1px solid #000; background: #fff;}


  /*개인정보처리방침 탭*/
  .privacy_tab{margin-top:20px;}
  .privacy_tab .tab-buttons{display: flex; gap: 10px;}
  .privacy_tab .tab-buttons button{padding:12px 30px; border-radius: 30px; font-size: 1.6rem; border:1px solid #000}
  .privacy_tab .tab-buttons button.active{background: #000; color:#fff;}
  .privacy_tab .tab-contents{margin-top: 0!important;}




  /*푸터 애니*/
  .experience{height:600px; }
  .experience .container{padding:80px 0; height:600px;  background-size:100%;
    background-position: center bottom;
    background-repeat: no-repeat;}
  .experience h3{margin-bottom: 60px; width:250px; line-height: 3.5rem;}
  .experience_txt{padding: 0 20px;}
  .experience_txt .tit_s{font-size: 1.5rem;}
  .footer_logo_icon{width:120px;}
  .footer_logo_icon img{width:100%;}


  /*서비스소개*/
  .sub_visual{position: relative;  padding: 0 30px;}
  .sub_visual_inner {
    width:100%; margin:100px auto 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: center;
    height:400px; /* 추가로 height도 필요할 수 있음 */
    background:#000;
    border-radius: 3rem;
  }

  

  /*푸터*/
  body > footer .footer-bottom {display: flex; flex-direction: column; margin-top: 0.5rem;}
  .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 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%;}

}


