@charset "utf-8";

@import url("slick-theme.css");

/* common */
body { letter-spacing: -2px; word-break: keep-all;}
body :not(.fas) { font-family: "Roboto","malgun gothic","맑은 고딕", Helvetica, Arial, sans-serif }
em { font-style: normal;}
h2 { margin-bottom: 40px; font-size: 30px; font-weight: 400;}
.container h3 { font-size: 50px; line-height: 60px; letter-spacing: -5px;}
.container.type02 { padding: 0; }
.h3-comm { margin-top: 10px; font-size: 35px; line-height: 45px; font-weight: 500; word-break: keep-all;}
.sec-list { margin-top: 50px; font-size: 25px; line-height: 30px; }
.sec-list li { padding-left: 12px; margin-top: 15px; position: relative;}
.sec-list li::before { display: block; content: ""; position: absolute; top: 12px; left: 0; width: 5px; height: 2px; background-color: #3d4d5a;}
.sec-list li:first-child { margin-top: 0;}
.preloader .loader .ytp-spinner-circle { border-color: #00c4d0 #00c4d0 #e9ecef; }
.navbar-area .navbar .navbar-nav .nav-item { margin: 0 20px;}
.sub-menu-bar { -webkit-flex-direction: row-reverse; flex-direction: row-reverse; }
.footer .foot-partner input[type="tel"],
.footer .foot-partner input[type="text"] { border: 0 none; }
.block { display: block; }
.fix-box { height: 500px; overflow-y: auto; }
.fix-box img { width: 100%; }
main {padding-top: 80px;}
.bg-soft { background-color: #e8ebef !important;}
.section { padding: 2rem 0 2rem; }

.sub-visual { padding-top: 90px; }
.sub-visual .inner { background-color: #dfedf0; height: 300px;}
.sub-visual .txt { font-size: 40px; padding-top: 110px; line-height: 50px; color: #017077; }

.footer { margin-top: 7.500rem; background-color: #2a2f31; display: flex; position: relative; padding-top: 4rem; padding-bottom: 6rem; letter-spacing: 0;}
.footer a { color: #fff;}
.footer h6 { margin-bottom: 0.5rem; color: #fff; font-weight: 600 !important; font-family: "Poppins", sans-serif; letter-spacing: 0;}
.footer .text-lightgray { color: #84a0ab;}
.footer .text-white { color: #fff;}
.footer .text-white h6 { color: #fff;}
.footer .btn-gray { color: #fff; background-color: #567a85; border-color: #567a85; }
.footer p.font-small { font-size: 0.875rem; font-weight: 300; margin-bottom: 1rem;}
.footer ul.links-vertical li a { position: relative;display: block;font-weight: 300; padding: 3px;}
.footer .footer-brand { font-size: 1rem; font-weight: 500; display: block; }
.footer .footer-brand img { max-width: 100%; height: 30px; }
.footer .form-control { border: 1px solid #fff; color: #9badae;}
.footer .fa-lg { margin-bottom: 1rem;}
.footer .small { font-size: 80%;}
.footer .font-small { font-size: 0.875rem;}
.footer .fa-phone { -webkit-transform: rotate(90deg); transform: rotate(90deg); }
.copyright { padding-top: 2rem; border-top: 1px solid #2a2d31;}


/* form */
.form-check-label { position: relative;  padding-left: 1.75rem; }
input[type="radio"], 
input[type="checkbox"] { padding: 0; opacity: 0; position: absolute; visibility: hidden;}
.form-check-radio input[type="radio"] + .form-check-sign:after,
.form-check-radio input[type="radio"] { opacity: 0;}
.form-check .form-check-sign::before,
.form-check .form-check-sign::after { content: " "; display: inline-block; position: absolute; width: 15px; height: 15px; left: 0; top: 5px; border: 1px solid #dde1ed; background-color: #fff; border-radius: 0.1rem; transition: all 0.2s ease;}
.form-check .form-check-sign::after { content: "\f00c"; font-family: "Font Awesome 5 Free"; top: 0px; text-align: center; opacity: 0;color: #005AD4;font-weight: 900; border: 0; background-color: inherit; }
.form-check input[type="checkbox"] + .form-check-sign::after { opacity: 0;}
.form-check input[type="checkbox"]:checked + .form-check-sign::after { background-color: #fff; opacity: 1;font-size: .625rem; margin-top: 0; line-height: 1.6;}
.form-check input[type="checkbox"]:checked + .form-check-sign::before, 
.form-check input[type="checkbox"]:checked + .form-check-sign::before { border: none; }
.form-check-radio .form-check-sign::before, 
.form-check-radio .form-check-sign::after {content: ""; width: 18px; height: 18px; -webkit-border-radius: 50%; border-radius: 50%; display: inline-block; position: absolute; left: 0px; top: 5px;  padding: 1px; transition: opacity 0.3s linear;}
.form-check .form-check-label:hover { cursor: pointer; }
.form-check-radio .form-check-label { padding-top: 3px;}
.form-check-radio input[type="radio"]:checked + .form-check-sign::before { background-color: #005AD4;}
.form-check-radio input[type="radio"]:checked + .form-check-sign::after { width: 8px;height: 8px; top: 10px; left: 5px; background-color: #fff; border-color: #fff; opacity: 1;}


/* title */
.tit01 { font-size: 50px; text-align: left; margin-bottom: 0;}
.tit01 em { font-weight: bold; }
.tit01 b { font-size: 60px; }
.tit02 { margin-bottom: 10px; font-size: 20px !important; line-height: 30px !important; letter-spacing: -2px !important;}
.tit03 { font-size: 62px !important; line-height: 72px !important; letter-spacing: -2px !important; font-weight: 600; }
.tit03 .block { font-size: 53px !important; }
.tit03 em { color: #ff0000; font-weight: 600; }
.tit04 { margin-bottom: 15px; font-size: 27px; line-height: 37px; letter-spacing: -1px; }


/*nav */
.navbar-brand { color: #333; font-size: 30px; font-weight: 500;}
.navbar-brand:hover { color: #333;}
.navbar-area .navbar .navbar-nav .nav-item a { color: #333; font-size: 20px;}
.navbar-area .navbar .navbar-nav .nav-item a:before { display: none;}
.navbar-area .navbar .navbar-nav .nav-item.active > a, .navbar-area .navbar .navbar-nav .nav-item:hover > a { color: #00c4d0;}
.navbar-dark .navbar-nav .nav-link {color: #333; font-size: 20px;}
.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus { color: #108fbc; }
.headroom--not-top.navbar-theme-primary .nav-link { color: #143984; }
.headroom--not-top.navbar-theme-primary.headroom--pinned .navbar-brand,
.headroom--not-top.navbar-theme-primary.headroom--pinned .nav-link { color: #fff; }
.headroom--not-top.navbar-theme-primary.headroom--pinned .navbar-toggler .icon i,
.headroom--not-top.navbar-theme-primary.headroom--pinned .navbar-toggler .icon i { color: #fff; }
.navbar-transparent .navbar-brand:hover, .navbar-transparent .navbar-brand:focus { color: #333;}
.navbar-dark .navbar-nav .show > .nav-link, 
.navbar-dark .navbar-nav .active > .nav-link, 
.navbar-dark .navbar-nav .nav-link.show, 
.navbar-dark .navbar-nav .nav-link.active {color: #108fbc;font-weight: bold;}
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link { background-color: #108fbc; color: #fff; border-color: #108fbc;}
.nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus { border-color: #108fbc; }
.navbar-toggler .icon i { color: #108fbc; }
.navbar-collapse-header a {font-size: 1.250em; font-weight: 600;}


/* main */
.main_program .row > div {text-align: center;}
.main_slider .carousel-control-prev span, 
.main_slider .carousel-control-next span { margin-top: 10%; }
.main_customer { padding: 3rem 0 6rem !important; }
.main_customer .col-lg-4 { flex: 0 0 50%; max-width: 50%;}
.main_customer .row { margin-top: 0 !important; }
.main_customer .card-body { padding: 40px 25px !important }
.main_customer h3 { padding-top: 80px; font-size: 2rem; font-weight: 600; }
.main_customer .card-body.type01 h3 { background: url("/assets/img/common/customer01.png") no-repeat center 0; }
.main_customer .card-body.type02 h3 { background: url("/assets/img/common/customer02.png") no-repeat center 0; }

.top-visual { padding-top: 90px; padding-bottom: 90px; }
.top-visual .inner {  }
.top-visual .inner { background: #eaeefa; }
.top-visual-slick {  }
.top-visual-slick .slick-slide img { width: 100%; height: auto; }
.top-visual-slick .slick-prev { left: 50%; margin-left: -660px; }
.top-visual-slick .slick-next { right: 50%; margin-right: -660px; }
.top-visual-slick .slick-prev,
.top-visual-slick .slick-next { width: 52px; height: 66px; z-index: 10; }
.top-visual-slick .slick-next:before,
.top-visual-slick .slick-prev:before { content: ""; display: block; font-size: 0; line-height: 0; width: 52px; height: 66px; }
.top-visual-slick .slick-next:before { background: url("/assets/images/main/arrow_next.png") no-repeat center 0; }
.top-visual-slick .slick-prev:before { background: url("/assets/images/main/arrow_prev.png") no-repeat center 0; }
.top-visual-slick .slick-dots { bottom: 20px; }
.top-visual-slick .slick-dots li button:before { content: ""; display: block; width: 14px; height: 14px; -webkit-border-radius: 30px; border-radius: 30px; background-color: #333; }
.top-visual-slick .slick-dots .slick-active button:before { background-color: #000; }
.top-visual-slick .slick {  }
.top-visual-slick .slick .wrap { position: relative; width: 1200px; height: 688px; margin: 0 auto; }
.top-visual-slick .slick.type01 .btn { padding: 0; margin-top: 30px; }
.top-visual-slick .slick.type01 { background-color: #edf2f6; }
.top-visual-slick .slick.type01 .wrap { background: url("/assets/images/main/top_visual_200820_1.jpg") center bottom; -webkit-background-size: cover; background-size: cover; }
.top-visual-slick .slick.type02 { background: url("/assets/images/main/top_visual_02.jpg") center bottom; -webkit-background-size: cover; background-size: cover; }
/* .top-visual-slick .slick.type02 { background: url("/assets/images/common/top_visual.jpg") center bottom; -webkit-background-size: cover; background-size: cover; } */

.slick.type01 .txt-box { padding: 200px 15px 0; position: relative; }
.slick.type01 .txt-box .txt01 { font-size: 25px; color: #444; font-weight: 400; line-height: 1.5; }
.slick.type01 .txt-box .txt02 { font-size: 40px; color: #357ee7; letter-spacing: -2px; margin-top: 0; font-weight: 600; margin-top: 30px; line-height: 1.5; }
.slick.type01 .txt-box .txt03 { font-size: 40px; color: #444; letter-spacing: -2px; font-weight: 500; line-height: 1.5; }

.slick.type02 .txt-box { padding-top: 140px;}
.slick.type02 .txt-box .txt01 { color: #3d4d5a; font-size: 26px; line-height: 40px; font-weight: 300; }
.slick.type02 .txt-box .txt01 em { font-weight: 400;}
.slick.type02 .txt-box .txt02 { color: #00c4d0; font-size: 80px; line-height: 90px; letter-spacing: -4px; font-weight: 600; margin-top: 55px;}
.slick.type02 .txt-box .txt03 { color: #009ba5; font-size: 80px; line-height: 90px; letter-spacing: -4px; font-weight: 300;}
.slick.type02 .txt-box .btn { margin-top: 60px;}
.slick.type02 .txt-box .btn a { padding: 0 70px; color: #555; font-size: 18px; background-color: #fff; border: 1px solid #ccc; -webkit-box-shadow: 0px 5px 5px 0px #ccc; box-shadow: 0px 5px 5px 0px #ccc; }

/* needs */
.needs { padding-bottom: 85px;}
.needs .txt { margin-top: 15px;}
.needs .txt span { display: block; text-align: center; }
.needs .txt span:nth-child(1) { font-size: 25px; line-height: 30px; }
.needs .txt span:nth-child(2) { font-size: 17px; line-height: 28px; margin-top: 10px; letter-spacing: -1px; }

/* section */
.sec01 { padding: 85px 0 0; background: #eee url("/assets/images/common/bg_sec01.jpg") no-repeat center 0; }
.sec01 h3 { color: #0269a0; }
.sec01 .h3-comm { color: #0092da; }
.sec01 .sec-list { color: #3d4d5a; }

.sec02 { padding: 85px 0 0; background: #5f5f5f url("/assets/images/common/bg_sec02.jpg") no-repeat center bottom;}
.sec02 h3 { color: #00eeee; }
.sec02 .h3-comm { color: #80ffff; }
.sec02 .sec-list { color: #fff; }
.sec02 .sec-list li::before { background-color: #fff;}

.sec03 { padding: 85px 0 0; background: #eee url("/assets/images/common/bg_sec03.jpg") no-repeat center 0;}
.sec03 h3 { color: #1e5858; }
.sec03 .h3-comm { color: #207272; }
.sec03 .sec-list { color: #3d4d5a; }

.sec04 { padding: 85px 0 30px; background: #a8dbe1 url("/assets/images/common/bg_sec04.jpg") no-repeat center 0;}
.sec04 h3 { color: #fff; }
.sec04 .h3-comm { color: #777; }
.sec04 .sec-list { color: #595959; font-size: 23px;}
.sec04 .sec-list a { color: #595959; }
.sec04 .sec-list li::before { background-color: #595959;}
.sec05 { margin-top: 160px; }

.sec01 .container,
.sec02 .container,
.sec03 .container,
.sec04 .container { padding: 50px 0; }

.sec-sub { margin-top: 115px; }
.sec-sub .tit01 { margin-bottom: 45px; }


/* float */
.f-left { float: left; }
.f-right { float: right; }
.col-07 { width: 100%; overflow: hidden; }
.col-07 > li { width: 14.28571%; float: left; }


/*tab*/
.qatab_wrap {margin-top: 50px;}
.qatab_wrap .tab_tit {border-left: 1px solid #e9e9e9;border-top: 1px solid #e9e9e9;margin-bottom: 40px; overflow: hidden;}
.qatab_wrap .tab_wrap .tab_list {margin-left: -1px;border-top: 1px solid #e9e9e9;}
.qatab_wrap .tab_wrap .tab_list:after {content:'';display:block;clear:both}
.tab_wrap .tab_list li {float: left;}
.tab_wrap .tab_list li a {display: block;height: 60px;padding:0px 10px;border-bottom: 1px solid #e9e9e9;border-right: 1px solid #e9e9e9;font-size: 18px;font-weight: 500;line-height: 60px;color: #333;text-align: center;}
.qatab_wrap .tab_list li a:hover {text-decoration:none}
.qatab_wrap .tab_list.type3 li {width: 33.33%;}
.qatab_wrap .tab_list li.active{background-color: #009ba5;}
.qatab_wrap .tab_list li.active a {color: #fff;}
.tab_wrap .tab_cont {display: none; padding-bottom: 100px;}
.tab_wrap .tab_cont.active {display: block;}

/*toggle*/
.info_list {border-top: 1px solid #e9e9e9;}
.info_list .li {border-bottom: 1px solid #e9e9e9;}
.info_list .li .info_tit {position: relative;min-height: 75px;padding:0 0 0 35px;}
.info_list .li .info_tit a {position:relative;display:block;padding:25px 70px 24px 47px;font-size: 18px; color: #333;line-height: 1.5;}
.info_list .li .info_tit a:after {position:absolute;right:25px;top:30px;content: "";display:block;width:25px;height:24px;background:url('http://image.lotte.com/lotte/images/charlotte/ico_arr_acco.png') no-repeat 0 bottom;}
.info_list .li .info_tit a:active {background: none;}
.info_list .li.on .info_tit a:after {background-position: 0 0;}
.info_list .li .info_tit .ico_q {position:absolute;left: 0;top:24px;height: 30px;width:30px;font-weight: bold;background:url('http://image.lotte.com/lotte/images/charlotte/ico_q.png') no-repeat 0 0;font-size: 0;}
.info_list .li .view_cont {display: none;}
.info_list .li.on .info_tit {background-color: #f9f9f9;border-bottom: none;}
.info_list .li .view_cont .list_inner {padding: 20px 82px 42px;background-color: #f9f9f9;font-size: 16px;line-height: 1.8;color: #888;}


/* table */
.tb table { width: 100%; }
.tb caption { font-size: 0; line-height: 0; position: absolute; left: -9999px; text-indent: -9999px; }
.tb .star { display: inline-block; margin-left: 5px; color: #f8000e; }
.tb th,
.tb td { padding: 5px; font-size: 16px; line-height: 20px;}
.tb input { padding: 3px; border: 1px solid #dfdfdf; width: 100%;}
.tb input::placeholder { opacity: 0.5;}
.tb textarea { padding: 3px; border: 1px solid #dfdfdf; width: 100%; height: 100px; }
.tb textarea::placeholder { opacity: 0.5;}
.tb select { padding: 3px; border: 1px solid #dfdfdf; }

.tb-rows { border-top: 2px solid #313131; }
.tb-rows .red { margin-left: 3px; color: #ff0000; }
.tb-rows th { border-bottom: 1px solid #dfdfdf; background-color: #f9f9f9; }
.tb-rows td { border-bottom: 1px solid #dfdfdf; }
.tb-rows.type01 th { padding: 10px 25px }
.tb-rows.type01 td { padding: 10px; }
.tb-rows.type02 { border-top: 0 none; letter-spacing: -1px; }
.tb-rows.type02 th { padding: 15px 25px }
.tb-rows.type02 td { padding: 15px 30px; }

.wrap-inline .form-check { display: inline-block; margin-right: 45px;}


/* button */
.btn-center { padding: 50px 0 100px; text-align: center;}
.btn-center .btn { padding: 0.55rem 5rem; }
.btn-center .btn-primary { background-color: #50c0e6; border-color: #50c0e6;}
.btn-center .btn.rounded { -webkit-border-radius: 30px !important; border-radius: 30px !important;}
.btn-list-more { line-height: 22px; padding: 10px 45px; border: 1px solid #ccc; background-color: #f9f9f9; font-size: 18px; color: #555; -webkit-border-radius: 30px; border-radius: 30px;}
.btn-list-more span { display: block; padding-right: 20px; position: relative; }
.btn-list-more span::after { display: block; content: ""; position: absolute; top: 50%; right: 0; margin-top: -9px; width: 9px; height: 18px; background: url("../images/icon/ico_arrow01.jpg") no-repeat 0 0; }
.btn-color01 { font-weight: bold; background-color: #4fc1e5; color: #fff; -webkit-border-radius: 30px; border-radius: 30px; padding: 10px 45px; }
.btn-color01:hover { color: #fff; }
.btn-color02 { font-weight: bold; background-color: #898989; color: #fff; font-size: 18px; -webkit-border-radius: 30px; border-radius: 30px; padding: 10px 40px; border: 1px solid #fff;}
.btn-color02:hover { color: #fff; }
.btn01 { font-size: 14px; padding: 8px 35px; border: 1px solid #ccc; -webkit-border-radius: 5px; border-radius: 5px; color: #555;}
.btn.type01 a { letter-spacing: -1px; border: 4px solid #e0e0e0; color: #afafaf; font-size: 15px; font-weight: 300; padding: 0 30px; line-height: 40px; -webkit-border-radius: 30px; border-radius: 30px; }


/* page error */
.page-error { padding: 50px 20px; display: table; width: 100%; }
.page-error .page-center { display: table-cell; vertical-align: middle; }
.page-error .page-msg { margin-bottom: 40px; padding-bottom: 40px; text-align: center; border-bottom: 1px solid #ddd; }
.page-error .page-msg .page-msg01 { font-size: 20px; margin-bottom: 15px; font-weight: bold; }
.page-error .page-msg .page-msg02 { font-size: 14px; }
.page-error .page-btn { text-align: center; }
.page-error .page-btn a { display: inline-block; border: 1px solid #ddd; color: #333; padding: 5px 10px; margin: 0 5px; }


/* sub common */
.sub-visual .inner { position: relative; }
.sub-visual .container.type02 { position: relative; }

.sub-visual .thumb img { width: 100%; height: auto;}
.sub-visual .txtbox { position: absolute; top: 50%; left: 50px; margin-top: -85px; }
.sub-visual h1 { color: #fff; font-size: 55px; font-weight: 600; letter-spacing: -4px; margin-bottom: 2rem;}
.sub-visual p { color: #e1e1e1; font-size: 24px; line-height: 40px;}
.sub-visual span { color: #4fc1e5; font-size: 19px; }


/* inquire */
.inquire { padding: 5rem 0 3rem;}
.inquire h2 { font-size: 30px;font-weight: 600; margin-bottom: 1.250rem;letter-spacing: -2px;}

.back-to-top,
.back-to-top:hover  { background-color: #00c4d0; bottom: 80px; }


/*customer*/
.more_qa_bottom {position:relative;overflow: hidden;}
.bd_box {padding: 25px 90px 20px 58px;border: solid 3px #eee; background: #fbfcfe;}
.customer_center.call {padding: 74px 0 60px 50px}
.customer_call {overflow:hidden;}
.customer_call .ico_customer {float: left;height: 45px;padding-left: 31px;font-size: 26px;font-weight: 500;color: #555;line-height: 45px;vertical-align: middle;letter-spacing: -2px;}
.customer_call .txt_noti_wrap {color: #acacac;font-size: 16px;float: right;width: 412px;vertical-align: middle; letter-spacing: -1px;}
.customer_call .txt_noti dt {display:inline;line-height: 1.94;vertical-align: top;}
.customer_call .txt_noti dd {display:inline;padding: 0 0 0 5px;line-height: 1.94;vertical-align: top;}
.customer_call .txt_noti.type02 {color: #00c4d0; }
.charlo_work_wrap { width: 1200PX; }
.visual_customer {background: #000;}
.charlo_qa_wrap .tit_wrap {margin-top: 140px;}
.v_txt01 {font-size: 42px;color: #fff;}
.more_qa_center {margin: 0 0 120px;}
.more_qa_center .more_qa_top {padding: 0 0 0 38px;margin-bottom: 116px;}
.customer_center {margin-top: 20px;}
.customer_center p {font-weight: bold;}
.customer_center .s_noti {padding-top: 5px;font-size: 14px;color:#888}
.customer-visual .txtbox { /* margin-top: -55px; */ }


/* 결제시스템 */
.sub-visual.pay .container { background: #c9cfd2 url("/assets/images/pay/sub_visual.jpg") no-repeat center 0;  }
.sub-visual.pay .inner { height: auto; background-color: #5c6163; }
.sec-pay .tb-rows { margin-top: 60px; }
.sec-pay .card { -webkit-border-radius: 0; border-radius: 0; }
.sec-pay .card-frame .card-body { padding: 2.125rem 2.5rem 1.5rem !important; }
.wrap-chk-img { border: 1px solid #ddd; padding: 25px; }
.wrap-chk-img li { padding: 7px; }

.chk-img input[type="checkbox"] { position: absolute; top: 0; left: 0; opacity: 0; }
.chk-img .wrap { margin: 0 auto; padding-top: 10px; width: 120px; height: 158px; overflow: hidden;}
.chk-img .wrap img { width: 100%; height: auto; }
.chk-img .name { display: table; width: 100%; height: 20%; font-size: 15px; }
.chk-img .name span { display: table-cell; vertical-align: middle; font-size: 15px; }
.wrap-chk-img li:nth-child(13) .chk-img .name { margin-top: -15px; }

.chk-img::before { display: block; content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #ccc; opacity: 0.5; }
.chk-img.on::before { display: none; }
.chk-img::after { display: none; }
.chk-img.on::after { display: block; content: ""; position: absolute; top: 13px; left: 7px; width: 31px; height: 23px; background: url("/assets/images/icon/ico_chk01.png") no-repeat 0 0;}
.chk-img { position: relative; height: 198px; border: 1px solid #ddd; text-align: center; }
.chk-img label { margin: 0; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; cursor: pointer; z-index: 50; }
.chk-img .msg { display: none; }
.chk-img:not(.on) label:hover { background-color: #000; opacity: 0.7; }
.chk-img label:hover .msg { display: block; position: absolute; top: 50%; left: 0; margin-top: -34px; width: 100%; padding: 10px; letter-spacing: 0; color: #fff; font-weight: bold; font-size: 12px; line-height: 16px; }
.chk-img.on label:hover .msg { display: none; }

.card-frame { border: 1px solid #f9f9f9; border: 1px solid #ddd;}
.card-frame .media-body { position: relative; padding-left: 200px;}
.card-frame .media-body:before { display: block; content: ""; position: absolute; top: 50%; left: 40px; width: 130px; height: 130px; margin-top: -65px; }
.card-frame .media-body li { position: relative; padding-left: 15px; font-size: 17px;}
.card-frame .media-body li:before { display: block; content: ""; position: absolute; top: 10px; left: 0; width: 2px; height: 2px; background-color: #333; -webkit-border-radius: 3px; border-radius: 3px; }
.card-frame .media-body h4 { margin-bottom: 20px; font-size: 30px; font-weight: 300; color: #0099cc;}
.card-frame .media-body h4 b { font-weight: bold;}
.card-frame .media-body.type01:before { background: url("/assets/images/pay/icon_pay01.png") no-repeat 0 0; -webkit-background-size: 100% auto; background-size: 100% auto;}
.card-frame .media-body.type02:before { background: url("/assets/images/pay/icon_pay02.png") no-repeat 0 0; -webkit-background-size: 100% auto; background-size: 100% auto;}
.card-frame .media-body.type03:before { background: url("/assets/images/pay/icon_pay03.png") no-repeat 0 0; -webkit-background-size: 100% auto; background-size: 100% auto;}
.card-frame .media-body.type04:before { background: url("/assets/images/pay/icon_pay04.png") no-repeat 0 0; -webkit-background-size: 100% auto; background-size: 100% auto;}
.card-frame .media-body ul { padding-left: 0;}
.card-frame .card-body { background-color: #f9f9f9; padding: 1.875rem 1rem !important;}

.pay-package .info { padding-right: 33%; }
.pay-package .info dt { font-size: 45px; margin-bottom: 15px; font-weight: 400;}
.pay-package .info dd span { display: block; }
.pay-package .info .txt01 { font-size: 25px; color: #999; margin-bottom: 45px;}
.pay-package .info .txt02 { font-size: 25px; color: #0099cc}
.pay-package .price-area { position: absolute; top: 0; right: 0; text-align: center; width: 29%; height: 100%; background-color: #999; }
.pay-package .price { display: block; color: #fff; padding-top: 60px; font-size: 40px; margin-bottom: 1.5rem;}


/* 보안시스템 */
.sub-visual.security .inner { height: auto; background-color: #5c6163; }


/* 세무/회계 */
.sec-tax { margin-top: 100px; }
.sec-tax .btn-color01.type01 { padding: 15px 55px; -webkit-border-radius: 50px; border-radius: 50px; font-weight: 400; font-size: 1.5rem; }
.sub-visual.tax .inner { height: auto; background-color: #5c6163; }
.dl-type02 dt { font-size: 27px; font-weight: 500; margin-bottom: 18px; }
.dl-type02 dd { font-size: 16px; line-height: 20px; }
.dl-type02 dd b { color: #ff0000; }
.tax-box { margin-bottom: 100px; line-height: 25px; letter-spacing: -1px;}
.tax-box .dl-type02 { margin-top: 60px; margin-bottom: 20px; }
.tax-box .tit { margin-bottom: 15px; font-size: 27px; line-height: 37px; letter-spacing: -1px; }
.tax-box .img-box img { width: 100%; height: auto; }
.sec-tax input[type="text"].form-control { width: 240px; height: 38px; -webkit-border-radius: 0; border-radius: 0; }
.taxbox img { width: 100%; height: auto; vertical-align: top; }


/* 위생/클린 */
.sub-visual.clean .inner { height: auto; background-color: #5c6163; }
.sec-clean .form-control { width: 240px; }
.sec-clean input[type="text"].form-control { width: 240px; height: 38px; -webkit-border-radius: 0; border-radius: 0; }
.sec-clean input[type="text"].form-control::placeholder { color: #ddd; }
.sec-clean .form-check { padding-left: 0; }
.dl-type01 dt { margin-bottom: 15px; font-size: 27px; font-weight: 600;}
.dl-type01 dd { margin-bottom: 8px; }
.box-txt01 { position: relative; width: 100%; overflow: hidden; }
.box-txt01 h3 { margin-bottom: 15px; font-size: 30px; font-weight: 300; line-height: 44px;}
.box-txt01 h3 b { font-size: 39px; display: block; margin-top: 5px; }
.box-txt01 p { font-size: 17px; line-height: 26px; }
.sec-clean .box-txt01 .btn-area { position: absolute; bottom: 10px; right: 43px; }
.box-txt01 .f-left { padding: 22px 0 22px 48px; }
.box-txt01.type01 { background-color: #e8eeee; }
.box-txt01.type01 h3 { color: #166e6f; }
.box-txt01.type02 { background: url("/assets/images/clean/txtbox_img02.png") no-repeat right bottom; }
.box-txt01.type02 h3 { color: #7dd1ec; }
.box-txt01.type02 h3 b { color: #cef3ff }
.box-txt01.type02 p { color: #e3e3e3 }
.imgchk-list { width: 100%; height: auto; }
.imgchk-list li { float: left; }
.wrap-chk-goods { text-align: center; padding: 10px 0; }
.wrap-chk-goods .form-check .form-check-sign::before, 
.wrap-chk-goods .form-check .form-check-sign::after { top: 4px; }
.chk-goods .btn { margin-top: 10px;  }
.chk-goods span { margin-top: 15px; display: block; }
.sec-clean .box-txt01 .f-right img { margin-top: -10px; }
.sec-clean .table .wrap-inline .row { margin: 0; }


/* 문의하기 modal */
.modal { letter-spacing: -1px; }
#modal-goods .form-check-sign { display: inline; }
#modal-goods .form-check .form-check-sign::before, .form-check .form-check-sign::after { top: 4px; }
#modal-goods .btn-center { padding: 30px 0; }


/* 플랫폼 홈 이동 */
#direct-platform { display: none; }


/* [공통] 사이드메뉴 서비스 바로가기 */
.mod-all-service { display: none; }







	@media (min-width: 1200px) {
		.container.type02 { max-width: 1200px; }
	}

    @media (max-width: 1200px) {
		html,
		body { overflow-x: hidden; max-width: 100%;}
        .container { max-width: 1200px;}
		.sec01 .container, .sec02 .container, .sec03 .container, .sec04 .container { padding: 20px; }
		.customer_center.call { padding: 25px 20px; }
		.more_qa_center {margin: 0 0 50px;}

		/* 위생/클린 */
		.sec-clean .form-control { width: 100%; }
		.chk-goods .wrap img { width: 100%; height: auto; }

		/* 세무/회계 */
		.sec-tax .container { padding: 0 15px; }
		.sec-tax .btn-color01.type01 { padding: 10px 45px; -webkit-border-radius: 50px; border-radius: 50px; font-weight: 400; font-size: 1rem; }
		.sec-tax .mb-250 { margin-bottom: 50px; }

		/* [공통] 사이드메뉴 서비스 바로가기 */
		.mod-all-service { display: block; border-top: 1px solid #e8e8e8; margin-top: 10px; padding: 20px 0 0; }
		.mod-all-service ul { padding: 0; width: 100%; overflow: hidden; }
		.mod-all-service li { padding: 5px; float: left; width: 33.3%; margin-bottom: 10px; }
		.mod-all-service a { display: block; text-align: center; }
		.mod-all-service .service-img { display: inline-block; margin-bottom: 5px; width: 54px; height: 54px; padding: 10px; border: 1px solid #ebebeb; -webkit-border-radius: 15px; border-radius: 15px; background-color: #fff; }
		.mod-all-service .service-txt { display: block; color: #444; font-size: 13px; }
		.mod-all-service a:hover .service-img { background: #fff; border: 1px solid #00c4d0; }
		.mod-all-service a:hover .service-img img { /* filter: brightness(6); */ }
		.mod-all-service a:hover .service-txt { /* color: #29c5ec; */ }
    }

	@media (max-width: 1024px) {
        .container { max-width: 1024px;}
    }

	@media (max-width: 992px) {
		.needs .col-lg-3 { -webkit-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; }
	}

    @media (max-width: 990px) {
        /* common */
        body { letter-spacing: -1px;}
        h2 { margin-bottom: 10px; font-size: 20px; text-align: center; }
        .container h3 { font-size: 22px; line-height: 32px; letter-spacing: -2px;}
        .h3-comm { font-size: 18px; line-height: 22px; }
        .sec-list { margin-top: 20px; font-size: 14px; line-height: 18px; }
        .sec-list li { padding-left: 12px; margin-top: 5px; }
        .sec-list li::before { top: 6px;}
        .navbar-area .navbar .navbar-nav .nav-item { margin: 0 10px;}
        .navbar-area .navbar .navbar-nav .nav-item a { font-size: 16px;}

        .navbar-area { padding: 8px 0; }
        .navbar-area .navbar .navbar-toggler .toggler-icon { background-color: #121212;}
        .navbar-brand { font-size: 22px;}
        .top-visual { padding-top: 60px;}

        .thumb { padding-top: 10px; text-align: center; }


		/* main */
		.top-visual-slick .slick .wrap { width: 100%; height: 300px; }

        /* sub visual */
        .sub-visual .container { display: -webkit-flex; display: flex; align-items: center; }
        .sub-visual .txtbox { position: static; margin-top: 0; padding: 0 20px; }
        .sub-visual { padding-top: 60px; }
        .sub-visual .container { min-height: 200px; background-position:center top; background-repeat: no-repeat; -webkit-background-size: cover; background-size: cover; }
        .sub-visual .txt { font-size: 20px; padding-top: 35px; line-height: 30px; }
        .sub-visual .thumb { display: none;}
        .sub-visual h1 { font-size: 28px; letter-spacing: -2px; margin-bottom: 1rem; line-height: 38px;}
        .sub-visual p {  font-size: 18px; line-height: 28px;}
        .sub-visual span { font-size: 14px; }
        .sub-visual .inner { -webkit-background-size: cover; background-size: cover; background-position: right bottom; }
        .sub-visual.pay .inner { background-image: url("../images/pay/sub_visual.jpg"); }
        .sub-visual.security .inner { background-image: url("../images/security/sub_visual.jpg"); }
        .sub-visual.tax .inner { background-image: url("../images/tax/sub_visual.jpg"); }
        .sub-visual.clean .inner { background-image: url("../images/clean/sub_visual.jpg"); }


        /* title */
        .tit01 { font-size: 25px; }
        .tit01 b { font-size: 30px; }
        .tit02 { margin-bottom: 10px; font-size: 20px !important; line-height: 30px !important; letter-spacing: -2px !important;}
		.tit03 { font-size: 35px !important; line-height: 45px !important; }
		.tit03 .block { font-size: 30px !important; }


        /* table */
        .tb-rows.type01 th { padding: 10px; }
        .tb-rows.type01 td { padding: 10px; }
        .tb-rows.type02 th { padding: 10px }
        .tb-rows.type02 td { padding: 10px; }


        /* visual */
        .top-visual { padding-top: 60px; padding-bottom: 50px; }

        .slick.type01 .txt-box { padding: 50px 105px 0 15px; }
		.slick.type01 .txt-box .txt01 { font-size: 14px; line-height: 24px; }
		.slick.type01 .txt-box .txt02 { font-size: 20px; line-height: 26px; margin-top: 10px; }
		.slick.type01 .txt-box .txt03 { font-size: 20px; line-height: 26px; margin-top: 10px; }
		.slick.type01 .txt-box .txt04 { font-size: 12px; line-height: 16px; margin-top: 20px; padding-right: 50px; margin-bottom: 5px; }
		.slick.type01 .txt-box .txt05 { top: 20px; right: 15px; font-size: 10px; line-height: 14px; }
		.top-visual-slick .slick.type01 .btn { margin-top: 10px; }
		.slick.type01 .txt-box .btn a { padding: 0 20px; font-size: 14px; line-height: 30px; }

        .slick.type02 .txt-box { padding: 30px 15px 0}
        .slick.type02 .txt-box .txt01 { font-size: 16px; line-height: 26px; }
        .slick.type02 .txt-box .txt02 { font-size: 30px; line-height: 40px; letter-spacing: -2px; margin-top: 0;}
        .slick.type02 .txt-box .txt03 { font-size: 30px; line-height: 40px; letter-spacing: -2px;}
        .slick.type02 .txt-box .btn { margin-top: 0;}
        .slick.type02 .txt-box .btn a { padding: 0 20px; font-size: 14px; line-height: 30px; }

		.top-visual-slick .slick-dots { bottom: 0; }

        /* needs */
        .needs { padding-bottom: 30px;}
        .needs .col-lg-3 { margin-bottom: 20px;}
        .needs .txt { margin-top: 10px;}
        .needs .txt span { display: block; text-align: center; }
        .needs .txt span:nth-child(1) { font-size: 16px; line-height: 20px; }
        .needs .txt span:nth-child(2) { font-size: 14px; line-height: 18px; }

        /* section */
        .sec01 { padding: 30px 0; -webkit-background-size: cover; background-size: cover;}
        .sec02 { padding: 30px 0; -webkit-background-size: cover; background-size: cover;}
        .sec03 { padding: 30px 0; -webkit-background-size: cover; background-size: cover;}
        .sec04 { padding: 30px 0; -webkit-background-size: cover; background-size: cover;}
        .sec04 .sec-list { font-size: 14px;}
        .sec05 { margin-top: 50px; }

        .sec-sub { margin-top: 50px; }
        .sec-sub .block { display: inline; }
        .sec-sub .tit01 { margin-bottom: 20px; font-size: 22px;}


        /* tab */
        .qatab_wrap { margin-top: 30px;}
        .qatab_wrap .tab_tit { margin-bottom: 20px;}
        .tab_wrap .tab_list li a { font-size: 14px; height: 40px; line-height: 40px;}
        .info_list .li .info_tit a { font-size: 14px; padding: 20px 60px 20px 40px}
        .info_list .li .info_tit { padding: 0; min-height: auto;}
        .tab_wrap .tab_cont { padding-bottom: 50px;}
		.qatab_wrap.tab_wrap .tab_cont { padding-bottom: 0;}
        .info_list .li .info_tit a:after { top: 50%; margin-top: -12px;}


		/* qna */
		.customer_call { text-align: center; }
		.customer_call .ico_customer { float: none; padding-left: 0; }
		.customer_call .txt_noti_wrap { float: none;width: auto; }
		.info_list .li .info_tit .ico_q { top: 18px; }
        .info_list .li .view_cont .list_inner { padding: 0 60px 20px 40px; font-size: 14px; }
        

        /* table */
        .tb-rows { margin-top: 0 !important; }


        /* float */
        .col-07 > li { width: 50%; }


        /* button */
        .btn-color02 { font-size: 14px; }


        /* 결제시스템 */
        .sec-pay .card-frame .card-body { padding: 20px !important; }
        .card-frame .media-body h4 { font-size: 22px; line-height: 32px; margin-bottom: 10px; }
        .card-frame .media-body li { font-size: 14px; line-height: 18px; }
        .card-frame .media-body:before { width: 70px; height: 70px; top: 0; margin-top: 0; left: 50%; margin-left: -35px;}
        .card-frame .media-body { padding: 80px 20px 20px; }
        .pay-package .info { padding-right: 0; }
        .sec-pay .card-frame .card-body { padding: 0 !important }
        .pay-package .info { padding: 20px; }
        .pay-package .info dl { margin-bottom: 0; }
        .pay-package .info dt { font-size: 18px; line-height: 22px; }
        .pay-package .info dd { margin-bottom: 0; }
        .pay-package .info .txt01 { font-size: 14px; line-height: 18px; margin-bottom: 10px; }
        .pay-package .info .txt02 { font-size: 14px; line-height: 18px; }
        .pay-package .price-area { position: static; width: 100%; padding: 10px;}
        .pay-package .price { padding-top: 0; font-size: 16px; margin-bottom: 5px;}


		/* 세무/회계 */
		.sec-tax { margin-top: 20px; }
		.sec-tax input[type="text"].form-control { width: 100%; }
		.tax-box { margin-bottom: 50px; }
		.tax-box .tit { font-size: 20px; line-height: 30px; font-weight: 400; }

        /* 위생/클린 */
		.sec-clean .box-txt01 .btn-area { position: static; margin: 20px; }
		.sec-clean .box-txt01 .btn-area .btn { width: 100%; }
        .sec-clean .container { padding: 0 15px; }
        .sub-visual.clean p { font-size: 12px; line-height: 20px; }
        .dl-type01 dt { font-size: 18px; line-height: 24px; }
        .box-txt01 .f-left { padding: 20px; float: none;}
        .box-txt01 .f-right { float: none; }
        .box-txt01 h3 { font-size: 18px; line-height: 24px; }
        .box-txt01 h3 b { font-size: 22px; font-weight: 600; }
        .box-txt01.type01 { background: linear-gradient(180deg, rgba(232,238,238,1) 0%, rgba(241,240,243,1) 40%); }
        .box-txt01.type02 { -webkit-background-size: cover; background-size: cover; }
        .wrap-chk-goods { margin-top: 30px; }
        .wrap-chk-goods:first-child { margin-top: 0; }
		.sec-clean input[type="text"].form-control { width: 100%; }


		/* 고객센터 */
		.sub-visual.customer-visual .inner { height: auto; }


		/* 플랫폼 홈 이동 */
		#direct-platform { display: block; position: fixed; bottom: 15px; right: 15px; z-index: 99; }
		#direct-platform .btn-platform-go { display: block; padding: 0 15px; padding-left: 45px; -webkit-border-radius: 26px; border-radius: 26px; background: #333; color: #fff; font-size: 16px; line-height: 50px;}
		#direct-platform .btn-platform-go { 
			visibility: hidden;
			-webkit-transform: scale(0);
			-moz-transform: scale(0);
			-ms-transform: scale(0);
			-o-transform: scale(0);
			transform: scale(0);
			-webkit-transition: -webkit-transform .3s,visibility 0s .3s;
			-moz-transition: -moz-transform .3s,visibility 0s .3s;
			transition: transform .3s,visibility 0s .3s;
		}
		#direct-platform.is-fixed .btn-platform-go { 
			visibility: visible;
			-webkit-transition: all 0s;
			-moz-transition: all 0s;
			transition: all 0s;
			-webkit-transform: scale(1);
			-moz-transform: scale(1);
			-ms-transform: scale(1);
			-o-transform: scale(1);
			transform: scale(1);
			-webkit-animation: cd-bounce-in .3s linear;
			-moz-animation: cd-bounce-in .3s linear;
			animation: cd-bounce-in .3s linear;
		}
		#direct-platform .btn-platform-go span { display: block; position: relative; }
		#direct-platform .btn-platform-go span::before { display: block; content: ""; position: absolute; top: 50%; left: -30px; margin-top: -10px; width: 20px; height: 20px; background: url("/assets/images/common/arrow_direct_platform.png") no-repeat center center; -webkit-background-size: 100% auto; background-size: 100% auto; }


		@-moz-keyframes cd-bounce-in{
			0%{-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0)}
			60%{-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-ms-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2)}
			100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}
		}

		@-webkit-keyframes cd-bounce-in{
			0%{-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0)}
			60%{-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-ms-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2)}
			100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}
		}

		@keyframes cd-bounce-in{
			0%{-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0)}
			60%{-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-ms-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2)}
			100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}
		}



    }