@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;}
.link {display: flex; align-items: center; justify-content:center; gap: 5px; color: #888; font-weight: 500; white-space: nowrap; font-size: 18px; margin-top: 30px}

/* 서브 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/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 {text-align:center;}
.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; 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:16px; text-align:left;}
.function .area_function .feature_grid .feature_card {display:flex; width:100%; flex-direction:column; background-color:#F5F6F8; border-radius:24px;}
.function .area_function .feature_grid .feature_card .wrap_title {max-height: 280px; height: 100%; 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:40px 0 40px 40px; flex: 1 1 40%;}
.function .area_function .feature_card .wrap_title p {font-size: 18px; color: #686868; line-height: 1.6; text-align:left;}
.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; flex: 1 1 60%; 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 .area_function.gray {background-color: #F5F6F8; max-width: none;}
.function .area_function.gray .feature_card {background-color: #fff; border: 1px solid #E8E8E9; border-radius: 24px; overflow: hidden;}
.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);}
.price .area_function .title_wrap .title {margin-bottom:20px;}
.price .area_function .tab_default {text-align:left; margin:0 0 10px 0;}
.price .btn_wrap .btn_general {cursor:pointer; background-color:#6B3BE9;}
.price .btn_wrap .btn_general:hover {background-color:#7648e8;}
.price .btn_wrap .btn_ghost {border:1px solid #6B3BE9; color:#6B3BE9;}
.price .btn_wrap .btn_ghost:hover {background-color:#f2f0f6;}
.price .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;}

/* 탭 */
.tab_default {margin:0 0 50px;}
/*
.tab_default button {font-size:16px; margin:0 4px; padding:12px 20px; border-radius:50px; background-color:transparent; color:#AAA; letter-spacing:-1px; font-weight:500; cursor:pointer;}
.tab_default button:hover, .tab_default button.active {background:#333; color:#fff; transition: all .2s cubic-bezier(0.5,0.8,0.6,0.88);}
*/
.tab_contents {transition:all .4s;}
.tab_contents > div {display:none;}
.tab_contents div.active {display:block;}
.tab_contents .thumb.mo {display:none;}
.tab_contents .thumb.pc {display:block;}
.list_func {width:1200px; margin:0 auto;}
.list_func .item_cont {padding-top:30px;}
.list_func h3 {text-align:left;}
.list_func .item:nth-child(1) {padding:120px 0 60px;}
.list_func .item {padding:100px 0 60px;}
.list_func .item_cont .desc {font-size:18px; margin-top:12px; color:#888;}
.list_func .item_cont {padding-top:30px;}
.list_func .inner_flex > div {flex:1;}
.list_func .item .right {flex-direction:row-reverse;}

/* 법정의무교육 */
.education .inner {max-width: 980px;}
.area_function.point {padding-bottom: 100px;}
.area_function.point .cont_intro{margin-top: 60px;}
.area_function.point .box.center .item {flex: 1; flex-direction: column; align-items: center;}
.area_function.point .item .item_cont {padding-top: 60px; text-align: center;}
.area_function.point .item .title {font-size: 26px; font-weight: 600;  color: #333;}
.area_function.point .cont_intro .item .desc {margin-top: 20px; font-size: 18px;  color: #888;}
.area_function.point .item .item_thumb {display: flex;}
.area_function.point .item.i01 {background: #E9F6FD;}
.area_function.point .item.i01 .item_cont {padding: 90px 0 90px 90px; text-align: left;}
.area_function.point .item.i01 .item_thumb {margin-top:;}
.area_function.point .item.i01 .item_thumb {margin-top:;}
.area_function.point .item.i02 .item_thumb { margin: }
.area_function.point .item.i02 {background: #E6F4F0; justify-content: space-between;}
.area_function.point .item.i03 {background: #E9EAFF;}
.area_function.edu .tab_default {margin-top: 50px;}
.area_function.edu .tab_default button {margin: 0;}
.area_function.edu .tab_contents {padding:60px 80px; background:#FFF8E7; box-sizing: border-box; border-radius: 30px;}
.area_function.edu .tab_contents .thumb {display: flex; justify-content: space-between;}
.area_function.edu .list_dot {margin-top: 12px;}
.area_function.edu h3 {font-size: 26px; text-align: left;}
.area_function.edu .list_dot .tit {font-size: 18px; color:#555; font-weight: bold;}
.area_function.edu .list_dot .txt {font-size: 18px; color:#555;}
.area_function.edu .list_dot li {position: relative; margin-top: 12px;  padding-left: 15px;}
.area_function.edu .list_dot li:before {content:'∙'; display: inline-block; width: 14px; height: 14px; position: absolute; top: 0; left: 0;}
.area_function.event {padding:80px 0; background: #EFF5FA; max-width:100%;}
.area_function.event img {margin:0 auto}
.area_function.info {padding-top: 20px;}
.area_function.info .box {display: flex; margin-top: 50px; justify-content: space-evenly; align-items: center; flex-direction: row; padding: 60px 100px; border: 2px solid #eee; text-align: left;  border-radius: 25px;}
.area_function.info .wrap_list {border-left: 1px solid #EEE;  padding-left: 60px;}
.area_function.info .list_check li {position: relative; margin-top: 12px;  padding-left: 15px; font-size: 20px; font-weight: 500;;}
.area_function.info .list_check li:before {content:''; display: inline-block; position: absolute; top: 8px; left: -8px; width: 14px; height: 14px; margin-right: 12px; width: 14px; height: 14px; background: url('../images/education/ic_check.svg') center no-repeat;}
.area_function.info .list_check li:first-child {margin:0}

/* 직무교육 */
.training .inner {max-width: 980px;}
.training .content_head {padding:90px 0 70px 0;}
.training .title_wrap .logo {margin-bottom:20px;}
.training .title_wrap .desc {margin-top:30px;}
.training .title_wrap .sub {font-size: 34px; margin-bottom:10px;}
.training .area_function .feature_grid.wide .feature_card .wrap_title {padding: 110px 0 0 70px; text-align:left;}
.training .area_function.point .feature_grid.wide .feature_card h3 {text-align:left;}
.training .point .feature_card .wrap_title .desc {font-size:18px; font-weight:500; color:#555;}
.training .point .feature_card .wrap_title .sub_desc {font-size:16px; color:#777; margin-top:20px;}
.training .point .feature_grid.wide .feature_card {background-color:#E8F3FF;}
.training .point .feature_grid .feature_card:first-child {background-color:#E6F4F0;}
.training .point .feature_grid .feature_card:first-child {background-color:#E9EAFF;}
.training .point .feature_grid:last-child .feature_card {flex-direction:column; align-items:center; text-align:center;}
.training .point .feature_grid .feature_card .wrap_title {padding:40px 0 0;}
.training .point .feature_card .img_card {margin-top:20px;}
.training .point .feature_grid.wide .feature_card:first-child {background-color:#E8F3FF;}
.training .point .feature_grid .feature_card:first-child {background-color:#E6F4F0;}
.training .point .feature_grid .feature_card:last-child {background-color:#E9EAFF;}
.training .area_function .feature_grid h3 {text-align:center;}
.training .edu .tab_default, .training .edu .tab_contents {display:block;}
.training .edu .tab_default {text-align:center;}
.training .edu .title_wrap .desc {margin-top:24px;}
.training .info .box .logo .title {font-size:16px; margin-top:10px; text-align:center; font-weight:500;}
.training .lecture .tab_content {max-width: 980px; margin: 64px auto 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; column-gap: 16px; row-gap: 32px;}
.training .lecture .tabs {display: flex; justify-content: center; gap: 18px; margin: 56px 0;}
.training .lecture .tabs .tab {padding: 12px 32px; font-size: 16px; font-weight: 400; border: 1px solid #E0E0E0; background: #fff; cursor: pointer; transition: 0.01s;}
.training .lecture .tabs .tab:hover {border-color: #000;}
.training .lecture .tabs .tab.active {background-color: #000; color: #fff; border-color: #fff; border-radius: 0;}
.training .lecture .tab_content .info {height: fit-content; width: 233px;}
.training .lecture .tab_content .info div {display: flex; width: fit-content; padding: 2px 8px; margin: 8px 0 4px 0; justify-content: center; align-items: center; font-size: 13px; border-radius: 4px;}
.training .area_promotion .card.contents .self, .IT {display: flex; width: fit-content; padding: 2px 8px; margin: 8px 0 4px 0; justify-content: center; align-items: center; font-size: 13px; border-radius: 4px;}
.training .area_promotion .self { background-color: #FFF0CD; color: #FF8400;}
.training .area_promotion .economy { background-color: #EBF8FD; color: #00A1B9;}
.training .area_promotion .IT { background-color: #CDF0FF; color: #008CFF;}
.training .area_promotion .leadership { background-color: #E4FFCD; color: #00A20D;}
.training .lecture .tab_content img {height: 140px; width: inherit; border-radius: 10px;}
.training .lecture .tab_content .info.more {height: 260px !important; width: inherit; border-radius: 10px;}
.training .lecture .tab_content .info.more img {height: 260px !important; width: inherit; border-radius: 10px;}
.training .lecture .tab_content .info.more {height: 260px !important; width: inherit; border-radius: 10px;}
.training .lecture .tab_content .info .txt {white-space: normal; overflow: hidden;}
.training .lecture .tab_content .info .number {font-weight: 700;}
.training .lecture .tab_content .tab-panel {display: none; flex-wrap: wrap; justify-content: center; column-gap: 16px; row-gap: 32px;}
.training .lecture .tab_content .tab-panel.lecture1 {display: flex;}
.training .lecture .tab_content .tab-panel.lecture1 .info,
.training .lecture .tab_content .tab-panel.lecture2 .info,
.training .lecture .tab_content .tab-panel.lecture3 .info,
.training .lecture .tab_content .tab-panel.lecture4 .info,
.training .lecture .tab_content .tab-panel.lecture5 .info {flex: 0 0 0 0 calc(100% / 4);  transition: 0.01s;}
.training .area_promotion .info , .card.contents {position: relative;}
.training .area_promotion .info .floating-tag {position: absolute; left: 7px; background: #2F83F7; color: #fff; padding: 2px 6px; font-size: 13px; font-weight: 600; border-radius: 4px; z-index: 10;}
.training .area_promotion .card.contents .floating-tag {position: absolute; top: 9px; left: 9px; background: #2F83F7; color: #fff; padding: 2px 6px; font-size: 13px; font-weight: 600; border-radius: 4px; z-index: 10;}

/* 보안 */
.security .item_cont {margin:70px 0 0;}
.security .ic_security {margin:0 auto;}
.security .title_wrap .desc {margin-top:30px;}
.security .content_head {padding:90px 0 50px 0;}
.security .thumb {text-align:center;}
.security .thumb.pc {display:block;}
.security .thumb.mo {display:none;}
.security .area_head .desc {text-align:center; margin-top:20px;}
.security .area_function {max-width:100%;}
.security .item_cont.right {margin-left:110px;}
.security .list_overview {display:flex; flex-wrap:wrap; flex-direction:row; justify-content: center; width:100%; margin: 0 auto 0;}
.security .list_overview li {width:calc(100%/4); padding: 0 40px; box-sizing:border-box; text-align:center;}
.security .list_overview li h3 {margin-top:20px; font-size:18px;}
.security .list_overview li .desc {margin-top:8px;}
.security .item_cont.right {margin-left:110px;}
.security .area_isms {padding-bottom:140px;}
.security .area_isms .area_thumb {text-align:center;}
.security .area_isms .area_head {margin-top:10px;}
.security .area_isms .area_head h2 {margin-bottom:20px;}
.security .area_isms .area_head .desc {font-size:18px; color:#888;}
.security .area_isms .area_head .bold {color:#999; font-weight:600;}
.security .area_isms .area_head .bar {width:2px; height:16px; background-color:#d5d5d5; margin:0 12px 0 14px; position:relative; top:1px; display:inline-block;}
.ic_security {display:block; width:80px; height:80px; background: url(../images/security/ic_security2_gy.svg) no-repeat;}
.ic_security.s01 {background-position: -303px -10px;}
.ic_security.s02 {background-position: -203px -10px;}
.ic_security.s03 {background-position: -3px -10px;}
.ic_security.s04 {background-position: -103px -10px;}

/* 전자계약 */
.contract .inner {max-width: 980px;}
.contract .content_head {padding:90px 0 70px 0;}
.contract .title_wrap .desc {margin-top:30px;}
.contract .visual {background-color:#fff8e7; margin:80px auto 0; max-width:980px; border-radius:30px;}
.contract .visual img {display:flex; align-items: flex-end;}
.contract .how {margin:50px 0 150px;}
.contract .point .feature_card .wrap_title .desc {font-size:18px; font-weight:500; color:#555;}
.contract .point .feature_card .wrap_title .sub_desc {font-size:16px; color:#777; margin-top:20px;}
.contract .area_function.point:first-child .feature_grid.wide .feature_card {display:flex; flex-direction:row; align-items:flex-start;}
.contract .area_function.point:first-child .feature_grid.wide .feature_card:first-child {background-color:#E8F3FF;}
.contract .area_function.point:first-child .feature_grid .feature_card:first-child {background-color:#E6F4F0;}
.contract .area_function.point:first-child .feature_grid .feature_card:last-child {background-color:#E9EAFF;}
.contract .area_function.point:first-child .feature_grid:last-child .feature_card:first-child .img_card {margin-bottom:40px;}
.contract .area_function.point:first-child .feature_grid:last-child .feature_card:last-child .img_card {align-content: space-between;}
.contract .area_function.point:nth-child(2) .feature_grid:last-child .feature_card .img_card {margin-top:20px; align-content: space-between;}
.contract .area_function.point:nth-child(2) .feature_grid.wide .feature_card:first-child {background-color:#FFF8E7;}
.contract .area_function.point .feature_grid .feature_card h3 {text-align:center;}
.contract .area_function.point .feature_grid.wide .feature_card h3 {text-align:left;}
.contract .area_function.point:nth-child(2) .feature_grid .feature_card:first-child {background-color:#E9F6FD;}
.contract .area_function.point:nth-child(2) .feature_grid:last-child .feature_card:first-child {background-color:#E9F6FD;}
.contract .area_function.point:nth-child(2) .feature_grid:last-child .feature_card:last-child {background-color:#E6F4F0;}
.contract .area_function.point .feature_grid:last-child .feature_card {flex-direction:column; align-items:center; text-align:center;}
.contract .area_function .feature_grid .feature_card .wrap_title {padding:40px 0 0;}
.contract .area_function .feature_grid.wide .feature_card .wrap_title {padding:110px 0 0 70px; text-align:left;}
.contract .area_function .feature_card .img_card {justify-content:center;}
.contract .how .cont_list {padding-top:80px;}
.contract .how .cont_list .list_func {display:flex; width:100%; justify-content:center; margin-bottom:40px;}
.contract .how .cont_list .list_func li {margin-right:40px;}
.contract .how .cont_list .list_func:last-child li {margin-right:50px;}
.contract .how .cont_list .list_func li:last-child {margin-right:0;}
.contract .how .cont_list .list_func .item_cont {text-align:center;}
.contract .how .cont_list .list_func .item_cont h3 {font-size:22px; text-align:center;}
.contract .how .cont_list .list_func .item_cont .desc {margin:14px 0 30px; font-size:16px; text-align:center;}
.contract .how .cont_list .list_func .item_cont .desc em {color:#bbb;}

/* 교육 */
.education .inner {max-width: 980px;}
.education .content_head {padding:90px 0 70px 0;}
.education .title_wrap .logo {margin-bottom:20px;}
.education .title_wrap .desc {margin-top:30px;}
.education .visual {background-color:#fff8e7; margin:80px auto 0; max-width:980px; border-radius:30px;}
.education .visual img {display:flex; align-items: flex-end;}
.education .area_function .feature_grid.wide .feature_card .wrap_title {padding: 110px 0 0 70px; text-align:left;}
.education .area_function.point .feature_grid.wide .feature_card h3 {text-align:left;}
.education .point .feature_card .wrap_title .desc {font-size:18px; font-weight:500; color:#555;}
.education .point .feature_card .wrap_title .sub_desc {font-size:16px; color:#777; margin-top:20px;}
.education .point .feature_grid.wide .feature_card {background-color:#E8F3FF;}
.education .point .feature_grid .feature_card:first-child {background-color:#E6F4F0;}
.education .point .feature_grid .feature_card:first-child {background-color:#E9EAFF;}
.education .point .feature_grid:last-child .feature_card {flex-direction:column; align-items:center; text-align:center;}
.education .point .feature_grid .feature_card .wrap_title {padding:40px 0 0;}
.education .point .feature_card .img_card {margin-top:20px;}
.education .point .feature_grid.wide .feature_card:first-child {background-color:#E8F3FF;}
.education .point .feature_grid .feature_card:first-child {background-color:#E6F4F0;}
.education .point .feature_grid .feature_card:last-child {background-color:#E9EAFF;}
.education .area_function .feature_grid h3 {text-align:center;}

/* 메신저 */
.messenger .area_function .feature_grid {display:grid; grid-template-columns:repeat(2, 1fr); gap:24px;}
.messenger .area_function .feature_card.wide {grid-column: 1 / -1; flex-direction: row;}

/* 전자결재 */
.approval .area_function .feature_grid {display:grid; grid-template-columns:repeat(2, 1fr); gap:24px;}
.approval .area_function .feature_card.wide {grid-column: 1 / -1; flex-direction: row;}


/* --- 반응형 --- */
@media (max-width: 959px) {
  /* 리사이징 공통 */
  /* 폰트 (퍼센트) */
  br.m {display:block !important;}
  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;}

  /* 버튼 */
  .link {font-size: 15px; margin-top: 18px; text-align: center; flex-direction: row; justify-content: center;}

  /* 패딩 */
  .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) {

  /* 탭 */
  /*.tab_contents img {display: none;}*/
	.tab_default {white-space: nowrap; overflow-x: auto; margin:0 0 40px;}
	.tab_default::-webkit-scrollbar {display: none;}
	.tab_default button {margin:0; padding:0 16px; height:auto; line-height:42px; vertical-align:top; font-size:14px; font-weight:500;}
  .tab_contents .thumb.pc {display:none;}
  .tab_contents .thumb.mo {display:block;}
  .tab_contents .thumb.mo p {font-size:18px;  margin:30px 0 0; text-align:center; color:#555; font-weight:500;}
  .tab_contents img {width: 100%;}
  .list_overview {width:100%; gap:40px; margin:0 auto 50px;}
  .list_overview li {width:calc(100% / 1);}
  .list_overview li .desc {font-size: 14px;}
  .list_func .inner_flex > div {flex: 100%;}
  .list_func {width:90%; margin:0 auto;}
  .list_func .item {padding:0;}
  .list_func .item_cont {padding-top:0px; margin:60px 0 20px;}

  /* 모바일 이미지 */
  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: flex-start; width: 100%; gap:24px; padding:36px 24px; margin: 0;}
  .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 {width: 100%; padding: 0 12px;}
  .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;}

  /* 법정의무교육 */
  .area_function.point .cont_intro .item img {width: 100%;}
  .area_function.point .item.i01 .item_cont {padding:40px 10px 0 ; text-align: center;}
  .area_function.info .box {flex-wrap: wrap; padding: 60px 12px; }
  .area_function.info .wrap_list {margin-top: 12px; padding:12px; border:none; }
  .area_function.edu .tab_contents {padding:40px;}
  .area_function.edu h3 {font-size: 21px;}
  .area_function.edu .list_dot .tit,
  .area_function.edu .list_dot .txt {font-size: 16px;}
  .area_function.event img {width: 100%;}

  /* 보안 */
  .security .list_func h3 {font-size:28px; text-align:center;}
  .security .list_func .item_cont {margin: 0;}
  .security .inner_flex {margin-bottom:70px;}
  .security .item_cont.right {margin:0;}
  .security .item_thumb {margin-top:32px;}
  .security .thumb.pc, br.p, .area_head.pc {display:none;}
  .security .thumb.mo, br.m {display:block;}
  .security .area_function {padding:70px 0 10px;}
  .security .area_function .thumb.mo img {width:78%;}
  .security .area_feature {padding:10px 0 80px; text-align:center;}
  .security .list_overview li {width:calc(100%/1);}
  .security .list_box {width:90%; align-content:flex-start; margin:40px auto 0;}
  .security .list_box li {padding:30px 0 40px; margin:0 auto 20px; width:100%; flex-direction:column; align-items:center; text-align:center;}
  .security .list_box li div {margin:10px 0 0 0;}
  .security .list_box .tit {font-weight:500;}
  .security .list_box .desc {font-size:14px;}
  .security .area_isms {padding-bottom:80px;}
  .security .area_isms .area_thumb img {width:28%;}
  .security .area_isms .area_head .desc .bold {font-size:16px; margin-top:25px; display:inline-block;}
  .security .area_isms .area_head .bar {display:none;}

  /* 직무교육 */
  .training .title_wrap .desc {font-size:16px; margin-top:10px;}
  .training .visual {margin:30px auto 0; border-radius:16px;}
  .training .area_function .feature_grid.wide .feature_card .wrap_title {padding:40px 0 0; text-align:center;}
  .training .area_function.point .feature_grid.wide .feature_card h3 {text-align:center;}
  .training .info .list_check li {font-size:14px;}
  .training .info .box .title {text-align:center; margin:16px 0 0; border-bottom:1px solid #ccc; padding-bottom:16px;}
  .training .area_function.info .box {padding:30px 12px;}
  .training .area_promotion.lecture .tabs,
  .training .area_promotion.lecture .tab_content {display:none;}
  .training .area_promotion .card.contents .contents-title {font-size: 8px;}
  .training .area_promotion .item_thumb .view_mo{margin: 40px auto 0; height: auto; width: clamp(272px, 80vw, 100%);}
  .training .edu .tab_default, .training .edu .tab_contents {display:none;}


  /* 전자계약 */
  .contract .visual {margin:30px auto 0; border-radius:16px;}
  .contract .area_function {margin-top: 0;}
  .contract .area_function.point .feature_grid.wide .feature_card h3 {font-size:18px; text-align:center;}
  .contract .area_function.point:first-child .feature_grid.wide .feature_card {flex-direction: column; align-items: center;}
  .contract .area_function .feature_grid .feature_card .wrap_title {padding: 30px 36px 0; margin-bottom:0;}
  .contract .area_function .feature_grid.wide .feature_card .wrap_title {padding:40px 0 0;}
  .contract .point .feature_card .wrap_title .desc {font-size:14px; text-align:center;}
  .contract .point .feature_grid .feature_card .sub_desc {font-size:14px; text-align:center;}
  .contract .point .feature_grid:last-child .feature_card img {width:80%;}
  .contract .how {margin:0; padding-bottom:0;}
  .contract .how .cont_list {padding-top:0;}
  .contract .how .cont_list .list_func {flex-direction:column; margin-bottom:0;}
  .contract .how .cont_list .list_func:last-child li {margin:0 0 40px 0}
  .contract .how .cont_list .list_func li {margin:0 0 40px 0;}
  .contract .how .cont_list .list_func .item_cont {padding:0; margin:0;}
  .contract .how .cont_list .list_func .item_cont h3 {font-size:18px;}
  .contract .how .cont_list .list_func .item_cont .desc {font-size:14px;}

  /* 교육 */
  .education .title_wrap .sub {font-size:16px;}
  .education .visual {margin:30px auto 0; border-radius:16px;}
  .education .area_function .feature_grid.wide .feature_card .wrap_title {padding:40px 0 0; text-align:center;}
  .education .area_function.point .feature_grid.wide .feature_card h3 {text-align:center;}
  .education .info .list_check li {font-size:14px;}
  .education .area_function.info .box {padding:30px 12px;}
  .education .edu .tab_default, .education .edu .tab_content{display:block !important;}
  .education .content_foot .sub {font-size:20px;}

  /* 메신저 */
  .messenger .area_function .feature_grid {grid-template-columns: 1fr; gap: 32px;}
  .messenger .area_function .feature_card.wide {flex-direction:column;}

  /* 전자결재 */
  .approval .area_function .feature_grid {grid-template-columns: 1fr; gap: 32px;}
  .approval .area_function .feature_card.wide {flex-direction:column;}


  
  /* 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;}
}