@charset "utf-8"; /* TQPAY : 2022.10.01 : NBR */

/*신규 wrap 추가 */
.wrap_btn { width:100%; max-width:768px; min-height:calc(100vh - 230px); height:100%; margin:70px auto 50px; }
.wrap_keypad { width:100%; max-width:768px; min-height:calc(100vh - 394px); height:100%; margin:114px auto 0; }
.btn_wrap { display: flex; width: 100%; max-width: 768px; padding: 0 20px 32px; margin: 0 auto; }
.keypad_btn { width:100%; max-width:768px; margin:0 auto; padding:0 20px; background-color: var(--main); }
.wrap_compl { width:100%; max-width:768px; min-height:calc(100vh - 375px); height:100%; margin:90px auto 0; }
.btn_50 { font-family: "noto_sans"; width:100%; height:50px; background:var(--inactive); color:var(--black); font-size:1.6rem; font-weight: 500; border-radius: 10px; padding:14px 0; }


/* 신규 추가 */
.selct_design { font-size: 1.4rem; font-weight: 400; width: 100%; padding: 10px 70px 10px 10px; border-radius: 10px; border: 1px solid var(--fran_inactive); font-family: "noto_sans"; outline: none; }
.register_new_btn { height: 30px; width: 80px; color: #fff; font-weight: bold; border-radius: 10px; background-color: var(--main); }
.register_new_compl { height: 30px; width: 80px; color: #fff; border-radius: 10px; font-size: 14px; background-color: var(--main); display: flex; justify-content: center; align-items: center; }
.small_col { display: flex; flex-direction: column; font-size: 14px; color: var(--red); margin-top: 10px; }
.pop_title.pop_newp { padding: 40px 40px 20px 40px !important; }
.p_B40 { padding-bottom: 40px; }
.pop_cont.w_320 { width: 360px !important; }
.id_compl { color: var(--main) }
.pred::placeholder { color: var(--red) !important;}
.mail_edit_txt::placeholder { color: #B1B1B1 !important; }

/* .placew::placeholder { width: 300px; }  */
/* // */

/* .btn_50.btn_active { background: var(--main); color:var(--white); } */
.btn_50.btn_active { background: var(--main); color:var(--white); }
.send_amountin.input_active { border:1px solid var(--main); }
.wallet_addr.input_active { border:1px solid var(--main); }
.pozi { position:relative; top:-1px; }
/*프렌차이즈용*/
.btn_50.fran_active { background: var(--fran); color:var(--white); }
.request_btn.fran_active { background: var(--fran); color:var(--white); }
.myinfo { position: fixed; left:0; bottom:0; width:100%; max-width:768px; right:0; margin:auto; padding:0 32px 20px; background: var(--white); }
.comple_pay { background:var(--fran); width:100%; height:50px; color:var(--white); font-size:1.6rem; font-family: "noto_sans"; font-weight: 500; }
/*//신규 wrap 추가 */

/* header & 하단 탭 메뉴 둘 다 있을때 viewport */
.viewport { height:auto; min-height: calc(100vh - 140px); min-height: calc(100svh - 140px); overflow: auto; }
/* header & 하단 탭 메뉴 둘 다 있을때 - 문제있을때 viewport */
.viewport_60 { height:auto; min-height: calc(100vh - 60px); min-height: calc(100svh - 60px); overflow: auto; }
/* header & 하단 탭 메뉴 없을때 웹 viewport */

.viewport_info { height:auto; min-height: 100vh; min-height: 100svh; overflow: auto; }
/* header 만 있을 때 웹 viewport */
.viewport_header { height:auto; min-height: 100vh; min-height: 100svh; overflow: auto; }

/* 높이 고정 */
.viewport_header.height { height:auto; min-height: 100vh; min-height: 100svh; padding-top:60px; overflow: auto; }

/* header 하단탭 조절 */
.header_bottom { padding : 60px 0 80px; }

/*index 가입 후 확인 페이지 xd : intro 페이지 */
.klaypay_wrap { padding:0 40px; }
.coin_realworld { color:var(--dark); font-size:3.0rem; margin-top:70px; font-weight: 300; }
.coin_realworld span { color:var(--main); font-weight: 500; }
.korea_services { margin-top:70px; font-size:1.4rem; font-weight: 500; color:var(--dark); }
.korea_services span { color:var(--main); font-size:3.8rem; margin-bottom:6px; display: inline-block; }
/* .btn_con { width:100%; border-radius: 10px; height:58px; font-size:1.6rem; background-color: var(--main); color:var(--white); font-weight:700; } */
.btn_con { width:100%; border-radius: 10px; height:58px; font-size:1.6rem; background: var(--main); color:var(--white); font-weight:700; font-family: "noto_sans"; }
.btn_con.small { width:100%; border-radius: 10px; height:50px; font-size:1.6rem; font-weight:700; }
.btn_con.small.n_active { width:100%; border-radius: 10px; height:50px; font-size:1.6rem; background:var(--inactive); color:var(--gray); font-weight:700; }
.btn_con.small.gray { width:100%; border-radius: 10px; height:50px; font-size:1.6rem; background:var(--inactive); color:var(--black); font-weight:700; }
.btn_con.cancel { background:var(--inactive); color:var(--black); }
.btn_con.btn_con_active { background:var(--inactive); color:var(--gray); }
/*//dindex 가입 후 확인 페이지 xd : intro 페이지 */

/* 휴대폰 본인인증 1번 */
.verfiwrap { padding:92px 20px 0; height:80vh; }
.termsofuse_title { font-size:1.8rem; font-weight:700; }
/* individual_chk 내 padding-left:14px; 제거 : 221011 NBR */
.individual_chk { color:var(--dark); margin:10px 0 50px; }


.individual_chk input[type="checkbox"] + label { font-size: 1.4rem; font-weight: 500; padding-left: 30px; background: url("../img/icon/icon_check_off.svg") no-repeat 0 50% / 12px 12px; cursor:pointer; }
.individual_chk input[type="checkbox"]:checked + label { background: url("../img/icon/icon_check_on.svg") no-repeat 0 50% / 12px 12px; cursor: pointer; }
.all_agree span { font-size:1.6rem; font-weight: 500; font-family: "noto_sans"; }
.individual_chk input[type="checkbox"] { display: none; }
/* .individual_chk span { color:var(--main); } */
.clause { width: 16px; height: 16px; background: url("../img/icon/icon_right.svg") no-repeat; background-position: center; cursor: pointer; }
/* .Basic_info { margin-top:40px; font-size:1.8rem; font-weight:700; } */


/* //휴대폰 본인인증 1번 */

/*create_pin*/
/* .send_info { padding-top:32px; text-align: center; font-size:2.2rem; font-weight:700; font-family: "noto_sans"; } */
/* 230321 키패드 변경 */
.send_info { text-align: center; font-size:2.2rem; font-weight:700; font-family: "noto_sans"; }
.send_sinfo { font-size:1.4rem; text-align: center; }
.pinnumber { margin-right:14px; width: 18px; height: 18px; padding-top:10px; border-radius: 50%; background-color: var(--inactive); }
.pinnumber:last-child { margin-right:0 }
.send_button { touch-action: manipulation; color:var(--white); width: 33%; padding: 18px 40px; margin-bottom: 2px; border-radius: 10px; outline: none; border: none; background-color: transparent; font-size:2.6rem; }
.reset_txt { font-size:1.8rem; }
.pin_active { background-color: var(--main); }
.number_box { text-align: center; padding:50px 0; }
.number_box input::placeholder { font-size:2.2rem; }
/* .easy_password { font-size:1.4rem; font-weight: 400; text-align: center; } */
/*//create_pin*/

/* 가입 완료 */
/* join & user complete page : NBR */
.name_txt { font-size: 3rem; font-weight: 500; color: var(--main); padding:22px 0 14px; }
.comp_txt { font-size: 2.6rem; font-weight: 400; color: var(--black); }
.klay_comp_img { text-align: center; margin:70px 0 84px; }
.klay_comp_img img { width: 140px; height: 140px; margin:0 auto; }
.klay_compl_box { text-align: center; margin-bottom: 57px; }
.comp_sub_txt { padding-bottom: 6px; font-size: 1.4rem; font-weight: 500; color: var(--dark); }
.comp_main_txt { font-size: 3.8rem; font-weight: 500; color: var(--main); }
/* .wrapper { } */
.bg_grdi { background: linear-gradient(to top, #fff, #E6F0FE); width:100%; height:100%; }
.joinwrap_btn { margin:90px auto 57px; min-height:calc(100vh - 237px); padding:0 40px; }


/*//가입 완료 */

/* 모바일 기기에서만 접속이 가능합니다 */
.mobile_only { display:flex; flex-direction:column; justify-content:center; align-items:center; height:100%; }
.mobile_only img { margin-bottom:20px; }
/* // 모바일 기기에서만 접속이 가능합니다 */

/* 중복 로그인 */
.duplicate_box { padding:112px 20px 0; background: var(--white); }
.duplicate_txt { font-size:2.2rem; font-weight:700; text-align: center; }
.duplicate_stxt { font-size:1.6rem; font-weight: 400; text-align: center; margin-top:32px; }
.klay_duplicatinfo { margin-top:5.2vh; background-color:var(--lightgray); padding:20px; border-radius: 10px; font-size:1.2rem; }
.klay_duptxt { color:var(--dark); }
.klay_duptxt span { color:var(--main); }
.but_wrap { margin-top:5vh; }
.duplicate_close { width:33%; }
.duplicate_changelogin { width:63%; }
/* 중복 로그인 */

/*송금받기*/
.contents_qr_scan .qrpayment_img { text-align: center; padding:0 42px; }
.qrpayment_img img { margin:0 auto; }
.myqr_state { display: flex; justify-content: space-between; margin:30px 0; }
.choice_box { width:100%; display: flex; font-family: "noto_sans"; justify-content:center; align-items: center; background-color: var(--inactive); border-radius: 10px; height:50px; font-size:1.6rem; font-weight: 500; cursor:pointer; }
.receive_walletbox { position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:100%; text-align: center; padding:0 20px; }

.qr_addrtxt { font-family: "montserrat"; font-weight: 500; font-size: 1.6rem; word-break: break-all; width: calc(100% - 40px); margin: 40px auto; text-align: center; cursor:pointer; }
.qr_active { background: var(--main); color:var(--white); }
.send_qrcon .payment_cont { bottom:0; }
.img_change.active { background-color: var(--main); color: var(--white); }

/* KYC 인증 */
.kyc_bx .applicant_select_box { position: relative; margin-bottom:20px; }
.kyc_bx .applicant_select { display: flex; justify-content: space-between; align-items: center; width: 100%; height:50px; font-size: 1.6rem; background-color: var(--lightgray); border:1px solid var(--gray); cursor: pointer; border-radius: 10px; color:var(--gray); padding:14px 20px; font-weight: 400; }




/*KYC 인증 option 역할 (select 커스텀) */
.scroll_list { display : none; position: absolute; top: 90px; width: 100%; padding: 32px 20px; color:#000; border: 1px solid var(--gray); background-color:var(--lightgray); border-radius: 10px; z-index:10; }
.down { transform: rotate(-180deg); }
.applicant_select > img { transition: 500ms ease; }
.applicant_select_box ul li { font-size: 1.6rem; font-weight: 500; padding-bottom:30px; cursor: pointer; }
.applicant_select_box ul li:last-child { padding-bottom:0; }
.select_title { font-size:1.4rem; font-weight: 500; margin-bottom:10px; }
.kyc_state { display: flex; justify-content: space-between; }
.kyc_state > div { width:49%; justify-content: center; }

/* kyc 인증완료 */
.kyc_completewrap { padding:112px 20px 0; text-align: center; }
.kyc_completewrap li:nth-child(1) { font-size:2.2rem; font-weight:700; }
.kyc_completewrap li:nth-child(2) { font-size:1.6rem; font-weight: 400; padding:32px 0 52px; }

/* 쇼핑몰 결제 */
.shopping_klay_logo { text-align: center; padding-top:50px; }
.shopping_klay_logo img { margin:0 auto; }
.iphone_p { position: relative; top:0; }
.popup_txt { font-size:1.4rem; text-align: center; font-weight: 400; padding:20px 0 0; line-height: 24px; }
.popup_txt span:nth-child(1) { font-size:1.8rem; color:var(--main); font-weight:500; }
.oder_franlist { font-size:2.2rem; color:var(--black); font-weight:700; }
.order_title { font-size:1.6rem; font-weight:700; }
.shoporder_wrap { margin-top:50px; border-top:2px solid var(--black); padding:20px; }
.order_table { display: flex; justify-content: space-between; align-items: center; }
.order_table p:nth-child(1) { font-size:1.4rem; font-weight: 500; color:var(--dark); }

.order_table p:nth-child(2) { font-size:1.4rem; font-weight: 400; color:var(--black); }
.paymentinfo_wrap { padding:22px 20px; border-top:1px solid var(--gray); border-bottom:1px solid var(--gray); }
.paymentinfo_wrap .order_table p:nth-child(2) { font-size:1.4rem; font-weight: 500; color:var(--black); }
.paymentinfo_wrap .order_table p:nth-child(2) span { color:var(--main); font-family: "montserrat"; font-weight: 500; }
.total_amount { padding:20px; border-bottom:2px solid var(--black); }
.total_amount p:nth-child(1) { font-size:1.6rem; font-weight:700; }
.total_amount p:nth-child(2) { font-size:2.2rem; font-weight:700; }
.total_amount p:nth-child(2) span { color:var(--main); font-family: "montserrat"; font-weight:700; }
.agree_shop { background-color: var(--lightgray); padding:16px 0; text-align: center; border-radius: 10px; margin-bottom:20px; }

/* 05.13 font-color 추가: NBR */
.agree_shop label span { color: var(--dark); }

/* 새간편비밀번호 재입력 */
.kycpopup_wrap { position: fixed; top:0; left:0; width: 100%; height: 100%; z-index: 10000; background-color: rgba(0,0,0,0.5); font-family: "noto_sans"; }
.kycpopup_wrap .pop_cont { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); min-width:300px; max-width:300px; max-height:254px; background-color: #fff; border-radius: 10px; z-index: 9920; overflow: hidden; box-shadow: 0px 10px 50px rgba(0,0,0,0.4); }
.kycpopup_wrap .pop_title { font-size:1.8rem; font-weight:700; text-align: center; padding:40px 20px 0; }
.kycpopup_wrap .popup_txt { font-size:1.4rem; text-align: center; font-weight: 400; padding:30px 20px 40px; line-height: 22px; }
.pop_btn { display: flex; }
.pop_btn span { display: block; width: 48%; padding: 10px 0; font-weight: 500; text-align: center; color: #fff; font-size: 1.6rem; border-radius: 26px; cursor: pointer; }
.cancel_btn { background:var(--inactive); height:50px; width:50%; font-size:1.6rem; font-weight: 500; font-family: "noto_sans"; }
.kyc_btn { background:var(--main); height:50px; width:50%; font-size:1.6rem; font-weight: 500; color:var(--white); }

/* 공지사항 */
.notice_list { padding:0 20px 0; }
.notice_text { width:100%; padding:18px 0; border-bottom:1px solid var(--line); min-height:90px; }
.notice_text p { font-size:1.6rem; font-weight: 500; margin-bottom:10px; margin-right: 15px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.notice_open_title span, .notice_text .notice_day { font-size:1.4rem; font-weight: 500; color:var(--dark); font-family: "montserrat"; }
.notice_button { margin:44px 0 40px; }
.notice_null { text-align: center; padding: 20px; font-size:1.8rem; }
.notice_open_title { padding:18px 20px; border-bottom: 1px solid var(--line); }
.notice_open_title p { font-size:1.6rem; font-weight: 500; margin-bottom:10px; }
.notice_viewlist { background: var(--white); }
.notice_text_box { font-size:1.4rem; padding:30px 20px 16px; font-weight: 400; }
.notice_text_box img { max-width:50%; margin:0 auto; }
/* .notice_thumb img { max-width:100%; margin:30px 0; min-height: 180px; } */
.notice_check li:nth-child(1) { font-size:1.6rem; font-weight: 500; }
.notice_check li { font-size:1.4rem; font-weight: 400; }

/*faq */
.faq_wrap { height:auto; }
.faq_title { font-size:1.8rem; font-weight:700; margin-bottom:10px; color:var(--main); padding:0 20px; }
.faq_list { width:100%; cursor:pointer; position: relative; /*margin:0 20px; */ }
.faq_answer { color:var(--main); font-family: "montserrat"; }
.faq_question { padding:18px 0; margin:0 20px; font-size:1.6rem; font-weight: 500; border-bottom:1px solid var(--line); }
.faq_question > p { width: calc(100% - 40px); }
.faq_question > p:last-child { font-size: 1.3rem; font-weight: 400; color: var(--fran_inactive); }
.answer_box { background-color:var(--bg); font-size:1.4rem; font-weight: 400; max-height: 0; overflow: hidden; }
.inquiry_list:after, .faq_list:after { background-position: center; background-image: url("../../assets/img/icon/icon_arrow_down.svg"); background-repeat: no-repeat; display: inline-block; width: 16px; height: 16px; content:""; position:absolute; top:50%; right:20px; transform: translateY(-50%); }
.inquiry_list.active:after, .faq_list.active:after { background-image: url("../../assets/img/icon/icon_arrow_up.svg"); content:""; }
.inquiry_list.active .inquiry_question, .faq_list.active .faq_question { border-bottom: none; }
.answer_faq { padding:20px; line-height:20px; }
.answer_faq img { max-width:50%; }
.bar { width:100%; height:6px; background-color:var(--bg); margin:30px 0; }


/* 1:1 문의 */
.inquiry_wrap { height:auto; }
.inquiry_title { font-size:1.8rem; font-weight:700; margin-bottom:10px; color:var(--main); padding:0 20px; }
.inquiry_list { width:100%; cursor:pointer; position: relative; /*margin:0 20px; */ }
.inquiry_answer { color:var(--main); font-family: "montserrat"; }
.inquiry_question { padding:18px 0; margin:0 20px; font-size:1.6rem; font-weight: 500; border-bottom:1px solid var(--line); }
.inquiry_question > div { display: flex; align-items: flex-start; }
.inquiry_question > div > span { width:50px; }
.inquiry_question > div > p { width: calc(100% - 100px); }
.inquiry_question > p { font-size: 1.3rem; font-weight: 400; color: var(--fran_inactive); }
.questions_inquiry { padding:20px; line-height:20px; word-break: break-all; }
.answer_inquiry { padding:20px; line-height:20px; background-color:var(--white); border-bottom:1px solid var(--line); }
.answer_inquiry .date { font-size: 1.3rem; font-weight: 400; color: var(--fran_inactive); }
.inquiry_box { position: relative; border-bottom: 1px solid var(--line); }
.inquiry_box input { font-size: 1.4rem; font-weight: 400; width: 100%; padding: 10px 70px 10px 10px; border-radius: 10px; border: 1px solid var(--fran_inactive); font-family: "noto_sans"; }
.inquiry_box .txtLength_wrap { position: absolute; bottom: 13px; right: 20px; display: flex; flex-wrap:nowrap; -webkit-flex-wrap:nowrap; align-items: center; font-size: 12px; font-weight: 500; color: var(--fran_inactive); }
.inquiry_box .mail_txtLength_wrap { position: absolute; bottom: 13px; right: 20px; display: flex; flex-wrap:nowrap; -webkit-flex-wrap:nowrap; align-items: center; font-size: 12px; font-weight: 500; color: var(--fran_inactive); }


.inquiry_file_add .inquiry_upload_name { display: inline-block; height: 40px; padding: 0 10px; vertical-align: middle; border: 1px solid var(--fran_inactive); width: 100%; color:var(--black); border-radius: 10px; }
.inquiry_file_add label { position: relative; display: inline-block; width: 100%; color: var(--main); border:1px solid var(--main); vertical-align: middle; cursor: pointer; height: 40px; line-height: 40px; border-radius: 10px; text-align: center; }
.inquiry_file_add input[type="file"] { width: 100%; height: 100%; display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); opacity: 0; }
.inquiry_file_add .position_rel button { position:absolute; right:20px; top:50%; transform: translateY(-50%); }
/*카카오톡 1:1 문의*/
/* .inquiry_txt { font-size:1.6rem; font-weight: 400; padding-top:52px; text-align: center; } */
/* .inquiry_img { margin:70px 0; text-align: center; } */
/* .inquiry_img img { max-width: 100%; margin:0 auto; } */
.information_time { font-size:1.8rem; font-weight:700; }
.time_information { padding:20px; background-color: var(--lightgray); margin-top:20px; border-radius: 10px; }
.time_information p:nth-child(1) { color:var(--main); }
.time_information p { color:var(--dark); font-size:1.4rem; font-weight: 500; padding-top:10px; }

/* 이용약관 */
.klay_services { margin:60px 0 82px; }
 /* border-bottom:1px solid var(--line); */
.klay_titlebox { padding:18px 20px; }
.klay_titlebox li:nth-child(1) { font-size:2.0rem; font-weight:700; margin-bottom:8px; }
.klay_version { font-size:1.4rem; font-weight: 500; color:var(--dark); }
.klay_servicesnum { color:var(--main); margin-bottom:20px; font-size:1.8rem; font-weight:700; }
.klay_list { padding:30px 20px; }
.klay_servicesnum_s { color:var(--dark); font-size:1.6rem; font-weight:700; margin-bottom:10px; }
.klayservices_info { font-size:1.4rem; font-weight: 400; }

/*220609 신규 클래스 추가 : SJW */
.klay_li { padding-left: 20px; }
.klay_li li { list-style-type: decimal; font-size:1.4rem; font-weight: 400; line-height: 20px; }
.klay_li_en { padding-left: 20px; }
.klay_li_en li { list-style-type: upper-alpha; font-size:1.4rem; font-weight: 400; line-height: 20px; }
.down_li { margin-bottom:30px; }
.start_klay { font-size:1.4rem; font-weight: 400; }
.no_margin { margin-bottom:0; }
.klay_table { font-size:1.4rem; font-weight: 400; border:1px solid #ededed; text-align: center; width:100%; }
.klay_table th { width:33%; }
.klay_table thead th { border-bottom:1px solid #ededed; border-right:1px solid #ededed; }
.klay_table thead th:last-child { border-right:none; }
.klay_table tbody td { border-right:1px solid #ededed; }
.klay_table tbody td:last-child { border-right:none; }



/* 지갑으로 송금하기 최종전 */
.send_klay_logo { padding:54px 0 30px; }
.send_klay_logo img { margin:0 auto; }
.send_finchk { font-size:2.2rem; font-weight: 700; padding:50px 0; }
.fail_send_finchk { font-size:2.2rem; font-weight: 700; padding:50px 0 30px; }
.send_sub_finchk { font-size:1.6rem; font-weight: 500; }
.sender_finwrap { padding:20px; border-bottom:1px solid var(--gray); }
.sender_finwrap p:nth-child(2) { font-weight: 500; }
.sender_finwrap p:nth-child(2) span { color:var(--main); font-family: "montserrat"; font-weight: 500; }
.remit_info { font-size:1.6rem; font-weight: 700; }
/* .sender_finbox { border-top:2px solid var(--line); border-bottom:2px solid var(--line); margin-top:62px; } */
.addr_finwrap { padding:20px; }
.send_wallet_addr { word-break: break-all; }
.addr_finwrap p:nth-child(1) { min-width:122px; }
.send_finwrap .check_sender { margin-top:114px; padding:0; }
.btn_swrap { width: 100%; max-width: 768px; padding: 0 20px 32px; margin: 0 auto; }

/* TQ 보내기 23.04.13 */
.send_num_container { background: var(--lightgray); padding: 14px 20px; }
.send_num_tq_box { background: linear-gradient(to bottom right, #11B1F8, #1162F8); border-radius: 10px; overflow: hidden; box-shadow: 0px 3px 15px rgba(0,0,0,0.2); }
.send_card_name { padding:20px 20px 0; }
.send_card_name img { width:20px; height:20px; }
.send_card_name p { font-size:2rem; font-weight: 700; color:var(--white); }
.send_num_tq { padding:6px 20px 30px; font-size:2.6rem; font-family: "montserrat"; font-weight: 600; text-align: center; word-break: break-all; }
.send_num_tq > div:first-child { flex-wrap: wrap; }

.send_input_box.first_pd { padding: 20px 20px 0; }
.send_input_box > p { font-size: 1.6rem; font-weight: 500; margin-bottom: 10px; }
.send_input_box input { background: #FBFBFB; }
.send_input_box small { display: block; font-size:1.2rem; font-weight: 400; margin-top:10px; }
.send_fee_box { padding: 0 20px; display: flex; justify-content: space-between; align-items: center; }
.send_fee_box > p { font-size: 1.6rem; margin-bottom: 10px; }
.send_fee_box > p:first-child { font-weight: 500; }
/* TQ 보내기 확인 23.04.17 */
.tq_send_txt_box { padding: 20px; }
.tq_send_txt_box .tq_send_title { padding: 10px 20px 30px; font-size: 2rem; font-weight: 700; text-align: center; line-height: 1.8; }
.tq_send_txt_box .tq_send_txt_list { padding: 20px 0; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; }
.tq_send_txt_box .tq_send_txt_list > p:first-child { width:120px; color:var(--dark); font-size: 1.6rem; font-weight: 500; }
.tq_send_txt_box .tq_send_txt_list > p:last-child { font-size: 1.6rem; font-weight: 400; }
.tq_send_info_txt, .tq_send_info_txt_red { margin-top: 10px; padding: 0 20px 20px; display: flex; justify-content: flex-start; align-items: flex-start; }
/* .tq_send_info_txt > img, .tq_send_info_txt_red > img { margin-top: 5px; } */
.tq_send_info_txt > p { font-size: 1.4rem; line-height: 1.3; font-weight: 400; color:var(--main); }
/* 23.04.26 TQ 보내기 수정 : KMS */
.tq_send_info_txt_red > p { font-size: 1.4rem; line-height: 1.3; font-weight: 400; color:var(--red); }
.tq_send_txt_list:nth-child(2) { padding: 24px 0 20px; }
.tq_send_txt_list:last-child { padding: 20px 0 24px; }

/*클레이페이 소개*/
.klay_lntbox { width: 100%; max-width: 768px; min-height: calc(100vh - 92px); height: 100%; padding:0 0 50px; }
.klay_slider .swiper-wrapper { padding-top:134px; }
.klay_slider { background: linear-gradient(to top, var(--white), #E6F0FE ); height:518px; padding-top:70px; }
.klay_slider .klay_img { position:relative; width:250px; height:250px; border-radius: 100%; background: var(--white); margin:0 auto; overflow: hidden; }
.klay_slider .klay_img img { position:absolute; top:0; left:0; width:100%; height:100%; object-fit: cover; }
.klay_slider .swiper-pagination { bottom:30px !important; }
.klay_lntrobox { padding:42px 20px 0; text-align: center; }
.klay_lntrtitle { font-size:2.2rem; font-weight:700; }
.klay_lntrstitle { font-size:1.6rem; font-weight: 400; padding:20px 0 14px; }
.pass_klay { font-size:1.4rem; font-weight: 500; color:var(--dark); cursor:pointer; }
.klay_choice { padding:14px 20px 46px; }
.next_klay { background-color: #E6F0FE; border-radius: 16px; font-size:1.4rem; font-weight: 500; padding:6px 14px; }
.next_klay a { color:var(--main); }
.klay04_introtitle { font-size:1.4rem; font-weight: 500; color:var(--dark); }
.klay04_lntrtitle { font-size:3.8rem; color:var(--main); font-weight: 500; }
.klay04_lntrstitle { color:var(--black); font-weight: 400; font-size:1.6rem; margin-top:24px; }



/*mylist*/
.mylist_wrap { padding:30px 20px; background:var(--bg); }
.mylist_title { font-size:1.6rem; font-weight: 400; }
.mylist_title span { color:var(--main); font-size:2.2rem; font-weight: 500; }
.mypage_go { display: flex; align-items: center; font-size:1.4rem; font-weight: 500; background:var(--white); border-radius: 15px; padding:6px 10px; cursor:pointer; }
.mypage_go img { display: block; margin-right:2px; }
.mylist_klay { background:var(--white); border-radius: 10px; padding:20px 26px; margin:30px 0 20px; }
.mylist_imgbox { background-color: var(--lightgray); border-radius: 12px; border:1px solid var(--line); padding:4px; width:48px; height:48px; text-align: center; margin:0 auto; }
/* .mylist_imgbox img { height:100%; } */
.mylist_imgbox img { max-width:100%; height:100%; }
.mylist_klay p { font-size:1.4rem; font-weight: 500; text-align: center; margin-top:12px; }
.mylist_klay li { cursor: pointer; }

/* mylist 배너 이미지 슬라이드 */
.event_slider { height:110px; }
.event_slider .swiper-pagination-fraction { top:10px; right:10px; left:unset; bottom:unset; font-weight: 500; width:50px; z-index:100; background-color: rgba(0,0,0,0.7); color:var(--white); padding: 4px 10px; border-radius: 20px; }
.banner_img { position: relative; border-radius: 10px; overflow: hidden; }
/* .event_slider .banner_img { background:#E6F0FE; }
.event_slider .banner_img2 { background:purple; }
.event_slider .banner_img3 { background:green; }
.event_slider .banner_img4 { background:violet; } */
.banner_img img { position: absolute; height:100%; width:100%; top:0; left:0; object-fit: cover; }
.evnet_all { font-size:1.4rem; font-weight: 500; margin-top:14px; text-align: right; }
.evnet_all a span { color:var(--main); }
.evnet_all a img { display:inline-block; position: relative; top:3px; }
.event_null { background:var(--white); border-radius: 10px; margin: 14px 20px; box-shadow: 0 3px 15px rgb(0 0 0 / 6%); padding:50px 0; }
.event_null li { align-items: center; font-weight: 500; text-align: center; font-size: 1.4rem; }
/* //배너 이미지 슬라이드 */

/* mypage */
.list_box { padding: 10px 0 5px; background:var(--white); }
.list_box.border_none { border:none; }
.box_title { font-size:1.4rem; font-weight: 500; color:var(--main); padding: 5px 20px; }
.box_goto { font-size:1.6rem; font-weight: 500; }
.box_goto a { padding:10px 20px; }
.box_goto:hover { background:var(--line); }
.box_goto .wait { color: var(--red); }
.box_goto .comp { color: var(--main); }
.version_txt { font-size:1.4rem; font-family: "montserrat"; font-weight: 500; color:var(--dark); text-align: center; }
.mylist_p { padding-bottom:110px; }
.mylist_body::-webkit-scrollbar { display: none; }
.mylist_body { -ms-overflow-style: none; scrollbar-width: none; }

/* 내정보 수정 */
/* .mypage_wrap { margin-top:90px; padding:0 20px; } */
.user_profile { border-bottom:1px solid var(--line); padding:10px 0 10px; }
.user_type { min-width:84px; margin-right:30px; }
.myuser_info { padding: 0 20px; }
/* 05.13 space-between 추가 : NBR */
.myuser_box { margin-top:10px; font-weight: 500; font-size:1.6rem; word-break: break-all; display: flex; width:100%; justify-content: space-between; word-break: keep-all; }
.myuser_box > p:last-child { text-align:right; }
/* .myuser_box > p:last-child { text-align: right; } */
.change_phonenumber { background:var(--inactive); border-radius: 10px; padding:10px; font-size:1.4rem; cursor:pointer; width:max-content; }
.copy_address { display:flex; justify-content: center; align-items: center; font-family: "noto_sans"; font-weight: 500; font-size:1.4rem; background-color: var(--inactive); padding:8px 64px; border-radius: 10px; margin-top:10px; }
.copy_address.active { background-color: var(--main); color:var(--white); }
.change_phonemypage { display: flex; align-items: center; font-weight: 500; }
.change_phonemypage:nth-child(2) { display: flex; align-items: center; font-weight: 500; text-align:right; word-break: break-all; }
.user_kind { display:flex; word-break: break-all; font-weight: 500; text-align:right; }
.user_kind img { margin-left:6px; cursor:pointer; }
 /*
 .user_kind::after { position: absolute; right: 0; top: 2px; content: ''; width: 20px; height: 20px; background: url(../img/icon/icon_copy_g.svg); background-repeat: no-repeat; background-size: cover; cursor:pointer; } */



 /*ON, OFF (생체인증, 마케팅 알림) */

 .on-off-toggle { position: relative; display: inline-block; width: 68px; height: 28px; }
 .on-off-toggle__slider { cursor:pointer; display: block; width: 68px; height: 28px; border-radius: 34px; background-color: var(--inactive); transition: background-color 500ms; }
 /*동그라미 원*/
 .on-off-toggle__slider:before { position: absolute; content: ''; display: block; background-color: #fff; bottom: 2px; height: 24px; left: 2px; transition: .4s; width: 24px; z-index: 5; border-radius: 100%; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.06); }
 .on-off-toggle__slider:after { display: block; line-height: 28px; text-transform: uppercase; font-size: 1.4rem; font-weight:700; content: 'off'; color: var(--gray); padding-left: 32px; transition: all 500ms; }
 .on-off-toggle__input { position: absolute; opacity: 0; }
 .on-off-toggle__input:checked + .on-off-toggle__slider { background-color: var(--main); }
 .on-off-toggle__input:checked + .on-off-toggle__slider:before { transform: translateX(40px); }
 .on-off-toggle__input:checked + .on-off-toggle__slider:after { content: 'on'; color: #FFFFFF; padding-left: 10px; }

/* 지갑으로 송금하기 */
.send_box { padding-top:60px; }
.sendwallet_box { background-color: var(--lightgray); padding:20px; }
.swrap_btn { width:100%; max-width:768px; height:100%; margin:60px auto 8px; }
.baltab_wrap .balance_active { border-bottom:2px solid var(--main); color:var(--main); }
.baltab_wrap { display: flex; align-items: center; text-align: center; height:30px; cursor:pointer; color:var(--dark); }
.won_txt { font-size:1.8rem; font-weight: 500; border-bottom:2px solid var(--line); min-width: 80px; height:100%; }
.kp_txt { font-family: "montserrat"; font-weight:700; font-size:1.8rem; min-width: 80px; border-bottom:1px solid var(--line); height:100%; }
/* 05.13 간격 수정요청 관련 CSS 수정 : NBR */
.sync_txt { font-size:1.4rem; font-weight: 500; color:var(--main); margin-right:4px; }
.sync_box { cursor:pointer; }
.sync_box img { display: block; }
.current_amount { text-align: center; padding:30px 0 20px; }
.current_amount span:nth-child(1) { font-family: "montserrat"; font-size:2.6rem; font-weight: 700; }
.current_amount span:nth-child(2) { font-family: "montserrat"; font-weight:700; font-size:1.8rem; color:var(--main); }
.current_amount_sisa { text-align: center; }
.current_amount_sisa span { color:var(--dark); word-break: break-all; }
.qr_header_box { height:60px; display: flex; align-items: center; justify-content: space-between; padding:0 20px; }
.qr_header_box p { color:var(--white); font-size: 1.8rem; font-weight: 700; }

/* 05.13 간격 수정요청 관련 CSS 수정 : NBR */
.current_amount_sisa span:nth-child(1) { font-size:1.4rem; font-weight: 500; margin-right:10px; display: inline-block; }
.current_amount_sisa span:nth-child(2) { font-size:1.2rem; font-weight: 400; }
.withdraw_box, .sendwallet_infomation { padding:20px 20px 0; }
.withdraw_box label, .sendwallet_infomation label { font-size:1.6rem; margin-bottom:10px; display: block; font-weight: 700; }
.withdraw_atm label { font-size:1.6rem; margin-bottom:10px; display: block; font-weight: 700; }
.sendwallet_infomatio input::placeholder { background: var(--lightgray); }
.sender_amount { position: relative; }
.sender_amount .input_basic { margin-top:0; }
.sender_amount input::placeholder { font-size: 1.4rem; font-weight:500; text-align: left; }
.position_txt { position:absolute; top:50%; right:20px; transform: translateY(-50%); font-size:1.6rem; font-family: "montserrat"; font-weight:700; color:var(--main); }
.position_txt_main { color:var(--main); }
.fees_txt { font-size:1.4rem; font-weight: 500; color:var(--dark); }
.fees_amount { font-size:1.2rem; font-weight: 400; color:var(--dark); }
.waring_amount { font-size:1.2rem; color:#FF0000; margin-top:10px; font-weight: 400; }
.send_qrbtn { width:24px; background:url("../../assets/img/icon/icon_loadQR.svg"); background-repeat: no-repeat; background-position: center; background-color:var(--main); height:86px; border-radius: 10px; min-width:64px; }
.wallet_addrbox { width:90%; margin-right:10px; }
.wallet_addrbox textarea { padding:14px 20px; width:100%; height:84px; border-radius: 10px; background:var(--lightgray); border:1px solid var(--gray); font-size:1.6rem; font-family: "montserrat"; font-weight: 500; border-radius: 10px; resize:none; outline: none; }
.wallet_addrbox textarea::placeholder { color:var(--gray); }
.addr_txt { font-size:1.6rem; font-weight: 500; margin:22px 0 10px; }
.check_sender { margin-top:82px; padding:0 20px; }
.send_notice { display:flex; }
.send_notice div:nth-child(1) { position: relative; top:3px; margin-right:6px; }
.check_re { font-size:1.4rem; font-weight: 400; color:var(--main); }
.fees_check { font-size:1.2rem; font-weight: 400; color:var(--dark); margin-top:12px; margin-bottom:30px; }
.atm_info_txt { padding:0 20px; display: flex; align-items: center; cursor: pointer; margin-bottom: 10px; font-weight: 500; color:var(--blue); font-size: 1.4rem; text-decoration: underline; }
/*이벤트*/
.event_box { padding-top:85px; }
.event_tab { display:flex; justify-content: space-between; align-items: center; text-align: center; }
.event_tab li { font-size:1.6rem; font-weight: 500; color:var(--dark); width:50%; padding-bottom:14px; border-bottom:1px solid var(--line); cursor:pointer; }
.event_tab li.event_active { border-bottom:2px solid var(--main); color:var(--main); }

/* 05.13 box shadow 추가 : NBR */
.event_imgbox { width:100%; height:110px; overflow: hidden; border-radius: 10px; box-shadow: 0px 3px 15px rgb(0 0 0 / 0.06%); position: relative; }
.event_imgbox img { width:100%; height:100%; position: absolute; top:0; left:0; object-fit: cover; }
.event_title { font-size:1.6rem; font-weight: 500; margin:20px 0 14px; }
.event_state { border-bottom:1px solid var(--line); padding:20px 0; }
.event_listbox .p_none { padding-top:0; }
.event_viewbox { padding-top:60px; height:100vh; }
.event_date { font-size:1.2rem; font-weight:400; color:var(--dark); text-align: right; }
.end_txt { position: absolute; width:100%; height:100%; background:rgba(0,0,0,0.6); color:var(--white); box-shadow:0px 3px 15px; }
.end_txt p { display: flex; align-items: center; justify-content: center; width:100%; height:100%; font-size:1.4rem; font-weight:700; }
.event_listtitle { border-bottom:1px solid var(--line); padding:32px 20px; font-size:1.8rem; font-weight:700; }
.eventdate_box { padding:30px 0; display:flex; justify-content: center; align-items: center; }
.date_choiice { background-color: var(--main); padding:4px 10px; color:var(--white); border-radius:10px; font-size:1.0rem; font-weight:700; margin-right:10px; }
.date_year { font-size:1.4rem; font-weight: 500; color:var(--main); white-space: nowrap; }
.eventlist_img { width:100%; text-align: center; }
.eventlist_img img, .event_view img { width:100%; max-width:50%; margin:0 auto; }
.eventlist_stxt { padding:28px 0; font-size:1.4rem; font-weight: 400; }
.more_btn { margin:30px 20px 0; padding-bottom:44px; }
.event_view img { padding:28px 0; }
.event_view { font-size:1.4rem; font-weight: 400; }
/*220615 신규이벤트 추가 : SJW */

/*결제방법 안내 */
.guide_txt { font-size:1.8rem; font-weight: 700; color:var(--main); }
.guide_state { border-bottom:1px solid var(--line); padding:30px 20px; }
.guide_img { width:90px; height:90px; margin-right:20px; border-radius: 10px; overflow: hidden; float:left; }
.guide_imgtxt { padding-top:20px; }
.guide_imgtxt::after { clear:both; content:''; display: block; }
.guide_img img { width:100%; height:100%; }
.guide_view p:nth-child(1) { font-size:1.6rem; font-weight: 500; color:var(--black); }
.guide_view p:nth-child(2) { font-size:1.4rem; font-weight: 400; color:var(--dark); margin-top:8px; }

/* 사용내역 */
/* .date_check_stick { position:sticky; position: -webkit-sticky; top:60px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:20px; background:var(--white); } */
/* 230317 수정 */
.date_check_stick { position:sticky; position: -webkit-sticky; top:50px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:20px; background:var(--white); }
.date_check_borderb { position:sticky; position: -webkit-sticky; top:60px; border-bottom:1px solid var(--line); padding:20px; background:var(--white); }
.usage_historybox { padding-top:60px; }


/* 230421 tq 내역(tq_history) 수정 : KMS */
.tq_history_top > p { text-align: right; color: #89949C; }
.tq_history_logo { display: block; width: 30px; height: 30px; border-radius: 50%; background-color: #d9d9d9; }
.tq_history_logo img { width: 100%; height: 100%; }
.tq_history_amount { padding: 20px 20px 30px; background-color: var(--lightgray); }

.tq_history_date_check { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding: 14px 20px; background:var(--white); }
.tq_history_date_check .select_box { flex: none; width: 125px; height: 36px; padding: 0 8px; background-color: var(--lightgray); border: 1px solid #BEC8CF }
.tq_history_month_choice .dset { position: relative; }
.tq_history_month_choice .dset input { width: 116px; text-align: left; border: none; background-color: #EFF3F5; }
.tq_history_month_choice .dset img { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); }
.tq_history_content .date_listtime { font-weight: 600; font-family: "montserrat"; color: var(--black); margin: 0; padding: 8px 20px 8px; border: none; background: var(--lightgray); }
/* .tq_history_list_box { border-bottom:1px solid var(--line); } */
/* .tq_history_list_box li:last-child { border-bottom:none; } */
.tq_history_content .tq_history_list_box .date_list_txt { padding: 0; }
/* 230518 tq 내역(tq_history) 수정 : KMS */
.tq_his_list { padding: 12px 10px 12px 20px; }
.tq_his_list_none { padding: 12px 20px; }

.tq_history_box .gift_date_check { padding: 0; border: none; }
.tq_history_box .gift_date_check_box { height: auto; }

.tq_history_content .notice_null img { margin: 0 auto 22px; }
.notice_null img { margin: 0 auto 22px; }

/* .tq_history_content .history_ractive { color: var(--black); } */
.tq_history_content .date_timemore { font-weight: 400; flex:none; }
.transaction_history_icon { flex: none; margin-right: 14px; display: block; width: 40px; height: 40px; border-radius: 50%; background-color: #ddd; }
.transaction_history_icon img { width:100%; height:100% }

/* 23.04.24 NBR TQ_HISTORY_DETAIL */
.tq_history_title { display:flex; justify-content: space-between; align-items: center; }

/* 아이콘 아직 못받은 상태라 숨김처리함 */
/* .tq_history_logo, .transaction_history_icon { display: none; } */

/* 230424 에스크로 내역(tq_escrow_history) 수정 : KMS */
.tq_history_date_check .date_check { justify-content: flex-start; gap: 18px; }

.tq_history_input_box { position: relative; max-width: 200px; }
.tq_history_input_box input { width: 100%; border-radius: 10px; height: 36px; padding: 0 35px 0 20px; background-color: var(--lightgray); border: 1px solid var(--gray); }
.tq_history_input_box input::placeholder { color: var(--gray); }
.tq_history_input_box button { position: absolute; right: 10px; top: 6px; background-color: rgba(0,0,0,0); }
.tq_history_input_box button img { width:100%; height:100%; }

.tq_escrow_info_btn { cursor: pointer; margin-top: 3px; margin-left: 5px; position: relative; }
.tq_escrow_info_desc { display: none; z-index: 10; left: 0; top: 30px; position: absolute; border-radius: 10px; width: 260px; background-color: var(--black); color: var(--white); padding: 14px; font-size: 14px; }

@media screen and (max-width: 370px){
 .tq_history_date_check .date_check { flex-direction: column; align-items: flex-start; gap:10px; }
 .tq_history_input_box { width: 100%; max-width: 100%; }
 .tq_history_box .gift_date_check { align-items: center; gap: 10px; }
 .tq_history_box .gift_date_check div:last-child { align-self: flex-end; }
 }




.cancel_active::before { content:''; width:2px; height:10px; margin:0 10px; background:var(--line); display: inline-block; }
.date_check { display:flex; justify-content: space-between; align-items: center; }

/*송금 및 입금관련 checkbox 버튼 디자인 화 */
.depoawith_state input[type="checkbox"] { display: none; }
.depoawith_state input[type=checkbox]:checked + span { background: var(--white); color:var(--gray); border:1px solid var(--gray); }
.depoawith_state li label span { color:var(--main); border:1px solid var(--main); background: var(--white); border-radius: 20px; padding:6px 14px; text-align: center; word-break: break-all; font-weight: 500; cursor: pointer; }

/* 05.13 select box custom : NBR */
.date_check .applicant_select_box { width:110px; margin-bottom:0; position:relative; font-size: 1.4rem; background-color: var(--lightgray); cursor: pointer; border-radius: 10px; color:var(--gray); font-weight: 500; }
.date_check .applicant_select.hours_time { display:flex; justify-content: space-between; width:100%; min-width:110px; padding: 8px 15px; }
.date_check .applicant_select_box span { color:var(--black); }
.date_check .scroll_list { top:48px; padding: 20px; left: 0; box-shadow:0px 3px 15px rgb(0 0 0 / 6%); width: 110px; }
.date_check .applicant_select_box ul li { padding-bottom:20px; font-size:1.4rem; font-weight:500; }
.date_check .applicant_select_box ul li:last-child { padding-bottom:0; }

.month_choice input[type="radio"] { position: relative; top:-1px; -webkit-appearance:none; width:18px; height:18px; border:1px solid var(--gray); border-radius:50%; flex:none; }
.month_choice input[type="radio"]:checked { -webkit-appearance:none; border:1px solid var(--main); border-radius:50%; }
.month_choice input[type="radio"]:checked ~ span { color:var(--black); }
/* .month_choice input[type="radio"]:checked ~ label { color:var(--black); } */
.month_choice input[type='radio']:before { content:''; display:block; width:50%; height:50%; margin:25% auto; border-radius:50%; }
.month_choice input[type='radio']:checked:before { background:var(--main); }
.month_choice label { color:var(--dark); display: flex; align-items: center; cursor:pointer; }
.now_state p { font-size:1.4rem; font-weight: 500; cursor:pointer; margin-right:8px; }
.now_state { cursor:pointer; }
.date_listtime { padding:30px 0 20px; font-size:1.6rem; font-weight: 700; color:var(--dark); border-bottom:1px solid var(--line); margin:0 20px; }
.transaction_history_list { border-bottom:1px solid var(--line); padding:0 20px; }
.transaction_history_list li { border-bottom:1px solid var(--line); }
.transaction_history_list li:last-child { border-bottom:none; }
.date_list_txt { padding:20px 0; }
.date_listmore { font-size:1.6rem; color:var(--black); font-weight:500; }
.date_listmore p:nth-child(1) { flex:none; }


.date_plusamount { color:var(--main); font-weight: 700; font-family: "montserrat"; }
.date_default { color:var(--black); font-weight: 700; font-family: "montserrat"; }
.date_timemore { font-size:1.4rem; font-weight: 500; color:var(--dark); }
.date_minusamount { color:#FF0000; font-weight: 700; font-family: "montserrat"; }
.history_more { padding:30px 20px; }


/*사용내역에서 직접설정 팝업*/
.transaction { position: sticky; top:0; left:0; z-index:300; width: 100%; height: 100%; }
.transaction_choicetitle { font-size:1.4rem; font-weight: 500; text-align: center; margin-bottom:20px; font-family: "noto_sans"; }
.transaction_choice_wrap { position: fixed; left: 50%; bottom: 0; border-radius: 10px 10px 0 0; transform: translateX(-50%); width: 100%; max-width: 768px; z-index: 9920; background-color: var(--white); padding:30px 20px; }
.transaction_choice_box { display: flex; justify-content: space-between; align-items: center; }
.transaction_choice_box .transaction_date { width:48%; font-family: "noto_sans"; }

/* 05.13 select box custom : NBR */
.transaction .applicant_select_box { margin-bottom:30px; position: unset; }
.transaction .applicant_select { width:100%; height: auto; font-size:1.6rem; padding:13px 0; background-color:var(--lightgray); color:var(--black); text-align: center; align-items: unset; display:block; height:auto; border:1px solid var(--gray); border-radius:10px; font-weight:500; }
.transaction .applicant_select_box ul li { color:var(--gray); font-weight:500; padding-bottom:24px; }
.transaction .scroll_list { position: unset; display: block; margin-top:10px; padding:30px 28px; text-align: center; height:176px; overflow-y: scroll; box-shadow:0px 3px 15px rgb(0 0 0 / 6%); }

/* 상세내역 */
.history_viewbox { padding:0 20px; background: #fff; height:auto; }
.history_wrap { padding:60px 0 20px; background: var(--white); }
.history_viewwrap { padding:40px 0; border-bottom:1px solid var(--line); }
.history_viewtitle { font-size:2rem; font-weight: 700; }
.history_mactive { color:var(--main); }
.history_ractive { color:#FF0000; }
.history_viewstate { min-width:30px; margin-left:20px; }
.history_viewamount { font-size:1.8rem; font-weight: 700; margin-top:10px; }
.shistory_viewamount { font-size:1.4rem; font-weight: 500; color:var(--dark); margin-top:14px; }
.shistory_viewamount span { font-size:1.2rem; font-weight: 400; padding-left:10px; }
.trading_day { padding:20px 0; }
.trading_dayview { font-size:1.4rem; font-weight: 500; display: flex; justify-content: space-between; }
.trading_dayviewx { font-size:1.4rem; font-weight: 500; display: flex; justify-content: space-between; }
.trading_dayviewx p:nth-child(1) { color:var(--dark); flex:none; }
/* .trading_dayviewx p:nth-child(1) { color:var(--dark); } */
.trading_dayview p:nth-child(1) { color:var(--dark); }
.trad_txt { min-width:56px; margin-right:10px; }
.tx_hashaddr { word-break:break-all; cursor:pointer; color:var(--main); text-decoration: underline; width:100px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }


/* 05.13 text 정렬 및 icon size 변경 관련 CSS 수정: NBR */
.trad_img { position: relative; padding-right:30px; cursor:pointer; word-break: break-all; text-align: left; }
.trad_img::after { position: absolute; right:0; top:2px; content:''; width:20px; height:20px; background: url("../img/icon/icon_copy_g.svg"); background-repeat: no-repeat; background-size:cover; }
.franchisee_info { background-color: var(--lightgray); border-radius: 10px; padding:20px; margin-top:10px; }
.franchisee_info_txt { font-size:1.6rem; font-weight: 500; border-bottom:1px solid var(--line); padding-bottom:20px; }
.franchisee_box { display: flex; justify-content: space-between; align-items: center; font-size:1.4rem; }
.franchisee_box p:nth-child(1) { font-weight: 500; max-width:60px; }
.franchisee_box p:nth-child(2) { max-width:210px; word-break: keep-all; text-align: right; }
/* 23.04.24 TQ상세내역 변경:NBR */
.tq_history_paylist { font-size: 1.6rem; font-weight: 500; display: flex; justify-content: space-between; }

/* 05.13 상단 정렬 관련 CSS 추가 : NBR */
.franchisee_box:nth-child(2) { align-items: flex-start; }

/*주소복사 디자인 */
.addr_completbox { opacity: 1; position:fixed; bottom:30px; left:0; right:0; margin:auto; width:calc(100% - 40px); max-width:728px; height: 50px; background-color:#E6F0FE; border-radius: 10px; padding:16px 0 16px 54px; color:var(--main); margin:0 auto; font-size:1.4rem; font-weight: 500; transition: opacity 300ms ease-in-out; font-family: "noto_sans"; }
.addr_completbox.inactive { opacity: 0; transition: opacity 300ms ease-in-out; }
.addr_completbox::before { display:inline-block; content:''; position: absolute; left:28px; top:42%; width:24px; height:24px; background: url("../img/icon/icon_check_on.svg"); background-repeat: no-repeat; }

/* 가맹점 결제내역 */
.baltab_wrap .frn_active { border-bottom: 2px solid var(--fran); color: var(--fran); }
.fansync_txt { font-size: 1.4rem; font-weight: 500; color: var(--fran); margin-right: 4px; }
.fpayment_kp .current_amount span:nth-child(2), .fpayment_won .current_amount span:nth-child(2) { font-family: "montserrat"; font-weight: 700; font-size: 1.8rem; color: var(--fran); }
/* .franchice_month_choice { border-bottom:1px solid var(--line); padding:20px; } */
.franchice_month_choice input[type="radio"] { position: relative; top:-1px; -webkit-appearance:none; width:18px; height:18px; border:1px solid var(--gray); border-radius:50%; flex:none; }
.franchice_month_choice input[type="radio"]:checked { -webkit-appearance:none; border:1px solid var(--fran); border-radius:50%; }
.franchice_month_choice input[type="radio"]:checked ~ span { color:var(--black); }
.franchice_month_choice input[type='radio']:before { content:''; display:block; width:50%; height:50%; margin:25% auto; border-radius:50%; }
.franchice_month_choice input[type='radio']:checked:before { background:var(--fran); }
.franchice_month_choice label { color:var(--dark); display: flex; align-items: center; cursor:pointer; }
.fran_plusamount { color:var(--fran); font-weight:700; font-family: "montserrat"; }
.cancel_payment { text-align: right; margin-top:10px; }
.cancel_payment button { background-color:#EBEDFF; color:var(--fran); padding:6px 12px; border-radius:15px; font-family: "noto_sans"; font-size:1.4rem; font-weight: 500; }
.fran_middle_line { text-decoration: line-through; color:var(--dark) }
.comple_pay_txt { font-size:1.6rem; font-weight: 500; color:var(--dark); }

.pay_historyf { padding:60px 0 110px; background: var(--white); }

.middle_line { text-decoration: line-through; }

/* 23.07.17 */
.pay_card { padding-bottom: 26px !important; }
.pay_card .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom: 0px !important; }

/* 가맹점 결제내역 팝업 */
.fran_cancelp { position: fixed; top:0; left:0; width: 100%; height: 100%; z-index: 10000; background-color: rgba(0,0,0,0.5); font-family: "noto_sans"; }
.fran_cancelp .pop_cont { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); min-width:300px; max-width:300px; max-height:330px; background-color: #fff; border-radius: 10px; z-index: 9920; overflow: hidden; box-shadow: 0px 10px 50px rgba(0,0,0,0.4); }
.fran_cancelp .pop_title { font-size:1.8rem; font-weight:700; text-align: center; padding:40px 20px 0; }
.fran_cancelp .popup_txt { font-size:1.4rem; text-align: center; font-weight: 400; padding:30px 20px 40px; line-height: 22px; }
.pop_btn span { display: block; width: 48%; padding: 10px 0; font-weight: 500; text-align: center; color: #fff; font-size: 1.6rem; border-radius: 26px; cursor: pointer; }
.cancel_btn { background:var(--inactive); height:50px; width:50%; font-size:1.6rem; font-weight: 500; font-family: "noto_sans"; }
.cancel_yes { background:var(--fran); height:50px; width:50%; font-size:1.6rem; font-weight: 500; color:var(--white); }
.fran_paybtn { width:100%; max-width:768px; min-height:calc(100vh - 230px); height:100%; margin:60px auto 110px; }
.pay_complet { color:var(--fran); }
.fran_btn { width:100%; max-width:768px; min-height:calc(100vh - 230px); height:100%; margin:70px auto 40px; }
.payment_cancel { width:100%; max-width:768px; padding:0 20px; }
.gray_act { color:var(--dark); }
.fran_paybtn .franchice_month_choice { padding:20px 0 0; }


/* 가맹점 결제금액 */
.payamount_confirmwrap { margin:60px 0 70px; }
.payamount_confirm { padding: 30px 20px 20px; }
.payamount_confirm li:nth-child(1) { text-align: center; font-size:1.8rem; font-weight: 700; }
.payamount_confirm li:nth-child(3) { text-align: center; }
.fran_linebar { border:1px solid var(--line); margin:10px 0; }
.confirm_amount { font-size:2rem; font-family: "montserrat"; font-weight: 700; word-break: break-all; }
.confirm_dan { font-size:1.8rem; font-weight: 700; color:var(--fran); }
.change_fbtn { width:72px; display: flex; align-items: center; background-color: #E8EDFF; border-radius: 15px; padding:4px 18px; }
.change_fbtn span:nth-child(2) { font-size:1.6rem; font-weight: 500; font-family: "noto_sans"; padding-left:6px; color:var(--fran); }
.prediction_amount { font-size:1.4rem; font-weight: 400; color:var(--dark); word-break: break-all; }
.confirm_qrscan { width:100%; background: #000; position: fixed; height:calc(100% - 204px); max-width:768px; margin:0 auto; }
.confirm_qrscan_ab { position: absolute; top: 45%; left: 50%; transform: translate(-50%, -50%); width:100%; }


/* .confirm_qrscan { height:485px; background-color:var(--black); } */
.scan_box { width:250px; height:250px; background-color:var(--white); margin:5px auto; overflow: hidden; }
.qr_headertitle { text-align: center; color:var(--white); font-size:1.6rem; font-weight: 400; padding:0 0 30px; }
.filming_info { color:var(--white); font-size:1.4rem; font-weight: 400; padding-top:46px; text-align: center; }

/*지급정산*/
.my_psamount { cursor:pointer; position: relative; font-size:1.6rem; font-weight: 600; text-align: right; }
.usage_won { position: relative; font-size:1.6rem; font-weight: 600; text-align: right; }
/* .my_psamount:after { background-position: center; background-image: url("../../assets/img/icon/icon_arrow_down.svg"); background-repeat: no-repeat; display: inline-block; width: 16px; height: 16px; content:""; position:absolute; top:50%; transform: translateY(-50%); right:0; } */
.my_psamount.active:after { background-image: url("../../assets/img/icon/icon_arrow_up.svg"); content:""; }
.accumulate { margin-bottom:10px; }
.accumulate_n { margin-bottom:0; }
.accumulate div:nth-child(1) { font-size:1.4rem; font-weight: 500; }
.other_amount { text-align: right; color:#7E7E7E; font-size:1.4rem; font-weight: 500; font-family: "noto_sans"; margin:8px 0 18px; padding-right:20px; }
.other_amount span { font-family: "montserrat"; font-weight: 500; }
.request_btn { background: #EFF3F5; }

/*가맹점 지급/정산*/
.payment_settlementwrap { padding:60px 0 110px; background: var(--white); }
.my_paymentamount { padding:20px; background:var(--lightgray); }
.alert_btn { position: relative; }
.alert_btn > p:first-child { width:70px; }
.alert_btn_img { margin-left:4px; }
.accumulate_info { background-color: var(--white); position: absolute; border:1px solid var(--fran); color:var(--fran); padding:10px; width:350px; font-size:1.2rem; font-weight: 500; left:0; top:25px; z-index: -1; opacity: 0; transition: opacity 300ms linear, z-index 300ms linear; }
.accumulate_info.active { opacity:1; transition: opacity 300ms linear, z-index 300ms linear; }
.accumulate_50.active { z-index:50; }
.accumulate_40.active { z-index:40; }
.accumulate_30.active { z-index:30; }
/* .settle_tab { color:var(--dark); font-size:1.6rem; font-weight: 500; border-bottom:1px solid var(--line); width:50%; text-align: center; padding:24px 0 14px; cursor:pointer; } */
.settle_active { color:var(--fran); border-bottom:2px solid var(--fran); }
.payment_settlementwrap .user_amount { position: relative; width: 100%; height: 50px; margin-top: 10px; border-radius: 10px; background-color: var(--lightgray); border: 1px solid var(--gray); font-size: 1.6rem; font-weight: 600; }
.payment_settlementwrap .user_amount .input_basic { margin-top:0; border:unset; background-color: unset; }
.payment_settlementwrap .user_amount input::placeholder { font-size: 1.6rem; font-weight:500; }
.payment_settlementwrap .position_txt { position:absolute; top:50%; right:20px; transform: translateY(-50%); font-size:1.6rem; font-family: "montserrat"; font-weight:700; color:var(--fran); }
.request_wrap .choice_num { width:96%; }
.request_wrap .choice_num input { font-size:1.6rem; font-weight: 500; font-family: "noto_sans"; }
.request_wrap .choice_num input::placeholder { font-size:1.6rem; font-weight: 500; font-family: "noto_sans"; }
.choice_act { font-size:1.6rem; font-weight: 500; color:var(--black); }
.request_amount { font-size:1.6rem; font-weight: 500; margin-top:22px; }
.deposit_account .applicant_select_box { position: relative; }
.deposit_account .applicant_select { display: flex; justify-content: space-between; align-items: center; width: 100%; height:50px; font-size: 1.6rem; background-color: var(--lightgray); border:1px solid var(--gray); cursor: pointer; border-radius: 10px; color:var(--gray); padding:14px 20px; font-weight: 400; }
.deposit_account .select_title { font-size:1.6rem; font-weight: 500; margin-top:22px; }
.deposit_account .applicant_select span { font-weight: 500; }
.depositor_info { display:flex; margin-top:10px; color:var(--fran); font-size:1.4rem; font-weight: 400; }
/* .name_depositor */
.f_error { color:#FF0000; margin-top:10px; font-size:1.2rem; font-weight: 400; display: inline-block; }
.f_complet { color:var(--dark); margin-top:10px; font-size:1.2rem; font-weight: 400; display: inline-block; }
.paymentrequest_btn { margin-top:40px; }
.request_btn { font-size:1.6rem; font-weight:700; font-family: "noto_sans"; text-align: center; background-color: #EFF3F5; color:var(--gray); width:100%; height:50px; border-radius: 10px; }
.settlement_tab .date_listtime { margin:0; }


/* .paymentrequest_btn button */

.bank_listwrap { position: fixed; top:0; left:0; width: 100%; height: 100%; z-index: 210; background-color: rgba(0,0,0, 0.7); }
.bank_cont { position: fixed; left:0; margin:auto; right:0; bottom:0; border-radius: 10px 10px 0 0; width:100%; max-width:768px; z-index: 9920; background-color:var(--white); box-shadow: 0 3px 15px rgba(0, 0, 0, 0.06); }
.bank_title { font-size:1.8rem; font-weight:700; text-align: center; margin-top:32px; margin-bottom:30px; font-family: "noto_sans"; }
.bank_infobox { padding:0 30px; max-height:500px; overflow-y: scroll; }
.bank_img img { width:24px; height:24px; display: inline-block; max-width:100%; }
.bank_name { font-size:1.4rem; font-weight: 400; font-family: "noto_sans"; margin-left:10px; }
.bank_box { margin-bottom:20px; text-align: center; width:24%; display: flex; align-items: center; }
.bank_info { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; font-family: "noto_sans"; }
.bank_info button { outline: none; border:none; background:none; }
.request_txt { font-size:1.4rem; font-weight: 400; font-family: "noto_sans"; text-align: center; }
.request_txt span { font-family: "montserrat"; font-weight: 600; }
.settle_radio { border-bottom:1px solid var(--line); padding:20px; }


.box_height { min-height:calc(100vh - 50px); min-height:calc(100svh - 50px); height: auto; background:var(--white); }
.box_height_o { min-height:100vh; min-height:100svh; height: auto; background:var(--white); }
/* .box_height { height:100svh; background:var(--white); } */
.off_box { height:100vh; }

/*220623 SJW 가맹점 신규클래스 추가*/
.fran_histroy_box .keypad_pininput { vertical-align: top; }
.fran_histroy_box .history_viewwrap { padding:100px 0 40px; }
.fran_histroy_box .enter_keypadwrap { background: transparent; min-height:90px; }
.fran_histroy_box .payment_cancel { padding:0; }
.payment_tab .date_listtime { margin:0; }

/* 221004 NBR 가맹점 등록 페이지 추가 ------------------------------------------------------------------ */
/* .viewport_header, .viewport_info, .viewport { height: 100%; } */
.step_icon { padding: 20px 0; text-align: center; }
.step_icon img { display: inline-block; }
.franchising_info { padding : 30px 20px; }
.franchising_info p { margin-bottom: 10px; font-size: 2.2rem; font-weight: 700; line-height: 26px; }
.franchising_info span { font-size: 1.4rem; font-weight: 400; color: var(--sub); }

/* 신청자 정보 내역 */
.applicant_info { padding : 10px 20px 20px; border-bottom: 4px solid var(--line); }
.applicant_info h2 { font-size: 18px; font-weight:500; }
.applicant_info > ul { padding: 0 16px; margin: 10px 0; border: 1px solid var(--fran_inactive); border-radius: 10px; }
.applicant_info > ul > li { display: flex; align-items: center; justify-content: space-between; padding: 15px 0; }
.applicant_info > ul > li:first-child { border-bottom: 1px solid var(--line); }
.applicant_info > ul > li > p { font-size: 1.4rem; font-weight: 400; color: var(--sub); }
.applicant_info > ul > li > span { font-size: 1.4rem; font-weight: 500; }
.applicant_info > p { display: flex; font-size: 12px; font-weight: 400; color: var(--sub); }
.applicant_info > p:nth-child(3) { margin-bottom: 12px; }
.applicant_info > p::before { content: '* '; display: block; width: 8px; height: auto; margin-right: 2px; }
.applicant_title { padding: 30px 20px 20px; margin-bottom: 10.5px; font-size: 18px; font-weight: 500; border-top: 4px solid var(--line); border-bottom: 1px solid var(--line); }
.applicant_sub_title { font-size: 1.6rem; font-weight: 500; }
/* 사업자 등록 번호 영역 / signup_box = 회원가입부분 추가 */
.signup_box, .business_num_box { padding: 10px 20px; }

/* 상호 & 법인명 영역 */
.business_name_box { padding: 10px 20px; }
.business_select_box { position: relative; display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
/* .fran_select_between:first-child { margin-right: 10px; }
.fran_select_between { width: 100%; border:none; padding: 18px 0 8px; border-bottom:1px solid var(--fran_inactive); outline: none; }
.fran_select_between option { color : var(--black); } */
.fran_select_between:first-child { margin-right: 10px; }
.fran_select_between { margin-top:10px; width: 100%; height:50px; border:1px solid var(--gray); border-radius: 10px; padding: 14px 20px 14px 20px; border-bottom:1px solid var(--fran_inactive); outline: none; }
.fran_select_between option { color : var(--black); }
/* 대표자 이름 입력 영역 */
.represent_box { padding: 10px 20px 20px; }
/* 신분증 입력 영역 */
.drag_drop_zone { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; min-width: 100%; height: 213px; border: 1px dashed var(--fran_inactive); border-radius: 10px; overflow: hidden; margin-top: 15px; }
.drag_drop_zone p { font-size: 1.4rem; font-weight: 400; line-height: 33px; color: var(--fran_inactive); }
.drop_upload { display: none; }
.drag_drop_zone > label { position: absolute; top: 0; left: 0; width: 100%; margin-top: 15px; height: 100%; cursor: pointer; }
.represent_box > p { display: flex; align-items: flex-start; font-size: 12px; font-weight: 400; color: var(--sub); margin-top: 10px; }
.represent_box > p::before { content: '* '; display: block; width: 8px; height: auto; margin-right: 2px; line-height: 2; }
.drop_img { width: 100%; height: 100%; object-fit: contain; }
.off { display: none; }
/* 가맹점 명 입력 영역 */
.franchise_name_box { padding: 10px 20px 20px; }
.franchise_num_box, .franchise_adress_box { padding: 10px 20px; }

/* 가맹점 주소 입력 영역 */
.zip_code { width: calc(100% - 115px); }
.address_btn { margin-top:10px; font-family: "noto_sans"; width:100px; height:50px; margin-left:15px; border: 1px solid var(--gray); border-radius: 10px; font-size: 1.4rem; font-weight: 500; background-color: #fff; color: var(--fran_inactive); }

/* input placeholder 설정 */
input::placeholder { color: var(--gray); font-family: "noto_sans"; font-weight: 400; font-size: 1.4rem; }

/* btn 활성화 */
.on_color { border: none; background: var(--main); color:var(--white); }
.address_on_btn { border: none; font-family: "noto_sans"; padding: 5px 10px; border-radius: 15px; font-size: 1.4rem; font-weight: 500; background: var(--main); color: #ffffff; }
/*input label 화살표 제거*/
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
/* scroll custom */
.scroll_box::-webkit-scrollbar { width: 6px; }
.scroll_box::-webkit-scrollbar-track { background-color: #F0F0F0; border-radius: 30px; }
.scroll_box::-webkit-scrollbar-thumb { background-color: #E3E3E3; border-radius: 30px; }
.header_title { width: max-content; position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); }

/* 2022.03.31 매장관리 & index_franchise CSS 수정작업 : NBR */
.holiday_txt b { margin-left:10px; font-size : 12px; font-weight:500; color:red; }
.hours_box > img { position: absolute; right: 0; top: 25%; transition: 500ms ease; }
.header_wrap > p > span { font-size:1.2rem; border-radius: 13px; padding: 6px 10px; font-family: 'noto_sans'; color: #888888; background-color: #F2F2F2; }
.franchise_icon > span { width:57px; height:25px; border-radius:13px; color:var(--main) !important; border:1px solid var(--main); text-align: center; font-size:1.2rem; font-weight:500; background-color: #ffffff !important; }
/*// 2022.03.31 매장관리 & index_franchise CSS 수정작업 : NBR */

.contents_franchise { margin-top: 60px; }
/* .contents_franchise input { font-family: "noto_sans"; font-weight: 400; font-size: 1.4rem; color: #000; } */

/* input 포커싱 > border 색상 변경 : NJH */
/* .input_box { display: block; padding-top: 18px; } */
.input_box { display: block; }
/* .input_box > input { width: 100%; padding-bottom: 10px; border-bottom: 1px solid var(--fran_inactive); transition: border-bottom 300ms ease; font-size: 1.4rem; } */
.input_box > input { width: 100%; height:50px; margin-top:10px; padding:14px 20px 14px 20px; border-radius:10px; border:1px solid var(--gray); font-size: 1.6rem; font-weight: 600; }
.input_box > input:focus { border: 1px solid var(--main); }
.business_num { width: calc(100% - 97px); }
/* .input_btn { width: 87px; height: 30px; border: 1px solid var(--fran_inactive); border-radius: 15px; background-color: #fff; font-size: 1.4rem; font-weight: 500; color: var(--fran_inactive); transition: background-color 300ms ease; } */
.input_btn { margin-top:10px; width: 87px; height: 50px; border: 1px solid var(--gray); border-radius: 10px; background-color: #fff; font-size: 1.4rem; font-weight: 500; color: var(--fran_inactive); transition: background-color 300ms ease; }
.input_btn.on_color { background-color: var(--main); border-color: var(--main); color: #fff; }
.btn_box { padding: 20px; }
.btn_box > p { text-align: center; font-size:1.2rem; font-weight:400; padding-bottom:10px; color:red; }
.franchise_name_box small, .business_num_box small { font-size:1.2rem; font-weight:500; }
.input_box small { font-size:1.2rem; font-weight:500; }
/* 팝업창 */
.dark_bg { position: fixed; left:0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0, 0.6); z-index: -1; opacity: 0; }
.dark_bg.active { opacity: 1; z-index: 150; transition: opacity 300ms ease; }
.pop_up { position: fixed; left:50%; top:50%; transform:translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; width:calc(100% - 40px); max-width:335px; padding: 50px 0; background-color: #fff; text-align: center; z-index: -1; opacity: 0; border-radius: 10px; }
.pop_up.active { opacity: 1; z-index: 150; transition: opacity 300ms ease; }
.pop_up p { color: #000; font-size: 22px; font-weight: 700; }
.pop_up > span { width: 100%; padding: 20px 0 30px; font-size: 1.4rem; font-weight: 400; color: var(--sub); text-align: center; transition: background-color 300ms ease-in-out; }
.pop_close { cursor: pointer; font-size: 1.6rem; font-weight: 500; min-width: 158px; padding: 8px 0; background-color: var(--main); color: #ffffff; border-radius: 26px; }


/* ------ 오프라인 매장 offline_store - menu ------ */
.franchise_listwrap { width: 100%; height:100vh; padding: 60px 0 80px; }
.list_search, .map_around { width:50%; text-align: center; padding:24px 20px 14px; border-bottom:2px solid var(--line); cursor:pointer; font-size: 1.6rem; font-weight: 500; color:var(--darkgray); }
.f_active { border-bottom:2px solid var(--main); color:var(--main); font-weight:700; }
/* .f_active::after { content: ''; } */
.franchise_search { border:1px solid var(--fran_inactive); border-radius: 6px; margin: 10px 0; display: flex; justify-content: space-between; align-items: center; padding:10px 20px; }
.search_input { width:100%; }
.search_input input { width:100%; }
.search_btn { width:auto; }
.search_btn button { outline:none; border:none; background:transparent; display:block; }
.list_active { background:var(--main); color:var(--white); border:none; }

/* search 바로 아래있는 스크롤 */
.list_slider { overflow-x:auto; display: flex; padding: 0 0 10px 20px; margin-bottom: 10px; }
/*스크롤바의 색상*/
.list_slider::-webkit-scrollbar-thumb { background-color: #ededed; border-radius: 3px; }
/*스크롤바 트랙 색상*/
.list_slider::-webkit-scrollbar-track { background-color: var(--white); }
/*스크롤바의 색상*/
.list_slider::-webkit-scrollbar { height:10px; }
/* .list_slider::-webkit-scrollbar-thumb { background-color: #fff; border-radius: 20px; } */
.list_slider::-webkit-scrollbar-thumb { background: var(--main); }
/*스크롤바 트랙 색상*/
.list_slider::-webkit-scrollbar-track { background-color: var(--main_sub); }
.list_slider li { padding:6px 10px; margin-right:8px; color: var(--fran_inactive); font-size:1.4rem; white-space: nowrap; border:1px solid var(--fran_inactive); border-radius: 20px; cursor:pointer; }
.list_slider li.list_active { background:var(--main); color:var(--white); border:none !important; }

/* 주변 가맹점 갯수 text */
.franchise_total { padding:0 20px; font-size:1.4rem; font-family: "noto_sans"; font-weight: 400; }
.franchise_number { color:var(--main); }

.franchise_lise_select { width: 100%; display: flex; justify-content: flex-end; padding: 0 20px; }
.franchise_lise_select select { padding: 10px; border: none; font-size: 1.4rem; font-weight: 700; outline: none; }
.franchise_lise_select option { color: #000; }

/* 가맹점 리스트 */
.franchise_list_container { padding: 0 20px; }
.fran_listw { border-bottom:1px solid var(--line); cursor: pointer; padding: 10px 0; }
.fran_listw:last-child { border: none; }
.fran_list_null { font-size: 1.4rem; font-weight: 400; }
.fran_list, .fran_infotxt { width:100%; }


/* 가맹점리스트 left */
.franchise_imglist { position: relative; width:120px; height:120px; border-radius: 10px; border: 1px solid var(--inactive); overflow: hidden; }
.franchise_imglist img { width:100%; height:100%; object-fit: cover; border-radius: 10px; }

.franchise_darkbg { position: absolute; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.6); display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; }
.franchise_darkbg > p { font-size: 1.6rem; color: var(--white); }

/* 가맹점 리스트 right */
.franchise_txt_list { position: relative; width: calc(100% - 140px); height: 120px; padding: 5px 0; }
.franchise_txt_list p { font-size: 1.3rem; font-weight: 400; margin-bottom: 5px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.franchise_txt_list p:first-child { font-size: 1.6rem; font-weight: 700; }
.franchise_txt_list p:last-child { padding: 0; }
.franchise_txt_list > div > p:last-child { color:var(--fran_inactive); }

/* 가맹점 리스트 right icon */
.fran_map_tel { display: flex; position: absolute; bottom: 0; right: 0; }
/* ------ // 오프라인 매장 offline_store - menu ------ */


/* ------ 오프라인 매장 franchise_information ------ */

/* 매장 내 슬라이드 이미지 */
.main_slider_box { position: relative; }
.main_bg .swiper-pagination-bullet-active { background:var(--main); }

/* 매장 관리 현황에 따른 표시 영역 */
.state_mainslider_txt { position: absolute; bottom:0; left:0; right:0; margin:auto; width:calc(100% - 40px); color:#fff; font-weight: 500; font-size:1.4rem; padding:10px 20px; background:rgba(0,0,0, 0.5); border-radius: 20px; text-align: center; z-index:66; }

/* 가맹점 이름 영역 */
.fran_infowrap { padding: 20px 20px 0; }
.fran_infowrap > div { width: 100%; min-height: 60px; }
.fran_name { font-size: 2rem; font-weight: 700; margin-right:10px; }
/* word-break: keep-all; */

/* 아이콘 */
.franchise_tel { justify-content: flex-end; align-items: center; }
.franchise_tel a { width: 35px; height: 35px; padding: 3px; color: var(--main); border-radius: 20px; line-height: 1; }
.franchise_tel a:hover { background-color: rgba(0, 0, 0, 0.05) }
.franchise_tel img { width: 100%; height: 100%; object-fit: fill; }

/* 메뉴나 정보에 값이 없을때 null 값 */
.fri_infosection { position: relative; width:100%; min-height:500px; height:auto; margin-bottom: 80px; }
.no_data { position: absolute; text-align: center; top:50%; left:50%; transform: translate(-50%, -50%); display: flex; flex-direction: column; justify-content: center; align-items: center; width:100%; height:100%; background-color: rgba(249, 249, 249, 0.1); font-size:1.4rem; font-weight:500; }
.no_searchdata { font-size: 1.4rem; }

/* 가맹점 사진 */
.fran_mainimg.null { background-color: #f9f9f9; margin-right:10px; }
.fran_mainimg { position: relative; width:100%; height:280px; }
.fran_mainimg img { position: absolute; top:0; left:0; right:0; bottom:0; margin: auto; width: 100%; height: 100%; max-width:100%; object-fit: contain; }

/* 가맹점 사진이 없을때 */
.nullimgf { max-width:70% !important; }

/* 정보탭 */
/* .fri_infoj { padding:20px 20px 80px; } */
.fri_infoj { padding: 0 20px; }
.fri_infoj > ul > li { padding: 20px 0 10px; border-bottom:1px solid var(--line); }
.fri_infoj > ul > li:last-child { border:none; }
.company_name { font-size:1.6rem; font-weight: 500; color:#111; }
/* .company_name { font-size:1.6rem; margin-bottom:20px; font-weight: 500; color:#111; } */
.company_detail_txt { font-size: 1.4rem; font-weight: 400; }
.company_detail_txt > li { display: flex; justify-content: space-between; align-items: center; padding-bottom: 10px; }
.company_detail_txt > li > span, .company_detail_txt > li > div { width: calc(100% - 110px); height: auto; word-break: break-all; }
.back_color { background-color:rgba(255,255,255, 0.01); -webkit-transition: background-color 300ms ease; -o-transition: background-color 300ms ease; transition: background-color 300ms ease; }

.store_open_time > p, .store_open_time > div { padding: 0 0 5px; }

.menu_box { display: flex; justify-content: space-between; align-items: center; padding: 20px; font-size: 20px; font-weight: 700; background-color: var(--bg); border-bottom: 1px solid var(--line_gray); }
.menu_box > div { display: flex; flex-direction: column; }
.menu_box > div > p:first-child { font-size: 1.6rem; font-weight:700; }
.menu_box span { font-size: 1.4rem; font-weight: 400; }

/* 메뉴탭 */
/* .fri_infom { padding-bottom : 80px; } */
/* 메뉴그룹 공지 */
.fri_menu_notice { padding: 20px; font-size: 1.4rem; border-bottom:3px solid var(--line); word-break: break-all; }
/* word-break: keep-all; */
/* 메뉴 더보기 화살표 transform */
.menu_box > img { transition: all 500ms; }
.arrow_down { transform: rotate(-180deg); transition: all 500ms; }
/* 메뉴 상세 */
.menu_detail_box { display: flex; justify-content: space-between; padding: 20px; cursor: pointer; border-bottom:1px solid var(--line); }
/* .menu_detail_box:hover { background: var(--line); } */
.menu_detail_img { width: 100px; height: 100px; border-radius: 8px; overflow: hidden; }
.menu_detail_img img { width: 100%; height: 100%; object-fit: cover; }
/* 메뉴 상세 내용 */
.menu_detail_list { width: calc(100% - 130px); word-break: break-all; }
.menu_detail_list.none_img { width: 100%; }
.menu_detail_list > p { font-size: 1.4rem; font-weight:500; }
.menu_detail_list > p:first-child { font-size: 1.6rem; font-weight:500; }
.menu_detail_list > p:nth-child(2) { padding: 3px 0; font-size: 1.4rem; font-weight:400; color: var(--fran_inactive); }
/* 유의사항 */
.info_sub_notice { padding: 20px 20px 60px; border-top:1px solid var(--line); color:var(--darkgray); }
.info_sub_notice > p { padding-bottom:5px; font-size:1.4rem; }
.info_sub_notice > ul > li { padding-left: 20px; list-style:inside; text-indent: -20px; font-size:1.2rem; }

/* ------ // 오프라인 매장 franchise_information ------ */


/* index > splash */
.bg_color_fran { background-color: #EBF4FE; position: relative; }
.bg_color { background-color: #f1f1f1; position: relative; }
.splash { position: relative; width: 100vw; height: 100vh; }
.splash_fran_txt { text-align: center; font-size: 22px; font-weight: 500; line-height: 32px; color: var(--main); font-family: 'noto_sans'; font-weight : 700; }
.splash_txt { text-align: center; font-size: 22px; font-weight: 500; line-height: 32px; color: var(--main); font-family: 'noto_sans'; font-weight : 700; }
.splash { width:100%; text-align: center; }
.splash_img { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; flex-direction: column; justify-content: center; align-items: center; }
.splash img { background-origin: border-box; background-clip: content-box, border-box; width:30px; height: 30px; animation: spin 1s linear infinite; margin-bottom: 20px; }

.splash2 { position: fixed; width: 100vw; height: 100vh; height: 100svh; background-color: var(--white);z-index: 999; top:0; left:0; }
.splash_fran_txt2 { text-align: center; font-size: 22px; font-weight: 500; line-height: 32px; color: var(--main); font-family: 'noto_sans'; font-weight : 700; }
.splash_txt2 { text-align: center; font-size: 22px; font-weight: 500; line-height: 32px; color: var(--main); font-family: 'noto_sans'; font-weight : 700; }
.splash2 { width:100%; text-align: center; }
.splash_img2 { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; flex-direction: column; justify-content: center; align-items: center; }
.splash2 img { background-origin: border-box; background-clip: content-box, border-box; max-width:300px; margin-bottom: 20px; }


@keyframes spin {
 0% { transform:rotate(0deg); }
 100% { transform:rotate(360deg); }
 }


/* ----------- Franchise Mode Main ----------- */
/* body { background-color:var(--line); } */
/* .wrapper { background-color: unset !important; } */
/*가맹점 상태 */
.franchisee_state { font-size:1.2rem; font-weight: 500; background: var(--bg); border-radius: 16px; padding:5px 14px; font-family: "noto_sans"; }
/*가맹점 상태 */

/*가맹점 정보안내 및 정보수정 페이지 */
.franmain_wrap { background: var(--bg); }
.user_wrap { margin:60px 0 90px; }
.fran_infomation { position:relative; box-shadow: 0px 3px 15px rgba(0,0,0,0.06); padding:20px; background: var(--white); }
.fran_infomation > div:first-child { width: calc(100% - 130px); }
/* word-break: keep-all; */
.fran_bg_img { position: absolute; right: 0; bottom: 0; width: 120px; height: 120px; }
.fran_bg_img img { width: 100%; height: 100%; }
.fran_mtitle { font-size:1.8rem; font-weight: 700; color:var(--fran); }
.fran_stitle { font-size:1.4rem; font-weight: 400; padding:4px 0; word-break: break-all; }
.fran_time { font-size:1.4rem; font-weight: 400; color:var(--dark); }
/* .change_franinfo { background-color: var(--main_sub); margin-top:10px; width:max-content; border-radius: 15px; padding:6px 10px; cursor:pointer; } */
.change_franinfo { background-color: var(--bg); margin-top:10px; width:max-content; border-radius: 10px; padding:7px 20px; cursor:pointer; }
/* .change_franinfo p:nth-child(2) { font-size:1.4rem; font-weight: 500; margin-left:4px; } */
.change_franinfo p { font-size:1.4rem; font-weight: 500; }

/* 가맹점관리 */
.fran_management_box p { padding-top:5px; font-size:1.4rem; font-weight: 500; }
.fran_menu_icon { width: 48px; height: 48px; line-height:48px; background-color: var(--lightgray); border: 1px solid var(--line); border-radius:13px; margin:0 auto; }
.fran_icon_container { display: flex; align-items: center; flex-wrap: wrap; text-align: center; }
.fran_icon_container > li { width: calc(100% / 4); }

/* 보유금액 */
.fran_state_amount { background-color: var(--white); box-shadow: 0px 3px 15px rgba(0,0,0,0.06); margin:20px; border-radius: 10px; padding:20px; }
.fran_state_amount p:nth-child(1) { font-size:1.6rem; font-weight: 700; }
.bal_number { font-size:1.4rem; font-weight: 500; }
.bal_state { width:40px; color:var(--gray); font-size:1.4rem; font-weight:700; padding:2px 0; background-color: var(--inactive); margin-left:8px; cursor: pointer; border-radius: 8px; text-align: center; }
.bal_state_fctive { color:var(--fran); background: #E8EDFF; }
.num_klay { padding:10px 0; font-size:2.2rem; font-family: "montserrat"; font-weight: 600; }
.num_klay .dan { font-size:1.4rem; font-family: "montserrat"; font-weight: 700; color:var(--fran); } */
.total_sisa { font-size:1.4rem; color:var(--dark); font-weight: 500; width:100%; }
.change_fbtn { width:72px; display: flex; align-items: center; background-color: #E8EDFF; border-radius: 15px; padding:4px 18px; }
.change_fbtn span:nth-child(2) { font-size:1.6rem; font-weight: 500; font-family: "noto_sans"; padding-left:6px; color:var(--fran); }
.sync_img { margin-left:4px; }
.refresh_btn { cursor:pointer; }
.refresh_btn > p { width: 30px; height: 30px; display: flex; justify-content: center; align-items: center; }
/* 누적 결제 */
.fran_management_listwrap, .accumulated_listwrap { margin:20px 20px 0; box-shadow: 0px 3px 15px rgba(0,0,0,0.06); overflow: hidden; border-radius: 10px; }
.fran_management_title, .accumulated_title { font-size:1.6rem; font-weight: 700; }

.fran_management_list, .accumulated_list { width:100%; cursor:pointer; position: relative; padding:14px 20px; border-bottom:1px solid var(--line); background-color: var(--white); }
.fran_management_list:after, .accumulated_list:after { background-position: center; background-image: url("../../assets/img/icon/icon_arrow_down.svg"); background-repeat: no-repeat; display: inline-block; width: 16px; height: 16px; content:""; position:absolute; top:50%; right:20px; transform: translateY(-50%); }
.fran_management_list.active:after, .accumulated_list.active:after { background-image: url("../../assets/img/icon/icon_arrow_up.svg"); content:""; }
.fran_management_box, .accumulated_box { background-color: var(--white); }

/*누적 결제 클릭시 보여지는 내역*/
.list_paymentbox { padding:20px 0; border-bottom:1px solid var(--line); margin:0 20px; }
.accu_title { font-size:1.4rem; font-weight: 500; color:var(--dark); }
.accu_paycolor { color:var(--fran); font-weight: 700; font-family: "montserrat"; font-size:1.6rem; }
.accu_paycolor span { font-weight: 700; font-family: "montserrat"; font-size:1.4rem; }
.accu_number { font-size:1.6rem; font-family: "montserrat"; font-weight: 600; padding-top:6px; }
.accu_number span { font-size:1.6rem; font-family: "noto_sans"; font-weight: 600; }
.accu_snumber { font-size:1.4rem; font-weight: 500; color:var(--dark); padding-top:6px; }

/*현재 시세*/
.accu_date { margin:10px 40px 0; }
.accu_date p { font-size:1.4rem; font-weight: 400; color:var(--dark); }

/*고객 결제하기 */
.customer_payment_wrap { margin:14px 20px 0; border-radius: 10px; background-color:var(--white); box-shadow: 0px 3px 15px rgba(0,0,0,0.06); overflow: hidden; }
/* .user_paymentbox { padding:14px 16px; background: var(--main); color:var(--white); font-size:1.6rem; font-weight: 700; } */
/* .user_paymentbox.remove { background:#E8EDFF; color:var(--fran); } */
.input_payment { padding:20px; }
.input_paybox p { font-size:1.6rem; font-weight: 700; font-family: "noto_sans"; }
/* .user_amount { position: relative; width: 100%; height: 50px; margin-top: 10px; border-radius: 10px; background-color: var(--lightgray); border: 1px solid var(--gray); font-size: 1.6rem; font-weight: 600; } */
/* .user_amount .input_basic { margin-top:0; border:unset; background-color: unset; } */
/* .user_amount input::placeholder { font-size: 1.6rem; font-weight:500; } */
/* .position_txt { position:absolute; top:50%; right:20px; transform: translateY(-50%); font-size:1.6rem; font-family: "montserrat"; font-weight:700; color:var(--fran); } */
/* .choice_num { width:96%; } */
/* .user_bacode_pay { width:100%; border-radius:10px; margin-top:20px; overflow: hidden; }
.user_bacode_pay span { padding-left:40px; }
.user_bacode_pay button::before { top:50%; transform: translateY(-50%); position: absolute; content: ''; background: url('../img/icon/icon_barcode.svg'); width:32px; height:32px; background-position: center; }
.user_bacode_pay button.key_active::before { background: url('../img/icon/icon_barcode_w.svg'); } */
.bacode_info { font-size:1.4rem; font-weight: 400; color:var(--dark); margin: 10px 30px 0; text-align: center; }
.bacode_info p { color:var(--fran); }
.main_fran_qr_info { font-size:1.4rem; font-weight: 400; color:var(--main); margin: 10px 30px 0; text-align: center; }
.main_fran_qr_info p { color:var(--main); }
.user_amount.input_active { border:1px solid var(--fran); }
.user_bacode_btn.key_active { background-color: var(--fran); color:var(--white); }
.user_bacode_btn.key_active span { color:var(--white); }
.user_bacode_btn.pay_active { background-color: var(--main); color:var(--white); }
.user_bacode_btn.pay_active span { color:var(--white); }

.user_qr_pay { width:100%; border-radius:10px; margin-top:20px; overflow: hidden; }
.user_qr_pay button { position:relative; color:var(--gray); font-size:1.6rem; font-weight: 700; padding-left:4px; width:100%; padding:14px 0; background:#EFF3F5; font-family: "noto_sans"; }
.pay_code_number.pay_active { background-color: var(--main); color:var(--white); }
.pay_code_number.pay_active span { color:var(--white); }


/*고객결제*/
.use_payment { position: sticky; top:0; left:0; width: 100%; height: 100%; z-index: 200; }
/* .bg_dark { position: fixed; top:0; left:0; width:100%; height:100%; background-color: rgba(0,0,0,0.5); } */
.payment_cont { position: fixed; left:0; margin:auto; right:0; bottom:80px; border-radius: 10px 10px 0 0; width:100%; max-width:768px; z-index: 9920; background-color:var(--white); box-shadow: 0 3px 15px rgba(0, 0, 0, 0.06); }
.quit_img { position: absolute; top:0; right:0; padding:27px 27px 0; cursor:pointer; width:max-content; }
.paymettxt { font-size:1.8rem; font-weight:700; text-align: center; margin-top:32px; margin-bottom:30px; }
.use_txt { font-size:1.4rem; font-weight: 400; color:var(--dark); font-family: "noto_sans"; margin-top:20px; }
.use_txt p { color:var(--fran); }
.use_payment .input_payment { padding:0 30px; }

/* 고객결제 키패드 */
.keypad_btn { background-color: var(--line); padding:10px; }
.send_button { touch-action: manipulation; color:var(--black); width: 33%; padding: 16px 0; margin-bottom: 6px; border-radius: 10px; outline: none; border: none; font-size:2.2rem; background-color: var(--white); }
.reset_txt { font-size:1.8rem; }
.pin_active { background-color: var(--main); }
.number_box { text-align: center; padding:50px 0; }
.number_box input::placeholder { font-size:2.2rem; }
.easy_password { font-size:1.4rem; font-weight: 400; text-align: center; }
.reset_img img { margin:0 auto; }
.no_m { margin-bottom:0; }

/* 가맹점 가입 */
.join_container { padding: 20px; }
.step_img { padding-bottom:20px; text-align: center; }
.step_img img { margin:0 auto; }
.join_step01_title { padding: 20px 0; }
.join_step01_title > p { font-size: 2.2rem; font-weight:700; }
.join_step01_title > p:last-child { padding-top: 10px; font-size: 1.4rem; font-weight: 500; }

.spa { margin: 10px 10px 0 24px; padding-bottom: 20px; font-size: 1.4rem; font-weight: 400; color: var(--sub); cursor: pointer; text-align: justify; }
.all_agree { margin-top: 30px; border-bottom: 1px solid var(--line); }
/* 전체동의 이미지 변환*/
.all_agree input[type="checkbox"] + label { width: 100%; overflow: hidden; font-size: 1.6rem; font-weight:500; padding-left: 24px; background: url("../img/layout/svg/icon_check_off.svg") no-repeat 0 50% / 20px 20px; cursor: pointer; }

.all_agree input[type="checkbox"]:checked + label { background: url("../img/layout/svg/icon_check_on.svg") no-repeat 0 50% / 20px 20px; cursor: pointer; }

.all_agree input[type="checkbox"], .individual_chk input[type="checkbox"] { display: none; }

.chk_box { margin:0 0 15px 5px; }

.individual_chk input[type="checkbox"] + label { font-size: 1.4rem; font-weight: 500; background: url("../img/layout/svg/icon_check_off.svg") no-repeat 0 50% / 20px 20px; cursor: pointer; }

.individual_chk input[type="checkbox"]:checked + label { background: url("../img/layout/svg/icon_check_on.svg") no-repeat 0 50% / 20px 20px; cursor: pointer; }

.clause { width: 25px; height: 25px; background: url('../img/layout/svg/icon_arrow_right.svg') no-repeat; }


/* join comp step03 */
.join_comp_img { display: table-cell; text-align: center; vertical-align: middle; }
.join_comp_img img { margin:0 auto; padding-bottom: 20px; width:80px; height:80px; }
.join_franstate { font-size: 2.2rem; }
.join_franscomplet { font-size: 1.6rem; }


/* 매장관리 - 기본정보 */
.basic_info { width: 50%; text-align: center; font-weight: 700; padding: 9px 20px; border-bottom: 2px solid var(--line); cursor: pointer; color: var(--fran_inactive); font-size:1.6rem; }
.infor_title { font-size:2.2rem; padding:20px; font-weight: 700; border-bottom:1px solid var(--line); }
.store_active { border-bottom:2px solid var(--main); color:var(--main); font-weight:700; }
.openinfor_wrap { border:1px solid var(--fran_inactive); border-radius: 10px; padding:26px; }
.open_totalwrap { padding:20px; border-bottom:1px solid var(--line); }
.open_timetitle { margin-bottom:14px; font-weight: 700; font-size:1.6rem; }
.open_numbertitle { font-weight:400; font-family: "poppins"; font-size:1.6rem; }
.day_flex { display: flex; justify-content: space-between; align-items: center; margin-top:24px; flex-wrap: wrap; }
.day_week { display: flex; justify-content: center; align-items: center; width:34px; height:34px; border-radius: 50%; border:1px solid var(--fran_inactive); color:var(--fran_inactive); font-size:1.6rem; }
.day_active { background:var(--main); color:#fff; border:none; }
.null_holiday_wrap, .holiday_wrap { padding:20px; }
.holiday_txt { font-size:1.6rem; font-weight: 700; }
.holiday_stxt { font-size:1.4rem; font-weight: 400; word-break: break-all; }
.holiday_date { font-family: poppins; font-size:1.4rem; font-weight: 400; }
.store_line { height:4px; background:var(--line); }
.employee_wrap { padding:30px 20px; }
.employee_flex { display: flex; justify-content: space-between; align-items: center; margin-bottom:14px; }
.employee_sflex { display: flex; align-items: center; }
.employee_name { margin-right:30px; font-weight: 500; }
.employee_time { font-family: poppins; font-weight: 400; }
.employee_img img { display: block; }
.employee_state.employee_active { background:#EBF4FE; color:var(--main); padding:10px; border:none; border-radius: 18px; }
.employee_state { margin-left:16px; padding:10px; font-size:1.4rem; border-radius: 18px; font-weight: 500; color:var(--fran_inactive); border:1px solid var(--fran_inactive); }

/* store_notice */
.store_notice { padding: 20px; border-bottom: 1px solid var(--line); }
.store_notice span { font-size: 1.2rem; font-weight: 400; }

/* store information 매장관리 내 운영관리 */

/* 운영관리 내 매장 공지사항 */
.notice_edit_area_box { width: 100%; height: 140px; padding: 20px; border: 1px solid var(--fran_inactive); font-family: "noto_sans"; font-size: 1.4rem; font-weight: 400; resize: none; border-radius: 10px; }
.notice_edit_area { width: 100%; height: 100px; font-family: "noto_sans"; font-size: 1.4rem; font-weight: 400; resize: none; border:none; }
.hours_time { border:1px solid var(--fran_inactive); border-radius: 10px; width:100%; padding:8px; font-size:1.4rem; text-align: center; }
.hours_box { width:49%; position: relative; }
.businessstatus_btn label { position:relative; width:33%; margin-right:30px; text-align: center; cursor:pointer; }
.businessstatus_btn label:last-child { margin-right:0; }
.businessstatus_btn label span { position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); color:var(--fran_inactive); width: 100%; }
.business_hours_wrap { margin:20px; }
.business_hours { position:relative; border:1px solid var(--fran_inactive); border-radius: 10px; padding:20px; }
.hoilday_closeimg { cursor: pointer; margin-bottom:20px; }
.businessstatus_wrap { padding:20px; border-bottom:1px solid var(--line); }
.businessstatus_wrap > li:first-child { align-items: flex-start; margin-bottom: 6px; }
.businessstatus_time { font-size:1.2rem; font-weight: 400; }
.btn_state { display:block; outline: none; margin:0; background:#fff; border:1px solid var(--fran_inactive); border-radius: 18px; min-height:35px; font-size:1.4rem; font-weight: 500; width:100%; color:var(--fran_inactive); font-family: "noto_sans"; padding:0; }


.businessstatus_btn input[type="radio"]:checked { /* background:linear-gradient(to right, #2E9DCD , #523B88); color:#fff; */
 background:var(--main); color:#fff; border:none; }
.businessstatus_btn input[type="radio"]:checked + span { color:#fff; }
/* 삭제버튼 */
.business_close_btn { position:absolute; top:10px; right:10px; display:flex; justify-content: flex-end; align-items: center; background-color:rgba(0,0,0,0); }
/* word-break: keep-all; */

/* timePicker custom */
.ui-menu-item { height: 35px !important; display:flex !important; align-items: center !important; }
.ui-menu-item > a { display:block !important; width:100% !important; padding: 7px 0 !important; font-size: 1.4rem !important; }
/* 영업정보 관련 안내문 */
.operation_info { padding: 20px; list-style-type: disc; border-top:1px solid var(--line); }
.operation_info > li { font-size: 1.4rem; color: var(--darkgray); }
/* switch initial setting & off style */
.hour_switch { line-height: 0; }
.hour_switch_check { cursor:pointer; position: absolute; appearance: none; -webkit-appearance: none; -moz-appearance: none; width: 50px; height: 26px; z-index: 2; margin: 0; }
.switch_label { position: relative; cursor: pointer; display: inline-block; width: 50px; height: 26px; background: var(--fran_inactive); border-radius: 20px; transition: 0.2s; }
.onf_btn { position: absolute; top: 2px; left: 2px; display: inline-block; width: 22px; height: 22px; border-radius: 20px; background: #ffffff; transition: 0.2s; box-shadow: 0px 0px 5px rgba(0,0,0, 0.16); }
/* switch move & on style */
.hour_switch_check:checked+.switch_label .onf_btn { left: 26px; top: 2px; }
.hour_switch_check:checked+.switch_label { background: var(--main); }

.join_state { display: flex; justify-content: space-around; align-items: center; margin-bottom:14px; }
.time_rest > p { margin-top:10px; font-size:1.2rem; font-weight: 500; }
.holiday_check { padding:20px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
/* 요일 체크박스 */
.join_obj input[type="checkbox"] { display: none; }
.join_obj input[type="checkbox"] + span { display: flex; justify-content: center; align-items: center; color: var(--fran_inactive); border-radius: 50%; border:1px solid var(--fran_inactive); cursor: pointer; width:34px; height:34px; font-size:1.4rem; font-weight: 400; }
.join_obj input[type="checkbox"]:checked + span { color: #fff; background: var(--main); border:none; }
.plus_buzi img { display: block; width: 13px; height: 13px; }
.buzi_txt { font-size:1.2rem; color:var(--main); font-weight: 500; margin-left:4px; }

/* 확인 필요 */
.choice_huwrap { border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.choice_hu { padding:20px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
/*// 확인 필요 */

.regular_holiday { width:47%; }
.business_hours_wrap .scroll_list { top:42px; z-index:2; }
.plus_holidy { cursor: pointer; width:110px; }

.store_img_box { padding: 20px 20px 20px; border-bottom: 4px solid var(--line); }
.store_img_box > p { font-size: 1.4rem; font-weight: 400; padding-bottom: 15px; }
.store_img_box > p:nth-child(2) { font-size:1.2rem; color:var(--fran_inactive); }
.store_img_box .store_container { overflow: auto; padding-bottom: 10px; }
.upload_img_bg .file::after { content: "+"; font-size: 20px; font-weight: 700; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); color: #999; }
.upload_img_bg .file { display:block; width: 100%; max-width: 153px; height: 115px; border-radius:10px; border:1px dashed var(--fran_inactive); cursor:pointer; overflow:hidden; position:relative; }
.store_slide { width: max-content; min-width:100%; display: flex; overflow-x: auto; }
.store_slide li { margin-right: 5px; text-align: center; font-size: 18px; width: 100%; min-width: 153px; max-width: 153px; height: 115px; border-radius: 10px; overflow: hidden; position: relative; }
.store_slide li img { display: block; width: 100%; height:100%; object-fit: cover; }
.store_slide .noset_img { height:60%; object-fit: contain; position: absolute; left:0; top:50%; transform: translateY(-50%); }
.detail_img_box .store_img_title , .store_slide .store_img_title { color: var(--white); position: absolute; top: 10px; left: 10px; width: max-content; font-size: 1.4rem; font-weight: 700; border-radius: 10px; background: var(--main); padding: 0 10px; }
/*스크롤바의 색상*/
.store_container::-webkit-scrollbar { position: absolute; left: 0; top: 0; width: 100%; height: 5px; background-color: rgba(0,0,0,0.1); }
.store_container::-webkit-scrollbar-thumb { background-color: var(--fran); border-radius: 20px; }
/*스크롤바 트랙 색상*/
.store_container::-webkit-scrollbar-track { background-color: transparent; transition: 10s; }
.store_list_box { padding: 20px 0; margin:0 20px; border-bottom:1px solid var(--line); word-break: break-all; }
.store_sub { font-size: 1.6rem; font-weight: 700; margin-bottom: 6px; }
.store_list_box span { font-size: 1.4rem; font-weight: 400; }
/* .store_list_box span.active { color: var(--black); } */
.store_list_box ul { display: flex; align-items: center; flex-wrap: wrap; }
.store_list_box ul li { padding: 10px; font-size: 1.4rem; font-weight: 500; color: var(--main); }
/* .store_list_box ul li::before { content: '# '; } */
.parking_btn { display: none; font-size:1.4rem; margin-right:15px; width: 94px; height: 35px; line-height: 35px; text-align: center; border:1px solid var(--fran_inactive); border-radius: 18px; color: var(--fran_inactive); }
.parking_btn.active { display: block; background: var(--main); color: #ffffff; border: none; }

/* change_franchise_edit */
.repre_img { display: none; position: absolute; top: 5px; left: 5px; width: 67px; height: 21px; line-height: 21px; font-size: 12px; font-weight: 500; text-align: center; background-color: var(--line); border-radius: 10px; }
.repre_img.active { display: block; }
.store_list input:focus { border-color: #4A9EFA; }
.store_list > div { margin-bottom: 8px; }
.store_list > div:last-child { margin: 0; }
.store_list { position: relative; padding: 16px 20px 20px; border-bottom:1px solid var(--line); }
.store_list input { font-size: 1.4rem; font-weight: 400; width: 100%; padding: 10px 70px 10px 10px; border-radius: 10px; border: 1px solid var(--fran_inactive); font-family: "noto_sans"; }
.store_select > span { padding-left: 7px !important; }
.edit_sub { font-size: 1.6rem; font-weight: 700; margin-bottom: 10px; }
.edit_area_box { width: 100%; height: 180px; padding: 20px; border: 1px solid var(--fran_inactive); font-family: "noto_sans"; font-size: 1.4rem; font-weight: 400; resize: none; border-radius: 10px; }
.edit_area { width: 100%; height: 140px; border: none; font-family: "noto_sans"; font-size: 1.4rem; font-weight: 400; resize: none; }
.inquiry_txtarea::placeholder, .edit_txt::placeholder, .fran_edit_txt::placeholder, .store_list input::placeholder, .edit_area::placeholder,.mail_edit_txt::placeholder { font-family: "noto_sans"; font-size: 1.4rem; font-weight: 400; color: var(--fran_inactive); }
.store_list textarea:focus { border-color: #4A9EFA; }
textarea { outline: none; }
.mail_txtLength_wrap, .txtLength_wrap , .area_textLengthWrap { position: absolute; bottom: 33px; right: 40px; display: flex; flex-wrap:nowrap; -webkit-flex-wrap:nowrap; align-items: center; font-size: 12px; font-weight: 500; color: var(--dark); }
.mail_txt_count, .txt_count,.area_textCount { margin-right: 4px; min-width:30px; text-align: right; }
/* .txt_total,.area_textTotal { min-width:40px; } */
.tag_add { margin-left: 15px; min-width: 94px; height: 35px; font-size: 1.4rem; font-weight: 400; color: #ffffff; background-color: #4A9EFA; border-radius: 18px; }
.tag_add_input { width:100%; height: 35px; border:1px solid var(--fran_inactive); border-radius: 10px; text-indent:16px; }
.store_list > ul { margin: 16px 0 20px; display: flex; flex-wrap: wrap; justify-content: flex-start; }
.hash_add { margin: 5px 4px; height: 35px; padding: 8px 14px; background-color: #F7FCEF; display: flex; align-items: center; justify-content: space-between; font-size: 1.4rem; font-weight: 500; color: var(--main); border-radius: 18px; }
.hash_add img { margin-left:10px; }
.hash_add > a { height: 35px; line-height: 40px; }
.postcode_edit { width: calc(100% - 135px); }
.address_btn_edit { font-family: "noto_sans"; padding:8px 20px; margin-left:10px; border: 1px solid var(--fran_inactive); border-radius: 10px; font-size: 1.4rem; font-weight: 500; background-color: #fff; color: var(--fran_inactive); }
.catecory_sel { width: 100%; padding: 10px; border-radius: 10px; border: 1px solid var(--fran_inactive); }

/* store_image_create */
.rep_container { padding: 20px 20px 0; }
.rep_container .rep_txt { display: flex; align-items: baseline; }
.rep_container span { display: block; width: 10px; height: 100%; margin-right: 5px; }
.rep_container p { font-size: 12px; font-weight: 400; color: var(--sub); margin-top: 10px; }
/* .rep_img_box { position: relative; width: 100%; height: 0; padding-top: 75%; margin: 0 auto; overflow: hidden; border-radius: 10px; border: 1px dashed var(--fran_inactive); } */
.rep_img_box { position: relative; width: 75%; height: 0; padding-top: 56%; margin: 0 auto; overflow: hidden; border-radius: 10px; border: 1px dashed var(--fran_inactive); }
.rep_img_box img { position:absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); max-width: 100%; height: 100%; object-fit: cover; }
.rep_img_box > label { position:absolute; left: 0; top: 0; width:100%; height: 100%;  cursor:pointer;}
.rep_img_box input { display: none; }

.img_add_box { border: 1px dashed var(--fran_inactive); }


.detail_img { display: flex; flex-wrap:wrap; justify-content: space-between; padding: 20px; }
.detail_img > li { position: relative; text-align: center; width: calc(100% / 2 - 10px); height: 0; padding-bottom: 37.5%; margin-bottom: 10px; overflow: hidden; border-radius: 10px; }
.detail_img > li img { width: 100%; height:100%; object-fit: cover; position: absolute; left:0; top:0; }
.detail_img .noset_img { height:50%; object-fit: contain; position: absolute; left:0; top:50%; transform: translateY(-50%); }
.create_img_close { position: absolute; right: 5px; top: 5px; width: 20px; height: 20px; z-index: 2; background-color: transparent; cursor:pointer; background: url(../img/contents/franchise/icon_img_close.svg)no-repeat; }
.detail_img > li label { position:absolute; left: 0; top: 0; width:100%; height: 100%; }
.detail_img > li input { display: none; }


/* 가맹점 - 메뉴관리 */
.group_menu_list { width:100%; padding: 0 20px; height: calc(100% - 69px); }
.group_menu_list > li { position:relative; padding: 20px 0; border-bottom: 1px solid var(--line); }
/* .group_menu_list > li:hover { background:var(--inactive); border-radius:5px; } */
.group_menu_list > li > div > p { font-size: 1.4rem; width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; color: var(--fran_inactive); font-weight:400; }
.group_menu_txt { display:flex; justify-content:space-between; cursor:pointer; }
.menu_dot_box { position:absolute; top:50%; right: 0; transform: translateY(-50%); }
.main_group_box { position: relative; padding-bottom: 10px; }
.main_group_box p:first-child { font-size: 1.6rem; font-weight: 500; }
.main_group_sub { font-size:1.4rem; font-weight:400; }

.group_menu_modify { display: none; position: absolute; right:0; top: 20px; width:120px; background-color: var(--white); border: 1px solid var(--fran_inactive); z-index: 30; }
.group_menu_modify.active { display: block; }
.group_menu_modify li:hover { background-color: var(--main_sub); color: var(--white); }
.group_menu_modify li p { padding: 8px 15px; border-bottom: 1px solid var(--fran_inactive); font-size: 1.4rem; font-weight: 500; }
.group_menu_modify li p:last-child { border:none; }

.menu_null_txt > p { padding: 50px 20px; font-size: 1.6rem; color: var(--black); font-weight: 700; text-align: center; }
.fran_point_text { padding:0 20px; font-size: 1.4rem; font-weight: 500; color: var(--red); }
.bottom_fixed { position: fixed; bottom: 0; width: 100%; padding: 10px 20px; max-width: 768px; }

.menu_add_btn { width: 90px; font-size: 1.4rem; font-weight: 700; border-radius: 6px; padding: 6px; color: var(--fran); background: #E8EDFF; }
.dot_img_btn { width: 12px; height: 12px; z-index:20; transform: rotate(180deg); }
.dot_img_btn img { width: 100%; height: 100%; }

/* 원산지 표기 */
.origin_text_box { padding: 20px; word-break:break-all; }
.origin_text_box > p { font-size: 1.6rem; font-weight: 700; padding-bottom: 10px; }
.origin_txt { font-size: 1.4rem; font-weight: 400; }
.origin_hidden { width: 100%; max-height: 60px; overflow: hidden; }
.origin_active { display:flex; justify-content:center; padding: 10px 0; width:100%; transition: all 500ms; }
.origin_active.rotate { transform:rotate(180deg); }

/* 메뉴그룹 수정 */
.fran_check { margin: 7px 10px; }
.fran_check input[type="checkbox"] { display: none; }
.fran_check input[type="checkbox"] { display: flex; justify-content: center; align-items: center; color: var(--fran_inactive); border-radius: 0; border:1px solid var(--fran_inactive); cursor: pointer; padding:0; width:15px; height:15px; font-size:1.4rem; font-weight: 400; }
.fran_check input[type="checkbox"]:checked { color: #fff; background: url("../img/icon/icon_chk.svg") no-repeat 0 50% / 13px 13px; }
.fran_menu_add { display: flex; justify-content: space-between; padding: 15px 0; width: 100%; border-bottom: 1px solid var(--line); }
.price_flex > div img, .fran_menu_add > div:last-child { min-width: 10px; height: 10px; margin: 7px 10px; }
.fran_menu_add > div:last-child img { width: 100%; height: 100%; }
/* textarea */
.fran_edit_txt_box { width: 100%; height: 80px; padding: 10px 10px 20px 10px; border: 1px solid var(--fran_inactive); font-family: "noto_sans"; font-size: 1.4rem; font-weight: 400; resize: none; border-radius: 10px; }
.fran_edit_txt { width: 100%; height: 50px; border: none; font-family: "noto_sans"; font-size: 1.4rem; font-weight: 400; resize: none; }
.inquiry_txtarea_box { padding: 10px 10px 25px; width: 100%; height: 250px; border: 1px solid var(--fran_inactive); border-radius: 10px; }
.inquiry_txtarea { width: 100%; height: 100%; border:none; font-family: "noto_sans"; font-size: 1.4rem; font-weight: 400; resize: none; border-radius: 10px; }
/* 메뉴 등록 */
.price_flex { display: flex; justify-content: center; align-items: center; }
.price_flex > p { font-size: 1.4rem; font-weight: 500; }

.label_file { display:block; }
.label_file input[type="file"] { display:none; }
.label_file .file { display:block; width:100px; height:100px; border-radius:10px; border:1px dashed var(--fran_inactive); cursor:pointer; overflow:hidden; position:relative; }
.label_file .file::after { content:"+"; font-size:20px; font-weight:700; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); color:#999; }
.label_file .file img { width:100%; height:100%; object-fit:cover; }
.label_file .file.active::after { display:none; }
.register_menu_img { display:flex; align-items: flex-end; }
.register_menu_img > p { font-size: 1.2rem; color:var(--fran_inactive); }

/* 메뉴관리 내 상세메뉴 */
.menu_title_link { display:flex; align-items: flex-end; padding: 20px 20px 0; }
.menu_title_link > p { font-size:1.6rem; font-weight:700; color:var(--fran); }

/* user - franchise 내 상세 메뉴 */
.fran_de_txt { font-size: 1.4rem; font-weight:400; color: var(--fran_inactive); }
.price_list { margin-top:20px; padding:20px; border-top:1px solid var(--line); }
.price_list > div { padding-bottom:10px; }
.price_list > div > p { font-size:1.6rem; font-weight:700; }
.price_list > ul > li { display:flex; justify-content: space-between; align-items: center; padding:15px 0; }
.price_list > ul > li > p { font-size:1.4rem; font-weight: 400; }

/* add & edit button */
.edit_img, .add_img { position:absolute; left: 50%; top:50%; transform: translate(-50%, -50%); width:30px; height: 30px; cursor:pointer; }
.edit_img > img, .add_img > img { width: 100%; height: 100%; }

.fran_info_addr { font-size:1.4rem; font-weight:400; word-break: break-all; }

/* 230419 kms 로그인페이지 수정 */
.login_box { padding: 8vh 20px 20px; min-height: calc(100svh - 50px); width:100%; position: absolute; left: 50%; transform: translate(-50%); background-color: var(--white); }
.login_box > p { font-size: 32px; font-weight:700; text-align:center; color: var(--main); }

.login_form_box { width: 100%; margin-top: 40px; background-color: var(--white); overflow: hidden; }
.user_box, .password_box { position: relative; }
.user_id { width: 100%; height: 60px; padding-left: 18px; border: 1px solid var(--main); border-radius: 10px; margin-bottom: 15px; font-size: 1.5rem; outline: none; background-color: var(--white); }
.user_password { width: 100%; height: 60px; padding-left: 18px; box-sizing: border-box; border-radius: 10px; background-color: transparent; border: 1px solid var(--main); font-size: 1.5rem; outline: none; }
.eye_svg { position: absolute; right: 20px; top: 18px; }

.easy_box { width: 98%; display: flex; justify-content: space-between; align-items: center; margin: 15px auto 0; }
.login_txt { color : var(--main); font-weight:400; font-size: 1.4rem; cursor:pointer; }

.line { position: relative; height: 1px; margin-top: 30px; border: 1px solid var(--main); }
.line_i { position: absolute; top: 50%; left: 50%; width: 50px; transform: translate(-50%, -50%); font-size: 1.2rem; color: var(--main); background-color: var(--white); text-align: center; }

.subtxt14 { font-size: 1.4rem; line-height: 2.4rem; font-weight: 400; color: var(--main); }
.subtxt14 + p { color : var(--main); }

/* 가맹점 미리보기 */
.preview_setting { position:relative; }
.preview_setting > ul { position: absolute; top:40px; right:0; width:130px; background:var(--white); }
.preview_setting > ul > li { font-size: 1.6rem; font-weight: 500; border:1px solid var(--black); text-align:center; }
.preview_setting > ul > li > a { padding:10px 20px; display:block; width:100%; height:100%; }
.preview_setting > ul > li:last-child { border-top: none; }

/* 지도 */
/* #map { height:calc(100% - 245px); } */
.map_box { width:100%; height:100%; margin-top:20px; }
/* 회원가입 */
.pw_security { position:relative; }
.pw_security_txt { position: absolute; top:20px; right: 0; font-weight:500; }

/* 가맹점 첫 로그인시 비밀번호 변경페이지 */
.pw_comple_box > p:first-child { margin-top:14vh; font-size: 2.2rem; font-weight:700; text-align: center; }
.pw_comple_box > p:last-child { margin-top:20vh; font-size: 1.6rem; font-weight:500; text-align: center; }

/* usage_histoy 사용내역 */
.dset input { width: 110px; text-align: center; font-size:1.4rem; font-weight:500; padding: 8px; border: 1px solid var(--fran_inactive); border-radius: 10px; }
.demi { padding : 0 10px; }
.ellipsis_170 { word-break:break-all; cursor:pointer; width:170px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.franchise_info_box { position:absolute; bottom:20px; width:calc(100% - 40px); }
.ellipsis_list { width: calc(100% - 90px); overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; }

/* QR 결제 */
.qr_img_box { padding-top:70px; text-align: center; }
.qr_img_box > h2 { font-size: 1.8rem; }
/* .qr_img { padding: 20px 0; } */
/* 230329 간격수정 */
.qr_img { padding: 0 0 10px; }
.qr_img img { margin:0 auto; width:180px; height:180px; }
/* .none_pay { width:100%; margin-top:50px; }
.none_pay > p { text-align: center; font-size: 1.4rem; font-weight: 500; text-decoration:underline; cursor: pointer; }
.none_pay_code > p { width: 180px; height: 40px; padding: 5px 10px; border-radius: 10px; border: 1px solid var(--gray); background: var(--bg); color:var(--darkgray); font-size: 1.6rem; font-weight: 600; text-align: center; } */
/* .none_pay_code input { width: 200px; height: 40px; padding: 10px 20px; border-radius: 10px; border: 1px solid var(--gray); font-size: 1.6rem; font-weight: 600; text-align: center; } */
/* .pay_code_input > input { width: 30%; height: 40px; padding: 10px 20px; border-radius: 10px; border: 1px solid var(--gray); font-size: 1.6rem; font-weight: 600; text-align: center; } */

/*230328 QR결제 변경작업 : 신정운 */
.box_height.bg_black_j { background: #0E131B; }
header.bg_black_j { background: #0E131B; border-bottom:1px solid #1A222E; }
.header_list.bg_black_j { background: #0E131B; border-bottom:1px solid #1A222E; }
.header_list.bg_black_j .header_title { color:#fff; }
.user_fran_list { width: 100%; height: 100%; padding: 0 20px; }
.tabs { display:flex; position:relative; padding:4px; width:100%; height:48px; text-align: center; background: #000; overflow: hidden; border-radius: 10px; }
.tabs .tab { display: flex; justify-content: center; align-items: center; width: 50%; height:100%; z-index: 2; cursor: pointer; }
.tabs .tab p { font-size: 1.8rem; font-weight: 500; color:var(--dark); }
.qrtab_j .active { background: #24272D; color:#fff; border-radius: 8px; }
.qrtab_j .tab.active p { color:#fff; }
.qrcode_jbox .history_viewbox { background: unset; padding:0; }
.qrcode_jbox { background: #fff; border-radius: 10px; box-shadow: 0px 3px 15px rgba(0,0,0,0.6); width:calc(100% - 40px); margin:0 auto; padding:30px; }
.qrcode_jbox .qr_img_box { padding-top:0; }
.payment_usejtxt { font-size:16px; color:var(--dark); font-weight: 500; }
.num_tq_box_j { background: linear-gradient(to bottom right, #11B1F8, #1162F8); border-radius: 10px; padding:20px; aspect-ratio: 2 / 1; margin:0 auto; width:100%; max-width: 250px; height: 145px; }
.card_name img { width: 30px; height: 30px; }
.card_name p { font-size: 2rem; font-weight: 700; color: var(--white); }
.qr_myamount { font-size:1.4rem; font-weight: 500; color:#fff; }
.change_wj { font-size:2.6rem; font-weight: 600; word-break: break-all; }
.dan_j { font-size:1.8rem; font-weight: 700; }
.none_pay_j { margin-top:30px; }
.qrtimer_jbox .timer_txt { color:var(--main); }
.underline_qr { text-decoration: underline; }
.num_tqj { margin-top:40px; }
.none_pay_code_j { background: #fff; border-radius: 10px; padding:20px 30px; width:calc(100% - 40px); margin:0 auto; }
.qrnotpay_codenum { background: var(--bg); border-radius: 10px; padding:14px 0; color:#000; font-size:1.8rem; font-weight: 700; font-family: "montserrat"; width:32%; text-align: center; }
.qrnotpay_codenumwrap { display:flex; align-items: center; justify-content: space-between; }
.paymentnumgo_j { display:flex; justify-content: space-between; align-items: center; }
.paymentnumgo_j_go { color:var(--dark); font-size:1.4rem; }
.main_tab_container_j { background: unset !important; }
.fran_payment_jwrap .history_viewbox { background: unset; padding:0; }
.fran_payment_jwrap { width:calc(100% - 40px); margin:0 auto; background: #fff; border-radius: 10px; }
.fran_payment_jwrap .fran_pay_title { padding:30px 0; }
.input_payment_j .position_txt { color:var(--main); }
.fran_pay_info_txt_j { color:#fff; padding:0 20px; display:flex; margin-top:20px; justify-content: center; }
.fran_pay_info_txt_j img { flex:none; margin-right:5px; display: block; }
.fran_pay_info_txt_jtxt { font-size:1.4rem; }
.payamount_confirm_j { background: #fff; border-radius: 10px; width:calc(100% - 40px); margin:0 auto; padding:20px; text-align: center; }
.payamount_confirm_j .confirm_dan { color:var(--main); }
.payamount_confirm_j .seco_j { margin-top:15px; }
.confirm_qrscan_j { background: #1B2B48; margin-top:20px; }
.confirm_qrscan_j .scan_box { border-radius: 10px; }
.confirm_qrscan_j .qr_headertitle { height:auto !important }
.mypaymentamount_j { background: #fff; }
.userpaymnetnum_j { background: #fff; width:calc(100% - 40px); margin:20px auto 0; border-radius: 10px; padding:30px 20px; }
.userpaymnetnum_j .pay_code_input input { border:1px solid var(--gray); background:var(--lightgray); border-radius: 10px; height:50px; text-align: center; font-size:1.8rem; font-weight: 700; color:var(--black); font-family: "montserrat"; width:32%; }
.userpaymnetnum_j .pay_code_input > input:focus { border: 1px solid var(--main); }
.userpaymnetnum_j .pay_code_input input::placeholder { font-size:1.8rem; font-weight: 700; color:var(--gray); font-family: "montserrat"; }
.userpaymnetnum_j .user_qr_pay { overflow: visible; margin-top:10px; border-radius: 10px; }
.userpaymnetnum_j .user_qr_pay button { border-radius: 10px; }
.sender_finbox_j { border-top:2px solid var(--black); border-bottom:2px solid var(--black); }
.sender_finbox_j .sender_finbox { border-top:none; border-bottom:none; }
.sender_finbox_j .p_20 { -webkit-padding-before:20px; -webkit-padding-end:20px; -webkit-padding-after:20px; -webkit-padding-start:20px; padding:20px; }
.sender_paymentamount_j { background: var(--lightgray); border-top:1px solid var(--gray); padding:20px; }
.sender_finbox_j .trading_day { padding:20px; }


@media (max-width:340px){
 .qr_img img { margin:0 auto; width:150px; height:150px; }
 .change_wj { font-size:2rem; }
 .dan_j { font-size:1.4rem; }
 .num_tqj { margin-top: 30px; }
 .num_tq_box_j { height:130px; }

 /* 매출/정산 */}

@media (max-width:300px){
 .qr_img img { margin:0 auto; width:140px; height:140px; }
 .change_wj { font-size:1.6rem; }
 .dan_j { font-size:1.2rem; }
 .num_tqj { margin-top: 20px; }
 .num_tq_box_j { height:100px; }
 }

/* 내 지갑 */
.coin_container { width:100%; padding:10px 20px; border:1px solid var(--fran_inactive); border-radius: 10px; }
.logo_box > img { width: 30px; border-radius: 5px; overflow: hidden; }
.wallet_title_box { position: relative; }
.balance_txt { padding: 10px 0; }
.balance_txt > p { font-size : 2rem; font-weight:700; word-break: break-all; }
.copy_btn { padding: 17px 0 0; }
.copy_btn > img { width: 20px; height:20px; }

/* 내 지갑 상세보기 */
.logo_detail_box > img { margin: 0 auto; width:70px; height:70px; }
.abso_btn { position:absolute; top:20px; right:20px; }
.coin_wallet { padding-top:10px; display:flex; justify-content: space-between; align-items: flex-start; }
.coin_wallet > p { font-size: 1.2rem; font-weight:500; width: calc(100% - 50px); overflow-wrap: break-word; }
.coin_wallet > div > img { width: 20px; height:20px; }
.sender_amount > input { padding: 14px 70px 14px 20px; }
.sender_amount.padding_default > input { padding: 14px 20px 14px 20px; }
.sender_amount > input:focus { border: 1px solid var(--main); }
.sendwallet_infomation > p { padding-top:10px; font-size:1.2rem; text-align: right; }

/* TQ 구매하기 */
.purchase_tax > p { margin-bottom:10px; font-size: 1.6rem; font-weight: 700; }
.info_text { padding: 40px 20px 20px; }
.info_text > p { font-size:1.2rem; font-weight:700; color:var(--red); }
.deal_card { padding: 20px; border: 1px solid var(--line); border-radius: 10px; }
.deal_card_flex { display : flex; align-items: flex-start; justify-content: space-between; }
.deal_card_txt { font-weight: 700; width: 80px; }
.deal_card_hash { width: calc(100% - 90px); text-align: right; }
.deal_card_hash > a { width: 100%; word-break: break-all; }

/*고객 결제하기 */
.customer_payment_wrap { margin:14px 20px 0; border-radius: 10px; background-color:var(--white); box-shadow: 0px 3px 15px rgba(0,0,0,0.06); overflow: hidden; }
.payamount_confirmwrap .input_payment { padding:20px; }
.payamount_confirmwrap .input_paybox p { font-size:1.6rem; font-weight: 700; font-family: "noto_sans"; }
.payamount_confirmwrap .user_amount { position: relative; width: 100%; height: 50px; margin-top: 10px; border-radius: 10px; background-color: #FAFBFA; border: 1px solid var(--gray); font-size: 1.6rem; font-weight: 600; }
.payamount_confirmwrap .user_amount .input_basic { margin-top:0; border:unset; background-color: unset; }
.payamount_confirmwrap .user_amount input::placeholder { font-size: 1.6rem; font-weight:500; }
.payamount_confirmwrap .user_amount > .position_txt { position:absolute; top:50%; right:20px; transform: translateY(-50%); font-size:1.6rem; font-family: "montserrat"; font-weight:700; color:var(--fran); }
.payamount_confirmwrap .choice_num { width:96%; }
.payamount_confirmwrap > .user_bacode_pay { width:100%; border-radius:10px; margin-top:10px; overflow: hidden; }
.payamount_confirmwrap > .user_bacode_pay span { padding-left:40px; }
.payamount_confirmwrap > .user_bacode_pay button::before { top:50%; transform: translateY(-50%); position: absolute; content: ''; background: url('../../assets/img/icon/icon_QR.svg'); width:32px; height:32px; background-position: center; background-repeat: no-repeat; }
.payamount_confirmwrap > .user_bacode_pay button.key_active::before { background: url('../../assets/img/icon/icon_QR.svg'); background-repeat: no-repeat; }
.fran_pay_title { padding: 20px; }
/* .fran_pay_title > p { font-size: 2rem; font-weight:700; text-align: center; } */
/* 2023.03.29 수정 */
.fran_pay_title > p { font-size: 1.8rem; font-weight:700; text-align: center; }
.fran_pay_info_txt { font-size:1.3rem; font-weight: 500; text-align: center; }
.fran_pay_info_txt > p { padding-bottom:5px; }
/* 20230329 추가 */
.qr_input_payment { padding : 20px 20px 30px; }
/* 230509 수정 */
.pay_popup_close_icon { background: transparent; position: absolute; right:20px; top: 20px; }

/* 매출 / 정산 */
.sett_card { padding: 20px; border:1px solid var(--fran_inactive); border-radius:10px; }
.sett_card > div:first-child { border-bottom: 2px solid var(--fran_inactive); }
.sales_status { font-size : 1.4rem; font-weight: 500; padding-top: 20px; }
.sales_status > div > p:first-child { padding-bottom:5px; }
.fran_dset > input { width:80px; text-align: center; font-size: 1.4rem; font-weight: 500; }
.modify_icon { background-color:rgba(0,0,0,0); padding:0; }
.sett_num { padding: 20px 0; font-size: 2.6rem; font-family: "montserrat"; font-weight: 600; text-align: center; }
.sett_num .dan { font-size: 1.8rem; font-family: "montserrat"; font-weight: 700; color: var(--main); }
/* 결제 취소 */
.history_info_txt { display:block; font-size:1.4rem; font-weight:500; text-align: center; color:var(--red); }

/* 정산요청 */
.fran_accumulate_info { background-color: var(--white); position: absolute; border: 1px solid var(--fran); color: var(--fran); padding: 10px; width: 300px; font-size: 1.2rem; font-weight:500; left: 50%; top: 25px; transform: translateX(-50%); z-index: -1; opacity: 0; transition: opacity 300ms linear, z-index 300ms linear; }
.fran_accumulate_info.active { opacity: 1; transition: opacity 300ms linear, z-index 300ms linear; }
.input_btn_label { width:calc(100% - 105px); }
.fran_won_txt { position: absolute; top: 50%; right: 20px; transform: translateY(-50%); font-size: 1.4rem; font-family: "montserrat"; font-weight: 700; color: var(--fran); }
.fran_sett_won { padding: 20px; }
.fran_sett_won input { font-size: 1.4rem; font-weight: 400; width: 100%; padding: 10px 70px 10px 10px; border-radius: 10px; border: 1px solid var(--fran_inactive); }

/* loading */
.loading_box { position: fixed; top:0; left:0; width: 100%; height: 100%; z-index: 10000; background-color: rgba(255,255,255,1); }
.loading_bg { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 10px; z-index: 9920; overflow: hidden; }
.loading_bg img { background-origin: border-box; background-clip: content-box, border-box; width:50px; height: 50px; animation: spin 1s linear infinite; }


/* ATM 출금 */
.withdraw_box > p { font-size:1.2rem; text-align: left; }
.withdraw_container { position: relative; width:100%; padding:40px; border:1px solid var(--fran_inactive); border-radius: 10px; }
.atm_title_box { position: absolute; top: 15px; right: 15px; }
.atm_title_box > p { width:45px; }
.withdraw_time > div { font-size:1.6rem; font-weight: 500; }
.atm_input > input { padding: 14px 70px 14px 20px; margin:0; height: 45px; }

/* 계좌 출금 */
.account_with_box { background-color: var(--lightgray); padding: 0 20px 20px; }
.account_with_btn { padding: 5px 10px; border-radius: 5px; font-family: "noto_sans"; background: var(--main_sub); color: var(--main); }
.sender_amount select { width: 100%; height: 50px; line-height: 50px; padding: 0 20px; border-radius: 10px; border: 1px solid var(--gray); font-size: 1.4rem; font-weight: 400; outline: none; background: #FBFBFB; font-family: "noto_sans"; }
.sender_amount select option[value="all"][disabled] { color:var(--gray); font-size:1.4rem; font-weight: 400; display: none; }
.account_amount input { width: 100%; height: 50px; padding: 14px 20px 14px 20px; border-radius: 10px; border: 1px solid var(--gray); font-size: 1.6rem; font-weight: 600; background: #FBFBFB; }
.account_amount input:focus { border:1px solid var(--main); }

/* 23.07.04 최근 보낸 계좌/아이디 추가 : 남보라 */
.recent_account_box > li { margin-bottom: 10px; }
.recent_account_box > li:last-child { margin:0; }
.recent_account_add { width: 100%; min-height: 60px; border-radius: 10px; font-size: 1.4rem; font-weight: 400; outline: none; background: var(--main_sub); font-family: "noto_sans"; text-align: start; }
.recent_account_add > button { text-align: start; background: transparent; padding: 10px 20px; width: 100%; height:100%; }
.recent_account_add > .account_del { width: max-content; flex:none; min-height: 60px; }
.recent_account_add span { display: block; }
.recent_account_add .name { font-size: 1.6rem; font-weight: 700; }

/* 한줄버튼 23.07.04 :남보라 */
/* .recent_account_box > li { margin-bottom: 10px; }
.recent_account_box > li:last-child { margin:0; }
.recent_account_add { width: 100%; height: 40px; line-height: 40px; padding: 0 20px; border-radius: 10px; font-size: 1.4rem; font-weight: 400; outline: none; background: var(--main_sub); font-family: "noto_sans"; text-align: start; } */

/* 영업 가맹점 관리 */
.salse_listw { padding:10px 20px; border-bottom: 1px solid var(--line); cursor: pointer; }
.salse_listw:hover { background: var(--bg); }
.salse_list { width: 100%; padding: 20px 0; }
.salse_txt_list { position: relative; width: calc(100% - 140px); }
.salse_fran_list > img { transform: rotate(180deg); }
.salse_txt_list p:first-child { font-size: 1.6rem; font-weight: 700; }
.salse_txt_list p { font-size: 1.3rem; font-weight: 400; margin-bottom: 5px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.salse_txt { font-size:1.6rem; font-weight: 500; }

/* 영업 정산 수당 내역 */
.settl_input { width:calc(100% - 50px); border:1px solid var(--fran_inactive); padding:10px; border-radius:10px; }
.settl_input input { width: 100%; }
.settl_btn { flex:none; padding:10px; border-radius: 10px; font-weight: 700; background: #E6F0FE; color: var(--main); }
.settl_width { width: calc(100% - 150px); }
.sales_pd { display: flex; justify-content: space-between; align-items: center; padding: 12px 20px; }

@keyframes spin {
 0% { transform:rotate(0deg); }
 100% { transform:rotate(360deg); }
 }

/* select */
select option[value=""][disabled] { display: none; }

/*230208 신규 클래스 작업 : ATM 출금 : 신정운 */
.fees_box { display:flex; justify-content: space-between; align-items: center; }
.fees_box p { font-size: 1.6rem; font-weight: 700; }
.fees_box p:nth-child(2) { font-size: 1.6rem; font-weight: 500; }
.withdraw_requ { font-size:1.6rem; font-weight: 700; }
.withdraw_fee, .withdraw_total { font-size:1.4rem; font-weight: 500; }
.withdraw_info { text-align: center; font-size:1.3rem; font-weight: 400; padding-bottom:10px; }

.fran_num_tq { padding:30px 0 0; font-size:2.6rem; font-family: "montserrat"; font-weight: 600; text-align: center; }
.fran_dan { font-size:1.8rem; font-family: "montserrat"; font-weight: 700; color:var(--main); }
.fran_total_sisa { font-size:1.4rem; color:var(--dark); font-weight: 500; display: flex; width:100%; word-break: break-all; }
.fran_avg_sisa { font-size:1.2rem; color:var(--dark); margin-top:6px; font-weight: 400; }
.fran_usage_history { background: var(--fran); border-radius: 16px; color:#fff; padding:6px 16px; font-size:1.4rem; font-weight: 500; }
.withdraw_bank { text-align: center; font-size:1.4rem; font-weight: 400; padding-bottom:30px; }
.usage_history { display: block; width:90px; background: #E6F0FE; border-radius: 16px; color: var(--main); padding: 6px 16px; font-size: 1.4rem; font-weight: 500; }

.map_splach { width: 100%; height: 100%; z-index: 99; position: absolute; background-color:white; }
.informap_view { position: absolute; z-index:4; width:100%; height:150px; left:50%; bottom:66px; transform: translateX(-50%); max-width:768px; }
.listmap_fran { position: absolute; width:100%; padding: 0 10px; background:#fff; }
.month_box { text-align: center; width:100%; margin:0 auto; }
.month_box input { font-size: 1.4rem; font-weight: 500; height:40px; padding: 8px; font-family: "montserrat"; border: 1px solid var(--fran_inactive); border-radius: 10px; text-align: center; background: #fff; position: relative; width:100%; max-width:200px; }
.totla_calce .alert_btn > p:first-child { width:auto; }

.total_calcinfo { background-color: var(--white); position: absolute; border: 1px solid var(--fran); color: var(--fran); padding: 10px; width: 210px; font-size: 1.2rem; font-weight: 500; right: 60px; top: 10px; z-index: -1; opacity: 0; transition: opacity 300ms linear, z-index 300ms linear; }
.total_calcinfo.active { opacity:1; transition: opacity 300ms linear, z-index 300ms linear; }
.day_settle { border-right:1px solid #ededed; flex:none; }
.day_settle p { width:50px; padding:20px 0; }
.wallet_box { padding:6px 20px; }
.wallet_height { height:auto; }
.wallet_totalwrap { width: 100%; max-width: 768px; height: 100%; margin: 60px auto 8px; }

.over_auto::-webkit-scrollbar { display:none; }
.over_auto::-webkit-scrollbar-track { display:none; }
.over_auto::-webkit-scrollbar-thumb { display:none; }
.tq_walletbox { padding:15px 20px }
.change_w { word-break: break-all; }
.dis_j { display:inherit !important; }

.store_select_box { width: 100%; height: 40px; }
.store_select_box .scroll_list { display: none; padding: 15px; position: absolute; top: 40px; width: 100%; border: solid 1px var(--fran_inactive); background-color: #ffffff; z-index: 2; }
.classification { font-size: 1.4rem; font-weight:400; }
.wallet_detail_btn { padding: 20px; }

/* GIFT */
.gift_container { position:relative; width:100%; padding: 0px 20px 20px; margin:0 auto; background: white; border-radius: 8px; overflow: hidden; }
/* .gift_container { width: 100%; min-height: 100vh; min-height: 100svh; } */
.gift_info_b { display: flex; align-items: center; background: url(../img/contents/gift/info01.png) top no-repeat; background-size: contain; width:100%; height:100%; aspect-ratio:4/1; }
.gift_info_c { display: flex; align-items: center; background: url(../img/contents/gift/info02.png) top no-repeat; background-size: contain; width:100%; height:100%; aspect-ratio:4/1; }
.gift_info_s { display: flex; align-items: center; background: url(../img/contents/gift/info02.png) top no-repeat; background-size: contain; width:100%; height:100%; aspect-ratio:4/1; }
/* .gift_info span { font-size: 15px; color:#fff; background-color:#000; display:inline-block; width:35px; height:35px; border-radius:10px; font-weight: 700; line-height: 35px; text-align: center; } */
/* .gift_info img { width: 40px; height:40px; object-fit: cover; border:1px solid var(--line); border-radius: 10px; } */
.gift_info_b > p,.gift_info_c > p, .gift_info_s > p { padding:0 20px; margin-left:10px; font-size: 3.2rem; font-weight: 400; }
.gift_icon_box { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; width:100%; }
.gift_icon_box > li { width: calc(100% / 4); text-align: center; }
.gift_box { padding: 20px 0; }
.gift_box > p { font-size: 1.4rem; margin-top: 5px; font-weight: 700; }
/* .gift_icon { margin:0 auto; max-width: 90px; aspect-ratio: 1 / 1; border-radius: 10px; overflow: hidden; border:1px solid var(--line); } */
/* .gift_icon img { width:100%; height:100%; object-fit: cover; } */
.banner_container { width: 100%; height:100%; aspect-ratio: 4 / 1; }
.banner_container img { width: 100%; object-fit: contain; }
.category_list { }
.user_menu_box { align-items: flex-start }
/* 배너 이미지 슬라이드 신규*/
.menu_container { position:relative; width: calc(100% - 40px); padding: 0 0 20px; margin:0 auto; background: white; border-radius: 8px; overflow: hidden; }
.gift_wrap { height: auto; }
.gift_wrap > div { width: 100%; font-size: 18px; font-weight: 700; }
.gift_wrap .swiper-pagination { bottom: 5px; }
.gift_icon { width: 100px; height: 100px; line-height:48px; border: 1px solid var(--line); border-radius:13px; margin:0 auto; overflow: hidden; }
.gift_icon img { width:100%; height:100%; object-fit: cover; }
.gift_wrap > div > img { transition: all 500ms; }
.gift_wrap > div.active > img { transform:rotate(-180deg); }
.gift_wrap .scroll_box { overflow-y:auto; height: 200px; margin:15px 0 }
.gift_wrap .scroll_box li { position:relative; width:100%; height:45px; line-height:45px; font-size: 1.4rem; }
.gift_wrap .scroll_box li:first-child { font-size: 1.4rem; font-weight:700; }
.gift_wrap .scroll_box li a { position:absolute; top:0; left:0; width:100%; padding:0 20px; }
.gift_wrap .scroll_box li:hover { background-color: var(--line); }
/* //배너 이미지 슬라이드 */

/* 선불카드 임시영역 */
.gift_card_list { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 10px; }
.gift_card_list > li { width: 100%; text-align: center; padding: 10px 5px; margin: 10px 0; border:1px solid var(--line); border-radius: 20px; font-size: 1.4rem; font-weight: 700; }
/*// 선불카드 임시영역 */

/* GIFT_Category : 230322 */
.gift_title_container { padding: 0 20px; width:100%; height:60px; display: flex; justify-content: space-between; align-items: center; border-bottom:1px solid var(--line); }
.gift_icon_title { display: flex; align-items: center; width:100%; height:100%; }
.gift_icon_title > div { width: 48px; height:48px; border:1px solid var(--line); border-radius: 12px; overflow: hidden; }
.gift_icon_title > div > img { width:100%; height:100%; object-fit: cover; }
.gift_icon_title > p { font-size: 1.6rem; font-weight: 500; }
/* select box */
.gift_select { position: relative; width: 100%; display: flex; justify-content: flex-end; }
.gift_select select { margin-right: 10px; padding: 10px; text-align-last: right; border: none; font-size: 1.4rem; font-weight: 700; outline: none; -webkit-appearance:none; /* 크롬 화살표 없애기 */ -moz-appearance:none; /* 파이어폭스 화살표 없애기 */ appearance:none; color: var(--dark); }
.gift_select option { color: var(--black); font-family: "noto_sans"; font-size: 1.4rem; }
.gift_select_icon { position:absolute; right:0px; top:50%; transform:translateY(-50%); }

.gift_category_list { padding: 0 14px 20px; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 15px; }
.gift_category_list > li { width:100%; height: 100%; }
.gift_category_list .gift_img { margin-bottom: 8px; border:1px solid var(--line); aspect-ratio: auto 1 / 1; }
.gift_category_list .gift_img img { width: 100%; height: 100%; object-fit: cover; }
.gift_product_info { display: flex; flex-direction: column; justify-content: space-between; width:100%; height:80px; font-size: 1.4rem; font-weight: 400; }
.gift_product_info > div:first-child > p:first-child { color:var(--dark); overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.gift_product_info > div:first-child > p:last-child { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.3; }
.gift_product_info > p { font-size:1.6rem; word-break: break-all; }

/* GIFT_Detail */
.gift_detail_img { aspect-ratio: auto 1 / 1; overflow: hidden; }
.gift_detail_img img { width: 100%; height:100%; object-fit: cover; }
.gift_detail_title { width:100%; height:100%; min-height:170px; display:flex; justify-content: space-between; flex-direction: column; }
.gift_detail_title > div:first-child > p:first-child { color:var(--dark); font-size: 1.4rem; word-break: break-all; }
.gift_detail_title > div:first-child > p:last-child { font-size: 2rem; font-weight: 500; word-break: break-all; }
.gift_detail_title .product_num { width: 116px; display: flex; justify-content: space-between; align-items: center; border:1px solid var(--line); }
.gift_detail_title .product_num button { display: flex; justify-content: center; align-items: center; width:36px; height: 36px; background-color: #fff; text-align: center; }
.gift_detail_title .product_num button:first-child { border-right:1px solid var(--line); }
.gift_detail_title .product_num button:last-child { border-left:1px solid var(--line); }
.gift_detail_title .product_num input { width: 46px; height: 36px; line-height: 36px; text-align: center; font-size: 1.6rem; font-weight: 700; }
/* gift tab */
.gift_tab { width: 50%; height:50px; line-height: 50px; text-align: center; border-bottom: 1px solid var(--line); cursor: pointer; font-size: 1.6rem; font-weight: 500; color: var(--darkgray); }
.gift_tab p { width:max-content; margin:0 auto; height:calc(100% + 1px); font-size: 1.6rem; font-weight: 500; }
.gift_tab .g_active { border-bottom: 2px solid var(--main); color: var(--main); }

.gift_detail_pro_info { width: 100%; }
.gift_detail_pro_info > .pro_info_one,.gift_detail_pro_info > .gift_use_info { padding:20px; }
.gift_detail_pro_info > .pro_info_one > p, .gift_detail_pro_info > .gift_use_info > p { line-height: 1.6; }

.gift_detail_more_info { width:100%; }
/* accor_tit */
.gift_accor_tit { cursor: pointer; font-weight: 400; background-color: var(--outside); height: 60px; padding: 0 20px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.gift_accor_tit > span { font-size : 1.6rem; }
.gift_accor_tit.active .arrow { transform: rotate(180deg); }
.gift_accor_tit.active+.gift_accor_cont { display: block; }
.gift_accor_cont { display: none; padding: 20px; background-color: var(--lightgray); border-bottom: 1px solid var(--line); }
.gift_accor_title { font-size: 1.4rem; font-weight: 700; word-break: keep-all; }
.gift_accor_sub_title { font-size: 1.4rem; font-weight: 400; word-break: keep-all; }

/* GIFT_total_tab */
.gift_go_tab_box { position:sticky; position: -webkit-sticky; top:50px; z-index: 33; background: var(--white); }
.gift_go_tab { width: 100%; height: 42px; line-height: 42px; text-align: center; border-bottom: 1px solid var(--line); cursor: pointer; font-size: 1.6rem; font-weight: 500; color: var(--darkgray); }
.gift_go_tab p { width:max-content; margin:0 auto; height:calc(100% + 1px); font-size: 1.6rem; font-weight: 500; }
.gift_go_tab .g_active { border-bottom: 2px solid var(--main); color: var(--main); }

/* GIFT_ POPULA_GIFTS */
.popular_gifts { padding:20px; }
.popular_list > div > div { width: 100%; height: 229px; background: pink; }
.popular_list { overflow: hidden; }

.popular_list .popular_gift_img { margin-bottom: 8px; border:1px solid var(--line); aspect-ratio: auto 1 / 1; }
.popular_list .popular_gift_img img { width: 100%; height: 100%; object-fit: cover; }
.popular_list .gift_popular_info { display: flex; flex-direction: column; justify-content: space-between; width:100%; height:80px; font-size: 1.4rem; font-weight: 400; }
.popular_list .gift_popular_info > div > p:first-child { color:var(--dark); overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.popular_list .gift_popular_info > div > p:last-child { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.popular_list .gift_popular_info > p { font-size:1.6rem; }

/* 230327 GIFT PRODUCT_BUY */
.gift_buy_item, .gift_buy_send { padding: 20px; }
.gift_buy_item img { width: 80px; height:80px; }
.gift_buy_send button { width: 100%; height:50px; border-radius: 10px; overflow: hidden; background: var(--inactive); }
.gift_buy_send button.active { background: var(--main); color:var(--white); }
.gift_buy_button p { font-size: 1.6rem; font-weight: 500; line-height: 1.6; }
.text_error { display: block; font-size: 1.2rem; font-weight: 400; margin-top: 10px; color: red; }

/* 받는사람 아이디 클릭시 추가되는 div */
.gift_num_box > div { width: 100%; }
.gift_num_box > div > div:first-child { width: 35%; }
.gift_num_box > div > div:last-child { width: 65%; }

/* GIFT INPUT 추가 */
.gift_name_input { position: relative; }
.gift_name_input .input_basic { margin-top:0; }
.gift_name_input > input { padding: 14px 20px 14px 20px; font-size: 1.6rem; font-weight: 500; }
.gift_name_input > input:focus { border: 1px solid var(--main); }
.gift_name_input input::placeholder { font-size: 1.4rem; font-weight:500; text-align: left; }

.gift_phone_input { position: relative; width:100%; }
.gift_phone_input .input_basic { margin-top:0; }
.gift_phone_input > input { padding: 14px 20px 14px 20px; font-size: 1.6rem; font-weight: 500; }
.gift_phone_input > input:focus { border: 1px solid var(--main); }
.gift_phone_input input::placeholder { font-size: 1.4rem; font-weight:500; text-align: left; }

.gift_product_input { }
.gift_product_input > input { width: 100%; height: 40px; padding: 0 20px; border-radius: 10px; font-size: 1.6rem; font-weight: 600; text-align: right; }


/* GIFT MESSAGES */
/* GIFT TEXTAREA 추가 */
.gift_buy_messages { padding: 20px 20px 10px; }
.gift_area_box { width: 100%; height: 100px; padding: 15px 20px 40px; border: 1px solid var(--gray); font-family: "noto_sans"; font-size: 1.4rem; font-weight: 500; resize: none; border-radius: 10px; background: var(--lightgray); }
.gift_area { width: 100%; height: 100%; border: none; font-family: "noto_sans"; font-size: 1.6rem; font-weight: 500; resize: none; background: var(--lightgray); }
.gift_area::placeholder { font-family: "noto_sans"; font-size: 1.4rem; font-weight: 500; color: var(--gray); }

.gift_id_box { position: relative; }
.gift_search_input > button { width: 24px; height: 24px; background: none; position: absolute; top: 60%; right: 10px; transform: translate(-10px,-50%); }
.gift_product_box { position:absolute; top:60px; width: 100%; margin-top:10px; padding: 14px 20px; border-radius: 10px; background: var(--lightgray); border:1px solid var(--gray); z-index: 55; }
.gift_product_list { height:132px; overflow-y:scroll; }
.gift_product_list > li { padding:5px 0; cursor: pointer; }

.receive_user { padding: 10px 20px; }
.gift_search_input input:focus { border: 1px solid var(--main); }

/* 2023.03.31 GIFT_PRODUCT_PAYMENT */
.gift_payment_check { padding: 10px 20px; }
.gift_send_user_list > li { font-size: 1.6rem; font-weight: 500; font-family: "montserrat"; padding: 10px 0; }
.gift_send_user_list > li:first-child { padding: 0 0 10px; }
.gift_send_user_list > li:last-child { padding: 10px 0 0; }
.gift_send_user_list > li::before { content: '•'; margin-right: 5px; }
.gift_send_phone_list > li { font-size: 1.6rem; font-weight: 500; padding: 10px 0; }
.gift_send_phone_list > li:first-child { padding: 0 0 10px; }
.gift_send_phone_list > li:last-child { padding: 10px 0 0; }
.gift_send_phone_list > li::before { content: '•'; margin-right: 5px; }
.gift_payment_total { padding: 20px; border:1px solid var(--main); border-radius: 10px; background: var(--main_sub); }
.gift_all_null { padding: 60px 0 0; text-align: center; width:100%; height: 100%; }
.gift_border_line { border-bottom: 1px solid var(--main); padding-bottom: 10px; margin-bottom: 10px; }
.point_card_color { background: linear-gradient(to bottom right, #B6359C, #EF0A6A); }


/* 결제조건 확인 230419 kms 수정 */
/* .gift_pay_chk input[type="checkbox"] { display: none; } */
.gift_pay_chk p { font-size: 1.4rem; font-weight: 500; background: url(../img/layout/svg/icon_check_on.svg) no-repeat 0 0 / 20px 20px; padding-left: 25px; }
/* .gift_pay_chk input[type="checkbox"]:checked + label { background: url(../img/layout/svg/icon_check_on.svg) no-repeat 0 0 / 20px 20px; cursor: pointer; } */

/* 230331 kms 선물하기 */
.gift_comp_bg_box { display: flex; align-items: center; justify-content: center; flex-direction: column; background: url(../img/contents/gift/bg_gift_comp.png) no-repeat; background-size: contain; aspect-ratio: 7 / 3; }
.gift_comp_box { padding: 30px 40px; margin: 0 20px; display: flex; flex-direction: column; justify-content: center; align-items: center; background-color: var(--white); border-radius: 10px; box-shadow: 0px 3px 15px rgba(0,0,0,0.06); }
.gift_comp_box img { width: 166px; height: 166px; }


/* 23.04.04 GIFTBOX_AVAILABLE */
.gift_available_width { max-width: 375px; margin:0 auto; }
.gift_comp_bg_box { display: flex; align-items: center; justify-content: center; flex-direction: column; background: url(../img/contents/gift/bg_gift_comp.png) no-repeat; background-size: contain; aspect-ratio: 7 / 3; }
.giftbox_comp_box { padding: 30px 40px; margin: 0 20px; display: flex; flex-direction: column; justify-content: center; align-items: center; background-color: var(--white); border-radius: 10px; box-shadow: 0px 3px 15px rgba(0,0,0,0.06); }
.giftbox_comp_box img { width: 166px; height: 166px; }

/* 230419 kms GIFTBOX_AVAILABLE 사용완료 수정 */
.giftbox_comp_box .gift_img { position: relative; margin-bottom: 8px; border: 1px solid var(--line); aspect-ratio: 1/1; }
.giftbox_comp_box .used_up_bg { display: flex; justify-content: center; align-items: center; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3); }
.giftbox_comp_box .used_up_bg p { font-size: 1.4rem; font-weight: 700; color: #fff; }

.giftbox_top_count { display: flex; align-items: center; background: url(../img/contents/gift/giftbox_ava_bg.png) top no-repeat; background-size: cover; width:100%; height:100%; aspect-ratio:4/1; }
.giftbox_top_count > p { padding:0 20px; margin-left:10px; font-size: 3.2rem; font-weight: 400; }

.giftbox_product_list { padding: 0 14px 20px; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 15px; }
.giftbox_product_list > li { width:100%; height: 100%; }
.giftbox_product_list .gift_img { position: relative; margin-bottom: 8px; border:1px solid var(--line); aspect-ratio: auto 1 / 1; }
.giftbox_product_list .gift_img > p { padding:4px 10px; position: absolute; left:10px; top:10px; background: #222222; font-family: "montserrat"; font-weight: 600; font-size: 1.2rem; color: var(--white); border-radius: 5px; }
.giftbox_product_list .gift_img .used_up_bg { display: flex; justify-content: center; align-items: center; position:absolute; left: 0; top: 0; width: 100%; height:100%; background: rgba(0,0,0,0.3); }
.giftbox_product_list .gift_img .used_up_bg p { font-size: 1.4rem; font-weight: 700; color:var(--white); }
.giftbox_product_list .gift_img img { width: 100%; height: 100%; object-fit: cover; }

.giftbox_product_info { display: flex; flex-direction: column; justify-content: space-between; width:100%; min-height:100px; font-size: 1.4rem; font-weight: 400; }
.giftbox_product_info > div:last-child > p { word-break: break-all; }
.giftbox_product_info > div:first-child > p:first-child { color:var(--dark); overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.giftbox_product_info > div:first-child > p:last-child { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.gift_barcode { margin-top:20px; width: 100%; max-width: 255px; height: 60px; overflow: hidden; }
.gift_barcode svg { width:100%; object-fit: contain; }
.gift_barcode svg g { transform: translate(10px, 0px); }
.gift_barcode img { width:100%; height: 100%; object-fit: contain; }
.gift_copycode_box img { width:20px; height:20px; object-fit: contain; }

.giftbox_messages { padding: 20px; }
.giftbox_messages > p { font-size: 16px; font-weight: 700; }
.giftbox_messages .giftbox_messages_card { padding:20px; background: var(--white); border-radius: 10px; box-shadow: 0px 3px 15px rgba(0,0,0,0.06); }

.gift_copy_box { opacity: 0; transition:2s; position:fixed; bottom:40px; left:50%; transform: translateX(-50%); display: flex; justify-content: flex-start; align-items: center; padding: 15px 20px; width: 100%; max-width: 335px; background: var(--main_sub); border-radius: 10px; box-shadow: 0px 3px 15px rgba(0,0,0,0.06); }
.gift_copy_box.active { opacity: 1; }

/* 23.04.20 GIFT_HISTORY */
.gift_history_null { padding: 60px 0 0; text-align: center; width:100%; height: 100%; min-height: calc(100vh - 436px); min-height: calc(100svh - 436px); background: var(--white); }
.gift_history_null img { margin : 0 auto; width: 83px; height:100px; }
.gift_history_null button { padding: 14px 50px; background: var(--main); color:var(--white); border-radius: 10px; font-size: 1.6rem; font-weight: 700; }
.gift_date_check_box { width:100%; height:50px; }
.gift_date_check { display: flex; justify-content: flex-start; align-items: center; width:100%; max-width: 768px; border-bottom: 1px solid var(--line); padding: 7px 20px; background: var(--white); }
.gift_date_check > p { margin-right: 10px; }
.gift_date_check .gift_dset { position: relative; }
.gift_date_check .gift_dset input { cursor: pointer; width: 125px; text-align: center; background: var(--inactive); font-size: 1.4rem; font-weight: 500; padding: 9px 34px 9px 10px; border-radius: 10px; border:none; font-weight: 600; }
.gift_date_check .gift_demi { font-weight: 700; font-size: 1.4rem; margin: 0 5px; }
.gift_cal { cursor: pointer; position:absolute; right: 10px; top:50%; transform: translateY(-50%); }
.gift_history_cardbox { padding: 20px 20px 10px; height: auto; background: var(--bg); }
.gift_history_date > p { margin-bottom: 12px; font-size: 1.6rem; }
.gift_history_card { width: 100%; height: 100%; margin:0 auto; background: var(--white); border-radius: 10px; box-shadow: 0px 3px 15px rgba(0,0,0,0.06); margin-top: 8px; }
.gift_history_card:first-child { margin-top: 0; }
.gift_history_card:last-child { margin-bottom: 20px; }

/* 23.04.21 GIFT_HISTORY_DETAIL */
.gift_detail_cardbox { min-height: calc(100vh - 100px); min-height: calc(100svh - 100px); height: auto; background: var(--bg); }
.gift_detail_container { position: relative; width: 100%; margin: 10px auto 0; background: var(--white); border-radius: 8px; overflow: hidden; box-shadow: 0px 3px 15px rgba(0,0,0,0.06); }
.gift_detail_acc_txt { width: 100%; cursor: pointer; position: relative; padding: 18px 20px; border-bottom: 1px solid var(--line); background-color: var(--white); }
.gift_detail_acc_txt:after { background-position: center; background-image: url(../img/icon/icon_arrow_down.svg); background-repeat: no-repeat; display: inline-block; width: 16px; height: 16px; content: ""; position: absolute; top: 50%; right: 20px; transform: translateY(-50%); }
.gift_detail_acc_txt.active:after { background-image: url(../../assets/img/icon/icon_arrow_up.svg); content: ""; }

.gift_checkbox input[type="checkbox"] { display: flex; justify-content: center; align-items: center; border-radius: 4px; border:2px solid var(--gray); cursor: pointer; padding:0; width:18px; height:18px; background: var(--white); }
.gift_checkbox input[type="checkbox"]:disabled { background: var(--inactive); border:none; }
.gift_checkbox input[type="checkbox"]:checked { color: #fff; background: url("../img/icon/icon_chk_white.svg") no-repeat 50% 50% / 12px 12px; background-color: var(--main); border:none; }

.gift_cancel_btn { background: var(--inactive); width:100%; height: 40px; line-height: 40px; text-align: center; border-radius: 10px; font-size: 1.6rem; font-weight: 500; font-family: 'noto_sans'; }
.gift_small_btn { background: var(--main_sub); padding:10px 15px; width:max-content; height: 40px; text-align: center; border-radius: 10px; font-size: 1.4rem; font-weight: 500; font-family: 'noto_sans'; color:var(--main); }

.gift_history_detail_date { margin-bottom: 20px; }
.gift_history_detail_date:last-child { margin-bottom: 0; }
.gift_detail_messages { background-color:var(--white); }
.gift_detail_messages .gift_payment_check { min-height:100px; }
.gift_detail_acc_btn { position: absolute; width: 55px; height: 55px; right: 0; z-index: 33; }
.gift_detail_acc { border-top: 1px solid var(--line); }
.gift_detail_acc:first-of-type { border : none; }
/* 이용가이드 */
.guide_tab_container { width:100%; height: 64px; }
.guide_tab_box { position:fixed; width:100%; max-width: 768px; background: var(--white); z-index:33; }
.guide_tab { width:100%; text-align: center; padding:24px 0 14px; border-bottom:2px solid var(--line); cursor:pointer; font-size: 1.6rem; font-weight: 500; color:var(--darkgray); }
.g_active { border-bottom:2px solid var(--main); color:var(--main); font-weight:700; }
/* tab_btn */
.tab_btn { background-color: var(--outside); padding: 13px 0; font-size: 1.6rem; font-weight: 700; cursor: pointer; display: block; text-align: center; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.tabbox li:last-child .tab_btn { border-right: none; }
.tab_btn.on { background-color: var(--dark); color: var(--on); border-right: none; }

/* tab_cont */
.tab_cont { position: absolute; top: 100%; left: 0; width: 100%; display: none; }
/* accor_tit */
.accor_tit { cursor: pointer; font-weight: 700; background-color: var(--outside); height: 60px; padding: 0 20px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.accor_tit > span { font-size : 1.6rem; }
.accor_tit.active .arrow { transform: rotate(180deg); }
.accor_tit.active+.accor_cont { display: block; }
/* accor_cont */
.accor_cont { display: none; padding: 20px; background-color: var(--inside); border-bottom: 1px solid var(--line); }
.img { position: relative; width: 100%; max-width: 500px; margin:20px auto; background-color: lightgrey; display: block; border: 1px solid var(--line); }
.img > p { position: absolute; left: -10px; top: -10px; width: 30px; height: 30px; line-height: 30px; font-size: 1.4rem; font-weight: 700; text-align: center; background: red; border-radius: 50%; color: var(--white); }
.img video, .img img { width: 100%; height: 100%; display: block; }

.accor_title { font-size: 2rem; font-weight: 700; }
.accor_sub_title { font-size: 1.8rem; font-weight: 500; }
.accor_txt { font-size: 1.6rem; font-weight: 400; word-break: keep-all; }
.guide_link_txt { font-size: 1.6rem; font-weight: 500; color:var(--main); }

/* 기본사이즈 INPUT 추가 */
.normal_input { position: relative; }
.normal_input .input_basic { margin-top:0; }
.normal_input > input { font-family: "noto_sans"; padding: 14px 20px 14px 20px; font-size: 1.6rem; font-weight: 500; }
.normal_input > input:focus { border: 1px solid var(--main); }
.normal_input input::placeholder { font-size: 1.4rem; font-weight:500; text-align: left; }

/* 계좌 충전하기 */
.charge_txt { padding: 30px 20px; }
.account_btn { font-family: "noto_sans"; width:calc(100% - 80px); height:50px; background:var(--inactive); color:var(--black); font-size:1.6rem; font-weight: 500; border-radius: 10px; padding:14px 0; }
.account_charge_bank_info { border: 1px solid var(--line); margin: 0 20px; padding: 10px 20px; border-radius: 10px; }
.account_charge_bank_info button { background: transparent; }
.account_charge_bank_info button img { width: 20px; height:20px; }

/* 230411 추천하기 추가 */
.referral_tit { padding: 30px 20px 0; text-align: center; }
.referral_tit p:first-child { font-size: 3.8rem; line-height: 1.2; }
.referral_tit p:last-child { font-size: 1.6rem; }

.referral_box { position: relative; padding: 0 20px 20px; }
.referral_box img { width:100%; max-width: 620px; height:100%; max-height: 430px; object-fit: contain; aspect-ratio: 6 / 5; margin: auto; }
/* .referral_box button { background-color: var(--black); } */

.referral_box_card { margin:20px 20px 0; padding: 14px 20px; background: var(--white); border-radius: 10px; }
.referral_info li { display: flex; align-items: stretch; }
.referral_num { display: block; width: 21px; height: 21px; display: flex; justify-content: center; align-items: center; background: #89949C; font-size: 1.2rem; font-weight: 600; font-family: "montserrat"; border-radius: 50%; color:var(--white); }
.referral_info li { font-size: 1.4rem; font-weight: 500; }

.referral_fri_card { display: flex; justify-content: space-between; align-items: center; padding: 14px 20px; background: var(--white); border-radius: 10px; width: calc(100% - 40px); margin: 10px auto 0; }

/* 230420 친구초대 추가 kms */
/* .referral_receive_section_top { background-color: #C5D6F4; } */
.referral_receive_section { background-color: #EBF3FE; padding: 42px 20px 50px; }

.referral_receive_img img { width: 100%; max-width: 370px; margin:0 auto; }
.referral_receive_card { text-align: center; background-color: var(--lightgray); padding: 14px 20px 20px; border-radius: 10px; }
.referral_receive_card p:last-child { line-height: 1.7; }

.referral_receive_col { margin-top: 28px; display: flex; gap: 10px; }
.referral_receive_col_card { display: flex; flex-direction: column; align-items: center; padding: 24px 20px; background-color: var(--lightgray); border-radius: 10px; flex: 1; gap: 10px; }
.referral_receive_col_card > span:first-child { background-color: #ebebeb; width: 80px; height: 80px; aspect-ratio: 1/1; border-radius: 50%; display: block; overflow: hidden; }
.referral_receive_col_card > span:first-child > img { width: 100%; height: 100%; object-fit: cover; }

.referral_tq_btn { border-radius: 10px; background-color: var(--main); padding: 10px 12px; color: var(--white); }

footer.referral_receive_footer { padding-bottom: 120px; background-color: #F4F4F4; }
.referral_receive_info { background-color:var(--lightgray); padding: 20px; font-size: 14px; }
.referral_receive_info p:nth-of-type(1) { display: flex; align-items: center; gap: 5px; }

/* 23.04.25 매출정산 SETTLEMENT NBR */
.settle_date_box { padding: 40px 20px; text-align: center; background-color: var(--lightgray); }
.settle_date_box p { font-size: 2rem; font-weight: 700; font-family: "montserrat"; }
.settle_date_check { display: flex; justify-content: flex-start; align-items: center; width: 100%; max-width: 768px; border-bottom: 1px solid var(--line); background: var(--white); }
.settle_date_check_box { width:100%; height:50px; }
.settle_date_check { display: flex; justify-content: flex-start; align-items: center; width:100%; max-width: 768px; border-bottom: 1px solid var(--line); padding: 7px 20px; background: var(--white); }
.settle_date_check .gift_dset { position: relative; }
.settle_date_check .gift_dset input { cursor: pointer; width: 125px; text-align: center; background: var(--inactive); font-size: 1.4rem; font-weight: 500; padding: 9px 34px 9px 10px; border-radius: 10px; border:none; font-weight: 600; }
.settle_date_check .gift_demi { font-weight: 700; font-size: 1.4rem; margin: 0 5px; }
.settle_container { padding: 20px; min-height: calc(100svh - 247px); height:100%; background-color:var(--main_sub); }
.settle_container .card { width:100%; background-color:var(--white); border-radius: 10px; box-shadow: 0px 3px 15px rgba(0,0,0,0.06); }
.settle_container .card .settle_list_title { font-size:1.6rem; font-weight: 700; padding: 14px 20px; }
.settle_container > .card > ul > li { padding: 20px 0; }
.settle_container > .card > ul > li > p { font-size: 1.4rem; font-weight: 500; }
.settle_container > .card > ul > li > div > p, .settle_container > .card > ul > li > div > span { font-family: "montserrat"; font-size: 1.6rem; font-weight: 700; }
/* SETTLEMENT_TOTAL_TAB */
.settle_tab_box { position:sticky; position: -webkit-sticky; top:50px; z-index: 33; background: var(--white); }
.settle_tab { width: 100%; height: 42px; line-height: 42px; text-align: center; border-bottom: 1px solid var(--line); cursor: pointer; font-size: 1.6rem; font-weight: 500; color: var(--darkgray); }
.settle_tab p { width:max-content; margin:0 auto; height:calc(100% + 1px); font-size: 1.6rem; font-weight: 500; }
.settle_tab .g_active { border-bottom: 2px solid var(--main); color: var(--main); }
.sales_settle_month_box { height: 50px; }
.sales_settle_month_box .month { text-align: center; width:max-content; margin:0 auto; position: relative; }
.sales_settle_month_box .month input { font-size: 2rem; font-weight: 700; height:50px; font-family: "montserrat"; text-align: center; background: #fff; position: relative; width:100%; max-width:max-content; text-align: left; }
.sales_settle_month_box .month .month_img { position: absolute; top:18px; right: 3px; }
/* .sales_settle_month_box .month .month_img { position: absolute; top:50%; right: 0; transform: translateY(-50%); } */
.day_sales_settle { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 20px 20px 10px; background: var(--white); }


/* 23.04.26 TQ ATM 출금(tq_atm_withdraw) : KMS */
.tq_atm_withdraw_cont .gift_go_tab_box { position: static; }
.tq_atm_withdraw_cont .send_input_box.first_pd { padding: 22px 20px 0; }
.tq_atm_withdraw_cont .cont_desc { position: relative; }
.tq_atm_withdraw_cont .cont_desc:before { content: '*'; position: absolute; left: -10px; top: 2px; }
.send_input_box input:disabled { border: none; color: var(--black); }

.tq_atm_num_box { height: 120px; border-radius: 10px; position: relative; }
.tq_atm_num { letter-spacing: 6px; white-space: nowrap; font-size: 3.2rem; font-weight: 600; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.reissue_btn { cursor: pointer; top: 14px; right: 14px; position: absolute; font-size: 1.4rem; color: var(--main); display: flex; align-items: center; gap: 4px; }

.tq_atm_withdraw_cont .btn_fixed_box_txt .tq_send_info_txt { padding: 0; gap: 5px; }

.tq_atm_txt_box { margin-top: 22px; }
.tq_atm_txt_box p:last-child { color: var(--dark); margin-top: 12px; position: relative; margin-left: 10px; }
.tq_atm_txt_box p:last-child::before { content: '*'; position: absolute; left: -10px; top: 2px; }

/* 23.04.26 TQ 보내기(tq_charge_deposit) : KMS */
.tq_charge_deposit .tq_send_info_txt_red { padding: 0; }
.tq_charge_info_box { padding: 22px 20px; background-color: var(--lightgray); border-radius: 10px; }
.tq_charge_info_box li { margin-bottom: 12px; }
.tq_charge_info_box li:last-child { margin: 0; }

.tq_popup_cont .pop_contxt { padding: 30px 0; }
.tq_popup_cont .pop_contxt .pop_title { padding: 0; }
.pop_textarea { margin-top: 20px; text-align: center; font-size: 1.4rem; }

/* 23.04.26 매출/정산(settlement) : KMS */
.settle_list { padding: 0 20px; }
.settle_list > div { padding: 16px 0; width: 100%; }
.text_wait { color: #f2bd00; }
.settle_list div:first-child { gap: 28px; }
.settle_list div:last-child { gap: 4px; }
/* .settle_list div:last-child p { margin-bottom: 3px; } */
.settle_status { margin-bottom: 3px; margin-left: 3px; }

.tq_settlement_title { padding: 20px 20px 10px; }
.tq_settle_month_box input { height: 50px; border: none; border-radius: 0; font-size: 2rem; font-weight: 700; padding: 12px 0; display: flex; justify-content: center; }
.tq_settle_input input { width: auto; }
.tq_settlement_date { height: 50px; padding: 0 20px; }

/* 23.05.09 충전 현황 : KMS */
.tq_charge_history_wrap { font-size: 1.6rem; padding: 14px 20px; background-color: var(--lightgray); }
.tq_charge_history_box { background-color: #F2F7FE; border: 1px solid var(--main); border-radius: 10px; padding: 20px; }
.tq_charge_history_box li { display: flex; justify-content: space-between; }
.tq_charge_history_box li+li { margin-top: 10px; }
.tq_charge_copy_btn { font-size: 1.4rem; font-weight: 500; color: #fff; background-color: var(--main); border-radius: 10px; padding: 5px 10px; font-family: 'noto_sans'; }

.qr_popup_close_btn { width: 30px; height: 30px; position: absolute; right: 20px; top: 20px; background: transparent; }
.qr_popup_close_btn > img { width:100%; height:100%; }
.qr_popup_close_btn + img { margin: 0 auto; }

/* 23.11.16 광고 추가 남보라 */
.ad_view_box {background: var(--white); position: sticky; top:50px; }
.ad_rp_box { margin-bottom: 14px; padding: 0 20px; }
.ad_rp_box img { width: 24px; height: 24px; flex:none; }

.ad_rp_detail_box {  }
.ad_rp_detail_box img { width: 24px; height: 24px; flex:none; }
.ad_view_list > p { color:var(--darkgray); }
.ad_list_box > li { padding:14px; background: var(--white); border-radius: 10px; margin-bottom: 14px; }
.ad_list_box > li:last-child { margin: 0; }
.ad_small_btn { padding:3px 12px; font-size: 1.4rem; font-weight: 500; border-radius: 15px; font-family: 'noto_sans'; }
.ad_small_btn.join { background: #E6F0FE; color: #1162F8; }
.ad_small_btn.download { background: #FFEDF3; color: #EB618F; }
.ad_small_btn.open { background: #DEF2F1; color: #1D9690; }
.ad_small_btn.connect { background: #EBEAF8; color: #4D4DFF; }
/* search 바로 아래있는 스크롤 */
.ad_list_slider { overflow-x:auto; display: flex; padding-left: 20px; }
/*스크롤바의 색상*/
.ad_list_slider::-webkit-scrollbar-thumb { background-color: #ededed; border-radius: 3px; }
/*스크롤바 트랙 색상*/
.ad_list_slider::-webkit-scrollbar-track { background-color: var(--white); }
/*스크롤바의 색상*/
.ad_list_slider::-webkit-scrollbar { height:0px; }
/* .list_slider::-webkit-scrollbar-thumb { background-color: #fff; border-radius: 20px; } */
.ad_list_slider::-webkit-scrollbar-thumb { background: var(--main); }
/*스크롤바 트랙 색상*/
.ad_list_slider::-webkit-scrollbar-track { background-color: var(--main_sub); }
.ad_list_slider li { padding:6px 10px; margin-right:8px; color: var(--fran_inactive); font-size:1.4rem; white-space: nowrap; border:1px solid var(--fran_inactive); border-radius: 20px; cursor:pointer; }
.ad_list_slider li.list_active { background:var(--black); color:var(--white); border:none !important; }

.ad_details_box { padding: 20px; background: linear-gradient(var(--main_sub), var(--white)); }
.ad_details_img_box { max-width: 240px; max-height: 240px; margin:0 auto; }
.ad_details_img_box img{ width: 100%; height: 100%; object-fit: cover; }
.rp_poin_box { background: var(--inactive); padding: 16px 20px; border-radius: 10px; }
.ad_details_text_box { background: var(--white); padding: 30px 20px; }
.ad_details_text_box > li { margin-bottom: 22px; }
.ad_details_text_box > li:last-child { margin-bottom: 0; }
.ad_details_info_text { padding: 30px 20px 130px; }
.ad_link_txt { font-size: 1.4rem; font-weight: 400; color:var(--main); text-decoration: underline; text-underline-offset : 5px; }

/* 2024.02.22 가상계좌 등록 추가 : 남보라 */
.line_btn { padding:0 20px; width:100%; border-radius: 10px; height:65px; font-size:1.6rem; text-align: left; background: #FBFBFB; border: 1px solid var(--gray); color:var(--black); font-weight:500; font-family: "noto_sans"; }
.line_btn.active { border:1px solid var(--main); }
.line_btn img{ width: 35px; height:35px; }

/* 남보라 : 가상계좌 등록 추가 */
.tq_charge_virtual_wrap { font-size: 1.6rem; padding: 7px 20px; }
.tq_charge_virtual_box { background-color: #F2F7FE; border: 1px solid var(--main); border-radius: 10px; padding: 14px; }
.tq_charge_virtual_box li { display: flex; justify-content: space-between; }
.tq_charge_virtual_box li.img { width: 100%; margin-bottom: 0; }
.tq_charge_virtual_box li.img img { width: 100%; height: 100%; object-fit: contain; margin:0; }
.tq_charge_virtual_box li+li { margin-top: 10px; }
.tq_charge_copy_btn { font-size: 1.4rem; font-weight: 500; color: #fff; background-color: var(--main); border-radius: 10px; padding: 5px 10px; font-family: 'noto_sans'; }

/* 2024.04.08 남보라 : 가상계좌 내용 추가 */
.tq_vir_info { padding : 0 20px; margin-top:20px;}
.tq_vir_info h2 { font-size: 16px; font-weight:700; }
.tq_vir_info > ul { padding: 14px 16px; margin: 10px 0; background: var(--line_gray); border-radius: 10px; }
.tq_vir_info > ul > li { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.tq_vir_info > ul > li:last-child { margin:0; }
.tq_vir_info > ul > li > p { font-size: 1.6rem; font-weight: 500; color: var(--sub); }
.tq_vir_info > ul > li > span { font-size: 1.6rem; font-weight: 400; }
.tq_vir_info > p { display: flex; font-size: 12px; font-weight: 400; color: var(--sub); }
.tq_vir_info > p:nth-child(3) { margin-bottom: 12px; }
.tq_vir_info > p::before { content: '* '; display: block; width: 8px; height: auto; margin-right: 2px; }


/* 240507 신정운 - 클래스 추가 및 변경작업 (tq ai 광고 )*/
.box_height_new {  min-height: calc(100vh - 120px); min-height: calc(100svh - 120px); height: auto; background: var(--white);}
.box_height_button {  min-height: calc(100vh - 150px); min-height: calc(100svh - 150px); height: auto; background: var(--white);}
/* .reward_top_wrap {background:#EFEFEF; width:100%; padding:32px 24px 24px;} */
.reward_wbox {background: var(--white); border-radius: 4px;}
.no_data_txt {padding:26px 27px; border-radius: 4px; text-align: center; margin-bottom:8px;}
.no_data_txt p {color:var(--black); font-size:15px; font-weight: 400; margin-bottom:8px;}
.no_data_txt span {color:#777; font-size:12px; font-weight: 400;}
.link_generate { display: flex; justify-content: center; align-items: center;  gap:12px;}
.link_generate span {font-size:16px; font-weight: 500; display: inline-block; color:var(--white);  }
.franchise_txt_list p.count_num {color:#777; font-size:14px; font-weight: 400;}
.not_cursor {cursor:inherit;}
.franchise_txt_list > div > p:last-child.reward_txt {color:var(--black); margin-bottom:0;}
.reward_img_box {height:100%;}
.reward_data_box {display: flex; align-items: center; justify-content: space-between; padding:14px 14px 14px 31px; gap:20px;}
.reward_number {text-align: center;}
.reward_number span {font-size:32px; font-weight: 500; display: inline-block;}
.reward_number p {font-size:16px; font-weight: 700; color:#89949C;}
.accumulate_count span:nth-child(1) {display: inline-block; width:80px; margin-right:32px; font-size:16px; font-weight: 500; color:#89949C; margin-bottom:2px;}
.accumulate_count span:nth-child(2) {font-size:16px; font-weight: 500;}
.ad_active {color:var(--fran_inactive);}
.reward_name {display: flex; justify-content: space-between; align-items: center; margin:6px 0 4px;}
.reward_name span:nth-child(1) {font-size:15px; font-weight: 400; display: inline-block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; width:100%;}
.reward_name span:nth-child(2) {flex:none; display: inline-block; margin-left:20px; font-size:12px; font-weight: 400;}

.reward_info_wbox li {border-bottom:1px solid var(--line); padding:16px 24px;}
.art_link {display: flex; justify-content:space-between; align-items: center; margin-bottom:10px;}
.art_title {font-size:16px;}
.store_slide_img { margin-right: 5px; text-align: center; font-size: 18px; width: 100%; min-width: 153px; max-width: 153px; height: 115px; border-radius: 10px; overflow: hidden; position: relative; cursor:pointer; border:1px solid #c7c7c7;}
.reward_store_slide li {height:153px;}
.reward_style_name {display: inline-block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; width:100%; font-size:16px; margin-top:6px; padding:0 10px; }
.checked_box {  position: absolute; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.6); display: flex; justify-content: center; align-items: center; width: 100%; height: 100%;}
.checked_box img {width:32px !important; height:32px !important;}
.reward_store_img_box {padding:20px 20px 0;   border-bottom: 1px solid var(--line);}
.reward_img_upload .img_upload_input {display: none;}
.imgArea { max-width: 100%; width: 100%; height: 200px; margin: 0 auto 20px; text-align: center; cursor: pointer; border: 1px solid var(--line); border-radius: 8px;}
.imgArea img {max-width:100%; height:100%; margin:0 auto;}
.reward_img_upload {padding:20px;}
/* .reward_rep_img_box {width:100%; padding-top:56.25%; cursor:pointer;} */
.reward_rep_img_box > label {cursor:pointer;}
.reward_btn button:disabled {background: var(--dark); cursor:inherit; color:var(--line_gray);}
.close_reward_pop {cursor:pointer;}
.loader { width: 50px; --b: 8px; aspect-ratio: 1; border-radius: 50%; padding: 1px;background: conic-gradient(#0000 10%,#1162F8) content-box; -webkit-mask:  repeating-conic-gradient(#0000 0deg,#000 1deg 20deg,#0000 21deg 36deg),
    radial-gradient(farthest-side,#0000 calc(100% - var(--b) - 1px),#000 calc(100% - var(--b)));
  -webkit-mask-composite: destination-in; mask-composite: intersect; animation:l4 1s infinite steps(10); margin:0 auto; }
@keyframes l4 {to{transform: rotate(1turn)}}
@keyframes l23 { 100% {transform: rotate(1turn)}}
.generationg_wrap {padding:20px;}
.generation_wbox {width:100%; height: 818px; background: var(--line); position: relative; border-radius: 8px;}
.generation_box {position: absolute; top:50%; left:50%; transform: translate(-50%, -50%);}
.loading_title {font-size:16px; font-weight: 700; display: inline-block; margin-top:10px; text-align: center;}
.generation_data_img {width:100%; height: 818px;  position: relative; border-radius: 8px; overflow: hidden; border:1px solid var(--line)}
.view_img {position: absolute; top:0; left:0; width:100%; height:100%; object-fit: cover;}
.issue_ad_link {display: flex; align-items: center;  border-radius: 8px;  padding:8px 12px; gap:10px; background: var(--red); cursor:pointer;}
.issue_ad_link img {width:12px; height:12px;}
.issue_ad_link span {color:var(--white); font-size:14px; font-weight: 700;}
.issue_ad_link_wbox {position: absolute; bottom:20px; right:20px;}
.generation_active {border:1px solid var(--main);}
.bottom_img_data_img {width:100%; height:250px; position: relative; border-radius: 8px; overflow: hidden; cursor:pointer; border:1px solid #9f9f9f;}
.bottom_view_img {position: absolute; top:0; left:0; width:100%; height:100%; object-fit: cover;}
.bottom_img_data_wbox {display: grid; grid-template-columns: repeat(4, 1fr); column-gap: 10px; margin-top:10px;}
.bottom_img_no_data_wbox {display: grid; grid-template-columns: repeat(4, 1fr); column-gap: 10px; margin-top:10px;}
.bottom_img_no_data_box {width:100%; height:250px;  border-radius: 8px; overflow: hidden; background: var(--line);}
.no_box_active {border:1px solid var(--main);}
.title_m {font-size:16px; font-weight: 500;}
.sub_title_b {font-size:15px; font-weight: 500; padding:10px 20px; margin-top:10px; border: 1px solid var(--main); border-radius: 10px; background: var(--main_sub);}

.check_radio_reward {background: var(--lightgray); border-radius: 10px;}
.check_radio_reward .text {font-size:14px;  color:var(--dark);}
.check_radio_reward li {padding:13px 16px; }
.check_radio_reward label {display: flex; align-items: center; gap:10px; cursor:pointer;}
.check_radio_reward input[type="radio"]{-webkit-appearance:none; position:relative; width:20px; height:20px; cursor:pointer; outline:none; border-radius:50%;}
.check_radio_reward input[type="radio"]::before{background-image:url("../img/contents/reward/icon_check_inactive.svg"); width:100%; height:100%; background-repeat: no-repeat; background-position:center; content: ""; position: absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
.check_radio_reward input[type="radio"]:checked::before { background-image: url("../img/contents/reward/icon_check_active.svg");}
.check_radio_reward  input[type="radio"]:checked + .text {color:var(--main); font-weight: 700;}
.check_radio_reward li.list_reward {display: flex; justify-content: space-between; align-items: center; position: relative; padding-top:0;}
.reward_drop_down {flex:none; margin-left:20px; cursor:pointer;}
.reward_drop_down.down_active {transform: rotate(180deg);}
.reword_pop_wbox {position: absolute; top:33px; left:0; width:100%; background: var(--white); border: 1px solid var(--fran_inactive);
  border-radius: 10px; padding:16px 7px; min-height: 340px;  z-index:100;}
.reword_pop_wbox li {padding:0; margin-bottom:10px; padding:0 7px;}
.reword_pop_wbox li:last-child {margin-bottom:0;}
.reword_pop_t {font-size:16px; font-weight: 500; text-align: center; margin-bottom:12px; color:var(--black);}
.sub_title_b_flex {display: flex; justify-content: space-between; align-items: center;  gap:10px;   font-size: 16px; font-weight: 500; padding: 8px; color: var(--dark); border-radius: 4px; flex-wrap:wrap; word-break: break-all; margin-top:10px;}
.sub_title_b_flex p:nth-child(2) {word-break: break-all;}
.sub_title_bg {background: var(--lightgray); border-radius: 4px;}
.gap10 {gap:10px;}
.total_amont_title { font-size: 16px; font-weight: 500;  padding: 8px 8px 0; color: var(--dark);  }
.total_amont_num { font-size: 20px; font-weight: 700;  padding: 8px; color: #212121; text-align: right; }

.payment_checkbox_wbox label {display: flex; align-items: center; gap:10px; cursor:pointer; width:max-content;}
.payment_checkbox_wbox input[type="checkbox"]{-webkit-appearance:none; position:relative; width:20px; height:20px; cursor:pointer; outline:none; border-radius:50%;}
.payment_checkbox_wbox input[type="checkbox"]::before{background-image:url("../img/contents/reward/icon_checkbox_inactive.svg"); width:100%; height:100%; background-repeat: no-repeat; background-position:center; content: ""; position: absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
.payment_checkbox_wbox input[type="checkbox"]:checked::before { background-image: url("../img/contents/reward/icon_checkbox_active.svg");}

.reward_agree {border-radius: 4px; list-style-type: disc;  padding:10px 16px 13px 34px }
.reward_agree li {font-size:14px; color:var(--dark); font-weight: 400; margin-bottom:4px;}
.reward_agree li:last-child {margin-bottom:0;}

.gallay_swiper_wrapper .swiper-container {height: 100vh; height:100svh; background: rgba(0,0,0,0.2);}
.gallay_swiper_wrapper .swiper-slide img {width:100%; height:100%; max-width: 100%; object-fit: contain;}
.gallay_swiper_wrapper .slide01 {width: 100%; height: 100%; z-index:10;}
.gallay_swiper_wrapper .swiper-container-vertical>.swiper-wrapper {position: relative;}
.gallay_swiper_wrapper .slide02 {width: 100%; height: 100%;  z-index:10;}
.gallay_swiper_wrapper .slide03 {width: 100%; height: 100%;  z-index:10;}
.gallay_swiper_wrapper .slide04 {width: 100%; height: 100%;  z-index:10;}
.income_wbox {position: fixed; top:60px; left:50%; transform: translateX(-50%); font-size:16px; font-weight: 500; z-index:10; background: var(--white);
  border-radius: 6px; padding:6px 12px;
}
/* .img_slider_view img {box-shadow: 0 -4px 6px rgba(0, 0, 0, 0.1), 0 4px 6px rgba(0, 0, 0, 0.1);} */


.income_title {position: relative; display:flex; align-items: center; padding-right:10px; flex:none;}
.income_title::after {position: absolute; content:"|"; right:0; }
.income_number {display: inline-block; padding-left:10px;}
.like_wbox button {background: transparent; outline: none; border:none; display: block; width:100%; text-align: center;}
.like_wbox img {width:30px; margin:0 auto;}
.like_box {position: absolute;; bottom:70px; right:13px; z-index:3000;  box-shadow: 0 -4px 6px rgba(0, 0, 0, 0.1), 0 4px 6px rgba(0, 0, 0, 0.1); background:rgba(255,255,255,0.7); padding:10px;
  border-radius: 6px;}
/* .like_box {position: ab; z-index:111; bottom:0; right:0;} */
.swiper-container-vertical>.swiper-wrapper {position: relative;}
.like_wbox {max-width:40px;}
.like_wbox li {margin-bottom:22px;}
.like_wbox li:last-child {margin-bottom:0;}
.like_count {display: inline-block; color:var(--black); font-size:15px; font-weight: 700; margin-top:4px; text-align: center; width:100%;}
.reward_nu {display:none; position: fixed; width:100%; height:100%;  background-color: rgba(0, 0, 0, 0.7); max-width:768px; margin:0 auto; z-index:1000; top:0; left:0; right:0; bottom:0;}
.reward_nu.nu_active {display: block;}
.plus_reward {background: var(--white); position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:64px; height:64px; display: flex; justify-content: center; align-items: center; font-size:32px; font-weight: 500;  color:var(--main);
  border-radius: 50%; border:2px solid var(--main);}

.headert_pop {display:none; position: fixed; width:100%; height:100%;  background-color: rgba(0, 0, 0, 0.7); max-width:768px; margin:0 auto; z-index:1000; top:0; left:0; right:0; bottom:0;}
.headert_pop.headert_active {display: block;}
.headert_reward {background: var(--main); position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:170px; height:46px; text-align: center;
  font-size:16px; font-weight: 500;  color:var(--white); display: flex; justify-content: center;  align-items: center; border-radius: 2px;}
.day_accumulate {padding:14px; display: flex; justify-content: space-between; align-items: center; margin-top:10px !important; font-size:18px; font-weight:700; color:var(--black); border-radius:6px; min-height: unset;}
.day_accumulate_f {display: flex; align-items: center;}
/* .progress_wrap {flex-wrap: wrap; margin-top:20px;}
.progress_wrap h2 {display: inline-block; padding-bottom: 10px; margin-bottom:20px;} */
/*220116 - margin값 제거 : SJW */
.progress_wrap h2 {display: inline-block; padding-bottom: 10px;  border-bottom:2px solid #191C1E;}
/* .progress_box {width:100%; padding: 20px; margin-bottom: 20px; background-color: #fff; border-radius: 20px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); cursor: pointer;} */
/*220116 - margin값 위치 변경 : SJW */
.today_accumulate {width:100%; padding: 10px 13px; background-color: #fff; border-radius: 4px; margin-top:8px;  }
.progress_box li {display: flex;  align-items: center;}
.progress_bar{width:100%; margin:10px 0; background-color: #EAEAEA;}
.gage_bar { width: 0%; height:16px; background-color:#ED1254; transition: width 1s; border-radius: 2px 0 0 2px;}
.gage_bar02 { width: 0%; height:16px; background-color:var(--main);transition: width 1s; border-radius: 0 2px 2px 0px;}
.today_accumulate_wbox {display: flex; justify-content: space-between; align-items: center; color:var(--dark); font-size:14px; font-weight: 500;}
.today_accumulate_wbox p:nth-child(1) {color:var(--black);}
.today_accumulate_wbox p:nth-child(2) {color:var(--main); font-weight: 700;}
.search_reward_box {background: #ED1254; width:14px; height:14px;}
.like_reward_box {background: var(--main); width:14px; height:14px;}
.info_accumulate {margin-top:10px;}
.reward_box_wbox {display: flex; align-items: center; gap:10px;}
.info_accumulate li {display: flex; align-items: center; margin-bottom:6px; justify-content: space-between;}
.info_accumulate li:last-child {margin-bottom:0;}
.info_accumulate li span {font-size:14px; font-weight: 500; display: inline-block; color:var(--dark);}
.no_tq_point_data {padding:0 24px; margin:80px 0; text-align: center;}
.no_reward_title {font-size:16px; font-weight: 500; margin-bottom:10px;}
.view_reward {font-size:14px; font-weight: 400; color:var(--dark); display: inline-block; margin-bottom:16px;}
.heaeder_reward{height: unset;}
.heaeder_reward .header_list {background: transparent; border-bottom:none;}
.income_flex {display: flex; align-items: center;}
.reward_history_icon {width:30px; height:30px;}
.gift_reward_check {background: var(--main_sub); border:1px solid var(--main); border-radius: 10px;}
.check_radio_reward02 {background: transparent}
.img_slider_view {height:100%; cursor:pointer;}
#countdown { position: relative; margin: auto; height: 30px; width: 30px; }
.timer_number {color: var(--red); display: inline-block; font-size:15px; text-align: center; width:100%; font-weight: 700; margin-top:4px; }
.reward_histoy_amount {padding:10px 20px;}
svg { position: absolute; top: 0; right: 0; width: 100%; height: 100%; transform: rotateY(-180deg) rotateZ(-90deg);}
svg circle {stroke-dasharray: 90px; stroke-dashoffset: 0px; stroke-linecap: round; stroke-width: 1px; stroke: var(--main); fill: none; }
svg circle.ci_active {animation: countdown 6s linear infinite forwards; stroke-width: 1px; stroke: var(--red);}
@keyframes countdown {
  from { stroke-dashoffset: 0px; }
  to {stroke-dashoffset: 90px;}
}
.posting_wbox { margin-bottom:20px;}
.autoplay-progress svg {
  --progress: 0;
  position: absolute;
  left: 0;
  top: 0px;
  z-index: 10;
  width: 100%;
  height: 100%;
  stroke-width: 4px;
  stroke: var(--swiper-theme-color);
  fill: none;
  stroke-dashoffset: calc(125.6px * (1 - var(--progress)));
  stroke-dasharray: 125.6;
  transform: rotate(-90deg);
}


/*240604 리워드 광고 생성*/
.reward_list_box { display: grid; grid-template-columns: repeat(2, 1fr); grid-row-gap: 20px;  grid-column-gap: 20px; }
.reward_list_box li{border-radius: 6px; overflow: hidden; display: flex;flex-direction: column; border:1px solid #c7c7c7; cursor:pointer;}
.reward_img {   position: relative; aspect-ratio: 1 / 1; object-fit: contain;}
.reward_img > img {position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 100%; max-width: 100%; height: 100%; object-fit: cover;}
.reward_txt {border-top:1px solid #c7c7c7;}


/*240628 리워드 광고 추가작업 : SJW */
.reward_choice_box { box-shadow: 0 3px 15px rgb(0, 0, 0, 0.06); aspect-ratio: 3 / 1; min-height: 80px; max-height: 150px; width:100%;}
.reward_choice_box img { height: 100%; width: 100%; object-fit: fill; border-radius: 10px;}
.choice_reward_wrap {padding:30px 24px;}
.choice_reward_wrap li {  margin-bottom:24px;}
.choice_reward_wrap li:last-child {margin-bottom:0;}
.reward_choice_box_01 {position: relative; padding:16px;}
.reward_choice_box_01 img {max-width:100%; position: absolute; top:0; left:0; width:100%; height:100%; z-index:1; border-radius: 10px;}
.now_link_txt a {position: relative; z-index:1; color:var(--white); margin-top:50px; display: inline-block; border:1px solid var(--white); font-size:12px; font-weight: 400; padding:4px 10px; border-radius: 14px;}
.reward_choice_box_01_txt  {color:var(--white); position: relative; z-index:1; font-size:18px; font-weight: 700; width:max-content;}
.choice_reward_title {font-size:16px; font-weight: 500; text-align: center; padding:4px 0;}
/* .reward_upload_wrap .rep_img_box {width:100%; cursor:pointer;} */
.reward_upload_wrap  .rep_img_box > label {cursor:pointer;}
/* .reward_upload_wrap .rep_img_box img {width:100%;} */
.reward_upload_wrap .store_list {padding:0; border-bottom:none;}
.check_radio_reward_box li {padding:0; margin-bottom:10px;}
.check_radio_reward_box li:last-child {margin-bottom:0;}
.check_radio_reward_box {padding:13px 16px;}
.reward_create_img img {width:100%; height:100%; max-height: 1280px;}
.reward_create_img {width:100%; max-height: 1280px; border:1px solid var(--gray); border-radius: 10px; overflow: hidden; margin-bottom:10px; position: relative;}
.reward_create_img:last-child {margin-bottom:0;}
.reward_img_create_box {display: flex; justify-content: space-between; align-items: center; font-size:14px; font-weight:500; color:var(--dark); padding-top:10px;}
.count_reward {display: flex; align-items: center; gap:2px;}
.width_reward {display: inline-block; min-width: 80px;}
.info_reward_img {font-size:14px; font-weight: 700; margin-top:10px;}
.reward_img_type_box {background:var(--lightgray);}
.reward_img_add_box { position: relative; text-align: center; width: 100%; height: 240px; margin-bottom: 10px; overflow: hidden; border-radius: 10px; border: 1px dashed var(--fran_inactive);}
.reward_img_add_box img { width: 100%; height: 100%; position: absolute; left: 0;  top: 0; object-fit: cover;}
.reward_img_add_box input { display: none;}
.reward_img_add_box label { position: absolute; left: 0; top: 0; width: 100%; height: 100%; cursor:pointer;}
.share_txt {font-size:18px; font-weight: 700;}
.share_content {display: flex; justify-content: space-between; align-items: center;}
.preview_txtbox {font-size:16px; font-weight: 500; padding:20px; border-bottom:1px solid var(--line_gray);  background: var(--white);
  display: -webkit-box; word-wrap: break-word; -webkit-line-clamp: 5; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; height:146px;}
.preview_popup_contents::-webkit-scrollbar{ display:none;}
.preview_popup_contents {  background: var(--line_gray); position: fixed; left:0; top:50px; right:0; bottom:0; margin:auto; max-width: 768px; width: 100%; z-index: 9920; overflow: scroll; padding-bottom:100px;}
.share_box {padding:20px; min-height:93px; position: fixed; bottom:0; left:0; right:0; width:100%; max-width:768px; margin: auto; border-top:1px solid var(--fran_inactive); background: var(--white);}
.reward_share_data {display: flex; align-items: center; gap:10px;}
.reward_share_data span {font-size:14px; font-weight: 400;}
.reward_share_link button {outline: none; border:none; background: transparent;}
.img_preview img {max-width:100%; width:100%; height:100% }
.img_preview {background: var(--white)}
.warning_reward_pop {padding:20px; font-size:14px;}
.warning_reward_txt {list-style-type: disc; padding-left:20px;}
.preview_img_wcontent {height:auto;}
.view_reward_header {background: #3D3D3F; height:40px; position: relative;}
.gallay_view_swiper_wrapper .swiper-container {height: 100vh; height:100svh; background: rgba(0,0,0,0.2);}
.create_view_reward_img_box {height:100%; height:calc(100vh - 290px); height:calc(100svh - 290px); position: relative;}
.create_view_reward_img_box img {width:100%; height:100%; object-fit: cover;}
.create_view_reward_img {position: relative;}
.gallay_view_swiper_wrapper .slide01 {width: 100%; height: 100%; z-index:10;}
.gallay_view_swiper_wrapper .swiper-container-vertical>.swiper-wrapper {position: relative;}
.gallay_view_swiper_wrapper .slide02 {width: 100%; height: 100%;  z-index:10;}
.gallay_view_swiper_wrapper .slide03 {width: 100%; height: 100%;  z-index:10;}
.gallay_view_swiper_wrapper .slide04 {width: 100%; height: 100%;  z-index:10;}
.user_like_count {color:var(--white); position: absolute; left:50%; top:50%; transform: translate(-50%, -50%); font-size:16px; white-space: nowrap;}
.user_like_count span:nth-child(2) {padding-left:20px;}
.back_view a {height:100%; display: inline-block; display: flex; align-items: center; width:max-content; padding:0 20px;}
.back_view {height:100%; }
.like_after {position: relative;}
.like_after::after {position: absolute; content: "|"; padding-left:10px; display: inline-block; top:0; height:auto;}
.view_reward_txtbox {background: var(--white); width:100%; height:110px; position: relative; max-width:768px; margin:0 auto; padding-top:10px;}
.translucent_box {width:48px; height:48px; position: absolute; border-radius: 50%; top:-28px; left:50%; transform: translateX(-50%); background-color : rgba(255,255,255,0.1); border: 3px solid #1162f83d; z-index:100;}
.view_reward_txt {width:48px; height:48px; position: absolute; border-radius: 50%; top:-28px; left:50%; transform: translateX(-50%); background-color : rgba(255,255,255,0.1); border: 3px solid var(--main); background: var(--white); z-index:101;
transition: transform 1s ease-out, opacity 1s ease-out;}
.view_reward_txt span {display: flex; justify-content: center; align-items: center; height:100%; font-size:16px; font-weight: 700;}
.esing_video {position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); z-index:103; }
.esing_video_box {position:absolute;; top: 0; left: 0; width: 100%; height: 100%; z-index: 102; display: none; }
.rbg_box {display:none; position:absolute; top:0; left:0; width:100%; height:100%; background: rgba(0,0,0,0.6); z-index:99; }
.bg_active {display: block;}
.show-video { display: block; }
.esing_video img { width:100px; height:100px;}
.move-up {   transform: translate(-30px, -225px);   opacity: 0;}
.elise_5box {padding:30px 20px 0;  overflow: hidden;
  background: var(--white);
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  word-break: break-all;;}
.elise_5 {font-size:16px; font-weight: 500; }
.view_reward_name {display: flex; align-items: center; gap:4px; padding:16px 20px 12px; font-size:16px; font-weight: 500; border-top:1px solid var(--line_gray)}
.share_view_content {padding:0 20px 10px; display: flex; justify-content: space-between; align-items:center; }
.share_view_content span {font-size:16px; font-weight: 500;}
.like_num_view {position:absolute;; top: 50%; left: 50%;  transform: translate(-50%, -50%);  z-index: 102; background: var(--white); width:60px; height:60px; border-radius: 50%; z-index:100; border:3px solid var(--main);  display: none; }
.like_num_view span{display: flex; justify-content: center; align-items: center; height:100%; font-size:20px; color:var(--main);}

.like_num_view_count {position:absolute;; top: 50%; left: 50%;  transform: translate(-50%, -50%);  z-index: 102; background: var(--white); width:60px; height:60px; border-radius: 50%; z-index:100; border:3px solid var(--main); }
.like_num_view_count span{display: flex; justify-content: center; align-items: center; height:100%; font-size:20px; color:var(--main);}

.like_num_active {display: block;}
.m_i {display: none;}
.accumulate_view {width:48px; height:48px; position: absolute; border-radius: 50%; top:-28px; left:50%; transform: translateX(-50%); background-color : rgba(255,255,255,0.1); border: 3px solid var(--dark); background: var(--line_gray); z-index:97;}
.accumulate_view span {display: flex; justify-content: center; align-items: center; height:100%; font-size:16px; font-weight: 700;}
.like_view_btn  {position:absolute;; top: 50%; left: 50%;  transform: translate(-50%, -50%);  z-index: 102; display: none; transition: transform 1s }
.like_view_btn button {background: var(--red);  border-radius: 10px; z-index:100; border:3px solid var(--main); border:none; outline: none; padding:10px 20px; font-size:16px; font-weight: 700; color:var(--white); z-index: 102; }
.view_btn_active {display: block;}
.franchise_txt_list p.copy_txt {-webkit-line-clamp: 2; word-break: break-all;}
.r_100 {height:100%;}
/* .canvas_box {width:100%; max-width: 768px; height: 0; padding-top: 56%; margin: 0 auto; overflow: hidden; border:1px solid var(--line_gray); border-radius: 10px; margin-top:20px; position: relative;} */
/* .canvas_box img {width:100%; height:100%; max-width: 100%; object-fit: contain;  position: absolute; left: 50%;top: 50%;  transform: translate(-50%, -50%);} */
/* .canvas_box img {width:100%; height:100%; max-width: 100%; object-fit: contain;  position: absolute; left: 50%;top: 50%;  transform: translate(-50%, -50%);} */

.canvas_box { width:100%; max-width: 768px; margin: 0 auto; overflow: hidden; border:1px solid var(--line_gray); border-radius: 10px; margin-top:20px; position: relative;}

/* .color-btn[data-color='black'] {background: black;}
.color-btn[data-color='red'] {background: red;}
.color-btn[data-color='blue'] {background: blue;}
.color-btn[data-color='green'] {background: green;} */

.reward_black {background: var(--black);}
.reward_red  {background: var(--red);}
.reward_blue  {background: var(--blue);}
.reward_green  {background: var(--green);}
.reward_canvavs {width:30px; height:30px; border-radius: 50%; outline: none; border:none;}
.canvas_color_reward {display: flex; gap:10px; margin-top:10px;}



/*240628 리워드 광고 추가작업 : SJW */

/* 미디어쿼리 */
@media screen and (max-width:767px){
   .store_box { justify-content: space-between; }
   .store_infotxt { margin-right:0; }
   .wrap_keypad { margin:70px auto 0; }
   .change_phonemypage { justify-content: space-between; }
   .eventlist_img img { max-width:100%; }
   .event_view img { width:100% !important; max-width:100%; }
   .trad_img { max-width:230px; }
   /* .tx_hashaddr { max-width:224px; } */
   .choice_num { width:88%; }
   .bank_box { width:50%; justify-content: flex-start; }
   .notice_text_box img, .answer_faq img { max-width:100%; }
   /* 영업상태 버튼 간격 수정 */
   .businessstatus_btn div { width: 33%; margin-right: 5px; text-align: center; }
   .list_slider::-webkit-scrollbar { display: none; }
   /* .gift_category_list { grid-template-columns: repeat(2, 1fr); } */
   /* .giftbox_product_list { padding: 0 14px 20px; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 15px; } */

   /* 23.07.25 ATM출금 숫자(tq_atm_withdraw04) 수정 : KMS */
  .tq_atm_timedue_wrap {margin-top: 20px;}
  .tq_atm_timedue_wrap .tq_atm_timedue {color: #FF0000; position: relative; margin-left: 10px;}
  .tq_atm_timedue_wrap .tq_atm_timedue::before { content: '*'; position: absolute; left: -10px; top: 2px; }

  .tq_atm_approval_wrap {font-weight: 500; padding: 20px; border-radius: 10px;margin: 0 20px;background-color: var(--lightgray);}
  .tq_atm_approval_wrap p {font-size: 1.4rem;}
  .tq_atm_approval_tit {margin-bottom: 14px; gap: 10px; display: flex;justify-content: space-between; align-items: center;}
  .tq_atm_video {color: #FF0000; text-decoration: underline; font-size: 1.2rem; cursor: pointer;}
  .approval_index {color: var(--black); margin-right: 6px; font-size: 1.6rem;}
  .tq_atm_approval_middle {position: relative;display: flex; justify-content: space-between; align-items: center;}
  .tq_atm_approval_middle img {width: 90px;height: 99px; flex: none;}

  .atm_video_pop .qr_popup_close_btn {width: 20px;height: 20px;right: 15px;}
  .atm_video_wrap {width: 70%;height: 100%; margin: auto; }
  .atm_video_wrap video {width: 100%;height: 100%;object-fit: contain;}
  .reward_number p {font-size:14px;}
  .reward_data_box {padding:14px;}
  .reward_style_name  {font-size:14px; }
  .generation_wbox { height:525px; }
  .generation_data_img {height:525px;}
  .bottom_img_data_img {height:119px;}
  .bottom_img_no_data_box {height:119px;}
  .m_bg_white {background: var(--white);}
  .payment_checkbox_wbox input[type="checkbox"] {flex:none;}
  .payment_checkbox_wbox label {width:100%; align-items: flex-start;}
  .payment_checkbox_wbox .text {position: relative; top:-2px;}
  .income_flex {font-size:14px;}
  .reward_store_slide  { grid-template-columns: repeat(2, 1fr);}
}



@media screen and (max-width:767px){
 .choice_num { width:88%; }
 .paddingbtn { padding-bottom:60px; }

 .m_i {display: block;}
 .pcw_i {display: none;}
 }
@media screen and (max-width:730px){
 .referral_receive_col { flex-direction: column; }
 }
@media screen and (max-width:650px) { /* gift */
 .gift_info_b > p, .gift_info_c > p, .gift_info_s > p { margin-left:10px; font-size: 2.8rem; font-weight: 500; }
 .giftbox_top_count > p { margin-left:10px; font-size: 2.8rem; font-weight: 400; }
 .gift_icon { width: 80px; height: 80px; line-height:48px; border: 1px solid var(--line); border-radius:13px; margin:0 auto; }
 .gift_icon img { width:100%; height:100%; object-fit: cover; }
 }

@media screen and (max-width:530px) { /* GIFTBOX */
 /* .gift_category_list { grid-template-columns: repeat(2, 1fr); } */
 /* .giftbox_product_list { padding: 0 14px 20px; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 15px; } */
 }

@media screen and (max-width:450px) { /* GIFT */
 .gift_box { padding: 10px 0; }
 .gift_box > p { font-size: 1.2rem; margin-top: 5px; }
 .gift_info_b > p, .gift_info_c > p, .gift_info_s > p { margin-left:10px; font-size: 2.4rem; font-weight: 500; }
 .giftbox_top_count > p { margin-left:10px; font-size: 2.4rem; font-weight: 400; }
 .gift_icon { width: 64px; height: 64px; line-height:48px; border: 1px solid var(--line); border-radius:13px; margin:0 auto; }
 .gift_icon img { width:100%; height:100%; object-fit: cover; }
 /* .giftbox_product_list { padding: 0 14px 20px; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 15px; } */
}

@media screen and (max-width:400px){
 .hash_add { margin: 5px 2px; }
 /* GIFT */
 .gift_info_b > p, .gift_info_c > p, .gift_info_s > p { margin-left:10px; font-size: 2rem; font-weight: 500; }
 .giftbox_top_count > p { margin-left:10px; font-size: 1.8rem; font-weight: 400; }
 /* REFERRAL */
 .referral_box img { max-height: 258px; }

 .gift_date_check_box { width:100%; height:50px; }
 .gift_date_check { display: flex; justify-content: center; align-items: center; }

.accumulate_count li {text-align: right;}
.accumulate_count span:nth-child(1) {margin-right:0; width:unset;}

 }




@media screen and (max-width:360px) { /* gift */
 .gift_box > p { font-size: 1.0rem; margin-top: 5px; }
 .gift_icon { width: 54px; height: 54px; line-height:48px; border: 1px solid var(--line); border-radius:13px; margin:0 auto; }
 .gift_icon img { width:100%; height:100%; object-fit: cover; }
 .gift_info_b > p, .gift_info_c > p, .gift_info_s > p { margin-left:10px; font-size: 1.8rem; font-weight: 500; }
 .giftbox_top_count > p { margin-left:10px; font-size: 1.6rem; font-weight: 400; }
 .guide_tab { font-size: 1.4rem; }

 .qrnotpay_codenum { font-size:1.4rem; }

 /* GIFT HISTORY */
 .gift_history_cardbox { min-height: calc(100vh - 125px); min-height: calc(100svh - 125px); height: auto; }
 .gift_date_check_box { width:100%; height:75px; }
 .gift_date_check { display: flex; justify-content: center; align-items: center; flex-direction: column }
 .gift_date_check > p { margin-right: 0; }
 }

@media screen and (max-width:340px){
 .paymentnumgo_j { flex-wrap:wrap; }
 .qrtimer_jbox .timer_txt { margin-left:0 !important; }

 /* 230427 매출정산 : KMS */
 .tq_escrow_info_btn { position: static; }
 .tq_escrow_info_desc { top: 85px; width: calc(100% - 40px); left: 50%; transform: translateX(-50%); }
 /* .sales_settlement .tq_escrow_info_desc { top: 180px; width: calc(100% - 40px); left: 50%; transform: translateX(-50%); } */
 .sales_settlement .tq_escrow_info_desc { top: 180px; }
 }

@media screen and (max-width:310px){
 .giftbox_comp_box { padding:30px 20px; }
 .gift_date_check > div:first-of-type { flex-direction: column; }
 .tq_history_top > div:last-of-type { flex-direction: column; }
 .settle_date_check { justify-content: center; }
 .settle_date_check > div { flex-direction: column; }
 .settle_date_check_box { width: 100%; height: 107px; }
 }

 @media screen and (max-height:668px){
 .qr_img_box { padding-top: 10px; }
 .none_pay { margin-top:20px; }
 .franchise_info_box { position: static; width: 100%; }
 }




/* 미디어쿼리 */