@charset "UTF-8";

/* --- 글로벌 --- */
/* 라인영역까지 박스사이징 */
*, *::before, *::after {box-sizing: border-box;}
button {background:none}
br.m {display:none;}
img.pc {display: block !important;}
img.mo {display: none !important;}


/* --- fuction 공통 정의 --- */

/* 1. 주요기능 폰트 정의 */
h1 {font-size: 64px; font-weight: 600; line-height: 140%; color: #333;}  
h2 {font-size: 48px; font-weight: 600; line-height: 140%; color: #333;}
h3 {font-size: 40px; font-weight: 600; line-height: 140%; color: #333;}
span.sub {font-size: 48px; font-weight: 300; line-height: 140%; color: #333;}
p.point {font-size: 24px; font-weight: 500; line-height: 140%; color: #1EC6DF;}
p.desc {font-size: 18px; font-weight: 400; line-height: 150%; color: #6B6B6B;}
p.tit {font-size: 20px; font-weight: 600; line-height: 150%; color: #333;}
p.des {font-size: 16px; font-weight: 400; line-height: 150%; color: #888;}

/* 2. 텍스트 정렬 스타일 */
.text-left {text-align: left !important;}

/* 3. 주요기능 태그 */
.function .area_function .title_wrap .title p.label.core {display: inline-block; width: auto; padding: 4px 8px; color: #00C3E0 ;background-color: #E1FBFF; border-radius: 8px;line-height: 140%;}
.function .area_function .title_wrap .title p.label.special {display: inline-block; width: auto; padding: 4px 8px; background-image: linear-gradient(90deg, #31DDFF, #1F98F0); background-color: #ebeff1; border-radius: 8px;line-height: 140%; -webkit-background-clip: text; background-clip: text;-webkit-text-fill-color: transparent; color: transparent;}
.function .area_function .title_wrap .title p.label.common {display: inline-block; width: auto; padding: 4px 8px; color: #9B9C9E ;background-color: #F5F6F8; border-radius: 8px;line-height: 140%;}
.function .area_function .title_wrap .title p.label.green {display: inline-block; width: auto; padding: 4px 8px; color: #0AC943 ;background-color: #E7FAEC; border-radius: 8px;line-height: 140%;}
.function .area_function .title_wrap .title p.label.purple {display: inline-block; width: auto; padding: 4px 8px; color: #C271F3 ;background-color: #F9F1FE; border-radius: 8px;line-height: 140%;}

/* 4. 주요기능:롤링배너 부분 */
.function .area_customer {display:flex; flex-direction:column; justify-content:center; align-items:center; padding:30px 0px 80px;}
.function .area_customer .marquee_container {overflow:hidden; width:100%; position:relative; height:50px;}
.function .area_customer .marquee_container .marquee_inner .wrap img { display: block; max-width: inherit;}
.function .area_customer .marquee_container .marquee_inner {width:200%; display:flex; position:absolute; top:0; animation:50s linear infinite; height:50px; gap:40px;}
.function .area_customer .marquee_container .marquee_inner {animation-name:marqueeToLeft; left:0;}
.function .area_customer .marquee_container .marquee_inner .wrap {display:flex; gap:70px;}

@keyframes marqueeToLeft {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* 5. 탭 및 버튼 스타일 */
.function .area_function .tab_content .tablink {display: none;}
.function .area_function .tab_content .tablink.active {display: block;}
.function .title_wrap .tab_default .tablink {font-size:18px; color:#9C9FA3; font-weight:600; padding:12px; letter-spacing:-1px; margin: 0 4px;}
.function .title_wrap .tab_default .tablink:first-child {margin-left: 0;}
.function .title_wrap .tab_default .tablink:last-child {margin-right: 0;}
.function .title_wrap .tab_default .tablink:hover,
.function .title_wrap .tab_default .tablink.active {color:#333; border-bottom:3px solid #333;}
.function .title_wrap {margin-bottom:44px;}
.function .btn_link {font-size:18px; color:#888;}
.function .btn_link img {position:relative; top:4px;}

/* 6.푸터 스타일 */
.function .content_foot { padding: 140px 0;margin: 0 auto; text-align: center; width: 100%; background:
    url("https://daouoffice.com/images/main_new/2025/function/img_footer_pc_01.png") no-repeat bottom center/cover,
    linear-gradient(to bottom right, #9ADFF8, #A8DEFF, #E8F5FF);
  /* 텍스트 색은 불투명하게 */
  color: #fff;
}


/* 7. 이벤트 배너 */
.event_bn {margin: 40px 0 50px;}
.event_bn .link_bn_pc {display: block; text-align: center;}
.event_bn .link_bn_pc img {width: 100%; max-width: 1240px; border-radius:10px;}
.event_bn .link_bn_mo {display: none;}


/* --- 개별 콘텐츠 시작 --- */
/* 주요기능 공통 */
.function img {max-width: 100%; height: auto; display: block;}
.function .btn_wrap_link img {max-width: none; width: auto; display: inline; max-height: 20px;}
.function .content_head {padding: 90px 0 140px 0; margin: 0 auto; text-align: center; width: 100%; max-width: 1200px;}
.function .content_head .title_wrap {display: flex; flex-direction: column; align-items: center; gap: 10px;}
.function .content_head .title_wrap .main_title {gap:2px;}
.function .content_head .btn_wrap {margin: 44px 0 0 !important;}
.function .area_intro {padding: 96px 0 60px 0; margin: 0 auto; text-align: center; width: 100%; max-width: 1200px;}
.function .area_intro .inner {display: flex; flex-direction: column; align-items: center; gap: 40px; width: 100%; max-width: 1200px;}
.function .area_intro .title_wrap {text-align: center; margin: 0;}
.function .area_intro .title_wrap h2 {margin-bottom: 16px;}
.function .area_intro .cont_wrap {display: flex; flex-direction: column; align-items: center; width: 100%; max-width: 1200px; border: 1px solid #DEDEE2; border-radius: 24px; overflow: hidden;}
.function .area_intro .cont_wrap .box_thumb {width: 100%;}
.function .area_intro .cont_wrap .box_cont .cont {display: flex; justify-content: center; gap: 32px; padding: 40px 48px 48px; margin: 0; list-style: none;}
.function .area_intro .cont_wrap .box_cont .cont li {max-width: 240px;}
.function .area_intro .cont_wrap .box_cont .cont li .listbox {display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 8px;}
.function .area_intro .cont_wrap .box_cont .cont li .listbox .tit {margin-bottom: 8px;}
.function .area_function {padding: 100px 0; margin: 0 auto; width: 100%; max-width: 1200px;}
.function .area_function .title_wrap .title p { display: block; width: 100%; margin: 0;}
.function .area_function .title_wrap .title {display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-bottom: 32px;}
.function .area_function .title_wrap { display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 32px;}
.function .area_function .title_wrap .title {flex: 0 0 100%;}
.function .area_function .title_wrap .tab_default {order: 2; display: flex;}
.function .area_function .title_wrap .btn_wrap_link {order: 3; margin-left: auto; align-self: center; vertical-align: middle;}
.function .area_review {padding: 100px 0; margin: 0 auto; width: 100%; display: flex; flex-direction: column; align-items: center; background-color: #F5F6F8 ;}
.function .area_review img {height: 24px; width: auto;}
.function .area_review .title {width: 100%; max-width: 1200px; margin: 0; text-align: left; }
.function .area_review .title h3 {font-size: 40px; font-weight: 600; line-height: 140%; color: #333; text-align: left;  margin-bottom: 12px;}
.function .area_review .title p {font-size: 24px; line-height: 140%; color: #666; margin-bottom: 40px; }
.function .area_category { padding: 100px 0 120px; margin: 0 auto; max-width: 1200px;}
.function .area_category .inner {display: flex; flex-wrap: nowrap; justify-content: space-between; gap: 24px;}
.function .area_category .inner .card_section {flex: 1 1 0; max-width: 588px; display: flex; flex-direction: column; border: 1px solid #DEDEE2; border-radius: 24px; overflow: hidden;}
.function .area_category .inner .card_section > img {display: block; width: 100%; object-fit: cover;}
.function .area_category .inner .card_section .content {padding: 24px 28px 32px;}
.function .area_category .inner .card_section .content p.desc { margin-bottom: 16px;}
.function .area_category .title {display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-bottom: 32px;}


/* 주요기능:경리관리 */
.function.payroll .area_review .review_inner{max-width: 1200px; position:relative; text-align:center; width:100%;}
.function.payroll .area_review .review_inner>.review_navigation{position:absolute; top:50%; transform:translateY(-50%);}
.function.payroll .area_review .review_inner>.review_navigation:first-of-type{left:0; margin-left:-60px;}
.function.payroll .area_review .review_inner>.review_navigation:last-of-type{right:0; margin-right:60px;}
.function.payroll .review_navigation button{display:inline-flex!important; align-items:center!important; justify-content:center!important; width:32px; height:32px; border-radius:50%; border:1px solid #EAECEF;background:#FFFFFF; cursor:pointer; padding:0;}
.function.payroll .review_navigation button::before{content:"";display:inline-block;width:10px; height:10px; border:2px solid #A0A3AA; border-left:0; border-bottom:0;}
.function.payroll .btn_prev::before{ transform:translateY(1px) rotate(-135deg)!important;}
.function.payroll .btn_next::before{transform: translateY(1px) rotate(45deg)!important;}


/* --- 소개페이지 --- */
/* 소개페이지 시작 */
.function.brandstory .content_head ,.visual_wrap {margin: 100px auto 140px; padding: 0;}
.function.brandstory .content_head img {border-radius: 32px;}
.function.brandstory .area_introduce {padding: 100px 0; margin: 0 auto; background-color: #39a7fe;}
.function.brandstory .area_introduce .inner {display: flex; flex-direction: row; justify-content: space-between; max-width: 1200px; align-items: center;}
.function.brandstory .area_introduce .title_wrap .title h2 {margin-bottom: 30px; font-weight: 500; color: #fff;}
.function.brandstory .area_introduce .title_wrap .title p {text-align: left; color: #fff;}
.function.brandstory .area_introduce .visual_wrap {margin: 0; max-width: 645px; width: 100%;}
.function.brandstory .area_scale {padding: 100px 0; margin: 0 auto;}
.function.brandstory .area_scale .inner {display: flex; flex-direction: column; gap: 24px; max-width: 1200px; margin: 0 auto; }
.function.brandstory .area_scale .inner .btn_contents {display: flex; flex-direction: row; justify-content: center; align-items: flex-start; gap: 24px; width: 100%;}
.function.brandstory .area_scale .inner .btn_contents .btn.cont {display: flex; flex-direction: column; width: 100%; max-width: 280px; font-size: 24px; font-weight: 600; text-decoration: none;}
.function.brandstory .area_scale .inner .btn_contents .btn.cont .btn_wrap,
.function.brandstory .area_scale .inner .btn_cont .btn.cont .btn_wrap .tablink {display:flex; flex-direction:column;}
.function.brandstory .area_scale .inner .btn_contents .btn.cont .btn_wrap {gap:20px; margin: 0;}
.function.brandstory .area_scale .inner .btn_contents .btn.cont .btn_wrap .tablink {display: flex; flex-direction: column; width: 100%; padding:36px 32px 38px 32px; border: 1px solid #DBDBDB; border-radius: 20px;  gap:8px; align-items:flex-start; text-align:left;}

.function.brandstory .area_scale .inner .btn_contents .btn.cont .btn_wrap .tablink:hover,
.function.brandstory .area_scale .inner .btn_contents .btn.cont .btn_wrap .tablink.active {background:linear-gradient(#ffffff, #ffffff) padding-box, linear-gradient(180.84deg, #7CF5FF 5.27%, #5DA9FF 91.1%, #FDE1FC 113.04%) border-box; border: 2px solid transparent; box-sizing:border-box;}
.function.brandstory .area_scale .inner .btn_contents .btn.cont .btn_wrap .tablink:not(.active) { border: 1px solid #DBDBDB;}

.function.brandstory .area_scale .inner .btn_contents .btn.cont .btn_wrap .tablink .btn_top {display: flex; flex-direction: row; align-items: center; gap:8px}
.function.brandstory .area_scale .inner .btn_contents .btn.cont .btn_wrap .tablink .btn_top .text-left {font-size: 24px; font-weight: 600; color: #333; line-height: 150%;}
.function.brandstory .area_scale .inner .btn_contents .btn.cont .btn_wrap .tablink .btn_sub {font-size: 18px; font-weight: 400; color: #6b6b6b; line-height: 150%;}
.function.brandstory .area_scale .inner .btn_contents .cont.wrap .tab .carousel .carousel_track img {max-height: 464px; height: 100%; width: 100%;}
.function.brandstory .main .area_detail{padding: 100px 0 !important;}
.function.brandstory .area_history {padding: 100px 0 180px !important; background-color: #f5f6f8;}
.function.brandstory .area_history h2 {margin-bottom: 56px; }
.function.brandstory .area_history .inner { max-width: none;}
.function.brandstory .area_function.white .feature_card .img_card img {width:100%;height:474px;object-fit:cover;display:block;}
.function.brandstory .area_function.white .feature_card .img_card {width:100%; max-width:338px; height:auto; object-fit:cover; display:block;}
.function.brandstory .area_function.white .feature_card .wrap_title {padding: 32px 0 32px 32px !important;}
.function.brandstory .area_function.white .feature_card {flex-direction: row !important;}

/* 아이콘 */
.function.brandstory .ic_conpany {width:32px; height:32px; background:url(../images/main_new/2025/ic_company.svg); display:inline-block; top:0px; position:relative;}
.function.brandstory .ic_conpany.s {background-position: -20px -21px;}
.function.brandstory .ic_conpany.m {background-position:-72px -20px;}
.function.brandstory .ic_conpany.l {background-position:-124px -20px;}

/* 기업 규모 텝 콘텐츠 */
.function.brandstory .cont.wrap .tab {display: none !important;}
.function.brandstory .cont.wrap .tab.active {display: block !important;}

/* — 캐러셀 — */
.function.brandstory .carousel {position: relative;}
.function.brandstory .carousel.track-wrapper {overflow: hidden !important; position: relative;}
.function.brandstory .carousel_slide {display: none !important;}
.function.brandstory .carousel_slide.active {display: block !important;}
.function.brandstory .area_scale .inner .cont.wrap { box-sizing: border-box;  width: 100%; height: auto; border: 1px solid #ddd; background-color: #F5F6F8 ; border-radius: 24px; position: relative; text-align: center; }
.function.brandstory .area_scale .inner .cont.wrap p {min-height: 94px;  margin-top: 40px; font-size: 32px; font-weight: 500; color: #333; line-height: 150%;}
.function.brandstory .area_scale .inner .cont.wrap .carousel.track-wrapper {height: 100%;}

/* 화살표 스타일 */
.function.brandstory .carousel_arrow.prev { left: 32px; } 
.function.brandstory .carousel_arrow.next { right: 32px; } 
.function.brandstory .carousel_arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; background: #fff; border: none; border-radius: 50px; box-shadow: 0 2px 6px rgba(0,0,0,0.1); cursor: pointer; z-index: 10; }
.function.brandstory .carousel_arrow::before { content: ''; display: block; width: 10px; height: 10px; border-top: 2px solid #333; border-right: 2px solid #333; margin: auto; }
.function.brandstory .carousel_arrow.prev::before { transform: rotate(-135deg); }
.function.brandstory .carousel_arrow.next::before { transform: rotate(45deg); }

.brandstory .area_detail {padding:40px 0 80px; margin:0 auto;}
.brandstory .area_detail .inner {max-width:1200px;}
.brandstory .area_detail .title_wrap .title {margin-bottom:32px;}
.brandstory .area_detail .box_cont .box_line {display:grid; grid-template-columns:repeat(3,1fr); width:100%; gap:24px; margin-top:24px;}
.brandstory .area_detail .box_cont .box_line .box {width:384px; box-sizing:border-box; cursor:pointer; background-color:#F5F6F8; border-radius:32px; border:2px solid transparent; transition:0.5s all;}
.brandstory .area_detail .box_cont .box_line .box .hover {display:none;}
.brandstory .area_detail .box_cont .box_line .box .title p {font-size: 24px;}
.brandstory .area_detail .box_cont .box_line .box .normal {margin:32px 0 0; display:flex; flex-direction:column; gap:30px;}
.brandstory .area_detail .box_cont .box_line .box .normal .txt {margin:0 40px;}
.brandstory .area_detail .box_cont .box_line .box .normal .img {text-align:center;}
.brandstory .area_detail .box_cont .box_line .box:hover .normal {display:none;}
.brandstory .area_detail .box_cont .box_line .box:hover .title p {color:#7CF5FF;}
.brandstory .area_detail .box_cont .box_line .box:hover {width:384px; background:linear-gradient(#222, #222) padding-box, linear-gradient(180.84deg, #7CF5FF 5.27%, #5DA9FF 91.1%, #FDE1FC 113.04%) border-box; border: 2px solid transparent; box-sizing:border-box; box-shadow: 0px 0px 12px 0px #2222234D;}
.brandstory .area_detail .box_cont .box_line .box:hover .hover {margin:32px 40px 0; display:flex; flex-direction:column;}
.brandstory .area_detail .box_cont .box_line .box:hover .hover a {padding:8px 0; width:100px; text-align:center; background:linear-gradient(#222, #222) padding-box, linear-gradient(180.84deg, #7CF5FF 5.27%, #5DA9FF 91.1%, #FDE1FC 113.04%) border-box;  border: 2px solid transparent; box-sizing:border-box; display:inline-block; border-radius:25px; color:#5FAEFF; margin-top:80px;}
.brandstory .area_detail .box_cont .box_line .box:hover a .link {font-size:18px; color:#5FAEFF;}
.brandstory .area_detail .box_cont .box_line .box:hover .hover .desc {margin-top:12px; line-height:180%; color:#fff;}
.brandstory .area_detail .box_cont .box_line .box:hover .hover .tit {color:#4EE4FF;}
.brandstory .area_detail .box_cont .box_line .tit {font-size:20px; font-weight:500; color:#333; display:flex;}
.brandstory .area_detail .box_cont .box_line .desc {font-size:18px; color:#888; margin-top:12px;}
.brandstory .area_detail .box_cont .box_line a {width:384px; box-sizing:border-box; cursor:pointer; background-color:#F5F6F8; border-radius:32px; border:2px solid transparent;}
.brandstory .area_detail .box_cont .box_line a:hover {background-color:#edeff1;}
.brandstory .area_detail .box_cont .box_line a .txt {margin:32px 40px 0;}
.brandstory .area_detail .box_cont .box_line a .img {display:flex; justify-content:flex-end; margin:40px 20px 0 0;}
.brandstory .area_detail .cont_wrap .link_gr {width:9px; height:13px; background:url(../images/ic_main.svg) -204px -69px; display:inline-block; margin-left:6px; position:relative; top:1px;}
.brandstory .area_price {padding:80px 0 140px; margin:0 auto; background:linear-gradient(to top, #DBF8FF, #FFF);}
.brandstory .area_price .inner {max-width:1200px;}
.brandstory .area_price .title_wrap .btn_wrap_link {display:flex; justify-content:flex-end;}
.brandstory .area_price .cont_wrap .info {text-align:left; font-size:16px; color:#868686;}
.brandstory .area_price .cont_wrap .box_cont {display:flex; gap:24px; flex-direction:row; margin-bottom:20px;}
.brandstory .area_price .cont_wrap .box_cont .box {display:flex; width:384px; flex-direction:column; box-sizing:border-box;}
.brandstory .area_price .cont_wrap .box_cont .box .box_main {padding:40px 40px 0; background-color:#fff; border: 2px solid #fff; transition: 0.5s all; border-radius:24px; box-shadow: 0px 0px 10px 0px #00000026;}
.brandstory .area_price .cont_wrap .box_cont .box .box_main .tit {font-size:24px; font-weight:500; margin-bottom:8px; color:#333;}
.brandstory .area_price .cont_wrap .box_cont .box .box_main .desc {font-size:16px; color:#6B6B6B;}
.brandstory .area_price .cont_wrap .box_cont .box .box_main .box_txt {border-bottom:1px solid #F0F0F0; padding-bottom:16px;}
.brandstory .area_price .cont_wrap .box_cont .box .box_main .box_num {color:#333; margin-top:24px;}
.brandstory .area_price .cont_wrap .box_cont .box .box_main .box_num .num {font-size:42px; font-weight:500; margin-right:2px;}
.brandstory .area_price .cont_wrap .box_cont .box .box_main .box_num .unit {font-size:36px; position:relative; top:-2px;}
.brandstory .area_price .cont_wrap .box_cont .box .box_main .box_num .mini {font-size:18px; margin-left:12px;}
.brandstory .area_price .cont_wrap .box_cont .box .box_main .price {font-size:20px; color:#2F2F2F;}  
.brandstory .area_price .cont_wrap .box_cont .box .box_desc {margin:32px 0 100px; gap:12px;  display:flex; flex-direction:column;}
.brandstory .area_price .cont_wrap .box_cont .box:last-child .box_desc {margin:32px 0 48px;}
.brandstory .area_price .cont_wrap .box_cont .box:last-child .box_desc div:last-child .tag {height:23px;}
.brandstory .area_price .cont_wrap .box_cont .box .box_desc div {display:flex; gap:8px;}
.brandstory .area_price .cont_wrap .box_cont .box .box_desc div .tag {color:#939697; display:inline-block; font-size:15px; padding:0px 8px; border-radius:6px; border:1.5px solid #939697;}
.brandstory .area_price .cont_wrap .box_cont .box .box_desc div .desc {color:#00A4CD;}
.brandstory .area_price .cont_wrap .box_cont .box:hover .box_main .tit,
.brandstory .area_price .cont_wrap .box_cont .box.active .box_main .tit {color:#00BEEE;}
.brandstory .area_price .cont_wrap .box_cont .box:hover .box_main,
.brandstory .area_price .cont_wrap .box_cont .box.active .box_main {cursor: pointer; background: linear-gradient(#fff, #fff) padding-box, linear-gradient(90deg, #02B6D7 0%, #9F1AFF 100%) border-box; border: 2px solid transparent;}
.brandstory .area_price .title_wrap .title .sub {font-size:24px; color:#00C3E0; margin-bottom:12px;}
.brandstory .area_price .cont_wrap .star {color:#00BEEE;}
.brandstory .btn_round_sub {display:inline-block; border-radius:35px; background-color:#F4F7F9; color:#555; font-size:20px; line-height:200%; font-weight:500; width:80%; height:54px; text-align:center;}
.brandstory .btn_round_sub:hover,
.brandstory .btn_round_sub.active,
.brandstory .box.active .btn_round_sub.active {color:#fff; background-color:#333;}
.brandstory .btn_general_sub {background-color:#262626; padding:16px 30px; border-radius:35px; color:#fff; font-size:20px;}
.brandstory .btn_general_sub:hover {background-color:#2e2e2e;}
.brandstory .btn_link {font-size:18px; color:#888;}
.brandstory .btn_link img {position:relative; top:4px;}


/* 소개페이지 끝 */


/* 여기서부터 서브 페이지 시작해주세요~ */

/* 주요기능(서브): 공통 */
.function .area_intro.sub .cont_wrap .box_cont .cont li {max-width: 290px;}
.function .area_function.gray {max-width:100%; background-color: #F5F6F8;}
.function .area_function.gray .inner {max-width: 1200px;}
.function .area_function.white {width: 100%; background-color: #fff;}
.function .area_function .feature_grid {display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: auto auto; gap: 24px; width: min(100%, 1200px); width: 100%; margin: 0 auto; box-sizing: border-box;}
.function .area_function .feature_grid h3 {font-size: 26px; font-weight: 600; color: #333; margin-bottom: 6px; text-align: left}.function .area_function .feature_card {position: relative; border:1px; color: #E8E8E9; border-radius: 24px; overflow: hidden; height: 440px;}
.function .area_function .feature_card {display: flex; flex-direction: column; border: 1px solid #E8E8E9; border-radius: 24px; overflow: hidden; height: auto; width: 100%}
/*.function .area_function .feature_card .wrap_title {flex: 1; padding: 32px; position: static; z-index: auto; height: auto; width: 100%; box-sizing: border-box;}*/
.function .area_function .feature_card .wrap_title {position: relative; padding: 40px; z-index: 2;}
.function .area_function .feature_card .wrap_title p {font-size: 18px; color: #686868; line-height: 1.6; margin-bottom: auto;}
.function .area_function .feature_card .img_card {width: 100%; height: auto; object-fit: cover; display: block;}
.function .area_function .feature_card.wide {grid-column: 1/-1; display: flex; flex-direction: row; border: 1px solid #E8E8E9; border-radius: 24px; overflow: hidden; width: 100%; min-height: 278px; height: auto;}
.function .area_function .feature_card.wide .wrap_title {flex: 1 1 40%; display: flex; flex-direction: column; position: static; padding: 40px; overflow: hidden; box-sizing: border-box;}
.function .area_function .feature_card.wide .wrap_title p {font-size: 18px; color: #686868; line-height: 1.6; margin:0; margin-top: auto;}
.function .area_function .feature_card.wide .img_card {flex: 1 1 60%; position: relative; display: flex; justify-content: flex-end; align-items: flex-end; overflow: hidden; box-sizing: border-box;}
.function .area_function .feature_card.wide .img_card img {max-width: 100%; max-height: 100%; object-fit: contain; position: absolute; bottom: 0; right: 0; width: auto; height: auto;}
.function .area_function.gray .feature_card, .function .area_function.gray .feature_card.wide {background-color: #fff;}
.function .area_function.white .feature_card, .function .area_function.white .feature_card.wide {background-color: #F5F6F8;}

.function .area_review_center {padding: 100px 0; width: 100%; margin: 0 auto; display: flex; flex-direction: column; align-items: center; background-color: #E8F5FF ;}
.function .review_inner_center {display: flex; align-items: center; justify-content: space-between; gap: 24px; max-width: 1200px; width: 100%; height: auto ;}
.function .area_review_center .title_center {width: 100%; margin: 0; align-items: center; text-align: center;}
.function .area_review_center .title_center h3 {font-size: 40px; font-weight: 600; line-height: 140%; color: #333;  margin-bottom: 12px; text-align: center}
.function .area_review_center .title_center p {font-size: 24px; line-height: 140%; color: #666; margin-bottom: 40px;}
.function .area_review_center .title_center img{margin: 0 auto; display: block; max-height: 24px; width: auto;}
.function .area_function .tab_content .tablink .box_thumb {text-align:center;}



/* 가격안내 페이지 */
.price .box_desc {font-size:14px; color:#888; margin-top:24px;}
.price .content_head .title_wrap .desc {color:#888; text-align:center;}
.price .area_calculator {padding:80px 0; background:linear-gradient(to top, #DBF8FF, #FFF);}
.price .area_calculator .view_pc .discount {width:106px; height:40px; display:inline-block; z-index:1; position:relative; top:30px; left:590px; background:url(../images/price/ic_price.svg) -130px -83px;}
.price .area_calculator .cont_wrap {position:relative; top:-50px;}
.price .area_calculator .box_price {background-color:#fff;}
.price .area_calculator .tb_price th.m1 {border-radius:16px 0 0 0;}
.price .area_calculator .tb_price th.m3 {border-radius:0 16px 0 0;}
.price .area_calculator .tb_price th {border-right:1px solid #eee;}
.price .area_calculator .tb_price tbody tr th:nth-child(2) {border-left:2px solid #00BEEE !important; border-top:2px solid #00beee !important; border-bottom:2px solid #00beee !important;}
.price .area_calculator .tb_price tbody tr th:nth-child(3) {border-right:2px solid #00BEEE !important; border-top:2px solid #00beee !important; border-bottom:2px solid #00beee !important;}
.price .area_comparison .label {background-color:#F5F6F8; padding:8px 0;}
.price .area_comparison .tb_price tbody th,
.price .area_comparison .tb_price tbody td {padding:10px 0px 10px 15px; text-align:center;}
.price .area_comparison .tb_price thead tr:first-child th:first-child {background-color:#F5F6F8; border-radius:16px 0 0 0;}
.price .area_comparison {padding:80px 0;}
.price .area_comparison thead th:nth-child(3),
.price .area_comparison .tb_price tbody th:nth-child(3),
.price .area_comparison tbody td:nth-child(3) {border-left:1px solid #eee;}
.price .area_comparison thead th:nth-child(3),
.price .area_comparison .tb_price tbody th,
.price .area_comparison .tb_price tbody td {border-right:1px solid #eee;}
.price .area_comparison .tb_price tbody tr th:last-child,
.price .area_comparison .tb_price tbody tr td:last-child {border:none;}

.price .tb_price {width:100%;}
.price .tb_price th.m1,
.price .tb_price th.m2,
.price .tb_price th.m3 {padding:12px; background:#333;}
.price .tb_price th.m3 {border-radius:0 16px 0 0;}
.price .tb_price th .titlebox {display:flex; flex-direction:column; margin-bottom:16px;}
.price .tb_price th .titlebox::after {content:""; width:100%; height:1px; background-color:#eee;}
.price .tb_price th .titlebox .tit {font-size:16px; font-weight:500; text-align:left;}
.price .tb_price th .titlebox .tit.purple {color:#885DFF;}
.price .tb_price th .titlebox .tit.mint {color:#00BEEE;}
.price .tb_price th .titlebox .desc {font-size:15px; text-align:left; color:#666; margin:8px 0 20px;} 
.price .tb_price th .pricebox {color:#333; text-align:left;}
.price .tb_price th .pricebox .price {font-size:34px; font-weight:600;} 
.price .tb_price th .pricebox .unit {font-size:30px; font-weight:600;} 
.price .tb_price th .pricebox .date {font-size:14px; margin-left:5px;} 
.price .tb_price th .infobox {font-size:16px; color:#888; display:flex; flex-direction:column; margin:12px 0 24px; gap:4px;}
.price .tb_price th .infobox.basic {font-size:16px; color:#888; display:flex; flex-direction:column; margin-bottom:48px;}
.price .tb_price th .infobox li {display: flex; justify-content: space-between;}
.price .tb_price th .infobox .title {text-align:left;}
.price .tb_price th .infobox .info {text-align:right;}
.price .tb_price th .detailbox {display:flex; font-size:15px; flex-direction:column; gap:4px; text-align:left; height:168px;}
.price .tb_price th .detailbox::before {content:""; width:100%; height:1px; background-color:#eee;}
.price .tb_price th .detailbox li {display:flex; justify-content:space-between;}
.price .tb_price th .detailbox li:first-child {margin-top:20px;}
.price .tb_price th .detailbox .title {color:#aaa; font-weight:600;}
.price .tb_price th .detailbox .info {color:#333; width:80%;}
.price .tb_price .name th .title {font-size:16px; font-weight:600; text-align:center;}
.price .tb_price .name th .title.mint {color:#00BEEE;}
.price .tb_price .name th .title.purple {color:#885DFF;}
.price .tb_price .name th .desc {color:#888; font-size:14px; text-align:center; margin-top:8px;}
.price .tb_price th .wrap_btn {margin-top:40px;}
.price .tb_price .btn_ghost {width:100%; padding:4px 44px; border:1px solid #eee; background-color:#fff; color:#999; font-weight:500; margin-bottom:8px; font-size:15px; line-height:250%; border-radius:45px;}
.price .tb_price .btn_ghost:hover {border:1px solid #ccc; color:#555;}
.price .tb_price .btn_general {width:100%; padding:4px 44px; background:#F4F7F9; color:#333; font-weight:500; font-size:15px; line-height:290%; border-radius:45px;}
.price .tb_price .btn_general:hover {background:#333; color:#fff;}
.price .tb_price tr.name th {padding:12px 0 12px 0;}
.price .tb_price thead th.m0 {background:transparent; border-width:0 0 1px 0;}
.price .tb_price th, .price .tb_price td {position:relative; box-sizing:border-box;}
.price .tb_price h3 {font-size:18px; color:#fff;}
.price .tb_price thead th.m2 .subtit {background-color:pink;}
.price .tb_price thead th.m2 .subtit, .price .tb_price thead th.m3 .subtit {top:-33px; border-radius:16px 16px 0 0;}
.price .tb_price thead th .subtit {display:block; position:absolute; left:0; height:32px; line-height:32px; font-size:14px; text-align:center; color:#fff;}
.price .tb_price tbody td {text-align:center;}
.price .tb_price tbody th, .price .tb_price tbody td {padding:25px 20px 30px;}
.price .tb_price th, .price .tb_price td {position:relative; box-sizing:border-box;}
.price .tb_price tbody tr:last-child th,
.price .tb_price tbody tr:last-child td {border-bottom:1px solid #eee !important;}

.price .title_wrap {text-align:left;}
.price .title_wrap h2 {text-align:left;}
.price .area_intro {padding:30px 0 60px 0;}
.price .area_advantage {padding:30px 0 0;}
.price .area_advantage .cont {display:flex; flex-direction:row; gap:24px; position:relative; top:-50px;}
.price .area_advantage .cont .box {width:100%; display:flex; flex-direction:column; justify-content:space-between; padding-top:30px; background-color:#eee; border-radius:16px;}
.price .area_advantage .cont .box:first-child {background-color:#E3F3FF;}
.price .area_advantage .cont .box .titlebox {display:flex; gap:10px; flex-direction:column; padding:0 0 24px 54px;}
.price .area_advantage .cont .box .tit {font-size:20px; font-weight:600; color:#333;}
.price .area_advantage .cont .box .desc {font-size:18px; font-weight:400; color:#888;}
.price .area_advantage .cont .box .img {display:flex; justify-content:center;}
.price .area_advantage .newbie {width:116px; height:40px; display:inline-block; z-index:1; position:relative; top:-18px; left:260px; background:url(../images/price/ic_price.svg) -290px -83px;}
.price .area_option {padding:80px 0 60px 0; background-color:#EFFBFE;}
.price .area_option .wrap {max-width:1280px; margin-bottom:80px;}
.price .area_option .wrap .title {font-size:24px; font-weight:600;}
.price .area_option .wrap .boxlist {display:flex; flex-direction:row; gap:24px; margin:24px 0;}
.price .area_option .wrap .boxlist .box {background-color:#fff; box-shadow:0px 2px 8px rgba(0, 0, 0, 0.02); border: 1px solid #f0f0f0;  width:100%; padding-top:30px; border-radius:16px;}
.price .area_option .wrap .boxlist .box .titlebox {padding:0 60px 24px;}
.price .area_option .wrap .boxlist .box .tit {font-size:20px; font-weight:600; color:#333;}
.price .area_option .wrap .boxlist .box .desc {font-size:18px; color:#888;}
.price .area_option .wrap .boxlist .box .img {display:flex; justify-content:center;}
.price .area_option .wrap .cardlist {gap:8px; margin-top:16px;}
.price .area_option .wrap .cardlist .box {background-color:#fff; margin-bottom:12px; box-shadow:0px 2px 8px rgba(0, 0, 0, 0.02); border: 1px solid #f0f0f0; width:100%; border-radius:16px; display:flex; flex-direction:row; justify-content: space-between; align-items:center;}
.price .area_option .wrap:nth-child(1) .cardlist .box:first-child,
.price .area_option .wrap:nth-child(2) .cardlist .box:first-child,
.price .area_option .wrap:nth-child(4) .cardlist .box  {flex-direction:column;}
.price .area_option .wrap:nth-child(2) .cardlist .box:first-child .titlebox,
.price .area_option .wrap:nth-child(4) .cardlist .box .titlebox {width:100%;}
.price .area_option .wrap:nth-child(2) .cardlist .box:first-child .titlebox::after,
.price .area_option .wrap:nth-child(4) .cardlist .box .titlebox::after {content:""; width:100%; height:1px; display:inline-block; background-color:#EEE;}
.price .area_option .wrap:nth-child(2) .cardlist .box .titlebox,
.price .area_option .wrap:nth-child(4) .cardlist .box .titlebox {padding:30px 50px 20px;}
.price .area_option .wrap .cardlist .box .titlebox {padding:30px 50px; }
.price .area_option .wrap .cardlist .box .titlebox .title {width:130px; display:inline-block; font-size:16px; color:#333; font-weight:600; margin-right:16px;}
.price .area_option .wrap .cardlist .box .titlebox .desc {font-size:14px; color:#888; display:inline-block;}
.price .area_option .wrap .cardlist .box .sub {font-size:16px; color:#333; font-weight:600; margin-right:50px;}
.price .area_option .wrap .cardlist .box .subbox {width:100%; padding:0 50px 30px;}
.price .area_option .wrap .cardlist .box .subbox li {display:flex; margin-bottom:8px; justify-content:space-between; color:#555;}
.price .area_option .wrap .cardlist .box .subbox li .desc {font-weight:500;}
.price .area_option .wrap .cardlist .box .titlebox .small {font-size:14px; color:#999;}
.price .area_option .wrap.education {align-items:center;}
.price .area_option .wrap.education .cardlist .box .titlebox {padding:0;}
.price .area_option .wrap.education .cardlist .box li {padding:30px 0 0;}
.price .area_option .wrap.education .cardlist .box .sub {margin-right:0;}
.price .area_comparison .tb_price tbody th .link {text-decoration: underline; font-size: 12px; color: #999; margin-left: 8px;line-height: 180%;}

.price .view_pc {display:block;}
.price .view_mo {display:none;}
.price .check {width:18px; height:18px; display:inline-block; background:url(../images/price/ic_price.svg);}
.price .check.mint {background-position: -38px -4px;}
.price .check.purple {background-position: -65px -4px;}
.price .area_option .ic_option {width:24px; height:24px; top:6px; margin-right:4px; position:relative; display:inline-block; background:url(../images/price/ic_price.svg);}
.price .area_option .ic_option.add {background-position:-4px -46px}
.price .area_option .ic_option.edu {background-position:-34px -46px;}
.price .area_option .ic_option.tree {background-position:-71px -46px;}
.price .area_option .ic_option.form {background-position:-106px -46px;}
.price .area_faq {padding:80px 0;}
.price .area_box {margin-top:80px; border-top:1px solid #333; border-bottom:1px solid #333;}
.price .box_qna {border-bottom:1px solid #eee; padding:24px 0;}
.price .box_qna:first-child {padding-top:40px;}
.price .box_qna:last-child {padding-bottom:40px;}
.price .box_qna[open] > .question .ic_detail {background:url(../images/ic_detail.svg) -20px 0 no-repeat;} /* details[open] > summary .화살표클래스*/
.price .box_qna .answer {margin:16px 0 20px;}
.price .box_qna .answer li {font-size:14px; color:#999; letter-spacing:-1px;}
.price .box_qna .answer li .link {font-weight:600; text-decoration:underline; color:#666; margin-top:8px;}
.price .question p {cursor:pointer; font-size:20px; font-weight:500; color:#333; letter-spacing:-1px; width:85%;}
.price .question .ic_detail {width:20px; height:20px; background:url(../images/ic_detail.svg) 0 0 no-repeat; cursor:pointer; display:inline-block; float:right; position:relative; top:-28px;}
.price .question::marker {content:''; display:none;}
.price .question::-webkit-details-marker {content:''; display:none;}

/* 필수확인자료 */
.contents_document .wrap_main {margin-bottom: 80px;}
.contents_document .content {padding-bottom: 100px;}
/*.contents_document .anchors {margin-top: 100px}*/
.contents_document .wrap_card,
.contents_document .bg_img_card .card_list_tit  {margin-top: 0}
.contents_document .wrap_card > div {padding-top: 100px;}
.contents_document .content_foot {padding: 140px 0; margin: 0 auto; text-align: center; width: 100%; background: url("https://daouoffice.com/images/main_new/2025/fuction/img_footer_pc_01.png") no-repeat bottom center/cover, linear-gradient(to bottom right, #9ADFF8, #A8DEFF, #E8F5FF); color: #fff;}
.contents_document .content_foot h2 {font-size: 48px; font-weight: 600; line-height: 140%; color: #333;}
.contents_document .content_foot h3 {font-size: 40px; font-weight: 600; line-height: 140%; color: #333;}
.contents_document .content_foot span.sub {font-size: 48px; font-weight: 300; line-height: 140%; color: #333;}


/* --- 반응형 --- */
@media (max-width: 959px) {
  /* 리사이징 공통 */
  /* 폰트 (퍼센트) */
  br {display: none;}
  h1{font-size:clamp(30px,calc(-4.08px+7.1vw),64px);}
  h2{font-size:clamp(28px,calc(7.96px+4.17vw),48px);}
  h3{font-size:40px;}
  /* 패딩 */
  .inner {padding: 0;}
  .content_head,.content_foot, .main {padding-inline: 6% !important; padding-block: 10% !important;}
  .function .content_body > div[class^="area_"] {padding-inline: 6% !important; padding-block: 10% !important;}
  .function .tab_wrapper {position: relative; overflow: hidden; width: 100%;}

  /* 탭 영역 시작 */
  /* 탭 영역 화살표 추가 */
  .tab_default {display: flex; overflow-x: auto; scroll-behavior: smooth; gap: 12px; -ms-overflow-style: none; scrollbar-width: none;}
  .tab_default::-webkit-scrollbar {display: none;}
  .tab_arrow {position: absolute; top: 50%; transform: translateY(-50%); display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; box-sizing: border-box; border: 2px solid #dadada; border-radius: 50%; background: #fff; font-size: 18px; line-height: 32px; text-align: center; color: #3a3a3a; cursor: pointer; user-select: none; z-index: 10;}
  .tab_arrow.prev {left: 4px;}
  .tab_arrow.next {right: 4px;}
  .function .area_function .tab_wrapper .tab_arrow.prev::before { content: ""; display: block; width: 6px; height: 6px; border-left: 2px solid #333; border-bottom: 2px solid #333; transform: rotate(45deg); }
  .function .area_function .tab_wrapper .tab_arrow.next::before { content: ""; display: block; width: 6px; height: 6px; border-right: 2px solid #333; border-top: 2px solid #333; transform: rotate(45deg); }
  .function .title_wrap .tab_default .tablink {white-space: nowrap;}
  /* 자세히보기 버튼 위치 중앙정렬 */
  .function .area_function .title_wrap .btn_wrap_link {display:none; /*order: 3; margin: auto; align-self: center; vertical-align: middle; margin-top: 32px; padding: 8px 24px; border: #9a9b9c solid 1px; border-radius: 24px;*/}
  /* 여백 조절 */
  .function .area_function .title_wrap .title {display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-bottom: 20px;}
  .function .area_function .title_wrap { display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 36px;}
  /* 텝 영역 끝 */

  /* 롤링배너 리사이징 */
  .function .area_customer .marquee_container{position:relative; width:100%; height:0; padding-top:clamp(68px,12vw,150px); overflow:hidden;}
  .function .area_customer .marquee_container .marquee_inner{position:absolute; top:0; left:0; width:200%; height:50%; display:flex; animation:marqueeToLeft 50s linear infinite; gap:4%;}
  .function .area_customer .marquee_container .marquee_inner .wrap img{height:100%; width:auto; object-fit:contain; display:block;}

  /* 이벤트 배너 */
  .event_bn {padding:30px 0 50px;}
  .event_bn .inner {padding:0 6%;}
  .event_bn .link_bn_pc {display:none;}
  .event_bn .link_bn_mo {display:block;}
  .event_bn .link_bn_mo a {display:flex; justify-content:center; border-radius:10px;}

  /* 소개페이지 */
  .function.brandstory .main.price {background: linear-gradient(to top, #DBF8FF, #FFF); }
}

@media (max-width: 768px) {
  /* 모바일 이미지 */
  img.pc {display: none !important;}
  img.mo {display: block !important;}
  /* 주요기능 */
  .function .area_category .inner {flex-direction: column; gap: 24px;}
  .function .area_category .inner .card_section { flex: 1 1 100%; max-width: none;}
  .function .area_intro .cont_wrap .box_cont .cont{ display:flex;flex-direction:column; align-items:center; gap:24px; padding:36px 24px;}
  .function .area_intro .cont_wrap .box_cont .cont li{ width:100%; max-width:none;}
  .function .area_intro .cont_wrap .box_cont .cont li:not(:last-child)::after {content: ""; display: block; width: 100%; height: 1px; background: #E5E5E5; margin: 28px 0;}
  .function .area_intro .cont_wrap .box_cont .cont {gap: 0;}

  /* 주요기능:서브 */
  .function .area_function .feature_grid {display: grid; grid-template-columns: 1fr ; grid-template-rows: auto; gap: 32px; max-width: 100%; width: 100%; margin: 0 auto; box-sizing: border-box;}
  .function .area_function .feature_card, .function .area_function .feature_card.wide {display: block !important;flex-direction: column;  position: relative; height: auto;}
  .function .area_function .feature_card img,.function .area_function .feature_card.wide img {position: static !important; width: 100%; height: auto; object-fit: cover; display: block;}
  .function .area_function .feature_card.wide .img_card {all: unset; display: block; width: 100%;}
  .function .area_function .feature_card.wide .img_card img {all: unset; display: block; height: auto; width: 100%;}
  .function .area_function .feature_card .wrap_title,.function .area_function .feature_card.wide .wrap_title {position: static; padding: 32px 32px 0 32px; height: auto; width: 100%; box-sizing: border-box; z-index: auto;}
  .feature_grid .wrap_title h3 {font-weight: 600; line-height: 140%; color: #333; font-size: 28px !important;}
  .feature_grid .wrap_title p {font-weight: 400; line-height: 140%; color: #6B6B6B; font-size: 22px !important;}

  /* 가격 안내페이지 */
  .price .view_pc {display:none;}
  .price .view_mo {display:block;}
  .price .area_advantage .cont {flex-direction:column;}
  .price .title_wrap h2 {text-align:center;}
  .price .area_option .wrap .boxlist {flex-direction: column;}
  .price .tb_price tbody th, .price .tb_price tbody td {padding:0;}
  .price .tb_price thead th {padding:0;}
  .price .tb_price th.m2 h3,
  .price .tb_price th.m3 h3 {position:relative; top:10px;}
  .price .tb_price tbody .name th:nth-child(1),
  .price .tb_price tbody .name th:nth-child(2) {width:10%;}
  .price .tb_price tbody .name th:nth-child(3),
  .price .tb_price tbody .name th:nth-child(4),
  .price .tb_price tbody .name th:nth-child(5) {width:30%;}

  .price .area_option .wrap .cardlist .box {flex-direction:column; align-items:flex-start;}
  .price .area_option .wrap:nth-child(2) .cardlist .box .titlebox,
  .price .area_option .wrap:nth-child(4) .cardlist .box .titlebox,
  .price .area_option .wrap .cardlist .box .titlebox {padding:20px 30px;}
  .price .area_option .wrap .cardlist .box .sub {padding:0 30px 20px; font-size:14px;}
  .price .area_option .wrap .cardlist .box .subbox .tit {font-size:14px;}
  .price .view_mo p.desc {text-align:center;}
  .price .view_mo .card .title h3 {font-size:18px; border-bottom:1px solid #eee; padding-bottom:12px; font-weight: 500; text-align: left;}
  .price .view_mo .card .card_header .tit {font-size:16px; margin:24px 0 8px; font-weight: 500; text-align: left;}
  .price .view_mo .card .card_header .tit.mint {color:#00BEEE;}
  .price .view_mo .card .card_header .tit.purple {color:#885DFF;}
  .price .view_mo .card .card_header .desc {font-weight:400; color:#888; font-size:16px; text-align:left;}
  .price .view_mo .btn_ghost {border:1px solid #eee; color:#999; border-radius:40px; font-size:15px;}
  .price .view_mo .btn_general {background-color:#333; color:#fff; border-radius:40px; font-size:15px;}
  .price .card .wrap_btn {margin-top:30px; display:flex; flex-direction:column; gap:4px;}
  .price .card {position: relative; width: calc(100% / 3 - 16px); margin-right: 24px; padding: 40px 24px; background: #fff; border-radius: 16px; box-sizing: border-box; box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.02); border: 1px solid #f0f0f0}
  .price .card:last-child {margin-right:0;}
  .price .card .card_body {margin-top:24px;}
  .price .card .tb_meta {margin-top: 12px; background: #F5F7F9; border-radius: 4px}
  .price .card .tb_meta th,
  .price .card .tb_meta td {padding: 4px 12px; font-size: 13px}
  .price .card .tb_meta th {text-align: left}
  .price .card .tb_meta td {text-align: right; font-weight: bold; letter-spacing: 0}
  .price .card .tb_meta .data span {font-weight: normal; color: #888}
  .price .card .txt_grade {margin-bottom:4px; font-size: 15px; line-height: 100%; letter-spacing: -1px; color: #888;}
  .price .card .currency {font-size: 36px}
  .price .card .txt_cancel {text-decoration:line-through;}
  .price .card .price {font-size: 36px; font-weight: 500;}
  .price .card .wrap_btn a + a {margin: 5px 0 0}
  .price .card.m2,
  .price .card.m3 {border-radius: 0 0 16px 16px}
  .price .card .subtit {display: block; position: absolute; left:-1px; width: 100%; height: 32px; line-height: 32px; font-size: 14px; text-align: center; color:#fff; border: 1px solid #00b3ce;}
  .price .card.m2 .subtit,
  .price .card.m3 .subtit {top:-33px; border-radius:16px 16px 0 0; }
  .price .card.m2 .subtit {background-image: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)), linear-gradient(90deg, #00b3ce 0%, #3B5CE8 100%); background-origin: border-box; background-clip: content-box, border-box;}
  .price .card.m3 .subtit {background: #00b3ce; }
  .price .card .wrap_btn a,
  .price .tb_price .last a {min-width: inherit; width: 100%; padding: 0 20px; line-height: 52px; letter-spacing: -1px; font-weight: 400;}
  .price p.desc {text-align:center; margin-top:8px;}
  .price .area_advantage .cont .box .titlebox {align-items:center; padding:0; margin-bottom:20px;}
  .price .area_advantage .cont .box .tit,
  .price .area_option .wrap .boxlist .box .tit {font-size:16px; text-align:center;}
  .price .area_advantage .cont .box .desc,
  .price .area_option .wrap .boxlist .box .desc {font-size:14px; text-align:center;}
  .price .area_option .wrap .boxlist .box .titlebox {padding:0;}
  .price .area_option .wrap .boxlist .box .img {margin-top:20px;}
  .price .area_option .wrap .boxlist .box .img img {width:90%;}
  .price .area_option .wrap .cardlist .box .subbox li .desc {font-size:14px;}
  .price .area_advantage .newbie {left:240px;}
  .price .area_calculator .cont_wrap {top:-10px;}
  .price .area_comparison h3 {font-size:14px;}
  .price .area_comparison .name th .title,
  .price .area_comparison .name th .desc {font-size:12px;}
  .price .area_comparison .label,
  .price .area_comparison th {font-size:14px;}
  .price .area_comparison .tb_price tbody th,
  .price .area_comparison .tb_price tbody td {padding:10px 0;}
  .price .box_desc {font-size:12px; margin-top:64px;}
  .price .area_option .wrap .cardlist .box .subbox {padding:0 30px 30px;}
  .price .area_option .wrap.education .cardlist .box .subbox li {align-items:flex-start; flex-direction: column;}
  .price .area_option .wrap.education .cardlist .box .sub {padding:0;}
  .price .area_box {margin-top:0px;}
  .price .question p {font-size:16px;}
  .price .question .ic_detail {top:-19px;}

  .price .view_mo .card {width: 80%; margin: 0 4px;}
  .price .view_mo .tb_price th, 
  .price .view_mo .tb_price td {width: 50%;}
  .price .view_mo .tb_price tbody th, 
  .price .view_mo .tb_price tbody td {padding: 10px; border-left: 1px solid #D8D8D8; border-right: 1px solid #E8EBEE}
  .price .view_mo .tb_price tbody th + td {border-left-color: #E8EBEE;}

  /* SLICK*/
  .slick-dotted .slick-dots {display:flex; justify-content:center; gap:8px;}
  .slick-dotted .slick-dots li {width: 12px; height: 12px; border-radius:50%; background-color: #dedede;}
  .slick-dotted .slick-dots li.slick-active {width: 27px;height: 14px;border-radius:7px;background-color: #25cad3; box-shadow:2px 2px 5px rgba(0,0,0,0.2);}
  .slick-dotted .slick-dots li button {display: none;}
  .slick-dotted .slick-prev, 
  .slick-dotted .slick-next {top:45%; width: 40px; height: 40px; border-radius: 50%; transition:background 150ms ease-out 0s, border 150ms ease-out 0s, transform 150ms ease-out 0s, -webkit-transform 150ms ease-out 0s; z-index: 4}
  .slick-dotted .slick-prev {left: 0;}
  .slick-dotted .slick-next {right:0}
  .slick-dotted .slick-prev:hover,
  .slick-dotted .slick-next:hover {background: #e5e5e5}
  .slick-dotted .slick-prev:before, 
  .slick-dotted .slick-next:before {display: block; width: 32px; height: 32px; background: url(../images/ic_com.png);  margin: 0 auto; content: ''}
  .slick-dotted .slick-prev:before {background-position: -595px -196px;}
  .slick-dotted .slick-next:before {background-position: -690px -196px;}

  /* 소개페이지 */
  .function.brandstory .content_head {margin:0; }
  .function.brandstory .content_head .visual_wrap {margin: 24px 0 0; }
  .function.brandstory .area_introduce .inner {flex-direction: column; gap: 24px;}
  .function.brandstory .area_scale .inner .btn_contents .btn.cont {display: flex; flex-direction: row; width: 100%; max-width: 160px; font-size: 16px; font-weight: 500; text-decoration: none;}
  .function.brandstory .area_scale .inner .btn_contents .btn.cont .btn_wrap .tablink .btn_top .text-left {font-size: 16px; font-weight: 600; color: #333; line-height: 150%;}
  .function.brandstory .area_scale .inner .btn_contents {display: flex; flex-direction: column;}
  .function.brandstory .area_scale .inner .btn_contents .btn.cont .btn_wrap,
  .function.brandstory .area_scale .inner .btn_cont .btn.cont .btn_wrap .tablink {display:flex; flex-direction: row; gap:8px;}
  .function.brandstory .area_scale .inner .btn_contents .btn.cont .btn_wrap .tablink {display: flex; flex-direction: column; width: 100%; padding:16px;}
  .function.brandstory .area_scale .inner .btn_contents .btn.cont .btn_wrap .tablink .btn_sub {display: none;}
  .function.brandstory .area_scale .inner .cont.wrap p {min-height: 94px;  margin-top: 40px; font-size: 16px; font-weight: 500; color: #333; line-height: 150%;}
  .function.brandstory .area_scale .inner .cont.wrap .carousel_slide p {font-size: 20px; padding: 0 8px;} 
  .function.brandstory .area_function .feature_grid .feature_card .wrap_title {display: none;}
  .function.brandstory .area_function.white .feature_card .img_card img { margin: auto; max-width:100%; height:auto; object-fit:cover; display:block;}
  .function.brandstory .title_wrap {margin: 0;}
  .function.brandstory .main .title_wrap .tab_default {display: flex; justify-content:left;}
  .function.brandstory .main .area_detail, .area_price {padding: 0 !important;}
  .function.brandstory .main.price .title_wrap {margin-bottom: 44px;}
  .brandstory .area_detail {padding:60px 0;}
  .brandstory .area_detail .box_cont .box_line {display:flex; flex-direction:column; align-items:center;}
  .brandstory .area_detail .box_cont .box_line a,
  .brandstory .area_detail .box_cont .box_line .box {width:100%;}
  .brandstory .area_detail .box_cont .box_line .box:hover {width:100%; background-color:#f5f6f8;}
  .brandstory .area_detail .box_cont .box_line .box .normal .img img {width:100%;}
  .brandstory .area_price {padding:60px 0;}
  .brandstory .area_price .title_wrap .btn_wrap_link {justify-content:left; margin-top:20px;}
  .brandstory .area_price .cont_wrap .box_cont {flex-direction:column;}
  .brandstory .area_price .cont_wrap .box_cont .box {width:100%;}
  .brandstory .area_price .cont_wrap .price p.desc {text-align:left; margin:0;}
  .brandstory .area_detail .box_cont .box_line .box .normal .txt {text-align:center;}
  .brandstory .area_price .cont_wrap .box_cont .box .box_main .desc {text-align:left;}

  /* 필수확인자료 */
  .contents_document .anchors {margin-left: 4px;}
  .contents_document .wrap_card {margin: 0}
  .contents_document .wrap_card .layout_card {height: inherit; padding-bottom: 32px}
  .contents_document .bg_img_card .layout_card .play_img {left: 8px}

}

@media (max-width: 480px) {
  /* 폰트 리사이징 (사이즈 고정)*/
  h1 {font-size: 30px; font-weight: 600; line-height: 140%; color: #333;}  
  h2 {font-size: 28px; font-weight: 600; line-height: 140%; color: #333;}
  h3 {font-size: 24px; font-weight: 600; line-height: 140%; color: #333;}
  span.sub {font-size: 24px; font-weight: 300; line-height: 140%; color: #333;}
  p.point {font-size: 28px; font-weight: 500; line-height: 140%; color: #1EC6DF;}
  p.desc {font-size: 16px; font-weight: 400; line-height: 150%; color: #6B6B6B;}
  p.tit {font-size: 16px; font-weight: 600; line-height: 150%; color: #333;}
  p.des {font-size: 14px; font-weight: 400; line-height: 150%; color: #888;}

    /* 폰트 리사이징 (주요기능:서브) */
  .function .area_function .feature_grid .feature_card .wrap_title {padding: 24px 24px 0 24px}
  .function .area_function .feature_grid .wrap_title h3 {font-weight: 600; line-height: 140%; color: #333; font-size: 20px !important;}
  .function .area_function .feature_grid .wrap_title p {font-weight: 400; line-height: 140%; color: #6B6B6B; font-size: 16px !important;}

  /* 탭 및 버튼 리사이징 */
  .function .title_wrap .tab_default .tablink {font-size:15px; color:#9C9FA3; font-weight:600; padding:4px 8px; letter-spacing:-1px; margin: 0 4px;}
  .function .btn_link {font-size:15px; color:#888;}

  /* 푸터 스타일 */
  .function .content_foot { padding: 140px 0;margin: 0 auto; text-align: center; width: 100%; background:
    url("https://daouoffice.com/images/main_new/2025/function/img_footer_mo_01.png") no-repeat bottom center/cover,
    linear-gradient(to bottom right, #9ADFF8, #A8DEFF, #E8F5FF);
  /* 텍스트 색은 불투명하게 */
  color: #fff;}

  /* 리뷰 */
  .function .area_review .title h3, .function .area_review_center .review_inner_center .title_center h3 {font-size: 24px !important; font-weight: 600; line-height: 140%; color: #333;}
  .function .area_review .title p, .function .area_review_center .title_center p  {font-size: 16px; font-weight: 400; line-height: 150%; color: #888;}
  .function .area_review .title p .text-left {font-size: 16px; font-weight: 400; line-height: 150%; color: #888; white-space: wrap;}
}