@charset "UTF-8";

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

.gray {background-color:#F5F6F8;}

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

/* 1. 주요기능 폰트 정의 */
h1 {font-size: 52px; font-weight: 600; line-height: 140%; color: #333;}  
h2 {font-size: 44px; font-weight: 600; line-height: 140%; color: #333;}
h3 {font-size: 40px; font-weight: 600; line-height: 140%; color: #333;}
span.sub {font-size: 34px; font-weight: 300; line-height: 140%; color: #333;}
p.point {font-size: 24px; font-weight: 500; line-height: 140%; color: #1EC6DF;}
p.point.purple {color: #844FFF;}
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;}
.highlight {background: linear-gradient(to right, #7CF5FF, #5D88FF); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.blind {display:none;}

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

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

/* 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;}

.function .area_comparison .wrap_btn {display:flex; flex-direction: row; justify-content: center; align-items: center; margin:40px 0 0 0; gap:20px;}
.function .area_comparison .wrap_btn .btn_ghost {width:auto; padding:4px 38px; border:1px solid #A5E4EE; background-color:#fff; color:#00A2B9; font-weight:400; font-size:20px; line-height:290%; border-radius:45px; display:flex; align-items:center; justify-content:center; gap:6px;}
.function .area_comparison .wrap_btn .btn_ghost:hover {background-color: #ECF9FC;}
.function .area_comparison .wrap_btn .btn_general {width:auto; padding:4px 38px; background:#000; color:#fff; font-weight:400; font-size:20px; line-height:290%; border-radius:45px; display:flex; align-items:center; justify-content:center; gap:6px;}
.function .area_comparison .wrap_btn .btn_general:hover {background: #555; color:#fff;}
.function .area_comparison .wrap_btn .btn_ghost .ic_chevron_right {display:inline-block; width:24px; height:24px; background:url(../images/ic_chevron_right_mint.svg) center center no-repeat; background-size:contain;}
.function .area_comparison .wrap_btn .btn_general .ic_chevron_right {display:inline-block; width:24px; height:24px; background:url(../images/ic_chevron_right_white.svg) center center no-repeat; background-size:contain;}


/* --- 자세히보기 버튼 --- */
.function .title_wrap .tab_default .tablink .badge.new {display: inline-block; width:18px; height:18px; background-color:#FF3B30; color:#FFF; font-size:11px; font-weight:500; line-height:18px; text-align:center; border-radius:50%; margin-left: 2px; margin-bottom: 4px; vertical-align: middle;}
.function a.btn_outline.core {display: block; max-width: fit-content; text-align: center; vertical-align: middle; margin: 24px auto 0; padding: 10px 18px 10px 24px; color:#8C8F93; border: 1px solid #DEDEDE; border-radius: 24px; font-size: 18px; font-weight: 500; transition: color 0.2s, border-color 0.2s;}
.function a.btn_outline.core:hover {color:#00C3E0 !important; border-color:#00C3E0;}
.function a.btn_outline.core span.ic_arrow {display: inline-block; width: 16px; height: 16px; background: url(https://daouoffice.com/images/ic_main.svg) no-repeat -216px -69px; vertical-align: middle; margin-left: 4px;  filter: brightness(0) saturate(100%) invert(53%) sepia(3%) saturate(50%) hue-rotate(176deg) brightness(95%) contrast(92%); transition: filter 0.2s;}
.function a.btn_outline.core:hover span.ic_arrow {display: inline-block; width: 16px; height: 16px; background: url(https://daouoffice.com/images/ic_main.svg) no-repeat -216px -69px; vertical-align: middle; margin-left: 4px; filter: brightness(0) saturate(100%) invert(43%) sepia(100%) saturate(1200%) hue-rotate(187deg) brightness(98%) contrast(102%) !important;}
.function a.btn_outline.core.rolling {padding: 14px 42px 14px 44px; border-radius: 50px; font-size: 20px; font-weight: 400; }
.function a.btn_outline.special {display: block; max-width: fit-content; text-align: center; vertical-align: middle; margin: 24px auto 0; padding: 10px 18px 10px 24px; color:#8C8F93; border: 1px solid #DEDEDE; border-radius: 24px; font-size: 18px; font-weight: 500; transition: color 0.2s, border-color 0.2s;}
.function a.btn_outline.special:hover {color:transparent; background-image:linear-gradient(90deg,#31DDFF,#1F98F0);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent; border:1px solid transparent; border-radius: 24px; border-color:#1F98F0;}
.function a.btn_outline.special span.ic_arrow {display: inline-block; width: 16px; height: 16px; background: url(https://daouoffice.com/images/ic_main.svg) no-repeat -216px -69px; vertical-align: middle; margin-left: 4px;  filter: brightness(0) saturate(100%) invert(53%) sepia(3%) saturate(50%) hue-rotate(176deg) brightness(95%) contrast(92%); transition: filter 0.2s;}
.function a.btn_outline.special:hover span.ic_arrow {display: inline-block; width: 16px; height: 16px; background: url(https://daouoffice.com/images/ic_main.svg) no-repeat -216px -69px; vertical-align: middle; margin-left: 4px; filter: brightness(0) saturate(100%) invert(43%) sepia(100%) saturate(1200%) hue-rotate(187deg) brightness(98%) contrast(102%) !important;}
.function a.btn_outline.purple {display: block; max-width: fit-content; text-align: center; vertical-align: middle; margin: 24px auto 0; padding: 10px 18px 10px 24px; color:#8C8F93; border: 1px solid #DEDEDE; border-radius: 24px; font-size: 18px; font-weight: 500; transition: color 0.2s, border-color 0.2s;}
.function a.btn_outline.purple:hover {color:#C271F3; border-color:#C271F3;}
.function a.btn_outline.purple span.ic_arrow {display: inline-block; width: 16px; height: 16px; background: url(https://daouoffice.com/images/ic_main.svg) no-repeat -216px -69px; vertical-align: middle; margin-left: 4px;  filter: brightness(0) saturate(100%) invert(53%) sepia(3%) saturate(50%) hue-rotate(176deg) brightness(95%) contrast(92%); transition: filter 0.2s;}
.function a.btn_outline.purple:hover span.ic_arrow {display: inline-block; width: 16px; height: 16px; background: url(https://daouoffice.com/images/ic_main.svg) no-repeat -216px -69px; vertical-align: middle; margin-left: 4px; filter: invert(76%) sepia(40%) saturate(5200%) hue-rotate(260deg) brightness(97%) contrast(100%) !important;}
.function a.btn_outline.common {display: block; max-width: fit-content; text-align: center; vertical-align: middle; margin: 24px auto 0; padding: 10px 18px 10px 24px; color:#8C8F93; border: 1px solid #DEDEDE; border-radius: 24px; font-size: 18px; font-weight: 500; transition: color 0.2s, border-color 0.2s;}
.function a.btn_outline.common:hover {color:#717274; border-color:#717274;}
.function a.btn_outline.common span.ic_arrow {display: inline-block; width: 16px; height: 16px; background: url(https://daouoffice.com/images/ic_main.svg) no-repeat -216px -69px; vertical-align: middle; margin-left: 4px;  filter: brightness(0) saturate(100%) invert(53%) sepia(3%) saturate(50%) hue-rotate(176deg) brightness(95%) contrast(92%); transition: filter 0.2s;}
.function a.btn_outline.common:hover span.ic_arrow {display: inline-block; width: 16px; height: 16px; background: url(https://daouoffice.com/images/ic_main.svg) no-repeat -216px -69px; vertical-align: middle; margin-left: 4px; filter: filter: brightness(45%) !important;}


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

/* 8. 아이콘 */
.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;}
.ic_main,
.ic_main_mint {width:28px; height:28px; background:url(../images/ic_main.svg); display:inline-block; top:0px; position:relative; margin-right:8px;}
.ic_main_mint.mail {background-position:-13px -61px;}
.ic_main_mint.payment {background-position:-53px -58px;}
.ic_main_mint.works {background-position:-91px -60px;}
.ic_main_mint.ai {background-position:-130px -60px;}
.ic_main_mint.messenger {background-position:-167px -60px;}
.ic_main_mint.human {background-position:-15px -147px;}
.ic_main_mint.expense {background-position:-53px -147px;}
.ic_main_mint.attendance {background-position:-91px -147px;}
.ic_main_mint.education {background-position:-129px -147px;}
.ic_main_mint.contract {background-position:-166px -147px;}
.ic_main_mint.card {background-position:-14px -223px;}
.ic_main_mint.receipt {background-position:-53px -223px;}
.ic_main_mint.vehicle {background-position:-90px -223px;}
.ic_main_mint.sales {background-position:-127px -223px;}
.ic_main_mint.tax {background-position:-165px -223px;}
.ic_main_mint.mobile {background-position:-306px -219px;}
.ic_main_mint.calender {background-position:-270px -219px;}

.ic_main.human {background-position:-15px -109px;}
.ic_main.expense {background-position:-53px -109px;}
.ic_main.attendance {background-position:-91px -109px;}
.ic_main.education {background-position:-129px -109px;}
.ic_main.contract {background-position:-166px -109px;}
.ic_main.card {background-position:-14px -185px;}
.ic_main.receipt {background-position:-53px -185px;}
.ic_main.vehicle {background-position:-90px -185px;}
.ic_main.sales {background-position:-127px -185px;}
.ic_main.tax {background-position:-165px -185px;}
.ic_main.mail {background-position:-13px -12px;}
.ic_main.payment {background-position:-53px -12px;}
.ic_main.works {background-position:-91px -12px;}
.ic_main.ai {background-position:-130px -12px;}
.ic_main.messenger {background-position:-167px -12px;}
.ic_main.mobile {background-position:-306px -184px;}
.ic_main.calender {background-position:-270px -184px;}

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

/* 10. 캐러셀 */
.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 #eff0f2; background-color: #F5F6F8 ; border-radius: 24px; position: relative; text-align: center; }
.function.brandstory .area_scale .inner .cont.wrap p {min-height: 96px;  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%;}

/* 11. 화살표 스타일 */
.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:hover { border: 1px solid #ddd;}
.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); }


/* --- 개별 콘텐츠 시작 --- */
/* 주요기능 공통 */
.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 {width: 100%;}
.function .area_intro .cont_wrap .box_cont .cont {display: flex; justify-content: space-between; gap: 32px; padding: 40px 110px 48px; margin: 0; list-style: none;}
.function .area_intro .cont_wrap .box_cont .cont li {max-width: 250px; width: 100%;}
.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%;}
.function .area_function.last { padding: 100px 0 180px;}
.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-direction:column; margin-bottom:32px;}
/*.function .area_function .title_wrap .title {flex: 0 0 100%;}*/
.function .area_function .title_wrap .tab_default {/*order: 2;*/ display: flex; margin-bottom: 12px;}
.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; margin-left:22px; }
.function .area_category { padding: 150px 0 120px; margin: 0 auto;}
.function .area_category .inner {display: flex; flex-wrap: nowrap; justify-content: space-between; gap: 24px; max-width: 1200px;}
.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: 0 auto 32px; max-width: 1200px;}

.function .area_rolling{display: block; padding: 80px 0 32px; text-align: center; background: linear-gradient(to top, #e0fcff, #ffffff);}

.function .area_rolling.green{background: linear-gradient(to top, #e4ffee, #ffffff);}

.function .area_rolling .rolling_box {width: 100%; overflow: hidden; padding: 60px 0 20px;}

.function .area_rolling .rolling_box .cont {
    display: flex;
    align-items: center;
    width: max-content;
    animation: rollingleft 60s linear infinite;
}

.function .area_rolling .title .desc {color:#6B6B6B; margin-top: 8px;}

/* 각 이미지 스타일 */
.function .area_rolling .rolling_box .cont img {
    height: 72px; /* 로고 높이 조절 */
    margin: 0 28px; /* 로고 간격 조절 */
    flex-shrink: 0; /* 이미지 크기 유지 */
}
/* 왼쪽으로 이동하는 애니메이션 */
@keyframes rollingleft {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-33.3%); /* 전체 길의 절반만큼 이동 */
    }
}

/* 주요기능:경리관리 */
.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:40px; height:40px; border-radius:50%; border:1px solid #EAECEF;background:#FFFFFF; cursor:pointer; padding:0;}
.function.payroll .review_navigation button:hover{border:1px solid #a9aaab;}
.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.work .gradient-text { background: linear-gradient(90deg, #31DDFF, #1F98F0); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: inline; }


/* --- 소개페이지 --- */
/* 소개페이지 시작 */
.function.brandstory .top3 .wrap_card .layout_card a {padding:0; border-radius:30px;}
.function.brandstory .inner_flex {background-color:#F1F5FA; border-radius:25px;}
.function.brandstory .area_top .badge {font-size:15px; color:#fff; background-color:#333; border-radius:12px; padding:4px 10px; position:absolute; top:-10px; right:6%;}
.function.brandstory .list_func .item_cont {padding:70px 0 70px 130px;}
.function.brandstory .list_func .item_cont .logo img {margin-bottom:12px; width:100%; max-width: 262px;}
.function.brandstory .list_func .item_cont .desc {margin-top:24px;}
.function.brandstory .list_func .item_thumb {margin:30px 20px 0 0;}
.function.brandstory .list_func .item_thumb img {width:100%;}
.function.brandstory .list_func .item_thumb2 img {width:100%;}
.function.brandstory .area_top {padding:10px 0 50px 0;}
.function.brandstory .section_card {display:grid; grid-template-columns:repeat(3, 1fr); width:100%; gap:3vw; margin: 80px auto 0;}
.function.brandstory .layout_card .con {padding:35px 0 35px 40px;}
.function.brandstory .layout_card .link {margin-top:18px; text-align:left;}
.function.brandstory .layout_card .link img {position:relative; top:0px;}
.function.brandstory .layout_card .con .tit {font-size:22px; text-align: left;}
.function.brandstory .label {font-size:14px; padding:2px 10px; font-weight:500; border-radius:20px;}
.function.brandstory .label1 {font-size:16px; margin:0 0 10px 0; font-weight:500;}
.function.brandstory .label2 {font-size:18px; margin:0 0 10px 0; font-weight:500;}
.function.brandstory .item .item_cont .title {text-align:left;}
.function.brandstory .label.mt {color:#14BFC7; border:1px solid #ddd;}
.function.brandstory .label1.mt, .benefit .label2.mt {color:#14BFC7;}
.function.brandstory .label1.gr, .benefit .label2.gr {color:#37C237;}
.function.brandstory .label1.bl, .benefit .label2.bl {color:#4378FF;}
.function.brandstory .cont_head .sub {text-align:center; font-size:22px; font-weight:500; color:#9AABBD; margin-bottom:10px;}
/*.function.brandstory .title {line-height:150%;}*/
.function.brandstory .area_tab {margin:100px 0 50px;}
.function.brandstory .anchors a {height:30px;}

.function.brandstory .top3 .wrap_card .layout_card a {padding:0; border-radius:30px;}
.function.brandstory .inner_flex {background-color:#F1F5FA; border-radius:25px;}
.function.brandstory .area_top .badge {font-size:15px; color:#fff; background-color:#333; border-radius:12px; padding:4px 10px; position:absolute; top:-10px; right:6%;}
.function.brandstory .area_top {padding:10px 0 50px 0;}
.function.brandstory .section_card {display:grid; grid-template-columns:repeat(3, 1fr); width:100%; gap:3vw; margin: 80px auto 0;}
.function.brandstory .layout_card .con {padding:35px 0 35px 40px;}
.function.brandstory .layout_card .link {margin-top:18px; text-align:left;}
.function.brandstory .layout_card .link img {position:relative; top:0px; height: 24px; width: 24px;}
.function.brandstory .layout_card .con .tit {font-size:22px;}
.function.brandstory .label {font-size:14px; padding:2px 10px; font-weight:500; border-radius:20px;}
.function.brandstory .label1 {font-size:16px; margin:0 0 10px 0; font-weight:500;}
.function.brandstory .label2 {font-size:18px; margin:0 0 10px 0; font-weight:500;}
.function.brandstory .item .item_cont .title {text-align:left;}
.brandstory .label1.bl, .brandstory .label2.bl {color:#4378FF;}
.brandstory .cont_head .sub {text-align:center; font-size:22px; font-weight:500; color:#9AABBD; margin-bottom:10px;}
/*.brandstory .title {line-height:150%;}*/
.brandstory .area_visual {height:auto;}
.brandstory .area_tab {margin:100px 0 50px;}
.brandstory .anchors a {height:30px;}

.function.brandstory .wrap_card {margin:32px auto 0; text-align:left;}
.function.brandstory .wrap_card .section_card{    display: grid; grid-template-columns: repeat(3, 1fr); width: 100%; gap: 3vw; margin: 80px auto 0;}
.function.brandstory .wrap_card .layout_card{float:left; position:relative; text-align: left; margin:30px 13px; width:100%; height:100%; margin:0; border-radius:20px; transition:all .15s ease-out; background: #fff; box-shadow:0 3px 6px rgb(25 25 25 /10%); box-sizing: border-box;}
.function.brandstory .wrap_card .layout_card:hover{transform: translateY(-4px) translateZ(0); box-shadow: 2px 10px 20px 0px rgb(25 25 25 /10%);}
.function.brandstory .wrap_card .layout_card a {display: block; padding:48px 20px; word-break: keep-all; background: #fff;}
.function.brandstory .wrap_card .layout_card > img{margin-bottom: 20px}
.function.brandstory .wrap_card:after {content:''; clear:both; display:block;}
.function.brandstory .wrap_card .txt_card_box{ margin:15px 10px; color:#000; font-weight:200;}
.function.brandstory .wrap_card .tit_card{  font-size:22px; font-weight:600;}
.function.brandstory .wrap_card .txt_card{ font-size:16px; font-weight:400; color:#5C5C5C; margin-top:16px;}
.function.brandstory .wrap_card .hashtag{ font-size:14px; font-weight:500; margin-left: 10px; color: #3851E7; position: absolute; bottom:53px;}
.function.brandstory .bg_img_card .layout_card .thumb {position: relative; width: 100%; box-sizing: border-box;}

.brandstory .area_brandstory {padding:50px 0 120px;}
.brandstory .area_brandstory .wrap.last {padding-top:180px;}

.brandstory .wrap_card .txt_card_box img {display:block; margin:40px 0;}
.brandstory .wrap_card .layout_card {width:100%; height:100%; margin:0; border-radius:30px;}
.brandstory .wrap_card .txt_card_box {margin:0;}
.brandstory .wrap_card .txt_card {text-align:left; margin-top:8px;}
.brandstory .wrap_card .layout_card a {padding:50px 40px 50px; border-radius:30px;}
.brandstory .wrap_card .hashtag {margin:24px 0 0; position:static;}

.brandstory .area_govt {background-color:#F6F8FB; padding:120px 0;}
.brandstory .area_govt .cont_box {display:flex; margin-top:80px; gap:40px; flex-direction:row;}
.brandstory .area_govt .box {width:100%; background-color:#fff; border-radius:25px; border:1px solid #E9E9E9; box-shadow:0px 4px 8px rgb(0 0 0 / 10%); padding:60px 0 30px;}
.brandstory .area_govt .title {text-align:center;}
.brandstory .area_govt .title h3 {font-size:30px;}
.brandstory .area_govt .title:after {content:''; background-color:#eee; width:370px; height:1px; display:inline-block; text-align:center; box-sizing:border-box; margin:30px 0 25px 0;}
.brandstory .area_govt .title p {font-size:18px; font-weight:500; text-decoration:underline; margin-bottom:6px;}
.brandstory .area_govt .s1 {color:#3BCAD0;}
.brandstory .area_govt .s2 {color:#3851E7;}
.brandstory .area_govt .box .col {margin:20px auto 0;}
.brandstory .area_govt .box.last .col {margin:20px auto 60px;}
.brandstory .area_govt .box .col .meta > li {display:block; padding-bottom:10px; margin-left:120px;}
.brandstory .area_govt .box .col .meta dt { float: left; width: 15%; font-size: 16px; color: #999;}
.brandstory .area_govt .box .col .meta dd { margin-left: 15%; font-size: 16px; color: #000;}
.brandstory .area_govt .cont_box.b3 {gap:20px;}
.brandstory .area_govt .b3 .box {flex: 1;}
.brandstory .area_govt .state.s1 {background:#3BCAD0;}
.brandstory .area_govt .state.s2 {background:#3851E7;}
.brandstory .area_govt .state {display:inline-block; color:#fff; border-radius:15px; font-size:14px; font-weight:400; box-sizing:border-box; padding:3px 11px 4px 9px; margin-bottom:18px; text-align:center; vertical-align:bottom;}
.brandstory .area_govt .desc .meta dd.bold {font-weight:600;}
.brandstory .area_govt .desc .meta dd.bold em {font-weight:400;}
.brandstory .area_govt .desc .meta .step {font-size:15px; font-weight:300; color:#666;}
.brandstory .area_govt .desc .meta dd.bold .step {margin-top:8px;}
.brandstory .area_event {padding:120px 0;}
.brandstory .area_event .inner_flex {background-color:#fff;}
.brandstory .area_event .list_func .item:last-child {padding:0;}
.brandstory .area_event .list_func .item_cont {padding:70px 0 70px 0;}
.brandstory .company-list {display:flex; flex-direction:column; justify-content:center; align-items:center; padding:80px 0 150px;}
.brandstory .company-list .title {text-align:center; font-weight:600; font-size:42px; line-height:150%; color:#333; margin-bottom:100px;}
.brandstory .company-list .link {margin-bottom:100px;}
.brandstory .company-list .container_wrap {display:flex; flex-direction:column; gap:10px; width:100%;}
.brandstory .company-list .container_wrap .marquee_container {overflow:hidden; width:100%; position:relative; height:104px;}
.brandstory .company-list .container_wrap .marquee_container .marquee_inner {width:200%; display:flex; position:absolute; top:0; animation:50s linear infinite; gap:40px;}
.brandstory .company-list .container_wrap.mobile .marquee_container .marquee_inner {animation:20s linear infinite; gap:57px;}
.brandstory .company-list .container_wrap.mobile {display:none;}
.brandstory .company-list .container_wrap .marquee_container.no1 .marquee_inner {animation-name:marqueeToLeft; left:0;}
.brandstory .company-list .container_wrap .marquee_container.no2 .marquee_inner {animation-name: marqueeToRight; right: 0;}
.brandstory .company-list .container_wrap .marquee_container.no3 .marquee_inner {animation-name:marqueeToLeft; left:0;}
.brandstory .company-list .container_wrap .marquee_container.no4 .marquee_inner {animation-name:marqueeToRight; right:0;}
.brandstory .company-list .container_wrap .marquee_container .marquee_inner .wrap {display:flex; gap:57px;}
.company-list .container_wrap img {max-width:fit-content;}

@keyframes marqueeToLeft {
  0% {
    left: 0;
  }
  100% {
    left: -100%;
  }
}

@keyframes marqueeToRight {
  0% {
    right: 0;
  }
  100% {
    right: -100%;
  }
}

.brandstory button.slick-prev,
.brandstory button.slick-next {position:absolute; top:60%; width:34px; height:48px;}
.brandstory .slick-prev:before,
.brandstory .slick-next:before {content:''}
.brandstory button.slick-prev {left: -40px; background: url('../images/ic_com.svg') no-repeat -593px -190px}
.brandstory button.slick-next {right:-40px; background: url('../images/ic_com.svg') no-repeat -692px -190px}

.brandstory .list_func.area_guide .item_thumb {margin:70px 20px 0 0;}
.brandstory .list_func.area_guide .item_thumb img {width:90%;}

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

.area_bn {margin:80px 0 140px;}
.area_bn .inner.gray {background-color:#F5F7F9; border-radius:15px;}
.area_bn .inner.blue {background-color:#DDF2FE; border-radius:15px;}
.area_bn .box_bn {display:flex; justify-content:space-between; padding:30px 130px;}
.area_bn .wrap_txt.pc {display:block;}
.area_bn .wrap_txt.mo {display:none;}
.area_bn .wrap_txt .title {font-size:20px; font-weight:600; color:#333;}
.area_bn .wrap_txt .sub {font-size:14px; font-weight:400; color:#999; margin-top:3px;}
.area_bn .wrap_btn {padding:12px 23px; font-weight:400; border:1px solid #3BBFCE; border-radius:40px; color:#3BBFCE; background-color:#fff; font-size:16px; letter-spacing:-1px; line-height:170%; transition: 0.2s;}
.area_bn .wrap_btn_blue {display: inline-flex; align-items: center; justify-content: center; padding:12px 23px; font-weight:400; border-radius:40px; color:#ffffff; background-color:#50A8FF; font-size:16px; letter-spacing:-1px; line-height:170%; transition: 0.2s;}
.area_bn .wrap_btn:hover {background-color:#F3FCFD;}
.area_bn .wrap_btn_blue:hover{background-color:#3F96ED;}

.bn_event_221007 .inner {text-align: center}
.bn_event_221007 .view_mo {width: 100%; padding: 20px 0 8px; background: #282673; border-radius: 12px;}

.link {display:flex; align-items:center; gap:5px; color:#888; font-weight:500; white-space:nowrap; font-size:18px; margin-top:30px;}
.link_small {display:flex; align-items:center; gap:5px; color:#888; font-weight:500; white-space:nowrap; font-size:14px; margin-top:20px;}
.link.center {justify-content:center; margin-top:20px;}

.function.brandstory .content_head ,.visual_wrap {margin: 100px auto 140px; padding: 0;}
.function.brandstory .content_head img {display: block; width: 100%; border-radius: 20px 20px 0 0; transition: all 0.4s;}
.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: 2px solid #ededed; 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; transition: all 0.2s ease;}
.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 .area_function.white .feature_card .img_card img {width:auto; max-height: 370px; object-fit:cover; display:block;}
.function .area_function.white .feature_card .img_card {height:auto;}
.function .area_function.white .feature_card .wrap_title {padding:40px 0 40px 40px;}
.function .area_detail {padding:40px 0 80px; margin:0 auto;}
.function .area_detail .inner {max-width:1200px;}
.function .area_detail .title_wrap .title {margin-bottom:32px;}
.function .area_detail .box_cont .box_line {display:grid; grid-template-columns:repeat(3,1fr); width:100%; gap:24px; margin-top:24px;}
.function .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;}
.function .area_detail .box_cont .box_line .box .hover {display:none;}
.function .area_detail .box_cont .box_line .box .title p {font-size: 24px;}
.function .area_detail .box_cont .box_line .box .normal {padding:32px 0 0; display:flex; flex-direction:column; gap:30px; justify-content:space-between; height:400px;}
.function .area_detail .box_cont .box_line .box .normal .txt {margin:0 40px;}
.function .area_detail .box_cont .box_line .box .normal .img {text-align:center;}
.function .area_detail .box_cont .box_line .box:hover .normal {display:none;}
.function .area_detail .box_cont .box_line .box:hover .title p {color:#7CF5FF;}
.function .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;}
.function .area_detail .box_cont .box_line .box:hover .hover {padding:32px 40px 0; display:flex; flex-direction:column;}
.function .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;}
.function .area_detail .box_cont .box_line .box:hover a .link {font-size:18px; color:#5FAEFF;}
.function .area_detail .box_cont .box_line .box:hover .hover .desc {margin-top:12px; line-height:180%; color:#fff;}
.function .area_detail .box_cont .box_line .box:hover .hover .tit {color:#4EE4FF;}
.function .area_detail .box_cont .box_line .tit {font-size:20px; font-weight:500; color:#333; display:flex;}
.function .area_detail .box_cont .box_line .desc {font-size:18px; color:#888; margin-top:12px;}
.function .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;}
.function .area_detail .box_cont .box_line a:hover {background-color:#edeff1;}
.function .area_detail .box_cont .box_line a .txt {margin:32px 40px 0;}
.function .area_detail .box_cont .box_line a .img {display:flex; justify-content:flex-end; margin:40px 20px 0 0;}
.function .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-radius:24px; border: 2px solid #fff; transition: 0.5s all; 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:16px; 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 .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:last-child .box_desc div:last-child .tag {height:23px;}
.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 .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;}

.brandstory .area_enterprise {background-color: #242424;}
.brandstory .area_enterprise .inner {display: flex; flex-direction: column; align-items: center; max-width: 1200px; margin: 0 auto; gap: 32px;}
.brandstory .area_enterprise .title_wrap {display: flex; flex-direction: column; gap: 24px; align-items: center; padding-top: 64px; margin: 0; width: 100%;}
.brandstory .area_enterprise .title {text-align: center; display: flex; flex-direction: column; gap:8px;}
.brandstory .area_enterprise .btn_black {background: linear-gradient(#1f1f1f) padding-box,linear-gradient(40deg, #DA8FFF 10%, #237FFF 100%) border-box; color: #fff; padding: 8px 28px; border-radius: 40px; font-size: 20px; font-weight: 500; transition: 0.8s; border: 3px solid transparent;}
.brandstory .area_enterprise .btn_black:hover {background: linear-gradient(#434343) padding-box,linear-gradient(40deg, #237FFF 10%, #DA8FFF 100%) border-box;}
.brandstory .area_enterprise .title_wrap .title p {font-size: 20px; color: #95A3FF;}
.brandstory .area_enterprise .title_wrap .title h3 {font-size: 52px; font-weight: 500; color: #fff; line-height: 115%;}
.brandstory .area_enterprise .title_wrap .title .gradient {background: linear-gradient(40deg, #36FFFF 0%, #DE49FF 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}


@media (max-width: 999px) {
  .brandstory .area_enterprise {padding-inline: 0 !important; padding-block: 0 !important;}
  .wrap_card .section_card {display: block;}
  .function.brandstory .wrap_card .section_card {grid-template-columns: repeat(1,1fr);}
}

@media (max-width: 768px) {
  .brandstory .area_enterprise .title_wrap .title h3 {font-size: 32px;}

}


/* .brandstory .video_wrap { width: 100%; max-width: 1200px; margin: 20px auto 160px; box-sizing: border-box; }
.brandstory .video_area { position: relative; width: 100%; padding-top: 56.25%; overflow: hidden; border-radius: 32px; }
.brandstory .video_area iframe, .video_area .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.brandstory .video_area iframe { border: none; display: block; }
.brandstory .video_area .overlay { background: rgba(0, 0, 0, 0.5); display: flex; justify-content: end; align-items: flex-start; flex-direction: column; text-align: left; pointer-events: none; }
.brandstory .video_area .text_box, .video_area .btn_wrap { pointer-events: auto; animation: fadeInUp 0.6s ease-out; z-index: 1; margin-left: 40px;}
.brandstory .video_area .btn_wrap {margin-bottom: 52px;}
.brandstory .video_area .text_box .sub { font-size: clamp(14px, 2vw, 18px); color: #e5e5e5; }
.brandstory .video_area .text_box .text { font-size: clamp(18px, 2vw, 40px); font-weight: 400; color: #fff; }
.brandstory .video_area .btn_wrap { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.brandstory .video_area .btn_wrap a { padding: 3px 24px !important; min-width: 150px; max-height: 62px;}
.brandstory .video_area .btn_general { background-color: #5cabff; color: #fff; }
.brandstory .video_area .btn_ghost { position: relative; background-color: #fff; color: #00A4CD; padding-right: 48px; }
.brandstory .video_wrap .badge { position: absolute; top: -10px; right: 96px; background-color: #fb80ff; padding: 4px 10px 5px; border-radius: 20px; color: #fff; font-size: 13px; font-weight: bold; line-height: 1; white-space: nowrap; } */

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* 소개페이지 끝*/

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

/* 주요기능(서브): 공통 */
.function .area_intro.sub .cont_wrap .box_cont .cont {display: flex; justify-content: center; gap: 44px; padding: 40px 110px 48px;}
.function .area_intro.sub .cont_wrap .box_cont .cont li {max-width: 270px; width: 100%;}
.function .area_function .inner {max-width: 1200px;}
.function .area_function.gray, .function .area_function.white .feature_card {background-color: #F5F6F8;}
.function .area_function.gray .feature_card {background-color: #fff;}
.function .area_function .feature_grid {display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px;}
.function .area_function .feature_grid h3 {font-size: 26px; margin-bottom: 10px; text-align: left}
.function .area_function .feature_card {display: flex; justify-content: space-between; border: 1px solid #eff0f2; border-radius: 24px; overflow: hidden; flex-direction:column;}
.function .area_function .feature_card .img_card {flex: 1 1 60%; display: flex; justify-content: flex-end; align-items: flex-end;}
.function .area_function .feature_card .wrap_title {padding: 40px;}
.function .area_function .feature_card .wrap_title p {font-size: 18px; color: #686868;}
.function .area_function .feature_card.row {flex-direction:row;}
.function .area_function .feature_card.wide {grid-column: 1/-1; flex-direction: row;}
.function .area_function .feature_card.wide .wrap_title {flex: 1 1 40%; display: flex; flex-direction: column;}
.function .area_review_center {padding: 100px 0; display: flex; flex-direction: column; align-items: center; background-color: #E8F5FF;}
.function .area_review_center .title_center {margin: 0; text-align: center; max-width: 1200px; width: 100%;}
.function .area_review_center .title_center h3 {margin-bottom: 12px;}
.function .area_review_center .title_center p {font-size: 24px; color: #666; margin-bottom: 40px;}
.function .area_review_center .title_center img {margin: 0 auto; max-height: 24px;}
.function .area_function .tab_content .tablink .box_thumb img {text-align:center; align-items: center; border-radius: 32px; border: 1px solid #EEEEEE; overflow: hidden;}

.function .area_function .feature_grid .img_patent_logo {position:absolute; top:80px; right:-30px; width:150px; height:150px; background:url('../images/img_patent_logo.png'); display:block;}
.function .area_function .tab_default .img_patent_logo {position:absolute; top:80px; right:-30px; width:150px; height:150px; background:url('../images/img_patent_logo.png'); display:block;}
.function .area_function .cont_wrap .tab-content .img_patent_logo {position:absolute; top:240px; right:-30px; width:150px; height:150px; background:url('../images/img_patent_logo.png'); display:block;}
.function .area_function .tab_content .img_patent_logo {position:absolute; top:210px; right:-30px; width:150px; height:150px; background:url('../images/img_patent_logo.png'); display:block;}


/* 특허 섹션 */
.function .area_patent {background-color:#fff; padding:70px 0;}
.function .area_patent.white {background-color:#fff; padding:0 0 110px;}
.function .area_patent .cont_wrap {display: flex; justify-content:center; gap:140px;}
.function .area_patent .img_patent {width:88px; height:122px; background: url(../images/main_new/2025/img_patent.png);  display: inline-block;}
.function .area_patent .img_patent:after {content:''; width:2px; height:90px; background-color:#d2d2d2; display:block; position:relative; top:20px; left:152px;}
.function .area_patent .txt_box {display:flex; flex-direction:column;}
.function .area_patent .txt_box h4 {font-size:38px; font-weight:500;}
.function .area_patent .txt_box .sub {font-size:22px; color:#888; margin-top:8px;}
.function .area_patent .txt_box .box_tag {display:flex; flex-direction:row; align-items: center; color:#888; gap:10px; font-size:20px; margin-top:12px;}
.function .area_patent .txt_box .box_tag .tag.gray {background-color:#eee; padding:2px 10px; border-radius:6px;}


/* 선물하기 랜딩페이지 */
.function .content_head .visual_wrap {margin: 100px auto 0;}
.function .content_head .visual_wrap img {border-radius:30px;}
.function .content_head .title_wrap .desc {font-size:18px; color:#888;}
.function .area_nav.channel {top:0; border-top: 1px solid #eff3fb; cursor: pointer; border-bottom: 1px solid #eff3fb; background: #fff; position: relative;}
.function .area_nav.channel .inner_flex {margin:0 auto; max-width: 700px; justify-content:space-around; display:flex;}
.function .inner_flex a.current {border-color:#333;}
.function .area_nav.channel a:hover, .gift .area_nav.channel a.current, .gift .area_nav.channel a.active {border-bottom:2px solid #333;}
.function .inner_flex a {background: none; color: #222; display: inline-block; padding: 10px 15px; border-bottom: 2px solid #fff; cursor: pointer;}
.function .inner_flex a.current .tit {color:#333;}
.function .area_nav.channel a:hover .tit, .area_nav.channel a.current .tit, .area_nav.channel a.active .tit {font-weight:600;}
.function .area_nav.channel .tit {line-height: 30px; color: #A2ACB5; font-weight: 500; font-size: 18px;}
.function .tab-content {display:none;}
.function .tab-content.current {display:block;}
.function .title_wrap .light {font-weight:400;}
.function .area_uncomfortable {background: linear-gradient(to bottom, #ffffff 48%, #ffffff 55%, #E6FCFF 100%); padding: 100px 0 150px;}
.function .area_uncomfortable .card_wrap {display: flex; flex-direction: row; justify-content: center; gap: 24px; padding: 12px 0 0;}
.function .area_uncomfortable .card_wrap .card {width:100%; max-height:360px; padding:32px; border:1.5px solid transparent;border-radius:24px;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,rgba(131,235,230,0),rgba(195,237,130,0)) border-box;box-shadow:0 0 12px rgba(0,0,0,0.15); transition: background 0.3s ease;}
.function .area_uncomfortable .card_wrap .card:hover {background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,#B8FFFF,#60CDFF) border-box;}
.function .area_uncomfortable .card_wrap .badge  {display: inline-block; padding: 4px 8px; margin-bottom: 16px; text-align: center; background-color: #F5F6F8; border: 1px solid #F5F6F8; border-radius: 10px; font-size: 16px; color: #9B9C9E;}
.function .area_uncomfortable .card_wrap img {display: block; margin-left: auto; margin-top: 48px; max-width: 104px; width: 100%; height: auto;}
.function .area_uncomfortable .card_wrap p {font-size: 18px; font-weight:normal; line-height: 150%; color: #333; font-weight:600;}
.tab-content .cont_detail h3 {font-size:34px; margin-bottom:28px;}
.tab-content .cont_detail span {font-size:18px; color:#666;}
.tab-content .cont_detail .inner .item_cont {width:1000px; background-color:#fff; text-align:center; margin:0 auto; border-radius:25px; position:relative;}
.tab-content .cont_detail .inner .item_cont .item_wrap {padding:70px 30px 50px;}
.tab-content .cont_detail .inner .item_wrap:last-child {padding:60px 0 100px 0;}
.tab-content .cont_detail .inner .item_thumb {width:670px; margin:55px auto 0; display:flex; background-color:#E3EEFF; border-radius:25px;}
.tab-content .cont_detail .inner .item_wrap .list_func {width:700px; margin:0 auto; display:flex; justify-content:space-around; align-items:center; gap:50px;}
.tab-content .cont_detail .dada {position:absolute; top:360px; right:10%; z-index:1}
.function .area_cont {padding:100px 0;}
.function .area_cont h4 {font-size:26px; font-weight:600; text-align:center; margin-bottom:14px;}
.function .area_cont .txt {color:#888;}
.function .area_cont .subtitle {font-size:20px; font-weight:600; text-align:center; color:#00B3CE; margin-bottom:20px;}
.function .area_cont .tit {margin-bottom:70px;}
.function .area_cont h2 {font-size:42px;}
.function .area_cont .inner .img_wrap {display:inline-block; border-radius:25px; margin-bottom:48px;}
.function .area_cont .wrap_card .inner_flex {justify-content:space-around; width:1100px;}
.function .area_cont .wrap_card .inner_flex .item {text-align:center;}

.gift .area_banner {width: 100%; padding: 100px 0; background-image: url(../images/gift/img_gift_pc_bg_01.png); background-size: cover;}
.gift .point {color:#FD4ED4 !important;}
.gift .area_banner .title_wrap {margin-bottom:0;}
.gift .area_function .info_card.integration {display:flex; flex-direction:row; border-radius:20px; overflow:hidden;}
.gift .area_function.mint {background-color:#EFFAFC;}
.gift .area_function.brand .title_wrap .title {align-items:center; margin-bottom:50px;}
.gift .area_function .desc {font-size:18px; color:#888;}
.gift .area_cont.bg_skyblue {padding:100px 0 100px;}

.ic_recommend {height:66px; background:url("../images/additional/ic_recommend.svg"); display:inline-block;}
.ic_recommend.ic01 {width:54px; background-position:-7px -37px;}
.ic_recommend.ic02 {width:54px; background-position:-80px -37px;}
.ic_recommend.ic03 {width:58px; background-position:-151px -40px;}
.img_arrow {width:22px; height:36px; margin-top:125px; background:url("../images/additional/ic_recommend.svg") -1px 0px; display:inline-block;}

/* 통합메일보안 */
.security .area_banner {width: 100%; padding: 100px 0; background-image: url(../images/security/img_security_pc_bg_01.png); background-size: cover;}
.security .point {color:#3D50FF !important;}
.security .area_banner .title_wrap {margin-bottom:0;}
.security .area_function .info_card.integration {display:flex; flex-direction:row; border-radius:0; overflow:hidden;}
.security .area_function .feature_card {flex-direction:column; padding:40px 40px 45px 40px; background-color:#F5F6F8;}
.security .area_function .feature_card .wrap_title {margin-top:20px; padding:0;}
.security .area_function.mint {background-color:#EFFAFC;}
.security .area_function.brand .title_wrap .title {align-items:center; margin-bottom:50px;}
.security .area_function .desc {font-size:18px; color:#888;}
.security .area_cont.bg_skyblue {padding:100px 0 100px;}
.security .ic_check_mint {width:32px; height:32px; background:url(../images/security/ic_check.png); display:inline-block;}
.security .area_function .tab_content .tablink .box_thumb img {border-radius:0; border:none}

.bg_skyblue {background-color:#F0F7FB;}
.bg_mint {background-color:#EFFAFC;}

/* FAQ */
.area_faq {padding:80px 0 160px;}
.area_box {margin-top:80px; border-top:1px solid #333; border-bottom:1px solid #333;}
.box_qna {border-bottom:1px solid #eee; padding:24px 0;}
.box_qna:first-child {padding-top:36px;}
.box_qna:last-child {padding-bottom:40px;}
.box_qna[open] > .question .ic_detail {background:url(../images/ic_detail.svg) -20px 0 no-repeat;} /* details[open] > summary .화살표클래스*/
.box_qna .answer {margin:16px 0 10px;}
.box_qna .answer li {font-size:18px; color:#999; letter-spacing:-1px;}
.box_qna .answer li .link {font-weight:600; text-decoration:underline; color:#666; margin-top:8px;}
.question p {cursor:pointer; font-size:22px; font-weight:500; color:#333; letter-spacing:-1px; width:85%;}
.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;}
.question::marker {content:''; display:none;}
/* Safari와 Chrome에서 기본 제공되는 화살표 제거 */
details summary::-webkit-details-marker {
  display: none;
} 
/* Firefox에서 기본 제공되는 화살표 제거 */
details[open] summary::marker {
  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;}

/* 고객지원 */
.support .content_head {padding: 140px 0; max-width: none; background:linear-gradient(to bottom, #e6f2ff, #f6fcff,#FFF)}
.support .content_head .title_wrap {max-width: 1200px; margin: 0 auto;}
.support .inner {display: flex; flex-direction: column; max-width: 1200px; margin: 0 auto; gap: 40px;}
.support .area_support {padding: 80px 0;}
.support .area_support p.tit {font-size: 24px; margin-bottom: 8px;}
.support .area_support p.des {font-size: 18px; color: #9B9C9E;}
.support .area_support .cont {display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 32px;}
.support .area_support .support_box {display: flex; flex-direction: column; gap: 20px;}
.support .area_support .support_box .title {width: 100%; padding: 0 8px;}
.support .area_guide {padding: 80px 0 120px 0;}
.support .area_guide .guide_list {display: grid; grid-template-columns: repeat(4,1fr); gap: 24px;}
.support .area_guide .guide_card {display: flex; flex-direction: column; gap: 24px; padding: 48px 24px 32px 32px; width: 100%; background: #FAFAFC; border: 1px solid #EAECEF; border-radius: 16px; transition: border-color 0.15s ease, box-shadow 0.15s ease;}
.support .area_guide .guide_card:hover {border-color: #636465; box-shadow: 0 4px 12px rgba(95, 95, 95, 0.1);}
.support .area_guide .guide_card img {width: 40px; height: 40px;}
.support .area_guide .guide_card .title_wrap {margin-bottom: 0;}
.support .area_guide .guide_card .link {font-size: 14px; text-decoration: underline;}
.support .area_category {padding: 120px 0 100px; background: #F5F6F8;}
.support .area_category .category {display: flex; flex-direction: column; gap: 32px;}
.support .area_category .category .title {display: flex; flex-direction: row; align-items: center; gap: 6px; font-size: 24px; font-weight: 500; color: #1c1c1c; margin: 0;}
.support .area_category .category .title img {width: 32px; height: 32px;}
.support .area_category .category_list {display: flex; flex-direction: column; gap: 56px;}
.support .area_category .function_list {display: grid; grid-template-columns: repeat(auto-fit, minmax(258px, 1fr)); gap: 12px; width: 100%;}
.support .area_category .btn_function { display: flex; align-items: center; justify-content: flex-start; gap: 8px; padding: 16px 24px; background: #fff; border: 1px solid #EAECEF; border-radius: 8px; transition: all 0.15s;}
.support .area_category .btn_function.no-hover {border-color: #EAECEF !important; box-shadow: none; cursor: default;}
.support .area_category .btn_function .desc {flex: 1;}
.support .area_category .btn_function:hover {border-color: #636465;}
.support .area_category .ic_detail {width:24px; height:24px; background:url(../2025/ic_arrow_gray.svg) 0 0 no-repeat; background-size: 24px 24px;}
.support .area_category .btn_function .sprite {width: 24px; height: 24px; background-image: url(../images/main_new/2025/function/support/img_support_pc_04.png); background-size: 864px 104px; background-repeat: no-repeat; flex-shrink: 0;}
.support .tag_soon {font-size: 12px; font-weight: 400; letter-spacing: -1px; padding: 1px 10px 2px 8px; color: #B475FF; border: 1px solid #C69FFD; border-radius: 32px; margin-left: auto;}
.support .area_faq {padding:80px 0 120px;}
.support .area_box {border-top:1px solid #333; border-bottom:1px solid #333;}
.support .box_qna {border-bottom:1px solid #eee; padding:24px 0;}
.support .box_qna .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;}
.support .box_qna:first-child {padding-top:32px;}
.support .box_qna:last-child {padding-bottom:32px;}
.support .question p {cursor:pointer; font-size:20px; font-weight:500; color:#333; letter-spacing:-1px; width:85%;}
.support .content_foot .ic_message {width:24px; height:24px; background:url(../images/main_new/2025/function/support/ic_message.svg); margin-right: 6px;}
.support .content_foot .ic_headset {width:24px; height:24px; background:url(../images/main_new/2025/function/support/ic_headset.svg); margin-right: 6px;}
.work-1 {background-position: 0 0;} .work-2 {background-position: -40px 0;}
.work-3 {background-position: -80px 0;} .work-4 {background-position: -120px 0;}
.work-5 {background-position: -160px 0;} .work-6 {background-position: -200px 0;}
.work-7 {background-position: -240px 0;} .work-8 {background-position: -280px 0;}
.work-9 {background-position: -320px 0;} .work-10 {background-position: -360px 0;}
.work-11 {background-position: -400px 0;} .work-12 {background-position: -440px 0;}
.work-13 {background-position: -480px 0;} .work-14 {background-position: -520px 0;}
.work-15 {background-position: -560px 0;} .work-16 {background-position: -600px 0;}
.work-17 {background-position: -640px 0;} .work-18 {background-position: -680px 0;}
.work-19 {background-position: -720px 0;} .work-20 {background-position: -760px 0;}
.work-21 {background-position: -800px 0;} .work-22 {background-position: -840px 0;}
.hr-1 {background-position: 0 -40px;} .hr-2 {background-position: -40px -40px;}
.hr-3 {background-position: -80px -40px;} .hr-4 {background-position: -120px -40px;}
.hr-5 {background-position: -160px -40px;} .hr-6 {background-position: -200px -40px;} .hr-7 {background-position: -240px -40px;}
.accounting-1 {background-position: 0 -80px;} .accounting-2 {background-position: -40px -80px;}
.accounting-3 {background-position: -80px -80px;} .accounting-4 {background-position: -120px -80px;}
.accounting-5 {background-position: -160px -80px;} .accounting-6 {background-position: -200px -80px;}


/* 회사소개 */
.company .content_head {background:linear-gradient(to top, #DDE8F4, #FFF); max-width:100%;}
.company .content_head .visual_wrap {display:flex; flex-direction:row; border-radius:24px; justify-content:space-between; max-width:1280px; margin:0 auto; background-color:#fff; box-shadow:0px 2px 40px 0px #e6eff5;}
.company .content_head .title_wrap {margin-bottom:70px;} 
.company .content_head .title_wrap .main_title {margin-bottom:20px;} 
.company .content_head .visual_wrap .box_text img {border-radius: 0px;}
.company .visual_wrap .box_text {padding:50px;}
.company .visual_wrap .box_text ul {margin-top:56px;}
.company .visual_wrap .box_text ul li {margin:26px 0; text-align:left;}
.company .visual_wrap .box_text ul li .tit {font-size:16px; font-weight:500; color:#888; width:120px; display:inline-block;}
.company .visual_wrap .box_text ul li .desc {font-size:16px; font-weight:500; color:#333;}
.company .visual_wrap .box_img span img {border-radius:0 24px 24px 0;}
.company .area_info .title_wrap {margin-bottom:50px;}
.company .area_info .title_wrap .title {margin-bottom:40px;}
.company .area_introduce,
.company .area_info,
.company .area_history {padding:120px 0;}s
.company .area_info .title,
.company .area_history .title {margin-bottom:50px;}
.company .area_info .box_cont {display:grid; grid-template-columns: repeat(3,1fr); gap:24px;}
.company .area_info .box {border:1px solid #ddd; border-radius:20px;}
.company .area_info .box .img {display:inline-block; width:100%; height:150px; background-color:#eee; border-radius:20px 20px 0 0;}
.company .area_info .box .img img {margin:0 auto;}
.company .area_info .box .txt {padding:32px;}
.company .area_info .box .txt .tit {font-size:20px; color:#333; margin-bottom:8px;}
.company .area_info .box .txt .desc {font-size:16px; color:#777;}
.company .area_info .box .txt .desclogo{font-size:15px; color:#4AA6E4; margin-top:24px;}
.company .area_info .box .dot {width:5px; height:5px; border-radius:10px; display:inline-block; position:relative; top:-12px; margin-left:10px;}
.company .area_info .box .dot.red {background-color:#F94747;}
.company .area_info .box .dot.blue {background-color:#2B89C7;}
.company .area_info .box_sort {margin-top:24px;}
.company .area_info .box_sort .sort {color:#777; font-size:15px; margin-right:10px;}
.company .area_info .box_sort .sort .dot {width:5px; height:5px; border-radius:10px; display:inline-block; position:relative; top:-3px; margin-right:8px;}
.company .area_info .box_sort .sort .dot.red {background-color:#F94747;}
.company .area_info .box_sort .sort .dot.blue {background-color:#2B89C7;}
.company .area_function .feature_card {display:inline-block; height:490px; background-size:cover !important; background-position:center; background-repeat:no-repeat;}
.company .area_function .feature_grid {margin-bottom:24px;}
.company .area_function .feature_grid:nth-child(1) .feature_card:nth-child(1) {background:url(../images/company/img_company_03.png);}
.company .area_function .feature_grid:nth-child(1) .feature_card:nth-child(2) {background:url(../images/company/img_company_04.png);}
.company .area_function .feature_grid:nth-child(2) .feature_card:nth-child(1) {background:url(../images/company/img_company_05.png);}
.company .area_function .feature_grid:nth-child(2) .feature_card:nth-child(2) {background:url(../images/company/img_company_06.png);}
.company .area_function .feature_card .tit {padding:40px 40px 0;}
.company .area_function .feature_card .tit .title {font-size:28px; color:#fff; font-weight:500;}
.company .area_function .feature_card .tit .desc {font-size:20px; color:#ccc; font-weight:400; margin-top:12px;}
.company .area_function .feature_card .txt {margin-top:38px; padding:0 40px 40px; display:flex; flex-direction:column;}
.company .area_function .feature_card .txt a {margin-bottom:8px;}
.company .area_function .feature_card .txt a .desc {font-size:18px; color:#fff; font-weight:400;}
.company .area_function .feature_card .txt a .blue {font-size:18px; color:#65BFFB; font-weight:400; margin-left:4px;}
.company .area_function .feature_card .txt a .ic_link_circle {width:28px; height:28px; background:url(../images/company/ic_arrow_link.png) -8px -8px; display:inline-block; position: relative; top:8px; margin-left:10px;}
.company .area_function .inner {max-width:1280px;}

/* 중소기업 */
.function.smb .inner_flex a {padding: 12px 0 0; color: #929292;}
.company-list {display:flex; flex-direction:column; justify-content:center; align-items:center; padding:80px 0 150px;}
.company-list .title {text-align:center; font-weight:600; font-size:42px; line-height:150%; color:#333; margin-bottom:100px;}
.company-list .link {margin-bottom:100px;}
.company-list .container_wrap {display:flex; flex-direction:column; gap:10px; width:100%;}
.company-list .container_wrap .marquee_container {overflow:hidden; width:100%; position:relative; height:104px;}
.company-list .container_wrap .marquee_container .marquee_inner {width:200%; display:flex; position:absolute; top:0; animation:50s linear infinite; gap:40px;}
.company-list .container_wrap.mobile .marquee_container .marquee_inner {animation:20s linear infinite; gap:57px;}
.company-list .container_wrap.mobile {display:none;}
.company-list .container_wrap .marquee_container.no1 .marquee_inner {animation-name:marqueeToLeft; left:0;}
.company-list .container_wrap .marquee_container.no2 .marquee_inner {animation-name: marqueeToRight; right: 0;}
.company-list .container_wrap .marquee_container.no3 .marquee_inner {animation-name:marqueeToLeft; left:0;}
.company-list .container_wrap .marquee_container.no4 .marquee_inner {animation-name:marqueeToRight; right:0;}
.company-list .container_wrap .marquee_container .marquee_inner .wrap {display:flex; gap:57px;}

@keyframes marqueeToLeft {
  0% {
    left: 0;
  }
  100% {
    left: -100%;
  }
}

@keyframes marqueeToRight {
  0% {
    right: 0;
  }
  100% {
    right: -100%;
  }
}

.function .area_bulb {width:100%; padding:100px 0; background-image:url(../images/freemium/2025/bg_bulb_blue.png); background-size:cover;}
.function .area_bulb .ic_bulb {margin-bottom:30px; width:52px; height:52px; background-image:url(../images/freemium/2025/ic_bulb.png); display: inline-block;}
.function .area_bulb h2 {color:#fff; font-weight:300;}
.function .area_bulb .bold {font-weight:600;}
.function .area_bulb .title_wrap {text-align:center;}

.function .area_reason {padding:80px 0; background: linear-gradient(to top, #DBF8FF, #FFF);}
.function .area_reason .visual_wrap {margin:100px auto 50px;}

.function .area_function .inner_flex {flex-direction:row; justify-content: space-between; align-items:center;}
.function .area_function .inner_flex h2 {text-align:left; margin-bottom:32px;}
.function .area_function .item_thumb {box-sizing: border-box; background-color: #F5F6F8; border-radius: 32px; overflow: hidden;}

.freemium.function .area_function.white .feature_card .img_card img {width:auto;}
.smb.function .area_function.white .feature_card .img_card img {width:80%;}
.freemium.function .area_function .title_wrap .title,
.smb.function .area_function .title_wrap .title {margin-bottom:30px;}

.freemium.function .area_function.white .feature_card:first-child .img_card img ,
.smb.function .area_function.white .feature_card .img_card img,
.middlemarket.function .area_function.white .feature_card .img_card img {width:80%;}

.freemium.function .area_function.white .feature_card,
.smb.function .area_function.white .feature_card,
.middlemarket.function .area_function.white .feature_card {height:280px;}

.freemium.function .area_function.white .feature_card .img_card,
.smb.function .area_function.white .feature_card .img_card,
.middlemarket.function .area_function.white .feature_card .img_card {flex:100;}

/* AI페이지 */
.ai.function .content_head {padding-bottom: 60px;}
.ai .content_overview {margin: 80px auto 180px; padding: 0; position: relative; z-index: 0;}
.ai .content_overview::before {content: ''; position: absolute; top: -120px; right: -40px; bottom: -220px; left: -40px; background-image: url('/images/main_new/2025/function/ai/img_ai_pc_01.png'); background-size: contain; background-position: center; background-repeat: no-repeat; z-index: -1; border-radius: inherit;}
.ai .content_overview .deco_img01 {position: absolute; top: 190px; left: calc(50% - 600px - 192px); width: 182px; height: 182px; background: url('/images/main_new/2025/function/ai/img_ai_pc_01-1.png') no-repeat center/contain; pointer-events: none; z-index: 10; transform: none;}
.ai .content_overview .deco_img02 {position: absolute; top: 20px; left: calc(50% - 600px + 1076px); width: 300px; height: 300px; background: url('/images/main_new/2025/function/ai/img_ai_pc_01-2.png') no-repeat center/contain; pointer-events: none; z-index: 10; transform: none;}
.ai .content_overview .continues_card {position: relative; display: flex; align-items: stretch; padding: 0; margin: 0 auto; max-width: 1200px; border: 1px solid #eaecef; border-radius: 24px; background-color: #fff; overflow: hidden; box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.02);}
.ai .content_overview .continues_card .contents {display: flex; flex-direction: column; justify-content: space-between; max-width: 300px; width: 100%; border: none; background: linear-gradient(180deg, rgba(228, 254, 255, 0) 5%, rgba(255, 255, 255, 0) 100%), #fff; transition: background 0.5s ease-in-out;}
.ai .content_overview .continues_card .contents:not(:first-child) {border-left: 1px solid #eaecef;}
.ai .content_overview .continues_card .contents:hover {background: linear-gradient(180deg, rgba(228, 254, 255, 1) 5%, rgba(255, 255, 255, 0.9) 100%), #fff;}
.ai .content_overview h3 {font-size: 26px; font-weight: 600; color: #333; line-height: 150%; margin-bottom: 8px; text-align: left;}
.ai .content_overview p {font-size: 18px; font-weight: 400; line-height: 150%; color: #363636;}
.ai .content_overview .text_area {padding: 32px 32px 56px 32px;}
.ai .content_overview img {display: block; max-height: 192px; height: 100%; width: auto; object-fit: contain; margin-top: auto;}
.ai .content_overview span {display: block; margin: 18px auto; max-width: 1200px; color: #868686;}
.ai.function .area_function .tab_content .tablink .box_thumb img {border: none; border-radius: 0;}
.ai .area_banner {margin: 0 auto; padding: 0;}
.ai .area_banner .box {display: flex; flex-direction: row; justify-content: space-between; max-width: 1200px; width: 100%; max-height: 320px; margin: 0 auto; padding: 0; background-color: #191A3C; border-radius: 32px;}
.ai .area_banner .box .wrap {padding: 32px 60px; vertical-align: middle;}
.ai .area_banner h4 {font-size: 28px; font-weight: 500; color: #fff; line-height: 135%; margin-bottom: 16px; text-align: left;}
.ai .area_banner p {font-size: 18px; font-weight: 400; color: #b7b6c2; line-height: 150%; margin-bottom: 24px; text-align: left;}
.ai .area_banner span.tag {display: inline-block; font-size: 16px; font-weight: 600; letter-spacing: -1px; padding: 8px 16px; color: #B475FF; border: 1px solid #C69FFD; border-radius: 32px; margin: 0 0 12px;}
.ai .area_banner span.link {display: flex; align-items: center; justify-content: flex-start; width: 100%; gap: 4px; border-radius: 24px; color: #878787; font-size: 16px; font-weight: 500;}
.ai .area_banner .bn_img > img {height: 100%; width: auto; object-fit: contain; display: block; margin-left: auto; text-align: right;}
.ai .price .inner {max-width: 1200px; margin: 80px auto 180px;}

/* -- 업종별 페이지 시작 -- */
/* 공통 */
.industry p.point, span.point {color:#5ED1A5;}
.industry p.point.top {font-size: 24px; color:#5ED1A5;}
.industry p {font-size: 18px; font-weight: normal; line-height: 150%; color: #333;}
.industry .content_head {padding-bottom: 120px; margin-top:80px;}
.industry .content_head .visual_wrap {margin-bottom: 0;}
.industry .area_uncomfortable {background: linear-gradient(to bottom, #ffffff 48%,#ffffff 55%,#E9FDF6 100%); padding: 100px 0 180px;}
.industry .area_uncomfortable .card_wrap {display: flex; flex-direction: row; justify-content: center; gap: 24px; padding: 12px 0 0;}
.industry .area_uncomfortable .card_wrap .card {width:100%;max-height:340px;padding:32px;border:1.5px solid transparent;border-radius:24px;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,rgba(131,235,230,0),rgba(195,237,130,0)) border-box;box-shadow:0 0 12px rgba(0,0,0,0.15); transition: background 0.3s ease;}
.industry .area_uncomfortable .card_wrap .card:hover {background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,#83EBE6,#C3ED82) border-box;}
.industry .area_uncomfortable .card_wrap .badge {display: inline-block; padding: 4px 8px; margin-bottom: 16px; text-align: center; background-color: #F5F6F8; border: 1px solid #F5F6F8; border-radius: 10px; font-size: 16px; color: #9B9C9E;}
.industry .area_uncomfortable .card_wrap img {display: block; margin-left: auto; margin-top: 48px; max-width: 104px; width: 100%; height: auto;}
.industry .area_bulb {width:100%; padding:100px 0; background-image:url(../images/industry/bg_bulb_green.png); background-size:cover;}
.industry .area_function.middle {padding: 0;}
.industry .content_body > :nth-child(1 of .area_function) { padding-block-start: 180px; }
.industry .content_body > :nth-last-child(1 of .area_function) {padding-block-end: 180px;}
.industry.association .content_body > :nth-last-child(1 of .area_function) {padding-block-end:80px;}
.industry .area_function .info_card { display: flex; flex-direction: row; max-width: 1200px; width: 100%; gap: 32px;}
.industry .area_function .info_card .card {max-width: 380px; width: 100%; text-align: left; margin: 28px 0;}
.industry .area_function .info_card img {border: 1px solid #EEEEEE; border-radius: 24px; margin-bottom: 28px;}
.industry .area_function .info_card .card h3 {font-size: 24px; text-align: left; padding:0 10px 0 10px;}
.industry .area_function .info_card .card p {padding: 4px 10px 0 10px; color: #6E6E73;}
.industry .area_function .info_card.integration {display: flex; flex-direction: row; background-color: #F5F6F8; border: 1px solid #eee; border-radius: 20px; overflow: hidden;}
.industry .area_function .info_card.integration .text {display: flex; flex-direction: column; justify-content: center; gap: 58px; padding-left: 64px;}
.industry .area_function .info_card.integration .text h3 {font-size: 20px; text-align: left; color: #333;}
.industry .area_function .info_card.integration .text p {font-size: 18px; text-align: left; color: #6E6E73;}
.industry .area_function .info_card.integration img {max-width: 840px; width: 100%; margin: 0; border: none; border-radius: none; margin-bottom: 0;}
.industry .area_review .title .name {margin-bottom: 0; font-size: 20px; font-weight: 400; color: #838383;}
.industry .area_navigation .inner {margin: 160px auto 180px;}
.industry .area_navigation .title_wrap img {display: flex; align-items: center; margin: 0 auto 12px; max-width: 102px; width: 100%;}
.industry .area_navigation .navigation_wrap {display: flex; flex-wrap: wrap; gap: 20px; align-items: center; justify-content: space-between; max-width: 1200px; width: 100%; padding: 16px 0; margin: auto;}
.industry .area_navigation .navigation_wrap .card {position:relative; display: flex; flex: 1 1 calc(33.333% - 20px); align-items: center; height: 160px; max-width: 386px; width: 100%; padding: 32px; border: 1px solid #CECECE; border-radius: 24px; box-sizing: border-box;}
.industry .area_navigation .navigation_wrap .card:hover {border-color: #333; box-shadow: 0 0 15px rgba(0,0,0,0.2); cursor: pointer; transition: box-shadow 0.3s ease, border-color 0.3s ease, transform 0.3s ease;}
.industry .area_navigation .navigation_wrap .card .title {display: flex; flex-direction: row; align-items: center; gap: 8px; margin-top: auto;}
.industry .area_navigation .navigation_wrap .card .title p {font-size: 28px; font-weight: 600;}
.industry.association .area_function .info_card.integration {display:flex; justify-content:space-between;}

/* 드라이브 */
.function.drive .content_head .main_title h1 {line-height: 126%;}
.function.drive .content_head .title_wrap .desc {margin-top: 20px;}
.function.drive .content_head .visual_wrap {margin-top: 80px;}
.function.drive .area_intro {background-color: #F7FBFF; max-width: none;}
.function.drive .area_intro {padding: 120px 0;}
.function .area_function.split {margin :84px 0; padding: 0;}
.drive .content_body div:nth-of-type(2).area_function.split {margin-top: 140px !important;}
.drive .content_body div:nth-of-type(5).area_function.split {margin-bottom: 140px !important;}
.function.drive .area_function .inner_flex h2 {margin-bottom: 8px; font-size: 44px;}
.drive .content_body div:nth-of-type(6).area_function {padding: 0 0 140px 0;}
.drive .price .area_comparison {padding: 140px 0;}
.drive .price .area_comparison {background-color: #F7FBFF; padding-inline: 6%;}
.drive .price .area_comparison .tb_price thead tr:first-child th:first-child {background-color: #333;}
.drive .price .tb_price {border-radius: 16px; overflow: hidden; width: 100%; border: 1px solid #E0E0E0; border-collapse: collapse; box-shadow: 0 2px 8px rgba(59, 59, 59, 0.106);}
.drive .price .tb_price tbody {background-color: #fff;}
.drive .price .tb_price .title.mint {color: #71E3FF;padding: 12px 16px;}
.drive .price .tb_price .title.purple {color: #CCB9FF;}
.drive .price .area_comparison thead th:nth-child(3) {border-left: none;}
.drive .price .tb_price tr.name {vertical-align: middle; border-bottom: 1px solid #E0E0E0;}
.drive .price .tb_price tr.name th {vertical-align: middle; background-color: #fff; text-align: center;}
.drive .price .tb_price tr.name th.title {text-align: middle; padding: 32px 0 32px 58px;}
.drive .price .tb_price tr.name th p {font-size: 20px; font-weight: 500; color: #333;}
.drive .price .tb_price tr th {width: 40px; font-size: 20px; font-weight: 500; color: #333;  text-align: left;}
.drive .price .tb_price tr th.title{padding: 20px 0 20px 58px;}
.drive .price .tb_price tr th p.desc {padding-top: 4px; font-size: 16px; font-weight: 400; color: #717171;}
.drive .price .bg.mint {background-color: #F6FDFF; vertical-align: middle; padding: 0;}
.drive .price .bg.purple {background-color: #F9F7FF; vertical-align: middle; padding: 0;}
.drive .btn_wrap .ic_down {background: url(/images/ic_main.svg) no-repeat -129px -60px !important; width: 34px !important;}
.drive .btn_wrap .ic_check {background: url(/images/ic_main.svg) no-repeat -272px -10px !important; width: 34px !important;}



/* 네비게이션 아이콘 */
.industry .area_navigation .ic_industry {display: inline-block; width:32px; height:32px; background:url(../images/industry/ic_industry.svg); background-repeat:no-repeat;}
.industry .area_navigation .ic_industry.arrow {position: absolute; top: 20px; right: 20px; background-position: -240px -32px;}
.card:hover .ic_industry.arrow {background-position: -240px -92px; transition: transform 0.3s ease;}
.industry .area_navigation .ic_industry.make {background-position: -68px -32px;}
.industry .area_navigation .ic_industry.dist {background-position: -128px -32px;}
.industry .area_navigation .ic_industry.build {background-position: -188px -32px;}
.industry .area_navigation .ic_industry.services {background-position: -68px -92px;}
.industry .area_navigation .ic_industry.it {background-position: -128px -92px;}
.industry .area_navigation .ic_industry.association {background-position: -188px -92px;}


/* --- 반응형 --- */
@media (max-width: 999px) {
  /* 리사이징 공통 */
  /* 폰트 (퍼센트) */
  br.m {display:block;}
  br.p {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;}
  p.point {font-size:16px;}

  /* 패딩 */
  .inner {padding: 0;}
  .footer_new .inner {padding: 0 6% !important;}
  .content_head, .content_foot, .main {padding-inline: 6% !important; padding-block: 10% !important;}
  .function .content_body > div[class^="area_"] {padding-inline: 6%; padding-block: 10%;}
  .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 10s 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 .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.brandstory .main.price {background: linear-gradient(to top, #DBF8FF, #FFF); }
  .function.brandstory .area_detail .box_cont .box_line .box {transition: none;}
  .brandstory .area_detail .box_cont .box_line .desc {text-align: left;}
  .brandstory .video_wrap {padding: 0 6%; margin-bottom: 80px;}
  .brandstory .video_area {height:300px;}
  .brandstory .video_area iframe,
  .brandstory .video_area .overlay { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
  .brandstory .text_box .text {font-size: clamp(16px, 4vw, 24px); margin-bottom: 12px;}
  .video_wrap .video_area .btn_wrap { display: flex; flex-direction: row; flex-wrap: nowrap; margin-top: 12px; gap: 12px; padding: 0; }
  .brandstory .video_area .text_box, .brandstory .video_area .btn_wrap {margin-left: 28px;}
  .video_area .btn_wrap {margin-bottom: 32px !important;}
  .brandstory .video_area .btn_wrap a {padding: 0; min-width: 106px !important; max-height: 48px !important; font-size: 16px;}
  .brandstory .video_area .badge { top: -9px; right: 70px; font-size: 12px; padding: 2px 6px 5px; }
}

@media all and (max-width:959px){	
    .content_head .ic_freepc {display:none}
    .btn_wrap {margin-bottom:60px; gap:15px; flex-direction:column; justify-content:center;}
    .btn_wrap a {font-size:18px; border-radius:50px; width:100%;}
    .link {font-size:15px; margin-top:18px; text-align:center; flex-direction:row; justify-content:center;}
    
    /* 중간배너 */
    .area_bn {margin:0 0 60px;}
    .area_bn .link_bn_pc {display:none;}
    .area_bn .link_bn_mo {display:block;}
    .area_bn .link_bn_mo a {display:flex; justify-content:center; border-radius: 6px;}
  
    /* 혜택&이벤트 페이지 */
    .brandstory .list_func .item_cont {width: 100%; padding:50px 0 0; text-align:center;}
    .brandstory .list_func .item_thumb {flex: 100%; margin:0;}
    .brandstory .item_cont h3 {text-align:center; margin-top:10px;}
    .brandstory .area_tab {margin:0 0 50px;}
    .brandstory .area_top,
    .brandstory .area_brandstory {padding:40px 0;}
    .brandstory .area_brandstory .list_func .item {padding:50px 0 0;}
    .brandstory .area_brandstory .list_func .item:first-child {padding:50px 0 0;}
    .brandstory .area_brandstory .list_func .item:last-child {padding:50px 0 50px;}
    .brandstory .area_brandstory .wrap:first-child {margin-bottom:40px;}
    .brandstory .area_brandstory .wrap.last {padding-top:10px;}
    .brandstory .area_govt,
    .brandstory .area_event {padding:80px 0;}
    .brandstory .area_govt .cont_box {margin-top:60px; flex-direction:column;}
    .brandstory .area_govt .box {border-radius:20px; padding:40px 0 0;}
    .brandstory .area_govt .title h3 {font-size:22px;}
    .brandstory .area_govt .title p.s1 {font-size:16px;}
    .brandstory .area_govt .title:after {width:70%;}
    .brandstory .area_govt .box .col .meta dt {flex:inherit; width:100%;}
    .brandstory .area_govt .box .col .meta dd {margin:0;}
    .brandstory .area_govt .box .col .meta > li {margin-left:8%;}
    .brandstory .area_govt .box.last .col .meta > li {margin-left:13%;}
    .brandstory .area_govt .box:last-child .btn_wrap .btn_ghost {margin:0;}
    .brandstory .area_event .list_func .item {padding:0}
    .brandstory .area_event .list_func .item_cont {padding:70px 0 50px 0;}
    .brandstory .company-list {padding:0 0 30px;}
    .brandstory .company-list .title {font-size:28px; line-height:150%; margin-bottom:50px;}
    .brandstory .company-list .container_wrap.pc {display:none;}
    .brandstory .company-list .container_wrap.mobile {display:flex;}
    .brandstory .company-list .container_wrap .marquee_container {height:45px;}
    .brandstory .btn_wrap {padding:0 6%;}
    .brandstory .section_card {margin:40px auto 0;}
    .brandstory .bg_img_card .layout_card {height:auto; margin:0 0 40px;}
    .brandstory .layout_card .con {padding:40px 0 35px 40px;}
    .brandstory .layout_card .con .tit {font-size:20px;}
    .brandstory .layout_card .link {text-align:left; justify-content:left;}
  
    .brandstory .wrap_card .layout_card {margin:0 0 30px;}
    .brandstory .wrap_card .txt_card_box img {margin:30px 0;}
  
    .brandstory .list_func.area_guide .item_thumb {margin:30px 0px 30px 0px;}
    .brandstory .list_func.area_guide .item_thumb img {width:100%;}
    .brandstory .list_func.area_guide .label2.bl img {text-align:center; display:inline-block;}
    .brandstory .list_func.area_guide .item_cont .desc {font-size:15px;}
    .brandstory .list_func.area_guide .item_cont .title {font-size:24px;}
    .brandstory .list_func.area_guide button.slick-prev, .brandstory .list_func.area_guide button.slick-next {top:50%;}





  /* 경리관리 */
  .function.payroll .area_review .review_inner>.review_navigation:first-of-type{left:0; margin-left:0;}
  .function.payroll .area_review .review_inner>.review_navigation:last-of-type{right:0; margin-right:0;}

  /*고객지원*/
  .support .area_guide .guide_list {grid-template-columns: repeat(2,1fr);}

  /* ai */
  .ai .content_overview .continues_card {flex: 1 1 60%; align-items: stretch;}
  .ai .content_overview::before {display: none;}
  .ai .content_overview .deco_img01 {display: none;}
  .ai .content_overview .deco_img02 {display: none;}
  .ai .area_banner .box {max-height: none;}
  .ai .area_banner .box .wrap {padding: 40px 32px;}
  .ai .area_banner .bn_img > img {display: none;}
  .price .area_faq, .ai .content_overview {padding-inline: 6%; margin: 0;}
  .ai .price .inner {margin: 0 0 80px;}

  /* FAQ */
  .box_qna .answer li {font-size:14px;}
  .question p {font-size:16px;}

  /* 선물하기 */
  .gift .inner, .security .inner {padding:0 6%;}

  .function .area_uncomfortable .card_wrap {flex-direction: column;}
  .function .area_uncomfortable .card_wrap img {max-width: 64px}
  .gift .area_banner {background-image: url(../images/gift/img_gift_mo_bg_01.png);}
  .security .area_banner {background-image: url(../images/security/img_security_mo_bg_01.png);}

  
  .function .content_head .title_wrap .desc {font-size:16px;}
  .function .content_head .visual_wrap {margin:50px auto 0;}
  .function .content_head .visual_wrap img {border-radius:15px;}
  .function .area_cont.bg_skyblue {padding:50px 0;}
  .function .area_nav.channel {padding-block:0 !important;}
  .function .area_uncomfortable {padding:50px 0 70px;}
  .function .area_function .desc {font-size:16px;}
  .function .area_function {padding:50px 0;}
  .function .cont_detail h3 {font-size:24px;}
  .function .cont_detail .dada {display:none;}
  .function .cont_detail span {font-size:16px;}
  .function .cont_detail .inner .item_cont {width:auto;}
  .function .cont_detail .inner .item_cont .item_wrap {padding:50px 30px 50px;}
  .function .cont_detail .inner .item_thumb {width:100%; border-radius:15px; margin:45px auto 0;}
  .function .cont_detail .inner .item_wrap .list_func {width:70%; padding:0; flex-direction: column; gap:0;}
  .function .cont_detail .inner .item_wrap .list_func li {margin-bottom:20px;}
  .function .cont_detail .inner .item_wrap .list_func li span {margin-bottom:10px;}
  .function .cont_detail .inner .item_wrap .list_func li:last-child {margin-bottom:0;}
  .function .cont_detail .inner .item_wrap:last-child {padding:20px 0 60px 0;}
  .function .img_arrow {display:none;}
  .function .area_cont h2 {font-size:28px;}
  .function .area_cont .wrap_card .inner_flex {width:auto; gap:30px;}
  .function .area_cont {padding:50px 0;}
  .function .area_cont .tit {margin-bottom:40px;}
  .function .area_cont .inner .img_wrap {margin-bottom:28px;}
  .function .area_cont h4 {font-size:22px;}
  .function .area_box {margin-top:40px;}
  .function .area_function .feature_grid .img_patent_logo {display:none;}
  .function .area_function .tab_default .img_patent_logo {display:none;}
  .function .area_function .cont_wrap .img_patent_logo {display:none;}
  .function .area_function .cont_wrap .tab-content .img_patent_logo {display:none;}

  .security .tab_default {gap:0; font-size:14px;}
  .security .tab_content {margin-top:30px;}
  .security .area_function .title_wrap .title {margin-bottom:30px;}
  .security .area_function .feature_grid {width:100%;}
  .security .area_function .feature_card {padding:30px;}
  .security .area_function .feature_grid .feature_card .wrap_title {padding:0 !important; margin-top:20px;}

  /* 업종별 페이지 */
  .industry .area_uncomfortable .card_wrap {flex-direction: column;}
  .industry .area_uncomfortable .card_wrap img {max-width: 64px}
  .function.industry .area_function .title_wrap {align-items: flex-start;}
  .function .area_review img {height:auto; width: 60%;}
  .industry .area_uncomfortable .card_wrap .badge {font-size:12px;}
  .industry .area_function .info_card { flex-direction: column; }
  .industry .area_function .info_card img {margin-bottom: 16px;}
  .industry .area_function .info_card .card {max-width: none; margin: 0;}
  .industry .area_function .info_card.integration {flex-direction: column;}
  .industry .area_function .info_card.integration .text {padding: 32px 24px; gap: 32px;}
  .industry .area_navigation .inner {margin: 0;}
  .function.industry .title_wrap {margin-bottom: 12px;}
  .industry p {font-size:14px;}
  .function .area_review .title p {margin-bottom:20px;}
  .industry .area_uncomfortable p {font-size:16px;}
  .industry .area_function .info_card.integration .text p {font-size:16px; margin-top:4px;}
  .industry .area_function .info_card .card h3 {font-size:18px;}
  .function .area_review .title h3 {font-size:28px;}
  .industry .area_navigation .navigation_wrap .card {height:110px;}
  .industry .area_navigation .navigation_wrap .card .title p {font-size:22px;}
  .industry .area_navigation .ic_industry.arrow {top:37px;}
  .industry .area_navigation .navigation_wrap .card .title {margin-top:0;}
}

@media (max-width:960px) {
  .function .area_detail .hover {display:none;}
  .function .area_detail .box_cont .box_line .box {transition:none; width:100%;}
  .function .area_detail .box_cont .box_line .box:hover {background:#f5f6f8 !important; box-shadow:none; width:100%;} 
  .function .area_detail .box_cont .box_line .box .hover {display:none !important;} 
  .function .area_detail .box_cont .box_line .box:hover .normal {display: flex !important;} 
}

@media (max-width: 768px) {
  /* 모바일 이미지 */
  img.pc {display: none !important;}
  img.mo {display: block !important;}

  /* 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: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 .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 {grid-template-columns: 1fr; gap: 32px; width: 100%;}
  .function .area_function .feature_card.wide {flex-direction: column;}
  .function .area_function .feature_card .wrap_title {padding: 32px 32px 0 32px;}
  .function .area_intro.sub .cont_wrap .box_cont .cont {padding: 32px; gap: 0px;}

  /* 드라이브 */
  .function.drive .content_head .visual_wrap {margin: 36px 0 0;}
  .function.drive .area_intro .inner {gap: 0;}
  .function.drive .area_function .item_thumb {margin-top: 0;}
  .function.drive .area_function .inner_flex h2 {font-size: 28px; margin-bottom: 8px;}
  .function .area_function.split {margin: 0;}
  .drive .content_body div:nth-of-type(2).area_function.split {margin-top: 32px !important;}
  .drive .content_body div:nth-of-type(5).area_function.split {margin-bottom: 32px !important;}
  .drive .price .tb_price tbody .name th:nth-child(2),.drive .price .tb_price tbody .name th:nth-child(3) {width:5%;}
  .drive .price .tb_price th.m2 h3 {top: 0; padding: 12px 16px;}
  .drive .price .tb_price tr.name th.title, .drive .price .tb_price tr th.title {padding: 12px 16px;}
  .drive .price .tb_price tr.name th p {font-size: 16px;}
  .drive .price .tb_price tr th.title {font-size: 16px;}
  .drive .price .tb_price tr th p.desc {font-size: 13px;}
  .drive .content_body div:nth-of-type(6).area_function {padding-inline: 6%; padding-bottom: 0;}
  
  
  /* 소개페이지 */
  .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:none; 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, .function.brandstory .main .area_detail {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;}

  /* 특허 섹션 */
  .function .area_patent {padding:20px 0 80px;}
  .function .area_patent .cont_wrap {flex-direction:column; align-items:center; gap:40px;}
  .function .area_patent .img_patent {width:88px; height:122px; background: url(../images/main_new/2025/img_patent.png);  display: inline-block;}
  .function .area_patent .img_patent:after {display:none;}
  .function .area_patent .txt_box {align-items:center;}
  .function .area_patent .txt_box h4 {font-size:24px;}
  .function .area_patent .txt_box .sub {font-size:16px;}
  .function .area_patent .txt_box .box_tag {font-size:16px; margin-top:12px;}

  /* 필수확인자료 */
  .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}

  /*고객지원*/
  .support .area_guide .guide_list {grid-template-columns: repeat(1,1fr);}

  /* 회사소개 */
  .company .content_head .visual_wrap {flex-direction: column-reverse;}
  .company .content_head .title_wrap {margin-bottom:40px;}
  .company .content_head .title_wrap .main_title {margin-bottom:2px;}
  .company .content_head .visual_wrap .box_text span img.mo {width:auto;}
  .company .content_head .visual_wrap img,
  .company .area_introduce img,
  .company .area_history img {width:100%;}
  .company .visual_wrap {margin:50px auto 50px;}
  .company .visual_wrap .box_img span img {border-radius:0;}
  .company .visual_wrap .box_text {padding:24px;}
  .company .visual_wrap .box_text ul {margin-top:20px;}
  .company .visual_wrap .box_text ul li {margin:7px 0;}
  .company .visual_wrap .box_text ul li .tit {width:30%; font-size:13px;}
  .company .visual_wrap .box_text ul li .desc {font-size:13px;}
  .company .visual_wrap .box_text ul li:nth-child(3) {display:flex;}
  .company .visual_wrap .box_text ul li:nth-child(3) .tit {margin-right:21px;}
  .company .area_info .title,
  .company .area_history .title {margin-bottom:30px;}
  .company .area_info .box .txt {padding:24px;}
  .company .area_info .box .txt .tit {font-size:16px; margin-bottom:4px;}
  .company .area_info .box .txt .desc {font-size:14px;}
  .company .area_info .box .txt .desclogo {font-size:14px; margin-top:14px;}
  .company .area_info .box .dot {margin-left:6px;}
  .company .area_info .box_cont {grid-template-columns: repeat(1, 1fr);}
  .company .area_info .box .img {height:110px;}
  .company .area_function .feature_card .txt a .desc,
  .company .area_function .feature_card .txt a .blue {font-size:14px;}
  .company .area_function .feature_card .txt a .ic_link_circle {width:24px; height:24px; background:url(../images/company/ic_arrow_link.png) -52px -8px; top:5px; margin-left:5px;}
  .company .area_function .feature_card .tit .title {font-size:16px;}
  .company .area_function .feature_card .tit .desc {font-size:14px;}
  .company .area_function .feature_card .txt a {margin-bottom:4px;}
  .company .area_function .feature_card {height:390px;}
  .company .area_function .feature_card .tit {padding:34px 34px 0;}
  .company .area_function .feature_card .txt {padding:34px 34px 0; margin-top:0;}
  .company .area_function .feature_grid {gap:16px;}

  /* ai */
  .ai .content_overview .continues_card {flex-direction: column;  border-bottom: 1px solid #eaecef; }
  .ai .content_overview .continues_card .contents {max-width: none; border-bottom: 2px solid #eaecef !important;}
  .ai .content_overview img {margin-right: 0; max-height: none;}

  /* 소기업 */
  .company-list {padding:50px 0 30px;}
  .company-list .title {font-size:28px; line-height:150%; margin-bottom:50px;}
  .company-list .container_wrap.pc {display:none;}
  .company-list .container_wrap.mobile {display:flex;}
  .company-list .container_wrap .marquee_container {height:45px;}
  
  .function .area_detail .cont_wrap {max-width:100%;}
  .function .area_function.white .feature_card {flex-direction:column !important;}
  .function .area_detail .box_cont .box_line {display:flex; flex-direction:column; align-items:center;}
  .function .area_function .title_wrap {align-items:flex-start; margin-bottom:0; padding:0;}
  .function .area_reason .visual_wrap {margin:0;}
  .function .area_bulb {background-color:#39A7FE;}
  .function .area_function .item_thumb {border-radius:24px; margin-top:24px;}
  .function .area_function .inner_flex h2 {margin-bottom:0;}

  .freemium.function .area_function.white .feature_card .img_card img,
  .smb.function .area_function.white .feature_card .img_card img {width:80%;}

  .freemium.function .area_function.white .feature_card,
  .smb.function .area_function.white .feature_card,
  .middlemarket.function .area_function.white .feature_card {height:auto;}

  .freemium.function .area_function .feature_grid .feature_card .wrap_title,
  .smb.function .area_function .feature_grid .feature_card .wrap_title,
  .middlemarket.function .area_function .feature_grid .feature_card .wrap_title {padding: 40px 0 0 40px;}
  .middlemarket.function .area_function .title_wrap {display:flex; align-items: stretch;}  

    /* 업종별 */
  .industry .area_navigation .navigation_wrap .card {min-width: 178px;}
}


@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.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-size: 20px;}
  .function .area_function .feature_grid .wrap_title p {font-size: 16px;}

  /* 탭 및 버튼 리사이징 */
  .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 p, .function .area_review_center .title_center p  {font-size: 16px; line-height: 150%; color: #888;}

  /* 소개페이지 아이콘 히든처리 */
  .function.brandstory .ic_conpany.s, .function.brandstory .ic_conpany.m, .function.brandstory .ic_conpany.l{display: none;}

  /*고객지원 모바일 히든처리*/
  .support {display: none;}

  /* AI */
  .ai .price .area_faq {padding-bottom: 0!important; padding-top: 0!important;}

  /* 업종별 */
  .industry .area_navigation .navigation_wrap .card {min-width: 330px;}

  /* 고객사 롤링 */
  .function .area_rolling .rolling_box .cont img {margin: 0 14px; height: 60px;}
}


/* 완전한 터치 디바이스 환경 */
@media (hover: none) and (pointer: coarse) {
  .header .btn_wrap {
      display: none !important;
    }
    #chatbot-widget-message-bubbles-container {
      display: none !important;
    }
}

/* Winback */
.winback {
  --card: #232425;
  --card-2: #2a2a2d;
  --text: #fff;
  --sub: rgba(255, 255, 255, 0.7);
  --sub-2: rgba(255, 255, 255, 0.8);
  --mint: #7cf5ff;
  --blue: #91D1FF;
  --purple: #b792ff;
  --grad-mint: linear-gradient(120deg, #7cf5ff 10%, #5da9ff 90%);
  --grad-cta: linear-gradient(90deg, #7cf5ff 0%, #5d88ff 50%, #b792ff 100%);
  background-color: #101010;
  color: var(--text);
  font-size: 18px;
}

.winback .inner { padding: 0 80px; }
.winback .area { padding: 140px 0; }

.winback h1, .winback h2, .winback h3 {color: var(--text);}
.winback h1 {font-size: 56px; margin-top: 8px; }
.winback h1 span.sub {font-size: 36px; font-weight: 400; color: #fff;}
.winback h2 {margin-top: 8px; }
.winback h3 {font-size: 36px; margin-top: 12px; }
.winback h4 {font-size: 28px; margin-top: 16px; text-align: center;}
.winback p { font-size: 24px; color: var(--sub); margin-top: 16px; text-align: center;}
.winback p.desc { margin-top: 12px; font-size: 20px; text-align: center; }

.winback .ic { display: flex; align-items: center; justify-content: center; }

.winback .btn_wrap a { background-color: #72F1FF; padding: 18px 32px; font-size: 22px; font-weight: 600; }
.winback .area_hero { padding: 150px 0 120px 0; background: radial-gradient(75% 55% at 50% 72%, rgba(170, 228, 255, 0.9) 0%, rgba(103, 235, 255, 0.5) 32%, rgba(13, 22, 40, 0) 66%), radial-gradient(120% 80% at 82% 26%, rgba(161, 130, 255, 0.28) 0%, rgba(13, 22, 40, 0) 55%), linear-gradient(180deg, #0a1020 0%, #0e1d36 55%, #103056 100%); overflow: hidden; }
.winback .area_hero .btn_wrap { margin-top: 32px; display: flex; justify-content: center; }
.winback .area_hero .area_customer { width: 100vw; margin-left: calc(50% - 50vw); }
.winback .area_hero .hero_visual { position: relative; margin-top: 56px; text-align: center; }
.winback .area_hero .hero_visual .dashboard { width: 100%; max-width: 1200px; height: auto; border-radius: 16px; margin: 0 auto; }
.winback .area_hero .hero_visual .character { position: absolute; right: -6%; bottom: 8%; width: 400px; height: auto; }
.winback .area_hero .stats { display: flex; margin: -60px auto 0; max-width: 1200px; position: relative; z-index: 2; background: #2E2F30; border-radius: 0 0 24px 24px; padding: 56px 0; }
.winback .area_hero .stats .stat { flex: 1; text-align: center; border-right: 1px solid #3a3b3d; }
.winback .area_hero .stats .stat:last-child { border-right: 0; }
.winback .area_hero .stats .stat .label { display: inline-flex; align-items: center; gap: 8px; margin-right: 10px; font-size: 22px; font-weight: 500; color: #d5d7da; }
.winback .area_hero .stats .stat .label img { width: 40px; height: 40px; }
.winback .area_hero .stats .stat .num { color: var(--text);}
.winback .area_hero .stats .stat .num b { font-size: 64px; font-weight: 500; }
.winback .area_hero .stats .stat .num span { font-size: 28px; margin-left: 4px; }

.winback .area_feature .cards { margin-top: 64px; display: flex; flex-direction: column; gap: 24px; }
.winback .area_feature .row_card { display: flex; align-items: stretch; background: var(--card); border-radius: 24px; overflow: hidden; }
.winback .area_feature .row_card p.desc { text-align: left; margin-top: 0;}
.winback .area_feature .row_card .thumb { flex-shrink: 0; width: 284px; display: flex; align-items: center; justify-content: center; padding: 0 24px 0 56px; }
.winback .area_feature .row_card .thumb img { width: 180px; height: 180px; object-fit: contain; }
.winback .area_feature .row_card .text { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 8px; padding: 56px 64px 64px 12px; }
.winback .area_feature .row_card .text h3 { background: var(--grad-mint); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; width: fit-content; }

.winback .area_worry .cases { margin-top: 64px; display: flex; flex-direction: column; gap: 24px; }
.winback .area_worry .case_box { background: var(--card); border-radius: 24px; padding: 48px 40px 24px; text-align: center; }
.winback .area_worry .badge { display: inline-block; padding: 6px 18px; border-radius: 100px; font-size: 20px; font-weight: 500; }
.winback .area_worry .case_box.c1 .badge { background: #303E49; color: #91D1FF; }
.winback .area_worry .case_box.c2 .badge { background: #3B345A; color: #B6A6FF; }
.winback .area_worry .case_box h3 { margin-top: 20px;}
.winback .area_worry .talk { position: relative; margin-top: 24px; min-height: 220px; }
.winback .area_worry .talk .character { display: block; margin: 0 auto; position: relative; z-index: 1; width: 200px; height: auto; }
.winback .area_worry .talk .bubble { position: absolute; bottom: auto; right: auto; z-index: 2; margin: 0; display: inline-block; background: #fff; color: #333; font-size: 20px; font-weight: 500; line-height: 1.4; letter-spacing: -0.5px; padding: 10px 18px; border-radius: 16px; white-space: nowrap; box-shadow: 0 4px 12px rgba(119, 246, 255, 0.4); transform: translateX(var(--tx, 0)); animation: wbBubbleFloat 2.6s ease-in-out infinite; }
.winback .area_worry .case_box.c2 .talk .bubble {box-shadow: 0 8px 20px rgba(228, 119, 255, 0.4);}
.winback .area_worry .talk .bubble::after { display: none; }
.winback .area_worry .talk .bubble:nth-of-type(1) { left: 50%; top: 24px; --tx: calc(-100% - 80px); animation-delay: 0s; }
.winback .area_worry .talk .bubble:nth-of-type(2) { left: 50%; top: 116px; --tx: calc(-100% - 130px); animation-delay: 0.5s; }
.winback .area_worry .talk .bubble:nth-of-type(3) { left: 50%; top: 76px; --tx: 100px; animation-delay: 0.9s; }
@keyframes wbBubbleFloat { 0%, 100% { transform: translateX(var(--tx, 0)) translateY(0); } 50% { transform: translateX(var(--tx, 0)) translateY(-6px); } }
.winback .area_worry .worry_banner {background: var(--grad-cta); border-radius: 16px; padding: 64px; text-align: center; font-size: 32px; letter-spacing: -1px;}
.winback .area_worry .worry_banner b { font-weight: 600; }

.winback .area_solution { background: radial-gradient(100% 60% at 50% 0%, rgba(60, 90, 160, 0.18) 0%, rgba(16, 16, 16, 0) 60%), #101010; }
.winback .area_solution .case_group + .case_group { margin-top: 130px; }
.winback .area_solution .case_head { text-align: center; }
.winback .area_solution .case_head .cat { display: inline-block; font-size: 20px; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
.winback .area_solution .case_group.c1 .cat,
.winback .area_solution .case_group.c1 p.blue { color: var(--blue); }
.winback .area_solution .case_group.c2 .cat,
.winback .area_solution .case_group.c2 p.purple { color: var(--purple); }
.winback .area_solution .case_head h2 { margin-top: 20px;}
.winback .area_solution .feature_grid { margin-top: 56px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.winback .area_solution .feature_grid .item { display: flex; align-items: center; gap: 16px; background: var(--card-2); border-radius: 16px; padding: 32px 40px; }
.winback .area_solution .feature_grid .item .ic { flex-shrink: 0; width: 48px; height: 48px; }
.winback .area_solution .feature_grid .item h4 {color: var(--text); text-align: left; margin-top: 0; }
.winback .area_solution .step_grid { margin-top: 56px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.winback .area_solution .step_grid .step { background: var(--card-2); border-radius: 24px; padding: 40px 24px; text-align: center; }
.winback .area_solution .step_grid .step .ic { width: 48px; height: 48px; margin: 0 auto; }
.winback .area_solution img,
.winback .area_method img { width: 48px; height: 48px; }

.winback .area_method { background: radial-gradient(110% 70% at 70% 50%, rgba(60, 100, 170, 0.28) 0%, rgba(16, 16, 16, 0) 60%), #101010; }
.winback .area_method .method_grid { margin: 64px auto 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; max-width: 1040px; }
.winback .area_method .method_grid .card { background: rgba(22, 24, 30, 0.7); border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 24px; padding: 48px 24px;}
.winback .area_method .method_grid .card .ic { width: 64px; height: 64px; margin: 0 auto; }

.winback .area_lead { background: #F5FDFF; padding: 100px 0 120px; }
.winback .area_lead .inner { display: flex; justify-content: space-between; gap: 80px; }
.winback .area_lead .content_head { flex: 1; margin: 0; padding: 0; text-align: left; }
.winback .area_lead .content_head h2 { color: #1c1c1c; text-align: left;}
.winback .area_lead .content_head p {color: #6b6b6b; text-align: left;}
.winback .area_lead .content_body { flex-shrink: 0; width: 460px; color: #333; }
.winback .area_lead form { width: 100%; padding: 40px; box-sizing: border-box; background: #fff; border: 1px solid #e6ebf5; border-radius: 20px; box-shadow: 0 16px 40px rgba(60, 80, 150, 0.1); }
.winback .area_lead .wrap_row .row { margin-top: 16px; }
.winback .area_lead .wrap_row .row:first-child { margin-top: 0; }
.winback .area_lead .wrap_terms { margin-top: 24px; }
.winback .area_lead .list_terms li { font-size: 15px; }
.winback .area_lead .list_terms li + li { margin-top: 8px; }
.winback .area_lead .wrap_btn { margin-top: 28px; }
.winback .area_lead .wrap_btn .btn_major { display: block; width: 100%; padding: 16px; border-radius: 999px; background: #4eacff; color: #fff; font-size: 18px; font-weight: 600; line-height: normal; }
.winback .area_lead .wrap_btn .btn_major:hover { background: #3a9cf0; }

.winback .modal_content { color: #333; }
.winback .modal_content p { font-size: 16px; text-align: left; margin-top: 4px;}
.winback .modal_content h3 { font-size: 24px; color: #222; }
.winback .modal_content p:not(.text_point) { color: #555; }
.winback .modal_content .ic_com.close { position: absolute; top: 20px; right: 10px; cursor: pointer; }
/* ===== 반응형 — 폰트는 공통 태그(h1~h4 / p / p.desc) 기준으로 한 번에 축소하고,
   span·div 등 태그로 안 잡히는 예외와 레이아웃 변경만 개별 지정한다. ===== */
@media (max-width: 1023px) {
  /* 공통 폰트 */
  .winback h1 { font-size: 44px; }
  .winback h1 span.sub { font-size: 28px; }
  .winback h2 { font-size: 34px; }
  .winback h3 { font-size: 28px; }
  .winback h4 { font-size: 24px; }
  .winback p { font-size: 20px; }
  .winback p.desc { font-size: 18px; }

  .winback .area { padding: 90px 0; }

  /* FEATURE: 가로 카드 → 세로 */
  .winback .area_feature .row_card { flex-direction: column; text-align: center; }
  .winback .area_feature .row_card .thumb { width: 100%; padding: 32px 24px 0; }
  .winback .area_feature .row_card .thumb img { width: 140px; height: 140px; }
  .winback .area_feature .row_card .text { align-items: center; padding: 24px 32px 40px; }

  /* SOLUTION: 스텝 3 → 1열 */
  .winback .area_solution .case_group + .case_group { margin-top: 80px; }
  .winback .area_solution .step_grid { grid-template-columns: 1fr; }

  /* LEAD: 2단(좌 텍스트 / 우 폼) → 1단 세로 */
  .winback .area_lead { padding: 80px 0; }
  .winback .area_lead .inner { flex-direction: column; gap: 40px; }
  .winback .area_lead .content_head { text-align: center; }
  .winback .area_lead .content_head h2,
  .winback .area_lead .content_head p { text-align: center; }
  .winback .area_lead .content_body { width: 100%; max-width: 560px; margin: 0 auto; }
}

@media (max-width: 767px) {
  /* 공통 폰트 */
  .winback h1 { font-size: 32px; letter-spacing: -1.5px; }
  .winback h1 span.sub { font-size: 20px; }
  .winback h2 { font-size: 24px; }
  .winback h3 { font-size: 22px; }
  .winback h4 { font-size: 18px; }
  .winback p { font-size: 16px; }
  .winback p.desc { font-size: 15px; }

  .winback .inner { padding: 0 20px; }
  .winback .area { padding: 70px 0; }

  /* HERO */
  .winback .area_hero { padding: 110px 0; }
  .winback .area_hero .hero_visual { margin-top: 40px; }
  .winback .area_hero .hero_visual .character { width: 280px; right: -8%; bottom: 12%; }
  .winback .area_hero .stats { flex-direction: column; margin-top: -30px; padding: 8px 0; border-radius: 0 0 16px 16px; }
  .winback .area_hero .stats .stat { border-right: 0; border-bottom: 1px solid #3a3b3d; padding: 28px 0; }
  .winback .area_hero .stats .stat:last-child { border-bottom: 0; }
  .winback .area_hero .stats .stat .label { font-size: 18px; }
  .winback .area_hero .stats .stat .label img { width: 28px; height: 28px; }
  .winback .area_hero .stats .stat .num b { font-size: 44px; }
  .winback .area_hero .stats .stat .num span { font-size: 20px; }
  .winback .area_hero .stats .stat .cap { font-size: 14px; }

  /* FEATURE */
  .winback .area_feature .cards { margin-top: 40px; }

  /* WORRY (제목 외 span·div 폰트 예외) */
  .winback .area_worry .cases { margin-top: 40px; }
  .winback .area_worry .case_box { padding: 32px 20px 16px; }
  .winback .area_worry .badge { font-size: 16px; }
  .winback .area_worry .worry_banner { font-size: 20px; padding: 24px 20px; }
  .winback .area_worry .talk { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 0; }
  .winback .area_worry .talk .bubble,
  .winback .area_worry .talk .bubble:nth-of-type(1),
  .winback .area_worry .talk .bubble:nth-of-type(2),
  .winback .area_worry .talk .bubble:nth-of-type(3) { position: static; left: auto; top: auto; transform: none; animation: none; font-size: 14px; padding: 10px 14px; white-space: normal; }
  .winback .area_worry .talk .character { width: 100px; }

  /* SOLUTION */
  .winback .area_solution .case_head .cat { font-size: 16px; }
  .winback .area_solution .feature_grid { grid-template-columns: 1fr; margin-top: 36px; gap: 16px; }
  .winback .area_solution .feature_grid .item { padding: 24px; }
  .winback .area_solution .step_grid { margin-top: 36px; }

  /* METHOD */
  .winback .area_method .method_grid { grid-template-columns: 1fr; margin-top: 40px; gap: 16px; }
  .winback .area_method .method_grid .card { padding: 36px 24px; }

  /* SOLUTION·METHOD 아이콘 */
  .winback .area_solution img,
  .winback .area_method img { width: 40px; height: 40px; }

  /* LEAD */
  .winback .area_lead { padding: 60px 0; }
  .winback .area_lead form { padding: 28px 20px; }

  /* 고객사 롤링 (공통 컴포넌트) */
  .function .area_customer { padding: 0; }
  .function .area_customer .marquee_container .marquee_inner .wrap { gap: 16px; }
}


/* ==========================================================================
  메일 AI 섹션 (.area_ai_mail)x
========================================================================== */

/* 메일 AI 태그 컬러 */
.function .area_function .title_wrap .title p.label.ai {color: #8467E2; background-color: #F0EEFF;}

/* area_function.mail_ai — 섹션 배경은 흰색, 카드에 연보라 그라데이션 (메일 페이지 전용) */
.function .area_function.mail_ai {background-color: #fff;}
.function .area_function.mail_ai .feature_card {border-color: #EFEFF1; background: linear-gradient(105deg, #ECF3FF 0%, #DBE0FF 100%);}
.function .area_function.mail_ai .feature_card.wide .wrap_title {background-color: #e8f0ff;}

.function .area_ai_mail { position: relative; padding: 120px 0; background-color: #fff; overflow: hidden; }
.function .area_ai_mail::before { content: ''; position: absolute; inset: 0; background: url(../images/main_new/2025/function/mail_new/img_mail_pc_02_bg.png) no-repeat center center / cover; opacity: .58; pointer-events: none; }
.function .area_ai_mail .inner { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 60px; width: 100%; max-width: 1200px; margin: 0 auto; }

/* 타이틀 */
.function .area_ai_mail .title_wrap { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; margin: 0; }
.function .area_ai_mail .title_wrap .label { display: inline-flex; align-items: center; width: auto; height: 28px; margin: 0; padding: 0 8px; border-radius: 8px; font-size: 16px; font-weight: 500; letter-spacing: -0.28px; color: #00C3E0; background-color: #E1FBFF; }
.function .area_ai_mail .title_wrap h2 { position: relative; margin: 0; font-size: 48px; font-weight: 600; line-height: 140%; letter-spacing: -0.04em; color: #333; text-align: left; }
.function .area_ai_mail .title_wrap h2 .ic_star { --star-w: 42px; --star-h: calc(var(--star-w) * 32 / 30); position: absolute; left: calc(1px - var(--star-w)); top: calc(26px - var(--star-h)); width: var(--star-w); height: var(--star-h); background: url(../images/main_new/2025/function/mail_new/ic_ai_star.svg) no-repeat 0 0 / 100% 100%; animation: ai_star_float 3s ease-in-out infinite; }

@keyframes ai_star_float { 0%, 100% { transform: translateY(6px); } 50% { transform: translateY(-2px); } }
@media (max-width: 1251px) {
  .function .area_ai_mail .title_wrap h2 { text-indent: 38px; }
  .function .area_ai_mail .title_wrap h2 .ic_star { left: 0; top: calc(28px - var(--star-h)); }
}
.function .area_ai_mail .title_wrap h2 .gradient { display: inline-block; text-indent: 0; background-image: linear-gradient(90deg, #0D99FF 0%, #C498FF 50%, #0D99FF 100%); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; animation: ai_gradient_flow 3.5s linear infinite; }
@keyframes ai_gradient_flow { from { background-position: 0% 50%; } to { background-position: -200% 50%; } }

@media (prefers-reduced-motion: reduce) {
  .function .area_ai_mail .title_wrap h2 .gradient { animation: none; background-position: 0% 50%; }
  .function .area_ai_mail .title_wrap h2 .ic_star { animation: none; transform: none; }
  .function .area_ai_mail .feature_card { animation: none; }
}

/* 카드 그리드 */
.function .area_ai_mail .feature_grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.function .area_ai_mail .feature_card { display: flex; flex-direction: column; min-height: 440px; border: 1px solid #d8e5f3; border-radius: 24px; background-color: #fff; overflow: hidden; box-sizing: border-box; box-shadow: 0 4px 14px rgba(108, 92, 231, .04); animation: ai_card_glow 4s ease-in-out infinite; }
/* 카드 1→4로 위상 균등 분배(4s / 4장 = 1s) → 밝은 지점이 좌→우, 위→아래로 끊김 없이 흐름 */
.function .area_ai_mail .feature_grid .feature_card:nth-child(1) { animation-delay: 0s; }
.function .area_ai_mail .feature_grid .feature_card:nth-child(2) { animation-delay: 1s; }
.function .area_ai_mail .feature_grid .feature_card:nth-child(3) { animation-delay: 2s; }
.function .area_ai_mail .feature_grid .feature_card:nth-child(4) { animation-delay: 3s; }
/* 그림자가 은은하게 떠올랐다 가라앉음 — 인접 카드와 겹쳐 자연스럽게 이어짐 */
@keyframes ai_card_glow {
  0%   { box-shadow: 0 4px 14px rgba(108, 92, 231, .04); }
  20%  { box-shadow: 0 10px 26px rgba(124, 107, 245, .18), 0 4px 14px rgba(76, 141, 255, .13); }
  45%  { box-shadow: 0 4px 14px rgba(108, 92, 231, .04); }
  100% { box-shadow: 0 4px 14px rgba(108, 92, 231, .04); }
}
.function .area_ai_mail .feature_card .wrap_title { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; padding: 20px 40px 32px; }
.function .area_ai_mail .feature_card .wrap_title h3 { margin: 0 0 6px; font-size: 26px; font-weight: 600; line-height: 150%; letter-spacing: -0.04em; color: #333; text-align: left; }
.function .area_ai_mail .feature_card .wrap_title p { margin: 0; font-size: 18px; font-weight: 400; line-height: 150%; letter-spacing: -0.04em; color: #686868; text-align: left; }
.function .area_ai_mail .feature_card .img_card { flex: 0 0 296px; height: 296px; overflow: hidden; }
.function .area_ai_mail .feature_card .img_card img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: left top; }

@media (max-width: 1199px) {
  .function .area_ai_mail { padding: 100px 0; }
  .function .area_ai_mail .inner { padding: 0 0%; box-sizing: border-box; }
  .function .area_ai_mail .title_wrap h2 { font-size: 40px; }
  .function .area_ai_mail .feature_card { min-height: 0; }
  .function .area_ai_mail .feature_card .wrap_title { padding: 20px 32px; }
  .function .area_ai_mail .feature_card .wrap_title h3 { font-size: 24px; }
  .function .area_ai_mail .feature_card .img_card { flex: 0 0 auto; height: auto; }
  .function .area_ai_mail .feature_card .img_card img { height: auto; }
}

@media (max-width: 768px) {
  .function .area_ai_mail { padding: 70px 0; }
  .function .area_ai_mail .inner { gap: 32px; }
  .function .area_ai_mail .title_wrap { gap: 12px; }
  .function .area_ai_mail .title_wrap .label { height: 24px; font-size: 14px; }
  .function .area_ai_mail .title_wrap h2 { font-size: 26px; text-indent: 24px; }
  .function .area_ai_mail .title_wrap h2 .ic_star { --star-w: 25px; top: calc(14px - var(--star-h)); }
  .function .area_ai_mail .feature_grid { grid-template-columns: 1fr; gap: 32px; }
  .function .area_ai_mail .feature_card { border-radius: 20px; }
  .function .area_ai_mail .feature_card .wrap_title { padding: 20px 24px; }
  .function .area_ai_mail .feature_card .wrap_title h3 { font-size: 20px; }
  .function .area_ai_mail .feature_card .wrap_title p { font-size: 16px; }
}