﻿@charset "utf-8";
body.navOn, body.fixed, body.notiOn {overflow:hidden;height:100%}

/* header */
.sub .header {background:#f97063}
.sub .header.shadow {box-shadow:4.8px 5.7px 8px 0 rgba(0, 0, 0, 0.15)}
.sub .header__gnb {background:url("../../images/common/mobile/ico_sub_header_menu.png") no-repeat center;background-size:20px 20px}
.header.shadow {box-shadow:4.5px 5.4px 13px 0 rgba(0, 0, 0, 0.1)}
.header {z-index:100;overflow:hidden;position:fixed;top:0;left:0;right:0;padding:20px;min-height:60px;border-bottom:1px solid #ddd;background:#fff}
.header__gnb {float:left;margin-right:20px;width:20px;height:20px;font-size:0;color:transparent;background:url("../../images/common/mobile/ico_header_menu.png") no-repeat center;background-size:20px 20px}
.header__search {float:right;width:20px;height:20px;font-size:0;color:transparent;background:url("../../images/common/mobile/ico_header_search.png") no-repeat center;background-size:19px 19px}
.header__logo {position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);}
.header__logo--link {display:block;width:148px;height:25px;font-size:0;color:transparent;background:url("../../images/common/mobile/img_logo.png") no-repeat 0 0;background-size:148px 25px}
.header__tit {position:absolute;top:18px;left:50%;transform:translateX(-50%);font-size:1.6rem;font-weight:500;letter-spacing:normal;color:#fff}
.header__back {float:left;width:20px;height:20px;font-size:0;color:transparent;background:url("../../images/common/mobile/ico_header_back.svg") no-repeat center;background-size:12px auto}
.header__home {float:right;width:20px;height:20px;font-size:0;color:transparent;background:url("../../images/common/mobile/ico_header_home.png") no-repeat center;background-size:20px auto}

/* tab */
.header-tab {margin:40px -20px -20px}
.header-tab__tit {padding:16.5px 20px;position:relative;font-size:1.8rem;font-weight:700;letter-spacing:normal;color:#fff;background:#536371}
.header-tab__tit:after {display:block;content:"";width:25px;height:25px;position:absolute;top:18px;right:18px;background:url("../../images/common/mobile/ico_more.svg") no-repeat 0 0;background-size:25px auto;}
.header-tab.on .header-tab__tit:after {transform:rotate(-180deg);}
/*.header-tab.on .header-tab__cnt {display:block}*/
.header-tab__cnt {display:none;background:#fff}
.header-tab__cnt .list li {border-bottom:1px solid #eee}
.header-tab__cnt .list li:last-child {border-bottom:2px solid #536371}
.header-tab__cnt .list a{display:block;padding:16px 20px;font-size:1.8rem;font-weight:500;letter-spacing:normal;color:#000}

/* dim */
.dim.on {display:block}
.dim {display:none;z-index:150;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0, 0, 0, 0.7)}

/* navi */
.nav-box {display:none;z-index:300;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0, 0, 0, 0.7)}
.nav-box.on {display:block}
.menu-wrap.active {left:0}
.menu-wrap {padding-top:86px;width:73%;height:100%;position:relative;left:-73%;-webkit-transition:left .5s, -webkit-transform .5s;transition:left .5s, transform .5s;}
.menu-box {overflow-y:scroll;width:100%;height:100%;-ms-overflow-style:none;scrollbar-width:none;background:#fff}
.menu-box::-webkit-scrollbar {display:none}
.menu-box__list:first-child {padding-top:0}
.menu-box__list {padding:30px 0 25px}
.menu-box__list > li {position:relative}
.menu-box__list > li.on {background:#f97063}
.menu-box__list > li > a {display:inline-block;padding-right:50px;width:100%;font-size:0;vertical-align:top}
.menu-box > .menu-box__list > li.on {background:#f97063 url("../../images/common/mobile/ico_menu_open.svg") no-repeat right 20px top 23.5px;background-size:13px auto}
.menu-box > .menu-box__list > li {background:url("../../images/common/mobile/ico_menu_close.svg") no-repeat right 20px top 23.5px;background-size:13px auto}
.menu-box__list > li .ico {display:inline-block;width:58px;height:55px;position:relative;line-height:55px;text-align:center;vertical-align:top;}
.menu-box__list > li .ico > img {min-width:19px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}
.menu-box__list > li .tit {display:inline-block;padding:17px 0 16px;font-size:1.5rem;vertical-align:top;letter-spacing:normal;font-weight:700;color:#000}
.menu-box__list > li.on .tit {color:#fff}
.service_desk {position:relative;padding:26px 0 25px}
.service_desk .menu-box__list {padding:0}
.service_desk:before {display:block;content:"";height:1px;position:absolute;top:0;left:20px;right:20px;background:#ddd}

.menu-box__list > li.on .sub-menu {display:block}
.sub-menu {display:none;padding:10px 0;background:#f8f8f8}
.sub-menu a {display:inline-block;padding-left:58px;width:100%;font-size:1.4rem;line-height:45px;letter-spacing:normal;font-weight:400;color:#666}
.sub-menu li.on a {font-weight:500;color:#000}

.user-info {width:100%;height:86px;position:absolute;top:0;left:0;background:#fff}
.user-info__tit {position:relative;padding:0 20px;font-size:1.6rem;letter-spacing:normal;font-weight:500;line-height:60px;color:#999;border-bottom:1px solid #eee;}
.user-info__tit span {color:#000}
.user-info .btn-close {display:block;width:30px;height:30px;position:absolute;top:15px;right:13px;font-size:0;color:transparent;background:url("../../images/common/mobile/ico_btn_close.svg") no-repeat center;background-size:16px auto}
.user-info__cnt {padding:30px 20px;border-top:1px solid #eee;font-size:0;text-align:center}
.user-info .btn-opt {display:inline-block;padding:0 10px;width:100%;height:40px;border:1px solid #999;border-radius:3px;font-size:1.4rem;letter-spacing:normal;font-weight:500;line-height:40px;color:#000;background:#fff}
.user-info .btn-opt + .btn-opt {margin-left:4px}

.menu-box__btn {margin:0 20px;padding-bottom:160px}
.menu-box__btn--logout {width:100%;height:50px;border-radius:3px;border:1px solid #ccc;font-size:1.6rem;text-align:center;font-weight:500;letter-spacing:normal;color:#666;background:#eee}
.app-info {overflow:hidden;position:relative;margin-top:45px;padding-top:20px;border-top:1px solid #eee}
.app-info__ver {float:left;width:50%;text-align:left;font-size:1.4rem;line-height:15.5px;letter-spacing:normal;font-weight:400;color:#666}
.app-info__down {float:left;width:50%;text-align:right}
.app-info__down a {display:inline-block;padding-bottom:1.5px;border-bottom:1px solid #000;font-size:1.4rem;line-height:14px;letter-spacing:normal;font-weight:400;text-align:right;color:#000}

/* 알림센터 */
.noti-center {display:none;z-index:300;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0, 0, 0, 0.7)}
.noti-center.on {display:block}
.noti-wrap.active {left:27%}
.noti-wrap {padding-top:60px;width:73%;height:100%;position:relative;left:100%;-webkit-transition:left .5s, -webkit-transform .5s;transition:left .5s, transform .5s;}
.noti-top {padding:20px;width:100%;height:60px;position:absolute;top:0;left:0;background:#f97063}
.noti-top .btn-close {display:block;width:30px;height:30px;position:absolute;top:15px;right:13px;font-size:0;color:transparent;background:url("../../images/common/mobile/ico_btn_close.png") no-repeat center;background-size:16px auto}
.noti-top__tit .new{display:inline-block;width:18px;height:22px;background:url("../../images/common/mobile/ico_noticenter.png") no-repeat 0 0;background-size:18px auto}
.noti-top__tit .newNum{display:inline-block;padding:0px 7px;margin-top:2px;margin-left:-9px;border:3px solid #f97063;border-radius:10px;font-size:1.2rem;font-weight:700;vertical-align:top;letter-spacing:-0.3px;color:#f97063;background:#fff}
.noti-top__tit .text{display:inline-block;margin-left:10px;font-size:1.6rem;vertical-align:top;line-height:22px;letter-spacing:normal;font-weight:500;color:#fff}
.noti-cnt {overflow-y:scroll;width:100%;height:100%;-ms-overflow-style:none;scrollbar-width:none;background:#fff}

.notibar-status__top {padding:14px 20px;font-size:0}
.notibar-status__top .tit {display:inline-block;font-size:1.5rem;font-weight:500;vertical-align:top;letter-spacing:normal;line-height:17px;color:#000}
.notibar-status__top .num {display:inline-block;min-width:25px;margin-left:10px;padding:0 6px;border-radius:3px;font-size:1.2rem;font-weight:700;text-align:center;vertical-align:top;letter-spacing:-0.3px;line-height:17px;color:#fff;background:#f97063}
.notibar-status__cnt {padding:12px 20px;position:relative;overflow:hidden;border-top:1px solid #ddd}

.status-box {float:left;box-sizing:border-box;width:50%;padding:15px 0 13px}
.status-box .num {display:inline-block;width:100%;font-size:3.0rem;line-height:22px;letter-spacing:normal;font-weight:700;text-align:center;color:#000}
.status-box .text {display:inline-block;margin-top:10px;width:100%;text-align:center;font-size:1.2rem;line-height:12px;letter-spacing:normal;font-weight:400;color:#999}
.status-box > a {display:inline-block;width:100%}

.box-list {float:right}
.box-list li {font-size:1.4rem;letter-spacing:normal;font-weight:400;line-height:24px;color:#000}
.box-list li span {margin-left:10px;font-size:1.5rem;font-weight:700;letter-spacing:normal;line-height:24px;color:#000}

.noticeBar-list__top {position:relative;padding:14px 20px;font-size:0;border-top:1px solid #000}
.noticeBar-list__top .tit {display:inline-block;font-size:1.5rem;font-weight:500;vertical-align:top;letter-spacing:normal;line-height:17px;color:#000}
.noticeBar-list__top .num {display:inline-block;min-width:25px;margin-left:10px;padding:0 6px;border-radius:3px;font-size:1.2rem;font-weight:700;text-align:center;vertical-align:top;letter-spacing:-0.3px;line-height:17px;color:#fff;background:#000}
.noticeBar-list__top .more {display:block;width:28px;height:33px;position:absolute;top:6px;right:9px;font-size:0;color:transparent;}
.noticeBar-list__top .more:after {display:inline-block;content:"";width:8px;height:8px;border-top:1px solid #999;border-right:1px solid #999;transform:rotate(45deg);position:absolute;top:11.5px;right:11.5px}
.noticeBar-list__cnt {overflow:hidden;padding:21px 20px;position:relative;border-top:1px solid #ddd}
.noticeBar-list__cnt .list_item li {padding-left:12px;position:relative;display:block;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.noticeBar-list__cnt .list_item li:before {display:block;content:"";position:absolute;top:50%;left:0;width:2px;height:2px;transform:translateY(-50%);background:#666}
.noticeBar-list__cnt .list_item li a {font-size:1.4rem;line-height:28px;letter-spacing:normal;font-weight:400;color:#666}

/* 검색팝업 */
.pop-search {z-index:200;display:none;position:fixed;top:10px;left:10px;right:10px;border-radius:3px;background:#fff}
.pop-search.on {display:block}
.pop-search__top {padding:0 30px;position:relative;border-bottom:1px solid #eee}
.pop-search__top .tit {font-size:1.8rem;font-weight:500;letter-spacing:normal;vertical-align:top;line-height:57px;color:#111}
.pop-search__top .btn-close {display:block;width:30px;height:30px;position:absolute;top:13px;right:13px;font-size:0;color:transparent;background:url("../../images/common/mobile/ico_btn_close.svg") no-repeat center;background-size:16px auto}
.pop-search__cnt {padding:30px 20px 20px}

.input-box {position:relative;padding-right:40px;border:1px solid #ddd;border-radius:3px}
.input-box.srch-box {padding-right:75px}
.input-box .input-box__input {border:0;width:100%}
.input-box .input-box__clear.on {display:block}
.input-box .input-box__clear {display:none;width:20px;height:20px;position:absolute;top:10px;right:10px;border-radius:100%;font-size:0;color:transparent;background:#ddd url("../../images/common/mobile/ico_btn_close.png") no-repeat center;background-size:10px auto}
.input-box .input-box__srch {width:20px;height:20px;position:absolute;top:10px;right:10px;font-size:0;color:transparent;background:url("../../images/common/mobile/ico_header_search.png") no-repeat center; background-size:19px auto;}
.input-box.srch-box .input-box__clear {right:45px}
.input-file {position:relative}
.input-file__label {display:inline-block;padding:10.5px 0;width:100%;border:1px solid #eee;border-radius:3px;font-size:1.4rem;line-height:17px;font-weight:400;letter-spacing:normal;text-align:center;color:#000;background:#f8f8f8}
.input-file__input {width:0;height:0;position:absolute;top:0;left:0;opacity:0}

/* 사이즈 */
.size-l {width:100% !important}
.size-m {width:calc(70% - 3px) !important}
.size-s {width:30% !important}

/* 라디오 버튼 / 체크박스 / 셀렉트 박스 */
.inp-box {margin-top:-15px;margin-left:-15px;font-size:0}
.inp-box.default {margin:0}
.inp-box.login {margin:10px 5px}
.inp-box.default .inp-box__chk, .inp-box.login .inp-box__chk {margin:0;width:auto}
.inp-box.default .inp-box__radio, .inp-box.login .inp-box__radio {margin:0;width:auto}
.inp-box__radio {display:inline-block;margin-left:15px;margin-top:15px;width:calc(33.3% - 30px);position:relative}
.inp-box__radio input[type=radio] {position:absolute;top:0;left:0;width:0;height:0}
.inp-box__radio label {display:inline-block;padding-left:30px;font-size:1.4rem;line-height:20px;letter-spacing:normal;font-weight:400;color:#000;background:url("../../images/common/mobile/ico_radio_bg_01.png") no-repeat 0 0;background-size:20px 20px}
.inp-box__radio input[type=radio]:checked + label {background:url("../../images/common/mobile/ico_radio_bg_02.png") no-repeat 0 0;background-size:20px 20px}
.inp-box__radio input[type=radio]:disabled + label {color:#ccc;background:url("../../images/common/mobile/ico_radio_bg_03.png") no-repeat 0 0;background-size:20px 20px}
.inp-box__chk {display:inline-block;margin-left:15px;margin-top:15px;width:calc(33.3% - 30px);position:relative}
.inp-box__chk input[type=checkbox] {position:absolute;top:0;left:0;width:0;height:0}
.inp-box__chk label {display:inline-block;padding-left:30px;font-size:1.4rem;line-height:20px;letter-spacing:normal;font-weight:400;color:#000;background:url("../../images/common/mobile/ico_checkbox_bg_01.png") no-repeat 0 0;background-size:20px 20px}
.inp-box__chk input[type=checkbox]:checked + label {background:url("../../images/common/mobile/ico_checkbox_bg_02.png") no-repeat 0 0;background-size:20px 20px}
.inp-box__chk input[type=checkbox]:disabled + label {color:#ccc;background:url("../../images/common/mobile/ico_checkbox_bg_03.png") no-repeat 0 0;background-size:20px 20px}

.select-box {font-size:0}
.select-box button {padding:0;margin-left:4px;width:80px}
.select-box select {width:calc(100% - 84px)}

/* 레이어 팝업 공통 */
.layer-box {z-index:200;overflow:hidden;display:none;position:fixed;top:10px;left:10px;right:10px;bottom:10px;border-radius:3px}
.layer-box.on {display:block}
.layer-pop {padding-top:40px;height:100%;position:relative}
.layer-pop__top {padding:0 20px;width:100%;position:absolute;top:0;left:0;background:#536371}
.layer-pop__top .tit {font-size:1.7rem;line-height:40px;font-weight:400;letter-spacing:normal;color:#fff}
.layer-pop__top .btn-close {display:block;width:30px;height:30px;position:absolute;top:5px;right:12px;font-size:0;color:transparent;background:url("../../images/common/mobile/ico_btn_close.png") no-repeat center;background-size:16px auto}
.layer-pop__cnt {overflow-y:auto;height:100%;background:#fff}
.layer-pop__cnt .scroll-wrap {padding-bottom:60px;background:#fff}
.layer-pop__cnt.small {height:auto;max-height:100%;background:#fff}

/* button */
a.btn__large--black, button.btn__large--black {display:inline-block;width:100%;height:60px;border-radius:3px;font-size:1.8rem;line-height:60px;text-align:center;letter-spacing:normal;font-weight:700;color:#fff;background:#000}
a.btn__large--white, button.btn__large--white {display:inline-block;width:100%;height:60px;border-radius:3px;border:1px solid #999;font-size:1.8rem;line-height:60px;text-align:center;letter-spacing:normal;font-weight:700;color:#000;background:#fff}
a.btn__large--gray, button.btn__large--gray {display:inline-block;width:100%;height:60px;border-radius:3px;border:1px solid #ccc;font-size:1.8rem;line-height:60px;text-align:center;letter-spacing:normal;font-weight:700;color:#666;background:#f3f3f3}
a.btn__large--red, button.btn__large--red {display:inline-block;width:100%;height:60px;border-radius:3px;font-size:1.8rem;line-height:60px;text-align:center;letter-spacing:normal;font-weight:700;color:#fff;background:#f97063}
.login-box a.btn__large--red, .login-box button.btn__large--red {height:50px;font-size:1.5rem;line-height:50px;font-weight:500}

a.btn__midium--black, button.btn__midium--black {display:inline-block;width:calc(50% - 2px);height:50px;border-radius:3px;font-size:1.6rem;line-height:50px;text-align:center;letter-spacing:normal;font-weight:500;color:#fff;background:#000}
a.btn__midium--white, button.btn__midium--white {display:inline-block;width:calc(50% - 2px);height:50px;border-radius:3px;border:1px solid #999;font-size:1.6rem;line-height:50px;text-align:center;letter-spacing:normal;font-weight:500;color:#000;background:#fff}
a.btn__midium--gray, button.btn__midium--gray {display:inline-block;width:calc(50% - 2px);height:50px;border-radius:3px;border:1px solid #ccc;font-size:1.6rem;line-height:50px;text-align:center;letter-spacing:normal;font-weight:500;color:#666;background:#f3f3f3}
a.btn__midium--red, button.btn__midium--red {display:inline-block;width:calc(50% - 2px);height:50px;border-radius:3px;font-size:1.6rem;line-height:50px;text-align:center;letter-spacing:normal;font-weight:500;color:#fff;background:#f97063}

a.btn__normal--black, button.btn__normal--black {display:inline-block;padding:0 20px;min-width:80px;height:40px;border-radius:3px;font-size:1.4rem;line-height:40px;text-align:center;letter-spacing:normal;font-weight:500;color:#fff;background:#000}
a.btn__normal--white, button.btn__normal--white {display:inline-block;padding:0 20px;min-width:80px;height:40px;border-radius:3px;border:1px solid #999;font-size:1.4rem;line-height:40px;text-align:center;letter-spacing:normal;font-weight:500;color:#000;background:#fff}
a.btn__normal--gray, button.btn__normal--gray {display:inline-block;padding:0 20px;min-width:80px;height:40px;border-radius:3px;border:1px solid #ccc;font-size:1.4rem;line-height:40px;text-align:center;letter-spacing:normal;font-weight:500;color:#666;background:#f3f3f3}
a.btn__normal--red, button.btn__normal--red {display:inline-block;padding:0 20px;min-width:80px;height:40px;border-radius:3px;font-size:1.4rem;line-height:40px;text-align:center;letter-spacing:normal;font-weight:500;color:#fff;background:#f97063}

/* contents */
.contents {padding-top:70px;padding-bottom:60px}
.sub .contents {padding-top:60px}
.sub .contents.fix_btn {overflow-y:scroll;padding-bottom:60px;height:100vh}
.sub .tabwrap .contents {padding-top:120px}

.box-cnt:first-child {margin-top:0}
.box-cnt {margin-top:10px;background:#fff}
.box-cnt__top {position:relative;padding:15px 20px}
.box-cnt__top .tit {display:inline-block;padding-right:28px;position:relative;font-size:1.7rem;font-weight:500;letter-spacing:normal;line-height:47px;color:#000}
.box-cnt__top .tit .more {display:block;width:28px;height:47px;position:absolute;top:50%;right:0;transform:translateY(-50%);font-size:0;color:transparent}
.box-cnt__top .tit .more:after {display:block;content:"";width:8px;height:8px;position:absolute;top:18.5px;right:12px;border-top:1px solid #000;border-right:1px solid #000;-webkit-transform:rotate(45deg);transform:rotate(45deg)}
.box-cnt__top .time {float:right;font-size:1.2rem;letter-spacing:normal;font-weight:400;line-height:47px;color:#ccc}

.box-cnt__bottom {position:relative;padding:0 20px}

.tab-cnt__list {display:none}
.tab-cnt__list.on {display:block}

.box-cnt__bottom .default-list {padding:18px 0;width:70%}
.default-list > li {padding-left:12px;position:relative}
.default-list > li:before {display:block;content:"";position:absolute;top:12px;left:0;width:2px;height:2px;background:#666}
.default-list > li a {display:inline-block;width:100%;font-size:1.4rem;line-height:28px;letter-spacing:normal;font-weight:400;color:#666}
.default-list .prd_tail {margin-right:8px;font-weight:700;font-size:1.4rem;line-height:28px;letter-spacing:normal;color:#000}

/* quick */
.quick-btn {z-index:100;width:45px;height:45px;padding:9.5px 0;position:fixed;bottom:177px;right:20px;text-align:center;border-radius:100%;box-shadow:0px 4px 10px 0 rgba(0, 0, 0, 0.2);background:#f97063}
.quick-btn__link {position:absolute;top:0;left:0;right:0;bottom:0;font-size:0;color:transparent}
.quick-btn .new {display:inline-block;width:19px;height:23px;background:url(../../images/common/mobile/ico_bell.png) no-repeat 0 0;background-size:19px 23px}
.quick-btn .newNum {display:inline-block;padding:3px 0px 3px 4px;margin:2px 0 0 -11px;border-radius:10px 0 0 10px;font-size:1.2rem;line-height:18px;font-weight:700;vertical-align:top;letter-spacing:-0.3px;color:#fff;background:#f97063}

/* top */
.top-btn {display:none;z-index:100;width:45px;height:45px;padding:9.5px 0;position:fixed;bottom:122px;right:20px;text-align:center;border:1px solid #ddd;border-radius:100%;box-shadow:0px 4px 10px 0 rgba(0, 0, 0, 0.2);background:#fff}
.top-btn__link {position:absolute;top:0;left:0;right:0;bottom:0;font-size:0;color:transparent;background:url("../../images/common/mobile/ico_arrow_top.svg") no-repeat center;background-size:16px 9px}

/* footer */
.footer {padding:25px 20px;background:#333}
.footer__tit {display:inline-block;padding-bottom:1px;border-bottom:1px solid #fff;font-size:1.3rem;font-weight:400;letter-spacing:normal;color:#fff}
.footer__tel {overflow:hidden;margin-top:20px}
.footer__tel--list {overflow:hidden;position:relative;margin-left:-5px}
.footer__tel--list li {float:left;padding:0 5px;position:relative;font-size:1.1rem;line-height:16px;font-weight:400;letter-spacing:normal;color:#999}
.footer__tel--list li:before {display:block;content:"";width:1px;height:9px;position:absolute;top:50%;left:0;transform:translateY(-50%);background:#999}
.footer__tel--list li a {display:inline-block;font-size:1.1rem;line-height:16px;font-weight:400;letter-spacing:normal;color:#999}
.footer__customer {font-size:1.3rem;font-weight:400;line-height:24px;letter-spacing:normal;color:#fff}
.footer__customer span {letter-spacing:-0.33px;line-height:18px;color:#fff}
.footer__copy {font-size:1.1rem;letter-spacing:normal;line-height:18px;font-weight:400;color:#999}