@charset "utf-8";

.service_section_title {text-align:center}
.service_section_title h1 {line-height:1.333; font-size:1.5em; font-weight:700; color:#333333}
.service_section_title h1 span {font-weight:700; color:#00c7e5}
.service_section_title h2 {margin-top:1em; line-height:1.3157; font-size:.95em; font-weight:400; color:#606060}

.scroll_ani .service_section_title > * {opacity:0}
.scroll_ani.animated .service_section_title > * {animation:fadeInUp .6s .3s forwards}
.scroll_ani.animated .service_section_title h2 {animation-delay:.4s}
.scroll_ani.animated .service_section_title .btn_basic {animation-delay:.5s}

.service_visual_section {position:relative; padding:2.85em 0 0}
.service_visual_slider {position:absolute; top:0; left:0; width:100%; height:100%}
.service_visual_slider .swiper-slide {height:100%}
.service_visual_slider .slide01 {background:url('/img/m/sub/service_vs_slide01.jpg') center; background-size:cover}
.service_visual_slider .slide02 {background:url('/img/m/sub/service_vs_slide02.jpg') center; background-size:cover}
.service_visual_slider .slide03 {background:url('/img/m/sub/service_vs_slide03.jpg') center; background-size:cover}
.service_visual_slider .slide04 {background:url('/img/m/sub/service_vs_slide04.jpg') center; background-size:cover}
.service_visual_section .tit {position:relative; z-index:1}
.service_visual_section .tit h1 {color:#d1e3ff}
.service_visual_section .tit h2 {color:#fff}
.service_visual_section .tit .btn_basic {margin-top:1.5em; color:#2b2c2c; background:#fff}
.service_visual_section .img_device {position:relative; z-index:1; width:100%; max-width:25em; margin:2.2em auto 0; overflow:hidden}
.service_visual_section .img_device .mobile {position:relative; float:left; width:40.4%; }
.service_visual_section .img_device .pc {position:absolute; bottom:0; right:0; width:68.4%}
.service_visual_section.animated .img_device .mobile {animation:fadeInUp .7s .8s forwards}
.service_visual_section.animated .img_device .pc {animation:fadeInUp .7s 1s forwards}

.service_intro_section {}
.service_intro_section .img {position:relative; max-width:25em; margin:2.5em auto 0; text-align:center}
.service_intro_section .img .speak {position:absolute; height:3.7em; width:auto}
.service_intro_section .img .phone {display:block; width:11.275em; margin:0 auto}
.service_intro_section .img .excel {width:100%}
.service_intro_section .intro_inner01 {padding:3.25em 3% 0}
.service_intro_section .intro_inner01 .sp1 {top:.75em; right:0}
.service_intro_section .intro_inner01 .sp2 {top:6.75em; left:0}
.service_intro_section .intro_inner02 {padding:3.25em 3% 3.4em; background:#f7f7f7}
.service_intro_section .intro_inner02 .sp1 {top:-.75em; left:0}
.service_intro_section .intro_inner02 .sp2 {top:4.5em; right:0}
.service_intro_section .intro_inner02 .sp3 {top:9em; left:0}
.service_intro_section .inner.animated .img .sp1 {animation:fadeInUp .3s .8s forwards}
.service_intro_section .inner.animated .img .sp2 {animation:fadeInUp .3s 1s forwards}
.service_intro_section .inner.animated .img .sp3 {animation:fadeInUp .3s 1.2s forwards}

.service_func_section {padding:3.25em 0 5em}
.service_func_section .tab_wrap {position:relative; margin:2em 3% 0; background:#f5f5f5; border-radius:.8em}
.service_func_section .tab_wrap:before {position:absolute; top:0; right:0; bottom:0; left:0; border:1px solid #d6d6d6; border-radius:.8em; content:''}
.service_func_section .tab_wrap:after {display:block; clear:both; content:''}
.service_func_section .tab_wrap button {position:relative; float:left; width:20%; height:2.875em; border-radius:.8em; color:#333333}
.service_func_section .tab_wrap button span {font-size:.875em;}
.service_func_section .tab_wrap button.active {color:#fff; background:#00c7e5}
.service_func_section .con_wrap {margin-top:2.5em}
.service_func_section .con_wrap > div {position:absolute; top:2em; visibility:hidden; overflow:hidden; opacity:0; transition:.4s}
.service_func_section .con_wrap > div.active {position:relative; top:0; visibility:visible; opacity:1; transition:.4s}  
.service_func_section .con_wrap .img img {width:100%}
.service_func_section .con_wrap .desc {}
.service_func_section .con_wrap .desc h1 {line-height:1.555; font-size:1.125em; font-weight:600; color:#333333; text-align:center}
.service_func_section .con_wrap .desc ul {padding:1.25em 0 2em 14%}
.service_func_section .con_wrap .desc ul li {position:relative; padding-left:27px; line-height:1.84; font-size:.95em; color:#606060}
.service_func_section .con_wrap .desc ul li:after {position:absolute; left:0; top:10px; width:15px; height:12px; background:url('/img/icon_sprites.png') no-repeat; background-position:-100px 0; content:''}
.service_func_section.animated .tab_wrap {animation-delay:.7s}
.service_func_section.animated .con_wrap {animation-delay:.9s}

.service_partner_section {padding:0 3% 4.75em; background:#ecf2f3}
.service_partner_section .img_awards {width:17.625em; margin:-2.75em 0 2.25em}
.service_parter_list {margin-top:2.75em; overflow:hidden}
.service_parter_list ul {margin:-.25em; overflow:hidden}
.service_parter_list ul li {float:left; width:50%; padding:.25em; box-sizing:border-box}
.service_parter_list .item_partner_box {position:relative; height:13em; border-radius:10px}
.service_parter_list .item_partner_box .txt {position:absolute; left:0; bottom:0; width:100%; padding:.75em; box-sizing:border-box}
.service_parter_list .item_partner_box .txt h1 {font-size:1em; color:#ffffff}
.service_parter_list .item_partner_box .txt p {margin-top:.5em; min-height:3.774em; line-height:1.285; font-size:.875em; color:#ffffff; opacity:.5}
.service_parter_list .btn_wrap {margin-top:2.65em}

.service_plan_section {padding:4.875em 3% 2.75em} 
.service_plan_section .tab_wrap {position:relative; margin:1.5em 0 0; background:#f5f5f5; border-radius:.8em}
.service_plan_section .tab_wrap:before {position:absolute; top:0; right:0; bottom:0; left:0; border:1px solid #d6d6d6; border-radius:.8em; content:''}
.service_plan_section .tab_wrap:after {display:block; clear:both; content:''}
.service_plan_section .tab_wrap button {position:relative; float:left; width:33.33%; height:2.875em; border-radius:.8em; color:#333333}
.service_plan_section .tab_wrap button span {font-size:.875em;}
.service_plan_section .tab_wrap button.active {color:#fff; background:#00c7e5}
.service_plan_section .toggle_wrap {padding:1.45em 4.3% 1em; text-align:right}
.service_plan_section .toggle_wrap > * {vertical-align:middle}
.service_plan_section .toggle_wrap span {margin:0 .2em; font-size:.875em; color:#888888}
.service_plan_section .toggle_wrap span.on {color:#333333}
.service_plan_section .toggle_wrap .btn_toggle {position:relative; display:inline-block; width:3.05em; height:1.35em; border-radius:1.5em; background:#00c7e5; box-shadow:inset 0 0 10px #9e9e9e; cursor:pointer}
.service_plan_section .toggle_wrap .btn_toggle:after {position:absolute; top:.175em; left:.175em; width:1em; height:1em; border-radius:50%; background:#fff; content:''}
.service_plan_section .toggle_wrap .btn_toggle.on:after {left:auto; right:.175em}
.service_plan_section .toggle_wrap em {font-size:.825em; color:#f64444}
.product_plan_list_wrap {padding:0 4.3%}
.product_plan_item {display:none; border:5px solid #00c7e5; border-radius:10px; vertical-align:top; text-align:center; box-shadow:5px 5px 10px #bdbdbd}
.product_plan_item.active {display:block}
.product_plan_item *[data-pay=month] {display:none}
.product_plan_item .info_top {padding:2em 0; border-bottom:1px solid #d5d5d5; text-align:center}
.product_plan_item .info_top h1 {font-size:1.625em; color:#333333}
.product_plan_item .info_top h2 {margin-top:.9em; line-height:1.31; font-size:.95em; color:#333333; opacity:.5}
.product_plan_item .info_top h3 {display:inline-block; height:2.91em; padding:0 1em; margin-top:1.57em; line-height:2.91; font-size:.875em; color:#fff; background:#f64444; border-radius:22px}
.product_plan_item .info_top h3 span {color:#f0ff00}
.product_plan_item .info_top .month {margin-top:1em; font-size:.825em; color:#5488de}
.product_plan_item .info_top .price {padding-top: 16px;}
.product_plan_item .info_top .price > * {display:inline-block; vertical-align:middle}
.product_plan_item .info_top .price .fitpay > * { color: #f64444;}
.product_plan_item .info_top .price .price_info {width: 6em;}
.product_plan_item .info_top .cust_price {position:relative; padding:0 25px 0 10px; margin-right:6px; font-size:1.08em; color:#b8b8b8}
.product_plan_item .info_top .cust_price:after {position:absolute; left:0; top:50%; width:100%; height:2px; margin-top:-1px; background:#b9b9b9; content:''}
.product_plan_item .info_top .cust_price:before {position:absolute; right:0; top:50%; width:15px; height:13px; margin-top:-6.5px; background:url('/img/icon_sprites.png') no-repeat; background-position:-250px -50px; content:''}
.product_plan_item .info_top .sale_price {font-size:.875em; color:#00c7e5;}
.product_plan_item .info_top .sale_price b {font-size:1.714em}
.product_plan_item .func {padding:1.5em 2em; text-align:left}
.product_plan_item .func dt {margin-bottom:5px; line-height:23px; font-size:1em; color:#3b3b3b}
.product_plan_item .func dt .icon_sp {width:1.075em; height:1.3em; margin-right:7px; background-position:-4.5em 0; vertical-align:text-bottom}
.product_plan_item .func dd {position:relative; padding-left:1.185em; line-height:1.55; font-size:.95em; color:#606060}
.product_plan_item .func dd:before {position:absolute; left:0; top:.5em; width:.6em; height:.45em; font-size:1.06em; background:url('/img/m/icon_sprites.png') no-repeat; background-size:12.5em 12.5em; background-position:-7.5em 0; content:''}
.product_plan_item .func dd.plus {color:#f22b2b}
.product_plan_item .func dd.plus:before {top:.4em; width:.675em; height:.675em; background-position:-6em 0}
.product_plan_item .btn_basic {margin:0 auto 1.875em}
.product_plan_detail_wrap {opacity:0; margin-top:2.5em; border:1px solid #53545c; border-radius:10px; overflow:hidden}
.product_plan_detail_wrap .btn_toggle_detail {width:100%; padding:.9em 0; font-size:1.125em; color:#ffffff; background:#353740 url('/img/sub/product_plan_btn_bg.png') no-repeat left; background-size:auto 100%; background-position:-5.5em 0}
.product_plan_detail_wrap .tbl_wrap {}
.product_plan_detail_wrap table {table-layout:fixed}
.product_plan_detail_wrap table thead tr {background:#f9f9fa}
.product_plan_detail_wrap table thead th {height:2.86em; font-size:.875em; color:#333333}
.product_plan_detail_wrap table tbody th {height:4.572em; padding-left:1.143em; font-size:.875em; border-top:1px solid #d6d6d6; text-align:left}
.product_plan_detail_wrap table tbody th var {display:block; margin-top:.6em; font-size:.8em; color:#a1a1a1}
.product_plan_detail_wrap table tbody td {color:#a1a1a1; border-top:1px solid #d6d6d6; text-align:center}
.product_plan_detail_wrap table tbody td .chk_circle {display:inline-block; width:.625em; height:.625em; border:1px solid #dfdfdf; background:#f1f1f1; border-radius:50%}
.product_plan_detail_wrap table tbody td .chk_circle.on {border-color:#00c7e5; background:#00c7e5}
.product_plan_detail_wrap table tbody td p {font-size:.7em}
.service_plan_section.animated .tab_wrap {animation-delay:.5s}
.service_plan_section.animated .toggle_wrap {animation-delay:.6s}
.service_plan_section.animated .product_plan_list_wrap {animation-delay:.7s}
.service_plan_section.animated .product_plan_detail_wrap.animated {animation:fadeInUp .5s .1s forwards}

.service_cs_section {padding:4.75em 5% 3.175em; background:url('/img/sub/service_cs_bg.jpg') center; background-size:cover}
.service_cs_section .tit h1 {color:#fff}
.service_cs_section .tit h2 {color:#fff}
.service_cs_section .cs_list {margin-top:40px}
.service_cs_section .cs_list li {position:relative; padding:1.5em 11.25em 1.5em 1.125em; border-radius:10px; background:rgba(255,255,255,.8)}
.service_cs_section .cs_list li + li {margin-top:.75em}
.service_cs_section .cs_list li p {display:inline-block; line-height:1.31; font-size:.95em; color:#1f1f1f}
.service_cs_section .cs_list li .btn_basic {position:absolute; top:0; bottom:0; right:1.125em; width:9.5em; margin:auto}
.service_cs_section .cs_list li .btn_basic span {font-size:.95em}
.service_cs_section .cs_list li .btn_faq {color:#fff; background:#000}
.service_cs_section .cs_list li .btn_faq:hover {background:#242424}
.service_cs_section .cs_list li .btn_kakao {color:#000; background:#edca07}
.service_cs_section .cs_list li .btn_kakao:hover {background:#ffd800}
.service_cs_section .cs_list li .btn_kakao .icon_kakao {width:1.475em; height:1.625em; margin-right:.3em; background-position:0 -1.5em; vertical-align:middle}
.service_cs_section .animated .cs_list {animation:fadeInUp .5s .7s forwards}

.service_apply_section {padding:3.5em 0 4.5em}
.service_apply_form_wrap {margin:1.4em 5% 0}
.service_apply_form_wrap dl {position:relative; margin-bottom:14px}
.service_apply_form_wrap dl:before {position:absolute; top:0; bottom:0; left:0; right:0; border:1px solid #d3d3d3; border-radius:27px; content:''}
.service_apply_form_wrap dl.on:before {border:2px solid #00c7e5}
.service_apply_form_wrap dl dd {position:relative}
.service_apply_form_wrap dl dt label {position:absolute; left:0}
.service_apply_form_wrap dl dt label span {display:block; font-size:.875em; font-weight:400}
.service_apply_form_wrap .txt_field {padding-left:3.1em}
.service_apply_form_wrap .txt_field dt label {width:3.1em; padding:.6em 0; text-align:center}
.service_apply_form_wrap dl dt i {display:inline-block; width:1.5em; height:1.5em; background:url('/img/m/sub/service_apply_icons.png') no-repeat; background-size:3em auto}
.service_apply_form_wrap dl dt .icon_person {background-position:0 0}
.service_apply_form_wrap dl dt .icon_tel {background-position:0 -1.5em}
.service_apply_form_wrap dl dt .icon_email {background-position:0 -3em}
.service_apply_form_wrap dl dt .icon_company {background-position:0 -4.5em}
.service_apply_form_wrap dl dt .icon_comptel {background-position:0 -6em}
.service_apply_form_wrap dl.on dt .icon_person {background-position:-1.5em 0}
.service_apply_form_wrap dl.on dt .icon_tel {background-position:-1.5em -1.5em}
.service_apply_form_wrap dl.on dt .icon_email {background-position:-1.5em -3em}
.service_apply_form_wrap dl.on dt .icon_company {background-position:-1.5em -4.5em}
.service_apply_form_wrap dl.on dt .icon_comptel {background-position:-1.5em -6em}
.service_apply_form_wrap .chk_field {padding:.5em 0 .5em 6.625em}
.service_apply_form_wrap .chk_field dt label {top:50%; width:6.625em; padding-left:1.25em; line-height:2em; margin-top:-1em; box-sizing:border-box;}
.service_apply_form_wrap .chk_field dd:before {position:absolute; left:0; top:.3em; bottom:.3em; width:1px; background:#d3d3d3; content:''}
.service_apply_form_wrap .ap_frm_input {width:100%; height:3.143em; font-size:.875em; border:0; background:transparent}
.service_apply_form_wrap .ap_frm_input:focus {outline:none}
.service_apply_form_wrap dl.on .ap_frm_input {color:#00c7e5}
.service_apply_form_wrap .list_chk {position:relative; display:table; width:100%; padding-left:.7em; box-sizing:border-box}
.service_apply_form_wrap .list_chk_row {display:table-row; width:100%}
.service_apply_form_wrap .list_chk_row li {position:relative; display:table-cell}
.service_apply_form_wrap .list_chk .chkRadio {padding:.2em 0}
.service_apply_form_wrap .list_chk .chkRadio span {font-size:.875em}
.service_apply_form_wrap .list_chk .input_box {position:absolute; bottom:.1em; left:5em; right:1.3em}
.service_apply_form_wrap .list_chk .input_box .ap_frm_input2 {width:100%; height:1.486em; padding:5px 10px; font-size:.875em; border:0; background:#efefef}
.service_apply_form_wrap .input_text_box {padding:.2em 1.2em .2em .7em}
.service_apply_form_wrap .input_text_box .ap_frm_input3 {width:100%; height:1.486em; padding:5px 10px; font-size:.875em; border:0; background:#efefef}
.service_apply_form_wrap .btn_confirm {margin-top:2.4em}
.service_apply_form_wrap .chk_field_captcha dd {padding:.7em}
.service_apply_form_wrap .chk_field_captcha .m_captcha {position:relative}
.service_apply_form_wrap .chk_field_captcha .m_captcha #captcha_img {display:block; height:48px !important; margin:0 auto 5px !important}
.service_apply_form_wrap .chk_field_captcha .m_captcha #captcha_reload {}
.service_apply_form_wrap .chk_field_captcha .m_captcha #captcha_info {font-size:.8em !important}

.service_app_section {padding:3.1em 5% 3.25em; background:#353740 url('/img/m/sub/service_app_bg.png') no-repeat left; background-size:auto 100%}
.service_app_section .tit h1 {color:#fff}
.service_app_section .tit h2 {color:#fff}
.service_app_section .btn_wrap {margin-top:.9em; overflow:hidden}
.service_app_section .btn_wrap a {float:left; width:48%; transition:.3s}
.service_app_section .btn_wrap a + a {margin-left:4%}
.service_app_section .btn_wrap a img {width:100%}
.service_app_section .btn_wrap a:hover {opacity:.8}


/* scroll animation */
.fadeInUp {opacity:0}
.animated .fadeInUp {animation:fadeInUp .5s .5s forwards}
@keyframes fadeInUp{
	0% {opacity: 0; -webkit-transform: translate3d(0, 1em, 0); transform: translate3d(0, 1em, 0);}
	100% {opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
}


@keyframes fadeInUp_{
	0% {opacity: 0; -webkit-transform: translate3d(0, 1em, 0); transform: translate3d(0, 1em, 0);}
	100% {opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
}