@charset "utf-8";

/* ################ 기본값 ##################### */
/* wrap */
.wrap{width:100%; max-width:768px; margin:auto;}
.wrap.black { background: var(--pay_black); border-bottom : 1px solid #1A222E; }

/* header */
header{width:100%;}

.header_safe_area{width:100%; height:50px;}
.header_layout{width:101%; max-width:768px; height:50px; border-bottom:1px solid rgba(0,0,0,0.08); background: var(--white); display:flex; align-items:center; position:fixed; left:50%; top:0; transform:translateX(-50%); z-index: 100;}
.header_layout.back_color { background-color: rgba(255, 255, 255, 0.01); border-bottom:none;}
.header_layout .title{font-size:18px; font-weight:700; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}
.header_layout .title img { height: 40px; }
.header_layout .left{padding:10px; margin-right:auto; width: 50px; height: 100%; display: flex; justify-content: center; align-items: center;}
.header_layout .right{padding:10px; margin-left:auto; width: 50px; height: 100%; display: flex; justify-content: center; align-items: center;}
.header_layout .right span, .header_layout .left span {display: flex; justify-content: center; align-items: center;}
.header_layout.black { background: var(--pay_black); border-bottom : 1px solid #1A222E; }
.header_safe_area2{width:100%; height:50px;}
.header_layout2{width:100%; max-width:768px; height:50px; padding:0 20px; border-bottom:1px solid rgba(0,0,0,0.08); display:flex; align-items:center; position:fixed; left:50%; top:0; transform:translateX(-50%);}
.header_layout2 .title{font-size:18px; font-weight:700; margin-right:auto;}
.header_layout2 .right{padding:10px; margin-left:auto;}

.header_safe_area3{width:100%; height:50px;}
.header_layout3{width:100%; max-width:768px; height:50px; padding:0 20px; border-bottom:1px solid rgba(0,0,0,0.08); display:flex; align-items:center; position:fixed; left:50%; top:0; transform:translateX(-50%);}
.header_layout3 .title{font-size:18px; font-weight:700; margin-left:auto;}
.header_layout3 .left{padding:10px; margin-right:auto;}

/* mian */
main{width:100%; min-height:calc(100vh - 110px); min-height:calc(100svh - 110px);}
.no_header main{min-height:calc(100vh - 60px); min-height:calc(100svh - 60px);}
.no_footer main{min-height:calc(100vh - 50px); min-height:calc(100svh - 50px);}
.no_both main{min-height:100vh; min-height:100svh;}

/* button */
button.design{width:100%; height:50px; background-color:var(--main); border-radius:10px; font-size:18px; font-weight:500; color:var(--white); cursor:pointer;}
button.design:disabled{border:solid 1px rgba(0,0,0,.05); background-color:#e6e6ea; color:var(--white); }
button.design.red{background-image:none; background-color:var(--warning); color:var(--white);}
button.design.addr {width: max-content; font-weight: 400; padding: 0 10px;  background-image:none; background-color: var(--main); color:var(--white); font-size: 16px; }
button.design.gray{background-image:none; background-color:var(--inactive);}
button.design.bg{background-image:none; background-color:var(--bg); color:var(--black);}
button.design.blue{background-image:none; background-color: var(--blue);}
button.design.white{background-image:none; background-color: var(--black);}
button.design.black{background-image:none; background-color: var(--white);}

button.design.small{width: auto; padding:0 16px;}

.btn_fixed_container { width: 100%; height: 90px; }
.btn_fixed.btn_height_90 { padding: 0 20px 30px; }
.btn_fixed_box { width: 100%; height: 120px; }
.btn_fixed_box_txt { width: 100%; height: 170px; }
.btn_fixed { position:fixed; max-width:768px; width:100%; bottom:0; left: 50%; transform: translateX(-50%); background-color:var(--white); }
.btn_fixed_trans { position:fixed; max-width:768px; width:100%; bottom:0; z-index: 44;}
.btn{width:100%; height:50px; background:var(--main); color:var(--white); border-radius:10px; font-size:16px; font-weight:500; cursor:pointer; display:inline-flex; justify-content:center; align-items:center;}
.btn.small{width:auto; padding:0 16px;}
.btn.disabled{border:solid 1px rgba(0,0,0,.05); background-color:#e6e6ea; color:var(--white);}
.btn.check { background-color:#e6e6ea; color:var(--black); }

/* badge */
.badge{font-size:14px; font-weight:700; color:var(--black); padding:7px 14px; border-radius:100vw; background-color:#ccc;}

.badge.small{font-size:10px; padding:5px 10px;}
.badge.regular{font-size:12px; padding:7px 14px;}
.badge.medium{font-size:13px; padding:8px 16px;}
.badge.large{font-size:15px; padding:10px 20px;}

.badge.red{background-color:red; color:var(--white);}
.badge.orange{background-color:orange; color:var(--white);}
.badge.yellow{background-color:yellow; color:black;}
.badge.green{background-color:green; color:var(--white);}
.badge.blue{background-color:blue; color:var(--white);}
.badge.navy{background-color:navy; color:var(--white);}
.badge.purple{background-color:purple; color:var(--white);}

/* label */
label.design{display:inline-block; width:100%; font-size:16px; font-weight:500;}
label.design small{display:inline-block; width:100%;}

/* input */
input.design{width:100%; padding:12px 25px; height: 50px; border:solid 1px var(--gray); border-radius: 10px; font-size:16px; font-weight:500; font-family: "spoqa";}
input.design::placeholder{font-size:16px; font-weight:400; color:rgba(34,34,34,0.4);}

input.design:read-only{background-color:var(--disabled); color:black !important;}
input.not_readonly:read-only{background-color:var(--white);}

input.design:disabled{background-color:var(--disabled);}
input.not_disabled:disabled{background-color:var(--white);}

select.design{ appearance: auto;  position: relative; display: block; width:100%; padding:12px 25px; height: 50px; border:solid 1px var(--gray); border-radius: 10px; font-size:16px; font-weight:500; font-family: "spoqa";}
select.design::placeholder{font-size:16px; font-weight:400; color:rgba(34,34,34,0.4);}

/* checkbox */
label.checkbox{display:inline-flex; justify-content:flex-start; align-items:center; gap:10px;}
label.checkbox input{display:none;}
label.checkbox .icon{display:block; width:24px; height:24px; border-radius:4px; background-color:#f1f1f1; cursor:pointer; position:relative;}
label.checkbox .text{font-size:14px; font-weight:500; color:#ccc;}
label.checkbox input + .icon::after{content:"✓"; display:block; font-size:14px; font-weight:700; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); color:#ccc;}
label.checkbox input:checked + .icon{background:var(--main); border:none;}
label.checkbox input:checked + .icon::after{color:var(--white);}
label.checkbox input:checked ~ .text{color:var(--black) !important;}

label.checkbox input:disabled:checked + .icon{background:#ddd;}
label.checkbox input:disabled:checked + .icon::after{color:#999;}
label.checkbox input:disabled:checked ~ .text{color:#999 !important;}

/* radio */
label.radio{display:inline-flex; justify-content:flex-start; align-items:center; gap:10px;}
label.radio input{display:none;}
label.radio .icon{display:block; width:24px; height:24px; border-radius:50%; border:1px solid #f1f1f1; background-color:var(--white); cursor:pointer; position:relative;}
label.radio .text{font-size:14px; font-weight:500; color:#ccc;}
label.radio input + .icon::after{content:""; display:block; width:14px; height:14px; border-radius:50%; background-color:#f1f1f1; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); color:#ccc;}
label.radio input:checked + .icon{border-color:var(--main);}
label.radio input:checked + .icon::after{background-color:var(--main);}
label.radio input:checked ~ .text{color:black !important;}

label.radio input:disabled:checked + .icon{border-color:#ddd;}
label.radio input:disabled:checked + .icon::after{background-color:#999;}
label.radio input:disabled:checked ~ .text{color:#999 !important;}

/* wallet_combination_card */
.wallet_combination_card{width:100%; background-color:#343638;border-radius:6px; overflow:hidden; }
.wallet_combination_card .wallet_combination_card_body{padding:20px 20px 10px 20px;}
.wallet_combination_card .title{font-size:14px; font-weight:500; color:var(--white); margin-bottom:10px;}
.wallet_combination_card .amount{font-size:20px; font-weight:700; color:var(--white); margin-bottom:5px;}
.wallet_combination_card .address{max-width:200px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:14px; font-weight:400; color:#999;}
.wallet_combination_card .address_copy_btn{font-size:14px; font-weight:700; color:var(--white); padding:7px 14px; border-radius:100vw; background-color:#2b2d2e;}
.wallet_combination_card .wallet_combination_card_foot{background-color:#2b2d2e; padding:10px 20px 10px 20px; display:flex; justify-content:space-between; align-items:center;}
.wallet_combination_card .wallet_combination_card_foot a{font-size:14px; font-weight:700; color:var(--white); padding:7px 14px;}

/* wallet_name_card */
.wallet_name_card{width:100%; padding:20px; background-color:var(--white); border:1px solid rgba(0,0,0,0.04);border-radius:6px;}
.wallet_name_card .wallet_name_card_body{width:100%; margin-bottom:20px;}
.wallet_name_card .img{width:50px; height:50px; background-color:#ddd; border-radius:50%; overflow:hidden;}
.wallet_name_card .img img{width:100%; height:100%; object-fit:cover; object-position:center;}
.wallet_name_card .img video{width:100%; height:100%; object-fit:cover; object-position:center;}
.wallet_name_card .text .name{font-size:14px; font-weight:700; color:var(--black);}
.wallet_name_card .text .id{font-size:12px; font-weight:700; color:#999;}
.wallet_name_card .wallet_name_card_foot{display:flex; justify-content:space-between; align-items:center;}
.wallet_name_card .wallet_name_card_foot a{display:flex; flex-direction:column; justify-content:center; align-items:center; gap:4px; font-size:14px; font-weight:500;}
.wallet_name_card .wallet_name_card_foot a img{width:24px;}

/* point_card */
.point_card{width:100%;}
.point_card_head{display:flex; justify-content:space-between; align-items:center; padding:14px 20px 0 20px; background-color:#ffdc00; border-top-left-radius:6px; border-top-right-radius:6px;}
.point_card .title{font-size:18px; font-weight:700;}
.point_card .name{font-size:14px; font-weight:500;}
.point_card_body{padding:14px 20px 20px 20px; background-color:#ffdc00;}
.point_card .amount{font-size:24px; font-weight:700; text-align:right; }
.point_card .button_box{display:flex; align-items:center; background-color:var(--white)7cc; border-bottom-left-radius:6px; border-bottom-right-radius:6px;}
.point_card .button_box button{width:100%; height:50px; font-size:16px; font-weight:700; border-right:1px solid #ffdc00;}
.point_card .button_box button:last-child{border-right:none;}

/* .nft_view_card */
.nft_view_card{width:100%; border-radius:6px; overflow:hidden; border:1px solid rgba(0,0,0,0.03);}
.nft_view_card .img_area{width:100%; height:0; padding-top:100%; position:relative; overflow:hidden;}
.nft_view_card .img_area img{width:100%; height:100%; object-fit:cover; object-position:center; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}
.nft_view_card .img_area video{width:100%; height:100%; object-fit:cover; object-position:center; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}
.nft_view_card .img_area iframe{width:100%; height:100%; object-fit:cover; object-position:center; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}
.nft_view_card .text_area{width:100%; padding:20px;}
.nft_view_card .text_area .hash_tag_box{display:flex; align-items:center; gap:4px; margin-bottom:10px; white-space:nowrap; overflow-x:scroll;}
.nft_view_card .text_area .hash_tag_box::-webkit-scrollbar {height:5px;}
.nft_view_card .text_area .hash_tag_box::-webkit-scrollbar-thumb {background-color: #ddd; border-radius:100vw;}
.nft_view_card .text_area .hash_tag_box::-webkit-scrollbar-track {background-color: transparent;}
.nft_view_card .text_area .hash_tag_box .hash_tag{font-size:12px; font-weight:700; padding:6px 12px; background-color:#c2e6ff; border-radius:100vw;}
.nft_view_card .text_area .title{font-size:16px; font-weight:700; margin-bottom:4px;}
.nft_view_card .text_area .desc{font-size:12px; font-weight:500; color:#999; margin-bottom:10px;}
.nft_view_card .text_area .price{font-size:20px; font-weight:700;}

/* simple_coin_card */
.simple_coin_card{width:100%; padding:14px 20px; border-radius:6px; border:1px solid #f1f1f1; display:flex; justify-content:space-between; align-items:center;}
.simple_coin_card .text_area .name{font-size:14px; font-weight:500; color:#999;}
.simple_coin_card .text_area .amount{font-size:22px; font-weight:700; color:var(--black);}
.simple_coin_card .img_area{width:50px; height:50px; border-radius:50%; border:1px solid #f1f1f1;}
.simple_coin_card .img_area img{width:100%; height:100%; object-fit:cover; object-position:center;}

/* basic_line_tab */
.basic_line_tab{width:100%; display:flex; align-items:center;}
.basic_line_tab li{font-size:14px; font-weight:400; padding:8px 16px; border-bottom:1px solid #ccc; cursor:pointer;}
.basic_line_tab .active{border:1px solid #ccc; border-bottom:none; border-top-left-radius:6px; border-top-right-radius:6px; background-color:#efefef; font-weight:500;}


/* select */
label:has(select.design){position:relative;}
label:has(select.design) select.design{width:100%; padding:12px 25px; border:solid 1px #e6e6ea; border-radius:6px; background-color:var(--white); font-size:16px; font-weight:400;}
label:has(select.design)::before{content:""; display:block; width:8px; height:8px; border-bottom:2px solid black; border-right:2px solid black; position:absolute; top:50%; right:10px; transform:translateY(-50%) rotate(45deg);}

/* textarea */
textarea.design{width:100%; padding:12px 25px; border:solid 1px #e6e6ea; border-radius:6px; font-size:16px; font-weight:500;}
textarea.design::placeholder{font-size:16px; font-weight:400; color:rgba(34,34,34,0.4);}



/* footer */
footer{width:100%;}

.bottom_tab_safe_area{width:100%; height:60px;}
.bottom_tab{width:100%; max-width:768px; height:60px; border-top:1px solid rgba(0,0,0,0.08); background-color: var(--white); display:flex; justify-content:space-between; align-items:center; position:fixed; left:50%; bottom:0; transform:translateX(-50%); z-index: 100; }
.bottom_tab .link{ width:100%; padding:10px; display:flex; flex-direction:column; justify-content:center; align-items:center;}
.bottom_tab .link .icon{width:24px; height:24px;}
.bottom_tab .link .text{font-size:12px; color:var(--inactive);}
.bottom_tab .active .text { color:var(--main); }




/* ################ 2023.11.20 남보라 ##################### */

/* LOGIN */
.login_box { padding: 20px; min-height: 100vh; min-height: 100svh; width:100%; display: flex; justify-content: center; align-items: center; flex-direction: column; 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; width: 100%;}
.login_form_box > div { width: 100%; }
.user_box, .password_box { position: relative; }
input.design.user_id { width: 100%; border: 1px solid var(--main); margin-bottom: 15px; font-size: 16px; outline: none; background-color: var(--white); }
input.design.user_password { width: 100%;  box-sizing: border-box; background-color: transparent; border: 1px solid var(--main); font-size: 16px; outline: none; }
.eye_svg { position: absolute; right: 20px; top: 50%; transform: translateY(-50%); cursor: pointer; }
.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: 14px; cursor:pointer; }

/* MAIN */
.main_section { padding:14px 20px 0; }
.num_tq_box { background: linear-gradient(to bottom right, #004271, var(--main));  border-radius: 10px; overflow: hidden; background-size: cover;}
.tqlistbtn { flex:none; }
.card_name { padding:20px 20px 0; }
.card_name img { width:30px; height:30px; }
.card_name p { font-size:20px; font-weight: 700; color:var(--white); }
.main_card { padding-bottom: 26px; }
.main_card_comma { color:var(--white); opacity: 50%; }
.card_name .main_escrow { letter-spacing: -1px; }
.num_tq { padding:20px 20px 30px; font-size:26px; font-family: "montserrat"; font-weight: 600; text-align: center; word-break: break-all;}
.dan { font-size:18px; font-family: "montserrat"; font-weight: 700; color:var(--white); }
.main_usage_history { display: block; background: #003495; border-radius: 16px; color:var(--white); padding:6px 16px; font-size:14px; font-weight: 500; }

/* notice_list_card */
.notice_list_card{ border-radius:8px; background-color:var(--white);}
.notice_list_card .card_title{font-size:16px; font-weight:700; color:var(--black); opacity:0.6;}
.notice_list_card ul li{margin-bottom:5px; border-bottom:1px solid #f1f1f1;}
.notice_list_card ul li:last-child{border-bottom:none;}
.notice_list_card ul li a{padding:10px 0; display:flex; justify-content:space-between; align-items:center; gap:10px;}
.notice_list_card ul li a .title{width:100%; font-size:14px; font-weight:500; color:var(--black); overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.notice_list_card ul li a .date{flex:none; font-size:13px; font-weight:500; color:var(--black); opacity:0.5;}

/* ESCROW */
.num_tq_box2 { background: linear-gradient(to bottom right, #210071, var(--main));  border-radius: 10px; overflow: hidden; background-size: cover;}
.esc_list_box { position: relative; padding:10px 20px; }
.esc_bg { position: absolute; left: 0; top: 0; width:100%; height:100%; background: rgba(17,98,248,0.3); mix-blend-mode: multiply; z-index: 20;}
.esc_bg_escrow { position: absolute; left: 0; top: 0; width:100%; height:100%; background: rgba(17,98,248,0.3); z-index: 20;}
.esc_list_box > div:last-child > div { z-index: 30; }
.escrow_txt { flex:none; font-size:12px; font-weight: 500; padding: 2px 4px; border-radius: 4px; background: var(--main); color: var(--white); }
.escrow_list_btn { display: block; background: var(--white); border-radius: 16px; color: #1162F8; padding: 6px 16px; font-size: 14px; font-weight: 500; }

/* SWIPER PAGING */
.main_card .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom: 5px !important; }

/* MARQUEE */
.marquee{position:relative; background:var(--black); border-radius: 8px; margin:14px 20px; height:36px; overflow: hidden;}
.marquee .notice_info{z-index:1;}
.marquee .marquee_inner{position:absolute; display:flex; align-items:center; width:100%; height:100%;}
 /* 기존 marquee a태그 내 margin-right:40px; */
.marquee .marquee_inner a{flex:none; margin-left: 60px; color:var(--white); font-size:12px; font-weight:500; width: calc(100% - 80px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.notice_info {position: absolute; left:0; top:50%; transform: translateY(-50%); background:var(--black); padding:0 10px; text-align: right; border-radius: 0 10px 10px 0;}
.notice_header { padding:4px 10px; background: var(--main); border-radius: 10px; color:var(--point); font-weight: 700; font-size: 10px; }

/* ICON 영역 */
.menu_container { position:relative; width: calc(100% - 40px); padding: 10px; margin:0 auto; background: var(--white); border-radius: 8px; overflow: hidden; }
.fran_icon_container { display: flex; align-items: center; flex-wrap: wrap; text-align: center;}
.fran_icon_container > li { width: calc(100% / 4);}
.fran_icon_container > li > a > p { font-size:16px; margin-top:5px; }
.fran_icon_container > li > a { padding: 20px; display:block; }
.user_menu_icon { width: 70px; height: 70px; padding:4px; line-height:48px; border-radius:13px; margin:0 auto; }
.user_menu_icon img { width:100%; height:100%; object-fit: contain;}

.img_slider {margin:0 20px !important; border-radius: 10px !important; padding:14px 0 20px!important; overflow: hidden; }
.img_slider .swiper-pagination-fraction { height:100%; left:unset; position: static; width:max-content; margin-right:6px; font-weight: 700; display: flex;}
.img_slider .swiper-pagination-fraction span:nth-child(1) {margin-right:4px;}
.img_slider .swiper-pagination-fraction span:nth-child(2) {margin-left:4px;}
.img_slider .banner_img { border-radius: 10px; box-shadow: 0 3px 15px rgb(0,0,0, 0.06); aspect-ratio: 3 / 1; min-height: 80px; max-height:150px;}
.banner_img img { height:100%; width:100%; object-fit: fill; border-radius: 10px;}
.all_list { font-weight: 500; }
.all_more02 { position: absolute; top:24px; right:10px; z-index:10; display: flex; align-items: center; padding:4px 8px; border-radius: 20px; background:rgba(0,0,0,0.7); color:var(--white); cursor:pointer; }
.img_slider .swiper-pagination { bottom: 0px !important; }
.swiper-pagination-bullet { width: 6px !important; height: 6px !important; }
.swiper-pagination-bullet-active { background: var(--main) !important; }

/* 가맹점 관리 */
.none_pd_container { position: relative; width: calc(100% - 40px); margin: 0 auto; background: var(--white); border-radius: 8px; overflow: hidden; }
.menu_fran_management { width: 100%; cursor: pointer; position: relative; padding: 14px 20px; border-bottom: 1px solid var(--line); background-color: var(--white); }
.menu_fran_box { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; border-bottom: 1px solid var(--line); padding:10px; text-align: center; }
/* .menu_fran_box { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; border-bottom: 1px solid var(--line); padding:10px; text-align: center; } */
.menu_fran_box p { font-size:16px; font-weight: 400; line-height: 1; margin-top:5px;}
.menu_fran_box_icon { width: 70px; height: 70px;  line-height: 30px; background-color: var(--white); border-radius: 13px; margin: 0 auto; padding:4px; }
.menu_fran_box_icon img { width: 100%; height:100%; object-fit: contain; }

/* PAYMENT */
/* 결제하기/받기 */
.qr_img_box { padding-top:70px; text-align: center; }
.qr_img_box > h2 { font-size: 18px; }
.qr_img { padding: 0 0 10px; }
.qr_img img { margin:0 auto; width:200px; height:200px; }
.box_height.bg_black { background: var(--pay_black); }
.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: var(--black); 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: 18px; font-weight: 500; color:var(--dark); }
.qrtab .active { background: #24272D; color:var(--white); border-radius: 8px; }
.qrtab .tab.active p { color:var(--white); }
.qrcodebox .history_viewbox { background: unset; padding:0; }
.qrcodebox { background: var(--white); border-radius: 10px; box-shadow: 0px 3px 15px rgba(0,0,0,0.6); width:calc(100% - 40px); margin:0 auto; padding:30px; }
.qrcodebox .qr_img_box { padding-top:0; }
.payment_use_txt { font-size:16px; color:var(--dark); font-weight: 500; }
.num_point_box { background: linear-gradient(to bottom right, #004271, var(--main)); border-radius: 10px; padding:20px; aspect-ratio: 2 / 1; margin:0 auto; width:100%; max-width: 250px; height: 145px; }
.num_point_box2 { background: linear-gradient(to bottom right, #bf11f8, #5f11f8); border-radius: 10px; padding:20px; aspect-ratio: 2 / 1; margin:0 auto; width:100%; max-width: 250px; height: 145px; }
.picker_product_input > input { width: 100%; height: 40px; padding: 0 20px; border-radius: 10px; font-size: 16px; font-weight: 600; text-align: right; }
.picker_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); }
.pay_card { padding-bottom: 26px !important; }
.pay_card .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom: 0px !important; }
.pay_card_name img { width: 30px; height: 30px; }
.pay_card_name p { font-size: 14px; font-weight: 500; color: var(--white); }
.qr_myamount { font-size:14px; font-weight: 500; color:var(--white); }
.change_wj { font-size:26px; font-weight: 600; word-break: break-all; }
.dan { font-size:18px; font-weight: 700; }
.none_pay { margin-top:30px; }
.qrtimerbox .timer_txt { color:var(--main); }
.underline_qr { text-decoration: underline; }
.num_point { margin-top:40px; }
.none_pay_code { background: var(--white); 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:var(--black); font-size:18px; font-weight: 700; font-family: "montserrat"; width:32%; text-align: center; }
.qrnotpay_codenumwrap { display:flex; align-items: center; justify-content: space-between; }
.paymentnumgo { display:flex; justify-content: space-between; align-items: center; }
.paymentnumgo_go { color:var(--dark); font-size:14px; }
.main_tab_container { background: unset !important; }
.fran_paymentwrap .history_viewbox { background: unset; padding:0; }
.fran_paymentwrap { width:calc(100% - 40px); margin:0 auto; background: var(--white); border-radius: 10px; }
.fran_paymentwrap .fran_pay_title { padding:30px 0; }
.input_payment .position_txt { color:var(--main); }
.fran_pay_info_txt { color:var(--white); padding:0 20px; display:flex; margin-top:20px; justify-content: center; }
.fran_pay_info_txt img { flex:none; margin-right:5px; display: block; }
.fran_pay_info_txttxt { font-size:14px; font-weight: 300; }
.payamount_confirm { background: var(--white); border-radius: 10px; width:calc(100% - 40px); margin:0 auto; padding:20px; text-align: center; }
.payamount_confirm .confirm_dan { color:var(--main); }
.payamount_confirm .seco { margin-top:15px; }
.confirm_qrscan { background: #1B2B48; margin-top:20px; }
.confirm_qrscan .scan_box { border-radius: 10px; }
.confirm_qrscan .qr_headertitle { height:auto !important }
.mypaymentamount { background: var(--white); }
.userpaymnetnum { background: var(--white); width:calc(100% - 40px); margin:20px auto 0; border-radius: 10px; padding:30px 20px; }
.userpaymnetnum .pay_code_input input { border:1px solid var(--gray); background:var(--lightgray); border-radius: 10px; height:50px; text-align: center; font-size:18px; font-weight: 700; color:var(--black); font-family: "montserrat"; width:32%; }
.userpaymnetnum .pay_code_input > input:focus { border: 1px solid var(--main); }
.userpaymnetnum .pay_code_input input::placeholder { font-size:18px; font-weight: 700; color:var(--gray); font-family: "montserrat"; }
.userpaymnetnum .user_qr_pay { overflow: visible; margin-top:10px; border-radius: 10px; }
.userpaymnetnum .user_qr_pay button { border-radius: 10px; }
.sender_finbox { border-top:2px solid var(--black); border-bottom:2px solid var(--black); }
.sender_finbox .sender_finbox { border-top:none; border-bottom:none; }
.sender_finbox .p_20 { -webkit-padding-before:20px; -webkit-padding-end:20px; -webkit-padding-after:20px; -webkit-padding-start:20px; padding:20px; }
.sender_paymentamount { background: var(--lightgray); border-top:1px solid var(--inactive); padding:20px; }
.sender_finbox .trading_day { padding:20px; }
.fran_pay_title > p { font-size: 18px; font-weight:700; text-align: center; }
.fran_pay_info_txt { font-size: 13px; font-weight: 500; text-align: center; }
.fran_pay_info_txt > p { padding-bottom:5px; }
.qr_input_payment { padding : 20px 20px 30px; }
.user_amount { position: relative;}
.position_txt {position:absolute; top:50%; right:20px; transform: translateY(-50%); font-size:16px;    font-family: "montserrat"; font-weight:700; color:var(--fran);}
/* 받기 QR */
.pay_popup_close_icon { background: transparent; position: absolute; right:20px; top: 20px; }
.main_popup_wrap { position: fixed; top:0; left:0;  width: 100%; height: 100%;  z-index: 10000;  background-color: rgba(0,0,0,0.5); }
.main_popup_wrap .pop_cont { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); max-width: 320px; min-width: 200px; width: calc(100% - 40px); border-radius: 10px; z-index: 9920; overflow: hidden; box-shadow: 0px 10px 50px rgba(0,0,0,0.4); }
.main_popup_wrap .flex_between > button.cancel_btn { background-color: var(--bg); color:var(--black); }
.main_popup_wrap .flex_between > button { border-radius: 0; }
.main_popup_wrap .pop_cont .pop_contxt { padding: 28px 24px; }
.main_popup_wrap .pop_title { font-size: 18px; font-weight: 700; padding: 0 0 20px; text-align: center; font-family: "spoqa"; word-break: break-all; }
.main_popup_wrap .none_btn_fbox { width: 100%; height: 50px; font-size: 14px; background-color: var(--white); border:1px solid var(--main);  color: var(--main); font-weight: 500; font-family: "spoqa"; border-radius: 10px; }
.main_popup_wrap .btn_fbox { width: 100%; height: 50px; font-size: 14px; background-color: var(--main); color: var(--white); font-weight: 500; font-family: "spoqa"; border-radius: 10px;  }
/* 하기 QR */
.qr_headertitle {padding:0 0 30px; font-size:16px; font-weight: 400; height:60px; color:var(--white); display: flex; justify-content: center; align-items: center; text-align: center;}
.confirm_qrscan { width:100%; background: #1B2B48; position: fixed; height:calc(100% - 204px); max-width:768px; margin:20px auto 0; }
.confirm_qrscan_ab { position: absolute; top: 45%; left: 50%; transform: translate(-50%, -50%); width:100%; }
.scan_box { width: 250px; height: 250px; background-color: rgba(255,255,255, 1); margin:5px auto; }
.payamount_confirm li:nth-child(1) { text-align: center; font-size:18px; font-weight: 700; }
.confirm_amount { font-size:20px; font-family: "montserrat"; font-weight: 700; word-break: break-all; }
.confirm_dan { font-size:18px; font-weight: 700; color:var(--main); }
.prediction_amount { font-size:14px; font-weight: 400; color:var(--dark); word-break: break-all; }
.history_viewbox { padding:0 20px; background: var(--white); 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:20px; font-weight: 700; }
.history_plus { color:var(--blue); }
.history_minus { color:#FF0000; }
.history_viewstate { min-width:30px; margin-left:20px; }
.history_viewamount { font-size:18px; font-weight: 700; margin-top:10px; }
.shistory_viewamount { font-size:14px; font-weight: 500; color:var(--dark); margin-top:14px; }
.shistory_viewamount span { font-size:12px; font-weight: 400; padding-left:10px; }
.trading_day { padding:20px 0; }
.trading_dayview { font-size:14px; font-weight: 500; display: flex; justify-content: space-between; }
.trading_dayviewx { font-size:14px; font-weight: 500; display: flex; justify-content: space-between; }
.trading_dayviewx p:nth-child(1) { color:var(--dark); flex:none; }
.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; }
.remit_info { font-size:16px; font-weight: 700; }
.fail_send_finchk { font-size:22px; font-weight: 700; padding:50px 0 30px; }
.send_finchk { font-size:22px; font-weight: 700; padding:50px 0; }

/* POINT_HISTORY */
.point_history_top > p { text-align: right; color: #89949C; }
.point_history_logo { display: block; width: 30px; height: 30px; border-radius: 50%; background-color: #d9d9d9; }
.point_history_logo img { width: 100%; height: 100%; }
.point_history_amount { padding: 20px 20px 30px; background-color: var(--lightgray); }

/* POINT HISTORY INPUTBOX */
.date_check { width: max-content; display:flex; justify-content: space-between; align-items: center; position: relative; }
.date_check > img { position: absolute; right: 10px; top: 50%; transform: translateY(-50%);}
.point_history_date_check .date_check { justify-content: flex-start; gap: 18px; }
.select_box { padding: 8px; border-radius:10px;flex: none; width: 125px; height: 36px; padding: 0 8px; border:1px solid var(--gray); outline: none; color:#212121; min-width: 100px; font-size: 14px; font-weight: 400;  font-family: "spoqa"; }
.point_history_date_check { border-bottom:1px solid var(--line); padding: 14px 20px; background:var(--white); }
.point_history_input_box { position: relative; max-width: 200px; }
.point_history_input_box input { width: 100%; border-radius: 10px; height: 36px; padding: 0 35px 0 20px; border: 1px solid var(--gray); }
.point_history_input_box input::placeholder { color: var(--gray); font-size: 14px; }
.point_history_input_box button { position: absolute; right: 10px; top: 6px; background-color: rgba(0,0,0,0); }
.point_history_input_box button img { width:100%; height:100%; }
/* POINT HISTORY DATEPICKER */
.down { transform: rotate(-180deg); }
.picker_date_check { display: flex; justify-content: flex-start; align-items: center; }
.picker_date_check > p { margin-right: 10px; }
.picker_date_check .picker_dset { position: relative; }
.picker_date_check .picker_dset input { cursor: pointer; width: 125px; text-align: center; background: var(--bg); font-size: 14px; font-weight: 500; padding: 9px 34px 9px 10px; border-radius: 10px; border:none; font-weight: 600; }
.picker_date_check .picker_demi { font-weight: 700; font-size: 14px; margin: 0 5px; }
.picker_cal { cursor: pointer; position:absolute; right: 10px; top:50%; transform: translateY(-50%); }
.now_state p { font-size:14px; font-weight: 500; cursor:pointer; margin-right:8px; }
.now_state { cursor:pointer; }
/* POINT HISTORY LIST */
.point_his_list { padding: 12px 10px 12px 20px; }
.point_his_list_none { padding: 12px 20px; }
.point_history_content .date_listtime { font-weight: 600; font-size: 16px; font-family: "montserrat"; color: var(--black); margin: 0; padding: 8px 20px 8px; border: none; background: var(--lightgray); word-break: break-all;}
.point_history_content .date_timemore { font-weight: 400; flex:none; word-break: break-all; }
.date_timemore { font-size:14px; font-weight: 500; color:var(--dark); }
.date_listmore p:nth-child(1) { 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% }
.ellipsis_170 { word-break:break-all; cursor:pointer; width:170px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sticky_header { position: sticky; top:50px; }
/* POINT HISTORY DETAILS */
.point_history_paylist { font-size: 15px; font-weight: 400; display: flex; justify-content: space-between; }
.point_history_title { display:flex; justify-content: space-between; align-items: center; }
.trading_day { padding:20px 0; }
.trading_dayview { font-size:14px; font-weight: 500; display: flex; justify-content: space-between; }
.trading_dayviewx { font-size:14px; font-weight: 500; display: flex; justify-content: space-between; }
.trading_dayviewx p:nth-child(1) { color:var(--dark); flex:none; }
.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; }
.franchisee_info { background-color: var(--lightgray); border-radius: 10px; padding:20px; margin-top:10px; }
.franchisee_info_txt { font-size:16px; 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:14px; }
.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; }
.null_box { text-align: center; padding: 20px; font-size:18px; }
.null_box img { margin: 0 auto 22px; }
/* ESCROW HISTORY DETAILS */
.btn_box { padding: 20px 0; }
.btn_box > p { text-align: center; font-size:12px; font-weight:400; padding-bottom:10px; color:var(--red); }
.point_send_info_txt, .point_send_info_txt_red { margin-top: 10px; display: flex; justify-content: flex-start; align-items: flex-start; }
.point_send_info_txt_red > p { font-size: 14px; line-height: 1.3; font-weight: 400; color:var(--red); }
.point_send_info_txt_red > p.font_16 { font-size: 16px; line-height: 1.3; font-weight: 400; color:var(--red); }

/* POPUP */
.popup_wrap {  position: fixed; top:0; left:0;  width: 100%; height: 100%;  z-index: 10000;  background-color: rgba(0,0,0,0.5); }
.popup_wrap .pop_cont { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); max-width:300px; width: 100%; border-radius: 10px; z-index: 9920; overflow: hidden; box-shadow: 0px 10px 50px rgba(0,0,0,0.4)}
.popup_wrap .pop_title { font-size:18px; font-weight: 700; padding:40px 0 30px; text-align: center; font-family: "spoqa";}

/* SETTLEMENT */
.settle_date_box { padding: 40px 20px; text-align: center; background-color: var(--lightgray); }
.settle_date_box p { font-size: 20px; 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 .picker_dset { position: relative; }
.settle_date_check .picker_dset input { cursor: pointer; width: 125px; text-align: center; background: var(--bg); font-size: 14px; font-weight: 500; padding: 9px 34px 9px 10px; border-radius: 10px; border:none; font-weight: 600; }
.settle_date_check .picker_demi { font-weight: 700; font-size: 14px; 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:16px; font-weight: 700; padding: 14px 20px; }
.settle_container > .card > ul > li { padding: 20px 0; }
.settle_container > .card > ul > li > p { font-size: 14px; font-weight: 500; }
.settle_container > .card > ul > li > div > p, .settle_container > .card > ul > li > div > span { font-family: "montserrat"; font-size: 16px; font-weight: 700; }

/* TODAY SETTLEMENT */
.today_settle_container { padding: 20px; height:100%; background-color:var(--main_sub); }
.today_settle_container .card { width:100%; background-color:var(--white); border-radius: 10px; box-shadow: 0px 3px 15px rgba(0,0,0,0.06); }
.today_settle_container .card .settle_list_title { font-size:16px; font-weight: 700; padding: 14px 20px; }
.today_settle_container > .card > ul > li { padding: 20px 0; }
.today_settle_container > .card > ul > li > p { font-size: 14px; font-weight: 500; }
.today_settle_container > .card > ul > li > div > p, .settle_container > .card > ul > li > div > span { font-family: "montserrat"; font-size: 16px; 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: 16px; font-weight: 500; color: var(--darkgray); }
.settle_tab p { width:max-content; margin:0 auto; height:calc(100% + 1px); font-size: 16px; 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; }
.day_sales_settle { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 20px 20px 10px; background: var(--white); }
/* SETTLEMENT LIST */
.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: 20px; font-weight: 700; height:50px; font-family: "montserrat"; text-align: center; background: var(--white); position: relative; width:100%; max-width:max-content; text-align: center; }
.sales_settle_month_box .month .month_img { position: absolute; top:18px; right: 3px; }
.point_escrow_info_btn { cursor: pointer; margin-top: 3px; margin-left: 5px; position: relative; }
.point_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; }
.point_settlement_title { padding: 20px 20px 10px; }
.settle_list { padding: 0 10px 0 20px; }
.settle_list > div { padding: 16px 0; width: 100%; }
.text_wait { color: #f2bd00; }
.settle_date { gap: 10px; }
.settle_date > p:first-child { width: 35px; }
.settle_status { margin-bottom: 3px; margin-left: 3px; }
.settle_mark { gap: 4px; }
/* SETTLEMENT DETAILS */
.point_settlement_date { height: 50px; padding: 0 20px; }

/* MENU */
.menu_list { width:100%; padding: 0 20px; height: calc(100% - 69px); }
.menu_list > li { position:relative; padding: 20px 0; border-bottom: 1px solid var(--line); }
.menu_list > li > div > p { font-size: 14px; width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; color: var(--dark); font-weight:400; }
.menu_txt { display:flex; justify-content:space-between; cursor:pointer; }
.menu_dot_box { position:absolute; top:50%; right: 0; transform: translateY(-50%); }
.main_box { position: relative; padding-bottom: 10px; }
.main_box p:first-child { font-size: 16px; font-weight: 500; }
.main_sub { font-size:14px; font-weight:400; }
.menu_txt { display:flex; justify-content:space-between; cursor:pointer; }
.menu_detail_list { width: calc(100% - 130px); word-break: break-all; display: flex; flex-direction: column; justify-content: space-around; align-items: flex-start; }
.menu_detail_list > p { font-size: 14px; font-weight:500; }
.menu_detail_list > p:first-child { font-size: 16px; font-weight:500; }
.menu_detail_list > p:nth-child(2) { padding: 3px 0; font-size: 14px; font-weight:400; color: var(--dark); }
.menu_detail_list.none_img { width: 100%; }
.menu_detail_list > div > p { font-size: 14px; font-weight:500; }
.menu_detail_list .mall_info_name { font-size: 16px; font-weight:700; line-height: 1.3; margin-bottom: 5px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.menu_detail_list .mall_info_sub { font-size: 13px; font-weight:500; color: var(--dark); overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.menu_detail_list .mall_info_won { font-size: 16px; font-weight:700; }
.menu_detail_box { display: flex; justify-content: space-between; padding: 20px; cursor: pointer; border-bottom:1px solid 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_add_btn { width: 90px; font-size: 14px; 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%; }
.menu_null > p { padding: 50px 20px; font-size: 16px; color: var(--black); font-weight: 700; text-align: center; }
.menu_textarea_box { width: 100%; height: 80px; padding: 10px 10px 20px 10px; border: 1px solid var(--gray); font-family: "spoqa"; font-size: 16px; font-weight: 400; resize: none; border-radius: 10px; }
.menu_textarea { width: 100%; height: 50px; border: none; font-family: "spoqa"; font-size: 16px; font-weight: 400; resize: none; }
.menu_textarea::placeholder { font-size:16px; font-weight:400; color:rgba(34,34,34,0.4); }
.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: 16px; font-weight: 400; width: 100%; padding: 10px 70px 10px 20px; }
.store_list > label > span { position: relative; }
.mail_txtLength_wrap, .txtLength_wrap{ position: absolute; top: 50%; right: 20px; transform: translateY(-50%);display: flex; flex-wrap:nowrap; -webkit-flex-wrap:nowrap; align-items: center; font-size: 12px; font-weight: 500; color: var(--dark); }
.area_textLengthWrap { position: absolute; bottom: 15px; right: 20px; 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; }
/* menu 등록 */
.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(--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: 12px; color:var(--inactive); }
/* TEXTAREA */
.edit_area_box { position: relative; width: 100%; height: 175px; padding: 20px 20px 30px; border: 1px solid var(--gray); font-family: "spoqa"; font-size: 16px; font-weight: 400; resize: none; border-radius: 10px; }
.edit_area { width: 100%; height: 120px; border: none; font-family: "spoqa"; font-size: 16px; font-weight: 400; resize: none; }
.edit_area::placeholder { font-size:16px; font-weight:400; color:rgba(34,34,34,0.4); }

/* A MALL */
.franchise_listwrap { width: 100%; height:100vh; padding: 60px 0 80px; }
.franchise_search { border:1px solid var(--gray); border-radius: 6px; margin: 10px 0; display: flex; justify-content: space-between; align-items: center; padding:10px 20px; }
.search_input_box { padding: 10px 20px 0; }
.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_input > button { width: 24px; height: 24px; background: none; position: absolute; top: 50%; right: 10px; transform: translate(-10px,-50%); cursor: pointer; }
/* search 바로 아래있는 스크롤 */
.list_slider { overflow-x:auto; display: flex; padding: 8px 20px 8px 20px; margin-bottom: 10px; width:calc(100% - 66px); }
/*스크롤바의 색상*/
.list_slider::-webkit-scrollbar-thumb { background-color: #ededed; border-radius: 20px; }
/*스크롤바 트랙 색상*/
.list_slider::-webkit-scrollbar-track { background-color: var(--white); }
/*스크롤바의 색상*/
.list_slider::-webkit-scrollbar { height:5px; }
.list_slider::-webkit-scrollbar-thumb { background-color: var(--white); border-radius: 20px; }
.list_slider:hover::-webkit-scrollbar-thumb { background: #ededed; }
/*스크롤바 트랙 색상*/
.list_slider::-webkit-scrollbar-track { background-color: var(--white); }
.list_slider li { height: 30px; line-height: 30px; padding: 0 10px; margin-right:8px; color: var(--gray); font-size:14px; white-space: nowrap; border:1px solid var(--gray); border-radius: 20px; cursor:pointer; flex:none;  }
.list_slider li.list_active { background:var(--main); color:var(--white); border:none !important; }
.mall_select_menu { height: 52px; }
.mall_select_menu > div { position:absolute; top:0; width:100%; z-index:29; }
.mall_select_menu > div > .bg_white { box-shadow:1px 3px 5px rgba(0,0,0,0.06) }
.position_rel { position: relative; }
.mall_list_container { position: relative; margin-bottom: 10px; height: 100px; box-shadow:0px 3px 15px rgba(0,0,0,0.06); }
.mall_list_container > .position_rel { background: var(--white); z-index: 49; box-shadow: 0px 3px 6px rgba(0,0,0,0.06); }
.mall_list_box { position:absolute; top:8px; right: 20px; width: 100px; height:34px; }
.mall_list_box::before { content: ''; position: absolute; top: 0; right:48px; width: 30px; height: 34px; pointer-events: none; background:linear-gradient(to left, var(--white), 70% , transparent); z-index: 30; }
.mall_list_box .right_line { position: absolute; right:46px; width:1px; height:34px; border: 1px solid var(--line); }
.mall_list_btn { position:absolute; right: 0; width:34px; height:34px; border-radius: 50%; border:1px solid var(--line); background: var(--white); display: flex; justify-content: center; align-items: center; }
.mall_list_btn.active { transform: rotate(180deg); }
.list_slider.view_active { flex-wrap: wrap; gap: 8px 0; padding: 8px 20px 10px; }
/* SELECT */
.mall_lise_select { position: relative; width: 100%; display: flex; justify-content: flex-end; align-items: center; padding: 0 20px; }
.mall_lise_select select { padding:0 20px; border: none; font-size: 13px; font-weight: 500; outline: none; color:var(--dark); font-family: "spoqa"; text-align-last: center; -ms-text-align-last: center; -moz-text-align-last: center; }
.mall_lise_select option { color: #000; }
.mall_lise_select img { position: absolute;}
/* 가맹점 리스트 */
.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: 14px; 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(--line); 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: 16px; color: var(--white); }
/* 가맹점 리스트 right */
.franchise_txt_list { position: relative; width: calc(100% - 140px); height: 120px; padding: 5px 0; }
.franchise_txt_list p { font-size: 13px; 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: 16px; font-weight: 700; }
.franchise_txt_list p:last-child { padding: 0; }
.franchise_txt_list > div > p:last-child { color:var(--dark); }
/* 가맹점 리스트 right icon */
.fran_map_tel { display: flex; position: absolute; bottom: 0; right: 0; }
/* 매장 내 슬라이드 이미지 */
.main_slider_box { position: relative; }
.main_bg .swiper-pagination-bullet-active { background:var(--main); }
.fran_mainimg.null { background-color: var(--white); 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; }
/* 매장 관리 현황에 따른 표시 영역 */
.state_mainslider_txt { position: absolute; bottom:0; left:0; right:0; margin:auto; width:calc(100% - 40px); color:var(--white); font-weight: 500; font-size:14px; 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: 20px; font-weight: 700; margin-right:10px; }
.fran_info_addr { font-size:14px; font-weight:400; word-break: break-all; color:var(--dark);}
.center_header {width: 180px; text-align:center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 원산지 표기 */
.origin_text_box { padding: 20px; word-break:break-all; }
.origin_text_box > p { font-size: 16px; font-weight: 700; padding-bottom: 10px; }
.origin_txt { font-size: 14px; 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); }
.store_line { height:4px; background:var(--line); }
/* 유의사항 */
.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:14px; }
.info_sub_notice > ul > li { padding-left: 20px; list-style:inside; text-indent: -20px; font-size:12px; }
.fri_menu_notice { padding: 20px; font-size: 14px; border-bottom:3px solid var(--line); word-break: break-all; }
/* 정보탭 */
.fri_info { padding: 0 20px; }
.fri_info > ul > li { padding: 20px 0 10px; border-bottom:1px solid var(--line); }
.fri_info > ul > li:last-child { border:none; }
.store_open_time > p, .store_open_time > div { padding: 0 0 5px; }
.company_name { font-size:16px; font-weight: 500;}
.company_detail_txt { font-size: 14px; 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; }
/* DETAIL */
.mall_detail_title { width:100%; height:100%; display:flex; justify-content: space-between; flex-direction: column; background: var(--white); }
.mall_detail_title > div:first-child > p:last-child { font-size: 20px; font-weight: 500; word-break: break-all; }
.mall_detail_info { width: 100%; height:50px; line-height: 50px; text-align: center; border-bottom: 1px solid var(--line); cursor: pointer; font-size: 16px; font-weight: 500; color: var(--main); }

/* 미리보기 */
.preview_setting { position:relative; }
.preview_setting > ul { position: absolute; top:40px; right:10px; width:130px; background:var(--white); }
.preview_setting > ul > li { font-size: 16px; 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; }

.no_data { padding: 50px 0; 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:14px; font-weight:500; text-align: center;}
.no_searchdata { font-size: 14px; }

/* 고객센터 */
.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:16px; 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:14px; font-weight: 500; color:var(--dark); font-family: "montserrat"; }
.notice_button { margin:44px 0 40px; }
.notice_null { text-align: center; padding: 20px; font-size:18px; }
.notice_open_title { padding:18px 20px; border-bottom: 1px solid var(--line); }
.notice_open_title p { font-size:16px; font-weight: 500; margin-bottom:10px; }
.notice_viewlist { background: var(--white); }
.notice_text_box { font-size:14px; padding:30px 20px 16px; font-weight: 400; }
.notice_text_box img { max-width:50%; margin:0 auto; }
.notice_check li:nth-child(1) { font-size:16px; font-weight: 500; }
.notice_check li { font-size:14px; font-weight: 400; }

/* 1:1 문의 */
.answer_box { background-color:var(--bg); font-size:14px; font-weight: 400; max-height: 0; overflow: hidden; }
.inquiry_wrap { height:auto; }
.inquiry_title { font-size:18px; 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:16px; 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: 14px; font-weight: 500; color: var(--dark); }
.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: 14px; font-weight: 500; color: var(--dark); }
.inquiry_box { position: relative; border-bottom: 1px solid var(--line); }
.inquiry_box input { font-size: 14px; font-weight: 400; width: 100%; padding: 10px 70px 10px 10px; border-radius: 10px; border: 1px solid var(--dark); font-family: "spoqa"; }
.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(--dark); }
.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(--dark); }

.inquiry_list:after, .faq_list:after { background-position: center; background-image: url("../../assets/img/icons/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/icons/icon_arrow_up.svg"); content:""; }
.inquiry_list.active .inquiry_question, .faq_list.active .faq_question { border-bottom: none; }
.inquiry_file_add .inquiry_upload_name { display: inline-block; height: 50px; padding: 0 10px; vertical-align: middle; border: 1px solid var(--dark); width: 100%; color:var(--black); border-radius: 10px; }
.inquiry_file_add label { position: relative; width: 100%; height: 100%; color: var(--main); border:1px solid var(--main); vertical-align: middle; cursor: pointer; height: 50px; line-height: 50px; border-radius: 10px; text-align: center; font-size: 14px; }
.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%); }

/* 매장관리 - 기본정보 */
.store_infor_title { font-size:22px; padding:20px; font-weight: 700; border-bottom:1px solid var(--line); }
.store_title { font-size:16px; font-weight: 700; }
.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(--inactive); width: 100%; font-size: 14px;}
.business_hours_wrap { margin:20px; }
.business_hours { position:relative; border:1px solid var(--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:12pxm; font-weight: 400; }
.btn_state { display:block; outline: none; margin:0; background:#fff; border:1px solid var(--inactive); border-radius: 18px; min-height:35px; font-size:14px; font-weight: 500; width:100%; color:var(--inactive); font-family: "spoqa"; padding:0; }
.businessstatus_btn input {     -webkit-appearance: none; }
.businessstatus_btn input[type="radio"]:checked { background:var(--main); color:#fff; border:none;  }
.businessstatus_btn input[type="radio"]:checked + span { color:#fff; }
/* storeImage */
.store_img_box { padding: 20px 20px 20px; border-bottom: 4px solid var(--line); }
.store_img_box > p { font-size: 14px; padding-bottom: 15px; }
.store_img_box > p:nth-child(2) { font-size:12px; color:var(--gray); }
.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; border:1px solid var(--line);}
.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: 14px; font-weight: 700; border-radius: 10px; background: var(--main); padding: 0 10px; }
.store_list_box { padding: 20px 0; margin:0 20px; border-bottom:1px solid var(--line); word-break: break-all; }
.store_sub { font-size: 16px; font-weight: 700; margin-bottom: 6px; }
.store_list_box span { font-size: 14px; font-weight: 400; }
.store_list_box span.medium { font-weight: 500; }
.parking_btn { display: none; font-size:14px; margin-right:15px; width: 94px; height: 35px; line-height: 35px; text-align: center; border:1px solid var(--gray); border-radius: 18px; color: var(--gray); }
.parking_btn.active { display: block; background: var(--main); color: #ffffff; border: none; }
.store_container { overflow: auto; padding-bottom: 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(--main); border-radius: 20px; }
/*스크롤바 트랙 색상*/
.store_container::-webkit-scrollbar-track { background-color: transparent; transition: 10s; }

.store_time { width: 170px; }
.store_time .store_time_txt { margin:10px 0; font-size: 14px; }
.store_time .store_time_txt:last-child { margin: 10px 0  0; }

/* 운영정보 */
.join_state { display: flex; justify-content: space-around; align-items: center; margin-bottom:14px; }
.join_obj input[type="checkbox"] { display: none; }
.join_obj input[type="checkbox"] + span { display: flex; justify-content: center; align-items: center; color: var(--gray); border-radius: 50%; border:1px solid var(--gray); cursor: pointer; width:34px; height:34px; font-size:14px; font-weight: 400; }
.join_obj input[type="checkbox"]:checked + span { color: #fff; background: var(--main); border:none; }
.hours_time { border:1px solid var(--gray); border-radius: 10px; width:100%; padding:8px; font-size:14px; text-align: center; }
.hours_box { width:100%; }
/* 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(--gray); 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); }
.hour_switch_check:checked+.switch_label .onf_btn { left: 26px; top: 2px; }
.hour_switch_check:checked+.switch_label { background: var(--main); }
.time_rest > p { margin-top:10px; font-size:12px; font-weight: 500; }

.buzi_txt { font-size:12px; color:var(--main); font-weight: 500; margin-left:4px; }
.plus_buzi img { display: block; width: 13px; height: 13px; }
.operation_info { padding: 20px; list-style-type: disc; border-top:1px solid var(--line); }
.operation_info > li { font-size: 14px; color: var(--darkgray); list-style-type: disc; }
/* 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: 14px !important; }
.ui-widget.ui-widget-content { border:none !important; }
/* 삭제버튼 */
.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); }
.store_addr li { padding: 5px 0; }
.store_addr li:last-child { padding: 5px 0 0; }

/* store_image_create */
.rep_container { padding: 20px; }
.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(--gray); } */
.rep_img_box { position: relative; width: 75%; height: 0; padding-top: 56%; margin: 0 auto; overflow: hidden; border-radius: 10px; border: 1px dashed var(--gray);}
.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(--gray); }
.img_add_box > label { cursor: pointer ;}
.detail_img > li.null_img img { object-fit: contain; padding:10px 0;}


.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/icons/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; }

/* mypage */
.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; }
.list_box { padding: 10px 0 5px; background:var(--white); }
.list_box.border_none { border:none; }
.box_title { font-size:14px; font-weight: 500; color:var(--main); padding: 5px 20px; }
.box_goto { font-size:16px; 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; }
.myuser_box { margin-top:10px; font-weight: 500; font-size:16px; word-break: break-all; display: flex; width:100%; justify-content: space-between; word-break: keep-all; }
.myuser_box > p:last-child { text-align:right; }

/* 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; }

@keyframes spin {
 0% { transform:rotate(0deg); }
 100% { transform:rotate(360deg); }
 }
 .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:0; 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; }
 .splash2 { position: relative; width: 100vw; height: 100vh; background-color: var(--white); }
 .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; }

 /* 가맹점 리스트 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); }

/*정산일자 팝업*/
.edit_popup { position:fixed; background-color: rgba(0, 0, 0,0.5); z-index:1042; width: 100%; height: 100vh;}
.edit_popup .card { margin: 0; padding:0; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: calc(100% - 40px); max-width: 700px;  height: auto; border: 1px solid var(--line) ;
background: var(--white); border-radius: 10px; }
.date_title {border-bottom: 1px solid #d9d9d9; font-size: 18px; font-weight: 700; padding: 14px; text-align: center;}
.popup_content {padding:20px;}
.date_choice {display: grid; grid-template-columns: repeat(4,1fr); grid-row-gap: 10px; grid-column-gap: 10px; max-height: 400px; overflow-x: auto;}
.date_choice li {background: #959494; color:var(--white); font-size:16px; width:100%; border-radius: 4px; text-align: left; cursor:pointer;}
.date_choice input{display:none;}
.date_choice .checkbox {display: flex; align-items: center; cursor:pointer;  padding:6px 10px;}
.date_choice .icon{display:block; width:18px; height:18px; border: 2px solid #fff; border-radius: 4px; cursor:pointer; position:relative;  flex:none;}
.cancel_date {background: #a5a2a2;}
.save_btn {display: flex; align-items: center; gap:10px; width:100%; margin-top:20px;}
.save_btn button {width:100%; height:40px;}
.overhidden { overflow: hidden;}
.settlement_box {width: 100%; padding: 12px 25px; min-height: 50px; cursor:pointer;  display: block; border: solid 1px var(--gray); border-radius: 10px; font-size: 16px;
font-weight: 500; font-family: "spoqa";  background-color: var(--disabled); color: black !important; display: flex; align-items: center;}






/* 반응형 설정 */




@media all and ( max-height:680px ){
  .qr_headertitle { font-size: 14px; }
  .scan_box { width: 180px; height: 180px; background-color: rgba(255,255,255, 1);}
  .qr_headertitle { padding: 0 0 10px; }
  .none_qr { padding: 0 !important; }
}

@media screen and (max-width:700px){
  .date_choice { grid-template-columns: repeat(3, 1fr);}
}

@media screen and (max-width:600px){
  /* main franchise icon */
  .menu_fran_box_icon { width: 60px; height: 60px; line-height: 60px; background-color: var(--white); border-radius: 13px; margin: 0 auto; }
  .menu_fran_box p, .menu_fran_box p { font-size: 14px; }
  /* main user icon */
  .fran_icon_container > li > a { padding: 0; display:block; }
  .fran_icon_container > li > a > p { font-size:14px; font-weight: 300; margin-top:5px; }
  .user_menu_icon { width: 60px; height: 60px; padding:4px; line-height:60px; border-radius:13px; margin:0 auto; }
  .user_menu_icon img { width:100%; height:100%; object-fit: cover;}
}




@media screen and (max-width:550px){
  .date_choice { grid-template-columns: repeat(2, 1fr); grid-column-gap:6px; }
}


@media screen and (max-width:450px){
  /* main franchise icon */
  .menu_fran_box_icon { width: 48px; height: 48px; line-height: 48px; background-color: var(--white); border-radius: 13px; margin: 0 auto; }
  .menu_fran_box p, .menu_fran_box p { font-size: 12px; font-weight: 300;}
  /* main user icon */
  .fran_icon_container > li > a { padding: 0; display:block; }
  .fran_icon_container > li > a > p { font-size:12px; font-weight: 300; margin-top:5px; }
  .user_menu_icon { width: 48px; height: 48px; padding:4px; line-height:48px; border-radius:13px; margin:0 auto; }
  .user_menu_icon img { width:100%; height:100%; object-fit: cover;}
}

@media screen and (max-width:400px){
 .picker_date_check_box { width:100%; height:50px; }
 .picker_date_check { display: flex; justify-content: center; align-items: center; }
 .date_choice { grid-template-columns: repeat(2, 1fr);
 }

 @media screen and (max-width: 370px){
   .point_history_date_check .date_check { flex-direction: column; align-items: flex-start; gap:10px; }
   .point_history_input_box { width: 100%; max-width: 100%; }
   .point_history_box .picker_date_check { align-items: center; gap: 10px; }
   .point_history_box .picker_date_check div:last-child { align-self: flex-end; }
   .date_choice { grid-template-columns: repeat(1, 1fr);}
 }

 @media screen and (max-width:360px) { /* gift */
 .picker_box > p { font-size: 10px; margin-top: 5px; }
 .picker_icon { width: 54px; height: 54px; line-height:48px; border: 1px solid var(--line); border-radius:13px; margin:0 auto; }
 .picker_icon img { width:100%; height:100%; object-fit: cover; }
 .picker_info_b > p, .picker_info_c > p, .picker_info_s > p { margin-left:10px; font-size: 18px; font-weight: 500; }
 .giftbox_top_count > p { margin-left:10px; font-size: 16px; font-weight: 400; }
 .guide_tab { font-size: 14px; }

 .qrnotpay_codenum { font-size:14px; }

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

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

  .point_escrow_info_btn { position: static; }
 .point_escrow_info_desc {top: 180px;width: calc(100% - 40px);left: 50%;transform: translateX(-50%);}
  }

 @media screen and (max-width:310px){
  .giftbox_comp_box { padding:30px 20px; }
  .gift_date_check > div:first-of-type { flex-direction: column; }
  .point_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-width:300px){
  /* main franchise icon */
  .menu_fran_box_icon { width: 40px; height: 40px; line-height: 40px; background-color: var(--lightgray); border: 1px solid var(--line); border-radius: 13px; margin: 0 auto; }
  .menu_fran_box p, .menu_fran_box p { font-size: 10px; }
  /* main user */
  .fran_icon_container > li > a > p { font-size: 10px; }
  .user_menu_icon { width: 35px; height: 35px; padding:4px; line-height:35px; border-radius:13px; margin:0 auto; }
  .user_menu_icon img { width:100%; height:100%; object-fit: cover;}
}