@charset "utf-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@latest/dist/web/static/pretendard.css");

/* @import url('fonts.css'); */

/* CSS Document */
html,body{width:100%;height:100%;background-color:#fff;}
body{padding:0;margin:0;font-family:'Pretendard','sans-serif', 'Meiryo', 'Microsoft YaHei';font-size:14px;color:#000;font-weight:500;line-height: 1.5;}
*, *::before, *::after{
    font-family: "Pretendard", serif !important;
}

body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,tr,td,thead,tbody,form,fieldset,legend,input,textarea,button{margin:0;padding:0;}

h1, h2, h3, h4, h5, h6{font-weight:normal;}
body *{-webkit-box-sizing:border-box;box-sizing: border-box;-moz-box-sizing: border-box;}
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display: block;}
ul,ol,li,dl,dt,dd {list-style:none;}
i,em,address{font-style:normal;}
label,button{cursor:pointer;-webkit-tap-highlight-color: transparent;}
button{position:relative;outline:none;}
hr,legend {position:absolute;left:-1000%;top:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden;}
fieldset,iframe {border:none;vertical-align:middle;}
img{max-width:100%;vertical-align:top;border:0}
caption {/*position:absolute;left:-1000%;top:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden*/line-height:0;visibility:hidden;font-size:0;}
input,select,button{vertical-align:middle;font-family:inherit;outline:none;font:inherit;}
textarea{font:inherit;outline:none;}
button{border:none;-webkit-tap-highlight-color: transparent;}
table{border:none; border-collapse:collapse; padding:0; border-spacing:0;}
table th{font-weight:400;}
table img{vertical-align:middle;}
a{text-decoration:none;color:#000;-webkit-tap-highlight-color: transparent;}
a:link,a:visited,a:focus{text-decoration:none;}
a:hover,a:active{text-decoration:none;}
.blind{display:block;overflow:hidden;top:-1000em;position:absolute;}
::before, ::after, :before, :after {-webkit-box-sizing:border-box;box-sizing: border-box;-moz-box-sizing: border-box;}
a.under{text-decoration:underline;}

/*공통부분*/
input[type=text], input[type=password], input[type=tel], input[type=email], input[type=number]{height:42px;border-radius:0;border:1px solid #000;background:#fff;padding:0 16px;-webkit-appearance:none;-moz-appearance:none;appearance:none;transition:box-shadow 0.2s ease;}
textarea{border:1px solid #000;padding:12px 16px;border-radius:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;resize:none;transition:box-shadow 0.2s ease;}
select{border-radius:0;background:#fff;border:1px solid #000;height:42px;margin:0;padding:0 20px 0 12px;vertical-align:middle;background:#fff right 8px center / 10px auto url('../images/select_arrow.png') no-repeat;-webkit-appearance:none;-moz-appearance:none;appearance:none;transition:box-shadow 0.2s ease;}
button:active{filter:brightness(90%);}
a:active{filter:brightness(90%);}
input[type=text]:focus, input[type=password]:focus, input[type=tel]:focus, input[type=email]:focus, input[type=number]:focus, textarea:focus, select:focus, textarea:focus{border-color:#000 !important;box-shadow:0 0 5px 1px rgba(0, 42, 106, 0.3);}
input[type=text]:disabled, input[type=password]:disabled, input[type=tel]:disabled, input[type=email]:disabled, input[type=number]:disabled, textarea:disabled, select:disabled{background:#ddd !important;border-color:#d4d4d5 !important;color:#7d7d7d !important;}
input[type=text]:read-only, input[type=password]:read-only, input[type=tel]:read-only, input[type=email]:read-only, input[type=number]:read-only, textarea:read-only{background:#ddd;border-color:#d4d4d5;color:#7d7d7d;}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #98a6ac; }
input::-ms-input-placeholder, textarea::-ms-input-placeholder { color: #98a6ac; }
input::-moz-placeholder, textarea::-moz-input-placeholder { color: #98a6ac; }
/*.requiredError:after{display:block;padding-top:2px;font-size:12px;color:#ff0000;content:'필수값을 입력해주세요';}*/
.requiredError input[required], .requiredError select[required]{border-color:#ff0000;}
[required].requiredError{border-color:#ff0000;}
@media (max-width:340px) {
    input[type=text], input[type=password], input[type=tel], input[type=email], input[type=number]{padding:0 12px;}
    textarea{padding:10px 12px;}
}

/**/
#wrap{position:relative;min-height:100%;padding-bottom:24px;background:#fff;}
#wrap.fixbtn{padding-bottom:calc(24px + 52px);}
#wrap.bg{background:#f1f6fa;}
#wrap.flex {display: flex; flex-direction: column;}
@media (max-width:340px) {
    #wrap{position:relative;min-height:100%;padding-bottom:18px;background:#fff;}
    #wrap.fixbtn{padding-bottom:calc(18px + 52px);}
}

/**/
.content {padding: 24px 24px 0 24px;background:#fff;}
.content.full {display: flex; flex-direction: column; justify-content: center; flex: 1; }
.content.nps {padding: 24px 0 0 0;}
.content.npt {padding-top: 0 !important;}
.content.login {padding-top: 30px !important;}
.content.boardList {padding: 0 !important; background:transparent;}
.content.hdm{padding: 0;background: #E2F2FF;}
@media (max-width:340px) {
    .content {padding:18px 18px 0 18px;background:#fff;}
    .content.nps {padding:18px 0 0 0;}
    .content.npt {padding-top:0 !important;}
    .content.login {padding-top:24px !important;}
}


/**/
.paymentView{}
.paymentView > .wrap{padding:18px 24px;background:#fff;}
.paymentView > .wrap + .wrap{border-top:1px solid #d7e2e4;}
.paymentView > .wrap:last-child {padding-bottom:0;}

.paymentView .payBox {}
.paymentView .payBox + .payBox {margin-top:24px;}

.paymentView .payBox.multi {display:flex;align-items:center;font-size:16px;}
.paymentView .payBox.multi > dt {padding-right:24px;}
.paymentView .payBox.multi > dt strong{font-weight:700;}
.paymentView .payBox.multi > dd {flex:1;text-align:right;}

.paymentView .payBox.single {font-size:16px;}
.paymentView .payBox.single > dt {margin-bottom:16px;}
.paymentView .payBox.single > dt strong{font-weight:700;}
.paymentView .payBox.single > dd {overflow:hidden;}

.paymentView .payBox.tops {padding-top:18px;border-top:1px solid #d7e2e4;}

.paymentView .fee {position:relative;float:right;display:flex;justify-content:center;align-items:center;min-width:178px;height:28px;padding:0 38px;text-align:center;font-size:18px;font-weight:700;}
.paymentView .fee .value, .paymentView .fee:after {line-height:1;}
.paymentView .fee:after {padding-left:4px;content:'원';}
.paymentView .fee.mileage_fee:after {content:'점';}
.paymentView .feeBtn {position:absolute;overflow:hidden;top:50%;width:28px;height:28px;margin-top:-14px;background:#3e82f4;border-radius:100%;}
.paymentView .feeBtn:before, .paymentView .feeBtn:after {position:absolute;left:50%;top:50%;width:16px;height:2px;margin:-1px 0 0 -8px;background:#fff;}
.paymentView .feeBtn.minus {left:0;}
.paymentView .feeBtn.plus {right:0;}
.paymentView .feeBtn.minus:before {content:'';}
.paymentView .feeBtn.plus:before {content:'';}
.paymentView .feeBtn.plus:after {transform:rotate(90deg);content:'';}

.paymentView .price {font-size:20px;font-weight:600;}
.paymentView .price.before {color:#3e82f4;}
.paymentView .price.after {color:#ff5555;}

.paymentView .tabList {display:flex;flex-wrap:wrap;}
.paymentView .tabList > li{overflow:hidden;flex:1;margin-left:12px;/*margin-top:6px;*/}
.paymentView .tabList > li:first-of-type {margin-left:0;}
/*.paymentView .tabList > li:nth-child(-n+3){margin-top:0;}
.paymentView .tabList > li:nth-child(3n){margin-right:0;}*/
.paymentView .tabList > li > a{display:flex;justify-content: center;align-items: center;padding:8px;height:42px;border-radius:24px;border:1px solid #3e82f4;color:#3e82f4;font-size:16px;transition:all 0.2s ease;box-sizing:border-box;}
.paymentView .tabList > li > a.active{background:#3e82f4;;color:#fff;}

.paymentView #easePay {}
.paymentView #normalPay {display:none;}
.paymentView .addCard {display:block;min-height:24px;padding-right:24px;line-height:23px;;font-size:16px;background:right center / 16px auto url('../images/ico_arrow_right_bold.png') no-repeat;}
.paymentView .payList {display:none;overflow:hidden;margin-top:24px;}
.paymentView .payList > li {float:left;}
.paymentView .payList > li:not(:first-of-type) {float:left;margin-left:50px;}
.paymentView .payList input[type=radio]{position:absolute;display:none;left:-999em;top:-999em;opacity:0;}
.paymentView .payList .payLabel {position:relative;display:block;min-height:24px;/*margin-top:4px;*/padding-left:24px;line-height:23px;font-size:16px;}
.paymentView .payList .payLabel:before{position:absolute;left:0;top:50%;width:16px;height:16px;margin-top:-8px;border:1px solid #000;border-radius:100%;transition:all 0.2s ease;content:'';}
.paymentView .payList input[type=radio] + .payLabel:after{position:absolute;left:3px;top:50%;width:10px;height:10px;margin-top:-5px;background:#3e82f4;border-radius:100%;transition:all 0.1s ease;transform:scale(0);content:'';}
.paymentView .payList input:checked + .payLabel{}
.paymentView .payList input[type=radio]:checked + .payLabel:after{transform:scale(1);}

.paymentView .btnBox {margin-top:24px;}
.paymentView .btnBox .btnSubmit {display:block;width:100%;height:48px;text-align:center;background:#3e82f4;color:#fff;font-weight:500;font-size:16px;border-radius:4px;}

@media (max-width:340px) {
    .paymentView > .wrap{padding:16px 18px;}
}

/**/
.paymentCard {}

.paymentCard .paycardList {overflow:hidden;}
.paymentCard .paycardList > li {border-bottom:1px solid #d7e2e4;background:#fff;transform:scale(1);box-shadow:none;transition:transform 0.1s ease;}
.paymentCard .paycardList > li.ui-sortable-helper {position:relative;z-index:1000;box-shadow:0 0 8px 1px rgba(0, 0, 0, 0.1);transform:scale(1.05);}
.paymentCard .paycardList > li.ui-sortable-placeholder {background:#f1f6fa;visibility:visible !important;}
.paymentCard .paycardList > li .cardBox {display:flex; align-items:center; padding:12px 16px;}
.paymentCard .paycardList > li .cardThumb {overflow:hidden;width:82px;height:52px;border-radius:4px;background-size:cover;background-repeat:no-repeat;background-position:center center;border:1px solid #d7e2e4;}
.paymentCard .paycardList > li .cardData {position:relative;flex:1;overflow:hidden;margin-left:16px;}
.paymentCard .paycardList > li .cardName {display:flex;align-items:center;margin-bottom:2px;}
.paymentCard .paycardList > li .cardName .name {position:relative;display:inline-block;max-width:100%;height:20px;line-height:20px;padding-right:40px;font-size:16px;overflow: hidden; text-overflow: ellipsis;white-space: nowrap;box-sizing:border-box;}
.paymentCard .paycardList > li:first-of-type .cardName .name:after{position:absolute;display:inline-flex;align-items:center;justify-content:center;right:0;top:0%;width:52px;height:20px;text-align:center;background:#ff5555;color:#fff;font-size:11px;border-radius:16px;content:'대표카드';}
.paymentCard .paycardList > li .cardNo {padding-right:40px;color:#98a6ac;max-width:100%;overflow: hidden; text-overflow: ellipsis;white-space: nowrap;box-sizing:border-box;}
.paymentCard .paycardList > li .btnDelete {position:absolute;right:0;bottom:1px;background:transparent;border:none;font-size:12px;text-decoration:underline;}

.paymentCard .deActiveCardList {overflow:hidden;}
.paymentCard .deActiveCardList > li {border-bottom:1px solid #d7e2e4;background:#7d7d7d;transform:scale(1);box-shadow:none;transition:transform 0.1s ease;}
.paymentCard .deActiveCardList > li.ui-sortable-helper {position:relative;z-index:1000;box-shadow:0 0 8px 1px rgba(0, 0, 0, 0.1);transform:scale(1.05);}
.paymentCard .deActiveCardList > li.ui-sortable-placeholder {background:#f1f6fa;visibility:visible !important;}
.paymentCard .deActiveCardList > li .cardBox {display:flex; align-items:center; padding:12px 16px;}
.paymentCard .deActiveCardList > li .cardThumb {overflow:hidden;width:82px;height:52px;border-radius:4px;background-size:cover;background-repeat:no-repeat;background-position:center center;border:1px solid #d7e2e4;}
.paymentCard .deActiveCardList > li .cardData {position:relative;flex:1;overflow:hidden;margin-left:16px;}
.paymentCard .deActiveCardList > li .cardName {display:flex;align-items:center;margin-bottom:2px;}
.paymentCard .deActiveCardList > li .cardName .name {position:relative;display:inline-block;max-width:100%;height:20px;line-height:20px;padding-right:40px;font-size:16px;overflow: hidden; text-overflow: ellipsis;white-space: nowrap;box-sizing:border-box;}
.paymentCard .deActiveCardList > li .resultBox {display:flex; align-items:center; padding:0px 16px;}
.paymentCard .deActiveCardList > li .resultBox .result {position:relative;display:inline-block;max-width:100%;height:20px;line-height:20px;padding-right:40px;font-size:12px;overflow: hidden; text-overflow: ellipsis;white-space: nowrap;box-sizing:border-box; color: #FF5555;}
/*.paymentCard .deActiveCardList > li:first-of-type .cardName .name:after{position:absolute;display:inline-flex;align-items:center;justify-content:center;right:0;top:0%;width:52px;height:20px;text-align:center;background:#ff5555;color:#fff;font-size:11px;border-radius:16px;content:'대표카드';}*/
.paymentCard .deActiveCardList > li .cardNo {padding-right:40px;color:#98a6ac;max-width:100%;overflow: hidden; text-overflow: ellipsis;white-space: nowrap;box-sizing:border-box;}
.paymentCard .deActiveCardList > li .btnDelete {position:absolute;right:0;bottom:1px;background:transparent;border:none;font-size:12px;text-decoration:underline;}



.paymentCard .msg {padding:16px 24px;color:#98a6ac;line-height:1.5;}


/**/
/* 210701 수정 */
.cardAdded {}
.cardAdded .addedHead {display: flex; align-items: flex-end; margin-bottom: 6px; font-size:14px;}
.cardAdded .title {display: flex; align-items: center; margin-right: auto;}
.cardAdded .title > .tit {}
.btnBusinessCard {margin-left: auto; padding-left: 24px; color: #77889c; background: left center / 18px auto url('/kdtf/assets/img/common/chk_blank.png') no-repeat;}
.btnBusinessCard.active {color: #3e82f4; background: left center / 18px auto url('/kdtf/assets/img/common/chk_active.png') no-repeat;}
.cardAdded .cardThumb {overflow:hidden;width:40px;height:26px; margin-right: 6px; background-size:cover;background-repeat:no-repeat;background-position:center center;}
.cardAdded .cardThumb.hidden{display: none;}
.cardAddForm {}
.cardAddForm > li {visibility: visible; opacity: 1; transition: all 0.2s ease;}
.cardAddForm > li.hidden {visibility: hidden; opacity: 0;}
/* .cardAddForm > li + li {margin-top:16px;} */
/* .cardAddForm > li + li:not(:last-child) {margin-top: -1px;} */
.cardAddForm .line {display:flex;}
.cardAddForm .group:not(.btnWrap) {position:relative;display: flex; align-items: center; flex:1; height:48px;padding-left:12px;/*padding-left: 76px;*/padding-right:12px;box-sizing:border-box;/*border:1px solid #d7e2e4;*/border: 1px solid #000;transition: all 0.2s ease;}
.cardAddForm > li + li .group:not(.btnWrap) {border-top: none;}
.cardAddForm > li:last-child {margin-top: 20px;}
.cardAddForm .group.npl {padding-left: 12px;}
.cardAddForm .group.complete {border-color:#000;}
/* .cardAddForm .group.error {border-color:#ff5555 !important;} */
.cardAddForm .group + .group {/*margin-left: 12px;*/border-left: none;}
.cardAddForm .msg {margin-top:6px;font-size:12px;}
.cardGroup {display: flex;height:100%;}
.cardGroup .nums {position:relative;flex:1;padding-left:18px;}
.cardGroup .nums:first-child {padding-left: 0;}
.cardGroup .nums:not(:first-child):before {position:absolute;left:0;top:0;width:18px;height:100%;display:flex;align-items:center;justify-content:center;text-align:center;content:'-';}
.cardGroup .input {text-align:center; font-size: 16px;}
.cardGroup .input[type=password] {font-size:16px;}
.cardAddForm .group .label {display:flex;align-items:center;justify-content:center;left:0;top:0;/*width:76px;*/padding-right: 16px; height:100%;text-align:center;font-size: 12px;}
.cardAddForm .group.error .label {color:#ff5555;}
.cardAddForm .group .input {flex: 1;width:100%;height:100%;border:none;padding:0;background:none;box-shadow:none !important; font-size: 16px;}
.cardAddForm .group.error .input {color:#ff5555;}
/* 211006 추가 */
.cardAddForm .payMsg{
	color: #3273d5;
	margin-top: 6px;
   	font-size: 12px;
}
.cardAddForm #formBusiness{margin-top: unset;}

/*gallery*/
.couponList {display:flex;flex-wrap:wrap;align-items: flex-start;padding:24px 16px 16px 16px;background:#fff;}
.couponList > li {flex:0 1 calc(50% - 7px);padding-bottom:16px;}
.couponList > li:nth-of-type(odd) {margin-right:7px;}
.couponList > li:nth-of-type(even) {margin-left:7px;}
.couponList > li > a {display:block;}
.couponList > li .thumb {overflow:hidden; margin-bottom:12px; border-radius: 12px; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15);}
.couponList > li .thumb img {}
.couponList > li .subj {margin-bottom:4px;font-size:12px;word-break:break-all;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;overflow:hidden;}
.couponList > li .price {font-size:14px;word-break:break-all;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;overflow:hidden;font-weight:600;}

.couponEvent {position: relative; margin: 24px 16px 0 16px; padding: 4px 12px; background: #fff; border: 1px solid #e0e9eb; border-radius: 16px;}
.couponEvent:before {position: absolute; left: 50%; top: -10px; padding: 0 8px; font-weight: 700; background: #fff; transform: translateX(-50%); content: 'BIG EVENT';}
.couponEvent > li {padding: 12px 0;}
.couponEvent > li + li {border-top: 1px solid #e0e9eb;}
.couponEvent > li > a {display: flex; align-items: center;}
.couponEvent > li .thumb {overflow: hidden; width: 134px; margin-right: 16px; border-radius: 8px; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15);}
.couponEvent > li .cont {flex: 1;}
.couponEvent > li .subj {margin-bottom: 4px; overflow: hidden; text-overflow: ellipsis;white-space: nowrap;}
.couponEvent > li .badge {display: inline-flex; align-items: center; justify-content: center; height: 20px; padding: 0 6px; font-size: 12px; color: #fff;letter-spacing: -0.5px; background: #ff5555;}
.couponEvent > li .price {}
.couponEvent > li .price strike {font-size: 16px;}
.couponEvent > li .price strong {padding-left: 4px; font-size: 22px;}

.couponView {}
.couponView > .wrap{padding:24px;background:#fff;}
.couponView > .wrap + .wrap{border-top:1px solid #e0e9eb;}
.couponView > .wrap + .wrap.none {padding-top: 12px; border-top: none;}
.couponView .infor{}
.couponView .infor > .thumb {overflow: hidden; width: 230px; margin: 0 auto; margin-bottom:20px; border-radius: 12px; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15);}
.couponView .infor > .subj {display:flex;flex-wrap:wrap;align-items:center;justify-content: space-between; margin-bottom:12px;padding-bottom:20px;border-bottom:1px solid #d7e2e4;}
.couponView .infor > .subj .price{font-size:16px;font-weight:600;color:#3e82f4;}
.couponView .opt {padding-bottom: 12px; border-bottom:1px solid #d7e2e4;}
.couponView .opt > li {display:flex;flex-wrap:wrap;align-items:center;justify-content: space-between; padding: 8px 0;}
.couponView .payment {padding: 20px 0 12px 0;}
.couponView .payment dt {margin-bottom: 16px;}
.couponView .payment dd {}
.couponView .detail:not(:first-child){margin-top:32px;/*padding-top:24px;border-top:1px solid #d7e2e4;*/}
.couponView .detail > dt{margin-bottom:8px;font-weight:600;}
.couponView .detail > dd{position:relative;padding-left:10px;}
.couponView .detail > dd:before{position:absolute;left:0;top:9px;height:10px;line-height:0;content:'-';}
.couponView .giftMsg {padding-bottom: 16px; word-break: break-all; text-align: center; font-size: 18px; border-bottom: 1px solid #98a6ac; color: #ee9340;}
.couponView .giftMsg input {width: 100%; border: none; padding: 0; height: 28px; font-size: 18px; text-align: center;}
.couponView .giftMsg input:focus {box-shadow: none !important;}
.couponView .giftTit {margin-bottom: 20px;}
.couponView .giftTit .tit {font-size: 20px;}
.couponView .giftTit .subTit {color: #3e82f4;}
.couponView .giftBtnList {}
.couponView .giftBtnList > li + li {margin-top: 16px;}
.couponView .giftBtnList .giftBtn { display: flex; align-items: center; width: 100%; height: 56px; padding: 0 16px; font-size: 16px; text-align: left; border: 1px solid #ddd; background: #fff; border-radius: 16px; box-shadow: 0 2px 3px 0 rgba(24, 58, 114, 0.14);}
.couponView .giftBtnList .giftBtn:before {display: inline-block; overflow: hidden; width: 32px; height: 32px; margin-right: 12px; border-radius: 100%; vertical-align: middle; background-position: center center; background-repeat: no-repeat; background-size: 32px auto; content: '';}
.couponView .giftBtnList .giftBtn.kakao {border-color: #f9cc36;}
.couponView .giftBtnList .giftBtn.sms {border-color: #3e82f4;}
.couponView .giftBtnList .giftBtn.me {border-color: #000;}
.couponView .giftBtnList .giftBtn.kakao:before {background-image: url('../images/ico_giftkakao.png');}
.couponView .giftBtnList .giftBtn.sms:before {background-image: url('../images/ico_giftsms.png');}
.couponView .giftBtnList .giftBtn.me:before {background-image: url('../images/ico_giftme.png');}

.couponAppView {}
.couponAppView > .wrap {padding: 24px 0;}
.couponAppView > .wrap + .wrap {border-top: 1px solid #d7e2e4;}
.couponAppView .logo {width: 112px; margin: 0 auto; margin-bottom: 16px;}
.couponAppView .headMsg {margin-bottom: 24px; font-size: 16px; text-align: center; }
.couponAppView .subMsg {color: #77889c;}
.couponAppView .btnWrap {margin-bottom: 12px;}
.couponAppView .btnWrap .btns {width: 100%; height: 48px; text-align: center; font-size: 16px; }
.couponAppView .btnWrap .btns.type1 {background: #3e82f4; color: #fff;}
.couponAppView .btnWrap .btns.type2 {border: 1px solid #3e82f4; background: #fff; color: #3e82f4;}

.btnChk{display:flex;flex-wrap:wrap;}
.formLabel + .btnChk{margin-top:6px;}
.btnChk > li {overflow:hidden;flex:0 0 calc(50% - 4px);}
.btnChk > li:nth-of-type(n+3) {margin-top: 12px;}
.btnChk > li > input[type=checkbox], .btnChk > li > input[type=radio] {position:absolute;display:none;left:-999em;top:-999em;opacity:0;}
.btnChk > li > label, .btnChk.nonChk > li > a{display:flex;justify-content: center;align-items: center;padding:8px;height:42px;border-radius:24px;border:1px solid #979797;color:#979797;font-size:14px;transition:all 0.1s ease;}
.btnChk > li > :checked + label, .btnChk.nonChk > li > a.active{border-color:#ff5555;background:#ff5555;color:#fff;}

@media (max-width:340px) {
    .couponView > .wrap{padding:18px;}
    .couponView .infor > .subj{margin-bottom:18px;padding-bottom:18px;}
    .couponView .detail:not(:first-child){margin-top:24px;}
}

/**/
.buttonList {}
.formWrap + .buttonList{margin-top:30px;}
.buttonList > dt{padding:14px 24px 8px;font-size:12px;background:#f1f6fa;}
.buttonList > .list{overflow:hidden;border-top:1px solid #d7e2e4;border-bottom:1px solid #d7e2e4;transition:all 0.4s ease;}
.buttonList > .list + .list{border-top:none;}
.buttonList > .list > .button{position:relative;display:block;height:58px;padding:0 44px 0 24px;line-height:58px;background:#fff right 16px center / 16px auto url('../images/ico_arrow_right_bold.png') no-repeat;}

/**/
.formWrap {padding:0 24px;}
.content:not(.nps) .formWrap{padding:0;}
.formWrap > .title{padding-bottom:16px;text-align:center;font-size:16px;}
.formField {padding-bottom:30px;}
.formField.policyField{font-size:12px;}
.formField + .formField {padding-top:30px;border-top:1px solid #d7e2e4;}
.formField:last-of-type{padding-bottom:0;}
.formField > li {}
.formField.policyField > li:not(:first-child){padding-left:8px;padding-right:8px;}
.formField > li.twin{display:flex;}
.formField > li + li{padding-top:16px;}
.formField > li.submit {padding-top:30px;}
.formField > li.msg{font-size:12px;}
.formField .formLabel{display:block;padding-bottom:6px;}
.formField > li.twin .formLabel{flex:0 0 90px;}
.formField .formGroup{position:relative;display:flex;}
.formField > li.twin .formGroup{flex:1;}
.formField .formGroup .chkForm {position:relative;overflow:hidden;display:flex;align-items:center;min-height:32px;}
.formField .formGroup .chkForm a{margin-left:auto;text-decoration:underline;}
.formField .formGroup input[type=text], 
.formField .formGroup input[type=password], 
.formField .formGroup input[type=tel], 
.formField .formGroup input[type=email],
.formField .formGroup input[type=number],
.formField .formGroup select,
.formField .formGroup textarea,
.formField .formGroup .chkForm,
.formField .formGroup .btnChk {
    flex:1;
    width:100%;
}
.formField .formGroup * + *:not(button):not(label):not(li){margin-left:6px;}
.formField .formGroup input[type=checkbox], .formField .formGroup input[type=radio]{position:absolute;display:none;left:-999em;top:-999em;opacity:0;}
.formField .formGroup .chkLabel {position:relative;display:block;min-height:24px;/*margin-top:4px;*/padding-left:32px;line-height:23px;}
.formField .formGroup .chkLabel:before{position:absolute;left:0;top:0;width:24px;height:24px;border:1px solid #000;border-radius:100%;transition:all 0.2s ease;content:'';}
.formField .formGroup input[type=checkbox] + .chkLabel:not(.full):after{content:'';}
.formField .formGroup input[type=radio] + .chkLabel:not(.full):after{left:6px;top:6px;width:12px;height:12px;background:#000;border-radius:100%;transition:all 0.1s ease;transform:scale(0);content:'';}
.formField .formGroup input:checked + .chkLabel{/*color:#3e82f4;*/}
.formField .formGroup input:checked + .chkLabel:before{border-color:#3e82f4;background:#3e82f4 center center / 20px auto url('../images/ico_chkbox_on.png') no-repeat;}
.formField .formGroup input[type=checkbox]:checked + .chkLabel:after{}
.formField .formGroup input[type=radio]:checked + .chkLabel:after{transform:scale(1);background:#3e82f4;}
.formField .formGroup .chkLabel.full{display:flex;flex:0 0 100%;align-items:center;min-height:48px;/*margin-bottom:4px;*/padding:10px 24px 10px 50px;font-size:14px;border:1px solid #000;border-radius:4px;transition:all 0.2s ease;}
.formField .formGroup .chkLabel.full:before{border:none;left:20px;top:50%;width:20px;height:20px;transform:translateY(-50%);background:transparent center center / 20px auto url('../images/ico_chkbox_off.png') no-repeat;}
.formField .formGroup input:checked + .chkLabel.full{border-color:#3e82f4;background:#3e82f4;color:#fff;}
.formField .formGroup input:checked + .chkLabel.full:before{background:transparent center center / 20px auto url('../images/ico_chkbox_on.png') no-repeat;}
.formField .formGroup > input + button{flex:0 0 64px;margin-left:8px;text-align:center;background:#000;color:#fff;border-radius:4px;}

@media (max-width:340px) {
    .formWrap {padding:0 18px;}
    .formField {padding-bottom:24px;}
    .formField > li + li{padding-top:12px;}
    .formField + .formField {padding-top:24px;}
    .formField > li.submit {padding-top:24px;}
}

@media (max-width:340px) {
    .buttonList > dt{padding:10px 18px 8px;}
    .buttonList > .list > .button{padding:0 38px 0 18px;}
    .buttonList > .list > .button:after{right:18px;}
}


.paycoinState {padding: 20px 24px;border-bottom: 8px solid #f2f6f9; }
.paycoinState .logo {margin-bottom: 18px;}
.paycoinState .logo img {width: 100px;}
.paycoinState .stateWrap {display: flex; align-items: flex-start; }
.paycoinState .stateWrap .coin {flex: 1;}
.paycoinState .stateWrap .coin .head {font-size: 16px; color: #77889c; }
.paycoinState .stateWrap .price {display: flex; align-items: center;}
.paycoinState .stateWrap .price strong {font-size: 30px; font-weight: normal; }
.paycoinState .stateWrap .price .btnRefresh {width: 24px; height: 24px; margin: 2px 0 0 10px; border-radius: 100%; background: center center / 12px auto url('../images/ico_refresh.png') no-repeat; box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.18); }
.paycoinState .stateWrap .quote {font-size: 16px;}
.paycoinState .stateWrap .quote em {color: #3e82f4; }
.paycoinState .alert {margin-left: auto;}
.paycoinState .alert a {padding-left: 22px; font-size: 16px; color: #77889c; background: left center / 20px auto url('../images/ico_notice.png') no-repeat;}
.paycoinState .btnWrap {display: flex; align-items: center; margin-top: 20px; font-size: 16px; text-align: center;}
.paycoinState .payBtn { display: flex; align-items: center; justify-content: center; height: 48px; border: 1px solid #3e82f4; background: #fff; border-radius: 4px; }
.paycoinState .payBtn:before { margin-right: 4px; background-size: cover; background-repeat: no-repeat; content: ''; }
.paycoinState .payBtn.chkquo { width: 116px; color: #3e82f4;}
.paycoinState .payBtn.reward { flex: 1; margin-left: 8px; color: #fff; background: #3e82f4; }
.paycoinState .payBtn.chkquo:before {margin-top: 1px; width: 16px; height: 16px; background-image: url('../images/ico_chart.png');}
.paycoinState .payBtn.reward:before {margin-top: 2px; width: 20px; height: 22px; background-image: url('../images/ico_won.png');}

.paycoinResult { margin-top: -28px; text-align: center; }
.paycoinResult .thumb {width: 196px; margin: 0 auto; margin-bottom: 6px; }
.paycoinResult .coin {flex: 1;}
.paycoinResult .price {}
.paycoinResult .price strong {font-size: 30px; font-weight: normal; }
.paycoinResult .quote {font-size: 16px;}
.paycoinResult .quote em {color: #3e82f4; }
.paycoinResult .ballon {position: relative; width: 260px; margin: 0 auto; line-height: 38px; margin-top: 18px; font-size: 16px; color: #fff; background: #3e82f4; border-radius: 8px;}
.paycoinResult .ballon:before {position: absolute; left: 50%; top: -10px;  width: 0; height: 0; margin-left: -9px; border-left: 9px solid transparent; border-right: 9px solid transparent; border-bottom: 10px solid #3e82f4; content: ''; }

/* */
.historyList{background:#fff; padding: 0 24px;}
.historyList > li{position:relative;padding:16px 0;border-bottom:1px solid #d7e2e4;}
.historyList > li .result{display:flex;flex-wrap:wrap;align-items:top;justify-content: space-between;}
.historyList > li .result ~ .result {margin-top:3px;font-size:13px;}
.historyList > li .result .history {font-size: 16px; font-weight: normal; }
.historyList > li .result .price {font-size: 16px; font-weight: normal; }
.historyList > li .result .date {margin-left: auto;}
.historyList > li .result > *:first-of-type{max-width:160px;}

@media (max-width:340px) {
  .historyList > li{padding:12px 0;}
}

.boardMore{padding:24px 24px 0 24px;}

.list-content {}
.list-content + .list-content{margin-top:30px;}
.list-content > dt{font-size:14px;font-weight:600;word-break:break-all;}
.list-content > dd{position: relative; padding-left: 14px; font-size:14px;margin-top:6px;word-break:break-all;}
.list-content > dd:before {position: absolute; left: 0; top: 10px; width: 6px; height: 1px; background: #000; content: '';}
.list-content > dd > p:not(:first-of-type){margin-top:8px;}

/**/
/*font-color*/
.fc_type1 {color:#3e82f4 !important;}
.fc_type2 {color:#ffe21b !important;}/**/ 
.fc_type3 {color:#ff5555 !important;}/**/ 
.fc_type4 {color:#98a6ac !important;}/**/ 

/**/
.fs_12{font-size:12px !important;}
.fs_14{font-size:14px !important;}
.fs_16{font-size:16px !important;}
.fs_18{font-size:18px !important;}
.fs_20{font-size:20px !important;}

/*title*/
.mainTitle{text-align:center;padding:12px 24px;font-size:14px;color:#98a6ac;/* border-bottom:1px solid #d7e2e4 */;background:#f1f6fa;}
.mainTitle.nbg { background:#fff; border-bottom: 1px solid #e0e9eb; color: #3e82f4; }
.mainTitle + * {border-top:none !important;}

/*msgTitle*/
.msgTitle {position: relative; display: flex; align-items: center; padding:12px 40px 12px 24px; font-size:14px; color:#3e82f4; background:#f1f6fa;}
.msgTitle .btnClose {position: absolute; display: block; right: 20px; top: 50%; width: 18px; height: 18px; margin-top: -9px; background: center center / 18px auto url('../images/ico_close.png') no-repeat; }
.msgTitle .ico {width: 24px; height: 24px; margin-right: 10px; background-size: 24px auto; background-repeat: no-repeat; background-position: center center; }
.msgTitle .ico.chk {background-image: url('../images/ico_msgtitle_chk.png'); }
.msgTitle .cont {flex: 1;}
.msgTitle .tit {height: 22px; font-size: 16px; font-weight: 700;}
.msgTitle .msg {font-size: 12px;}

/**/
.fixBtn{position:fixed;z-index:999;left:0;right:0;bottom:0;width:100%;display:flex;}
.fixBtn > button, .fixBtn > a{display:block;width:100%;height:65px;text-align:center;background:#3e82f4;color:#fff;font-weight:500;font-size:16px;transition:all 0.2s ease;}
.fixBtn > a{line-height:52px;}
.fixBtn > button.type1, .fixBtn > a.type1{background:#fff;border-top:1px solid #d7e2e4;color:#000;}
.fixBtn > button.type2, .fixBtn > a.type2{display: flex; align-items: center; justify-content: center; background:#fff;border-top:1px solid #d7e2e4;color:#77889c; font-size: 16px; font-weight: normal;}
.fixBtn > .type2 .ico {width: 18px; height: 18px; margin-right: 8px;}
.fixBtn > .type2 .ico.home {background: center center / 18px auto url('../images/ico_giftbtn_home.png') no-repeat; }
.fixBtn > .type2 .ico.shop {background: center center / 18px auto url('../images/ico_giftbtn_shop.png') no-repeat;}
.fixBtn > .type2 + .type2 {border-left: 1px solid #d7e2e4;}
.fixBtn > button:disabled{background:#98a6ac;}

/*sysmodal 211206modify*/
.sysModal{position:fixed;z-index:1000;left:0;top:0;right:0;bottom:0;visibility:hidden;pointer-events:none;touch-action: manipulation;}
.sysModal:before{position:fixed;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.6);opacity:0;transition:all 0.3s ease;content:'';}
.sysModal .modalWrap{position:fixed; left:50%;top:50%;width:312px;height:auto;padding-bottom:48px;border-radius: 4px; transform:translate3d(-50%, calc(-50% - 30px), 0);opacity:0;transition:all 0.3s ease;}
.sysModal .modalWrap.lg{padding-bottom:58px;}
.sysModal.show{display:block;visibility: visible;pointer-events:all;}
.sysModal.show:before{opacity:1;}
.sysModal.show .modalWrap{opacity:1;transform:translate3d(-50%, -65%, 0);}
.sysModal .content{position:relative;padding:24px 30px; text-align: center;}
.sysModal .content + .content {border-top: 1px solid #e0e9eb;}
.sysModal .content.thin {padding: 24px;}
.sysModal .content > .title{margin-bottom: 8px;font-size:16px;font-weight:600;word-break:break-all;}
.sysModal .content > .msg{word-break:break-all; font-size: 14px;}
.sysModal .btn_wrap{position:absolute;display:flex;left:0;right:0;bottom:0;width:100%;}
.sysModal .btn_wrap button{display:block;width:100%;height:48px;background:#3e82f4;color:#fff;font-weight:500;font-size:16px;}
.sysModal .modalWrap.lg .btn_wrap button {height: 58px;}
.sysModal .modalWrap.lg .btn_wrap button:not(.disabled):not(:disabled) {font-size: 18px;}
.sysModal .btn_wrap button.type1{background:#fff;border-top:1px solid #d7e2e4;color:#000;}
.sysModal .btn_wrap button.type1 + button.type1 {border-left: 1px solid #d7e2e4;}
.sysModal .btn_wrap button.disabled,
.sysModal .btn_wrap button:disabled {
    font-size: 16px;
    background: #e0e9eb;
    color: #000;
}
.sysModal .cardInfor {font-size:16px;}
.sysModal .btn_out_close {position: fixed; overflow: hidden; left: 50%; top: 50%; transform:translate3d(-50%, calc(-50% + 120px), 0); width: 38px; height: 38px; border-radius: 100%; background: center center / 38px auto url('/kdtf/assets/img/common/ico_modal_close.png') no-repeat;}
.sysModal .btn_out_close2 {position: fixed; overflow: hidden; left: 50%; bottom: -78px; width: 38px; height: 38px; margin-left: -19px;border-radius: 100%; background: center center / 38px auto url('/kdtf/assets/img/common/ico_modal_close.png') no-repeat;}

/*btns*/
.btns_g{display:block;overflow:hidden;width:100%;height:48px;padding:0 10px;border-radius:4px;font-size:14px;text-align:center;border:1px solid #000;color:#000;background-color:#fff;background-repeat:no-repeat;background-position:center center;word-break:break-all;}
a.btns_g{display:flex;justify-content: center;align-items: center;}
.btns_g.min{height:32px;font-size:13px;}
.btns_g.submit{background-color:#3e82f4;border-color:#3e82f4;color:#ffe21b;font-size:16px;font-weight:600;}
.btns_g.login{background-color:#3e82f4;border-color:#3e82f4;color:#ffe21b;font-size:16px;font-weight:600;}
.btns_g.kakao{background-color:#f7cf46;border-color:#f7cf46;color:#381f1f;}
.btns_g.kakao:before{display:inline-block;width:20px;height:18px;margin-right:8px;vertical-align:text-bottom;background:center center / cover url('../images/ico_kakao.png') no-repeat;content:'';}
.btns_g.type1{background-color:#3e82f4;border-color:#3e82f4;color:#fff;}/**/ 
.btns_g.type2{border-color:#d7e2e4;color:#1b2727;}/**/ 
.btns_g.type3{background-color:#fff;border-color:#3e82f4;color:#3e82f4;}
.btns_g.type4{background-color:#3273d5;border-color:#3273d5;color:#fff;}
button.btns_g:disabled {background-color:#98a6ac;border-color:#98a6ac;color:#fff;}

.tabWrap{margin-top: 14px;}
.tabWrap > a{padding-bottom: 10px;}