@charset "UTF-8";

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

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

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

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

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

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

@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: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;}

/* 서브 4가지 기능 메뉴 탭 */
.area_nav.channel {border-top:1px solid #eff3fb; cursor:pointer; border-bottom:1px solid #eff3fb; background:#fff; position:relative;}
.area_nav.channel.additional {top:0;}
.area_nav.channel.additional a.current {color:#333; border-bottom:2px solid #333; font-weight:600;}
.area_nav.channel .inner_flex {max-width:700px; justify-content:space-around;}
.area_nav.channel a {padding:16px 20px 14px;}
.area_nav.channel a:hover .tit,
.area_nav.channel a.current .tit,
.area_nav.channel a.active .tit {color:#333; font-weight:600;}
.area_nav.channel a:hover,
.area_nav.channel a.current,
.area_nav.channel a.active {border-bottom:2px solid #333;}
.area_nav.channel .tit {line-height:30px; color:#A2ACB5; font-weight:500; font-size:18px;}

/* 6.푸터 스타일 */
.function .content_foot .title_wrap h2 {text-align:center; color:#fff; font-weight:400; font-size:44px;}
.function .content_foot .title_wrap h2 .bold {font-weight:600;}
.function .content_foot span.sub {color:#fff;}
.function .content_foot {padding:80px 0 50px; margin: 0 auto; text-align:center; width: 100%; background:
    url("../images/price/img_footer_pc_01.png") no-repeat bottom center/cover,
    linear-gradient(to bottom right, #824EEB, #EBE7DB, #FBFFCF);
  /* 텍스트 색은 불투명하게 */
  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. 배경 */
.bg_skyblue {background-color: #F0F7FB;}


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

.area_faq {padding:80px 0;}
.area_box {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:40px;}
.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 20px;}
.box_qna .answer li {font-size:14px; 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:20px; 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;}
.question::-webkit-details-marker {content:''; display:none;}



/* 여기서부터 서브 페이지 시작해주세요~ */
/* 주요기능(서브): 공통 */
.function .area_intro.sub .cont_wrap .box_cont .cont li {max-width: 290px;}
.function .area_function .feature_grid {display:flex; flex-direction:row; gap:24px;}
.function .area_function .feature_grid.wide {margin-bottom:24px; flex-direction:column;}
.function .area_function .feature_grid h3 {font-size:26px; font-weight:600; color:#333; margin-bottom:24px; text-align:left;}
.function .area_function .feature_grid .feature_card {display:flex; flex-direction:column; background-color:#F5F6F8; border-radius:24px;}
.function .area_function .feature_grid .feature_card .wrap_title {padding:50px 0 30px 50px;}
.function .area_function .feature_grid.wide .feature_card {flex-direction:row;}
.function .area_function .feature_grid.wide .feature_card .wrap_title {padding:50px 0 0 50px;}
.function .area_function .feature_card .wrap_title p {font-size: 18px; color: #686868; line-height: 1.6;}
.function .area_function .feature_card .wrap_title img {width: 100%; height: 100%; object-fit: cover; display: block;}
.function .area_function .feature_card .img_card {width:100%; display:flex; justify-content:flex-end;}
.function .area_function .tab_content .box_thumb {text-align:center;}
.function .area_function .tab_content .box_thumb .btn_wrap_link {margin-top: 30px;}
.function .function_core {background-color: #F5F6F8;}
.function .area_review_center {padding: 100px 0; width: 100%; margin: 0 auto; display: flex; flex-direction: column; align-items: center; background-color: #E8F5FF ;}
.function .review_inner_center {display: flex; align-items: center; justify-content: space-between; gap: 24px; max-width: 1200px; width: 100%; height: 220px ;}
.function .area_review_center .title_center {width: 100%; margin: 0; align-items: center; text-align: center;}
.function .area_review_center .title_center h3 {font-size: 40px; font-weight: 600; line-height: 140%; color: #333;  margin-bottom: 12px; text-align: center}
.function .area_review_center .title_center p {font-size: 18px; line-height: 140%; color: #666; margin-bottom: 40px;}
.function .area_review_center .title_center img{margin: 0 auto; display: block; max-height: 28px; width: auto;}
.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; }

/* 가격안내 페이지 */
.price .content_head {background: linear-gradient(to top, #F3EBFF, #FFF);}
.btn_wrap .btn_general {cursor:pointer; background-color:#6B3BE9;}
.btn_wrap .btn_general:hover {background-color:#7648e8;}
.btn_wrap .btn_ghost {border:1px solid #6B3BE9; color:#6B3BE9;}
.btn_wrap .btn_ghost:hover {background-color:#f2f0f6;}
.btn_wrap .btn_general .yl {color:#FFF944;}
.price .area_visual .box_thumb {margin:50px 0 0;}
.price .check {width:24px; height:24px; display:inline-block; background:url(../images/price/ic_price.svg);}
.price .check.gray {background-position:-67px 0px;}
.price .check.purple {background-position:-101px 0px;}
.price .title_wrap h2 {text-align:left; margin-bottom:16px;}
.price .tb_price {width:100%;}
.price .tb_price .underline {text-decoration:underline;}
.price .tb_price th.m1 {padding:12px; background-color:#8659FB;}
.price .tb_price th.m2 {padding:12px; background:#8F8F8F; border-radius:0 16px 0 0;}
.price .tb_price .name th .title {font-size:16px; font-weight:600; text-align:center;}
.price .tb_price .name th .title.gray {color:#666666;}
.price .tb_price .name th .title.purple {color:#885DFF;}
.price .tb_price .name th .desc {color:#888; font-size:14px; text-align:center; margin-top:8px;}
.price .tb_price thead tr:first-child th:first-child {background-color:#F5F6F8; border-radius:16px 0 0 0;}
.price .area_add .title_wrap {margin-bottom:0;}
.price .area_add {background-color:#FAF7FF; padding:100px 0; overflow:hidden;}
.price .area_add .cont_wrap {margin-top:50px;}
.price .area_add .marquee_container {width:100%; position:relative; height:400px;}
.price .area_add .marquee_container .marquee_inner .wrap img {height: 100% !important; width: auto; object-fit: contain; display: block;}
.price .area_add .marquee_container .marquee_inner {display:flex; position:absolute; top:0; animation:50s linear infinite; gap:40px; animation-name:marqueeToLeft; left:0;}
.price .area_add .marquee_container .marquee_inner .wrap {display:flex; gap:40px;}
.price .area_add .marquee_container .box {padding:32px 40px 0; width:384px; box-sizing: border-box; background-color: #FFF; border-radius: 32px;}
.price .area_add .marquee_container .box .txt {display:flex; flex-direction:column; margin-bottom:24px;}
.price .area_add .marquee_container .box .txt .tit {display:flex; flex-direction:row; margin-bottom:12px;}
.price .area_add .marquee_container .box .txt .tit p {font-size:20px; font-weight:600;}
.price .tab_default .tablink {font-size:18px; color:#9C9FA3; font-weight:600; padding:12px; letter-spacing:-1px;}
.price .tab_default .tablink:hover,
.price .tab_default .tablink.active {color:#333; border-bottom:3px solid #333;}
.price .box_desc {font-size:14px; color:#888; margin-top:24px;}
.price .area_comparison .label {background-color:#F5F6F8; padding:8px 0;}
.price .area_comparison .tb_price tbody th,
.price .area_comparison .tb_price tbody td {padding:10px 0px 10px 15px; text-align:center;}
.price .tb_price th.m3 {border-radius:0 16px 0 0;}
.price .tb_price th .wrap_btn {margin-top:40px;}
.price .tb_price .btn_ghost {width:100%; padding:4px 44px; border:1px solid #eee; background-color:#fff; color:#999; font-weight:500; margin-bottom:8px; font-size:15px; line-height:250%; border-radius:45px;}
.price .tb_price .btn_ghost:hover {border:1px solid #ccc; color:#555;}
.price .tb_price .btn_general {width:100%; padding:4px 44px; background:#F4F7F9; color:#333; font-weight:500; font-size:15px; line-height:290%; border-radius:45px;}
.price .tb_price .btn_general:hover {background:#333; color:#fff;}
.price .tb_price tr.name th {padding:12px 0 12px 0;}
.price .tb_price thead th.m0 {background:transparent; border-width:0 0 1px 0;}
.price .tb_price th, .price .tb_price td {position:relative; box-sizing:border-box;}
.price .tb_price h3 {font-size:18px; color:#fff;}
.price .tb_price thead th.m2 .subtit {background-color:pink;}
.price .tb_price thead th.m2 .subtit, .price .tb_price thead th.m3 .subtit {top:-33px; border-radius:16px 16px 0 0;}
.price .tb_price thead th .subtit {display:block; position:absolute; left:0; height:32px; line-height:32px; font-size:14px; text-align:center; color:#fff;}
.price .tb_price tbody td {text-align:center;}
.price .tb_price tbody th, .price .tb_price tbody td {padding:25px 20px 30px;}
.price .tb_price th, .price .tb_price td {position:relative; box-sizing:border-box;}
.price .area_comparison {padding:80px 0;}
.price .area_comparison thead th:nth-child(3),
.price .area_comparison .tb_price tbody th:nth-child(3),
.price .area_comparison tbody td:nth-child(3) {border-left:1px solid #eee;}
.price .area_comparison .tb_price tbody tr th:last-child,
.price .area_comparison .tb_price tbody tr td:last-child {border:none;}
.price .tb_price tbody tr:last-child th,
.price .tb_price tbody tr:last-child td {border-bottom:1px solid #eee !important;}
.ic_chat {background:url(/images/price/ic_price.svg) no-repeat -35px 0px; margin-right:6px; width:24px; height:24px; display:inline-block;}
.ic_chatpurple {background:url(/images/price/ic_price.svg) no-repeat -135px 0px; margin-right:6px; width:24px; height:24px; display:inline-block;}
.ic_download {background:url(/images/price/ic_price.svg) no-repeat 0px 0px; margin-right:6px; width:24px; height:24px; display:inline-block;}
.ic_freegift {background:url(/images/price/ic_price.svg) no-repeat -167px 0px; margin-right:6px; width:24px; height:24px; display:inline-block;}
.ic_category {background:url(/images/price/ic_price.svg) no-repeat 0px 0px; width:54px; height:54px; margin-bottom:16px; display:inline-block;}
.ic_price {background:url(/images/price/ic_price.svg); margin-right:6px; width:24px; height:24px; display:inline-block;}
.ic_price.expense {background-position:0px -33px;}
.ic_price.education {background-position:-32px -33px;}
.ic_price.setting {background-position: -102px -33px;}
.ic_price.service {background-position:-66px -33px;}
.ic_price.gift {background-position:-137px -33px;}
.ic_category.time {background-position:-64px -81px;}
.ic_category.note {background-position:0 -81px;}


/* --- 반응형 --- */
@media (max-width: 959px) {
  /* 리사이징 공통 */
  /* 폰트 (퍼센트) */
  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;}

  /* 패딩 */
  .inner {padding: 0;}
  .content_head,.content_foot {padding-inline: 6% !important; padding-block: 10% !important;}
  .function .content_body > div[class^="area_"] {padding-inline: 6% !important; padding-block: 10% !important;}
  .function .tab_wrapper {position: relative; overflow: hidden; width: 100%;}

  /* 하단 */
  .function .area_review_center .title_center h3 {font-size:18px;}
  .function .area_review_center .title_center p {font-size:14px;}
  .function .content_foot .title_wrap h2 {font-size:24px;}


  /* 탭 영역 시작 */
  /* 탭 영역 화살표 추가 */
  .tab_default {display:flex; overflow-x:auto; scroll-behavior:smooth; gap:8px; -ms-overflow-style:none; scrollbar-width:none; width:100%;}
  .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 {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-direction:column; align-items:left; margin-bottom:36px;}
  .price .area_function .title_wrap {display:flex; flex-direction:column; align-items:flex-start; 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 .link_bn_pc {display:none;}
  .event_bn .link_bn_mo {display:block;}
  .event_bn .link_bn_mo a {display:block; text-align:center; border-radius:10px;}

  /* 4가지 기능 메뉴 탭 */
  .area_nav.channel .txt {font-size:16px;}
  .area_nav.channel .inner_flex {flex-wrap: nowrap; overflow-x: auto;}
  .area_nav.channel a {padding:16px 10px 16px; text-align: center;}

}

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

  /* 주요기능 */
  .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 img {width:100%;}
  
  /* 가격 안내페이지 */
  .price .title_wrap h2 {text-align:center;}
  .price .tb_price tbody th, .price .tb_price tbody td {padding:0;}
  .price .tb_price thead th {padding:0;}
  .price .view_mo .btn_ghost {border:1px solid #eee; color:#999; border-radius:40px; font-size:15px;}
  .price .view_mo .btn_general {background-color:#333; color:#fff; border-radius:40px; font-size:15px;}
  .price p.desc {text-align:center; margin-top:8px;}
  .price .area_add p.desc {text-align: left;}
  .price .area_comparison h3 {font-size:14px;}
  .price .area_comparison .name th .title,
  .price .area_comparison .name th .desc {font-size:12px;}
  .price .area_comparison .label,
  .price .area_comparison th {font-size:14px;}
  .price .area_comparison .tb_price tbody th,
  .price .area_comparison .tb_price tbody td {padding:10px; font-size:13px;}
  .price .box_desc {font-size:12px; margin-top:64px;}
  .price .area_option .wrap .cardlist .box .subbox {padding:0 30px 30px;}
  .price .area_option .wrap.education .cardlist .box .subbox li {align-items:flex-start; flex-direction: column;}
  .price .area_option .wrap.education .cardlist .box .sub {padding:0;}
  .price .area_box {margin-top:0px;}
  .price .question p {font-size:16px;}
  .price .question .ic_detail {top:-19px;}
  .price .tb_price .last a {min-width: inherit; width: 100%; padding: 0 20px; line-height: 52px; letter-spacing: -1px; font-weight: 400;}
  .price .area_category .title h2 {text-align:left;}
  .function .area_category .wrap {flex-direction:column;}
  .function .area_category .inner .card_section .content p.desc {text-align:left;}
  .price .view_mo .card {width: 80%; margin: 0 4px;}
  .price .view_mo .tb_price th, 
  .price .view_mo .tb_price td {width: 50%;}
  .price .view_mo .tb_price tbody th, 
  .price .view_mo .tb_price tbody td {padding: 10px; border-left: 1px solid #D8D8D8; border-right: 1px solid #E8EBEE}
  .price .view_mo .tb_price tbody th + td {border-left-color: #E8EBEE;}

  /* 휴가관리 */
  .function .area_function .feature_grid {flex-direction:column;}
  .function .area_function .feature_grid h3 {font-size:18px; margin-bottom:12px;}
  .function .area_function .feature_card .wrap_title p {font-size:14px;}
  .function .area_function .feature_card .img_card {align-items:flex-end;}
  .function .area_function .feature_grid .feature_card {flex-direction:column;}
  .function .area_function .feature_grid.wide .feature_card {flex-direction:column;}
  .function .area_function .feature_grid .feature_card .wrap_title {padding:30px 0 0 36px; margin-bottom:18px;}

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

@media (max-width: 480px) {
  /* 폰트 리사이징 (사이즈 고정)*/
  h1 {font-size: 34px; 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.subtit {font-size:30px; font-weight: 300;}
  p.point {font-size: 20px; font-weight: 500; line-height: 140%;}
  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 .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: linear-gradient(to top, #fff, #824EEB);
  /* 텍스트 색은 불투명하게 */ color: #fff;}

  /* 주요기능*/
  .function .area_review .title h3 {font-size: 24px; font-weight: 600; line-height: 140%; color: #333;}
  .function .area_review .title p {font-size: 16px; line-height: 150%; color: #888;}
  .function .area_review .title p .text-left {font-size: 16px; font-weight: 600; line-height: 150%; color: #888; white-space: wrap;}
}